diff --git a/src/main.ts b/src/main.ts
index a8549d0..4161d5b 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -140,9 +140,24 @@ function showWorld(world: GameWorld) {
     `${world.map.name}. Position ${world.x}, ${world.y}. ${controlsSummary()}`,
   );
 }
+/** The choice box floats above the text box, so it may only be as tall as
+ * the screen above the text box: a phone's start menu then scrolls instead
+ * of running off the top of the screen, where it cannot be tapped. */
+function fitChoiceBox() {
+  const container = get("dialogue-choice");
+  if (container.hidden) return;
+  // The box's own 13px gap above the text box and the 12px inset the text
+  // box keeps from the screen's edges.
+  const room = get("native-dialogue").offsetTop - 13 - 12;
+  container.style.setProperty("--choice-room", `${Math.max(room, 0)}px`);
+}
+new ResizeObserver(fitChoiceBox).observe(get("native-dialogue"));
+new ResizeObserver(fitChoiceBox).observe(canvas.parentElement!);
 function showChoice(choice: Choice | undefined) {
   const container = get("dialogue-choice");
+  const shown = !container.hidden;
   container.hidden = !choice;
+  if (choice && !shown) fitChoiceBox();
   const key = choice ? JSON.stringify(choice) : "";
   if (container.dataset.choice === key) return;
   container.dataset.choice = key;
diff --git a/src/ui/styles.css b/src/ui/styles.css
index f4c7657..409e2fc 100644
--- a/src/ui/styles.css
+++ b/src/ui/styles.css
@@ -346,7 +346,8 @@ dialog h2 {
   justify-content: flex-end;
   gap: 6px;
   max-width: calc(100% + 10px);
-  max-height: min(60vh, 30em);
+  /* --choice-room (main.ts) is the screen's height above the text box. */
+  max-height: min(60vh, 30em, var(--choice-room, 60vh));
   margin: 0;
   overflow-y: auto;
   padding: 10px;