Phone app bar for Tabs and ⋮, and an input bar below the output

[IvoryHeart]

Closes #435. This PR now includes the input bar from #437, which it supersedes, so the proposal lands as one change.

Summary

On phones, three floating capsules and the floating Type button sit over the terminal output. This PR moves the controls into an app bar and puts input in a bar below the output, following Android and iOS conventions.

App bar (first commit)

• Tabs in the app bar shows the focused workspace's tab count. The count turns red when another agent in that workspace is blocked on the user.
• ⋮ opens a menu that shows the same controls as labelled 48px rows: Terminal, Files and Changes first, then Commits, Annotations, History, Ranger and Workspaces. Choosing a row, the backdrop or Close dismisses it.
• On phones the capsules no longer float, and the brand name and version give their space to the app bar; the logo stays.
• The markup and handlers of the existing navs are reused unchanged. Only their presentation moves into the menu.

Input bar (second commit)

• Message…: a full-width field. It opens Composer and focuses the draft within the tap, so the keyboard comes up in one tap, as Raise the keyboard from Type in one tap #436 made the Type button do. With an unsent draft it reads Continue draft… (aria: "Open terminal input, unsent draft"), replacing the old draft dot.
• Terminal button beside it: opens Direct, through the dock's existing focus handoff.
• In flow, not floating: .terminal-main becomes a column on phones, so the bar never covers terminal text.
• During a long-press selection: the bar hides but keeps its height (data-reserved, visibility: hidden). Without that, xterm resizes and the selection is lost.
• Sizes: buttons are 48px and scale with --ui-scale, like the existing touch targets.
• App.tsx loses the floating Type button and the draft state that only it used; mobile-nav.css loses its styles. The desktop coarse-pointer keyboard button is unchanged.

Back (third commit)

The ⋮ menu is a popup layer for the system Back hook from #433, like the tab sheet: the phone's Back closes it first.

The initial JS budget goes from 804 to 805 KiB (804.3 KiB with this change). FEATURES.md describes both bars and the Back order.

Follow-ups if you take this: the collapse toggle and its drag placement have no role on phones any more, and could be removed in a separate PR.

Tests

TerminalView.inputMode.test.ts, new test "the phone input bar opens Composer with its draft focused, or Direct". It checks:

• the label
• Message opens Composer with the draft focused, saves Composer mode, and keeps stdin blocked
• the unsent-draft label and aria text
• Direct opens Direct with the terminal focused

The app bar has no new automated tests; per CONTRIBUTING, UI was checked in a browser.

Validation

• On this branch, rebased on main after Close mobile layers with the phone's Back #433: bun run format:check, bun run lint, bun run typecheck, bun run typecheck:bun and bun run build:site pass. bun run test:quick: 3731 pass, 0 fail.
• Headless Chrome at 412×915 (mobile layout) against a real Herdr backend, on each part before combining:
  • no floating capsules; Tabs shows the count and opens the tab sheet; ⋮ lists all eight controls at 48px; choosing Files opens Files and closes the menu
  • the terminal ends where the input bar begins, and Message opens the dock with focus in the draft
• The same layout ships in a Roamgate-derived app and was tried on a physical phone there. This branch has not been tried on a device.

🤖 Generated with Claude Code

https://claude.ai/code/session_01AWodzpMyqdBcX25EE9HhDG