/* ═══════════════════════════════════════════════════════════════════════════
   Pöbel & Gesocks — Farbpalette
   Alle Farben ausschließlich aus der offiziellen Palette.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
    /* ── Palette (exakt) ── */
    --p1: #BBC0C3;   /* Hellgrau   — Haupttext                  */
    --p2: #929BA0;   /* Mittelgrau — Sekundärtext                */
    --p3: #68767E;   /* Dunkelgrau — gedämpft, Icons             */
    --p4: #546068;   /* Tief       — Borders, sehr gedämpft      */
    --p5: #19232D;   /* Fast Schwarz — Hintergrund               */
    --p6: #BF1A2E;   /* Rot        — Akzent                      */

    /* ── Abgeleitete UI-Farben (nur Mischungen der 6 Palettenwerte) ── */
    --ui-bg:       var(--p5);
    --ui-card:     color-mix(in srgb, var(--p5) 88%, var(--p4));   /* Karten-BG    */
    --ui-input:    color-mix(in srgb, var(--p5) 78%, var(--p4));   /* Input-BG     */
    --ui-border:   color-mix(in srgb, var(--p5) 52%, var(--p4));   /* Trennlinien  */
    --ui-red-dim:  color-mix(in srgb, var(--p6) 45%, var(--p5));   /* Rot gedämpft */
    --ui-red-glow: color-mix(in srgb, var(--p6)  8%, transparent); /* Roter Schimmer */
}