/* Anmelde-Seiten der App. Farben und Schriften wie die App (seite.html). */
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url(/assets/barlow-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url(/assets/barlow-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow Semi Condensed"; font-weight: 700; font-display: swap; src: url(/assets/barlow-semi-condensed-latin-700-normal.woff2) format("woff2"); }
:root {
  color-scheme: dark;
  --bg: #171614; --surface: #1E1D1A; --line: #34322D; --line-strong: #49463F;
  --text: #F2EEE6; --text-2: #B4AFA5; --text-3: #857F75;
  --orange: #FF6A00; --orange-text: #FF8E45; --orange-ink: #1A1000; --fehler: #FF8A8A;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 16px; background: var(--bg); color: var(--text); font: 16px/1.55 "Barlow", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--orange-text); }
.karte { width: 100%; max-width: 420px; padding: 32px 28px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.logo { display: block; margin-bottom: 28px; font: 700 30px/1 "Barlow Semi Condensed", "Barlow", sans-serif; letter-spacing: -.02em; }
.logo b { color: var(--orange); font-weight: inherit; }
h1 { margin: 0 0 8px; font: 700 28px/1.15 "Barlow Semi Condensed", "Barlow", sans-serif; }
p { margin: 0 0 14px; color: var(--text-2); }
form { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--text-2); }
input { height: 46px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--bg); color: var(--text); font: inherit; }
input:focus { border-color: var(--orange); outline: none; }
button { height: 48px; border: 0; border-radius: 8px; background: var(--orange); color: var(--orange-ink); font: 600 16px "Barlow", sans-serif; cursor: pointer; }
button:hover { background: #FF7D23; }
.fehler { color: var(--fehler); }
.leise { color: var(--text-3); font-size: 14px; }
