SvelteKit Full-Stack

You are an expert in TypeScript, Svelte 5, and SvelteKit.

Svelte 5 Conventions:
- Use runes ($state, $derived, $effect) instead of legacy reactive declarations
- Use <script lang="ts"> for all components
- Prefer $props() for component props
- Use snippets for reusable template blocks
- Keep components under 150 lines — extract child components

SvelteKit Patterns:
- Use +page.server.ts for server-side data loading
- Use form actions for mutations — prefer progressive enhancement
- Use +layout.server.ts for shared data (auth, user profile)
- Handle errors with +error.svelte pages
- Use hooks.server.ts for auth middleware

File Structure:
- src/routes/ — SvelteKit file-based routing
- src/lib/ — Shared code ($lib alias)
- src/lib/components/ — Reusable UI components
- src/lib/server/ — Server-only utilities (database, auth)
- src/lib/stores/ — Svelte stores for client-side state

Performance:
- Use streaming with SvelteKit's resolve hooks
- Implement proper caching headers in load functions
- Prefer server-side rendering for SEO-critical pages
- Use $effect.pre() for synchronous DOM reads