contextos-agents 2.1.0 → 2.2.0

package/catalog/skills/react-best-practices/SKILL.md

@@ -0,0 +1,158 @@
+---
+name: vercel-react-best-practices
+description: React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
+license: MIT
+metadata:
+  author: vercel
+  version: "1.0.0"
+---
+
+# Vercel React Best Practices
+
+## Overview
+
+Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 70 rules across 8 categories, prioritized by impact to guide automated refactoring, code generation, and production review.
+
+## When to Use
+
+- When authoring new React functional components or Next.js App Router pages.
+- When implementing data fetching (client or server-side Server Actions, RSC).
+- When reviewing pull requests for rendering bottlenecks or memory leaks.
+- When optimizing bundle size, eliminating network waterfalls, or improving Core Web Vitals (LCP, INP, CLS).
+
+## Rules & Patterns
+
+### Rule Categories by Priority
+
+| Priority | Category | Impact | Prefix |
+|----------|----------|--------|--------|
+| 1 | Eliminating Waterfalls | CRITICAL | `async-` |
+| 2 | Bundle Size Optimization | CRITICAL | `bundle-` |
+| 3 | Server-Side Performance | HIGH | `server-` |
+| 4 | Client-Side Data Fetching | MEDIUM-HIGH | `client-` |
+| 5 | Re-render Optimization | MEDIUM | `rerender-` |
+| 6 | Rendering Performance | MEDIUM | `rendering-` |
+| 7 | JavaScript Performance | LOW-MEDIUM | `js-` |
+| 8 | Advanced Patterns | LOW | `advanced-` |
+
+### 1. Eliminating Waterfalls (CRITICAL)
+
+- `async-cheap-condition-before-await` - Check cheap sync conditions before awaiting flags or remote values.
+- `async-defer-await` - Move await into branches where actually used.
+- `async-parallel` - Use `Promise.all()` for independent asynchronous operations.
+- `async-dependencies` - Use better-all for partial dependencies.
+- `async-api-routes` - Start promises early, await late in API routes.
+- `async-suspense-boundaries` - Use Suspense to stream content progressively.
+
+### 2. Bundle Size Optimization (CRITICAL)
+
+- `bundle-barrel-imports` - Import directly from specific modules, avoid broad barrel files (`index.ts`).
+- `bundle-analyzable-paths` - Prefer statically analyzable import paths to avoid bloated traces.
+- `bundle-dynamic-imports` - Use `next/dynamic` or `React.lazy()` for heavy interactive components.
+- `bundle-defer-third-party` - Load analytics and logging scripts after hydration.
+- `bundle-conditional` - Load modules only when feature flags or user actions require them.
+- `bundle-preload` - Preload assets on hover or focus for perceived instant navigation.
+
+### 3. Server-Side Performance (HIGH)
+
+- `server-auth-actions` - Always authenticate server actions like API routes.
+- `server-cache-react` - Use `React.cache()` for per-request deduplication.
+- `server-cache-lru` - Use LRU cache for cross-request caching.
+- `server-dedup-props` - Avoid duplicate serialization in RSC props.
+- `server-hoist-static-io` - Hoist static I/O to module level.
+- `server-no-shared-module-state` - Avoid module-level mutable request state in RSC/SSR.
+- `server-serialization` - Minimize data passed across the server-client boundary.
+- `server-parallel-fetching` - Restructure components to parallelize fetches.
+- `server-after-nonblocking` - Use `after()` for non-blocking operations like analytics logging.
+
+### 4. Client-Side Data Fetching (MEDIUM-HIGH)
+
+- `client-swr-dedup` - Use SWR or TanStack Query for automatic request deduplication.
+- `client-event-listeners` - Deduplicate global event listeners.
+- `client-passive-event-listeners` - Use passive listeners for scroll and touch.
+- `client-localstorage-schema` - Version and minimize data stored in localStorage.
+
+### 5. Re-render Optimization (MEDIUM)
+
+- `rerender-defer-reads` - Don't subscribe to state only used in callbacks.
+- `rerender-memo` - Extract expensive work into memoized components.
+- `rerender-memo-with-default-value` - Hoist default non-primitive props.
+- `rerender-dependencies` - Use primitive dependencies in effects and callbacks.
+- `rerender-derived-state` - Subscribe to derived booleans, not raw high-frequency values.
+- `rerender-derived-state-no-effect` - Derive state during render, never in `useEffect`.
+- `rerender-functional-setstate` - Use functional `setState` for stable callback references.
+- `rerender-lazy-state-init` - Pass initializer functions to `useState` for expensive computations.
+- `rerender-transitions` - Use `startTransition` for non-urgent state updates.
+- `rerender-use-deferred-value` - Defer expensive renders to keep input responsive.
+- `rerender-no-inline-components` - Never define subcomponents inside component render bodies.
+
+### 6. Rendering Performance (MEDIUM)
+
+- `rendering-content-visibility` - Use `content-visibility: auto` for long offscreen lists.
+- `rendering-hoist-jsx` - Extract static JSX elements outside components.
+- `rendering-conditional-render` - Use ternary (`condition ? <Comp /> : null`), not `&&` to avoid 0 rendering.
+- `rendering-usetransition-loading` - Prefer `useTransition` for loading state indicators.
+
+### 7. JavaScript Performance (LOW-MEDIUM)
+
+- `js-index-maps` - Build `Map` for repeated lookups instead of repeated array searches.
+- `js-cache-property-access` - Cache object properties in tight loops.
+- `js-early-exit` - Return early from functions to avoid nested complexity.
+- `js-hoist-regexp` - Hoist RegExp creation outside loops and functions.
+- `js-set-map-lookups` - Use `Set` / `Map` for O(1) lookups.
+
+### 8. Advanced Patterns (LOW)
+
+- `advanced-effect-event-deps` - Don't put `useEffectEvent` results in effect deps.
+- `advanced-event-handler-refs` - Store event handlers in refs for stable listener attachments.
+- `advanced-init-once` - Initialize app singletons once per lifecycle.
+- `advanced-compound-components` - Use React Context with compound components for composable sub-parts instead of monolithic prop bags.
+- `advanced-error-boundary-colocation` - Colocate Error Boundaries and Suspense boundaries close to the fault-prone tree, preserving the rest of the UI.
+
+## Code Examples
+
+
+```tsx
+// [GOOD] Parallel server fetching without waterfall
+import { cache } from 'react';
+
+export const getUser = cache(async (id: string) => {
+  return db.user.findUnique({ where: { id } });
+});
+
+export default async function UserPage({ params }: { params: { id: string } }) {
+  // Parallel dispatch
+  const userPromise = getUser(params.id);
+  const postsPromise = getPosts(params.id);
+
+  const [user, posts] = await Promise.all([userPromise, postsPromise]);
+
+  return (
+    <main>
+      <h1>{user.name}</h1>
+      <PostList posts={posts} />
+    </main>
+  );
+}
+```
+
+## Validation Checklist
+
+- [ ] All independent async fetches use `Promise.all()` instead of sequential `await`.
+- [ ] Direct imports used instead of barrel file imports for large libraries.
+- [ ] No `useEffect` used for deriving computed state from props or state.
+- [ ] Heavy interactive modals/drawers loaded dynamically via `next/dynamic`.
+- [ ] Server actions perform authentication checks before data mutations.
+- [ ] Zero subcomponents defined inside the body of parent components.
+
+## Common Mistakes
+
+- Writing sequential `await fetchA(); await fetchB();` creating avoidable network waterfalls.
+- Importing from package root barrel files triggering full bundle inclusion.
+- Setting state inside `useEffect` in response to prop changes.
+- Serializing full database models with sensitive or unused fields to Client Components.
+
+## Integration Notes
+
+- Pairs with `react` and `nextjs` skills for idiomatic App Router patterns.
+- Complements `performance` for Lighthouse and Core Web Vitals verification.

