/* ============================================================================
   osp-kopf.v2.css — Kopf in vier Zonen, 44 px, dauerhaft sichtbar (Plan Kopf und Seitenleiste global AP-03, Zielbild 3.1)
   ----------------------------------------------------------------------------
   Ein Angebot, kein Zwang (G-2): wirkt NUR unter <header data-osp-kopf="v2">. v1 (osp-kopf.v1.css) bleibt unverändert und
   wird nicht gebraucht. Logik: /shared/osp-kopf.v2.js; Seitenleiste: osp-seitenleiste.v2.css/.js; Glocke: osp-glocke.v1.

   Pflichtmaße (Plan 3.1, Abnahme Abschnitt 8):
     Kopf 44 px, einzeilig, position: sticky; top: 0 — bleibt beim Scrollen und über Dialogen stehen.
     Rumpf darunter: height: calc(100dvh - 44px); gescrollt wird nur der Inhalt (.osp-rumpf).
     Vier Zonen per Grid: [ Zone 4 + Zone 3 : 1fr ] [ Zone 2 : feste Breite ] [ Zone 1 : 1fr ] — die beiden äußeren Spalten sind
     gleich breit, die Mitte liegt damit exakt in der Kopfmitte. In Zone 2 hält ein Grid (1fr · 34 px · 1fr) den Platz der
     Feedback-Kamera frei (feedback.js setzt sie in die Mitte von [data-osp-kopf-anker]).
     Zielflächen ≥ 24 px (Knöpfe 36 px, Kürzel 28 px hoch, Pille 24 px hoch, Krumen 29 px hoch).
     Größenstufe (UI-Standard §6, osp-ansicht.v1.css --osp-schrift 13 · 14 · 16 px): Krumen, App-Name (+2 px) und Menüs folgen
     ihr; die Höhe bleibt 44 px, Pille, Datum und Kürzel bleiben fest (Maße oben). Ohne osp-ansicht gilt 14 px.
   Kopffarbe je App: --osp-kopf-farbe (Standard #0070B0), dunkel --osp-kopf-farbe-dunkel (Standard #0A2F4D).

   Kontrast (WCAG 2.2, relative Luminanz, Text mindestens 4,5 : 1 — geprüft in tests/kopf-v2.test.mjs):
     weiß auf #0070B0 ................ 5,32 : 1   Kopf hell
     #E6F2FA auf #0070B0 ............. 4,68 : 1   Zweittext im Kopf (Datum, Trenner)
     weiß auf #0A2F4D ................ 13,76 : 1  Kopf dunkel;  #D6E6F2 auf #0A2F4D 10,78 : 1
     weiß auf #8F3208 ................ 8,05 : 1   neue Fassung (Pille eingefärbt)
     #0A2F4D auf #E6F2FA ............. 12,08 : 1  Kürzel hell;  #0A2F4D auf #D6E6F2 10,78 : 1 dunkel
     #1F2937 auf Weiß ................ 14,68 : 1  Menü hell;  #4B5563 auf Weiß 7,56 : 1;  #0070B0 auf Weiß 5,32 : 1
     #E5E7EB auf #1E293B ............. 11,82 : 1  Menü dunkel;  #CBD5E1 auf #1E293B 9,85 : 1;  #7CC4F2 auf #1E293B 7,69 : 1
     weiß auf #0070B0 (gewählte Größe/Dichte im Menü) 5,32 : 1
   ============================================================================ */

