/* 240_overfitting_regularisierung — Spezialoptik (Quelle sample7.html hatte KEINEN <style>-Block,
   d. h. hier gibt es keine ROHFASSUNG zum Ausmisten). Diese Klassen haben kein Aequivalent in
   assets/css/style.css und wurden ohne sie unsichtbar/unstyled gerendert (Fortschrittsbalken,
   Trainings-/Test-Split-Boxen, Modell-Vergleich nebeneinander). warning-box/success-box aus der
   Quelle wurden in modul.js auf die vorhandenen warn-box/erfolg-box aus style.css umgestellt. */

/* Fortschrittsbalken (zwei Instanzen: Modell ohne/mit Regularisierung) — kein Aequivalent in style.css */
.progress-container{margin-top:1rem;background:var(--hk-grau-hell);border-radius:var(--hk-radius);
  overflow:hidden;height:30px;position:relative}
.progress-bar{width:0%;height:100%;background:linear-gradient(90deg,var(--hk-blau) 0%,var(--hk-rot) 100%);
  transition:width .3s ease}
.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-weight:600;color:var(--hk-text);text-shadow:0 0 3px #fff}

/* Trainings-/Test-Split nebeneinander (Intro) — kein Aequivalent in style.css */
.data-split{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem}
.data-type{flex:1 1 200px;background:#fff;border-radius:6px;padding:1rem;line-height:1.6;
  border-left:4px solid var(--hk-rahmen)}
.data-train{border-left-color:var(--hk-blau)}
.data-test{border-left-color:var(--hk-gruen)}

/* Modell-Vergleich nebeneinander (ohne/mit Regularisierung) — Kernstueck der Lektion,
   kein Aequivalent in style.css */
.model-comparison{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1rem;margin-top:1rem}
.model-box{background:#fff;border:2px solid var(--hk-rahmen);border-radius:var(--hk-radius);
  padding:1.1rem 1.2rem}
.model-box.overfitting{border-color:var(--hk-rot)}
.model-box.regularized{border-color:var(--hk-gruen)}
.model-box h4{margin-bottom:.4rem}
.metric{display:flex;justify-content:space-between;gap:.5rem;padding:.3rem 0;
  border-bottom:1px solid var(--hk-rahmen)}
.metric.good{color:var(--hk-gruen-dunkel)}
.metric.bad{color:var(--hk-rot-dunkel)}