tribunal-kit 5.8.2 → 5.8.4

package/.agent/skills/fixing-motion-performance/SKILL.md

@@ -0,0 +1,96 @@
+---
+name: fixing-motion-performance
+description: Audit and fix animation performance issues including layout thrashing, compositor properties, scroll-linked motion, and blur effects. Use when animations stutter, transitions jank, or reviewing CSS/JS animation performance.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: UI Motion & Performance
+  tier: pro
+  co-requires: [60fps-animation, gsap-performance]
+  trigger-signals:
+    strong: [fixing-motion-performance, layout thrashing, compositor properties, scroll jank, animation stutter, GPU acceleration, will-change]
+    weak: [jank, slow animation, stutter]
+---
+
+# Fixing Motion Performance — 60/120fps Jank-Free Animation
+
+Guidelines for auditing and resolving web animation jank, layout thrashing, and GPU rendering bottlenecks.
+
+---
+
+## 1. Browser Rendering Pipeline & Compositor Rules
+
+Animations trigger one of 3 rendering costs:
+1. **Layout (Expensive)**: Animating `width`, `height`, `margin`, `padding`, `top`, `left`, `flex`, `grid`. Forces full geometry recalculation across the page.
+2. **Paint (Moderate)**: Animating `color`, `background-color`, `border-color`, `box-shadow`, `filter`. Forces pixel repaint.
+3. **Composite (GPU Fast)**: Animating **`transform`** (`translate`, `scale`, `rotate`) and **`opacity`**. Offloaded entirely to GPU compositor thread!
+
+$$\text{Rule: } \text{Animate ONLY } \mathbf{transform} \text{ and } \mathbf{opacity}$$
+
+---
+
+## 2. Layout Thrashing (Read/Write Interleaving)
+
+NEVER interleave DOM layout measurements (`offsetHeight`, `getBoundingClientRect()`) with DOM mutations (`style.height = ...`) in the same event loop or frame loop!
+
+```javascript
+// ❌ WRONG — Triggers Layout Thrashing (Multiple Recalculations)
+elements.forEach(el => {
+  const h = el.offsetHeight; // READ (Forces Layout Calculation)
+  el.style.height = `${h + 10}px`; // WRITE (Invalidates Layout)
+});
+
+// ✅ CORRECT — Batch Reads First, Then Batch Writes
+const heights = elements.map(el => el.offsetHeight); // BATCH READS
+elements.forEach((el, i) => {
+  el.style.height = `${heights[i] + 10}px`; // BATCH WRITES
+});
+```
+
+---
+
+## 3. GPU Hinting (`will-change`)
+
+- Use `will-change: transform, opacity` ONLY on actively animated elements right before interaction begins.
+- Remove `will-change` when animation ends to free GPU memory. NEVER place `will-change: transform` globally on hundreds of DOM nodes.
+
+```css
+/* Apply hardware acceleration hint to GPU */
+.animated-card {
+  will-change: transform, opacity;
+}
+```
+
+---
+
+## Anti-Slop Table
+
+| Performance Issue | Motion Performance Fix | FPS Gain |
+| --- | --- | --- |
+| Animating `height: 0` to `auto` | FLIP technique or `scaleY` transform animation | 15fps → 60fps |
+| Scroll listener mutating inline CSS | `CSS scroll-timeline` or `IntersectionObserver` | Prevents main-thread scroll jank |
+| `transition: all 0.3s` | `transition: transform 200ms cubic-bezier(0.16,1,0.3,1), opacity 200ms ease` | Eliminates accidental layout/color recalculations |
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **`transition: all`**: Using `all` causes layout recalculation and repaint on every hover.
+2. **`requestAnimationFrame` Memory Leaks**: Launching continuous `rAF` loops without cancellation logic (`cancelAnimationFrame`).
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Are all continuous animations restricted strictly to transform and opacity?
+✅ Are DOM reads and writes batched to eliminate layout thrashing?
+✅ Is will-change used sparingly on active animated elements only?
+```
+
+### 🛑 Verification-Before-Completion (VBC) Protocol
+
+Inspect Chrome Performance tab rendering profile in live preview to verify 60/120fps motion without frame drops.

package/.agent/skills/gpt-taste/SKILL.md

@@ -0,0 +1,68 @@
+---
+name: gpt-taste
+description: High-agency UX/UI skill with strict layout variance, typography, and GSAP motion engineering constraints for superior visual judgment.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: High-Agency Aesthetic Judgment
+  tier: pro
+  co-requires: [taste-skill, better-ui, frontend-design]
+  trigger-signals:
+    strong: [gpt-taste, high agency UI, visual refinement, layout variance, superior aesthetic judgment]
+    weak: [aesthetic UI, refined visual]
+---
+
+# GPT Taste — High-Agency Visual Refinement & Layout Variance
+
+Inject high-agency visual judgment and layout variance into AI-generated interfaces.
+
+---
+
+## 4 High-Agency Visual Constraints
+
+### 1. Structural Layout Variance
+Never use standard symmetrical layouts by default. Vary structural axes across sections:
+- **Hero**: Asymmetric 60/40 split or left-aligned stacked text with offset app preview frame.
+- **Features**: Alternating 2-column image/text rhythm or horizontal scroll cards.
+- **CTA**: Single full-width card with progressive backdrop blur overlay.
+
+### 2. OKLCH Perceptual Palette Generation
+Always generate color schemes in OKLCH:
+- Background: `oklch(0.98 0.005 240)`
+- Foreground: `oklch(0.18 0.01 240)`
+- Accent: `oklch(0.62 0.22 250)`
+
+### 3. GSAP / Motion Engineering Integration
+When animation is requested, use explicit GSAP timelines with custom easing curves (`power3.out`, `expo.out`), avoiding default linear transitions.
+
+### 4. Zero Output Truncation
+Never output placeholder `// TODO: add remaining items` comments in UI code. Generate full, production-ready JSX/CSS markup.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Truncated Code Outputs**: Outputting incomplete code snippets or placeholder comments.
+2. **Symmetrical Grid Boredom**: Using 3 identical square cards side-by-side without visual hierarchy differentiation.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `frontend-reviewer` · `ui-ux-auditor`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Are code outputs 100% complete without placeholder TODOs?
+✅ Is structural layout varied across different page sections?
+✅ Are colors declared via OKLCH variables?
+```
+
+### 🛑 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.

package/.agent/skills/harden/SKILL.md

@@ -0,0 +1,74 @@
+---
+name: harden
+description: Make interfaces production-resilient with robust empty states, error boundaries, loading skeletons, offline indicators, and internationalization (i18n) layout support.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: UI Resilience & Production Safety
+  tier: pro
+  co-requires: [error-resilience, polish, web-accessibility-auditor]
+  trigger-signals:
+    strong: [harden, ui resilience, error states, empty states, loading skeletons, offline support, i18n layout]
+    weak: [error handling ui, loading state]
+---
+
+# Harden — Production UI Resilience & Edge Case Protection
+
+Ensure UI components gracefully handle network failures, missing data, slow connections, extreme text lengths, and internationalization.
+
+---
+
+## 5 Resilience Domains
+
+### 1. Zero-Data Empty States
+- Never render empty blank slates or blank boxes.
+- Always render a dedicated empty state component featuring:
+  - Contextual icon or subtle illustration
+  - Clear heading explaining the zero state (*"No active projects found"*)
+  - Secondary helper copy (*"Get started by creating your first project."*)
+  - Prominent primary action CTA button (*"Create Project"*)
+
+### 2. Error Boundary UI & Retry Hooks
+- Wrap high-risk component trees in React/framework Error Boundaries.
+- Display localized inline error callouts with explicit "Retry" action buttons rather than crashing the full page view.
+
+### 3. Cumulative Layout Shift (CLS) Loading Skeletons
+- Match skeleton placeholder dimensions EXACTLY to incoming data elements.
+- Use animated pulse keyframes (`@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }`).
+
+### 4. Extreme String Expansion (i18n)
+- German, French, and Spanish strings are 30% - 50% longer than English.
+- Avoid fixed button or container widths (`width: 120px`). Use `min-width` with flexible auto sizing and `flex-wrap: wrap` or text truncation.
+
+### 5. Offline & Network Disconnection Handling
+- Detect `navigator.onLine` state and display subtle offline status banners.
+- Disable mutation buttons during offline mode with explicit tooltip explanation.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Swallowing Errors**: Catching API errors and displaying a blank container without informing the user.
+2. **Fixed Container Widths**: Using hardcoded `width: 200px` on containers with international text.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `resilience-reviewer` · `frontend-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Does every async data container have explicit loading, error, and empty states?
+✅ Are all containers built flexibly to accommodate 50% text expansion (i18n)?
+✅ Do error fallbacks include actionable retry buttons?
+```
+
+### 🛑 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.

package/.agent/skills/impeccable/SKILL.md

@@ -0,0 +1,72 @@
+---
+name: impeccable
+description: Flagship design engineering skill for creating production-grade, anti-generic frontend interfaces with supreme craftsmanship, visual hierarchy, typography, spatial systems, and micro-interactions.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: Premium Frontend Craft
+  tier: flagship
+  co-requires: [frontend-design, better-ui, emil-design-eng]
+  trigger-signals:
+    strong: [impeccable, supreme craft, world-class ui, anti-generic design, production-grade interface]
+    weak: [beautiful ui, premium frontend]
+---
+
+# Impeccable — Production-Grade Frontend Craft
+
+The gold standard framework for crafting bespoke, world-class web applications that feel custom-built by elite design engineers.
+
+---
+
+## Core Pillars of Impeccable UI
+
+### 1. Typography & Typographic Rhythm
+- **Optical Sizing & Tracking**: Large display headings (32px+) require tight letter-spacing (`letter-spacing: -0.03em`). Small caption text (12px) requires positive tracking (`letter-spacing: +0.01em`).
+- **Tabular Numbers**: Any numeric data that updates, increments, or displays in columns MUST use `font-variant-numeric: tabular-nums` or `font-feature-settings: "tnum"` to prevent visual jitter.
+- **Text Wrapping & Balance**: Headings MUST use `text-wrap: balance` to prevent typographic orphans. Body paragraphs MUST use `text-wrap: pretty` (where supported) or max `65ch` width.
+
+### 2. Color Systems & Gamut Precision
+- **OKLCH Color Space**: Prefer `oklch()` over `hsl()` or `hex` for smooth perceptual uniformity across hue and lightness shifts.
+- **Subtle Surface Steps**: Define surface colors with small perceptual lightness steps ($L \pm 2\%$) to create hierarchy without harsh dividers.
+- **Adaptive Contrast**: Text contrast MUST adapt automatically across light/dark themes with high legibility ratios ($\ge 7:1$ for primary, $\ge 4.5:1$ for secondary).
+
+### 3. Motion & Micro-Interactions
+- **Intentional Motion**: Animations exist ONLY to convey spatial continuity, provide press feedback, or indicate state changes.
+- **Duration Constraints**: Micro-interactions $\le 160\text{ms}$; dropdowns/popovers $\le 220\text{ms}$; page transitions $\le 300\text{ms}$.
+- **Physically Grounded Entrances**: Elements scale in from `scale(0.96)` and opacity `0`, anchored to their trigger origin.
+
+### 4. Layout Mechanics & Spatial Math
+- **8px Grid System**: Every margin, padding, gap, and height MUST derive from an 8px grid (or 4px micro-grid).
+- **Asymmetrical Balance**: Avoid cookie-cutter centered layouts for SaaS apps. Use strong left-aligned structural axes with generous negative space.
+- **Container Queries**: Components adjust layout based on container size (`@container`), not viewport size (`@media`), making them context-agnostic.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Generic AI Aesthetics**: Using purple-to-blue gradients, glow effects on every button, or heavy glassmorphism on white text.
+2. **Hardcoded Pixel Values**: Writing hardcoded `px` font sizes and dimensions instead of `rem` and fluid `clamp()` utilities.
+3. **Orphaned Text**: Failing to apply `text-wrap: balance` to multi-line headings.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `frontend-reviewer` · `ui-ux-auditor` · `motion-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Are tabular numbers enabled on all changing numeric values?
+✅ Is heading text wrapped using `text-wrap: balance`?
+✅ Is container query responsiveness utilized where components are reused?
+✅ Are transitions tuned with custom cubic-bezier curves under 300ms?
+```
+
+### 🛑 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.

package/.agent/skills/improve-codebase-architecture/SKILL.md

@@ -0,0 +1,67 @@
+---
+name: improve-codebase-architecture
+description: Scans a codebase for deepening opportunities, architectural bottlenecks, tight coupling, and produces a prioritized visual improvement roadmap.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: Codebase Architectural Audit
+  tier: pro
+  co-requires: [codebase-design, clean-code, architecture]
+  trigger-signals:
+    strong: [improve-codebase-architecture, architectural audit, refactor architecture, decouple modules, codebase refactor plan]
+    weak: [architecture check, fix architecture]
+---
+
+# Improve Codebase Architecture — Architectural Audit & Refactoring
+
+Audit an existing codebase for structural rot, circular dependencies, monolithic controllers, and produce a prioritized refactoring roadmap.
+
+---
+
+## 4 Audit Steps
+
+### 1. Dependency Graph Inspection
+- Map import relationships across modules. Identify circular dependencies (`A -> B -> C -> A`) and break them by introducing event buses or interface abstractions.
+
+### 2. Monolithic Controller Detection
+- Flag files exceeding 500 lines of code containing mixed concerns (database queries, HTTP response handling, email sending, data validation).
+
+### 3. Interface Shrinking (Deepening Modules)
+- Audit public exports. Convert large multi-parameter interfaces into thin, single-responsibility contracts.
+
+### 4. Prioritized Architectural Roadmap Output
+Output audit findings in a clear prioritized Markdown table:
+
+| Impact Level | Architectural Issue | Proposed Seam / Refactor |
+| --- | --- | --- |
+| 🔴 **High Impact** | Direct DB queries inside React Server Components | Extract Repository layer pattern |
+| 🟠 **Medium Impact** | Circular import between Auth and User modules | Introduce `EventBus` for user registration events |
+| 🟡 **Low Impact** | Hardcoded API base URLs across 12 files | Centralize in typed `ConfigService` |
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Shotgun Surgery**: Refactoring 20 files at once without establishing tests or clean interfaces first.
+2. **Ignoring Existing Conventions**: Forgetting existing project patterns and forcing an incompatible framework structure.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `logic-reviewer` · `complexity-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Are circular dependencies identified and resolved via clean seams?
+✅ Is the refactoring plan broken down into safe, testable phases?
+```
+
+### 🛑 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.

package/.agent/skills/improve-ui/SKILL.md

@@ -0,0 +1,83 @@
+---
+name: improve-ui
+description: Audit an existing product surface against its own design evidence, identify verified UI problems, and write self-contained implementation plans for another agent. Strictly read-only on product source. Use when asked to review, refine, improve, or clean up an interface without replacing its identity.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: UI Craft & Design Audit
+  tier: master
+  co-requires: [better-ui, baseline-ui]
+  trigger-signals:
+    strong: [improve-ui, audit interface, refine UI, UI review, design-system drift, UI cleanup plan]
+    weak: [review layout, UI feedback]
+---
+
+# Improve UI — Evidence-Based UI Audit & Implementation Planning
+
+Audit a specific product surface against its governing design tokens and guidelines, identify verified UI defects, and generate self-contained implementation plans for remediation.
+
+---
+
+## 1. Operating Rules & Boundaries
+
+- **Strictly Read-Only on Product Source**: Never modify product source files (`src/`, `components/`, `app/`) during an `improve-ui` audit session.
+- **Output Artifacts Only**: Create plans under `design-plans/` or return an actionable implementation plan to the user.
+- **Respect Product Identity**: Preserve existing component architecture, routing, and product identity.
+
+---
+
+## 2. The 4-Phase Audit Protocol
+
+### Phase 1: Surface Selection & Path Tracing
+1. Focus on one deployable application and one coherent surface family (e.g. `Dashboard / Overview`).
+2. Trace the path from route layout $\rightarrow$ page composition $\rightarrow$ shared UI primitives $\rightarrow$ tokens/CSS variables.
+
+### Phase 2: Design Language Reconstruction
+1. Inspect `DESIGN.md`, `index.css`, Tailwind tokens, or custom properties.
+2. Record active background tokens, typography roles, spatial rules, and border/shadow contracts.
+
+### Phase 3: Proof-Gated Defect Verification
+Before reporting a finding, require 3 explicit proofs:
+- **Observation**: Exact code line or rendered element showing the discrepancy.
+- **Basis**: Violation of documented design token or 8px grid baseline.
+- **Consequence**: Measurable degradation of visual hierarchy, readability, or interaction response.
+
+### Phase 4: Implementation Plan Generation
+Write a self-contained plan specifying:
+- Files to modify
+- Exact CSS/JSX diffs
+- Verification steps (browser preview, contrast check, visual alignment)
+
+---
+
+## Anti-Slop Table
+
+| Audit Pattern | Evidence-Based Rule | Rationale |
+| --- | --- | --- |
+| Rewriting entire components | Targeted visual diff plan | Preserves business logic & state |
+| Guessing design tokens | Citing verified `var(--...)` declarations | Ensures token adherence |
+| Speculative visual preferences | Reporting only verified WCAG/token violations | Prevents arbitrary churn |
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Mutating Code During Audit**: Applying code changes immediately instead of generating a clean implementation plan.
+2. **Re-architecting Scope**: Re-writing component state hooks when only CSS spacing and contrast fixes were requested.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Is the audit strictly read-only on product source code?
+✅ Are all reported findings supported by concrete token or layout evidence?
+✅ Is the generated implementation plan self-contained and ready for execution?
+```
+
+### 🛑 Verification-Before-Completion (VBC) Protocol
+
+Confirm all plan recommendations match project CSS custom properties before delivery.

