diff --git a/packages/web/src/Replay.svelte b/packages/web/src/Replay.svelte
index e5ca2cd..0188739 100644
--- a/packages/web/src/Replay.svelte
+++ b/packages/web/src/Replay.svelte
@@ -997,4 +997,18 @@
     font-size: 0.9rem;
   }
   .playpause { min-width: 3.4rem; }
+  /* A phone: the title takes its own line, the count and the buttons
+     share the next, the caption reads smaller, and the controls fit. */
+  @media (max-width: 640px) {
+    .replay { padding: 0.6rem 0.6rem 0.8rem; }
+    .replay-head { flex-wrap: wrap; gap: 0.4rem 0.6rem; }
+    .replay-title { flex-basis: 100%; font-size: 0.72rem; letter-spacing: 0.1em; }
+    .replay-count { font-size: 0.72rem; }
+    .replay-eyes { white-space: nowrap; }
+    .replay-caption { font-size: 0.72rem; padding: 0.45rem 0.55rem; gap: 0.45rem; }
+    .caption-face { width: 36px; height: 36px; }
+    .caption-status { max-width: 45%; }
+    .replay-controls { gap: 0.35rem; flex-wrap: wrap; }
+    .replay-controls button { min-width: 2.3rem; padding: 0.3rem 0.45rem; font-size: 0.85rem; }
+  }
 </style>
diff --git a/packages/web/src/SharePage.svelte b/packages/web/src/SharePage.svelte
index 68bb6fc..3e5ff3e 100644
--- a/packages/web/src/SharePage.svelte
+++ b/packages/web/src/SharePage.svelte
@@ -78,6 +78,10 @@
 
 <style>
   .share-page {
+    /* Safari's text inflation has no business here: the page is laid
+       out for the phone already. */
+    -webkit-text-size-adjust: 100%;
+    text-size-adjust: 100%;
     min-height: 100vh;
     background: #171a20;
     color: #d8d2c0;