:root{
    --canvas:#262b33; --ink:#e6eaf2; --ink2:#a9b3c4; --ink3:#78829a;
    --hi:rgba(255,255,255,.06); --lo:rgba(0,0,0,.5);
    --cyan:#4fc3e8; --violet:#a78bfa;
    --win:#46c07a; --loss:#e0616a; --amber:#d9a441; --spike:#e07850;
    /* Mate-Score-Skala (KONZEPT §2c). „Wie üblich" (50–59) ist GRÜN, alles
       darüber lila — 50 ist der Normalfall (Median über 4.523 Spiele: 51,1),
       kein Mangel. Zwei Lila-Stufen, damit „stärker" und „deutlich stärker"
       unterscheidbar bleiben. Beide gegen den Pillen-Untergrund geprüft:
       --mate-up 5,2:1, --mate-up2 6,9:1 auf --canvas. */
    --mate-up:#a78bfa; --mate-up2:#d5a8ff;
    /* --hm-neut ist die MITTE der Divergenz-Skala (genau 50 % WR). Sie muss
       deutlich heller sein als eine LEERE Zelle (.cell.null) — sonst liest ein
       50-%-Slot sich wie „nie gespielt". Zielkontrast ≥ 2,5:1 gegen .cell.null. */
    --hm-warm:#d95f3f; --hm-cool:#4d84e0; --hm-neut:#626b7d;
    /* Leere Zelle: eigener, klar dunklerer Ton + Schraffur (siehe .cell.null). */
    --hm-null:#1b1f26;
    --team-b:#4fc3e8; --team-r:#e0716a;
    --grid:#343b46; --axis:#3e4653;
    /* ---------------------------------------------------------------
       DIAGRAMMFARBEN (Umbau 6/6). Bis 28.07.2026 stand die Palette als
       Tabelle PALETTES im JavaScript — je Skin ein eigener Satz. Ein
       neues Skin brauchte damit zwingend eine JS-Änderung. Jetzt steht
       jede Farbe hier, und pal() in js/core/state.js liest sie zur
       Zeichenzeit. Ein neues Skin ist ab hier reines CSS.

       Was NICHT hier steht, steht mit Absicht nicht hier: Sieg und
       Niederlage (--win/--loss), die Divergenz-Skala der Heatmap
       (--hm-warm/--hm-cool/--hm-neut) und die Mate-Score-Stufen sind
       BEDEUTUNGSfarben. Sie sind oben definiert und bleiben dort — ein
       späteres Skin soll sie nicht als Zierfarbe umdeuten können.
       Frei sind nur die Zierfarben: kategoriale Serien und Hilfslinien.

       --chart-surf ist der Flächenton UNTER dem Diagramm. Er wird als
       Halo um Endpunkte und Datenpunkte gezeichnet, damit ein Punkt auf
       der Linie nicht mit ihr verschmilzt — er muss deshalb dem echten
       Untergrund der Karte entsprechen (Neo: die Karte selbst).

       ACHTUNG: --hm-warm/--hm-cool/--hm-neut werden in JavaScript
       GEMISCHT (mix()/hx() in js/view/render.js parsen #rrggbb). Sie
       müssen Hex bleiben — rgb(), hsl() oder color() brechen die
       Heatmap still. */
    --chart-surf:var(--canvas);
    --chart-cat1:var(--cyan); --chart-cat2:var(--violet); --chart-cat3:#e8925a;
    --chart-ref:#5c667c;
    --r:18px; --rw:14px;
    /* Vertikaler Rhythmus: EIN Abstand zwischen allen Karten, EIN Innenabstand. */
    --gap:22px; --pad:20px; --padx:22px;
  }