:root { color-scheme:light; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#282e3e; background:#f1f4f8; font-size:15px; }
* { box-sizing:border-box; letter-spacing:0; }
body.auth-page { margin:0; min-height:100dvh; display:flex; flex-direction:column; --accent:#087fc1; --accent-hover:#056da7; --focus:#c3e6fa; --muted:#626b7c; --line:#d4dae3; --symbol:#078bd0; --symbol-bg:#e3f4ff; }
.auth-page a { color:var(--accent); text-decoration:none; }
.auth-page a:hover { color:var(--accent-hover); text-decoration:underline; }
.auth-page button,.auth-page input { font:inherit; }
.auth-page button { cursor:pointer; }
.auth-page :is(a,button,input):focus-visible { outline:3px solid #4bb1ed; outline-offset:3px; }
.auth-page [hidden] { display:none!important; }
.auth-page p { margin:0; }
.auth-page .auth-topbar { min-height:72px; flex:none; display:flex; align-items:center; justify-content:space-between; padding:12px 40px; gap:20px; background:#252b40; border-bottom:1px solid #363e58; }
.auth-page .auth-brand { display:flex; flex:none; align-items:center; min-height:44px; }
.auth-page .auth-brand img { object-fit:contain; width:120px; height:38px; filter:brightness(0) invert(1); }
.auth-page .auth-topbar nav { display:flex; align-items:center; gap:20px; font-size:14px; }
.auth-page .auth-topbar nav>span { color:#c7ccda; }
.auth-page .auth-topbar nav>a { display:flex; align-items:center; gap:12px; color:#fff; font-weight:600; min-height:44px; }
.auth-page .auth-topbar nav>a i { color:#50bff3; font-size:13px; }
.auth-page .auth-main { flex:1; width:100%; display:flex; justify-content:center; align-items:center; padding:40px 24px; }
.auth-page .auth-content { position:relative; width:100%; max-width:516px; padding:32px 36px 0; background:#fff; border:1px solid #d7dfe9; border-radius:8px; box-shadow:0 18px 44px -22px #252b4040,0 3px 8px #252b4008; }
.auth-page .auth-content::before { content:""; position:absolute; top:-1px; left:-1px; right:-1px; height:4px; border-radius:8px 8px 0 0; background:linear-gradient(90deg,#0987d0 0 55%,#23a38a 55% 72%,#edb345 72% 86%,#d86582 86%); }
.auth-page .auth-symbol { float:right; width:48px; height:48px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--symbol) 16%,transparent); border-radius:8px; color:var(--symbol); background:var(--symbol-bg); box-shadow:0 2px 3px #252b4008; font-size:21px; margin:0 0 12px 16px; }
.auth-page .auth-heading { display:flow-root; margin-bottom:28px; }
.auth-page .auth-heading .workspace-name { display:block; color:var(--muted); font-size:13px; line-height:1.5; font-weight:600; margin-bottom:7px; }
.auth-page .auth-heading h1 { color:#262d3e; font-size:30px; font-weight:750; line-height:1.25; margin:0 0 10px; }
.auth-page .auth-heading>p { color:var(--muted); font-size:15px; line-height:1.6; }
.auth-page .auth-field { margin-bottom:20px; min-width:0; }
.auth-page .auth-field>label { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:8px; font-size:14px; font-weight:600; color:#343b4c; }
.auth-page .auth-optional { font-size:12px; color:var(--muted); font-weight:400; }
.auth-page .auth-input-wrap { position:relative; }
.auth-page .auth-input-wrap input { width:100%; height:50px; border:1px solid #b9c5d4; border-radius:6px; background:#fafbfd; color:#252b39; padding:0 14px; font-size:16px; transition:border-color .15s,box-shadow .15s; min-width:0; }
.auth-page .auth-input-wrap input:hover { border-color:#939fb1; }
.auth-page .auth-input-wrap input:focus { outline:none; background:#fff; border-color:var(--accent); box-shadow:0 0 0 3px var(--focus); }
.auth-page .auth-input-wrap input[data-password] { padding-right:50px; }
.auth-page .auth-password-toggle { position:absolute; right:3px; top:3px; width:44px; height:44px; padding:0; border:0; background:transparent; color:var(--muted); border-radius:4px; display:grid; place-items:center; font-size:18px; }
.auth-page .auth-password-toggle:hover { color:var(--accent); background:#edf6fc; }
.auth-page .auth-hint,.auth-page .auth-field-error { display:block; font-size:12px; line-height:1.5; margin-top:6px; }
.auth-page .auth-hint { color:var(--muted); }
.auth-page .auth-hint:empty,.auth-page .auth-field-error:empty { display:none; }
.auth-page .auth-field-error { color:#ba2947; }
.auth-page .has-error input { border-color:#d74662; }
.auth-page .auth-field-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.auth-page .auth-form-options { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin:4px 0 24px; font-size:13px; }
.auth-page .auth-form-options>a { font-weight:600; }
.auth-page .auth-checkbox { display:flex; align-items:flex-start; gap:10px; color:#4e586b; cursor:pointer; font-size:13px; line-height:1.55; }
.auth-page .auth-checkbox input { margin:2px 0 0; accent-color:var(--accent); width:17px; height:17px; flex:none; }
.auth-page .auth-checkbox>span { min-width:0; }
.auth-page .auth-terms { margin:4px 0 18px; }
.auth-page .auth-terms+.auth-field-error:not(:empty) { margin-bottom:16px; }
.auth-page .auth-submit { min-height:50px; width:100%; border:1px solid var(--accent-hover); border-radius:6px; background:linear-gradient(180deg,#148dcc,var(--accent)); color:#fff; display:flex; align-items:center; justify-content:center; gap:14px; font-weight:650; font-size:16px; padding:13px 18px; box-shadow:inset 0 1px 0 #ffffff30,0 3px 6px #087fc125; transition:background .15s,box-shadow .15s; }
.auth-page .auth-submit:hover { color:#fff; background:var(--accent-hover); border-color:var(--accent-hover); text-decoration:none; }
.auth-page .auth-submit>i { font-size:13px; }
.auth-page .auth-submit:disabled { cursor:not-allowed; background:#65758c; border-color:#65758c; }
.auth-page .auth-submit-status { font-size:13px; color:var(--muted); margin-top:10px; line-height:1.5; }
.auth-page .auth-submit-status:empty { display:none; }
.auth-page .auth-bottom-link { text-align:center; color:var(--muted); font-size:14px; line-height:1.6; margin:28px -36px 0; padding:20px 24px; background:#f8fafc; border-top:1px solid #e3e8f0; border-radius:0 0 8px 8px; }
.auth-page .auth-bottom-link a { font-weight:600; }
.auth-page .auth-bottom-link i { margin-right:6px; font-size:12px; }
.auth-page .auth-alert { display:flex; align-items:flex-start; gap:12px; font-size:14px; line-height:1.55; padding:14px 16px; background:#fff0f2; color:#a32943; border-left:3px solid #df4564; margin-bottom:22px; overflow-wrap:anywhere; }
.auth-page .auth-alert>i { padding-top:3px; flex:none; font-size:16px; }
.auth-page .auth-alert-success { background:#e8f7ef; color:#18754d; border-color:#29a270; }
.auth-page .auth-alert-neutral { background:#fff5df; color:#805b10; border-color:#e8ae31; }
.auth-page .auth-error-summary { font-size:13px; color:#b12d49; margin-bottom:17px; }
.auth-page .auth-package { display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding:12px 14px; margin-bottom:20px; font-size:13px; color:#18754d; background:#e8f7ef; border-left:3px solid #29a270; }
.auth-page .auth-package>span { margin-left:auto; font-weight:600; }
.auth-page .auth-caps { font-size:13px; color:#936308; margin:-6px 0 14px; }
.auth-page .auth-password-meter { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; height:4px; margin-top:10px; }
.auth-page .auth-password-meter>span { background:#dce2eb; border-radius:1px; }
.auth-page .auth-password-meter>span.filled { background:#27a16e; }
.auth-page .auth-password-meter[data-valid=false]>span.filled { background:#d99520; }
.auth-page .auth-password-feedback { font-size:12px; color:var(--muted); line-height:1.5; margin-top:6px; }
.auth-page .auth-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 40px; font-size:12px; color:var(--muted); }
.auth-page .auth-footer>div { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.auth-page .auth-footer a { color:var(--muted); }
.auth-page .auth-footer i { color:#25946a; font-size:11px; margin-right:6px; }
.auth-page.auth-register { --symbol:#208958; --symbol-bg:#e4f5eb; }
.auth-register .auth-content { max-width:700px; }
.auth-register .auth-main { padding-top:32px; padding-bottom:36px; }
.auth-register .auth-heading { margin-bottom:24px; }

.auth-page.auth-forgot { --symbol:#a7710a; --symbol-bg:#fff0ce; }
.auth-page.auth-recover { --symbol:#7951c4; --symbol-bg:#efe8fb; }
@media(max-width:600px) {
 .auth-page .auth-topbar { padding:10px 20px; min-height:68px; gap:12px; }
 .auth-page .auth-topbar nav>span { display:none; }
 .auth-page .auth-topbar nav>a { font-size:13px; gap:9px; }
 .auth-page .auth-brand img { width:105px; height:34px; }
 .auth-page .auth-main { padding:24px 16px 32px; align-items:flex-start; }
 .auth-page .auth-content { padding:24px 22px 0; }
 .auth-page .auth-heading { margin-bottom:24px; }
 .auth-page .auth-bottom-link { margin:24px -22px 0; padding:18px 20px; }
 .auth-page .auth-heading h1 { font-size:26px; }
 .auth-page .auth-heading>p { font-size:14px; }
 .auth-page .auth-field-pair { grid-template-columns:minmax(0,1fr); gap:0; }
 .auth-page .auth-form-options { align-items:flex-start; gap:16px; }
 .auth-page .auth-footer { padding:20px 22px; font-size:12px; flex-wrap:wrap; gap:16px; }
 .auth-page .auth-footer>div { gap:20px; }
 .auth-page .auth-footer>div>span { display:none; }
 .auth-page .auth-symbol { width:40px; height:40px; font-size:18px; margin-left:10px; }
}
@media(max-width:360px) {
 .auth-page .auth-topbar { padding-left:16px; padding-right:16px; }
 .auth-page .auth-main { padding-left:12px; padding-right:12px; }
 .auth-page .auth-content { padding-left:18px; padding-right:18px; }
 .auth-page .auth-bottom-link { margin-left:-18px; margin-right:-18px; }
 .auth-page .auth-symbol { width:36px; height:36px; }
 .auth-page .auth-heading h1 { font-size:26px; }
 .auth-page .auth-form-options { flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) { .auth-page * { transition:none!important; } }