tribunal-kit 5.8.5 → 6.0.1

package/.agent/workflows/tribunal-frontend.md

@@ -1,22 +1,32 @@
 ---
-description: Frontend and React specific Tribunal. Runs Logic + Security + Frontend + Type Safety + UI/UX + Motion reviewers. Use for React components, hooks, UI code, Next.js pages, Server Components, and Client Components.
-required-skills: react-specialist, nextjs-react-expert, frontend-design, review-animations, emil-design-eng
+description: Frontend and React specific Tribunal. Runs Logic + Security + Frontend + Type Safety + UI/UX + Motion + Visual Audit reviewers. Use for React components, hooks, UI code, Next.js pages, Server Components, and Client Components.
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - ui-skill-packs
+  - react-specialist
+  - nextjs-react-expert
+  - frontend-design
+  - review-animations
+  - emil-design-eng
+scripts-binding:
+  - .agent/scripts/lint_runner.js
+  - .agent/scripts/security_scan.js
 ---
 
-# /tribunal-frontend — Frontend Code Audit
+# /tribunal-frontend — Frontend Code & Visual Audit
 
 $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE frontend review:
-□ Target component files       → The UI code being audited
-□ tailwind.config / globals.css → Understand design tokens
-□ package.json                 → Verify frontend dependencies (framer-motion, radicle, etc.)
-```
+Before auditing React components or frontend UI logic, you MUST inspect:
+1. Design Tokens & Styling Context (`globals.css`, `tailwind.config`) → Verify OKLCH color palettes, typography scale, and dark mode classes
+2. Active UI Skill Pack (`.agent/skills/ui-skill-packs/SKILL.md`) → Load mandatory UI skill pack (Pack 1: Foundations, Pack 2: Motion, Pack 3: Systems)
+3. 7-Reviewer Frontend Gate → Run logic, security, frontend-reviewer, type-safety, ui-ux-auditor, motion-reviewer, and visual-auditor before approving UI diffs
 
 ---
 
@@ -32,7 +42,7 @@ Read BEFORE frontend review:
 
 ---
 
-## 6 Active Reviewers (All Run Simultaneously)
+## 7 Active Reviewers (All Run Simultaneously)
 
 ### precedence-reviewer → Checks local repo Case Law for past rejections
 
@@ -73,6 +83,11 @@ Read BEFORE frontend review:
 - Color contrast below WCAG AA (4.5:1)
 - Typography and spacing not following design system logic
 
+### ui-visual-auditor (Closed-Loop Visual Gate)
+
+- Runs `node scripts/visual_audit.js --file <target>` to verify OKLCH color compliance, surface depth layering (hairline borders + ambient shadows), and interactive state polish.
+- Rejects flat card containers lacking depth or hex hacks without design tokens.
+
 ### review-animations (The Socratic Gate)
 
 - Any UI animation exceeding 300ms budget

package/.agent/workflows/tribunal-full.md

@@ -1,22 +1,37 @@
 ---
-description: Runs ALL 20 parallel reviewers simultaneously. Maximum hallucination coverage. Use before merging any AI-generated code, before production deployments, or when maximum confidence is required.
-required-skills: all domain skills auto-loaded
+description: Runs ALL 21 parallel reviewers simultaneously. Maximum hallucination coverage. Use before merging any AI-generated code, before production deployments, or when maximum confidence is required.
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - clean-code
+  - backend-security-expert
+  - frontend-design
+  - database-design
+  - mobile-design
+  - performance-profiling
+scripts-binding:
+  - .agent/scripts/security_scan.js
+  - .agent/scripts/dependency_analyzer.js
+  - .agent/scripts/lint_runner.js
+  - .agent/scripts/schema_validator.js
+  - .agent/scripts/test_runner.js
+  - .agent/scripts/bundle_analyzer.js
+  - .agent/scripts/verify_all.js
 ---
 
-# /tribunal-full — Complete 20-Reviewer Audit
+# /tribunal-full — Complete 21-Reviewer Audit
 
 $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE full review:
-□ All modified files          → Use git diff to see pending changes
-□ package.json                → Verify all dependencies
-□ Config files                 → tsconfig, next.config, tailwind.config
-```
+Before launching the full 21-reviewer audit, you MUST inspect:
+1. Pending Code Modifications (`git diff` / modified files) → Inspect diffs across all domains (frontend, backend, database, mobile)
+2. Workspace Configuration Context (`package.json`, `tsconfig.json`, `tailwind.config`) → Verify project build contracts
+3. 21-Reviewer Synthesis Gate → Execute all 21 specialized reviewers in parallel; halt on any security violation or critical bug before Human Gate approval
 
 ---
 
