design-ios

<objective> Produces iOS and macOS mockups and developer handoff specs: mapping design tokens to the Dynamic Type scale (iOS) or macOS's fixed text-size variants, semantic colors, device/window viewports, Liquid Glass materials, and macOS-specific conventions (system window chrome, desktop tinting, pointer states). The deliverable is a device-framed (iOS) or window-framed (macOS) HTML mockup at exact viewport dimensions plus a SwiftUI-ready handoff spec (named tokens, text styles, semantic colors, sizing, states, spacing). This skill never writes SwiftUI code — implementation is left to `swift-expert` or an Apple-platform developer. </objective> ## Design iOS/macOS — Mockup and Handoff, Not Code ### When After `design-system` tokens exist. This skill never writes SwiftUI — it produces a static HTML mockup at exact device/window dimensions plus a spec that `swift-expert` or an Apple-platform developer implements. ### Input - `design-system.md` — OKLCH palette, typography direction, motion personality. - The screen/flow to mock up and the target platform: iPhone / iPad (iOS) or a resizable window (macOS). ### Steps — iOS 1. **Map tokens to iOS roles.** Typography → Dynamic Type text styles, anchored at Body 17pt down to Caption 2 11pt (never fixed point sizes) — see `references/dynamic-type.md`. Colors → semantic color roles (never raw RGB/hex) — see `references/semantic-colors.md`. 2. **Pick the device viewport(s)** from `references/viewports.md` — mock up in exa...