fix: homepage overlay blocker and carousel auto-advance

- Add pointer-events:none to ListeningMode fly-transition wrapper div in
  +layout.svelte so the exiting animation div never blocks page interaction
- Add pointer-events:auto to ListeningMode root div so it still captures
  all touch/click events correctly despite the parent being pointer-events:none
- Rewrite carousel auto-advance using $effect + autoAdvanceSeed pattern:
  replaces the stale-closure setInterval in resetAutoAdvance() with a
  reactive $effect that owns the interval and re-starts cleanly on manual
  navigation by bumping a seed counter

ui/src/lib/components/ListeningMode.svelte

@@ -256,6 +256,7 @@
 		transition: {isDragging ? 'none' : 'transform 0.32s cubic-bezier(0.32,0.72,0,1), opacity 0.32s ease'};
 		will-change: transform;
 		touch-action: pan-x;
+		pointer-events: auto;
 	"
 	ontouchstart={onTouchStart}
 	ontouchend={onTouchEnd}

ui/src/routes/+layout.svelte

@@ -954,7 +954,7 @@
 <!-- Listening mode — mounted at root level, independent of audioStore.active,
      so closing/pausing audio never tears it down and loses context. -->
 {#if listeningModeOpen}
-	<div transition:fly={{ y: '100%', duration: 320, opacity: 1 }}>
+	<div transition:fly={{ y: '100%', duration: 320, opacity: 1 }} style="pointer-events: none;">
 		<ListeningMode
 			onclose={() => { listeningModeOpen = false; listeningModeChapters = false; }}
 			openChapters={listeningModeChapters}

ui/src/routes/+page.svelte

@@ -95,22 +95,28 @@
 		resetAutoAdvance();
 	}
 
-	let autoAdvanceTimer = $state<ReturnType<typeof setInterval> | null>(null);
-
-	function resetAutoAdvance() {
-		if (autoAdvanceTimer) clearInterval(autoAdvanceTimer);
-		if (heroBooks.length > 1) {
-			autoAdvanceTimer = setInterval(() => {
-				heroIndex = (heroIndex + 1) % heroBooks.length;
-			}, 6000);
-		}
-	}
+	// Auto-advance carousel every 6 s when there are multiple books.
+	// We use a $state counter as a "restart token" so the $effect can be
+	// re-triggered by manual navigation without reading heroIndex (which would
+	// cause an infinite loop when the interval itself mutates heroIndex).
+	let autoAdvanceSeed = $state(0);
 
 	$effect(() => {
-		resetAutoAdvance();
-		return () => { if (autoAdvanceTimer) clearInterval(autoAdvanceTimer); };
+		if (heroBooks.length <= 1) return;
+		// Subscribe to heroBooks.length and autoAdvanceSeed only — not heroIndex.
+		const len = heroBooks.length;
+		void autoAdvanceSeed; // track the seed
+		const id = setInterval(() => {
+			heroIndex = (heroIndex + 1) % len;
+		}, 6000);
+		return () => clearInterval(id);
 	});
 
+	function resetAutoAdvance() {
+		// Bump the seed to restart the interval after manual navigation.
+		autoAdvanceSeed++;
+	}
+
 	function playChapter(slug: string, chapter: number) {
 		audioStore.autoStartChapter = chapter;
 		goto(`/books/${slug}/chapters/${chapter}`);