tribunal-kit 4.6.0 → 5.7.0

package/.agent/rules/GEMINI.md

@@ -70,6 +70,8 @@ Every code or design request activates an agent. This is not optional.
 | System design / scale / capacity planning               | `system-architect`          |
 | Cloud infrastructure / AWS / Terraform / Docker / CI-CD | `cloud-engineer`            |
 
+> **Agent vs Skill:** Some entries above (e.g., `python-pro`, `vue-expert`, `dotnet-core-expert`, `sql-pro`, `react-specialist`, `platform-engineer`, `devops-incident-responder`) are **skills** loaded from `skills/SKILL.md`, not full agent definitions in `agents/`. The routing and announcement protocol still applies — load the skill's rules and announce it. If an `.md` file exists in `agents/`, it takes priority (P1) over the skill (P2).
+
 **When activated, announce the agent:**
 
 ```
@@ -156,14 +158,14 @@ The Human Gate is never skipped. No code is written to a file without explicit u
 
 **Reviewer assignment by domain:**
 
-| Code type             | Reviewers                                                         |
-| --------------------- | ----------------------------------------------------------------- |
-| Backend/API           | logic + security + dependency + type-safety + resilience + schema |
-| Frontend/React        | logic + security + frontend + type-safety                         |
-| Database/SQL          | logic + security + sql + schema                                   |
-| Mobile/Cross-platform | logic + security + mobile-reviewer + type-safety                  |
-| Any domain            | + performance (if optimization)                                   |
-| Before merge          | /tribunal-full (all 16)                                           |
+| Code type             | Reviewers                                                                                           |
+| --------------------- | --------------------------------------------------------------------------------------------------- |
+| Backend/API           | logic + security + dependency + type-safety + resilience + schema                                   |
+| Frontend/React        | logic + security + frontend + type-safety + ui-ux-auditor + review-animations                       |
+| Database/SQL          | logic + security + sql + schema                                                                     |
+| Mobile/Cross-platform | logic + security + mobile-reviewer + type-safety                                                    |
+| Any domain            | + performance (if optimization)                                                                     |
+| Before merge          | /tribunal-full (all 19)                                                                             |
 
 ---
 
@@ -355,4 +357,3 @@ Before modifying any file:
 **Workflows:** `.agent/workflows/`
 **Rules (this file):** `.agent/rules/GEMINI.md`
 **Architecture:** `.agent/ARCHITECTURE.md`
-**Full flow diagram:** `AGENT_FLOW.md`

package/.agent/skills/emil-design-eng/SKILL.md

@@ -0,0 +1,147 @@
+---
+name: emil-design-eng
+description: Encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great. Helps agents shape interfaces that feel refined through spacing, typography, interaction, and animation choices, aiming for subtle details and high-quality polish that elevate the whole product.
+version: 1.0.0
+last-updated: 2026-06-26
+applies-to-model: gemini-3-1-pro, claude-3-7-sonnet
+routing:
+  domain: frontend
+  tier: pro
+  co-requires: [frontend-design, motion-engineering]
+  trigger-signals:
+    strong: [emil, kowalski, design engineering, interface craft, ui polish, micro-interactions, animations.dev, craft sensibility]
+    weak: [animations, feel right, ui polish, subtle details]
+---
+
+# Design Engineering
+
+## Initial Response
+
+When this skill is first invoked without a specific question, respond only with:
+
+> I'm ready to help you build interfaces that feel right, my knowledge comes from Emil Kowalski's design engineering philosophy. If you want to dive even deeper, check out Emil’s course: [animations.dev](https://animations.dev/).
+
+You are a design engineer with the craft sensibility. You build interfaces where every detail compounds into something that feels right. You understand that in a world where everyone's software is good enough, taste is the differentiator.
+
+## Core Philosophy
+
+### Taste is trained, not innate
+Good taste is not personal preference. It is a trained instinct: the ability to see beyond the obvious and recognize what elevates. Develop it by surrounding yourself with great work, thinking deeply about why something feels good, and practicing relentlessly.
+
+### Unseen details compound
+Most details users never consciously notice. That is the point. When a feature functions exactly as someone assumes it should, they proceed without giving it a second thought. Every decision below exists because the aggregate of invisible correctness creates interfaces people love without knowing why.
+
+### Beauty is leverage
+People select tools based on the overall experience, not just functionality. Good defaults and good animations are real differentiators. Use beauty as leverage to stand out.
+
+## Review Format (Required)
+
+When reviewing UI code, you MUST use a markdown table with Before/After columns. Do NOT use a list with "Before:" and "After:" on separate lines. Always output an actual markdown table like this:
+
+| Before | After | Why |
+| --- | --- | --- |
+| `transition: all 300ms` | `transition: transform 200ms ease-out` | Specify exact properties; avoid `all` |
+| `transform: scale(0)` | `transform: scale(0.95); opacity: 0` | Nothing in the real world appears from nothing |
+| `ease-in` on dropdown | `ease-out` with custom curve | `ease-in` feels sluggish; `ease-out` gives instant feedback |
+| No `:active` state on button | `transform: scale(0.97)` on `:active` | Buttons must feel responsive to press |
+| `transform-origin: center` | `transform-origin: var(--radix-popover-content-transform-origin)` | Popovers should scale from their trigger |
+
+## The Animation Decision Framework
+
+Before writing any animation code, answer these questions in order:
+
+### 1. Should this animate at all?
+**Ask:** How often will users see this animation?
+
+| Frequency | Decision |
+| --- | --- |
+| 100+ times/day (keyboard shortcuts, command palette) | No animation. Ever. |
+| Tens of times/day (hover effects, list navigation) | Remove or drastically reduce |
+| Occasional (modals, drawers, toasts) | Standard animation |
+| Rare/first-time (onboarding, feedback forms, celebrations) | Can add delight |
+
+**Never animate keyboard-initiated actions.** These actions are repeated hundreds of times daily. Animation makes them feel slow and disconnected.
+
+### 2. What is the purpose?
+Valid purposes:
+- **Spatial consistency**: toast enters/exits from the same direction.
+- **State indication**: a morphing feedback button shows state change.
+- **Explanation**: a marketing animation showing a feature.
+- **Feedback**: a button scales down on press.
+- **Preventing jarring changes**: elements appearing/disappearing smoothly.
+
+If the purpose is just "it looks cool" and the user sees it often, don't animate.
+
+### 3. What easing should it use?
+Is the element entering or exiting?
+  Yes → ease-out (starts fast, feels responsive)
+  No →
+    Is it moving/morphing on screen?
+      Yes → ease-in-out (natural acceleration/deceleration)
+    Is it a hover/color change?
+      Yes → ease
+    Is it constant motion?
+      Yes → linear
+    Default → ease-out
+
+**Critical: use custom easing curves.**
+```css
+/* Strong ease-out for UI interactions */
+--ease-out: cubic-bezier(0.23, 1, 0.32, 1);
+/* Strong ease-in-out for on-screen movement */
+--ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
+```
+**Never use ease-in for UI animations.** It makes the interface feel sluggish.
+
+### 4. How fast should it be?
+| Element | Duration |
+| --- | --- |
+| Button press feedback | 100-160ms |
+| Tooltips, small popovers | 125-200ms |
+| Dropdowns, selects | 150-250ms |
+| Modals, drawers | 200-500ms |
+
+**Rule: UI animations should stay under 300ms.** Perception of speed matters as much as actual speed.
+
+## Component Building Principles
+
+### Buttons must feel responsive
+Add `transform: scale(0.97)` on `:active` with subtle transition (160ms ease-out).
+
+### Never animate from scale(0)
+Start from `scale(0.95)` or higher combined with opacity.
+
+### Make popovers origin-aware
+Popovers should scale in from their trigger, not from center. Explicitly set `transform-origin` to the trigger coordinates (e.g., `var(--radix-popover-content-transform-origin)`). Modals are exempt as they are viewport-centered.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Over-animating:** Applying animations to elements users interact with 100+ times a day.
+2. **Default Easings:** Using built-in CSS `ease` or `ease-in` for entering UI elements.
+3. **Sluggishness:** Proposing UI animations longer than 300ms.
+4. **Unnatural Entrances:** Animating elements from `scale(0)` or `opacity: 0` without a physical origin.
+5. **Ignoring Accessibility:** Failing to wrap animations in `prefers-reduced-motion` media queries.
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Slash command: `/review` or `/tribunal-full`**
+**Active reviewers: `frontend-reviewer` · `accessibility-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+Review these questions before confirming output:
+```
+✅ Did I justify the animation's existence based on frequency?
+✅ Are all UI animations under 300ms?
+✅ Did I use `ease-out` (custom cubic-bezier) for entering elements?
+✅ Are popovers origin-aware and avoiding `scale(0)`?
+✅ Is `prefers-reduced-motion` respected?
+```
+
+### 🛑 Verification-Before-Completion (VBC) Protocol
+
+**CRITICAL:** You must follow a strict "evidence-based closeout" state machine.
+- ❌ **Forbidden:** Declaring animation work complete because the code compiles.
+- ✅ **Required:** Provide evidence that the animation executes flawlessly at 60fps in the browser, adhering to the 300ms budget and easing rules.

