:root {
  /* Premium light — warm, airy, not dark */
  --bg: #fafaf8;
  --bg-elevated: #ffffff;
  --bg-card: #ffffff;
  --bg-soft: #f3f2ef;
  --surface: rgba(15, 23, 42, 0.035);
  --surface-hover: rgba(15, 23, 42, 0.06);

  --gold: #b8943f;
  --gold-soft: #8a6d2b;
  --gold-glow: rgba(184, 148, 63, 0.22);
  --accent: #1a8a80;
  --accent-dim: rgba(26, 138, 128, 0.1);

  --ink: #0f172a;
  --ink-footer: #1a2332;
  --text: #1e293b;
  --muted: #64748b;
  --line: rgba(15, 23, 42, 0.1);
  --line-strong: rgba(15, 23, 42, 0.16);

  --warn: #9a3412;
  --warn-bg: #fff7ed;
  --star: #d97706;

  --teal: var(--accent);
  --teal-dark: #0d5c56;
  --teal-accent: var(--accent);
  --teal-light: #e6f5f3;
  --teal-mint: #eef8f6;
  --mint: var(--accent);
  --paper: var(--bg-elevated);
  --paper-2: var(--bg);
  --accent-hover: #146b63;
  --bulk-border: #34a88e;
  --bulk-bg: linear-gradient(135deg, #ecfdf5, #f0fdf9);

  --radius: 18px;
  --radius-sm: 12px;
  --shadow: 0 12px 40px rgba(15, 23, 42, 0.08);
  --shadow-glow: 0 8px 32px var(--gold-glow);

  --font-sans: "DM Sans", system-ui, sans-serif;
  --font-display: "Syne", system-ui, sans-serif;
  --max: 1240px;
  --header-h: 72px;

  /* ====================================================================
     PeptiX Redesign — neue Tokens (Audit/Design-Vorschlag, Phase 1)
     Rein additiv: keine bestehenden Werte oben werden verändert, damit
     index.html (Coming-Soon-Seite, nutzt nur tokens.css + coming-soon.css)
     unverändert bleibt. Aktiviert wird die neue Palette ausschließlich über
     [data-page]-Overrides in css/redesign.css (siehe dort).
     ==================================================================== */
  --primary: #1d3557;       /* Labor-Blau statt Gold — 9.8:1 auf #fff */
  --primary-soft: #e8edf4;
  --primary-dark: #142540;

  --accent-aa: #0f7a6e;     /* Teal, AA-sicher für Normaltext — 5.2:1 auf #fff */
  --accent-aa-dark: #0b5a51;
  --accent-aa-soft: #e3f3f0;

  --muted-aa: #586174;      /* ersetzt zu helles #9ca3af — 5.1:1 auf #fff */

  --coa-verified: #0f7a6e;
  --coa-pending: #94600a;
  --coa-pending-bg: #fdf3e0;
  --danger: #b3261e;

  --font-display-2: "Space Grotesk", system-ui, sans-serif;
  --font-ui: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;
  --touch-min: 44px;
  --radius-btn: 10px;

  --bp-xs: 380px; --bp-sm: 540px; --bp-md: 768px; --bp-lg: 1024px; --bp-xl: 1280px;
}