Responsive console scaling + operator user guide

[aifriend]

Summary

• Fix — responsive scaling: the research console was hard-locked to 1600×1000 (<meta viewport>, .app min/max-width, body { overflow-x: auto }), so any window narrower than 1600px clipped the right edge behind a horizontal scrollbar. The shell now keeps its 1600×1000 design dimensions but is scaled proportionally via a CSS transform: scale(var(--app-scale)), recomputed on load and on every resize from min(innerWidth/1600, innerHeight/1000). body is now a full-viewport centering stage with hidden overflow. Resize freely — nothing is clipped, just shrunk.
• Docs — USER_GUIDE.md: new operator-focused walkthrough of the live console — the three-column layout, the four transport actions (Play / Train / Compare / Replay), the right-column inspector panels, common workflows, an explicit list of which cells are still cosmetic, and a troubleshooting table. Complements the setup/CLI-focused README.md and the API-focused frontend/README.md without duplicating them.

Changes

File	What
frontend/index.html	Standard responsive viewport meta; body as a 100vw × 100vh centering grid; .app scaled via --app-scale transform
frontend/app.js	fitApp() / wireFitApp() — computes the scale factor on load + resize, wired first in init()
USER_GUIDE.md	New — 14-section operator guide

Test plan

• ./start.sh, then resize the browser window from full-screen down to a small window — the whole console scales to fit, no horizontal scrollbar, nothing clipped
• Confirm the canvas/viewport still renders agent frames correctly at non-1600px widths (the render loop reads computed canvas size, so it should follow the scale)
• Open USER_GUIDE.md and spot-check that the four ▶ actions and panel numbering match the current frontend/index.html

🤖 Generated with Claude Code