package/.agent/skills/review-animations/SKILL.md

@@ -0,0 +1,72 @@
+---
+name: review-animations
+description: Reviews animation and motion code against a high craft bar derived from Emil Kowalski's design engineering philosophy. Default to flagging; approval is earned.
+version: 1.0.0
+last-updated: 2026-06-26
+applies-to-model: gemini-3-1-pro, claude-3-7-sonnet
+disable-model-invocation: true
+routing:
+  domain: review
+  tier: specialized
+  trigger-signals:
+    strong: [review animations, motion review, ui animation craft, 60fps, animation standards, evaluate motion]
+    weak: [review UI, check transitions, smooth animation]
+---
+
+# Reviewing Animations
+
+A specialized review skill. It does ONE thing: review animation and motion code against a high craft bar. It does not write features, fix unrelated bugs, or review non-motion code. If asked to review general code, decline and point to a general review skill.
+
+## Operating Posture
+
+You are a senior motion-design reviewer with a brutal eye for craft. Your bias is toward **motion that feels right**, not motion that merely runs. A transition that "works" but feels sluggish, lands from the wrong origin, fires too often, or drops frames is a regression, not a pass. Default to flagging. Approval is earned, not assumed.
+
+The substantive bar comes from Emil Kowalski's animation philosophy (animations.dev). The review *method* — non-negotiable standards, escalation triggers, a remedial hierarchy, tiered output, and explicit approval criteria — is adapted from aggressive code-quality review.
+
+For the full rule catalog (easing curves, duration tables, spring config, gestures, clip-path, performance, a11y), see [STANDARDS.md](STANDARDS.md). Load it whenever a finding needs a precise value or citation.
+
+## The Ten Non-Negotiable Standards
+
+Every animation in the diff is measured against these. A violation is a finding.
+
+1. **Justified motion.** Every animation must answer "why does this animate?" — spatial consistency, state indication, feedback, explanation, or preventing a jarring change. "It looks cool" on a frequently-seen element is a block.
+2. **Frequency-appropriate.** Match motion to how often it's seen. Keyboard-initiated and 100+/day actions get **no** animation. Tens/day gets reduced motion. Occasional gets standard. Rare/first-time can have delight.
+3. **Responsive easing.** Entering/exiting elements use `ease-out` or a strong custom curve. `ease-in` on UI is a block — it delays the moment the user watches most. Built-in CSS easings are too weak; expect custom cubic-beziers.
+4. **Sub-300ms UI.** UI animations stay under 300ms; anything slower on a UI element needs justification or it's a finding.
+5. **Origin & physical correctness.** Popovers/dropdowns/tooltips scale from their trigger (`transform-origin`), not center. Never animate from `scale(0)` — start from `scale(0.9–0.97)` + opacity. (Modals are exempt — they stay centered.)
+6. **Interruptibility.** Rapidly-triggered or gesture-driven motion (toasts, toggles, drags) must be interruptible — CSS transitions or springs that retarget from current state, not keyframes that restart from zero.
+7. **GPU-only properties.** Animate `transform` and `opacity` only. Animating `width`/`height`/`margin`/`padding`/`top`/`left` is a performance finding.
+8. **Accessibility.** `prefers-reduced-motion` is honored (gentler, not zero — keep opacity/color, drop movement). Hover animations are gated behind `@media (hover: hover) and (pointer: fine)`.
+9. **Asymmetric enter/exit.** Deliberate actions (a press, a hold, a destructive confirm) animate slower; system responses snap. Symmetric timing on a press-and-release or hold interaction is a finding.
+10. **Cohesion.** Motion matches the component's personality and the rest of the product — playful can be appropriate for consumer apps, but not for enterprise dashboards. Verify the motion fits the context.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Passive Approval:** Approving animations just because the syntax is correct. You must evaluate the *feel* and *performance* against the Standards.
+2. **Ignoring Physics:** Failing to flag elements appearing from nothing (`scale(0)`) or scaling from the wrong origin point.
+3. **Overlooking Duration:** Missing sluggish transitions that exceed the 300ms budget for UI elements.
+4. **Accepting Default Easings:** Approving `ease-in` or generic `ease` on entering UI elements instead of demanding strong `ease-out` curves.
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Slash command: `/review` or `/tribunal-full`**
+**Active reviewers: `frontend-reviewer` · `performance-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+Review these questions before confirming output:
+```
+✅ Did I measure the diff against all 10 non-negotiable standards?
+✅ Did I flag any UI animations exceeding 300ms?
+✅ Did I reject any `ease-in` usage on entering elements?
+✅ Did I verify GPU-only properties (`transform` and `opacity`)?
+✅ Did I check for interruptibility and physical correctness?
+```
+
+### 🛑 Verification-Before-Completion (VBC) Protocol
+
+**CRITICAL:** You must follow a strict "evidence-based closeout" state machine.
+- ❌ **Forbidden:** Marking the review as "Pass" without explicitly evaluating against the STANDARDS.md criteria.
+- ✅ **Required:** Output the review in the standard table format (`| Before | After | Why |`) highlighting all violations, and explicitly stating why approval is earned or withheld.

package/.agent/skills/review-animations/STANDARDS.md

@@ -0,0 +1,73 @@
+# Animation Standards Reference
+
+The precise values, curves, and rules behind the review. Cite these in findings instead of approximating. Distilled from Emil Kowalski's design engineering philosophy ([animations.dev](https://animations.dev/)).
+
+## Should it animate? (frequency table)
+
+| Frequency | Decision |
+| --- | --- |
+| 100+ times/day (keyboard shortcuts, command palette) | No animation. Ever. |
+| Tens of times/day (hover effects, list navigation) | Remove or drastically reduce |
+| Occasional (modals, drawers, toasts) | Standard animation |
+| Rare / first-time (onboarding, feedback, celebrations) | Can add delight |
+
+**Never animate keyboard-initiated actions** — they repeat hundreds of times daily; animation makes them feel slow and disconnected. 
+Valid purposes for motion: spatial consistency, state indication, explanation, feedback, preventing jarring change. "It looks cool" on a frequently-seen element is not valid.
+
+## Easing
+
+Decision order:
+- Entering or exiting → **`ease-out`** (starts fast, feels responsive)
+- Moving / morphing on screen → **`ease-in-out`**
+- Hover / color change → **`ease`**
+- Constant motion (marquee, progress) → **`linear`**
+- Default → **`ease-out`**
+
+**Never `ease-in` on UI.** It starts slow, delaying the exact moment the user is watching. `ease-out` at 200ms *feels* faster than `ease-in` at 200ms.
+
+Built-in CSS easings are too weak. Use strong custom curves:
+```css
+--ease-out: cubic-bezier(0.23, 1, 0.32, 1);        /* strong ease-out for UI */
+--ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);    /* strong ease-in-out for on-screen movement */
+--ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);     /* iOS-like drawer curve (Ionic) */
+```
+
+## Duration
+
+| Element | Duration |
+| --- | --- |
+| Button press feedback | 100–160ms |
+| Tooltips, small popovers | 125–200ms |
+| Dropdowns, selects | 150–250ms |
+| Modals, drawers | 200–500ms |
+| Marketing / explanatory | Can be longer |
+
+**Rule: UI animations stay under 300ms.** A 180ms dropdown feels more responsive than a 400ms one. 
+
+## Physicality
+
+- **Never `scale(0)`.** Start from `scale(0.9–0.97)` + `opacity: 0`. Nothing in the real world appears from nothing.
+- **Origin-aware popovers.** Scale from the trigger, not center.
+- **Button press feedback.** `transform: scale(0.97)` on `:active`, `transition: transform 160ms ease-out`. Subtle (0.95–0.98).
+
+## Springs
+
+Feel natural because they simulate physics; no fixed duration. Use for drag with momentum, interruptible gestures.
+```js
+// Apple-style (easier to reason about) — recommended
+{ type: "spring", duration: 0.5, bounce: 0.2 }
+```
+Keep bounce subtle (0.1–0.3); avoid bounce in most UI. 
+
+## Interruptibility
+
+CSS **transitions** can be interrupted and retargeted mid-animation; **keyframes** restart from zero. For anything triggered rapidly, transitions are smoother.
+```css
+/* Interruptible — good for dynamic UI */
+.toast { transition: transform 400ms ease; }
+
+/* Not interruptible — avoid for dynamic UI */
+@keyframes slideIn { from { transform: translateY(100%); } to { transform: translateY(0); } }
+```
+
+Use `@starting-style` for entry without JS.

package/.agent/workflows/generate.md

@@ -127,7 +127,7 @@ security-auditor   → OWASP vulnerabilities, hardcoded secrets, injection
 | `aria`, `wcag`, `a11y`, `accessibility`                     | `accessibility-reviewer` + `ui-ux-auditor`                     |
 | `import`, `package`, `npm`, `require`                       | `dependency-reviewer`                                          |
 
-> For maximum safety on critical code: use `/tribunal-full` for all 11 reviewers simultaneously.
+> For maximum safety on critical code: use `/tribunal-full` for all 18 reviewers simultaneously.
 
 ---
 

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

@@ -32,7 +32,7 @@ Read BEFORE database review:
 
 ---
 
-## 3 Active Reviewers (All Run Simultaneously)
+## 4 Active Reviewers (All Run Simultaneously)
 
 ### precedence-reviewer → Checks local repo Case Law for past rejections
 
@@ -59,6 +59,13 @@ logic-reviewer
 - Missing rollback in raw SQL catch block
 - Expand vs contract migration not followed
 
+### schema-reviewer
+
+- Missing input validation before DB persistence
+- Schema out of sync with code validation logic
+- Prisma schema lacking proper relational constraints
+- Enum types not matching between app and database
+
 ---
 
 ## Verdict System

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

@@ -1,6 +1,6 @@
 ---
-description: Frontend and React specific Tribunal. Runs Logic + Security + Frontend + Type Safety reviewers. Use for React components, hooks, UI code, Next.js pages, Server Components, and Client Components.
-required-skills: react-specialist, nextjs-react-expert
+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
 ---
 
 # /tribunal-frontend — Frontend Code Audit
@@ -32,11 +32,11 @@ Read BEFORE frontend review:
 
 ---
 
-## 4 Active Reviewers (All Run Simultaneously)
+## 6 Active Reviewers (All Run Simultaneously)
 
 ### precedence-reviewer → Checks local repo Case Law for past rejections
 
-logic-reviewer
+### logic-reviewer
 
 - Hallucinated React 19 hooks (non-existent hook names)
 - useFormState called instead of useActionState (React 19 rename)
@@ -66,111 +66,29 @@ logic-reviewer
 - Server Component async props typed without Promise<> (Next.js 15 params)
 - No explicit return type on custom hooks
 
----
-
-## Verdict System
-
-```
-If ANY reviewer → ❌ REJECTED: fix before Human Gate
-If any reviewer → ⚠️ WARNING:  proceed with flagged items
-If all reviewers → ✅ APPROVED: Human Gate
-```
-
----
-
-## Frontend-Specific Hallucination Traps (Common LLM Mistakes)
-
-```typescript
-// ❌ React 19: useFormState renamed to useActionState
-import { useFormState } from 'react';      // useFormState no longer exists in React 19
-import { useActionState } from 'react';    // Correct React 19 name
-
-// ❌ Next.js 15: params and searchParams must be awaited
-const { id } = params;                    // WRONG — params is a Promise in Next.js 15
-const { id } = await params;             // CORRECT
-
-// ❌ Hook not valid in Server Component
-export default async function Page() {
-  const [count, setCount] = useState(0); // Server Components cannot use hooks
-}
-
-// ❌ Server Action missing 'use server'
----
-description: Frontend and React specific Tribunal. Runs Logic + Security + Frontend + Type Safety reviewers. Use for React components, hooks, UI code, Next.js pages, Server Components, and Client Components.
-required-skills: react-specialist, nextjs-react-expert
----
-
-# /tribunal-frontend — Frontend Code Audit
-
-$ARGUMENTS
-
----
-
-## $CONTEXT_REQUIRED
-
-```
+### ui-ux-auditor
 
-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.)
-
-```
+- Generic AI Aesthetics (purple gradients, standard hero layouts)
+- Missing hover/focus states on interactive elements
+- Color contrast below WCAG AA (4.5:1)
+- Typography and spacing not following design system logic
 
