* { box-sizing: border-box; }
body { margin:0; background:var(--canvas); color:var(--ink); font:1rem/1.5 var(--font-display); }
main { width:min(100% - var(--sp-8),28rem); margin:var(--sp-12) auto; padding:var(--sp-6); background:var(--surface-card); border:1px solid var(--hairline); border-radius:var(--r-card); }
.brand { font-family:var(--font-mono); color:var(--gold); letter-spacing:.12em; }
h1 { margin:var(--sp-4) 0; font-size:1.75rem; }
form { display:flex; flex-direction:column; gap:var(--sp-2); margin-top:var(--sp-6); }
label { margin-top:var(--sp-2); }
input,button { min-height:2.75rem; padding:var(--sp-3); border:1px solid var(--hairline); border-radius:var(--r-el); font:inherit; }
input { background:var(--surface-elevated); color:var(--ink); width:100%; }
button { margin-top:var(--sp-4); background:var(--gold); color:var(--canvas); font-weight:700; cursor:pointer; }
button:disabled { cursor:wait; }
:focus-visible { outline:3px solid var(--gold-bright); outline-offset:3px; }
#login-error { margin:var(--sp-2) 0; color:var(--ink); }
[hidden] { display:none; }