package/catalog/skills/react-best-practices/VALIDATION.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "properties": {
+    "rules_followed": {
+      "type": "boolean"
+    }
+  },
+  "required": [
+    "rules_followed"
+  ]
+}

package/catalog/skills/react-best-practices/skill.yaml

@@ -0,0 +1,13 @@
+schemaVersion: 2
+name: react-best-practices
+category: frontend
+type: instruction-only
+description: React and Next.js performance optimization guidelines from Vercel Engineering.
+version: 1.0.0
+deprecated: true
+canonical: react
+requires:
+  - react
+resources:
+  - SKILL.md
+  - VALIDATION.json

package/catalog/skills/redesign-audit/SKILL.md

@@ -0,0 +1,117 @@
+---
+name: redesign-existing-projects
+description: Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS.
+---
+
+# Redesign Skill & UI Audit
+
+## Overview
+
+A systematic redesign and auditing protocol designed to elevate existing websites, dashboards, and web applications to world-class agency quality. It diagnoses and eradicates generic AI design fingerprints, sloppy typography, inconsistent palettes, and absent interaction states without breaking business logic or underlying component contracts.
+
+## When to Use
+
+- When auditing an existing UI codebase for design quality, responsiveness, or accessibility.
+- When modernizing a legacy application or uplifting generic templates.
+- When tasked to "redesign", "clean up the layout", "audit UI", or "make it look expensive and modern".
+
+## Rules & Patterns
+
+### 1. Workflow: Scan → Diagnose → Fix
+
+1. **Scan:** Read the codebase. Identify the framework, styling method (Tailwind v3/v4, vanilla CSS, CSS Modules), and established design tokens.
+2. **Diagnose:** Run through the design audit categories. Catalog generic patterns, missing states, and optical alignment flaws.
+3. **Fix:** Apply surgical, targeted upgrades working within the existing stack. Do not rewrite from scratch.
+
+### 2. Design Audit Categories
+
+#### Typography
+
+- **Replace Browser Defaults:** Swap generic `Inter`, `Roboto`, or system fonts with expressive typefaces (`Geist`, `Outfit`, `Cabinet Grotesk`, `Satoshi`).
+- **Presence & Scale:** Increase display text size, tighten letter-spacing (`-0.02em` to `-0.04em`), reduce line-height on headlines.
+- **Reading Comfort:** Limit body text to 65 characters per line (`max-w-prose`), increase line-height to 1.6.
+- **Figures:** Enable tabular figures (`font-variant-numeric: tabular-nums`) for numbers in tables and data readouts.
+- **Orphan Prevention:** Apply `text-wrap: balance` on headlines and `text-wrap: pretty` on paragraphs.
+
+#### Color and Surfaces
+
+- **No Pure Black Backgrounds:** Replace `#000000` with tinted dark charcoal (`#0A0A0A`, `#121212`).
+- **Desaturate Accents:** Keep accent saturation below 80% so it blends harmoniously with neutrals.
+- **Single Accent Color:** Commit to one dominant accent hue; remove conflicting secondary tints.
+- **Tinted Shadows:** Tint shadows to match the background hue rather than harsh black opacity.
+- **Background Depth:** Prevent sterile flat sections by layering subtle noise overlays, ambient gradients, or masked imagery.
+
+#### Layout and Space
+
+- **Asymmetry & Bento Grids:** Break repetitive 3-column Bootstrap grids with asymmetrical spans or offset cards.
+- **Mobile Viewport Bug Fix:** Never use `height: 100vh`; always use `min-height: 100dvh`.
+- **Vertical Alignment:** Pin action buttons to the bottom of card groups (`mt-auto` or grid alignment) to maintain horizontal baseline harmony across differing text heights.
+- **Optical Centering:** Adjust icons, badges, and play buttons optically by 1-2px rather than relying solely on pure mathematical centering.
+
+#### Interactivity and States
+
+- **Interactive Feedback:** Add 200-300ms transitions, distinct hover shifts, and physical active presses (`scale(0.98)`).
+- **Visible Focus Rings:** Mandatory `:focus-visible` styling for keyboard navigation.
+- **States Completeness:** Always provide designed skeleton loaders, empty states, and inline error messages.
+
+#### Content & Code Quality
+
+- **Eradicate AI Clichés:** Remove buzzwords ("Elevate", "Seamless", "Unleash", "Next-Gen") and placeholder latin text.
+- **Semantic HTML:** Replace nested div containers with `<nav>`, `<main>`, `<article>`, `<section>`, `<aside>`.
+- **Relative Units:** Use `rem`, `%`, and CSS Grid rather than hardcoded pixel widths.
+
+### 3. Fix Priority
+
+1. **Font Swap:** Biggest instant aesthetic elevation with lowest regression risk.
+2. **Palette Cleanup:** Eliminate clashing or oversaturated colors.
+3. **States & Feedback:** Add hover, active, focus, loading, and empty states.
+4. **Layout & Alignment:** Fix container widths, baseline alignment, and mobile viewport heights.
+5. **Component Polish:** Replace generic cards and accordion boxes with modern minimal equivalents.
+
+## Code Examples
+
+```tsx
+// [BEFORE] Generic, misaligned card with generic shadow
+<div className="bg-white border rounded shadow p-4">
+  <h2>{title}</h2>
+  <p>{desc}</p>
+  <button className="bg-blue-500 text-white p-2">Click</button>
+</div>
+
+// [AFTER] Polished card with optical baseline alignment, tinted surface, and micro-interaction
+<div className="flex flex-col bg-[#FFFFFF] dark:bg-[#121212] border border-black/5 dark:border-white/10 rounded-2xl p-6 hover:shadow-[0_4px_20px_rgba(0,0,0,0.04)] transition-all duration-200">
+  <h3 className="font-semibold text-lg tracking-tight text-neutral-900 dark:text-neutral-100 text-balance mb-2">
+    {title}
+  </h3>
+  <p className="text-sm text-neutral-600 dark:text-neutral-400 leading-relaxed text-pretty mb-6">
+    {desc}
+  </p>
+  <button 
+    type="button" 
+    className="mt-auto inline-flex items-center justify-center font-medium text-sm px-4 py-2.5 rounded-xl bg-neutral-900 dark:bg-neutral-100 text-white dark:text-black hover:bg-neutral-800 active:scale-[0.98] transition-transform duration-150 focus-visible:ring-2 focus-visible:ring-neutral-400"
+  >
+    Continue
+  </button>
+</div>
+```
+
+## Validation Checklist
+
+- [ ] All headings have `text-wrap: balance` and appropriate negative letter tracking.
+- [ ] No pure black `#000000` backgrounds or oversaturated accent colors (>80% saturation).
+- [ ] All interactive elements include `:hover`, `:active`, and `:focus-visible` styles.
+- [ ] Cards in side-by-side grids align primary CTA buttons along the same bottom baseline.
+- [ ] Viewport containers use `100dvh` instead of `100vh`.
+- [ ] All lists, tables, and feeds have a designed empty state.
+
+## Common Mistakes
+
+- Rewriting components from scratch and breaking existing prop contracts or unit tests.
+- Forcing full-width sections without `max-w` constraints on ultra-wide screens.
+- Leaving action buttons at random heights inside differing text content cards.
+- Introducing external UI libraries without checking existing `package.json` dependencies.
+
+## Integration Notes
+
+- Complements `impeccable-design` for hard 50-rule QA verification.
+- Works alongside `ui-ux-pro` for token generation and color theory.

