tribunal-kit 6.0.1 → 7.0.0

package/.agent/skills/observability/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before instrumenting applications for observability, you MUST inspect:
+
 1. Structured JSON Logging Rule (Section 34) → Use Pino/structlog for structured JSON logging with ISO timestamps; ban plain `console.log` in production
 2. Separation of Liveness & Readiness Checks (Section 253) → Isolate `/health/live` (process active) from `/health/ready` (DB connected); ban DB calls in liveness checks to prevent restart loops
 3. Correlation Tracking Context (Section 80) → Inject `x-request-id` via AsyncLocalStorage or middleware so every log line is correlated to a specific request
@@ -43,25 +44,25 @@ All three are needed. Logs alone are not observability.
 ## Structured Logging
 
 ```typescript
-import pino from "pino";
+import pino from 'pino';
 
 // ✅ Structured JSON logging
 const logger = pino({
-  level: process.env.LOG_LEVEL ?? "info",
+  level: process.env.LOG_LEVEL ?? 'info',
   timestamp: pino.stdTimeFunctions.isoTime,
-  ...(process.env.NODE_ENV === "development" && {
-    transport: { target: "pino-pretty" },
+  ...(process.env.NODE_ENV === 'development' && {
+    transport: { target: 'pino-pretty' },
   }),
 });
 
 // ✅ GOOD: Structured with context
-logger.info({ userId: user.id, action: "login", ip: req.ip }, "User logged in");
-logger.error({ err, orderId: order.id, paymentGateway: "stripe" }, "Payment failed");
-logger.warn({ queueDepth: 1500, threshold: 1000 }, "Queue depth exceeding threshold");
+logger.info({ userId: user.id, action: 'login', ip: req.ip }, 'User logged in');
+logger.error({ err, orderId: order.id, paymentGateway: 'stripe' }, 'Payment failed');
+logger.warn({ queueDepth: 1500, threshold: 1000 }, 'Queue depth exceeding threshold');
 
 // ❌ BAD: Unstructured string logging
-console.log("User " + user.id + " logged in from " + req.ip);
-console.log("Error: " + error.message);
+console.log('User ' + user.id + ' logged in from ' + req.ip);
+console.log('Error: ' + error.message);
 
 // ❌ HALLUCINATION TRAP: console.log is NOT production logging
 // - No severity levels (info/warn/error)
@@ -92,14 +93,14 @@ Rules:
 ### Request Context / Correlation
 
 ```typescript
-import { AsyncLocalStorage } from "node:async_hooks";
+import { AsyncLocalStorage } from 'node:async_hooks';
 
 const requestContext = new AsyncLocalStorage<{ requestId: string; userId?: string }>();
 
 // Middleware: set context per request
 app.use((req, res, next) => {
-  const requestId = req.headers["x-request-id"]?.toString() ?? crypto.randomUUID();
-  res.setHeader("x-request-id", requestId);
+  const requestId = req.headers['x-request-id']?.toString() ?? crypto.randomUUID();
+  res.setHeader('x-request-id', requestId);
   requestContext.run({ requestId, userId: req.user?.id }, next);
 });
 