@@ -32,43 +47,43 @@ Read BEFORE full review:
 
 ---
 
-## 20 Reviewers — All Active Simultaneously
+## 21 Reviewers — Stage-Partitioned Execution (3 Waves)
+
+To eliminate context window saturation and reviewer attention dilution, the 21 reviewers execute in 3 partitioned passes:
 
 ```
-Tier 1: Always active (universal concerns)
+Wave 1: Core Integrity & Precedences (Pass 1)
 ├── precedence-reviewer    → Checks local repo Case Law for past rejections
 ├── logic-reviewer         → Hallucinated methods, impossible logic, undefined refs
-├── security-auditor       → OWASP 2025, injection, JWT, SSRF, IDOR
+├── schema-reviewer        → Missing input validation, loose schemas, raw req.body
 └── resilience-reviewer    → Swallowed errors, unhandled rejections, missing retries
 
-Tier 2: Code quality
+Wave 2: Security, Types & Code Quality (Pass 2)
+├── security-auditor       → OWASP 2025, injection, JWT, SSRF, IDOR
 ├── dependency-reviewer    → Fabricated packages, supply chain, version compatibility
 ├── type-safety-reviewer   → 'any' epidemic, Zod parse vs cast, unguarded access
 ├── complexity-reviewer    → Enforces the Dependency Ladder to prevent over-engineering
-├── schema-reviewer        → Missing input validation, loose schemas, raw req.body
 └── sql-reviewer           → Injection, N+1, missing indexes, unscoped mutations
 
-Tier 3: Domain-specific
+Wave 3: Domain, UI & Performance (Pass 3)
 ├── frontend-reviewer      → React 19 APIs, RSC violations, hook rules, hydration
-├── performance-reviewer   → 2026 CWV targets, re-render cascades, memory leaks
+├── performance-reviewer   → Core Web Vitals targets, re-render cascades, memory leaks
 ├── mobile-reviewer        → Reanimated thread safety, FlashList, safe area insets
 ├── ai-code-reviewer       → Model name hallucinations, prompt injection, cost explosion
 ├── test-coverage-reviewer → Happy path only, brittle selectors, missing edge cases
 ├── accessibility-reviewer → WCAG 2.2 AA, ARIA misuse, focus management, live regions
 ├── ui-ux-auditor          → Generic AI aesthetics, missing hover states, contrast
-└── review-animations      → UI animations >300ms, origin-unaware popovers, ease-in
-
-Tier 4: Performance Swarm (token-scoped specialists)
-├── vitals-reviewer        → Frontend CWV depth: Suspense waterfalls, paint jank, animation leaks
-├── db-latency-auditor     → DB layer: N+1, unbounded queries, unindexed WHERE, pool config
-└── throughput-optimizer   → Server runtime: event-loop blocks, serialized awaits, memory leaks
+├── review-animations      → UI animations >300ms, origin-unaware popovers, ease-in
+├── vitals-reviewer        → Frontend CWV depth: Suspense waterfalls, paint jank
+├── db-latency-auditor     → DB layer: N+1, unbounded queries, unindexed WHERE
+└── throughput-optimizer   → Server runtime: event-loop blocks, serialized awaits
 ```
 
 ---
 
 ## Active Reviewers by Code Type
 
-Not all 20 reviewers produce meaningful findings on all code types. Active reviewers detect their first finding immediately — inactive reviewers auto-pass with "N/A for this code type."
+Not all 21 reviewers produce meaningful findings on all code types. Active reviewers detect their first finding immediately — inactive reviewers auto-pass with "N/A for this code type."
 
 | Code Under Review   | Critical Reviewers                                                |
 | :------------------ | :---------------------------------------------------------------- |