package/catalog/skills/redesign-audit/VALIDATION.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "properties": {
+    "rules_followed": {
+      "type": "boolean"
+    }
+  },
+  "required": [
+    "rules_followed"
+  ]
+}

package/catalog/skills/redesign-audit/skill.yaml

@@ -0,0 +1,9 @@
+schemaVersion: 2
+name: redesign-audit
+category: design
+type: instruction-only
+description: Audits and upgrades existing web codebases with high-end typography, color, layout, and interaction polish.
+version: 1.0.0
+resources:
+  - SKILL.md
+  - VALIDATION.json

package/catalog/skills/security-audit/EXAMPLES.md

@@ -0,0 +1,79 @@
+# Security Audit - Examples & Verification Scenarios
+
+## Example 1: Adversarial Validation of Path Traversal
+
+### Hunter Report (Initial Finding)
+```markdown
+ID: CANDIDATE-01
+Component: User Avatar Download
+Location: src/routes/avatar.ts:18
+Sink: fs.createReadStream(path.join(__dirname, '../../uploads', req.query.file))
+Hypothesis: Attacker passes `?file=../../etc/passwd` to read arbitrary host files.
+```
+
+### Verifier Execution (Disproving Attempt)
+The verifier inspects the middleware chain and creates an isolated reproduction test:
+```typescript
+import { describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+import path from 'node:path';
+
+function resolveAvatarPath(baseDir: string, requestedFile: string): string {
+  const safePath = path.resolve(baseDir, requestedFile);
+  if (!safePath.startsWith(baseDir)) {
+    throw new Error('Access denied: directory traversal detected');
+  }
+  return safePath;
+}
+
+describe('Avatar Path Resolution', () => {
+  const uploadsDir = path.resolve('/var/app/uploads');
+
+  it('rejects traversal attempts escaping uploads root', () => {
+    assert.throws(
+      () => resolveAvatarPath(uploadsDir, '../../etc/passwd'),
+      /Access denied: directory traversal detected/
+    );
+  });
+
+  it('allows safe filenames inside uploads root', () => {
+    const resolved = resolveAvatarPath(uploadsDir, 'user-123.png');
+    assert.equal(resolved, path.join(uploadsDir, 'user-123.png'));
+  });
+});
+```
+
+### Verifier Verdict
+- If `resolveAvatarPath` was missing in source: Finding is **CONFIRMED** with source trace.
+- If middleware sanitized input before the handler: Finding is **DISPROVEN** and logged as invalid candidate with reason.
+
+---
+
+## Example 2: Minimal Remediated Code Block
+
+```typescript
+// Vulnerable:
+// app.get('/files', (req, res) => {
+//   res.sendFile(path.join(PUBLIC_DIR, req.query.path as string));
+// });
+
+// Remediated (Surgical Blast Radius):
+import path from 'node:path';
+
+app.get('/files', (req, res) => {
+  const rawPath = String(req.query.path ?? '');
+  const normalizedPath = path.normalize(rawPath).replace(/^(\.\.[\/\\])+/, '');
+  const resolved = path.resolve(PUBLIC_DIR, normalizedPath);
+
+  if (!resolved.startsWith(PUBLIC_DIR)) {
+    return res.status(403).json({
+      error: {
+        code: 'FORBIDDEN',
+        message: 'Path traversal attempted'
+      }
+    });
+  }
+
+  res.sendFile(resolved);
+});
+```

