/* =====================================================================
   lab - werkzeuge/matheblatt/app.css
   Mathe-Übungsblatt: Eingaben links, druckfertige Blätter rechts.
   Ein Werkzeug, vier Aufgabenbereiche (Rechnen, Sachaufgaben,
   Geometrie, Uhrzeit). Zusammengefuehrt aus den Stylesheets von
   rechenblatt, sachaufgaben, geometrieblatt und uhrzeitblatt
   (Stand 05.10.2026).

   Gliederung:
     1. Gemeinsames Geruest   .lab_mb_*  (Eingaben, Reiter, KI,
                               Vorschau, Leiste, Pult)
     2. Bereich Rechnen       .lab_rb_*  (Blatt, Kopf, Aufgaben)
     3. Bereich Sachaufgaben  .lab_sa_*  (Blatt, Kopf, Aufgaben)
     4. Bereich Geometrie     .lab_gb_*  (Blatt, Kopf, Aufgaben)
     5. Bereich Uhrzeit       .lab_uh_*  (Blatt, Kopf, Aufgaben)
     6. Druck                  EIN @page-Block, EIN @media print

   Warum zwei Praefixe: Eingaben, KI und Vorschau sind in allen vier
   Bereichen dasselbe - sie stehen einmal als .lab_mb_ da. Die Blatt-
   Optik (Papier, Kopf-Stile, Aufgaben, Bruch-/Spalten-/Raster-/
   Zifferblatt-Bausteine, Loesungsseite, Blattfuss) ist je Bereich
   eigenstaendig und bleibt daher bei seinem Praefix (.lab_rb_,
   .lab_sa_, .lab_gb_, .lab_uh_). Die Praefixe sind verschieden,
   die Bloecke kollidieren nicht.

   Konventionen (AGENTS.md §5):
     - Alle Klassen mit Prefix .lab_
     - Keine harten Farben, nur Variablen aus css/colors.css
     - Das Blatt bleibt in beiden Modi weiss (--lab-tv-blatt) und
       traegt dunkle Tinte (--lab-tv-blatt-text).

   Druckregel (vereinheitlicht): EIN Satzspiegel fuer alle vier
   Bereiche, 14 mm oben und unten, 13 mm links und rechts. Das
   ergibt 184 mm Satzspiegel (A4 210 mm minus 2 x 13 mm) - genau
   die Breite, mit der werkzeuge/matheblatt/blattexport.js rechnet
   (695 x 1017 px). Die alten Einzelwerkzeuge hatten 15 mm Rand und
   180 mm Blattbreite; die Werte sind hier bewusst vereinheitlicht.
   ===================================================================== */

/* =====================================================================
   1. Gemeinsames Geruest
   ===================================================================== */

.lab_mb_layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  margin-top: 1.25rem;
}

@media (min-width: 64rem) {
  .lab_mb_layout {
    grid-template-columns: 24rem minmax(0, 1fr);
    align-items: start;
  }
}

/* ---------- Formular ---------- */

.lab_mb_formular {
  background: var(--ct-color);
  border: var(--lab-border);
  border-radius: 12px;
  padding: 1.1rem 1.2rem 1.25rem;
  box-shadow: var(--lab-shadow-1);
}

.lab_mb_formular > label[for] {
  display: block;
  margin: 0.9rem 0 0.3rem;
  font-weight: 600;
  font-size: 0.92rem;
}

.lab_mb_formular > label[for]:first-of-type { margin-top: 0; }

/* ---------- Reiter: einer je Aufgabenbereich ---------- */

.lab_mb_tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  border-bottom: 1px solid var(--lab-border-color);
  padding-bottom: 0.6rem;
}

.lab_mb_tab {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: none;
  color: var(--grey600-color);
  padding: 0.38rem 0.75rem;
  font: inherit;
  font-size: 0.92rem;
  cursor: pointer;
}

.lab_mb_tab:hover { color: var(--blk-color); }

.lab_mb_tab[aria-selected="true"] {
  background: var(--div-color);
  border-color: var(--lab-border-color);
  color: var(--blk-color);
  font-weight: 600;
}

.lab_mb_tab .lab_mb_tab_icon { flex: none; }

/* ---------- Bereichs-Panel: genau ein Bereich ist sichtbar, die
     anderen tragen das Attribut hidden ---------- */

.lab_mb_panel { margin-top: 0.9rem; }

.lab_mb_panel[hidden] { display: none; }

/* ---------- Eingaben ---------- */

.lab_mb_zeile {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.9rem;
}

.lab_mb_zeile label {
  font-size: 0.9rem;
  color: var(--grey600-color);
}

.lab_mb_zeile select { width: auto; }

/* Fach und Klasse teilen sich die Breite der Zeile (Muster
   Uhrzeitblatt, dort mit den Ids des alten Werkzeugs). */

#mb_fach,
#mb_klasse {
  flex: 1 1 7rem;
  min-width: 0;
}

/* Das Titelfeld sitzt direkt unter den Reitern und braucht dort
   mehr Luft als die uebrigen Beschriftungen (Muster Geometrie-
   blatt: Titelfeld und titeleingabe). */

.lab_mb_formular > .lab_mb_tabs + label[for] { margin-top: 1rem; }

#mb_titel { font-weight: 600; }

.lab_mb_gruppe {
  border: 1px solid var(--lab-border-color);
  border-radius: 8px;
  padding: 0.7rem 0.9rem 0.8rem;
  margin: 0.9rem 0 0;
}

.lab_mb_gruppe legend {
  padding: 0 0.35rem;
  font-weight: 600;
  font-size: 0.9rem;
}

.lab_mb_gruppe label[for] {
  display: block;
  margin: 0.55rem 0 0.2rem;
  font-size: 0.9rem;
  color: var(--grey600-color);
}

.lab_mb_gruppe select { width: auto; max-width: 100%; }

.lab_mb_wahl {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.92rem;
  margin: 0.3rem 1rem 0.15rem 0;
}

/* Aufgabentyp-Zeile: Wahl links, Anteilsregler rechts */

.lab_mb_typ {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.25rem;
}

.lab_mb_typ .lab_mb_wahl { flex: 1; margin: 0.15rem 0; }

.lab_mb_anteil {
  flex: 0 0 auto;
  width: 6.5rem;
  accent-color: var(--bt-color);
}

.lab_mb_anteil:disabled { opacity: 0.4; }

.lab_mb_anteil_anzeige {
  flex: 0 0 auto;
  min-width: 2.6rem;
  text-align: right;
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
  color: var(--grey600-color);
}

.lab_mb_zaehler {
  margin: 0.5rem 0 0;
  font-size: 0.85rem;
  color: var(--grey600-color);
}

/* Umfang: Anzahl, Varianten, Spalten und Seiten stehen unter dem
   Bereichs-Panel und damit ausserhalb der Bereichs-Gruppen. */

.lab_mb_umfang { margin-top: 1.1rem; }

/* ---------- KI & Austausch ---------- */

/* Der Kasten traegt zusaetzlich .lab_mb_gruppe (Rahmen und Polster
   kommen daher von dort), hier nur die Beschriftung der Klammer. */

.lab_mb_ki summary {
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
}

.lab_mb_ki_text {
  width: 100%;
  margin-top: 0.6rem;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 0.82rem;
  white-space: pre;
}

