tribunal-kit 9.0.0 → 9.0.1

package/.agent/skills/mcp-builder/SKILL.md

@@ -1,13 +1,13 @@
 ---
 name: mcp-builder
-description: Model Context Protocol (MCP) server integration mastery. Building custom MCP servers, standardizing tool exposes, managing standardized communication between large language models and localized datasets, securing boundary contexts, and architecting resource schemas. Use when modifying, extending, or building custom toolsets for AI platforms relying on the MCP standard.
-tools: Read, Grep, Glob, Bash, Edit, Write
-version: 4.0.0
-last-updated: 2026-09-07
+description: Use when Model Context Protocol (MCP) server integration mastery. Building custom MCP servers, standardizing tool exposes, managing standardized communication between large language models and localized datasets, securing boundary contexts, and architecting resource schemas. Use when modifying, extending, or building custom toolsets for AI platforms relying on the MCP standard.
+version: 5.0.0
+last-updated: 2026-09-13
 skills:
   - backend-security-expert
   - nodejs-best-practices
   - agentic-patterns
+tools: Read, Grep, Glob, Bash, Edit, Write
 scripts-binding:
   - .agent/scripts/lint_runner.js
   - .agent/scripts/verify_all.js
@@ -15,21 +15,41 @@ scripts-binding:
 
 # MCP Builder — Context Protocol Mastery
 
----
-
 ## Mandatory Pre-Flight Context Inspection
 
-Before architecting MCP tools or resource handlers, you MUST inspect:
-
-1. Strict Zod Input Validation (Section 45) → Enforce explicit JSON Schema parameter validation (Zod) for every tool exposed to the LLM
-2. Resource vs Tool Distinction (Section 68) → Use Resources for static read-only data (`file:///`, `db://schema`), Tools strictly for dynamic parameterized actions
-3. Output Payload Truncation Safeguard (Section 94) → Forcibly truncate large tool response outputs before returning payload to protect LLM context windows
+Before generating, refactoring, or reviewing code in the `mcp-builder` domain, inspect these 5 critical parameters:
 
+1. **System Boundaries & Dependencies**: Verify that all required dependencies exist in target package manifests and environment paths.
+2. **Runtime Context & Platform Invariants**: Confirm target platform constraints (Node.js, Browser, Mobile OS, Edge runtime) before applying APIs.
+3. **Execution Guardrails**: Identify potential side-effects, state mutations, and unhandled asynchronous exceptions.
+4. **Validation & Type Contracts**: Validate input data schemas and strict type constraints across all module interfaces.
+5. **Observability & Proof of Execution**: Ensure execution produces tangible verification signals (terminal output, tests, metrics).
 
 ## Activation Boundaries
 
-- **Activate when:** Operating in tasks requiring Model Context Protocol (MCP) server integration mastery. Building custom MCP servers, standardizing tool exposes, managing standardized communication between large language models and localized datasets, securing boundary contexts, and architecting resource schemas. Use when modifying, extending, or building custom toolsets for AI platforms relying on the MCP standard..
-- **DO NOT activate when:** The task falls strictly outside mcp-builder domain or belongs to a different dedicated specialist.
+- **Activate when:** Use when Model Context Protocol (MCP) server integration mastery. Building custom MCP servers, standardizing tool exposes, managing standardized communication between large language models and localized datasets, securing boundary contexts, and architecting resource schemas. Use when modifying, extending, or building custom toolsets for AI platforms relying on the MCP standard.
+- **DO NOT activate when:** The task falls outside the `mcp-builder` domain or is managed by a different dedicated specialist.
+
+## 🔁 Multi-Pass Execution Protocol
+
+Execute all non-trivial tasks through this 7-pass cognitive loop:
+
+| Pass | Phase | Core Action |
+|:---|:---|:---|
+| **Pass 1** | **Understand** | Deconstruct the user's explicit objective, implicit requirements, and platform constraints. |
+| **Pass 2** | **Plan** | Decompose the task into smallest logical steps; map dependencies and required tool calls. |
+| **Pass 3** | **Execute** | Implement the solution with production-grade craft, zero placeholders, and strict typing. |
+| **Pass 4** | **Verify** | Run linters, unit tests, or compiler checks to validate structural correctness. |
+| **Pass 5** | **Attack** | Perform an adversarial review searching for edge-case failures, race conditions, and traps. |
+| **Pass 6** | **Improve** | Eliminate discovered friction, optimize performance, and harden error boundaries. |
+| **Pass 7** | **Quality Gate** | Enforce Verification-Before-Completion (VBC) with concrete terminal proof before finalizing. |
+
+---
+
+## 🛠️ Technical Architecture & Reference Recipes
+
+---
+
 
 ## Hallucination Traps (Read First)
 