package/.agent/skills/landing-page/SKILL.md

@@ -0,0 +1,88 @@
+---
+name: landing-page
+description: High-converting landing page structure, hero section layout variance, CTA hierarchy, visual pacing, feature grid storytelling, and social proof placement.
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: Landing Page Architecture & Conversion
+  tier: pro
+  co-requires: [compact-landing, company-logos, pricing-page, frontend-design]
+  trigger-signals:
+    strong: [landing-page, hero section, CTA hierarchy, conversion landing page, SaaS landing page, feature grid storytelling]
+    weak: [homepage design, marketing page]
+---
+
+# Landing Page — Conversion Architecture & Visual Pacing
+
+Build high-converting, visually stunning landing pages that guide visitors from curiosity to conversion.
+
+---
+
+## The 6-Section Landing Page Blueprint
+
+```
+1. Navigation Header
+   - Sticky blur backdrop, clear logo, 3-4 nav links, primary CTA button on top-right.
+
+2. Hero Section (Above the Fold)
+   - Category Pill / Announcement Badge (top)
+   - High-Impact H1 Headline (max 8 words, text-wrap: balance)
+   - Subtitle (max 2 lines, high legibility)
+   - Dual CTA Buttons: Primary (solid accent) + Secondary (ghost / watch demo)
+   - Interactive Product Preview / App Frame (centered below CTAs)
+
+3. Social Proof Row
+   - Monochromatic company logo bar or customer rating badge immediately below hero.
+
+4. Feature Value Sections (Alternating Rhythm)
+   - 3-column feature grid OR alternating left-text / right-visual sections.
+   - Interactive micro-demos or high-resolution app screenshots over static icons.
+
+5. Testimonials & Case Studies
+   - Real customer quote cards with avatar, name, title, and verified metric ("Boosted retention by 42%").
+
+6. Final Call to Action & Footer
+   - Prominent conversion card banner + comprehensive 4-column footer link map.
+```
+
+---
+
+## Hero Layout Variance Models
+
+Avoid standard left-text / right-image templates on every project. Choose based on product type:
+
+- **Model A: Centered Stacked (Best for Developer Tools & SaaS)**
+  - Centered Pill -> Centered H1 -> Centered Subtitle -> Centered Dual CTA -> Full-width app preview mockup below.
+- **Model B: Asymmetric Split (Best for Complex B2B & Mobile Apps)**
+  - 60% Left column (Heading, bullets, CTA) + 40% Right column (Interactive phone frame or live code preview).
+- **Model C: Full-Bleed Canvas (Best for Creative & AI Tools)**
+  - Full-screen canvas visual background with floating frosted-glass prompt bar and primary CTA.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Standard Generic Left-Text / Right-Image Every Time**: Re-using the exact same layout template for every marketing page request.
+2. **Multiple Equal Primary Buttons**: Displaying 3 solid colored buttons together, creating CTA confusion.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `frontend-reviewer` · `ui-ux-auditor`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Is there a single, unambiguous primary CTA button above the fold?
+✅ Is heading text balanced with `text-wrap: balance`?
+✅ Is social proof placed immediately following the hero section?
+```
+
+### 🛑 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.

package/.agent/skills/lint-and-validate/SKILL.md

@@ -185,8 +185,7 @@ repos:
 
 | Script                     | Purpose                                   | Run With                                         |
 | -------------------------- | ----------------------------------------- | ------------------------------------------------ |
-| `scripts/lint_runner.py`   | Runs project linting and reports findings | `python scripts/lint_runner.py <project_path>`   |
-| `scripts/type_coverage.py` | Measures TypeScript type coverage         | `python scripts/type_coverage.py <project_path>` |
+| `.agent/scripts/lint_runner.js`   | Runs project linting and reports findings | `node .agent/scripts/lint_runner.js <project_path>`   |
 
 ---
 

package/.agent/skills/local-first-architecture/SKILL.md

@@ -0,0 +1,66 @@
+---
+name: local-first-architecture
+description: Local-first architecture guidance for instant-feeling web & desktop apps, optimistic updates, IndexedDB sync engines, offline operation, and Conflict-free Replicated Data Types (CRDTs).
+version: 1.0.0
+last-updated: 2026-07-22
+applies-to-model: gemini-3-6-flash, claude-3-7-sonnet
+routing:
+  domain: Local-First Architecture & Sync Engines
+  tier: pro
+  co-requires: [local-first, realtime-patterns, architecture]
+  trigger-signals:
+    strong: [local-first-architecture, Linear architecture, optimistic updates, IndexedDB sync, CRDT, offline-first app, zero-latency UI]
+    weak: [offline sync, optimistic state]
+---
+
+# Local-First Architecture — Instant UI & Sync Engines
+
+Architect software that reads and writes to local storage (SQLite/IndexedDB) first, ensuring instant zero-latency UI mutations with background server synchronization.
+
+---
+
+## 4 Pillars of Local-First Architecture
+
+### 1. Read & Write Local First
+- **Zero Network Latency**: UI queries (`select * from tasks`) run synchronously or near-instantaneously against in-memory or IndexedDB caches.
+- Mutations update the local cache immediately (*optimistic write*), appending a mutation log item to an outbound sync queue.
+
+### 2. Outbound Mutation Queue & Idempotency
+- Store mutation logs in a persistent local queue (`IndexedDB` / `SQLite`).
+- Assign every client mutation a unique UUID (`idempotencyKey`).
+- When network connection is restored, flush queue items sequentially with automatic retry on 5xx failures.
+
+### 3. Conflict Resolution (CRDTs & LWW)
+- **Last-Write-Wins (LWW)**: Timestamp + Client ID ordering for simple fields.
+- **CRDTs (Yjs / Automerge)**: Conflict-free Replicated Data Types for collaborative text editing and array state.
+
+### 4. Background Delta Streaming
+- Receive database updates via WebSockets or Server-Sent Events (SSE) as thin binary deltas (`sync_version > client_version`), applying changes to local storage without re-fetching full datasets.
+
+---
+
+## 🤖 LLM-Specific Traps
+
+1. **Waiting for Server API Response Before UI Render**: Blocking the user interface with a spinner while waiting for a POST request response.
+2. **Volatile Local State**: Keeping mutation queues in non-persistent JS memory, losing unsaved user edits on page refresh.
+
+---
+
+## 🏛️ Tribunal Integration (Anti-Hallucination)
+
+**Active reviewers: `logic-reviewer` · `resilience-reviewer` · `architecture-reviewer`**
+
+### ✅ Pre-Flight Self-Audit
+
+```
+✅ Are user actions reflected instantly in local UI state?
+✅ Is the mutation queue persisted in IndexedDB/SQLite for offline durability?
+✅ Are all server API mutations idempotent with client-generated UUID keys?
+```
+
+### 🛑 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.