refactor(documents): extract Y-axis and X-axis components (#385)

Felix's review named "TimelineAxes" as one of four split targets.
The Y-axis and X-axis don't sit adjacent in the DOM — Y is a flex
sibling of the bars+X column — so two single-purpose components
beats a discriminator-prop component. tickIndicesFor and the
omitTickYear derivation move to TimelineXAxis where they belong.
Closes part 2 of Felix's component-split concern.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

frontend/src/lib/document/TimelineXAxis.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+import { formatTickLabel, tickIndicesFor } from '$lib/document/timeline';
+import { getLocale } from '$lib/paraglide/runtime';
+import type { components } from '$lib/generated/api';
+
+type MonthBucket = components['schemas']['MonthBucket'];
+
+let {
+	filled
+}: {
+	filled: MonthBucket[];
+} = $props();
+
+const tickIndices = $derived(tickIndicesFor(filled));
+
+// When all visible buckets share a year, the X-axis omits the year so a
+// 12-month zoom reads as "Jan Feb Mär…" without repetition.
+const omitTickYear = $derived.by(() => {
+	if (filled.length === 0 || filled[0].month.length === 4) return false;
+	const firstYear = filled[0].month.slice(0, 4);
+	return filled.every((b) => b.month.slice(0, 4) === firstYear);
+});
+</script>
+
+<div
+	class="relative mt-1 h-4 font-sans text-xs leading-none text-ink-3"
+	aria-hidden="true"
+	data-testid="timeline-x-axis"
+>
+	{#each tickIndices as idx (filled[idx]?.month)}
+		{@const tickLeftPct = ((idx + 0.5) / filled.length) * 100}
+		<span
+			class="absolute -translate-x-1/2 whitespace-nowrap"
+			data-testid="timeline-x-tick"
+			style="left: {tickLeftPct}%;"
+		>
+			{formatTickLabel(filled[idx].month, getLocale(), omitTickYear)}
+		</span>
+	{/each}
+</div>