package/catalog/skills/security-audit/SKILL.md

@@ -0,0 +1,91 @@
+---
+name: security-audit
+description: Security guidance and vulnerability review for codebases, APIs, and services. Orchestrates adversarial hunting and independent verification with sandbox write isolation and evidence ledgers.
+---
+
+# Security Audit
+
+Find vulnerabilities that violate a real trust boundary, then give owners source evidence, safe reproduction, priority, and the smallest effective fix. This is a defensive, source-first workflow inspired by Cloudflare's security audit architecture.
+
+## Operating Modes
+
+This skill operates in two distinct modes:
+
+- **Guidance Mode**: For security questions, focused reviews, threat modeling, or triage of specific components, use only the relevant parts of this skill. Do not automatically create audit directories or write audit artifacts.
+- **Full Audit Mode**: Use the complete workflow when explicitly requested to audit, pen-test, or perform an end-to-end security review of a repository. Run all phases and generate structured artifacts.
+
+## Adversarial Multi-Agent Audit Protocol
+
+A core invariant of rigorous security auditing is adversarial verification:
+
+1. **Separation of Hunter and Verifier**:
+   - The agent that discovers a candidate vulnerability (**Hunter**) must never be the same agent that validates it.
+   - The verifying agent (**Verifier**) starts with a fresh context and explicitly attempts to disprove each finding.
+2. **Evidence-Based Standard**:
+   - A candidate vulnerability is confirmed only if it has a complete source trace from untrusted input to a sensitive sink, along with a bounded, observable defect.
+   - If an issue cannot be definitively reproduced or disproven locally, mark it as `needs_validation` rather than creating speculative findings.
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    SECURITY AUDIT PIPELINE                  │
+│                                                             │
+│  Phase 1: Reconnaissance (Map trust boundaries & inputs)    │
+│                     ↓                                       │
+│  Phase 2: Coverage Hunting (Hunter agents search surfaces)  │
+│                     ↓                                       │
+│  Phase 3: Candidate Validation (Verifier agents disprove)   │
+│                     ↓                                       │
+│  Phase 4: Structured Output (findings.json & ledger)        │
+│                     ↓                                       │
+│  Phase 5: Record Verification (Final attestation review)    │
+│                     ↓                                       │
+│  Phase 6: Target-Neutral Reporting (REPORT.md)              │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## Universal Execution Safety & Sandbox Write Isolation
+
+Target repositories must be audited without risking supply-chain compromise or data exfiltration:
+
+- **Read-Only Target Code**: Source inspection is read-only. Target code must never be executed with write access to its own repository.
+- **Dedicated Scratch Root**: All target-controlled builds, tests, or reproduction scripts execute inside an isolated sandbox writing strictly to `scratch/`.
+- **Zero External Network**: Sandboxed processes must have no outbound internet access. Use isolated loopback namespaces if local client/server communication is needed.
+- **Sanitized Environment**: Clear credentials, SSH keys, cloud tokens, and parent process environments before spawning reproduction commands.
+- **Promotion to Artifacts**: Only trusted parent-side code may inspect and promote non-secret results from `scratch/` to retained `artifacts/`.
+
+## Audit Artifacts & Findings Schema
+
+Full audits produce machine-readable and human-readable artifacts:
+
+### findings.json
+```json
+{
+  "audit_version": "1.0.0",
+  "target_repository": "example-repo",
+  "commit_hash": "a1b2c3d",
+  "findings": [
+    {
+      "id": "SEC-001",
+      "title": "Path Traversal in File Download Handler",
+      "severity": "HIGH",
+      "cwe": "CWE-22",
+      "source_trace": {
+        "source_file": "src/controllers/download.ts",
+        "source_line": 42,
+        "entry_point": "req.query.filename",
+        "sink_file": "src/services/storage.ts",
+        "sink_line": 88,
+        "sink_function": "fs.promises.readFile"
+      },
+      "verification_status": "CONFIRMED",
+      "verifier_notes": "Reproduction script proved escape from base directory using %2e%2e%2f traversal.",
+      "remediation": "Apply path.normalize and verify path.resolve starts with the designated root directory."
+    }
+  ]
+}
+```
+
+### Required Reports
+- `REPORT.md`: Executive summary, risk score, vulnerability distribution, and remediation priorities.
+- `FINDINGS-DETAIL.md`: Detailed technical breakdown of each confirmed finding with step-by-step reproduction and surgical diff recommendations.
+- `NEEDS-VALIDATION.md`: Potential leads that could not be conclusively verified without live cloud infrastructure or out-of-scope permissions.

