[split-required] Split 500-1000 LOC files across all services

backend-lehrer (5 files):
- alerts_agent/db/repository.py (992 → 5), abitur_docs_api.py (956 → 3)
- teacher_dashboard_api.py (951 → 3), services/pdf_service.py (916 → 3)
- mail/mail_db.py (987 → 6)

klausur-service (5 files):
- legal_templates_ingestion.py (942 → 3), ocr_pipeline_postprocess.py (929 → 4)
- ocr_pipeline_words.py (876 → 3), ocr_pipeline_ocr_merge.py (616 → 2)
- KorrekturPage.tsx (956 → 6)

website (5 pages):
- mail (985 → 9), edu-search (958 → 8), mac-mini (950 → 7)
- ocr-labeling (946 → 7), audit-workspace (871 → 4)

studio-v2 (5 files + 1 deleted):
- page.tsx (946 → 5), MessagesContext.tsx (925 → 4)
- korrektur (914 → 6), worksheet-cleanup (899 → 6)
- useVocabWorksheet.ts (888 → 3)
- Deleted dead page-original.tsx (934 LOC)

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

studio-v2/app/worksheet-cleanup/_components/GlassCard.tsx

@@ -0,0 +1,49 @@
+'use client'
+
+import { useState, useEffect } from 'react'
+
+interface GlassCardProps {
+  children: React.ReactNode
+  className?: string
+  onClick?: () => void
+  size?: 'sm' | 'md' | 'lg'
+  delay?: number
+  isDark?: boolean
+}
+
+export function GlassCard({ children, className = '', onClick, size = 'md', delay = 0, isDark = true }: GlassCardProps) {
+  const [isVisible, setIsVisible] = useState(false)
+  const [isHovered, setIsHovered] = useState(false)
+
+  useEffect(() => {
+    const timer = setTimeout(() => setIsVisible(true), delay)
+    return () => clearTimeout(timer)
+  }, [delay])
+
+  const sizeClasses = { sm: 'p-4', md: 'p-5', lg: 'p-6' }
+
+  return (
+    <div
+      className={`rounded-3xl ${sizeClasses[size]} ${onClick ? 'cursor-pointer' : ''} ${className}`}
+      style={{
+        background: isDark
+          ? (isHovered ? 'rgba(255, 255, 255, 0.12)' : 'rgba(255, 255, 255, 0.08)')
+          : (isHovered ? 'rgba(255, 255, 255, 0.9)' : 'rgba(255, 255, 255, 0.7)'),
+        backdropFilter: 'blur(24px) saturate(180%)',
+        WebkitBackdropFilter: 'blur(24px) saturate(180%)',
+        border: isDark ? '1px solid rgba(255, 255, 255, 0.1)' : '1px solid rgba(0, 0, 0, 0.1)',
+        boxShadow: isDark
+          ? '0 4px 24px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.05)'
+          : '0 4px 24px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.5)',
+        opacity: isVisible ? 1 : 0,
+        transform: isVisible ? `translateY(0) scale(${isHovered ? 1.01 : 1})` : 'translateY(20px)',
+        transition: 'all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)',
+      }}
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+      onClick={onClick}
+    >
+      {children}
+    </div>
+  )
+}

studio-v2/app/worksheet-cleanup/_components/PreviewStep.tsx

