/* =====================================================================
   Change-Reifegrad-Radar · NxtLvlOrg — print.css  (media="print")
   Heller Grund, dunkle Druckfarben, Radar in Print-Farbvariante.
   ===================================================================== */

/* Wiederholungskopf und Firmenfuss liegen als position:fixed am oberen bzw.
   unteren Rand des Satzspiegels — so zeichnet Chrome sie auf jeder Seite.
   Den Platz dafuer halten die leeren thead-/tfoot-Zeilen des .druckrahmen
   frei (siehe unten): Ein negativer Versatz in den Seitenrand hinein wurde
   geprueft und verworfen — Chrome verschiebt solche Elemente dann auf die
   Nachbarseite und laesst sie auf der ersten bzw. letzten Seite ganz weg. */
/* ---------- Seitenzahlen: gemessen, nicht vermutet ----------
   Die verbreitete Auskunft lautet, Chrome unterstuetze die Randkaesten von
   @page nicht. Am 23.08.2026 mit Chrome 139 nachgemessen (Testdatei
   test-seitenzahl.html, gedruckt ueber --print-to-pdf, Text aus dem PDF
   zurueckgelesen): Die Kaesten werden gezeichnet, counter(page) und
   counter(pages) zaehlen korrekt — im PDF steht auf Seite 1 von 4 woertlich
   "Seite 1 von 4", auf Seite 4 "Seite 4 von 4". @page :first traegt ebenfalls
   und kann die erste Seite anders bestuecken.

   Was im selben Lauf NICHT funktioniert hat: laufende Kolumnentitel ueber
   string-set / content:string(...) — der Randkasten bleibt leer. Der
   Abschnittsname steht deshalb nicht hier oben, sondern als nummerierte Marke
   im Dokument selbst (.abschnitt-marke) und im Verzeichnis auf Seite 2. Diese
   Nummerierung ist die zitierfaehige Ebene: Sie traegt auch dort, wo eine
   Druckengine von @page nichts haelt.

   Der Kasten enthaelt bewusst nur Zaehler und feste Woerter. Datum und
   Radar-Code wechseln je Auswertung und muessten aus dem PHP kommen — das
   ginge nur ueber <style> im Dokument, und die CSP dieser Anwendung erlaubt
   kein Inline-CSS (style-src 'self'). Beides steht deshalb im Kurzfuss
   (.druckfuss), der als position:fixed ohnehin auf jeder Seite erscheint. */
@page{
  margin:14mm;
  @bottom-right{
    content:"Seite " counter(page) " von " counter(pages);
    font-family:'Inter',system-ui,sans-serif;
    font-size:6.8pt;
    color:#6b7684;
    vertical-align:top;
    padding-top:2mm;
  }
}

/* ---------- Druckrahmen: haelt Kopf- und Fusszeile auf jeder Seite frei ---------- */
.druckrahmen{
  display:table !important;
  width:100% !important;
  border-collapse:collapse;
  table-layout:fixed;
}
.druckrahmen > thead{display:table-header-group !important}
.druckrahmen > tfoot{display:table-footer-group !important}
.druckrahmen > tbody{display:table-row-group !important}
.druckrahmen > thead > tr,
.druckrahmen > tfoot > tr,
.druckrahmen > tbody > tr{display:table-row !important}
.druckrahmen td{display:table-cell !important;padding:0;border:0;vertical-align:top}
.druckrahmen-platz-kopf{height:12mm}
.druckrahmen-platz-fuss{height:16mm}

*{
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}

html,body{
  background:#ffffff !important;
  color:#1c2530 !important;
}
body{padding-top:0 !important}

/* ---------- Wiederholungskopf auf jeder Seite ----------
   Nur wenn die Seite ein Druckdatum traegt (sonst endete sie auf "· "). */
body[data-print-datum]::before{
  content:"Change-Reifegrad-Radar · NxtLvlOrg · " attr(data-print-datum);
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:9mm;
  display:block;
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:8pt;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6b5a78;
  border-bottom:0.3pt solid #d8dee6;
  padding-bottom:2mm;
}

/* ---------- Nur im Ausdruck: Druckkopf, Druckfuss, Abschlussblock ---------- */
.nur-druck{display:block !important}

/* Kopf auf Seite 1: Logo, Dokumenttitel, Erstellungsdatum. */
.druckkopf{
  display:flex !important;
  align-items:center;
  gap:6mm;
  padding-bottom:4mm;
  margin-bottom:6mm;
  border-bottom:0.8pt solid #4c007b;
  break-inside:avoid;
  page-break-inside:avoid;
  break-after:avoid;
  page-break-after:avoid;
}
/* Das Navigationslogo ist fast weiss (fuer den dunklen Site-Header gebaut) und
   waere auf Papier unsichtbar. brightness(0) faerbt es schwarz und laesst die
   Transparenz unangetastet — kein zweites Bildschirm-Asset noetig. */
