/* Zentrale Design-Tokens. Einzige Stelle mit Farbwerten (siehe DESIGN.md). */
:root {
  /* Marke */
  --accent:        #E53935;
  --accent-strong: #B71C1C;
  --accent-dark:   #8E1414;
  --accent-soft:   rgba(183,28,28,.10);
  --accent-softer: rgba(183,28,28,.05);
  --accent-ring:   rgba(183,28,28,.22);
  --gelb:          #F2B705;
  --gelb-soft:     #FFF1C2;
  --gelb-ring:     rgba(242,183,5,.55);

  /* Flächen: kein reines Weiß */
  --bg:        #E7E3DF;
  --surface:   #F8F6F3;
  --surface-2: #F0ECE7;
  --surface-3: #E2DDD6;
  --border:        rgba(26,18,12,.17);
  --border-strong: rgba(26,18,12,.38);

  /* Schrift */
  --text:   #0E0A07;
  --text-2: #221A14;
  --text-3: #3D332C;

  /* Status-Ampel: nur für Status */
  --ok-bg:   #DCF0E5; --ok-fg:   #14603F;
  --warn-bg: #FDE6D2; --warn-fg: #8A3E00;
  --bad-bg:  #F6DCE3; --bad-fg:  #7A1631;
  --info-bg: #DEE9F7; --info-fg: #234D80;

  --radius-sm: 8px; --radius: 12px; --radius-lg: 16px;

  /* Schatten und Glas (keine Farbtokens, nur Alpha-Werte) */
  --shadow-kopf: 0 8px 14px -12px rgba(26,18,12,.30);
  --glas-rand: rgba(255,255,255,.55);
  --glas-fond: linear-gradient(135deg, rgba(255,255,255,.60), rgba(255,255,255,.32));
  --glas-schatten: 0 10px 30px rgba(26,18,12,.13), 0 2px 8px rgba(26,18,12,.06), inset 0 1px 0 rgba(255,255,255,.9);
  --kopf-ueberlagerung: rgba(26,18,12,.12);
  --dialog-schleier: rgba(14,10,7,.45);
  --primaer-schrift: #FBF8F5; /* weiße Schrift auf dem Primärknopf (kein #fff) */

  --kopf-h: 60px;
  --seiten-kopf-h: 64px;
}

html[data-theme="dark"] {
  --accent:#FF6B5E; --accent-strong:#E5483B; --accent-dark:#C93A2E;
  --accent-soft:rgba(255,107,94,.14); --accent-softer:rgba(255,107,94,.07); --accent-ring:rgba(255,107,94,.26);
  --gelb:#FFD24D; --gelb-soft:rgba(255,210,77,.16); --gelb-ring:rgba(255,210,77,.45);
  --bg:#17120F; --surface:#211A16; --surface-2:#2A221D; --surface-3:#332A24;
  --border:rgba(248,240,232,.20); --border-strong:rgba(248,240,232,.42);
  --text:#FBF8F5; --text-2:#EAE2DA; --text-3:#C9BDB2;
  --ok-bg:#14301F; --ok-fg:#8BE0B4; --warn-bg:#36230E; --warn-fg:#F5B377;
  --bad-bg:#34161C; --bad-fg:#F3A3B0; --info-bg:#16253A; --info-fg:#9EC2EE;

  --shadow-kopf: 0 8px 14px -12px rgba(0,0,0,.60);
  --glas-rand: rgba(248,240,232,.18);
  --glas-fond: linear-gradient(135deg, rgba(248,240,232,.10), rgba(248,240,232,.04));
  --glas-schatten: 0 10px 30px rgba(0,0,0,.45), 0 2px 8px rgba(0,0,0,.30), inset 0 1px 0 rgba(248,240,232,.12);
  --kopf-ueberlagerung: rgba(248,240,232,.06);
  --dialog-schleier: rgba(0,0,0,.65);
}