.lab_mb_ki_knopf {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.6rem;
}

.lab_mb_meldung { margin-top: 0.9rem; }

/* ---------- Vorschau ---------- */

.lab_mb_leiste {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.8rem;
}

.lab_mb_leiste .lab_btn { display: inline-flex; align-items: center; gap: 0.45rem; }

.lab_mb_leiste_frei { flex: 1 1 auto; }

.lab_mb_leiste_text { font-size: 0.88rem; color: var(--grey600-color); }

.lab_mb_leiste_hinweis { flex-basis: 100%; }

.lab_mb_leiste label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.9rem;
  color: var(--grey600-color);
}

/* Gedaempfter Knopf (z. B. "Lösung zeigen"), solange er aus ist. */

.lab_mb_leiste [aria-pressed="true"] {
  border-color: var(--bt-color);
  color: var(--bt-color);
}

/* Pult: graue Unterlage für das Blatt (wie in der Rätsel-Werkstatt) */

.lab_mb_pult {
  background: var(--div-color);
  border: var(--lab-border);
  border-radius: 14px;
  padding: clamp(0.8rem, 3vw, 2rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
}

/* Blattvorschau: der Stapel selbst ist transparent - JEDE Seite ist
     eigenes Papier in A4-Proportion (wie in der Textverarbeitung).
     Kurzer Inhalt bekommt die volle Blatthoehe, langer Inhalt waechst
     darueber hinaus. Gilt nur der Vorschau: Druck und Exporte
     verteilen die Seiten selbst. */

.lab_mb_blatt {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  width: min(100%, 49rem);
}

/* Die drei nicht aktiven Bereichs-Stapel tragen hidden. */

.lab_mb_blatt[hidden] { display: none !important; }

/* Loeschung in der Vorschau (Klasse aus kern.js). */

.lab_mb_vorschau_aus { display: none; }

@media (max-width: 30rem) {
  .lab_mb_pult { padding: 0.6rem; }
}

/* =====================================================================
   2. Bereich Rechnen (.lab_rb_) - Blatt, Kopf, Aufgaben
   ===================================================================== */

/* Fortsetzungskopf auf Folgeseiten: kleiner Akzent-Strich + Titel */

.lab_rb_fortsetzung {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 700;
  font-size: 0.95rem;
  margin: 0 0 1.1rem;
}

.lab_rb_fortsetzung::before {
  content: "";
  flex: 0 0 auto;
  width: 1.7rem;
  height: 4px;
  border-radius: 2px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Antwortfelder (Vorschau und Exporte): Linie zum Eintragen.
     Dunkle Tinte und genug Abstand zum Aufgabentext - im S/W-Druck
     muss die Schreiblinie klar sichtbar bleiben. */

.lab_rb_antwort {
  display: inline-block;
  min-width: 7rem;
  margin-left: 0.4rem;
  border-bottom: 1.5px solid var(--lab-tv-blatt-text);
  height: 1.2rem;
  vertical-align: baseline;
}

.lab_rb_sk_antwort { display: block; min-width: 7rem; margin: 0.2rem 0 0; }

/* Der Blattstapel bleibt transparent, die Seiten sind das Papier. */

.lab_rb_blatt {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  width: min(100%, 49rem);
}

.lab_rb_seite {
  background: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt-text);
  border: var(--lab-border);
  border-radius: 10px;
  box-shadow: var(--lab-shadow-1);
  padding: 1.7rem 1.9rem;
  min-height: 20rem;
  aspect-ratio: 0.707;
}

.lab_rb_seite + .lab_rb_seite { margin-top: 1.4rem; }

.lab_rb_blatt_leer {
  color: var(--grey600-color);
  text-align: center;
  padding: 4rem 1rem;
}

/* Eine Blattseite pro Variante (im Druck mit Seitenumbruch). */

.lab_rb_seite { break-after: page; }

.lab_rb_seite:last-of-type { break-after: auto; }

/* Auch die Lösungsseite ist ein eigenes Blatt. */

.lab_rb_loesung {
  background: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt-text);
  border: var(--lab-border);
  border-radius: 10px;
  box-shadow: var(--lab-shadow-1);
  padding: 1.7rem 1.9rem;
  margin-top: 1.4rem;
  min-height: 20rem;
}

/* Blattkopf: helle Waschung mit Akzent-Kante, Titel links, Meta rechts.
     Die Waschung ist bewusst sehr hell - im S/W-Druck bleibt sie ein
     feines Grau und stoert nicht; Titel und Akzent bleiben dunkel. */

.lab_rb_blattkopf {
  margin: 0 0 1.3rem;
  text-align: left;
}

.lab_rb_kopfbox {
  background: var(--lab-tv-blatt-akzent-zart);
  border-left: 4px solid var(--lab-tv-blatt-akzent);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_rb_kopfreihen {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.2rem;
  flex-wrap: wrap;
}

.lab_rb_titel {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  margin: 0;
}

.lab_rb_variante {
  display: inline-block;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  color: var(--lab-tv-blatt-akzent);
  background: var(--lab-tv-blatt);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.12rem 0.7rem;
  margin-left: 0.55rem;
  vertical-align: 0.25em;
  white-space: nowrap;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_rb_untertitel {
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
}

.lab_rb_fachklasse {
  margin: 0;
  font-size: 0.92rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
  white-space: nowrap;
}

.lab_rb_namedatum {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
  font-size: 0.95rem;
  margin: 0.9rem 0 0.2rem;
  text-align: left;
}

.lab_rb_namedatum span { flex: 1; border-bottom: 1.5px solid var(--lab-tv-blatt-text); padding: 0 0.4rem 0.18rem; }

/* ---------- Kopf-Stile: Waschung (Vorgabe) und weitere Varianten,
     modern (Akzentfarbe) und klassisch (reine Tinte). Alle Varianten
     behalten die Struktur (blattkopf > kopfbox > kopfreihen mit
     titel + fachklasse, untertitel) - nur die Optik der Kopfbox
     bzw. der Seite aendert sich. Papier bleibt weiss - im S/W-Druck
     bleibt alles lesbar (Muster der Rätsel-Werkstatt). ---------- */

/* Linie: Titel auf einer kräftigen Grundlinie, keine Waschung. */
.lab_rb_kopf_linie .lab_rb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0.55rem;
  border-bottom: 2.5px solid var(--lab-tv-blatt-akzent);
}

/* Farbband: durchgehende Akzent-Flaeche, helle Schrift darauf. */
.lab_rb_kopf_band .lab_rb_kopfbox {
  background: var(--lab-tv-blatt-akzent);
  border-left: 0;
  border-radius: 10px;
  padding: 0.85rem 1.2rem 0.8rem;
}

.lab_rb_kopf_band .lab_rb_titel,
.lab_rb_kopf_band .lab_rb_fachklasse {
  color: var(--lab-tv-blatt);
  opacity: 1;
}

.lab_rb_kopf_band .lab_rb_untertitel {
  color: var(--lab-tv-blatt);
  opacity: 0.85;
}

.lab_rb_kopf_band .lab_rb_variante {
  border-color: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt);
  background: transparent;
}

/* Schlicht: nur Schrift, keine Flaeche, keine Kante. */
.lab_rb_kopf_schlicht .lab_rb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

