feat(timeline): frame the undated bucket with a dashed border + count (REQ-012)

The "Ohne Datum" section now renders inside a dashed-bordered surface box
whose heading reads "Ohne Datum · {count}", matching the spec's .undated
treatment. The kind/type dispatch (events as pills/bands, letters as cards)
is unchanged; the section stays absent when there are no undated entries.

Refs #833
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/lib/timeline/TimelineView.svelte.spec.ts

@@ -1,5 +1,6 @@
 import { describe, it, expect, afterEach } from 'vitest';
 import { cleanup, render } from 'vitest-browser-svelte';
+import * as m from '$lib/paraglide/messages.js';
 import TimelineView from './TimelineView.svelte';
 import { makeEntry, makeYear, makeTimelineDTO } from './test-factories';
 
@@ -73,6 +74,19 @@ describe('TimelineView', () => {
 		expect(document.querySelector('[data-testid="undated-section"]')).toBeNull();
 	});
 
+	it('frames the undated section with a dashed border and shows the count (REQ-012)', () => {
+		const undated = Array.from({ length: 11 }, (_, i) =>
+			makeEntry({ precision: 'UNKNOWN', eventDate: undefined, documentId: `u-${i}` })
+		);
+		render(TimelineView, { timeline: makeTimelineDTO({ undated }) });
+		const section = document.querySelector('[data-testid="undated-section"]') as HTMLElement;
+		expect(section).not.toBeNull();
+		expect(section.classList.contains('border-dashed')).toBe(true);
+		const h2 = section.querySelector('h2');
+		expect(h2?.textContent).toContain(m.timeline_undated_section());
+		expect(h2?.textContent).toContain('11');
+	});
+
 	it('renders all years and undated entries with personId undefined, no filtering (REQ-025)', () => {
 		render(TimelineView, {
 			timeline: makeTimelineDTO({