Portal can't send a message on a phone — no Send button, and iOS Return inserts a newline

[SuspiciousStank]

Running the portal natively on macOS (no Docker, EXECUTOR=host) and reaching it
from an iPhone over Tailscale. The desktop experience is great. On a phone there
are four problems, and the first one is blocking.

1. There is no way to send a message

Chat.tsx submits only via onKeyDown:

if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); send(); }

An iOS software keyboard's Return inserts a newline in a <textarea> rather
than firing that handler, and the form has no submit button. So on a phone you
can type but you cannot send — the composer is a dead end.

2. The sidebar leaves no room for the chat

Sidebar.tsx is flex w-64 shrink-0 with no breakpoint. On a 375 px screen it
takes 256 px and leaves 119 px of conversation, which is what makes the whole
thing feel like a shrunken desktop app you have to pan around.

It also means the workspace picker is unreachable on a phone — "New" lives
inside the sidebar, so there is no way to switch projects.

3. The layout is taller than the viewport

The root is flex h-screen, and the flex column has no min-h-0, so the
transcript refuses to shrink and pushes the page past the screen. Measured on a
375×812 viewport:

document.body.scrollHeight  865
window.innerHeight          812

The result is that the whole page scrolls rather than just the transcript, so
any header scrolls out of reach. Separately, h-screen is 100vh, which on iOS
Safari counts the URL bar and hides the composer behind browser chrome.

4. The slash-command menu scrolls the page instead of itself

The picker is absolute bottom-full ... overflow-hidden with no max height and
no internal scrolling. With a handful of commands it fits. With a larger set
(I have a custom extension registering ~10) it runs off the screen and the page
scrolls instead of the list.

---

What I changed locally

All four are working for me now:

• Sidebar.tsx — off-canvas drawer below md with a dimmed backdrop; unchanged
  at md and up (fixed ... -translate-x-full ... md:static md:translate-x-0)
• Chat.tsx — added a Send button next to the textarea; input set to text-base
  below sm, since anything under 16 px makes iOS Safari zoom on focus
• App.tsx — a phone-only header carrying the drawer button, h-[100dvh]
  instead of h-screen, and min-h-0 on the flex column
• the slash picker still needs max-h-* + overflow-y-auto (not done yet)

Desktop is untouched at every step — all the mobile behaviour is below md.

Reporting note

I should be straight with you: I'm not a developer. I run this on my own
hardware and hit these problems using it. The diagnosis and the patches were
done by Claude (Anthropic's coding agent) working in my checkout — it read the
source, measured the overflow in the browser, and wrote the changes. I've
confirmed the result works on my phone, but I can't review the diff line by line
myself, so please treat it as untrusted until you've read it.

Happy to open a PR if the approach looks right to you, or to just leave the
report here if you'd rather do it your own way. Either is fine — I'm getting a
lot of use out of this project either way.