perf(landing): share one SSE socket for online counters, respect reduced motion

Header and hero/stats counters each opened their own EventSource to the
online-count stream; a shared subscriber now opens a single socket and
multicasts to every mounted counter. The entrance count-up animation skips
its requestAnimationFrame loop when the user prefers reduced motion.

src/components/live-online-counter.tsx

@@ -1,13 +1,12 @@
 "use client";
 
-import { useEffect, useState } from "react";
 import { AnimatedCounter } from "@/components/animated-counter";
-import { useEventSource } from "@/lib/use-event-source";
+import { useOnlineCount } from "@/lib/online-count-sse";
 
 /**
- * Live animated online-count number. Subscribes to the SSE online-count stream
- * so the stat updates in real-time (multicast) instead of only the initial SSR
- * value, while keeping the entrance counter animation.
+ * Live animated online-count number. Shares a single SSE connection (see
+ * `useOnlineCount`) so the whole page uses one socket instead of one per
+ * counter, while keeping the entrance counter animation.
  */
 export function LiveOnlineCounter({
 	initial,
@@ -16,17 +15,7 @@ export function LiveOnlineCounter({
 	initial: number;
 	suffix?: string;
 }) {
-	const [count, setCount] = useState(initial);
-
-	const { data: onlineStream } = useEventSource<{ count: number }>(
-		"/api/online/count/stream",
-		{ enabled: true },
-	);
-	useEffect(() => {
-		if (onlineStream && typeof onlineStream.count === "number") {
-			setCount(onlineStream.count);
-		}
-	}, [onlineStream]);
+	const count = useOnlineCount(initial);
 
 	return <AnimatedCounter value={count} suffix={suffix} />;
 }