/* Login – gleiche Farben wie das Dashboard (eigenständig, weil vor dem Login nur diese Datei geladen werden darf) */
:root { color-scheme: light; --bg: #F6F7F9; --card: #FFFFFF; --line: #E3E6EB; --text: #111827; --muted: #6B7280; --accent: #8A2F4B; --accent-ink: #fff; --bad: #B91C1C; --bad-bg: #FEE2E2; --shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px rgba(16, 24, 40, .06); }
@media (prefers-color-scheme: dark) { :root { color-scheme: dark; --bg: #0E1116; --card: #161B22; --line: #2A313C; --text: #E6EAF0; --muted: #8A94A3; --accent: #E7A35F; --accent-ink: #26130A; --bad: #F87171; --bad-bg: rgba(239, 68, 68, .16); --shadow: none; } }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); }
body { min-height: 100vh; display: grid; place-items: center; font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif; -webkit-font-smoothing: antialiased; padding: 16px; }
.card { width: 100%; max-width: 360px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 28px; display: grid; gap: 10px; box-shadow: var(--shadow); }
.logo { display: flex; align-items: center; gap: 10px; font-weight: 650; font-size: 19px; letter-spacing: -0.01em; margin: 0 0 8px; } /* Runde 17 P3-9: Titel „Traffic", ohne Einleitungssatz */
.lead { margin: 0 0 8px; color: var(--muted); font-size: 13.5px; }
label { font-size: 13px; font-weight: 600; margin-top: 4px; }
input { font: inherit; height: 42px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); color: var(--text); }
input:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: transparent; }
#code { letter-spacing: .3em; font-variant-numeric: tabular-nums; }
#code::placeholder { color: var(--muted); opacity: .55; letter-spacing: .3em; }
button { font: inherit; font-weight: 600; height: 44px; border: 0; border-radius: 10px; background: var(--accent); color: var(--accent-ink); cursor: pointer; margin-top: 10px; }
button:hover { filter: brightness(1.06); }
button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.err { color: var(--bad); background: var(--bad-bg); margin: 4px 0 0; font-size: 13.5px; padding: 9px 12px; border-radius: 9px; }
.foot { margin: 8px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
/* Runde 24 (Handy): Felder 48 px hoch und 16 px Schrift (iPhone zoomt beim Tippen nicht in die Seite), Knopf 48 px */
@media (max-width: 767px) {
  input { height: 48px; font-size: 16px; }
  button { height: 48px; font-size: 16px; }
  label { font-size: 14px; }
}