fix(S5-02): token cost ledger live activation — 3 root-cause fixes + handoff docs

.github/workflows/ci.yml

@@ -82,10 +82,15 @@ jobs:
       - name: Mission Control Build
         run: npm run build
         working-directory: apps/mission-control
+        env:
+          NEXT_BUILD_TARGET: docker
 
       - name: Mission Control Performance Budget (Lighthouse CI)
         run: npm run test:perf
         working-directory: apps/mission-control
+        env:
+          MISSION_CONTROL_BYPASS_AUTH: "true"
+          NEXT_BUILD_TARGET: docker
 
       - name: Install Playwright Browser (Chromium)
         run: npx playwright install --with-deps chromium
@@ -94,6 +99,9 @@ jobs:
       - name: Mission Control E2E Tests
         run: npm run test:e2e
         working-directory: apps/mission-control
+        env:
+          MISSION_CONTROL_BYPASS_AUTH: "true"
+          NEXT_BUILD_TARGET: docker
 
       - name: Test with Coverage
         run: |

apps/mission-control/app/(shell)/builder/page.tsx

@@ -159,7 +159,7 @@ export default function BuilderPage() {
           test_plan: preview.test_plan,
         },
       });
-      router.push(`/missions/${mission.mission_id}`);
+      router.push(`/missions/detail?id=${mission.mission_id}`);
     } catch (launchError) {
       if (launchError instanceof Error && /approval/i.test(launchError.message)) {
         setApproval(null);

apps/mission-control/app/(shell)/chat/page.tsx

@@ -366,7 +366,7 @@ export default function ChatPage() {
           },
         },
       });
-      router.push(`/missions/${mission.mission_id}`);
+      router.push(`/missions/detail?id=${mission.mission_id}`);
     } catch (launchError) {
       setError(launchError instanceof Error ? launchError.message : "Mission launch failed.");
     } finally {

apps/mission-control/app/(shell)/missions/history/page.tsx

@@ -248,7 +248,7 @@ export default function MissionHistoryPage() {
                         <td className="muted">{formatDateTime(m.created_at)}</td>
                         <td>
                           <Link
-                            href={`/missions/${m.mission_id}`}
+                            href={`/missions/detail?id=${m.mission_id}`}
                             className="secondary-button shell-link-button"
                           >
                             View Live

apps/mission-control/app/(shell)/missions/page.tsx

@@ -494,7 +494,7 @@ export default function MissionsPage() {
                         Duplicate
                       </button>
                       <Link
-                        href={`/missions/${item.mission_id}`}
+                        href={`/missions/detail?id=${item.mission_id}`}
                         className="secondary-button shell-link-button mission-live-link"
                       >
                         View Live

apps/mission-control/app/(shell)/repo/page.tsx

@@ -410,7 +410,7 @@ export default function RepoImportPage() {
             .map((file) => `${file.overlay_action}:${file.path}`),
         },
       });
-      router.push(`/missions/${mission.mission_id}`);
+      router.push(`/missions/detail?id=${mission.mission_id}`);
     } catch (launchError) {
       if (launchError instanceof Error && /approval/i.test(launchError.message)) {
         setApprovalReceipt(null);

apps/mission-control/app/components/command-palette.tsx

@@ -207,7 +207,7 @@ export function CommandPalette() {
           label: name || m.mission_id.slice(0, 12) + "…",
           sublabel: `${humanizeState(m.state)} · ${formatDateTime(m.created_at)}`,
           icon: "◎",
-          href: `/missions/${m.mission_id}`,
+          href: `/missions/detail?id=${m.mission_id}`,
         };
       });
 

apps/mission-control/app/components/global-search.tsx

@@ -74,7 +74,7 @@ export function GlobalSearch() {
           id: m.mission_id,
           label: name || m.mission_id.slice(0, 12) + "…",
           sublabel: `${humanizeState(m.state)} · ${formatDateTime(m.created_at)}`,
-          href: `/missions/${m.mission_id}`,
+          href: `/missions/detail?id=${m.mission_id}`,
           group: "Missions" as const,
         };
       });

apps/mission-control/app/components/panel.tsx

@@ -1,15 +1,16 @@
 import type { ReactNode } from "react";
 
 type PanelProps = {
+  id?: string;
   title?: string;
   actions?: ReactNode;
   children: ReactNode;
   className?: string;
 };
 