@@ -86,7 +101,7 @@ Not all 20 reviewers produce meaningful findings on all code types. Active revie
 ## Verdict Aggregation
 
 ```
-All 20 verdicts are collected. Aggregated result:
+All 21 verdicts are collected. Aggregated result:
 
 If ANY reviewer = ❌ REJECTED → Global verdict: ❌ REJECTED (must fix before Human Gate)
 If any reviewer = ⚠️ WARNING  → Global verdict: ⚠️ WARNINGS (proceed with attention)
@@ -124,7 +139,7 @@ After 3 failed attempts:
 
 | Outcome                    | Next Command                                   |
 | :------------------------- | :--------------------------------------------- |
-| All 19 reviewers approve   | → `/deploy` — highest confidence state         |
+| All 21 reviewers approve   | → `/deploy` — highest confidence state         |
 | Reject with multiple fixes | → `/fix` for simple issues, `/debug` for logic |
 | Performance rejection      | → `/tribunal-speed` for granular profiling     |
 | Security rejection         | → Immediate `/tribunal-backend` to resolve     |

package/.agent/workflows/tribunal-mobile.md

@@ -1,6 +1,15 @@
 ---
 description: Mobile-specific Tribunal. Runs Logic + Security + Mobile reviewers. Use for React Native, Expo, gesture handlers, animations, navigation, and any iOS/Android-targeted code.
-required-skills: building-native-ui, mobile-design
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - building-native-ui
+  - mobile-design
+  - swiftui-expert
+scripts-binding:
+  - .agent/scripts/lint_runner.js
+  - .agent/scripts/security_scan.js
 ---
 
 # /tribunal-mobile — Mobile Code Audit
@@ -9,14 +18,12 @@ $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE mobile review:
-□ Target component files       → The mobile code being audited
-□ package.json                 → Verify versions (expo, react-native-reanimated)
-□ app.json / app.config.js     → Check for correct permissions and plugins
-```
+Before auditing React Native, Expo, or native mobile code, you MUST inspect:
+1. Native Configuration Manifests (`app.json`, `app.config.js`, `package.json`) → Verify Expo SDK version, Reanimated dependencies, and permissions
+2. Gesture & 60fps Motion Rules → Enforce `react-native-reanimated` worklets on UI thread; ban JavaScript bridge layout thrashing
+3. 3-Reviewer Mobile Gate → Run logic-reviewer, security-auditor, and mobile-reviewer before approving mobile component diffs
 
 ---
 

package/.agent/workflows/tribunal-performance.md

@@ -1,6 +1,15 @@
 ---
 description: Performance-specific Tribunal. Runs Logic + Performance reviewers. Use when code is slow, for optimization tasks, bundle analysis, Core Web Vitals improvement, memory leak investigation, and before deploying performance-critical features.
-required-skills: performance-profiling
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - performance-profiling
+  - 60fps-animation
+  - gsap-performance
+scripts-binding:
+  - .agent/scripts/bundle_analyzer.js
+  - .agent/scripts/test_runner.js
 ---
 
 # /tribunal-performance — Performance Audit
@@ -9,14 +18,12 @@ $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE performance review:
-□ Target code files           → The code being optimized
-□ package.json                → Check for known heavy libraries (e.g. moment, lodash)
-□ Next.js / bundler config    → Check for bundle optimization settings
-```
+Before optimizing code or running performance reviews, you MUST inspect:
+1. Target Source & Heavy Import Inspection (`package.json`, `next.config.js`) → Identify heavy library imports (`moment`, full `lodash`) for tree-shaking
+2. Measured Baseline Metrics → Run `bundle_analyzer.js` or latency measurements; ban claiming performance improvements without measured proof
+3. 2-Reviewer Performance Gate → Run logic-reviewer and performance-optimizer before approving optimization diffs
 
 ---
 

package/.agent/workflows/tribunal-speed.md

@@ -1,6 +1,15 @@
 ---
 description: Full-stack parallel performance audit. Runs 3 scoped specialists simultaneously — vitals-reviewer (Frontend CWV), db-latency-auditor (SQL/ORM), throughput-optimizer (Node.js server) — then synthesizes a single ranked report. Maximum 5 AI calls regardless of project size. Use when full-stack performance profiling is needed.
-required-skills: performance-profiling, observability
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - performance-profiling
+  - observability
+  - edge-computing
+scripts-binding:
+  - .agent/scripts/bundle_analyzer.js
+  - .agent/scripts/verify_all.js
 ---
 
 # /tribunal-speed — Full-Stack Performance Swarm
@@ -9,14 +18,12 @@ $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE performance swarm:
-□ Target directory/files      → Determine frontend vs backend vs DB code
-□ package.json                → Identify the full stack architecture
-□ Database schemas            → Needed for the db-latency-auditor
-```
+Before running a full-stack performance audit, you MUST inspect:
+1. Target Full-Stack File Map → Determine frontend components, Node.js server routes, and database models
+2. Max 5 AI Call Ceiling → Cap swarm executions to 3 parallel specialists + 1 synthesis step to prevent token explosion
+3. Ranked Impact Synthesis → Output findings strictly in a single unified table prioritized by user-facing latency impact
 
 ---
 
