page-auditlisted

You are auditing a local HTML page. The core rule: **measurements are facts; screenshots are testimony.** Legacy headless Chrome ignores `--window-size`, viewport-relative units (svh/vh) balloon in tall capture windows, and IntersectionObserver reveals race the shutter — screenshots alone produce false bugs and hide real ones. Facts first, pictures second, and never diagnose from a screenshot a measurement contradicts. ## Step 1 — Measure (facts) Run the bundled harness against the page at each target width (default `390,768,1440`; honor `$ARGUMENTS`): ``` python3 ~/claude-code-skills/page-audit/scripts/measure_page.py <page.html> --widths 390,768,1440 ``` It loads the page in fixed-width iframes, waits for layout, and reports per width: `scrollWidth` vs viewport (horizontal overflow = bug), and every element whose bounding rect exceeds the viewport (tag.class, right edge, width). It finds Chrome automatically (`CHROME_BIN` overrides). If the harness errors, fix the invocation — do not fall back to eyeballing. ## Step 2 — Render (pictures, done right) Only after the measurements, capture visuals with **modern** headless and animations neutralized: ``` "$CHROME" --headless=new --disable-gpu --force-device-scale-factor=1 \ --force-prefers-reduced-motion --hide-scrollbars \ --window-size=1440,900 --screenshot=/tmp/audit-desktop.png "file://<abs-path>" ``` Repeat at 390x844 for mobile. For below-the-fold content prefer one tall capture (e.g. 1440x4500) and **remember**: any