/* Boxenfunk ueber vier Ansichten — Ebene 1: Grund (Plan 2026-10-01, Schritt 1).
   Greift NUR unter html[data-design="boxenfunk"] — steht seit 06.10. fest in den HTML-Seiten.
   Ohne Wahl aendert sich nichts. Layoutwerte nur in eigenen @media-Bloecken
   (`html[data-design] .x` schlaegt jede `.x`-Regel in mobile.css).
   Stil: TV-Rennuebertragung / Boxenfunk — Vollflaechen ohne Rahmen, angeschnittene
   Ecken, gelbe Schraeg-Tabs, Barlow Condensed kursiv + Titillium Web. Fortsetzung von
   css/design-boxenfunk.css (Telemetrie, Tokens --bf-* und Schriften kommen von dort).
   ⚠ Die Seiten-Tokens (--font-*, --card, --radius …) gelten NICHT auf der Telemetrie-
   Seite: dort bleibt der Boxenfunk exakt wie gebaut (Plan: „Telemetrie-Boxenfunk bleibt
   wie er ist"; telemetrie.css nutzt die Tokens 53x). Darum `body:not(:has(.tele-view))`. */

/* ---------- Palette + Bereichsfarben (auch fuer JS-Haken auf <html>) ---------- */
html[data-design="boxenfunk"] {
  --bx-b-lizenz: #34e36f;
  --bx-b-ram: #ff4646;
  --bx-b-academy: #4aa3ff;
  --bx-b-sonst: #ffdc1f;
  --bx-neutral: #f4f7fc;
  /* Diagramm-Achsen (js/components/_dia_balken.js liest den Faktor von <html>). */
  --dia-schrift: 1.4;
  /* Schraeg-Flaeche fuer grosse Panels: zwei angeschnittene Ecken per Verlauf (kein
     clip-path, der wuerde Hinweis-Blasen abschneiden — design-boxenfunk.css:145). */
  --bx-ecke: 14px;
  --bx-flaeche:
    linear-gradient(225deg, transparent var(--bx-ecke), var(--bf-panel) calc(var(--bx-ecke) + .5px)) top right / 51% 51% no-repeat,
    linear-gradient(45deg, transparent var(--bx-ecke), var(--bf-panel) calc(var(--bx-ecke) + .5px)) bottom left / 51% 51% no-repeat,
    linear-gradient(var(--bf-panel), var(--bf-panel)) top left / 51% 51% no-repeat,
    linear-gradient(var(--bf-panel), var(--bf-panel)) bottom right / 51% 51% no-repeat;
  --bx-schraeg: polygon(var(--bf-schraeg) 0, 100% 0, calc(100% - var(--bf-schraeg)) 100%, 0 100%);
  --bx-tab: polygon(0 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
}
/* Bewusst KEIN Hintergrund auf <html>: sonst wandert der body-Hintergrund nicht mehr auf
   die Leinwand, und die Telemetrie-Seite war unterhalb der ersten Bildschirmhoehe anders
   (gemessen 01.10.: 375.614 px Abweichung bei 1920). Schema + Rollbalken ebenso nur ausserhalb
   der Telemetrie (ihr Kurventabellen-Rollbalken bleibt wie gebaut). */
html[data-design="boxenfunk"]:not(:has(.tele-view)) { color-scheme: dark; scrollbar-color: #323c52 #07090e; }
html[data-design="boxenfunk"][data-bereich="lizenz"] { --bereich: var(--bx-b-lizenz); }
html[data-design="boxenfunk"][data-bereich="ram"] { --bereich: var(--bx-b-ram); }
html[data-design="boxenfunk"][data-bereich="academy"] { --bereich: var(--bx-b-academy); }
html[data-design="boxenfunk"][data-bereich="sonst"] { --bereich: var(--bx-b-sonst); }

/* ---------- Seiten-Tokens (ausser Telemetrie, siehe Kopf) ---------- */
html[data-design="boxenfunk"] body:not(:has(.tele-view)) {
  --font-display: var(--bf-display); --font-ui: var(--bf-text); --font-mono: var(--bf-display);
  --bg-0: var(--bf-bg); --bg-1: #0b0e16; --bg-2: #10141e;
  --card: var(--bf-panel); --card-strong: var(--bf-panel-2); --card-hover: #1e2637;
  --text: var(--bf-ink); --text-dim: var(--bf-ink-dim); --text-faint: #8f9ab0;
  --line: rgba(255, 255, 255, .07); --line-strong: rgba(255, 255, 255, .14);
  --radius: 0px; --radius-sm: 0px;
  --text-xs: 13px; --text-sm: 14px; --text-md: 15px; --text-lg: 18px; --text-xl: 24px;
  /* Kein Neon-Nebel: Glows aus, Verlaeufe flach (Signalgelb = Auswahl, Rot = Gegenfarbe). */
  --glow-cyan: none; --glow-magenta: none;
  --glow-soft: 0 12px 30px rgba(0, 0, 0, .55);
  --grad-main: linear-gradient(90deg, var(--bf-gelb), var(--bf-gelb));
  --grad-cyan: linear-gradient(90deg, var(--bf-gelb), var(--bf-gelb));
  --grad-magenta: linear-gradient(90deg, var(--bf-schlecht), var(--bf-schlecht));
  /* Podium wie TV-Grafik: Gold, Silber, Bronze — satt, ohne Leuchten. */
  --gold: #ffc21a; --silver: #dfe5ef; --bronze: #ef8f4f;
  font-family: var(--bf-text); color: var(--bf-ink);
}

/* ---------- Seitengrund: TV-Studio-Schwarz mit feiner Schraffur (wie Telemetrie) ---------- */
html[data-design="boxenfunk"] body {
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .014) 0 2px, transparent 2px 7px),
    linear-gradient(160deg, #0b0e16 0%, var(--bf-bg) 55%, #0a0c12 100%);
  background-attachment: fixed;
}
html[data-design="boxenfunk"] :is(.fx-grid, .fx-glow, .fx-scanlines) { display: none; }
html[data-design="boxenfunk"] ::selection { background: var(--bf-gelb); color: var(--bf-dunkel); }
html[data-design="boxenfunk"] select option,
html[data-design="boxenfunk"] select optgroup { background-color: var(--bf-panel); color: var(--bf-ink); }

/* Verlaufsschrift (Seitentitel) flach: Bereichsfarbe, sonst Weiss — kein Regenbogen. */
html[data-design="boxenfunk"] body:not(:has(.tele-view)) .grad-text {
  background: none; -webkit-background-clip: border-box; background-clip: border-box;
  color: var(--bereich, var(--bx-neutral));
}