@@ -0,0 +1,127 @@
+'use client'
+
+import { GlassCard } from './GlassCard'
+import { ProgressRing } from './ProgressRing'
+
+interface PreviewResult {
+  has_handwriting: boolean
+  confidence: number
+  handwriting_ratio: number
+  image_width: number
+  image_height: number
+  estimated_times_ms: {
+    detection: number
+    inpainting: number
+    reconstruction: number
+    total: number
+  }
+}
+
+interface PreviewStepProps {
+  previewResult: PreviewResult
+  previewUrl: string | null
+  maskUrl: string | null
+  removeHandwriting: boolean
+  reconstructLayout: boolean
+  isProcessing: boolean
+  onBack: () => void
+  onCleanup: () => void
+  onGetMask: () => void
+}
+
+export function PreviewStep({
+  previewResult, previewUrl, maskUrl,
+  removeHandwriting, reconstructLayout, isProcessing,
+  onBack, onCleanup, onGetMask
+}: PreviewStepProps) {
+  return (
+    <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+      <GlassCard delay={100}>
+        <h3 className="text-lg font-semibold text-white mb-6">Analyse</h3>
+        <div className="flex justify-around">
+          <ProgressRing
+            progress={previewResult.confidence * 100}
+            label="Konfidenz"
+            value={`${Math.round(previewResult.confidence * 100)}%`}
+            color={previewResult.has_handwriting ? '#f97316' : '#22c55e'}
+          />
+          <ProgressRing
+            progress={previewResult.handwriting_ratio * 100 * 10}
+            label="Handschrift"
+            value={`${(previewResult.handwriting_ratio * 100).toFixed(1)}%`}
+            color="#a78bfa"
+          />
+        </div>
+        <div className={`mt-6 p-4 rounded-xl text-center ${
+          previewResult.has_handwriting ? 'bg-orange-500/20 text-orange-300' : 'bg-green-500/20 text-green-300'
+        }`}>
+          {previewResult.has_handwriting ? 'Handschrift erkannt' : 'Keine Handschrift gefunden'}
+        </div>
+      </GlassCard>
+
+      <GlassCard delay={200}>
+        <h3 className="text-lg font-semibold text-white mb-4">Geschätzte Zeit</h3>
+        <div className="space-y-3">
+          <div className="flex justify-between text-white/70">
+            <span>Erkennung</span>
+            <span className="text-white">~{Math.round(previewResult.estimated_times_ms.detection / 1000)}s</span>
+          </div>
+          {removeHandwriting && previewResult.has_handwriting && (
+            <div className="flex justify-between text-white/70">
+              <span>Bereinigung</span>
+              <span className="text-white">~{Math.round(previewResult.estimated_times_ms.inpainting / 1000)}s</span>
+            </div>
+          )}
+          {reconstructLayout && (
+            <div className="flex justify-between text-white/70">
+              <span>Layout</span>
+              <span className="text-white">~{Math.round(previewResult.estimated_times_ms.reconstruction / 1000)}s</span>
+            </div>
+          )}
+          <div className="flex justify-between pt-3 border-t border-white/10 font-medium">
+            <span className="text-white">Gesamt</span>
+            <span className="text-purple-300">~{Math.round(previewResult.estimated_times_ms.total / 1000)}s</span>
+          </div>
+        </div>
+      </GlassCard>
+
+      <GlassCard delay={300}>
+        <h3 className="text-lg font-semibold text-white mb-4">Bild-Info</h3>
+        <div className="space-y-3">
+          <div className="flex justify-between text-white/70"><span>Breite</span><span className="text-white">{previewResult.image_width}px</span></div>
+          <div className="flex justify-between text-white/70"><span>Höhe</span><span className="text-white">{previewResult.image_height}px</span></div>
+          <div className="flex justify-between text-white/70"><span>Pixel</span><span className="text-white">{(previewResult.image_width * previewResult.image_height / 1000000).toFixed(1)}MP</span></div>
+        </div>
+        <button onClick={onGetMask}
+          className="w-full mt-4 px-4 py-2 rounded-xl bg-white/10 text-white/70 hover:bg-white/20 hover:text-white transition-all text-sm">
+          Maske anzeigen
+        </button>
+      </GlassCard>
+
+      <GlassCard className="col-span-1 lg:col-span-2" delay={400}>
+        <h3 className="text-lg font-semibold text-white mb-4">Original</h3>
+        {previewUrl && <img src={previewUrl} alt="Original" className="w-full max-h-96 object-contain rounded-xl" />}
+      </GlassCard>
+
+      {maskUrl && (
+        <GlassCard delay={500}>
+          <h3 className="text-lg font-semibold text-white mb-4">Maske</h3>
+          <img src={maskUrl} alt="Mask" className="w-full max-h-96 object-contain rounded-xl" />
+        </GlassCard>
+      )}
+
+      <div className="col-span-1 lg:col-span-3 flex justify-center gap-4">
+        <button onClick={onBack}
+          className="px-6 py-3 rounded-xl bg-white/10 text-white hover:bg-white/20 transition-all flex items-center gap-2">
+          <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 19l-7-7m0 0l7-7m-7 7h18" /></svg>
+          Zurück
+        </button>
+        <button onClick={onCleanup} disabled={isProcessing}
+          className="px-8 py-3 rounded-xl font-semibold bg-gradient-to-r from-orange-500 to-red-500 text-white hover:shadow-lg hover:shadow-orange-500/30 transition-all disabled:opacity-50 flex items-center gap-2">
+          <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z" /></svg>
+          Bereinigen starten
+        </button>
+      </div>
+    </div>
+  )
+}

