:root { color-scheme: dark; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100dvh; display: grid; place-items: center; background: #111214; color: #eceef1; font: 16px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.login form { width: min(340px, 90vw); display: grid; gap: 8px; padding: 28px 24px; background: #1b1d21; border: 1px solid #2c2f35; border-radius: 12px; }
h1 { margin: 0 0 12px; font-size: 20px; font-weight: 600; }
label { font-size: 13px; color: #b9bec7; }
input { width: 100%; padding: 12px; font: inherit; color: inherit; background: #101114; border: 1px solid #3a3e46; border-radius: 8px; }
input:focus { outline: 2px solid #4a90d9; outline-offset: 1px; }
button { margin-top: 12px; padding: 12px; font: inherit; font-weight: 600; color: #0c1a10; background: #3cc46a; border: 0; border-radius: 8px; }
button:active { transform: translateY(1px); }
.err { margin: 4px 0 0; color: #ff8a80; font-size: 14px; }
.note { margin: 8px 0 0; font-size: 12px; color: #9aa0aa; }