tokenslisted

<!-- AUTO-GENERATED. Do not edit here. Source: skills/ui-craft/ + commands/*.md. Regenerate with `node scripts/sync-harnesses.mjs`. --> **Context:** this sub-skill is one lens of the broader `ui-craft` skill. If the `ui-craft` skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below. Read `references/tokens.md` before proceeding. The 3-layer contract (primitive → semantic → component) and the intentional-dark test are defined there. --- ## Step 1: Detect existing tokens Scan for token definitions in the project: - CSS variables in `:root`, `[data-theme]`, `[data-mode]`, or theme wrapper selectors - Tailwind config (`tailwind.config.js/ts`) under `theme.extend` or `theme` - CSS-in-JS theme objects (`theme.ts`, `*.styles.ts`, `styled.d.ts`, `ThemeProvider`) - `design-tokens.json` or `tokens.json` (Style Dictionary / Theo) - `globals.css`, `variables.css`, `tokens.css` Build an inventory: which of the 7 categories exist (color / spacing / type / radii / shadows / motion / z-index), which layers are present (primitive / semantic / component), and whether both light and dark are defined. --- ## Step 2: Route based on the target the user described and inventory - **"audit"** → run audit only (Step 3). No proposals. - **"establish"** → skip audit, go to Step 4. - **"color" / "spacing" / "type" / "radii" / "shadows" / "motion" / "z-index"** → focus the audit and any proposal on that one category. - **empty**