studio-v2/app/worksheet-cleanup/_components/ProgressRing.tsx

@@ -0,0 +1,47 @@
+'use client'
+
+interface ProgressRingProps {
+  progress: number
+  size?: number
+  strokeWidth?: number
+  label: string
+  value: string
+  color?: string
+}
+
+export function ProgressRing({
+  progress,
+  size = 80,
+  strokeWidth = 6,
+  label,
+  value,
+  color = '#a78bfa'
+}: ProgressRingProps) {
+  const radius = (size - strokeWidth) / 2
+  const circumference = radius * 2 * Math.PI
+  const offset = circumference - (progress / 100) * circumference
+
+  return (
+    <div className="flex flex-col items-center">
+      <div className="relative" style={{ width: size, height: size }}>
+        <svg className="transform -rotate-90" width={size} height={size}>
+          <circle
+            cx={size / 2} cy={size / 2} r={radius}
+            fill="none" stroke="rgba(255, 255, 255, 0.1)" strokeWidth={strokeWidth}
+          />
+          <circle
+            cx={size / 2} cy={size / 2} r={radius}
+            fill="none" stroke={color} strokeWidth={strokeWidth}
+            strokeDasharray={circumference} strokeDashoffset={offset}
+            strokeLinecap="round"
+            style={{ transition: 'stroke-dashoffset 0.5s ease' }}
+          />
+        </svg>
+        <div className="absolute inset-0 flex items-center justify-center">
+          <span className="text-lg font-bold text-white">{value}</span>
+        </div>
+      </div>
+      <span className="mt-2 text-xs text-white/50">{label}</span>
+    </div>
+  )
+}

studio-v2/app/worksheet-cleanup/_components/ResultStep.tsx

