/* Gemeinsame Design-Tokens für die öffentliche Karte und die statischen Seiten.
   Bis 2026-09-01 hielt jedes der vier Dokumente seine eigene :root-Kopie; die
   Werte waren dabei auseinandergelaufen (--subtle stand auf #666 und #6b6357).
   Eine Datei, ein Wert, vier Konsumenten. */

:root {
    /* Die Seite hat nur ein helles Design. Ohne diese Angabe rendert der
       Browser native Controls (Select-Popup, Scrollbars, Autofill) im
       System-Dark-Mode dunkel — NiceGUI setzte dafuer frueher ein
       <meta name="color-scheme">, das beim Frontend-Wechsel entfiel. */
    color-scheme: light;

    /* Farben */
    --c: #1a1a1a;          /* Text, Rahmen, Schatten */
    --bg: #FFF4E0;         /* Seitenhintergrund */
    --paper: #FFFAF0;      /* Kartenflächen auf --bg */
    --accent: #FFC145;     /* Buttons, Marker-Highlights */
    --title: #FF6B6B;      /* Headline, Ergebniszahl, Flächen */
    --green: #7DD3A0;
    --cyan: #4DEEEA;       /* "← Alle", hebt sich von den gelben Buttons ab */
    --subtle: #666;        /* Sekundärtext, 5.27:1 auf --bg */
    --surface: #fff;       /* Cards, Controls, Popups; auch Schrift auf --c */
    --disabled: #eaeaea;   /* gesperrte Controls */
    --warning: #FFD93D;    /* Standort-Toast */

    /* Schriften. Ein Theme tauscht sie hier statt an jeder Regel. */
    --font-body: 'Space Mono', monospace;
    --font-heading: 'Archivo Black', sans-serif;
    --font-display: 'Bungee', cursive;
    --font-card: 'Space Grotesk', sans-serif;

    /* Entsättigt die OSM-Kacheln Richtung Papierton. */
    --tile-filter: grayscale(.6) sepia(.25) contrast(1.05) brightness(1.02);

    /* Schriftgrößen. Feste px statt rem, damit dieselbe Rolle auf allen vier
       Seiten dieselbe Zahl bekommt. */
    --fs-xs: 10px;
    --fs-sm: 11px;
    --fs-md: 12px;
    --fs-lg: 13px;
    --fs-body: 14px;
    --fs-h4: 15px;
    --fs-h3: 17px;
    --fs-h2: 21px;
    --fs-display: 40px;

    /* NeoBrutalism-Physik: 2px an Controls, 3px an schwebenden Panels,
       4px an Karten, 6px an den Hauptflächen. */
    --border: 2px;
    --border-thick: 3px;
    --shadow-control: 2px 2px 0 var(--c);
    --shadow-panel: 3px 3px 0 var(--c);
    --shadow-card: 4px 4px 0 var(--c);
    --shadow-surface: 6px 6px 0 var(--c);
}

/* Native Controls erben die Schrift nicht von body — das UA-Stylesheet setzt
   Arial auf button/select/input, und eine UA-Regel auf dem Element selbst
   gewinnt gegen Vererbung. */
button, select, input, textarea { font-family: inherit; }

/* Gleicher Fokus-Indikator auf allen Seiten statt des blau-weißen
   Browser-Standardrings. */
a:focus-visible, button:focus-visible, select:focus-visible, [tabindex]:focus-visible {
    outline: var(--border-thick) solid var(--c);
    outline-offset: 2px;
}
/* Auf Touchgeraeten nicht. WebKit setzt :focus-visible auch nach einem Tap,
   und der Ring blieb danach am Stadt-Dropdown stehen, obwohl die
   Press-Bewegung (.neo-select:active) laengst zurueckgesprungen war. Getastet
   wird auf diesen Geraeten ohnehin nicht; der Preis ist ein Tablet mit
   angesteckter Tastatur, das den Indikator mit verliert, weil any-pointer
   nur die Art des Zeigegeraets kennt. */
@media (any-pointer: coarse) {
    a:focus-visible, button:focus-visible, select:focus-visible, [tabindex]:focus-visible {
        outline: none;
    }
}
