/* Bunk-Media-Design-Tokens — gemeinsame Quelle für Builder (app.css)
   und Kundenansicht (kunde.css). Farbwerte sind das führende CD
   (Anthrazit/Papier/Gold); Skalen für Radius, Dauer und Typo geben
   neuen Styles eine Heimat, Bestandswerte wandern schrittweise um. */

:root {
  /* Grundfarben */
  --ink: #111111;        /* Anthrazit — Text, Topbar, Primär-Buttons */
  --ink-soft: #4b4a47;   /* gedämpfter Text (Hints, Meta) */
  --paper: #faf9f6;      /* Seiten-Hintergrund */
  --bone: #f4f1ea;       /* ruhige Fläche (Progress-Track, Hover) */
  --gold: #b8925a;       /* Akzent */
  --gold-dark: #7d5d35;  /* Akzent auf hellem Grund (kontrastfest) */
  --gold-soft: #f5ede1;  /* Akzent-Fläche (Badges, aktive Chips) */
  --gold-20: #b8925a33;  /* Akzent 20 % (Fokus-Schimmer, zarte Rahmen) */

  /* Flächen: genau zwei warme Abstufungen statt fünf Beige-Tönen */
  --surface-hint: #faf8f3;  /* Hinweis-/Empfehlungsflächen */
  --surface-warm: #fffaf0;  /* Warn-/Aktion-nötig-Flächen (warm) */

  /* Linien: Standard, kräftig (Inputs), mittel (Trennkanten) */
  --line: #e5e1d8;
  --line-strong: #8f8d86;
  --line-mid: #d8d1c5;

  /* Status */
  --error: #b3261e;
  --error-soft: #fdf1f0;
  --ok: #2c6b2f;
  --ok-soft: #eef6ec;
  --focus-ring: #0a766d;

  /* Radien */
  --r-s: 8px;
  --r-m: 12px;
  --r-l: 16px;
  --r-xl: 24px;
  --r-pill: 999px;

  /* Schatten */
  --shadow-card: 0 8px 26px #11111108;
  --shadow-lift: 0 18px 44px #11111114;
  --shadow-pop: 0 30px 90px rgb(0 0 0 / .55);

  /* Bewegung */
  --t-fast: .15s;
  --t-slow: .3s;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
}