Phase 3 abgeschlossen: Vorlagen, Abschnitte, Schwärzung, Diff

Eine Vorlage ist eine geordnete Liste von Bausteinen: Eingabefelder und feste
Textbausteine mit Platzhaltern. Damit trägt dieselbe Struktur den
Vorfallsbericht und den Sonderarbeitsvertrag. Die Startvorlagen bilden jetzt
den echten Bericht der Abteilung ab, samt Berichtsart, Gefahreneinschätzung
und Foundation-Freigabe — letztere als gewöhnliches Feld ohne Wirkung auf den
Zugriff.

Abschnitte werden gerendert und bearbeitet, Entwürfe alle zwei Sekunden lokal
gesichert. Gespeichert wird auf Knopfdruck: ein Abschnitt ist der Sachstand
der Akte, kein Chatbeitrag. Die geladene Version geht mit; weicht sie ab, gibt
es kein stilles Überschreiben, sondern beide Fassungen nebeneinander mit
"Meine übernehmen" und "Fremde übernehmen".

Felder über der Stufe des Lesers werden serverseitig durch einen Platzhalter
ersetzt, Schwärzungen im Fliesstext kommen als Segmente. Beides so, dass der
echte Wert den Server nicht verlässt — nicht als Ausblenden im Client.

Der Wortdiff ist selbst geschrieben statt eingekauft: ein Dutzend Zeilen gegen
30 kB im Bündel für etwas, das nur serverseitig läuft.

Beim Bauen des Vorlagen-Editors riss das Bündel-Budget auf 127,9 kB, weil zod
über das Vorlagenmodul in den Client geriet. Typen und Validierung sind jetzt
getrennt: fields.ts ohne zod für Client und Server, schema.ts nur
serverseitig. Wieder bei 111,9 kB von 120.

85 Tests, 22 E2E.

web/components/Redacted.tsx

@@ -0,0 +1,37 @@
+import type { Segment } from '@/lib/redaction'
+import { de } from '@/lib/i18n/de'
+
+/**
+ * Rendert Fliesstext mit Schwärzungen.
+ *
+ * Die Segmente kommen fertig vom Server: der geschwärzte Inhalt ist gar nicht
+ * erst im Dokument. Der Balken bekommt seine Breite aus der gerundeten Länge,
+ * nicht aus dem echten Text.
+ *
+ * Der Wischeffekt beim ersten Erscheinen steckt in der Klasse `.redaction`
+ * (siehe app/globals.css) und respektiert prefers-reduced-motion.
+ */
+export function RedactedText({ segments }: { segments: Segment[] }) {
+  return (
+    <p className="max-w-(--container-measure) text-sm whitespace-pre-wrap">
+      {segments.map((segment, index) =>
+        segment.kind === 'text' ? (
+          <span key={index}>{segment.text}</span>
+        ) : (
+          <span key={index} className="inline-flex items-baseline gap-1.5 align-baseline">
+            <span
+              className="redaction"
+              style={{ width: `${segment.blockLength}ch` }}
+              aria-label={de.section.redactedFrom(segment.requiredLevel)}
+            >
+              {' '}
+            </span>
+            <span className="font-mono text-2xs text-text-dim" aria-hidden>
+              {segment.requiredLevel}
+            </span>
+          </span>
+        ),
+      )}
+    </p>
+  )
+}