/* =========================================================================
   Design-Tokens v2 — "Einsatzzentrale" (Game-HUD)
   Dunkle Buehne, Signalfarben als Lichtquellen (dim/base/bright + Glow).
   Alte Variablennamen bleiben gueltig (Aliasse), damit Bestands-CSS
   weiterlaeuft, waehrend Werte hier zentral getauscht werden.
   ========================================================================= */
:root {
  color-scheme: dark;

  /* Surfaces — dunklere Buehne als v1 */
  --bg:          #090c0a;
  --bg-raise:    #0e120f;   /* Wells, Chart-Plots, Tabellen-Zebra */
  --panel:       #121612;
  --panel-2:     #1a201a;   /* erhoben / aktives Control */
  --panel-3:     #212821;   /* Hover von erhoben */
  --panel-hover: #212821;
  --line:        #2c342c;
  --line-strong: #46523f;
  --text:        #f4f0e8;
  --muted:       #9aa294;

  /* Signale — dim/base/bright-Triaden.
     Semantik: Gold = Marke/aktiv, Gruen = lebendig/online,
     Rot = Blutmond/Fehler (exklusiv!), Blau = Chart/Info. */
  --green:        #6fe087;
  --green-bright: #a4ffb4;
  --green-dim:    rgba(111, 224, 135, 0.22);
  --green-glow:   rgba(111, 224, 135, 0.45);

  --gold:         #e0b055;
  --gold-bright:  #ffd684;
  --gold-dim:     rgba(224, 176, 85, 0.22);
  --gold-glow:    rgba(224, 176, 85, 0.40);

  --red:          #ff5f4c;
  --red-bright:   #ff9587;
  --red-dim:      rgba(255, 95, 76, 0.20);
  --red-glow:     rgba(255, 95, 76, 0.50);

  --blue:         #84b6ec;
  --blue-dim:     rgba(132, 182, 236, 0.20);
  --blue-glow:    rgba(132, 182, 236, 0.40);

  --focus: var(--gold);

  /* 7D2D-Qualitaetsfarben (Item-Rahmen, Q-Chips) */
  --q1: #8a8a8a;
  --q2: #7fbf5b;
  --q3: #5aa7d6;
  --q4: #b06fdb;
  --q5: #e8a33d;
  --q6: #ff8a3c;

  /* Schatten & Glows */
  --shadow-panel: 0 10px 30px rgba(0, 0, 0, 0.45);
  --shadow-raise: 0 16px 44px rgba(0, 0, 0, 0.55);
  --shadow: var(--shadow-panel); /* Alias v1 */
  --glow-gold:  0 0 0 1px rgba(224, 176, 85, 0.28), 0 0 24px rgba(224, 176, 85, 0.14);
  --glow-green: 0 0 0 1px rgba(111, 224, 135, 0.30), 0 0 24px rgba(111, 224, 135, 0.14);
  --glow-red:   0 0 0 1px rgba(255, 95, 76, 0.35),  0 0 28px rgba(255, 95, 76, 0.20);
  --glow-blue:  0 0 0 1px rgba(132, 182, 236, 0.28), 0 0 24px rgba(132, 182, 236, 0.12);
  --text-glow-gold:  0 0 16px rgba(224, 176, 85, 0.35);
  --text-glow-green: 0 0 16px rgba(111, 224, 135, 0.35);
  --text-glow-red:   0 0 18px rgba(255, 95, 76, 0.45);

  /* Radius: schaerfer = mehr Maschine. 999px-Pille nur noch fuer
     Status-Chips (Online-Pille, Q-Badges), nicht fuer Navigation. */
  --radius:      6px;
  --radius-card: 10px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  /* Typografie */
  --font-display: "Rajdhani", "Segoe UI", system-ui, sans-serif;
  --font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Motion */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-snap: cubic-bezier(0.2, 0.9, 0.25, 1.2);
  --t-fast: 150ms;
  --t-med:  300ms;
  --t-slow: 700ms;
}