diff --git a/frontend/src/routes/geschichten/+page.svelte b/frontend/src/routes/geschichten/+page.svelte
index bdee383b..3e4e681a 100644
--- a/frontend/src/routes/geschichten/+page.svelte
+++ b/frontend/src/routes/geschichten/+page.svelte
@@ -37,7 +37,7 @@ function removePerson(personId: string) {
 }
 </script>
 
-<div class="mx-auto max-w-4xl px-4 py-8">
+<div class="mx-auto max-w-7xl px-4 py-8">
 	<header class="mb-4 flex flex-wrap items-center justify-between gap-3">
 		<h1 class="font-serif text-2xl text-ink">{m.geschichten_index_title()}</h1>
 		{#if data.canBlogWrite}
diff --git a/frontend/src/routes/geschichten/page.svelte.test.ts b/frontend/src/routes/geschichten/page.svelte.test.ts
index 0cb6b8a7..8a34427d 100644
--- a/frontend/src/routes/geschichten/page.svelte.test.ts
+++ b/frontend/src/routes/geschichten/page.svelte.test.ts
@@ -35,6 +35,14 @@ const baseData = (overrides: Record<string, unknown> = {}) => ({
 });
 
 describe('geschichten/+ page', () => {
+	it('uses the same directory width as Dokumente/Personen overviews (max-w-7xl)', async () => {
+		render(GeschichtenListPage, { props: { data: baseData() } });
+
+		const container = document.querySelector('[class*="mx-auto"]');
+		expect(container).not.toBeNull();
+		expect(container!.className).toContain('max-w-7xl');
+	});
+
 	it('renders the page heading', async () => {
 		render(GeschichtenListPage, { props: { data: baseData() } });