/* Lernmodul — Darstellung. Enthaelt keinen Stoff. */
:root{
  --papier:#F2F1EC; --flaeche:#FBFAF6; --tinte:#1A1D1B; --weich:#55605A;
  --linie:#C3C6BD; --gut:#2C6E49; --warn:#8A4B1F;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --text:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{--papier:#141715;--flaeche:#1C201D;--tinte:#ECEFE9;--weich:#A5AFA8;
        --linie:#333A35;--gut:#6FBF8F;--warn:#D98B4A}
}
*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--tinte);font:17px/1.62 var(--text)}
.rand{max-width:52rem;margin:0 auto;padding:0 1rem}
header{border-bottom:1px solid var(--linie);background:var(--flaeche);padding:.9rem 0}
.kopfzeile{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:space-between;align-items:baseline}
.wortmarke{font-family:var(--mono);letter-spacing:.14em;font-size:.95rem;
  border-bottom:2px solid var(--akzent);padding-bottom:2px}
.mono{font-family:var(--mono);font-size:.76rem;color:var(--weich)}
h1{font-size:1.6rem;margin:1.6rem 0 .3rem;letter-spacing:-.01em}
h2{font-size:1.2rem;margin:2rem 0 .6rem}
h3{font-size:1.05rem;margin:1.4rem 0 .3rem}
p{margin:.5rem 0}
.hinweis{background:var(--flaeche);border-left:4px solid var(--akzent);padding:.9rem 1rem;margin:1.2rem 0}
.hinweis p{margin:.2rem 0}
ol.ablauf{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:1.4rem 0;padding:0}
ol.ablauf li{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--weich);border:1px solid var(--linie);border-radius:999px;padding:.3rem .7rem}
ol.ablauf li::before{content:counter(list-item) " ";color:var(--akzent);font-weight:700}
nav.reiter{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.2rem 0}
nav.reiter button{font:inherit;font-size:.9rem;cursor:pointer;padding:.45rem .9rem;border-radius:999px;
  border:1px solid var(--linie);background:var(--flaeche);color:var(--tinte)}
nav.reiter button[aria-selected=true]{background:var(--akzent);border-color:var(--akzent);color:var(--papier)}
.modul-kopf{border-left:4px solid var(--akzent);padding-left:1rem;margin:1.4rem 0}
.modul-kopf .art{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--akzent)}
.thema{border:1px solid var(--linie);border-radius:8px;background:var(--flaeche);
  padding:1.1rem 1.2rem;margin:0 0 1rem}
.thema ul{margin:.4rem 0 0;padding-left:1.1rem}
.thema li{margin:.35rem 0}
.uebung{border-top:1px solid var(--linie);margin-top:.9rem;padding-top:.8rem}
.uebung .frage{font-weight:600}
details{margin-top:.5rem}
summary{cursor:pointer;font-family:var(--mono);font-size:.78rem;color:var(--akzent)}
.loesung{margin-top:.4rem;color:var(--weich)}
.frage-karte{border:1px solid var(--linie);border-radius:8px;background:var(--flaeche);
  padding:1rem 1.1rem;margin:0 0 .9rem}
.frage-karte .wahl{display:block;margin:.3rem 0}
.frage-karte button{font:inherit;font-size:.9rem;cursor:pointer;padding:.35rem .8rem;
  border-radius:5px;border:1px solid var(--linie);background:var(--papier);color:var(--tinte);
  margin-top:.5rem}
.richtig{color:var(--gut);font-weight:600}
.falsch{color:var(--warn);font-weight:600}
footer{margin:3rem 0 2rem;color:var(--weich)}
[hidden]{display:none!important}