/* ============================================================
   tokens.css — zentrale Design-Werte
   Hier ein Wert geändert = wirkt überall (Übersicht + Spiele).
   ============================================================ */

:root {
  /* Grundfarben (dunkles Indigo, kein reines Schwarz) */
  --bg:          #1e1b34;
  --bg-panel:    #2a2650;
  --bg-panel-2:  #322d5f;
  --ink:         #f3f1ff;
  --ink-muted:   #a7a2cf;
  --line:        #423c74;

  /* Akzentfarben — eine pro Spiel, zur Unterscheidung auf einen Blick */
  --coral: #ff6b6b;
  --amber: #ffcf5c;
  --mint:  #2bd9a4;
  --sky:   #52c7f5;

  /* Schrift */
  --font-display: "Outfit", system-ui, -apple-system, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;

  /* Form */
  --radius:    18px;
  --radius-sm: 12px;

  /* Standard-Akzent (wird pro Karte/Spiel überschrieben) */
  --akzent: var(--sky);
}

/* Akzent-Zuordnung: data-farbe="coral" -> --akzent wird coral usw. */
[data-farbe="coral"] { --akzent: var(--coral); }
[data-farbe="amber"] { --akzent: var(--amber); }
[data-farbe="mint"]  { --akzent: var(--mint);  }
[data-farbe="sky"]   { --akzent: var(--sky);   }