/* AgentOS · Ruhig und klar (Paket 1 aus Plan V3, 09.10.2026)
   Letzte Stilschicht für Portal und öffentliche Seiten. Davids Ziel (08.10. 23:55): „hochprofessionell … wie Flux …
   ganz feines und ganz einfach übersichtliches UI“, verständlich ab zehn Jahren, ruhig, aber nicht kühl.
   Regeln: fluxward-design-master und fluxward-app-standards (Profil AgentOS: Karten 12 px, Knöpfe 10 px; E1–E6).
   Eine Akzentfarbe (Markenblau der Basis), Linien statt Schatten, keine Verläufe, keine Hebe-Effekte, Farbe nur für Zustände.
   Rückweg: Datei aus dem Seitenkopf nehmen; alle älteren Schichten bleiben unverändert. */

:root{
  --pr-r-karte:12px;--pr-r-knopf:10px;--pr-r-klein:8px;
  --pr-linie:var(--fw-line);--pr-linie-stark:var(--fw-line-strong);
  --pr-schatten:0 1px 2px rgba(15,23,42,.04);
  --pr-schatten-schwebt:0 12px 32px -12px rgba(15,23,42,.22);
  --pr-weich:220ms cubic-bezier(.2,.8,.2,1);
  /* Bühnen-Schicht beruhigen: keine Verläufe, kein Gitter, kaum Hebung */
  --ao-grund:var(--fw-bg);
  --ao-hebung-1:var(--pr-schatten);
  --ao-hebung-2:var(--pr-schatten);
  --ao-hebung-blau:none;
  --ao-netz:none;
  --ao-nacht:var(--fw-surface);
  --ao-hell-auf-nacht:var(--fw-text-2);
}
/* Dunkel: neutraler, weniger blaustichig, gleiche Ordnung wie hell */
:root[data-theme="dunkel"]{
  --fw-bg:#13171E;--fw-bg-deep:#0F1218;--fw-surface:#1A1F28;--fw-surface-soft:#1F2530;
  --fw-line:#2A313D;--fw-line-strong:#3A4352;--fw-blue-soft:#1C2A45;
  --pr-schatten:none;--pr-schatten-schwebt:0 16px 40px -12px rgba(0,0,0,.6);
  --ao-grund:var(--fw-bg);--ao-kante:var(--fw-line);
}

/* ---------- Weicher Wechsel zwischen Hell und Dunkel (einfach.js setzt .thema-wechsel kurz) ---------- */
@media (prefers-reduced-motion:no-preference){
  html.thema-wechsel,html.thema-wechsel *,html.thema-wechsel *::before,html.thema-wechsel *::after{
    transition:background-color 320ms ease,color 320ms ease,border-color 320ms ease,fill 320ms ease,stroke 320ms ease!important}
}

/* ---------- Grund und Schrift ---------- */
body.studio,body.w-seite{background:var(--fw-bg)}
.studio h1{letter-spacing:-.02em}

/* ---------- Seitenleiste und Kopf: still, eine klare Aktiv-Marke ---------- */
.seitenleiste{background:var(--fw-surface);box-shadow:none;border-right:1px solid var(--pr-linie)}
.nav a{border-radius:var(--pr-r-klein)}
.nav a:hover{background:var(--fw-bg)}
.nav a:hover .ico{transform:none}
.seitenleiste .nav a[aria-current="page"]{background:var(--fw-blue-soft);color:var(--fw-blue-ink);font-weight:700}
.seitenleiste .nav a[aria-current="page"] .ico{color:var(--fw-blue-ink)}
.seiten-fortschritt{background:var(--fw-bg);border:1px solid var(--pr-linie);border-radius:var(--pr-r-karte)}
.seiten-fortschritt:hover{transform:none;background:var(--fw-bg);border-color:var(--pr-linie-stark)}
.kopfleiste{background:var(--fw-bg)}
.suche-knopf,.kopf-aktionen .knopf.rahmen.frag-navi{box-shadow:none;border:1px solid var(--pr-linie);border-radius:var(--pr-r-knopf);background:var(--fw-surface)}
.suche-knopf:hover,.kopf-aktionen .knopf.rahmen.frag-navi:hover{box-shadow:none;border-color:var(--pr-linie-stark)}

