feat(agents): add design gate for automatic ui-ux-pro-max detection

Lightweight skills (feat, hotfix, bugfix) had zero plugin awareness —
design tasks ran without ui-ux-pro-max even when relevant. Add a
design gate (lib/design-gate.md) that auto-detects UI/style signals
in task description and filesystem, then asks the user to activate
ui-ux-pro-max if inactive. Orchestrators already handle this via
their STEP 0 plugin-check.

Co-Authored-By: Claude <noreply@anthropic.com>

CLAUDE.md

@@ -159,3 +159,10 @@ Key routing rules:
 - Security audit → invoke cso
 - Initialize new project from scratch → invoke init-project
 - Onboard existing project → invoke onboard
+
+Design gate (automatic):
+All lightweight skills (feat, hotfix, bugfix) include a design gate that auto-detects
+UI/style signals in the task. If design signals found and ui-ux-pro-max is inactive,
+the agent asks the user whether to activate it before proceeding.
+Gate spec: lib/design-gate.md. Orchestrators (ship-feature, init-project) already
+handle this via their STEP 0 plugin-check.

agents/bugfixer.md

@@ -34,6 +34,13 @@ Identify:
 git log --oneline -20 --all -- <suspected files>
 ```
 
+## STEP 1.5 — DESIGN GATE
+
+Follow `$HOME/.claude/lib/design-gate.md`:
+- Scan $ARGUMENTS and target files for design/UI/style signals (CSS, component, layout, animation).
+- If signals found and `ui-ux-pro-max` inactive → ask user to activate.
+- If no signals → skip (zero overhead).
+
 ## STEP 2 — INVESTIGATE
 
 Trace the bug from symptom to root cause:
@@ -126,7 +133,7 @@ Execute in automatic mode:
 
 ## RULES
 - No fix without understanding the root cause first.
-- No plugin check (lightweight skill, not an orchestrator).
+- Design gate only if UI/style signals detected. See STEP 1.5.
 - If investigation reveals a design flaw requiring significant
   refactoring → stop, explain, suggest `/ship-feature` for the
   proper fix.

agents/feater.md

@@ -39,6 +39,13 @@ Print a one-line scope confirmation:
 FEAT: <feature name> — ~<N> files, <brief approach>
 ```
 
+## STEP 0.5 — DESIGN GATE
+
+Follow `$HOME/.claude/lib/design-gate.md`:
+- Scan $ARGUMENTS and target files for design/UI/style signals.
+- If signals found and `ui-ux-pro-max` inactive → ask user to activate.
+- If no signals → skip (zero overhead).
+
 ## STEP 1 — MINI-PLAN
 
 Quick mental model, not a formal plan document:
@@ -116,7 +123,7 @@ Execute in automatic mode:
 
 ## RULES
 - Max 5 files. If more needed → `/ship-feature`.
-- No plugin check (not an orchestrator).
+- Design gate only (not full plugin check). See STEP 0.5.
 - No brainstorm/design phase (if needed → `/ship-feature`).
 - No subagents — direct implementation.
 - Keep scope tight. If scope creep happens mid-work, stop

agents/hotfixer.md

@@ -31,6 +31,13 @@ git log --oneline -3
   "This looks deeper than a hotfix. Load `$HOME/.claude/agents/bugfixer.md`
   and run the BUGFIXER agent on this target."
 
+## STEP 1.5 — DESIGN GATE
+
+Follow `$HOME/.claude/lib/design-gate.md`:
+- Scan $ARGUMENTS and target files for design/UI/style signals (CSS, component, styling, animation).
+- If signals found and `ui-ux-pro-max` inactive → ask user to activate.
+- If no signals → skip (zero overhead).
+
 ## STEP 2 — FIX
 
 Apply the minimal change that fixes the bug:
@@ -72,7 +79,7 @@ Execute in automatic mode:
 ## RULES
 - Max 2 files changed. If more needed → `/bugfix`.
 - No refactoring. No "while we're here" improvements.
-- No plugin check (overhead > value for a hotfix).
+- Design gate only if CSS/style signals detected. See STEP 1.5.
 - If root cause is unclear → escalate to `/bugfix`.
 - If fix touches >5 lines of logic → reconsider if this is
   truly a hotfix.

agents/plugin-advisor.md

@@ -165,12 +165,14 @@ When the plugin-advisor detects a `simple` or `hotfix` signal, suggest the appro
 |---|---|---|---|
 | Typo, CSS fix, wrong value, missing import | `/hotfix` | Root cause obvious, 1-2 files max | ~30s |
 | Bug with unclear root cause, multi-file | `/bugfix` | Needs investigation before fixing, up to ~5 files | ~3 min |
