/* Ergänzungen der Akademie (M0a, v0.2.0 Cockpit und Kurse). Alle Farben kommen als Token aus style.css (Regel D2); keine eigenen Farbwerte. */
.warnband{background:var(--rot-hell);color:var(--rot);border-bottom:1px solid var(--rot);padding:9px 22px;font-weight:600;font-size:13px}
.stand{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.tab td .titelzelle{font-weight:700;color:var(--stark)}
.tab td .sub{display:block;font-size:12px;color:var(--leise);font-weight:400}
.warum{margin-top:4px}
.warum summary{cursor:pointer;color:var(--blau);font-size:12px;font-weight:600}
.warum p{margin:4px 0 0;font-size:12.5px;color:var(--leise);max-width:62ch;line-height:1.45}
.rechts video{flex:1;width:100%;min-height:0;background:var(--stark);object-fit:contain}
.hilfe-ansicht{flex:1;overflow:auto;padding:16px 20px;background:var(--grund);font-size:13.5px}
.hilfe-ansicht h3{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--blau);margin:14px 0 6px}
.hilfe-ansicht details{border:1px solid var(--linie);border-radius:var(--r-klein);padding:8px 12px;margin:6px 0;background:var(--blatt)}
.hilfe-ansicht summary{cursor:pointer;font-weight:700}
.suche{margin:0 0 6px}
.filterhinweis{font-size:12px;color:var(--leise);margin:6px 0 0;line-height:1.4}
.checkzeile{display:flex;gap:8px;align-items:center;margin:10px 0 0;font-size:13px}
.zweispaltig{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.zweispaltig .voll{grid-column:1/-1}
.liveliste{list-style:none;margin:0;padding:0}
.liveliste li{display:flex;gap:10px;align-items:center;padding:5px 0;border-bottom:1px dotted var(--linie2);font-size:13px}
.liveliste li b{min-width:160px}
.hash{font-family:Consolas,"Courier New",monospace;font-size:12px;color:var(--leise)}
.vorher-nachher{max-width:46ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--leise)}
@media (max-width:1100px){.liste{grid-template-columns:1fr}.filter{position:static;max-height:none;border-right:0;border-bottom:1px solid var(--linie)}.vorgang{grid-template-columns:1fr;height:auto}.rechts{min-height:70vh}.zweispaltig{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- v0.2.0 Cockpit und Kurse */
@property --p{syntax:'<number>';inherits:false;initial-value:0}
.cp{max-width:1280px;margin:0 auto;padding:22px 24px 48px}
.cp h1{font-size:26px;font-weight:800;color:var(--stark);margin:0 0 6px;letter-spacing:-.01em;line-height:1.2}
.seitentitel{margin-bottom:14px !important}
.abschnitt{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--blau);margin:34px 0 14px;display:flex;align-items:center;gap:10px}
.abschnitt::after{content:"";flex:1;height:1px;background:var(--linie2)}
.lead{font-size:16px;color:var(--leise);margin:0 0 14px;max-width:60ch}
.sub{display:block;font-size:12.5px;color:var(--leise);font-weight:400;margin:0}

/* Icons (nur aus static/icons): immer nur die Höhe festlegen */
.ico{width:auto;flex:none;display:inline-block;vertical-align:middle}
.ico.klein{height:18px;margin-right:6px}
.ico.mittel{height:36px}
.ico.gross{height:54px}
.ico.riesig{height:84px}
.siegel{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;border:2px solid #E0A800;border-radius:50%;background:var(--hell);padding:7px;flex:none}
.siegel .ico{height:30px}

/* Tropfi (Guide-Figur) */
.tropfi{display:flex;align-items:center;gap:14px}
.tropfi-bild{height:84px;width:auto;flex:none}
.tropfi.gross .tropfi-bild{height:150px}
.sprech{position:relative;margin:0;background:var(--hell);color:var(--dunkelblau);font-weight:700;padding:11px 16px;border-radius:var(--r);line-height:1.35;max-width:30ch}
.tropfi:not(.ohne) .sprech::before{content:"";position:absolute;left:-9px;top:50%;margin-top:-9px;border:9px solid transparent;border-left:0;border-right-color:var(--hell)}
.tropfi.gross .sprech{font-size:17px}
.tropfi.ohne .sprech{max-width:none}

/* Cockpit-Kopf */
.cp-kopf{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);padding:22px 28px;border-top:4px solid var(--blau)}
.cp-kopf .tropfi{flex-direction:row}
.cp-kopf-rechts .kasten{margin:12px 0 0;max-width:70ch}
.namensfeld{display:block;font-size:12px;font-weight:700;color:var(--leise);margin:0}
.namensfeld input{display:block;margin-top:4px;width:min(100%,340px);padding:8px 12px;border:1.5px solid var(--linie2);border-radius:var(--r-klein);background:var(--blatt);font-weight:600}
.cp-stand-zeile{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.cp-stand-zeile .kennzahlen{margin:0}

/* Fortschrittsring und -balken (animiert beim Laden) */
.ring{--p:0;width:116px;height:116px;border-radius:50%;background:conic-gradient(var(--blau) calc(var(--p) * 1%),var(--linie2) 0);display:grid;place-items:center;position:relative;transition:--p 1.1s ease-out;flex:none}
.ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--blatt)}
.ring span{position:relative;font-size:24px;font-weight:800;color:var(--dunkelblau)}
.ring.fertig{background:conic-gradient(var(--gruen) calc(var(--p) * 1%),var(--linie2) 0)}
.balken{height:12px;border-radius:999px;background:var(--linie);overflow:hidden;margin:12px 0 6px}
.balken span{display:block;height:100%;border-radius:999px;background:var(--blau);transition:width 1s ease-out}
.balken span.fertig{background:var(--gruen)}

