From b2e7dc5b16cffc4fc9b4159cb97af1a24ba79778 Mon Sep 17 00:00:00 2001
From: Git Agent <git@readabook.local>
Date: Wed, 26 Aug 2026 12:39:53 +0200
Subject: [PATCH] =?UTF-8?q?fix(web):=20lecteur=20=E2=80=94=20ancrer=20le?=
 =?UTF-8?q?=20stage=20vertical=20en=20haut=20du=20contenu=20(align-items/a?=
 =?UTF-8?q?lign-self:=20start,=20height=20auto)=20et=20d=C3=A9sactiver=20l?=
 =?UTF-8?q?'overflow-anchor=20du=20stage=20pour=20=C3=A9viter=20le=20centr?=
 =?UTF-8?q?age=20overflow=20au=20milieu=20du=20livre=20sp=C3=A9cifique=20?=
 =?UTF-8?q?=C3=A0=20Firefox=20(7e=20correctif=20bug=20#39)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/src/reader/readerRuntime.test.ts | 10 ++++++++++
 apps/web/src/styles/app.css               |  9 +++++++++
 2 files changed, 19 insertions(+)

diff --git a/apps/web/src/reader/readerRuntime.test.ts b/apps/web/src/reader/readerRuntime.test.ts
index dddefe8..d56d18c 100644
--- a/apps/web/src/reader/readerRuntime.test.ts
+++ b/apps/web/src/reader/readerRuntime.test.ts
@@ -212,6 +212,16 @@ describe("reader runtime helpers", () => {
     expect(verticalBranch).not.toContain('hidden={!imageSizes[item.page]}');
   });
 
+  it("starts vertical reader overflow from the top edge instead of centered content", () => {
+    const styles = readFileSync(new URL("../styles/app.css", import.meta.url), "utf8");
+    const verticalStage = styles.match(/\.reader-mode-vertical \.reader-stage\s*\{[^}]+\}/)?.[0] ?? "";
+    const verticalContent = styles.match(/\.reader-mode-vertical \.reader-content\s*\{[^}]+\}/)?.[0] ?? "";
+
+    expect(verticalStage).toContain("align-items: start");
+    expect(verticalStage).toContain("overflow-anchor: none");
+    expect(verticalContent).toContain("align-self: start");
+  });
+
   it("detects fullscreen support and active fullscreen element", () => {
     const fullscreenElement = { requestFullscreen: () => Promise.resolve() } as unknown as HTMLElement;
     const regularElement = {} as HTMLElement;
diff --git a/apps/web/src/styles/app.css b/apps/web/src/styles/app.css
index 833bf1b..ff0e1f4 100644
--- a/apps/web/src/styles/app.css
+++ b/apps/web/src/styles/app.css
@@ -1035,8 +1035,17 @@ main.app-main-reader .reader-page {
 }
 
 .reader-mode-vertical .reader-content {
+  align-self: start;
   align-items: start;
+  justify-self: stretch;
   width: 100%;
+  height: auto;
+}
+
+.reader-mode-vertical .reader-stage {
+  align-items: start;
+  justify-items: center;
+  overflow-anchor: none;
 }
 
 .pdf-reader,