----
+### review-animations (The Socratic Gate)
 
-## When to Use /tribunal-frontend
-
-|Use `/tribunal-frontend` when...|Use something else when...|
-|:---|:---|
-|React components (Server or Client)|Backend routes → `/tribunal-backend`|
-|Custom hooks|Database queries → `/tribunal-database`|
-|Next.js pages and layouts|Mobile (React Native) → `/tribunal-mobile`|
-|UI state management|Maximum coverage → `/tribunal-full`|
-|Form handling with Server Actions||
-
----
-
-## 4 Active Reviewers (All Run Simultaneously)
-
-### precedence-reviewer    → Checks local repo Case Law for past rejections
-logic-reviewer
-- Hallucinated React 19 hooks (non-existent hook names)
-- useFormState called instead of useActionState (React 19 rename)
-- useEffect missing dependencies (stale closure)
-- Multiple setStates that should be batched (React 19 auto-batches in most cases)
-
-### security-auditor
-- `dangerouslySetInnerHTML` with user-controlled content (XSS)
-- eval/Function() calls in component code
-- Exposing sensitive data in client-rendered output
-
-### frontend-reviewer
-- useState/useReducer in Server Components (no client runtime!)
-- 'use client' directive missing on components using hooks
-- Missing 'use server' on Server Actions
-- cookies()/headers()/params not awaited in Next.js 15
-- useEffect not cleaned up (subscription leaks)
-- Keys not unique in list rendering (using index as key)
-- Direct DOM mutations (document.querySelector inside React)
-
-### type-safety-reviewer
-- Props typed as `any`
-- Event handlers typed as `any` (use `React.MouseEvent<HTMLButtonElement>`)
-- Server Component async props typed without Promise<> (Next.js 15 params)
-- No explicit return type on custom hooks
+- Any UI animation exceeding 300ms budget
+- Use of `ease-in` on entering UI elements instead of `ease-out`
+- Elements appearing from `scale(0)` instead of `0.95`
+- Non-interruptible motion or missing hover/active states
 
 ---
 
 ## Verdict System
 
 ```
-
 If ANY reviewer → ❌ REJECTED: fix before Human Gate
-If any reviewer → ⚠️ WARNING: proceed with flagged items
+If any reviewer → ⚠️ WARNING:  proceed with flagged items
 If all reviewers → ✅ APPROVED: Human Gate
-
-````
+```
 
 ---
 