/* Karte (modern): weisse Karte mit feiner Tinten-Kante und kurzem
   Akzent-Strich oben - klar und flach. */
.lab_rb_kopf_karte .lab_rb_kopfbox {
  background: none;
  border: 1.25px solid var(--lab-tv-blatt-text);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  position: relative;
}

.lab_rb_kopf_karte .lab_rb_kopfbox::before {
  content: "";
  position: absolute;
  top: -1.25px;
  left: 1.2rem;
  width: 3.2rem;
  height: 4px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Balken (modern): kraeftige Akzent-Leiste ueber dem Titel. */
.lab_rb_kopf_balken .lab_rb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-top: 7px solid var(--lab-tv-blatt-akzent);
  padding: 0.6rem 0 0.35rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Doppellinie (klassisch): dicke Tintenlinie mit feiner Linie
   darunter - die klassische Schulbuch-Grundlinie. */
.lab_rb_kopf_doppellinie .lab_rb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-bottom: 3px solid var(--lab-tv-blatt-text);
  padding: 0.1rem 0 0.45rem;
  position: relative;
}

.lab_rb_kopf_doppellinie .lab_rb_kopfbox::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1.5px;
  background: var(--lab-tv-blatt-text);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Kopfkasten (klassisch): Kopf im Doppelrahmen. */
.lab_rb_kopf_kopfkasten .lab_rb_kopfbox {
  background: none;
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
  padding: 0.7rem 1.1rem 0.65rem;
}

/* Seitenrahmen (klassisch): feiner Doppelrahmen um die GANZE Seite
   (Klasse lab_rb_rahmenseite an der Blattseite, gesetzt in
   blattBauen), der Kopf selbst bleibt schriftlich wie "Schlicht". */
.lab_rb_kopf_rahmen .lab_rb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

.lab_rb_rahmenseite {
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
}

/* Titel-Ausrichtung Mitte: Kopfreihe stapelt, alles zentriert. */
.lab_rb_kopf_mitte { text-align: center; }

.lab_rb_kopf_mitte .lab_rb_kopfreihen {
  flex-direction: column;
  align-items: center;
}

.lab_rb_kopf_mitte .lab_rb_fachklasse { margin-top: 0.15rem; }

/* Kopfzeile: kleine Grossbuchstaben-Zeile ueber dem Titel
     (Schulname, Thema, ...). Auf dem Farbband hell statt gruen. */
