:root {
  --bg: #f6f7f9; --panel: #ffffff; --panel-2: #f0f2f5; --border: #d6dae1; --text: #0f1419;
  --muted: #56606e; --accent: #1f5fd1; --accent-text: #ffffff; --neg: #c42b1c; --neg-bg: #fdeceb;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d1117; --panel: #161b22; --panel-2: #1d232c; --border: #30363d; --text: #e8edf2;
    --muted: #9aa5b1; --accent: #4c8dff; --accent-text: #0d1117; --neg: #ff6b5e; --neg-bg: #2c1412;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0d1117; --panel: #161b22; --panel-2: #1d232c; --border: #30363d; --text: #e8edf2;
  --muted: #9aa5b1; --accent: #4c8dff; --accent-text: #0d1117; --neg: #ff6b5e; --neg-bg: #2c1412;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--text); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.card { max-width: 360px; margin: 14vh auto; padding: 20px 16px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; }
h1 { font-size: 1.2rem; margin: 0 0 16px; text-align: center; }
label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
input { width: 100%; padding: 9px 10px; font: inherit; color: var(--text); background: var(--panel-2); border: 1px solid var(--border); border-radius: 7px; min-height: 40px; }
input:focus, button:focus-visible, a.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
button, a.btn { display: block; width: 100%; text-align: center; text-decoration: none; font: 600 14px system-ui, sans-serif; padding: 9px 14px; min-height: 40px; border-radius: 7px; cursor: pointer; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-text); }
.error { padding: 10px 14px; border-radius: 10px; margin-bottom: 14px; font-weight: 600; background: var(--neg-bg); color: var(--neg); }
.muted { color: var(--muted); font-size: 13px; text-align: center; }
form { margin-top: 14px; }
form p { margin: 12px 0 0; }