/* Design-Tokens: 1:1 aus design_handoff_pixit_website/README.md übernommen. */
:root {
  --color-bg: #e9eaea;
  --color-ink: #101112;
  --color-ink-soft: rgba(16, 17, 18, 0.62);
  --color-ink-faint: rgba(16, 17, 18, 0.45);
  --color-accent: #dcf23a;
  --color-accent-dark: #cbe22c;
  --color-white: #fff;
  --color-card-line: rgba(16, 17, 18, 0.1);
  --gradient-accent: linear-gradient(165deg, #dcf23a, #cbe22c);
  --gradient-chrome: linear-gradient(180deg, #fdfdfd, #e2e4e5 52%, #f6f7f7);
  --gradient-dark: radial-gradient(120% 90% at 50% 10%, #1c1e1f, #0c0d0e 70%);

  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 30px;
  --radius-xl: 36px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(16, 17, 18, 0.04), 0 18px 40px -30px rgba(16, 17, 18, 0.5);
  --shadow-card-hover: 0 26px 50px -30px rgba(16, 17, 18, 0.35);

  --font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", monospace;

  --ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);

  /* Spacing-Skala (4px-Raster). Für neue Komponenten gedacht; bestehende,
     bereits hartkodierte Abstände wurden beim Designsystem-Umbau nicht
     rückwirkend ersetzt, um keine unnötig große, rein kosmetische Diff
     ohne funktionalen Nutzen zu erzeugen. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 48px;

  /* Referenz-Breakpoints (nicht als var() in @media nutzbar – CSS erlaubt das
     nicht ohne Präprozessor; hier als verbindliche, dokumentierte Werte für
     alle @media-Regeln im internen Bereich, siehe Abschnitt 23 des Auftrags). */
  --bp-mobile: 480px;
  --bp-tablet: 768px;
  --bp-laptop: 1024px;
  --bp-desktop: 1280px;
  --bp-wide: 1440px;

  /* Semantische Status-Farben: konsolidiert aus wiederholt hartkodierten
     Hex-Paaren in intern.css/workspace_shell.css (Badges, Ampeln, Panels).
     Gleiche Werte wie zuvor – keine visuelle Änderung, nur eine
     gemeinsame Quelle statt Dutzenden Wiederholungen. */
  --status-positive-soft-bg: #eaf5c9;
  --status-positive-soft-ink: #46600a;
  --status-positive-dot: #4a7a1f;
  --status-warning-bg: #fdf0d9;
  --status-warning-ink: #8a5a10;
  --status-warning-accent: #c07a15;
  --status-danger-bg: #fbe2df;
  --status-danger-ink: #8a2a0f;
  --status-danger-accent: #a6390f;
  --status-info-bg: #e6f0fb;
  --status-info-ink: #2a5aa0;
  --status-neutral-bg: #f1f2f2;
  --status-neutral-ink: rgba(16, 17, 18, 0.5);
  --status-accent-orange-bg: #fde9d9;
  --status-accent-orange-ink: #b25a1f;
  --status-accent-purple-bg: #f0e9fb;
  --status-accent-purple-ink: #6a3fa0;
  --status-accent-pink-bg: #fbe6ea;
  --status-accent-pink-ink: #a0335a;

  /* Destruktive Aktionen (Löschen etc.) – bewusst kräftigeres Rot als
     --status-danger-*, das für ruhigere Status-Badges gedacht ist. */
  --color-danger: #d64545;
  --color-danger-dark: #b03030;
  --color-danger-soft-bg: #fbe8e8;

  /* Wiederkehrende neutrale Oberflächen-/Hover-Farben im internen Bereich. */
  --color-surface-muted: #f4f6f6;
  --color-ink-hover: #2a2c2e;
  /* Nur noch als Trennlinienfarbe verwendet (Divider brauchen keinen Text-
     kontrast). Der zugehörige Überschriftentext nutzte ursprünglich denselben
     Wert (~1.6:1 Kontrast auf Weiß, klarer WCAG-AA-Verstoß für echten
     Heading-Text) – in Phase I auf rgba(16,17,18,.78) korrigiert, siehe
     .px-ws-section-head h2 in workspace_shell.css. */
  --color-section-head-muted: #c4c4c4;
}