@@ -181,7 +188,7 @@ If a specialist fails after 3 retries:
 | :------------------------- | :------------------------------- | :--------------------- | :--------------------------------------- |
 | `/tribunal-performance`    | logic + performance-reviewer     | Generic CWV check      | Quick single-file perf scan              |
 | `/tribunal-speed`          | vitals + db-latency + throughput | Deep 3-domain parallel | Full-stack perf audit                    |
-| `/tribunal-full`           | All 19 reviewers                 | Everything             | Maximum coverage (security + perf + all) |
+| `/tribunal-full`           | All 21 reviewers                 | Everything             | Maximum coverage (security + perf + all) |
 | `/performance-benchmarker` | Lighthouse + bundle              | Measurement only       | Get actual scores, not code review       |
 
 ---

package/.agent/workflows/tribunal-ui.md

@@ -0,0 +1,82 @@
+---
+description: Specialized UI/UX Tribunal. Runs UX + Visual + Interaction + Anti-Pattern + Product Heuristics + Accessibility + Visual Auditor reviewers. Use for all visual designs, component layouts, and design-system reviews.
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - ui-reasoning-engine
+  - product-aware-heuristics
+  - ui-ux-pro-max
+  - frontend-design
+  - web-design-guidelines
+scripts-binding:
+  - .agent/scripts/lint_runner.js
+  - .agent/scripts/verify_all.js
+---
+
+# /tribunal-ui — Dedicated UI/UX Review Pipeline
+
+$ARGUMENTS
+
+---
+
+## Mandatory Pre-Flight Context Inspection
+
+Before executing dedicated UI/UX audits or design-system reviews, you MUST inspect:
+1. Active Design Tokens & Guidelines (`DESIGN.md`, CSS custom properties) → Confirm typography scale, color system, and corner radius tokens
+2. Product Domain Category → Select category heuristics (Dashboard, E-Commerce, Landing Page, Mobile App, Marketing)
+3. 7-Reviewer Dedicated UI Gate → Run ux-auditor, visual-auditor, interaction-auditor, anti-pattern-auditor, product-heuristics, a11y-auditor, and visual-auditor before passing designs
+
+---
+
+## When to Use /tribunal-ui
+
+| Use `/tribunal-ui` when... | Use instead when... |
+| :--- | :--- |
+| Auditing visual hierarchy & rhythm | Reviewing backend routing → `/tribunal-backend` |
+| Verifying interactive states and hover/focus | Reviewing database transaction code → `/tribunal-database` |
+| Checking responsive behavior and ergonomics | Doing general logical code checks → `/tribunal-frontend` |
+| Banning generic AI templates & purple gradients | |
+| Testing accessibility compliance (WCAG 2.2 AA) | |
+
+---
+
+## 7 Specialized UI Reviewers (Running Simultaneously)
+
+### 1. ux-reviewer
+*   **Focus:** Hick's Law, Fitts's Law, cognitive load, scanning patterns, scannability, and progressive disclosure.
+*   **Check:** Are primary action targets separated from destructive ones? Is choice overload prevented?
+
+### 2. visual-reviewer
+*   **Focus:** Typographical scaling, alignment, margins, 8px grid discipline, and line lengths.
+*   **Check:** Do Display headings balanced-wrap (`text-wrap: balance`)? Is negative space utilized?
+
+### 3. interaction-reviewer
+*   **Focus:** Full interactive state styling (Default, Hover, Active/Pressed, Disabled, Focus-visible, Loading).
+*   **Check:** Is there scale-down active click feedback? Are focus outlines visible and offset?
+
+### 4. anti-pattern-reviewer
+*   **Focus:** Blocking generic AI visual clichés.
+*   **Check:** Blocks purple/violet primary colors, radial mesh gradients, bento grid overload, flat cards lacking depth, and card-in-card overlap.
+
+### 5. product-reviewer
+*   **Focus:** Matching the UI structure to product category heuristics (SaaS, DevTool, AI Interface, Landing, Fintech).
+*   **Check:** Tabular numbers used for financial data? Monospace code snippets for DevTools? Typing skeleton streams for AI?
+
+### 6. accessibility-reviewer
+*   **Focus:** WCAG 2.2 Level AA compliance.
+*   **Check:** Minimum target size 24px (standard AA) and 44px (touch). Semantic headings, accessible ARIA names, and keyboard trap focus in dialogs.
+
+### 7. ui-visual-auditor (Closed-Loop Visual Gate)
+*   **Focus:** Screenshot or DOM layout verification.
+*   **Check:** Checks vertical overflow, layout shifts (CLS), alignment shifts, and contrast ratios.
+
+---
+
+## Verdict System
+
+```
+If ANY reviewer → ❌ REJECTED: Maker must fix and resubmit before Human Gate
+If any reviewer → ⚠️ WARNING:  highlighted at Human Gate, must fix before deploy
+If all reviewers → ✅ APPROVED: Passes to Human Gate for writing approval
+```

