What problem does it solve? Mobile layouts often fail because they are desktop designs squeezed into a narrow viewport: columns collide, text stays oversized, pages scroll sideways, and tap targets are too small. This Skill gives an AI coding agent a concrete rulebook of mobile layout anti-patterns with fixes, so responsive work is verified against real failure modes instead of guesswork. ## Core Features & Use Cases - Anti-pattern catalog with fixes: Each entry follows a Tell / Why / Fix structure covering breakpoints, scale and sizing, grids and stacking, overflow, tap targets, and mobile navigation, citing governing core rules (R-03, R-05, R-35). - Mobile layout checklist: A nine-item verification checklist run alongside the core antislop Delivery Gate to confirm reflow, sizing, overflow, tappability, and navigation at narrow widths. - Use Case: While building a landing page, ask the agent to make it responsive. The Skill guides it to collapse grids to a single column, replace fixed pixel type with fluid clamp() sizing, enforce 44x44px tap targets, and eliminate horizontal scroll leaks. ## Quick Start Load this skill together with the antislop core and ask the agent to review and fix my page layout so it holds up on a phone-width viewport.
