oh-my-opencode 4.14.2 → 4.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/cli/index.js +14 -14
  2. package/dist/cli-node/index.js +14 -14
  3. package/dist/index.js +13 -13
  4. package/dist/skills/frontend/ATTRIBUTION.md +7 -0
  5. package/dist/skills/frontend/SKILL.md +7 -3
  6. package/dist/skills/frontend/references/design/README.md +11 -34
  7. package/dist/skills/frontend/references/design/clone-from-url.md +65 -0
  8. package/dist/skills/programming/SKILL.md +5 -3
  9. package/dist/skills/remove-ai-slops/SKILL.md +34 -15
  10. package/dist/skills/visual-qa/SKILL.md +11 -0
  11. package/dist/skills/visual-qa/scripts/skill-prompt-contract.test.ts +42 -0
  12. package/package.json +13 -13
  13. package/packages/omo-codex/plugin/.codex-plugin/plugin.json +1 -1
  14. package/packages/omo-codex/plugin/components/bootstrap/package.json +1 -1
  15. package/packages/omo-codex/plugin/components/codegraph/package.json +1 -1
  16. package/packages/omo-codex/plugin/components/comment-checker/package.json +1 -1
  17. package/packages/omo-codex/plugin/components/git-bash/package.json +1 -1
  18. package/packages/omo-codex/plugin/components/lazycodex-executor-verify/package.json +1 -1
  19. package/packages/omo-codex/plugin/components/lsp/package.json +1 -1
  20. package/packages/omo-codex/plugin/components/rules/package.json +1 -1
  21. package/packages/omo-codex/plugin/components/start-work-continuation/package.json +1 -1
  22. package/packages/omo-codex/plugin/components/teammode/package.json +1 -1
  23. package/packages/omo-codex/plugin/components/telemetry/package.json +1 -1
  24. package/packages/omo-codex/plugin/components/ultrawork/package.json +1 -1
  25. package/packages/omo-codex/plugin/components/ulw-loop/package.json +1 -1
  26. package/packages/omo-codex/plugin/package-lock.json +13 -13
  27. package/packages/omo-codex/plugin/package.json +1 -1
  28. package/packages/omo-codex/plugin/skills/frontend/ATTRIBUTION.md +7 -0
  29. package/packages/omo-codex/plugin/skills/frontend/SKILL.md +7 -3
  30. package/packages/omo-codex/plugin/skills/frontend/references/design/README.md +11 -34
  31. package/packages/omo-codex/plugin/skills/frontend/references/design/clone-from-url.md +65 -0
  32. package/packages/omo-codex/plugin/skills/programming/SKILL.md +5 -3
  33. package/packages/omo-codex/plugin/skills/remove-ai-slops/SKILL.md +34 -15
  34. package/packages/omo-codex/plugin/skills/visual-qa/SKILL.md +11 -0
  35. package/packages/omo-codex/scripts/install-dist/install-local.mjs +1 -1
  36. package/packages/shared-skills/skills/frontend/ATTRIBUTION.md +7 -0
  37. package/packages/shared-skills/skills/frontend/SKILL.md +7 -3
  38. package/packages/shared-skills/skills/frontend/references/design/README.md +11 -34
  39. package/packages/shared-skills/skills/frontend/references/design/clone-from-url.md +65 -0
  40. package/packages/shared-skills/skills/programming/SKILL.md +5 -3
  41. package/packages/shared-skills/skills/remove-ai-slops/SKILL.md +34 -15
  42. package/packages/shared-skills/skills/visual-qa/SKILL.md +11 -0
  43. package/packages/shared-skills/skills/visual-qa/scripts/skill-prompt-contract.test.ts +42 -0
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sisyphuslabs/codex-git-bash-hook",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex hook component that reminds Windows sessions to prefer the OMO git_bash MCP.",
5
5
  "type": "module",
6
6
  "private": true,
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-lazycodex-executor-verify",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex SubagentStop evidence verifier for LazyCodex executor completions.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-lsp",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex plugin that exposes Language Server Protocol tools and post-edit diagnostics.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-rules",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex plugin that injects project rule files into model context through lifecycle hooks.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-start-work-continuation",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex Stop hook continuation injector for omo-codex start-work plans.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sisyphuslabs/codex-teammode",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex team-mode hook component that keeps background thread titles descriptive after create_thread.",
5
5
  "type": "module",
6
6
  "private": true,
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-telemetry",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex plugin component that emits omo-codex anonymous daily-active telemetry on SessionStart.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-ultrawork",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex plugin that injects the ultrawork orchestration directive and ships LazyCodex planning, review, QA, and gate agent roles.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@code-yeongyu/codex-ulw-loop",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Codex plugin: durable repo-native multi-goal orchestration with embedded success criteria and observable evidence audit.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@sisyphuslabs/omo-codex-plugin",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "lockfileVersion": 3,
5
5
  "requires": true,