:root {
  --okopf2-h: 44px;
  --okopf2-mitte-b: 232px;                     /* Zone 2: (232 − 34 − 2 × 8) / 2 = 91 px je Hälfte */
  --okopf2-bg: var(--osp-kopf-farbe, #0070B0);
  --okopf2-text: #FFFFFF;
  --okopf2-text2: #E6F2FA;
  --okopf2-linie: #0080C9;                     /* nur Linie ohne Text */
  --okopf2-hover: rgba(0, 0, 0, .28);
  --okopf2-fokus: #FFFFFF;
  --okopf2-chip-bg: #E6F2FA;
  --okopf2-chip-text: #0A2F4D;
  --okopf2-neu-bg: #8F3208;
  --okopf2-punkt: #FFD27A;
  --okopf2-menue-bg: #FFFFFF;
  --okopf2-menue-text: #1F2937;
  --okopf2-menue-text2: #4B5563;
  --okopf2-menue-rand: #CBD5E1;
  --okopf2-menue-hover: #EAF3FA;
  --okopf2-link: #0070B0;
  --okopf2-fokus-menue: #0070B0;
  --okopf2-aktiv-bg: #0070B0;
  --okopf2-aktiv-text: #FFFFFF;
}
:root[data-theme="dark"], html.dark {
  --okopf2-bg: var(--osp-kopf-farbe-dunkel, #0A2F4D);
  --okopf2-text: #FFFFFF;
  --okopf2-text2: #D6E6F2;
  --okopf2-chip-bg: #D6E6F2;
  --okopf2-chip-text: #0A2F4D;
  --okopf2-menue-bg: #1E293B;
  --okopf2-menue-text: #E5E7EB;
  --okopf2-menue-text2: #CBD5E1;
  --okopf2-menue-rand: #475569;
  --okopf2-menue-hover: #17324A;
  --okopf2-link: #7CC4F2;
  --okopf2-fokus-menue: #7CC4F2;
}

body:has(> header[data-osp-kopf="v2"]) { margin: 0; }

/* ── Kopf: Grid, 44 px, steht immer ─────────────────────────────────────── */
header[data-osp-kopf="v2"] {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--okopf2-mitte-b) minmax(0, 1fr);
  align-items: center;
  column-gap: 8px;
  height: var(--okopf2-h);
  max-height: var(--okopf2-h);
  padding: 0 8px;
  position: sticky;                  /* Kopf scrollt nie mit (G-21); Dialoge und Menüs öffnen darunter */
  top: 0;
  z-index: 1000;
  background: var(--okopf2-bg);
  color: var(--okopf2-text);
  box-shadow: inset 0 -2px 0 var(--okopf2-linie);
  font-family: 'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: var(--osp-schrift, 14px);         /* folgt der Größenstufe (klein 13 · mittel 14 · groß 16 px) */
  line-height: 1.25;
  white-space: nowrap;
}
header[data-osp-kopf="v2"] *, header[data-osp-kopf="v2"] *::before, header[data-osp-kopf="v2"] *::after { box-sizing: border-box; }
header[data-osp-kopf="v2"] [hidden] { display: none !important; }

.okopf2-links, .okopf2-mitte-l, .okopf2-mitte-r, .okopf2-rechts { display: flex; align-items: center; min-width: 0; height: 100%; }
.okopf2-links { gap: 10px; justify-content: flex-start; }
.okopf2-rechts { gap: 8px; justify-content: flex-end; }
.okopf2-z4, .okopf2-z3 { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; height: 100%; }
.okopf2-z3 { position: relative; }                       /* Bezug des Menüs „Pfad“ am „…“ */

/* Zone 2: Lupe | Platz der Kamera | „+“ und KI — zwei gleich breite Hälften, die Kamera sitzt exakt mittig */
.okopf2-mitte { display: grid; grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr); column-gap: 8px; align-items: center; height: 100%; }
.okopf2-mitte-l { justify-content: flex-end; gap: 8px; }
.okopf2-mitte-r { justify-content: flex-start; gap: 8px; }

/* ── Knöpfe: Ziel 36 × 36 px (≥ 24 px, WCAG 2.5.8) ───────────────────────── */
.okopf2-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-width: 36px; height: 36px; padding: 0 6px;
  border: 0; border-radius: 8px; background: transparent; color: var(--okopf2-text);
  font: inherit; font-size: 13px; cursor: pointer; text-decoration: none; flex: 0 0 auto;
}
.okopf2-btn:hover { background: var(--okopf2-hover); color: var(--okopf2-text); }
.okopf2-btn[aria-disabled="true"] { opacity: .6; cursor: progress; }
.okopf2-ikon { display: inline-flex; }
.okopf2-ikon svg { width: 18px; height: 18px; flex: 0 0 auto; }
.okopf2-btn-text { display: none; }                     /* im Kopf nur das Zeichen; im Menü „Mehr“ steht der Name dabei */

