/* Lernwelt — Darstellung. Enthaelt keinen Stoff. */
:root{
  --papier:#F2F1EC; --flaeche:#FBFAF6; --tinte:#1A1D1B; --weich:#55605A; --linie:#C3C6BD;
  --akzent:#1F5D4C; --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;--akzent:#5FBFA1;--gut:#6FBF8F;--warn:#D98B4A}
}
*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--tinte);font:16px/1.6 var(--text)}
.rand{max-width:72rem;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.7rem;margin:1.4rem 0 .3rem}
h2{font-size:1.2rem;margin:1rem 0 .4rem}
h3{font-size:1.02rem;margin:1rem 0 .3rem}
.lead{color:var(--weich);margin:.2rem 0 1rem}
.hinweis,.kasten{background:var(--flaeche);border-left:4px solid var(--akzent);padding:.7rem 1rem;margin:1rem 0}
.hinweis p{margin:.2rem 0}
a{color:var(--akzent)}
button,.knopf,.dateiknopf{font:inherit;font-size:.92rem;cursor:pointer;padding:.42rem .9rem;border-radius:6px;border:1px solid var(--akzent);background:var(--akzent);color:var(--papier);text-decoration:none;display:inline-block}
button.zweit,.dateiknopf.zweit{background:transparent;color:var(--akzent)}
button[aria-pressed=true]{background:var(--akzent);color:var(--papier)}
.dateiknopf input{position:absolute;opacity:0;width:1px;height:1px}
.knopfzeile{display:flex;flex-wrap:wrap;gap:.45rem;margin:.5rem 0}
.knopfzeile.klein button,.knopfzeile.klein input{font-size:.82rem;padding:.2rem .55rem}
.einstellung{background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;padding:.6rem 1rem;margin:1rem 0}
.einstellung .mono{margin:0}
.zeile{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:.4rem 0}
label{display:inline-flex;flex-direction:column;gap:.15rem;font-size:.9rem}
label.haken{flex-direction:row;align-items:center;gap:.4rem;align-self:end}
select,input[type=search],input[type=date],input[type=number]{font:inherit;font-size:.95rem;padding:.35rem .5rem;border:1px solid var(--linie);border-radius:6px;background:var(--papier);color:var(--tinte);max-width:100%}
input.zahl{width:5.5rem}
nav.reiter{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0}
nav.reiter button{border-radius:999px;background:var(--flaeche);border-color:var(--linie);color:var(--tinte)}
nav.reiter button[aria-selected=true]{background:var(--akzent);border-color:var(--akzent);color:var(--papier)}
.suchmaske{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto;gap:.6rem;align-items:end}
.suchmaske .breit input{width:100%}
@media (max-width:760px){.suchmaske{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.suchmaske .breit{grid-column:1/-1}}
.raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:.9rem;margin:.6rem 0}
.karte{background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;padding:.7rem .9rem;display:flex;flex-direction:column;min-width:0}
.karte .kopf{display:flex;justify-content:space-between;gap:.5rem}
.karte .art{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--akzent)}
.karte h3{margin:.3rem 0 .2rem;font-size:1.02rem}
.karte h3 a{text-decoration:none;color:var(--tinte)}
.karte p{margin:.2rem 0;overflow-wrap:anywhere}
.karte .lehrplan{font-size:.84rem;color:var(--weich)}
.karte .stand-zeile{font-size:.84rem;color:var(--gut)}
.karte .knopfzeile{margin-top:auto;padding-top:.4rem}
.planliste{padding-left:1.4rem}
.planliste li{margin:.5rem 0;padding:.4rem .6rem;background:var(--flaeche);border:1px solid var(--linie);border-radius:8px}
.summe{font-weight:600}
.standzeile{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(min(100%,6rem),1fr) auto;gap:.6rem;align-items:center;padding:.35rem 0;border-bottom:1px solid var(--linie)}
@media (max-width:600px){.standzeile{grid-template-columns:1fr}}
.balken{height:.7rem;background:var(--papier);border:1px solid var(--linie);border-radius:999px;overflow:hidden}
.balken span{display:block;height:100%;background:var(--gut)}
.termine{padding-left:1.3rem}
.termine li{margin:.6rem 0}
.termine p{margin:.1rem 0}
dl{display:grid;grid-template-columns:max-content 1fr;gap:.3rem 1rem}
@media (max-width:600px){dl{grid-template-columns:1fr}}
dt{font-weight:600}
dd{margin:0}
.tabelle-scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.88rem}
th,td{text-align:left;vertical-align:top;border-bottom:1px solid var(--linie);padding:.35rem .5rem;overflow-wrap:anywhere}
.grundsatz{background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;padding:.2rem 1rem .6rem;margin:.6rem 0}
footer{margin:2rem 0 1.5rem}
.lehrgaenge{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:.8rem;margin:.6rem 0 1rem}
.lehrgang{background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;padding:.7rem .9rem;display:flex;flex-direction:column;gap:.25rem;transition:transform .2s,box-shadow .2s;animation:lw-auf .4s ease both}
.lehrgang:hover{transform:translateY(-3px);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.lehrgang.aktiv{border:2px solid var(--akzent)}
.lehrgang h4{margin:.1rem 0;font-size:1.02rem}
.lehrgang p{margin:0;font-size:.9rem}
.lehrgang ol{margin:.2rem 0;padding-left:1.2rem;font-size:.88rem;color:var(--weich)}
.lehrgang .knopfzeile{margin-top:auto}
.wochenplan{display:grid;gap:.3rem;margin:.6rem 0}
.wp-zeile{display:grid;grid-template-columns:minmax(7rem,14rem) 1fr;gap:.6rem;align-items:center;font-size:.9rem}
.wp-bahn{position:relative;height:1.3rem;background:var(--flaeche);border:1px solid var(--linie);border-radius:6px;overflow:hidden}
.wp-balken{position:absolute;top:0;bottom:0;background:var(--akzent);border-radius:5px;transform-origin:left;animation:wp-wachsen .7s ease both}
.wp-skala{display:grid;grid-template-columns:minmax(7rem,14rem) 1fr;gap:.6rem;font-family:var(--mono);font-size:.72rem;color:var(--weich)}
.wp-skala span:last-child{display:flex;justify-content:space-between}
.nur-druck{display:none}
@keyframes lw-auf{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes wp-wachsen{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:600px){.wp-zeile,.wp-skala{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.lehrgang,.wp-balken{animation:none}.lehrgang{transition:none}}
@media print{
  .nur-druck{display:block!important}
  .wp-balken{background:#555;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .lehrgaenge,#lehrgang-hinweis{display:none!important}
  header,.einstellung,nav.reiter,.knopfzeile,.suchmaske,footer,.hinweis{display:none!important}
  .bereich[hidden]{display:none!important}
  body{background:#fff;color:#000}
}
.karte p.text{display:-webkit-box;-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.suchmaske>*{min-width:0}.suchmaske select,.suchmaske input{max-width:100%;width:100%;box-sizing:border-box}

/* Fassung 83.0: Fachkacheln, Farbstreifen je Fach, Einblenden und Anheben — ohne Bewegung bei prefers-reduced-motion */
.fachkacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,9.5rem),1fr));gap:.5rem;margin:.2rem 0 .9rem}
.fachkachel{--fh:150;font:inherit;text-align:left;cursor:pointer;border:1px solid var(--linie);border-left:5px solid hsl(var(--fh) 42% 40%);
  background:var(--flaeche);border-radius:8px;padding:.45rem .6rem;display:flex;flex-direction:column;gap:.05rem;color:var(--tinte);
  animation:lw-auf .4s ease both;animation-delay:calc(var(--i,0) * 25ms);transition:transform .18s ease,box-shadow .18s ease,background .18s}
.fachkachel .zahl{font-family:var(--mono);font-size:1.25rem;font-weight:700;color:hsl(var(--fh) 42% 34%)}
.fachkachel .name{font-size:.82rem;line-height:1.25}
.fachkachel:hover,.fachkachel:focus-visible{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.fachkachel.an{background:hsl(var(--fh) 42% 40%);color:#fff}.fachkachel.an .zahl{color:#fff}
.karte{--fh:150;border-top:4px solid hsl(var(--fh) 42% 40%);animation:lw-auf .35s ease both;animation-delay:calc(var(--i,0) * 22ms);
  transition:transform .18s ease,box-shadow .18s ease}
.karte:hover,.karte:focus-within{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.09)}
@keyframes lw-auf{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fachkachel,.karte{animation:none;transition:none}.fachkachel:hover,.karte:hover{transform:none}}
@media (max-width:760px){.suchmaske{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}