feat(ui): stack the agent log panel in narrow panes

[rigel-mintaka]

This PR is part of a stack containing 3 PRs:

1. main
2. "feat(ui): stack the agent log panel in narrow panes" (this PR)
3. feat(ui): New tab always opens a new tab #1798
4. fix(ui): keep the Bridge Issues/PRs toggle in place #1812

A view panel is now a named inline-size container. Below 560px, the agent
view moves its log panel from a 340px right column into a bottom row
capped at 40% of the height. The handle stays whole, the model and cwd
truncate so Share stays in view, and the minimize caret points down/up.
A ~318px split pane no longer clips the body or header.

Adds the narrow-pane visual shot and refreshes split-view.png, whose
right pane is the narrow agent view. Both are local captures under the
pinned dev shell (DL-399).

Spec-impact: none
Refs RIG-4682

Co-authored-by: Matt Wilkinson matt@rigel.build

Summary

The agent view now fits narrow split panes. Before, a ~318px pane clipped it, because the 340px log panel sat in a right-hand column.

• .view-panel is now a named inline-size container (view-panel). It is the box every routed view fills, in both single and split layouts. An element cannot query its own size, so the query sits on the panel rather than on .agent-view.
• Below 560px of pane width, .agent-view stacks its log panel as a bottom row capped at 40% of the height. The trace scrolls inside that cap. The minimized rail becomes a one-line bottom bar, and the caret points down to minimize and up to expand.
• In the same width range, the agent handle stays on one line, and the model and cwd truncate with an ellipsis so Share stays visible.
• This stacks the panel instead of auto-minimizing it. logOpen is one store signal shared by every pane, so minimizing it for a narrow pane would also close the panel in a wide one.

Verification

• visual-gate: 15 passed.
  • New shot narrow-pane.png: the agent pane of a W V split.
  • Refreshed split-view.png: its right pane is the narrow agent view.
  • Both are local captures under the pinned dev shell (DL-399).
  • With the container query disabled, both shots fail.
  • The other 13 shots, including agent.png (the wide agent view), still match.
• Chromium probe in the split: .agent-view scrollWidth equals clientWidth (318) with the log panel open and minimized. Before the change, scrollWidth was 441.
• compass-ui:stylelint, typecheck and dev-smoke pass, and Biome is clean on the spec. compass-ui:test passes 1292; the 4 env-secrecy tests fail only because a jj workspace has no .git.

Risks

• Containment applies to every view inside .view-panel. Each panel takes its width from its flex parent, never from its content, and overlays render outside it. The 13 unchanged shots cover the other views.
• 560px is a judgment call: it leaves the body about 220px beside a 340px panel.

Compatibility

CSS only. No API or store change.

Documentation

None.

Refs RIG-4682

[trunk-io]

Merging to main in this repository is managed by Trunk.

• To merge this pull request, check the box to the left or comment /trunk merge below.

After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here

[linear-code]

RIG-4439

RIG-4682

[github-actions]

Compass engineering docs preview: https://compass-ux-4682-narrow-agent.compass-eng-docs.pages.dev

Deployed from compass-ux/4682-narrow-agent-view at 209d386.

[trunk-io]

This pull request is queued for merge as part of 1798, which will merge 1652, 1675, 1743, 1755, 1770, 1780, 1787, 1798.

[trunk-io]

This pull request was merged into main as part of stacked PR 1798.