/* ===========================================================================
   Design-Tokens v2.0 „Terminal trifft Frucht"

   Die Werte, aus denen alles Weitere folgt. Wer dieses System für einen
   anderen Dienst übernimmt, ändert hier drei Zeilen — den Akzent — und ist
   fertig. Alles andere ist bewusst neutral gehalten.

   Die Variablen heißen `--accent`, nicht `--kiwi`: Der Name soll die Rolle
   beschreiben, nicht die Marke. Sonst steht in einer Kopie für einen anderen
   Dienst überall eine Frucht, die es dort nicht gibt.

   Herkunft: 1337.kiwi. Der Live-Stand steht in `assets/style.css`
   (neutral, kommt von flatlink) und `assets/custom.css` (die Marke darüber).
   Änderungen dort und hier gehören zusammen.
   =========================================================================== */

:root {
    color-scheme: light dark;

    /* --- Grundfarben ------------------------------------------------------
       Schwarz-Weiß plus EINE Signalfarbe. Der Akzent ist Signal, nie Tapete:
       Auf einem Bildschirm gibt es genau eine gefüllte Akzentfläche, und das
       ist die Hauptaktion. Alles andere trägt ihn höchstens als Rand. */
    --paper: #FAFCF6;        /* Seitengrund */
    --surface: #F1F6E9;      /* Karten, Flächen */
    --ink: #101408;          /* Text und Ränder – kein reines Schwarz */
    --muted: #5A6350;        /* Sekundärtext */
    --line: #DCE4D0;         /* Trennlinien */

    /* --- Der Akzent: hier wird umgefärbt ---------------------------------
       Drei Werte, die zusammengehören:
         --accent       die Signalfarbe selbst (Flächen, Ränder)
         --accent-deep  dieselbe Farbe als TEXT auf hellem Grund. Sie muss
                        dunkler sein, sonst ist der Kontrast zu schwach —
                        das ist kein Geschmack, sondern WCAG AA.
         --accent-tint  sehr blasse Tönung für Hover und markierte Zeilen
       1337.kiwi: #7ABA1C / #507A14 / #E9F4DA (Kiwi-Grün)
       flatlink:  #3B6EA8 / #2C5480 / #E8EFF7 (neutrales Blau) */
    --accent: #7ABA1C;
    --accent-deep: #507A14;
    --accent-tint: #E9F4DA;

    /* --- Form -------------------------------------------------------------
       Kantig und flach. Radius höchstens 6 px, und Schatten gibt es nur als
       harten Versatz ohne Weichzeichnung (siehe .btn-primary in
       components.css) — ein weicher Schlagschatten wäre eine andere Sprache. */
    --radius: 6px;

    /* --- Schrift ----------------------------------------------------------
       Mono für alles Produkthafte: Marke, Adressen, Codes, Schaltflächen,
       Zahlen, Beschriftungen. Grotesk für Fließtext. Die Trennung ist die
       halbe Miete des Erscheinungsbilds — sie macht aus einer gewöhnlichen
       Seite eine, die nach Werkzeug aussieht. */
    --mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Menlo, Consolas, monospace;
    --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* --- Dunkler Modus --------------------------------------------------------
   Nicht invertiert, sondern eigens gesetzt: Ein umgedrehtes Grün wird giftig,
   und ein umgedrehtes Papierweiß wird zu tiefem Schwarz, auf dem die Schrift
   flimmert. Der Akzent wird heller UND etwas weniger gesättigt. */
@media (prefers-color-scheme: dark) {
    :root {
        --paper: #0D110A;
        --surface: #151B10;
        --ink: #EAF2DF;
        --muted: #97A488;
        --line: #26301C;
        --accent: #99D73C;
        /* Auf dunklem Grund ist „deep" der HELLERE Wert – die Rolle bleibt
           „Akzent als Text", die Richtung dreht sich um. */
        --accent-deep: #BAE878;
        --accent-tint: #1B2611;
    }
}
