rosary: server-side streak fetch, remove aggressive polling

- Fetch streak data in +page.server.ts for logged-in users via API
- Initialize store once with server data, sync only runs once
- Only poll for reconnection in PWA mode when offline with pending changes
- Extract FireEffect to separate component with burst animation
- Convert StreakAura/StreakCounter to Svelte 5 runes ($props, $state, $derived)
- Fix SSR flash by using server data for initial render

src/lib/components/StreakAura.svelte

@@ -1,13 +1,21 @@
 <script lang="ts">
-	export let value: number = 0;
+	import FireEffect from './FireEffect.svelte';
 
-	const phase =
+	interface Props {
+		value?: number;
+		burst?: boolean;
+	}
+
+	let { value = 0, burst = false }: Props = $props();
+
+	const phase = $derived(
 		value >= 365 ? 6 :
 		value >= 180 ? 5 :
 		value >= 90  ? 4 :
 		value >= 30  ? 3 :
-		value >= 14  ? 2 :   // NEW: particles only
-		value >= 7   ? 1 : 0;
+		value >= 14  ? 2 :
+		value >= 7   ? 1 : 0
+	);
 </script>
 
 <div class="aura phase-{phase}" class:holy-fire={phase>=4}>
@@ -33,36 +41,13 @@
 	{/if}
 
 
-{#if phase >= 2}
-	<div class="fire">
-		<div class="fire-left">
-			{#if phase >= 3}
-				<div class="main-fire"></div>
-			{/if}
-			<div class="particle-fire"></div>
-		</div>
+	{#if phase >= 2}
+		<FireEffect holy={phase>=4} />
+	{/if}
 
-		<div class="fire-center">
-			{#if phase >= 3}
-				<div class="main-fire"></div>
-			{/if}
-			<div class="particle-fire"></div>
-		</div>
-
-		<div class="fire-right">
-			{#if phase >= 3}
-				<div class="main-fire"></div>
-			{/if}
-			<div class="particle-fire"></div>
-		</div>
-
-		<div class="fire-bottom">
-			{#if phase >= 3}
-				<div class="main-fire"></div>
-			{/if}
-		</div>
-	</div>
-{/if}
+	{#if burst}
+		<FireEffect holy={phase>=4} burst />
+	{/if}
 
 	<span class="number">{value}</span>
 </div>