/* Anmeldeseiten: dunkles Register, Tokens aus dem Skill dreamteam-design-system. */
@font-face { font-family: "Geist"; src: url("/fonts/Geist-Variable.woff2") format("woff2-variations"); font-weight: 100 900; font-display: swap; }
:root {
  --ink: #0D1117; --ink-2: #151A21; --on-dark: #F6F7F9; --muted: #9BA2AD; --border: #5A6372; --divider: #252B33;
  --mint: #00E5A0; --risk: #FF6369; 
  --schrift: Geist, "Geist Variable", system-ui, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--ink); color: var(--on-dark); font: 16px/1.55 var(--schrift); }
.anmeldung { max-width: 416px; margin: 0 auto; padding: 48px 16px; }
.marke { display: flex; justify-content: space-between; align-items: center; margin: 0 0 32px; font: 500 12px/1 var(--schrift); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.marke::before { content: ""; width: 8px; height: 8px; margin-right: 12px; background: var(--mint); transform: translateY(-.13em); }
.marke { justify-content: flex-start; }
.sprache { margin-left: auto; padding: 4px 12px; border: 1px solid var(--border); color: var(--on-dark); text-decoration: none; letter-spacing: .08em; }
h1 { font: 700 34px/1.1 var(--schrift); letter-spacing: -.02em; margin: 0 0 24px; }
p { margin: 0 0 16px; }
.leise { color: var(--muted); font-size: 14px; margin-top: 24px; }
a { color: var(--mint); }
label { display: block; font-size: 14px; font-weight: 500; margin: 16px 0 8px; }
input { width: 100%; min-height: 48px; padding: 8px 16px; font: inherit; color: var(--on-dark); background: var(--ink-2); border: 1px solid var(--border); border-radius: 0; }
input:focus-visible, .knopf:focus-visible, a:focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; }
.knopf { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; margin-top: 16px; padding: 8px 16px; font: 600 16px/1 var(--schrift); color: var(--on-dark); background: transparent; border: 1px solid var(--border); border-radius: 0; cursor: pointer; }
.knopf.haupt { background: var(--mint); color: var(--ink); border-color: var(--mint); }
.fehler { color: var(--risk); background: var(--ink-2); border: 1px solid var(--risk); border-left-width: 3px; padding: 8px 16px; }
.hinweis { background: var(--ink-2); border: 1px solid var(--border); border-left: 3px solid var(--mint); padding: 8px 16px; }
.oder { text-align: center; color: var(--muted); margin: 24px 0 0; }
#geraet .knopf { margin-top: 8px; }
[hidden] { display: none !important; }
