/**
 * 登录 / 注册 / 找回密码 —— 整页表单版视觉（弹窗版见 React 的 AuthModal.jsx）。
 *
 * 这份文件之前用的是旧版设计系统的变量名（--wpnav-card-bg / --wpnav-border-color /
 * --wpnav-text-color 等），但新版设计系统（wpnav-react-app/src/styles/tokens.css）早就
 * 换成了另一套变量名（--wpnav-surface / --wpnav-border / --wpnav-text 等），旧变量名
 * 全部是"未定义"，浏览器直接摆烂成默认样式——这就是之前登录/注册页面看起来很old的原因。
 * 这里改用当前实际生效的设计变量重写，跟首页/详情页保持统一的深色玻璃拟态风格。
 *
 * 这个页面通常是主流量之外的场景（未开JS/爬虫/直接分享的固定链接），弹窗才是主入口，
 * 所以样式做到"跟站点整体气质一致、能正常使用"就够，不用堆太多交互细节。
 */
.wpnav-account-form {
    max-width: 400px;
    margin: 40px auto;
    background: var(--wpnav-bg-elevated, #12141f);
    border: 1px solid var(--wpnav-border, rgba(255,255,255,.08));
    border-radius: var(--wpnav-radius-lg, 24px);
    padding: 34px 32px;
    box-shadow: var(--wpnav-shadow-card, 0 4px 24px rgba(0,0,0,.35));
    color: var(--wpnav-text, #ebebeb);
}
.wpnav-account-form .wpnav-field { margin-bottom: 18px; }
.wpnav-account-form .wpnav-field label {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    margin-bottom: 7px;
    color: var(--wpnav-text-dim, #9e9e9e);
}
.wpnav-account-form .wpnav-field-inline label {
    font-weight: normal;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--wpnav-text-dim, #9e9e9e);
}
.wpnav-account-form input[type="text"],
.wpnav-account-form input[type="email"],
.wpnav-account-form input[type="password"] {
    width: 100%;
    padding: 11px 14px;
    background: var(--wpnav-surface, rgba(255,255,255,.04));
    border: 1px solid var(--wpnav-border, rgba(255,255,255,.08));
    border-radius: var(--wpnav-radius-sm, 10px);
    color: var(--wpnav-text, #ebebeb);
    font-size: 14px;
    box-sizing: border-box;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.wpnav-account-form input:focus {
    outline: none;
    border-color: var(--wpnav-accent-a, #7c5cff);
    box-shadow: 0 0 0 3px rgba(124,92,255,.15);
}
.wpnav-account-form .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px 18px;
    border: 1px solid var(--wpnav-glass-border, rgba(255,255,255,.2));
    border-radius: var(--wpnav-radius-pill, 999px);
    background: var(--wpnav-glass-bg, rgba(255,255,255,.08));
    backdrop-filter: var(--wpnav-glass-blur, blur(16px) saturate(180%));
    -webkit-backdrop-filter: var(--wpnav-glass-blur, blur(16px) saturate(180%));
    box-shadow: var(--wpnav-glass-highlight, inset 0 1px 0 rgba(255,255,255,.28));
    color: var(--wpnav-text, #ebebeb);
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all .16s ease;
}
.wpnav-account-form .button:hover { transform: scale(1.02); background: var(--wpnav-glass-bg-hover, rgba(255,255,255,.14)); border-color: var(--wpnav-glass-border-hover, rgba(255,255,255,.4)); }

.wpnav-account-error {
    background: rgba(239,68,68,.12);
    border: 1px solid rgba(239,68,68,.25);
    color: #f87171;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    margin-bottom: 16px;
}
.wpnav-account-success {
    background: rgba(34,197,94,.12);
    border: 1px solid rgba(34,197,94,.25);
    color: #4ade80;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    margin-bottom: 16px;
}
.wpnav-account-notice {
    max-width: 400px;
    margin: 40px auto;
    padding: 20px 24px;
    background: var(--wpnav-surface, rgba(255,255,255,.04));
    border: 1px solid var(--wpnav-border, rgba(255,255,255,.08));
    border-radius: var(--wpnav-radius-md, 16px);
    color: var(--wpnav-text, #ebebeb);
    text-align: center;
}
.wpnav-account-notice a { color: var(--wpnav-accent-a, #7c5cff); font-weight: 600; }