rcode-browser-verifylisted

@.rcode/references/karpathy-guidelines.md ## Overview A passing build doesn't mean a working UI. This skill drives Chrome via the DevTools MCP server to inspect actual runtime: DOM nodes, console output, network requests, computed CSS, performance traces, and screenshots. Especially valuable for Three.js (where `getComputedStyle` lies and frame timing is the only truth), scroll-driven UI, and bisecting "works on dev, breaks on prod". ## Pre-flight Chrome DevTools MCP must be available. If not, halt with: *"DevTools MCP not configured. Enable it before running this skill — without browser inspection we'd be guessing from HTML."* ## Workflow 1. **Identify the surface to verify.** A specific URL, route, or component path. 2. **Choose verification mode:** - **Static** — DOM + computed CSS + screenshot (default; fast) - **Dynamic** — record interactions; capture before/after states - **Performance** — trace, FPS, paint flame chart (for Three.js, animations, smooth-scroll libs) - **Network** — failed requests, slow waterfalls, missing resources 3. **Boot the dev server** (or open the prod URL). Confirm it loads without console errors first. 4. **Run the appropriate DevTools queries.** For DOM: `document.querySelector(...).getBoundingClientRect()` etc. For perf: start trace, exercise the surface, stop trace. 5. **Diff against expectation.** Either a stored baseline screenshot or a verbal description from the user. 6. **Report findings** with concrete evidence — pi