Merge pull request 'P4-1: read-only Projects + Tasks SPA pages + dev-port pins' (#1153 ) from feat/webui-p4-1 into next

fix(web): P4-1 restore graceful degradation for missions/tasks fetch on project detail
feat(web): add read-only project and task SPA pages
2026-08-11 04:00:36 +00:00 · 2026-08-10 22:43:47 -05:00 · 2026-08-10 22:23:59 -05:00 · 2026-08-10 22:57:07 +00:00 · 2026-08-10 20:54:09 +00:00 · 2026-08-10 14:44:19 -05:00
35 changed files with 2909 additions and 123 deletions
@@ -11,48 +11,87 @@

 ## Project Context

-Mosaic Stack is a self-hosted, multi-user AI agent platform. TypeScript monorepo with NestJS gateway, Next.js web dashboard, Pi SDK agent runtime, and plugin architecture for Discord/Telegram.
+Mosaic Stack is a self-hosted, multi-user AI agent platform. It is a TypeScript monorepo with a NestJS gateway, Next.js dashboard, Pi SDK agent runtime, and Discord/Telegram plugin architecture.

-## Package Map
+### Stack

-| Package            | Purpose                         | Key Dependencies                 |
-| ------------------ | ------------------------------- | -------------------------------- |
-| `apps/gateway`     | NestJS API + WebSocket hub      | Fastify, Socket.IO, Pi SDK, OTEL |
-| `apps/web`         | Next.js dashboard               | React 19, Tailwind               |
-| `packages/types`   | Shared TypeScript contracts     | class-validator                  |
-| `packages/db`      | Drizzle ORM schema + migrations | drizzle-orm, postgres            |
-| `packages/auth`    | BetterAuth configuration        | better-auth, @mosaicstack/db     |
-| `packages/brain`   | Data layer (PG-backed)          | @mosaicstack/db                  |
-| `packages/queue`   | Valkey task queue + MCP         | ioredis                          |
-| `packages/coord`   | Mission coordination            | @mosaicstack/queue               |
-| `packages/mosaic`  | Unified `mosaic` CLI + TUI      | Ink, Pi SDK, commander           |
-| `plugins/discord`  | Discord channel plugin          | discord.js                       |
-| `plugins/telegram` | Telegram channel plugin         | Telegraf                         |
+- **API:** NestJS with Fastify (`apps/gateway`)
+- **Web:** Next.js 16 with React 19 (`apps/web`)
+- **ORM and database:** Drizzle ORM, PostgreSQL 17, and pgvector (`packages/db`)
+- **Authentication:** BetterAuth (`packages/auth`)
+- **Agent runtime:** Pi SDK (`apps/gateway`, `packages/mosaic`)
+- **Queue:** Valkey 8 (`packages/queue`)
+- **Build:** pnpm workspaces and Turborepo
+- **CI:** Woodpecker CI
+- **Observability:** OpenTelemetry and Jaeger

-## Architecture Rules
+### Package Map

-1. Gateway is the single API surface — all clients connect through it
-2. Pi SDK is ESM-only — gateway and CLI must use ESM
-3. Socket.IO typed events defined in `@mosaicstack/types` enforce compile-time contracts
-4. OTEL auto-instrumentation loads before NestJS bootstrap
-5. BetterAuth manages auth tables; schema defined in `@mosaicstack/db`
-6. Docker Compose provides PG (5433), Valkey (6380), OTEL Collector (4317/4318), Jaeger (16686)
-7. Explicit `@Inject()` decorators required in NestJS (tsx/esbuild doesn't emit decorator metadata)
+| Package            | Purpose                       | Key Dependencies                 |
+| ------------------ | ----------------------------- | -------------------------------- |
+| `apps/gateway`     | NestJS API + WebSocket hub    | Fastify, Socket.IO, Pi SDK, OTEL |
+| `apps/web`         | Next.js dashboard             | React 19, Tailwind               |
+| `packages/types`   | Shared TypeScript contracts   | class-validator                  |
+| `packages/db`      | Drizzle schema and migrations | drizzle-orm, postgres            |
+| `packages/auth`    | BetterAuth configuration      | better-auth, @mosaicstack/db     |
+| `packages/brain`   | Structured data layer         | @mosaicstack/db                  |
+| `packages/queue`   | Valkey task queue and MCP     | ioredis                          |
+| `packages/coord`   | Mission coordination          | @mosaicstack/queue               |
+| `packages/mosaic`  | Unified `mosaic` CLI and TUI  | Ink, Pi SDK, commander           |
+| `plugins/discord`  | Discord channel plugin        | discord.js                       |
+| `plugins/telegram` | Telegram channel plugin       | Telegraf                         |
+
+## Architecture and Code Conventions
+
+1. Gateway is the single API surface; all clients connect through it.
+2. Pi SDK is ESM-only; gateway and CLI code must remain ESM.
+3. Use `"type": "module"`, NodeNext module resolution, and `.js` extensions in imports.
+4. Keep typed Socket.IO events in `@mosaicstack/types` to enforce client/server contracts.
+5. Import OTEL tracing before NestJS bootstrap (`import './tracing.js'`).
+6. Use explicit `@Inject()` decorators in NestJS because tsx/esbuild does not emit decorator metadata.
+7. Keep DTOs in `*.dto.ts` files at module boundaries.
+8. BetterAuth owns authentication tables; their schema is defined in `@mosaicstack/db`.
+9. Create a task-specific scratchpad for non-trivial work.

 ## Development Workflow

+Requirements: Node.js 20+, pnpm 10.6.2, and Docker Compose when optional local services are needed.
+
 ```bash
-docker compose up -d          # Infrastructure
-pnpm install                  # Dependencies
-pnpm typecheck && pnpm lint && pnpm format:check  # Quality gates
+pnpm install --frozen-lockfile
+pnpm preflight
+
+# Optional local queue service only; do not start the full Compose stack.
+docker compose up -d valkey
 ```

-## Repo-Specific Notes
+The pre-push hook requires:

- DTOs in `*.dto.ts` files at module boundaries
- ESM everywhere (`"type": "module"`, `.js` extensions in imports)
- NodeNext module resolution in all tsconfigs
- Scratchpads are mandatory for non-trivial tasks
+```bash
+pnpm preflight && pnpm typecheck && pnpm lint && pnpm format:check
+```
+
+Software delivery also requires the applicable tests. Common repository commands are:
+
+```bash
+pnpm typecheck     # TypeScript checks across the workspace
+pnpm lint          # ESLint across the workspace
+pnpm test          # Checkout tests and package Vitest suites
+pnpm format:check  # Prettier check
+pnpm build         # Build all packages and applications
+```
+
+## Database and Local Runtime Safety
+
+- Current local data-layer work uses in-process PGlite; leave `DATABASE_URL` unset.
+- PostgreSQL execution is held until KBN-101-00, KBN-101-03, and KBN-101-05 land.
+- Do not invoke a migration runner, initialization SQL, or the Compose PostgreSQL service from this checkout.
+- Do not start Gateway/Web or run root `pnpm dev` as a local PGlite route. The current dotenv loader can inherit a daemon PostgreSQL DSN; KBN-101-02 must make that path fail closed first.
+- Migration artifact generation is offline and does not authorize PostgreSQL access:
+
+```bash
+pnpm --filter @mosaicstack/db db:generate
+```

 ## docs/TASKS.md — Schema (CANONICAL)

@@ -1,46 +1,5 @@
-# CLAUDE.md — Mosaic Stack
+# Claude Compatibility Pointer

-## Project
+@AGENTS.md

-Self-hosted, multi-user AI agent platform. TypeScript monorepo.
-
-## Stack
-
- **API**: NestJS + Fastify adapter (`apps/gateway`)
- **Web**: Next.js 16 + React 19 (`apps/web`)
- **ORM**: Drizzle ORM + PostgreSQL 17 + pgvector (`packages/db`)
- **Auth**: BetterAuth (`packages/auth`)
- **Agent**: Pi SDK (`packages/agent`, `packages/mosaic`)
- **Queue**: Valkey 8 (`packages/queue`)
- **Build**: pnpm workspaces + Turborepo
- **CI**: Woodpecker CI
- **Observability**: OpenTelemetry → Jaeger
-
-## Commands
-
-```bash
-pnpm typecheck        # TypeScript check (all packages)
-pnpm lint             # ESLint (all packages)
-pnpm format:check     # Prettier check
-pnpm test             # Vitest (all packages)
-pnpm build            # Build all packages
-
-# Database
-pnpm --filter @mosaicstack/db db:generate  # Offline migration artifact generation only
-# PostgreSQL execution is held until KBN-101-00/-03/-05 land. Do not invoke a runner,
-# init SQL, or Compose PostgreSQL service from this checkout.
-
-# Dev: local PGlite data-layer work needs no PostgreSQL. Optional local queue service only:
-docker compose up -d valkey
-# Do not start Gateway/Web or root pnpm dev as a local PGlite route: the current unguarded dotenv
-# loader can inherit a daemon PostgreSQL DSN. KBN-101-02 must make that state fail closed first.
-```
-
-## Conventions
-
- ESM everywhere (`"type": "module"`, `.js` extensions in imports)
- NodeNext module resolution
- Explicit `@Inject()` decorators in NestJS (tsx/esbuild doesn't support emitDecoratorMetadata)
- DTOs in `*.dto.ts` files at module boundaries
- OTEL tracing imported before NestJS bootstrap (`import './tracing.js'`)
- All three gates must pass before push: typecheck, lint, format:check
+Do not add project guidance here. Keep `AGENTS.md` authoritative so every agent runtime receives the same instructions.
@@ -50,7 +50,11 @@ mosaic wizard        # Full guided setup (gateway install → verify)

 - Node.js ≥ 20
 - npm (for global @mosaicstack/mosaic install)
- One or more runtimes: [Claude Code](https://docs.anthropic.com/en/docs/claude-code), [Codex](https://github.com/openai/codex), [OpenCode](https://opencode.ai), or [Pi](https://github.com/mariozechner/pi-coding-agent)
+- One or more runtimes:
+  - [Claude Code](https://docs.anthropic.com/en/docs/claude-code)
+  - [Codex](https://github.com/openai/codex)
+  - [OpenCode](https://opencode.ai)
+  - [Pi](https://pi.dev)

 ## Usage

@@ -0,0 +1,624 @@
+import 'reflect-metadata';
+import { mkdtemp, mkdir, readFile, rm, writeFile } from 'node:fs/promises';
+import * as nodeOs from 'node:os';
+import { dirname, isAbsolute, join, relative, resolve } from 'node:path';
+import * as nodeUrl from 'node:url';
+import { MODULE_METADATA } from '@nestjs/common/constants.js';
+import { describe, expect, it, vi } from 'vitest';
+import type { MosaicConfig } from '@mosaicstack/config';
+
+interface ComposedModuleGraph {
+  imports: readonly unknown[];
+  federationModule: unknown;
+  bootLogLines: readonly string[];
+  mosaicConfig: MosaicConfig;
+  resolvedConfigPath: string;
+}
+
+type StorageTier = 'local' | 'standalone' | 'federated';
+
+interface ModuleGraphFixture {
+  tempRoot: string;
+  anchor: string;
+  homePath: string;
+  cwdPath: string;
+  monorepoRootEnvPath: string;
+  gatewayLocalEnvPath: string;
+  daemonEnvPath: string;
+  monorepoRootConfigPath: string;
+  gatewayLocalConfigPath: string;
+}
+
+interface ModuleGraphFixtureOptions {
+  rootEnvMode?: 'present' | 'absent';
+  rootTier?: StorageTier;
+  rootEnvContents?: string;
+  redactionMarker?: string;
+  gatewayLocalTier?: StorageTier;
+  gatewayLocalEnvContents?: string;
+  daemonEnvContents?: string;
+  inheritedTier?: StorageTier;
+  expectedProcessTier?: string;
+  setup?: (fixture: ModuleGraphFixture) => Promise<void>;
+}
+
+// Each case uses vi.resetModules() and re-imports the full gateway graph for distinct ambient FS/env; CI needs headroom, while this still guards genuine hangs.
+const MODULE_IMPORT_TIMEOUT_MS = 120_000;
+const MONOREPO_ROOT_DOTENV_LABEL = 'monorepo-root .env';
+const DAEMON_DOTENV_LABEL = 'daemon .env';
+
+function configJson(tier: StorageTier): string {
+  if (tier === 'local') {
+    return JSON.stringify({
+      tier,
+      storage: { type: 'pglite', dataDir: '.mosaic/storage-pglite' },
+      queue: { type: 'local', dataDir: '.mosaic/queue' },
+      memory: { type: 'keyword' },
+    });
+  }
+
+  return JSON.stringify({
+    tier,
+    storage: { type: 'postgres', url: 'postgresql://fixture.invalid/mosaic' },
+    queue: { type: 'bullmq' },
+    memory: { type: tier === 'federated' ? 'pgvector' : 'keyword' },
+  });
+}
+
+function snapshotProcessEnv(): Record<string, string | undefined> {
+  return { ...process.env };
+}
+
+function restoreProcessEnv(snapshot: Record<string, string | undefined>): void {
+  for (const key of Object.keys(process.env)) {
+    if (!(key in snapshot)) {
+      delete process.env[key];
+    }
+  }
+
+  for (const [key, value] of Object.entries(snapshot)) {
+    if (value === undefined) {
+      delete process.env[key];
+      continue;
+    }
+
+    process.env[key] = value;
+  }
+}
+
+function expectPathUnderTempRoot(path: string, tempRoot: string): void {
+  const relativePath = relative(tempRoot, path);
+  expect(relativePath === '' || (!relativePath.startsWith('..') && !isAbsolute(relativePath))).toBe(
+    true,
+  );
+}
+
+async function writeFixture(path: string, contents: string, tempRoot: string): Promise<void> {
+  expectPathUnderTempRoot(path, tempRoot);
+  await mkdir(dirname(path), { recursive: true });
+  await writeFile(path, contents, 'utf8');
+}
+
+interface ConfigModuleProvider {
+  provide: string;
+  useFactory: () => MosaicConfig;
+}
+
+function isConfigModuleProvider(value: unknown): value is ConfigModuleProvider {
+  if (typeof value !== 'object' || value === null) {
+    return false;
+  }
+
+  if (!('provide' in value) || typeof value.provide !== 'string') {
+    return false;
+  }
+
+  return 'useFactory' in value && typeof value.useFactory === 'function';
+}
+
+function singleBootLogLine(bootLogLines: readonly string[]): string {
+  expect(bootLogLines).toHaveLength(1);
+  const [bootLogLine] = bootLogLines;
+  if (bootLogLine === undefined) {
+    throw new Error('Expected a single boot log line');
+  }
+
+  return bootLogLine;
+}
+
+function expectBootLogLine(
+  bootLogLines: readonly string[],
+  tier: StorageTier,
+  source: string,
+): void {
+  const bootLogLine = singleBootLogLine(bootLogLines);
+
+  expect(bootLogLine).toContain(`storage tier=${tier}`);
+  expect(bootLogLine).toContain(`source=${source}`);
+}
+
+async function loadModuleGraphFromDotenv(
+  options: ModuleGraphFixtureOptions,
+): Promise<ComposedModuleGraph> {
+  const originalEnv = snapshotProcessEnv();
+  const tempRoot = await mkdtemp(join(nodeOs.tmpdir(), 'mosaic-gateway-module-'));
+  let consoleInfoSpy: ReturnType<typeof vi.spyOn> | undefined;
+  let cwdSpy: ReturnType<typeof vi.spyOn> | undefined;
+
+  try {
+    const anchor = join(tempRoot, 'anchored', 'apps', 'gateway', 'src');
+    const homePath = join(tempRoot, 'home');
+    const cwdPath = join(tempRoot, 'ambient', 'parent', 'cwd');
+    const fixture: ModuleGraphFixture = {
+      tempRoot,
+      anchor,
+      homePath,
+      cwdPath,
+      monorepoRootEnvPath: resolve(anchor, '../../..', '.env'),
+      gatewayLocalEnvPath: resolve(anchor, '..', '.env'),
+      daemonEnvPath: join(homePath, '.config', 'mosaic', 'gateway', '.env'),
+      monorepoRootConfigPath: resolve(anchor, '../../..', 'mosaic.config.json'),
+      gatewayLocalConfigPath: resolve(anchor, '..', 'mosaic.config.json'),
+    };
+    consoleInfoSpy = vi.spyOn(console, 'info').mockImplementation((): void => undefined);
+
+    for (const path of Object.values(fixture)) {
+      expectPathUnderTempRoot(path, tempRoot);
+    }
+
+    await mkdir(anchor, { recursive: true });
+    await mkdir(cwdPath, { recursive: true });
+
+    if ((options.rootEnvMode ?? 'present') === 'absent') {
+      if (
+        options.rootEnvContents !== undefined ||
+        options.rootTier !== undefined ||
+        options.redactionMarker !== undefined
+      ) {
+        throw new Error('Expected no root env fixture values when rootEnvMode is absent');
+      }
+    } else {
+      if (options.rootEnvContents === undefined && options.rootTier === undefined) {
+        throw new Error('Expected rootTier or rootEnvContents');
+      }
+
+      const rootFixture = options.rootEnvContents ?? `MOSAIC_STORAGE_TIER=${options.rootTier}\n`;
+      const rootFixtureWithMarker = options.redactionMarker
+        ? `${rootFixture}BETTER_AUTH_SECRET=${options.redactionMarker}\n`
+        : rootFixture;
+      await writeFixture(fixture.monorepoRootEnvPath, rootFixtureWithMarker, tempRoot);
+    }
+
+    if (options.daemonEnvContents !== undefined) {
+      await writeFixture(fixture.daemonEnvPath, options.daemonEnvContents, tempRoot);
+    }
+
+    if (options.gatewayLocalEnvContents !== undefined) {
+      await writeFixture(fixture.gatewayLocalEnvPath, options.gatewayLocalEnvContents, tempRoot);
+    } else if (options.gatewayLocalTier !== undefined) {
+      await writeFixture(
+        fixture.gatewayLocalEnvPath,
+        `MOSAIC_STORAGE_TIER=${options.gatewayLocalTier}\n`,
+        tempRoot,
+      );
+    }
+
+    process.env['HOME'] = homePath;
+    delete process.env['MOSAIC_STORAGE_TIER'];
+    delete process.env['DATABASE_URL'];
+    delete process.env['VALKEY_URL'];
+    delete process.env['MOSAIC_GATEWAY_HOME'];
+
+    await options.setup?.(fixture);
+
+    if (options.inheritedTier !== undefined) {
+      process.env['MOSAIC_STORAGE_TIER'] = options.inheritedTier;
+    }
+
+    vi.resetModules();
+    vi.doMock('node:os', () => ({ ...nodeOs, homedir: (): string => homePath }));
+    vi.doMock('node:url', () => ({
+      ...nodeUrl,
+      fileURLToPath: (url: string | URL): string => {
+        const actualPath = nodeUrl.fileURLToPath(url);
+        if (
+          actualPath.endsWith('/apps/gateway/src/env.ts') ||
+          actualPath.endsWith('/apps/gateway/src/env.js')
+        ) {
+          return join(anchor, 'env.ts');
+        }
+        return actualPath;
+      },
+    }));
+    cwdSpy = vi.spyOn(process, 'cwd').mockReturnValue(cwdPath);
+
+    if (options.inheritedTier === undefined) {
+      expect(process.env['MOSAIC_STORAGE_TIER']).toBeUndefined();
+    } else {
+      expect(process.env['MOSAIC_STORAGE_TIER']).toBe(options.inheritedTier);
+    }
+
+    const envModule = await import('./env.js');
+    expect(process.env['MOSAIC_STORAGE_TIER']).toBe(
+      options.expectedProcessTier ?? options.rootTier,
+    );
+
+    const { AppModule } = await import('./app.module.js');
+    const { FederationModule } = await import('./federation/federation.module.js');
+    const imports: unknown = Reflect.getMetadata(MODULE_METADATA.IMPORTS, AppModule);
+
+    if (!Array.isArray(imports)) {
+      throw new Error('AppModule imports metadata is not an array');
+    }
+
+    const { ConfigModule, MOSAIC_CONFIG } = await import('./config/config.module.js');
+    const providers: unknown = Reflect.getMetadata(MODULE_METADATA.PROVIDERS, ConfigModule);
+
+    if (!Array.isArray(providers)) {
+      throw new Error('ConfigModule providers metadata is not an array');
+    }
+
+    const configProvider = providers
+      .filter(isConfigModuleProvider)
+      .find((provider: ConfigModuleProvider): boolean => provider.provide === MOSAIC_CONFIG);
+
+    if (!configProvider) {
+      throw new Error('MOSAIC_CONFIG provider factory not found');
+    }
+
+    return {
+      imports,
+      federationModule: FederationModule,
+      bootLogLines: consoleInfoSpy.mock.calls.map((args: readonly unknown[]): string =>
+        args.map((value: unknown): string => String(value)).join(' '),
+      ),
+      mosaicConfig: configProvider.useFactory(),
+      resolvedConfigPath: envModule.resolveGatewayConfigPath(),
+    };
+  } finally {
+    cwdSpy?.mockRestore();
+    vi.doUnmock('node:url');
+    vi.doUnmock('node:os');
+    vi.resetModules();
+    consoleInfoSpy?.mockRestore();
+    restoreProcessEnv(originalEnv);
+    await rm(tempRoot, { recursive: true, force: true });
+  }
+}
+
+describe('AppModule federation gating', (): void => {
+  it('loads dotenv before tracing and AppModule evaluation', async (): Promise<void> => {
+    const mainSource = await readFile(new URL('./main.ts', import.meta.url), 'utf8');
+    const envImportIndex = mainSource.indexOf("import './env.js';");
+    const tracingImportIndex = mainSource.indexOf("import './tracing.js';");
+    const appModuleImportIndex = mainSource.indexOf("import { AppModule } from './app.module.js';");
+
+    expect(envImportIndex).toBeGreaterThan(-1);
+    expect(envImportIndex).toBeLessThan(tracingImportIndex);
+    expect(envImportIndex).toBeLessThan(appModuleImportIndex);
+  });
+
+  it(
+    'ignores ambient cwd/.env and cwd/../.env files',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            join(fixture.cwdPath, '.env'),
+            'MOSAIC_STORAGE_TIER=federated\n',
+            fixture.tempRoot,
+          );
+          await writeFixture(
+            resolve(fixture.cwdPath, '..', '.env'),
+            'MOSAIC_STORAGE_TIER=federated\n',
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'local', MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'ignores an ambient cwd/mosaic.config.json federated config',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            join(fixture.cwdPath, 'mosaic.config.json'),
+            configJson('federated'),
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'local', MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'ignores an ambient cwd/../../mosaic.config.json federated config',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            resolve(fixture.cwdPath, '../..', 'mosaic.config.json'),
+            configJson('federated'),
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'local', MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'anchored gateway-local config wins monorepo-root config and registers FederationModule',
+    async (): Promise<void> => {
+      let gatewayLocalConfigPath = '';
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          gatewayLocalConfigPath = fixture.gatewayLocalConfigPath;
+          await writeFixture(
+            fixture.gatewayLocalConfigPath,
+            configJson('federated'),
+            fixture.tempRoot,
+          );
+          await writeFixture(fixture.monorepoRootConfigPath, configJson('local'), fixture.tempRoot);
+        },
+      });
+
+      expect(graph.resolvedConfigPath).toBe(gatewayLocalConfigPath);
+      expect(graph.mosaicConfig.tier).toBe('federated');
+      expect(graph.imports).toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'federated', 'mosaic.config.json');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'resolves the daemon-installed GATEWAY_HOME/mosaic.config.json ahead of gateway-local and monorepo-root configs',
+    async (): Promise<void> => {
+      let daemonConfigPath = '';
+      const graph = await loadModuleGraphFromDotenv({
+        rootEnvMode: 'absent',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          const externalGatewayHome = join(fixture.tempRoot, 'external-gateway-home');
+          daemonConfigPath = join(externalGatewayHome, 'mosaic.config.json');
+          await writeFixture(daemonConfigPath, configJson('federated'), fixture.tempRoot);
+          await writeFixture(
+            fixture.gatewayLocalConfigPath,
+            configJson('standalone'),
+            fixture.tempRoot,
+          );
+          await writeFixture(fixture.monorepoRootConfigPath, configJson('local'), fixture.tempRoot);
+          process.env['MOSAIC_GATEWAY_HOME'] = externalGatewayHome;
+          process.env['DATABASE_URL'] = 'postgresql://fixture.invalid/mosaic';
+        },
+      });
+
+      expect(graph.resolvedConfigPath).toBe(daemonConfigPath);
+      expect(graph.mosaicConfig.tier).toBe('federated');
+      expect(graph.imports).toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'federated', 'mosaic.config.json');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'logs mosaic.config.json when anchored config and env tiers are both federated',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'federated',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            fixture.monorepoRootConfigPath,
+            configJson('federated'),
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.imports).toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'federated', 'mosaic.config.json');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'logs standalone from a monorepo-root .env DATABASE_URL fallback',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootEnvContents: 'DATABASE_URL=fixture-database-url\n',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'standalone', MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'attributes an invalid monorepo-root dotenv tier to the default',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootEnvContents: 'MOSAIC_STORAGE_TIER=invalid\n',
+        expectedProcessTier: 'invalid',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'local', 'default');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'attributes DATABASE_URL fallback to daemon .env ahead of inherited local tier',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootEnvMode: 'absent',
+        daemonEnvContents: 'DATABASE_URL=fixture-database-url\n',
+        inheritedTier: 'local',
+        expectedProcessTier: 'local',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'standalone', DAEMON_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'daemon .env wins over monorepo-root and gateway-local tier values',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        gatewayLocalTier: 'federated',
+        daemonEnvContents: 'MOSAIC_STORAGE_TIER=standalone\n',
+        expectedProcessTier: 'standalone',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'standalone', DAEMON_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'inherits process.env.MOSAIC_STORAGE_TIER over daemon, monorepo-root, and gateway-local dotenv values',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        gatewayLocalTier: 'federated',
+        daemonEnvContents: 'MOSAIC_STORAGE_TIER=federated\n',
+        inheritedTier: 'standalone',
+        expectedProcessTier: 'standalone',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'standalone', 'process environment');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'gateway-local .env configures the tier and source when the monorepo-root .env is absent',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootEnvMode: 'absent',
+        gatewayLocalTier: 'federated',
+        expectedProcessTier: 'federated',
+      });
+
+      expect(graph.imports).toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'federated', 'gateway-local .env');
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'monorepo-root .env wins over gateway-local tier values',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'standalone',
+        gatewayLocalTier: 'federated',
+      });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'standalone', MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it.each(['local', 'standalone'] as const)(
+    'does not register FederationModule for the %s tier',
+    async (tier): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({ rootTier: tier });
+
+      expect(graph.imports).not.toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, tier, MONOREPO_ROOT_DOTENV_LABEL);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'registers FederationModule when federated tier is supplied by the anchored monorepo root .env',
+    async (): Promise<void> => {
+      const redactionMarker = 'redaction-fixture-marker';
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'federated',
+        redactionMarker,
+      });
+
+      expect(graph.imports).toContain(graph.federationModule);
+      expectBootLogLine(graph.bootLogLines, 'federated', MONOREPO_ROOT_DOTENV_LABEL);
+      expect(singleBootLogLine(graph.bootLogLines)).not.toContain(redactionMarker);
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'MOSAIC_CONFIG provider ignores an ambient cwd/mosaic.config.json config',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            join(fixture.cwdPath, 'mosaic.config.json'),
+            JSON.stringify({
+              tier: 'federated',
+              storage: {
+                type: 'postgres',
+                url: 'postgresql://ambient-attacker.invalid/mosaic',
+                enableVector: true,
+              },
+              queue: { type: 'bullmq' },
+              memory: { type: 'pgvector' },
+            }),
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.mosaicConfig.tier).toBe('local');
+      expect(graph.mosaicConfig.storage).not.toEqual(
+        expect.objectContaining({ url: 'postgresql://ambient-attacker.invalid/mosaic' }),
+      );
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+
+  it(
+    'MOSAIC_CONFIG provider resolves from the anchored monorepo-root mosaic.config.json',
+    async (): Promise<void> => {
+      const graph = await loadModuleGraphFromDotenv({
+        rootTier: 'local',
+        setup: async (fixture: ModuleGraphFixture): Promise<void> => {
+          await writeFixture(
+            fixture.monorepoRootConfigPath,
+            configJson('federated'),
+            fixture.tempRoot,
+          );
+        },
+      });
+
+      expect(graph.mosaicConfig.tier).toBe('federated');
+      expect(graph.mosaicConfig.storage).toEqual(
+        expect.objectContaining({ url: 'postgresql://fixture.invalid/mosaic' }),
+      );
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+});
@@ -26,6 +26,16 @@ import { WorkspaceModule } from './workspace/workspace.module.js';
 import { QueueModule } from './queue/queue.module.js';
 import { FederationModule } from './federation/federation.module.js';
 import { ThrottlerGuard, ThrottlerModule } from '@nestjs/throttler';