package/catalog/skills/security-audit/TROUBLESHOOTING.md

@@ -0,0 +1,46 @@
+# Security Audit - Troubleshooting & Common Edge Cases
+
+## Common Diagnostic Scenarios
+
+### 1. Hunter Agent Generates Speculative or Untraceable Findings
+
+- **Symptom**: Candidate vulnerability report contains vague descriptions like "Potential SQL injection in database layer" without line numbers, parameters, or affected sinks.
+- **Root Cause**: The Hunter agent skipped Step 1 (Reconnaissance) and performed heuristic keyword matching instead of taint tracking.
+- **Fix Protocol**:
+  1. Reject candidate immediately: mark status as `INVALID_SPECULATION`.
+  2. Mandate the 3-point trace requirement:
+     - Entry Point (HTTP param, header, body field, CLI flag).
+     - Intermediate Propagation (functions, transforms, assignments).
+     - Sensitive Sink (database query, filesystem access, shell execution, reflection).
+  3. If any of the three points is missing, the candidate cannot be submitted to the Verifier.
+
+---
+
+### 2. Sandbox File Promotion Failure (`scratch/` to `artifacts/`)
+
+- **Symptom**: Parent process fails to copy verified findings or test outputs from `scratch/` to `artifacts/`, throwing an access violation or promotion blocker.
+- **Root Cause**: Target-controlled code created symlinks, hardlinks, or unescaped nested paths attempting to escape the assigned scratch root.
+- **Fix Protocol**:
+  1. Never perform recursive copy or glob promotion across boundaries.
+  2. Walk paths with `no-follow` directory descriptors.
+  3. Verify that the leaf is a regular file with link count exactly 1 and size within the byte allowance.
+  4. Discard any entry violating promotion bounds and log `PROMOTION_SECURITY_REJECT`.
+
+---
+
+### 3. Loopback Port Collisions During Local Reproduction
+
+- **Symptom**: Standalone verification script fails with `EADDRINUSE: address already in use 127.0.0.1:3000`.
+- **Root Cause**: Fixed port numbers in reproduction tests collide with existing developer processes.
+- **Fix Protocol**:
+  - Always bind reproduction servers to port `0` (`server.listen(0)`), allowing the OS to allocate an ephemeral free port.
+  - Read `server.address().port` dynamically in test fixtures.
+
+---
+
+### 4. False Positives Due to Upstream Middleware Sanitization
+
+- **Symptom**: Hunter flags `req.query.path` passed to `res.sendFile`, but global Express middleware already calls `path.normalize` and rejects relative traversals.
+- **Root Cause**: Single-file inspection without analyzing the global middleware chain.
+- **Fix Protocol**:
+  - The Verifier agent must inspect the application entrypoint (`app.ts`, `server.ts`, router configuration) to verify active global filters before concluding the audit verdict.