header[data-osp-kopf="v2"] :is(a, button, [tabindex]):focus-visible { outline: 3px solid var(--okopf2-fokus); outline-offset: 1px; }
header[data-osp-kopf="v2"] .okopf2-pop :is(a, button, [tabindex]):focus-visible { outline: 3px solid var(--okopf2-fokus-menue); outline-offset: -2px; }

/* ── Zone 4: App-Icon · Name · Pille mit Datum darunter ──────────────────── */
.okopf2-appicon {
  display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 2px;
  border: 0; border-radius: 8px; background: transparent; cursor: pointer; flex: 0 0 auto;
}
.okopf2-appicon:hover { background: var(--okopf2-hover); }
.okopf2-appicon-bild { width: 32px; height: 32px; object-fit: contain; display: block; border-radius: 6px; }
.okopf2-appicon-ersatz {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px;
  background: var(--okopf2-chip-bg); color: var(--okopf2-chip-text); font: 700 16px/1 'Montserrat', sans-serif;
}
.okopf2-name {
  font-family: 'Montserrat', 'Open Sans', system-ui, sans-serif; font-size: calc(var(--osp-schrift, 14px) + 2px); font-weight: 700; line-height: 1.1;
  color: var(--okopf2-text); max-width: 24ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 0 0 auto;
}
.okopf2-version { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 76px; flex: 0 0 auto; }
.okopf2-version[data-geladen="0"] { min-width: 0; }
.okopf2-pille {
  height: 24px; padding: 0 10px; border: 1px solid rgba(255, 255, 255, .75); border-radius: 12px;      /* Pille ≤ 26 px hoch, Ziel ≥ 24 px */
  background: rgba(0, 0, 0, .22); color: var(--okopf2-text); font: 600 12px/1 'Open Sans', system-ui, sans-serif; cursor: pointer;
}
.okopf2-pille:hover { background: var(--okopf2-hover); }
.okopf2-pille[data-neu="1"] { background: var(--okopf2-neu-bg); border-color: #FFFFFF; }
.okopf2-datum { font-size: 11px; line-height: 12px; color: var(--okopf2-text2); font-variant-numeric: tabular-nums; }

/* ── Zone 3: Trenner · Zurück · Brotkrumen · Rückgängig ──────────────────── */
.okopf2-trenner { width: 1px; height: 24px; background: rgba(255, 255, 255, .45); flex: 0 0 auto; margin: 0 2px; }
.okopf2-krumen { min-width: 0; }
.okopf2-krumen ol { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; min-width: 0; }
.okopf2-krumen li { display: inline-flex; align-items: center; min-width: 0; }
.okopf2-krumen li + li::before { content: "\203A"; padding: 0 4px; color: var(--okopf2-text2); font-size: calc(var(--osp-schrift, 14px) + 1px); }
.okopf2-krumen a, .okopf2-krumen button.okopf2-krume {
  display: inline-block; min-width: 24px; max-width: 26ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center;
  padding: 6px 4px;                                  /* Ziel ≥ 24 px hoch und breit */
  color: var(--okopf2-text); text-decoration: underline; text-underline-offset: 3px; background: none; border: 0; font: inherit; cursor: pointer;
}
.okopf2-krumen li.okopf2-nummer a { max-width: none; }          /* Nummern nie kürzen (NULL-FEHLER) */
.okopf2-krumen li:last-child a { text-decoration: none; font-weight: 600; }
.okopf2-krumen a:hover, .okopf2-krumen button.okopf2-krume:hover { background: var(--okopf2-hover); border-radius: 4px; }

/* Zu schmal und nichts mehr zu verschieben: Name und Krumen kürzen sich mit Auslassung (Name mit Tooltip) */
header.okopf2-eng .okopf2-links { gap: 6px; }
header.okopf2-eng .okopf2-z4, header.okopf2-eng .okopf2-z3 { flex: 0 1 auto; min-width: 0; }
header.okopf2-eng .okopf2-name { flex: 0 1 auto; min-width: 3ch; }
header.okopf2-eng .okopf2-krumen { flex: 0 1 auto; overflow: hidden; }
header.okopf2-eng .okopf2-krumen li { flex: 0 1 auto; }

/* ── Zone 2: KI-Anzeige (Schneider-S), Platz reserviert, sichtbar nur solange etwas läuft ──── */
.okopf2-ki-wrap[data-aktiv="0"] { visibility: hidden; }
.okopf2-ki { position: relative; }
.okopf2-ki-zeichen { display: inline-flex; width: 20px; height: 20px; color: var(--okopf2-text); }
.okopf2-ki-zeichen svg { width: 20px; height: 20px; }
.okopf2-ki[data-aktiv="1"]::after {                       /* Punkt neben dem Zeichen: auch ohne Bewegung erkennbar (3,7 : 1 gegen den Kopf) */
  content: ""; position: absolute; top: 5px; right: 4px; width: 8px; height: 8px; border-radius: 50%; background: var(--okopf2-punkt);
}
@media (prefers-reduced-motion: no-preference) {
  .okopf2-ki[data-aktiv="1"] .okopf2-ki-zeichen { animation: okopf2-puls 1.8s ease-in-out infinite; }
}
@keyframes okopf2-puls { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }

/* ── Zone 1: Mehr · 📎 · Glocke · Hell/Dunkel · Kürzel ───────────────────── */
.okopf2-glocke-platz { display: inline-flex; align-items: center; }
header[data-osp-kopf="v2"] .og-status { display: none !important; }          /* der Hintergrund-Status steht in Zone 2 */
header[data-osp-kopf="v2"] .og-knopf { border: 0; }
header[data-osp-kopf="v2"] .og-knopf:hover { background: var(--okopf2-hover); }
header[data-osp-kopf="v2"] .og-zahl { top: -2px; right: -4px; }                  /* die Zahl bleibt im 44-px-Kopf sichtbar */
.okopf2-benutzer {
  display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 28px; padding: 0 10px; border-radius: 8px;
  background: var(--okopf2-chip-bg); border: 1px solid var(--okopf2-chip-bg); color: var(--okopf2-chip-text);
  font: 700 13px/1 'Open Sans', system-ui, sans-serif; letter-spacing: .5px; cursor: pointer;
}

/* ── Menüs unter dem Kopf (Mehr, 📎, Benutzer, KI) ───────────────────────── */
.okopf2-popwrap, .okopf2-mehr { position: relative; display: inline-flex; align-items: center; }
.okopf2-pop {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 1010;
  min-width: 240px; max-width: min(360px, calc(100vw - 16px)); max-height: calc(100dvh - var(--okopf2-h) - 16px); overflow: auto;
  padding: 6px; background: var(--okopf2-menue-bg); color: var(--okopf2-menue-text);
  border: 1px solid var(--okopf2-menue-rand); border-radius: 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
  font-size: var(--osp-schrift, 14px); white-space: normal; text-align: left;
}
.okopf2-pop[hidden] { display: none; }
.okopf2-ki-pop { right: auto; left: 0; }
.okopf2-pfad-pop { top: calc(100% + 2px); right: auto; left: 0; }      /* Menü „Pfad“: unter dem „…“ (left setzt das Skript) */
.okopf2-pop h2 { margin: 6px 8px 2px; font-size: 12px; font-weight: 600; line-height: 1.2; color: var(--okopf2-menue-text2); letter-spacing: .2px; }
.okopf2-pop ul { list-style: none; margin: 0; padding: 0; }
.okopf2-zeile {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 36px; padding: 4px 10px; border: 0; border-radius: 6px;
  background: transparent; color: var(--okopf2-menue-text); font: inherit; text-align: left; cursor: pointer; text-decoration: none;
}
a.okopf2-zeile { color: var(--okopf2-link); text-decoration: underline; text-underline-offset: 3px; }
.okopf2-zeile:hover { background: var(--okopf2-menue-hover); }
.okopf2-ikon svg { stroke: currentColor; }

/* Mehr: verschobene Elemente behalten ihre Funktion, aber nicht das Kopf-Aussehen */
.okopf2-mehr-panel { min-width: 260px; }
.okopf2-mehr-panel .okopf2-popwrap { display: block; width: 100%; }
.okopf2-mehr-panel .okopf2-pop { position: static; min-width: 0; max-width: none; margin-top: 4px; box-shadow: none; }
.okopf2-mehr-panel .okopf2-im-mehr.okopf2-btn, .okopf2-mehr-panel .okopf2-im-mehr .okopf2-btn {
  width: 100%; justify-content: flex-start; color: var(--okopf2-menue-text); border-radius: 6px; height: 36px; font-size: var(--osp-schrift, 14px);
}
.okopf2-mehr-panel .okopf2-im-mehr.okopf2-btn:hover, .okopf2-mehr-panel .okopf2-im-mehr .okopf2-btn:hover { background: var(--okopf2-menue-hover); color: var(--okopf2-menue-text); }
.okopf2-im-mehr .okopf2-btn-text, .okopf2-im-mehr.okopf2-btn .okopf2-btn-text { display: inline; }
.okopf2-im-mehr .okopf2-ki-zeichen { color: var(--okopf2-menue-text); }
.okopf2-im-mehr[data-aktiv="0"] { visibility: visible; }
.okopf2-mehr-panel .okopf2-krumen { display: none; }

/* Benutzermenü */
.okopf2-benutzer-kopf { display: flex; flex-direction: column; padding: 6px 10px 8px; border-bottom: 1px solid var(--okopf2-menue-rand); }
.okopf2-benutzer-name { font-weight: 700; overflow-wrap: anywhere; }
.okopf2-benutzer-rolle { font-size: 13px; color: var(--okopf2-menue-text2); }
.okopf2-benutzer-sek { padding: 4px 0 6px; border-bottom: 1px solid var(--okopf2-menue-rand); }
.okopf2-auswahl { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 10px; }
.okopf2-auswahl-titel { font-size: 13px; color: var(--okopf2-menue-text2); }
.okopf2-auswahl-reihe { display: inline-flex; border: 1px solid var(--okopf2-menue-rand); border-radius: 8px; overflow: hidden; }
.okopf2-auswahl-knopf { min-width: 28px; height: 28px; padding: 0 10px; border: 0; background: transparent; color: var(--okopf2-menue-text); font: inherit; font-size: 13px; cursor: pointer; }
.okopf2-auswahl-knopf + .okopf2-auswahl-knopf { border-left: 1px solid var(--okopf2-menue-rand); }
.okopf2-auswahl-knopf:hover { background: var(--okopf2-menue-hover); }
.okopf2-auswahl-knopf[aria-checked="true"] { background: var(--okopf2-aktiv-bg); color: var(--okopf2-aktiv-text); font-weight: 600; }
.okopf2-ansicht-zurueck { margin-top: 4px; min-height: 32px; }
.okopf2-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.okopf2-ansicht-zurueck[data-frage="1"] { background: var(--okopf2-menue-hover); font-weight: 600; }   /* zweiter Klick bestätigt */
.okopf2-benutzer-punkte { padding: 4px 0; border-bottom: 1px solid var(--okopf2-menue-rand); }
.okopf2-abmelden { margin-top: 4px; color: var(--okopf2-menue-text); }

/* Neuigkeiten im Benutzermenü (nur unter 761 px; Datum darunter) */
.okopf2-benutzer-neu { padding: 4px 0; border-bottom: 1px solid var(--okopf2-menue-rand); }
.okopf2-neuigkeiten { flex-direction: column; align-items: flex-start; gap: 0; padding: 6px 10px; }
.okopf2-neuigkeiten-text { font-weight: 600; }
.okopf2-neuigkeiten-datum { font-size: 12px; color: var(--okopf2-menue-text2); font-variant-numeric: tabular-nums; }

/* 📎 und KI */
.okopf2-mg-zeile { flex-direction: column; align-items: flex-start; gap: 0; padding: 6px 10px; }
.okopf2-mg-nr { font-weight: 600; }
.okopf2-mg-titel, .okopf2-mg-rev { font-size: 13px; color: var(--okopf2-menue-text2); text-decoration: none; display: block; }
.okopf2-ki-zeile { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 6px 10px; }
.okopf2-ki-prozent { color: var(--okopf2-menue-text2); font-variant-numeric: tabular-nums; font-size: 13px; }

/* Hinweis unter dem Kopf */
.okopf2-hinweis {
  position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); z-index: 1010; padding: 6px 12px; border-radius: 8px;
  background: #1E293B; color: #FFFFFF; font-size: 13px; box-shadow: 0 4px 12px rgba(0, 0, 0, .3);   /* 14,63 : 1 */
}

