:root{
/* --- Grund: Weiß, seit 06.09.2026 (Christofs Entscheidung, vorher Creme #EFEEEC).
   Die zwei Stufen darunter sind um denselben Betrag heller gerückt wie der Grund (L* +5,9),
   damit der Abstand zwischen Fläche und Karte gleich bleibt: cream-deep war #E6E5E2,
   cream-edge #D7D6D3. Farbton und Sättigung unverändert, nur die Helligkeit.
   Seit 06.09. abends kalt statt warm (Christof: „hat nen Warmstich"): b* von +1,5 auf -1,5
   gespiegelt, a* -0,3, Helligkeit unverändert (L* 96,9 / 91,6). Warm war #F7F6F3 / #E8E7E4.
   Damit zieht der Grund in dieselbe Richtung wie --murk, das schon kalt ist. --- */
--cream:#FFFFFF;
--cream-deep:#F4F6F9;
--cream-edge:#E5E7EA;
/* Formularfelder und Paketkästen ohne Kontur (06.09.). Derselbe Ton wie die Karten der
   Startseite (--cream-deep), Christofs Vorgabe; hover eine Stufe dunkler (L* 94,1, kalt). */
--field:var(--cream-deep);
--field-hover:#ECEEF1;

/* Schnittkante im Vergleichsregler. Solange der Grund Creme war, war dies der einzige Ort
   mit reinem Weiß: Creme las sich dort grau und schmutzig, Weiß liest sich als Kante zwischen
   zwei Drucken. Seit der Grund selbst weiß ist, fällt der Unterschied weg; der Token bleibt,
   weil er etwas anderes meint als eine Fläche. */
--cut:#FFFFFF;

/* Ink — Kontrastanker und alle Primärtexte */
--ink:#121212;
--ink-soft:#232323;
--ink-line:#3A3A3A;

/* Grau — der Zustand "Slop" und ALLE Hover. Nie im Seitengrund.
   Kalt und schwach gesättigt: a* -1,2 / b* -4,2, Chroma 4,2. Das liegt zwischen dem alten
   Blaugrau #5E6A72 (Chroma 6,6, las sich als ausgesuchte Farbe) und dem warmen Neutral
   #696866 (Chroma 1,3, las sich bei dieser Tiefe braun und schwer). Wenig Sättigung, aber
   eindeutig kalt — damit bleibt die Vorher-Farbe tot, ohne schlammig zu wirken, und ein
   kalter Hover konkurriert nicht mit der Limette.

   Zur Helligkeit: --murk ist bei L* 45,8 gedeckelt und nicht frei wählbar. Darauf steht
   Kleintext in Creme (die N-Kreise, die ProcessCard, die Murk-Karten), und bei L* 45,9
   fällt dieses Paar unter 4,5:1. Von 44,0 kommend sind das 1,8 Punkte — mehr ist ohne
   Wechsel der Textfarbe nicht zu haben. Die drei anderen Stufen sind nicht gedeckelt und
   steigen um rund 4 Punkte: 35,0 · 69,5 · 85,5.

   ACHTUNG bei --murk-wash: als Label auf --murk erreicht es 3,6:1 und bleibt damit unter
   AA. Das war vorher 3,4:1, ist also besser, aber nicht gelöst. Auf einer Murk-Fläche
   trägt selbst Creme nur 4,5:1 — es gibt dort baulich keine zweite, leisere Textstufe.
   Der richtige Ort für die Lösung ist die Verwendung, nicht der Token. */
--murk:#676D73;
--murk-deep:#4D5359;
--murk-pale:#A4ABB1;
--murk-wash:#CFD7DD;

/* Limette — der fertige Zustand. Ausschließlich Akzent, niemals Hover.
   Und niemals auf der Kundenanzeige: Trennstrich und Griff des Vergleichsreglers waren
   limette und lagen damit quer über fremder Arbeit. Sie sind jetzt creme. Der FIXED-Stempel
   bleibt limette — der ist die Aussage und liegt bewusst dort. */
--acid:#D7F033;
--acid-deep:#BCD41C;
--acid-dark:#8FA211;

/* --- Semantische Flächen --- */
--page-bg:var(--cream);
--page-bg-quiet:var(--cream-deep);
--surface-card:var(--cream-deep);
--surface-contrast:var(--ink);
--surface-slop:var(--murk);
--surface-accent:var(--acid);
--surface-input:var(--cream);

/* --- Bildplatzhalter: zwei Stufen, sofort unterscheidbar. Mit dem Grund um L* +5,9 heller
   gerückt (vorher #DCDBD9 und #C2C1BE). --- */
--media-slop:#EDECEA;
--media-slop-mid:#D2D1CE;
--media-slop-ink:#84837F;
--media-fixed:#1C1F21;
--media-fixed-soft:#2C3134;

/* --- Semantischer Text --- */
--text-primary:var(--ink);
--text-secondary:#575A5C;
/* #84878A erreichte auf --cream 3,12:1 und auf --cream-deep 2,87:1 — beides unter AA, und
   das an 36 Stellen quer über die Seite: Hilfetexte, Platzhalter im Formular, die Zeile
   „· optional", die Begriffe in den Rechtstext-Listen. Genau die Sorte Kleingedrucktes, die
   niemand prüft und jeder liest.
   #616467 hält Farbton und Sättigung des alten Werts (a* -0,5 / b* -2,0, dieselbe Stufung
   R+3 G+3 B) und senkt nur die Helligkeit von L* 56,2 auf 42,2. Damit 5,14:1 auf --cream und
   4,73:1 auf --cream-deep.
   ACHTUNG: --text-muted liegt damit nur noch 4 L*-Stufen über --text-secondary. Das ist kein
   Versehen, sondern die Decke: auf einem cremefarbenen Grund gibt es keine dritte, leisere
   Textstufe, die AA noch schafft. Die beiden trennen sich über Größe und Gewicht, nicht mehr
   über die Farbe — muted steht bei 11 bis 14 px, secondary bei 16. */
--text-muted:#616467;
--text-on-dark:var(--cream);
--text-on-dark-muted:#9A9C9E;
--text-on-slop:var(--cream);
--text-on-accent:var(--ink);
/* Nicht var(--acid-dark): der Ramp-Wert #8FA211 erreicht als Text auf --cream 2,47:1 und war
   damit ein Token, das beim Benutzen still durchfällt. #586E00 hält den Farbton der Limette
   (a* -23,4 / b* +63,1, Chroma 53) und senkt L* von 63,1 auf 43,1 — 4,97:1 auf --cream,
   4,57:1 auf --cream-deep. Es liest sich als dunkles Oliv und nicht mehr als Limette; das ist
   der Preis dafür, dass eine Akzentfarbe auf hellem Grund lesbar sein soll.
   --acid-dark bleibt unverändert, aber ausschließlich für Flächen und Linien. */
--text-accent:#586E00;

/* --- Linien --- */
--line-strong:var(--ink);
--line:#E0DED9; /* vorher #CFCEC9, mit dem Grund heller gerückt */
--line-on-dark:#3A3A3A;

/* --- Zustände: slop -> fixed --- */
--state-slop:var(--murk);
--state-slop-bg:var(--murk-wash);
--state-fixed:var(--acid);
--state-fixed-bg:var(--acid);
--state-pending:var(--murk-pale);

/* --- Fehler: rein semantisch, nie dekorativ, nie Fläche. Nur Kontur und Text. --- */
--error:#8E2A1C;
--error-line:#8E2A1C;

/* --- Interaktion: Hover ist grau. Nie Akzentfarbe. --- */
--hover-surface:var(--murk-deep);
--hover-surface-soft:var(--murk-wash);
--hover-text:var(--murk-deep);
--hover-on-dark:var(--murk-pale);
--hover-line:var(--murk);
--focus-ring:var(--ink);
--overlay-ink:rgba(18,18,18,.86);
}