@@ -116,37 +136,45 @@ An MCP Server gives an external AI execution capability over your shell or datab
 
 ---
 
+## 🚨 Edge-Case & Failure Mode Matrix
+
+| Scenario | Risk | Mitigation Strategy |
+|:---|:---|:---|
+| **Empty or Null Inputs** | Unhandled exception or unexpected rendering collapse | Enforce fallback guards, optional chaining, and explicit empty state handlers |
+| **Network Timeout / Latency** | Hanging operations or duplicate side-effects | Implement bounded abort controllers, exponential backoff, and idempotency keys |
+| **Concurrency / Race Conditions** | Stale state overwrite or inconsistent data mutations | Use atomic transactions, mutex locking, or cancel-on-resubmit controls |
+| **Invalid Schema / Malformed Payload** | Downstream runtime errors or security injection | Validate boundary payloads with Zod/Pydantic schemas prior to execution |
+| **Resource / Memory Saturation** | OOM errors, frame drops, or memory leaks | Clean up listeners, cancel active timers, and enforce pagination/virtualization |
+
 ---
 
-AI coding assistants often fall into specific bad habits when dealing with this domain. These are strictly forbidden:
+## 🤖 LLM-Specific Traps Table
 
-1. **Over-engineering:** Proposing complex abstractions or distributed systems when a simpler approach suffices.
-2. **Hallucinated Libraries/Methods:** Using non-existent methods or packages. Always `// VERIFY` or check `package.json` / `requirements.txt`.
-3. **Skipping Edge Cases:** Writing the "happy path" and ignoring error handling, timeouts, or data validation.
-4. **Context Amnesia:** Forgetting the user's constraints and offering generic advice instead of tailored solutions.
-5. **Silent Degradation:** Catching and suppressing errors without logging or re-raising.
+| Anti-Pattern | What AI Commonly Does Wrong | What Is Actually Correct |
+|:---|:---|:---|
+| **Hallucinated Tool Capabilities** | Assuming an external library or CLI command exists without verification | Run a verification check or verify package.json before referencing tools |
+| **Premature Completion Claim** | Declaring a task finished because code was generated without verification | Execute tests, linters, or terminal commands to provide concrete proof |
+| **Context Bloat Dumping** | Pasting entire multi-thousand-line files into prompt context | Extract targeted excerpts, symbols, and signatures to preserve tokens |
 
 ---
 
 ## 🏛️ Tribunal Verification & Guardrails
 
-**Slash command: `/review` or `/tribunal-full`**
-**Active reviewers: `logic-reviewer` · `security-auditor`**
+**Active Reviewers:** `orchestrator` · `agent-organizer` · `logic-reviewer`
+**Slash Command:** `/review` or `/tribunal-full`
 
-### ❌ Forbidden AI Tropes
-1. **Blind Assumptions:** Never make an assumption without documenting it clearly with `// VERIFY: [reason]`.
-2. **Silent Degradation:** Catching and suppressing errors without logging or handling.
-3. **Context Amnesia:** Forgetting the user's constraints and offering generic advice instead of tailored solutions.
+### ✅ Pre-Flight Self-Audit Checklist
 
-### ✅ Pre-Flight Self-Audit
 ```
-✅ Did I rely ONLY on real, verified tools and methods?
-✅ Is this solution appropriately scoped to the user's constraints?
-✅ Did I handle potential failure modes and edge cases?
-✅ Have I avoided generic boilerplate that doesn't add value?
+✅ Did I deconstruct the root objective before proposing architecture?
+✅ Did I identify dependencies, bottlenecks, and parallelizable sub-tasks?
+✅ Did I avoid over-engineering and select the simplest effective pattern?
+✅ Did I verify assumptions with concrete file reads instead of speculation?
+✅ Did I establish measurable verification criteria before completion?
 ```
 
 ### 🛑 Verification-Before-Completion (VBC) Protocol
+
 **CRITICAL:** You must follow a strict "evidence-based closeout" state machine.
 - ❌ **Forbidden:** Declaring a task complete because the output "looks correct."