package/.agent/workflows/ui-ux-pro-max.md

@@ -1,6 +1,17 @@
 ---
-description: Plan and implement cutting-edge advanced UI/UX. Creates distinctive, production-grade frontend interfaces with high design quality that avoid generic AI aesthetics. Now uses a modular swarm architecture to decompose layout, styling, and motion tasks.
-required-skills: ui-ux-researcher, frontend-design, emil-design-eng, motion-engineering, agent-organizer, parallel-agents
+description: Plan and implement cutting-edge advanced UI/UX. Uses the UI Reasoning Engine to structure layout and styling, and routes through the dedicated `/tribunal-ui` reviewer pipeline.
+tools: Read, Grep, Glob, Bash, Edit, Write
+version: 3.0.0
+last-updated: 2026-07-30
+required-skills:
+  - ui-reasoning-engine
+  - product-aware-heuristics
+  - ui-ux-pro-max
+  - frontend-design
+  - web-design-guidelines
+scripts-binding:
+  - .agent/scripts/lint_runner.js
+  - .agent/scripts/auto_preview.js
 ---
 
 # /ui-ux-pro-max — Advanced UI/UX Design
@@ -9,126 +20,62 @@ $ARGUMENTS
 
 ---
 
-## $CONTEXT_REQUIRED
+## Mandatory Pre-Flight Context Inspection
 
-```
-Read BEFORE designing:
-□ Current UI components       → Follow project idioms and design systems
-□ .agent/skills/frontend-design/SKILL.md → Refresh UI guidelines
-```
+Before designing or implementing advanced UI/UX layouts, you MUST inspect:
+1. Active Design Tokens & System (`DESIGN.md`, CSS custom properties) → Verify OKLCH color palettes, typography scale, and spacing grid
+2. UI Reasoning Engine 16-Step Pipeline (`.agent/skills/ui-reasoning-engine/SKILL.md`) → Structure component layout, micro-interactions, and accessibility before coding
+3. Anti-Generic Aesthetic Rule → Ban plain purple/violet AI gradients and stock hero templates; enforce bespoke visual hierarchy and tactile micro-interactions
 
 ---
 
 ## When to Use /ui-ux-pro-max
 
-| Use `/ui-ux-pro-max` when...              | Use instead when...                     |
-| :---------------------------------------- | :-------------------------------------- |
+| Use `/ui-ux-pro-max` when... | Use instead when... |
+| :--- | :--- |
 | Building a visually distinctive interface | Functional-only component → `/generate` |
