What problem does it solve? Visual regressions like invisible text, clipped components, broken layouts, and stuck hover states often slip through code review because they only appear when a page is actually rendered in a browser across themes and viewport sizes. ## Core Features & Use Cases - Multi-theme, multi-viewport capture: Drives each page through light and dark mode at desktop and mobile (~375px) widths, toggling the data-theme attribute or the MegaNav theme switcher. - Targeted defect detection: Checks screenshots for invisible text, overflow, clipping, misalignment, stuck hover states, broken images, and unexpected differences between themes. - False-positive filtering: Distinguishes real bugs from expected behavior such as entry animations, the ambient background's dual renderers, chromeless routes, and desktopOnly navigation flags. - Use Case: After restyling a component, ask for a visual check and receive a per-page report formatted as [URL] [dark|light] [desktop|mobile] — description of issue, or confirmation that everything looks correct. ## Quick Start Ask the assistant to visually review the pages you just changed in both light and dark mode at desktop and mobile widths.