@@ -0,0 +1,87 @@
+'use client'
+
+import { GlassCard } from './GlassCard'
+
+interface PipelineResult {
+  success: boolean
+  handwriting_detected: boolean
+  handwriting_removed: boolean
+  layout_reconstructed: boolean
+  cleaned_image_base64?: string
+  fabric_json?: any
+  metadata: any
+}
+
+interface ResultStepProps {
+  pipelineResult: PipelineResult
+  previewUrl: string | null
+  cleanedUrl: string | null
+  onReset: () => void
+  onOpenInEditor: () => void
+}
+
+export function ResultStep({ pipelineResult, previewUrl, cleanedUrl, onReset, onOpenInEditor }: ResultStepProps) {
+  return (
+    <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+      <GlassCard className="col-span-1 lg:col-span-2" delay={100}>
+        <div className={`flex items-center gap-4 ${pipelineResult.success ? 'text-green-300' : 'text-red-300'}`}>
+          <div className={`w-12 h-12 rounded-full flex items-center justify-center ${pipelineResult.success ? 'bg-green-500/20' : 'bg-red-500/20'}`}>
+            {pipelineResult.success ? (
+              <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" /></svg>
+            ) : (
+              <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" /></svg>
+            )}
+          </div>
+          <div>
+            <h3 className="text-xl font-semibold">
+              {pipelineResult.success ? 'Erfolgreich bereinigt!' : 'Verarbeitung fehlgeschlagen'}
+            </h3>
+            <p className="text-white/50">
+              {pipelineResult.handwriting_removed
+                ? `Handschrift wurde entfernt. ${pipelineResult.metadata?.layout?.element_count || 0} Elemente erkannt.`
+                : pipelineResult.handwriting_detected
+                  ? 'Handschrift erkannt, aber nicht entfernt'
+                  : 'Keine Handschrift im Bild gefunden'}
+            </p>
+          </div>
+        </div>
+      </GlassCard>
+
+      <GlassCard delay={200}>
+        <h3 className="text-lg font-semibold text-white mb-4">Original</h3>
+        {previewUrl && <img src={previewUrl} alt="Original" className="w-full rounded-xl" />}
+      </GlassCard>
+
+      <GlassCard delay={300}>
+        <h3 className="text-lg font-semibold text-white mb-4">Bereinigt</h3>
+        {cleanedUrl ? (
+          <img src={cleanedUrl} alt="Cleaned" className="w-full rounded-xl" />
+        ) : (
+          <div className="aspect-video rounded-xl bg-white/5 flex items-center justify-center text-white/40">Kein Bild</div>
+        )}
+      </GlassCard>
+
+      <div className="col-span-1 lg:col-span-2 flex justify-center gap-4">
+        <button onClick={onReset}
+          className="px-6 py-3 rounded-xl bg-white/10 text-white hover:bg-white/20 transition-all flex items-center gap-2">
+          <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" /></svg>
+          Neues Bild
+        </button>
+        {cleanedUrl && (
+          <a href={cleanedUrl} download="bereinigt.png"
+            className="px-6 py-3 rounded-xl bg-white/10 text-white hover:bg-white/20 transition-all flex items-center gap-2">
+            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" /></svg>
+            Download
+          </a>
+        )}
+        {pipelineResult.layout_reconstructed && pipelineResult.fabric_json && (
+          <button onClick={onOpenInEditor}
+            className="px-8 py-3 rounded-xl font-semibold bg-gradient-to-r from-green-500 to-emerald-500 text-white hover:shadow-lg hover:shadow-green-500/30 transition-all flex items-center gap-2">
+            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" /></svg>
+            Im Editor öffnen
+          </button>
+        )}
+      </div>
+    </div>
+  )
+}

studio-v2/app/worksheet-cleanup/_components/UploadStep.tsx

