/* Personalportal Emil Geissmann AG */
:root {
  --grund: #f2f4f6;
  --flaeche: #ffffff;
  --tinte: #1c2731;
  --gedaempft: #5a6773;
  --linie: #d6dde3;
  --primaer: #1f4e79;
  --primaer-dunkel: #153a5c;
  --primaer-hell: #e6eef6;
  --faellig: #9a3f17;
  --faellig-hell: #fbeee6;
  --ok-hell: #e7f2ec;
  --ok: #1f6a46;
  --stufe-a: #163d68;
  --stufe-b: #2c5c91;
  --stufe-c: #5a82ae;
  --stufe-d: #98b1cb;
  --stufe-e: #c8d4e1;
  --radius: 6px;
  --schrift: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { font-size: 16px; }
body {
  margin: 0;
  background: var(--grund);
  color: var(--tinte);
  font-family: var(--schrift);
  line-height: 1.5;
}
a { color: var(--primaer); }
a:hover { color: var(--primaer-dunkel); }
:focus-visible { outline: 3px solid #f0b429; outline-offset: 2px; }

h1 { font-size: 1.75rem; line-height: 1.25; font-weight: 600; margin: 0 0 .25rem; letter-spacing: -.01em; }
h2 { font-size: 1.2rem; font-weight: 600; margin: 0 0 .75rem; }
h3 { font-size: 1.05rem; font-weight: 600; margin: 1.5rem 0 .75rem; }
h4 { font-size: 1rem; font-weight: 600; margin: 0; }
p { margin: 0 0 .75rem; }

/* Kopf */
.kopf { background: var(--primaer-dunkel); color: #fff; }
.kopf-innen {
  max-width: 1200px; margin: 0 auto; padding: .75rem 1.25rem;
  display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
}
.marke { color: #fff; text-decoration: none; font-weight: 600; }
.marke:hover { color: #fff; }
.marke-gruppe { display: inline-flex; align-items: baseline; gap: .6rem; }
.version { font-size: .75rem; color: #9fb6cf; border: 1px solid #3d5f82; border-radius: 3px; padding: 0 .35rem; line-height: 1.5; }
.hauptnav { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.hauptnav a { color: #c9d8e8; text-decoration: none; padding: .25rem 0; border-bottom: 2px solid transparent; }
.hauptnav a:hover { color: #fff; }
.hauptnav a[aria-current="page"] { color: #fff; border-bottom-color: #fff; }
.konto { margin-left: auto; display: flex; align-items: center; gap: 1rem; }
.konto a, .konto .link { color: #c9d8e8; }
.konto form { margin: 0; }

.inhalt { max-width: 1200px; margin: 0 auto; padding: 1.75rem 1.25rem 6rem; }
.seite-schmal .inhalt { max-width: 440px; }
.untertitel { color: var(--gedaempft); margin-bottom: 1.5rem; }
.brotkrumen { margin-bottom: .25rem; font-size: .9rem; }
.titelzeile { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.aktionen { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.aktionen form { margin: 0; }

/* Flächen */
.karte {
  background: var(--flaeche);
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.25rem;
}
.raster-2, .raster-3 { display: grid; gap: 1.25rem; }
.raster-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.raster-3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.raster-breit-schmal { grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); }
.raster-2 > .karte, .raster-3 > .karte { margin-bottom: 0; }
.raster-2, .raster-3 { margin-bottom: 1.25rem; }

/* Meldungen */
.meldung { padding: .75rem 1rem; border-radius: var(--radius); margin-bottom: 1rem; border-left: 4px solid; }
.meldung-ok { background: var(--ok-hell); border-color: var(--ok); }
.meldung-info { background: var(--primaer-hell); border-color: var(--primaer); }
.meldung-fehler { background: var(--faellig-hell); border-color: var(--faellig); }
.meldung ul { margin: .25rem 0 0; padding-left: 1.25rem; }
.leer { color: var(--gedaempft); }
.klein { font-size: .875rem; color: var(--gedaempft); }

/* Knöpfe */
.knopf {
  display: inline-block; border: 1px solid var(--primaer); background: var(--primaer); color: #fff;
  padding: .55rem 1.1rem; border-radius: var(--radius); font: inherit; font-weight: 600;
  text-decoration: none; cursor: pointer; line-height: 1.2;
}
.knopf:hover { background: var(--primaer-dunkel); color: #fff; }
.knopf-zweit { background: var(--flaeche); color: var(--primaer); }
.knopf-zweit:hover { background: var(--primaer-hell); color: var(--primaer-dunkel); }
.knopf-klein { padding: .35rem .75rem; font-size: .9rem; }
.link { background: none; border: 0; padding: 0; font: inherit; color: var(--primaer); text-decoration: underline; cursor: pointer; }
.link-gefahr { color: var(--faellig); }

/* Formulare */
.formular { display: grid; gap: 1rem; }
.formular label, .raster-formular label { display: grid; gap: .3rem; font-weight: 500; font-size: .95rem; }
.raster-formular { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
.raster-formular .breit, .zeile .breit { grid-column: 1 / -1; }
input, select, textarea {
  font: inherit; color: var(--tinte); background: #fff;
  border: 1px solid #b9c4cf; border-radius: 4px; padding: .5rem .6rem; width: 100%;
}
textarea { resize: vertical; }
input:disabled, select:disabled, textarea:disabled { background: #f7f9fa; color: var(--tinte); border-color: var(--linie); }
label.haekchen { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400; }
label.haekchen input { width: auto; margin-top: .3rem; }
.formular-fuss { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.marken-wahl { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: center; }
.marken-wahl legend { font-weight: 500; font-size: .95rem; margin-bottom: .3rem; padding: 0; }
.marken-wahl .klein { flex-basis: 100%; margin: 0; }
.filter { display: flex; gap: .5rem; align-items: end; margin: 0; }
.filter label { display: grid; gap: .2rem; font-size: .85rem; color: var(--gedaempft); }
.filter select { width: auto; padding: .35rem .5rem; }
details summary { cursor: pointer; color: var(--primaer); }
.schluessel { display: inline-block; font-size: 1.05rem; background: var(--primaer-hell); padding: .2rem .5rem; border-radius: 4px; word-break: break-all; }
.schritte { padding-left: 1.25rem; }
.schritte li { margin-bottom: .5rem; }

/* Tabellen und Listen */
.tabelle-rahmen { overflow-x: auto; }
.tabelle { width: 100%; border-collapse: collapse; }
.tabelle th { text-align: left; font-weight: 600; font-size: .875rem; color: var(--gedaempft); border-bottom: 2px solid var(--linie); padding: .5rem .6rem; }
.tabelle td { border-bottom: 1px solid var(--linie); padding: .6rem; vertical-align: middle; }
.tabelle form { margin: 0; }
.rechts { text-align: right; }
.nowrap { white-space: nowrap; }
tr.inaktiv td, .inaktiv { color: var(--gedaempft); }
.liste { list-style: none; margin: 0; padding: 0; }
.liste li { padding: .65rem 0; border-bottom: 1px solid var(--linie); }
.liste li:last-child { border-bottom: 0; }
.liste p { margin: .2rem 0 0; font-size: .925rem; }
.datum { color: var(--gedaempft); font-size: .875rem; margin-left: .35rem; }
.faellig { color: var(--faellig); font-weight: 600; font-size: .875rem; margin-left: .35rem; }
.daten { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.25rem; margin: 0; }
.daten dt { color: var(--gedaempft); }
.daten dd { margin: 0; }
.etikett { display: inline-block; font-size: .75rem; font-weight: 600; background: var(--primaer-hell); color: var(--primaer-dunkel); border-radius: 3px; padding: .05rem .4rem; }
.etikett-massnahme { background: var(--faellig-hell); color: var(--faellig); }
.status { font-size: .85rem; font-weight: 600; color: var(--ok); }
.status-entwurf { color: var(--faellig); }

/* Stufen-Abzeichen */
.badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.6rem; height: 1.6rem; border-radius: 4px; font-weight: 700; font-size: .85rem; color: #fff; }
.badge-leer { color: var(--gedaempft); }
.stufe-a.badge { background: var(--stufe-a); }
.stufe-b.badge { background: var(--stufe-b); }
.stufe-c.badge { background: var(--stufe-c); }
.stufe-d.badge { background: var(--stufe-d); color: var(--tinte); }
.stufe-e.badge { background: var(--stufe-e); color: var(--tinte); }
.skala-legende { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .875rem; color: var(--gedaempft); }
.skala-legende span { display: inline-flex; gap: .4rem; align-items: center; }

/* MAG-Seite */
.mag-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.mag-nav { position: sticky; top: 1rem; }
.mag-nav ol { margin: 0; padding-left: 1.4rem; display: grid; gap: .35rem; font-size: .925rem; color: var(--gedaempft); }
.mag-nav a { text-decoration: none; }
.mag-nav a:hover { text-decoration: underline; }
.abschnitt { scroll-margin-top: 1rem; }
.abschnitt > h2 { font-size: 1.35rem; padding-bottom: .5rem; border-bottom: 1px solid var(--linie); margin-bottom: 1rem; }

.zeilen { display: grid; gap: .75rem; margin-bottom: 1rem; }
.zeile {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem 1rem;
  padding: 1rem; border: 1px solid var(--linie); border-radius: var(--radius); background: #fafbfc;
}
.zeile label { display: grid; gap: .3rem; font-weight: 500; font-size: .925rem; }
.zeile .zeile-entfernen { justify-self: start; align-self: end; }
.ziel-text { font-weight: 600; margin-bottom: .25rem; }

.gruppe { padding-top: .25rem; }
.gruppe + .gruppe { border-top: 1px solid var(--linie); margin-top: 1.25rem; }
.kriterium {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem 1.5rem;
  padding: 1rem 0; border-bottom: 1px dashed var(--linie);
}
.kriterium-kopf .klein { margin: .15rem 0 0; }
.stufen-hilfe, .kriterium .kommentar { grid-column: 1 / -1; }
.stufen-hilfe {
  margin: 0; padding: .6rem .8rem; background: var(--primaer-hell); border-radius: 4px; font-size: .925rem; min-height: 2.6rem;
}
.kommentar { display: grid; gap: .3rem; font-weight: 500; font-size: .925rem; }
.kommentar.pflicht::after { content: "Bei dieser Stufe ist eine Begründung Pflicht."; order: -1; font-size: .8rem; color: var(--faellig); font-weight: 600; }

/* Die Stufenwahl A–E */
.stufenwahl { display: flex; gap: 4px; align-self: start; }
.stufe { position: relative; cursor: pointer; }
.stufe input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.stufe span {
  display: flex; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem; border-radius: 4px; font-weight: 700; font-size: 1.05rem;
  border: 2px solid var(--linie); background: #fff; color: var(--gedaempft);
  transition: background-color .12s, border-color .12s, color .12s;
}
.stufe:hover span { border-color: var(--stufe-c); color: var(--tinte); }
.stufe input:focus-visible + span { outline: 3px solid #f0b429; outline-offset: 2px; }
.stufe-a input:checked + span { background: var(--stufe-a); border-color: var(--stufe-a); color: #fff; }
.stufe-b input:checked + span { background: var(--stufe-b); border-color: var(--stufe-b); color: #fff; }
.stufe-c input:checked + span { background: var(--stufe-c); border-color: var(--stufe-c); color: #fff; }
.stufe-d input:checked + span { background: var(--stufe-d); border-color: var(--stufe-d); color: var(--tinte); }
.stufe-e input:checked + span { background: var(--stufe-e); border-color: #9fb2c6; color: var(--tinte); }
fieldset:disabled .stufe { cursor: default; }
fieldset:disabled .stufe input:not(:checked) + span { opacity: .45; }

.gesamt { display: flex; align-items: end; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; padding: .9rem 1rem; background: #f5f7f9; border-radius: var(--radius); }
.gesamt label { display: grid; gap: .3rem; font-weight: 600; }
.gesamt select { width: 6rem; }
.vorschlag { color: var(--gedaempft); font-size: .9rem; padding-bottom: .55rem; }

.speicherleiste {
  position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: flex-end; align-items: center; gap: 1rem;
  padding: .75rem 1.25rem; margin: 0 -1.25rem; background: rgba(242, 244, 246, .96); border-top: 1px solid var(--linie);
}
.ungespeichert { color: var(--faellig); font-size: .9rem; font-weight: 600; }
.nebenaktion { margin: 1rem 0 0 calc(190px + 1.5rem); }

/* Übersicht: MAG-Runde */
.runde-kopf { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.kennzahlen { display: flex; gap: 2.5rem; flex-wrap: wrap; margin: .25rem 0 .9rem; }
.kennzahl { display: flex; align-items: baseline; gap: .5rem; }
.kennzahl-wert { font-size: 2rem; font-weight: 600; line-height: 1; color: var(--primaer-dunkel); font-variant-numeric: tabular-nums; }
.kennzahl-text { color: var(--gedaempft); }
progress { appearance: none; -webkit-appearance: none; width: 100%; height: .5rem; border: 0; border-radius: 3px; background: #e3e8ed; overflow: hidden; vertical-align: middle; }
progress::-webkit-progress-bar { background: #e3e8ed; border-radius: 3px; }
progress::-webkit-progress-value { background: var(--primaer); border-radius: 3px; }
progress::-moz-progress-bar { background: var(--primaer); border-radius: 3px; }
.runde-balken { height: .75rem; margin-bottom: 1.25rem; }
.runde-tabellen { margin-bottom: .5rem; }
.tabelle-kompakt td, .tabelle-kompakt th { padding: .4rem .5rem; white-space: nowrap; }
.tabelle-kompakt td:last-child { width: 22%; min-width: 4rem; }
.zahl { text-align: right; font-variant-numeric: tabular-nums; }
.raster-termine { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.mag-status { display: inline-block; font-size: .8rem; font-weight: 600; padding: .1rem .5rem; border-radius: 3px; white-space: nowrap; }
.mag-status-offen { background: #eef1f4; color: var(--gedaempft); }
.mag-status-in-arbeit { background: var(--primaer-hell); color: var(--primaer-dunkel); }
.mag-status-abgeschlossen { background: var(--ok-hell); color: var(--ok); }

/* Filterleiste Mitarbeitende */
.filterleiste { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: end; padding: 1rem 1.25rem; }
.filterleiste label { display: grid; gap: .25rem; font-size: .85rem; color: var(--gedaempft); font-weight: 500; }
.filterleiste select, .filterleiste input[type="search"] { padding: .4rem .55rem; }
.filterleiste select { width: auto; min-width: 9rem; }
.filter-suche { flex: 1 1 240px; }
.filterleiste .filter-haekchen { display: flex; align-items: center; gap: .4rem; padding-bottom: .5rem; color: var(--tinte); font-weight: 400; }
.filter-knoepfe { display: flex; gap: 1rem; align-items: center; padding-bottom: .1rem; }

/* Gruppiertes Formular (Mitarbeitende) */
.formular-gruppiert { padding: 0; }
.formular-gruppe {
  display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 1rem 2rem;
  padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--linie);
}
.gruppe-titel h2 { font-size: 1rem; margin: .4rem 0 .35rem; }
.gruppe-titel .klein { margin: 0; }
.feldraster { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.feld { display: grid; gap: .3rem; font-weight: 500; font-size: .95rem; }
.feld-1 { grid-column: span 1; }
.feld-2 { grid-column: span 2; }
.feld-3 { grid-column: span 3; }
.feld-4 { grid-column: span 4; }
.feld-6 { grid-column: 1 / -1; }
.feld-titel { font-weight: 500; }
.feld-wert { padding: .5rem 0; color: var(--gedaempft); font-weight: 400; }
.haekchen-reihe { display: flex; flex-wrap: wrap; gap: .5rem 2rem; padding-top: .3rem; }
.formular-fuss-leiste { padding: 1rem 1.5rem; background: #f7f9fa; border-radius: 0 0 var(--radius) var(--radius); }

/* Kriterien-Administration */
.kriterium-admin summary { font-weight: 600; color: var(--tinte); }
.kriterium-admin[open] summary { margin-bottom: 1rem; }

/* Selbsteinschätzung im MAG */
.selbst-karte h3 { margin-top: 1rem; }
.link-box { display: flex; gap: .75rem; align-items: end; flex-wrap: wrap; margin-bottom: .5rem; }
.link-box label { flex: 1 1 320px; display: grid; gap: .3rem; font-weight: 500; }
.link-box input { font-family: Consolas, "Courier New", monospace; font-size: .85rem; }
.selbst-wert { grid-column: 1 / -1; margin: 0; padding: .45rem .8rem; border-left: 3px solid var(--stufe-c); background: #f7f9fb; font-size: .925rem; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.kriterium.gespraechspunkt { background: linear-gradient(90deg, var(--faellig-hell), transparent 40%); padding-left: .75rem; margin-left: -.75rem; border-left: 3px solid var(--faellig); }
.selbst-texte { margin-bottom: 1.25rem; padding: 1rem; background: #f7f9fb; border-radius: var(--radius); }
.selbst-texte h3 { margin-top: 0; }
.seite-selbst .inhalt { max-width: 760px; }

/* Druckdokumente (MAG, Selbsteinschätzung) */
.druck-steuerung { display: flex; justify-content: space-between; align-items: center; gap: 1rem; max-width: 210mm; margin: 0 auto 1rem; }
.dok {
  background: #fff; color: #111; max-width: 210mm; margin: 0 auto; padding: 18mm 17mm 20mm;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 0 0 1px rgba(0, 0, 0, .04);
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 9.5pt; line-height: 1.4;
}
.dok h1 { font-size: 16pt; font-weight: 700; letter-spacing: 0; margin: 0; }
.dok h2 { font-size: 10.5pt; font-weight: 700; margin: 7mm 0 2.5mm; padding-bottom: 1mm; border-bottom: .5pt solid #111; break-after: avoid; }
.dok h3 { font-size: 9.5pt; font-weight: 700; margin: 4mm 0 1.5mm; break-after: avoid; }
.dok p { margin: 0 0 2mm; }
.dok-kopf { display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; border-bottom: 1.2pt solid #111; padding-bottom: 3mm; margin-bottom: 5mm; }
.dok-firma { font-size: 10pt; font-weight: 700; margin: 0 0 1.5mm; }
.dok-kopf-rechts { text-align: right; font-size: 8.5pt; color: #444; }
.dok-kopf-rechts strong { display: block; color: #111; font-size: 9pt; }
.dok-stand { font-size: 8.5pt; color: #444; margin-top: 1mm; }
.dok-daten { width: 100%; border-collapse: collapse; margin-bottom: 2mm; }
.dok-daten th { text-align: left; font-weight: 400; color: #555; padding: .6mm 3mm .6mm 0; width: 22%; vertical-align: top; }
.dok-daten td { padding: .6mm 4mm .6mm 0; vertical-align: top; }
.dok-tabelle { width: 100%; border-collapse: collapse; margin-bottom: 2mm; }
.dok-tabelle th, .dok-tabelle td { border: .5pt solid #8c8c8c; padding: 1.4mm 2mm; text-align: left; vertical-align: top; }
.dok-tabelle thead th { background: #ececec; font-weight: 700; font-size: 8.5pt; }
.dok-tabelle td.stufe-zelle, .dok-tabelle th.stufe-zelle { text-align: center; width: 13mm; font-weight: 700; }
.dok-tabelle tr.gruppe-zeile td { background: #f5f5f5; font-weight: 700; }
.dok-tabelle tr { break-inside: avoid; }
.dok-tabelle.kompetenzen td:first-child { width: 28%; }
.dok-tabelle small { color: #555; }
.dok .hinweis { font-weight: 700; white-space: nowrap; }
.dok-legende { font-size: 8pt; color: #444; margin: 1mm 0 3mm; }
.dok-text { white-space: pre-wrap; }
.dok-leer { color: #666; font-style: italic; }
.dok-unterschriften { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10mm; margin-top: 16mm; break-inside: avoid; }
.dok-unterschriften.spalten-2 { grid-template-columns: repeat(2, 1fr); }
.dok-unterschriften div { border-top: .5pt solid #111; padding-top: 1.5mm; font-size: 8pt; color: #444; }
.dok-intro { border: .5pt solid #8c8c8c; padding: 2.5mm 3mm; margin-bottom: 3mm; }

/* Ankreuzfelder im Papierformular */
.kaestchen-reihe { display: flex; gap: 2.2mm; justify-content: center; }
.kaestchen { display: inline-flex; flex-direction: column; align-items: center; font-size: 7.5pt; color: #333; }
.kaestchen i { display: block; width: 4.2mm; height: 4.2mm; border: .7pt solid #111; margin-bottom: .6mm; font-style: normal; font-size: 8pt; line-height: 4mm; text-align: center; font-weight: 700; color: #111; }
.schreiblinie { border-bottom: .5pt solid #9a9a9a; height: 6mm; }
.dok-tabelle td.bemerkung-zelle { width: 46%; }

@page { size: A4; margin: 15mm 15mm 17mm; }
@page {
  @bottom-left { content: "Vertraulich"; font-family: Arial, sans-serif; font-size: 7.5pt; color: #555; }
  @bottom-right { content: "Seite " counter(page) " von " counter(pages); font-family: Arial, sans-serif; font-size: 7.5pt; color: #555; }
}

.anmeldung { margin-top: 3rem; }

@media (max-width: 860px) {
  .raster-termine { grid-template-columns: 1fr; }
  .formular-gruppe { grid-template-columns: 1fr; gap: .5rem; }
  .feldraster { grid-template-columns: 1fr 1fr; }
  .feld-3, .feld-4 { grid-column: 1 / -1; }
  .feld-1, .feld-2 { grid-column: span 1; }
  .mag-layout { grid-template-columns: 1fr; }
  .mag-nav { position: static; }
  .mag-nav ol { display: flex; flex-wrap: wrap; gap: .25rem 1rem; padding-left: 0; list-style: none; }
  .kriterium { grid-template-columns: 1fr; }
  .nebenaktion { margin-left: 0; }
  .raster-breit-schmal { grid-template-columns: 1fr; }
  .dok { padding: 8mm 6mm; }
}

@media (prefers-reduced-motion: reduce) {
  .stufe span { transition: none; }
}

@media print {
  body { background: #fff; }
  .kopf, .druck-steuerung, .meldung { display: none !important; }
  .inhalt { padding: 0; max-width: none; margin: 0; }
  .dok { box-shadow: none; padding: 0; max-width: none; margin: 0; }
  a { color: inherit; text-decoration: none; }
}