-export function Panel({ title, actions, children, className }: PanelProps) {
+export function Panel({ id, title, actions, children, className }: PanelProps) {
   return (
-    <section className={`panel ${className ?? ""}`.trim()} aria-labelledby={title ? `panel-title-${title.replace(/\s+/g, "-").toLowerCase()}` : undefined}>
+    <section id={id} className={`panel ${className ?? ""}`.trim()} aria-labelledby={title ? `panel-title-${title.replace(/\s+/g, "-").toLowerCase()}` : undefined}>
       {(title || actions) && (
         <div className="panel-title-row">
           {title ? <h2 id={`panel-title-${title.replace(/\s+/g, "-").toLowerCase()}`}>{title}</h2> : <span />}

apps/mission-control/app/globals.css

@@ -143,7 +143,9 @@ a {
   font-weight: 700;
   letter-spacing: 0.1em;
   text-transform: uppercase;
-  color: var(--ink-dim);
+  /* SLATE-400 (--ink-muted) reaches ~5.6:1 on the slate-800 sidebar;
+     SLATE-500 (--ink-dim) was only 3.07:1, failing WCAG AA color-contrast. */
+  color: var(--ink-muted);
   user-select: none;
 }
 
@@ -465,7 +467,9 @@ button:disabled {
   text-decoration: none;
   color: #fff;
   border: 1px solid transparent;
-  background: var(--danger);
+  /* RED-600 (#dc2626) gives white text ~4.85:1; RED-500 (--danger #ef4444)
+     was only 3.76:1, failing WCAG AA. --danger stays for text/borders elsewhere. */
+  background: #dc2626;
 }
 
 .danger-button:hover:not(:disabled) {
@@ -1170,7 +1174,7 @@ dd {
   border: none;
   border-radius: 4px;
   background: transparent;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   font-size: 0.8rem;
   cursor: pointer;
   transition: color 120ms, background 120ms;
@@ -1192,7 +1196,7 @@ dd {
 /* ── Refresh timestamp label ─────────────────────────────────── */
 .last-refreshed {
   font-size: var(--text-xs, 0.6875rem);
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   font-weight: 400;
   letter-spacing: 0;
   text-transform: none;
@@ -1256,7 +1260,7 @@ dd {
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.1em;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
 }
 
 .chat-history-list {
@@ -1318,7 +1322,7 @@ dd {
 
 .char-counter {
   font-size: var(--text-xs, 0.6875rem);
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   font-variant-numeric: tabular-nums;
 }
 
@@ -1375,7 +1379,9 @@ dd {
 }
 
 .mission-tab.active {
-  color: var(--accent);
+  /* VIOLET-400 (#a78bfa) reaches ~6.6:1 on the slate-900 panel; VIOLET-500
+     (--accent #8b5cf6) was only 4.21:1, failing WCAG AA for text. */
+  color: #a78bfa;
   border-bottom-color: var(--accent);
 }
 
@@ -2278,7 +2284,7 @@ dd {
 .notif-alert-rec {
   margin: 5px 0 0;
   font-size: 0.78rem;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   font-style: italic;
 }
 
@@ -2312,7 +2318,7 @@ dd {
 }
 
 .global-search-input::placeholder {
-  color: var(--ink-dim);
+  color: var(--ink-muted);
 }
 
 .global-search-dropdown {
@@ -2480,7 +2486,7 @@ dd {
 
 .audit-sev-marker.sev-critical { color: #fca5a5; }
 .audit-sev-marker.sev-warning  { color: var(--warning); }
-.audit-sev-marker.sev-info     { color: var(--ink-dim); }
+.audit-sev-marker.sev-info     { color: var(--ink-muted); }
 
 .audit-entry-title {
   font-size: 0.88rem;
@@ -2701,7 +2707,7 @@ dd {
   border-radius: 4px;
   padding: 2px 6px;
   font-family: var(--font-mono), monospace;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   flex-shrink: 0;
 }
 
@@ -2758,7 +2764,7 @@ dd {
 }
 
 .cmd-palette-input::placeholder {
-  color: var(--ink-dim);
+  color: var(--ink-muted);
 }
 
 .cmd-palette-clear {
@@ -2795,7 +2801,7 @@ dd {
   font-weight: 700;
   letter-spacing: 0.1em;
   text-transform: uppercase;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   padding: 10px 16px 4px;
 }
 
@@ -2864,7 +2870,7 @@ dd {
 
 .cmd-item-shortcut {
   font-size: 0.68rem;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   background: var(--bg-surface);
   border: 1px solid var(--border);
   border-radius: 4px;
@@ -2887,7 +2893,7 @@ dd {
   display: flex;
   gap: 20px;
   font-size: 0.7rem;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   flex-shrink: 0;
 }
 
@@ -2918,7 +2924,7 @@ dd {
 
 .mission-name-edit-btn {
   font-size: 0.75rem;
-  color: var(--ink-dim);
+  color: var(--ink-muted);
   cursor: pointer;
   background: none;
   border: none;

apps/mission-control/app/lib/api-client.ts

@@ -92,6 +92,7 @@ export async function fetchJson<T>(input: string, init?: RequestInit & { timeout
   try {
     const response = await fetch(input, {
       ...requestInit,
+      cache: "no-store",
       signal: requestInit.signal ?? signal,
       headers: {
         "Content-Type": "application/json",
@@ -190,7 +191,7 @@ export async function getMissionEvents(missionId: string, limit: number): Promis
 }
 
 export async function getMissionChainTrace(missionId: string): Promise<MissionChainTrace> {
-  return fetchJson<MissionChainTrace>(missionApiUrl(`/v1/missions/${missionId}/chain-trace`));
+  return fetchJson<MissionChainTrace>(missionApiUrl(`/v1/missions/${missionId}/chain-trace`), { method: "GET" });
 }
 
 export async function createMission(payload: any): Promise<MissionRecord> {
@@ -225,7 +226,10 @@ export async function getGatewayReadyState(): Promise<{ ready: boolean; detail?:
     await fetchJson(missionApiUrl("/readyz"));
     return { ready: true };
   } catch (error: any) {
-    return { ready: false, detail: error.message };
+    if (error instanceof ApiError) {
+      return { ready: false, detail: error.message };
+    }
+    return { ready: false, detail: "Readiness check failed." };
   }
 }
 
@@ -297,11 +301,19 @@ export async function createPmFeatureContract(payload: any): Promise<PmFeatureCo
   });
 }
 
-export async function createBuilderWorkspaceReview(payload: any): Promise<BuilderPreviewResponse> {
+export async function createBuilderWorkspaceReview(payload: {
+  request: string;
+  constraints?: string[];
+  viewMode?: string;
+}): Promise<BuilderPreviewResponse> {
   return fetchJson<BuilderPreviewResponse>("/api/builder/review", {
     method: "POST",
     timeoutMs: 30_000,
-    body: JSON.stringify(payload),
+    body: JSON.stringify({
+      request: payload.request,
+      constraints: payload.constraints,
+      view_mode: payload.viewMode,
+    }),
   });
 }
 
@@ -321,11 +333,21 @@ export async function approveReviewArtifact(payload: any): Promise<ReviewApprova
   });
 }
 
-export async function verifyReviewApproval(payload: any): Promise<ReviewApprovalVerificationResult> {
+export async function verifyReviewApproval(payload: {
+  scope: string;
+  approvalId: string;
+  fingerprint: string;
+  receiptDigest: string;
+}): Promise<ReviewApprovalVerificationResult> {
   return fetchJson<ReviewApprovalVerificationResult>("/api/review/verify", {
     method: "POST",
     timeoutMs: 30_000,
-    body: JSON.stringify(payload),
+    body: JSON.stringify({
+      scope: payload.scope,
+      approval_id: payload.approvalId,
+      fingerprint: payload.fingerprint,
+      receipt_digest: payload.receiptDigest,
+    }),
   });
 }
 

apps/mission-control/app/lib/server/operator-session.ts

@@ -135,12 +135,12 @@ export function getMissionControlAdminKey(): string {
 }
 
 /**
- * Returns true when OPERATOR_SESSION_BYPASS=true is set in the environment.
+ * Returns true when MISSION_CONTROL_BYPASS_AUTH=true is set in the environment.
  * Intended for local development where no admin key setup has been completed.
  * Never set this in production.
  */
 export function isOperatorSessionBypassed(): boolean {
-  return true;
+  return process.env.MISSION_CONTROL_BYPASS_AUTH === "true";
 }
 
 export function getOperatorSessionSecret(): string {

apps/mission-control/e2e/mission-build-new-complete.spec.ts

@@ -143,7 +143,7 @@ test("mission-build-new-complete E2E flow", async ({ page }) => {
   await page.getByRole("link", { name: "View Live" }).first().click();
 
   // Detail verification
-  await expect(page).toHaveURL(new RegExp(`/missions/${missionId}`));
+  await expect(page).toHaveURL(new RegExp(`/missions/detail\\?id=${missionId}`));
   await expect(page.getByText("Delivered")).toBeVisible();
   await expect(page.getByText("Smelt Stream Module")).toBeVisible();
   await expect(page.getByRole("link", { name: "Download Generated Code" }).first()).toBeVisible();