feat: add light/dark mode toggle with header view transitions

Add theme cycling (system/light/dark) with localStorage persistence
and FOUC prevention. Restructure CSS color tokens to respond to
data-theme attribute across all components. Redesign header as a
floating glass pill bar with smooth view transitions including
clip-reveal logo animation.

src/lib/components/ThemeToggle.svelte

@@ -0,0 +1,38 @@
+<script>
+	import { themeStore } from '$lib/stores/theme.svelte';
+	import { Sun, Moon, SunMoon } from 'lucide-svelte';
+</script>
+
+<style>
+	button {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 0.3em;
+		border-radius: 100px;
+		background: transparent;
+		color: var(--nav-text);
+		cursor: pointer;
+		transition: all 150ms;
+		border: 1px solid var(--nav-btn-border);
+	}
+	button:hover {
+		color: var(--nav-text-hover);
+		border-color: var(--nav-btn-border-hover);
+		background: var(--nav-hover-bg);
+	}
+</style>
+
+<button
+	onclick={() => themeStore.cycle()}
+	aria-label="Toggle theme ({themeStore.theme})"
+	title="Theme: {themeStore.theme}"
+>
+	{#if themeStore.theme === 'light'}
+		<Sun size={14} strokeWidth={2} />
+	{:else if themeStore.theme === 'dark'}
+		<Moon size={14} strokeWidth={2} />
+	{:else}
+		<SunMoon size={14} strokeWidth={2} />
+	{/if}
+</button>