:root {
  /* Unverzichtbare Marken-Tokens (Regel A2) */
  --brand: #ea580c;                       /* Primary Solid Orange (used for Solid CTAs) */
  --brand-rgb: 234, 88, 12;               /* For alpha opacity usage */
  --brand-gradient: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
  --status-ok: #10b981;                   /* Safe Green (resolved trust/security color) */
  --status-ok-rgb: 16, 185, 129;
  
  /* Usability Functional Color (Not Brand Accent, left purple for maximum image visibility) */
  --mask-brush: rgba(168, 85, 247, 0.25); /* Kept purple for functional contrast in drawing canvas */

  /* Neutrale Design-Tokens */
  --surface: #ffffff;
  --bg: #fcfbfa;
  --text: #1c1a19;
  --text-muted: #6e6b67;                  /* Darker muted text in light mode for WCAG compliance */

  /* Unified Brand Scale for Gradients / Multi-hue Stops */
  --brand-50: #fff7ed;
  --brand-100: #ffedd5;
  --brand-200: #fed7aa;
  --brand-300: #fdbb2f;                  /* Amber stop */
  --brand-400: #ff7a1a;                  /* Bright orange stop */
  --brand-600: #ea580c;                  /* Red-orange stop */
  --brand-700: #c2410c;
  --brand-800: #9a3412;
  --brand-900: #7c2d12;
  --brand-950: #431407;
}

.dark, html.dark {
  --surface: #111311;
  --bg: #0c0d0c;
  --text: #e6e4e2;
  --text-muted: #8c8985;                  /* Lighter muted text in dark mode for WCAG compliance */
}