[split-required] Split website + studio-v2 monoliths (Phase 3 continued)

Website (14 monoliths split):
- compliance/page.tsx (1,519 → 9), docs/audit (1,262 → 20)
- quality (1,231 → 16), alerts (1,203 → 10), docs (1,202 → 11)
- i18n.ts (1,173 → 8 language files)
- unity-bridge (1,094 → 12), backlog (1,087 → 6)
- training (1,066 → 8), rag (1,063 → 8)
- Deleted index_original.ts (4,899 LOC dead backup)

Studio-v2 (5 monoliths split):
- meet/page.tsx (1,481 → 9), messages (1,166 → 9)
- AlertsB2BContext.tsx (1,165 → 5 modules)
- alerts-b2b/page.tsx (1,019 → 6), korrektur/archiv (1,001 → 6)

All existing imports preserved. Zero new TypeScript errors.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

studio-v2/app/meet/_components/TranscriptModal.tsx

@@ -0,0 +1,93 @@
+'use client'
+
+import { Icons, getBackendUrl, type Recording } from './types'
+
+interface TranscriptModalProps {
+  isDark: boolean
+  currentRecording: Recording
+  transcriptText: string
+  transcriptLoading: boolean
+  startTranscription: (id: string) => void
+  onClose: () => void
+}
+
+export function TranscriptModal({
+  isDark, currentRecording, transcriptText, transcriptLoading,
+  startTranscription, onClose,
+}: TranscriptModalProps) {
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center p-4">
+      <div className="absolute inset-0 bg-black/50 backdrop-blur-sm" onClick={onClose} />
+      <div className={`relative w-full max-w-2xl max-h-[80vh] flex flex-col rounded-3xl border ${
+        isDark ? 'bg-slate-900 border-white/20' : 'bg-white border-slate-200 shadow-2xl'
+      }`}>
+        {/* Header */}
+        <div className={`p-6 border-b flex items-center justify-between ${isDark ? 'border-white/10' : 'border-slate-200'}`}>
+          <h2 className={`text-xl font-semibold ${isDark ? 'text-white' : 'text-slate-900'}`}>
+            Transkript: {currentRecording.title || `Aufzeichnung ${currentRecording.meeting_id}`}
+          </h2>
+          <button onClick={onClose}
+            className={`p-2 rounded-lg transition-colors ${isDark ? 'hover:bg-white/10' : 'hover:bg-slate-100'}`}>
+            {Icons.close}
+          </button>
+        </div>
+
+        {/* Content */}
+        <div className="flex-1 overflow-y-auto p-6">
+          {transcriptLoading ? (
+            <div className={`text-center py-8 ${isDark ? 'text-white/40' : 'text-slate-400'}`}>Lade Transkript...</div>
+          ) : transcriptText === 'PENDING' ? (
+            <div className="text-center py-8">
+              <div className={`w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4 ${
+                isDark ? 'bg-amber-500/20 text-amber-400' : 'bg-amber-100 text-amber-600'
+              }`}>
+                {Icons.clock}
+              </div>
+              <h4 className={`font-medium mb-2 ${isDark ? 'text-white' : 'text-slate-900'}`}>Transkription ausstehend</h4>
+              <p className={`mb-6 ${isDark ? 'text-white/50' : 'text-slate-500'}`}>
+                Die Transkription wurde noch nicht gestartet oder ist in Bearbeitung.
+              </p>
+              <button onClick={() => startTranscription(currentRecording.id)}
+                className="px-6 py-3 bg-gradient-to-r from-blue-500 to-purple-500 text-white rounded-xl font-medium hover:shadow-lg hover:shadow-purple-500/30 transition-all hover:scale-105">
+                Transkription starten
+              </button>
+            </div>
+          ) : (
+            <div className={`whitespace-pre-wrap leading-relaxed ${isDark ? 'text-white/80' : 'text-slate-700'}`}>
+              {transcriptText}
+            </div>
+          )}
+        </div>
+
+        {/* Footer */}
+        <div className={`p-6 border-t flex justify-end gap-3 ${isDark ? 'border-white/10' : 'border-slate-200'}`}>
+          {transcriptText && transcriptText !== 'PENDING' && (
+            <>
+              <DownloadButton isDark={isDark} label="WebVTT"
+                href={`${getBackendUrl()}/api/recordings/${currentRecording.id}/transcription/vtt`} />
+              <DownloadButton isDark={isDark} label="SRT"
+                href={`${getBackendUrl()}/api/recordings/${currentRecording.id}/transcription/srt`} />
+            </>
+          )}
+          <button onClick={onClose}
+            className={`px-5 py-2.5 rounded-xl font-medium transition-all ${
+              isDark ? 'text-white/60 hover:text-white hover:bg-white/10' : 'text-slate-600 hover:text-slate-900 hover:bg-slate-100'
+            }`}>
+            Schliessen
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+function DownloadButton({ isDark, label, href }: { isDark: boolean; label: string; href: string }) {
+  return (
+    <button onClick={() => window.location.href = href}
+      className={`px-4 py-2.5 rounded-xl font-medium transition-all ${
+        isDark ? 'bg-white/10 text-white hover:bg-white/20' : 'bg-slate-100 text-slate-700 hover:bg-slate-200'
+      }`}>
+      {label}
+    </button>
+  )
+}