responsive-auditlisted

# /responsive-audit End-to-end workflow for finding and fixing mobile/responsive bugs on any web app, with a cloud-viewable before/after page so reviewers don't need to clone or run anything locally. > This is the **global methodology**. Each project should layer a companion file at `.claude/skills/responsive-audit.md` with its specific route list, viewport priorities, auth pattern, and output paths. Both compose. ## Why this exists Without this skill the loop is: capture screenshots manually → eyeball them → ship a patch → hope it stuck. With it, every audit produces: 1. A reproducible probe that catches the actual bugs (overflow, off-viewport CTAs, scroll-affordance gaps) 2. A static cloud-viewable comparison page anyone on the team can review from their phone 3. An E2E suite that prevents the same class of regression from coming back ## When to invoke - User reports a mobile bug ("X is broken on iPhone") - About to ship a UI change that could affect responsive behavior - Before a major release — sweep every page once at every viewport - Periodic baselining (monthly?) to catch slow drift ## The five phases ### Phase 1 — Snapshot the broken state Use [agent-browser](agent-browser:agent-browser) (skill `agent-browser:agent-browser`) to capture every page at every target viewport BEFORE making any code changes. ```bash # Spin up a named session at the target viewport agent-browser --session audit set viewport 375 667 agent-browser --session audit open <BASE_URL>/log