-- ✅ **Required:** You are explicitly forbidden from finalizing any task without providing **concrete evidence** (terminal output, passing tests, compile success, or equivalent proof) that your output works as intended.
+- ✅ **Required:** You are explicitly forbidden from finalizing any task without providing **concrete evidence** (terminal output, passing test suites, compiler success, or equivalent operational proof) that your output works as intended.

package/.agent/skills/micro-interaction/SKILL.md

@@ -1,127 +1,321 @@
 ---
 name: micro-interaction
-description: Detailed UI motion guidance for hover and press feedback, toggles, checkboxes, toasts, drawers, modals, list transitions, and shared-element interactions.
-version: 4.0.0
-last-updated: 2026-09-07
+description: Use when designing and engineering interactive component micro-motion, tactile button feedback, spring toggles, draw-on checkboxes, toasts, drawer gestures, and shared-element transitions.
+version: 5.0.0
+last-updated: 2026-09-13
 skills:
   - delight
   - better-ui
   - 60fps-animation
+  - review-animations
 tools: Read, Grep, Glob, Bash, Edit, Write
 scripts-binding:
   - .agent/scripts/lint_runner.js
   - .agent/scripts/verify_all.js
 ---
 
-# Micro-Interaction — Component Motion & Tactile Feedback
+# Micro-Interaction — Tactile Component Physics & Interactive State Synthesis
+
+## Mandatory Pre-Flight Context Inspection
+
+Before generating, refactoring, or reviewing code in the `micro-interaction` domain, inspect these 5 critical parameters:
+
+1. **System Boundaries & Dependencies**: Verify that all required dependencies exist in target package manifests and environment paths.
+2. **Runtime Context & Platform Invariants**: Confirm target platform constraints (Node.js, Browser, Mobile OS, Edge runtime) before applying APIs.
+3. **Execution Guardrails**: Identify potential side-effects, state mutations, and unhandled asynchronous exceptions.
+4. **Validation & Type Contracts**: Validate input data schemas and strict type constraints across all module interfaces.
+5. **Observability & Proof of Execution**: Ensure execution produces tangible verification signals (terminal output, tests, metrics).
+
+## Activation Boundaries
+
+- **Activate when:** Use when designing and engineering interactive component micro-motion, tactile button feedback, spring toggles, draw-on checkboxes, toasts, drawer gestures, and shared-element transitions.
+- **DO NOT activate when:** The task falls outside the `micro-interaction` domain or is managed by a different dedicated specialist.
+
+## 🔁 Multi-Pass Execution Protocol
+
+Execute all non-trivial tasks through this 7-pass cognitive loop:
+
+| Pass | Phase | Core Action |
+|:---|:---|:---|
+| **Pass 1** | **Understand** | Deconstruct the user's explicit objective, implicit requirements, and platform constraints. |
+| **Pass 2** | **Plan** | Decompose the task into smallest logical steps; map dependencies and required tool calls. |
+| **Pass 3** | **Execute** | Implement the solution with production-grade craft, zero placeholders, and strict typing. |
+| **Pass 4** | **Verify** | Run linters, unit tests, or compiler checks to validate structural correctness. |
+| **Pass 5** | **Attack** | Perform an adversarial review searching for edge-case failures, race conditions, and traps. |
+| **Pass 6** | **Improve** | Eliminate discovered friction, optimize performance, and harden error boundaries. |
+| **Pass 7** | **Quality Gate** | Enforce Verification-Before-Completion (VBC) with concrete terminal proof before finalizing. |
 
 ---
 
-## Mandatory Pre-Flight Context Inspection
+## 🛠️ Technical Architecture & Reference Recipes
 
-Before engineering component micro-interactions, you MUST inspect:
+Micro-interactions bridge intention and confirmation. When a button compresses beneath a pointer or a toggle thumb squashes as it slides across the track, digital interfaces cross the chasm from static abstractions to physical, responsive objects. Poor micro-interactions feel floaty, sluggish (>250ms), or introduce layout displacement. Master-grade micro-interactions operate under a strict sub-180ms execution budget, maintain volume mass conservation, anchor transform origins directly to interaction loci, and fire subtle tactile feedback.
 
-1. Duration Caps → Keep interactive component feedback (press/hover/toggle) under 180ms
-2. Popover Origin Rules (Section 60) → Set `transform-origin` dynamically to match trigger button position
-3. SVG Path Draw-on (Section 48) → Use `stroke-dashoffset` transitions for checkboxes and toggle icons
+---
 
