Model jumped to building an ffmpeg+Playwright repro harness for a simple CSS bug instead of reading the component code

Environment

• Claude Code v2.1.278, macOS (darwin), terminal
• Model: claude-opus-5 (1M context)

What happened
I reported a simple UI bug in my Nuxt app: a portrait video plays fully on one page but only the top part is visible in the image-viewer component, with two screenshots attached. The answer was directly visible by reading the one component file — the photo pane uses flex centering (percentage max-height resolves against a definite-height container) while the video stage used grid place-items-center (auto row, so max-h-full can't resolve and the portrait video overflows).

Instead of reading the two relevant files first, Claude formed a CSS theory and immediately started building a verification lab: generating a synthetic 1080x1920 test video with ffmpeg and preparing a standalone Playwright page to measure rendered boxes. I had to interrupt the ffmpeg command and tell it to just read the component. Once told, it found the root cause in two file reads and fixed it with a one-line class change.

Expected
For a layout bug with a working reference implementation in the same file, exhaust the cheap evidence first: read the broken code path, compare against the working one, and only reach for browser/ffmpeg tooling if reading is inconclusive.

Actual
Empirical verification machinery was reached for before the cheapest evidence (the code itself) was consumed, wasting user time and requiring a manual interrupt.

Notes
The fix itself was trivial once the code was read: switching the video stage container from grid to the same flex recipe as the sibling photo pane.