@@ -0,0 +1,125 @@
+'use client'
+
+import { GlassCard } from './GlassCard'
+
+interface UploadStepProps {
+  isDark: boolean
+  previewUrl: string | null
+  file: File | null
+  removeHandwriting: boolean
+  setRemoveHandwriting: (v: boolean) => void
+  reconstructLayout: boolean
+  setReconstructLayout: (v: boolean) => void
+  inpaintingMethod: string
+  setInpaintingMethod: (v: string) => void
+  isPreviewing: boolean
+  onDrop: (e: React.DragEvent) => void
+  onFileSelect: (file: File) => void
+  onPreview: () => void
+  onQRClick: () => void
+}
+
+export function UploadStep({
+  isDark, previewUrl, file,
+  removeHandwriting, setRemoveHandwriting,
+  reconstructLayout, setReconstructLayout,
+  inpaintingMethod, setInpaintingMethod,
+  isPreviewing, onDrop, onFileSelect, onPreview, onQRClick
+}: UploadStepProps) {
+  return (
+    <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+      <GlassCard className="col-span-1" delay={100}>
+        <div
+          className="border-2 border-dashed border-white/20 rounded-2xl p-8 text-center cursor-pointer transition-all hover:border-purple-400/50 hover:bg-white/5 min-h-[280px] flex flex-col items-center justify-center"
+          onDrop={onDrop}
+          onDragOver={(e) => e.preventDefault()}
+          onClick={() => document.getElementById('file-input')?.click()}
+        >
+          <input id="file-input" type="file" accept="image/*"
+            onChange={(e) => e.target.files?.[0] && onFileSelect(e.target.files[0])}
+            className="hidden" />
+          {previewUrl ? (
+            <div className="space-y-4">
+              <img src={previewUrl} alt="Preview" className="max-h-40 mx-auto rounded-xl shadow-2xl" />
+              <p className="text-white font-medium text-sm">{file?.name}</p>
+              <p className="text-white/50 text-xs">Klicke zum Ändern</p>
+            </div>
+          ) : (
+            <>
+              <svg className="w-16 h-16 mx-auto mb-4 text-white/30" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
+              </svg>
+              <p className="text-xl font-semibold text-white mb-2">Datei auswählen</p>
+              <p className="text-white/50 text-sm mb-2">Ziehe ein Bild hierher oder klicke</p>
+              <p className="text-white/30 text-xs">PNG, JPG, JPEG</p>
+            </>
+          )}
+        </div>
+      </GlassCard>
+
+      <GlassCard className="col-span-1" delay={150}>
+        <div
+          className="border-2 border-dashed border-white/20 rounded-2xl p-8 text-center cursor-pointer transition-all hover:border-purple-400/50 hover:bg-white/5 min-h-[280px] flex flex-col items-center justify-center"
+          onClick={onQRClick}
+        >
+          <div className="w-16 h-16 mx-auto mb-4 rounded-xl bg-purple-500/20 flex items-center justify-center">
+            <span className="text-3xl">📱</span>
+          </div>
+          <p className="text-xl font-semibold text-white mb-2">Mit Handy scannen</p>
+          <p className="text-white/50 text-sm mb-2">QR-Code scannen um Foto hochzuladen</p>
+          <p className="text-white/30 text-xs">Im lokalen Netzwerk</p>
+        </div>
+      </GlassCard>
+
+      {file && (
+        <>
+          <GlassCard delay={200}>
+            <h3 className="text-lg font-semibold text-white mb-4">Optionen</h3>
+            <div className="space-y-4">
+              <label className="flex items-center gap-4 cursor-pointer group">
+                <input type="checkbox" checked={removeHandwriting} onChange={(e) => setRemoveHandwriting(e.target.checked)}
+                  className="w-5 h-5 rounded bg-white/10 border-white/20 text-purple-500 focus:ring-purple-500" />
+                <div>
+                  <span className="text-white font-medium group-hover:text-purple-300 transition-colors">Handschrift entfernen</span>
+                  <p className="text-white/40 text-sm">Erkennt und entfernt handgeschriebene Inhalte</p>
+                </div>
+              </label>
+              <label className="flex items-center gap-4 cursor-pointer group">
+                <input type="checkbox" checked={reconstructLayout} onChange={(e) => setReconstructLayout(e.target.checked)}
+                  className="w-5 h-5 rounded bg-white/10 border-white/20 text-purple-500 focus:ring-purple-500" />
+                <div>
+                  <span className="text-white font-medium group-hover:text-purple-300 transition-colors">Layout rekonstruieren</span>
+                  <p className="text-white/40 text-sm">Erstellt bearbeitbare Textblöcke</p>
+                </div>
+              </label>
+            </div>
+          </GlassCard>
+
+          <GlassCard delay={300}>
+            <h3 className="text-lg font-semibold text-white mb-4">Methode</h3>
+            <select value={inpaintingMethod} onChange={(e) => setInpaintingMethod(e.target.value)}
+              className="w-full p-3 rounded-xl bg-white/10 border border-white/20 text-white focus:ring-2 focus:ring-purple-500 focus:border-transparent">
+              <option value="auto">Automatisch (empfohlen)</option>
+              <option value="opencv_telea">OpenCV Telea (schnell)</option>
+              <option value="opencv_ns">OpenCV NS (glatter)</option>
+            </select>
+            <p className="text-white/40 text-sm mt-3">
+              Die automatische Methode wählt die beste Option basierend auf dem Bildinhalt.
+            </p>
+          </GlassCard>
+
+          <div className="col-span-1 lg:col-span-2 flex justify-center">
+            <button onClick={onPreview} disabled={isPreviewing}
+              className="px-8 py-4 rounded-2xl font-semibold text-lg bg-gradient-to-r from-purple-500 to-pink-500 text-white hover:shadow-lg hover:shadow-purple-500/30 transition-all disabled:opacity-50 flex items-center gap-3">
+              {isPreviewing ? (
+                <><div className="w-5 h-5 border-2 border-white border-t-transparent rounded-full animate-spin" />Analysiere...</>
+              ) : (
+                <><svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" /><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" /></svg>Vorschau</>
+              )}
+            </button>
+          </div>
+        </>
+      )}
+    </div>
+  )
+}