cmux-next agent pane: the composer is glass over art, with a top-lit rim
The agent composer, its location strip and the New Tab box painted one solid surface over every backdrop. That was Leo's call on 10-14: "Solid, so it sits as chrome over a wallpaper". On 2026-10-18 he said the composer is too opaque and asked for glass like iOS. This PR is step 1 of the composer glass.
- Over art or a see-through window (
:root[data-cmux-see-through], set bydesktop.ts):--acpmux-composer-surfaceis the solid surface at 60%, so the art shows through the window's tint.- A top-lit rim (
--acpmux-composer-rim, an inset 1px highlight) is added to the composer box and the New Tab box. - The strip reads the same variable, so it stays one fill with the box.
- Opaque windows and Reduce Transparency (both the media query and
data-reduce-transparency) keep the solid surface and no rim. - Legibility: the prompt is primary text, and the window's tint floor already keeps primary text at 4.5:1 over the art (#21783).
- Known edge: in the light
traytop-strip style, the tray tucks 12px under the box and may show faintly through the glass there. - Tour:
composerStates.cssnow routes to the glass tour (path_map.GLASS), so the change is captured over the art. - Step 2, next: WebKit's
backdrop-filtercan't blur the native art behind the web view. Real blur and the Liquid Glass edge refraction need a nativeGlassPanelViewbehind the box, at a rect the page reports, asWebPopupHostalready does for menus.
๐ค Generated with Claude Code
Need help on this PR? Tag @codesmith-bot with what you need.
Summary by cubic
Turns the agent composer, its location strip, and the New Tab box into glass over art instead of one solid surface, per Leo's 2026-10-18 note that the composer is too opaque.
Over art or a see-through window (data-cmux-see-through), the surface is the solid one at 60% opacity with a top-lit inset rim; the strip reads the same variable so it stays one fill with the box. The rim is tone-derived, stays on keyboard focus, and exists as a layer only on glass so it never reads as a second drop shadow next to --elevation-1. Under a strip or queue the ring is drawn once on the card's ::before layer round strip and card together, so the card itself adds only rim and shadow โ no doubled ring or seam. Opaque windows and Reduce Transparency (both the media query and data-reduce-transparency) keep the solid surface with no rim. Under a see-through card the tray's 12px tuck and the strip's foot are masked away so nothing shows through the glass. The composer states tour now routes to the glass tour, and composerStates.css is in the path_map.py glass pattern, so the change is captured over art.
Real blur is a follow-up: WebKit's backdrop-filter can't blur the native art, so it needs a native GlassPanelView behind the box.