6
6
  "packages": {
7
7
  "": {
8
8
  "name": "@sisyphuslabs/omo-codex-plugin",
9
- "version": "4.14.2",
9
+ "version": "4.15.0",
10
10
  "workspaces": [
11
11
  "components/codegraph",
12
12
  "components/comment-checker",
@@ -93,7 +93,7 @@
93
93
  },
94
94
  "components/codegraph": {
95
95
  "name": "@sisyphuslabs/codex-codegraph",
96
- "version": "4.14.2",
96
+ "version": "4.15.0",
97
97
  "bin": {
98
98
  "omo-codegraph": "dist/cli.js"
99
99
  },
@@ -112,7 +112,7 @@
112
112
  },
113
113
  "components/comment-checker": {
114
114
  "name": "@code-yeongyu/codex-comment-checker",
115
- "version": "4.14.2",
115
+ "version": "4.15.0",
116
116
  "license": "MIT",
117
117
  "bin": {
118
118
  "omo-comment-checker": "dist/cli.js"
@@ -133,7 +133,7 @@
133
133
  },
134
134
  "components/git-bash": {
135
135
  "name": "@sisyphuslabs/codex-git-bash-hook",
136
- "version": "4.14.2",
136
+ "version": "4.15.0",
137
137
  "bin": {
138
138
  "omo-git-bash-hook": "dist/cli.js"
139
139
  },
@@ -148,7 +148,7 @@
148
148
  },
149
149
  "components/lazycodex-executor-verify": {
150
150
  "name": "@code-yeongyu/codex-lazycodex-executor-verify",
151
- "version": "4.14.2",
151
+ "version": "4.15.0",
152
152
  "license": "MIT",
153
153
  "bin": {
154
154
  "lazycodex-executor-verify": "dist/cli.js"
@@ -165,7 +165,7 @@
165
165
  },
166
166
  "components/lsp": {
167
167
  "name": "@code-yeongyu/codex-lsp",
168
- "version": "4.14.2",
168
+ "version": "4.15.0",
169
169
  "license": "MIT",
170
170
  "dependencies": {
171
171
  "@code-yeongyu/lsp-daemon": "file:../../../../lsp-daemon"
@@ -185,7 +185,7 @@
185
185
  },
186
186
  "components/rules": {
187
187
  "name": "@code-yeongyu/codex-rules",
188
- "version": "4.14.2",
188
+ "version": "4.15.0",
189
189
  "license": "MIT",
190
190
  "dependencies": {
191
191
  "picomatch": "^4.0.3"
@@ -207,7 +207,7 @@
207
207
  },
208
208
  "components/start-work-continuation": {
209
209
  "name": "@code-yeongyu/codex-start-work-continuation",
210
- "version": "4.14.2",
210
+ "version": "4.15.0",
211
211
  "license": "MIT",
212
212
  "bin": {
213
213
  "omo-start-work-continuation": "dist/cli.js"
@@ -224,7 +224,7 @@
224
224
  },
225
225
  "components/teammode": {
226
226
  "name": "@sisyphuslabs/codex-teammode",
227
- "version": "4.14.2",
227
+ "version": "4.15.0",
228
228
  "devDependencies": {
229
229
  "@types/node": "^25.9.3",
230
230
  "bun-types": "^1.3.1",
@@ -237,7 +237,7 @@
237
237
  },
238
238
  "components/telemetry": {
239
239
  "name": "@code-yeongyu/codex-telemetry",
240
- "version": "4.14.2",
240
+ "version": "4.15.0",
241
241
  "license": "MIT",
242
242
  "bin": {
243
243
  "omo-telemetry": "dist/cli.js"
@@ -255,7 +255,7 @@
255
255
  },
256
256
  "components/ultrawork": {
257
257
  "name": "@code-yeongyu/codex-ultrawork",
258
- "version": "4.14.2",
258
+ "version": "4.15.0",
259
259
  "license": "MIT",
260
260
  "bin": {
261
261
  "omo-ultrawork": "dist/cli.js"
@@ -273,7 +273,7 @@
273
273
  },
274
274
  "components/ulw-loop": {
275
275
  "name": "@code-yeongyu/codex-ulw-loop",
276
- "version": "4.14.2",
276
+ "version": "4.15.0",
277
277
  "license": "MIT",
278
278
  "bin": {
279
279
  "omo-ulw-loop": "dist/cli.js",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sisyphuslabs/omo-codex-plugin",
3
- "version": "4.14.2",
3
+ "version": "4.15.0",
4
4
  "description": "Aggregate Codex plugin root for OMO components.",
5
5
  "type": "module",
6
6
  "packageManager": "npm@11.12.1",
@@ -199,3 +199,10 @@ capture evidence and a local reconnaissance run following the MIT-licensed
199
199
  `JCodesMore/ai-website-cloner-template` workflow; it is not copied from Aside or from the
200
200
  template. Aside names, trademarks, product text, and visual assets remain the property of
201
201
  their respective owners and are referenced only for descriptive design-analysis purposes.
202
+
203
+ `frontend/references/design/clone-from-url.md` is a project-original runtime-extraction
204
+ workflow guide. Its browser + `getComputedStyle` clone approach follows the same
205
+ MIT-licensed `JCodesMore/ai-website-cloner-template` clone-website workflow that `aside.md`
206
+ cites; no source from that template is copied. It carries no third-party attribution beyond
207
+ that lineage note, and it grants no license to copy any target site's trademarks, brand
208
+ assets, or proprietary copy.
@@ -24,8 +24,11 @@ This file is a router, not a rulebook. The rules live in four rulesets under `re
24
24
 
25
25
  Every implementation must choose one of these branches before UI code changes:
26
26
 
27
- 1. **Concrete visual reference:** if the user supplies a screenshot, generated mockup, Stitch/Imagen output, Figma export, overview, or annotated reference packet, treat it as the visual contract. Load `references/design/image-to-code-skill.md` plus the relevant design/perfection files, extract the reference's exact tokens, layout geometry, copy, spacing, states, and responsive intent into `DESIGN.md`, then implement reusable primitives against that contract. Final QA must run `/visual-qa` in reference-fidelity mode: compare the actual UI against the reference packet pixel-by-pixel and verify the code is an extensible design-system implementation, not a screenshot-matched one-off.
28
- 2. **Greenfield or fresh setup:** if the user gave no concrete visual reference, use `references/design/_INDEX.md` to shortlist 2-3 plausible Layer B references, then deeply load exactly one Layer A style skill and one Layer B brand/design-system reference; use `open-design` only when the curated set has no fit. Treat those references as source material, not mood labels: extract tokens, layout grammar, component anatomy, interaction states, motion, and taste decisions into `DESIGN.md`, then recombine them into project-specific primitives. Customize for the user's product and content, but do not freestyle past the selected references; never copy logos, trademarked assets, or brand-specific copy. Define Section 5 primitives with variants, default/hover/active/focus/disabled/loading/empty/error states, accessibility, and motion before code. Build them first in a component showcase or state harness; each primitive and required state must pass mobile/tablet/desktop visual QA before product screens.
27
+ 1. **Concrete visual reference:** the user supplied a reference treat it as the visual contract, then handle it by kind:
28
+ - **Static visual reference** (screenshot, generated mockup, Stitch/Imagen output, Figma export, overview, or annotated packet): load `references/design/image-to-code-skill.md` plus the relevant design/perfection files, extract the reference's exact tokens, layout geometry, copy, spacing, states, and responsive intent into `DESIGN.md`, then implement reusable primitives against that contract.
29
+ - **Live site or URL reference** (the user names a site to clone or gives a URL): load `references/design/clone-from-url.md`. Drive a real browser and extract the runtime truth via `getComputedStyle` — tokens, layout geometry, default/hover/focus/active states, transitions and keyframes, and downloaded assets — into `DESIGN.md`, then clone-code reusable primitives against that contract.
30
+ Final QA for both runs `/visual-qa` in reference-fidelity mode: compare the actual UI against the reference pixel-by-pixel and verify the code is an extensible design-system implementation, not a screenshot-matched one-off.
31
+ 2. **Greenfield or fresh setup:** if the user gave no concrete visual reference, use `references/design/_INDEX.md` to shortlist 2-3 plausible Layer B references, then deeply load exactly one Layer A style skill and one Layer B brand/design-system reference; use `open-design` only when the curated set has no fit. Treat those references as source material, not mood labels: extract tokens, layout grammar, component anatomy, interaction states, motion, and taste decisions into `DESIGN.md`, then recombine them into project-specific primitives — never freestyle past the selected references, never copy logos or brand-specific copy. For an expressive brief (glossy, premium, wow, brand-grade), default to generating 2-3 imagen concept drafts, each seeded with the loaded Layer A + Layer B tokens (palette, type, material); pick the strongest and treat the chosen draft as the reference-fidelity contract. Define Section 5 primitives and their default/hover/active/focus/disabled/loading/empty/error states before code, and pass each through mobile/tablet/desktop visual QA before product screens.
29
32
  3. **Existing project with `DESIGN.md` or a component system:** read it, follow it, and update it before implementation only when the requested work needs a new token, primitive, state, motion rule, accessibility constraint, accepted debt, or reference-fidelity requirement.
30
33
  4. **Existing project with UI but no `DESIGN.md` and no reusable component layer:** STOP and ask the user one focused question: should you preserve the current look with copy-nearby styling, or extract a real `DESIGN.md` plus reusable components before continuing? Do not silently choose.
31
34
 
@@ -120,7 +123,8 @@ Domains: `product` `style` `typography` `color` `landing` `chart` `ux` `react` `
120
123
  - **Never weaken UX OR flatten the surface to buy points.** No dropping animations, hiding content, simplifying interactions, or replacing rendered/lit material with flat fills and flat geometric primitives for a Lighthouse score or a deadline. Hit 100 AND keep the surface dimensional — both, or neither.
121
124
  - **No emojis as icons.** SVG icon sets only (Lucide, Heroicons, Radix, Phosphor).
122
125
  - **GPU-composited animation only** — `transform`, `opacity`, `filter`; never animate layout properties.
123
- - **Verify in a real browser before declaring done.** Screenshots at 375 / 768 / 1280px; hover, focus, loading, empty, and error states all exercised.
126
+ - **Slop animation is forbidden motion serves meaning.** Every animation or hover must map to a real interaction, state change, or affordance. A hover that changes nothing, motion on a non-interactive element, or a decorative micro-animation with no informational purpose is slop — do not add it.
127
+ - **Done is the `/visual-qa` dual-oracle gate, not your own glance.** A frontend design task is verified through `/visual-qa` (real browser at 375 / 768 / 1280px, every page, with interaction states and motion driven and inspected) until the dual-oracle completion gate passes on fresh evidence.
124
128
 
125
129
  ## When to load something else instead
126
130
 
@@ -131,12 +131,14 @@ Do NOT use this for greenfield work — the audit phase is wasted effort there.
131
131
 
132
132
  ### Step 4 — Is this an image-first workflow?
133
133
 
134
- Triggers: "generate the design first then code it", "make a mockup before we build", "show me what it could look like".
134
+ Triggers: "generate the design first then code it", "make a mockup before we build", "show me what it could look like" — AND, by default, any expressive greenfield brief (glossy / premium / wow / brand-grade) with no user-supplied reference.
135
135
 
136
136
  **Action:** Load both:
137
137
  - `image-to-code-skill.md` (the workflow: generate → analyze → implement)
138
138
  - `imagegen-frontend-web.md` for web, or `imagegen-frontend-mobile.md` for mobile screens
139
139
 
140
+ For an expressive greenfield brief, default to generating **2-3 imagen concept drafts**, each prompt **seeded with the loaded Layer A + Layer B tokens** (palette, type, signature material) so the drafts inherit the reference's taste instead of generic priors. Pick the strongest, then treat the chosen draft as the reference-fidelity contract for `/visual-qa`.
141
+
140
142
  If the user wants only the imagery (no code), load only the imagegen file.
141
143
 
142
144
  ### Step 5 — Image-only requests (no code)
@@ -215,39 +217,14 @@ Once references are loaded, before writing any UI code:
215
217
 
216
218
  ## Phase Final — Design QA (MANDATORY, runs after implementation)
217
219
 
218
- After implementation is complete, **before declaring the task done**, run a real browser-based Design QA.
219
-
220
- ### Why
221
-
222
- Code that "looks correct" in an editor is not verified. Colors render differently, spacing collapses, fonts fail to load, responsive breakpoints break, states are missing. The only way to know is to SEE it in a real browser.
223
-
224
- ### How
225
-
226
- 1. **Launch the app** in a real browser (use `agent-browser` skill or the project's dev server + screenshot tool).
227
- 2. **Take screenshots** at key breakpoints: mobile (375px), tablet (768px), desktop (1280px).
228
- 3. **Walk the design system checklist** visually:
229
- - [ ] Colors match `DESIGN.md` palette — no off-brand colors visible
230
- - [ ] Typography hierarchy is clear — headings, body, captions are visually distinct
231
- - [ ] Spacing rhythm feels consistent — no cramped or floating elements
232
- - [ ] Interactive states work — hover every button, focus every input, toggle every switch
233
- - [ ] Empty, loading, and error states exist and look intentional
234
- - [ ] Dark mode (if declared in `DESIGN.md`) works completely
235
- - [ ] No layout overflow, no horizontal scroll on mobile
236
- - [ ] Motion/animation feels smooth — no jank, no missing transitions
237
- - [ ] (Expressive brief) Surfaces AND the hero focal object read as real, dimensional material — not flat fills or flat geometric primitives. Use the brand's material: glass = tint+backdrop saturate+rim+sheen+glow; bright/playful = gradient fills+soft depth shadows+a lit focal object. The hero focal object is a generated bitmap, or carries real light/shadow/gradient/depth.
238
- - [ ] (Expressive brief) Brand color is a perceptual ramp (multiple stops / OKLCH), not one tint reused at different opacities
239
- - [ ] (Expressive brief) Every interactive element has a visible hover AND active/pressed micro-interaction, and the hero carries one signature moment
240
- 4. **Two kinds of failure count equally — fix both, then re-check.** Defects: clipping, wrong font, missing state, jank. Flatness: a surface that reads generic next to the loaded reference. When the render is bug-free but flat, you are NOT done — RAISE the design: deepen the material layering, give the color real depth and a ramp, add the signature interaction. Patching only bugs while the surface stays at the floor is the single most common way this skill ships clean-but-generic work. Do not report "done" with visual bugs OR a floor-level surface.
241
- 5. **If you cannot launch a browser** (e.g. no dev server, CI-only environment), state this explicitly and list what you would check. Never silently skip QA.
242
-
243
- ### QA Report
244
-
245
- After passing QA, write a short summary:
246
- - Breakpoints tested
247
- - States verified (hover, focus, disabled, loading, error, empty)
248
- - Design system compliance: all tokens traced back to `DESIGN.md`
249
- - Issues found and fixed during QA
250
- - Screenshot evidence (attach or describe)
220
+ Before declaring the task done, verify the rendered UI. **The verification authority is `/visual-qa`, not a hand-rolled checklist here.** Run `/visual-qa`: it captures every page and breakpoint (375 / 768 / 1280px) on fresh evidence, drives and inspects interaction states (hover/focus/active) and motion (transitions, scroll-triggered, load), runs the dual-oracle pass, and loops until an independent reviewer passes. For a concrete reference or clone, run it in reference-fidelity mode.
221
+
222
+ This skill adds only the design-taste judgments `/visual-qa` cannot make for you:
223
+
224
+ 1. **Two kinds of failure count equally fix both, then re-check.** Defects: clipping, wrong font, missing state, jank. Flatness: a surface that reads generic next to the loaded reference. When the render is bug-free but flat, you are NOT done — RAISE the design: deepen the material layering, give the color a real perceptual ramp (multiple stops / OKLCH, not one tint at varied opacity), render the hero focal object as real dimensional material (a generated bitmap, or real light/shadow/gradient/depth — never flat geometric primitives), and add the one signature moment. Patching only bugs while the surface stays at the floor is the single most common way this skill ships clean-but-generic work.
225
+ 2. **Motion serves meaning; slop animation is forbidden.** Every interactive element must communicate its affordance and state changes — but a hover that changes nothing, motion on a non-interactive element, or a decorative micro-animation with no informational purpose is slop. Do not add it, and treat any you find as a defect. The hero may carry one signature moment; the rest of the surface earns motion only where it signals interaction or state.
226
+
227
+ Report "done" only when `/visual-qa` has passed on fresh evidence AND neither a visual bug nor a floor-level or slop-laden surface remains.
251
228
 
252
229
 
253
230
  ## Final notes
@@ -0,0 +1,65 @@
1
+ # Clone From URL — Runtime Design-System Extraction
2
+
3
+ Use this when the user gives a **live site or a URL** to clone: "clone aside.com", "rebuild this page", "make it look exactly like `<url>`". A live URL affords what a screenshot cannot — the browser's **runtime truth**. Extract that truth with the real browser, make it the `DESIGN.md` contract, then build reusable primitives against it. Never eyeball a screenshot into a one-off.
4
+
5
+ ## Outcome and stop rule
6
+
7
+ A `DESIGN.md` whose every token, interaction state, and motion value was read from the running page with `getComputedStyle`, plus a component-level clone that an independent reviewer confirms is an extensible design system (live DOM, reused primitives) — not a screenshot-matched or pasted-image fake. Done is defined by `/visual-qa` reference-fidelity mode passing on fresh evidence, not by your own glance.
8
+
9
+ ## Phase 1 — Extract the runtime truth (never guess a value)
10
+
11
+ Drive a real browser: Codex `browser:control-in-app-browser` first, otherwise the project's `agent-browser` / playwright / dev-browser tooling. Do NOT parse CSS files — minification, CORS, CSS-in-JS, and Tailwind utilities make source unreliable. `getComputedStyle` returns what the browser ACTUALLY rendered, so it is the only source of truth.
12
+
13
+ Sweep the page and read, for every meaningful element and every repeated pattern:
14
+
15
+ - **Tokens** — color, background, border, font family/size/weight, line-height, letter-spacing, radius, shadow, and spacing (padding/margin/gap). Cluster the repeated values into the token scale.
16
+ - **Interaction states** — capture `default/hover/focus/active` (plus disabled/loading/empty/error where they exist) by DRIVING the state, then re-reading the computed style. A system with only the resting state is incomplete.
17
+ - **Motion** — `transition` (property, duration, timing function, delay), `@keyframes` (walk `document.styleSheets` for `CSSKeyframesRule`), and `transform`. Motion is part of the contract, not decoration.
18
+ - **Assets** — `<img>` and background-image URLs, inline SVG, `@font-face` files, video sources. Download the REAL assets; never substitute stock or placeholders.
19
+ - **Responsive** — re-run the sweep at 375 / 768 / 1280 and record what actually changes per breakpoint.
20
+
21
+ A compact sweep payload to inject through the browser's evaluate action (extend the recorded fields as needed):
22
+
23
+ ```js
24
+ () => {
25
+ const out = [];
26
+ for (const el of document.querySelectorAll("*")) {
27
+ const s = getComputedStyle(el);
28
+ out.push({
29
+ tag: el.tagName,
30
+ color: s.color, background: s.backgroundColor, border: s.borderColor,
31
+ font: s.fontFamily, size: s.fontSize, weight: s.fontWeight,
32
+ lineHeight: s.lineHeight, letterSpacing: s.letterSpacing,
33
+ radius: s.borderRadius, shadow: s.boxShadow,
34
+ padding: s.padding, margin: s.margin, gap: s.gap,
35
+ transition: s.transition, animation: s.animation, transform: s.transform,
36
+ });
37
+ }
38
+ return out;
39
+ }
40
+ ```
41
+
42
+ ## Phase 2 — Write the DESIGN.md contract
43
+
44
+ Turn the extraction into `DESIGN.md` per `design-system-architecture.md`: token scales, typography, spacing, the component anatomy with every captured state, the motion rules, and the responsive deltas. Name which source each value came from. If a value is not in `DESIGN.md`, it may not appear in code.
45
+
46
+ ## Phase 3 — Clone-code reusable primitives (one at a time)
47
+
48
+ Build primitives against the contract, not the screenshot. One component per cycle: implement, render, compare to the source region, fix, then move on. Use the downloaded assets. Never paste a raster or `background-image` where a live element belongs. Never approximate a token you already extracted.
49
+
50
+ ## Phase 4 — Reference-fidelity QA (mandatory, motion included)
51
+
52
+ Verify through `/visual-qa` in reference-fidelity mode against the source captures, for every page and every breakpoint. Interaction states and animations are IN SCOPE: drive hover/focus/click/scroll, then compare the settled states AND the motion itself against the source. You are not done until the dual-oracle gate passes on fresh evidence.
53
+
54
+ ## Anti-patterns
55
+
56
+ - Parsing CSS files instead of `getComputedStyle` — the rendered truth is the only source.
57
+ - "CORS blocked" as an excuse — computed styles bypass it.
58
+ - Resting state only — capture hover/focus/active and the rest.
59
+ - Screenshot-matched one-off — build reusable, token-driven primitives.
60
+ - Placeholder or stock assets — download and use the originals.
61
+ - Desktop only — re-extract at each breakpoint.
62
+
63
+ ## Provenance
64
+
65
+ This runtime-extraction workflow follows the MIT-licensed **[JCodesMore/ai-website-cloner-template](https://github.com/JCodesMore/ai-website-cloner-template)** clone-website approach: browser automation plus a `getComputedStyle` sweep, state/motion/asset capture, spec files, and visual QA. It is a project-original synthesis, not a copy of that template. Do not treat this file as a license to copy any target site's trademarks, brand assets, logos, or proprietary copy — extract the design *system* (tokens, layout grammar, component anatomy, interaction states, motion) and apply it to the user's own product and content.
@@ -5,7 +5,7 @@ description: "MUST USE for ANY work on .py .pyi .rs .ts .tsx .mts .cts .go files
5
5
 
6
6
  # Programming
7
7
 
8
- You are a senior engineer who writes Python, Rust, and TypeScript with one shared discipline. **Type-strict. Stack-first. Async-correct. Architecturally honest about file size.**
8
+ You are a lazy senior engineer lazy meaning efficient, never careless. **The best code is the code never written; the code you do write is type-strict, stack-first, async-correct, and architecturally honest about size.**
9
9
 
10
10
  This skill is an index. The hard per-language rules live under `references/`. Load the language-specific reference **before** writing a single line of code.
11
11
 
@@ -33,7 +33,9 @@ This skill is an index. The hard per-language rules live under `references/`. Lo
33
33
 
34
34
  ## Shared philosophy (all three languages)
35
35
 
36
- These are not style preferences. They are the six axioms every recipe in `references/` derives from.
36
+ These are not style preferences. They are the seven axioms every recipe in `references/` derives from.
37
+
38
+ 0. **The best code is the code never written.** Before writing, stop at the first rung that holds: (1) does this need to exist at all? (YAGNI) (2) does this codebase already have it? — reuse the helper or pattern, do not re-implement. (3) does the standard library do it? (4) does a native platform feature cover it? (5) does an installed dependency solve it? (6) can it be one line? (7) only then, write the minimum that works. Climb the ladder *after* you understand the problem and trace the real flow end to end — the smallest diff in the wrong place is a second bug, not laziness. The ladder is a fast decision, not a written essay: pick the rung and move. **Bug fix = root cause, not symptom.** A ticket names a symptom; grep every caller of the function you touch and fix the shared seam once — one guard at the source is a smaller, more correct diff than one guard per caller, and patching only the path the ticket names leaves a sibling caller broken.
37
39
 
38
40
  1. **The type system is your proof system.** Make illegal states unrepresentable. The compiler / type checker is the cheapest test you will ever run. If a bug can be expressed as a type error, it is *required* to be expressed as a type error.
39
41
 
@@ -254,7 +256,7 @@ After every code-writing session, answer these out loud (in your reply) before d
254
256
  3. **Variant discrimination?** Did I use `if`/`elif`/`else` (or `switch` without `assertNever`, or `match` without `assert_never`) anywhere to discriminate on a tagged type or enum? If yes, rewrite as exhaustive match.
255
257
  4. **Escape hatches?** Any `Any`, `# type: ignore`, `unwrap`, `expect` outside `main`/tests, `as` numeric cast, `!`, `@ts-ignore`, `@ts-expect-error`, `#[allow]` on a real warning? If yes, fix the type or document why with a comment.
256
258
  5. **Defensive layer?** Any null check, try/except, or `isinstance` guarding a value the type system already proves? If yes, delete.
257
- 6. **Helpers for one-off?** Any function, class, or trait introduced for a single caller that will never get a second caller? If yes, inline.
259
+ 6. **Helpers for one-off?** Any function, class, or trait introduced for a single caller that will never get a second caller? If yes, inline — axiom 0 should have caught it pre-write; this is the backstop.
258
260
  7. **Tests?** Is the behavior I just introduced locked by a test that would fail if I revert this commit?
259
261
  8. **Parameter bloat?** Any function I wrote or modified that takes more than 3 parameters — or smuggles them through a dict/kwargs/`...args`/throwaway options object? If yes, group related params into a typed value object. See [Smell 2](references/code-smells.md#smell-2--function-with-more-than-3-parameters).
260
262
  9. **Redundant verification?** Did I perform a destructive action (delete, remove, clear) and then immediately re-query to "confirm" it worked? Did I call a setter then a getter to "verify"? If yes, delete the verification — the operation's contract IS the proof. See [Smell 3](references/code-smells.md#smell-3--redundant-verification-after-a-destructive-action).
@@ -52,6 +52,7 @@ The agent looks for these nine categories. The first three are stylistic, the ne
52
52
  2. **Over-defensive code** — null checks for guaranteed values, try/except around code that cannot raise, isinstance checks for statically typed params, default values for required params, backward-compat shims, redundant validation duplicated at multiple layers, **broad exception catching** (`except Exception`/`except BaseException` in Python, empty `catch {}` or `catch (e) { console.error(e) }` without narrowing in TypeScript/JavaScript).
53
53
  - KEEP: validation at system boundaries (user input, external APIs), I/O error handling, nullable DB fields. Top-level boundary catch-all (CLI `main()`, HTTP handler) with explicit logging + re-raise is acceptable.
54
54
  - REFACTOR: `except Exception` → catch the specific exception you expect. Empty `catch {}` → add `instanceof` narrowing or re-throw. `catch (e) { log(e) }` → narrow with `instanceof`, handle known cases, re-throw unknown.
55
+ - PROOF REQUIRED: before deleting any validation or error handling at a trust boundary, Phase 2 must include an **adversarial** regression (malformed or hostile input) that fails if the guard is removed. No adversarial test → the guard stays. Redundant defense to remove is a duplicate of a check that already runs *inside* the boundary; a guard with no proof of redundancy is load-bearing.
55
56
 
56
57
  3. **Excessive complexity** — deep nesting (>3 levels), nested ternaries, complex boolean expressions (combine 4+ predicates), long parameter lists (>5 args without a struct/dataclass/object), god functions (>50 lines doing many things), overly clever one-liners that sacrifice readability, `if/elif/else` chains for type/enum/literal discrimination (must be `match/case` + `assert_never`), `object` used as a type annotation (must be `Protocol`, `TypeVar`, or explicit union).
57
58
  - KEEP: established complexity patterns in this codebase, performance-critical hot paths that intentionally use a complex idiom. `if/else` for boolean conditions and range checks (not variant discrimination).
@@ -148,22 +149,37 @@ For each in-scope source file:
148
149
 
149
150
  If you cannot establish a green baseline (e.g., test runner is broken), STOP and report. Do not proceed with cleanup on unverified ground.
150
151
 
151
- ### Phase 3: Cleanup plan
152
+ ### Phase 3: Cleanup plan — existence first, then smells
152
153
 
153
- Produce an explicit plan **before** spawning the removal agents:
154
+ The largest, safest deletion is code that should not have existed. **Before categorizing smells, run the deletion ladder on each changed unit:**
155
+
156
+ - **Delete entirely** — the behavior is not needed (YAGNI, speculative, dead on arrival).
157
+ - **Reuse** — an existing helper or pattern in this repo already does it; replace the reimplementation with a call to it.
158
+ - **Platform / stdlib / native / dependency** — the language stdlib, the runtime, or an already-installed dependency already does it (a hand-rolled date picker → `<input type="date">`, a custom query parser → `URLSearchParams`, a bespoke debounce → the util already imported).
159
+ - **Simplify in place** — it must exist; make it smaller.
160
+
161
+ Only code that lands on **Simplify in place** proceeds to the smell categories. This turns the pass from "find smells to trim" into "first decide whether the code should exist, then trim what survives." One function replaced by a platform call is a bigger, safer win than any in-place cleanup — and it needs no per-line smell analysis.
162
+
163
+ For a diff that **fixes a bug**, grep the callers of every shared function it touches. Prefer one root-cause fix at the shared seam over repeated guards at each caller — a per-caller patch that leaves a sibling caller broken is a partial fix, not a cleanup.
164
+
165
+ Then produce an explicit plan **before** spawning the removal agents:
154
166
 
155
167
  ```
156
168
  File: src/foo.py
169
+ Ladder: 2 units simplify-in-place; 1 unit delete (native <input> replaces custom picker)
157
170
  Categories: dead code, excessive complexity, performance
158
171
  Order: dead code → complexity → performance
159
172
  Risk: medium (touches caching layer)
160
173
 
161
174
  File: src/bar.py
175
+ Ladder: all simplify-in-place
162
176
  Categories: obvious comments, over-defensive
163
177
  Order: comments → defensive
164
178
  Risk: low
165
179
  ```
166
180
 
181
+ **Intentional shortcuts:** if the plan deliberately keeps a bounded simplification (a naive scan fine under N rows, a global lock, an O(n²) path), mark it in-code with a `debt:` comment naming the ceiling and the upgrade trigger (in omo, prefix with `// @allow` so the comment-checker treats it as intentional), and list it under "Remaining Risks / Deferred" in the report. That section is the debt ledger — a simplification with a known ceiling and no marker is indistinguishable from a bug.
182
+
167
183
  Order rule (safest → riskiest): comments → dead code → defensive → duplication → complexity → abstraction/boundary → performance → tests → oversized-modules. This minimizes blast radius of any one change.
168
184
 
169
185
  ### Phase 4: Parallel slop removal via `deep` agents in batches of 5
@@ -192,13 +208,9 @@ task(
192
208
  prompt="""
193
209
  Remove AI slops from: {file_path}
194
210
 
195
- In addition to your default categories (obvious comments, over-defensive code, spaghetti nesting), also evaluate these categories:
196
- - Excessive complexity: god functions, long parameter lists, complex booleans, nested ternaries
197
- - Needless abstraction: pass-through wrappers, single-use helpers, speculative indirection
198
- - Boundary violations: wrong-layer imports, leaky responsibilities, hidden coupling
199
- - Dead code: unused imports, unreachable branches, stale flags, debug leftovers
200
- - Duplication: copy-paste branches, redundant helpers
201
- - Performance equivalences: O(n²)→O(n) via set lookup, hoist computation out of loops, eager→lazy collections, batch redundant calls, cache repeated len()/length
211
+ First run the deletion ladder from Phase 3 on this file (delete entirely / reuse existing repo code / platform-stdlib-native / simplify in place); only code that must exist proceeds to smell removal.
212
+
213
+ Then evaluate EVERY category defined in this skill's "Categories (what counts as slop)" section, applying that section's KEEP and REFACTOR rules verbatim — the Categories section you have loaded is canonical, do not work from a restated subset.
202
214
 
203
215
  Apply changes in this order (safest → riskiest): comments → dead code → defensive → duplication → complexity → abstraction/boundary → performance → oversized-modules.
204
216
 
@@ -273,18 +285,19 @@ Behavior Lock:
273
285
  - Baseline status: GREEN
274
286
 
275
287
  Cleanup Plan:
276
- - path/to/file1.ts: [dead code → complexity → performance]
277
- - path/to/file2.py: [comments → defensive]
288
+ - path/to/file1.ts: [ladder: 1 delete (native) + simplify-in-place] → [dead code → complexity → performance]
289
+ - path/to/file2.py: [ladder: all simplify-in-place] → [comments → defensive]
278
290
 
279
- Per-File Results:
291
+ Per-File Results (each cut shows what replaces it):
280
292
  path/to/file1.ts
281
- - Dead code: 3 removed (lines X-Y, A-B, C)
293
+ - Ladder/delete: custom DatePicker (48 lines) <input type="date"> (native), flatpickr import removed
294
+ - Dead code: 3 removed (lines X-Y, A-B, C) → nothing (unreachable)
282
295
  - Excessive complexity: 1 simplified (nested ternary at L42 → if/else)
283
296
  - Performance: 1 (line N: list scan → set lookup, O(n²)→O(n), behavior identical)
284
297
  - Skipped (preserved): 2 (defensive null check at boundary; commented WHY at L88)
285
298
 
286
299
  path/to/file2.py
287
- - Obvious comments: 5 removed
300
+ - Obvious comments: 5 removed → nothing
288
301
  - Over-defensive: 1 simplified (redundant isinstance on typed param)
289
302
 
290
303
  Quality Gates:
@@ -302,8 +315,14 @@ Critical Review:
302
315
  Issues Found & Fixed:
303
316
  - [None] OR [Issue description → Fix applied]
304
317
 
305
- Remaining Risks / Deferred:
318
+ Net Impact:
319
+ - LOC: -74 (removed 91, added 17)
320
+ - Dependencies: -1 (flatpickr removed; native <input type="date"> used)
321
+ - Files deleted: 1 (src/date-picker-wrapper.ts — platform-native replacement)
322
+
323
+ Remaining Risks / Deferred (this section is the debt ledger):
306
324
  - [None] OR [e.g., "boundary violation in module X flagged but not refactored — needs human judgment"]
325
+ - `debt:` markers kept this pass: [None] OR [file:line — ceiling → upgrade trigger]
307
326
 
308
327
  Final Status: CLEAN | ISSUES FIXED | REQUIRES ATTENTION
309
328
  ```
@@ -111,6 +111,16 @@ Key fields: `maxWidth`, `overflowLines[]`, `borderMisaligned`, `wideCharColumns[
111
111
 
112
112
  This JSON (diff ratio, similarity score, hotspots or overflow lines, border alignment, wide-char columns, alpha) is REFERENCE evidence to aim the reviewers. It is not the verdict by itself.
113
113
 
114
+ ### Motion and interaction capture
115
+
116
+ Static screenshots miss what moves. For every interactive element and every animated region, do NOT settle for a single resting frame — capture the motion as evidence:
117
+
118
+ - **Interaction states:** drive the real browser to each state before capturing. Hover the element, focus it, click/press it, and for scroll-driven surfaces scroll to trigger the effect. Capture three frames per transition: **rest** (before), **mid-transition** (~100ms in, to prove the animation exists and is smooth), and **settled** (after it completes).
119
+ - **Entrance and scroll motion:** capture scroll-triggered reveals and any load animation as a short frame sequence (start, mid, end), not one frame. A reveal that never fires, janks, or lands in the wrong place is a defect only the sequence exposes.
120
+ - **Reference clones:** when the reference site has its own motion, capture the reference's motion the same way and compare it to the actual — timing, easing feel, and end state.
121
+
122
+ **Animation is never an excuse to skip or pass a region.** A high `diffRatio` caused by an in-flight animation is **never a valid excuse** to dismiss a defect or wave a region through. Compare **settled state to settled state** for pixel fidelity, and separately verify the motion against the **reference's own motion** (or, with no reference, against the stated intent). "The pixels differ because it animates" is a reason to capture the settled frame and the motion properly — not a reason to pass.
123
+
114
124
  ## Step 3 - Dispatch two read-only QA subagents in parallel
115
125
 
116
126
  This independent review is REQUIRED before any "done" claim. Do not self-review inside the main agent and call the UI verified - a self-graded pass is the failure mode this step exists to stop. Dispatch it yourself, every time, without waiting to be told. Give each reviewer the captures for every enumerated page from Step 2, not a sample, and tell it the page count so it can confirm none were skipped.
@@ -157,6 +167,7 @@ CHECK EACH:
157
167
  5. Responsive and resize behavior across viewport sizes (web) or terminal resize (TUI).
158
168
  6. Do the user-intended FEATURES actually work: interactions, states, navigation (web); input handling, resize, scroll (TUI)? Trace the code paths.
159
169
  7. Reference packet coverage: every reference page, state, viewport, and annotated requirement is implemented or explicitly marked out of scope by the user. Missing copy, missing overview content, swapped hierarchy, or unimplemented reference states are BLOCKING.
170
+ 8. Slop animation: flag motion that signals nothing. A hover-without-action (a hover that produces no state change or affordance), motion on a non-interactive element, or a decorative micro-animation with no informational purpose is slop and a REVISE finding. Motion must map to a real interaction, state, or affordance; the hero may carry one signature moment, nothing else earns decoration.
160
171
 
161
172
  OUTPUT:
162
173
  VERDICT: PASS | REVISE | FAIL
@@ -5907,7 +5907,7 @@ var package_default;
5907
5907
  var init_package = __esm(() => {
5908
5908
  package_default = {
5909
5909
  name: "@oh-my-opencode/omo-codex",
5910
- version: "4.14.2",
5910
+ version: "4.15.0",
5911
5911
  type: "module",
5912
5912
  private: true,
5913
5913
  description: "Codex harness adapter for oh-my-openagent. Vendored Codex plugin namespace (omo) + TypeScript installer + telemetry.",
@@ -199,3 +199,10 @@ capture evidence and a local reconnaissance run following the MIT-licensed
199
199
  `JCodesMore/ai-website-cloner-template` workflow; it is not copied from Aside or from the
200
200
  template. Aside names, trademarks, product text, and visual assets remain the property of
201
201
  their respective owners and are referenced only for descriptive design-analysis purposes.
202
+
203
+ `frontend/references/design/clone-from-url.md` is a project-original runtime-extraction
204
+ workflow guide. Its browser + `getComputedStyle` clone approach follows the same
205
+ MIT-licensed `JCodesMore/ai-website-cloner-template` clone-website workflow that `aside.md`
206
+ cites; no source from that template is copied. It carries no third-party attribution beyond
207
+ that lineage note, and it grants no license to copy any target site's trademarks, brand
208
+ assets, or proprietary copy.
@@ -24,8 +24,11 @@ This file is a router, not a rulebook. The rules live in four rulesets under `re
24
24
 
25
25
  Every implementation must choose one of these branches before UI code changes:
26
26
 
27
- 1. **Concrete visual reference:** if the user supplies a screenshot, generated mockup, Stitch/Imagen output, Figma export, overview, or annotated reference packet, treat it as the visual contract. Load `references/design/image-to-code-skill.md` plus the relevant design/perfection files, extract the reference's exact tokens, layout geometry, copy, spacing, states, and responsive intent into `DESIGN.md`, then implement reusable primitives against that contract. Final QA must run `/visual-qa` in reference-fidelity mode: compare the actual UI against the reference packet pixel-by-pixel and verify the code is an extensible design-system implementation, not a screenshot-matched one-off.
28
- 2. **Greenfield or fresh setup:** if the user gave no concrete visual reference, use `references/design/_INDEX.md` to shortlist 2-3 plausible Layer B references, then deeply load exactly one Layer A style skill and one Layer B brand/design-system reference; use `open-design` only when the curated set has no fit. Treat those references as source material, not mood labels: extract tokens, layout grammar, component anatomy, interaction states, motion, and taste decisions into `DESIGN.md`, then recombine them into project-specific primitives. Customize for the user's product and content, but do not freestyle past the selected references; never copy logos, trademarked assets, or brand-specific copy. Define Section 5 primitives with variants, default/hover/active/focus/disabled/loading/empty/error states, accessibility, and motion before code. Build them first in a component showcase or state harness; each primitive and required state must pass mobile/tablet/desktop visual QA before product screens.
27
+ 1. **Concrete visual reference:** the user supplied a reference treat it as the visual contract, then handle it by kind:
28
+ - **Static visual reference** (screenshot, generated mockup, Stitch/Imagen output, Figma export, overview, or annotated packet): load `references/design/image-to-code-skill.md` plus the relevant design/perfection files, extract the reference's exact tokens, layout geometry, copy, spacing, states, and responsive intent into `DESIGN.md`, then implement reusable primitives against that contract.
29
+ - **Live site or URL reference** (the user names a site to clone or gives a URL): load `references/design/clone-from-url.md`. Drive a real browser and extract the runtime truth via `getComputedStyle` — tokens, layout geometry, default/hover/focus/active states, transitions and keyframes, and downloaded assets — into `DESIGN.md`, then clone-code reusable primitives against that contract.
30
+ Final QA for both runs `/visual-qa` in reference-fidelity mode: compare the actual UI against the reference pixel-by-pixel and verify the code is an extensible design-system implementation, not a screenshot-matched one-off.
31
+ 2. **Greenfield or fresh setup:** if the user gave no concrete visual reference, use `references/design/_INDEX.md` to shortlist 2-3 plausible Layer B references, then deeply load exactly one Layer A style skill and one Layer B brand/design-system reference; use `open-design` only when the curated set has no fit. Treat those references as source material, not mood labels: extract tokens, layout grammar, component anatomy, interaction states, motion, and taste decisions into `DESIGN.md`, then recombine them into project-specific primitives — never freestyle past the selected references, never copy logos or brand-specific copy. For an expressive brief (glossy, premium, wow, brand-grade), default to generating 2-3 imagen concept drafts, each seeded with the loaded Layer A + Layer B tokens (palette, type, material); pick the strongest and treat the chosen draft as the reference-fidelity contract. Define Section 5 primitives and their default/hover/active/focus/disabled/loading/empty/error states before code, and pass each through mobile/tablet/desktop visual QA before product screens.
29
32
  3. **Existing project with `DESIGN.md` or a component system:** read it, follow it, and update it before implementation only when the requested work needs a new token, primitive, state, motion rule, accessibility constraint, accepted debt, or reference-fidelity requirement.
30
33
  4. **Existing project with UI but no `DESIGN.md` and no reusable component layer:** STOP and ask the user one focused question: should you preserve the current look with copy-nearby styling, or extract a real `DESIGN.md` plus reusable components before continuing? Do not silently choose.
31
34
 
@@ -120,7 +123,8 @@ Domains: `product` `style` `typography` `color` `landing` `chart` `ux` `react` `
120
123
  - **Never weaken UX OR flatten the surface to buy points.** No dropping animations, hiding content, simplifying interactions, or replacing rendered/lit material with flat fills and flat geometric primitives for a Lighthouse score or a deadline. Hit 100 AND keep the surface dimensional — both, or neither.
121
124
  - **No emojis as icons.** SVG icon sets only (Lucide, Heroicons, Radix, Phosphor).
122
125
  - **GPU-composited animation only** — `transform`, `opacity`, `filter`; never animate layout properties.
123
- - **Verify in a real browser before declaring done.** Screenshots at 375 / 768 / 1280px; hover, focus, loading, empty, and error states all exercised.
126
+ - **Slop animation is forbidden motion serves meaning.** Every animation or hover must map to a real interaction, state change, or affordance. A hover that changes nothing, motion on a non-interactive element, or a decorative micro-animation with no informational purpose is slop — do not add it.
127
+ - **Done is the `/visual-qa` dual-oracle gate, not your own glance.** A frontend design task is verified through `/visual-qa` (real browser at 375 / 768 / 1280px, every page, with interaction states and motion driven and inspected) until the dual-oracle completion gate passes on fresh evidence.
124
128
 
125
129
  ## When to load something else instead
126
130