/* Design-Tokens aus CLAUDE.md §6 — einzige Quelle der Wahrheit.
   Nie Hex-Werte hart in Komponenten verwenden. */
:root {
  --bg: #f4efff;            /* Hintergrund (helles Lavendel) */
  --panel: #ffffff;         /* Karten/Panels */
  --map-bg: #e9e0ff;        /* Kartenfläche */
  --land: #d9c8ff;          /* Landmassen */
  --ink: #180d2b;           /* Text & Outlines (fast-schwarzes Violett) */
  --dim: #7a6b99;           /* Sekundärtext */
  --accent: #8b5cf6;        /* Primär-Violett */
  --accent-grad: linear-gradient(100deg, #8b5cf6, #ff4fa3);
  --pink: #ff4fa3;          /* Sekundärakzent */
  --danger: #ff2e63;        /* Risiko/Verlust */
  --success: #00d68f;       /* Zustellung/„guaranteed" */
  --coin: #ffd23f;          /* Punkte/Wallet (Münz-Gelb) */
  --route: #8b5cf6;         /* Flugrouten (dashed) */
  --radius: 16px;
  --border: 2.5px solid var(--ink);
  --shadow: 5px 5px 0 var(--ink);          /* Karten */
  --shadow-cta: 6px 6px 0 var(--ink);      /* Buttons */

  /* Seitenhintergrund hinter dem Phone-Frame (aus dem Mockup, #e6dcfc) */
  --backdrop: #e6dcfc;

  /* Typo gemäss §6 */
  --font-ui: 'Space Grotesk', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
}