update

frontend/src/components/BausteinFokus.vue

@@ -298,7 +298,11 @@ watch(() => `${props.baustein.title}|${props.baustein.md}|${props.baustein.kompa
 }
 
 /* Block-Prüfen: Rechtsklick-Menü + Vorschlag unter dem Abschnitt */
-.md-block { border-radius: 6px; transition: background 0.15s; }
+/* Abstand am Wrapper führen — inneres p ist jetzt :last-child (Margin 0). */
+.md-block { border-radius: 6px; transition: background 0.15s; margin-bottom: 0.8em; }
+.md-block:last-child { margin-bottom: 0; }
+.md-block > :first-child { margin-top: 0; }
+.md-block > :last-child { margin-bottom: 0; }
 .md-block:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
 
 .menu-overlay { position: fixed; inset: 0; z-index: 60; }

frontend/src/components/BausteinPanel.vue

@@ -236,9 +236,15 @@ function naechsterModus() {
   return imZufall.value ? MODI[Math.floor(Math.random() * MODI.length)] : aktiverModus.value
 }
 
-// Ein Frage-Objekt des aktiven Modus generieren (aus gezogener Saat; Erklären hat Fallback).
-function frageEinzeln() {
-  const modus = naechsterModus()
+// Modus-String eines Pool-Objekts (Form + Schwierigkeit) — Gegenstück zu MODI.
+function modusVon(obj) {
+  if (obj.form === 'quiz') return obj.schwer ? 'quiz_schwer' : 'quiz_leicht'
+  if (obj.form === 'lueckentext') return obj.schwer ? 'lueck_schwer' : 'lueck_leicht'
+  return 'erklaeren'
+}
+
+// Ein Frage-Objekt eines bestimmten Modus generieren (aus gezogener Saat; Erklären hat Fallback).
+function frageEinzeln(modus = naechsterModus()) {
   const form = modus.startsWith('quiz') ? 'quiz' : modus.startsWith('lueck') ? 'lueckentext' : 'erklaeren'
   const istSchwer = modus.endsWith('_schwer')
   const muster = musterNehmen()
@@ -290,19 +296,15 @@ function poolFuellen() {
   }
 }
 
-// Ein Frage-Objekt aus dem Pool nehmen; ist er leer, auf das erste eintreffende warten.
-async function poolNehmen() {
-  if (!pool.value.length) {
-    const missCap = musterModus.value ? Infinity : 3
+// Frage des gewünschten Modus holen: erst aus dem Cache, sonst gezielt erzeugen.
+// So entscheidet der gewürfelte Modus über die Form — nicht das Generier-Tempo.
+async function frageHolen(modus) {
+  const i = pool.value.findIndex((o) => modusVon(o) === modus)
+  if (i >= 0) return pool.value.splice(i, 1)[0]
   pruefLoading.value = true
-    try {
-      while (!pool.value.length && (inflight.value > 0 || poolMiss < missCap)) {
-        if (!inflight.value) poolFuellen()
-        await new Promise((r) => setTimeout(r, 120))
-      }
-    } finally { pruefLoading.value = false }
-  }
-  return pool.value.length ? pool.value.shift() : null
+  try { return await frageEinzeln(modus) }
+  catch { return null }
+  finally { pruefLoading.value = false }
 }
 
 // Ein gezogenes Objekt der passenden Form anzeigen (Erklären-Bubble bzw. Quiz/Lück-Widget).
@@ -321,14 +323,15 @@ function frageObjZeigen(obj) {
   }
 }
 
-// Erste / nächste Frage: Muster laden, Pool füllen, schnellste zuerst zeigen.
+// Erste / nächste Frage: Muster laden, Form würfeln, genau diese Form holen.
 async function naechsteFrageZeigen() {
   if (pruefLoading.value) return
   poolMiss = 0
   pruefFehler.value = ''
   await musterLaden()
-  poolFuellen()
-  const obj = await poolNehmen()
+  poolFuellen()                    // Cache im Hintergrund vorwärmen
+  const modus = naechsterModus()   // Form vorab würfeln — unabhängig vom Tempo
+  const obj = await frageHolen(modus)
   if (obj) {
     frageObjZeigen(obj)
     pruefScroll()