-Craft responsive, physically grounded micro-interactions for everyday UI controls.
 
+---
 
-## Activation Boundaries
 
-- **Activate when:** Operating in tasks requiring Detailed UI motion guidance for hover and press feedback, toggles, checkboxes, toasts, drawers, modals, list transitions, and shared-element interactions..
-- **DO NOT activate when:** The task falls strictly outside micro-interaction domain or belongs to a different dedicated specialist.
+---
+
 
 ---
 
-## 4 Micro-Interaction Recipes
+## 🛠️ Technical Architecture & Reference Recipes
 
-### 1. Tactile Button Press
+### 1. The Micro-Interaction Timing & Easing Matrix
 
-```css
-.btn-tactile {
-  transition:
-    transform 120ms cubic-bezier(0.2, 0, 0, 1),
-    box-shadow 120ms ease;
-}
-.btn-tactile:hover {
-  transform: translateY(-1px);
-}
-.btn-tactile:active {
-  transform: translateY(1px) scale(0.97);
+| Component | Target Duration | Recommended Curve / Physics | Perceived Feel |
+|:---|:---|:---|:---|
+| **Button Press (`:active`)** | 80ms–120ms | `cubic-bezier(0.2, 0, 0, 1)` | Crisp, immediate tactile resistance |
+| **Toggle Switch** | 160ms–200ms | `spring(stiffness: 420, damping: 26)` | Snappy with slight organic overshoot |
+| **Checkbox Tick** | 140ms–180ms | `stroke-dashoffset` linear deceleration | Decisive, pencil-drawn precision |
+| **Toast Pop-In** | 180ms–240ms | `cubic-bezier(0.16, 1, 0.3, 1)` | Smooth magnetic arrival |
+| **Popover / Dropdown** | 140ms–180ms | `scale(0.96) -> 1` + origin anchoring | Anchored physical unfold |
+
+---
+
+### 2. Five Production-Grade Implementation Recipes
+
+#### Recipe 1: Tactile Elastic Button Press (React + Framer Motion)
+
+```tsx
+import React from 'react';
+import { motion } from 'framer-motion';
+
+export function TactileButton({
+  children,
+  onClick,
+  className = '',
+}: {
+  children: React.ReactNode;
+  onClick?: () => void;
+  className?: string;
+}) {
+  const handleClick = () => {
+    if (typeof window !== 'undefined' && 'vibrate' in navigator) {
+      navigator.vibrate(8); // Subtle 8ms tactile micro-pulse
+    }
+    onClick?.();
+  };
+
+  return (
+    <motion.button
+      type="button"
+      onClick={handleClick}
+      whileHover={{ scale: 1.02, y: -1 }}
+      whileTap={{ scale: 0.96, y: 1 }}
+      transition={{ type: 'spring', stiffness: 500, damping: 30 }}
+      className={`inline-flex items-center justify-center px-4 py-2 font-medium text-sm rounded-xl bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 shadow-sm hover:shadow active:shadow-inner touch-manipulation focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-500 ${className}`}
+    >
+      {children}
+    </motion.button>
+  );
 }
 ```
 
-### 2. Animated Toggle Switch
+---
+
+#### Recipe 2: Organic Squash-and-Stretch Toggle Switch
 
-```css
-.toggle-thumb {
-  transition: transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1); /* Subtle spring overshoot */
+```tsx
+import React from 'react';
+import { motion } from 'framer-motion';
+
+export function ElasticToggle({
+  checked,
+  onChange,
+  label,
+}: {
+  checked: boolean;
+  onChange: (checked: boolean) => void;
+  label: string;
+}) {
+  return (
+    <label className="inline-flex items-center gap-3 cursor-pointer select-none">
+      <span className="text-sm font-medium text-neutral-700 dark:text-neutral-300">{label}</span>
+      <button
+        type="button"
+        role="switch"
+        aria-checked={checked}
+        onClick={() => onChange(!checked)}
+        className={`relative w-12 h-7 rounded-full p-0.5 transition-colors duration-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-500 ${
+          checked ? 'bg-indigo-600' : 'bg-neutral-300 dark:bg-neutral-700'
+        }`}
+      >
+        <motion.div
+          animate={{
+            x: checked ? 20 : 0,
+            scaleX: [1, 1.25, 0.95, 1], // Squash as it pushes off, stretches in transit, snaps into place
+            scaleY: [1, 0.85, 1.05, 1],
+          }}
+          transition={{
+            x: { type: 'spring', stiffness: 480, damping: 28 },
+            scaleX: { duration: 0.22 },
+            scaleY: { duration: 0.22 },
+          }}
+          className="w-6 h-6 rounded-full bg-white shadow-md"
+        />
+      </button>
+    </label>
+  );
 }
-[data-state='checked'] .toggle-thumb {
-  transform: translateX(20px);
+```
+
+---
+
+#### Recipe 3: Animated SVG Draw-On Checkbox
+
+```tsx
+import React from 'react';
+import { motion } from 'framer-motion';
+
+export function DrawOnCheckbox({
+  checked,
+  onChange,
+  label,
+}: {
+  checked: boolean;
+  onChange: (c: boolean) => void;
+  label: string;
+}) {
+  return (
+    <label className="inline-flex items-center gap-3 cursor-pointer select-none">
+      <button
+        type="button"
+        role="checkbox"
+        aria-checked={checked}
+        onClick={() => onChange(!checked)}
+        className={`w-5 h-5 rounded-md border flex items-center justify-center transition-colors duration-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-500 ${
+          checked
+            ? 'bg-indigo-600 border-indigo-600 text-white'
+            : 'border-neutral-400 dark:border-neutral-600 bg-white dark:bg-neutral-900'
+        }`}
+      >
+        <svg viewBox="0 0 16 16" className="w-3.5 h-3.5 stroke-current fill-none stroke-[2.4] stroke-linecap-round stroke-linejoin-round">
+          <motion.path
+            d="M 3.5 8.5 L 6.5 11.5 L 12.5 4.5"
+            initial={false}
+            animate={{ pathLength: checked ? 1 : 0, opacity: checked ? 1 : 0 }}
+            transition={{ duration: 0.16, ease: [0.16, 1, 0.3, 1] }}
+          />
+        </svg>
+      </button>
+      <span className="text-sm text-neutral-800 dark:text-neutral-200">{label}</span>
+    </label>
+  );
 }
 ```
 