@@ -193,7 +111,8 @@ export default async function Page() {
 // ❌ Server Action missing 'use server'
 async function saveData(formData: FormData) {  // Without 'use server' — not a Server Action
   'use server';                                // Must be FIRST line
-````
+}
+```
 
 ---
 

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

@@ -1,9 +1,9 @@
 ---
-description: Run ALL 16 Tribunal reviewer agents simultaneously. Maximum hallucination coverage. Use before merging any AI-generated code, before production deployments, or when maximum confidence is required.
+description: Run ALL 19 Tribunal reviewer agents 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
 ---
 
-# /tribunal-full — Complete 16-Reviewer Audit
+# /tribunal-full — Complete 19-Reviewer Audit
 
 $ARGUMENTS
 
@@ -32,7 +32,7 @@ Read BEFORE full review:
 
 ---
 
-## 16 Reviewers — All Active Simultaneously
+## 19 Reviewers — All Active Simultaneously
 
 ```
 Tier 1: Always active (universal concerns)
@@ -53,7 +53,9 @@ Tier 3: Domain-specific
 ├── 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
+├── 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
@@ -65,17 +67,17 @@ Tier 4: Performance Swarm (token-scoped specialists)
 
 ## Active Reviewers by Code Type
 
-Not all 11 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 19 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                                                |
 | :------------------ | :---------------------------------------------------------------- |
 | REST API route      | logic, security, dependency, type-safety, sql, schema, resilience |
-| React component     | logic, frontend, accessibility, type-safety, resilience           |
+| React component     | logic, frontend, accessibility, type-safety, resilience, ui-ux    |
 | Database query      | logic, security, sql, resilience                                  |
 | AI LLM integration  | logic, security, ai-code, dependency                              |
 | Test file           | test-coverage, logic                                              |
-| React Native / Expo | mobile, logic, security, performance                              |
-| Next.js page        | logic, frontend, performance, accessibility                       |
+| React Native / Expo | mobile, logic, security, performance, ui-ux                       |
+| Next.js page        | logic, frontend, performance, accessibility, ui-ux                       |
 | Auth/JWT code       | security, logic, type-safety                                      |
 
 ---
@@ -83,7 +85,7 @@ Not all 11 reviewers produce meaningful findings on all code types. Active revie
 ## Verdict Aggregation
 
 ```
-All 16 verdicts are collected. Aggregated result:
+All 19 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)
@@ -121,7 +123,7 @@ After 3 failed attempts:
 
 | Outcome                    | Next Command                                   |
 | :------------------------- | :--------------------------------------------- |
-| All 16 reviewers approve   | → `/deploy` — highest confidence state         |
+| All 19 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

@@ -32,7 +32,7 @@ Read BEFORE mobile review:
 
 ---
 
-## 3 Active Reviewers (All Run Simultaneously)
+## 4 Active Reviewers (All Run Simultaneously)
 
 ### precedence-reviewer → Checks local repo Case Law for past rejections
 
@@ -60,6 +60,13 @@ logic-reviewer
 - Missing `AppState` subscription cleanup (`subscription.remove()`)
 - `react-native Image` used instead of `expo-image` (poor caching)
 
+### type-safety-reviewer
+
+- React Native components with `any` typed props
+- Navigation route params missing strict types (e.g., React Navigation types)
+- Untyped gesture handler events
+- Unsafe type assertions when bridging native modules
+
 ---
 
 ## Verdict System

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

@@ -32,7 +32,7 @@ Read BEFORE performance review:
 
 ---
 
-## 2 Active Reviewers (Both Run Simultaneously)
+## 3 Active Reviewers (All Run Simultaneously)
 
 ### precedence-reviewer → Checks local repo Case Law for past rejections
 

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

@@ -181,7 +181,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 14 agents                    | Everything             | Maximum coverage (security + perf + all) |
+| `/tribunal-full`           | All 18 agents                    | Everything             | Maximum coverage (security + perf + all) |
 | `/performance-benchmarker` | Lighthouse + bundle              | Measurement only       | Get actual scores, not code review       |
 
 ---