/* ProgVenture-Mockup – nur Ergaenzungen zu oopventure.css. */

/* Klassen mit display:flex/grid wuerden das hidden-Attribut sonst ueberstimmen */
.cv-body [hidden] { display: none !important; }

/* ---------- Steuerleiste des Mockups (gehoert nicht zur spaeteren Oberflaeche) ---------- */
.cv-mock-leiste {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .4rem 1.25rem;
  background: repeating-linear-gradient(-45deg, #2b2f3a, #2b2f3a 12px, #323745 12px, #323745 24px); color: #fff;
  position: sticky; top: 0; z-index: 50;
}
.cv-mock-leiste strong { background: #d9412b; padding: .05rem .55rem; border-radius: 4px; letter-spacing: .06em; text-transform: uppercase; font-size: .8rem; }
.cv-mock-hinweis { font-size: .82rem; color: #f8e3a3; }
.cv-mock-knoepfe { display: flex; gap: .3rem; flex-wrap: wrap; }
.cv-mock-knoepfe a { color: #dfe7c4; padding: .15rem .7rem; border-radius: 999px; font-weight: 600; }
.cv-mock-knoepfe a:hover { text-decoration: none; background: rgba(255,255,255,.1); }
.cv-mock-knoepfe a.ist-aktiv { background: #a3c02a; color: #16200a; }
.cv-mock-coins { margin-left: auto; border: 1px dashed #f8e3a3; background: none; color: #f8e3a3; border-radius: 999px; padding: .1rem .7rem; cursor: pointer; font-weight: 700; }

/* ---------- Welt-Umschalter ---------- */
.cv-weltwahl { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-top: .6rem; }
.cv-weltwahl-titel { font-weight: 700; color: var(--ov-text-leise); }
.cv-weltwahl button {
  border: 1px solid var(--ov-rand); background: #fff; color: var(--ov-text); font-weight: 700;
  padding: .2rem .8rem; border-radius: 999px; cursor: pointer;
}
.cv-weltwahl button.ist-aktiv { background: var(--ov-gruen); border-color: var(--ov-gruen); color: #fff; }
.cv-welt-hinweis { font-size: .82rem; color: var(--ov-text-leise); font-style: italic; }

/* ---------- Kopf ---------- */
.cv-marke { display: inline-flex; }
.cv-marke svg { display: block; }
.cv-level-id { font-weight: 800; background: rgba(0,0,0,.18); padding: 0 .5rem; border-radius: 4px; }
.cv-kopf-avatar { display: inline-flex; background: rgba(255,255,255,.85); border-radius: 50%; padding: 1px; }
.cv-coin { display: inline-flex; }

/* Stufen-Chips: Einstieg, Erarbeitung, Uebung */
.cv-stufen { display: inline-flex; gap: .25rem; flex-wrap: wrap; }
.cv-stufe {
  display: inline-flex; align-items: center; gap: .2rem; font-size: .78rem; font-weight: 700;
  padding: .05rem .55rem; border-radius: 999px; border: 1px solid var(--ov-rand); background: #fff; color: var(--ov-text);
}
button.cv-stufe { cursor: pointer; font-family: inherit; }
button.cv-stufe:hover, a.cv-stufe:hover { border-color: var(--ov-gruen); text-decoration: none; }
.cv-stufe.ist-fehlt { background: transparent; border-style: dotted; color: var(--ov-text-leise); font-weight: 400; }
.cv-stufe.ist-erledigt { background: var(--ov-ok-hell); border-color: #b9dcc3; color: var(--ov-ok); }
.cv-stufe.ist-aktuell { background: #fff7d6; border-color: var(--ov-gold); color: #7a5200; }
.cv-stufe.ist-gesperrt { background: transparent; border-style: dashed; color: var(--ov-text-leise); }
.ov-kopf .cv-stufe.ist-gesperrt { color: #fff; border-color: rgba(255,255,255,.6); }

/* ---------- Welt ---------- */
.cv-buehne {
  width: 100%; height: clamp(220px, 34vh, 420px); border: 2px solid #3f4a24; border-radius: 6px;
  background: #fff; overflow: hidden; display: flex;
}
.cv-buehne.ist-verborgen { background: repeating-linear-gradient(45deg, #f4f7e8, #f4f7e8 10px, #eef2de 10px, #eef2de 20px); }
.cv-welt-svg { width: 100%; height: 100%; display: block; }
/* Konsole-Welt: erwartete Ausgabe neben der des Programms */
.cv-konsole-welt { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; width: 100%; padding: .6rem; background: #1f2712; overflow: auto; align-content: start; }
.cv-konsole-welt h4 { margin: 0 0 .3rem; font-size: .78rem; color: #c9d7a6; font-weight: 700; }
.cv-ausgabe { font: .95rem/1.35 Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; color: #e8f0d4; background: #2b351b; border-radius: 6px; padding: .4rem .6rem; min-height: 4rem; overflow-x: auto; }
.cv-ausgabe div { white-space: pre; min-height: 1.35em; }
.cv-ausgabe.ist-soll { color: #a9b98a; }
.cv-ausgabe .ist-ok { color: #b9f0a0; }
.cv-ausgabe .ist-falsch { color: #ffb3a7; background: rgba(255, 120, 100, .14); }
.cv-ausgabe-leer { margin: 0; color: #8a9870; font-style: italic; font-family: 'Segoe UI', system-ui, sans-serif; font-size: .85rem; }
/* Zielbild: breit und blassgrau, durchgezogen - nie gestrichelt, damit eine gestrichelte Aufgabe nicht doppelt gestrichelt wirkt */
.cv-welt-svg .cv-zielbild line { stroke: #cdd2c4; stroke-width: 7; stroke-linecap: round; stroke-opacity: .85; }
.cv-welt-svg .cv-spur line { stroke-width: 2.5; stroke-linecap: round; }
.cv-welt-svg .cv-zielbild circle.cv-ziel-punkt { fill: #cdd2c4; fill-opacity: .6; stroke: #cdd2c4; stroke-width: 3; }
.cv-welt-svg .cv-zielbild polygon.cv-ziel-flaeche { fill: #cdd2c4; fill-opacity: .35; stroke: none; }
/* Mit Farbpruefung bleibt die Zielfarbe erkennbar, aber blass */
.cv-welt-svg .cv-zielbild [style] { stroke-opacity: .4; fill-opacity: .3; }
.cv-svg-titel { font: 700 15px 'Segoe UI', system-ui, sans-serif; fill: var(--ov-text); }
.cv-svg-text { font: 600 13px 'Segoe UI', system-ui, sans-serif; fill: var(--ov-text); }
.cv-svg-text.ist-ok { fill: var(--ov-ok); }
.cv-svg-text.ist-fehler { fill: var(--ov-fehler); }
.cv-svg-klein { font: 11px 'Segoe UI', system-ui, sans-serif; fill: var(--ov-text-leise); }
.cv-svg-taste { font: 800 14px 'Segoe UI', system-ui, sans-serif; fill: #e6eaef; }
.cv-svg-platine { font: 700 11px 'Segoe UI', system-ui, sans-serif; fill: #c9d1db; letter-spacing: .04em; }
.cv-taste { cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.cv-verborgen { background: var(--ov-gruen-zart); color: var(--ov-text-leise); }
.cv-test-name { font-weight: 400; color: var(--ov-text-leise); font-size: .78rem; }
.cv-tempo-anzeige { font-variant-numeric: tabular-nums; min-width: 2.6em; font-size: .85rem; color: var(--ov-text-leise); }
.cv-export { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.cv-export button:disabled { opacity: .55; cursor: not-allowed; }
.cv-export-info { font-size: .85rem; color: var(--ov-text-leise); }
.cv-welt-extra:empty { display: none; }
/* Eingeklappt (ventures-ansicht.js): die Reiter zeigen weiter, welche Tests bestanden sind */
.ov-welt.ist-eingeklappt > .cv-buehne, .ov-welt.ist-eingeklappt > .cv-verborgen { display: none; }

/* ---------- Palette und Variablen ---------- */
.cv-palette-reihe { display: flex; gap: .3rem; flex-wrap: wrap; }
.cv-palette-reihe button { min-width: 2.4rem; text-align: center; }
.cv-palette-hinweis { margin: .2rem 0 0; font-size: .78rem; color: var(--ov-text-leise); font-style: italic; }
.cv-variablen-tabelle { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--ov-rand); border-radius: 6px; font-size: .85rem; }
.cv-variablen-tabelle th { text-align: left; padding: .2rem .5rem; color: var(--ov-gruen-dunkel); font-family: Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; width: 40%; }
.cv-variablen-tabelle td { padding: .2rem .5rem; font-family: Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; overflow-wrap: anywhere; }
.cv-variablen-tabelle tr + tr { border-top: 1px solid var(--ov-rand); }
.cv-variablen-tabelle tr.ist-neu td { background: #fff7d6; }

/* ---------- Editor-Kopf: Zeilenbudget ---------- */
.cv-zeilen { color: #86efac; font: 700 .82rem Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; padding-bottom: .45rem; }
.cv-zeilen.ist-fehler { color: #fca5a5; }

/* Mehr Platz oben (Mockup-Leiste und Welt-Umschalter) */
@media (min-width: 981px) {
  .cv-level .ov-arbeitsbereich { height: calc(100vh - 11.5rem); height: calc(100dvh - 11.5rem); }  /* dvh: Safari-Leisten abgezogen */
}

/* ---------- Uebersicht ---------- */
.cv-titel {
  margin-top: 1rem; border-radius: 14px; overflow: hidden; border: 1px solid var(--ov-rand);
  background: linear-gradient(180deg, #8cc8f0 0%, #cfe9fb 100%); box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
}
/* Schriftzug wie .ov-titel in OOPventure (gelb, harte braune Kontur), hier im Fluss statt ueber dem Video */
.cv-titel-schrift {
  margin: 0; padding: 1.4rem 1rem 1.1rem; text-align: center;
  font: 900 clamp(2.4rem, 7.5vw, 4.6rem)/1 'Segoe UI Black', 'Arial Black', system-ui, sans-serif; letter-spacing: .02em; color: #ffe27a;
  text-shadow:
    .06em 0 0 #5a2a0a, -.06em 0 0 #5a2a0a, 0 .06em 0 #5a2a0a, 0 -.06em 0 #5a2a0a,
    .06em .06em 0 #5a2a0a, -.06em .06em 0 #5a2a0a, .06em -.06em 0 #5a2a0a, -.06em -.06em 0 #5a2a0a,
    0 .14em 0 #3a1a05, .06em .14em 0 #3a1a05, -.06em .14em 0 #3a1a05;
}
.cv-titel-alpha { background: #f59e0b; color: #3b2300; top: -1.6em; }
/* Unter dem Banner: Einleitung links, Alpha/Beta-Hinweis rechts als eigener Kasten */
.cv-titel-info {
  display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; align-items: center; margin: .9rem 0 0; padding: .8rem 1.2rem;
  font-size: .95rem; color: var(--ov-text-leise); background: #fff; border: 1px solid var(--ov-rand); border-radius: 12px;
}
.cv-titel-info p { margin: 0; }
.cv-titel-info-alpha { padding: .55rem .8rem; border-radius: 8px; background: #fff7e0; border: 1px solid #f3d38a; font-size: .9rem; color: #6b4e12; }
@media (max-width: 720px) { .cv-titel-info { grid-template-columns: 1fr; } }
/* Ohne Alpha/Beta: die Einleitung ist der Fuss der Banner-Karte (zentriert, volle Breite) */
.cv-titel.mit-fuss { border-radius: 14px 14px 0 0; border-bottom: 0; }
.cv-titel-info.ist-fuss { display: block; margin: 0; border-radius: 0 0 14px 14px; border-top: 0; background: #f7faec; text-align: center; }
.cv-laufband {
  position: relative; height: 76px; container-type: inline-size; overflow: hidden;
  background: linear-gradient(#b7d98a, #9fc66a); border-top: 3px solid #86b04f;
}
/* Hin und zurueck in 16 s; zur Umkehr wird der gespiegelte Avatar eingeblendet. */
.cv-laeufer {
  position: absolute; left: 0; bottom: 6px; width: 64px; height: 60px;
  animation: cv-laufen 16s linear infinite; animation-delay: var(--cv-verzug, 0s); animation-fill-mode: backwards;
}
/* Der Begleiter laeuft dieselbe Bahn etwas spaeter - so ist er immer hinter dem Avatar. */
.cv-laeufer-begleiter { --cv-verzug: .9s; }
.cv-figur { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: center; animation: 16s linear infinite; animation-delay: var(--cv-verzug, 0s); animation-fill-mode: backwards; }
.cv-figur-rechts { animation-name: cv-blick-rechts; }
.cv-figur-links { animation-name: cv-blick-links; }
.cv-figur svg { animation: cv-wippen .45s ease-in-out infinite alternate; }
@keyframes cv-laufen { 0% { transform: translateX(0); } 50% { transform: translateX(calc(100cqw - 64px)); } 100% { transform: translateX(0); } }
@keyframes cv-blick-rechts { 0%, 49.9% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes cv-blick-links { 0%, 49.9% { opacity: 0; } 50%, 100% { opacity: 1; } }
@keyframes cv-wippen { from { transform: translateY(0); } to { transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) {
  .cv-laeufer, .cv-figur, .cv-figur svg { animation: none; }
  .cv-figur-links { opacity: 0; }
  .cv-laeufer-begleiter { left: 40px; }
  .cv-deko-fluegel, .cv-deko-wasser { animation: none !important; }
}
/* Mit Deko aus dem Shop steuert cv-seite.js den Avatar: Er geht von Station zu Station. */
.cv-laufband-szene { position: absolute; inset: 0; }
.cv-station { position: absolute; bottom: 4px; width: 64px; height: 64px; transition: transform .3s; }
.cv-station.wird-angeschaut { transform: scale(1.08); }
.cv-station.wird-angeschaut::after {
  content: '✦'; position: absolute; top: -4px; right: 2px; color: #fff6a8; font-size: 14px; text-shadow: 0 0 3px #b8860b;
  animation: cv-funkeln .8s ease-in-out infinite alternate;
}
.cv-laeufer.ist-frei, .cv-laeufer.ist-frei .cv-figur { animation: none; }
.cv-laeufer.ist-frei .cv-figur-links { opacity: 0; }
.cv-laeufer.ist-frei.blickt-links .cv-figur-links { opacity: 1; }
.cv-laeufer.ist-frei.blickt-links .cv-figur-rechts { opacity: 0; }
.cv-laeufer.ist-frei.steht svg { animation: none; }
.cv-deko-fluegel { transform-origin: 32px 22px; animation: cv-drehen 6s linear infinite; }
.cv-deko-wasser { animation: cv-plaetschern 1.2s ease-in-out infinite alternate; }
@keyframes cv-drehen { to { transform: rotate(360deg); } }
@keyframes cv-plaetschern { from { opacity: .5; } to { opacity: 1; } }
@keyframes cv-funkeln { from { opacity: .3; } to { opacity: 1; } }
/* Kleiner Stopp-Knopf: haelt alles im Band an */
.cv-laufband-stopp {
  position: absolute; top: 4px; right: 6px; z-index: 2; width: 24px; height: 24px; padding: 0; border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, .2); background: rgba(255, 255, 255, .75); color: #3f5f1a; font-size: 11px; line-height: 1;
  cursor: pointer; opacity: .7;
}
.cv-laufband-stopp:hover, .cv-laufband-stopp:focus-visible { opacity: 1; background: #fff; }
.cv-laufband.ist-angehalten *, .cv-laufband.ist-angehalten *::after { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .cv-laufband-stopp { display: none; } }

.cv-legende { display: flex; gap: .4rem; flex-wrap: wrap; margin: 1rem 0 .2rem; }
.cv-module { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .7rem; margin-top: .6rem; }
.cv-modul { background: #fff; border: 1px solid var(--ov-rand); border-radius: 12px; padding: .7rem .9rem; display: grid; gap: .35rem; align-content: start; }
.cv-modul.ist-gesperrt { opacity: .6; }
.cv-modul.ist-fertig { background: var(--ov-ok-hell); border-color: #b9dcc3; }
.cv-modul-kopf { display: flex; gap: .5rem; align-items: baseline; }
.cv-modul-kopf h3 { font-size: 1rem; }
.cv-modul-nr { font-size: .78rem; font-weight: 800; color: var(--ov-gruen-dunkel); background: var(--ov-gruen-hell); padding: 0 .45rem; border-radius: 4px; }
.cv-modul-info { margin: 0; font-size: .82rem; color: var(--ov-text-leise); }

/* ---------- Avatar und Shop ---------- */
.cv-shop { display: grid; grid-template-columns: 260px 1fr; gap: 1rem; align-items: start; margin-top: .5rem; }
.cv-vorschau {
  position: sticky; top: 3.5rem; background: #fff; border: 1px solid var(--ov-rand); border-radius: 12px;
  padding: 1rem; display: grid; gap: .6rem; justify-items: center;
}
.cv-vorschau-buehne {
  width: 100%; display: flex; align-items: flex-end; justify-content: center; gap: .3rem; padding: .5rem 0 0;
  background: linear-gradient(#e8f4ff 70%, #b7d98a 70%); border-radius: 10px;
}
.cv-vorschau-blick { display: flex; gap: .3rem; }
.cv-vorschau-blick button { border: 1px solid var(--ov-rand); background: #fff; border-radius: 999px; padding: .1rem .7rem; font-weight: 700; cursor: pointer; }
.cv-vorschau-blick button.ist-aktiv { background: var(--ov-gruen); border-color: var(--ov-gruen); color: #fff; }
.cv-vorschau-text { margin: 0; font-size: .8rem; color: var(--ov-text-leise); text-align: center; }
.cv-konto-gross { background: var(--ov-gruen-hell); color: var(--ov-gruen-dunkel); font-size: 1.1rem; }
.cv-slot-tabs { display: flex; gap: .3rem; flex-wrap: wrap; }
.cv-slot-tabs button, .cv-slot-tabs a { border: 1px solid var(--ov-rand); background: #fff; border-radius: 999px; padding: .2rem .8rem; font-weight: 700; cursor: pointer; color: var(--ov-text); }
.cv-slot-tabs a:hover { text-decoration: none; border-color: var(--ov-gruen); }
.cv-slot-tabs button.ist-aktiv, .cv-slot-tabs a.ist-aktiv { background: var(--ov-gruen); border-color: var(--ov-gruen); color: #fff; }
.cv-shop-rechts { display: grid; gap: .5rem; }
.cv-shop-rechts .ov-material { margin: 0; }
.cv-ware-bild { display: flex; justify-content: center; align-items: center; height: 78px; }
.cv-ware-leer { font-size: 2rem; color: var(--ov-text-leise); }
.cv-ware-gesperrt { background: #f7f7f2; }
.cv-ware-gesperrt .cv-ware-bild { filter: grayscale(.8); opacity: .6; }
.cv-gesperrt { font-size: .82rem; color: var(--ov-text-leise); font-weight: 700; }

/* ---------- Freigabe ---------- */
.cv-freigabe { display: flex; gap: 1rem; flex-wrap: wrap; align-items: flex-end; }
.cv-freigabe label { display: grid; gap: .2rem; font-weight: 600; font-size: .9rem; }
.cv-freigabe select { font: inherit; padding: .2rem .4rem; }
.cv-geraet { border: 1px solid var(--ov-rand); border-radius: 8px; padding: .2rem .7rem .4rem; display: flex; gap: .8rem; }
.cv-geraet legend { font-size: .82rem; font-weight: 700; color: var(--ov-text-leise); padding: 0 .3rem; }
.cv-geraet label { display: inline-flex; gap: .3rem; align-items: center; font-weight: 400; }
.cv-freigabe-meldung { color: var(--ov-ok); font-weight: 700; }
.cv-fortschritt-rahmen { overflow-x: auto; }
.cv-fortschritt { border-collapse: collapse; min-width: 420px; }
.cv-fortschritt th, .cv-fortschritt td { padding: .2rem .8rem; border-bottom: 1px solid var(--ov-rand); text-align: center; }
.cv-fortschritt th:first-child { text-align: left; }
.cv-fortschritt td.ist-erledigt { color: var(--ov-ok); font-weight: 800; }
.cv-fortschritt td.ist-aktuell { color: #b07d00; }
.cv-fortschritt td.ist-gesperrt { color: var(--ov-text-leise); }
.cv-fortschritt td.ist-begonnen { color: #b07d00; }
.cv-fortschritt td.ist-fehlt, .cv-fortschritt td.ist-offen { color: var(--ov-text-leise); }
.cv-fortschritt td.cv-geraten { color: #b07d00; font-weight: 700; cursor: help; }
.cv-geraten-liste { margin-top: .6rem; }
.cv-geraten-liste table { border-collapse: collapse; margin-top: .4rem; }
.cv-geraten-liste th, .cv-geraten-liste td { padding: .2rem .7rem; border-bottom: 1px solid var(--ov-rand); text-align: left; }
.cv-modul-wahl select { font: inherit; padding: .2rem .4rem; }
.ov-python-status.ist-fehler { color: var(--ov-fehler); }
.cv-body .ov-marke img { width: 30px; height: 30px; }

@media (max-width: 760px) {
  .cv-shop { grid-template-columns: 1fr; }
  .cv-vorschau { position: static; }
}

/* ---------- Aufgabe: Auswahl, Varianten, vereinfachter Modus, Tastatur ---------- */
.cv-weltwahl select { font: inherit; padding: .2rem .4rem; border: 1px solid var(--ov-rand); border-radius: 6px; max-width: 100%; }
.cv-variante-ok { color: var(--ov-ok); font-weight: 800; margin-left: .2rem; }
.cv-vereinfacht { margin-top: .4rem; display: grid; gap: .4rem; }
.cv-vereinfacht label { display: inline-flex; gap: .4rem; align-items: center; font-weight: 700; color: var(--ov-gruen-dunkel); cursor: pointer; }
.cv-vereinfacht small { font-weight: 400; color: var(--ov-text-leise); }
.cv-tastatur-hilfe { font-size: .8rem; color: var(--ov-text-leise); }
.cv-tastatur-hilfe kbd { font: .75rem Consolas, monospace; border: 1px solid var(--ov-rand); border-bottom-width: 2px; border-radius: 4px; padding: 0 4px; background: #fff; }
.cv-palette-hilfe { margin-top: .3rem; font-size: .82rem; }
.cv-palette-hilfe summary { cursor: pointer; color: var(--ov-gruen-dunkel); font-weight: 700; }
.cv-palette-hilfe[open] { display: grid; gap: .35rem; }

/* MINT- und Zusatz-Module */
.cv-zweig { font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: .05rem .45rem; border-radius: 4px; background: #e3ecfa; color: #2b4f8c; white-space: nowrap; }
.cv-zweig.ist-zusatz { background: #f3e8ff; color: #6b3fa0; }
.cv-modul-kopf .cv-zweig { margin-left: auto; }
.cv-mint-frei { font-size: .85rem; }

/* ---------- Heft ---------- */
.cv-heft-leiste { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin: .8rem 0 .5rem; }
.cv-heft-leiste select { font: inherit; padding: .2rem .4rem; }
.cv-heft-alles { font-size: .88rem; display: inline-flex; gap: .3rem; align-items: center; }
.cv-heft { max-width: 900px; margin: 0 auto 2rem; }
.cv-heft .ov-heft-rechts { margin-left: auto; }
.cv-info-titel { display: block; margin-bottom: .3rem; color: #2f4d7a; }
.ov-heft-info ul { padding-left: 1.2rem; margin: .3rem 0; }
.ov-heft-info .ov-heft-code { margin: .4rem 0; }
/* Haltepunkt: Hier endet der Einstieg, bis die Lehrkraft das Pflichtheft ganz freigibt */
.cv-haltepunkt.ist-wartend { border-left: 4px solid #d69e2e; background: #fff8e6; }
.cv-haltepunkt.ist-frei { opacity: .8; }
.cv-haltepunkt-warten { font-weight: 600; color: #8a5a00; margin: .4rem 0 0; }
.ov-heft-mc label code, .ov-heft-schritt code { background: var(--ov-gruen-zart); border: 1px solid var(--ov-rand); padding: 0 .25rem; border-radius: 4px; font-size: .92em; }
.cv-ordnen { display: flex; gap: 1rem; align-items: flex-start; flex-wrap: wrap; margin: .3rem 0; }
.cv-ordnen-liste { list-style: decimal; padding-left: 2rem; display: grid; gap: .25rem; min-width: 220px; }
.cv-ordnen-zeile { background: #fff; border: 1px solid var(--ov-rand); border-radius: 6px; padding: .15rem .3rem .15rem .55rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.cv-ordnen-zeile code { background: none !important; border: 0 !important; font: .9rem Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; white-space: pre; }
.cv-ordnen-knoepfe { display: inline-flex; gap: .2rem; }
.cv-ordnen-knoepfe button { width: 26px; height: 24px; border: 1px solid var(--ov-rand); background: var(--ov-gruen-zart); border-radius: 4px; cursor: pointer; font-size: .7rem; color: var(--ov-gruen-dunkel); }
.cv-ordnen-knoepfe button:disabled { opacity: .35; cursor: default; }
/* Tablet: Knoepfe gross genug fuer den Finger */
@media (pointer: coarse) { .cv-ordnen-knoepfe button { width: 34px; height: 32px; font-size: .8rem; } }
.cv-ordnen-vorschau { margin: 0; display: grid; justify-items: center; gap: .2rem; }
.cv-ordnen-vorschau svg { width: 200px; height: 150px; background: #fff; border: 1px solid var(--ov-rand); border-radius: 8px; }
.cv-ordnen-vorschau .cv-spur line { stroke: #1f2712; stroke-width: 2.5; stroke-linecap: round; }
.cv-ordnen-vorschau .cv-start { fill: var(--ov-gold); }
.cv-ordnen-vorschau figcaption { font-size: .78rem; color: var(--ov-text-leise); }
.cv-ordnen-zeile[draggable="true"] { cursor: grab; }
.cv-ordnen-zeile.ist-gezogen { opacity: .45; }
.cv-ordnen-hinweis { font-size: .85rem; color: var(--ov-text-leise); margin: .2rem 0; }
.cv-ordnen-ablage { min-width: 200px; border: 1px dashed var(--ov-rand); border-radius: 8px; padding: .4rem .6rem; background: #fbfaf5; }
.cv-ordnen-ablage small { display: block; color: var(--ov-text-leise); margin-bottom: .3rem; }
.cv-ordnen-ablage ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.cv-ordnen-ablage li { display: flex; justify-content: space-between; align-items: center; gap: .5rem; text-decoration: line-through; color: var(--ov-text-leise); }
.cv-ordnen-ablage li.cv-ordnen-leer { text-decoration: none; font-size: .82rem; }
.cv-ordnen-ablage button { border: 1px solid var(--ov-rand); background: var(--ov-gruen-zart); border-radius: 4px; cursor: pointer; }
/* Vorhersage (PRIMM): Code mit Zeilennummern, Ergebnis nach dem Ausfuehren */
.cv-code-nummern .cv-zn { display: inline-block; width: 2.2ch; margin-right: 1ch; color: var(--ov-text-leise); text-align: right; user-select: none; }
.cv-vorhersage-frage { margin: .4rem 0; }
.cv-vorhersage-frage .ov-heft-mc label.ist-richtig { background: #e6f4d9; border-radius: 6px; }
.cv-vorhersage-frage .ov-heft-mc label.ist-daneben { background: #fdecea; border-radius: 6px; }
.cv-vorhersage-ergebnis { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; margin: .4rem 0; }
.cv-vorhersage-konsole { margin: 0; }
.cv-vorhersage-konsole pre { background: #1f2712; color: #e8f5d0; padding: .5rem .8rem; border-radius: 8px; min-width: 200px; margin: 0; font: .9rem Consolas, monospace; }
.cv-vorhersage-konsole figcaption { font-size: .78rem; color: var(--ov-text-leise); }
.cv-vorhersage-vergleich { flex: 1 1 220px; margin: 0; font-weight: 600; }
.cv-vorhersage-fehler { color: #a3261b; margin: .2rem 0; }
.cv-linie-neu { opacity: 0; animation: cv-linie-erscheint .3s ease forwards; }
@keyframes cv-linie-erscheint { to { opacity: 1; } }
/* Tracetabelle (Variablenbelegungstabelle) */
.cv-trace-rahmen { overflow-x: auto; margin: .4rem 0; }
.cv-trace { border-collapse: collapse; font-size: .9rem; }
.cv-trace th, .cv-trace td { border: 1px solid var(--ov-rand); padding: .2rem .4rem; text-align: left; }
.cv-trace th { background: var(--ov-gruen-zart); }
.cv-trace td code { white-space: pre; }
.cv-trace-nr { color: var(--ov-text-leise); text-align: right !important; }
.cv-trace-leer { background: #f2f2ee; }
.cv-trace-feld { width: 7em !important; }
.cv-tafel td, .cv-tafel th { text-align: center !important; }
.cv-tafel-vorgabe { background: #f2f2ee; font-family: var(--ov-mono, monospace); }
.cv-tafel-ausdruck { min-width: 6em; }
.cv-tafel-feld { font: inherit; padding: .1rem .2rem; border: 1px solid var(--ov-rand); border-radius: 4px; }
.cv-tafel-feld.ist-ok { border-color: #2f855a; background: #f0fff4; }
.cv-tafel-feld.ist-falsch { border-color: #c53030; background: #fff5f5; }
.cv-zahl-hinweis { margin: .3rem .6rem; padding: .35rem .6rem; border-radius: 6px; font-size: .85rem;
  background: #fff7d6; border: 1px solid #e8c766; color: #5c4400; }
.ov-heftseite-nav .cv-merk-link { margin-left: 1rem; }
.ov-heftseite-nav .cv-heft-editor { display: inline-flex; margin: 0 0 0 1rem; }
.cv-heftuebersicht-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.cv-heftuebersicht-hinweis { font-size: .85rem; color: var(--ov-text-leise); margin: .3rem 0 0; }
.cv-heftuebersicht .ov-heft-inhalt h3 { margin: 1rem 0 .3rem; }
.cv-uebersicht-luecke { display: inline-block; min-width: 5em; border-bottom: 1.5px solid currentColor; font-weight: 700; text-align: center; }
.cv-uebersicht-luecke.ist-lang { min-width: 16em; }
/* Eingaben (input) in der Konsolenausgabe */
.cv-eingabe-wert { background: #fff3b0; color: #3d2f00; border-radius: 3px; padding: 0 .25em; outline: 1px dashed #c9a400; }
.cv-ausgabe .ist-eingabezeile::before { content: '⌨ '; opacity: .7; }
.cv-eingabe-legende { font-size: .75rem; color: #c9d4b8; margin: .25rem 0 0; }
/* Ordnen mit Probelauf in der Hoehle */
.cv-probe-liste { display: flex; flex-wrap: wrap; gap: .6rem; margin: .5rem 0; }
.cv-probe { margin: 0; flex: 1 1 260px; max-width: 360px; border: 2px solid var(--ov-rand); border-radius: 8px; overflow: hidden; background: #fff; }
.cv-probe.ist-ok { border-color: #2f855a; }
.cv-probe.ist-falsch { border-color: #c53030; }
.cv-probe svg { display: block; width: 100%; height: auto; }
.cv-probe figcaption { font-size: .85rem; padding: .3rem .5rem; }
/* Szenen: Reiter je Beispiel, Bedingungen als Schalter, Bild darunter */
.cv-sz { border: 1px solid var(--ov-rand); border-radius: 10px; background: #fff; overflow: hidden; margin: .4rem 0; }
.cv-sz-reiterleiste { display: flex; flex-wrap: wrap; background: var(--ov-gruen-zart); border-bottom: 1px solid var(--ov-rand); }
.cv-sz-reiter { font: inherit; font-weight: 700; padding: .4rem .8rem; border: 0; background: transparent; cursor: pointer; color: var(--ov-text-leise); }
.cv-sz-reiter.ist-aktiv { background: #fff; color: var(--ov-text); box-shadow: inset 0 -3px 0 var(--ov-gruen); }
.cv-sz-inhalt { padding: .5rem .7rem .6rem; }
.cv-sz-satz { font-size: 1.05rem; margin: .1rem 0 .3rem; line-height: 2; }
.cv-sz-op { color: #6b46c1; }
.cv-sz-schalter { font: inherit; font-weight: 700; padding: .1rem .6rem; border-radius: 999px; cursor: pointer;
  border: 2px solid #c53030; background: #fff5f5; color: #9b2c2c; }
.cv-sz-schalter.ist-an { border-color: #2f855a; background: #f0fff4; color: #22543d; }
/* Noch nie angeklickt: blinkt, damit klar ist, dass man hier klicken kann */
.cv-sz-reiter.ist-neu, .cv-sz-schalter.ist-neu { animation: cv-sz-blinken 1.2s ease-in-out infinite; }
@keyframes cv-sz-blinken {
  0%, 100% { box-shadow: 0 0 0 0 rgba(214, 158, 46, 0); }
  50% { box-shadow: 0 0 0 4px rgba(214, 158, 46, .75); background-color: #fffbea; }
}
@media (prefers-reduced-motion: reduce) {
  .cv-sz-reiter.ist-neu, .cv-sz-schalter.ist-neu { animation: none; box-shadow: 0 0 0 3px rgba(214, 158, 46, .75); }
}
.cv-sz-aktion { font-weight: 700; color: var(--ov-text-leise); text-decoration: line-through; }
.cv-sz-aktion.ist-an { color: #22543d; text-decoration: none; }
.cv-sz-code { margin: 0 0 .4rem; font-size: .9rem; }
.cv-sz-code .ist-wahr { color: #22543d; font-weight: 700; }
.cv-sz-code .ist-falsch { color: #9b2c2c; font-weight: 700; }
.cv-sz-bild { display: block; width: 100%; max-width: 480px; border-radius: 8px; border: 1px solid var(--ov-rand); }
.cv-sz-hinweis { font-size: .8rem; color: var(--ov-text-leise); margin: .3rem 0 0; }
/* Zuordnung: feste Knoepfe je Zeile, Unterstufen erscheinen nach der Wahl */
.cv-zu-titel { display: block; margin-bottom: .2rem; }
.cv-zu { list-style: none; margin: .4rem 0; padding: 0; display: grid; gap: .3rem; }
.cv-zu-zeile { display: grid; grid-template-columns: minmax(12rem, 1fr) auto; gap: .3rem .8rem; align-items: center;
  padding: .3rem .5rem; border: 1px solid var(--ov-rand); border-radius: 8px; background: #fff; }
.cv-zu-zeile.ist-ok { border-color: #2f855a; background: #f0fff4; }
.cv-zu-zeile.ist-falsch { border-color: #c53030; background: #fff5f5; }
.cv-zu-wahl { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; justify-content: flex-end; }
.cv-zu-gruppe { display: inline-flex; flex-wrap: wrap; gap: .2rem; }
.cv-zu-pfeil { color: var(--ov-text-leise); font-weight: 700; }
.cv-zu-option { font: inherit; font-size: .85rem; padding: .12rem .55rem; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--ov-rand); background: #fff; color: var(--ov-text); }
.cv-zu-option:hover:not(:disabled) { border-color: var(--ov-gruen); }
.cv-zu-option.ist-gewaehlt { background: var(--ov-gruen); border-color: var(--ov-gruen); color: #fff; font-weight: 700; }
.cv-zu-option:disabled { cursor: default; }
@media (max-width: 640px) { .cv-zu-zeile { grid-template-columns: 1fr; } .cv-zu-wahl { justify-content: flex-start; } }

/* ---------- Uebersicht: Module mit Heft-Kacheln und Vorschaubildern ---------- */
/* Kompakt: mehrere Module pro Zeile, je zwei kleine Heft-Kacheln (Pflicht, Zusatz) */
.cv-module-gross { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: .7rem; margin-top: .5rem; }
.cv-modul-gross { padding: .55rem .65rem .65rem; gap: .3rem; align-content: start; }
.cv-modul-gross .cv-modul-kopf h3 { font-size: .95rem; }
.cv-modul-gross .cv-modul-info { font-size: .75rem; margin: 0; }
.cv-heft-kacheln { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: .15rem; }
.cv-heft-kachel { display: grid; grid-template-rows: auto 1fr; background: #fff; border: 1px solid var(--ov-rand); border-radius: 10px;
  overflow: hidden; color: var(--ov-text); text-decoration: none; transition: transform .15s, box-shadow .15s; }
a.cv-heft-kachel:hover { text-decoration: none; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(60,80,0,.14); }
.cv-heft-thumb { position: relative; aspect-ratio: 16 / 9; border-bottom: 1px solid var(--ov-rand); overflow: hidden;
  display: grid; place-items: center; background: var(--ov-gruen-zart); color: var(--ov-text-leise); font-size: .85rem; }
.cv-heft-kachel-text { display: grid; gap: .1rem; padding: .3rem .45rem .4rem; align-content: start; }
.cv-heft-kachel-text b { font-size: .8rem; line-height: 1.25; }
.cv-heft-kachel-text .ov-phase { font-size: .62rem; }
.cv-heft-stand { display: flex; align-items: center; gap: .35rem; font-size: .7rem; color: var(--ov-text-leise); font-variant-numeric: tabular-nums; }
.cv-heft-stand .ov-heft-leiste { flex: 0 0 34px; }
.cv-heft-kachel.ist-erledigt { background: var(--ov-ok-hell); border-color: #b9dcc3; }
.cv-heft-kachel.ist-erledigt .cv-heft-stand { color: var(--ov-ok); font-weight: 700; }
.cv-heft-kachel.ist-aktuell { border-color: var(--ov-gold); box-shadow: 0 0 0 2px rgba(214,158,46,.35); }
.cv-heft-kachel.ist-aktuell .cv-heft-stand { color: #7a5200; font-weight: 700; }
.cv-heft-kachel.ist-gesperrt .ov-thumb { filter: grayscale(1) brightness(.9); opacity: .55; }
.cv-heft-kachel.ist-fehlt { border-style: dashed; background: transparent; }
.cv-heft-kachel.ist-fehlt .cv-heft-thumb { background: transparent; }
@media (prefers-reduced-motion: reduce) { .cv-heft-kachel, a.cv-heft-kachel:hover { transition: none; transform: none; } }

/* Aufgabe geloest: oben ueber der Aufgabe, gross */
.cv-fertig { margin: 0 0 .7rem; padding: .8rem 1rem; }
.cv-fertig strong { font-size: 1.3rem; }
.cv-fertig .ov-belohnung { font-size: .9rem; }
a.ov-auftrag-weiter { display: inline-block; text-decoration: none; }
a.ov-auftrag-weiter:hover { color: #fff; text-decoration: none; }
/* Raster-Welt und Sprachwahl der Befehle */
.cv-raster { background: #2a2333; }
.cv-sprachwahl { margin: .6rem 0 .2rem; font-size: .85rem; display: flex; gap: .3rem; align-items: center; flex-wrap: wrap; }
.cv-sprachwahl button { border: 1px solid var(--ov-rand); background: #fff; border-radius: 6px; padding: .1rem .5rem; cursor: pointer; font-size: .8rem; }
.cv-sprachwahl button.ist-aktiv { background: var(--ov-gruen-zart); border-color: var(--ov-gruen); font-weight: 700; }

/* input() in der Konsole: Antwort eintippen, Enter */
.cv-eingabezeile { display: flex; align-items: center; gap: .4rem; padding: .3rem .5rem; background: #0f172a; color: #dbeafe;
  font-family: Consolas, 'Cascadia Code', ui-monospace, Menlo, monospace; font-size: .9rem; border-top: 1px dashed #4a5568; }
.cv-eingabezeile label { white-space: nowrap; color: #fbd38d; }
.cv-eingabezeile input { flex: 1; min-width: 6em; background: #1a2333; color: #fff; border: 1px solid #f6ad55; border-radius: 4px;
  padding: .2rem .4rem; font: inherit; }
.cv-eingabezeile input:focus { outline: 2px solid #f6ad55; }

/* Funktionstests (M16): Aufruf, erwarteter und gelieferter Wert */
.cv-funktionstests td.ist-ok { background: #f0fff4; }
.cv-funktionstests td.ist-falsch { background: #fff5f5; }

/* Listen in der Variablen-Ansicht (M17): Kaestchen mit Index */
.cv-liste { display: flex; flex-wrap: wrap; gap: 2px; }
.cv-liste-zelle { display: inline-flex; flex-direction: column; align-items: center; min-width: 2.2em; padding: 0 .25rem .1rem;
  border: 1px solid var(--ov-rand); border-radius: 3px; background: #fff; }
.cv-liste-zelle small { font-size: .65rem; color: var(--ov-text-leise); border-bottom: 1px dotted var(--ov-rand); width: 100%; text-align: center; }
.cv-liste-zelle.ist-neu { background: #fff7d6; }
.cv-liste-leer { color: var(--ov-text-leise); font-style: italic; }

/* Calliope live (Spielwiese): Tasten klickbar, Temperatur-Regler */
.cv-live { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; font-size: .85rem; margin: .3rem 0; }
.cv-live-hinweis { color: var(--ov-text-leise); }
.cv-live-temp { display: inline-flex; align-items: center; gap: .35rem; }
.cv-live-temp input { width: 9rem; }
.cv-calliope .cv-taste { cursor: pointer; }

/* Kleiner Knopf, z. B. "Nochmal abspielen" bei Vorhersagen */
.ov-heft-knopf.ist-klein { font-size: .8rem; padding: .15rem .55rem; background: #fff; color: var(--ov-gruen-dunkel); border: 1px solid var(--ov-rand); }

/* Pflichtheft abgeschlossen: Hinweis mit den Heft-Coins */
.cv-heft-geschafft { position: fixed; left: 50%; bottom: 1.5rem; transform: translateX(-50%); z-index: 70; background: #fff;
  border: 2px solid var(--ov-ok, #2f855a); border-radius: 12px; padding: .7rem 1.2rem; box-shadow: 0 10px 30px rgba(0,0,0,.18);
  display: flex; gap: .7rem; align-items: center; font-size: 1.05rem; }

/* Uebersicht: grosse Banner fuer Klasse 8 und Klasse 10 */
.cv-klassen-banner { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; margin: 1.6rem 0 .6rem;
  padding: .8rem 1.2rem; border-radius: 12px; color: #fff; }
.cv-klassen-banner h2 { margin: 0; font-size: 1.9rem; letter-spacing: .02em; color: #fff; }
.cv-klassen-banner span { font-size: .95rem; opacity: .92; }
.cv-klassen-banner.ist-k8 { background: linear-gradient(90deg, #3f6d12, #6a9a2a); }
.cv-klassen-banner.ist-k10 { background: linear-gradient(90deg, #1f4f8f, #3a7bc8); }

/* Wo bin ich? Aktuelles Modul deutlich, fertige Hefte gruen, angefangene Zusatzhefte leicht */
.cv-modul-gross { position: relative; }
.cv-modul-gross.ist-aktuell { border: 3px solid var(--ov-gold, #d69e2e); box-shadow: 0 0 0 4px rgba(214,158,46,.25), 0 8px 24px rgba(120,80,0,.15); }
.cv-hier-bist-du { position: absolute; top: -.75rem; right: .8rem; background: var(--ov-gold, #d69e2e); color: #fff; font-weight: 800;
  font-size: .78rem; padding: .15rem .6rem; border-radius: 999px; box-shadow: 0 2px 6px rgba(0,0,0,.15); }
.cv-heft-kachel.ist-erledigt { border: 2px solid #2f855a; }
.cv-heft-kachel.ist-teilweise { border: 2px dashed #9ae6b4; }
.cv-modul-gross.ist-fertig { border-color: #9ae6b4; }

/* Parsons mit Vorschau: Ziel und letzter Test nebeneinander */
.cv-ordnen-bilder { display: flex; flex-wrap: wrap; gap: .8rem; margin: .5rem 0; }
.cv-ordnen-vorschau.ist-fehler { color: #c53030; font-size: .85rem; max-width: 16rem; }
.ov-heft-knopf[data-sperre]:disabled { opacity: .6; cursor: wait; }

/* Tastaturmodus: die Buehne hat den Fokus und nimmt die Pfeiltasten an */
.cv-buehne:focus { outline: 3px solid #f6ad55; outline-offset: 2px; }

/* Tastatur-Spielwiese: Startknopf hervorheben, Timer, Steuerkreuz ohne Tastatur */
.cv-tastatur-start { font-size: 1.05rem; font-weight: 700; padding: .45rem 1rem; }
.cv-tastatur-start.ist-hervor { background: #fff7d6; border: 2px solid var(--ov-gold, #d69e2e); color: #7a5200;
  animation: cv-pulsieren 1.6s ease-in-out infinite; }
@keyframes cv-pulsieren { 0%, 100% { box-shadow: 0 0 0 0 rgba(214,158,46,.55); } 50% { box-shadow: 0 0 0 8px rgba(214,158,46,0); } }
@media (prefers-reduced-motion: reduce) { .cv-tastatur-start.ist-hervor { animation: none; } }
.cv-tastatur-timer { font-weight: 700; color: #7a5200; font-variant-numeric: tabular-nums; }
.cv-tastatur-hilfe { margin: .3rem 0 0; font-size: .85rem; color: var(--ov-text-leise); }
.cv-steuerkreuz { display: grid; grid-template-columns: repeat(3, 3.2rem); grid-template-areas: ". hoch ." "links runter rechts" "stift stift stift";
  gap: .3rem; margin-top: .5rem; }
.cv-steuerkreuz button { font-size: 1.3rem; height: 3rem; border: 1px solid var(--ov-rand); border-radius: 8px; background: #fff; cursor: pointer; }
.cv-steuerkreuz button:active { background: var(--ov-gruen-zart); }
.cv-steuerkreuz [data-taste="ArrowUp"] { grid-area: hoch; }
.cv-steuerkreuz [data-taste="ArrowLeft"] { grid-area: links; }
.cv-steuerkreuz [data-taste="ArrowDown"] { grid-area: runter; }
.cv-steuerkreuz [data-taste="ArrowRight"] { grid-area: rechts; }
.cv-steuerkreuz .ist-breit { grid-area: stift; font-size: .9rem; }

/* Lehrkraft: ein Heft mit dem Stand der Klasse oder den Antworten eines Schuelers (lehrer_heft.html) */
.cv-lk-nav { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.cv-lk-blatt { max-width: 860px; margin: .6rem auto 2rem; padding: 1.2rem 1.6rem; background: #fff; border: 1px solid var(--ov-rand);
  border-radius: 12px; line-height: 1.5; }
.cv-lk-kopf { display: flex; justify-content: space-between; color: var(--ov-text-leise); font-size: .85rem;
  border-bottom: 1px solid var(--ov-rand); padding-bottom: .3rem; }
.cv-lk-blatt h1 { margin: .6rem 0 .4rem; }
.cv-lk-blatt h2 { margin: 1.4rem 0 .4rem; font-size: 1.15rem; color: var(--ov-gruen-dunkel); }
.cv-lk-schritt { margin: .5rem 0 .9rem; }
.cv-lk-schritt.ist-jetzt { border-left: 4px solid var(--ov-gruen); padding-left: .7rem; }
.cv-lk-marke { margin: 0 0 .2rem; color: var(--ov-gruen-dunkel); font-weight: 700; }
.cv-lk-teil { display: flex; gap: .5rem; }
.cv-lk-teil > div > :first-child { margin-top: 0; }
.cv-lk-info, .cv-lk-merke, .cv-lk-halt { border-radius: 8px; padding: .5rem .8rem; }
.cv-lk-info { border: 1.5px solid #2f4d7a; background: #f3f6fb; }
.cv-lk-merke { border: 1.5px solid var(--ov-gruen); background: var(--ov-gruen-zart); }
.cv-lk-halt { border: 1.5px dashed var(--ov-warnung); background: var(--ov-warnung-hell); }
.cv-lk-info > b, .cv-lk-merke > b, .cv-lk-halt > b { display: block; }
.cv-lk-luecke { display: inline-block; min-width: 4rem; border-bottom: 1.5px solid var(--ov-text-leise); padding: 0 .3rem; }
.cv-lk-luecke.ist-lang { min-width: 12rem; }
.cv-lk-luecke.ist-richtig, .cv-lk-tabelle .ist-richtig, .cv-lk-optionen .ist-richtig { background: var(--ov-ok-hell); color: var(--ov-ok); }
.cv-lk-luecke.ist-falsch, .cv-lk-tabelle .ist-falsch, .cv-lk-optionen .ist-falsch { background: var(--ov-fehler-hell); color: var(--ov-fehler); }
.cv-lk-luecke.ist-loesung, .cv-lk-tabelle .ist-loesung { background: #eef3fb; color: #2f4d7a; }
.cv-lk-code { background: #f6f7f2; border: 1px solid var(--ov-rand); border-radius: 6px; padding: .4rem .6rem; margin: .3rem 0;
  font: .88rem/1.45 Consolas, 'DejaVu Sans Mono', monospace; white-space: pre-wrap; }
.cv-lk-optionen { list-style: none; padding-left: .3rem; margin: .3rem 0; }
.cv-lk-optionen li { padding: .1rem .4rem; border-radius: 4px; }
.cv-lk-antwort { border-left: 3px solid var(--ov-gruen); background: var(--ov-flaeche); padding: .3rem .6rem; white-space: pre-wrap; }
.cv-lk-leer { color: var(--ov-text-leise); font-style: italic; }
.cv-lk-leise { color: var(--ov-text-leise); font-size: .88rem; margin: .2rem 0; }
.cv-lk-tabelle { border-collapse: collapse; margin: .3rem 0; font-size: .9rem; }
.cv-lk-tabelle th, .cv-lk-tabelle td { border: 1px solid var(--ov-rand); padding: .15rem .5rem; text-align: center; }
.cv-lk-stufen { list-style: none; padding: 0; margin: .3rem 0; display: grid; gap: .25rem; }
.cv-lk-stufen > li { display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; }
.cv-lk-stufen > li > span { min-width: 16rem; }
.cv-lk-stufen-code { display: block !important; }
.cv-lk-stand, .cv-lk-aufgabe, .cv-lk-gesamt { display: flex; gap: .8rem; align-items: flex-start; flex-wrap: wrap; margin: .3rem 0; }
.cv-lk-stand small { color: var(--ov-text-leise); padding-top: .15rem; }
.cv-lk-balken summary { display: flex; gap: .5rem; align-items: center; cursor: pointer; list-style: none; }
.cv-lk-balken summary::-webkit-details-marker { display: none; }
.cv-lk-leiste { display: inline-block; width: 140px; height: .6rem; border-radius: 4px; background: var(--ov-gruen-hell); overflow: hidden; }
.cv-lk-leiste i { display: block; height: 100%; background: var(--ov-gruen); }
.cv-lk-zahl { font-size: .85rem; color: var(--ov-text-leise); }
.cv-lk-namen { font-size: .85rem; max-width: 600px; }
.cv-lk-namen p { margin: .2rem 0; }
.cv-lk-info ul, .cv-lk-merke ul, .cv-lk-teil ul { padding-left: 1.3rem; }

/* ---------------------------------------------------------------- Blockmodus (cv-blockeditor.js, cv-blockcode-core.js) */
.cv-editor-wahl { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; padding-bottom: .4rem; margin-left: auto; }
.cv-umschalter { display: inline-flex; border: 1px solid #4b5a86; border-radius: 7px; overflow: hidden; }
.cv-umschalter button, .cv-alle-bloecke { border: 0; background: #1d2a4d; color: #cbd5f5; padding: .15rem .6rem; font-size: .8rem; cursor: pointer; }
.cv-umschalter button + button { border-left: 1px solid #4b5a86; }
.cv-umschalter button.ist-aktiv { background: #86efac; color: #0b1a33; font-weight: 700; }
.cv-alle-bloecke { border: 1px solid #4b5a86; border-radius: 7px; }
.cv-alle-bloecke.ist-aktiv { background: #fde68a; color: #3b2a00; font-weight: 700; }
.cv-editor-notiz { color: #cbd5f5; font-size: .78rem; font-style: italic; }
.cv-blockbereich { flex: 1; position: relative; min-height: 420px; display: flex; border-top: 1px solid #1d2a4d; background: #fff; }
.cv-blockeditor { flex: 1; min-width: 0; }
.cv-blockbereich[hidden], .ov-editor[hidden] { display: none; }
/* Variablen unter der Blockleiste: zugeklappt nur der Kopf, offen hoechstens ein Drittel der Hoehe */
.cv-blockvariablen { position: absolute; left: 0; bottom: 0; z-index: 40; background: var(--ov-gruen-zart); border-top: 1px solid var(--ov-rand);
  border-right: 1px solid var(--ov-rand); max-height: 40%; display: flex; flex-direction: column; box-shadow: 0 -2px 6px rgba(0, 0, 0, .08); }
.cv-blockvariablen[hidden] { display: none; }
.cv-blockvariablen .ov-palette-abschnitt { min-height: 0; flex: 1 1 auto; }
.cv-blockvariablen .ov-palette-liste { overflow: auto; }
/* Blockmodus wie beim JwInf: Aufgabe und Welt links, rechts Blockleiste und Programm - ohne mittlere Spalte */
.cv-level .ov-arbeitsbereich.ist-blockmodus { grid-template-columns: minmax(340px, 1fr) minmax(560px, 1.45fr); }
.cv-level .ist-blockmodus .ov-palette { display: none; }
.cv-level .ist-blockmodus .ov-datei-tabs { display: none; }
.cv-level .ist-blockmodus .ov-shell { flex: 0 0 auto; height: auto; min-height: 0; }
.cv-level .ist-blockmodus .ov-konsole { min-height: 3.2rem; max-height: 7.5rem; }
.cv-level .ohne-ausgabe .ov-shell-reiter, .cv-level .ohne-ausgabe #cv-konsole { display: none; }
.cv-level .ohne-ausgabe .ov-shell { border-top: 0; }
@media (min-width: 981px) and (max-width: 1180px) {
  .cv-level .ov-arbeitsbereich.ist-blockmodus { grid-template-columns: minmax(300px, .85fr) minmax(480px, 1.3fr); }
}
@media (max-width: 980px) {
  .cv-level .ov-arbeitsbereich.ist-blockmodus { grid-template-columns: 1fr; }
  .cv-level .ist-blockmodus .cv-blockbereich { min-height: 60vh; }
}
.cv-block-hinweis { line-height: 1.4; }

/* Nur-Lese-Bloecke im Heft und in Tipps: Farben aus --cvb-farbe */
.cvb-anzeige { margin: .5rem 0; overflow-x: auto; }
.cvb-programm { display: inline-flex; flex-direction: column; gap: 2px; padding: .35rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; }
.cvb-block { --cvb-farbe: #7a8ca6; background: var(--cvb-farbe); color: #fff; border-radius: 6px; font: 600 .86rem/1.35 system-ui, sans-serif; width: max-content; min-width: 4rem; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .18); }
.cvb-kopf { display: flex; gap: .3rem; align-items: center; flex-wrap: wrap; padding: .25rem .55rem; }
.cvb-rumpf { margin-left: .9rem; padding: 2px 0 2px 2px; background: #f8fafc; display: flex; flex-direction: column; gap: 2px; min-height: 1.1rem; border-radius: 0 4px 4px 0; }
.cvb-fuss { height: .55rem; }
.cvb-offen .cvb-kopf { padding-bottom: .4rem; }
.cvb-wert { --cvb-farbe: #7a8ca6; display: inline-flex; gap: .25rem; align-items: center; background: var(--cvb-farbe); color: #fff; border-radius: 999px; padding: .05rem .45rem; border: 1px solid rgba(0, 0, 0, .15); }
.cvb-literal { background: #fff; color: #1f2937; }
.cvb-leer { min-width: 1.6rem; min-height: 1rem; background: rgba(255, 255, 255, .45); }
.cvb-feld { font-family: Consolas, 'Cascadia Code', ui-monospace, monospace; font-weight: 600; }
.cvb-kommentar .cvb-feld { font-family: inherit; font-style: italic; }
.cvb-notiz { font-weight: 400; font-style: italic; opacity: .9; margin-left: .4rem; }
.cvb-inline { --cvb-farbe: #7a8ca6; display: inline-flex; gap: .25rem; align-items: center; background: var(--cvb-farbe); color: #fff; border-radius: 5px; padding: 0 .4rem; font: 600 .85em/1.5 system-ui, sans-serif; vertical-align: baseline; }
.cvb-inline.cvb-wert { border-radius: 999px; }
.cvb-zeile { display: inline-block; }
.cv-ordnen-zeile .cvb-block { min-width: 0; }
.cv-lk-modus { display: inline-block; font-size: .78rem; background: #fef3c7; color: #78350f; border-radius: 5px; padding: .05rem .45rem; margin: 0 0 .3rem; }

/* Shop: Plaetze der Deko im Banner */
.cv-deko-plaetze { margin: .2rem 0 .8rem; }
.cv-deko-plaetze p { margin: 0 0 .35rem; font-size: .9rem; }
.cv-deko-reihe { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: .45rem; }
.cv-deko-platz { position: relative; }
.cv-deko-platz [data-platz] { width: 100%; height: 76px; display: flex; align-items: flex-end; justify-content: center; padding: 4px;
  background: #f4f7ea; border: 2px dashed #c9d3a8; border-radius: 10px; cursor: pointer; position: relative; }
.cv-deko-platz [data-platz] svg { width: 56px; height: 56px; }
.cv-deko-platz.ist-aktiv [data-platz] { border: 2px solid #7f9a0f; background: #eef5d3; box-shadow: 0 0 0 3px rgba(127, 154, 15, .2); }
.cv-deko-frei { align-self: center; color: #8a9470; font-size: .85rem; }
.cv-deko-nr { position: absolute; top: 3px; left: 6px; font: 700 .75rem/1 system-ui, sans-serif; color: #5d6b2a; }
.cv-deko-weg { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px; border-radius: 50%; border: 1px solid #b9c29a;
  background: #fff; color: #7a2a2a; font-weight: 700; line-height: 1; cursor: pointer; padding: 0; }
.cv-deko-weg:hover { background: #fde8e8; }

/* ProgVenture ist noch in Entwicklung: Alpha-Marke am Namen (Navigation, Aufgabenkopf, Info-Kasten der Uebersicht) */
.cv-alpha { display: inline-block; padding: .08rem .42rem; border-radius: 999px; background: #f59e0b; color: #3b2300;
  font: 800 .62rem/1.3 system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }

/* Uebersicht: Kaesten fuer Vorbereitung (Probe-SUe) und laufende Tests - auch ohne cv-probe.css */
.cv-probe-kasten { display: block; margin: .8rem 0 0; padding: .8rem 1rem; border-radius: 10px; border: 2px solid #7c5cbf;
  background: #f4f0fb; color: inherit; text-decoration: none; }
.cv-probe-kasten b { display: block; font-size: 1.1rem; }
.cv-probe-kasten:hover { background: #ebe4f8; text-decoration: none; }
.cv-test-kasten { border-color: #7f9a0f; background: #f2f8e1; }
.cv-test-kasten:hover { background: #e8f2cc; }
/* SUe-Seite der Lehrkraft: Knopf "Als Test im SEB schreiben lassen" */
.cv-test-link button { font: inherit; cursor: pointer; }

/* Geplante Unterrichtsstunde (Freigabe -> "Unterrichtsstunde planen") */
.cv-stunde-banner { margin: .8rem 0 0; padding: .8rem 1rem; border-radius: 10px; border: 3px solid #2b6cb0; background: #ebf4ff; }
.cv-stunde-banner.ist-laufend { box-shadow: 0 0 0 4px rgba(43,108,176,.2); }
.cv-stunde-banner b { display: block; font-size: 1.1rem; color: #1a4e85; }
.cv-stunde-banner ul { margin: .4rem 0 0; padding-left: 0; list-style: none; display: grid; gap: .2rem; }
.cv-stunde-banner li.ist-fertig { color: #2f855a; text-decoration: line-through; }
.cv-modul-gross.ist-geplant { border: 3px solid #2b6cb0; box-shadow: 0 0 0 5px rgba(43,108,176,.25), 0 8px 24px rgba(20,60,110,.18); }
.cv-jetzt-bearbeiten { background: #2b6cb0; }
.cv-heft-kachel.ist-geplant { border-color: #2b6cb0; box-shadow: 0 0 0 3px rgba(43,108,176,.35); }
.cv-stunde h3 { margin: 1rem 0 .3rem; font-size: 1rem; }
.cv-stunde-termin select, .cv-stunde-termin input { width: auto; }
.cv-stunde-andere { display: inline-flex; gap: .4rem; flex-wrap: wrap; }
.cv-stunde-andere[hidden] { display: none; }
.cv-stunde-module select { width: auto; }
.cv-stunde-liste { list-style: none; padding: 0; margin: 0; display: grid; gap: .3rem; }
.cv-stunde-liste li.ist-laufend { font-weight: 600; }
.cv-stunde-loeschen { margin-left: .4rem; font-size: .8rem; padding: .1rem .5rem; border-radius: 6px; border: 1px solid var(--ov-rand); background: #fff; cursor: pointer; }

/* ================================================================ Uebersicht: Abschnitte, Karten, Lernpfad, Liste */
.cvu-ansichten { display: flex; flex-wrap: wrap; gap: .3rem .6rem; align-items: center; margin: .9rem 0 0; font-size: .9rem; }
.cvu-ansichten a { padding: .2rem .7rem; border-radius: 999px; border: 1px solid var(--ov-rand); text-decoration: none; }
.cvu-ansichten a.ist-aktiv { background: var(--ov-gruen, #4b7f1f); border-color: transparent; color: #fff; font-weight: 700; }
.cvu-ansichten small { color: var(--ov-text-leise); }
.cvu-legende-extra { color: #2f4d7a; font-weight: 800; }
.cvk-bild { width: 100%; height: 100%; display: block; color: #2c3320; }
.cvu-bild { position: relative; aspect-ratio: 16 / 9; max-width: 100%; background: #fffdf6; border-radius: 8px; padding: .3rem; }
.cvu-bild .ov-schloss { inset: .2rem .3rem auto auto; display: block; font-size: 1rem; }
.cvu-stand .ov-heft-leiste, .cvu-zeile-stand .ov-heft-leiste { display: block; max-width: none; }
.cvu-zeile-stand { display: grid; }
.cvu-status { font-size: .8rem; color: var(--ov-text-leise); }
.cvu-aktuell .cvu-status { color: #7a5200; font-weight: 700; }
.cvu-erledigt .cvu-status { color: var(--ov-ok, #2f855a); font-weight: 700; }
.cvu-kopf { display: flex; gap: .4rem; align-items: center; }
.cvu-info { margin: 0; font-size: .78rem; color: var(--ov-text-leise); }
.cvu-stand { display: grid; gap: .2rem; }
.cvu-extras { display: grid; gap: .3rem; }
.ov-modul-knopf.ist-geplant { border: 2px solid #2b6cb0; }

/* Abschnitte (einklappbar) */
.cvu-teil { margin-top: .9rem; border: 1px solid var(--ov-rand); border-radius: 12px; background: var(--ov-karte, #fff); }
.cvu-teil > summary, .cvu-teil > header { list-style: none; cursor: pointer; padding: .6rem 1rem; display: flex; flex-wrap: wrap; gap: .2rem .9rem; align-items: center; }
.cvu-teil > header { cursor: default; border-bottom: 1px solid var(--ov-rand); }
.cvu-teil > summary::-webkit-details-marker { display: none; }
.cvu-teil h3 { margin: 0; font-size: 1.15rem; }
.cvu-wozu { flex: 1 1 16rem; min-width: 0; color: var(--ov-text-leise); font-size: .88rem; }
.cvu-pfeil { transition: transform .2s; display: inline-block; }
.cvu-teil[open] > summary .cvu-pfeil { transform: rotate(90deg); }
.cvu-punkte { display: inline-flex; gap: 3px; }
.cvu-punkte i { width: 9px; height: 9px; border-radius: 50%; background: var(--ov-rand); display: block; }
.cvu-punkte i.cvu-erledigt { background: var(--ov-gruen, #4b7f1f); }
.cvu-punkte i.cvu-aktuell { background: var(--ov-gold, #d69e2e); }
.cvu-zahl { font-size: .82rem; font-weight: 700; color: var(--ov-text-leise); font-variant-numeric: tabular-nums; }

/* Karten */
.cvu-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: .9rem .7rem; padding: .3rem 1rem 1rem; }
.cvu-gruppe { grid-column: 1 / -1; border: 2px dashed var(--ov-rand); border-radius: 10px; padding: .4rem 0 0; }
.cvu-gruppe > b { padding: 0 .7rem; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ov-text-leise); }
.cvu-gruppe .cvu-karten { padding: .5rem .7rem .7rem; }
.cvu-karte { position: relative; display: grid; gap: .4rem; align-content: start; padding: .55rem; border: 1px solid var(--ov-rand); border-radius: 10px; background: #fbf9f1; min-width: 0; }
.cvu-karte-haupt { display: grid; gap: .3rem; color: inherit; text-decoration: none; }
a.cvu-karte-haupt:hover h4 { text-decoration: underline; }
.cvu-karte h4, .cvu-gross h4 { margin: 0; font-size: .98rem; line-height: 1.2; }
.cvu-karte.cvu-aktuell { border: 3px solid var(--ov-gold, #d69e2e); background: #fff7d6; }
.cvu-karte.cvu-erledigt { border-color: #9ae6b4; }
.cvu-karte.ist-geplant, .cvu-gross.ist-geplant { border: 3px solid #2b6cb0; background: #ebf4ff; box-shadow: 0 0 0 4px rgba(43,108,176,.18); }
.cvu-karte.ist-gesperrt .cvu-karte-haupt { opacity: .55; }
.cvu-karte .cv-hier-bist-du, .cvu-gross .cv-hier-bist-du { top: -.7rem; }

/* Projektwerkstatt ausserhalb des Wegs */
.cvu-werkstatt { margin-top: .9rem; display: flex; flex-wrap: wrap; gap: .7rem 1rem; align-items: center; padding: .7rem 1rem; border: 2px solid var(--ov-gold, #d69e2e); border-radius: 12px; background: #fffaf0; }
.cvu-werkstatt .cvu-bild { width: 96px; flex: none; }
.cvu-werkstatt-text { flex: 1 1 16rem; min-width: 0; }
.cvu-werkstatt h3 { margin: 0; font-size: 1.1rem; }
.cvu-werkstatt p { margin: 0; font-size: .88rem; color: var(--ov-text-leise); }
.cvu-los { display: inline-block; justify-self: start; background: var(--ov-gold, #d69e2e); color: #fff; font-weight: 800; padding: .4rem 1rem; border-radius: 999px; text-decoration: none; }
.cvu-los:hover { text-decoration: none; filter: brightness(1.05); }
.ist-geplant .cvu-los { background: #2b6cb0; }

/* Lernpfad */
.cvu-weg { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; gap: .3rem; }
.cvu-etappe { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: .8rem; position: relative; }
.cvu-etappe::before { content: ""; position: absolute; left: calc(1.1rem - 2px); top: 2.4rem; bottom: -.3rem; width: 4px; border-radius: 2px; background: var(--ov-rand); }
.cvu-etappe:last-child::before { display: none; }
.cvu-etappe-nr { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; background: var(--ov-rand); color: var(--ov-text-leise); font-weight: 800; z-index: 1; }
.cvu-etappe.ist-fertig .cvu-etappe-nr, .cvu-etappe.ist-jetzt .cvu-etappe-nr { background: var(--ov-gruen, #4b7f1f); color: #fff; }
.cvu-etappe-inhalt { padding-bottom: .9rem; min-width: 0; }
.cvu-etappe-kopf { display: flex; flex-wrap: wrap; gap: .2rem .9rem; align-items: center; min-height: 2.2rem; }
.cvu-etappe-kopf h3 { margin: 0; font-size: 1.2rem; }
.cvu-stationen { display: flex; flex-wrap: wrap; gap: .45rem; padding: .5rem 0 0; }
.cvu-stationen:empty { display: none; }
.cvu-gruppe-marke { align-self: center; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ov-text-leise); }
.cvu-station { display: inline-flex; gap: .4rem; align-items: center; padding: .25rem .65rem .25rem .3rem; border-radius: 999px; border: 1px solid var(--ov-rand); background: #fbf9f1; font-size: .86rem; color: inherit; text-decoration: none; }
a.cvu-station:hover { border-color: var(--ov-gruen, #4b7f1f); text-decoration: none; }
.cvu-punkt { width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font-size: .66rem; font-weight: 800;
  background: conic-gradient(var(--ov-gruen, #4b7f1f) var(--stand), var(--ov-rand) 0); color: #fff; }
.cvu-station.cvu-erledigt .cvu-punkt { background: var(--ov-gruen, #4b7f1f); }
.cvu-station.ist-gesperrt { opacity: .55; }
.cvu-station.ist-geplant { border: 2px solid #2b6cb0; background: #ebf4ff; }
.cvu-stern { color: #2f4d7a; font-weight: 800; font-size: .78rem; }
.cvu-gross { position: relative; display: grid; grid-template-columns: minmax(0, 230px) minmax(0, 1fr); gap: 1rem; align-items: start; margin: .6rem 0 .2rem;
  padding: .9rem; border: 3px solid var(--ov-gold, #d69e2e); border-radius: 14px; background: #fff7d6; }
.cvu-gross-text { display: grid; gap: .4rem; min-width: 0; }
@media (max-width: 560px) { .cvu-gross { grid-template-columns: 1fr; } }

/* Fokus und Liste */
.cvu-fokus { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: .9rem; align-items: start; margin-top: .9rem; }
.cvu-fokus .cvu-gross { margin: 0; }
@media (max-width: 820px) { .cvu-fokus { grid-template-columns: 1fr; } }
.cvu-angefangen { display: grid; gap: .35rem; padding: .7rem 1rem; border: 1px solid var(--ov-rand); border-radius: 12px; background: var(--ov-karte, #fff); }
.cvu-angefangen > b { font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ov-text-leise); }
.cvu-angefangen a { display: flex; gap: .4rem; align-items: center; text-decoration: none; color: inherit; }
.cvu-angefangen small { margin-left: auto; color: var(--ov-text-leise); }
.cvu-liste { overflow: hidden; }
.cvu-zeile { display: grid; grid-template-columns: 3.1rem minmax(0, 1fr) minmax(60px, 130px) minmax(0, 220px); gap: .4rem .8rem; align-items: center;
  padding: .4rem 1rem; border-top: 1px solid var(--ov-rand); }
.cvu-zeile:first-of-type { border-top: 0; }
.cvu-zeile-titel { display: grid; min-width: 0; color: inherit; text-decoration: none; }
a.cvu-zeile-titel:hover b { text-decoration: underline; }
.cvu-zeile-titel small { color: var(--ov-text-leise); font-size: .78rem; }
.cvu-zeile.cvu-aktuell { background: #fff7d6; }
.cvu-zeile.ist-geplant { background: #ebf4ff; box-shadow: inset 4px 0 0 #2b6cb0; }
.cvu-zeile.ist-gesperrt .cvu-zeile-titel { opacity: .55; }
.cvu-zeile .cvu-extras { min-width: 0; }
.cvu-unter { padding: .35rem 1rem .1rem; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ov-text-leise); border-top: 1px solid var(--ov-rand); }
@media (max-width: 640px) {
  .cvu-zeile { grid-template-columns: 2.8rem minmax(0, 1fr); }
  .cvu-zeile-stand, .cvu-zeile .cvu-extras { grid-column: 2; }
}
.cvu-nacharbeit { margin-top: 1.2rem; }

/* Freigabe: Ansicht waehlen */
.cv-ansicht-wahl { display: flex; flex-wrap: wrap; gap: .6rem; }
.cv-ansicht-karte { display: grid; gap: .3rem; justify-items: center; padding: .4rem; border: 2px solid var(--ov-rand); border-radius: 10px; cursor: pointer; width: 150px; }
.cv-ansicht-karte:has(input:checked) { border-color: var(--ov-gruen, #4b7f1f); background: #f1f8e9; }
.cv-ansicht-karte input { justify-self: start; }
.cv-ansicht-bild { width: 130px; height: auto; display: block; }
.cv-ansicht-wahl .cv-legende-text { flex-basis: 100%; }
@media (prefers-reduced-motion: reduce) { .cvu-pfeil { transition: none; } }

/* Unterrichtsstunde planen: Felder untereinander statt im Fluss der Freigabe-Leiste */
#cv-stunde-form { display: grid; gap: .8rem; justify-items: start; }
#cv-stunde-form > * { max-width: 100%; }
#cv-stunde-form > label { display: flex; gap: .4rem; align-items: center; font-weight: 400; }
.cv-stunde-module td label { display: inline-flex; gap: .3rem; align-items: center; white-space: nowrap; }
.cv-ansicht-karte span { text-align: center; font-size: .85rem; }