diff --git a/web/src/reader/core/reader-context.ts b/web/src/reader/core/reader-context.ts
index 22d2343..7bb3264 100644
--- a/web/src/reader/core/reader-context.ts
+++ b/web/src/reader/core/reader-context.ts
@@ -1,4 +1,5 @@
 import type { ReaderMetadata } from "../../types/reader";
+import { PageCalculationResult } from "../ebook/page-calculator";
 
 type ReaderType = "ebook" | "pdf" | "comic" | "manga";
 
@@ -6,6 +7,9 @@ interface UniversalReader {
   type: "ebook";
   cif: any;
   currentSpineIndex: number;
+  currentPage?: number;
+  pageCalculationResult?: PageCalculationResult;
+  currentScrollPosition?: number;
 }
 
 interface PDFReader {
diff --git a/web/src/reader/core/reader-events.ts b/web/src/reader/core/reader-events.ts
index a04818a..a008b0e 100644
--- a/web/src/reader/core/reader-events.ts
+++ b/web/src/reader/core/reader-events.ts
@@ -6,7 +6,8 @@ type ReaderEventType =
   | "themeChanged"
   | "progressUpdated"
   | "beforePageChange"
-  | "afterPageChange";
+  | "afterPageChange"
+  | "settings:changed";
 
 class EventBus {
   private listeners = new Map<ReaderEventType, Function[]>();
diff --git a/web/src/reader/reader-shell.ts b/web/src/reader/reader-shell.ts
index 4c35235..690ebae 100644
--- a/web/src/reader/reader-shell.ts
+++ b/web/src/reader/reader-shell.ts
@@ -5,6 +5,7 @@ import { createReaderContext, type ReaderContext } from "./core/reader-context";
 import { getState, setState } from "./core/reader-state";
 import { createNavigationAPI } from "./core/reader-navigation";
 import { readerEvents } from "./core/reader-events";
+import { renderSpineItem } from "./core/reader-navigation";
 
 interface UniversalReader {
   type: "ebook";
@@ -142,6 +143,13 @@ async function initializeReader(): Promise<void> {
 
     await initializeFeatures(context);
     readerEvents.emit("readerReady", currentReader);
+    // Render the initial chapter content
+    await renderSpineItem();
+    // Initialize page calculation for dynamic page numbers
+    setTimeout(() => {
+      const { initializePageCalculation } = require("./core/reader-navigation");
+      initializePageCalculation();
+    }, 100);
   } catch (error) {
     console.error("Render initialization failed:", error);
   }
@@ -183,7 +191,13 @@ async function initializeEbookReader(metadata: any): Promise<UniversalReader> {
     metadata.mime_type,
     getFileExtension(metadata.file_path),
   );
-
+  console.log("EPUB Parse Result:", {
+    spineLength: cif.spine?.length,
+    spineItems: cif.spine?.map((s: any) => s.href),
+    tocLength: cif.toc?.length,
+    keys: Object.keys(cif),
+  });
+  console.log("Spine items detail:", JSON.stringify(cif.spine));
   return {
     type: "ebook",
     cif,