{"id":"f087637f-bbbe-4212-b2d7-b46586f8069f","shortId":"ETkLpA","kind":"skill","title":"mobile-app","tagline":"A mobile-app screen rendered inside a pixel-accurate iPhone 15 Pro frame\non the page. Built by copying the seed `assets/template.html` and pasting\none screen archetype from `references/layouts.md`. Use when the brief asks\nfor \"mobile app\", \"iOS app\", \"Android app\", \"phone screen\"","description":"# Mobile App Skill\n\nProduce a single mobile-app screen mockup, framed inside a real-feeling iPhone 15 Pro device.\n\n## Resource map\n\n```\nmobile-app/\n├── SKILL.md ← you're reading this\n├── assets/\n│ └── template.html ← seed: device frame + screen primitives (READ FIRST)\n└── references/\n ├── layouts.md ← 6 screen archetypes (Feed / Detail / Onboarding / Profile / Checkout / Focus)\n └── checklist.md ← P0/P1/P2 self-review (anti-fake-device)\n```\n\n## Workflow\n\n### Step 0 — Pre-flight\n\n1. **Read `assets/template.html`** end-to-end through the `