/* ============================================================================
   FunFlight Startliste — Design-Tokens
   ----------------------------------------------------------------------------
   Zentrale Gestaltungswerte als CSS Custom Properties.
   Leitidee: "Flight Strips" — Kontrollstreifen der Flugsicherung.
   CI-Regel: Weiß ist Grund, Anthrazit ist Typo/Struktur,
             Rot (#E2001A) ist AUSSCHLIESSLICH Aktion + Akzent.
   Auswahl-/Zustandsfarben sind bewusst Anthrazit, damit Rot immer
   "hier passiert etwas" bedeutet — wichtig für Sonnenlicht-Lesbarkeit.
   ========================================================================== */

:root {
  /* ---- Farben ---------------------------------------------------------- */
  --paper:      #FFFFFF;  /* Grundfläche, Streifenkörper                    */
  --bay:        #F1F0EC;  /* "Streifenablage" — Hintergrund hinter Strips   */
  --ink:        #16181D;  /* Anthrazit — Primärtext, Rahmen                 */
  --ink-soft:   #4A4F57;  /* Sekundärtext                                   */
  --ink-faint:  #82878F;  /* Beschriftungen, ungesetzte Werte               */
  --line:       #D8DADD;  /* Hairlines, inaktive Verläufe                   */
  --red:        #E2001A;  /* FunFlight-Rot — Aktion & Akzent                */
  --red-press:  #B50014;  /* Pressed-Zustand des Rots                       */
  --red-tint:   #FDE9EB;  /* Sehr helle Rot-Fläche (Stempel-Blitz)          */

  /* ---- Typografie ------------------------------------------------------ */
  /* B612: von Airbus für Cockpit-Displays entworfen (SIL OFL, lokal
     gebündelt). B612 Mono liefert garantiert tabellarische Ziffern für
     instrumentenartige Zeitanzeigen. Fließtext: iOS-Systemfont.           */
  --font-ui:   'B612', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'B612 Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --font-body: -apple-system, system-ui, 'Helvetica Neue', Arial, sans-serif;

  /* Größenraster (Mobile, 390 pt Referenzbreite) */
  --fs-micro:  0.625rem;   /* 10px — Feld-Beschriftungen (Uppercase)        */
  --fs-small:  0.8125rem;  /* 13px — Nebentext, Mini-Zeiten                 */
  --fs-body:   0.9375rem;  /* 15px — Fließtext                              */
  --fs-strip:  1.25rem;    /* 20px — Streifen-Route                         */
  --fs-title:  1.375rem;   /* 22px — Screen-Titel                           */
  --fs-time:   2.125rem;   /* 34px — große Zeitinstrumente                  */
  --ls-label:  0.09em;     /* Letterspacing für Uppercase-Labels            */

  /* ---- Maße & Radien --------------------------------------------------- */
  --tap-min:      56px;    /* Mindest-Tapziel (Kernaktionen)                */
  --space:        16px;    /* Basis-Außenabstand der Screens                */
  --radius-strip: 8px;     /* Kontrollstreifen — bewusst technisch-knapp    */
  --radius-btn:   14px;
  --radius-field: 10px;
  --holder-w:     22px;    /* Breite der Streifen-Halteleiste links         */

  /* ---- Tiefe (dezent, papierhaft — kein Soft-UI) ----------------------- */
  --shadow-strip:  0 1px 0 rgba(22, 24, 29, 0.16), 0 3px 10px rgba(22, 24, 29, 0.07);
  --shadow-active: 0 2px 0 rgba(22, 24, 29, 0.20), 0 8px 22px rgba(22, 24, 29, 0.12);
  --shadow-dock:   0 -1px 0 rgba(22, 24, 29, 0.10), 0 -8px 24px rgba(22, 24, 29, 0.06);

  /* ---- iOS Safe Areas --------------------------------------------------- */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* ---- Bewegung --------------------------------------------------------- */
  --ease-snap: cubic-bezier(0.2, 0.9, 0.3, 1);
  --t-press:   70ms;
  --t-morph:   140ms;
}