RACI-Schritte konsistent (R+A zusammen, dann C+I) + Legende ausklappbar

- RACI-Mikroablauf entzerrt: Schritt 2 fragt jetzt R UND A zusammen
  ("Verantwortung (R + A)" = die Pflicht), Schritt 3 nur noch C + I
  ("Beteiligung" = ergaenzend). Vorher inkonsistent: R, dann R&A, dann Rest.
- RACI-Legende ist jetzt ausklappbar (<details>) mit Ueberschrift
  "Klicke fuer RACI-Legende", standardmaessig eingeklappt.
- Wording: Figuren auf die "Spielfelder im RACI-Kreis" (statt "Mulden des
  Station-Pucks").
- sw.js Cache hochgezaehlt.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

04_Tablet-Quiz/app/index.html

@@ -215,6 +215,12 @@
   .raciLegend .rlHead{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700;margin-bottom:8px}
   .raciLegend .rlRow{display:flex;align-items:flex-start;gap:10px;margin:5px 0;font-size:14px;line-height:1.45}
   .raciLegend .rlRow .raciBadge{flex:none;margin-top:1px}
+  details.raciLegend{padding:0}
+  details.raciLegend .rlSummary{list-style:none;cursor:pointer;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;padding:11px 14px;display:flex;align-items:center;gap:8px}
+  details.raciLegend .rlSummary::-webkit-details-marker{display:none}
+  details.raciLegend .rlSummary::before{content:"▸";font-size:11px;transition:transform .15s}
+  details.raciLegend[open] .rlSummary::before{transform:rotate(90deg)}
+  details.raciLegend .rlBody{padding:0 14px 12px}
   .raciLegend .rlGroup{margin-top:8px;padding-top:6px;border-top:1px dashed var(--line)}
   .raciLegend .rlGroup:first-of-type{border-top:0;padding-top:0}
   .raciLegend .rlGroupHead{font-size:11px;font-weight:700;color:var(--muted);margin:2px 0 4px}
@@ -1864,10 +1870,11 @@ function raciLegendHtml(){
     ["I","Informed","informiert — wird über das Ergebnis in Kenntnis gesetzt"]
   ];
   const row = ([l,en,de])=>`<div class="rlRow"><span class="raciBadge raci-${l}">${l}</span><span><b>${en}</b> — ${de}</span></div>`;
-  return `<div class="raciLegend"><div class="rlHead">Wofür RACI steht</div>` +
+  return `<details class="raciLegend"><summary class="rlSummary">Klicke für RACI-Legende</summary>` +
+    `<div class="rlBody">` +
     `<div class="rlGroup"><div class="rlGroupHead kern">★ Pflicht — unbedingt durchdenken</div>${kern.map(row).join("")}</div>` +
     `<div class="rlGroup"><div class="rlGroupHead">ergänzend — nice-to-have</div>${erg.map(row).join("")}</div>` +
-    `</div>`;
+    `</div></details>`;
 }
 
 function renderRun(){
@@ -1910,13 +1917,17 @@ function activitySteps(st){
     { label:"Diskussion",
       frage:`Diskutiert gemeinsam: Was fällt alles unter <b>„${st.name}"</b>? Was stellt ihr euch darunter vor? Nennt Beispiele.`,
       auf:`<p style="margin:0 0 8px">${st.beschreibung}</p><h4 class="aufH">Das fällt darunter</h4><ul>${st.umfasst.map(u=>`<li>${u}</li>`).join("")}</ul>` },
-    { label:"Operative Rollen (R)",
+    { label:"Verantwortung (R + A)",
-      frage:`Welche Rollen setzen diese Aktivität <b>operativ</b> um — wer sorgt für die <b>Umsetzung</b> (Responsible)? Stellt deren Figuren auf die <b>Spielfelder im RACI Kreis</b>.`,
+      frage:`Klärt die <b>zwei Pflicht-Rollen</b> dieser Aktivität: Wer setzt sie <b>operativ</b> um (<b>R</b>esponsible) und wer ist <b>rechenschaftspflichtig</b> (<b>A</b>ccountable — genau eine Rolle)? Stellt die Figuren auf die Spielfelder <b>R</b> und <b>A</b> im RACI-Kreis.`,
-      auf:`<h4 class="aufH">Operativ verantwortlich (R)</h4><div class="roleChips">${(st.raci.filter(([r,c])=>c.includes("R")).map(([r,c])=>`<span class="roleChip">${roleLabel(r)}${c==="A/R"?" (zugleich A)":""}</span>`).join("")) || '<span class="roleChip">— (keine eigene R-Rolle)</span>'}</div><p class="muted" style="margin:10px 0 0;font-size:13px">Das sind die „Macher" der Aktivität. <b>Wer</b> dafür geradesteht (A) sowie beratend (C) bzw. informiert (I) ist, klärt Schritt 3.</p>` },
-    { label:"RACI",
-      frage:`Vervollständigt die RACI. <b>Wichtig zuerst:</b> Wer ist <b>A</b>ccountable (trägt die Ergebnisverantwortung — genau eine Rolle)? Zusammen mit den Responsible aus Schritt 2 sind <b>R + A die Pflicht</b>. <b>C</b>onsulted und <b>I</b>nformed danach ergänzen (nice-to-have). Sortiert die Figuren ins <b>Aktiv-Feld (R·A·C·I)</b>.`,
       legend: raciLegendHtml(),
-      auf:`<h4 class="aufH">RACI (vollständig)</h4>${raciTable(st)}` },
+      auf:`<h4 class="aufH">Operativ verantwortlich (R)</h4><div class="roleChips">${(st.raci.filter(([r,c])=>c.includes("R")).map(([r,c])=>`<span class="roleChip">${roleLabel(r)}${c.includes("A")?" (zugleich A)":""}</span>`).join("")) || '<span class="roleChip">— (keine eigene R-Rolle)</span>'}</div>`
+        + `<h4 class="aufH">Rechenschaftspflichtig (A)</h4><div class="roleChips">${(st.raci.filter(([r,c])=>c.includes("A")).map(([r,c])=>`<span class="roleChip">${roleLabel(r)}</span>`).join("")) || '<span class="roleChip">—</span>'}</div>`
+        + `<p class="muted" style="margin:10px 0 0;font-size:13px">R und A sind die <b>Pflicht</b>. Beratend (C) bzw. informiert (I) klärt der nächste Schritt (ergänzend).</p>` },
+    { label:"Beteiligung (C + I)",
+      frage:`Ergänzt nun die <b>beteiligten</b> Rollen (ergänzend, nice-to-have): Wer wird <b>C</b>onsulted (vorab um Rat gefragt), wer nur <b>I</b>nformed (über das Ergebnis)? Stellt die Figuren auf die Spielfelder <b>C</b> und <b>I</b> im RACI-Kreis.`,
+      legend: raciLegendHtml(),
+      auf:`<h4 class="aufH">Konsultiert (C) / Informiert (I)</h4><div class="roleChips">${(st.raci.filter(([r,c])=>c.includes("C")||c.includes("I")).map(([r,c])=>`<span class="roleChip">${roleLabel(r)} · ${c}</span>`).join("")) || '<span class="roleChip">— (keine C/I-Rolle)</span>'}</div>`
+        + `<h4 class="aufH" style="margin-top:14px">RACI vollständig</h4>${raciTable(st)}` },
     { label:"Artefakt", artefakt:true,
       frage:`Welches <b>Artefakt</b> entsteht hier und kommt in die <b>Service-Akte</b>?`,
       auf:`<h4 class="aufH">Artefakt</h4><p style="margin:0"><b>${st.artefakt}</b></p>` }

04_Tablet-Quiz/app/sw.js

@@ -1,5 +1,5 @@
 /* Service Worker — SLC-Workshop Companion (App-Shell, offline-first) */
-const CACHE = "slc-companion-v35";
+const CACHE = "slc-companion-v36";
 const SHELL = ["./", "index.html", "manifest.webmanifest", "icon.svg"];
 // Action-Card-Grafiken (cards/s<service>-c<change>.png) fuer Offline vorab cachen (alle 24).
 const CARDS = [];