-| Design quality is the primary goal        | Fast page needed → `/enhance`           |
-| Creating from a design brief              | Bug fix in UI → `/debug`                |
-| Mobile + web parity required              |                                         |
+| Design quality is the primary goal | Fast page needed → `/enhance` |
+| Creating from a design brief | Bug fix in UI → `/debug` |
+| Mobile + web parity required | |
 
 ---
 
-## Phase 1 — Design Intent (Mandatory)
+## Phase 1 — Design Intent & Product Aware Reasoning (Mandatory)
 
-Answer these before any design work:
+Answer these before writing any code (using the `ui-reasoning-engine` skill):
+1. **Who is the user?** (Casual consumer vs expert operator).
+2. **What is the product category?** (SaaS, DevTool, AI Interface, Landing, Fintech).
+3. **What is the visual direction?** (Brutalist, Editorial, Soft Minimal, Dark Luxury, Swiss).
+4. **What is the primary user goal?** (Optimize the layout and click paths for this action).
+5. **What are the accessibility requirements?** (Focus paths, target size, Lc contrast).
 
-```
-1. Who is the user? (developer tools feel different from consumer apps)
-2. What emotion should the interface evoke? (calm focus, urgent speed, playful delight)
-3. What is the ONE thing users do most? (hero interaction gets maximum design attention)
-4. What existing interfaces does the user love? (don't copy — understand the WHY)
-5. What makes this interface DIFFERENT from every competitor?
-```
+Write the **🧠 UI Reasoning Engine Trace** in your response as a collapsed markdown block before the code.
 
 ---
 
-## Phase 2 — Design Identity
+## Phase 2 — Visual Identity & Design Tokens
 
-Every interface built by /ui-ux-pro-max has a distinct visual identity:
-
-```
-Forbidden defaults (generic AI aesthetics):
-❌ Purple/violet as primary color
-❌ Left text / right image hero section
-❌ Mesh gradient backgrounds
-❌ Bento grid as the only layout
-❌ Emoji as icons
-❌ shadcn without explicit user request
-
-Distinctive alternatives:
-✅ Signal orange, acid green, warm slate, deep red — intentional palettes
-✅ Typographic-first hero sections
-✅ Grain textures, solid contrast, radial depth
-✅ Asymmetric or broken-grid layouts
-✅ SVG icons (lucide-react or custom)
-✅ Motion that communicates meaning (not decoration)
-```
+Every interface must use custom variables defined in `DESIGN.md` and `design-tokens.json`:
+*   ❌ **Banned Clichés:** Purple/violet accents, mesh gradients, glassmorphism overuse, default library themes.
+*   ✅ **Intentional Styling:** Dynamic OKLCH colors, 8px grid alignment, variable font sizes with CSS `clamp()`, and 1px luminous borders.
 
 ---
 
-## Phase 3 — Interaction Craft
+## Phase 3 — Interaction States & Micro-interactions
 
-Every interactive element has 4 states designed:
-
-```
-1. Default:  The base state
-2. Hover:    Indicates interactability (cursor change, subtle lift, color shift)
-3. Active:   Confirms click/press (scale down, darker, haptic feedback on mobile)
-4. Disabled: Communicates unavailability (reduced opacity, cursor change, tooltip why)
-```
-
-Micro-animations are required, not optional:
-
-```
-Entry animations:  elements fade/slide in on mount
-State transitions: smooth color + scale changes (150–200ms)
-Loading states:    skeleton screens, not spinners (skeleton shows shape)
-Error shake:       invalid form input shakes (4px left-right)
-Success pulse:     confirmed actions pulse green briefly
-```
+Ensure every interactive element has styling defined for:
+*   `hover`, `focus-visible`, `active`/`pressed`, and `disabled` states.
+*   Confirm clicks with spring scale-down transitions (`active:scale-[0.97]`).
+*   Trap keyboard focus within modals/dialogs and return it to the trigger on close.
 
 ---
 
-## Phase 4 — Swarm Implementation (Modular Generation)
-
-Instead of a single agent generating the entire UI, `/ui-ux-pro-max` leverages a Fan-Out/Fan-In swarm architecture using `.agent/scripts/swarm_dispatcher.js`. The Supervisor decomposes the component into a structured JSON contract for three specialized workers:
+## Phase 4 — Swarm Implementation & UI Review Pipeline
 
