Kommentare je Gewerk klar getrennt, abgewählte Gewerke ausgeblendet

- Kommentare mehrerer Gewerke mit Überschrift und Linie: Gewerk in seiner
  Farbe, rechts Verfasser und Zeit, darunter der Text (Projekt-Dashboard,
  Projektliste, Wandtafel, Verlauf-Kacheln)
- Behoben: Im Projekt-Dashboard erschienen Kommentare von Gewerken, die das
  Projekt nicht mehr hat (z. B. HLS bei 21-4030); Anzeige und Verlauf zeigen
  nur noch Gewerke des Projekts
- Sitzungswechsel übernimmt nur noch Kommentare der Gewerke des Projekts

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

public/styles.css

@@ -4188,12 +4188,19 @@ tr.is-menu-open { background: var(--surface-alt); }
   min-height: 3em;
 }
 .timeline-text p { margin: 0; }
-/* Gewerk über dem Kommentar: Systemtext, nicht Teil des Kommentars. */
-.kommentar-gewerk {
-  font-size: 11px; font-weight: 600; letter-spacing: 0;
-  color: var(--text-subtle); margin-top: 4px;
-}
-.kommentar-gewerk:first-child { margin-top: 0; }
+/* Kommentare mehrerer Gewerke, Darstellung „B – Überschrift mit Linie“
+   (Eriks Wahl): Gewerk in seiner Farbe, feine Linie, Verfasser und Zeit,
+   darunter der Text. Systemtext, nicht Teil des Kommentars. */
+.kommentar-gewerke { display: flex; flex-direction: column; gap: 16px; }
+.kommentar-block { display: flex; flex-direction: column; gap: 4px; }
+.kommentar-kopf { display: flex; align-items: center; gap: 12px; }
+.kommentar-gewerk { flex: none; font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--text-muted); }
+.kommentar-gewerk.gewerk-elt { color: var(--gewerk-elt); }
+.kommentar-gewerk.gewerk-hls { color: var(--gewerk-hls); }
+.kommentar-gewerk.gewerk-arch { color: var(--gewerk-arch); }
+.kommentar-linie { flex: 1; height: 1px; background: var(--line-soft); min-width: 16px; }
+.kommentar-meta { flex: none; font-size: 12px; font-weight: 400; color: var(--text-subtle); white-space: nowrap; }
+:root { --gewerk-elt: var(--accent); --gewerk-hls: var(--green); --gewerk-arch: var(--amber); }
 .timeline-leer { color: var(--text-muted); font-style: normal; }
 
 .timeline-lph-list { display: flex; flex-direction: column; gap: 1px; }