What problem does it solve? Mobile layouts often ship as squeezed desktop designs: columns that never collapse, horizontal overflow, undersized tap targets, and navigation that crowds or covers content. This Skill gives AI coding agents a concrete rule set and checklist to detect and fix those mobile layout failures. ## Core Features & Use Cases - Breakpoint and Scale Rules: Enforces content-driven breakpoints, fluid type with clamp(), mobile-specific spacing scales, and avoidance of 100vh traps. - Grid, Overflow, and Tap Target Checks: Detects grids that fail to collapse, horizontal scroll leaks, overflow clipping, under-sized touch targets, and hover-only interactions. - Mobile Navigation Patterns: Covers collapsing desktop nav bars, labeled hamburger menus, bottom nav safe-area handling, and compact sticky headers. - Use Case: While building a responsive landing page, load this Skill alongside the antislop core so the agent reflows the grid to a single column, sizes tap targets to 44px, and verifies zero horizontal scroll at narrow widths. ## Quick Start Load the antislop core and this layoutmobile skill, then review my page layout for mobile responsiveness and fix any reflow, overflow, or tap target issues.