-| Small feature, 1-5 files | `/feat` | Well-scoped addition, no design needed | ~2 min |
+| Small feature, 1-5 files | `/feat` | Well-scoped addition, design gate included | ~2 min |
 | Large feature, design decisions needed | `/ship-feature` | Multi-file, needs brainstorm + plan + review | ~10 min |
 | New project from scratch | `/init-project` | Full project setup with scaffolding | ~15 min |
 
 **Escalation path:** `/hotfix` → `/bugfix` → `/ship-feature` (bugs), `/feat` → `/ship-feature` (features). Each skill documents when to escalate to the next level.
 
+**Design gate:** `/feat`, `/hotfix`, and `/bugfix` include a lightweight design gate (`lib/design-gate.md`) that auto-detects UI/style signals and asks the user to activate `ui-ux-pro-max` if inactive. This covers the gap where lightweight skills previously had no plugin awareness for design tasks.
+
 ---
 
 ## COMPATIBILITY MATRIX

lib/design-gate.md

@@ -0,0 +1,50 @@
+# DESIGN GATE — Auto-detect design tasks, activate ui-ux-pro-max
+
+Inline snippet. Include in any agent STEP 0 that may touch UI/design.
+
+## WHEN TO RUN
+
+Run this gate when the task description OR target files match design signals.
+
+## DETECTION
+
+Check BOTH the task description AND the filesystem:
+
+**Task description signals** (case-insensitive match on $ARGUMENTS):
+- UI keywords: `component`, `button`, `card`, `modal`, `dialog`, `tooltip`, `dropdown`, `sidebar`, `navbar`, `header`, `footer`, `layout`, `grid`, `form`, `input`, `table`
+- Style keywords: `css`, `style`, `theme`, `color`, `font`, `spacing`, `margin`, `padding`, `border`, `shadow`, `animation`, `transition`, `hover`, `responsive`, `dark mode`, `light mode`
+- Design keywords: `design`, `ui`, `ux`, `visual`, `polish`, `pixel`, `figma`, `mockup`, `wireframe`, `prototype`
+- Framework UI: `tailwind`, `styled-component`, `emotion`, `chakra`, `radix`, `shadcn`, `headless`
+
+**Filesystem signals** (quick check, no deep scan):
+- Target files have `.tsx`, `.jsx`, `.css`, `.scss`, `.less`, or `.module.css` extension
+- `tailwind.config` or `postcss.config` present in project root
+- `tokens/`, `theme/`, or `design-system/` directory exists
+- Storybook config (`.storybook/`) present
+
+## DECISION
+
+If **at least one signal** is detected:
+
+1. Check if `ui-ux-pro-max` is active:
+   ```bash
+   source "$HOME/.claude/lib/detect-plugins.sh"
+   detect_uiux_pro_max && echo "ACTIVE" || echo "INACTIVE"
+   ```
+
+2. If **ACTIVE** → proceed silently. The plugin context is already available.
+
+3. If **INACTIVE** → ask the user:
+   ```
+   🎨 DESIGN DETECTED — task touches UI/styling.
+   ui-ux-pro-max is not active. Activate it for design-aware guidance?
+   (yes / no)
+   ```
+   - On **yes** → print `⚡ Activating ui-ux-pro-max...` and proceed with design context.
+   - On **no** → print `Proceeding without design plugin.` and continue normally.
+
+## IMPORTANT
+
+- This gate adds ~5 seconds overhead. Worth it for design quality.
+- Do NOT run this gate on pure backend/API/CLI tasks (no signals = no gate).
+- If no signal detected → skip entirely, zero overhead.

tasks/TODO.md

@@ -22,3 +22,11 @@
 ## Skill /doc
 - [x] Mettre à jour doc-syncer.md pour gérer ajouts/suppressions de features
 - [x] Mettre à jour SKILL.md description pour mentionner feature delta
+
+## Auto-activation ui-ux-pro-max sur détection design
+- [x] Créer `lib/design-gate.md` — snippet réutilisable (detect design signals + ask to activate ui-ux-pro-max)
+- [x] Intégrer dans feater.md — STEP 0.5 entre scope check et mini-plan
+- [x] Intégrer dans hotfixer.md — STEP 1.5 (si CSS/style/animation)
+- [x] Intégrer dans bugfixer.md — STEP 1.5 (si bug UI/style)
+- [x] Mettre à jour plugin-advisor.md — PHASE 4 : cohérence avec le design gate
+- [x] Mettre à jour CLAUDE.md skill routing — documenter le comportement auto