/* PDF groß unter dem Kopf (nicht modal: Kopf und Kamera bleiben bedienbar) */
.okopf2-pdf { position: fixed; z-index: 900; left: 0; right: 0; bottom: 0; top: var(--okopf2-h); background: rgba(15, 23, 42, .45); }
.okopf2-pdf-dialog {
  position: absolute; inset: 12px 24px; display: flex; flex-direction: column; overflow: hidden;
  background: var(--okopf2-menue-bg); color: var(--okopf2-menue-text); border: 1px solid var(--okopf2-menue-rand); border-radius: 10px; box-shadow: 0 12px 32px rgba(0, 0, 0, .3);
  font-family: 'Open Sans', system-ui, sans-serif; font-size: 14px;
}
.okopf2-pdf-dialog:focus { outline: none; }
.okopf2-pdf-kopf { display: flex; align-items: center; gap: 12px; padding: 6px 8px 6px 14px; border-bottom: 1px solid var(--okopf2-menue-rand); }
.okopf2-pdf-titel { margin: 0; font-size: 15px; font-weight: 700; flex: 1 1 auto; }
.okopf2-pdf-neu { color: var(--okopf2-link); text-underline-offset: 3px; padding: 4px; }
.okopf2-pdf-zu { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; border: 1px solid var(--okopf2-menue-rand); border-radius: 8px; background: transparent; color: var(--okopf2-menue-text); cursor: pointer; }
.okopf2-pdf-zu:hover { background: var(--okopf2-menue-hover); }
.okopf2-pdf-zu svg { width: 18px; height: 18px; }
.okopf2-pdf-rahmen { flex: 1 1 auto; width: 100%; border: 0; background: #FFFFFF; }
.okopf2-pdf :is(a, button):focus-visible { outline: 3px solid var(--okopf2-fokus-menue); outline-offset: 2px; }

/* ── Rumpf: nur der Inhalt scrollt, der Kopf (sticky) steht ──────────────── */
.osp-rumpf { display: flex; height: calc(100dvh - var(--okopf2-h)); min-height: 0; overflow: hidden; }
.osp-rumpf > :is(main, .osp-inhalt, [data-osp-haupt]) { flex: 1 1 0; min-width: 0; min-height: 0; overflow: auto; }

/* ── Menü-Knopf für die Seitenleiste als Überlagerung (unter 761 px) ───────── */
.okopf2-menue { display: none; }
@media (max-width: 760px) {
  :root { --okopf2-mitte-b: 34px; }
  header[data-osp-kopf="v2"] { grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr); column-gap: 6px; }   /* Kamera bleibt mittig */
  .okopf2-menue:not([hidden]) { display: inline-flex; }
  .okopf2-mitte { column-gap: 0; }
  .okopf2-name { display: none; }                /* Name steht im Tooltip des Icons; die Pille steht als „Neuigkeiten · v…“ im Benutzermenü */
  .okopf2-version, .okopf2-trenner { display: none; }
  .okopf2-pop { position: fixed; top: calc(var(--okopf2-h) + 4px); right: 8px; left: 8px; max-width: none; }
  .okopf2-ki-pop { left: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .okopf2-ki-zeichen { animation: none !important; }
}
@media print {
  header[data-osp-kopf="v2"], .okopf2-pdf, .onews { display: none !important; }
  .osp-rumpf { height: auto; overflow: visible; display: block; }
  .osp-rumpf > :is(main, .osp-inhalt, [data-osp-haupt]) { overflow: visible; }
}