From 238ad7602ec9afdca8b40e635bc0cfb1dd774af4 Mon Sep 17 00:00:00 2001
From: "Esteve J." <esteve@gsv.space>
Date: Tue, 13 Oct 2026 09:37:12 +0200
Subject: [PATCH 1/2] fix horizontal chat overflow

---
 docs/architecture/conversations.md          | 2 ++
 web/src/app/features/instrument/zen/zen.css | 8 ++++++++
 2 files changed, 10 insertions(+)

diff --git a/docs/architecture/conversations.md b/docs/architecture/conversations.md
index 329d69b32..c6d9a7d6a 100644
--- a/docs/architecture/conversations.md
+++ b/docs/architecture/conversations.md
@@ -16,6 +16,8 @@ Long lines scroll inside the block. Copy preserves indentation and internal line
 adding the renderer's final newline to the clipboard.
 Chat renders human messages as plain text with clickable web URLs. External web links in human
 messages and Ship's Markdown replies open in a new tab.
+The Chat transcript scrolls vertically. Long words, URLs and compaction notes wrap within the
+reading column; wide tables and code blocks scroll horizontally within their own bounds.
 When the reader scrolls above the latest chat message, a small button returns the transcript to
 the bottom and resumes following new replies.
 
diff --git a/web/src/app/features/instrument/zen/zen.css b/web/src/app/features/instrument/zen/zen.css
index aa40dd675..6794c679f 100644
--- a/web/src/app/features/instrument/zen/zen.css
+++ b/web/src/app/features/instrument/zen/zen.css
@@ -40,6 +40,7 @@
 }
 .zen-moments {
   position: relative;
+  overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
   scrollbar-width: none;
@@ -82,6 +83,7 @@
   margin: 0 auto;
   width: 100%;
   padding: 2.2vh 0;
+  overflow-wrap: anywhere;
 }
 .zen-moment.is-older { opacity: 0.55; }
 .zen-moment.is-work { padding-block: 1vh; }
@@ -156,6 +158,12 @@
 }
 .zen-moment .text p { margin: 0 0 0.6em; }
 .zen-moment .text p:last-child { margin-bottom: 0; }
+.zen-moment .text table {
+  display: block;
+  max-width: 100%;
+  overflow-x: auto;
+  overflow-wrap: normal;
+}
 .zen-moment .text :not(pre) > code {
   font-family: var(--gsv-font-mono);
   font-size: 0.72em;

From 431d1836e74e6a16d6996e136cc283b66fdf3aaa Mon Sep 17 00:00:00 2001
From: "Esteve J." <esteve@gsv.space>
Date: Tue, 13 Oct 2026 13:09:58 +0200
Subject: [PATCH 2/2] keep the browse cursor inside the mobile gutter

---
 web/src/app/features/instrument/zen/zen.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/app/features/instrument/zen/zen.css b/web/src/app/features/instrument/zen/zen.css
index 6794c679f..38e65a4be 100644
--- a/web/src/app/features/instrument/zen/zen.css
+++ b/web/src/app/features/instrument/zen/zen.css
@@ -79,7 +79,7 @@
 .zen-history-status.is-err { color: var(--error); }
 .zen-moment {
   flex-shrink: 0;
-  max-width: min(var(--measure-response), 92%);
+  max-width: min(var(--measure-response), 92%, calc(100% - 24px));
   margin: 0 auto;
   width: 100%;
   padding: 2.2vh 0;
@@ -506,7 +506,7 @@
 .zen-moment.is-focus::before {
   content: "";
   position: absolute;
-  left: -22px;
+  left: clamp(-22px, -4%, -12px);
   top: 2.2vh;
   width: 8px;
   height: 1.1em;