## Summary

This PR makes the full workspace usable from a 320px phone through a wide desktop.

- **Phones and tablets use the same compact workspace through 1199px.** Plan, Decisions, and Conversation are equal destinations in one bottom navigation bar; only one is visible at a time. There is no tablet drawer, duplicate document navigation, or mobile sidebar toggle. - **Desktop split view begins at 1200px.** Conversation sits beside the document only once there is enough room for both. - The room header stays on one line. The document title gets priority; the repository name truncates first. - The document keeps balanced 16–24px gutters, while wide tables, code, diffs, and diagrams scroll inside their own surfaces. - Comments become focused bottom sheets on compact screens, table editing gets labelled touch controls, and menus/toolbars stay inside the visible viewport and above the on-screen keyboard. - Hidden destinations stay mounted so drafts, document selection, scroll position, focus, collaboration, and incoming edits survive navigation and orientation changes. - Planner activity is shown as a spinner inside Conversation navigation; connection state is not shown.

## Current layout

These screenshots were captured from this branch after the final two-mode responsive change.

| Phone — Plan (390×844) | Tablet — Plan (768×1024) | | --- | --- | |  |  |

| Phone — Conversation | Tablet — Conversation | | --- | --- | |  |  |

Phone and tablet deliberately behave alike: Conversation replaces the document instead of covering it.

| Phone — Decisions | Desktop — split workspace (1200×800) | | --- | --- | |  |  |

## Compact interaction states

| Touch table controls | Comment sheet | Planner working | | --- | --- | --- | |  |  |  |

## Verification

- `bun test` — 706 passed, 2 PostgreSQL-dependent skips, 0 failed - `bun run types` — passed - `bun run ci` — passed with 0 warnings/errors; token checks passed - `bun run build` — passed (existing Vite chunk-size warning only) - `E2E_SKIP_BUILD=1 bun scripts/e2e.ts` — 155/155 passed - `git diff --check` — passed

Browser coverage includes 320, 390, 430, 768, 1023, 1024, 1199, 1200, and 1440px widths; phone landscape; 200% zoom; coarse and hybrid pointer input; offset/reduced visual viewports; safe areas; keyboard focus; orientation changes; and draft/selection/scroll preservation.

## Review notes

- Compact destinations are hidden and made inert rather than unmounted. This is what preserves live editor and Conversation state without duplicating either surface. - Floating editor surfaces and the repository picker share visual-viewport observation, while keeping their surface-specific placement rules. - The responsive browser tests concentrate on behavior that requires a real browser: viewport geometry, focus, touch targets, collaboration, and mounted-state continuity. Pure state and geometry rules remain unit tests.

## Remaining real-device check

No physical iPhone or iPad was available. iOS/iPadOS Safari still needs a short human pass for the software keyboard, home-indicator safe area, physical orientation changes, and Safari-specific focus/scroll behavior. Chromium emulation for those states passes, but is not presented as real-device evidence.