.auth-page { min-height:100dvh; height:auto; overflow:auto !important; background:radial-gradient(ellipse at 5% 5%,var(--tint-soft),transparent 55%),var(--bg) !important; color:var(--label); }
.auth-nav { max-width:1100px; margin:auto; display:flex; align-items:center; gap:20px; padding:26px 28px; }
.auth-brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--label); font-size:24px; font-weight:800; letter-spacing:-1px; }
.auth-brand img { width:36px; height:36px; border-radius:11px; }
.auth-back { margin-left:auto; color:var(--label-2); font-size:12px; text-decoration:none; }
.auth-back span { margin-left:12px; }
.auth-lang { min-width:36px; height:36px; border:0; border-radius:50%; background:var(--fill); color:var(--label-2); font-size:11px; }
.auth-main { display:grid; justify-items:center; align-content:start; padding:6vh 20px 36px; }
.auth-card { width:min(420px,100%); padding:34px; border:.5px solid var(--sep); border-radius:30px; background:var(--glass-strong); box-shadow:0 12px 50px #00000008,inset 0 1px var(--glass-spec); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px); }
.auth-icon { width:56px; height:56px; border-radius:18px; }
.auth-eyebrow { margin:22px 0 9px; font-size:9px; letter-spacing:1.5px; font-weight:650; color:var(--tint); }
.auth-card h1 { margin:0 0 8px; font-size:30px; line-height:1.2; font-weight:720; letter-spacing:-1px; }
.auth-subtitle { margin:0 0 25px; color:var(--label-2); font-size:13px; line-height:1.5; }
.auth-modes { display:flex; padding:3px; margin-bottom:23px; border-radius:999px; background:var(--fill); gap:4px; }
.auth-modes button { flex:1; min-height:34px; border:0; border-radius:999px; background:none; color:var(--label-2); font-size:12px; }
.auth-modes button[aria-pressed="true"] { color:var(--label); background:var(--card); box-shadow:0 2px 5px #00000009; font-weight:600; }
#authForm label { display:flex; justify-content:space-between; font-size:12px; font-weight:550; margin-bottom:7px; }
#authForm label small { font-size:10px; color:var(--label-3); font-weight:400; }
#authForm input { display:block; width:100%; min-width:0; height:42px; border-radius:999px; border:.5px solid var(--sep); padding:0 15px; background:var(--fill); color:var(--label); font-size:14px; outline:none; }
#authForm input:focus { border-color:var(--tint); box-shadow:0 0 0 3px var(--tint-soft); }
#authEmail { margin-bottom:18px; }
.auth-password { position:relative; }
.auth-password input { padding-right:48px !important; }
#showPassword { position:absolute; top:0; right:4px; width:40px; height:42px; border:0; background:none; color:var(--label-2); }
.auth-message { font-size:12px; line-height:1.5; color:var(--label-2); margin:12px 0; }
.auth-message:empty { margin:12px 0 0; }
#authSubmit,.auth-continue { display:flex; width:100%; min-height:44px; align-items:center; justify-content:center; gap:12px; margin-top:17px; border:0; border-radius:999px; font-size:13px; font-weight:600; text-decoration:none; background:var(--tint); color:var(--on-tint); }
#authSubmit:disabled { opacity:.6; }
.auth-note { border-top:.5px solid var(--sep); margin:25px 0 0; padding-top:16px; font-size:11px; line-height:1.6; color:var(--label-3); }
.auth-footnote { font-size:11px; color:var(--label-3); margin:24px 0; }
#authEmailDisplay { color:var(--label-2); overflow-wrap:anywhere; font-size:13px; }
#authLogout { width:100%; min-height:42px; margin-top:10px; border:0; border-radius:999px; background:none; color:var(--label-2); font-size:12px; }
@media(max-width:600px){.auth-main{padding-top:22px}.auth-card{padding:27px 24px}.auth-nav{padding:20px}.auth-back{font-size:11px}#authForm input{font-size:16px}.auth-footnote{font-size:10px}}
.auth-page { margin:0; font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','PingFang SC',system-ui,sans-serif; }
.auth-page *,.auth-page *::before,.auth-page *::after { box-sizing:border-box; }

/* Sign in with Apple / Google, above the email form. */
.auth-social { display:grid; gap:10px; margin:0 0 6px; }
.auth-apple { display:flex; align-items:center; justify-content:center; gap:8px; height:44px; border:0; border-radius:999px; background:#000; color:#fff; font:600 15px -apple-system,BlinkMacSystemFont,system-ui,sans-serif; cursor:pointer; }
.auth-apple svg { width:18px; height:18px; fill:currentColor; }
:root[data-theme="dark"] .auth-apple { background:#fff; color:#000; }
.auth-google { display:flex; justify-content:center; min-height:44px; }
.auth-or { display:flex; align-items:center; gap:10px; margin:8px 0 2px; color:var(--label-3); font-size:12px; }
.auth-or::before, .auth-or::after { content:''; flex:1; height:1px; background:var(--sep); }

.auth-lang + .auth-lang { margin-left:-12px; }
.auth-lang[data-toggle-units] { font-weight:700; }
.auth-lang svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.auth-lang svg.i-moon { fill:currentColor; stroke:none; }
.auth-lang[data-toggle-theme][data-mode="dark"] .i-moon, .auth-lang[data-toggle-theme]:not([data-mode="dark"]) .i-sun { display:none; }

.auth-passkey { background:var(--card) !important; color:var(--label) !important; border:1px solid var(--sep) !important; }
.auth-passkey svg { fill:none; stroke:currentColor; }
.auth-passkey-new { display:block; margin:10px auto 0; padding:4px 8px; border:0; background:none; color:var(--tint); font:600 13px -apple-system,BlinkMacSystemFont,system-ui,sans-serif; cursor:pointer; }

.auth-delete { display:block; margin:14px auto 0; padding:6px 10px; border:0; background:none; color:#e5484d; font:600 12px -apple-system,BlinkMacSystemFont,system-ui,sans-serif; cursor:pointer; }

/* Password management (signed-in account) */
.auth-pw { margin-top:14px; padding-top:12px; border-top:.5px solid var(--sep); display:grid; gap:8px; }
.auth-pw[hidden],.auth-pw [hidden] { display:none !important; }
.auth-pw-btn { min-height:40px; border:.5px solid var(--sep); border-radius:999px; background:var(--card); color:var(--label); font:600 13px inherit; font-family:inherit; cursor:pointer; }
.auth-pw form { display:grid; gap:6px; padding:12px; border:.5px solid var(--sep); border-radius:20px; background:var(--fill); }
.auth-pw label { font-size:11.5px; color:var(--label-2); font-weight:550; }
.auth-pw input { width:100%; height:40px; padding:0 14px; border:.5px solid var(--sep); border-radius:999px; background:var(--card); color:var(--label); font:inherit; font-size:14px; outline:none; }
.auth-pw input:focus { border-color:var(--tint); box-shadow:0 0 0 3px var(--tint-soft); }
.auth-pw-save { min-height:40px; margin-top:6px; border:0; border-radius:999px; background:var(--tint); color:var(--on-tint); font:600 13px inherit; font-family:inherit; cursor:pointer; }
.auth-pw-off { color:#e5484d; }
.auth-pw .auth-message { margin:2px 4px 0; }
@media(max-width:600px){.auth-pw input{font-size:16px}}
.auth-passkey-help{font-size:12px;line-height:1.5;color:var(--label-2,#67716c);text-align:center;margin:2px 12px 8px}
