diff --git a/docs/adr/012-browser-test-mocking-strategy.md b/docs/adr/012-browser-test-mocking-strategy.md
index 763a7649..b1e01ead 100644
--- a/docs/adr/012-browser-test-mocking-strategy.md
+++ b/docs/adr/012-browser-test-mocking-strategy.md
@@ -79,6 +79,8 @@ The following `vi.mock(module, factory)` calls in browser specs are **acceptable
 
 These modules are resolved at static import time (before any test runs). Their `vi.mock` factories are served by birpc synchronously during module graph resolution, not after worker teardown.
 
+**Pattern note:** When an overlay or dropdown contains a navigation link (`<a href="…">`), use `e.preventDefault()` + `goto(path)` in the click handler instead of letting the browser follow the `href`. In a vitest-browser Playwright iframe there is no SvelteKit router, so a real navigation tears down the orchestrator iframe and crashes the test run. The `href` attribute should still be present for right-click / open-in-new-tab semantics.
+
 ---
 
 ## Consequences
diff --git a/frontend/src/lib/activity/ChronikFuerDichBox.svelte b/frontend/src/lib/activity/ChronikFuerDichBox.svelte
index 14a440f1..9cb94c24 100644
--- a/frontend/src/lib/activity/ChronikFuerDichBox.svelte
+++ b/frontend/src/lib/activity/ChronikFuerDichBox.svelte
@@ -79,7 +79,7 @@ function href(n: NotificationItem): string {
 		<ul role="list" class="flex flex-col gap-2">
 			{#each unread as n (n.id)}
 				<li
-					class="fade-in group flex items-start gap-3 rounded-sm p-2 transition-colors hover:bg-canvas"
+					class="chronik-fade-in group flex items-start gap-3 rounded-sm p-2 transition-colors hover:bg-canvas"
 				>
 					<a
 						href={href(n)}
@@ -124,26 +124,3 @@ function href(n: NotificationItem): string {
 		</ul>
 	{/if}
 </section>
-
-<style>
-.fade-in {
-	animation: chronik-fade-in 160ms ease-out;
-}
-
-@keyframes chronik-fade-in {
-	from {
-		opacity: 0;
-		transform: translateY(-4px);
-	}
-	to {
-		opacity: 1;
-		transform: translateY(0);
-	}
-}
-
-@media (prefers-reduced-motion: reduce) {
-	.fade-in {
-		animation: none;
-	}
-}
-</style>
diff --git a/frontend/src/lib/notification/NotificationDropdown.svelte b/frontend/src/lib/notification/NotificationDropdown.svelte
index c94f0a10..32d6b0cf 100644
--- a/frontend/src/lib/notification/NotificationDropdown.svelte
+++ b/frontend/src/lib/notification/NotificationDropdown.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import { goto } from '$app/navigation';
 import { m } from '$lib/paraglide/messages.js';
 import { relativeTime } from '$lib/shared/utils/time';
 import type { NotificationItem } from '$lib/notification/notifications.svelte';
@@ -11,6 +12,12 @@ type Props = {
 };
 
 let { notifications, onMarkRead, onMarkAllRead, onClose }: Props = $props();
+
+function handleViewAll(e: MouseEvent) {
+	e.preventDefault();
+	onClose();
+	goto('/aktivitaeten');
+}
 </script>
 
 <div
@@ -129,7 +136,7 @@ let { notifications, onMarkRead, onMarkAllRead, onClose }: Props = $props();
 	<div class="border-t border-line px-4 py-2">
 		<a
 			href="/aktivitaeten"
-			onclick={onClose}
+			onclick={handleViewAll}
 			class="text-xs font-medium text-ink-2 transition-colors hover:text-ink"
 		>
 			{m.chronik_view_all()}
diff --git a/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts b/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
index d6d983df..e72573be 100644
--- a/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
+++ b/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
@@ -1,8 +1,11 @@
 import { describe, it, expect, vi, afterEach } from 'vitest';
 import { cleanup, render } from 'vitest-browser-svelte';
 import { page } from 'vitest/browser';
+import { goto } from '$app/navigation';
 import NotificationDropdown from './NotificationDropdown.svelte';
 
+vi.mock('$app/navigation', () => ({ goto: vi.fn() }));
+
 afterEach(cleanup);
 
 const makeNotification = (overrides: Record<string, unknown> = {}) => ({
@@ -164,9 +167,12 @@ describe('NotificationDropdown', () => {
 			}
 		});
 
-		await page.getByRole('link').click();
+		const viewAllLink = page.getByRole('link', { name: /alle aktivitäten|view all/i });
+		await expect.element(viewAllLink).toHaveAttribute('href', '/aktivitaeten');
+		await viewAllLink.click();
 
 		expect(onClose).toHaveBeenCalledOnce();
+		expect(goto).toHaveBeenCalledWith('/aktivitaeten');
 	});
 
 	it('renders MENTION items with the mention verb text', async () => {
diff --git a/frontend/src/routes/hilfe/transkription/+page.svelte b/frontend/src/routes/hilfe/transkription/+page.svelte
index 4d48efb3..f13d1751 100644
--- a/frontend/src/routes/hilfe/transkription/+page.svelte
+++ b/frontend/src/routes/hilfe/transkription/+page.svelte
@@ -125,15 +125,3 @@ const klaerungChips = [
 		<p class="font-serif text-sm leading-relaxed text-ink-2">{m.richtlinien_closing_body()}</p>
 	</div>
 </main>
-
-<style>
-@media print {
-	:global(.app-nav) {
-		display: none;
-	}
-
-	@page {
-		margin: 1.5cm;
-	}
-}
-</style>
diff --git a/frontend/src/routes/layout.css b/frontend/src/routes/layout.css
index 85c41e67..f3e289da 100644
--- a/frontend/src/routes/layout.css
+++ b/frontend/src/routes/layout.css
@@ -459,3 +459,34 @@
 		transform: translateX(350%);
 	}
 }
+
+@media print {
+	:global(.app-nav) {
+		display: none;
+	}
+
+	@page {
+		margin: 1.5cm;
+	}
+}
+
+.chronik-fade-in {
+	animation: chronik-fade-in 160ms ease-out;
+}
+
+@keyframes chronik-fade-in {
+	from {
+		opacity: 0;
+		transform: translateY(-4px);
+	}
+	to {
+		opacity: 1;
+		transform: translateY(0);
+	}
+}
+
+@media (prefers-reduced-motion: reduce) {
+	.chronik-fade-in {
+		animation: none;
+	}
+}