What problem does it solve? Canvas app authors work blind: the render happens on someone else's machine, so overlapping controls, dead click targets, and broken layouts only surface after hand-off. This Skill turns layout into arithmetic done at author time, catching collisions, z-order traps, and paste hazards before they ship. ## Core Features & Use Cases - Band planning and collision arithmetic: Plan screens in vertical bands with resolved pixel numbers in header comments, and run rectangle-overlap checks across every control pair before hand-off. - Z-order and hit-testing rules: Declare floating elements last, gate component instances with Visible flags, and place per-row icons after full-template overlay buttons so controls stay clickable. - Paste and direct-manipulation behavior: Explains when X/Y/Width/Height formulas survive a paste versus when dragging writes back constants, and why auto-layout children with no X survive screen-scope pastes. - Use Case: When a user reports "the dropdown covers the fields below" or "nothing on this screen is clickable", use this Skill to compute the overlap, fix the declaration order, and restructure the layout with auto-layout containers. ## Quick Start Lay out this canvas app form so the picker dropdowns no longer cover the search fields below them.
