update

backend/config.py

@@ -60,6 +60,8 @@ TIMEOUTS = {
     "frage_muster_check": (300, 10),  # Kritiker bereinigt die Muster-Tabelle je Baustein
     "writer":        (600, 120),  # pro Section im Chunk
     "lese_check":    (300, 10),   # pro Section im Paket
+    "grafik":        (600, 60),   # Mermaid-Grafik je Section im Chunk
+    "grafik_check":  (300, 15),   # Grafik-Prüfung/Fix je Section im Paket
     "onepager_recherche": (900, 0),
     "onepager_mapping":   (600, 0),  # Konsolidierung der Recherchen
     "onepager_bauen":     (300, 0),

backend/guide.py

@@ -33,13 +33,13 @@ from pipeline import (
     is_guide_cancelled, run_single_slot,
 )
 from textkit import (
-    _eindeutige_titel, _lade_bausteine, _parse_fragment, _split_chunks,
+    _eindeutige_titel, _lade_bausteine, _parse_fragment, _parse_grafik, _split_chunks,
     _titel, _titel_aufloesen, _titel_index, _zuteilung_text,
 )
 
 log = logging.getLogger("creator.guide")
 
-GUIDE_STEPS = ("Auswahl", "Gliederung", "Inhalte", "Inhalts-Check", "Schreiben", "Lese-Prüfung")
+GUIDE_STEPS = ("Auswahl", "Gliederung", "Inhalte", "Inhalts-Check", "Schreiben", "Lese-Prüfung", "Grafik", "Grafik-Check")
 
 # Writer skalieren mit der Section-Zahl: 1 Writer je ~30 Sections (gedeckelt).
 # Kleine Pakete vermeiden Lazy-Output bei langen Listen und begrenzen den Schaden
@@ -764,12 +764,100 @@ async def _generate_sections(
             break
         scope = [[num for num in nums if num in ersetzt] for nums in chunk_nums]
 
+    # Schritt 6: Grafik — pro Chunk ein Agent erzeugt je Section ein Mermaid-Diagramm (Resume).
+    grafik_paths = [content_path.parent / f"{content_path.stem}.grafik-{i}.md" for i in range(1, writer_count + 1)]
+    offen_g = [i for i, p in enumerate(grafik_paths) if chunk_nums[i] and not p.exists()]
+    if offen_g:
+        await _set_step(guide_id, 6, f"Erstelle Grafiken ({writer_count})…" if writer_count > 1 else "Erstelle Grafiken…")
+        results = await asyncio.gather(*[
+            run_agent(
+                f"{guide_id}-g{i + 1}",
+                _prompt("Guide-Grafik", topic=topic, format_name=format_name,
+                        sections=sections_text(chunk_nums[i]), out_path=grafik_paths[i], extra=_extra(instructions)),
+                _timeout("grafik", chunk_sizes[i]), provider=provider, role="guide", capabilities="files",
+            )
+            for i in offen_g
+        ], return_exceptions=True)
+        if is_cancelled():
+            return None
+        for i, r in zip(offen_g, results):
+            if isinstance(r, BaseException) or (not isinstance(r, BaseException) and r[0] != 0):
+                _log(topic, f"Grafik {i + 1} fehlgeschlagen — Section ohne Grafik")
+    for p in grafik_paths:
+        if not p.exists():
+            continue
+        for titel, code in _parse_grafik(p.read_text(encoding="utf-8")).items():
+            num = _titel_aufloesen(idx, titel)
+            if num in by_num and code.strip():
+                by_num[num]["grafik"] = code.strip()
+
+    # Schritt 7: Grafik-Check — Kritiker je Chunk (Syntax + Inhalt), Fix für beanstandete (eine Runde).
+    def grafik_text(nums):
+        return "\n\n".join(
+            f"SECTION: {_titel(entries[num])}\n```mermaid\n{by_num[num].get('grafik', '')}\n```"
+            for num in nums if by_num.get(num, {}).get("grafik")
+        )
+
+    def grafik_auftraege(nums, probleme):
+        return "\n\n".join(
+            f"SECTION: {_titel(entries[num])}\nPROBLEM: {probleme[num]}\nAKTUELLE GRAFIK:\n```mermaid\n{by_num[num].get('grafik', '')}\n```"
+            for num in nums
+        )
+
+    g_scope = [[num for num in nums if by_num.get(num, {}).get("grafik")] for nums in chunk_nums]
+    gcheck_paths = [content_path.parent / f"{content_path.stem}.grafik-check-{i}.json" for i in range(1, writer_count + 1)]
+    g_offen = [i for i, p in enumerate(gcheck_paths) if g_scope[i] and _lese_probleme_schema(_json_datei(p)) is None]
+    if g_offen:
+        await _set_step(guide_id, 7, "Prüfe Grafiken…")
+        slots = [{
+            "key": f"{guide_id}-gcheck-{i + 1}",
+            "prompt": _prompt("Guide-Grafik-Check", topic=topic, format_name=format_name,
+                              sections=grafik_text(g_scope[i]), out_path=gcheck_paths[i]),
+            "role": "judge", "capabilities": "files",
+            "payload": (lambda result, p=gcheck_paths[i]: _lese_probleme_schema(_json_datei(p))),
+        } for i in g_offen]
+        if await _race(topic, "Grafik-Check", slots, len(slots), _timeout("grafik_check", max(chunk_sizes)), provider, cancelled=is_cancelled) is None:
+            _log(topic, "Grafik-Check fehlgeschlagen — Grafiken bleiben ungeprüft")
+        if is_cancelled():
+            return None
+    g_probleme: dict[int, str] = {}
+    for i, p in enumerate(gcheck_paths):
+        geltung = set(g_scope[i])
+        for item in (_lese_probleme_schema(_json_datei(p)) or []):
+            num = _titel_aufloesen(idx, item["section"])
+            if num in geltung and num not in g_probleme:
+                g_probleme[num] = item["problem"]
+    if g_probleme:
+        _log(topic, f"Grafik-Check: {len(g_probleme)} Grafik(en) beanstandet")
+        await _set_step(guide_id, 7, f"Überarbeite {len(g_probleme)} Grafik(en)…")
+        gfix_chunks = [[num for num in nums if num in g_probleme] for nums in chunk_nums]
+        gfix_paths = [content_path.parent / f"{content_path.stem}.grafik-fix-{i + 1}.md" for i in range(writer_count)]
+        gfix_offen = [i for i, nums in enumerate(gfix_chunks) if nums and not gfix_paths[i].exists()]
+        results = await asyncio.gather(*[
+            run_agent(
+                f"{guide_id}-gfix-w{i + 1}",
+                _prompt("Guide-Grafik-Fix", topic=topic, format_name=format_name,
+                        auftraege=grafik_auftraege(gfix_chunks[i], g_probleme), out_path=gfix_paths[i], extra=_extra(instructions)),
+                _timeout("grafik_check", len(gfix_chunks[i])), provider=provider, role="guide", capabilities="files",
+            )
+            for i in gfix_offen
+        ], return_exceptions=True)
+        if is_cancelled():
+            return None
+        for p in gfix_paths:
+            if not p.exists():
+                continue
+            for titel, code in _parse_grafik(p.read_text(encoding="utf-8")).items():
+                num = _titel_aufloesen(idx, titel)
+                if num in g_probleme and code.strip():
+                    by_num[num]["grafik"] = code.strip()
+
     await _set_progress(guide_id, "Setze zusammen…")
     chapters: list[dict] = []
     for ch in plan:
         sections = [
             {"num": num, "title": _titel(entries[num]), "md": by_num[num]["md"],
-             "kompakt": by_num[num].get("kompakt", "")}
+             "kompakt": by_num[num].get("kompakt", ""), "grafik": by_num[num].get("grafik", "")}
             for num in ch["nums"] if num in by_num
         ]
         if sections:

backend/lernen.py

@@ -63,6 +63,12 @@ def score_berechnen(basis: int, delta: int, floor: int, cap: int) -> int:
     return max(floor, min(cap, basis + delta))
 
 
+def _zufall_malus(basis: int, delta: int) -> int:
+    """Im Zufallband (Score ≥ MEISTERN=18, FullGuide) kostet jeder Fehler −3 statt −1 —
+    die 30 erreicht man nur mit Sicherheit. Richtige Antworten bleiben unverändert."""
+    return -3 if (basis >= MEISTERN and delta < 0) else delta
+
+
 def floor_aus_meilensteinen(absolviert: bool, verstanden: bool, gemeistert: bool) -> int:
     """Untergrenze des Scores: ein erreichter Meilenstein hält (kein Rückfall ins Band davor)."""
     if gemeistert:

backend/routes.py

@@ -18,7 +18,7 @@ from database import (
 )
 from bausteine import generate_bausteine, cancel_bausteine, bausteine_status, active_bausteine, reset_bausteine, lade_quelle, lade_uebersicht, subbausteine_titel, lade_frage_muster
 from elements import generate_element, chat_with_guide, chat_with_element, check_element, style_element, refine_suggestion
-from lernen import NOETIG, MASTERY, MEISTERN, NIVEAUS, baustein_chat, baustein_diskussion, baustein_element_anlegen, pruefung_bewertung, pruefung_bewertung_schnell, pruefung_frage, pruefung_frage_variante, quiz_generieren, lueckwahl_generieren, lueckentext_generieren, lueckentext_pruefen, score_berechnen, floor_aus_meilensteinen
+from lernen import NOETIG, MASTERY, MEISTERN, NIVEAUS, baustein_chat, baustein_diskussion, baustein_element_anlegen, pruefung_bewertung, pruefung_bewertung_schnell, pruefung_frage, pruefung_frage_variante, quiz_generieren, lueckwahl_generieren, lueckentext_generieren, lueckentext_pruefen, score_berechnen, floor_aus_meilensteinen, _zufall_malus
 from guide import generate_guide, guide_slot_dateien
 from pipeline import cancel_guide
 from regeln import FORMATE, formate_stats, guide_lock, ist_absolviert, lade_lernstand, thema_abgeschlossen
@@ -283,7 +283,7 @@ async def _punkte_buchen(req, frage: str, delta: int) -> dict:
         if not re_bewertung:
             await set_offene_frage(req.topic, req.baustein, frage, basis, 0)
         floor = floor_aus_meilensteinen(absolviert, verstanden, gemeistert)
-        score = score_berechnen(basis, delta, floor, req.cap)
+        score = score_berechnen(basis, _zufall_malus(basis, delta), floor, req.cap)
         punkte = score - basis
         gute = await set_baustein_score(req.topic, req.baustein, score)
         if score >= NOETIG and not absolviert:
@@ -396,7 +396,7 @@ async def baustein_pruefung_route(req: BausteinPruefungRequest):
             raise HTTPException(502, "Bewertung fehlgeschlagen — bitte erneut versuchen")
         basis, _ = _basis(stand, req.frage)
         floor = floor_aus_meilensteinen(absolviert, verstanden, gemeistert)
-        score = score_berechnen(basis, _erklaeren_delta(data["niveau"], req.nachgefragt), floor, req.cap)
+        score = score_berechnen(basis, _zufall_malus(basis, _erklaeren_delta(data["niveau"], req.nachgefragt)), floor, req.cap)
         punkte = score - basis
         return {"feedback": data["feedback"], "punkte": punkte, "bewertung": _farbe(punkte),
                 "gute_antworten": gute, "absolviert": absolviert, "verstanden": verstanden, "gemeistert": gemeistert}
@@ -420,7 +420,7 @@ async def baustein_pruefung_route(req: BausteinPruefungRequest):
             raise HTTPException(502, "Bewertung fehlgeschlagen — bitte erneut versuchen")
 
         floor = floor_aus_meilensteinen(absolviert, verstanden, gemeistert)
-        score = score_berechnen(basis, _erklaeren_delta(data["niveau"], req.nachgefragt), floor, req.cap)
+        score = score_berechnen(basis, _zufall_malus(basis, _erklaeren_delta(data["niveau"], req.nachgefragt)), floor, req.cap)
         punkte = score - basis
         gute = await set_baustein_score(req.topic, req.baustein, score)
         if score >= NOETIG and not absolviert:

backend/textkit.py

@@ -187,6 +187,24 @@ def _parse_fragment(text: str) -> list[dict]:
     return sections
 
 
+_GRAFIK_MERMAID_RE = re.compile(r"```(?:mermaid)?\s*\n(.*?)```", re.DOTALL)
+
+
+def _parse_grafik(text: str) -> dict[str, str]:
+    """Grafik-Datei → {section-titel: mermaid-code}. Je `<!-- section: titel -->` den ersten
+    ```mermaid…```-Block (sonst den Rohtext des Abschnitts)."""
+    out: dict[str, str] = {}
+    parts = re.split(r"<!--\s*section\s*:\s*(.*?)\s*-->", text, flags=re.IGNORECASE)
+    for i in range(1, len(parts), 2):
+        titel = parts[i].strip()
+        body = parts[i + 1] if i + 1 < len(parts) else ""
+        m = _GRAFIK_MERMAID_RE.search(body)
+        code = (m.group(1) if m else body).strip()
+        if titel and code:
+            out[titel] = code
+    return out
+
+
 def _parse_subbausteine(text: str) -> dict[str, list[str]]:
     """Parst eine Subbaustein-Datei → {Baustein-Titel: [Subbaustein, …]} in Reihenfolge.
 

frontend/package.json

@@ -14,6 +14,7 @@
     "katex": "^0.17.0",
     "marked": "^18.0.4",
     "marked-highlight": "^2.2.4",
+    "mermaid": "^11.15.0",
     "vue": "^3.5.32"
   },
   "devDependencies": {

frontend/src/components/BausteinFokus.vue

@@ -1,5 +1,6 @@
 <script setup>
 import BausteinPanel from './BausteinPanel.vue'
+import MermaidView from './MermaidView.vue'
 import { renderMarkdown } from '../markdown.js'
 
 const props = defineProps({
@@ -88,7 +89,8 @@ const standFarbe = computed(() => {
     </div>
     <div class="fokus-body">
       <div ref="guideEl" class="fokus-col left">
-        <div class="markdown" v-html="renderMarkdown(ansicht === 'kompakt' ? (baustein.kompakt || baustein.md) : baustein.md)"></div>
+        <MermaidView v-if="ansicht === 'grafik'" :code="baustein.grafik || ''" />
+        <div v-else class="markdown" v-html="renderMarkdown(ansicht === 'kompakt' ? (baustein.kompakt || baustein.md) : baustein.md)"></div>
       </div>
       <div ref="rightEl" class="fokus-col right">
         <BausteinPanel

frontend/src/components/BausteinPanel.vue

@@ -74,9 +74,10 @@ const aktSchwer = computed(() => {
   return schwer.value
 })
 const modusRegel = computed(() => {
-  if (zeigeForm.value === 'quiz') return aktSchwer.value ? 'x von 4 · +3/−1' : '1 von 4 · +1/−1'
+  const m = imZufall.value ? '−3' : '−1'  // Zufallband: Fehler kostet −3
-  if (zeigeForm.value === 'lueckentext') return aktSchwer.value ? 'frei tippen · +3/−1' : 'Begriff aus 4 · +1/−1'
+  if (zeigeForm.value === 'quiz') return aktSchwer.value ? `x von 4 · +3/${m}` : `1 von 4 · +1/${m}`
-  return '+1/+2/+3 · Nachfragen max +1 · schwach −1'
+  if (zeigeForm.value === 'lueckentext') return aktSchwer.value ? `frei tippen · +3/${m}` : `Begriff aus 4 · +1/${m}`
+  return imZufall.value ? '+1/+2/+3 · Fehler −3' : '+1/+2/+3 · Nachfragen max +1 · schwach −1'
 })
 // Ende des aktuellen Bands (nächster Meilenstein).
 const bandZiel = computed(() => {

frontend/src/components/MermaidView.vue

@@ -0,0 +1,41 @@
+<script setup>
+import { ref, watch, onMounted } from 'vue'
+import mermaid from 'mermaid'
+
+mermaid.initialize({ startOnLoad: false, securityLevel: 'strict', theme: 'neutral' })
+
+const props = defineProps({ code: { type: String, default: '' } })
+const svg = ref('')
+const fehler = ref(false)
+let n = 0
+
+// Async rendern; bricht das Mermaid-Parsing (kaputte Syntax) → Fallback statt Absturz.
+async function render() {
+  const code = (props.code || '').trim()
+  svg.value = ''
+  fehler.value = false
+  if (!code) { fehler.value = true; return }
+  try {
+    const { svg: out } = await mermaid.render(`mmd-${Date.now()}-${n++}`, code)
+    svg.value = out
+  } catch {
+    fehler.value = true
+  }
+}
+
+watch(() => props.code, render)
+onMounted(render)
+</script>
+
+<template>
+  <div class="mermaid-view">
+    <div v-if="svg" v-html="svg"></div>
+    <p v-else class="mermaid-fallback">Grafik nicht verfügbar — Guide neu bauen.</p>
+  </div>
+</template>
+
+<style scoped>
+.mermaid-view { display: flex; justify-content: center; padding: 0.5rem 0; }
+.mermaid-view :deep(svg) { max-width: 100%; height: auto; }
+.mermaid-fallback { color: var(--text-muted); font-size: 0.85rem; padding: 1rem 0; }
+</style>

frontend/src/components/TopicDetail.vue

@@ -5,6 +5,7 @@ import { renderMarkdown } from '../markdown.js'
 import { useChat } from '../composables/useChat.js'
 import BausteinPanel from './BausteinPanel.vue'
 import BausteinFokus from './BausteinFokus.vue'
+import MermaidView from './MermaidView.vue'
 
 const props = defineProps({
   previewGuide: { type: Object, default: null },
@@ -204,7 +205,8 @@ function extractContext() {
                 <span v-else-if="lernstand[s.title]?.verstanden" class="baustein-done verstanden" title="Vollständig verstanden (10/10)">✓✓ Verstanden</span>
                 <span v-else-if="lernstand[s.title]?.absolviert" class="baustein-done" title="Prüfung bestanden">✓ Absolviert</span>
               </h3>
-              <div class="section-body markdown" v-html="renderMarkdown(!isOnePager && ansichtModus === 'kompakt' ? (s.kompakt || s.md) : s.md)"></div>
+              <MermaidView v-if="!isOnePager && ansichtModus === 'grafik'" :code="s.grafik || ''" />
+              <div v-else class="section-body markdown" v-html="renderMarkdown(!isOnePager && ansichtModus === 'kompakt' ? (s.kompakt || s.md) : s.md)"></div>
               <BausteinPanel
                 v-if="!isOnePager"
                 mode="trigger"

frontend/src/components/TopicSidebar.vue

@@ -312,6 +312,14 @@ function saveQuelle() {
             <rect x="2" y="12.9" width="8" height="1.4" rx="0.7" />
           </svg>
         </button>
+        <button :class="{ active: ansichtModus === 'grafik' }" title="Grafik (Diagramm)" @click="emit('setAnsicht', 'grafik')">
+          <svg viewBox="0 0 16 16" width="14" height="14" aria-hidden="true">
+            <circle cx="4" cy="4" r="2" />
+            <circle cx="12" cy="4" r="2" />
+            <circle cx="8" cy="12" r="2" />
+            <path d="M4 6 L8 10 M12 6 L8 10" stroke="currentColor" stroke-width="1.3" fill="none" />
+          </svg>
+        </button>
       </div>
       <button class="new-topic-toggle" :class="{ active: dlg }" title="Thema erstellen" @click="toggleErstellen">+</button>
     </div>

templates/Prompt/Guide-Grafik-Check.md

@@ -0,0 +1,17 @@
+Du bist Qualitäts-Prüfer für Mermaid-Grafiken in einem Lern-Guide zum Thema "{topic}" (Format {format_name}). Pro Section gibt es ein Diagramm. Prüfe jedes streng.
+
+GRAFIKEN (Section-Titel + Mermaid-Code):
+{sections}
+
+PRÜFE GEGEN DIESE KRITERIEN:
+- **Syntax:** gültiger Mermaid-Header (`flowchart`/`graph`/`sequenceDiagram`/…), jede Kante/jeder
+  Knoten korrekt, keine offenen Klammern/Anführungszeichen, keine `$…$`-Mathe. Muss renderbar sein.
+- **Inhalt:** zeigt die Subbausteine der Section + sinnvolle Zusammenhänge (Ablauf/Hierarchie/
+  Beziehung). Kein Widerspruch zum Inhalt, nichts Erfundenes.
+- **Klar:** kurze Knotentexte, kein Fließtext-Klotz.
+
+Beanstande NUR echte Mängel. Ist die Grafik renderbar, korrekt und klar, ist sie in Ordnung.
+
+Gib NUR JSON aus (kein weiterer Text):
+- Alles in Ordnung: {{"ok": true}}
+- Sonst: {{"probleme": [{{"section": "Exakter Titel", "problem": "kurzer Mangel"}}]}}

templates/Prompt/Guide-Grafik-Fix.md

@@ -0,0 +1,22 @@
+Du überarbeitest beanstandete Mermaid-Grafiken in einem Lern-Guide zum Thema "{topic}" (Format {format_name}). Behebe die genannten Mängel — sonst lasse die Grafik, wie sie ist.
+
+AUFTRÄGE (Section-Titel + Problem + aktuelle Grafik):
+{auftraege}
+
+REGELN:
+- Renderbares Mermaid: gültiger Header, korrekte Kanten/Knoten, keine `$…$`-Mathe (Symbole als Wort),
+  keine offenen Klammern/Anführungszeichen.
+- Inhalt: Subbausteine + sinnvolle Zusammenhänge (Ablauf/Hierarchie/Beziehung), kurze Knotentexte.
+- Genau EIN Diagramm je Section.
+
+Schreibe die überarbeiteten Grafiken in die Datei {out_path} (nutze dein Schreib-Werkzeug),
+GENAU so — nur die beanstandeten Sections:
+
+<!-- section: Exakter Section-Titel -->
+```mermaid
+flowchart TD
+  A[Begriff] --> B[Begriff]
+```
+
+Gib sonst keinen Text aus.
+{extra}

templates/Prompt/Guide-Grafik.md

@@ -0,0 +1,26 @@
+Du erstellst für einen Lern-Guide zum Thema "{topic}" (Format {format_name}) pro Baustein-Section EINE **Mermaid-Grafik**. Die Grafik soll die Subbausteine + ihre Zusammenhänge zeigen, damit der Lerner Muster, Abläufe oder Strukturen auf einen Blick erkennt.
+
+SECTIONS (jeweils Titel + ausführlicher Inhalt):
+{sections}
+
+AUFGABE:
+- Für JEDE Section genau EIN Mermaid-Diagramm.
+- Wähle den passenden Typ selbst: `flowchart`, `graph`, `sequenceDiagram`, `mindmap`,
+  `stateDiagram-v2`, … — was die Sache am besten zeigt (Ablauf, Hierarchie, Beziehung).
+- Zeige die **Subbausteine** als Knoten und ihre Verbindungen (Reihenfolge, Abhängigkeit,
+  Ober-/Unterbegriff). Ziel: Flow/Muster erkennen, nicht Fließtext wiederholen.
+- **Knotentexte kurz** (Stichwort). Keine `$…$`-Mathe in Mermaid — schreibe Symbole als Wort
+  (z. B. „A und B" statt `A ∧ B`). Anführungszeichen in Texten vermeiden.
+- Syntaktisch sauberes, renderbares Mermaid (gültiger Diagramm-Header, jede Kante korrekt).
+
+Schreibe das Ergebnis in die Datei {out_path} (nutze dein Schreib-Werkzeug), GENAU so —
+pro Section ein Marker + ein Mermaid-Codeblock:
+
+<!-- section: Exakter Section-Titel -->
+```mermaid
+flowchart TD
+  A[Erster Begriff] --> B[Zweiter Begriff]
+```
+
+Gib sonst keinen Text aus.
+{extra}