/* KI-Labor (ict.schule/labor/…) – gemeinsames Aussehen aller Labore im ict.schule-Tools-Look
   (Palette/Schrift wie tools.ict.schule, Hell/Dunkel über html[data-theme], Theme-Key ictschule.tools.theme).
   Mobile-first: alles funktioniert ab 320 px ohne seitliches Scrollen; Bedienelemente ≥ 44 px (Touch/iPad). */
*{box-sizing:border-box}
:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;
  --bg:#f5f7fb; --card:#fff; --text:#18233a; --text2:#5d6a80; --text3:#7b879c; --border:#e3e7ef; --border2:#cfd7e6;
  --accent:#284de6; --accent-weich:#edf1ff; --accent-text:#284de6; --tuerkis:#0f9f8f; --tuerkis-weich:#e3f7f4;
  --balken:#284de6; --balken-bg:#e8edf8; --feld:#fff;
  --warn-bg:#fff6e5; --warn-text:#6a4300; --warn-border:#f4d39a; --fehler-bg:#fdecea; --fehler-text:#7a1712; --fehler-border:#f1b0ab;
  --ok-bg:#e6f6ec; --ok-text:#14532d;
  color:var(--text);background:var(--bg)}
html[data-theme=dark]{color-scheme:dark;
  --bg:#101623; --card:#192233; --text:#e9edf7; --text2:#b0bdd2; --text3:#8e9bb3; --border:#354156; --border2:#4d6090;
  --accent:#385be5; --accent-weich:#202e47; --accent-text:#b6c8ff; --tuerkis:#2dd4bf; --tuerkis-weich:#173a3a;
  --balken:#82a0ff; --balken-bg:#26385f; --feld:#121a29;
  --warn-bg:#3a2e14; --warn-text:#ffe2a8; --warn-border:#6b5320; --fehler-bg:#3d1c1c; --fehler-text:#ffd0cc; --fehler-border:#7a3535;
  --ok-bg:#16351f; --ok-text:#b7f0c8}
html,body{max-width:100%;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--text);line-height:1.5}
a{color:var(--accent-text)}
:focus-visible{outline:3px solid #82a0ff;outline-offset:3px}
main.labor{max-width:980px;margin:auto;padding:28px max(4vw,20px) 32px;display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
main.labor > *{min-width:0}
.zurueck{font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:36px}
.eyebrow{font-size:12px;font-weight:750;letter-spacing:1.8px;color:var(--accent-text);text-transform:uppercase;margin:0 0 6px}
h1{font-size:clamp(26px,3.2vw,36px);letter-spacing:-1px;margin:0 0 8px;line-height:1.15;overflow-wrap:anywhere}
.lead{color:var(--text2);font-size:16.5px;line-height:1.6;margin:0;max-width:760px;overflow-wrap:anywhere}
.lead b{color:var(--text)}
.karte{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;min-width:0}
.karte > h2{font-size:12.5px;font-weight:750;letter-spacing:1px;text-transform:uppercase;color:var(--text3);margin:0 0 10px}
label.feld{display:block;font-size:14px;font-weight:650;margin-bottom:6px}
textarea,input[type=text],select{font:inherit;color:var(--text);background:var(--feld);border:1px solid var(--border2);border-radius:10px;max-width:100%;min-width:0}
textarea{width:100%;min-height:76px;resize:vertical;font-size:17px;line-height:1.45;padding:12px}
input[type=text]{width:100%;font-size:17px;padding:11px 12px;min-height:46px}
select{font-size:14.5px;padding:10px;min-height:44px}
.btn{min-height:44px;padding:9px 16px;border-radius:11px;font:inherit;font-size:15px;font-weight:650;cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-primaer{background:var(--accent);color:#fff}
.btn-primaer:hover:not(:disabled){filter:brightness(1.08)}
.btn-ghost{background:transparent;border-color:var(--border2);color:var(--text)}
.btn-ghost:hover:not(:disabled){border-color:var(--accent)}
.btn-klein{min-height:36px;padding:6px 12px;font-size:13.5px}
.reihe{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{min-height:38px;padding:6px 12px;border-radius:999px;border:1px solid var(--border2);background:transparent;color:var(--text2);font:inherit;font-size:13.5px;cursor:pointer;text-align:left;max-width:100%;overflow-wrap:anywhere}
.chip:hover{color:var(--text);border-color:var(--accent)}
.chip b{font-weight:650;color:var(--text);margin-right:5px}
.pbar{height:10px;border-radius:6px;background:var(--balken-bg);overflow:hidden;margin:10px 0 6px}
.pbar > span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.status{font-size:14px;color:var(--text2);overflow-wrap:anywhere}
.hinweis{font-size:13px;color:var(--text3);line-height:1.5;overflow-wrap:anywhere;margin:0}
.meldung{border-radius:12px;padding:12px 14px;font-size:14.5px;line-height:1.5;border:1px solid}
.meldung.warn{background:var(--warn-bg);color:var(--warn-text);border-color:var(--warn-border)}
.meldung.fehler{background:var(--fehler-bg);color:var(--fehler-text);border-color:var(--fehler-border)}
.meldung.ok{background:var(--ok-bg);color:var(--ok-text);border-color:transparent}
.versteckt{display:none !important}
/* Balken (Wahrscheinlichkeiten / Konfidenz) */
.kands{display:flex;flex-direction:column;gap:6px}
.kand{display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr) 58px;align-items:center;gap:10px;width:100%;min-height:48px;padding:6px 10px;border-radius:11px;border:1px solid var(--border);background:var(--feld);color:var(--text);font:inherit;text-align:left;cursor:pointer}
button.kand:hover{border-color:var(--accent)}
.kand .wort{font-size:17px;font-weight:650;overflow-wrap:anywhere;display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.kand .nr{font-size:11px;color:var(--text3);font-weight:650;min-width:12px}
.kand .lz{color:var(--text3);font-weight:400;font-size:14px}
.kand .tag{font-size:10.5px;font-weight:650;color:var(--text3);border:1px solid var(--border2);border-radius:6px;padding:1px 5px}
.kand .bar{height:16px;border-radius:8px;background:var(--balken-bg);overflow:hidden}
.kand .bar > span{display:block;height:100%;background:var(--balken);border-radius:8px;transition:width .18s}
.kand .pz{text-align:right;font-variant-numeric:tabular-nums;font-size:14.5px;color:var(--text2)}
.kand.ende .wort{color:var(--text2);font-weight:500;font-size:15px}
.kand.ende .bar > span{background:var(--text3)}
input[type=range]{width:100%;min-width:0;accent-color:var(--accent);height:32px}
.temp{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center}
.temp > span{font-size:13px;color:var(--text2)}
/* Für Lehrpersonen */
details.lp summary{cursor:pointer;font-weight:650;font-size:15px;min-height:40px;display:flex;align-items:center}
details.lp .inhalt{font-size:14px;line-height:1.6}
details.lp h3{font-size:14px;margin:14px 0 4px}
details.lp p{margin:0 0 6px}
dl.info{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 12px;font-size:13px;margin:6px 0 0}
dl.info dt{color:var(--text3)}
dl.info dd{margin:0;overflow-wrap:anywhere;white-space:pre-line}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace}
@media (max-width:480px){
  main.labor{padding:18px 14px 24px}
  .kand{grid-template-columns:minmax(0,42%) minmax(0,1fr) 52px;gap:7px;padding:6px 8px}
  .kand .wort{font-size:16px}
  .reihe > .btn{flex:1 1 auto}
}