-### 3. Animated Checkbox Morph
+---
 
-Use an SVG path draw-on keyframe when checked:
+#### Recipe 4: Dynamic Directional Toast with Spring Layout
 
-```css
-.checkbox-svg-path {
-  stroke-dasharray: 24;
-  stroke-dashoffset: 24;
-  transition: stroke-dashoffset 180ms ease-out;
+```tsx
+import React from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+
+interface ToastProps {
+  id: string;
+  message: string;
+  onDismiss: (id: string) => void;
 }
-[data-state='checked'] .checkbox-svg-path {
-  stroke-dashoffset: 0;
+
+export function ToastContainer({ toasts, onDismiss }: { toasts: ToastProps[]; onDismiss: (id: string) => void }) {
+  return (
+    <div className="fixed bottom-6 right-6 z-50 flex flex-col gap-2 pointer-events-none">
+      <AnimatePresence mode="popLayout">
+        {toasts.map(toast => (
+          <motion.div
+            key={toast.id}
+            layout
+            initial={{ opacity: 0, y: 24, scale: 0.94 }}
+            animate={{ opacity: 1, y: 0, scale: 1 }}
+            exit={{ opacity: 0, scale: 0.92, transition: { duration: 0.14 } }}
+            transition={{ type: 'spring', stiffness: 420, damping: 28 }}
+            className="pointer-events-auto flex items-center justify-between min-w-[280px] p-4 rounded-xl bg-neutral-900 text-white shadow-xl border border-neutral-800"
+          >
+            <span className="text-sm font-medium">{toast.message}</span>
+            <button
+              type="button"
+              onClick={() => onDismiss(toast.id)}
+              className="ml-3 text-xs text-neutral-400 hover:text-white transition-colors"
+            >
+              Dismiss
+            </button>
+          </motion.div>
+        ))}
+      </AnimatePresence>
+    </div>
+  );
 }
 ```
 
-### 4. Origin-Aware Popover / Dropdown
+---
 
-Popovers scale out from their trigger source using CSS variables:
+#### Recipe 5: Context-Aware Popover with Dynamic `transform-origin`
 
 ```css
-.popover-content {
-  transform-origin: var(--radix-popover-content-transform-origin, center top);
-  animation: popover-enter 160ms cubic-bezier(0.16, 1, 0.3, 1);
+/* Popover Unfold from Anchor Coordinate */
+.popover-bubble {
+  transform-origin: var(--radix-popover-content-transform-origin, top center);
+  animation: popover-unfold 160ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
 }
 
-@keyframes popover-enter {
+@keyframes popover-unfold {
   from {
     opacity: 0;
-    transform: scale(0.95);
+    transform: scale(0.94) translateY(-4px);
   }
   to {
     opacity: 1;
-    transform: scale(1);
+    transform: scale(1) translateY(0);
   }
 }
 ```
 
 ---
 
+## 🚨 Edge-Case & Failure Mode Matrix
+
+| Scenario | Risk | Mitigation Strategy |
+|:---|:---|:---|
+| **Empty or Null Inputs** | Unhandled exception or unexpected rendering collapse | Enforce fallback guards, optional chaining, and explicit empty state handlers |
+| **Network Timeout / Latency** | Hanging operations or duplicate side-effects | Implement bounded abort controllers, exponential backoff, and idempotency keys |
+| **Concurrency / Race Conditions** | Stale state overwrite or inconsistent data mutations | Use atomic transactions, mutex locking, or cancel-on-resubmit controls |
+| **Invalid Schema / Malformed Payload** | Downstream runtime errors or security injection | Validate boundary payloads with Zod/Pydantic schemas prior to execution |
+| **Resource / Memory Saturation** | OOM errors, frame drops, or memory leaks | Clean up listeners, cancel active timers, and enforce pagination/virtualization |
+
+---
+
+## 🤖 LLM-Specific Traps Table
+
+| Anti-Pattern | What AI Commonly Does Wrong | What Is Actually Correct |
+|:---|:---|:---|
+| **The Instant Pop Trap** | Conditionally unmounting elements without animated interpolation | Use AnimatePresence or coordinate morphs with continuous geometry |
+| **Layout Thrashing** | Animating width, height, top, or left inside animation loops | Animate composite-only transform (translate3d, scale) and opacity |
+| **Sluggish Duration** | Setting micro-interaction transitions to 600ms+ causing interface lag | Cap interactive feedback at 160ms–240ms with snappy ease-out curves |
+
+---
+
 ## 🏛️ Tribunal Verification & Guardrails
 
-**Slash command: `/review` or `/tribunal-full`**
-**Active reviewers: `logic-reviewer` · `security-auditor`**
+**Active Reviewers:** `frontend-reviewer` · `motion-reviewer` · `ui-ux-auditor`
+**Slash Command:** `/review` or `/tribunal-full`
 
-### ❌ Forbidden AI Tropes
-1. **Blind Assumptions:** Never make an assumption without documenting it clearly with `// VERIFY: [reason]`.
-2. **Silent Degradation:** Catching and suppressing errors without logging or handling.
-3. **Context Amnesia:** Forgetting the user's constraints and offering generic advice instead of tailored solutions.
+### ✅ Pre-Flight Self-Audit Checklist
 
-### ✅ Pre-Flight Self-Audit
 ```
-✅ Did I rely ONLY on real, verified tools and methods?
-✅ Is this solution appropriately scoped to the user's constraints?
-✅ Did I handle potential failure modes and edge cases?
-✅ Have I avoided generic boilerplate that doesn't add value?
+✅ Does animation maintain 60fps/120fps using transform and opacity?
+✅ Is optical mass conserved across state interpolations without volume collapse?
+✅ Is duration capped within micro-interaction budgets (160ms–280ms)?
+✅ Is prefers-reduced-motion respected with graceful instant fallbacks?
+✅ Did I prevent layout thrashing and continuous geometry mutations?
 ```
 
 ### 🛑 Verification-Before-Completion (VBC) Protocol
+
 **CRITICAL:** You must follow a strict "evidence-based closeout" state machine.
 - ❌ **Forbidden:** Declaring a task complete because the output "looks correct."
-- ✅ **Required:** You are explicitly forbidden from finalizing any task without providing **concrete evidence** (terminal output, passing tests, compile success, or equivalent proof) that your output works as intended.
+- ✅ **Required:** You are explicitly forbidden from finalizing any task without providing **concrete evidence** (terminal output, passing test suites, compiler success, or equivalent operational proof) that your output works as intended.