diff --git a/frontend/src/lib/shared/discussion/MentionDropdown.svelte b/frontend/src/lib/shared/discussion/MentionDropdown.svelte
index 54ba8ce7..a8186ffe 100644
--- a/frontend/src/lib/shared/discussion/MentionDropdown.svelte
+++ b/frontend/src/lib/shared/discussion/MentionDropdown.svelte
@@ -156,7 +156,7 @@ function selectItem(item: Person) {
 	unauthenticated users.
 -->
 <div
-	class="fixed z-50 w-72 overflow-hidden rounded-sm border border-line bg-surface shadow-lg"
+	class="fixed z-50 w-72 max-w-[calc(100vw-1rem)] overflow-hidden rounded-sm border border-line bg-surface shadow-lg"
 	role="listbox"
 	aria-label={m.person_mention_btn_label()}
 	style:top={position.top}
diff --git a/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts b/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts
index 47549bd5..adf60496 100644
--- a/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts
+++ b/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts
@@ -196,6 +196,14 @@ describe('MentionDropdown — search input', () => {
 		expect(input.value).toBe('A'.repeat(100));
 	});
 
+	it('caps the listbox width to the viewport (320 px reflow guard — Leonie FINDING-MENTION-005)', async () => {
+		render(MentionDropdown, { props: { model: baseModel() } });
+
+		const listbox = document.querySelector('[role="listbox"]') as HTMLElement;
+		expect(listbox).not.toBeNull();
+		expect(listbox.className).toContain('max-w-[calc(100vw-1rem)]');
+	});
+
 	it('invokes onSearch with the current value whenever the user types', async () => {
 		const onSearch = vi.fn();
 		render(MentionDropdown, { props: { model: baseModel(), onSearch } });