.druckkopf-logo{
  width:32mm;
  height:auto;
  flex:0 0 auto;
  filter:brightness(0);
}
.druckkopf-text{flex:1 1 auto}
.druckkopf-titel{
  font-family:'Manrope','Inter',system-ui,sans-serif;
  font-size:16pt !important;
  font-weight:700;
  line-height:1.2;
  color:#1c2530 !important;
  margin:0;
}
.druckkopf-zusatz{
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:8.5pt !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6b5a78 !important;
  margin:1.5mm 0 0;
}

/* Fuss auf jeder Seite: unten im Satzspiegel, Platz haelt .druckrahmen frei. */
.druckfuss{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  border-top:0.3pt solid #d8dee6;
  padding-top:2mm;
}
.druckfuss-zeile{
  font-family:'Inter',system-ui,sans-serif;
  font-size:6.8pt !important;
  line-height:1.45;
  color:#6b7684 !important;
  margin:0;
  text-align:center;
}

/* Abschlussblock am Dokumentende — bleibt als Ganzes zusammen.
   Er sitzt unter der Methodenseite; die Maße sind so gewaehlt, dass beides
   zusammen auf ein Blatt geht statt auf zwei. */
.druckabschluss{
  margin-top:3.5mm;
  padding:4.5mm 5mm 4mm;
  background:#f4f2f7 !important;
  border-top:2pt solid #4c007b;
  break-inside:avoid;
  page-break-inside:avoid;
}
.druckabschluss-titel{
  font-family:'Manrope','Inter',system-ui,sans-serif;
  font-size:14pt !important;
  color:#1c2530 !important;
  margin:0 0 3mm;
}
.druckabschluss p{
  font-size:9.5pt !important;
  line-height:1.6;
  color:#3a4450 !important;
  margin:0 0 2.5mm;
  max-width:100%;
}
.druckabschluss-termin{margin-top:4mm !important}
.druckabschluss-termin-label{
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:8.5pt;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#4c007b !important;
}
.druckabschluss-url{
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:12pt;
  font-weight:700;
  color:#4c007b !important;
  word-break:break-all;
}
.druckabschluss-code{font-size:8.5pt !important;color:#6b7684 !important}
.druckabschluss-unterschrift{
  display:block;
  width:44mm;
  height:auto;
  margin:5mm 0 1mm;
}
.druckabschluss-kontakt{margin-top:1mm}
.druckabschluss-kontakt p{
  font-size:10pt !important;
  line-height:1.5;
  color:#1c2530 !important;
  margin:0;
}
.druckabschluss-name{
  font-family:'Manrope','Inter',system-ui,sans-serif;
  font-size:12pt !important;
  font-weight:700;
}

/* ---------- Ausgeblendet im Druck ---------- */
#canvas-container,
.app-kopf,
.seiteninhalt nav,        /* Site-Navigation (partial-header) — steht im Druckrahmen,
                             deshalb Nachfahren- statt Kindselektor */
#mobile-nav,
footer.glass-section,     /* Site-Footer (partial-footer) */
.fortschritt,
.screen-navigation,
.cta-sektion,
.btn,
button,
.legende,
.motivation-band,
.wiederkehr,
.info-aktionen,
.inline-formular,
.mail-sektion,
.meldung-bereich,
.hp-feld{
  display:none !important;
}

/* ---------- Bereichs-Konsole: im Druck wieder eine lange Seite ----------
   Alle Panels offen, alle Zwischenebenen aufgeklappt, keine Bedienelemente. */
.konsole-kopf,
.bereichsleiste,
.konsole-fuss,
.konsole-fortschritt,
.radar-tipp,
/* Trefferflaechen sind reine Bildschirm-Bedienung.
   Die gestrichelte Vorschaukontur bleibt im Druck stehen — sie ist Inhalt
   (Farbvariante weiter unten bei den Radar-Druckfarben). */
.radar-hotspots{
  display:none !important;
}

.hat-js .bereich-panel,
.bereich-panel{
  display:block !important;
  animation:none !important;
  opacity:1 !important;
  transform:none !important;
  margin-bottom:5mm !important;
  background:#f4f2f7 !important;
  box-shadow:none !important;
  break-inside:avoid;
  page-break-inside:avoid;
}

/* Ohne JavaScript stehen die <details> ohnehin offen; mit JavaScript setzt
   app.js sie vor dem Druck auf "open". Die folgenden Regeln sind das Netz
   darunter: Sie klappen auch ein geschlossenes <details> im Druck auf —
   ::details-content ist der Weg in aktuellen Chrome-Versionen, die
   Kindregel deckt aeltere Engines ab. */
details{display:block !important}
details::details-content{
  content-visibility:visible !important;
  display:block !important;
  block-size:auto !important;
  overflow:visible !important;
}
details:not([open]) > *:not(summary){display:block !important}
summary{display:none !important}
.panel-tiefe-inhalt{display:block !important;padding-top:0 !important}

.warum-nicht{background:#f0eef4 !important}
.panel-headline{color:#4c007b !important}
.panel-berichtzeile{color:#6b7684 !important}

/* ---------- Grundfarben hell ---------- */
h1,h2,h3,strong{color:#1c2530 !important}
.highlight{color:#4c007b !important}
p,li,dd,dt,td,th,label,legend{color:#3a4450 !important}
.eyebrow,.fortschritt-text{color:#4c007b !important}
a{color:#4c007b !important;text-decoration:underline}

.ergebnis-hero,
.sektion,
.app-fuss,
.widerruf-hinweis{background:#ffffff !important;padding:6mm 0;margin-top:0 !important}

.gesamtscore{color:#4c007b !important}
.gesamtscore .score-max{color:#6b7684 !important}
.einordnung,.kontext{color:#3a4450 !important}

/* ---------- Flaechen hell mappen ---------- */
.kategorie-karte,
.top3-feld,
.fahrplan-phase,
.erfolgszeile,
.vorsprung,
.schritt,
.staerke-kachel,
.info-detail,
.muster-karte,
.einordnung-karte{
  background:#f4f2f7 !important;
  box-shadow:none !important;
}
.muster-karte h3{color:#4c007b !important}
.muster-empfehlung{color:#3a4450 !important}

/* Einordnung/Disclaimer gehoert ausdruecklich in den Ausdruck und ins PDF. */
.einordnung-sektion{break-inside:avoid;page-break-inside:avoid}
.einordnung-karte p{color:#3a4450 !important}

.score-badge{background:#e8e2ef !important;color:#4c007b !important}
.badge{background:#e8e2ef !important;color:#3a4450 !important}
.badge-wirkung{color:#4c007b !important}
.top3-feld::before{color:#4c007b !important}
.karte-extra dt{color:#4c007b !important}

.mini-balken{background:#d8dee6 !important}
.mini-balken span{background:#4c007b !important}

.app-fuss p,.app-fuss a,
.widerruf-hinweis p,.widerruf-hinweis a{color:#6b7684 !important}

/* ---------- Radar: Print-Farbvariante ueber CSS-Klassen ----------
   CSS-Regeln schlagen SVG-Praesentationsattribute — kein JS noetig. */
#radar-chart{opacity:1 !important;transform:none !important}
/* Die weiche Verlaufsflaeche hinter dem Radar verschwindet im Druck. */
.radar-flaeche{background:none !important}
.radar-flaeche::before,
.radar-flaeche::after{display:none !important;content:none !important}
.radar-glow{display:none !important}
.radar-kontur{stroke:#4c007b !important}
.radar-flaeche-poly{fill:rgba(76,0,123,0.08) !important}
/* Gestrichelte Vorschaukontur: auf hellem Grund ist das helle #ffb693 zu
   schwach — hier ein kraeftiges Rostbraun, klar unterscheidbar vom Lila
   der Ist-Kontur. Bildunterschrift in derselben Farbe. */
.radar-vorschau{stroke:#a63f00 !important;opacity:1 !important}
.radar-bildunterschrift{
  display:block !important;
  color:#3a4450 !important;font-size:9pt !important;
  text-align:center !important;margin-top:3mm !important;
}
.radar-bildunterschrift .vorschau-strich{color:#a63f00 !important}
.radar-punkt{fill:#ffffff !important;stroke:#4c007b !important}
.radar-ring{stroke:#d8dee6 !important}
.radar-ring-aussen{stroke:#c3ccd6 !important}
.radar-speiche{stroke:#e4e9ee !important}
.radar-label{fill:#3a4450 !important}
.radar-wert{fill:#4c007b !important}

/* ---------- Seitenumbrueche ---------- */
.kategorie-karte,
.top3-feld,
.fahrplan-phase,
.muster-karte,
.schritt,
.vorsprung{
  break-inside:avoid;
  page-break-inside:avoid;
}
/* Radar samt Bildunterschrift bleibt ein Bild; die Wertetabelle darunter
   ist screenreader-only und faellt im Druck nicht ins Gewicht. */
.ergebnis-hero,
.radar-flaeche{
  break-inside:avoid;
  page-break-inside:avoid;
}
.sektion{break-before:auto}
/* Keine Ueberschrift ohne ihren Inhalt: der Kopf haengt am folgenden Block. */
.sektion-kopf,
.karte-kopf,
h1,h2,h3{
  break-after:avoid;
  page-break-after:avoid;
}
h1,h2,h3{break-inside:avoid;page-break-inside:avoid}
.sektion-kopf h2,
.druckabschluss-titel{orphans:3;widows:3}
p,li,dd{orphans:2;widows:2}

/* Karten-Raster einspaltig drucken */
.karten-raster,
.top3-raster,
.muster-raster{
  display:block !important;
}
.karten-raster > *,
.top3-raster > *,
.muster-raster > *{
  margin-bottom:5mm;
}

/* =====================================================================
   DRUCKFASSUNG NACH DEN BEFUNDEN DER BEIDEN PRUEFRUNDEN
   16 Geschaeftsfuehrer, 12 Fuehrungskraefte. Zielkorridor: hoechstens
   12 Seiten bei den mittleren Profilen (vorher 17 bis 19).
   ===================================================================== */

/* ---------- Befund 1 · Was ersatzlos entfaellt ----------
   Die Top-3-Sektion wiederholt die Begruendung je Handlungsfeld — sie ist
   wortgleich die Diagnose im zugehoerigen Bereichspanel (nachgeprueft ueber
   alle acht Profile). Gedruckt stand derselbe Absatz damit zweimal auf dem
   Papier. Am Bildschirm bleibt der Block: dort ist er die Zusammenfassung
   nach der langen Bereichsliste, dort liest niemand beides am Stueck. */
.top3-sektion{
  display:none !important;
}

/* ---------- Befund 1 · Die drei Handlungsfelder nach vorn ----------
   Statt der gestrichenen Wiederholung stehen die drei ausgefuehrten
   Handlungsfelder jetzt am Anfang der Bereichsliste; die uebrigen vier
   folgen. Die Reihenfolge im Quelltext bleibt die Achsenreihenfolge des
   Radars (k1..k7) — die braucht der Bildschirm fuer die Zuordnung
   Bereichs-Chip ↔ Radarachse. Im Druck sortiert order() um, ohne dass am
   Markup etwas kippt. */
.konsole-panels{
  display:flex !important;
  flex-direction:column;
}
.bereich-panel{order:2}
.bereich-panel.ist-hebel{order:1}

/* ---------- Befund 1 · Bereiche ausserhalb der Hebel auf je eine halbe Seite ----------
   Sie tragen Einordnung, Sofortschritt und Kennzahl — mehr sollen sie
   ausdruecklich nicht. Kleinerer Satz und knapperer Rahmen bringen zwei von
   ihnen auf eine Seite, ohne dass ein Wort wegfaellt. */
.bereich-panel:not(.ist-hebel){
  padding:3.5mm 4mm !important;
  margin-bottom:4mm !important;
}
.bereich-panel:not(.ist-hebel) h3{font-size:11pt !important;margin:1mm 0 !important}
.bereich-panel:not(.ist-hebel) p,
.bereich-panel:not(.ist-hebel) dd,
.bereich-panel:not(.ist-hebel) dt{
  font-size:8.4pt !important;
  line-height:1.42 !important;
  margin-bottom:1mm !important;
}
.bereich-panel:not(.ist-hebel) .karte-extra{margin-top:1.5mm !important}

/* Die Handlungsfelder bleiben in Lesegroesse — sie sind der Kern. */
.bereich-panel.ist-hebel{padding:4.5mm 5mm !important}
.bereich-panel.ist-hebel h3{font-size:13pt !important}

/* ---------- Befund 1 · Drei Fahrplanseiten auf eine Seite mit drei Spalten ----------
   Je Phase eine Spalte. Die breite Tabelle wird dafuer zu gestapelten
   Bloecken: Handlungsfeld, Massnahme, Aufwand, und wer sie anstossen kann.
   Was hier entfaellt, geht nicht verloren, sondern steht vollstaendig an
   genau einer anderen Stelle — Verantwortlich, Termin und Status im
   Massnahmenregister (dort mit Schreiblinien), die Kennzahl bei ihrem
   Bereich unter „Woran du Fortschritt erkennst“. Der Fliesstext je Hebel
   (fp-satz) wiederholt den Rahmensatz der Phase und faellt weg. */
.fahrplan-raster{
  display:grid !important;
  grid-template-columns:repeat(3, 1fr);
  gap:4mm;
  align-items:start;
}
.fahrplan-phase{
  margin-bottom:0 !important;
  padding:3mm 3.5mm !important;
  break-inside:avoid;
  page-break-inside:avoid;
}
.fahrplan-phase-kopf .eyebrow{font-size:7.2pt !important}
.fahrplan-phase h3{font-size:10.5pt !important;margin:1mm 0 2mm !important}
.fahrplan-rahmen{font-size:8pt !important;line-height:1.4 !important;margin-bottom:2.5mm !important}

.fahrplan-tabelle,
.fahrplan-tabelle tbody,
.fahrplan-tabelle tr,
.fahrplan-tabelle th,
.fahrplan-tabelle td{
  display:block !important;
  width:auto !important;
  border:0 !important;
  padding:0 !important;
}
.fahrplan-tabelle thead{display:none !important}
.fahrplan-tabelle tr{
  margin-bottom:2.5mm;
  padding-bottom:2mm;
  border-bottom:0.3pt solid #d8dee6 !important;
  break-inside:avoid;
  page-break-inside:avoid;
}
.fahrplan-tabelle tr:last-child{border-bottom:0 !important;margin-bottom:0;padding-bottom:0}
.fahrplan-tabelle th[scope="row"]{
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:7.2pt !important;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#4c007b !important;
  text-align:left !important;
  margin-bottom:.8mm !important;
}
.fahrplan-tabelle .fp-massnahme{
  display:block;
  font-size:8.6pt !important;
  font-weight:600;
  line-height:1.35;
  color:#1c2530 !important;
}
.fahrplan-tabelle .fp-startbar{
  display:block;
  font-size:7.2pt !important;
  color:#6b7684 !important;
  margin-top:.5mm;
}
.fahrplan-tabelle td[data-spalte="Aufwand"]{
  font-size:7.2pt !important;
  color:#6b7684 !important;
  margin-top:.5mm !important;
}
.fahrplan-tabelle td[data-spalte="Aufwand"]::before{content:"Aufwand: "}
.fahrplan-tabelle .fp-satz,
.fahrplan-tabelle td[data-spalte="Kennzahl"],
.fahrplan-tabelle td[data-spalte="Verantwortlich"],
.fahrplan-tabelle td[data-spalte="Termin"]{
  display:none !important;
}

/* ---------- Befund 2 · Orientierung: Abschnittsmarke und Verzeichnis ----------
   Seitenzahlen kommen aus dem @page-Randkasten (oben belegt). Zitierfaehig
   ist trotzdem die Abschnittsnummer: Sie steht im Dokument, ueberlebt jedes
   Umskalieren und jeden anderen Drucker. */
.abschnitt-marke{
  display:block !important;
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:7.5pt !important;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6b5a78 !important;
  margin:0 0 1.5mm !important;
  break-after:avoid;
  page-break-after:avoid;
}

.druck-inhalt{
  break-before:page;
  page-break-before:always;
  break-after:page;
  page-break-after:always;
  padding:0 !important;
}
.druck-inhalt-titel{
  font-family:'Manrope','Inter',system-ui,sans-serif;
  font-size:16pt !important;
  color:#1c2530 !important;
  margin:0 0 3mm !important;
  break-after:avoid;
  page-break-after:avoid;
}
.druck-inhalt-lead{
  font-size:9pt !important;
  line-height:1.55;
  color:#3a4450 !important;
  margin:0 0 6mm !important;
  max-width:150mm;
}
.druck-inhalt-liste{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}
.druck-inhalt-liste li{
  display:flex;
  gap:5mm;
  align-items:baseline;
  padding:2.2mm 0;
  border-bottom:0.3pt solid #d8dee6;
  break-inside:avoid;
  page-break-inside:avoid;
}
.druck-inhalt-nr{
  flex:0 0 26mm;
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:8pt !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#4c007b !important;
}
.druck-inhalt-name{
  flex:1 1 auto;
  font-size:11pt !important;
  color:#1c2530 !important;
}
.druck-inhalt-fuss{
  font-size:8.5pt !important;
  color:#6b7684 !important;
  margin-top:6mm !important;
}

/* ---------- Befund 3 · Absenderblock auf Seite 1 ----------
   Vollstaendige Firmendaten stehen genau zweimal: hier und im
   Abschlussblock. Alle Innenseiten tragen nur den Kurzfuss. */
.druck-absender{
  margin-top:6mm;
  padding-top:3mm;
  border-top:0.5pt solid #d8dee6;
  break-inside:avoid;
  page-break-inside:avoid;
}
.druck-absender-zeile{
  font-size:7.6pt !important;
  line-height:1.5;
  color:#6b7684 !important;
  margin:0 !important;
}
.druck-absender-zeile strong{color:#3a4450 !important}
.druckabschluss-register{
  font-size:8.5pt !important;
  color:#6b7684 !important;
  margin-top:1mm !important;
}

/* ---------- Befund 6 · Radar-Legende ----------
   Die Bildunterschrift erklaerte nur die gestrichelte Kontur. Hier stehen
   alle vier Zeichen: durchgezogen, gestrichelt, Ringe, Achsen.

   Der Klassenname lautet bewusst NICHT .radar-legende: radar.js zeichnet im
   SVG bereits eine Gruppe dieses Namens (die kleine Raute „Dein Ist-Wert“).
   Zwei Elemente mit demselben Namen haetten sich die Regeln geteilt. */
.radar-drucklegende{
  display:block !important;
  list-style:none !important;
  margin:3mm auto 0 !important;
  padding:2.5mm 4mm !important;
  max-width:150mm;
  background:#f4f2f7 !important;
  break-inside:avoid;
  page-break-inside:avoid;
  /* Die Legende gehoert an ihr Bild — ohne das avoid stand sie allein oben
     auf der Folgeseite, waehrend unter dem Radar Platz frei blieb. */
  break-before:avoid;
  page-break-before:avoid;
}
.radar-drucklegende li{
  position:relative;
  padding-left:12mm;
  font-size:8.2pt !important;
  line-height:1.5;
  color:#3a4450 !important;
  margin:0 0 .8mm;
}
.radar-drucklegende li:last-child{margin-bottom:0}
.legende-probe{
  position:absolute;
  left:0;
  top:1.6mm;
  width:9mm;
  height:0;
  border-top-width:1.2pt;
  border-top-style:solid;
}
.probe-ist{border-top-color:#4c007b}
.probe-vorschau{border-top-style:dashed;border-top-color:#a63f00}
.probe-ring{border-top-color:#c3ccd6}
.probe-achse{border-top-color:#e4e9ee;border-top-width:2.4pt}

/* ---------- Befund 5 · Methodenseite ----------
   Eigene Seite vor dem Abschlussblock. Sie beantwortet, was die beiden
   Controller vermisst haben: Rechenweg, Skala, Wertebaender, Gleichstand —
   und sagt beim Vergleichswert ehrlich, dass es ihn noch nicht gibt. */
.methodenseite{
  display:block !important;
  break-before:page;
  page-break-before:always;
  padding-top:0;
}
.methode-titel{
  font-family:'Manrope','Inter',system-ui,sans-serif;
  font-size:14pt !important;
  color:#1c2530 !important;
  margin:0 0 3mm !important;
  break-after:avoid;
  page-break-after:avoid;
}
.methode-rechenweg{
  font-size:9.5pt !important;
  line-height:1.6;
  color:#3a4450 !important;
  margin:0 0 5mm !important;
  max-width:100%;
}
.methode-raster{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:3.5mm;
  align-items:start;
}
.methode-block{
  padding:2.6mm 3.2mm;
  background:#f4f2f7 !important;
  margin-bottom:5mm;
  break-inside:avoid;
  page-break-inside:avoid;
}
.methode-raster > .methode-block{margin-bottom:0}
/* Die beiden Textbloecke laufen ueber beide Spalten — einspaltig gesetzt
   wuerden sie hoeher, nicht niedriger. Der Vorbehalt bleibt halbbreit. */
.methode-block-breit{grid-column:1 / -1}
.methode-block h3{
  font-size:10pt !important;
  color:#4c007b !important;
  margin:0 0 1.5mm !important;
  break-after:avoid;
  page-break-after:avoid;
}
.methode-block p{font-size:8.6pt !important;line-height:1.5;color:#3a4450 !important;margin:0 0 2mm}
.methode-block p:last-child{margin-bottom:0}
.methode-block-lead{color:#6b7684 !important;margin-bottom:2mm !important}
.methode-tabelle{
  width:100% !important;
  border-collapse:collapse;
  font-size:7.9pt !important;
}
.methode-tabelle th,
.methode-tabelle td{
  text-align:left;
  padding:.75mm 2mm .75mm 0;
  border-bottom:0.3pt solid #d8dee6;
  color:#3a4450 !important;
  vertical-align:top;
}
.methode-tabelle thead th{
  font-family:'Space Grotesk','Inter',system-ui,sans-serif;
  font-size:7pt !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6b5a78 !important;
}
.methode-tabelle tbody th[scope="row"]{
  width:9mm;
  font-weight:700;
  color:#4c007b !important;
}
.methode-tabelle tr.ist-erreicht td,
.methode-tabelle tr.ist-erreicht th{font-weight:700;color:#1c2530 !important}
.methode-vergleich{background:#f0eef4 !important}
.methode-grenze{
  font-size:7.8pt !important;
  color:#6b7684 !important;
  margin-top:2.5mm !important;
}
/* Methodenseite und Abschlussblock teilen sich ein Blatt. Der Satz ist
   deshalb knapp gehalten — die Seite ist Nachweis, nicht Lesestoff. */
.methode-block{margin-bottom:3mm}
.methodenseite .methode-block p{font-size:8pt !important;line-height:1.38}
.methode-rechenweg{font-size:8.6pt !important;margin-bottom:3mm !important}
.druckabschluss p{font-size:8.8pt !important;line-height:1.45;margin-bottom:1.6mm}
.druckabschluss-titel{font-size:13pt !important;margin-bottom:1.6mm !important}
.druckabschluss-unterschrift{width:30mm;margin:2mm 0 .5mm !important}
.druckabschluss-kontakt p{font-size:8.8pt !important;line-height:1.35}
.druckabschluss-termin{margin-top:2.5mm !important}
.druckabschluss-url{font-size:10.5pt !important}
.druckabschluss-name{font-size:11pt !important}
.methode-grenze{margin-top:2mm !important}

/* ---------- Befund 4 · Seitenumbrueche ----------
   Gemeldet: die Fahrplan-Ueberschrift stand am Seitenfuss und der Text
   setzte auf der Folgeseite mitten im Satz fort; Massnahmenbloecke rissen
   mitten in der Aufzaehlung. */

/* Titelseite und Verzeichnis sind je eine Seite fuer sich. */
.kurzfassung{
  break-after:page;
  page-break-after:always;
  break-inside:avoid-page;
}

/* Kapitel, die eine eigene Seite bekommen: Der Fahrplan, weil genau dort die
   haengende Ueberschrift gemeldet wurde, und das Register, weil es als Liste
   zum Mitnehmen gedacht ist. */
.fahrplan-sektion,
.massnahmen-register{
  break-before:page;
  page-break-before:always;
}

/* Keine Seite endet mit einer Ueberschrift: Kopf und erster Block haengen
   zusammen. .sektion-kopf umfasst Marke, Ueberschrift und Vorspann; das
   avoid gilt zusaetzlich fuer die Elemente darin, weil Chrome den Bruch
   sonst zwischen Marke und h2 setzen darf. */
.sektion-kopf,
.karte-kopf,
.fahrplan-phase-kopf,
.kurzfassung-kopf,
.abschnitt-marke,
.eyebrow,
h1,h2,h3{
  break-after:avoid;
  page-break-after:avoid;
}
.sektion-kopf{break-inside:avoid;page-break-inside:avoid}

/* Keine Aufzaehlung reisst: Massnahme, Definitionsliste und Musterkarte
   bleiben je als Ganzes zusammen. */
.schritt,
.karte-extra,
.karte-extra div,
.panel-tiefe-inhalt > .schritt,
.vorbild-karte,
.stufe-vorbehalt,
.hebel-gleichrangig,
.erfolgszeile,
.radar-bildunterschrift{
  break-inside:avoid;
  page-break-inside:avoid;
}
/* Begriff und Erklaerung gehoeren zusammen. */
.karte-extra dt{break-after:avoid;page-break-after:avoid}
.karte-extra dd{break-before:avoid;page-break-before:avoid}

/* Ein Handlungsfeld ist ein Block: Ueberschrift, Diagnose und die drei
   Massnahmen bleiben beieinander, solange sie auf eine Seite passen. */
.bereich-panel:not(.ist-hebel){break-inside:avoid;page-break-inside:avoid}

/* Strengere Schusterjungen- und Hurenkinderregel als die Vorgabe von 2. */
p,li,dd{orphans:3;widows:3}

/* ---------- Befund 7 · Reste des Bildschirms ----------
   Bedienelemente, Formular und der zweite Terminblock sind bereits weiter
   oben abgeraeumt (.cta-sektion, .mail-sektion, button, .konsole-fuss …).
   Hier nur noch, was sonst als leere Flaeche oder toter Linktext stehen
   bliebe. Der einzige Terminblock im Ausdruck ist .druckabschluss. */
.tabelle-flaeche{overflow:visible !important}
.fuss-links,
.bericht-liste,
.bericht-vorspann{display:none !important}

/* ---------- Befund 4 · Wiederholte Tabellenkoepfe ----------
   Das Register ist die einzige lange Tabelle im Dokument; ohne wiederholten
   Kopf steht auf der Folgeseite eine Spaltenreihe ohne Beschriftung. */
.register-tabelle > thead,
.methode-tabelle > thead{
  display:table-header-group !important;
}
.register-tabelle > tbody > tr,
.methode-tabelle > tbody > tr{
  break-inside:avoid;
  page-break-inside:avoid;
}
.register-tabelle{font-size:8.2pt !important}
.register-tabelle th,
.register-tabelle td{padding:1mm 2mm 1mm 0 !important;vertical-align:top}
.register-hinweis{font-size:8.2pt !important;line-height:1.45 !important;margin-bottom:2mm !important}

/* ---------- Gedraengter Satzspiegel fuer den Zielkorridor ----------
   Die Sektionen trugen am Bildschirm grosszuegige Abstaende; auf Papier
   kostet jede davon Zeilen, ohne etwas zu sagen. */
.sektion,
.ergebnis-hero{padding:3mm 0 !important}
.sektion-kopf{margin-bottom:3mm !important}
.sektion-kopf h2,
.ergebnis-hero h1{font-size:14pt !important;line-height:1.25 !important;margin-bottom:1.5mm !important}
.container{padding-left:0 !important;padding-right:0 !important;max-width:100% !important}
.muster-karte,
.vorbild-karte{padding:3.5mm 4mm !important;margin-bottom:4mm !important}
.muster-karte h3,
.vorbild-karte h3{font-size:11pt !important;margin:1mm 0 !important}
.muster-karte p,
.vorbild-karte p{font-size:8.6pt !important;line-height:1.45 !important;margin-bottom:1.5mm !important}
.schritt{padding:2.5mm 3mm !important;margin-bottom:2.5mm !important}
.schritt p{font-size:8.6pt !important;line-height:1.45 !important;margin:1mm 0 0 !important}
.karte-extra dt{font-size:8pt !important;margin-top:1.5mm !important}
.karte-extra dd{font-size:8.6pt !important;line-height:1.45 !important;margin:.5mm 0 0 !important}
.diagnose{font-size:9pt !important;line-height:1.5 !important}
.einordnung-karte{padding:4mm !important}
.einordnung-karte p{font-size:8.8pt !important;line-height:1.5 !important}

/* Das Radar ist am Bildschirm bis 760 px breit und fuellte gedruckt eine
   halbe Seite, auf der sonst nichts stand. Schmaler bleibt es genauso
   lesbar — die Achsenbeschriftung skaliert mit — und Einordnung, Radar,
   Legende und Musterdeutung stehen zusammen auf einer Seite, statt sich auf
   drei zu verteilen. radar.js setzt am SVG width:100%, die Breite kommt also
   von hier. */
.radar-flaeche{
  max-width:100% !important;
  padding:0 !important;
  margin:0 auto !important;
  break-inside:avoid;
  page-break-inside:avoid;
}
/* 84 mm ist die Groesse, bei der Einordnung, Radar und Legende zusammen auf
   ein Blatt gehen — gemessen ueber alle acht Profile. Grosser gedruckt riss
   die Legende auf die Folgeseite ab, und die Legende gehoert an ihr Bild. */
#radar-chart{max-width:84mm !important;margin:0 auto !important}
.radar-label{font-size:8px}
.radar-wert{font-size:8px}

/* Der Widerrufs-/Adressblock ist im Ausdruck ein Dreizeiler. Mit den
   Bildschirmabstaenden belegte er eine ganze Seite fuer 209 Zeichen. */
.widerruf-hinweis{
  padding:2mm 0 !important;
  margin-top:2mm !important;
  /* Der Block gehoert an den Lesehinweis darueber. Ohne das avoid stand er
     bei einzelnen Profilen als Dreizeiler allein auf einer eigenen Seite,
     weil die Methodenseite dahinter ohnehin neu anfaengt. */
  break-before:avoid;
  page-break-before:avoid;
  break-inside:avoid;
  page-break-inside:avoid;
}
.widerruf-hinweis p,
.fuss-adressen{font-size:7.6pt !important;line-height:1.45 !important;margin:0 0 1mm !important}
.einordnung-sektion{padding-bottom:0 !important}

/* Hero und Radar gehoeren zusammen — der Wert oben, das Bild darunter. */
.ergebnis-hero{break-after:avoid;page-break-after:avoid}
.gesamtscore{font-size:26pt !important;line-height:1.1 !important}
.staerke-kachel{padding:3mm 3.5mm !important}
.staerke-kachel p{font-size:8.6pt !important;line-height:1.45 !important}
.einordnung{font-size:8.8pt !important;line-height:1.48 !important;margin-bottom:1.5mm !important}
/* Der Satz „Dein Wert bündelt 28 Antworten aus 7 Kategorien …“ steht als
   Methodenzeile schon auf der Titelseite und ausfuehrlich auf der
   Methodenseite; auf Papier war er die dritte Wiederholung. */
.kontext{display:none !important}
/* Der Vorbehalt zur gedeckelten Stufe steht auf der Titelseite direkt bei der
   Stufe und auf der Methodenseite mit Begruendung. In der Einordnung war er
   der dritte Abdruck desselben Satzes — und er drueckte bei gedeckelten
   Profilen die Radar-Legende auf die Folgeseite. */
.ergebnis-hero .stufe-vorbehalt{display:none !important}
.radar-bildunterschrift{font-size:8.2pt !important;margin-top:2mm !important}

/* ---------- 2-Seiten-Kurzfassung fuer die Fuehrungsrunde (Dok 18) ----------
   app.js setzt body.druck-kurz, bevor window.print() laeuft, und raeumt die
   Klasse nach afterprint wieder ab. Gedruckt werden dann genau zwei Seiten:
   Seite 1 = .kurzfassung (Zusammenfassung mit Absender), Seite 2 =
   .top3-sektion (die drei Handlungsfelder mit Begruendung — die im
   Volldruck gestrichene Wiederholung ist hier gerade der Zweck, weil die
   Bereichspanels nicht mitgedruckt werden). Alles andere entfaellt. */
body.druck-kurz main > section{display:none !important}
body.druck-kurz main > section.kurzfassung{display:block !important}
body.druck-kurz main > section.top3-sektion{
  display:block !important;
  break-before:page;
  page-break-before:always;
}
body.druck-kurz .widerruf-hinweis,
body.druck-kurz .methodenseite,
body.druck-kurz .druckabschluss{display:none !important}
body.druck-kurz .top3-sektion .top3-raster{display:block !important}
body.druck-kurz .top3-sektion .top3-feld{
  background:#ffffff !important;
  border:0.4pt solid #cdd4dd !important;
  border-radius:2mm;
  padding:4mm 5mm !important;
  margin:0 0 4mm !important;
  break-inside:avoid;
  page-break-inside:avoid;
}
body.druck-kurz .top3-sektion .top3-feld h3{
  color:#1c2530 !important;
  font-size:11.5pt !important;
  margin:0 0 1.5mm !important;
}
body.druck-kurz .top3-sektion .top3-feld p{
  color:#3a4553 !important;
  font-size:9.5pt !important;
  line-height:1.55 !important;
  margin:0 !important;
}
body.druck-kurz .top3-sektion .hebel-gleichrangig{
  color:#3a4553 !important;
  font-size:9.5pt !important;
}