/* ---------- Knöpfe: ein Hauptknopf, alles andere leise; keine Sprünge ---------- */
.knopf{border-radius:var(--pr-r-knopf)}
.knopf.haupt:hover,.knopf.rahmen:hover{transform:none;box-shadow:none}
.knopf:active{transform:none}
.knopf:hover>.ico:last-child:not(:first-child){transform:translateX(2px)}

/* ---------- Flächen: Linie statt Schatten, 12 px ---------- */
.studio :is(.karte,.lz-karte,.reise-zeile,.navi-blase,.info-karte,.start-karte,.danach-karte,.akkordeon,.os-schritt,.medium,
  .angaben-karte,.profi-bereich,.profi-wege,.reise-zu,.konfig-schritt,.etappe-check,.naechste-etappe,.lektion-raster .naechste,
  .kt-liste,.kl-teile,.lektion-leiste,.agent-erklaer,.quiz,details.hakt,details.praxis-aufgabe,.frage-feld,.regeln-kasten,
  .text-zum-film,.mensch-hilfe,.handbuch,.beitraege,.ad-kachel,.ad-karte){
  border:1px solid var(--pr-linie);box-shadow:none;border-radius:var(--pr-r-karte)}
.studio :is(a.start-karte,a.danach-karte,a.medium,a.karte.klick,a.etappe-check,a.naechste-etappe,a.angaben-karte,.lektion-raster a.naechste,.reise-zeile,.lz-karte){
  transition:border-color var(--pr-weich),background-color var(--pr-weich)}
.studio :is(a.start-karte,a.danach-karte,a.medium,a.karte.klick,a.etappe-check,a.naechste-etappe,a.angaben-karte,.lektion-raster a.naechste,.reise-zeile,.lz-karte):hover{
  transform:none;box-shadow:none;border-color:var(--pr-linie-stark)}
.start-karte:hover img,:is(.reise-zeile,.lz-karte,.lektion-zeile,.modul):hover .vorschau.lt-kachel{transform:none}

/* ---------- Start: „Weiter lernen“ als ruhige Karte statt Farbbühne ---------- */
.studio .start-weiter{background:var(--fw-surface);color:var(--fw-text);border:1px solid var(--pr-linie);border-radius:var(--pr-r-karte);
  box-shadow:none;padding:28px 32px;gap:32px}
