:root{
  --bg:#0b0c10;--text:#e8eef3;--muted:#a9b3bd;
  --card:#14161b;--card-border:#222;--card-border-hover:#2a2f3a;
  --accent:#4e8cff;--accent2:#ffd166;
  --aufgabe-bg:#23304a;--aufgabe-border:#2e3a56;
  --box-einstieg-bg:#1e2a44;--box-erarbeitung-bg:#121a28;--box-zusammenfassung-bg:#162033;
  --page-1-bg:#162033;--page-2-bg:#121a28;--page-3-bg:#1e2a44;
  --num-bg:#1d2331;--num-fg:#9fb1c7;
  --badge-bg:#222;--badge-ok-bg:#123018;--badge-ok-fg:#bfe8c7;
  --btn-secondary-bg:#2a2f3a;
}
:root[data-theme="light"]{
  --bg:#f7f9fc;--text:#0a0f1a;--muted:#556274;
  --card:#ffffff;--card-border:#dfe3ea;--card-border-hover:#c9d1e0;
  --accent:#1e66f5;--accent2:#e08800;
  --aufgabe-bg:#f7fbff;--aufgabe-border:#cfd9ea;
  --box-einstieg-bg:#e9f2ff;--box-erarbeitung-bg:#f5faff;--box-zusammenfassung-bg:#fff3e6;
  --page-1-bg:#f0f4ff;--page-2-bg:#eef7ff;--page-3-bg:#fff7ec;
  --num-bg:#e8eef7;--num-fg:#334155;
  --badge-bg:#eef2f7;--badge-ok-bg:#dff3e4;--badge-ok-fg:#176236;
  --btn-secondary-bg:#e9eef7;
}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}
header,footer{padding:1rem 1.25rem}
header{position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--card-border)}
main{padding:1rem}
.grid{display:grid;grid-template-columns:280px 1fr;gap:1rem}
.card{background:var(--card);border:1px solid var(--card-border);border-radius:10px;padding:1rem}
a{color:var(--accent)}a:hover{opacity:.9}
.btn{background:var(--accent);color:#001;border:none;border-radius:8px;padding:.5rem .75rem;cursor:pointer;font-weight:600}
.btn.secondary{background:var(--btn-secondary-bg);color:var(--text)}
.list{list-style:none;margin:0;padding:0}
.list li{padding:.25rem 0}
.badge{display:inline-block;padding:.15rem .5rem;border-radius:6px;background:var(--badge-bg);color:var(--muted);font-size:.8rem}
.badge.ok{background:var(--badge-ok-bg);color:var(--badge-ok-fg)}
.page{padding:.9rem;border-radius:12px;margin:1.25rem 0;border:1px solid var(--card-border)}
.page:nth-of-type(3n+1){background:var(--page-1-bg)}
.page:nth-of-type(3n+2){background:var(--page-2-bg)}
.page:nth-of-type(3n){background:var(--page-3-bg)}
.block{margin:.75rem 0}
.block h4{margin:.25rem 0}
.block.theorie{}
.block.aufgaben{padding-bottom:.5rem}
.block.einstieg-first{background:var(--box-einstieg-bg);border:1px solid var(--card-border);border-radius:12px;padding:.6rem .85rem}
.block.erarbeitung-first{background:var(--box-erarbeitung-bg);border:1px solid var(--card-border);border-radius:12px;padding:.6rem .85rem}
.block.zusammenfassung-first{background:var(--box-zusammenfassung-bg);border:1px solid var(--card-border);border-radius:12px;padding:.6rem .85rem}
.aufgaben-list{display:flex;flex-direction:column;gap:.75rem;margin:.75rem 0}
.aufgabe{background:var(--aufgabe-bg);border:1px solid var(--aufgabe-border);border-radius:12px;padding:.6rem .85rem}
.aufgabe-title{font-weight:700;margin-bottom:.35rem}
.aufgabe-body{line-height:1.6}
.muted{color:var(--muted)}
.flags img{height:100px;width:100px;margin-right:8px;vertical-align:middle}
.video, .media{margin:.5rem 0}
.video iframe{max-width:100%;border:0;border-radius:8px}
.chap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.chap-card{display:block;padding:.75rem;border:1px solid var(--card-border);border-radius:10px;background:var(--card);text-decoration:none;color:var(--text)}
.chap-card:hover{border-color:var(--card-border-hover)}
.chap-card .num{display:inline-block;width:2.2rem;text-align:center;margin-right:.5rem;border-radius:6px;background:var(--num-bg);color:var(--num-fg)}
.chap-card .title{font-weight:600}
/* Code blocks: proportional font, keep line breaks */
.code{background:var(--card);border:1px solid var(--card-border);border-radius:10px;padding:.6rem .85rem;margin:.6rem 0}
.code-lang{color:var(--muted);font-size:.85rem;margin-bottom:.35rem}
.code-content{white-space:pre-wrap;font-family:inherit;line-height:1.5}
@media (max-width: 920px){.grid{grid-template-columns:1fr}}