+import { loadConfig } from '@mosaicstack/config';
+import { resolveGatewayConfigPath } from './env.js';
+
+// Federation (step-ca client, enrollment, federation verbs) is only wired for
+// tier 'federated' — CaService hard-requires STEP_CA_* at construction, which
+// must not gate standalone/local boots (docker-compose.federated.yml: the
+// federation profile "must not start in non-federated dev"). The gateway
+// entrypoint loads env.ts before evaluating this module so dotenv-backed tier
+// configuration is visible here.
+const federationEnabled = loadConfig(resolveGatewayConfigPath()).tier === 'federated';

@Module({
  imports: [
@@ -53,7 +63,7 @@ import { ThrottlerGuard, ThrottlerModule } from '@nestjs/throttler';
    QueueModule,
    ReloadModule,
    WorkspaceModule,
-    FederationModule,
+    ...(federationEnabled ? [FederationModule] : []),
  ],
  controllers: [HealthController],
  providers: [
@@ -1,5 +1,6 @@
 import { Global, Module } from '@nestjs/common';
 import { loadConfig, type MosaicConfig } from '@mosaicstack/config';
+import { resolveGatewayConfigPath } from '../env.js';

 export const MOSAIC_CONFIG = 'MOSAIC_CONFIG';

@@ -8,7 +9,7 @@ export const MOSAIC_CONFIG = 'MOSAIC_CONFIG';
  providers: [
    {
      provide: MOSAIC_CONFIG,
-      useFactory: (): MosaicConfig => loadConfig(),
+      useFactory: (): MosaicConfig => loadConfig(resolveGatewayConfigPath()),
    },
  ],
  exports: [MOSAIC_CONFIG],
@@ -0,0 +1,133 @@
+import { config } from 'dotenv';
+import { existsSync } from 'node:fs';
+import { homedir } from 'node:os';
+import { dirname, join, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { detectFromEnv, loadConfig } from '@mosaicstack/config';
+
+type TierSource =
+  | 'process environment'
+  | 'daemon .env'
+  | 'monorepo-root .env'
+  | 'gateway-local .env'
+  | 'default';
+
+type BootSource = TierSource | 'mosaic.config.json';
+
+export interface GatewayDotenvPaths {
+  daemonEnv: string;
+  monorepoRootEnv: string;
+  gatewayLocalEnv: string;
+}
+
+const here = dirname(fileURLToPath(import.meta.url));
+
+export function resolveGatewayDotenvPaths(
+  anchor: string = here,
+  homeBase: string = homedir(),
+): GatewayDotenvPaths {
+  return {
+    daemonEnv: join(homeBase, '.config', 'mosaic', 'gateway', '.env'),
+    monorepoRootEnv: resolve(anchor, '../../..', '.env'),
+    gatewayLocalEnv: resolve(anchor, '..', '.env'),
+  };
+}
+
+export function resolveGatewayConfigPath(anchor: string = here): string {
+  // GATEWAY_HOME is daemon-created 0700; its env override adds no authority because env can set MOSAIC_STORAGE_TIER.
+  const gatewayHome = resolve(
+    process.env['MOSAIC_GATEWAY_HOME'] ?? join(homedir(), '.config', 'mosaic', 'gateway'),
+  );
+  const daemonConfig = join(gatewayHome, 'mosaic.config.json');
+  const gatewayLocalConfig = resolve(anchor, '..', 'mosaic.config.json');
+  const monorepoRootConfig = resolve(anchor, '../../..', 'mosaic.config.json');
+
+  if (existsSync(daemonConfig)) {
+    return daemonConfig;
+  }
+  if (existsSync(gatewayLocalConfig)) {
+    return gatewayLocalConfig;
+  }
+  if (existsSync(monorepoRootConfig)) {
+    return monorepoRootConfig;
+  }
+
+  return monorepoRootConfig;
+}
+
+export function loadGatewayEnv(anchor: string = here, homeBase: string = homedir()): void {
+  const { daemonEnv, monorepoRootEnv, gatewayLocalEnv } = resolveGatewayDotenvPaths(
+    anchor,
+    homeBase,
+  );
+  const inheritedTier = process.env['MOSAIC_STORAGE_TIER'];
+  let tierSource: TierSource = inheritedTier === undefined ? 'default' : 'process environment';
+  const inheritedDatabaseUrl = process.env['DATABASE_URL'];
+  let databaseUrlSource: TierSource =
+    inheritedDatabaseUrl === undefined ? 'default' : 'process environment';
+
+  function loadAnchoredDotenv(
+    path: string,
+    sourceLabel: Exclude<TierSource, 'process environment' | 'default'>,
+  ): void {
+    if (!existsSync(path)) {
+      return;
+    }
+
+    const beforeTier = process.env['MOSAIC_STORAGE_TIER'];
+    const beforeDatabaseUrl = process.env['DATABASE_URL'];
+    config({ path, quiet: true });
+
+    if (
+      beforeTier === undefined &&
+      process.env['MOSAIC_STORAGE_TIER'] !== undefined &&
+      tierSource === 'default'
+    ) {
+      tierSource = sourceLabel;
+    }
+
+    if (
+      beforeDatabaseUrl === undefined &&
+      process.env['DATABASE_URL'] !== undefined &&
+      databaseUrlSource === 'default'
+    ) {
+      databaseUrlSource = sourceLabel;
+    }
+  }
+
+  // Load .env from daemon config dir (global install / daemon mode) first.
+  // It takes precedence over file-based local-dev configuration.
+  loadAnchoredDotenv(daemonEnv, 'daemon .env');
+
+  // Load .env from the anchored monorepo root, then fill any remaining values
+  // from apps/gateway/.env when present.
+  loadAnchoredDotenv(monorepoRootEnv, 'monorepo-root .env');
+  loadAnchoredDotenv(gatewayLocalEnv, 'gateway-local .env');
+
+  const envOnlyTier = detectFromEnv().tier;
+  const configPath = resolveGatewayConfigPath(anchor);
+  const anchoredConfigExists = existsSync(configPath);
+  const resolvedTier = loadConfig(configPath).tier;
+  const configuredTier = process.env['MOSAIC_STORAGE_TIER'];
+  const databaseUrlDeterminesTier = envOnlyTier === 'standalone' && configuredTier !== 'standalone';
+  const recognizedTierDeterminesTier =
+    (configuredTier === 'federated' ||
+      configuredTier === 'standalone' ||
+      configuredTier === 'local') &&
+    configuredTier === envOnlyTier;
+
+  let source: BootSource;
+  if (anchoredConfigExists) {
+    source = 'mosaic.config.json';
+  } else if (databaseUrlDeterminesTier && databaseUrlSource !== 'default') {
+    source = databaseUrlSource;
+  } else if (recognizedTierDeterminesTier && tierSource !== 'default') {
+    source = tierSource;
+  } else {
+    source = 'default';
+  }
+
+  console.info(`[gateway env] storage tier=${resolvedTier} source=${source}`);
+}
+
+loadGatewayEnv();
@@ -0,0 +1,164 @@
+import 'reflect-metadata';
+import { mkdir, mkdtemp, rm, writeFile } from 'node:fs/promises';
+import * as nodeOs from 'node:os';
+import { dirname, isAbsolute, join, relative, resolve } from 'node:path';
+import * as nodeUrl from 'node:url';
+import type { MosaicConfig } from '@mosaicstack/config';
+import type * as MosaicStorage from '@mosaicstack/storage';
+import { describe, expect, it, vi, type MockInstance } from 'vitest';
+
+// Each case uses vi.resetModules() and re-imports the full gateway graph for distinct ambient FS/env; CI needs headroom, while this still guards genuine hangs.
+const MODULE_IMPORT_TIMEOUT_MS = 120_000;
+
+function snapshotProcessEnv(): Record<string, string | undefined> {
+  return { ...process.env };
+}
+
+function restoreProcessEnv(snapshot: Record<string, string | undefined>): void {
+  for (const key of Object.keys(process.env)) {
+    if (!(key in snapshot)) {
+      delete process.env[key];
+    }
+  }
+
+  for (const [key, value] of Object.entries(snapshot)) {
+    if (value === undefined) {
+      delete process.env[key];
+      continue;
+    }
+
+    process.env[key] = value;
+  }
+}
+
+function expectPathUnderTempRoot(path: string, tempRoot: string): void {
+  const relativePath = relative(tempRoot, path);
+  expect(relativePath === '' || (!relativePath.startsWith('..') && !isAbsolute(relativePath))).toBe(
+    true,
+  );
+}
+
+async function writeFixture(path: string, contents: string, tempRoot: string): Promise<void> {
+  expectPathUnderTempRoot(path, tempRoot);
+  await mkdir(dirname(path), { recursive: true });
+  await writeFile(path, contents, 'utf8');
+}
+
+interface BootstrapPreflightResult {
+  capturedConfig: MosaicConfig | undefined;
+}
+
+async function runBootstrapPreflight(
+  anchoredConfigContents: string,
+  ambientConfigContents: string,
+): Promise<BootstrapPreflightResult> {
+  const originalEnv = snapshotProcessEnv();
+  const tempRoot = await mkdtemp(join(nodeOs.tmpdir(), 'mosaic-gateway-main-preflight-'));
+  let cwdSpy: ReturnType<typeof vi.spyOn> | undefined;
+  let exitSpy: MockInstance<typeof process.exit> | undefined;
+  let consoleInfoSpy: ReturnType<typeof vi.spyOn> | undefined;
+  let capturedConfig: MosaicConfig | undefined;
+
+  try {
+    const anchor = join(tempRoot, 'anchored', 'apps', 'gateway', 'src');
+    const homePath = join(tempRoot, 'home');
+    const cwdPath = join(tempRoot, 'ambient', 'cwd');
+    const monorepoRootConfigPath = resolve(anchor, '../../..', 'mosaic.config.json');
+
+    await mkdir(anchor, { recursive: true });
+    await mkdir(cwdPath, { recursive: true });
+
+    await writeFixture(monorepoRootConfigPath, anchoredConfigContents, tempRoot);
+    await writeFixture(join(cwdPath, 'mosaic.config.json'), ambientConfigContents, tempRoot);
+
+    process.env['HOME'] = homePath;
+    process.env['BETTER_AUTH_SECRET'] = 'fixture-secret';
+    delete process.env['MOSAIC_STORAGE_TIER'];
+    delete process.env['DATABASE_URL'];
+    delete process.env['VALKEY_URL'];
+
+    consoleInfoSpy = vi.spyOn(console, 'info').mockImplementation((): void => undefined);
+    const exitMock = vi.fn<typeof process.exit>();
+    exitSpy = vi.spyOn(process, 'exit').mockImplementation(exitMock);
+
+    vi.resetModules();
+    vi.doMock('node:os', () => ({ ...nodeOs, homedir: (): string => homePath }));
+    vi.doMock('node:url', () => ({
+      ...nodeUrl,
+      fileURLToPath: (url: string | URL): string => {
+        const actualPath = nodeUrl.fileURLToPath(url);
+        if (
+          actualPath.endsWith('/apps/gateway/src/env.ts') ||
+          actualPath.endsWith('/apps/gateway/src/env.js')
+        ) {
+          return join(anchor, 'env.ts');
+        }
+        return actualPath;
+      },
+    }));
+    cwdSpy = vi.spyOn(process, 'cwd').mockReturnValue(cwdPath);
+    vi.doMock('./tracing.js', () => ({}));
+
+    const preflightSentinel = new Error('preflight-capture-sentinel');
+    vi.doMock('@mosaicstack/storage', async () => {
+      const actual = await vi.importActual<typeof MosaicStorage>('@mosaicstack/storage');
+      return {
+        ...actual,
+        detectAndAssertTier: vi.fn((config: MosaicConfig): Promise<void> => {
+          capturedConfig = config;
+          throw preflightSentinel;
+        }),
+      };
+    });
+
+    await import('./main.js');
+    await vi.waitFor((): void => {
+      expect(exitSpy).toHaveBeenCalled();
+    });
+
+    return { capturedConfig };
+  } finally {
+    cwdSpy?.mockRestore();
+    exitSpy?.mockRestore();
+    consoleInfoSpy?.mockRestore();
+    vi.doUnmock('@mosaicstack/storage');
+    vi.doUnmock('./tracing.js');
+    vi.doUnmock('node:url');
+    vi.doUnmock('node:os');
+    vi.resetModules();
+    restoreProcessEnv(originalEnv);
+    await rm(tempRoot, { recursive: true, force: true });
+  }
+}
+
+describe('main bootstrap preflight config anchoring', (): void => {
+  it(
+    'passes the anchored monorepo-root config to detectAndAssertTier, not an ambient cwd config',
+    async (): Promise<void> => {
+      const anchoredConfig = JSON.stringify({
+        tier: 'local',
+        storage: { type: 'pglite', dataDir: '.mosaic/storage-pglite' },
+        queue: { type: 'local', dataDir: '.mosaic/queue' },
+        memory: { type: 'keyword' },
+      });
+      const ambientConfig = JSON.stringify({
+        tier: 'federated',
+        storage: {
+          type: 'postgres',
+          url: 'postgresql://ambient-attacker.invalid/mosaic',
+          enableVector: true,
+        },
+        queue: { type: 'bullmq' },
+        memory: { type: 'pgvector' },
+      });
+
+      const { capturedConfig } = await runBootstrapPreflight(anchoredConfig, ambientConfig);
+
+      expect(capturedConfig?.tier).toBe('local');
+      expect(capturedConfig?.storage).not.toEqual(
+        expect.objectContaining({ url: 'postgresql://ambient-attacker.invalid/mosaic' }),
+      );
+    },
+    MODULE_IMPORT_TIMEOUT_MS,
+  );
+});
@@ -1,18 +1,5 @@
 #!/usr/bin/env node
-import { config } from 'dotenv';
-import { existsSync } from 'node:fs';
-import { resolve, join } from 'node:path';
-import { homedir } from 'node:os';
-
-// Load .env from daemon config dir (global install / daemon mode).
-// Loaded first so monorepo .env can override for local dev.
-const daemonEnv = join(homedir(), '.config', 'mosaic', 'gateway', '.env');
-if (existsSync(daemonEnv)) config({ path: daemonEnv });
-
-// Load .env from monorepo root (cwd is apps/gateway when run via pnpm filter)
-config({ path: resolve(process.cwd(), '../../.env') });
-config(); // Also load apps/gateway/.env if present (overrides)
-
+import './env.js';
 import './tracing.js';
 import 'reflect-metadata';
 import { NestFactory } from '@nestjs/core';
@@ -26,6 +13,7 @@ import { mountAuthHandler } from './auth/auth.controller.js';
 import { mountMcpHandler } from './mcp/mcp.controller.js';
 import { McpService } from './mcp/mcp.service.js';
 import { detectAndAssertTier, TierDetectionError } from '@mosaicstack/storage';
+import { resolveGatewayConfigPath } from './env.js';

 async function bootstrap(): Promise<void> {
  const logger = new Logger('Bootstrap');
@@ -37,7 +25,7 @@ async function bootstrap(): Promise<void> {
  // Pre-flight: assert all external services required by the configured tier
  // are reachable. Runs before NestFactory.create() so failures are visible
  // immediately with actionable remediation hints.
-  const mosaicConfig = loadConfig();
+  const mosaicConfig = loadConfig(resolveGatewayConfigPath());
  try {
    await detectAndAssertTier(mosaicConfig);
  } catch (err) {
@@ -5,13 +5,13 @@
  "scripts": {
    "build": "node ../../scripts/build-web.mjs",
    "build:vite": "vite build",
-    "dev": "next dev",
+    "dev": "next dev -p 3101",
    "dev:vite": "vite",
    "lint": "eslint src",
    "typecheck": "tsc --noEmit",
    "test": "vitest run --passWithNoTests",
    "test:e2e": "playwright test",
-    "start": "next start"
+    "start": "next start -p 3101"
  },
  "dependencies": {
    "@mosaicstack/design-tokens": "workspace:^",
@@ -5,6 +5,14 @@ import { RegisterPage } from '@/spa/pages/register';
 import { SsoCallbackPage } from '@/spa/pages/sso-callback';
 import { ChatPage } from '@/spa/pages/chat';
 import { ChatRouteErrorBoundary } from '@/spa/pages/chat-error-boundary';
+import { ProjectDetailPage } from '@/spa/pages/project-detail';
+import { ProjectsPage } from '@/spa/pages/projects';
+import {
+  ProjectDetailRouteErrorBoundary,
+  ProjectsRouteErrorBoundary,
+  TasksRouteErrorBoundary,
+} from '@/spa/pages/resource-route-error-boundaries';
+import { TasksPage } from '@/spa/pages/tasks';
 import { AuthGuard, GuestGuard } from '@/spa/guards';
 import { Placeholder } from '@/spa/placeholder';

@@ -37,9 +45,17 @@ export const routes: RouteObject[] = [
    children: [
      { path: '/', element: <Navigate to="/chat" replace /> },
      { path: '/chat', element: <ChatPage />, errorElement: <ChatRouteErrorBoundary /> },
-      { path: '/projects', element: <Placeholder title="Projects" /> },
-      { path: '/projects/:id', element: <Placeholder title="Project" /> },
-      { path: '/tasks', element: <Placeholder title="Tasks" /> },
+      {
+        path: '/projects',
+        element: <ProjectsPage />,
+        errorElement: <ProjectsRouteErrorBoundary />,
+      },
+      {
+        path: '/projects/:id',
+        element: <ProjectDetailPage />,
+        errorElement: <ProjectDetailRouteErrorBoundary />,
+      },
+      { path: '/tasks', element: <TasksPage />, errorElement: <TasksRouteErrorBoundary /> },
      { path: '/settings', element: <Placeholder title="Settings" /> },
      { path: '/admin', element: <Placeholder title="Admin" /> },
    ],
@@ -0,0 +1,7 @@
+export function getErrorMessage(error: unknown, fallback: string): string {
+  if (error instanceof Error && error.message.trim().length > 0) {
+    return error.message;
+  }
+
+  return fallback;
+}
@@ -0,0 +1,115 @@
+import type { Mission, Project, Task } from '@/lib/types';
+
+export const projectFixtures: Project[] = [
+  {
+    id: 'project-1',
+    name: 'Mosaic Stack',
+    description: 'Gateway and dashboard parity work',
+    status: 'active',
+    userId: 'user-1',
+    metadata: {
+      prd: '# Mosaic Stack PRD\n\n## Objective\n\nShip the SPA route parity pages.',
+    },
+    createdAt: '2026-08-01T12:00:00.000Z',
+    updatedAt: '2026-08-09T18:30:00.000Z',
+  },
+  {
+    id: 'project-2',
+    name: 'Agent Runtime',
+    description: 'Pi SDK integration',
+    status: 'paused',
+    userId: 'user-1',
+    metadata: null,
+    createdAt: '2026-08-02T08:00:00.000Z',
+    updatedAt: '2026-08-05T10:00:00.000Z',
+  },
+];
+
+export const missionFixtures: Mission[] = [
+  {
+    id: 'mission-1',
+    name: 'Ship web parity',
+    description: 'Port read-only routes into the SPA',
+    status: 'active',
+    projectId: 'project-1',
+    metadata: null,
+    createdAt: '2026-08-03T12:00:00.000Z',
+    updatedAt: '2026-08-09T12:00:00.000Z',
+  },
+  {
+    id: 'mission-2',
+    name: 'Unrelated mission',
+    description: 'Must be filtered out of the project detail view',
+    status: 'planning',
+    projectId: 'project-2',
+    metadata: null,
+    createdAt: '2026-08-04T12:00:00.000Z',
+    updatedAt: '2026-08-04T12:00:00.000Z',
+  },
+];
+
+export const taskFixtures: Task[] = [
+  {
+    id: 'task-1',
+    title: 'Route /projects',
+    description: 'Port the read-only projects listing into the SPA',
+    status: 'done',
+    priority: 'high',
+    projectId: 'project-1',
+    missionId: 'mission-1',
+    assignee: 'Jarvis',
+    tags: ['spa', 'projects'],
+    dueDate: '2026-08-12T00:00:00.000Z',
+    metadata: {
+      notes: 'Read-only modal content should remain intact.',
+      pr_links: [{ url: 'https://example.invalid/pr/1', label: 'PR #1' }],
+    },
+    createdAt: '2026-08-04T10:00:00.000Z',
+    updatedAt: '2026-08-09T15:00:00.000Z',
+  },
+  {
+    id: 'task-2',
+    title: 'Route /projects/:id',
+    description: 'Reuse overview, tasks, missions, and PRD tabs',
+    status: 'in-progress',
+    priority: 'critical',
+    projectId: 'project-1',
+    missionId: 'mission-1',
+    assignee: null,
+    tags: ['spa', 'detail'],
+    dueDate: null,
+    metadata: null,
+    createdAt: '2026-08-05T09:00:00.000Z',
+    updatedAt: '2026-08-10T08:00:00.000Z',
+  },
+  {
+    id: 'task-3',
+    title: 'Route /tasks',
+    description: 'Wire list and kanban modal interactions',
+    status: 'blocked',
+    priority: 'medium',
+    projectId: 'project-1',
+    missionId: null,
+    assignee: null,
+    tags: ['spa', 'tasks'],
+    dueDate: null,
+    metadata: null,
+    createdAt: '2026-08-06T09:00:00.000Z',
+    updatedAt: '2026-08-08T08:00:00.000Z',
+  },
+  {
+    id: 'task-4',
+    title: 'Other project task',
+    description: 'Used only to confirm mission filtering remains project-scoped',
+    status: 'not-started',
+    priority: 'low',
+    projectId: 'project-2',
+    missionId: 'mission-2',
+    assignee: null,
+    tags: null,
+    dueDate: null,
+    metadata: null,
+    createdAt: '2026-08-06T09:00:00.000Z',
+    updatedAt: '2026-08-06T09:00:00.000Z',
+  },
+];
@@ -0,0 +1,174 @@
+import { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { createMemoryRouter, RouterProvider, type RouteObject } from 'react-router-dom';
+import { afterAll, afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
+import { missionFixtures, projectFixtures, taskFixtures } from './page-fixtures';
+
+const { apiMock } = vi.hoisted(() => ({
+  apiMock: vi.fn(),
+}));
+
+vi.mock('@/lib/api', () => ({
+  api: apiMock,
+}));
+
+import { ProjectDetailPage } from './project-detail';
+
+let root: Root | null = null;
+let container: HTMLDivElement;
+
+beforeAll(() => {
+  Object.defineProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT', {
+    configurable: true,
+    value: true,
+  });
+});
+
+afterAll(() => {
+  Reflect.deleteProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT');
+});
+
+afterEach(async () => {
+  await act(async () => {
+    root?.unmount();
+  });
+  document.body.replaceChildren();
+  root = null;
+  apiMock.mockReset();
+});
+
+async function renderProjectDetailPage(): Promise<ReturnType<typeof createMemoryRouter>> {
+  const routes: RouteObject[] = [
+    { path: '/projects', element: <p>Projects index target</p> },
+    { path: '/projects/:id', element: <ProjectDetailPage /> },
+  ];
+  const router = createMemoryRouter(routes, { initialEntries: ['/projects/project-1'] });
+  container = document.createElement('div');
+  document.body.append(container);
+  root = createRoot(container);
+
+  await act(async () => {
+    root?.render(<RouterProvider router={router} />);
+  });
+
+  return router;
+}
+
+function clickButtonByText(text: string): void {
+  const button = [...container.querySelectorAll('button')].find((candidate) =>
+    candidate.textContent?.includes(text),
+  );
+  if (!button) {
+    throw new Error(`Button containing "${text}" not found`);
+  }
+  button.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+}
+
+describe('ProjectDetailPage', () => {
+  it('loads the project, tasks, missions, and optional PRD content for the active project', async () => {
+    apiMock
+      .mockResolvedValueOnce(projectFixtures[0])
+      .mockResolvedValueOnce(missionFixtures)
+      .mockResolvedValueOnce(taskFixtures.filter((task) => task.projectId === 'project-1'));
+
+    await renderProjectDetailPage();
+
+    expect(apiMock.mock.calls).toEqual([
+      ['/api/projects/project-1'],
+      ['/api/missions'],
+      ['/api/tasks?projectId=project-1'],
+    ]);
+
+    expect(container.textContent).toContain('Mosaic Stack');
+    expect(container.textContent).toContain('Route /projects/:id');
+    expect(container.textContent).toContain('Tasks');
+    expect(container.textContent).toContain('Done');
+    expect(container.textContent).toContain('Blocked');
+
+    await act(async () => {
+      clickButtonByText('Missions (1)');
+    });
+
+    expect(container.textContent).toContain('Ship web parity');
+    expect(container.textContent).not.toContain('Unrelated mission');
+
+    await act(async () => {
+      clickButtonByText('PRD');
+    });
+
+    expect(container.textContent).toContain('Mosaic Stack PRD');
+    expect(container.textContent).toContain('Ship the SPA route parity pages.');
+  });
+
+  it('opens and closes the existing read-only task modal from the tasks tab', async () => {
+    apiMock
+      .mockResolvedValueOnce(projectFixtures[0])
+      .mockResolvedValueOnce(missionFixtures)
+      .mockResolvedValueOnce(taskFixtures.filter((task) => task.projectId === 'project-1'));
+
+    await renderProjectDetailPage();
+
+    await act(async () => {
+      clickButtonByText('Tasks (3)');
+    });
+
+    const row = [...container.querySelectorAll('tr')].find((candidate) =>
+      candidate.textContent?.includes('Route /projects'),
+    );
+    expect(row).toBeTruthy();
+
+    await act(async () => {
+      row?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(container.querySelector('[role="dialog"]')).toBeTruthy();
+    expect(container.textContent).toContain('Read-only modal content should remain intact.');
+
+    const closeButton = container.querySelector('button[aria-label="Close task details"]');
+    expect(closeButton).toBeTruthy();
+
+    await act(async () => {
+      closeButton?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(container.querySelector('[role="dialog"]')).toBeNull();
+  });
+
+  it('renders the project with an empty missions tab when the missions request fails', async () => {
+    apiMock
+      .mockResolvedValueOnce(projectFixtures[0])
+      .mockRejectedValueOnce(new Error('Missions request failed'))
+      .mockResolvedValueOnce(taskFixtures.filter((task) => task.projectId === 'project-1'));
+
+    await renderProjectDetailPage();
+
+    expect(container.textContent).toContain('Mosaic Stack');
+    expect(container.querySelector('[role="alert"]')).toBeNull();
+
+    await act(async () => {
+      clickButtonByText('Missions (0)');
+    });
+
+    expect(container.textContent).toContain('No missions for this project');
+  });
+
+  it('renders a visible alert when the project request fails and lets the user navigate back', async () => {
+    apiMock
+      .mockRejectedValueOnce(new Error('Project request failed'))
+      .mockResolvedValueOnce(missionFixtures)
+      .mockResolvedValueOnce(taskFixtures.filter((task) => task.projectId === 'project-1'));
+
+    const router = await renderProjectDetailPage();
+
+    const alert = container.querySelector('[role="alert"]');
+    expect(alert).toBeTruthy();
+    expect(alert?.textContent).toContain('Project request failed');
+    expect(container.textContent).not.toContain('Mosaic Stack');
+
+    await act(async () => {
+      clickButtonByText('Back to projects');
+    });
+
+    expect(router.state.location.pathname).toBe('/projects');
+  });
+});
@@ -0,0 +1,344 @@
+import { useEffect, useState, type ReactElement } from 'react';
+import { useNavigate, useParams } from 'react-router-dom';
+import { MissionTimeline } from '@/components/projects/mission-timeline';
+import { PrdViewer } from '@/components/projects/prd-viewer';
+import { TaskDetailModal } from '@/components/tasks/task-detail-modal';
+import { TaskListView } from '@/components/tasks/task-list-view';
+import { TaskStatusSummary } from '@/components/tasks/task-status-summary';
+import { api } from '@/lib/api';
+import { cn } from '@/lib/cn';
+import type { Mission, Project, Task, TaskStatus } from '@/lib/types';
+import { getErrorMessage } from './page-errors';
+
+type Tab = 'overview' | 'tasks' | 'missions' | 'prd';
+
+const projectStatusColors: Record<string, string> = {
+  active: 'bg-success/20 text-success',
+  paused: 'bg-warning/20 text-warning',
+  completed: 'bg-blue-600/20 text-blue-400',
+  archived: 'bg-gray-600/20 text-gray-400',
+};
+
+const taskStatusColors: Record<string, string> = {
+  'not-started': 'bg-gray-600/20 text-gray-300',
+  'in-progress': 'bg-blue-600/20 text-blue-400',
+  blocked: 'bg-error/20 text-error',
+  done: 'bg-success/20 text-success',
+  cancelled: 'bg-gray-600/20 text-gray-500',
+};
+
+interface TabButtonProps {
+  id: Tab;
+  label: string;
+  activeTab: Tab;
+  onClick: (tab: Tab) => void;
+}
+
+function TabButton({ id, label, activeTab, onClick }: TabButtonProps): ReactElement {
+  return (
+    <button
+      type="button"
+      onClick={() => onClick(id)}
+      className={cn(
+        'border-b-2 px-4 py-2 text-sm transition-colors',
+        activeTab === id
+          ? 'border-text-primary text-text-primary'
+          : 'border-transparent text-text-muted hover:text-text-secondary',
+      )}
+    >
+      {label}
+    </button>
+  );
+}
+
+export function ProjectDetailPage(): ReactElement {
+  const { id = '' } = useParams();
+  const navigate = useNavigate();
+  const [project, setProject] = useState<Project | null>(null);
+  const [missions, setMissions] = useState<Mission[]>([]);
+  const [tasks, setTasks] = useState<Task[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [activeTab, setActiveTab] = useState<Tab>('overview');
+  const [taskFilter, setTaskFilter] = useState<TaskStatus | 'all'>('all');
+  const [selectedTask, setSelectedTask] = useState<Task | null>(null);
+
+  useEffect(() => {
+    if (!id) {
+      setError('Project id is missing.');
+      setLoading(false);
+      return;
+    }
+
+    let cancelled = false;
+    setLoading(true);
+    setError(null);
+
+    void Promise.all([
+      api<Project>('/api/projects/' + id),
+      api<Mission[]>('/api/missions').catch(() => [] as Mission[]),
+      api<Task[]>('/api/tasks?projectId=' + id).catch(() => [] as Task[]),
+    ])
+      .then(([loadedProject, allMissions, loadedTasks]) => {
+        if (cancelled) return;
+        setProject(loadedProject);
+        setMissions(allMissions.filter((mission) => mission.projectId === id));
+        setTasks(loadedTasks);
+      })
+      .catch((caught: unknown) => {
+        if (cancelled) return;
+        setError(getErrorMessage(caught, 'Failed to load project.'));
+      })
+      .finally(() => {
+        if (cancelled) return;
+        setLoading(false);
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [id]);
+
+  if (loading) {
+    return (
+      <div className="flex min-h-screen flex-col px-4 py-6 sm:px-6">
+        <header className="mb-6 border-b px-1 pb-3">
+          <h1 className="text-2xl font-semibold">Project</h1>
+        </header>
+        <p className="py-16 text-center text-sm text-text-muted">Loading project...</p>
+      </div>
+    );
+  }
+
+  if (error || !project) {
+    return (
+      <div className="flex min-h-screen flex-col px-4 py-6 sm:px-6">
+        <header className="mb-6 border-b px-1 pb-3">
+          <h1 className="text-2xl font-semibold">Project</h1>
+        </header>
+        <div role="alert" className="rounded-lg border border-error/40 px-4 py-3 text-sm">
+          {error ?? 'Project not found.'}
+        </div>
+        <button
+          type="button"
+          onClick={() => navigate('/projects')}
+          className="mt-4 w-fit text-sm underline"
+        >
+          Back to projects
+        </button>
+      </div>
+    );
+  }
+
+  const filteredTasks =
+    taskFilter === 'all' ? tasks : tasks.filter((task) => task.status === taskFilter);
+  const prdContent = getPrdContent(project);
+  const tabs: Array<{ id: Tab; label: string }> = [
+    { id: 'overview', label: 'Overview' },
+    { id: 'tasks', label: `Tasks (${tasks.length})` },
+    { id: 'missions', label: `Missions (${missions.length})` },
+    ...(prdContent ? [{ id: 'prd' as const, label: 'PRD' }] : []),
+  ];
+
+  return (
+    <div className="flex min-h-screen flex-col px-4 py-6 sm:px-6">
+      <header className="mb-6 border-b px-1 pb-3">
+        <nav className="mb-4 flex items-center gap-2 text-sm text-text-muted">
+          <button
+            type="button"
+            onClick={() => navigate('/projects')}
+            className="hover:text-text-secondary"
+          >
+            Projects
+          </button>
+          <span>/</span>
+          <span className="text-text-primary">{project.name}</span>
+        </nav>
+
+        <div className="flex items-start justify-between gap-4">
+          <div>
+            <div className="flex items-center gap-3">
+              <h1 className="text-2xl font-semibold text-text-primary">{project.name}</h1>
+              <span
+                className={cn(
+                  'rounded-full px-2 py-0.5 text-xs',
+                  projectStatusColors[project.status] ?? 'bg-gray-600/20 text-gray-400',
+                )}
+              >
+                {project.status}
+              </span>
+            </div>
+            {project.description ? (
+              <p className="mt-1 text-sm text-text-muted">{project.description}</p>
+            ) : null}
+            <p className="mt-2 text-xs text-text-muted">
+              Created {new Date(project.createdAt).toLocaleDateString()} · Updated{' '}
+              {new Date(project.updatedAt).toLocaleDateString()}
+            </p>
+          </div>
+        </div>
+      </header>
+
+      <div className="mb-6 grid grid-cols-2 gap-3 sm:grid-cols-4">
+        <StatCard label="Tasks" value={String(tasks.length)} />
+        <StatCard
+          label="Done"
+          value={String(tasks.filter((task) => task.status === 'done').length)}
+          valueClass="text-success"
+        />
+        <StatCard
+          label="In Progress"
+          value={String(tasks.filter((task) => task.status === 'in-progress').length)}
+          valueClass="text-blue-400"
+        />
+        <StatCard
+          label="Blocked"
+          value={String(tasks.filter((task) => task.status === 'blocked').length)}
+          valueClass={tasks.some((task) => task.status === 'blocked') ? 'text-error' : undefined}
+        />
+      </div>
+
+      <div className="mb-6 flex gap-0 border-b border-surface-border">
+        {tabs.map((tab) => (
+          <TabButton
+            key={tab.id}
+            id={tab.id}
+            label={tab.label}
+            activeTab={activeTab}
+            onClick={setActiveTab}
+          />
+        ))}
+      </div>
+
+      {activeTab === 'overview' ? (
+        <OverviewTab project={project} missions={missions} tasks={tasks} />
+      ) : null}
+
+      {activeTab === 'tasks' ? (
+        <div>
+          <div className="mb-4">
+            <TaskStatusSummary
+              tasks={tasks}
+              activeFilter={taskFilter}
+              onFilterChange={setTaskFilter}
+            />
+          </div>
+          <TaskListView tasks={filteredTasks} onTaskClick={setSelectedTask} />
+        </div>
+      ) : null}
+
+      {activeTab === 'missions' ? <MissionTimeline missions={missions} /> : null}
+
+      {activeTab === 'prd' && prdContent ? (
+        <div className="rounded-lg border border-surface-border bg-surface-card p-6">
+          <PrdViewer content={prdContent} />
+        </div>
+      ) : null}
+
+      {selectedTask ? (
+        <TaskDetailModal task={selectedTask} onClose={() => setSelectedTask(null)} />
+      ) : null}
+    </div>
+  );
+}
+
+function OverviewTab({
+  project,
+  missions,
+  tasks,
+}: {
+  project: Project;
+  missions: Mission[];
+  tasks: Task[];
+}): ReactElement {
+  const recentTasks = [...tasks]
+    .sort((left, right) => new Date(right.updatedAt).getTime() - new Date(left.updatedAt).getTime())
+    .slice(0, 5);
+
+  return (
+    <div className="grid gap-6 lg:grid-cols-2">
+      <section>
+        <h2 className="mb-3 text-sm font-semibold text-text-secondary">Recent Tasks</h2>
+        {recentTasks.length === 0 ? (
+          <div className="rounded-lg border border-surface-border bg-surface-card p-4 text-center">
+            <p className="text-sm text-text-muted">No tasks yet</p>
+          </div>
+        ) : (
+          <div className="space-y-2">
+            {recentTasks.map((task) => (
+              <div
+                key={task.id}
+                className="flex items-center justify-between gap-2 rounded-lg border border-surface-border bg-surface-card px-3 py-2"
+              >
+                <span className="truncate text-sm text-text-primary">{task.title}</span>
+                <span
+                  className={cn(
+                    'shrink-0 rounded-full px-2 py-0.5 text-xs',
+                    taskStatusColors[task.status] ?? 'bg-gray-600/20 text-gray-400',
+                  )}
+                >
+                  {task.status}
+                </span>
+              </div>
+            ))}
+          </div>
+        )}
+      </section>
+
+      <section>
+        <h2 className="mb-3 text-sm font-semibold text-text-secondary">Missions</h2>
+        {missions.length === 0 ? (
+          <div className="rounded-lg border border-surface-border bg-surface-card p-4 text-center">
+            <p className="text-sm text-text-muted">No missions yet</p>
+          </div>
+        ) : (
+          <MissionTimeline missions={missions.slice(0, 4)} />
+        )}
+      </section>
+
+      {project.metadata && Object.keys(project.metadata).length > 0 ? (
+        <section className="lg:col-span-2">
+          <h2 className="mb-3 text-sm font-semibold text-text-secondary">Project Metadata</h2>
+          <div className="rounded-lg border border-surface-border bg-surface-card p-4">
+            <pre className="overflow-x-auto text-xs text-text-muted">
+              {JSON.stringify(project.metadata, null, 2)}
+            </pre>
+          </div>
+        </section>
+      ) : null}
+    </div>
+  );
+}
+
+function StatCard({
+  label,
+  value,
+  valueClass,
+}: {
+  label: string;
+  value: string;
+  valueClass?: string;
+}): ReactElement {
+  return (
+    <div className="rounded-lg border border-surface-border bg-surface-card p-3">
+      <p className="text-xs text-text-muted">{label}</p>
+      <p className={cn('mt-1 text-lg font-semibold', valueClass ?? 'text-text-primary')}>{value}</p>
+    </div>
+  );
+}
+
+function getPrdContent(project: Project): string | null {
+  if (!project.metadata) return null;
+
+  const prd = project.metadata['prd'];
+  if (typeof prd === 'string' && prd.trim().length > 0) {
+    return prd;
+  }
+
+  const prdContent = project.metadata['prdContent'];
+  if (typeof prdContent === 'string' && prdContent.trim().length > 0) {
+    return prdContent;
+  }
+
+  return null;
+}
@@ -0,0 +1,131 @@
+import { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { createMemoryRouter, RouterProvider, type RouteObject } from 'react-router-dom';
+import { afterAll, afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
+import { projectFixtures } from './page-fixtures';
+
+const { apiMock } = vi.hoisted(() => ({
+  apiMock: vi.fn(),
+}));
+
+vi.mock('@/lib/api', () => ({
+  api: apiMock,
+}));
+
+import { ProjectsPage } from './projects';
+
+interface Deferred<T> {
+  promise: Promise<T>;
+  resolve: (value: T) => void;
+  reject: (reason?: unknown) => void;
+}
+
+function createDeferred<T>(): Deferred<T> {
+  let resolve!: (value: T) => void;
+  let reject!: (reason?: unknown) => void;
+  const promise = new Promise<T>((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+}
+
+let root: Root | null = null;
+let container: HTMLDivElement;
+
+beforeAll(() => {
+  Object.defineProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT', {
+    configurable: true,
+    value: true,
+  });
+});
+
+afterAll(() => {
+  Reflect.deleteProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT');
+});
+
+afterEach(async () => {
+  await act(async () => {
+    root?.unmount();
+  });
+  document.body.replaceChildren();
+  root = null;
+  apiMock.mockReset();
+});
+
+async function renderProjectsPage(): Promise<ReturnType<typeof createMemoryRouter>> {
+  const routes: RouteObject[] = [
+    { path: '/projects', element: <ProjectsPage /> },
+    { path: '/projects/:id', element: <p>Project detail target</p> },
+  ];
+
+  const router = createMemoryRouter(routes, { initialEntries: ['/projects'] });
+  container = document.createElement('div');
+  document.body.append(container);
+  root = createRoot(container);
+
+  await act(async () => {
+    root?.render(<RouterProvider router={router} />);
+  });
+
+  return router;
+}
+
+describe('ProjectsPage', () => {
+  it('shows a visible loading state while the project request is in flight', async () => {
+    const deferred = createDeferred<typeof projectFixtures>();
+    apiMock.mockReturnValueOnce(deferred.promise);
+
+    await renderProjectsPage();
+
+    expect(container.textContent).toContain('Loading projects...');
+
+    await act(async () => {
+      deferred.resolve(projectFixtures);
+      await deferred.promise;
+    });
+  });
+
+  it('renders project cards from the API and navigates to a project detail route on click', async () => {
+    apiMock.mockResolvedValueOnce(projectFixtures);
+
+    const router = await renderProjectsPage();
+
+    expect(apiMock).toHaveBeenCalledWith('/api/projects');
+    expect(container.textContent).toContain('Mosaic Stack');
+    expect(container.textContent).toContain('Agent Runtime');
+
+    const button = [...container.querySelectorAll('button')].find((candidate) =>
+      candidate.textContent?.includes('Mosaic Stack'),
+    );
+    expect(button).toBeTruthy();
+
+    await act(async () => {
+      button?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(router.state.location.pathname).toBe('/projects/project-1');
+    expect(container.textContent).toContain('Project detail target');
+  });
+
+  it('renders the empty state when the API returns no projects', async () => {
+    apiMock.mockResolvedValueOnce([]);
+
+    await renderProjectsPage();
+
+    expect(container.textContent).toContain('No projects yet');
+    expect(container.textContent).toContain(
+      'Projects will appear here when created via the gateway API',
+    );
+  });
+
+  it('renders a visible alert when the projects request fails', async () => {
+    apiMock.mockRejectedValueOnce(new Error('Projects are unavailable'));
+
+    await renderProjectsPage();
+
+    const alert = container.querySelector('[role="alert"]');
+    expect(alert).toBeTruthy();
+    expect(alert?.textContent).toContain('Projects are unavailable');
+  });
+});
@@ -0,0 +1,70 @@
+import { useEffect, useState, type ReactElement } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { ProjectCard } from '@/components/projects/project-card';
+import { api } from '@/lib/api';
+import type { Project } from '@/lib/types';
+import { getErrorMessage } from './page-errors';
+
+export function ProjectsPage(): ReactElement {
+  const navigate = useNavigate();
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    let cancelled = false;
+
+    void api<Project[]>('/api/projects')
+      .then((response) => {
+        if (cancelled) return;
+        setProjects(response);
+      })
+      .catch((caught: unknown) => {
+        if (cancelled) return;
+        setError(getErrorMessage(caught, 'Failed to load projects.'));
+      })
+      .finally(() => {
+        if (cancelled) return;
+        setLoading(false);
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  return (
+    <div className="flex min-h-screen flex-col px-4 py-6 sm:px-6">
+      <header className="mb-6 border-b px-1 pb-3">
+        <h1 className="text-2xl font-semibold">Projects</h1>
+      </header>
+
+      {error ? (
+        <div role="alert" className="mb-6 rounded-lg border border-error/40 px-4 py-3 text-sm">
+          {error}
+        </div>
+      ) : null}
+
+      {loading ? (
+        <p className="py-8 text-center text-sm text-text-muted">Loading projects...</p>
+      ) : projects.length === 0 ? (
+        <div className="py-12 text-center">
+          <h2 className="text-lg font-medium text-text-secondary">No projects yet</h2>
+          <p className="mt-1 text-sm text-text-muted">
+            Projects will appear here when created via the gateway API
+          </p>
+        </div>
+      ) : (
+        <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+          {projects.map((project) => (
+            <ProjectCard
+              key={project.id}
+              project={project}
+              onClick={(selectedProject) => navigate(`/projects/${selectedProject.id}`)}
+            />
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
@@ -0,0 +1,86 @@
+import { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { createMemoryRouter, RouterProvider, type RouteObject } from 'react-router-dom';
+import { afterAll, afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
+
+const { useSessionMock } = vi.hoisted(() => ({
+  useSessionMock: vi.fn(),
+}));
+
+vi.mock('@/lib/auth-client', () => ({
+  useSession: useSessionMock,
+}));
+
+import { routes } from '@/routes';
+
+function Boom(): never {
+  throw new Error('resource route render blew up');
+}
+
+function replaceRouteElementWithBoom(nodes: RouteObject[], path: string): RouteObject[] {
+  return nodes.map((node) => {
+    const cloned: RouteObject = { ...node };
+    if (cloned.path === path) {
+      cloned.element = <Boom />;
+    }
+    if (cloned.children) {
+      cloned.children = replaceRouteElementWithBoom(cloned.children, path);
+    }
+    return cloned;
+  });
+}
+
+let root: Root | null = null;
+let container: HTMLDivElement;
+
+beforeAll(() => {
+  Object.defineProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT', {
+    configurable: true,
+    value: true,
+  });
+});
+
+afterAll(() => {
+  Reflect.deleteProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT');
+});
+
+afterEach(async () => {
+  await act(async () => {
+    root?.unmount();
+  });
+  document.body.replaceChildren();
+  root = null;
+  useSessionMock.mockReset();
+});
+
+describe('resource route error boundaries', () => {
+  it.each(['/projects', '/projects/:id', '/tasks'])(
+    'renders a recoverable fallback when %s throws during route render',
+    async (path) => {
+      useSessionMock.mockReturnValue({ data: { user: { id: 'user-1' } }, isPending: false });
+
+      const initialEntry = path === '/projects/:id' ? '/projects/project-1' : path;
+      const router = createMemoryRouter(replaceRouteElementWithBoom(routes, path), {
+        initialEntries: [initialEntry],
+      });
+
+      container = document.createElement('div');
+      document.body.append(container);
+      root = createRoot(container);
+
+      const consoleErrorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+      try {
+        await act(async () => {
+          root?.render(<RouterProvider router={router} />);
+        });
+
+        expect(consoleErrorSpy).toHaveBeenCalled();
+      } finally {
+        consoleErrorSpy.mockRestore();
+      }
+
+      expect(container.textContent).not.toBe('');
+      expect(container.querySelector('[role="alert"]')).toBeTruthy();
+    },
+  );
+});
@@ -0,0 +1,55 @@
+import type { ReactElement } from 'react';
+import { useRouteError } from 'react-router-dom';
+
+interface ResourceRouteErrorBoundaryProps {
+  message: string;
+  href: string;
+  linkLabel: string;
+}
+
+function ResourceRouteErrorBoundary({
+  message,
+  href,
+  linkLabel,
+}: ResourceRouteErrorBoundaryProps): ReactElement {
+  useRouteError();
+
+  return (
+    <div role="alert" className="flex min-h-screen flex-col items-center justify-center gap-3 p-8">
+      <p className="text-sm font-medium">{message}</p>
+      <a href={href} className="text-sm underline">
+        {linkLabel}
+      </a>
+    </div>
+  );
+}
+
+export function ProjectsRouteErrorBoundary(): ReactElement {
+  return (
+    <ResourceRouteErrorBoundary
+      message="Something went wrong loading projects."
+      href="/projects"
+      linkLabel="Reload projects"
+    />
+  );
+}
+
+export function ProjectDetailRouteErrorBoundary(): ReactElement {
+  return (
+    <ResourceRouteErrorBoundary
+      message="Something went wrong loading this project."
+      href="/projects"
+      linkLabel="Back to projects"
+    />
+  );
+}
+
+export function TasksRouteErrorBoundary(): ReactElement {
+  return (
+    <ResourceRouteErrorBoundary
+      message="Something went wrong loading tasks."
+      href="/tasks"
+      linkLabel="Reload tasks"
+    />
+  );
+}
@@ -0,0 +1,144 @@
+import { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { createMemoryRouter, RouterProvider, type RouteObject } from 'react-router-dom';
+import { afterAll, afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
+import { taskFixtures } from './page-fixtures';
+
+const { apiMock } = vi.hoisted(() => ({
+  apiMock: vi.fn(),
+}));
+
+vi.mock('@/lib/api', () => ({
+  api: apiMock,
+}));
+
+import { TasksPage } from './tasks';
+
+interface Deferred<T> {
+  promise: Promise<T>;
+  resolve: (value: T) => void;
+}
+
+function createDeferred<T>(): Deferred<T> {
+  let resolve!: (value: T) => void;
+  const promise = new Promise<T>((res) => {
+    resolve = res;
+  });
+  return { promise, resolve };
+}
+
+let root: Root | null = null;
+let container: HTMLDivElement;
+
+beforeAll(() => {
+  Object.defineProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT', {
+    configurable: true,
+    value: true,
+  });
+});
+
+afterAll(() => {
+  Reflect.deleteProperty(globalThis, 'IS_REACT_ACT_ENVIRONMENT');
+});
+
+afterEach(async () => {
+  await act(async () => {
+    root?.unmount();
+  });
+  document.body.replaceChildren();
+  root = null;
+  apiMock.mockReset();
+});
+
+async function renderTasksPage(): Promise<void> {
+  const routes: RouteObject[] = [{ path: '/tasks', element: <TasksPage /> }];
+  const router = createMemoryRouter(routes, { initialEntries: ['/tasks'] });
+  container = document.createElement('div');
+  document.body.append(container);
+  root = createRoot(container);
+
+  await act(async () => {
+    root?.render(<RouterProvider router={router} />);
+  });
+}
+
+function clickButtonByText(text: string): void {
+  const button = [...container.querySelectorAll('button')].find((candidate) =>
+    candidate.textContent?.includes(text),
+  );
+  if (!button) {
+    throw new Error(`Button containing "${text}" not found`);
+  }
+  button.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+}
+
+describe('TasksPage', () => {
+  it('shows a visible loading state before the tasks request settles', async () => {
+    const deferred = createDeferred<typeof taskFixtures>();
+    apiMock.mockReturnValueOnce(deferred.promise);
+
+    await renderTasksPage();
+
+    expect(container.textContent).toContain('Loading tasks...');
+
+    await act(async () => {
+      deferred.resolve(taskFixtures);
+      await deferred.promise;
+    });
+  });
+
+  it('starts in kanban view, toggles to list view, and opens the read-only modal from cards and rows', async () => {
+    apiMock.mockResolvedValueOnce(taskFixtures);
+
+    await renderTasksPage();
+
+    expect(container.textContent).toContain('Not Started');
+    expect(container.textContent).toContain('In Progress');
+    expect(container.textContent).toContain('Blocked');
+
+    const kanbanCard = [...container.querySelectorAll('button')].find((candidate) =>
+      candidate.textContent?.includes('Route /projects/:id'),
+    );
+    expect(kanbanCard).toBeTruthy();
+
+    await act(async () => {
+      kanbanCard?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(container.querySelector('[role="dialog"]')).toBeTruthy();
+
+    await act(async () => {
+      container
+        .querySelector('button[aria-label="Close task details"]')
+        ?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(container.querySelector('[role="dialog"]')).toBeNull();
+
+    await act(async () => {
+      clickButtonByText('List');
+    });
+
+    const row = [...container.querySelectorAll('tr')].find((candidate) =>
+      candidate.textContent?.includes('Route /tasks'),
+    );
+    expect(row).toBeTruthy();
+
+    await act(async () => {
+      row?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+    });
+
+    expect(container.querySelector('[role="dialog"]')).toBeTruthy();
+    expect(container.textContent).toContain('Wire list and kanban modal interactions');
+  });
+
+  it('renders a visible alert when the tasks request fails', async () => {
+    apiMock.mockRejectedValueOnce(new Error('Tasks request failed'));
+
+    await renderTasksPage();
+
+    const alert = container.querySelector('[role="alert"]');
+    expect(alert).toBeTruthy();
+    expect(alert?.textContent).toContain('Tasks request failed');
+  });
+});
@@ -0,0 +1,92 @@
+import { useEffect, useState, type ReactElement } from 'react';
+import { KanbanBoard } from '@/components/tasks/kanban-board';
+import { TaskDetailModal } from '@/components/tasks/task-detail-modal';
+import { TaskListView } from '@/components/tasks/task-list-view';
+import { api } from '@/lib/api';
+import { cn } from '@/lib/cn';
+import type { Task } from '@/lib/types';
+import { getErrorMessage } from './page-errors';
+
+type ViewMode = 'list' | 'kanban';
+
+export function TasksPage(): ReactElement {
+  const [tasks, setTasks] = useState<Task[]>([]);
+  const [view, setView] = useState<ViewMode>('kanban');
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [selectedTask, setSelectedTask] = useState<Task | null>(null);
+
+  useEffect(() => {
+    let cancelled = false;
+
+    void api<Task[]>('/api/tasks')
+      .then((response) => {
+        if (cancelled) return;
+        setTasks(response);
+      })
+      .catch((caught: unknown) => {
+        if (cancelled) return;
+        setError(getErrorMessage(caught, 'Failed to load tasks.'));
+      })
+      .finally(() => {
+        if (cancelled) return;
+        setLoading(false);
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  return (
+    <div className="flex min-h-screen flex-col px-4 py-6 sm:px-6">
+      <header className="mb-6 flex items-center justify-between gap-4 border-b px-1 pb-3">
+        <h1 className="text-2xl font-semibold">Tasks</h1>
+        <div className="flex rounded-lg border border-surface-border">
+          <button
+            type="button"
+            onClick={() => setView('list')}
+            className={cn(
+              'px-3 py-1.5 text-xs transition-colors',
+              view === 'list'
+                ? 'bg-surface-elevated text-text-primary'
+                : 'text-text-muted hover:text-text-secondary',
+            )}
+          >
+            List
+          </button>
+          <button
+            type="button"
+            onClick={() => setView('kanban')}
+            className={cn(
+              'px-3 py-1.5 text-xs transition-colors',
+              view === 'kanban'
+                ? 'bg-surface-elevated text-text-primary'
+                : 'text-text-muted hover:text-text-secondary',
+            )}
+          >
+            Kanban
+          </button>
+        </div>
+      </header>
+
+      {error ? (
+        <div role="alert" className="mb-6 rounded-lg border border-error/40 px-4 py-3 text-sm">
+          {error}
+        </div>
+      ) : null}
+
+      {loading ? (
+        <p className="py-8 text-center text-sm text-text-muted">Loading tasks...</p>
+      ) : view === 'kanban' ? (
+        <KanbanBoard tasks={tasks} onTaskClick={setSelectedTask} />
+      ) : (
+        <TaskListView tasks={tasks} onTaskClick={setSelectedTask} />
+      )}
+
+      {selectedTask ? (
+        <TaskDetailModal task={selectedTask} onClose={() => setSelectedTask(null)} />
+      ) : null}
+    </div>
+  );
+}
@@ -4,6 +4,9 @@ import type { RouteObject } from 'react-router-dom';
 import { routes } from '@/routes';
 import { Placeholder } from '@/spa/placeholder';
 import { ChatPage } from '@/spa/pages/chat';
+import { ProjectDetailPage } from '@/spa/pages/project-detail';
+import { ProjectsPage } from '@/spa/pages/projects';
+import { TasksPage } from '@/spa/pages/tasks';

 function collectPaths(routeObjects: RouteObject[]): string[] {
  return routeObjects.flatMap((route) => [
@@ -67,4 +70,28 @@ describe('SPA route table', () => {
    expect(element.type).not.toBe(Placeholder);
    expect(element.type).toBe(ChatPage);
  });
+
+  it.each([
+    ['/projects', ProjectsPage],
+    ['/projects/:id', ProjectDetailPage],
+    ['/tasks', TasksPage],
+  ])(
+    'renders a real authenticated page instead of the P1 placeholder at %s',
+    (path, expectedType) => {
+      const element = findRoute(routes, path)?.element;
+      expect(isValidElement(element)).toBe(true);
+      if (!isValidElement(element)) throw new Error(`Missing route element for ${path}`);
+      expect(element.type).not.toBe(Placeholder);
+      expect(element.type).toBe(expectedType);
+    },
+  );
+
+  it.each(['/chat', '/projects', '/projects/:id', '/tasks'])(
+    'defines an error boundary for %s',
+    (path) => {
+      const route = findRoute(routes, path);
+      expect(route?.errorElement).toBeTruthy();
+      expect(isValidElement(route?.errorElement)).toBe(true);
+    },
+  );
 });
@@ -16,6 +16,7 @@ export default defineConfig({
  },
  server: {
    port: 3100,
+    strictPort: true,
    proxy: {
      '/api': gatewayTarget,
      '/socket.io': { target: gatewayTarget, ws: true },
@@ -0,0 +1,33 @@
+# CI Queue Guard Purpose Semantics
+
+- **Issue:** #1146
+- **Target branch:** `next`
+
+## Problem
+
+`ci-queue-wait.sh` treats any result other than terminal success as asserted non-readiness. That is correct for merge readiness, but incorrect for the pre-push queue guard: a terminal failure or an empty status set means no pipeline is queued or running, so the queue is clear.
+
+## Design
+
+Make final-state handling purpose-sensitive while preserving the existing provider and payload safeguards:
+
+- `--purpose push`
+  - wait while state is `pending`;
+  - return success for `terminal-success`, `terminal-failure`, and `no-status`;
+  - continue rejecting `malformed`, `unknown`, and unrecognized states.
+- `--purpose merge`
+  - return success only for `terminal-success`;
+  - continue rejecting `terminal-failure`, `no-status`, malformed, unknown, and unrecognized states.
+- `--require-status` remains authoritative: `no-status` fails for either purpose when it is supplied.
+
+Diagnostics will explicitly distinguish a queue-clear push result from successful CI so callers cannot mistake an old failure for a green pipeline.
+
+## Testing
+
+Extend the process-level tri-state regression harness with separate push and merge assertions:
+
+1. Push passes for terminal success, terminal failure, and no status.
+2. Push still fails for pending, malformed, and unknown states.
+3. `--require-status` makes push/no-status fail.
+4. Merge behavior remains fail-closed except for terminal success.
+5. Existing provider-unavailable audit behavior remains unchanged.
@@ -0,0 +1,208 @@
+# CI Queue Guard Purpose Semantics Implementation Plan
+
+> **For Claude:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.
+
+**Goal:** Make the pre-push CI queue guard pass when no pipeline is queued or running while preserving fail-closed merge readiness.
+
+**Architecture:** Keep provider lookup and tri-state classification unchanged. Make only the final state dispatch purpose-sensitive: push treats valid non-pending states as queue-clear, while merge continues to require terminal success. Preserve `--require-status`, malformed-payload rejection, unknown-state rejection, and audited provider-unavailable behavior.
+
+**Tech Stack:** Bash, process-level shell regression harnesses, Gitea/GitHub status APIs.
+
+---
+
+### Task 1: Freeze Purpose-Specific State Semantics
+
+**Files:**
+
+- Modify: `packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh`
+- Test: `packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh`
+
+**Step 1: Add failing push assertions**
+
+Change push expectations so `terminal-failure` and `no-status` require exit 0 plus an explicit `queue-clear` diagnostic. Add a `--require-status` assertion that keeps push/no-status non-zero.
+
+**Step 2: Add failing merge assertions**
+
+Invoke the same harness with `MOSAIC_TEST_PURPOSE=merge` and assert terminal failure and no status remain non-zero while terminal success remains zero.
+
+**Step 3: Add unknown-state coverage**
+
+Add a stub payload with a syntactically valid but unsupported status value and assert both purposes reject it.
+
+**Step 4: Run the focused test and verify RED**
+
+Run:
+
+```bash
+bash packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh
+```
+
+Expected: failures showing push terminal-failure and no-status returned exit 3 instead of exit 0 or lacked `queue-clear` diagnostics.
+
+**Step 5: Commit the failing tests**
+
+```bash
+git add packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh
+git commit -m "test(ci): define purpose-aware queue readiness"
+```
+
+### Task 2: Implement Purpose-Sensitive Final-State Dispatch
+
+**Files:**
+
+- Modify: `packages/mosaic/framework/tools/git/ci-queue-wait.sh:458-481`
+- Test: `packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh`
+- Test: `packages/mosaic/framework/tools/git/test-ci-queue-wait-github-checks.sh`
+
+**Step 1: Implement push queue-clear behavior**
+
+For `no-status`, retain the existing `--require-status` failure. Otherwise, return success for push with an explicit diagnostic such as:
+
+```text
+[ci-queue-wait] queue-clear state=no-status purpose=push branch=<branch>; no queued or running CI.
+```
+
+For `terminal-failure`, return success only for push with the same queue-clear wording. Merge must continue returning asserted non-readiness.
+
+**Step 2: Preserve malformed and unknown rejection**
+
+Keep `malformed`, `unknown`, and unrecognized states non-zero for both purposes.
+
+**Step 3: Run focused tests and verify GREEN**
+
+Run:
+
+```bash
+bash packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh
+bash packages/mosaic/framework/tools/git/test-ci-queue-wait-github-checks.sh
+```
+
+Expected: both scripts exit 0 and report their regression suites passed.
+
+**Step 4: Commit implementation**
+
+```bash
+git add packages/mosaic/framework/tools/git/ci-queue-wait.sh
+git commit -m "fix(ci): separate push queue clearance from merge readiness"
+```
+
+### Task 3: Verify, Review, and Document Evidence
+
+**Files:**
+
+- Modify: `docs/scratchpads/1146-ci-queue-purpose.md`
+
+**Step 1: Run shell syntax and focused regressions**
+
+```bash
+bash -n packages/mosaic/framework/tools/git/ci-queue-wait.sh
+bash -n packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh
+bash packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh
+bash packages/mosaic/framework/tools/git/test-ci-queue-wait-github-checks.sh
+```
+
+**Step 2: Run repository quality gates**
+
+```bash
+pnpm preflight
+pnpm typecheck
+pnpm lint
+pnpm test
+pnpm format:check
+```
+
+Expected: every command exits 0.
+
+**Step 3: Obtain independent review**
+
+Request review of the exact branch head. Remediate all blocking findings and rerun focused and baseline gates.
+
+**Step 4: Record evidence and commit**
+
+Update the scratchpad with test output, review result, and residual risk, then commit it:
+
+```bash
+git add docs/scratchpads/1146-ci-queue-purpose.md
+git commit -m "docs(ci): record queue guard verification"
+```
+
+### Task 4: Keep the Merge Wrapper Aligned with the `next` Lane
+
+**Files:**
+
+- Modify: `packages/mosaic/framework/tools/git/pr-merge.sh:97-101`
+- Test: `packages/mosaic/framework/tools/git/test-pr-merge-head-pin.sh`
+
+**Step 1: Write the failing regression**
+
+Run the exact-head merge regression with its Gitea fixture targeting `next` and confirm the current wrapper rejects it because it only permits `main`.
+
+**Step 2: Allow only documented integration targets**
+
+Permit `main` and `next`; reject every other target. Do not alter exact-head pinning, queue-guard invocation, provider selection, or merge method enforcement.
+
+**Step 3: Run focused merge regressions**
+
+```bash
+bash packages/mosaic/framework/tools/git/test-pr-merge-head-pin.sh
+bash packages/mosaic/framework/tools/git/test-pr-merge-queue-branch.sh
+bash packages/mosaic/framework/tools/git/test-pr-merge-gitea-empty-uid.sh
+```
+
+Expected: all pass, including a Gitea merge fixture targeting `next`.
+
+**Step 4: Commit**
+
+```bash
+git add packages/mosaic/framework/tools/git/pr-merge.sh packages/mosaic/framework/tools/git/test-pr-merge-head-pin.sh
+git commit -m "fix(ci): allow reviewed merges into next"
+```
+
+### Task 5: Activate and Deliver Through `next`
+
+**Files:**
+
+- Installed output: `~/.config/mosaic/tools/git/ci-queue-wait.sh`
+
+**Step 1: Activate through the canonical installer**
+
+From the reviewed worktree, run the framework installer in sync-only keep mode so operator files remain protected:
+
+```bash
+MOSAIC_SYNC_ONLY=1 MOSAIC_INSTALL_MODE=keep MOSAIC_SKIP_SKILLS_SYNC=1 \
+  bash packages/mosaic/framework/install.sh
+```
+
+**Step 2: Verify installed/source parity**
+
+```bash
+cmp -s \
+  packages/mosaic/framework/tools/git/ci-queue-wait.sh \
+  ~/.config/mosaic/tools/git/ci-queue-wait.sh
+```
+
+Expected: exit 0.
+
+**Step 3: Run mandatory pre-push queue guard**
+
+```bash
+~/.config/mosaic/tools/git/ci-queue-wait.sh --purpose push -B fix/1146-ci-queue-purpose
+```
+
+Expected: branch-absent or queue-clear success.
+
+**Step 4: Push and open a PR against `next`**
+
+```bash
+git push -u origin fix/1146-ci-queue-purpose
+~/.config/mosaic/tools/git/pr-create.sh \
+  -t "fix(ci): make queue guard purpose-sensitive" \
+  -b "Closes #1146" \
+  -B next \
+  -H fix/1146-ci-queue-purpose \
+  -i 1146
+```
+
+**Step 5: Complete reviewed integration**
+
+Wait for exact-head terminal-green CI, obtain the required review, merge via the Mosaic wrapper, verify merged CI, and close #1146. Do not bypass any gate.
@@ -0,0 +1,65 @@
+# #1146 — CI Queue Guard Purpose Semantics
+
+## Objective
+
+Make the pre-push queue guard wait for queued/running CI without requiring the previous remote head to have successful CI. Preserve fail-closed merge readiness.
+
+## Scope
+
+- `packages/mosaic/framework/tools/git/ci-queue-wait.sh`
+- focused queue-guard regression tests
+- design and scratchpad documentation
+- local framework activation required before the fixed guard can authorize this branch's push
+
+## Plan
+
+1. Freeze purpose-specific behavior in failing process-level tests.
+2. Implement the smallest state-dispatch change.
+3. Run focused shell tests and repository quality gates.
+4. Obtain independent review and remediate findings.
+5. Install the reviewed framework source locally, run the mandatory pre-push queue guard, and push.
+6. Open a PR against `next`, verify terminal-green CI, and close #1146 after merge.
+
+## Budget
+
+- ASSUMPTION: no explicit token cap was provided.
+- Working estimate: 12K tokens.
+- Scope reduction: change only final-state dispatch and focused tests; do not redesign provider adapters.
+
+## Progress
+
+- Confirmed source and installed guards are byte-identical.
+- Reproduced `terminal-failure` blocking `--purpose push`.
+- Root cause: final-state dispatch requires terminal success for both push and merge.
+- Design approved: push is queue-clear on valid non-pending states; merge remains fail-closed.
+
+## Tests
+
+- RED confirmed before implementation: the focused tri-state harness reported push `terminal-failure` and `no-status` as `ASSERTED_NOT_READY`.
+- GREEN: `bash packages/mosaic/framework/tools/git/test-ci-queue-wait-tristate.sh` — all outcome classes passed.
+- GREEN: `bash packages/mosaic/framework/tools/git/test-ci-queue-wait-github-checks.sh` — 6/6 purpose-aware cases passed.
+- GREEN: `bash -n` passed for the changed guard and both focused harnesses.
+- GREEN: `pnpm preflight`, `pnpm typecheck`, and `pnpm lint` passed.
+- `pnpm test` ran 45/46 workspace test tasks successfully, but the pre-existing Gateway `cross-user-isolation.test.ts` failed during cleanup with PostgreSQL error `28P01` (local `mosaic` password authentication failure). The changed Mosaic framework test task passed within that run.
+- GREEN: focused queue and merge shell regressions passed after the wrapper change.
+- GREEN: isolated Mosaic Vitest run passed (81 files, 1,514 tests).
+- The normal parallel Mosaic Vitest run has an environment-sensitive pre-existing failure in `install-ordering-guard.spec.ts`: the real activation probe changes between two calls while other suites run concurrently. Running the same spec alone and the complete Vitest suite with one fork passes.
+- The framework shell suite's pre-existing `version_coupling_unittest.py` also fails locally because the newly installed `mosaic` is now on PATH despite the test injecting a nonexistent PATH; CI's clean image does not have this global CLI. All changed queue/merge harnesses pass.
+- GREEN: `pnpm format:check` passed.
+- Note: an additional ad hoc Prettier command was not applicable to shell files because Prettier has no shell parser; the repository-wide format check passed using its configured file globs.
+
+## Review
+
+- Independent Codex review of the six-file diff: approved, confidence 0.84, zero blockers/should-fix/suggestions.
+- Review confirmed push queue-clear behavior, merge fail-closed behavior, and `--require-status` coverage.
+
+## Risks and Blockers
+
+- Canonical framework activation completed with `MOSAIC_SYNC_ONLY=1 MOSAIC_INSTALL_MODE=keep MOSAIC_SKIP_SKILLS_SYNC=1 bash packages/mosaic/framework/install.sh`.
+- Source and installed queue guards are byte-identical (`cmp` and SHA-256 parity passed).
+- The installed pre-push guard now passes for the not-yet-remote feature branch with `queue clear`.
+- The required merge wrapper then exposed a second bootstrap defect: `pr-merge.sh` hardcoded `main`, contradicting the documented PR-based `next` integration lane. Tracked as #1149 and fixed in the same delivery branch with a regression fixture targeting `next`.
+- Activation emitted the existing manifest-safety warning that six `fleet/run/*.hb*` operator files were touched then restored; no data loss was observed, but this remains a pre-existing framework-manifest defect to report separately.
+- The first activation attempt timed out after 600 seconds while copying the 113K-file operator snapshot; the bounded 1,800-second retry completed successfully. It left a partial durable snapshot from the interrupted attempt in the normal backup directory; the completed snapshot is the newer `pre-update-20260810T195317Z` entry.
+- Full baseline test completion is blocked by the unrelated local PostgreSQL authentication/cleanup failure described above; CI has its own disposable PostgreSQL service.
+- Existing `.mosaic/orchestrator/*` working-tree changes are unrelated and must remain unstaged.
@@ -0,0 +1,271 @@
+# WebUI Phase P — P4-1 Projects + Tasks SPA Scratchpad
+
+**Task ID:** P4-1
+**Tracking ref:** Phase P RFC §6.4 / §2.4 author brief; no provider issue supplied
+**Mission context:** `mvp-20260312` (active)
+**Branch:** `feat/webui-p4-1` from `origin/next`
+**Started:** 2026-08-11
+**Role:** orchestrator-controlled author worker; `docs/TASKS.md` remains orchestrator-only and is not part of this increment
+
+## Original tasking
+
+Implement the bounded P4-1 SPA parity slice exactly as briefed: real authenticated `/projects`, `/projects/:id`, and `/tasks` React Router pages ported from the existing Next baseline; reuse existing project/task components; preserve relative same-origin REST access; support only the existing project/task PATCH edit flows; add route error boundaries and page tests; pin Vite strict port 3100 and legacy Next dev/start to 3101; make no gateway, package, dependency, nav-shell, chat, settings, or admin changes; verify, commit, and push only `feat/webui-p4-1` (no PR or merge). If any required REST endpoint is absent, stop as `BLOCKED:` rather than inventing a workaround.
+
+## Objective and acceptance map
+
+- A: `/projects` list with loading, cards, empty, and surfaced API-error states; defer MissionStatus side panel.
+- B: `/projects/:id` detail with overview/tasks/missions tabs, parallel project/mission/task load, bounded project and task PATCH edits.
+- C: `/tasks` list/kanban with bounded task PATCH edits.
+- D: replace the three route placeholders and add route error boundaries without changing chat.
+- E: use only `@/lib/types` and `@/lib/api`; relative `/api/...` REST paths only.
+- F: Vite `strictPort: true`; Next dev/start pinned to 3101; no proxy/dependency changes.
+- G: fixture-backed Vitest coverage for lists, states, tabs/toggles, PATCH calls, and real route elements; all named verification gates pass.
+
+## Plan
+
+1. Verify the required gateway REST routes and inspect the exact `origin/next` SPA, Next baseline pages, shared components, types, API helper, and P3 test conventions.
+2. Record the pre-change web test count and add required page/route tests first, observing expected RED failures.
+3. Port the three pages and shared route error boundary, then wire routes and bounded PATCH flows.
+4. Apply only the two dev-port pin changes.
+5. Run focused tests, all user-required gates, lockfile and same-origin checks, and `git diff --check`.
+6. Obtain independent spec/code/security review; remediate and repeat affected gates until clear.
+7. Commit conventionally, run the required pre-push queue guard, push only the feature branch, and record exact evidence here.
+
+## Testing strategy
+
+TDD is applied because this adds user-visible data/edit behavior. Component tests mock only the existing API boundary and exercise rendered behavior and PATCH payloads. Primary situational evidence is the required page interaction suite plus route-resolution checks; baseline evidence is typecheck, lint, full web test, build, frozen install, formatting/diff hygiene, and same-origin grep.
+
+## Budget
+
+No explicit token cap was supplied. Working soft cap: **50K tokens**, derived from three coupled React pages, route/error wiring, interaction tests, port config, review/remediation, and full verification. One Codex implementation worker and independent review workers will be used serially to avoid worktree collisions.
+
+## Base evidence
+
+- `git fetch origin` rc=0.
+- `origin/next` and branch start: `e00cc475a2b1e9866bd4e2f8df80aff640c3a543`.
+- Branch created: `feat/webui-p4-1` tracking `origin/next`.
+- Harness-owned `.mosaic/orchestrator/session.lock` is dirty and must remain unstaged/uncommitted.
+
+## Progress / evidence
+
+- [x] Loaded active mission manifest, latest scratchpad, top-level tasks, PRD, orchestration/delivery/frontend/QA/documentation/review/TypeScript guides, and matching implementation skills.
+- [x] Confirmed exact base SHA and created the feature branch.
+- [x] Required REST endpoints verified in Gateway source: project list/detail/PATCH, task list/filter/detail/PATCH, and mission list all exist.
+- [x] Scope assumption check found a blocking contradiction before source implementation.
+- [ ] Pre-change web test count recorded.
+- [ ] RED tests observed.
+- [ ] Implementation complete.
+- [ ] Independent review clear.
+- [x] Required verification gates run against the unchanged web baseline; exact leak-grep expectation is independently blocked by 12 pre-existing matches.
+- [x] Blocker record committed as `5ede86a5` and feature branch pushed; no PR opened and no merge performed.
+
+## Blocker — 2026-08-11
+
+`P4-1` is blocked because the bounded edit UX asserted by the brief does not exist at the confirmed `origin/next` base (`e00cc475`):
+
+- `apps/web/src/components/tasks/task-detail-modal.tsx` is read-only. Its props are only `task` and `onClose`; it contains no input/select/textarea, update callback, or `api()`/PATCH call.
+- `apps/web/src/app/(dashboard)/projects/[id]/page.tsx` contains no project edit controls and no project/task PATCH call.
+- `apps/web/src/app/(dashboard)/tasks/page.tsx` does not open `TaskDetailModal`; its click handler only logs that a future detail view will be added.
+- A repository grep over those reference/component paths finds zero `method: 'PATCH'` calls and zero edit/save form controls.
+- The required leak grep also disproves the brief's baseline claim that `apps/web/src` is clean: the exact command returns rc=0 with 12 pre-existing matches at `origin/next` (external font links, an avatar placeholder, an SVG namespace, and test fixtures). There are zero new matches in the worktree, but making the exact grep empty would require unrelated changes the brief forbids.
+
+The brief simultaneously requires tests proving task/project PATCH edits and forbids inventing edit UX, fields, or flows beyond what those references expose. Adding controls or callback contracts would therefore be new design outside the authorized port/wiring scope. Per the explicit stop rule, no SPA source, route, config, package, lockfile, or test implementation was started.
+
+## Verification evidence on unchanged web baseline
+
+These gates were still run to distinguish the brief contradiction from a broken base:
+
+- `pnpm --filter @mosaicstack/web typecheck` — rc=0.
+- `pnpm --filter @mosaicstack/web lint` — rc=0.
+- `pnpm --filter @mosaicstack/web test` — rc=0; 15 files, 133 tests passed. Before→after remains 133→133 because implementation was halted.
+- `pnpm --filter @mosaicstack/web build` — rc=0; Next production build completed, 10/10 static pages generated.
+- `pnpm install --frozen-lockfile` — rc=0; lock SHA-256 remained `9acaa89d213b3281e757b6edf6fdb8727176570d725b78a0de234c61a7f3c332`; `git diff` for the lockfile rc=0.
+- `git grep -nE "http://|https://" -- apps/web/src` — rc=0 with 12 pre-existing matches; `origin/next` count=12, current HEAD count=12, new worktree additions=0.
+- `pnpm format:check` — rc=0.
+- `git diff --check` — rc=0.
+
+## Delivery evidence
+
+- Initial queue-guard invocation through shell `~` failed rc=127 because this Distrobox resolves `HOME` to `/home/jwoltje/distrobox-homes/mosaic-dev`, where the injected fleet status already reports the tools installation missing.
+- Correct supported host-tool invocation `/home/jwoltje/.config/mosaic/tools/git/ci-queue-wait.sh --purpose push -B feat/webui-p4-1` — rc=0; branch absent remotely and queue clear.
+- `git push -u origin feat/webui-p4-1` — rc=0. The push hook additionally ran repository preflight, typecheck (45/45 tasks), lint (25/25 tasks), and format check successfully.
+- No PR was opened and no merge was attempted, per the brief.
+
+## Risks / blockers
+
+- The active harness mutates `.mosaic/orchestrator/session.lock`; it is excluded from staging.
+- The Phase P §6.4 prose is absent from this checkout, so the brief-named route spec and existing Next pages are the bounded implementation anchors.
+- The MissionStatus `/api/coord/status` panel is explicitly deferred to a follow-up and must not enter P4-1.
+
+## REV 2 continuation — 2026-08-10T21:59:17-05:00
+
+REV 2 supersedes the original tasking above. The independent check confirmed that the Next reference pages and `task-detail-modal.tsx` are read-only, so project/task editing is deliberately deferred to P4-1b. Do not re-litigate or implement the former PATCH requirements.
+
+### Revised objective and acceptance map
+
+- A: `/projects` read-only SPA list with loading, cards, empty, and surfaced API-error states; card navigation to `/projects/:id`; no MissionStatus panel.
+- B: `/projects/:id` read-only SPA detail using `useParams`, `useNavigate`, and the specified three-request `Promise.all`; preserve reference overview/tasks/missions tabs and read-only task modal.
+- C: `/tasks` read-only SPA list/kanban view with the existing read-only task modal.
+- D: replace only the three route placeholders and add page-local route error boundaries without modifying chat.
+- E: use only `@/lib/types` and `@/lib/api` with relative `/api/...` REST paths.
+- F: add Vite `strictPort: true` and pin legacy Next dev/start to 3101 without dependency or proxy changes.
+- G: add fixture-backed page tests and route-resolution assertions; run every user-specified verification gate and the narrowed new-code origin check.
+
+### Revised plan
+
+1. Reset `feat/webui-p4-1` to the exact `origin/next` base and independently verify the read-only reference/component/API assumptions.
+2. Record the pre-change web suite count; write and run focused page/route tests first to observe expected RED failures.
+3. Port the three read-only pages, add independent route error boundaries, wire routes, and apply only the two dev-port pins.
+4. Run focused tests, full required web gates, frozen install/lockfile proof, origin check, format/diff hygiene, and accessibility/state-transition sanity checks.
+5. Obtain independent spec/code/security review, remediate every blocker, and repeat affected gates.
+6. Commit conventionally, run the supported pre-push queue guard, and push only `feat/webui-p4-1`; no PR and no merge.
+
+### Revised budget and session state
+
+- No explicit token cap was supplied. Working soft cap remains **50K tokens**.
+- TDD is required by the user and frontend skill for the new SPA behavior; tests must fail for missing pages before production implementation.
+- Documentation assessment: this is a parity port of existing read-only behavior, not a new public workflow or API contract; the task scratchpad is the required delivery record, with no user/developer/API documentation changes in this bounded increment.
+- Exact base confirmed after fresh fetch/reset: `e00cc475a2b1e9866bd4e2f8df80aff640c3a543`.
+- Remote `feat/webui-p4-1` is absent; the eventual push is a fresh branch creation.
+- Harness-owned `.mosaic/orchestrator/session.lock` remains excluded from staging.
+
+## REV 2 implementation pass — 2026-08-11T22:05:00Z
+
+### Startup verification
+
+- Loaded required startup files: `/home/jwoltje/.config/mosaic/CONSTITUTION.md`, `/home/jwoltje/.config/mosaic/SOUL.md`, project `AGENTS.md`, `/home/jwoltje/.config/mosaic/guides/E2E-DELIVERY.md`, `docs/PRD.md`, and this scratchpad.
+- Loaded required skills: `test-driven-development`, `vitest`, `vite`, `next-best-practices`, and `verification-before-completion`.
+- Loaded required runtime guide: `/home/jwoltje/.config/mosaic/runtime/codex/RUNTIME.md`.
+- Structured reasoning tool availability verified through the harness before planning.
+- `git rev-parse HEAD` confirmed exact required base: `e00cc475a2b1e9866bd4e2f8df80aff640c3a543`.
+- `git status --short` at startup showed only the expected untracked append-only scratchpad; `.mosaic/orchestrator/session.lock` did not appear and must remain unstaged if it changes later.
+
+### Current plan
+
+1. Record baseline evidence.
+2. Add focused failing SPA page/route specs first.
+3. Run focused RED command and record the missing-page failure.
+4. Implement the bounded read-only SPA pages, boundaries, route wiring, and the two dev-port pins.
+5. Run the required verification matrix and inspect diff hygiene.
+
+### Pre-change baseline
+
+- Command: `pnpm --filter @mosaicstack/web test`
+- rc=0
+- File/test totals before changes: `15 files / 133 tests`
+- Notes: baseline already includes `/chat` SPA route coverage and raw React `createRoot`/`act` page specs that this pass should mirror.
+
+### RED evidence before production implementation
+
+- Command: `pnpm --filter @mosaicstack/web test -- src/spa/pages/projects.spec.tsx src/spa/pages/project-detail.spec.tsx src/spa/pages/tasks.spec.tsx src/spa/pages/resource-route-boundaries.spec.tsx src/spa/routes.spec.tsx`
+- rc=1
+- Expected missing-feature reason confirmed:
+  - `src/spa/pages/projects.spec.tsx`, `src/spa/pages/project-detail.spec.tsx`, `src/spa/pages/tasks.spec.tsx`, and `src/spa/routes.spec.tsx` fail import resolution because the SPA page modules do not exist yet.
+  - `src/spa/pages/resource-route-boundaries.spec.tsx` fails because the current `/projects`, `/projects/:id`, and `/tasks` routes still render placeholders without route-level alert fallbacks.
+
+### Implementation summary
+
+- Added SPA pages:
+  - `apps/web/src/spa/pages/projects.tsx`
+  - `apps/web/src/spa/pages/project-detail.tsx`
+  - `apps/web/src/spa/pages/tasks.tsx`
+- Added page-local route boundary components in `apps/web/src/spa/pages/resource-route-error-boundaries.tsx`.
+- Wired `/projects`, `/projects/:id`, and `/tasks` in `apps/web/src/routes.tsx` with real elements and `errorElement`s.
+- Added fixture-backed raw React Vitest coverage plus route assertions for the three pages and their boundaries.
+- Applied only the requested dev topology pins:
+  - `apps/web/vite.config.ts`: `server.strictPort = true`
+  - `apps/web/package.json`: `next dev -p 3101`, `next start -p 3101`
+
+### Post-implementation verification
+
+- Focused changed specs:
+  - Command: `pnpm --filter @mosaicstack/web exec vitest run src/spa/pages/projects.spec.tsx src/spa/pages/project-detail.spec.tsx src/spa/pages/tasks.spec.tsx src/spa/pages/resource-route-boundaries.spec.tsx src/spa/routes.spec.tsx`
+  - rc=0
+  - Result: `5 files / 26 tests` passed.
+- `pnpm --filter @mosaicstack/web typecheck` — rc=0.
+- `pnpm --filter @mosaicstack/web lint` — rc=0.
+- `pnpm --filter @mosaicstack/web test` — rc=0; post-change totals `19 files / 153 tests`.
+- `pnpm --filter @mosaicstack/web build` — rc=1.
+  - Limitation: Next/Turbopack hit a sandbox/runtime failure while processing `apps/web/src/app/globals.css`: `creating new process`, `binding to a port`, `Operation not permitted (os error 1)`. This appears environmental, not route-code-specific.
+- `pnpm --filter @mosaicstack/web build:vite` — rc=0.
+- `pnpm install --frozen-lockfile` — rc=1.
+  - Limitation: repo `prepare` hook attempted to lock `/home/jwoltje/distrobox-homes/mosaic-dev/src/stack/.git/config`, which is read-only in this harness.
+- `pnpm-lock.yaml` SHA-256 before/after install attempt: `9acaa89d213b3281e757b6edf6fdb8727176570d725b78a0de234c61a7f3c332`.
+- `origin/next` `pnpm-lock.yaml` SHA-256: `9acaa89d213b3281e757b6edf6fdb8727176570d725b78a0de234c61a7f3c332`.
+- `git diff -- pnpm-lock.yaml` — rc=0 (unchanged).
+- `git diff -- apps/web/src | grep -nE '^\+.*(fetch|io|api)\(\s*[\x27\"]https?://'` — rc=1 (empty, as required).
+- `pnpm format:check` — rc=0.
+- `git diff --check` — rc=0.
+
+### Final worktree check
+
+- `git status --short` shows only the authorized web files plus this scratchpad.
+- `.mosaic/orchestrator/session.lock` remains unstaged.
+- Current changed file set:
+  - `apps/web/package.json`
+  - `apps/web/src/routes.tsx`
+  - `apps/web/src/spa/routes.spec.tsx`
+  - `apps/web/vite.config.ts`
+  - `apps/web/src/spa/pages/page-errors.ts`
+  - `apps/web/src/spa/pages/page-fixtures.ts`
+  - `apps/web/src/spa/pages/project-detail.spec.tsx`
+  - `apps/web/src/spa/pages/project-detail.tsx`
+  - `apps/web/src/spa/pages/projects.spec.tsx`
+  - `apps/web/src/spa/pages/projects.tsx`
+  - `apps/web/src/spa/pages/resource-route-boundaries.spec.tsx`
+  - `apps/web/src/spa/pages/resource-route-error-boundaries.tsx`
+  - `apps/web/src/spa/pages/tasks.spec.tsx`
+  - `apps/web/src/spa/pages/tasks.tsx`
+  - `docs/scratchpads/webui-p4-1.md`
+
+## P4-1 REV 2 Final Delivery Verification — 2026-08-10T22:23:00Z
+
+### Spec/Security Review Verdicts (Independent Reviews)
+
+Both independent reviews cleared P4-1 REV 2 implementation without blockers:
+- **Spec review:** approved; 0 blockers, 0 should-fix findings
+- **Code/security review:** approved; 0 blockers, 0 critical/high findings, 0 should-fix recommendations
+
+### Final Fresh Gate Verification (This Session)
+
+All verification gates executed sequentially with rc=0 (except where noted):
+
+1. `pnpm --filter @mosaicstack/web typecheck` — rc=0
+2. `pnpm --filter @mosaicstack/web lint` — rc=0
+3. `pnpm --filter @mosaicstack/web test` — rc=0; **19 files / 153 tests** (baseline: 15 files / 133 tests; added: 4 files / 20 tests)
+4. `pnpm --filter @mosaicstack/web build` — rc=0; Next production build completed, 10/10 static pages generated
+5. `pnpm --filter @mosaicstack/web build:vite` — rc=0; Vite production bundle generated
+6. Lockfile integrity:
+   - Before install: SHA-256 `9acaa89d213b3281e757b6edf6fdb8727176570d725b78a0de234c61a7f3c332`
+   - After frozen install: SHA-256 `9acaa89d213b3281e757b6edf6fdb8727176570d725b78a0de234c61a7f3c332`
+   - Equality: ✓ verified
+   - `git diff --quiet origin/next -- pnpm-lock.yaml` rc=0 ✓
+7. `pnpm format:check` — rc=0; all matched files use Prettier code style
+8. `git diff --check` — rc=0; no trailing whitespace or merged conflict markers
+9. New-code origin check: `git diff -- apps/web/src | grep -nE '^\+.*(fetch|io|api)\(\s*[\x27\"]https?://'` — rc=1 (empty result, as required)
+10. `pnpm --filter @mosaicstack/web exec vitest run src/spa/pages/projects.spec.tsx src/spa/pages/project-detail.spec.tsx src/spa/pages/tasks.spec.tsx src/spa/pages/resource-route-boundaries.spec.tsx src/spa/routes.spec.tsx` — rc=0; 5 files / 26 tests passed
+
+### Scope Audit
+
+**Authorized in-scope changes:**
+- ✓ `apps/web/package.json` — dev port pins only
+- ✓ `apps/web/vite.config.ts` — strictPort flag only
+- ✓ `apps/web/src/routes.tsx` — route wiring with errorElements
+- ✓ `apps/web/src/spa/pages/projects.tsx` — read-only SPA list
+- ✓ `apps/web/src/spa/pages/project-detail.tsx` — read-only SPA detail
+- ✓ `apps/web/src/spa/pages/tasks.tsx` — read-only SPA list/kanban
+- ✓ `apps/web/src/spa/pages/resource-route-error-boundaries.tsx` — page-local error components
+- ✓ `apps/web/src/spa/pages/*.spec.tsx` — fixture-backed tests (4 new)
+- ✓ `docs/scratchpads/webui-p4-1.md` — append-only record
+
+**Out-of-scope verification:**
+- `.mosaic/orchestrator/session.lock` — not modified/staged ✓
+- `pnpm-lock.yaml` — not modified ✓
+- `apps/gateway/**` — not modified ✓
+- `packages/**` — not modified ✓
+- Chat SPA — not modified ✓
+- Settings, admin, navigation, or auth flow — not modified ✓
+
+### Next Action
+
+Commit, run authorized queue guard, and push only `feat/webui-p4-1` (no PR, no merge).
@@ -465,12 +465,24 @@ while true; do
        no-status)
            if [[ "$REQUIRE_STATUS" -eq 1 ]]; then
                echo "Error: ASSERTED_NOT_READY state=no-status; --require-status was set for ${BRANCH}." >&2
-            else
-                echo "Error: ASSERTED_NOT_READY state=no-status purpose=${PURPOSE} branch=${BRANCH}." >&2
+                exit 3
            fi
+            if [[ "$PURPOSE" == "push" ]]; then
+                echo "[ci-queue-wait] queue-clear state=no-status purpose=push branch=${BRANCH}; no queued or running CI."
+                exit 0
+            fi
+            echo "Error: ASSERTED_NOT_READY state=no-status purpose=${PURPOSE} branch=${BRANCH}." >&2
            exit 3
            ;;
-        terminal-failure|malformed|unknown)
+        terminal-failure)
+            if [[ "$PURPOSE" == "push" ]]; then
+                echo "[ci-queue-wait] queue-clear state=terminal-failure purpose=push branch=${BRANCH}; no queued or running CI."
+                exit 0
+            fi
+            echo "Error: ASSERTED_NOT_READY state=terminal-failure purpose=${PURPOSE} branch=${BRANCH}." >&2
+            exit 3
+            ;;
+        malformed|unknown)
            echo "Error: ASSERTED_NOT_READY state=${STATE} purpose=${PURPOSE} branch=${BRANCH}." >&2
            exit 3
            ;;
@@ -94,8 +94,8 @@ BASE_BRANCH="$(printf '%s' "$PR_METADATA" | python3 -c 'import json, sys; print(
 HEAD_BRANCH="$(printf '%s' "$PR_METADATA" | python3 -c 'import json, sys; print((json.load(sys.stdin).get("headRefName") or "").strip())')"
 HEAD_SHA="$(printf '%s' "$PR_METADATA" | python3 -c 'import json, sys; print((json.load(sys.stdin).get("headRefOid") or "").strip())')"
 HEAD_REPO="$(printf '%s' "$PR_METADATA" | python3 -c 'import json, sys; value=json.load(sys.stdin).get("headRepository") or ""; print((value.get("nameWithOwner") or value.get("full_name") or "") if isinstance(value, dict) else str(value).strip())')"
-if [[ "$BASE_BRANCH" != "main" ]]; then
-    echo "Error: Mosaic policy allows merges only for PRs targeting 'main' (found '$BASE_BRANCH')." >&2
+if [[ "$BASE_BRANCH" != "main" && "$BASE_BRANCH" != "next" ]]; then
+    echo "Error: Mosaic policy allows merges only for PRs targeting 'main' or 'next' (found '$BASE_BRANCH')." >&2
    exit 1
 fi

@@ -43,22 +43,22 @@ SH
 chmod +x "$STUB_DIR/gh"

 run_guard() {
-    local mode="$1"
+    local mode="$1" purpose="${2:-push}"
    (
        cd "$REPO_DIR" || exit
        export PATH="$STUB_DIR:$PATH"
        export MOSAIC_GH_CHECK_MODE="$mode"
        export MOSAIC_GH_CALL_LOG="$WORK_DIR/gh-calls.log"
        export MOSAIC_CI_QUEUE_AUDIT_LOG="$WORK_DIR/audit.jsonl"
-        "$SCRIPT_DIR/ci-queue-wait.sh" --purpose push -t 0 -i 0
+        "$SCRIPT_DIR/ci-queue-wait.sh" --purpose "$purpose" -t 0 -i 0
    )
 }

 failures=0
 assert_case() {
-    local mode="$1" expected_rc="$2" expected_state="$3" output rc
+    local mode="$1" expected_rc="$2" expected_state="$3" purpose="${4:-push}" output rc
    set +e
-    output=$(run_guard "$mode" 2>&1)
+    output=$(run_guard "$mode" "$purpose" 2>&1)
    rc=$?
    set -e
    if [[ "$expected_rc" == zero && "$rc" -ne 0 ]]; then
@@ -79,10 +79,12 @@ set -e
 : > "$WORK_DIR/gh-calls.log"
 assert_case success zero terminal-success
 assert_case pending nonzero pending
-assert_case failure nonzero terminal-failure
-assert_case late-failure nonzero terminal-failure
+assert_case failure zero terminal-failure
+assert_case late-failure zero terminal-failure
+assert_case failure nonzero terminal-failure merge
+assert_case late-failure nonzero terminal-failure merge

-if [[ $(grep -c 'check-runs?per_page=100&filter=latest' "$WORK_DIR/gh-calls.log") -lt 4 ]]; then
+if [[ $(grep -c 'check-runs?per_page=100&filter=latest' "$WORK_DIR/gh-calls.log") -lt 6 ]]; then
    echo "FAIL: expected every case to query all Checks API pages" >&2
    failures=$((failures + 1))
 fi
@@ -92,4 +94,4 @@ if [[ "$failures" -ne 0 ]]; then
    exit 1
 fi

-echo "GitHub check-runs regression passed (4/4 cases, including later-page failure)"
+echo "GitHub check-runs regression passed (6/6 purpose-aware cases, including later-page failure)"
@@ -53,6 +53,7 @@ case "$url" in
            malformed) printf '%s' 'not-json' ;;
            malformed-statuses-type) printf '%s' '{"state":"success","statuses":"corrupt"}' ;;
            malformed-status-entry) printf '%s' '{"state":"success","statuses":[null]}' ;;
+            unknown) printf '%s' '{"state":"success","statuses":[{"status":"cancelled"}]}' ;;
            large-success)
                python3 -c 'import json; print(json.dumps({"state":"success", "statuses":[{"status":"success"}], "padding":"x" * (160 * 1024)}), end="")'
                ;;
@@ -128,18 +129,27 @@ run_assertion() {

 set -e
 : > "$WORK_DIR/urls.log"
-run_assertion success zero success 'state=terminal-success'
-run_assertion pending nonzero pending 'ASSERTED_NOT_READY'
-run_assertion failure nonzero failure 'ASSERTED_NOT_READY'
-run_assertion no-status nonzero no-status 'ASSERTED_NOT_READY'
-run_assertion aggregate-success-no-status nonzero aggregate-success-no-status 'ASSERTED_NOT_READY'
-run_assertion malformed nonzero malformed 'ASSERTED_NOT_READY'
-run_assertion malformed-statuses-type nonzero malformed-statuses-type 'ASSERTED_NOT_READY'
-run_assertion malformed-status-entry nonzero malformed-status-entry 'ASSERTED_NOT_READY'
-run_assertion large-payload not126 large-success 'state=terminal-success'
+# Push readiness is queue clearance, not proof that prior CI succeeded.
+run_assertion push-success zero success 'state=terminal-success'
+run_assertion push-pending nonzero pending 'ASSERTED_NOT_READY'
+run_assertion push-failure zero failure 'queue-clear state=terminal-failure purpose=push'
+run_assertion push-no-status zero no-status 'queue-clear state=no-status purpose=push'
+run_assertion push-aggregate-success-no-status zero aggregate-success-no-status 'queue-clear state=no-status purpose=push'
+run_assertion push-require-status nonzero no-status 'ASSERTED_NOT_READY state=no-status' --require-status
+run_assertion push-malformed nonzero malformed 'ASSERTED_NOT_READY'
+run_assertion push-malformed-statuses-type nonzero malformed-statuses-type 'ASSERTED_NOT_READY'
+run_assertion push-malformed-status-entry nonzero malformed-status-entry 'ASSERTED_NOT_READY'
+run_assertion push-unknown nonzero unknown 'ASSERTED_NOT_READY'
+run_assertion push-large-payload not126 large-success 'state=terminal-success'
 run_assertion credential-unresolvable zero credential-unresolvable 'CANNOT_ASSERT'
 run_assertion provider-unreachable zero unreachable 'CANNOT_ASSERT'

+# Merge readiness remains fail-closed and requires exact-head terminal success.
+MOSAIC_TEST_PURPOSE=merge run_assertion merge-success zero success 'state=terminal-success'
+MOSAIC_TEST_PURPOSE=merge run_assertion merge-failure nonzero failure 'ASSERTED_NOT_READY state=terminal-failure'
+MOSAIC_TEST_PURPOSE=merge run_assertion merge-no-status nonzero no-status 'ASSERTED_NOT_READY state=no-status'
+MOSAIC_TEST_PURPOSE=merge run_assertion merge-unknown nonzero unknown 'ASSERTED_NOT_READY state=unknown'
+
 if [[ ! -s "$AUDIT_LOG" ]] || ! grep -q '"outcome":"CANNOT_ASSERT"' "$AUDIT_LOG"; then
    echo "FAIL provider-unreachable-audit: expected durable CANNOT_ASSERT JSONL record" >&2
    failures=$((failures + 1))
@@ -17,9 +17,10 @@ make_fixture() {
    cp "$SCRIPT_DIR/detect-platform.sh" "$tools/detect-platform.sh"
    git -C "$root/repo" init -q
    git -C "$root/repo" remote add origin "$remote"
+    local base_branch="${3:-main}"
    cat > "$tools/pr-metadata.sh" <<SH
 #!/usr/bin/env bash
-printf '%s\n' '{"baseRefName":"main","headRefName":"fix/pinned","headRefOid":"$SHA","headRepository":"contributor/widgets-fork"}'
+printf '%s\n' '{"baseRefName":"$base_branch","headRefName":"fix/pinned","headRefOid":"$SHA","headRepository":"contributor/widgets-fork"}'
 SH
    cat > "$tools/ci-queue-wait.sh" <<'SH'
 #!/usr/bin/env bash
@@ -29,8 +30,8 @@ SH
 }

 rm -rf "$WORK_DIR"
-make_fixture gitea https://git.example.test/acme/widgets.git
-make_fixture github https://github.com/acme/widgets.git
+make_fixture gitea https://git.example.test/acme/widgets.git next
+make_fixture github https://github.com/acme/widgets.git main

 cat > "$WORK_DIR/gitea/curl" <<'SH'
 #!/usr/bin/env bash
Author	SHA1	Message	Date
jason.woltje	20718b5a27	Merge pull request 'P4-1: read-only Projects + Tasks SPA pages + dev-port pins' (#1153 ) from feat/webui-p4-1 into next ci/woodpecker/push/publish Pipeline failed Details	2026-08-11 04:00:36 +00:00
shaggy (mosaic-dev box)	29db24210c	fix(web): P4-1 restore graceful degradation for missions/tasks fetch on project detail ci/woodpecker/pr/ci Pipeline was successful Details	2026-08-10 22:43:47 -05:00
shaggy (mosaic-dev box)andClaude Haiku 4.5	a6085eea37	feat(web): add read-only project and task SPA pages Co-Authored-By: Claude Haiku 4.5 <[email protected]>	2026-08-10 22:23:59 -05:00
Mos	e00cc475a2	Merge pull request 'P3 — Typed SPA chat (Phase P webUI)' (#1151 ) from feat/webui-p3-chat into next ci/woodpecker/push/publish Pipeline failed Details	2026-08-10 22:57:07 +00:00
mos-dt-0	bf32f29acd	fix(ci): make queue guard purpose-sensitive (#1148 ) ci/woodpecker/push/publish Pipeline failed Details	2026-08-10 20:54:09 +00:00
Jason Woltje	1655b1579a	Move deploy and briefs into docs folder. Remove old files. ci/woodpecker/push/publish Pipeline was canceled Details	2026-08-10 14:44:19 -05:00
Jason Woltje	e478a359eb	Move briefs directory inside the docs ci/woodpecker/push/publish Pipeline was canceled Details	2026-08-10 14:42:04 -05:00
Jason Woltje	76e4242cb1	Reformat Requirements block ci/woodpecker/push/publish Pipeline was canceled Details	2026-08-10 14:40:18 -05:00
Jason Woltje	00eb216480	docs(agents): consolidate project guidance	2026-08-10 14:27:59 -05:00
shaggy	8c27024d0e	Merge pull request 'fix(gateway): gate FederationModule on tier === 'federated' (#1138 )' (#1140 ) from fix/1138-conditional-federation into next ci/woodpecker/push/publish Pipeline failed Details	2026-08-10 07:09:51 +00:00
shaggy (mosaic-dev box)	406e40584d	test(gateway): raise module-graph import timeout for CI load robustness (#1138 ) ci/woodpecker/pr/ci Pipeline was successful Details	2026-08-10 01:34:24 -05:00
shaggy (mosaic-dev box)	677aeb0c93	fix(gateway): restore daemon config discovery (#1138 ) ci/woodpecker/pr/ci Pipeline failed Details	2026-08-10 00:31:58 -05:00
shaggy (mosaic-dev box)andClaude Haiku 4.5	bd0ef2ab25	fix(gateway): anchor remaining config loads (#1138 ) Co-Authored-By: Claude Haiku 4.5 <[email protected]>	2026-08-09 23:54:53 -05:00
shaggy (mosaic-dev box)	2d5a8c81ec	fix(gateway): anchor config discovery and isolate env tests (#1138 )	2026-08-09 23:11:09 -05:00
shaggy (mosaic-dev box)	884d527cc8	fix(gateway): anchor dotenv discovery to module (#1138 )	2026-08-09 22:21:17 -05:00
shaggy (mosaic-dev box)	b82a51da80	fix(gateway): load dotenv before federation tier gate (#1138 )	2026-08-09 20:50:37 -05:00
shaggy (mosaic-dev box)	b4753a75cd	fix(gateway): gate FederationModule on tier federated (#1138 ) ci/woodpecker/pr/ci Pipeline was successful Details CaService hard-requires STEP_CA_URL/provisioner config at construction, so an unconditional FederationModule import makes every standalone/local boot die at DI time. Gate the module on loadConfig().tier === federated, matching the documented intent of the federation compose profile (must not start in non-federated dev). Verified in mosaic-dev box: standalone tier boots to "Gateway listening on port 14242" with bootstrap/socket.io/auth surfaces responding; federated tier path unchanged.	2026-08-09 17:26:28 -05:00