feat(lesereisen): implement lesereisen

frontend/src/lib/geschichte/GeschichteSidebar.svelte

@@ -0,0 +1,82 @@
+<script lang="ts">
+import type { components } from '$lib/generated/api';
+import { m } from '$lib/paraglide/messages.js';
+import PersonMultiSelect from '$lib/person/PersonMultiSelect.svelte';
+import type { PersonOption } from '$lib/person/personOption';
+import StoryDocumentPanel from './StoryDocumentPanel.svelte';
+
+type JourneyItemView = components['schemas']['JourneyItemView'];
+
+interface Props {
+	status: 'DRAFT' | 'PUBLISHED';
+	selectedPersons: PersonOption[];
+	/** When set, the story document panel is rendered (STORY edit only). */
+	geschichteId?: string;
+	items?: JourneyItemView[];
+}
+
+let {
+	status,
+	selectedPersons = $bindable(),
+	geschichteId = undefined,
+	items = []
+}: Props = $props();
+
+const isDraft = $derived(status === 'DRAFT');
+</script>
+
+<aside class="flex flex-col gap-6">
+	<!-- Status section -->
+	<details open class="sm:contents">
+		<summary
+			class="flex min-h-[44px] cursor-pointer items-center px-4 font-sans text-xs font-bold tracking-widest text-ink-3 uppercase sm:hidden"
+		>
+			{m.geschichte_sidebar_status()}
+		</summary>
+		<section class="rounded border border-line bg-surface p-4 shadow-sm">
+			<!-- hidden below sm: the <summary> already shows this label there -->
+			<h2
+				class="mb-1 hidden font-sans text-xs font-bold tracking-widest text-ink-3 uppercase sm:block"
+			>
+				{m.geschichte_sidebar_status()}
+			</h2>
+			<p class="mb-3">
+				<span
+					class="inline-flex items-center rounded px-2 py-1 font-sans text-xs font-bold tracking-widest uppercase {isDraft
+						? 'bg-muted text-ink-2'
+						: 'bg-accent-bg text-ink'}"
+				>
+					{isDraft ? m.geschichte_editor_status_draft() : m.geschichte_editor_status_published()}
+				</span>
+			</p>
+			<p class="font-sans text-xs text-ink-3">
+				{isDraft
+					? m.geschichte_editor_status_draft_hint()
+					: m.geschichte_editor_status_published_hint()}
+			</p>
+		</section>
+	</details>
+
+	<!-- Persons section -->
+	<details open class="sm:contents">
+		<summary
+			class="flex min-h-[44px] cursor-pointer items-center px-4 font-sans text-xs font-bold tracking-widest text-ink-3 uppercase sm:hidden"
+		>
+			{m.geschichte_editor_personen_heading()}
+		</summary>
+		<section class="rounded border border-line bg-surface p-4 shadow-sm">
+			<h2
+				class="mb-2 hidden font-sans text-xs font-bold tracking-widest text-ink-3 uppercase sm:block"
+			>
+				{m.geschichte_editor_personen_heading()}
+			</h2>
+			<p class="mb-3 font-sans text-xs text-ink-3">{m.geschichte_editor_personen_hint()}</p>
+			<PersonMultiSelect bind:selectedPersons={selectedPersons} />
+		</section>
+	</details>
+
+	<!-- Documents section — STORY edit only; journeys manage items in the editor column -->
+	{#if geschichteId}
+		<StoryDocumentPanel geschichteId={geschichteId} items={items} />
+	{/if}
+</aside>