fix(calendar): ensure i18n locale is loaded before rendering

Wait for svelte-i18n locale to be fully loaded before rendering
child components to prevent "Cannot format a message without first
setting the initial locale" error.

Changes:
- Explicitly set locale on browser init in i18n/index.ts
- Wait for locale in root +layout.svelte before rendering children

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

apps/calendar/apps/web/src/lib/i18n/index.ts

@@ -35,11 +35,17 @@ function getInitialLocale(): SupportedLocale {
 }
 
 // Initialize i18n at module scope (required for SSR)
+// Always set initialLocale to ensure it's never undefined
 init({
 	fallbackLocale: defaultLocale,
-	initialLocale: getInitialLocale(),
+	initialLocale: browser ? getInitialLocale() : defaultLocale,
 });
 
+// On browser, also explicitly set locale to ensure it's loaded
+if (browser) {
+	locale.set(getInitialLocale());
+}
+
 // Set locale and persist to localStorage
 export function setLocale(newLocale: SupportedLocale) {
 	locale.set(newLocale);

apps/calendar/apps/web/src/routes/+layout.svelte

@@ -1,5 +1,7 @@
 <script lang="ts">
 	import '../app.css';
+	// Initialize i18n early - must be imported before any component that uses $_
+	import { waitLocale } from '$lib/i18n';
 	import { onMount } from 'svelte';
 	import { theme } from '$lib/stores/theme';
 	import { authStore } from '$lib/stores/auth.svelte';
@@ -11,6 +13,9 @@
 	let loading = $state(true);
 
 	onMount(async () => {
+		// Wait for i18n locale to be loaded
+		await waitLocale();
+
 		// Initialize theme
 		theme.initialize();