-### Worker 1: Layout Architect (`frontend-specialist`)
-- **Focus**: Semantic HTML, accessibility tree, and component composition.
-- **Rules**: Zero styling, just the raw structure and React state logic.
-- **WCAG Checks**: Keyboard navigation, screen reader semantics (role, label).
-
-### Worker 2: Styling & Token Specialist (`frontend-design`)
-- **Focus**: Applies Tailwind classes and design tokens based on the Phase 2 Identity.
-- **Rules**: Must enforce color contrast (4.5:1 minimum) and spacing scale; strictly avoids generic AI defaults.
-
-### Worker 3: Motion Engineer (`motion-engineering` + `emil-design-eng`)
-- **Focus**: Injects GSAP, Framer Motion, or CSS springs for micro-interactions (Phase 3).
-- **Rules**: Enforces Emil Kowalski's non-negotiable UI standards: all UI animations <300ms, popovers are origin-aware, entering elements strictly use `ease-out`, and `prefers-reduced-motion` is honored.
-
-**Execution Flow**:
-1. Supervisor builds the JSON contract for the 3 workers.
-2. Dispatches workers in parallel via `swarm_dispatcher.js`.
-3. Fan-in synthesis merges the layout, styles, and motion into the final component file.
-4. Final code is routed through `/tribunal-frontend` (which now includes the `review-animations` strict UI constraint gate) for the Human Gate.
-
----
-
-## Phase 5 — Design Verification
-
-Before finalizing:
-
-```
-□ Open in mobile viewport (375px) — does it work?
-□ Open in dark mode — does it look intentional?
-□ Keyboard-navigate through the critical path — is it complete?
-□ Screenshot and ask: "Would I scroll past this on Dribbble?"
-□ Screen reader test with VoiceOver or NVDA
-```
-
----
+1. **Layout Design:** Create the structural grid and semantic accessibility tree.
+2. **Token Application:** Apply Tailwind classes or style blocks using variables.
+3. **Motion Integration:** Add GSAP or Framer Motion transitions (keeping motion <300ms, respecting reduced motion).
+4. **Tribunal Review Gate:** Route the generated component through `/tribunal-ui` for parallel verification.
 
 ---
 
@@ -138,18 +85,15 @@ Before finalizing:
 /ui-ux-pro-max design a SaaS dashboard for an analytics platform
 /ui-ux-pro-max redesign the checkout flow with better conversion UX
 /ui-ux-pro-max create an onboarding flow for a developer tool
-/ui-ux-pro-max design the landing page hero section with distinctive layout
-/ui-ux-pro-max create a data visualization dashboard with real-time updates
+/ui-ux-pro-max design the landing page hero section with a distinctive visual style
 ```
 
 ---
 
 ## After /ui-ux-pro-max — Next Steps
 
-| Outcome                   | Next Command                           |
-| :------------------------ | :------------------------------------- |
-| Design complete           | → `/preview start` to see it in action |
-| Need responsive checks    | → `/review` or manual viewport testing |
-| Needs backend integration | → `/tribunal-backend` to hook up APIs  |
-
----
+| Outcome | Next Command |
+| :--- | :--- |
+| Design complete | → `/preview start` to see it in action |
+| Reviewers reject with fixes | → Apply fixes, then run `/tribunal-ui` again |
+| Performance concerns | → `/performance-benchmarker` for Lighthouse/CWV |

package/CONTRIBUTING.md

@@ -42,9 +42,9 @@ tribunal-kit/
 │   └── index.d.ts          # TypeScript declarations
 ├── crates/core/            # Rust core engine (Tokio-based)
 ├── .agent/                 # The intelligence payload (agents, skills, workflows)
-│   ├── agents/             # 44 specialist and reviewer agent definitions
+│   ├── agents/             # 51 specialist and reviewer agent definitions
 │   ├── skills/             # Reusable skill packs
-│   ├── workflows/          # 34 workflow definitions
+│   ├── workflows/          # 37 workflow definitions
 │   └── scripts/            # Automation scripts
 ├── test/
 │   ├── unit/               # Unit tests (Jest)