diff --git a/.agents/README.md b/.agents/README.md
deleted file mode 100644
index 208dbff25..000000000
--- a/.agents/README.md
+++ /dev/null
@@ -1,74 +0,0 @@
-# Agent Rules Directory
-
-This directory contains conditional, service-specific rules that supplement the main [AGENTS.md](../AGENTS.md) file.
-
-## Structure
-
-```
-.agents/
-├── README.md                 # This file
-└── rules/
-    ├── cursor-specific.mdc   # Tool-specific guidance for Cursor
-    └── dashboard/            # Dashboard (apps/dashboard) specific rules
-        └── design.mdc        # Design system tokens, components, a11y
-```
-
-## How Rules Are Loaded
-
-### Cursor
-
-- Symlinked via `.cursor/rules/` → `.agents/rules/`
-- Cursor loads all `.mdc` files based on glob patterns
-
-### Claude Code
-
-- Symlinked via `.claude/rules/` → `.agents/rules/`
-- Claude Code loads rules contextually
-
-## Adding New Rules
-
-### When to add a rule here vs AGENTS.md
-
-| Belongs in AGENTS.md     | Belongs in `.agents/rules/`  |
-| ------------------------ | ---------------------------- |
-| ✅ Architecture overview | ✅ Detailed design tokens    |
-| ✅ Commands & workflows  | ✅ Component import maps     |
-| ✅ File conventions      | ✅ Service-specific patterns |
-| ✅ Core code style       | ✅ Tool-specific hints       |
-| ✅ Git workflow          | ✅ Glob-conditional guidance |
-
-### Creating a new service-specific rule
-
-1. Create directory: `.agents/rules/<service-name>/`
-2. Add `.mdc` files with frontmatter:
-
-```markdown
----
-description: Brief description
-globs:
-  - "apps/<service>/**/*.{ts,tsx}"
-alwaysApply: false
----
-
-# Your rule content here
-```
-
-3. Symlink for both tools (if needed):
-
-```bash
-ln -sf ../../../.agents/rules/<service> .cursor/rules/<service>
-ln -sf ../../../.agents/rules/<service> .claude/rules/<service>
-```
-
-## Current Rules
-
-### cursor-specific.mdc
-
-- **Applies**: Always
-- **Purpose**: Tool-specific hints for Cursor (e.g., when to use sequential thinking MCP)
-
-### dashboard/design.mdc
-
-- **Applies**: When editing `apps/dashboard/**/*.{ts,tsx,mdx}`
-- **Purpose**: Design system tokens, component patterns, accessibility requirements
-- **Why separate**: 200+ lines of detailed reference that would bloat AGENTS.md
diff --git a/.agents/mcp.json b/.agents/mcp.json
deleted file mode 100644
index cf1de173f..000000000
--- a/.agents/mcp.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "mcpServers": {
-    "context7": {
-      "command": "npx",
-      "args": ["-y", "@upstash/context7-mcp"]
-    },
-    "playwright": {
-      "command": "npx",
-      "args": ["@playwright/mcp@latest"]
-    },
-    "figma": {
-      "url": "https://mcp.figma.com/mcp",
-      "type": "http"
-    },
-    "sequential-thinking": {
-      "command": "npx",
-      "args": ["-y", "@modelcontextprotocol/server-sequential-thinking"]
-    }
-  }
-}
diff --git a/.agents/rules/clickup/clickup.mdc b/.agents/rules/clickup/clickup.mdc
deleted file mode 100644
index ff8917de1..000000000
--- a/.agents/rules/clickup/clickup.mdc
+++ /dev/null
@@ -1,64 +0,0 @@
-# ClickUp Configuration
-
-## Default Settings
-
-- **Default List ID**: `90132341641`
-- **Workspace**: Auto-detected from authenticated workspace
-
-## Usage Guidelines
-
-### Creating Tasks
-
-When creating tasks via ClickUp MCP, always use the default list ID unless explicitly asked otherwise:
-
-```typescript
-// Use this list_id by default
-list_id: "90132341641"
-```
-
-### Task Creation Best Practices
-
-1. **Always specify the list_id** - Use `90132341641` to avoid search overhead
-2. **Ask for assignees** - Don't automatically assign tasks unless explicitly requested
-3. **Use meaningful task names** - Keep them concise but descriptive
-4. **Include markdown descriptions** - Use `markdown_description` for rich formatting
-5. **Set priority appropriately** - Use 'urgent', 'high', 'normal', or 'low' based on context
-
-### Example Task Creation
-
-```typescript
-clickup_create_task({
-  name: "Implement user authentication flow",
-  list_id: "90132341641",
-  markdown_description: "## Requirements\n- Add login/signup forms\n- Implement JWT auth\n- Add protected routes",
-  priority: "high",
-  assignees: ["user@example.com"], // Only if specified
-  tags: ["backend", "auth"]
-})
-```
-
-### When to Ask First
-
-Before creating tasks, ask the user for:
-- Task name and description
-- Priority level
-- Assignees (if any)
-- Tags to apply
-- Due date (if applicable)
-
-### When to Use Search
-
-Only search for list IDs when:
-- User explicitly requests a different list
-- User asks to create task in a specific project/folder
-- Default list ID fails (e.g., permissions issue)
-
-## Quick Reference
-
-| Operation | List ID Required | Use Default |
-|-----------|------------------|-------------|
-| Create task | Yes | `90132341641` |
-| Update task | No (uses task_id) | N/A |
-| Get task | No (uses task_id) | N/A |
-| List tasks | Optional | `90132341641` |
-| Add comment | No (uses task_id) | N/A |
diff --git a/.claude/mcp.json b/.claude/mcp.json
deleted file mode 120000
index d5dbdcbe4..000000000
--- a/.claude/mcp.json
+++ /dev/null
@@ -1 +0,0 @@
-../.agents/mcp.json
\ No newline at end of file
diff --git a/.claude/mcp.json b/.claude/mcp.json
new file mode 100644
index 000000000..cf1de173f
--- /dev/null
+++ b/.claude/mcp.json
@@ -0,0 +1,20 @@
+{
+  "mcpServers": {
+    "context7": {
+      "command": "npx",
+      "args": ["-y", "@upstash/context7-mcp"]
+    },
+    "playwright": {
+      "command": "npx",
+      "args": ["@playwright/mcp@latest"]
+    },
+    "figma": {
+      "url": "https://mcp.figma.com/mcp",
+      "type": "http"
+    },
+    "sequential-thinking": {
+      "command": "npx",
+      "args": ["-y", "@modelcontextprotocol/server-sequential-thinking"]
+    }
+  }
+}
diff --git a/.claude/rules/clickup/clickup.mdc b/.claude/rules/clickup/clickup.mdc
deleted file mode 120000
index 72bd809ce..000000000
--- a/.claude/rules/clickup/clickup.mdc
+++ /dev/null
@@ -1 +0,0 @@
-../../../.agents/rules/clickup/clickup.mdc
\ No newline at end of file
diff --git a/.claude/rules/clickup/clickup.mdc b/.claude/rules/clickup/clickup.mdc
new file mode 100644
index 000000000..ff8917de1
--- /dev/null
+++ b/.claude/rules/clickup/clickup.mdc
@@ -0,0 +1,64 @@
+# ClickUp Configuration
+
+## Default Settings
+
+- **Default List ID**: `90132341641`
+- **Workspace**: Auto-detected from authenticated workspace
+
+## Usage Guidelines
+
+### Creating Tasks
+
+When creating tasks via ClickUp MCP, always use the default list ID unless explicitly asked otherwise:
+
+```typescript
+// Use this list_id by default
+list_id: "90132341641"
+```
+
+### Task Creation Best Practices
+
+1. **Always specify the list_id** - Use `90132341641` to avoid search overhead
+2. **Ask for assignees** - Don't automatically assign tasks unless explicitly requested
+3. **Use meaningful task names** - Keep them concise but descriptive
+4. **Include markdown descriptions** - Use `markdown_description` for rich formatting
+5. **Set priority appropriately** - Use 'urgent', 'high', 'normal', or 'low' based on context
+
+### Example Task Creation
+
+```typescript
+clickup_create_task({
+  name: "Implement user authentication flow",
+  list_id: "90132341641",
+  markdown_description: "## Requirements\n- Add login/signup forms\n- Implement JWT auth\n- Add protected routes",
+  priority: "high",
+  assignees: ["user@example.com"], // Only if specified
+  tags: ["backend", "auth"]
+})
+```
+
+### When to Ask First
+
+Before creating tasks, ask the user for:
+- Task name and description
+- Priority level
+- Assignees (if any)
+- Tags to apply
+- Due date (if applicable)
+
+### When to Use Search
+
+Only search for list IDs when:
+- User explicitly requests a different list
+- User asks to create task in a specific project/folder
+- Default list ID fails (e.g., permissions issue)
+
+## Quick Reference
+
+| Operation | List ID Required | Use Default |
+|-----------|------------------|-------------|
+| Create task | Yes | `90132341641` |
+| Update task | No (uses task_id) | N/A |
+| Get task | No (uses task_id) | N/A |
+| List tasks | Optional | `90132341641` |
+| Add comment | No (uses task_id) | N/A |
diff --git a/.agents/rules/cursor-specific.mdc b/.claude/rules/cursor-specific.mdc
similarity index 100%
rename from .agents/rules/cursor-specific.mdc
rename to .claude/rules/cursor-specific.mdc
diff --git a/.claude/rules/testing.md b/.claude/rules/testing.md
new file mode 100644
index 000000000..42ef062f2
--- /dev/null
+++ b/.claude/rules/testing.md
@@ -0,0 +1,289 @@
+# Testing Guidelines
+
+Follow these rules when writing tests for the Anticapture project.
+
+---
+
+## Rule 1: Test Pyramid
+
+Follow the test pyramid strategy with three test types.
+**Target ratio:** ~70% unit, ~20% integration, ~10% E2E
+
+1. **Unit Tests** (majority)
+   - Fast, cheap, isolated
+   - Test business logic in services and utilities
+   - Mock external dependencies (database, APIs)
+
+2. **Integration Tests** (moderate)
+   - Test component interactions
+   - Verify API endpoints with real HTTP calls
+   - May use test database
+
+3. **E2E Tests** (few)
+   - Test critical user flows end-to-end
+   - Slow and expensive to maintain
+   - Reserve for high-value scenarios only
+
+---
+
+## Rule 2: Test Doubles Strategy
+
+Prefer **stubs** and **fakes** over mocks to avoid brittle tests.
+
+| Type     | Use When                                       | Example                             |
+| -------- | ---------------------------------------------- | ----------------------------------- |
+| **Stub** | Need fixed return values                       | `{ findAll: () => [mockData] }`     |
+| **Fake** | Need working simplified implementation         | `InMemoryRepository`                |
+| **Mock** | Need to verify a call was made (use sparingly) | `jest.fn()` with `toHaveBeenCalled` |
+
+### Why?
+
+- **Mocks verify implementation** → tests break on refactor
+- **Stubs/Fakes verify behavior** → tests survive refactor
+
+### Example
+
+```typescript
+// ❌ Avoid: mock that verifies implementation
+expect(repository.findById).toHaveBeenCalledWith("123");
+
+// ✅ Prefer: stub that enables behavior testing
+const stub = { findById: () => mockAccount };
+const result = await service.getAccount("123");
+expect(result.name).toBe("vitalik.eth");
+```
+
+Exception: Use mocks when the call itself IS the behavior (e.g., verifying an event was emitted, an email was sent).
+
+---
+
+## Rule 3: Arrange-Act-Assert (AAA) Pattern
+
+Structure every test using AAA for readability and consistency. **Do not write `// Arrange`, `// Act`, `// Assert` comments** — use blank lines to separate sections visually.
+
+### Structure
+
+```typescript
+it("should calculate delegation percentage", async () => {
+  const mockData = [createMockRow({ delegated: 100n, total: 1000n })];
+  stubRepository.getDelegationPercentage.mockResolvedValue(mockData);
+
+  const result = await service.execute({ dao: "uni" });
+
+  expect(result[0].percentage).toBe(10);
+});
+```
+
+---
+
+## Rule 4: Test Coverage Policy
+
+Write tests for all new business logic. There is no minimum coverage enforced in CI.
+
+### What must have tests:
+
+- Services and their business rules
+- Utility functions (`lib/`)
+- Calculations (voting power, percentages, etc.)
+- Data transformations (mappers)
+
+### What may not have tests:
+
+- Infrastructure/boilerplate code
+- UI components (nice-to-have, not required)
+- Configuration and wiring
+
+> **Philosophy:** High coverage doesn't mean well-tested code. 100% coverage with bad tests is worse than 60% coverage with meaningful tests.
+
+---
+
+## Rule 5: Test Happy Paths and Break Your Code
+
+Cover the **happy path** first, then actively try to break your code.
+
+### Mindset
+
+Don't just prove the code works — **try to break it**. Think like a malicious user or an unstable system.
+
+### Common edge cases to consider:
+
+| Category                 | Examples                                             |
+| ------------------------ | ---------------------------------------------------- |
+| **Empty values**         | `null`, `undefined`, `[]`, `""`, `{}`                |
+| **Zeros and boundaries** | `0`, `1`, `-1`, `MAX_INT`, overflow                  |
+| **Divisions**            | Division by zero, percentages > 100%                 |
+| **Dates**                | Future timestamps, distant past, midnight edge cases |
+| **Strings**              | Unicode, whitespace, special characters              |
+| **Concurrency**          | Missing data, unexpected order                       |
+
+### Example
+
+```typescript
+// ❌ Happy path only
+it("should calculate percentage", () => {
+  expect(calcPercentage(50, 100)).toBe(50);
+});
+
+// ✅ Happy path + trying to break it
+it("should calculate percentage", () => {
+  expect(calcPercentage(50, 100)).toBe(50);
+});
+
+it("should handle division by zero", () => {
+  expect(calcPercentage(50, 0)).toBe(0); // or throw?
+});
+
+it("should handle when value exceeds total", () => {
+  expect(calcPercentage(150, 100)).toBe(100); // cap? or 150?
+});
+```
+
+---
+
+## Rule 6: Deterministic Tests
+
+Write tests that produce the **same result every time**, in any environment, in any order.
+
+### Never depend on:
+
+- Execution order between tests
+- System date/time (`Date.now()`)
+- Data generated by other tests
+- Randomness without a fixed seed
+- Shared global state
+
+### How to handle dates
+
+```typescript
+// ❌ Non-deterministic
+const result = service.getRecentItems(); // uses Date.now() internally
+
+// ✅ Deterministic - mock the time
+beforeEach(() => {
+  jest.useFakeTimers();
+  jest.setSystemTime(new Date("2025-01-15T00:00:00Z"));
+});
+
+afterEach(() => {
+  jest.useRealTimers();
+});
+```
+
+### How to ensure isolation
+
+```typescript
+// ✅ Each test creates its own data
+it("should find account by id", () => {
+  const account = createAccount({ id: "test-123" });
+  // ...
+});
+
+// ❌ Depends on data created in another test
+it("should find the account", () => {
+  const account = repository.findById("test-123"); // created where?
+});
+```
+
+---
+
+## Useful Tools
+
+### 1. Testing HTTP (Hono)
+
+Use Hono's native test client:
+
+```ts
+import { testClient } from "hono/testing";
+import { app } from "../app";
+const client = testClient(app);
+
+it("should return proposals", async () => {
+  const res = await client.proposals.$get({
+    query: { dao: "uni", limit: "10" },
+  });
+  expect(res.status).toBe(200);
+  const data = await res.json();
+  expect(data.proposals).toHaveLength(10);
+});
+```
+
+### 2. Test Database
+
+Use Testcontainers for real PostgreSQL in Docker:
+
+```ts
+import { PostgreSqlContainer } from "@testcontainers/postgresql";
+
+let container: PostgreSqlContainer;
+
+beforeAll(async () => {
+  container = await new PostgreSqlContainer().start();
+  process.env.DATABASE_URL = container.getConnectionUri();
+  await runMigrations();
+});
+
+afterAll(async () => {
+  await container.stop();
+});
+```
+
+### 3. External APIs
+
+Use MSW (Mock Service Worker) to intercept HTTP requests:
+
+```ts
+import { setupServer } from "msw/node";
+import { http, HttpResponse } from "msw";
+
+const server = setupServer(
+  http.get("https://api.coingecko.com/api/v3/simple/price", () => {
+    return HttpResponse.json({
+      uniswap: { usd: 7.5 },
+    });
+  }),
+);
+
+beforeAll(() => server.listen());
+afterEach(() => server.resetHandlers());
+afterAll(() => server.close());
+```
+
+---
+
+## Important Patterns
+
+### 1. Test Data Builders / Factories
+
+```ts
+// factories/proposal.ts
+export function createProposal(overrides?: Partial<Proposal>): Proposal {
+  return {
+    id: randomId(),
+    dao: "uni",
+    title: "Test Proposal",
+    status: "active",
+    createdAt: new Date(),
+    ...overrides,
+  };
+}
+
+// In the test
+const proposal = createProposal({ status: "executed" });
+await db.insert(proposals).values(proposal);
+```
+
+### 2. Database Seeding
+
+```ts
+async function seedTestData() {
+  const account = createAccount({ address: "0x123" });
+  const proposal = createProposal({ dao: "uni" });
+  const vote = createVote({ proposalId: proposal.id, voter: account.address });
+
+  await db.insert(accounts).values(account);
+  await db.insert(proposals).values(proposal);
+  await db.insert(votes).values(vote);
+
+  return { account, proposal, vote };
+}
+```
diff --git a/.claude/skills/central-station b/.claude/skills/central-station
deleted file mode 120000
index bfd02112d..000000000
--- a/.claude/skills/central-station
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/central-station
\ No newline at end of file
diff --git a/.agents/skills/central-station/SKILL.md b/.claude/skills/central-station/SKILL.md
similarity index 100%
rename from .agents/skills/central-station/SKILL.md
rename to .claude/skills/central-station/SKILL.md
diff --git a/.agents/skills/central-station/references/environment-config.md b/.claude/skills/central-station/references/environment-config.md
similarity index 100%
rename from .agents/skills/central-station/references/environment-config.md
rename to .claude/skills/central-station/references/environment-config.md
diff --git a/.agents/skills/central-station/references/monorepo.md b/.claude/skills/central-station/references/monorepo.md
similarity index 100%
rename from .agents/skills/central-station/references/monorepo.md
rename to .claude/skills/central-station/references/monorepo.md
diff --git a/.agents/skills/central-station/references/railpack.md b/.claude/skills/central-station/references/railpack.md
similarity index 100%
rename from .agents/skills/central-station/references/railpack.md
rename to .claude/skills/central-station/references/railpack.md
diff --git a/.agents/skills/central-station/references/variables.md b/.claude/skills/central-station/references/variables.md
similarity index 100%
rename from .agents/skills/central-station/references/variables.md
rename to .claude/skills/central-station/references/variables.md
diff --git a/.claude/skills/database b/.claude/skills/database
deleted file mode 120000
index c50cf14f5..000000000
--- a/.claude/skills/database
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/database
\ No newline at end of file
diff --git a/.agents/skills/database/SKILL.md b/.claude/skills/database/SKILL.md
similarity index 100%
rename from .agents/skills/database/SKILL.md
rename to .claude/skills/database/SKILL.md
diff --git a/.agents/skills/database/references/environment-config.md b/.claude/skills/database/references/environment-config.md
similarity index 100%
rename from .agents/skills/database/references/environment-config.md
rename to .claude/skills/database/references/environment-config.md
diff --git a/.agents/skills/database/references/monorepo.md b/.claude/skills/database/references/monorepo.md
similarity index 100%
rename from .agents/skills/database/references/monorepo.md
rename to .claude/skills/database/references/monorepo.md
diff --git a/.agents/skills/database/references/railpack.md b/.claude/skills/database/references/railpack.md
similarity index 100%
rename from .agents/skills/database/references/railpack.md
rename to .claude/skills/database/references/railpack.md
diff --git a/.agents/skills/database/references/variables.md b/.claude/skills/database/references/variables.md
similarity index 100%
rename from .agents/skills/database/references/variables.md
rename to .claude/skills/database/references/variables.md
diff --git a/.agents/skills/database/scripts/railway-api.sh b/.claude/skills/database/scripts/railway-api.sh
similarity index 100%
rename from .agents/skills/database/scripts/railway-api.sh
rename to .claude/skills/database/scripts/railway-api.sh
diff --git a/.claude/skills/deploy b/.claude/skills/deploy
deleted file mode 120000
index 9714c3220..000000000
--- a/.claude/skills/deploy
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/deploy
\ No newline at end of file
diff --git a/.agents/skills/deploy/SKILL.md b/.claude/skills/deploy/SKILL.md
similarity index 100%
rename from .agents/skills/deploy/SKILL.md
rename to .claude/skills/deploy/SKILL.md
diff --git a/.agents/skills/deploy/references/environment-config.md b/.claude/skills/deploy/references/environment-config.md
similarity index 100%
rename from .agents/skills/deploy/references/environment-config.md
rename to .claude/skills/deploy/references/environment-config.md
diff --git a/.agents/skills/deploy/references/monorepo.md b/.claude/skills/deploy/references/monorepo.md
similarity index 100%
rename from .agents/skills/deploy/references/monorepo.md
rename to .claude/skills/deploy/references/monorepo.md
diff --git a/.agents/skills/deploy/references/railpack.md b/.claude/skills/deploy/references/railpack.md
similarity index 100%
rename from .agents/skills/deploy/references/railpack.md
rename to .claude/skills/deploy/references/railpack.md
diff --git a/.agents/skills/deploy/references/variables.md b/.claude/skills/deploy/references/variables.md
similarity index 100%
rename from .agents/skills/deploy/references/variables.md
rename to .claude/skills/deploy/references/variables.md
diff --git a/.claude/skills/deployment b/.claude/skills/deployment
deleted file mode 120000
index 7baf7cbf5..000000000
--- a/.claude/skills/deployment
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/deployment
\ No newline at end of file
diff --git a/.agents/skills/deployment/SKILL.md b/.claude/skills/deployment/SKILL.md
similarity index 100%
rename from .agents/skills/deployment/SKILL.md
rename to .claude/skills/deployment/SKILL.md
diff --git a/.agents/skills/deployment/references/environment-config.md b/.claude/skills/deployment/references/environment-config.md
similarity index 100%
rename from .agents/skills/deployment/references/environment-config.md
rename to .claude/skills/deployment/references/environment-config.md
diff --git a/.agents/skills/deployment/references/monorepo.md b/.claude/skills/deployment/references/monorepo.md
similarity index 100%
rename from .agents/skills/deployment/references/monorepo.md
rename to .claude/skills/deployment/references/monorepo.md
diff --git a/.agents/skills/deployment/references/railpack.md b/.claude/skills/deployment/references/railpack.md
similarity index 100%
rename from .agents/skills/deployment/references/railpack.md
rename to .claude/skills/deployment/references/railpack.md
diff --git a/.agents/skills/deployment/references/variables.md b/.claude/skills/deployment/references/variables.md
similarity index 100%
rename from .agents/skills/deployment/references/variables.md
rename to .claude/skills/deployment/references/variables.md
diff --git a/.claude/skills/domain b/.claude/skills/domain
deleted file mode 120000
index 200d1eb58..000000000
--- a/.claude/skills/domain
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/domain
\ No newline at end of file
diff --git a/.agents/skills/domain/SKILL.md b/.claude/skills/domain/SKILL.md
similarity index 100%
rename from .agents/skills/domain/SKILL.md
rename to .claude/skills/domain/SKILL.md
diff --git a/.agents/skills/domain/references/environment-config.md b/.claude/skills/domain/references/environment-config.md
similarity index 100%
rename from .agents/skills/domain/references/environment-config.md
rename to .claude/skills/domain/references/environment-config.md
diff --git a/.agents/skills/domain/references/monorepo.md b/.claude/skills/domain/references/monorepo.md
similarity index 100%
rename from .agents/skills/domain/references/monorepo.md
rename to .claude/skills/domain/references/monorepo.md
diff --git a/.agents/skills/domain/references/railpack.md b/.claude/skills/domain/references/railpack.md
similarity index 100%
rename from .agents/skills/domain/references/railpack.md
rename to .claude/skills/domain/references/railpack.md
diff --git a/.agents/skills/domain/references/variables.md b/.claude/skills/domain/references/variables.md
similarity index 100%
rename from .agents/skills/domain/references/variables.md
rename to .claude/skills/domain/references/variables.md
diff --git a/.claude/skills/environment b/.claude/skills/environment
deleted file mode 120000
index d57c0762e..000000000
--- a/.claude/skills/environment
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/environment
\ No newline at end of file
diff --git a/.agents/skills/environment/SKILL.md b/.claude/skills/environment/SKILL.md
similarity index 100%
rename from .agents/skills/environment/SKILL.md
rename to .claude/skills/environment/SKILL.md
diff --git a/.agents/skills/environment/references/environment-config.md b/.claude/skills/environment/references/environment-config.md
similarity index 100%
rename from .agents/skills/environment/references/environment-config.md
rename to .claude/skills/environment/references/environment-config.md
diff --git a/.agents/skills/environment/references/monorepo.md b/.claude/skills/environment/references/monorepo.md
similarity index 100%
rename from .agents/skills/environment/references/monorepo.md
rename to .claude/skills/environment/references/monorepo.md
diff --git a/.agents/skills/environment/references/railpack.md b/.claude/skills/environment/references/railpack.md
similarity index 100%
rename from .agents/skills/environment/references/railpack.md
rename to .claude/skills/environment/references/railpack.md
diff --git a/.agents/skills/environment/references/variables.md b/.claude/skills/environment/references/variables.md
similarity index 100%
rename from .agents/skills/environment/references/variables.md
rename to .claude/skills/environment/references/variables.md
diff --git a/.claude/skills/metrics b/.claude/skills/metrics
deleted file mode 120000
index 40c171f4a..000000000
--- a/.claude/skills/metrics
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/metrics
\ No newline at end of file
diff --git a/.agents/skills/metrics/SKILL.md b/.claude/skills/metrics/SKILL.md
similarity index 100%
rename from .agents/skills/metrics/SKILL.md
rename to .claude/skills/metrics/SKILL.md
diff --git a/.agents/skills/metrics/references/environment-config.md b/.claude/skills/metrics/references/environment-config.md
similarity index 100%
rename from .agents/skills/metrics/references/environment-config.md
rename to .claude/skills/metrics/references/environment-config.md
diff --git a/.agents/skills/metrics/references/monorepo.md b/.claude/skills/metrics/references/monorepo.md
similarity index 100%
rename from .agents/skills/metrics/references/monorepo.md
rename to .claude/skills/metrics/references/monorepo.md
diff --git a/.agents/skills/metrics/references/railpack.md b/.claude/skills/metrics/references/railpack.md
similarity index 100%
rename from .agents/skills/metrics/references/railpack.md
rename to .claude/skills/metrics/references/railpack.md
diff --git a/.agents/skills/metrics/references/variables.md b/.claude/skills/metrics/references/variables.md
similarity index 100%
rename from .agents/skills/metrics/references/variables.md
rename to .claude/skills/metrics/references/variables.md
diff --git a/.agents/skills/metrics/scripts/railway-api.sh b/.claude/skills/metrics/scripts/railway-api.sh
similarity index 100%
rename from .agents/skills/metrics/scripts/railway-api.sh
rename to .claude/skills/metrics/scripts/railway-api.sh
diff --git a/.claude/skills/new b/.claude/skills/new
deleted file mode 120000
index 20a10b8bf..000000000
--- a/.claude/skills/new
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/new
\ No newline at end of file
diff --git a/.agents/skills/new/SKILL.md b/.claude/skills/new/SKILL.md
similarity index 100%
rename from .agents/skills/new/SKILL.md
rename to .claude/skills/new/SKILL.md
diff --git a/.agents/skills/new/references/environment-config.md b/.claude/skills/new/references/environment-config.md
similarity index 100%
rename from .agents/skills/new/references/environment-config.md
rename to .claude/skills/new/references/environment-config.md
diff --git a/.agents/skills/new/references/monorepo.md b/.claude/skills/new/references/monorepo.md
similarity index 100%
rename from .agents/skills/new/references/monorepo.md
rename to .claude/skills/new/references/monorepo.md
diff --git a/.agents/skills/new/references/railpack.md b/.claude/skills/new/references/railpack.md
similarity index 100%
rename from .agents/skills/new/references/railpack.md
rename to .claude/skills/new/references/railpack.md
diff --git a/.agents/skills/new/references/variables.md b/.claude/skills/new/references/variables.md
similarity index 100%
rename from .agents/skills/new/references/variables.md
rename to .claude/skills/new/references/variables.md
diff --git a/.claude/skills/next-best-practices/SKILL.md b/.claude/skills/next-best-practices/SKILL.md
new file mode 100644
index 000000000..3d5e68693
--- /dev/null
+++ b/.claude/skills/next-best-practices/SKILL.md
@@ -0,0 +1,171 @@
+---
+name: next-best-practices
+description: Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization, bundling
+user-invocable: false
+---
+
+# Next.js Best Practices
+
+Apply these rules when writing or reviewing Next.js code.
+
+## File Conventions
+
+See [file-conventions.md](./file-conventions.md) for:
+
+- Project structure and special files
+- Route segments (dynamic, catch-all, groups)
+- Parallel and intercepting routes
+- Middleware rename in v16 (middleware → proxy)
+
+## RSC Boundaries
+
+Detect invalid React Server Component patterns.
+
+See [rsc-boundaries.md](./rsc-boundaries.md) for:
+
+- Async client component detection (invalid)
+- Non-serializable props detection
+- Server Action exceptions
+
+## Async Patterns
+
+Next.js 15+ async API changes.
+
+See [async-patterns.md](./async-patterns.md) for:
+
+- Async `params` and `searchParams`
+- Async `cookies()` and `headers()`
+- Migration codemod
+
+## Runtime Selection
+
+See [runtime-selection.md](./runtime-selection.md) for:
+
+- Default to Node.js runtime
+- When Edge runtime is appropriate
+
+## Directives
+
+See [directives.md](./directives.md) for:
+
+- `'use client'`, `'use server'` (React)
+- `'use cache'` (Next.js)
+
+## Functions
+
+See [functions.md](./functions.md) for:
+
+- Navigation hooks: `useRouter`, `usePathname`, `useSearchParams`, `useParams`
+- Server functions: `cookies`, `headers`, `draftMode`, `after`
+- Generate functions: `generateStaticParams`, `generateMetadata`
+
+## Error Handling
+
+See [error-handling.md](./error-handling.md) for:
+
+- `error.tsx`, `global-error.tsx`, `not-found.tsx`
+- `redirect`, `permanentRedirect`, `notFound`
+- `forbidden`, `unauthorized` (auth errors)
+- `unstable_rethrow` for catch blocks
+
+## Data Patterns
+
+See [data-patterns.md](./data-patterns.md) for:
+
+- Server Components vs Server Actions vs Route Handlers
+- Avoiding data waterfalls (`Promise.all`, Suspense, preload)
+- Client component data fetching
+
+## Route Handlers
+
+See [route-handlers.md](./route-handlers.md) for:
+
+- `route.ts` basics
+- GET handler conflicts with `page.tsx`
+- Environment behavior (no React DOM)
+- When to use vs Server Actions
+
+## Metadata & OG Images
+
+See [metadata.md](./metadata.md) for:
+
+- Static and dynamic metadata
+- `generateMetadata` function
+- OG image generation with `next/og`
+- File-based metadata conventions
+
+## Image Optimization
+
+See [image.md](./image.md) for:
+
+- Always use `next/image` over `<img>`
+- Remote images configuration
+- Responsive `sizes` attribute
+- Blur placeholders
+- Priority loading for LCP
+
+## Font Optimization
+
+See [font.md](./font.md) for:
+
+- `next/font` setup
+- Google Fonts, local fonts
+- Tailwind CSS integration
+- Preloading subsets
+
+## Bundling
+
+See [bundling.md](./bundling.md) for:
+
+- Server-incompatible packages
+- CSS imports (not link tags)
+- Polyfills (already included)
+- ESM/CommonJS issues
+- Bundle analysis
+
+## Scripts
+
+See [scripts.md](./scripts.md) for:
+
+- `next/script` vs native script tags
+- Inline scripts need `id`
+- Loading strategies
+- Google Analytics with `@next/third-parties`
+
+## Hydration Errors
+
+See [hydration-error.md](./hydration-error.md) for:
+
+- Common causes (browser APIs, dates, invalid HTML)
+- Debugging with error overlay
+- Fixes for each cause
+
+## Suspense Boundaries
+
+See [suspense-boundaries.md](./suspense-boundaries.md) for:
+
+- CSR bailout with `useSearchParams` and `usePathname`
+- Which hooks require Suspense boundaries
+
+## Parallel & Intercepting Routes
+
+See [parallel-routes.md](./parallel-routes.md) for:
+
+- Modal patterns with `@slot` and `(.)` interceptors
+- `default.tsx` for fallbacks
+- Closing modals correctly with `router.back()`
+
+## Self-Hosting
+
+See [self-hosting.md](./self-hosting.md) for:
+
+- `output: 'standalone'` for Docker
+- Cache handlers for multi-instance ISR
+- What works vs needs extra setup
+
+## Debug Tricks
+
+See [debug-tricks.md](./debug-tricks.md) for:
+
+- MCP endpoint for AI-assisted debugging
+- Rebuild specific routes with `--debug-build-paths`
diff --git a/.claude/skills/next-best-practices/async-patterns.md b/.claude/skills/next-best-practices/async-patterns.md
new file mode 100644
index 000000000..0d5f91494
--- /dev/null
+++ b/.claude/skills/next-best-practices/async-patterns.md
@@ -0,0 +1,87 @@
+# Async Patterns
+
+In Next.js 15+, `params`, `searchParams`, `cookies()`, and `headers()` are asynchronous.
+
+## Async Params and SearchParams
+
+Always type them as `Promise<...>` and await them.
+
+### Pages and Layouts
+
+```tsx
+type Props = { params: Promise<{ slug: string }> };
+
+export default async function Page({ params }: Props) {
+  const { slug } = await params;
+}
+```
+
+### Route Handlers
+
+```tsx
+export async function GET(
+  request: Request,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  const { id } = await params;
+}
+```
+
+### SearchParams
+
+```tsx
+type Props = {
+  params: Promise<{ slug: string }>;
+  searchParams: Promise<{ query?: string }>;
+};
+
+export default async function Page({ params, searchParams }: Props) {
+  const { slug } = await params;
+  const { query } = await searchParams;
+}
+```
+
+### Synchronous Components
+
+Use `React.use()` for non-async components:
+
+```tsx
+import { use } from "react";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export default function Page({ params }: Props) {
+  const { slug } = use(params);
+}
+```
+
+### generateMetadata
+
+```tsx
+type Props = { params: Promise<{ slug: string }> };
+
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { slug } = await params;
+  return { title: slug };
+}
+```
+
+## Async Cookies and Headers
+
+```tsx
+import { cookies, headers } from "next/headers";
+
+export default async function Page() {
+  const cookieStore = await cookies();
+  const headersList = await headers();
+
+  const theme = cookieStore.get("theme");
+  const userAgent = headersList.get("user-agent");
+}
+```
+
+## Migration Codemod
+
+```bash
+npx @next/codemod@latest next-async-request-api .
+```
diff --git a/.claude/skills/next-best-practices/bundling.md b/.claude/skills/next-best-practices/bundling.md
new file mode 100644
index 000000000..4d09f56be
--- /dev/null
+++ b/.claude/skills/next-best-practices/bundling.md
@@ -0,0 +1,182 @@
+# Bundling
+
+Fix common bundling issues with third-party packages.
+
+## Server-Incompatible Packages
+
+Some packages use browser APIs (`window`, `document`, `localStorage`) and fail in Server Components.
+
+### Error Signs
+
+```
+ReferenceError: window is not defined
+ReferenceError: document is not defined
+ReferenceError: localStorage is not defined
+Module not found: Can't resolve 'fs'
+```
+
+### Solution 1: Mark as Client-Only
+
+If the package is only needed on client:
+
+```tsx
+// Bad: Fails - package uses window
+import SomeChart from "some-chart-library";
+
+export default function Page() {
+  return <SomeChart />;
+}
+
+// Good: Use dynamic import with ssr: false
+import dynamic from "next/dynamic";
+
+const SomeChart = dynamic(() => import("some-chart-library"), {
+  ssr: false,
+});
+
+export default function Page() {
+  return <SomeChart />;
+}
+```
+
+### Solution 2: Externalize from Server Bundle
+
+For packages that should run on server but have bundling issues:
+
+```js
+// next.config.js
+module.exports = {
+  serverExternalPackages: ["problematic-package"],
+};
+```
+
+Use this for:
+
+- Packages with native bindings (sharp, bcrypt)
+- Packages that don't bundle well (some ORMs)
+- Packages with circular dependencies
+
+### Solution 3: Client Component Wrapper
+
+Wrap the entire usage in a client component:
+
+```tsx
+// components/ChartWrapper.tsx
+"use client";
+
+import { Chart } from "chart-library";
+
+export function ChartWrapper(props) {
+  return <Chart {...props} />;
+}
+
+// app/page.tsx (server component)
+import { ChartWrapper } from "@/components/ChartWrapper";
+
+export default function Page() {
+  return <ChartWrapper data={data} />;
+}
+```
+
+## CSS Imports
+
+Import CSS files instead of using `<link>` tags. Next.js handles bundling and optimization.
+
+```tsx
+// Bad: Manual link tag
+<link rel="stylesheet" href="/styles.css" />;
+
+// Good: Import CSS
+import "./styles.css";
+
+// Good: CSS Modules
+import styles from "./Button.module.css";
+```
+
+## Polyfills
+
+Next.js includes common polyfills automatically. Don't load redundant ones from polyfill.io or similar CDNs.
+
+Already included: `Array.from`, `Object.assign`, `Promise`, `fetch`, `Map`, `Set`, `Symbol`, `URLSearchParams`, and 50+ others.
+
+```tsx
+// Bad: Redundant polyfills
+<script src="https://polyfill.io/v3/polyfill.min.js?features=fetch,Promise,Array.from" />
+
+// Good: Next.js includes these automatically
+```
+
+## ESM/CommonJS Issues
+
+### Error Signs
+
+```
+SyntaxError: Cannot use import statement outside a module
+Error: require() of ES Module
+Module not found: ESM packages need to be imported
+```
+
+### Solution: Transpile Package
+
+```js
+// next.config.js
+module.exports = {
+  transpilePackages: ["some-esm-package", "another-package"],
+};
+```
+
+## Common Problematic Packages
+
+| Package         | Issue           | Solution                                                        |
+| --------------- | --------------- | --------------------------------------------------------------- |
+| `sharp`         | Native bindings | `serverExternalPackages: ['sharp']`                             |
+| `bcrypt`        | Native bindings | `serverExternalPackages: ['bcrypt']` or use `bcryptjs`          |
+| `canvas`        | Native bindings | `serverExternalPackages: ['canvas']`                            |
+| `recharts`      | Uses window     | `dynamic(() => import('recharts'), { ssr: false })`             |
+| `react-quill`   | Uses document   | `dynamic(() => import('react-quill'), { ssr: false })`          |
+| `mapbox-gl`     | Uses window     | `dynamic(() => import('mapbox-gl'), { ssr: false })`            |
+| `monaco-editor` | Uses window     | `dynamic(() => import('@monaco-editor/react'), { ssr: false })` |
+| `lottie-web`    | Uses document   | `dynamic(() => import('lottie-react'), { ssr: false })`         |
+
+## Bundle Analysis
+
+Analyze bundle size with the built-in analyzer (Next.js 16.1+):
+
+```bash
+next experimental-analyze
+```
+
+This opens an interactive UI to:
+
+- Filter by route, environment (client/server), and type
+- Inspect module sizes and import chains
+- View treemap visualization
+
+Save output for comparison:
+
+```bash
+next experimental-analyze --output
+# Output saved to .next/diagnostics/analyze
+```
+
+Reference: https://nextjs.org/docs/app/guides/package-bundling
+
+## Migrating from Webpack to Turbopack
+
+Turbopack is the default bundler in Next.js 15+. If you have custom webpack config, migrate to Turbopack-compatible alternatives:
+
+```js
+// next.config.js
+module.exports = {
+  // Good: Works with Turbopack
+  serverExternalPackages: ["package"],
+  transpilePackages: ["package"],
+
+  // Bad: Webpack-only - migrate away from this
+  webpack: (config) => {
+    // custom webpack config
+  },
+};
+```
+
+Reference: https://nextjs.org/docs/app/building-your-application/upgrading/from-webpack-to-turbopack
diff --git a/.claude/skills/next-best-practices/data-patterns.md b/.claude/skills/next-best-practices/data-patterns.md
new file mode 100644
index 000000000..827ef75fa
--- /dev/null
+++ b/.claude/skills/next-best-practices/data-patterns.md
@@ -0,0 +1,306 @@
+# Data Patterns
+
+Choose the right data fetching pattern for each use case.
+
+## Decision Tree
+
+```
+Need to fetch data?
+├── From a Server Component?
+│   └── Use: Fetch directly (no API needed)
+│
+├── From a Client Component?
+│   ├── Is it a mutation (POST/PUT/DELETE)?
+│   │   └── Use: Server Action
+│   └── Is it a read (GET)?
+│       └── Use: Route Handler OR pass from Server Component
+│
+├── Need external API access (webhooks, third parties)?
+│   └── Use: Route Handler
+│
+└── Need REST API for mobile app / external clients?
+    └── Use: Route Handler
+```
+
+## Pattern 1: Server Components (Preferred for Reads)
+
+Fetch data directly in Server Components - no API layer needed.
+
+```tsx
+// app/users/page.tsx
+async function UsersPage() {
+  // Direct database access - no API round-trip
+  const users = await db.user.findMany();
+
+  // Or fetch from external API
+  const posts = await fetch("https://api.example.com/posts").then((r) =>
+    r.json(),
+  );
+
+  return (
+    <ul>
+      {users.map((user) => (
+        <li key={user.id}>{user.name}</li>
+      ))}
+    </ul>
+  );
+}
+```
+
+**Benefits**:
+
+- No API to maintain
+- No client-server waterfall
+- Secrets stay on server
+- Direct database access
+
+## Pattern 2: Server Actions (Preferred for Mutations)
+
+Server Actions are the recommended way to handle mutations.
+
+```tsx
+// app/actions.ts
+"use server";
+
+import { revalidatePath } from "next/cache";
+
+export async function createPost(formData: FormData) {
+  const title = formData.get("title") as string;
+
+  await db.post.create({ data: { title } });
+
+  revalidatePath("/posts");
+}
+
+export async function deletePost(id: string) {
+  await db.post.delete({ where: { id } });
+
+  revalidateTag("posts");
+}
+```
+
+```tsx
+// app/posts/new/page.tsx
+import { createPost } from "@/app/actions";
+
+export default function NewPost() {
+  return (
+    <form action={createPost}>
+      <input name="title" required />
+      <button type="submit">Create</button>
+    </form>
+  );
+}
+```
+
+**Benefits**:
+
+- End-to-end type safety
+- Progressive enhancement (works without JS)
+- Automatic request handling
+- Integrated with React transitions
+
+**Constraints**:
+
+- POST only (no GET caching semantics)
+- Internal use only (no external access)
+- Cannot return non-serializable data
+
+## Pattern 3: Route Handlers (APIs)
+
+Use Route Handlers when you need a REST API.
+
+```tsx
+// app/api/posts/route.ts
+import { NextRequest, NextResponse } from "next/server";
+
+// GET is cacheable
+export async function GET(request: NextRequest) {
+  const posts = await db.post.findMany();
+  return NextResponse.json(posts);
+}
+
+// POST for mutations
+export async function POST(request: NextRequest) {
+  const body = await request.json();
+  const post = await db.post.create({ data: body });
+  return NextResponse.json(post, { status: 201 });
+}
+```
+
+**When to use**:
+
+- External API access (mobile apps, third parties)
+- Webhooks from external services
+- GET endpoints that need HTTP caching
+- OpenAPI/Swagger documentation needed
+
+**When NOT to use**:
+
+- Internal data fetching (use Server Components)
+- Mutations from your UI (use Server Actions)
+
+## Avoiding Data Waterfalls
+
+### Problem: Sequential Fetches
+
+```tsx
+// Bad: Sequential waterfalls
+async function Dashboard() {
+  const user = await getUser(); // Wait...
+  const posts = await getPosts(); // Then wait...
+  const comments = await getComments(); // Then wait...
+
+  return <div>...</div>;
+}
+```
+
+### Solution 1: Parallel Fetching with Promise.all
+
+```tsx
+// Good: Parallel fetching
+async function Dashboard() {
+  const [user, posts, comments] = await Promise.all([
+    getUser(),
+    getPosts(),
+    getComments(),
+  ]);
+
+  return <div>...</div>;
+}
+```
+
+### Solution 2: Streaming with Suspense
+
+```tsx
+// Good: Show content progressively
+import { Suspense } from "react";
+
+async function Dashboard() {
+  return (
+    <div>
+      <Suspense fallback={<UserSkeleton />}>
+        <UserSection />
+      </Suspense>
+      <Suspense fallback={<PostsSkeleton />}>
+        <PostsSection />
+      </Suspense>
+    </div>
+  );
+}
+
+async function UserSection() {
+  const user = await getUser(); // Fetches independently
+  return <div>{user.name}</div>;
+}
+
+async function PostsSection() {
+  const posts = await getPosts(); // Fetches independently
+  return <PostList posts={posts} />;
+}
+```
+
+### Solution 3: Preload Pattern
+
+```tsx
+// lib/data.ts
+import { cache } from "react";
+
+export const getUser = cache(async (id: string) => {
+  return db.user.findUnique({ where: { id } });
+});
+
+export const preloadUser = (id: string) => {
+  void getUser(id); // Fire and forget
+};
+```
+
+```tsx
+// app/user/[id]/page.tsx
+import { getUser, preloadUser } from "@/lib/data";
+
+export default async function UserPage({ params }) {
+  const { id } = await params;
+
+  // Start fetching early
+  preloadUser(id);
+
+  // Do other work...
+
+  // Data likely ready by now
+  const user = await getUser(id);
+  return <div>{user.name}</div>;
+}
+```
+
+## Client Component Data Fetching
+
+When Client Components need data:
+
+### Option 1: Pass from Server Component (Preferred)
+
+```tsx
+// Server Component
+async function Page() {
+  const data = await fetchData();
+  return <ClientComponent initialData={data} />;
+}
+
+// Client Component
+("use client");
+function ClientComponent({ initialData }) {
+  const [data, setData] = useState(initialData);
+  // ...
+}
+```
+
+### Option 2: Fetch on Mount (When Necessary)
+
+```tsx
+"use client";
+import { useEffect, useState } from "react";
+
+function ClientComponent() {
+  const [data, setData] = useState(null);
+
+  useEffect(() => {
+    fetch("/api/data")
+      .then((r) => r.json())
+      .then(setData);
+  }, []);
+
+  if (!data) return <Loading />;
+  return <div>{data.value}</div>;
+}
+```
+
+### Option 3: Server Action for Reads (Works But Not Ideal)
+
+Server Actions can be called from Client Components for reads, but this is not their intended purpose:
+
+```tsx
+"use client";
+import { getData } from "./actions";
+import { useEffect, useState } from "react";
+
+function ClientComponent() {
+  const [data, setData] = useState(null);
+
+  useEffect(() => {
+    getData().then(setData);
+  }, []);
+
+  return <div>{data?.value}</div>;
+}
+```
+
+**Note**: Server Actions always use POST, so no HTTP caching. Prefer Route Handlers for cacheable reads.
+
+## Quick Reference
+
+| Pattern                | Use Case                    | HTTP Method | Caching              |
+| ---------------------- | --------------------------- | ----------- | -------------------- |
+| Server Component fetch | Internal reads              | Any         | Full Next.js caching |
+| Server Action          | Mutations, form submissions | POST only   | No                   |
+| Route Handler          | External APIs, webhooks     | Any         | GET can be cached    |
+| Client fetch to API    | Client-side reads           | Any         | HTTP cache headers   |
diff --git a/.claude/skills/next-best-practices/debug-tricks.md b/.claude/skills/next-best-practices/debug-tricks.md
new file mode 100644
index 000000000..465824a8f
--- /dev/null
+++ b/.claude/skills/next-best-practices/debug-tricks.md
@@ -0,0 +1,125 @@
+# Debug Tricks
+
+Tricks to speed up debugging Next.js applications.
+
+## MCP Endpoint (Dev Server)
+
+Next.js exposes a `/_next/mcp` endpoint in development for AI-assisted debugging via MCP (Model Context Protocol).
+
+- **Next.js 16+**: Enabled by default, use `next-devtools-mcp`
+- **Next.js < 16**: Requires `experimental.mcpServer: true` in next.config.js
+
+Reference: https://nextjs.org/docs/app/guides/mcp
+
+**Important**: Find the actual port of the running Next.js dev server (check terminal output or `package.json` scripts). Don't assume port 3000.
+
+### Request Format
+
+The endpoint uses JSON-RPC 2.0 over HTTP POST:
+
+```bash
+curl -X POST http://localhost:<port>/_next/mcp \
+  -H "Content-Type: application/json" \
+  -H "Accept: application/json, text/event-stream" \
+  -d '{
+    "jsonrpc": "2.0",
+    "id": "1",
+    "method": "tools/call",
+    "params": {
+      "name": "<tool-name>",
+      "arguments": {}
+    }
+  }'
+```
+
+### Available Tools
+
+#### `get_errors`
+
+Get current errors from dev server (build errors, runtime errors with source-mapped stacks):
+
+```json
+{ "name": "get_errors", "arguments": {} }
+```
+
+#### `get_routes`
+
+Discover all routes by scanning filesystem:
+
+```json
+{ "name": "get_routes", "arguments": {} }
+// Optional: { "name": "get_routes", "arguments": { "routerType": "app" } }
+```
+
+Returns: `{ "appRouter": ["/", "/api/users/[id]", ...], "pagesRouter": [...] }`
+
+#### `get_project_metadata`
+
+Get project path and dev server URL:
+
+```json
+{ "name": "get_project_metadata", "arguments": {} }
+```
+
+Returns: `{ "projectPath": "/path/to/project", "devServerUrl": "http://localhost:3000" }`
+
+#### `get_page_metadata`
+
+Get runtime metadata about current page render (requires active browser session):
+
+```json
+{ "name": "get_page_metadata", "arguments": {} }
+```
+
+Returns segment trie data showing layouts, boundaries, and page components.
+
+#### `get_logs`
+
+Get path to Next.js development log file:
+
+```json
+{ "name": "get_logs", "arguments": {} }
+```
+
+Returns path to `<distDir>/logs/next-development.log`
+
+#### `get_server_action_by_id`
+
+Locate a Server Action by ID:
+
+```json
+{
+  "name": "get_server_action_by_id",
+  "arguments": { "actionId": "<action-id>" }
+}
+```
+
+### Example: Get Errors
+
+```bash
+curl -X POST http://localhost:<port>/_next/mcp \
+  -H "Content-Type: application/json" \
+  -H "Accept: application/json, text/event-stream" \
+  -d '{"jsonrpc":"2.0","id":"1","method":"tools/call","params":{"name":"get_errors","arguments":{}}}'
+```
+
+## Rebuild Specific Routes (Next.js 16+)
+
+Use `--debug-build-paths` to rebuild only specific routes instead of the entire app:
+
+```bash
+# Rebuild a specific route
+next build --debug-build-paths "/dashboard"
+
+# Rebuild routes matching a glob
+next build --debug-build-paths "/api/*"
+
+# Dynamic routes
+next build --debug-build-paths "/blog/[slug]"
+```
+
+Use this to:
+
+- Quickly verify a build fix without full rebuild
+- Debug static generation issues for specific pages
+- Iterate faster on build errors
diff --git a/.claude/skills/next-best-practices/directives.md b/.claude/skills/next-best-practices/directives.md
new file mode 100644
index 000000000..2ed949442
--- /dev/null
+++ b/.claude/skills/next-best-practices/directives.md
@@ -0,0 +1,74 @@
+# Directives
+
+## React Directives
+
+These are React directives, not Next.js specific.
+
+### `'use client'`
+
+Marks a component as a Client Component. Required for:
+
+- React hooks (`useState`, `useEffect`, etc.)
+- Event handlers (`onClick`, `onChange`)
+- Browser APIs (`window`, `localStorage`)
+
+```tsx
+"use client";
+
+import { useState } from "react";
+
+export function Counter() {
+  const [count, setCount] = useState(0);
+  return <button onClick={() => setCount(count + 1)}>{count}</button>;
+}
+```
+
+Reference: https://react.dev/reference/rsc/use-client
+
+### `'use server'`
+
+Marks a function as a Server Action. Can be passed to Client Components.
+
+```tsx
+"use server";
+
+export async function submitForm(formData: FormData) {
+  // Runs on server
+}
+```
+
+Or inline within a Server Component:
+
+```tsx
+export default function Page() {
+  async function submit() {
+    "use server";
+    // Runs on server
+  }
+  return <form action={submit}>...</form>;
+}
+```
+
+Reference: https://react.dev/reference/rsc/use-server
+
+---
+
+## Next.js Directive
+
+### `'use cache'`
+
+Marks a function or component for caching. Part of Next.js Cache Components.
+
+```tsx
+"use cache";
+
+export async function getCachedData() {
+  return await fetchData();
+}
+```
+
+Requires `cacheComponents: true` in `next.config.ts`.
+
+For detailed usage including cache profiles, `cacheLife()`, `cacheTag()`, and `updateTag()`, see the `next-cache-components` skill.
+
+Reference: https://nextjs.org/docs/app/api-reference/directives/use-cache
diff --git a/.claude/skills/next-best-practices/error-handling.md b/.claude/skills/next-best-practices/error-handling.md
new file mode 100644
index 000000000..4d32e8f9e
--- /dev/null
+++ b/.claude/skills/next-best-practices/error-handling.md
@@ -0,0 +1,232 @@
+# Error Handling
+
+Handle errors gracefully in Next.js applications.
+
+Reference: https://nextjs.org/docs/app/getting-started/error-handling
+
+## Error Boundaries
+
+### `error.tsx`
+
+Catches errors in a route segment and its children:
+
+```tsx
+"use client";
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  return (
+    <div>
+      <h2>Something went wrong!</h2>
+      <button onClick={() => reset()}>Try again</button>
+    </div>
+  );
+}
+```
+
+**Important:** `error.tsx` must be a Client Component.
+
+### `global-error.tsx`
+
+Catches errors in root layout:
+
+```tsx
+"use client";
+
+export default function GlobalError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  return (
+    <html>
+      <body>
+        <h2>Something went wrong!</h2>
+        <button onClick={() => reset()}>Try again</button>
+      </body>
+    </html>
+  );
+}
+```
+
+**Important:** Must include `<html>` and `<body>` tags.
+
+## Server Actions: Navigation API Gotcha
+
+**Do NOT wrap navigation APIs in try-catch.** They throw special errors that Next.js handles internally.
+
+Reference: https://nextjs.org/docs/app/api-reference/functions/redirect#behavior
+
+```tsx
+'use server'
+
+import { redirect } from 'next/navigation'
+import { notFound } from 'next/navigation'
+
+// Bad: try-catch catches the navigation "error"
+async function createPost(formData: FormData) {
+  try {
+    const post = await db.post.create({ ... })
+    redirect(`/posts/${post.id}`)  // This throws!
+  } catch (error) {
+    // redirect() throw is caught here - navigation fails!
+    return { error: 'Failed to create post' }
+  }
+}
+
+// Good: Call navigation APIs outside try-catch
+async function createPost(formData: FormData) {
+  let post
+  try {
+    post = await db.post.create({ ... })
+  } catch (error) {
+    return { error: 'Failed to create post' }
+  }
+  redirect(`/posts/${post.id}`)  // Outside try-catch
+}
+
+// Good: Re-throw navigation errors
+async function createPost(formData: FormData) {
+  try {
+    const post = await db.post.create({ ... })
+    redirect(`/posts/${post.id}`)
+  } catch (error) {
+    if (error instanceof Error && error.message === 'NEXT_REDIRECT') {
+      throw error  // Re-throw navigation errors
+    }
+    return { error: 'Failed to create post' }
+  }
+}
+```
+
+Same applies to:
+
+- `redirect()` - 307 temporary redirect
+- `permanentRedirect()` - 308 permanent redirect
+- `notFound()` - 404 not found
+- `forbidden()` - 403 forbidden
+- `unauthorized()` - 401 unauthorized
+
+Use `unstable_rethrow()` to re-throw these errors in catch blocks:
+
+```tsx
+import { unstable_rethrow } from "next/navigation";
+
+async function action() {
+  try {
+    // ...
+    redirect("/success");
+  } catch (error) {
+    unstable_rethrow(error); // Re-throws Next.js internal errors
+    return { error: "Something went wrong" };
+  }
+}
+```
+
+## Redirects
+
+```tsx
+import { redirect, permanentRedirect } from "next/navigation";
+
+// 307 Temporary - use for most cases
+redirect("/new-path");
+
+// 308 Permanent - use for URL migrations (cached by browsers)
+permanentRedirect("/new-url");
+```
+
+## Auth Errors
+
+Trigger auth-related error pages:
+
+```tsx
+import { forbidden, unauthorized } from "next/navigation";
+
+async function Page() {
+  const session = await getSession();
+
+  if (!session) {
+    unauthorized(); // Renders unauthorized.tsx (401)
+  }
+
+  if (!session.hasAccess) {
+    forbidden(); // Renders forbidden.tsx (403)
+  }
+
+  return <Dashboard />;
+}
+```
+
+Create corresponding error pages:
+
+```tsx
+// app/forbidden.tsx
+export default function Forbidden() {
+  return <div>You don't have access to this resource</div>;
+}
+
+// app/unauthorized.tsx
+export default function Unauthorized() {
+  return <div>Please log in to continue</div>;
+}
+```
+
+## Not Found
+
+### `not-found.tsx`
+
+Custom 404 page for a route segment:
+
+```tsx
+export default function NotFound() {
+  return (
+    <div>
+      <h2>Not Found</h2>
+      <p>Could not find the requested resource</p>
+    </div>
+  );
+}
+```
+
+### Triggering Not Found
+
+```tsx
+import { notFound } from "next/navigation";
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const post = await getPost(id);
+
+  if (!post) {
+    notFound(); // Renders closest not-found.tsx
+  }
+
+  return <div>{post.title}</div>;
+}
+```
+
+## Error Hierarchy
+
+Errors bubble up to the nearest error boundary:
+
+```
+app/
+├── error.tsx           # Catches errors from all children
+├── blog/
+│   ├── error.tsx       # Catches errors in /blog/*
+│   └── [slug]/
+│       ├── error.tsx   # Catches errors in /blog/[slug]
+│       └── page.tsx
+└── layout.tsx          # Errors here go to global-error.tsx
+```
diff --git a/.claude/skills/next-best-practices/file-conventions.md b/.claude/skills/next-best-practices/file-conventions.md
new file mode 100644
index 000000000..ef2ce9335
--- /dev/null
+++ b/.claude/skills/next-best-practices/file-conventions.md
@@ -0,0 +1,141 @@
+# File Conventions
+
+Next.js App Router uses file-based routing with special file conventions.
+
+## Project Structure
+
+Reference: https://nextjs.org/docs/app/getting-started/project-structure
+
+```
+app/
+├── layout.tsx          # Root layout (required)
+├── page.tsx            # Home page (/)
+├── loading.tsx         # Loading UI
+├── error.tsx           # Error UI
+├── not-found.tsx       # 404 UI
+├── global-error.tsx    # Global error UI
+├── route.ts            # API endpoint
+├── template.tsx        # Re-rendered layout
+├── default.tsx         # Parallel route fallback
+├── blog/
+│   ├── page.tsx        # /blog
+│   └── [slug]/
+│       └── page.tsx    # /blog/:slug
+└── (group)/            # Route group (no URL impact)
+    └── page.tsx
+```
+
+## Special Files
+
+| File            | Purpose                                  |
+| --------------- | ---------------------------------------- |
+| `page.tsx`      | UI for a route segment                   |
+| `layout.tsx`    | Shared UI for segment and children       |
+| `loading.tsx`   | Loading UI (Suspense boundary)           |
+| `error.tsx`     | Error UI (Error boundary)                |
+| `not-found.tsx` | 404 UI                                   |
+| `route.ts`      | API endpoint                             |
+| `template.tsx`  | Like layout but re-renders on navigation |
+| `default.tsx`   | Fallback for parallel routes             |
+
+## Route Segments
+
+```
+app/
+├── blog/               # Static segment: /blog
+├── [slug]/             # Dynamic segment: /:slug
+├── [...slug]/          # Catch-all: /a/b/c
+├── [[...slug]]/        # Optional catch-all: / or /a/b/c
+└── (marketing)/        # Route group (ignored in URL)
+```
+
+## Parallel Routes
+
+```
+app/
+├── @analytics/
+│   └── page.tsx
+├── @sidebar/
+│   └── page.tsx
+└── layout.tsx          # Receives { analytics, sidebar } as props
+```
+
+## Intercepting Routes
+
+```
+app/
+├── feed/
+│   └── page.tsx
+├── @modal/
+│   └── (.)photo/[id]/  # Intercepts /photo/[id] from /feed
+│       └── page.tsx
+└── photo/[id]/
+    └── page.tsx
+```
+
+Conventions:
+
+- `(.)` - same level
+- `(..)` - one level up
+- `(..)(..)` - two levels up
+- `(...)` - from root
+
+## Private Folders
+
+```
+app/
+├── _components/        # Private folder (not a route)
+│   └── Button.tsx
+└── page.tsx
+```
+
+Prefix with `_` to exclude from routing.
+
+## Middleware / Proxy
+
+### Next.js 14-15: `middleware.ts`
+
+```ts
+// middleware.ts (root of project)
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export function middleware(request: NextRequest) {
+  // Auth, redirects, rewrites, etc.
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: ["/dashboard/:path*", "/api/:path*"],
+};
+```
+
+### Next.js 16+: `proxy.ts`
+
+Renamed for clarity - same capabilities, different names:
+
+```ts
+// proxy.ts (root of project)
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export function proxy(request: NextRequest) {
+  // Same logic as middleware
+  return NextResponse.next();
+}
+
+export const proxyConfig = {
+  matcher: ["/dashboard/:path*", "/api/:path*"],
+};
+```
+
+| Version | File            | Export         | Config        |
+| ------- | --------------- | -------------- | ------------- |
+| v14-15  | `middleware.ts` | `middleware()` | `config`      |
+| v16+    | `proxy.ts`      | `proxy()`      | `proxyConfig` |
+
+**Migration**: Run `npx @next/codemod@latest upgrade` to auto-rename.
+
+## File Conventions Reference
+
+Reference: https://nextjs.org/docs/app/api-reference/file-conventions
diff --git a/.claude/skills/next-best-practices/font.md b/.claude/skills/next-best-practices/font.md
new file mode 100644
index 000000000..88362e6b0
--- /dev/null
+++ b/.claude/skills/next-best-practices/font.md
@@ -0,0 +1,257 @@
+# Font Optimization
+
+Use `next/font` for automatic font optimization with zero layout shift.
+
+## Google Fonts
+
+```tsx
+// app/layout.tsx
+import { Inter } from "next/font/google";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" className={inter.className}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+## Multiple Fonts
+
+```tsx
+import { Inter, Roboto_Mono } from "next/font/google";
+
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+});
+
+const robotoMono = Roboto_Mono({
+  subsets: ["latin"],
+  variable: "--font-roboto-mono",
+});
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" className={`${inter.variable} ${robotoMono.variable}`}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+Use in CSS:
+
+```css
+body {
+  font-family: var(--font-inter);
+}
+
+code {
+  font-family: var(--font-roboto-mono);
+}
+```
+
+## Font Weights and Styles
+
+```tsx
+// Single weight
+const inter = Inter({
+  subsets: ["latin"],
+  weight: "400",
+});
+
+// Multiple weights
+const inter = Inter({
+  subsets: ["latin"],
+  weight: ["400", "500", "700"],
+});
+
+// Variable font (recommended) - includes all weights
+const inter = Inter({
+  subsets: ["latin"],
+  // No weight needed - variable fonts support all weights
+});
+
+// With italic
+const inter = Inter({
+  subsets: ["latin"],
+  style: ["normal", "italic"],
+});
+```
+
+## Local Fonts
+
+```tsx
+import localFont from "next/font/local";
+
+const myFont = localFont({
+  src: "./fonts/MyFont.woff2",
+});
+
+// Multiple files for different weights
+const myFont = localFont({
+  src: [
+    {
+      path: "./fonts/MyFont-Regular.woff2",
+      weight: "400",
+      style: "normal",
+    },
+    {
+      path: "./fonts/MyFont-Bold.woff2",
+      weight: "700",
+      style: "normal",
+    },
+  ],
+});
+
+// Variable font
+const myFont = localFont({
+  src: "./fonts/MyFont-Variable.woff2",
+  variable: "--font-my-font",
+});
+```
+
+## Tailwind CSS Integration
+
+```tsx
+// app/layout.tsx
+import { Inter } from "next/font/google";
+
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+});
+
+export default function RootLayout({ children }) {
+  return (
+    <html lang="en" className={inter.variable}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+```js
+// tailwind.config.js
+module.exports = {
+  theme: {
+    extend: {
+      fontFamily: {
+        sans: ["var(--font-inter)"],
+      },
+    },
+  },
+};
+```
+
+## Preloading Subsets
+
+Only load needed character subsets:
+
+```tsx
+// Latin only (most common)
+const inter = Inter({ subsets: ["latin"] });
+
+// Multiple subsets
+const inter = Inter({ subsets: ["latin", "latin-ext", "cyrillic"] });
+```
+
+## Display Strategy
+
+Control font loading behavior:
+
+```tsx
+const inter = Inter({
+  subsets: ["latin"],
+  display: "swap", // Default - shows fallback, swaps when loaded
+});
+
+// Options:
+// 'auto' - browser decides
+// 'block' - short block period, then swap
+// 'swap' - immediate fallback, swap when ready (recommended)
+// 'fallback' - short block, short swap, then fallback
+// 'optional' - short block, no swap (use if font is optional)
+```
+
+## Don't Use Manual Font Links
+
+Always use `next/font` instead of `<link>` tags for Google Fonts.
+
+```tsx
+// Bad: Manual link tag (blocks rendering, no optimization)
+<link href="https://fonts.googleapis.com/css2?family=Inter" rel="stylesheet" />
+
+// Bad: Missing display and preconnect
+<link href="https://fonts.googleapis.com/css2?family=Inter" rel="stylesheet" />
+
+// Good: Use next/font (self-hosted, zero layout shift)
+import { Inter } from 'next/font/google'
+
+const inter = Inter({ subsets: ['latin'] })
+```
+
+## Common Mistakes
+
+```tsx
+// Bad: Importing font in every component
+// components/Button.tsx
+import { Inter } from 'next/font/google'
+const inter = Inter({ subsets: ['latin'] }) // Creates new instance each time!
+
+// Good: Import once in layout, use CSS variable
+// app/layout.tsx
+const inter = Inter({ subsets: ['latin'], variable: '--font-inter' })
+
+// Bad: Using @import in CSS (blocks rendering)
+/* globals.css */
+@import url('https://fonts.googleapis.com/css2?family=Inter');
+
+// Good: Use next/font (self-hosted, no network request)
+import { Inter } from 'next/font/google'
+
+// Bad: Loading all weights when only using a few
+const inter = Inter({ subsets: ['latin'] }) // Loads all weights
+
+// Good: Specify only needed weights (for non-variable fonts)
+const inter = Inter({ subsets: ['latin'], weight: ['400', '700'] })
+
+// Bad: Missing subset - loads all characters
+const inter = Inter({})
+
+// Good: Always specify subset
+const inter = Inter({ subsets: ['latin'] })
+```
+
+## Font in Specific Components
+
+```tsx
+// For component-specific fonts, export from a shared file
+// lib/fonts.ts
+import { Inter, Playfair_Display } from "next/font/google";
+
+export const inter = Inter({ subsets: ["latin"], variable: "--font-inter" });
+export const playfair = Playfair_Display({
+  subsets: ["latin"],
+  variable: "--font-playfair",
+});
+
+// components/Heading.tsx
+import { playfair } from "@/lib/fonts";
+
+export function Heading({ children }) {
+  return <h1 className={playfair.className}>{children}</h1>;
+}
+```
diff --git a/.claude/skills/next-best-practices/functions.md b/.claude/skills/next-best-practices/functions.md
new file mode 100644
index 000000000..1feb0a3cb
--- /dev/null
+++ b/.claude/skills/next-best-practices/functions.md
@@ -0,0 +1,108 @@
+# Functions
+
+Next.js function APIs.
+
+Reference: https://nextjs.org/docs/app/api-reference/functions
+
+## Navigation Hooks (Client)
+
+| Hook                        | Purpose                                                        | Reference                                                                                |
+| --------------------------- | -------------------------------------------------------------- | ---------------------------------------------------------------------------------------- |
+| `useRouter`                 | Programmatic navigation (`push`, `replace`, `back`, `refresh`) | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-router)                   |
+| `usePathname`               | Get current pathname                                           | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-pathname)                 |
+| `useSearchParams`           | Read URL search parameters                                     | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-search-params)            |
+| `useParams`                 | Access dynamic route parameters                                | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-params)                   |
+| `useSelectedLayoutSegment`  | Active child segment (one level)                               | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-selected-layout-segment)  |
+| `useSelectedLayoutSegments` | All active segments below layout                               | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-selected-layout-segments) |
+| `useLinkStatus`             | Check link prefetch status                                     | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-link-status)              |
+| `useReportWebVitals`        | Report Core Web Vitals metrics                                 | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-report-web-vitals)        |
+
+## Server Functions
+
+| Function     | Purpose                                      | Reference                                                              |
+| ------------ | -------------------------------------------- | ---------------------------------------------------------------------- |
+| `cookies`    | Read/write cookies                           | [Docs](https://nextjs.org/docs/app/api-reference/functions/cookies)    |
+| `headers`    | Read request headers                         | [Docs](https://nextjs.org/docs/app/api-reference/functions/headers)    |
+| `draftMode`  | Enable preview of unpublished CMS content    | [Docs](https://nextjs.org/docs/app/api-reference/functions/draft-mode) |
+| `after`      | Run code after response finishes streaming   | [Docs](https://nextjs.org/docs/app/api-reference/functions/after)      |
+| `connection` | Wait for connection before dynamic rendering | [Docs](https://nextjs.org/docs/app/api-reference/functions/connection) |
+| `userAgent`  | Parse User-Agent header                      | [Docs](https://nextjs.org/docs/app/api-reference/functions/userAgent)  |
+
+## Generate Functions
+
+| Function                | Purpose                                 | Reference                                                                           |
+| ----------------------- | --------------------------------------- | ----------------------------------------------------------------------------------- |
+| `generateStaticParams`  | Pre-render dynamic routes at build time | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-static-params)  |
+| `generateMetadata`      | Dynamic metadata                        | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-metadata)       |
+| `generateViewport`      | Dynamic viewport config                 | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-viewport)       |
+| `generateSitemaps`      | Multiple sitemaps for large sites       | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-sitemaps)       |
+| `generateImageMetadata` | Multiple OG images per route            | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-image-metadata) |
+
+## Request/Response
+
+| Function        | Purpose                        | Reference                                                                  |
+| --------------- | ------------------------------ | -------------------------------------------------------------------------- |
+| `NextRequest`   | Extended Request with helpers  | [Docs](https://nextjs.org/docs/app/api-reference/functions/next-request)   |
+| `NextResponse`  | Extended Response with helpers | [Docs](https://nextjs.org/docs/app/api-reference/functions/next-response)  |
+| `ImageResponse` | Generate OG images             | [Docs](https://nextjs.org/docs/app/api-reference/functions/image-response) |
+
+## Common Examples
+
+### Navigation
+
+Use `next/link` for internal navigation instead of `<a>` tags.
+
+```tsx
+// Bad: Plain anchor tag
+<a href="/about">About</a>;
+
+// Good: Next.js Link
+import Link from "next/link";
+
+<Link href="/about">About</Link>;
+```
+
+Active link styling:
+
+```tsx
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+
+export function NavLink({ href, children }) {
+  const pathname = usePathname();
+
+  return (
+    <Link href={href} className={pathname === href ? "active" : ""}>
+      {children}
+    </Link>
+  );
+}
+```
+
+### Static Generation
+
+```tsx
+// app/blog/[slug]/page.tsx
+export async function generateStaticParams() {
+  const posts = await getPosts();
+  return posts.map((post) => ({ slug: post.slug }));
+}
+```
+
+### After Response
+
+```tsx
+import { after } from "next/server";
+
+export async function POST(request: Request) {
+  const data = await processRequest(request);
+
+  after(async () => {
+    await logAnalytics(data);
+  });
+
+  return Response.json({ success: true });
+}
+```
diff --git a/.claude/skills/next-best-practices/hydration-error.md b/.claude/skills/next-best-practices/hydration-error.md
new file mode 100644
index 000000000..988fe5dd8
--- /dev/null
+++ b/.claude/skills/next-best-practices/hydration-error.md
@@ -0,0 +1,88 @@
+# Hydration Errors
+
+Diagnose and fix React hydration mismatch errors.
+
+## Error Signs
+
+- "Hydration failed because the initial UI does not match"
+- "Text content does not match server-rendered HTML"
+
+## Debugging
+
+In development, click the hydration error to see the server/client diff.
+
+## Common Causes and Fixes
+
+### Browser-only APIs
+
+```tsx
+// Bad: Causes mismatch - window doesn't exist on server
+<div>{window.innerWidth}</div>;
+
+// Good: Use client component with mounted check
+("use client");
+import { useState, useEffect } from "react";
+
+export function ClientOnly({ children }: { children: React.ReactNode }) {
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => setMounted(true), []);
+  return mounted ? children : null;
+}
+```
+
+### Date/Time Rendering
+
+Server and client may be in different timezones:
+
+```tsx
+// Bad: Causes mismatch
+<span>{new Date().toLocaleString()}</span>;
+
+// Good: Render on client only
+("use client");
+const [time, setTime] = useState<string>();
+useEffect(() => setTime(new Date().toLocaleString()), []);
+```
+
+### Random Values or IDs
+
+```tsx
+// Bad: Random values differ between server and client
+<div id={Math.random().toString()}>
+
+// Good: Use useId hook
+import { useId } from 'react'
+
+function Input() {
+  const id = useId()
+  return <input id={id} />
+}
+```
+
+### Invalid HTML Nesting
+
+```tsx
+// Bad: Invalid - div inside p
+<p><div>Content</div></p>
+
+// Bad: Invalid - p inside p
+<p><p>Nested</p></p>
+
+// Good: Valid nesting
+<div><p>Content</p></div>
+```
+
+### Third-party Scripts
+
+Scripts that modify DOM during hydration.
+
+```tsx
+// Good: Use next/script with afterInteractive
+import Script from "next/script";
+
+export default function Page() {
+  return (
+    <Script src="https://example.com/script.js" strategy="afterInteractive" />
+  );
+}
+```
diff --git a/.claude/skills/next-best-practices/image.md b/.claude/skills/next-best-practices/image.md
new file mode 100644
index 000000000..2372de4fe
--- /dev/null
+++ b/.claude/skills/next-best-practices/image.md
@@ -0,0 +1,179 @@
+# Image Optimization
+
+Use `next/image` for automatic image optimization.
+
+## Always Use next/image
+
+```tsx
+// Bad: Avoid native img
+<img src="/hero.png" alt="Hero" />;
+
+// Good: Use next/image
+import Image from "next/image";
+<Image src="/hero.png" alt="Hero" width={800} height={400} />;
+```
+
+## Required Props
+
+Images need explicit dimensions to prevent layout shift:
+
+```tsx
+// Local images - dimensions inferred automatically
+import heroImage from './hero.png'
+<Image src={heroImage} alt="Hero" />
+
+// Remote images - must specify width/height
+<Image src="https://example.com/image.jpg" alt="Hero" width={800} height={400} />
+
+// Or use fill for parent-relative sizing
+<div style={{ position: 'relative', width: '100%', height: 400 }}>
+  <Image src="/hero.png" alt="Hero" fill style={{ objectFit: 'cover' }} />
+</div>
+```
+
+## Remote Images Configuration
+
+Remote domains must be configured in `next.config.js`:
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "example.com",
+        pathname: "/images/**",
+      },
+      {
+        protocol: "https",
+        hostname: "*.cdn.com", // Wildcard subdomain
+      },
+    ],
+  },
+};
+```
+
+## Responsive Images
+
+Use `sizes` to tell the browser which size to download:
+
+```tsx
+// Full-width hero
+<Image
+  src="/hero.png"
+  alt="Hero"
+  fill
+  sizes="100vw"
+/>
+
+// Responsive grid (3 columns on desktop, 1 on mobile)
+<Image
+  src="/card.png"
+  alt="Card"
+  fill
+  sizes="(max-width: 768px) 100vw, 33vw"
+/>
+
+// Fixed sidebar image
+<Image
+  src="/avatar.png"
+  alt="Avatar"
+  width={200}
+  height={200}
+  sizes="200px"
+/>
+```
+
+## Blur Placeholder
+
+Prevent layout shift with placeholders:
+
+```tsx
+// Local images - automatic blur hash
+import heroImage from './hero.png'
+<Image src={heroImage} alt="Hero" placeholder="blur" />
+
+// Remote images - provide blurDataURL
+<Image
+  src="https://example.com/image.jpg"
+  alt="Hero"
+  width={800}
+  height={400}
+  placeholder="blur"
+  blurDataURL="data:image/jpeg;base64,/9j/4AAQSkZJRg..."
+/>
+
+// Or use color placeholder
+<Image
+  src="https://example.com/image.jpg"
+  alt="Hero"
+  width={800}
+  height={400}
+  placeholder="empty"
+  style={{ backgroundColor: '#e0e0e0' }}
+/>
+```
+
+## Priority Loading
+
+Use `priority` for above-the-fold images (LCP):
+
+```tsx
+// Hero image - loads immediately
+<Image src="/hero.png" alt="Hero" fill priority />
+
+// Below-fold images - lazy loaded by default (no priority needed)
+<Image src="/card.png" alt="Card" width={400} height={300} />
+```
+
+## Common Mistakes
+
+```tsx
+// Bad: Missing sizes with fill - downloads largest image
+<Image src="/hero.png" alt="Hero" fill />
+
+// Good: Add sizes for proper responsive behavior
+<Image src="/hero.png" alt="Hero" fill sizes="100vw" />
+
+// Bad: Using width/height for aspect ratio only
+<Image src="/hero.png" alt="Hero" width={16} height={9} />
+
+// Good: Use actual display dimensions or fill with sizes
+<Image src="/hero.png" alt="Hero" fill sizes="100vw" style={{ objectFit: 'cover' }} />
+
+// Bad: Remote image without config
+<Image src="https://untrusted.com/image.jpg" alt="Image" width={400} height={300} />
+// Error: Invalid src prop, hostname not configured
+
+// Good: Add hostname to next.config.js remotePatterns
+```
+
+## Static Export
+
+When using `output: 'export'`, use `unoptimized` or custom loader:
+
+```tsx
+// Option 1: Disable optimization
+<Image src="/hero.png" alt="Hero" width={800} height={400} unoptimized />;
+
+// Option 2: Global config
+// next.config.js
+module.exports = {
+  output: "export",
+  images: { unoptimized: true },
+};
+
+// Option 3: Custom loader (Cloudinary, Imgix, etc.)
+const cloudinaryLoader = ({ src, width, quality }) => {
+  return `https://res.cloudinary.com/demo/image/upload/w_${width},q_${quality || 75}/${src}`;
+};
+
+<Image
+  loader={cloudinaryLoader}
+  src="sample.jpg"
+  alt="Sample"
+  width={800}
+  height={400}
+/>;
+```
diff --git a/.claude/skills/next-best-practices/metadata.md b/.claude/skills/next-best-practices/metadata.md
new file mode 100644
index 000000000..cbcebe745
--- /dev/null
+++ b/.claude/skills/next-best-practices/metadata.md
@@ -0,0 +1,296 @@
+# Metadata
+
+Add SEO metadata to Next.js pages using the Metadata API.
+
+## Important: Server Components Only
+
+The `metadata` object and `generateMetadata` function are **only supported in Server Components**. They cannot be used in Client Components.
+
+If the target page has `'use client'`:
+
+1. Remove `'use client'` if possible, move client logic to child components
+2. Or extract metadata to a parent Server Component layout
+3. Or split the file: Server Component with metadata imports Client Components
+
+## Static Metadata
+
+```tsx
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Page Title",
+  description: "Page description for search engines",
+};
+```
+
+## Dynamic Metadata
+
+```tsx
+import type { Metadata } from "next";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { slug } = await params;
+  const post = await getPost(slug);
+  return { title: post.title, description: post.description };
+}
+```
+
+## Avoid Duplicate Fetches
+
+Use React `cache()` when the same data is needed for both metadata and page:
+
+```tsx
+import { cache } from "react";
+
+export const getPost = cache(async (slug: string) => {
+  return await db.posts.findFirst({ where: { slug } });
+});
+```
+
+## Viewport
+
+Separate from metadata for streaming support:
+
+```tsx
+import type { Viewport } from "next";
+
+export const viewport: Viewport = {
+  width: "device-width",
+  initialScale: 1,
+  themeColor: "#000000",
+};
+
+// Or dynamic
+export function generateViewport({ params }): Viewport {
+  return { themeColor: getThemeColor(params) };
+}
+```
+
+## Title Templates
+
+In root layout for consistent naming:
+
+```tsx
+export const metadata: Metadata = {
+  title: { default: "Site Name", template: "%s | Site Name" },
+};
+```
+
+## Metadata File Conventions
+
+Reference: https://nextjs.org/docs/app/getting-started/project-structure#metadata-file-conventions
+
+Place these files in `app/` directory (or route segments):
+
+| File                            | Purpose                                       |
+| ------------------------------- | --------------------------------------------- |
+| `favicon.ico`                   | Favicon                                       |
+| `icon.png` / `icon.svg`         | App icon                                      |
+| `apple-icon.png`                | Apple app icon                                |
+| `opengraph-image.png`           | OG image                                      |
+| `twitter-image.png`             | Twitter card image                            |
+| `sitemap.ts` / `sitemap.xml`    | Sitemap (use `generateSitemaps` for multiple) |
+| `robots.ts` / `robots.txt`      | Robots directives                             |
+| `manifest.ts` / `manifest.json` | Web app manifest                              |
+
+## SEO Best Practice: Static Files Are Often Enough
+
+For most sites, **static metadata files provide excellent SEO coverage**:
+
+```
+app/
+├── favicon.ico
+├── opengraph-image.png     # Works for both OG and Twitter
+├── sitemap.ts
+├── robots.ts
+└── layout.tsx              # With title/description metadata
+```
+
+**Tips:**
+
+- A single `opengraph-image.png` covers both Open Graph and Twitter (Twitter falls back to OG)
+- Static `title` and `description` in layout metadata is sufficient for most pages
+- Only use dynamic `generateMetadata` when content varies per page
+
+---
+
+# OG Image Generation
+
+Generate dynamic Open Graph images using `next/og`.
+
+## Important Rules
+
+1. **Use `next/og`** - not `@vercel/og` (it's built into Next.js)
+2. **No searchParams** - OG images can't access search params, use route params instead
+3. **Avoid Edge runtime** - Use default Node.js runtime
+
+```tsx
+// Good
+import { ImageResponse } from "next/og";
+
+// Bad
+// import { ImageResponse } from '@vercel/og'
+// export const runtime = 'edge'
+```
+
+## Basic OG Image
+
+```tsx
+// app/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export const alt = "Site Name";
+export const size = { width: 1200, height: 630 };
+export const contentType = "image/png";
+
+export default function Image() {
+  return new ImageResponse(
+    <div
+      style={{
+        fontSize: 128,
+        background: "white",
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+      }}
+    >
+      Hello World
+    </div>,
+    { ...size },
+  );
+}
+```
+
+## Dynamic OG Image
+
+```tsx
+// app/blog/[slug]/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export const alt = "Blog Post";
+export const size = { width: 1200, height: 630 };
+export const contentType = "image/png";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export default async function Image({ params }: Props) {
+  const { slug } = await params;
+  const post = await getPost(slug);
+
+  return new ImageResponse(
+    <div
+      style={{
+        fontSize: 48,
+        background: "linear-gradient(to bottom, #1a1a1a, #333)",
+        color: "white",
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: 48,
+      }}
+    >
+      <div style={{ fontSize: 64, fontWeight: "bold" }}>{post.title}</div>
+      <div style={{ marginTop: 24, opacity: 0.8 }}>{post.description}</div>
+    </div>,
+    { ...size },
+  );
+}
+```
+
+## Custom Fonts
+
+```tsx
+import { ImageResponse } from "next/og";
+import { join } from "path";
+import { readFile } from "fs/promises";
+
+export default async function Image() {
+  const fontPath = join(process.cwd(), "assets/fonts/Inter-Bold.ttf");
+  const fontData = await readFile(fontPath);
+
+  return new ImageResponse(
+    <div style={{ fontFamily: "Inter", fontSize: 64 }}>Custom Font Text</div>,
+    {
+      width: 1200,
+      height: 630,
+      fonts: [{ name: "Inter", data: fontData, style: "normal" }],
+    },
+  );
+}
+```
+
+## File Naming
+
+- `opengraph-image.tsx` - Open Graph (Facebook, LinkedIn)
+- `twitter-image.tsx` - Twitter/X cards (optional, falls back to OG)
+
+## Styling Notes
+
+ImageResponse uses Flexbox layout:
+
+- Use `display: 'flex'`
+- No CSS Grid support
+- Styles must be inline objects
+
+## Multiple OG Images
+
+Use `generateImageMetadata` for multiple images per route:
+
+```tsx
+// app/blog/[slug]/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export async function generateImageMetadata({ params }) {
+  const images = await getPostImages(params.slug);
+  return images.map((img, idx) => ({
+    id: idx,
+    alt: img.alt,
+    size: { width: 1200, height: 630 },
+    contentType: "image/png",
+  }));
+}
+
+export default async function Image({ params, id }) {
+  const images = await getPostImages(params.slug);
+  const image = images[id];
+  return new ImageResponse(/* ... */);
+}
+```
+
+## Multiple Sitemaps
+
+Use `generateSitemaps` for large sites:
+
+```tsx
+// app/sitemap.ts
+import type { MetadataRoute } from "next";
+
+export async function generateSitemaps() {
+  // Return array of sitemap IDs
+  return [{ id: 0 }, { id: 1 }, { id: 2 }];
+}
+
+export default async function sitemap({
+  id,
+}: {
+  id: number;
+}): Promise<MetadataRoute.Sitemap> {
+  const start = id * 50000;
+  const end = start + 50000;
+  const products = await getProducts(start, end);
+
+  return products.map((product) => ({
+    url: `https://example.com/product/${product.id}`,
+    lastModified: product.updatedAt,
+  }));
+}
+```
+
+Generates `/sitemap/0.xml`, `/sitemap/1.xml`, etc.
diff --git a/.claude/skills/next-best-practices/parallel-routes.md b/.claude/skills/next-best-practices/parallel-routes.md
new file mode 100644
index 000000000..f0fe8aa0a
--- /dev/null
+++ b/.claude/skills/next-best-practices/parallel-routes.md
@@ -0,0 +1,298 @@
+# Parallel & Intercepting Routes
+
+Parallel routes render multiple pages in the same layout. Intercepting routes show a different UI when navigating from within your app vs direct URL access. Together they enable modal patterns.
+
+## File Structure
+
+```
+app/
+├── @modal/                    # Parallel route slot
+│   ├── default.tsx            # Required! Returns null
+│   ├── (.)photos/             # Intercepts /photos/*
+│   │   └── [id]/
+│   │       └── page.tsx       # Modal content
+│   └── [...]catchall/         # Optional: catch unmatched
+│       └── page.tsx
+├── photos/
+│   └── [id]/
+│       └── page.tsx           # Full page (direct access)
+├── layout.tsx                 # Renders both children and @modal
+└── page.tsx
+```
+
+## Step 1: Root Layout with Slot
+
+```tsx
+// app/layout.tsx
+export default function RootLayout({
+  children,
+  modal,
+}: {
+  children: React.ReactNode;
+  modal: React.ReactNode;
+}) {
+  return (
+    <html>
+      <body>
+        {children}
+        {modal}
+      </body>
+    </html>
+  );
+}
+```
+
+## Step 2: Default File (Critical!)
+
+**Every parallel route slot MUST have a `default.tsx`** to prevent 404s on hard navigation.
+
+```tsx
+// app/@modal/default.tsx
+export default function Default() {
+  return null;
+}
+```
+
+Without this file, refreshing any page will 404 because Next.js can't determine what to render in the `@modal` slot.
+
+## Step 3: Intercepting Route (Modal)
+
+The `(.)` prefix intercepts routes at the same level.
+
+```tsx
+// app/@modal/(.)photos/[id]/page.tsx
+import { Modal } from "@/components/modal";
+
+export default async function PhotoModal({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  return (
+    <Modal>
+      <img src={photo.url} alt={photo.title} />
+    </Modal>
+  );
+}
+```
+
+## Step 4: Full Page (Direct Access)
+
+```tsx
+// app/photos/[id]/page.tsx
+export default async function PhotoPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  return (
+    <div className="full-page">
+      <img src={photo.url} alt={photo.title} />
+      <h1>{photo.title}</h1>
+    </div>
+  );
+}
+```
+
+## Step 5: Modal Component with Correct Closing
+
+**Critical: Use `router.back()` to close modals, NOT `router.push()` or `<Link>`.**
+
+```tsx
+// components/modal.tsx
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useCallback, useEffect, useRef } from "react";
+
+export function Modal({ children }: { children: React.ReactNode }) {
+  const router = useRouter();
+  const overlayRef = useRef<HTMLDivElement>(null);
+
+  // Close on escape key
+  useEffect(() => {
+    function onKeyDown(e: KeyboardEvent) {
+      if (e.key === "Escape") {
+        router.back(); // Correct
+      }
+    }
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [router]);
+
+  // Close on overlay click
+  const handleOverlayClick = useCallback(
+    (e: React.MouseEvent) => {
+      if (e.target === overlayRef.current) {
+        router.back(); // Correct
+      }
+    },
+    [router],
+  );
+
+  return (
+    <div
+      ref={overlayRef}
+      onClick={handleOverlayClick}
+      className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
+    >
+      <div className="mx-4 w-full max-w-2xl rounded-lg bg-white p-6">
+        <button
+          onClick={() => router.back()} // Correct!
+          className="absolute right-4 top-4"
+        >
+          Close
+        </button>
+        {children}
+      </div>
+    </div>
+  );
+}
+```
+
+### Why NOT `router.push('/')` or `<Link href="/">`?
+
+Using `push` or `Link` to "close" a modal:
+
+1. Adds a new history entry (back button shows modal again)
+2. Doesn't properly clear the intercepted route
+3. Can cause the modal to flash or persist unexpectedly
+
+`router.back()` correctly:
+
+1. Removes the intercepted route from history
+2. Returns to the previous page
+3. Properly unmounts the modal
+
+## Route Matcher Reference
+
+Matchers match **route segments**, not filesystem paths:
+
+| Matcher    | Matches       | Example                                                               |
+| ---------- | ------------- | --------------------------------------------------------------------- |
+| `(.)`      | Same level    | `@modal/(.)photos` intercepts `/photos`                               |
+| `(..)`     | One level up  | `@modal/(..)settings` from `/dashboard/@modal` intercepts `/settings` |
+| `(..)(..)` | Two levels up | Rarely used                                                           |
+| `(...)`    | From root     | `@modal/(...)photos` intercepts `/photos` from anywhere               |
+
+**Common mistake**: Thinking `(..)` means "parent folder" - it means "parent route segment".
+
+## Handling Hard Navigation
+
+When users directly visit `/photos/123` (bookmark, refresh, shared link):
+
+- The intercepting route is bypassed
+- The full `photos/[id]/page.tsx` renders
+- Modal doesn't appear (expected behavior)
+
+If you want the modal to appear on direct access too, you need additional logic:
+
+```tsx
+// app/photos/[id]/page.tsx
+import { Modal } from "@/components/modal";
+
+export default async function PhotoPage({ params }) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  // Option: Render as modal on direct access too
+  return (
+    <Modal>
+      <img src={photo.url} alt={photo.title} />
+    </Modal>
+  );
+}
+```
+
+## Common Gotchas
+
+### 1. Missing `default.tsx` → 404 on Refresh
+
+Every `@slot` folder needs a `default.tsx` that returns `null` (or appropriate content).
+
+### 2. Modal Persists After Navigation
+
+You're using `router.push()` instead of `router.back()`.
+
+### 3. Nested Parallel Routes Need Defaults Too
+
+If you have `@modal` inside a route group, each level needs its own `default.tsx`:
+
+```
+app/
+├── (marketing)/
+│   ├── @modal/
+│   │   └── default.tsx     # Needed!
+│   └── layout.tsx
+└── layout.tsx
+```
+
+### 4. Intercepted Route Shows Wrong Content
+
+Check your matcher:
+
+- `(.)photos` intercepts `/photos` from the same route level
+- If your `@modal` is in `app/dashboard/@modal`, use `(.)photos` to intercept `/dashboard/photos`, not `/photos`
+
+### 5. TypeScript Errors with `params`
+
+In Next.js 15+, `params` is a Promise:
+
+```tsx
+// Correct
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+}
+```
+
+## Complete Example: Photo Gallery Modal
+
+```
+app/
+├── @modal/
+│   ├── default.tsx
+│   └── (.)photos/
+│       └── [id]/
+│           └── page.tsx
+├── photos/
+│   ├── page.tsx           # Gallery grid
+│   └── [id]/
+│       └── page.tsx       # Full photo page
+├── layout.tsx
+└── page.tsx
+```
+
+Links in the gallery:
+
+```tsx
+// app/photos/page.tsx
+import Link from "next/link";
+
+export default async function Gallery() {
+  const photos = await getPhotos();
+
+  return (
+    <div className="grid grid-cols-3 gap-4">
+      {photos.map((photo) => (
+        <Link key={photo.id} href={`/photos/${photo.id}`}>
+          <img src={photo.thumbnail} alt={photo.title} />
+        </Link>
+      ))}
+    </div>
+  );
+}
+```
+
+Clicking a photo → Modal opens (intercepted)
+Direct URL → Full page renders
+Refresh while modal open → Full page renders
diff --git a/.claude/skills/next-best-practices/route-handlers.md b/.claude/skills/next-best-practices/route-handlers.md
new file mode 100644
index 000000000..2b9a55070
--- /dev/null
+++ b/.claude/skills/next-best-practices/route-handlers.md
@@ -0,0 +1,146 @@
+# Route Handlers
+
+Create API endpoints with `route.ts` files.
+
+## Basic Usage
+
+```tsx
+// app/api/users/route.ts
+export async function GET() {
+  const users = await getUsers();
+  return Response.json(users);
+}
+
+export async function POST(request: Request) {
+  const body = await request.json();
+  const user = await createUser(body);
+  return Response.json(user, { status: 201 });
+}
+```
+
+## Supported Methods
+
+`GET`, `POST`, `PUT`, `PATCH`, `DELETE`, `HEAD`, `OPTIONS`
+
+## GET Handler Conflicts with page.tsx
+
+**A `route.ts` and `page.tsx` cannot coexist in the same folder.**
+
+```
+app/
+├── api/
+│   └── users/
+│       └── route.ts    # /api/users
+└── users/
+    ├── page.tsx        # /users (page)
+    └── route.ts        # Warning: Conflicts with page.tsx!
+```
+
+If you need both a page and an API at the same path, use different paths:
+
+```
+app/
+├── users/
+│   └── page.tsx        # /users (page)
+└── api/
+    └── users/
+        └── route.ts    # /api/users (API)
+```
+
+## Environment Behavior
+
+Route handlers run in a **Server Component-like environment**:
+
+- Yes: Can use `async/await`
+- Yes: Can access `cookies()`, `headers()`
+- Yes: Can use Node.js APIs
+- No: Cannot use React hooks
+- No: Cannot use React DOM APIs
+- No: Cannot use browser APIs
+
+```tsx
+// Bad: This won't work - no React DOM in route handlers
+import { renderToString } from "react-dom/server";
+
+export async function GET() {
+  const html = renderToString(<Component />); // Error!
+  return new Response(html);
+}
+```
+
+## Dynamic Route Handlers
+
+```tsx
+// app/api/users/[id]/route.ts
+export async function GET(
+  request: Request,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  const { id } = await params;
+  const user = await getUser(id);
+
+  if (!user) {
+    return Response.json({ error: "Not found" }, { status: 404 });
+  }
+
+  return Response.json(user);
+}
+```
+
+## Request Helpers
+
+```tsx
+export async function GET(request: Request) {
+  // URL and search params
+  const { searchParams } = new URL(request.url);
+  const query = searchParams.get("q");
+
+  // Headers
+  const authHeader = request.headers.get("authorization");
+
+  // Cookies (Next.js helper)
+  const cookieStore = await cookies();
+  const token = cookieStore.get("token");
+
+  return Response.json({ query, token });
+}
+```
+
+## Response Helpers
+
+```tsx
+// JSON response
+return Response.json({ data });
+
+// With status
+return Response.json({ error: "Not found" }, { status: 404 });
+
+// With headers
+return Response.json(data, {
+  headers: {
+    "Cache-Control": "max-age=3600",
+  },
+});
+
+// Redirect
+return Response.redirect(new URL("/login", request.url));
+
+// Stream
+return new Response(stream, {
+  headers: { "Content-Type": "text/event-stream" },
+});
+```
+
+## When to Use Route Handlers vs Server Actions
+
+| Use Case                 | Route Handlers | Server Actions |
+| ------------------------ | -------------- | -------------- |
+| Form submissions         | No             | Yes            |
+| Data mutations from UI   | No             | Yes            |
+| Third-party webhooks     | Yes            | No             |
+| External API consumption | Yes            | No             |
+| Public REST API          | Yes            | No             |
+| File uploads             | Both work      | Both work      |
+
+**Prefer Server Actions** for mutations triggered from your UI.
+**Use Route Handlers** for external integrations and public APIs.
diff --git a/.claude/skills/next-best-practices/rsc-boundaries.md b/.claude/skills/next-best-practices/rsc-boundaries.md
new file mode 100644
index 000000000..fcb1d383c
--- /dev/null
+++ b/.claude/skills/next-best-practices/rsc-boundaries.md
@@ -0,0 +1,164 @@
+# RSC Boundaries
+
+Detect and prevent invalid patterns when crossing Server/Client component boundaries.
+
+## Detection Rules
+
+### 1. Async Client Components Are Invalid
+
+Client components **cannot** be async functions. Only Server Components can be async.
+
+**Detect:** File has `'use client'` AND component is `async function` or returns `Promise`
+
+```tsx
+// Bad: async client component
+"use client";
+export default async function UserProfile() {
+  const user = await getUser(); // Cannot await in client component
+  return <div>{user.name}</div>;
+}
+
+// Good: Remove async, fetch data in parent server component
+// page.tsx (server component - no 'use client')
+export default async function Page() {
+  const user = await getUser();
+  return <UserProfile user={user} />;
+}
+
+// UserProfile.tsx (client component)
+("use client");
+export function UserProfile({ user }: { user: User }) {
+  return <div>{user.name}</div>;
+}
+```
+
+```tsx
+// Bad: async arrow function client component
+"use client";
+const Dashboard = async () => {
+  const data = await fetchDashboard();
+  return <div>{data}</div>;
+};
+
+// Good: Fetch in server component, pass data down
+```
+
+### 2. Non-Serializable Props to Client Components
+
+Props passed from Server → Client must be JSON-serializable.
+
+**Detect:** Server component passes these to a client component:
+
+- Functions (except Server Actions with `'use server'`)
+- `Date` objects
+- `Map`, `Set`, `WeakMap`, `WeakSet`
+- Class instances
+- `Symbol` (unless globally registered)
+- Circular references
+
+```tsx
+// Bad: Function prop
+// page.tsx (server)
+export default function Page() {
+  const handleClick = () => console.log("clicked");
+  return <ClientButton onClick={handleClick} />;
+}
+
+// Good: Define function inside client component
+// ClientButton.tsx
+("use client");
+export function ClientButton() {
+  const handleClick = () => console.log("clicked");
+  return <button onClick={handleClick}>Click</button>;
+}
+```
+
+```tsx
+// Bad: Date object (silently becomes string, then crashes)
+// page.tsx (server)
+export default async function Page() {
+  const post = await getPost();
+  return <PostCard createdAt={post.createdAt} />; // Date object
+}
+
+// PostCard.tsx (client) - will crash on .getFullYear()
+("use client");
+export function PostCard({ createdAt }: { createdAt: Date }) {
+  return <span>{createdAt.getFullYear()}</span>; // Runtime error!
+}
+
+// Good: Serialize to string on server
+// page.tsx (server)
+export default async function Page() {
+  const post = await getPost();
+  return <PostCard createdAt={post.createdAt.toISOString()} />;
+}
+
+// PostCard.tsx (client)
+("use client");
+export function PostCard({ createdAt }: { createdAt: string }) {
+  const date = new Date(createdAt);
+  return <span>{date.getFullYear()}</span>;
+}
+```
+
+```tsx
+// Bad: Class instance
+const user = new UserModel(data)
+<ClientProfile user={user} /> // Methods will be stripped
+
+// Good: Pass plain object
+const user = await getUser()
+<ClientProfile user={{ id: user.id, name: user.name }} />
+```
+
+```tsx
+// Bad: Map/Set
+<ClientComponent items={new Map([['a', 1]])} />
+
+// Good: Convert to array/object
+<ClientComponent items={Object.fromEntries(map)} />
+<ClientComponent items={Array.from(set)} />
+```
+
+### 3. Server Actions Are the Exception
+
+Functions marked with `'use server'` CAN be passed to client components.
+
+```tsx
+// Valid: Server Action can be passed
+// actions.ts
+"use server";
+export async function submitForm(formData: FormData) {
+  // server-side logic
+}
+
+// page.tsx (server)
+import { submitForm } from "./actions";
+export default function Page() {
+  return <ClientForm onSubmit={submitForm} />; // OK!
+}
+
+// ClientForm.tsx (client)
+("use client");
+export function ClientForm({
+  onSubmit,
+}: {
+  onSubmit: (data: FormData) => Promise<void>;
+}) {
+  return <form action={onSubmit}>...</form>;
+}
+```
+
+## Quick Reference
+
+| Pattern                           | Valid? | Fix                                   |
+| --------------------------------- | ------ | ------------------------------------- |
+| `'use client'` + `async function` | No     | Fetch in server parent, pass data     |
+| Pass `() => {}` to client         | No     | Define in client or use server action |
+| Pass `new Date()` to client       | No     | Use `.toISOString()`                  |
+| Pass `new Map()` to client        | No     | Convert to object/array               |
+| Pass class instance to client     | No     | Pass plain object                     |
+| Pass server action to client      | Yes    | -                                     |
+| Pass `string/number/boolean`      | Yes    | -                                     |
+| Pass plain object/array           | Yes    | -                                     |
diff --git a/.claude/skills/next-best-practices/runtime-selection.md b/.claude/skills/next-best-practices/runtime-selection.md
new file mode 100644
index 000000000..ac8db62af
--- /dev/null
+++ b/.claude/skills/next-best-practices/runtime-selection.md
@@ -0,0 +1,40 @@
+# Runtime Selection
+
+## Use Node.js Runtime by Default
+
+Use the default Node.js runtime for new routes and pages. Only use Edge runtime if the project already uses it or there's a specific requirement.
+
+```tsx
+// Good: Default - no runtime config needed (uses Node.js)
+export default function Page() { ... }
+
+// Caution: Only if already used in project or specifically required
+export const runtime = 'edge'
+```
+
+## When to Use Each
+
+### Node.js Runtime (Default)
+
+- Full Node.js API support
+- File system access (`fs`)
+- Full `crypto` support
+- Database connections
+- Most npm packages work
+
+### Edge Runtime
+
+- Only for specific edge-location latency requirements
+- Limited API (no `fs`, limited `crypto`)
+- Smaller cold start
+- Geographic distribution needs
+
+## Detection
+
+**Before adding `runtime = 'edge'`**, check:
+
+1. Does the project already use Edge runtime?
+2. Is there a specific latency requirement?
+3. Are all dependencies Edge-compatible?
+
+If unsure, use Node.js runtime.
diff --git a/.claude/skills/next-best-practices/scripts.md b/.claude/skills/next-best-practices/scripts.md
new file mode 100644
index 000000000..df3bde500
--- /dev/null
+++ b/.claude/skills/next-best-practices/scripts.md
@@ -0,0 +1,141 @@
+# Scripts
+
+Loading third-party scripts in Next.js.
+
+## Use next/script
+
+Always use `next/script` instead of native `<script>` tags for better performance.
+
+```tsx
+// Bad: Native script tag
+<script src="https://example.com/script.js"></script>;
+
+// Good: Next.js Script component
+import Script from "next/script";
+
+<Script src="https://example.com/script.js" />;
+```
+
+## Inline Scripts Need ID
+
+Inline scripts require an `id` attribute for Next.js to track them.
+
+```tsx
+// Bad: Missing id
+<Script dangerouslySetInnerHTML={{ __html: 'console.log("hi")' }} />
+
+// Good: Has id
+<Script id="my-script" dangerouslySetInnerHTML={{ __html: 'console.log("hi")' }} />
+
+// Good: Inline with id
+<Script id="show-banner">
+  {`document.getElementById('banner').classList.remove('hidden')`}
+</Script>
+```
+
+## Don't Put Script in Head
+
+`next/script` should not be placed inside `next/head`. It handles its own positioning.
+
+```tsx
+// Bad: Script inside Head
+import Head from 'next/head'
+import Script from 'next/script'
+
+<Head>
+  <Script src="/analytics.js" />
+</Head>
+
+// Good: Script outside Head
+<Head>
+  <title>Page</title>
+</Head>
+<Script src="/analytics.js" />
+```
+
+## Loading Strategies
+
+```tsx
+// afterInteractive (default) - Load after page is interactive
+<Script src="/analytics.js" strategy="afterInteractive" />
+
+// lazyOnload - Load during idle time
+<Script src="/widget.js" strategy="lazyOnload" />
+
+// beforeInteractive - Load before page is interactive (use sparingly)
+// Only works in app/layout.tsx or pages/_document.js
+<Script src="/critical.js" strategy="beforeInteractive" />
+
+// worker - Load in web worker (experimental)
+<Script src="/heavy.js" strategy="worker" />
+```
+
+## Google Analytics
+
+Use `@next/third-parties` instead of inline GA scripts.
+
+```tsx
+// Bad: Inline GA script
+<Script src="https://www.googletagmanager.com/gtag/js?id=G-XXXXX" />
+<Script id="ga-init">
+  {`window.dataLayer = window.dataLayer || [];
+    function gtag(){dataLayer.push(arguments);}
+    gtag('js', new Date());
+    gtag('config', 'G-XXXXX');`}
+</Script>
+
+// Good: Next.js component
+import { GoogleAnalytics } from '@next/third-parties/google'
+
+export default function Layout({ children }) {
+  return (
+    <html>
+      <body>{children}</body>
+      <GoogleAnalytics gaId="G-XXXXX" />
+    </html>
+  )
+}
+```
+
+## Google Tag Manager
+
+```tsx
+import { GoogleTagManager } from "@next/third-parties/google";
+
+export default function Layout({ children }) {
+  return (
+    <html>
+      <GoogleTagManager gtmId="GTM-XXXXX" />
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+## Other Third-Party Scripts
+
+```tsx
+// YouTube embed
+import { YouTubeEmbed } from "@next/third-parties/google";
+
+<YouTubeEmbed videoid="dQw4w9WgXcQ" />;
+
+// Google Maps
+import { GoogleMapsEmbed } from "@next/third-parties/google";
+
+<GoogleMapsEmbed
+  apiKey="YOUR_API_KEY"
+  mode="place"
+  q="Brooklyn+Bridge,New+York,NY"
+/>;
+```
+
+## Quick Reference
+
+| Pattern                                       | Issue                      | Fix                       |
+| --------------------------------------------- | -------------------------- | ------------------------- |
+| `<script src="...">`                          | No optimization            | Use `next/script`         |
+| `<Script>` without id                         | Can't track inline scripts | Add `id` attribute        |
+| `<Script>` inside `<Head>`                    | Wrong placement            | Move outside Head         |
+| Inline GA/GTM scripts                         | No optimization            | Use `@next/third-parties` |
+| `strategy="beforeInteractive"` outside layout | Won't work                 | Only use in root layout   |
diff --git a/.claude/skills/next-best-practices/self-hosting.md b/.claude/skills/next-best-practices/self-hosting.md
new file mode 100644
index 000000000..de765d6d1
--- /dev/null
+++ b/.claude/skills/next-best-practices/self-hosting.md
@@ -0,0 +1,384 @@
+# Self-Hosting Next.js
+
+Deploy Next.js outside of Vercel with confidence.
+
+## Quick Start: Standalone Output
+
+For Docker or any containerized deployment, use standalone output:
+
+```js
+// next.config.js
+module.exports = {
+  output: "standalone",
+};
+```
+
+This creates a minimal `standalone` folder with only production dependencies:
+
+```
+.next/
+├── standalone/
+│   ├── server.js          # Entry point
+│   ├── node_modules/      # Only production deps
+│   └── .next/             # Build output
+└── static/                # Must be copied separately
+```
+
+## Docker Deployment
+
+### Dockerfile
+
+```dockerfile
+FROM node:20-alpine AS base
+
+# Install dependencies
+FROM base AS deps
+WORKDIR /app
+COPY package.json package-lock.json* ./
+RUN npm ci
+
+# Build
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+RUN npm run build
+
+# Production
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV=production
+
+# Create non-root user
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+# Copy standalone output
+COPY --from=builder /app/.next/standalone ./
+COPY --from=builder /app/.next/static ./.next/static
+COPY --from=builder /app/public ./public
+
+USER nextjs
+
+EXPOSE 3000
+ENV PORT=3000
+ENV HOSTNAME="0.0.0.0"
+
+CMD ["node", "server.js"]
+```
+
+### Docker Compose
+
+```yaml
+version: "3.8"
+
+services:
+  web:
+    build: .
+    ports:
+      - "3000:3000"
+    environment:
+      - NODE_ENV=production
+    restart: unless-stopped
+    healthcheck:
+      test:
+        ["CMD", "wget", "-q", "--spider", "http://localhost:3000/api/health"]
+      interval: 30s
+      timeout: 10s
+      retries: 3
+```
+
+## PM2 Deployment
+
+For traditional server deployments:
+
+```js
+// ecosystem.config.js
+module.exports = {
+  apps: [
+    {
+      name: "nextjs",
+      script: ".next/standalone/server.js",
+      instances: "max",
+      exec_mode: "cluster",
+      env: {
+        NODE_ENV: "production",
+        PORT: 3000,
+      },
+    },
+  ],
+};
+```
+
+```bash
+npm run build
+pm2 start ecosystem.config.js
+```
+
+## ISR and Cache Handlers
+
+### The Problem
+
+ISR (Incremental Static Regeneration) uses filesystem caching by default. This **breaks with multiple instances**:
+
+- Instance A regenerates page → saves to its local disk
+- Instance B serves stale page → doesn't see Instance A's cache
+- Load balancer sends users to random instances → inconsistent content
+
+### Solution: Custom Cache Handler
+
+Next.js 14+ supports custom cache handlers for shared storage:
+
+```js
+// next.config.js
+module.exports = {
+  cacheHandler: require.resolve("./cache-handler.js"),
+  cacheMaxMemorySize: 0, // Disable in-memory cache
+};
+```
+
+#### Redis Cache Handler Example
+
+```js
+// cache-handler.js
+const Redis = require("ioredis");
+
+const redis = new Redis(process.env.REDIS_URL);
+const CACHE_PREFIX = "nextjs:";
+
+module.exports = class CacheHandler {
+  constructor(options) {
+    this.options = options;
+  }
+
+  async get(key) {
+    const data = await redis.get(CACHE_PREFIX + key);
+    if (!data) return null;
+
+    const parsed = JSON.parse(data);
+    return {
+      value: parsed.value,
+      lastModified: parsed.lastModified,
+    };
+  }
+
+  async set(key, data, ctx) {
+    const cacheData = {
+      value: data,
+      lastModified: Date.now(),
+    };
+
+    // Set TTL based on revalidate option
+    if (ctx?.revalidate) {
+      await redis.setex(
+        CACHE_PREFIX + key,
+        ctx.revalidate,
+        JSON.stringify(cacheData),
+      );
+    } else {
+      await redis.set(CACHE_PREFIX + key, JSON.stringify(cacheData));
+    }
+  }
+
+  async revalidateTag(tags) {
+    // Implement tag-based invalidation
+    // This requires tracking which keys have which tags
+  }
+};
+```
+
+#### S3 Cache Handler Example
+
+```js
+// cache-handler.js
+const {
+  S3Client,
+  GetObjectCommand,
+  PutObjectCommand,
+} = require("@aws-sdk/client-s3");
+
+const s3 = new S3Client({ region: process.env.AWS_REGION });
+const BUCKET = process.env.CACHE_BUCKET;
+
+module.exports = class CacheHandler {
+  async get(key) {
+    try {
+      const response = await s3.send(
+        new GetObjectCommand({
+          Bucket: BUCKET,
+          Key: `cache/${key}`,
+        }),
+      );
+      const body = await response.Body.transformToString();
+      return JSON.parse(body);
+    } catch (err) {
+      if (err.name === "NoSuchKey") return null;
+      throw err;
+    }
+  }
+
+  async set(key, data, ctx) {
+    await s3.send(
+      new PutObjectCommand({
+        Bucket: BUCKET,
+        Key: `cache/${key}`,
+        Body: JSON.stringify({
+          value: data,
+          lastModified: Date.now(),
+        }),
+        ContentType: "application/json",
+      }),
+    );
+  }
+};
+```
+
+## What Works vs What Needs Setup
+
+| Feature              | Single Instance | Multi-Instance      | Notes                       |
+| -------------------- | --------------- | ------------------- | --------------------------- |
+| SSR                  | Yes             | Yes                 | No special setup            |
+| SSG                  | Yes             | Yes                 | Built at deploy time        |
+| ISR                  | Yes             | Needs cache handler | Filesystem cache breaks     |
+| Image Optimization   | Yes             | Yes                 | CPU-intensive, consider CDN |
+| Middleware           | Yes             | Yes                 | Runs on Node.js             |
+| Edge Runtime         | Limited         | Limited             | Some features Node-only     |
+| `revalidatePath/Tag` | Yes             | Needs cache handler | Must share cache            |
+| `next/font`          | Yes             | Yes                 | Fonts bundled at build      |
+| Draft Mode           | Yes             | Yes                 | Cookie-based                |
+
+## Image Optimization
+
+Next.js Image Optimization works out of the box but is CPU-intensive.
+
+### Option 1: Built-in (Simple)
+
+Works automatically, but consider:
+
+- Set `deviceSizes` and `imageSizes` in config to limit variants
+- Use `minimumCacheTTL` to reduce regeneration
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    minimumCacheTTL: 60 * 60 * 24, // 24 hours
+    deviceSizes: [640, 750, 1080, 1920], // Limit sizes
+  },
+};
+```
+
+### Option 2: External Loader (Recommended for Scale)
+
+Offload to Cloudinary, Imgix, or similar:
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    loader: "custom",
+    loaderFile: "./lib/image-loader.js",
+  },
+};
+```
+
+```js
+// lib/image-loader.js
+export default function cloudinaryLoader({ src, width, quality }) {
+  const params = ["f_auto", "c_limit", `w_${width}`, `q_${quality || "auto"}`];
+  return `https://res.cloudinary.com/demo/image/upload/${params.join(",")}${src}`;
+}
+```
+
+## Environment Variables
+
+### Build-time vs Runtime
+
+```js
+// Available at build time only (baked into bundle)
+NEXT_PUBLIC_API_URL=https://api.example.com
+
+// Available at runtime (server-side only)
+DATABASE_URL=postgresql://...
+API_SECRET=...
+```
+
+### Runtime Configuration
+
+For truly dynamic config, don't use `NEXT_PUBLIC_*`. Instead:
+
+```tsx
+// app/api/config/route.ts
+export async function GET() {
+  return Response.json({
+    apiUrl: process.env.API_URL,
+    features: process.env.FEATURES?.split(","),
+  });
+}
+```
+
+## OpenNext: Serverless Without Vercel
+
+[OpenNext](https://open-next.js.org/) adapts Next.js for AWS Lambda, Cloudflare Workers, etc.
+
+```bash
+npx create-sst@latest
+# or
+npx @opennextjs/aws build
+```
+
+Supports:
+
+- AWS Lambda + CloudFront
+- Cloudflare Workers
+- Netlify Functions
+- Deno Deploy
+
+## Health Check Endpoint
+
+Always include a health check for load balancers:
+
+```tsx
+// app/api/health/route.ts
+export async function GET() {
+  try {
+    // Optional: check database connection
+    // await db.$queryRaw`SELECT 1`;
+
+    return Response.json({ status: "healthy" }, { status: 200 });
+  } catch (error) {
+    return Response.json({ status: "unhealthy" }, { status: 503 });
+  }
+}
+```
+
+## Pre-Deployment Checklist
+
+1. **Build locally first**: `npm run build` - catch errors before deploy
+2. **Test standalone output**: `node .next/standalone/server.js`
+3. **Set `output: 'standalone'`** for Docker
+4. **Configure cache handler** for multi-instance ISR
+5. **Set `HOSTNAME="0.0.0.0"`** for containers
+6. **Copy `public/` and `.next/static/`** - not included in standalone
+7. **Add health check endpoint**
+8. **Test ISR revalidation** after deployment
+9. **Monitor memory usage** - Node.js defaults may need tuning
+
+## Testing Cache Handler
+
+**Critical**: Test your cache handler on every Next.js upgrade:
+
+```bash
+# Start multiple instances
+PORT=3001 node .next/standalone/server.js &
+PORT=3002 node .next/standalone/server.js &
+
+# Trigger ISR revalidation
+curl http://localhost:3001/api/revalidate?path=/posts
+
+# Verify both instances see the update
+curl http://localhost:3001/posts
+curl http://localhost:3002/posts
+# Should return identical content
+```
diff --git a/.claude/skills/next-best-practices/suspense-boundaries.md b/.claude/skills/next-best-practices/suspense-boundaries.md
new file mode 100644
index 000000000..20191bd4d
--- /dev/null
+++ b/.claude/skills/next-best-practices/suspense-boundaries.md
@@ -0,0 +1,67 @@
+# Suspense Boundaries
+
+Client hooks that cause CSR bailout without Suspense boundaries.
+
+## useSearchParams
+
+Always requires Suspense boundary in static routes. Without it, the entire page becomes client-side rendered.
+
+```tsx
+// Bad: Entire page becomes CSR
+"use client";
+
+import { useSearchParams } from "next/navigation";
+
+export default function SearchBar() {
+  const searchParams = useSearchParams();
+  return <div>Query: {searchParams.get("q")}</div>;
+}
+```
+
+```tsx
+// Good: Wrap in Suspense
+import { Suspense } from "react";
+import SearchBar from "./search-bar";
+
+export default function Page() {
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <SearchBar />
+    </Suspense>
+  );
+}
+```
+
+## usePathname
+
+Requires Suspense boundary when route has dynamic parameters.
+
+```tsx
+// In dynamic route [slug]
+// Bad: No Suspense
+"use client";
+import { usePathname } from "next/navigation";
+
+export function Breadcrumb() {
+  const pathname = usePathname();
+  return <nav>{pathname}</nav>;
+}
+```
+
+```tsx
+// Good: Wrap in Suspense
+<Suspense fallback={<BreadcrumbSkeleton />}>
+  <Breadcrumb />
+</Suspense>
+```
+
+If you use `generateStaticParams`, Suspense is optional.
+
+## Quick Reference
+
+| Hook                | Suspense Required    |
+| ------------------- | -------------------- |
+| `useSearchParams()` | Yes                  |
+| `usePathname()`     | Yes (dynamic routes) |
+| `useParams()`       | No                   |
+| `useRouter()`       | No                   |
diff --git a/.claude/skills/next-cache-components/SKILL.md b/.claude/skills/next-cache-components/SKILL.md
new file mode 100644
index 000000000..f94984767
--- /dev/null
+++ b/.claude/skills/next-cache-components/SKILL.md
@@ -0,0 +1,363 @@
+---
+name: next-cache-components
+description: Next.js 16 Cache Components - PPR, use cache directive, cacheLife, cacheTag, updateTag
+---
+
+# Cache Components (Next.js 16+)
+
+Cache Components enable Partial Prerendering (PPR) - mix static, cached, and dynamic content in a single route.
+
+## Enable Cache Components
+
+```ts
+// next.config.ts
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  cacheComponents: true,
+};
+
+export default nextConfig;
+```
+
+This replaces the old `experimental.ppr` flag.
+
+---
+
+## Three Content Types
+
+With Cache Components enabled, content falls into three categories:
+
+### 1. Static (Auto-Prerendered)
+
+Synchronous code, imports, pure computations - prerendered at build time:
+
+```tsx
+export default function Page() {
+  return (
+    <header>
+      <h1>Our Blog</h1> {/* Static - instant */}
+      <nav>...</nav>
+    </header>
+  );
+}
+```
+
+### 2. Cached (`use cache`)
+
+Async data that doesn't need fresh fetches every request:
+
+```tsx
+async function BlogPosts() {
+  "use cache";
+  cacheLife("hours");
+
+  const posts = await db.posts.findMany();
+  return <PostList posts={posts} />;
+}
+```
+
+### 3. Dynamic (Suspense)
+
+Runtime data that must be fresh - wrap in Suspense:
+
+```tsx
+import { Suspense } from "react";
+
+export default function Page() {
+  return (
+    <>
+      <BlogPosts /> {/* Cached */}
+      <Suspense fallback={<p>Loading...</p>}>
+        <UserPreferences /> {/* Dynamic - streams in */}
+      </Suspense>
+    </>
+  );
+}
+
+async function UserPreferences() {
+  const theme = (await cookies()).get("theme")?.value;
+  return <p>Theme: {theme}</p>;
+}
+```
+
+---
+
+## `use cache` Directive
+
+### File Level
+
+```tsx
+"use cache";
+
+export default async function Page() {
+  // Entire page is cached
+  const data = await fetchData();
+  return <div>{data}</div>;
+}
+```
+
+### Component Level
+
+```tsx
+export async function CachedComponent() {
+  "use cache";
+  const data = await fetchData();
+  return <div>{data}</div>;
+}
+```
+
+### Function Level
+
+```tsx
+export async function getData() {
+  "use cache";
+  return db.query("SELECT * FROM posts");
+}
+```
+
+---
+
+## Cache Profiles
+
+### Built-in Profiles
+
+```tsx
+"use cache"; // Default: 5m stale, 15m revalidate
+```
+
+```tsx
+"use cache: remote"; // Platform-provided cache (Redis, KV)
+```
+
+```tsx
+"use cache: private"; // For compliance, allows runtime APIs
+```
+
+### `cacheLife()` - Custom Lifetime
+
+```tsx
+import { cacheLife } from "next/cache";
+
+async function getData() {
+  "use cache";
+  cacheLife("hours"); // Built-in profile
+  return fetch("/api/data");
+}
+```
+
+Built-in profiles: `'default'`, `'minutes'`, `'hours'`, `'days'`, `'weeks'`, `'max'`
+
+### Inline Configuration
+
+```tsx
+async function getData() {
+  "use cache";
+  cacheLife({
+    stale: 3600, // 1 hour - serve stale while revalidating
+    revalidate: 7200, // 2 hours - background revalidation interval
+    expire: 86400, // 1 day - hard expiration
+  });
+  return fetch("/api/data");
+}
+```
+
+---
+
+## Cache Invalidation
+
+### `cacheTag()` - Tag Cached Content
+
+```tsx
+import { cacheTag } from "next/cache";
+
+async function getProducts() {
+  "use cache";
+  cacheTag("products");
+  return db.products.findMany();
+}
+
+async function getProduct(id: string) {
+  "use cache";
+  cacheTag("products", `product-${id}`);
+  return db.products.findUnique({ where: { id } });
+}
+```
+
+### `updateTag()` - Immediate Invalidation
+
+Use when you need the cache refreshed within the same request:
+
+```tsx
+"use server";
+
+import { updateTag } from "next/cache";
+
+export async function updateProduct(id: string, data: FormData) {
+  await db.products.update({ where: { id }, data });
+  updateTag(`product-${id}`); // Immediate - same request sees fresh data
+}
+```
+
+### `revalidateTag()` - Background Revalidation
+
+Use for stale-while-revalidate behavior:
+
+```tsx
+"use server";
+
+import { revalidateTag } from "next/cache";
+
+export async function createPost(data: FormData) {
+  await db.posts.create({ data });
+  revalidateTag("posts"); // Background - next request sees fresh data
+}
+```
+
+---
+
+## Runtime Data Constraint
+
+**Cannot** access `cookies()`, `headers()`, or `searchParams` inside `use cache`.
+
+### Solution: Pass as Arguments
+
+```tsx
+// Wrong - runtime API inside use cache
+async function CachedProfile() {
+  "use cache";
+  const session = (await cookies()).get("session")?.value; // Error!
+  return <div>{session}</div>;
+}
+
+// Correct - extract outside, pass as argument
+async function ProfilePage() {
+  const session = (await cookies()).get("session")?.value;
+  return <CachedProfile sessionId={session} />;
+}
+
+async function CachedProfile({ sessionId }: { sessionId: string }) {
+  "use cache";
+  // sessionId becomes part of cache key automatically
+  const data = await fetchUserData(sessionId);
+  return <div>{data.name}</div>;
+}
+```
+
+### Exception: `use cache: private`
+
+For compliance requirements when you can't refactor:
+
+```tsx
+async function getData() {
+  "use cache: private";
+  const session = (await cookies()).get("session")?.value; // Allowed
+  return fetchData(session);
+}
+```
+
+---
+
+## Cache Key Generation
+
+Cache keys are automatic based on:
+
+- **Build ID** - invalidates all caches on deploy
+- **Function ID** - hash of function location
+- **Serializable arguments** - props become part of key
+- **Closure variables** - outer scope values included
+
+```tsx
+async function Component({ userId }: { userId: string }) {
+  const getData = async (filter: string) => {
+    "use cache";
+    // Cache key = userId (closure) + filter (argument)
+    return fetch(`/api/users/${userId}?filter=${filter}`);
+  };
+  return getData("active");
+}
+```
+
+---
+
+## Complete Example
+
+```tsx
+import { Suspense } from "react";
+import { cookies } from "next/headers";
+import { cacheLife, cacheTag } from "next/cache";
+
+export default function DashboardPage() {
+  return (
+    <>
+      {/* Static shell - instant from CDN */}
+      <header>
+        <h1>Dashboard</h1>
+      </header>
+      <nav>...</nav>
+
+      {/* Cached - fast, revalidates hourly */}
+      <Stats />
+
+      {/* Dynamic - streams in with fresh data */}
+      <Suspense fallback={<NotificationsSkeleton />}>
+        <Notifications />
+      </Suspense>
+    </>
+  );
+}
+
+async function Stats() {
+  "use cache";
+  cacheLife("hours");
+  cacheTag("dashboard-stats");
+
+  const stats = await db.stats.aggregate();
+  return <StatsDisplay stats={stats} />;
+}
+
+async function Notifications() {
+  const userId = (await cookies()).get("userId")?.value;
+  const notifications = await db.notifications.findMany({
+    where: { userId, read: false },
+  });
+  return <NotificationList items={notifications} />;
+}
+```
+
+---
+
+## Migration from Previous Versions
+
+| Old Config                  | Replacement                        |
+| --------------------------- | ---------------------------------- |
+| `experimental.ppr`          | `cacheComponents: true`            |
+| `dynamic = 'force-dynamic'` | Remove (default behavior)          |
+| `dynamic = 'force-static'`  | `'use cache'` + `cacheLife('max')` |
+| `revalidate = N`            | `cacheLife({ revalidate: N })`     |
+| `unstable_cache()`          | `'use cache'` directive            |
+
+---
+
+## Limitations
+
+- **Edge runtime not supported** - requires Node.js
+- **Static export not supported** - needs server
+- **Non-deterministic values** (`Math.random()`, `Date.now()`) execute once at build time inside `use cache`
+
+For request-time randomness outside cache:
+
+```tsx
+import { connection } from "next/server";
+
+async function DynamicContent() {
+  await connection(); // Defer to request time
+  const id = crypto.randomUUID(); // Different per request
+  return <div>{id}</div>;
+}
+```
+
+Sources:
+
+- [Cache Components Guide](https://nextjs.org/docs/app/getting-started/cache-components)
+- [use cache Directive](https://nextjs.org/docs/app/api-reference/directives/use-cache)
diff --git a/.claude/skills/next-upgrade/SKILL.md b/.claude/skills/next-upgrade/SKILL.md
new file mode 100644
index 000000000..a34078ac5
--- /dev/null
+++ b/.claude/skills/next-upgrade/SKILL.md
@@ -0,0 +1,54 @@
+---
+name: next-upgrade
+description: Upgrade Next.js to the latest version following official migration guides and codemods
+argument-hint: "[target-version]"
+---
+
+# Upgrade Next.js
+
+Upgrade the current project to the latest Next.js version following official migration guides.
+
+## Instructions
+
+1. **Detect current version**: Read `package.json` to identify the current Next.js version and related dependencies (React, React DOM, etc.)
+
+2. **Fetch the latest upgrade guide**: Use WebFetch to get the official upgrade documentation:
+   - Codemods: https://nextjs.org/docs/app/guides/upgrading/codemods
+   - Version-specific guides (adjust version as needed):
+     - https://nextjs.org/docs/app/guides/upgrading/version-16
+     - https://nextjs.org/docs/app/guides/upgrading/version-15
+     - https://nextjs.org/docs/app/guides/upgrading/version-14
+
+3. **Determine upgrade path**: Based on current version, identify which migration steps apply. For major version jumps, upgrade incrementally (e.g., 13 → 14 → 15).
+
+4. **Run codemods first**: Next.js provides codemods to automate breaking changes:
+
+   ```bash
+   npx @next/codemod@latest <transform> <path>
+   ```
+
+   Common transforms:
+   - `next-async-request-api` - Updates async Request APIs (v15)
+   - `next-request-geo-ip` - Migrates geo/ip properties (v15)
+   - `next-dynamic-access-named-export` - Transforms dynamic imports (v15)
+
+5. **Update dependencies**: Upgrade Next.js and peer dependencies together:
+
+   ```bash
+   npm install next@latest react@latest react-dom@latest
+   ```
+
+6. **Review breaking changes**: Check the upgrade guide for manual changes needed:
+   - API changes (e.g., async params in v15)
+   - Configuration changes in `next.config.js`
+   - Deprecated features being removed
+
+7. **Update TypeScript types** (if applicable):
+
+   ```bash
+   npm install @types/react@latest @types/react-dom@latest
+   ```
+
+8. **Test the upgrade**:
+   - Run `npm run build` to check for build errors
+   - Run `npm run dev` and test key functionality
diff --git a/.claude/skills/projects b/.claude/skills/projects
deleted file mode 120000
index 21b8af1f9..000000000
--- a/.claude/skills/projects
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/projects
\ No newline at end of file
diff --git a/.agents/skills/projects/SKILL.md b/.claude/skills/projects/SKILL.md
similarity index 100%
rename from .agents/skills/projects/SKILL.md
rename to .claude/skills/projects/SKILL.md
diff --git a/.agents/skills/projects/references/environment-config.md b/.claude/skills/projects/references/environment-config.md
similarity index 100%
rename from .agents/skills/projects/references/environment-config.md
rename to .claude/skills/projects/references/environment-config.md
diff --git a/.agents/skills/projects/references/monorepo.md b/.claude/skills/projects/references/monorepo.md
similarity index 100%
rename from .agents/skills/projects/references/monorepo.md
rename to .claude/skills/projects/references/monorepo.md
diff --git a/.agents/skills/projects/references/railpack.md b/.claude/skills/projects/references/railpack.md
similarity index 100%
rename from .agents/skills/projects/references/railpack.md
rename to .claude/skills/projects/references/railpack.md
diff --git a/.agents/skills/projects/references/variables.md b/.claude/skills/projects/references/variables.md
similarity index 100%
rename from .agents/skills/projects/references/variables.md
rename to .claude/skills/projects/references/variables.md
diff --git a/.agents/skills/projects/scripts/railway-api.sh b/.claude/skills/projects/scripts/railway-api.sh
similarity index 100%
rename from .agents/skills/projects/scripts/railway-api.sh
rename to .claude/skills/projects/scripts/railway-api.sh
diff --git a/.claude/skills/railway-docs b/.claude/skills/railway-docs
deleted file mode 120000
index c6a23ffb1..000000000
--- a/.claude/skills/railway-docs
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/railway-docs
\ No newline at end of file
diff --git a/.agents/skills/railway-docs/SKILL.md b/.claude/skills/railway-docs/SKILL.md
similarity index 100%
rename from .agents/skills/railway-docs/SKILL.md
rename to .claude/skills/railway-docs/SKILL.md
diff --git a/.agents/skills/railway-docs/references/environment-config.md b/.claude/skills/railway-docs/references/environment-config.md
similarity index 100%
rename from .agents/skills/railway-docs/references/environment-config.md
rename to .claude/skills/railway-docs/references/environment-config.md
diff --git a/.agents/skills/railway-docs/references/monorepo.md b/.claude/skills/railway-docs/references/monorepo.md
similarity index 100%
rename from .agents/skills/railway-docs/references/monorepo.md
rename to .claude/skills/railway-docs/references/monorepo.md
diff --git a/.agents/skills/railway-docs/references/railpack.md b/.claude/skills/railway-docs/references/railpack.md
similarity index 100%
rename from .agents/skills/railway-docs/references/railpack.md
rename to .claude/skills/railway-docs/references/railpack.md
diff --git a/.agents/skills/railway-docs/references/variables.md b/.claude/skills/railway-docs/references/variables.md
similarity index 100%
rename from .agents/skills/railway-docs/references/variables.md
rename to .claude/skills/railway-docs/references/variables.md
diff --git a/.claude/skills/service b/.claude/skills/service
deleted file mode 120000
index 057548971..000000000
--- a/.claude/skills/service
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/service
\ No newline at end of file
diff --git a/.agents/skills/service/SKILL.md b/.claude/skills/service/SKILL.md
similarity index 100%
rename from .agents/skills/service/SKILL.md
rename to .claude/skills/service/SKILL.md
diff --git a/.agents/skills/service/references/environment-config.md b/.claude/skills/service/references/environment-config.md
similarity index 100%
rename from .agents/skills/service/references/environment-config.md
rename to .claude/skills/service/references/environment-config.md
diff --git a/.agents/skills/service/references/monorepo.md b/.claude/skills/service/references/monorepo.md
similarity index 100%
rename from .agents/skills/service/references/monorepo.md
rename to .claude/skills/service/references/monorepo.md
diff --git a/.agents/skills/service/references/railpack.md b/.claude/skills/service/references/railpack.md
similarity index 100%
rename from .agents/skills/service/references/railpack.md
rename to .claude/skills/service/references/railpack.md
diff --git a/.agents/skills/service/references/variables.md b/.claude/skills/service/references/variables.md
similarity index 100%
rename from .agents/skills/service/references/variables.md
rename to .claude/skills/service/references/variables.md
diff --git a/.agents/skills/service/scripts/railway-api.sh b/.claude/skills/service/scripts/railway-api.sh
similarity index 100%
rename from .agents/skills/service/scripts/railway-api.sh
rename to .claude/skills/service/scripts/railway-api.sh
diff --git a/.claude/skills/status b/.claude/skills/status
deleted file mode 120000
index ed1a999b4..000000000
--- a/.claude/skills/status
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/status
\ No newline at end of file
diff --git a/.agents/skills/status/SKILL.md b/.claude/skills/status/SKILL.md
similarity index 100%
rename from .agents/skills/status/SKILL.md
rename to .claude/skills/status/SKILL.md
diff --git a/.agents/skills/status/references/environment-config.md b/.claude/skills/status/references/environment-config.md
similarity index 100%
rename from .agents/skills/status/references/environment-config.md
rename to .claude/skills/status/references/environment-config.md
diff --git a/.agents/skills/status/references/monorepo.md b/.claude/skills/status/references/monorepo.md
similarity index 100%
rename from .agents/skills/status/references/monorepo.md
rename to .claude/skills/status/references/monorepo.md
diff --git a/.agents/skills/status/references/railpack.md b/.claude/skills/status/references/railpack.md
similarity index 100%
rename from .agents/skills/status/references/railpack.md
rename to .claude/skills/status/references/railpack.md
diff --git a/.agents/skills/status/references/variables.md b/.claude/skills/status/references/variables.md
similarity index 100%
rename from .agents/skills/status/references/variables.md
rename to .claude/skills/status/references/variables.md
diff --git a/.claude/skills/templates b/.claude/skills/templates
deleted file mode 120000
index 5ec92cf5a..000000000
--- a/.claude/skills/templates
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/templates
\ No newline at end of file
diff --git a/.agents/skills/templates/SKILL.md b/.claude/skills/templates/SKILL.md
similarity index 100%
rename from .agents/skills/templates/SKILL.md
rename to .claude/skills/templates/SKILL.md
diff --git a/.agents/skills/templates/references/environment-config.md b/.claude/skills/templates/references/environment-config.md
similarity index 100%
rename from .agents/skills/templates/references/environment-config.md
rename to .claude/skills/templates/references/environment-config.md
diff --git a/.agents/skills/templates/references/monorepo.md b/.claude/skills/templates/references/monorepo.md
similarity index 100%
rename from .agents/skills/templates/references/monorepo.md
rename to .claude/skills/templates/references/monorepo.md
diff --git a/.agents/skills/templates/references/railpack.md b/.claude/skills/templates/references/railpack.md
similarity index 100%
rename from .agents/skills/templates/references/railpack.md
rename to .claude/skills/templates/references/railpack.md
diff --git a/.agents/skills/templates/references/variables.md b/.claude/skills/templates/references/variables.md
similarity index 100%
rename from .agents/skills/templates/references/variables.md
rename to .claude/skills/templates/references/variables.md
diff --git a/.agents/skills/templates/scripts/railway-api.sh b/.claude/skills/templates/scripts/railway-api.sh
similarity index 100%
rename from .agents/skills/templates/scripts/railway-api.sh
rename to .claude/skills/templates/scripts/railway-api.sh
diff --git a/.claude/skills/vercel-composition-patterns/AGENTS.md b/.claude/skills/vercel-composition-patterns/AGENTS.md
new file mode 100644
index 000000000..7c3202d0e
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/AGENTS.md
@@ -0,0 +1,951 @@
+# React Composition Patterns
+
+**Version 1.0.0**  
+Engineering  
+January 2026
+
+> **Note:**  
+> This document is mainly for agents and LLMs to follow when maintaining,  
+> generating, or refactoring React codebases using composition. Humans  
+> may also find it useful, but guidance here is optimized for automation  
+> and consistency by AI-assisted workflows.
+
+---
+
+## Abstract
+
+Composition patterns for building flexible, maintainable React components. Avoid boolean prop proliferation by using compound components, lifting state, and composing internals. These patterns make codebases easier for both humans and AI agents to work with as they scale.
+
+---
+
+## Table of Contents
+
+1. [Component Architecture](#1-component-architecture) — **HIGH**
+   - 1.1 [Avoid Boolean Prop Proliferation](#11-avoid-boolean-prop-proliferation)
+   - 1.2 [Use Compound Components](#12-use-compound-components)
+2. [State Management](#2-state-management) — **MEDIUM**
+   - 2.1 [Decouple State Management from UI](#21-decouple-state-management-from-ui)
+   - 2.2 [Define Generic Context Interfaces for Dependency Injection](#22-define-generic-context-interfaces-for-dependency-injection)
+   - 2.3 [Lift State into Provider Components](#23-lift-state-into-provider-components)
+3. [Implementation Patterns](#3-implementation-patterns) — **MEDIUM**
+   - 3.1 [Create Explicit Component Variants](#31-create-explicit-component-variants)
+   - 3.2 [Prefer Composing Children Over Render Props](#32-prefer-composing-children-over-render-props)
+4. [React 19 APIs](#4-react-19-apis) — **MEDIUM**
+   - 4.1 [React 19 API Changes](#41-react-19-api-changes)
+
+---
+
+## 1. Component Architecture
+
+**Impact: HIGH**
+
+Fundamental patterns for structuring components to avoid prop
+proliferation and enable flexible composition.
+
+### 1.1 Avoid Boolean Prop Proliferation
+
+**Impact: CRITICAL (prevents unmaintainable component variants)**
+
+Don't add boolean props like `isThread`, `isEditing`, `isDMThread` to customize
+
+component behavior. Each boolean doubles possible states and creates
+
+unmaintainable conditional logic. Use composition instead.
+
+**Incorrect: boolean props create exponential complexity**
+
+```tsx
+function Composer({
+  onSubmit,
+  isThread,
+  channelId,
+  isDMThread,
+  dmId,
+  isEditing,
+  isForwarding,
+}: Props) {
+  return (
+    <form>
+      <Header />
+      <Input />
+      {isDMThread ? (
+        <AlsoSendToDMField id={dmId} />
+      ) : isThread ? (
+        <AlsoSendToChannelField id={channelId} />
+      ) : null}
+      {isEditing ? (
+        <EditActions />
+      ) : isForwarding ? (
+        <ForwardActions />
+      ) : (
+        <DefaultActions />
+      )}
+      <Footer onSubmit={onSubmit} />
+    </form>
+  );
+}
+```
+
+**Correct: composition eliminates conditionals**
+
+```tsx
+// Channel composer
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Attachments />
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Thread composer - adds "also send to channel" field
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <AlsoSendToChannelField id={channelId} />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Edit composer - different footer actions
+function EditComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.CancelEdit />
+        <Composer.SaveEdit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+```
+
+Each variant is explicit about what it renders. We can share internals without
+
+sharing a single monolithic parent.
+
+### 1.2 Use Compound Components
+
+**Impact: HIGH (enables flexible composition without prop drilling)**
+
+Structure complex components as compound components with a shared context. Each
+
+subcomponent accesses shared state via context, not props. Consumers compose the
+
+pieces they need.
+
+**Incorrect: monolithic component with render props**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+  showAttachments,
+  showFormatting,
+  showEmojis,
+}: Props) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {showAttachments && <Attachments />}
+      {renderFooter ? (
+        renderFooter()
+      ) : (
+        <Footer>
+          {showFormatting && <Formatting />}
+          {showEmojis && <Emojis />}
+          {renderActions?.()}
+        </Footer>
+      )}
+    </form>
+  );
+}
+```
+
+**Correct: compound components with shared context**
+
+```tsx
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+
+function ComposerProvider({ children, state, actions, meta }: ProviderProps) {
+  return (
+    <ComposerContext value={{ state, actions, meta }}>
+      {children}
+    </ComposerContext>
+  );
+}
+
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta: { inputRef },
+  } = use(ComposerContext);
+  return (
+    <TextInput
+      ref={inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+
+function ComposerSubmit() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Send</Button>;
+}
+
+// Export as compound component
+const Composer = {
+  Provider: ComposerProvider,
+  Frame: ComposerFrame,
+  Input: ComposerInput,
+  Submit: ComposerSubmit,
+  Header: ComposerHeader,
+  Footer: ComposerFooter,
+  Attachments: ComposerAttachments,
+  Formatting: ComposerFormatting,
+  Emojis: ComposerEmojis,
+};
+```
+
+**Usage:**
+
+```tsx
+<Composer.Provider state={state} actions={actions} meta={meta}>
+  <Composer.Frame>
+    <Composer.Header />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Submit />
+    </Composer.Footer>
+  </Composer.Frame>
+</Composer.Provider>
+```
+
+Consumers explicitly compose exactly what they need. No hidden conditionals. And the state, actions and meta are dependency-injected by a parent provider, allowing multiple usages of the same component structure.
+
+---
+
+## 2. State Management
+
+**Impact: MEDIUM**
+
+Patterns for lifting state and managing shared context across
+composed components.
+
+### 2.1 Decouple State Management from UI
+
+**Impact: MEDIUM (enables swapping state implementations without changing UI)**
+
+The provider component should be the only place that knows how state is managed.
+
+UI components consume the context interface—they don't know if state comes from
+
+useState, Zustand, or a server sync.
+
+**Incorrect: UI coupled to state implementation**
+
+```tsx
+function ChannelComposer({ channelId }: { channelId: string }) {
+  // UI component knows about global state implementation
+  const state = useGlobalChannelState(channelId);
+  const { submit, updateInput } = useChannelSync(channelId);
+
+  return (
+    <Composer.Frame>
+      <Composer.Input
+        value={state.input}
+        onChange={(text) => sync.updateInput(text)}
+      />
+      <Composer.Submit onPress={() => sync.submit()} />
+    </Composer.Frame>
+  );
+}
+```
+
+**Correct: state management isolated in provider**
+
+```tsx
+// Provider handles all state management details
+function ChannelProvider({
+  channelId,
+  children,
+}: {
+  channelId: string;
+  children: React.ReactNode;
+}) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update, submit }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// UI component only knows about the context interface
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Usage
+function Channel({ channelId }: { channelId: string }) {
+  return (
+    <ChannelProvider channelId={channelId}>
+      <ChannelComposer />
+    </ChannelProvider>
+  );
+}
+```
+
+**Different providers, same UI:**
+
+```tsx
+// Local state for ephemeral forms
+function ForwardMessageProvider({ children }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// Global synced state for channels
+function ChannelProvider({ channelId, children }) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+
+  return (
+    <Composer.Provider state={state} actions={{ update, submit }}>
+      {children}
+    </Composer.Provider>
+  );
+}
+```
+
+The same `Composer.Input` component works with both providers because it only
+
+depends on the context interface, not the implementation.
+
+### 2.2 Define Generic Context Interfaces for Dependency Injection
+
+**Impact: HIGH (enables dependency-injectable state across use-cases)**
+
+Define a **generic interface** for your component context with three parts:
+
+`state`, `actions`, and `meta`. This interface is a contract that any provider
+
+can implement—enabling the same UI components to work with completely different
+
+state implementations.
+
+**Core principle:** Lift state, compose internals, make state
+
+dependency-injectable.
+
+**Incorrect: UI coupled to specific state implementation**
+
+```tsx
+function ComposerInput() {
+  // Tightly coupled to a specific hook
+  const { input, setInput } = useChannelComposerState();
+  return <TextInput value={input} onChangeText={setInput} />;
+}
+```
+
+**Correct: generic interface enables dependency injection**
+
+```tsx
+// Define a GENERIC interface that any provider can implement
+interface ComposerState {
+  input: string;
+  attachments: Attachment[];
+  isSubmitting: boolean;
+}
+
+interface ComposerActions {
+  update: (updater: (state: ComposerState) => ComposerState) => void;
+  submit: () => void;
+}
+
+interface ComposerMeta {
+  inputRef: React.RefObject<TextInput>;
+}
+
+interface ComposerContextValue {
+  state: ComposerState;
+  actions: ComposerActions;
+  meta: ComposerMeta;
+}
+
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+```
+
+**UI components consume the interface, not the implementation:**
+
+```tsx
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta,
+  } = use(ComposerContext);
+
+  // This component works with ANY provider that implements the interface
+  return (
+    <TextInput
+      ref={meta.inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+```
+
+**Different providers implement the same interface:**
+
+```tsx
+// Provider A: Local state for ephemeral forms
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const inputRef = useRef(null);
+  const submit = useForwardMessage();
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update: setState, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+
+// Provider B: Global synced state for channels
+function ChannelProvider({ channelId, children }: Props) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+```
+
+**The same composed UI works with both:**
+
+```tsx
+// Works with ForwardMessageProvider (local state)
+<ForwardMessageProvider>
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ForwardMessageProvider>
+
+// Works with ChannelProvider (global synced state)
+<ChannelProvider channelId="abc">
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ChannelProvider>
+```
+
+**Custom UI outside the component can access state and actions:**
+
+```tsx
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        {/* The composer UI */}
+        <Composer.Frame>
+          <Composer.Input placeholder="Add a message, if you'd like." />
+          <Composer.Footer>
+            <Composer.Formatting />
+            <Composer.Emojis />
+          </Composer.Footer>
+        </Composer.Frame>
+
+        {/* Custom UI OUTSIDE the composer, but INSIDE the provider */}
+        <MessagePreview />
+
+        {/* Actions at the bottom of the dialog */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+// This button lives OUTSIDE Composer.Frame but can still submit based on its context!
+function ForwardButton() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Forward</Button>;
+}
+
+// This preview lives OUTSIDE Composer.Frame but can read composer's state!
+function MessagePreview() {
+  const { state } = use(ComposerContext);
+  return <Preview message={state.input} attachments={state.attachments} />;
+}
+```
+
+The provider boundary is what matters—not the visual nesting. Components that
+
+need shared state don't have to be inside the `Composer.Frame`. They just need
+
+to be within the provider.
+
+The `ForwardButton` and `MessagePreview` are not visually inside the composer
+
+box, but they can still access its state and actions. This is the power of
+
+lifting state into providers.
+
+The UI is reusable bits you compose together. The state is dependency-injected
+
+by the provider. Swap the provider, keep the UI.
+
+### 2.3 Lift State into Provider Components
+
+**Impact: HIGH (enables state sharing outside component boundaries)**
+
+Move state management into dedicated provider components. This allows sibling
+
+components outside the main UI to access and modify state without prop drilling
+
+or awkward refs.
+
+**Incorrect: state trapped inside component**
+
+```tsx
+function ForwardMessageComposer() {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer />
+    </Composer.Frame>
+  );
+}
+
+// Problem: How does this button access composer state?
+function ForwardMessageDialog() {
+  return (
+    <Dialog>
+      <ForwardMessageComposer />
+      <MessagePreview /> {/* Needs composer state */}
+      <DialogActions>
+        <CancelButton />
+        <ForwardButton /> {/* Needs to call submit */}
+      </DialogActions>
+    </Dialog>
+  );
+}
+```
+
+**Incorrect: useEffect to sync state up**
+
+```tsx
+function ForwardMessageDialog() {
+  const [input, setInput] = useState("");
+  return (
+    <Dialog>
+      <ForwardMessageComposer onInputChange={setInput} />
+      <MessagePreview input={input} />
+    </Dialog>
+  );
+}
+
+function ForwardMessageComposer({ onInputChange }) {
+  const [state, setState] = useState(initialState);
+  useEffect(() => {
+    onInputChange(state.input); // Sync on every change 😬
+  }, [state.input]);
+}
+```
+
+**Incorrect: reading state from ref on submit**
+
+```tsx
+function ForwardMessageDialog() {
+  const stateRef = useRef(null);
+  return (
+    <Dialog>
+      <ForwardMessageComposer stateRef={stateRef} />
+      <ForwardButton onPress={() => submit(stateRef.current)} />
+    </Dialog>
+  );
+}
+```
+
+**Correct: state lifted to provider**
+
+```tsx
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        <ForwardMessageComposer />
+        <MessagePreview />{" "}
+        {/* Custom components can access state and actions */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />{" "}
+          {/* Custom components can access state and actions */}
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+function ForwardButton() {
+  const { actions } = use(Composer.Context);
+  return <Button onPress={actions.submit}>Forward</Button>;
+}
+```
+
+The ForwardButton lives outside the Composer.Frame but still has access to the
+
+submit action because it's within the provider. Even though it's a one-off
+
+component, it can still access the composer's state and actions from outside the
+
+UI itself.
+
+**Key insight:** Components that need shared state don't have to be visually
+
+nested inside each other—they just need to be within the same provider.
+
+---
+
+## 3. Implementation Patterns
+
+**Impact: MEDIUM**
+
+Specific techniques for implementing compound components and
+context providers.
+
+### 3.1 Create Explicit Component Variants
+
+**Impact: MEDIUM (self-documenting code, no hidden conditionals)**
+
+Instead of one component with many boolean props, create explicit variant
+
+components. Each variant composes the pieces it needs. The code documents
+
+itself.
+
+**Incorrect: one component, many modes**
+
+```tsx
+// What does this component actually render?
+<Composer
+  isThread
+  isEditing={false}
+  channelId="abc"
+  showAttachments
+  showFormatting={false}
+/>
+```
+
+**Correct: explicit variants**
+
+```tsx
+// Immediately clear what this renders
+<ThreadComposer channelId="abc" />
+
+// Or
+<EditMessageComposer messageId="xyz" />
+
+// Or
+<ForwardMessageComposer messageId="123" />
+```
+
+Each implementation is unique, explicit and self-contained. Yet they can each
+
+use shared parts.
+
+**Implementation:**
+
+```tsx
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <ThreadProvider channelId={channelId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <AlsoSendToChannelField channelId={channelId} />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Submit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ThreadProvider>
+  );
+}
+
+function EditMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <EditMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.CancelEdit />
+          <Composer.SaveEdit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </EditMessageProvider>
+  );
+}
+
+function ForwardMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <ForwardMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input placeholder="Add a message, if you'd like." />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Mentions />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ForwardMessageProvider>
+  );
+}
+```
+
+Each variant is explicit about:
+
+- What provider/state it uses
+
+- What UI elements it includes
+
+- What actions are available
+
+No boolean prop combinations to reason about. No impossible states.
+
+### 3.2 Prefer Composing Children Over Render Props
+
+**Impact: MEDIUM (cleaner composition, better readability)**
+
+Use `children` for composition instead of `renderX` props. Children are more
+
+readable, compose naturally, and don't require understanding callback
+
+signatures.
+
+**Incorrect: render props**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+}: {
+  renderHeader?: () => React.ReactNode;
+  renderFooter?: () => React.ReactNode;
+  renderActions?: () => React.ReactNode;
+}) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {renderFooter ? renderFooter() : <DefaultFooter />}
+      {renderActions?.()}
+    </form>
+  );
+}
+
+// Usage is awkward and inflexible
+return (
+  <Composer
+    renderHeader={() => <CustomHeader />}
+    renderFooter={() => (
+      <>
+        <Formatting />
+        <Emojis />
+      </>
+    )}
+    renderActions={() => <SubmitButton />}
+  />
+);
+```
+
+**Correct: compound components with children**
+
+```tsx
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerFooter({ children }: { children: React.ReactNode }) {
+  return <footer className="flex">{children}</footer>;
+}
+
+// Usage is flexible
+return (
+  <Composer.Frame>
+    <CustomHeader />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Emojis />
+      <SubmitButton />
+    </Composer.Footer>
+  </Composer.Frame>
+);
+```
+
+**When render props are appropriate:**
+
+```tsx
+// Render props work well when you need to pass data back
+<List
+  data={items}
+  renderItem={({ item, index }) => <Item item={item} index={index} />}
+/>
+```
+
+Use render props when the parent needs to provide data or state to the child.
+
+Use children when composing static structure.
+
+---
+
+## 4. React 19 APIs
+
+**Impact: MEDIUM**
+
+React 19+ only. Don't use `forwardRef`; use `use()` instead of `useContext()`.
+
+### 4.1 React 19 API Changes
+
+**Impact: MEDIUM (cleaner component definitions and context usage)**
+
+> **⚠️ React 19+ only.** Skip this if you're on React 18 or earlier.
+
+In React 19, `ref` is now a regular prop (no `forwardRef` wrapper needed), and `use()` replaces `useContext()`.
+
+**Incorrect: forwardRef in React 19**
+
+```tsx
+const ComposerInput = forwardRef<TextInput, Props>((props, ref) => {
+  return <TextInput ref={ref} {...props} />;
+});
+```
+
+**Correct: ref as a regular prop**
+
+```tsx
+function ComposerInput({
+  ref,
+  ...props
+}: Props & { ref?: React.Ref<TextInput> }) {
+  return <TextInput ref={ref} {...props} />;
+}
+```
+
+**Incorrect: useContext in React 19**
+
+```tsx
+const value = useContext(MyContext);
+```
+
+**Correct: use instead of useContext**
+
+```tsx
+const value = use(MyContext);
+```
+
+`use()` can also be called conditionally, unlike `useContext()`.
+
+---
+
+## References
+
+1. [https://react.dev](https://react.dev)
+2. [https://react.dev/learn/passing-data-deeply-with-context](https://react.dev/learn/passing-data-deeply-with-context)
+3. [https://react.dev/reference/react/use](https://react.dev/reference/react/use)
diff --git a/.claude/skills/vercel-composition-patterns/SKILL.md b/.claude/skills/vercel-composition-patterns/SKILL.md
new file mode 100644
index 000000000..d8a4672f0
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/SKILL.md
@@ -0,0 +1,89 @@
+---
+name: vercel-composition-patterns
+description:
+  React composition patterns that scale. Use when refactoring components with
+  boolean prop proliferation, building flexible component libraries, or
+  designing reusable APIs. Triggers on tasks involving compound components,
+  render props, context providers, or component architecture. Includes React 19
+  API changes.
+license: MIT
+metadata:
+  author: vercel
+  version: "1.0.0"
+---
+
+# React Composition Patterns
+
+Composition patterns for building flexible, maintainable React components. Avoid
+boolean prop proliferation by using compound components, lifting state, and
+composing internals. These patterns make codebases easier for both humans and AI
+agents to work with as they scale.
+
+## When to Apply
+
+Reference these guidelines when:
+
+- Refactoring components with many boolean props
+- Building reusable component libraries
+- Designing flexible component APIs
+- Reviewing component architecture
+- Working with compound components or context providers
+
+## Rule Categories by Priority
+
+| Priority | Category                | Impact | Prefix          |
+| -------- | ----------------------- | ------ | --------------- |
+| 1        | Component Architecture  | HIGH   | `architecture-` |
+| 2        | State Management        | MEDIUM | `state-`        |
+| 3        | Implementation Patterns | MEDIUM | `patterns-`     |
+| 4        | React 19 APIs           | MEDIUM | `react19-`      |
+
+## Quick Reference
+
+### 1. Component Architecture (HIGH)
+
+- `architecture-avoid-boolean-props` - Don't add boolean props to customize
+  behavior; use composition
+- `architecture-compound-components` - Structure complex components with shared
+  context
+
+### 2. State Management (MEDIUM)
+
+- `state-decouple-implementation` - Provider is the only place that knows how
+  state is managed
+- `state-context-interface` - Define generic interface with state, actions, meta
+  for dependency injection
+- `state-lift-state` - Move state into provider components for sibling access
+
+### 3. Implementation Patterns (MEDIUM)
+
+- `patterns-explicit-variants` - Create explicit variant components instead of
+  boolean modes
+- `patterns-children-over-render-props` - Use children for composition instead
+  of renderX props
+
+### 4. React 19 APIs (MEDIUM)
+
+> **⚠️ React 19+ only.** Skip this section if using React 18 or earlier.
+
+- `react19-no-forwardref` - Don't use `forwardRef`; use `use()` instead of `useContext()`
+
+## How to Use
+
+Read individual rule files for detailed explanations and code examples:
+
+```
+rules/architecture-avoid-boolean-props.md
+rules/state-context-interface.md
+```
+
+Each rule file contains:
+
+- Brief explanation of why it matters
+- Incorrect code example with explanation
+- Correct code example with explanation
+- Additional context and references
+
+## Full Compiled Document
+
+For the complete guide with all rules expanded: `AGENTS.md`
diff --git a/.claude/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md b/.claude/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md
new file mode 100644
index 000000000..48ff5c164
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md
@@ -0,0 +1,100 @@
+---
+title: Avoid Boolean Prop Proliferation
+impact: CRITICAL
+impactDescription: prevents unmaintainable component variants
+tags: composition, props, architecture
+---
+
+## Avoid Boolean Prop Proliferation
+
+Don't add boolean props like `isThread`, `isEditing`, `isDMThread` to customize
+component behavior. Each boolean doubles possible states and creates
+unmaintainable conditional logic. Use composition instead.
+
+**Incorrect (boolean props create exponential complexity):**
+
+```tsx
+function Composer({
+  onSubmit,
+  isThread,
+  channelId,
+  isDMThread,
+  dmId,
+  isEditing,
+  isForwarding,
+}: Props) {
+  return (
+    <form>
+      <Header />
+      <Input />
+      {isDMThread ? (
+        <AlsoSendToDMField id={dmId} />
+      ) : isThread ? (
+        <AlsoSendToChannelField id={channelId} />
+      ) : null}
+      {isEditing ? (
+        <EditActions />
+      ) : isForwarding ? (
+        <ForwardActions />
+      ) : (
+        <DefaultActions />
+      )}
+      <Footer onSubmit={onSubmit} />
+    </form>
+  );
+}
+```
+
+**Correct (composition eliminates conditionals):**
+
+```tsx
+// Channel composer
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Attachments />
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Thread composer - adds "also send to channel" field
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <AlsoSendToChannelField id={channelId} />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Edit composer - different footer actions
+function EditComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.CancelEdit />
+        <Composer.SaveEdit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+```
+
+Each variant is explicit about what it renders. We can share internals without
+sharing a single monolithic parent.
diff --git a/.claude/skills/vercel-composition-patterns/rules/architecture-compound-components.md b/.claude/skills/vercel-composition-patterns/rules/architecture-compound-components.md
new file mode 100644
index 000000000..65c784bdf
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/architecture-compound-components.md
@@ -0,0 +1,112 @@
+---
+title: Use Compound Components
+impact: HIGH
+impactDescription: enables flexible composition without prop drilling
+tags: composition, compound-components, architecture
+---
+
+## Use Compound Components
+
+Structure complex components as compound components with a shared context. Each
+subcomponent accesses shared state via context, not props. Consumers compose the
+pieces they need.
+
+**Incorrect (monolithic component with render props):**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+  showAttachments,
+  showFormatting,
+  showEmojis,
+}: Props) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {showAttachments && <Attachments />}
+      {renderFooter ? (
+        renderFooter()
+      ) : (
+        <Footer>
+          {showFormatting && <Formatting />}
+          {showEmojis && <Emojis />}
+          {renderActions?.()}
+        </Footer>
+      )}
+    </form>
+  );
+}
+```
+
+**Correct (compound components with shared context):**
+
+```tsx
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+
+function ComposerProvider({ children, state, actions, meta }: ProviderProps) {
+  return (
+    <ComposerContext value={{ state, actions, meta }}>
+      {children}
+    </ComposerContext>
+  );
+}
+
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta: { inputRef },
+  } = use(ComposerContext);
+  return (
+    <TextInput
+      ref={inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+
+function ComposerSubmit() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Send</Button>;
+}
+
+// Export as compound component
+const Composer = {
+  Provider: ComposerProvider,
+  Frame: ComposerFrame,
+  Input: ComposerInput,
+  Submit: ComposerSubmit,
+  Header: ComposerHeader,
+  Footer: ComposerFooter,
+  Attachments: ComposerAttachments,
+  Formatting: ComposerFormatting,
+  Emojis: ComposerEmojis,
+};
+```
+
+**Usage:**
+
+```tsx
+<Composer.Provider state={state} actions={actions} meta={meta}>
+  <Composer.Frame>
+    <Composer.Header />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Submit />
+    </Composer.Footer>
+  </Composer.Frame>
+</Composer.Provider>
+```
+
+Consumers explicitly compose exactly what they need. No hidden conditionals. And the state, actions and meta are dependency-injected by a parent provider, allowing multiple usages of the same component structure.
diff --git a/.claude/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md b/.claude/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md
new file mode 100644
index 000000000..129a249fa
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md
@@ -0,0 +1,87 @@
+---
+title: Prefer Composing Children Over Render Props
+impact: MEDIUM
+impactDescription: cleaner composition, better readability
+tags: composition, children, render-props
+---
+
+## Prefer Children Over Render Props
+
+Use `children` for composition instead of `renderX` props. Children are more
+readable, compose naturally, and don't require understanding callback
+signatures.
+
+**Incorrect (render props):**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+}: {
+  renderHeader?: () => React.ReactNode;
+  renderFooter?: () => React.ReactNode;
+  renderActions?: () => React.ReactNode;
+}) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {renderFooter ? renderFooter() : <DefaultFooter />}
+      {renderActions?.()}
+    </form>
+  );
+}
+
+// Usage is awkward and inflexible
+return (
+  <Composer
+    renderHeader={() => <CustomHeader />}
+    renderFooter={() => (
+      <>
+        <Formatting />
+        <Emojis />
+      </>
+    )}
+    renderActions={() => <SubmitButton />}
+  />
+);
+```
+
+**Correct (compound components with children):**
+
+```tsx
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerFooter({ children }: { children: React.ReactNode }) {
+  return <footer className="flex">{children}</footer>;
+}
+
+// Usage is flexible
+return (
+  <Composer.Frame>
+    <CustomHeader />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Emojis />
+      <SubmitButton />
+    </Composer.Footer>
+  </Composer.Frame>
+);
+```
+
+**When render props are appropriate:**
+
+```tsx
+// Render props work well when you need to pass data back
+<List
+  data={items}
+  renderItem={({ item, index }) => <Item item={item} index={index} />}
+/>
+```
+
+Use render props when the parent needs to provide data or state to the child.
+Use children when composing static structure.
diff --git a/.claude/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md b/.claude/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md
new file mode 100644
index 000000000..509e3608b
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md
@@ -0,0 +1,100 @@
+---
+title: Create Explicit Component Variants
+impact: MEDIUM
+impactDescription: self-documenting code, no hidden conditionals
+tags: composition, variants, architecture
+---
+
+## Create Explicit Component Variants
+
+Instead of one component with many boolean props, create explicit variant
+components. Each variant composes the pieces it needs. The code documents
+itself.
+
+**Incorrect (one component, many modes):**
+
+```tsx
+// What does this component actually render?
+<Composer
+  isThread
+  isEditing={false}
+  channelId="abc"
+  showAttachments
+  showFormatting={false}
+/>
+```
+
+**Correct (explicit variants):**
+
+```tsx
+// Immediately clear what this renders
+<ThreadComposer channelId="abc" />
+
+// Or
+<EditMessageComposer messageId="xyz" />
+
+// Or
+<ForwardMessageComposer messageId="123" />
+```
+
+Each implementation is unique, explicit and self-contained. Yet they can each
+use shared parts.
+
+**Implementation:**
+
+```tsx
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <ThreadProvider channelId={channelId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <AlsoSendToChannelField channelId={channelId} />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Submit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ThreadProvider>
+  );
+}
+
+function EditMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <EditMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.CancelEdit />
+          <Composer.SaveEdit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </EditMessageProvider>
+  );
+}
+
+function ForwardMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <ForwardMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input placeholder="Add a message, if you'd like." />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Mentions />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ForwardMessageProvider>
+  );
+}
+```
+
+Each variant is explicit about:
+
+- What provider/state it uses
+- What UI elements it includes
+- What actions are available
+
+No boolean prop combinations to reason about. No impossible states.
diff --git a/.claude/skills/vercel-composition-patterns/rules/react19-no-forwardref.md b/.claude/skills/vercel-composition-patterns/rules/react19-no-forwardref.md
new file mode 100644
index 000000000..b1aaf760f
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/react19-no-forwardref.md
@@ -0,0 +1,45 @@
+---
+title: React 19 API Changes
+impact: MEDIUM
+impactDescription: cleaner component definitions and context usage
+tags: react19, refs, context, hooks
+---
+
+## React 19 API Changes
+
+> **⚠️ React 19+ only.** Skip this if you're on React 18 or earlier.
+
+In React 19, `ref` is now a regular prop (no `forwardRef` wrapper needed), and `use()` replaces `useContext()`.
+
+**Incorrect (forwardRef in React 19):**
+
+```tsx
+const ComposerInput = forwardRef<TextInput, Props>((props, ref) => {
+  return <TextInput ref={ref} {...props} />;
+});
+```
+
+**Correct (ref as a regular prop):**
+
+```tsx
+function ComposerInput({
+  ref,
+  ...props
+}: Props & { ref?: React.Ref<TextInput> }) {
+  return <TextInput ref={ref} {...props} />;
+}
+```
+
+**Incorrect (useContext in React 19):**
+
+```tsx
+const value = useContext(MyContext);
+```
+
+**Correct (use instead of useContext):**
+
+```tsx
+const value = use(MyContext);
+```
+
+`use()` can also be called conditionally, unlike `useContext()`.
diff --git a/.claude/skills/vercel-composition-patterns/rules/state-context-interface.md b/.claude/skills/vercel-composition-patterns/rules/state-context-interface.md
new file mode 100644
index 000000000..6a680ea22
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/state-context-interface.md
@@ -0,0 +1,191 @@
+---
+title: Define Generic Context Interfaces for Dependency Injection
+impact: HIGH
+impactDescription: enables dependency-injectable state across use-cases
+tags: composition, context, state, typescript, dependency-injection
+---
+
+## Define Generic Context Interfaces for Dependency Injection
+
+Define a **generic interface** for your component context with three parts:
+`state`, `actions`, and `meta`. This interface is a contract that any provider
+can implement—enabling the same UI components to work with completely different
+state implementations.
+
+**Core principle:** Lift state, compose internals, make state
+dependency-injectable.
+
+**Incorrect (UI coupled to specific state implementation):**
+
+```tsx
+function ComposerInput() {
+  // Tightly coupled to a specific hook
+  const { input, setInput } = useChannelComposerState();
+  return <TextInput value={input} onChangeText={setInput} />;
+}
+```
+
+**Correct (generic interface enables dependency injection):**
+
+```tsx
+// Define a GENERIC interface that any provider can implement
+interface ComposerState {
+  input: string;
+  attachments: Attachment[];
+  isSubmitting: boolean;
+}
+
+interface ComposerActions {
+  update: (updater: (state: ComposerState) => ComposerState) => void;
+  submit: () => void;
+}
+
+interface ComposerMeta {
+  inputRef: React.RefObject<TextInput>;
+}
+
+interface ComposerContextValue {
+  state: ComposerState;
+  actions: ComposerActions;
+  meta: ComposerMeta;
+}
+
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+```
+
+**UI components consume the interface, not the implementation:**
+
+```tsx
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta,
+  } = use(ComposerContext);
+
+  // This component works with ANY provider that implements the interface
+  return (
+    <TextInput
+      ref={meta.inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+```
+
+**Different providers implement the same interface:**
+
+```tsx
+// Provider A: Local state for ephemeral forms
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const inputRef = useRef(null);
+  const submit = useForwardMessage();
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update: setState, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+
+// Provider B: Global synced state for channels
+function ChannelProvider({ channelId, children }: Props) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+```
+
+**The same composed UI works with both:**
+
+```tsx
+// Works with ForwardMessageProvider (local state)
+<ForwardMessageProvider>
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ForwardMessageProvider>
+
+// Works with ChannelProvider (global synced state)
+<ChannelProvider channelId="abc">
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ChannelProvider>
+```
+
+**Custom UI outside the component can access state and actions:**
+
+The provider boundary is what matters—not the visual nesting. Components that
+need shared state don't have to be inside the `Composer.Frame`. They just need
+to be within the provider.
+
+```tsx
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        {/* The composer UI */}
+        <Composer.Frame>
+          <Composer.Input placeholder="Add a message, if you'd like." />
+          <Composer.Footer>
+            <Composer.Formatting />
+            <Composer.Emojis />
+          </Composer.Footer>
+        </Composer.Frame>
+
+        {/* Custom UI OUTSIDE the composer, but INSIDE the provider */}
+        <MessagePreview />
+
+        {/* Actions at the bottom of the dialog */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+// This button lives OUTSIDE Composer.Frame but can still submit based on its context!
+function ForwardButton() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Forward</Button>;
+}
+
+// This preview lives OUTSIDE Composer.Frame but can read composer's state!
+function MessagePreview() {
+  const { state } = use(ComposerContext);
+  return <Preview message={state.input} attachments={state.attachments} />;
+}
+```
+
+The `ForwardButton` and `MessagePreview` are not visually inside the composer
+box, but they can still access its state and actions. This is the power of
+lifting state into providers.
+
+The UI is reusable bits you compose together. The state is dependency-injected
+by the provider. Swap the provider, keep the UI.
diff --git a/.claude/skills/vercel-composition-patterns/rules/state-decouple-implementation.md b/.claude/skills/vercel-composition-patterns/rules/state-decouple-implementation.md
new file mode 100644
index 000000000..d67fd1220
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/state-decouple-implementation.md
@@ -0,0 +1,113 @@
+---
+title: Decouple State Management from UI
+impact: MEDIUM
+impactDescription: enables swapping state implementations without changing UI
+tags: composition, state, architecture
+---
+
+## Decouple State Management from UI
+
+The provider component should be the only place that knows how state is managed.
+UI components consume the context interface—they don't know if state comes from
+useState, Zustand, or a server sync.
+
+**Incorrect (UI coupled to state implementation):**
+
+```tsx
+function ChannelComposer({ channelId }: { channelId: string }) {
+  // UI component knows about global state implementation
+  const state = useGlobalChannelState(channelId);
+  const { submit, updateInput } = useChannelSync(channelId);
+
+  return (
+    <Composer.Frame>
+      <Composer.Input
+        value={state.input}
+        onChange={(text) => sync.updateInput(text)}
+      />
+      <Composer.Submit onPress={() => sync.submit()} />
+    </Composer.Frame>
+  );
+}
+```
+
+**Correct (state management isolated in provider):**
+
+```tsx
+// Provider handles all state management details
+function ChannelProvider({
+  channelId,
+  children,
+}: {
+  channelId: string;
+  children: React.ReactNode;
+}) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update, submit }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// UI component only knows about the context interface
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Usage
+function Channel({ channelId }: { channelId: string }) {
+  return (
+    <ChannelProvider channelId={channelId}>
+      <ChannelComposer />
+    </ChannelProvider>
+  );
+}
+```
+
+**Different providers, same UI:**
+
+```tsx
+// Local state for ephemeral forms
+function ForwardMessageProvider({ children }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// Global synced state for channels
+function ChannelProvider({ channelId, children }) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+
+  return (
+    <Composer.Provider state={state} actions={{ update, submit }}>
+      {children}
+    </Composer.Provider>
+  );
+}
+```
+
+The same `Composer.Input` component works with both providers because it only
+depends on the context interface, not the implementation.
diff --git a/.claude/skills/vercel-composition-patterns/rules/state-lift-state.md b/.claude/skills/vercel-composition-patterns/rules/state-lift-state.md
new file mode 100644
index 000000000..d683ec1cd
--- /dev/null
+++ b/.claude/skills/vercel-composition-patterns/rules/state-lift-state.md
@@ -0,0 +1,127 @@
+---
+title: Lift State into Provider Components
+impact: HIGH
+impactDescription: enables state sharing outside component boundaries
+tags: composition, state, context, providers
+---
+
+## Lift State into Provider Components
+
+Move state management into dedicated provider components. This allows sibling
+components outside the main UI to access and modify state without prop drilling
+or awkward refs.
+
+**Incorrect (state trapped inside component):**
+
+```tsx
+function ForwardMessageComposer() {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer />
+    </Composer.Frame>
+  );
+}
+
+// Problem: How does this button access composer state?
+function ForwardMessageDialog() {
+  return (
+    <Dialog>
+      <ForwardMessageComposer />
+      <MessagePreview /> {/* Needs composer state */}
+      <DialogActions>
+        <CancelButton />
+        <ForwardButton /> {/* Needs to call submit */}
+      </DialogActions>
+    </Dialog>
+  );
+}
+```
+
+**Incorrect (useEffect to sync state up):**
+
+```tsx
+function ForwardMessageDialog() {
+  const [input, setInput] = useState("");
+  return (
+    <Dialog>
+      <ForwardMessageComposer onInputChange={setInput} />
+      <MessagePreview input={input} />
+    </Dialog>
+  );
+}
+
+function ForwardMessageComposer({ onInputChange }) {
+  const [state, setState] = useState(initialState);
+  useEffect(() => {
+    onInputChange(state.input); // Sync on every change 😬
+  }, [state.input]);
+}
+```
+
+**Incorrect (reading state from ref on submit):**
+
+```tsx
+function ForwardMessageDialog() {
+  const stateRef = useRef(null);
+  return (
+    <Dialog>
+      <ForwardMessageComposer stateRef={stateRef} />
+      <ForwardButton onPress={() => submit(stateRef.current)} />
+    </Dialog>
+  );
+}
+```
+
+**Correct (state lifted to provider):**
+
+```tsx
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        <ForwardMessageComposer />
+        <MessagePreview />{" "}
+        {/* Custom components can access state and actions */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />{" "}
+          {/* Custom components can access state and actions */}
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+function ForwardButton() {
+  const { actions } = use(Composer.Context);
+  return <Button onPress={actions.submit}>Forward</Button>;
+}
+```
+
+The ForwardButton lives outside the Composer.Frame but still has access to the
+submit action because it's within the provider. Even though it's a one-off
+component, it can still access the composer's state and actions from outside the
+UI itself.
+
+**Key insight:** Components that need shared state don't have to be visually
+nested inside each other—they just need to be within the same provider.
diff --git a/.claude/skills/vercel-react-best-practices/AGENTS.md b/.claude/skills/vercel-react-best-practices/AGENTS.md
new file mode 100644
index 000000000..96d0db4a5
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/AGENTS.md
@@ -0,0 +1,2906 @@
+# React Best Practices
+
+**Version 1.0.0**  
+Vercel Engineering  
+January 2026
+
+> **Note:**  
+> This document is mainly for agents and LLMs to follow when maintaining,  
+> generating, or refactoring React and Next.js codebases. Humans  
+> may also find it useful, but guidance here is optimized for automation  
+> and consistency by AI-assisted workflows.
+
+---
+
+## Abstract
+
+Comprehensive performance optimization guide for React and Next.js applications, designed for AI agents and LLMs. Contains 40+ rules across 8 categories, prioritized by impact from critical (eliminating waterfalls, reducing bundle size) to incremental (advanced patterns). Each rule includes detailed explanations, real-world examples comparing incorrect vs. correct implementations, and specific impact metrics to guide automated refactoring and code generation.
+
+---
+
+## Table of Contents
+
+1. [Eliminating Waterfalls](#1-eliminating-waterfalls) — **CRITICAL**
+   - 1.1 [Defer Await Until Needed](#11-defer-await-until-needed)
+   - 1.2 [Dependency-Based Parallelization](#12-dependency-based-parallelization)
+   - 1.3 [Prevent Waterfall Chains in API Routes](#13-prevent-waterfall-chains-in-api-routes)
+   - 1.4 [Promise.all() for Independent Operations](#14-promiseall-for-independent-operations)
+   - 1.5 [Strategic Suspense Boundaries](#15-strategic-suspense-boundaries)
+2. [Bundle Size Optimization](#2-bundle-size-optimization) — **CRITICAL**
+   - 2.1 [Avoid Barrel File Imports](#21-avoid-barrel-file-imports)
+   - 2.2 [Conditional Module Loading](#22-conditional-module-loading)
+   - 2.3 [Defer Non-Critical Third-Party Libraries](#23-defer-non-critical-third-party-libraries)
+   - 2.4 [Dynamic Imports for Heavy Components](#24-dynamic-imports-for-heavy-components)
+   - 2.5 [Preload Based on User Intent](#25-preload-based-on-user-intent)
+3. [Server-Side Performance](#3-server-side-performance) — **HIGH**
+   - 3.1 [Authenticate Server Actions Like API Routes](#31-authenticate-server-actions-like-api-routes)
+   - 3.2 [Avoid Duplicate Serialization in RSC Props](#32-avoid-duplicate-serialization-in-rsc-props)
+   - 3.3 [Cross-Request LRU Caching](#33-cross-request-lru-caching)
+   - 3.4 [Minimize Serialization at RSC Boundaries](#34-minimize-serialization-at-rsc-boundaries)
+   - 3.5 [Parallel Data Fetching with Component Composition](#35-parallel-data-fetching-with-component-composition)
+   - 3.6 [Per-Request Deduplication with React.cache()](#36-per-request-deduplication-with-reactcache)
+   - 3.7 [Use after() for Non-Blocking Operations](#37-use-after-for-non-blocking-operations)
+4. [Client-Side Data Fetching](#4-client-side-data-fetching) — **MEDIUM-HIGH**
+   - 4.1 [Deduplicate Global Event Listeners](#41-deduplicate-global-event-listeners)
+   - 4.2 [Use Passive Event Listeners for Scrolling Performance](#42-use-passive-event-listeners-for-scrolling-performance)
+   - 4.3 [Use SWR for Automatic Deduplication](#43-use-swr-for-automatic-deduplication)
+   - 4.4 [Version and Minimize localStorage Data](#44-version-and-minimize-localstorage-data)
+5. [Re-render Optimization](#5-re-render-optimization) — **MEDIUM**
+   - 5.1 [Calculate Derived State During Rendering](#51-calculate-derived-state-during-rendering)
+   - 5.2 [Defer State Reads to Usage Point](#52-defer-state-reads-to-usage-point)
+   - 5.3 [Do not wrap a simple expression with a primitive result type in useMemo](#53-do-not-wrap-a-simple-expression-with-a-primitive-result-type-in-usememo)
+   - 5.4 [Extract Default Non-primitive Parameter Value from Memoized Component to Constant](#54-extract-default-non-primitive-parameter-value-from-memoized-component-to-constant)
+   - 5.5 [Extract to Memoized Components](#55-extract-to-memoized-components)
+   - 5.6 [Narrow Effect Dependencies](#56-narrow-effect-dependencies)
+   - 5.7 [Put Interaction Logic in Event Handlers](#57-put-interaction-logic-in-event-handlers)
+   - 5.8 [Subscribe to Derived State](#58-subscribe-to-derived-state)
+   - 5.9 [Use Functional setState Updates](#59-use-functional-setstate-updates)
+   - 5.10 [Use Lazy State Initialization](#510-use-lazy-state-initialization)
+   - 5.11 [Use Transitions for Non-Urgent Updates](#511-use-transitions-for-non-urgent-updates)
+   - 5.12 [Use useRef for Transient Values](#512-use-useref-for-transient-values)
+6. [Rendering Performance](#6-rendering-performance) — **MEDIUM**
+   - 6.1 [Animate SVG Wrapper Instead of SVG Element](#61-animate-svg-wrapper-instead-of-svg-element)
+   - 6.2 [CSS content-visibility for Long Lists](#62-css-content-visibility-for-long-lists)
+   - 6.3 [Hoist Static JSX Elements](#63-hoist-static-jsx-elements)
+   - 6.4 [Optimize SVG Precision](#64-optimize-svg-precision)
+   - 6.5 [Prevent Hydration Mismatch Without Flickering](#65-prevent-hydration-mismatch-without-flickering)
+   - 6.6 [Suppress Expected Hydration Mismatches](#66-suppress-expected-hydration-mismatches)
+   - 6.7 [Use Activity Component for Show/Hide](#67-use-activity-component-for-showhide)
+   - 6.8 [Use Explicit Conditional Rendering](#68-use-explicit-conditional-rendering)
+   - 6.9 [Use useTransition Over Manual Loading States](#69-use-usetransition-over-manual-loading-states)
+7. [JavaScript Performance](#7-javascript-performance) — **LOW-MEDIUM**
+   - 7.1 [Avoid Layout Thrashing](#71-avoid-layout-thrashing)
+   - 7.2 [Build Index Maps for Repeated Lookups](#72-build-index-maps-for-repeated-lookups)
+   - 7.3 [Cache Property Access in Loops](#73-cache-property-access-in-loops)
+   - 7.4 [Cache Repeated Function Calls](#74-cache-repeated-function-calls)
+   - 7.5 [Cache Storage API Calls](#75-cache-storage-api-calls)
+   - 7.6 [Combine Multiple Array Iterations](#76-combine-multiple-array-iterations)
+   - 7.7 [Early Length Check for Array Comparisons](#77-early-length-check-for-array-comparisons)
+   - 7.8 [Early Return from Functions](#78-early-return-from-functions)
+   - 7.9 [Hoist RegExp Creation](#79-hoist-regexp-creation)
+   - 7.10 [Use Loop for Min/Max Instead of Sort](#710-use-loop-for-minmax-instead-of-sort)
+   - 7.11 [Use Set/Map for O(1) Lookups](#711-use-setmap-for-o1-lookups)
+   - 7.12 [Use toSorted() Instead of sort() for Immutability](#712-use-tosorted-instead-of-sort-for-immutability)
+8. [Advanced Patterns](#8-advanced-patterns) — **LOW**
+   - 8.1 [Initialize App Once, Not Per Mount](#81-initialize-app-once-not-per-mount)
+   - 8.2 [Store Event Handlers in Refs](#82-store-event-handlers-in-refs)
+   - 8.3 [useEffectEvent for Stable Callback Refs](#83-useeffectevent-for-stable-callback-refs)
+
+---
+
+## 1. Eliminating Waterfalls
+
+**Impact: CRITICAL**
+
+Waterfalls are the #1 performance killer. Each sequential await adds full network latency. Eliminating them yields the largest gains.
+
+### 1.1 Defer Await Until Needed
+
+**Impact: HIGH (avoids blocking unused code paths)**
+
+Move `await` operations into the branches where they're actually used to avoid blocking code paths that don't need them.
+
+**Incorrect: blocks both branches**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  const userData = await fetchUserData(userId);
+
+  if (skipProcessing) {
+    // Returns immediately but still waited for userData
+    return { skipped: true };
+  }
+
+  // Only this branch uses userData
+  return processUserData(userData);
+}
+```
+
+**Correct: only blocks when needed**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  if (skipProcessing) {
+    // Returns immediately without waiting
+    return { skipped: true };
+  }
+
+  // Fetch only when needed
+  const userData = await fetchUserData(userId);
+  return processUserData(userData);
+}
+```
+
+**Another example: early return optimization**
+
+```typescript
+// Incorrect: always fetches permissions
+async function updateResource(resourceId: string, userId: string) {
+  const permissions = await fetchPermissions(userId);
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+
+// Correct: fetches only when needed
+async function updateResource(resourceId: string, userId: string) {
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  const permissions = await fetchPermissions(userId);
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+```
+
+This optimization is especially valuable when the skipped branch is frequently taken, or when the deferred operation is expensive.
+
+### 1.2 Dependency-Based Parallelization
+
+**Impact: CRITICAL (2-10× improvement)**
+
+For operations with partial dependencies, use `better-all` to maximize parallelism. It automatically starts each task at the earliest possible moment.
+
+**Incorrect: profile waits for config unnecessarily**
+
+```typescript
+const [user, config] = await Promise.all([fetchUser(), fetchConfig()]);
+const profile = await fetchProfile(user.id);
+```
+
+**Correct: config and profile run in parallel**
+
+```typescript
+import { all } from "better-all";
+
+const { user, config, profile } = await all({
+  async user() {
+    return fetchUser();
+  },
+  async config() {
+    return fetchConfig();
+  },
+  async profile() {
+    return fetchProfile((await this.$.user).id);
+  },
+});
+```
+
+**Alternative without extra dependencies:**
+
+```typescript
+const userPromise = fetchUser();
+const profilePromise = userPromise.then((user) => fetchProfile(user.id));
+
+const [user, config, profile] = await Promise.all([
+  userPromise,
+  fetchConfig(),
+  profilePromise,
+]);
+```
+
+We can also create all the promises first, and do `Promise.all()` at the end.
+
+Reference: [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
+
+### 1.3 Prevent Waterfall Chains in API Routes
+
+**Impact: CRITICAL (2-10× improvement)**
+
+In API routes and Server Actions, start independent operations immediately, even if you don't await them yet.
+
+**Incorrect: config waits for auth, data waits for both**
+
+```typescript
+export async function GET(request: Request) {
+  const session = await auth();
+  const config = await fetchConfig();
+  const data = await fetchData(session.user.id);
+  return Response.json({ data, config });
+}
+```
+
+**Correct: auth and config start immediately**
+
+```typescript
+export async function GET(request: Request) {
+  const sessionPromise = auth();
+  const configPromise = fetchConfig();
+  const session = await sessionPromise;
+  const [config, data] = await Promise.all([
+    configPromise,
+    fetchData(session.user.id),
+  ]);
+  return Response.json({ data, config });
+}
+```
+
+For operations with more complex dependency chains, use `better-all` to automatically maximize parallelism (see Dependency-Based Parallelization).
+
+### 1.4 Promise.all() for Independent Operations
+
+**Impact: CRITICAL (2-10× improvement)**
+
+When async operations have no interdependencies, execute them concurrently using `Promise.all()`.
+
+**Incorrect: sequential execution, 3 round trips**
+
+```typescript
+const user = await fetchUser();
+const posts = await fetchPosts();
+const comments = await fetchComments();
+```
+
+**Correct: parallel execution, 1 round trip**
+
+```typescript
+const [user, posts, comments] = await Promise.all([
+  fetchUser(),
+  fetchPosts(),
+  fetchComments(),
+]);
+```
+
+### 1.5 Strategic Suspense Boundaries
+
+**Impact: HIGH (faster initial paint)**
+
+Instead of awaiting data in async components before returning JSX, use Suspense boundaries to show the wrapper UI faster while data loads.
+
+**Incorrect: wrapper blocked by data fetching**
+
+```tsx
+async function Page() {
+  const data = await fetchData(); // Blocks entire page
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <DataDisplay data={data} />
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+```
+
+The entire layout waits for data even though only the middle section needs it.
+
+**Correct: wrapper shows immediately, data streams in**
+
+```tsx
+function Page() {
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <Suspense fallback={<Skeleton />}>
+          <DataDisplay />
+        </Suspense>
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+async function DataDisplay() {
+  const data = await fetchData(); // Only blocks this component
+  return <div>{data.content}</div>;
+}
+```
+
+Sidebar, Header, and Footer render immediately. Only DataDisplay waits for data.
+
+**Alternative: share promise across components**
+
+```tsx
+function Page() {
+  // Start fetch immediately, but don't await
+  const dataPromise = fetchData();
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <Suspense fallback={<Skeleton />}>
+        <DataDisplay dataPromise={dataPromise} />
+        <DataSummary dataPromise={dataPromise} />
+      </Suspense>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+function DataDisplay({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Unwraps the promise
+  return <div>{data.content}</div>;
+}
+
+function DataSummary({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Reuses the same promise
+  return <div>{data.summary}</div>;
+}
+```
+
+Both components share the same promise, so only one fetch occurs. Layout renders immediately while both components wait together.
+
+**When NOT to use this pattern:**
+
+- Critical data needed for layout decisions (affects positioning)
+
+- SEO-critical content above the fold
+
+- Small, fast queries where suspense overhead isn't worth it
+
+- When you want to avoid layout shift (loading → content jump)
+
+**Trade-off:** Faster initial paint vs potential layout shift. Choose based on your UX priorities.
+
+---
+
+## 2. Bundle Size Optimization
+
+**Impact: CRITICAL**
+
+Reducing initial bundle size improves Time to Interactive and Largest Contentful Paint.
+
+### 2.1 Avoid Barrel File Imports
+
+**Impact: CRITICAL (200-800ms import cost, slow builds)**
+
+Import directly from source files instead of barrel files to avoid loading thousands of unused modules. **Barrel files** are entry points that re-export multiple modules (e.g., `index.js` that does `export * from './module'`).
+
+Popular icon and component libraries can have **up to 10,000 re-exports** in their entry file. For many React packages, **it takes 200-800ms just to import them**, affecting both development speed and production cold starts.
+
+**Why tree-shaking doesn't help:** When a library is marked as external (not bundled), the bundler can't optimize it. If you bundle it to enable tree-shaking, builds become substantially slower analyzing the entire module graph.
+
+**Incorrect: imports entire library**
+
+```tsx
+import { Check, X, Menu } from "lucide-react";
+// Loads 1,583 modules, takes ~2.8s extra in dev
+// Runtime cost: 200-800ms on every cold start
+
+import { Button, TextField } from "@mui/material";
+// Loads 2,225 modules, takes ~4.2s extra in dev
+```
+
+**Correct: imports only what you need**
+
+```tsx
+import Check from "lucide-react/dist/esm/icons/check";
+import X from "lucide-react/dist/esm/icons/x";
+import Menu from "lucide-react/dist/esm/icons/menu";
+// Loads only 3 modules (~2KB vs ~1MB)
+
+import Button from "@mui/material/Button";
+import TextField from "@mui/material/TextField";
+// Loads only what you use
+```
+
+**Alternative: Next.js 13.5+**
+
+```js
+// next.config.js - use optimizePackageImports
+module.exports = {
+  experimental: {
+    optimizePackageImports: ["lucide-react", "@mui/material"],
+  },
+};
+
+// Then you can keep the ergonomic barrel imports:
+import { Check, X, Menu } from "lucide-react";
+// Automatically transformed to direct imports at build time
+```
+
+Direct imports provide 15-70% faster dev boot, 28% faster builds, 40% faster cold starts, and significantly faster HMR.
+
+Libraries commonly affected: `lucide-react`, `@mui/material`, `@mui/icons-material`, `@tabler/icons-react`, `react-icons`, `@headlessui/react`, `@radix-ui/react-*`, `lodash`, `ramda`, `date-fns`, `rxjs`, `react-use`.
+
+Reference: [https://vercel.com/blog/how-we-optimized-package-imports-in-next-js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
+
+### 2.2 Conditional Module Loading
+
+**Impact: HIGH (loads large data only when needed)**
+
+Load large data or modules only when a feature is activated.
+
+**Example: lazy-load animation frames**
+
+```tsx
+function AnimationPlayer({
+  enabled,
+  setEnabled,
+}: {
+  enabled: boolean;
+  setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
+}) {
+  const [frames, setFrames] = useState<Frame[] | null>(null);
+
+  useEffect(() => {
+    if (enabled && !frames && typeof window !== "undefined") {
+      import("./animation-frames.js")
+        .then((mod) => setFrames(mod.frames))
+        .catch(() => setEnabled(false));
+    }
+  }, [enabled, frames, setEnabled]);
+
+  if (!frames) return <Skeleton />;
+  return <Canvas frames={frames} />;
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.
+
+### 2.3 Defer Non-Critical Third-Party Libraries
+
+**Impact: MEDIUM (loads after hydration)**
+
+Analytics, logging, and error tracking don't block user interaction. Load them after hydration.
+
+**Incorrect: blocks initial bundle**
+
+```tsx
+import { Analytics } from "@vercel/analytics/react";
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+**Correct: loads after hydration**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const Analytics = dynamic(
+  () => import("@vercel/analytics/react").then((m) => m.Analytics),
+  { ssr: false },
+);
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+### 2.4 Dynamic Imports for Heavy Components
+
+**Impact: CRITICAL (directly affects TTI and LCP)**
+
+Use `next/dynamic` to lazy-load large components not needed on initial render.
+
+**Incorrect: Monaco bundles with main chunk ~300KB**
+
+```tsx
+import { MonacoEditor } from "./monaco-editor";
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+**Correct: Monaco loads on demand**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const MonacoEditor = dynamic(
+  () => import("./monaco-editor").then((m) => m.MonacoEditor),
+  { ssr: false },
+);
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+### 2.5 Preload Based on User Intent
+
+**Impact: MEDIUM (reduces perceived latency)**
+
+Preload heavy bundles before they're needed to reduce perceived latency.
+
+**Example: preload on hover/focus**
+
+```tsx
+function EditorButton({ onClick }: { onClick: () => void }) {
+  const preload = () => {
+    if (typeof window !== "undefined") {
+      void import("./monaco-editor");
+    }
+  };
+
+  return (
+    <button onMouseEnter={preload} onFocus={preload} onClick={onClick}>
+      Open Editor
+    </button>
+  );
+}
+```
+
+**Example: preload when feature flag is enabled**
+
+```tsx
+function FlagsProvider({ children, flags }: Props) {
+  useEffect(() => {
+    if (flags.editorEnabled && typeof window !== "undefined") {
+      void import("./monaco-editor").then((mod) => mod.init());
+    }
+  }, [flags.editorEnabled]);
+
+  return (
+    <FlagsContext.Provider value={flags}>{children}</FlagsContext.Provider>
+  );
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling preloaded modules for SSR, optimizing server bundle size and build speed.
+
+---
+
+## 3. Server-Side Performance
+
+**Impact: HIGH**
+
+Optimizing server-side rendering and data fetching eliminates server-side waterfalls and reduces response times.
+
+### 3.1 Authenticate Server Actions Like API Routes
+
+**Impact: CRITICAL (prevents unauthorized access to server mutations)**
+
+Server Actions (functions with `"use server"`) are exposed as public endpoints, just like API routes. Always verify authentication and authorization **inside** each Server Action—do not rely solely on middleware, layout guards, or page-level checks, as Server Actions can be invoked directly.
+
+Next.js documentation explicitly states: "Treat Server Actions with the same security considerations as public-facing API endpoints, and verify if the user is allowed to perform a mutation."
+
+**Incorrect: no authentication check**
+
+```typescript
+"use server";
+
+export async function deleteUser(userId: string) {
+  // Anyone can call this! No auth check
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**Correct: authentication inside the action**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { unauthorized } from "@/lib/errors";
+
+export async function deleteUser(userId: string) {
+  // Always check auth inside the action
+  const session = await verifySession();
+
+  if (!session) {
+    throw unauthorized("Must be logged in");
+  }
+
+  // Check authorization too
+  if (session.user.role !== "admin" && session.user.id !== userId) {
+    throw unauthorized("Cannot delete other users");
+  }
+
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**With input validation:**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { z } from "zod";
+
+const updateProfileSchema = z.object({
+  userId: z.string().uuid(),
+  name: z.string().min(1).max(100),
+  email: z.string().email(),
+});
+
+export async function updateProfile(data: unknown) {
+  // Validate input first
+  const validated = updateProfileSchema.parse(data);
+
+  // Then authenticate
+  const session = await verifySession();
+  if (!session) {
+    throw new Error("Unauthorized");
+  }
+
+  // Then authorize
+  if (session.user.id !== validated.userId) {
+    throw new Error("Can only update own profile");
+  }
+
+  // Finally perform the mutation
+  await db.user.update({
+    where: { id: validated.userId },
+    data: {
+      name: validated.name,
+      email: validated.email,
+    },
+  });
+
+  return { success: true };
+}
+```
+
+Reference: [https://nextjs.org/docs/app/guides/authentication](https://nextjs.org/docs/app/guides/authentication)
+
+### 3.2 Avoid Duplicate Serialization in RSC Props
+
+**Impact: LOW (reduces network payload by avoiding duplicate serialization)**
+
+RSC→client serialization deduplicates by object reference, not value. Same reference = serialized once; new reference = serialized again. Do transformations (`.toSorted()`, `.filter()`, `.map()`) in client, not server.
+
+**Incorrect: duplicates array**
+
+```tsx
+// RSC: sends 6 strings (2 arrays × 3 items)
+<ClientList usernames={usernames} usernamesOrdered={usernames.toSorted()} />
+```
+
+**Correct: sends 3 strings**
+
+```tsx
+// RSC: send once
+<ClientList usernames={usernames} />;
+
+// Client: transform there
+("use client");
+const sorted = useMemo(() => [...usernames].sort(), [usernames]);
+```
+
+**Nested deduplication behavior:**
+
+```tsx
+// string[] - duplicates everything
+usernames={['a','b']} sorted={usernames.toSorted()} // sends 4 strings
+
+// object[] - duplicates array structure only
+users={[{id:1},{id:2}]} sorted={users.toSorted()} // sends 2 arrays + 2 unique objects (not 4)
+```
+
+Deduplication works recursively. Impact varies by data type:
+
+- `string[]`, `number[]`, `boolean[]`: **HIGH impact** - array + all primitives fully duplicated
+
+- `object[]`: **LOW impact** - array duplicated, but nested objects deduplicated by reference
+
+**Operations breaking deduplication: create new references**
+
+- Arrays: `.toSorted()`, `.filter()`, `.map()`, `.slice()`, `[...arr]`
+
+- Objects: `{...obj}`, `Object.assign()`, `structuredClone()`, `JSON.parse(JSON.stringify())`
+
+**More examples:**
+
+```tsx
+// ❌ Bad
+<C users={users} active={users.filter(u => u.active)} />
+<C product={product} productName={product.name} />
+
+// ✅ Good
+<C users={users} />
+<C product={product} />
+// Do filtering/destructuring in client
+```
+
+**Exception:** Pass derived data when transformation is expensive or client doesn't need original.
+
+### 3.3 Cross-Request LRU Caching
+
+**Impact: HIGH (caches across requests)**
+
+`React.cache()` only works within one request. For data shared across sequential requests (user clicks button A then button B), use an LRU cache.
+
+**Implementation:**
+
+```typescript
+import { LRUCache } from "lru-cache";
+
+const cache = new LRUCache<string, any>({
+  max: 1000,
+  ttl: 5 * 60 * 1000, // 5 minutes
+});
+
+export async function getUser(id: string) {
+  const cached = cache.get(id);
+  if (cached) return cached;
+
+  const user = await db.user.findUnique({ where: { id } });
+  cache.set(id, user);
+  return user;
+}
+
+// Request 1: DB query, result cached
+// Request 2: cache hit, no DB query
+```
+
+Use when sequential user actions hit multiple endpoints needing the same data within seconds.
+
+**With Vercel's [Fluid Compute](https://vercel.com/docs/fluid-compute):** LRU caching is especially effective because multiple concurrent requests can share the same function instance and cache. This means the cache persists across requests without needing external storage like Redis.
+
+**In traditional serverless:** Each invocation runs in isolation, so consider Redis for cross-process caching.
+
+Reference: [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
+
+### 3.4 Minimize Serialization at RSC Boundaries
+
+**Impact: HIGH (reduces data transfer size)**
+
+The React Server/Client boundary serializes all object properties into strings and embeds them in the HTML response and subsequent RSC requests. This serialized data directly impacts page weight and load time, so **size matters a lot**. Only pass fields that the client actually uses.
+
+**Incorrect: serializes all 50 fields**
+
+```tsx
+async function Page() {
+  const user = await fetchUser(); // 50 fields
+  return <Profile user={user} />;
+}
+
+("use client");
+function Profile({ user }: { user: User }) {
+  return <div>{user.name}</div>; // uses 1 field
+}
+```
+
+**Correct: serializes only 1 field**
+
+```tsx
+async function Page() {
+  const user = await fetchUser();
+  return <Profile name={user.name} />;
+}
+
+("use client");
+function Profile({ name }: { name: string }) {
+  return <div>{name}</div>;
+}
+```
+
+### 3.5 Parallel Data Fetching with Component Composition
+
+**Impact: CRITICAL (eliminates server-side waterfalls)**
+
+React Server Components execute sequentially within a tree. Restructure with composition to parallelize data fetching.
+
+**Incorrect: Sidebar waits for Page's fetch to complete**
+
+```tsx
+export default async function Page() {
+  const header = await fetchHeader();
+  return (
+    <div>
+      <div>{header}</div>
+      <Sidebar />
+    </div>
+  );
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+```
+
+**Correct: both fetch simultaneously**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+export default function Page() {
+  return (
+    <div>
+      <Header />
+      <Sidebar />
+    </div>
+  );
+}
+```
+
+**Alternative with children prop:**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+function Layout({ children }: { children: ReactNode }) {
+  return (
+    <div>
+      <Header />
+      {children}
+    </div>
+  );
+}
+
+export default function Page() {
+  return (
+    <Layout>
+      <Sidebar />
+    </Layout>
+  );
+}
+```
+
+### 3.6 Per-Request Deduplication with React.cache()
+
+**Impact: MEDIUM (deduplicates within request)**
+
+Use `React.cache()` for server-side request deduplication. Authentication and database queries benefit most.
+
+**Usage:**
+
+```typescript
+import { cache } from "react";
+
+export const getCurrentUser = cache(async () => {
+  const session = await auth();
+  if (!session?.user?.id) return null;
+  return await db.user.findUnique({
+    where: { id: session.user.id },
+  });
+});
+```
+
+Within a single request, multiple calls to `getCurrentUser()` execute the query only once.
+
+**Avoid inline objects as arguments:**
+
+`React.cache()` uses shallow equality (`Object.is`) to determine cache hits. Inline objects create new references each call, preventing cache hits.
+
+**Incorrect: always cache miss**
+
+```typescript
+const getUser = cache(async (params: { uid: number }) => {
+  return await db.user.findUnique({ where: { id: params.uid } });
+});
+
+// Each call creates new object, never hits cache
+getUser({ uid: 1 });
+getUser({ uid: 1 }); // Cache miss, runs query again
+```
+
+**Correct: cache hit**
+
+```typescript
+const params = { uid: 1 };
+getUser(params); // Query runs
+getUser(params); // Cache hit (same reference)
+```
+
+If you must pass objects, pass the same reference:
+
+**Next.js-Specific Note:**
+
+In Next.js, the `fetch` API is automatically extended with request memoization. Requests with the same URL and options are automatically deduplicated within a single request, so you don't need `React.cache()` for `fetch` calls. However, `React.cache()` is still essential for other async tasks:
+
+- Database queries (Prisma, Drizzle, etc.)
+
+- Heavy computations
+
+- Authentication checks
+
+- File system operations
+
+- Any non-fetch async work
+
+Use `React.cache()` to deduplicate these operations across your component tree.
+
+Reference: [https://react.dev/reference/react/cache](https://react.dev/reference/react/cache)
+
+### 3.7 Use after() for Non-Blocking Operations
+
+**Impact: MEDIUM (faster response times)**
+
+Use Next.js's `after()` to schedule work that should execute after a response is sent. This prevents logging, analytics, and other side effects from blocking the response.
+
+**Incorrect: blocks response**
+
+```tsx
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Logging blocks the response
+  const userAgent = request.headers.get("user-agent") || "unknown";
+  await logUserAction({ userAgent });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+**Correct: non-blocking**
+
+```tsx
+import { after } from "next/server";
+import { headers, cookies } from "next/headers";
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Log after response is sent
+  after(async () => {
+    const userAgent = (await headers()).get("user-agent") || "unknown";
+    const sessionCookie =
+      (await cookies()).get("session-id")?.value || "anonymous";
+
+    logUserAction({ sessionCookie, userAgent });
+  });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+The response is sent immediately while logging happens in the background.
+
+**Common use cases:**
+
+- Analytics tracking
+
+- Audit logging
+
+- Sending notifications
+
+- Cache invalidation
+
+- Cleanup tasks
+
+**Important notes:**
+
+- `after()` runs even if the response fails or redirects
+
+- Works in Server Actions, Route Handlers, and Server Components
+
+Reference: [https://nextjs.org/docs/app/api-reference/functions/after](https://nextjs.org/docs/app/api-reference/functions/after)
+
+---
+
+## 4. Client-Side Data Fetching
+
+**Impact: MEDIUM-HIGH**
+
+Automatic deduplication and efficient data fetching patterns reduce redundant network requests.
+
+### 4.1 Deduplicate Global Event Listeners
+
+**Impact: LOW (single listener for N components)**
+
+Use `useSWRSubscription()` to share global event listeners across component instances.
+
+**Incorrect: N instances = N listeners**
+
+```tsx
+function useKeyboardShortcut(key: string, callback: () => void) {
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && e.key === key) {
+        callback();
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [key, callback]);
+}
+```
+
+When using the `useKeyboardShortcut` hook multiple times, each instance will register a new listener.
+
+**Correct: N instances = 1 listener**
+
+```tsx
+import useSWRSubscription from "swr/subscription";
+
+// Module-level Map to track callbacks per key
+const keyCallbacks = new Map<string, Set<() => void>>();
+
+function useKeyboardShortcut(key: string, callback: () => void) {
+  // Register this callback in the Map
+  useEffect(() => {
+    if (!keyCallbacks.has(key)) {
+      keyCallbacks.set(key, new Set());
+    }
+    keyCallbacks.get(key)!.add(callback);
+
+    return () => {
+      const set = keyCallbacks.get(key);
+      if (set) {
+        set.delete(callback);
+        if (set.size === 0) {
+          keyCallbacks.delete(key);
+        }
+      }
+    };
+  }, [key, callback]);
+
+  useSWRSubscription("global-keydown", () => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && keyCallbacks.has(e.key)) {
+        keyCallbacks.get(e.key)!.forEach((cb) => cb());
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  });
+}
+
+function Profile() {
+  // Multiple shortcuts will share the same listener
+  useKeyboardShortcut("p", () => {
+    /* ... */
+  });
+  useKeyboardShortcut("k", () => {
+    /* ... */
+  });
+  // ...
+}
+```
+
+### 4.2 Use Passive Event Listeners for Scrolling Performance
+
+**Impact: MEDIUM (eliminates scroll delay caused by event listeners)**
+
+Add `{ passive: true }` to touch and wheel event listeners to enable immediate scrolling. Browsers normally wait for listeners to finish to check if `preventDefault()` is called, causing scroll delay.
+
+**Incorrect:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch);
+  document.addEventListener("wheel", handleWheel);
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Correct:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch, { passive: true });
+  document.addEventListener("wheel", handleWheel, { passive: true });
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Use passive when:** tracking/analytics, logging, any listener that doesn't call `preventDefault()`.
+
+**Don't use passive when:** implementing custom swipe gestures, custom zoom controls, or any listener that needs `preventDefault()`.
+
+### 4.3 Use SWR for Automatic Deduplication
+
+**Impact: MEDIUM-HIGH (automatic deduplication)**
+
+SWR enables request deduplication, caching, and revalidation across component instances.
+
+**Incorrect: no deduplication, each instance fetches**
+
+```tsx
+function UserList() {
+  const [users, setUsers] = useState([]);
+  useEffect(() => {
+    fetch("/api/users")
+      .then((r) => r.json())
+      .then(setUsers);
+  }, []);
+}
+```
+
+**Correct: multiple instances share one request**
+
+```tsx
+import useSWR from "swr";
+
+function UserList() {
+  const { data: users } = useSWR("/api/users", fetcher);
+}
+```
+
+**For immutable data:**
+
+```tsx
+import { useImmutableSWR } from "@/lib/swr";
+
+function StaticContent() {
+  const { data } = useImmutableSWR("/api/config", fetcher);
+}
+```
+
+**For mutations:**
+
+```tsx
+import { useSWRMutation } from "swr/mutation";
+
+function UpdateButton() {
+  const { trigger } = useSWRMutation("/api/user", updateUser);
+  return <button onClick={() => trigger()}>Update</button>;
+}
+```
+
+Reference: [https://swr.vercel.app](https://swr.vercel.app)
+
+### 4.4 Version and Minimize localStorage Data
+
+**Impact: MEDIUM (prevents schema conflicts, reduces storage size)**
+
+Add version prefix to keys and store only needed fields. Prevents schema conflicts and accidental storage of sensitive data.
+
+**Incorrect:**
+
+```typescript
+// No version, stores everything, no error handling
+localStorage.setItem("userConfig", JSON.stringify(fullUserObject));
+const data = localStorage.getItem("userConfig");
+```
+
+**Correct:**
+
+```typescript
+const VERSION = "v2";
+
+function saveConfig(config: { theme: string; language: string }) {
+  try {
+    localStorage.setItem(`userConfig:${VERSION}`, JSON.stringify(config));
+  } catch {
+    // Throws in incognito/private browsing, quota exceeded, or disabled
+  }
+}
+
+function loadConfig() {
+  try {
+    const data = localStorage.getItem(`userConfig:${VERSION}`);
+    return data ? JSON.parse(data) : null;
+  } catch {
+    return null;
+  }
+}
+
+// Migration from v1 to v2
+function migrate() {
+  try {
+    const v1 = localStorage.getItem("userConfig:v1");
+    if (v1) {
+      const old = JSON.parse(v1);
+      saveConfig({
+        theme: old.darkMode ? "dark" : "light",
+        language: old.lang,
+      });
+      localStorage.removeItem("userConfig:v1");
+    }
+  } catch {}
+}
+```
+
+**Store minimal fields from server responses:**
+
+```typescript
+// User object has 20+ fields, only store what UI needs
+function cachePrefs(user: FullUser) {
+  try {
+    localStorage.setItem(
+      "prefs:v1",
+      JSON.stringify({
+        theme: user.preferences.theme,
+        notifications: user.preferences.notifications,
+      }),
+    );
+  } catch {}
+}
+```
+
+**Always wrap in try-catch:** `getItem()` and `setItem()` throw in incognito/private browsing (Safari, Firefox), when quota exceeded, or when disabled.
+
+**Benefits:** Schema evolution via versioning, reduced storage size, prevents storing tokens/PII/internal flags.
+
+---
+
+## 5. Re-render Optimization
+
+**Impact: MEDIUM**
+
+Reducing unnecessary re-renders minimizes wasted computation and improves UI responsiveness.
+
+### 5.1 Calculate Derived State During Rendering
+
+**Impact: MEDIUM (avoids redundant renders and state drift)**
+
+If a value can be computed from current props/state, do not store it in state or update it in an effect. Derive it during render to avoid extra renders and state drift. Do not set state in effects solely in response to prop changes; prefer derived values or keyed resets instead.
+
+**Incorrect: redundant state and effect**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const [fullName, setFullName] = useState("");
+
+  useEffect(() => {
+    setFullName(firstName + " " + lastName);
+  }, [firstName, lastName]);
+
+  return <p>{fullName}</p>;
+}
+```
+
+**Correct: derive during render**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const fullName = firstName + " " + lastName;
+
+  return <p>{fullName}</p>;
+}
+```
+
+Reference: [https://react.dev/learn/you-might-not-need-an-effect](https://react.dev/learn/you-might-not-need-an-effect)
+
+### 5.2 Defer State Reads to Usage Point
+
+**Impact: MEDIUM (avoids unnecessary subscriptions)**
+
+Don't subscribe to dynamic state (searchParams, localStorage) if you only read it inside callbacks.
+
+**Incorrect: subscribes to all searchParams changes**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const searchParams = useSearchParams();
+
+  const handleShare = () => {
+    const ref = searchParams.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+**Correct: reads on demand, no subscription**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const handleShare = () => {
+    const params = new URLSearchParams(window.location.search);
+    const ref = params.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+### 5.3 Do not wrap a simple expression with a primitive result type in useMemo
+
+**Impact: LOW-MEDIUM (wasted computation on every render)**
+
+When an expression is simple (few logical or arithmetical operators) and has a primitive result type (boolean, number, string), do not wrap it in `useMemo`.
+
+Calling `useMemo` and comparing hook dependencies may consume more resources than the expression itself.
+
+**Incorrect:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = useMemo(() => {
+    return user.isLoading || notifications.isLoading;
+  }, [user.isLoading, notifications.isLoading]);
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+**Correct:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = user.isLoading || notifications.isLoading;
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+### 5.4 Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+
+**Impact: MEDIUM (restores memoization by using a constant for default value)**
+
+When memoized component has a default value for some non-primitive optional parameter, such as an array, function, or object, calling the component without that parameter results in broken memoization. This is because new value instances are created on every rerender, and they do not pass strict equality comparison in `memo()`.
+
+To address this issue, extract the default value into a constant.
+
+**Incorrect: `onClick` has different values on every rerender**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ onClick = () => {} }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+**Correct: stable default value**
+
+```tsx
+const NOOP = () => {};
+
+const UserAvatar = memo(function UserAvatar({ onClick = NOOP }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+### 5.5 Extract to Memoized Components
+
+**Impact: MEDIUM (enables early returns)**
+
+Extract expensive work into memoized components to enable early returns before computation.
+
+**Incorrect: computes avatar even when loading**
+
+```tsx
+function Profile({ user, loading }: Props) {
+  const avatar = useMemo(() => {
+    const id = computeAvatarId(user);
+    return <Avatar id={id} />;
+  }, [user]);
+
+  if (loading) return <Skeleton />;
+  return <div>{avatar}</div>;
+}
+```
+
+**Correct: skips computation when loading**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ user }: { user: User }) {
+  const id = useMemo(() => computeAvatarId(user), [user]);
+  return <Avatar id={id} />;
+});
+
+function Profile({ user, loading }: Props) {
+  if (loading) return <Skeleton />;
+  return (
+    <div>
+      <UserAvatar user={user} />
+    </div>
+  );
+}
+```
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, manual memoization with `memo()` and `useMemo()` is not necessary. The compiler automatically optimizes re-renders.
+
+### 5.6 Narrow Effect Dependencies
+
+**Impact: LOW (minimizes effect re-runs)**
+
+Specify primitive dependencies instead of objects to minimize effect re-runs.
+
+**Incorrect: re-runs on any user field change**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user]);
+```
+
+**Correct: re-runs only when id changes**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user.id]);
+```
+
+**For derived state, compute outside effect:**
+
+```tsx
+// Incorrect: runs on width=767, 766, 765...
+useEffect(() => {
+  if (width < 768) {
+    enableMobileMode();
+  }
+}, [width]);
+
+// Correct: runs only on boolean transition
+const isMobile = width < 768;
+useEffect(() => {
+  if (isMobile) {
+    enableMobileMode();
+  }
+}, [isMobile]);
+```
+
+### 5.7 Put Interaction Logic in Event Handlers
+
+**Impact: MEDIUM (avoids effect re-runs and duplicate side effects)**
+
+If a side effect is triggered by a specific user action (submit, click, drag), run it in that event handler. Do not model the action as state + effect; it makes effects re-run on unrelated changes and can duplicate the action.
+
+**Incorrect: event modeled as state + effect**
+
+```tsx
+function Form() {
+  const [submitted, setSubmitted] = useState(false);
+  const theme = useContext(ThemeContext);
+
+  useEffect(() => {
+    if (submitted) {
+      post("/api/register");
+      showToast("Registered", theme);
+    }
+  }, [submitted, theme]);
+
+  return <button onClick={() => setSubmitted(true)}>Submit</button>;
+}
+```
+
+**Correct: do it in the handler**
+
+```tsx
+function Form() {
+  const theme = useContext(ThemeContext);
+
+  function handleSubmit() {
+    post("/api/register");
+    showToast("Registered", theme);
+  }
+
+  return <button onClick={handleSubmit}>Submit</button>;
+}
+```
+
+Reference: [https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler](https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler)
+
+### 5.8 Subscribe to Derived State
+
+**Impact: MEDIUM (reduces re-render frequency)**
+
+Subscribe to derived boolean state instead of continuous values to reduce re-render frequency.
+
+**Incorrect: re-renders on every pixel change**
+
+```tsx
+function Sidebar() {
+  const width = useWindowWidth(); // updates continuously
+  const isMobile = width < 768;
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+**Correct: re-renders only when boolean changes**
+
+```tsx
+function Sidebar() {
+  const isMobile = useMediaQuery("(max-width: 767px)");
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+### 5.9 Use Functional setState Updates
+
+**Impact: MEDIUM (prevents stale closures and unnecessary callback recreations)**
+
+When updating state based on the current state value, use the functional update form of setState instead of directly referencing the state variable. This prevents stale closures, eliminates unnecessary dependencies, and creates stable callback references.
+
+**Incorrect: requires state as dependency**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Callback must depend on items, recreated on every items change
+  const addItems = useCallback(
+    (newItems: Item[]) => {
+      setItems([...items, ...newItems]);
+    },
+    [items],
+  ); // ❌ items dependency causes recreations
+
+  // Risk of stale closure if dependency is forgotten
+  const removeItem = useCallback((id: string) => {
+    setItems(items.filter((item) => item.id !== id));
+  }, []); // ❌ Missing items dependency - will use stale items!
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+The first callback is recreated every time `items` changes, which can cause child components to re-render unnecessarily. The second callback has a stale closure bug—it will always reference the initial `items` value.
+
+**Correct: stable callbacks, no stale closures**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Stable callback, never recreated
+  const addItems = useCallback((newItems: Item[]) => {
+    setItems((curr) => [...curr, ...newItems]);
+  }, []); // ✅ No dependencies needed
+
+  // Always uses latest state, no stale closure risk
+  const removeItem = useCallback((id: string) => {
+    setItems((curr) => curr.filter((item) => item.id !== id));
+  }, []); // ✅ Safe and stable
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+**Benefits:**
+
+1. **Stable callback references** - Callbacks don't need to be recreated when state changes
+
+2. **No stale closures** - Always operates on the latest state value
+
+3. **Fewer dependencies** - Simplifies dependency arrays and reduces memory leaks
+
+4. **Prevents bugs** - Eliminates the most common source of React closure bugs
+
+**When to use functional updates:**
+
+- Any setState that depends on the current state value
+
+- Inside useCallback/useMemo when state is needed
+
+- Event handlers that reference state
+
+- Async operations that update state
+
+**When direct updates are fine:**
+
+- Setting state to a static value: `setCount(0)`
+
+- Setting state from props/arguments only: `setName(newName)`
+
+- State doesn't depend on previous value
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler can automatically optimize some cases, but functional updates are still recommended for correctness and to prevent stale closure bugs.
+
+### 5.10 Use Lazy State Initialization
+
+**Impact: MEDIUM (wasted computation on every render)**
+
+Pass a function to `useState` for expensive initial values. Without the function form, the initializer runs on every render even though the value is only used once.
+
+**Incorrect: runs on every render**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs on EVERY render, even after initialization
+  const [searchIndex, setSearchIndex] = useState(buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  // When query changes, buildSearchIndex runs again unnecessarily
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs on every render
+  const [settings, setSettings] = useState(
+    JSON.parse(localStorage.getItem("settings") || "{}"),
+  );
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+**Correct: runs only once**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs ONLY on initial render
+  const [searchIndex, setSearchIndex] = useState(() => buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs only on initial render
+  const [settings, setSettings] = useState(() => {
+    const stored = localStorage.getItem("settings");
+    return stored ? JSON.parse(stored) : {};
+  });
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+Use lazy initialization when computing initial values from localStorage/sessionStorage, building data structures (indexes, maps), reading from the DOM, or performing heavy transformations.
+
+For simple primitives (`useState(0)`), direct references (`useState(props.value)`), or cheap literals (`useState({})`), the function form is unnecessary.
+
+### 5.11 Use Transitions for Non-Urgent Updates
+
+**Impact: MEDIUM (maintains UI responsiveness)**
+
+Mark frequent, non-urgent state updates as transitions to maintain UI responsiveness.
+
+**Incorrect: blocks UI on every scroll**
+
+```tsx
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => setScrollY(window.scrollY);
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+**Correct: non-blocking updates**
+
+```tsx
+import { startTransition } from "react";
+
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => {
+      startTransition(() => setScrollY(window.scrollY));
+    };
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+### 5.12 Use useRef for Transient Values
+
+**Impact: MEDIUM (avoids unnecessary re-renders on frequent updates)**
+
+When a value changes frequently and you don't want a re-render on every update (e.g., mouse trackers, intervals, transient flags), store it in `useRef` instead of `useState`. Keep component state for UI; use refs for temporary DOM-adjacent values. Updating a ref does not trigger a re-render.
+
+**Incorrect: renders every update**
+
+```tsx
+function Tracker() {
+  const [lastX, setLastX] = useState(0);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => setLastX(e.clientX);
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      style={{
+        position: "fixed",
+        top: 0,
+        left: lastX,
+        width: 8,
+        height: 8,
+        background: "black",
+      }}
+    />
+  );
+}
+```
+
+**Correct: no re-render for tracking**
+
+```tsx
+function Tracker() {
+  const lastXRef = useRef(0);
+  const dotRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => {
+      lastXRef.current = e.clientX;
+      const node = dotRef.current;
+      if (node) {
+        node.style.transform = `translateX(${e.clientX}px)`;
+      }
+    };
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      ref={dotRef}
+      style={{
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: 8,
+        height: 8,
+        background: "black",
+        transform: "translateX(0px)",
+      }}
+    />
+  );
+}
+```
+
+---
+
+## 6. Rendering Performance
+
+**Impact: MEDIUM**
+
+Optimizing the rendering process reduces the work the browser needs to do.
+
+### 6.1 Animate SVG Wrapper Instead of SVG Element
+
+**Impact: LOW (enables hardware acceleration)**
+
+Many browsers don't have hardware acceleration for CSS3 animations on SVG elements. Wrap SVG in a `<div>` and animate the wrapper instead.
+
+**Incorrect: animating SVG directly - no hardware acceleration**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <svg className="animate-spin" width="24" height="24" viewBox="0 0 24 24">
+      <circle cx="12" cy="12" r="10" stroke="currentColor" />
+    </svg>
+  );
+}
+```
+
+**Correct: animating wrapper div - hardware accelerated**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <div className="animate-spin">
+      <svg width="24" height="24" viewBox="0 0 24 24">
+        <circle cx="12" cy="12" r="10" stroke="currentColor" />
+      </svg>
+    </div>
+  );
+}
+```
+
+This applies to all CSS transforms and transitions (`transform`, `opacity`, `translate`, `scale`, `rotate`). The wrapper div allows browsers to use GPU acceleration for smoother animations.
+
+### 6.2 CSS content-visibility for Long Lists
+
+**Impact: HIGH (faster initial render)**
+
+Apply `content-visibility: auto` to defer off-screen rendering.
+
+**CSS:**
+
+```css
+.message-item {
+  content-visibility: auto;
+  contain-intrinsic-size: 0 80px;
+}
+```
+
+**Example:**
+
+```tsx
+function MessageList({ messages }: { messages: Message[] }) {
+  return (
+    <div className="h-screen overflow-y-auto">
+      {messages.map((msg) => (
+        <div key={msg.id} className="message-item">
+          <Avatar user={msg.author} />
+          <div>{msg.content}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+```
+
+For 1000 messages, browser skips layout/paint for ~990 off-screen items (10× faster initial render).
+
+### 6.3 Hoist Static JSX Elements
+
+**Impact: LOW (avoids re-creation)**
+
+Extract static JSX outside components to avoid re-creation.
+
+**Incorrect: recreates element every render**
+
+```tsx
+function LoadingSkeleton() {
+  return <div className="h-20 animate-pulse bg-gray-200" />;
+}
+
+function Container() {
+  return <div>{loading && <LoadingSkeleton />}</div>;
+}
+```
+
+**Correct: reuses same element**
+
+```tsx
+const loadingSkeleton = <div className="h-20 animate-pulse bg-gray-200" />;
+
+function Container() {
+  return <div>{loading && loadingSkeleton}</div>;
+}
+```
+
+This is especially helpful for large and static SVG nodes, which can be expensive to recreate on every render.
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler automatically hoists static JSX elements and optimizes component re-renders, making manual hoisting unnecessary.
+
+### 6.4 Optimize SVG Precision
+
+**Impact: LOW (reduces file size)**
+
+Reduce SVG coordinate precision to decrease file size. The optimal precision depends on the viewBox size, but in general reducing precision should be considered.
+
+**Incorrect: excessive precision**
+
+```svg
+<path d="M 10.293847 20.847362 L 30.938472 40.192837" />
+```
+
+**Correct: 1 decimal place**
+
+```svg
+<path d="M 10.3 20.8 L 30.9 40.2" />
+```
+
+**Automate with SVGO:**
+
+```bash
+npx svgo --precision=1 --multipass icon.svg
+```
+
+### 6.5 Prevent Hydration Mismatch Without Flickering
+
+**Impact: MEDIUM (avoids visual flicker and hydration errors)**
+
+When rendering content that depends on client-side storage (localStorage, cookies), avoid both SSR breakage and post-hydration flickering by injecting a synchronous script that updates the DOM before React hydrates.
+
+**Incorrect: breaks SSR**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  // localStorage is not available on server - throws error
+  const theme = localStorage.getItem("theme") || "light";
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Server-side rendering will fail because `localStorage` is undefined.
+
+**Incorrect: visual flickering**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  const [theme, setTheme] = useState("light");
+
+  useEffect(() => {
+    // Runs after hydration - causes visible flash
+    const stored = localStorage.getItem("theme");
+    if (stored) {
+      setTheme(stored);
+    }
+  }, []);
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Component first renders with default value (`light`), then updates after hydration, causing a visible flash of incorrect content.
+
+**Correct: no flicker, no hydration mismatch**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  return (
+    <>
+      <div id="theme-wrapper">{children}</div>
+      <script
+        dangerouslySetInnerHTML={{
+          __html: `
+            (function() {
+              try {
+                var theme = localStorage.getItem('theme') || 'light';
+                var el = document.getElementById('theme-wrapper');
+                if (el) el.className = theme;
+              } catch (e) {}
+            })();
+          `,
+        }}
+      />
+    </>
+  );
+}
+```
+
+The inline script executes synchronously before showing the element, ensuring the DOM already has the correct value. No flickering, no hydration mismatch.
+
+This pattern is especially useful for theme toggles, user preferences, authentication states, and any client-only data that should render immediately without flashing default values.
+
+### 6.6 Suppress Expected Hydration Mismatches
+
+**Impact: LOW-MEDIUM (avoids noisy hydration warnings for known differences)**
+
+In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these _expected_ mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
+
+**Incorrect: known mismatch warnings**
+
+```tsx
+function Timestamp() {
+  return <span>{new Date().toLocaleString()}</span>;
+}
+```
+
+**Correct: suppress expected mismatch only**
+
+```tsx
+function Timestamp() {
+  return <span suppressHydrationWarning>{new Date().toLocaleString()}</span>;
+}
+```
+
+### 6.7 Use Activity Component for Show/Hide
+
+**Impact: MEDIUM (preserves state/DOM)**
+
+Use React's `<Activity>` to preserve state/DOM for expensive components that frequently toggle visibility.
+
+**Usage:**
+
+```tsx
+import { Activity } from "react";
+
+function Dropdown({ isOpen }: Props) {
+  return (
+    <Activity mode={isOpen ? "visible" : "hidden"}>
+      <ExpensiveMenu />
+    </Activity>
+  );
+}
+```
+
+Avoids expensive re-renders and state loss.
+
+### 6.8 Use Explicit Conditional Rendering
+
+**Impact: LOW (prevents rendering 0 or NaN)**
+
+Use explicit ternary operators (`? :`) instead of `&&` for conditional rendering when the condition can be `0`, `NaN`, or other falsy values that render.
+
+**Incorrect: renders "0" when count is 0**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count && <span className="badge">{count}</span>}</div>;
+}
+
+// When count = 0, renders: <div>0</div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+**Correct: renders nothing when count is 0**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count > 0 ? <span className="badge">{count}</span> : null}</div>;
+}
+
+// When count = 0, renders: <div></div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+### 6.9 Use useTransition Over Manual Loading States
+
+**Impact: LOW (reduces re-renders and improves code clarity)**
+
+Use `useTransition` instead of manual `useState` for loading states. This provides built-in `isPending` state and automatically manages transitions.
+
+**Incorrect: manual loading state**
+
+```tsx
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleSearch = async (value: string) => {
+    setIsLoading(true);
+    setQuery(value);
+    const data = await fetchResults(value);
+    setResults(data);
+    setIsLoading(false);
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isLoading && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Correct: useTransition with built-in pending state**
+
+```tsx
+import { useTransition, useState } from "react";
+
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isPending, startTransition] = useTransition();
+
+  const handleSearch = (value: string) => {
+    setQuery(value); // Update input immediately
+
+    startTransition(async () => {
+      // Fetch and update results
+      const data = await fetchResults(value);
+      setResults(data);
+    });
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isPending && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Benefits:**
+
+- **Automatic pending state**: No need to manually manage `setIsLoading(true/false)`
+
+- **Error resilience**: Pending state correctly resets even if the transition throws
+
+- **Better responsiveness**: Keeps the UI responsive during updates
+
+- **Interrupt handling**: New transitions automatically cancel pending ones
+
+Reference: [https://react.dev/reference/react/useTransition](https://react.dev/reference/react/useTransition)
+
+---
+
+## 7. JavaScript Performance
+
+**Impact: LOW-MEDIUM**
+
+Micro-optimizations for hot paths can add up to meaningful improvements.
+
+### 7.1 Avoid Layout Thrashing
+
+**Impact: MEDIUM (prevents forced synchronous layouts and reduces performance bottlenecks)**
+
+Avoid interleaving style writes with layout reads. When you read a layout property (like `offsetWidth`, `getBoundingClientRect()`, or `getComputedStyle()`) between style changes, the browser is forced to trigger a synchronous reflow.
+
+**This is OK: browser batches style changes**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Each line invalidates style, but browser batches the recalculation
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+}
+```
+
+**Incorrect: interleaved reads and writes force reflows**
+
+```typescript
+function layoutThrashing(element: HTMLElement) {
+  element.style.width = "100px";
+  const width = element.offsetWidth; // Forces reflow
+  element.style.height = "200px";
+  const height = element.offsetHeight; // Forces another reflow
+}
+```
+
+**Correct: batch writes, then read once**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Batch all writes together
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+
+  // Read after all writes are done (single reflow)
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Correct: batch reads, then writes**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  element.classList.add("highlighted-box");
+
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Better: use CSS classes**
+
+**React example:**
+
+```tsx
+// Incorrect: interleaving style changes with layout queries
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (ref.current && isHighlighted) {
+      ref.current.style.width = "100px";
+      const width = ref.current.offsetWidth; // Forces layout
+      ref.current.style.height = "200px";
+    }
+  }, [isHighlighted]);
+
+  return <div ref={ref}>Content</div>;
+}
+
+// Correct: toggle class
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  return <div className={isHighlighted ? "highlighted-box" : ""}>Content</div>;
+}
+```
+
+Prefer CSS classes over inline styles when possible. CSS files are cached by the browser, and classes provide better separation of concerns and are easier to maintain.
+
+See [this gist](https://gist.github.com/paulirish/5d52fb081b3570c81e3a) and [CSS Triggers](https://csstriggers.com/) for more information on layout-forcing operations.
+
+### 7.2 Build Index Maps for Repeated Lookups
+
+**Impact: LOW-MEDIUM (1M ops to 2K ops)**
+
+Multiple `.find()` calls by the same key should use a Map.
+
+**Incorrect (O(n) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  return orders.map((order) => ({
+    ...order,
+    user: users.find((u) => u.id === order.userId),
+  }));
+}
+```
+
+**Correct (O(1) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  const userById = new Map(users.map((u) => [u.id, u]));
+
+  return orders.map((order) => ({
+    ...order,
+    user: userById.get(order.userId),
+  }));
+}
+```
+
+Build map once (O(n)), then all lookups are O(1).
+
+For 1000 orders × 1000 users: 1M ops → 2K ops.
+
+### 7.3 Cache Property Access in Loops
+
+**Impact: LOW-MEDIUM (reduces lookups)**
+
+Cache object property lookups in hot paths.
+
+**Incorrect: 3 lookups × N iterations**
+
+```typescript
+for (let i = 0; i < arr.length; i++) {
+  process(obj.config.settings.value);
+}
+```
+
+**Correct: 1 lookup total**
+
+```typescript
+const value = obj.config.settings.value;
+const len = arr.length;
+for (let i = 0; i < len; i++) {
+  process(value);
+}
+```
+
+### 7.4 Cache Repeated Function Calls
+
+**Impact: MEDIUM (avoid redundant computation)**
+
+Use a module-level Map to cache function results when the same function is called repeatedly with the same inputs during render.
+
+**Incorrect: redundant computation**
+
+```typescript
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // slugify() called 100+ times for same project names
+        const slug = slugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Correct: cached results**
+
+```typescript
+// Module-level cache
+const slugifyCache = new Map<string, string>()
+
+function cachedSlugify(text: string): string {
+  if (slugifyCache.has(text)) {
+    return slugifyCache.get(text)!
+  }
+  const result = slugify(text)
+  slugifyCache.set(text, result)
+  return result
+}
+
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // Computed only once per unique project name
+        const slug = cachedSlugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Simpler pattern for single-value functions:**
+
+```typescript
+let isLoggedInCache: boolean | null = null;
+
+function isLoggedIn(): boolean {
+  if (isLoggedInCache !== null) {
+    return isLoggedInCache;
+  }
+
+  isLoggedInCache = document.cookie.includes("auth=");
+  return isLoggedInCache;
+}
+
+// Clear cache when auth changes
+function onAuthChange() {
+  isLoggedInCache = null;
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+Reference: [https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
+
+### 7.5 Cache Storage API Calls
+
+**Impact: LOW-MEDIUM (reduces expensive I/O)**
+
+`localStorage`, `sessionStorage`, and `document.cookie` are synchronous and expensive. Cache reads in memory.
+
+**Incorrect: reads storage on every call**
+
+```typescript
+function getTheme() {
+  return localStorage.getItem("theme") ?? "light";
+}
+// Called 10 times = 10 storage reads
+```
+
+**Correct: Map cache**
+
+```typescript
+const storageCache = new Map<string, string | null>();
+
+function getLocalStorage(key: string) {
+  if (!storageCache.has(key)) {
+    storageCache.set(key, localStorage.getItem(key));
+  }
+  return storageCache.get(key);
+}
+
+function setLocalStorage(key: string, value: string) {
+  localStorage.setItem(key, value);
+  storageCache.set(key, value); // keep cache in sync
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+**Cookie caching:**
+
+```typescript
+let cookieCache: Record<string, string> | null = null;
+
+function getCookie(name: string) {
+  if (!cookieCache) {
+    cookieCache = Object.fromEntries(
+      document.cookie.split("; ").map((c) => c.split("=")),
+    );
+  }
+  return cookieCache[name];
+}
+```
+
+**Important: invalidate on external changes**
+
+```typescript
+window.addEventListener("storage", (e) => {
+  if (e.key) storageCache.delete(e.key);
+});
+
+document.addEventListener("visibilitychange", () => {
+  if (document.visibilityState === "visible") {
+    storageCache.clear();
+  }
+});
+```
+
+If storage can change externally (another tab, server-set cookies), invalidate cache:
+
+### 7.6 Combine Multiple Array Iterations
+
+**Impact: LOW-MEDIUM (reduces iterations)**
+
+Multiple `.filter()` or `.map()` calls iterate the array multiple times. Combine into one loop.
+
+**Incorrect: 3 iterations**
+
+```typescript
+const admins = users.filter((u) => u.isAdmin);
+const testers = users.filter((u) => u.isTester);
+const inactive = users.filter((u) => !u.isActive);
+```
+
+**Correct: 1 iteration**
+
+```typescript
+const admins: User[] = [];
+const testers: User[] = [];
+const inactive: User[] = [];
+
+for (const user of users) {
+  if (user.isAdmin) admins.push(user);
+  if (user.isTester) testers.push(user);
+  if (!user.isActive) inactive.push(user);
+}
+```
+
+### 7.7 Early Length Check for Array Comparisons
+
+**Impact: MEDIUM-HIGH (avoids expensive operations when lengths differ)**
+
+When comparing arrays with expensive operations (sorting, deep equality, serialization), check lengths first. If lengths differ, the arrays cannot be equal.
+
+In real-world applications, this optimization is especially valuable when the comparison runs in hot paths (event handlers, render loops).
+
+**Incorrect: always runs expensive comparison**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Always sorts and joins, even when lengths differ
+  return current.sort().join() !== original.sort().join();
+}
+```
+
+Two O(n log n) sorts run even when `current.length` is 5 and `original.length` is 100. There is also overhead of joining the arrays and comparing the strings.
+
+**Correct (O(1) length check first):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Early return if lengths differ
+  if (current.length !== original.length) {
+    return true;
+  }
+  // Only sort when lengths match
+  const currentSorted = current.toSorted();
+  const originalSorted = original.toSorted();
+  for (let i = 0; i < currentSorted.length; i++) {
+    if (currentSorted[i] !== originalSorted[i]) {
+      return true;
+    }
+  }
+  return false;
+}
+```
+
+This new approach is more efficient because:
+
+- It avoids the overhead of sorting and joining the arrays when lengths differ
+
+- It avoids consuming memory for the joined strings (especially important for large arrays)
+
+- It avoids mutating the original arrays
+
+- It returns early when a difference is found
+
+### 7.8 Early Return from Functions
+
+**Impact: LOW-MEDIUM (avoids unnecessary computation)**
+
+Return early when result is determined to skip unnecessary processing.
+
+**Incorrect: processes all items even after finding answer**
+
+```typescript
+function validateUsers(users: User[]) {
+  let hasError = false;
+  let errorMessage = "";
+
+  for (const user of users) {
+    if (!user.email) {
+      hasError = true;
+      errorMessage = "Email required";
+    }
+    if (!user.name) {
+      hasError = true;
+      errorMessage = "Name required";
+    }
+    // Continues checking all users even after error found
+  }
+
+  return hasError ? { valid: false, error: errorMessage } : { valid: true };
+}
+```
+
+**Correct: returns immediately on first error**
+
+```typescript
+function validateUsers(users: User[]) {
+  for (const user of users) {
+    if (!user.email) {
+      return { valid: false, error: "Email required" };
+    }
+    if (!user.name) {
+      return { valid: false, error: "Name required" };
+    }
+  }
+
+  return { valid: true };
+}
+```
+
+### 7.9 Hoist RegExp Creation
+
+**Impact: LOW-MEDIUM (avoids recreation)**
+
+Don't create RegExp inside render. Hoist to module scope or memoize with `useMemo()`.
+
+**Incorrect: new RegExp every render**
+
+```tsx
+function Highlighter({ text, query }: Props) {
+  const regex = new RegExp(`(${query})`, 'gi')
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Correct: memoize or hoist**
+
+```tsx
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+
+function Highlighter({ text, query }: Props) {
+  const regex = useMemo(
+    () => new RegExp(`(${escapeRegex(query)})`, 'gi'),
+    [query]
+  )
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Warning: global regex has mutable state**
+
+```typescript
+const regex = /foo/g;
+regex.test("foo"); // true, lastIndex = 3
+regex.test("foo"); // false, lastIndex = 0
+```
+
+Global regex (`/g`) has mutable `lastIndex` state:
+
+### 7.10 Use Loop for Min/Max Instead of Sort
+
+**Impact: LOW (O(n) instead of O(n log n))**
+
+Finding the smallest or largest element only requires a single pass through the array. Sorting is wasteful and slower.
+
+**Incorrect (O(n log n) - sort to find latest):**
+
+```typescript
+interface Project {
+  id: string;
+  name: string;
+  updatedAt: number;
+}
+
+function getLatestProject(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => b.updatedAt - a.updatedAt);
+  return sorted[0];
+}
+```
+
+Sorts the entire array just to find the maximum value.
+
+**Incorrect (O(n log n) - sort for oldest and newest):**
+
+```typescript
+function getOldestAndNewest(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => a.updatedAt - b.updatedAt);
+  return { oldest: sorted[0], newest: sorted[sorted.length - 1] };
+}
+```
+
+Still sorts unnecessarily when only min/max are needed.
+
+**Correct (O(n) - single loop):**
+
+```typescript
+function getLatestProject(projects: Project[]) {
+  if (projects.length === 0) return null;
+
+  let latest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt > latest.updatedAt) {
+      latest = projects[i];
+    }
+  }
+
+  return latest;
+}
+
+function getOldestAndNewest(projects: Project[]) {
+  if (projects.length === 0) return { oldest: null, newest: null };
+
+  let oldest = projects[0];
+  let newest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt < oldest.updatedAt) oldest = projects[i];
+    if (projects[i].updatedAt > newest.updatedAt) newest = projects[i];
+  }
+
+  return { oldest, newest };
+}
+```
+
+Single pass through the array, no copying, no sorting.
+
+**Alternative: Math.min/Math.max for small arrays**
+
+```typescript
+const numbers = [5, 2, 8, 1, 9];
+const min = Math.min(...numbers);
+const max = Math.max(...numbers);
+```
+
+This works for small arrays, but can be slower or just throw an error for very large arrays due to spread operator limitations. Maximal array length is approximately 124000 in Chrome 143 and 638000 in Safari 18; exact numbers may vary - see [the fiddle](https://jsfiddle.net/qw1jabsx/4/). Use the loop approach for reliability.
+
+### 7.11 Use Set/Map for O(1) Lookups
+
+**Impact: LOW-MEDIUM (O(n) to O(1))**
+
+Convert arrays to Set/Map for repeated membership checks.
+
+**Incorrect (O(n) per check):**
+
+```typescript
+const allowedIds = ['a', 'b', 'c', ...]
+items.filter(item => allowedIds.includes(item.id))
+```
+
+**Correct (O(1) per check):**
+
+```typescript
+const allowedIds = new Set(['a', 'b', 'c', ...])
+items.filter(item => allowedIds.has(item.id))
+```
+
+### 7.12 Use toSorted() Instead of sort() for Immutability
+
+**Impact: MEDIUM-HIGH (prevents mutation bugs in React state)**
+
+`.sort()` mutates the array in place, which can cause bugs with React state and props. Use `.toSorted()` to create a new sorted array without mutation.
+
+**Incorrect: mutates original array**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Mutates the users prop array!
+  const sorted = useMemo(
+    () => users.sort((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Correct: creates new array**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Creates new sorted array, original unchanged
+  const sorted = useMemo(
+    () => users.toSorted((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Why this matters in React:**
+
+1. Props/state mutations break React's immutability model - React expects props and state to be treated as read-only
+
+2. Causes stale closure bugs - Mutating arrays inside closures (callbacks, effects) can lead to unexpected behavior
+
+**Browser support: fallback for older browsers**
+
+```typescript
+// Fallback for older browsers
+const sorted = [...items].sort((a, b) => a.value - b.value);
+```
+
+`.toSorted()` is available in all modern browsers (Chrome 110+, Safari 16+, Firefox 115+, Node.js 20+). For older environments, use spread operator:
+
+**Other immutable array methods:**
+
+- `.toSorted()` - immutable sort
+
+- `.toReversed()` - immutable reverse
+
+- `.toSpliced()` - immutable splice
+
+- `.with()` - immutable element replacement
+
+---
+
+## 8. Advanced Patterns
+
+**Impact: LOW**
+
+Advanced patterns for specific cases that require careful implementation.
+
+### 8.1 Initialize App Once, Not Per Mount
+
+**Impact: LOW-MEDIUM (avoids duplicate init in development)**
+
+Do not put app-wide initialization that must run once per app load inside `useEffect([])` of a component. Components can remount and effects will re-run. Use a module-level guard or top-level init in the entry module instead.
+
+**Incorrect: runs twice in dev, re-runs on remount**
+
+```tsx
+function Comp() {
+  useEffect(() => {
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+**Correct: once per app load**
+
+```tsx
+let didInit = false;
+
+function Comp() {
+  useEffect(() => {
+    if (didInit) return;
+    didInit = true;
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+Reference: [https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application](https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application)
+
+### 8.2 Store Event Handlers in Refs
+
+**Impact: LOW (stable subscriptions)**
+
+Store callbacks in refs when used in effects that shouldn't re-subscribe on callback changes.
+
+**Incorrect: re-subscribes on every render**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  useEffect(() => {
+    window.addEventListener(event, handler);
+    return () => window.removeEventListener(event, handler);
+  }, [event, handler]);
+}
+```
+
+**Correct: stable subscription**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function useWindowEvent(event: string, handler: (e) => void) {
+  const onEvent = useEffectEvent(handler);
+
+  useEffect(() => {
+    window.addEventListener(event, onEvent);
+    return () => window.removeEventListener(event, onEvent);
+  }, [event]);
+}
+```
+
+**Alternative: use `useEffectEvent` if you're on latest React:**
+
+`useEffectEvent` provides a cleaner API for the same pattern: it creates a stable function reference that always calls the latest version of the handler.
+
+### 8.3 useEffectEvent for Stable Callback Refs
+
+**Impact: LOW (prevents effect re-runs)**
+
+Access latest values in callbacks without adding them to dependency arrays. Prevents effect re-runs while avoiding stale closures.
+
+**Incorrect: effect re-runs on every callback change**
+
+```tsx
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearch(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query, onSearch]);
+}
+```
+
+**Correct: using React's useEffectEvent**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+  const onSearchEvent = useEffectEvent(onSearch);
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearchEvent(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query]);
+}
+```
+
+---
+
+## References
+
+1. [https://react.dev](https://react.dev)
+2. [https://nextjs.org](https://nextjs.org)
+3. [https://swr.vercel.app](https://swr.vercel.app)
+4. [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
+5. [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
+6. [https://vercel.com/blog/how-we-optimized-package-imports-in-next-js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
+7. [https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
diff --git a/.claude/skills/vercel-react-best-practices/SKILL.md b/.claude/skills/vercel-react-best-practices/SKILL.md
new file mode 100644
index 000000000..54fe8dc0e
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/SKILL.md
@@ -0,0 +1,138 @@
+---
+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
+
+Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 57 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.
+
+## When to Apply
+
+Reference these guidelines when:
+
+- Writing new React components or Next.js pages
+- Implementing data fetching (client or server-side)
+- Reviewing code for performance issues
+- Refactoring existing React/Next.js code
+- Optimizing bundle size or load times
+
+## 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-`  |
+
+## Quick Reference
+
+### 1. Eliminating Waterfalls (CRITICAL)
+
+- `async-defer-await` - Move await into branches where actually used
+- `async-parallel` - Use Promise.all() for independent 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
+
+### 2. Bundle Size Optimization (CRITICAL)
+
+- `bundle-barrel-imports` - Import directly, avoid barrel files
+- `bundle-dynamic-imports` - Use next/dynamic for heavy components
+- `bundle-defer-third-party` - Load analytics/logging after hydration
+- `bundle-conditional` - Load modules only when feature is activated
+- `bundle-preload` - Preload on hover/focus for perceived speed
+
+### 3. Server-Side Performance (HIGH)
+
+- `server-auth-actions` - 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-serialization` - Minimize data passed to client components
+- `server-parallel-fetching` - Restructure components to parallelize fetches
+- `server-after-nonblocking` - Use after() for non-blocking operations
+
+### 4. Client-Side Data Fetching (MEDIUM-HIGH)
+
+- `client-swr-dedup` - Use SWR for automatic request deduplication
+- `client-event-listeners` - Deduplicate global event listeners
+- `client-passive-event-listeners` - Use passive listeners for scroll
+- `client-localstorage-schema` - Version and minimize localStorage data
+
+### 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
+- `rerender-derived-state` - Subscribe to derived booleans, not raw values
+- `rerender-derived-state-no-effect` - Derive state during render, not effects
+- `rerender-functional-setstate` - Use functional setState for stable callbacks
+- `rerender-lazy-state-init` - Pass function to useState for expensive values
+- `rerender-simple-expression-in-memo` - Avoid memo for simple primitives
+- `rerender-move-effect-to-event` - Put interaction logic in event handlers
+- `rerender-transitions` - Use startTransition for non-urgent updates
+- `rerender-use-ref-transient-values` - Use refs for transient frequent values
+
+### 6. Rendering Performance (MEDIUM)
+
+- `rendering-animate-svg-wrapper` - Animate div wrapper, not SVG element
+- `rendering-content-visibility` - Use content-visibility for long lists
+- `rendering-hoist-jsx` - Extract static JSX outside components
+- `rendering-svg-precision` - Reduce SVG coordinate precision
+- `rendering-hydration-no-flicker` - Use inline script for client-only data
+- `rendering-hydration-suppress-warning` - Suppress expected mismatches
+- `rendering-activity` - Use Activity component for show/hide
+- `rendering-conditional-render` - Use ternary, not && for conditionals
+- `rendering-usetransition-loading` - Prefer useTransition for loading state
+
+### 7. JavaScript Performance (LOW-MEDIUM)
+
+- `js-batch-dom-css` - Group CSS changes via classes or cssText
+- `js-index-maps` - Build Map for repeated lookups
+- `js-cache-property-access` - Cache object properties in loops
+- `js-cache-function-results` - Cache function results in module-level Map
+- `js-cache-storage` - Cache localStorage/sessionStorage reads
+- `js-combine-iterations` - Combine multiple filter/map into one loop
+- `js-length-check-first` - Check array length before expensive comparison
+- `js-early-exit` - Return early from functions
+- `js-hoist-regexp` - Hoist RegExp creation outside loops
+- `js-min-max-loop` - Use loop for min/max instead of sort
+- `js-set-map-lookups` - Use Set/Map for O(1) lookups
+- `js-tosorted-immutable` - Use toSorted() for immutability
+
+### 8. Advanced Patterns (LOW)
+
+- `advanced-event-handler-refs` - Store event handlers in refs
+- `advanced-init-once` - Initialize app once per app load
+- `advanced-use-latest` - useLatest for stable callback refs
+
+## How to Use
+
+Read individual rule files for detailed explanations and code examples:
+
+```
+rules/async-parallel.md
+rules/bundle-barrel-imports.md
+```
+
+Each rule file contains:
+
+- Brief explanation of why it matters
+- Incorrect code example with explanation
+- Correct code example with explanation
+- Additional context and references
+
+## Full Compiled Document
+
+For the complete guide with all rules expanded: `AGENTS.md`
diff --git a/.claude/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md b/.claude/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md
new file mode 100644
index 000000000..435261a66
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md
@@ -0,0 +1,55 @@
+---
+title: Store Event Handlers in Refs
+impact: LOW
+impactDescription: stable subscriptions
+tags: advanced, hooks, refs, event-handlers, optimization
+---
+
+## Store Event Handlers in Refs
+
+Store callbacks in refs when used in effects that shouldn't re-subscribe on callback changes.
+
+**Incorrect (re-subscribes on every render):**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  useEffect(() => {
+    window.addEventListener(event, handler);
+    return () => window.removeEventListener(event, handler);
+  }, [event, handler]);
+}
+```
+
+**Correct (stable subscription):**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  const handlerRef = useRef(handler);
+  useEffect(() => {
+    handlerRef.current = handler;
+  }, [handler]);
+
+  useEffect(() => {
+    const listener = (e) => handlerRef.current(e);
+    window.addEventListener(event, listener);
+    return () => window.removeEventListener(event, listener);
+  }, [event]);
+}
+```
+
+**Alternative: use `useEffectEvent` if you're on latest React:**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function useWindowEvent(event: string, handler: (e) => void) {
+  const onEvent = useEffectEvent(handler);
+
+  useEffect(() => {
+    window.addEventListener(event, onEvent);
+    return () => window.removeEventListener(event, onEvent);
+  }, [event]);
+}
+```
+
+`useEffectEvent` provides a cleaner API for the same pattern: it creates a stable function reference that always calls the latest version of the handler.
diff --git a/.claude/skills/vercel-react-best-practices/rules/advanced-init-once.md b/.claude/skills/vercel-react-best-practices/rules/advanced-init-once.md
new file mode 100644
index 000000000..1cf8de795
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/advanced-init-once.md
@@ -0,0 +1,42 @@
+---
+title: Initialize App Once, Not Per Mount
+impact: LOW-MEDIUM
+impactDescription: avoids duplicate init in development
+tags: initialization, useEffect, app-startup, side-effects
+---
+
+## Initialize App Once, Not Per Mount
+
+Do not put app-wide initialization that must run once per app load inside `useEffect([])` of a component. Components can remount and effects will re-run. Use a module-level guard or top-level init in the entry module instead.
+
+**Incorrect (runs twice in dev, re-runs on remount):**
+
+```tsx
+function Comp() {
+  useEffect(() => {
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+**Correct (once per app load):**
+
+```tsx
+let didInit = false;
+
+function Comp() {
+  useEffect(() => {
+    if (didInit) return;
+    didInit = true;
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+Reference: [Initializing the application](https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application)
diff --git a/.claude/skills/vercel-react-best-practices/rules/advanced-use-latest.md b/.claude/skills/vercel-react-best-practices/rules/advanced-use-latest.md
new file mode 100644
index 000000000..45e2842da
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/advanced-use-latest.md
@@ -0,0 +1,39 @@
+---
+title: useEffectEvent for Stable Callback Refs
+impact: LOW
+impactDescription: prevents effect re-runs
+tags: advanced, hooks, useEffectEvent, refs, optimization
+---
+
+## useEffectEvent for Stable Callback Refs
+
+Access latest values in callbacks without adding them to dependency arrays. Prevents effect re-runs while avoiding stale closures.
+
+**Incorrect (effect re-runs on every callback change):**
+
+```tsx
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearch(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query, onSearch]);
+}
+```
+
+**Correct (using React's useEffectEvent):**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+  const onSearchEvent = useEffectEvent(onSearch);
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearchEvent(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query]);
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/async-api-routes.md b/.claude/skills/vercel-react-best-practices/rules/async-api-routes.md
new file mode 100644
index 000000000..833833183
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/async-api-routes.md
@@ -0,0 +1,38 @@
+---
+title: Prevent Waterfall Chains in API Routes
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: api-routes, server-actions, waterfalls, parallelization
+---
+
+## Prevent Waterfall Chains in API Routes
+
+In API routes and Server Actions, start independent operations immediately, even if you don't await them yet.
+
+**Incorrect (config waits for auth, data waits for both):**
+
+```typescript
+export async function GET(request: Request) {
+  const session = await auth();
+  const config = await fetchConfig();
+  const data = await fetchData(session.user.id);
+  return Response.json({ data, config });
+}
+```
+
+**Correct (auth and config start immediately):**
+
+```typescript
+export async function GET(request: Request) {
+  const sessionPromise = auth();
+  const configPromise = fetchConfig();
+  const session = await sessionPromise;
+  const [config, data] = await Promise.all([
+    configPromise,
+    fetchData(session.user.id),
+  ]);
+  return Response.json({ data, config });
+}
+```
+
+For operations with more complex dependency chains, use `better-all` to automatically maximize parallelism (see Dependency-Based Parallelization).
diff --git a/.claude/skills/vercel-react-best-practices/rules/async-defer-await.md b/.claude/skills/vercel-react-best-practices/rules/async-defer-await.md
new file mode 100644
index 000000000..2b4d821db
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/async-defer-await.md
@@ -0,0 +1,80 @@
+---
+title: Defer Await Until Needed
+impact: HIGH
+impactDescription: avoids blocking unused code paths
+tags: async, await, conditional, optimization
+---
+
+## Defer Await Until Needed
+
+Move `await` operations into the branches where they're actually used to avoid blocking code paths that don't need them.
+
+**Incorrect (blocks both branches):**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  const userData = await fetchUserData(userId);
+
+  if (skipProcessing) {
+    // Returns immediately but still waited for userData
+    return { skipped: true };
+  }
+
+  // Only this branch uses userData
+  return processUserData(userData);
+}
+```
+
+**Correct (only blocks when needed):**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  if (skipProcessing) {
+    // Returns immediately without waiting
+    return { skipped: true };
+  }
+
+  // Fetch only when needed
+  const userData = await fetchUserData(userId);
+  return processUserData(userData);
+}
+```
+
+**Another example (early return optimization):**
+
+```typescript
+// Incorrect: always fetches permissions
+async function updateResource(resourceId: string, userId: string) {
+  const permissions = await fetchPermissions(userId);
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+
+// Correct: fetches only when needed
+async function updateResource(resourceId: string, userId: string) {
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  const permissions = await fetchPermissions(userId);
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+```
+
+This optimization is especially valuable when the skipped branch is frequently taken, or when the deferred operation is expensive.
diff --git a/.claude/skills/vercel-react-best-practices/rules/async-dependencies.md b/.claude/skills/vercel-react-best-practices/rules/async-dependencies.md
new file mode 100644
index 000000000..405074d9f
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/async-dependencies.md
@@ -0,0 +1,52 @@
+---
+title: Dependency-Based Parallelization
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: async, parallelization, dependencies, better-all
+---
+
+## Dependency-Based Parallelization
+
+For operations with partial dependencies, use `better-all` to maximize parallelism. It automatically starts each task at the earliest possible moment.
+
+**Incorrect (profile waits for config unnecessarily):**
+
+```typescript
+const [user, config] = await Promise.all([fetchUser(), fetchConfig()]);
+const profile = await fetchProfile(user.id);
+```
+
+**Correct (config and profile run in parallel):**
+
+```typescript
+import { all } from "better-all";
+
+const { user, config, profile } = await all({
+  async user() {
+    return fetchUser();
+  },
+  async config() {
+    return fetchConfig();
+  },
+  async profile() {
+    return fetchProfile((await this.$.user).id);
+  },
+});
+```
+
+**Alternative without extra dependencies:**
+
+We can also create all the promises first, and do `Promise.all()` at the end.
+
+```typescript
+const userPromise = fetchUser();
+const profilePromise = userPromise.then((user) => fetchProfile(user.id));
+
+const [user, config, profile] = await Promise.all([
+  userPromise,
+  fetchConfig(),
+  profilePromise,
+]);
+```
+
+Reference: [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
diff --git a/.claude/skills/vercel-react-best-practices/rules/async-parallel.md b/.claude/skills/vercel-react-best-practices/rules/async-parallel.md
new file mode 100644
index 000000000..91102101e
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/async-parallel.md
@@ -0,0 +1,28 @@
+---
+title: Promise.all() for Independent Operations
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: async, parallelization, promises, waterfalls
+---
+
+## Promise.all() for Independent Operations
+
+When async operations have no interdependencies, execute them concurrently using `Promise.all()`.
+
+**Incorrect (sequential execution, 3 round trips):**
+
+```typescript
+const user = await fetchUser();
+const posts = await fetchPosts();
+const comments = await fetchComments();
+```
+
+**Correct (parallel execution, 1 round trip):**
+
+```typescript
+const [user, posts, comments] = await Promise.all([
+  fetchUser(),
+  fetchPosts(),
+  fetchComments(),
+]);
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md b/.claude/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md
new file mode 100644
index 000000000..790027e5d
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md
@@ -0,0 +1,99 @@
+---
+title: Strategic Suspense Boundaries
+impact: HIGH
+impactDescription: faster initial paint
+tags: async, suspense, streaming, layout-shift
+---
+
+## Strategic Suspense Boundaries
+
+Instead of awaiting data in async components before returning JSX, use Suspense boundaries to show the wrapper UI faster while data loads.
+
+**Incorrect (wrapper blocked by data fetching):**
+
+```tsx
+async function Page() {
+  const data = await fetchData(); // Blocks entire page
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <DataDisplay data={data} />
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+```
+
+The entire layout waits for data even though only the middle section needs it.
+
+**Correct (wrapper shows immediately, data streams in):**
+
+```tsx
+function Page() {
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <Suspense fallback={<Skeleton />}>
+          <DataDisplay />
+        </Suspense>
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+async function DataDisplay() {
+  const data = await fetchData(); // Only blocks this component
+  return <div>{data.content}</div>;
+}
+```
+
+Sidebar, Header, and Footer render immediately. Only DataDisplay waits for data.
+
+**Alternative (share promise across components):**
+
+```tsx
+function Page() {
+  // Start fetch immediately, but don't await
+  const dataPromise = fetchData();
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <Suspense fallback={<Skeleton />}>
+        <DataDisplay dataPromise={dataPromise} />
+        <DataSummary dataPromise={dataPromise} />
+      </Suspense>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+function DataDisplay({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Unwraps the promise
+  return <div>{data.content}</div>;
+}
+
+function DataSummary({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Reuses the same promise
+  return <div>{data.summary}</div>;
+}
+```
+
+Both components share the same promise, so only one fetch occurs. Layout renders immediately while both components wait together.
+
+**When NOT to use this pattern:**
+
+- Critical data needed for layout decisions (affects positioning)
+- SEO-critical content above the fold
+- Small, fast queries where suspense overhead isn't worth it
+- When you want to avoid layout shift (loading → content jump)
+
+**Trade-off:** Faster initial paint vs potential layout shift. Choose based on your UX priorities.
diff --git a/.claude/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md b/.claude/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md
new file mode 100644
index 000000000..8b038a57c
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md
@@ -0,0 +1,59 @@
+---
+title: Avoid Barrel File Imports
+impact: CRITICAL
+impactDescription: 200-800ms import cost, slow builds
+tags: bundle, imports, tree-shaking, barrel-files, performance
+---
+
+## Avoid Barrel File Imports
+
+Import directly from source files instead of barrel files to avoid loading thousands of unused modules. **Barrel files** are entry points that re-export multiple modules (e.g., `index.js` that does `export * from './module'`).
+
+Popular icon and component libraries can have **up to 10,000 re-exports** in their entry file. For many React packages, **it takes 200-800ms just to import them**, affecting both development speed and production cold starts.
+
+**Why tree-shaking doesn't help:** When a library is marked as external (not bundled), the bundler can't optimize it. If you bundle it to enable tree-shaking, builds become substantially slower analyzing the entire module graph.
+
+**Incorrect (imports entire library):**
+
+```tsx
+import { Check, X, Menu } from "lucide-react";
+// Loads 1,583 modules, takes ~2.8s extra in dev
+// Runtime cost: 200-800ms on every cold start
+
+import { Button, TextField } from "@mui/material";
+// Loads 2,225 modules, takes ~4.2s extra in dev
+```
+
+**Correct (imports only what you need):**
+
+```tsx
+import Check from "lucide-react/dist/esm/icons/check";
+import X from "lucide-react/dist/esm/icons/x";
+import Menu from "lucide-react/dist/esm/icons/menu";
+// Loads only 3 modules (~2KB vs ~1MB)
+
+import Button from "@mui/material/Button";
+import TextField from "@mui/material/TextField";
+// Loads only what you use
+```
+
+**Alternative (Next.js 13.5+):**
+
+```js
+// next.config.js - use optimizePackageImports
+module.exports = {
+  experimental: {
+    optimizePackageImports: ["lucide-react", "@mui/material"],
+  },
+};
+
+// Then you can keep the ergonomic barrel imports:
+import { Check, X, Menu } from "lucide-react";
+// Automatically transformed to direct imports at build time
+```
+
+Direct imports provide 15-70% faster dev boot, 28% faster builds, 40% faster cold starts, and significantly faster HMR.
+
+Libraries commonly affected: `lucide-react`, `@mui/material`, `@mui/icons-material`, `@tabler/icons-react`, `react-icons`, `@headlessui/react`, `@radix-ui/react-*`, `lodash`, `ramda`, `date-fns`, `rxjs`, `react-use`.
+
+Reference: [How we optimized package imports in Next.js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
diff --git a/.claude/skills/vercel-react-best-practices/rules/bundle-conditional.md b/.claude/skills/vercel-react-best-practices/rules/bundle-conditional.md
new file mode 100644
index 000000000..a541a0208
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/bundle-conditional.md
@@ -0,0 +1,37 @@
+---
+title: Conditional Module Loading
+impact: HIGH
+impactDescription: loads large data only when needed
+tags: bundle, conditional-loading, lazy-loading
+---
+
+## Conditional Module Loading
+
+Load large data or modules only when a feature is activated.
+
+**Example (lazy-load animation frames):**
+
+```tsx
+function AnimationPlayer({
+  enabled,
+  setEnabled,
+}: {
+  enabled: boolean;
+  setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
+}) {
+  const [frames, setFrames] = useState<Frame[] | null>(null);
+
+  useEffect(() => {
+    if (enabled && !frames && typeof window !== "undefined") {
+      import("./animation-frames.js")
+        .then((mod) => setFrames(mod.frames))
+        .catch(() => setEnabled(false));
+    }
+  }, [enabled, frames, setEnabled]);
+
+  if (!frames) return <Skeleton />;
+  return <Canvas frames={frames} />;
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.
diff --git a/.claude/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md b/.claude/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md
new file mode 100644
index 000000000..b65b097d1
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md
@@ -0,0 +1,49 @@
+---
+title: Defer Non-Critical Third-Party Libraries
+impact: MEDIUM
+impactDescription: loads after hydration
+tags: bundle, third-party, analytics, defer
+---
+
+## Defer Non-Critical Third-Party Libraries
+
+Analytics, logging, and error tracking don't block user interaction. Load them after hydration.
+
+**Incorrect (blocks initial bundle):**
+
+```tsx
+import { Analytics } from "@vercel/analytics/react";
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+**Correct (loads after hydration):**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const Analytics = dynamic(
+  () => import("@vercel/analytics/react").then((m) => m.Analytics),
+  { ssr: false },
+);
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md b/.claude/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md
new file mode 100644
index 000000000..4fbd3d937
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md
@@ -0,0 +1,35 @@
+---
+title: Dynamic Imports for Heavy Components
+impact: CRITICAL
+impactDescription: directly affects TTI and LCP
+tags: bundle, dynamic-import, code-splitting, next-dynamic
+---
+
+## Dynamic Imports for Heavy Components
+
+Use `next/dynamic` to lazy-load large components not needed on initial render.
+
+**Incorrect (Monaco bundles with main chunk ~300KB):**
+
+```tsx
+import { MonacoEditor } from "./monaco-editor";
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+**Correct (Monaco loads on demand):**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const MonacoEditor = dynamic(
+  () => import("./monaco-editor").then((m) => m.MonacoEditor),
+  { ssr: false },
+);
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/bundle-preload.md b/.claude/skills/vercel-react-best-practices/rules/bundle-preload.md
new file mode 100644
index 000000000..d38946dc7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/bundle-preload.md
@@ -0,0 +1,46 @@
+---
+title: Preload Based on User Intent
+impact: MEDIUM
+impactDescription: reduces perceived latency
+tags: bundle, preload, user-intent, hover
+---
+
+## Preload Based on User Intent
+
+Preload heavy bundles before they're needed to reduce perceived latency.
+
+**Example (preload on hover/focus):**
+
+```tsx
+function EditorButton({ onClick }: { onClick: () => void }) {
+  const preload = () => {
+    if (typeof window !== "undefined") {
+      void import("./monaco-editor");
+    }
+  };
+
+  return (
+    <button onMouseEnter={preload} onFocus={preload} onClick={onClick}>
+      Open Editor
+    </button>
+  );
+}
+```
+
+**Example (preload when feature flag is enabled):**
+
+```tsx
+function FlagsProvider({ children, flags }: Props) {
+  useEffect(() => {
+    if (flags.editorEnabled && typeof window !== "undefined") {
+      void import("./monaco-editor").then((mod) => mod.init());
+    }
+  }, [flags.editorEnabled]);
+
+  return (
+    <FlagsContext.Provider value={flags}>{children}</FlagsContext.Provider>
+  );
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling preloaded modules for SSR, optimizing server bundle size and build speed.
diff --git a/.claude/skills/vercel-react-best-practices/rules/client-event-listeners.md b/.claude/skills/vercel-react-best-practices/rules/client-event-listeners.md
new file mode 100644
index 000000000..a40d82ae0
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/client-event-listeners.md
@@ -0,0 +1,78 @@
+---
+title: Deduplicate Global Event Listeners
+impact: LOW
+impactDescription: single listener for N components
+tags: client, swr, event-listeners, subscription
+---
+
+## Deduplicate Global Event Listeners
+
+Use `useSWRSubscription()` to share global event listeners across component instances.
+
+**Incorrect (N instances = N listeners):**
+
+```tsx
+function useKeyboardShortcut(key: string, callback: () => void) {
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && e.key === key) {
+        callback();
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [key, callback]);
+}
+```
+
+When using the `useKeyboardShortcut` hook multiple times, each instance will register a new listener.
+
+**Correct (N instances = 1 listener):**
+
+```tsx
+import useSWRSubscription from "swr/subscription";
+
+// Module-level Map to track callbacks per key
+const keyCallbacks = new Map<string, Set<() => void>>();
+
+function useKeyboardShortcut(key: string, callback: () => void) {
+  // Register this callback in the Map
+  useEffect(() => {
+    if (!keyCallbacks.has(key)) {
+      keyCallbacks.set(key, new Set());
+    }
+    keyCallbacks.get(key)!.add(callback);
+
+    return () => {
+      const set = keyCallbacks.get(key);
+      if (set) {
+        set.delete(callback);
+        if (set.size === 0) {
+          keyCallbacks.delete(key);
+        }
+      }
+    };
+  }, [key, callback]);
+
+  useSWRSubscription("global-keydown", () => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && keyCallbacks.has(e.key)) {
+        keyCallbacks.get(e.key)!.forEach((cb) => cb());
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  });
+}
+
+function Profile() {
+  // Multiple shortcuts will share the same listener
+  useKeyboardShortcut("p", () => {
+    /* ... */
+  });
+  useKeyboardShortcut("k", () => {
+    /* ... */
+  });
+  // ...
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/client-localstorage-schema.md b/.claude/skills/vercel-react-best-practices/rules/client-localstorage-schema.md
new file mode 100644
index 000000000..7c4d8c957
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/client-localstorage-schema.md
@@ -0,0 +1,77 @@
+---
+title: Version and Minimize localStorage Data
+impact: MEDIUM
+impactDescription: prevents schema conflicts, reduces storage size
+tags: client, localStorage, storage, versioning, data-minimization
+---
+
+## Version and Minimize localStorage Data
+
+Add version prefix to keys and store only needed fields. Prevents schema conflicts and accidental storage of sensitive data.
+
+**Incorrect:**
+
+```typescript
+// No version, stores everything, no error handling
+localStorage.setItem("userConfig", JSON.stringify(fullUserObject));
+const data = localStorage.getItem("userConfig");
+```
+
+**Correct:**
+
+```typescript
+const VERSION = "v2";
+
+function saveConfig(config: { theme: string; language: string }) {
+  try {
+    localStorage.setItem(`userConfig:${VERSION}`, JSON.stringify(config));
+  } catch {
+    // Throws in incognito/private browsing, quota exceeded, or disabled
+  }
+}
+
+function loadConfig() {
+  try {
+    const data = localStorage.getItem(`userConfig:${VERSION}`);
+    return data ? JSON.parse(data) : null;
+  } catch {
+    return null;
+  }
+}
+
+// Migration from v1 to v2
+function migrate() {
+  try {
+    const v1 = localStorage.getItem("userConfig:v1");
+    if (v1) {
+      const old = JSON.parse(v1);
+      saveConfig({
+        theme: old.darkMode ? "dark" : "light",
+        language: old.lang,
+      });
+      localStorage.removeItem("userConfig:v1");
+    }
+  } catch {}
+}
+```
+
+**Store minimal fields from server responses:**
+
+```typescript
+// User object has 20+ fields, only store what UI needs
+function cachePrefs(user: FullUser) {
+  try {
+    localStorage.setItem(
+      "prefs:v1",
+      JSON.stringify({
+        theme: user.preferences.theme,
+        notifications: user.preferences.notifications,
+      }),
+    );
+  } catch {}
+}
+```
+
+**Always wrap in try-catch:** `getItem()` and `setItem()` throw in incognito/private browsing (Safari, Firefox), when quota exceeded, or when disabled.
+
+**Benefits:** Schema evolution via versioning, reduced storage size, prevents storing tokens/PII/internal flags.
diff --git a/.claude/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md b/.claude/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md
new file mode 100644
index 000000000..63da92631
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md
@@ -0,0 +1,48 @@
+---
+title: Use Passive Event Listeners for Scrolling Performance
+impact: MEDIUM
+impactDescription: eliminates scroll delay caused by event listeners
+tags: client, event-listeners, scrolling, performance, touch, wheel
+---
+
+## Use Passive Event Listeners for Scrolling Performance
+
+Add `{ passive: true }` to touch and wheel event listeners to enable immediate scrolling. Browsers normally wait for listeners to finish to check if `preventDefault()` is called, causing scroll delay.
+
+**Incorrect:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch);
+  document.addEventListener("wheel", handleWheel);
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Correct:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch, { passive: true });
+  document.addEventListener("wheel", handleWheel, { passive: true });
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Use passive when:** tracking/analytics, logging, any listener that doesn't call `preventDefault()`.
+
+**Don't use passive when:** implementing custom swipe gestures, custom zoom controls, or any listener that needs `preventDefault()`.
diff --git a/.claude/skills/vercel-react-best-practices/rules/client-swr-dedup.md b/.claude/skills/vercel-react-best-practices/rules/client-swr-dedup.md
new file mode 100644
index 000000000..a056b4271
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/client-swr-dedup.md
@@ -0,0 +1,56 @@
+---
+title: Use SWR for Automatic Deduplication
+impact: MEDIUM-HIGH
+impactDescription: automatic deduplication
+tags: client, swr, deduplication, data-fetching
+---
+
+## Use SWR for Automatic Deduplication
+
+SWR enables request deduplication, caching, and revalidation across component instances.
+
+**Incorrect (no deduplication, each instance fetches):**
+
+```tsx
+function UserList() {
+  const [users, setUsers] = useState([]);
+  useEffect(() => {
+    fetch("/api/users")
+      .then((r) => r.json())
+      .then(setUsers);
+  }, []);
+}
+```
+
+**Correct (multiple instances share one request):**
+
+```tsx
+import useSWR from "swr";
+
+function UserList() {
+  const { data: users } = useSWR("/api/users", fetcher);
+}
+```
+
+**For immutable data:**
+
+```tsx
+import { useImmutableSWR } from "@/lib/swr";
+
+function StaticContent() {
+  const { data } = useImmutableSWR("/api/config", fetcher);
+}
+```
+
+**For mutations:**
+
+```tsx
+import { useSWRMutation } from "swr/mutation";
+
+function UpdateButton() {
+  const { trigger } = useSWRMutation("/api/user", updateUser);
+  return <button onClick={() => trigger()}>Update</button>;
+}
+```
+
+Reference: [https://swr.vercel.app](https://swr.vercel.app)
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-batch-dom-css.md b/.claude/skills/vercel-react-best-practices/rules/js-batch-dom-css.md
new file mode 100644
index 000000000..5a7fc2b0d
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-batch-dom-css.md
@@ -0,0 +1,110 @@
+---
+title: Avoid Layout Thrashing
+impact: MEDIUM
+impactDescription: prevents forced synchronous layouts and reduces performance bottlenecks
+tags: javascript, dom, css, performance, reflow, layout-thrashing
+---
+
+## Avoid Layout Thrashing
+
+Avoid interleaving style writes with layout reads. When you read a layout property (like `offsetWidth`, `getBoundingClientRect()`, or `getComputedStyle()`) between style changes, the browser is forced to trigger a synchronous reflow.
+
+**This is OK (browser batches style changes):**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Each line invalidates style, but browser batches the recalculation
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+}
+```
+
+**Incorrect (interleaved reads and writes force reflows):**
+
+```typescript
+function layoutThrashing(element: HTMLElement) {
+  element.style.width = "100px";
+  const width = element.offsetWidth; // Forces reflow
+  element.style.height = "200px";
+  const height = element.offsetHeight; // Forces another reflow
+}
+```
+
+**Correct (batch writes, then read once):**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Batch all writes together
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+
+  // Read after all writes are done (single reflow)
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Correct (batch reads, then writes):**
+
+```typescript
+function avoidThrashing(element: HTMLElement) {
+  // Read phase - all layout queries first
+  const rect1 = element.getBoundingClientRect();
+  const offsetWidth = element.offsetWidth;
+  const offsetHeight = element.offsetHeight;
+
+  // Write phase - all style changes after
+  element.style.width = "100px";
+  element.style.height = "200px";
+}
+```
+
+**Better: use CSS classes**
+
+```css
+.highlighted-box {
+  width: 100px;
+  height: 200px;
+  background-color: blue;
+  border: 1px solid black;
+}
+```
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  element.classList.add("highlighted-box");
+
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**React example:**
+
+```tsx
+// Incorrect: interleaving style changes with layout queries
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (ref.current && isHighlighted) {
+      ref.current.style.width = "100px";
+      const width = ref.current.offsetWidth; // Forces layout
+      ref.current.style.height = "200px";
+    }
+  }, [isHighlighted]);
+
+  return <div ref={ref}>Content</div>;
+}
+
+// Correct: toggle class
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  return <div className={isHighlighted ? "highlighted-box" : ""}>Content</div>;
+}
+```
+
+Prefer CSS classes over inline styles when possible. CSS files are cached by the browser, and classes provide better separation of concerns and are easier to maintain.
+
+See [this gist](https://gist.github.com/paulirish/5d52fb081b3570c81e3a) and [CSS Triggers](https://csstriggers.com/) for more information on layout-forcing operations.
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-cache-function-results.md b/.claude/skills/vercel-react-best-practices/rules/js-cache-function-results.md
new file mode 100644
index 000000000..91a6985be
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-cache-function-results.md
@@ -0,0 +1,80 @@
+---
+title: Cache Repeated Function Calls
+impact: MEDIUM
+impactDescription: avoid redundant computation
+tags: javascript, cache, memoization, performance
+---
+
+## Cache Repeated Function Calls
+
+Use a module-level Map to cache function results when the same function is called repeatedly with the same inputs during render.
+
+**Incorrect (redundant computation):**
+
+```typescript
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // slugify() called 100+ times for same project names
+        const slug = slugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Correct (cached results):**
+
+```typescript
+// Module-level cache
+const slugifyCache = new Map<string, string>()
+
+function cachedSlugify(text: string): string {
+  if (slugifyCache.has(text)) {
+    return slugifyCache.get(text)!
+  }
+  const result = slugify(text)
+  slugifyCache.set(text, result)
+  return result
+}
+
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // Computed only once per unique project name
+        const slug = cachedSlugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Simpler pattern for single-value functions:**
+
+```typescript
+let isLoggedInCache: boolean | null = null;
+
+function isLoggedIn(): boolean {
+  if (isLoggedInCache !== null) {
+    return isLoggedInCache;
+  }
+
+  isLoggedInCache = document.cookie.includes("auth=");
+  return isLoggedInCache;
+}
+
+// Clear cache when auth changes
+function onAuthChange() {
+  isLoggedInCache = null;
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+Reference: [How we made the Vercel Dashboard twice as fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-cache-property-access.md b/.claude/skills/vercel-react-best-practices/rules/js-cache-property-access.md
new file mode 100644
index 000000000..291f109b0
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-cache-property-access.md
@@ -0,0 +1,28 @@
+---
+title: Cache Property Access in Loops
+impact: LOW-MEDIUM
+impactDescription: reduces lookups
+tags: javascript, loops, optimization, caching
+---
+
+## Cache Property Access in Loops
+
+Cache object property lookups in hot paths.
+
+**Incorrect (3 lookups × N iterations):**
+
+```typescript
+for (let i = 0; i < arr.length; i++) {
+  process(obj.config.settings.value);
+}
+```
+
+**Correct (1 lookup total):**
+
+```typescript
+const value = obj.config.settings.value;
+const len = arr.length;
+for (let i = 0; i < len; i++) {
+  process(value);
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-cache-storage.md b/.claude/skills/vercel-react-best-practices/rules/js-cache-storage.md
new file mode 100644
index 000000000..363becba1
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-cache-storage.md
@@ -0,0 +1,70 @@
+---
+title: Cache Storage API Calls
+impact: LOW-MEDIUM
+impactDescription: reduces expensive I/O
+tags: javascript, localStorage, storage, caching, performance
+---
+
+## Cache Storage API Calls
+
+`localStorage`, `sessionStorage`, and `document.cookie` are synchronous and expensive. Cache reads in memory.
+
+**Incorrect (reads storage on every call):**
+
+```typescript
+function getTheme() {
+  return localStorage.getItem("theme") ?? "light";
+}
+// Called 10 times = 10 storage reads
+```
+
+**Correct (Map cache):**
+
+```typescript
+const storageCache = new Map<string, string | null>();
+
+function getLocalStorage(key: string) {
+  if (!storageCache.has(key)) {
+    storageCache.set(key, localStorage.getItem(key));
+  }
+  return storageCache.get(key);
+}
+
+function setLocalStorage(key: string, value: string) {
+  localStorage.setItem(key, value);
+  storageCache.set(key, value); // keep cache in sync
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+**Cookie caching:**
+
+```typescript
+let cookieCache: Record<string, string> | null = null;
+
+function getCookie(name: string) {
+  if (!cookieCache) {
+    cookieCache = Object.fromEntries(
+      document.cookie.split("; ").map((c) => c.split("=")),
+    );
+  }
+  return cookieCache[name];
+}
+```
+
+**Important (invalidate on external changes):**
+
+If storage can change externally (another tab, server-set cookies), invalidate cache:
+
+```typescript
+window.addEventListener("storage", (e) => {
+  if (e.key) storageCache.delete(e.key);
+});
+
+document.addEventListener("visibilitychange", () => {
+  if (document.visibilityState === "visible") {
+    storageCache.clear();
+  }
+});
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-combine-iterations.md b/.claude/skills/vercel-react-best-practices/rules/js-combine-iterations.md
new file mode 100644
index 000000000..f1e2518b7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-combine-iterations.md
@@ -0,0 +1,32 @@
+---
+title: Combine Multiple Array Iterations
+impact: LOW-MEDIUM
+impactDescription: reduces iterations
+tags: javascript, arrays, loops, performance
+---
+
+## Combine Multiple Array Iterations
+
+Multiple `.filter()` or `.map()` calls iterate the array multiple times. Combine into one loop.
+
+**Incorrect (3 iterations):**
+
+```typescript
+const admins = users.filter((u) => u.isAdmin);
+const testers = users.filter((u) => u.isTester);
+const inactive = users.filter((u) => !u.isActive);
+```
+
+**Correct (1 iteration):**
+
+```typescript
+const admins: User[] = [];
+const testers: User[] = [];
+const inactive: User[] = [];
+
+for (const user of users) {
+  if (user.isAdmin) admins.push(user);
+  if (user.isTester) testers.push(user);
+  if (!user.isActive) inactive.push(user);
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-early-exit.md b/.claude/skills/vercel-react-best-practices/rules/js-early-exit.md
new file mode 100644
index 000000000..992181ac1
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-early-exit.md
@@ -0,0 +1,50 @@
+---
+title: Early Return from Functions
+impact: LOW-MEDIUM
+impactDescription: avoids unnecessary computation
+tags: javascript, functions, optimization, early-return
+---
+
+## Early Return from Functions
+
+Return early when result is determined to skip unnecessary processing.
+
+**Incorrect (processes all items even after finding answer):**
+
+```typescript
+function validateUsers(users: User[]) {
+  let hasError = false;
+  let errorMessage = "";
+
+  for (const user of users) {
+    if (!user.email) {
+      hasError = true;
+      errorMessage = "Email required";
+    }
+    if (!user.name) {
+      hasError = true;
+      errorMessage = "Name required";
+    }
+    // Continues checking all users even after error found
+  }
+
+  return hasError ? { valid: false, error: errorMessage } : { valid: true };
+}
+```
+
+**Correct (returns immediately on first error):**
+
+```typescript
+function validateUsers(users: User[]) {
+  for (const user of users) {
+    if (!user.email) {
+      return { valid: false, error: "Email required" };
+    }
+    if (!user.name) {
+      return { valid: false, error: "Name required" };
+    }
+  }
+
+  return { valid: true };
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-hoist-regexp.md b/.claude/skills/vercel-react-best-practices/rules/js-hoist-regexp.md
new file mode 100644
index 000000000..2d2256d3d
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-hoist-regexp.md
@@ -0,0 +1,45 @@
+---
+title: Hoist RegExp Creation
+impact: LOW-MEDIUM
+impactDescription: avoids recreation
+tags: javascript, regexp, optimization, memoization
+---
+
+## Hoist RegExp Creation
+
+Don't create RegExp inside render. Hoist to module scope or memoize with `useMemo()`.
+
+**Incorrect (new RegExp every render):**
+
+```tsx
+function Highlighter({ text, query }: Props) {
+  const regex = new RegExp(`(${query})`, 'gi')
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Correct (memoize or hoist):**
+
+```tsx
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+
+function Highlighter({ text, query }: Props) {
+  const regex = useMemo(
+    () => new RegExp(`(${escapeRegex(query)})`, 'gi'),
+    [query]
+  )
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Warning (global regex has mutable state):**
+
+Global regex (`/g`) has mutable `lastIndex` state:
+
+```typescript
+const regex = /foo/g;
+regex.test("foo"); // true, lastIndex = 3
+regex.test("foo"); // false, lastIndex = 0
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-index-maps.md b/.claude/skills/vercel-react-best-practices/rules/js-index-maps.md
new file mode 100644
index 000000000..1fbaeda70
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-index-maps.md
@@ -0,0 +1,37 @@
+---
+title: Build Index Maps for Repeated Lookups
+impact: LOW-MEDIUM
+impactDescription: 1M ops to 2K ops
+tags: javascript, map, indexing, optimization, performance
+---
+
+## Build Index Maps for Repeated Lookups
+
+Multiple `.find()` calls by the same key should use a Map.
+
+**Incorrect (O(n) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  return orders.map((order) => ({
+    ...order,
+    user: users.find((u) => u.id === order.userId),
+  }));
+}
+```
+
+**Correct (O(1) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  const userById = new Map(users.map((u) => [u.id, u]));
+
+  return orders.map((order) => ({
+    ...order,
+    user: userById.get(order.userId),
+  }));
+}
+```
+
+Build map once (O(n)), then all lookups are O(1).
+For 1000 orders × 1000 users: 1M ops → 2K ops.
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-length-check-first.md b/.claude/skills/vercel-react-best-practices/rules/js-length-check-first.md
new file mode 100644
index 000000000..8bb79734d
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-length-check-first.md
@@ -0,0 +1,50 @@
+---
+title: Early Length Check for Array Comparisons
+impact: MEDIUM-HIGH
+impactDescription: avoids expensive operations when lengths differ
+tags: javascript, arrays, performance, optimization, comparison
+---
+
+## Early Length Check for Array Comparisons
+
+When comparing arrays with expensive operations (sorting, deep equality, serialization), check lengths first. If lengths differ, the arrays cannot be equal.
+
+In real-world applications, this optimization is especially valuable when the comparison runs in hot paths (event handlers, render loops).
+
+**Incorrect (always runs expensive comparison):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Always sorts and joins, even when lengths differ
+  return current.sort().join() !== original.sort().join();
+}
+```
+
+Two O(n log n) sorts run even when `current.length` is 5 and `original.length` is 100. There is also overhead of joining the arrays and comparing the strings.
+
+**Correct (O(1) length check first):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Early return if lengths differ
+  if (current.length !== original.length) {
+    return true;
+  }
+  // Only sort when lengths match
+  const currentSorted = current.toSorted();
+  const originalSorted = original.toSorted();
+  for (let i = 0; i < currentSorted.length; i++) {
+    if (currentSorted[i] !== originalSorted[i]) {
+      return true;
+    }
+  }
+  return false;
+}
+```
+
+This new approach is more efficient because:
+
+- It avoids the overhead of sorting and joining the arrays when lengths differ
+- It avoids consuming memory for the joined strings (especially important for large arrays)
+- It avoids mutating the original arrays
+- It returns early when a difference is found
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-min-max-loop.md b/.claude/skills/vercel-react-best-practices/rules/js-min-max-loop.md
new file mode 100644
index 000000000..a83a760b7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-min-max-loop.md
@@ -0,0 +1,82 @@
+---
+title: Use Loop for Min/Max Instead of Sort
+impact: LOW
+impactDescription: O(n) instead of O(n log n)
+tags: javascript, arrays, performance, sorting, algorithms
+---
+
+## Use Loop for Min/Max Instead of Sort
+
+Finding the smallest or largest element only requires a single pass through the array. Sorting is wasteful and slower.
+
+**Incorrect (O(n log n) - sort to find latest):**
+
+```typescript
+interface Project {
+  id: string;
+  name: string;
+  updatedAt: number;
+}
+
+function getLatestProject(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => b.updatedAt - a.updatedAt);
+  return sorted[0];
+}
+```
+
+Sorts the entire array just to find the maximum value.
+
+**Incorrect (O(n log n) - sort for oldest and newest):**
+
+```typescript
+function getOldestAndNewest(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => a.updatedAt - b.updatedAt);
+  return { oldest: sorted[0], newest: sorted[sorted.length - 1] };
+}
+```
+
+Still sorts unnecessarily when only min/max are needed.
+
+**Correct (O(n) - single loop):**
+
+```typescript
+function getLatestProject(projects: Project[]) {
+  if (projects.length === 0) return null;
+
+  let latest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt > latest.updatedAt) {
+      latest = projects[i];
+    }
+  }
+
+  return latest;
+}
+
+function getOldestAndNewest(projects: Project[]) {
+  if (projects.length === 0) return { oldest: null, newest: null };
+
+  let oldest = projects[0];
+  let newest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt < oldest.updatedAt) oldest = projects[i];
+    if (projects[i].updatedAt > newest.updatedAt) newest = projects[i];
+  }
+
+  return { oldest, newest };
+}
+```
+
+Single pass through the array, no copying, no sorting.
+
+**Alternative (Math.min/Math.max for small arrays):**
+
+```typescript
+const numbers = [5, 2, 8, 1, 9];
+const min = Math.min(...numbers);
+const max = Math.max(...numbers);
+```
+
+This works for small arrays, but can be slower or just throw an error for very large arrays due to spread operator limitations. Maximal array length is approximately 124000 in Chrome 143 and 638000 in Safari 18; exact numbers may vary - see [the fiddle](https://jsfiddle.net/qw1jabsx/4/). Use the loop approach for reliability.
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-set-map-lookups.md b/.claude/skills/vercel-react-best-practices/rules/js-set-map-lookups.md
new file mode 100644
index 000000000..680a4892e
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-set-map-lookups.md
@@ -0,0 +1,24 @@
+---
+title: Use Set/Map for O(1) Lookups
+impact: LOW-MEDIUM
+impactDescription: O(n) to O(1)
+tags: javascript, set, map, data-structures, performance
+---
+
+## Use Set/Map for O(1) Lookups
+
+Convert arrays to Set/Map for repeated membership checks.
+
+**Incorrect (O(n) per check):**
+
+```typescript
+const allowedIds = ['a', 'b', 'c', ...]
+items.filter(item => allowedIds.includes(item.id))
+```
+
+**Correct (O(1) per check):**
+
+```typescript
+const allowedIds = new Set(['a', 'b', 'c', ...])
+items.filter(item => allowedIds.has(item.id))
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md b/.claude/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md
new file mode 100644
index 000000000..e6d5df3af
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md
@@ -0,0 +1,57 @@
+---
+title: Use toSorted() Instead of sort() for Immutability
+impact: MEDIUM-HIGH
+impactDescription: prevents mutation bugs in React state
+tags: javascript, arrays, immutability, react, state, mutation
+---
+
+## Use toSorted() Instead of sort() for Immutability
+
+`.sort()` mutates the array in place, which can cause bugs with React state and props. Use `.toSorted()` to create a new sorted array without mutation.
+
+**Incorrect (mutates original array):**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Mutates the users prop array!
+  const sorted = useMemo(
+    () => users.sort((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Correct (creates new array):**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Creates new sorted array, original unchanged
+  const sorted = useMemo(
+    () => users.toSorted((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Why this matters in React:**
+
+1. Props/state mutations break React's immutability model - React expects props and state to be treated as read-only
+2. Causes stale closure bugs - Mutating arrays inside closures (callbacks, effects) can lead to unexpected behavior
+
+**Browser support (fallback for older browsers):**
+
+`.toSorted()` is available in all modern browsers (Chrome 110+, Safari 16+, Firefox 115+, Node.js 20+). For older environments, use spread operator:
+
+```typescript
+// Fallback for older browsers
+const sorted = [...items].sort((a, b) => a.value - b.value);
+```
+
+**Other immutable array methods:**
+
+- `.toSorted()` - immutable sort
+- `.toReversed()` - immutable reverse
+- `.toSpliced()` - immutable splice
+- `.with()` - immutable element replacement
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-activity.md b/.claude/skills/vercel-react-best-practices/rules/rendering-activity.md
new file mode 100644
index 000000000..a7d84cdd1
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-activity.md
@@ -0,0 +1,26 @@
+---
+title: Use Activity Component for Show/Hide
+impact: MEDIUM
+impactDescription: preserves state/DOM
+tags: rendering, activity, visibility, state-preservation
+---
+
+## Use Activity Component for Show/Hide
+
+Use React's `<Activity>` to preserve state/DOM for expensive components that frequently toggle visibility.
+
+**Usage:**
+
+```tsx
+import { Activity } from "react";
+
+function Dropdown({ isOpen }: Props) {
+  return (
+    <Activity mode={isOpen ? "visible" : "hidden"}>
+      <ExpensiveMenu />
+    </Activity>
+  );
+}
+```
+
+Avoids expensive re-renders and state loss.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md b/.claude/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md
new file mode 100644
index 000000000..370730271
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md
@@ -0,0 +1,38 @@
+---
+title: Animate SVG Wrapper Instead of SVG Element
+impact: LOW
+impactDescription: enables hardware acceleration
+tags: rendering, svg, css, animation, performance
+---
+
+## Animate SVG Wrapper Instead of SVG Element
+
+Many browsers don't have hardware acceleration for CSS3 animations on SVG elements. Wrap SVG in a `<div>` and animate the wrapper instead.
+
+**Incorrect (animating SVG directly - no hardware acceleration):**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <svg className="animate-spin" width="24" height="24" viewBox="0 0 24 24">
+      <circle cx="12" cy="12" r="10" stroke="currentColor" />
+    </svg>
+  );
+}
+```
+
+**Correct (animating wrapper div - hardware accelerated):**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <div className="animate-spin">
+      <svg width="24" height="24" viewBox="0 0 24 24">
+        <circle cx="12" cy="12" r="10" stroke="currentColor" />
+      </svg>
+    </div>
+  );
+}
+```
+
+This applies to all CSS transforms and transitions (`transform`, `opacity`, `translate`, `scale`, `rotate`). The wrapper div allows browsers to use GPU acceleration for smoother animations.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-conditional-render.md b/.claude/skills/vercel-react-best-practices/rules/rendering-conditional-render.md
new file mode 100644
index 000000000..bbafa1427
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-conditional-render.md
@@ -0,0 +1,32 @@
+---
+title: Use Explicit Conditional Rendering
+impact: LOW
+impactDescription: prevents rendering 0 or NaN
+tags: rendering, conditional, jsx, falsy-values
+---
+
+## Use Explicit Conditional Rendering
+
+Use explicit ternary operators (`? :`) instead of `&&` for conditional rendering when the condition can be `0`, `NaN`, or other falsy values that render.
+
+**Incorrect (renders "0" when count is 0):**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count && <span className="badge">{count}</span>}</div>;
+}
+
+// When count = 0, renders: <div>0</div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+**Correct (renders nothing when count is 0):**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count > 0 ? <span className="badge">{count}</span> : null}</div>;
+}
+
+// When count = 0, renders: <div></div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-content-visibility.md b/.claude/skills/vercel-react-best-practices/rules/rendering-content-visibility.md
new file mode 100644
index 000000000..1aebfab58
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-content-visibility.md
@@ -0,0 +1,38 @@
+---
+title: CSS content-visibility for Long Lists
+impact: HIGH
+impactDescription: faster initial render
+tags: rendering, css, content-visibility, long-lists
+---
+
+## CSS content-visibility for Long Lists
+
+Apply `content-visibility: auto` to defer off-screen rendering.
+
+**CSS:**
+
+```css
+.message-item {
+  content-visibility: auto;
+  contain-intrinsic-size: 0 80px;
+}
+```
+
+**Example:**
+
+```tsx
+function MessageList({ messages }: { messages: Message[] }) {
+  return (
+    <div className="h-screen overflow-y-auto">
+      {messages.map((msg) => (
+        <div key={msg.id} className="message-item">
+          <Avatar user={msg.author} />
+          <div>{msg.content}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+```
+
+For 1000 messages, browser skips layout/paint for ~990 off-screen items (10× faster initial render).
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md b/.claude/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md
new file mode 100644
index 000000000..fea1751ae
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md
@@ -0,0 +1,36 @@
+---
+title: Hoist Static JSX Elements
+impact: LOW
+impactDescription: avoids re-creation
+tags: rendering, jsx, static, optimization
+---
+
+## Hoist Static JSX Elements
+
+Extract static JSX outside components to avoid re-creation.
+
+**Incorrect (recreates element every render):**
+
+```tsx
+function LoadingSkeleton() {
+  return <div className="h-20 animate-pulse bg-gray-200" />;
+}
+
+function Container() {
+  return <div>{loading && <LoadingSkeleton />}</div>;
+}
+```
+
+**Correct (reuses same element):**
+
+```tsx
+const loadingSkeleton = <div className="h-20 animate-pulse bg-gray-200" />;
+
+function Container() {
+  return <div>{loading && loadingSkeleton}</div>;
+}
+```
+
+This is especially helpful for large and static SVG nodes, which can be expensive to recreate on every render.
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler automatically hoists static JSX elements and optimizes component re-renders, making manual hoisting unnecessary.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md b/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md
new file mode 100644
index 000000000..971c5cc99
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md
@@ -0,0 +1,72 @@
+---
+title: Prevent Hydration Mismatch Without Flickering
+impact: MEDIUM
+impactDescription: avoids visual flicker and hydration errors
+tags: rendering, ssr, hydration, localStorage, flicker
+---
+
+## Prevent Hydration Mismatch Without Flickering
+
+When rendering content that depends on client-side storage (localStorage, cookies), avoid both SSR breakage and post-hydration flickering by injecting a synchronous script that updates the DOM before React hydrates.
+
+**Incorrect (breaks SSR):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  // localStorage is not available on server - throws error
+  const theme = localStorage.getItem("theme") || "light";
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Server-side rendering will fail because `localStorage` is undefined.
+
+**Incorrect (visual flickering):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  const [theme, setTheme] = useState("light");
+
+  useEffect(() => {
+    // Runs after hydration - causes visible flash
+    const stored = localStorage.getItem("theme");
+    if (stored) {
+      setTheme(stored);
+    }
+  }, []);
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Component first renders with default value (`light`), then updates after hydration, causing a visible flash of incorrect content.
+
+**Correct (no flicker, no hydration mismatch):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  return (
+    <>
+      <div id="theme-wrapper">{children}</div>
+      <script
+        dangerouslySetInnerHTML={{
+          __html: `
+            (function() {
+              try {
+                var theme = localStorage.getItem('theme') || 'light';
+                var el = document.getElementById('theme-wrapper');
+                if (el) el.className = theme;
+              } catch (e) {}
+            })();
+          `,
+        }}
+      />
+    </>
+  );
+}
+```
+
+The inline script executes synchronously before showing the element, ensuring the DOM already has the correct value. No flickering, no hydration mismatch.
+
+This pattern is especially useful for theme toggles, user preferences, authentication states, and any client-only data that should render immediately without flashing default values.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md b/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md
new file mode 100644
index 000000000..86c1a33ea
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md
@@ -0,0 +1,26 @@
+---
+title: Suppress Expected Hydration Mismatches
+impact: LOW-MEDIUM
+impactDescription: avoids noisy hydration warnings for known differences
+tags: rendering, hydration, ssr, nextjs
+---
+
+## Suppress Expected Hydration Mismatches
+
+In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these _expected_ mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
+
+**Incorrect (known mismatch warnings):**
+
+```tsx
+function Timestamp() {
+  return <span>{new Date().toLocaleString()}</span>;
+}
+```
+
+**Correct (suppress expected mismatch only):**
+
+```tsx
+function Timestamp() {
+  return <span suppressHydrationWarning>{new Date().toLocaleString()}</span>;
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-svg-precision.md b/.claude/skills/vercel-react-best-practices/rules/rendering-svg-precision.md
new file mode 100644
index 000000000..6d7712860
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-svg-precision.md
@@ -0,0 +1,28 @@
+---
+title: Optimize SVG Precision
+impact: LOW
+impactDescription: reduces file size
+tags: rendering, svg, optimization, svgo
+---
+
+## Optimize SVG Precision
+
+Reduce SVG coordinate precision to decrease file size. The optimal precision depends on the viewBox size, but in general reducing precision should be considered.
+
+**Incorrect (excessive precision):**
+
+```svg
+<path d="M 10.293847 20.847362 L 30.938472 40.192837" />
+```
+
+**Correct (1 decimal place):**
+
+```svg
+<path d="M 10.3 20.8 L 30.9 40.2" />
+```
+
+**Automate with SVGO:**
+
+```bash
+npx svgo --precision=1 --multipass icon.svg
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md b/.claude/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md
new file mode 100644
index 000000000..bf9f1e851
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md
@@ -0,0 +1,75 @@
+---
+title: Use useTransition Over Manual Loading States
+impact: LOW
+impactDescription: reduces re-renders and improves code clarity
+tags: rendering, transitions, useTransition, loading, state
+---
+
+## Use useTransition Over Manual Loading States
+
+Use `useTransition` instead of manual `useState` for loading states. This provides built-in `isPending` state and automatically manages transitions.
+
+**Incorrect (manual loading state):**
+
+```tsx
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleSearch = async (value: string) => {
+    setIsLoading(true);
+    setQuery(value);
+    const data = await fetchResults(value);
+    setResults(data);
+    setIsLoading(false);
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isLoading && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Correct (useTransition with built-in pending state):**
+
+```tsx
+import { useTransition, useState } from "react";
+
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isPending, startTransition] = useTransition();
+
+  const handleSearch = (value: string) => {
+    setQuery(value); // Update input immediately
+
+    startTransition(async () => {
+      // Fetch and update results
+      const data = await fetchResults(value);
+      setResults(data);
+    });
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isPending && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Benefits:**
+
+- **Automatic pending state**: No need to manually manage `setIsLoading(true/false)`
+- **Error resilience**: Pending state correctly resets even if the transition throws
+- **Better responsiveness**: Keeps the UI responsive during updates
+- **Interrupt handling**: New transitions automatically cancel pending ones
+
+Reference: [useTransition](https://react.dev/reference/react/useTransition)
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-defer-reads.md b/.claude/skills/vercel-react-best-practices/rules/rerender-defer-reads.md
new file mode 100644
index 000000000..bd4919402
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-defer-reads.md
@@ -0,0 +1,39 @@
+---
+title: Defer State Reads to Usage Point
+impact: MEDIUM
+impactDescription: avoids unnecessary subscriptions
+tags: rerender, searchParams, localStorage, optimization
+---
+
+## Defer State Reads to Usage Point
+
+Don't subscribe to dynamic state (searchParams, localStorage) if you only read it inside callbacks.
+
+**Incorrect (subscribes to all searchParams changes):**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const searchParams = useSearchParams();
+
+  const handleShare = () => {
+    const ref = searchParams.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+**Correct (reads on demand, no subscription):**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const handleShare = () => {
+    const params = new URLSearchParams(window.location.search);
+    const ref = params.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-dependencies.md b/.claude/skills/vercel-react-best-practices/rules/rerender-dependencies.md
new file mode 100644
index 000000000..bd7795edf
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-dependencies.md
@@ -0,0 +1,45 @@
+---
+title: Narrow Effect Dependencies
+impact: LOW
+impactDescription: minimizes effect re-runs
+tags: rerender, useEffect, dependencies, optimization
+---
+
+## Narrow Effect Dependencies
+
+Specify primitive dependencies instead of objects to minimize effect re-runs.
+
+**Incorrect (re-runs on any user field change):**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user]);
+```
+
+**Correct (re-runs only when id changes):**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user.id]);
+```
+
+**For derived state, compute outside effect:**
+
+```tsx
+// Incorrect: runs on width=767, 766, 765...
+useEffect(() => {
+  if (width < 768) {
+    enableMobileMode();
+  }
+}, [width]);
+
+// Correct: runs only on boolean transition
+const isMobile = width < 768;
+useEffect(() => {
+  if (isMobile) {
+    enableMobileMode();
+  }
+}, [isMobile]);
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md b/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md
new file mode 100644
index 000000000..b1514c987
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md
@@ -0,0 +1,40 @@
+---
+title: Calculate Derived State During Rendering
+impact: MEDIUM
+impactDescription: avoids redundant renders and state drift
+tags: rerender, derived-state, useEffect, state
+---
+
+## Calculate Derived State During Rendering
+
+If a value can be computed from current props/state, do not store it in state or update it in an effect. Derive it during render to avoid extra renders and state drift. Do not set state in effects solely in response to prop changes; prefer derived values or keyed resets instead.
+
+**Incorrect (redundant state and effect):**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const [fullName, setFullName] = useState("");
+
+  useEffect(() => {
+    setFullName(firstName + " " + lastName);
+  }, [firstName, lastName]);
+
+  return <p>{fullName}</p>;
+}
+```
+
+**Correct (derive during render):**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const fullName = firstName + " " + lastName;
+
+  return <p>{fullName}</p>;
+}
+```
+
+References: [You Might Not Need an Effect](https://react.dev/learn/you-might-not-need-an-effect)
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state.md b/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state.md
new file mode 100644
index 000000000..08ab84a80
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-derived-state.md
@@ -0,0 +1,29 @@
+---
+title: Subscribe to Derived State
+impact: MEDIUM
+impactDescription: reduces re-render frequency
+tags: rerender, derived-state, media-query, optimization
+---
+
+## Subscribe to Derived State
+
+Subscribe to derived boolean state instead of continuous values to reduce re-render frequency.
+
+**Incorrect (re-renders on every pixel change):**
+
+```tsx
+function Sidebar() {
+  const width = useWindowWidth(); // updates continuously
+  const isMobile = width < 768;
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+**Correct (re-renders only when boolean changes):**
+
+```tsx
+function Sidebar() {
+  const isMobile = useMediaQuery("(max-width: 767px)");
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md b/.claude/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md
new file mode 100644
index 000000000..fe55b02cf
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md
@@ -0,0 +1,77 @@
+---
+title: Use Functional setState Updates
+impact: MEDIUM
+impactDescription: prevents stale closures and unnecessary callback recreations
+tags: react, hooks, useState, useCallback, callbacks, closures
+---
+
+## Use Functional setState Updates
+
+When updating state based on the current state value, use the functional update form of setState instead of directly referencing the state variable. This prevents stale closures, eliminates unnecessary dependencies, and creates stable callback references.
+
+**Incorrect (requires state as dependency):**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Callback must depend on items, recreated on every items change
+  const addItems = useCallback(
+    (newItems: Item[]) => {
+      setItems([...items, ...newItems]);
+    },
+    [items],
+  ); // ❌ items dependency causes recreations
+
+  // Risk of stale closure if dependency is forgotten
+  const removeItem = useCallback((id: string) => {
+    setItems(items.filter((item) => item.id !== id));
+  }, []); // ❌ Missing items dependency - will use stale items!
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+The first callback is recreated every time `items` changes, which can cause child components to re-render unnecessarily. The second callback has a stale closure bug—it will always reference the initial `items` value.
+
+**Correct (stable callbacks, no stale closures):**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Stable callback, never recreated
+  const addItems = useCallback((newItems: Item[]) => {
+    setItems((curr) => [...curr, ...newItems]);
+  }, []); // ✅ No dependencies needed
+
+  // Always uses latest state, no stale closure risk
+  const removeItem = useCallback((id: string) => {
+    setItems((curr) => curr.filter((item) => item.id !== id));
+  }, []); // ✅ Safe and stable
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+**Benefits:**
+
+1. **Stable callback references** - Callbacks don't need to be recreated when state changes
+2. **No stale closures** - Always operates on the latest state value
+3. **Fewer dependencies** - Simplifies dependency arrays and reduces memory leaks
+4. **Prevents bugs** - Eliminates the most common source of React closure bugs
+
+**When to use functional updates:**
+
+- Any setState that depends on the current state value
+- Inside useCallback/useMemo when state is needed
+- Event handlers that reference state
+- Async operations that update state
+
+**When direct updates are fine:**
+
+- Setting state to a static value: `setCount(0)`
+- Setting state from props/arguments only: `setName(newName)`
+- State doesn't depend on previous value
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler can automatically optimize some cases, but functional updates are still recommended for correctness and to prevent stale closure bugs.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md b/.claude/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md
new file mode 100644
index 000000000..4ead79f11
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md
@@ -0,0 +1,58 @@
+---
+title: Use Lazy State Initialization
+impact: MEDIUM
+impactDescription: wasted computation on every render
+tags: react, hooks, useState, performance, initialization
+---
+
+## Use Lazy State Initialization
+
+Pass a function to `useState` for expensive initial values. Without the function form, the initializer runs on every render even though the value is only used once.
+
+**Incorrect (runs on every render):**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs on EVERY render, even after initialization
+  const [searchIndex, setSearchIndex] = useState(buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  // When query changes, buildSearchIndex runs again unnecessarily
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs on every render
+  const [settings, setSettings] = useState(
+    JSON.parse(localStorage.getItem("settings") || "{}"),
+  );
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+**Correct (runs only once):**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs ONLY on initial render
+  const [searchIndex, setSearchIndex] = useState(() => buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs only on initial render
+  const [settings, setSettings] = useState(() => {
+    const stored = localStorage.getItem("settings");
+    return stored ? JSON.parse(stored) : {};
+  });
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+Use lazy initialization when computing initial values from localStorage/sessionStorage, building data structures (indexes, maps), reading from the DOM, or performing heavy transformations.
+
+For simple primitives (`useState(0)`), direct references (`useState(props.value)`), or cheap literals (`useState({})`), the function form is unnecessary.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md b/.claude/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md
new file mode 100644
index 000000000..c250ebaa7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md
@@ -0,0 +1,36 @@
+---
+title: Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+impact: MEDIUM
+impactDescription: restores memoization by using a constant for default value
+tags: rerender, memo, optimization
+---
+
+## Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+
+When memoized component has a default value for some non-primitive optional parameter, such as an array, function, or object, calling the component without that parameter results in broken memoization. This is because new value instances are created on every rerender, and they do not pass strict equality comparison in `memo()`.
+
+To address this issue, extract the default value into a constant.
+
+**Incorrect (`onClick` has different values on every rerender):**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ onClick = () => {} }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+**Correct (stable default value):**
+
+```tsx
+const NOOP = () => {};
+
+const UserAvatar = memo(function UserAvatar({ onClick = NOOP }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-memo.md b/.claude/skills/vercel-react-best-practices/rules/rerender-memo.md
new file mode 100644
index 000000000..0de3aa3b9
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-memo.md
@@ -0,0 +1,44 @@
+---
+title: Extract to Memoized Components
+impact: MEDIUM
+impactDescription: enables early returns
+tags: rerender, memo, useMemo, optimization
+---
+
+## Extract to Memoized Components
+
+Extract expensive work into memoized components to enable early returns before computation.
+
+**Incorrect (computes avatar even when loading):**
+
+```tsx
+function Profile({ user, loading }: Props) {
+  const avatar = useMemo(() => {
+    const id = computeAvatarId(user);
+    return <Avatar id={id} />;
+  }, [user]);
+
+  if (loading) return <Skeleton />;
+  return <div>{avatar}</div>;
+}
+```
+
+**Correct (skips computation when loading):**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ user }: { user: User }) {
+  const id = useMemo(() => computeAvatarId(user), [user]);
+  return <Avatar id={id} />;
+});
+
+function Profile({ user, loading }: Props) {
+  if (loading) return <Skeleton />;
+  return (
+    <div>
+      <UserAvatar user={user} />
+    </div>
+  );
+}
+```
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, manual memoization with `memo()` and `useMemo()` is not necessary. The compiler automatically optimizes re-renders.
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md b/.claude/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md
new file mode 100644
index 000000000..08c5aa966
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md
@@ -0,0 +1,45 @@
+---
+title: Put Interaction Logic in Event Handlers
+impact: MEDIUM
+impactDescription: avoids effect re-runs and duplicate side effects
+tags: rerender, useEffect, events, side-effects, dependencies
+---
+
+## Put Interaction Logic in Event Handlers
+
+If a side effect is triggered by a specific user action (submit, click, drag), run it in that event handler. Do not model the action as state + effect; it makes effects re-run on unrelated changes and can duplicate the action.
+
+**Incorrect (event modeled as state + effect):**
+
+```tsx
+function Form() {
+  const [submitted, setSubmitted] = useState(false);
+  const theme = useContext(ThemeContext);
+
+  useEffect(() => {
+    if (submitted) {
+      post("/api/register");
+      showToast("Registered", theme);
+    }
+  }, [submitted, theme]);
+
+  return <button onClick={() => setSubmitted(true)}>Submit</button>;
+}
+```
+
+**Correct (do it in the handler):**
+
+```tsx
+function Form() {
+  const theme = useContext(ThemeContext);
+
+  function handleSubmit() {
+    post("/api/register");
+    showToast("Registered", theme);
+  }
+
+  return <button onClick={handleSubmit}>Submit</button>;
+}
+```
+
+Reference: [Should this code move to an event handler?](https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler)
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md b/.claude/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md
new file mode 100644
index 000000000..9c49b6fe7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md
@@ -0,0 +1,35 @@
+---
+title: Do not wrap a simple expression with a primitive result type in useMemo
+impact: LOW-MEDIUM
+impactDescription: wasted computation on every render
+tags: rerender, useMemo, optimization
+---
+
+## Do not wrap a simple expression with a primitive result type in useMemo
+
+When an expression is simple (few logical or arithmetical operators) and has a primitive result type (boolean, number, string), do not wrap it in `useMemo`.
+Calling `useMemo` and comparing hook dependencies may consume more resources than the expression itself.
+
+**Incorrect:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = useMemo(() => {
+    return user.isLoading || notifications.isLoading;
+  }, [user.isLoading, notifications.isLoading]);
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+**Correct:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = user.isLoading || notifications.isLoading;
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-transitions.md b/.claude/skills/vercel-react-best-practices/rules/rerender-transitions.md
new file mode 100644
index 000000000..1d0bb4321
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-transitions.md
@@ -0,0 +1,40 @@
+---
+title: Use Transitions for Non-Urgent Updates
+impact: MEDIUM
+impactDescription: maintains UI responsiveness
+tags: rerender, transitions, startTransition, performance
+---
+
+## Use Transitions for Non-Urgent Updates
+
+Mark frequent, non-urgent state updates as transitions to maintain UI responsiveness.
+
+**Incorrect (blocks UI on every scroll):**
+
+```tsx
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => setScrollY(window.scrollY);
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+**Correct (non-blocking updates):**
+
+```tsx
+import { startTransition } from "react";
+
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => {
+      startTransition(() => setScrollY(window.scrollY));
+    };
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md b/.claude/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md
new file mode 100644
index 000000000..ee771fac0
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md
@@ -0,0 +1,73 @@
+---
+title: Use useRef for Transient Values
+impact: MEDIUM
+impactDescription: avoids unnecessary re-renders on frequent updates
+tags: rerender, useref, state, performance
+---
+
+## Use useRef for Transient Values
+
+When a value changes frequently and you don't want a re-render on every update (e.g., mouse trackers, intervals, transient flags), store it in `useRef` instead of `useState`. Keep component state for UI; use refs for temporary DOM-adjacent values. Updating a ref does not trigger a re-render.
+
+**Incorrect (renders every update):**
+
+```tsx
+function Tracker() {
+  const [lastX, setLastX] = useState(0);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => setLastX(e.clientX);
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      style={{
+        position: "fixed",
+        top: 0,
+        left: lastX,
+        width: 8,
+        height: 8,
+        background: "black",
+      }}
+    />
+  );
+}
+```
+
+**Correct (no re-render for tracking):**
+
+```tsx
+function Tracker() {
+  const lastXRef = useRef(0);
+  const dotRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => {
+      lastXRef.current = e.clientX;
+      const node = dotRef.current;
+      if (node) {
+        node.style.transform = `translateX(${e.clientX}px)`;
+      }
+    };
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      ref={dotRef}
+      style={{
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: 8,
+        height: 8,
+        background: "black",
+        transform: "translateX(0px)",
+      }}
+    />
+  );
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-after-nonblocking.md b/.claude/skills/vercel-react-best-practices/rules/server-after-nonblocking.md
new file mode 100644
index 000000000..7415fe181
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-after-nonblocking.md
@@ -0,0 +1,74 @@
+---
+title: Use after() for Non-Blocking Operations
+impact: MEDIUM
+impactDescription: faster response times
+tags: server, async, logging, analytics, side-effects
+---
+
+## Use after() for Non-Blocking Operations
+
+Use Next.js's `after()` to schedule work that should execute after a response is sent. This prevents logging, analytics, and other side effects from blocking the response.
+
+**Incorrect (blocks response):**
+
+```tsx
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Logging blocks the response
+  const userAgent = request.headers.get("user-agent") || "unknown";
+  await logUserAction({ userAgent });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+**Correct (non-blocking):**
+
+```tsx
+import { after } from "next/server";
+import { headers, cookies } from "next/headers";
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Log after response is sent
+  after(async () => {
+    const userAgent = (await headers()).get("user-agent") || "unknown";
+    const sessionCookie =
+      (await cookies()).get("session-id")?.value || "anonymous";
+
+    logUserAction({ sessionCookie, userAgent });
+  });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+The response is sent immediately while logging happens in the background.
+
+**Common use cases:**
+
+- Analytics tracking
+- Audit logging
+- Sending notifications
+- Cache invalidation
+- Cleanup tasks
+
+**Important notes:**
+
+- `after()` runs even if the response fails or redirects
+- Works in Server Actions, Route Handlers, and Server Components
+
+Reference: [https://nextjs.org/docs/app/api-reference/functions/after](https://nextjs.org/docs/app/api-reference/functions/after)
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-auth-actions.md b/.claude/skills/vercel-react-best-practices/rules/server-auth-actions.md
new file mode 100644
index 000000000..44ecf30f6
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-auth-actions.md
@@ -0,0 +1,96 @@
+---
+title: Authenticate Server Actions Like API Routes
+impact: CRITICAL
+impactDescription: prevents unauthorized access to server mutations
+tags: server, server-actions, authentication, security, authorization
+---
+
+## Authenticate Server Actions Like API Routes
+
+**Impact: CRITICAL (prevents unauthorized access to server mutations)**
+
+Server Actions (functions with `"use server"`) are exposed as public endpoints, just like API routes. Always verify authentication and authorization **inside** each Server Action—do not rely solely on middleware, layout guards, or page-level checks, as Server Actions can be invoked directly.
+
+Next.js documentation explicitly states: "Treat Server Actions with the same security considerations as public-facing API endpoints, and verify if the user is allowed to perform a mutation."
+
+**Incorrect (no authentication check):**
+
+```typescript
+"use server";
+
+export async function deleteUser(userId: string) {
+  // Anyone can call this! No auth check
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**Correct (authentication inside the action):**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { unauthorized } from "@/lib/errors";
+
+export async function deleteUser(userId: string) {
+  // Always check auth inside the action
+  const session = await verifySession();
+
+  if (!session) {
+    throw unauthorized("Must be logged in");
+  }
+
+  // Check authorization too
+  if (session.user.role !== "admin" && session.user.id !== userId) {
+    throw unauthorized("Cannot delete other users");
+  }
+
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**With input validation:**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { z } from "zod";
+
+const updateProfileSchema = z.object({
+  userId: z.string().uuid(),
+  name: z.string().min(1).max(100),
+  email: z.string().email(),
+});
+
+export async function updateProfile(data: unknown) {
+  // Validate input first
+  const validated = updateProfileSchema.parse(data);
+
+  // Then authenticate
+  const session = await verifySession();
+  if (!session) {
+    throw new Error("Unauthorized");
+  }
+
+  // Then authorize
+  if (session.user.id !== validated.userId) {
+    throw new Error("Can only update own profile");
+  }
+
+  // Finally perform the mutation
+  await db.user.update({
+    where: { id: validated.userId },
+    data: {
+      name: validated.name,
+      email: validated.email,
+    },
+  });
+
+  return { success: true };
+}
+```
+
+Reference: [https://nextjs.org/docs/app/guides/authentication](https://nextjs.org/docs/app/guides/authentication)
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-cache-lru.md b/.claude/skills/vercel-react-best-practices/rules/server-cache-lru.md
new file mode 100644
index 000000000..884630824
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-cache-lru.md
@@ -0,0 +1,41 @@
+---
+title: Cross-Request LRU Caching
+impact: HIGH
+impactDescription: caches across requests
+tags: server, cache, lru, cross-request
+---
+
+## Cross-Request LRU Caching
+
+`React.cache()` only works within one request. For data shared across sequential requests (user clicks button A then button B), use an LRU cache.
+
+**Implementation:**
+
+```typescript
+import { LRUCache } from "lru-cache";
+
+const cache = new LRUCache<string, any>({
+  max: 1000,
+  ttl: 5 * 60 * 1000, // 5 minutes
+});
+
+export async function getUser(id: string) {
+  const cached = cache.get(id);
+  if (cached) return cached;
+
+  const user = await db.user.findUnique({ where: { id } });
+  cache.set(id, user);
+  return user;
+}
+
+// Request 1: DB query, result cached
+// Request 2: cache hit, no DB query
+```
+
+Use when sequential user actions hit multiple endpoints needing the same data within seconds.
+
+**With Vercel's [Fluid Compute](https://vercel.com/docs/fluid-compute):** LRU caching is especially effective because multiple concurrent requests can share the same function instance and cache. This means the cache persists across requests without needing external storage like Redis.
+
+**In traditional serverless:** Each invocation runs in isolation, so consider Redis for cross-process caching.
+
+Reference: [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-cache-react.md b/.claude/skills/vercel-react-best-practices/rules/server-cache-react.md
new file mode 100644
index 000000000..0643ef7c7
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-cache-react.md
@@ -0,0 +1,76 @@
+---
+title: Per-Request Deduplication with React.cache()
+impact: MEDIUM
+impactDescription: deduplicates within request
+tags: server, cache, react-cache, deduplication
+---
+
+## Per-Request Deduplication with React.cache()
+
+Use `React.cache()` for server-side request deduplication. Authentication and database queries benefit most.
+
+**Usage:**
+
+```typescript
+import { cache } from "react";
+
+export const getCurrentUser = cache(async () => {
+  const session = await auth();
+  if (!session?.user?.id) return null;
+  return await db.user.findUnique({
+    where: { id: session.user.id },
+  });
+});
+```
+
+Within a single request, multiple calls to `getCurrentUser()` execute the query only once.
+
+**Avoid inline objects as arguments:**
+
+`React.cache()` uses shallow equality (`Object.is`) to determine cache hits. Inline objects create new references each call, preventing cache hits.
+
+**Incorrect (always cache miss):**
+
+```typescript
+const getUser = cache(async (params: { uid: number }) => {
+  return await db.user.findUnique({ where: { id: params.uid } });
+});
+
+// Each call creates new object, never hits cache
+getUser({ uid: 1 });
+getUser({ uid: 1 }); // Cache miss, runs query again
+```
+
+**Correct (cache hit):**
+
+```typescript
+const getUser = cache(async (uid: number) => {
+  return await db.user.findUnique({ where: { id: uid } });
+});
+
+// Primitive args use value equality
+getUser(1);
+getUser(1); // Cache hit, returns cached result
+```
+
+If you must pass objects, pass the same reference:
+
+```typescript
+const params = { uid: 1 };
+getUser(params); // Query runs
+getUser(params); // Cache hit (same reference)
+```
+
+**Next.js-Specific Note:**
+
+In Next.js, the `fetch` API is automatically extended with request memoization. Requests with the same URL and options are automatically deduplicated within a single request, so you don't need `React.cache()` for `fetch` calls. However, `React.cache()` is still essential for other async tasks:
+
+- Database queries (Prisma, Drizzle, etc.)
+- Heavy computations
+- Authentication checks
+- File system operations
+- Any non-fetch async work
+
+Use `React.cache()` to deduplicate these operations across your component tree.
+
+Reference: [React.cache documentation](https://react.dev/reference/react/cache)
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-dedup-props.md b/.claude/skills/vercel-react-best-practices/rules/server-dedup-props.md
new file mode 100644
index 000000000..677086968
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-dedup-props.md
@@ -0,0 +1,65 @@
+---
+title: Avoid Duplicate Serialization in RSC Props
+impact: LOW
+impactDescription: reduces network payload by avoiding duplicate serialization
+tags: server, rsc, serialization, props, client-components
+---
+
+## Avoid Duplicate Serialization in RSC Props
+
+**Impact: LOW (reduces network payload by avoiding duplicate serialization)**
+
+RSC→client serialization deduplicates by object reference, not value. Same reference = serialized once; new reference = serialized again. Do transformations (`.toSorted()`, `.filter()`, `.map()`) in client, not server.
+
+**Incorrect (duplicates array):**
+
+```tsx
+// RSC: sends 6 strings (2 arrays × 3 items)
+<ClientList usernames={usernames} usernamesOrdered={usernames.toSorted()} />
+```
+
+**Correct (sends 3 strings):**
+
+```tsx
+// RSC: send once
+<ClientList usernames={usernames} />;
+
+// Client: transform there
+("use client");
+const sorted = useMemo(() => [...usernames].sort(), [usernames]);
+```
+
+**Nested deduplication behavior:**
+
+Deduplication works recursively. Impact varies by data type:
+
+- `string[]`, `number[]`, `boolean[]`: **HIGH impact** - array + all primitives fully duplicated
+- `object[]`: **LOW impact** - array duplicated, but nested objects deduplicated by reference
+
+```tsx
+// string[] - duplicates everything
+usernames={['a','b']} sorted={usernames.toSorted()} // sends 4 strings
+
+// object[] - duplicates array structure only
+users={[{id:1},{id:2}]} sorted={users.toSorted()} // sends 2 arrays + 2 unique objects (not 4)
+```
+
+**Operations breaking deduplication (create new references):**
+
+- Arrays: `.toSorted()`, `.filter()`, `.map()`, `.slice()`, `[...arr]`
+- Objects: `{...obj}`, `Object.assign()`, `structuredClone()`, `JSON.parse(JSON.stringify())`
+
+**More examples:**
+
+```tsx
+// ❌ Bad
+<C users={users} active={users.filter(u => u.active)} />
+<C product={product} productName={product.name} />
+
+// ✅ Good
+<C users={users} />
+<C product={product} />
+// Do filtering/destructuring in client
+```
+
+**Exception:** Pass derived data when transformation is expensive or client doesn't need original.
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-parallel-fetching.md b/.claude/skills/vercel-react-best-practices/rules/server-parallel-fetching.md
new file mode 100644
index 000000000..8d78b54b2
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-parallel-fetching.md
@@ -0,0 +1,83 @@
+---
+title: Parallel Data Fetching with Component Composition
+impact: CRITICAL
+impactDescription: eliminates server-side waterfalls
+tags: server, rsc, parallel-fetching, composition
+---
+
+## Parallel Data Fetching with Component Composition
+
+React Server Components execute sequentially within a tree. Restructure with composition to parallelize data fetching.
+
+**Incorrect (Sidebar waits for Page's fetch to complete):**
+
+```tsx
+export default async function Page() {
+  const header = await fetchHeader();
+  return (
+    <div>
+      <div>{header}</div>
+      <Sidebar />
+    </div>
+  );
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+```
+
+**Correct (both fetch simultaneously):**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+export default function Page() {
+  return (
+    <div>
+      <Header />
+      <Sidebar />
+    </div>
+  );
+}
+```
+
+**Alternative with children prop:**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+function Layout({ children }: { children: ReactNode }) {
+  return (
+    <div>
+      <Header />
+      {children}
+    </div>
+  );
+}
+
+export default function Page() {
+  return (
+    <Layout>
+      <Sidebar />
+    </Layout>
+  );
+}
+```
diff --git a/.claude/skills/vercel-react-best-practices/rules/server-serialization.md b/.claude/skills/vercel-react-best-practices/rules/server-serialization.md
new file mode 100644
index 000000000..3fe071545
--- /dev/null
+++ b/.claude/skills/vercel-react-best-practices/rules/server-serialization.md
@@ -0,0 +1,38 @@
+---
+title: Minimize Serialization at RSC Boundaries
+impact: HIGH
+impactDescription: reduces data transfer size
+tags: server, rsc, serialization, props
+---
+
+## Minimize Serialization at RSC Boundaries
+
+The React Server/Client boundary serializes all object properties into strings and embeds them in the HTML response and subsequent RSC requests. This serialized data directly impacts page weight and load time, so **size matters a lot**. Only pass fields that the client actually uses.
+
+**Incorrect (serializes all 50 fields):**
+
+```tsx
+async function Page() {
+  const user = await fetchUser(); // 50 fields
+  return <Profile user={user} />;
+}
+
+("use client");
+function Profile({ user }: { user: User }) {
+  return <div>{user.name}</div>; // uses 1 field
+}
+```
+
+**Correct (serializes only 1 field):**
+
+```tsx
+async function Page() {
+  const user = await fetchUser();
+  return <Profile name={user.name} />;
+}
+
+("use client");
+function Profile({ name }: { name: string }) {
+  return <div>{name}</div>;
+}
+```
diff --git a/.cursor/mcp.json b/.cursor/mcp.json
deleted file mode 120000
index d5dbdcbe4..000000000
--- a/.cursor/mcp.json
+++ /dev/null
@@ -1 +0,0 @@
-../.agents/mcp.json
\ No newline at end of file
diff --git a/.cursor/rules/clickup/clickup.mdc b/.cursor/rules/clickup/clickup.mdc
deleted file mode 120000
index 72bd809ce..000000000
--- a/.cursor/rules/clickup/clickup.mdc
+++ /dev/null
@@ -1 +0,0 @@
-../../../.agents/rules/clickup/clickup.mdc
\ No newline at end of file
diff --git a/.cursor/skills/central-station b/.cursor/skills/central-station
deleted file mode 120000
index bfd02112d..000000000
--- a/.cursor/skills/central-station
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/central-station
\ No newline at end of file
diff --git a/.cursor/skills/database b/.cursor/skills/database
deleted file mode 120000
index c50cf14f5..000000000
--- a/.cursor/skills/database
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/database
\ No newline at end of file
diff --git a/.cursor/skills/deploy b/.cursor/skills/deploy
deleted file mode 120000
index 9714c3220..000000000
--- a/.cursor/skills/deploy
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/deploy
\ No newline at end of file
diff --git a/.cursor/skills/deployment b/.cursor/skills/deployment
deleted file mode 120000
index 7baf7cbf5..000000000
--- a/.cursor/skills/deployment
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/deployment
\ No newline at end of file
diff --git a/.cursor/skills/domain b/.cursor/skills/domain
deleted file mode 120000
index 200d1eb58..000000000
--- a/.cursor/skills/domain
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/domain
\ No newline at end of file
diff --git a/.cursor/skills/environment b/.cursor/skills/environment
deleted file mode 120000
index d57c0762e..000000000
--- a/.cursor/skills/environment
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/environment
\ No newline at end of file
diff --git a/.cursor/skills/metrics b/.cursor/skills/metrics
deleted file mode 120000
index 40c171f4a..000000000
--- a/.cursor/skills/metrics
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/metrics
\ No newline at end of file
diff --git a/.cursor/skills/new b/.cursor/skills/new
deleted file mode 120000
index 20a10b8bf..000000000
--- a/.cursor/skills/new
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/new
\ No newline at end of file
diff --git a/.cursor/skills/next-best-practices/SKILL.md b/.cursor/skills/next-best-practices/SKILL.md
new file mode 100644
index 000000000..3d5e68693
--- /dev/null
+++ b/.cursor/skills/next-best-practices/SKILL.md
@@ -0,0 +1,171 @@
+---
+name: next-best-practices
+description: Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization, bundling
+user-invocable: false
+---
+
+# Next.js Best Practices
+
+Apply these rules when writing or reviewing Next.js code.
+
+## File Conventions
+
+See [file-conventions.md](./file-conventions.md) for:
+
+- Project structure and special files
+- Route segments (dynamic, catch-all, groups)
+- Parallel and intercepting routes
+- Middleware rename in v16 (middleware → proxy)
+
+## RSC Boundaries
+
+Detect invalid React Server Component patterns.
+
+See [rsc-boundaries.md](./rsc-boundaries.md) for:
+
+- Async client component detection (invalid)
+- Non-serializable props detection
+- Server Action exceptions
+
+## Async Patterns
+
+Next.js 15+ async API changes.
+
+See [async-patterns.md](./async-patterns.md) for:
+
+- Async `params` and `searchParams`
+- Async `cookies()` and `headers()`
+- Migration codemod
+
+## Runtime Selection
+
+See [runtime-selection.md](./runtime-selection.md) for:
+
+- Default to Node.js runtime
+- When Edge runtime is appropriate
+
+## Directives
+
+See [directives.md](./directives.md) for:
+
+- `'use client'`, `'use server'` (React)
+- `'use cache'` (Next.js)
+
+## Functions
+
+See [functions.md](./functions.md) for:
+
+- Navigation hooks: `useRouter`, `usePathname`, `useSearchParams`, `useParams`
+- Server functions: `cookies`, `headers`, `draftMode`, `after`
+- Generate functions: `generateStaticParams`, `generateMetadata`
+
+## Error Handling
+
+See [error-handling.md](./error-handling.md) for:
+
+- `error.tsx`, `global-error.tsx`, `not-found.tsx`
+- `redirect`, `permanentRedirect`, `notFound`
+- `forbidden`, `unauthorized` (auth errors)
+- `unstable_rethrow` for catch blocks
+
+## Data Patterns
+
+See [data-patterns.md](./data-patterns.md) for:
+
+- Server Components vs Server Actions vs Route Handlers
+- Avoiding data waterfalls (`Promise.all`, Suspense, preload)
+- Client component data fetching
+
+## Route Handlers
+
+See [route-handlers.md](./route-handlers.md) for:
+
+- `route.ts` basics
+- GET handler conflicts with `page.tsx`
+- Environment behavior (no React DOM)
+- When to use vs Server Actions
+
+## Metadata & OG Images
+
+See [metadata.md](./metadata.md) for:
+
+- Static and dynamic metadata
+- `generateMetadata` function
+- OG image generation with `next/og`
+- File-based metadata conventions
+
+## Image Optimization
+
+See [image.md](./image.md) for:
+
+- Always use `next/image` over `<img>`
+- Remote images configuration
+- Responsive `sizes` attribute
+- Blur placeholders
+- Priority loading for LCP
+
+## Font Optimization
+
+See [font.md](./font.md) for:
+
+- `next/font` setup
+- Google Fonts, local fonts
+- Tailwind CSS integration
+- Preloading subsets
+
+## Bundling
+
+See [bundling.md](./bundling.md) for:
+
+- Server-incompatible packages
+- CSS imports (not link tags)
+- Polyfills (already included)
+- ESM/CommonJS issues
+- Bundle analysis
+
+## Scripts
+
+See [scripts.md](./scripts.md) for:
+
+- `next/script` vs native script tags
+- Inline scripts need `id`
+- Loading strategies
+- Google Analytics with `@next/third-parties`
+
+## Hydration Errors
+
+See [hydration-error.md](./hydration-error.md) for:
+
+- Common causes (browser APIs, dates, invalid HTML)
+- Debugging with error overlay
+- Fixes for each cause
+
+## Suspense Boundaries
+
+See [suspense-boundaries.md](./suspense-boundaries.md) for:
+
+- CSR bailout with `useSearchParams` and `usePathname`
+- Which hooks require Suspense boundaries
+
+## Parallel & Intercepting Routes
+
+See [parallel-routes.md](./parallel-routes.md) for:
+
+- Modal patterns with `@slot` and `(.)` interceptors
+- `default.tsx` for fallbacks
+- Closing modals correctly with `router.back()`
+
+## Self-Hosting
+
+See [self-hosting.md](./self-hosting.md) for:
+
+- `output: 'standalone'` for Docker
+- Cache handlers for multi-instance ISR
+- What works vs needs extra setup
+
+## Debug Tricks
+
+See [debug-tricks.md](./debug-tricks.md) for:
+
+- MCP endpoint for AI-assisted debugging
+- Rebuild specific routes with `--debug-build-paths`
diff --git a/.cursor/skills/next-best-practices/async-patterns.md b/.cursor/skills/next-best-practices/async-patterns.md
new file mode 100644
index 000000000..0d5f91494
--- /dev/null
+++ b/.cursor/skills/next-best-practices/async-patterns.md
@@ -0,0 +1,87 @@
+# Async Patterns
+
+In Next.js 15+, `params`, `searchParams`, `cookies()`, and `headers()` are asynchronous.
+
+## Async Params and SearchParams
+
+Always type them as `Promise<...>` and await them.
+
+### Pages and Layouts
+
+```tsx
+type Props = { params: Promise<{ slug: string }> };
+
+export default async function Page({ params }: Props) {
+  const { slug } = await params;
+}
+```
+
+### Route Handlers
+
+```tsx
+export async function GET(
+  request: Request,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  const { id } = await params;
+}
+```
+
+### SearchParams
+
+```tsx
+type Props = {
+  params: Promise<{ slug: string }>;
+  searchParams: Promise<{ query?: string }>;
+};
+
+export default async function Page({ params, searchParams }: Props) {
+  const { slug } = await params;
+  const { query } = await searchParams;
+}
+```
+
+### Synchronous Components
+
+Use `React.use()` for non-async components:
+
+```tsx
+import { use } from "react";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export default function Page({ params }: Props) {
+  const { slug } = use(params);
+}
+```
+
+### generateMetadata
+
+```tsx
+type Props = { params: Promise<{ slug: string }> };
+
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { slug } = await params;
+  return { title: slug };
+}
+```
+
+## Async Cookies and Headers
+
+```tsx
+import { cookies, headers } from "next/headers";
+
+export default async function Page() {
+  const cookieStore = await cookies();
+  const headersList = await headers();
+
+  const theme = cookieStore.get("theme");
+  const userAgent = headersList.get("user-agent");
+}
+```
+
+## Migration Codemod
+
+```bash
+npx @next/codemod@latest next-async-request-api .
+```
diff --git a/.cursor/skills/next-best-practices/bundling.md b/.cursor/skills/next-best-practices/bundling.md
new file mode 100644
index 000000000..4d09f56be
--- /dev/null
+++ b/.cursor/skills/next-best-practices/bundling.md
@@ -0,0 +1,182 @@
+# Bundling
+
+Fix common bundling issues with third-party packages.
+
+## Server-Incompatible Packages
+
+Some packages use browser APIs (`window`, `document`, `localStorage`) and fail in Server Components.
+
+### Error Signs
+
+```
+ReferenceError: window is not defined
+ReferenceError: document is not defined
+ReferenceError: localStorage is not defined
+Module not found: Can't resolve 'fs'
+```
+
+### Solution 1: Mark as Client-Only
+
+If the package is only needed on client:
+
+```tsx
+// Bad: Fails - package uses window
+import SomeChart from "some-chart-library";
+
+export default function Page() {
+  return <SomeChart />;
+}
+
+// Good: Use dynamic import with ssr: false
+import dynamic from "next/dynamic";
+
+const SomeChart = dynamic(() => import("some-chart-library"), {
+  ssr: false,
+});
+
+export default function Page() {
+  return <SomeChart />;
+}
+```
+
+### Solution 2: Externalize from Server Bundle
+
+For packages that should run on server but have bundling issues:
+
+```js
+// next.config.js
+module.exports = {
+  serverExternalPackages: ["problematic-package"],
+};
+```
+
+Use this for:
+
+- Packages with native bindings (sharp, bcrypt)
+- Packages that don't bundle well (some ORMs)
+- Packages with circular dependencies
+
+### Solution 3: Client Component Wrapper
+
+Wrap the entire usage in a client component:
+
+```tsx
+// components/ChartWrapper.tsx
+"use client";
+
+import { Chart } from "chart-library";
+
+export function ChartWrapper(props) {
+  return <Chart {...props} />;
+}
+
+// app/page.tsx (server component)
+import { ChartWrapper } from "@/components/ChartWrapper";
+
+export default function Page() {
+  return <ChartWrapper data={data} />;
+}
+```
+
+## CSS Imports
+
+Import CSS files instead of using `<link>` tags. Next.js handles bundling and optimization.
+
+```tsx
+// Bad: Manual link tag
+<link rel="stylesheet" href="/styles.css" />;
+
+// Good: Import CSS
+import "./styles.css";
+
+// Good: CSS Modules
+import styles from "./Button.module.css";
+```
+
+## Polyfills
+
+Next.js includes common polyfills automatically. Don't load redundant ones from polyfill.io or similar CDNs.
+
+Already included: `Array.from`, `Object.assign`, `Promise`, `fetch`, `Map`, `Set`, `Symbol`, `URLSearchParams`, and 50+ others.
+
+```tsx
+// Bad: Redundant polyfills
+<script src="https://polyfill.io/v3/polyfill.min.js?features=fetch,Promise,Array.from" />
+
+// Good: Next.js includes these automatically
+```
+
+## ESM/CommonJS Issues
+
+### Error Signs
+
+```
+SyntaxError: Cannot use import statement outside a module
+Error: require() of ES Module
+Module not found: ESM packages need to be imported
+```
+
+### Solution: Transpile Package
+
+```js
+// next.config.js
+module.exports = {
+  transpilePackages: ["some-esm-package", "another-package"],
+};
+```
+
+## Common Problematic Packages
+
+| Package         | Issue           | Solution                                                        |
+| --------------- | --------------- | --------------------------------------------------------------- |
+| `sharp`         | Native bindings | `serverExternalPackages: ['sharp']`                             |
+| `bcrypt`        | Native bindings | `serverExternalPackages: ['bcrypt']` or use `bcryptjs`          |
+| `canvas`        | Native bindings | `serverExternalPackages: ['canvas']`                            |
+| `recharts`      | Uses window     | `dynamic(() => import('recharts'), { ssr: false })`             |
+| `react-quill`   | Uses document   | `dynamic(() => import('react-quill'), { ssr: false })`          |
+| `mapbox-gl`     | Uses window     | `dynamic(() => import('mapbox-gl'), { ssr: false })`            |
+| `monaco-editor` | Uses window     | `dynamic(() => import('@monaco-editor/react'), { ssr: false })` |
+| `lottie-web`    | Uses document   | `dynamic(() => import('lottie-react'), { ssr: false })`         |
+
+## Bundle Analysis
+
+Analyze bundle size with the built-in analyzer (Next.js 16.1+):
+
+```bash
+next experimental-analyze
+```
+
+This opens an interactive UI to:
+
+- Filter by route, environment (client/server), and type
+- Inspect module sizes and import chains
+- View treemap visualization
+
+Save output for comparison:
+
+```bash
+next experimental-analyze --output
+# Output saved to .next/diagnostics/analyze
+```
+
+Reference: https://nextjs.org/docs/app/guides/package-bundling
+
+## Migrating from Webpack to Turbopack
+
+Turbopack is the default bundler in Next.js 15+. If you have custom webpack config, migrate to Turbopack-compatible alternatives:
+
+```js
+// next.config.js
+module.exports = {
+  // Good: Works with Turbopack
+  serverExternalPackages: ["package"],
+  transpilePackages: ["package"],
+
+  // Bad: Webpack-only - migrate away from this
+  webpack: (config) => {
+    // custom webpack config
+  },
+};
+```
+
+Reference: https://nextjs.org/docs/app/building-your-application/upgrading/from-webpack-to-turbopack
diff --git a/.cursor/skills/next-best-practices/data-patterns.md b/.cursor/skills/next-best-practices/data-patterns.md
new file mode 100644
index 000000000..827ef75fa
--- /dev/null
+++ b/.cursor/skills/next-best-practices/data-patterns.md
@@ -0,0 +1,306 @@
+# Data Patterns
+
+Choose the right data fetching pattern for each use case.
+
+## Decision Tree
+
+```
+Need to fetch data?
+├── From a Server Component?
+│   └── Use: Fetch directly (no API needed)
+│
+├── From a Client Component?
+│   ├── Is it a mutation (POST/PUT/DELETE)?
+│   │   └── Use: Server Action
+│   └── Is it a read (GET)?
+│       └── Use: Route Handler OR pass from Server Component
+│
+├── Need external API access (webhooks, third parties)?
+│   └── Use: Route Handler
+│
+└── Need REST API for mobile app / external clients?
+    └── Use: Route Handler
+```
+
+## Pattern 1: Server Components (Preferred for Reads)
+
+Fetch data directly in Server Components - no API layer needed.
+
+```tsx
+// app/users/page.tsx
+async function UsersPage() {
+  // Direct database access - no API round-trip
+  const users = await db.user.findMany();
+
+  // Or fetch from external API
+  const posts = await fetch("https://api.example.com/posts").then((r) =>
+    r.json(),
+  );
+
+  return (
+    <ul>
+      {users.map((user) => (
+        <li key={user.id}>{user.name}</li>
+      ))}
+    </ul>
+  );
+}
+```
+
+**Benefits**:
+
+- No API to maintain
+- No client-server waterfall
+- Secrets stay on server
+- Direct database access
+
+## Pattern 2: Server Actions (Preferred for Mutations)
+
+Server Actions are the recommended way to handle mutations.
+
+```tsx
+// app/actions.ts
+"use server";
+
+import { revalidatePath } from "next/cache";
+
+export async function createPost(formData: FormData) {
+  const title = formData.get("title") as string;
+
+  await db.post.create({ data: { title } });
+
+  revalidatePath("/posts");
+}
+
+export async function deletePost(id: string) {
+  await db.post.delete({ where: { id } });
+
+  revalidateTag("posts");
+}
+```
+
+```tsx
+// app/posts/new/page.tsx
+import { createPost } from "@/app/actions";
+
+export default function NewPost() {
+  return (
+    <form action={createPost}>
+      <input name="title" required />
+      <button type="submit">Create</button>
+    </form>
+  );
+}
+```
+
+**Benefits**:
+
+- End-to-end type safety
+- Progressive enhancement (works without JS)
+- Automatic request handling
+- Integrated with React transitions
+
+**Constraints**:
+
+- POST only (no GET caching semantics)
+- Internal use only (no external access)
+- Cannot return non-serializable data
+
+## Pattern 3: Route Handlers (APIs)
+
+Use Route Handlers when you need a REST API.
+
+```tsx
+// app/api/posts/route.ts
+import { NextRequest, NextResponse } from "next/server";
+
+// GET is cacheable
+export async function GET(request: NextRequest) {
+  const posts = await db.post.findMany();
+  return NextResponse.json(posts);
+}
+
+// POST for mutations
+export async function POST(request: NextRequest) {
+  const body = await request.json();
+  const post = await db.post.create({ data: body });
+  return NextResponse.json(post, { status: 201 });
+}
+```
+
+**When to use**:
+
+- External API access (mobile apps, third parties)
+- Webhooks from external services
+- GET endpoints that need HTTP caching
+- OpenAPI/Swagger documentation needed
+
+**When NOT to use**:
+
+- Internal data fetching (use Server Components)
+- Mutations from your UI (use Server Actions)
+
+## Avoiding Data Waterfalls
+
+### Problem: Sequential Fetches
+
+```tsx
+// Bad: Sequential waterfalls
+async function Dashboard() {
+  const user = await getUser(); // Wait...
+  const posts = await getPosts(); // Then wait...
+  const comments = await getComments(); // Then wait...
+
+  return <div>...</div>;
+}
+```
+
+### Solution 1: Parallel Fetching with Promise.all
+
+```tsx
+// Good: Parallel fetching
+async function Dashboard() {
+  const [user, posts, comments] = await Promise.all([
+    getUser(),
+    getPosts(),
+    getComments(),
+  ]);
+
+  return <div>...</div>;
+}
+```
+
+### Solution 2: Streaming with Suspense
+
+```tsx
+// Good: Show content progressively
+import { Suspense } from "react";
+
+async function Dashboard() {
+  return (
+    <div>
+      <Suspense fallback={<UserSkeleton />}>
+        <UserSection />
+      </Suspense>
+      <Suspense fallback={<PostsSkeleton />}>
+        <PostsSection />
+      </Suspense>
+    </div>
+  );
+}
+
+async function UserSection() {
+  const user = await getUser(); // Fetches independently
+  return <div>{user.name}</div>;
+}
+
+async function PostsSection() {
+  const posts = await getPosts(); // Fetches independently
+  return <PostList posts={posts} />;
+}
+```
+
+### Solution 3: Preload Pattern
+
+```tsx
+// lib/data.ts
+import { cache } from "react";
+
+export const getUser = cache(async (id: string) => {
+  return db.user.findUnique({ where: { id } });
+});
+
+export const preloadUser = (id: string) => {
+  void getUser(id); // Fire and forget
+};
+```
+
+```tsx
+// app/user/[id]/page.tsx
+import { getUser, preloadUser } from "@/lib/data";
+
+export default async function UserPage({ params }) {
+  const { id } = await params;
+
+  // Start fetching early
+  preloadUser(id);
+
+  // Do other work...
+
+  // Data likely ready by now
+  const user = await getUser(id);
+  return <div>{user.name}</div>;
+}
+```
+
+## Client Component Data Fetching
+
+When Client Components need data:
+
+### Option 1: Pass from Server Component (Preferred)
+
+```tsx
+// Server Component
+async function Page() {
+  const data = await fetchData();
+  return <ClientComponent initialData={data} />;
+}
+
+// Client Component
+("use client");
+function ClientComponent({ initialData }) {
+  const [data, setData] = useState(initialData);
+  // ...
+}
+```
+
+### Option 2: Fetch on Mount (When Necessary)
+
+```tsx
+"use client";
+import { useEffect, useState } from "react";
+
+function ClientComponent() {
+  const [data, setData] = useState(null);
+
+  useEffect(() => {
+    fetch("/api/data")
+      .then((r) => r.json())
+      .then(setData);
+  }, []);
+
+  if (!data) return <Loading />;
+  return <div>{data.value}</div>;
+}
+```
+
+### Option 3: Server Action for Reads (Works But Not Ideal)
+
+Server Actions can be called from Client Components for reads, but this is not their intended purpose:
+
+```tsx
+"use client";
+import { getData } from "./actions";
+import { useEffect, useState } from "react";
+
+function ClientComponent() {
+  const [data, setData] = useState(null);
+
+  useEffect(() => {
+    getData().then(setData);
+  }, []);
+
+  return <div>{data?.value}</div>;
+}
+```
+
+**Note**: Server Actions always use POST, so no HTTP caching. Prefer Route Handlers for cacheable reads.
+
+## Quick Reference
+
+| Pattern                | Use Case                    | HTTP Method | Caching              |
+| ---------------------- | --------------------------- | ----------- | -------------------- |
+| Server Component fetch | Internal reads              | Any         | Full Next.js caching |
+| Server Action          | Mutations, form submissions | POST only   | No                   |
+| Route Handler          | External APIs, webhooks     | Any         | GET can be cached    |
+| Client fetch to API    | Client-side reads           | Any         | HTTP cache headers   |
diff --git a/.cursor/skills/next-best-practices/debug-tricks.md b/.cursor/skills/next-best-practices/debug-tricks.md
new file mode 100644
index 000000000..465824a8f
--- /dev/null
+++ b/.cursor/skills/next-best-practices/debug-tricks.md
@@ -0,0 +1,125 @@
+# Debug Tricks
+
+Tricks to speed up debugging Next.js applications.
+
+## MCP Endpoint (Dev Server)
+
+Next.js exposes a `/_next/mcp` endpoint in development for AI-assisted debugging via MCP (Model Context Protocol).
+
+- **Next.js 16+**: Enabled by default, use `next-devtools-mcp`
+- **Next.js < 16**: Requires `experimental.mcpServer: true` in next.config.js
+
+Reference: https://nextjs.org/docs/app/guides/mcp
+
+**Important**: Find the actual port of the running Next.js dev server (check terminal output or `package.json` scripts). Don't assume port 3000.
+
+### Request Format
+
+The endpoint uses JSON-RPC 2.0 over HTTP POST:
+
+```bash
+curl -X POST http://localhost:<port>/_next/mcp \
+  -H "Content-Type: application/json" \
+  -H "Accept: application/json, text/event-stream" \
+  -d '{
+    "jsonrpc": "2.0",
+    "id": "1",
+    "method": "tools/call",
+    "params": {
+      "name": "<tool-name>",
+      "arguments": {}
+    }
+  }'
+```
+
+### Available Tools
+
+#### `get_errors`
+
+Get current errors from dev server (build errors, runtime errors with source-mapped stacks):
+
+```json
+{ "name": "get_errors", "arguments": {} }
+```
+
+#### `get_routes`
+
+Discover all routes by scanning filesystem:
+
+```json
+{ "name": "get_routes", "arguments": {} }
+// Optional: { "name": "get_routes", "arguments": { "routerType": "app" } }
+```
+
+Returns: `{ "appRouter": ["/", "/api/users/[id]", ...], "pagesRouter": [...] }`
+
+#### `get_project_metadata`
+
+Get project path and dev server URL:
+
+```json
+{ "name": "get_project_metadata", "arguments": {} }
+```
+
+Returns: `{ "projectPath": "/path/to/project", "devServerUrl": "http://localhost:3000" }`
+
+#### `get_page_metadata`
+
+Get runtime metadata about current page render (requires active browser session):
+
+```json
+{ "name": "get_page_metadata", "arguments": {} }
+```
+
+Returns segment trie data showing layouts, boundaries, and page components.
+
+#### `get_logs`
+
+Get path to Next.js development log file:
+
+```json
+{ "name": "get_logs", "arguments": {} }
+```
+
+Returns path to `<distDir>/logs/next-development.log`
+
+#### `get_server_action_by_id`
+
+Locate a Server Action by ID:
+
+```json
+{
+  "name": "get_server_action_by_id",
+  "arguments": { "actionId": "<action-id>" }
+}
+```
+
+### Example: Get Errors
+
+```bash
+curl -X POST http://localhost:<port>/_next/mcp \
+  -H "Content-Type: application/json" \
+  -H "Accept: application/json, text/event-stream" \
+  -d '{"jsonrpc":"2.0","id":"1","method":"tools/call","params":{"name":"get_errors","arguments":{}}}'
+```
+
+## Rebuild Specific Routes (Next.js 16+)
+
+Use `--debug-build-paths` to rebuild only specific routes instead of the entire app:
+
+```bash
+# Rebuild a specific route
+next build --debug-build-paths "/dashboard"
+
+# Rebuild routes matching a glob
+next build --debug-build-paths "/api/*"
+
+# Dynamic routes
+next build --debug-build-paths "/blog/[slug]"
+```
+
+Use this to:
+
+- Quickly verify a build fix without full rebuild
+- Debug static generation issues for specific pages
+- Iterate faster on build errors
diff --git a/.cursor/skills/next-best-practices/directives.md b/.cursor/skills/next-best-practices/directives.md
new file mode 100644
index 000000000..2ed949442
--- /dev/null
+++ b/.cursor/skills/next-best-practices/directives.md
@@ -0,0 +1,74 @@
+# Directives
+
+## React Directives
+
+These are React directives, not Next.js specific.
+
+### `'use client'`
+
+Marks a component as a Client Component. Required for:
+
+- React hooks (`useState`, `useEffect`, etc.)
+- Event handlers (`onClick`, `onChange`)
+- Browser APIs (`window`, `localStorage`)
+
+```tsx
+"use client";
+
+import { useState } from "react";
+
+export function Counter() {
+  const [count, setCount] = useState(0);
+  return <button onClick={() => setCount(count + 1)}>{count}</button>;
+}
+```
+
+Reference: https://react.dev/reference/rsc/use-client
+
+### `'use server'`
+
+Marks a function as a Server Action. Can be passed to Client Components.
+
+```tsx
+"use server";
+
+export async function submitForm(formData: FormData) {
+  // Runs on server
+}
+```
+
+Or inline within a Server Component:
+
+```tsx
+export default function Page() {
+  async function submit() {
+    "use server";
+    // Runs on server
+  }
+  return <form action={submit}>...</form>;
+}
+```
+
+Reference: https://react.dev/reference/rsc/use-server
+
+---
+
+## Next.js Directive
+
+### `'use cache'`
+
+Marks a function or component for caching. Part of Next.js Cache Components.
+
+```tsx
+"use cache";
+
+export async function getCachedData() {
+  return await fetchData();
+}
+```
+
+Requires `cacheComponents: true` in `next.config.ts`.
+
+For detailed usage including cache profiles, `cacheLife()`, `cacheTag()`, and `updateTag()`, see the `next-cache-components` skill.
+
+Reference: https://nextjs.org/docs/app/api-reference/directives/use-cache
diff --git a/.cursor/skills/next-best-practices/error-handling.md b/.cursor/skills/next-best-practices/error-handling.md
new file mode 100644
index 000000000..4d32e8f9e
--- /dev/null
+++ b/.cursor/skills/next-best-practices/error-handling.md
@@ -0,0 +1,232 @@
+# Error Handling
+
+Handle errors gracefully in Next.js applications.
+
+Reference: https://nextjs.org/docs/app/getting-started/error-handling
+
+## Error Boundaries
+
+### `error.tsx`
+
+Catches errors in a route segment and its children:
+
+```tsx
+"use client";
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  return (
+    <div>
+      <h2>Something went wrong!</h2>
+      <button onClick={() => reset()}>Try again</button>
+    </div>
+  );
+}
+```
+
+**Important:** `error.tsx` must be a Client Component.
+
+### `global-error.tsx`
+
+Catches errors in root layout:
+
+```tsx
+"use client";
+
+export default function GlobalError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  return (
+    <html>
+      <body>
+        <h2>Something went wrong!</h2>
+        <button onClick={() => reset()}>Try again</button>
+      </body>
+    </html>
+  );
+}
+```
+
+**Important:** Must include `<html>` and `<body>` tags.
+
+## Server Actions: Navigation API Gotcha
+
+**Do NOT wrap navigation APIs in try-catch.** They throw special errors that Next.js handles internally.
+
+Reference: https://nextjs.org/docs/app/api-reference/functions/redirect#behavior
+
+```tsx
+'use server'
+
+import { redirect } from 'next/navigation'
+import { notFound } from 'next/navigation'
+
+// Bad: try-catch catches the navigation "error"
+async function createPost(formData: FormData) {
+  try {
+    const post = await db.post.create({ ... })
+    redirect(`/posts/${post.id}`)  // This throws!
+  } catch (error) {
+    // redirect() throw is caught here - navigation fails!
+    return { error: 'Failed to create post' }
+  }
+}
+
+// Good: Call navigation APIs outside try-catch
+async function createPost(formData: FormData) {
+  let post
+  try {
+    post = await db.post.create({ ... })
+  } catch (error) {
+    return { error: 'Failed to create post' }
+  }
+  redirect(`/posts/${post.id}`)  // Outside try-catch
+}
+
+// Good: Re-throw navigation errors
+async function createPost(formData: FormData) {
+  try {
+    const post = await db.post.create({ ... })
+    redirect(`/posts/${post.id}`)
+  } catch (error) {
+    if (error instanceof Error && error.message === 'NEXT_REDIRECT') {
+      throw error  // Re-throw navigation errors
+    }
+    return { error: 'Failed to create post' }
+  }
+}
+```
+
+Same applies to:
+
+- `redirect()` - 307 temporary redirect
+- `permanentRedirect()` - 308 permanent redirect
+- `notFound()` - 404 not found
+- `forbidden()` - 403 forbidden
+- `unauthorized()` - 401 unauthorized
+
+Use `unstable_rethrow()` to re-throw these errors in catch blocks:
+
+```tsx
+import { unstable_rethrow } from "next/navigation";
+
+async function action() {
+  try {
+    // ...
+    redirect("/success");
+  } catch (error) {
+    unstable_rethrow(error); // Re-throws Next.js internal errors
+    return { error: "Something went wrong" };
+  }
+}
+```
+
+## Redirects
+
+```tsx
+import { redirect, permanentRedirect } from "next/navigation";
+
+// 307 Temporary - use for most cases
+redirect("/new-path");
+
+// 308 Permanent - use for URL migrations (cached by browsers)
+permanentRedirect("/new-url");
+```
+
+## Auth Errors
+
+Trigger auth-related error pages:
+
+```tsx
+import { forbidden, unauthorized } from "next/navigation";
+
+async function Page() {
+  const session = await getSession();
+
+  if (!session) {
+    unauthorized(); // Renders unauthorized.tsx (401)
+  }
+
+  if (!session.hasAccess) {
+    forbidden(); // Renders forbidden.tsx (403)
+  }
+
+  return <Dashboard />;
+}
+```
+
+Create corresponding error pages:
+
+```tsx
+// app/forbidden.tsx
+export default function Forbidden() {
+  return <div>You don't have access to this resource</div>;
+}
+
+// app/unauthorized.tsx
+export default function Unauthorized() {
+  return <div>Please log in to continue</div>;
+}
+```
+
+## Not Found
+
+### `not-found.tsx`
+
+Custom 404 page for a route segment:
+
+```tsx
+export default function NotFound() {
+  return (
+    <div>
+      <h2>Not Found</h2>
+      <p>Could not find the requested resource</p>
+    </div>
+  );
+}
+```
+
+### Triggering Not Found
+
+```tsx
+import { notFound } from "next/navigation";
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const post = await getPost(id);
+
+  if (!post) {
+    notFound(); // Renders closest not-found.tsx
+  }
+
+  return <div>{post.title}</div>;
+}
+```
+
+## Error Hierarchy
+
+Errors bubble up to the nearest error boundary:
+
+```
+app/
+├── error.tsx           # Catches errors from all children
+├── blog/
+│   ├── error.tsx       # Catches errors in /blog/*
+│   └── [slug]/
+│       ├── error.tsx   # Catches errors in /blog/[slug]
+│       └── page.tsx
+└── layout.tsx          # Errors here go to global-error.tsx
+```
diff --git a/.cursor/skills/next-best-practices/file-conventions.md b/.cursor/skills/next-best-practices/file-conventions.md
new file mode 100644
index 000000000..ef2ce9335
--- /dev/null
+++ b/.cursor/skills/next-best-practices/file-conventions.md
@@ -0,0 +1,141 @@
+# File Conventions
+
+Next.js App Router uses file-based routing with special file conventions.
+
+## Project Structure
+
+Reference: https://nextjs.org/docs/app/getting-started/project-structure
+
+```
+app/
+├── layout.tsx          # Root layout (required)
+├── page.tsx            # Home page (/)
+├── loading.tsx         # Loading UI
+├── error.tsx           # Error UI
+├── not-found.tsx       # 404 UI
+├── global-error.tsx    # Global error UI
+├── route.ts            # API endpoint
+├── template.tsx        # Re-rendered layout
+├── default.tsx         # Parallel route fallback
+├── blog/
+│   ├── page.tsx        # /blog
+│   └── [slug]/
+│       └── page.tsx    # /blog/:slug
+└── (group)/            # Route group (no URL impact)
+    └── page.tsx
+```
+
+## Special Files
+
+| File            | Purpose                                  |
+| --------------- | ---------------------------------------- |
+| `page.tsx`      | UI for a route segment                   |
+| `layout.tsx`    | Shared UI for segment and children       |
+| `loading.tsx`   | Loading UI (Suspense boundary)           |
+| `error.tsx`     | Error UI (Error boundary)                |
+| `not-found.tsx` | 404 UI                                   |
+| `route.ts`      | API endpoint                             |
+| `template.tsx`  | Like layout but re-renders on navigation |
+| `default.tsx`   | Fallback for parallel routes             |
+
+## Route Segments
+
+```
+app/
+├── blog/               # Static segment: /blog
+├── [slug]/             # Dynamic segment: /:slug
+├── [...slug]/          # Catch-all: /a/b/c
+├── [[...slug]]/        # Optional catch-all: / or /a/b/c
+└── (marketing)/        # Route group (ignored in URL)
+```
+
+## Parallel Routes
+
+```
+app/
+├── @analytics/
+│   └── page.tsx
+├── @sidebar/
+│   └── page.tsx
+└── layout.tsx          # Receives { analytics, sidebar } as props
+```
+
+## Intercepting Routes
+
+```
+app/
+├── feed/
+│   └── page.tsx
+├── @modal/
+│   └── (.)photo/[id]/  # Intercepts /photo/[id] from /feed
+│       └── page.tsx
+└── photo/[id]/
+    └── page.tsx
+```
+
+Conventions:
+
+- `(.)` - same level
+- `(..)` - one level up
+- `(..)(..)` - two levels up
+- `(...)` - from root
+
+## Private Folders
+
+```
+app/
+├── _components/        # Private folder (not a route)
+│   └── Button.tsx
+└── page.tsx
+```
+
+Prefix with `_` to exclude from routing.
+
+## Middleware / Proxy
+
+### Next.js 14-15: `middleware.ts`
+
+```ts
+// middleware.ts (root of project)
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export function middleware(request: NextRequest) {
+  // Auth, redirects, rewrites, etc.
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: ["/dashboard/:path*", "/api/:path*"],
+};
+```
+
+### Next.js 16+: `proxy.ts`
+
+Renamed for clarity - same capabilities, different names:
+
+```ts
+// proxy.ts (root of project)
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export function proxy(request: NextRequest) {
+  // Same logic as middleware
+  return NextResponse.next();
+}
+
+export const proxyConfig = {
+  matcher: ["/dashboard/:path*", "/api/:path*"],
+};
+```
+
+| Version | File            | Export         | Config        |
+| ------- | --------------- | -------------- | ------------- |
+| v14-15  | `middleware.ts` | `middleware()` | `config`      |
+| v16+    | `proxy.ts`      | `proxy()`      | `proxyConfig` |
+
+**Migration**: Run `npx @next/codemod@latest upgrade` to auto-rename.
+
+## File Conventions Reference
+
+Reference: https://nextjs.org/docs/app/api-reference/file-conventions
diff --git a/.cursor/skills/next-best-practices/font.md b/.cursor/skills/next-best-practices/font.md
new file mode 100644
index 000000000..88362e6b0
--- /dev/null
+++ b/.cursor/skills/next-best-practices/font.md
@@ -0,0 +1,257 @@
+# Font Optimization
+
+Use `next/font` for automatic font optimization with zero layout shift.
+
+## Google Fonts
+
+```tsx
+// app/layout.tsx
+import { Inter } from "next/font/google";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" className={inter.className}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+## Multiple Fonts
+
+```tsx
+import { Inter, Roboto_Mono } from "next/font/google";
+
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+});
+
+const robotoMono = Roboto_Mono({
+  subsets: ["latin"],
+  variable: "--font-roboto-mono",
+});
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" className={`${inter.variable} ${robotoMono.variable}`}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+Use in CSS:
+
+```css
+body {
+  font-family: var(--font-inter);
+}
+
+code {
+  font-family: var(--font-roboto-mono);
+}
+```
+
+## Font Weights and Styles
+
+```tsx
+// Single weight
+const inter = Inter({
+  subsets: ["latin"],
+  weight: "400",
+});
+
+// Multiple weights
+const inter = Inter({
+  subsets: ["latin"],
+  weight: ["400", "500", "700"],
+});
+
+// Variable font (recommended) - includes all weights
+const inter = Inter({
+  subsets: ["latin"],
+  // No weight needed - variable fonts support all weights
+});
+
+// With italic
+const inter = Inter({
+  subsets: ["latin"],
+  style: ["normal", "italic"],
+});
+```
+
+## Local Fonts
+
+```tsx
+import localFont from "next/font/local";
+
+const myFont = localFont({
+  src: "./fonts/MyFont.woff2",
+});
+
+// Multiple files for different weights
+const myFont = localFont({
+  src: [
+    {
+      path: "./fonts/MyFont-Regular.woff2",
+      weight: "400",
+      style: "normal",
+    },
+    {
+      path: "./fonts/MyFont-Bold.woff2",
+      weight: "700",
+      style: "normal",
+    },
+  ],
+});
+
+// Variable font
+const myFont = localFont({
+  src: "./fonts/MyFont-Variable.woff2",
+  variable: "--font-my-font",
+});
+```
+
+## Tailwind CSS Integration
+
+```tsx
+// app/layout.tsx
+import { Inter } from "next/font/google";
+
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+});
+
+export default function RootLayout({ children }) {
+  return (
+    <html lang="en" className={inter.variable}>
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+```js
+// tailwind.config.js
+module.exports = {
+  theme: {
+    extend: {
+      fontFamily: {
+        sans: ["var(--font-inter)"],
+      },
+    },
+  },
+};
+```
+
+## Preloading Subsets
+
+Only load needed character subsets:
+
+```tsx
+// Latin only (most common)
+const inter = Inter({ subsets: ["latin"] });
+
+// Multiple subsets
+const inter = Inter({ subsets: ["latin", "latin-ext", "cyrillic"] });
+```
+
+## Display Strategy
+
+Control font loading behavior:
+
+```tsx
+const inter = Inter({
+  subsets: ["latin"],
+  display: "swap", // Default - shows fallback, swaps when loaded
+});
+
+// Options:
+// 'auto' - browser decides
+// 'block' - short block period, then swap
+// 'swap' - immediate fallback, swap when ready (recommended)
+// 'fallback' - short block, short swap, then fallback
+// 'optional' - short block, no swap (use if font is optional)
+```
+
+## Don't Use Manual Font Links
+
+Always use `next/font` instead of `<link>` tags for Google Fonts.
+
+```tsx
+// Bad: Manual link tag (blocks rendering, no optimization)
+<link href="https://fonts.googleapis.com/css2?family=Inter" rel="stylesheet" />
+
+// Bad: Missing display and preconnect
+<link href="https://fonts.googleapis.com/css2?family=Inter" rel="stylesheet" />
+
+// Good: Use next/font (self-hosted, zero layout shift)
+import { Inter } from 'next/font/google'
+
+const inter = Inter({ subsets: ['latin'] })
+```
+
+## Common Mistakes
+
+```tsx
+// Bad: Importing font in every component
+// components/Button.tsx
+import { Inter } from 'next/font/google'
+const inter = Inter({ subsets: ['latin'] }) // Creates new instance each time!
+
+// Good: Import once in layout, use CSS variable
+// app/layout.tsx
+const inter = Inter({ subsets: ['latin'], variable: '--font-inter' })
+
+// Bad: Using @import in CSS (blocks rendering)
+/* globals.css */
+@import url('https://fonts.googleapis.com/css2?family=Inter');
+
+// Good: Use next/font (self-hosted, no network request)
+import { Inter } from 'next/font/google'
+
+// Bad: Loading all weights when only using a few
+const inter = Inter({ subsets: ['latin'] }) // Loads all weights
+
+// Good: Specify only needed weights (for non-variable fonts)
+const inter = Inter({ subsets: ['latin'], weight: ['400', '700'] })
+
+// Bad: Missing subset - loads all characters
+const inter = Inter({})
+
+// Good: Always specify subset
+const inter = Inter({ subsets: ['latin'] })
+```
+
+## Font in Specific Components
+
+```tsx
+// For component-specific fonts, export from a shared file
+// lib/fonts.ts
+import { Inter, Playfair_Display } from "next/font/google";
+
+export const inter = Inter({ subsets: ["latin"], variable: "--font-inter" });
+export const playfair = Playfair_Display({
+  subsets: ["latin"],
+  variable: "--font-playfair",
+});
+
+// components/Heading.tsx
+import { playfair } from "@/lib/fonts";
+
+export function Heading({ children }) {
+  return <h1 className={playfair.className}>{children}</h1>;
+}
+```
diff --git a/.cursor/skills/next-best-practices/functions.md b/.cursor/skills/next-best-practices/functions.md
new file mode 100644
index 000000000..1feb0a3cb
--- /dev/null
+++ b/.cursor/skills/next-best-practices/functions.md
@@ -0,0 +1,108 @@
+# Functions
+
+Next.js function APIs.
+
+Reference: https://nextjs.org/docs/app/api-reference/functions
+
+## Navigation Hooks (Client)
+
+| Hook                        | Purpose                                                        | Reference                                                                                |
+| --------------------------- | -------------------------------------------------------------- | ---------------------------------------------------------------------------------------- |
+| `useRouter`                 | Programmatic navigation (`push`, `replace`, `back`, `refresh`) | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-router)                   |
+| `usePathname`               | Get current pathname                                           | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-pathname)                 |
+| `useSearchParams`           | Read URL search parameters                                     | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-search-params)            |
+| `useParams`                 | Access dynamic route parameters                                | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-params)                   |
+| `useSelectedLayoutSegment`  | Active child segment (one level)                               | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-selected-layout-segment)  |
+| `useSelectedLayoutSegments` | All active segments below layout                               | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-selected-layout-segments) |
+| `useLinkStatus`             | Check link prefetch status                                     | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-link-status)              |
+| `useReportWebVitals`        | Report Core Web Vitals metrics                                 | [Docs](https://nextjs.org/docs/app/api-reference/functions/use-report-web-vitals)        |
+
+## Server Functions
+
+| Function     | Purpose                                      | Reference                                                              |
+| ------------ | -------------------------------------------- | ---------------------------------------------------------------------- |
+| `cookies`    | Read/write cookies                           | [Docs](https://nextjs.org/docs/app/api-reference/functions/cookies)    |
+| `headers`    | Read request headers                         | [Docs](https://nextjs.org/docs/app/api-reference/functions/headers)    |
+| `draftMode`  | Enable preview of unpublished CMS content    | [Docs](https://nextjs.org/docs/app/api-reference/functions/draft-mode) |
+| `after`      | Run code after response finishes streaming   | [Docs](https://nextjs.org/docs/app/api-reference/functions/after)      |
+| `connection` | Wait for connection before dynamic rendering | [Docs](https://nextjs.org/docs/app/api-reference/functions/connection) |
+| `userAgent`  | Parse User-Agent header                      | [Docs](https://nextjs.org/docs/app/api-reference/functions/userAgent)  |
+
+## Generate Functions
+
+| Function                | Purpose                                 | Reference                                                                           |
+| ----------------------- | --------------------------------------- | ----------------------------------------------------------------------------------- |
+| `generateStaticParams`  | Pre-render dynamic routes at build time | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-static-params)  |
+| `generateMetadata`      | Dynamic metadata                        | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-metadata)       |
+| `generateViewport`      | Dynamic viewport config                 | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-viewport)       |
+| `generateSitemaps`      | Multiple sitemaps for large sites       | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-sitemaps)       |
+| `generateImageMetadata` | Multiple OG images per route            | [Docs](https://nextjs.org/docs/app/api-reference/functions/generate-image-metadata) |
+
+## Request/Response
+
+| Function        | Purpose                        | Reference                                                                  |
+| --------------- | ------------------------------ | -------------------------------------------------------------------------- |
+| `NextRequest`   | Extended Request with helpers  | [Docs](https://nextjs.org/docs/app/api-reference/functions/next-request)   |
+| `NextResponse`  | Extended Response with helpers | [Docs](https://nextjs.org/docs/app/api-reference/functions/next-response)  |
+| `ImageResponse` | Generate OG images             | [Docs](https://nextjs.org/docs/app/api-reference/functions/image-response) |
+
+## Common Examples
+
+### Navigation
+
+Use `next/link` for internal navigation instead of `<a>` tags.
+
+```tsx
+// Bad: Plain anchor tag
+<a href="/about">About</a>;
+
+// Good: Next.js Link
+import Link from "next/link";
+
+<Link href="/about">About</Link>;
+```
+
+Active link styling:
+
+```tsx
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+
+export function NavLink({ href, children }) {
+  const pathname = usePathname();
+
+  return (
+    <Link href={href} className={pathname === href ? "active" : ""}>
+      {children}
+    </Link>
+  );
+}
+```
+
+### Static Generation
+
+```tsx
+// app/blog/[slug]/page.tsx
+export async function generateStaticParams() {
+  const posts = await getPosts();
+  return posts.map((post) => ({ slug: post.slug }));
+}
+```
+
+### After Response
+
+```tsx
+import { after } from "next/server";
+
+export async function POST(request: Request) {
+  const data = await processRequest(request);
+
+  after(async () => {
+    await logAnalytics(data);
+  });
+
+  return Response.json({ success: true });
+}
+```
diff --git a/.cursor/skills/next-best-practices/hydration-error.md b/.cursor/skills/next-best-practices/hydration-error.md
new file mode 100644
index 000000000..988fe5dd8
--- /dev/null
+++ b/.cursor/skills/next-best-practices/hydration-error.md
@@ -0,0 +1,88 @@
+# Hydration Errors
+
+Diagnose and fix React hydration mismatch errors.
+
+## Error Signs
+
+- "Hydration failed because the initial UI does not match"
+- "Text content does not match server-rendered HTML"
+
+## Debugging
+
+In development, click the hydration error to see the server/client diff.
+
+## Common Causes and Fixes
+
+### Browser-only APIs
+
+```tsx
+// Bad: Causes mismatch - window doesn't exist on server
+<div>{window.innerWidth}</div>;
+
+// Good: Use client component with mounted check
+("use client");
+import { useState, useEffect } from "react";
+
+export function ClientOnly({ children }: { children: React.ReactNode }) {
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => setMounted(true), []);
+  return mounted ? children : null;
+}
+```
+
+### Date/Time Rendering
+
+Server and client may be in different timezones:
+
+```tsx
+// Bad: Causes mismatch
+<span>{new Date().toLocaleString()}</span>;
+
+// Good: Render on client only
+("use client");
+const [time, setTime] = useState<string>();
+useEffect(() => setTime(new Date().toLocaleString()), []);
+```
+
+### Random Values or IDs
+
+```tsx
+// Bad: Random values differ between server and client
+<div id={Math.random().toString()}>
+
+// Good: Use useId hook
+import { useId } from 'react'
+
+function Input() {
+  const id = useId()
+  return <input id={id} />
+}
+```
+
+### Invalid HTML Nesting
+
+```tsx
+// Bad: Invalid - div inside p
+<p><div>Content</div></p>
+
+// Bad: Invalid - p inside p
+<p><p>Nested</p></p>
+
+// Good: Valid nesting
+<div><p>Content</p></div>
+```
+
+### Third-party Scripts
+
+Scripts that modify DOM during hydration.
+
+```tsx
+// Good: Use next/script with afterInteractive
+import Script from "next/script";
+
+export default function Page() {
+  return (
+    <Script src="https://example.com/script.js" strategy="afterInteractive" />
+  );
+}
+```
diff --git a/.cursor/skills/next-best-practices/image.md b/.cursor/skills/next-best-practices/image.md
new file mode 100644
index 000000000..2372de4fe
--- /dev/null
+++ b/.cursor/skills/next-best-practices/image.md
@@ -0,0 +1,179 @@
+# Image Optimization
+
+Use `next/image` for automatic image optimization.
+
+## Always Use next/image
+
+```tsx
+// Bad: Avoid native img
+<img src="/hero.png" alt="Hero" />;
+
+// Good: Use next/image
+import Image from "next/image";
+<Image src="/hero.png" alt="Hero" width={800} height={400} />;
+```
+
+## Required Props
+
+Images need explicit dimensions to prevent layout shift:
+
+```tsx
+// Local images - dimensions inferred automatically
+import heroImage from './hero.png'
+<Image src={heroImage} alt="Hero" />
+
+// Remote images - must specify width/height
+<Image src="https://example.com/image.jpg" alt="Hero" width={800} height={400} />
+
+// Or use fill for parent-relative sizing
+<div style={{ position: 'relative', width: '100%', height: 400 }}>
+  <Image src="/hero.png" alt="Hero" fill style={{ objectFit: 'cover' }} />
+</div>
+```
+
+## Remote Images Configuration
+
+Remote domains must be configured in `next.config.js`:
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "example.com",
+        pathname: "/images/**",
+      },
+      {
+        protocol: "https",
+        hostname: "*.cdn.com", // Wildcard subdomain
+      },
+    ],
+  },
+};
+```
+
+## Responsive Images
+
+Use `sizes` to tell the browser which size to download:
+
+```tsx
+// Full-width hero
+<Image
+  src="/hero.png"
+  alt="Hero"
+  fill
+  sizes="100vw"
+/>
+
+// Responsive grid (3 columns on desktop, 1 on mobile)
+<Image
+  src="/card.png"
+  alt="Card"
+  fill
+  sizes="(max-width: 768px) 100vw, 33vw"
+/>
+
+// Fixed sidebar image
+<Image
+  src="/avatar.png"
+  alt="Avatar"
+  width={200}
+  height={200}
+  sizes="200px"
+/>
+```
+
+## Blur Placeholder
+
+Prevent layout shift with placeholders:
+
+```tsx
+// Local images - automatic blur hash
+import heroImage from './hero.png'
+<Image src={heroImage} alt="Hero" placeholder="blur" />
+
+// Remote images - provide blurDataURL
+<Image
+  src="https://example.com/image.jpg"
+  alt="Hero"
+  width={800}
+  height={400}
+  placeholder="blur"
+  blurDataURL="data:image/jpeg;base64,/9j/4AAQSkZJRg..."
+/>
+
+// Or use color placeholder
+<Image
+  src="https://example.com/image.jpg"
+  alt="Hero"
+  width={800}
+  height={400}
+  placeholder="empty"
+  style={{ backgroundColor: '#e0e0e0' }}
+/>
+```
+
+## Priority Loading
+
+Use `priority` for above-the-fold images (LCP):
+
+```tsx
+// Hero image - loads immediately
+<Image src="/hero.png" alt="Hero" fill priority />
+
+// Below-fold images - lazy loaded by default (no priority needed)
+<Image src="/card.png" alt="Card" width={400} height={300} />
+```
+
+## Common Mistakes
+
+```tsx
+// Bad: Missing sizes with fill - downloads largest image
+<Image src="/hero.png" alt="Hero" fill />
+
+// Good: Add sizes for proper responsive behavior
+<Image src="/hero.png" alt="Hero" fill sizes="100vw" />
+
+// Bad: Using width/height for aspect ratio only
+<Image src="/hero.png" alt="Hero" width={16} height={9} />
+
+// Good: Use actual display dimensions or fill with sizes
+<Image src="/hero.png" alt="Hero" fill sizes="100vw" style={{ objectFit: 'cover' }} />
+
+// Bad: Remote image without config
+<Image src="https://untrusted.com/image.jpg" alt="Image" width={400} height={300} />
+// Error: Invalid src prop, hostname not configured
+
+// Good: Add hostname to next.config.js remotePatterns
+```
+
+## Static Export
+
+When using `output: 'export'`, use `unoptimized` or custom loader:
+
+```tsx
+// Option 1: Disable optimization
+<Image src="/hero.png" alt="Hero" width={800} height={400} unoptimized />;
+
+// Option 2: Global config
+// next.config.js
+module.exports = {
+  output: "export",
+  images: { unoptimized: true },
+};
+
+// Option 3: Custom loader (Cloudinary, Imgix, etc.)
+const cloudinaryLoader = ({ src, width, quality }) => {
+  return `https://res.cloudinary.com/demo/image/upload/w_${width},q_${quality || 75}/${src}`;
+};
+
+<Image
+  loader={cloudinaryLoader}
+  src="sample.jpg"
+  alt="Sample"
+  width={800}
+  height={400}
+/>;
+```
diff --git a/.cursor/skills/next-best-practices/metadata.md b/.cursor/skills/next-best-practices/metadata.md
new file mode 100644
index 000000000..cbcebe745
--- /dev/null
+++ b/.cursor/skills/next-best-practices/metadata.md
@@ -0,0 +1,296 @@
+# Metadata
+
+Add SEO metadata to Next.js pages using the Metadata API.
+
+## Important: Server Components Only
+
+The `metadata` object and `generateMetadata` function are **only supported in Server Components**. They cannot be used in Client Components.
+
+If the target page has `'use client'`:
+
+1. Remove `'use client'` if possible, move client logic to child components
+2. Or extract metadata to a parent Server Component layout
+3. Or split the file: Server Component with metadata imports Client Components
+
+## Static Metadata
+
+```tsx
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Page Title",
+  description: "Page description for search engines",
+};
+```
+
+## Dynamic Metadata
+
+```tsx
+import type { Metadata } from "next";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { slug } = await params;
+  const post = await getPost(slug);
+  return { title: post.title, description: post.description };
+}
+```
+
+## Avoid Duplicate Fetches
+
+Use React `cache()` when the same data is needed for both metadata and page:
+
+```tsx
+import { cache } from "react";
+
+export const getPost = cache(async (slug: string) => {
+  return await db.posts.findFirst({ where: { slug } });
+});
+```
+
+## Viewport
+
+Separate from metadata for streaming support:
+
+```tsx
+import type { Viewport } from "next";
+
+export const viewport: Viewport = {
+  width: "device-width",
+  initialScale: 1,
+  themeColor: "#000000",
+};
+
+// Or dynamic
+export function generateViewport({ params }): Viewport {
+  return { themeColor: getThemeColor(params) };
+}
+```
+
+## Title Templates
+
+In root layout for consistent naming:
+
+```tsx
+export const metadata: Metadata = {
+  title: { default: "Site Name", template: "%s | Site Name" },
+};
+```
+
+## Metadata File Conventions
+
+Reference: https://nextjs.org/docs/app/getting-started/project-structure#metadata-file-conventions
+
+Place these files in `app/` directory (or route segments):
+
+| File                            | Purpose                                       |
+| ------------------------------- | --------------------------------------------- |
+| `favicon.ico`                   | Favicon                                       |
+| `icon.png` / `icon.svg`         | App icon                                      |
+| `apple-icon.png`                | Apple app icon                                |
+| `opengraph-image.png`           | OG image                                      |
+| `twitter-image.png`             | Twitter card image                            |
+| `sitemap.ts` / `sitemap.xml`    | Sitemap (use `generateSitemaps` for multiple) |
+| `robots.ts` / `robots.txt`      | Robots directives                             |
+| `manifest.ts` / `manifest.json` | Web app manifest                              |
+
+## SEO Best Practice: Static Files Are Often Enough
+
+For most sites, **static metadata files provide excellent SEO coverage**:
+
+```
+app/
+├── favicon.ico
+├── opengraph-image.png     # Works for both OG and Twitter
+├── sitemap.ts
+├── robots.ts
+└── layout.tsx              # With title/description metadata
+```
+
+**Tips:**
+
+- A single `opengraph-image.png` covers both Open Graph and Twitter (Twitter falls back to OG)
+- Static `title` and `description` in layout metadata is sufficient for most pages
+- Only use dynamic `generateMetadata` when content varies per page
+
+---
+
+# OG Image Generation
+
+Generate dynamic Open Graph images using `next/og`.
+
+## Important Rules
+
+1. **Use `next/og`** - not `@vercel/og` (it's built into Next.js)
+2. **No searchParams** - OG images can't access search params, use route params instead
+3. **Avoid Edge runtime** - Use default Node.js runtime
+
+```tsx
+// Good
+import { ImageResponse } from "next/og";
+
+// Bad
+// import { ImageResponse } from '@vercel/og'
+// export const runtime = 'edge'
+```
+
+## Basic OG Image
+
+```tsx
+// app/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export const alt = "Site Name";
+export const size = { width: 1200, height: 630 };
+export const contentType = "image/png";
+
+export default function Image() {
+  return new ImageResponse(
+    <div
+      style={{
+        fontSize: 128,
+        background: "white",
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+      }}
+    >
+      Hello World
+    </div>,
+    { ...size },
+  );
+}
+```
+
+## Dynamic OG Image
+
+```tsx
+// app/blog/[slug]/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export const alt = "Blog Post";
+export const size = { width: 1200, height: 630 };
+export const contentType = "image/png";
+
+type Props = { params: Promise<{ slug: string }> };
+
+export default async function Image({ params }: Props) {
+  const { slug } = await params;
+  const post = await getPost(slug);
+
+  return new ImageResponse(
+    <div
+      style={{
+        fontSize: 48,
+        background: "linear-gradient(to bottom, #1a1a1a, #333)",
+        color: "white",
+        width: "100%",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: 48,
+      }}
+    >
+      <div style={{ fontSize: 64, fontWeight: "bold" }}>{post.title}</div>
+      <div style={{ marginTop: 24, opacity: 0.8 }}>{post.description}</div>
+    </div>,
+    { ...size },
+  );
+}
+```
+
+## Custom Fonts
+
+```tsx
+import { ImageResponse } from "next/og";
+import { join } from "path";
+import { readFile } from "fs/promises";
+
+export default async function Image() {
+  const fontPath = join(process.cwd(), "assets/fonts/Inter-Bold.ttf");
+  const fontData = await readFile(fontPath);
+
+  return new ImageResponse(
+    <div style={{ fontFamily: "Inter", fontSize: 64 }}>Custom Font Text</div>,
+    {
+      width: 1200,
+      height: 630,
+      fonts: [{ name: "Inter", data: fontData, style: "normal" }],
+    },
+  );
+}
+```
+
+## File Naming
+
+- `opengraph-image.tsx` - Open Graph (Facebook, LinkedIn)
+- `twitter-image.tsx` - Twitter/X cards (optional, falls back to OG)
+
+## Styling Notes
+
+ImageResponse uses Flexbox layout:
+
+- Use `display: 'flex'`
+- No CSS Grid support
+- Styles must be inline objects
+
+## Multiple OG Images
+
+Use `generateImageMetadata` for multiple images per route:
+
+```tsx
+// app/blog/[slug]/opengraph-image.tsx
+import { ImageResponse } from "next/og";
+
+export async function generateImageMetadata({ params }) {
+  const images = await getPostImages(params.slug);
+  return images.map((img, idx) => ({
+    id: idx,
+    alt: img.alt,
+    size: { width: 1200, height: 630 },
+    contentType: "image/png",
+  }));
+}
+
+export default async function Image({ params, id }) {
+  const images = await getPostImages(params.slug);
+  const image = images[id];
+  return new ImageResponse(/* ... */);
+}
+```
+
+## Multiple Sitemaps
+
+Use `generateSitemaps` for large sites:
+
+```tsx
+// app/sitemap.ts
+import type { MetadataRoute } from "next";
+
+export async function generateSitemaps() {
+  // Return array of sitemap IDs
+  return [{ id: 0 }, { id: 1 }, { id: 2 }];
+}
+
+export default async function sitemap({
+  id,
+}: {
+  id: number;
+}): Promise<MetadataRoute.Sitemap> {
+  const start = id * 50000;
+  const end = start + 50000;
+  const products = await getProducts(start, end);
+
+  return products.map((product) => ({
+    url: `https://example.com/product/${product.id}`,
+    lastModified: product.updatedAt,
+  }));
+}
+```
+
+Generates `/sitemap/0.xml`, `/sitemap/1.xml`, etc.
diff --git a/.cursor/skills/next-best-practices/parallel-routes.md b/.cursor/skills/next-best-practices/parallel-routes.md
new file mode 100644
index 000000000..f0fe8aa0a
--- /dev/null
+++ b/.cursor/skills/next-best-practices/parallel-routes.md
@@ -0,0 +1,298 @@
+# Parallel & Intercepting Routes
+
+Parallel routes render multiple pages in the same layout. Intercepting routes show a different UI when navigating from within your app vs direct URL access. Together they enable modal patterns.
+
+## File Structure
+
+```
+app/
+├── @modal/                    # Parallel route slot
+│   ├── default.tsx            # Required! Returns null
+│   ├── (.)photos/             # Intercepts /photos/*
+│   │   └── [id]/
+│   │       └── page.tsx       # Modal content
+│   └── [...]catchall/         # Optional: catch unmatched
+│       └── page.tsx
+├── photos/
+│   └── [id]/
+│       └── page.tsx           # Full page (direct access)
+├── layout.tsx                 # Renders both children and @modal
+└── page.tsx
+```
+
+## Step 1: Root Layout with Slot
+
+```tsx
+// app/layout.tsx
+export default function RootLayout({
+  children,
+  modal,
+}: {
+  children: React.ReactNode;
+  modal: React.ReactNode;
+}) {
+  return (
+    <html>
+      <body>
+        {children}
+        {modal}
+      </body>
+    </html>
+  );
+}
+```
+
+## Step 2: Default File (Critical!)
+
+**Every parallel route slot MUST have a `default.tsx`** to prevent 404s on hard navigation.
+
+```tsx
+// app/@modal/default.tsx
+export default function Default() {
+  return null;
+}
+```
+
+Without this file, refreshing any page will 404 because Next.js can't determine what to render in the `@modal` slot.
+
+## Step 3: Intercepting Route (Modal)
+
+The `(.)` prefix intercepts routes at the same level.
+
+```tsx
+// app/@modal/(.)photos/[id]/page.tsx
+import { Modal } from "@/components/modal";
+
+export default async function PhotoModal({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  return (
+    <Modal>
+      <img src={photo.url} alt={photo.title} />
+    </Modal>
+  );
+}
+```
+
+## Step 4: Full Page (Direct Access)
+
+```tsx
+// app/photos/[id]/page.tsx
+export default async function PhotoPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  return (
+    <div className="full-page">
+      <img src={photo.url} alt={photo.title} />
+      <h1>{photo.title}</h1>
+    </div>
+  );
+}
+```
+
+## Step 5: Modal Component with Correct Closing
+
+**Critical: Use `router.back()` to close modals, NOT `router.push()` or `<Link>`.**
+
+```tsx
+// components/modal.tsx
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useCallback, useEffect, useRef } from "react";
+
+export function Modal({ children }: { children: React.ReactNode }) {
+  const router = useRouter();
+  const overlayRef = useRef<HTMLDivElement>(null);
+
+  // Close on escape key
+  useEffect(() => {
+    function onKeyDown(e: KeyboardEvent) {
+      if (e.key === "Escape") {
+        router.back(); // Correct
+      }
+    }
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [router]);
+
+  // Close on overlay click
+  const handleOverlayClick = useCallback(
+    (e: React.MouseEvent) => {
+      if (e.target === overlayRef.current) {
+        router.back(); // Correct
+      }
+    },
+    [router],
+  );
+
+  return (
+    <div
+      ref={overlayRef}
+      onClick={handleOverlayClick}
+      className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
+    >
+      <div className="mx-4 w-full max-w-2xl rounded-lg bg-white p-6">
+        <button
+          onClick={() => router.back()} // Correct!
+          className="absolute right-4 top-4"
+        >
+          Close
+        </button>
+        {children}
+      </div>
+    </div>
+  );
+}
+```
+
+### Why NOT `router.push('/')` or `<Link href="/">`?
+
+Using `push` or `Link` to "close" a modal:
+
+1. Adds a new history entry (back button shows modal again)
+2. Doesn't properly clear the intercepted route
+3. Can cause the modal to flash or persist unexpectedly
+
+`router.back()` correctly:
+
+1. Removes the intercepted route from history
+2. Returns to the previous page
+3. Properly unmounts the modal
+
+## Route Matcher Reference
+
+Matchers match **route segments**, not filesystem paths:
+
+| Matcher    | Matches       | Example                                                               |
+| ---------- | ------------- | --------------------------------------------------------------------- |
+| `(.)`      | Same level    | `@modal/(.)photos` intercepts `/photos`                               |
+| `(..)`     | One level up  | `@modal/(..)settings` from `/dashboard/@modal` intercepts `/settings` |
+| `(..)(..)` | Two levels up | Rarely used                                                           |
+| `(...)`    | From root     | `@modal/(...)photos` intercepts `/photos` from anywhere               |
+
+**Common mistake**: Thinking `(..)` means "parent folder" - it means "parent route segment".
+
+## Handling Hard Navigation
+
+When users directly visit `/photos/123` (bookmark, refresh, shared link):
+
+- The intercepting route is bypassed
+- The full `photos/[id]/page.tsx` renders
+- Modal doesn't appear (expected behavior)
+
+If you want the modal to appear on direct access too, you need additional logic:
+
+```tsx
+// app/photos/[id]/page.tsx
+import { Modal } from "@/components/modal";
+
+export default async function PhotoPage({ params }) {
+  const { id } = await params;
+  const photo = await getPhoto(id);
+
+  // Option: Render as modal on direct access too
+  return (
+    <Modal>
+      <img src={photo.url} alt={photo.title} />
+    </Modal>
+  );
+}
+```
+
+## Common Gotchas
+
+### 1. Missing `default.tsx` → 404 on Refresh
+
+Every `@slot` folder needs a `default.tsx` that returns `null` (or appropriate content).
+
+### 2. Modal Persists After Navigation
+
+You're using `router.push()` instead of `router.back()`.
+
+### 3. Nested Parallel Routes Need Defaults Too
+
+If you have `@modal` inside a route group, each level needs its own `default.tsx`:
+
+```
+app/
+├── (marketing)/
+│   ├── @modal/
+│   │   └── default.tsx     # Needed!
+│   └── layout.tsx
+└── layout.tsx
+```
+
+### 4. Intercepted Route Shows Wrong Content
+
+Check your matcher:
+
+- `(.)photos` intercepts `/photos` from the same route level
+- If your `@modal` is in `app/dashboard/@modal`, use `(.)photos` to intercept `/dashboard/photos`, not `/photos`
+
+### 5. TypeScript Errors with `params`
+
+In Next.js 15+, `params` is a Promise:
+
+```tsx
+// Correct
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+}
+```
+
+## Complete Example: Photo Gallery Modal
+
+```
+app/
+├── @modal/
+│   ├── default.tsx
+│   └── (.)photos/
+│       └── [id]/
+│           └── page.tsx
+├── photos/
+│   ├── page.tsx           # Gallery grid
+│   └── [id]/
+│       └── page.tsx       # Full photo page
+├── layout.tsx
+└── page.tsx
+```
+
+Links in the gallery:
+
+```tsx
+// app/photos/page.tsx
+import Link from "next/link";
+
+export default async function Gallery() {
+  const photos = await getPhotos();
+
+  return (
+    <div className="grid grid-cols-3 gap-4">
+      {photos.map((photo) => (
+        <Link key={photo.id} href={`/photos/${photo.id}`}>
+          <img src={photo.thumbnail} alt={photo.title} />
+        </Link>
+      ))}
+    </div>
+  );
+}
+```
+
+Clicking a photo → Modal opens (intercepted)
+Direct URL → Full page renders
+Refresh while modal open → Full page renders
diff --git a/.cursor/skills/next-best-practices/route-handlers.md b/.cursor/skills/next-best-practices/route-handlers.md
new file mode 100644
index 000000000..2b9a55070
--- /dev/null
+++ b/.cursor/skills/next-best-practices/route-handlers.md
@@ -0,0 +1,146 @@
+# Route Handlers
+
+Create API endpoints with `route.ts` files.
+
+## Basic Usage
+
+```tsx
+// app/api/users/route.ts
+export async function GET() {
+  const users = await getUsers();
+  return Response.json(users);
+}
+
+export async function POST(request: Request) {
+  const body = await request.json();
+  const user = await createUser(body);
+  return Response.json(user, { status: 201 });
+}
+```
+
+## Supported Methods
+
+`GET`, `POST`, `PUT`, `PATCH`, `DELETE`, `HEAD`, `OPTIONS`
+
+## GET Handler Conflicts with page.tsx
+
+**A `route.ts` and `page.tsx` cannot coexist in the same folder.**
+
+```
+app/
+├── api/
+│   └── users/
+│       └── route.ts    # /api/users
+└── users/
+    ├── page.tsx        # /users (page)
+    └── route.ts        # Warning: Conflicts with page.tsx!
+```
+
+If you need both a page and an API at the same path, use different paths:
+
+```
+app/
+├── users/
+│   └── page.tsx        # /users (page)
+└── api/
+    └── users/
+        └── route.ts    # /api/users (API)
+```
+
+## Environment Behavior
+
+Route handlers run in a **Server Component-like environment**:
+
+- Yes: Can use `async/await`
+- Yes: Can access `cookies()`, `headers()`
+- Yes: Can use Node.js APIs
+- No: Cannot use React hooks
+- No: Cannot use React DOM APIs
+- No: Cannot use browser APIs
+
+```tsx
+// Bad: This won't work - no React DOM in route handlers
+import { renderToString } from "react-dom/server";
+
+export async function GET() {
+  const html = renderToString(<Component />); // Error!
+  return new Response(html);
+}
+```
+
+## Dynamic Route Handlers
+
+```tsx
+// app/api/users/[id]/route.ts
+export async function GET(
+  request: Request,
+  { params }: { params: Promise<{ id: string }> },
+) {
+  const { id } = await params;
+  const user = await getUser(id);
+
+  if (!user) {
+    return Response.json({ error: "Not found" }, { status: 404 });
+  }
+
+  return Response.json(user);
+}
+```
+
+## Request Helpers
+
+```tsx
+export async function GET(request: Request) {
+  // URL and search params
+  const { searchParams } = new URL(request.url);
+  const query = searchParams.get("q");
+
+  // Headers
+  const authHeader = request.headers.get("authorization");
+
+  // Cookies (Next.js helper)
+  const cookieStore = await cookies();
+  const token = cookieStore.get("token");
+
+  return Response.json({ query, token });
+}
+```
+
+## Response Helpers
+
+```tsx
+// JSON response
+return Response.json({ data });
+
+// With status
+return Response.json({ error: "Not found" }, { status: 404 });
+
+// With headers
+return Response.json(data, {
+  headers: {
+    "Cache-Control": "max-age=3600",
+  },
+});
+
+// Redirect
+return Response.redirect(new URL("/login", request.url));
+
+// Stream
+return new Response(stream, {
+  headers: { "Content-Type": "text/event-stream" },
+});
+```
+
+## When to Use Route Handlers vs Server Actions
+
+| Use Case                 | Route Handlers | Server Actions |
+| ------------------------ | -------------- | -------------- |
+| Form submissions         | No             | Yes            |
+| Data mutations from UI   | No             | Yes            |
+| Third-party webhooks     | Yes            | No             |
+| External API consumption | Yes            | No             |
+| Public REST API          | Yes            | No             |
+| File uploads             | Both work      | Both work      |
+
+**Prefer Server Actions** for mutations triggered from your UI.
+**Use Route Handlers** for external integrations and public APIs.
diff --git a/.cursor/skills/next-best-practices/rsc-boundaries.md b/.cursor/skills/next-best-practices/rsc-boundaries.md
new file mode 100644
index 000000000..fcb1d383c
--- /dev/null
+++ b/.cursor/skills/next-best-practices/rsc-boundaries.md
@@ -0,0 +1,164 @@
+# RSC Boundaries
+
+Detect and prevent invalid patterns when crossing Server/Client component boundaries.
+
+## Detection Rules
+
+### 1. Async Client Components Are Invalid
+
+Client components **cannot** be async functions. Only Server Components can be async.
+
+**Detect:** File has `'use client'` AND component is `async function` or returns `Promise`
+
+```tsx
+// Bad: async client component
+"use client";
+export default async function UserProfile() {
+  const user = await getUser(); // Cannot await in client component
+  return <div>{user.name}</div>;
+}
+
+// Good: Remove async, fetch data in parent server component
+// page.tsx (server component - no 'use client')
+export default async function Page() {
+  const user = await getUser();
+  return <UserProfile user={user} />;
+}
+
+// UserProfile.tsx (client component)
+("use client");
+export function UserProfile({ user }: { user: User }) {
+  return <div>{user.name}</div>;
+}
+```
+
+```tsx
+// Bad: async arrow function client component
+"use client";
+const Dashboard = async () => {
+  const data = await fetchDashboard();
+  return <div>{data}</div>;
+};
+
+// Good: Fetch in server component, pass data down
+```
+
+### 2. Non-Serializable Props to Client Components
+
+Props passed from Server → Client must be JSON-serializable.
+
+**Detect:** Server component passes these to a client component:
+
+- Functions (except Server Actions with `'use server'`)
+- `Date` objects
+- `Map`, `Set`, `WeakMap`, `WeakSet`
+- Class instances
+- `Symbol` (unless globally registered)
+- Circular references
+
+```tsx
+// Bad: Function prop
+// page.tsx (server)
+export default function Page() {
+  const handleClick = () => console.log("clicked");
+  return <ClientButton onClick={handleClick} />;
+}
+
+// Good: Define function inside client component
+// ClientButton.tsx
+("use client");
+export function ClientButton() {
+  const handleClick = () => console.log("clicked");
+  return <button onClick={handleClick}>Click</button>;
+}
+```
+
+```tsx
+// Bad: Date object (silently becomes string, then crashes)
+// page.tsx (server)
+export default async function Page() {
+  const post = await getPost();
+  return <PostCard createdAt={post.createdAt} />; // Date object
+}
+
+// PostCard.tsx (client) - will crash on .getFullYear()
+("use client");
+export function PostCard({ createdAt }: { createdAt: Date }) {
+  return <span>{createdAt.getFullYear()}</span>; // Runtime error!
+}
+
+// Good: Serialize to string on server
+// page.tsx (server)
+export default async function Page() {
+  const post = await getPost();
+  return <PostCard createdAt={post.createdAt.toISOString()} />;
+}
+
+// PostCard.tsx (client)
+("use client");
+export function PostCard({ createdAt }: { createdAt: string }) {
+  const date = new Date(createdAt);
+  return <span>{date.getFullYear()}</span>;
+}
+```
+
+```tsx
+// Bad: Class instance
+const user = new UserModel(data)
+<ClientProfile user={user} /> // Methods will be stripped
+
+// Good: Pass plain object
+const user = await getUser()
+<ClientProfile user={{ id: user.id, name: user.name }} />
+```
+
+```tsx
+// Bad: Map/Set
+<ClientComponent items={new Map([['a', 1]])} />
+
+// Good: Convert to array/object
+<ClientComponent items={Object.fromEntries(map)} />
+<ClientComponent items={Array.from(set)} />
+```
+
+### 3. Server Actions Are the Exception
+
+Functions marked with `'use server'` CAN be passed to client components.
+
+```tsx
+// Valid: Server Action can be passed
+// actions.ts
+"use server";
+export async function submitForm(formData: FormData) {
+  // server-side logic
+}
+
+// page.tsx (server)
+import { submitForm } from "./actions";
+export default function Page() {
+  return <ClientForm onSubmit={submitForm} />; // OK!
+}
+
+// ClientForm.tsx (client)
+("use client");
+export function ClientForm({
+  onSubmit,
+}: {
+  onSubmit: (data: FormData) => Promise<void>;
+}) {
+  return <form action={onSubmit}>...</form>;
+}
+```
+
+## Quick Reference
+
+| Pattern                           | Valid? | Fix                                   |
+| --------------------------------- | ------ | ------------------------------------- |
+| `'use client'` + `async function` | No     | Fetch in server parent, pass data     |
+| Pass `() => {}` to client         | No     | Define in client or use server action |
+| Pass `new Date()` to client       | No     | Use `.toISOString()`                  |
+| Pass `new Map()` to client        | No     | Convert to object/array               |
+| Pass class instance to client     | No     | Pass plain object                     |
+| Pass server action to client      | Yes    | -                                     |
+| Pass `string/number/boolean`      | Yes    | -                                     |
+| Pass plain object/array           | Yes    | -                                     |
diff --git a/.cursor/skills/next-best-practices/runtime-selection.md b/.cursor/skills/next-best-practices/runtime-selection.md
new file mode 100644
index 000000000..ac8db62af
--- /dev/null
+++ b/.cursor/skills/next-best-practices/runtime-selection.md
@@ -0,0 +1,40 @@
+# Runtime Selection
+
+## Use Node.js Runtime by Default
+
+Use the default Node.js runtime for new routes and pages. Only use Edge runtime if the project already uses it or there's a specific requirement.
+
+```tsx
+// Good: Default - no runtime config needed (uses Node.js)
+export default function Page() { ... }
+
+// Caution: Only if already used in project or specifically required
+export const runtime = 'edge'
+```
+
+## When to Use Each
+
+### Node.js Runtime (Default)
+
+- Full Node.js API support
+- File system access (`fs`)
+- Full `crypto` support
+- Database connections
+- Most npm packages work
+
+### Edge Runtime
+
+- Only for specific edge-location latency requirements
+- Limited API (no `fs`, limited `crypto`)
+- Smaller cold start
+- Geographic distribution needs
+
+## Detection
+
+**Before adding `runtime = 'edge'`**, check:
+
+1. Does the project already use Edge runtime?
+2. Is there a specific latency requirement?
+3. Are all dependencies Edge-compatible?
+
+If unsure, use Node.js runtime.
diff --git a/.cursor/skills/next-best-practices/scripts.md b/.cursor/skills/next-best-practices/scripts.md
new file mode 100644
index 000000000..df3bde500
--- /dev/null
+++ b/.cursor/skills/next-best-practices/scripts.md
@@ -0,0 +1,141 @@
+# Scripts
+
+Loading third-party scripts in Next.js.
+
+## Use next/script
+
+Always use `next/script` instead of native `<script>` tags for better performance.
+
+```tsx
+// Bad: Native script tag
+<script src="https://example.com/script.js"></script>;
+
+// Good: Next.js Script component
+import Script from "next/script";
+
+<Script src="https://example.com/script.js" />;
+```
+
+## Inline Scripts Need ID
+
+Inline scripts require an `id` attribute for Next.js to track them.
+
+```tsx
+// Bad: Missing id
+<Script dangerouslySetInnerHTML={{ __html: 'console.log("hi")' }} />
+
+// Good: Has id
+<Script id="my-script" dangerouslySetInnerHTML={{ __html: 'console.log("hi")' }} />
+
+// Good: Inline with id
+<Script id="show-banner">
+  {`document.getElementById('banner').classList.remove('hidden')`}
+</Script>
+```
+
+## Don't Put Script in Head
+
+`next/script` should not be placed inside `next/head`. It handles its own positioning.
+
+```tsx
+// Bad: Script inside Head
+import Head from 'next/head'
+import Script from 'next/script'
+
+<Head>
+  <Script src="/analytics.js" />
+</Head>
+
+// Good: Script outside Head
+<Head>
+  <title>Page</title>
+</Head>
+<Script src="/analytics.js" />
+```
+
+## Loading Strategies
+
+```tsx
+// afterInteractive (default) - Load after page is interactive
+<Script src="/analytics.js" strategy="afterInteractive" />
+
+// lazyOnload - Load during idle time
+<Script src="/widget.js" strategy="lazyOnload" />
+
+// beforeInteractive - Load before page is interactive (use sparingly)
+// Only works in app/layout.tsx or pages/_document.js
+<Script src="/critical.js" strategy="beforeInteractive" />
+
+// worker - Load in web worker (experimental)
+<Script src="/heavy.js" strategy="worker" />
+```
+
+## Google Analytics
+
+Use `@next/third-parties` instead of inline GA scripts.
+
+```tsx
+// Bad: Inline GA script
+<Script src="https://www.googletagmanager.com/gtag/js?id=G-XXXXX" />
+<Script id="ga-init">
+  {`window.dataLayer = window.dataLayer || [];
+    function gtag(){dataLayer.push(arguments);}
+    gtag('js', new Date());
+    gtag('config', 'G-XXXXX');`}
+</Script>
+
+// Good: Next.js component
+import { GoogleAnalytics } from '@next/third-parties/google'
+
+export default function Layout({ children }) {
+  return (
+    <html>
+      <body>{children}</body>
+      <GoogleAnalytics gaId="G-XXXXX" />
+    </html>
+  )
+}
+```
+
+## Google Tag Manager
+
+```tsx
+import { GoogleTagManager } from "@next/third-parties/google";
+
+export default function Layout({ children }) {
+  return (
+    <html>
+      <GoogleTagManager gtmId="GTM-XXXXX" />
+      <body>{children}</body>
+    </html>
+  );
+}
+```
+
+## Other Third-Party Scripts
+
+```tsx
+// YouTube embed
+import { YouTubeEmbed } from "@next/third-parties/google";
+
+<YouTubeEmbed videoid="dQw4w9WgXcQ" />;
+
+// Google Maps
+import { GoogleMapsEmbed } from "@next/third-parties/google";
+
+<GoogleMapsEmbed
+  apiKey="YOUR_API_KEY"
+  mode="place"
+  q="Brooklyn+Bridge,New+York,NY"
+/>;
+```
+
+## Quick Reference
+
+| Pattern                                       | Issue                      | Fix                       |
+| --------------------------------------------- | -------------------------- | ------------------------- |
+| `<script src="...">`                          | No optimization            | Use `next/script`         |
+| `<Script>` without id                         | Can't track inline scripts | Add `id` attribute        |
+| `<Script>` inside `<Head>`                    | Wrong placement            | Move outside Head         |
+| Inline GA/GTM scripts                         | No optimization            | Use `@next/third-parties` |
+| `strategy="beforeInteractive"` outside layout | Won't work                 | Only use in root layout   |
diff --git a/.cursor/skills/next-best-practices/self-hosting.md b/.cursor/skills/next-best-practices/self-hosting.md
new file mode 100644
index 000000000..de765d6d1
--- /dev/null
+++ b/.cursor/skills/next-best-practices/self-hosting.md
@@ -0,0 +1,384 @@
+# Self-Hosting Next.js
+
+Deploy Next.js outside of Vercel with confidence.
+
+## Quick Start: Standalone Output
+
+For Docker or any containerized deployment, use standalone output:
+
+```js
+// next.config.js
+module.exports = {
+  output: "standalone",
+};
+```
+
+This creates a minimal `standalone` folder with only production dependencies:
+
+```
+.next/
+├── standalone/
+│   ├── server.js          # Entry point
+│   ├── node_modules/      # Only production deps
+│   └── .next/             # Build output
+└── static/                # Must be copied separately
+```
+
+## Docker Deployment
+
+### Dockerfile
+
+```dockerfile
+FROM node:20-alpine AS base
+
+# Install dependencies
+FROM base AS deps
+WORKDIR /app
+COPY package.json package-lock.json* ./
+RUN npm ci
+
+# Build
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+RUN npm run build
+
+# Production
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV=production
+
+# Create non-root user
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+# Copy standalone output
+COPY --from=builder /app/.next/standalone ./
+COPY --from=builder /app/.next/static ./.next/static
+COPY --from=builder /app/public ./public
+
+USER nextjs
+
+EXPOSE 3000
+ENV PORT=3000
+ENV HOSTNAME="0.0.0.0"
+
+CMD ["node", "server.js"]
+```
+
+### Docker Compose
+
+```yaml
+version: "3.8"
+
+services:
+  web:
+    build: .
+    ports:
+      - "3000:3000"
+    environment:
+      - NODE_ENV=production
+    restart: unless-stopped
+    healthcheck:
+      test:
+        ["CMD", "wget", "-q", "--spider", "http://localhost:3000/api/health"]
+      interval: 30s
+      timeout: 10s
+      retries: 3
+```
+
+## PM2 Deployment
+
+For traditional server deployments:
+
+```js
+// ecosystem.config.js
+module.exports = {
+  apps: [
+    {
+      name: "nextjs",
+      script: ".next/standalone/server.js",
+      instances: "max",
+      exec_mode: "cluster",
+      env: {
+        NODE_ENV: "production",
+        PORT: 3000,
+      },
+    },
+  ],
+};
+```
+
+```bash
+npm run build
+pm2 start ecosystem.config.js
+```
+
+## ISR and Cache Handlers
+
+### The Problem
+
+ISR (Incremental Static Regeneration) uses filesystem caching by default. This **breaks with multiple instances**:
+
+- Instance A regenerates page → saves to its local disk
+- Instance B serves stale page → doesn't see Instance A's cache
+- Load balancer sends users to random instances → inconsistent content
+
+### Solution: Custom Cache Handler
+
+Next.js 14+ supports custom cache handlers for shared storage:
+
+```js
+// next.config.js
+module.exports = {
+  cacheHandler: require.resolve("./cache-handler.js"),
+  cacheMaxMemorySize: 0, // Disable in-memory cache
+};
+```
+
+#### Redis Cache Handler Example
+
+```js
+// cache-handler.js
+const Redis = require("ioredis");
+
+const redis = new Redis(process.env.REDIS_URL);
+const CACHE_PREFIX = "nextjs:";
+
+module.exports = class CacheHandler {
+  constructor(options) {
+    this.options = options;
+  }
+
+  async get(key) {
+    const data = await redis.get(CACHE_PREFIX + key);
+    if (!data) return null;
+
+    const parsed = JSON.parse(data);
+    return {
+      value: parsed.value,
+      lastModified: parsed.lastModified,
+    };
+  }
+
+  async set(key, data, ctx) {
+    const cacheData = {
+      value: data,
+      lastModified: Date.now(),
+    };
+
+    // Set TTL based on revalidate option
+    if (ctx?.revalidate) {
+      await redis.setex(
+        CACHE_PREFIX + key,
+        ctx.revalidate,
+        JSON.stringify(cacheData),
+      );
+    } else {
+      await redis.set(CACHE_PREFIX + key, JSON.stringify(cacheData));
+    }
+  }
+
+  async revalidateTag(tags) {
+    // Implement tag-based invalidation
+    // This requires tracking which keys have which tags
+  }
+};
+```
+
+#### S3 Cache Handler Example
+
+```js
+// cache-handler.js
+const {
+  S3Client,
+  GetObjectCommand,
+  PutObjectCommand,
+} = require("@aws-sdk/client-s3");
+
+const s3 = new S3Client({ region: process.env.AWS_REGION });
+const BUCKET = process.env.CACHE_BUCKET;
+
+module.exports = class CacheHandler {
+  async get(key) {
+    try {
+      const response = await s3.send(
+        new GetObjectCommand({
+          Bucket: BUCKET,
+          Key: `cache/${key}`,
+        }),
+      );
+      const body = await response.Body.transformToString();
+      return JSON.parse(body);
+    } catch (err) {
+      if (err.name === "NoSuchKey") return null;
+      throw err;
+    }
+  }
+
+  async set(key, data, ctx) {
+    await s3.send(
+      new PutObjectCommand({
+        Bucket: BUCKET,
+        Key: `cache/${key}`,
+        Body: JSON.stringify({
+          value: data,
+          lastModified: Date.now(),
+        }),
+        ContentType: "application/json",
+      }),
+    );
+  }
+};
+```
+
+## What Works vs What Needs Setup
+
+| Feature              | Single Instance | Multi-Instance      | Notes                       |
+| -------------------- | --------------- | ------------------- | --------------------------- |
+| SSR                  | Yes             | Yes                 | No special setup            |
+| SSG                  | Yes             | Yes                 | Built at deploy time        |
+| ISR                  | Yes             | Needs cache handler | Filesystem cache breaks     |
+| Image Optimization   | Yes             | Yes                 | CPU-intensive, consider CDN |
+| Middleware           | Yes             | Yes                 | Runs on Node.js             |
+| Edge Runtime         | Limited         | Limited             | Some features Node-only     |
+| `revalidatePath/Tag` | Yes             | Needs cache handler | Must share cache            |
+| `next/font`          | Yes             | Yes                 | Fonts bundled at build      |
+| Draft Mode           | Yes             | Yes                 | Cookie-based                |
+
+## Image Optimization
+
+Next.js Image Optimization works out of the box but is CPU-intensive.
+
+### Option 1: Built-in (Simple)
+
+Works automatically, but consider:
+
+- Set `deviceSizes` and `imageSizes` in config to limit variants
+- Use `minimumCacheTTL` to reduce regeneration
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    minimumCacheTTL: 60 * 60 * 24, // 24 hours
+    deviceSizes: [640, 750, 1080, 1920], // Limit sizes
+  },
+};
+```
+
+### Option 2: External Loader (Recommended for Scale)
+
+Offload to Cloudinary, Imgix, or similar:
+
+```js
+// next.config.js
+module.exports = {
+  images: {
+    loader: "custom",
+    loaderFile: "./lib/image-loader.js",
+  },
+};
+```
+
+```js
+// lib/image-loader.js
+export default function cloudinaryLoader({ src, width, quality }) {
+  const params = ["f_auto", "c_limit", `w_${width}`, `q_${quality || "auto"}`];
+  return `https://res.cloudinary.com/demo/image/upload/${params.join(",")}${src}`;
+}
+```
+
+## Environment Variables
+
+### Build-time vs Runtime
+
+```js
+// Available at build time only (baked into bundle)
+NEXT_PUBLIC_API_URL=https://api.example.com
+
+// Available at runtime (server-side only)
+DATABASE_URL=postgresql://...
+API_SECRET=...
+```
+
+### Runtime Configuration
+
+For truly dynamic config, don't use `NEXT_PUBLIC_*`. Instead:
+
+```tsx
+// app/api/config/route.ts
+export async function GET() {
+  return Response.json({
+    apiUrl: process.env.API_URL,
+    features: process.env.FEATURES?.split(","),
+  });
+}
+```
+
+## OpenNext: Serverless Without Vercel
+
+[OpenNext](https://open-next.js.org/) adapts Next.js for AWS Lambda, Cloudflare Workers, etc.
+
+```bash
+npx create-sst@latest
+# or
+npx @opennextjs/aws build
+```
+
+Supports:
+
+- AWS Lambda + CloudFront
+- Cloudflare Workers
+- Netlify Functions
+- Deno Deploy
+
+## Health Check Endpoint
+
+Always include a health check for load balancers:
+
+```tsx
+// app/api/health/route.ts
+export async function GET() {
+  try {
+    // Optional: check database connection
+    // await db.$queryRaw`SELECT 1`;
+
+    return Response.json({ status: "healthy" }, { status: 200 });
+  } catch (error) {
+    return Response.json({ status: "unhealthy" }, { status: 503 });
+  }
+}
+```
+
+## Pre-Deployment Checklist
+
+1. **Build locally first**: `npm run build` - catch errors before deploy
+2. **Test standalone output**: `node .next/standalone/server.js`
+3. **Set `output: 'standalone'`** for Docker
+4. **Configure cache handler** for multi-instance ISR
+5. **Set `HOSTNAME="0.0.0.0"`** for containers
+6. **Copy `public/` and `.next/static/`** - not included in standalone
+7. **Add health check endpoint**
+8. **Test ISR revalidation** after deployment
+9. **Monitor memory usage** - Node.js defaults may need tuning
+
+## Testing Cache Handler
+
+**Critical**: Test your cache handler on every Next.js upgrade:
+
+```bash
+# Start multiple instances
+PORT=3001 node .next/standalone/server.js &
+PORT=3002 node .next/standalone/server.js &
+
+# Trigger ISR revalidation
+curl http://localhost:3001/api/revalidate?path=/posts
+
+# Verify both instances see the update
+curl http://localhost:3001/posts
+curl http://localhost:3002/posts
+# Should return identical content
+```
diff --git a/.cursor/skills/next-best-practices/suspense-boundaries.md b/.cursor/skills/next-best-practices/suspense-boundaries.md
new file mode 100644
index 000000000..20191bd4d
--- /dev/null
+++ b/.cursor/skills/next-best-practices/suspense-boundaries.md
@@ -0,0 +1,67 @@
+# Suspense Boundaries
+
+Client hooks that cause CSR bailout without Suspense boundaries.
+
+## useSearchParams
+
+Always requires Suspense boundary in static routes. Without it, the entire page becomes client-side rendered.
+
+```tsx
+// Bad: Entire page becomes CSR
+"use client";
+
+import { useSearchParams } from "next/navigation";
+
+export default function SearchBar() {
+  const searchParams = useSearchParams();
+  return <div>Query: {searchParams.get("q")}</div>;
+}
+```
+
+```tsx
+// Good: Wrap in Suspense
+import { Suspense } from "react";
+import SearchBar from "./search-bar";
+
+export default function Page() {
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <SearchBar />
+    </Suspense>
+  );
+}
+```
+
+## usePathname
+
+Requires Suspense boundary when route has dynamic parameters.
+
+```tsx
+// In dynamic route [slug]
+// Bad: No Suspense
+"use client";
+import { usePathname } from "next/navigation";
+
+export function Breadcrumb() {
+  const pathname = usePathname();
+  return <nav>{pathname}</nav>;
+}
+```
+
+```tsx
+// Good: Wrap in Suspense
+<Suspense fallback={<BreadcrumbSkeleton />}>
+  <Breadcrumb />
+</Suspense>
+```
+
+If you use `generateStaticParams`, Suspense is optional.
+
+## Quick Reference
+
+| Hook                | Suspense Required    |
+| ------------------- | -------------------- |
+| `useSearchParams()` | Yes                  |
+| `usePathname()`     | Yes (dynamic routes) |
+| `useParams()`       | No                   |
+| `useRouter()`       | No                   |
diff --git a/.cursor/skills/next-cache-components/SKILL.md b/.cursor/skills/next-cache-components/SKILL.md
new file mode 100644
index 000000000..f94984767
--- /dev/null
+++ b/.cursor/skills/next-cache-components/SKILL.md
@@ -0,0 +1,363 @@
+---
+name: next-cache-components
+description: Next.js 16 Cache Components - PPR, use cache directive, cacheLife, cacheTag, updateTag
+---
+
+# Cache Components (Next.js 16+)
+
+Cache Components enable Partial Prerendering (PPR) - mix static, cached, and dynamic content in a single route.
+
+## Enable Cache Components
+
+```ts
+// next.config.ts
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  cacheComponents: true,
+};
+
+export default nextConfig;
+```
+
+This replaces the old `experimental.ppr` flag.
+
+---
+
+## Three Content Types
+
+With Cache Components enabled, content falls into three categories:
+
+### 1. Static (Auto-Prerendered)
+
+Synchronous code, imports, pure computations - prerendered at build time:
+
+```tsx
+export default function Page() {
+  return (
+    <header>
+      <h1>Our Blog</h1> {/* Static - instant */}
+      <nav>...</nav>
+    </header>
+  );
+}
+```
+
+### 2. Cached (`use cache`)
+
+Async data that doesn't need fresh fetches every request:
+
+```tsx
+async function BlogPosts() {
+  "use cache";
+  cacheLife("hours");
+
+  const posts = await db.posts.findMany();
+  return <PostList posts={posts} />;
+}
+```
+
+### 3. Dynamic (Suspense)
+
+Runtime data that must be fresh - wrap in Suspense:
+
+```tsx
+import { Suspense } from "react";
+
+export default function Page() {
+  return (
+    <>
+      <BlogPosts /> {/* Cached */}
+      <Suspense fallback={<p>Loading...</p>}>
+        <UserPreferences /> {/* Dynamic - streams in */}
+      </Suspense>
+    </>
+  );
+}
+
+async function UserPreferences() {
+  const theme = (await cookies()).get("theme")?.value;
+  return <p>Theme: {theme}</p>;
+}
+```
+
+---
+
+## `use cache` Directive
+
+### File Level
+
+```tsx
+"use cache";
+
+export default async function Page() {
+  // Entire page is cached
+  const data = await fetchData();
+  return <div>{data}</div>;
+}
+```
+
+### Component Level
+
+```tsx
+export async function CachedComponent() {
+  "use cache";
+  const data = await fetchData();
+  return <div>{data}</div>;
+}
+```
+
+### Function Level
+
+```tsx
+export async function getData() {
+  "use cache";
+  return db.query("SELECT * FROM posts");
+}
+```
+
+---
+
+## Cache Profiles
+
+### Built-in Profiles
+
+```tsx
+"use cache"; // Default: 5m stale, 15m revalidate
+```
+
+```tsx
+"use cache: remote"; // Platform-provided cache (Redis, KV)
+```
+
+```tsx
+"use cache: private"; // For compliance, allows runtime APIs
+```
+
+### `cacheLife()` - Custom Lifetime
+
+```tsx
+import { cacheLife } from "next/cache";
+
+async function getData() {
+  "use cache";
+  cacheLife("hours"); // Built-in profile
+  return fetch("/api/data");
+}
+```
+
+Built-in profiles: `'default'`, `'minutes'`, `'hours'`, `'days'`, `'weeks'`, `'max'`
+
+### Inline Configuration
+
+```tsx
+async function getData() {
+  "use cache";
+  cacheLife({
+    stale: 3600, // 1 hour - serve stale while revalidating
+    revalidate: 7200, // 2 hours - background revalidation interval
+    expire: 86400, // 1 day - hard expiration
+  });
+  return fetch("/api/data");
+}
+```
+
+---
+
+## Cache Invalidation
+
+### `cacheTag()` - Tag Cached Content
+
+```tsx
+import { cacheTag } from "next/cache";
+
+async function getProducts() {
+  "use cache";
+  cacheTag("products");
+  return db.products.findMany();
+}
+
+async function getProduct(id: string) {
+  "use cache";
+  cacheTag("products", `product-${id}`);
+  return db.products.findUnique({ where: { id } });
+}
+```
+
+### `updateTag()` - Immediate Invalidation
+
+Use when you need the cache refreshed within the same request:
+
+```tsx
+"use server";
+
+import { updateTag } from "next/cache";
+
+export async function updateProduct(id: string, data: FormData) {
+  await db.products.update({ where: { id }, data });
+  updateTag(`product-${id}`); // Immediate - same request sees fresh data
+}
+```
+
+### `revalidateTag()` - Background Revalidation
+
+Use for stale-while-revalidate behavior:
+
+```tsx
+"use server";
+
+import { revalidateTag } from "next/cache";
+
+export async function createPost(data: FormData) {
+  await db.posts.create({ data });
+  revalidateTag("posts"); // Background - next request sees fresh data
+}
+```
+
+---
+
+## Runtime Data Constraint
+
+**Cannot** access `cookies()`, `headers()`, or `searchParams` inside `use cache`.
+
+### Solution: Pass as Arguments
+
+```tsx
+// Wrong - runtime API inside use cache
+async function CachedProfile() {
+  "use cache";
+  const session = (await cookies()).get("session")?.value; // Error!
+  return <div>{session}</div>;
+}
+
+// Correct - extract outside, pass as argument
+async function ProfilePage() {
+  const session = (await cookies()).get("session")?.value;
+  return <CachedProfile sessionId={session} />;
+}
+
+async function CachedProfile({ sessionId }: { sessionId: string }) {
+  "use cache";
+  // sessionId becomes part of cache key automatically
+  const data = await fetchUserData(sessionId);
+  return <div>{data.name}</div>;
+}
+```
+
+### Exception: `use cache: private`
+
+For compliance requirements when you can't refactor:
+
+```tsx
+async function getData() {
+  "use cache: private";
+  const session = (await cookies()).get("session")?.value; // Allowed
+  return fetchData(session);
+}
+```
+
+---
+
+## Cache Key Generation
+
+Cache keys are automatic based on:
+
+- **Build ID** - invalidates all caches on deploy
+- **Function ID** - hash of function location
+- **Serializable arguments** - props become part of key
+- **Closure variables** - outer scope values included
+
+```tsx
+async function Component({ userId }: { userId: string }) {
+  const getData = async (filter: string) => {
+    "use cache";
+    // Cache key = userId (closure) + filter (argument)
+    return fetch(`/api/users/${userId}?filter=${filter}`);
+  };
+  return getData("active");
+}
+```
+
+---
+
+## Complete Example
+
+```tsx
+import { Suspense } from "react";
+import { cookies } from "next/headers";
+import { cacheLife, cacheTag } from "next/cache";
+
+export default function DashboardPage() {
+  return (
+    <>
+      {/* Static shell - instant from CDN */}
+      <header>
+        <h1>Dashboard</h1>
+      </header>
+      <nav>...</nav>
+
+      {/* Cached - fast, revalidates hourly */}
+      <Stats />
+
+      {/* Dynamic - streams in with fresh data */}
+      <Suspense fallback={<NotificationsSkeleton />}>
+        <Notifications />
+      </Suspense>
+    </>
+  );
+}
+
+async function Stats() {
+  "use cache";
+  cacheLife("hours");
+  cacheTag("dashboard-stats");
+
+  const stats = await db.stats.aggregate();
+  return <StatsDisplay stats={stats} />;
+}
+
+async function Notifications() {
+  const userId = (await cookies()).get("userId")?.value;
+  const notifications = await db.notifications.findMany({
+    where: { userId, read: false },
+  });
+  return <NotificationList items={notifications} />;
+}
+```
+
+---
+
+## Migration from Previous Versions
+
+| Old Config                  | Replacement                        |
+| --------------------------- | ---------------------------------- |
+| `experimental.ppr`          | `cacheComponents: true`            |
+| `dynamic = 'force-dynamic'` | Remove (default behavior)          |
+| `dynamic = 'force-static'`  | `'use cache'` + `cacheLife('max')` |
+| `revalidate = N`            | `cacheLife({ revalidate: N })`     |
+| `unstable_cache()`          | `'use cache'` directive            |
+
+---
+
+## Limitations
+
+- **Edge runtime not supported** - requires Node.js
+- **Static export not supported** - needs server
+- **Non-deterministic values** (`Math.random()`, `Date.now()`) execute once at build time inside `use cache`
+
+For request-time randomness outside cache:
+
+```tsx
+import { connection } from "next/server";
+
+async function DynamicContent() {
+  await connection(); // Defer to request time
+  const id = crypto.randomUUID(); // Different per request
+  return <div>{id}</div>;
+}
+```
+
+Sources:
+
+- [Cache Components Guide](https://nextjs.org/docs/app/getting-started/cache-components)
+- [use cache Directive](https://nextjs.org/docs/app/api-reference/directives/use-cache)
diff --git a/.cursor/skills/projects b/.cursor/skills/projects
deleted file mode 120000
index 21b8af1f9..000000000
--- a/.cursor/skills/projects
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/projects
\ No newline at end of file
diff --git a/.cursor/skills/railway-docs b/.cursor/skills/railway-docs
deleted file mode 120000
index c6a23ffb1..000000000
--- a/.cursor/skills/railway-docs
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/railway-docs
\ No newline at end of file
diff --git a/.cursor/skills/service b/.cursor/skills/service
deleted file mode 120000
index 057548971..000000000
--- a/.cursor/skills/service
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/service
\ No newline at end of file
diff --git a/.cursor/skills/status b/.cursor/skills/status
deleted file mode 120000
index ed1a999b4..000000000
--- a/.cursor/skills/status
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/status
\ No newline at end of file
diff --git a/.cursor/skills/templates b/.cursor/skills/templates
deleted file mode 120000
index 5ec92cf5a..000000000
--- a/.cursor/skills/templates
+++ /dev/null
@@ -1 +0,0 @@
-../../.agents/skills/templates
\ No newline at end of file
diff --git a/.cursor/skills/vercel-composition-patterns/AGENTS.md b/.cursor/skills/vercel-composition-patterns/AGENTS.md
new file mode 100644
index 000000000..7c3202d0e
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/AGENTS.md
@@ -0,0 +1,951 @@
+# React Composition Patterns
+
+**Version 1.0.0**  
+Engineering  
+January 2026
+
+> **Note:**  
+> This document is mainly for agents and LLMs to follow when maintaining,  
+> generating, or refactoring React codebases using composition. Humans  
+> may also find it useful, but guidance here is optimized for automation  
+> and consistency by AI-assisted workflows.
+
+---
+
+## Abstract
+
+Composition patterns for building flexible, maintainable React components. Avoid boolean prop proliferation by using compound components, lifting state, and composing internals. These patterns make codebases easier for both humans and AI agents to work with as they scale.
+
+---
+
+## Table of Contents
+
+1. [Component Architecture](#1-component-architecture) — **HIGH**
+   - 1.1 [Avoid Boolean Prop Proliferation](#11-avoid-boolean-prop-proliferation)
+   - 1.2 [Use Compound Components](#12-use-compound-components)
+2. [State Management](#2-state-management) — **MEDIUM**
+   - 2.1 [Decouple State Management from UI](#21-decouple-state-management-from-ui)
+   - 2.2 [Define Generic Context Interfaces for Dependency Injection](#22-define-generic-context-interfaces-for-dependency-injection)
+   - 2.3 [Lift State into Provider Components](#23-lift-state-into-provider-components)
+3. [Implementation Patterns](#3-implementation-patterns) — **MEDIUM**
+   - 3.1 [Create Explicit Component Variants](#31-create-explicit-component-variants)
+   - 3.2 [Prefer Composing Children Over Render Props](#32-prefer-composing-children-over-render-props)
+4. [React 19 APIs](#4-react-19-apis) — **MEDIUM**
+   - 4.1 [React 19 API Changes](#41-react-19-api-changes)
+
+---
+
+## 1. Component Architecture
+
+**Impact: HIGH**
+
+Fundamental patterns for structuring components to avoid prop
+proliferation and enable flexible composition.
+
+### 1.1 Avoid Boolean Prop Proliferation
+
+**Impact: CRITICAL (prevents unmaintainable component variants)**
+
+Don't add boolean props like `isThread`, `isEditing`, `isDMThread` to customize
+
+component behavior. Each boolean doubles possible states and creates
+
+unmaintainable conditional logic. Use composition instead.
+
+**Incorrect: boolean props create exponential complexity**
+
+```tsx
+function Composer({
+  onSubmit,
+  isThread,
+  channelId,
+  isDMThread,
+  dmId,
+  isEditing,
+  isForwarding,
+}: Props) {
+  return (
+    <form>
+      <Header />
+      <Input />
+      {isDMThread ? (
+        <AlsoSendToDMField id={dmId} />
+      ) : isThread ? (
+        <AlsoSendToChannelField id={channelId} />
+      ) : null}
+      {isEditing ? (
+        <EditActions />
+      ) : isForwarding ? (
+        <ForwardActions />
+      ) : (
+        <DefaultActions />
+      )}
+      <Footer onSubmit={onSubmit} />
+    </form>
+  );
+}
+```
+
+**Correct: composition eliminates conditionals**
+
+```tsx
+// Channel composer
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Attachments />
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Thread composer - adds "also send to channel" field
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <AlsoSendToChannelField id={channelId} />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Edit composer - different footer actions
+function EditComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.CancelEdit />
+        <Composer.SaveEdit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+```
+
+Each variant is explicit about what it renders. We can share internals without
+
+sharing a single monolithic parent.
+
+### 1.2 Use Compound Components
+
+**Impact: HIGH (enables flexible composition without prop drilling)**
+
+Structure complex components as compound components with a shared context. Each
+
+subcomponent accesses shared state via context, not props. Consumers compose the
+
+pieces they need.
+
+**Incorrect: monolithic component with render props**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+  showAttachments,
+  showFormatting,
+  showEmojis,
+}: Props) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {showAttachments && <Attachments />}
+      {renderFooter ? (
+        renderFooter()
+      ) : (
+        <Footer>
+          {showFormatting && <Formatting />}
+          {showEmojis && <Emojis />}
+          {renderActions?.()}
+        </Footer>
+      )}
+    </form>
+  );
+}
+```
+
+**Correct: compound components with shared context**
+
+```tsx
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+
+function ComposerProvider({ children, state, actions, meta }: ProviderProps) {
+  return (
+    <ComposerContext value={{ state, actions, meta }}>
+      {children}
+    </ComposerContext>
+  );
+}
+
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta: { inputRef },
+  } = use(ComposerContext);
+  return (
+    <TextInput
+      ref={inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+
+function ComposerSubmit() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Send</Button>;
+}
+
+// Export as compound component
+const Composer = {
+  Provider: ComposerProvider,
+  Frame: ComposerFrame,
+  Input: ComposerInput,
+  Submit: ComposerSubmit,
+  Header: ComposerHeader,
+  Footer: ComposerFooter,
+  Attachments: ComposerAttachments,
+  Formatting: ComposerFormatting,
+  Emojis: ComposerEmojis,
+};
+```
+
+**Usage:**
+
+```tsx
+<Composer.Provider state={state} actions={actions} meta={meta}>
+  <Composer.Frame>
+    <Composer.Header />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Submit />
+    </Composer.Footer>
+  </Composer.Frame>
+</Composer.Provider>
+```
+
+Consumers explicitly compose exactly what they need. No hidden conditionals. And the state, actions and meta are dependency-injected by a parent provider, allowing multiple usages of the same component structure.
+
+---
+
+## 2. State Management
+
+**Impact: MEDIUM**
+
+Patterns for lifting state and managing shared context across
+composed components.
+
+### 2.1 Decouple State Management from UI
+
+**Impact: MEDIUM (enables swapping state implementations without changing UI)**
+
+The provider component should be the only place that knows how state is managed.
+
+UI components consume the context interface—they don't know if state comes from
+
+useState, Zustand, or a server sync.
+
+**Incorrect: UI coupled to state implementation**
+
+```tsx
+function ChannelComposer({ channelId }: { channelId: string }) {
+  // UI component knows about global state implementation
+  const state = useGlobalChannelState(channelId);
+  const { submit, updateInput } = useChannelSync(channelId);
+
+  return (
+    <Composer.Frame>
+      <Composer.Input
+        value={state.input}
+        onChange={(text) => sync.updateInput(text)}
+      />
+      <Composer.Submit onPress={() => sync.submit()} />
+    </Composer.Frame>
+  );
+}
+```
+
+**Correct: state management isolated in provider**
+
+```tsx
+// Provider handles all state management details
+function ChannelProvider({
+  channelId,
+  children,
+}: {
+  channelId: string;
+  children: React.ReactNode;
+}) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update, submit }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// UI component only knows about the context interface
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Usage
+function Channel({ channelId }: { channelId: string }) {
+  return (
+    <ChannelProvider channelId={channelId}>
+      <ChannelComposer />
+    </ChannelProvider>
+  );
+}
+```
+
+**Different providers, same UI:**
+
+```tsx
+// Local state for ephemeral forms
+function ForwardMessageProvider({ children }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// Global synced state for channels
+function ChannelProvider({ channelId, children }) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+
+  return (
+    <Composer.Provider state={state} actions={{ update, submit }}>
+      {children}
+    </Composer.Provider>
+  );
+}
+```
+
+The same `Composer.Input` component works with both providers because it only
+
+depends on the context interface, not the implementation.
+
+### 2.2 Define Generic Context Interfaces for Dependency Injection
+
+**Impact: HIGH (enables dependency-injectable state across use-cases)**
+
+Define a **generic interface** for your component context with three parts:
+
+`state`, `actions`, and `meta`. This interface is a contract that any provider
+
+can implement—enabling the same UI components to work with completely different
+
+state implementations.
+
+**Core principle:** Lift state, compose internals, make state
+
+dependency-injectable.
+
+**Incorrect: UI coupled to specific state implementation**
+
+```tsx
+function ComposerInput() {
+  // Tightly coupled to a specific hook
+  const { input, setInput } = useChannelComposerState();
+  return <TextInput value={input} onChangeText={setInput} />;
+}
+```
+
+**Correct: generic interface enables dependency injection**
+
+```tsx
+// Define a GENERIC interface that any provider can implement
+interface ComposerState {
+  input: string;
+  attachments: Attachment[];
+  isSubmitting: boolean;
+}
+
+interface ComposerActions {
+  update: (updater: (state: ComposerState) => ComposerState) => void;
+  submit: () => void;
+}
+
+interface ComposerMeta {
+  inputRef: React.RefObject<TextInput>;
+}
+
+interface ComposerContextValue {
+  state: ComposerState;
+  actions: ComposerActions;
+  meta: ComposerMeta;
+}
+
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+```
+
+**UI components consume the interface, not the implementation:**
+
+```tsx
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta,
+  } = use(ComposerContext);
+
+  // This component works with ANY provider that implements the interface
+  return (
+    <TextInput
+      ref={meta.inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+```
+
+**Different providers implement the same interface:**
+
+```tsx
+// Provider A: Local state for ephemeral forms
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const inputRef = useRef(null);
+  const submit = useForwardMessage();
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update: setState, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+
+// Provider B: Global synced state for channels
+function ChannelProvider({ channelId, children }: Props) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+```
+
+**The same composed UI works with both:**
+
+```tsx
+// Works with ForwardMessageProvider (local state)
+<ForwardMessageProvider>
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ForwardMessageProvider>
+
+// Works with ChannelProvider (global synced state)
+<ChannelProvider channelId="abc">
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ChannelProvider>
+```
+
+**Custom UI outside the component can access state and actions:**
+
+```tsx
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        {/* The composer UI */}
+        <Composer.Frame>
+          <Composer.Input placeholder="Add a message, if you'd like." />
+          <Composer.Footer>
+            <Composer.Formatting />
+            <Composer.Emojis />
+          </Composer.Footer>
+        </Composer.Frame>
+
+        {/* Custom UI OUTSIDE the composer, but INSIDE the provider */}
+        <MessagePreview />
+
+        {/* Actions at the bottom of the dialog */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+// This button lives OUTSIDE Composer.Frame but can still submit based on its context!
+function ForwardButton() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Forward</Button>;
+}
+
+// This preview lives OUTSIDE Composer.Frame but can read composer's state!
+function MessagePreview() {
+  const { state } = use(ComposerContext);
+  return <Preview message={state.input} attachments={state.attachments} />;
+}
+```
+
+The provider boundary is what matters—not the visual nesting. Components that
+
+need shared state don't have to be inside the `Composer.Frame`. They just need
+
+to be within the provider.
+
+The `ForwardButton` and `MessagePreview` are not visually inside the composer
+
+box, but they can still access its state and actions. This is the power of
+
+lifting state into providers.
+
+The UI is reusable bits you compose together. The state is dependency-injected
+
+by the provider. Swap the provider, keep the UI.
+
+### 2.3 Lift State into Provider Components
+
+**Impact: HIGH (enables state sharing outside component boundaries)**
+
+Move state management into dedicated provider components. This allows sibling
+
+components outside the main UI to access and modify state without prop drilling
+
+or awkward refs.
+
+**Incorrect: state trapped inside component**
+
+```tsx
+function ForwardMessageComposer() {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer />
+    </Composer.Frame>
+  );
+}
+
+// Problem: How does this button access composer state?
+function ForwardMessageDialog() {
+  return (
+    <Dialog>
+      <ForwardMessageComposer />
+      <MessagePreview /> {/* Needs composer state */}
+      <DialogActions>
+        <CancelButton />
+        <ForwardButton /> {/* Needs to call submit */}
+      </DialogActions>
+    </Dialog>
+  );
+}
+```
+
+**Incorrect: useEffect to sync state up**
+
+```tsx
+function ForwardMessageDialog() {
+  const [input, setInput] = useState("");
+  return (
+    <Dialog>
+      <ForwardMessageComposer onInputChange={setInput} />
+      <MessagePreview input={input} />
+    </Dialog>
+  );
+}
+
+function ForwardMessageComposer({ onInputChange }) {
+  const [state, setState] = useState(initialState);
+  useEffect(() => {
+    onInputChange(state.input); // Sync on every change 😬
+  }, [state.input]);
+}
+```
+
+**Incorrect: reading state from ref on submit**
+
+```tsx
+function ForwardMessageDialog() {
+  const stateRef = useRef(null);
+  return (
+    <Dialog>
+      <ForwardMessageComposer stateRef={stateRef} />
+      <ForwardButton onPress={() => submit(stateRef.current)} />
+    </Dialog>
+  );
+}
+```
+
+**Correct: state lifted to provider**
+
+```tsx
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        <ForwardMessageComposer />
+        <MessagePreview />{" "}
+        {/* Custom components can access state and actions */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />{" "}
+          {/* Custom components can access state and actions */}
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+function ForwardButton() {
+  const { actions } = use(Composer.Context);
+  return <Button onPress={actions.submit}>Forward</Button>;
+}
+```
+
+The ForwardButton lives outside the Composer.Frame but still has access to the
+
+submit action because it's within the provider. Even though it's a one-off
+
+component, it can still access the composer's state and actions from outside the
+
+UI itself.
+
+**Key insight:** Components that need shared state don't have to be visually
+
+nested inside each other—they just need to be within the same provider.
+
+---
+
+## 3. Implementation Patterns
+
+**Impact: MEDIUM**
+
+Specific techniques for implementing compound components and
+context providers.
+
+### 3.1 Create Explicit Component Variants
+
+**Impact: MEDIUM (self-documenting code, no hidden conditionals)**
+
+Instead of one component with many boolean props, create explicit variant
+
+components. Each variant composes the pieces it needs. The code documents
+
+itself.
+
+**Incorrect: one component, many modes**
+
+```tsx
+// What does this component actually render?
+<Composer
+  isThread
+  isEditing={false}
+  channelId="abc"
+  showAttachments
+  showFormatting={false}
+/>
+```
+
+**Correct: explicit variants**
+
+```tsx
+// Immediately clear what this renders
+<ThreadComposer channelId="abc" />
+
+// Or
+<EditMessageComposer messageId="xyz" />
+
+// Or
+<ForwardMessageComposer messageId="123" />
+```
+
+Each implementation is unique, explicit and self-contained. Yet they can each
+
+use shared parts.
+
+**Implementation:**
+
+```tsx
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <ThreadProvider channelId={channelId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <AlsoSendToChannelField channelId={channelId} />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Submit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ThreadProvider>
+  );
+}
+
+function EditMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <EditMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.CancelEdit />
+          <Composer.SaveEdit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </EditMessageProvider>
+  );
+}
+
+function ForwardMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <ForwardMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input placeholder="Add a message, if you'd like." />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Mentions />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ForwardMessageProvider>
+  );
+}
+```
+
+Each variant is explicit about:
+
+- What provider/state it uses
+
+- What UI elements it includes
+
+- What actions are available
+
+No boolean prop combinations to reason about. No impossible states.
+
+### 3.2 Prefer Composing Children Over Render Props
+
+**Impact: MEDIUM (cleaner composition, better readability)**
+
+Use `children` for composition instead of `renderX` props. Children are more
+
+readable, compose naturally, and don't require understanding callback
+
+signatures.
+
+**Incorrect: render props**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+}: {
+  renderHeader?: () => React.ReactNode;
+  renderFooter?: () => React.ReactNode;
+  renderActions?: () => React.ReactNode;
+}) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {renderFooter ? renderFooter() : <DefaultFooter />}
+      {renderActions?.()}
+    </form>
+  );
+}
+
+// Usage is awkward and inflexible
+return (
+  <Composer
+    renderHeader={() => <CustomHeader />}
+    renderFooter={() => (
+      <>
+        <Formatting />
+        <Emojis />
+      </>
+    )}
+    renderActions={() => <SubmitButton />}
+  />
+);
+```
+
+**Correct: compound components with children**
+
+```tsx
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerFooter({ children }: { children: React.ReactNode }) {
+  return <footer className="flex">{children}</footer>;
+}
+
+// Usage is flexible
+return (
+  <Composer.Frame>
+    <CustomHeader />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Emojis />
+      <SubmitButton />
+    </Composer.Footer>
+  </Composer.Frame>
+);
+```
+
+**When render props are appropriate:**
+
+```tsx
+// Render props work well when you need to pass data back
+<List
+  data={items}
+  renderItem={({ item, index }) => <Item item={item} index={index} />}
+/>
+```
+
+Use render props when the parent needs to provide data or state to the child.
+
+Use children when composing static structure.
+
+---
+
+## 4. React 19 APIs
+
+**Impact: MEDIUM**
+
+React 19+ only. Don't use `forwardRef`; use `use()` instead of `useContext()`.
+
+### 4.1 React 19 API Changes
+
+**Impact: MEDIUM (cleaner component definitions and context usage)**
+
+> **⚠️ React 19+ only.** Skip this if you're on React 18 or earlier.
+
+In React 19, `ref` is now a regular prop (no `forwardRef` wrapper needed), and `use()` replaces `useContext()`.
+
+**Incorrect: forwardRef in React 19**
+
+```tsx
+const ComposerInput = forwardRef<TextInput, Props>((props, ref) => {
+  return <TextInput ref={ref} {...props} />;
+});
+```
+
+**Correct: ref as a regular prop**
+
+```tsx
+function ComposerInput({
+  ref,
+  ...props
+}: Props & { ref?: React.Ref<TextInput> }) {
+  return <TextInput ref={ref} {...props} />;
+}
+```
+
+**Incorrect: useContext in React 19**
+
+```tsx
+const value = useContext(MyContext);
+```
+
+**Correct: use instead of useContext**
+
+```tsx
+const value = use(MyContext);
+```
+
+`use()` can also be called conditionally, unlike `useContext()`.
+
+---
+
+## References
+
+1. [https://react.dev](https://react.dev)
+2. [https://react.dev/learn/passing-data-deeply-with-context](https://react.dev/learn/passing-data-deeply-with-context)
+3. [https://react.dev/reference/react/use](https://react.dev/reference/react/use)
diff --git a/.cursor/skills/vercel-composition-patterns/SKILL.md b/.cursor/skills/vercel-composition-patterns/SKILL.md
new file mode 100644
index 000000000..d8a4672f0
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/SKILL.md
@@ -0,0 +1,89 @@
+---
+name: vercel-composition-patterns
+description:
+  React composition patterns that scale. Use when refactoring components with
+  boolean prop proliferation, building flexible component libraries, or
+  designing reusable APIs. Triggers on tasks involving compound components,
+  render props, context providers, or component architecture. Includes React 19
+  API changes.
+license: MIT
+metadata:
+  author: vercel
+  version: "1.0.0"
+---
+
+# React Composition Patterns
+
+Composition patterns for building flexible, maintainable React components. Avoid
+boolean prop proliferation by using compound components, lifting state, and
+composing internals. These patterns make codebases easier for both humans and AI
+agents to work with as they scale.
+
+## When to Apply
+
+Reference these guidelines when:
+
+- Refactoring components with many boolean props
+- Building reusable component libraries
+- Designing flexible component APIs
+- Reviewing component architecture
+- Working with compound components or context providers
+
+## Rule Categories by Priority
+
+| Priority | Category                | Impact | Prefix          |
+| -------- | ----------------------- | ------ | --------------- |
+| 1        | Component Architecture  | HIGH   | `architecture-` |
+| 2        | State Management        | MEDIUM | `state-`        |
+| 3        | Implementation Patterns | MEDIUM | `patterns-`     |
+| 4        | React 19 APIs           | MEDIUM | `react19-`      |
+
+## Quick Reference
+
+### 1. Component Architecture (HIGH)
+
+- `architecture-avoid-boolean-props` - Don't add boolean props to customize
+  behavior; use composition
+- `architecture-compound-components` - Structure complex components with shared
+  context
+
+### 2. State Management (MEDIUM)
+
+- `state-decouple-implementation` - Provider is the only place that knows how
+  state is managed
+- `state-context-interface` - Define generic interface with state, actions, meta
+  for dependency injection
+- `state-lift-state` - Move state into provider components for sibling access
+
+### 3. Implementation Patterns (MEDIUM)
+
+- `patterns-explicit-variants` - Create explicit variant components instead of
+  boolean modes
+- `patterns-children-over-render-props` - Use children for composition instead
+  of renderX props
+
+### 4. React 19 APIs (MEDIUM)
+
+> **⚠️ React 19+ only.** Skip this section if using React 18 or earlier.
+
+- `react19-no-forwardref` - Don't use `forwardRef`; use `use()` instead of `useContext()`
+
+## How to Use
+
+Read individual rule files for detailed explanations and code examples:
+
+```
+rules/architecture-avoid-boolean-props.md
+rules/state-context-interface.md
+```
+
+Each rule file contains:
+
+- Brief explanation of why it matters
+- Incorrect code example with explanation
+- Correct code example with explanation
+- Additional context and references
+
+## Full Compiled Document
+
+For the complete guide with all rules expanded: `AGENTS.md`
diff --git a/.cursor/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md b/.cursor/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md
new file mode 100644
index 000000000..48ff5c164
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/architecture-avoid-boolean-props.md
@@ -0,0 +1,100 @@
+---
+title: Avoid Boolean Prop Proliferation
+impact: CRITICAL
+impactDescription: prevents unmaintainable component variants
+tags: composition, props, architecture
+---
+
+## Avoid Boolean Prop Proliferation
+
+Don't add boolean props like `isThread`, `isEditing`, `isDMThread` to customize
+component behavior. Each boolean doubles possible states and creates
+unmaintainable conditional logic. Use composition instead.
+
+**Incorrect (boolean props create exponential complexity):**
+
+```tsx
+function Composer({
+  onSubmit,
+  isThread,
+  channelId,
+  isDMThread,
+  dmId,
+  isEditing,
+  isForwarding,
+}: Props) {
+  return (
+    <form>
+      <Header />
+      <Input />
+      {isDMThread ? (
+        <AlsoSendToDMField id={dmId} />
+      ) : isThread ? (
+        <AlsoSendToChannelField id={channelId} />
+      ) : null}
+      {isEditing ? (
+        <EditActions />
+      ) : isForwarding ? (
+        <ForwardActions />
+      ) : (
+        <DefaultActions />
+      )}
+      <Footer onSubmit={onSubmit} />
+    </form>
+  );
+}
+```
+
+**Correct (composition eliminates conditionals):**
+
+```tsx
+// Channel composer
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Attachments />
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Thread composer - adds "also send to channel" field
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <AlsoSendToChannelField id={channelId} />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Edit composer - different footer actions
+function EditComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Formatting />
+        <Composer.Emojis />
+        <Composer.CancelEdit />
+        <Composer.SaveEdit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+```
+
+Each variant is explicit about what it renders. We can share internals without
+sharing a single monolithic parent.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/architecture-compound-components.md b/.cursor/skills/vercel-composition-patterns/rules/architecture-compound-components.md
new file mode 100644
index 000000000..65c784bdf
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/architecture-compound-components.md
@@ -0,0 +1,112 @@
+---
+title: Use Compound Components
+impact: HIGH
+impactDescription: enables flexible composition without prop drilling
+tags: composition, compound-components, architecture
+---
+
+## Use Compound Components
+
+Structure complex components as compound components with a shared context. Each
+subcomponent accesses shared state via context, not props. Consumers compose the
+pieces they need.
+
+**Incorrect (monolithic component with render props):**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+  showAttachments,
+  showFormatting,
+  showEmojis,
+}: Props) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {showAttachments && <Attachments />}
+      {renderFooter ? (
+        renderFooter()
+      ) : (
+        <Footer>
+          {showFormatting && <Formatting />}
+          {showEmojis && <Emojis />}
+          {renderActions?.()}
+        </Footer>
+      )}
+    </form>
+  );
+}
+```
+
+**Correct (compound components with shared context):**
+
+```tsx
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+
+function ComposerProvider({ children, state, actions, meta }: ProviderProps) {
+  return (
+    <ComposerContext value={{ state, actions, meta }}>
+      {children}
+    </ComposerContext>
+  );
+}
+
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta: { inputRef },
+  } = use(ComposerContext);
+  return (
+    <TextInput
+      ref={inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+
+function ComposerSubmit() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Send</Button>;
+}
+
+// Export as compound component
+const Composer = {
+  Provider: ComposerProvider,
+  Frame: ComposerFrame,
+  Input: ComposerInput,
+  Submit: ComposerSubmit,
+  Header: ComposerHeader,
+  Footer: ComposerFooter,
+  Attachments: ComposerAttachments,
+  Formatting: ComposerFormatting,
+  Emojis: ComposerEmojis,
+};
+```
+
+**Usage:**
+
+```tsx
+<Composer.Provider state={state} actions={actions} meta={meta}>
+  <Composer.Frame>
+    <Composer.Header />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Submit />
+    </Composer.Footer>
+  </Composer.Frame>
+</Composer.Provider>
+```
+
+Consumers explicitly compose exactly what they need. No hidden conditionals. And the state, actions and meta are dependency-injected by a parent provider, allowing multiple usages of the same component structure.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md b/.cursor/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md
new file mode 100644
index 000000000..129a249fa
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/patterns-children-over-render-props.md
@@ -0,0 +1,87 @@
+---
+title: Prefer Composing Children Over Render Props
+impact: MEDIUM
+impactDescription: cleaner composition, better readability
+tags: composition, children, render-props
+---
+
+## Prefer Children Over Render Props
+
+Use `children` for composition instead of `renderX` props. Children are more
+readable, compose naturally, and don't require understanding callback
+signatures.
+
+**Incorrect (render props):**
+
+```tsx
+function Composer({
+  renderHeader,
+  renderFooter,
+  renderActions,
+}: {
+  renderHeader?: () => React.ReactNode;
+  renderFooter?: () => React.ReactNode;
+  renderActions?: () => React.ReactNode;
+}) {
+  return (
+    <form>
+      {renderHeader?.()}
+      <Input />
+      {renderFooter ? renderFooter() : <DefaultFooter />}
+      {renderActions?.()}
+    </form>
+  );
+}
+
+// Usage is awkward and inflexible
+return (
+  <Composer
+    renderHeader={() => <CustomHeader />}
+    renderFooter={() => (
+      <>
+        <Formatting />
+        <Emojis />
+      </>
+    )}
+    renderActions={() => <SubmitButton />}
+  />
+);
+```
+
+**Correct (compound components with children):**
+
+```tsx
+function ComposerFrame({ children }: { children: React.ReactNode }) {
+  return <form>{children}</form>;
+}
+
+function ComposerFooter({ children }: { children: React.ReactNode }) {
+  return <footer className="flex">{children}</footer>;
+}
+
+// Usage is flexible
+return (
+  <Composer.Frame>
+    <CustomHeader />
+    <Composer.Input />
+    <Composer.Footer>
+      <Composer.Formatting />
+      <Composer.Emojis />
+      <SubmitButton />
+    </Composer.Footer>
+  </Composer.Frame>
+);
+```
+
+**When render props are appropriate:**
+
+```tsx
+// Render props work well when you need to pass data back
+<List
+  data={items}
+  renderItem={({ item, index }) => <Item item={item} index={index} />}
+/>
+```
+
+Use render props when the parent needs to provide data or state to the child.
+Use children when composing static structure.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md b/.cursor/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md
new file mode 100644
index 000000000..509e3608b
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/patterns-explicit-variants.md
@@ -0,0 +1,100 @@
+---
+title: Create Explicit Component Variants
+impact: MEDIUM
+impactDescription: self-documenting code, no hidden conditionals
+tags: composition, variants, architecture
+---
+
+## Create Explicit Component Variants
+
+Instead of one component with many boolean props, create explicit variant
+components. Each variant composes the pieces it needs. The code documents
+itself.
+
+**Incorrect (one component, many modes):**
+
+```tsx
+// What does this component actually render?
+<Composer
+  isThread
+  isEditing={false}
+  channelId="abc"
+  showAttachments
+  showFormatting={false}
+/>
+```
+
+**Correct (explicit variants):**
+
+```tsx
+// Immediately clear what this renders
+<ThreadComposer channelId="abc" />
+
+// Or
+<EditMessageComposer messageId="xyz" />
+
+// Or
+<ForwardMessageComposer messageId="123" />
+```
+
+Each implementation is unique, explicit and self-contained. Yet they can each
+use shared parts.
+
+**Implementation:**
+
+```tsx
+function ThreadComposer({ channelId }: { channelId: string }) {
+  return (
+    <ThreadProvider channelId={channelId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <AlsoSendToChannelField channelId={channelId} />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Submit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ThreadProvider>
+  );
+}
+
+function EditMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <EditMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.CancelEdit />
+          <Composer.SaveEdit />
+        </Composer.Footer>
+      </Composer.Frame>
+    </EditMessageProvider>
+  );
+}
+
+function ForwardMessageComposer({ messageId }: { messageId: string }) {
+  return (
+    <ForwardMessageProvider messageId={messageId}>
+      <Composer.Frame>
+        <Composer.Input placeholder="Add a message, if you'd like." />
+        <Composer.Footer>
+          <Composer.Formatting />
+          <Composer.Emojis />
+          <Composer.Mentions />
+        </Composer.Footer>
+      </Composer.Frame>
+    </ForwardMessageProvider>
+  );
+}
+```
+
+Each variant is explicit about:
+
+- What provider/state it uses
+- What UI elements it includes
+- What actions are available
+
+No boolean prop combinations to reason about. No impossible states.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/react19-no-forwardref.md b/.cursor/skills/vercel-composition-patterns/rules/react19-no-forwardref.md
new file mode 100644
index 000000000..b1aaf760f
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/react19-no-forwardref.md
@@ -0,0 +1,45 @@
+---
+title: React 19 API Changes
+impact: MEDIUM
+impactDescription: cleaner component definitions and context usage
+tags: react19, refs, context, hooks
+---
+
+## React 19 API Changes
+
+> **⚠️ React 19+ only.** Skip this if you're on React 18 or earlier.
+
+In React 19, `ref` is now a regular prop (no `forwardRef` wrapper needed), and `use()` replaces `useContext()`.
+
+**Incorrect (forwardRef in React 19):**
+
+```tsx
+const ComposerInput = forwardRef<TextInput, Props>((props, ref) => {
+  return <TextInput ref={ref} {...props} />;
+});
+```
+
+**Correct (ref as a regular prop):**
+
+```tsx
+function ComposerInput({
+  ref,
+  ...props
+}: Props & { ref?: React.Ref<TextInput> }) {
+  return <TextInput ref={ref} {...props} />;
+}
+```
+
+**Incorrect (useContext in React 19):**
+
+```tsx
+const value = useContext(MyContext);
+```
+
+**Correct (use instead of useContext):**
+
+```tsx
+const value = use(MyContext);
+```
+
+`use()` can also be called conditionally, unlike `useContext()`.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/state-context-interface.md b/.cursor/skills/vercel-composition-patterns/rules/state-context-interface.md
new file mode 100644
index 000000000..6a680ea22
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/state-context-interface.md
@@ -0,0 +1,191 @@
+---
+title: Define Generic Context Interfaces for Dependency Injection
+impact: HIGH
+impactDescription: enables dependency-injectable state across use-cases
+tags: composition, context, state, typescript, dependency-injection
+---
+
+## Define Generic Context Interfaces for Dependency Injection
+
+Define a **generic interface** for your component context with three parts:
+`state`, `actions`, and `meta`. This interface is a contract that any provider
+can implement—enabling the same UI components to work with completely different
+state implementations.
+
+**Core principle:** Lift state, compose internals, make state
+dependency-injectable.
+
+**Incorrect (UI coupled to specific state implementation):**
+
+```tsx
+function ComposerInput() {
+  // Tightly coupled to a specific hook
+  const { input, setInput } = useChannelComposerState();
+  return <TextInput value={input} onChangeText={setInput} />;
+}
+```
+
+**Correct (generic interface enables dependency injection):**
+
+```tsx
+// Define a GENERIC interface that any provider can implement
+interface ComposerState {
+  input: string;
+  attachments: Attachment[];
+  isSubmitting: boolean;
+}
+
+interface ComposerActions {
+  update: (updater: (state: ComposerState) => ComposerState) => void;
+  submit: () => void;
+}
+
+interface ComposerMeta {
+  inputRef: React.RefObject<TextInput>;
+}
+
+interface ComposerContextValue {
+  state: ComposerState;
+  actions: ComposerActions;
+  meta: ComposerMeta;
+}
+
+const ComposerContext = createContext<ComposerContextValue | null>(null);
+```
+
+**UI components consume the interface, not the implementation:**
+
+```tsx
+function ComposerInput() {
+  const {
+    state,
+    actions: { update },
+    meta,
+  } = use(ComposerContext);
+
+  // This component works with ANY provider that implements the interface
+  return (
+    <TextInput
+      ref={meta.inputRef}
+      value={state.input}
+      onChangeText={(text) => update((s) => ({ ...s, input: text }))}
+    />
+  );
+}
+```
+
+**Different providers implement the same interface:**
+
+```tsx
+// Provider A: Local state for ephemeral forms
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const inputRef = useRef(null);
+  const submit = useForwardMessage();
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update: setState, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+
+// Provider B: Global synced state for channels
+function ChannelProvider({ channelId, children }: Props) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <ComposerContext
+      value={{
+        state,
+        actions: { update, submit },
+        meta: { inputRef },
+      }}
+    >
+      {children}
+    </ComposerContext>
+  );
+}
+```
+
+**The same composed UI works with both:**
+
+```tsx
+// Works with ForwardMessageProvider (local state)
+<ForwardMessageProvider>
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ForwardMessageProvider>
+
+// Works with ChannelProvider (global synced state)
+<ChannelProvider channelId="abc">
+  <Composer.Frame>
+    <Composer.Input />
+    <Composer.Submit />
+  </Composer.Frame>
+</ChannelProvider>
+```
+
+**Custom UI outside the component can access state and actions:**
+
+The provider boundary is what matters—not the visual nesting. Components that
+need shared state don't have to be inside the `Composer.Frame`. They just need
+to be within the provider.
+
+```tsx
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        {/* The composer UI */}
+        <Composer.Frame>
+          <Composer.Input placeholder="Add a message, if you'd like." />
+          <Composer.Footer>
+            <Composer.Formatting />
+            <Composer.Emojis />
+          </Composer.Footer>
+        </Composer.Frame>
+
+        {/* Custom UI OUTSIDE the composer, but INSIDE the provider */}
+        <MessagePreview />
+
+        {/* Actions at the bottom of the dialog */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+// This button lives OUTSIDE Composer.Frame but can still submit based on its context!
+function ForwardButton() {
+  const {
+    actions: { submit },
+  } = use(ComposerContext);
+  return <Button onPress={submit}>Forward</Button>;
+}
+
+// This preview lives OUTSIDE Composer.Frame but can read composer's state!
+function MessagePreview() {
+  const { state } = use(ComposerContext);
+  return <Preview message={state.input} attachments={state.attachments} />;
+}
+```
+
+The `ForwardButton` and `MessagePreview` are not visually inside the composer
+box, but they can still access its state and actions. This is the power of
+lifting state into providers.
+
+The UI is reusable bits you compose together. The state is dependency-injected
+by the provider. Swap the provider, keep the UI.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/state-decouple-implementation.md b/.cursor/skills/vercel-composition-patterns/rules/state-decouple-implementation.md
new file mode 100644
index 000000000..d67fd1220
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/state-decouple-implementation.md
@@ -0,0 +1,113 @@
+---
+title: Decouple State Management from UI
+impact: MEDIUM
+impactDescription: enables swapping state implementations without changing UI
+tags: composition, state, architecture
+---
+
+## Decouple State Management from UI
+
+The provider component should be the only place that knows how state is managed.
+UI components consume the context interface—they don't know if state comes from
+useState, Zustand, or a server sync.
+
+**Incorrect (UI coupled to state implementation):**
+
+```tsx
+function ChannelComposer({ channelId }: { channelId: string }) {
+  // UI component knows about global state implementation
+  const state = useGlobalChannelState(channelId);
+  const { submit, updateInput } = useChannelSync(channelId);
+
+  return (
+    <Composer.Frame>
+      <Composer.Input
+        value={state.input}
+        onChange={(text) => sync.updateInput(text)}
+      />
+      <Composer.Submit onPress={() => sync.submit()} />
+    </Composer.Frame>
+  );
+}
+```
+
+**Correct (state management isolated in provider):**
+
+```tsx
+// Provider handles all state management details
+function ChannelProvider({
+  channelId,
+  children,
+}: {
+  channelId: string;
+  children: React.ReactNode;
+}) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update, submit }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// UI component only knows about the context interface
+function ChannelComposer() {
+  return (
+    <Composer.Frame>
+      <Composer.Header />
+      <Composer.Input />
+      <Composer.Footer>
+        <Composer.Submit />
+      </Composer.Footer>
+    </Composer.Frame>
+  );
+}
+
+// Usage
+function Channel({ channelId }: { channelId: string }) {
+  return (
+    <ChannelProvider channelId={channelId}>
+      <ChannelComposer />
+    </ChannelProvider>
+  );
+}
+```
+
+**Different providers, same UI:**
+
+```tsx
+// Local state for ephemeral forms
+function ForwardMessageProvider({ children }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+// Global synced state for channels
+function ChannelProvider({ channelId, children }) {
+  const { state, update, submit } = useGlobalChannel(channelId);
+
+  return (
+    <Composer.Provider state={state} actions={{ update, submit }}>
+      {children}
+    </Composer.Provider>
+  );
+}
+```
+
+The same `Composer.Input` component works with both providers because it only
+depends on the context interface, not the implementation.
diff --git a/.cursor/skills/vercel-composition-patterns/rules/state-lift-state.md b/.cursor/skills/vercel-composition-patterns/rules/state-lift-state.md
new file mode 100644
index 000000000..d683ec1cd
--- /dev/null
+++ b/.cursor/skills/vercel-composition-patterns/rules/state-lift-state.md
@@ -0,0 +1,127 @@
+---
+title: Lift State into Provider Components
+impact: HIGH
+impactDescription: enables state sharing outside component boundaries
+tags: composition, state, context, providers
+---
+
+## Lift State into Provider Components
+
+Move state management into dedicated provider components. This allows sibling
+components outside the main UI to access and modify state without prop drilling
+or awkward refs.
+
+**Incorrect (state trapped inside component):**
+
+```tsx
+function ForwardMessageComposer() {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+
+  return (
+    <Composer.Frame>
+      <Composer.Input />
+      <Composer.Footer />
+    </Composer.Frame>
+  );
+}
+
+// Problem: How does this button access composer state?
+function ForwardMessageDialog() {
+  return (
+    <Dialog>
+      <ForwardMessageComposer />
+      <MessagePreview /> {/* Needs composer state */}
+      <DialogActions>
+        <CancelButton />
+        <ForwardButton /> {/* Needs to call submit */}
+      </DialogActions>
+    </Dialog>
+  );
+}
+```
+
+**Incorrect (useEffect to sync state up):**
+
+```tsx
+function ForwardMessageDialog() {
+  const [input, setInput] = useState("");
+  return (
+    <Dialog>
+      <ForwardMessageComposer onInputChange={setInput} />
+      <MessagePreview input={input} />
+    </Dialog>
+  );
+}
+
+function ForwardMessageComposer({ onInputChange }) {
+  const [state, setState] = useState(initialState);
+  useEffect(() => {
+    onInputChange(state.input); // Sync on every change 😬
+  }, [state.input]);
+}
+```
+
+**Incorrect (reading state from ref on submit):**
+
+```tsx
+function ForwardMessageDialog() {
+  const stateRef = useRef(null);
+  return (
+    <Dialog>
+      <ForwardMessageComposer stateRef={stateRef} />
+      <ForwardButton onPress={() => submit(stateRef.current)} />
+    </Dialog>
+  );
+}
+```
+
+**Correct (state lifted to provider):**
+
+```tsx
+function ForwardMessageProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState(initialState);
+  const forwardMessage = useForwardMessage();
+  const inputRef = useRef(null);
+
+  return (
+    <Composer.Provider
+      state={state}
+      actions={{ update: setState, submit: forwardMessage }}
+      meta={{ inputRef }}
+    >
+      {children}
+    </Composer.Provider>
+  );
+}
+
+function ForwardMessageDialog() {
+  return (
+    <ForwardMessageProvider>
+      <Dialog>
+        <ForwardMessageComposer />
+        <MessagePreview />{" "}
+        {/* Custom components can access state and actions */}
+        <DialogActions>
+          <CancelButton />
+          <ForwardButton />{" "}
+          {/* Custom components can access state and actions */}
+        </DialogActions>
+      </Dialog>
+    </ForwardMessageProvider>
+  );
+}
+
+function ForwardButton() {
+  const { actions } = use(Composer.Context);
+  return <Button onPress={actions.submit}>Forward</Button>;
+}
+```
+
+The ForwardButton lives outside the Composer.Frame but still has access to the
+submit action because it's within the provider. Even though it's a one-off
+component, it can still access the composer's state and actions from outside the
+UI itself.
+
+**Key insight:** Components that need shared state don't have to be visually
+nested inside each other—they just need to be within the same provider.
diff --git a/.cursor/skills/vercel-react-best-practices/AGENTS.md b/.cursor/skills/vercel-react-best-practices/AGENTS.md
new file mode 100644
index 000000000..96d0db4a5
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/AGENTS.md
@@ -0,0 +1,2906 @@
+# React Best Practices
+
+**Version 1.0.0**  
+Vercel Engineering  
+January 2026
+
+> **Note:**  
+> This document is mainly for agents and LLMs to follow when maintaining,  
+> generating, or refactoring React and Next.js codebases. Humans  
+> may also find it useful, but guidance here is optimized for automation  
+> and consistency by AI-assisted workflows.
+
+---
+
+## Abstract
+
+Comprehensive performance optimization guide for React and Next.js applications, designed for AI agents and LLMs. Contains 40+ rules across 8 categories, prioritized by impact from critical (eliminating waterfalls, reducing bundle size) to incremental (advanced patterns). Each rule includes detailed explanations, real-world examples comparing incorrect vs. correct implementations, and specific impact metrics to guide automated refactoring and code generation.
+
+---
+
+## Table of Contents
+
+1. [Eliminating Waterfalls](#1-eliminating-waterfalls) — **CRITICAL**
+   - 1.1 [Defer Await Until Needed](#11-defer-await-until-needed)
+   - 1.2 [Dependency-Based Parallelization](#12-dependency-based-parallelization)
+   - 1.3 [Prevent Waterfall Chains in API Routes](#13-prevent-waterfall-chains-in-api-routes)
+   - 1.4 [Promise.all() for Independent Operations](#14-promiseall-for-independent-operations)
+   - 1.5 [Strategic Suspense Boundaries](#15-strategic-suspense-boundaries)
+2. [Bundle Size Optimization](#2-bundle-size-optimization) — **CRITICAL**
+   - 2.1 [Avoid Barrel File Imports](#21-avoid-barrel-file-imports)
+   - 2.2 [Conditional Module Loading](#22-conditional-module-loading)
+   - 2.3 [Defer Non-Critical Third-Party Libraries](#23-defer-non-critical-third-party-libraries)
+   - 2.4 [Dynamic Imports for Heavy Components](#24-dynamic-imports-for-heavy-components)
+   - 2.5 [Preload Based on User Intent](#25-preload-based-on-user-intent)
+3. [Server-Side Performance](#3-server-side-performance) — **HIGH**
+   - 3.1 [Authenticate Server Actions Like API Routes](#31-authenticate-server-actions-like-api-routes)
+   - 3.2 [Avoid Duplicate Serialization in RSC Props](#32-avoid-duplicate-serialization-in-rsc-props)
+   - 3.3 [Cross-Request LRU Caching](#33-cross-request-lru-caching)
+   - 3.4 [Minimize Serialization at RSC Boundaries](#34-minimize-serialization-at-rsc-boundaries)
+   - 3.5 [Parallel Data Fetching with Component Composition](#35-parallel-data-fetching-with-component-composition)
+   - 3.6 [Per-Request Deduplication with React.cache()](#36-per-request-deduplication-with-reactcache)
+   - 3.7 [Use after() for Non-Blocking Operations](#37-use-after-for-non-blocking-operations)
+4. [Client-Side Data Fetching](#4-client-side-data-fetching) — **MEDIUM-HIGH**
+   - 4.1 [Deduplicate Global Event Listeners](#41-deduplicate-global-event-listeners)
+   - 4.2 [Use Passive Event Listeners for Scrolling Performance](#42-use-passive-event-listeners-for-scrolling-performance)
+   - 4.3 [Use SWR for Automatic Deduplication](#43-use-swr-for-automatic-deduplication)
+   - 4.4 [Version and Minimize localStorage Data](#44-version-and-minimize-localstorage-data)
+5. [Re-render Optimization](#5-re-render-optimization) — **MEDIUM**
+   - 5.1 [Calculate Derived State During Rendering](#51-calculate-derived-state-during-rendering)
+   - 5.2 [Defer State Reads to Usage Point](#52-defer-state-reads-to-usage-point)
+   - 5.3 [Do not wrap a simple expression with a primitive result type in useMemo](#53-do-not-wrap-a-simple-expression-with-a-primitive-result-type-in-usememo)
+   - 5.4 [Extract Default Non-primitive Parameter Value from Memoized Component to Constant](#54-extract-default-non-primitive-parameter-value-from-memoized-component-to-constant)
+   - 5.5 [Extract to Memoized Components](#55-extract-to-memoized-components)
+   - 5.6 [Narrow Effect Dependencies](#56-narrow-effect-dependencies)
+   - 5.7 [Put Interaction Logic in Event Handlers](#57-put-interaction-logic-in-event-handlers)
+   - 5.8 [Subscribe to Derived State](#58-subscribe-to-derived-state)
+   - 5.9 [Use Functional setState Updates](#59-use-functional-setstate-updates)
+   - 5.10 [Use Lazy State Initialization](#510-use-lazy-state-initialization)
+   - 5.11 [Use Transitions for Non-Urgent Updates](#511-use-transitions-for-non-urgent-updates)
+   - 5.12 [Use useRef for Transient Values](#512-use-useref-for-transient-values)
+6. [Rendering Performance](#6-rendering-performance) — **MEDIUM**
+   - 6.1 [Animate SVG Wrapper Instead of SVG Element](#61-animate-svg-wrapper-instead-of-svg-element)
+   - 6.2 [CSS content-visibility for Long Lists](#62-css-content-visibility-for-long-lists)
+   - 6.3 [Hoist Static JSX Elements](#63-hoist-static-jsx-elements)
+   - 6.4 [Optimize SVG Precision](#64-optimize-svg-precision)
+   - 6.5 [Prevent Hydration Mismatch Without Flickering](#65-prevent-hydration-mismatch-without-flickering)
+   - 6.6 [Suppress Expected Hydration Mismatches](#66-suppress-expected-hydration-mismatches)
+   - 6.7 [Use Activity Component for Show/Hide](#67-use-activity-component-for-showhide)
+   - 6.8 [Use Explicit Conditional Rendering](#68-use-explicit-conditional-rendering)
+   - 6.9 [Use useTransition Over Manual Loading States](#69-use-usetransition-over-manual-loading-states)
+7. [JavaScript Performance](#7-javascript-performance) — **LOW-MEDIUM**
+   - 7.1 [Avoid Layout Thrashing](#71-avoid-layout-thrashing)
+   - 7.2 [Build Index Maps for Repeated Lookups](#72-build-index-maps-for-repeated-lookups)
+   - 7.3 [Cache Property Access in Loops](#73-cache-property-access-in-loops)
+   - 7.4 [Cache Repeated Function Calls](#74-cache-repeated-function-calls)
+   - 7.5 [Cache Storage API Calls](#75-cache-storage-api-calls)
+   - 7.6 [Combine Multiple Array Iterations](#76-combine-multiple-array-iterations)
+   - 7.7 [Early Length Check for Array Comparisons](#77-early-length-check-for-array-comparisons)
+   - 7.8 [Early Return from Functions](#78-early-return-from-functions)
+   - 7.9 [Hoist RegExp Creation](#79-hoist-regexp-creation)
+   - 7.10 [Use Loop for Min/Max Instead of Sort](#710-use-loop-for-minmax-instead-of-sort)
+   - 7.11 [Use Set/Map for O(1) Lookups](#711-use-setmap-for-o1-lookups)
+   - 7.12 [Use toSorted() Instead of sort() for Immutability](#712-use-tosorted-instead-of-sort-for-immutability)
+8. [Advanced Patterns](#8-advanced-patterns) — **LOW**
+   - 8.1 [Initialize App Once, Not Per Mount](#81-initialize-app-once-not-per-mount)
+   - 8.2 [Store Event Handlers in Refs](#82-store-event-handlers-in-refs)
+   - 8.3 [useEffectEvent for Stable Callback Refs](#83-useeffectevent-for-stable-callback-refs)
+
+---
+
+## 1. Eliminating Waterfalls
+
+**Impact: CRITICAL**
+
+Waterfalls are the #1 performance killer. Each sequential await adds full network latency. Eliminating them yields the largest gains.
+
+### 1.1 Defer Await Until Needed
+
+**Impact: HIGH (avoids blocking unused code paths)**
+
+Move `await` operations into the branches where they're actually used to avoid blocking code paths that don't need them.
+
+**Incorrect: blocks both branches**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  const userData = await fetchUserData(userId);
+
+  if (skipProcessing) {
+    // Returns immediately but still waited for userData
+    return { skipped: true };
+  }
+
+  // Only this branch uses userData
+  return processUserData(userData);
+}
+```
+
+**Correct: only blocks when needed**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  if (skipProcessing) {
+    // Returns immediately without waiting
+    return { skipped: true };
+  }
+
+  // Fetch only when needed
+  const userData = await fetchUserData(userId);
+  return processUserData(userData);
+}
+```
+
+**Another example: early return optimization**
+
+```typescript
+// Incorrect: always fetches permissions
+async function updateResource(resourceId: string, userId: string) {
+  const permissions = await fetchPermissions(userId);
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+
+// Correct: fetches only when needed
+async function updateResource(resourceId: string, userId: string) {
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  const permissions = await fetchPermissions(userId);
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+```
+
+This optimization is especially valuable when the skipped branch is frequently taken, or when the deferred operation is expensive.
+
+### 1.2 Dependency-Based Parallelization
+
+**Impact: CRITICAL (2-10× improvement)**
+
+For operations with partial dependencies, use `better-all` to maximize parallelism. It automatically starts each task at the earliest possible moment.
+
+**Incorrect: profile waits for config unnecessarily**
+
+```typescript
+const [user, config] = await Promise.all([fetchUser(), fetchConfig()]);
+const profile = await fetchProfile(user.id);
+```
+
+**Correct: config and profile run in parallel**
+
+```typescript
+import { all } from "better-all";
+
+const { user, config, profile } = await all({
+  async user() {
+    return fetchUser();
+  },
+  async config() {
+    return fetchConfig();
+  },
+  async profile() {
+    return fetchProfile((await this.$.user).id);
+  },
+});
+```
+
+**Alternative without extra dependencies:**
+
+```typescript
+const userPromise = fetchUser();
+const profilePromise = userPromise.then((user) => fetchProfile(user.id));
+
+const [user, config, profile] = await Promise.all([
+  userPromise,
+  fetchConfig(),
+  profilePromise,
+]);
+```
+
+We can also create all the promises first, and do `Promise.all()` at the end.
+
+Reference: [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
+
+### 1.3 Prevent Waterfall Chains in API Routes
+
+**Impact: CRITICAL (2-10× improvement)**
+
+In API routes and Server Actions, start independent operations immediately, even if you don't await them yet.
+
+**Incorrect: config waits for auth, data waits for both**
+
+```typescript
+export async function GET(request: Request) {
+  const session = await auth();
+  const config = await fetchConfig();
+  const data = await fetchData(session.user.id);
+  return Response.json({ data, config });
+}
+```
+
+**Correct: auth and config start immediately**
+
+```typescript
+export async function GET(request: Request) {
+  const sessionPromise = auth();
+  const configPromise = fetchConfig();
+  const session = await sessionPromise;
+  const [config, data] = await Promise.all([
+    configPromise,
+    fetchData(session.user.id),
+  ]);
+  return Response.json({ data, config });
+}
+```
+
+For operations with more complex dependency chains, use `better-all` to automatically maximize parallelism (see Dependency-Based Parallelization).
+
+### 1.4 Promise.all() for Independent Operations
+
+**Impact: CRITICAL (2-10× improvement)**
+
+When async operations have no interdependencies, execute them concurrently using `Promise.all()`.
+
+**Incorrect: sequential execution, 3 round trips**
+
+```typescript
+const user = await fetchUser();
+const posts = await fetchPosts();
+const comments = await fetchComments();
+```
+
+**Correct: parallel execution, 1 round trip**
+
+```typescript
+const [user, posts, comments] = await Promise.all([
+  fetchUser(),
+  fetchPosts(),
+  fetchComments(),
+]);
+```
+
+### 1.5 Strategic Suspense Boundaries
+
+**Impact: HIGH (faster initial paint)**
+
+Instead of awaiting data in async components before returning JSX, use Suspense boundaries to show the wrapper UI faster while data loads.
+
+**Incorrect: wrapper blocked by data fetching**
+
+```tsx
+async function Page() {
+  const data = await fetchData(); // Blocks entire page
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <DataDisplay data={data} />
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+```
+
+The entire layout waits for data even though only the middle section needs it.
+
+**Correct: wrapper shows immediately, data streams in**
+
+```tsx
+function Page() {
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <Suspense fallback={<Skeleton />}>
+          <DataDisplay />
+        </Suspense>
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+async function DataDisplay() {
+  const data = await fetchData(); // Only blocks this component
+  return <div>{data.content}</div>;
+}
+```
+
+Sidebar, Header, and Footer render immediately. Only DataDisplay waits for data.
+
+**Alternative: share promise across components**
+
+```tsx
+function Page() {
+  // Start fetch immediately, but don't await
+  const dataPromise = fetchData();
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <Suspense fallback={<Skeleton />}>
+        <DataDisplay dataPromise={dataPromise} />
+        <DataSummary dataPromise={dataPromise} />
+      </Suspense>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+function DataDisplay({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Unwraps the promise
+  return <div>{data.content}</div>;
+}
+
+function DataSummary({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Reuses the same promise
+  return <div>{data.summary}</div>;
+}
+```
+
+Both components share the same promise, so only one fetch occurs. Layout renders immediately while both components wait together.
+
+**When NOT to use this pattern:**
+
+- Critical data needed for layout decisions (affects positioning)
+
+- SEO-critical content above the fold
+
+- Small, fast queries where suspense overhead isn't worth it
+
+- When you want to avoid layout shift (loading → content jump)
+
+**Trade-off:** Faster initial paint vs potential layout shift. Choose based on your UX priorities.
+
+---
+
+## 2. Bundle Size Optimization
+
+**Impact: CRITICAL**
+
+Reducing initial bundle size improves Time to Interactive and Largest Contentful Paint.
+
+### 2.1 Avoid Barrel File Imports
+
+**Impact: CRITICAL (200-800ms import cost, slow builds)**
+
+Import directly from source files instead of barrel files to avoid loading thousands of unused modules. **Barrel files** are entry points that re-export multiple modules (e.g., `index.js` that does `export * from './module'`).
+
+Popular icon and component libraries can have **up to 10,000 re-exports** in their entry file. For many React packages, **it takes 200-800ms just to import them**, affecting both development speed and production cold starts.
+
+**Why tree-shaking doesn't help:** When a library is marked as external (not bundled), the bundler can't optimize it. If you bundle it to enable tree-shaking, builds become substantially slower analyzing the entire module graph.
+
+**Incorrect: imports entire library**
+
+```tsx
+import { Check, X, Menu } from "lucide-react";
+// Loads 1,583 modules, takes ~2.8s extra in dev
+// Runtime cost: 200-800ms on every cold start
+
+import { Button, TextField } from "@mui/material";
+// Loads 2,225 modules, takes ~4.2s extra in dev
+```
+
+**Correct: imports only what you need**
+
+```tsx
+import Check from "lucide-react/dist/esm/icons/check";
+import X from "lucide-react/dist/esm/icons/x";
+import Menu from "lucide-react/dist/esm/icons/menu";
+// Loads only 3 modules (~2KB vs ~1MB)
+
+import Button from "@mui/material/Button";
+import TextField from "@mui/material/TextField";
+// Loads only what you use
+```
+
+**Alternative: Next.js 13.5+**
+
+```js
+// next.config.js - use optimizePackageImports
+module.exports = {
+  experimental: {
+    optimizePackageImports: ["lucide-react", "@mui/material"],
+  },
+};
+
+// Then you can keep the ergonomic barrel imports:
+import { Check, X, Menu } from "lucide-react";
+// Automatically transformed to direct imports at build time
+```
+
+Direct imports provide 15-70% faster dev boot, 28% faster builds, 40% faster cold starts, and significantly faster HMR.
+
+Libraries commonly affected: `lucide-react`, `@mui/material`, `@mui/icons-material`, `@tabler/icons-react`, `react-icons`, `@headlessui/react`, `@radix-ui/react-*`, `lodash`, `ramda`, `date-fns`, `rxjs`, `react-use`.
+
+Reference: [https://vercel.com/blog/how-we-optimized-package-imports-in-next-js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
+
+### 2.2 Conditional Module Loading
+
+**Impact: HIGH (loads large data only when needed)**
+
+Load large data or modules only when a feature is activated.
+
+**Example: lazy-load animation frames**
+
+```tsx
+function AnimationPlayer({
+  enabled,
+  setEnabled,
+}: {
+  enabled: boolean;
+  setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
+}) {
+  const [frames, setFrames] = useState<Frame[] | null>(null);
+
+  useEffect(() => {
+    if (enabled && !frames && typeof window !== "undefined") {
+      import("./animation-frames.js")
+        .then((mod) => setFrames(mod.frames))
+        .catch(() => setEnabled(false));
+    }
+  }, [enabled, frames, setEnabled]);
+
+  if (!frames) return <Skeleton />;
+  return <Canvas frames={frames} />;
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.
+
+### 2.3 Defer Non-Critical Third-Party Libraries
+
+**Impact: MEDIUM (loads after hydration)**
+
+Analytics, logging, and error tracking don't block user interaction. Load them after hydration.
+
+**Incorrect: blocks initial bundle**
+
+```tsx
+import { Analytics } from "@vercel/analytics/react";
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+**Correct: loads after hydration**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const Analytics = dynamic(
+  () => import("@vercel/analytics/react").then((m) => m.Analytics),
+  { ssr: false },
+);
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+### 2.4 Dynamic Imports for Heavy Components
+
+**Impact: CRITICAL (directly affects TTI and LCP)**
+
+Use `next/dynamic` to lazy-load large components not needed on initial render.
+
+**Incorrect: Monaco bundles with main chunk ~300KB**
+
+```tsx
+import { MonacoEditor } from "./monaco-editor";
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+**Correct: Monaco loads on demand**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const MonacoEditor = dynamic(
+  () => import("./monaco-editor").then((m) => m.MonacoEditor),
+  { ssr: false },
+);
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+### 2.5 Preload Based on User Intent
+
+**Impact: MEDIUM (reduces perceived latency)**
+
+Preload heavy bundles before they're needed to reduce perceived latency.
+
+**Example: preload on hover/focus**
+
+```tsx
+function EditorButton({ onClick }: { onClick: () => void }) {
+  const preload = () => {
+    if (typeof window !== "undefined") {
+      void import("./monaco-editor");
+    }
+  };
+
+  return (
+    <button onMouseEnter={preload} onFocus={preload} onClick={onClick}>
+      Open Editor
+    </button>
+  );
+}
+```
+
+**Example: preload when feature flag is enabled**
+
+```tsx
+function FlagsProvider({ children, flags }: Props) {
+  useEffect(() => {
+    if (flags.editorEnabled && typeof window !== "undefined") {
+      void import("./monaco-editor").then((mod) => mod.init());
+    }
+  }, [flags.editorEnabled]);
+
+  return (
+    <FlagsContext.Provider value={flags}>{children}</FlagsContext.Provider>
+  );
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling preloaded modules for SSR, optimizing server bundle size and build speed.
+
+---
+
+## 3. Server-Side Performance
+
+**Impact: HIGH**
+
+Optimizing server-side rendering and data fetching eliminates server-side waterfalls and reduces response times.
+
+### 3.1 Authenticate Server Actions Like API Routes
+
+**Impact: CRITICAL (prevents unauthorized access to server mutations)**
+
+Server Actions (functions with `"use server"`) are exposed as public endpoints, just like API routes. Always verify authentication and authorization **inside** each Server Action—do not rely solely on middleware, layout guards, or page-level checks, as Server Actions can be invoked directly.
+
+Next.js documentation explicitly states: "Treat Server Actions with the same security considerations as public-facing API endpoints, and verify if the user is allowed to perform a mutation."
+
+**Incorrect: no authentication check**
+
+```typescript
+"use server";
+
+export async function deleteUser(userId: string) {
+  // Anyone can call this! No auth check
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**Correct: authentication inside the action**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { unauthorized } from "@/lib/errors";
+
+export async function deleteUser(userId: string) {
+  // Always check auth inside the action
+  const session = await verifySession();
+
+  if (!session) {
+    throw unauthorized("Must be logged in");
+  }
+
+  // Check authorization too
+  if (session.user.role !== "admin" && session.user.id !== userId) {
+    throw unauthorized("Cannot delete other users");
+  }
+
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**With input validation:**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { z } from "zod";
+
+const updateProfileSchema = z.object({
+  userId: z.string().uuid(),
+  name: z.string().min(1).max(100),
+  email: z.string().email(),
+});
+
+export async function updateProfile(data: unknown) {
+  // Validate input first
+  const validated = updateProfileSchema.parse(data);
+
+  // Then authenticate
+  const session = await verifySession();
+  if (!session) {
+    throw new Error("Unauthorized");
+  }
+
+  // Then authorize
+  if (session.user.id !== validated.userId) {
+    throw new Error("Can only update own profile");
+  }
+
+  // Finally perform the mutation
+  await db.user.update({
+    where: { id: validated.userId },
+    data: {
+      name: validated.name,
+      email: validated.email,
+    },
+  });
+
+  return { success: true };
+}
+```
+
+Reference: [https://nextjs.org/docs/app/guides/authentication](https://nextjs.org/docs/app/guides/authentication)
+
+### 3.2 Avoid Duplicate Serialization in RSC Props
+
+**Impact: LOW (reduces network payload by avoiding duplicate serialization)**
+
+RSC→client serialization deduplicates by object reference, not value. Same reference = serialized once; new reference = serialized again. Do transformations (`.toSorted()`, `.filter()`, `.map()`) in client, not server.
+
+**Incorrect: duplicates array**
+
+```tsx
+// RSC: sends 6 strings (2 arrays × 3 items)
+<ClientList usernames={usernames} usernamesOrdered={usernames.toSorted()} />
+```
+
+**Correct: sends 3 strings**
+
+```tsx
+// RSC: send once
+<ClientList usernames={usernames} />;
+
+// Client: transform there
+("use client");
+const sorted = useMemo(() => [...usernames].sort(), [usernames]);
+```
+
+**Nested deduplication behavior:**
+
+```tsx
+// string[] - duplicates everything
+usernames={['a','b']} sorted={usernames.toSorted()} // sends 4 strings
+
+// object[] - duplicates array structure only
+users={[{id:1},{id:2}]} sorted={users.toSorted()} // sends 2 arrays + 2 unique objects (not 4)
+```
+
+Deduplication works recursively. Impact varies by data type:
+
+- `string[]`, `number[]`, `boolean[]`: **HIGH impact** - array + all primitives fully duplicated
+
+- `object[]`: **LOW impact** - array duplicated, but nested objects deduplicated by reference
+
+**Operations breaking deduplication: create new references**
+
+- Arrays: `.toSorted()`, `.filter()`, `.map()`, `.slice()`, `[...arr]`
+
+- Objects: `{...obj}`, `Object.assign()`, `structuredClone()`, `JSON.parse(JSON.stringify())`
+
+**More examples:**
+
+```tsx
+// ❌ Bad
+<C users={users} active={users.filter(u => u.active)} />
+<C product={product} productName={product.name} />
+
+// ✅ Good
+<C users={users} />
+<C product={product} />
+// Do filtering/destructuring in client
+```
+
+**Exception:** Pass derived data when transformation is expensive or client doesn't need original.
+
+### 3.3 Cross-Request LRU Caching
+
+**Impact: HIGH (caches across requests)**
+
+`React.cache()` only works within one request. For data shared across sequential requests (user clicks button A then button B), use an LRU cache.
+
+**Implementation:**
+
+```typescript
+import { LRUCache } from "lru-cache";
+
+const cache = new LRUCache<string, any>({
+  max: 1000,
+  ttl: 5 * 60 * 1000, // 5 minutes
+});
+
+export async function getUser(id: string) {
+  const cached = cache.get(id);
+  if (cached) return cached;
+
+  const user = await db.user.findUnique({ where: { id } });
+  cache.set(id, user);
+  return user;
+}
+
+// Request 1: DB query, result cached
+// Request 2: cache hit, no DB query
+```
+
+Use when sequential user actions hit multiple endpoints needing the same data within seconds.
+
+**With Vercel's [Fluid Compute](https://vercel.com/docs/fluid-compute):** LRU caching is especially effective because multiple concurrent requests can share the same function instance and cache. This means the cache persists across requests without needing external storage like Redis.
+
+**In traditional serverless:** Each invocation runs in isolation, so consider Redis for cross-process caching.
+
+Reference: [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
+
+### 3.4 Minimize Serialization at RSC Boundaries
+
+**Impact: HIGH (reduces data transfer size)**
+
+The React Server/Client boundary serializes all object properties into strings and embeds them in the HTML response and subsequent RSC requests. This serialized data directly impacts page weight and load time, so **size matters a lot**. Only pass fields that the client actually uses.
+
+**Incorrect: serializes all 50 fields**
+
+```tsx
+async function Page() {
+  const user = await fetchUser(); // 50 fields
+  return <Profile user={user} />;
+}
+
+("use client");
+function Profile({ user }: { user: User }) {
+  return <div>{user.name}</div>; // uses 1 field
+}
+```
+
+**Correct: serializes only 1 field**
+
+```tsx
+async function Page() {
+  const user = await fetchUser();
+  return <Profile name={user.name} />;
+}
+
+("use client");
+function Profile({ name }: { name: string }) {
+  return <div>{name}</div>;
+}
+```
+
+### 3.5 Parallel Data Fetching with Component Composition
+
+**Impact: CRITICAL (eliminates server-side waterfalls)**
+
+React Server Components execute sequentially within a tree. Restructure with composition to parallelize data fetching.
+
+**Incorrect: Sidebar waits for Page's fetch to complete**
+
+```tsx
+export default async function Page() {
+  const header = await fetchHeader();
+  return (
+    <div>
+      <div>{header}</div>
+      <Sidebar />
+    </div>
+  );
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+```
+
+**Correct: both fetch simultaneously**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+export default function Page() {
+  return (
+    <div>
+      <Header />
+      <Sidebar />
+    </div>
+  );
+}
+```
+
+**Alternative with children prop:**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+function Layout({ children }: { children: ReactNode }) {
+  return (
+    <div>
+      <Header />
+      {children}
+    </div>
+  );
+}
+
+export default function Page() {
+  return (
+    <Layout>
+      <Sidebar />
+    </Layout>
+  );
+}
+```
+
+### 3.6 Per-Request Deduplication with React.cache()
+
+**Impact: MEDIUM (deduplicates within request)**
+
+Use `React.cache()` for server-side request deduplication. Authentication and database queries benefit most.
+
+**Usage:**
+
+```typescript
+import { cache } from "react";
+
+export const getCurrentUser = cache(async () => {
+  const session = await auth();
+  if (!session?.user?.id) return null;
+  return await db.user.findUnique({
+    where: { id: session.user.id },
+  });
+});
+```
+
+Within a single request, multiple calls to `getCurrentUser()` execute the query only once.
+
+**Avoid inline objects as arguments:**
+
+`React.cache()` uses shallow equality (`Object.is`) to determine cache hits. Inline objects create new references each call, preventing cache hits.
+
+**Incorrect: always cache miss**
+
+```typescript
+const getUser = cache(async (params: { uid: number }) => {
+  return await db.user.findUnique({ where: { id: params.uid } });
+});
+
+// Each call creates new object, never hits cache
+getUser({ uid: 1 });
+getUser({ uid: 1 }); // Cache miss, runs query again
+```
+
+**Correct: cache hit**
+
+```typescript
+const params = { uid: 1 };
+getUser(params); // Query runs
+getUser(params); // Cache hit (same reference)
+```
+
+If you must pass objects, pass the same reference:
+
+**Next.js-Specific Note:**
+
+In Next.js, the `fetch` API is automatically extended with request memoization. Requests with the same URL and options are automatically deduplicated within a single request, so you don't need `React.cache()` for `fetch` calls. However, `React.cache()` is still essential for other async tasks:
+
+- Database queries (Prisma, Drizzle, etc.)
+
+- Heavy computations
+
+- Authentication checks
+
+- File system operations
+
+- Any non-fetch async work
+
+Use `React.cache()` to deduplicate these operations across your component tree.
+
+Reference: [https://react.dev/reference/react/cache](https://react.dev/reference/react/cache)
+
+### 3.7 Use after() for Non-Blocking Operations
+
+**Impact: MEDIUM (faster response times)**
+
+Use Next.js's `after()` to schedule work that should execute after a response is sent. This prevents logging, analytics, and other side effects from blocking the response.
+
+**Incorrect: blocks response**
+
+```tsx
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Logging blocks the response
+  const userAgent = request.headers.get("user-agent") || "unknown";
+  await logUserAction({ userAgent });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+**Correct: non-blocking**
+
+```tsx
+import { after } from "next/server";
+import { headers, cookies } from "next/headers";
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Log after response is sent
+  after(async () => {
+    const userAgent = (await headers()).get("user-agent") || "unknown";
+    const sessionCookie =
+      (await cookies()).get("session-id")?.value || "anonymous";
+
+    logUserAction({ sessionCookie, userAgent });
+  });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+The response is sent immediately while logging happens in the background.
+
+**Common use cases:**
+
+- Analytics tracking
+
+- Audit logging
+
+- Sending notifications
+
+- Cache invalidation
+
+- Cleanup tasks
+
+**Important notes:**
+
+- `after()` runs even if the response fails or redirects
+
+- Works in Server Actions, Route Handlers, and Server Components
+
+Reference: [https://nextjs.org/docs/app/api-reference/functions/after](https://nextjs.org/docs/app/api-reference/functions/after)
+
+---
+
+## 4. Client-Side Data Fetching
+
+**Impact: MEDIUM-HIGH**
+
+Automatic deduplication and efficient data fetching patterns reduce redundant network requests.
+
+### 4.1 Deduplicate Global Event Listeners
+
+**Impact: LOW (single listener for N components)**
+
+Use `useSWRSubscription()` to share global event listeners across component instances.
+
+**Incorrect: N instances = N listeners**
+
+```tsx
+function useKeyboardShortcut(key: string, callback: () => void) {
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && e.key === key) {
+        callback();
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [key, callback]);
+}
+```
+
+When using the `useKeyboardShortcut` hook multiple times, each instance will register a new listener.
+
+**Correct: N instances = 1 listener**
+
+```tsx
+import useSWRSubscription from "swr/subscription";
+
+// Module-level Map to track callbacks per key
+const keyCallbacks = new Map<string, Set<() => void>>();
+
+function useKeyboardShortcut(key: string, callback: () => void) {
+  // Register this callback in the Map
+  useEffect(() => {
+    if (!keyCallbacks.has(key)) {
+      keyCallbacks.set(key, new Set());
+    }
+    keyCallbacks.get(key)!.add(callback);
+
+    return () => {
+      const set = keyCallbacks.get(key);
+      if (set) {
+        set.delete(callback);
+        if (set.size === 0) {
+          keyCallbacks.delete(key);
+        }
+      }
+    };
+  }, [key, callback]);
+
+  useSWRSubscription("global-keydown", () => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && keyCallbacks.has(e.key)) {
+        keyCallbacks.get(e.key)!.forEach((cb) => cb());
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  });
+}
+
+function Profile() {
+  // Multiple shortcuts will share the same listener
+  useKeyboardShortcut("p", () => {
+    /* ... */
+  });
+  useKeyboardShortcut("k", () => {
+    /* ... */
+  });
+  // ...
+}
+```
+
+### 4.2 Use Passive Event Listeners for Scrolling Performance
+
+**Impact: MEDIUM (eliminates scroll delay caused by event listeners)**
+
+Add `{ passive: true }` to touch and wheel event listeners to enable immediate scrolling. Browsers normally wait for listeners to finish to check if `preventDefault()` is called, causing scroll delay.
+
+**Incorrect:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch);
+  document.addEventListener("wheel", handleWheel);
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Correct:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch, { passive: true });
+  document.addEventListener("wheel", handleWheel, { passive: true });
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Use passive when:** tracking/analytics, logging, any listener that doesn't call `preventDefault()`.
+
+**Don't use passive when:** implementing custom swipe gestures, custom zoom controls, or any listener that needs `preventDefault()`.
+
+### 4.3 Use SWR for Automatic Deduplication
+
+**Impact: MEDIUM-HIGH (automatic deduplication)**
+
+SWR enables request deduplication, caching, and revalidation across component instances.
+
+**Incorrect: no deduplication, each instance fetches**
+
+```tsx
+function UserList() {
+  const [users, setUsers] = useState([]);
+  useEffect(() => {
+    fetch("/api/users")
+      .then((r) => r.json())
+      .then(setUsers);
+  }, []);
+}
+```
+
+**Correct: multiple instances share one request**
+
+```tsx
+import useSWR from "swr";
+
+function UserList() {
+  const { data: users } = useSWR("/api/users", fetcher);
+}
+```
+
+**For immutable data:**
+
+```tsx
+import { useImmutableSWR } from "@/lib/swr";
+
+function StaticContent() {
+  const { data } = useImmutableSWR("/api/config", fetcher);
+}
+```
+
+**For mutations:**
+
+```tsx
+import { useSWRMutation } from "swr/mutation";
+
+function UpdateButton() {
+  const { trigger } = useSWRMutation("/api/user", updateUser);
+  return <button onClick={() => trigger()}>Update</button>;
+}
+```
+
+Reference: [https://swr.vercel.app](https://swr.vercel.app)
+
+### 4.4 Version and Minimize localStorage Data
+
+**Impact: MEDIUM (prevents schema conflicts, reduces storage size)**
+
+Add version prefix to keys and store only needed fields. Prevents schema conflicts and accidental storage of sensitive data.
+
+**Incorrect:**
+
+```typescript
+// No version, stores everything, no error handling
+localStorage.setItem("userConfig", JSON.stringify(fullUserObject));
+const data = localStorage.getItem("userConfig");
+```
+
+**Correct:**
+
+```typescript
+const VERSION = "v2";
+
+function saveConfig(config: { theme: string; language: string }) {
+  try {
+    localStorage.setItem(`userConfig:${VERSION}`, JSON.stringify(config));
+  } catch {
+    // Throws in incognito/private browsing, quota exceeded, or disabled
+  }
+}
+
+function loadConfig() {
+  try {
+    const data = localStorage.getItem(`userConfig:${VERSION}`);
+    return data ? JSON.parse(data) : null;
+  } catch {
+    return null;
+  }
+}
+
+// Migration from v1 to v2
+function migrate() {
+  try {
+    const v1 = localStorage.getItem("userConfig:v1");
+    if (v1) {
+      const old = JSON.parse(v1);
+      saveConfig({
+        theme: old.darkMode ? "dark" : "light",
+        language: old.lang,
+      });
+      localStorage.removeItem("userConfig:v1");
+    }
+  } catch {}
+}
+```
+
+**Store minimal fields from server responses:**
+
+```typescript
+// User object has 20+ fields, only store what UI needs
+function cachePrefs(user: FullUser) {
+  try {
+    localStorage.setItem(
+      "prefs:v1",
+      JSON.stringify({
+        theme: user.preferences.theme,
+        notifications: user.preferences.notifications,
+      }),
+    );
+  } catch {}
+}
+```
+
+**Always wrap in try-catch:** `getItem()` and `setItem()` throw in incognito/private browsing (Safari, Firefox), when quota exceeded, or when disabled.
+
+**Benefits:** Schema evolution via versioning, reduced storage size, prevents storing tokens/PII/internal flags.
+
+---
+
+## 5. Re-render Optimization
+
+**Impact: MEDIUM**
+
+Reducing unnecessary re-renders minimizes wasted computation and improves UI responsiveness.
+
+### 5.1 Calculate Derived State During Rendering
+
+**Impact: MEDIUM (avoids redundant renders and state drift)**
+
+If a value can be computed from current props/state, do not store it in state or update it in an effect. Derive it during render to avoid extra renders and state drift. Do not set state in effects solely in response to prop changes; prefer derived values or keyed resets instead.
+
+**Incorrect: redundant state and effect**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const [fullName, setFullName] = useState("");
+
+  useEffect(() => {
+    setFullName(firstName + " " + lastName);
+  }, [firstName, lastName]);
+
+  return <p>{fullName}</p>;
+}
+```
+
+**Correct: derive during render**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const fullName = firstName + " " + lastName;
+
+  return <p>{fullName}</p>;
+}
+```
+
+Reference: [https://react.dev/learn/you-might-not-need-an-effect](https://react.dev/learn/you-might-not-need-an-effect)
+
+### 5.2 Defer State Reads to Usage Point
+
+**Impact: MEDIUM (avoids unnecessary subscriptions)**
+
+Don't subscribe to dynamic state (searchParams, localStorage) if you only read it inside callbacks.
+
+**Incorrect: subscribes to all searchParams changes**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const searchParams = useSearchParams();
+
+  const handleShare = () => {
+    const ref = searchParams.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+**Correct: reads on demand, no subscription**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const handleShare = () => {
+    const params = new URLSearchParams(window.location.search);
+    const ref = params.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+### 5.3 Do not wrap a simple expression with a primitive result type in useMemo
+
+**Impact: LOW-MEDIUM (wasted computation on every render)**
+
+When an expression is simple (few logical or arithmetical operators) and has a primitive result type (boolean, number, string), do not wrap it in `useMemo`.
+
+Calling `useMemo` and comparing hook dependencies may consume more resources than the expression itself.
+
+**Incorrect:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = useMemo(() => {
+    return user.isLoading || notifications.isLoading;
+  }, [user.isLoading, notifications.isLoading]);
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+**Correct:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = user.isLoading || notifications.isLoading;
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+### 5.4 Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+
+**Impact: MEDIUM (restores memoization by using a constant for default value)**
+
+When memoized component has a default value for some non-primitive optional parameter, such as an array, function, or object, calling the component without that parameter results in broken memoization. This is because new value instances are created on every rerender, and they do not pass strict equality comparison in `memo()`.
+
+To address this issue, extract the default value into a constant.
+
+**Incorrect: `onClick` has different values on every rerender**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ onClick = () => {} }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+**Correct: stable default value**
+
+```tsx
+const NOOP = () => {};
+
+const UserAvatar = memo(function UserAvatar({ onClick = NOOP }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+### 5.5 Extract to Memoized Components
+
+**Impact: MEDIUM (enables early returns)**
+
+Extract expensive work into memoized components to enable early returns before computation.
+
+**Incorrect: computes avatar even when loading**
+
+```tsx
+function Profile({ user, loading }: Props) {
+  const avatar = useMemo(() => {
+    const id = computeAvatarId(user);
+    return <Avatar id={id} />;
+  }, [user]);
+
+  if (loading) return <Skeleton />;
+  return <div>{avatar}</div>;
+}
+```
+
+**Correct: skips computation when loading**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ user }: { user: User }) {
+  const id = useMemo(() => computeAvatarId(user), [user]);
+  return <Avatar id={id} />;
+});
+
+function Profile({ user, loading }: Props) {
+  if (loading) return <Skeleton />;
+  return (
+    <div>
+      <UserAvatar user={user} />
+    </div>
+  );
+}
+```
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, manual memoization with `memo()` and `useMemo()` is not necessary. The compiler automatically optimizes re-renders.
+
+### 5.6 Narrow Effect Dependencies
+
+**Impact: LOW (minimizes effect re-runs)**
+
+Specify primitive dependencies instead of objects to minimize effect re-runs.
+
+**Incorrect: re-runs on any user field change**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user]);
+```
+
+**Correct: re-runs only when id changes**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user.id]);
+```
+
+**For derived state, compute outside effect:**
+
+```tsx
+// Incorrect: runs on width=767, 766, 765...
+useEffect(() => {
+  if (width < 768) {
+    enableMobileMode();
+  }
+}, [width]);
+
+// Correct: runs only on boolean transition
+const isMobile = width < 768;
+useEffect(() => {
+  if (isMobile) {
+    enableMobileMode();
+  }
+}, [isMobile]);
+```
+
+### 5.7 Put Interaction Logic in Event Handlers
+
+**Impact: MEDIUM (avoids effect re-runs and duplicate side effects)**
+
+If a side effect is triggered by a specific user action (submit, click, drag), run it in that event handler. Do not model the action as state + effect; it makes effects re-run on unrelated changes and can duplicate the action.
+
+**Incorrect: event modeled as state + effect**
+
+```tsx
+function Form() {
+  const [submitted, setSubmitted] = useState(false);
+  const theme = useContext(ThemeContext);
+
+  useEffect(() => {
+    if (submitted) {
+      post("/api/register");
+      showToast("Registered", theme);
+    }
+  }, [submitted, theme]);
+
+  return <button onClick={() => setSubmitted(true)}>Submit</button>;
+}
+```
+
+**Correct: do it in the handler**
+
+```tsx
+function Form() {
+  const theme = useContext(ThemeContext);
+
+  function handleSubmit() {
+    post("/api/register");
+    showToast("Registered", theme);
+  }
+
+  return <button onClick={handleSubmit}>Submit</button>;
+}
+```
+
+Reference: [https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler](https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler)
+
+### 5.8 Subscribe to Derived State
+
+**Impact: MEDIUM (reduces re-render frequency)**
+
+Subscribe to derived boolean state instead of continuous values to reduce re-render frequency.
+
+**Incorrect: re-renders on every pixel change**
+
+```tsx
+function Sidebar() {
+  const width = useWindowWidth(); // updates continuously
+  const isMobile = width < 768;
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+**Correct: re-renders only when boolean changes**
+
+```tsx
+function Sidebar() {
+  const isMobile = useMediaQuery("(max-width: 767px)");
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+### 5.9 Use Functional setState Updates
+
+**Impact: MEDIUM (prevents stale closures and unnecessary callback recreations)**
+
+When updating state based on the current state value, use the functional update form of setState instead of directly referencing the state variable. This prevents stale closures, eliminates unnecessary dependencies, and creates stable callback references.
+
+**Incorrect: requires state as dependency**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Callback must depend on items, recreated on every items change
+  const addItems = useCallback(
+    (newItems: Item[]) => {
+      setItems([...items, ...newItems]);
+    },
+    [items],
+  ); // ❌ items dependency causes recreations
+
+  // Risk of stale closure if dependency is forgotten
+  const removeItem = useCallback((id: string) => {
+    setItems(items.filter((item) => item.id !== id));
+  }, []); // ❌ Missing items dependency - will use stale items!
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+The first callback is recreated every time `items` changes, which can cause child components to re-render unnecessarily. The second callback has a stale closure bug—it will always reference the initial `items` value.
+
+**Correct: stable callbacks, no stale closures**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Stable callback, never recreated
+  const addItems = useCallback((newItems: Item[]) => {
+    setItems((curr) => [...curr, ...newItems]);
+  }, []); // ✅ No dependencies needed
+
+  // Always uses latest state, no stale closure risk
+  const removeItem = useCallback((id: string) => {
+    setItems((curr) => curr.filter((item) => item.id !== id));
+  }, []); // ✅ Safe and stable
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+**Benefits:**
+
+1. **Stable callback references** - Callbacks don't need to be recreated when state changes
+
+2. **No stale closures** - Always operates on the latest state value
+
+3. **Fewer dependencies** - Simplifies dependency arrays and reduces memory leaks
+
+4. **Prevents bugs** - Eliminates the most common source of React closure bugs
+
+**When to use functional updates:**
+
+- Any setState that depends on the current state value
+
+- Inside useCallback/useMemo when state is needed
+
+- Event handlers that reference state
+
+- Async operations that update state
+
+**When direct updates are fine:**
+
+- Setting state to a static value: `setCount(0)`
+
+- Setting state from props/arguments only: `setName(newName)`
+
+- State doesn't depend on previous value
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler can automatically optimize some cases, but functional updates are still recommended for correctness and to prevent stale closure bugs.
+
+### 5.10 Use Lazy State Initialization
+
+**Impact: MEDIUM (wasted computation on every render)**
+
+Pass a function to `useState` for expensive initial values. Without the function form, the initializer runs on every render even though the value is only used once.
+
+**Incorrect: runs on every render**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs on EVERY render, even after initialization
+  const [searchIndex, setSearchIndex] = useState(buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  // When query changes, buildSearchIndex runs again unnecessarily
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs on every render
+  const [settings, setSettings] = useState(
+    JSON.parse(localStorage.getItem("settings") || "{}"),
+  );
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+**Correct: runs only once**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs ONLY on initial render
+  const [searchIndex, setSearchIndex] = useState(() => buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs only on initial render
+  const [settings, setSettings] = useState(() => {
+    const stored = localStorage.getItem("settings");
+    return stored ? JSON.parse(stored) : {};
+  });
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+Use lazy initialization when computing initial values from localStorage/sessionStorage, building data structures (indexes, maps), reading from the DOM, or performing heavy transformations.
+
+For simple primitives (`useState(0)`), direct references (`useState(props.value)`), or cheap literals (`useState({})`), the function form is unnecessary.
+
+### 5.11 Use Transitions for Non-Urgent Updates
+
+**Impact: MEDIUM (maintains UI responsiveness)**
+
+Mark frequent, non-urgent state updates as transitions to maintain UI responsiveness.
+
+**Incorrect: blocks UI on every scroll**
+
+```tsx
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => setScrollY(window.scrollY);
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+**Correct: non-blocking updates**
+
+```tsx
+import { startTransition } from "react";
+
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => {
+      startTransition(() => setScrollY(window.scrollY));
+    };
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+### 5.12 Use useRef for Transient Values
+
+**Impact: MEDIUM (avoids unnecessary re-renders on frequent updates)**
+
+When a value changes frequently and you don't want a re-render on every update (e.g., mouse trackers, intervals, transient flags), store it in `useRef` instead of `useState`. Keep component state for UI; use refs for temporary DOM-adjacent values. Updating a ref does not trigger a re-render.
+
+**Incorrect: renders every update**
+
+```tsx
+function Tracker() {
+  const [lastX, setLastX] = useState(0);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => setLastX(e.clientX);
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      style={{
+        position: "fixed",
+        top: 0,
+        left: lastX,
+        width: 8,
+        height: 8,
+        background: "black",
+      }}
+    />
+  );
+}
+```
+
+**Correct: no re-render for tracking**
+
+```tsx
+function Tracker() {
+  const lastXRef = useRef(0);
+  const dotRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => {
+      lastXRef.current = e.clientX;
+      const node = dotRef.current;
+      if (node) {
+        node.style.transform = `translateX(${e.clientX}px)`;
+      }
+    };
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      ref={dotRef}
+      style={{
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: 8,
+        height: 8,
+        background: "black",
+        transform: "translateX(0px)",
+      }}
+    />
+  );
+}
+```
+
+---
+
+## 6. Rendering Performance
+
+**Impact: MEDIUM**
+
+Optimizing the rendering process reduces the work the browser needs to do.
+
+### 6.1 Animate SVG Wrapper Instead of SVG Element
+
+**Impact: LOW (enables hardware acceleration)**
+
+Many browsers don't have hardware acceleration for CSS3 animations on SVG elements. Wrap SVG in a `<div>` and animate the wrapper instead.
+
+**Incorrect: animating SVG directly - no hardware acceleration**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <svg className="animate-spin" width="24" height="24" viewBox="0 0 24 24">
+      <circle cx="12" cy="12" r="10" stroke="currentColor" />
+    </svg>
+  );
+}
+```
+
+**Correct: animating wrapper div - hardware accelerated**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <div className="animate-spin">
+      <svg width="24" height="24" viewBox="0 0 24 24">
+        <circle cx="12" cy="12" r="10" stroke="currentColor" />
+      </svg>
+    </div>
+  );
+}
+```
+
+This applies to all CSS transforms and transitions (`transform`, `opacity`, `translate`, `scale`, `rotate`). The wrapper div allows browsers to use GPU acceleration for smoother animations.
+
+### 6.2 CSS content-visibility for Long Lists
+
+**Impact: HIGH (faster initial render)**
+
+Apply `content-visibility: auto` to defer off-screen rendering.
+
+**CSS:**
+
+```css
+.message-item {
+  content-visibility: auto;
+  contain-intrinsic-size: 0 80px;
+}
+```
+
+**Example:**
+
+```tsx
+function MessageList({ messages }: { messages: Message[] }) {
+  return (
+    <div className="h-screen overflow-y-auto">
+      {messages.map((msg) => (
+        <div key={msg.id} className="message-item">
+          <Avatar user={msg.author} />
+          <div>{msg.content}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+```
+
+For 1000 messages, browser skips layout/paint for ~990 off-screen items (10× faster initial render).
+
+### 6.3 Hoist Static JSX Elements
+
+**Impact: LOW (avoids re-creation)**
+
+Extract static JSX outside components to avoid re-creation.
+
+**Incorrect: recreates element every render**
+
+```tsx
+function LoadingSkeleton() {
+  return <div className="h-20 animate-pulse bg-gray-200" />;
+}
+
+function Container() {
+  return <div>{loading && <LoadingSkeleton />}</div>;
+}
+```
+
+**Correct: reuses same element**
+
+```tsx
+const loadingSkeleton = <div className="h-20 animate-pulse bg-gray-200" />;
+
+function Container() {
+  return <div>{loading && loadingSkeleton}</div>;
+}
+```
+
+This is especially helpful for large and static SVG nodes, which can be expensive to recreate on every render.
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler automatically hoists static JSX elements and optimizes component re-renders, making manual hoisting unnecessary.
+
+### 6.4 Optimize SVG Precision
+
+**Impact: LOW (reduces file size)**
+
+Reduce SVG coordinate precision to decrease file size. The optimal precision depends on the viewBox size, but in general reducing precision should be considered.
+
+**Incorrect: excessive precision**
+
+```svg
+<path d="M 10.293847 20.847362 L 30.938472 40.192837" />
+```
+
+**Correct: 1 decimal place**
+
+```svg
+<path d="M 10.3 20.8 L 30.9 40.2" />
+```
+
+**Automate with SVGO:**
+
+```bash
+npx svgo --precision=1 --multipass icon.svg
+```
+
+### 6.5 Prevent Hydration Mismatch Without Flickering
+
+**Impact: MEDIUM (avoids visual flicker and hydration errors)**
+
+When rendering content that depends on client-side storage (localStorage, cookies), avoid both SSR breakage and post-hydration flickering by injecting a synchronous script that updates the DOM before React hydrates.
+
+**Incorrect: breaks SSR**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  // localStorage is not available on server - throws error
+  const theme = localStorage.getItem("theme") || "light";
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Server-side rendering will fail because `localStorage` is undefined.
+
+**Incorrect: visual flickering**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  const [theme, setTheme] = useState("light");
+
+  useEffect(() => {
+    // Runs after hydration - causes visible flash
+    const stored = localStorage.getItem("theme");
+    if (stored) {
+      setTheme(stored);
+    }
+  }, []);
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Component first renders with default value (`light`), then updates after hydration, causing a visible flash of incorrect content.
+
+**Correct: no flicker, no hydration mismatch**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  return (
+    <>
+      <div id="theme-wrapper">{children}</div>
+      <script
+        dangerouslySetInnerHTML={{
+          __html: `
+            (function() {
+              try {
+                var theme = localStorage.getItem('theme') || 'light';
+                var el = document.getElementById('theme-wrapper');
+                if (el) el.className = theme;
+              } catch (e) {}
+            })();
+          `,
+        }}
+      />
+    </>
+  );
+}
+```
+
+The inline script executes synchronously before showing the element, ensuring the DOM already has the correct value. No flickering, no hydration mismatch.
+
+This pattern is especially useful for theme toggles, user preferences, authentication states, and any client-only data that should render immediately without flashing default values.
+
+### 6.6 Suppress Expected Hydration Mismatches
+
+**Impact: LOW-MEDIUM (avoids noisy hydration warnings for known differences)**
+
+In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these _expected_ mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
+
+**Incorrect: known mismatch warnings**
+
+```tsx
+function Timestamp() {
+  return <span>{new Date().toLocaleString()}</span>;
+}
+```
+
+**Correct: suppress expected mismatch only**
+
+```tsx
+function Timestamp() {
+  return <span suppressHydrationWarning>{new Date().toLocaleString()}</span>;
+}
+```
+
+### 6.7 Use Activity Component for Show/Hide
+
+**Impact: MEDIUM (preserves state/DOM)**
+
+Use React's `<Activity>` to preserve state/DOM for expensive components that frequently toggle visibility.
+
+**Usage:**
+
+```tsx
+import { Activity } from "react";
+
+function Dropdown({ isOpen }: Props) {
+  return (
+    <Activity mode={isOpen ? "visible" : "hidden"}>
+      <ExpensiveMenu />
+    </Activity>
+  );
+}
+```
+
+Avoids expensive re-renders and state loss.
+
+### 6.8 Use Explicit Conditional Rendering
+
+**Impact: LOW (prevents rendering 0 or NaN)**
+
+Use explicit ternary operators (`? :`) instead of `&&` for conditional rendering when the condition can be `0`, `NaN`, or other falsy values that render.
+
+**Incorrect: renders "0" when count is 0**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count && <span className="badge">{count}</span>}</div>;
+}
+
+// When count = 0, renders: <div>0</div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+**Correct: renders nothing when count is 0**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count > 0 ? <span className="badge">{count}</span> : null}</div>;
+}
+
+// When count = 0, renders: <div></div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+### 6.9 Use useTransition Over Manual Loading States
+
+**Impact: LOW (reduces re-renders and improves code clarity)**
+
+Use `useTransition` instead of manual `useState` for loading states. This provides built-in `isPending` state and automatically manages transitions.
+
+**Incorrect: manual loading state**
+
+```tsx
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleSearch = async (value: string) => {
+    setIsLoading(true);
+    setQuery(value);
+    const data = await fetchResults(value);
+    setResults(data);
+    setIsLoading(false);
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isLoading && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Correct: useTransition with built-in pending state**
+
+```tsx
+import { useTransition, useState } from "react";
+
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isPending, startTransition] = useTransition();
+
+  const handleSearch = (value: string) => {
+    setQuery(value); // Update input immediately
+
+    startTransition(async () => {
+      // Fetch and update results
+      const data = await fetchResults(value);
+      setResults(data);
+    });
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isPending && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Benefits:**
+
+- **Automatic pending state**: No need to manually manage `setIsLoading(true/false)`
+
+- **Error resilience**: Pending state correctly resets even if the transition throws
+
+- **Better responsiveness**: Keeps the UI responsive during updates
+
+- **Interrupt handling**: New transitions automatically cancel pending ones
+
+Reference: [https://react.dev/reference/react/useTransition](https://react.dev/reference/react/useTransition)
+
+---
+
+## 7. JavaScript Performance
+
+**Impact: LOW-MEDIUM**
+
+Micro-optimizations for hot paths can add up to meaningful improvements.
+
+### 7.1 Avoid Layout Thrashing
+
+**Impact: MEDIUM (prevents forced synchronous layouts and reduces performance bottlenecks)**
+
+Avoid interleaving style writes with layout reads. When you read a layout property (like `offsetWidth`, `getBoundingClientRect()`, or `getComputedStyle()`) between style changes, the browser is forced to trigger a synchronous reflow.
+
+**This is OK: browser batches style changes**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Each line invalidates style, but browser batches the recalculation
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+}
+```
+
+**Incorrect: interleaved reads and writes force reflows**
+
+```typescript
+function layoutThrashing(element: HTMLElement) {
+  element.style.width = "100px";
+  const width = element.offsetWidth; // Forces reflow
+  element.style.height = "200px";
+  const height = element.offsetHeight; // Forces another reflow
+}
+```
+
+**Correct: batch writes, then read once**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Batch all writes together
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+
+  // Read after all writes are done (single reflow)
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Correct: batch reads, then writes**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  element.classList.add("highlighted-box");
+
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Better: use CSS classes**
+
+**React example:**
+
+```tsx
+// Incorrect: interleaving style changes with layout queries
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (ref.current && isHighlighted) {
+      ref.current.style.width = "100px";
+      const width = ref.current.offsetWidth; // Forces layout
+      ref.current.style.height = "200px";
+    }
+  }, [isHighlighted]);
+
+  return <div ref={ref}>Content</div>;
+}
+
+// Correct: toggle class
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  return <div className={isHighlighted ? "highlighted-box" : ""}>Content</div>;
+}
+```
+
+Prefer CSS classes over inline styles when possible. CSS files are cached by the browser, and classes provide better separation of concerns and are easier to maintain.
+
+See [this gist](https://gist.github.com/paulirish/5d52fb081b3570c81e3a) and [CSS Triggers](https://csstriggers.com/) for more information on layout-forcing operations.
+
+### 7.2 Build Index Maps for Repeated Lookups
+
+**Impact: LOW-MEDIUM (1M ops to 2K ops)**
+
+Multiple `.find()` calls by the same key should use a Map.
+
+**Incorrect (O(n) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  return orders.map((order) => ({
+    ...order,
+    user: users.find((u) => u.id === order.userId),
+  }));
+}
+```
+
+**Correct (O(1) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  const userById = new Map(users.map((u) => [u.id, u]));
+
+  return orders.map((order) => ({
+    ...order,
+    user: userById.get(order.userId),
+  }));
+}
+```
+
+Build map once (O(n)), then all lookups are O(1).
+
+For 1000 orders × 1000 users: 1M ops → 2K ops.
+
+### 7.3 Cache Property Access in Loops
+
+**Impact: LOW-MEDIUM (reduces lookups)**
+
+Cache object property lookups in hot paths.
+
+**Incorrect: 3 lookups × N iterations**
+
+```typescript
+for (let i = 0; i < arr.length; i++) {
+  process(obj.config.settings.value);
+}
+```
+
+**Correct: 1 lookup total**
+
+```typescript
+const value = obj.config.settings.value;
+const len = arr.length;
+for (let i = 0; i < len; i++) {
+  process(value);
+}
+```
+
+### 7.4 Cache Repeated Function Calls
+
+**Impact: MEDIUM (avoid redundant computation)**
+
+Use a module-level Map to cache function results when the same function is called repeatedly with the same inputs during render.
+
+**Incorrect: redundant computation**
+
+```typescript
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // slugify() called 100+ times for same project names
+        const slug = slugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Correct: cached results**
+
+```typescript
+// Module-level cache
+const slugifyCache = new Map<string, string>()
+
+function cachedSlugify(text: string): string {
+  if (slugifyCache.has(text)) {
+    return slugifyCache.get(text)!
+  }
+  const result = slugify(text)
+  slugifyCache.set(text, result)
+  return result
+}
+
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // Computed only once per unique project name
+        const slug = cachedSlugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Simpler pattern for single-value functions:**
+
+```typescript
+let isLoggedInCache: boolean | null = null;
+
+function isLoggedIn(): boolean {
+  if (isLoggedInCache !== null) {
+    return isLoggedInCache;
+  }
+
+  isLoggedInCache = document.cookie.includes("auth=");
+  return isLoggedInCache;
+}
+
+// Clear cache when auth changes
+function onAuthChange() {
+  isLoggedInCache = null;
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+Reference: [https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
+
+### 7.5 Cache Storage API Calls
+
+**Impact: LOW-MEDIUM (reduces expensive I/O)**
+
+`localStorage`, `sessionStorage`, and `document.cookie` are synchronous and expensive. Cache reads in memory.
+
+**Incorrect: reads storage on every call**
+
+```typescript
+function getTheme() {
+  return localStorage.getItem("theme") ?? "light";
+}
+// Called 10 times = 10 storage reads
+```
+
+**Correct: Map cache**
+
+```typescript
+const storageCache = new Map<string, string | null>();
+
+function getLocalStorage(key: string) {
+  if (!storageCache.has(key)) {
+    storageCache.set(key, localStorage.getItem(key));
+  }
+  return storageCache.get(key);
+}
+
+function setLocalStorage(key: string, value: string) {
+  localStorage.setItem(key, value);
+  storageCache.set(key, value); // keep cache in sync
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+**Cookie caching:**
+
+```typescript
+let cookieCache: Record<string, string> | null = null;
+
+function getCookie(name: string) {
+  if (!cookieCache) {
+    cookieCache = Object.fromEntries(
+      document.cookie.split("; ").map((c) => c.split("=")),
+    );
+  }
+  return cookieCache[name];
+}
+```
+
+**Important: invalidate on external changes**
+
+```typescript
+window.addEventListener("storage", (e) => {
+  if (e.key) storageCache.delete(e.key);
+});
+
+document.addEventListener("visibilitychange", () => {
+  if (document.visibilityState === "visible") {
+    storageCache.clear();
+  }
+});
+```
+
+If storage can change externally (another tab, server-set cookies), invalidate cache:
+
+### 7.6 Combine Multiple Array Iterations
+
+**Impact: LOW-MEDIUM (reduces iterations)**
+
+Multiple `.filter()` or `.map()` calls iterate the array multiple times. Combine into one loop.
+
+**Incorrect: 3 iterations**
+
+```typescript
+const admins = users.filter((u) => u.isAdmin);
+const testers = users.filter((u) => u.isTester);
+const inactive = users.filter((u) => !u.isActive);
+```
+
+**Correct: 1 iteration**
+
+```typescript
+const admins: User[] = [];
+const testers: User[] = [];
+const inactive: User[] = [];
+
+for (const user of users) {
+  if (user.isAdmin) admins.push(user);
+  if (user.isTester) testers.push(user);
+  if (!user.isActive) inactive.push(user);
+}
+```
+
+### 7.7 Early Length Check for Array Comparisons
+
+**Impact: MEDIUM-HIGH (avoids expensive operations when lengths differ)**
+
+When comparing arrays with expensive operations (sorting, deep equality, serialization), check lengths first. If lengths differ, the arrays cannot be equal.
+
+In real-world applications, this optimization is especially valuable when the comparison runs in hot paths (event handlers, render loops).
+
+**Incorrect: always runs expensive comparison**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Always sorts and joins, even when lengths differ
+  return current.sort().join() !== original.sort().join();
+}
+```
+
+Two O(n log n) sorts run even when `current.length` is 5 and `original.length` is 100. There is also overhead of joining the arrays and comparing the strings.
+
+**Correct (O(1) length check first):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Early return if lengths differ
+  if (current.length !== original.length) {
+    return true;
+  }
+  // Only sort when lengths match
+  const currentSorted = current.toSorted();
+  const originalSorted = original.toSorted();
+  for (let i = 0; i < currentSorted.length; i++) {
+    if (currentSorted[i] !== originalSorted[i]) {
+      return true;
+    }
+  }
+  return false;
+}
+```
+
+This new approach is more efficient because:
+
+- It avoids the overhead of sorting and joining the arrays when lengths differ
+
+- It avoids consuming memory for the joined strings (especially important for large arrays)
+
+- It avoids mutating the original arrays
+
+- It returns early when a difference is found
+
+### 7.8 Early Return from Functions
+
+**Impact: LOW-MEDIUM (avoids unnecessary computation)**
+
+Return early when result is determined to skip unnecessary processing.
+
+**Incorrect: processes all items even after finding answer**
+
+```typescript
+function validateUsers(users: User[]) {
+  let hasError = false;
+  let errorMessage = "";
+
+  for (const user of users) {
+    if (!user.email) {
+      hasError = true;
+      errorMessage = "Email required";
+    }
+    if (!user.name) {
+      hasError = true;
+      errorMessage = "Name required";
+    }
+    // Continues checking all users even after error found
+  }
+
+  return hasError ? { valid: false, error: errorMessage } : { valid: true };
+}
+```
+
+**Correct: returns immediately on first error**
+
+```typescript
+function validateUsers(users: User[]) {
+  for (const user of users) {
+    if (!user.email) {
+      return { valid: false, error: "Email required" };
+    }
+    if (!user.name) {
+      return { valid: false, error: "Name required" };
+    }
+  }
+
+  return { valid: true };
+}
+```
+
+### 7.9 Hoist RegExp Creation
+
+**Impact: LOW-MEDIUM (avoids recreation)**
+
+Don't create RegExp inside render. Hoist to module scope or memoize with `useMemo()`.
+
+**Incorrect: new RegExp every render**
+
+```tsx
+function Highlighter({ text, query }: Props) {
+  const regex = new RegExp(`(${query})`, 'gi')
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Correct: memoize or hoist**
+
+```tsx
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+
+function Highlighter({ text, query }: Props) {
+  const regex = useMemo(
+    () => new RegExp(`(${escapeRegex(query)})`, 'gi'),
+    [query]
+  )
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Warning: global regex has mutable state**
+
+```typescript
+const regex = /foo/g;
+regex.test("foo"); // true, lastIndex = 3
+regex.test("foo"); // false, lastIndex = 0
+```
+
+Global regex (`/g`) has mutable `lastIndex` state:
+
+### 7.10 Use Loop for Min/Max Instead of Sort
+
+**Impact: LOW (O(n) instead of O(n log n))**
+
+Finding the smallest or largest element only requires a single pass through the array. Sorting is wasteful and slower.
+
+**Incorrect (O(n log n) - sort to find latest):**
+
+```typescript
+interface Project {
+  id: string;
+  name: string;
+  updatedAt: number;
+}
+
+function getLatestProject(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => b.updatedAt - a.updatedAt);
+  return sorted[0];
+}
+```
+
+Sorts the entire array just to find the maximum value.
+
+**Incorrect (O(n log n) - sort for oldest and newest):**
+
+```typescript
+function getOldestAndNewest(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => a.updatedAt - b.updatedAt);
+  return { oldest: sorted[0], newest: sorted[sorted.length - 1] };
+}
+```
+
+Still sorts unnecessarily when only min/max are needed.
+
+**Correct (O(n) - single loop):**
+
+```typescript
+function getLatestProject(projects: Project[]) {
+  if (projects.length === 0) return null;
+
+  let latest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt > latest.updatedAt) {
+      latest = projects[i];
+    }
+  }
+
+  return latest;
+}
+
+function getOldestAndNewest(projects: Project[]) {
+  if (projects.length === 0) return { oldest: null, newest: null };
+
+  let oldest = projects[0];
+  let newest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt < oldest.updatedAt) oldest = projects[i];
+    if (projects[i].updatedAt > newest.updatedAt) newest = projects[i];
+  }
+
+  return { oldest, newest };
+}
+```
+
+Single pass through the array, no copying, no sorting.
+
+**Alternative: Math.min/Math.max for small arrays**
+
+```typescript
+const numbers = [5, 2, 8, 1, 9];
+const min = Math.min(...numbers);
+const max = Math.max(...numbers);
+```
+
+This works for small arrays, but can be slower or just throw an error for very large arrays due to spread operator limitations. Maximal array length is approximately 124000 in Chrome 143 and 638000 in Safari 18; exact numbers may vary - see [the fiddle](https://jsfiddle.net/qw1jabsx/4/). Use the loop approach for reliability.
+
+### 7.11 Use Set/Map for O(1) Lookups
+
+**Impact: LOW-MEDIUM (O(n) to O(1))**
+
+Convert arrays to Set/Map for repeated membership checks.
+
+**Incorrect (O(n) per check):**
+
+```typescript
+const allowedIds = ['a', 'b', 'c', ...]
+items.filter(item => allowedIds.includes(item.id))
+```
+
+**Correct (O(1) per check):**
+
+```typescript
+const allowedIds = new Set(['a', 'b', 'c', ...])
+items.filter(item => allowedIds.has(item.id))
+```
+
+### 7.12 Use toSorted() Instead of sort() for Immutability
+
+**Impact: MEDIUM-HIGH (prevents mutation bugs in React state)**
+
+`.sort()` mutates the array in place, which can cause bugs with React state and props. Use `.toSorted()` to create a new sorted array without mutation.
+
+**Incorrect: mutates original array**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Mutates the users prop array!
+  const sorted = useMemo(
+    () => users.sort((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Correct: creates new array**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Creates new sorted array, original unchanged
+  const sorted = useMemo(
+    () => users.toSorted((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Why this matters in React:**
+
+1. Props/state mutations break React's immutability model - React expects props and state to be treated as read-only
+
+2. Causes stale closure bugs - Mutating arrays inside closures (callbacks, effects) can lead to unexpected behavior
+
+**Browser support: fallback for older browsers**
+
+```typescript
+// Fallback for older browsers
+const sorted = [...items].sort((a, b) => a.value - b.value);
+```
+
+`.toSorted()` is available in all modern browsers (Chrome 110+, Safari 16+, Firefox 115+, Node.js 20+). For older environments, use spread operator:
+
+**Other immutable array methods:**
+
+- `.toSorted()` - immutable sort
+
+- `.toReversed()` - immutable reverse
+
+- `.toSpliced()` - immutable splice
+
+- `.with()` - immutable element replacement
+
+---
+
+## 8. Advanced Patterns
+
+**Impact: LOW**
+
+Advanced patterns for specific cases that require careful implementation.
+
+### 8.1 Initialize App Once, Not Per Mount
+
+**Impact: LOW-MEDIUM (avoids duplicate init in development)**
+
+Do not put app-wide initialization that must run once per app load inside `useEffect([])` of a component. Components can remount and effects will re-run. Use a module-level guard or top-level init in the entry module instead.
+
+**Incorrect: runs twice in dev, re-runs on remount**
+
+```tsx
+function Comp() {
+  useEffect(() => {
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+**Correct: once per app load**
+
+```tsx
+let didInit = false;
+
+function Comp() {
+  useEffect(() => {
+    if (didInit) return;
+    didInit = true;
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+Reference: [https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application](https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application)
+
+### 8.2 Store Event Handlers in Refs
+
+**Impact: LOW (stable subscriptions)**
+
+Store callbacks in refs when used in effects that shouldn't re-subscribe on callback changes.
+
+**Incorrect: re-subscribes on every render**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  useEffect(() => {
+    window.addEventListener(event, handler);
+    return () => window.removeEventListener(event, handler);
+  }, [event, handler]);
+}
+```
+
+**Correct: stable subscription**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function useWindowEvent(event: string, handler: (e) => void) {
+  const onEvent = useEffectEvent(handler);
+
+  useEffect(() => {
+    window.addEventListener(event, onEvent);
+    return () => window.removeEventListener(event, onEvent);
+  }, [event]);
+}
+```
+
+**Alternative: use `useEffectEvent` if you're on latest React:**
+
+`useEffectEvent` provides a cleaner API for the same pattern: it creates a stable function reference that always calls the latest version of the handler.
+
+### 8.3 useEffectEvent for Stable Callback Refs
+
+**Impact: LOW (prevents effect re-runs)**
+
+Access latest values in callbacks without adding them to dependency arrays. Prevents effect re-runs while avoiding stale closures.
+
+**Incorrect: effect re-runs on every callback change**
+
+```tsx
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearch(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query, onSearch]);
+}
+```
+
+**Correct: using React's useEffectEvent**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+  const onSearchEvent = useEffectEvent(onSearch);
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearchEvent(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query]);
+}
+```
+
+---
+
+## References
+
+1. [https://react.dev](https://react.dev)
+2. [https://nextjs.org](https://nextjs.org)
+3. [https://swr.vercel.app](https://swr.vercel.app)
+4. [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
+5. [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
+6. [https://vercel.com/blog/how-we-optimized-package-imports-in-next-js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
+7. [https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
diff --git a/.cursor/skills/vercel-react-best-practices/SKILL.md b/.cursor/skills/vercel-react-best-practices/SKILL.md
new file mode 100644
index 000000000..54fe8dc0e
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/SKILL.md
@@ -0,0 +1,138 @@
+---
+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
+
+Comprehensive performance optimization guide for React and Next.js applications, maintained by Vercel. Contains 57 rules across 8 categories, prioritized by impact to guide automated refactoring and code generation.
+
+## When to Apply
+
+Reference these guidelines when:
+
+- Writing new React components or Next.js pages
+- Implementing data fetching (client or server-side)
+- Reviewing code for performance issues
+- Refactoring existing React/Next.js code
+- Optimizing bundle size or load times
+
+## 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-`  |
+
+## Quick Reference
+
+### 1. Eliminating Waterfalls (CRITICAL)
+
+- `async-defer-await` - Move await into branches where actually used
+- `async-parallel` - Use Promise.all() for independent 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
+
+### 2. Bundle Size Optimization (CRITICAL)
+
+- `bundle-barrel-imports` - Import directly, avoid barrel files
+- `bundle-dynamic-imports` - Use next/dynamic for heavy components
+- `bundle-defer-third-party` - Load analytics/logging after hydration
+- `bundle-conditional` - Load modules only when feature is activated
+- `bundle-preload` - Preload on hover/focus for perceived speed
+
+### 3. Server-Side Performance (HIGH)
+
+- `server-auth-actions` - 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-serialization` - Minimize data passed to client components
+- `server-parallel-fetching` - Restructure components to parallelize fetches
+- `server-after-nonblocking` - Use after() for non-blocking operations
+
+### 4. Client-Side Data Fetching (MEDIUM-HIGH)
+
+- `client-swr-dedup` - Use SWR for automatic request deduplication
+- `client-event-listeners` - Deduplicate global event listeners
+- `client-passive-event-listeners` - Use passive listeners for scroll
+- `client-localstorage-schema` - Version and minimize localStorage data
+
+### 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
+- `rerender-derived-state` - Subscribe to derived booleans, not raw values
+- `rerender-derived-state-no-effect` - Derive state during render, not effects
+- `rerender-functional-setstate` - Use functional setState for stable callbacks
+- `rerender-lazy-state-init` - Pass function to useState for expensive values
+- `rerender-simple-expression-in-memo` - Avoid memo for simple primitives
+- `rerender-move-effect-to-event` - Put interaction logic in event handlers
+- `rerender-transitions` - Use startTransition for non-urgent updates
+- `rerender-use-ref-transient-values` - Use refs for transient frequent values
+
+### 6. Rendering Performance (MEDIUM)
+
+- `rendering-animate-svg-wrapper` - Animate div wrapper, not SVG element
+- `rendering-content-visibility` - Use content-visibility for long lists
+- `rendering-hoist-jsx` - Extract static JSX outside components
+- `rendering-svg-precision` - Reduce SVG coordinate precision
+- `rendering-hydration-no-flicker` - Use inline script for client-only data
+- `rendering-hydration-suppress-warning` - Suppress expected mismatches
+- `rendering-activity` - Use Activity component for show/hide
+- `rendering-conditional-render` - Use ternary, not && for conditionals
+- `rendering-usetransition-loading` - Prefer useTransition for loading state
+
+### 7. JavaScript Performance (LOW-MEDIUM)
+
+- `js-batch-dom-css` - Group CSS changes via classes or cssText
+- `js-index-maps` - Build Map for repeated lookups
+- `js-cache-property-access` - Cache object properties in loops
+- `js-cache-function-results` - Cache function results in module-level Map
+- `js-cache-storage` - Cache localStorage/sessionStorage reads
+- `js-combine-iterations` - Combine multiple filter/map into one loop
+- `js-length-check-first` - Check array length before expensive comparison
+- `js-early-exit` - Return early from functions
+- `js-hoist-regexp` - Hoist RegExp creation outside loops
+- `js-min-max-loop` - Use loop for min/max instead of sort
+- `js-set-map-lookups` - Use Set/Map for O(1) lookups
+- `js-tosorted-immutable` - Use toSorted() for immutability
+
+### 8. Advanced Patterns (LOW)
+
+- `advanced-event-handler-refs` - Store event handlers in refs
+- `advanced-init-once` - Initialize app once per app load
+- `advanced-use-latest` - useLatest for stable callback refs
+
+## How to Use
+
+Read individual rule files for detailed explanations and code examples:
+
+```
+rules/async-parallel.md
+rules/bundle-barrel-imports.md
+```
+
+Each rule file contains:
+
+- Brief explanation of why it matters
+- Incorrect code example with explanation
+- Correct code example with explanation
+- Additional context and references
+
+## Full Compiled Document
+
+For the complete guide with all rules expanded: `AGENTS.md`
diff --git a/.cursor/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md b/.cursor/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md
new file mode 100644
index 000000000..435261a66
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/advanced-event-handler-refs.md
@@ -0,0 +1,55 @@
+---
+title: Store Event Handlers in Refs
+impact: LOW
+impactDescription: stable subscriptions
+tags: advanced, hooks, refs, event-handlers, optimization
+---
+
+## Store Event Handlers in Refs
+
+Store callbacks in refs when used in effects that shouldn't re-subscribe on callback changes.
+
+**Incorrect (re-subscribes on every render):**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  useEffect(() => {
+    window.addEventListener(event, handler);
+    return () => window.removeEventListener(event, handler);
+  }, [event, handler]);
+}
+```
+
+**Correct (stable subscription):**
+
+```tsx
+function useWindowEvent(event: string, handler: (e) => void) {
+  const handlerRef = useRef(handler);
+  useEffect(() => {
+    handlerRef.current = handler;
+  }, [handler]);
+
+  useEffect(() => {
+    const listener = (e) => handlerRef.current(e);
+    window.addEventListener(event, listener);
+    return () => window.removeEventListener(event, listener);
+  }, [event]);
+}
+```
+
+**Alternative: use `useEffectEvent` if you're on latest React:**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function useWindowEvent(event: string, handler: (e) => void) {
+  const onEvent = useEffectEvent(handler);
+
+  useEffect(() => {
+    window.addEventListener(event, onEvent);
+    return () => window.removeEventListener(event, onEvent);
+  }, [event]);
+}
+```
+
+`useEffectEvent` provides a cleaner API for the same pattern: it creates a stable function reference that always calls the latest version of the handler.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/advanced-init-once.md b/.cursor/skills/vercel-react-best-practices/rules/advanced-init-once.md
new file mode 100644
index 000000000..1cf8de795
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/advanced-init-once.md
@@ -0,0 +1,42 @@
+---
+title: Initialize App Once, Not Per Mount
+impact: LOW-MEDIUM
+impactDescription: avoids duplicate init in development
+tags: initialization, useEffect, app-startup, side-effects
+---
+
+## Initialize App Once, Not Per Mount
+
+Do not put app-wide initialization that must run once per app load inside `useEffect([])` of a component. Components can remount and effects will re-run. Use a module-level guard or top-level init in the entry module instead.
+
+**Incorrect (runs twice in dev, re-runs on remount):**
+
+```tsx
+function Comp() {
+  useEffect(() => {
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+**Correct (once per app load):**
+
+```tsx
+let didInit = false;
+
+function Comp() {
+  useEffect(() => {
+    if (didInit) return;
+    didInit = true;
+    loadFromStorage();
+    checkAuthToken();
+  }, []);
+
+  // ...
+}
+```
+
+Reference: [Initializing the application](https://react.dev/learn/you-might-not-need-an-effect#initializing-the-application)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/advanced-use-latest.md b/.cursor/skills/vercel-react-best-practices/rules/advanced-use-latest.md
new file mode 100644
index 000000000..45e2842da
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/advanced-use-latest.md
@@ -0,0 +1,39 @@
+---
+title: useEffectEvent for Stable Callback Refs
+impact: LOW
+impactDescription: prevents effect re-runs
+tags: advanced, hooks, useEffectEvent, refs, optimization
+---
+
+## useEffectEvent for Stable Callback Refs
+
+Access latest values in callbacks without adding them to dependency arrays. Prevents effect re-runs while avoiding stale closures.
+
+**Incorrect (effect re-runs on every callback change):**
+
+```tsx
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearch(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query, onSearch]);
+}
+```
+
+**Correct (using React's useEffectEvent):**
+
+```tsx
+import { useEffectEvent } from "react";
+
+function SearchInput({ onSearch }: { onSearch: (q: string) => void }) {
+  const [query, setQuery] = useState("");
+  const onSearchEvent = useEffectEvent(onSearch);
+
+  useEffect(() => {
+    const timeout = setTimeout(() => onSearchEvent(query), 300);
+    return () => clearTimeout(timeout);
+  }, [query]);
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/async-api-routes.md b/.cursor/skills/vercel-react-best-practices/rules/async-api-routes.md
new file mode 100644
index 000000000..833833183
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/async-api-routes.md
@@ -0,0 +1,38 @@
+---
+title: Prevent Waterfall Chains in API Routes
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: api-routes, server-actions, waterfalls, parallelization
+---
+
+## Prevent Waterfall Chains in API Routes
+
+In API routes and Server Actions, start independent operations immediately, even if you don't await them yet.
+
+**Incorrect (config waits for auth, data waits for both):**
+
+```typescript
+export async function GET(request: Request) {
+  const session = await auth();
+  const config = await fetchConfig();
+  const data = await fetchData(session.user.id);
+  return Response.json({ data, config });
+}
+```
+
+**Correct (auth and config start immediately):**
+
+```typescript
+export async function GET(request: Request) {
+  const sessionPromise = auth();
+  const configPromise = fetchConfig();
+  const session = await sessionPromise;
+  const [config, data] = await Promise.all([
+    configPromise,
+    fetchData(session.user.id),
+  ]);
+  return Response.json({ data, config });
+}
+```
+
+For operations with more complex dependency chains, use `better-all` to automatically maximize parallelism (see Dependency-Based Parallelization).
diff --git a/.cursor/skills/vercel-react-best-practices/rules/async-defer-await.md b/.cursor/skills/vercel-react-best-practices/rules/async-defer-await.md
new file mode 100644
index 000000000..2b4d821db
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/async-defer-await.md
@@ -0,0 +1,80 @@
+---
+title: Defer Await Until Needed
+impact: HIGH
+impactDescription: avoids blocking unused code paths
+tags: async, await, conditional, optimization
+---
+
+## Defer Await Until Needed
+
+Move `await` operations into the branches where they're actually used to avoid blocking code paths that don't need them.
+
+**Incorrect (blocks both branches):**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  const userData = await fetchUserData(userId);
+
+  if (skipProcessing) {
+    // Returns immediately but still waited for userData
+    return { skipped: true };
+  }
+
+  // Only this branch uses userData
+  return processUserData(userData);
+}
+```
+
+**Correct (only blocks when needed):**
+
+```typescript
+async function handleRequest(userId: string, skipProcessing: boolean) {
+  if (skipProcessing) {
+    // Returns immediately without waiting
+    return { skipped: true };
+  }
+
+  // Fetch only when needed
+  const userData = await fetchUserData(userId);
+  return processUserData(userData);
+}
+```
+
+**Another example (early return optimization):**
+
+```typescript
+// Incorrect: always fetches permissions
+async function updateResource(resourceId: string, userId: string) {
+  const permissions = await fetchPermissions(userId);
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+
+// Correct: fetches only when needed
+async function updateResource(resourceId: string, userId: string) {
+  const resource = await getResource(resourceId);
+
+  if (!resource) {
+    return { error: "Not found" };
+  }
+
+  const permissions = await fetchPermissions(userId);
+
+  if (!permissions.canEdit) {
+    return { error: "Forbidden" };
+  }
+
+  return await updateResourceData(resource, permissions);
+}
+```
+
+This optimization is especially valuable when the skipped branch is frequently taken, or when the deferred operation is expensive.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/async-dependencies.md b/.cursor/skills/vercel-react-best-practices/rules/async-dependencies.md
new file mode 100644
index 000000000..405074d9f
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/async-dependencies.md
@@ -0,0 +1,52 @@
+---
+title: Dependency-Based Parallelization
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: async, parallelization, dependencies, better-all
+---
+
+## Dependency-Based Parallelization
+
+For operations with partial dependencies, use `better-all` to maximize parallelism. It automatically starts each task at the earliest possible moment.
+
+**Incorrect (profile waits for config unnecessarily):**
+
+```typescript
+const [user, config] = await Promise.all([fetchUser(), fetchConfig()]);
+const profile = await fetchProfile(user.id);
+```
+
+**Correct (config and profile run in parallel):**
+
+```typescript
+import { all } from "better-all";
+
+const { user, config, profile } = await all({
+  async user() {
+    return fetchUser();
+  },
+  async config() {
+    return fetchConfig();
+  },
+  async profile() {
+    return fetchProfile((await this.$.user).id);
+  },
+});
+```
+
+**Alternative without extra dependencies:**
+
+We can also create all the promises first, and do `Promise.all()` at the end.
+
+```typescript
+const userPromise = fetchUser();
+const profilePromise = userPromise.then((user) => fetchProfile(user.id));
+
+const [user, config, profile] = await Promise.all([
+  userPromise,
+  fetchConfig(),
+  profilePromise,
+]);
+```
+
+Reference: [https://github.com/shuding/better-all](https://github.com/shuding/better-all)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/async-parallel.md b/.cursor/skills/vercel-react-best-practices/rules/async-parallel.md
new file mode 100644
index 000000000..91102101e
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/async-parallel.md
@@ -0,0 +1,28 @@
+---
+title: Promise.all() for Independent Operations
+impact: CRITICAL
+impactDescription: 2-10× improvement
+tags: async, parallelization, promises, waterfalls
+---
+
+## Promise.all() for Independent Operations
+
+When async operations have no interdependencies, execute them concurrently using `Promise.all()`.
+
+**Incorrect (sequential execution, 3 round trips):**
+
+```typescript
+const user = await fetchUser();
+const posts = await fetchPosts();
+const comments = await fetchComments();
+```
+
+**Correct (parallel execution, 1 round trip):**
+
+```typescript
+const [user, posts, comments] = await Promise.all([
+  fetchUser(),
+  fetchPosts(),
+  fetchComments(),
+]);
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md b/.cursor/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md
new file mode 100644
index 000000000..790027e5d
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/async-suspense-boundaries.md
@@ -0,0 +1,99 @@
+---
+title: Strategic Suspense Boundaries
+impact: HIGH
+impactDescription: faster initial paint
+tags: async, suspense, streaming, layout-shift
+---
+
+## Strategic Suspense Boundaries
+
+Instead of awaiting data in async components before returning JSX, use Suspense boundaries to show the wrapper UI faster while data loads.
+
+**Incorrect (wrapper blocked by data fetching):**
+
+```tsx
+async function Page() {
+  const data = await fetchData(); // Blocks entire page
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <DataDisplay data={data} />
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+```
+
+The entire layout waits for data even though only the middle section needs it.
+
+**Correct (wrapper shows immediately, data streams in):**
+
+```tsx
+function Page() {
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <div>
+        <Suspense fallback={<Skeleton />}>
+          <DataDisplay />
+        </Suspense>
+      </div>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+async function DataDisplay() {
+  const data = await fetchData(); // Only blocks this component
+  return <div>{data.content}</div>;
+}
+```
+
+Sidebar, Header, and Footer render immediately. Only DataDisplay waits for data.
+
+**Alternative (share promise across components):**
+
+```tsx
+function Page() {
+  // Start fetch immediately, but don't await
+  const dataPromise = fetchData();
+
+  return (
+    <div>
+      <div>Sidebar</div>
+      <div>Header</div>
+      <Suspense fallback={<Skeleton />}>
+        <DataDisplay dataPromise={dataPromise} />
+        <DataSummary dataPromise={dataPromise} />
+      </Suspense>
+      <div>Footer</div>
+    </div>
+  );
+}
+
+function DataDisplay({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Unwraps the promise
+  return <div>{data.content}</div>;
+}
+
+function DataSummary({ dataPromise }: { dataPromise: Promise<Data> }) {
+  const data = use(dataPromise); // Reuses the same promise
+  return <div>{data.summary}</div>;
+}
+```
+
+Both components share the same promise, so only one fetch occurs. Layout renders immediately while both components wait together.
+
+**When NOT to use this pattern:**
+
+- Critical data needed for layout decisions (affects positioning)
+- SEO-critical content above the fold
+- Small, fast queries where suspense overhead isn't worth it
+- When you want to avoid layout shift (loading → content jump)
+
+**Trade-off:** Faster initial paint vs potential layout shift. Choose based on your UX priorities.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md b/.cursor/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md
new file mode 100644
index 000000000..8b038a57c
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/bundle-barrel-imports.md
@@ -0,0 +1,59 @@
+---
+title: Avoid Barrel File Imports
+impact: CRITICAL
+impactDescription: 200-800ms import cost, slow builds
+tags: bundle, imports, tree-shaking, barrel-files, performance
+---
+
+## Avoid Barrel File Imports
+
+Import directly from source files instead of barrel files to avoid loading thousands of unused modules. **Barrel files** are entry points that re-export multiple modules (e.g., `index.js` that does `export * from './module'`).
+
+Popular icon and component libraries can have **up to 10,000 re-exports** in their entry file. For many React packages, **it takes 200-800ms just to import them**, affecting both development speed and production cold starts.
+
+**Why tree-shaking doesn't help:** When a library is marked as external (not bundled), the bundler can't optimize it. If you bundle it to enable tree-shaking, builds become substantially slower analyzing the entire module graph.
+
+**Incorrect (imports entire library):**
+
+```tsx
+import { Check, X, Menu } from "lucide-react";
+// Loads 1,583 modules, takes ~2.8s extra in dev
+// Runtime cost: 200-800ms on every cold start
+
+import { Button, TextField } from "@mui/material";
+// Loads 2,225 modules, takes ~4.2s extra in dev
+```
+
+**Correct (imports only what you need):**
+
+```tsx
+import Check from "lucide-react/dist/esm/icons/check";
+import X from "lucide-react/dist/esm/icons/x";
+import Menu from "lucide-react/dist/esm/icons/menu";
+// Loads only 3 modules (~2KB vs ~1MB)
+
+import Button from "@mui/material/Button";
+import TextField from "@mui/material/TextField";
+// Loads only what you use
+```
+
+**Alternative (Next.js 13.5+):**
+
+```js
+// next.config.js - use optimizePackageImports
+module.exports = {
+  experimental: {
+    optimizePackageImports: ["lucide-react", "@mui/material"],
+  },
+};
+
+// Then you can keep the ergonomic barrel imports:
+import { Check, X, Menu } from "lucide-react";
+// Automatically transformed to direct imports at build time
+```
+
+Direct imports provide 15-70% faster dev boot, 28% faster builds, 40% faster cold starts, and significantly faster HMR.
+
+Libraries commonly affected: `lucide-react`, `@mui/material`, `@mui/icons-material`, `@tabler/icons-react`, `react-icons`, `@headlessui/react`, `@radix-ui/react-*`, `lodash`, `ramda`, `date-fns`, `rxjs`, `react-use`.
+
+Reference: [How we optimized package imports in Next.js](https://vercel.com/blog/how-we-optimized-package-imports-in-next-js)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/bundle-conditional.md b/.cursor/skills/vercel-react-best-practices/rules/bundle-conditional.md
new file mode 100644
index 000000000..a541a0208
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/bundle-conditional.md
@@ -0,0 +1,37 @@
+---
+title: Conditional Module Loading
+impact: HIGH
+impactDescription: loads large data only when needed
+tags: bundle, conditional-loading, lazy-loading
+---
+
+## Conditional Module Loading
+
+Load large data or modules only when a feature is activated.
+
+**Example (lazy-load animation frames):**
+
+```tsx
+function AnimationPlayer({
+  enabled,
+  setEnabled,
+}: {
+  enabled: boolean;
+  setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
+}) {
+  const [frames, setFrames] = useState<Frame[] | null>(null);
+
+  useEffect(() => {
+    if (enabled && !frames && typeof window !== "undefined") {
+      import("./animation-frames.js")
+        .then((mod) => setFrames(mod.frames))
+        .catch(() => setEnabled(false));
+    }
+  }, [enabled, frames, setEnabled]);
+
+  if (!frames) return <Skeleton />;
+  return <Canvas frames={frames} />;
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md b/.cursor/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md
new file mode 100644
index 000000000..b65b097d1
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/bundle-defer-third-party.md
@@ -0,0 +1,49 @@
+---
+title: Defer Non-Critical Third-Party Libraries
+impact: MEDIUM
+impactDescription: loads after hydration
+tags: bundle, third-party, analytics, defer
+---
+
+## Defer Non-Critical Third-Party Libraries
+
+Analytics, logging, and error tracking don't block user interaction. Load them after hydration.
+
+**Incorrect (blocks initial bundle):**
+
+```tsx
+import { Analytics } from "@vercel/analytics/react";
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
+
+**Correct (loads after hydration):**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const Analytics = dynamic(
+  () => import("@vercel/analytics/react").then((m) => m.Analytics),
+  { ssr: false },
+);
+
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <body>
+        {children}
+        <Analytics />
+      </body>
+    </html>
+  );
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md b/.cursor/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md
new file mode 100644
index 000000000..4fbd3d937
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/bundle-dynamic-imports.md
@@ -0,0 +1,35 @@
+---
+title: Dynamic Imports for Heavy Components
+impact: CRITICAL
+impactDescription: directly affects TTI and LCP
+tags: bundle, dynamic-import, code-splitting, next-dynamic
+---
+
+## Dynamic Imports for Heavy Components
+
+Use `next/dynamic` to lazy-load large components not needed on initial render.
+
+**Incorrect (Monaco bundles with main chunk ~300KB):**
+
+```tsx
+import { MonacoEditor } from "./monaco-editor";
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
+
+**Correct (Monaco loads on demand):**
+
+```tsx
+import dynamic from "next/dynamic";
+
+const MonacoEditor = dynamic(
+  () => import("./monaco-editor").then((m) => m.MonacoEditor),
+  { ssr: false },
+);
+
+function CodePanel({ code }: { code: string }) {
+  return <MonacoEditor value={code} />;
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/bundle-preload.md b/.cursor/skills/vercel-react-best-practices/rules/bundle-preload.md
new file mode 100644
index 000000000..d38946dc7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/bundle-preload.md
@@ -0,0 +1,46 @@
+---
+title: Preload Based on User Intent
+impact: MEDIUM
+impactDescription: reduces perceived latency
+tags: bundle, preload, user-intent, hover
+---
+
+## Preload Based on User Intent
+
+Preload heavy bundles before they're needed to reduce perceived latency.
+
+**Example (preload on hover/focus):**
+
+```tsx
+function EditorButton({ onClick }: { onClick: () => void }) {
+  const preload = () => {
+    if (typeof window !== "undefined") {
+      void import("./monaco-editor");
+    }
+  };
+
+  return (
+    <button onMouseEnter={preload} onFocus={preload} onClick={onClick}>
+      Open Editor
+    </button>
+  );
+}
+```
+
+**Example (preload when feature flag is enabled):**
+
+```tsx
+function FlagsProvider({ children, flags }: Props) {
+  useEffect(() => {
+    if (flags.editorEnabled && typeof window !== "undefined") {
+      void import("./monaco-editor").then((mod) => mod.init());
+    }
+  }, [flags.editorEnabled]);
+
+  return (
+    <FlagsContext.Provider value={flags}>{children}</FlagsContext.Provider>
+  );
+}
+```
+
+The `typeof window !== 'undefined'` check prevents bundling preloaded modules for SSR, optimizing server bundle size and build speed.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/client-event-listeners.md b/.cursor/skills/vercel-react-best-practices/rules/client-event-listeners.md
new file mode 100644
index 000000000..a40d82ae0
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/client-event-listeners.md
@@ -0,0 +1,78 @@
+---
+title: Deduplicate Global Event Listeners
+impact: LOW
+impactDescription: single listener for N components
+tags: client, swr, event-listeners, subscription
+---
+
+## Deduplicate Global Event Listeners
+
+Use `useSWRSubscription()` to share global event listeners across component instances.
+
+**Incorrect (N instances = N listeners):**
+
+```tsx
+function useKeyboardShortcut(key: string, callback: () => void) {
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && e.key === key) {
+        callback();
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [key, callback]);
+}
+```
+
+When using the `useKeyboardShortcut` hook multiple times, each instance will register a new listener.
+
+**Correct (N instances = 1 listener):**
+
+```tsx
+import useSWRSubscription from "swr/subscription";
+
+// Module-level Map to track callbacks per key
+const keyCallbacks = new Map<string, Set<() => void>>();
+
+function useKeyboardShortcut(key: string, callback: () => void) {
+  // Register this callback in the Map
+  useEffect(() => {
+    if (!keyCallbacks.has(key)) {
+      keyCallbacks.set(key, new Set());
+    }
+    keyCallbacks.get(key)!.add(callback);
+
+    return () => {
+      const set = keyCallbacks.get(key);
+      if (set) {
+        set.delete(callback);
+        if (set.size === 0) {
+          keyCallbacks.delete(key);
+        }
+      }
+    };
+  }, [key, callback]);
+
+  useSWRSubscription("global-keydown", () => {
+    const handler = (e: KeyboardEvent) => {
+      if (e.metaKey && keyCallbacks.has(e.key)) {
+        keyCallbacks.get(e.key)!.forEach((cb) => cb());
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  });
+}
+
+function Profile() {
+  // Multiple shortcuts will share the same listener
+  useKeyboardShortcut("p", () => {
+    /* ... */
+  });
+  useKeyboardShortcut("k", () => {
+    /* ... */
+  });
+  // ...
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/client-localstorage-schema.md b/.cursor/skills/vercel-react-best-practices/rules/client-localstorage-schema.md
new file mode 100644
index 000000000..7c4d8c957
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/client-localstorage-schema.md
@@ -0,0 +1,77 @@
+---
+title: Version and Minimize localStorage Data
+impact: MEDIUM
+impactDescription: prevents schema conflicts, reduces storage size
+tags: client, localStorage, storage, versioning, data-minimization
+---
+
+## Version and Minimize localStorage Data
+
+Add version prefix to keys and store only needed fields. Prevents schema conflicts and accidental storage of sensitive data.
+
+**Incorrect:**
+
+```typescript
+// No version, stores everything, no error handling
+localStorage.setItem("userConfig", JSON.stringify(fullUserObject));
+const data = localStorage.getItem("userConfig");
+```
+
+**Correct:**
+
+```typescript
+const VERSION = "v2";
+
+function saveConfig(config: { theme: string; language: string }) {
+  try {
+    localStorage.setItem(`userConfig:${VERSION}`, JSON.stringify(config));
+  } catch {
+    // Throws in incognito/private browsing, quota exceeded, or disabled
+  }
+}
+
+function loadConfig() {
+  try {
+    const data = localStorage.getItem(`userConfig:${VERSION}`);
+    return data ? JSON.parse(data) : null;
+  } catch {
+    return null;
+  }
+}
+
+// Migration from v1 to v2
+function migrate() {
+  try {
+    const v1 = localStorage.getItem("userConfig:v1");
+    if (v1) {
+      const old = JSON.parse(v1);
+      saveConfig({
+        theme: old.darkMode ? "dark" : "light",
+        language: old.lang,
+      });
+      localStorage.removeItem("userConfig:v1");
+    }
+  } catch {}
+}
+```
+
+**Store minimal fields from server responses:**
+
+```typescript
+// User object has 20+ fields, only store what UI needs
+function cachePrefs(user: FullUser) {
+  try {
+    localStorage.setItem(
+      "prefs:v1",
+      JSON.stringify({
+        theme: user.preferences.theme,
+        notifications: user.preferences.notifications,
+      }),
+    );
+  } catch {}
+}
+```
+
+**Always wrap in try-catch:** `getItem()` and `setItem()` throw in incognito/private browsing (Safari, Firefox), when quota exceeded, or when disabled.
+
+**Benefits:** Schema evolution via versioning, reduced storage size, prevents storing tokens/PII/internal flags.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md b/.cursor/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md
new file mode 100644
index 000000000..63da92631
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/client-passive-event-listeners.md
@@ -0,0 +1,48 @@
+---
+title: Use Passive Event Listeners for Scrolling Performance
+impact: MEDIUM
+impactDescription: eliminates scroll delay caused by event listeners
+tags: client, event-listeners, scrolling, performance, touch, wheel
+---
+
+## Use Passive Event Listeners for Scrolling Performance
+
+Add `{ passive: true }` to touch and wheel event listeners to enable immediate scrolling. Browsers normally wait for listeners to finish to check if `preventDefault()` is called, causing scroll delay.
+
+**Incorrect:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch);
+  document.addEventListener("wheel", handleWheel);
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Correct:**
+
+```typescript
+useEffect(() => {
+  const handleTouch = (e: TouchEvent) => console.log(e.touches[0].clientX);
+  const handleWheel = (e: WheelEvent) => console.log(e.deltaY);
+
+  document.addEventListener("touchstart", handleTouch, { passive: true });
+  document.addEventListener("wheel", handleWheel, { passive: true });
+
+  return () => {
+    document.removeEventListener("touchstart", handleTouch);
+    document.removeEventListener("wheel", handleWheel);
+  };
+}, []);
+```
+
+**Use passive when:** tracking/analytics, logging, any listener that doesn't call `preventDefault()`.
+
+**Don't use passive when:** implementing custom swipe gestures, custom zoom controls, or any listener that needs `preventDefault()`.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/client-swr-dedup.md b/.cursor/skills/vercel-react-best-practices/rules/client-swr-dedup.md
new file mode 100644
index 000000000..a056b4271
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/client-swr-dedup.md
@@ -0,0 +1,56 @@
+---
+title: Use SWR for Automatic Deduplication
+impact: MEDIUM-HIGH
+impactDescription: automatic deduplication
+tags: client, swr, deduplication, data-fetching
+---
+
+## Use SWR for Automatic Deduplication
+
+SWR enables request deduplication, caching, and revalidation across component instances.
+
+**Incorrect (no deduplication, each instance fetches):**
+
+```tsx
+function UserList() {
+  const [users, setUsers] = useState([]);
+  useEffect(() => {
+    fetch("/api/users")
+      .then((r) => r.json())
+      .then(setUsers);
+  }, []);
+}
+```
+
+**Correct (multiple instances share one request):**
+
+```tsx
+import useSWR from "swr";
+
+function UserList() {
+  const { data: users } = useSWR("/api/users", fetcher);
+}
+```
+
+**For immutable data:**
+
+```tsx
+import { useImmutableSWR } from "@/lib/swr";
+
+function StaticContent() {
+  const { data } = useImmutableSWR("/api/config", fetcher);
+}
+```
+
+**For mutations:**
+
+```tsx
+import { useSWRMutation } from "swr/mutation";
+
+function UpdateButton() {
+  const { trigger } = useSWRMutation("/api/user", updateUser);
+  return <button onClick={() => trigger()}>Update</button>;
+}
+```
+
+Reference: [https://swr.vercel.app](https://swr.vercel.app)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-batch-dom-css.md b/.cursor/skills/vercel-react-best-practices/rules/js-batch-dom-css.md
new file mode 100644
index 000000000..5a7fc2b0d
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-batch-dom-css.md
@@ -0,0 +1,110 @@
+---
+title: Avoid Layout Thrashing
+impact: MEDIUM
+impactDescription: prevents forced synchronous layouts and reduces performance bottlenecks
+tags: javascript, dom, css, performance, reflow, layout-thrashing
+---
+
+## Avoid Layout Thrashing
+
+Avoid interleaving style writes with layout reads. When you read a layout property (like `offsetWidth`, `getBoundingClientRect()`, or `getComputedStyle()`) between style changes, the browser is forced to trigger a synchronous reflow.
+
+**This is OK (browser batches style changes):**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Each line invalidates style, but browser batches the recalculation
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+}
+```
+
+**Incorrect (interleaved reads and writes force reflows):**
+
+```typescript
+function layoutThrashing(element: HTMLElement) {
+  element.style.width = "100px";
+  const width = element.offsetWidth; // Forces reflow
+  element.style.height = "200px";
+  const height = element.offsetHeight; // Forces another reflow
+}
+```
+
+**Correct (batch writes, then read once):**
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  // Batch all writes together
+  element.style.width = "100px";
+  element.style.height = "200px";
+  element.style.backgroundColor = "blue";
+  element.style.border = "1px solid black";
+
+  // Read after all writes are done (single reflow)
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**Correct (batch reads, then writes):**
+
+```typescript
+function avoidThrashing(element: HTMLElement) {
+  // Read phase - all layout queries first
+  const rect1 = element.getBoundingClientRect();
+  const offsetWidth = element.offsetWidth;
+  const offsetHeight = element.offsetHeight;
+
+  // Write phase - all style changes after
+  element.style.width = "100px";
+  element.style.height = "200px";
+}
+```
+
+**Better: use CSS classes**
+
+```css
+.highlighted-box {
+  width: 100px;
+  height: 200px;
+  background-color: blue;
+  border: 1px solid black;
+}
+```
+
+```typescript
+function updateElementStyles(element: HTMLElement) {
+  element.classList.add("highlighted-box");
+
+  const { width, height } = element.getBoundingClientRect();
+}
+```
+
+**React example:**
+
+```tsx
+// Incorrect: interleaving style changes with layout queries
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (ref.current && isHighlighted) {
+      ref.current.style.width = "100px";
+      const width = ref.current.offsetWidth; // Forces layout
+      ref.current.style.height = "200px";
+    }
+  }, [isHighlighted]);
+
+  return <div ref={ref}>Content</div>;
+}
+
+// Correct: toggle class
+function Box({ isHighlighted }: { isHighlighted: boolean }) {
+  return <div className={isHighlighted ? "highlighted-box" : ""}>Content</div>;
+}
+```
+
+Prefer CSS classes over inline styles when possible. CSS files are cached by the browser, and classes provide better separation of concerns and are easier to maintain.
+
+See [this gist](https://gist.github.com/paulirish/5d52fb081b3570c81e3a) and [CSS Triggers](https://csstriggers.com/) for more information on layout-forcing operations.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-cache-function-results.md b/.cursor/skills/vercel-react-best-practices/rules/js-cache-function-results.md
new file mode 100644
index 000000000..91a6985be
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-cache-function-results.md
@@ -0,0 +1,80 @@
+---
+title: Cache Repeated Function Calls
+impact: MEDIUM
+impactDescription: avoid redundant computation
+tags: javascript, cache, memoization, performance
+---
+
+## Cache Repeated Function Calls
+
+Use a module-level Map to cache function results when the same function is called repeatedly with the same inputs during render.
+
+**Incorrect (redundant computation):**
+
+```typescript
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // slugify() called 100+ times for same project names
+        const slug = slugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Correct (cached results):**
+
+```typescript
+// Module-level cache
+const slugifyCache = new Map<string, string>()
+
+function cachedSlugify(text: string): string {
+  if (slugifyCache.has(text)) {
+    return slugifyCache.get(text)!
+  }
+  const result = slugify(text)
+  slugifyCache.set(text, result)
+  return result
+}
+
+function ProjectList({ projects }: { projects: Project[] }) {
+  return (
+    <div>
+      {projects.map(project => {
+        // Computed only once per unique project name
+        const slug = cachedSlugify(project.name)
+
+        return <ProjectCard key={project.id} slug={slug} />
+      })}
+    </div>
+  )
+}
+```
+
+**Simpler pattern for single-value functions:**
+
+```typescript
+let isLoggedInCache: boolean | null = null;
+
+function isLoggedIn(): boolean {
+  if (isLoggedInCache !== null) {
+    return isLoggedInCache;
+  }
+
+  isLoggedInCache = document.cookie.includes("auth=");
+  return isLoggedInCache;
+}
+
+// Clear cache when auth changes
+function onAuthChange() {
+  isLoggedInCache = null;
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+Reference: [How we made the Vercel Dashboard twice as fast](https://vercel.com/blog/how-we-made-the-vercel-dashboard-twice-as-fast)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-cache-property-access.md b/.cursor/skills/vercel-react-best-practices/rules/js-cache-property-access.md
new file mode 100644
index 000000000..291f109b0
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-cache-property-access.md
@@ -0,0 +1,28 @@
+---
+title: Cache Property Access in Loops
+impact: LOW-MEDIUM
+impactDescription: reduces lookups
+tags: javascript, loops, optimization, caching
+---
+
+## Cache Property Access in Loops
+
+Cache object property lookups in hot paths.
+
+**Incorrect (3 lookups × N iterations):**
+
+```typescript
+for (let i = 0; i < arr.length; i++) {
+  process(obj.config.settings.value);
+}
+```
+
+**Correct (1 lookup total):**
+
+```typescript
+const value = obj.config.settings.value;
+const len = arr.length;
+for (let i = 0; i < len; i++) {
+  process(value);
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-cache-storage.md b/.cursor/skills/vercel-react-best-practices/rules/js-cache-storage.md
new file mode 100644
index 000000000..363becba1
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-cache-storage.md
@@ -0,0 +1,70 @@
+---
+title: Cache Storage API Calls
+impact: LOW-MEDIUM
+impactDescription: reduces expensive I/O
+tags: javascript, localStorage, storage, caching, performance
+---
+
+## Cache Storage API Calls
+
+`localStorage`, `sessionStorage`, and `document.cookie` are synchronous and expensive. Cache reads in memory.
+
+**Incorrect (reads storage on every call):**
+
+```typescript
+function getTheme() {
+  return localStorage.getItem("theme") ?? "light";
+}
+// Called 10 times = 10 storage reads
+```
+
+**Correct (Map cache):**
+
+```typescript
+const storageCache = new Map<string, string | null>();
+
+function getLocalStorage(key: string) {
+  if (!storageCache.has(key)) {
+    storageCache.set(key, localStorage.getItem(key));
+  }
+  return storageCache.get(key);
+}
+
+function setLocalStorage(key: string, value: string) {
+  localStorage.setItem(key, value);
+  storageCache.set(key, value); // keep cache in sync
+}
+```
+
+Use a Map (not a hook) so it works everywhere: utilities, event handlers, not just React components.
+
+**Cookie caching:**
+
+```typescript
+let cookieCache: Record<string, string> | null = null;
+
+function getCookie(name: string) {
+  if (!cookieCache) {
+    cookieCache = Object.fromEntries(
+      document.cookie.split("; ").map((c) => c.split("=")),
+    );
+  }
+  return cookieCache[name];
+}
+```
+
+**Important (invalidate on external changes):**
+
+If storage can change externally (another tab, server-set cookies), invalidate cache:
+
+```typescript
+window.addEventListener("storage", (e) => {
+  if (e.key) storageCache.delete(e.key);
+});
+
+document.addEventListener("visibilitychange", () => {
+  if (document.visibilityState === "visible") {
+    storageCache.clear();
+  }
+});
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-combine-iterations.md b/.cursor/skills/vercel-react-best-practices/rules/js-combine-iterations.md
new file mode 100644
index 000000000..f1e2518b7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-combine-iterations.md
@@ -0,0 +1,32 @@
+---
+title: Combine Multiple Array Iterations
+impact: LOW-MEDIUM
+impactDescription: reduces iterations
+tags: javascript, arrays, loops, performance
+---
+
+## Combine Multiple Array Iterations
+
+Multiple `.filter()` or `.map()` calls iterate the array multiple times. Combine into one loop.
+
+**Incorrect (3 iterations):**
+
+```typescript
+const admins = users.filter((u) => u.isAdmin);
+const testers = users.filter((u) => u.isTester);
+const inactive = users.filter((u) => !u.isActive);
+```
+
+**Correct (1 iteration):**
+
+```typescript
+const admins: User[] = [];
+const testers: User[] = [];
+const inactive: User[] = [];
+
+for (const user of users) {
+  if (user.isAdmin) admins.push(user);
+  if (user.isTester) testers.push(user);
+  if (!user.isActive) inactive.push(user);
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-early-exit.md b/.cursor/skills/vercel-react-best-practices/rules/js-early-exit.md
new file mode 100644
index 000000000..992181ac1
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-early-exit.md
@@ -0,0 +1,50 @@
+---
+title: Early Return from Functions
+impact: LOW-MEDIUM
+impactDescription: avoids unnecessary computation
+tags: javascript, functions, optimization, early-return
+---
+
+## Early Return from Functions
+
+Return early when result is determined to skip unnecessary processing.
+
+**Incorrect (processes all items even after finding answer):**
+
+```typescript
+function validateUsers(users: User[]) {
+  let hasError = false;
+  let errorMessage = "";
+
+  for (const user of users) {
+    if (!user.email) {
+      hasError = true;
+      errorMessage = "Email required";
+    }
+    if (!user.name) {
+      hasError = true;
+      errorMessage = "Name required";
+    }
+    // Continues checking all users even after error found
+  }
+
+  return hasError ? { valid: false, error: errorMessage } : { valid: true };
+}
+```
+
+**Correct (returns immediately on first error):**
+
+```typescript
+function validateUsers(users: User[]) {
+  for (const user of users) {
+    if (!user.email) {
+      return { valid: false, error: "Email required" };
+    }
+    if (!user.name) {
+      return { valid: false, error: "Name required" };
+    }
+  }
+
+  return { valid: true };
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-hoist-regexp.md b/.cursor/skills/vercel-react-best-practices/rules/js-hoist-regexp.md
new file mode 100644
index 000000000..2d2256d3d
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-hoist-regexp.md
@@ -0,0 +1,45 @@
+---
+title: Hoist RegExp Creation
+impact: LOW-MEDIUM
+impactDescription: avoids recreation
+tags: javascript, regexp, optimization, memoization
+---
+
+## Hoist RegExp Creation
+
+Don't create RegExp inside render. Hoist to module scope or memoize with `useMemo()`.
+
+**Incorrect (new RegExp every render):**
+
+```tsx
+function Highlighter({ text, query }: Props) {
+  const regex = new RegExp(`(${query})`, 'gi')
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Correct (memoize or hoist):**
+
+```tsx
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+
+function Highlighter({ text, query }: Props) {
+  const regex = useMemo(
+    () => new RegExp(`(${escapeRegex(query)})`, 'gi'),
+    [query]
+  )
+  const parts = text.split(regex)
+  return <>{parts.map((part, i) => ...)}</>
+}
+```
+
+**Warning (global regex has mutable state):**
+
+Global regex (`/g`) has mutable `lastIndex` state:
+
+```typescript
+const regex = /foo/g;
+regex.test("foo"); // true, lastIndex = 3
+regex.test("foo"); // false, lastIndex = 0
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-index-maps.md b/.cursor/skills/vercel-react-best-practices/rules/js-index-maps.md
new file mode 100644
index 000000000..1fbaeda70
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-index-maps.md
@@ -0,0 +1,37 @@
+---
+title: Build Index Maps for Repeated Lookups
+impact: LOW-MEDIUM
+impactDescription: 1M ops to 2K ops
+tags: javascript, map, indexing, optimization, performance
+---
+
+## Build Index Maps for Repeated Lookups
+
+Multiple `.find()` calls by the same key should use a Map.
+
+**Incorrect (O(n) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  return orders.map((order) => ({
+    ...order,
+    user: users.find((u) => u.id === order.userId),
+  }));
+}
+```
+
+**Correct (O(1) per lookup):**
+
+```typescript
+function processOrders(orders: Order[], users: User[]) {
+  const userById = new Map(users.map((u) => [u.id, u]));
+
+  return orders.map((order) => ({
+    ...order,
+    user: userById.get(order.userId),
+  }));
+}
+```
+
+Build map once (O(n)), then all lookups are O(1).
+For 1000 orders × 1000 users: 1M ops → 2K ops.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-length-check-first.md b/.cursor/skills/vercel-react-best-practices/rules/js-length-check-first.md
new file mode 100644
index 000000000..8bb79734d
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-length-check-first.md
@@ -0,0 +1,50 @@
+---
+title: Early Length Check for Array Comparisons
+impact: MEDIUM-HIGH
+impactDescription: avoids expensive operations when lengths differ
+tags: javascript, arrays, performance, optimization, comparison
+---
+
+## Early Length Check for Array Comparisons
+
+When comparing arrays with expensive operations (sorting, deep equality, serialization), check lengths first. If lengths differ, the arrays cannot be equal.
+
+In real-world applications, this optimization is especially valuable when the comparison runs in hot paths (event handlers, render loops).
+
+**Incorrect (always runs expensive comparison):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Always sorts and joins, even when lengths differ
+  return current.sort().join() !== original.sort().join();
+}
+```
+
+Two O(n log n) sorts run even when `current.length` is 5 and `original.length` is 100. There is also overhead of joining the arrays and comparing the strings.
+
+**Correct (O(1) length check first):**
+
+```typescript
+function hasChanges(current: string[], original: string[]) {
+  // Early return if lengths differ
+  if (current.length !== original.length) {
+    return true;
+  }
+  // Only sort when lengths match
+  const currentSorted = current.toSorted();
+  const originalSorted = original.toSorted();
+  for (let i = 0; i < currentSorted.length; i++) {
+    if (currentSorted[i] !== originalSorted[i]) {
+      return true;
+    }
+  }
+  return false;
+}
+```
+
+This new approach is more efficient because:
+
+- It avoids the overhead of sorting and joining the arrays when lengths differ
+- It avoids consuming memory for the joined strings (especially important for large arrays)
+- It avoids mutating the original arrays
+- It returns early when a difference is found
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-min-max-loop.md b/.cursor/skills/vercel-react-best-practices/rules/js-min-max-loop.md
new file mode 100644
index 000000000..a83a760b7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-min-max-loop.md
@@ -0,0 +1,82 @@
+---
+title: Use Loop for Min/Max Instead of Sort
+impact: LOW
+impactDescription: O(n) instead of O(n log n)
+tags: javascript, arrays, performance, sorting, algorithms
+---
+
+## Use Loop for Min/Max Instead of Sort
+
+Finding the smallest or largest element only requires a single pass through the array. Sorting is wasteful and slower.
+
+**Incorrect (O(n log n) - sort to find latest):**
+
+```typescript
+interface Project {
+  id: string;
+  name: string;
+  updatedAt: number;
+}
+
+function getLatestProject(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => b.updatedAt - a.updatedAt);
+  return sorted[0];
+}
+```
+
+Sorts the entire array just to find the maximum value.
+
+**Incorrect (O(n log n) - sort for oldest and newest):**
+
+```typescript
+function getOldestAndNewest(projects: Project[]) {
+  const sorted = [...projects].sort((a, b) => a.updatedAt - b.updatedAt);
+  return { oldest: sorted[0], newest: sorted[sorted.length - 1] };
+}
+```
+
+Still sorts unnecessarily when only min/max are needed.
+
+**Correct (O(n) - single loop):**
+
+```typescript
+function getLatestProject(projects: Project[]) {
+  if (projects.length === 0) return null;
+
+  let latest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt > latest.updatedAt) {
+      latest = projects[i];
+    }
+  }
+
+  return latest;
+}
+
+function getOldestAndNewest(projects: Project[]) {
+  if (projects.length === 0) return { oldest: null, newest: null };
+
+  let oldest = projects[0];
+  let newest = projects[0];
+
+  for (let i = 1; i < projects.length; i++) {
+    if (projects[i].updatedAt < oldest.updatedAt) oldest = projects[i];
+    if (projects[i].updatedAt > newest.updatedAt) newest = projects[i];
+  }
+
+  return { oldest, newest };
+}
+```
+
+Single pass through the array, no copying, no sorting.
+
+**Alternative (Math.min/Math.max for small arrays):**
+
+```typescript
+const numbers = [5, 2, 8, 1, 9];
+const min = Math.min(...numbers);
+const max = Math.max(...numbers);
+```
+
+This works for small arrays, but can be slower or just throw an error for very large arrays due to spread operator limitations. Maximal array length is approximately 124000 in Chrome 143 and 638000 in Safari 18; exact numbers may vary - see [the fiddle](https://jsfiddle.net/qw1jabsx/4/). Use the loop approach for reliability.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-set-map-lookups.md b/.cursor/skills/vercel-react-best-practices/rules/js-set-map-lookups.md
new file mode 100644
index 000000000..680a4892e
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-set-map-lookups.md
@@ -0,0 +1,24 @@
+---
+title: Use Set/Map for O(1) Lookups
+impact: LOW-MEDIUM
+impactDescription: O(n) to O(1)
+tags: javascript, set, map, data-structures, performance
+---
+
+## Use Set/Map for O(1) Lookups
+
+Convert arrays to Set/Map for repeated membership checks.
+
+**Incorrect (O(n) per check):**
+
+```typescript
+const allowedIds = ['a', 'b', 'c', ...]
+items.filter(item => allowedIds.includes(item.id))
+```
+
+**Correct (O(1) per check):**
+
+```typescript
+const allowedIds = new Set(['a', 'b', 'c', ...])
+items.filter(item => allowedIds.has(item.id))
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md b/.cursor/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md
new file mode 100644
index 000000000..e6d5df3af
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/js-tosorted-immutable.md
@@ -0,0 +1,57 @@
+---
+title: Use toSorted() Instead of sort() for Immutability
+impact: MEDIUM-HIGH
+impactDescription: prevents mutation bugs in React state
+tags: javascript, arrays, immutability, react, state, mutation
+---
+
+## Use toSorted() Instead of sort() for Immutability
+
+`.sort()` mutates the array in place, which can cause bugs with React state and props. Use `.toSorted()` to create a new sorted array without mutation.
+
+**Incorrect (mutates original array):**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Mutates the users prop array!
+  const sorted = useMemo(
+    () => users.sort((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Correct (creates new array):**
+
+```typescript
+function UserList({ users }: { users: User[] }) {
+  // Creates new sorted array, original unchanged
+  const sorted = useMemo(
+    () => users.toSorted((a, b) => a.name.localeCompare(b.name)),
+    [users]
+  )
+  return <div>{sorted.map(renderUser)}</div>
+}
+```
+
+**Why this matters in React:**
+
+1. Props/state mutations break React's immutability model - React expects props and state to be treated as read-only
+2. Causes stale closure bugs - Mutating arrays inside closures (callbacks, effects) can lead to unexpected behavior
+
+**Browser support (fallback for older browsers):**
+
+`.toSorted()` is available in all modern browsers (Chrome 110+, Safari 16+, Firefox 115+, Node.js 20+). For older environments, use spread operator:
+
+```typescript
+// Fallback for older browsers
+const sorted = [...items].sort((a, b) => a.value - b.value);
+```
+
+**Other immutable array methods:**
+
+- `.toSorted()` - immutable sort
+- `.toReversed()` - immutable reverse
+- `.toSpliced()` - immutable splice
+- `.with()` - immutable element replacement
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-activity.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-activity.md
new file mode 100644
index 000000000..a7d84cdd1
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-activity.md
@@ -0,0 +1,26 @@
+---
+title: Use Activity Component for Show/Hide
+impact: MEDIUM
+impactDescription: preserves state/DOM
+tags: rendering, activity, visibility, state-preservation
+---
+
+## Use Activity Component for Show/Hide
+
+Use React's `<Activity>` to preserve state/DOM for expensive components that frequently toggle visibility.
+
+**Usage:**
+
+```tsx
+import { Activity } from "react";
+
+function Dropdown({ isOpen }: Props) {
+  return (
+    <Activity mode={isOpen ? "visible" : "hidden"}>
+      <ExpensiveMenu />
+    </Activity>
+  );
+}
+```
+
+Avoids expensive re-renders and state loss.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md
new file mode 100644
index 000000000..370730271
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-animate-svg-wrapper.md
@@ -0,0 +1,38 @@
+---
+title: Animate SVG Wrapper Instead of SVG Element
+impact: LOW
+impactDescription: enables hardware acceleration
+tags: rendering, svg, css, animation, performance
+---
+
+## Animate SVG Wrapper Instead of SVG Element
+
+Many browsers don't have hardware acceleration for CSS3 animations on SVG elements. Wrap SVG in a `<div>` and animate the wrapper instead.
+
+**Incorrect (animating SVG directly - no hardware acceleration):**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <svg className="animate-spin" width="24" height="24" viewBox="0 0 24 24">
+      <circle cx="12" cy="12" r="10" stroke="currentColor" />
+    </svg>
+  );
+}
+```
+
+**Correct (animating wrapper div - hardware accelerated):**
+
+```tsx
+function LoadingSpinner() {
+  return (
+    <div className="animate-spin">
+      <svg width="24" height="24" viewBox="0 0 24 24">
+        <circle cx="12" cy="12" r="10" stroke="currentColor" />
+      </svg>
+    </div>
+  );
+}
+```
+
+This applies to all CSS transforms and transitions (`transform`, `opacity`, `translate`, `scale`, `rotate`). The wrapper div allows browsers to use GPU acceleration for smoother animations.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-conditional-render.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-conditional-render.md
new file mode 100644
index 000000000..bbafa1427
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-conditional-render.md
@@ -0,0 +1,32 @@
+---
+title: Use Explicit Conditional Rendering
+impact: LOW
+impactDescription: prevents rendering 0 or NaN
+tags: rendering, conditional, jsx, falsy-values
+---
+
+## Use Explicit Conditional Rendering
+
+Use explicit ternary operators (`? :`) instead of `&&` for conditional rendering when the condition can be `0`, `NaN`, or other falsy values that render.
+
+**Incorrect (renders "0" when count is 0):**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count && <span className="badge">{count}</span>}</div>;
+}
+
+// When count = 0, renders: <div>0</div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
+
+**Correct (renders nothing when count is 0):**
+
+```tsx
+function Badge({ count }: { count: number }) {
+  return <div>{count > 0 ? <span className="badge">{count}</span> : null}</div>;
+}
+
+// When count = 0, renders: <div></div>
+// When count = 5, renders: <div><span class="badge">5</span></div>
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-content-visibility.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-content-visibility.md
new file mode 100644
index 000000000..1aebfab58
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-content-visibility.md
@@ -0,0 +1,38 @@
+---
+title: CSS content-visibility for Long Lists
+impact: HIGH
+impactDescription: faster initial render
+tags: rendering, css, content-visibility, long-lists
+---
+
+## CSS content-visibility for Long Lists
+
+Apply `content-visibility: auto` to defer off-screen rendering.
+
+**CSS:**
+
+```css
+.message-item {
+  content-visibility: auto;
+  contain-intrinsic-size: 0 80px;
+}
+```
+
+**Example:**
+
+```tsx
+function MessageList({ messages }: { messages: Message[] }) {
+  return (
+    <div className="h-screen overflow-y-auto">
+      {messages.map((msg) => (
+        <div key={msg.id} className="message-item">
+          <Avatar user={msg.author} />
+          <div>{msg.content}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+```
+
+For 1000 messages, browser skips layout/paint for ~990 off-screen items (10× faster initial render).
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md
new file mode 100644
index 000000000..fea1751ae
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-hoist-jsx.md
@@ -0,0 +1,36 @@
+---
+title: Hoist Static JSX Elements
+impact: LOW
+impactDescription: avoids re-creation
+tags: rendering, jsx, static, optimization
+---
+
+## Hoist Static JSX Elements
+
+Extract static JSX outside components to avoid re-creation.
+
+**Incorrect (recreates element every render):**
+
+```tsx
+function LoadingSkeleton() {
+  return <div className="h-20 animate-pulse bg-gray-200" />;
+}
+
+function Container() {
+  return <div>{loading && <LoadingSkeleton />}</div>;
+}
+```
+
+**Correct (reuses same element):**
+
+```tsx
+const loadingSkeleton = <div className="h-20 animate-pulse bg-gray-200" />;
+
+function Container() {
+  return <div>{loading && loadingSkeleton}</div>;
+}
+```
+
+This is especially helpful for large and static SVG nodes, which can be expensive to recreate on every render.
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler automatically hoists static JSX elements and optimizes component re-renders, making manual hoisting unnecessary.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md
new file mode 100644
index 000000000..971c5cc99
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-no-flicker.md
@@ -0,0 +1,72 @@
+---
+title: Prevent Hydration Mismatch Without Flickering
+impact: MEDIUM
+impactDescription: avoids visual flicker and hydration errors
+tags: rendering, ssr, hydration, localStorage, flicker
+---
+
+## Prevent Hydration Mismatch Without Flickering
+
+When rendering content that depends on client-side storage (localStorage, cookies), avoid both SSR breakage and post-hydration flickering by injecting a synchronous script that updates the DOM before React hydrates.
+
+**Incorrect (breaks SSR):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  // localStorage is not available on server - throws error
+  const theme = localStorage.getItem("theme") || "light";
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Server-side rendering will fail because `localStorage` is undefined.
+
+**Incorrect (visual flickering):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  const [theme, setTheme] = useState("light");
+
+  useEffect(() => {
+    // Runs after hydration - causes visible flash
+    const stored = localStorage.getItem("theme");
+    if (stored) {
+      setTheme(stored);
+    }
+  }, []);
+
+  return <div className={theme}>{children}</div>;
+}
+```
+
+Component first renders with default value (`light`), then updates after hydration, causing a visible flash of incorrect content.
+
+**Correct (no flicker, no hydration mismatch):**
+
+```tsx
+function ThemeWrapper({ children }: { children: ReactNode }) {
+  return (
+    <>
+      <div id="theme-wrapper">{children}</div>
+      <script
+        dangerouslySetInnerHTML={{
+          __html: `
+            (function() {
+              try {
+                var theme = localStorage.getItem('theme') || 'light';
+                var el = document.getElementById('theme-wrapper');
+                if (el) el.className = theme;
+              } catch (e) {}
+            })();
+          `,
+        }}
+      />
+    </>
+  );
+}
+```
+
+The inline script executes synchronously before showing the element, ensuring the DOM already has the correct value. No flickering, no hydration mismatch.
+
+This pattern is especially useful for theme toggles, user preferences, authentication states, and any client-only data that should render immediately without flashing default values.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md
new file mode 100644
index 000000000..86c1a33ea
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-hydration-suppress-warning.md
@@ -0,0 +1,26 @@
+---
+title: Suppress Expected Hydration Mismatches
+impact: LOW-MEDIUM
+impactDescription: avoids noisy hydration warnings for known differences
+tags: rendering, hydration, ssr, nextjs
+---
+
+## Suppress Expected Hydration Mismatches
+
+In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these _expected_ mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
+
+**Incorrect (known mismatch warnings):**
+
+```tsx
+function Timestamp() {
+  return <span>{new Date().toLocaleString()}</span>;
+}
+```
+
+**Correct (suppress expected mismatch only):**
+
+```tsx
+function Timestamp() {
+  return <span suppressHydrationWarning>{new Date().toLocaleString()}</span>;
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-svg-precision.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-svg-precision.md
new file mode 100644
index 000000000..6d7712860
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-svg-precision.md
@@ -0,0 +1,28 @@
+---
+title: Optimize SVG Precision
+impact: LOW
+impactDescription: reduces file size
+tags: rendering, svg, optimization, svgo
+---
+
+## Optimize SVG Precision
+
+Reduce SVG coordinate precision to decrease file size. The optimal precision depends on the viewBox size, but in general reducing precision should be considered.
+
+**Incorrect (excessive precision):**
+
+```svg
+<path d="M 10.293847 20.847362 L 30.938472 40.192837" />
+```
+
+**Correct (1 decimal place):**
+
+```svg
+<path d="M 10.3 20.8 L 30.9 40.2" />
+```
+
+**Automate with SVGO:**
+
+```bash
+npx svgo --precision=1 --multipass icon.svg
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md b/.cursor/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md
new file mode 100644
index 000000000..bf9f1e851
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rendering-usetransition-loading.md
@@ -0,0 +1,75 @@
+---
+title: Use useTransition Over Manual Loading States
+impact: LOW
+impactDescription: reduces re-renders and improves code clarity
+tags: rendering, transitions, useTransition, loading, state
+---
+
+## Use useTransition Over Manual Loading States
+
+Use `useTransition` instead of manual `useState` for loading states. This provides built-in `isPending` state and automatically manages transitions.
+
+**Incorrect (manual loading state):**
+
+```tsx
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleSearch = async (value: string) => {
+    setIsLoading(true);
+    setQuery(value);
+    const data = await fetchResults(value);
+    setResults(data);
+    setIsLoading(false);
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isLoading && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Correct (useTransition with built-in pending state):**
+
+```tsx
+import { useTransition, useState } from "react";
+
+function SearchResults() {
+  const [query, setQuery] = useState("");
+  const [results, setResults] = useState([]);
+  const [isPending, startTransition] = useTransition();
+
+  const handleSearch = (value: string) => {
+    setQuery(value); // Update input immediately
+
+    startTransition(async () => {
+      // Fetch and update results
+      const data = await fetchResults(value);
+      setResults(data);
+    });
+  };
+
+  return (
+    <>
+      <input onChange={(e) => handleSearch(e.target.value)} />
+      {isPending && <Spinner />}
+      <ResultsList results={results} />
+    </>
+  );
+}
+```
+
+**Benefits:**
+
+- **Automatic pending state**: No need to manually manage `setIsLoading(true/false)`
+- **Error resilience**: Pending state correctly resets even if the transition throws
+- **Better responsiveness**: Keeps the UI responsive during updates
+- **Interrupt handling**: New transitions automatically cancel pending ones
+
+Reference: [useTransition](https://react.dev/reference/react/useTransition)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-defer-reads.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-defer-reads.md
new file mode 100644
index 000000000..bd4919402
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-defer-reads.md
@@ -0,0 +1,39 @@
+---
+title: Defer State Reads to Usage Point
+impact: MEDIUM
+impactDescription: avoids unnecessary subscriptions
+tags: rerender, searchParams, localStorage, optimization
+---
+
+## Defer State Reads to Usage Point
+
+Don't subscribe to dynamic state (searchParams, localStorage) if you only read it inside callbacks.
+
+**Incorrect (subscribes to all searchParams changes):**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const searchParams = useSearchParams();
+
+  const handleShare = () => {
+    const ref = searchParams.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
+
+**Correct (reads on demand, no subscription):**
+
+```tsx
+function ShareButton({ chatId }: { chatId: string }) {
+  const handleShare = () => {
+    const params = new URLSearchParams(window.location.search);
+    const ref = params.get("ref");
+    shareChat(chatId, { ref });
+  };
+
+  return <button onClick={handleShare}>Share</button>;
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-dependencies.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-dependencies.md
new file mode 100644
index 000000000..bd7795edf
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-dependencies.md
@@ -0,0 +1,45 @@
+---
+title: Narrow Effect Dependencies
+impact: LOW
+impactDescription: minimizes effect re-runs
+tags: rerender, useEffect, dependencies, optimization
+---
+
+## Narrow Effect Dependencies
+
+Specify primitive dependencies instead of objects to minimize effect re-runs.
+
+**Incorrect (re-runs on any user field change):**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user]);
+```
+
+**Correct (re-runs only when id changes):**
+
+```tsx
+useEffect(() => {
+  console.log(user.id);
+}, [user.id]);
+```
+
+**For derived state, compute outside effect:**
+
+```tsx
+// Incorrect: runs on width=767, 766, 765...
+useEffect(() => {
+  if (width < 768) {
+    enableMobileMode();
+  }
+}, [width]);
+
+// Correct: runs only on boolean transition
+const isMobile = width < 768;
+useEffect(() => {
+  if (isMobile) {
+    enableMobileMode();
+  }
+}, [isMobile]);
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md
new file mode 100644
index 000000000..b1514c987
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state-no-effect.md
@@ -0,0 +1,40 @@
+---
+title: Calculate Derived State During Rendering
+impact: MEDIUM
+impactDescription: avoids redundant renders and state drift
+tags: rerender, derived-state, useEffect, state
+---
+
+## Calculate Derived State During Rendering
+
+If a value can be computed from current props/state, do not store it in state or update it in an effect. Derive it during render to avoid extra renders and state drift. Do not set state in effects solely in response to prop changes; prefer derived values or keyed resets instead.
+
+**Incorrect (redundant state and effect):**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const [fullName, setFullName] = useState("");
+
+  useEffect(() => {
+    setFullName(firstName + " " + lastName);
+  }, [firstName, lastName]);
+
+  return <p>{fullName}</p>;
+}
+```
+
+**Correct (derive during render):**
+
+```tsx
+function Form() {
+  const [firstName, setFirstName] = useState("First");
+  const [lastName, setLastName] = useState("Last");
+  const fullName = firstName + " " + lastName;
+
+  return <p>{fullName}</p>;
+}
+```
+
+References: [You Might Not Need an Effect](https://react.dev/learn/you-might-not-need-an-effect)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state.md
new file mode 100644
index 000000000..08ab84a80
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-derived-state.md
@@ -0,0 +1,29 @@
+---
+title: Subscribe to Derived State
+impact: MEDIUM
+impactDescription: reduces re-render frequency
+tags: rerender, derived-state, media-query, optimization
+---
+
+## Subscribe to Derived State
+
+Subscribe to derived boolean state instead of continuous values to reduce re-render frequency.
+
+**Incorrect (re-renders on every pixel change):**
+
+```tsx
+function Sidebar() {
+  const width = useWindowWidth(); // updates continuously
+  const isMobile = width < 768;
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
+
+**Correct (re-renders only when boolean changes):**
+
+```tsx
+function Sidebar() {
+  const isMobile = useMediaQuery("(max-width: 767px)");
+  return <nav className={isMobile ? "mobile" : "desktop"} />;
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md
new file mode 100644
index 000000000..fe55b02cf
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-functional-setstate.md
@@ -0,0 +1,77 @@
+---
+title: Use Functional setState Updates
+impact: MEDIUM
+impactDescription: prevents stale closures and unnecessary callback recreations
+tags: react, hooks, useState, useCallback, callbacks, closures
+---
+
+## Use Functional setState Updates
+
+When updating state based on the current state value, use the functional update form of setState instead of directly referencing the state variable. This prevents stale closures, eliminates unnecessary dependencies, and creates stable callback references.
+
+**Incorrect (requires state as dependency):**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Callback must depend on items, recreated on every items change
+  const addItems = useCallback(
+    (newItems: Item[]) => {
+      setItems([...items, ...newItems]);
+    },
+    [items],
+  ); // ❌ items dependency causes recreations
+
+  // Risk of stale closure if dependency is forgotten
+  const removeItem = useCallback((id: string) => {
+    setItems(items.filter((item) => item.id !== id));
+  }, []); // ❌ Missing items dependency - will use stale items!
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+The first callback is recreated every time `items` changes, which can cause child components to re-render unnecessarily. The second callback has a stale closure bug—it will always reference the initial `items` value.
+
+**Correct (stable callbacks, no stale closures):**
+
+```tsx
+function TodoList() {
+  const [items, setItems] = useState(initialItems);
+
+  // Stable callback, never recreated
+  const addItems = useCallback((newItems: Item[]) => {
+    setItems((curr) => [...curr, ...newItems]);
+  }, []); // ✅ No dependencies needed
+
+  // Always uses latest state, no stale closure risk
+  const removeItem = useCallback((id: string) => {
+    setItems((curr) => curr.filter((item) => item.id !== id));
+  }, []); // ✅ Safe and stable
+
+  return <ItemsEditor items={items} onAdd={addItems} onRemove={removeItem} />;
+}
+```
+
+**Benefits:**
+
+1. **Stable callback references** - Callbacks don't need to be recreated when state changes
+2. **No stale closures** - Always operates on the latest state value
+3. **Fewer dependencies** - Simplifies dependency arrays and reduces memory leaks
+4. **Prevents bugs** - Eliminates the most common source of React closure bugs
+
+**When to use functional updates:**
+
+- Any setState that depends on the current state value
+- Inside useCallback/useMemo when state is needed
+- Event handlers that reference state
+- Async operations that update state
+
+**When direct updates are fine:**
+
+- Setting state to a static value: `setCount(0)`
+- Setting state from props/arguments only: `setName(newName)`
+- State doesn't depend on previous value
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, the compiler can automatically optimize some cases, but functional updates are still recommended for correctness and to prevent stale closure bugs.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md
new file mode 100644
index 000000000..4ead79f11
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-lazy-state-init.md
@@ -0,0 +1,58 @@
+---
+title: Use Lazy State Initialization
+impact: MEDIUM
+impactDescription: wasted computation on every render
+tags: react, hooks, useState, performance, initialization
+---
+
+## Use Lazy State Initialization
+
+Pass a function to `useState` for expensive initial values. Without the function form, the initializer runs on every render even though the value is only used once.
+
+**Incorrect (runs on every render):**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs on EVERY render, even after initialization
+  const [searchIndex, setSearchIndex] = useState(buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  // When query changes, buildSearchIndex runs again unnecessarily
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs on every render
+  const [settings, setSettings] = useState(
+    JSON.parse(localStorage.getItem("settings") || "{}"),
+  );
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+**Correct (runs only once):**
+
+```tsx
+function FilteredList({ items }: { items: Item[] }) {
+  // buildSearchIndex() runs ONLY on initial render
+  const [searchIndex, setSearchIndex] = useState(() => buildSearchIndex(items));
+  const [query, setQuery] = useState("");
+
+  return <SearchResults index={searchIndex} query={query} />;
+}
+
+function UserProfile() {
+  // JSON.parse runs only on initial render
+  const [settings, setSettings] = useState(() => {
+    const stored = localStorage.getItem("settings");
+    return stored ? JSON.parse(stored) : {};
+  });
+
+  return <SettingsForm settings={settings} onChange={setSettings} />;
+}
+```
+
+Use lazy initialization when computing initial values from localStorage/sessionStorage, building data structures (indexes, maps), reading from the DOM, or performing heavy transformations.
+
+For simple primitives (`useState(0)`), direct references (`useState(props.value)`), or cheap literals (`useState({})`), the function form is unnecessary.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md
new file mode 100644
index 000000000..c250ebaa7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-memo-with-default-value.md
@@ -0,0 +1,36 @@
+---
+title: Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+impact: MEDIUM
+impactDescription: restores memoization by using a constant for default value
+tags: rerender, memo, optimization
+---
+
+## Extract Default Non-primitive Parameter Value from Memoized Component to Constant
+
+When memoized component has a default value for some non-primitive optional parameter, such as an array, function, or object, calling the component without that parameter results in broken memoization. This is because new value instances are created on every rerender, and they do not pass strict equality comparison in `memo()`.
+
+To address this issue, extract the default value into a constant.
+
+**Incorrect (`onClick` has different values on every rerender):**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ onClick = () => {} }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
+
+**Correct (stable default value):**
+
+```tsx
+const NOOP = () => {};
+
+const UserAvatar = memo(function UserAvatar({ onClick = NOOP }: { onClick?: () => void }) {
+  // ...
+})
+
+// Used without optional onClick
+<UserAvatar />
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-memo.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-memo.md
new file mode 100644
index 000000000..0de3aa3b9
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-memo.md
@@ -0,0 +1,44 @@
+---
+title: Extract to Memoized Components
+impact: MEDIUM
+impactDescription: enables early returns
+tags: rerender, memo, useMemo, optimization
+---
+
+## Extract to Memoized Components
+
+Extract expensive work into memoized components to enable early returns before computation.
+
+**Incorrect (computes avatar even when loading):**
+
+```tsx
+function Profile({ user, loading }: Props) {
+  const avatar = useMemo(() => {
+    const id = computeAvatarId(user);
+    return <Avatar id={id} />;
+  }, [user]);
+
+  if (loading) return <Skeleton />;
+  return <div>{avatar}</div>;
+}
+```
+
+**Correct (skips computation when loading):**
+
+```tsx
+const UserAvatar = memo(function UserAvatar({ user }: { user: User }) {
+  const id = useMemo(() => computeAvatarId(user), [user]);
+  return <Avatar id={id} />;
+});
+
+function Profile({ user, loading }: Props) {
+  if (loading) return <Skeleton />;
+  return (
+    <div>
+      <UserAvatar user={user} />
+    </div>
+  );
+}
+```
+
+**Note:** If your project has [React Compiler](https://react.dev/learn/react-compiler) enabled, manual memoization with `memo()` and `useMemo()` is not necessary. The compiler automatically optimizes re-renders.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md
new file mode 100644
index 000000000..08c5aa966
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-move-effect-to-event.md
@@ -0,0 +1,45 @@
+---
+title: Put Interaction Logic in Event Handlers
+impact: MEDIUM
+impactDescription: avoids effect re-runs and duplicate side effects
+tags: rerender, useEffect, events, side-effects, dependencies
+---
+
+## Put Interaction Logic in Event Handlers
+
+If a side effect is triggered by a specific user action (submit, click, drag), run it in that event handler. Do not model the action as state + effect; it makes effects re-run on unrelated changes and can duplicate the action.
+
+**Incorrect (event modeled as state + effect):**
+
+```tsx
+function Form() {
+  const [submitted, setSubmitted] = useState(false);
+  const theme = useContext(ThemeContext);
+
+  useEffect(() => {
+    if (submitted) {
+      post("/api/register");
+      showToast("Registered", theme);
+    }
+  }, [submitted, theme]);
+
+  return <button onClick={() => setSubmitted(true)}>Submit</button>;
+}
+```
+
+**Correct (do it in the handler):**
+
+```tsx
+function Form() {
+  const theme = useContext(ThemeContext);
+
+  function handleSubmit() {
+    post("/api/register");
+    showToast("Registered", theme);
+  }
+
+  return <button onClick={handleSubmit}>Submit</button>;
+}
+```
+
+Reference: [Should this code move to an event handler?](https://react.dev/learn/removing-effect-dependencies#should-this-code-move-to-an-event-handler)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md
new file mode 100644
index 000000000..9c49b6fe7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-simple-expression-in-memo.md
@@ -0,0 +1,35 @@
+---
+title: Do not wrap a simple expression with a primitive result type in useMemo
+impact: LOW-MEDIUM
+impactDescription: wasted computation on every render
+tags: rerender, useMemo, optimization
+---
+
+## Do not wrap a simple expression with a primitive result type in useMemo
+
+When an expression is simple (few logical or arithmetical operators) and has a primitive result type (boolean, number, string), do not wrap it in `useMemo`.
+Calling `useMemo` and comparing hook dependencies may consume more resources than the expression itself.
+
+**Incorrect:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = useMemo(() => {
+    return user.isLoading || notifications.isLoading;
+  }, [user.isLoading, notifications.isLoading]);
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
+
+**Correct:**
+
+```tsx
+function Header({ user, notifications }: Props) {
+  const isLoading = user.isLoading || notifications.isLoading;
+
+  if (isLoading) return <Skeleton />;
+  // return some markup
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-transitions.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-transitions.md
new file mode 100644
index 000000000..1d0bb4321
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-transitions.md
@@ -0,0 +1,40 @@
+---
+title: Use Transitions for Non-Urgent Updates
+impact: MEDIUM
+impactDescription: maintains UI responsiveness
+tags: rerender, transitions, startTransition, performance
+---
+
+## Use Transitions for Non-Urgent Updates
+
+Mark frequent, non-urgent state updates as transitions to maintain UI responsiveness.
+
+**Incorrect (blocks UI on every scroll):**
+
+```tsx
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => setScrollY(window.scrollY);
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
+
+**Correct (non-blocking updates):**
+
+```tsx
+import { startTransition } from "react";
+
+function ScrollTracker() {
+  const [scrollY, setScrollY] = useState(0);
+  useEffect(() => {
+    const handler = () => {
+      startTransition(() => setScrollY(window.scrollY));
+    };
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, []);
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md b/.cursor/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md
new file mode 100644
index 000000000..ee771fac0
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/rerender-use-ref-transient-values.md
@@ -0,0 +1,73 @@
+---
+title: Use useRef for Transient Values
+impact: MEDIUM
+impactDescription: avoids unnecessary re-renders on frequent updates
+tags: rerender, useref, state, performance
+---
+
+## Use useRef for Transient Values
+
+When a value changes frequently and you don't want a re-render on every update (e.g., mouse trackers, intervals, transient flags), store it in `useRef` instead of `useState`. Keep component state for UI; use refs for temporary DOM-adjacent values. Updating a ref does not trigger a re-render.
+
+**Incorrect (renders every update):**
+
+```tsx
+function Tracker() {
+  const [lastX, setLastX] = useState(0);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => setLastX(e.clientX);
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      style={{
+        position: "fixed",
+        top: 0,
+        left: lastX,
+        width: 8,
+        height: 8,
+        background: "black",
+      }}
+    />
+  );
+}
+```
+
+**Correct (no re-render for tracking):**
+
+```tsx
+function Tracker() {
+  const lastXRef = useRef(0);
+  const dotRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const onMove = (e: MouseEvent) => {
+      lastXRef.current = e.clientX;
+      const node = dotRef.current;
+      if (node) {
+        node.style.transform = `translateX(${e.clientX}px)`;
+      }
+    };
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
+  }, []);
+
+  return (
+    <div
+      ref={dotRef}
+      style={{
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: 8,
+        height: 8,
+        background: "black",
+        transform: "translateX(0px)",
+      }}
+    />
+  );
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-after-nonblocking.md b/.cursor/skills/vercel-react-best-practices/rules/server-after-nonblocking.md
new file mode 100644
index 000000000..7415fe181
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-after-nonblocking.md
@@ -0,0 +1,74 @@
+---
+title: Use after() for Non-Blocking Operations
+impact: MEDIUM
+impactDescription: faster response times
+tags: server, async, logging, analytics, side-effects
+---
+
+## Use after() for Non-Blocking Operations
+
+Use Next.js's `after()` to schedule work that should execute after a response is sent. This prevents logging, analytics, and other side effects from blocking the response.
+
+**Incorrect (blocks response):**
+
+```tsx
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Logging blocks the response
+  const userAgent = request.headers.get("user-agent") || "unknown";
+  await logUserAction({ userAgent });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+**Correct (non-blocking):**
+
+```tsx
+import { after } from "next/server";
+import { headers, cookies } from "next/headers";
+import { logUserAction } from "@/app/utils";
+
+export async function POST(request: Request) {
+  // Perform mutation
+  await updateDatabase(request);
+
+  // Log after response is sent
+  after(async () => {
+    const userAgent = (await headers()).get("user-agent") || "unknown";
+    const sessionCookie =
+      (await cookies()).get("session-id")?.value || "anonymous";
+
+    logUserAction({ sessionCookie, userAgent });
+  });
+
+  return new Response(JSON.stringify({ status: "success" }), {
+    status: 200,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+```
+
+The response is sent immediately while logging happens in the background.
+
+**Common use cases:**
+
+- Analytics tracking
+- Audit logging
+- Sending notifications
+- Cache invalidation
+- Cleanup tasks
+
+**Important notes:**
+
+- `after()` runs even if the response fails or redirects
+- Works in Server Actions, Route Handlers, and Server Components
+
+Reference: [https://nextjs.org/docs/app/api-reference/functions/after](https://nextjs.org/docs/app/api-reference/functions/after)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-auth-actions.md b/.cursor/skills/vercel-react-best-practices/rules/server-auth-actions.md
new file mode 100644
index 000000000..44ecf30f6
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-auth-actions.md
@@ -0,0 +1,96 @@
+---
+title: Authenticate Server Actions Like API Routes
+impact: CRITICAL
+impactDescription: prevents unauthorized access to server mutations
+tags: server, server-actions, authentication, security, authorization
+---
+
+## Authenticate Server Actions Like API Routes
+
+**Impact: CRITICAL (prevents unauthorized access to server mutations)**
+
+Server Actions (functions with `"use server"`) are exposed as public endpoints, just like API routes. Always verify authentication and authorization **inside** each Server Action—do not rely solely on middleware, layout guards, or page-level checks, as Server Actions can be invoked directly.
+
+Next.js documentation explicitly states: "Treat Server Actions with the same security considerations as public-facing API endpoints, and verify if the user is allowed to perform a mutation."
+
+**Incorrect (no authentication check):**
+
+```typescript
+"use server";
+
+export async function deleteUser(userId: string) {
+  // Anyone can call this! No auth check
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**Correct (authentication inside the action):**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { unauthorized } from "@/lib/errors";
+
+export async function deleteUser(userId: string) {
+  // Always check auth inside the action
+  const session = await verifySession();
+
+  if (!session) {
+    throw unauthorized("Must be logged in");
+  }
+
+  // Check authorization too
+  if (session.user.role !== "admin" && session.user.id !== userId) {
+    throw unauthorized("Cannot delete other users");
+  }
+
+  await db.user.delete({ where: { id: userId } });
+  return { success: true };
+}
+```
+
+**With input validation:**
+
+```typescript
+"use server";
+
+import { verifySession } from "@/lib/auth";
+import { z } from "zod";
+
+const updateProfileSchema = z.object({
+  userId: z.string().uuid(),
+  name: z.string().min(1).max(100),
+  email: z.string().email(),
+});
+
+export async function updateProfile(data: unknown) {
+  // Validate input first
+  const validated = updateProfileSchema.parse(data);
+
+  // Then authenticate
+  const session = await verifySession();
+  if (!session) {
+    throw new Error("Unauthorized");
+  }
+
+  // Then authorize
+  if (session.user.id !== validated.userId) {
+    throw new Error("Can only update own profile");
+  }
+
+  // Finally perform the mutation
+  await db.user.update({
+    where: { id: validated.userId },
+    data: {
+      name: validated.name,
+      email: validated.email,
+    },
+  });
+
+  return { success: true };
+}
+```
+
+Reference: [https://nextjs.org/docs/app/guides/authentication](https://nextjs.org/docs/app/guides/authentication)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-cache-lru.md b/.cursor/skills/vercel-react-best-practices/rules/server-cache-lru.md
new file mode 100644
index 000000000..884630824
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-cache-lru.md
@@ -0,0 +1,41 @@
+---
+title: Cross-Request LRU Caching
+impact: HIGH
+impactDescription: caches across requests
+tags: server, cache, lru, cross-request
+---
+
+## Cross-Request LRU Caching
+
+`React.cache()` only works within one request. For data shared across sequential requests (user clicks button A then button B), use an LRU cache.
+
+**Implementation:**
+
+```typescript
+import { LRUCache } from "lru-cache";
+
+const cache = new LRUCache<string, any>({
+  max: 1000,
+  ttl: 5 * 60 * 1000, // 5 minutes
+});
+
+export async function getUser(id: string) {
+  const cached = cache.get(id);
+  if (cached) return cached;
+
+  const user = await db.user.findUnique({ where: { id } });
+  cache.set(id, user);
+  return user;
+}
+
+// Request 1: DB query, result cached
+// Request 2: cache hit, no DB query
+```
+
+Use when sequential user actions hit multiple endpoints needing the same data within seconds.
+
+**With Vercel's [Fluid Compute](https://vercel.com/docs/fluid-compute):** LRU caching is especially effective because multiple concurrent requests can share the same function instance and cache. This means the cache persists across requests without needing external storage like Redis.
+
+**In traditional serverless:** Each invocation runs in isolation, so consider Redis for cross-process caching.
+
+Reference: [https://github.com/isaacs/node-lru-cache](https://github.com/isaacs/node-lru-cache)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-cache-react.md b/.cursor/skills/vercel-react-best-practices/rules/server-cache-react.md
new file mode 100644
index 000000000..0643ef7c7
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-cache-react.md
@@ -0,0 +1,76 @@
+---
+title: Per-Request Deduplication with React.cache()
+impact: MEDIUM
+impactDescription: deduplicates within request
+tags: server, cache, react-cache, deduplication
+---
+
+## Per-Request Deduplication with React.cache()
+
+Use `React.cache()` for server-side request deduplication. Authentication and database queries benefit most.
+
+**Usage:**
+
+```typescript
+import { cache } from "react";
+
+export const getCurrentUser = cache(async () => {
+  const session = await auth();
+  if (!session?.user?.id) return null;
+  return await db.user.findUnique({
+    where: { id: session.user.id },
+  });
+});
+```
+
+Within a single request, multiple calls to `getCurrentUser()` execute the query only once.
+
+**Avoid inline objects as arguments:**
+
+`React.cache()` uses shallow equality (`Object.is`) to determine cache hits. Inline objects create new references each call, preventing cache hits.
+
+**Incorrect (always cache miss):**
+
+```typescript
+const getUser = cache(async (params: { uid: number }) => {
+  return await db.user.findUnique({ where: { id: params.uid } });
+});
+
+// Each call creates new object, never hits cache
+getUser({ uid: 1 });
+getUser({ uid: 1 }); // Cache miss, runs query again
+```
+
+**Correct (cache hit):**
+
+```typescript
+const getUser = cache(async (uid: number) => {
+  return await db.user.findUnique({ where: { id: uid } });
+});
+
+// Primitive args use value equality
+getUser(1);
+getUser(1); // Cache hit, returns cached result
+```
+
+If you must pass objects, pass the same reference:
+
+```typescript
+const params = { uid: 1 };
+getUser(params); // Query runs
+getUser(params); // Cache hit (same reference)
+```
+
+**Next.js-Specific Note:**
+
+In Next.js, the `fetch` API is automatically extended with request memoization. Requests with the same URL and options are automatically deduplicated within a single request, so you don't need `React.cache()` for `fetch` calls. However, `React.cache()` is still essential for other async tasks:
+
+- Database queries (Prisma, Drizzle, etc.)
+- Heavy computations
+- Authentication checks
+- File system operations
+- Any non-fetch async work
+
+Use `React.cache()` to deduplicate these operations across your component tree.
+
+Reference: [React.cache documentation](https://react.dev/reference/react/cache)
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-dedup-props.md b/.cursor/skills/vercel-react-best-practices/rules/server-dedup-props.md
new file mode 100644
index 000000000..677086968
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-dedup-props.md
@@ -0,0 +1,65 @@
+---
+title: Avoid Duplicate Serialization in RSC Props
+impact: LOW
+impactDescription: reduces network payload by avoiding duplicate serialization
+tags: server, rsc, serialization, props, client-components
+---
+
+## Avoid Duplicate Serialization in RSC Props
+
+**Impact: LOW (reduces network payload by avoiding duplicate serialization)**
+
+RSC→client serialization deduplicates by object reference, not value. Same reference = serialized once; new reference = serialized again. Do transformations (`.toSorted()`, `.filter()`, `.map()`) in client, not server.
+
+**Incorrect (duplicates array):**
+
+```tsx
+// RSC: sends 6 strings (2 arrays × 3 items)
+<ClientList usernames={usernames} usernamesOrdered={usernames.toSorted()} />
+```
+
+**Correct (sends 3 strings):**
+
+```tsx
+// RSC: send once
+<ClientList usernames={usernames} />;
+
+// Client: transform there
+("use client");
+const sorted = useMemo(() => [...usernames].sort(), [usernames]);
+```
+
+**Nested deduplication behavior:**
+
+Deduplication works recursively. Impact varies by data type:
+
+- `string[]`, `number[]`, `boolean[]`: **HIGH impact** - array + all primitives fully duplicated
+- `object[]`: **LOW impact** - array duplicated, but nested objects deduplicated by reference
+
+```tsx
+// string[] - duplicates everything
+usernames={['a','b']} sorted={usernames.toSorted()} // sends 4 strings
+
+// object[] - duplicates array structure only
+users={[{id:1},{id:2}]} sorted={users.toSorted()} // sends 2 arrays + 2 unique objects (not 4)
+```
+
+**Operations breaking deduplication (create new references):**
+
+- Arrays: `.toSorted()`, `.filter()`, `.map()`, `.slice()`, `[...arr]`
+- Objects: `{...obj}`, `Object.assign()`, `structuredClone()`, `JSON.parse(JSON.stringify())`
+
+**More examples:**
+
+```tsx
+// ❌ Bad
+<C users={users} active={users.filter(u => u.active)} />
+<C product={product} productName={product.name} />
+
+// ✅ Good
+<C users={users} />
+<C product={product} />
+// Do filtering/destructuring in client
+```
+
+**Exception:** Pass derived data when transformation is expensive or client doesn't need original.
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-parallel-fetching.md b/.cursor/skills/vercel-react-best-practices/rules/server-parallel-fetching.md
new file mode 100644
index 000000000..8d78b54b2
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-parallel-fetching.md
@@ -0,0 +1,83 @@
+---
+title: Parallel Data Fetching with Component Composition
+impact: CRITICAL
+impactDescription: eliminates server-side waterfalls
+tags: server, rsc, parallel-fetching, composition
+---
+
+## Parallel Data Fetching with Component Composition
+
+React Server Components execute sequentially within a tree. Restructure with composition to parallelize data fetching.
+
+**Incorrect (Sidebar waits for Page's fetch to complete):**
+
+```tsx
+export default async function Page() {
+  const header = await fetchHeader();
+  return (
+    <div>
+      <div>{header}</div>
+      <Sidebar />
+    </div>
+  );
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+```
+
+**Correct (both fetch simultaneously):**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+export default function Page() {
+  return (
+    <div>
+      <Header />
+      <Sidebar />
+    </div>
+  );
+}
+```
+
+**Alternative with children prop:**
+
+```tsx
+async function Header() {
+  const data = await fetchHeader();
+  return <div>{data}</div>;
+}
+
+async function Sidebar() {
+  const items = await fetchSidebarItems();
+  return <nav>{items.map(renderItem)}</nav>;
+}
+
+function Layout({ children }: { children: ReactNode }) {
+  return (
+    <div>
+      <Header />
+      {children}
+    </div>
+  );
+}
+
+export default function Page() {
+  return (
+    <Layout>
+      <Sidebar />
+    </Layout>
+  );
+}
+```
diff --git a/.cursor/skills/vercel-react-best-practices/rules/server-serialization.md b/.cursor/skills/vercel-react-best-practices/rules/server-serialization.md
new file mode 100644
index 000000000..3fe071545
--- /dev/null
+++ b/.cursor/skills/vercel-react-best-practices/rules/server-serialization.md
@@ -0,0 +1,38 @@
+---
+title: Minimize Serialization at RSC Boundaries
+impact: HIGH
+impactDescription: reduces data transfer size
+tags: server, rsc, serialization, props
+---
+
+## Minimize Serialization at RSC Boundaries
+
+The React Server/Client boundary serializes all object properties into strings and embeds them in the HTML response and subsequent RSC requests. This serialized data directly impacts page weight and load time, so **size matters a lot**. Only pass fields that the client actually uses.
+
+**Incorrect (serializes all 50 fields):**
+
+```tsx
+async function Page() {
+  const user = await fetchUser(); // 50 fields
+  return <Profile user={user} />;
+}
+
+("use client");
+function Profile({ user }: { user: User }) {
+  return <div>{user.name}</div>; // uses 1 field
+}
+```
+
+**Correct (serializes only 1 field):**
+
+```tsx
+async function Page() {
+  const user = await fetchUser();
+  return <Profile name={user.name} />;
+}
+
+("use client");
+function Profile({ name }: { name: string }) {
+  return <div>{name}</div>;
+}
+```
diff --git a/.github/workflows/claude-code-review.yml b/.github/workflows/claude-code-review.yml
new file mode 100644
index 000000000..b5e8cfd4d
--- /dev/null
+++ b/.github/workflows/claude-code-review.yml
@@ -0,0 +1,44 @@
+name: Claude Code Review
+
+on:
+  pull_request:
+    types: [opened, synchronize, ready_for_review, reopened]
+    # Optional: Only run on specific file changes
+    # paths:
+    #   - "src/**/*.ts"
+    #   - "src/**/*.tsx"
+    #   - "src/**/*.js"
+    #   - "src/**/*.jsx"
+
+jobs:
+  claude-review:
+    # Optional: Filter by PR author
+    # if: |
+    #   github.event.pull_request.user.login == 'external-contributor' ||
+    #   github.event.pull_request.user.login == 'new-developer' ||
+    #   github.event.pull_request.author_association == 'FIRST_TIME_CONTRIBUTOR'
+
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: read
+      issues: read
+      id-token: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 1
+
+      - name: Run Claude Code Review
+        id: claude-review
+        uses: anthropics/claude-code-action@v1
+        with:
+          claude_code_oauth_token: ${{ secrets.CLAUDE_CODE_OAUTH_TOKEN }}
+          plugin_marketplaces: 'https://github.com/anthropics/claude-code.git'
+          plugins: 'code-review@claude-code-plugins'
+          prompt: '/code-review:code-review ${{ github.repository }}/pull/${{ github.event.pull_request.number }}'
+          # See https://github.com/anthropics/claude-code-action/blob/main/docs/usage.md
+          # or https://code.claude.com/docs/en/cli-reference for available options
+
diff --git a/.github/workflows/claude.yml b/.github/workflows/claude.yml
new file mode 100644
index 000000000..d300267f1
--- /dev/null
+++ b/.github/workflows/claude.yml
@@ -0,0 +1,50 @@
+name: Claude Code
+
+on:
+  issue_comment:
+    types: [created]
+  pull_request_review_comment:
+    types: [created]
+  issues:
+    types: [opened, assigned]
+  pull_request_review:
+    types: [submitted]
+
+jobs:
+  claude:
+    if: |
+      (github.event_name == 'issue_comment' && contains(github.event.comment.body, '@claude')) ||
+      (github.event_name == 'pull_request_review_comment' && contains(github.event.comment.body, '@claude')) ||
+      (github.event_name == 'pull_request_review' && contains(github.event.review.body, '@claude')) ||
+      (github.event_name == 'issues' && (contains(github.event.issue.body, '@claude') || contains(github.event.issue.title, '@claude')))
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: read
+      issues: read
+      id-token: write
+      actions: read # Required for Claude to read CI results on PRs
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 1
+
+      - name: Run Claude Code
+        id: claude
+        uses: anthropics/claude-code-action@v1
+        with:
+          claude_code_oauth_token: ${{ secrets.CLAUDE_CODE_OAUTH_TOKEN }}
+
+          # This is an optional setting that allows Claude to read CI results on PRs
+          additional_permissions: |
+            actions: read
+
+          # Optional: Give a custom prompt to Claude. If this is not specified, Claude will perform the instructions specified in the comment that tagged it.
+          # prompt: 'Update the pull request description to include a summary of changes.'
+
+          # Optional: Add claude_args to customize behavior and configuration
+          # See https://github.com/anthropics/claude-code-action/blob/main/docs/usage.md
+          # or https://code.claude.com/docs/en/cli-reference for available options
+          # claude_args: '--allowed-tools Bash(gh pr:*)'
+
diff --git a/.github/workflows/tests.yaml b/.github/workflows/tests.yaml
new file mode 100644
index 000000000..c6ec2c1bf
--- /dev/null
+++ b/.github/workflows/tests.yaml
@@ -0,0 +1,38 @@
+name: Tests
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10.10.0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "pnpm"
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Run API tests
+        run: pnpm test
+
+      - name: Upload coverage
+        uses: codecov/codecov-action@v4
+        if: always()
+        with:
+          files: ./apps/api/coverage/coverage-final.json
+          flags: api
+          fail_ci_if_error: false
diff --git a/.gitignore b/.gitignore
index c84c1024e..a1c56707f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -146,3 +146,6 @@ dist
 
 .sst/
 .vercel
+
+.github/skills/*
+.github/copilot-instructions.md
\ No newline at end of file
diff --git a/.vscode/launch.json b/.vscode/launch.json
index 910d2e473..9d2106e94 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -33,6 +33,20 @@
       },
       "outFiles": ["${workspaceFolder}/**/*.js", "!**/node_modules/**"],
       "cwd": "${workspaceFolder}/apps/api"
+    },
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "api test",
+      "skipFiles": ["<node_internals>/**"],
+      "runtimeExecutable": "pnpm",
+      "runtimeArgs": ["run", "test:watch"],
+      "env": {
+        "TS_NODE_PROJECT": "${workspaceFolder}/tsconfig.json",
+        "ENV_FILE": "${workspaceFolder}/apps/api/.env"
+      },
+      "outFiles": ["${workspaceFolder}/**/*.js", "!**/node_modules/**"],
+      "cwd": "${workspaceFolder}/apps/api"
     }
   ]
 }
diff --git a/AGENTS.md b/AGENTS.md
index 1e66b53e5..186c9e96e 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -1,5 +1,13 @@
 # AGENTS.md
 
+> **Note**: Each package has its own detailed AGENTS.md file. See package-specific guides for detailed information:
+>
+> - [Indexer](apps/indexer/AGENTS.md) - Blockchain event indexing
+> - [API](apps/api/AGENTS.md) - REST API with OpenAPI
+> - [API Gateway](apps/api-gateway/AGENTS.md) - GraphQL gateway
+> - [Dashboard](apps/dashboard/AGENTS.md) - Frontend application
+> - [GraphQL Client](packages/graphql-client/AGENTS.md) - Type generation
+
 - **Role**: Full-stack TypeScript engineer for the Anticapture DAO governance platform
 - **Skills**: React, Next.js, Node.js, GraphQL, blockchain indexing, PostgreSQL
 - **Output**: Production-ready code that passes typecheck and lint before commit
@@ -11,8 +19,9 @@
 - Run `pnpm <package> typecheck` and `pnpm <package> lint` on affected packages after every change
 - Use Conventional Commits for all commit messages
 - Use the project's path aliases (`@/*`) for imports
-- Follow the existing file/folder structure conventions described below
+- Follow the existing file/folder structure conventions in each package's AGENTS.md
 - Use MCP tools (Railway, ClickUp) for read operations freely
+- Check package-specific AGENTS.md for detailed guidelines
 
 ### Ask first
 
@@ -32,6 +41,7 @@
 - Remove or skip failing tests without explanation
 - Commit `node_modules`, `.env`, or generated files
 - Leak private variables
+- Cast types to `any` or `unknown` without explicitly asked to
 
 ## Commands
 
@@ -60,8 +70,7 @@ pnpm api test:watch                       # Jest watch mode for API
 pnpm gateway test                         # Jest unit tests for gateway
 
 # Infrastructure
-pnpm indexer dev --config config/<dao>    # Only when explicitly asked
-railway run -s <service-id> -e dev <cmd>  # Run commands with Railway env vars, prioritize this command.
+pnpm indexer dev --config config/<dao>      # Only when explicitly asked
 ```
 
 ## External Tools
@@ -72,9 +81,7 @@ railway run -s <service-id> -e dev <cmd>  # Run commands with Railway env vars,
 - **ClickUp**: Issues and task tracking on [ClickUp](https://app.clickup.com/).
   - See `.agents/rules/clickup/clickup.mdc` for detailed configuration and best practices
 
-## Components
-
-### Overview
+## Architecture Overview
 
 Anticapture is a pnpm monorepo with 5 runtime components and 1 code-generation package:
 
@@ -94,84 +101,17 @@ Ethereum RPC ─┘         │
                       Dashboard (Next.js frontend)
 ```
 
-### 1. Indexer (`@anticapture/indexer`)
-
-- `service-id`: `<dao>-indexer`
-- **Port**: 42069
-- **Source**: `apps/indexer`
-- **Stack**: Ponder 0.16, Hono 4.10, viem 2.37, Zod 3.25
-- **Depends on**: PostgreSQL and Ethereum RPC
-- **Dev command**: `pnpm indexer dev --config config/<dao>.config`
-- **Caveats**:
-  - Every code change triggers a full reindex of the DAO contracts.
-  - Only run it when explicitly asked and avoid unnecessary changes.
-
-### 2. API (`@anticapture/api`)
-
-- `service-id`: `<dao>-api`
-- **Port**: 42069 (configurable via `PORT`)
-- **Source**: `apps/api`
-- **Stack**: Hono 4.7, Drizzle ORM 0.41, @hono/zod-openapi 0.19, pg 8.17
-- **What it does**: REST API serving governance data from the indexer. Exposes an OpenAPI spec at `/docs` consumed by the API Gateway.
-- **Depends on**: PostgreSQL (with data from Indexer), Ethereum RPC
-- **Dev command**: `pnpm api dev`
-- **Test command**: `pnpm api test`
-- **Database schema**: ALl the schema is a mapping from the @apps/indexer/ponder.schema.ts syntax to the Drizzle version of it. Whenever something is needed, it should be changed on the original file first, and then translated to the drizzle format.
-
-### 3. API Gateway (`@anticapture/api-gateway`)
-
-- `service-id`: `api-gateway`
-- **Port**: 4000
-- **Source**: `apps/api-gateway`
-- **Stack**: GraphQL Mesh 0.100+, GraphQL 16.11
-- **What it does**: Aggregates multiple DAO API instances into a single unified GraphQL endpoint. Discovers sources dynamically from `DAO_API_*` env vars, connecting to each API's `/docs` OpenAPI spec.
-- **Depends on**: One or more API instances running either locally or on Railway
-- **Dev command**: `pnpm gateway dev`
-- **Env vars**:
-
-| Variable        | Required     | Example                  | Description             |
-| --------------- | ------------ | ------------------------ | ----------------------- |
-| `DAO_API_ENS`   | at least one | `http://localhost:42069` | URL of ENS API instance |
-| `DAO_API_UNI`   | no           | `http://localhost:42070` | URL of UNI API instance |
-| `DAO_API_<DAO>` | no           | —                        | Any supported DAO ID    |
-| `PORT`          | no           | 4000                     | HTTP port               |
-
-### 4. GraphQL Client (`@anticapture/graphql-client`)
-
-- **Source**: `packages/graphql-client`
-- **Stack**: @graphql-codegen/cli 5.0, @graphql-codegen/typescript-react-apollo 4.3
-- **What it does**: Reads the API Gateway's GraphQL schema and generates TypeScript types + React Apollo hooks. The dashboard imports this as a `workspace:*` dependency.
-- **Depends on**: API Gateway either locally or on Railway
-- **Codegen command**: `pnpm client codegen`
-- **Dev command (hot reload)**: `pnpm client dev`
-- **Env vars**: use the remote gateway to generate things locally
-
-| Variable                       | Required | Default | Description     |
-| ------------------------------ | -------- | ------- | --------------- |
-| `ANTICAPTURE_GRAPHQL_ENDPOINT` | yes      | —       | API Gateway URL |
-
-### 5. Dashboard (`@anticapture/dashboard`)
-
-- **Port**: 3000
-- **Source**: `apps/dashboard`
-- **Stack**: Next.js 16.1, React 19.2, Tailwind CSS 4.1, Apollo Client 3.13, wagmi 2.12, viem 2.37, Zustand 5.0, Recharts 2.15
-- **What it does**: Frontend application providing DAO governance analytics, risk assessment, token distribution, and community tools.
-- **Depends on**: API Gateway (at runtime via GraphQL), GraphQL Client (at build time via workspace dep)
-- **Dev command**: `pnpm dashboard dev`
-- **Test command**: `pnpm dashboard test`
-- **Env vars** (from `apps/dashboard/.env`):
-
-| Variable                                | Required | Description                                                         |
-| --------------------------------------- | -------- | ------------------------------------------------------------------- |
-| `NEXT_PUBLIC_BASE_URL`                  | yes      | API Gateway GraphQL endpoint (e.g. `http://localhost:4000/graphql`) |
-| `NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID` | yes      | WalletConnect project ID                                            |
-| `NEXT_PUBLIC_ALCHEMY_KEY`               | yes      | Alchemy RPC key                                                     |
-| `NEXT_PUBLIC_SITE_URL`                  | no       | Site URL for SEO/meta                                               |
-| `RESEND_API_KEY`                        | no       | Resend email API key (contact form)                                 |
-| `RESEND_FROM_EMAIL`                     | no       | Sender email address                                                |
-| `CONTACT_EMAIL`                         | no       | Recipient for contact form                                          |
-
----
+### Components Summary
+
+| Component          | Port  | Purpose                                 | Docs                                                                   |
+| ------------------ | ----- | --------------------------------------- | ---------------------------------------------------------------------- |
+| **Indexer**        | 42069 | Blockchain event indexing (Ponder)      | [apps/indexer/AGENTS.md](apps/indexer/AGENTS.md)                       |
+| **API**            | 42069 | REST API with OpenAPI (Hono + Drizzle)  | [apps/api/AGENTS.md](apps/api/AGENTS.md)                               |
+| **API Gateway**    | 4000  | Unified GraphQL endpoint (GraphQL Mesh) | [apps/api-gateway/AGENTS.md](apps/api-gateway/AGENTS.md)               |
+| **GraphQL Client** | —     | Generated TypeScript types & hooks      | [packages/graphql-client/AGENTS.md](packages/graphql-client/AGENTS.md) |
+| **Dashboard**      | 3000  | Next.js frontend with DAO analytics     | [apps/dashboard/AGENTS.md](apps/dashboard/AGENTS.md)                   |
+
+> **See each package's AGENTS.md for detailed information on stack, environment variables, file structure, and development workflows.**
 
 ## Dependency Graph (startup order)
 
@@ -182,87 +122,13 @@ For a full local stack, start services in this order:
 3. `pnpm client codegen`
 4. `pnpm dashboard dev`
 
-Common flows:
-
-- **UI implementation**: run the client and dashboard pointing to the dev `api-gateway`
-- **API feature**: run the API with the dev envs, then gateway and then client + dashboard (only run the gateway and frontend when asked)
-
-## File Structure Conventions
-
-### Where to put new code
-
-| What you're adding             | Where it goes                                     |
-| ------------------------------ | ------------------------------------------------- |
-| New dashboard feature          | `apps/dashboard/features/<feature-name>/`         |
-| Feature-specific component     | `apps/dashboard/features/<feature>/components/`   |
-| Feature-specific hook          | `apps/dashboard/features/<feature>/hooks/`        |
-| Reusable UI component          | `apps/dashboard/shared/components/ui/`            |
-| Design system component        | `apps/dashboard/shared/components/design-system/` |
-| Shared hook (cross-feature)    | `apps/dashboard/shared/hooks/`                    |
-| Shared utility function        | `apps/dashboard/shared/utils/`                    |
-| Shared TypeScript types        | `apps/dashboard/shared/types/`                    |
-| Page-level template            | `apps/dashboard/templates/`                       |
-| Next.js route                  | `apps/dashboard/app/`                             |
-| New API controller             | `apps/api/src/controllers/<domain>/`              |
-| API service (business logic)   | `apps/api/src/services/<domain>/`                 |
-| API repository (data access)   | `apps/api/src/repositories/<domain>/`             |
-| API data mapper                | `apps/api/src/mappers/<domain>/`                  |
-| External API client            | `apps/api/src/clients/<service>/`                 |
-| Database schema                | `apps/api/src/database/schema/`                   |
-| Indexer event handler          | `apps/indexer/src/eventHandlers/`                 |
-| Per-DAO indexer implementation | `apps/indexer/src/indexer/<dao>/`                 |
-| DAO-specific indexer config    | `apps/indexer/config/<dao>.config.ts`             |
-
-### Feature module structure (Dashboard)
-
-Each feature follows this pattern:
+Common development workflows:
 
-```
-features/<feature-name>/
-├── components/     # Feature-specific components
-├── hooks/          # Feature-specific hooks
-├── contexts/       # Feature-specific React contexts
-└── utils/          # Feature-specific utilities
-```
-
-### API layered architecture
+- **UI implementation**: Run client and dashboard pointing to dev `api-gateway`
+- **API feature**: Run API with dev envs, then gateway, then client + dashboard (only run gateway and frontend when asked)
+- **Full stack**: Start all services in order (rare, prefer using Railway dev services)
 
-```
-Controller (route + validation) → Service (business logic) → Repository (DB queries)
-                                                            → Client (external APIs)
-                                  Mapper (DB → API response)
-```
-
-## Testing
-
-### Frameworks
-
-| Package   | Framework               | Config file                       |
-| --------- | ----------------------- | --------------------------------- |
-| Dashboard | Jest 29 + ts-jest       | `apps/dashboard/jest.config.js`   |
-| API       | Jest 29 + ts-jest       | `apps/api/jest.config.js`         |
-| Gateway   | Jest 29 + ts-jest       | `apps/api-gateway/jest.config.js` |
-| Dashboard | Storybook 10 + Vitest 3 | `apps/dashboard/vitest.config.ts` |
-
-### Conventions
-
-- Test files live next to the code they test: `foo.ts` → `foo.test.ts`
-- Use `describe` / `it` blocks with clear descriptions
-- Example:
-
-```typescript
-describe("truncateTimestampToMidnight", () => {
-  it("should return same timestamp when already at midnight UTC", () => {
-    const result = truncateTimestampToMidnight(1600041600);
-    expect(result).toBe(1600041600);
-  });
-
-  it("should truncate timestamp from middle of day to midnight UTC", () => {
-    const result = truncateTimestampToMidnight(1600084800);
-    expect(result).toBe(1600041600);
-  });
-});
-```
+> **For detailed file structure conventions and testing strategies, see each package's AGENTS.md file.**
 
 ## Code Style
 
@@ -276,7 +142,7 @@ describe("truncateTimestampToMidnight", () => {
 - **TypeScript**: strict mode
 - **Tailwind**: utility-first with `cn()` for class merging
 
-### Naming
+### Naming Conventions
 
 | Kind                | Convention       | Example                               |
 | ------------------- | ---------------- | ------------------------------------- |
@@ -287,72 +153,7 @@ describe("truncateTimestampToMidnight", () => {
 | Constants           | UPPER_SNAKE_CASE | `SECONDS_IN_DAY`, `CEXAddresses`      |
 | Path aliases        | `@/*`            | `import { cn } from "@/shared/utils"` |
 
-### Example: React component
-
-```tsx
-import { Slot } from "@radix-ui/react-slot";
-import { cn } from "@/shared/utils";
-import Spinner from "@/shared/components/ui/spinner";
-
-export const Button = ({
-  children,
-  className,
-  disabled = false,
-  variant = "primary",
-  loading = false,
-  loadingText,
-  ...props
-}: ButtonProps) => {
-  const isDisabled = disabled || loading;
-
-  return (
-    <button
-      className={cn(
-        "flex items-center justify-center gap-1.5 text-sm font-medium",
-        variantStyles[variant],
-        isDisabled && "pointer-events-none opacity-50",
-        className,
-      )}
-      disabled={isDisabled}
-      {...props}
-    >
-      {loading ? <Spinner label={loadingText} /> : children}
-    </button>
-  );
-};
-```
-
-### Example: API controller (Hono + OpenAPI)
-
-```typescript
-import { OpenAPIHono as Hono, createRoute } from "@hono/zod-openapi";
-import { DaoService } from "@/services";
-import { DaoResponseSchema } from "@/mappers";
-
-export function dao(app: Hono, service: DaoService) {
-  app.openapi(
-    createRoute({
-      method: "get",
-      operationId: "dao",
-      path: "/dao",
-      summary: "Get DAO governance parameters",
-      tags: ["governance"],
-      responses: {
-        200: {
-          description: "DAO governance parameters",
-          content: {
-            "application/json": { schema: DaoResponseSchema },
-          },
-        },
-      },
-    }),
-    async (context) => {
-      const daoData = await service.getDaoParameters();
-      return context.json(daoData, 200);
-    },
-  );
-}
-```
+> **For code examples and implementation patterns, see each package's AGENTS.md file.**
 
 ## Git Workflow
 
@@ -364,22 +165,12 @@ export function dao(app: Hono, service: DaoService) {
 
 Types: `feat/`, `fix/`, `chore/`, `refactor/`, `hotfix/`, `docs/`, `test/`
 
-Examples: `feat/activity-feed`, `fix/proposal-state`, `hotfix/voting-modal-crash`
-
 ### Commit messages (Conventional Commits, enforced via commitlint + husky)
 
 ```text
 <type>(<optional scope>): <description>
 ```
 
-Types: `feat`, `fix`, `chore`, `refactor`, `docs`, `style`, `test`, `perf`, `ci`, `build`, `revert`
-
-Examples:
-
-- `feat: event feed dashboard`
-- `fix: prevent BigInt crash from formatted voting power string`
-- `chore(deps): update graphql-mesh to 0.100`
-
 ### Main branches
 
 - `main` — production
@@ -391,16 +182,14 @@ After every implementation, run typecheck and lint on the affected packages befo
 
 ```bash
 # Prefer scoped checks when changes are limited to one package
-pnpm dashboard typecheck
-pnpm dashboard lint
-pnpm api typecheck
-pnpm api lint
-pnpm indexer typecheck
-pnpm gateway typecheck
+pnpm <service> typecheck
+pnpm <service> lint
+pnpm <service> lint:fix
 
 # Full monorepo (use when changes span multiple packages)
 pnpm typecheck
 pnpm lint
+pnpm lint:fix
 ```
 
 If either command fails, fix the reported issues before committing.
@@ -409,71 +198,40 @@ If either command fails, fix the reported issues before committing.
 
 When creating a PR, ensure it:
 
-1. Includes a clear description of the changes
-2. References any related ClickUp issues it addresses
-3. Passes all typecheck and lint checks
-4. Passes all tests
-5. Includes screenshots for UI changes
-6. Keeps the PR focused on a single concern
+1. **Targets `dev` branch** by default (never directly to `main`)
+2. **Includes clear description** of what changed and why
+3. **References ClickUp issues** that it addresses
+4. **Passes all checks**: `pnpm typecheck && pnpm lint` on affected packages
+5. **Includes screenshots** for UI/visual changes
+6. **Focused scope**: One concern per PR (avoid mixing features/fixes)
+7. **Follows package guidelines**: Check relevant package AGENTS.md files
 
-## Shared Agent Configuration
+## Working with Package-Specific Guidelines
 
-All agent configuration (MCP servers, skills, rules) lives in `.agents/` as the single source of truth, symlinked into each tool's config directory.
+Each package has its own `AGENTS.md` file with detailed information:
 
-```text
-.agents/
-├── mcp.json              # MCP server definitions
-├── skills/               # Agent skills (e.g. Railway)
-└── rules/                # Service-specific .mdc rules
-    └── <service>/
-
-.claude/
-├── mcp.json        → ../.agents/mcp.json
-├── skills/<skill>  → ../../.agents/skills/<skill>
-└── rules/<service> → ../../.agents/rules/<service>
-
-.cursor/
-├── mcp.json        → ../.agents/mcp.json
-├── skills/<skill>  → ../../.agents/skills/<skill>
-└── rules/<service> → ../../.agents/rules/<service>
-```
-
-### Adding new configuration
-
-When adding a new MCP server, skill, or rule:
-
-1. Add the source file in `.agents/`
-2. Symlink it into both `.claude/` and `.cursor/`:
-
-```bash
-# MCP config (already symlinked once)
-ln -s ../.agents/mcp.json .claude/mcp.json
-ln -s ../.agents/mcp.json .cursor/mcp.json
-
-# New skill
-ln -s ../../.agents/skills/<skill> .claude/skills/<skill>
-ln -s ../../.agents/skills/<skill> .cursor/skills/<skill>
-
-# New rule directory
-ln -s ../../../.agents/rules/<service> .claude/rules/<service>
-ln -s ../../../.agents/rules/<service> .cursor/rules/<service>
-```
+- **Architecture & patterns** specific to that package
+- **File structure conventions** and where to put new code
+- **Code examples** and best practices
+- **Testing strategies** and common issues
+- **Package-specific commands** and workflows
 
-Never place tool-specific config directly in `.claude/` or `.cursor/` — always go through `.agents/`.
+**When working on a package, always check its AGENTS.md file first.**
 
 ## Self-Improvement
 
-When you make significant changes to the codebase:
+When making significant changes:
 
-1. **Update AGENTS.md** if you change:
-   - Architecture (add/remove services, change dependency graph)
-   - Commands or workflows
-   - File structure conventions
-   - Code style patterns or examples
+1. **Update root AGENTS.md** if you change:
+   - Overall architecture (add/remove services)
+   - Dependency graph or startup order
+   - Cross-package conventions
+   - General workflows or boundaries
 
-2. **Update service-specific rules** in `.agents/rules/<service>/` if you change:
-   - Design system tokens or components (dashboard)
-   - Service-specific conventions
-   - Domain-specific patterns
+2. **Update package AGENTS.md** if you change:
+   - Package-specific architecture or patterns
+   - File structure within that package
+   - Package commands or development workflow
+   - Testing strategies or code examples
 
-3. **Do NOT duplicate** — if it's already in AGENTS.md, don't add it to rules
+3. **Avoid duplication**: If it's package-specific, put it in the package AGENTS.md, not root
diff --git a/CLAUDE.md b/CLAUDE.md
index 2b2767d67..e3e58838e 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -173,7 +173,7 @@ docker-compose up -d  # Start PostgreSQL and local blockchain
   - Functions: camelCase
 - **Git**: Conventional Commits with commitlint
 - **Type Safety**: Full TypeScript coverage
-- **Testing**: Jest, Vitest, Playwright for different layers
+- **Testing**: Jest, Vitest, Playwright for different layers (see @.claude/rules/testing.md for guidelines)
 
 ## Configuration Files
 
diff --git a/README.md b/README.md
index 175e843d9..379afaff0 100644
--- a/README.md
+++ b/README.md
@@ -1,86 +1,10 @@
-# Anticapture
+# Anticapture — Claude Code Configuration
 
-> A comprehensive DAO governance security platform for analyzing and preventing governance capture risks
+See [AGENTS.md](./AGENTS.md) for the complete project reference: architecture, components, commands, conventions, boundaries, and workflows.
 
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![Version](https://img.shields.io/badge/version-0.3.1-blue.svg)](package.json)
+## Claude-Specific Tools
 
-## Overview
+### MCP Tools
 
-Anticapture is a data-driven platform that helps DAO communities identify, assess, and mitigate governance capture risks. The platform provides comprehensive security analysis, attack profitability assessments, and real-time governance monitoring for major DAOs including Uniswap, ENS, and Optimism.
-
-## Key Features
-
-- **🛡️ Governance Security Analysis** - Multi-dimensional risk assessment and vulnerability monitoring
-- **📊 Attack Profitability Assessment** - Economic feasibility analysis of potential governance attacks
-- **🗳️ Governance Activity Tracking** - Proposal lifecycle and voting participation monitoring
-- **🪙 Token Distribution Analysis** - Voting power concentration and decentralization metrics
-- **📈 Resilience Assessment** - DAO maturity and security milestone tracking
-- **✍️ Community Petition System** - Governance improvement proposal collection
-  implement using Snapshot
-
-## Applications
-
-| Application                              | Description                                              | Technology                    |
-| ---------------------------------------- | -------------------------------------------------------- | ----------------------------- |
-| [**Dashboard**](./apps/dashboard)        | Frontend interface with DAO analytics and visualizations | Next.js, TypeScript, Tailwind |
-| [**API Gateway**](./apps/api-gateway)    | Unified GraphQL API aggregating multiple data sources    | GraphQL Mesh                  |
-| [**Indexer**](./apps/indexer)            | Blockchain event indexer for real-time governance data   | Ponder, PostgreSQL            |
-| [**Monitoring**](./apps/indexer-metrics) | Performance monitoring and metrics                       | Grafana, Prometheus           |
-
-## Quick Start
-
-### Prerequisites
-
-- Node.js 18.14+
-- pnpm 10.10.0+
-- Docker & Docker Compose
-
-### Installation
-
-```bash
-# Clone and install
-git clone https://github.com/blockful-io/anticapture.git
-cd anticapture
-pnpm install
-
-# Start infrastructure
-docker-compose up -d
-
-# Run development environment
-pnpm dashboard dev    # Frontend at http://localhost:3000
-pnpm gateway dev      # API Gateway at http://localhost:4000
-pnpm indexer dev      # Indexer API at http://localhost:42069
-```
-
-## Development
-
-This monorepo uses pnpm workspaces and Turbo for efficient development and builds.
-
-```bash
-# Application-specific commands
-pnpm <app-name> <command>
-
-# Examples
-pnpm dashboard build
-pnpm indexer start
-pnpm gateway test
-```
-
-See individual application READMEs for detailed setup and development instructions.
-
-## Contributing
-
-1. Fork the repository
-2. Create a feature branch (`git checkout -b feature/name`)
-3. Make your changes following existing code conventions
-4. Test your changes
-5. Submit a pull request
-
-## License
-
-MIT License - see [LICENSE](LICENSE) file for details.
-
----
-
-Built by [Blockful](https://blockful.io)
+- **Context7 MCP**: Use to fetch updated documentation for libraries and frameworks like Next.js, Tailwind CSS, Shadcn.
+- **Playwright MCP**: Use to check visual changes in the frontend with a real browser when UI modifications are made.
diff --git a/apps/api-gateway/AGENTS.md b/apps/api-gateway/AGENTS.md
new file mode 100644
index 000000000..0f905616b
--- /dev/null
+++ b/apps/api-gateway/AGENTS.md
@@ -0,0 +1,186 @@
+# API Gateway Package Guide
+
+## Overview
+
+- **Service ID**: `api-gateway`
+- **Port**: 4000
+- **Stack**: GraphQL Mesh 0.100+, GraphQL 16.11
+- **Purpose**: Unified GraphQL API aggregating multiple DAO API instances
+
+## What It Does
+
+- Aggregates multiple DAO-specific API instances into a single GraphQL endpoint
+- Discovers API sources dynamically from `DAO_API_*` environment variables
+- Converts OpenAPI specs from each API to GraphQL schemas
+- Provides a unified query interface for the frontend
+- Serves GraphQL Playground for development
+
+## Commands
+
+```bash
+# Development
+pnpm gateway dev                # Start gateway on :4000
+
+# Testing
+pnpm gateway test               # Run Jest unit tests
+
+# Verification (run after every change)
+pnpm gateway typecheck          # Type checking
+pnpm gateway lint               # Lint checking
+pnpm gateway lint:fix           # Auto-fix lint issues
+```
+
+## Dependencies
+
+- **One or more API instances**: Running locally or on Railway
+- Each API must expose an OpenAPI spec at `/docs`
+
+## Environment Variables
+
+Configure which DAO APIs to aggregate:
+
+| Variable        | Required     | Example                  | Description             |
+| --------------- | ------------ | ------------------------ | ----------------------- |
+| `DAO_API_ENS`   | at least one | `http://localhost:42069` | URL of ENS API instance |
+| `DAO_API_UNI`   | no           | `http://localhost:42070` | URL of UNI API instance |
+| `DAO_API_<DAO>` | no           | —                        | Any supported DAO ID    |
+| `PORT`          | no           | 4000                     | HTTP port               |
+
+### Dynamic Source Discovery
+
+The gateway automatically:
+
+1. Scans environment for `DAO_API_*` variables
+2. Fetches OpenAPI spec from each URL's `/docs` endpoint
+3. Converts OpenAPI to GraphQL schema
+4. Exposes unified schema with DAO-prefixed operations
+
+## File Structure
+
+```
+apps/api-gateway/
+├── src/
+│   ├── index.ts              # Entry point & Mesh configuration
+│   ├── resolvers/            # Custom GraphQL resolvers (if any)
+│   └── config/               # Gateway configuration
+├── tests/                    # Jest test files
+├── .meshrc.yaml              # GraphQL Mesh configuration
+└── jest.config.js            # Jest configuration
+```
+
+## How It Works
+
+1. **Environment scanning**: Reads `DAO_API_*` variables
+2. **Source registration**: Creates GraphQL Mesh sources for each API
+3. **Schema stitching**: Combines all schemas into unified GraphQL schema
+4. **Request routing**: Routes queries to appropriate backend API
+5. **Response aggregation**: Combines results from multiple APIs
+
+### Query Example
+
+```graphql
+query GetDAOData {
+  ens {
+    dao {
+      name
+      totalSupply
+    }
+  }
+  uni {
+    proposals {
+      id
+      title
+      status
+    }
+  }
+}
+```
+
+## Adding a New DAO
+
+To add support for a new DAO:
+
+1. Deploy a new API instance for the DAO
+2. Add environment variable: `DAO_API_<DAOID>=<url>`
+3. Restart the gateway
+4. The new DAO will be automatically available
+
+## Development Workflow
+
+### Local Development
+
+```bash
+# Terminal 1: Start ENS API
+pnpm api dev
+
+# Terminal 2: Start gateway (will discover running APIs)
+pnpm gateway dev
+
+# Terminal 3: Test queries
+curl http://localhost:4000/graphql
+```
+
+### Testing Against Railway
+
+```bash
+# Point to Railway-deployed APIs
+export DAO_API_ENS=https://ens-api.railway.app
+export DAO_API_UNI=https://uni-api.railway.app
+
+pnpm gateway dev
+```
+
+## Testing Strategy
+
+- **Integration tests**: Test gateway with mock API responses
+- **Schema validation**: Ensure OpenAPI → GraphQL conversion works
+- **Resolver tests**: Test custom resolvers (if any)
+
+## Common Issues
+
+### Gateway Won't Start
+
+- **No APIs configured**: At least one `DAO_API_*` variable must be set
+- **API unreachable**: Ensure API URLs are correct and accessible
+- **OpenAPI fetch fails**: Check that `/docs` endpoint returns valid OpenAPI spec
+
+### GraphQL Errors
+
+- **Operation not found**: Check that operation exists in source API
+- **Type mismatch**: OpenAPI schema may not match actual API response
+- **Timeout**: API may be slow to respond, increase timeout config
+
+## Custom Resolvers
+
+If you need to add custom logic (e.g., combining data from multiple sources):
+
+```typescript
+// src/resolvers/custom.ts
+export const resolvers = {
+  Query: {
+    combinedDAOData: async (root, args, context, info) => {
+      const ensData = await context.ENS.Query.dao();
+      const uniData = await context.UNI.Query.dao();
+
+      return {
+        ens: ensData,
+        uni: uniData,
+      };
+    },
+  },
+};
+```
+
+## GraphQL Playground
+
+When running locally, visit:
+
+- `http://localhost:4000/graphql` - GraphQL Playground
+- Explore schema, test queries, view documentation
+
+## Related Documentation
+
+- [GraphQL Mesh Documentation](https://the-guild.dev/graphql/mesh)
+- Root `AGENTS.md` for general guidelines
+- `apps/api/AGENTS.md` for source API documentation
+- `packages/graphql-client/AGENTS.md` for client generation
diff --git a/apps/api/AGENTS.md b/apps/api/AGENTS.md
new file mode 100644
index 000000000..09ed41f67
--- /dev/null
+++ b/apps/api/AGENTS.md
@@ -0,0 +1,221 @@
+# API Package Guide
+
+## Overview
+
+- **Service ID**: `<dao>-api`
+- **Port**: 42069 (configurable via `PORT` env var)
+- **Stack**: Hono 4.7, Drizzle ORM 0.41, @hono/zod-openapi 0.19, pg 8.17
+- **Purpose**: REST API serving governance data from the indexer with OpenAPI documentation
+
+## What It Does
+
+- Serves governance data indexed by the Indexer
+- Exposes RESTful endpoints with OpenAPI/Swagger documentation
+- Consumed by the API Gateway to create a unified GraphQL API
+- Provides `/docs` endpoint with interactive OpenAPI spec
+
+## Commands
+
+```bash
+# Development
+pnpm api dev                    # Start dev server on :42069
+
+# Testing
+pnpm api test                   # Run Vitest unit tests
+pnpm api test:watch             # Run tests in watch mode
+
+# Verification (run after every change)
+pnpm api typecheck              # Type checking
+pnpm api lint                   # Lint checking
+pnpm api lint:fix               # Auto-fix lint issues
+```
+
+## Dependencies
+
+- **PostgreSQL**: With data populated by the Indexer
+- **Ethereum RPC**: For some real-time queries
+- **Indexer**: Must have run to populate database
+
+## Architecture
+
+The API follows a **layered architecture**:
+
+```
+Controller (route + validation)
+    ↓
+Service (business logic)
+    ↓
+Repository (DB queries) ← → Client (external APIs)
+    ↓
+Mapper (DB → API response)
+```
+
+### Layer Responsibilities
+
+- **Controllers**: Define routes, validate requests, handle responses
+- **Services**: Implement business logic, orchestrate repositories and clients
+- **Repositories**: Execute database queries using Drizzle ORM
+- **Clients**: Interact with external APIs (CoinGecko, Dune, etc.)
+- **Mappers**: Transform database models to API response DTOs
+
+## File Structure
+
+```
+apps/api/
+├── src/
+│   ├── controllers/
+│   │   └── <domain>/           # Route definitions + OpenAPI specs
+│   ├── services/
+│   │   └── <domain>/           # Business logic
+│   ├── repositories/
+│   │   └── <domain>/           # Database queries
+│   ├── mappers/
+│   │   └── <domain>/           # Data transformation
+│   ├── clients/
+│   │   └── <service>/          # External API integrations
+│   ├── database/
+│   │   └── schema/             # Drizzle ORM schema definitions
+│   ├── config/                 # Configuration files
+│   └── index.ts                # Application entry point
+├── tests/                      # Vitest test files
+└── vitest.config.ts            # Vitest configuration
+```
+
+## Where to Put New Code
+
+| What you're adding       | Where it goes                |
+| ------------------------ | ---------------------------- |
+| New API endpoint         | `src/controllers/<domain>/`  |
+| Business logic           | `src/services/<domain>/`     |
+| Database query           | `src/repositories/<domain>/` |
+| Data transformation      | `src/mappers/<domain>/`      |
+| External API integration | `src/clients/<service>/`     |
+| Database schema          | `src/database/schema/`       |
+
+## Database Schema
+
+⚠️ **Important**: This schema is a **mapping** from the Indexer's Ponder schema.
+
+**Workflow for schema changes**:
+
+1. Change must originate in `apps/indexer/src/ponder.schema.ts`
+2. Get approval (triggers reindex + API changes)
+3. Translate Ponder syntax to Drizzle format in `src/database/schema/`
+4. Update relevant repositories and mappers
+5. Update OpenAPI schemas in controllers
+
+## Code Examples
+
+### Controller (Hono + OpenAPI)
+
+```typescript
+import { OpenAPIHono as Hono, createRoute } from "@hono/zod-openapi";
+import { DaoService } from "@/services";
+import { DaoResponseSchema } from "@/mappers";
+
+export function dao(app: Hono, service: DaoService) {
+  app.openapi(
+    createRoute({
+      method: "get",
+      operationId: "dao",
+      path: "/dao",
+      summary: "Get DAO governance parameters",
+      tags: ["governance"],
+      responses: {
+        200: {
+          description: "DAO governance parameters",
+          content: {
+            "application/json": { schema: DaoResponseSchema },
+          },
+        },
+      },
+    }),
+    async (context) => {
+      const daoData = await service.getDaoParameters();
+      return context.json(daoData, 200);
+    },
+  );
+}
+```
+
+### Service
+
+```typescript
+import { DaoRepository } from "@/repositories";
+import { mapDaoToResponse } from "@/mappers";
+
+export class DaoService {
+  constructor(private repository: DaoRepository) {}
+
+  async getDaoParameters() {
+    const daoData = await this.repository.getDaoConfig();
+    return mapDaoToResponse(daoData);
+  }
+}
+```
+
+### Repository
+
+```typescript
+import { db } from "@/database";
+import { daoConfig } from "@/database/schema";
+import { eq } from "drizzle-orm";
+
+export class DaoRepository {
+  async getDaoConfig() {
+    return await db.select().from(daoConfig).limit(1);
+  }
+}
+```
+
+## Testing Strategy
+
+- **Unit tests**: Test services and repositories in isolation
+- **Integration tests**: Test full request/response flow
+- **Mocking**: Use Vitest mocks for external dependencies
+
+```typescript
+// Example test
+describe("DaoService", () => {
+  it("should return DAO parameters", async () => {
+    const mockRepo = { getDaoConfig: vi.fn().mockResolvedValue({...}) };
+    const service = new DaoService(mockRepo);
+
+    const result = await service.getDaoParameters();
+
+    expect(result).toBeDefined();
+    expect(mockRepo.getDaoConfig).toHaveBeenCalled();
+  });
+});
+```
+
+## Development Workflow
+
+1. **Define OpenAPI schema** in mappers using Zod
+2. **Create repository** for database queries
+3. **Implement service logic** with business rules injecting an abstraction of the repository
+4. **Add the route** as a controller
+5. **Write tests** for new functionality
+6. **Verify**: `pnpm api typecheck && pnpm api lint && pnpm api test`
+7. **Test manually**:
+   1. Run `pnpm api dev`
+   2. Make requests varying the parameters to see how the API responds
+
+Every time a new endpoint/parameter is added/changed, the codegen files should be updated:
+
+1. run the API locally
+2. run the gateway pointing to the given API
+3. run the client pointing to the local gateway
+4. commit the generated files
+
+## Common Issues
+
+- **Type errors**: Ensure Drizzle schema matches Ponder schema structure
+
+## Related Documentation
+
+- [Hono Documentation](https://hono.dev)
+- [Drizzle ORM Documentation](https://orm.drizzle.team)
+- Root `AGENTS.md` for general guidelines
+- `apps/indexer/AGENTS.md` for source schema
+- `apps/api-gateway/AGENTS.md` for OpenAPI consumption
diff --git a/apps/api/jest.config.js b/apps/api/jest.config.js
deleted file mode 100644
index ba20b9b7c..000000000
--- a/apps/api/jest.config.js
+++ /dev/null
@@ -1,8 +0,0 @@
-module.exports = {
-  preset: "ts-jest",
-  testEnvironment: "node",
-  testMatch: ["**/*.test.ts"],
-  moduleNameMapper: {
-    "^@/(.*)$": "<rootDir>/src/$1",
-  },
-};
diff --git a/apps/api/package.json b/apps/api/package.json
index 36af10504..d20a5cd7e 100644
--- a/apps/api/package.json
+++ b/apps/api/package.json
@@ -5,8 +5,9 @@
   "type": "module",
   "scripts": {
     "typecheck": "tsc --noEmit",
-    "test": "jest",
-    "test:watch": "jest --watch",
+    "test": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "test:watch": "vitest",
     "clean": "rm -rf node_modules *.tsbuildinfo dist",
     "start": "node dist/index.js",
     "build": "tsup",
@@ -22,8 +23,8 @@
     "@hono/node-server": "^1.19.9",
     "@hono/zod-openapi": "^0.19.6",
     "axios": "^1.9.0",
-    "drizzle-kit": "^0.31.4",
-    "drizzle-orm": "~0.41.0",
+    "drizzle-kit": "^0.31.9",
+    "drizzle-orm": "^0.45.1",
     "hono": "^4.7.10",
     "pg": "^8.17.2",
     "viem": "^2.41.2",
@@ -31,18 +32,18 @@
     "zod-validation-error": "^3.4.1"
   },
   "devDependencies": {
-    "@types/jest": "^29.5.14",
+    "@electric-sql/pglite": "^0.3.15",
     "@types/node": "^20.16.5",
     "@types/pg": "^8.15.6",
+    "@vitest/coverage-v8": "3.2.4",
     "dotenv": "^16.5.0",
     "eslint": "^8.53.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
-    "jest": "^29.7.0",
     "prettier": "^3.5.3",
-    "ts-jest": "^29.4.1",
     "tsup": "^8.5.1",
     "tsx": "^4.21.0",
-    "typescript": "^5.8.3"
+    "typescript": "^5.8.3",
+    "vitest": "^3.0.5"
   }
 }
diff --git a/apps/api/src/controllers/account-balance/variations.ts b/apps/api/src/controllers/account-balance/variations.ts
index b64e13f91..4f516e260 100644
--- a/apps/api/src/controllers/account-balance/variations.ts
+++ b/apps/api/src/controllers/account-balance/variations.ts
@@ -51,7 +51,7 @@ export function accountBalanceVariations(
       );
 
       return context.json(
-        AccountBalanceVariationsResponseMapper(result, fromDate, toDate),
+        AccountBalanceVariationsResponseMapper(result, fromDate, toDate)
       );
     },
   );
diff --git a/apps/api/src/controllers/treasury/treasury.integration.test.ts b/apps/api/src/controllers/treasury/treasury.integration.test.ts
new file mode 100644
index 000000000..6844f26e6
--- /dev/null
+++ b/apps/api/src/controllers/treasury/treasury.integration.test.ts
@@ -0,0 +1,291 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from "vitest";
+import { OpenAPIHono as Hono } from "@hono/zod-openapi";
+import { treasury } from "./index";
+import { TreasuryService } from "@/services/treasury";
+import {
+  TreasuryProvider,
+  LiquidTreasuryDataPoint,
+  PriceProvider,
+} from "@/services/treasury";
+import { TreasuryRepository } from "@/repositories/treasury";
+import { parseEther } from "viem";
+
+/**
+ * Fakes for dependency injection
+ */
+class FakeTreasuryProvider implements TreasuryProvider {
+  private data: LiquidTreasuryDataPoint[] = [];
+
+  setData(data: { date: number; value: number }[]) {
+    this.data = data.map((item) => ({
+      date: item.date,
+      liquidTreasury: item.value,
+    }));
+  }
+
+  async fetchTreasury(
+    _cutoffTimestamp: number,
+  ): Promise<LiquidTreasuryDataPoint[]> {
+    return this.data;
+  }
+}
+
+class FakePriceProvider implements PriceProvider {
+  private prices: Map<number, number> = new Map();
+
+  setPrices(prices: Map<number, number>) {
+    this.prices = prices;
+  }
+
+  async getHistoricalPricesMap(_days: number): Promise<Map<number, number>> {
+    return this.prices;
+  }
+}
+
+/**
+ * FakeTreasuryRepository implements the same interface as TreasuryRepository
+ * This enables structural typing without explicit casting
+ */
+class FakeTreasuryRepository implements Pick<
+  TreasuryRepository,
+  "getTokenQuantities" | "getLastTokenQuantityBeforeDate"
+> {
+  private tokenQuantities: Map<number, bigint> = new Map();
+  private lastKnownQuantity: bigint | null = null;
+
+  setTokenQuantities(quantities: Map<number, bigint>) {
+    this.tokenQuantities = quantities;
+  }
+
+  setLastKnownQuantity(quantity: bigint | null) {
+    this.lastKnownQuantity = quantity;
+  }
+
+  async getTokenQuantities(
+    _cutoffTimestamp: number,
+  ): Promise<Map<number, bigint>> {
+    return this.tokenQuantities;
+  }
+
+  async getLastTokenQuantityBeforeDate(
+    _cutoffTimestamp: number,
+  ): Promise<bigint | null> {
+    return this.lastKnownQuantity;
+  }
+}
+
+/**
+ * Creates a test app with treasury routes
+ *
+ * Note: testClient(app) returns 'unknown' because Hono can't infer types
+ * when routes are added dynamically. We use 'as any' as a workaround.
+ * See: https://github.com/honojs/hono/issues/3148
+ */
+function createTestApp(
+  treasuryService: TreasuryService,
+  decimals: number = 18,
+) {
+  const app = new Hono();
+  treasury(app, treasuryService, decimals);
+  return app;
+}
+
+describe("Treasury Controller - Integration Tests", () => {
+  const FIXED_DATE = new Date("2026-01-15T00:00:00Z");
+  const FIXED_TIMESTAMP = Math.floor(FIXED_DATE.getTime() / 1000);
+  const ONE_DAY = 86400;
+
+  let fakeProvider: FakeTreasuryProvider;
+  let priceRepo: FakePriceProvider;
+  let metricsRepo: FakeTreasuryRepository;
+  let service: TreasuryService;
+  let app: Hono;
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(FIXED_DATE);
+
+    fakeProvider = new FakeTreasuryProvider();
+    metricsRepo = new FakeTreasuryRepository();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+
+    metricsRepo.setTokenQuantities(new Map());
+  });
+
+  describe("GET /treasury/liquid", () => {
+    beforeEach(() => {
+      service = new TreasuryService(
+        metricsRepo as unknown as TreasuryRepository,
+        fakeProvider,
+        undefined,
+      );
+      app = createTestApp(service);
+    });
+
+    it("should return 200 with valid response structure", async () => {
+      const expected = [
+        { date: FIXED_TIMESTAMP - ONE_DAY, value: 1000000 },
+        { date: FIXED_TIMESTAMP, value: 1100000 },
+      ];
+      fakeProvider.setData(expected);
+
+      const res = await app.request("/treasury/liquid");
+      expect(res.status).toBe(200);
+      expect(await res.json()).toEqual({
+        items: expected,
+        totalCount: expected.length,
+      });
+    });
+
+    it("should use default values when query params are omitted", async () => {
+      const expected = [{ date: FIXED_TIMESTAMP, value: 1000000 }];
+      fakeProvider.setData(expected);
+
+      const res = await app.request("/treasury/liquid");
+      expect(await res.json()).toEqual({
+        items: expected,
+        totalCount: expected.length,
+      });
+    });
+
+    it("should return empty items when no data available", async () => {
+      fakeProvider.setData([]);
+
+      const res = await app.request("/treasury/liquid?days=7d");
+      expect(res.status).toBe(200);
+      expect(await res.json()).toEqual({
+        items: [],
+        totalCount: 0,
+      });
+    });
+
+    it("should return asc ordered based on the query param", async () => {
+      const day1 = FIXED_TIMESTAMP - ONE_DAY * 2;
+      const day2 = FIXED_TIMESTAMP - ONE_DAY;
+      const day3 = FIXED_TIMESTAMP;
+
+      const expected = [
+        { date: day1, value: 1000 },
+        { date: day2, value: 2000 },
+        { date: day3, value: 3000 },
+      ];
+      fakeProvider.setData(expected);
+
+      const resAsc = await app.request("/treasury/liquid?days=7d&order=asc");
+      expect(await resAsc.json()).toEqual({
+        items: expected,
+        totalCount: expected.length,
+      });
+    });
+
+    it("should return desc ordered based on the query param", async () => {
+      const day1 = FIXED_TIMESTAMP - ONE_DAY * 2;
+      const day2 = FIXED_TIMESTAMP - ONE_DAY;
+      const day3 = FIXED_TIMESTAMP;
+
+      const expected = [
+        { date: day1, value: 1000 },
+        { date: day2, value: 2000 },
+        { date: day3, value: 3000 },
+      ];
+      fakeProvider.setData(expected);
+
+      const res = await app.request("/treasury/liquid?days=7d&order=desc");
+      expect(await res.json()).toEqual({
+        items: expected.sort((a, b) => b.date - a.date),
+        totalCount: 3,
+      });
+    });
+  });
+
+  describe("GET /treasury/dao-token", () => {
+    beforeEach(() => {
+      priceRepo = new FakePriceProvider();
+      service = new TreasuryService(
+        metricsRepo as unknown as TreasuryRepository,
+        fakeProvider,
+        priceRepo,
+      );
+      app = createTestApp(service);
+    });
+
+    it("should return 200 with calculated token treasury", async () => {
+      const quantity = parseEther("100");
+      const price = 50; // $50 per token
+
+      metricsRepo.setTokenQuantities(new Map([[FIXED_TIMESTAMP, quantity]]));
+      priceRepo.setPrices(new Map([[FIXED_TIMESTAMP, price]]));
+
+      const res = await app.request("/treasury/dao-token?days=7d");
+      expect(res.status).toBe(200);
+
+      expect(await res.json()).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: 5000 }], // 100 * $50
+        totalCount: 1,
+      });
+    });
+
+    it("should return empty when price provider is not configured", async () => {
+      const service = new TreasuryService(
+        metricsRepo as unknown as TreasuryRepository,
+        undefined,
+        undefined,
+      );
+      const app = createTestApp(service);
+
+      const res = await app.request("/treasury/dao-token?days=7d");
+      expect(res.status).toBe(200);
+      expect(await res.json()).toEqual({
+        items: [],
+        totalCount: 0,
+      });
+    });
+  });
+
+  describe("GET /treasury/total", () => {
+    beforeEach(() => {
+      priceRepo = new FakePriceProvider();
+      service = new TreasuryService(
+        metricsRepo as unknown as TreasuryRepository,
+        fakeProvider,
+        priceRepo,
+      );
+      app = createTestApp(service);
+    });
+
+    it("should return sum of liquid and token treasury", async () => {
+      // Liquid: $5,000,000
+      fakeProvider.setData([{ date: FIXED_TIMESTAMP, value: 5 }]);
+
+      // Token: 1000 tokens * $100 = $100,000
+      const quantity = parseEther("1000");
+      metricsRepo.setTokenQuantities(new Map([[FIXED_TIMESTAMP, quantity]]));
+      priceRepo.setPrices(new Map([[FIXED_TIMESTAMP, 100]]));
+
+      const res = await app.request("/treasury/total?days=7d");
+      expect(res.status).toBe(200);
+      expect(await res.json()).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: 100000 + 5 }],
+        totalCount: 1,
+      });
+    });
+
+    it("should work when only liquid treasury has data", async () => {
+      const expected = [{ date: FIXED_TIMESTAMP, value: 1000000 }];
+      fakeProvider.setData(expected);
+      metricsRepo.setTokenQuantities(new Map());
+      priceRepo.setPrices(new Map());
+
+      const res = await app.request("/treasury/total?days=7d");
+      expect(res.status).toBe(200);
+
+      expect(await res.json()).toEqual({
+        items: expected,
+        totalCount: 1,
+      });
+    });
+  });
+});
diff --git a/apps/api/src/repositories/account-balance/variations.ts b/apps/api/src/repositories/account-balance/variations.ts
index 40f76f78f..e0c23b62b 100644
--- a/apps/api/src/repositories/account-balance/variations.ts
+++ b/apps/api/src/repositories/account-balance/variations.ts
@@ -1,4 +1,4 @@
-import { asc, desc, gte, sql, and, inArray, lte, or } from "drizzle-orm";
+import { asc, desc, gte, sql, and, inArray, lte, eq } from "drizzle-orm";
 import { Drizzle } from "@/database";
 import { accountBalance, transfer } from "@/database";
 import { DBAccountBalanceVariation } from "@/mappers";
@@ -14,41 +14,6 @@ export class BalanceVariationsRepository {
     skip: number,
     orderDirection: "asc" | "desc",
     addresses?: Address[],
-  ): Promise<DBAccountBalanceVariation[]> {
-    return this.commonQuery(
-      fromTimestamp,
-      toTimestamp,
-      limit,
-      skip,
-      orderDirection,
-      addresses,
-    );
-  }
-
-  async getAccountBalanceVariationsByAccountId(
-    address: Address,
-    fromTimestamp: number | undefined,
-    toTimestamp: number | undefined,
-  ): Promise<DBAccountBalanceVariation | undefined> {
-    const [result] = await this.commonQuery(
-      fromTimestamp,
-      toTimestamp,
-      1,
-      0,
-      "desc",
-      [address],
-    );
-
-    return result;
-  }
-
-  private async commonQuery(
-    fromTimestamp: number | undefined,
-    toTimestamp: number | undefined,
-    limit: number,
-    skip: number,
-    orderDirection: "asc" | "desc",
-    addresses?: Address[],
   ): Promise<DBAccountBalanceVariation[]> {
     const scopedTransfers = this.db
       .select()
@@ -61,12 +26,6 @@ export class BalanceVariationsRepository {
           toTimestamp
             ? lte(transfer.timestamp, BigInt(toTimestamp))
             : undefined,
-          addresses
-            ? or(
-              inArray(transfer.fromAccountId, addresses),
-              inArray(transfer.toAccountId, addresses),
-            )
-            : undefined,
         ),
       )
       .as("scoped_transfers");
@@ -74,7 +33,7 @@ export class BalanceVariationsRepository {
     const transfersFrom = this.db
       .select({
         accountId: scopedTransfers.fromAccountId,
-        fromAmount: sql<string>`-SUM(${transfer.amount})`.as("from_amount"),
+        fromAmount: sql<string>`-SUM(${scopedTransfers.amount})`.as("from_amount"),
       })
       .from(scopedTransfers)
       .groupBy(scopedTransfers.fromAccountId)
@@ -83,7 +42,7 @@ export class BalanceVariationsRepository {
     const transfersTo = this.db
       .select({
         accountId: scopedTransfers.toAccountId,
-        toAmount: sql<string>`SUM(${transfer.amount})`.as("to_amount"),
+        toAmount: sql<string>`SUM(${scopedTransfers.amount})`.as("to_amount"),
       })
       .from(scopedTransfers)
       .groupBy(scopedTransfers.toAccountId)
@@ -110,7 +69,12 @@ export class BalanceVariationsRepository {
         sql`${accountBalance.accountId} = ${transfersTo.accountId}`,
       )
       .where(
-        sql`${transfersFrom.accountId} IS NOT NULL OR ${transfersTo.accountId} IS NOT NULL`,
+        and(
+          addresses
+            ? inArray(accountBalance.accountId, addresses)
+            : undefined,
+          sql`${transfersFrom.accountId} IS NOT NULL OR ${transfersTo.accountId} IS NOT NULL`,
+        )
       )
       .as("combined");
 
@@ -147,4 +111,94 @@ export class BalanceVariationsRepository {
       ).toString(),
     }));
   }
+
+  async getAccountBalanceVariationsByAccountId(
+    address: Address,
+    fromTimestamp: number | undefined,
+    toTimestamp: number | undefined,
+  ): Promise<DBAccountBalanceVariation | undefined> {
+    const scopedTransfers = this.db
+      .select()
+      .from(transfer)
+      .where(
+        and(
+          fromTimestamp
+            ? gte(transfer.timestamp, BigInt(fromTimestamp))
+            : undefined,
+          toTimestamp
+            ? lte(transfer.timestamp, BigInt(toTimestamp))
+            : undefined,
+        ),
+      )
+      .as("scoped_transfers");
+
+    const transfersFrom = this.db
+      .select({
+        accountId: scopedTransfers.fromAccountId,
+        fromAmount: sql<string>`-SUM(${scopedTransfers.amount})`.as("from_amount"),
+      })
+      .from(scopedTransfers)
+      .groupBy(scopedTransfers.fromAccountId)
+      .as("transfers_from");
+
+    const transfersTo = this.db
+      .select({
+        accountId: scopedTransfers.toAccountId,
+        toAmount: sql<string>`SUM(${scopedTransfers.amount})`.as("to_amount"),
+      })
+      .from(scopedTransfers)
+      .groupBy(scopedTransfers.toAccountId)
+      .as("transfers_to");
+
+    const combined = this.db
+      .select({
+        accountId: accountBalance.accountId,
+        currentBalance: accountBalance.balance,
+        fromChange: sql<string>`COALESCE(${transfersFrom.fromAmount}, 0)`.as(
+          "from_change",
+        ),
+        toChange: sql<string>`COALESCE(${transfersTo.toAmount}, 0)`.as(
+          "to_change",
+        ),
+      })
+      .from(accountBalance)
+      .leftJoin(
+        transfersFrom,
+        sql`${accountBalance.accountId} = ${transfersFrom.accountId}`,
+      )
+      .leftJoin(
+        transfersTo,
+        sql`${accountBalance.accountId} = ${transfersTo.accountId}`,
+      )
+      .where(eq(accountBalance.accountId, address))
+      .as("combined");
+
+    const [result] = await this.db
+      .select({
+        accountId: combined.accountId,
+        currentBalance: combined.currentBalance,
+        absoluteChange:
+          sql<string>`${combined.fromChange} + ${combined.toChange}`.as(
+            "absolute_change",
+          ),
+      })
+      .from(combined)
+      .where(sql`(${combined.fromChange} + ${combined.toChange}) != 0`);
+
+    if (!result) return undefined
+
+    return {
+      accountId: result.accountId,
+      previousBalance: result.currentBalance - BigInt(result.absoluteChange),
+      currentBalance: result.currentBalance,
+      absoluteChange: BigInt(result.absoluteChange),
+      percentageChange: (result.currentBalance - BigInt(result.absoluteChange)
+        ? Number(
+          (BigInt(result.absoluteChange) * 10000n) /
+          (result.currentBalance - BigInt(result.absoluteChange)),
+        ) / 100
+        : 0
+      ).toString(),
+    };
+  }
 }
diff --git a/apps/api/src/repositories/treasury/treasury.repository.integration.test.ts b/apps/api/src/repositories/treasury/treasury.repository.integration.test.ts
new file mode 100644
index 000000000..f1f2b5293
--- /dev/null
+++ b/apps/api/src/repositories/treasury/treasury.repository.integration.test.ts
@@ -0,0 +1,212 @@
+import { PGlite } from "@electric-sql/pglite";
+import { drizzle } from "drizzle-orm/pglite";
+import { pushSchema } from "drizzle-kit/api";
+import * as schema from "@/database/schema";
+import { daoMetricsDayBucket } from "@/database/schema";
+import { MetricTypesEnum } from "@/lib/constants";
+import { TreasuryRepository } from ".";
+
+type DaoMetricInsert = typeof daoMetricsDayBucket.$inferInsert;
+
+const createMetricRow = (
+  overrides: Partial<DaoMetricInsert> = {},
+): DaoMetricInsert => ({
+  date: 1600041600n,
+  daoId: "ENS",
+  tokenId: "ENS-token",
+  metricType: MetricTypesEnum.TREASURY,
+  open: 0n,
+  close: 1000n,
+  low: 0n,
+  high: 1000n,
+  average: 500n,
+  volume: 100n,
+  count: 1,
+  lastUpdate: 1600041600n,
+  ...overrides,
+});
+
+describe("TreasuryRepository - Integration", () => {
+  let client: PGlite;
+  let db: ReturnType<typeof drizzle<typeof schema>>;
+  let repository: TreasuryRepository;
+
+  beforeAll(async () => {
+    // pushSchema uses JSON.stringify internally, which doesn't handle BigInt
+    (BigInt.prototype as any).toJSON = function () {
+      return this.toString();
+    };
+
+    client = new PGlite();
+    db = drizzle(client, { schema });
+    repository = new TreasuryRepository(db);
+
+    const { apply } = await pushSchema(schema, db as any);
+    await apply();
+  });
+
+  afterAll(async () => {
+    await client.close();
+  });
+
+  beforeEach(async () => {
+    await db.delete(daoMetricsDayBucket);
+  });
+
+  describe("getTokenQuantities", () => {
+    it("returns correct Map with timestamp keys and close values", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([
+          createMetricRow({ date: 1000n, close: 500n }),
+          createMetricRow({ date: 2000n, close: 700n, tokenId: "ENS-token-2" }),
+        ]);
+
+      const result = await repository.getTokenQuantities(0);
+
+      expect(result.size).toBe(2);
+      expect(result.get(1000 * 1000)).toBe(500n); // Timestamp in milliseconds
+      expect(result.get(2000 * 1000)).toBe(700n); // Timestamp in milliseconds
+    });
+
+    it("filters by cutoff timestamp (date >= cutoff)", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([
+          createMetricRow({ date: 100n, close: 10n }),
+          createMetricRow({ date: 200n, close: 20n, tokenId: "ENS-token-2" }),
+          createMetricRow({ date: 300n, close: 30n, tokenId: "ENS-token-3" }),
+        ]);
+
+      const result = await repository.getTokenQuantities(200);
+
+      expect(result.size).toBe(2);
+      expect(result.has(100 * 1000)).toBe(false);
+      expect(result.get(200 * 1000)).toBe(20n);
+      expect(result.get(300 * 1000)).toBe(30n);
+    });
+
+    it("filters by metricType (only TREASURY rows)", async () => {
+      await db.insert(daoMetricsDayBucket).values([
+        createMetricRow({
+          date: 100n,
+          close: 10n,
+          metricType: MetricTypesEnum.TREASURY,
+        }),
+        createMetricRow({
+          date: 100n,
+          close: 99n,
+          metricType: MetricTypesEnum.TOTAL_SUPPLY,
+        }),
+      ]);
+
+      const result = await repository.getTokenQuantities(0);
+
+      expect(result.size).toBe(1);
+      expect(result.get(100 * 1000)).toBe(10n);
+    });
+
+    it("returns results in ascending date order regardless of insertion order", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([
+          createMetricRow({ date: 300n, close: 30n }),
+          createMetricRow({ date: 100n, close: 10n, tokenId: "ENS-token-2" }),
+          createMetricRow({ date: 200n, close: 20n, tokenId: "ENS-token-3" }),
+        ]);
+
+      const result = await repository.getTokenQuantities(0);
+      const keys = [...result.keys()];
+
+      expect(keys).toEqual([100 * 1000, 200 * 1000, 300 * 1000]);
+    });
+
+    it("returns empty Map when no rows exist", async () => {
+      const result = await repository.getTokenQuantities(0);
+
+      expect(result.size).toBe(0);
+    });
+
+    it("returns empty Map when no rows match the cutoff", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([createMetricRow({ date: 100n, close: 10n })]);
+
+      const result = await repository.getTokenQuantities(999);
+
+      expect(result.size).toBe(0);
+    });
+
+    it("boundary: cutoff equals exact date (inclusive, gte)", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([createMetricRow({ date: 500n, close: 50n })]);
+
+      const result = await repository.getTokenQuantities(500);
+
+      expect(result.size).toBe(1);
+      expect(result.get(500 * 1000)).toBe(50n);
+    });
+  });
+
+  describe("getLastTokenQuantityBeforeDate", () => {
+    it("returns null when no rows exist", async () => {
+      const result = await repository.getLastTokenQuantityBeforeDate(999);
+
+      expect(result).toBeNull();
+    });
+
+    it("returns null when no rows are before cutoff", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([createMetricRow({ date: 500n, close: 50n })]);
+
+      const result = await repository.getLastTokenQuantityBeforeDate(100);
+
+      expect(result).toBeNull();
+    });
+
+    it("boundary: cutoff equals exact date (inclusive, lte)", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([createMetricRow({ date: 500n, close: 50n })]);
+
+      const result = await repository.getLastTokenQuantityBeforeDate(500);
+
+      expect(result).toBe(50n);
+    });
+
+    it("returns most recent when multiple rows exist before cutoff", async () => {
+      await db
+        .insert(daoMetricsDayBucket)
+        .values([
+          createMetricRow({ date: 100n, close: 10n }),
+          createMetricRow({ date: 200n, close: 20n, tokenId: "ENS-token-2" }),
+          createMetricRow({ date: 300n, close: 30n, tokenId: "ENS-token-3" }),
+        ]);
+
+      const result = await repository.getLastTokenQuantityBeforeDate(400);
+
+      expect(result).toBe(30n);
+    });
+
+    it("filters by metricType (only TREASURY)", async () => {
+      await db.insert(daoMetricsDayBucket).values([
+        createMetricRow({
+          date: 200n,
+          close: 99n,
+          metricType: MetricTypesEnum.TOTAL_SUPPLY,
+        }),
+        createMetricRow({
+          date: 100n,
+          close: 10n,
+          metricType: MetricTypesEnum.TREASURY,
+        }),
+      ]);
+
+      const result = await repository.getLastTokenQuantityBeforeDate(300);
+
+      expect(result).toBe(10n);
+    });
+  });
+});
diff --git a/apps/api/src/services/delegation-percentage/delegation-percentage.service.test.ts b/apps/api/src/services/delegation-percentage/delegation-percentage.service.test.ts
deleted file mode 100644
index cecf85ada..000000000
--- a/apps/api/src/services/delegation-percentage/delegation-percentage.service.test.ts
+++ /dev/null
@@ -1,870 +0,0 @@
-import { DelegationPercentageService } from "./delegation-percentage";
-import { DaoMetricsDayBucketRepository } from "@/repositories/";
-import { MetricTypesEnum } from "@/lib/constants";
-import { DBTokenMetric } from "@/mappers/delegation-percentage";
-
-/**
- * Mock Factory Pattern for type-safe test data
- * Creates complete DaoMetricRow objects with sensible defaults
- * Only requires specifying fields relevant to each test case
- */
-const createMockRow = (
-  overwrites: Partial<DBTokenMetric> = {},
-): DBTokenMetric => ({
-  date: 0n,
-  daoId: "uniswap",
-  tokenId: "uni",
-  metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-  open: 0n,
-  close: 0n,
-  low: 0n,
-  high: 0n,
-  average: 0n,
-  volume: 0n,
-  count: 0,
-  lastUpdate: 0n,
-  ...overwrites,
-});
-
-describe("DelegationPercentageService", () => {
-  let service: DelegationPercentageService;
-  let mockRepository: jest.Mocked<
-    Pick<
-      DaoMetricsDayBucketRepository,
-      "getMetricsByDateRange" | "getLastMetricBeforeDate"
-    >
-  >;
-
-  beforeEach(() => {
-    mockRepository = {
-      getMetricsByDateRange: jest.fn(),
-      getLastMetricBeforeDate: jest.fn(),
-    } as jest.Mocked<
-      Pick<
-        DaoMetricsDayBucketRepository,
-        "getMetricsByDateRange" | "getLastMetricBeforeDate"
-      >
-    >;
-
-    service = new DelegationPercentageService(mockRepository);
-  });
-
-  describe("delegationPercentageByDay", () => {
-    it("should return empty response when no data is available", async () => {
-      mockRepository.getMetricsByDateRange.mockResolvedValue([]);
-
-      const result = await service.delegationPercentageByDay({
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(0);
-      expect(result.totalCount).toBe(0);
-      expect(result.hasNextPage).toBe(false);
-      expect(result.startDate).toBeNull();
-      expect(result.endDate).toBeNull();
-    });
-
-    it("should calculate delegation percentage correctly", async () => {
-      const mockRows = [
-        createMockRow({
-          date: 1600041600n,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n, // 50 tokens delegated
-        }),
-        createMockRow({
-          date: 1600041600n,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n, // 100 tokens total
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600041600",
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(1);
-      // 50/100 = 0.5 = 50%
-      expect(result.items[0]?.high).toBe("50.00");
-      expect(result.items[0]?.date).toBe("1600041600");
-    });
-
-    it("should apply forward-fill for missing dates", async () => {
-      const ONE_DAY = 86400;
-      const day1 = 1600041600n;
-      const day2 = day1 + BigInt(ONE_DAY);
-      const day3 = day2 + BigInt(ONE_DAY);
-
-      const mockRows = [
-        // Day 1: 40% delegation
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 40000000000000000000n,
-        }),
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-        // Day 3: 60% delegation (day 2 is missing)
-        createMockRow({
-          date: day3,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 60000000000000000000n,
-        }),
-        createMockRow({
-          date: day3,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day1.toString(),
-        endDate: day3.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(3);
-      // Day 1: 40%
-      expect(result.items[0]?.high).toBe("40.00");
-      // Day 2: forward-filled from day 1 = 40%
-      expect(result.items[1]?.high).toBe("40.00");
-      expect(result.items[1]?.date).toBe(day2.toString());
-      // Day 3: 60%
-      expect(result.items[2]?.high).toBe("60.00");
-    });
-
-    it("should handle division by zero when total supply is zero", async () => {
-      const mockRows = [
-        createMockRow({
-          date: 1600041600n,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: 1600041600n,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 0n, // zero total supply
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600041600",
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(1);
-      expect(result.items[0]?.high).toBe("0.00"); // Should be 0 instead of throwing error
-    });
-
-    it("should apply pagination with limit", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 5 days of data
-      for (let i = 0; i < 5; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 50000000000000000000n,
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600387200", // 5 days
-        limit: 3,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(3);
-      expect(result.hasNextPage).toBe(true);
-      expect(result.startDate).toBe("1600041600");
-      expect(result.endDate).toBe("1600214400");
-    });
-
-    it("should apply cursor-based pagination with after", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 5 days of data
-      for (let i = 0; i < 5; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 50000000000000000000n,
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600387200",
-        after: "1600128000", // After day 2
-        limit: 2,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(2);
-      expect(result.items[0]?.date).toBe("1600214400"); // Day 3
-      expect(result.items[1]?.date).toBe("1600300800"); // Day 4
-    });
-
-    it("should apply cursor-based pagination with before", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 5 days of data
-      for (let i = 0; i < 5; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 50000000000000000000n,
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600387200",
-        before: "1600214400", // Before day 3
-        limit: 2,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(2);
-      expect(result.items[0]?.date).toBe("1600041600"); // Day 1
-      expect(result.items[1]?.date).toBe("1600128000"); // Day 2
-    });
-
-    it("should sort data in descending order when specified", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 3 days of data
-      for (let i = 0; i < 3; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: BigInt(30 + i * 10) * BigInt(1e18),
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600214400",
-        orderDirection: "desc",
-        limit: 365,
-      });
-
-      expect(result.items).toHaveLength(3);
-      // Should be in descending order
-      expect(result.items[0]?.date).toBe("1600214400"); // Day 3
-      expect(result.items[1]?.date).toBe("1600128000"); // Day 2
-      expect(result.items[2]?.date).toBe("1600041600"); // Day 1
-    });
-
-    it("should use default values when optional parameters are not provided", async () => {
-      mockRepository.getMetricsByDateRange.mockResolvedValue([]);
-
-      const result = await service.delegationPercentageByDay({
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(mockRepository.getMetricsByDateRange).toHaveBeenCalledWith({
-        metricTypes: [
-          MetricTypesEnum.DELEGATED_SUPPLY,
-          MetricTypesEnum.TOTAL_SUPPLY,
-        ],
-        startDate: undefined,
-        endDate: undefined,
-        orderDirection: "asc",
-        limit: 732,
-      });
-      expect(result.items).toHaveLength(0);
-    });
-
-    it("should handle complex scenario with multiple days and changing values", async () => {
-      const ONE_DAY = 86400;
-      const day1 = 1600041600n;
-      const day2 = day1 + BigInt(ONE_DAY);
-      const day3 = day2 + BigInt(ONE_DAY);
-      const day4 = day3 + BigInt(ONE_DAY);
-
-      const mockRows = [
-        // Day 1: 25% (25/100)
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 25000000000000000000n,
-        }),
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-        // Day 2: only total supply changes to 200 -> 25/200 = 12.5%
-        createMockRow({
-          date: day2,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 200000000000000000000n,
-        }),
-        // Day 3: delegated changes to 50 -> 50/200 = 25%
-        createMockRow({
-          date: day3,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        // Day 4: no changes -> forward fill 50/200 = 25%
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day1.toString(),
-        endDate: day4.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(4);
-      // Day 1: 25%
-      expect(result.items[0]?.high).toBe("25.00");
-      // Day 2: 12.5% (25/200)
-      expect(result.items[1]?.high).toBe("12.50");
-      // Day 3: 25% (50/200)
-      expect(result.items[2]?.high).toBe("25.00");
-      // Day 4: 25% (forward-filled)
-      expect(result.items[3]?.high).toBe("25.00");
-    });
-
-    it("should use last known values before startDate for forward-fill", async () => {
-      const ONE_DAY = 86400;
-      const day1 = 1599955200n;
-      const day100 = day1 + BigInt(ONE_DAY * 100);
-      const day105 = day100 + BigInt(ONE_DAY * 5);
-
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(
-          createMockRow({
-            date: day1,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 40000000000000000000n,
-          }),
-        )
-        .mockResolvedValueOnce(
-          createMockRow({
-            date: day1,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day105,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 60000000000000000000n,
-        }),
-        createMockRow({
-          date: day105,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day100.toString(),
-        endDate: day105.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(6);
-      // Days 100-104: should use values from day 1 (40/100 = 40%)
-      expect(result.items[0]?.high).toBe("40.00"); // day 100
-      expect(result.items[4]?.high).toBe("40.00"); // day 104
-      // Day 105: new value (60/100 = 60%)
-      expect(result.items[5]?.high).toBe("60.00");
-    });
-
-    it("should handle when only one metric has previous value", async () => {
-      const ONE_DAY = 86400;
-      const day50 = 1599955200n;
-      const day100 = day50 + BigInt(ONE_DAY * 50);
-
-      // Mock: only DELEGATED has previous value
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(
-          createMockRow({
-            date: day50,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 30000000000000000000n,
-          }),
-        )
-        .mockResolvedValueOnce(undefined);
-
-      // Main data: TOTAL_SUPPLY appears on day 100
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day100.toString(),
-        endDate: day100.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // With total = 100 and delegated = 30 (from past) = 30%
-      expect(result.items[0]?.high).toBe("30.00");
-    });
-
-    it("should start with 0% when no previous values exist", async () => {
-      const day100 = 1599955200n;
-
-      // Mock: no previous values
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(undefined)
-        .mockResolvedValueOnce(undefined);
-
-      // Main data: appears only on day 100
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day100.toString(),
-        endDate: day100.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Should use values from day 100 directly (50/100 = 50%)
-      expect(result.items[0]?.high).toBe("50.00");
-    });
-
-    it("should not fetch previous values when neither startDate nor after is provided", async () => {
-      mockRepository.getMetricsByDateRange.mockResolvedValue([]);
-
-      await service.delegationPercentageByDay({
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Should not call getLastMetricBeforeDate when no reference date
-      expect(mockRepository.getLastMetricBeforeDate).not.toHaveBeenCalled();
-    });
-
-    it("should fallback to 0 when fetching previous values fails", async () => {
-      const day100 = 1599955200n;
-
-      // Mock console.error to suppress test output
-      const consoleErrorSpy = jest
-        .spyOn(console, "error")
-        .mockImplementation(() => {});
-
-      // Mock: error fetching previous values
-      mockRepository.getLastMetricBeforeDate.mockRejectedValue(
-        new Error("Database error"),
-      );
-
-      // Main data
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day100.toString(),
-        endDate: day100.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Should work normally with fallback to 0 (50/100 = 50%)
-      expect(result.items[0]?.high).toBe("50.00");
-      expect(result.items).toHaveLength(1);
-
-      // Verify error was logged
-      expect(consoleErrorSpy).toHaveBeenCalledWith(
-        "Error fetching initial values:",
-        expect.any(Error),
-      );
-
-      consoleErrorSpy.mockRestore();
-    });
-
-    it("should adjust startDate when requested startDate is before first real data", async () => {
-      const ONE_DAY = 86400;
-      const day5 = 1599955200n;
-      const day10 = day5 + BigInt(ONE_DAY * 5);
-      const day15 = day10 + BigInt(ONE_DAY * 5);
-
-      // Mock: no values before day 5
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(undefined)
-        .mockResolvedValueOnce(undefined);
-
-      // Real data starts on day 10
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day10,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 40000000000000000000n,
-        }),
-        createMockRow({
-          date: day10,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-        createMockRow({
-          date: day15,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: day15,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day5.toString(),
-        endDate: day15.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Should start from day 10 (first real data), not day 5
-      expect(result.items.length).toBeGreaterThan(0);
-      expect(result.items[0]?.date).toBe(day10.toString());
-      expect(result.items[0]?.high).toBe("40.00");
-
-      // Should not have data from day 5-9 (before first real data)
-      const hasDayBefore10 = result.items.some(
-        (item) => BigInt(item.date) < day10,
-      );
-      expect(hasDayBefore10).toBe(false);
-    });
-
-    it("should return empty when startDate is after all available data", async () => {
-      const day5 = 1599955200n;
-      const day100 = day5 + BigInt(86400 * 100);
-
-      // Mock: no values before day 100
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(undefined)
-        .mockResolvedValueOnce(undefined);
-
-      // Mock: no data >= day 100
-      mockRepository.getMetricsByDateRange.mockResolvedValue([]);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: day100.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Should return empty
-      expect(result.items).toHaveLength(0);
-      expect(result.totalCount).toBe(0);
-      expect(result.hasNextPage).toBe(false);
-    });
-
-    it("should fetch previous values and optimize query when only after is provided", async () => {
-      const ONE_DAY = 86400;
-      const day1 = 1599955200n;
-      const day50 = day1 + BigInt(ONE_DAY * 50);
-      const day100 = day50 + BigInt(ONE_DAY * 50);
-
-      // Mock: values before day50
-      mockRepository.getLastMetricBeforeDate
-        .mockResolvedValueOnce(
-          createMockRow({
-            date: day1,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 30000000000000000000n, // 30%
-          }),
-        )
-        .mockResolvedValueOnce(
-          createMockRow({
-            date: day1,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-
-      // Mock: data from day50 onwards (query should be optimized)
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: day100,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        after: day50.toString(),
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Verify query was optimized (used after as startDate)
-      expect(mockRepository.getMetricsByDateRange).toHaveBeenCalledWith({
-        metricTypes: [
-          MetricTypesEnum.DELEGATED_SUPPLY,
-          MetricTypesEnum.TOTAL_SUPPLY,
-        ],
-        startDate: day50.toString(),
-        endDate: undefined,
-        orderDirection: "asc",
-        limit: 732,
-      });
-
-      // Verify previous values were fetched
-      expect(mockRepository.getLastMetricBeforeDate).toHaveBeenCalledTimes(2);
-
-      // Results should have correct forward-fill from previous values
-      expect(result.items.length).toBeGreaterThan(0);
-    });
-
-    it("should optimize query when only before is provided", async () => {
-      const day1 = 1599955200n;
-      const day50 = day1 + BigInt(86400 * 50);
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue([
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 30000000000000000000n,
-        }),
-        createMockRow({
-          date: day1,
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ]);
-
-      const result = await service.delegationPercentageByDay({
-        before: day50.toString(),
-        endDate: day50.toString(), // Add explicit endDate to prevent forward-fill to today
-        limit: 365,
-        orderDirection: "asc" as const,
-      });
-
-      // Verify query was optimized (used before as endDate)
-      expect(mockRepository.getMetricsByDateRange).toHaveBeenCalledWith({
-        metricTypes: [
-          MetricTypesEnum.DELEGATED_SUPPLY,
-          MetricTypesEnum.TOTAL_SUPPLY,
-        ],
-        startDate: undefined,
-        endDate: day50.toString(),
-        orderDirection: "asc",
-        limit: 732,
-      });
-
-      // Should not fetch previous values (no startDate or after)
-      expect(mockRepository.getLastMetricBeforeDate).not.toHaveBeenCalled();
-
-      // With forward-fill, should generate from day1 to day50 (50 days)
-      expect(result.items.length).toBeGreaterThan(1);
-      // First day should have 30%
-      expect(result.items[0]?.high).toBe("30.00");
-      // All days should have forward-filled value of 30%
-      result.items.forEach((item) => {
-        expect(item.high).toBe("30.00");
-      });
-    });
-
-    it("should forward-fill to today when endDate is not provided", async () => {
-      const ONE_DAY = 86400;
-      const threeDaysAgo = Date.now() / 1000 - 3 * ONE_DAY;
-      const threeDaysAgoMidnight = Math.floor(threeDaysAgo / ONE_DAY) * ONE_DAY;
-
-      // Mock data from 3 days ago (only last data point)
-      const mockRows = [
-        createMockRow({
-          date: BigInt(threeDaysAgoMidnight),
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: BigInt(threeDaysAgoMidnight),
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: threeDaysAgoMidnight.toString(),
-        // No endDate - should forward-fill to today
-        limit: 10,
-        orderDirection: "asc" as const,
-      });
-
-      // Should have data from 3 days ago until today (4 days total)
-      expect(result.items.length).toBeGreaterThanOrEqual(4);
-
-      // All items should have the same percentage (forward-filled)
-      // 50/100 = 0.5 = 50%
-      result.items.forEach((item) => {
-        expect(item.high).toBe("50.00");
-      });
-
-      // Last item should be today
-      const todayMidnight = Math.floor(Date.now() / 1000 / ONE_DAY) * ONE_DAY;
-      expect(result.items[result.items.length - 1]?.date).toBe(
-        todayMidnight.toString(),
-      );
-    });
-
-    it("should set hasNextPage to false when reaching today without endDate", async () => {
-      const ONE_DAY = 86400;
-      const twoDaysAgo = Date.now() / 1000 - 2 * ONE_DAY;
-      const twoDaysAgoMidnight = Math.floor(twoDaysAgo / ONE_DAY) * ONE_DAY;
-
-      const mockRows = [
-        createMockRow({
-          date: BigInt(twoDaysAgoMidnight),
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: BigInt(twoDaysAgoMidnight),
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: twoDaysAgoMidnight.toString(),
-        // No endDate, limit covers all days to today
-        limit: 10,
-        orderDirection: "asc" as const,
-      });
-
-      // Should have hasNextPage = false because we reached today
-      expect(result.hasNextPage).toBe(false);
-    });
-
-    it("should set hasNextPage to true when limit cuts before today without endDate", async () => {
-      const ONE_DAY = 86400;
-      const tenDaysAgo = Date.now() / 1000 - 10 * ONE_DAY;
-      const tenDaysAgoMidnight = Math.floor(tenDaysAgo / ONE_DAY) * ONE_DAY;
-
-      const mockRows = [
-        createMockRow({
-          date: BigInt(tenDaysAgoMidnight),
-          metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-          high: 50000000000000000000n,
-        }),
-        createMockRow({
-          date: BigInt(tenDaysAgoMidnight),
-          metricType: MetricTypesEnum.TOTAL_SUPPLY,
-          high: 100000000000000000000n,
-        }),
-      ];
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: tenDaysAgoMidnight.toString(),
-        // No endDate, but limit only returns 3 items (not reaching today)
-        limit: 3,
-        orderDirection: "asc" as const,
-      });
-
-      // Should have exactly 3 items
-      expect(result.items).toHaveLength(3);
-
-      // Should have hasNextPage = true because we didn't reach today
-      expect(result.hasNextPage).toBe(true);
-    });
-  });
-});
diff --git a/apps/api/src/services/delegation-percentage/delegation-percentage.test.ts b/apps/api/src/services/delegation-percentage/delegation-percentage.test.ts
index cecf85ada..312a9d798 100644
--- a/apps/api/src/services/delegation-percentage/delegation-percentage.test.ts
+++ b/apps/api/src/services/delegation-percentage/delegation-percentage.test.ts
@@ -1,5 +1,5 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
 import { DelegationPercentageService } from "./delegation-percentage";
-import { DaoMetricsDayBucketRepository } from "@/repositories/";
 import { MetricTypesEnum } from "@/lib/constants";
 import { DBTokenMetric } from "@/mappers/delegation-percentage";
 
@@ -28,23 +28,16 @@ const createMockRow = (
 
 describe("DelegationPercentageService", () => {
   let service: DelegationPercentageService;
-  let mockRepository: jest.Mocked<
-    Pick<
-      DaoMetricsDayBucketRepository,
-      "getMetricsByDateRange" | "getLastMetricBeforeDate"
-    >
-  >;
+  let mockRepository: {
+    getMetricsByDateRange: ReturnType<typeof vi.fn>;
+    getLastMetricBeforeDate: ReturnType<typeof vi.fn>;
+  };
 
   beforeEach(() => {
     mockRepository = {
-      getMetricsByDateRange: jest.fn(),
-      getLastMetricBeforeDate: jest.fn(),
-    } as jest.Mocked<
-      Pick<
-        DaoMetricsDayBucketRepository,
-        "getMetricsByDateRange" | "getLastMetricBeforeDate"
-      >
-    >;
+      getMetricsByDateRange: vi.fn(),
+      getLastMetricBeforeDate: vi.fn(),
+    };
 
     service = new DelegationPercentageService(mockRepository);
   });
@@ -207,78 +200,6 @@ describe("DelegationPercentageService", () => {
       expect(result.endDate).toBe("1600214400");
     });
 
-    it("should apply cursor-based pagination with after", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 5 days of data
-      for (let i = 0; i < 5; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 50000000000000000000n,
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600387200",
-        after: "1600128000", // After day 2
-        limit: 2,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(2);
-      expect(result.items[0]?.date).toBe("1600214400"); // Day 3
-      expect(result.items[1]?.date).toBe("1600300800"); // Day 4
-    });
-
-    it("should apply cursor-based pagination with before", async () => {
-      const ONE_DAY = 86400;
-      const mockRows = [];
-
-      // Create 5 days of data
-      for (let i = 0; i < 5; i++) {
-        const date = BigInt(1600041600 + i * ONE_DAY);
-        mockRows.push(
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.DELEGATED_SUPPLY,
-            high: 50000000000000000000n,
-          }),
-          createMockRow({
-            date,
-            metricType: MetricTypesEnum.TOTAL_SUPPLY,
-            high: 100000000000000000000n,
-          }),
-        );
-      }
-
-      mockRepository.getMetricsByDateRange.mockResolvedValue(mockRows);
-
-      const result = await service.delegationPercentageByDay({
-        startDate: "1600041600",
-        endDate: "1600387200",
-        before: "1600214400", // Before day 3
-        limit: 2,
-        orderDirection: "asc" as const,
-      });
-
-      expect(result.items).toHaveLength(2);
-      expect(result.items[0]?.date).toBe("1600041600"); // Day 1
-      expect(result.items[1]?.date).toBe("1600128000"); // Day 2
-    });
-
     it("should sort data in descending order when specified", async () => {
       const ONE_DAY = 86400;
       const mockRows = [];
@@ -526,7 +447,7 @@ describe("DelegationPercentageService", () => {
       const day100 = 1599955200n;
 
       // Mock console.error to suppress test output
-      const consoleErrorSpy = jest
+      const consoleErrorSpy = vi
         .spyOn(console, "error")
         .mockImplementation(() => {});
 
diff --git a/apps/api/src/services/treasury/providers/provider-cache.test.ts b/apps/api/src/services/treasury/providers/provider-cache.test.ts
new file mode 100644
index 000000000..8d5e9e298
--- /dev/null
+++ b/apps/api/src/services/treasury/providers/provider-cache.test.ts
@@ -0,0 +1,125 @@
+import { expect, afterEach, beforeEach, vi, describe, it } from "vitest";
+import { TreasuryProviderCache } from "./provider-cache";
+import { LiquidTreasuryDataPoint } from "../types";
+
+function createDataPoint(
+  overrides?: Partial<LiquidTreasuryDataPoint>,
+): LiquidTreasuryDataPoint {
+  return {
+    date: 1700000000,
+    liquidTreasury: 1000000,
+    ...overrides,
+  };
+}
+
+describe("TreasuryProviderCache", () => {
+  let cache: TreasuryProviderCache;
+  const ONE_DAY = 24 * 60 * 60 * 1000;
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2025-01-15T12:00:00Z"));
+    cache = new TreasuryProviderCache();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  describe("get", () => {
+    it("should return null when cache is empty", () => {
+      const result = cache.get();
+
+      expect(result).toBeNull();
+    });
+
+    it("should return cached data when not expired", () => {
+      const data = [createDataPoint(), createDataPoint({ date: 1700086400 })];
+      cache.set(data);
+
+      const result = cache.get();
+
+      expect(result).toEqual(data);
+    });
+
+    it("should return data at exactly 24 hours (boundary)", () => {
+      const data = [createDataPoint()];
+      cache.set(data);
+      vi.advanceTimersByTime(24 * 60 * 60 * 1000);
+
+      const result = cache.get();
+
+      expect(result).toEqual(data);
+    });
+
+    it("should return null at 24 hours + 1ms (just expired)", () => {
+      const data = [createDataPoint()];
+      cache.set(data);
+      vi.advanceTimersByTime(ONE_DAY + 1);
+
+      const result = cache.get();
+
+      expect(result).toBeNull();
+    });
+  });
+
+  describe("set", () => {
+    it("should store data that can be retrieved", () => {
+      const data = [
+        createDataPoint({ date: 1700000000, liquidTreasury: 500000 }),
+      ];
+
+      cache.set(data);
+
+      expect(cache.get()).toEqual(data);
+    });
+
+    it("should overwrite previous data", () => {
+      const oldData = [createDataPoint({ liquidTreasury: 100 })];
+      const newData = [createDataPoint({ liquidTreasury: 200 })];
+      cache.set(oldData);
+
+      cache.set(newData);
+
+      expect(cache.get()).toEqual(newData);
+    });
+
+    it("should reset TTL when setting new data", () => {
+      const oldData = [createDataPoint({ liquidTreasury: 100 })];
+      cache.set(oldData);
+      vi.advanceTimersByTime(23 * 60 * 60 * 1000);
+
+      const newData = [createDataPoint({ liquidTreasury: 200 })];
+      cache.set(newData);
+      vi.advanceTimersByTime(23 * 60 * 60 * 1000);
+
+      const result = cache.get();
+
+      expect(result).toEqual(newData);
+    });
+
+    it("should handle empty array", () => {
+      const data: LiquidTreasuryDataPoint[] = [];
+
+      cache.set(data);
+
+      expect(cache.get()).toEqual([]);
+    });
+  });
+
+  describe("clear", () => {
+    it("should remove all cached data", () => {
+      const data = [createDataPoint()];
+      cache.set(data);
+
+      cache.clear();
+
+      expect(cache.get()).toBeNull();
+    });
+
+    it("should be safe to call on empty cache", () => {
+      expect(() => cache.clear()).not.toThrow();
+      expect(cache.get()).toBeNull();
+    });
+  });
+});
diff --git a/apps/api/src/services/treasury/treasury.service.test.ts b/apps/api/src/services/treasury/treasury.service.test.ts
new file mode 100644
index 000000000..c74a35cb3
--- /dev/null
+++ b/apps/api/src/services/treasury/treasury.service.test.ts
@@ -0,0 +1,384 @@
+import { afterEach, beforeEach, vi, describe, it, expect } from "vitest";
+import { TreasuryService } from "./treasury.service";
+import { TreasuryProvider } from "./providers";
+import { PriceProvider, LiquidTreasuryDataPoint } from "./types";
+import { TreasuryRepository } from "@/repositories/treasury";
+import { parseEther } from "viem";
+
+/**
+ * Fakes for dependency injection
+ */
+class FakeTreasuryProvider implements TreasuryProvider {
+  private data: LiquidTreasuryDataPoint[] = [];
+
+  setData(data: { date: number; value: number }[]) {
+    this.data = data.map((item) => ({
+      date: item.date,
+      liquidTreasury: item.value,
+    }));
+  }
+
+  async fetchTreasury(
+    _cutoffTimestamp: number,
+  ): Promise<LiquidTreasuryDataPoint[]> {
+    return this.data;
+  }
+}
+
+class FakePriceProvider implements PriceProvider {
+  private prices: Map<number, number> = new Map();
+
+  setPrices(prices: Map<number, number>) {
+    this.prices = prices;
+  }
+
+  async getHistoricalPricesMap(_days: number): Promise<Map<number, number>> {
+    return this.prices;
+  }
+}
+
+class FakeTreasuryRepository {
+  private tokenQuantities: Map<number, bigint> = new Map();
+
+  setTokenQuantities(quantities: Map<number, bigint>) {
+    this.tokenQuantities = quantities;
+  }
+
+  async getTokenQuantities(
+    _cutoffTimestamp: number,
+  ): Promise<Map<number, bigint>> {
+    return this.tokenQuantities;
+  }
+
+  async getLastTokenQuantityBeforeDate(
+    _cutoffTimestamp: number,
+  ): Promise<bigint | null> {
+    return null;
+  }
+}
+
+describe("TreasuryService", () => {
+  const FIXED_DATE = new Date("2026-01-15T00:00:00Z");
+  const FIXED_TIMESTAMP = Math.floor(FIXED_DATE.getTime() / 1000); // 1736937600
+  const ONE_DAY = 86400;
+
+  let liquidProvider: FakeTreasuryProvider;
+  let priceProvider: FakePriceProvider;
+  let metricRepo: FakeTreasuryRepository;
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(FIXED_DATE);
+
+    liquidProvider = new FakeTreasuryProvider();
+    priceProvider = new FakePriceProvider();
+    metricRepo = new FakeTreasuryRepository();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  describe("getLiquidTreasury", () => {
+    it("should return empty when provider is undefined", async () => {
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        undefined,
+      );
+
+      const result = await service.getLiquidTreasury(7, "asc");
+
+      expect(result.items).toHaveLength(0);
+      expect(result.totalCount).toBe(0);
+    });
+
+    it("should return empty when provider returns empty array", async () => {
+      liquidProvider.setData([]);
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        liquidProvider,
+        undefined,
+      );
+
+      const result = await service.getLiquidTreasury(7, "asc");
+
+      expect(result.items).toHaveLength(0);
+      expect(result.totalCount).toBe(0);
+    });
+
+    it("should return items sorted ascending", async () => {
+      const expected = [
+        { date: FIXED_TIMESTAMP - ONE_DAY * 2, value: 1000 },
+        { date: FIXED_TIMESTAMP - ONE_DAY, value: 2000 },
+        { date: FIXED_TIMESTAMP, value: 3000 },
+      ];
+      liquidProvider.setData(expected);
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        liquidProvider,
+        undefined,
+      );
+
+      const result = await service.getLiquidTreasury(7, "asc");
+
+      expect(result).toEqual({
+        items: expected,
+        totalCount: expected.length,
+      });
+    });
+
+    it("should return items sorted descending", async () => {
+      const expected = [
+        { date: FIXED_TIMESTAMP - ONE_DAY * 2, value: 1000 },
+        { date: FIXED_TIMESTAMP - ONE_DAY, value: 2000 },
+        { date: FIXED_TIMESTAMP, value: 3000 },
+      ];
+      liquidProvider.setData(expected);
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        liquidProvider,
+        undefined,
+      );
+
+      const result = await service.getLiquidTreasury(7, "desc");
+
+      expect(result).toEqual({
+        items: expected.sort((a, b) => b.date - a.date),
+        totalCount: expected.length,
+      });
+    });
+  });
+
+  describe("getTokenTreasury", () => {
+    it("should return empty when priceProvider is undefined", async () => {
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        undefined,
+      );
+
+      const result = await service.getTokenTreasury(7, "asc", 18);
+
+      expect(result.items).toHaveLength(0);
+      expect(result.totalCount).toBe(0);
+    });
+
+    it("should return empty when repository and priceProvider return empty", async () => {
+      metricRepo.setTokenQuantities(new Map());
+      priceProvider.setPrices(new Map());
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        priceProvider,
+      );
+
+      const result = await service.getTokenTreasury(7, "asc", 18);
+
+      expect(result.items).toHaveLength(0);
+      expect(result.totalCount).toBe(0);
+    });
+
+    it("should calculate value correctly with decimals", async () => {
+      const quantity = 100;
+      const price = 10; // $10 per token
+
+      metricRepo.setTokenQuantities(
+        new Map([[FIXED_TIMESTAMP, parseEther(quantity.toString())]]),
+      );
+      priceProvider.setPrices(new Map([[FIXED_TIMESTAMP, price]]));
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        priceProvider,
+      );
+
+      const result = await service.getTokenTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: quantity * price }],
+        totalCount: 1,
+      });
+    });
+
+    it("should return items sorted ascending", async () => {
+      const day1 = FIXED_TIMESTAMP - ONE_DAY * 2;
+      const day2 = FIXED_TIMESTAMP - ONE_DAY;
+
+      metricRepo.setTokenQuantities(
+        new Map([
+          [day1, parseEther("100")],
+          [day2, parseEther("200")],
+        ]),
+      );
+      priceProvider.setPrices(
+        new Map([
+          [day1, 10],
+          [day2, 10],
+        ]),
+      );
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        priceProvider,
+      );
+
+      const result = await service.getTokenTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [
+          { date: day1, value: 1000 },
+          { date: day2, value: 2000 },
+          { date: FIXED_TIMESTAMP, value: 2000 }, // forward-filled value
+        ],
+        totalCount: 3,
+      });
+    });
+
+    it("should return items sorted descending", async () => {
+      const day1 = FIXED_TIMESTAMP - ONE_DAY * 2;
+      const day2 = FIXED_TIMESTAMP - ONE_DAY;
+
+      metricRepo.setTokenQuantities(
+        new Map([
+          [day1, parseEther("100")],
+          [day2, parseEther("200")],
+        ]),
+      );
+      priceProvider.setPrices(
+        new Map([
+          [day1, 10],
+          [day2, 10],
+        ]),
+      );
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        priceProvider,
+      );
+
+      const result = await service.getTokenTreasury(7, "desc", 18);
+
+      expect(result).toEqual({
+        items: [
+          { date: FIXED_TIMESTAMP, value: 2000 }, // forward-filled value
+          { date: day2, value: 2000 },
+          { date: day1, value: 1000 },
+        ],
+        totalCount: 3,
+      });
+    });
+
+    it("should return forward-filled values", async () => {
+      const fourDaysAgo = FIXED_TIMESTAMP - ONE_DAY * 4;
+
+      metricRepo.setTokenQuantities(
+        new Map([[fourDaysAgo, parseEther("100")]]),
+      );
+      priceProvider.setPrices(new Map([[fourDaysAgo, 10]]));
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined,
+        priceProvider,
+      );
+
+      const result = await service.getTokenTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [
+          { date: fourDaysAgo, value: 1000 },
+          /* forward-filled values */
+          { date: FIXED_TIMESTAMP - ONE_DAY * 3, value: 1000 },
+          { date: FIXED_TIMESTAMP - ONE_DAY * 2, value: 1000 },
+          { date: FIXED_TIMESTAMP - ONE_DAY, value: 1000 },
+          { date: FIXED_TIMESTAMP, value: 1000 },
+          /* */
+        ],
+        totalCount: 5,
+      });
+    });
+  });
+
+  describe("getTotalTreasury", () => {
+    let service: TreasuryService;
+
+    beforeEach(() => {
+      liquidProvider.setData([]);
+      metricRepo.setTokenQuantities(new Map());
+      priceProvider.setPrices(new Map());
+      service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        liquidProvider,
+        priceProvider,
+      );
+    });
+
+    it("should return empty when both liquid and token are empty", async () => {
+      const result = await service.getTotalTreasury(7, "asc", 18);
+
+      expect(result.items).toHaveLength(0);
+      expect(result.totalCount).toBe(0);
+    });
+
+    it("should sum liquid and token treasury correctly", async () => {
+      const dayTimestamp = FIXED_TIMESTAMP;
+
+      // Liquid: $5000
+      liquidProvider.setData([{ date: dayTimestamp, value: 5000 }]);
+
+      // Token: 100 tokens * $30 = $3000
+      metricRepo.setTokenQuantities(
+        new Map([[dayTimestamp, parseEther("100")]]),
+      );
+      priceProvider.setPrices(new Map([[dayTimestamp, 30]]));
+
+      const result = await service.getTotalTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: 8000 }],
+        totalCount: 1,
+      });
+    });
+
+    it("should work when only liquid has data", async () => {
+      liquidProvider.setData([{ date: FIXED_TIMESTAMP, value: 5000 }]);
+
+      const result = await service.getTotalTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: 5000 }],
+        totalCount: 1,
+      });
+    });
+
+    it("should work when only token has data", async () => {
+      const dayTimestamp = FIXED_TIMESTAMP;
+
+      liquidProvider.setData([]);
+      metricRepo.setTokenQuantities(
+        new Map([[dayTimestamp, parseEther("100")]]),
+      );
+      priceProvider.setPrices(new Map([[dayTimestamp, 25]]));
+
+      const service = new TreasuryService(
+        metricRepo as unknown as TreasuryRepository,
+        undefined, // no liquid provider
+        priceProvider,
+      );
+
+      const result = await service.getTotalTreasury(7, "asc", 18);
+
+      expect(result).toEqual({
+        items: [{ date: FIXED_TIMESTAMP, value: 2500 }],
+        totalCount: 1,
+      });
+    });
+  });
+});
diff --git a/apps/api/tsconfig.json b/apps/api/tsconfig.json
index 9306ab311..437e1e680 100644
--- a/apps/api/tsconfig.json
+++ b/apps/api/tsconfig.json
@@ -8,14 +8,15 @@
     "allowSyntheticDefaultImports": true,
     "resolveJsonModule": true,
     "module": "ESNext",
-    "lib": ["ES2022"],
+    "lib": ["ES2022", "DOM"],
     "target": "ES2022",
     "skipLibCheck": true,
     "paths": {
       "@/*": ["./src/*"]
     },
     "outDir": "./dist",
-    "moduleResolution": "node"
+    "moduleResolution": "node",
+    "types": ["vitest/globals"]
   },
   "include": ["./**/*.ts"],
   "exclude": ["node_modules", "test"]
diff --git a/apps/api/vitest.config.ts b/apps/api/vitest.config.ts
new file mode 100644
index 000000000..7d198199f
--- /dev/null
+++ b/apps/api/vitest.config.ts
@@ -0,0 +1,14 @@
+import { defineConfig } from "vitest/config";
+import path from "path";
+
+export default defineConfig({
+  test: {
+    globals: true,
+    environment: "node",
+  },
+  resolve: {
+    alias: {
+      "@": path.resolve(import.meta.dirname, "./src"), // Ensure we can import from the src directory
+    },
+  },
+});
diff --git a/apps/dashboard/AGENTS.md b/apps/dashboard/AGENTS.md
new file mode 100644
index 000000000..b50798c92
--- /dev/null
+++ b/apps/dashboard/AGENTS.md
@@ -0,0 +1,414 @@
+# Dashboard Package Guide
+
+## Overview
+
+- **Port**: 3000
+- **Stack**: Next.js 16.1, React 19.2, Tailwind CSS 4.1, Apollo Client 3.13, wagmi 2.12, viem 2.37, Zustand 5.0, Recharts 2.15
+- **Purpose**: Frontend application providing DAO governance analytics, risk assessment, and community tools
+
+## What It Does
+
+- Multi-DAO support (Uniswap, ENS, Optimism)
+- Governance security analysis and risk assessment
+- Attack profitability calculations
+- Token distribution visualization
+- Community petition system integration
+- Wallet connection via RainbowKit
+- Real-time data updates via GraphQL subscriptions
+
+## Commands
+
+```bash
+# Development
+pnpm dashboard dev              # Start Next.js dev server on :3000
+
+# Building
+pnpm dashboard build            # Production build
+pnpm dashboard start            # Serve production build
+
+# Testing
+pnpm dashboard test             # Run Jest unit tests
+pnpm dashboard test:watch       # Jest watch mode
+
+# Verification (run after every change)
+pnpm dashboard typecheck        # Type checking
+pnpm dashboard lint             # Lint checking
+pnpm dashboard lint:fix         # Auto-fix lint issues
+
+# Storybook
+pnpm dashboard storybook        # Start Storybook on :6006
+pnpm dashboard build-storybook  # Build static Storybook
+```
+
+## Dependencies
+
+- **API Gateway**: GraphQL endpoint for data fetching
+- **GraphQL Client**: Generated types and hooks (`@anticapture/graphql-client`)
+- **Wallet providers**: RainbowKit, wagmi, viem
+- **External APIs**: Alchemy RPC, WalletConnect
+
+## Environment Variables
+
+Configure in `apps/dashboard/.env`:
+
+| Variable                                | Required | Description                                                         |
+| --------------------------------------- | -------- | ------------------------------------------------------------------- |
+| `NEXT_PUBLIC_BASE_URL`                  | yes      | API Gateway GraphQL endpoint (e.g. `http://localhost:4000/graphql`) |
+| `NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID` | yes      | WalletConnect project ID                                            |
+| `NEXT_PUBLIC_ALCHEMY_KEY`               | yes      | Alchemy RPC key                                                     |
+| `NEXT_PUBLIC_SITE_URL`                  | no       | Site URL for SEO/meta                                               |
+| `RESEND_API_KEY`                        | no       | Resend email API key (contact form)                                 |
+| `RESEND_FROM_EMAIL`                     | no       | Sender email address                                                |
+| `CONTACT_EMAIL`                         | no       | Recipient for contact form                                          |
+
+## Architecture
+
+### Feature-Based Organization
+
+The dashboard follows a **feature-based architecture** where each major domain has its own directory with all related code.
+
+```
+apps/dashboard/
+├── app/                        # Next.js App Router pages
+├── features/                   # Feature modules (domain-driven)
+│   └── <feature-name>/
+│       ├── components/         # Feature-specific components
+│       ├── hooks/              # Feature-specific hooks
+│       ├── contexts/           # Feature-specific React contexts
+│       └── utils/              # Feature-specific utilities
+├── shared/                     # Shared code across features
+│   ├── components/
+│   │   ├── ui/                 # Reusable UI components
+│   │   └── design-system/      # Design system components
+│   ├── hooks/                  # Shared hooks
+│   ├── types/                  # Shared TypeScript types
+│   ├── utils/                  # Shared utilities
+│   └── lib/                    # External library configurations
+├── templates/                  # Page-level templates
+├── widgets/                    # Standalone UI components
+└── public/                     # Static assets
+```
+
+## Where to Put New Code
+
+| What you're adding          | Where it goes                      |
+| --------------------------- | ---------------------------------- |
+| New dashboard feature       | `features/<feature-name>/`         |
+| Feature-specific component  | `features/<feature>/components/`   |
+| Feature-specific hook       | `features/<feature>/hooks/`        |
+| Feature-specific context    | `features/<feature>/contexts/`     |
+| Feature-specific utility    | `features/<feature>/utils/`        |
+| Reusable UI component       | `shared/components/ui/`            |
+| Design system component     | `shared/components/design-system/` |
+| Shared hook (cross-feature) | `shared/hooks/`                    |
+| Shared utility function     | `shared/utils/`                    |
+| Shared TypeScript types     | `shared/types/`                    |
+| Page-level template         | `templates/`                       |
+| Next.js route               | `app/`                             |
+| Static assets               | `public/`                          |
+
+## File Structure Guidelines
+
+### Feature Module Structure
+
+Each feature should be self-contained:
+
+```
+features/<feature-name>/
+├── components/
+│   ├── FeatureComponent.tsx
+│   └── index.ts              # Re-export components
+├── hooks/
+│   ├── useFeatureData.ts
+│   └── index.ts              # Re-export hooks
+├── contexts/
+│   └── FeatureContext.tsx
+├── utils/
+│   └── featureHelpers.ts
+└── index.ts                  # Main feature export
+```
+
+### Component Structure
+
+```typescript
+// Component file structure
+import {} from /* external deps */ "external-package";
+import {} from /* shared components */ "@/shared/components";
+import {} from /* shared utils */ "@/shared/utils";
+import {} from /* feature code */ "../hooks";
+
+// Types
+interface ComponentProps {
+  // ...
+}
+
+// Component
+export const Component = ({ ...props }: ComponentProps) => {
+  // ...
+};
+```
+
+## Code Examples
+
+### React Component with Tailwind
+
+```tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cn } from "@/shared/utils";
+import Spinner from "@/shared/components/ui/spinner";
+
+interface ButtonProps {
+  children: React.ReactNode;
+  className?: string;
+  disabled?: boolean;
+  variant?: "primary" | "secondary";
+  loading?: boolean;
+  loadingText?: string;
+}
+
+export const Button = ({
+  children,
+  className,
+  disabled = false,
+  variant = "primary",
+  loading = false,
+  loadingText,
+  ...props
+}: ButtonProps) => {
+  const isDisabled = disabled || loading;
+
+  return (
+    <button
+      className={cn(
+        "flex items-center justify-center gap-1.5 text-sm font-medium",
+        variantStyles[variant],
+        isDisabled && "pointer-events-none opacity-50",
+        className,
+      )}
+      disabled={isDisabled}
+      {...props}
+    >
+      {loading ? <Spinner label={loadingText} /> : children}
+    </button>
+  );
+};
+```
+
+### Custom Hook with GraphQL
+
+```typescript
+import { useQuery } from "@apollo/client";
+import { GET_DAO_DATA } from "@/shared/graphql/queries";
+
+export function useDaoData(daoId: string) {
+  const { data, loading, error } = useQuery(GET_DAO_DATA, {
+    variables: { daoId },
+  });
+
+  return {
+    dao: data?.dao,
+    loading,
+    error,
+  };
+}
+```
+
+### Context Provider
+
+```typescript
+import { createContext, useContext, useState } from "react";
+
+interface FeatureContextValue {
+  state: string;
+  setState: (value: string) => void;
+}
+
+const FeatureContext = createContext<FeatureContextValue | undefined>(
+  undefined,
+);
+
+export function FeatureProvider({ children }: { children: React.ReactNode }) {
+  const [state, setState] = useState("");
+
+  return (
+    <FeatureContext.Provider value={{ state, setState }}>
+      {children}
+    </FeatureContext.Provider>
+  );
+}
+
+export function useFeature() {
+  const context = useContext(FeatureContext);
+  if (!context) {
+    throw new Error("useFeature must be used within FeatureProvider");
+  }
+  return context;
+}
+```
+
+## Styling Guidelines
+
+### Tailwind CSS Best Practices
+
+- **Utility-first**: Prefer Tailwind utilities over custom CSS
+- **Use `cn()` helper**: For conditional class merging
+- **Responsive design**: Use Tailwind breakpoints (`sm:`, `md:`, `lg:`, etc.)
+- **Design tokens**: Use Tailwind config for colors, spacing, etc.
+
+### Class Organization
+
+```tsx
+// Order: layout → display → spacing → sizing → colors → typography → effects
+<div
+  className={cn(
+    "flex items-center justify-between", // Layout
+    "gap-4 px-6 py-4", // Spacing
+    "rounded-lg border", // Sizing & borders
+    "bg-white text-gray-900", // Colors
+    "text-sm font-medium", // Typography
+    "shadow-sm hover:shadow-md", // Effects
+    "transition-all duration-200", // Transitions
+  )}
+/>
+```
+
+## State Management
+
+### Local State
+
+- Use `useState` for component-local state
+- Use `useReducer` for complex state logic
+
+### Global State
+
+- **React Context**: For feature-scoped state
+- **Zustand**: For app-wide state (user preferences, UI state)
+- **Apollo Client**: For server state (GraphQL data)
+
+### Server State
+
+```typescript
+// Apollo Client for GraphQL queries
+import { useQuery } from "@apollo/client";
+
+const { data, loading, error, refetch } = useQuery(QUERY, {
+  variables: { id },
+});
+```
+
+## Testing Strategy
+
+### Unit Tests (Jest)
+
+```typescript
+import { render, screen } from "@testing-library/react";
+import { Button } from "./Button";
+
+describe("Button", () => {
+  it("renders children correctly", () => {
+    render(<Button>Click me</Button>);
+    expect(screen.getByText("Click me")).toBeInTheDocument();
+  });
+
+  it("shows loading state", () => {
+    render(<Button loading loadingText="Loading...">Click</Button>);
+    expect(screen.getByText("Loading...")).toBeInTheDocument();
+  });
+});
+```
+
+### Component Tests (Vitest + Storybook)
+
+```typescript
+// Component.stories.tsx
+import type { Meta, StoryObj } from "@storybook/react";
+import { Button } from "./Button";
+
+const meta: Meta<typeof Button> = {
+  component: Button,
+  title: "Components/Button",
+};
+
+export default meta;
+type Story = StoryObj<typeof Button>;
+
+export const Primary: Story = {
+  args: {
+    children: "Primary Button",
+    variant: "primary",
+  },
+};
+
+export const Loading: Story = {
+  args: {
+    children: "Loading Button",
+    loading: true,
+  },
+};
+```
+
+## Path Aliases
+
+Use TypeScript path aliases for cleaner imports:
+
+```typescript
+// ✅ Good
+import { Button } from "@/shared/components/ui/button";
+import { cn } from "@/shared/utils";
+
+// ❌ Bad
+import { Button } from "../../../shared/components/ui/button";
+import { cn } from "../../../shared/utils";
+```
+
+## Development Workflow
+
+1. **Start dependencies**: Ensure API Gateway is running
+2. **Generate GraphQL types**: `pnpm client codegen` (if schema changed)
+3. **Start dev server**: `pnpm dashboard dev`
+4. **Make changes**: Edit components/features
+5. **Test locally**: View at `http://localhost:3000`
+6. **Verify**: `pnpm dashboard typecheck && pnpm dashboard lint && pnpm dashboard test`
+7. **Visual testing**: Use Storybook for component isolation
+
+## Common Issues
+
+### GraphQL Errors
+
+- **Endpoint not reachable**: Check `NEXT_PUBLIC_BASE_URL` is correct
+- **Type mismatch**: Run `pnpm client codegen` to regenerate types
+- **Query fails**: Check API Gateway and backend APIs are running
+
+### Build Errors
+
+- **Import errors**: Check path aliases in `tsconfig.json`
+- **Environment variables**: Ensure all `NEXT_PUBLIC_*` vars are set
+- **Type errors**: Run `pnpm dashboard typecheck` to identify issues
+
+### Styling Issues
+
+- **Tailwind not working**: Check `tailwind.config.ts` paths
+- **Custom CSS not applied**: Ensure styles are imported in `app/layout.tsx`
+- **Dark mode issues**: Check Tailwind dark mode configuration
+
+## Performance Optimization
+
+- **Code splitting**: Use dynamic imports for heavy components
+- **Image optimization**: Use Next.js `<Image>` component
+- **Memoization**: Use `React.memo`, `useMemo`, `useCallback` judiciously
+- **Lazy loading**: Load charts and heavy components on demand
+
+## Accessibility
+
+- **Semantic HTML**: Use appropriate HTML elements
+- **ARIA labels**: Add labels for screen readers
+- **Keyboard navigation**: Ensure all interactive elements are keyboard accessible
+- **Focus management**: Handle focus states properly
+
+## Related Documentation
+
+- [Next.js Documentation](https://nextjs.org/docs)
+- [Tailwind CSS Documentation](https://tailwindcss.com/docs)
+- [Apollo Client Documentation](https://www.apollographql.com/docs/react)
+- Root `AGENTS.md` for general guidelines
+- `packages/graphql-client/AGENTS.md` for GraphQL client usage
diff --git a/apps/dashboard/app/api/figma/route.ts b/apps/dashboard/app/api/figma/route.ts
index bcce4e60f..39f371bb9 100644
--- a/apps/dashboard/app/api/figma/route.ts
+++ b/apps/dashboard/app/api/figma/route.ts
@@ -96,7 +96,6 @@ export async function GET(request: NextRequest) {
     // Get token from server environment (never exposed to client)
     const figmaToken = process.env.FIGMA_TOKEN;
     if (!figmaToken) {
-      console.error("FIGMA_TOKEN environment variable is not set");
       return NextResponse.json(
         { error: "Figma service is not configured" },
         { status: 500 },
diff --git a/apps/dashboard/features/governance/components/proposal-overview/ActionTabContent.tsx b/apps/dashboard/features/governance/components/proposal-overview/ActionTabContent.tsx
index 032623d51..153acf6c5 100644
--- a/apps/dashboard/features/governance/components/proposal-overview/ActionTabContent.tsx
+++ b/apps/dashboard/features/governance/components/proposal-overview/ActionTabContent.tsx
@@ -57,7 +57,7 @@ const ActionItem = ({
   index,
   blockExplorerUrl,
 }: ActionItemProps) => {
-  const [isDecoded, setIsDecoded] = useState(false);
+  const [isDecoded, setIsDecoded] = useState(true);
 
   const { data: decodedCalldata, isLoading } = useDecodeCalldata({
     calldata,
diff --git a/apps/dashboard/shared/utils/figma-storybook.ts b/apps/dashboard/shared/utils/figma-storybook.ts
index f3226e236..bfc64ebd6 100644
--- a/apps/dashboard/shared/utils/figma-storybook.ts
+++ b/apps/dashboard/shared/utils/figma-storybook.ts
@@ -80,12 +80,6 @@ export function getFigmaDesignConfig(figmaUrl: string) {
       : undefined;
 
   if (!figmaToken) {
-    console.warn(
-      "FIGMA_TOKEN environment variable is not set. Figma design integration will not work.",
-    );
-    console.warn(
-      "Please add FIGMA_TOKEN to apps/dashboard/.env.local file and restart Storybook",
-    );
     // Return config without token - addon will fail gracefully
     return {
       type: "figspec" as const,
diff --git a/apps/dashboard/shared/utils/formatBlocksToUserReadable.test.ts b/apps/dashboard/shared/utils/formatBlocksToUserReadable.test.ts
index 15e6ddc96..a84b325cb 100644
--- a/apps/dashboard/shared/utils/formatBlocksToUserReadable.test.ts
+++ b/apps/dashboard/shared/utils/formatBlocksToUserReadable.test.ts
@@ -6,15 +6,13 @@ describe("formatBlocksToUserReadable", () => {
     expect(formatBlocksToUserReadable(0, 12)).toBe("0 sec");
   });
 
-  // Test small block counts (converted to seconds)
+  // Test short durations (under 60 seconds → show seconds)
   test("converts 1 block to seconds", () => {
     expect(formatBlocksToUserReadable(1, 12)).toBe("12 secs");
   });
-
   test("converts 2 blocks to seconds", () => {
     expect(formatBlocksToUserReadable(2, 12)).toBe("24 secs");
   });
-
   test("converts 4 blocks to seconds", () => {
     expect(formatBlocksToUserReadable(4, 12)).toBe("48 secs");
   });
@@ -23,34 +21,41 @@ describe("formatBlocksToUserReadable", () => {
   test("formats 5 blocks as minutes", () => {
     expect(formatBlocksToUserReadable(5, 12)).toBe("1 min");
   });
-
   test("formats 10 blocks as minutes", () => {
+    expect(formatBlocksToUserReadable(10, 12)).toBe("2 mins");
+  });
+  test("formats 1 block with large block time as minutes", () => {
     expect(formatBlocksToUserReadable(1, 120)).toBe("2 mins");
   });
 
   // Test hours
   test("formats 300 blocks as hours", () => {
-    expect(formatBlocksToUserReadable(3, 1200)).toBe("1 hour");
+    expect(formatBlocksToUserReadable(300, 12)).toBe("1 hour");
   });
-
   test("formats 600 blocks as hours", () => {
+    expect(formatBlocksToUserReadable(600, 12)).toBe("2 hours");
+  });
+  test("formats few blocks with large block time as hours", () => {
+    expect(formatBlocksToUserReadable(3, 1200)).toBe("1 hour");
     expect(formatBlocksToUserReadable(6, 1200)).toBe("2 hours");
   });
 
   // Test hours with remaining minutes
   test("formats blocks as hours and minutes", () => {
-    expect(formatBlocksToUserReadable(3, 1205)).toBe("1 hour, 1 min");
+    expect(formatBlocksToUserReadable(305, 12)).toBe("1 hour, 1 min");
+    expect(formatBlocksToUserReadable(3, 1220)).toBe("1 hour, 1 min");
   });
 
   // Edge cases
   test("handles fractional blocks correctly", () => {
-    expect(formatBlocksToUserReadable(0, 12.5)).toBe("6 secs");
+    expect(formatBlocksToUserReadable(0.5, 12)).toBe("6 secs");
   });
 
   // Test that seconds are not shown when hours or minutes are present
   test("doesn't show seconds when hours or minutes are present", () => {
     expect(formatBlocksToUserReadable(6, 12)).toBe("1 min");
+    expect(formatBlocksToUserReadable(301, 12)).toBe("1 hour");
     expect(formatBlocksToUserReadable(3, 1201)).toBe("1 hour");
-    expect(formatBlocksToUserReadable(3, 1205)).toBe("1 hour, 1 min");
+    expect(formatBlocksToUserReadable(305, 12)).toBe("1 hour, 1 min");
   });
 });
diff --git a/apps/dashboard/shared/utils/formatBlocksToUserReadable.ts b/apps/dashboard/shared/utils/formatBlocksToUserReadable.ts
index e4894c911..354b53939 100644
--- a/apps/dashboard/shared/utils/formatBlocksToUserReadable.ts
+++ b/apps/dashboard/shared/utils/formatBlocksToUserReadable.ts
@@ -15,8 +15,8 @@ export function formatBlocksToUserReadable(
   // Convert blocks to seconds
   const totalSeconds = num * blockTime;
 
-  // For small block counts, just show seconds
-  if (num < 5) {
+  // For short durations, just show seconds
+  if (totalSeconds < 60) {
     return formatPlural(Math.round(totalSeconds), "sec");
   }
 
diff --git a/apps/indexer/AGENTS.md b/apps/indexer/AGENTS.md
new file mode 100644
index 000000000..a977830a6
--- /dev/null
+++ b/apps/indexer/AGENTS.md
@@ -0,0 +1,106 @@
+# Indexer Package Guide
+
+## Overview
+
+- **Service ID**: `<dao>-indexer`
+- **Port**: 42069
+- **Stack**: Ponder 0.16, Hono 4.10, viem 2.37, Zod 3.25
+- **Purpose**: Real-time blockchain event indexing for DAO governance contracts
+
+## What It Does
+
+Monitors and indexes governance-related smart contracts including:
+
+- Proposals, votes, delegations
+- Token transfers and balances
+- Historical balance snapshots
+- Integration with external APIs (CoinGecko, Dune Analytics)
+
+## Critical Warnings
+
+⚠️ **EVERY CODE CHANGE TRIGGERS A FULL REINDEX**
+
+- Only run the indexer when explicitly asked
+- Avoid unnecessary changes to indexer code
+- Full reindexing can take significant time depending on chain history
+- Coordinate with team before making schema changes
+
+## Commands
+
+```bash
+# Development (use with caution!)
+pnpm indexer dev --config config/<dao>    # Triggers full reindex!
+
+# Verification (run after every change)
+pnpm indexer typecheck                    # Type checking
+pnpm indexer lint                         # Lint checking
+pnpm indexer lint:fix                     # Auto-fix lint issues
+```
+
+## Dependencies
+
+- **PostgreSQL**: Database for storing indexed data
+- **Ethereum RPC**: Blockchain node connection
+- **Environment Variables**: See root `.env` for RPC URLs and database connection
+
+## File Structure
+
+```
+apps/indexer/
+├── src/
+│   ├── eventHandlers/          # Event processing logic
+│   ├── indexer/<dao>/          # Per-DAO implementations
+│   └── ponder.schema.ts        # Source of truth for database schema
+├── config/
+│   └── <dao>.config.ts         # DAO-specific configurations
+└── ponder.config.ts            # Main Ponder configuration
+```
+
+## Where to Put New Code
+
+| What you're adding          | Where it goes                       |
+| --------------------------- | ----------------------------------- |
+| Event handler               | `src/eventHandlers/`                |
+| DAO-specific implementation | `src/indexer/<dao>/`                |
+| DAO configuration           | `config/<dao>.config.ts`            |
+| Database schema changes     | `src/ponder.schema.ts` (ask first!) |
+
+## Database Schema
+
+**Important**: The schema in `src/ponder.schema.ts` is the **source of truth**.
+
+When schema changes are needed:
+
+1. Modify `src/ponder.schema.ts` first
+2. Ask before proceeding (triggers reindex + API changes)
+3. Update corresponding Drizzle schema in `apps/api/src/database/schema/`
+
+## Development Workflow
+
+1. **Before making changes**: Confirm with team that indexer changes are needed
+2. **Make changes**: Edit event handlers or schema
+3. **Test locally**: Run `pnpm indexer dev --config config/<dao>` (be prepared to wait for reindex)
+4. **Verify**: Run `pnpm indexer typecheck && pnpm indexer lint`
+5. **Commit**: Follow conventional commits
+6. **Deploy**: Ask before deploying (coordinate with team)
+
+## Testing
+
+Currently, the indexer relies on:
+
+- Ponder's built-in validation
+- Manual testing with development runs
+- Integration testing through API layer
+
+## Common Issues
+
+- **Long reindex times**: Expected behavior when schema or handlers change
+- **RPC rate limits**: Configure appropriate RPC endpoints in `.env`
+- **Database connection errors**: Ensure PostgreSQL is running and accessible
+- **Missing events**: Check contract addresses and start blocks in config
+
+## Related Documentation
+
+- [Ponder Documentation](https://ponder.sh)
+- Root `AGENTS.md` for general guidelines
+- `apps/api/AGENTS.md` for database schema mapping
diff --git a/package.json b/package.json
index f16e1550e..0b6593343 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,8 @@
     "lint": "turbo lint",
     "lint:fix": "turbo lint:fix",
     "typecheck": "turbo typecheck",
-    "prepare": "husky"
+    "prepare": "husky",
+    "test": "turbo test"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": [
diff --git a/packages/graphql-client/AGENTS.md b/packages/graphql-client/AGENTS.md
new file mode 100644
index 000000000..a07f26405
--- /dev/null
+++ b/packages/graphql-client/AGENTS.md
@@ -0,0 +1,295 @@
+# GraphQL Client Package Guide
+
+## Overview
+
+- **Package**: `@anticapture/graphql-client`
+- **Location**: `packages/graphql-client`
+- **Stack**: @graphql-codegen/cli 5.0, @graphql-codegen/typescript-react-apollo 4.3
+- **Purpose**: Auto-generated TypeScript types and React Apollo hooks from the API Gateway's GraphQL schema
+
+## What It Does
+
+- Fetches GraphQL schema from API Gateway
+- Generates TypeScript type definitions for all GraphQL types
+- Creates React hooks for queries, mutations, and subscriptions
+- Provides type-safe GraphQL client for the Dashboard
+- Enables IDE autocomplete and compile-time type checking
+
+## Commands
+
+```bash
+# Generate types and hooks (one-time)
+pnpm client codegen
+
+# Watch mode (auto-regenerate on schema changes)
+pnpm client dev
+
+# Verification
+pnpm client typecheck          # Type checking
+pnpm client lint                # Lint checking
+```
+
+## Dependencies
+
+- **API Gateway**: Must be running (locally or on Railway)
+- The gateway's GraphQL schema must be accessible
+
+## Environment Variables
+
+Configure in `packages/graphql-client/.env`:
+
+| Variable                       | Required | Default | Description                     |
+| ------------------------------ | -------- | ------- | ------------------------------- |
+| `ANTICAPTURE_GRAPHQL_ENDPOINT` | yes      | —       | API Gateway URL (with /graphql) |
+
+### Example Configuration
+
+```bash
+# Local development (use remote gateway to avoid running full stack locally)
+ANTICAPTURE_GRAPHQL_ENDPOINT=https://api-gateway-dev.railway.app/graphql
+
+# Local gateway
+ANTICAPTURE_GRAPHQL_ENDPOINT=http://localhost:4000/graphql
+```
+
+## File Structure
+
+```
+packages/graphql-client/
+├── src/
+│   ├── generated/              # Auto-generated files (DO NOT EDIT)
+│   │   ├── graphql.ts          # TypeScript types
+│   │   └── operations.ts       # React hooks
+│   └── index.ts                # Package exports
+├── codegen.ts                  # GraphQL Codegen configuration
+└── package.json
+```
+
+## How It Works
+
+1. **Schema introspection**: Fetches schema from API Gateway endpoint
+2. **Type generation**: Creates TypeScript types for all GraphQL types
+3. **Hook generation**: Creates React Apollo hooks for operations
+4. **Export**: Makes types and hooks available via package imports
+
+## Generated Output
+
+### TypeScript Types
+
+```typescript
+// src/generated/graphql.ts
+export type Dao = {
+  __typename?: "Dao";
+  id: Scalars["ID"];
+  name: Scalars["String"];
+  tokenAddress: Scalars["String"];
+  totalSupply: Scalars["BigInt"];
+};
+
+export type Query = {
+  __typename?: "Query";
+  dao: Dao;
+  proposals: Array<Proposal>;
+};
+```
+
+### React Hooks
+
+```typescript
+// src/generated/operations.ts
+export function useGetDaoQuery(
+  baseOptions?: Apollo.QueryHookOptions<GetDaoQuery, GetDaoQueryVariables>,
+) {
+  return Apollo.useQuery<GetDaoQuery, GetDaoQueryVariables>(
+    GetDaoDocument,
+    baseOptions,
+  );
+}
+```
+
+## Usage in Dashboard
+
+### Import Generated Code
+
+```typescript
+// In dashboard components
+import { useGetDaoQuery, Dao } from "@anticapture/graphql-client";
+
+export function DaoComponent() {
+  const { data, loading, error } = useGetDaoQuery({
+    variables: { daoId: "ens" },
+  });
+
+  if (loading) return <div>Loading...</div>;
+  if (error) return <div>Error: {error.message}</div>;
+
+  const dao: Dao | undefined = data?.dao;
+
+  return <div>{dao?.name}</div>;
+}
+```
+
+### Type Safety
+
+```typescript
+// Types are automatically inferred
+const { data } = useGetDaoQuery();
+
+// ✅ TypeScript knows this is Dao | undefined
+const dao = data?.dao;
+
+// ✅ Autocomplete available
+const name = dao?.name;
+
+// ❌ TypeScript error: Property 'invalid' does not exist
+const invalid = dao?.invalid;
+```
+
+## Development Workflow
+
+### When to Regenerate
+
+Run `pnpm client codegen` when:
+
+1. **GraphQL schema changes** in the API Gateway
+2. **New queries/mutations** are added to the Dashboard
+3. **GraphQL operations** are modified in the Dashboard
+4. **After pulling changes** that include schema updates
+
+### Typical Workflow
+
+```bash
+# 1. Ensure API Gateway is running
+pnpm gateway dev
+
+# 2. Generate types
+pnpm client codegen
+
+# 3. Use in Dashboard
+pnpm dashboard dev
+
+# 4. Make schema changes (in API or Gateway)
+# ...edit code...
+
+# 5. Regenerate
+pnpm client codegen
+
+# 6. Fix any type errors in Dashboard
+pnpm dashboard typecheck
+```
+
+## Configuration
+
+### GraphQL Codegen Config (`codegen.ts`)
+
+```typescript
+import type { CodegenConfig } from "@graphql-codegen/cli";
+
+const config: CodegenConfig = {
+  schema: process.env.ANTICAPTURE_GRAPHQL_ENDPOINT,
+  documents: ["../../apps/dashboard/**/*.{ts,tsx}"],
+  generates: {
+    "./src/generated/": {
+      preset: "client",
+      plugins: [
+        "typescript",
+        "typescript-operations",
+        "typescript-react-apollo",
+      ],
+      config: {
+        withHooks: true,
+        withComponent: false,
+        withHOC: false,
+      },
+    },
+  },
+};
+
+export default config;
+```
+
+## Common Issues
+
+### Schema Fetch Fails
+
+**Problem**: Cannot fetch schema from endpoint
+
+**Solutions**:
+
+- Check `ANTICAPTURE_GRAPHQL_ENDPOINT` is correct
+- Ensure API Gateway is running and accessible
+- Test endpoint manually: `curl <endpoint>`
+
+### Type Mismatches
+
+**Problem**: Types don't match API response
+
+**Solutions**:
+
+- Regenerate types: `pnpm client codegen`
+- Check if API Gateway schema is up to date
+- Clear Dashboard's Apollo cache
+
+### Stale Types
+
+**Problem**: Generated types are outdated
+
+**Solutions**:
+
+- Always regenerate after schema changes
+- Use `pnpm client dev` in watch mode during development
+- Add codegen to CI/CD pipeline
+
+### Import Errors in Dashboard
+
+**Problem**: Cannot import from `@anticapture/graphql-client`
+
+**Solutions**:
+
+- Run `pnpm install` in root to link workspace dependencies
+- Check `package.json` has correct workspace reference
+- Build the client package: `pnpm client build` (if applicable)
+
+## Best Practices
+
+### DO
+
+- ✅ Use generated hooks in Dashboard components
+- ✅ Regenerate after any schema changes
+- ✅ Commit generated files to version control
+- ✅ Use TypeScript types from generated code
+- ✅ Point to remote gateway for local Dashboard development
+
+### DON'T
+
+- ❌ Manually edit files in `src/generated/`
+- ❌ Skip regeneration after schema changes
+- ❌ Ignore TypeScript errors after regeneration
+- ❌ Use `any` types instead of generated types
+
+## Integration with Dashboard
+
+The Dashboard imports this package as a workspace dependency:
+
+```json
+// apps/dashboard/package.json
+{
+  "dependencies": {
+    "@anticapture/graphql-client": "workspace:*"
+  }
+}
+```
+
+This ensures:
+
+- Type safety across the frontend
+- Single source of truth for GraphQL types
+- Automatic updates when schema changes
+
+## Related Documentation
+
+- [GraphQL Code Generator](https://the-guild.dev/graphql/codegen)
+- [Apollo Client React Hooks](https://www.apollographql.com/docs/react/api/react/hooks)
+- Root `AGENTS.md` for general guidelines
+- `apps/api-gateway/AGENTS.md` for schema source
+- `apps/dashboard/AGENTS.md` for usage examples
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cd1c6a9b9..4b1fe718a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,19 +9,19 @@ importers:
     devDependencies:
       "@commitlint/cli":
         specifier: ^19.5.0
-        version: 19.8.1(@types/node@20.19.25)(typescript@5.9.3)
+        version: 19.8.1(@types/node@20.19.33)(typescript@5.9.3)
       "@commitlint/config-conventional":
         specifier: ^19.5.0
         version: 19.8.1
       "@types/node":
         specifier: ^20.16.5
-        version: 20.19.25
+        version: 20.19.33
       "@typescript-eslint/eslint-plugin":
         specifier: ^8
-        version: 8.53.0(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+        version: 8.55.0(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       "@typescript-eslint/parser":
         specifier: ^8
-        version: 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+        version: 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       dotenv-cli:
         specifier: ^7.4.4
         version: 7.4.4
@@ -33,10 +33,10 @@ importers:
         version: 9.1.2(eslint@9.39.2(jiti@2.6.1))
       eslint-plugin-import:
         specifier: ^2.32.0
-        version: 2.32.0(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint-import-resolver-typescript@3.10.1)(eslint@9.39.2(jiti@2.6.1))
+        version: 2.32.0(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))
       eslint-plugin-prettier:
         specifier: ^5.2.1
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@9.39.2(jiti@2.6.1)))(eslint@9.39.2(jiti@2.6.1))(prettier@3.7.4)
+        version: 5.5.5(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@9.39.2(jiti@2.6.1)))(eslint@9.39.2(jiti@2.6.1))(prettier@3.8.1)
       husky:
         specifier: ^9.1.6
         version: 9.1.7
@@ -45,13 +45,13 @@ importers:
         version: 16.2.7
       prettier:
         specifier: ^3.4.2
-        version: 3.7.4
+        version: 3.8.1
       prettier-plugin-tailwindcss:
         specifier: ^0.6.11
-        version: 0.6.14(prettier@3.7.4)
+        version: 0.6.14(prettier@3.8.1)
       turbo:
         specifier: ^2.3.1
-        version: 2.6.2
+        version: 2.8.6
       typescript:
         specifier: ^5.8.3
         version: 5.9.3
@@ -60,28 +60,28 @@ importers:
     dependencies:
       "@hono/node-server":
         specifier: ^1.19.9
-        version: 1.19.9(hono@4.10.7)
+        version: 1.19.9(hono@4.11.9)
       "@hono/zod-openapi":
         specifier: ^0.19.6
-        version: 0.19.10(hono@4.10.7)(zod@3.25.76)
+        version: 0.19.10(hono@4.11.9)(zod@3.25.76)
       axios:
         specifier: ^1.9.0
-        version: 1.13.2
+        version: 1.13.5
       drizzle-kit:
-        specifier: ^0.31.4
-        version: 0.31.7
+        specifier: ^0.31.9
+        version: 0.31.9
       drizzle-orm:
-        specifier: ~0.41.0
-        version: 0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.15.6)(kysely@0.26.3)(pg@8.17.2)
+        specifier: ^0.45.1
+        version: 0.45.1(@electric-sql/pglite@0.3.15)(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(kysely@0.26.3)(pg@8.18.0)
       hono:
         specifier: ^4.7.10
-        version: 4.10.7
+        version: 4.11.9
       pg:
         specifier: ^8.17.2
-        version: 8.17.2
+        version: 8.18.0
       viem:
         specifier: ^2.41.2
-        version: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+        version: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zod:
         specifier: ^3.25.3
         version: 3.25.76
@@ -89,15 +89,18 @@ importers:
         specifier: ^3.4.1
         version: 3.5.4(zod@3.25.76)
     devDependencies:
-      "@types/jest":
-        specifier: ^29.5.14
-        version: 29.5.14
+      "@electric-sql/pglite":
+        specifier: ^0.3.15
+        version: 0.3.15
       "@types/node":
         specifier: ^20.16.5
-        version: 20.19.25
+        version: 20.19.33
       "@types/pg":
         specifier: ^8.15.6
-        version: 8.15.6
+        version: 8.16.0
+      "@vitest/coverage-v8":
+        specifier: 3.2.4
+        version: 3.2.4(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
       dotenv:
         specifier: ^16.5.0
         version: 16.6.1
@@ -109,16 +112,10 @@ importers:
         version: 9.1.2(eslint@8.57.1)
       eslint-plugin-prettier:
         specifier: ^5.2.1
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.7.4)
-      jest:
-        specifier: ^29.7.0
-        version: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+        version: 5.5.5(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.8.1)
       prettier:
         specifier: ^3.5.3
-        version: 3.7.4
-      ts-jest:
-        specifier: ^29.4.1
-        version: 29.4.6(@babel/core@7.28.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.0))(esbuild@0.25.8)(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)))(typescript@5.9.3)
+        version: 3.8.1
       tsup:
         specifier: ^8.5.1
         version: 8.5.1(jiti@2.6.1)(postcss@8.5.6)(tsx@4.21.0)(typescript@5.9.3)(yaml@2.8.2)
@@ -128,33 +125,36 @@ importers:
       typescript:
         specifier: ^5.8.3
         version: 5.9.3
+      vitest:
+        specifier: ^3.0.5
+        version: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
 
   apps/api-gateway:
     dependencies:
       "@graphql-mesh/config":
         specifier: ^0.108.4
-        version: 0.108.20(graphql@16.12.0)
+        version: 0.108.27(graphql@16.12.0)
       "@graphql-mesh/graphql":
         specifier: ^0.104.3
-        version: 0.104.18(@types/node@22.7.5)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+        version: 0.104.24(@types/node@25.2.3)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@graphql-mesh/http":
         specifier: ^0.106.3
-        version: 0.106.18(graphql@16.12.0)
+        version: 0.106.25(graphql@16.12.0)
       "@graphql-mesh/openapi":
         specifier: ^0.109.8
-        version: 0.109.25(graphql@16.12.0)
+        version: 0.109.31(graphql@16.12.0)
       "@graphql-mesh/runtime":
         specifier: ^0.106.3
-        version: 0.106.18(graphql@16.12.0)
+        version: 0.106.24(graphql@16.12.0)
       "@graphql-mesh/transform-filter-schema":
         specifier: ^0.104.18
-        version: 0.104.19(graphql@16.12.0)
+        version: 0.104.22(graphql@16.12.0)
       "@graphql-mesh/transform-rename":
         specifier: ^0.105.7
-        version: 0.105.18(graphql@16.12.0)
+        version: 0.105.23(graphql@16.12.0)
       "@graphql-mesh/types":
         specifier: ^0.104.3
-        version: 0.104.18(graphql@16.12.0)
+        version: 0.104.20(graphql@16.12.0)
       dotenv:
         specifier: ^16.5.0
         version: 16.6.1
@@ -164,16 +164,16 @@ importers:
     devDependencies:
       "@graphql-mesh/cli":
         specifier: ^0.100.4
-        version: 0.100.20(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+        version: 0.100.27(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@types/jest":
         specifier: ^29.5.14
         version: 29.5.14
       jest:
         specifier: ^29.7.0
-        version: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+        version: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       ts-jest:
         specifier: ^29.4.1
-        version: 29.4.6(@babel/core@7.28.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.0))(jest-util@29.7.0)(jest@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)))(typescript@5.9.3)
+        version: 29.4.6(@babel/core@7.29.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.29.0))(jest-util@29.7.0)(jest@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)))(typescript@5.9.3)
       tsx:
         specifier: ^4.19.4
         version: 4.21.0
@@ -188,13 +188,13 @@ importers:
         version: link:../../packages/graphql-client
       "@apollo/client":
         specifier: ^3.13.8
-        version: 3.14.0(@types/react@19.2.8)(graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
+        version: 3.14.0(@types/react@19.2.8)(graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       "@ethersproject/providers":
         specifier: ^5.8.0
         version: 5.8.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
       "@hookform/resolvers":
         specifier: ^5.2.2
-        version: 5.2.2(react-hook-form@7.71.0(react@19.2.3))
+        version: 5.2.2(react-hook-form@7.71.1(react@19.2.3))
       "@radix-ui/react-accordion":
         specifier: ^1.2.3
         version: 1.2.12(@types/react-dom@19.2.3(@types/react@19.2.8))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
@@ -224,19 +224,19 @@ importers:
         version: 1.2.8(@types/react-dom@19.2.3(@types/react@19.2.8))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       "@rainbow-me/rainbowkit":
         specifier: ^2.2.0
-        version: 2.2.9(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(typescript@5.9.3)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))
+        version: 2.2.10(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(typescript@5.9.3)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))
       "@snapshot-labs/snapshot.js":
         specifier: ^0.12.62
         version: 0.12.65(bufferutil@4.0.9)(utf-8-validate@5.0.10)
       "@tanstack/react-query":
         specifier: ^5.59.16
-        version: 5.90.11(react@19.2.3)
+        version: 5.90.21(react@19.2.3)
       "@tanstack/react-table":
         specifier: ^8.20.5
         version: 8.21.3(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       axios:
         specifier: ^1.9.0
-        version: 1.13.2
+        version: 1.13.5
       class-variance-authority:
         specifier: ^0.7.1
         version: 0.7.1
@@ -263,7 +263,7 @@ importers:
         version: 16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       nuqs:
         specifier: ^2.8.4
-        version: 2.8.5(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
+        version: 2.8.8(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
       react:
         specifier: 19.2.3
         version: 19.2.3
@@ -278,7 +278,7 @@ importers:
         version: 19.2.3(react@19.2.3)
       react-hook-form:
         specifier: ^7.69.0
-        version: 7.71.0(react@19.2.3)
+        version: 7.71.1(react@19.2.3)
       react-hot-toast:
         specifier: ^2.6.0
         version: 2.6.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
@@ -293,59 +293,59 @@ importers:
         version: 2.15.4(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       resend:
         specifier: ^6.6.0
-        version: 6.7.0
+        version: 6.9.2
       swr:
         specifier: ^2.3.2
-        version: 2.3.7(react@19.2.3)
+        version: 2.4.0(react@19.2.3)
       tailwind-merge:
         specifier: ^2.5.4
-        version: 2.6.0
+        version: 2.6.1
       vaul:
         specifier: ^1.1.2
         version: 1.1.2(@types/react-dom@19.2.3(@types/react@19.2.8))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
       viem:
         specifier: ^2.37.11
-        version: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+        version: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       wagmi:
         specifier: ^2.12.25
-        version: 2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
+        version: 2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
       zod:
         specifier: ^3.25.76
         version: 3.25.76
       zustand:
         specifier: ^5.0.8
-        version: 5.0.9(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
+        version: 5.0.11(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
     devDependencies:
       "@chromatic-com/storybook":
         specifier: ^4.1.1
-        version: 4.1.3(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
+        version: 4.1.3(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
       "@storybook/addon-designs":
         specifier: ^11.1.0
-        version: 11.1.1(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
+        version: 11.1.2(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
       "@storybook/addon-onboarding":
         specifier: ^10.2.0
-        version: 10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
+        version: 10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
       "@storybook/addon-vitest":
         specifier: ^10.2.0
-        version: 10.2.0(@vitest/runner@3.2.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))
+        version: 10.2.8(@vitest/runner@3.2.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
       "@storybook/nextjs":
         specifier: ^10.2.0
-        version: 10.2.0(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(type-fest@4.41.0)(typescript@5.9.3)(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))(webpack-hot-middleware@2.26.1)(webpack@5.103.0)
+        version: 10.2.8(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(type-fest@4.41.0)(typescript@5.9.3)(webpack-hot-middleware@2.26.1)(webpack@5.105.1)
       "@storybook/react":
         specifier: ^10.2.0
-        version: 10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
+        version: 10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
       "@tailwindcss/postcss":
         specifier: ^4.1.7
-        version: 4.1.17
+        version: 4.1.18
       "@types/jest":
         specifier: ^29.5.14
         version: 29.5.14
       "@types/lodash":
         specifier: ^4.17.16
-        version: 4.17.21
+        version: 4.17.23
       "@types/node":
         specifier: ^20
-        version: 20.19.25
+        version: 20.19.33
       "@types/react":
         specifier: 19.2.8
         version: 19.2.8
@@ -369,31 +369,31 @@ importers:
         version: 16.1.3(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       eslint-plugin-storybook:
         specifier: ^10.2.0
-        version: 10.2.0(eslint@9.39.2(jiti@2.6.1))(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
+        version: 10.2.8(eslint@9.39.2(jiti@2.6.1))(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
       jest:
         specifier: ^29.7.0
-        version: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+        version: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       playwright:
         specifier: ^1.52.0
-        version: 1.57.0
+        version: 1.58.2
       postcss:
         specifier: ^8
         version: 8.5.6
       prettier:
         specifier: ^3.4.2
-        version: 3.7.4
+        version: 3.8.1
       prettier-plugin-tailwindcss:
         specifier: ^0.6.11
-        version: 0.6.14(prettier@3.7.4)
+        version: 0.6.14(prettier@3.8.1)
       storybook:
         specifier: ^10.2.0
-        version: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+        version: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
       tailwindcss:
         specifier: ^4.1.7
-        version: 4.1.17
+        version: 4.1.18
       ts-jest:
         specifier: ^29.2.6
-        version: 29.4.6(@babel/core@7.28.5)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.5))(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)))(typescript@5.9.3)
+        version: 29.4.6(@babel/core@7.28.5)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.5))(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)))(typescript@5.9.3)
       tw-animate-css:
         specifier: ^1.3.0
         version: 1.4.0
@@ -402,29 +402,29 @@ importers:
         version: 5.9.3
       vitest:
         specifier: ^3.2.1
-        version: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
+        version: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
 
   apps/indexer:
     dependencies:
       hono:
         specifier: ^4.10.7
-        version: 4.10.7
+        version: 4.11.9
       ponder:
         specifier: ^0.16.2
-        version: 0.16.2(@opentelemetry/api@1.9.0)(@types/node@20.19.25)(@types/pg@8.15.6)(bufferutil@4.0.9)(hono@4.10.7)(lightningcss@1.30.2)(terser@5.44.1)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(zod@3.25.76)
+        version: 0.16.3(@opentelemetry/api@1.9.0)(@types/node@20.19.33)(@types/pg@8.16.0)(bufferutil@4.0.9)(hono@4.11.9)(lightningcss@1.30.2)(terser@5.46.0)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(zod@3.25.76)
       viem:
         specifier: ^2.37.11
-        version: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+        version: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zod:
         specifier: ^3.25.3
         version: 3.25.76
     devDependencies:
       "@types/node":
         specifier: ^20.16.5
-        version: 20.19.25
+        version: 20.19.33
       "@types/pg":
         specifier: ^8.15.6
-        version: 8.15.6
+        version: 8.16.0
       dotenv:
         specifier: ^16.5.0
         version: 16.6.1
@@ -433,19 +433,19 @@ importers:
         version: 8.57.1
       eslint-config-ponder:
         specifier: ^0.5.6
-        version: 0.5.25(@typescript-eslint/eslint-plugin@8.53.0(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3))(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)
+        version: 0.5.25(@typescript-eslint/eslint-plugin@8.55.0(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3))(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)
       eslint-config-prettier:
         specifier: ^9.1.0
         version: 9.1.2(eslint@8.57.1)
       eslint-plugin-prettier:
         specifier: ^5.2.1
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.7.4)
+        version: 5.5.5(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.8.1)
       prettier:
         specifier: ^3.5.3
-        version: 3.7.4
+        version: 3.8.1
       ts-node:
         specifier: ^10.9.2
-        version: 10.9.2(@types/node@20.19.25)(typescript@5.9.3)
+        version: 10.9.2(@types/node@20.19.33)(typescript@5.9.3)
       typescript:
         specifier: ^5.8.3
         version: 5.9.3
@@ -456,10 +456,10 @@ importers:
     dependencies:
       "@apollo/client":
         specifier: ^3.9.0
-        version: 3.14.0(@types/react@19.2.8)(graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@18.3.1))(react@18.3.1)
+        version: 3.14.0(@types/react@19.2.8)(graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@18.3.1))(react@18.3.1)
       "@graphql-codegen/cli":
         specifier: ^5.0.7
-        version: 5.0.7(@parcel/watcher@2.5.1)(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)
+        version: 5.0.7(@parcel/watcher@2.5.6)(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)
       "@graphql-codegen/typescript":
         specifier: ^4.1.6
         version: 4.1.6(graphql@16.12.0)
@@ -468,7 +468,7 @@ importers:
         version: 4.6.1(graphql@16.12.0)
       "@graphql-codegen/typescript-react-apollo":
         specifier: ^4.3.3
-        version: 4.3.3(graphql@16.12.0)
+        version: 4.4.0(graphql@16.12.0)
       concurrently:
         specifier: ^9.2.0
         version: 9.2.1
@@ -484,10 +484,10 @@ importers:
     devDependencies:
       "@parcel/watcher":
         specifier: ^2.5.1
-        version: 2.5.1
+        version: 2.5.6
       "@types/node":
         specifier: ^20.16.5
-        version: 20.19.25
+        version: 20.19.33
 
   packages/local-node:
     dependencies:
@@ -496,7 +496,7 @@ importers:
         version: 4.9.6
       forge-std:
         specifier: github:foundry-rs/forge-std
-        version: https://codeload.github.com/foundry-rs/forge-std/tar.gz/8e7bbe65b08aa71a0c93b50dc707da716a2ac1ff
+        version: https://codeload.github.com/foundry-rs/forge-std/tar.gz/aeb45e9f32ef8ca78f0aeda17596e9c46374da41
 
 packages:
   "@adobe/css-tools@4.4.3":
@@ -592,6 +592,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/code-frame@7.29.0":
+    resolution:
+      {
+        integrity: sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/compat-data@7.28.0":
     resolution:
       {
@@ -620,6 +627,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/core@7.29.0":
+    resolution:
+      {
+        integrity: sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/generator@7.28.0":
     resolution:
       {
@@ -641,6 +655,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/generator@7.29.1":
+    resolution:
+      {
+        integrity: sha512-qsaF+9Qcm2Qv8SRIMMscAvG4O3lJ0F1GuMo5HR/Bp02LopNgnZBC/EkbevHFeGs4ls/oPz9v+Bsmzbkbe+0dUw==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/helper-annotate-as-pure@7.27.3":
     resolution:
       {
@@ -872,6 +893,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/helpers@7.28.6":
+    resolution:
+      {
+        integrity: sha512-xOBvwq86HHdB7WUDTfKfT/Vuxh7gElQ+Sfti2Cy6yIWNW05P8iUslOVcZ4/sKbE+/jQaukQAdz/gf3724kYdqw==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/parser@7.28.0":
     resolution:
       {
@@ -896,6 +924,14 @@ packages:
     engines: { node: ">=6.0.0" }
     hasBin: true
 
+  "@babel/parser@7.29.0":
+    resolution:
+      {
+        integrity: sha512-IyDgFV5GeDUVX4YdF/3CPULtVGSXXMLh1xVIgdCgxApktqnQV0r7/8Nqthg+8YLGaAtdyIlo2qIdZrbCv4+7ww==,
+      }
+    engines: { node: ">=6.0.0" }
+    hasBin: true
+
   "@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.28.5":
     resolution:
       {
@@ -1817,6 +1853,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/runtime@7.28.6":
+    resolution:
+      {
+        integrity: sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/template@7.27.2":
     resolution:
       {
@@ -1852,6 +1895,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/traverse@7.29.0":
+    resolution:
+      {
+        integrity: sha512-4HPiQr0X7+waHfyXPZpWPfWL/J7dcN1mx9gL6WdQVMbPnF3+ZhSMs8tCxN7oHddJE9fhNE7+lxdnlyemKfJRuA==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@babel/types@7.28.1":
     resolution:
       {
@@ -1873,6 +1923,13 @@ packages:
       }
     engines: { node: ">=6.9.0" }
 
+  "@babel/types@7.29.0":
+    resolution:
+      {
+        integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==,
+      }
+    engines: { node: ">=6.9.0" }
+
   "@base-org/account@2.4.0":
     resolution:
       {
@@ -1885,6 +1942,13 @@ packages:
         integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==,
       }
 
+  "@bcoe/v8-coverage@1.0.2":
+    resolution:
+      {
+        integrity: sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==,
+      }
+    engines: { node: ">=18" }
+
   "@chromatic-com/storybook@4.1.3":
     resolution:
       {
@@ -2068,6 +2132,12 @@ packages:
         integrity: sha512-YRY806NnScVqa21/1L1vaysSQ+0/cAva50z7vlwzaGiBOTS9JhdzIRHN0KfgMhobFAphbznZJ7urMso4RtMBIQ==,
       }
 
+  "@electric-sql/pglite@0.3.15":
+    resolution:
+      {
+        integrity: sha512-Cj++n1Mekf9ETfdc16TlDi+cDDQF0W7EcbyRHYOAeZdsAe8M/FJg18itDTSwyHfar2WIezawM9o0EKaRGVKygQ==,
+      }
+
   "@emnapi/core@1.4.5":
     resolution:
       {
@@ -2105,24 +2175,31 @@ packages:
       }
     engines: { node: ">=18.0.0" }
 
-  "@envelop/extended-validation@7.0.0":
+  "@envelop/core@5.5.0":
+    resolution:
+      {
+        integrity: sha512-nsU1EyJQAStaKHR1ZkB/ug9XBm+WPTliYtdedbJ/L1ykrp7dbbn0srqBeDnZ2mbZVp4hH3d0Fy+Og9OgPWZx+g==,
+      }
+    engines: { node: ">=18.0.0" }
+
+  "@envelop/extended-validation@7.1.0":
     resolution:
       {
-        integrity: sha512-TrvuSvUVJO77DU/WnUY6nrfxw4uKSKkbe43hjB0OQHGdg8dZBByKE1WZkPIQCIYmaPu89boi0F8aX8u3Y0jtnw==,
+        integrity: sha512-2PQdgc0ohbWJ1HiCGByWOd+FjLumUyLH8QKUxf5m5hBYTLD9R3LySWS00cHwnc5SMBXkRyMKCBT87GKxZv/ocg==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
-      "@envelop/core": ^5.4.0
+      "@envelop/core": ^5.5.0
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0
 
-  "@envelop/graphql-jit@11.0.0":
+  "@envelop/graphql-jit@11.1.0":
     resolution:
       {
-        integrity: sha512-6chuNgtKDcr3x675b/y8VGynB5Rkcm/WwTmBY86q+0rgG7pX2cRONMYx5fTv0Hko+FaH3SWyW/2K2Tn/5CEZJw==,
+        integrity: sha512-mWlvcFL5AbP185qzzqT6pOFnfbME5+MKOy/dC4lHyC4WENK+5jzHbhp3zSag5Vi8It1KDY5eU9mVO0QWPHklVw==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
-      "@envelop/core": ^5.4.0
+      "@envelop/core": ^5.5.0
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0
 
   "@envelop/instrumentation@1.0.0":
@@ -2162,6 +2239,15 @@ packages:
     cpu: [ppc64]
     os: [aix]
 
+  "@esbuild/aix-ppc64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==,
+      }
+    engines: { node: ">=18" }
+    cpu: [ppc64]
+    os: [aix]
+
   "@esbuild/aix-ppc64@0.25.8":
     resolution:
       {
@@ -2198,6 +2284,15 @@ packages:
     cpu: [arm64]
     os: [android]
 
+  "@esbuild/android-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [android]
+
   "@esbuild/android-arm64@0.25.8":
     resolution:
       {
@@ -2234,6 +2329,15 @@ packages:
     cpu: [arm]
     os: [android]
 
+  "@esbuild/android-arm@0.25.12":
+    resolution:
+      {
+        integrity: sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm]
+    os: [android]
+
   "@esbuild/android-arm@0.25.8":
     resolution:
       {
@@ -2270,6 +2374,15 @@ packages:
     cpu: [x64]
     os: [android]
 
+  "@esbuild/android-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [android]
+
   "@esbuild/android-x64@0.25.8":
     resolution:
       {
@@ -2306,6 +2419,15 @@ packages:
     cpu: [arm64]
     os: [darwin]
 
+  "@esbuild/darwin-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [darwin]
+
   "@esbuild/darwin-arm64@0.25.8":
     resolution:
       {
@@ -2342,6 +2464,15 @@ packages:
     cpu: [x64]
     os: [darwin]
 
+  "@esbuild/darwin-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [darwin]
+
   "@esbuild/darwin-x64@0.25.8":
     resolution:
       {
@@ -2378,6 +2509,15 @@ packages:
     cpu: [arm64]
     os: [freebsd]
 
+  "@esbuild/freebsd-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [freebsd]
+
   "@esbuild/freebsd-arm64@0.25.8":
     resolution:
       {
@@ -2414,6 +2554,15 @@ packages:
     cpu: [x64]
     os: [freebsd]
 
+  "@esbuild/freebsd-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [freebsd]
+
   "@esbuild/freebsd-x64@0.25.8":
     resolution:
       {
@@ -2450,6 +2599,15 @@ packages:
     cpu: [arm64]
     os: [linux]
 
+  "@esbuild/linux-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [linux]
+
   "@esbuild/linux-arm64@0.25.8":
     resolution:
       {
@@ -2486,6 +2644,15 @@ packages:
     cpu: [arm]
     os: [linux]
 
+  "@esbuild/linux-arm@0.25.12":
+    resolution:
+      {
+        integrity: sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm]
+    os: [linux]
+
   "@esbuild/linux-arm@0.25.8":
     resolution:
       {
@@ -2522,6 +2689,15 @@ packages:
     cpu: [ia32]
     os: [linux]
 
+  "@esbuild/linux-ia32@0.25.12":
+    resolution:
+      {
+        integrity: sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==,
+      }
+    engines: { node: ">=18" }
+    cpu: [ia32]
+    os: [linux]
+
   "@esbuild/linux-ia32@0.25.8":
     resolution:
       {
@@ -2558,6 +2734,15 @@ packages:
     cpu: [loong64]
     os: [linux]
 
+  "@esbuild/linux-loong64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==,
+      }
+    engines: { node: ">=18" }
+    cpu: [loong64]
+    os: [linux]
+
   "@esbuild/linux-loong64@0.25.8":
     resolution:
       {
@@ -2594,6 +2779,15 @@ packages:
     cpu: [mips64el]
     os: [linux]
 
+  "@esbuild/linux-mips64el@0.25.12":
+    resolution:
+      {
+        integrity: sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==,
+      }
+    engines: { node: ">=18" }
+    cpu: [mips64el]
+    os: [linux]
+
   "@esbuild/linux-mips64el@0.25.8":
     resolution:
       {
@@ -2630,6 +2824,15 @@ packages:
     cpu: [ppc64]
     os: [linux]
 
+  "@esbuild/linux-ppc64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==,
+      }
+    engines: { node: ">=18" }
+    cpu: [ppc64]
+    os: [linux]
+
   "@esbuild/linux-ppc64@0.25.8":
     resolution:
       {
@@ -2666,6 +2869,15 @@ packages:
     cpu: [riscv64]
     os: [linux]
 
+  "@esbuild/linux-riscv64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==,
+      }
+    engines: { node: ">=18" }
+    cpu: [riscv64]
+    os: [linux]
+
   "@esbuild/linux-riscv64@0.25.8":
     resolution:
       {
@@ -2702,6 +2914,15 @@ packages:
     cpu: [s390x]
     os: [linux]
 
+  "@esbuild/linux-s390x@0.25.12":
+    resolution:
+      {
+        integrity: sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [s390x]
+    os: [linux]
+
   "@esbuild/linux-s390x@0.25.8":
     resolution:
       {
@@ -2738,6 +2959,15 @@ packages:
     cpu: [x64]
     os: [linux]
 
+  "@esbuild/linux-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [linux]
+
   "@esbuild/linux-x64@0.25.8":
     resolution:
       {
@@ -2756,6 +2986,15 @@ packages:
     cpu: [x64]
     os: [linux]
 
+  "@esbuild/netbsd-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [netbsd]
+
   "@esbuild/netbsd-arm64@0.25.8":
     resolution:
       {
@@ -2792,6 +3031,15 @@ packages:
     cpu: [x64]
     os: [netbsd]
 
+  "@esbuild/netbsd-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [netbsd]
+
   "@esbuild/netbsd-x64@0.25.8":
     resolution:
       {
@@ -2810,6 +3058,15 @@ packages:
     cpu: [x64]
     os: [netbsd]
 
+  "@esbuild/openbsd-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [openbsd]
+
   "@esbuild/openbsd-arm64@0.25.8":
     resolution:
       {
@@ -2846,6 +3103,15 @@ packages:
     cpu: [x64]
     os: [openbsd]
 
+  "@esbuild/openbsd-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [openbsd]
+
   "@esbuild/openbsd-x64@0.25.8":
     resolution:
       {
@@ -2864,6 +3130,15 @@ packages:
     cpu: [x64]
     os: [openbsd]
 
+  "@esbuild/openharmony-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [openharmony]
+
   "@esbuild/openharmony-arm64@0.25.8":
     resolution:
       {
@@ -2900,6 +3175,15 @@ packages:
     cpu: [x64]
     os: [sunos]
 
+  "@esbuild/sunos-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [sunos]
+
   "@esbuild/sunos-x64@0.25.8":
     resolution:
       {
@@ -2936,6 +3220,15 @@ packages:
     cpu: [arm64]
     os: [win32]
 
+  "@esbuild/win32-arm64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==,
+      }
+    engines: { node: ">=18" }
+    cpu: [arm64]
+    os: [win32]
+
   "@esbuild/win32-arm64@0.25.8":
     resolution:
       {
@@ -2972,6 +3265,15 @@ packages:
     cpu: [ia32]
     os: [win32]
 
+  "@esbuild/win32-ia32@0.25.12":
+    resolution:
+      {
+        integrity: sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==,
+      }
+    engines: { node: ">=18" }
+    cpu: [ia32]
+    os: [win32]
+
   "@esbuild/win32-ia32@0.25.8":
     resolution:
       {
@@ -3008,6 +3310,15 @@ packages:
     cpu: [x64]
     os: [win32]
 
+  "@esbuild/win32-x64@0.25.12":
+    resolution:
+      {
+        integrity: sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==,
+      }
+    engines: { node: ">=18" }
+    cpu: [x64]
+    os: [win32]
+
   "@esbuild/win32-x64@0.25.8":
     resolution:
       {
@@ -3530,19 +3841,19 @@ packages:
     peerDependencies:
       graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0
 
-  "@graphql-codegen/typed-document-node@6.1.4":
+  "@graphql-codegen/typed-document-node@6.1.5":
     resolution:
       {
-        integrity: sha512-ITWsA+qvT7R64z7KmYHXfgyD5ff069FAGq/hpR0EWVfzXT4RW1Xn/3Biw7/jvwMGsS1BTjo8ZLSIMNM8KjE3GA==,
+        integrity: sha512-6dgEPz+YRMzSPpATj7tsKh/L6Y8OZImiyXIUzvSq/dRAEgoinahrES5y/eZQyc7CVxfoFCyHF9KMQQ9jiLn7lw==,
       }
     engines: { node: ">=16" }
     peerDependencies:
       graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0
 
-  "@graphql-codegen/typescript-generic-sdk@4.0.2":
+  "@graphql-codegen/typescript-generic-sdk@4.1.0":
     resolution:
       {
-        integrity: sha512-LuchzgBfOujkwXLhS549N5SsCFRGVB3BFzqEFNaeKa+l9PgRSqysQuSuqNZQXFh+fwPo8Oy+6EWq3t1m5iI4Fw==,
+        integrity: sha512-e2YYHr+tEglPwQDnpvp7USpPfwHC+ZMFiH5uDI4LygbLm0SIwh4vjwG8dt9eTkB+T20lgVQUy9EXaTzgTBiR9A==,
       }
     engines: { node: ">= 16.0.0" }
     peerDependencies:
@@ -3575,10 +3886,10 @@ packages:
       graphql-sock:
         optional: true
 
-  "@graphql-codegen/typescript-react-apollo@4.3.3":
+  "@graphql-codegen/typescript-react-apollo@4.4.0":
     resolution:
       {
-        integrity: sha512-ecuzzqoZEHCtlxaEXL1LQTrfzVYwNNtbVUBHc/KQDfkJIQZon+dG5ZXOoJ4BpbRA2L99yTx+TZc2VkpOVfSypw==,
+        integrity: sha512-4U0bRMDanxhUnGh/4qemQaUsuVq8HwqOMf/U9nuDXwnzxBSIPAZx/XpmUWHMtgF66J8RmzIjjB+U8Ykg48M//g==,
       }
     engines: { node: ">= 16.0.0" }
     peerDependencies:
@@ -3641,14 +3952,23 @@ packages:
     peerDependencies:
       graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0
 
-  "@graphql-hive/logger@1.0.9":
+  "@graphql-codegen/visitor-plugin-common@6.2.2":
+    resolution:
+      {
+        integrity: sha512-wEJ4zJj58PKlXISItZfr0xIHyM1lAuRfoflPegsb1L17Mx5+YzNOy0WAlLele3yzyV89WvCiprFKMcVQ7KfDXg==,
+      }
+    engines: { node: ">=16" }
+    peerDependencies:
+      graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0
+
+  "@graphql-hive/logger@1.0.10":
     resolution:
       {
-        integrity: sha512-gk8yuiECLtBtPEaNoghygMyeqmeIJnz9sybzEIaMbzDTls6bX4vPiN9nq6lndib4mR1j1mJmqFnhOMzXSVoYFg==,
+        integrity: sha512-YkbYBwQfAr4nPUl/52TWxmr4nIMXAs8x2fM6TohQTW2I5Wpw+qjhfXTNpj6hY4WtCpXiBhuF9FpSTTarYdHrJQ==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
-      "@logtape/logtape": ^1.2.0
+      "@logtape/logtape": ^1.2.0 || ^2.0.0
       pino: ^9.13.0 || ^10.0.0
       winston: "*"
     peerDependenciesMeta:
@@ -3688,227 +4008,200 @@ packages:
       }
     engines: { node: ">=20.0.0" }
 
-  "@graphql-inspector/core@7.0.3":
+  "@graphql-inspector/core@7.1.2":
     resolution:
       {
-        integrity: sha512-85WkFZkC2GjGLTf+PB6L347zJhQLZ7FH5OoMz6EXoacFjd6iQ5Xf/Qdz3Vu1tjLY70ZKj7jddI4GEPompNSkJg==,
+        integrity: sha512-yYuWN3/2lQsICwy0PL24hPYeNvDP62Z/t7CfQHcB9V4DJhDtNpoyUYBOwBB1YSwNs4nE9ZQhuv2VeBUZigKVQQ==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0
 
-  "@graphql-mesh/cache-inmemory-lru@0.8.18":
+  "@graphql-mesh/cache-inmemory-lru@0.8.23":
     resolution:
       {
-        integrity: sha512-G6q3+LXeD8OnwcHtz1pO1frBnFBZ0LZG6AIfoV5JQcoKVgU5CnDAGAJMikEJCsxVlpG8HI93sa0+OoDX+YjMgA==,
+        integrity: sha512-7ofTeef724J37u7bN6hIrfcrCRwINHVKPoku8LpjjxgNmnWzOP38nz0iCjMHfxYb+nHFxXw3VU9a+6HghagUEg==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/cache-localforage@0.105.18":
+  "@graphql-mesh/cache-localforage@0.105.23":
     resolution:
       {
-        integrity: sha512-TLNCA7iF7eK2w3UeBfF/+z3on2orN+YlRHrMPKol1Crgf0z5DWn0BkRgcFXe/oazsORBEnXQgocT4Ed8Aoi/QA==,
+        integrity: sha512-b+eC28boToY+KVJTrg8/Vfed6J10QzQ2dsNv4RckDkLOYdNaD2FZ/B05VjLYjbFmhkPtEFQoRZv5r/JUsx3YvQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/cli@0.100.20":
+  "@graphql-mesh/cli@0.100.27":
     resolution:
       {
-        integrity: sha512-WFnK8VtHZsY5XhfWcr4qYztuDEOIw3cRjxRUOSAGNGVlJc/+BQN1DfeeYqWGct3HY6zu2y7qJs+22BACmUmd8w==,
+        integrity: sha512-mIkme9iH7jkkRkGf4mhJtWGePsgnxUeCm3v/rKS4Z7tUzTksMrlyz5WGIRwh/mpFT5GyB3Rdz1GnDeQI5DQXfw==,
       }
     engines: { node: ">=16.0.0" }
     hasBin: true
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/config@0.108.20":
+  "@graphql-mesh/config@0.108.27":
     resolution:
       {
-        integrity: sha512-V1zPiNZ72ZMSP6nO0T/w1yupjpGHxZdty/pBydCSZC0mzwzfupZg5bs+7ujZ79jNAslFwXU4MgG9vw7MqpbEZw==,
+        integrity: sha512-mzzksZlylmLXnjbmliRq/amqGoIAg3/cjiKDPJu3ikM+sS1KS/y1e9KhJ9BSul/rLfuWFH9huI2BqfMLKm4SOw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/cross-helpers@0.4.10":
+  "@graphql-mesh/cross-helpers@0.4.12":
     resolution:
       {
-        integrity: sha512-7xmYM4P3UCmhx1pqU3DY4xWNydMBSXdzlHJ2wQPoM/s+l7tuWhxdtvmFmy12VkvZYtMAHkCpYvQokscWctUyrA==,
+        integrity: sha512-HENVP4rNVNakOOuBXUjkddyvywtt2myAIL3+TGP+5fb0P9TePocFUjHmV3wf7ItVwDuTqPLu7XguzZCiOUIR1A==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/cross-helpers@0.4.11":
+  "@graphql-mesh/fusion-composition@0.8.27":
     resolution:
       {
-        integrity: sha512-p4zBxfZ4NDXKzRIpUJnH5ATkxnjDOu1X1Er5RRZhb15crotTyGwyOo/vnRe7Tyl3b9+kBewz1tBZ3g381g9uUQ==,
+        integrity: sha512-VoSdqZAW8GaLlC47dIqlSg6n7npvCxwgVnQLvm2ncfW/zyIJhSnzkPUsyU2vlZB6AWn1y1J6Y0jkdm+JvuCztw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
-      graphql: "*"
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-mesh/fusion-composition@0.8.21":
+  "@graphql-mesh/graphql@0.104.24":
     resolution:
       {
-        integrity: sha512-RneNsLnhcRegLYYLxA1z5ebTDGJytDOPYIUfI475czl/+GjG2fs3Zh2jlI48aX9we01g1Bf2b2WjnxPtZv65Ww==,
-      }
-    engines: { node: ">=16.0.0" }
-    peerDependencies:
-      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
-
-  "@graphql-mesh/graphql@0.104.18":
-    resolution:
-      {
-        integrity: sha512-/UMaffyqKjg8Rdc9J2Gmek00UcOM2O25wOjzMfjDWK8BOLzQSOTiSkWjxTu9EjhvHSEXoOppLYAiVxK9OP+McQ==,
-      }
-    engines: { node: ">=16.0.0" }
-    peerDependencies:
-      graphql: "*"
-
-  "@graphql-mesh/http@0.106.18":
-    resolution:
-      {
-        integrity: sha512-ZWlRV/2547vSw0v+xu1/zFCEKy+/vHmDuRRugaxC3HjCwIbPHlU+UwvzYDcn8iH7uSj38GoSpSwrwOStfSr1vQ==,
+        integrity: sha512-1eFpc/F+NffJ3RYn1xkBEV40CI5PVZB6xi/Q+JSuakpJ5u3V3L9hDu35+oGpqHYOv/PB3f4JcV+qVu38+O6jsQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/include@0.3.17":
+  "@graphql-mesh/http@0.106.25":
     resolution:
       {
-        integrity: sha512-urQtB+WKPE9Wk3aNcwu8NsNDWBKyzChC+38OGEnp+fWD80Gg3ROcrVj8fKtaH1CqP26OjhKW+rwLrLqYYVPi+w==,
+        integrity: sha512-CXCLsBkIyOVLFHkZ9Hb4Ooqoggvm0UaVzNC8H6moEZfQxVvCouzgesEmiyCBA6bjjAuz91EIn6kp8I74V9jsXw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/merger-bare@0.105.18":
+  "@graphql-mesh/include@0.3.22":
     resolution:
       {
-        integrity: sha512-iAc7wUUrgvInS4OWt2+ftWJ2Jls/dq4JvkMqoXKo9so2Hc2vGp/11U7sS8b3O7YoRshO6Ow/N1gEyvsgOzdQEg==,
+        integrity: sha512-locxSfWIM79Y4wa4oMXTCMQxcXBtyLFQrlck5qK3XWi3HX0CsIFstxQi7E+nryWn6ew7IP1wDcByZqkSPCoJQg==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/merger-stitching@0.105.18":
+  "@graphql-mesh/merger-bare@0.105.24":
     resolution:
       {
-        integrity: sha512-EIFOnHo2NqiFYJtqiTpnYou71KMWmHupvElWEKWqU8NrBsJzGj2fR8UsqXSsMpxYo6B+dSzqbOPGj+qMsU/Utw==,
+        integrity: sha512-6GPCX2tSsJ55Ub2h7G6fWWWMtpDPWJCF/201UBS3MNLY2+1DgqhAWjnlB8Q/EAG4Dju12H3x63IaXuaB6IehBA==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/openapi@0.109.25":
+  "@graphql-mesh/merger-stitching@0.105.24":
     resolution:
       {
-        integrity: sha512-Hl/6st9Q19/DgUjEYGFBfAUKXSYjknJqJz8C/Fo1zd1PJ/SpmrKaZWRNmMez3pjlHTK+KA7UcK+yIq7VdMtVZw==,
+        integrity: sha512-Vk6htj7mGujUeaqtz7orBcYqkpT2GmMa9hmTJ5/EzxeP9+l6DBlfQqz10jqpeWtheb958CHIlLsKuDQ78hGu7Q==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/runtime@0.106.18":
+  "@graphql-mesh/openapi@0.109.31":
     resolution:
       {
-        integrity: sha512-8M78uxkSwA/GucOAFLJDG7JONX7s3EFj2d6jxGpqzpwLFXzd2vit3W610xEolmcWToeynDsqhoLm0WgXBjsqqQ==,
+        integrity: sha512-/QJ+fm4/LFZHcU5lEF0rLQdmHtcoISiQ9BOZcCJgp3qstXnynonSNuG9omI+WaajsWDBCRUDHJVoG6ewNbMgkg==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/store@0.104.18":
+  "@graphql-mesh/runtime@0.106.24":
     resolution:
       {
-        integrity: sha512-QRXjTbTRMduisXuz5aOIBqb2DiuSVyZnUrQ/zbtLk1bWKsxTYljlfhO4HaNN6ncxY+0pdT2E/rhPrgKZWWVQcA==,
+        integrity: sha512-IL4/+k4VtW5aOT4ccVfO3tx24iLhpMerwyF4y72CyIOpQyIbSi414iZCgbUOThp1BP31PYwLwD2ZSvN0bqbhrQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/string-interpolation@0.5.10":
+  "@graphql-mesh/store@0.104.24":
     resolution:
       {
-        integrity: sha512-NxK++yYXy0O65EAt1FY085iIaOnhL2M+MUcRMsc15syZhR7uRXQYOhVo5v1tOs5qVPKgQj2FayJGQcIh6PpT4g==,
+        integrity: sha512-gNnftTsVVUkUtu+SqnF9YwYgoJVvTVUFouFCZWLJwObROOMi0uTxp2cx5UCXJ02eqGuPJbKnNc7cdaWMEBpuTw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/string-interpolation@0.5.9":
+  "@graphql-mesh/string-interpolation@0.5.11":
     resolution:
       {
-        integrity: sha512-UHDsee3a9hBctZjB56B6sajxWFX56lLPlhtEYrQ06xq3gyFpb9bD45xi69ltPxbpHXmZrmNNDNLb/Ft173JQfg==,
+        integrity: sha512-MXMlFcy1CrrSdspBalk9oTfI6VGvdsLAS0lNaQlV65EtE5tNBo/NHxVo/KHJU0U9qaSzVBFAtLEKjy3yzvveRw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/transform-filter-schema@0.104.19":
+  "@graphql-mesh/transform-filter-schema@0.104.22":
     resolution:
       {
-        integrity: sha512-zc5IGz6LosWUTBgcskyD3gfsbhfbCcRa+RDtHfrksTqeHJzTZ0UuRNFDLo1Vd4Mbk/X/1Ylrrp8srEp3deuifA==,
+        integrity: sha512-BtzE2mZJ/4RJMZoZ4mGP9AeevwtMkwK5B1tWKVEZmtMJp7EAPYT7Wy0/sBDx5wwg4isEXkz8YP+iPSyW8KYCbQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/transform-rename@0.105.18":
+  "@graphql-mesh/transform-rename@0.105.23":
     resolution:
       {
-        integrity: sha512-5BMhHQXivVg1RPb9KCSC8qQy4b8ZmphWrc/yUSTQKPxWePG7DaZm3p6iMo43rAmN75iHeHyIf7DzPwX/rqEmxg==,
+        integrity: sha512-OFKFRMZDeWyk7mNtVXUMSZLkQ/9bEPEjmJdPTtyBXi0sPcyEZ+2LRfmC0pYDNaA4VMRbLM+ZqQPmhJns+HseNQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/transport-common@1.0.12":
+  "@graphql-mesh/transport-common@1.0.14":
     resolution:
       {
-        integrity: sha512-xu1LEl4VC+h7wfdR3ASHqu6iud6jtidHTp6tOtFWXXtz3zbJ8zugJ+2ktYJ60RbINQfdv+dobfzO1WV7OWN8hA==,
+        integrity: sha512-aIbMis/ex453A8w9ewhHOQ+wZ0CTyI6sisHqgqPvMai4gw2IAQ/97RMIWUVVmpSLN4vJ7p4DeZMPRfs6uWDLcg==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
       graphql: ^15.9.0 || ^16.9.0
 
-  "@graphql-mesh/transport-rest@0.9.18":
-    resolution:
-      {
-        integrity: sha512-Wdi8iwmB8chLWXrSxnXNqK/UgGPHwLcwQyUeMqBmw29l0fWbpjAYfRIXXy4ja1tOVeBpWZTlE83sUfUDEFWSww==,
-      }
-    engines: { node: ">=16.0.0" }
-    peerDependencies:
-      graphql: "*"
-
-  "@graphql-mesh/types@0.104.18":
+  "@graphql-mesh/transport-rest@0.9.24":
     resolution:
       {
-        integrity: sha512-bztJSYglXZv7greXC6cyI/j/5kt0TR0k8gV+JOGvHch5bEQZRKdN5fA3oXPwD/Ees+7zWTGN05e9xfkOT3nzUg==,
+        integrity: sha512-EhCjReSmX3iSEBHdUWepht2GZMLL2JM9nPFKkZs54PWOGST0iND3sKvR9OEnTPThDFXOi87Ch1BKLJFExGxibg==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/utils@0.104.17":
+  "@graphql-mesh/types@0.104.20":
     resolution:
       {
-        integrity: sha512-KBaqeIaDXp6kNKUeZJbqc1DpI687dPj+d8TvMh04Xnp1pah8pf7rXOuGyhF6rLL4Zc+tWAvg8UPZRhHQJ8ED2g==,
+        integrity: sha512-mQU/q1h80BernNfYbFR1pT7fVBPx3dgEnUXu5PU8lNEYjnQVLVjw5ekx64moJa5e1rTM7UGKgn8u7YsvLafGTw==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@graphql-mesh/utils@0.104.19":
+  "@graphql-mesh/utils@0.104.22":
     resolution:
       {
-        integrity: sha512-scn/qCUg5clVNJ6E3GQ+OrsmWQu1amJnnVhkb5zKP0XZOC0c5t9DVW/vX/1ggvz9wONG0JlxKUfC43MPPY6l6g==,
+        integrity: sha512-d1u6HhT82tZA5ESc9/GZrPqejcCp4ZqoW1Wra5w9lDtPUAJ/ZPP93uYE7ciQ+ktS7MntquFo0/LiYUFTlE04vQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
@@ -3923,19 +4216,19 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/batch-delegate@10.0.8":
+  "@graphql-tools/batch-delegate@10.0.12":
     resolution:
       {
-        integrity: sha512-CIEwrXE0hM3nXuQSozpTDuFrNxPeMSsjGjpLp/aoppdpNrq5Ta//V2nyWePzi4GR1jj4+W5K0bnekIpOHarXOg==,
+        integrity: sha512-bMOKge6bPGLxNDHfZTuvUrY4Q7qncurCkcFgEW2R7acBrtiKuEfOrw0sjGcLKrGbDFRzx7D6/1zRQ1cgpexUKQ==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/batch-execute@10.0.4":
+  "@graphql-tools/batch-execute@10.0.5":
     resolution:
       {
-        integrity: sha512-t8E0ILelbaIju0aNujMkKetUmbv3/07nxGSv0kEGLBk9GNtEmQ/Bjj8ZTo2WN35/Fy70zCHz2F/48Nx/Ec48cA==,
+        integrity: sha512-dL13tXkfGvAzLq2XfzTKAy9logIcltKYRuPketxdh3Ok3U6PN1HKMCHfrE9cmtAsxD96/8Hlghz5AtM+LRv/ig==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -3959,6 +4252,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/code-file-loader@8.1.28":
+    resolution:
+      {
+        integrity: sha512-BL3Ft/PFlXDE5nNuqA36hYci7Cx+8bDrPDc8X3VSpZy9iKFBY+oQ+IwqnEHCkt8OSp2n2V0gqTg4u3fcQP1Kwg==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/delegate@10.2.23":
     resolution:
       {
@@ -3968,10 +4270,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/delegate@12.0.2":
+  "@graphql-tools/delegate@12.0.6":
     resolution:
       {
-        integrity: sha512-1X93onxNgOzRvnZ8Xulwi6gNuBeuDxvGYOjUHEZyesPCsaWsyiVj1Wk6Pw/DTPGLy70sOFUKQGcaZbWnDORM2w==,
+        integrity: sha512-CizsslU+/FkzFwKilOI0/9xYpfuPITsqP3NyC0lS3im9eMp9iF4hQSLqsC96/b802lwTs1FoTrm3tRWWW0naqg==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -3995,10 +4297,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor-common@1.0.5":
+  "@graphql-tools/executor-common@1.0.6":
     resolution:
       {
-        integrity: sha512-gsBRxP4ui8s7/ppKGCJUQ9xxTNoFpNYmEirgM52EHo74hL5hrpS5o4zOmBH33+9t2ZasBziIfupYtLNa0DgK0g==,
+        integrity: sha512-23/K5C+LSlHDI0mj2SwCJ33RcELCcyDUgABm1Z8St7u/4Z5+95i925H/NAjUyggRjiaY8vYtNiMOPE49aPX1sg==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4013,10 +4315,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor-graphql-ws@3.1.3":
+  "@graphql-tools/executor-graphql-ws@3.1.4":
     resolution:
       {
-        integrity: sha512-q4k8KLoH2U51XdWJRdiW/KIKbBOtJ1mcILv0ALvBkOF99C3vwGj2zr4U0AMGCD3HzML2mPZuajhfYo/xB/pnZQ==,
+        integrity: sha512-wCQfWYLwg1JZmQ7rGaFy74AQyVFxpeqz19WWIGRgANiYlm+T0K3Hs6POgi0+nL3HvwxJIxhUlaRLFvkqm1zxSA==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4031,10 +4333,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor-http@3.0.7":
+  "@graphql-tools/executor-http@3.1.0":
     resolution:
       {
-        integrity: sha512-sHjtiUZmRtkjhpSzMhxT2ywAGzHjuB1rHsiaSLAq8U5BQg5WoLakKYD7BajgVHwNbfWEc+NnFiJI7ldyhiciiQ==,
+        integrity: sha512-DTaNU1rT2sxffwQlt+Aw68cHQWfGkjsaRk1D8nvG+DcCR8RNQo0d9qYt7pXIcfXYcQLb/OkABcGSuCfkopvHJg==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4049,37 +4351,37 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor-legacy-ws@1.1.24":
+  "@graphql-tools/executor-legacy-ws@1.1.25":
     resolution:
       {
-        integrity: sha512-wfSpOJCxeBcwVXy3JS4TB4oLwVICuVKPlPQhcAjTRPWYwKerE0HosgUzxCX1fEQ4l1B1OMgKWRglGpoXExKqsQ==,
+        integrity: sha512-6uf4AEXO0QMxJ7AWKVPqEZXgYBJaiz5vf29X0boG8QtcqWy8mqkXKWLND2Swdx0SbEx0efoGFcjuKufUcB0ASQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor@1.4.9":
+  "@graphql-tools/executor@1.5.0":
     resolution:
       {
-        integrity: sha512-SAUlDT70JAvXeqV87gGzvDzUGofn39nvaVcVhNf12Dt+GfWHtNNO/RCn/Ea4VJaSLGzraUd41ObnN3i80EBU7w==,
+        integrity: sha512-3HzAxfexmynEWwRB56t/BT+xYKEYLGPvJudR1jfs+XZX8bpfqujEhqVFoxmkpEE8BbFcKuBNoQyGkTi1eFJ+hA==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/executor@1.5.0":
+  "@graphql-tools/executor@1.5.1":
     resolution:
       {
-        integrity: sha512-3HzAxfexmynEWwRB56t/BT+xYKEYLGPvJudR1jfs+XZX8bpfqujEhqVFoxmkpEE8BbFcKuBNoQyGkTi1eFJ+hA==,
+        integrity: sha512-n94Qcu875Mji9GQ52n5UbgOTxlgvFJicBPYD+FRks9HKIQpdNPjkkrKZUYNG51XKa+bf03rxNflm4+wXhoHHrA==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/federation@4.2.6":
+  "@graphql-tools/federation@4.2.10":
     resolution:
       {
-        integrity: sha512-tTxvEIPMAyqgSBXsQqxIEXDys9+gmtzag7+mALG26PZJ7uGD6RRhBhV0kxLRTJ38jOttNriPBd2Zq38eW7IyXA==,
+        integrity: sha512-0l/W9lCEmLJj4vGV7pFA3I8Rt/arBIJHrJBXqQNtoLKa2ndGM+KebnsSBD8A94mrR5wtSPtkDZ84SeER5KNEAw==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4112,6 +4414,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/graphql-file-loader@8.1.9":
+    resolution:
+      {
+        integrity: sha512-rkLK46Q62Zxift8B6Kfw6h8SH3pCR3DPCfNeC/lpLwYReezZz+2ARuLDFZjQGjW+4lpMwiAw8CIxDyQAUgqU6A==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/graphql-tag-pluck@8.3.21":
     resolution:
       {
@@ -4121,6 +4432,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/graphql-tag-pluck@8.3.27":
+    resolution:
+      {
+        integrity: sha512-CJ0WVXhGYsfFngpRrAAcjRHyxSDHx4dEz2W15bkwvt9he/AWhuyXm07wuGcoLrl0q0iQp1BiRjU7D8SxWZo3JQ==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/import@7.0.21":
     resolution:
       {
@@ -4130,6 +4450,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/import@7.1.9":
+    resolution:
+      {
+        integrity: sha512-mHzOgyfzsAgstaZPIFEtKg4GVH4FbDHeHYrSs73mAPKS5F59/FlRuUJhAoRnxbVnc3qIZ6EsWBjOjNbnPK8viA==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/json-file-loader@8.0.20":
     resolution:
       {
@@ -4148,6 +4477,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/load@8.1.8":
+    resolution:
+      {
+        integrity: sha512-gxO662b64qZSToK3N6XUxWG5E6HOUjlg5jEnmGvD4bMtGJ0HwEe/BaVZbBQemCfLkxYjwRIBiVfOY9o0JyjZJg==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/merge@9.1.1":
     resolution:
       {
@@ -4157,10 +4495,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/merge@9.1.6":
+  "@graphql-tools/merge@9.1.7":
     resolution:
       {
-        integrity: sha512-bTnP+4oom4nDjmkS3Ykbe+ljAp/RIiWP3R35COMmuucS24iQxGLa9Hn8VMkLIoaoPxgz6xk+dbC43jtkNsFoBw==,
+        integrity: sha512-Y5E1vTbTabvcXbkakdFUt4zUIzB1fyaEnVmIWN0l0GMed2gdD01TpZWLUm4RNAxpturvolrb24oGLQrBbPLSoQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
@@ -4219,6 +4557,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/relay-operation-optimizer@7.0.27":
+    resolution:
+      {
+        integrity: sha512-rdkL1iDMFaGDiHWd7Bwv7hbhrhnljkJaD0MXeqdwQlZVgVdUDlMot2WuF7CEKVgijpH6eSC6AxXMDeqVgSBS2g==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/schema@10.0.25":
     resolution:
       {
@@ -4237,19 +4584,28 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/stitch@10.1.6":
+  "@graphql-tools/schema@10.0.31":
+    resolution:
+      {
+        integrity: sha512-ZewRgWhXef6weZ0WiP7/MV47HXiuFbFpiDUVLQl6mgXsWSsGELKFxQsyUCBos60Qqy1JEFAIu3Ns6GGYjGkqkQ==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
+  "@graphql-tools/stitch@10.1.10":
     resolution:
       {
-        integrity: sha512-BoIXy2zzjpm6mimqEduoKsgxE7SPhCPyXofFWlT9EpMV+cqgKiqxcXDrKDs2/DQHlSWTGyDj3xPWk07mmD9X4w==,
+        integrity: sha512-90sm5NvOLbymbYa81cvXkuZ7cZLLk2C1/VY8VCuFIbkVICYjY5T79cET5Nw8d5qX3LeojIF4SnK0xFYurhKxoA==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/stitching-directives@4.0.8":
+  "@graphql-tools/stitching-directives@4.0.12":
     resolution:
       {
-        integrity: sha512-RYgYHFGeYe5GDbyxIqcH7arOt30n2IjDIXpDUtDmqzotCoP8YKPDuDr23EtOJuRIUOYn8VblxfLChXCcnxYSTg==,
+        integrity: sha512-s0cXuj0hy+NrR73tm4QSMzDrWgKR+SZXBO2Glko6uK1wiJ7OlxM9PY3dfd/5LkN2h/lmuAquHrUwcnJMKpVV4w==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4264,10 +4620,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/url-loader@9.0.5":
+  "@graphql-tools/url-loader@9.0.6":
     resolution:
       {
-        integrity: sha512-EPNhZBBL48TudLdyenOw1wV9dI7vsinWLLxSTtkx4zUQxmU+p/LxMyf7MUwjmp3yFZhR/9XchsTZX6uvOyXWqA==,
+        integrity: sha512-QdJI3f7ANDMYfYazRgJzzybznjOrQAOuDXweC9xmKgPZoTqNxEAsatiy69zcpTf6092taJLyrqRH6R7xUTzf4A==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4291,6 +4647,15 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
+  "@graphql-tools/utils@11.0.0":
+    resolution:
+      {
+        integrity: sha512-bM1HeZdXA2C3LSIeLOnH/bcqSgbQgKEDrjxODjqi3y58xai2TkNrtYcQSoWzGbt9VMN1dORGjR7Vem8SPnUFQA==,
+      }
+    engines: { node: ">=16.0.0" }
+    peerDependencies:
+      graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+
   "@graphql-tools/utils@9.2.1":
     resolution:
       {
@@ -4308,10 +4673,10 @@ packages:
     peerDependencies:
       graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
 
-  "@graphql-tools/wrap@11.1.2":
+  "@graphql-tools/wrap@11.1.6":
     resolution:
       {
-        integrity: sha512-TcKZzUzJNmuyMBQ1oMdnxhBUUacN/5VEJu0/1KVce2aIzCwTTaN9JTU3MgjO7l5Ixn4QLkc6XbxYNv0cHDQgtQ==,
+        integrity: sha512-aamowNRone/LVeu2saKrl9bn7Svw1lKNPQMhy9+I1a4qt+2LhqysxcVGUJLo3/j71uv/C+4c3+bam78JyVf94w==,
       }
     engines: { node: ">=20.0.0" }
     peerDependencies:
@@ -4332,15 +4697,15 @@ packages:
       }
     engines: { node: ">=18.0.0" }
 
-  "@graphql-yoga/plugin-persisted-operations@3.15.1":
+  "@graphql-yoga/plugin-persisted-operations@3.18.0":
     resolution:
       {
-        integrity: sha512-a0zSxPskhCuQhomOwCRAjFih7Ez3UR/PG22L9qCgAv71IO0BMH1rQlJx48UMKl5lrRADn0yWs6joUgpyO8WMWw==,
+        integrity: sha512-1jizZvvW6+LyCZ7J9oxFg0PqNAphd+ltFVXZOdDB9qMr7qRxxBJ9Q6uU+m7KJZ3SoEobOddE2O/IKVcbx8FrIQ==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
       graphql: ^15.2.0 || ^16.0.0
-      graphql-yoga: ^5.15.1
+      graphql-yoga: ^5.18.0
 
   "@graphql-yoga/subscription@5.0.5":
     resolution:
@@ -4663,10 +5028,10 @@ packages:
       }
     engines: { node: 20 || >=22 }
 
-  "@isaacs/brace-expansion@5.0.0":
+  "@isaacs/brace-expansion@5.0.1":
     resolution:
       {
-        integrity: sha512-ZT55BDLV0yv0RBm2czMiZ+SqCGO7AvmOM3G/w2xhVPH+te0aKgFjmBvGlL1dH+ql2tgGO3MVrbb3jCKyvpgnxA==,
+        integrity: sha512-WMz71T1JS624nWj2n2fnYAuPovhv7EUhk69R6i9dsVyzxt5eM3bjwvgk9L+APE1TRscGysAVMANkB0jh0LQZrQ==,
       }
     engines: { node: 20 || >=22 }
 
@@ -5259,19 +5624,19 @@ packages:
       }
     engines: { node: ">=12.4.0" }
 
-  "@omnigraph/json-schema@0.109.18":
+  "@omnigraph/json-schema@0.109.24":
     resolution:
       {
-        integrity: sha512-J3MmcOe0bldFvWdal8WphxznmcpZsHdV/YncUDS38uW4GT8jUUcADWpUOXYRCUn8/ZLSpNhDFhO8Qo+C8+cUyQ==,
+        integrity: sha512-h16qz6nK3vI8pOGIWUNI9JRwbIV8H42SLgVzbpNmsMg2pD+GSQuOX/otr9eT/TwSOaLU7MBHpqJnZRUj3yny+A==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
       graphql: "*"
 
-  "@omnigraph/openapi@0.109.24":
+  "@omnigraph/openapi@0.109.30":
     resolution:
       {
-        integrity: sha512-ceDNoNs7lo7jZEWwxq58GMU3D7YaMykin+sEERyzmONldOZkC/1OqvU90WoeJ0vW+GEWTSwHQuQIzJoF2nUeig==,
+        integrity: sha512-i9DGNrgxXWCB+oRnMOZGUfhf1aIkDhqKheac9zQhANrBQg0j4SHg1XPxLV2+dp2hXJgqZMDxYhVRXadOtpG+HQ==,
       }
     engines: { node: ">=16.0.0" }
     peerDependencies:
@@ -5290,127 +5655,127 @@ packages:
         integrity: sha512-xSmezSupL+y9VkHZJGDoCBpmnB2ogM13ccaYDWqJTfS3dbuHkgjuwDFUmaFauBCboQMGB/S5UqUl2y54X99BmA==,
       }
 
-  "@parcel/watcher-android-arm64@2.5.1":
+  "@parcel/watcher-android-arm64@2.5.6":
     resolution:
       {
-        integrity: sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==,
+        integrity: sha512-YQxSS34tPF/6ZG7r/Ih9xy+kP/WwediEUsqmtf0cuCV5TPPKw/PQHRhueUo6JdeFJaqV3pyjm0GdYjZotbRt/A==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm64]
     os: [android]
 
-  "@parcel/watcher-darwin-arm64@2.5.1":
+  "@parcel/watcher-darwin-arm64@2.5.6":
     resolution:
       {
-        integrity: sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==,
+        integrity: sha512-Z2ZdrnwyXvvvdtRHLmM4knydIdU9adO3D4n/0cVipF3rRiwP+3/sfzpAwA/qKFL6i1ModaabkU7IbpeMBgiVEA==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm64]
     os: [darwin]
 
-  "@parcel/watcher-darwin-x64@2.5.1":
+  "@parcel/watcher-darwin-x64@2.5.6":
     resolution:
       {
-        integrity: sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==,
+        integrity: sha512-HgvOf3W9dhithcwOWX9uDZyn1lW9R+7tPZ4sug+NGrGIo4Rk1hAXLEbcH1TQSqxts0NYXXlOWqVpvS1SFS4fRg==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [x64]
     os: [darwin]
 
-  "@parcel/watcher-freebsd-x64@2.5.1":
+  "@parcel/watcher-freebsd-x64@2.5.6":
     resolution:
       {
-        integrity: sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==,
+        integrity: sha512-vJVi8yd/qzJxEKHkeemh7w3YAn6RJCtYlE4HPMoVnCpIXEzSrxErBW5SJBgKLbXU3WdIpkjBTeUNtyBVn8TRng==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [x64]
     os: [freebsd]
 
-  "@parcel/watcher-linux-arm-glibc@2.5.1":
+  "@parcel/watcher-linux-arm-glibc@2.5.6":
     resolution:
       {
-        integrity: sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==,
+        integrity: sha512-9JiYfB6h6BgV50CCfasfLf/uvOcJskMSwcdH1PHH9rvS1IrNy8zad6IUVPVUfmXr+u+Km9IxcfMLzgdOudz9EQ==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm]
     os: [linux]
 
-  "@parcel/watcher-linux-arm-musl@2.5.1":
+  "@parcel/watcher-linux-arm-musl@2.5.6":
     resolution:
       {
-        integrity: sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==,
+        integrity: sha512-Ve3gUCG57nuUUSyjBq/MAM0CzArtuIOxsBdQ+ftz6ho8n7s1i9E1Nmk/xmP323r2YL0SONs1EuwqBp2u1k5fxg==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm]
     os: [linux]
 
-  "@parcel/watcher-linux-arm64-glibc@2.5.1":
+  "@parcel/watcher-linux-arm64-glibc@2.5.6":
     resolution:
       {
-        integrity: sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==,
+        integrity: sha512-f2g/DT3NhGPdBmMWYoxixqYr3v/UXcmLOYy16Bx0TM20Tchduwr4EaCbmxh1321TABqPGDpS8D/ggOTaljijOA==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm64]
     os: [linux]
 
-  "@parcel/watcher-linux-arm64-musl@2.5.1":
+  "@parcel/watcher-linux-arm64-musl@2.5.6":
     resolution:
       {
-        integrity: sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==,
+        integrity: sha512-qb6naMDGlbCwdhLj6hgoVKJl2odL34z2sqkC7Z6kzir8b5W65WYDpLB6R06KabvZdgoHI/zxke4b3zR0wAbDTA==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm64]
     os: [linux]
 
-  "@parcel/watcher-linux-x64-glibc@2.5.1":
+  "@parcel/watcher-linux-x64-glibc@2.5.6":
     resolution:
       {
-        integrity: sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==,
+        integrity: sha512-kbT5wvNQlx7NaGjzPFu8nVIW1rWqV780O7ZtkjuWaPUgpv2NMFpjYERVi0UYj1msZNyCzGlaCWEtzc+exjMGbQ==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [x64]
     os: [linux]
 
-  "@parcel/watcher-linux-x64-musl@2.5.1":
+  "@parcel/watcher-linux-x64-musl@2.5.6":
     resolution:
       {
-        integrity: sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==,
+        integrity: sha512-1JRFeC+h7RdXwldHzTsmdtYR/Ku8SylLgTU/reMuqdVD7CtLwf0VR1FqeprZ0eHQkO0vqsbvFLXUmYm/uNKJBg==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [x64]
     os: [linux]
 
-  "@parcel/watcher-win32-arm64@2.5.1":
+  "@parcel/watcher-win32-arm64@2.5.6":
     resolution:
       {
-        integrity: sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==,
+        integrity: sha512-3ukyebjc6eGlw9yRt678DxVF7rjXatWiHvTXqphZLvo7aC5NdEgFufVwjFfY51ijYEWpXbqF5jtrK275z52D4Q==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [arm64]
     os: [win32]
 
-  "@parcel/watcher-win32-ia32@2.5.1":
+  "@parcel/watcher-win32-ia32@2.5.6":
     resolution:
       {
-        integrity: sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==,
+        integrity: sha512-k35yLp1ZMwwee3Ez/pxBi5cf4AoBKYXj00CZ80jUz5h8prpiaQsiRPKQMxoLstNuqe2vR4RNPEAEcjEFzhEz/g==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [ia32]
     os: [win32]
 
-  "@parcel/watcher-win32-x64@2.5.1":
+  "@parcel/watcher-win32-x64@2.5.6":
     resolution:
       {
-        integrity: sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==,
+        integrity: sha512-hbQlYcCq5dlAX9Qx+kFb0FHue6vbjlf0FrNzSKdYK2APUf7tGfGxQCk2ihEREmbR6ZMc0MVAD5RIX/41gpUzTw==,
       }
     engines: { node: ">= 10.0.0" }
     cpu: [x64]
     os: [win32]
 
-  "@parcel/watcher@2.5.1":
+  "@parcel/watcher@2.5.6":
     resolution:
       {
-        integrity: sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==,
+        integrity: sha512-tmmZ3lQxAe/k/+rNnXQRawJ4NjxO2hqiOLTHvWchtGZULp4RyFeh6aU4XdOYBFe2KE1oShQTv4AblOs2iOrNnQ==,
       }
     engines: { node: ">= 10.0.0" }
 
@@ -5980,10 +6345,10 @@ packages:
         integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==,
       }
 
-  "@rainbow-me/rainbowkit@2.2.9":
+  "@rainbow-me/rainbowkit@2.2.10":
     resolution:
       {
-        integrity: sha512-zXAeqkqpznpj9yEs1bTbpZbq0pVYKdJUnqqK/nI8xyYFDWchIOyBoEb/4+goT5RaHfGbDe9dp6pIEu/KelKE6A==,
+        integrity: sha512-8+E4die1A2ovN9t3lWxWnwqTGEdFqThXDQRj+E4eDKuUKyymYD+66Gzm6S9yfg8E95c6hmGlavGUfYPtl1EagA==,
       }
     engines: { node: ">=12.4" }
     peerDependencies:
@@ -6748,10 +7113,10 @@ packages:
         integrity: sha512-1VtCqX4AHWJlRRSYGSn+4X1mqolI1Tdq62IwzoU2vUuEE72S1OlEeGhpvd6XsdqXcfHmVzYfj8k1XtKBQqwo9w==,
       }
 
-  "@storybook/addon-designs@11.1.1":
+  "@storybook/addon-designs@11.1.2":
     resolution:
       {
-        integrity: sha512-1KAmTzoW/qw4RfR8uft3pBgsdWHoQiMp9rt+nzhFLEBPd1Ru3YiTnVL/JBEiJkGXsQfQxMnAYRRwYgf+HTr4yw==,
+        integrity: sha512-d9tOOJSNrUOshK0hvnDtR17uk/gfDAbs0DKGRaKe0VacUVLJkJEPor4OpxKKFG59qtSi4iU1FYyb668hfMdCdw==,
       }
     peerDependencies:
       "@storybook/addon-docs": ^10.0.0 || ^10.0.0-0 || ^10.1.0-0 || ^10.2.0-0
@@ -6766,24 +7131,24 @@ packages:
       react-dom:
         optional: true
 
-  "@storybook/addon-onboarding@10.2.0":
+  "@storybook/addon-onboarding@10.2.8":
     resolution:
       {
-        integrity: sha512-6JEgceYEEER9vVjmjiT1AKROMiwzZkSo+MN76wZMKayLX9fA8RIjrRGF3C5CNOVadbcbbvgPmwcLZMgD+0VZlg==,
+        integrity: sha512-/+TD055ZDmM325RYrDKqle51P1iT3GiFyDrcCYNOGTUEp3lAu/qplgOC0xMZudiv2y4ExlNYD26lJoGSTNHfHg==,
       }
     peerDependencies:
-      storybook: ^10.2.0
+      storybook: ^10.2.8
 
-  "@storybook/addon-vitest@10.2.0":
+  "@storybook/addon-vitest@10.2.8":
     resolution:
       {
-        integrity: sha512-MNGRhwC5pIEWfNbMxD6pQTqYWq8YwBdRsXkFX00rk3y88YV3w9zg/pHHk6v/+fGnrM9L/upwkIOvlaNMWn8uHg==,
+        integrity: sha512-D+9QWBqURAlS9+js9fvBToe7RzhIM9/ep/q8lunpVvcTkbOxh5++cYWBD8PVqmzZ+U432w9h2UwPuxPsWD/loQ==,
       }
     peerDependencies:
       "@vitest/browser": ^3.0.0 || ^4.0.0
       "@vitest/browser-playwright": ^4.0.0
       "@vitest/runner": ^3.0.0 || ^4.0.0
-      storybook: ^10.2.0
+      storybook: ^10.2.8
       vitest: ^3.0.0 || ^4.0.0
     peerDependenciesMeta:
       "@vitest/browser":
@@ -6795,25 +7160,25 @@ packages:
       vitest:
         optional: true
 
-  "@storybook/builder-webpack5@10.2.0":
+  "@storybook/builder-webpack5@10.2.8":
     resolution:
       {
-        integrity: sha512-p9pJRH5aq1uddy61iKksf0HLwK9AQyX8NFUdeKKCEtvLa94NPw4sMfJLyPrHZOmrrCC+H+DJJR5umqMlWff8sg==,
+        integrity: sha512-77i/is0a4HIRwkcxs3wQnQCnIahLONKxSp0cURjBU38kj/M0ukOOlOPIIJOm4HgI202yLjvGNiaMcLWFxHfl8w==,
       }
     peerDependencies:
-      storybook: ^10.2.0
+      storybook: ^10.2.8
       typescript: "*"
     peerDependenciesMeta:
       typescript:
         optional: true
 
-  "@storybook/core-webpack@10.2.0":
+  "@storybook/core-webpack@10.2.8":
     resolution:
       {
-        integrity: sha512-HGW9Y7kpgbkPtLsV1ALUCPXrBkcSpI0HGPsRuWqP3H3mQMHWxAFNLBRTd3+4egU+iOZQhj5mfePaWoTIwUY2Ag==,
+        integrity: sha512-TmKUbFVxDEoCybFC9Ps6gfcbZnKCc4DIclmIxEnkzKUuP0I6gh5w5Xd4Uf1hXroWIzZPNtm0SWsNOKycP+FQqQ==,
       }
     peerDependencies:
-      storybook: ^10.2.0
+      storybook: ^10.2.8
 
   "@storybook/global@5.0.0":
     resolution:
@@ -6830,16 +7195,16 @@ packages:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
 
-  "@storybook/nextjs@10.2.0":
+  "@storybook/nextjs@10.2.8":
     resolution:
       {
-        integrity: sha512-tm+2wg0qhq1iHEkf78Sgtgd8FterTKi7XgrATYzS6X1BgrkBOxWDVuXwHsaacf2okWUycK+JhzIPYroOiCzZZA==,
+        integrity: sha512-CZqHsNqMYbw9tK2pUfSzpc7VVBaeAticpw4lnxUANxW3nCTpX82wrQGj4bRWqZL3WfUMw8WfdAC4htJo5kLVBA==,
       }
     peerDependencies:
       next: ^14.1.0 || ^15.0.0 || ^16.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.2.0
+      storybook: ^10.2.8
       typescript: "*"
       webpack: ^5.0.0
     peerDependenciesMeta:
@@ -6848,15 +7213,15 @@ packages:
       webpack:
         optional: true
 
-  "@storybook/preset-react-webpack@10.2.0":
+  "@storybook/preset-react-webpack@10.2.8":
     resolution:
       {
-        integrity: sha512-qL6RUewOnSv6l5st0Pe0H4nY71fKj6qisJfm/1TIg/gBKqWSbE19BTcdYVkWRwn9sbWhNYyhz+TnS2rhTbMcTA==,
+        integrity: sha512-R+w1aT+NQ2eXHkPRpVnt/aBk5V5/L7+1EhFTnyQaEcviIanPlRURKhbOQi02gSGW/alekMLKtSvPTzow/VyvRA==,
       }
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.2.0
+      storybook: ^10.2.8
       typescript: "*"
     peerDependenciesMeta:
       typescript:
@@ -6871,25 +7236,25 @@ packages:
       typescript: ">= 4.x"
       webpack: ">= 4"
 
-  "@storybook/react-dom-shim@10.2.0":
+  "@storybook/react-dom-shim@10.2.8":
     resolution:
       {
-        integrity: sha512-PEQofiruE6dBGzUQPXZZREbuh1t62uRBWoUPRFNAZi79zddlk7+b9qu08VV9cvf68mwOqqT1+VJ1P+3ClD2ZVw==,
+        integrity: sha512-Xde9X3VszFV1pTXfc2ZFM89XOCGRxJD8MUIzDwkcT9xaki5a+8srs/fsXj75fMY6gMYfcL5lNRZvCqg37HOmcQ==,
       }
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.2.0
+      storybook: ^10.2.8
 
-  "@storybook/react@10.2.0":
+  "@storybook/react@10.2.8":
     resolution:
       {
-        integrity: sha512-ciJlh1UGm0GBXQgqrYFeLmiix+KGFB3v37OnAYjGghPS9OP6S99XyshxY/6p0sMOYtS+eWS2gPsOKNXNnLDGYw==,
+        integrity: sha512-nMFqQFUXq6Zg2O5SeuomyWnrIx61QfpNQMrfor8eCEzHrWNnXrrvVsz2RnHIgXN8RVyaWGDPh1srAECu/kDHXw==,
       }
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.2.0
+      storybook: ^10.2.8
       typescript: ">= 4.9.x"
     peerDependenciesMeta:
       typescript:
@@ -6907,97 +7272,97 @@ packages:
         integrity: sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==,
       }
 
-  "@tailwindcss/node@4.1.17":
+  "@tailwindcss/node@4.1.18":
     resolution:
       {
-        integrity: sha512-csIkHIgLb3JisEFQ0vxr2Y57GUNYh447C8xzwj89U/8fdW8LhProdxvnVH6U8M2Y73QKiTIH+LWbK3V2BBZsAg==,
+        integrity: sha512-DoR7U1P7iYhw16qJ49fgXUlry1t4CpXeErJHnQ44JgTSKMaZUdf17cfn5mHchfJ4KRBZRFA/Coo+MUF5+gOaCQ==,
       }
 
-  "@tailwindcss/oxide-android-arm64@4.1.17":
+  "@tailwindcss/oxide-android-arm64@4.1.18":
     resolution:
       {
-        integrity: sha512-BMqpkJHgOZ5z78qqiGE6ZIRExyaHyuxjgrJ6eBO5+hfrfGkuya0lYfw8fRHG77gdTjWkNWEEm+qeG2cDMxArLQ==,
+        integrity: sha512-dJHz7+Ugr9U/diKJA0W6N/6/cjI+ZTAoxPf9Iz9BFRF2GzEX8IvXxFIi/dZBloVJX/MZGvRuFA9rqwdiIEZQ0Q==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
     os: [android]
 
-  "@tailwindcss/oxide-darwin-arm64@4.1.17":
+  "@tailwindcss/oxide-darwin-arm64@4.1.18":
     resolution:
       {
-        integrity: sha512-EquyumkQweUBNk1zGEU/wfZo2qkp/nQKRZM8bUYO0J+Lums5+wl2CcG1f9BgAjn/u9pJzdYddHWBiFXJTcxmOg==,
+        integrity: sha512-Gc2q4Qhs660bhjyBSKgq6BYvwDz4G+BuyJ5H1xfhmDR3D8HnHCmT/BSkvSL0vQLy/nkMLY20PQ2OoYMO15Jd0A==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
     os: [darwin]
 
-  "@tailwindcss/oxide-darwin-x64@4.1.17":
+  "@tailwindcss/oxide-darwin-x64@4.1.18":
     resolution:
       {
-        integrity: sha512-gdhEPLzke2Pog8s12oADwYu0IAw04Y2tlmgVzIN0+046ytcgx8uZmCzEg4VcQh+AHKiS7xaL8kGo/QTiNEGRog==,
+        integrity: sha512-FL5oxr2xQsFrc3X9o1fjHKBYBMD1QZNyc1Xzw/h5Qu4XnEBi3dZn96HcHm41c/euGV+GRiXFfh2hUCyKi/e+yw==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
     os: [darwin]
 
-  "@tailwindcss/oxide-freebsd-x64@4.1.17":
+  "@tailwindcss/oxide-freebsd-x64@4.1.18":
     resolution:
       {
-        integrity: sha512-hxGS81KskMxML9DXsaXT1H0DyA+ZBIbyG/sSAjWNe2EDl7TkPOBI42GBV3u38itzGUOmFfCzk1iAjDXds8Oh0g==,
+        integrity: sha512-Fj+RHgu5bDodmV1dM9yAxlfJwkkWvLiRjbhuO2LEtwtlYlBgiAT4x/j5wQr1tC3SANAgD+0YcmWVrj8R9trVMA==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
     os: [freebsd]
 
-  "@tailwindcss/oxide-linux-arm-gnueabihf@4.1.17":
+  "@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18":
     resolution:
       {
-        integrity: sha512-k7jWk5E3ldAdw0cNglhjSgv501u7yrMf8oeZ0cElhxU6Y2o7f8yqelOp3fhf7evjIS6ujTI3U8pKUXV2I4iXHQ==,
+        integrity: sha512-Fp+Wzk/Ws4dZn+LV2Nqx3IilnhH51YZoRaYHQsVq3RQvEl+71VGKFpkfHrLM/Li+kt5c0DJe/bHXK1eHgDmdiA==,
       }
     engines: { node: ">= 10" }
     cpu: [arm]
     os: [linux]
 
-  "@tailwindcss/oxide-linux-arm64-gnu@4.1.17":
+  "@tailwindcss/oxide-linux-arm64-gnu@4.1.18":
     resolution:
       {
-        integrity: sha512-HVDOm/mxK6+TbARwdW17WrgDYEGzmoYayrCgmLEw7FxTPLcp/glBisuyWkFz/jb7ZfiAXAXUACfyItn+nTgsdQ==,
+        integrity: sha512-S0n3jboLysNbh55Vrt7pk9wgpyTTPD0fdQeh7wQfMqLPM/Hrxi+dVsLsPrycQjGKEQk85Kgbx+6+QnYNiHalnw==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
     os: [linux]
 
-  "@tailwindcss/oxide-linux-arm64-musl@4.1.17":
+  "@tailwindcss/oxide-linux-arm64-musl@4.1.18":
     resolution:
       {
-        integrity: sha512-HvZLfGr42i5anKtIeQzxdkw/wPqIbpeZqe7vd3V9vI3RQxe3xU1fLjss0TjyhxWcBaipk7NYwSrwTwK1hJARMg==,
+        integrity: sha512-1px92582HkPQlaaCkdRcio71p8bc8i/ap5807tPRDK/uw953cauQBT8c5tVGkOwrHMfc2Yh6UuxaH4vtTjGvHg==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
     os: [linux]
 
-  "@tailwindcss/oxide-linux-x64-gnu@4.1.17":
+  "@tailwindcss/oxide-linux-x64-gnu@4.1.18":
     resolution:
       {
-        integrity: sha512-M3XZuORCGB7VPOEDH+nzpJ21XPvK5PyjlkSFkFziNHGLc5d6g3di2McAAblmaSUNl8IOmzYwLx9NsE7bplNkwQ==,
+        integrity: sha512-v3gyT0ivkfBLoZGF9LyHmts0Isc8jHZyVcbzio6Wpzifg/+5ZJpDiRiUhDLkcr7f/r38SWNe7ucxmGW3j3Kb/g==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
     os: [linux]
 
-  "@tailwindcss/oxide-linux-x64-musl@4.1.17":
+  "@tailwindcss/oxide-linux-x64-musl@4.1.18":
     resolution:
       {
-        integrity: sha512-k7f+pf9eXLEey4pBlw+8dgfJHY4PZ5qOUFDyNf7SI6lHjQ9Zt7+NcscjpwdCEbYi6FI5c2KDTDWyf2iHcCSyyQ==,
+        integrity: sha512-bhJ2y2OQNlcRwwgOAGMY0xTFStt4/wyU6pvI6LSuZpRgKQwxTec0/3Scu91O8ir7qCR3AuepQKLU/kX99FouqQ==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
     os: [linux]
 
-  "@tailwindcss/oxide-wasm32-wasi@4.1.17":
+  "@tailwindcss/oxide-wasm32-wasi@4.1.18":
     resolution:
       {
-        integrity: sha512-cEytGqSSoy7zK4JRWiTCx43FsKP/zGr0CsuMawhH67ONlH+T79VteQeJQRO/X7L0juEUA8ZyuYikcRBf0vsxhg==,
+        integrity: sha512-LffYTvPjODiP6PT16oNeUQJzNVyJl1cjIebq/rWWBF+3eDst5JGEFSc5cWxyRCJ0Mxl+KyIkqRxk1XPEs9x8TA==,
       }
     engines: { node: ">=14.0.0" }
     cpu: [wasm32]
@@ -7009,47 +7374,47 @@ packages:
       - "@emnapi/wasi-threads"
       - tslib
 
-  "@tailwindcss/oxide-win32-arm64-msvc@4.1.17":
+  "@tailwindcss/oxide-win32-arm64-msvc@4.1.18":
     resolution:
       {
-        integrity: sha512-JU5AHr7gKbZlOGvMdb4722/0aYbU+tN6lv1kONx0JK2cGsh7g148zVWLM0IKR3NeKLv+L90chBVYcJ8uJWbC9A==,
+        integrity: sha512-HjSA7mr9HmC8fu6bdsZvZ+dhjyGCLdotjVOgLA2vEqxEBZaQo9YTX4kwgEvPCpRh8o4uWc4J/wEoFzhEmjvPbA==,
       }
     engines: { node: ">= 10" }
     cpu: [arm64]
     os: [win32]
 
-  "@tailwindcss/oxide-win32-x64-msvc@4.1.17":
+  "@tailwindcss/oxide-win32-x64-msvc@4.1.18":
     resolution:
       {
-        integrity: sha512-SKWM4waLuqx0IH+FMDUw6R66Hu4OuTALFgnleKbqhgGU30DY20NORZMZUKgLRjQXNN2TLzKvh48QXTig4h4bGw==,
+        integrity: sha512-bJWbyYpUlqamC8dpR7pfjA0I7vdF6t5VpUGMWRkXVE3AXgIZjYUYAK7II1GNaxR8J1SSrSrppRar8G++JekE3Q==,
       }
     engines: { node: ">= 10" }
     cpu: [x64]
     os: [win32]
 
-  "@tailwindcss/oxide@4.1.17":
+  "@tailwindcss/oxide@4.1.18":
     resolution:
       {
-        integrity: sha512-F0F7d01fmkQhsTjXezGBLdrl1KresJTcI3DB8EkScCldyKp3Msz4hub4uyYaVnk88BAS1g5DQjjF6F5qczheLA==,
+        integrity: sha512-EgCR5tTS5bUSKQgzeMClT6iCY3ToqE1y+ZB0AKldj809QXk1Y+3jB0upOYZrn9aGIzPtUsP7sX4QQ4XtjBB95A==,
       }
     engines: { node: ">= 10" }
 
-  "@tailwindcss/postcss@4.1.17":
+  "@tailwindcss/postcss@4.1.18":
     resolution:
       {
-        integrity: sha512-+nKl9N9mN5uJ+M7dBOOCzINw94MPstNR/GtIhz1fpZysxL/4a+No64jCBD6CPN+bIHWFx3KWuu8XJRrj/572Dw==,
+        integrity: sha512-Ce0GFnzAOuPyfV5SxjXGn0CubwGcuDB0zcdaPuCSzAa/2vII24JTkH+I6jcbXLb1ctjZMZZI6OjDaLPJQL1S0g==,
       }
 
-  "@tanstack/query-core@5.90.11":
+  "@tanstack/query-core@5.90.20":
     resolution:
       {
-        integrity: sha512-f9z/nXhCgWDF4lHqgIE30jxLe4sYv15QodfdPDKYAk7nAEjNcndy4dHz3ezhdUaR23BpWa4I2EH4/DZ0//Uf8A==,
+        integrity: sha512-OMD2HLpNouXEfZJWcKeVKUgQ5n+n3A2JFmBaScpNDUqSrQSjiveC7dKMe53uJUg1nDG16ttFPz2xfilz6i2uVg==,
       }
 
-  "@tanstack/react-query@5.90.11":
+  "@tanstack/react-query@5.90.21":
     resolution:
       {
-        integrity: sha512-3uyzz01D1fkTLXuxF3JfoJoHQMU2fxsfJwE+6N5hHy0dVNoZOvwKP8Z2k7k1KDeD54N20apcJnG75TBAStIrBA==,
+        integrity: sha512-0Lu6y5t+tvlTJMTO7oh5NSpJfpg/5D41LlThfepTixPYkJ0sE2Jj0m0f6yYqujBwIXlId87e234+MxG3D3g7kg==,
       }
     peerDependencies:
       react: ^18 || ^19
@@ -7103,10 +7468,10 @@ packages:
     peerDependencies:
       graphql: ^16.0.0
 
-  "@theguild/federation-composition@0.20.2":
+  "@theguild/federation-composition@0.21.3":
     resolution:
       {
-        integrity: sha512-QI4iSdrc4JvCWnMb1QbiHnEpdD33KGdiU66qfWOcM8ENebRGHkGjXDnUrVJ8F9g1dmCRMTNfn2NFGqTcDpeYXw==,
+        integrity: sha512-+LlHTa4UbRpZBog3ggAxjYIFvdfH3UMvvBUptur19TMWkqU4+n3GmN+mDjejU+dyBXIG27c25RsiQP1HyvM99g==,
       }
     engines: { node: ">=18" }
     peerDependencies:
@@ -7334,10 +7699,10 @@ packages:
         integrity: sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==,
       }
 
-  "@types/lodash@4.17.21":
+  "@types/lodash@4.17.23":
     resolution:
       {
-        integrity: sha512-FOvQ0YPD5NOfPgMzJihoT+Za5pdkDJWcbpuj1DjaKZIr/gxodQjY/uWEFlTNqW2ugXHUiL8lRQgw63dzKHZdeQ==,
+        integrity: sha512-RDvF6wTulMPjrNdCoYRC8gNR880JNGT8uB+REUpC2Ns4pRqQJhGz90wh7rgdXDPpCczF3VGktDuFGVnz8zP7HA==,
       }
 
   "@types/ms@2.1.0":
@@ -7352,10 +7717,10 @@ packages:
         integrity: sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==,
       }
 
-  "@types/node@20.19.25":
+  "@types/node@20.19.33":
     resolution:
       {
-        integrity: sha512-ZsJzA5thDQMSQO788d7IocwwQbI8B5OPzmqNvpf3NY/+MHDAS759Wo0gd2WQeXYt5AAAQjzcrTVC6SKCuYgoCQ==,
+        integrity: sha512-Rs1bVAIdBs5gbTIKza/tgpMuG1k3U/UMJLWecIMxNdJFDMzcM5LOiLVRYh3PilWEYDIeUDv7bpiHPLPsbydGcw==,
       }
 
   "@types/node@22.7.5":
@@ -7364,10 +7729,16 @@ packages:
         integrity: sha512-jML7s2NAzMWc//QSJ1a3prpk78cOPchGvXJsC3C6R6PSMoooztvRVQEz89gmBTBY1SPMaqo5teB4uNHPdetShQ==,
       }
 
-  "@types/pg@8.15.6":
+  "@types/node@25.2.3":
     resolution:
       {
-        integrity: sha512-NoaMtzhxOrubeL/7UZuNTrejB4MPAJ0RpxZqXQf2qXuVlTPuG6Y8p4u9dKRaue4yjmC7ZhzVO2/Yyyn25znrPQ==,
+        integrity: sha512-m0jEgYlYz+mDJZ2+F4v8D1AyQb+QzsNqRuI7xg1VQX/KlKS0qT9r1Mo16yo5F/MtifXFgaofIFsdFMox2SxIbQ==,
+      }
+
+  "@types/pg@8.16.0":
+    resolution:
+      {
+        integrity: sha512-RmhMd/wD+CF8Dfo+cVIy3RR5cl8CyfXQ0tGgW6XBL8L4LM/UTEbNXYRbLwU6w+CgrKBNbrQWt4FUtTfaU5jSYQ==,
       }
 
   "@types/react-blockies@1.4.4":
@@ -7461,6 +7832,17 @@ packages:
       eslint: ^8.57.0 || ^9.0.0
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/eslint-plugin@8.55.0":
+    resolution:
+      {
+        integrity: sha512-1y/MVSz0NglV1ijHC8OT49mPJ4qhPYjiK08YUQVbIOyu+5k862LKUHFkpKHWu//zmr7hDR2rhwUm6gnCGNmGBQ==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      "@typescript-eslint/parser": ^8.55.0
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/parser@8.53.0":
     resolution:
       {
@@ -7471,6 +7853,16 @@ packages:
       eslint: ^8.57.0 || ^9.0.0
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/parser@8.55.0":
+    resolution:
+      {
+        integrity: sha512-4z2nCSBfVIMnbuu8uinj+f0o4qOeggYJLbjpPHka3KH1om7e+H9yLKTYgksTaHcGco+NClhhY2vyO3HsMH1RGw==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/project-service@8.53.0":
     resolution:
       {
@@ -7480,6 +7872,15 @@ packages:
     peerDependencies:
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/project-service@8.55.0":
+    resolution:
+      {
+        integrity: sha512-zRcVVPFUYWa3kNnjaZGXSu3xkKV1zXy8M4nO/pElzQhFweb7PPtluDLQtKArEOGmjXoRjnUZ29NjOiF0eCDkcQ==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/scope-manager@8.53.0":
     resolution:
       {
@@ -7487,6 +7888,13 @@ packages:
       }
     engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
 
+  "@typescript-eslint/scope-manager@8.55.0":
+    resolution:
+      {
+        integrity: sha512-fVu5Omrd3jeqeQLiB9f1YsuK/iHFOwb04bCtY4BSCLgjNbOD33ZdV6KyEqplHr+IlpgT0QTZ/iJ+wT7hvTx49Q==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+
   "@typescript-eslint/tsconfig-utils@8.53.0":
     resolution:
       {
@@ -7496,6 +7904,15 @@ packages:
     peerDependencies:
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/tsconfig-utils@8.55.0":
+    resolution:
+      {
+        integrity: sha512-1R9cXqY7RQd7WuqSN47PK9EDpgFUK3VqdmbYrvWJZYDd0cavROGn+74ktWBlmJ13NXUQKlZ/iAEQHI/V0kKe0Q==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/type-utils@8.53.0":
     resolution:
       {
@@ -7506,6 +7923,16 @@ packages:
       eslint: ^8.57.0 || ^9.0.0
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/type-utils@8.55.0":
+    resolution:
+      {
+        integrity: sha512-x1iH2unH4qAt6I37I2CGlsNs+B9WGxurP2uyZLRz6UJoZWDBx9cJL1xVN/FiOmHEONEg6RIufdvyT0TEYIgC5g==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/types@8.53.0":
     resolution:
       {
@@ -7513,6 +7940,13 @@ packages:
       }
     engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
 
+  "@typescript-eslint/types@8.55.0":
+    resolution:
+      {
+        integrity: sha512-ujT0Je8GI5BJWi+/mMoR0wxwVEQaxM+pi30xuMiJETlX80OPovb2p9E8ss87gnSVtYXtJoU9U1Cowcr6w2FE0w==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+
   "@typescript-eslint/typescript-estree@8.53.0":
     resolution:
       {
@@ -7522,6 +7956,15 @@ packages:
     peerDependencies:
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/typescript-estree@8.55.0":
+    resolution:
+      {
+        integrity: sha512-EwrH67bSWdx/3aRQhCoxDaHM+CrZjotc2UCCpEDVqfCE+7OjKAGWNY2HsCSTEVvWH2clYQK8pdeLp42EVs+xQw==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/utils@8.53.0":
     resolution:
       {
@@ -7532,6 +7975,16 @@ packages:
       eslint: ^8.57.0 || ^9.0.0
       typescript: ">=4.8.4 <6.0.0"
 
+  "@typescript-eslint/utils@8.55.0":
+    resolution:
+      {
+        integrity: sha512-BqZEsnPGdYpgyEIkDC1BadNY8oMwckftxBT+C8W0g1iKPdeqKZBtTfnvcq0nf60u7MkjFO8RBvpRGZBPw4L2ow==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+    peerDependencies:
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: ">=4.8.4 <6.0.0"
+
   "@typescript-eslint/visitor-keys@8.53.0":
     resolution:
       {
@@ -7539,6 +7992,13 @@ packages:
       }
     engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
 
+  "@typescript-eslint/visitor-keys@8.55.0":
+    resolution:
+      {
+        integrity: sha512-AxNRwEie8Nn4eFS1FzDMJWIISMGoXMb037sgCBJ3UR6o0fQTzr2tqN9WT+DkWJPhIdQCfV7T6D387566VtnCJA==,
+      }
+    engines: { node: ^18.18.0 || ^20.9.0 || >=21.1.0 }
+
   "@ungap/structured-clone@1.3.0":
     resolution:
       {
@@ -7723,6 +8183,18 @@ packages:
     peerDependencies:
       "@vanilla-extract/css": ^1.0.0
 
+  "@vitest/coverage-v8@3.2.4":
+    resolution:
+      {
+        integrity: sha512-EyF9SXU6kS5Ku/U82E259WSnvg6c8KTjppUncuNdm5QHpe17mwREHnjDzozC8x9MZ0xfBUFSaLkRv4TMA75ALQ==,
+      }
+    peerDependencies:
+      "@vitest/browser": 3.2.4
+      vitest: 3.2.4
+    peerDependenciesMeta:
+      "@vitest/browser":
+        optional: true
+
   "@vitest/expect@3.2.4":
     resolution:
       {
@@ -8114,13 +8586,6 @@ packages:
       }
     engines: { node: ">=16.0.0" }
 
-  "@whatwg-node/server@0.10.10":
-    resolution:
-      {
-        integrity: sha512-GwpdMgUmwIp0jGjP535YtViP/nnmETAyHpGPWPZKdX++Qht/tSLbGXgFUMSsQvEACmZAR1lAPNu2CnYL1HpBgg==,
-      }
-    engines: { node: ">=18.0.0" }
-
   "@whatwg-node/server@0.10.18":
     resolution:
       {
@@ -8224,24 +8689,10 @@ packages:
       zod:
         optional: true
 
-  abitype@1.1.0:
-    resolution:
-      {
-        integrity: sha512-6Vh4HcRxNMLA0puzPjM5GBgT4aAcFGKZzSgAXvuZ27shJP6NEpielTuqbBmZILR5/xd0PizkBGy5hReKz9jl5A==,
-      }
-    peerDependencies:
-      typescript: ">=5.0.4"
-      zod: ^3.22.0 || ^4.0.0
-    peerDependenciesMeta:
-      typescript:
-        optional: true
-      zod:
-        optional: true
-
-  abitype@1.2.1:
+  abitype@1.2.3:
     resolution:
       {
-        integrity: sha512-AhkAWBE5QqzSuaPi6B9w5scl5739iBknQdFFAbY/CybASOBVWtVmPavUYW1OrDRX/iZWB/Je80xhJMZz2G4G1Q==,
+        integrity: sha512-Ofer5QUnuUdTFsBRwARMoWKOH1ND5ehwYhJ3OJ/BQO+StkwQjHw0XyVh4vDttzHB7QOFhPHa/o413PJ82gU/Tg==,
       }
     peerDependencies:
       typescript: ">=5.0.4"
@@ -8625,6 +9076,12 @@ packages:
       }
     engines: { node: ">=4" }
 
+  ast-v8-to-istanbul@0.3.11:
+    resolution:
+      {
+        integrity: sha512-Qya9fkoofMjCBNVdWINMjB5KZvkYfaO9/anwkWnjxibpWUxo5iHl2sOdP7/uAqaRuUYuoo8rDwnbaaKVFxoUvw==,
+      }
+
   astral-regex@2.0.0:
     resolution:
       {
@@ -8693,10 +9150,10 @@ packages:
     peerDependencies:
       axios: 0.x || 1.x
 
-  axios@1.13.2:
+  axios@1.13.5:
     resolution:
       {
-        integrity: sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==,
+        integrity: sha512-cz4ur7Vb0xS4/KUN0tPWe44eqxrIu31me+fbang3ijiNscE129POzipJJA6zniq2C/Z6sJCjMimjS8Lc/GAs8Q==,
       }
 
   axobject-query@4.1.0:
@@ -9400,6 +9857,13 @@ packages:
       }
     engines: { node: ">=20" }
 
+  commander@14.0.3:
+    resolution:
+      {
+        integrity: sha512-H+y0Jo/T1RZ9qPP4Eh1pkcQcLRglraJaSLoyOtHxu6AapkjWVCy2Sit1QQ4x3Dng8qDlSsZEet7g5Pq06MvTgw==,
+      }
+    engines: { node: ">=20" }
+
   commander@2.20.3:
     resolution:
       {
@@ -9703,10 +10167,10 @@ packages:
       webpack:
         optional: true
 
-  css-loader@7.1.2:
+  css-loader@7.1.3:
     resolution:
       {
-        integrity: sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==,
+        integrity: sha512-frbERmjT0UC5lMheWpJmMilnt9GEhbZJN/heUb7/zaJYeIzj5St9HvDcfshzzOqbsS+rYpMk++2SD3vGETDSyA==,
       }
     engines: { node: ">= 18.12.0" }
     peerDependencies:
@@ -9907,12 +10371,6 @@ packages:
         integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==,
       }
 
-  dayjs@1.11.18:
-    resolution:
-      {
-        integrity: sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==,
-      }
-
   dayjs@1.11.19:
     resolution:
       {
@@ -10157,14 +10615,6 @@ packages:
       }
     engines: { node: ">=8" }
 
-  detect-libc@1.0.3:
-    resolution:
-      {
-        integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==,
-      }
-    engines: { node: ">=0.10" }
-    hasBin: true
-
   detect-libc@2.1.2:
     resolution:
       {
@@ -10336,17 +10786,17 @@ packages:
       }
     engines: { node: ">=12" }
 
-  dotenv@17.2.3:
+  dotenv@17.2.4:
     resolution:
       {
-        integrity: sha512-JVUnt+DUIzu87TABbhPmNfVdBDt18BLOWjMUFJMSi/Qqg7NTYtabbvSNJGOJ7afbRuv9D/lngizHtP7QyLQ+9w==,
+        integrity: sha512-mudtfb4zRB4bVvdj0xRo+e6duH1csJRM8IukBqfTRvHotn9+LBXB8ynAidP9zHqoRC/fsllXgk4kCKlR21fIhw==,
       }
     engines: { node: ">=12" }
 
-  drizzle-kit@0.31.7:
+  drizzle-kit@0.31.9:
     resolution:
       {
-        integrity: sha512-hOzRGSdyKIU4FcTSFYGKdXEjFsncVwHZ43gY3WU5Bz9j5Iadp6Rh6hxLSQ1IWXpKLBKt/d5y1cpSPcV+FcoQ1A==,
+        integrity: sha512-GViD3IgsXn7trFyBUUHyTFBpH/FsHTxYJ66qdbVggxef4UBPHRYxQaRzYLTuekYnk9i5FIEL9pbBIwMqX/Uwrg==,
       }
     hasBin: true
 
@@ -10442,68 +10892,163 @@ packages:
       sqlite3:
         optional: true
 
-  dset@3.1.4:
-    resolution:
-      {
-        integrity: sha512-2QF/g9/zTaPDc3BjNcVTGoBbXBgYfMTTceLaYcFJ/W9kggFUkhxD/hMEeuLKbugyef9SqAx8cpgwlIP/jinUTA==,
-      }
-    engines: { node: ">=4" }
-
-  dunder-proto@1.0.1:
-    resolution:
-      {
-        integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==,
-      }
-    engines: { node: ">= 0.4" }
-
-  duplexify@4.1.3:
-    resolution:
-      {
-        integrity: sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==,
-      }
-
-  eastasianwidth@0.2.0:
-    resolution:
-      {
-        integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==,
-      }
-
-  eciesjs@0.4.16:
-    resolution:
-      {
-        integrity: sha512-dS5cbA9rA2VR4Ybuvhg6jvdmp46ubLn3E+px8cG/35aEDNclrqoCjg6mt0HYZ/M+OoESS3jSkCrqk1kWAEhWAw==,
-      }
-    engines: { bun: ">=1", deno: ">=2", node: ">=16" }
-
-  electron-to-chromium@1.5.189:
-    resolution:
-      {
-        integrity: sha512-y9D1ntS1ruO/pZ/V2FtLE+JXLQe28XoRpZ7QCCo0T8LdQladzdcOVQZH/IWLVJvCw12OGMb6hYOeOAjntCmJRQ==,
-      }
-
-  electron-to-chromium@1.5.264:
-    resolution:
-      {
-        integrity: sha512-1tEf0nLgltC3iy9wtlYDlQDc5Rg9lEKVjEmIHJ21rI9OcqkvD45K1oyNIRA4rR1z3LgJ7KeGzEBojVcV6m4qjA==,
-      }
-
-  elliptic@6.6.1:
-    resolution:
-      {
-        integrity: sha512-RaddvvMatK2LJHqFJ+YA4WysVN5Ita9E35botqIYspQ4TkRAlCicdzKOjlyv/1Za5RyTNn7di//eEV0uTAfe3g==,
-      }
-
-  emittery@0.13.1:
+  drizzle-orm@0.45.1:
     resolution:
       {
-        integrity: sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==,
+        integrity: sha512-Te0FOdKIistGNPMq2jscdqngBRfBpC8uMFVwqjf6gtTVJHIQ/dosgV/CLBU2N4ZJBsXL5savCba9b0YJskKdcA==,
       }
-    engines: { node: ">=12" }
-
-  emoji-regex@10.6.0:
-    resolution:
-      {
-        integrity: sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==,
+    peerDependencies:
+      "@aws-sdk/client-rds-data": ">=3"
+      "@cloudflare/workers-types": ">=4"
+      "@electric-sql/pglite": ">=0.2.0"
+      "@libsql/client": ">=0.10.0"
+      "@libsql/client-wasm": ">=0.10.0"
+      "@neondatabase/serverless": ">=0.10.0"
+      "@op-engineering/op-sqlite": ">=2"
+      "@opentelemetry/api": ^1.4.1
+      "@planetscale/database": ">=1.13"
+      "@prisma/client": "*"
+      "@tidbcloud/serverless": "*"
+      "@types/better-sqlite3": "*"
+      "@types/pg": "*"
+      "@types/sql.js": "*"
+      "@upstash/redis": ">=1.34.7"
+      "@vercel/postgres": ">=0.8.0"
+      "@xata.io/client": "*"
+      better-sqlite3: ">=7"
+      bun-types: "*"
+      expo-sqlite: ">=14.0.0"
+      gel: ">=2"
+      knex: "*"
+      kysely: "*"
+      mysql2: ">=2"
+      pg: ">=8"
+      postgres: ">=3"
+      prisma: "*"
+      sql.js: ">=1"
+      sqlite3: ">=5"
+    peerDependenciesMeta:
+      "@aws-sdk/client-rds-data":
+        optional: true
+      "@cloudflare/workers-types":
+        optional: true
+      "@electric-sql/pglite":
+        optional: true
+      "@libsql/client":
+        optional: true
+      "@libsql/client-wasm":
+        optional: true
+      "@neondatabase/serverless":
+        optional: true
+      "@op-engineering/op-sqlite":
+        optional: true
+      "@opentelemetry/api":
+        optional: true
+      "@planetscale/database":
+        optional: true
+      "@prisma/client":
+        optional: true
+      "@tidbcloud/serverless":
+        optional: true
+      "@types/better-sqlite3":
+        optional: true
+      "@types/pg":
+        optional: true
+      "@types/sql.js":
+        optional: true
+      "@upstash/redis":
+        optional: true
+      "@vercel/postgres":
+        optional: true
+      "@xata.io/client":
+        optional: true
+      better-sqlite3:
+        optional: true
+      bun-types:
+        optional: true
+      expo-sqlite:
+        optional: true
+      gel:
+        optional: true
+      knex:
+        optional: true
+      kysely:
+        optional: true
+      mysql2:
+        optional: true
+      pg:
+        optional: true
+      postgres:
+        optional: true
+      prisma:
+        optional: true
+      sql.js:
+        optional: true
+      sqlite3:
+        optional: true
+
+  dset@3.1.4:
+    resolution:
+      {
+        integrity: sha512-2QF/g9/zTaPDc3BjNcVTGoBbXBgYfMTTceLaYcFJ/W9kggFUkhxD/hMEeuLKbugyef9SqAx8cpgwlIP/jinUTA==,
+      }
+    engines: { node: ">=4" }
+
+  dunder-proto@1.0.1:
+    resolution:
+      {
+        integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==,
+      }
+    engines: { node: ">= 0.4" }
+
+  duplexify@4.1.3:
+    resolution:
+      {
+        integrity: sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==,
+      }
+
+  eastasianwidth@0.2.0:
+    resolution:
+      {
+        integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==,
+      }
+
+  eciesjs@0.4.16:
+    resolution:
+      {
+        integrity: sha512-dS5cbA9rA2VR4Ybuvhg6jvdmp46ubLn3E+px8cG/35aEDNclrqoCjg6mt0HYZ/M+OoESS3jSkCrqk1kWAEhWAw==,
+      }
+    engines: { bun: ">=1", deno: ">=2", node: ">=16" }
+
+  electron-to-chromium@1.5.189:
+    resolution:
+      {
+        integrity: sha512-y9D1ntS1ruO/pZ/V2FtLE+JXLQe28XoRpZ7QCCo0T8LdQladzdcOVQZH/IWLVJvCw12OGMb6hYOeOAjntCmJRQ==,
+      }
+
+  electron-to-chromium@1.5.264:
+    resolution:
+      {
+        integrity: sha512-1tEf0nLgltC3iy9wtlYDlQDc5Rg9lEKVjEmIHJ21rI9OcqkvD45K1oyNIRA4rR1z3LgJ7KeGzEBojVcV6m4qjA==,
+      }
+
+  elliptic@6.6.1:
+    resolution:
+      {
+        integrity: sha512-RaddvvMatK2LJHqFJ+YA4WysVN5Ita9E35botqIYspQ4TkRAlCicdzKOjlyv/1Za5RyTNn7di//eEV0uTAfe3g==,
+      }
+
+  emittery@0.13.1:
+    resolution:
+      {
+        integrity: sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==,
+      }
+    engines: { node: ">=12" }
+
+  emoji-regex@10.6.0:
+    resolution:
+      {
+        integrity: sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==,
       }
 
   emoji-regex@8.0.0:
@@ -10563,6 +11108,13 @@ packages:
       }
     engines: { node: ">=10.13.0" }
 
+  enhanced-resolve@5.19.0:
+    resolution:
+      {
+        integrity: sha512-phv3E1Xl4tQOShqSte26C7Fl84EwUdZsyOuSSk9qtAGyyQs2s3jJzComh+Abf4g187lUUAvH+H26omrqia2aGg==,
+      }
+    engines: { node: ">=10.13.0" }
+
   entities@2.2.0:
     resolution:
       {
@@ -10636,6 +11188,12 @@ packages:
         integrity: sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==,
       }
 
+  es-module-lexer@2.0.0:
+    resolution:
+      {
+        integrity: sha512-5POEcUuZybH7IdmGsD8wlf0AI55wMecM9rVBTI/qEAy2c1kTOm3DjFYjrBdI2K3BaJjJYfYFeRtM0t9ssnRuxw==,
+      }
+
   es-object-atoms@1.1.1:
     resolution:
       {
@@ -10706,6 +11264,14 @@ packages:
     engines: { node: ">=12" }
     hasBin: true
 
+  esbuild@0.25.12:
+    resolution:
+      {
+        integrity: sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==,
+      }
+    engines: { node: ">=18" }
+    hasBin: true
+
   esbuild@0.25.8:
     resolution:
       {
@@ -10849,10 +11415,10 @@ packages:
     peerDependencies:
       eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9
 
-  eslint-plugin-prettier@5.5.4:
+  eslint-plugin-prettier@5.5.5:
     resolution:
       {
-        integrity: sha512-swNtI95SToIz05YINMA6Ox5R057IMAmWZ26GqPxusAp1TZzj+IdY9tXNWWD3vkF/wEqydCONcwjTFpxybBqZsg==,
+        integrity: sha512-hscXkbqUZ2sPithAuLm5MXL+Wph+U7wHngPBv9OMWwlP8iaflyxpjTYZkmdgB4/vPIhemRlBEoLrH7UC1n7aUw==,
       }
     engines: { node: ^14.18.0 || >=16.0.0 }
     peerDependencies:
@@ -10884,14 +11450,14 @@ packages:
     peerDependencies:
       eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7
 
-  eslint-plugin-storybook@10.2.0:
+  eslint-plugin-storybook@10.2.8:
     resolution:
       {
-        integrity: sha512-OtQJ153FOusr8bIMzccjkfMFJEex/3NFx0iXZ+UaeQ0WXearQ+37EGgBay3onkFElyu8AySggq/fdTknPAEvPA==,
+        integrity: sha512-BtysXrg1RoYT3DIrCc+svZ0+L3mbWsu7suxTLGrihBY5HfWHkJge+qjlBBR1Nm2ZMslfuFS5K0NUWbWCJRu6kg==,
       }
     peerDependencies:
       eslint: ">=8"
-      storybook: ^10.2.0
+      storybook: ^10.2.8
 
   eslint-scope@5.1.1:
     resolution:
@@ -11077,6 +11643,12 @@ packages:
         integrity: sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==,
       }
 
+  eventemitter3@5.0.4:
+    resolution:
+      {
+        integrity: sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==,
+      }
+
   events@3.3.0:
     resolution:
       {
@@ -11423,10 +11995,10 @@ packages:
         integrity: sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==,
       }
 
-  follow-redirects@1.15.9:
+  follow-redirects@1.15.11:
     resolution:
       {
-        integrity: sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==,
+        integrity: sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ==,
       }
     engines: { node: ">=4.0" }
     peerDependencies:
@@ -11455,10 +12027,10 @@ packages:
       }
     engines: { node: ">=14" }
 
-  forge-std@https://codeload.github.com/foundry-rs/forge-std/tar.gz/8e7bbe65b08aa71a0c93b50dc707da716a2ac1ff:
+  forge-std@https://codeload.github.com/foundry-rs/forge-std/tar.gz/aeb45e9f32ef8ca78f0aeda17596e9c46374da41:
     resolution:
       {
-        tarball: https://codeload.github.com/foundry-rs/forge-std/tar.gz/8e7bbe65b08aa71a0c93b50dc707da716a2ac1ff,
+        tarball: https://codeload.github.com/foundry-rs/forge-std/tar.gz/aeb45e9f32ef8ca78f0aeda17596e9c46374da41,
       }
     version: 1.14.0
 
@@ -11472,10 +12044,10 @@ packages:
       typescript: ">3.6.0"
       webpack: ^5.11.0
 
-  form-data@4.0.4:
+  form-data@4.0.5:
     resolution:
       {
-        integrity: sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==,
+        integrity: sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==,
       }
     engines: { node: ">= 6" }
 
@@ -11609,16 +12181,16 @@ packages:
       }
     engines: { node: ">= 0.4" }
 
-  get-tsconfig@4.10.1:
+  get-tsconfig@4.13.0:
     resolution:
       {
-        integrity: sha512-auHyJ4AgMz7vgS8Hp3N6HXSmlMdUyhSUrfBF16w153rxtLIEOE+HGqaBppczZvnHLqQJfiHotCYpNhl0lUROFQ==,
+        integrity: sha512-1VKTZJCwBrvbd+Wn3AOgQP/2Av+TfTCOlE4AcRJE72W1ksZXbAx8PPBR9RzgTeSPzlPMHrbANMH3LbltH73wxQ==,
       }
 
-  get-tsconfig@4.13.0:
+  get-tsconfig@4.13.6:
     resolution:
       {
-        integrity: sha512-1VKTZJCwBrvbd+Wn3AOgQP/2Av+TfTCOlE4AcRJE72W1ksZXbAx8PPBR9RzgTeSPzlPMHrbANMH3LbltH73wxQ==,
+        integrity: sha512-shZT/QMiSHc/YBLxxOkMtgSid5HFoauqCE3/exfsEcwg1WkeqjG+V40yBbBrsD+jW2HDXcs28xOfcbm2jI8Ddw==,
       }
 
   git-raw-commits@4.0.0:
@@ -11831,41 +12403,38 @@ packages:
     peerDependencies:
       graphql: ">=0.8.0"
 
-  graphql-ws@6.0.6:
+  graphql-ws@6.0.7:
     resolution:
       {
-        integrity: sha512-zgfER9s+ftkGKUZgc0xbx8T7/HMO4AV5/YuYiFc+AtgcO5T0v8AxYYNQ+ltzuzDZgNkYJaFspm5MMYLjQzrkmw==,
+        integrity: sha512-yoLRW+KRlDmnnROdAu7sX77VNLC0bsFoZyGQJLy1cF+X/SkLg/fWkRGrEEYQK8o2cafJ2wmEaMqMEZB3U3DYDg==,
       }
     engines: { node: ">=20" }
     peerDependencies:
       "@fastify/websocket": ^10 || ^11
       crossws: ~0.3
       graphql: ^15.10.1 || ^16
-      uWebSockets.js: ^20
       ws: ^8
     peerDependenciesMeta:
       "@fastify/websocket":
         optional: true
       crossws:
         optional: true
-      uWebSockets.js:
-        optional: true
       ws:
         optional: true
 
-  graphql-yoga@5.15.1:
+  graphql-yoga@5.17.1:
     resolution:
       {
-        integrity: sha512-wCSnviFFGC4CF9lyeRNMW1p55xVWkMRLPu9iHYbBd8WCJEjduDTo3nh91sVktpbJdUQ6rxNBN6hhpTYMFZuMwg==,
+        integrity: sha512-Izb2uVWfdoWm+tF4bi39KE6F4uml3r700/EwULPZYOciY8inmy4hw+98c6agy3C+xceXvTkP7Li6mY/EI8XliA==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
       graphql: ^15.2.0 || ^16.0.0
 
-  graphql-yoga@5.17.1:
+  graphql-yoga@5.18.0:
     resolution:
       {
-        integrity: sha512-Izb2uVWfdoWm+tF4bi39KE6F4uml3r700/EwULPZYOciY8inmy4hw+98c6agy3C+xceXvTkP7Li6mY/EI8XliA==,
+        integrity: sha512-xFt1DVXS1BZ3AvjnawAGc5OYieSe56WuQuyk3iEpBwJ3QDZJWQGLmU9z/L5NUZ+pUcyprsz/bOwkYIV96fXt/g==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
@@ -12003,10 +12572,10 @@ packages:
         integrity: sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==,
       }
 
-  hono@4.10.7:
+  hono@4.11.9:
     resolution:
       {
-        integrity: sha512-icXIITfw/07Q88nLSkB9aiUrd8rYzSweK681Kjo/TSggaGbOX4RRyxxm71v+3PC8C/j+4rlxGeoTRxQDkaJkUw==,
+        integrity: sha512-Eaw2YTGM6WOxA6CXbckaEvslr2Ne4NFsKrvc0v97JD5awbmeBLO5w9Ho9L9kmKonrwF9RJlW6BxT1PVv/agBHQ==,
       }
     engines: { node: ">=16.9.0" }
 
@@ -12030,10 +12599,10 @@ packages:
     engines: { node: ">=12" }
     hasBin: true
 
-  html-webpack-plugin@5.6.5:
+  html-webpack-plugin@5.6.6:
     resolution:
       {
-        integrity: sha512-4xynFbKNNk+WlzXeQQ+6YYsH2g7mpfPszQZUi3ovKlj+pDmngQ7vRXjrrmGROabmKwyQkcgcX5hqfOwHbFmK5g==,
+        integrity: sha512-bLjW01UTrvoWTJQL5LsMRo1SypHW80FTm12OJRSnr3v6YHNhfe+1r0MYUZJMACxnCHURVnBWRwAsWs2yPU9Ezw==,
       }
     engines: { node: ">=10.13.0" }
     peerDependencies:
@@ -12722,6 +13291,13 @@ packages:
       }
     engines: { node: ">=10" }
 
+  istanbul-lib-source-maps@5.0.6:
+    resolution:
+      {
+        integrity: sha512-yg2d+Em4KizZC5niWhQaIomgf5WlL4vOOjZ5xGCmF8SnPE/mDWWXgvRExdcpCgh9lLRRa1/fSYp2ymmbJ1pI+A==,
+      }
+    engines: { node: ">=10" }
+
   istanbul-reports@3.1.7:
     resolution:
       {
@@ -13010,6 +13586,12 @@ packages:
         integrity: sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==,
       }
 
+  js-tokens@10.0.0:
+    resolution:
+      {
+        integrity: sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q==,
+      }
+
   js-tokens@4.0.0:
     resolution:
       {
@@ -13607,6 +14189,12 @@ packages:
         integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==,
       }
 
+  lodash@4.17.23:
+    resolution:
+      {
+        integrity: sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==,
+      }
+
   log-symbols@4.1.0:
     resolution:
       {
@@ -13680,10 +14268,10 @@ packages:
         integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==,
       }
 
-  lru-cache@11.2.4:
+  lru-cache@11.2.6:
     resolution:
       {
-        integrity: sha512-B5Y16Jr9LB9dHVkh6ZevG+vAbOsNOYCX+sXvFWFu7B3Iz5mijW3zdbMyhsh8ANd2mSWBYdJgnqi+mL7/LrOPYg==,
+        integrity: sha512-ESL2CrkS/2wTPfuend7Zhkzo2u0daGJ/A2VucJOgQ/C48S/zB8MMeMHSGKYpXhIjbPxfuezITkaBH1wqv00DDQ==,
       }
     engines: { node: 20 || >=22 }
 
@@ -13720,6 +14308,12 @@ packages:
         integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==,
       }
 
+  magicast@0.3.5:
+    resolution:
+      {
+        integrity: sha512-L0WhttDl+2BOsybvEOLK7fW3UA0OQ0IQ2d6Zl2x/a6vVRs3bAY0ECOSHHeL5jD+SbOpOCUEi0y1DgHEn9Qn1AQ==,
+      }
+
   make-dir@3.1.0:
     resolution:
       {
@@ -13921,10 +14515,10 @@ packages:
         integrity: sha512-JIYlbt6g8i5jKfJ3xz7rF0LXmv2TkDxBLUkiBeZ7bAx4GnnNMr8xFpGnOxn6GhTEHx3SjRrZEoU+j04prX1ktg==,
       }
 
-  minimatch@10.1.1:
+  minimatch@10.1.2:
     resolution:
       {
-        integrity: sha512-enIvLvRAFZYXJzkCYG5RKmPfrFArdLv+R+lbQ53BmIMLIry74bjKzX6iHAm8WYamJkhSSEabrWN5D97XnKObjQ==,
+        integrity: sha512-fu656aJ0n2kcXwsnwnv9g24tkU5uSmOlTjd6WyyaKm2Z+h1qmY6bAjrcaIxF/BslFqbZ8UBtbJi7KgQOZD2PTw==,
       }
     engines: { node: 20 || >=22 }
 
@@ -14204,10 +14798,10 @@ packages:
         integrity: sha512-2vPPEi+Z7WqML2jZYddDIfy5Dqb0r2fze2zTxNNknZaFpVHU3mFB3R+DWeJWGVx0ecvttSGlJTI+WG+8Z4cDWw==,
       }
 
-  nuqs@2.8.5:
+  nuqs@2.8.8:
     resolution:
       {
-        integrity: sha512-ndhnNB9eLX/bsiGFkBNsrfOWf3BCbzBMD+b5GkD5o2Q96Q+llHnoUlZsrO3tgJKZZV7LLlVCvFKdj+sjBITRzg==,
+        integrity: sha512-LF5sw9nWpHyPWzMMu9oho3r9C5DvkpmBIg4LQN78sexIzGaeRx8DWr0uy3YiFx5i2QGZN1Qqcb+OAtEVRa2bnA==,
       }
     peerDependencies:
       "@remix-run/react": ">=2"
@@ -14433,10 +15027,10 @@ packages:
       }
     engines: { node: ">= 0.4" }
 
-  ox@0.6.7:
+  ox@0.12.1:
     resolution:
       {
-        integrity: sha512-17Gk/eFsFRAZ80p5eKqv89a57uXjd3NgIf1CaXojATPBuujVc/fQSVhBeAU9JCRB+k7J50WQAyWTxK19T9GgbA==,
+        integrity: sha512-uU0llpthaaw4UJoXlseCyBHmQ3bLrQmz9rRLIAUHqv46uHuae9SE+ukYBRIPVCnlEnHKuWjDUcDFHWx9gbGNoA==,
       }
     peerDependencies:
       typescript: ">=5.4.0"
@@ -14444,10 +15038,10 @@ packages:
       typescript:
         optional: true
 
-  ox@0.6.9:
+  ox@0.6.7:
     resolution:
       {
-        integrity: sha512-wi5ShvzE4eOcTwQVsIPdFr+8ycyX+5le/96iAJutaZAvCes1J0+RvpEPg5QDPDiaR0XQQAvZVl7AwqQcINuUug==,
+        integrity: sha512-17Gk/eFsFRAZ80p5eKqv89a57uXjd3NgIf1CaXojATPBuujVc/fQSVhBeAU9JCRB+k7J50WQAyWTxK19T9GgbA==,
       }
     peerDependencies:
       typescript: ">=5.4.0"
@@ -14455,10 +15049,10 @@ packages:
       typescript:
         optional: true
 
-  ox@0.9.17:
+  ox@0.6.9:
     resolution:
       {
-        integrity: sha512-rKAnhzhRU3Xh3hiko+i1ZxywZ55eWQzeS/Q4HRKLx2PqfHOolisZHErSsJVipGlmQKHW5qwOED/GighEw9dbLg==,
+        integrity: sha512-wi5ShvzE4eOcTwQVsIPdFr+8ycyX+5le/96iAJutaZAvCes1J0+RvpEPg5QDPDiaR0XQQAvZVl7AwqQcINuUug==,
       }
     peerDependencies:
       typescript: ">=5.4.0"
@@ -14466,10 +15060,10 @@ packages:
       typescript:
         optional: true
 
-  ox@0.9.6:
+  ox@0.9.17:
     resolution:
       {
-        integrity: sha512-8SuCbHPvv2eZLYXrNmC0EC12rdzXQLdhnOMlHDW2wiCPLxBrOOJwX5L5E61by+UjTPOryqQiRSnjIKCI+GykKg==,
+        integrity: sha512-rKAnhzhRU3Xh3hiko+i1ZxywZ55eWQzeS/Q4HRKLx2PqfHOolisZHErSsJVipGlmQKHW5qwOED/GighEw9dbLg==,
       }
     peerDependencies:
       typescript: ">=5.4.0"
@@ -14719,22 +15313,16 @@ packages:
       }
     engines: { node: ">=0.12" }
 
-  pg-cloudflare@1.2.7:
-    resolution:
-      {
-        integrity: sha512-YgCtzMH0ptvZJslLM1ffsY4EuGaU0cx4XSdXLRFae8bPP4dS5xL1tNB3k2o/N64cHJpwU7dxKli/nZ2lUa5fLg==,
-      }
-
   pg-cloudflare@1.3.0:
     resolution:
       {
         integrity: sha512-6lswVVSztmHiRtD6I8hw4qP/nDm1EJbKMRhf3HCYaqud7frGysPv7FYJ5noZQdhQtN2xJnimfMtvQq21pdbzyQ==,
       }
 
-  pg-connection-string@2.10.1:
+  pg-connection-string@2.11.0:
     resolution:
       {
-        integrity: sha512-iNzslsoeSH2/gmDDKiyMqF64DATUCWj3YJ0wP14kqcsf2TUklwimd+66yYojKwZCA7h2yRNLGug71hCBA2a4sw==,
+        integrity: sha512-kecgoJwhOpxYU21rZjULrmrBJ698U2RxXofKVzOn5UDj61BPj/qMb7diYUR1nLScCDbrztQFl1TaQZT0t1EtzQ==,
       }
 
   pg-connection-string@2.9.1:
@@ -14756,14 +15344,6 @@ packages:
       }
     engines: { node: ">=4.0.0" }
 
-  pg-pool@3.10.1:
-    resolution:
-      {
-        integrity: sha512-Tu8jMlcX+9d8+QVzKIvM/uJtp07PKr82IUOYEphaWcoBhIYkoHpLXN3qO59nAI11ripznDsEzEv8nUxBVWajGg==,
-      }
-    peerDependencies:
-      pg: ">=8.0"
-
   pg-pool@3.11.0:
     resolution:
       {
@@ -14797,22 +15377,10 @@ packages:
       }
     engines: { node: ">=4" }
 
-  pg@8.16.3:
-    resolution:
-      {
-        integrity: sha512-enxc1h0jA/aq5oSDMvqyW3q89ra6XIIDZgCX9vkMrnz5DFTw/Ny3Li2lFQ+pt3L6MCgm/5o2o8HW9hiJji+xvw==,
-      }
-    engines: { node: ">= 16.0.0" }
-    peerDependencies:
-      pg-native: ">=3.0.1"
-    peerDependenciesMeta:
-      pg-native:
-        optional: true
-
-  pg@8.17.2:
+  pg@8.18.0:
     resolution:
       {
-        integrity: sha512-vjbKdiBJRqzcYw1fNU5KuHyYvdJ1qpcQg1CeBrHFqV1pWgHeVR6j/+kX0E1AAXfyuLUGY1ICrN2ELKA/z2HWzw==,
+        integrity: sha512-xqrUDL1b9MbkydY/s+VZ6v+xiMUmOUk7SS9d/1kpyQxoJ6U9AO1oIJyUWVZojbfe5Cc/oluutcgFG4L9RDP1iQ==,
       }
     engines: { node: ">= 16.0.0" }
     peerDependencies:
@@ -14934,18 +15502,18 @@ packages:
         integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==,
       }
 
-  playwright-core@1.57.0:
+  playwright-core@1.58.2:
     resolution:
       {
-        integrity: sha512-agTcKlMw/mjBWOnD6kFZttAAGHgi/Nw0CZ2o6JqWSbMlI219lAFLZZCyqByTsvVAJq5XA5H8cA6PrvBRpBWEuQ==,
+        integrity: sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==,
       }
     engines: { node: ">=18" }
     hasBin: true
 
-  playwright@1.57.0:
+  playwright@1.58.2:
     resolution:
       {
-        integrity: sha512-ilYQj1s8sr2ppEJ2YVadYBN0Mb3mdo9J0wQ+UuDhzYqURwSoW4n1Xs5vs7ORwgDGmyEh33tRMeS8KhdkMoLXQw==,
+        integrity: sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==,
       }
     engines: { node: ">=18" }
     hasBin: true
@@ -14964,10 +15532,10 @@ packages:
       }
     engines: { node: ">=10.13.0" }
 
-  ponder@0.16.2:
+  ponder@0.16.3:
     resolution:
       {
-        integrity: sha512-cUTtcrGxSt5ReJc0z7UuJWirHtQZ33KAepaIrp2W+Smzi8FJ2Odm5TedrtdlmHnaagUpl8eagpRUBsoXrPYXYw==,
+        integrity: sha512-QwAg5eFUujWR87ZMeTTKmF17q9IVTew26tpdaTfQrrtJVf/oU8ZN1qu7ZcP2SPtK5oScblJMWQm9zfwst6tJcg==,
       }
     engines: { node: ">=18.14" }
     hasBin: true
@@ -15028,6 +15596,12 @@ packages:
       }
     engines: { node: ">= 0.4" }
 
+  postal-mime@2.7.3:
+    resolution:
+      {
+        integrity: sha512-MjhXadAJaWgYzevi46+3kLak8y6gbg0ku14O1gO/LNOuay8dO+1PtcSGvAdgDR0DoIsSaiIA8y/Ddw6MnrO0Tw==,
+      }
+
   postcss-load-config@6.0.1:
     resolution:
       {
@@ -15162,10 +15736,10 @@ packages:
         integrity: sha512-1cSoF0aCC8uaARATfrlz4VCBqE8LwZwRfLgkxJOQwAlQt6ayTmi0D9OF7nXid1POI5SZidFuG9CnlXbDfLqY/Q==,
       }
 
-  preact@10.28.0:
+  preact@10.28.3:
     resolution:
       {
-        integrity: sha512-rytDAoiXr3+t6OIP3WGlDd0ouCUG1iCWzkcY3++Nreuoi17y6T5i/zRhe6uYfoVcxq6YU+sBtJouuRDsq8vvqA==,
+        integrity: sha512-tCmoRkPQLpBeWzpmbhryairGnhW9tKV6c6gr/w+RhoRoKEJwsjzipwp//1oCpGPOchvSLaAPlpcJi9MwMmoPyA==,
       }
 
   prelude-ls@1.2.1:
@@ -15175,10 +15749,10 @@ packages:
       }
     engines: { node: ">= 0.8.0" }
 
-  prettier-linter-helpers@1.0.0:
+  prettier-linter-helpers@1.0.1:
     resolution:
       {
-        integrity: sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==,
+        integrity: sha512-SxToR7P8Y2lWmv/kTzVLC1t/GDI2WGjMwNhLLE9qtH8Q13C+aEmuRlzDst4Up4s0Wc8sF2M+J57iB3cMLqftfg==,
       }
     engines: { node: ">=6.0.0" }
 
@@ -15246,10 +15820,10 @@ packages:
       prettier-plugin-svelte:
         optional: true
 
-  prettier@3.7.4:
+  prettier@3.8.1:
     resolution:
       {
-        integrity: sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==,
+        integrity: sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==,
       }
     engines: { node: ">=14" }
     hasBin: true
@@ -15396,6 +15970,13 @@ packages:
       }
     engines: { node: ">=0.6" }
 
+  qs@6.14.1:
+    resolution:
+      {
+        integrity: sha512-4EK3+xJl8Ts67nLYNwqw/dsFVnCf+qR7RgXSK9jEEm9unao3njwMDdmsdvoKBKHzxd7tCYz5e5M+SnMjdtXGQQ==,
+      }
+    engines: { node: ">=0.6" }
+
   query-string@7.1.3:
     resolution:
       {
@@ -15497,10 +16078,10 @@ packages:
     peerDependencies:
       react: ^19.2.3
 
-  react-hook-form@7.71.0:
+  react-hook-form@7.71.1:
     resolution:
       {
-        integrity: sha512-oFDt/iIFMV9ZfV52waONXzg4xuSlbwKUPvXVH2jumL1me5qFhBMc4knZxuXiZ2+j6h546sYe3ZKJcg/900/iHw==,
+        integrity: sha512-9SUJKCGKo8HUSsCO+y0CtqkqI5nNuaDqTxyqPsZPqIwudpj4rCrAz/jZV+jn57bx5gtZKOh3neQu94DXMc+w5w==,
       }
     engines: { node: ">=18.0.0" }
     peerDependencies:
@@ -15874,10 +16455,10 @@ packages:
         integrity: sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==,
       }
 
-  resend@6.7.0:
+  resend@6.9.2:
     resolution:
       {
-        integrity: sha512-2ZV0NDZsh4Gh+Nd1hvluZIitmGJ59O4+OxMufymG6Y8uz1Jgt2uS1seSENnkIUlmwg7/dwmfIJC9rAufByz7wA==,
+        integrity: sha512-uIM6CQ08tS+hTCRuKBFbOBvHIGaEhqZe8s4FOgqsVXSbQLAhmNWpmUhG3UAtRnmcwTWFUqnHa/+Vux8YGPyDBA==,
       }
     engines: { node: ">=20" }
     peerDependencies:
@@ -16175,6 +16756,14 @@ packages:
     engines: { node: ">=10" }
     hasBin: true
 
+  semver@7.7.4:
+    resolution:
+      {
+        integrity: sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==,
+      }
+    engines: { node: ">=10" }
+    hasBin: true
+
   sentence-case@3.0.4:
     resolution:
       {
@@ -16504,10 +17093,10 @@ packages:
       }
     engines: { node: ">= 0.4" }
 
-  storybook@10.2.0:
+  storybook@10.2.8:
     resolution:
       {
-        integrity: sha512-fIQnFtpksRRgHR1CO1onGX3djaog4qsW/c5U8arqYTkUEr2TaWpn05mIJDOBoPJFlOdqFrB4Ttv0PZJxV7avhw==,
+        integrity: sha512-885uSIn8NQw2ZG7vy84K45lHCOSyz1DVsDV8pHiHQj3J0riCuWLNeO50lK9z98zE8kjhgTtxAAkMTy5nkmNRKQ==,
       }
     hasBin: true
     peerDependencies:
@@ -16841,10 +17430,10 @@ packages:
         integrity: sha512-kc6S2YS/2yXbtkSMunBtKdah4VFETZ8Oh6ONSmSd9bRxhqTrtARUCBUiWXH3xVPpvR7tz2CSnkuXVE42EcGnMw==,
       }
 
-  swr@2.3.7:
+  swr@2.4.0:
     resolution:
       {
-        integrity: sha512-ZEquQ82QvalqTxhBVv/DlAg2mbmUjF4UgpPg9wwk4ufb9rQnZXh1iKyyKBqV6bQGu1Ie7L1QwSYO07qFIa1p+g==,
+        integrity: sha512-sUlC20T8EOt1pHmDiqueUWMmRRX03W7w5YxovWX7VR2KHEPCTMly85x05vpkP5i6Bu4h44ePSMD9Tc+G2MItFw==,
       }
     peerDependencies:
       react: ^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
@@ -16856,6 +17445,13 @@ packages:
       }
     engines: { node: ">=0.10" }
 
+  sync-fetch@0.6.0:
+    resolution:
+      {
+        integrity: sha512-IELLEvzHuCfc1uTsshPK58ViSdNqXxlml1U+fmwJIKLYKOr/rAtBrorE2RYm5IHaMpDNlmC0fr1LAvdXvyheEQ==,
+      }
+    engines: { node: ">=18" }
+
   sync-fetch@0.6.0-2:
     resolution:
       {
@@ -16863,23 +17459,23 @@ packages:
       }
     engines: { node: ">=18" }
 
-  synckit@0.11.11:
+  synckit@0.11.12:
     resolution:
       {
-        integrity: sha512-MeQTA1r0litLUf0Rp/iisCaL8761lKAZHaimlbGK4j0HysC4PLfqygQj9srcs0m2RdtDYnF8UuYyKpbjHYp7Jw==,
+        integrity: sha512-Bh7QjT8/SuKUIfObSXNHNSK6WHo6J1tHCqJsuaFDP7gP0fkzSfTxI8y85JrppZ0h8l0maIgc2tfuZQ6/t3GtnQ==,
       }
     engines: { node: ^14.18.0 || >=16.0.0 }
 
-  tailwind-merge@2.6.0:
+  tailwind-merge@2.6.1:
     resolution:
       {
-        integrity: sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==,
+        integrity: sha512-Oo6tHdpZsGpkKG88HJ8RR1rg/RdnEkQEfMoEk2x1XRI3F1AxeU+ijRXpiVUF4UbLfcxxRGw6TbUINKYdWVsQTQ==,
       }
 
-  tailwindcss@4.1.17:
+  tailwindcss@4.1.18:
     resolution:
       {
-        integrity: sha512-j9Ee2YjuQqYT9bbRTfTZht9W/ytp5H+jJpZKiYdP/bpnXARAuELt9ofP0lPnmHjbga7SNQIxdTAXCmtKVYjN+Q==,
+        integrity: sha512-4+Z+0yiYyEtUVCScyfHCxOYP06L5Ne+JiHhY2IjR2KWMIWhJOYZKLSGZaP5HkZ8+bY0cxfzwDE5uOmzFXyIwxw==,
       }
 
   tapable@2.3.0:
@@ -16902,10 +17498,10 @@ packages:
       }
     engines: { node: ">=18" }
 
-  terser-webpack-plugin@5.3.14:
+  terser-webpack-plugin@5.3.16:
     resolution:
       {
-        integrity: sha512-vkZjpUjb6OMS7dhV+tILUW6BhpDR7P2L/aQSAv+Uwk+m8KATX9EccViHTJR2qDtACKPIYndLGCyl3FMo+r2LMw==,
+        integrity: sha512-h9oBFCWrq78NyWWVcSwZarJkZ01c2AyGrzs1crmHZO3QUg9D61Wu4NPjBy69n7JqylFF5y+CsUZYmYEIZ3mR+Q==,
       }
     engines: { node: ">= 10.13.0" }
     peerDependencies:
@@ -16921,10 +17517,10 @@ packages:
       uglify-js:
         optional: true
 
-  terser@5.44.1:
+  terser@5.46.0:
     resolution:
       {
-        integrity: sha512-t/R3R/n0MSwnnazuPpPNVO60LX0SKL45pyl9YlvxIdkH0Of7D5qM2EVe+yASRIlY5pZ73nclYJfNANGWPwFDZw==,
+        integrity: sha512-jTwoImyr/QbOWFFso3YoU3ik0jBBDJ6JTOQiy/J2YxVJdZCc+5u7skhNwiOR3FQIygFqVUPHl7qbbxtjW2K3Qg==,
       }
     engines: { node: ">=10" }
     hasBin: true
@@ -16936,6 +17532,13 @@ packages:
       }
     engines: { node: ">=8" }
 
+  test-exclude@7.0.1:
+    resolution:
+      {
+        integrity: sha512-pFYqmTw68LXVjeWJMST4+borgQP2AyMNbg1BpZh9LbyhUeNkeaPF9gzfPGUAnSMV3qPYdWUwDIjjCLiSDOl7vg==,
+      }
+    engines: { node: ">=18" }
+
   text-encoding-utf-8@1.0.2:
     resolution:
       {
@@ -17006,10 +17609,10 @@ packages:
         integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==,
       }
 
-  tiny-lru@11.4.5:
+  tiny-lru@11.4.7:
     resolution:
       {
-        integrity: sha512-hkcz3FjNJfKXjV4mjQ1OrXSLAehg8Hw+cEZclOVT+5c/cWQWImQ9wolzTjth+dmmDe++p3bme3fTxz6Q4Etsqw==,
+        integrity: sha512-w/Te7uMUVeH0CR8vZIjr+XiN41V+30lkDdK+NRIDCUYKKuL9VcmaUEmaPISuwGhLlrTGh5yu18lENtR9axSxYw==,
       }
     engines: { node: ">=12" }
 
@@ -17318,58 +17921,58 @@ packages:
         integrity: sha512-C3TaO7K81YvjCgQH9Q1S3R3P3BtN3RIM8n+OvX4il1K1zgE8ZhI0op7kClgkxtutIE8hQrcrHBXvIheqKUUCxw==,
       }
 
-  turbo-darwin-64@2.6.2:
+  turbo-darwin-64@2.8.6:
     resolution:
       {
-        integrity: sha512-nF9d/YAyrNkyXn9lp3ZtgXPb7fZsik3cUNe/sBvUO0G5YezUS/kDYYw77IdjizDzairz8pL2ITCTUreG2d5iZQ==,
+        integrity: sha512-6QeZ/aLZizekiI6tKZN0IGP1a1WYZ9c/qDKPa0rSmj2X0O0Iw/ES4rKZV40S5n8SUJdiU01EFLygHJ2oWaYKXg==,
       }
     cpu: [x64]
     os: [darwin]
 
-  turbo-darwin-arm64@2.6.2:
+  turbo-darwin-arm64@2.8.6:
     resolution:
       {
-        integrity: sha512-mmm0jFaVramST26XE1Lk2qjkjvLJHOe9f3TFjqY+aByjMK/ZmKE5WFPuCWo4L3xhwx+16T37rdPP//76loB3oA==,
+        integrity: sha512-RS4Z902vB93cQD3PJS/1IMmS0HefrB5ZXuw4ECOrxhOGz5jJVmYFJ6weDzedjoTDeYHHXGo1NoiCSHg69ngWKA==,
       }
     cpu: [arm64]
     os: [darwin]
 
-  turbo-linux-64@2.6.2:
+  turbo-linux-64@2.8.6:
     resolution:
       {
-        integrity: sha512-IUMHjkVRJDUABGpi+iS1Le59aOl5DX88U5UT/mKaE7nNEjG465+a8UtYno56cZnLP+C6BkX4I93LFgYf9syjGQ==,
+        integrity: sha512-hCWDnDepYbrSJdByuryKFoHAGFkvgBYXr6qdaGsYhX1Wgq8isqXCQBKOo99Y/9tXDwKGEeQ7xnkdFvSL7AQ4iQ==,
       }
     cpu: [x64]
     os: [linux]
 
-  turbo-linux-arm64@2.6.2:
+  turbo-linux-arm64@2.8.6:
     resolution:
       {
-        integrity: sha512-0qQdZiimMUZj2Gfq87thYu0E02NaNcsB3lcEK/TD70Zzi7AxQoxye664Gis0Uao2j2L9/+05wC2btZ7SoFX3Gw==,
+        integrity: sha512-oS15aCYEpynG/l69xs/ZnQ0dnz0pHhfHg70Zf5J+j5Cam0/RA0MpcryjneN/9G0PmP8a/6ZxnL5nZahX+wOBPA==,
       }
     cpu: [arm64]
     os: [linux]
 
-  turbo-windows-64@2.6.2:
+  turbo-windows-64@2.8.6:
     resolution:
       {
-        integrity: sha512-BmMfFmt0VaoZL4NbtDq/dzGfjHsPoGU2+vFiZtkiYsttHY3fd/Dmgnu9PuRyJN1pv2M22q88rXO+dqYRHztLMw==,
+        integrity: sha512-eqBxqJD7H/uk9V0QO10VgwY9J2BUXejsGuzChln72Yl+o8GZwsvhOekndRxccR90J8ZO+LKO24+3VzHFh4Cu/g==,
       }
     cpu: [x64]
     os: [win32]
 
-  turbo-windows-arm64@2.6.2:
+  turbo-windows-arm64@2.8.6:
     resolution:
       {
-        integrity: sha512-0r4s4M/FgLxfjrdLPdqQUur8vZAtaWEi4jhkQ6wCIN2xzA9aee9IKwM53w7CQcjaLvWhT0AU7LTQHjFaHwxiKw==,
+        integrity: sha512-I3VEQyxIlNZ6XTg4fLKAkuhcwzIs/GD7Vs1yhelH2aUTjf08wprjBWknDqP7mjAHMpsosRrq4DtfSZEQm83Hxg==,
       }
     cpu: [arm64]
     os: [win32]
 
-  turbo@2.6.2:
+  turbo@2.8.6:
     resolution:
       {
-        integrity: sha512-LiQAFS6iWvnY8ViGtoPgduWBeuGH9B32XR4p8H8jxU5PudwyHiiyf1jQW0fCC8gCCTz9itkIbqZLIyUu5AG33w==,
+        integrity: sha512-QMj1SQwUYehc+xJ9SxXn56UO43hfKN64/NFetVW1BwzysRqn+q0FSgrmk+IbJ+djfd8j8zXGKGeqsnUcXwQSUQ==,
       }
     hasBin: true
 
@@ -17553,6 +18156,12 @@ packages:
         integrity: sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==,
       }
 
+  undici-types@7.21.0:
+    resolution:
+      {
+        integrity: sha512-w9IMgQrz4O0YN1LtB7K5P63vhlIOvC7opSmouCJ+ZywlPAlO9gIkJ+otk6LvGpAs2wg4econaCz3TvQ9xPoyuQ==,
+      }
+
   unicode-canonical-property-names-ecmascript@2.0.1:
     resolution:
       {
@@ -17798,6 +18407,14 @@ packages:
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
 
+  use-sync-external-store@1.6.0:
+    resolution:
+      {
+        integrity: sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==,
+      }
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+
   utf-8-validate@5.0.10:
     resolution:
       {
@@ -17898,10 +18515,10 @@ packages:
       typescript:
         optional: true
 
-  viem@2.41.2:
+  viem@2.45.3:
     resolution:
       {
-        integrity: sha512-LYliajglBe1FU6+EH9mSWozp+gRA/QcHfxeD9Odf83AdH5fwUS7DroH4gHvlv6Sshqi1uXrYFA2B/EOczxd15g==,
+        integrity: sha512-axOD7rIbGiDHHA1MHKmpqqTz3CMCw7YpE/FVypddQMXL5i364VkNZh9JeEJH17NO484LaZUOMueo35IXyL76Mw==,
       }
     peerDependencies:
       typescript: ">=5.0.4"
@@ -18070,10 +18687,10 @@ packages:
         integrity: sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ==,
       }
 
-  watchpack@2.4.4:
+  watchpack@2.5.1:
     resolution:
       {
-        integrity: sha512-c5EGNOiyxxV5qmTtAB7rbiXxi1ooX1pQKMLX/MIabJjRA0SJBQOjKF+KSVfHkr9U1cADPon0mRiVe/riyaiDUA==,
+        integrity: sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==,
       }
     engines: { node: ">=10.13.0" }
 
@@ -18133,10 +18750,10 @@ packages:
         integrity: sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==,
       }
 
-  webpack@5.103.0:
+  webpack@5.105.1:
     resolution:
       {
-        integrity: sha512-HU1JOuV1OavsZ+mfigY0j8d1TgQgbZ6M+J75zDkpEAwYeXjWSqrGJtgnPblJjd/mAyTNQ7ygw0MiKOn6etz8yw==,
+        integrity: sha512-Gdj3X74CLJJ8zy4URmK42W7wTZUJrqL+z8nyGEr4dTN0kb3nVs+ZvjbTOqRYPD7qX4tUmwyHL9Q9K6T1seW6Yw==,
       }
     engines: { node: ">=10.13.0" }
     hasBin: true
@@ -18335,6 +18952,21 @@ packages:
       utf-8-validate:
         optional: true
 
+  ws@8.19.0:
+    resolution:
+      {
+        integrity: sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg==,
+      }
+    engines: { node: ">=10.0.0" }
+    peerDependencies:
+      bufferutil: ^4.0.1
+      utf-8-validate: ">=5.0.2"
+    peerDependenciesMeta:
+      bufferutil:
+        optional: true
+      utf-8-validate:
+        optional: true
+
   wsl-utils@0.1.0:
     resolution:
       {
@@ -18506,10 +19138,10 @@ packages:
       use-sync-external-store:
         optional: true
 
-  zustand@5.0.3:
+  zustand@5.0.11:
     resolution:
       {
-        integrity: sha512-14fwWQtU3pH4dE0dOpdMiWjddcH+QzKIgk1cl8epwSE7yag43k/AD/m4L6+K7DytAOr9gGBe3/EXj9g7cdostg==,
+        integrity: sha512-fdZY+dk7zn/vbWNCYmzZULHRrss0jx5pPFiOuMZ/5HJN6Yv3u+1Wswy/4MpZEkEGhtNH+pwxZB8OKgUBPzYAGg==,
       }
     engines: { node: ">=12.20.0" }
     peerDependencies:
@@ -18527,10 +19159,10 @@ packages:
       use-sync-external-store:
         optional: true
 
-  zustand@5.0.9:
+  zustand@5.0.3:
     resolution:
       {
-        integrity: sha512-ALBtUj0AfjJt3uNRQoL1tL2tMvj6Gp/6e39dnfT6uzpelGru8v1tPOGBzayOWbPJvujM8JojDk3E1LxeFisBNg==,
+        integrity: sha512-14fwWQtU3pH4dE0dOpdMiWjddcH+QzKIgk1cl8epwSE7yag43k/AD/m4L6+K7DytAOr9gGBe3/EXj9g7cdostg==,
       }
     engines: { node: ">=12.20.0" }
     peerDependencies:
@@ -18562,7 +19194,7 @@ snapshots:
       "@jridgewell/gen-mapping": 0.3.13
       "@jridgewell/trace-mapping": 0.3.31
 
-  "@apollo/client@3.14.0(@types/react@19.2.8)(graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)":
+  "@apollo/client@3.14.0(@types/react@19.2.8)(graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)":
     dependencies:
       "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
       "@wry/caches": 1.0.1
@@ -18579,13 +19211,13 @@ snapshots:
       tslib: 2.8.1
       zen-observable-ts: 1.2.5
     optionalDependencies:
-      graphql-ws: 6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      graphql-ws: 6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       react: 19.2.3
       react-dom: 19.2.3(react@19.2.3)
     transitivePeerDependencies:
       - "@types/react"
 
-  "@apollo/client@3.14.0(@types/react@19.2.8)(graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@18.3.1))(react@18.3.1)":
+  "@apollo/client@3.14.0(@types/react@19.2.8)(graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)))(graphql@16.12.0)(react-dom@19.2.3(react@18.3.1))(react@18.3.1)":
     dependencies:
       "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
       "@wry/caches": 1.0.1
@@ -18602,7 +19234,7 @@ snapshots:
       tslib: 2.8.1
       zen-observable-ts: 1.2.5
     optionalDependencies:
-      graphql-ws: 6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      graphql-ws: 6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       react: 18.3.1
       react-dom: 19.2.3(react@18.3.1)
     transitivePeerDependencies:
@@ -18612,10 +19244,10 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/generator": 7.28.0
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.28.6
       "@babel/runtime": 7.27.6
       "@babel/traverse": 7.28.5
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
       babel-preset-fbjs: 3.4.0(@babel/core@7.28.5)
       chalk: 4.1.2
       fb-watchman: 2.0.2
@@ -18635,7 +19267,7 @@ snapshots:
   "@ardatan/relay-compiler@12.0.3(graphql@16.12.0)":
     dependencies:
       "@babel/generator": 7.28.0
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.28.6
       "@babel/runtime": 7.27.6
       chalk: 4.1.2
       fb-watchman: 2.0.2
@@ -18665,6 +19297,12 @@ snapshots:
       js-tokens: 4.0.0
       picocolors: 1.1.1
 
+  "@babel/code-frame@7.29.0":
+    dependencies:
+      "@babel/helper-validator-identifier": 7.28.5
+      js-tokens: 4.0.0
+      picocolors: 1.1.1
+
   "@babel/compat-data@7.28.0": {}
 
   "@babel/compat-data@7.28.6": {}
@@ -18677,10 +19315,10 @@ snapshots:
       "@babel/helper-compilation-targets": 7.27.2
       "@babel/helper-module-transforms": 7.27.3(@babel/core@7.28.0)
       "@babel/helpers": 7.27.6
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.28.6
       "@babel/template": 7.27.2
       "@babel/traverse": 7.28.0
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
       convert-source-map: 2.0.0
       debug: 4.4.3
       gensync: 1.0.0-beta.2
@@ -18709,6 +19347,26 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@babel/core@7.29.0":
+    dependencies:
+      "@babel/code-frame": 7.29.0
+      "@babel/generator": 7.29.1
+      "@babel/helper-compilation-targets": 7.28.6
+      "@babel/helper-module-transforms": 7.28.6(@babel/core@7.29.0)
+      "@babel/helpers": 7.28.6
+      "@babel/parser": 7.29.0
+      "@babel/template": 7.28.6
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
+      "@jridgewell/remapping": 2.3.5
+      convert-source-map: 2.0.0
+      debug: 4.4.3
+      gensync: 1.0.0-beta.2
+      json5: 2.2.3
+      semver: 6.3.1
+    transitivePeerDependencies:
+      - supports-color
+
   "@babel/generator@7.28.0":
     dependencies:
       "@babel/parser": 7.28.0
@@ -18719,8 +19377,8 @@ snapshots:
 
   "@babel/generator@7.28.5":
     dependencies:
-      "@babel/parser": 7.28.5
-      "@babel/types": 7.28.5
+      "@babel/parser": 7.28.6
+      "@babel/types": 7.28.6
       "@jridgewell/gen-mapping": 0.3.13
       "@jridgewell/trace-mapping": 0.3.31
       jsesc: 3.1.0
@@ -18733,9 +19391,17 @@ snapshots:
       "@jridgewell/trace-mapping": 0.3.31
       jsesc: 3.1.0
 
+  "@babel/generator@7.29.1":
+    dependencies:
+      "@babel/parser": 7.29.0
+      "@babel/types": 7.29.0
+      "@jridgewell/gen-mapping": 0.3.13
+      "@jridgewell/trace-mapping": 0.3.31
+      jsesc: 3.1.0
+
   "@babel/helper-annotate-as-pure@7.27.3":
     dependencies:
-      "@babel/types": 7.28.1
+      "@babel/types": 7.29.0
 
   "@babel/helper-compilation-targets@7.27.2":
     dependencies:
@@ -18774,7 +19440,7 @@ snapshots:
       "@babel/helper-optimise-call-expression": 7.27.1
       "@babel/helper-replace-supers": 7.28.6(@babel/core@7.28.5)
       "@babel/helper-skip-transparent-expression-wrappers": 7.27.1
-      "@babel/traverse": 7.28.6
+      "@babel/traverse": 7.29.0
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
@@ -18809,28 +19475,28 @@ snapshots:
   "@babel/helper-member-expression-to-functions@7.27.1":
     dependencies:
       "@babel/traverse": 7.28.0
-      "@babel/types": 7.28.1
+      "@babel/types": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
   "@babel/helper-member-expression-to-functions@7.28.5":
     dependencies:
-      "@babel/traverse": 7.28.6
-      "@babel/types": 7.28.5
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
   "@babel/helper-module-imports@7.27.1":
     dependencies:
       "@babel/traverse": 7.28.0
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
     transitivePeerDependencies:
       - supports-color
 
   "@babel/helper-module-imports@7.28.6":
     dependencies:
-      "@babel/traverse": 7.28.6
-      "@babel/types": 7.28.6
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
@@ -18838,8 +19504,8 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.0
       "@babel/helper-module-imports": 7.27.1
-      "@babel/helper-validator-identifier": 7.27.1
-      "@babel/traverse": 7.28.0
+      "@babel/helper-validator-identifier": 7.28.5
+      "@babel/traverse": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
@@ -18847,8 +19513,8 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/helper-module-imports": 7.27.1
-      "@babel/helper-validator-identifier": 7.27.1
-      "@babel/traverse": 7.28.0
+      "@babel/helper-validator-identifier": 7.28.5
+      "@babel/traverse": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
@@ -18866,13 +19532,22 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-module-imports": 7.28.6
       "@babel/helper-validator-identifier": 7.28.5
-      "@babel/traverse": 7.28.6
+      "@babel/traverse": 7.29.0
+    transitivePeerDependencies:
+      - supports-color
+
+  "@babel/helper-module-transforms@7.28.6(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-module-imports": 7.28.6
+      "@babel/helper-validator-identifier": 7.28.5
+      "@babel/traverse": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
   "@babel/helper-optimise-call-expression@7.27.1":
     dependencies:
-      "@babel/types": 7.28.1
+      "@babel/types": 7.29.0
 
   "@babel/helper-plugin-utils@7.27.1": {}
 
@@ -18892,7 +19567,7 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-member-expression-to-functions": 7.27.1
       "@babel/helper-optimise-call-expression": 7.27.1
-      "@babel/traverse": 7.28.0
+      "@babel/traverse": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
@@ -18907,8 +19582,8 @@ snapshots:
 
   "@babel/helper-skip-transparent-expression-wrappers@7.27.1":
     dependencies:
-      "@babel/traverse": 7.28.0
-      "@babel/types": 7.28.1
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
@@ -18922,34 +19597,43 @@ snapshots:
 
   "@babel/helper-wrap-function@7.27.1":
     dependencies:
-      "@babel/template": 7.27.2
+      "@babel/template": 7.28.6
       "@babel/traverse": 7.28.6
-      "@babel/types": 7.28.5
+      "@babel/types": 7.29.0
     transitivePeerDependencies:
       - supports-color
 
   "@babel/helpers@7.27.6":
     dependencies:
       "@babel/template": 7.27.2
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
 
   "@babel/helpers@7.28.4":
     dependencies:
       "@babel/template": 7.27.2
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
+
+  "@babel/helpers@7.28.6":
+    dependencies:
+      "@babel/template": 7.28.6
+      "@babel/types": 7.29.0
 
   "@babel/parser@7.28.0":
     dependencies:
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
 
   "@babel/parser@7.28.5":
     dependencies:
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
 
   "@babel/parser@7.28.6":
     dependencies:
       "@babel/types": 7.28.6
 
+  "@babel/parser@7.29.0":
+    dependencies:
+      "@babel/types": 7.29.0
+
   "@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.28.5(@babel/core@7.28.5)":
     dependencies:
       "@babel/core": 7.28.5
@@ -18997,7 +19681,7 @@ snapshots:
     dependencies:
       "@babel/compat-data": 7.28.0
       "@babel/core": 7.28.5
-      "@babel/helper-compilation-targets": 7.27.2
+      "@babel/helper-compilation-targets": 7.28.6
       "@babel/helper-plugin-utils": 7.27.1
       "@babel/plugin-syntax-object-rest-spread": 7.8.3(@babel/core@7.28.5)
       "@babel/plugin-transform-parameters": 7.27.7(@babel/core@7.28.5)
@@ -19017,6 +19701,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-async-generators@7.8.4(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19027,6 +19717,12 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.27.1
 
+  "@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19037,6 +19733,12 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.27.1
 
+  "@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19048,6 +19750,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-dynamic-import@7.8.3(@babel/core@7.28.5)":
     dependencies:
       "@babel/core": 7.28.5
@@ -19073,6 +19781,11 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.28.6
 
+  "@babel/plugin-syntax-import-assertions@7.28.6(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.28.6
+
   "@babel/plugin-syntax-import-attributes@7.27.1(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19084,6 +19797,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-import-attributes@7.27.1(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-import-attributes@7.28.6(@babel/core@7.28.5)":
     dependencies:
       "@babel/core": 7.28.5
@@ -19100,6 +19819,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19111,6 +19836,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-jsx@7.27.1(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19132,6 +19863,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-logical-assignment-operators@7.10.4(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-nullish-coalescing-operator@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19143,6 +19880,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-nullish-coalescing-operator@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19154,6 +19897,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19164,6 +19913,12 @@ snapshots:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.27.1
 
+  "@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19175,6 +19930,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-optional-chaining@7.8.3(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19186,6 +19947,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-optional-chaining@7.8.3(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19197,6 +19964,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19208,6 +19981,12 @@ snapshots:
       "@babel/helper-plugin-utils": 7.27.1
     optional: true
 
+  "@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.29.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/helper-plugin-utils": 7.27.1
+    optional: true
+
   "@babel/plugin-syntax-typescript@7.27.1(@babel/core@7.28.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -19290,11 +20069,11 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/helper-annotate-as-pure": 7.27.3
-      "@babel/helper-compilation-targets": 7.27.2
+      "@babel/helper-compilation-targets": 7.28.6
       "@babel/helper-globals": 7.28.0
       "@babel/helper-plugin-utils": 7.27.1
       "@babel/helper-replace-supers": 7.27.1(@babel/core@7.28.5)
-      "@babel/traverse": 7.28.0
+      "@babel/traverse": 7.28.5
     transitivePeerDependencies:
       - supports-color
 
@@ -19314,7 +20093,7 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.27.1
-      "@babel/template": 7.27.2
+      "@babel/template": 7.28.6
 
   "@babel/plugin-transform-computed-properties@7.28.6(@babel/core@7.28.5)":
     dependencies:
@@ -19326,7 +20105,7 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.27.1
-      "@babel/traverse": 7.28.0
+      "@babel/traverse": 7.28.5
     transitivePeerDependencies:
       - supports-color
 
@@ -19567,7 +20346,7 @@ snapshots:
       "@babel/helper-module-imports": 7.27.1
       "@babel/helper-plugin-utils": 7.27.1
       "@babel/plugin-syntax-jsx": 7.27.1(@babel/core@7.28.5)
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
     transitivePeerDependencies:
       - supports-color
 
@@ -19755,7 +20534,7 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.5
       "@babel/helper-plugin-utils": 7.28.6
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
       esutils: 2.0.3
 
   "@babel/preset-react@7.28.5(@babel/core@7.28.5)":
@@ -19785,6 +20564,8 @@ snapshots:
 
   "@babel/runtime@7.28.4": {}
 
+  "@babel/runtime@7.28.6": {}
+
   "@babel/template@7.27.2":
     dependencies:
       "@babel/code-frame": 7.27.1
@@ -19794,17 +20575,17 @@ snapshots:
   "@babel/template@7.28.6":
     dependencies:
       "@babel/code-frame": 7.28.6
-      "@babel/parser": 7.28.6
-      "@babel/types": 7.28.6
+      "@babel/parser": 7.29.0
+      "@babel/types": 7.29.0
 
   "@babel/traverse@7.28.0":
     dependencies:
       "@babel/code-frame": 7.27.1
       "@babel/generator": 7.28.0
       "@babel/helper-globals": 7.28.0
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.28.6
       "@babel/template": 7.27.2
-      "@babel/types": 7.28.1
+      "@babel/types": 7.28.6
       debug: 4.4.3
     transitivePeerDependencies:
       - supports-color
@@ -19814,9 +20595,9 @@ snapshots:
       "@babel/code-frame": 7.27.1
       "@babel/generator": 7.28.5
       "@babel/helper-globals": 7.28.0
-      "@babel/parser": 7.28.5
+      "@babel/parser": 7.28.6
       "@babel/template": 7.27.2
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
       debug: 4.4.3
     transitivePeerDependencies:
       - supports-color
@@ -19833,6 +20614,18 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@babel/traverse@7.29.0":
+    dependencies:
+      "@babel/code-frame": 7.29.0
+      "@babel/generator": 7.29.1
+      "@babel/helper-globals": 7.28.0
+      "@babel/parser": 7.29.0
+      "@babel/template": 7.28.6
+      "@babel/types": 7.29.0
+      debug: 4.4.3
+    transitivePeerDependencies:
+      - supports-color
+
   "@babel/types@7.28.1":
     dependencies:
       "@babel/helper-string-parser": 7.27.1
@@ -19848,6 +20641,11 @@ snapshots:
       "@babel/helper-string-parser": 7.27.1
       "@babel/helper-validator-identifier": 7.28.5
 
+  "@babel/types@7.29.0":
+    dependencies:
+      "@babel/helper-string-parser": 7.27.1
+      "@babel/helper-validator-identifier": 7.28.5
+
   "@base-org/account@2.4.0(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)":
     dependencies:
       "@coinbase/cdp-sdk": 1.38.6(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(typescript@5.9.3)(utf-8-validate@5.0.10)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
@@ -19857,7 +20655,7 @@ snapshots:
       idb-keyval: 6.2.1
       ox: 0.6.9(typescript@5.9.3)(zod@3.25.76)
       preact: 10.24.2
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zustand: 5.0.3(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
     transitivePeerDependencies:
       - "@types/react"
@@ -19875,13 +20673,15 @@ snapshots:
 
   "@bcoe/v8-coverage@0.2.3": {}
 
-  "@chromatic-com/storybook@4.1.3(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
+  "@bcoe/v8-coverage@1.0.2": {}
+
+  "@chromatic-com/storybook@4.1.3(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
     dependencies:
       "@neoconfetti/react": 1.0.0
       chromatic: 13.3.4
       filesize: 10.1.6
       jsonfile: 6.1.0
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
       strip-ansi: 7.1.0
     transitivePeerDependencies:
       - "@chromatic-com/cypress"
@@ -19894,12 +20694,12 @@ snapshots:
       "@solana/kit": 3.0.3(fastestsmallesttextencoderdecoder@1.0.22)(typescript@5.9.3)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       "@solana/web3.js": 1.98.4(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)
       abitype: 1.0.6(typescript@5.9.3)(zod@3.25.76)
-      axios: 1.13.2
-      axios-retry: 4.5.0(axios@1.13.2)
+      axios: 1.13.5
+      axios-retry: 4.5.0(axios@1.13.5)
       jose: 6.1.3
       md5: 2.3.0
       uncrypto: 0.1.3
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zod: 3.25.76
     transitivePeerDependencies:
       - bufferutil
@@ -19917,9 +20717,9 @@ snapshots:
       clsx: 1.2.1
       eth-block-tracker: 7.1.0
       eth-json-rpc-filters: 6.0.1
-      eventemitter3: 5.0.1
+      eventemitter3: 5.0.4
       keccak: 3.0.4
-      preact: 10.28.0
+      preact: 10.28.3
       sha.js: 2.4.12
     transitivePeerDependencies:
       - supports-color
@@ -19932,7 +20732,7 @@ snapshots:
       idb-keyval: 6.2.1
       ox: 0.6.9(typescript@5.9.3)(zod@3.25.76)
       preact: 10.24.2
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zustand: 5.0.3(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
     transitivePeerDependencies:
       - "@types/react"
@@ -19948,11 +20748,11 @@ snapshots:
     dependencies:
       commander: 12.1.0
 
-  "@commitlint/cli@19.8.1(@types/node@20.19.25)(typescript@5.9.3)":
+  "@commitlint/cli@19.8.1(@types/node@20.19.33)(typescript@5.9.3)":
     dependencies:
       "@commitlint/format": 19.8.1
       "@commitlint/lint": 19.8.1
-      "@commitlint/load": 19.8.1(@types/node@20.19.25)(typescript@5.9.3)
+      "@commitlint/load": 19.8.1(@types/node@20.19.33)(typescript@5.9.3)
       "@commitlint/read": 19.8.1
       "@commitlint/types": 19.8.1
       tinyexec: 1.0.1
@@ -19999,7 +20799,7 @@ snapshots:
       "@commitlint/rules": 19.8.1
       "@commitlint/types": 19.8.1
 
-  "@commitlint/load@19.8.1(@types/node@20.19.25)(typescript@5.9.3)":
+  "@commitlint/load@19.8.1(@types/node@20.19.33)(typescript@5.9.3)":
     dependencies:
       "@commitlint/config-validator": 19.8.1
       "@commitlint/execute-rule": 19.8.1
@@ -20007,7 +20807,7 @@ snapshots:
       "@commitlint/types": 19.8.1
       chalk: 5.4.1
       cosmiconfig: 9.0.0(typescript@5.9.3)
-      cosmiconfig-typescript-loader: 6.1.0(@types/node@20.19.25)(cosmiconfig@9.0.0(typescript@5.9.3))(typescript@5.9.3)
+      cosmiconfig-typescript-loader: 6.1.0(@types/node@20.19.33)(cosmiconfig@9.0.0(typescript@5.9.3))(typescript@5.9.3)
       lodash.isplainobject: 4.0.6
       lodash.merge: 4.6.2
       lodash.uniq: 4.5.0
@@ -20070,6 +20870,8 @@ snapshots:
 
   "@electric-sql/pglite@0.2.13": {}
 
+  "@electric-sql/pglite@0.3.15": {}
+
   "@emnapi/core@1.4.5":
     dependencies:
       "@emnapi/wasi-threads": 1.0.4
@@ -20097,14 +20899,21 @@ snapshots:
       "@whatwg-node/promise-helpers": 1.3.2
       tslib: 2.8.1
 
-  "@envelop/extended-validation@7.0.0(@envelop/core@5.4.0)(graphql@16.12.0)":
+  "@envelop/core@5.5.0":
+    dependencies:
+      "@envelop/instrumentation": 1.0.0
+      "@envelop/types": 5.2.1
+      "@whatwg-node/promise-helpers": 1.3.2
+      tslib: 2.8.1
+
+  "@envelop/extended-validation@7.1.0(@envelop/core@5.4.0)(graphql@16.12.0)":
     dependencies:
       "@envelop/core": 5.4.0
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@envelop/graphql-jit@11.0.0(@envelop/core@5.4.0)(graphql@16.12.0)":
+  "@envelop/graphql-jit@11.1.0(@envelop/core@5.4.0)(graphql@16.12.0)":
     dependencies:
       "@envelop/core": 5.4.0
       "@whatwg-node/promise-helpers": 1.3.2
@@ -20130,11 +20939,14 @@ snapshots:
   "@esbuild-kit/esm-loader@2.6.5":
     dependencies:
       "@esbuild-kit/core-utils": 3.3.2
-      get-tsconfig: 4.10.1
+      get-tsconfig: 4.13.6
 
   "@esbuild/aix-ppc64@0.21.5":
     optional: true
 
+  "@esbuild/aix-ppc64@0.25.12":
+    optional: true
+
   "@esbuild/aix-ppc64@0.25.8":
     optional: true
 
@@ -20147,6 +20959,9 @@ snapshots:
   "@esbuild/android-arm64@0.21.5":
     optional: true
 
+  "@esbuild/android-arm64@0.25.12":
+    optional: true
+
   "@esbuild/android-arm64@0.25.8":
     optional: true
 
@@ -20159,6 +20974,9 @@ snapshots:
   "@esbuild/android-arm@0.21.5":
     optional: true
 
+  "@esbuild/android-arm@0.25.12":
+    optional: true
+
   "@esbuild/android-arm@0.25.8":
     optional: true
 
@@ -20171,6 +20989,9 @@ snapshots:
   "@esbuild/android-x64@0.21.5":
     optional: true
 
+  "@esbuild/android-x64@0.25.12":
+    optional: true
+
   "@esbuild/android-x64@0.25.8":
     optional: true
 
@@ -20183,6 +21004,9 @@ snapshots:
   "@esbuild/darwin-arm64@0.21.5":
     optional: true
 
+  "@esbuild/darwin-arm64@0.25.12":
+    optional: true
+
   "@esbuild/darwin-arm64@0.25.8":
     optional: true
 
@@ -20195,6 +21019,9 @@ snapshots:
   "@esbuild/darwin-x64@0.21.5":
     optional: true
 
+  "@esbuild/darwin-x64@0.25.12":
+    optional: true
+
   "@esbuild/darwin-x64@0.25.8":
     optional: true
 
@@ -20207,6 +21034,9 @@ snapshots:
   "@esbuild/freebsd-arm64@0.21.5":
     optional: true
 
+  "@esbuild/freebsd-arm64@0.25.12":
+    optional: true
+
   "@esbuild/freebsd-arm64@0.25.8":
     optional: true
 
@@ -20219,6 +21049,9 @@ snapshots:
   "@esbuild/freebsd-x64@0.21.5":
     optional: true
 
+  "@esbuild/freebsd-x64@0.25.12":
+    optional: true
+
   "@esbuild/freebsd-x64@0.25.8":
     optional: true
 
@@ -20231,6 +21064,9 @@ snapshots:
   "@esbuild/linux-arm64@0.21.5":
     optional: true
 
+  "@esbuild/linux-arm64@0.25.12":
+    optional: true
+
   "@esbuild/linux-arm64@0.25.8":
     optional: true
 
@@ -20243,6 +21079,9 @@ snapshots:
   "@esbuild/linux-arm@0.21.5":
     optional: true
 
+  "@esbuild/linux-arm@0.25.12":
+    optional: true
+
   "@esbuild/linux-arm@0.25.8":
     optional: true
 
@@ -20255,6 +21094,9 @@ snapshots:
   "@esbuild/linux-ia32@0.21.5":
     optional: true
 
+  "@esbuild/linux-ia32@0.25.12":
+    optional: true
+
   "@esbuild/linux-ia32@0.25.8":
     optional: true
 
@@ -20267,6 +21109,9 @@ snapshots:
   "@esbuild/linux-loong64@0.21.5":
     optional: true
 
+  "@esbuild/linux-loong64@0.25.12":
+    optional: true
+
   "@esbuild/linux-loong64@0.25.8":
     optional: true
 
@@ -20279,6 +21124,9 @@ snapshots:
   "@esbuild/linux-mips64el@0.21.5":
     optional: true
 
+  "@esbuild/linux-mips64el@0.25.12":
+    optional: true
+
   "@esbuild/linux-mips64el@0.25.8":
     optional: true
 
@@ -20291,6 +21139,9 @@ snapshots:
   "@esbuild/linux-ppc64@0.21.5":
     optional: true
 
+  "@esbuild/linux-ppc64@0.25.12":
+    optional: true
+
   "@esbuild/linux-ppc64@0.25.8":
     optional: true
 
@@ -20303,6 +21154,9 @@ snapshots:
   "@esbuild/linux-riscv64@0.21.5":
     optional: true
 
+  "@esbuild/linux-riscv64@0.25.12":
+    optional: true
+
   "@esbuild/linux-riscv64@0.25.8":
     optional: true
 
@@ -20315,6 +21169,9 @@ snapshots:
   "@esbuild/linux-s390x@0.21.5":
     optional: true
 
+  "@esbuild/linux-s390x@0.25.12":
+    optional: true
+
   "@esbuild/linux-s390x@0.25.8":
     optional: true
 
@@ -20327,12 +21184,18 @@ snapshots:
   "@esbuild/linux-x64@0.21.5":
     optional: true
 
+  "@esbuild/linux-x64@0.25.12":
+    optional: true
+
   "@esbuild/linux-x64@0.25.8":
     optional: true
 
   "@esbuild/linux-x64@0.27.1":
     optional: true
 
+  "@esbuild/netbsd-arm64@0.25.12":
+    optional: true
+
   "@esbuild/netbsd-arm64@0.25.8":
     optional: true
 
@@ -20345,12 +21208,18 @@ snapshots:
   "@esbuild/netbsd-x64@0.21.5":
     optional: true
 
+  "@esbuild/netbsd-x64@0.25.12":
+    optional: true
+
   "@esbuild/netbsd-x64@0.25.8":
     optional: true
 
   "@esbuild/netbsd-x64@0.27.1":
     optional: true
 
+  "@esbuild/openbsd-arm64@0.25.12":
+    optional: true
+
   "@esbuild/openbsd-arm64@0.25.8":
     optional: true
 
@@ -20363,12 +21232,18 @@ snapshots:
   "@esbuild/openbsd-x64@0.21.5":
     optional: true
 
+  "@esbuild/openbsd-x64@0.25.12":
+    optional: true
+
   "@esbuild/openbsd-x64@0.25.8":
     optional: true
 
   "@esbuild/openbsd-x64@0.27.1":
     optional: true
 
+  "@esbuild/openharmony-arm64@0.25.12":
+    optional: true
+
   "@esbuild/openharmony-arm64@0.25.8":
     optional: true
 
@@ -20381,6 +21256,9 @@ snapshots:
   "@esbuild/sunos-x64@0.21.5":
     optional: true
 
+  "@esbuild/sunos-x64@0.25.12":
+    optional: true
+
   "@esbuild/sunos-x64@0.25.8":
     optional: true
 
@@ -20393,6 +21271,9 @@ snapshots:
   "@esbuild/win32-arm64@0.21.5":
     optional: true
 
+  "@esbuild/win32-arm64@0.25.12":
+    optional: true
+
   "@esbuild/win32-arm64@0.25.8":
     optional: true
 
@@ -20405,6 +21286,9 @@ snapshots:
   "@esbuild/win32-ia32@0.21.5":
     optional: true
 
+  "@esbuild/win32-ia32@0.25.12":
+    optional: true
+
   "@esbuild/win32-ia32@0.25.8":
     optional: true
 
@@ -20417,6 +21301,9 @@ snapshots:
   "@esbuild/win32-x64@0.21.5":
     optional: true
 
+  "@esbuild/win32-x64@0.25.12":
+    optional: true
+
   "@esbuild/win32-x64@0.25.8":
     optional: true
 
@@ -20824,11 +21711,11 @@ snapshots:
 
   "@floating-ui/utils@0.2.10": {}
 
-  "@gemini-wallet/core@0.3.2(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
+  "@gemini-wallet/core@0.3.2(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
     dependencies:
       "@metamask/rpc-errors": 7.0.2
       eventemitter3: 5.0.1
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - supports-color
 
@@ -20838,7 +21725,7 @@ snapshots:
       graphql: 16.12.0
       tslib: 2.6.3
 
-  "@graphql-codegen/cli@5.0.7(@parcel/watcher@2.5.1)(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)":
+  "@graphql-codegen/cli@5.0.7(@parcel/watcher@2.5.6)(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)":
     dependencies:
       "@babel/generator": 7.28.0
       "@babel/template": 7.27.2
@@ -20849,12 +21736,12 @@ snapshots:
       "@graphql-tools/apollo-engine-loader": 8.0.22(graphql@16.12.0)
       "@graphql-tools/code-file-loader": 8.1.22(graphql@16.12.0)
       "@graphql-tools/git-loader": 8.0.26(graphql@16.12.0)
-      "@graphql-tools/github-loader": 8.0.22(@types/node@20.19.25)(graphql@16.12.0)
+      "@graphql-tools/github-loader": 8.0.22(@types/node@20.19.33)(graphql@16.12.0)
       "@graphql-tools/graphql-file-loader": 8.0.22(graphql@16.12.0)
       "@graphql-tools/json-file-loader": 8.0.20(graphql@16.12.0)
       "@graphql-tools/load": 8.1.2(graphql@16.12.0)
-      "@graphql-tools/prisma-loader": 8.0.17(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
-      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/prisma-loader": 8.0.17(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@whatwg-node/fetch": 0.10.9
       chalk: 4.1.2
@@ -20862,7 +21749,7 @@ snapshots:
       debounce: 1.2.1
       detect-indent: 6.1.0
       graphql: 16.12.0
-      graphql-config: 5.1.5(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)
+      graphql-config: 5.1.5(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10)
       inquirer: 8.2.6
       is-glob: 4.0.3
       jiti: 1.21.7
@@ -20877,7 +21764,7 @@ snapshots:
       yaml: 2.8.0
       yargs: 17.7.2
     optionalDependencies:
-      "@parcel/watcher": 2.5.1
+      "@parcel/watcher": 2.5.6
     transitivePeerDependencies:
       - "@fastify/websocket"
       - "@types/node"
@@ -20889,7 +21776,6 @@ snapshots:
       - graphql-sock
       - supports-color
       - typescript
-      - uWebSockets.js
       - utf-8-validate
 
   "@graphql-codegen/client-preset@4.8.3(graphql@16.12.0)":
@@ -20923,7 +21809,7 @@ snapshots:
     dependencies:
       "@graphql-codegen/plugin-helpers": 6.1.0(graphql@16.12.0)
       "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.6.3
 
@@ -20931,7 +21817,7 @@ snapshots:
     dependencies:
       "@graphql-codegen/plugin-helpers": 5.1.1(graphql@16.12.0)
       "@graphql-codegen/visitor-plugin-common": 5.8.0(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       auto-bind: 4.0.0
       graphql: 16.12.0
       tslib: 2.6.3
@@ -20971,7 +21857,7 @@ snapshots:
   "@graphql-codegen/schema-ast@4.1.0(graphql@16.12.0)":
     dependencies:
       "@graphql-codegen/plugin-helpers": 5.1.1(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.6.3
 
@@ -20993,10 +21879,10 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
-  "@graphql-codegen/typed-document-node@6.1.4(graphql@16.12.0)":
+  "@graphql-codegen/typed-document-node@6.1.5(graphql@16.12.0)":
     dependencies:
       "@graphql-codegen/plugin-helpers": 6.1.0(graphql@16.12.0)
-      "@graphql-codegen/visitor-plugin-common": 6.2.1(graphql@16.12.0)
+      "@graphql-codegen/visitor-plugin-common": 6.2.2(graphql@16.12.0)
       auto-bind: 4.0.0
       change-case-all: 1.0.15
       graphql: 16.12.0
@@ -21004,7 +21890,7 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
-  "@graphql-codegen/typescript-generic-sdk@4.0.2(graphql-tag@2.12.6(graphql@16.12.0))(graphql@16.12.0)":
+  "@graphql-codegen/typescript-generic-sdk@4.1.0(graphql-tag@2.12.6(graphql@16.12.0))(graphql@16.12.0)":
     dependencies:
       "@graphql-codegen/plugin-helpers": 3.1.2(graphql@16.12.0)
       "@graphql-codegen/visitor-plugin-common": 2.13.8(graphql@16.12.0)
@@ -21038,7 +21924,7 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
-  "@graphql-codegen/typescript-react-apollo@4.3.3(graphql@16.12.0)":
+  "@graphql-codegen/typescript-react-apollo@4.4.0(graphql@16.12.0)":
     dependencies:
       "@graphql-codegen/plugin-helpers": 3.1.2(graphql@16.12.0)
       "@graphql-codegen/visitor-plugin-common": 2.13.8(graphql@16.12.0)
@@ -21055,7 +21941,7 @@ snapshots:
       "@graphql-codegen/plugin-helpers": 6.1.0(graphql@16.12.0)
       "@graphql-codegen/typescript": 5.0.6(graphql@16.12.0)
       "@graphql-codegen/visitor-plugin-common": 6.2.1(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       auto-bind: 4.0.0
       graphql: 16.12.0
       tslib: 2.6.3
@@ -21106,7 +21992,7 @@ snapshots:
       "@graphql-codegen/plugin-helpers": 5.1.1(graphql@16.12.0)
       "@graphql-tools/optimize": 2.0.0(graphql@16.12.0)
       "@graphql-tools/relay-operation-optimizer": 7.0.21(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       auto-bind: 4.0.0
       change-case-all: 1.0.15
       dependency-graph: 0.11.0
@@ -21133,7 +22019,23 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
-  "@graphql-hive/logger@1.0.9": {}
+  "@graphql-codegen/visitor-plugin-common@6.2.2(graphql@16.12.0)":
+    dependencies:
+      "@graphql-codegen/plugin-helpers": 6.1.0(graphql@16.12.0)
+      "@graphql-tools/optimize": 2.0.0(graphql@16.12.0)
+      "@graphql-tools/relay-operation-optimizer": 7.0.27(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      auto-bind: 4.0.0
+      change-case-all: 1.0.15
+      dependency-graph: 1.0.0
+      graphql: 16.12.0
+      graphql-tag: 2.12.6(graphql@16.12.0)
+      parse-filepath: 1.0.2
+      tslib: 2.6.3
+    transitivePeerDependencies:
+      - encoding
+
+  "@graphql-hive/logger@1.0.10": {}
 
   "@graphql-hive/pubsub@2.1.1":
     dependencies:
@@ -21145,17 +22047,17 @@ snapshots:
 
   "@graphql-hive/signal@2.0.0": {}
 
-  "@graphql-inspector/core@7.0.3(graphql@16.12.0)":
+  "@graphql-inspector/core@7.1.2(graphql@16.12.0)":
     dependencies:
       dependency-graph: 1.0.0
       graphql: 16.12.0
       object-inspect: 1.13.2
       tslib: 2.6.2
 
-  "@graphql-mesh/cache-inmemory-lru@0.8.18(graphql@16.12.0)":
+  "@graphql-mesh/cache-inmemory-lru@0.8.23(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
       "@whatwg-node/disposablestack": 0.0.6
       graphql: 16.12.0
       tslib: 2.8.1
@@ -21163,11 +22065,11 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/cache-localforage@0.105.18(graphql@16.12.0)":
+  "@graphql-mesh/cache-localforage@0.105.23(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/cache-inmemory-lru": 0.8.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
+      "@graphql-mesh/cache-inmemory-lru": 0.8.23(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
       graphql: 16.12.0
       localforage: 1.10.0
       tslib: 2.8.1
@@ -21175,32 +22077,32 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/cli@0.100.20(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-mesh/cli@0.100.27(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
       "@graphql-codegen/core": 5.0.0(graphql@16.12.0)
-      "@graphql-codegen/typed-document-node": 6.1.4(graphql@16.12.0)
+      "@graphql-codegen/typed-document-node": 6.1.5(graphql@16.12.0)
       "@graphql-codegen/typescript": 5.0.6(graphql@16.12.0)
-      "@graphql-codegen/typescript-generic-sdk": 4.0.2(graphql-tag@2.12.6(graphql@16.12.0))(graphql@16.12.0)
+      "@graphql-codegen/typescript-generic-sdk": 4.1.0(graphql-tag@2.12.6(graphql@16.12.0))(graphql@16.12.0)
       "@graphql-codegen/typescript-operations": 5.0.6(graphql@16.12.0)
       "@graphql-codegen/typescript-resolvers": 5.1.4(graphql@16.12.0)
-      "@graphql-mesh/config": 0.108.20(graphql@16.12.0)
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/http": 0.106.18(graphql@16.12.0)
-      "@graphql-mesh/include": 0.3.17(graphql@16.12.0)
-      "@graphql-mesh/runtime": 0.106.18(graphql@16.12.0)
-      "@graphql-mesh/store": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-mesh/config": 0.108.27(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/http": 0.106.25(graphql@16.12.0)
+      "@graphql-mesh/include": 0.3.22(graphql@16.12.0)
+      "@graphql-mesh/runtime": 0.106.24(graphql@16.12.0)
+      "@graphql-mesh/store": 0.104.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       ajv: 8.17.1
       change-case: 4.1.2
       cosmiconfig: 9.0.0(typescript@5.9.3)
-      dotenv: 17.2.3
+      dotenv: 17.2.4
       graphql: 16.12.0
       graphql-import-node: 0.0.5(graphql@16.12.0)
       graphql-tag: 2.12.6(graphql@16.12.0)
-      graphql-ws: 6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      graphql-ws: 6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       json-bigint-patch: 0.0.9
       json5: 2.2.3
       mkdirp: 3.0.1
@@ -21209,7 +22111,7 @@ snapshots:
       rimraf: 6.1.2
       tslib: 2.8.1
       typescript: 5.9.3
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
       yargs: 17.7.2
     transitivePeerDependencies:
       - "@fastify/websocket"
@@ -21220,29 +22122,28 @@ snapshots:
       - graphql-sock
       - ioredis
       - supports-color
-      - uWebSockets.js
       - utf-8-validate
 
-  "@graphql-mesh/config@0.108.20(graphql@16.12.0)":
+  "@graphql-mesh/config@0.108.27(graphql@16.12.0)":
     dependencies:
       "@envelop/core": 5.4.0
-      "@graphql-mesh/cache-localforage": 0.105.18(graphql@16.12.0)
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/merger-bare": 0.105.18(graphql@16.12.0)
-      "@graphql-mesh/merger-stitching": 0.105.18(graphql@16.12.0)
-      "@graphql-mesh/runtime": 0.106.18(graphql@16.12.0)
-      "@graphql-mesh/store": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/code-file-loader": 8.1.22(graphql@16.12.0)
-      "@graphql-tools/graphql-file-loader": 8.0.22(graphql@16.12.0)
-      "@graphql-tools/load": 8.1.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@graphql-yoga/plugin-persisted-operations": 3.15.1(graphql-yoga@5.15.1(graphql@16.12.0))(graphql@16.12.0)
+      "@graphql-mesh/cache-localforage": 0.105.23(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/merger-bare": 0.105.24(graphql@16.12.0)
+      "@graphql-mesh/merger-stitching": 0.105.24(graphql@16.12.0)
+      "@graphql-mesh/runtime": 0.106.24(graphql@16.12.0)
+      "@graphql-mesh/store": 0.104.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/code-file-loader": 8.1.28(graphql@16.12.0)
+      "@graphql-tools/graphql-file-loader": 8.1.9(graphql@16.12.0)
+      "@graphql-tools/load": 8.1.8(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-yoga/plugin-persisted-operations": 3.18.0(graphql-yoga@5.18.0(graphql@16.12.0))(graphql@16.12.0)
       "@whatwg-node/fetch": 0.10.9
       camel-case: 4.1.2
       graphql: 16.12.0
-      graphql-yoga: 5.15.1(graphql@16.12.0)
+      graphql-yoga: 5.18.0(graphql@16.12.0)
       param-case: 3.0.4
       pascal-case: 3.1.2
       tslib: 2.8.1
@@ -21251,29 +22152,23 @@ snapshots:
       - ioredis
       - supports-color
 
-  "@graphql-mesh/cross-helpers@0.4.10(graphql@16.12.0)":
+  "@graphql-mesh/cross-helpers@0.4.12(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       path-browserify: 1.0.1
 
-  "@graphql-mesh/cross-helpers@0.4.11(graphql@16.12.0)":
+  "@graphql-mesh/fusion-composition@0.8.27(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      graphql: 16.12.0
-      path-browserify: 1.0.1
-
-  "@graphql-mesh/fusion-composition@0.8.21(graphql@16.12.0)":
-    dependencies:
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/stitching-directives": 4.0.8(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@theguild/federation-composition": 0.20.2(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/stitching-directives": 4.0.12(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@theguild/federation-composition": 0.21.3(graphql@16.12.0)
       change-case: 4.1.2
       graphql: 16.12.0
       graphql-scalars: 1.25.0(graphql@16.12.0)
-      minimatch: 10.1.1
+      minimatch: 10.1.2
       pluralize: 8.0.0
       snake-case: 3.0.4
       tslib: 2.8.1
@@ -21282,18 +22177,18 @@ snapshots:
       - ioredis
       - supports-color
 
-  "@graphql-mesh/graphql@0.104.18(@types/node@22.7.5)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
-    dependencies:
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/store": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/federation": 4.2.6(@types/node@22.7.5)(graphql@16.12.0)
-      "@graphql-tools/merge": 9.1.1(graphql@16.12.0)
-      "@graphql-tools/url-loader": 9.0.5(@types/node@22.7.5)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+  "@graphql-mesh/graphql@0.104.24(@types/node@25.2.3)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+    dependencies:
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/store": 0.104.24(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/federation": 4.2.10(@types/node@25.2.3)(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
+      "@graphql-tools/url-loader": 9.0.6(@types/node@25.2.3)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
       lodash.get: 4.4.2
@@ -21305,29 +22200,29 @@ snapshots:
       - bufferutil
       - crossws
       - ioredis
-      - uWebSockets.js
       - utf-8-validate
 
-  "@graphql-mesh/http@0.106.18(graphql@16.12.0)":
+  "@graphql-mesh/http@0.106.25(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/runtime": 0.106.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@whatwg-node/server": 0.10.10
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/runtime": 0.106.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@whatwg-node/promise-helpers": 1.3.2
+      "@whatwg-node/server": 0.10.18
       graphql: 16.12.0
-      graphql-yoga: 5.15.1(graphql@16.12.0)
+      graphql-yoga: 5.18.0(graphql@16.12.0)
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/include@0.3.17(graphql@16.12.0)":
+  "@graphql-mesh/include@0.3.22(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      dotenv: 17.2.3
-      get-tsconfig: 4.13.0
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      dotenv: 17.2.4
+      get-tsconfig: 4.13.6
       graphql: 16.12.0
       jiti: 2.6.1
       sucrase: 3.35.1
@@ -21335,41 +22230,41 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/merger-bare@0.105.18(graphql@16.12.0)":
+  "@graphql-mesh/merger-bare@0.105.24(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/merger-stitching": 0.105.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-mesh/merger-stitching": 0.105.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/merger-stitching@0.105.18(graphql@16.12.0)":
+  "@graphql-mesh/merger-stitching@0.105.24(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/store": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/stitch": 10.1.6(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-mesh/store": 0.104.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/stitch": 10.1.10(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/openapi@0.109.25(graphql@16.12.0)":
+  "@graphql-mesh/openapi@0.109.31(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/store": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@omnigraph/openapi": 0.109.24(graphql@16.12.0)
+      "@graphql-mesh/store": 0.104.24(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@omnigraph/openapi": 0.109.30(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
@@ -21380,20 +22275,20 @@ snapshots:
       - supports-color
       - winston
 
-  "@graphql-mesh/runtime@0.106.18(graphql@16.12.0)":
+  "@graphql-mesh/runtime@0.106.24(graphql@16.12.0)":
     dependencies:
       "@envelop/core": 5.4.0
-      "@envelop/extended-validation": 7.0.0(@envelop/core@5.4.0)(graphql@16.12.0)
-      "@envelop/graphql-jit": 11.0.0(@envelop/core@5.4.0)(graphql@16.12.0)
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/batch-delegate": 10.0.8(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/executor": 1.4.9(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@envelop/extended-validation": 7.1.0(@envelop/core@5.4.0)(graphql@16.12.0)
+      "@envelop/graphql-jit": 11.1.0(@envelop/core@5.4.0)(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/batch-delegate": 10.0.12(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       "@whatwg-node/fetch": 0.10.9
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
@@ -21403,20 +22298,20 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/store@0.104.18(graphql@16.12.0)":
+  "@graphql-mesh/store@0.104.24(graphql@16.12.0)":
     dependencies:
-      "@graphql-inspector/core": 7.0.3(graphql@16.12.0)
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-inspector/core": 7.1.2(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/string-interpolation@0.5.10(graphql@16.12.0)":
+  "@graphql-mesh/string-interpolation@0.5.11(graphql@16.12.0)":
     dependencies:
       dayjs: 1.11.19
       graphql: 16.12.0
@@ -21424,35 +22319,27 @@ snapshots:
       lodash.get: 4.4.2
       tslib: 2.8.1
 
-  "@graphql-mesh/string-interpolation@0.5.9(graphql@16.12.0)":
-    dependencies:
-      dayjs: 1.11.18
-      graphql: 16.12.0
-      json-pointer: 0.6.2
-      lodash.get: 4.4.2
-      tslib: 2.8.1
-
-  "@graphql-mesh/transform-filter-schema@0.104.19(graphql@16.12.0)":
+  "@graphql-mesh/transform-filter-schema@0.104.22(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.19(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       graphql: 16.12.0
-      minimatch: 10.1.1
+      minimatch: 10.1.2
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/transform-rename@0.105.18(graphql@16.12.0)":
+  "@graphql-mesh/transform-rename@0.105.23(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       graphql: 16.12.0
       graphql-scalars: 1.24.2(graphql@16.12.0)
       tslib: 2.8.1
@@ -21460,16 +22347,16 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/transport-common@1.0.12(graphql@16.12.0)":
+  "@graphql-mesh/transport-common@1.0.14(graphql@16.12.0)":
     dependencies:
-      "@envelop/core": 5.4.0
-      "@graphql-hive/logger": 1.0.9
+      "@envelop/core": 5.5.0
+      "@graphql-hive/logger": 1.0.10
       "@graphql-hive/pubsub": 2.1.1
       "@graphql-hive/signal": 2.0.0
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-tools/executor": 1.5.0(graphql@16.12.0)
-      "@graphql-tools/executor-common": 1.0.5(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/executor-common": 1.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
@@ -21479,20 +22366,20 @@ snapshots:
       - pino
       - winston
 
-  "@graphql-mesh/transport-rest@0.9.18(graphql@16.12.0)":
+  "@graphql-mesh/transport-rest@0.9.24(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/transport-common": 1.0.12(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/transport-common": 1.0.14(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/fetch": 0.10.13
       dset: 3.1.4
       graphql: 16.12.0
       graphql-fields: 2.0.3
       graphql-scalars: 1.25.0(graphql@16.12.0)
-      qs: 6.14.0
+      qs: 6.14.1
       tslib: 2.8.1
       url-join: 4.0.1
     transitivePeerDependencies:
@@ -21502,12 +22389,12 @@ snapshots:
       - pino
       - winston
 
-  "@graphql-mesh/types@0.104.18(graphql@16.12.0)":
+  "@graphql-mesh/types@0.104.20(graphql@16.12.0)":
     dependencies:
       "@graphql-hive/pubsub": 2.1.1
-      "@graphql-tools/batch-delegate": 10.0.8(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/batch-delegate": 10.0.12(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/disposablestack": 0.0.6
@@ -21517,16 +22404,16 @@ snapshots:
       - "@nats-io/nats-core"
       - ioredis
 
-  "@graphql-mesh/utils@0.104.17(graphql@16.12.0)":
+  "@graphql-mesh/utils@0.104.22(graphql@16.12.0)":
     dependencies:
       "@envelop/instrumentation": 1.0.0
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-tools/batch-delegate": 10.0.8(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-tools/batch-delegate": 10.0.12(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       "@whatwg-node/disposablestack": 0.0.6
       "@whatwg-node/fetch": 0.10.13
       "@whatwg-node/promise-helpers": 1.3.2
@@ -21535,31 +22422,7 @@ snapshots:
       js-yaml: 4.1.1
       lodash.get: 4.4.2
       lodash.topath: 4.5.2
-      tiny-lru: 11.4.5
-      tslib: 2.8.1
-    transitivePeerDependencies:
-      - "@nats-io/nats-core"
-      - ioredis
-
-  "@graphql-mesh/utils@0.104.19(graphql@16.12.0)":
-    dependencies:
-      "@envelop/instrumentation": 1.0.0
-      "@graphql-mesh/cross-helpers": 0.4.11(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.10(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-tools/batch-delegate": 10.0.8(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
-      "@whatwg-node/disposablestack": 0.0.6
-      "@whatwg-node/fetch": 0.10.13
-      "@whatwg-node/promise-helpers": 1.3.2
-      dset: 3.1.4
-      graphql: 16.12.0
-      js-yaml: 4.1.1
-      lodash.get: 4.4.2
-      lodash.topath: 4.5.2
-      tiny-lru: 11.4.5
+      tiny-lru: 11.4.7
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@nats-io/nats-core"
@@ -21573,18 +22436,18 @@ snapshots:
       sync-fetch: 0.6.0-2
       tslib: 2.8.1
 
-  "@graphql-tools/batch-delegate@10.0.8(graphql@16.12.0)":
+  "@graphql-tools/batch-delegate@10.0.12(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       dataloader: 2.2.3
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/batch-execute@10.0.4(graphql@16.12.0)":
+  "@graphql-tools/batch-execute@10.0.5(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       dataloader: 2.2.3
       graphql: 16.12.0
@@ -21592,7 +22455,7 @@ snapshots:
 
   "@graphql-tools/batch-execute@9.0.19(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       dataloader: 2.2.3
       graphql: 16.12.0
@@ -21609,12 +22472,23 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@graphql-tools/code-file-loader@8.1.28(graphql@16.12.0)":
+    dependencies:
+      "@graphql-tools/graphql-tag-pluck": 8.3.27(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      globby: 11.1.0
+      graphql: 16.12.0
+      tslib: 2.8.1
+      unixify: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   "@graphql-tools/delegate@10.2.23(graphql@16.12.0)":
     dependencies:
       "@graphql-tools/batch-execute": 9.0.19(graphql@16.12.0)
-      "@graphql-tools/executor": 1.5.0(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
       "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/promise-helpers": 1.3.2
       dataloader: 2.2.3
@@ -21622,12 +22496,12 @@ snapshots:
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/delegate@12.0.2(graphql@16.12.0)":
+  "@graphql-tools/delegate@12.0.6(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/batch-execute": 10.0.4(graphql@16.12.0)
-      "@graphql-tools/executor": 1.5.0(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/batch-execute": 10.0.5(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/promise-helpers": 1.3.2
       dataloader: 2.2.3
@@ -21642,117 +22516,115 @@ snapshots:
 
   "@graphql-tools/executor-common@0.0.4(graphql@16.12.0)":
     dependencies:
-      "@envelop/core": 5.4.0
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@envelop/core": 5.5.0
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       graphql: 16.12.0
 
-  "@graphql-tools/executor-common@1.0.5(graphql@16.12.0)":
+  "@graphql-tools/executor-common@1.0.6(graphql@16.12.0)":
     dependencies:
-      "@envelop/core": 5.4.0
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@envelop/core": 5.5.0
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
 
   "@graphql-tools/executor-graphql-ws@2.0.5(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
       "@graphql-tools/executor-common": 0.0.4(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@whatwg-node/disposablestack": 0.0.6
       graphql: 16.12.0
-      graphql-ws: 6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
-      isomorphic-ws: 5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      graphql-ws: 6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      isomorphic-ws: 5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - "@fastify/websocket"
       - bufferutil
       - crossws
-      - uWebSockets.js
       - utf-8-validate
 
-  "@graphql-tools/executor-graphql-ws@3.1.3(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-tools/executor-graphql-ws@3.1.4(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
-      "@graphql-tools/executor-common": 1.0.5(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/executor-common": 1.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/disposablestack": 0.0.6
       graphql: 16.12.0
-      graphql-ws: 6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
-      isows: 1.0.7(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      graphql-ws: 6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      isows: 1.0.7(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - "@fastify/websocket"
       - bufferutil
       - crossws
-      - uWebSockets.js
       - utf-8-validate
 
-  "@graphql-tools/executor-http@1.3.3(@types/node@20.19.25)(graphql@16.12.0)":
+  "@graphql-tools/executor-http@1.3.3(@types/node@20.19.33)(graphql@16.12.0)":
     dependencies:
       "@graphql-hive/signal": 1.0.0
       "@graphql-tools/executor-common": 0.0.4(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/disposablestack": 0.0.6
       "@whatwg-node/fetch": 0.10.9
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
-      meros: 1.3.1(@types/node@20.19.25)
+      meros: 1.3.1(@types/node@20.19.33)
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@types/node"
 
-  "@graphql-tools/executor-http@3.0.7(@types/node@22.7.5)(graphql@16.12.0)":
+  "@graphql-tools/executor-http@3.1.0(@types/node@25.2.3)(graphql@16.12.0)":
     dependencies:
       "@graphql-hive/signal": 2.0.0
-      "@graphql-tools/executor-common": 1.0.5(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/executor-common": 1.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/disposablestack": 0.0.6
       "@whatwg-node/fetch": 0.10.13
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
-      meros: 1.3.2(@types/node@22.7.5)
+      meros: 1.3.2(@types/node@25.2.3)
       tslib: 2.8.1
     transitivePeerDependencies:
       - "@types/node"
 
   "@graphql-tools/executor-legacy-ws@1.1.19(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@types/ws": 8.18.1
       graphql: 16.12.0
-      isomorphic-ws: 5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      isomorphic-ws: 5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - bufferutil
       - utf-8-validate
 
-  "@graphql-tools/executor-legacy-ws@1.1.24(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-tools/executor-legacy-ws@1.1.25(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@types/ws": 8.18.1
       graphql: 16.12.0
-      isomorphic-ws: 5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      isomorphic-ws: 5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - bufferutil
       - utf-8-validate
 
-  "@graphql-tools/executor@1.4.9(graphql@16.12.0)":
+  "@graphql-tools/executor@1.5.0(graphql@16.8.2)":
     dependencies:
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
-      "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
+      "@graphql-typed-document-node/core": 3.2.0(graphql@16.8.2)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/disposablestack": 0.0.6
       "@whatwg-node/promise-helpers": 1.3.2
-      graphql: 16.12.0
+      graphql: 16.8.2
       tslib: 2.8.1
 
-  "@graphql-tools/executor@1.5.0(graphql@16.12.0)":
+  "@graphql-tools/executor@1.5.1(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
       "@repeaterjs/repeater": 3.0.6
       "@whatwg-node/disposablestack": 0.0.6
@@ -21760,26 +22632,16 @@ snapshots:
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/executor@1.5.0(graphql@16.8.2)":
-    dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
-      "@graphql-typed-document-node/core": 3.2.0(graphql@16.8.2)
-      "@repeaterjs/repeater": 3.0.6
-      "@whatwg-node/disposablestack": 0.0.6
-      "@whatwg-node/promise-helpers": 1.3.2
-      graphql: 16.8.2
-      tslib: 2.8.1
-
-  "@graphql-tools/federation@4.2.6(@types/node@22.7.5)(graphql@16.12.0)":
+  "@graphql-tools/federation@4.2.10(@types/node@25.2.3)(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/executor": 1.5.0(graphql@16.12.0)
-      "@graphql-tools/executor-http": 3.0.7(@types/node@22.7.5)(graphql@16.12.0)
-      "@graphql-tools/merge": 9.1.6(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/stitch": 10.1.6(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/executor-http": 3.1.0(@types/node@25.2.3)(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/stitch": 10.1.10(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       "@graphql-yoga/typed-event-target": 3.0.2
       "@whatwg-node/disposablestack": 0.0.6
       "@whatwg-node/events": 0.1.2
@@ -21802,9 +22664,9 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  "@graphql-tools/github-loader@8.0.22(@types/node@20.19.25)(graphql@16.12.0)":
+  "@graphql-tools/github-loader@8.0.22(@types/node@20.19.33)(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/executor-http": 1.3.3(@types/node@20.19.25)(graphql@16.12.0)
+      "@graphql-tools/executor-http": 1.3.3(@types/node@20.19.33)(graphql@16.12.0)
       "@graphql-tools/graphql-tag-pluck": 8.3.21(graphql@16.12.0)
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@whatwg-node/fetch": 0.10.9
@@ -21827,6 +22689,17 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@graphql-tools/graphql-file-loader@8.1.9(graphql@16.12.0)":
+    dependencies:
+      "@graphql-tools/import": 7.1.9(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      globby: 11.1.0
+      graphql: 16.12.0
+      tslib: 2.8.1
+      unixify: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   "@graphql-tools/graphql-tag-pluck@8.3.21(graphql@16.12.0)":
     dependencies:
       "@babel/core": 7.28.0
@@ -21834,7 +22707,20 @@ snapshots:
       "@babel/plugin-syntax-import-assertions": 7.27.1(@babel/core@7.28.0)
       "@babel/traverse": 7.28.0
       "@babel/types": 7.28.1
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      graphql: 16.12.0
+      tslib: 2.8.1
+    transitivePeerDependencies:
+      - supports-color
+
+  "@graphql-tools/graphql-tag-pluck@8.3.27(graphql@16.12.0)":
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/parser": 7.29.0
+      "@babel/plugin-syntax-import-assertions": 7.28.6(@babel/core@7.29.0)
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
     transitivePeerDependencies:
@@ -21842,7 +22728,7 @@ snapshots:
 
   "@graphql-tools/import@7.0.21(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@theguild/federation-composition": 0.19.1(graphql@16.12.0)
       graphql: 16.12.0
       resolve-from: 5.0.0
@@ -21850,6 +22736,16 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@graphql-tools/import@7.1.9(graphql@16.12.0)":
+    dependencies:
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@theguild/federation-composition": 0.21.3(graphql@16.12.0)
+      graphql: 16.12.0
+      resolve-from: 5.0.0
+      tslib: 2.8.1
+    transitivePeerDependencies:
+      - supports-color
+
   "@graphql-tools/json-file-loader@8.0.20(graphql@16.12.0)":
     dependencies:
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
@@ -21866,21 +22762,29 @@ snapshots:
       p-limit: 3.1.0
       tslib: 2.8.1
 
+  "@graphql-tools/load@8.1.8(graphql@16.12.0)":
+    dependencies:
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      graphql: 16.12.0
+      p-limit: 3.1.0
+      tslib: 2.8.1
+
   "@graphql-tools/merge@9.1.1(graphql@16.12.0)":
     dependencies:
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/merge@9.1.6(graphql@16.12.0)":
+  "@graphql-tools/merge@9.1.7(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/merge@9.1.6(graphql@16.8.2)":
+  "@graphql-tools/merge@9.1.7(graphql@16.8.2)":
     dependencies:
-      "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
+      "@graphql-tools/utils": 11.0.0(graphql@16.8.2)
       graphql: 16.8.2
       tslib: 2.8.1
 
@@ -21894,9 +22798,9 @@ snapshots:
       graphql: 16.12.0
       tslib: 2.6.3
 
-  "@graphql-tools/prisma-loader@8.0.17(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-tools/prisma-loader@8.0.17(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
-      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@types/js-yaml": 4.0.9
       "@whatwg-node/fetch": 0.10.9
@@ -21920,7 +22824,6 @@ snapshots:
       - crossws
       - encoding
       - supports-color
-      - uWebSockets.js
       - utf-8-validate
 
   "@graphql-tools/relay-operation-optimizer@6.5.18(graphql@16.12.0)":
@@ -21951,51 +22854,67 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
+  "@graphql-tools/relay-operation-optimizer@7.0.27(graphql@16.12.0)":
+    dependencies:
+      "@ardatan/relay-compiler": 12.0.3(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      graphql: 16.12.0
+      tslib: 2.8.1
+    transitivePeerDependencies:
+      - encoding
+
   "@graphql-tools/schema@10.0.25(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/merge": 9.1.1(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
   "@graphql-tools/schema@10.0.30(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/merge": 9.1.6(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
       "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
   "@graphql-tools/schema@10.0.30(graphql@16.8.2)":
     dependencies:
-      "@graphql-tools/merge": 9.1.6(graphql@16.8.2)
+      "@graphql-tools/merge": 9.1.7(graphql@16.8.2)
       "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
       graphql: 16.8.2
       tslib: 2.8.1
 
-  "@graphql-tools/stitch@10.1.6(graphql@16.12.0)":
+  "@graphql-tools/schema@10.0.31(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/batch-delegate": 10.0.8(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/executor": 1.5.0(graphql@16.12.0)
-      "@graphql-tools/merge": 9.1.6(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      graphql: 16.12.0
+      tslib: 2.8.1
+
+  "@graphql-tools/stitch@10.1.10(graphql@16.12.0)":
+    dependencies:
+      "@graphql-tools/batch-delegate": 10.0.12(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/merge": 9.1.7(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/stitching-directives@4.0.8(graphql@16.12.0)":
+  "@graphql-tools/stitching-directives@4.0.12(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/url-loader@8.0.33(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-tools/url-loader@8.0.33(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
       "@graphql-tools/executor-graphql-ws": 2.0.5(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
-      "@graphql-tools/executor-http": 1.3.3(@types/node@20.19.25)(graphql@16.12.0)
+      "@graphql-tools/executor-http": 1.3.3(@types/node@20.19.33)(graphql@16.12.0)
       "@graphql-tools/executor-legacy-ws": 1.1.19(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@graphql-tools/wrap": 10.1.4(graphql@16.12.0)
@@ -22003,39 +22922,37 @@ snapshots:
       "@whatwg-node/fetch": 0.10.9
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
-      isomorphic-ws: 5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      isomorphic-ws: 5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
       sync-fetch: 0.6.0-2
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - "@fastify/websocket"
       - "@types/node"
       - bufferutil
       - crossws
-      - uWebSockets.js
       - utf-8-validate
 
-  "@graphql-tools/url-loader@9.0.5(@types/node@22.7.5)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
+  "@graphql-tools/url-loader@9.0.6(@types/node@25.2.3)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)":
     dependencies:
-      "@graphql-tools/executor-graphql-ws": 3.1.3(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
-      "@graphql-tools/executor-http": 3.0.7(@types/node@22.7.5)(graphql@16.12.0)
-      "@graphql-tools/executor-legacy-ws": 1.1.24(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@graphql-tools/wrap": 11.1.2(graphql@16.12.0)
+      "@graphql-tools/executor-graphql-ws": 3.1.4(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/executor-http": 3.1.0(@types/node@25.2.3)(graphql@16.12.0)
+      "@graphql-tools/executor-legacy-ws": 1.1.25(bufferutil@4.0.9)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@graphql-tools/wrap": 11.1.6(graphql@16.12.0)
       "@types/ws": 8.18.1
       "@whatwg-node/fetch": 0.10.13
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
-      isomorphic-ws: 5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
-      sync-fetch: 0.6.0-2
+      isomorphic-ws: 5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))
+      sync-fetch: 0.6.0
       tslib: 2.8.1
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - "@fastify/websocket"
       - "@types/node"
       - bufferutil
       - crossws
-      - uWebSockets.js
       - utf-8-validate
 
   "@graphql-tools/utils@10.11.0(graphql@16.12.0)":
@@ -22063,6 +22980,22 @@ snapshots:
       graphql: 16.12.0
       tslib: 2.8.1
 
+  "@graphql-tools/utils@11.0.0(graphql@16.12.0)":
+    dependencies:
+      "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
+      "@whatwg-node/promise-helpers": 1.3.2
+      cross-inspect: 1.0.1
+      graphql: 16.12.0
+      tslib: 2.8.1
+
+  "@graphql-tools/utils@11.0.0(graphql@16.8.2)":
+    dependencies:
+      "@graphql-typed-document-node/core": 3.2.0(graphql@16.8.2)
+      "@whatwg-node/promise-helpers": 1.3.2
+      cross-inspect: 1.0.1
+      graphql: 16.8.2
+      tslib: 2.8.1
+
   "@graphql-tools/utils@9.2.1(graphql@16.12.0)":
     dependencies:
       "@graphql-typed-document-node/core": 3.2.0(graphql@16.12.0)
@@ -22073,16 +23006,16 @@ snapshots:
     dependencies:
       "@graphql-tools/delegate": 10.2.23(graphql@16.12.0)
       "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
       tslib: 2.8.1
 
-  "@graphql-tools/wrap@11.1.2(graphql@16.12.0)":
+  "@graphql-tools/wrap@11.1.6(graphql@16.12.0)":
     dependencies:
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.30(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
       tslib: 2.8.1
@@ -22099,11 +23032,11 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  "@graphql-yoga/plugin-persisted-operations@3.15.1(graphql-yoga@5.15.1(graphql@16.12.0))(graphql@16.12.0)":
+  "@graphql-yoga/plugin-persisted-operations@3.18.0(graphql-yoga@5.18.0(graphql@16.12.0))(graphql@16.12.0)":
     dependencies:
       "@whatwg-node/promise-helpers": 1.3.2
       graphql: 16.12.0
-      graphql-yoga: 5.15.1(graphql@16.12.0)
+      graphql-yoga: 5.18.0(graphql@16.12.0)
 
   "@graphql-yoga/subscription@5.0.5":
     dependencies:
@@ -22117,31 +23050,31 @@ snapshots:
       "@repeaterjs/repeater": 3.0.6
       tslib: 2.8.1
 
-  "@hono/node-server@1.19.5(hono@4.10.7)":
+  "@hono/node-server@1.19.5(hono@4.11.9)":
     dependencies:
-      hono: 4.10.7
+      hono: 4.11.9
 
-  "@hono/node-server@1.19.9(hono@4.10.7)":
+  "@hono/node-server@1.19.9(hono@4.11.9)":
     dependencies:
-      hono: 4.10.7
+      hono: 4.11.9
 
-  "@hono/zod-openapi@0.19.10(hono@4.10.7)(zod@3.25.76)":
+  "@hono/zod-openapi@0.19.10(hono@4.11.9)(zod@3.25.76)":
     dependencies:
       "@asteasolutions/zod-to-openapi": 7.3.4(zod@3.25.76)
-      "@hono/zod-validator": 0.7.2(hono@4.10.7)(zod@3.25.76)
-      hono: 4.10.7
+      "@hono/zod-validator": 0.7.2(hono@4.11.9)(zod@3.25.76)
+      hono: 4.11.9
       openapi3-ts: 4.5.0
       zod: 3.25.76
 
-  "@hono/zod-validator@0.7.2(hono@4.10.7)(zod@3.25.76)":
+  "@hono/zod-validator@0.7.2(hono@4.11.9)(zod@3.25.76)":
     dependencies:
-      hono: 4.10.7
+      hono: 4.11.9
       zod: 3.25.76
 
-  "@hookform/resolvers@5.2.2(react-hook-form@7.71.0(react@19.2.3))":
+  "@hookform/resolvers@5.2.2(react-hook-form@7.71.1(react@19.2.3))":
     dependencies:
       "@standard-schema/utils": 0.3.0
-      react-hook-form: 7.71.0(react@19.2.3)
+      react-hook-form: 7.71.1(react@19.2.3)
 
   "@humanfs/core@0.19.1": {}
 
@@ -22263,7 +23196,7 @@ snapshots:
 
   "@isaacs/balanced-match@4.0.1": {}
 
-  "@isaacs/brace-expansion@5.0.0":
+  "@isaacs/brace-expansion@5.0.1":
     dependencies:
       "@isaacs/balanced-match": 4.0.1
 
@@ -22289,27 +23222,27 @@ snapshots:
   "@jest/console@29.7.0":
     dependencies:
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       chalk: 4.1.2
       jest-message-util: 29.7.0
       jest-util: 29.7.0
       slash: 3.0.0
 
-  "@jest/core@29.7.0(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))":
+  "@jest/core@29.7.0(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))":
     dependencies:
       "@jest/console": 29.7.0
       "@jest/reporters": 29.7.0
       "@jest/test-result": 29.7.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       ansi-escapes: 4.3.2
       chalk: 4.1.2
       ci-info: 3.9.0
       exit: 0.1.2
       graceful-fs: 4.2.11
       jest-changed-files: 29.7.0
-      jest-config: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       jest-haste-map: 29.7.0
       jest-message-util: 29.7.0
       jest-regex-util: 29.6.3
@@ -22330,21 +23263,21 @@ snapshots:
       - supports-color
       - ts-node
 
-  "@jest/core@29.7.0(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))":
+  "@jest/core@29.7.0(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))":
     dependencies:
       "@jest/console": 29.7.0
       "@jest/reporters": 29.7.0
       "@jest/test-result": 29.7.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       ansi-escapes: 4.3.2
       chalk: 4.1.2
       ci-info: 3.9.0
       exit: 0.1.2
       graceful-fs: 4.2.11
       jest-changed-files: 29.7.0
-      jest-config: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       jest-haste-map: 29.7.0
       jest-message-util: 29.7.0
       jest-regex-util: 29.6.3
@@ -22369,7 +23302,7 @@ snapshots:
     dependencies:
       "@jest/fake-timers": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       jest-mock: 29.7.0
 
   "@jest/expect-utils@29.7.0":
@@ -22387,7 +23320,7 @@ snapshots:
     dependencies:
       "@jest/types": 29.6.3
       "@sinonjs/fake-timers": 10.3.0
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       jest-message-util: 29.7.0
       jest-mock: 29.7.0
       jest-util: 29.7.0
@@ -22408,8 +23341,8 @@ snapshots:
       "@jest/test-result": 29.7.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      "@jridgewell/trace-mapping": 0.3.29
-      "@types/node": 20.19.25
+      "@jridgewell/trace-mapping": 0.3.31
+      "@types/node": 25.2.3
       chalk: 4.1.2
       collect-v8-coverage: 1.0.2
       exit: 0.1.2
@@ -22458,7 +23391,7 @@ snapshots:
     dependencies:
       "@babel/core": 7.28.0
       "@jest/types": 29.6.3
-      "@jridgewell/trace-mapping": 0.3.29
+      "@jridgewell/trace-mapping": 0.3.31
       babel-plugin-istanbul: 6.1.1
       chalk: 4.1.2
       convert-source-map: 2.0.0
@@ -22479,14 +23412,14 @@ snapshots:
       "@jest/schemas": 29.6.3
       "@types/istanbul-lib-coverage": 2.0.6
       "@types/istanbul-reports": 3.0.4
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       "@types/yargs": 17.0.33
       chalk: 4.1.2
 
   "@jridgewell/gen-mapping@0.3.12":
     dependencies:
-      "@jridgewell/sourcemap-codec": 1.5.4
-      "@jridgewell/trace-mapping": 0.3.29
+      "@jridgewell/sourcemap-codec": 1.5.5
+      "@jridgewell/trace-mapping": 0.3.31
 
   "@jridgewell/gen-mapping@0.3.13":
     dependencies:
@@ -22512,7 +23445,7 @@ snapshots:
   "@jridgewell/trace-mapping@0.3.29":
     dependencies:
       "@jridgewell/resolve-uri": 3.1.2
-      "@jridgewell/sourcemap-codec": 1.5.4
+      "@jridgewell/sourcemap-codec": 1.5.5
 
   "@jridgewell/trace-mapping@0.3.31":
     dependencies:
@@ -22522,7 +23455,7 @@ snapshots:
   "@jridgewell/trace-mapping@0.3.9":
     dependencies:
       "@jridgewell/resolve-uri": 3.1.2
-      "@jridgewell/sourcemap-codec": 1.5.4
+      "@jridgewell/sourcemap-codec": 1.5.5
 
   "@json-schema-tools/meta-schema@1.8.0": {}
 
@@ -22680,11 +23613,11 @@ snapshots:
       "@noble/hashes": 1.8.0
       "@scure/base": 1.2.6
       "@types/debug": 4.1.12
-      "@types/lodash": 4.17.21
+      "@types/lodash": 4.17.23
       debug: 4.4.3
-      lodash: 4.17.21
+      lodash: 4.17.23
       pony-cause: 2.1.11
-      semver: 7.7.3
+      semver: 7.7.4
       uuid: 9.0.1
     transitivePeerDependencies:
       - supports-color
@@ -22694,7 +23627,7 @@ snapshots:
       "@ethereumjs/tx": 4.2.0
       "@types/debug": 4.1.12
       debug: 4.4.3
-      semver: 7.7.3
+      semver: 7.7.4
       superstruct: 1.0.4
     transitivePeerDependencies:
       - supports-color
@@ -22706,9 +23639,9 @@ snapshots:
       "@noble/hashes": 1.8.0
       "@scure/base": 1.2.6
       "@types/debug": 4.1.12
-      debug: 4.4.3
+      debug: 4.3.4
       pony-cause: 2.1.11
-      semver: 7.7.3
+      semver: 7.7.4
       uuid: 9.0.1
     transitivePeerDependencies:
       - supports-color
@@ -22720,9 +23653,9 @@ snapshots:
       "@noble/hashes": 1.8.0
       "@scure/base": 1.2.6
       "@types/debug": 4.1.12
-      debug: 4.4.3
+      debug: 4.3.4
       pony-cause: 2.1.11
-      semver: 7.7.3
+      semver: 7.7.4
       uuid: 9.0.1
     transitivePeerDependencies:
       - supports-color
@@ -22824,20 +23757,20 @@ snapshots:
 
   "@nolyfill/is-core-module@1.0.39": {}
 
-  "@omnigraph/json-schema@0.109.18(graphql@16.12.0)":
+  "@omnigraph/json-schema@0.109.24(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/transport-common": 1.0.12(graphql@16.12.0)
-      "@graphql-mesh/transport-rest": 0.9.18(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/delegate": 12.0.2(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/transport-common": 1.0.14(graphql@16.12.0)
+      "@graphql-mesh/transport-rest": 0.9.24(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/delegate": 12.0.6(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
       "@json-schema-tools/meta-schema": 1.8.0
       "@whatwg-node/fetch": 0.10.13
       ajv: 8.17.1
-      ajv-formats: 2.1.1(ajv@8.17.1)
+      ajv-formats: 3.0.1(ajv@8.17.1)
       dset: 3.1.4
       graphql: 16.12.0
       graphql-compose: 9.1.0(graphql@16.12.0)
@@ -22845,7 +23778,7 @@ snapshots:
       graphql-scalars: 1.25.0(graphql@16.12.0)
       json-machete: 0.97.6
       pascal-case: 3.1.2
-      qs: 6.14.0
+      qs: 6.14.1
       to-json-schema: 0.2.5
       tslib: 2.8.1
       url-join: 4.0.1
@@ -22856,15 +23789,15 @@ snapshots:
       - pino
       - winston
 
-  "@omnigraph/openapi@0.109.24(graphql@16.12.0)":
+  "@omnigraph/openapi@0.109.30(graphql@16.12.0)":
     dependencies:
-      "@graphql-mesh/cross-helpers": 0.4.10(graphql@16.12.0)
-      "@graphql-mesh/fusion-composition": 0.8.21(graphql@16.12.0)
-      "@graphql-mesh/string-interpolation": 0.5.9(graphql@16.12.0)
-      "@graphql-mesh/types": 0.104.18(graphql@16.12.0)
-      "@graphql-mesh/utils": 0.104.17(graphql@16.12.0)
-      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
-      "@omnigraph/json-schema": 0.109.18(graphql@16.12.0)
+      "@graphql-mesh/cross-helpers": 0.4.12(graphql@16.12.0)
+      "@graphql-mesh/fusion-composition": 0.8.27(graphql@16.12.0)
+      "@graphql-mesh/string-interpolation": 0.5.11(graphql@16.12.0)
+      "@graphql-mesh/types": 0.104.20(graphql@16.12.0)
+      "@graphql-mesh/utils": 0.104.22(graphql@16.12.0)
+      "@graphql-tools/utils": 11.0.0(graphql@16.12.0)
+      "@omnigraph/json-schema": 0.109.24(graphql@16.12.0)
       change-case: 4.1.2
       graphql: 16.12.0
       json-machete: 0.97.6
@@ -22882,65 +23815,65 @@ snapshots:
 
   "@openzeppelin/contracts@4.9.6": {}
 
-  "@parcel/watcher-android-arm64@2.5.1":
+  "@parcel/watcher-android-arm64@2.5.6":
     optional: true
 
-  "@parcel/watcher-darwin-arm64@2.5.1":
+  "@parcel/watcher-darwin-arm64@2.5.6":
     optional: true
 
-  "@parcel/watcher-darwin-x64@2.5.1":
+  "@parcel/watcher-darwin-x64@2.5.6":
     optional: true
 
-  "@parcel/watcher-freebsd-x64@2.5.1":
+  "@parcel/watcher-freebsd-x64@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-arm-glibc@2.5.1":
+  "@parcel/watcher-linux-arm-glibc@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-arm-musl@2.5.1":
+  "@parcel/watcher-linux-arm-musl@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-arm64-glibc@2.5.1":
+  "@parcel/watcher-linux-arm64-glibc@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-arm64-musl@2.5.1":
+  "@parcel/watcher-linux-arm64-musl@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-x64-glibc@2.5.1":
+  "@parcel/watcher-linux-x64-glibc@2.5.6":
     optional: true
 
-  "@parcel/watcher-linux-x64-musl@2.5.1":
+  "@parcel/watcher-linux-x64-musl@2.5.6":
     optional: true
 
-  "@parcel/watcher-win32-arm64@2.5.1":
+  "@parcel/watcher-win32-arm64@2.5.6":
     optional: true
 
-  "@parcel/watcher-win32-ia32@2.5.1":
+  "@parcel/watcher-win32-ia32@2.5.6":
     optional: true
 
-  "@parcel/watcher-win32-x64@2.5.1":
+  "@parcel/watcher-win32-x64@2.5.6":
     optional: true
 
-  "@parcel/watcher@2.5.1":
+  "@parcel/watcher@2.5.6":
     dependencies:
-      detect-libc: 1.0.3
+      detect-libc: 2.1.2
       is-glob: 4.0.3
-      micromatch: 4.0.8
       node-addon-api: 7.1.1
+      picomatch: 4.0.3
     optionalDependencies:
-      "@parcel/watcher-android-arm64": 2.5.1
-      "@parcel/watcher-darwin-arm64": 2.5.1
-      "@parcel/watcher-darwin-x64": 2.5.1
-      "@parcel/watcher-freebsd-x64": 2.5.1
-      "@parcel/watcher-linux-arm-glibc": 2.5.1
-      "@parcel/watcher-linux-arm-musl": 2.5.1
-      "@parcel/watcher-linux-arm64-glibc": 2.5.1
-      "@parcel/watcher-linux-arm64-musl": 2.5.1
-      "@parcel/watcher-linux-x64-glibc": 2.5.1
-      "@parcel/watcher-linux-x64-musl": 2.5.1
-      "@parcel/watcher-win32-arm64": 2.5.1
-      "@parcel/watcher-win32-ia32": 2.5.1
-      "@parcel/watcher-win32-x64": 2.5.1
+      "@parcel/watcher-android-arm64": 2.5.6
+      "@parcel/watcher-darwin-arm64": 2.5.6
+      "@parcel/watcher-darwin-x64": 2.5.6
+      "@parcel/watcher-freebsd-x64": 2.5.6
+      "@parcel/watcher-linux-arm-glibc": 2.5.6
+      "@parcel/watcher-linux-arm-musl": 2.5.6
+      "@parcel/watcher-linux-arm64-glibc": 2.5.6
+      "@parcel/watcher-linux-arm64-musl": 2.5.6
+      "@parcel/watcher-linux-x64-glibc": 2.5.6
+      "@parcel/watcher-linux-x64-musl": 2.5.6
+      "@parcel/watcher-win32-arm64": 2.5.6
+      "@parcel/watcher-win32-ia32": 2.5.6
+      "@parcel/watcher-win32-x64": 2.5.6
 
   "@paulmillr/qr@0.2.1": {}
 
@@ -22949,7 +23882,7 @@ snapshots:
 
   "@pkgr/core@0.2.9": {}
 
-  "@pmmmwh/react-refresh-webpack-plugin@0.5.17(react-refresh@0.14.2)(type-fest@4.41.0)(webpack-hot-middleware@2.26.1)(webpack@5.103.0)":
+  "@pmmmwh/react-refresh-webpack-plugin@0.5.17(react-refresh@0.14.2)(type-fest@4.41.0)(webpack-hot-middleware@2.26.1)(webpack@5.105.1)":
     dependencies:
       ansi-html: 0.0.9
       core-js-pure: 3.44.0
@@ -22959,14 +23892,14 @@ snapshots:
       react-refresh: 0.14.2
       schema-utils: 4.3.3
       source-map: 0.7.4
-      webpack: 5.103.0
+      webpack: 5.105.1
     optionalDependencies:
       type-fest: 4.41.0
       webpack-hot-middleware: 2.26.1
 
-  "@ponder/utils@0.2.17(typescript@5.9.3)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
+  "@ponder/utils@0.2.17(typescript@5.9.3)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
     dependencies:
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     optionalDependencies:
       typescript: 5.9.3
 
@@ -23343,9 +24276,9 @@ snapshots:
 
   "@radix-ui/rect@1.1.1": {}
 
-  "@rainbow-me/rainbowkit@2.2.9(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(typescript@5.9.3)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))":
+  "@rainbow-me/rainbowkit@2.2.10(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(typescript@5.9.3)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))":
     dependencies:
-      "@tanstack/react-query": 5.90.11(react@19.2.3)
+      "@tanstack/react-query": 5.90.21(react@19.2.3)
       "@vanilla-extract/css": 1.17.3
       "@vanilla-extract/dynamic": 2.1.4
       "@vanilla-extract/sprinkles": 1.6.4(@vanilla-extract/css@1.17.3)
@@ -23355,8 +24288,8 @@ snapshots:
       react-dom: 19.2.3(react@19.2.3)
       react-remove-scroll: 2.6.2(@types/react@19.2.8)(react@19.2.3)
       ua-parser-js: 1.0.40
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
-      wagmi: 2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      wagmi: 2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
     transitivePeerDependencies:
       - "@types/react"
       - babel-plugin-macros
@@ -23366,7 +24299,7 @@ snapshots:
     dependencies:
       big.js: 6.2.2
       dayjs: 1.11.13
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.22.4)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.22.4)
     transitivePeerDependencies:
       - bufferutil
       - typescript
@@ -23377,7 +24310,7 @@ snapshots:
     dependencies:
       big.js: 6.2.2
       dayjs: 1.11.13
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - bufferutil
       - typescript
@@ -23390,7 +24323,7 @@ snapshots:
       "@reown/appkit-wallet": 1.7.8(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)
       "@walletconnect/universal-provider": 2.21.0(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       valtio: 1.13.2(@types/react@19.2.8)(react@19.2.3)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - "@azure/app-configuration"
       - "@azure/cosmos"
@@ -23540,7 +24473,7 @@ snapshots:
       "@walletconnect/logger": 2.1.2
       "@walletconnect/universal-provider": 2.21.0(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       valtio: 1.13.2(@types/react@19.2.8)(react@19.2.3)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - "@azure/app-configuration"
       - "@azure/cosmos"
@@ -23594,7 +24527,7 @@ snapshots:
       "@walletconnect/universal-provider": 2.21.0(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       bs58: 6.0.0
       valtio: 1.13.2(@types/react@19.2.8)(react@19.2.3)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - "@azure/app-configuration"
       - "@azure/cosmos"
@@ -23700,7 +24633,7 @@ snapshots:
   "@safe-global/safe-apps-sdk@9.1.0(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)":
     dependencies:
       "@safe-global/safe-gateway-typescript-sdk": 3.23.1
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     transitivePeerDependencies:
       - bufferutil
       - typescript
@@ -23880,7 +24813,7 @@ snapshots:
   "@solana/errors@2.3.0(typescript@5.9.3)":
     dependencies:
       chalk: 5.6.2
-      commander: 14.0.2
+      commander: 14.0.3
       typescript: 5.9.3
 
   "@solana/errors@3.0.3(typescript@5.9.3)":
@@ -24074,7 +25007,7 @@ snapshots:
       "@solana/rpc-spec": 3.0.3(typescript@5.9.3)
       "@solana/rpc-spec-types": 3.0.3(typescript@5.9.3)
       typescript: 5.9.3
-      undici-types: 7.16.0
+      undici-types: 7.21.0
 
   "@solana/rpc-types@3.0.3(fastestsmallesttextencoderdecoder@1.0.22)(typescript@5.9.3)":
     dependencies:
@@ -24186,7 +25119,7 @@ snapshots:
     dependencies:
       "@babel/runtime": 7.28.4
       "@noble/curves": 1.9.7
-      "@noble/hashes": 1.8.0
+      "@noble/hashes": 1.4.0
       "@solana/buffer-layout": 4.0.1
       "@solana/codecs-numbers": 2.3.0(typescript@5.9.3)
       agentkeepalive: 4.6.0
@@ -24213,49 +25146,48 @@ snapshots:
 
   "@starknet-io/types-js@0.7.10": {}
 
-  "@storybook/addon-designs@11.1.1(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
+  "@storybook/addon-designs@11.1.2(@types/react@19.2.8)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
     dependencies:
       "@figspec/react": 2.0.1(@types/react@19.2.8)(react@19.2.3)
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
     optionalDependencies:
       react: 19.2.3
       react-dom: 19.2.3(react@19.2.3)
     transitivePeerDependencies:
       - "@types/react"
 
-  "@storybook/addon-onboarding@10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
+  "@storybook/addon-onboarding@10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
     dependencies:
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
 
-  "@storybook/addon-vitest@10.2.0(@vitest/runner@3.2.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))":
+  "@storybook/addon-vitest@10.2.8(@vitest/runner@3.2.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))":
     dependencies:
       "@storybook/global": 5.0.0
       "@storybook/icons": 2.0.1(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
     optionalDependencies:
       "@vitest/runner": 3.2.4
-      vitest: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
+      vitest: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
     transitivePeerDependencies:
       - react
       - react-dom
 
-  "@storybook/builder-webpack5@10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))":
+  "@storybook/builder-webpack5@10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)":
     dependencies:
-      "@storybook/core-webpack": 10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
-      "@vitest/mocker": 3.2.4(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))
+      "@storybook/core-webpack": 10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
       case-sensitive-paths-webpack-plugin: 2.4.0
       cjs-module-lexer: 1.4.3
-      css-loader: 7.1.2(webpack@5.103.0)
+      css-loader: 7.1.3(webpack@5.105.1)
       es-module-lexer: 1.7.0
-      fork-ts-checker-webpack-plugin: 9.1.0(typescript@5.9.3)(webpack@5.103.0)
-      html-webpack-plugin: 5.6.5(webpack@5.103.0)
+      fork-ts-checker-webpack-plugin: 9.1.0(typescript@5.9.3)(webpack@5.105.1)
+      html-webpack-plugin: 5.6.6(webpack@5.105.1)
       magic-string: 0.30.21
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
-      style-loader: 4.0.0(webpack@5.103.0)
-      terser-webpack-plugin: 5.3.14(webpack@5.103.0)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      style-loader: 4.0.0(webpack@5.105.1)
+      terser-webpack-plugin: 5.3.16(webpack@5.105.1)
       ts-dedent: 2.2.0
-      webpack: 5.103.0
-      webpack-dev-middleware: 6.1.3(webpack@5.103.0)
+      webpack: 5.105.1
+      webpack-dev-middleware: 6.1.3(webpack@5.105.1)
       webpack-hot-middleware: 2.26.1
       webpack-virtual-modules: 0.6.2
     optionalDependencies:
@@ -24264,14 +25196,12 @@ snapshots:
       - "@rspack/core"
       - "@swc/core"
       - esbuild
-      - msw
       - uglify-js
-      - vite
       - webpack-cli
 
-  "@storybook/core-webpack@10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
+  "@storybook/core-webpack@10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
     dependencies:
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
       ts-dedent: 2.2.0
 
   "@storybook/global@5.0.0": {}
@@ -24281,7 +25211,7 @@ snapshots:
       react: 19.2.3
       react-dom: 19.2.3(react@19.2.3)
 
-  "@storybook/nextjs@10.2.0(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(type-fest@4.41.0)(typescript@5.9.3)(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))(webpack-hot-middleware@2.26.1)(webpack@5.103.0)":
+  "@storybook/nextjs@10.2.8(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(type-fest@4.41.0)(typescript@5.9.3)(webpack-hot-middleware@2.26.1)(webpack@5.105.1)":
     dependencies:
       "@babel/core": 7.28.5
       "@babel/plugin-syntax-bigint": 7.8.3(@babel/core@7.28.5)
@@ -24296,40 +25226,39 @@ snapshots:
       "@babel/preset-react": 7.28.5(@babel/core@7.28.5)
       "@babel/preset-typescript": 7.28.5(@babel/core@7.28.5)
       "@babel/runtime": 7.28.4
-      "@pmmmwh/react-refresh-webpack-plugin": 0.5.17(react-refresh@0.14.2)(type-fest@4.41.0)(webpack-hot-middleware@2.26.1)(webpack@5.103.0)
-      "@storybook/builder-webpack5": 10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))
-      "@storybook/preset-react-webpack": 10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
-      "@storybook/react": 10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
+      "@pmmmwh/react-refresh-webpack-plugin": 0.5.17(react-refresh@0.14.2)(type-fest@4.41.0)(webpack-hot-middleware@2.26.1)(webpack@5.105.1)
+      "@storybook/builder-webpack5": 10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
+      "@storybook/preset-react-webpack": 10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
+      "@storybook/react": 10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)
       "@types/semver": 7.7.1
-      babel-loader: 9.2.1(@babel/core@7.28.5)(webpack@5.103.0)
-      css-loader: 6.11.0(webpack@5.103.0)
+      babel-loader: 9.2.1(@babel/core@7.28.5)(webpack@5.105.1)
+      css-loader: 6.11.0(webpack@5.105.1)
       image-size: 2.0.2
       loader-utils: 3.3.1
       next: 16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
-      node-polyfill-webpack-plugin: 2.0.1(webpack@5.103.0)
+      node-polyfill-webpack-plugin: 2.0.1(webpack@5.105.1)
       postcss: 8.5.6
-      postcss-loader: 8.1.1(postcss@8.5.6)(typescript@5.9.3)(webpack@5.103.0)
+      postcss-loader: 8.1.1(postcss@8.5.6)(typescript@5.9.3)(webpack@5.105.1)
       react: 19.2.3
       react-dom: 19.2.3(react@19.2.3)
       react-refresh: 0.14.2
       resolve-url-loader: 5.0.0
-      sass-loader: 16.0.5(webpack@5.103.0)
+      sass-loader: 16.0.5(webpack@5.105.1)
       semver: 7.7.3
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
-      style-loader: 3.3.4(webpack@5.103.0)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      style-loader: 3.3.4(webpack@5.105.1)
       styled-jsx: 5.1.7(@babel/core@7.28.5)(react@19.2.3)
       tsconfig-paths: 4.2.0
       tsconfig-paths-webpack-plugin: 4.2.0
     optionalDependencies:
       typescript: 5.9.3
-      webpack: 5.103.0
+      webpack: 5.105.1
     transitivePeerDependencies:
       - "@rspack/core"
       - "@swc/core"
       - "@types/webpack"
       - babel-plugin-macros
       - esbuild
-      - msw
       - node-sass
       - sass
       - sass-embedded
@@ -24337,16 +25266,15 @@ snapshots:
       - supports-color
       - type-fest
       - uglify-js
-      - vite
       - webpack-cli
       - webpack-dev-server
       - webpack-hot-middleware
       - webpack-plugin-serve
 
-  "@storybook/preset-react-webpack@10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)":
+  "@storybook/preset-react-webpack@10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)":
     dependencies:
-      "@storybook/core-webpack": 10.2.0(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
-      "@storybook/react-docgen-typescript-plugin": 1.0.6--canary.9.0c3f3b7.0(typescript@5.9.3)(webpack@5.103.0)
+      "@storybook/core-webpack": 10.2.8(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
+      "@storybook/react-docgen-typescript-plugin": 1.0.6--canary.9.0c3f3b7.0(typescript@5.9.3)(webpack@5.105.1)
       "@types/semver": 7.7.1
       magic-string: 0.30.21
       react: 19.2.3
@@ -24354,9 +25282,9 @@ snapshots:
       react-dom: 19.2.3(react@19.2.3)
       resolve: 1.22.11
       semver: 7.7.3
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
       tsconfig-paths: 4.2.0
-      webpack: 5.103.0
+      webpack: 5.105.1
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -24366,7 +25294,7 @@ snapshots:
       - uglify-js
       - webpack-cli
 
-  "@storybook/react-docgen-typescript-plugin@1.0.6--canary.9.0c3f3b7.0(typescript@5.9.3)(webpack@5.103.0)":
+  "@storybook/react-docgen-typescript-plugin@1.0.6--canary.9.0c3f3b7.0(typescript@5.9.3)(webpack@5.105.1)":
     dependencies:
       debug: 4.4.3
       endent: 2.1.0
@@ -24376,24 +25304,24 @@ snapshots:
       react-docgen-typescript: 2.4.0(typescript@5.9.3)
       tslib: 2.8.1
       typescript: 5.9.3
-      webpack: 5.103.0
+      webpack: 5.105.1
     transitivePeerDependencies:
       - supports-color
 
-  "@storybook/react-dom-shim@10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
+  "@storybook/react-dom-shim@10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))":
     dependencies:
       react: 19.2.3
       react-dom: 19.2.3(react@19.2.3)
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
 
-  "@storybook/react@10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)":
+  "@storybook/react@10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3)":
     dependencies:
       "@storybook/global": 5.0.0
-      "@storybook/react-dom-shim": 10.2.0(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
+      "@storybook/react-dom-shim": 10.2.8(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))
       react: 19.2.3
       react-docgen: 8.0.2
       react-dom: 19.2.3(react@19.2.3)
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -24407,80 +25335,80 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  "@tailwindcss/node@4.1.17":
+  "@tailwindcss/node@4.1.18":
     dependencies:
       "@jridgewell/remapping": 2.3.5
-      enhanced-resolve: 5.18.3
+      enhanced-resolve: 5.19.0
       jiti: 2.6.1
       lightningcss: 1.30.2
       magic-string: 0.30.21
       source-map-js: 1.2.1
-      tailwindcss: 4.1.17
+      tailwindcss: 4.1.18
 
-  "@tailwindcss/oxide-android-arm64@4.1.17":
+  "@tailwindcss/oxide-android-arm64@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-darwin-arm64@4.1.17":
+  "@tailwindcss/oxide-darwin-arm64@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-darwin-x64@4.1.17":
+  "@tailwindcss/oxide-darwin-x64@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-freebsd-x64@4.1.17":
+  "@tailwindcss/oxide-freebsd-x64@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-linux-arm-gnueabihf@4.1.17":
+  "@tailwindcss/oxide-linux-arm-gnueabihf@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-linux-arm64-gnu@4.1.17":
+  "@tailwindcss/oxide-linux-arm64-gnu@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-linux-arm64-musl@4.1.17":
+  "@tailwindcss/oxide-linux-arm64-musl@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-linux-x64-gnu@4.1.17":
+  "@tailwindcss/oxide-linux-x64-gnu@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-linux-x64-musl@4.1.17":
+  "@tailwindcss/oxide-linux-x64-musl@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-wasm32-wasi@4.1.17":
+  "@tailwindcss/oxide-wasm32-wasi@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-win32-arm64-msvc@4.1.17":
+  "@tailwindcss/oxide-win32-arm64-msvc@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide-win32-x64-msvc@4.1.17":
+  "@tailwindcss/oxide-win32-x64-msvc@4.1.18":
     optional: true
 
-  "@tailwindcss/oxide@4.1.17":
+  "@tailwindcss/oxide@4.1.18":
     optionalDependencies:
-      "@tailwindcss/oxide-android-arm64": 4.1.17
-      "@tailwindcss/oxide-darwin-arm64": 4.1.17
-      "@tailwindcss/oxide-darwin-x64": 4.1.17
-      "@tailwindcss/oxide-freebsd-x64": 4.1.17
-      "@tailwindcss/oxide-linux-arm-gnueabihf": 4.1.17
-      "@tailwindcss/oxide-linux-arm64-gnu": 4.1.17
-      "@tailwindcss/oxide-linux-arm64-musl": 4.1.17
-      "@tailwindcss/oxide-linux-x64-gnu": 4.1.17
-      "@tailwindcss/oxide-linux-x64-musl": 4.1.17
-      "@tailwindcss/oxide-wasm32-wasi": 4.1.17
-      "@tailwindcss/oxide-win32-arm64-msvc": 4.1.17
-      "@tailwindcss/oxide-win32-x64-msvc": 4.1.17
-
-  "@tailwindcss/postcss@4.1.17":
+      "@tailwindcss/oxide-android-arm64": 4.1.18
+      "@tailwindcss/oxide-darwin-arm64": 4.1.18
+      "@tailwindcss/oxide-darwin-x64": 4.1.18
+      "@tailwindcss/oxide-freebsd-x64": 4.1.18
+      "@tailwindcss/oxide-linux-arm-gnueabihf": 4.1.18
+      "@tailwindcss/oxide-linux-arm64-gnu": 4.1.18
+      "@tailwindcss/oxide-linux-arm64-musl": 4.1.18
+      "@tailwindcss/oxide-linux-x64-gnu": 4.1.18
+      "@tailwindcss/oxide-linux-x64-musl": 4.1.18
+      "@tailwindcss/oxide-wasm32-wasi": 4.1.18
+      "@tailwindcss/oxide-win32-arm64-msvc": 4.1.18
+      "@tailwindcss/oxide-win32-x64-msvc": 4.1.18
+
+  "@tailwindcss/postcss@4.1.18":
     dependencies:
       "@alloc/quick-lru": 5.2.0
-      "@tailwindcss/node": 4.1.17
-      "@tailwindcss/oxide": 4.1.17
+      "@tailwindcss/node": 4.1.18
+      "@tailwindcss/oxide": 4.1.18
       postcss: 8.5.6
-      tailwindcss: 4.1.17
+      tailwindcss: 4.1.18
 
-  "@tanstack/query-core@5.90.11": {}
+  "@tanstack/query-core@5.90.20": {}
 
-  "@tanstack/react-query@5.90.11(react@19.2.3)":
+  "@tanstack/react-query@5.90.21(react@19.2.3)":
     dependencies:
-      "@tanstack/query-core": 5.90.11
+      "@tanstack/query-core": 5.90.20
       react: 19.2.3
 
   "@tanstack/react-table@8.21.3(react-dom@19.2.3(react@19.2.3))(react@19.2.3)":
@@ -24493,8 +25421,8 @@ snapshots:
 
   "@testing-library/dom@10.4.0":
     dependencies:
-      "@babel/code-frame": 7.28.6
-      "@babel/runtime": 7.28.4
+      "@babel/code-frame": 7.29.0
+      "@babel/runtime": 7.28.6
       "@types/aria-query": 5.0.4
       aria-query: 5.3.0
       chalk: 4.1.2
@@ -24525,7 +25453,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  "@theguild/federation-composition@0.20.2(graphql@16.12.0)":
+  "@theguild/federation-composition@0.21.3(graphql@16.12.0)":
     dependencies:
       constant-case: 3.0.4
       debug: 4.4.3
@@ -24552,24 +25480,24 @@ snapshots:
 
   "@types/babel__core@7.20.5":
     dependencies:
-      "@babel/parser": 7.28.5
-      "@babel/types": 7.28.5
+      "@babel/parser": 7.28.6
+      "@babel/types": 7.28.6
       "@types/babel__generator": 7.27.0
       "@types/babel__template": 7.4.4
       "@types/babel__traverse": 7.28.0
 
   "@types/babel__generator@7.27.0":
     dependencies:
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
 
   "@types/babel__template@7.4.4":
     dependencies:
-      "@babel/parser": 7.28.5
-      "@babel/types": 7.28.5
+      "@babel/parser": 7.28.6
+      "@babel/types": 7.28.6
 
   "@types/babel__traverse@7.28.0":
     dependencies:
-      "@babel/types": 7.28.5
+      "@babel/types": 7.28.6
 
   "@types/chai@5.2.2":
     dependencies:
@@ -24577,11 +25505,11 @@ snapshots:
 
   "@types/connect@3.4.38":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
 
   "@types/conventional-commits-parser@5.0.1":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
 
   "@types/d3-array@3.2.1": {}
 
@@ -24629,7 +25557,7 @@ snapshots:
 
   "@types/graceful-fs@4.1.9":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
 
   "@types/html-minifier-terser@6.1.0": {}
 
@@ -24654,13 +25582,13 @@ snapshots:
 
   "@types/json5@0.0.29": {}
 
-  "@types/lodash@4.17.21": {}
+  "@types/lodash@4.17.23": {}
 
   "@types/ms@2.1.0": {}
 
   "@types/node@12.20.55": {}
 
-  "@types/node@20.19.25":
+  "@types/node@20.19.33":
     dependencies:
       undici-types: 6.21.0
 
@@ -24668,9 +25596,13 @@ snapshots:
     dependencies:
       undici-types: 6.19.8
 
-  "@types/pg@8.15.6":
+  "@types/node@25.2.3":
+    dependencies:
+      undici-types: 7.16.0
+
+  "@types/pg@8.16.0":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       pg-protocol: 1.10.3
       pg-types: 2.2.0
 
@@ -24702,11 +25634,11 @@ snapshots:
 
   "@types/ws@7.4.7":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
 
   "@types/ws@8.18.1":
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
 
   "@types/yargs-parser@21.0.3": {}
 
@@ -24714,14 +25646,30 @@ snapshots:
     dependencies:
       "@types/yargs-parser": 21.0.3
 
-  "@typescript-eslint/eslint-plugin@8.53.0(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3)":
+  "@typescript-eslint/eslint-plugin@8.53.0(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
       "@eslint-community/regexpp": 4.12.2
-      "@typescript-eslint/parser": 8.53.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/parser": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       "@typescript-eslint/scope-manager": 8.53.0
-      "@typescript-eslint/type-utils": 8.53.0(eslint@8.57.1)(typescript@5.9.3)
-      "@typescript-eslint/utils": 8.53.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/type-utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       "@typescript-eslint/visitor-keys": 8.53.0
+      eslint: 9.39.2(jiti@2.6.1)
+      ignore: 7.0.5
+      natural-compare: 1.4.0
+      ts-api-utils: 2.4.0(typescript@5.9.3)
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
+  "@typescript-eslint/eslint-plugin@8.55.0(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3)":
+    dependencies:
+      "@eslint-community/regexpp": 4.12.2
+      "@typescript-eslint/parser": 8.55.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/type-utils": 8.55.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.55.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/visitor-keys": 8.55.0
       eslint: 8.57.1
       ignore: 7.0.5
       natural-compare: 1.4.0
@@ -24730,14 +25678,14 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/eslint-plugin@8.53.0(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
+  "@typescript-eslint/eslint-plugin@8.55.0(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
       "@eslint-community/regexpp": 4.12.2
-      "@typescript-eslint/parser": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
-      "@typescript-eslint/scope-manager": 8.53.0
-      "@typescript-eslint/type-utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
-      "@typescript-eslint/utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
-      "@typescript-eslint/visitor-keys": 8.53.0
+      "@typescript-eslint/parser": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/type-utils": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      "@typescript-eslint/visitor-keys": 8.55.0
       eslint: 9.39.2(jiti@2.6.1)
       ignore: 7.0.5
       natural-compare: 1.4.0
@@ -24746,24 +25694,36 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3)":
+  "@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
       "@typescript-eslint/scope-manager": 8.53.0
       "@typescript-eslint/types": 8.53.0
       "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
       "@typescript-eslint/visitor-keys": 8.53.0
       debug: 4.4.3
+      eslint: 9.39.2(jiti@2.6.1)
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
+  "@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3)":
+    dependencies:
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/visitor-keys": 8.55.0
+      debug: 4.4.3
       eslint: 8.57.1
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
+  "@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
-      "@typescript-eslint/scope-manager": 8.53.0
-      "@typescript-eslint/types": 8.53.0
-      "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
-      "@typescript-eslint/visitor-keys": 8.53.0
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/visitor-keys": 8.55.0
       debug: 4.4.3
       eslint: 9.39.2(jiti@2.6.1)
       typescript: 5.9.3
@@ -24779,20 +25739,50 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  "@typescript-eslint/project-service@8.55.0(typescript@5.9.3)":
+    dependencies:
+      "@typescript-eslint/tsconfig-utils": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/types": 8.55.0
+      debug: 4.4.3
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
   "@typescript-eslint/scope-manager@8.53.0":
     dependencies:
       "@typescript-eslint/types": 8.53.0
       "@typescript-eslint/visitor-keys": 8.53.0
 
+  "@typescript-eslint/scope-manager@8.55.0":
+    dependencies:
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/visitor-keys": 8.55.0
+
   "@typescript-eslint/tsconfig-utils@8.53.0(typescript@5.9.3)":
     dependencies:
       typescript: 5.9.3
 
-  "@typescript-eslint/type-utils@8.53.0(eslint@8.57.1)(typescript@5.9.3)":
+  "@typescript-eslint/tsconfig-utils@8.55.0(typescript@5.9.3)":
+    dependencies:
+      typescript: 5.9.3
+
+  "@typescript-eslint/type-utils@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
       "@typescript-eslint/types": 8.53.0
       "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
-      "@typescript-eslint/utils": 8.53.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      debug: 4.4.3
+      eslint: 9.39.2(jiti@2.6.1)
+      ts-api-utils: 2.4.0(typescript@5.9.3)
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
+  "@typescript-eslint/type-utils@8.55.0(eslint@8.57.1)(typescript@5.9.3)":
+    dependencies:
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.55.0(eslint@8.57.1)(typescript@5.9.3)
       debug: 4.4.3
       eslint: 8.57.1
       ts-api-utils: 2.4.0(typescript@5.9.3)
@@ -24800,11 +25790,11 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/type-utils@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
+  "@typescript-eslint/type-utils@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
-      "@typescript-eslint/types": 8.53.0
-      "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
-      "@typescript-eslint/utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/utils": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       debug: 4.4.3
       eslint: 9.39.2(jiti@2.6.1)
       ts-api-utils: 2.4.0(typescript@5.9.3)
@@ -24814,6 +25804,8 @@ snapshots:
 
   "@typescript-eslint/types@8.53.0": {}
 
+  "@typescript-eslint/types@8.55.0": {}
+
   "@typescript-eslint/typescript-estree@8.53.0(typescript@5.9.3)":
     dependencies:
       "@typescript-eslint/project-service": 8.53.0(typescript@5.9.3)
@@ -24822,30 +25814,56 @@ snapshots:
       "@typescript-eslint/visitor-keys": 8.53.0
       debug: 4.4.3
       minimatch: 9.0.5
-      semver: 7.7.3
+      semver: 7.7.4
+      tinyglobby: 0.2.15
+      ts-api-utils: 2.4.0(typescript@5.9.3)
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
+  "@typescript-eslint/typescript-estree@8.55.0(typescript@5.9.3)":
+    dependencies:
+      "@typescript-eslint/project-service": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/tsconfig-utils": 8.55.0(typescript@5.9.3)
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/visitor-keys": 8.55.0
+      debug: 4.4.3
+      minimatch: 9.0.5
+      semver: 7.7.4
       tinyglobby: 0.2.15
       ts-api-utils: 2.4.0(typescript@5.9.3)
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/utils@8.53.0(eslint@8.57.1)(typescript@5.9.3)":
+  "@typescript-eslint/utils@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
+    dependencies:
+      "@eslint-community/eslint-utils": 4.9.1(eslint@9.39.2(jiti@2.6.1))
+      "@typescript-eslint/scope-manager": 8.53.0
+      "@typescript-eslint/types": 8.53.0
+      "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
+      eslint: 9.39.2(jiti@2.6.1)
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - supports-color
+
+  "@typescript-eslint/utils@8.55.0(eslint@8.57.1)(typescript@5.9.3)":
     dependencies:
       "@eslint-community/eslint-utils": 4.9.1(eslint@8.57.1)
-      "@typescript-eslint/scope-manager": 8.53.0
-      "@typescript-eslint/types": 8.53.0
-      "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
       eslint: 8.57.1
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  "@typescript-eslint/utils@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
+  "@typescript-eslint/utils@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)":
     dependencies:
       "@eslint-community/eslint-utils": 4.9.1(eslint@9.39.2(jiti@2.6.1))
-      "@typescript-eslint/scope-manager": 8.53.0
-      "@typescript-eslint/types": 8.53.0
-      "@typescript-eslint/typescript-estree": 8.53.0(typescript@5.9.3)
+      "@typescript-eslint/scope-manager": 8.55.0
+      "@typescript-eslint/types": 8.55.0
+      "@typescript-eslint/typescript-estree": 8.55.0(typescript@5.9.3)
       eslint: 9.39.2(jiti@2.6.1)
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -24856,6 +25874,11 @@ snapshots:
       "@typescript-eslint/types": 8.53.0
       eslint-visitor-keys: 4.2.1
 
+  "@typescript-eslint/visitor-keys@8.55.0":
+    dependencies:
+      "@typescript-eslint/types": 8.55.0
+      eslint-visitor-keys: 4.2.1
+
   "@ungap/structured-clone@1.3.0": {}
 
   "@unrs/resolver-binding-android-arm-eabi@1.11.1":
@@ -24944,6 +25967,25 @@ snapshots:
     dependencies:
       "@vanilla-extract/css": 1.17.3
 
+  "@vitest/coverage-v8@3.2.4(vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))":
+    dependencies:
+      "@ampproject/remapping": 2.3.0
+      "@bcoe/v8-coverage": 1.0.2
+      ast-v8-to-istanbul: 0.3.11
+      debug: 4.4.3
+      istanbul-lib-coverage: 3.2.2
+      istanbul-lib-report: 3.0.1
+      istanbul-lib-source-maps: 5.0.6
+      istanbul-reports: 3.1.7
+      magic-string: 0.30.21
+      magicast: 0.3.5
+      std-env: 3.9.0
+      test-exclude: 7.0.1
+      tinyrainbow: 2.0.0
+      vitest: 3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
+    transitivePeerDependencies:
+      - supports-color
+
   "@vitest/expect@3.2.4":
     dependencies:
       "@types/chai": 5.2.2
@@ -24952,13 +25994,13 @@ snapshots:
       chai: 5.2.1
       tinyrainbow: 2.0.0
 
-  "@vitest/mocker@3.2.4(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))":
+  "@vitest/mocker@3.2.4(vite@7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))":
     dependencies:
       "@vitest/spy": 3.2.4
       estree-walker: 3.0.3
       magic-string: 0.30.17
     optionalDependencies:
-      vite: 7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
+      vite: 7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
 
   "@vitest/pretty-format@3.2.4":
     dependencies:
@@ -24986,19 +26028,19 @@ snapshots:
       loupe: 3.1.4
       tinyrainbow: 2.0.0
 
-  "@wagmi/connectors@6.2.0(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)":
+  "@wagmi/connectors@6.2.0(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)":
     dependencies:
       "@base-org/account": 2.4.0(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
       "@coinbase/wallet-sdk": 4.3.6(@types/react@19.2.8)(bufferutil@4.0.9)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(zod@3.25.76)
-      "@gemini-wallet/core": 0.3.2(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
+      "@gemini-wallet/core": 0.3.2(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
       "@metamask/sdk": 0.33.1(bufferutil@4.0.9)(utf-8-validate@5.0.10)
       "@safe-global/safe-apps-provider": 0.18.6(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       "@safe-global/safe-apps-sdk": 9.1.0(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
-      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
+      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
       "@walletconnect/ethereum-provider": 2.21.1(@types/react@19.2.8)(bufferutil@4.0.9)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       cbw-sdk: "@coinbase/wallet-sdk@3.9.3"
-      porto: 0.2.35(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      porto: 0.2.35(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -25040,14 +26082,14 @@ snapshots:
       - ws
       - zod
 
-  "@wagmi/core@2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
+  "@wagmi/core@2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))":
     dependencies:
       eventemitter3: 5.0.1
       mipd: 0.0.7(typescript@5.9.3)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zustand: 5.0.0(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
     optionalDependencies:
-      "@tanstack/query-core": 5.90.11
+      "@tanstack/query-core": 5.90.20
       typescript: 5.9.3
     transitivePeerDependencies:
       - "@types/react"
@@ -25705,14 +26747,6 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  "@whatwg-node/server@0.10.10":
-    dependencies:
-      "@envelop/instrumentation": 1.0.0
-      "@whatwg-node/disposablestack": 0.0.6
-      "@whatwg-node/fetch": 0.10.9
-      "@whatwg-node/promise-helpers": 1.3.2
-      tslib: 2.8.1
-
   "@whatwg-node/server@0.10.18":
     dependencies:
       "@envelop/instrumentation": 1.0.0
@@ -25768,27 +26802,17 @@ snapshots:
       typescript: 5.9.3
       zod: 3.25.76
 
-  abitype@1.1.0(typescript@5.9.3)(zod@3.22.4):
-    optionalDependencies:
-      typescript: 5.9.3
-      zod: 3.22.4
-
-  abitype@1.1.0(typescript@5.9.3)(zod@3.25.76):
-    optionalDependencies:
-      typescript: 5.9.3
-      zod: 3.25.76
-
-  abitype@1.2.1(typescript@5.9.3)(zod@3.22.4):
+  abitype@1.2.3(typescript@5.9.3)(zod@3.22.4):
     optionalDependencies:
       typescript: 5.9.3
       zod: 3.22.4
 
-  abitype@1.2.1(typescript@5.9.3)(zod@3.25.76):
+  abitype@1.2.3(typescript@5.9.3)(zod@3.25.76):
     optionalDependencies:
       typescript: 5.9.3
       zod: 3.25.76
 
-  abitype@1.2.1(typescript@5.9.3)(zod@4.1.13):
+  abitype@1.2.3(typescript@5.9.3)(zod@4.1.13):
     optionalDependencies:
       typescript: 5.9.3
       zod: 4.1.13
@@ -26014,6 +27038,12 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
+  ast-v8-to-istanbul@0.3.11:
+    dependencies:
+      "@jridgewell/trace-mapping": 0.3.31
+      estree-walker: 3.0.3
+      js-tokens: 10.0.0
+
   astral-regex@2.0.0: {}
 
   async-function@1.0.0: {}
@@ -26039,15 +27069,15 @@ snapshots:
 
   axe-core@4.10.3: {}
 
-  axios-retry@4.5.0(axios@1.13.2):
+  axios-retry@4.5.0(axios@1.13.5):
     dependencies:
-      axios: 1.13.2
+      axios: 1.13.5
       is-retry-allowed: 2.2.0
 
-  axios@1.13.2:
+  axios@1.13.5:
     dependencies:
-      follow-redirects: 1.15.9
-      form-data: 4.0.4
+      follow-redirects: 1.15.11
+      form-data: 4.0.5
       proxy-from-env: 1.1.0
     transitivePeerDependencies:
       - debug
@@ -26081,12 +27111,26 @@ snapshots:
       - supports-color
     optional: true
 
-  babel-loader@9.2.1(@babel/core@7.28.5)(webpack@5.103.0):
+  babel-jest@29.7.0(@babel/core@7.29.0):
+    dependencies:
+      "@babel/core": 7.29.0
+      "@jest/transform": 29.7.0
+      "@types/babel__core": 7.20.5
+      babel-plugin-istanbul: 6.1.1
+      babel-preset-jest: 29.6.3(@babel/core@7.29.0)
+      chalk: 4.1.2
+      graceful-fs: 4.2.11
+      slash: 3.0.0
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
+
+  babel-loader@9.2.1(@babel/core@7.28.5)(webpack@5.105.1):
     dependencies:
       "@babel/core": 7.28.5
       find-cache-dir: 4.0.0
       schema-utils: 4.3.3
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   babel-plugin-istanbul@6.1.1:
     dependencies:
@@ -26100,8 +27144,8 @@ snapshots:
 
   babel-plugin-jest-hoist@29.6.3:
     dependencies:
-      "@babel/template": 7.27.2
-      "@babel/types": 7.28.5
+      "@babel/template": 7.28.6
+      "@babel/types": 7.29.0
       "@types/babel__core": 7.20.5
       "@types/babel__traverse": 7.28.0
 
@@ -26170,6 +27214,26 @@ snapshots:
       "@babel/plugin-syntax-top-level-await": 7.14.5(@babel/core@7.28.5)
     optional: true
 
+  babel-preset-current-node-syntax@1.1.0(@babel/core@7.29.0):
+    dependencies:
+      "@babel/core": 7.29.0
+      "@babel/plugin-syntax-async-generators": 7.8.4(@babel/core@7.29.0)
+      "@babel/plugin-syntax-bigint": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-class-properties": 7.12.13(@babel/core@7.29.0)
+      "@babel/plugin-syntax-class-static-block": 7.14.5(@babel/core@7.29.0)
+      "@babel/plugin-syntax-import-attributes": 7.27.1(@babel/core@7.29.0)
+      "@babel/plugin-syntax-import-meta": 7.10.4(@babel/core@7.29.0)
+      "@babel/plugin-syntax-json-strings": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-logical-assignment-operators": 7.10.4(@babel/core@7.29.0)
+      "@babel/plugin-syntax-nullish-coalescing-operator": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-numeric-separator": 7.10.4(@babel/core@7.29.0)
+      "@babel/plugin-syntax-object-rest-spread": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-optional-catch-binding": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-optional-chaining": 7.8.3(@babel/core@7.29.0)
+      "@babel/plugin-syntax-private-property-in-object": 7.14.5(@babel/core@7.29.0)
+      "@babel/plugin-syntax-top-level-await": 7.14.5(@babel/core@7.29.0)
+    optional: true
+
   babel-preset-fbjs@3.4.0(@babel/core@7.28.5):
     dependencies:
       "@babel/core": 7.28.5
@@ -26216,6 +27280,13 @@ snapshots:
       babel-preset-current-node-syntax: 1.1.0(@babel/core@7.28.5)
     optional: true
 
+  babel-preset-jest@29.6.3(@babel/core@7.29.0):
+    dependencies:
+      "@babel/core": 7.29.0
+      babel-plugin-jest-hoist: 29.6.3
+      babel-preset-current-node-syntax: 1.1.0(@babel/core@7.29.0)
+    optional: true
+
   balanced-match@1.0.2: {}
 
   base-x@3.0.11:
@@ -26565,6 +27636,8 @@ snapshots:
 
   commander@14.0.2: {}
 
+  commander@14.0.3: {}
+
   commander@2.20.3: {}
 
   commander@4.1.1: {}
@@ -26652,9 +27725,9 @@ snapshots:
 
   core-util-is@1.0.3: {}
 
-  cosmiconfig-typescript-loader@6.1.0(@types/node@20.19.25)(cosmiconfig@9.0.0(typescript@5.9.3))(typescript@5.9.3):
+  cosmiconfig-typescript-loader@6.1.0(@types/node@20.19.33)(cosmiconfig@9.0.0(typescript@5.9.3))(typescript@5.9.3):
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       cosmiconfig: 9.0.0(typescript@5.9.3)
       jiti: 2.6.1
       typescript: 5.9.3
@@ -26708,13 +27781,13 @@ snapshots:
       safe-buffer: 5.2.1
       sha.js: 2.4.12
 
-  create-jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)):
+  create-jest@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)):
     dependencies:
       "@jest/types": 29.6.3
       chalk: 4.1.2
       exit: 0.1.2
       graceful-fs: 4.2.11
-      jest-config: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       jest-util: 29.7.0
       prompts: 2.4.2
     transitivePeerDependencies:
@@ -26723,13 +27796,13 @@ snapshots:
       - supports-color
       - ts-node
 
-  create-jest@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)):
+  create-jest@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)):
     dependencies:
       "@jest/types": 29.6.3
       chalk: 4.1.2
       exit: 0.1.2
       graceful-fs: 4.2.11
-      jest-config: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       jest-util: 29.7.0
       prompts: 2.4.2
     transitivePeerDependencies:
@@ -26783,7 +27856,7 @@ snapshots:
       randombytes: 2.1.0
       randomfill: 1.0.4
 
-  css-loader@6.11.0(webpack@5.103.0):
+  css-loader@6.11.0(webpack@5.105.1):
     dependencies:
       icss-utils: 5.1.0(postcss@8.5.6)
       postcss: 8.5.6
@@ -26794,9 +27867,9 @@ snapshots:
       postcss-value-parser: 4.2.0
       semver: 7.7.3
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
-  css-loader@7.1.2(webpack@5.103.0):
+  css-loader@7.1.3(webpack@5.105.1):
     dependencies:
       icss-utils: 5.1.0(postcss@8.5.6)
       postcss: 8.5.6
@@ -26807,7 +27880,7 @@ snapshots:
       postcss-value-parser: 4.2.0
       semver: 7.7.3
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   css-select@4.3.0:
     dependencies:
@@ -26905,8 +27978,6 @@ snapshots:
 
   dayjs@1.11.13: {}
 
-  dayjs@1.11.18: {}
-
   dayjs@1.11.19: {}
 
   debounce-fn@5.1.2:
@@ -27001,8 +28072,6 @@ snapshots:
 
   detect-indent@6.1.0: {}
 
-  detect-libc@1.0.3: {}
-
   detect-libc@2.1.2: {}
 
   detect-newline@3.1.0: {}
@@ -27094,32 +28163,32 @@ snapshots:
 
   dotenv@16.6.1: {}
 
-  dotenv@17.2.3: {}
+  dotenv@17.2.4: {}
 
-  drizzle-kit@0.31.7:
+  drizzle-kit@0.31.9:
     dependencies:
       "@drizzle-team/brocli": 0.10.2
       "@esbuild-kit/esm-loader": 2.6.5
-      esbuild: 0.25.8
-      esbuild-register: 3.6.0(esbuild@0.25.8)
+      esbuild: 0.25.12
+      esbuild-register: 3.6.0(esbuild@0.25.12)
     transitivePeerDependencies:
       - supports-color
 
-  drizzle-orm@0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.15.6)(kysely@0.26.3)(pg@8.16.3):
+  drizzle-orm@0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(kysely@0.26.3)(pg@8.18.0):
     optionalDependencies:
       "@electric-sql/pglite": 0.2.13
       "@opentelemetry/api": 1.9.0
-      "@types/pg": 8.15.6
+      "@types/pg": 8.16.0
       kysely: 0.26.3
-      pg: 8.16.3
+      pg: 8.18.0
 
-  drizzle-orm@0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.15.6)(kysely@0.26.3)(pg@8.17.2):
+  drizzle-orm@0.45.1(@electric-sql/pglite@0.3.15)(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(kysely@0.26.3)(pg@8.18.0):
     optionalDependencies:
-      "@electric-sql/pglite": 0.2.13
+      "@electric-sql/pglite": 0.3.15
       "@opentelemetry/api": 1.9.0
-      "@types/pg": 8.15.6
+      "@types/pg": 8.16.0
       kysely: 0.26.3
-      pg: 8.17.2
+      pg: 8.18.0
 
   dset@3.1.4: {}
 
@@ -27200,6 +28269,11 @@ snapshots:
       graceful-fs: 4.2.11
       tapable: 2.3.0
 
+  enhanced-resolve@5.19.0:
+    dependencies:
+      graceful-fs: 4.2.11
+      tapable: 2.3.0
+
   entities@2.2.0: {}
 
   env-paths@2.2.1: {}
@@ -27298,6 +28372,8 @@ snapshots:
 
   es-module-lexer@1.7.0: {}
 
+  es-module-lexer@2.0.0: {}
+
   es-object-atoms@1.1.1:
     dependencies:
       es-errors: 1.3.0
@@ -27327,10 +28403,10 @@ snapshots:
     dependencies:
       es6-promise: 4.2.8
 
-  esbuild-register@3.6.0(esbuild@0.25.8):
+  esbuild-register@3.6.0(esbuild@0.25.12):
     dependencies:
       debug: 4.4.3
-      esbuild: 0.25.8
+      esbuild: 0.25.12
     transitivePeerDependencies:
       - supports-color
 
@@ -27385,6 +28461,35 @@ snapshots:
       "@esbuild/win32-ia32": 0.21.5
       "@esbuild/win32-x64": 0.21.5
 
+  esbuild@0.25.12:
+    optionalDependencies:
+      "@esbuild/aix-ppc64": 0.25.12
+      "@esbuild/android-arm": 0.25.12
+      "@esbuild/android-arm64": 0.25.12
+      "@esbuild/android-x64": 0.25.12
+      "@esbuild/darwin-arm64": 0.25.12
+      "@esbuild/darwin-x64": 0.25.12
+      "@esbuild/freebsd-arm64": 0.25.12
+      "@esbuild/freebsd-x64": 0.25.12
+      "@esbuild/linux-arm": 0.25.12
+      "@esbuild/linux-arm64": 0.25.12
+      "@esbuild/linux-ia32": 0.25.12
+      "@esbuild/linux-loong64": 0.25.12
+      "@esbuild/linux-mips64el": 0.25.12
+      "@esbuild/linux-ppc64": 0.25.12
+      "@esbuild/linux-riscv64": 0.25.12
+      "@esbuild/linux-s390x": 0.25.12
+      "@esbuild/linux-x64": 0.25.12
+      "@esbuild/netbsd-arm64": 0.25.12
+      "@esbuild/netbsd-x64": 0.25.12
+      "@esbuild/openbsd-arm64": 0.25.12
+      "@esbuild/openbsd-x64": 0.25.12
+      "@esbuild/openharmony-arm64": 0.25.12
+      "@esbuild/sunos-x64": 0.25.12
+      "@esbuild/win32-arm64": 0.25.12
+      "@esbuild/win32-ia32": 0.25.12
+      "@esbuild/win32-x64": 0.25.12
+
   esbuild@0.25.8:
     optionalDependencies:
       "@esbuild/aix-ppc64": 0.25.8
@@ -27471,10 +28576,10 @@ snapshots:
       - eslint-plugin-import-x
       - supports-color
 
-  eslint-config-ponder@0.5.25(@typescript-eslint/eslint-plugin@8.53.0(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3))(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1):
+  eslint-config-ponder@0.5.25(@typescript-eslint/eslint-plugin@8.55.0(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3))(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1):
     dependencies:
-      "@typescript-eslint/eslint-plugin": 8.53.0(@typescript-eslint/parser@8.53.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3)
-      "@typescript-eslint/parser": 8.53.0(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/eslint-plugin": 8.55.0(@typescript-eslint/parser@8.55.0(eslint@8.57.1)(typescript@5.9.3))(eslint@8.57.1)(typescript@5.9.3)
+      "@typescript-eslint/parser": 8.55.0(eslint@8.57.1)(typescript@5.9.3)
       eslint: 8.57.1
 
   eslint-config-prettier@9.1.2(eslint@8.57.1):
@@ -27519,6 +28624,16 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  eslint-module-utils@2.12.1(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint-import-resolver-node@0.3.9)(eslint@9.39.2(jiti@2.6.1)):
+    dependencies:
+      debug: 3.2.7
+    optionalDependencies:
+      "@typescript-eslint/parser": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+      eslint: 9.39.2(jiti@2.6.1)
+      eslint-import-resolver-node: 0.3.9
+    transitivePeerDependencies:
+      - supports-color
+
   eslint-plugin-import@2.32.0(@typescript-eslint/parser@8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint-import-resolver-typescript@3.10.1)(eslint@9.39.2(jiti@2.6.1)):
     dependencies:
       "@rtsao/scc": 1.1.0
@@ -27548,6 +28663,35 @@ snapshots:
       - eslint-import-resolver-webpack
       - supports-color
 
+  eslint-plugin-import@2.32.0(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.2(jiti@2.6.1)):
+    dependencies:
+      "@rtsao/scc": 1.1.0
+      array-includes: 3.1.9
+      array.prototype.findlastindex: 1.2.6
+      array.prototype.flat: 1.3.3
+      array.prototype.flatmap: 1.3.3
+      debug: 3.2.7
+      doctrine: 2.1.0
+      eslint: 9.39.2(jiti@2.6.1)
+      eslint-import-resolver-node: 0.3.9
+      eslint-module-utils: 2.12.1(@typescript-eslint/parser@8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3))(eslint-import-resolver-node@0.3.9)(eslint@9.39.2(jiti@2.6.1))
+      hasown: 2.0.2
+      is-core-module: 2.16.1
+      is-glob: 4.0.3
+      minimatch: 3.1.2
+      object.fromentries: 2.0.8
+      object.groupby: 1.0.3
+      object.values: 1.2.1
+      semver: 6.3.1
+      string.prototype.trimend: 1.0.9
+      tsconfig-paths: 3.15.0
+    optionalDependencies:
+      "@typescript-eslint/parser": 8.55.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
+    transitivePeerDependencies:
+      - eslint-import-resolver-typescript
+      - eslint-import-resolver-webpack
+      - supports-color
+
   eslint-plugin-jsx-a11y@6.10.2(eslint@9.39.2(jiti@2.6.1)):
     dependencies:
       aria-query: 5.3.2
@@ -27567,22 +28711,22 @@ snapshots:
       safe-regex-test: 1.1.0
       string.prototype.includes: 2.0.1
 
-  eslint-plugin-prettier@5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.7.4):
+  eslint-plugin-prettier@5.5.5(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@8.57.1))(eslint@8.57.1)(prettier@3.8.1):
     dependencies:
       eslint: 8.57.1
-      prettier: 3.7.4
-      prettier-linter-helpers: 1.0.0
-      synckit: 0.11.11
+      prettier: 3.8.1
+      prettier-linter-helpers: 1.0.1
+      synckit: 0.11.12
     optionalDependencies:
       "@types/eslint": 9.6.1
       eslint-config-prettier: 9.1.2(eslint@8.57.1)
 
-  eslint-plugin-prettier@5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@9.39.2(jiti@2.6.1)))(eslint@9.39.2(jiti@2.6.1))(prettier@3.7.4):
+  eslint-plugin-prettier@5.5.5(@types/eslint@9.6.1)(eslint-config-prettier@9.1.2(eslint@9.39.2(jiti@2.6.1)))(eslint@9.39.2(jiti@2.6.1))(prettier@3.8.1):
     dependencies:
       eslint: 9.39.2(jiti@2.6.1)
-      prettier: 3.7.4
-      prettier-linter-helpers: 1.0.0
-      synckit: 0.11.11
+      prettier: 3.8.1
+      prettier-linter-helpers: 1.0.1
+      synckit: 0.11.12
     optionalDependencies:
       "@types/eslint": 9.6.1
       eslint-config-prettier: 9.1.2(eslint@9.39.2(jiti@2.6.1))
@@ -27620,11 +28764,11 @@ snapshots:
       string.prototype.matchall: 4.0.12
       string.prototype.repeat: 1.0.0
 
-  eslint-plugin-storybook@10.2.0(eslint@9.39.2(jiti@2.6.1))(storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3):
+  eslint-plugin-storybook@10.2.8(eslint@9.39.2(jiti@2.6.1))(storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10))(typescript@5.9.3):
     dependencies:
       "@typescript-eslint/utils": 8.53.0(eslint@9.39.2(jiti@2.6.1))(typescript@5.9.3)
       eslint: 9.39.2(jiti@2.6.1)
-      storybook: 10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
+      storybook: 10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10)
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -27819,6 +28963,8 @@ snapshots:
 
   eventemitter3@5.0.1: {}
 
+  eventemitter3@5.0.4: {}
+
   events@3.3.0: {}
 
   evp_bytestokey@1.0.3:
@@ -28030,7 +29176,7 @@ snapshots:
 
   flatted@3.3.3: {}
 
-  follow-redirects@1.15.9: {}
+  follow-redirects@1.15.11: {}
 
   for-each@0.3.5:
     dependencies:
@@ -28043,12 +29189,12 @@ snapshots:
       cross-spawn: 7.0.6
       signal-exit: 4.1.0
 
-  forge-std@https://codeload.github.com/foundry-rs/forge-std/tar.gz/8e7bbe65b08aa71a0c93b50dc707da716a2ac1ff:
+  forge-std@https://codeload.github.com/foundry-rs/forge-std/tar.gz/aeb45e9f32ef8ca78f0aeda17596e9c46374da41:
     {}
 
-  fork-ts-checker-webpack-plugin@9.1.0(typescript@5.9.3)(webpack@5.103.0):
+  fork-ts-checker-webpack-plugin@9.1.0(typescript@5.9.3)(webpack@5.105.1):
     dependencies:
-      "@babel/code-frame": 7.27.1
+      "@babel/code-frame": 7.29.0
       chalk: 4.1.2
       chokidar: 4.0.3
       cosmiconfig: 8.3.6(typescript@5.9.3)
@@ -28061,9 +29207,9 @@ snapshots:
       semver: 7.7.3
       tapable: 2.3.0
       typescript: 5.9.3
-      webpack: 5.103.0
+      webpack: 5.105.1
 
-  form-data@4.0.4:
+  form-data@4.0.5:
     dependencies:
       asynckit: 0.4.0
       combined-stream: 1.0.8
@@ -28144,11 +29290,11 @@ snapshots:
       es-errors: 1.3.0
       get-intrinsic: 1.3.0
 
-  get-tsconfig@4.10.1:
+  get-tsconfig@4.13.0:
     dependencies:
       resolve-pkg-maps: 1.0.0
 
-  get-tsconfig@4.13.0:
+  get-tsconfig@4.13.6:
     dependencies:
       resolve-pkg-maps: 1.0.0
 
@@ -28179,7 +29325,7 @@ snapshots:
 
   glob@13.0.0:
     dependencies:
-      minimatch: 10.1.1
+      minimatch: 10.1.2
       minipass: 7.1.2
       path-scurry: 2.0.1
 
@@ -28235,13 +29381,13 @@ snapshots:
       graphql: 16.12.0
       graphql-type-json: 0.3.2(graphql@16.12.0)
 
-  graphql-config@5.1.5(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10):
+  graphql-config@5.1.5(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(typescript@5.9.3)(utf-8-validate@5.0.10):
     dependencies:
       "@graphql-tools/graphql-file-loader": 8.0.22(graphql@16.12.0)
       "@graphql-tools/json-file-loader": 8.0.20(graphql@16.12.0)
       "@graphql-tools/load": 8.1.2(graphql@16.12.0)
       "@graphql-tools/merge": 9.1.1(graphql@16.12.0)
-      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.25)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
+      "@graphql-tools/url-loader": 8.0.33(@types/node@20.19.33)(bufferutil@4.0.9)(crossws@0.3.5)(graphql@16.12.0)(utf-8-validate@5.0.10)
       "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
       cosmiconfig: 8.3.6(typescript@5.9.3)
       graphql: 16.12.0
@@ -28256,7 +29402,6 @@ snapshots:
       - crossws
       - supports-color
       - typescript
-      - uWebSockets.js
       - utf-8-validate
 
   graphql-fields@2.0.3: {}
@@ -28302,7 +29447,7 @@ snapshots:
     dependencies:
       graphql: 16.12.0
 
-  graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
+  graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
     dependencies:
       graphql: 16.12.0
     optionalDependencies:
@@ -28310,43 +29455,42 @@ snapshots:
       ws: 8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optional: true
 
-  graphql-ws@6.0.6(crossws@0.3.5)(graphql@16.12.0)(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
+  graphql-ws@6.0.7(crossws@0.3.5)(graphql@16.12.0)(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
     dependencies:
       graphql: 16.12.0
     optionalDependencies:
       crossws: 0.3.5
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
 
-  graphql-yoga@5.15.1(graphql@16.12.0):
+  graphql-yoga@5.17.1(graphql@16.8.2):
     dependencies:
       "@envelop/core": 5.4.0
       "@envelop/instrumentation": 1.0.0
-      "@graphql-tools/executor": 1.4.9(graphql@16.12.0)
-      "@graphql-tools/schema": 10.0.25(graphql@16.12.0)
-      "@graphql-tools/utils": 10.9.1(graphql@16.12.0)
+      "@graphql-tools/executor": 1.5.0(graphql@16.8.2)
+      "@graphql-tools/schema": 10.0.30(graphql@16.8.2)
+      "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
       "@graphql-yoga/logger": 2.0.1
       "@graphql-yoga/subscription": 5.0.5
-      "@whatwg-node/fetch": 0.10.9
+      "@whatwg-node/fetch": 0.10.13
       "@whatwg-node/promise-helpers": 1.3.2
-      "@whatwg-node/server": 0.10.10
-      dset: 3.1.4
-      graphql: 16.12.0
+      "@whatwg-node/server": 0.10.18
+      graphql: 16.8.2
       lru-cache: 10.4.3
       tslib: 2.8.1
 
-  graphql-yoga@5.17.1(graphql@16.8.2):
+  graphql-yoga@5.18.0(graphql@16.12.0):
     dependencies:
       "@envelop/core": 5.4.0
       "@envelop/instrumentation": 1.0.0
-      "@graphql-tools/executor": 1.5.0(graphql@16.8.2)
-      "@graphql-tools/schema": 10.0.30(graphql@16.8.2)
-      "@graphql-tools/utils": 10.11.0(graphql@16.8.2)
+      "@graphql-tools/executor": 1.5.1(graphql@16.12.0)
+      "@graphql-tools/schema": 10.0.31(graphql@16.12.0)
+      "@graphql-tools/utils": 10.11.0(graphql@16.12.0)
       "@graphql-yoga/logger": 2.0.1
       "@graphql-yoga/subscription": 5.0.5
-      "@whatwg-node/fetch": 0.10.13
+      "@whatwg-node/fetch": 0.10.9
       "@whatwg-node/promise-helpers": 1.3.2
       "@whatwg-node/server": 0.10.18
-      graphql: 16.8.2
+      graphql: 16.12.0
       lru-cache: 10.4.3
       tslib: 2.8.1
 
@@ -28434,7 +29578,7 @@ snapshots:
     dependencies:
       react-is: 16.13.1
 
-  hono@4.10.7: {}
+  hono@4.11.9: {}
 
   html-entities@2.6.0: {}
 
@@ -28448,17 +29592,17 @@ snapshots:
       he: 1.2.0
       param-case: 3.0.4
       relateurl: 0.2.7
-      terser: 5.44.1
+      terser: 5.46.0
 
-  html-webpack-plugin@5.6.5(webpack@5.103.0):
+  html-webpack-plugin@5.6.6(webpack@5.105.1):
     dependencies:
       "@types/html-minifier-terser": 6.1.0
       html-minifier-terser: 6.1.0
-      lodash: 4.17.21
+      lodash: 4.17.23
       pretty-error: 4.0.0
       tapable: 2.3.0
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   htmlparser2@6.1.0:
     dependencies:
@@ -28620,7 +29764,7 @@ snapshots:
 
   is-bun-module@2.0.0:
     dependencies:
-      semver: 7.7.3
+      semver: 7.7.4
 
   is-callable@1.2.7: {}
 
@@ -28790,9 +29934,9 @@ snapshots:
     dependencies:
       ws: 7.5.10(bufferutil@4.0.9)(utf-8-validate@5.0.10)
 
-  isomorphic-ws@5.0.0(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
+  isomorphic-ws@5.0.0(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
     dependencies:
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
 
   isows@1.0.6(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
     dependencies:
@@ -28802,12 +29946,16 @@ snapshots:
     dependencies:
       ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
 
+  isows@1.0.7(ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)):
+    dependencies:
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+
   istanbul-lib-coverage@3.2.2: {}
 
   istanbul-lib-instrument@5.2.1:
     dependencies:
       "@babel/core": 7.28.0
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.29.0
       "@istanbuljs/schema": 0.1.3
       istanbul-lib-coverage: 3.2.2
       semver: 6.3.1
@@ -28817,10 +29965,10 @@ snapshots:
   istanbul-lib-instrument@6.0.3:
     dependencies:
       "@babel/core": 7.28.0
-      "@babel/parser": 7.28.0
+      "@babel/parser": 7.28.6
       "@istanbuljs/schema": 0.1.3
       istanbul-lib-coverage: 3.2.2
-      semver: 7.7.3
+      semver: 7.7.4
     transitivePeerDependencies:
       - supports-color
 
@@ -28838,6 +29986,14 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  istanbul-lib-source-maps@5.0.6:
+    dependencies:
+      "@jridgewell/trace-mapping": 0.3.31
+      debug: 4.4.3
+      istanbul-lib-coverage: 3.2.2
+    transitivePeerDependencies:
+      - supports-color
+
   istanbul-reports@3.1.7:
     dependencies:
       html-escaper: 2.0.2
@@ -28888,7 +30044,7 @@ snapshots:
       "@jest/expect": 29.7.0
       "@jest/test-result": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       chalk: 4.1.2
       co: 4.6.0
       dedent: 1.6.0
@@ -28908,16 +30064,16 @@ snapshots:
       - babel-plugin-macros
       - supports-color
 
-  jest-cli@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)):
+  jest-cli@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)):
     dependencies:
-      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       "@jest/test-result": 29.7.0
       "@jest/types": 29.6.3
       chalk: 4.1.2
-      create-jest: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      create-jest: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       exit: 0.1.2
       import-local: 3.2.0
-      jest-config: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       jest-util: 29.7.0
       jest-validate: 29.7.0
       yargs: 17.7.2
@@ -28927,16 +30083,16 @@ snapshots:
       - supports-color
       - ts-node
 
-  jest-cli@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)):
+  jest-cli@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)):
     dependencies:
-      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       "@jest/test-result": 29.7.0
       "@jest/types": 29.6.3
       chalk: 4.1.2
-      create-jest: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      create-jest: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       exit: 0.1.2
       import-local: 3.2.0
-      jest-config: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      jest-config: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       jest-util: 29.7.0
       jest-validate: 29.7.0
       yargs: 17.7.2
@@ -28946,7 +30102,7 @@ snapshots:
       - supports-color
       - ts-node
 
-  jest-config@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)):
+  jest-config@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)):
     dependencies:
       "@babel/core": 7.28.0
       "@jest/test-sequencer": 29.7.0
@@ -28971,13 +30127,13 @@ snapshots:
       slash: 3.0.0
       strip-json-comments: 3.1.1
     optionalDependencies:
-      "@types/node": 20.19.25
-      ts-node: 10.9.2(@types/node@20.19.25)(typescript@5.9.3)
+      "@types/node": 20.19.33
+      ts-node: 10.9.2(@types/node@20.19.33)(typescript@5.9.3)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
 
-  jest-config@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)):
+  jest-config@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)):
     dependencies:
       "@babel/core": 7.28.0
       "@jest/test-sequencer": 29.7.0
@@ -29002,13 +30158,13 @@ snapshots:
       slash: 3.0.0
       strip-json-comments: 3.1.1
     optionalDependencies:
-      "@types/node": 20.19.25
-      ts-node: 10.9.2(@types/node@22.7.5)(typescript@5.9.3)
+      "@types/node": 25.2.3
+      ts-node: 10.9.2(@types/node@20.19.33)(typescript@5.9.3)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
 
-  jest-config@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)):
+  jest-config@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)):
     dependencies:
       "@babel/core": 7.28.0
       "@jest/test-sequencer": 29.7.0
@@ -29033,8 +30189,8 @@ snapshots:
       slash: 3.0.0
       strip-json-comments: 3.1.1
     optionalDependencies:
-      "@types/node": 22.7.5
-      ts-node: 10.9.2(@types/node@22.7.5)(typescript@5.9.3)
+      "@types/node": 25.2.3
+      ts-node: 10.9.2(@types/node@25.2.3)(typescript@5.9.3)
     transitivePeerDependencies:
       - babel-plugin-macros
       - supports-color
@@ -29063,7 +30219,7 @@ snapshots:
       "@jest/environment": 29.7.0
       "@jest/fake-timers": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       jest-mock: 29.7.0
       jest-util: 29.7.0
 
@@ -29073,7 +30229,7 @@ snapshots:
     dependencies:
       "@jest/types": 29.6.3
       "@types/graceful-fs": 4.1.9
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       anymatch: 3.1.3
       fb-watchman: 2.0.2
       graceful-fs: 4.2.11
@@ -29112,7 +30268,7 @@ snapshots:
   jest-mock@29.7.0:
     dependencies:
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       jest-util: 29.7.0
 
   jest-pnp-resolver@1.2.3(jest-resolve@29.7.0):
@@ -29147,7 +30303,7 @@ snapshots:
       "@jest/test-result": 29.7.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       chalk: 4.1.2
       emittery: 0.13.1
       graceful-fs: 4.2.11
@@ -29175,7 +30331,7 @@ snapshots:
       "@jest/test-result": 29.7.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       chalk: 4.1.2
       cjs-module-lexer: 1.4.3
       collect-v8-coverage: 1.0.2
@@ -29221,7 +30377,7 @@ snapshots:
   jest-util@29.7.0:
     dependencies:
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       chalk: 4.1.2
       ci-info: 3.9.0
       graceful-fs: 4.2.11
@@ -29240,7 +30396,7 @@ snapshots:
     dependencies:
       "@jest/test-result": 29.7.0
       "@jest/types": 29.6.3
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       ansi-escapes: 4.3.2
       chalk: 4.1.2
       emittery: 0.13.1
@@ -29249,35 +30405,35 @@ snapshots:
 
   jest-worker@27.5.1:
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       merge-stream: 2.0.0
       supports-color: 8.1.1
 
   jest-worker@29.7.0:
     dependencies:
-      "@types/node": 20.19.25
+      "@types/node": 25.2.3
       jest-util: 29.7.0
       merge-stream: 2.0.0
       supports-color: 8.1.1
 
-  jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)):
+  jest@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)):
     dependencies:
-      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       "@jest/types": 29.6.3
       import-local: 3.2.0
-      jest-cli: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      jest-cli: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
     transitivePeerDependencies:
       - "@types/node"
       - babel-plugin-macros
       - supports-color
       - ts-node
 
-  jest@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)):
+  jest@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)):
     dependencies:
-      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      "@jest/core": 29.7.0(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       "@jest/types": 29.6.3
       import-local: 3.2.0
-      jest-cli: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      jest-cli: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
     transitivePeerDependencies:
       - "@types/node"
       - babel-plugin-macros
@@ -29298,6 +30454,8 @@ snapshots:
 
   js-sha3@0.8.0: {}
 
+  js-tokens@10.0.0: {}
+
   js-tokens@4.0.0: {}
 
   js-tokens@9.0.1: {}
@@ -29595,6 +30753,8 @@ snapshots:
 
   lodash@4.17.21: {}
 
+  lodash@4.17.23: {}
+
   log-symbols@4.1.0:
     dependencies:
       chalk: 4.1.2
@@ -29641,7 +30801,7 @@ snapshots:
 
   lru-cache@10.4.3: {}
 
-  lru-cache@11.2.4: {}
+  lru-cache@11.2.6: {}
 
   lru-cache@5.1.1:
     dependencies:
@@ -29661,6 +30821,12 @@ snapshots:
     dependencies:
       "@jridgewell/sourcemap-codec": 1.5.5
 
+  magicast@0.3.5:
+    dependencies:
+      "@babel/parser": 7.28.6
+      "@babel/types": 7.28.6
+      source-map-js: 1.2.1
+
   make-dir@3.1.0:
     dependencies:
       semver: 6.3.1
@@ -29709,13 +30875,13 @@ snapshots:
 
   merge2@1.4.1: {}
 
-  meros@1.3.1(@types/node@20.19.25):
+  meros@1.3.1(@types/node@20.19.33):
     optionalDependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
 
-  meros@1.3.2(@types/node@22.7.5):
+  meros@1.3.2(@types/node@25.2.3):
     optionalDependencies:
-      "@types/node": 22.7.5
+      "@types/node": 25.2.3
 
   mersenne-twister@1.1.0: {}
 
@@ -29749,9 +30915,9 @@ snapshots:
 
   minimalistic-crypto-utils@1.0.1: {}
 
-  minimatch@10.1.1:
+  minimatch@10.1.2:
     dependencies:
-      "@isaacs/brace-expansion": 5.0.0
+      "@isaacs/brace-expansion": 5.0.1
 
   minimatch@3.1.2:
     dependencies:
@@ -29860,7 +31026,7 @@ snapshots:
 
   node-mock-http@1.0.3: {}
 
-  node-polyfill-webpack-plugin@2.0.1(webpack@5.103.0):
+  node-polyfill-webpack-plugin@2.0.1(webpack@5.105.1):
     dependencies:
       assert: 2.1.0
       browserify-zlib: 0.2.0
@@ -29887,7 +31053,7 @@ snapshots:
       url: 0.11.4
       util: 0.12.5
       vm-browserify: 1.1.2
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   node-releases@2.0.19: {}
 
@@ -29909,7 +31075,7 @@ snapshots:
 
   nullthrows@1.1.1: {}
 
-  nuqs@2.8.5(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3):
+  nuqs@2.8.8(next@16.1.3(@babel/core@7.28.5)(@opentelemetry/api@1.9.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3):
     dependencies:
       "@standard-schema/spec": 1.0.0
       react: 19.2.3
@@ -30059,65 +31225,65 @@ snapshots:
       object-keys: 1.1.1
       safe-push-apply: 1.0.0
 
-  ox@0.6.7(typescript@5.9.3)(zod@3.25.76):
+  ox@0.12.1(typescript@5.9.3)(zod@3.22.4):
     dependencies:
       "@adraffy/ens-normalize": 1.11.1
-      "@noble/curves": 1.9.7
+      "@noble/ciphers": 1.3.0
+      "@noble/curves": 1.9.1
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.2.1(typescript@5.9.3)(zod@3.25.76)
+      abitype: 1.2.3(typescript@5.9.3)(zod@3.22.4)
       eventemitter3: 5.0.1
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
       - zod
 
-  ox@0.6.9(typescript@5.9.3)(zod@3.25.76):
+  ox@0.12.1(typescript@5.9.3)(zod@3.25.76):
     dependencies:
       "@adraffy/ens-normalize": 1.11.1
-      "@noble/curves": 1.9.7
+      "@noble/ciphers": 1.3.0
+      "@noble/curves": 1.9.1
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.2.1(typescript@5.9.3)(zod@3.25.76)
+      abitype: 1.2.3(typescript@5.9.3)(zod@3.25.76)
       eventemitter3: 5.0.1
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
       - zod
 
-  ox@0.9.17(typescript@5.9.3)(zod@4.1.13):
+  ox@0.6.7(typescript@5.9.3)(zod@3.25.76):
     dependencies:
       "@adraffy/ens-normalize": 1.11.1
-      "@noble/ciphers": 1.3.0
-      "@noble/curves": 1.9.1
-      "@noble/hashes": 1.8.0
-      "@scure/bip32": 1.7.0
-      "@scure/bip39": 1.6.0
-      abitype: 1.2.1(typescript@5.9.3)(zod@4.1.13)
+      "@noble/curves": 1.8.1
+      "@noble/hashes": 1.7.1
+      "@scure/bip32": 1.6.2
+      "@scure/bip39": 1.5.4
+      abitype: 1.0.8(typescript@5.9.3)(zod@3.25.76)
       eventemitter3: 5.0.1
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
       - zod
 
-  ox@0.9.6(typescript@5.9.3)(zod@3.22.4):
+  ox@0.6.9(typescript@5.9.3)(zod@3.25.76):
     dependencies:
       "@adraffy/ens-normalize": 1.11.1
-      "@noble/ciphers": 1.3.0
-      "@noble/curves": 1.9.1
+      "@noble/curves": 1.9.7
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.2.1(typescript@5.9.3)(zod@3.22.4)
+      abitype: 1.2.3(typescript@5.9.3)(zod@3.25.76)
       eventemitter3: 5.0.1
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
       - zod
 
-  ox@0.9.6(typescript@5.9.3)(zod@3.25.76):
+  ox@0.9.17(typescript@5.9.3)(zod@4.1.13):
     dependencies:
       "@adraffy/ens-normalize": 1.11.1
       "@noble/ciphers": 1.3.0
@@ -30125,7 +31291,7 @@ snapshots:
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.2.1(typescript@5.9.3)(zod@3.25.76)
+      abitype: 1.2.3(typescript@5.9.3)(zod@4.1.13)
       eventemitter3: 5.0.1
     optionalDependencies:
       typescript: 5.9.3
@@ -30244,7 +31410,7 @@ snapshots:
 
   path-scurry@2.0.1:
     dependencies:
-      lru-cache: 11.2.4
+      lru-cache: 11.2.6
       minipass: 7.1.2
 
   path-type@4.0.0: {}
@@ -30264,13 +31430,10 @@ snapshots:
       sha.js: 2.4.12
       to-buffer: 1.2.2
 
-  pg-cloudflare@1.2.7:
-    optional: true
-
   pg-cloudflare@1.3.0:
     optional: true
 
-  pg-connection-string@2.10.1: {}
+  pg-connection-string@2.11.0: {}
 
   pg-connection-string@2.9.1: {}
 
@@ -30280,13 +31443,9 @@ snapshots:
 
   pg-int8@1.0.1: {}
 
-  pg-pool@3.10.1(pg@8.16.3):
-    dependencies:
-      pg: 8.16.3
-
-  pg-pool@3.11.0(pg@8.17.2):
+  pg-pool@3.11.0(pg@8.18.0):
     dependencies:
-      pg: 8.17.2
+      pg: 8.18.0
 
   pg-protocol@1.10.3: {}
 
@@ -30302,20 +31461,10 @@ snapshots:
       postgres-date: 1.0.7
       postgres-interval: 1.2.0
 
-  pg@8.16.3:
-    dependencies:
-      pg-connection-string: 2.9.1
-      pg-pool: 3.10.1(pg@8.16.3)
-      pg-protocol: 1.10.3
-      pg-types: 2.2.0
-      pgpass: 1.0.5
-    optionalDependencies:
-      pg-cloudflare: 1.2.7
-
-  pg@8.17.2:
+  pg@8.18.0:
     dependencies:
-      pg-connection-string: 2.10.1
-      pg-pool: 3.11.0(pg@8.17.2)
+      pg-connection-string: 2.11.0
+      pg-pool: 3.11.0(pg@8.18.0)
       pg-protocol: 1.11.0
       pg-types: 2.2.0
       pgpass: 1.0.5
@@ -30396,11 +31545,11 @@ snapshots:
       mlly: 1.8.0
       pathe: 2.0.3
 
-  playwright-core@1.57.0: {}
+  playwright-core@1.58.2: {}
 
-  playwright@1.57.0:
+  playwright@1.58.2:
     dependencies:
-      playwright-core: 1.57.0
+      playwright-core: 1.58.2
     optionalDependencies:
       fsevents: 2.3.2
 
@@ -30408,7 +31557,7 @@ snapshots:
 
   pngjs@5.0.0: {}
 
-  ponder@0.16.2(@opentelemetry/api@1.9.0)(@types/node@20.19.25)(@types/pg@8.15.6)(bufferutil@4.0.9)(hono@4.10.7)(lightningcss@1.30.2)(terser@5.44.1)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(zod@3.25.76):
+  ponder@0.16.3(@opentelemetry/api@1.9.0)(@types/node@20.19.33)(@types/pg@8.16.0)(bufferutil@4.0.9)(hono@4.11.9)(lightningcss@1.30.2)(terser@5.46.0)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(zod@3.25.76):
     dependencies:
       "@babel/code-frame": 7.27.1
       "@commander-js/extra-typings": 12.1.0(commander@12.1.0)
@@ -30416,8 +31565,8 @@ snapshots:
       "@escape.tech/graphql-armor-max-aliases": 2.6.2
       "@escape.tech/graphql-armor-max-depth": 2.4.1
       "@escape.tech/graphql-armor-max-tokens": 2.5.1
-      "@hono/node-server": 1.19.5(hono@4.10.7)
-      "@ponder/utils": 0.2.17(typescript@5.9.3)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
+      "@hono/node-server": 1.19.5(hono@4.11.9)
+      "@ponder/utils": 0.2.17(typescript@5.9.3)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
       abitype: 0.10.3(typescript@5.9.3)(zod@3.25.76)
       ansi-escapes: 7.2.0
       commander: 12.1.0
@@ -30425,14 +31574,14 @@ snapshots:
       dataloader: 2.2.3
       detect-package-manager: 3.0.2
       dotenv: 16.6.1
-      drizzle-orm: 0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.15.6)(kysely@0.26.3)(pg@8.16.3)
+      drizzle-orm: 0.41.0(@electric-sql/pglite@0.2.13)(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(kysely@0.26.3)(pg@8.18.0)
       glob: 10.5.0
       graphql: 16.8.2
       graphql-yoga: 5.17.1(graphql@16.8.2)
-      hono: 4.10.7
+      hono: 4.11.9
       http-terminator: 3.2.0
       kysely: 0.26.3
-      pg: 8.16.3
+      pg: 8.18.0
       pg-connection-string: 2.9.1
       pg-copy-streams: 6.0.6
       pg-query-emscripten: 5.1.0
@@ -30443,10 +31592,10 @@ snapshots:
       stacktrace-parser: 0.1.11
       superjson: 2.2.2
       terminal-size: 4.0.0
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
-      vite: 5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1)
-      vite-node: 1.0.2(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1)
-      vite-tsconfig-paths: 4.3.1(typescript@5.9.3)(vite@5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1))
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      vite: 5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0)
+      vite-node: 1.0.2(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0)
+      vite-tsconfig-paths: 4.3.1(typescript@5.9.3)(vite@5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0))
       ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optionalDependencies:
       typescript: 5.9.3
@@ -30492,21 +31641,21 @@ snapshots:
 
   pony-cause@2.1.11: {}
 
-  porto@0.2.35(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)):
+  porto@0.2.35(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)):
     dependencies:
-      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
-      hono: 4.10.7
+      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
+      hono: 4.11.9
       idb-keyval: 6.2.2
       mipd: 0.0.7(typescript@5.9.3)
       ox: 0.9.17(typescript@5.9.3)(zod@4.1.13)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
       zod: 4.1.13
-      zustand: 5.0.9(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
+      zustand: 5.0.11(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3))
     optionalDependencies:
-      "@tanstack/react-query": 5.90.11(react@19.2.3)
+      "@tanstack/react-query": 5.90.21(react@19.2.3)
       react: 19.2.3
       typescript: 5.9.3
-      wagmi: 2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
+      wagmi: 2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
     transitivePeerDependencies:
       - "@types/react"
       - immer
@@ -30514,6 +31663,8 @@ snapshots:
 
   possible-typed-array-names@1.1.0: {}
 
+  postal-mime@2.7.3: {}
+
   postcss-load-config@6.0.1(jiti@2.6.1)(postcss@8.5.6)(tsx@4.21.0)(yaml@2.8.2):
     dependencies:
       lilconfig: 3.1.3
@@ -30523,14 +31674,14 @@ snapshots:
       tsx: 4.21.0
       yaml: 2.8.2
 
-  postcss-loader@8.1.1(postcss@8.5.6)(typescript@5.9.3)(webpack@5.103.0):
+  postcss-loader@8.1.1(postcss@8.5.6)(typescript@5.9.3)(webpack@5.105.1):
     dependencies:
       cosmiconfig: 9.0.0(typescript@5.9.3)
       jiti: 1.21.7
       postcss: 8.5.6
       semver: 7.7.3
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
     transitivePeerDependencies:
       - typescript
 
@@ -30586,23 +31737,23 @@ snapshots:
 
   preact@10.24.2: {}
 
-  preact@10.28.0: {}
+  preact@10.28.3: {}
 
   prelude-ls@1.2.1: {}
 
-  prettier-linter-helpers@1.0.0:
+  prettier-linter-helpers@1.0.1:
     dependencies:
       fast-diff: 1.3.0
 
-  prettier-plugin-tailwindcss@0.6.14(prettier@3.7.4):
+  prettier-plugin-tailwindcss@0.6.14(prettier@3.8.1):
     dependencies:
-      prettier: 3.7.4
+      prettier: 3.8.1
 
-  prettier@3.7.4: {}
+  prettier@3.8.1: {}
 
   pretty-error@4.0.0:
     dependencies:
-      lodash: 4.17.21
+      lodash: 4.17.23
       renderkid: 3.0.0
 
   pretty-format@27.5.1:
@@ -30686,6 +31837,10 @@ snapshots:
     dependencies:
       side-channel: 1.1.0
 
+  qs@6.14.1:
+    dependencies:
+      side-channel: 1.1.0
+
   query-string@7.1.3:
     dependencies:
       decode-uri-component: 0.2.2
@@ -30728,8 +31883,8 @@ snapshots:
   react-docgen@7.1.1:
     dependencies:
       "@babel/core": 7.28.5
-      "@babel/traverse": 7.28.5
-      "@babel/types": 7.28.5
+      "@babel/traverse": 7.29.0
+      "@babel/types": 7.29.0
       "@types/babel__core": 7.20.5
       "@types/babel__traverse": 7.28.0
       "@types/doctrine": 0.0.9
@@ -30766,7 +31921,7 @@ snapshots:
       react: 19.2.3
       scheduler: 0.27.0
 
-  react-hook-form@7.71.0(react@19.2.3):
+  react-hook-form@7.71.1(react@19.2.3):
     dependencies:
       react: 19.2.3
 
@@ -31013,7 +32168,7 @@ snapshots:
       css-select: 4.3.0
       dom-converter: 0.2.0
       htmlparser2: 6.1.0
-      lodash: 4.17.21
+      lodash: 4.17.23
       strip-ansi: 6.0.1
 
   require-directory@2.1.1: {}
@@ -31024,8 +32179,9 @@ snapshots:
 
   requires-port@1.0.0: {}
 
-  resend@6.7.0:
+  resend@6.9.2:
     dependencies:
+      postal-mime: 2.7.3
       svix: 1.84.1
 
   resolve-cwd@3.0.0:
@@ -31139,7 +32295,7 @@ snapshots:
       buffer: 6.0.3
       eventemitter3: 5.0.1
       uuid: 8.3.2
-      ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
+      ws: 8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optionalDependencies:
       bufferutil: 4.0.9
       utf-8-validate: 5.0.10
@@ -31183,11 +32339,11 @@ snapshots:
 
   safer-buffer@2.1.2: {}
 
-  sass-loader@16.0.5(webpack@5.103.0):
+  sass-loader@16.0.5(webpack@5.105.1):
     dependencies:
       neo-async: 2.6.2
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   scheduler@0.27.0: {}
 
@@ -31214,6 +32370,8 @@ snapshots:
 
   semver@7.7.3: {}
 
+  semver@7.7.4: {}
+
   sentence-case@3.0.4:
     dependencies:
       no-case: 3.0.4
@@ -31456,7 +32614,7 @@ snapshots:
       es-errors: 1.3.0
       internal-slot: 1.1.0
 
-  storybook@10.2.0(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.7.4)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10):
+  storybook@10.2.8(@testing-library/dom@10.4.0)(bufferutil@4.0.9)(prettier@3.8.1)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(utf-8-validate@5.0.10):
     dependencies:
       "@storybook/global": 5.0.0
       "@storybook/icons": 2.0.1(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
@@ -31471,7 +32629,7 @@ snapshots:
       use-sync-external-store: 1.5.0(react@19.2.3)
       ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optionalDependencies:
-      prettier: 3.7.4
+      prettier: 3.8.1
     transitivePeerDependencies:
       - "@testing-library/dom"
       - bufferutil
@@ -31623,13 +32781,13 @@ snapshots:
 
   stubborn-fs@1.2.5: {}
 
-  style-loader@3.3.4(webpack@5.103.0):
+  style-loader@3.3.4(webpack@5.105.1):
     dependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
-  style-loader@4.0.0(webpack@5.103.0):
+  style-loader@4.0.0(webpack@5.105.1):
     dependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   styled-jsx@5.1.6(@babel/core@7.28.5)(react@19.2.3):
     dependencies:
@@ -31682,27 +32840,33 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  swr@2.3.7(react@19.2.3):
+  swr@2.4.0(react@19.2.3):
     dependencies:
       dequal: 2.0.3
       react: 19.2.3
-      use-sync-external-store: 1.5.0(react@19.2.3)
+      use-sync-external-store: 1.6.0(react@19.2.3)
 
   symbol-observable@4.0.0: {}
 
+  sync-fetch@0.6.0:
+    dependencies:
+      node-fetch: 3.3.2
+      timeout-signal: 2.0.0
+      whatwg-mimetype: 4.0.0
+
   sync-fetch@0.6.0-2:
     dependencies:
       node-fetch: 3.3.2
       timeout-signal: 2.0.0
       whatwg-mimetype: 4.0.0
 
-  synckit@0.11.11:
+  synckit@0.11.12:
     dependencies:
       "@pkgr/core": 0.2.9
 
-  tailwind-merge@2.6.0: {}
+  tailwind-merge@2.6.1: {}
 
-  tailwindcss@4.1.17: {}
+  tailwindcss@4.1.18: {}
 
   tapable@2.3.0: {}
 
@@ -31712,16 +32876,16 @@ snapshots:
 
   terminal-size@4.0.0: {}
 
-  terser-webpack-plugin@5.3.14(webpack@5.103.0):
+  terser-webpack-plugin@5.3.16(webpack@5.105.1):
     dependencies:
       "@jridgewell/trace-mapping": 0.3.31
       jest-worker: 27.5.1
       schema-utils: 4.3.3
       serialize-javascript: 6.0.2
-      terser: 5.44.1
-      webpack: 5.103.0
+      terser: 5.46.0
+      webpack: 5.105.1
 
-  terser@5.44.1:
+  terser@5.46.0:
     dependencies:
       "@jridgewell/source-map": 0.3.11
       acorn: 8.15.0
@@ -31734,6 +32898,12 @@ snapshots:
       glob: 7.2.3
       minimatch: 3.1.2
 
+  test-exclude@7.0.1:
+    dependencies:
+      "@istanbuljs/schema": 0.1.3
+      glob: 10.5.0
+      minimatch: 9.0.5
+
   text-encoding-utf-8@1.0.2: {}
 
   text-extensions@2.4.0: {}
@@ -31766,7 +32936,7 @@ snapshots:
 
   tiny-invariant@1.3.3: {}
 
-  tiny-lru@11.4.5: {}
+  tiny-lru@11.4.7: {}
 
   tinybench@2.9.0: {}
 
@@ -31842,33 +33012,12 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  ts-jest@29.4.6(@babel/core@7.28.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.0))(esbuild@0.25.8)(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)))(typescript@5.9.3):
-    dependencies:
-      bs-logger: 0.2.6
-      fast-json-stable-stringify: 2.1.0
-      handlebars: 4.7.8
-      jest: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
-      json5: 2.2.3
-      lodash.memoize: 4.1.2
-      make-error: 1.3.6
-      semver: 7.7.3
-      type-fest: 4.41.0
-      typescript: 5.9.3
-      yargs-parser: 21.1.1
-    optionalDependencies:
-      "@babel/core": 7.28.0
-      "@jest/transform": 29.7.0
-      "@jest/types": 29.6.3
-      babel-jest: 29.7.0(@babel/core@7.28.0)
-      esbuild: 0.25.8
-      jest-util: 29.7.0
-
-  ts-jest@29.4.6(@babel/core@7.28.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.0))(jest-util@29.7.0)(jest@29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3)))(typescript@5.9.3):
+  ts-jest@29.4.6(@babel/core@7.28.5)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.5))(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3)))(typescript@5.9.3):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
       handlebars: 4.7.8
-      jest: 29.7.0(@types/node@22.7.5)(ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3))
+      jest: 29.7.0(@types/node@20.19.33)(ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3))
       json5: 2.2.3
       lodash.memoize: 4.1.2
       make-error: 1.3.6
@@ -31877,18 +33026,18 @@ snapshots:
       typescript: 5.9.3
       yargs-parser: 21.1.1
     optionalDependencies:
-      "@babel/core": 7.28.0
+      "@babel/core": 7.28.5
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      babel-jest: 29.7.0(@babel/core@7.28.0)
+      babel-jest: 29.7.0(@babel/core@7.28.5)
       jest-util: 29.7.0
 
-  ts-jest@29.4.6(@babel/core@7.28.5)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.28.5))(jest-util@29.7.0)(jest@29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3)))(typescript@5.9.3):
+  ts-jest@29.4.6(@babel/core@7.29.0)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.29.0))(jest-util@29.7.0)(jest@29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3)))(typescript@5.9.3):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
       handlebars: 4.7.8
-      jest: 29.7.0(@types/node@20.19.25)(ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3))
+      jest: 29.7.0(@types/node@25.2.3)(ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3))
       json5: 2.2.3
       lodash.memoize: 4.1.2
       make-error: 1.3.6
@@ -31897,24 +33046,24 @@ snapshots:
       typescript: 5.9.3
       yargs-parser: 21.1.1
     optionalDependencies:
-      "@babel/core": 7.28.5
+      "@babel/core": 7.29.0
       "@jest/transform": 29.7.0
       "@jest/types": 29.6.3
-      babel-jest: 29.7.0(@babel/core@7.28.5)
+      babel-jest: 29.7.0(@babel/core@7.29.0)
       jest-util: 29.7.0
 
   ts-log@2.2.7: {}
 
   ts-mixer@6.0.4: {}
 
-  ts-node@10.9.2(@types/node@20.19.25)(typescript@5.9.3):
+  ts-node@10.9.2(@types/node@20.19.33)(typescript@5.9.3):
     dependencies:
       "@cspotcode/source-map-support": 0.8.1
       "@tsconfig/node10": 1.0.11
       "@tsconfig/node12": 1.0.11
       "@tsconfig/node14": 1.0.3
       "@tsconfig/node16": 1.0.4
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       acorn: 8.15.0
       acorn-walk: 8.3.4
       arg: 4.1.3
@@ -31925,14 +33074,14 @@ snapshots:
       v8-compile-cache-lib: 3.0.1
       yn: 3.1.1
 
-  ts-node@10.9.2(@types/node@22.7.5)(typescript@5.9.3):
+  ts-node@10.9.2(@types/node@25.2.3)(typescript@5.9.3):
     dependencies:
       "@cspotcode/source-map-support": 0.8.1
       "@tsconfig/node10": 1.0.11
       "@tsconfig/node12": 1.0.11
       "@tsconfig/node14": 1.0.3
       "@tsconfig/node16": 1.0.4
-      "@types/node": 22.7.5
+      "@types/node": 25.2.3
       acorn: 8.15.0
       acorn-walk: 8.3.4
       arg: 4.1.3
@@ -32017,32 +33166,32 @@ snapshots:
 
   tty-browserify@0.0.1: {}
 
-  turbo-darwin-64@2.6.2:
+  turbo-darwin-64@2.8.6:
     optional: true
 
-  turbo-darwin-arm64@2.6.2:
+  turbo-darwin-arm64@2.8.6:
     optional: true
 
-  turbo-linux-64@2.6.2:
+  turbo-linux-64@2.8.6:
     optional: true
 
-  turbo-linux-arm64@2.6.2:
+  turbo-linux-arm64@2.8.6:
     optional: true
 
-  turbo-windows-64@2.6.2:
+  turbo-windows-64@2.8.6:
     optional: true
 
-  turbo-windows-arm64@2.6.2:
+  turbo-windows-arm64@2.8.6:
     optional: true
 
-  turbo@2.6.2:
+  turbo@2.8.6:
     optionalDependencies:
-      turbo-darwin-64: 2.6.2
-      turbo-darwin-arm64: 2.6.2
-      turbo-linux-64: 2.6.2
-      turbo-linux-arm64: 2.6.2
-      turbo-windows-64: 2.6.2
-      turbo-windows-arm64: 2.6.2
+      turbo-darwin-64: 2.8.6
+      turbo-darwin-arm64: 2.8.6
+      turbo-linux-64: 2.8.6
+      turbo-linux-arm64: 2.8.6
+      turbo-windows-64: 2.8.6
+      turbo-windows-arm64: 2.8.6
 
   tw-animate-css@1.4.0: {}
 
@@ -32140,6 +33289,8 @@ snapshots:
 
   undici-types@7.16.0: {}
 
+  undici-types@7.21.0: {}
+
   unicode-canonical-property-names-ecmascript@2.0.1: {}
 
   unicode-match-property-ecmascript@2.0.0:
@@ -32265,6 +33416,10 @@ snapshots:
     dependencies:
       react: 19.2.3
 
+  use-sync-external-store@1.6.0(react@19.2.3):
+    dependencies:
+      react: 19.2.3
+
   utf-8-validate@5.0.10:
     dependencies:
       node-gyp-build: 4.8.4
@@ -32291,7 +33446,7 @@ snapshots:
 
   v8-to-istanbul@9.3.0:
     dependencies:
-      "@jridgewell/trace-mapping": 0.3.29
+      "@jridgewell/trace-mapping": 0.3.31
       "@types/istanbul-lib-coverage": 2.0.6
       convert-source-map: 2.0.0
 
@@ -32347,15 +33502,15 @@ snapshots:
       - utf-8-validate
       - zod
 
-  viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.22.4):
+  viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.22.4):
     dependencies:
       "@noble/curves": 1.9.1
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.1.0(typescript@5.9.3)(zod@3.22.4)
+      abitype: 1.2.3(typescript@5.9.3)(zod@3.22.4)
       isows: 1.0.7(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
-      ox: 0.9.6(typescript@5.9.3)(zod@3.22.4)
+      ox: 0.12.1(typescript@5.9.3)(zod@3.22.4)
       ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optionalDependencies:
       typescript: 5.9.3
@@ -32364,15 +33519,15 @@ snapshots:
       - utf-8-validate
       - zod
 
-  viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76):
+  viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76):
     dependencies:
       "@noble/curves": 1.9.1
       "@noble/hashes": 1.8.0
       "@scure/bip32": 1.7.0
       "@scure/bip39": 1.6.0
-      abitype: 1.1.0(typescript@5.9.3)(zod@3.25.76)
+      abitype: 1.2.3(typescript@5.9.3)(zod@3.25.76)
       isows: 1.0.7(ws@8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10))
-      ox: 0.9.6(typescript@5.9.3)(zod@3.25.76)
+      ox: 0.12.1(typescript@5.9.3)(zod@3.25.76)
       ws: 8.18.3(bufferutil@4.0.9)(utf-8-validate@5.0.10)
     optionalDependencies:
       typescript: 5.9.3
@@ -32381,13 +33536,13 @@ snapshots:
       - utf-8-validate
       - zod
 
-  vite-node@1.0.2(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1):
+  vite-node@1.0.2(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0):
     dependencies:
       cac: 6.7.14
       debug: 4.4.3
       pathe: 1.1.2
       picocolors: 1.1.1
-      vite: 5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1)
+      vite: 5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0)
     transitivePeerDependencies:
       - "@types/node"
       - less
@@ -32399,13 +33554,13 @@ snapshots:
       - supports-color
       - terser
 
-  vite-node@3.2.4(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2):
+  vite-node@3.2.4(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2):
     dependencies:
       cac: 6.7.14
       debug: 4.4.3
       es-module-lexer: 1.7.0
       pathe: 2.0.3
-      vite: 7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
+      vite: 7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
     transitivePeerDependencies:
       - "@types/node"
       - jiti
@@ -32420,29 +33575,29 @@ snapshots:
       - tsx
       - yaml
 
-  vite-tsconfig-paths@4.3.1(typescript@5.9.3)(vite@5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1)):
+  vite-tsconfig-paths@4.3.1(typescript@5.9.3)(vite@5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0)):
     dependencies:
       debug: 4.4.3
       globrex: 0.1.2
       tsconfck: 3.1.6(typescript@5.9.3)
     optionalDependencies:
-      vite: 5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1)
+      vite: 5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0)
     transitivePeerDependencies:
       - supports-color
       - typescript
 
-  vite@5.4.21(@types/node@20.19.25)(lightningcss@1.30.2)(terser@5.44.1):
+  vite@5.4.21(@types/node@20.19.33)(lightningcss@1.30.2)(terser@5.46.0):
     dependencies:
       esbuild: 0.21.5
       postcss: 8.5.6
       rollup: 4.45.1
     optionalDependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       fsevents: 2.3.3
       lightningcss: 1.30.2
-      terser: 5.44.1
+      terser: 5.46.0
 
-  vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2):
+  vite@7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2):
     dependencies:
       esbuild: 0.25.8
       fdir: 6.4.6(picomatch@4.0.3)
@@ -32451,19 +33606,19 @@ snapshots:
       rollup: 4.45.1
       tinyglobby: 0.2.15
     optionalDependencies:
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
       fsevents: 2.3.3
       jiti: 2.6.1
       lightningcss: 1.30.2
-      terser: 5.44.1
+      terser: 5.46.0
       tsx: 4.21.0
       yaml: 2.8.2
 
-  vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2):
+  vitest@3.2.4(@types/debug@4.1.12)(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2):
     dependencies:
       "@types/chai": 5.2.2
       "@vitest/expect": 3.2.4
-      "@vitest/mocker": 3.2.4(vite@7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2))
+      "@vitest/mocker": 3.2.4(vite@7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
       "@vitest/pretty-format": 3.2.4
       "@vitest/runner": 3.2.4
       "@vitest/snapshot": 3.2.4
@@ -32481,12 +33636,12 @@ snapshots:
       tinyglobby: 0.2.14
       tinypool: 1.1.1
       tinyrainbow: 2.0.0
-      vite: 7.0.5(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
-      vite-node: 3.2.4(@types/node@20.19.25)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.1)(tsx@4.21.0)(yaml@2.8.2)
+      vite: 7.0.5(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
+      vite-node: 3.2.4(@types/node@20.19.33)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
       why-is-node-running: 2.3.0
     optionalDependencies:
       "@types/debug": 4.1.12
-      "@types/node": 20.19.25
+      "@types/node": 20.19.33
     transitivePeerDependencies:
       - jiti
       - less
@@ -32503,14 +33658,14 @@ snapshots:
 
   vm-browserify@1.1.2: {}
 
-  wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76):
+  wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76):
     dependencies:
-      "@tanstack/react-query": 5.90.11(react@19.2.3)
-      "@wagmi/connectors": 6.2.0(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.11)(@tanstack/react-query@5.90.11(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
-      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.11)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
+      "@tanstack/react-query": 5.90.21(react@19.2.3)
+      "@wagmi/connectors": 6.2.0(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(@wagmi/core@2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)))(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(wagmi@2.19.5(@tanstack/query-core@5.90.20)(@tanstack/react-query@5.90.21(react@19.2.3))(@types/react@19.2.8)(bufferutil@4.0.9)(fastestsmallesttextencoderdecoder@1.0.22)(react@19.2.3)(typescript@5.9.3)(utf-8-validate@5.0.10)(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76))(ws@8.18.0(bufferutil@4.0.9)(utf-8-validate@5.0.10))(zod@3.25.76)
+      "@wagmi/core": 2.22.1(@tanstack/query-core@5.90.20)(@types/react@19.2.8)(react@19.2.3)(typescript@5.9.3)(use-sync-external-store@1.4.0(react@19.2.3))(viem@2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76))
       react: 19.2.3
       use-sync-external-store: 1.4.0(react@19.2.3)
-      viem: 2.41.2(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
+      viem: 2.45.3(bufferutil@4.0.9)(typescript@5.9.3)(utf-8-validate@5.0.10)(zod@3.25.76)
     optionalDependencies:
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -32553,7 +33708,7 @@ snapshots:
     dependencies:
       makeerror: 1.0.12
 
-  watchpack@2.4.4:
+  watchpack@2.5.1:
     dependencies:
       glob-to-regexp: 0.4.1
       graceful-fs: 4.2.11
@@ -32568,7 +33723,7 @@ snapshots:
 
   webidl-conversions@3.0.1: {}
 
-  webpack-dev-middleware@6.1.3(webpack@5.103.0):
+  webpack-dev-middleware@6.1.3(webpack@5.105.1):
     dependencies:
       colorette: 2.0.20
       memfs: 3.5.3
@@ -32576,7 +33731,7 @@ snapshots:
       range-parser: 1.2.1
       schema-utils: 4.3.3
     optionalDependencies:
-      webpack: 5.103.0
+      webpack: 5.105.1
 
   webpack-hot-middleware@2.26.1:
     dependencies:
@@ -32588,7 +33743,7 @@ snapshots:
 
   webpack-virtual-modules@0.6.2: {}
 
-  webpack@5.103.0:
+  webpack@5.105.1:
     dependencies:
       "@types/eslint-scope": 3.7.7
       "@types/estree": 1.0.8
@@ -32600,8 +33755,8 @@ snapshots:
       acorn-import-phases: 1.0.4(acorn@8.15.0)
       browserslist: 4.28.1
       chrome-trace-event: 1.0.4
-      enhanced-resolve: 5.18.3
-      es-module-lexer: 1.7.0
+      enhanced-resolve: 5.19.0
+      es-module-lexer: 2.0.0
       eslint-scope: 5.1.1
       events: 3.3.0
       glob-to-regexp: 0.4.1
@@ -32612,8 +33767,8 @@ snapshots:
       neo-async: 2.6.2
       schema-utils: 4.3.3
       tapable: 2.3.0
-      terser-webpack-plugin: 5.3.14(webpack@5.103.0)
-      watchpack: 2.4.4
+      terser-webpack-plugin: 5.3.16(webpack@5.105.1)
+      watchpack: 2.5.1
       webpack-sources: 3.3.3
     transitivePeerDependencies:
       - "@swc/core"
@@ -32738,6 +33893,11 @@ snapshots:
       bufferutil: 4.0.9
       utf-8-validate: 5.0.10
 
+  ws@8.19.0(bufferutil@4.0.9)(utf-8-validate@5.0.10):
+    optionalDependencies:
+      bufferutil: 4.0.9
+      utf-8-validate: 5.0.10
+
   wsl-utils@0.1.0:
     dependencies:
       is-wsl: 3.1.0
@@ -32817,13 +33977,13 @@ snapshots:
       react: 19.2.3
       use-sync-external-store: 1.4.0(react@19.2.3)
 
-  zustand@5.0.3(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3)):
+  zustand@5.0.11(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3)):
     optionalDependencies:
       "@types/react": 19.2.8
       react: 19.2.3
       use-sync-external-store: 1.4.0(react@19.2.3)
 
-  zustand@5.0.9(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3)):
+  zustand@5.0.3(@types/react@19.2.8)(react@19.2.3)(use-sync-external-store@1.4.0(react@19.2.3)):
     optionalDependencies:
       "@types/react": 19.2.8
       react: 19.2.3
diff --git a/turbo.json b/turbo.json
index ec0c270d0..c2e81693b 100644
--- a/turbo.json
+++ b/turbo.json
@@ -17,6 +17,7 @@
     "clean": {},
     "lint": {},
     "lint:fix": {},
-    "typecheck": {}
+    "typecheck": {},
+    "test": {}
   }
 }