feat(mvp): phase 7 - UI polish & ambient backgrounds

Add layout system (sidebar, header, main layout), dark/light/system theme
with HSL customization, 3 ambient backgrounds (mesh gradient, particle field,
aurora), Cmd/Ctrl+K search dialog, page transitions, card hover effects,
status pulse animations, skeleton loaders, and responsive design. Polish
all existing pages with consistent theming.

src/routes/+layout.svelte

@@ -2,10 +2,34 @@
 	import '../app.css';
 	import type { Snippet } from 'svelte';
 	import type { LayoutData } from './$types.js';
+	import MainLayout from '$lib/components/layout/MainLayout.svelte';
+	import { page } from '$app/stores';
+	import { fade } from 'svelte/transition';
 
 	let { data, children }: { data: LayoutData; children: Snippet } = $props();
+
+	// Pages that should NOT have the main layout (login, register)
+	const noLayoutPaths = ['/login', '/register'];
+	const showLayout = $derived(!noLayoutPaths.includes($page.url.pathname));
+
+	const pageKey = $derived($page.url.pathname);
 </script>
 
-<div class="dark min-h-screen">
-	{@render children()}
-</div>
+{#if showLayout}
+	<MainLayout
+		user={data.user ?? null}
+		boards={data.sidebarBoards ?? []}
+	>
+		{#key pageKey}
+			<div in:fade={{ duration: 150, delay: 75 }} out:fade={{ duration: 75 }}>
+				{@render children()}
+			</div>
+		{/key}
+	</MainLayout>
+{:else}
+	{#key pageKey}
+		<div in:fade={{ duration: 150, delay: 75 }} out:fade={{ duration: 75 }}>
+			{@render children()}
+		</div>
+	{/key}
+{/if}