feat(#240): Mission Control Strip frontend — 5 components + dashboard wiring

Adds the full-width 3-column collaboration widget below the existing
dashboard grid. Renders without the backend running (Promise.allSettled
isolation keeps failures silent).

Components (src/lib/components/):
- ExpertBadge.svelte — purple pill with icon, no props
- SegmentationColumn.svelte — col 1: links to /enrich/{id}, weekly pulse
- TranscriptionColumn.svelte — col 2: per-doc progress bar when blocks exist
- ReadyColumn.svelte — col 3: mint border when filled, dashed empty state
- MissionControlStrip.svelte — strip wrapper, 1-col mobile / 3-col sm+

i18n: 19 new keys added to de/en/es (mission_control_*)

Page wiring:
- +page.server.ts: 4 new Promise.allSettled calls for segmentation-queue,
  transcription-queue, ready-to-read, weekly-stats; all failures silent
- +page.svelte: MissionControlStrip rendered below the grid in isDashboard

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

frontend/src/lib/components/ExpertBadge.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+</script>
+
+<span
+	class="inline-flex items-center gap-1 rounded border border-purple-200 bg-purple-50 px-2 py-0.5 text-xs font-semibold text-purple-700"
+>
+	<svg
+		class="h-4 w-4 shrink-0"
+		viewBox="0 0 16 16"
+		fill="none"
+		aria-hidden="true"
+		xmlns="http://www.w3.org/2000/svg"
+	>
+		<path
+			d="M8 1.5L1.5 13.5h13L8 1.5z"
+			stroke="currentColor"
+			stroke-width="1.5"
+			stroke-linejoin="round"
+			fill="none"
+		/>
+		<path d="M8 6v3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+		<circle cx="8" cy="11.5" r="0.75" fill="currentColor" />
+	</svg>
+	{m.mission_control_expert_badge()}
+</span>

frontend/src/lib/components/MissionControlStrip.svelte

@@ -0,0 +1,45 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+import SegmentationColumn from './SegmentationColumn.svelte';
+import TranscriptionColumn from './TranscriptionColumn.svelte';
+import ReadyColumn from './ReadyColumn.svelte';
+
+type TranscriptionQueueItemDTO = {
+	id: string;
+	title: string;
+	documentDate?: string;
+	needsExpert: boolean;
+	annotationCount: number;
+	textedBlockCount: number;
+	reviewedBlockCount: number;
+};
+
+type TranscriptionWeeklyStatsDTO = {
+	segmentationCount: number;
+	transcriptionCount: number;
+	readyCount: number;
+};
+
+interface Props {
+	segmentationDocs: TranscriptionQueueItemDTO[];
+	transcriptionDocs: TranscriptionQueueItemDTO[];
+	readyDocs: TranscriptionQueueItemDTO[];
+	weeklyStats: TranscriptionWeeklyStatsDTO | null;
+}
+
+let { segmentationDocs, transcriptionDocs, readyDocs, weeklyStats }: Props = $props();
+</script>
+
+<section class="mt-4 rounded-sm border border-line bg-white p-6">
+	<h2 class="mb-4 font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
+		{m.mission_control_heading()}
+	</h2>
+	<div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
+		<SegmentationColumn docs={segmentationDocs} weeklyCount={weeklyStats?.segmentationCount ?? 0} />
+		<TranscriptionColumn
+			docs={transcriptionDocs}
+			weeklyCount={weeklyStats?.transcriptionCount ?? 0}
+		/>
+		<ReadyColumn docs={readyDocs} weeklyCount={weeklyStats?.readyCount ?? 0} />
+	</div>
+</section>

frontend/src/lib/components/ReadyColumn.svelte

@@ -0,0 +1,86 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+import { getLocale } from '$lib/paraglide/runtime.js';
+
+type TranscriptionQueueItemDTO = {
+	id: string;
+	title: string;
+	documentDate?: string;
+	needsExpert: boolean;
+	annotationCount: number;
+	textedBlockCount: number;
+	reviewedBlockCount: number;
+};
+
+interface Props {
+	docs: TranscriptionQueueItemDTO[];
+	weeklyCount: number;
+}
+
+let { docs, weeklyCount }: Props = $props();
+
+function formatDate(dateStr: string): string {
+	return new Intl.DateTimeFormat(getLocale(), {
+		day: 'numeric',
+		month: 'short',
+		year: 'numeric'
+	}).format(new Date(dateStr + 'T12:00:00'));
+}
+
+function reviewedPct(doc: TranscriptionQueueItemDTO): number {
+	if (doc.textedBlockCount === 0) return 0;
+	return Math.round((doc.reviewedBlockCount / doc.textedBlockCount) * 100);
+}
+</script>
+
+{#if docs.length > 0}
+	<div class="rounded-sm border border-brand-mint bg-brand-mint/10 p-4">
+		<div class="mb-1 flex items-center gap-2">
+			<h3 class="font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
+				{m.mission_control_ready_heading()}
+			</h3>
+			{#if weeklyCount > 0}
+				<span class="rounded-full bg-green-50 px-2 py-0.5 text-xs font-semibold text-green-700">
+					{m.mission_control_weekly_pulse({ count: weeklyCount })}
+				</span>
+			{/if}
+		</div>
+		<p class="mt-1 mb-3 text-xs text-gray-400">
+			{m.mission_control_ready_description()}
+		</p>
+		<ul class="space-y-1">
+			{#each docs as doc (doc.id)}
+				<li>
+					<a
+						href="/documents/{doc.id}"
+						class="flex min-h-[44px] flex-col justify-center rounded px-1 py-2 hover:bg-brand-mint/20 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-offset-2 focus-visible:outline-none"
+					>
+						<span class="font-serif text-sm text-ink">{doc.title}</span>
+						<div class="mt-0.5 flex items-center gap-2">
+							{#if doc.documentDate}
+								<span class="text-xs text-gray-400">{formatDate(doc.documentDate)}</span>
+							{/if}
+							{#if doc.textedBlockCount > 0}
+								<span class="text-xs text-gray-500">
+									{m.mission_control_reviewed_pct({ pct: reviewedPct(doc) })}
+								</span>
+							{/if}
+						</div>
+					</a>
+				</li>
+			{/each}
+		</ul>
+	</div>
+{:else}
+	<div
+		class="flex min-h-[120px] flex-col items-center justify-center rounded-sm border border-dashed border-brand-mint bg-brand-mint/5 p-6 text-center"
+	>
+		<p class="text-xs text-gray-400">{m.mission_control_ready_empty()}</p>
+		<a
+			href="/enrich"
+			class="mt-2 inline-flex items-center gap-1 rounded text-xs font-semibold text-brand-navy hover:underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-offset-2 focus-visible:outline-none"
+		>
+			{m.mission_control_ready_empty_cta()}
+		</a>
+	</div>
+{/if}

frontend/src/lib/components/SegmentationColumn.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+import { getLocale } from '$lib/paraglide/runtime.js';
+import ExpertBadge from './ExpertBadge.svelte';
+
+type TranscriptionQueueItemDTO = {
+	id: string;
+	title: string;
+	documentDate?: string;
+	needsExpert: boolean;
+	annotationCount: number;
+	textedBlockCount: number;
+	reviewedBlockCount: number;
+};
+
+interface Props {
+	docs: TranscriptionQueueItemDTO[];
+	weeklyCount: number;
+}
+
+let { docs, weeklyCount }: Props = $props();
+
+function formatDate(dateStr: string): string {
+	return new Intl.DateTimeFormat(getLocale(), {
+		day: 'numeric',
+		month: 'short',
+		year: 'numeric'
+	}).format(new Date(dateStr + 'T12:00:00'));
+}
+</script>
+
+<div>
+	<div class="mb-1 flex items-center gap-2">
+		<h3 class="font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
+			{m.mission_control_segmentation_heading()}
+		</h3>
+		{#if weeklyCount > 0}
+			<span class="rounded-full bg-green-50 px-2 py-0.5 text-xs font-semibold text-green-700">
+				{m.mission_control_weekly_pulse({ count: weeklyCount })}
+			</span>
+		{/if}
+	</div>
+	<p class="mt-1 mb-3 text-xs text-gray-400">
+		{m.mission_control_segmentation_description()}
+	</p>
+
+	{#if docs.length === 0}
+		<p class="text-xs text-gray-400 italic">{m.mission_control_segmentation_empty()}</p>
+	{:else}
+		<ul class="space-y-1">
+			{#each docs as doc (doc.id)}
+				<li>
+					<a
+						href="/enrich/{doc.id}"
+						class="hover:bg-brand-sand/30 flex min-h-[44px] flex-col justify-center rounded px-1 py-2 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-offset-2 focus-visible:outline-none"
+					>
+						<div class="flex flex-wrap items-center gap-1.5">
+							<span class="font-serif text-sm text-ink">{doc.title}</span>
+							{#if doc.needsExpert}
+								<ExpertBadge />
+							{/if}
+						</div>
+						{#if doc.documentDate}
+							<span class="mt-0.5 text-xs text-gray-400">{formatDate(doc.documentDate)}</span>
+						{/if}
+					</a>
+				</li>
+			{/each}
+		</ul>
+	{/if}
+</div>

frontend/src/lib/components/TranscriptionColumn.svelte

@@ -0,0 +1,94 @@
+<script lang="ts">
+import * as m from '$lib/paraglide/messages.js';
+import { getLocale } from '$lib/paraglide/runtime.js';
+import ExpertBadge from './ExpertBadge.svelte';
+
+type TranscriptionQueueItemDTO = {
+	id: string;
+	title: string;
+	documentDate?: string;
+	needsExpert: boolean;
+	annotationCount: number;
+	textedBlockCount: number;
+	reviewedBlockCount: number;
+};
+
+interface Props {
+	docs: TranscriptionQueueItemDTO[];
+	weeklyCount: number;
+}
+
+let { docs, weeklyCount }: Props = $props();
+
+function formatDate(dateStr: string): string {
+	return new Intl.DateTimeFormat(getLocale(), {
+		day: 'numeric',
+		month: 'short',
+		year: 'numeric'
+	}).format(new Date(dateStr + 'T12:00:00'));
+}
+
+function blockProgress(doc: TranscriptionQueueItemDTO): number {
+	if (doc.annotationCount === 0) return 0;
+	return (doc.textedBlockCount / doc.annotationCount) * 100;
+}
+</script>
+
+<div>
+	<div class="mb-1 flex items-center gap-2">
+		<h3 class="font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
+			{m.mission_control_transcription_heading()}
+		</h3>
+		{#if weeklyCount > 0}
+			<span class="rounded-full bg-green-50 px-2 py-0.5 text-xs font-semibold text-green-700">
+				{m.mission_control_weekly_pulse({ count: weeklyCount })}
+			</span>
+		{/if}
+	</div>
+	<p class="mt-1 mb-3 text-xs text-gray-400">
+		{m.mission_control_transcription_description()}
+	</p>
+
+	{#if docs.length === 0}
+		<p class="text-xs text-gray-400 italic">{m.mission_control_transcription_empty()}</p>
+	{:else}
+		<ul class="space-y-1">
+			{#each docs as doc (doc.id)}
+				<li>
+					<a
+						href="/enrich/{doc.id}"
+						class="hover:bg-brand-sand/30 flex min-h-[44px] flex-col justify-center rounded px-1 py-2 focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-offset-2 focus-visible:outline-none"
+					>
+						<div class="flex flex-wrap items-center gap-1.5">
+							<span class="font-serif text-sm text-ink">{doc.title}</span>
+							{#if doc.needsExpert}
+								<ExpertBadge />
+							{/if}
+						</div>
+						{#if doc.documentDate}
+							<span class="mt-0.5 text-xs text-gray-400">{formatDate(doc.documentDate)}</span>
+						{/if}
+						{#if doc.textedBlockCount > 0}
+							<div class="mt-1.5 flex items-center gap-2">
+								<span class="shrink-0 text-xs text-gray-400">
+									{m.mission_control_blocks_progress({
+										texted: doc.textedBlockCount,
+										total: doc.annotationCount
+									})}
+								</span>
+								<div class="h-1.5 flex-1 overflow-hidden rounded-full bg-gray-200">
+									<div
+										class="h-full rounded-full bg-ink"
+										style="width: {blockProgress(doc).toFixed(0)}%"
+									></div>
+								</div>
+							</div>
+						{:else}
+							<span class="mt-0.5 text-xs text-gray-400 italic">—</span>
+						{/if}
+					</a>
+				</li>
+			{/each}
+		</ul>
+	{/if}
+</div>