:root { color-scheme: dark light; --bg:#0d1318; --panel:#141c24; --line:#243240; --text:#e7edf3; --muted:#8a9bab; --blue:#5ab0ff; --red:#ff4d58; }
@media (prefers-color-scheme: light) { :root { --bg:#eef2f6; --panel:#fff; --line:#d5dee7; --text:#15212c; --muted:#5d6e7e; --blue:#1565c0; --red:#d6212e; } }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:center; background:var(--bg); color:var(--text); font:15px/1.5 "Segoe UI Variable Text","Segoe UI",system-ui,sans-serif; }
main { width:100%; padding:16px; }
form { max-width:380px; margin:0 auto; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:28px 24px; }
h1 { margin:0 0 6px; font:700 24px/1.15 "Bahnschrift","Arial Narrow","Segoe UI",sans-serif; }
p { margin:0 0 18px; color:var(--muted); }
label { display:block; font-weight:600; margin-bottom:6px; }
input { width:100%; padding:10px 12px; border-radius:8px; border:1px solid var(--line); background:transparent; color:inherit; font:inherit; min-height:44px; }
button { width:100%; margin-top:14px; min-height:44px; border:0; border-radius:8px; background:var(--blue); color:#06121d; font:inherit; font-weight:700; cursor:pointer; }
button:disabled { opacity:.6; cursor:wait; }
:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
#err { color:var(--red); margin:12px 0 0; min-height:1.5em; }