.lab_rb_kopfzeile {
  margin: 0 0 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_rb_kopf_band .lab_rb_kopfzeile { color: var(--lab-tv-blatt); }

/* Aufgaben: Nummern als kleine Kreise mit Akzent-Rand - der Kreis
     bleibt im S/W-Druck als Umrandung erhalten, keine Flaeche nötig. */

.lab_rb_aufgaben {
  margin: 1.2rem 0 0;
  padding: 0;
  list-style: none;
  column-gap: 2.8rem;
  column-rule: 1px solid var(--lab-tv-blatt-linie);
  counter-reset: aufgabe;
}

.lab_rb_aufgaben li {
  counter-increment: aufgabe;
  position: relative;
  margin: 0 0 1.9rem;
  padding-left: 2.1rem;
  break-inside: avoid;
  line-height: 1.5;
  font-size: 1.04rem;
}

.lab_rb_aufgaben li::before {
  content: counter(aufgabe);
  position: absolute;
  left: 0;
  top: 0.1rem;
  width: 1.5rem;
  height: 1.5rem;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  border-radius: 50%;
  color: var(--lab-tv-blatt-akzent);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.5rem;
  text-align: center;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_rb_bruch {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  vertical-align: middle;
  margin: 0 0.15rem;
  line-height: 1.25;
}

.lab_rb_bruch > span:last-child {
  border-top: 1.5px solid var(--lab-tv-blatt-text);
  padding: 0 0.25rem;
}

.lab_rb_bruch > span:first-child { padding: 0 0.25rem; }

/* Schriftliche Verfahren: Mini-Spalte rechtsbündig */

.lab_rb_sk {
  display: inline-block;
  text-align: right;
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
  line-height: 1.45;
  min-width: 7rem;
  font-size: 1.02rem;
}

.lab_rb_sk_zeile { display: block; padding: 0 0.4rem; }

.lab_rb_sk_strich {
  display: block;
  border-top: 1.5px solid var(--lab-tv-blatt-text);
  height: 1.8rem;
}

.lab_rb_sk_ergebnis {
  display: block;
  padding: 0 0.35rem;
  font-weight: 600;
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Textaufgabe */

.lab_rb_textaufgabe { margin: 0; }

/* ---------- Lösungsseite ---------- */

.lab_rb_loesung { break-before: page; }

.lab_rb_loesung .lab_rb_aufgaben li { margin-bottom: 0.55rem; }

/* Ergebnisse in der Akzentfarbe - im S/W-Druck ein deutliches
   Mittelgrau, auf dem Blatt klar vom Aufgabentext unterschieden. */

.lab_rb_aufgaben strong {
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Bruch-Ergebnisse der Lösungsseite: Zähler/Nenner und Bruchstrich
   ebenfalls in der Akzentfarbe (gleiches Grün wie alle Ergebnisse). */

.lab_rb_loesung .lab_rb_bruch {
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_rb_loesung .lab_rb_bruch > span:last-child { border-top-color: var(--lab-tv-blatt-akzent); }

.lab_rb_loesungsliste { font-size: 0.95rem; }

.lab_rb_loesungsblatt {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  margin: 1.2rem 0 0.4rem;
}

.lab_rb_vorschau_aus { display: none; }

/* ---------- Blattfuss ---------- */

.lab_rb_blattfuss {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid var(--lab-tv-blatt-linie);
  margin-top: 1.8rem;
  padding-top: 0.45rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--lab-tv-blatt-text);
  opacity: 0.55;
}

/* =====================================================================
   3. Bereich Sachaufgaben (.lab_sa_) - Blatt, Kopf, Aufgaben
   ===================================================================== */

/* Fortsetzungskopf auf Folgeseiten: kleiner Akzent-Strich + Titel */

.lab_sa_fortsetzung {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 700;
  font-size: 0.95rem;
  margin: 0 0 1.1rem;
}

.lab_sa_fortsetzung::before {
  content: "";
  flex: 0 0 auto;
  width: 1.7rem;
  height: 4px;
  border-radius: 2px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Antwortfelder (Vorschau und Exporte): Linie zum Eintragen.
     Dunkle Tinte und genug Abstand zum Aufgabentext - im S/W-Druck
     muss die Schreiblinie klar sichtbar bleiben. */

.lab_sa_antwort {
  display: inline-block;
  min-width: 7rem;
  margin-left: 0.4rem;
  border-bottom: 1.5px solid var(--lab-tv-blatt-text);
  height: 1.2rem;
  vertical-align: baseline;
}

.lab_sa_blatt {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  width: min(100%, 49rem);
}

/* Auch die Lösungsseite ist ein eigenes Blatt. */

.lab_sa_loesung {
  background: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt-text);
  border: var(--lab-border);
  border-radius: 10px;
  box-shadow: var(--lab-shadow-1);
  padding: 1.7rem 1.9rem;
  margin-top: 1.4rem;
  min-height: 20rem;
}

/* Blattkopf: helle Waschung mit Akzent-Kante, Titel links, Meta rechts.
     Die Waschung ist bewusst sehr hell - im S/W-Druck bleibt sie ein
     feines Grau und stoert nicht; Titel und Akzent bleiben dunkel. */

.lab_sa_blattkopf {
  margin: 0 0 1.3rem;
  text-align: left;
}

.lab_sa_kopfbox {
  background: var(--lab-tv-blatt-akzent-zart);
  border-left: 4px solid var(--lab-tv-blatt-akzent);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_sa_kopfreihen {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.2rem;
  flex-wrap: wrap;
}

.lab_sa_titel {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  margin: 0;
}

.lab_sa_variante {
  display: inline-block;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  color: var(--lab-tv-blatt-akzent);
  background: var(--lab-tv-blatt);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.12rem 0.7rem;
  margin-left: 0.55rem;
  vertical-align: 0.25em;
  white-space: nowrap;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_sa_untertitel {
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
}

.lab_sa_fachklasse {
  margin: 0;
  font-size: 0.92rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
  white-space: nowrap;
}

.lab_sa_namedatum {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
  font-size: 0.95rem;
  margin: 0.9rem 0 0.2rem;
  text-align: left;
}

.lab_sa_namedatum span { flex: 1; border-bottom: 1.5px solid var(--lab-tv-blatt-text); padding: 0 0.4rem 0.18rem; }

/* ---------- Kopf-Stile: Waschung (Vorgabe) und weitere Varianten,
     modern (Akzentfarbe) und klassisch (reine Tinte). Alle Varianten
     behalten die Struktur (blattkopf > kopfbox > kopfreihen mit
     titel + fachklasse, untertitel) - nur die Optik der Kopfbox
     bzw. der Seite aendert sich. Papier bleibt weiss - im S/W-Druck
     bleibt alles lesbar (Muster der Rätsel-Werkstatt). ---------- */

/* Linie: Titel auf einer kräftigen Grundlinie, keine Waschung. */
.lab_sa_kopf_linie .lab_sa_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0.55rem;
  border-bottom: 2.5px solid var(--lab-tv-blatt-akzent);
}

/* Farbband: durchgehende Akzent-Flaeche, helle Schrift darauf. */
.lab_sa_kopf_band .lab_sa_kopfbox {
  background: var(--lab-tv-blatt-akzent);
  border-left: 0;
  border-radius: 10px;
  padding: 0.85rem 1.2rem 0.8rem;
}

.lab_sa_kopf_band .lab_sa_titel,
.lab_sa_kopf_band .lab_sa_fachklasse {
  color: var(--lab-tv-blatt);
  opacity: 1;
}

.lab_sa_kopf_band .lab_sa_untertitel {
  color: var(--lab-tv-blatt);
  opacity: 0.85;
}

.lab_sa_kopf_band .lab_sa_variante {
  border-color: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt);
  background: transparent;
}

/* Schlicht: nur Schrift, keine Flaeche, keine Kante. */
.lab_sa_kopf_schlicht .lab_sa_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

/* Karte (modern): weisse Karte mit feiner Tinten-Kante und kurzem
   Akzent-Strich oben - klar und flach. */
.lab_sa_kopf_karte .lab_sa_kopfbox {
  background: none;
  border: 1.25px solid var(--lab-tv-blatt-text);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  position: relative;
}

.lab_sa_kopf_karte .lab_sa_kopfbox::before {
  content: "";
  position: absolute;
  top: -1.25px;
  left: 1.2rem;
  width: 3.2rem;
  height: 4px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Balken (modern): kraeftige Akzent-Leiste ueber dem Titel. */
.lab_sa_kopf_balken .lab_sa_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-top: 7px solid var(--lab-tv-blatt-akzent);
  padding: 0.6rem 0 0.35rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Doppellinie (klassisch): dicke Tintenlinie mit feiner Linie
   darunter - die klassische Schulbuch-Grundlinie. */
.lab_sa_kopf_doppellinie .lab_sa_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-bottom: 3px solid var(--lab-tv-blatt-text);
  padding: 0.1rem 0 0.45rem;
  position: relative;
}

.lab_sa_kopf_doppellinie .lab_sa_kopfbox::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1.5px;
  background: var(--lab-tv-blatt-text);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Kopfkasten (klassisch): Kopf im Doppelrahmen. */
.lab_sa_kopf_kopfkasten .lab_sa_kopfbox {
  background: none;
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
  padding: 0.7rem 1.1rem 0.65rem;
}

/* Seitenrahmen (klassisch): feiner Doppelrahmen um die GANZE Seite
   (Klasse lab_sa_rahmenseite an der Blattseite, gesetzt in
   blattBauen), der Kopf selbst bleibt schriftlich wie "Schlicht". */
.lab_sa_kopf_rahmen .lab_sa_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

.lab_sa_rahmenseite {
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
}

/* Titel-Ausrichtung Mitte: Kopfreihe stapelt, alles zentriert. */
.lab_sa_kopf_mitte { text-align: center; }

.lab_sa_kopf_mitte .lab_sa_kopfreihen {
  flex-direction: column;
  align-items: center;
}

.lab_sa_kopf_mitte .lab_sa_fachklasse { margin-top: 0.15rem; }

/* Kopfzeile: kleine Grossbuchstaben-Zeile ueber dem Titel
     (Schulname, Thema, ...). Auf dem Farbband hell statt gruen. */
.lab_sa_kopfzeile {
  margin: 0 0 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_sa_kopf_band .lab_sa_kopfzeile { color: var(--lab-tv-blatt); }

/* Aufgaben: Nummern als kleine Kreise mit Akzent-Rand - der Kreis
     bleibt im S/W-Druck als Umrandung erhalten, keine Flaeche nötig.
     Textaufgaben brauchen mehr Platz als kurze Rechnungen: Luft
     zwischen den Aufgaben und eine feste Grundlinie zum Reinschreiben. */

.lab_sa_aufgaben {
  margin: 1.2rem 0 0;
  padding: 0;
  list-style: none;
  column-gap: 2.8rem;
  column-rule: 1px solid var(--lab-tv-blatt-linie);
  counter-reset: aufgabe;
}

.lab_sa_aufgaben li {
  counter-increment: aufgabe;
  position: relative;
  margin: 0 0 1.35rem;
  padding-left: 2.1rem;
  break-inside: avoid;
  line-height: 1.55;
  font-size: 1.02rem;
}

.lab_sa_aufgaben li::before {
  content: counter(aufgabe);
  position: absolute;
  left: 0;
  top: 0.1rem;
  width: 1.5rem;
  height: 1.5rem;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  border-radius: 50%;
  color: var(--lab-tv-blatt-akzent);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.5rem;
  text-align: center;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* ---------- Lösungsseite ---------- */

.lab_sa_loesung { break-before: page; }

.lab_sa_loesung .lab_sa_aufgaben li { margin-bottom: 0.7rem; }

/* Rechenweg vor der Antwort: etwas kleiner und ruhiger als der
   Aufgabentext, die Antwort selbst in der Akzentfarbe - im S/W-Druck
   ein deutliches Mittelgrau, klar vom Rechenweg unterschieden. */

.lab_sa_weg { opacity: 0.82; }

.lab_sa_aufgaben strong {
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_sa_loesungsliste { font-size: 0.95rem; }

.lab_sa_loesungsblatt {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  margin: 1.2rem 0 0.4rem;
}

.lab_sa_vorschau_aus { display: none; }

/* ---------- Blattfuss ---------- */

.lab_sa_blattfuss {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid var(--lab-tv-blatt-linie);
  margin-top: 1.8rem;
  padding-top: 0.45rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--lab-tv-blatt-text);
  opacity: 0.55;
}

/* Am PC ausfüllbare HTML-Exporte: das Antwortfeld läuft über die
   volle Breite der Zeile (der Export-Kern setzt 6.5 rem als Vorgabe). */

.bef_blatt .lab_sa_antwort input {
  width: 100%;
  max-width: 14rem;
}

/* =====================================================================
   4. Bereich Geometrie (.lab_gb_) - Blatt, Kopf, Aufgaben
   ===================================================================== */

/* ---------- Das Blatt selbst: der Stapel ist transparent - JEDER
     Seite (Variante) ist eigenes Papier in A4-Proportion (wie
     Rechenblatt und Rätsel-Werkstatt). Druck und Exporte verteilen
     die Seiten selbst. ---------- */

.lab_gb_blatt {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  width: min(100%, 49rem);
}

.lab_gb_seite {
  background: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt-text);
  border: var(--lab-border);
  border-radius: 10px;
  box-shadow: var(--lab-shadow-1);
  padding: 1.7rem 1.9rem;
  min-height: 20rem;
  aspect-ratio: 0.707;
}

.lab_gb_seite + .lab_gb_seite { margin-top: 1.4rem; }

/* Eine Blattseite pro Variante (im Druck mit Seitenumbruch). */

.lab_gb_seite { break-after: page; }

.lab_gb_seite:last-of-type { break-after: auto; }

/* Fortsetzungskopf auf Folgeseiten: kleiner Akzent-Strich + Titel,
   Blatt und Seitenzahl (Muster Rechenblatt). */

.lab_gb_fortsetzung {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 700;
  font-size: 0.95rem;
  margin: 0 0 1.1rem;
}

.lab_gb_fortsetzung::before {
  content: "";
  flex: 0 0 auto;
  width: 1.7rem;
  height: 4px;
  border-radius: 2px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_gb_blatt_leer {
  color: var(--grey600-color);
  text-align: center;
  padding: 5rem 1rem;
}

/* Blattkopf (Muster der Rätsel-Werkstatt): Kopfbox mit Titel links
     oder mitte, Fach/Klasse daneben bzw. darunter, Kopfzeile darueber,
     Untertitel darunter, Name/Datum ausserhalb der Box. */

.lab_gb_blattkopf {
  margin: 0 0 1.3rem;
  text-align: left;
}

.lab_gb_kopfbox {
  background: var(--lab-tv-blatt-akzent-zart);
  border-left: 4px solid var(--lab-tv-blatt-akzent);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_gb_kopfreihen {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.2rem;
  flex-wrap: wrap;
}

.lab_gb_titel {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  margin: 0;
}

.lab_gb_variante {
  display: inline-block;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  color: var(--lab-tv-blatt-akzent);
  background: var(--lab-tv-blatt);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.12rem 0.7rem;
  margin-left: 0.55rem;
  vertical-align: 0.25em;
  white-space: nowrap;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_gb_untertitel {
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
}

.lab_gb_fachklasse {
  margin: 0;
  font-size: 0.92rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
  white-space: nowrap;
}

.lab_gb_namedatum {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
  font-size: 0.95rem;
  margin: 0.9rem 0 0.2rem;
  text-align: left;
}

.lab_gb_namedatum span { flex: 1; border-bottom: 1.5px solid var(--lab-tv-blatt-text); padding: 0 0.4rem 0.18rem; }

/* ---------- Kopf-Stile: Waschung (Vorgabe) und weitere Varianten,
     modern (Akzentfarbe) und klassisch (reine Tinte). Alle Varianten
     behalten die Struktur (blattkopf > kopfbox > kopfreihen mit
     titel + fachklasse, untertitel) - nur die Optik der Kopfbox
     bzw. der Seite aendert sich. Papier bleibt weiss - im S/W-Druck
     bleibt alles lesbar (Muster der Rätsel-Werkstatt). ---------- */

/* Linie: Titel auf einer kräftigen Grundlinie, keine Waschung. */
.lab_gb_kopf_linie .lab_gb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0.55rem;
  border-bottom: 2.5px solid var(--lab-tv-blatt-akzent);
}

/* Farbband: durchgehende Akzent-Flaeche, helle Schrift darauf. */
.lab_gb_kopf_band .lab_gb_kopfbox {
  background: var(--lab-tv-blatt-akzent);
  border-left: 0;
  border-radius: 10px;
  padding: 0.85rem 1.2rem 0.8rem;
}

.lab_gb_kopf_band .lab_gb_titel,
.lab_gb_kopf_band .lab_gb_fachklasse {
  color: var(--lab-tv-blatt);
  opacity: 1;
}

.lab_gb_kopf_band .lab_gb_untertitel {
  color: var(--lab-tv-blatt);
  opacity: 0.85;
}

.lab_gb_kopf_band .lab_gb_variante {
  border-color: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt);
  background: transparent;
}

/* Schlicht: nur Schrift, keine Flaeche, keine Kante. */
.lab_gb_kopf_schlicht .lab_gb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

/* Karte (modern): weisse Karte mit feiner Tinten-Kante und kurzem
   Akzent-Strich oben - klar und flach. */
.lab_gb_kopf_karte .lab_gb_kopfbox {
  background: none;
  border: 1.25px solid var(--lab-tv-blatt-text);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  position: relative;
}

.lab_gb_kopf_karte .lab_gb_kopfbox::before {
  content: "";
  position: absolute;
  top: -1.25px;
  left: 1.2rem;
  width: 3.2rem;
  height: 4px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Balken (modern): kraeftige Akzent-Leiste ueber dem Titel. */
.lab_gb_kopf_balken .lab_gb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-top: 7px solid var(--lab-tv-blatt-akzent);
  padding: 0.6rem 0 0.35rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Doppellinie (klassisch): dicke Tintenlinie mit feiner Linie
   darunter - die klassische Schulbuch-Grundlinie. */
.lab_gb_kopf_doppellinie .lab_gb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-bottom: 3px solid var(--lab-tv-blatt-text);
  padding: 0.1rem 0 0.45rem;
  position: relative;
}

.lab_gb_kopf_doppellinie .lab_gb_kopfbox::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1.5px;
  background: var(--lab-tv-blatt-text);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Kopfkasten (klassisch): Kopf im Doppelrahmen. */
.lab_gb_kopf_kopfkasten .lab_gb_kopfbox {
  background: none;
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
  padding: 0.7rem 1.1rem 0.65rem;
}

/* Seitenrahmen (klassisch): feiner Doppelrahmen um die GANZE Seite
   (Klasse lab_gb_rahmenseite an der Blattseite, gesetzt in
   aufgabenBlatt), der Kopf selbst bleibt schriftlich wie "Schlicht". */
.lab_gb_kopf_rahmen .lab_gb_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

.lab_gb_rahmenseite {
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
}

/* Titel-Ausrichtung Mitte: Kopfreihe stapelt, alles zentriert. */
.lab_gb_kopf_mitte { text-align: center; }

.lab_gb_kopf_mitte .lab_gb_kopfreihen {
  flex-direction: column;
  align-items: center;
}

.lab_gb_kopf_mitte .lab_gb_fachklasse { margin-top: 0.15rem; }

/* Kopfzeile: kleine Grossbuchstaben-Zeile ueber dem Titel
     (Schulname, Thema, ...). Auf dem Farbband hell statt gruen. */
.lab_gb_kopfzeile {
  margin: 0 0 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_gb_kopf_band .lab_gb_kopfzeile { color: var(--lab-tv-blatt); }

/* ---------- Aufgaben ---------- */

.lab_gb_aufgaben {
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.6rem;
}

@media (min-width: 40rem) {
  .lab_gb_aufgaben { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

.lab_gb_aufgabe {
  break-inside: avoid;
  border: 1px solid var(--lab-tv-blatt-linie);
  border-radius: 8px;
  padding: 0.8rem 0.9rem 0.9rem;
}

.lab_gb_aufgabe_titel {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 700;
}

/* SVG-Grafiken erben die Blatt-Tinte über currentColor, damit sie in
   Vorschau, Druck und allen Exporten gleich aussehen. */

.lab_gb_svg {
  display: block;
  width: 100%;
  height: auto;
  color: var(--lab-tv-blatt-text);
}

.lab_gb_svg text { fill: var(--lab-tv-blatt-text); }

.lab_gb_gitter { stroke: var(--lab-tv-blatt-linie); stroke-width: 1; }

.lab_gb_achse { stroke: currentColor; stroke-width: 2; }

.lab_gb_spiegelachse { stroke: currentColor; stroke-width: 2.5; stroke-dasharray: 7 4; }

.lab_gb_figur { fill: none; stroke: currentColor; stroke-width: 2; }

.lab_gb_spiegelbild { fill: none; stroke: currentColor; stroke-width: 2; stroke-dasharray: 2 0; opacity: 0.85; }

.lab_gb_punkt { stroke: currentColor; stroke-width: 2.2; }

.lab_gb_bemassung { font-size: 12px; }

.lab_gb_koordinate { font-size: 1.02rem; margin: 0.5rem 0 0; }

.lab_gb_loesungswort { font-weight: 700; }

/* Schreiblinie zum Eintragen (Vorschau und Exporte) */

.lab_gb_antwort {
  display: inline-block;
  min-width: 5.5rem;
  border-bottom: 1px solid var(--lab-tv-blatt-text);
  min-height: 1.4rem;
}

.lab_gb_antwortzeile { margin: 0.45rem 0 0; font-size: 1.02rem; }

/* ---------- Blattfuss ---------- */

/* Fusszeile an die Unterkante des Papiers heften (nur Vorschau) -
   im Druck bleibt sie im Textfluss, volle Seiten laufen weiter. */

.lab_gb_seite,
.lab_gb_loesung { position: relative; }

.lab_gb_blattfuss {
  position: absolute;
  left: 1.9rem;
  right: 1.9rem;
  bottom: 1.7rem;

  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid var(--lab-tv-blatt-linie);
  margin-top: 1.8rem;
  padding-top: 0.45rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--lab-tv-blatt-linie);
}

/* ---------- Lösungsseite ---------- */

.lab_gb_loesung { break-before: page; }

.lab_gb_loesungsblatt {
  text-align: center;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-text);
  margin: 0 0 1.1rem;
}

.lab_gb_vorschau_aus { display: none; }

@media (max-width: 30rem) {
  .lab_gb_seite { padding: 1rem 1rem 1.2rem; }
}

/* ---------- Klassen des alten Geometrie-Eingabebereichs: das
     gemeinsame Formular (.lab_mb_*) nimmt die Eingaben jetzt
     entgegen, die Bereichs-Module setzen diese Klassen nicht mehr.
     Sie bleiben unveraendert im Stylesheet, damit der
     Klassenbestand der Bereichsseiten vollstaendig bleibt. ---------- */

.lab_gb_titelfeld {
  display: block;
  margin: 1rem 0 0.3rem;
  font-weight: 600;
  font-size: 0.92rem;
}

.lab_gb_titeleingabe { font-weight: 600; }

.lab_gb_optionen { margin-top: 0.9rem; }

.lab_gb_ki_knopfzeile {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.6rem;
}

/* =====================================================================
   5. Bereich Uhrzeit (.lab_uh_) - Blatt, Kopf, Aufgaben
   ===================================================================== */

/* ---------- Blattvorschau: der Stapel ist transparent - JEDER
     Seite (Variante, Lösung) ist eigenes Papier in A4-Proportion
     (wie Rechenblatt und Rätsel-Werkstatt). ---------- */

.lab_uh_blatt {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  width: min(100%, 49rem);
}

.lab_uh_seite,
.lab_uh_loesung {
  background: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt-text);
  border: var(--lab-border);
  border-radius: 10px;
  box-shadow: var(--lab-shadow-1);
  padding: 1.7rem 1.9rem;
  min-height: 20rem;
  aspect-ratio: 0.707;
}

.lab_uh_seite + .lab_uh_seite { margin-top: 1.4rem; }

.lab_uh_loesung { margin-top: 1.4rem; }

.lab_uh_blatt_leer {
  color: var(--grey600-color);
  text-align: center;
  padding: 5rem 1rem;
}

/* Eine Blattseite pro Variante (im Druck mit Seitenumbruch). */

.lab_uh_seite { break-after: page; }

.lab_uh_seite:last-of-type { break-after: auto; }

/* Fortsetzungskopf auf Folgeseiten: kleiner Akzent-Strich + Titel,
   Blatt und Seitenzahl (Muster Rechenblatt). */

.lab_uh_fortsetzung {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 700;
  font-size: 0.95rem;
  margin: 0 0 1.1rem;
}

.lab_uh_fortsetzung::before {
  content: "";
  flex: 0 0 auto;
  width: 1.7rem;
  height: 4px;
  border-radius: 2px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Blattkopf (Muster der Rätsel-Werkstatt): Kopfbox mit Titel links
     oder mitte, Fach/Klasse daneben bzw. darunter, Kopfzeile darueber,
     Untertitel darunter, Name/Datum ausserhalb der Box. */

.lab_uh_blattkopf {
  margin: 0 0 1.3rem;
  text-align: left;
}

.lab_uh_kopfbox {
  background: var(--lab-tv-blatt-akzent-zart);
  border-left: 4px solid var(--lab-tv-blatt-akzent);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_uh_kopfreihen {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1.2rem;
  flex-wrap: wrap;
}

.lab_uh_titel {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  margin: 0;
}

.lab_uh_variante {
  display: inline-block;
  border: 1.5px solid var(--lab-tv-blatt-akzent);
  color: var(--lab-tv-blatt-akzent);
  background: var(--lab-tv-blatt);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.12rem 0.7rem;
  margin-left: 0.55rem;
  vertical-align: 0.25em;
  white-space: nowrap;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_uh_untertitel {
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
}

.lab_uh_fachklasse {
  margin: 0;
  font-size: 0.92rem;
  color: var(--lab-tv-blatt-text);
  opacity: 0.68;
  white-space: nowrap;
}

.lab_uh_namedatum {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
  font-size: 0.95rem;
  margin: 0.9rem 0 0.2rem;
  text-align: left;
}

.lab_uh_namedatum span { flex: 1; border-bottom: 1.5px solid var(--lab-tv-blatt-text); padding: 0 0.4rem 0.18rem; }

/* ---------- Kopf-Stile: Waschung (Vorgabe) und weitere Varianten,
     modern (Akzentfarbe) und klassisch (reine Tinte). Alle Varianten
     behalten die Struktur (blattkopf > kopfbox > kopfreihen mit
     titel + fachklasse, untertitel) - nur die Optik der Kopfbox
     bzw. der Seite aendert sich. Papier bleibt weiss - im S/W-Druck
     bleibt alles lesbar (Muster der Rätsel-Werkstatt). ---------- */

/* Linie: Titel auf einer kräftigen Grundlinie, keine Waschung. */
.lab_uh_kopf_linie .lab_uh_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0.55rem;
  border-bottom: 2.5px solid var(--lab-tv-blatt-akzent);
}

/* Farbband: durchgehende Akzent-Flaeche, helle Schrift darauf. */
.lab_uh_kopf_band .lab_uh_kopfbox {
  background: var(--lab-tv-blatt-akzent);
  border-left: 0;
  border-radius: 10px;
  padding: 0.85rem 1.2rem 0.8rem;
}

.lab_uh_kopf_band .lab_uh_titel,
.lab_uh_kopf_band .lab_uh_fachklasse {
  color: var(--lab-tv-blatt);
  opacity: 1;
}

.lab_uh_kopf_band .lab_uh_untertitel {
  color: var(--lab-tv-blatt);
  opacity: 0.85;
}

.lab_uh_kopf_band .lab_uh_variante {
  border-color: var(--lab-tv-blatt);
  color: var(--lab-tv-blatt);
  background: transparent;
}

/* Schlicht: nur Schrift, keine Flaeche, keine Kante. */
.lab_uh_kopf_schlicht .lab_uh_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

/* Karte (modern): weisse Karte mit feiner Tinten-Kante und kurzem
   Akzent-Strich oben - klar und flach. */
.lab_uh_kopf_karte .lab_uh_kopfbox {
  background: none;
  border: 1.25px solid var(--lab-tv-blatt-text);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.95rem;
  position: relative;
}

.lab_uh_kopf_karte .lab_uh_kopfbox::before {
  content: "";
  position: absolute;
  top: -1.25px;
  left: 1.2rem;
  width: 3.2rem;
  height: 4px;
  background: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Balken (modern): kraeftige Akzent-Leiste ueber dem Titel. */
.lab_uh_kopf_balken .lab_uh_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-top: 7px solid var(--lab-tv-blatt-akzent);
  padding: 0.6rem 0 0.35rem;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Doppellinie (klassisch): dicke Tintenlinie mit feiner Linie
   darunter - die klassische Schulbuch-Grundlinie. */
.lab_uh_kopf_doppellinie .lab_uh_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  border-bottom: 3px solid var(--lab-tv-blatt-text);
  padding: 0.1rem 0 0.45rem;
  position: relative;
}

.lab_uh_kopf_doppellinie .lab_uh_kopfbox::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1.5px;
  background: var(--lab-tv-blatt-text);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

/* Kopfkasten (klassisch): Kopf im Doppelrahmen. */
.lab_uh_kopf_kopfkasten .lab_uh_kopfbox {
  background: none;
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
  padding: 0.7rem 1.1rem 0.65rem;
}

/* Seitenrahmen (klassisch): feiner Doppelrahmen um die GANZE Seite
   (Klasse lab_uh_rahmenseite an der Blattseite, gesetzt in
   blattErzeugen), der Kopf selbst bleibt schriftlich wie "Schlicht". */
.lab_uh_kopf_rahmen .lab_uh_kopfbox {
  background: none;
  border-left: 0;
  border-radius: 0;
  padding: 0.1rem 0 0;
}

.lab_uh_rahmenseite {
  border: 4px double var(--lab-tv-blatt-text);
  border-radius: 0;
}

/* Titel-Ausrichtung Mitte: Kopfreihe stapelt, alles zentriert. */
.lab_uh_kopf_mitte { text-align: center; }

.lab_uh_kopf_mitte .lab_uh_kopfreihen {
  flex-direction: column;
  align-items: center;
}

.lab_uh_kopf_mitte .lab_uh_fachklasse { margin-top: 0.15rem; }

/* Kopfzeile: kleine Grossbuchstaben-Zeile ueber dem Titel
     (Schulname, Thema, ...). Auf dem Farbband hell statt gruen. */
.lab_uh_kopfzeile {
  margin: 0 0 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lab-tv-blatt-akzent);
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.lab_uh_kopf_band .lab_uh_kopfzeile { color: var(--lab-tv-blatt); }

/* Aufgabenraster: 2 Spalten, auf breitem Blatt 3 */

.lab_uh_raster {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem 1.4rem;
}

@media (min-width: 70rem) {
  .lab_uh_raster { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.lab_uh_aufgabe {
  break-inside: avoid;
  text-align: center;
  line-height: 1.5;
  font-size: 1.02rem;
}

.lab_uh_nummer {
  font-weight: 700;
  margin: 0 0 0.3rem;
  text-align: left;
}

.lab_uh_vorgabe {
  font-weight: 700;
  font-size: 1.25rem;
  margin: 0 0 0.3rem;
}

/* Antwortlinie zum Eintragen der Uhrzeit */

.lab_uh_antwort {
  display: block;
  border-bottom: 1px solid var(--lab-tv-blatt-text);
  min-height: 1.6rem;
  margin-top: 0.4rem;
  text-align: center;
}

.lab_uh_uhr {
  width: 140px;
  height: 140px;
  color: var(--lab-tv-blatt-text);
}

/* ---------- Lösungsseite ---------- */

.lab_uh_loesung { break-before: page; }

.lab_uh_loesung .lab_uh_raster > li { margin-bottom: 0; }

.lab_uh_loesungsliste { font-size: 0.95rem; }

.lab_uh_loesungsblatt {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 1.2rem 0 0.4rem;
}

.lab_uh_loesungstext {
  font-weight: 700;
  font-size: 1.1rem;
  margin: 0.3rem 0 0;
}

.lab_uh_lesehilfe {
  font-size: 0.85rem;
  margin: 0.1rem 0 0;
}

.lab_uh_vorschau_aus { display: none; }

/* ---------- Blattfuss ---------- */

/* Fusszeile an die Unterkante des Papiers heften (nur Vorschau) -
   im Druck bleibt sie im Textfluss, volle Seiten laufen weiter. */

.lab_uh_seite,
.lab_uh_loesung { position: relative; }

.lab_uh_blattfuss {
  position: absolute;
  left: 1.9rem;
  right: 1.9rem;
  bottom: 1.7rem;

  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid var(--lab-tv-blatt-linie);
  margin-top: 1.8rem;
  padding-top: 0.45rem;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  color: var(--lab-tv-blatt-linie);
}

/* ---------- Klasse des alten Uhrzeit-Eingabebereichs: der
     Schalter ist im gemeinsamen Formular entfallen, die Klasse
     bleibt unveraendert im Stylesheet (Klassenbestand der
     Bereichsseiten). ---------- */

.lab_uh_schalter { margin: 0 0 0.8rem; }

/* =====================================================================
   6. Druck - EIN @page-Block und EIN @media print fuer alle
      vier Bereiche
   ===================================================================== */

/* Der Satzspiegel kommt allein aus der @page-Regel (14 mm oben und
   unten, 13 mm seitlich = 184 mm Satzspiegel auf A4). Die
   Plattform-Huelle legt keinen Zusatzrand darueber. Die Werte sind
   mit werkzeuge/matheblatt/blattexport.js (695 x 1017 px)
   abgestimmt. */

@page {
  size: A4;
  margin: 14mm 13mm;
}

@media print {
  /* Eingaben und Bedienleisten gehoeren nicht aufs Blatt. */

  .lab_kopf,
  .lab_mb_formular,
  .lab_mb_ki,
  .lab_mb_leiste,
  .lab_mb_tabs { display: none !important; }

  /* Die Kette wird zwingend auf die Papierbreite gestreckt - einzelne
     Druck-Engines behalten sonst Vorschau-Masse bei. */

  .lab_main,
  .lab_shell,
  .lab_mb_layout,
  .lab_mb_vorschau,
  .lab_mb_pult {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .lab_mb_layout { display: block; margin: 0; }

  .lab_mb_pult {
    border: 0;
    border-radius: 0;
    padding: 0;
    background: none;
    display: block;
  }

  /* Papier-Optik und feste Blatthoehe sind nur Vorschau: im Druck
     liefert die Seite die Raender, jede Blattseite bricht sauber.
     Die Breite steht in Millimetern (184 mm = A4 minus 2 x 13 mm),
     weil die Druckpipeline prozentuale/auto-Breiten im zentrierten
     Pult-Raster schrumpfen laesst - das Blatt bliebe schmal. */

  .lab_mb_blatt,
  .lab_rb_blatt,
  .lab_rb_seite,
  .lab_rb_loesung,
  .lab_sa_blatt,
  .lab_sa_seite,
  .lab_sa_loesung,
  .lab_gb_blatt,
  .lab_gb_seite,
  .lab_gb_loesung,
  .lab_uh_blatt,
  .lab_uh_seite,
  .lab_uh_loesung {
    width: 184mm !important;
    max-width: none !important;
  }

  .lab_rb_seite,
  .lab_rb_loesung,
  .lab_sa_seite,
  .lab_sa_loesung,
  .lab_gb_seite,
  .lab_gb_loesung,
  .lab_uh_seite,
  .lab_uh_loesung {
    background: none;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    margin: 0;
    min-height: 0;
    aspect-ratio: auto;
  }

  /* Fusszeile an die Unterkante heften war nur Vorschau. */

  .lab_gb_seite,
  .lab_gb_loesung,
  .lab_gb_blattfuss,
  .lab_uh_seite,
  .lab_uh_loesung,
  .lab_uh_blattfuss { position: static; }

  /* Seitenrahmen-Stil: den Doppelrahmen im Druck mitnehmen (die
     Basis-Regel darueber loescht alle Seiten-Rahmen); das innere
     Polster haelt den Inhalt vom Rahmen fern, die Mindesthoehe
     schliesst den Rahmen am unteren Satzend (2 mm Luft gegen
     Rundungs-Aufseiten). */

  .lab_rb_seite.lab_rb_rahmenseite,
  .lab_rb_loesung.lab_rb_rahmenseite,
  .lab_sa_seite.lab_sa_rahmenseite,
  .lab_sa_loesung.lab_sa_rahmenseite,
  .lab_gb_seite.lab_gb_rahmenseite,
  .lab_gb_loesung.lab_gb_rahmenseite,
  .lab_uh_seite.lab_uh_rahmenseite,
  .lab_uh_loesung.lab_uh_rahmenseite {
    border: 4px double var(--lab-tv-blatt-text);
    border-radius: 0;
    padding: 2mm 3mm;
    min-height: 262mm;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  /* Leere Blatt-Platzhalter und die Loesungsseiten gehoeren nicht
     auf das Blatt - die Loesungsseite nur auf Wunsch. */

  .lab_rb_blatt_leer,
  .lab_sa_blatt_leer,
  .lab_gb_blatt_leer,
  .lab_uh_blatt_leer { display: none; }

  .lab_rb_loesung,
  .lab_sa_loesung,
  .lab_gb_loesung,
  .lab_uh_loesung { display: none; }

  .lab_rb_mit_loesung .lab_rb_loesung,
  .lab_sa_mit_loesung .lab_sa_loesung,
  .lab_gb_mit_loesung .lab_gb_loesung,
  .lab_uh_mit_loesung .lab_uh_loesung {
    display: block;
    break-before: page;
  }
}

/* Blatt-Hilfe: mit dem App-CSS auch in HTML/PDF verfügbar. */
.lab_bh_gruppe { min-width: 0; margin: 0 0 1rem; padding: .8rem; border: 1px solid var(--lab-border-color); border-radius: .6rem; }
.lab_bh_gruppe select, .lab_bh_gruppe textarea { width: 100%; min-width: 0; max-width: 100%; }
.lab_bh_gruppe label { display: block; margin-top: .5rem; }
.lab_bh_hinweis { font-size: .8rem; color: var(--grey600-color); margin: .5rem 0; }
.lab_bh_eigene { margin-top: .7rem; }
.lab_bh_zeile { font-size: .85em; line-height: 1.5; margin: .25em 0 .65em; color: var(--lab-tv-blatt-text); font-style: normal; font-weight: normal; white-space: pre-wrap; overflow-wrap: anywhere; unicode-bidi: isolate; }
.lab_bh_zeile[dir="rtl"] { text-align: right; }
.lab_bh_zeile[hidden], .lab_bh_eigene[hidden] { display: none; }
@media print { .lab_bh_gruppe { display: none; } }
/* Lange Fachnamen und Papier-Ränder dürfen die mobile Blattansicht
   nicht über den Bildschirm schieben. Druckmaße bleiben unberührt. */
.lab_gs_fachklasse { white-space: normal; overflow-wrap: anywhere; }
.lab_gs_titel_zeile { flex-wrap: wrap; }
.lab_tb_gruppe, .lab_tb_karte { min-width: 0; }
.lab_tb_formular select, .lab_tb_formular input, .lab_tb_formular textarea { max-width: 100%; }
.lab_gs_kopfbox, .lab_geo_kopfbox { background: var(--lab-tv-blatt-flaeche); }
@media screen and (max-width: 40rem) {
  .lab_gs_seite, .lab_geo_seite { padding: 1rem; }
  .lab_gs_namedatum { gap: .5rem; flex-wrap: wrap; }
  .lab_rb_seite, .lab_sa_seite, .lab_gb_seite, .lab_uh_seite,
  .lab_db_seite, .lab_en_seite, .lab_tb_seite, .lab_ra_seite {
    aspect-ratio: auto; height: auto; display: flow-root;
  }
  .lab_rb_aufgaben, .lab_sa_aufgaben, .lab_db_aufgaben, .lab_en_aufgaben { column-count: 1 !important; }
  .lab_rb_blattfuss, .lab_sa_blattfuss, .lab_gb_blattfuss, .lab_uh_blattfuss,
  .lab_db_blattfuss, .lab_en_blattfuss, .lab_tb_blattfuss, .lab_ra_blattfuss { position: static; }
}
