/* ============================================================================
   KILLINFLUENCER — Design-Tokens
   ---------------------------------------------------------------------------
   Die EINZIGE Stelle, an der Farben, Abstände und Radien definiert werden.
   Alles andere greift ausschließlich über var(--… ) zu.

   Farbwelt:
     KILL = Blutrot (Blut, Tod, Totenkopf)
     LOVE = Lebensgrün (helles Grün, das für Leben und Rettung steht)
     TOT  = Grau (beerdigt)
     GOLD = Aufmerksamkeit (Rang, Links, Hinweise)

   Rot gegen Grün ist die älteste Paarung überhaupt: Tod gegen Leben.
   Beide sind zusätzlich entsättigungs- und farbfehlsichtigkeits-fest, weil
   jede Stelle ihr Symbol trägt (💀 / 💚).

   Von jeder Akzentfarbe gibt es drei Varianten:
     --x        Vollton für Text, Rahmen, Flächen
     --x-dark   dunkler Verlaufspartner
     --x-rgb    Werte-Tripel für Transparenz:  rgb(var(--x-rgb) / .15)
   ========================================================================== */

:root {
    color-scheme: dark;              /* Formular-Steuerelemente & Scrollbars dunkel */

    /* ------------------------------ Akzente -------------------------------
       KILL ist sattes Blutrot (dunkel, hart, aggressiv).
       LOVE ist bewusst HELL: ein frisches Grün, das auf dem dunklen Grund
       leuchtet und den Gegenpol zu Blutrot bildet — Leben gegen Tod.
       Deshalb gibt es zwei zusätzliche Varianten, damit helle Flächen
       überall funktionieren:
         --love-dark     mittleres Grün für Verläufe und Formular-Steuerelemente
                         (weißes Häkchen muss darauf sichtbar bleiben)
         --love-contrast Textfarbe AUF einer hellen LOVE-Fläche
       ---------------------------------------------------------------------- */
    --kill:          #e01e37;        /* Blutrot */
    --kill-dark:     #8b0f1c;
    --kill-rgb:      224 30 55;

    --love:          #7ee787;        /* helles Lebensgrün */
    --love-dark:     #43a55f;        /* mittleres Grün (Verläufe, Controls) */
    --love-rgb:      126 231 135;
    --love-contrast: #06280f;        /* Text auf heller LOVE-Fläche */

    --dead:          #7a7a8c;        /* beerdigt */
    --dead-dark:     #4a4a58;
    --dead-rgb:      122 122 140;

    --gold:          #ffd400;        /* Rang, Links, Warnhinweise */
    --gold-rgb:      255 212 0;

    /* --------------------------- Neutrale Flächen ------------------------- */
    --bg:          #08080a;
    --bg-soft:     #0f0f13;
    --panel:       #14141a;
    --panel-2:     #1b1b23;
    --line:        #2a2a35;
    --line-strong: #3d3d4d;

    --surface-deep: #060608;    /* Footer */
    --surface-tape: #0b0b0e;    /* Live-Ticker */
    --track:        #0a0a0d;    /* Schienen der Fortschrittsbalken */

    /* ------------------------------ Texttöne ------------------------------ */
    --text:        #ececf1;
    --text-soft:   #c3c3d0;
    --text-note:   #d8d8e2;     /* Hinweisboxen */
    --text-legal:  #c9c9d6;     /* Aufzählungen im Rechtstext */
    --text-dim:    #b9b9c7;     /* leiser Fließtext (Ticker) */
    --text-faint:  #a9a9b8;     /* Footer-Absätze */
    --muted:       #8b8b9c;

    /* ------------------- Text auf Vollton- und Sonderflächen -------------- */
    --on-kill:     #ffffff;     /* auf Blutrot */
    --on-gold:     #111111;     /* auf Gold */
    --on-deep:     #111111;     /* auf den gold-schwarzen Satire-Streifen */

    --flash-ok:    #e8ffef;     /* Meldungstexte auf getönten Flächen */
    --flash-err:   #ffb9c1;
    --flash-info:  #ffe89a;
    --stamp-dead-text: #e8e8f2;

    /* ------------------------------ Poster --------------------------------- */
    --poster-from: #16161c;
    --poster-to:   #0d0d11;
    --poster-line: #46465a;

    /* ------------------------------- Status ------------------------------- */
    --status-running:   #cfcfdb;
    --status-saved:   var(--love);
    --status-killed:    var(--dead);

    /* ------------------------------- Abstände ----------------------------- */
    --space-1:  .35rem;
    --space-2:  .6rem;
    --space-3:  1rem;
    --space-4:  1.5rem;
    --space-5:  2.5rem;

    /* --------------------------- Radien & Rahmen -------------------------- */
    --radius-sm:   8px;
    --radius:      14px;
    --radius-pill: 999px;

    /* ------------------------------ Typografie ---------------------------- */
    --mono: ui-monospace, "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
    --sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

    /* ---------------------- Stempel: Umbruch & Schrift ---------------------
       Die Stempel-Labels sind lang geworden (FREIGEKAUFT, HINGERICHTET statt
       SAVED, KILLED). Auf schmalen Karten und Postern darf der Stempel deshalb
       umbrechen und sich verkleinern, statt seitlich aus dem Container zu
       laufen. Die Steuerung übernehmen die Regeln in components.css bzw.
       responsive.css — hier stehen nur die Grundeinstellungen. */
    --stamp-wrap: nowrap;
    --stamp-break: normal;
    --stamp-size: 1.15rem;
    --stamp-size-big: clamp(1.35rem, 4.4vw, 2.2rem);

    /* ------------------------------- Effekte ------------------------------ */
    --glow-kill: 0 0 28px rgb(var(--kill-rgb) / .45);
    --glow-love: 0 0 28px rgb(var(--love-rgb) / .45);
    --shadow-card: 0 18px 50px -34px rgb(0 0 0 / .9);
}