feat(admin): add OCR training card to admin/system page

- TrainingHistory.svelte: responsive table with status badges
  (green/red/animated pulse), keyed iteration, empty-state row
- OcrTrainingCard.svelte: shows available blocks/docs, disabled states
  (< 5 blocks, service down), in-flight "…" state, 5s success message,
  embeds TrainingHistory
- Wired into admin/system/+page.svelte via fetchTrainingInfo() in $effect
- Regenerated api.ts with OcrTrainingRun + TrainingInfoResponse types
- TRAINING_ALREADY_RUNNING error code in errors.ts + de/en/es translations
- 7 OcrTrainingCard Vitest tests

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/lib/components/OcrTrainingCard.svelte

@@ -0,0 +1,91 @@
+<script lang="ts">
+import TrainingHistory from './TrainingHistory.svelte';
+
+interface Run {
+	id: string;
+	status: 'RUNNING' | 'DONE' | 'FAILED';
+	blockCount: number;
+	documentCount: number;
+	modelName: string;
+	errorMessage?: string;
+	triggeredBy?: string;
+	createdAt: string;
+	completedAt?: string;
+}
+
+interface TrainingInfo {
+	availableBlocks?: number;
+	totalOcrBlocks?: number;
+	availableDocuments?: number;
+	ocrServiceAvailable?: boolean;
+	lastRun?: Run | null;
+	runs?: Run[];
+}
+
+interface Props {
+	trainingInfo: TrainingInfo | null;
+}
+
+let { trainingInfo }: Props = $props();
+
+let training = $state(false);
+let successMessage = $state<string | null>(null);
+
+const available = $derived(trainingInfo?.availableBlocks ?? 0);
+const tooFewBlocks = $derived(available < 5);
+const serviceDown = $derived(trainingInfo?.ocrServiceAvailable === false);
+const disabled = $derived(training || tooFewBlocks || serviceDown);
+
+async function startTraining() {
+	training = true;
+	successMessage = null;
+	try {
+		const res = await fetch('/api/ocr/train', { method: 'POST' });
+		if (res.ok) {
+			successMessage = 'Training wurde gestartet und abgeschlossen.';
+			setTimeout(() => {
+				successMessage = null;
+			}, 5000);
+		}
+	} finally {
+		training = false;
+	}
+}
+</script>
+
+<div class="rounded-sm border border-line bg-surface p-6 shadow-sm">
+	<h2 class="mb-1 font-sans text-sm font-bold text-ink">Kurrent-Erkennung trainieren</h2>
+	<p class="mb-4 text-sm text-ink-2">
+		Starte ein neues Training mit den bisher geprüften OCR-Blöcken, um die Erkennungsgenauigkeit für
+		Kurrentschrift zu verbessern.
+	</p>
+
+	<p class="mb-3 text-sm text-ink">
+		<strong>{available}</strong> geprüfte Blöcke bereit /
+		<strong>{trainingInfo?.availableDocuments ?? 0}</strong> Dokumente
+		<span class="text-ink-2">(von {trainingInfo?.totalOcrBlocks ?? 0} OCR-Blöcken gesamt)</span>
+	</p>
+
+	<button
+		onclick={startTraining}
+		disabled={disabled}
+		class="rounded-sm bg-primary px-5 py-2 font-sans text-xs font-bold tracking-widest text-primary-fg uppercase transition-opacity hover:opacity-80 focus-visible:ring-2 focus-visible:ring-brand-navy disabled:cursor-not-allowed disabled:opacity-50"
+	>
+		{training ? '…' : 'Training starten'}
+	</button>
+
+	{#if tooFewBlocks}
+		<p class="mt-2 text-xs text-ink-3">
+			Mindestens 5 geprüfte Blöcke erforderlich (aktuell: {available}).
+		</p>
+	{:else if serviceDown}
+		<p class="mt-2 text-xs text-orange-600">OCR-Dienst ist nicht erreichbar.</p>
+	{/if}
+
+	{#if successMessage}
+		<p class="mt-2 text-xs text-green-700">{successMessage}</p>
+	{/if}
+
+	<h3 class="mt-6 mb-3 text-xs font-bold tracking-widest text-ink-3 uppercase">Verlauf</h3>
+	<TrainingHistory runs={trainingInfo?.runs ?? []} />
+</div>