:root { color-scheme: light dark; --paper:#f4f0e8; --card:#fffdf8; --ink:#27251f; --muted:#716d63; --line:#d6cfc2; --accent:#b34d2f; --focus:#b34d2f; --error:#a94235; --brand-bg:#eef0f2; --sans:"Status Sans",system-ui,sans-serif; }
@media (prefers-color-scheme: dark) { :root { --paper:#171613; --card:#201e1a; --ink:#ece7dc; --muted:#aaa398; --line:#3b3832; --accent:#dc7658; --focus:#dc7658; --error:#dc7769; --brand-bg:#201e1a; } }
* { box-sizing:border-box; }
body { min-width:320px; min-height:100vh; margin:0; background:var(--paper); color:var(--ink); font:15px/1.5 var(--sans); font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
.login-shell { display:grid; align-content:center; min-height:100vh; width:min(100% - 32px,460px); margin:auto; padding:32px 0; }
.back-link { width:max-content; margin-bottom:32px; color:var(--muted); text-decoration:none; }
.back-link:hover { color:var(--ink); }
.login-card { padding:clamp(24px,6vw,42px); border:1px solid var(--line); border-radius:4px; background:var(--card); box-shadow:0 14px 38px rgba(39,37,31,.06); }
.brand-lockup { display:flex; align-items:center; gap:16px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.brand-mark { flex:none; width:58px; height:58px; border-radius:14px; background:var(--brand-bg); object-fit:cover; }
.eyebrow { margin:0 0 3px; color:var(--accent); font-size:11px; font-weight:700; letter-spacing:.14em; }
h1 { margin:0; font-size:clamp(25px,6vw,33px); line-height:1.1; font-weight:540; letter-spacing:-.035em; }
.intro { margin:24px 0; color:var(--muted); }
form { display:grid; gap:10px; }
label { margin-top:4px; font-size:13px; font-weight:650; }
input { width:100%; min-height:46px; padding:0 12px; border:1px solid var(--line); border-radius:3px; background:transparent; color:var(--ink); }
.password-field { display:grid; grid-template-columns:1fr auto; }
.password-field input { border-radius:3px 0 0 3px; }
.password-field button { min-width:60px; border:1px solid var(--line); border-left:0; border-radius:0 3px 3px 0; background:transparent; color:var(--muted); cursor:pointer; }
.field-note { margin:0; color:var(--muted); font-size:13px; }
.text-button { justify-self:start; min-height:44px; padding:0; border:0; background:transparent; color:var(--accent); cursor:pointer; }
.form-error { margin:8px 0 0; padding:10px 12px; border-left:3px solid var(--error); background:color-mix(in srgb,var(--error) 9%,transparent); color:var(--ink); font-size:13px; }
.submit-button { min-height:48px; margin-top:14px; border:1px solid var(--ink); border-radius:3px; background:var(--ink); color:var(--paper); cursor:pointer; }
.submit-button:disabled { opacity:.65; cursor:wait; }
.privacy-note { margin:20px 0 0; color:var(--muted); font-size:12px; text-align:center; }
@media (max-width:420px) { .login-shell { align-content:start; padding-top:20px; } .back-link { margin-bottom:22px; } .login-card { padding:24px 20px; } .brand-lockup { gap:12px; } .brand-mark { width:50px; height:50px; border-radius:12px; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto; } }