@@ -114,7 +115,7 @@ function getLogger() {
 
 // Every log from this request includes requestId and userId
 const log = getLogger();
-log.info("Processing order"); // { requestId: "abc-123", userId: "42", msg: "Processing order" }
+log.info('Processing order'); // { requestId: "abc-123", userId: "42", msg: "Processing order" }
 ```
 
 ---
@@ -122,21 +123,21 @@ log.info("Processing order"); // { requestId: "abc-123", userId: "42", msg: "Pro
 ## Distributed Tracing (OpenTelemetry)
 
 ```typescript
-import { NodeSDK } from "@opentelemetry/sdk-node";
-import { getNodeAutoInstrumentations } from "@opentelemetry/auto-instrumentations-node";
-import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-http";
+import { NodeSDK } from '@opentelemetry/sdk-node';
+import { getNodeAutoInstrumentations } from '@opentelemetry/auto-instrumentations-node';
+import { OTLPTraceExporter } from '@opentelemetry/exporter-trace-otlp-http';
 
 // Initialize OpenTelemetry
 const sdk = new NodeSDK({
   traceExporter: new OTLPTraceExporter({
-    url: process.env.OTEL_EXPORTER_OTLP_ENDPOINT ?? "http://localhost:4318/v1/traces",
+    url: process.env.OTEL_EXPORTER_OTLP_ENDPOINT ?? 'http://localhost:4318/v1/traces',
   }),
   instrumentations: [
     getNodeAutoInstrumentations({
-      "@opentelemetry/instrumentation-http": { enabled: true },
-      "@opentelemetry/instrumentation-express": { enabled: true },
-      "@opentelemetry/instrumentation-pg": { enabled: true },
-      "@opentelemetry/instrumentation-redis": { enabled: true },
+      '@opentelemetry/instrumentation-http': { enabled: true },
+      '@opentelemetry/instrumentation-express': { enabled: true },
+      '@opentelemetry/instrumentation-pg': { enabled: true },
+      '@opentelemetry/instrumentation-redis': { enabled: true },
     }),
   ],
 });
@@ -144,16 +145,16 @@ const sdk = new NodeSDK({
 sdk.start();
 
 // Manual span for custom business logic
-import { trace } from "@opentelemetry/api";
+import { trace } from '@opentelemetry/api';
 
-const tracer = trace.getTracer("order-service");
+const tracer = trace.getTracer('order-service');
 
 async function processOrder(order: Order) {
-  return tracer.startActiveSpan("processOrder", async (span) => {
+  return tracer.startActiveSpan('processOrder', async span => {
     try {
-      span.setAttribute("order.id", order.id);
-      span.setAttribute("order.total", order.total);
-      span.setAttribute("order.items.count", order.items.length);
+      span.setAttribute('order.id', order.id);
+      span.setAttribute('order.total', order.total);
+      span.setAttribute('order.items.count', order.items.length);
 
       const result = await executeOrder(order);
       span.setStatus({ code: SpanStatusCode.OK });
@@ -174,30 +175,30 @@ async function processOrder(order: Order) {
 ## Metrics
 
 ```typescript
-import { metrics } from "@opentelemetry/api";
+import { metrics } from '@opentelemetry/api';
 
-const meter = metrics.getMeter("api-server");
+const meter = metrics.getMeter('api-server');
 
 // Counter — things that only go up
-const requestCounter = meter.createCounter("http.requests.total", {
-  description: "Total HTTP requests",
+const requestCounter = meter.createCounter('http.requests.total', {
+  description: 'Total HTTP requests',
 });
 
 // Histogram — request durations
-const requestDuration = meter.createHistogram("http.request.duration_ms", {
-  description: "HTTP request duration in milliseconds",
-  unit: "ms",
+const requestDuration = meter.createHistogram('http.request.duration_ms', {
+  description: 'HTTP request duration in milliseconds',
+  unit: 'ms',
 });
 
 // Gauge — current values
-const activeConnections = meter.createUpDownCounter("db.connections.active", {
-  description: "Active database connections",
+const activeConnections = meter.createUpDownCounter('db.connections.active', {
+  description: 'Active database connections',
 });
 
 // Middleware to record metrics
 app.use((req, res, next) => {
   const start = performance.now();
-  res.on("finish", () => {
+  res.on('finish', () => {
     const duration = performance.now() - start;
     requestCounter.add(1, {
       method: req.method,
@@ -264,22 +265,22 @@ Rules:
 
 ```typescript
 // Liveness: Is the process running?
-app.get("/health/live", (req, res) => {
-  res.status(200).json({ status: "ok" });
+app.get('/health/live', (req, res) => {
+  res.status(200).json({ status: 'ok' });
 });
 
 // Readiness: Can it accept traffic?
-app.get("/health/ready", async (req, res) => {
+app.get('/health/ready', async (req, res) => {
   try {
-    await db.raw("SELECT 1"); // database check
+    await db.raw('SELECT 1'); // database check
     await redis.ping(); // cache check
     res.status(200).json({
-      status: "ready",
-      checks: { database: "ok", cache: "ok" },
+      status: 'ready',
+      checks: { database: 'ok', cache: 'ok' },
     });
   } catch (error) {
     res.status(503).json({
-      status: "not ready",
+      status: 'not ready',
       checks: { database: error.message },
     });
   }

package/.agent/skills/opentelemetry-observability/SKILL.md

@@ -18,6 +18,7 @@ skills:
 ## Mandatory Pre-Flight Context Inspection
 
 Before instrumenting applications:
+
 1. Vendor-Neutral Telemetry → Use standard OpenTelemetry SDKs (OTLP over gRPC/HTTP)
 2. Trace Propagation → Propagate `traceparent` W3C headers across HTTP and message queues
 3. Sampling Policy → Implement head/tail sampling to reduce telemetry storage costs by 80%
@@ -35,7 +36,7 @@ const loginCounter = meter.createCounter('user_logins_total', {
 });
 
 export async function handleLogin(userId: string) {
-  return tracer.startActiveSpan('handleLogin', async (span) => {
+  return tracer.startActiveSpan('handleLogin', async span => {
     try {
       span.setAttribute('user.id', userId);
       loginCounter.add(1, { status: 'success' });

package/.agent/skills/page-transition-animation/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before engineering route or page transitions, you MUST inspect:
+
 1. Target Framework & API (View Transitions API vs Framer Motion `AnimatePresence`)
 2. `AnimatePresence` Keying (Section 69) → Enforce `key={pathname}` and `mode="wait"` to prevent double-page DOM stacking
 3. Vertical Displacement Cap → Keep route movement under $12\text{px}$ to prevent visual scroll shifts
@@ -31,6 +32,7 @@ Architect smooth, seamless page and route transitions without layout jumps or fr
 ## 3 Page Transition Architectures
 
 ### 1. Native Web View Transitions API
+
 The modern web standard for seamless page transitions (works across MPAs and SPAs):
 
 ```javascript
@@ -63,11 +65,12 @@ function navigateToPage(url) {
 ```
 
 ### 2. Next.js App Router + Framer Motion (`AnimatePresence`)
+
 ```tsx
-"use client";
+'use client';
 
-import { usePathname } from "next/navigation";
-import { AnimatePresence, motion } from "framer-motion";
+import { usePathname } from 'next/navigation';
+import { AnimatePresence, motion } from 'framer-motion';
 
 export function RouteLayoutWrapper({ children }: { children: React.ReactNode }) {
   const pathname = usePathname();

package/.agent/skills/parallel-agents/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before executing parallel agent dispatches, you MUST inspect:
+
 1. Target file paths for concurrent workers → Enforce directory isolation; never allow two parallel workers to edit the same file
 2. `Promise.allSettled()` error handling (Section 77) → Handle partial worker failures gracefully without crashing the pipeline
 3. Context Window Budget → Keep total context across all parallel workers under 80,000 tokens
@@ -50,7 +51,11 @@ The foundation of parallel multi-agent architecture.
 // Architectural representation (Fan-out/Fan-in)
 async function executeParallelAudit(sourceCode: string) {
   // Fan-Out
-  const promises = [agentDispatch({ role: "security-auditor", task: sourceCode }), agentDispatch({ role: "performance-profiling", task: sourceCode }), agentDispatch({ role: "web-accessibility-auditor", task: sourceCode })];
+  const promises = [
+    agentDispatch({ role: 'security-auditor', task: sourceCode }),
+    agentDispatch({ role: 'performance-profiling', task: sourceCode }),
+    agentDispatch({ role: 'web-accessibility-auditor', task: sourceCode }),
+  ];
 
   // Await concurrent resolution
   // If one takes 10s and another takes 2s, the total wait is max(10s)
@@ -98,7 +103,7 @@ const results = await Promise.all(agentJobs);
 const results = await Promise.allSettled(agentJobs);
 
 for (const result of results) {
-  if (result.status === "fulfilled") {
+  if (result.status === 'fulfilled') {
     aggregatedOutput.push(result.value);
   } else {
     // 1 agent failed (e.g. rate limit, or runtime crash)

package/.agent/skills/performance-profiling/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before optimizing performance or auditing benchmarks, you MUST inspect:
+
 1. Core Web Vitals Targets (INP replacing FID) (Section 26) → Target INP $\le 200\text{ms}$, LCP $\le 2.5\text{s}$, CLS $\le 0.1$; ban FID (deprecated)
 2. Bundle Size Limits & Import Tree-Shaking (Section 55) → Enforce total gzipped JS $<200\text{KB}$; use deep imports (`lodash/debounce`) instead of full barrel imports
 3. SQL EXPLAIN ANALYZE Requirement (Section 156) → Profile database queries with `EXPLAIN ANALYZE` before making index or query optimization changes
@@ -117,9 +118,9 @@ const sortedItems = useMemo(
 // Common memory leaks in JavaScript:
 // 1. Event listeners not cleaned up
 useEffect(() => {
-  const handler = () => console.log("resize");
-  window.addEventListener("resize", handler);
-  return () => window.removeEventListener("resize", handler); // ✅ cleanup
+  const handler = () => console.log('resize');
+  window.addEventListener('resize', handler);
+  return () => window.removeEventListener('resize', handler); // ✅ cleanup
 }, []);
 
 // 2. Timers not cleared
@@ -131,11 +132,11 @@ useEffect(() => {
 // 3. AbortController not used for fetch
 useEffect(() => {
   const controller = new AbortController();
-  fetch("/api/data", { signal: controller.signal })
-    .then((res) => res.json())
+  fetch('/api/data', { signal: controller.signal })
+    .then(res => res.json())
     .then(setData)
-    .catch((e) => {
-      if (e.name !== "AbortError") throw e;
+    .catch(e => {
+      if (e.name !== 'AbortError') throw e;
     });
   return () => controller.abort(); // ✅ cancel on unmount
 }, []);
@@ -150,7 +151,17 @@ useEffect(() => {
 
 ```html
 <!-- Modern image loading -->
-<img src="hero.webp" srcset="hero-480.webp 480w, hero-768.webp 768w, hero-1200.webp 1200w" sizes="(max-width: 768px) 100vw, 50vw" width="1200" height="800" loading="lazy" decoding="async" alt="Product hero" fetchpriority="high" />
+<img
+  src="hero.webp"
+  srcset="hero-480.webp 480w, hero-768.webp 768w, hero-1200.webp 1200w"
+  sizes="(max-width: 768px) 100vw, 50vw"
+  width="1200"
+  height="800"
+  loading="lazy"
+  decoding="async"
+  alt="Product hero"
+  fetchpriority="high"
+/>
 
 <!-- Rules:
   - ALWAYS set width and height (prevents CLS)
@@ -200,11 +211,11 @@ module.exports = {
   ci: {
     assert: {
       assertions: {
-        "categories:performance": ["error", { minScore: 0.9 }],
-        "first-contentful-paint": ["error", { maxNumericValue: 1500 }],
-        "largest-contentful-paint": ["error", { maxNumericValue: 2500 }],
-        "cumulative-layout-shift": ["error", { maxNumericValue: 0.1 }],
-        "total-byte-weight": ["error", { maxNumericValue: 500000 }],
+        'categories:performance': ['error', { minScore: 0.9 }],
+        'first-contentful-paint': ['error', { maxNumericValue: 1500 }],
+        'largest-contentful-paint': ['error', { maxNumericValue: 2500 }],
+        'cumulative-layout-shift': ['error', { maxNumericValue: 0.1 }],
+        'total-byte-weight': ['error', { maxNumericValue: 500000 }],
       },
     },
   },

package/.agent/skills/plan-writing/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before writing implementation plans or execution blueprints, you MUST inspect:
+
 1. Verification Criteria Requirement (Section 15) → Include explicit "How to verify" criteria for every wave; ban plan steps without verification
 2. Phased Wave Segmentation (Section 41) → Segment multi-file tasks into testable, independent waves (Wave 1: Data, Wave 2: API, Wave 3: UI)
 3. Non-Destructive Defaults & Rollback Rules (Section 66) → Define fallback feature toggles and database rollback procedures prior to execution

package/.agent/skills/platform-engineer/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before designing developer platforms or GitOps manifests, you MUST inspect:
+
 1. Golden Path Self-Service Rule (Section 29) → Build pre-approved automated templates for bootstrapping services (CI, metrics, DB Terraform out-of-the-box)
 2. GitOps Continuous Reconciliation (Section 48) → Enforce declarative GitOps (`selfHeal: true`) via ArgoCD/Flux; ban manual `kubectl apply` or console modifications
 3. Higher-Level Terraform Modules (Section 76) → Encapsulate complex IaC logic into simple interface modules (`capacity`, `needs_replica`) to reduce cognitive load
@@ -71,11 +72,11 @@ metadata:
 spec:
   project: default
   source:
-    repoURL: "https://github.com/mycorp/infrastructure-ops"
+    repoURL: 'https://github.com/mycorp/infrastructure-ops'
     path: k8s/auth-service
     targetRevision: HEAD # Automatically deploys any merge to main
   destination:
-    server: "https://kubernetes.default.svc"
+    server: 'https://kubernetes.default.svc'
     namespace: auth-prod
   syncPolicy:
     automated:

package/.agent/skills/platform-engineering-opentofu/SKILL.md

@@ -19,6 +19,7 @@ skills:
 ## Mandatory Pre-Flight Context Inspection
 
 Before provisioning cloud infrastructure:
+
 1. OpenTofu State Locking → Use remote S3/DynamoDB or backend state locking to prevent concurrency collisions
 2. Least Privilege IAM → Enforce strict role-based access control (RBAC) on all cloud resources
 3. Plan Validation → Run `tofu plan` and static security analysis (tfsec/checkov) before `tofu apply`

package/.agent/skills/playwright-ai-e2e/SKILL.md

@@ -19,6 +19,7 @@ skills:
 ## Mandatory Pre-Flight Context Inspection
 
 Before writing end-to-end web tests:
+
 1. ARIA Role Locators → Use accessibility roles (`getByRole`, `getByText`) over brittle CSS selectors
 2. Auto-Waiting & Zero Sleep → Avoid `page.waitForTimeout()`; rely on Playwright built-in auto-waiting
 3. Network Interception → Mock external third-party APIs using `page.route()` for deterministic CI runs
@@ -31,7 +32,7 @@ import { test, expect } from '@playwright/test';
 test.describe('Dashboard Features', () => {
   test.beforeEach(async ({ page }) => {
     // Intercept external analytics API to avoid flaky network calls
-    await page.route('**/api/analytics', async (route) => {
+    await page.route('**/api/analytics', async route => {
       await route.fulfill({
         status: 200,
         contentType: 'application/json',
@@ -42,7 +43,7 @@ test.describe('Dashboard Features', () => {
 
   test('user views analytics dashboard', async ({ page }) => {
     await page.goto('/dashboard');
-    
+
     // Resilient ARIA locators
     const heading = page.getByRole('heading', { name: 'Analytics' });
     await expect(heading).toBeVisible();

package/.agent/skills/playwright-best-practices/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before writing Playwright E2E tests or test fixtures, you MUST inspect:
+
 1. Auto-Waiting & Resilient Selectors (Section 26) → Use `getByRole()`, `getByLabel()` or `getByTestId()`; ban `page.waitForTimeout()` and CSS layout paths
 2. Complete Test Isolation Rule (Section 53) → Isolate every test in fresh browser context; ban cascading tests dependent on previous test outcomes
 3. External Network Interception (Section 86) → Intercept 3rd party external APIs (`page.route()`) to eliminate flaky network failures in CI
@@ -46,13 +47,13 @@ Playwright automatically waits for elements to be actionable (visible, stable, n
 await page.waitForTimeout(3000);
 
 // ❌ FLAKY: CSS selectors tied to layout/styling changes
-await page.locator(".btn-primary > span").click();
+await page.locator('.btn-primary > span').click();
 
 // ✅ ROBUST: Playwright auto-waits for actionability based on user-centric selectors
-await page.getByRole("button", { name: "Submit Checkout" }).click();
+await page.getByRole('button', { name: 'Submit Checkout' }).click();
 
 // ✅ ROBUST: Testing for expected states
-await expect(page.getByText("Order confirmed")).toBeVisible();
+await expect(page.getByText('Order confirmed')).toBeVisible();
 ```
 
 ### The Selector Hierarchy (Best to Worst)
@@ -69,15 +70,15 @@ await expect(page.getByText("Order confirmed")).toBeVisible();
 Do not cascade tests (where Test B requires Test A to pass first). Playwright gives every test a blank browser context isolated from the rest.
 
 ```typescript
-import { test, expect } from "@playwright/test";
+import { test, expect } from '@playwright/test';
 
 // ❌ BAD: Cascading state
-test.describe("Dashboard", () => {
-  test("Login", async ({ page }) => {
+test.describe('Dashboard', () => {
+  test('Login', async ({ page }) => {
     await login(page); // Next test assumes this succeeded
   });
-  test("Action", async ({ page }) => {
-    await page.getByRole("button", { name: "Save" }).click();
+  test('Action', async ({ page }) => {
+    await page.getByRole('button', { name: 'Save' }).click();
   });
 });
 
@@ -85,12 +86,12 @@ test.describe("Dashboard", () => {
 test.beforeEach(async ({ page }) => {
   // Login directly via API to bypass slow UI login, seeding cookies
   await performFastApiLogin(page);
-  await page.goto("/dashboard");
+  await page.goto('/dashboard');
 });
 
-test("Should save settings", async ({ page }) => {
-  await page.getByRole("button", { name: "Save" }).click();
-  await expect(page.getByRole("alert")).toHaveText("Saved successfully");
+test('Should save settings', async ({ page }) => {
+  await page.getByRole('button', { name: 'Save' }).click();
+  await expect(page.getByRole('alert')).toHaveText('Saved successfully');
 });
 ```
 
@@ -101,16 +102,16 @@ test("Should save settings", async ({ page }) => {
 E2E tests that rely on external 3rd party APIs (Stripe, SendGrid) will fail randomly due to network latency outside your control.
 
 ```typescript
-test("Should block invalid credit cards", async ({ page }) => {
+test('Should block invalid credit cards', async ({ page }) => {
   // Intercept the outgoing request to the payment processor
-  await page.route("**/api/v1/charge*", async (route) => {
+  await page.route('**/api/v1/charge*', async route => {
     // Return a mocked failure response immediately
-    const json = { status: "declined", message: "Insufficient funds" };
+    const json = { status: 'declined', message: 'Insufficient funds' };
     await route.fulfill({ status: 400, json });
   });
 
-  await page.getByRole("button", { name: "Purchase" }).click();
-  await expect(page.getByText("Insufficient funds")).toBeVisible();
+  await page.getByRole('button', { name: 'Purchase' }).click();
+  await expect(page.getByText('Insufficient funds')).toBeVisible();
 });
 ```
 
@@ -120,33 +121,33 @@ test("Should block invalid credit cards", async ({ page }) => {
 
 ```typescript
 // playwright.config.ts
-import { defineConfig, devices } from "@playwright/test";
+import { defineConfig, devices } from '@playwright/test';
 
 export default defineConfig({
-  testDir: "./tests/e2e",
+  testDir: './tests/e2e',
   fullyParallel: true, // Run tests concurrently
   forbidOnly: !!process.env.CI, // Fail build if `.only` was left in code
   retries: process.env.CI ? 2 : 0, // Retry flakes on CI only
   workers: process.env.CI ? 1 : undefined, // Reduce CI overload
-  reporter: "html",
+  reporter: 'html',
 
   use: {
-    trace: "on-first-retry", // Record trace viewer ONLY on failure to save space
-    video: "retain-on-failure",
-    baseURL: "http://localhost:3000",
+    trace: 'on-first-retry', // Record trace viewer ONLY on failure to save space
+    video: 'retain-on-failure',
+    baseURL: 'http://localhost:3000',
   },
 
   projects: [
-    { name: "chromium", use: { ...devices["Desktop Chrome"] } },
-    { name: "webkit", use: { ...devices["Desktop Safari"] } },
+    { name: 'chromium', use: { ...devices['Desktop Chrome'] } },
+    { name: 'webkit', use: { ...devices['Desktop Safari'] } },
     // Mobile Viewport Example
-    { name: "Mobile Safari", use: { ...devices["iPhone 13"] } },
+    { name: 'Mobile Safari', use: { ...devices['iPhone 13'] } },
   ],
 
   // Spin up local server before running tests
   webServer: {
-    command: "npm run build && npm run start",
-    url: "http://localhost:3000",
+    command: 'npm run build && npm run start',
+    url: 'http://localhost:3000',
     reuseExistingServer: !process.env.CI,
   },
 });

package/.agent/skills/polish/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before running a pre-ship quality pass, you MUST inspect:
+
 1. Target component / view state → Test across light and dark theme modes
 2. The 10-Point Polish Checklist (Section 22) → Audit 8px grid alignment, tabular numbers, focus rings, press feedback, and CLS loading skeletons
 3. Edge case string truncation → Test long user input strings with `truncate` or `line-clamp` boundaries
@@ -30,18 +31,18 @@ The comprehensive pre-ship inspection checklist to verify that code meets top-ti
 
 ## Pre-Ship 10-Point Polish Checklist
 
-| # | Inspection Item | Verification Rule |
-| --- | --- | --- |
-| **1** | **Grid Alignment** | All paddings, margins, and flex gaps use strict 4px/8px multiples. |
-| **2** | **Typography Scale** | Headings use `text-wrap: balance`; body copy limit max `65ch` per line. |
-| **3** | **Tabular Data** | All numbers in tables, badges, and stats use `font-variant-numeric: tabular-nums`. |
-| **4** | **Focus States** | Keyboard tab navigation shows visible, non-clipped `:focus-visible` ring. |
-| **5** | **Press Feedback** | All buttons, links, and cards have explicit `:active` press feedback. |
-| **6** | **Dark Mode** | Dark theme uses relative surface lightness steps and subtle borders instead of dark shadows. |
-| **7** | **Overflow Handling** | Long text strings, email addresses, and filenames use proper text truncation (`truncate` / `line-clamp`). |
-| **8** | **Empty States** | Lists, tables, and search results handle zero-item empty states gracefully. |
-| **9** | **Loading Skeletons** | Slow data loads show matching skeleton pulses instead of sudden layout shifts (CLS). |
-| **10** | **Reduced Motion** | CSS animations and JS motion respect `@media (prefers-reduced-motion: reduce)`. |
+| #      | Inspection Item       | Verification Rule                                                                                         |
+| ------ | --------------------- | --------------------------------------------------------------------------------------------------------- |
+| **1**  | **Grid Alignment**    | All paddings, margins, and flex gaps use strict 4px/8px multiples.                                        |
+| **2**  | **Typography Scale**  | Headings use `text-wrap: balance`; body copy limit max `65ch` per line.                                   |
+| **3**  | **Tabular Data**      | All numbers in tables, badges, and stats use `font-variant-numeric: tabular-nums`.                        |
+| **4**  | **Focus States**      | Keyboard tab navigation shows visible, non-clipped `:focus-visible` ring.                                 |
+| **5**  | **Press Feedback**    | All buttons, links, and cards have explicit `:active` press feedback.                                     |
+| **6**  | **Dark Mode**         | Dark theme uses relative surface lightness steps and subtle borders instead of dark shadows.              |
+| **7**  | **Overflow Handling** | Long text strings, email addresses, and filenames use proper text truncation (`truncate` / `line-clamp`). |
+| **8**  | **Empty States**      | Lists, tables, and search results handle zero-item empty states gracefully.                               |
+| **9**  | **Loading Skeletons** | Slow data loads show matching skeleton pulses instead of sudden layout shifts (CLS).                      |
+| **10** | **Reduced Motion**    | CSS animations and JS motion respect `@media (prefers-reduced-motion: reduce)`.                           |
 
 ---
 

package/.agent/skills/powershell-windows/SKILL.md

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before writing PowerShell `.ps1` scripts or Windows automation commands, you MUST inspect:
+
 1. Object Pipeline vs String Parsing Rule (Section 23) → Operate directly on .NET object properties (`Get-Process | Stop-Process`); ban string splitting/parsing
 2. Mandatory Script Strict Mode Header (Section 43) → Always declare `$ErrorActionPreference = "Stop"` and `Set-StrictMode -Version Latest` at top of automation scripts
 3. Process-Scoped Execution Policy Bypass (Section 68) → Use process-level policy override (`powershell.exe -ExecutionPolicy Bypass -File ...`); ban system-wide `Set-ExecutionPolicy Unrestricted`

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

@@ -20,6 +20,7 @@ scripts-binding:
 ## Mandatory Pre-Flight Context Inspection
 
 Before engineering SaaS pricing pages or comparison tables, you MUST inspect:
+
 1. Tabular Price Numbers (Section 27) → Apply `font-variant-numeric: tabular-nums` to price digits to prevent layout jittering during Monthly/Annual toggles
 2. Featured Tier Distinction (Section 31) → Highlight the "Most Popular" plan with distinct accent borders, badge pill, and solid primary CTA
 3. Discount Badge (Section 26) → Display explicit "Save X%" discount badge alongside the Annual billing toggle option
@@ -31,20 +32,24 @@ Architect high-converting SaaS pricing tables with clear billing toggles, tier d
 ## 4 Pricing Table Rules
 
 ### 1. The Billing Cycle Toggle (Monthly vs Annual)
+
 - Provide a clear segmented control or switch for **Monthly** / **Annual (Save 20%)**.
 - Display an explicit "Save 20%" badge next to the annual option.
 - Smoothly transition price numbers when toggling billing frequencies using `font-variant-numeric: tabular-nums`.
 
 ### 2. Tier Visual Hierarchy (Max 3-4 Tiers)
-- **Hobby / Starter**: Quiet surface, border outline, ghost CTA button (*"Start free"*).
-- **Pro / Business (Featured Tier)**: Prominent accent border, subtle glow/gradient header, "Most Popular" pill badge, solid primary CTA button (*"Start 14-day trial"*).
-- **Enterprise**: Solid dark surface or neutral card, contact sales CTA (*"Talk to sales"*).
+
+- **Hobby / Starter**: Quiet surface, border outline, ghost CTA button (_"Start free"_).
+- **Pro / Business (Featured Tier)**: Prominent accent border, subtle glow/gradient header, "Most Popular" pill badge, solid primary CTA button (_"Start 14-day trial"_).
+- **Enterprise**: Solid dark surface or neutral card, contact sales CTA (_"Talk to sales"_).
 
 ### 3. Price Display Formatting
+
 - Big bold price numeral (`3.5rem` font size) + billing cadence label (`/month billed annually` in smaller muted text).
 - Always include `$0` or `Free` tier explicitly if available.
 
 ### 4. Feature Checklist Consistency
+
 - Group bullet points with green checkmark icons (`✓`).
 - Explicitly list features included vs excluded (using muted dashed icons or opacity for missing features).