feat: profile stats, discover history, end-of-chapter sleep, rating-ranked deck

**Profile stats tab**
- New Stats tab on /profile page (Profile / Stats switcher)
- Reading overview: chapters read, completed, reading, plan-to-read counts
- Activity cards: day streak + avg rating given
- Favourite genres (top 3 by frequency across library/progress)
- getUserStats() in pocketbase.ts — computes streak, shelf counts, genre freq

**Discover history tab**
- New History tab on /discover with full voted-book list
- Per-entry: cover thumbnail, title link, author, action label (Liked/Skipped/etc.)
- Undo button: optimistic update + DELETE /api/discover/vote?slug=...
- Clear all history button; tab shows vote count badge
- getVotedBooks(), undoDiscoveryVote() in pocketbase.ts

**Rating-ranked discovery deck**
- getBooksForDiscovery now sorts by community avg rating before returning
- Tier-based shuffle: books within the same ±0.5 star bucket are still randomised
- Higher-rated books surface earlier without making the deck fully deterministic

**End-of-chapter sleep timer**
- New cycle option: Off → End of Chapter → 15m → 30m → 45m → 60m → Off
- sleepAfterChapter flag in AudioStore; layout handles it in onended (skips auto-next)
- Button shows "End Ch." label when active in this mode

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

ui/src/routes/profile/+page.svelte

@@ -184,6 +184,9 @@
 		}, 800) as unknown as number;
 	});
 
+	// ── Tab ──────────────────────────────────────────────────────────────────────
+	let activeTab = $state<'profile' | 'stats'>('profile');
+
 	// ── Sessions ─────────────────────────────────────────────────────────────────
 	type Session = {
 		id: string;
@@ -317,6 +320,23 @@
 		</div>
 	</div>
 
+	<!-- Tabs -->
+	<div class="flex gap-1 bg-(--color-surface-2) rounded-xl p-1 border border-(--color-border)">
+		{#each (['profile', 'stats'] as const) as tab}
+			<button
+				type="button"
+				onclick={() => (activeTab = tab)}
+				class="flex-1 py-2 rounded-lg text-sm font-medium transition-colors
+					{activeTab === tab
+						? 'bg-(--color-surface-3) text-(--color-text) shadow-sm'
+						: 'text-(--color-muted) hover:text-(--color-text)'}"
+			>
+				{tab === 'profile' ? 'Profile' : 'Stats'}
+			</button>
+		{/each}
+	</div>
+
+	{#if activeTab === 'profile'}
 	<!-- ── Subscription ─────────────────────────────────────────────────────────── -->
 	{#if !data.isPro}
 	<section class="bg-(--color-surface-2) rounded-xl border border-(--color-border) p-6">
@@ -565,5 +585,77 @@
 			</ul>
 		{/if}
 	</section>
+	{/if}
+
+	{#if activeTab === 'stats'}
+	<div class="space-y-4">
+
+		<!-- Reading overview -->
+		<section class="bg-(--color-surface-2) rounded-xl border border-(--color-border) p-5">
+			<h2 class="text-sm font-semibold text-(--color-muted) uppercase tracking-wider mb-4">Reading Overview</h2>
+			<div class="grid grid-cols-2 sm:grid-cols-4 gap-3">
+				{#each [
+					{ label: 'Chapters Read', value: data.stats.totalChaptersRead, icon: '📖' },
+					{ label: 'Completed', value: data.stats.booksCompleted, icon: '✅' },
+					{ label: 'Reading', value: data.stats.booksReading, icon: '📚' },
+					{ label: 'Plan to Read', value: data.stats.booksPlanToRead, icon: '🔖' },
+				] as stat}
+					<div class="bg-(--color-surface-3) rounded-lg p-3 text-center">
+						<p class="text-2xl font-bold text-(--color-text) tabular-nums">{stat.value}</p>
+						<p class="text-xs text-(--color-muted) mt-0.5">{stat.label}</p>
+					</div>
+				{/each}
+			</div>
+		</section>
+
+		<!-- Streak + rating -->
+		<section class="bg-(--color-surface-2) rounded-xl border border-(--color-border) p-5">
+			<h2 class="text-sm font-semibold text-(--color-muted) uppercase tracking-wider mb-4">Activity</h2>
+			<div class="grid grid-cols-2 gap-3">
+				<div class="flex items-center gap-3 bg-(--color-surface-3) rounded-lg p-3">
+					<div class="w-9 h-9 rounded-full bg-orange-500/15 flex items-center justify-center text-lg flex-shrink-0">🔥</div>
+					<div>
+						<p class="text-xl font-bold text-(--color-text) tabular-nums">{data.stats.streak}</p>
+						<p class="text-xs text-(--color-muted)">day streak</p>
+					</div>
+				</div>
+				<div class="flex items-center gap-3 bg-(--color-surface-3) rounded-lg p-3">
+					<div class="w-9 h-9 rounded-full bg-yellow-500/15 flex items-center justify-center text-lg flex-shrink-0">⭐</div>
+					<div>
+						<p class="text-xl font-bold text-(--color-text) tabular-nums">
+							{data.stats.avgRatingGiven > 0 ? data.stats.avgRatingGiven.toFixed(1) : '—'}
+						</p>
+						<p class="text-xs text-(--color-muted)">avg rating given</p>
+					</div>
+				</div>
+			</div>
+		</section>
+
+		<!-- Top genres -->
+		{#if data.stats.topGenres.length > 0}
+		<section class="bg-(--color-surface-2) rounded-xl border border-(--color-border) p-5">
+			<h2 class="text-sm font-semibold text-(--color-muted) uppercase tracking-wider mb-3">Favourite Genres</h2>
+			<div class="flex flex-wrap gap-2">
+				{#each data.stats.topGenres as genre, i}
+					<span class="flex items-center gap-1.5 px-3 py-1.5 rounded-full text-sm font-medium
+						{i === 0 ? 'bg-(--color-brand)/20 text-(--color-brand) border border-(--color-brand)/30' : 'bg-(--color-surface-3) text-(--color-text) border border-(--color-border)'}">
+						{#if i === 0}<span class="text-xs">🏆</span>{/if}
+						{genre}
+					</span>
+				{/each}
+			</div>
+		</section>
+		{/if}
+
+		<!-- Dropped books (only if any) -->
+		{#if data.stats.booksDropped > 0}
+		<p class="text-xs text-(--color-muted) text-center">
+			{data.stats.booksDropped} dropped book{data.stats.booksDropped !== 1 ? 's' : ''} —
+			<a href="/books" class="text-(--color-brand) hover:underline">revisit your library</a>
+		</p>
+		{/if}
+
+	</div>
+	{/if}
 
 </div>