From f669ebbdddb7e78a0613da6fba8f9cf5bd42b285 Mon Sep 17 00:00:00 2001
From: Miguel Palhas <mpalhas@gmail.com>
Date: Wed, 2 Sep 2026 21:53:26 +0100
Subject: [PATCH] fix(maestro): full-screen spawn dialog on mobile

The dialog capped at 92vh and scrolled its whole body, so the Spawn button
sat below the fold on a phone. Below 600px it now fills the viewport, the
pickers drop their own scroll caps, and the actions row sticks to the bottom
edge.
---
 web/src/styles.css | 45 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)

diff --git a/web/src/styles.css b/web/src/styles.css
index f9aafe3..40c4ea1 100644
--- a/web/src/styles.css
+++ b/web/src/styles.css
@@ -2023,6 +2023,51 @@ input.leaf-rename:focus {
   min-height: 0;
 }
 
+/* Mobile: the spawn form is the tallest dialog we have, so it takes the whole
+   screen and lays out as one flex column — header, scrolling body, actions
+   pinned to the bottom edge. Below the fold is where the Submit button used to
+   hide. */
+@media (max-width: 599px) {
+  .modal.spawn-modal {
+    height: 100dvh;
+    max-height: none;
+    border: 0;
+    border-radius: 0;
+  }
+
+  .spawn-modal .spawn-form {
+    flex: 1 1 auto;
+    padding-bottom: 0;
+  }
+
+  /* One scroll box, not four: the pickers' own caps stack scrollable regions
+     inside a screen that is already short. Let them grow and let the form
+     scroll. */
+  .spawn-modal .picker,
+  .spawn-modal .picker.projects,
+  .spawn-modal .picker.wt-choices {
+    max-height: none;
+    overflow-y: visible;
+  }
+
+  /* Rides the bottom of the scroll box: reachable at any scroll position, and
+     `margin-top: auto` keeps it at the screen's foot when the form is short. */
+  .spawn-modal .form-actions {
+    position: sticky;
+    bottom: 0;
+    margin-top: auto;
+    padding: var(--sp-2) 0 calc(var(--sp-2) + env(safe-area-inset-bottom, 0px));
+    background: var(--surface);
+    box-shadow: 0 -8px 12px -8px oklch(0 0 0 / 0.5);
+  }
+
+  .spawn-modal .form-actions .btn {
+    flex: 1 1 0;
+    justify-content: center;
+    min-height: 44px;
+  }
+}
+
 /* ---------- forms ---------- */
 
 .spawn-form {