/* ═══════════════════════════════════════════════════════════════════════
   amberSUITE — GEMEINSAME DESIGN-TOKENS (Single Source of Truth, #139)
   ───────────────────────────────────────────────────────────────────────
   EINZIGE Quelle der Wahrheit für Farben/Fonts/Radii ALLER 5 Module
   (amberPLAY, amberDSP, amberLAB, amberAI, amberSUITE-Tauri-Shell).

   NICHT pro Modul editieren! Änderungen NUR hier — scripts/sync-tokens.py
   spiegelt diesen Block zwischen den Markern
       /* AMBER-TOKENS:START * /  …  /* AMBER-TOKENS:END * /
   in jede Modul-UI (build-inline, CSP-/offline-sicher, kein externer Link).

   Vokabular kanonisch: --bg0/--brd (Referenz = amberDSP). Aliase --bg/--line
   halten Module am Leben, die historisch anders benennen (lab/tauri) — deren
   CSS muss nicht angefasst werden.

   Dark-Theme suite-weit über die Klasse body.theme-dark (Header-Toggle →
   {amberTheme}-Broadcast). Akzent = #c8841a (RGB 200/132/26), verbindlich.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  /* Helle Basis EXPLIZIT deklarieren: verhindert, dass der Browser (macOS/iOS
     im Dark-Mode, „Auto-Dark") die Seite selbst umfärbt und z.B. den Header
     dunkel macht, während der Text per var(--tx) dunkel bleibt → schwarz auf
     schwarz. Dark-Theme kommt bei uns nur bewusst über body.theme-dark. */
  color-scheme: light;
  /* Flächen */
  --bg0:#f0efec; --bg1:#e8e6e1; --bg2:#dedad4; --bg3:#ccc9c2; --surface:#faf9f7;
  /* Akzent */
  --am:#c8841a; --am2:#a06814; --amb:rgba(200,132,26,.13); --ambb:rgba(200,132,26,.28);
  /* Text */
  --tx:#1e1c1a; --tx2:#5a5650; --tx3:#9a9690;
  /* Linien */
  --brd:rgba(0,0,0,.10); --brd2:rgba(0,0,0,.16);
  /* Status */
  --grn:#3a7a4a; --grn-bg:rgba(58,122,74,.10); --grn-brd:rgba(58,122,74,.25);
  --red:#b04030; --red-bg:rgba(176,64,48,.09); --red-brd:rgba(176,64,48,.22);
  /* Typografie + Form */
  --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --sans:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --r:5px; --sh:0 1px 3px rgba(0,0,0,.09), 0 1px 1px rgba(0,0,0,.05); --gap:6px; --hdr:44px;
  /* Aliase (Module mit abweichendem Vokabular — nie neue Nutzungen bauen).
     --tx1/--border fingen bisher latente Tippfehler (play/tauri) per Inline-
     Fallback ab; als Alias werden sie theme-korrekt. */
  --bg: var(--bg0); --line: var(--brd); --tx1: var(--tx); --border: var(--brd);
}
body.theme-dark {
  color-scheme: dark;
  --bg0:#1a1816; --bg1:#232120; --bg2:#2c2a28; --bg3:#3a3835; --surface:#161412;
  --am:#c8841a; --am2:#e09a30; --amb:rgba(200,132,26,.18); --ambb:rgba(200,132,26,.36);
  --tx:#e8e6e1; --tx2:#a8a49e; --tx3:#6a6660;
  --brd:rgba(255,255,255,.10); --brd2:rgba(255,255,255,.16);
  --grn:#5fb87a; --grn-bg:rgba(95,184,122,.12); --grn-brd:rgba(95,184,122,.30);
  --red:#d05a48; --red-bg:rgba(208,90,72,.12); --red-brd:rgba(208,90,72,.28);
  --sh:0 1px 3px rgba(0,0,0,.50), 0 1px 1px rgba(0,0,0,.30);
  /* --bg/--line sind über var(--bg0)/var(--brd) spät gebunden → folgen automatisch */
}