/* Kachelraster: 1 Spalte, ab 700 px 2, ab 1100 px 3 */
.raster{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width:700px){.raster{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.raster{grid-template-columns:repeat(3,1fr)}}
.kachel{background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);border-top:4px solid var(--blau);padding:20px 22px;display:flex;flex-direction:column;gap:8px;min-width:0;transition:transform .15s,box-shadow .15s}
.kachel:hover{transform:translateY(-2px)}
.kachel h3{margin:0;font-size:17px;font-weight:800;color:var(--stark);line-height:1.25}
.kachel-kopf{display:flex;align-items:center;gap:14px}
.kachel-kopf > div{min-width:0}
.kachel p{margin:0}
.kachel .fz{font-size:15px;color:var(--text)}
.kachel .fz b{font-size:19px;color:var(--stark)}
.mt{font-size:13.5px;color:var(--dunkelblau);font-weight:600}
.zaehler{font-size:13px;color:var(--leise)}
.status{font-size:12.5px;color:var(--leise);display:flex;flex-direction:column;gap:3px}
.aktionen{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:10px;align-items:center}
.aktionen .k{text-decoration:none}
.k.gross{font-size:16px;padding:12px 22px;min-height:48px;border-radius:var(--r)}
.kachel.kurs.fertig{border-top-color:var(--gruen);outline:2px solid var(--gruen);outline-offset:-2px}
.kachel.geplant{border-top-color:var(--grau);background:var(--zebra)}
.kachel.geplant h3,.kachel.geplant .sub,.kachel.geplant .mt{color:var(--leise)}
.kachel.geplant .ico{opacity:.45}
.kachel.leer-kurs{border-top-color:var(--grau)}
.kachel.material.klein{padding:14px 16px}
.kachel.material.klein h3{font-size:15px}
.kachel.zuletzt{flex-direction:row;align-items:center;gap:14px;text-decoration:none;color:var(--text)}
.kachel.zuletzt b{display:block;color:var(--stark)}
.kachel.breit{max-width:640px}
.gruppe{margin:0 0 22px}
.gruppentitel{font-size:15px;font-weight:800;margin:0 0 10px;color:var(--dunkelblau)}
.leer.kompakt{padding:22px}

/* Kurse: Filter-Chips */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.chips button{border:1.5px solid var(--linie2);background:var(--blatt);border-radius:999px;padding:7px 14px;font-weight:700;color:var(--leise);cursor:pointer}
.chips button span{margin-left:4px;font-weight:600}
.chips button[aria-pressed=true]{border-color:var(--blau);background:var(--hell);color:var(--blau)}

