/* 认证入口样式：沿用用户中心/后台的工作台色板，保持登录与业务页面视觉一致。 */
:root { --auth-ink:#172033; --auth-muted:#718096; --auth-line:#e7ebf2; --auth-canvas:#f5f7fb; --auth-blue:#2f6fed; --auth-blue-soft:#edf4ff; --auth-green:#16966b; --auth-red:#d95555; }
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body.auth-page { min-height:100vh; color:var(--auth-ink); background:var(--auth-canvas); font:14px/1.55 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif; }
button,input { font:inherit; } a { color:inherit; }
.auth-shell { display:grid; grid-template-columns:minmax(300px,37%) minmax(0,1fr); min-height:100vh; }
.auth-rail { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-height:100vh; overflow:hidden; padding:30px clamp(26px,5vw,72px); color:#d9e4f4; background:#182337; }
.auth-rail:after { position:absolute; right:-100px; bottom:12%; width:310px; height:310px; border:1px solid rgba(110,157,232,.22); border-radius:50%; box-shadow:0 0 0 32px rgba(110,157,232,.035),0 0 0 64px rgba(110,157,232,.025); content:""; }
.auth-brand,.mobile-brand { display:flex; align-items:center; gap:10px; width:max-content; text-decoration:none; }
.auth-brand { position:relative; z-index:1; color:#fff; }
.auth-brand strong,.auth-brand small { display:block; }.auth-brand strong { font-size:15px; }.auth-brand small { margin-top:2px; color:#8596b0; font-size:9px; letter-spacing:.13em; }
.brand-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:8px; color:#fff; background:var(--auth-blue); font-size:18px; font-weight:800; box-shadow:0 7px 16px rgba(47,111,237,.2); }
.rail-copy { position:relative; z-index:1; max-width:365px; margin:auto 0; }.rail-kicker,.auth-kicker { color:#6e9bea; font-size:10px; font-weight:800; letter-spacing:.14em; }.rail-copy h2 { margin:15px 0 13px; color:#f4f7fc; font-size:clamp(30px,4vw,50px); line-height:1.08; letter-spacing:-.04em; }.rail-copy p { max-width:320px; margin:0; color:#91a1ba; line-height:1.8; }
.rail-status { position:relative; z-index:1; display:flex; align-items:center; gap:9px; max-width:330px; padding-top:18px; border-top:1px solid rgba(211,225,247,.13); color:#9eafc7; font-size:11px; }.rail-status b { margin-left:auto; color:#6e9bea; font-size:9px; letter-spacing:.14em; }.status-dot { width:7px; height:7px; border-radius:50%; background:#4ac891; box-shadow:0 0 0 4px rgba(74,200,145,.12); }.rail-foot { position:relative; z-index:1; margin:25px 0 0; color:#657895; font:9px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.08em; }.rail-steps { position:relative; z-index:1; display:grid; gap:13px; max-width:250px; padding-top:18px; border-top:1px solid rgba(211,225,247,.13); }.rail-steps div { display:flex; gap:12px; color:#647894; font-size:12px; }.rail-steps b { color:#617490; font:700 10px ui-monospace,monospace; }.rail-steps .active,.rail-steps .active b { color:#8eb4f5; }.rail-note { position:relative; z-index:1; display:flex; align-items:center; gap:12px; padding:16px 0; border-top:1px solid rgba(211,225,247,.13); border-bottom:1px solid rgba(211,225,247,.13); color:#9eafc7; font-size:11px; }.rail-note b { color:#8eb4f5; font:700 16px ui-monospace,monospace; }
.auth-content { display:flex; align-items:center; justify-content:center; min-width:0; padding:40px clamp(20px,7vw,100px); background:#fff; }.auth-card { width:min(100%,470px); }.auth-card-wide { width:min(100%,650px); }.auth-card-narrow { width:min(100%,480px); }.mobile-brand { display:none; color:var(--auth-ink); font-weight:700; }.auth-heading { margin-bottom:26px; }.auth-heading h1 { margin:8px 0 6px; color:var(--auth-ink); font-size:36px; line-height:1.1; letter-spacing:-.04em; }.auth-heading p { color:var(--auth-muted); font-size:13px; }
.auth-alert { display:flex; align-items:flex-start; gap:9px; margin-bottom:18px; padding:11px 12px; border:1px solid #f2cccc; border-radius:7px; color:#b04444; background:#fff6f6; font-size:12px; }.auth-alert.success { border-color:#c7eadb; color:#167a58; background:#f0fbf6; }.auth-alert b { display:grid; flex:none; place-items:center; width:17px; height:17px; border-radius:50%; color:#fff; background:var(--auth-red); font-size:10px; }.auth-alert.success b { background:var(--auth-green); }
.auth-form { display:flex; flex-direction:column; gap:15px; }.auth-field { display:block; min-width:0; }.auth-field>span { display:block; margin-bottom:6px; color:#58667a; font-size:12px; font-weight:650; }.auth-field small { margin-left:4px; color:var(--auth-muted); font-weight:400; }.auth-input { width:100%; height:40px; padding:0 11px; border:1px solid #dce2eb; border-radius:6px; outline:0; color:#334157; background:#fff; transition:border-color .15s,box-shadow .15s; }.auth-input::placeholder { color:#a4afbd; }.auth-input:focus { border-color:#94b5f1; box-shadow:0 0 0 3px var(--auth-blue-soft); }.auth-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.auth-submit { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:41px; padding:0 13px 0 15px; border:1px solid transparent; border-radius:6px; color:#fff; background:var(--auth-blue); box-shadow:0 4px 10px rgba(47,111,237,.16); font-weight:650; cursor:pointer; transition:background .15s,transform .15s; }.auth-submit:hover { background:#245fd4; transform:translateY(-1px); }.auth-submit b { color:#d9e7ff; font-size:19px; font-weight:400; }.auth-submit.secondary { color:#315eae; border-color:#cddcf7; background:var(--auth-blue-soft); box-shadow:none; }.auth-submit.secondary:hover { background:#e3edff; }.auth-submit:focus-visible,.auth-links a:focus-visible,.auth-check input:focus-visible { outline:3px solid #c8dcff; outline-offset:3px; }.auth-links { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:18px; font-size:12px; }.auth-links a { color:#356bc8; text-decoration:none; }.auth-links a:hover { text-decoration:underline; }.auth-note { margin:24px 0 0; color:#9aa6b5; font-size:11px; }.auth-check { display:flex; align-items:flex-start; gap:8px; color:#718096; font-size:11px; }.auth-check input { margin-top:3px; accent-color:var(--auth-blue); }.auth-check a { color:#356bc8; text-decoration:none; }
.auth-submit.is-loading { justify-content:center; gap:8px; cursor:wait; }
.auth-submit .button-spinner { display:inline-block; width:13px; height:13px; flex:0 0 13px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:auth-spin .7s linear infinite; }
@keyframes auth-spin { to { transform:rotate(360deg); } }

/* 认证页没有加载工作台的公共样式，这里独立定义提交进度和结果提示层。
 * 两者都脱离文档流，避免 AJAX 动态插入的 div 直接掉到页面右下角。 */
.auth-page .page-loading-indicator {
    position:fixed;
    top:18px;
    left:50%;
    z-index:1100;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:34px;
    max-width:calc(100vw - 32px);
    padding:0 15px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:999px;
    color:#fff;
    background:#1b2a42;
    box-shadow:0 10px 28px rgba(24,35,55,.2);
    font-size:12px;
    line-height:1;
    opacity:0;
    pointer-events:none;
    transform:translate(-50%,-12px);
    transition:opacity .18s ease,transform .18s ease;
}
.auth-page .page-loading-indicator.show { opacity:1; transform:translate(-50%,0); }
.auth-page .page-loading-indicator .button-spinner { width:13px; height:13px; flex:0 0 13px; }
.auth-page .toast {
    position:fixed;
    top:20px;
    right:22px;
    z-index:1200;
    display:flex;
    align-items:flex-start;
    gap:10px;
    width:min(360px,calc(100vw - 44px));
    min-height:44px;
    padding:12px 14px;
    overflow-wrap:anywhere;
    border:1px solid #d9e4f0;
    border-radius:9px;
    color:#33445d;
    background:rgba(255,255,255,.98);
    box-shadow:0 16px 40px rgba(24,35,55,.16);
    font-size:12px;
    line-height:1.55;
    opacity:0;
    pointer-events:none;
    transform:translateY(-10px);
    transition:opacity .18s ease,transform .18s ease;
}
.auth-page .toast:before {
    display:grid;
    flex:0 0 18px;
    place-items:center;
    width:18px;
    height:18px;
    margin-top:1px;
    border-radius:50%;
    color:#fff;
    background:#16966b;
    content:"✓";
    font-size:11px;
    font-weight:800;
}
.auth-page .toast.is-error { border-color:#f0d0d0; color:#a74444; background:#fffafa; }
.auth-page .toast.is-error:before { background:#d95555; content:"!"; }
.auth-page .toast.show { opacity:1; transform:translateY(0); }

.register-surface { padding:20px; border:1px solid var(--auth-line); border-radius:9px; background:#fbfcfe; }
.register-surface .auth-form { gap:14px; }
.register-divider { height:1px; margin:20px 0; background:var(--auth-line); }
.captcha-box { padding:11px; border:1px solid #d5e2f8; border-radius:7px; background:#f8fbff; }.captcha-title { display:flex; justify-content:space-between; gap:8px; margin-bottom:7px; color:#53627a; font-size:11px; font-weight:650; }.captcha-title small { color:#8998ad; font-size:10px; font-weight:400; }.captcha-mount { display:block; width:100%; min-height:46px; }.captcha-mount:empty { border:1px dashed #cbd8ee; background:#fff; }.captcha-message { min-height:16px; margin:4px 0 0; color:#8998ad; font-size:10px; }.captcha-message.error { color:#c04d4d; }.captcha-message.success { color:#188462; }.info-box { display:flex; gap:10px; margin-bottom:18px; padding:12px; border:1px solid #dbe7fb; border-radius:7px; background:#f7faff; }.info-box>span { color:var(--auth-blue); font-size:18px; }.info-box p { margin:0; color:#6d7f9d; font-size:11px; line-height:1.7; }.empty-state { padding:23px 0 4px; border-top:1px solid var(--auth-line); }.empty-state strong { font-size:15px; }.empty-state p { margin:6px 0 18px; color:var(--auth-muted); font-size:12px; }.link-button { text-decoration:none; }
@media (max-width:820px) { .auth-shell { grid-template-columns:1fr; }.auth-rail { min-height:0; padding:22px 24px 25px; }.rail-copy { margin:48px 0 25px; }.rail-copy h2 { font-size:34px; }.rail-status,.rail-steps,.rail-note { display:none; }.rail-foot { margin-top:0; }.auth-content { align-items:flex-start; padding:42px 24px 55px; }.auth-card,.auth-card-wide,.auth-card-narrow { width:min(100%,650px); } }
@media (max-width:520px) { .auth-rail { padding:18px 18px 20px; }.rail-copy { margin:38px 0 22px; }.rail-copy h2 { font-size:30px; }.auth-content { padding:30px 18px 45px; }.mobile-brand { display:flex; margin-bottom:28px; }.mobile-brand .brand-mark { width:29px; height:29px; font-size:15px; }.auth-heading h1 { font-size:32px; }.auth-grid { grid-template-columns:1fr; gap:15px; }.auth-links { gap:10px 15px; }.auth-submit { min-height:43px; } }
@media (prefers-reduced-motion:reduce) { .auth-input,.auth-submit { transition:none; } }

/* 注册页采用单一连续工作区；分组只用细线表达，不再叠加卡片和占位框。 */
.register-page .auth-content { align-items:flex-start; }
.register-page .register-card { width:min(100%,560px); margin:clamp(30px,8vh,76px) 0; }
.register-flow { margin-top:4px; }
.register-flow-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:22px; padding-bottom:13px; border-bottom:1px solid var(--auth-line); }
.register-flow-head h2 { margin:5px 0 0; color:var(--auth-ink); font-size:17px; letter-spacing:-.02em; }
.register-flow-note { padding-bottom:2px; color:#9aa6b5; font-size:11px; white-space:nowrap; }
.register-code-form,.register-submit-form { gap:14px; }
.register-account-form { margin-top:25px; padding-top:25px; border-top:1px solid var(--auth-line); }
.register-send-button { margin-top:1px; }
.captcha-block { padding:0; border:0; background:transparent; }
.captcha-caption { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; color:#55647a; font-size:11px; font-weight:650; }
.captcha-caption span { display:flex; align-items:center; gap:7px; }
.captcha-caption span:before { width:6px; height:6px; border-radius:50%; background:#6e9bea; content:""; }
.captcha-caption small { color:#9aa6b5; font-size:10px; font-weight:400; }
.captcha-mount { min-height:0; border:0; background:transparent; }
.captcha-mount:empty { min-height:44px; border:1px solid #e2e7ef; border-radius:6px; background:#fafbfd; }
.captcha-message { margin-top:4px; }
.register-consent { display:grid; gap:7px; padding-top:1px; }
.register-page .auth-submit { min-height:44px; }
/* 所有认证页共用轻量极验容器；不覆盖 SDK 内部 DOM 的颜色和结构。 */
.captcha-box { padding:0; border:0; background:transparent; }
.captcha-box .captcha-title { margin-bottom:8px; color:#55647a; font-size:11px; }
.captcha-box .captcha-title span { display:flex; align-items:center; gap:7px; }
.captcha-box .captcha-title span:before { width:6px; height:6px; border-radius:50%; background:#6e9bea; content:""; }
.captcha-box .captcha-title small { color:#9aa6b5; font-size:10px; }
.captcha-box .captcha-mount { min-height:0; border:0; background:transparent; }
.captcha-box .captcha-mount:empty { min-height:44px; border:1px solid #e2e7ef; border-radius:6px; background:#fafbfd; }
.auth-page .captcha-box,.auth-page .captcha-block { display:none; }
.captcha-modal[hidden] { display:none; }
.captcha-modal { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:20px; }
.captcha-modal-backdrop { position:absolute; inset:0; background:rgba(19,31,51,.54); backdrop-filter:blur(3px); }
.captcha-modal-dialog { position:relative; z-index:1; width:min(100%,430px); padding:28px 28px 24px; border:1px solid #e6ebf3; border-radius:12px; color:var(--auth-ink); background:#fff; box-shadow:0 22px 70px rgba(24,35,55,.24); }
.captcha-modal-close { position:absolute; top:12px; right:14px; width:30px; height:30px; padding:0; border:0; border-radius:50%; color:#78869a; background:transparent; font-size:23px; line-height:30px; cursor:pointer; }
.captcha-modal-close:hover { color:var(--auth-ink); background:#f1f4f8; }
.captcha-modal-kicker { color:var(--auth-blue); font-size:10px; font-weight:800; letter-spacing:.14em; }
.captcha-modal-dialog h2 { margin:8px 0 5px; font-size:22px; letter-spacing:-.02em; }
.captcha-modal-description { margin:0 0 19px; color:var(--auth-muted); font-size:12px; }
.captcha-modal-mount { width:100%; min-height:48px; }
.captcha-modal-message { min-height:18px; margin:9px 0 0; color:#8998ad; font-size:11px; }
.captcha-modal-message.error { color:#c04d4d; }
.captcha-modal-message.success { color:#188462; }
body.captcha-modal-open { overflow:hidden; }
@media (max-width:520px) {
    .register-page .register-card { margin:0; }
    .register-flow-head { align-items:flex-start; flex-direction:column; gap:2px; }
    .register-flow-note { padding:0; }
    .captcha-modal-dialog { padding:24px 18px 20px; }
    .auth-page .toast { top:14px; right:14px; width:calc(100vw - 28px); }
    .auth-page .page-loading-indicator { top:14px; max-width:calc(100vw - 28px); }
}