.studio .start-weiter .vorschau{display:none}  /* Bild wiederholte nur den Titel */
.studio .start-weiter .sw-text>p:first-child{color:var(--fw-text-2);font-weight:600}
.studio .start-weiter .sw-text h1{color:var(--fw-ink);font-size:clamp(28px,3vw,38px)}
.studio .start-weiter .sw-text p{color:var(--fw-text)}
.studio .start-weiter .knopf.haupt{background:var(--fw-blue);color:#fff}
.studio .start-weiter .knopf.haupt:hover{background:var(--fw-blue-hover,#0F55DD)}
.studio .start-weiter .knopf.rahmen{color:var(--fw-ink);border-color:var(--pr-linie-stark)}
.studio .start-weiter .knopf.rahmen:hover{background:var(--fw-bg)}
.studio .start-weiter .ns-stand{color:var(--fw-text-2)}
.studio .start-weiter .ns-balken{background:var(--fw-bg-deep)}
.studio .start-weiter .ns-balken>span{background:var(--fw-blue)}
.studio .start-weiter.fertig{background:var(--fw-surface)}
.studio .start-weiter.fertig .ec-symbol{color:var(--fw-success)}
.balken>span::after,.ns-balken>span::after{display:none}

/* Kopf der Lernreise und der Etappen: gleiche ruhige Karte */
.studio .kurs-kopf,[data-theme="dunkel"] .kurs-kopf{background:var(--fw-surface);color:var(--fw-text);border:1px solid var(--pr-linie);border-radius:var(--pr-r-karte);box-shadow:none}
.studio .kurs-kopf :is(h1,.kk-text h1){color:var(--fw-ink)}
.studio .kurs-kopf :is(p,.kk-unter,.kk-text p){color:var(--fw-text-2)}
.studio .kurs-kopf a{color:var(--fw-blue-ink)}
.studio .kurs-kopf .ring .wert{stroke:var(--fw-blue)}
.studio .kurs-kopf .vorschau{box-shadow:none}
.studio .kurs-kopf .rz-symbol.gross{background:var(--fw-blue-soft)!important;box-shadow:none;border-radius:var(--pr-r-karte);color:var(--fw-blue-ink)}
.studio .kurs-kopf .ring .spur,.kurs-kopf .ring .spur{stroke:var(--fw-bg-deep)}
.studio .kurs-kopf .ring .mitte,.kurs-kopf .ring .mitte{color:var(--fw-ink)}
.studio .kurs-reiter{border-radius:var(--pr-r-knopf);box-shadow:inset 0 0 0 1px var(--pr-linie)}
.studio .kurs-reiter a{border-radius:var(--pr-r-klein)}
.studio .kurs-reiter a[aria-current="page"]{box-shadow:0 0 0 1px var(--pr-linie)}

/* Lernreise als Liste: der aktuelle Schritt mit klarer Linie statt Leuchtring */
.studio .reise-zeilen::before{display:none}
.studio .reise-zeile.jetzt,.studio .lz-karte.jetzt{border-color:var(--fw-blue);box-shadow:none}
.studio .reise-zeile.fertig{opacity:1}
.studio .reise-zeile.jetzt .rz-nr::after,.studio .lz-karte.jetzt .rz-nr::after{display:none}

/* ---------- Probezeit: schmaler Hinweis, kein zweiter Hauptknopf (E1) ---------- */
.probe-band{background:var(--fw-surface);border:1px solid var(--pr-linie);border-left:3px solid var(--fw-warning);border-radius:var(--pr-r-klein);
  padding:10px 14px;font-size:15px;color:var(--fw-text-2)}
.probe-band b{color:var(--fw-ink)}
.probe-band .knopf.haupt{background:transparent;color:var(--fw-blue-ink);border:1px solid var(--pr-linie-stark);box-shadow:none}
.probe-band .knopf.haupt:hover{background:var(--fw-bg)}
[data-theme="dunkel"] .probe-band{border-color:var(--pr-linie);border-left-color:var(--fw-warning)}

/* ---------- Lektion: die dunkle Bühne nur um einen echten Film ---------- */
.kl-v3 > .kl-kopf{border-radius:var(--pr-r-karte) var(--pr-r-karte) 0 0}
.kl-v3 > .lektion-hero,.kl-v3 > .film-folgt{border-radius:0 0 var(--pr-r-karte) var(--pr-r-karte)}
.kl-v3 > .lektion-hero .buehne{border-radius:var(--pr-r-klein);box-shadow:none}
.kl-v3:not(:has(> .lektion-hero)){--buehne:var(--fw-surface);--buehne-2:var(--fw-bg);--buehne-text:var(--fw-text);--buehne-leise:var(--fw-text-2)}
.kl-v3:not(:has(> .lektion-hero)) > .kl-kopf{border:1px solid var(--pr-linie);border-bottom:0}
.kl-v3:not(:has(> .lektion-hero)) > .film-folgt{border:1px solid var(--pr-linie);border-top:0}
.kl-v3:not(:has(> .lektion-hero)) > .kl-kopf h1{color:var(--fw-ink)}
.studio .kl-v3:not(:has(> .lektion-hero)) > .kl-kopf :is(.kl-zeile,.kl-werkzeuge) .kl-werkzeug,.studio .kl-v3:not(:has(> .lektion-hero)) > .kl-kopf .kl-werkzeug,
.studio .kl-v3:not(:has(> .lektion-hero)) > .kl-kopf .kl-zeile .frag-navi-auf>summary.kl-werkzeug{
  color:var(--fw-ink);background:var(--fw-surface);border:1px solid var(--pr-linie)}
.studio .kl-v3:not(:has(> .lektion-hero)) > .kl-kopf :is(.kl-zeile,.kl-werkzeuge) .kl-werkzeug:hover{background:var(--fw-bg);border-color:var(--pr-linie-stark)}
.studio .kl-v3:not(:has(> .lektion-hero)) > .kl-kopf .kl-werkzeug .ico{color:var(--fw-blue-ink)}
.kl-v3:not(:has(> .lektion-hero)) .lr2-ueberblick{background:var(--fw-bg);border:1px solid var(--pr-linie);color:var(--fw-text)}
.kl-v3:not(:has(> .lektion-hero)) .lr2-ue-liste li{color:var(--fw-ink)}
.kl-v3:not(:has(> .lektion-hero)) .lr2-ue-liste li span{background:var(--fw-surface);color:var(--fw-ink);border:1px solid var(--pr-linie)}
.studio .kl-v3:not(:has(> .lektion-hero)) .lr2-ueberblick a.lr2-ue-link,.kl-v3:not(:has(> .lektion-hero)) .lr2-ueberblick a.lr2-ue-link{color:var(--fw-blue-ink)}
.kl-v3:not(:has(> .lektion-hero)) .lr2-ue-wege .knopf.rahmen{color:var(--fw-ink);border-color:var(--pr-linie-stark)}
.lr2-ueberblick{border-radius:var(--pr-r-knopf)}
.studio .kl-werkzeug{border-radius:var(--pr-r-knopf);box-shadow:none}
.studio .kl-werkzeug:hover{transform:none;box-shadow:none}
.studio .lektion-leiste{border-radius:var(--pr-r-karte)}
.studio .kl-text section.uebung{border:1px solid var(--pr-linie)!important;border-radius:var(--pr-r-karte);box-shadow:none}
.studio .lesefortschritt span{background:var(--fw-blue)}
/* „Das Wichtigste in einem Satz“: ruhig, eine Linie */
.lr2-kern{background:transparent;border-left:3px solid var(--fw-blue);border-radius:0;padding:4px 0 4px 20px}
.lr2-kern span{color:var(--fw-blue-ink)}
.lr2-kern p{color:var(--fw-ink)}
[data-theme="dunkel"] .lr2-kern{background:transparent}
.lr2-aktiv,.lr2-karte,.lr2-aufgabe,.lr2-lk-zeile{border-radius:var(--pr-r-karte)}
.lr2-wahlknopf,.lr2-lk-zeile select{border-radius:var(--pr-r-knopf)}
.zeitmarke{border-radius:var(--pr-r-klein)}

/* ---------- Navi ruhig: schwebt nicht dauernd ---------- */
.navi-schwebt{animation:none!important}
.navi-zeile .navi{filter:none}

/* ---------- Dialoge und schwebende Flächen ---------- */
.studio :is(dialog,.frag-navi-wahl,.ke-blatt,.menue-blatt){border-radius:var(--pr-r-karte)}

/* ---------- Öffentliche Seiten ---------- */
.w-seite .w-kicker{text-transform:none;letter-spacing:0;font-size:15px;font-weight:700}
.w-seite .w-mark,.ao-bewegt .w-mark,.ao-bewegt .w-mark.an{background:none;color:var(--fw-blue-ink);padding:0}
.w-seite :is(.w-weg,.w-lektion-karte,.w-plan,.akkordeon,.w-etappe,.w-karten>li,.w-galerie>li,.w-fakten,.w-held-bild,.w-sicher-bild){
  border:1px solid var(--pr-linie);box-shadow:none;border-radius:var(--pr-r-karte)}
.w-seite :is(.w-plan,.w-karten>li,.w-galerie>li,.w-etappe,.w-film):hover{transform:none;box-shadow:none}
.w-seite .w-plan.w-plan-jetzt{border-color:var(--fw-blue);box-shadow:none}
.w-seite .w-held-buehne .szene-rahmen{box-shadow:var(--pr-schatten-schwebt);border-radius:var(--pr-r-karte)}
.w-seite .knopf,.w-seite .w-wahl{border-radius:var(--pr-r-knopf)}
.dk-tabs button,.studio .dk-tabs button{border-radius:var(--pr-r-klein);border-color:var(--pr-linie)}
.dk-tabs button[aria-pressed="true"],.studio .dk-tabs button[aria-pressed="true"]{background:var(--fw-blue-soft);color:var(--fw-blue-ink);border-color:var(--fw-blue-line)}

/* ---------- Handy ---------- */
@media (max-width:640px){
  .studio .start-weiter{padding:20px;gap:16px;border-radius:var(--pr-r-karte)}
  .studio .kurs-kopf{border-radius:var(--pr-r-karte)}
  .studio .kl-text section.uebung{border-radius:var(--pr-r-karte)}
  .kl-v3 > .kl-kopf{border-radius:var(--pr-r-karte) var(--pr-r-karte) 0 0}
  .kl-v3 > .lektion-hero,.kl-v3 > .film-folgt{border-radius:0 0 var(--pr-r-karte) var(--pr-r-karte)}
}

/* ---------- Lernreise-Liste: Titelkacheln wiederholten nur den Titel (E5) ---------- */
@media (min-width:641px){
  .studio .reise-zeile .vorschau.lt-kachel{display:none}
}

/* ---------- Admin-Übersicht: höchstens drei Kennzahlen je Reihe am Rechner (E2) ---------- */
@media (min-width:900px){.ad-kacheln{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- Handy: kompakt und ohne Zusammenstoßen ---------- */
@media (max-width:640px){
  .probe-band{padding:8px 12px;gap:8px 12px;flex-wrap:nowrap}
  .probe-band>span{min-width:0}
  .probe-band .pb-lang{display:none}           /* Etappen und Mitgliedschaft erklärt die Kaufseite */
  .probe-band .knopf{white-space:nowrap;min-height:40px;padding:0 12px}
  .kl-werkzeuge,.kl-zeile{flex-wrap:nowrap}
  .studio .kl-werkzeug{white-space:nowrap;padding:0 12px}
  /* Merken und Notiz als Symbolknöpfe (E4); der Name bleibt für Screenreader */
  .studio .kl-werkzeug.lesezeichen-knopf,.studio .kl-werkzeug[data-notiz-oeffnen],.studio .kl-werkzeug.notiz-knopf{width:44px;padding:0;justify-content:center}
  .studio .kl-werkzeug.lesezeichen-knopf>span,.studio .kl-werkzeug[data-notiz-oeffnen]>span,.studio .kl-werkzeug.notiz-knopf>span{
    position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (max-width:1023px){
  .handy-leiste{background:var(--fw-surface)}
  /* Spalten nach Inhalt statt fünf gleiche: so passen „Werkzeuge“ und „Community“ ohne Kürzen */
  .studio .handy-leiste{grid-template-columns:repeat(5,auto);justify-content:space-around;padding-left:2px;padding-right:2px}
  .studio .handy-leiste a{min-width:44px;padding:0 4px}
  .studio .handy-leiste a span{white-space:nowrap;letter-spacing:-.01em}
}
[data-theme="dunkel"] .handy-leiste,[data-theme="dunkel"] .kopfleiste{background:var(--fw-surface)}
[data-theme="dunkel"] .kopfleiste{background:var(--fw-bg)}

/* Dunkel: Rahmen von Bedienelementen mit mindestens 3 : 1 (Prüfung T29, L2) */
[data-theme="dunkel"] :is(.lr2-wahlknopf,.lr2-lk-zeile select,.lr2-zone-kopf,.lr2-ziehkarte,.feld input,.feld textarea,.feld select,.knopf.rahmen){border-color:#6B7A99}

/* ---------- Öffentliche Seiten: keine Verläufe (Paket 1/5) ---------- */
.w-seite .w-reise a{color:var(--fw-text-2);text-decoration:none}
.w-seite .w-reise a[aria-current="step"]{color:var(--fw-ink)}
.w-weg.agent{background:#0F2A6B}
.w-schluss{background:#0F1B3D}
.w-bsp{background:var(--fw-surface);border-radius:var(--pr-r-karte)}
.w-vn-ergebnis{background:var(--fw-blue-soft)}
.w-fotos i{background:#BFD4FF}
.w-wer-bild{box-shadow:none}
.w-held,.w-konto{background:var(--fw-bg)}

/* ---------- Weniger Bewegung als Schalter (Quality of Life) ---------- */
html.ohne-bewegung *,html.ohne-bewegung *::before,html.ohne-bewegung *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.ohne-bewegung [data-ao]{opacity:1!important;transform:none!important}
.weiter-lesen{position:fixed;left:50%;bottom:88px;transform:translateX(-50%);z-index:60;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--fw-line-strong);
  background:var(--fw-surface);color:var(--fw-ink);font:600 16px/1 inherit;font-family:inherit;box-shadow:var(--pr-schatten-schwebt);cursor:pointer}
.weiter-lesen:hover{border-color:var(--fw-blue)}
.weiter-lesen:focus-visible{outline:3px solid var(--fw-blue);outline-offset:2px}
@media (min-width:1024px){.weiter-lesen{bottom:28px}}

/* ---------- Öffentliche Seiten: dunkel nach Systemeinstellung (G3, 09.10.2026) ---------- */
@media (prefers-color-scheme:dark){
  body.w-seite{color-scheme:dark;
    --fw-blue-ink:#9DBBFF;--fw-blue-hover:#3D7BFF;--fw-blue-soft:#1C2A45;--fw-blue-line:rgba(130,170,255,.38);
    --fw-ink:#F1F5FB;--fw-text:#DDE4EF;--fw-text-2:#B9C4D6;--fw-muted:#A9B5C8;
    --fw-bg:#13171E;--fw-bg-deep:#0F1218;--fw-surface:#1A1F28;--fw-surface-soft:#1F2530;
    --fw-line:#2A313D;--fw-line-strong:#3A4352;--fw-control-line:#8391AD;
    --fw-success:#6BD6A8;--fw-success-soft:#1B3A31;--fw-warning:#F4C76E;--fw-warning-soft:#3B3220;
    --fw-danger:#FF97A5;--fw-danger-soft:#43222B;--pr-schatten-schwebt:0 16px 40px -12px rgba(0,0,0,.6)}
  body.w-seite :is(.w-vn-bild,.w-doc,.w-anderer-betrieb .ico){background:var(--fw-surface)}
  body.w-seite :is(.w-doc mark,.w-tabelle mark,.w-anatomie li:nth-child(2) .w-anat-sym){background:var(--fw-warning-soft)}
  body.w-seite .w-kopf{background:color-mix(in srgb,var(--fw-bg) 92%,transparent)}
  body.w-seite img{filter:brightness(.92)}
}
/* Fakten und aktive Reiter: in Hell und Dunkel dieselbe ruhige Art wie im Portal */
.w-fakten li{background:var(--fw-surface)}
.w-reiter button[aria-selected="true"]{background:var(--fw-blue-soft);border-color:var(--fw-blue-line);color:var(--fw-blue-ink)}

/* Öffentliche Seiten: Rundungen ab 16 px auf 12 px, keine weichen Schatten (Profil AgentOS) */
.w-seite .install-platz,
.w-seite .install-video .buehne,
.w-seite .w-abruf,
.w-seite .w-abschnitt .w-anderer-betrieb,
.w-seite .w-alle,
.w-seite .w-anatomie>li,
.w-seite .w-bsp,
.w-seite .w-doc,
.w-seite .w-drei li,
.w-seite .w-einblick-rahmen,
.w-seite .w-etappe,
.w-seite .w-etappe-kopf img,
.w-seite .w-fakten,
.w-seite .w-film .buehne,
.w-seite .w-galerie li,
.w-seite .w-held-bild img,
.w-seite .w-held-foto img,
.w-seite .w-karten li,
.w-seite .w-konto-form,
.w-seite .w-konto-seite img,
.w-seite .w-konto-seite li,
.w-seite .w-lektion-karte,
.w-seite .w-menue-liste,
.w-seite .w-montag-seite,
.w-seite .w-ordner,
.w-seite .w-personen article,
.w-seite .w-plan,
.w-seite .w-preis-kurz,
.w-seite .w-rechner,
.w-seite .w-regeln li,
.w-seite .w-schluss .o-warteliste,
.w-seite .w-sicher-bild img,
.w-seite .w-sprechblase,
.w-seite .w-station>div,
.w-seite .w-suche input,
.w-seite .w-summe,
.w-seite .w-vergleichstabelle,
.w-seite .w-vn-bild,
.w-seite .w-wahl,
.w-seite .w-weg,
.w-seite .w-wer img{border-radius:var(--pr-r-karte)}
.w-held-foto img,.w-held-bild,.w-held-foto{box-shadow:none}

/* ---------- Leere Zustände: ein Satz, ein Knopf (Quality of Life, 09.10.2026) ---------- */
.leer .knopf,.leer-treffer .knopf{margin-top:8px}
.leer-treffer p{font-size:16px;line-height:1.5}
.kt-leer.leer-treffer{align-items:flex-start;text-align:left;padding:16px 0}
.glossar-buchstabe[hidden]{display:none}
.leer img,.leer-treffer img{border-radius:16px}
[data-theme="dunkel"] .leer img,[data-theme="dunkel"] .leer-treffer img{filter:brightness(.82)}

/* Lange Links umbrechen statt abschneiden (Pflegerunde 09.10.) */
.anweisung-text{overflow-wrap:anywhere}

/* Hinweis auf die Filmproben in der Lektion (09.10.) */
.teil .fs-hinweis{display:flex;gap:10px;align-items:flex-start}
.teil .fs-hinweis>.ico{flex:none;margin-top:5px}

/* Handy: der schwebende Feedback-Knopf lag über Antworten und Text. Rückmeldung geht dort über Menü und Fußzeile (09.10.) */
@media (max-width:620px){.ffb-knopf{display:none!important}}

/* Lange Texte (Datenschutz, Testbedingungen) in einer Lesespalte (09.10.) */
.w-textseite article{max-width:44rem;margin:0 auto}
.w-textseite h1{font-size:clamp(32px,4vw,44px);line-height:1.15;margin:0 0 12px}
.w-textseite h2{font-size:24px;margin:40px 0 8px}
.w-textseite p,.w-textseite li,.w-textseite dd{font-size:18px;line-height:1.65}
.w-textseite dt{margin-top:18px}
.w-textseite dd{margin:4px 0 0}
.w-textseite .hinweis{display:block;margin:20px 0}

/* Tutorial-Film in der Lektion (09.10.) */
.teil.tutorial .tu-film{margin:16px 0 0}
.teil.tutorial .tu-film figcaption{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:10px;font-size:16px}
.teil.tutorial .tu-film figcaption span:last-child{flex-basis:100%;color:var(--fw-muted,#475569)}
.teil.tutorial .tu-lead{margin:4px 0 0}