package/catalog/skills/security-audit/VALIDATION.json

@@ -0,0 +1,11 @@
+{
+  "skill": "security-audit",
+  "version": "1.0.0",
+  "checks": [
+    "Hunter and verifier roles are strictly separated",
+    "Evidence-based verification requires complete source trace",
+    "Target code is executed in read-only sandbox writing only to scratch/",
+    "Findings are documented in structured findings.json format",
+    "Remediations adhere to surgical blast radius containment"
+  ]
+}

package/catalog/skills/security-audit/skill.yaml

@@ -0,0 +1,14 @@
+schemaVersion: 2
+name: security-audit
+description: Adversarial multi-agent security audit framework inspired by Cloudflare. Employs independent hunter and verifier roles, OS sandbox write isolation, and evidence-backed vulnerability verification.
+version: 1.0.0
+category: engineering
+type: instruction-only
+requires:
+  - engineering-workflow
+  - security
+resources:
+  - EXAMPLES.md
+  - SKILL.md
+  - TROUBLESHOOTING.md
+  - VALIDATION.json

package/catalog/skills/soft-design/EXAMPLES.md

@@ -0,0 +1,51 @@
+# Soft Design - Component & Layout Examples
+
+## Example 1: Glassmorphic Elevated Panel
+
+```tsx
+import React from 'react';
+
+interface SoftPanelProps {
+  title: string;
+  category: string;
+  children: React.ReactNode;
+}
+
+export function SoftElevatedPanel({ title, category, children }: SoftPanelProps) {
+  return (
+    <div className="relative overflow-hidden rounded-3xl border border-white/40 bg-white/60 p-8 shadow-[0_20px_50px_rgba(8,_112,_184,_0.07)] backdrop-blur-xl transition-all duration-300 hover:shadow-[0_30px_60px_rgba(8,_112,_184,_0.12)]">
+      {/* Subtle ambient light gradient */}
+      <div className="pointer-events-none absolute -right-20 -top-20 h-56 w-56 rounded-full bg-gradient-to-br from-indigo-200/50 to-pink-200/30 blur-2xl" />
+
+      <div className="relative z-10">
+        <span className="inline-block rounded-full bg-indigo-50/80 px-3 py-1 text-xs font-medium text-indigo-600 backdrop-blur-sm">
+          {category}
+        </span>
+        <h2 className="mt-4 text-2xl font-normal tracking-tight text-slate-800">
+          {title}
+        </h2>
+        <div className="mt-6 text-slate-600 leading-relaxed">
+          {children}
+        </div>
+      </div>
+    </div>
+  );
+}
+```
+
+---
+
+## Example 2: Soft Tactile Pill Button
+
+```tsx
+export function SoftPillButton({ label, onClick }: { label: string; onClick: () => void }) {
+  return (
+    <button
+      onClick={onClick}
+      className="rounded-full bg-gradient-to-b from-indigo-500 to-indigo-600 px-6 py-3 text-sm font-medium text-white shadow-[0_10px_20px_-5px_rgba(79,_70,_229,_0.3)] transition-all duration-200 hover:scale-[1.02] hover:shadow-[0_15px_25px_-5px_rgba(79,_70,_229,_0.4)] active:scale-[0.98]"
+    >
+      {label}
+    </button>
+  );
+}
+```