# Fix Terminal Container Overflow on Desktop ## Summary On the desktop Terminal page, the terminal container sometimes grows taller than its allocated flex/grid track and acquires its own scrollbar, which in turn causes the outer page to scroll. This happens because the flex container chain from `.terminal-page` down to `.terminal-container` is missing `min-height: 0`, allowing a child with intrinsic content height to expand its parent. ## Scope - `apps/web/src/styles/utilities.css` - `.terminal-page` - `.terminal-page-content` - `.terminal-instance` - `.terminal-wrapper` - `.terminal-container` - `.xterm-viewport` ## Root Cause `.terminal-page-content` is a flex item that receives its height from the flex parent. In CSS flexbox, a flex item's `min-height` defaults to `auto`, which is based on its content. If the xterm.js viewport/canvas renders taller than the available track, the flex item expands to fit it, pushing the page beyond `100vh` and creating a page-level scrollbar. ## Fix 1. Add `min-height: 0` to every flex/grid item in the terminal layout chain so each level respects the constrained height from its parent. 2. Keep `overflow: hidden` on the wrapper/container so xterm.js's internal viewport is the only scroll surface. 3. Ensure `.terminal-container .xterm-viewport` fills the container and does not expand past it. ## Acceptance Criteria - [x] Terminal page never shows an outer vertical scrollbar due to terminal content. - [x] Terminal wrapper and container stay within their allocated track. - [x] xterm.js internal viewport still scrolls normally. - [x] Mobile terminal layout is unaffected. - [x] Quality gates pass: `npm run typecheck`, `npm run lint`, `npm test -- --run`. ## Related - `openspec/specs/tool-terminal` - `openspec/changes/fix-tmux-mouse-config`