Keep page chat at sidebar width at the 1150px breakpoint

[charan-rathore]

Summary

Keep the page conversation's .live-chat at the available sidebar width instead of its max-content width.

At the 1150px breakpoint, the page assistant shrinks from 360px to 330px. Its chat is a flex child with auto horizontal margins and no explicit width, so it can remain wider than the panel. A normal specialist name plus the chat controls is enough to expose the overflow.

Related: #69. This reproduces a narrower-breakpoint variant at 1150px, not the original report's approximately 1320px. Do not treat this as proof that every case in #69 is fixed.

Regression coverage

The browser test renders the real Chat, ChatTranscript and PageReviewCard components into the page sidebar shell using repository CSS. SDK hooks and voice are mocked; there is no model request or Docker setup. Playwright Chromium checks sidebar containment at 1320, 1150, 901, 900, 700 and 390px. On unmodified main, the test fails at 1150px: sidebar scrollWidth 357 vs clientWidth 329. With the CSS rule, all widths pass.

Validation

• CHROMIUM_EXECUTABLE_PATH=/usr/bin/google-chrome npm test: 49 files, 303 tests passed.
• Targeted browser regression: red on unmodified main, green with the fix.
• npm run typecheck, npm run lint, npm run check-format, npm run build: passed.
• Build emits the existing large-chunk warning; tests emit the existing Vite native-config warning.
• Local runtime: Node 22.23.3. The repository requests Node >=24, so supported-runtime CI still needs to run.
• Browser coverage requires Playwright Chromium installed (npx playwright install chromium), or a local browser path via CHROMIUM_EXECUTABLE_PATH.
• Screenshots use synthetic public fixture content. The local fixture cannot load the mascot asset, so its broken image is a fixture limitation, not part of this fix.

AI-assisted implementation and regression preparation.