/* Kursseite */
.kurskopf{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);padding:22px 28px;border-top:4px solid var(--blau);margin-top:10px}
.kurskopf.fertig{border-top-color:var(--gruen)}
.kurskopf-links{display:flex;gap:20px;align-items:center;min-width:0}
.kurskopf-links > div{min-width:0;flex:1}
.kurskopf .fz{margin:8px 0 0;font-size:15px}
.kurskopf .balken{max-width:520px}
.materialzeile{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:16px 0 0;font-size:13px;color:var(--leise);font-weight:600}
.chip-link{display:inline-flex;align-items:center;gap:4px;border:1.5px solid var(--linie2);background:var(--blatt);border-radius:999px;padding:5px 12px;text-decoration:none;font-weight:700;color:var(--blau)}
.chip-link:hover{background:var(--hell)}
.lektionen{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.lektion a{display:grid;grid-template-columns:34px 26px 1fr auto auto;gap:12px;align-items:center;background:var(--blatt);border-radius:var(--r-klein);border-left:5px solid var(--linie2);padding:11px 16px;text-decoration:none;color:var(--text);box-shadow:var(--schatten);transition:transform .12s}
.lektion a:hover{transform:translateX(3px)}
.lektion.erledigt a{border-left-color:var(--gruen)}
.lektion.naechste a{border-left-color:var(--blau);background:var(--hell)}
.lektion .nr{font-weight:800;color:var(--leise);text-align:right}
.lektion .lt b{display:block;color:var(--stark)}
.lektion .zustand{font-size:12.5px;font-weight:700;color:var(--leise);min-width:74px;text-align:right}
.lektion.erledigt .zustand{color:var(--gruen)}
.haken{width:22px;height:22px;border-radius:50%;border:2px solid var(--grau);background:var(--blatt);display:inline-block}
.haken.an{background:var(--gruen);border-color:var(--gruen)}
.lhinweis{display:inline-flex;align-items:center;font-size:12.5px;font-weight:700}
.lhinweis.rot{color:var(--rot)}
.lhinweis.gelb{color:var(--leise)}
p.lhinweis.gelb{margin:0 0 8px}

/* Lektion */
.lektion-ansicht .links{padding:16px 22px 60px}
.krume{font-size:12.5px;font-weight:700;color:var(--leise);margin:10px 0 0}
.lektion-ansicht .titel h1{font-size:24px}
.lektion-ansicht .tropfi{margin:12px 0}
.schritte{margin:0 0 14px;padding:0 0 0 22px;color:var(--leise);font-weight:600;display:flex;flex-direction:column;gap:4px}
.schritte li.jetzt{color:var(--dunkelblau);font-weight:800}
.schritte li.da{color:var(--gruen)}
.abschluss{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:0 0 16px}
.abschluss .k{text-decoration:none}
.dazu{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.dazu li{display:flex;align-items:center}
.lek-nav{display:flex;justify-content:space-between;gap:12px;font-size:13px;font-weight:600}
.rechts iframe[hidden],.rechts video[hidden]{display:none}
.rechts #l_reiter{display:block}
.rechts video{min-height:280px}
.modul-prog{margin:8px 0;border:1px solid var(--linie);border-radius:var(--r-klein);padding:8px 12px;background:var(--blatt)}
.modul-prog summary{cursor:pointer}
@media (max-width:1100px){.cp-kopf{grid-template-columns:1fr}.kurskopf{grid-template-columns:1fr}.lektion-ansicht .rechts{min-height:70vh}}
@media (max-width:700px){.cp{padding:16px}.lektion a{grid-template-columns:28px 22px 1fr;row-gap:4px}.lektion .kenn,.lektion .zustand{grid-column:3;text-align:left}.tropfi.gross .tropfi-bild{height:100px}.kurskopf-links{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.ring,.balken span,.kachel,.lektion a{transition:none}}

/* ---------------------------------------------------------------- v0.3.0 M0b: Anmeldung, Board, Datenschutz (nur Tokens aus style.css, Regel D2) */
.wer-name{font-weight:700;color:#fff;max-width:160px;overflow:hidden;text-overflow:ellipsis}
.wer-knopf{background:var(--blatt);color:var(--blau);border:0;border-radius:999px;padding:7px 14px;font-weight:700;cursor:pointer;text-decoration:none;font-size:13px;line-height:1.2}
.wer-knopf:hover{background:var(--hell)}
.fuss-link{color:#fff}
.fehlertext{color:var(--rot);font-weight:700;margin:8px 0 0;min-height:1.4em}

.anmeldung{max-width:460px;margin:40px auto;padding:28px 30px;background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);border-top:4px solid var(--blau)}
.anmeldung h1{margin:0 0 6px;font-size:26px;font-weight:800;color:var(--stark)}
.anmeldung form{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.anmeldung label,.neu-beitrag label,.fragefeld{display:block;font-size:12.5px;font-weight:700;color:var(--leise)}
.anmeldung select,.anmeldung input,.neu-beitrag select,.neu-beitrag input,.neu-beitrag textarea,.fragefeld textarea,.antwort-form textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;border:1.5px solid var(--linie2);border-radius:var(--r-klein);background:var(--blatt);font-weight:600;color:var(--text)}
.anmeldung input[type=password]{font-size:22px;letter-spacing:.35em;max-width:9em}
.fragefeld{margin:0 0 6px;max-width:60ch}

.text-seite{max-width:860px}
.text-seite h2{font-size:17px;font-weight:800;color:var(--dunkelblau);margin:26px 0 8px}
.text-seite ul{margin:0 0 8px;padding-left:22px}
.text-seite li{margin:4px 0;line-height:1.5}
.text-seite p{line-height:1.55}
.zusage{font-size:15px;background:var(--gruen-hell);border-left-color:var(--gruen)}
.kenntnis{margin:28px 0;padding:18px 22px;background:var(--hell);border-radius:var(--r);border-top:4px solid var(--blau)}
.kenntnis[hidden]{display:none}

.board .chips{margin-bottom:14px}
.neu-beitrag{margin:0 0 20px;background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);padding:14px 18px}
.neu-beitrag summary{cursor:pointer;display:inline-flex}
.neu-beitrag form{display:flex;flex-direction:column;gap:12px;margin-top:14px;max-width:70ch}
.beitrag{background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);border-left:5px solid var(--blau);padding:16px 20px;margin:0 0 14px}
.beitrag-kopf{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.beitrag-kopf h3{margin:0;font-size:17px;font-weight:800;color:var(--stark);flex:1;min-width:12ch;overflow-wrap:anywhere}
.beitrag .ampel-zeile{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--leise)}
.beitrag .meta{margin:6px 0 0;font-size:12.5px;color:var(--leise)}
.beitrag .meta .bezug{margin-left:10px;font-weight:700;color:var(--blau)}
.beitrag .text{margin:8px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text)}
.antworten{margin:12px 0 0;display:flex;flex-direction:column;gap:8px}
.antwort{background:var(--zebra);border-left:3px solid var(--linie2);border-radius:var(--r-klein);padding:8px 12px}
.antwort.betreuung{border-left-color:var(--gruen);background:var(--gruen-hell)}
.beitrag-aktionen{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0}
.antwort-form{display:flex;gap:10px;align-items:flex-end;margin:12px 0 0}
.antwort-form label{flex:1;font-size:12px;font-weight:700;color:var(--leise)}
.pin-form{display:flex;gap:6px;align-items:center}
.pin-form input{width:6em;padding:5px 8px;border:1.5px solid var(--linie2);border-radius:var(--r-klein);letter-spacing:.3em}
@media (max-width:700px){.anmeldung{margin:16px;padding:20px}.antwort-form{flex-direction:column;align-items:stretch}}

/* Gesundheit und Wartung (v0.3.1): nur Tokens aus style.css */
.gesund-kopf{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 4px}
.gesund-kopf h1{font-size:22px;margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.gesund code{background:var(--hell);padding:1px 6px;border-radius:4px;font-size:12.5px;word-break:break-all}
.gesund .tab td .sub{display:block;font-size:11.5px;color:var(--leise)}
.gesund .tab td.wert{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.gesund .daten.breit{grid-template-columns:130px 1fr}
.gesund .rotliste{margin:0 0 8px;padding-left:20px;line-height:1.6}
.tabwrap{overflow-x:auto}
.tabwrap .tab th{position:static}          /* Kopfzeile klebt nur im Seitenfluss, nicht im waagerecht scrollenden Behälter */
.tabwrap .tab{border-collapse:collapse;width:100%}
.wartung-knoepfe{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.gkachel{display:flex;gap:14px;align-items:center;background:var(--blatt);border-radius:var(--r);box-shadow:var(--schatten);border-top:4px solid var(--grau);padding:16px 20px;text-decoration:none;color:var(--text);min-width:0;transition:transform .15s}
.gkachel:hover{transform:translateY(-2px)}
.gkachel.gruen{border-top-color:var(--gruen)}.gkachel.gelb{border-top-color:var(--gelb)}.gkachel.rot{border-top-color:var(--rot)}
.gkachel b{color:var(--stark);font-size:16px;margin-left:4px}
.gkachel .sub{display:block;font-size:13px;color:var(--leise);margin-top:4px}
.kasten.rot .ico{vertical-align:middle;margin-right:10px}
@media (prefers-reduced-motion:reduce){.gkachel{transition:none}}

/* ---------------------------------------------------------------- v0.5.0 Firmennetz und Tablet (nur CSS, kein Umbau; nur Tokens aus style.css, Regel D2) */
.menuknopf{display:none}
@media (max-width:900px){
  /* Kopfzeile: Hauptmenü hinter dem Knopf „Menü“ (aufklappbar), Marke darf umbrechen */
  .kopf{gap:8px;padding:0 10px 0 14px}
  .kopf .globus,.kopf .logo{display:none}
  .marke{white-space:normal;flex:1;min-width:0}
  .marke b{font-size:14px;letter-spacing:.03em;line-height:1.15}
  .menuknopf{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 14px;border:1.5px solid #fff;background:transparent;color:#fff;border-radius:var(--r-klein);font-weight:700;cursor:pointer;flex:none}
  .menuknopf:hover,.kopf.menue-offen .menuknopf{background:#fff;color:var(--blau)}
  .kopf nav{display:none;position:fixed;top:var(--kopf);left:0;right:0;margin:0;flex-direction:column;gap:4px;background:var(--dunkelblau);padding:8px 12px 14px;max-height:calc(100vh - var(--kopf));overflow-y:auto;z-index:6;box-shadow:var(--schatten)}
  .kopf.menue-offen nav{display:flex}
  .kopf nav a{display:flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:var(--r-klein);font-size:15px;opacity:1}
  .kopf nav a[hidden]{display:none}
  .wer{font-size:12.5px}
  .wer-name{display:none}
}
/* Touch-Ziele mindestens 44 px (bis 900 px Breite und auf Geräten mit Fingerbedienung) */
@media (max-width:900px),(pointer:coarse){
  .k,.k.gross,.wer-knopf,.kopf .hilfe-k,.chips button,.reiter button,.reiterk button,.chip-link,.zurueck,.fuss-link{min-height:44px}
  .k{padding-left:16px;padding-right:16px}
  .wer-knopf,.kopf .hilfe-k{display:inline-flex;align-items:center;justify-content:center;min-width:44px}
  .chips button,.chip-link{display:inline-flex;align-items:center}
  .reiter a{display:inline-flex;align-items:center;min-height:44px}
  .zurueck,.lek-nav a,.fuss-link{display:inline-flex;align-items:center;min-height:44px}
  .kopf nav a{min-height:44px;display:inline-flex;align-items:center}
  .kopf nav a[hidden]{display:none}
  .warum summary,.modul-prog summary,.neu-beitrag summary{min-height:44px;display:flex;align-items:center}
  .checkzeile{min-height:44px}
  .checkzeile input,.tab td.fr input{width:24px;height:24px}
  select,input:not([type=checkbox]):not([type=radio]),.anmeldung select,.anmeldung input{min-height:44px}
  .kachel,.lektion a,.gkachel,.kachel.zuletzt{min-height:56px}
  .tab tbody tr{min-height:44px}
  .tab td{padding-top:12px;padding-bottom:12px}
}
@media (max-width:700px){
  /* Lektion und Einführung am Handy: Video oben, Text darunter */
  .vorgang{grid-template-columns:minmax(0,1fr)}
  .lektion-ansicht .rechts{order:-1;height:auto;min-height:0;border-left:0;border-bottom:1px solid var(--linie2)}
  .lektion-ansicht .links{padding:14px 14px 48px}
  .rechts video{flex:none;width:100%;height:auto;aspect-ratio:16/9;min-height:0}
  .lektion-ansicht .rechts iframe{flex:none;height:75vh}
  /* Kurzanleitung, Handbuch und PDF in der Bibliothek: volle Breite, Anzeige unter den Angaben */
  .vorgang:not(.lektion-ansicht) .rechts{height:auto;min-height:75vh;border-left:0;border-top:1px solid var(--linie2)}
  .vorgang:not(.lektion-ansicht) .rechts iframe{flex:1;min-height:75vh;width:100%}
  .links{padding:14px 14px 40px}
  .cp-kopf{padding:16px}
  .abschluss .k,.aktionen .k{flex:1 1 auto}
}

/* v0.6.0 PWA und Offline: Band, Neue-Fassung-Band, Block "Auf diesem Gerät" */
.offlineband{position:sticky;top:var(--kopf);z-index:4;background:var(--gelb-hell);color:var(--stark);border-bottom:1px solid var(--gelb);border-left:4px solid var(--gelb);padding:9px 22px;font-weight:600;font-size:13px}
.offlineband[hidden],.neuband[hidden]{display:none}
.neuband{background:var(--hell);color:var(--stark);border-bottom:1px solid var(--blau);border-left:4px solid var(--blau);padding:7px 22px;font-weight:600;font-size:13px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pwa-block{margin-top:6px}
.pwa-block .abschnitt{margin-top:26px}
.pwa-block .k{margin-left:6px}
.offline-kurs{margin:12px 0 4px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.offline-kurs .filterhinweis{flex-basis:100%;margin-top:2px}
@media (max-width:900px){.offlineband,.neuband{padding:9px 16px}}

/* v1.1.0 Leseansicht: Handbuch-Abschnitte und Kurzanleitungen als Bildschirmseite im Rahmen, darunter Druckfassung, PDF und Schriftgröße */
.rechts iframe.lese-rahmen{background:var(--blatt);min-height:70vh}
.lese-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;background:var(--blatt);border-top:1px solid var(--linie);padding:8px 14px;font-size:13px;font-weight:600}
.lese-zeile[hidden]{display:none}
.groesse-knoepfe{display:inline-flex;gap:4px;margin-left:auto}
.groesse-knoepfe button{min-width:36px;padding:3px 10px;border:1px solid var(--blau);border-radius:6px;background:var(--blatt);color:var(--blau);font-weight:700;cursor:pointer}
.groesse-knoepfe button[aria-pressed=true]{background:var(--blau);color:var(--blatt)}
@media (max-width:700px){.lese-zeile{padding:8px 14px}.groesse-knoepfe button{min-height:44px;min-width:44px}.lektion-ansicht .rechts iframe.lese-rahmen{min-height:75vh}}

/* v1.2.0 Mein Lernpfad und Fragen: Lernpfad-Karte im Cockpit, Marken im Kurs, Fragenblock in Lektion und Kurs (nur Tokens aus style.css) */
.lernpfad{margin:18px 0}
.lernpfad .tropfi{margin:0 0 10px}
.lp-kurs h3{margin-top:0}
.lp-kurs .fz{margin:2px 0 0}
.lp-kurs .lektionen{margin:12px 0 0}
.lp-kurs .kenn{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.lp-mehr{margin-top:12px}
.lp-mehr summary{cursor:pointer;font-weight:700;color:var(--blau);padding:6px 0;min-height:32px}
.lp-mehr .lektionen{margin-top:8px}
.fragen-block h2{margin:0 0 12px;font-size:18px;text-transform:none;letter-spacing:0;color:var(--stark)}
.fq{border:1px solid var(--linie2);border-left:5px solid var(--linie2);border-radius:var(--r-klein);padding:12px 16px 14px;margin:0 0 12px;background:var(--blatt)}
.fq.richtig{border-left-color:var(--gruen)}
.fq.falsch{border-left-color:var(--rot)}
.fq legend{font-weight:700;color:var(--stark);padding:0 6px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.fq .fnr{display:inline-block;min-width:22px;color:var(--blau);font-weight:800}
.fq .fq-antworten{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.fq .frage-antwort{justify-content:flex-start;text-align:left;font-weight:600;min-height:44px;padding:9px 14px}
.fq .frage-antwort:disabled{opacity:1;cursor:default}
.fq .frage-antwort:disabled:not(.gruenk):not(.warn){color:var(--leise);border-color:var(--linie2)}
.frage-ergebnis{margin:8px 0;line-height:1.5}
.frage-fertig{margin-top:12px}
.lektion .lp-zeile{display:grid;grid-template-columns:34px 26px 1fr auto auto;gap:12px;align-items:center;background:var(--blatt);border-radius:var(--r-klein);border-left:5px solid var(--linie2);padding:11px 16px;color:var(--leise);box-shadow:var(--schatten)}
.fq-fertig:focus,.frage-fertig:focus,.frage-ergebnis:focus{outline:3px solid var(--blau);outline-offset:2px}