/* tokens.css — alle Design-Werte an einer Stelle.
 * Uebernommen aus dem Design-Set des Anwendungsfalls, Stand 16.09.2026.
 * Steht ein Farbwert irgendwo sonst im Projekt, ist das der Fehler.
 *
 * Abweichung zum gelieferten Set: der @import von fonts.googleapis.com wurde
 * entfernt. Die Schrift liegt als Datei im Projekt (app/schriften/), damit die
 * Anwendung ohne Netz unveraendert aussieht (umgebung.md, Netzgrenze).
 */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/schriften/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/schriften/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: light;

  /* Aktion — die eine Farbe fuer Buttons und Aktives */
  --action: #2454C7;
  --action-hover: #1B3E9E;
  --on-action: #FFFFFF;

  /* Hintergrund-Treppe: Seite → Karte → Feld → Hover-Flaeche */
  --bg-0: #FFFFFF;
  --bg-1: #F7F7F8;
  --bg-2: #FFFFFF;
  --bg-3: #EEF1FA;
  --bg-4: #E7EBF6;

  /* Text-Treppe: kraeftig → leise. Information nie in --text-500. */
  --text-100: #17171A;
  --text-200: rgba(23,23,26,.88);
  --text-300: rgba(23,23,26,.72);
  --text-400: rgba(23,23,26,.62);
  --text-500: rgba(23,23,26,.42);

  /* Rahmen */
  --border-soft: rgba(0,0,0,.10);
  --border-strong: rgba(0,0,0,.22);
  --border-focus: var(--action);

  /* Status — funktional, keine Markenfarben; nie ohne Symbol oder Text */
  --ok:    #1E9E5A;
  --warn:  #B7791F;
  --error: #C2410C;

  --font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-brand: var(--font);
  --mono: ui-monospace, "SF Mono", Consolas, monospace;

  --fs-xs: 12px;  --fs-sm: 14px;  --fs-md: 16px;
  --fs-lg: 20px;  --fs-xl: 24px;  --fs-2xl: 32px;

  --space-xs: 4px;  --space-sm: 8px;   --space-md: 16px;
  --space-lg: 24px; --space-xl: 40px;  --space-2xl: 64px;

  --r-sm: 6px;  --r-md: 10px;  --r-lg: 14px;  --r-pill: 999px;

  --shadow: 0 8px 24px rgba(0,0,0,.08);
  --t-fast: .15s;  --t: .25s;  --ease: cubic-bezier(.4, 0, .2, 1);

  --container: 1100px;
  --reading:   70ch;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}