feat: reading view modes — progress bar, paginated, spacing, width, focus

Five new reader settings (persisted in localStorage as reader_layout_v1):

- Read mode: Scroll (default) vs Pages — paginated mode splits content
  into viewport-height pages, navigate with tap left/right, arrow keys,
  or Prev/Next buttons. Recalculates on content change.

- Line spacing: Tight (1.55) / Normal (1.85) / Loose (2.2) via
  --reading-line-height CSS var on :root.

- Reading width: Narrow (58ch) / Normal (72ch) / Wide (90ch) via
  --reading-max-width CSS var on :root.

- Paragraph style: Spaced (default) vs Indented (text-indent: 2em,
  tight margin — book-like feel).

- Focus mode: hides audio player, language switcher, bottom nav and
  comments so only the text remains.

Scroll progress bar: thin 2px brand-colored bar fixed at top of
viewport in scroll mode, fills as you read through the chapter.

All options added to the floating settings gear panel.

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

ui/src/app.css

@@ -106,12 +106,14 @@ html {
 :root {
 	--reading-font: system-ui, -apple-system, sans-serif;
 	--reading-size: 1.05rem;
+	--reading-line-height: 1.85;
+	--reading-max-width: 72ch;
 }
 
 /* ── Chapter prose ─────────────────────────────────────────────────── */
 .prose-chapter {
-	max-width: 72ch;
-	line-height: 1.85;
+	max-width: var(--reading-max-width, 72ch);
+	line-height: var(--reading-line-height, 1.85);
 	font-family: var(--reading-font);
 	font-size: var(--reading-size);
 	color: var(--color-muted);
@@ -134,6 +136,12 @@ html {
 	margin-bottom: 1.2em;
 }
 
+/* Indented paragraph style — book-like, no gap, indent instead */
+.prose-chapter.para-indented p {
+	text-indent: 2em;
+	margin-bottom: 0.35em;
+}
+
 .prose-chapter em {
 	color: var(--color-muted);
 }
@@ -147,6 +155,31 @@ html {
 	margin: 2em 0;
 }
 
+/* ── Reading progress bar ───────────────────────────────────────────── */
+.reading-progress {
+	position: fixed;
+	top: 0;
+	left: 0;
+	height: 2px;
+	z-index: 100;
+	background: var(--color-brand);
+	pointer-events: none;
+	transition: width 0.1s linear;
+}
+
+/* ── Paginated reader ───────────────────────────────────────────────── */
+.paginated-container {
+	overflow: hidden;
+	cursor: pointer;
+	user-select: none;
+	-webkit-user-select: none;
+}
+
+.paginated-container .prose-chapter {
+	transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+	will-change: transform;
+}
+
 /* ── Hide scrollbars (used on horizontal carousels) ────────────────── */
 .scrollbar-none {
 	scrollbar-width: none;       /* Firefox */