Merge pull request #2562 from Molecule-AI/staging

staging → main: auto-promote bb63e60

.gitattributes

@@ -13,3 +13,11 @@ workspace/entrypoint.sh text eol=lf
 # but keep LF for consistency across platforms.
 Dockerfile text eol=lf
 *.dockerfile text eol=lf
+
+# Snapshot golden files — workspace/tests/snapshots/*.txt is consumed by
+# byte-exact comparisons in test_platform_tools.py. A Windows contributor
+# with auto-CRLF=true would otherwise convert \n → \r\n on checkout, the
+# snapshot tests would fail mysteriously locally / pass in CI (or vice
+# versa), and the regen instructions in the test-file header would
+# produce LF files that disagree with the working-copy CRLF versions.
+workspace/tests/snapshots/*.txt text eol=lf

.githooks/pre-commit

@@ -95,21 +95,91 @@ if [ -n "$STAGED_GO" ]; then
 fi
 
 # ──────────────────────────────────────────────────────────
-# 5. Secrets: No tokens/keys in staged files
+# 5. Go: build check — catches bot-generated structurally-invalid Go (#1770)
 # ──────────────────────────────────────────────────────────
+#
+# Background: bot agents have produced syntactically-broken Go that the
+# patch tool happily applied (e.g. PR #1769 commit 66ea0b64 — function
+# declaration nested inside another function's body). Compilation failed,
+# staging Platform(Go) was red for hours. CI catches this AT PR-time but
+# by then the malformed commit is already shared.
+#
+# Pre-commit guard: when ANY .go file in workspace-server/ is staged, run
+# `go build ./...` from workspace-server. If it fails, reject the commit.
+# Cost: ~5-10s on a warm cache; acceptable for the class of bug it
+# catches. Skip when go isn't available (CI runners that need to bypass).
+
+if [ -n "$STAGED_GO" ]; then
+  if command -v go >/dev/null 2>&1; then
+    if ! (cd workspace-server && go build ./... >/tmp/precommit-go-build.log 2>&1); then
+      echo "❌ GO BUILD FAILED — staged Go changes don't compile (workspace-server/)."
+      echo "   Output:"
+      sed 's/^/     /' /tmp/precommit-go-build.log | head -20
+      echo "   Fix the build error before committing. See #1770 for context."
+      ERRORS=$((ERRORS + 1))
+    fi
+  else
+    # Bots and CI runners may bypass when go isn't installed — surface a
+    # warning so the absence is visible, but don't block. Humans hit this
+    # only if they didn't run setup.sh.
+    echo "⚠️  go not installed — skipping go-build pre-commit check (#1770)"
+  fi
+fi
+
+# ──────────────────────────────────────────────────────────
+# 6. Secrets: No tokens/keys in staged files
+# ──────────────────────────────────────────────────────────
+#
+# Pattern set MUST match .github/workflows/secret-scan.yml SECRET_PATTERNS
+# and molecule-ai-workspace-runtime/molecule_runtime/scripts/pre-commit-checks.sh —
+# .github/workflows/secret-pattern-drift.yml lints this invariant. Rebuilt
+# against canonical 2026-05-02 after #1569 Phase 1 discovery surfaced
+# real ghs_*/github_pat_* leaks that the prior pattern set
+# ('sk-ant-|sk-proj-|ghp_|gho_|AKIA|mol_pk_|cfut_') would have missed:
+# (a) it lacked ghs_ / ghu_ / ghr_ / github_pat_ / sk-svcacct- / sk-cp- /
+# xox[baprs]- / ASIA prefixes, (b) it skipped *.md and docs/* — but the
+# actual leaks lived in tick-reflections-temp.md, qa-audit-2026-04-21.md,
+# docs/incidents/INCIDENT_LOG.md.
+SECRET_PATTERNS=(
+  'ghp_[A-Za-z0-9]{36,}'           # GitHub PAT (classic)
+  'ghs_[A-Za-z0-9]{36,}'           # GitHub App installation token
+  'gho_[A-Za-z0-9]{36,}'           # GitHub OAuth user-to-server
+  'ghu_[A-Za-z0-9]{36,}'           # GitHub OAuth user
+  'ghr_[A-Za-z0-9]{36,}'           # GitHub OAuth refresh
+  'github_pat_[A-Za-z0-9_]{82,}'   # GitHub fine-grained PAT
+  'sk-ant-[A-Za-z0-9_-]{40,}'      # Anthropic API key
+  'sk-proj-[A-Za-z0-9_-]{40,}'     # OpenAI project key
+  'sk-svcacct-[A-Za-z0-9_-]{40,}'  # OpenAI service-account key
+  'sk-cp-[A-Za-z0-9_-]{60,}'       # MiniMax API key (F1088 vector — caught only after the fact)
+  'xox[baprs]-[A-Za-z0-9-]{20,}'   # Slack tokens (bot/app/user/refresh)
+  'AKIA[0-9A-Z]{16}'               # AWS access key ID
+  'ASIA[0-9A-Z]{16}'               # AWS STS temp access key ID
+)
 
 ALL_STAGED=$(git diff --cached --name-only --diff-filter=ACM || true)
 if [ -n "$ALL_STAGED" ]; then
   for f in $ALL_STAGED; do
-    # Skip binary, known safe files, hooks, docs, and markdown
-    if echo "$f" | grep -qE '\.png$|\.jpg$|\.ico$|\.woff|node_modules|\.lock$|\.githooks/|\.md$|docs/'; then
+    # Skip ONLY binary + lockfiles + the hook itself. Markdown +
+    # docs/* are NOT skipped — that was the bug (#1569 leaks were
+    # all in *.md). If a doc legitimately needs a token-shaped
+    # placeholder, use ghs_EXAMPLE_TOKEN_DO_NOT_USE — short enough
+    # to dodge the {36,} length suffix.
+    if echo "$f" | grep -qE '\.png$|\.jpg$|\.ico$|\.woff|node_modules|\.lock$|\.githooks/'; then
       continue
     fi
-    DIFF=$(git diff --cached "$f" 2>/dev/null | grep '^+' | grep -v '^+++' || true)
-    if echo "$DIFF" | grep -qE 'sk-ant-|sk-proj-|ghp_|gho_|AKIA[A-Z0-9]|mol_pk_|cfut_' 2>/dev/null; then
-      echo "❌ POSSIBLE SECRET in $f — do not commit API keys or tokens"
-      ERRORS=$((ERRORS + 1))
-    fi
+    DIFF=$(git diff --cached --no-color --unified=0 -- "$f" 2>/dev/null | grep -E '^\+[^+]' || true)
+    [ -z "$DIFF" ] && continue
+    for pattern in "${SECRET_PATTERNS[@]}"; do
+      if echo "$DIFF" | grep -qE "$pattern"; then
+        echo "❌ POSSIBLE SECRET in $f (matched: ${pattern})"
+        echo "   The actual matched value is NOT echoed here — round-tripping a"
+        echo "   leaked credential into scrollback widens the blast radius."
+        echo "   If false positive (test/docs example), use a short placeholder"
+        echo "   like ghs_EXAMPLE_TOKEN_DO_NOT_USE that doesn't satisfy the length."
+        ERRORS=$((ERRORS + 1))
+        break
+      fi
+    done
   done
 fi
 

.github/dependabot.yml

@@ -0,0 +1,80 @@
+# Dependabot — auto-bump pinned dependencies.
+#
+# Why this exists:
+#
+# All `uses:` references in .github/workflows/*.yml are pinned to commit
+# SHAs (with `# v<N>` comments for human readability) instead of mutable
+# tags like `@v4`. Tag pinning is a known supply-chain risk: a maintainer
+# (or compromised maintainer account) can repoint `@v4` to malicious code
+# and our pipelines silently pull it. SHA pinning closes that risk.
+#
+# But SHA pinning has a maintenance cost: each upstream legitimate fix
+# requires manually finding + bumping the SHA. Dependabot for Actions
+# closes that gap by opening PRs to bump pinned SHAs whenever upstream
+# tags a new version. Reviewer evaluates the bump like any other
+# dependency PR.
+#
+# Combined: SHA pinning gives us security, Dependabot keeps us current.
+
+version: 2
+updates:
+  # GitHub Actions — every workflow file under .github/workflows/.
+  # Weekly cadence is enough for a CI surface this size; the supply-
+  # chain attack window is "minutes between repoint and pull," and
+  # weekly auto-bumps don't help with zero-days regardless. The point
+  # is to pull in non-zero-day fixes without operator effort, not to
+  # be real-time.
+  - package-ecosystem: github-actions
+    directory: "/"
+    schedule:
+      interval: weekly
+    open-pull-requests-limit: 5
+    labels:
+      - dependencies
+      - github-actions
+    commit-message:
+      prefix: chore(deps)
+      include: scope
+
+  # Go module — workspace-server. Bumps go.mod deps via PR weekly.
+  - package-ecosystem: gomod
+    directory: "/workspace-server"
+    schedule:
+      interval: weekly
+    open-pull-requests-limit: 5
+    labels:
+      - dependencies
+      - go
+    commit-message:
+      prefix: chore(deps)
+      include: scope
+
+  # npm — canvas (Next.js bundle). Largest dep tree in this repo;
+  # weekly cadence keeps the security surface fresh without flooding
+  # the queue. open-pull-requests-limit: 10 because npm churns more
+  # than the others.
+  - package-ecosystem: npm
+    directory: "/canvas"
+    schedule:
+      interval: weekly
+    open-pull-requests-limit: 10
+    labels:
+      - dependencies
+      - npm
+    commit-message:
+      prefix: chore(deps)
+      include: scope
+
+  # Python — workspace runtime requirements. Pip/requirements.txt-
+  # backed rather than pyproject.toml; Dependabot supports both.
+  - package-ecosystem: pip
+    directory: "/workspace"
+    schedule:
+      interval: weekly
+    open-pull-requests-limit: 5
+    labels:
+      - dependencies
+      - python
+    commit-message:
+      prefix: chore(deps)
+      include: scope

.github/scripts/lint_secret_pattern_drift.py

@@ -0,0 +1,166 @@
+#!/usr/bin/env python3
+"""Lint SECRET_PATTERNS drift across known consumers of molecule-core's canonical.
+
+The canonical SECRET_PATTERNS array in
+.github/workflows/secret-scan.yml is mirrored by every other side
+that scans for credentials: the workspace-runtime's bundled
+pre-commit hook, the molecule-controlplane inlined copy, etc. The
+mirror is enforced socially today — when someone adds a new pattern
+to canonical (e.g. the sk-cp- MiniMax token after F1088), the other
+sides are supposed to be updated in lockstep.
+
+This script automates the check. Diffs the canonical's pattern set
+against each known public consumer and exits non-zero on any
+mismatch. Wired into a daily cron + on-push gate via
+.github/workflows/secret-pattern-drift.yml.
+
+Private-repo consumers (currently molecule-controlplane's inlined
+copy) are out of scope here because the molecule-core workflow's
+GITHUB_TOKEN can't read other private repos in the org. They're
+expected to self-monitor via their own copy of this script — not a
+hard barrier, just a future expansion.
+"""
+
+from __future__ import annotations
+
+import re
+import sys
+import urllib.request
+from pathlib import Path
+
+CANONICAL_FILE = Path(".github/workflows/secret-scan.yml")
+
+# Public consumer mirrors. Each entry is (label, raw_url) — raw_url
+# points at the file's RAW content on the consumer's default branch
+# (or staging where applicable). Add an entry here when a new public
+# repo starts shipping its own SECRET_PATTERNS array.
+CONSUMERS: list[tuple[str, str]] = [
+    (
+        "molecule-ai-workspace-runtime/molecule_runtime/scripts/pre-commit-checks.sh",
+        "https://raw.githubusercontent.com/Molecule-AI/molecule-ai-workspace-runtime/main/molecule_runtime/scripts/pre-commit-checks.sh",
+    ),
+]
+
+# In-repo consumers — paths read locally from the workflow checkout.
+# Read-from-disk avoids the staging→main lag that the URL fetcher
+# would hit (a freshly-edited canonical wouldn't yet be on the
+# consumer's default branch). Same drift semantics, no network.
+LOCAL_CONSUMERS: list[tuple[str, Path]] = [
+    (
+        ".githooks/pre-commit (molecule-core local hook)",
+        Path(".githooks/pre-commit"),
+    ),
+]
+
+# Matches the SECRET_PATTERNS=( ... ) array in either yaml-indented
+# (the canonical workflow's `run:` block) or shell-flat (runtime
+# hook) format. Patterns inside are single-quoted Bash strings; we
+# pull each via _PATTERN_RE.
+#
+# Closing `)` is anchored to the start of a line (possibly indented)
+# because pattern comments like `# GitHub PAT (classic)` contain
+# their own `)` mid-line — a non-anchored regex would match through
+# the comment's paren and capture only the first pattern.
+_ARRAY_RE = re.compile(r"SECRET_PATTERNS=\((.*?)^\s*\)", re.DOTALL | re.MULTILINE)
+_PATTERN_RE = re.compile(r"'([^']+)'")
+
+
+def extract_patterns(content: str, source_label: str) -> list[str]:
+    """Pull the SECRET_PATTERNS list out of either format. Raises if missing."""
+    m = _ARRAY_RE.search(content)
+    if not m:
+        raise SystemExit(f"::error::{source_label}: SECRET_PATTERNS=(...) array not found")
+    return _PATTERN_RE.findall(m.group(1))
+
+
+def fetch(url: str) -> str:
+    req = urllib.request.Request(
+        url, headers={"User-Agent": "secret-pattern-drift-lint/1"}
+    )
+    with urllib.request.urlopen(req, timeout=30) as resp:
+        return resp.read().decode("utf-8")
+
+
+def diff_patterns(canonical: list[str], consumer: list[str]) -> tuple[list[str], list[str]]:
+    """Return (missing_from_consumer, extra_in_consumer) — both sorted."""
+    canonical_set = set(canonical)
+    consumer_set = set(consumer)
+    return (
+        sorted(canonical_set - consumer_set),
+        sorted(consumer_set - canonical_set),
+    )
+
+
+def main() -> int:
+    if not CANONICAL_FILE.exists():
+        print(f"::error::canonical not found at {CANONICAL_FILE}")
+        return 1
+
+    canonical = extract_patterns(CANONICAL_FILE.read_text(), str(CANONICAL_FILE))
+    print(f"canonical ({CANONICAL_FILE}): {len(canonical)} patterns")
+
+    drift = False
+
+    # In-repo consumers first — these are read from the workflow's own
+    # checkout, so they never lag behind the canonical and a missing
+    # file IS a real error (not a fetch warning).
+    for label, path in LOCAL_CONSUMERS:
+        if not path.exists():
+            print(f"::error::{label}: file not found at {path}")
+            drift = True
+            continue
+        consumer = extract_patterns(path.read_text(), label)
+        missing, extra = diff_patterns(canonical, consumer)
+        if not missing and not extra:
+            print(f"  ✓ {label}: aligned ({len(consumer)} patterns)")
+            continue
+        drift = True
+        print(f"::error::DRIFT in {label}:")
+        for p in missing:
+            print(f"  -  missing from consumer: {p!r}")
+        for p in extra:
+            print(f"  -  extra in consumer (not in canonical): {p!r}")
+
+    for label, url in CONSUMERS:
+        try:
+            content = fetch(url)
+        except Exception as e:
+            # Fetch failures are warnings, not errors. A consumer
+            # whose default branch was just renamed (or whose file
+            # moved) shouldn't fail the lint until someone updates
+            # the URL above. Real drift is the failure mode this
+            # gate exists to catch — fetch reliability isn't.
+            print(f"::warning::{label}: fetch failed ({e}) — skipping")
+            continue
+
+        consumer = extract_patterns(content, label)
+        missing, extra = diff_patterns(canonical, consumer)
+        if not missing and not extra:
+            print(f"  ✓ {label}: aligned ({len(consumer)} patterns)")
+            continue
+
+        drift = True
+        print(f"::error::DRIFT in {label}:")
+        for p in missing:
+            print(f"  -  missing from consumer: {p!r}")
+        for p in extra:
+            print(f"  -  extra in consumer (not in canonical): {p!r}")
+
+    if drift:
+        print()
+        print("::error::SECRET_PATTERNS drift detected. Bring consumer(s) into")
+        print("alignment with the canonical SECRET_PATTERNS array in")
+        print(f"{CANONICAL_FILE} by adding the missing patterns and removing")
+        print("any extras. The two sides must stay byte-aligned on the pattern")
+        print("list — the runtime hook is the developer's local pre-commit,")
+        print("the canonical is the org-wide CI gate, divergence means a token")
+        print("can pass one but get rejected by the other.")
+        return 1
+
+    print()
+    print("✓ All known consumers aligned with canonical SECRET_PATTERNS.")
+    return 0
+
+
+if __name__ == "__main__":
+    sys.exit(main())

.github/workflows/auto-promote-on-e2e.yml

@@ -0,0 +1,408 @@
+name: Auto-promote :latest after main image build
+
+# Retags `ghcr.io/molecule-ai/{platform,platform-tenant}:staging-<sha>`
+# → `:latest` after either the image build or E2E completes on a `main`
+# push, gated on E2E Staging SaaS not being red for that SHA.
+#
+# Why two triggers:
+#
+#   `publish-workspace-server-image` and `e2e-staging-saas` are both
+#   paths-filtered, but with DIFFERENT path sets:
+#
+#     publish-workspace-server-image:
+#       workspace-server/**, canvas/**, manifest.json
+#
+#     e2e-staging-saas (full lifecycle):
+#       workspace-server/internal/handlers/{registry,workspace_provision,
+#       a2a_proxy}.go, workspace-server/internal/middleware/**,
+#       workspace-server/internal/provisioner/**, tests/e2e/test_staging_full_saas.sh
+#
+#   The E2E set is a strict SUBSET of the publish set. So:
+#     - canvas/** changes → publish fires, E2E does not
+#     - workspace-server/cmd/** changes → publish fires, E2E does not
+#     - workspace-server/internal/sweep/** → publish fires, E2E does not
+#
+#   The previous version triggered ONLY on E2E completion, which meant
+#   non-E2E-path changes (canvas, cmd, sweep, etc.) rebuilt the image
+#   but never advanced `:latest`. Result: as of 2026-04-28 this workflow
+#   had run zero times since merge despite eight main pushes — `:latest`
+#   was ~7 hours / 9 PRs behind main with no human realising. See
+#   `molecule-core` Slack discussion 2026-04-28.
+#
+#   Adding `publish-workspace-server-image` as a second trigger closes
+#   the gap: any image rebuild on main eligibly advances `:latest`.
+#
+# Why E2E remains a kill-switch (not the trigger):
+#
+#   When E2E DID run for this SHA and ended red, we abort — `:latest`
+#   stays on the prior known-good digest. When E2E didn't run (paths
+#   filtered out), we proceed: pre-merge gates already validated this
+#   SHA on staging via auto-promote-staging requiring CI + E2E Canvas +
+#   E2E API + CodeQL all green. Image content for non-E2E-paths
+#   (canvas, cmd, sweep) is exercised by those staging gates.
+#
+# Why `main` only:
+#
+#   `:latest` is what prod tenants pull. We only want SHAs that have
+#   reached main (via auto-promote-staging) to advance `:latest`.
+#   Triggering on staging would let a staging-only revert advance
+#   `:latest` to a SHA that never reaches main, breaking the "production
+#   runs what's on main" invariant.
+#
+# Idempotency:
+#
+#   When a SHA touches paths that match BOTH publish and E2E, both
+#   workflows fire and complete. Both trigger this workflow on
+#   completion → two runs race. Both retag `:staging-<sha>` →
+#   `:latest`. crane tag is idempotent (re-tagging the same digest is a
+#   no-op), so the second run is harmless. concurrency group serializes
+#   them anyway.
+
+on:
+  workflow_run:
+    workflows:
+      - 'E2E Staging SaaS (full lifecycle)'
+      - 'publish-workspace-server-image'
+    types: [completed]
+    branches: [main]
+  workflow_dispatch:
+    inputs:
+      sha:
+        description: 'Short sha to promote (override; defaults to upstream workflow_run head_sha)'
+        required: false
+        type: string
+
+permissions:
+  contents: read
+  packages: write
+
+concurrency:
+  # Serialize promotes per-SHA so the publish+E2E both-fired race lands
+  # cleanly. Different SHAs can promote in parallel.
+  group: auto-promote-latest-${{ github.event.workflow_run.head_sha || github.event.inputs.sha || github.sha }}
+  cancel-in-progress: false
+
+env:
+  IMAGE_NAME: ghcr.io/molecule-ai/platform
+  TENANT_IMAGE_NAME: ghcr.io/molecule-ai/platform-tenant
+
+jobs:
+  promote:
+    # Proceed if upstream succeeded OR manual dispatch. Upstream-failure
+    # paths are filtered here; the E2E-was-red kill-switch lives in the
+    # gate-check step below (covers the case where upstream is publish
+    # success but E2E for the same SHA failed).
+    if: |
+      github.event_name == 'workflow_dispatch' ||
+      (github.event_name == 'workflow_run' && github.event.workflow_run.conclusion == 'success')
+    runs-on: ubuntu-latest
+    steps:
+      - name: Compute short sha
+        id: sha
+        run: |
+          set -euo pipefail
+          if [ -n "${{ github.event.inputs.sha }}" ]; then
+            FULL="${{ github.event.inputs.sha }}"
+          else
+            FULL="${{ github.event.workflow_run.head_sha }}"
+          fi
+          echo "short=${FULL:0:7}" >> "$GITHUB_OUTPUT"
+          echo "full=${FULL}" >> "$GITHUB_OUTPUT"
+
+      - name: Gate — E2E Staging SaaS state for this SHA
+        # When upstream IS E2E success, we know it's green (filtered by
+        # the job-level `if` already). When upstream is publish, look up
+        # E2E state for the same SHA. Four buckets:
+        #
+        #   - completed/success: E2E confirmed safe → proceed
+        #   - completed/failure|cancelled|timed_out: E2E found a
+        #     regression → ABORT (exit 1), `:latest` stays put
+        #   - in_progress|queued|requested: E2E is RACING with publish
+        #     for a runtime-touching SHA. publish typically completes
+        #     ~5-10min before E2E (~10-15min). If we promote on the
+        #     publish signal here, a later E2E failure can't roll back
+        #     `:latest` — it'd already be wrongly advanced. So we DEFER:
+        #     skip subsequent steps (proceed=false) and let E2E's own
+        #     completion event re-fire this workflow, which then takes
+        #     the upstream-is-E2E path. exit 0 so the run shows as
+        #     success rather than a noisy fake-failure.
+        #   - none/none: E2E was paths-filtered out for this SHA (the
+        #     change touched canvas/cmd/sweep/etc. — paths covered by
+        #     publish but not by E2E). pre-merge gates on staging
+        #     already validated this SHA → proceed.
+        #
+        # Manual dispatch skips this check — operator override.
+        id: gate
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          REPO: ${{ github.repository }}
+          SHA: ${{ steps.sha.outputs.full }}
+          UPSTREAM_NAME: ${{ github.event.workflow_run.name }}
+          EVENT_NAME: ${{ github.event_name }}
+        run: |
+          set -euo pipefail
+
+          if [ "$EVENT_NAME" = "workflow_dispatch" ]; then
+            echo "proceed=true" >> "$GITHUB_OUTPUT"
+            echo "::notice::Manual dispatch — skipping E2E gate (operator override)"
+            exit 0
+          fi
+
+          if [ "$UPSTREAM_NAME" = "E2E Staging SaaS (full lifecycle)" ]; then
+            echo "proceed=true" >> "$GITHUB_OUTPUT"
+            echo "::notice::Upstream is E2E itself (success per job-level if) — gate trivially satisfied"
+            exit 0
+          fi
+
+          # Upstream is publish-workspace-server-image. Check E2E state.
+          # The jq filter must defend against TWO empty cases that gh
+          # CLI emits indistinguishably:
+          #   1. gh exits non-zero (network blip, auth issue) → handled
+          #      by the `|| echo "none/none"` fallback below.
+          #   2. gh exits zero but returns `[]` (no E2E run on this
+          #      main SHA — the common case for canvas-only / cmd-only
+          #      / sweep-only changes whose paths don't trigger E2E).
+          #      Without `(.[0] // {})`, jq sees `null` and emits
+          #      "null/none" — which the case statement below has no
+          #      branch for, so it falls into *) → exit 1.
+          # Surfaced 2026-04-30 the first time the App-token chain
+          # (#2389) actually fired auto-promote-on-e2e from a publish
+          # upstream — every prior run was E2E-upstream which
+          # short-circuits before this gate.
+          RESULT=$(gh run list \
+            --repo "$REPO" \
+            --workflow e2e-staging-saas.yml \
+            --branch main \
+            --commit "$SHA" \
+            --limit 1 \
+            --json status,conclusion \
+            --jq '(.[0] // {}) | "\(.status // "none")/\(.conclusion // "none")"' \
+            2>/dev/null || echo "none/none")
+
+          echo "E2E Staging SaaS for ${SHA:0:7}: $RESULT"
+
+          case "$RESULT" in
+            completed/success)
+              echo "proceed=true" >> "$GITHUB_OUTPUT"
+              echo "::notice::E2E green for this SHA — proceeding with promote"
+              ;;
+            completed/failure|completed/cancelled|completed/timed_out)
+              echo "proceed=false" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ❌ Auto-promote aborted — E2E Staging SaaS failed"
+                echo
+                echo "E2E Staging SaaS for \`${SHA:0:7}\`: \`$RESULT\`"
+                echo "\`:latest\` stays on the prior known-good digest."
+                echo
+                echo "If the failure was a flake, manually dispatch this workflow with the same sha to override."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+              ;;
+            in_progress/*|queued/*|requested/*|waiting/*|pending/*)
+              echo "proceed=false" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ⏳ Auto-promote deferred — E2E Staging SaaS still running"
+                echo
+                echo "Publish completed before E2E for \`${SHA:0:7}\` (state: \`$RESULT\`)."
+                echo "Skipping retag here — E2E's own completion event will re-fire this workflow."
+                echo "If E2E ends green, that run promotes \`:latest\`. If red, it aborts."
+              } >> "$GITHUB_STEP_SUMMARY"
+              ;;
+            none/none)
+              echo "proceed=true" >> "$GITHUB_OUTPUT"
+              echo "::notice::E2E paths-filtered out for this SHA — pre-merge staging gates carry"
+              ;;
+            *)
+              echo "proceed=false" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ❓ Auto-promote aborted — unexpected E2E state"
+                echo
+                echo "E2E Staging SaaS for \`${SHA:0:7}\`: \`$RESULT\` (unhandled)"
+                echo "Manual investigation needed; re-dispatch with the same sha once resolved."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+              ;;
+          esac
+
+      - if: steps.gate.outputs.proceed == 'true'
+        uses: imjasonh/setup-crane@6da1ae018866400525525ce74ff892880c099987 # v0.5
+
+      - name: GHCR login
+        if: steps.gate.outputs.proceed == 'true'
+        run: |
+          echo "${{ secrets.GITHUB_TOKEN }}" | \
+            crane auth login ghcr.io -u "${{ github.actor }}" --password-stdin
+
+      - name: Verify :staging-<sha> exists for both images
+        # Better to fail fast with a clear message than to half-tag
+        # (platform retagged but platform-tenant missing → tenants pull
+        # a stale image).
+        if: steps.gate.outputs.proceed == 'true'
+        run: |
+          set -euo pipefail
+          for img in "${IMAGE_NAME}" "${TENANT_IMAGE_NAME}"; do
+            tag="${img}:staging-${{ steps.sha.outputs.short }}"
+            if ! crane manifest "$tag" >/dev/null 2>&1; then
+              echo "::error::Missing tag: $tag"
+              echo "::error::publish-workspace-server-image must complete on this SHA before auto-promote can retag :latest."
+              exit 1
+            fi
+            echo "  ok: $tag exists"
+          done
+
+      - name: Ancestry check — refuse to promote :latest backwards
+        # #2244: workflow_run completions arrive in arbitrary order. If
+        # SHA-A and SHA-B both reach main within ~10 min and SHA-B's E2E
+        # completes before SHA-A's, this workflow can fire for SHA-A
+        # AFTER it already promoted SHA-B → :latest goes backwards. The
+        # orphan-reconciler "next run corrects it" doesn't apply: there's
+        # no auto-corrective re-promote, :latest stays wrong until the
+        # next main push lands.
+        #
+        # Detection: read current :latest's `org.opencontainers.image.revision`
+        # label (set by publish-workspace-server-image.yml at build time)
+        # and ask the GitHub compare API whether the candidate SHA is
+        # ahead-of / identical-to / behind / diverged-from current.
+        # Hard-fail on `behind` and `diverged` per the approved design —
+        # silent-bypass is the class we're moving away from. Workflow
+        # goes red, oncall sees it, operator decides how to recover
+        # (manual dispatch with the right SHA, force-promote, etc.).
+        #
+        # Manual dispatch skips this check — operator override semantics
+        # match the gate-check step above.
+        #
+        # Backward-compat: when current :latest carries no revision
+        # label (legacy image pre-publish-with-label), skip-with-warning.
+        # All :latest images on main are post-label as of 2026-04-29, so
+        # this branch will be dead within 90 days; remove then.
+        if: steps.gate.outputs.proceed == 'true' && github.event_name != 'workflow_dispatch'
+        id: ancestry
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          REPO: ${{ github.repository }}
+          TARGET_SHA: ${{ steps.sha.outputs.full }}
+        run: |
+          set -euo pipefail
+
+          # Read the current :latest config and pull the revision label.
+          # `crane config` returns the OCI image config blob (not the manifest);
+          # labels live under `.config.Labels`. `// empty` makes jq return ""
+          # rather than the literal "null" so the test below works.
+          CURRENT_REVISION=$(crane config "${IMAGE_NAME}:latest" 2>/dev/null \
+            | jq -r '.config.Labels["org.opencontainers.image.revision"] // empty' \
+            || true)
+
+          if [ -z "$CURRENT_REVISION" ]; then
+            echo "decision=skip-no-label" >> "$GITHUB_OUTPUT"
+            {
+              echo "## ⚠ Ancestry check skipped — current :latest has no revision label"
+              echo
+              echo "Likely a legacy image built before \`org.opencontainers.image.revision\` was set."
+              echo "Falling through to retag. After all \`:latest\` images are post-label (TODO 90 days), this branch is dead and should be removed."
+            } >> "$GITHUB_STEP_SUMMARY"
+            echo "::warning::Current :latest carries no revision label — skipping ancestry check (legacy image)"
+            exit 0
+          fi
+
+          if [ "$CURRENT_REVISION" = "$TARGET_SHA" ]; then
+            echo "decision=identical" >> "$GITHUB_OUTPUT"
+            echo "::notice:::latest already at ${TARGET_SHA:0:7} — retag will be a no-op"
+            exit 0
+          fi
+
+          # Ask GitHub which side of the merge graph TARGET_SHA sits on
+          # relative to CURRENT_REVISION. Returns one of: ahead | identical
+          # | behind | diverged. Network or auth errors collapse to "error"
+          # via the explicit fallback so the case below always matches.
+          STATUS=$(gh api \
+            "repos/${REPO}/compare/${CURRENT_REVISION}...${TARGET_SHA}" \
+            --jq '.status' 2>/dev/null || echo "error")
+
+          echo "ancestry compare ${CURRENT_REVISION:0:7} → ${TARGET_SHA:0:7}: $STATUS"
+
+          case "$STATUS" in
+            ahead)
+              echo "decision=ahead" >> "$GITHUB_OUTPUT"
+              echo "::notice::Target ${TARGET_SHA:0:7} is ahead of current :latest (${CURRENT_REVISION:0:7}) — proceeding with retag"
+              ;;
+            identical)
+              echo "decision=identical" >> "$GITHUB_OUTPUT"
+              echo "::notice::Target identical to :latest — retag will be a no-op"
+              ;;
+            behind)
+              echo "decision=behind" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ❌ Auto-promote refused — target is BEHIND current :latest"
+                echo
+                echo "| Field | Value |"
+                echo "|---|---|"
+                echo "| Target SHA | \`$TARGET_SHA\` |"
+                echo "| Current :latest revision | \`$CURRENT_REVISION\` |"
+                echo "| GitHub compare status | \`behind\` |"
+                echo
+                echo "This guard catches the workflow_run-completion-order race (#2244):"
+                echo "two rapid main pushes whose E2Es complete out-of-order can otherwise"
+                echo "promote \`:latest\` backwards. \`:latest\` stays on \`${CURRENT_REVISION:0:7}\`."
+                echo
+                echo "**Recovery:** if this is a legitimate revert that should land on \`:latest\`,"
+                echo "manually dispatch this workflow with the target sha as input — the manual-dispatch"
+                echo "path skips the ancestry check (operator override)."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+              ;;
+            diverged)
+              echo "decision=diverged" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ❓ Auto-promote refused — history diverged"
+                echo
+                echo "| Field | Value |"
+                echo "|---|---|"
+                echo "| Target SHA | \`$TARGET_SHA\` |"
+                echo "| Current :latest revision | \`$CURRENT_REVISION\` |"
+                echo "| GitHub compare status | \`diverged\` |"
+                echo
+                echo "Likely cause: force-push rewrote main's history, leaving the previous"
+                echo "\`:latest\` revision orphaned. Needs human review before \`:latest\` advances."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+              ;;
+            error|*)
+              echo "decision=error" >> "$GITHUB_OUTPUT"
+              {
+                echo "## ❌ Auto-promote aborted — ancestry-check API error"
+                echo
+                echo "\`gh api repos/${REPO}/compare/${CURRENT_REVISION}...${TARGET_SHA}\` returned unexpected status: \`$STATUS\`"
+                echo
+                echo "Manual dispatch with the target sha bypasses this check."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+              ;;
+          esac
+
+      - name: Retag platform :staging-<sha> → :latest
+        if: steps.gate.outputs.proceed == 'true'
+        run: |
+          crane tag "${IMAGE_NAME}:staging-${{ steps.sha.outputs.short }}" latest
+
+      - name: Retag tenant :staging-<sha> → :latest
+        if: steps.gate.outputs.proceed == 'true'
+        run: |
+          crane tag "${TENANT_IMAGE_NAME}:staging-${{ steps.sha.outputs.short }}" latest
+
+      - name: Summary
+        if: steps.gate.outputs.proceed == 'true'
+        run: |
+          {
+            echo "## :latest promoted to ${{ steps.sha.outputs.short }}"
+            echo
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "- Trigger: manual dispatch"
+            else
+              echo "- Upstream: \`${{ github.event.workflow_run.name }}\` ([run](${{ github.event.workflow_run.html_url }}))"
+            fi
+            echo "- platform:staging-${{ steps.sha.outputs.short }} → :latest"
+            echo "- platform-tenant:staging-${{ steps.sha.outputs.short }} → :latest"
+            echo
+            echo "Tenant fleet auto-pulls within 5 min via IMAGE_AUTO_REFRESH=true."
+            echo "Force immediate fanout: dispatch redeploy-tenants-on-main.yml."
+          } >> "$GITHUB_STEP_SUMMARY"

.github/workflows/auto-promote-staging.yml

@@ -1,25 +1,62 @@
 name: Auto-promote staging → main
 
 # Fires after any of the staging-branch quality gates complete. When ALL
-# required gates are green on the same staging SHA, fast-forwards `main`
-# to that SHA automatically — closing the gap that historically let
-# features sit on staging for weeks waiting for a bulk promotion PR
-# (see molecule-core#1496 for the 1172-commit example).
+# required gates are green on the same staging SHA, opens (or re-uses)
+# a PR `staging → main` and enables auto-merge so the merge queue lands
+# it. Closes the gap that historically let features sit on staging for
+# weeks waiting for a bulk promotion PR (see molecule-core#1496 for the
+# 1172-commit example).
+#
+# 2026-04-28 rewrite (PR #142): the previous version did a direct
+# `git merge --ff-only origin staging && git push origin main`. That
+# breaks against main's branch-protection ruleset, which requires
+# status checks "set by the expected GitHub apps" — direct pushes
+# can't satisfy that condition (only PR merges through the queue can).
+# The workflow was failing every tick with:
+#   remote: error: GH006: Protected branch update failed for refs/heads/main.
+#   remote: - Required status checks ... were not set by the expected GitHub apps.
+# Fix: mirror the PR-based pattern from auto-sync-main-to-staging.yml
+# (the reverse-direction sync, fixed in #2234 for the same reason).
+# Both directions now use the same merge-queue path that humans use,
+# no special-case bypass.
 #
 # Safety model:
 # - Runs ONLY on workflow_run events for the staging branch.
 # - Requires EVERY named gate workflow to have the same head_sha and
 #   all be `conclusion == success`. If any of them is red, skipped,
 #   cancelled, or pending, we abort (stay on the current main).
-# - Uses --ff-only: refuses to advance main if main has diverged from
-#   the staging history (e.g. a hotfix landed directly on main). In
-#   that case a human resolves the fork.
-# - Writes a commit summary so the promote shows up in git log as a
-#   deliberate act, not a stealth move.
+# - The PR base=main head=staging path lets GitHub itself enforce
+#   branch protection. If main has diverged from staging or required
+#   checks aren't satisfied, the merge queue declines the PR — no
+#   need for a manual ff-only ancestry check here.
+# - Loop safety: the auto-sync-main-to-staging workflow fires when
+#   main lands the auto-promote PR, but its merge into staging is by
+#   GITHUB_TOKEN which doesn't trigger downstream workflow_run events
+#   (GitHub Actions safety). So this workflow doesn't re-fire from
+#   its own promote landing.
 #
-# **Initial rollout:** ship this file but leave the `enabled` input set
-# such that nothing auto-promotes until staging CI has been reliably
-# green for a few days. Toggle via repo variable `AUTO_PROMOTE_ENABLED`.
+# Toggle via repo variable AUTO_PROMOTE_ENABLED (true/unset). When
+# unset, the workflow logs what it would have done but doesn't open
+# the PR — useful for dry-running the gate logic without surfacing
+# a noisy PR while staging CI is still flaky.
+#
+# **One-time repo setting (load-bearing):** this workflow opens the
+# staging→main PR via `gh pr create` using the default GITHUB_TOKEN.
+# Since GitHub's 2022 default change, that token cannot create or
+# approve PRs unless the repo opts in. The toggle is at:
+#
+#   Settings → Actions → General → Workflow permissions
+#   → ✅ Allow GitHub Actions to create and approve pull requests
+#
+# Without it, every workflow_run fails with:
+#
+#   pull request create failed: GraphQL: GitHub Actions is not
+#   permitted to create or approve pull requests (createPullRequest)
+#
+# Observed 2026-04-29 01:43 UTC blocking promotion of fcd87b9 (PRs
+# #2248 + #2249); manually bridged via PR #2252. Re-check this
+# setting if auto-promote starts failing with createPullRequest
+# errors after a repo or org admin change.
 
 on:
   workflow_run:
@@ -38,6 +75,28 @@ on:
 
 permissions:
   contents: write
+  pull-requests: write
+  # actions: write is needed by the post-merge dispatch tail step
+  # (#2358 / #2357) — `gh workflow run publish-workspace-server-image.yml`
+  # POSTs to /actions/workflows/.../dispatches which requires this scope.
+  # Without it the call 403s and the publish/canary/redeploy chain still
+  # doesn't run on staging→main promotions, undoing #2358.
+  actions: write
+
+# Serialize auto-promote runs. Multiple staging gate completions can land
+# in quick succession (CI + E2E + CodeQL all finish within seconds of
+# each other on a green PR) — without this, two parallel runs both:
+#   1. Open / re-use the same promote PR.
+#   2. Both call `gh pr merge --auto` (idempotent — fine).
+#   3. Both poll for the same mergedAt and both `gh workflow run` publish
+#      → 2× redundant publish builds racing for the same `:staging-latest`
+#      retag, and 2× canary-verify chains.
+# cancel-in-progress: false because we don't want a brand-new run to kill
+# a polling-tail that's about to dispatch — the polling tail's 30 min cap
+# is the right backstop, not workflow-level cancel.
+concurrency:
+  group: auto-promote-staging
+  cancel-in-progress: false
 
 jobs:
   check-all-gates-green:
@@ -61,13 +120,30 @@ jobs:
         run: |
           set -euo pipefail
 
-          # Required gate workflow names. Must match the `name:` field
-          # in the respective .github/workflows/*.yml files.
+          # Required gate workflow files. Use file paths (relative to
+          # .github/workflows/) rather than display names because:
+          #
+          #   1. `gh run list --workflow=<name>` is ambiguous when two
+          #      workflows have the same `name:` — observed 2026-04-28
+          #      with "CodeQL" matching both `codeql.yml` (explicit) and
+          #      GitHub's UI-configured Code-quality default setup
+          #      (internal "codeql"). gh CLI returns "could not resolve
+          #      to a unique workflow" → empty result → gate evaluated
+          #      as missing/none → auto-promote dead-locked despite all
+          #      checks actually passing.
+          #
+          #   2. File paths are the unique identifier for workflows;
+          #      `name:` is just a display string and can collide.
+          #
+          # When adding/removing a gate, update this list AND the
+          # branch-protection required-checks list (which uses check-run
+          # display names, not workflow names; the two are decoupled and
+          # should be kept in sync manually).
           GATES=(
-            "CI"
-            "E2E Staging Canvas (Playwright)"
-            "E2E API Smoke Test"
-            "CodeQL"
+            "ci.yml"
+            "e2e-staging-canvas.yml"
+            "e2e-api.yml"
+            "codeql.yml"
           )
 
           echo "head_sha=${HEAD_SHA}" >> "$GITHUB_OUTPUT"
@@ -117,14 +193,14 @@ jobs:
           set -eu
           # Repo variable AUTO_PROMOTE_ENABLED=true flips this on. While
           # it's unset, the workflow dry-runs (logs what it would have
-          # done) but doesn't actually push to main. Set the variable in
+          # done) but doesn't open the promote PR. Set the variable in
           # Settings → Secrets and variables → Actions → Variables.
           if [ "${AUTO_PROMOTE_ENABLED:-}" != "true" ] && [ "${FORCE_INPUT:-false}" != "true" ]; then
             {
               echo "## ⏸ Auto-promote disabled"
               echo
               echo "Repo variable \`AUTO_PROMOTE_ENABLED\` is not set to \`true\`."
-              echo "All gates are green on staging; would have promoted to \`main\`."
+              echo "All gates are green on staging; would have opened a promote PR to \`main\`."
               echo
               echo "To enable: Settings → Secrets and variables → Actions → Variables → \`AUTO_PROMOTE_ENABLED=true\`."
               echo "To test once manually: workflow_dispatch with \`force=true\`."
@@ -133,50 +209,176 @@ jobs:
             exit 0
           fi
 
-      - name: Checkout main
-        if: ${{ vars.AUTO_PROMOTE_ENABLED == 'true' || github.event.inputs.force == 'true' }}
-        uses: actions/checkout@v4
-        with:
-          ref: main
-          fetch-depth: 0
-          token: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: Fast-forward main → staging HEAD
+      - name: Open (or reuse) staging → main promote PR + enable auto-merge
         if: ${{ vars.AUTO_PROMOTE_ENABLED == 'true' || github.event.inputs.force == 'true' }}
         env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          REPO: ${{ github.repository }}
           TARGET_SHA: ${{ needs.check-all-gates-green.outputs.head_sha }}
         run: |
-          set -eu
-          git config user.name "github-actions[bot]"
-          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          set -euo pipefail
 
-          git fetch origin staging
-          git fetch origin main
+          # Look for an existing open promote PR (idempotent on re-run
+          # of the workflow). The PR's head IS the staging branch — the
+          # whole point is "advance main to staging's tip", so we don't
+          # need a per-SHA branch like auto-sync-main-to-staging uses.
+          PR_NUM=$(gh pr list --repo "$REPO" \
+            --base main --head staging --state open \
+            --json number --jq '.[0].number // ""')
 
-          # Refuse to advance main if it's diverged from staging history.
-          # Someone landed a commit directly on main that's not on
-          # staging → human needs to decide how to reconcile.
-          if ! git merge-base --is-ancestor "$(git rev-parse origin/main)" "$TARGET_SHA"; then
-            {
-              echo "## ❌ Auto-promote refused — main has diverged"
-              echo
-              echo "\`main\` (\`$(git rev-parse --short origin/main)\`) is not an ancestor of staging (\`${TARGET_SHA:0:7}\`)."
-              echo "Someone committed directly to main or the histories forked."
-              echo
-              echo "Resolve manually: merge main into staging, get CI green on the merged commit,"
-              echo "then the auto-promote will succeed on the next run."
-            } >> "$GITHUB_STEP_SUMMARY"
-            exit 1
+          if [ -z "$PR_NUM" ]; then
+            TITLE="staging → main: auto-promote ${TARGET_SHA:0:7}"
+            BODY_FILE=$(mktemp)
+            cat > "$BODY_FILE" <<EOFBODY
+          Automated promotion of \`staging\` (\`${TARGET_SHA:0:8}\`) to \`main\`. All required staging gates green at this SHA: CI, E2E Staging Canvas, E2E API Smoke, CodeQL.
+
+          This PR is auto-generated by \`.github/workflows/auto-promote-staging.yml\` whenever every required gate completes green on the same staging SHA. It exists because main's branch protection requires status checks "set by the expected GitHub apps" — direct \`git push\` from a workflow can't satisfy that, only PR merges through the queue can.
+
+          Merge queue lands this; no human action needed unless gates fail. Reverse-direction sync (the merge commit on main → staging) is handled by \`auto-sync-main-to-staging.yml\`.
+          EOFBODY
+            PR_URL=$(gh pr create --repo "$REPO" \
+              --base main --head staging \
+              --title "$TITLE" \
+              --body-file "$BODY_FILE")
+            PR_NUM=$(echo "$PR_URL" | grep -oE '[0-9]+$' | tail -1)
+            rm -f "$BODY_FILE"
+            echo "::notice::Opened PR #${PR_NUM}"
+          else
+            echo "::notice::Re-using existing promote PR #${PR_NUM}"
           fi
 
-          # Fast-forward main to the target SHA.
-          git checkout main
-          git merge --ff-only "$TARGET_SHA"
-          git push origin main
+          # Enable auto-merge — the merge queue picks it up once
+          # required gates are green on the merge_group ref.
+          if ! gh pr merge "$PR_NUM" --repo "$REPO" --auto --merge 2>&1; then
+            echo "::warning::Failed to enable auto-merge on PR #${PR_NUM} — operator may need to merge manually."
+          fi
 
           {
-            echo "## ✅ Auto-promoted main → ${TARGET_SHA:0:7}"
+            echo "## ✅ Auto-promote PR opened"
             echo
-            echo "All gate workflows green on staging at this SHA."
-            echo "\`main\` fast-forwarded to match."
+            echo "- Source: staging at \`${TARGET_SHA:0:8}\`"
+            echo "- PR: #${PR_NUM}"
+            echo
+            echo "Merge queue lands the PR once required gates are green; no human action needed unless gates fail."
           } >> "$GITHUB_STEP_SUMMARY"
+
+          # Hand the PR number to the next step so we can dispatch the
+          # tenant-redeploy chain after the merge queue lands the merge.
+          echo "promote_pr_num=${PR_NUM}" >> "$GITHUB_OUTPUT"
+        id: promote_pr
+
+      # Mint a short-lived GitHub App installation token for the dispatch
+      # step below. We CANNOT use `secrets.GITHUB_TOKEN` to dispatch the
+      # downstream publish chain — workflow runs created by GITHUB_TOKEN
+      # do not fire `workflow_run` triggers on completion (the
+      # documented "no recursion" rule —
+      # https://docs.github.com/en/actions/using-workflows/triggering-a-workflow#triggering-a-workflow-from-a-workflow).
+      #
+      # Symptom this caused (root-caused on 2026-04-30): publish-image
+      # ran successfully twice (21313dc 14:41Z, 59dec57 15:21Z) but
+      # canary-verify and redeploy-tenants-on-main never chained,
+      # because the publish run's `triggering_actor` was
+      # `github-actions[bot]` (i.e. GITHUB_TOKEN). A manual dispatch
+      # earlier in the day with the operator's PAT (d850ec7 06:52Z) did
+      # chain — same workflow file, only the actor differed.
+      #
+      # An App token's triggering_actor is the App user (e.g.
+      # `molecule-ai[bot]`), which IS allowed to fire downstream
+      # workflow_run cascades.
+      - name: Mint App token for downstream dispatch
+        if: steps.promote_pr.outputs.promote_pr_num != ''
+        id: app-token
+        uses: actions/create-github-app-token@1b10c78c7865c340bc4f6099eb2f838309f1e8c3 # v3.1.1
+        with:
+          app-id: ${{ secrets.MOLECULE_AI_APP_ID }}
+          private-key: ${{ secrets.MOLECULE_AI_APP_PRIVATE_KEY }}
+
+      - name: Wait for promote merge, then dispatch publish + redeploy (#2357)
+        # GITHUB_TOKEN-initiated merges suppress downstream `push` events
+        # (https://docs.github.com/en/actions/using-workflows/triggering-a-workflow#triggering-a-workflow-from-a-workflow).
+        # Result: when the merge queue lands the promote PR, the resulting
+        # main-branch push DOES NOT fire publish-workspace-server-image,
+        # so canary-verify and redeploy-tenants-on-main never run and
+        # tenants stay on stale code (issue #2357).
+        #
+        # Workaround: poll for the merge to land, then explicitly
+        # `gh workflow run` publish-workspace-server-image. The dispatch
+        # MUST authenticate as the molecule-ai App (App token minted
+        # above) — not GITHUB_TOKEN — so that the resulting publish
+        # run's completion event can fire the workflow_run cascade
+        # into canary-verify + redeploy-tenants-on-main. See the prior
+        # step's comment for the GITHUB_TOKEN no-recursion details.
+        #
+        # Long-term fix: switch the auto-merge call above to use the
+        # same App token, so the merge's push event fires
+        # publish-workspace-server-image naturally and this polling tail
+        # becomes unnecessary. Tracked in #2357.
+        if: steps.promote_pr.outputs.promote_pr_num != ''
+        env:
+          GH_TOKEN: ${{ steps.app-token.outputs.token }}
+          REPO: ${{ github.repository }}
+          PR_NUM: ${{ steps.promote_pr.outputs.promote_pr_num }}
+        run: |
+          # Poll for merge — max 30 min (60 × 30s). The merge queue
+          # typically lands within 5-10 min when gates are green. Break
+          # early if the PR is closed without merging (operator action,
+          # gates flipped red post-approval, branch-protection rejection)
+          # so we don't tie up a runner for the full 30 min on a dead PR.
+          MERGED=""
+          STATE=""
+          for _ in $(seq 1 60); do
+            VIEW=$(gh pr view "$PR_NUM" --repo "$REPO" --json mergedAt,state)
+            MERGED=$(echo "$VIEW" | jq -r '.mergedAt // ""')
+            STATE=$(echo "$VIEW" | jq -r '.state // ""')
+            if [ -n "$MERGED" ] && [ "$MERGED" != "null" ]; then
+              echo "::notice::Promote PR #${PR_NUM} merged at ${MERGED}"
+              break
+            fi
+            if [ "$STATE" = "CLOSED" ]; then
+              echo "::warning::Promote PR #${PR_NUM} was closed without merging — skipping deploy dispatch."
+              exit 0
+            fi
+            sleep 30
+          done
+
+          if [ -z "$MERGED" ] || [ "$MERGED" = "null" ]; then
+            echo "::warning::Promote PR #${PR_NUM} didn't merge within 30min — skipping deploy dispatch (manually run \`gh workflow run publish-workspace-server-image.yml --ref main\` once it lands)."
+            exit 0
+          fi
+
+          # Dispatch publish on main using the App token. App-initiated
+          # workflow_dispatch DOES propagate the workflow_run cascade,
+          # unlike GITHUB_TOKEN-initiated dispatch.
+          # publish completes → canary-verify chains via workflow_run →
+          # redeploy-tenants-on-main chains via workflow_run + branches:[main].
+          if gh workflow run publish-workspace-server-image.yml \
+              --repo "$REPO" --ref main 2>&1; then
+            echo "::notice::Dispatched publish-workspace-server-image on ref=main as molecule-ai App — canary-verify and redeploy-tenants-on-main will chain via workflow_run."
+            {
+              echo "## 🚀 Tenant redeploy chain dispatched"
+              echo
+              echo "- publish-workspace-server-image (workflow_dispatch on \`main\`, actor: \`molecule-ai[bot]\`)"
+              echo "- canary-verify will chain on completion"
+              echo "- redeploy-tenants-on-main will chain on canary green"
+            } >> "$GITHUB_STEP_SUMMARY"
+          else
+            echo "::error::Failed to dispatch publish-workspace-server-image. Run manually: gh workflow run publish-workspace-server-image.yml --ref main"
+          fi
+
+          # ALSO dispatch auto-sync-main-to-staging.yml. Same root cause as
+          # publish above (issue #2357): the merge-queue-initiated push to
+          # main is by GITHUB_TOKEN → no `on: push` triggers fire downstream.
+          # Without this dispatch, every staging→main promote leaves staging
+          # one merge commit BEHIND main, which silently dead-locks the NEXT
+          # promote PR as `mergeStateStatus: BEHIND` because main's
+          # branch-protection has `strict: true`. Verified empirically on
+          # 2026-05-02 against PR #2442 (Phase 2 promote): only the explicit
+          # publish-workspace-server-image dispatch fired on the previous
+          # promote SHA 76c604fb, while auto-sync silently no-op'd, leaving
+          # staging behind for ~24h until manually bridged.
+          if gh workflow run auto-sync-main-to-staging.yml \
+              --repo "$REPO" --ref main 2>&1; then
+            echo "::notice::Dispatched auto-sync-main-to-staging on ref=main as molecule-ai App — staging will absorb the new main merge commit via PR + merge queue."
+          else
+            echo "::error::Failed to dispatch auto-sync-main-to-staging. Run manually: gh workflow run auto-sync-main-to-staging.yml --ref main"
+          fi

.github/workflows/auto-sync-main-to-staging.yml

@@ -0,0 +1,237 @@
+name: Auto-sync main → staging
+
+# Reflects every push to `main` back onto `staging` so the
+# staging-as-superset-of-main invariant holds.
+#
+# Background:
+#
+# `auto-promote-staging.yml` advances main via `git merge --ff-only`
+# + `git push origin main` — that's a clean fast-forward, no merge
+# commit. But manual merges of `staging → main` PRs through the
+# GitHub UI / API create a merge commit on main that staging
+# doesn't have. The next `staging → main` PR then evaluates as
+# "BEHIND" because staging is missing that merge commit, requiring
+# a manual `gh pr update-branch` round-trip.
+#
+# This happened twice on 2026-04-28 (PRs #2202, #2205, both manual
+# bridges). Each time the bridge needed update-branch + a re-CI
+# round before merging. Operationally annoying and avoidable.
+#
+# Architecture:
+#
+# This repo's `staging` branch is protected by a `merge_queue`
+# ruleset (id 15500102) that blocks ALL direct pushes — no bypass
+# even for org admins or the GitHub Actions integration. Direct
+# `git push origin staging` returns GH013. So instead of pushing
+# directly, this workflow:
+#
+#   1. Checks if main is already in staging's ancestry → no-op.
+#   2. Creates an `auto-sync/main-<sha>` branch from staging.
+#   3. Tries `git merge --ff-only origin/main` → if staging hasn't
+#      diverged this is a clean ff.
+#   4. Otherwise `git merge --no-ff origin/main` to absorb main's
+#      tip while keeping staging's history.
+#   5. Pushes the auto-sync branch.
+#   6. Opens a PR (base=staging, head=auto-sync/main-<sha>) and
+#      enables auto-merge so the merge queue lands it.
+#
+# This mirrors the path human PRs take through staging — same
+# rules, same gates, no special-case bypass.
+#
+# Loop safety:
+#
+# `GITHUB_TOKEN`-authored merges (including the merge queue's land
+# of the auto-sync PR) do NOT trigger downstream workflow runs
+# (GitHub Actions safety). So when the auto-sync PR lands on
+# staging, `auto-promote-staging.yml` is NOT triggered by that
+# push. The next developer push to staging triggers auto-promote
+# normally. No loop possible.
+#
+# Concurrency:
+#
+# Two pushes to main in quick succession (e.g., manual UI merge
+# immediately followed by auto-promote-staging's ff-merge) could
+# otherwise open two overlapping auto-sync PRs. The concurrency
+# group serializes runs; the second waits for the first to exit.
+# (The first run exits after opening + auto-merge-queueing the PR,
+# not after the merge actually completes — so multiple PRs can be
+# open simultaneously, but the merge queue handles them serially.)
+
+on:
+  push:
+    branches: [main]
+  # workflow_dispatch lets:
+  #   1. Operators manually backfill a missed sync (e.g. after a manual
+  #      UI merge that the runner missed).
+  #   2. auto-promote-staging.yml's polling tail explicitly invoke us
+  #      after the promote PR lands. This is load-bearing: when the
+  #      merge queue lands a promote-PR merge, the resulting push to
+  #      `main` is "by GITHUB_TOKEN", and per GitHub's no-recursion
+  #      rule (https://docs.github.com/en/actions/using-workflows/triggering-a-workflow#triggering-a-workflow-from-a-workflow)
+  #      that push event does NOT fire any downstream workflows. The
+  #      `on: push` trigger above is silently dead for the very pattern
+  #      we exist to handle. Verified empirically 2026-05-02 against
+  #      SHA 76c604fb (PR #2437 staging→main): only ONE workflow fired
+  #      (publish-workspace-server-image, dispatched explicitly by
+  #      auto-promote's polling tail with an App token). Every other
+  #      `on: push: branches: [main]` workflow — including this one —
+  #      was suppressed. Until the underlying merge call moves to an
+  #      App token, an explicit dispatch is the only reliable path.
+  workflow_dispatch:
+
+permissions:
+  contents: write
+  pull-requests: write
+
+concurrency:
+  group: auto-sync-main-to-staging
+  cancel-in-progress: false
+
+jobs:
+  sync-staging:
+    # ubuntu-latest matches every other workflow in this repo. The
+    # earlier `[self-hosted, macos, arm64]` was a copy-paste artefact
+    # from the molecule-controlplane repo (which IS private and uses a
+    # Mac runner) — molecule-core has no Mac runner registered, so the
+    # job sat unassigned whenever the trigger fired. Verified 2026-05-02:
+    # this is the ONLY workflow in molecule-core/.github/workflows/ with
+    # a non-ubuntu runs-on.
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout staging
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        with:
+          fetch-depth: 0
+          ref: staging
+          token: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Configure git author
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+
+      - name: Check if staging already contains main
+        id: check
+        run: |
+          set -euo pipefail
+          git fetch origin main
+          if git merge-base --is-ancestor origin/main HEAD; then
+            echo "needs_sync=false" >> "$GITHUB_OUTPUT"
+            {
+              echo "## ✅ No-op"
+              echo
+              echo "staging already contains \`origin/main\` ($(git rev-parse --short=8 origin/main))."
+            } >> "$GITHUB_STEP_SUMMARY"
+          else
+            echo "needs_sync=true" >> "$GITHUB_OUTPUT"
+            MAIN_SHORT=$(git rev-parse --short=8 origin/main)
+            echo "main_short=${MAIN_SHORT}" >> "$GITHUB_OUTPUT"
+            echo "branch=auto-sync/main-${MAIN_SHORT}" >> "$GITHUB_OUTPUT"
+            echo "::notice::staging is missing main's tip (${MAIN_SHORT}) — opening sync PR"
+          fi
+
+      - name: Create auto-sync branch + merge main
+        if: steps.check.outputs.needs_sync == 'true'
+        id: prep
+        run: |
+          set -euo pipefail
+          BRANCH="${{ steps.check.outputs.branch }}"
+
+          # If a previous auto-sync run already opened a branch for the
+          # same main sha, prefer reusing it (idempotent behavior on
+          # workflow restart). Force-update from latest staging anyway
+          # so it absorbs any staging-side commits that landed since.
+          git checkout -B "$BRANCH"
+
+          if git merge --ff-only origin/main; then
+            echo "did_ff=true" >> "$GITHUB_OUTPUT"
+            echo "::notice::Fast-forwarded ${BRANCH} to origin/main"
+          else
+            echo "did_ff=false" >> "$GITHUB_OUTPUT"
+            if ! git merge --no-ff origin/main -m "chore: sync main → staging (auto)"; then
+              # Hygiene: leave the work tree clean before failing.
+              git merge --abort || true
+              {
+                echo "## ❌ Conflict"
+                echo
+                echo "Auto-merge \`main → staging\` failed with conflicts."
+                echo "A human needs to resolve manually."
+              } >> "$GITHUB_STEP_SUMMARY"
+              exit 1
+            fi
+          fi
+
+      - name: Push auto-sync branch
+        if: steps.check.outputs.needs_sync == 'true'
+        run: |
+          set -euo pipefail
+          # Force-with-lease so a concurrent auto-sync run can't
+          # silently clobber an in-flight branch we just updated. If a
+          # different writer touched the branch, we abort and the next
+          # run picks up the latest state.
+          git push --force-with-lease origin "${{ steps.check.outputs.branch }}"
+
+      - name: Open auto-sync PR + enable auto-merge
+        if: steps.check.outputs.needs_sync == 'true'
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BRANCH: ${{ steps.check.outputs.branch }}
+          MAIN_SHORT: ${{ steps.check.outputs.main_short }}
+          DID_FF: ${{ steps.prep.outputs.did_ff }}
+        run: |
+          set -euo pipefail
+
+          # Find existing PR for this branch (idempotent on workflow
+          # restart) before creating a new one.
+          PR_NUM=$(gh pr list --head "$BRANCH" --base staging --state open --json number --jq '.[0].number // ""')
+
+          if [ -z "$PR_NUM" ]; then
+            # Body lives in a temp file to keep the multi-line content
+            # out of the YAML block scalar (un-indented newlines inside
+            # an inline shell string break YAML parsing).
+            BODY_FILE=$(mktemp)
+            if [ "$DID_FF" = "true" ]; then
+              TITLE="chore: sync main → staging (auto, ff to ${MAIN_SHORT})"
+              cat > "$BODY_FILE" <<EOFBODY
+          Automated fast-forward of \`staging\` to \`origin/main\` (\`${MAIN_SHORT}\`). Staging has no in-flight commits that diverge from main. Merge queue lands this; no human action needed.
+
+          This PR is auto-generated by \`.github/workflows/auto-sync-main-to-staging.yml\` on every push to \`main\`. It exists because this repo's \`staging\` branch has a \`merge_queue\` ruleset that blocks direct pushes — even from the GitHub Actions integration.
+          EOFBODY
+            else
+              TITLE="chore: sync main → staging (auto, merge ${MAIN_SHORT})"
+              cat > "$BODY_FILE" <<EOFBODY
+          Automated merge of \`origin/main\` (\`${MAIN_SHORT}\`) into \`staging\`. Staging has commits main doesn't, so this is a non-ff merge that absorbs main's tip. Merge queue lands this.
+
+          This PR is auto-generated by \`.github/workflows/auto-sync-main-to-staging.yml\` on every push to \`main\`.
+          EOFBODY
+            fi
+
+            # gh pr create prints the URL on stdout; extract the PR number.
+            PR_URL=$(gh pr create \
+              --base staging \
+              --head "$BRANCH" \
+              --title "$TITLE" \
+              --body-file "$BODY_FILE")
+            PR_NUM=$(echo "$PR_URL" | grep -oE '[0-9]+$' | tail -1)
+            rm -f "$BODY_FILE"
+            echo "::notice::Opened PR #${PR_NUM}"
+          else
+            echo "::notice::Re-using existing PR #${PR_NUM} for ${BRANCH}"
+          fi
+
+          # Enable auto-merge — the merge queue picks it up once
+          # required gates are green. Use --merge for merge commits
+          # (matches the rest of this repo's PR convention).
+          if ! gh pr merge "$PR_NUM" --auto --merge 2>&1; then
+            echo "::warning::Failed to enable auto-merge on PR #${PR_NUM} — operator may need to merge manually."
+          fi
+
+          {
+            echo "## ✅ Auto-sync PR opened"
+            echo
+            echo "- Branch: \`$BRANCH\`"
+            echo "- PR: #$PR_NUM"
+            echo "- Strategy: $([ "$DID_FF" = "true" ] && echo "ff" || echo "merge commit")"
+            echo
+            echo "Merge queue lands the PR once required gates are green; no human action needed unless gates fail."
+          } >> "$GITHUB_STEP_SUMMARY"

.github/workflows/auto-tag-runtime.yml

@@ -38,7 +38,7 @@ jobs:
   tag:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           fetch-depth: 0    # need full tag history for `git describe` / sort
 

.github/workflows/block-internal-paths.yml

@@ -26,7 +26,7 @@ jobs:
     name: Block forbidden paths
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           fetch-depth: 2  # need previous commit to diff against on push events
 

.github/workflows/canary-staging.yml

@@ -66,7 +66,7 @@ jobs:
       E2E_RUN_ID: "canary-${{ github.run_id }}"
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Verify admin token present
         run: |
@@ -98,7 +98,7 @@ jobs:
       # next deploy window.
       - name: Open issue on failure
         if: failure()
-        uses: actions/github-script@v7
+        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
         env:
           # Inject the workflow path explicitly — context.workflow is
           # the *name*, not the file path the actions API needs.
@@ -165,7 +165,7 @@ jobs:
 
       - name: Auto-close canary issue on success
         if: success()
-        uses: actions/github-script@v7
+        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
         with:
           script: |
             const title = '🔴 Canary failing: staging SaaS smoke';

.github/workflows/canary-verify.yml

@@ -40,7 +40,7 @@ jobs:
       smoke_ran: ${{ steps.smoke.outputs.ran }}
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Compute sha
         id: compute
@@ -143,7 +143,7 @@ jobs:
     if: ${{ needs.canary-smoke.result == 'success' && needs.canary-smoke.outputs.smoke_ran == 'true' }}
     runs-on: ubuntu-latest
     steps:
-      - uses: imjasonh/setup-crane@v0.4
+      - uses: imjasonh/setup-crane@6da1ae018866400525525ce74ff892880c099987 # v0.5
 
       - name: GHCR login
         run: |

.github/workflows/cascade-list-drift-gate.yml

@@ -0,0 +1,39 @@
+name: cascade-list-drift-gate
+
+# Structural gate: TEMPLATES list in publish-runtime.yml must match
+# manifest.json's workspace_templates exactly. Closes the recurrence
+# path of PR #2556 (the data fix) and is the first concrete deliverable
+# of RFC #388 PR-3.
+#
+# Why a gate, not just discipline: PR #2536 pruned the manifest, but the
+# cascade list wasn't updated for ~weeks before someone (PR #2556)
+# noticed during an unrelated audit. During that window, codex never
+# rebuilt on a runtime publish. A structural gate catches the drift
+# the same day either file changes.
+#
+# Triggers narrowly to keep CI quiet: only on PRs that actually change
+# one of the two files. The path-filtered split + always-emit-result
+# pattern (memory: "Required check names need a job that always runs")
+# is unnecessary here because the workflow IS the check name and PR
+# branch protection should require it directly. Future-proof: if this
+# becomes a required check, add a no-op aggregator with always() so the
+# name still emits when paths don't match.
+
+on:
+  pull_request:
+    branches: [staging, main]
+    paths:
+      - manifest.json
+      - .github/workflows/publish-runtime.yml
+      - scripts/check-cascade-list-vs-manifest.sh
+
+permissions:
+  contents: read
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+      - name: Check cascade list matches manifest
+        run: bash scripts/check-cascade-list-vs-manifest.sh

.github/workflows/check-merge-group-trigger.yml

@@ -36,7 +36,7 @@ jobs:
     permissions:
       contents: read
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
       - name: Verify merge_group trigger on required-check workflows
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/check-migration-collisions.yml

@@ -0,0 +1,58 @@
+name: Check migration collisions
+
+# Hard gate (#2341): fails a PR that adds a migration prefix already
+# claimed by the base branch or another open PR. Caught manually 2026-04-30
+# during PR #2276 rebase: 044_runtime_image_pins collided with
+# 044_platform_inbound_secret from RFC #2312. This workflow makes that
+# check automatic.
+#
+# Trigger model: pull_request only — there's no value running this on
+# pushes to staging or main (those are post-merge; the gate must fire
+# pre-merge to be useful). Path filter scopes to PRs that actually touch
+# migrations.
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened]
+    paths:
+      - 'workspace-server/migrations/**'
+      - 'scripts/ops/check_migration_collisions.py'
+      - '.github/workflows/check-migration-collisions.yml'
+
+permissions:
+  contents: read
+  # gh pr list/diff need read access to other PRs
+  pull-requests: read
+
+jobs:
+  check:
+    name: Migration version collision check
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        with:
+          # Need history to diff against base ref
+          fetch-depth: 0
+
+      - name: Detect collisions
+        env:
+          PR_NUMBER: ${{ github.event.pull_request.number }}
+          BASE_REF: origin/${{ github.event.pull_request.base.ref }}
+          HEAD_REF: ${{ github.event.pull_request.head.sha }}
+          GITHUB_REPOSITORY: ${{ github.repository }}
+          # gh CLI uses GH_TOKEN from env
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          # Ensure the named base ref exists locally. checkout@v4 with
+          # fetch-depth=0 pulls full history, but the explicit fetch is
+          # cheap insurance against form-of-ref differences across runs.
+          #
+          # IMPORTANT: do NOT pass --depth=1 here. The script below uses
+          # `git diff origin/<base>...<head>` (three-dot, merge-base form),
+          # which fails with "fatal: no merge base" if the base ref is
+          # shallow. The auto-promote staging→main PR (#2361) was blocked
+          # by exactly this for ~5h on 2026-04-30 — the depth=1 fetch
+          # overwrote checkout@v4's full-history clone with a shallow tip.
+          git fetch origin "${{ github.event.pull_request.base.ref }}" || true
+          python3 scripts/ops/check_migration_collisions.py

.github/workflows/ci.yml

@@ -32,7 +32,7 @@ jobs:
       python: ${{ steps.check.outputs.python }}
       scripts: ${{ steps.check.outputs.scripts }}
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           fetch-depth: 0
       - id: check
@@ -63,29 +63,42 @@ jobs:
           echo "python=$(echo "$DIFF" | grep -qE '^workspace/|^\.github/workflows/ci\.yml$' && echo true || echo false)" >> "$GITHUB_OUTPUT"
           echo "scripts=$(echo "$DIFF" | grep -qE '^tests/e2e/|^scripts/|^infra/scripts/|^\.github/workflows/ci\.yml$' && echo true || echo false)" >> "$GITHUB_OUTPUT"
 
+  # Platform (Go) is a required check on staging. Always-run + per-step
+  # gating (see Canvas (Next.js) for the rationale and the failure mode
+  # this avoids).
   platform-build:
     name: Platform (Go)
     needs: changes
-    if: needs.changes.outputs.platform == 'true'
     runs-on: ubuntu-latest
     defaults:
       run:
         working-directory: workspace-server
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-go@v5
+      - if: needs.changes.outputs.platform != 'true'
+        working-directory: .
+        run: echo "No platform/** changes — skipping real build steps; this job always runs to satisfy the required-check name on branch protection."
+      - if: needs.changes.outputs.platform == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.changes.outputs.platform == 'true'
+        uses: actions/setup-go@40f1582b2485089dde7abd97c1529aa768e1baff # v5
         with:
           go-version: 'stable'
-      - run: go mod download
-      - run: go build ./cmd/server
+      - if: needs.changes.outputs.platform == 'true'
+        run: go mod download
+      - if: needs.changes.outputs.platform == 'true'
+        run: go build ./cmd/server
       # CLI (molecli) moved to standalone repo: github.com/Molecule-AI/molecule-cli
-      - run: go vet ./... || true
-      - name: Run golangci-lint
+      - if: needs.changes.outputs.platform == 'true'
+        run: go vet ./... || true
+      - if: needs.changes.outputs.platform == 'true'
+        name: Run golangci-lint
         run: golangci-lint run --timeout 3m ./... || true
-      - name: Run tests with race detection and coverage
+      - if: needs.changes.outputs.platform == 'true'
+        name: Run tests with race detection and coverage
         run: go test -race -coverprofile=coverage.out ./...
 
-      - name: Per-file coverage report
+      - if: needs.changes.outputs.platform == 'true'
+        name: Per-file coverage report
         # Advisory — lists every source file with its coverage so reviewers
         # can see at-a-glance where gaps are. Sorted ascending so the worst
         # offenders float to the top. Does NOT fail the build; the hard
@@ -98,7 +111,8 @@ jobs:
                    END {for (f in s) printf "%6.1f%%  %s\n", s[f]/c[f], f}' \
             | sort -n
 
-      - name: Check coverage thresholds
+      - if: needs.changes.outputs.platform == 'true'
+        name: Check coverage thresholds
         # Enforces two gates from #1823 Layer 1:
         #   1. Total floor (25% — ratchet plan in COVERAGE_FLOOR.md).
         #   2. Per-file floor — non-test .go files in security-critical
@@ -178,23 +192,55 @@ jobs:
             exit 1
           fi
 
+  # Canvas (Next.js) — required check, always runs. See platform-build
+  # comment above for the rationale.
+  #
+  # Supersedes the canvas-build-noop pattern attempted in PR #2321: two
+  # jobs sharing `name:` doesn't actually satisfy branch protection
+  # because the SKIPPED check run sibling is treated as not-passed
+  # regardless of how many SUCCESS siblings it has. Verified empirically
+  # on PR #2314 — mergeStateStatus stayed BLOCKED until I collapsed to
+  # a single-job-with-conditional-steps shape.
   canvas-build:
     name: Canvas (Next.js)
     needs: changes
-    if: needs.changes.outputs.canvas == 'true'
     runs-on: ubuntu-latest
     defaults:
       run:
         working-directory: canvas
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
+      - if: needs.changes.outputs.canvas != 'true'
+        working-directory: .
+        run: echo "No canvas/** changes — skipping real build steps; this job always runs to satisfy the required-check name on branch protection."
+      - if: needs.changes.outputs.canvas == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.changes.outputs.canvas == 'true'
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
           node-version: '22'
-      - run: rm -f package-lock.json && npm install
-      - run: npm run build
-      - name: Run tests
-        run: npx vitest run
+      - if: needs.changes.outputs.canvas == 'true'
+        run: rm -f package-lock.json && npm install
+      - if: needs.changes.outputs.canvas == 'true'
+        run: npm run build
+      - if: needs.changes.outputs.canvas == 'true'
+        name: Run tests with coverage
+        # Coverage instrumentation is configured in canvas/vitest.config.ts
+        # (provider: v8, reporters: text + html + json-summary). Step 2 of
+        # #1815 — wires coverage into CI so we get a baseline visible on
+        # every PR. No threshold gate yet; thresholds dial in (Step 3, also
+        # tracked in #1815) after the team sees what current coverage is.
+        # Per the inline comment in vitest.config.ts: "first land
+        # observability so we can see the baseline, then dial in
+        # thresholds + a hard gate" — this PR ships the observability half.
+        run: npx vitest run --coverage
+      - name: Upload coverage summary as artifact
+        if: needs.changes.outputs.canvas == 'true' && always()
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4.6.2
+        with:
+          name: canvas-coverage-${{ github.run_id }}
+          path: canvas/coverage/
+          retention-days: 7
+          if-no-files-found: warn
 
   # MCP Server + SDK removed from CI — now in standalone repos:
   # - github.com/Molecule-AI/molecule-mcp-server (npm CI)
@@ -204,14 +250,19 @@ jobs:
   # It now has workflow-level concurrency (cancel-in-progress: false) so
   # new pushes queue the E2E run rather than cancelling it at the run level.
 
+  # Shellcheck (E2E scripts) — required check, always runs. See
+  # platform-build for the rationale.
   shellcheck:
     name: Shellcheck (E2E scripts)
     needs: changes
-    if: needs.changes.outputs.scripts == 'true'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-      - name: Run shellcheck on tests/e2e/*.sh and infra/scripts/*.sh
+      - if: needs.changes.outputs.scripts != 'true'
+        run: echo "No tests/e2e/ or infra/scripts/ changes — skipping real shellcheck; this job always runs to satisfy the required-check name on branch protection."
+      - if: needs.changes.outputs.scripts == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.changes.outputs.scripts == 'true'
+        name: Run shellcheck on tests/e2e/*.sh and infra/scripts/*.sh
         # shellcheck is pre-installed on ubuntu-latest runners (via apt).
         # infra/scripts/ is included because setup.sh + nuke.sh gate the
         # README quickstart — a shellcheck regression there silently breaks
@@ -265,10 +316,11 @@ jobs:
             "repos/${{ github.repository }}/commits/${{ github.sha }}/comments" \
             --field "body=@/tmp/deploy-reminder.md"
 
+  # Python Lint & Test — required check, always runs. See platform-build
+  # for the rationale.
   python-lint:
     name: Python Lint & Test
     needs: changes
-    if: needs.changes.outputs.python == 'true'
     runs-on: ubuntu-latest
     env:
       WORKSPACE_ID: test
@@ -276,16 +328,23 @@ jobs:
       run:
         working-directory: workspace
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-python@v5
+      - if: needs.changes.outputs.python != 'true'
+        working-directory: .
+        run: echo "No workspace/** changes — skipping real lint+test; this job always runs to satisfy the required-check name on branch protection."
+      - if: needs.changes.outputs.python == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.changes.outputs.python == 'true'
+        uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: '3.11'
           cache: pip
           cache-dependency-path: workspace/requirements.txt
-      - run: pip install -r requirements.txt pytest pytest-asyncio pytest-cov
+      - if: needs.changes.outputs.python == 'true'
+        run: pip install -r requirements.txt pytest pytest-asyncio pytest-cov
       # Coverage flags + fail-under floor moved into workspace/pytest.ini
       # (issue #1817) so local `pytest` and CI use identical config.
-      - run: python -m pytest --tb=short
+      - if: needs.changes.outputs.python == 'true'
+        run: python -m pytest --tb=short
 
       # SDK + plugin validation moved to standalone repo:
       # github.com/Molecule-AI/molecule-sdk-python

.github/workflows/codeql.yml

@@ -53,14 +53,14 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Checkout sibling plugin repo
         # Same reasoning as publish-workspace-server-image.yml — the Go
         # module's replace directive needs the plugin source so
         # CodeQL's "go build" phase can resolve.
         if: matrix.language == 'go'
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           repository: Molecule-AI/molecule-ai-plugin-github-app-auth
           path: molecule-ai-plugin-github-app-auth
@@ -69,7 +69,7 @@ jobs:
       # jq is pre-installed on ubuntu-latest — no setup step needed.
 
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@v3
+        uses: github/codeql-action/init@95e58e9a2cdfd71adc6e0353d5c52f41a045d225 # v4.35.2
         with:
           languages: ${{ matrix.language }}
           # security-extended widens past the default to include the
@@ -77,11 +77,11 @@ jobs:
           queries: security-extended
 
       - name: Autobuild
-        uses: github/codeql-action/autobuild@v3
+        uses: github/codeql-action/autobuild@95e58e9a2cdfd71adc6e0353d5c52f41a045d225 # v4.35.2
 
       - name: Perform CodeQL Analysis
         id: analyze
-        uses: github/codeql-action/analyze@v3
+        uses: github/codeql-action/analyze@95e58e9a2cdfd71adc6e0353d5c52f41a045d225 # v4.35.2
         with:
           category: "/language:${{ matrix.language }}"
           # upload: never — GHAS isn't enabled on this repo, so the
@@ -121,7 +121,7 @@ jobs:
         # 14-day retention — longer than default 3, short enough not
         # to bloat quota.
         if: always()
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
         with:
           name: codeql-sarif-${{ matrix.language }}
           path: sarif-results/${{ matrix.language }}/

.github/workflows/continuous-synth-e2e.yml

@@ -0,0 +1,169 @@
+name: Continuous synthetic E2E (staging)
+
+# Hard gate (#2342): cron-driven full-lifecycle E2E that catches
+# regressions visible only at runtime — schema drift, deployment-pipeline
+# gaps, vendor outages, env-var rotations, DNS / CF / Railway side-effects.
+#
+# Why this gate exists:
+#   PR-time CI catches code-level regressions but not deployment-time or
+#   integration-time ones. Today's empirical data:
+#     • #2345 (A2A v0.2 silent drop) — passed all unit tests, broke at
+#       JSON-RPC parse layer between sender and receiver. Visible only
+#       to a sender exercising the full path.
+#     • RFC #2312 chat upload — landed on staging-branch but never
+#       reached staging tenants because publish-workspace-server-image
+#       was main-only. Caught by manual dogfooding hours after deploy.
+#   Both would have surfaced within 15-20 min of regression if a
+#   continuous synth-E2E was running.
+#
+# Cadence: every 20 min (3x/hour). The script is conservatively
+# bounded at 10 min wall-clock; even on degraded staging it should
+# finish before the next firing. cron-overlap is guarded by the
+# concurrency group below.
+#
+# Cost: ~3 runs/hour × 5-10 min × $0.008/min GHA = ~$0.50-$1/day.
+# Plus a fresh tenant provisioned + torn down each run (Railway +
+# AWS pennies). Negligible.
+#
+# Failure handling: when the run fails, the workflow exits non-zero
+# and GitHub's standard email/notification path fires. Operators
+# can subscribe to this workflow's failure channel for paging-grade
+# alerting.
+
+on:
+  schedule:
+    # Every 20 minutes, on the :00 :20 :40. Offsets the existing :15
+    # sweep-cf-orphans and :45 sweep-cf-tunnels so the three
+    # operations don't all hit Cloudflare/AWS at the same minute.
+    - cron: '0,20,40 * * * *'
+  workflow_dispatch:
+    inputs:
+      runtime:
+        description: "Runtime to provision (langgraph = fastest, default; hermes = slower but covers SDK-native path; claude-code = needs OAUTH token in tenant env)"
+        required: false
+        default: "langgraph"
+        type: string
+      keep_org:
+        description: "Skip teardown for post-mortem debugging (only manual dispatch — never set this for cron runs)"
+        required: false
+        default: false
+        type: boolean
+
+permissions:
+  contents: read
+  # No issue-write here — failures surface as red runs in the workflow
+  # history. If you want auto-issue-on-fail, add a follow-up step that
+  # uses gh issue create gated on `if: failure()`. Keeping the surface
+  # minimal until that's actually wanted.
+
+# Serialize so two firings can never overlap. Cron firing every 20 min
+# but scripts conservatively bounded at 10 min — overlap shouldn't
+# happen in steady state, but if a run hangs we don't want N more
+# stacking up.
+concurrency:
+  group: continuous-synth-e2e
+  cancel-in-progress: false
+
+jobs:
+  synth:
+    name: Synthetic E2E against staging
+    runs-on: ubuntu-latest
+    timeout-minutes: 12
+    env:
+      # langgraph default keeps cold-start under 5 min on staging EC2.
+      # hermes is slower (~7-10 min) and isn't needed for the
+      # regression class this gate exists to catch (deployment-pipeline
+      # + schema-drift + integration). Operators can pick hermes via
+      # workflow_dispatch when they need to exercise the SDK-native
+      # session path.
+      E2E_RUNTIME: ${{ github.event.inputs.runtime || 'langgraph' }}
+      # Bound to 10 min so a stuck provision fails the run instead of
+      # holding up the next cron firing. 15-min default in the script
+      # is for the on-PR full lifecycle where we have more headroom.
+      E2E_PROVISION_TIMEOUT_SECS: '600'
+      # Slug suffix — namespaced "synth-" so these runs are
+      # distinguishable from PR-driven runs in CP admin.
+      E2E_RUN_ID: synth-${{ github.run_id }}
+      # Forced false for cron; respected for manual dispatch
+      E2E_KEEP_ORG: ${{ github.event.inputs.keep_org == 'true' && '1' || '' }}
+      MOLECULE_CP_URL: ${{ vars.STAGING_CP_URL || 'https://staging-api.moleculesai.app' }}
+      MOLECULE_ADMIN_TOKEN: ${{ secrets.CP_STAGING_ADMIN_API_TOKEN }}
+      # Provisioned tenant's default model (langgraph: openai:gpt-4.1-mini)
+      # needs OPENAI_API_KEY at first call. Sibling workflows
+      # e2e-staging-saas.yml + canary-staging.yml use the same secret;
+      # without this wire-up the tenant boots, accepts a2a messages,
+      # then returns "Could not resolve authentication method" — masked
+      # earlier by the a2a-sdk task-mode contract bugs PR #2558+#2563
+      # fixed. tests/e2e/test_staging_full_saas.sh:325 reads this and
+      # persists it as a workspace_secret on tenant create.
+      E2E_OPENAI_API_KEY: ${{ secrets.MOLECULE_STAGING_OPENAI_KEY }}
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Verify required secret present
+        run: |
+          # Schedule-vs-dispatch hardening (mirrors the sweep-cf-* and
+          # redeploy-tenants-on-* workflows): hard-fail on missing secret
+          # for cron firing so a misconfigured-repo doesn't silently
+          # report green while doing nothing. Soft-skip on operator
+          # dispatch — operators can dispatch ad-hoc to verify a fix
+          # without setting up the secret first.
+          if [ -z "${MOLECULE_ADMIN_TOKEN:-}" ]; then
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::CP_STAGING_ADMIN_API_TOKEN not set — synth E2E cannot run"
+              echo "::warning::Set it at Settings → Secrets and Variables → Actions"
+              exit 0
+            fi
+            echo "::error::CP_STAGING_ADMIN_API_TOKEN secret missing — synth E2E cannot run"
+            echo "::error::Set it at Settings → Secrets and Variables → Actions; pull from staging-CP's CP_ADMIN_API_TOKEN env in Railway."
+            exit 1
+          fi
+
+      - name: Install required tools
+        run: |
+          # The script depends on jq + curl (already on ubuntu-latest)
+          # and python3 (likewise). Verify they're all present so we
+          # fail fast on a runner image regression rather than mid-script.
+          for cmd in jq curl python3; do
+            command -v "$cmd" >/dev/null 2>&1 || {
+              echo "::error::required tool '$cmd' not on PATH — runner image regression?"
+              exit 1
+            }
+          done
+
+      - name: Run synthetic E2E
+        # The script handles its own teardown via EXIT trap; even on
+        # failure (timeout, assertion), the org is deprovisioned and
+        # leaks are reported. Exit code propagates from the script.
+        run: |
+          bash tests/e2e/test_staging_full_saas.sh
+
+      - name: Failure summary
+        # Runs only on failure. Adds a job summary so the workflow run
+        # page shows a quick "what happened" instead of forcing readers
+        # to scroll through script output.
+        if: failure()
+        run: |
+          {
+            echo "## Continuous synth E2E failed"
+            echo ""
+            echo "**Run ID:** ${{ github.run_id }}"
+            echo "**Trigger:** ${{ github.event_name }}"
+            echo "**Runtime:** ${E2E_RUNTIME}"
+            echo "**Slug:** synth-${{ github.run_id }}"
+            echo ""
+            echo "### What this means"
+            echo ""
+            echo "Staging just regressed on a path that previously worked. Likely classes:"
+            echo "- Schema mismatch between sender and receiver (#2345 class)"
+            echo "- Deployment-pipeline gap (RFC #2312 / staging-tenant-image-stale class)"
+            echo "- Vendor outage (Cloudflare, Railway, AWS, GHCR)"
+            echo "- Staging-CP env var rotation"
+            echo ""
+            echo "### Next steps"
+            echo ""
+            echo "1. Check the script output above for the assertion that failed"
+            echo "2. If it's a vendor outage, no action needed — next firing in ~20 min"
+            echo "3. If it's a code regression, find the causing PR via \`git log\` against last green run and revert/fix"
+            echo "4. Keep an eye on the next 1-2 firings — flake vs persistent fail differs in priority"
+          } >> "$GITHUB_STEP_SUMMARY"

.github/workflows/e2e-api.yml

@@ -1,27 +1,79 @@
 name: E2E API Smoke Test
 # Extracted from ci.yml so workflow-level concurrency can protect this job
 # from run-level cancellation (issue #458).
+#
+# Trigger model (revised 2026-04-29):
+#
+# Always FIRES on push/pull_request to staging+main. Real work is gated
+# per-step on `needs.detect-changes.outputs.api` — when paths under
+# `workspace-server/`, `tests/e2e/`, or this workflow file haven't
+# changed, the no-op step alone runs and emits SUCCESS for the
+# `E2E API Smoke Test` check, satisfying branch protection without
+# spending CI cycles. See the in-job comment on the `e2e-api` job for
+# why this is one job (not two-jobs-sharing-name) and the 2026-04-29
+# PR #2264 incident that drove the consolidation.
 
 on:
   push:
     branches: [main, staging]
-    paths:
-      - 'workspace-server/**'
-      - 'tests/e2e/**'
-      - '.github/workflows/e2e-api.yml'
   pull_request:
     branches: [main, staging]
-    paths:
-      - 'workspace-server/**'
-      - 'tests/e2e/**'
-      - '.github/workflows/e2e-api.yml'
+  workflow_dispatch:
 
 concurrency:
-  group: e2e-api-${{ github.ref }}
+  # Per-SHA grouping (changed 2026-04-28 from per-ref). Per-ref had the
+  # same auto-promote-staging brittleness as e2e-staging-canvas — back-
+  # to-back staging pushes share refs/heads/staging, so the older push's
+  # queued run gets cancelled when a newer push lands. Auto-promote-
+  # staging then sees `completed/cancelled` for the older SHA and stays
+  # put; the newer SHA's gates may eventually save the day, but if the
+  # newer push gets cancelled too, we deadlock.
+  #
+  # See e2e-staging-canvas.yml's identical concurrency block for the full
+  # rationale and the 2026-04-28 incident reference.
+  group: e2e-api-${{ github.event.pull_request.head.sha || github.sha }}
   cancel-in-progress: false
 
 jobs:
+  detect-changes:
+    runs-on: ubuntu-latest
+    outputs:
+      api: ${{ steps.decide.outputs.api }}
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: dorny/paths-filter@fbd0ab8f3e69293af611ebaee6363fc25e6d187d # v4.0.1
+        id: filter
+        with:
+          filters: |
+            api:
+              - 'workspace-server/**'
+              - 'tests/e2e/**'
+              - '.github/workflows/e2e-api.yml'
+      - id: decide
+        # Always run real work for manual dispatch — no diff context to
+        # filter against and ops dispatching this expects the suite to
+        # actually exercise the platform.
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+            echo "api=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "api=${{ steps.filter.outputs.api }}" >> "$GITHUB_OUTPUT"
+          fi
+
+  # ONE job (no job-level `if:`) that always runs and reports under the
+  # required-check name `E2E API Smoke Test`. Real work is gated per-step
+  # on `needs.detect-changes.outputs.api`. Reason: GitHub registers a
+  # check run for every job that matches `name:`, and a job-level
+  # `if: false` produces a SKIPPED check run. Branch protection treats
+  # all check runs with a matching context name on the latest commit as a
+  # SET — any SKIPPED in the set fails the required-check eval, even with
+  # SUCCESS siblings. Verified 2026-04-29 on PR #2264 (staging→main):
+  # 4 check runs (2 SKIPPED + 2 SUCCESS) at the head SHA blocked
+  # promotion despite all real work succeeding. Collapsing to a single
+  # always-running job with conditional steps emits exactly one SUCCESS
+  # check run regardless of paths filter — branch-protection-clean.
   e2e-api:
+    needs: detect-changes
     name: E2E API Smoke Test
     runs-on: ubuntu-latest
     timeout-minutes: 15
@@ -32,13 +84,21 @@ jobs:
       PG_CONTAINER: molecule-ci-postgres
       REDIS_CONTAINER: molecule-ci-redis
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-go@v5
+      - name: No-op pass (paths filter excluded this commit)
+        if: needs.detect-changes.outputs.api != 'true'
+        run: |
+          echo "No workspace-server / tests/e2e / workflow changes — E2E API gate satisfied without running tests."
+          echo "::notice::E2E API Smoke Test no-op pass (paths filter excluded this commit)."
+      - if: needs.detect-changes.outputs.api == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.detect-changes.outputs.api == 'true'
+        uses: actions/setup-go@40f1582b2485089dde7abd97c1529aa768e1baff # v5
         with:
           go-version: 'stable'
           cache: true
           cache-dependency-path: workspace-server/go.sum
       - name: Start Postgres (docker)
+        if: needs.detect-changes.outputs.api == 'true'
         run: |
           docker rm -f "$PG_CONTAINER" 2>/dev/null || true
           docker run -d --name "$PG_CONTAINER" -e POSTGRES_USER=dev -e POSTGRES_PASSWORD=dev -e POSTGRES_DB=molecule -p 15432:5432 postgres:16
@@ -53,6 +113,7 @@ jobs:
           docker logs "$PG_CONTAINER" || true
           exit 1
       - name: Start Redis (docker)
+        if: needs.detect-changes.outputs.api == 'true'
         run: |
           docker rm -f "$REDIS_CONTAINER" 2>/dev/null || true
           docker run -d --name "$REDIS_CONTAINER" -p 16379:6379 redis:7
@@ -67,14 +128,17 @@ jobs:
           docker logs "$REDIS_CONTAINER" || true
           exit 1
       - name: Build platform
+        if: needs.detect-changes.outputs.api == 'true'
         working-directory: workspace-server
         run: go build -o platform-server ./cmd/server
       - name: Start platform (background)
+        if: needs.detect-changes.outputs.api == 'true'
         working-directory: workspace-server
         run: |
           ./platform-server > platform.log 2>&1 &
           echo $! > platform.pid
       - name: Wait for /health
+        if: needs.detect-changes.outputs.api == 'true'
         run: |
           for i in $(seq 1 30); do
             if curl -sf http://localhost:8080/health > /dev/null; then
@@ -87,6 +151,7 @@ jobs:
           cat workspace-server/platform.log || true
           exit 1
       - name: Assert migrations applied
+        if: needs.detect-changes.outputs.api == 'true'
         run: |
           tables=$(docker exec "$PG_CONTAINER" psql -U dev -d molecule -tAc "SELECT count(*) FROM information_schema.tables WHERE table_schema='public' AND table_name='workspaces'")
           if [ "$tables" != "1" ]; then
@@ -96,25 +161,28 @@ jobs:
           fi
           echo "Migrations OK"
       - name: Run E2E API tests
+        if: needs.detect-changes.outputs.api == 'true'
         run: bash tests/e2e/test_api.sh
       - name: Run notify-with-attachments E2E
+        if: needs.detect-changes.outputs.api == 'true'
         run: bash tests/e2e/test_notify_attachments_e2e.sh
       - name: Run priority-runtimes E2E (claude-code + hermes — skips when keys absent)
-        # Validates the test script itself runs cleanly even with no LLM
-        # keys (both phases skip gracefully). The wire-real coverage with
-        # actual keys runs in canary-staging.yml + e2e-staging-saas.yml.
+        if: needs.detect-changes.outputs.api == 'true'
         run: bash tests/e2e/test_priority_runtimes_e2e.sh
+      - name: Run poll-mode + since_id cursor E2E (#2339)
+        if: needs.detect-changes.outputs.api == 'true'
+        run: bash tests/e2e/test_poll_mode_e2e.sh
       - name: Dump platform log on failure
-        if: failure()
+        if: failure() && needs.detect-changes.outputs.api == 'true'
         run: cat workspace-server/platform.log || true
       - name: Stop platform
-        if: always()
+        if: always() && needs.detect-changes.outputs.api == 'true'
         run: |
           if [ -f workspace-server/platform.pid ]; then
             kill "$(cat workspace-server/platform.pid)" 2>/dev/null || true
           fi
       - name: Stop service containers
-        if: always()
+        if: always() && needs.detect-changes.outputs.api == 'true'
         run: |
           docker rm -f "$PG_CONTAINER" 2>/dev/null || true
           docker rm -f "$REDIS_CONTAINER" 2>/dev/null || true

.github/workflows/e2e-staging-canvas.yml

@@ -13,16 +13,18 @@ name: E2E Staging Canvas (Playwright)
 # workflow — mirrors what PR #1891 does for e2e-api.yml.
 
 on:
+  # Trigger model (revised 2026-04-29):
+  #
+  # Always fires on push/pull_request; real work is gated per-step on
+  # `needs.detect-changes.outputs.canvas`. When canvas/ paths haven't
+  # changed, the no-op step alone runs and emits SUCCESS for the
+  # `Canvas tabs E2E` check, satisfying branch protection without
+  # spending CI cycles. See e2e-api.yml for the rationale on why this
+  # is a single job rather than two-jobs-sharing-name.
   push:
     branches: [main, staging]
-    paths:
-      - 'canvas/**'
-      - '.github/workflows/e2e-staging-canvas.yml'
   pull_request:
     branches: [main, staging]
-    paths:
-      - 'canvas/**'
-      - '.github/workflows/e2e-staging-canvas.yml'
   workflow_dispatch:
   schedule:
     # Weekly on Sunday 08:00 UTC — catches Chrome / Playwright / Next.js
@@ -30,11 +32,59 @@ on:
     - cron: '0 8 * * 0'
 
 concurrency:
-  group: e2e-staging-canvas
+  # Per-SHA grouping (changed 2026-04-28 from a single global group). The
+  # global group made auto-promote-staging brittle: when a staging push
+  # queued behind an in-flight run and a third entrant (a PR run, a
+  # follow-on push) entered the group, the staging push got cancelled —
+  # leaving auto-promote-staging looking at `completed/cancelled` for a
+  # required gate and refusing to advance main. Observed 2026-04-28
+  # 23:51-23:53 on staging tip 3f99fede.
+  #
+  # The original intent of the global group was to throttle parallel
+  # E2E provisions (each spins a fresh EC2). At our scale that throttle
+  # isn't worth the correctness cost — fresh-org-per-run isolates the
+  # state, and the cost of two parallel runs (~$0.001/min × 10min × 2)
+  # is rounding error vs. the cost of a stuck pipeline.
+  #
+  # Per-SHA still dedupes accidental double-triggers for the SAME SHA.
+  # It does NOT cancel obsolete-PR-version runs on force-push; that
+  # wasted CI is acceptable given the alternative is losing staging-tip
+  # data that auto-promote-staging needs.
+  group: e2e-staging-canvas-${{ github.event.pull_request.head.sha || github.sha }}
   cancel-in-progress: false
 
 jobs:
+  detect-changes:
+    runs-on: ubuntu-latest
+    outputs:
+      canvas: ${{ steps.decide.outputs.canvas }}
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: dorny/paths-filter@fbd0ab8f3e69293af611ebaee6363fc25e6d187d # v4.0.1
+        id: filter
+        with:
+          filters: |
+            canvas:
+              - 'canvas/**'
+              - '.github/workflows/e2e-staging-canvas.yml'
+      - id: decide
+        # Always run real tests for manual dispatch and the weekly cron —
+        # both exist precisely to exercise the suite, regardless of diff.
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ] || [ "${{ github.event_name }}" = "schedule" ]; then
+            echo "canvas=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "canvas=${{ steps.filter.outputs.canvas }}" >> "$GITHUB_OUTPUT"
+          fi
+
+  # ONE job (no job-level `if:`) that always runs and reports under the
+  # required-check name `Canvas tabs E2E`. Real work is gated per-step on
+  # `needs.detect-changes.outputs.canvas`. See e2e-api.yml for the full
+  # rationale — same path-filter check-name parity issue blocked PR #2264
+  # (staging→main) on 2026-04-29 because branch protection treats matching-
+  # name check runs as a SET, and any SKIPPED member fails the eval.
   playwright:
+    needs: detect-changes
     name: Canvas tabs E2E
     runs-on: ubuntu-latest
     timeout-minutes: 40
@@ -49,9 +99,18 @@ jobs:
         working-directory: canvas
 
     steps:
-      - uses: actions/checkout@v4
+      - name: No-op pass (paths filter excluded this commit)
+        if: needs.detect-changes.outputs.canvas != 'true'
+        working-directory: .
+        run: |
+          echo "No canvas / workflow changes — E2E Staging Canvas gate satisfied without running tests."
+          echo "::notice::E2E Staging Canvas no-op pass (paths filter excluded this commit)."
+
+      - if: needs.detect-changes.outputs.canvas == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Verify admin token present
+        if: needs.detect-changes.outputs.canvas == 'true'
         run: |
           if [ -z "$MOLECULE_ADMIN_TOKEN" ]; then
             echo "::error::Missing MOLECULE_STAGING_ADMIN_TOKEN"
@@ -59,74 +118,74 @@ jobs:
           fi
 
       - name: Set up Node
-        uses: actions/setup-node@v4
+        if: needs.detect-changes.outputs.canvas == 'true'
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
           node-version: '20'
           cache: 'npm'
           cache-dependency-path: canvas/package-lock.json
 
       - name: Install canvas deps
+        if: needs.detect-changes.outputs.canvas == 'true'
         run: npm ci
 
       - name: Install Playwright browsers
+        if: needs.detect-changes.outputs.canvas == 'true'
         run: npx playwright install --with-deps chromium
 
       - name: Run staging canvas E2E
+        if: needs.detect-changes.outputs.canvas == 'true'
         run: npx playwright test --config=playwright.staging.config.ts
 
       - name: Upload Playwright report on failure
-        if: failure()
-        uses: actions/upload-artifact@v4
+        if: failure() && needs.detect-changes.outputs.canvas == 'true'
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
         with:
           name: playwright-report-staging
           path: canvas/playwright-report-staging/
           retention-days: 14
 
       - name: Upload screenshots on failure
-        if: failure()
-        uses: actions/upload-artifact@v4
+        if: failure() && needs.detect-changes.outputs.canvas == 'true'
+        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
         with:
           name: playwright-screenshots
           path: canvas/test-results/
           retention-days: 14
 
-      # Safety-net teardown mirrors the bash-harness workflow — if
-      # globalTeardown didn't run (worker crash, runner cancel), this
-      # step sweeps any e2e-canvas-* org tagged with today's date.
+      # Safety-net teardown — fires only when Playwright's globalTeardown
+      # didn't (worker crash, runner cancel). Reads the slug from
+      # canvas/.playwright-staging-state.json (written by staging-setup
+      # as its first action, before any CP call) and deletes only that
+      # slug.
+      #
+      # Earlier versions of this step pattern-swept `e2e-canvas-<today>-*`
+      # orgs to compensate for setup-crash-before-state-file-write. That
+      # over-aggressive cleanup raced concurrent canvas-E2E runs and
+      # poisoned each other's tenants — observed 2026-04-30 when three
+      # real-test runs killed each other mid-test, surfacing as
+      # `getaddrinfo ENOTFOUND` once CP had cleaned up the just-deleted
+      # DNS record. Pattern-sweep removed; setup now writes the state
+      # file before any CP work, so the slug is always recoverable.
       - name: Teardown safety net
-        if: always()
+        if: always() && needs.detect-changes.outputs.canvas == 'true'
         env:
           ADMIN_TOKEN: ${{ secrets.MOLECULE_STAGING_ADMIN_TOKEN }}
         run: |
           set +e
-          # Midnight-UTC rollover guard: a single-date filter misses
-          # orgs created on the prior UTC day when the run crosses
-          # midnight (incident 2026-04-26 23:46Z → 2026-04-27 00:12Z:
-          # slug `e2e-canvas-20260426-1u8nz3` survived because the
-          # safety-net step ran on the 27th, computed `today=20260427`,
-          # and the filter `e2e-canvas-20260427-` never matched). Sweep
-          # both today AND yesterday's dates so a cross-midnight run
-          # still cleans up its own slug.
-          orgs=$(curl -sS "$MOLECULE_CP_URL/cp/admin/orgs" \
-            -H "Authorization: Bearer $ADMIN_TOKEN" 2>/dev/null \
-            | python3 -c "
-          import json, sys, datetime
-          d = json.load(sys.stdin)
-          today = datetime.date.today()
-          yesterday = today - datetime.timedelta(days=1)
-          prefixes = (
-              f'e2e-canvas-{today.strftime(\"%Y%m%d\")}-',
-              f'e2e-canvas-{yesterday.strftime(\"%Y%m%d\")}-',
-          )
-          candidates = [o['slug'] for o in d.get('orgs', [])
-                        if any(o.get('slug','').startswith(p) for p in prefixes)
-                        and o.get('status') not in ('purged',)]
-          print('\n'.join(candidates))
-          " 2>/dev/null)
-          for slug in $orgs; do
-            curl -sS -X DELETE "$MOLECULE_CP_URL/cp/admin/tenants/$slug" \
-              -H "Authorization: Bearer $ADMIN_TOKEN" \
-              -H "Content-Type: application/json" \
-              -d "{\"confirm\":\"$slug\"}" >/dev/null || true
-          done
+          STATE_FILE=".playwright-staging-state.json"
+          if [ ! -f "$STATE_FILE" ]; then
+            echo "::notice::No state file at canvas/$STATE_FILE — Playwright globalTeardown handled it (or setup never ran)."
+            exit 0
+          fi
+          slug=$(python3 -c "import json; print(json.load(open('$STATE_FILE')).get('slug',''))")
+          if [ -z "$slug" ]; then
+            echo "::warning::State file present but slug missing; nothing to clean up."
+            exit 0
+          fi
+          echo "Deleting orphan tenant: $slug"
+          curl -sS -X DELETE "$MOLECULE_CP_URL/cp/admin/tenants/$slug" \
+            -H "Authorization: Bearer $ADMIN_TOKEN" \
+            -H "Content-Type: application/json" \
+            -d "{\"confirm\":\"$slug\"}" >/dev/null || true
           exit 0

.github/workflows/e2e-staging-external.yml

@@ -0,0 +1,164 @@
+name: E2E Staging External Runtime
+
+# Regression for the four/five workspaces.status=awaiting_agent transitions
+# that silently failed in production for five days before migration 046
+# extended the workspace_status enum (see
+# workspace-server/migrations/046_workspace_status_awaiting_agent.up.sql).
+#
+# Why this is its own workflow (not folded into e2e-staging-saas.yml):
+#   - The full-saas harness defaults to runtime=hermes, never exercises
+#     external-runtime. Adding an `external` parameter to that script
+#     would force every push to staging through both lifecycles in
+#     series, doubling the EC2 cold-start budget.
+#   - The external lifecycle has unique timing (REMOTE_LIVENESS_STALE_AFTER
+#     window, 90s default + sweep interval), which we wait through
+#     deliberately. Folding it into hermes would make the long path
+#     even longer.
+#   - It can run in parallel with the hermes E2E since both create
+#     fresh tenant orgs with distinct slug prefixes (`e2e-ext-...` vs
+#     `e2e-...`).
+#
+# Triggers:
+#   - Push to staging when any source affecting external runtime,
+#     hibernation, or the migration set changes.
+#   - PR review for the same set.
+#   - Manual workflow_dispatch.
+#   - Daily cron at 07:30 UTC (catches drift on quiet days; staggered
+#     30 min after e2e-staging-saas.yml's 07:00 UTC cron).
+#
+# Concurrency: serialized so two staging pushes don't fight for the
+# same EC2 quota window. cancel-in-progress=false so a half-rolled
+# tenant always finishes its teardown.
+
+on:
+  push:
+    branches: [staging, main]
+    paths:
+      - 'workspace-server/internal/handlers/workspace.go'
+      - 'workspace-server/internal/handlers/registry.go'
+      - 'workspace-server/internal/handlers/workspace_restart.go'
+      - 'workspace-server/internal/registry/healthsweep.go'
+      - 'workspace-server/internal/registry/liveness.go'
+      - 'workspace-server/migrations/**'
+      - 'workspace-server/internal/db/workspace_status_enum_drift_test.go'
+      - 'tests/e2e/test_staging_external_runtime.sh'
+      - '.github/workflows/e2e-staging-external.yml'
+  pull_request:
+    branches: [staging, main]
+    paths:
+      - 'workspace-server/internal/handlers/workspace.go'
+      - 'workspace-server/internal/handlers/registry.go'
+      - 'workspace-server/internal/handlers/workspace_restart.go'
+      - 'workspace-server/internal/registry/healthsweep.go'
+      - 'workspace-server/internal/registry/liveness.go'
+      - 'workspace-server/migrations/**'
+      - 'workspace-server/internal/db/workspace_status_enum_drift_test.go'
+      - 'tests/e2e/test_staging_external_runtime.sh'
+      - '.github/workflows/e2e-staging-external.yml'
+  workflow_dispatch:
+    inputs:
+      keep_org:
+        description: "Skip teardown for debugging (only via manual dispatch)"
+        required: false
+        type: boolean
+        default: false
+      stale_wait_secs:
+        description: "Seconds to wait for the heartbeat-staleness sweep (default 180 = 90s window + 90s buffer)"
+        required: false
+        default: "180"
+  schedule:
+    - cron: '30 7 * * *'
+
+concurrency:
+  group: e2e-staging-external
+  cancel-in-progress: false
+
+permissions:
+  contents: read
+
+jobs:
+  e2e-staging-external:
+    name: E2E Staging External Runtime
+    runs-on: ubuntu-latest
+    timeout-minutes: 25
+
+    env:
+      MOLECULE_CP_URL: https://staging-api.moleculesai.app
+      MOLECULE_ADMIN_TOKEN: ${{ secrets.MOLECULE_STAGING_ADMIN_TOKEN }}
+      E2E_RUN_ID: "${{ github.run_id }}-${{ github.run_attempt }}"
+      E2E_KEEP_ORG: ${{ github.event.inputs.keep_org && '1' || '0' }}
+      E2E_STALE_WAIT_SECS: ${{ github.event.inputs.stale_wait_secs || '180' }}
+
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Verify admin token present
+        run: |
+          if [ -z "$MOLECULE_ADMIN_TOKEN" ]; then
+            # Schedule + push triggers must hard-fail when the token is
+            # missing — silent skip would mask infra rot. Manual dispatch
+            # gets the same hard-fail; an operator running this on a fork
+            # without secrets configured needs to know up-front.
+            echo "::error::MOLECULE_STAGING_ADMIN_TOKEN secret not set (Railway staging CP_ADMIN_API_TOKEN)"
+            exit 2
+          fi
+          echo "Admin token present ✓"
+
+      - name: CP staging health preflight
+        run: |
+          code=$(curl -sS -o /dev/null -w "%{http_code}" --max-time 10 "$MOLECULE_CP_URL/health")
+          if [ "$code" != "200" ]; then
+            echo "::error::Staging CP unhealthy (got HTTP $code). Skipping — not a workspace bug."
+            exit 1
+          fi
+          echo "Staging CP healthy ✓"
+
+      - name: Run external-runtime E2E
+        id: e2e
+        run: bash tests/e2e/test_staging_external_runtime.sh
+
+      # Mirror the e2e-staging-saas.yml safety net: if the runner is
+      # cancelled (e.g. concurrent staging push), the test script's
+      # EXIT trap may not fire, so we sweep e2e-ext-* slugs scoped to
+      # *this* run id.
+      - name: Teardown safety net (runs on cancel/failure)
+        if: always()
+        env:
+          ADMIN_TOKEN: ${{ secrets.MOLECULE_STAGING_ADMIN_TOKEN }}
+        run: |
+          set +e
+          orgs=$(curl -sS "$MOLECULE_CP_URL/cp/admin/orgs" \
+            -H "Authorization: Bearer $ADMIN_TOKEN" 2>/dev/null \
+            | python3 -c "
+          import json, sys, os, datetime
+          run_id = os.environ.get('GITHUB_RUN_ID', '')
+          d = json.load(sys.stdin)
+          # Scope STRICTLY to this run id (e2e-ext-YYYYMMDD-<runid>-...)
+          # so concurrent runs and unrelated dev probes are not touched.
+          # Sweep today AND yesterday so a midnight-crossing run still
+          # cleans up its own slug.
+          today = datetime.date.today()
+          yesterday = today - datetime.timedelta(days=1)
+          dates = (today.strftime('%Y%m%d'), yesterday.strftime('%Y%m%d'))
+          if not run_id:
+              # Without a run id we cannot scope safely; bail rather
+              # than risk deleting unrelated tenants.
+              sys.exit(0)
+          prefixes = tuple(f'e2e-ext-{d}-{run_id}-' for d in dates)
+          for o in d.get('orgs', []):
+              s = o.get('slug', '')
+              if s.startswith(prefixes) and o.get('status') != 'purged':
+                  print(s)
+          " 2>/dev/null)
+          if [ -n "$orgs" ]; then
+            echo "Safety-net sweep: deleting leftover orgs:"
+            echo "$orgs"
+            for slug in $orgs; do
+              curl -sS -X DELETE "$MOLECULE_CP_URL/cp/admin/tenants/$slug" \
+                -H "Authorization: Bearer $ADMIN_TOKEN" \
+                -H "Content-Type: application/json" \
+                -d "{\"confirm\":\"$slug\"}" >/dev/null 2>&1
+            done
+          else
+            echo "Safety-net sweep: no leftover orgs to clean."
+          fi

.github/workflows/e2e-staging-saas.yml

@@ -92,7 +92,7 @@ jobs:
       E2E_KEEP_ORG: ${{ github.event.inputs.keep_org && '1' || '0' }}
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Verify admin token present
         run: |

.github/workflows/e2e-staging-sanity.yml

@@ -50,7 +50,7 @@ jobs:
       E2E_INTENTIONAL_FAILURE: "1"
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Verify admin token present
         run: |
@@ -89,7 +89,7 @@ jobs:
 
       - name: Open issue if safety net is broken
         if: failure()
-        uses: actions/github-script@v7
+        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
         with:
           script: |
             const title = "🚨 E2E teardown safety net broken";

.github/workflows/harness-replays.yml

@@ -0,0 +1,170 @@
+name: Harness Replays
+
+# Boots tests/harness (production-shape compose topology with TenantGuard,
+# /cp/* proxy, canvas proxy, real production Dockerfile.tenant) and runs
+# every replay under tests/harness/replays/. Fails the PR if any replay
+# fails.
+#
+# Why this exists: 2026-04-30 we shipped #2398 which added /buildinfo as
+# a public route in router.go but forgot to add it to TenantGuard's
+# allowlist. The handler-level test in buildinfo_test.go constructed a
+# minimal gin engine without TenantGuard — green. The harness's
+# buildinfo-stale-image.sh replay would have caught it (cf-proxy doesn't
+# inject X-Molecule-Org-Id, so the curl path is identical to production's
+# redeploy verifier), but no one ran the harness pre-merge. The bug
+# shipped; the redeploy verifier silently soft-warned every tenant as
+# "unreachable" for ~1 day before being noticed.
+#
+# This gate makes "did you actually run the harness?" a CI invariant
+# instead of a memory-discipline thing.
+#
+# Trigger model — match e2e-api.yml: always FIRES on push/pull_request
+# to staging+main, real work is gated per-step on detect-changes output.
+# One job → one check run → branch-protection-clean (the SKIPPED-in-set
+# trap from PR #2264 is documented in e2e-api.yml's e2e-api job comment).
+
+on:
+  push:
+    branches: [main, staging]
+    paths:
+      - 'workspace-server/**'
+      - 'canvas/**'
+      - 'tests/harness/**'
+      - '.github/workflows/harness-replays.yml'
+  pull_request:
+    branches: [main, staging]
+    paths:
+      - 'workspace-server/**'
+      - 'canvas/**'
+      - 'tests/harness/**'
+      - '.github/workflows/harness-replays.yml'
+  workflow_dispatch:
+  merge_group:
+    types: [checks_requested]
+
+concurrency:
+  # Per-SHA grouping. Per-ref kept hitting the auto-promote-staging
+  # cancellation deadlock — see e2e-api.yml's concurrency block for
+  # the 2026-04-28 incident that codified this pattern.
+  group: harness-replays-${{ github.event.pull_request.head.sha || github.sha }}
+  cancel-in-progress: false
+
+jobs:
+  detect-changes:
+    runs-on: ubuntu-latest
+    outputs:
+      run: ${{ steps.decide.outputs.run }}
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: dorny/paths-filter@fbd0ab8f3e69293af611ebaee6363fc25e6d187d # v4.0.1
+        id: filter
+        with:
+          filters: |
+            run:
+              - 'workspace-server/**'
+              - 'canvas/**'
+              - 'tests/harness/**'
+              - '.github/workflows/harness-replays.yml'
+      - id: decide
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+            echo "run=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "run=${{ steps.filter.outputs.run }}" >> "$GITHUB_OUTPUT"
+          fi
+
+  # ONE job that always runs. Real work is gated per-step on
+  # detect-changes.outputs.run so an unrelated PR (e.g. doc-only
+  # change to molecule-controlplane wired here later) emits the
+  # required check without spending CI cycles. Single-job pattern
+  # matches e2e-api.yml — see that workflow's comment for why a
+  # job-level `if: false` would block branch protection via the
+  # SKIPPED-in-set bug.
+  harness-replays:
+    needs: detect-changes
+    name: Harness Replays
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+    steps:
+      - name: No-op pass (paths filter excluded this commit)
+        if: needs.detect-changes.outputs.run != 'true'
+        run: |
+          echo "No workspace-server / canvas / tests/harness / workflow changes — Harness Replays gate satisfied without running."
+          echo "::notice::Harness Replays no-op pass (paths filter excluded this commit)."
+
+      - if: needs.detect-changes.outputs.run == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Checkout sibling plugin repo
+        # Dockerfile.tenant copies molecule-ai-plugin-github-app-auth/
+        # at the build-context root (see workspace-server/Dockerfile.tenant
+        # line 19). PLUGIN_REPO_PAT pattern matches publish-workspace-server-image.yml.
+        if: needs.detect-changes.outputs.run == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        with:
+          repository: Molecule-AI/molecule-ai-plugin-github-app-auth
+          path: molecule-ai-plugin-github-app-auth
+          token: ${{ secrets.PLUGIN_REPO_PAT || secrets.GITHUB_TOKEN }}
+
+      - name: Install Python deps for replays
+        # peer-discovery-404 (and future replays) eval Python against the
+        # running tenant — importing workspace/a2a_client.py pulls in
+        # httpx. tests/harness/requirements.txt holds just the HTTP-client
+        # surface to keep CI install fast (~3s) vs the full
+        # workspace/requirements.txt (~30s).
+        if: needs.detect-changes.outputs.run == 'true'
+        run: pip install -r tests/harness/requirements.txt
+
+      - name: Run all replays against the harness
+        # run-all-replays.sh: boot via up.sh → seed via seed.sh → run
+        # every replays/*.sh → tear down via down.sh on EXIT (trap).
+        # Non-zero exit on any replay failure.
+        #
+        # KEEP_UP=1: without this, the script's trap-on-EXIT tears
+        # down containers immediately on failure, leaving the dump
+        # step below with nothing to dump (verified on PR #2410's
+        # first run — tenant became unhealthy, trap fired, dump
+        # step saw empty containers). Keeping them up lets the
+        # failure path collect tenant/cp-stub/cf-proxy logs. The
+        # always-run "Force teardown" step does the actual cleanup.
+        if: needs.detect-changes.outputs.run == 'true'
+        working-directory: tests/harness
+        env:
+          KEEP_UP: "1"
+        run: ./run-all-replays.sh
+
+      - name: Dump compose logs on failure
+        # SECRETS_ENCRYPTION_KEY: docker compose validates the entire compose
+        # file even for read-only `logs` calls. up.sh generates a per-run key
+        # and exports it to its OWN shell — this step runs in a fresh shell
+        # that wouldn't see it, so without a placeholder the validate step
+        # errors before logs print (verified against PR #2492's first run:
+        # "required variable SECRETS_ENCRYPTION_KEY is missing a value").
+        # A placeholder is fine — we're only reading log streams, not booting.
+        if: failure() && needs.detect-changes.outputs.run == 'true'
+        working-directory: tests/harness
+        env:
+          SECRETS_ENCRYPTION_KEY: dump-logs-placeholder
+        run: |
+          echo "=== docker compose ps ==="
+          docker compose -f compose.yml ps || true
+          echo "=== tenant-alpha logs ==="
+          docker compose -f compose.yml logs tenant-alpha || true
+          echo "=== tenant-beta logs ==="
+          docker compose -f compose.yml logs tenant-beta || true
+          echo "=== cp-stub logs ==="
+          docker compose -f compose.yml logs cp-stub || true
+          echo "=== cf-proxy logs ==="
+          docker compose -f compose.yml logs cf-proxy || true
+          echo "=== postgres-alpha logs (last 100) ==="
+          docker compose -f compose.yml logs --tail 100 postgres-alpha || true
+          echo "=== postgres-beta logs (last 100) ==="
+          docker compose -f compose.yml logs --tail 100 postgres-beta || true
+
+      - name: Force teardown
+        # We pass KEEP_UP=1 to run-all-replays.sh so the dump step
+        # above sees real containers — that means we own teardown
+        # explicitly here. Always run.
+        if: always() && needs.detect-changes.outputs.run == 'true'
+        working-directory: tests/harness
+        run: ./down.sh || true

.github/workflows/promote-latest.yml

@@ -34,7 +34,7 @@ jobs:
   promote:
     runs-on: ubuntu-latest
     steps:
-      - uses: imjasonh/setup-crane@v0.4
+      - uses: imjasonh/setup-crane@6da1ae018866400525525ce74ff892880c099987 # v0.5
 
       - name: GHCR login
         run: |

.github/workflows/publish-canvas-image.yml

@@ -42,17 +42,17 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Log in to GHCR
-        uses: docker/login-action@v3
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
+        uses: docker/setup-buildx-action@4d04d5d9486b7bd6fa91e7baf45bbb4f8b9deedd # v4.0.0
 
       - name: Compute tags
         id: tags
@@ -85,7 +85,7 @@ jobs:
           echo "ws_url=${WS_URL}" >> "$GITHUB_OUTPUT"
 
       - name: Build & push canvas image to GHCR
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
         with:
           context: ./canvas
           file: ./canvas/Dockerfile

.github/workflows/publish-runtime.yml

@@ -81,9 +81,9 @@ jobs:
       version: ${{ steps.version.outputs.version }}
       wheel_sha256: ${{ steps.wheel_hash.outputs.wheel_sha256 }}
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
-      - uses: actions/setup-python@v5
+      - uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: "3.11"
           cache: pip
@@ -154,139 +154,15 @@ jobs:
 
       - name: Verify package contents (sanity)
         working-directory: ${{ runner.temp }}/runtime-build
+        # Smoke logic lives in scripts/wheel_smoke.py so the same gate runs
+        # at both PR-time (runtime-prbuild-compat.yml) and publish-time
+        # (here). Splitting the smoke across two heredocs let them drift
+        # apart historically — one script keeps them locked.
         run: |
           python -m twine check dist/*
-          # Smoke-import the built wheel to catch import-rewrite mistakes
-          # before they hit PyPI. Asserts on STABLE INVARIANTS only —
-          # symbols + classes that are part of the package's public
-          # contract (BaseAdapter interface, the canonical a2a sentinel,
-          # core submodules). Don't add feature-flag-style assertions
-          # here — they fire false-positive every time staging is mid-
-          # release of that feature.
           python -m venv /tmp/smoke
           /tmp/smoke/bin/pip install --quiet dist/*.whl
-          WORKSPACE_ID=00000000-0000-0000-0000-000000000000 \
-          PLATFORM_URL=http://localhost:8080 \
-            /tmp/smoke/bin/python -c "
-          # Importing main is the strongest smoke test we can do here:
-          # main.py is the entry point and pulls every other module
-          # transitively. If the build script missed an import rewrite
-          # (e.g. left a bare \`from transcript_auth import ...\` instead
-          # of \`from molecule_runtime.transcript_auth import ...\` — the
-          # 0.1.16 incident), this fails with ModuleNotFoundError instead
-          # of shipping to PyPI and breaking every workspace startup.
-          # Import the entry-point target by NAME — not just the module.
-          # The wheel's pyproject.toml declares
-          # `molecule-runtime = molecule_runtime.main:main_sync` so if
-          # main_sync goes missing (it did in 0.1.16-0.1.18), every
-          # workspace startup fails with `ImportError: cannot import name
-          # 'main_sync'`. Plain `import molecule_runtime.main` doesn't
-          # catch that because the module loads fine.
-          from molecule_runtime.main import main_sync  # noqa: F401
-          from molecule_runtime import a2a_client, a2a_tools
-          from molecule_runtime.builtin_tools import memory
-          from molecule_runtime.adapters import get_adapter, BaseAdapter, AdapterConfig
-          # Stable invariants: package exports + BaseAdapter shape.
-          assert a2a_client._A2A_ERROR_PREFIX, 'a2a_client missing error sentinel'
-          assert callable(get_adapter), 'adapters.get_adapter must be callable'
-          assert hasattr(BaseAdapter, 'name'), 'BaseAdapter interface broken'
-          assert hasattr(AdapterConfig, '__init__'), 'AdapterConfig dataclass missing'
-
-          # Call-shape smoke for AgentCard. Pure imports don't catch
-          # field-shape regressions in upstream SDKs that only surface
-          # at construction time. Two bugs of this exact class shipped
-          # since the a2a-sdk 1.0 migration:
-          #   - state_transition_history=True (fixed in #2179)
-          #   - supported_protocols=[...] (the protobuf field is
-          #     supported_interfaces — caused every workspace boot
-          #     to crash with `ValueError: Protocol message AgentCard
-          #     has no "supported_protocols" field`; fixed alongside
-          #     this smoke)
-          #
-          # This block instantiates the EXACT classes main.py uses,
-          # with the EXACT keyword arguments. If a future a2a-sdk
-          # upgrade renames any of supported_interfaces / streaming /
-          # push_notifications / etc., the publish fails here instead
-          # of breaking every workspace startup. main.py and this
-          # smoke MUST stay in lockstep — adding a kwarg to one
-          # without mirroring it here is the regression vector.
-          from a2a.types import AgentCard, AgentCapabilities, AgentSkill, AgentInterface
-          AgentCard(
-              name='smoke-agent',
-              description='publish-runtime smoke test',
-              version='0.0.0-smoke',
-              supported_interfaces=[
-                  AgentInterface(protocol_binding='https://a2a.g/v1', url='http://localhost:8080'),
-              ],
-              capabilities=AgentCapabilities(
-                  streaming=True,
-                  push_notifications=False,
-              ),
-              skills=[
-                  AgentSkill(
-                      id='smoke-skill',
-                      name='Smoke',
-                      description='no-op',
-                      tags=['smoke'],
-                      examples=['noop'],
-                  ),
-              ],
-              default_input_modes=['text/plain', 'application/json'],
-              default_output_modes=['text/plain', 'application/json'],
-          )
-          print('✓ AgentCard call-shape smoke passed')
-
-          # Well-known agent-card path probe alignment. main.py's
-          # _send_initial_prompt() polls AGENT_CARD_WELL_KNOWN_PATH
-          # to know when the local A2A server is ready. If the SDK
-          # ever splits the constant value from the path that
-          # create_agent_card_routes() actually mounts at, every
-          # workspace silently drops its initial_prompt:
-          #   - Probe gets 404 every attempt.
-          #   - Falls through to 'server not ready after 30s,
-          #     skipping' even though the server is fine.
-          #   - The user hits a fresh chat with no kickoff context.
-          # This was the #2193 incident class — the v0.x → v1.x
-          # rename of /.well-known/agent.json → /.well-known/agent-card.json
-          # plus the constant itself moving to a2a.utils.constants.
-          # source-tree pytest (test_agent_card_well_known_path.py)
-          # catches main.py-side regressions; this catches the
-          # SDK-side ones BEFORE PyPI upload.
-          from a2a.utils.constants import AGENT_CARD_WELL_KNOWN_PATH
-          from a2a.server.routes import create_agent_card_routes
-          mounted_paths = [
-              getattr(r, 'path', None)
-              for r in create_agent_card_routes(
-                  AgentCard(
-                      name='wk-smoke',
-                      description='well-known mount alignment',
-                      version='0.0.0-smoke',
-                  )
-              )
-          ]
-          assert AGENT_CARD_WELL_KNOWN_PATH in mounted_paths, (
-              f'AGENT_CARD_WELL_KNOWN_PATH ({AGENT_CARD_WELL_KNOWN_PATH!r}) '
-              f'is NOT among paths mounted by create_agent_card_routes '
-              f'({mounted_paths!r}). The SDK constant and its own route '
-              f'factory have drifted — workspace probes will 404 forever, '
-              f'silently dropping every workspace initial_prompt.'
-          )
-          print(f'✓ well-known mount alignment OK ({AGENT_CARD_WELL_KNOWN_PATH})')
-
-          # Message helper smoke. a2a-sdk renamed
-          # new_agent_text_message → new_text_message in the v1.x
-          # protobuf-flat migration (per the v0→v1 cheat sheet). main.py
-          # and a2a_executor.py call new_text_message in hot paths; if
-          # the import breaks, every reply errors with ImportError before
-          # the message even leaves the workspace. Importing here
-          # catches a future v2.x rename at publish time.
-          from a2a.helpers import new_text_message
-          msg = new_text_message('smoke')
-          assert msg is not None, 'new_text_message returned None'
-          print('✓ message helper import + call OK')
-
-          print('✓ smoke import passed')
-          "
+          /tmp/smoke/bin/python "$GITHUB_WORKSPACE/scripts/wheel_smoke.py"
 
       - name: Publish to PyPI (Trusted Publisher / OIDC)
         # PyPI side is configured: project molecule-ai-workspace-runtime →
@@ -419,16 +295,45 @@ jobs:
           RUNTIME_VERSION: ${{ needs.publish.outputs.version }}
         run: |
           set +e   # don't abort on a single repo failure — collect them all
+          # Schedule-vs-dispatch behaviour split (hardened 2026-04-28
+          # after the sweep-cf-orphans soft-skip incident — same class
+          # of bug):
+          #
+          # The earlier "skipping cascade. templates will pick up the
+          # new version on their own next rebuild" message was wrong —
+          # templates only build on this dispatch trigger; without it
+          # they stay pinned to whatever runtime version they last saw.
+          # A silent skip here means "PyPI is current, templates are
+          # not" and the gap is invisible until someone notices a
+          # template still on the old version weeks later.
+          #
+          #   - push                → exit 1 (red CI surfaces the gap)
+          #   - workflow_dispatch   → exit 0 with a warning (operator
+          #                           ran this ad-hoc; let them rerun
+          #                           after fixing the secret)
           if [ -z "$DISPATCH_TOKEN" ]; then
-            echo "::warning::TEMPLATE_DISPATCH_TOKEN secret not set — skipping cascade. PyPI was published; templates will pick up the new version on their own next rebuild."
-            exit 0
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::TEMPLATE_DISPATCH_TOKEN secret not set — skipping cascade."
+              echo "::warning::set it at Settings → Secrets and Variables → Actions, then rerun. Templates will stay on the prior runtime version until either this token is set or each template is rebuilt manually."
+              exit 0
+            fi
+            echo "::error::TEMPLATE_DISPATCH_TOKEN secret missing — cascade cannot fan out."
+            echo "::error::PyPI was published, but the 8 template repos will NOT pick up the new version until this token is restored and a republish dispatches the cascade."
+            echo "::error::set it at Settings → Secrets and Variables → Actions; then re-trigger publish-runtime via workflow_dispatch."
+            exit 1
           fi
           VERSION="$RUNTIME_VERSION"
           if [ -z "$VERSION" ]; then
             echo "::error::publish job did not expose a version output — cascade cannot fan out"
             exit 1
           fi
-          TEMPLATES="claude-code langgraph crewai autogen deepagents hermes gemini-cli openclaw"
+          # Source of truth: manifest.json workspace_templates (PR #2536 pruned
+          # to 4 actively-supported runtimes: claude-code, hermes, openclaw, codex).
+          # Removed langgraph/crewai/autogen/deepagents/gemini-cli (deprecated, no
+          # shipping images); added codex (had been missing since #2512).
+          # Long-term: derive this list from manifest.json so the cascade can't
+          # drift again — tracked in RFC #388 as a Phase-1 invariant.
+          TEMPLATES="claude-code hermes openclaw codex"
           FAILED=""
           for tpl in $TEMPLATES; do
             REPO="Molecule-AI/molecule-ai-workspace-template-$tpl"

.github/workflows/publish-workspace-server-image.yml

@@ -1,19 +1,60 @@
 name: publish-workspace-server-image
 
-# Builds and pushes Docker images to GHCR when staging is promoted to main.
-# PRs target staging (default branch). Only main push triggers production builds.
+# Builds and pushes Docker images to GHCR on staging or main pushes.
 # EC2 tenant instances pull the tenant image from GHCR.
+#
+# Branch / tag policy (see Compute tags step for the per-branch logic):
+#
+#   staging push  → builds image, tags :staging-<sha> + :staging-latest.
+#                   staging-CP pins TENANT_IMAGE=:staging-latest, so it
+#                   picks up staging-branch code automatically. This is
+#                   what makes staging-CP actually test staging-branch
+#                   code instead of "yesterday's main" — pre-fix, this
+#                   workflow only ran on main, so staging tenants
+#                   silently served stale code (#2308 fix RFC #2312
+#                   landed on staging but never reached tenants because
+#                   staging→main was wedged on path-filter parity bugs).
+#
+#   main push     → builds image, tags :staging-<sha> + :staging-latest
+#                   (same as before). canary-verify.yml retags
+#                   :staging-<sha> → :latest after canary tenants
+#                   green-light the digest. The :staging-latest retag
+#                   on main push is intentional: when main lands AFTER a
+#                   staging push, staging-CP gets the post-promote code
+#                   (which equals what it had + any merge resolution),
+#                   so the canary-on-staging-CP step still runs against
+#                   the prod-bound digest.
+#
+# In the steady state both branches refresh :staging-latest; the
+# semantic is "most recent staging-or-main build of tenant code."
+# Drift between the two is bounded by the staging→main auto-promote
+# cadence and is corrected on the next staging push.
 
 on:
   push:
-    branches: [main]
+    branches: [staging, main]
     paths:
       - 'workspace-server/**'
       - 'canvas/**'
       - 'manifest.json'
-      - '.github/workflows/publish-platform-image.yml'
+      - '.github/workflows/publish-workspace-server-image.yml'
   workflow_dispatch:
 
+# Serialize per-branch so two rapid staging pushes don't race the same
+# :staging-latest tag retag. Allow staging and main to run in parallel
+# (different github.ref → different concurrency group) since they
+# produce different :staging-<sha> tags and last-write-wins on
+# :staging-latest is acceptable across branches (the post-promote
+# main code equals current staging code in a healthy flow).
+#
+# cancel-in-progress: false → in-flight builds finish; the next push's
+# build queues. This avoids a partially-pushed image and keeps the
+# canary fleet pin (:staging-<sha>) consistent with what was actually
+# tested at canary-verify time.
+concurrency:
+  group: publish-workspace-server-image-${{ github.ref }}
+  cancel-in-progress: false
+
 permissions:
   contents: read
   packages: write
@@ -27,7 +68,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Checkout sibling plugin repo
         # workspace-server/Dockerfile expects
@@ -42,52 +83,55 @@ jobs:
         # The PAT needs Contents:Read on Molecule-AI/molecule-ai-plugin-
         # github-app-auth. Falls back to the default token for the (rare)
         # case where an operator made the plugin repo public.
-        uses: actions/checkout@v4
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           repository: Molecule-AI/molecule-ai-plugin-github-app-auth
           path: molecule-ai-plugin-github-app-auth
           token: ${{ secrets.PLUGIN_REPO_PAT || secrets.GITHUB_TOKEN }}
 
       - name: Log in to GHCR
-        uses: docker/login-action@v3
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
+        uses: docker/setup-buildx-action@4d04d5d9486b7bd6fa91e7baf45bbb4f8b9deedd # v4.0.0
 
       - name: Compute tags
         id: tags
         run: |
           echo "sha=${GITHUB_SHA::7}" >> "$GITHUB_OUTPUT"
 
-      # Canary-gated release: we publish :staging-<sha> ONLY here. The
-      # :latest tag (which existing prod tenants auto-pull every 5 min)
-      # is promoted by .github/workflows/canary-verify.yml after the
-      # staging canary fleet green-lights this digest.
-      # That means:
-      #   - Every main merge produces a :staging-<sha> image
-      #   - Canary tenants (configured to pull :staging-<sha>) pick it up
-      #   - canary-verify.yml runs smoke tests against them
-      #   - On green → canary-verify retags :staging-<sha> → :latest
-      #   - On red → :latest stays on the prior good digest, prod is safe
-      # Every push of :staging-<sha> also retags the same digest as
-      # :staging-latest so staging CP (which pins TENANT_IMAGE at
-      # :staging-latest) picks up new builds automatically — no more manual
-      # Railway env-var edits. Prod's :latest retag still happens in
-      # canary-verify.yml after the canary fleet greenlights this digest;
-      # :staging-latest is strictly the "most recent main build," not a
-      # canary-verified promotion.
+      # Canary-gated release flow:
+      #   - This step always publishes :staging-<sha> + :staging-latest.
+      #   - On staging push, staging-CP picks up :staging-latest immediately
+      #     (its TENANT_IMAGE pin is :staging-latest) — so staging-branch
+      #     code reaches staging tenants without waiting for main.
+      #   - On main push, canary-verify.yml runs smoke tests against
+      #     canary tenants (which pin :staging-<sha>), and on green retags
+      #     :staging-<sha> → :latest. Prod tenants pull :latest.
+      #   - On red, :latest stays on the prior good digest — prod is safe.
       #
-      # Before this, TENANT_IMAGE on Railway staging was pinned to a static
-      # :staging-<sha> and drifted months behind (2026-04-24 incident:
-      # canary tenant ran :staging-a14cf86, 10 days stale, which lacked
-      # applyRuntimeModelEnv and caused every E2E to route hermes+openai
-      # through openrouter → 401). See issue filed with this PR.
+      # Why :staging-latest is retagged on main push too: when main lands
+      # after a staging promote, staging-CP gets the post-promote code so
+      # the canary-on-staging-CP step still runs against the prod-bound
+      # digest. In a healthy flow the post-promote main code == the
+      # current staging code, so this is effectively a no-op except for
+      # the canary fleet pin handoff.
+      #
+      # Pre-fix history: this workflow used to only trigger on main. That
+      # meant staging-CP served "yesterday's main" indefinitely whenever
+      # staging→main was wedged. The 2026-04-30 dogfooding session
+      # surfaced this when RFC #2312 (chat upload HTTP-forward) landed on
+      # staging but staging tenants kept failing chat upload because they
+      # were running pre-RFC code. Adding the staging trigger above closes
+      # that gap. Earlier 2026-04-24 incident: a static :staging-<sha> pin
+      # drifted 10 days behind staging — same class of bug, different
+      # mechanism.
       - name: Build & push platform image to GHCR (staging-<sha> + staging-latest)
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
         with:
           context: .
           file: ./workspace-server/Dockerfile
@@ -98,13 +142,20 @@ jobs:
             ${{ env.IMAGE_NAME }}:staging-latest
           cache-from: type=gha
           cache-to: type=gha,mode=max
+          # GIT_SHA bakes into the Go binary via -ldflags so /buildinfo
+          # returns it at runtime — see Dockerfile + buildinfo/buildinfo.go.
+          # This is the same value as the OCI revision label below; passing
+          # it twice is intentional, the OCI label is for registry tooling
+          # while /buildinfo is for the redeploy verification step.
+          build-args: |
+            GIT_SHA=${{ github.sha }}
           labels: |
             org.opencontainers.image.source=https://github.com/${{ github.repository }}
             org.opencontainers.image.revision=${{ github.sha }}
             org.opencontainers.image.description=Molecule AI platform (Go API server) — pending canary verify
 
       - name: Build & push tenant image to GHCR (staging-<sha> + staging-latest)
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
         with:
           context: .
           file: ./workspace-server/Dockerfile.tenant
@@ -128,6 +179,7 @@ jobs:
           # NEXT_PUBLIC_PLATFORM_URL=http://localhost:8080).
           build-args: |
             NEXT_PUBLIC_PLATFORM_URL=
+            GIT_SHA=${{ github.sha }}
           labels: |
             org.opencontainers.image.source=https://github.com/${{ github.repository }}
             org.opencontainers.image.revision=${{ github.sha }}

.github/workflows/railway-pin-audit.yml

@@ -0,0 +1,207 @@
+name: Railway pin audit (drift detection)
+
+# Daily audit of Railway env vars for drift-prone image-tag pins —
+# automation-cadence layer over the detection script + regression test
+# shipped in PR #2168 (#2001 closure).
+#
+# Background: on 2026-04-24 a stale `:staging-a14cf86` SHA pin in CP's
+# TENANT_IMAGE caused 3+ hours of E2E failure with the appearance that
+# "every fix didn't propagate" — really the tenant image was so old it
+# didn't read the env vars those fixes produced. The audit script
+# (scripts/ops/audit-railway-sha-pins.sh) flags drift; this workflow
+# runs the same check unattended on a daily cron.
+#
+# Cadence: once a day, 13:00 UTC (06:00 PT). Daily is the right
+# cadence for variables-tier config — Railway env var changes are
+# deliberate operator actions, low-frequency. Hourly would risk
+# Railway API rate-limit surprises and is overkill for the change rate.
+#
+# Issue-on-failure: drift triggers a priority-high issue, mirroring
+# .github/workflows/e2e-staging-sanity.yml's pattern. Drift is
+# medium-priority "config slipped, fix at next ops window," not
+# active-outage paging.
+#
+# Secret hardening: per feedback_schedule_vs_dispatch_secrets_hardening,
+# the schedule trigger HARD-FAILS on missing RAILWAY_AUDIT_TOKEN
+# (silent-success on schedule was the failure-mode class that bit the
+# team before; cron firing without checking anything is worse than no
+# cron). The workflow_dispatch trigger SOFT-SKIPS on missing secret so
+# an operator can dry-run the workflow shape during initial provisioning
+# without tripping a fake red.
+
+on:
+  schedule:
+    - cron: '0 13 * * *'
+  workflow_dispatch:
+
+concurrency:
+  group: railway-pin-audit
+  cancel-in-progress: false
+
+permissions:
+  issues: write
+  contents: read
+
+jobs:
+  audit:
+    name: Audit Railway env vars for drift-prone pins
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Verify RAILWAY_AUDIT_TOKEN present
+        # Schedule trigger: hard-fail when the secret is missing —
+        # otherwise the cron silently runs against the wrong scope (or
+        # exits 2 from the script and we issue-spam) without anyone
+        # noticing the token rot.
+        # Dispatch trigger: soft-skip — operator may be dry-running the
+        # workflow shape before provisioning the secret. Logged as a
+        # workflow notice, not a failure.
+        env:
+          RAILWAY_AUDIT_TOKEN: ${{ secrets.RAILWAY_AUDIT_TOKEN }}
+          EVENT_NAME: ${{ github.event_name }}
+        id: secret_check
+        run: |
+          set -euo pipefail
+          if [ -n "${RAILWAY_AUDIT_TOKEN:-}" ]; then
+            echo "have_secret=true" >> "$GITHUB_OUTPUT"
+            exit 0
+          fi
+          echo "have_secret=false" >> "$GITHUB_OUTPUT"
+          if [ "$EVENT_NAME" = "workflow_dispatch" ]; then
+            echo "::notice::RAILWAY_AUDIT_TOKEN not configured — soft-skipping (manual dispatch)"
+            exit 0
+          fi
+          echo "::error::RAILWAY_AUDIT_TOKEN secret missing — schedule trigger requires it. Provision the token (read-only \`variables\` scope on the molecule-platform Railway project) and store as repo secret RAILWAY_AUDIT_TOKEN."
+          exit 1
+
+      - name: Install Railway CLI
+        if: steps.secret_check.outputs.have_secret == 'true'
+        # Pinned hash matching the public install instructions; bump in
+        # tandem with the audit-script's documented Railway CLI version.
+        run: |
+          set -euo pipefail
+          curl -fsSL https://railway.com/install.sh | sh
+          # The installer drops the binary in ~/.railway/bin
+          echo "$HOME/.railway/bin" >> "$GITHUB_PATH"
+
+      - name: Verify Railway CLI authenticated
+        if: steps.secret_check.outputs.have_secret == 'true'
+        env:
+          RAILWAY_TOKEN: ${{ secrets.RAILWAY_AUDIT_TOKEN }}
+        run: |
+          set -euo pipefail
+          # `railway whoami` exits non-zero when the token is
+          # unauthenticated or doesn't have any project access.
+          if ! railway whoami >/dev/null 2>&1; then
+            echo "::error::Railway CLI failed to authenticate with RAILWAY_AUDIT_TOKEN — token may be revoked or scoped incorrectly"
+            exit 2
+          fi
+
+      - name: Link molecule-platform project
+        if: steps.secret_check.outputs.have_secret == 'true'
+        env:
+          RAILWAY_TOKEN: ${{ secrets.RAILWAY_AUDIT_TOKEN }}
+        # Project ID from reference_production_stack: molecule-platform
+        # / 7ccc8c68-61f4-42ab-9be5-586eeee11768. Linking is per-process,
+        # so we re-link in this CI shell (the audit script comment says
+        # it deliberately doesn't chdir for you because the linked
+        # project's identity matters).
+        run: |
+          set -euo pipefail
+          railway link --project 7ccc8c68-61f4-42ab-9be5-586eeee11768
+
+      - name: Run drift audit
+        if: steps.secret_check.outputs.have_secret == 'true'
+        id: audit
+        env:
+          RAILWAY_TOKEN: ${{ secrets.RAILWAY_AUDIT_TOKEN }}
+        run: |
+          set +e
+          bash scripts/ops/audit-railway-sha-pins.sh 2>&1 | tee /tmp/audit.log
+          rc=${PIPESTATUS[0]}
+          echo "rc=$rc" >> "$GITHUB_OUTPUT"
+          # Capture the audit log for the issue body.
+          {
+            echo 'log<<AUDIT_EOF'
+            cat /tmp/audit.log
+            echo 'AUDIT_EOF'
+          } >> "$GITHUB_OUTPUT"
+          # Exit codes from the script:
+          #   0 — no drift; workflow goes green
+          #   1 — drift detected; we'll file an issue and fail the run
+          #   2 — railway CLI unauthenticated / project unlinked; fail
+          # Anything else: also fail.
+          case "$rc" in
+            0) exit 0 ;;
+            1) echo "::warning::Drift-prone pin(s) detected — issue will be filed"; exit 1 ;;
+            2) echo "::error::Railway CLI auth/link failed mid-script — token or project ID drift"; exit 2 ;;
+            *) echo "::error::Unexpected audit rc=$rc"; exit 1 ;;
+          esac
+
+      - name: Open / update drift issue
+        if: failure() && steps.audit.outputs.rc == '1'
+        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
+        env:
+          AUDIT_LOG: ${{ steps.audit.outputs.log }}
+        with:
+          script: |
+            const title = "🚨 Railway env-var drift detected";
+            const runURL = `https://github.com/${context.repo.owner}/${context.repo.repo}/actions/runs/${context.runId}`;
+            const body =
+              `Daily Railway pin audit found drift-prone image-tag pins in the molecule-platform Railway project.\n\n` +
+              `**What this means:** an env var (likely on \`controlplane\`) is pinned to a SHA-shaped or semver tag instead of a floating tag. ` +
+              `Same pattern that caused the 2026-04-24 TENANT_IMAGE incident — fix-PRs land but the running service doesn't pick them up.\n\n` +
+              `**Recovery:** open the Railway dashboard, replace the flagged value with a floating tag (\`:staging-latest\`, \`:main\`) unless the pin is intentional and documented in the ops runbook.\n\n` +
+              `**Audit output:**\n\n\`\`\`\n${process.env.AUDIT_LOG || '(log unavailable)'}\n\`\`\`\n\n` +
+              `Run: ${runURL}\n\n` +
+              `Closes automatically when a subsequent daily run reports clean.`;
+
+            const { data: existing } = await github.rest.issues.listForRepo({
+              owner: context.repo.owner, repo: context.repo.repo,
+              state: 'open', labels: 'railway-drift',
+            });
+            const match = existing.find(i => i.title === title);
+            if (match) {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner, repo: context.repo.repo,
+                issue_number: match.number,
+                body: `Still drifting. ${runURL}\n\n\`\`\`\n${process.env.AUDIT_LOG || '(log unavailable)'}\n\`\`\``,
+              });
+            } else {
+              await github.rest.issues.create({
+                owner: context.repo.owner, repo: context.repo.repo,
+                title, body,
+                labels: ['railway-drift', 'bug', 'priority-high'],
+              });
+            }
+
+      - name: Close stale drift issue on clean run
+        # When a previously-flagged drift gets fixed by an operator,
+        # the next daily run goes green. Close any open `railway-drift`
+        # issue with a confirmation comment so the queue doesn't carry
+        # stale ones.
+        if: success() && steps.audit.outputs.rc == '0'
+        uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
+        with:
+          script: |
+            const runURL = `https://github.com/${context.repo.owner}/${context.repo.repo}/actions/runs/${context.runId}`;
+            const { data: existing } = await github.rest.issues.listForRepo({
+              owner: context.repo.owner, repo: context.repo.repo,
+              state: 'open', labels: 'railway-drift',
+            });
+            for (const issue of existing) {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner, repo: context.repo.repo,
+                issue_number: issue.number,
+                body: `Daily audit clean — drift resolved. ${runURL}`,
+              });
+              await github.rest.issues.update({
+                owner: context.repo.owner, repo: context.repo.repo,
+                issue_number: issue.number,
+                state: 'closed',
+                state_reason: 'completed',
+              });
+            }

.github/workflows/redeploy-tenants-on-main.yml

@@ -34,10 +34,24 @@ on:
   workflow_dispatch:
     inputs:
       target_tag:
-        description: 'Tenant image tag to deploy (e.g. "latest" or "a59f1a6c"). Defaults to latest when empty.'
+        # Empty default → auto-trigger and dispatch-without-input both
+        # resolve to `staging-<short_head_sha>` (the digest publish-image
+        # just pushed). Pre-fix this defaulted to 'latest', which only
+        # gets retagged by canary-verify's promote-to-latest job — and
+        # that job soft-skips when CANARY_TENANT_URLS is unset (the
+        # current state, until Phase 2 canary fleet is live). Result:
+        # `:latest` had been pinned to a 4-day-old digest (2026-04-28)
+        # while every main push pushed fresh `staging-<sha>` images;
+        # every prod redeploy pulled the stale `:latest` and the verify
+        # step correctly flagged 3/3 tenants STALE. Pulling the
+        # just-published `staging-<sha>` directly skips the dead retag
+        # path. When canary fleet is real, this workflow should chain
+        # on canary-verify completion (workflow_run from canary-verify),
+        # not publish-image — separate, smaller PR.
+        description: 'Tenant image tag to deploy (e.g. "latest", "staging-a59f1a6c"). Empty = auto staging-<head_sha>.'
         required: false
         type: string
-        default: 'latest'
+        default: ''
       canary_slug:
         description: 'Tenant slug to deploy first + soak (empty = skip canary, fan out immediately).'
         required: false
@@ -64,6 +78,20 @@ permissions:
   # No write scopes needed — the workflow hits an external CP endpoint,
   # not the GitHub API.
 
+# Serialize redeploys so two rapid main pushes' redeploys don't overlap
+# and cause confusing per-tenant SSM state. Without this, GitHub's
+# implicit workflow_run queueing would *probably* serialize them, but
+# the explicit block makes the invariant defensible. Mirrors the
+# concurrency block on redeploy-tenants-on-staging.yml for shape parity.
+#
+# cancel-in-progress: false → aborting a half-rolled-out fleet would
+# leave tenants stuck on whatever image they happened to be on when
+# cancelled. Better to finish the in-flight rollout before starting
+# the next one.
+concurrency:
+  group: redeploy-tenants-on-main
+  cancel-in-progress: false
+
 jobs:
   redeploy:
     # Skip the auto-trigger if publish-workspace-server-image didn't
@@ -77,12 +105,40 @@ jobs:
     steps:
       - name: Wait for GHCR tag propagation
         # GHCR's edge cache takes ~15-30s to consistently serve the new
-        # :latest manifest after the registry accepts the push. Without
-        # this sleep, the first tenant's docker pull sometimes races
-        # and fetches the previous digest; sleeping is the cheapest
-        # way to reduce that without polling GHCR for the new digest.
+        # manifest after the registry accepts the push. Without this
+        # sleep, the first tenant's docker pull sometimes races and
+        # fetches the previous digest; sleeping is the cheapest way to
+        # reduce that without polling GHCR for the new digest.
         run: sleep 30
 
+      - name: Compute target tag
+        id: tag
+        # Resolution order:
+        #   1. Operator-supplied input (workflow_dispatch with explicit
+        #      tag) → used verbatim. Lets ops pin `latest` for emergency
+        #      rollback to last canary-verified digest, or pin a specific
+        #      `staging-<sha>` to roll back to a known-good build.
+        #   2. Default → `staging-<short_head_sha>`. The just-published
+        #      digest. Bypasses the `:latest` retag path that's currently
+        #      dead (canary-verify soft-skips without canary fleet, so
+        #      the only thing retagging `:latest` today is the manual
+        #      promote-latest.yml — last run 2026-04-28). Auto-trigger
+        #      from workflow_run uses workflow_run.head_sha; manual
+        #      dispatch with no input falls through to github.sha.
+        env:
+          INPUT_TAG: ${{ inputs.target_tag }}
+          HEAD_SHA: ${{ github.event.workflow_run.head_sha || github.sha }}
+        run: |
+          set -euo pipefail
+          if [ -n "${INPUT_TAG:-}" ]; then
+            echo "target_tag=$INPUT_TAG" >> "$GITHUB_OUTPUT"
+            echo "Using operator-pinned tag: $INPUT_TAG"
+          else
+            SHORT="${HEAD_SHA:0:7}"
+            echo "target_tag=staging-$SHORT" >> "$GITHUB_OUTPUT"
+            echo "Using auto tag: staging-$SHORT (head_sha=$HEAD_SHA)"
+          fi
+
       - name: Call CP redeploy-fleet
         # CP_ADMIN_API_TOKEN must be set as a repo/org secret on
         # Molecule-AI/molecule-core, matching the staging/prod CP's
@@ -91,7 +147,7 @@ jobs:
         env:
           CP_URL: ${{ vars.CP_URL || 'https://api.moleculesai.app' }}
           CP_ADMIN_API_TOKEN: ${{ secrets.CP_ADMIN_API_TOKEN }}
-          TARGET_TAG: ${{ inputs.target_tag || 'latest' }}
+          TARGET_TAG: ${{ steps.tag.outputs.target_tag }}
           CANARY_SLUG: ${{ inputs.canary_slug || 'hongmingwang' }}
           SOAK_SECONDS: ${{ inputs.soak_seconds || '60' }}
           BATCH_SIZE: ${{ inputs.batch_size || '3' }}
@@ -161,4 +217,158 @@ jobs:
             echo "::error::redeploy-fleet reported ok=false (see summary for which tenant halted the rollout)"
             exit 1
           fi
-          echo "::notice::Tenant fleet redeploy complete."
+          echo "::notice::Tenant fleet redeploy reported ssm_status=Success — verifying actual image roll on each tenant..."
+
+          # Stash the response for the verify step. $RUNNER_TEMP outlasts
+          # the step boundary; $HTTP_RESPONSE doesn't.
+          cp "$HTTP_RESPONSE" "$RUNNER_TEMP/redeploy-response.json"
+
+      - name: Verify each tenant /buildinfo matches published SHA
+        # ROOT FIX FOR #2395.
+        #
+        # `redeploy-fleet`'s `ssm_status=Success` means "the SSM RPC
+        # didn't error" — NOT "the new image is running on the tenant."
+        # `:latest` lives in the local Docker daemon's image cache; if
+        # the SSM document does `docker compose up -d` without an
+        # explicit `docker pull`, the daemon serves the previously-
+        # cached digest and the container restarts on stale code.
+        # 2026-04-30 incident: hongmingwang's tenant reported
+        # ssm_status=Success at 17:00:53Z but kept serving pre-501a42d7
+        # chat_files for 30+ min — the lazy-heal fix never reached the
+        # user despite green deploy + green redeploy.
+        #
+        # This step closes the gap by curling each tenant's /buildinfo
+        # endpoint (added in workspace-server/internal/buildinfo +
+        # /Dockerfile* GIT_SHA build-arg, this PR) and comparing the
+        # returned git_sha to the SHA the workflow expects. Mismatches
+        # fail the workflow, which is what `ok=true` should have
+        # guaranteed all along.
+        #
+        # When the redeploy was triggered by workflow_dispatch with a
+        # specific tag (target_tag != "latest"), the expected SHA may
+        # not equal ${{ github.sha }} — in that case we resolve via
+        # GHCR's manifest. For workflow_run (default :latest) the
+        # workflow_run.head_sha is the SHA that just published.
+        env:
+          EXPECTED_SHA: ${{ github.event.workflow_run.head_sha || github.sha }}
+          TARGET_TAG: ${{ steps.tag.outputs.target_tag }}
+          # Tenant subdomain template — slugs from the response are
+          # appended. Production CP issues `<slug>.moleculesai.app`;
+          # staging CP issues `<slug>.staging.moleculesai.app`. This
+          # workflow runs on main → prod CP → no `staging.` infix.
+          TENANT_DOMAIN: 'moleculesai.app'
+        run: |
+          set -euo pipefail
+
+          EXPECTED_SHORT="${EXPECTED_SHA:0:7}"
+          if [ "$TARGET_TAG" != "latest" ] \
+             && [ "$TARGET_TAG" != "$EXPECTED_SHA" ] \
+             && [ "$TARGET_TAG" != "staging-$EXPECTED_SHORT" ]; then
+            # workflow_dispatch with a pinned tag that isn't the head
+            # SHA — operator is rolling back / pinning. Skip the
+            # verification because we don't have the expected SHA in
+            # this context (would need to crane-inspect the GHCR
+            # manifest, which is a follow-up). Failing-open here is
+            # safe: the operator chose the tag deliberately.
+            #
+            # `staging-<short_head_sha>` IS verified — it's the new
+            # auto-trigger default (see Compute target tag step) and
+            # the digest under that tag SHOULD match EXPECTED_SHA.
+            echo "::notice::target_tag=$TARGET_TAG (operator-pinned) — skipping per-tenant SHA verification."
+            exit 0
+          fi
+
+          RESP="$RUNNER_TEMP/redeploy-response.json"
+          if [ ! -s "$RESP" ]; then
+            echo "::error::redeploy-response.json missing or empty — verify step ran without a response to read"
+            exit 1
+          fi
+
+          # Pull only successfully-redeployed tenants. Any tenant that
+          # halted the rollout already failed the previous step, so we
+          # don't double-count them here.
+          mapfile -t SLUGS < <(jq -r '.results[]? | select(.healthz_ok == true) | .slug' "$RESP")
+          if [ ${#SLUGS[@]} -eq 0 ]; then
+            echo "::warning::No tenants reported healthz_ok — nothing to verify"
+            exit 0
+          fi
+
+          echo "Verifying ${#SLUGS[@]} tenant(s) against EXPECTED_SHA=${EXPECTED_SHA:0:7}..."
+
+          # Two distinct failure modes — STALE (the #2395 bug class, hard-fail)
+          # vs UNREACHABLE (teardown race, soft-warn). See the staging variant's
+          # comment for the full rationale; same logic applies on prod even
+          # though prod has fewer ephemeral tenants — the asymmetry would be a
+          # gratuitous fork.
+          STALE_COUNT=0
+          UNREACHABLE_COUNT=0
+          STALE_LINES=()
+          UNREACHABLE_LINES=()
+          for slug in "${SLUGS[@]}"; do
+            URL="https://${slug}.${TENANT_DOMAIN}/buildinfo"
+            # 30s total: tenant just SSM-restarted, may still be coming
+            # up. Retry-on-empty rather than retry-on-status — we want
+            # to fail fast on "responded with wrong SHA", not "still
+            # warming up".
+            BODY=$(curl -sS --max-time 30 --retry 3 --retry-delay 5 --retry-connrefused "$URL" || true)
+            ACTUAL_SHA=$(echo "$BODY" | jq -r '.git_sha // ""' 2>/dev/null || echo "")
+            if [ -z "$ACTUAL_SHA" ]; then
+              UNREACHABLE_COUNT=$((UNREACHABLE_COUNT + 1))
+              UNREACHABLE_LINES+=("| $slug | (no /buildinfo response) | ${EXPECTED_SHA:0:7} | ⚠ unreachable (likely teardown race) |")
+              continue
+            fi
+            if [ "$ACTUAL_SHA" = "$EXPECTED_SHA" ]; then
+              echo "  $slug: ${ACTUAL_SHA:0:7} ✓"
+            else
+              STALE_COUNT=$((STALE_COUNT + 1))
+              STALE_LINES+=("| $slug | ${ACTUAL_SHA:0:7} | ${EXPECTED_SHA:0:7} | ❌ stale |")
+            fi
+          done
+
+          {
+            echo ""
+            echo "### Per-tenant /buildinfo verification"
+            echo ""
+            echo "Expected SHA: \`${EXPECTED_SHA:0:7}\`"
+            echo ""
+            if [ $STALE_COUNT -gt 0 ]; then
+              echo "**${STALE_COUNT} STALE tenant(s) — these did NOT pick up the new image despite ssm_status=Success:**"
+              echo ""
+              echo "| Slug | Actual /buildinfo SHA | Expected | Status |"
+              echo "|------|----------------------|----------|--------|"
+              for line in "${STALE_LINES[@]}"; do echo "$line"; done
+              echo ""
+            fi
+            if [ $UNREACHABLE_COUNT -gt 0 ]; then
+              echo "**${UNREACHABLE_COUNT} unreachable tenant(s) — likely teardown race (soft-warn, not failing):**"
+              echo ""
+              echo "| Slug | Actual /buildinfo SHA | Expected | Status |"
+              echo "|------|----------------------|----------|--------|"
+              for line in "${UNREACHABLE_LINES[@]}"; do echo "$line"; done
+              echo ""
+            fi
+            if [ $STALE_COUNT -eq 0 ] && [ $UNREACHABLE_COUNT -eq 0 ]; then
+              echo "All ${#SLUGS[@]} tenants returned matching SHA. ✓"
+            fi
+          } >> "$GITHUB_STEP_SUMMARY"
+
+          if [ $UNREACHABLE_COUNT -gt 0 ]; then
+            echo "::warning::$UNREACHABLE_COUNT tenant(s) unreachable post-redeploy. Likely benign teardown race — CP healthz monitor catches real outages."
+          fi
+
+          # Belt-and-suspenders sanity floor: same logic as the staging
+          # variant — see that file's comment for the full rationale.
+          # Floor only applies when fleet >= 4; below that, canary-verify
+          # is the actual gate.
+          TOTAL_VERIFIED=${#SLUGS[@]}
+          if [ $TOTAL_VERIFIED -ge 4 ] && [ $UNREACHABLE_COUNT -gt $((TOTAL_VERIFIED / 2)) ]; then
+            echo "::error::$UNREACHABLE_COUNT of $TOTAL_VERIFIED tenant(s) unreachable — exceeds 50% threshold on a fleet large enough that this signals a real outage, not teardown race."
+            exit 1
+          fi
+
+          if [ $STALE_COUNT -gt 0 ]; then
+            echo "::error::$STALE_COUNT tenant(s) returned a stale SHA. ssm_status=Success was misleading — see job summary."
+            exit 1
+          fi
+
+          echo "::notice::Tenant fleet redeploy complete — all reachable tenants on ${EXPECTED_SHA:0:7} (${UNREACHABLE_COUNT} unreachable, soft-warned)."

.github/workflows/redeploy-tenants-on-staging.yml

@@ -0,0 +1,348 @@
+name: redeploy-tenants-on-staging
+
+# Auto-refresh staging tenant EC2s after every staging-branch merge.
+#
+# Mirror of redeploy-tenants-on-main.yml, with the staging-CP host and
+# the :staging-latest tag. Sister workflow exists for prod (rolls
+# :latest after canary-verify). Both share the same shape — just
+# different CP_URL + target_tag + admin token secret.
+#
+# Why this workflow exists: publish-workspace-server-image now builds
+# on every staging-branch push (PR #2335), pushing
+# platform-tenant:staging-latest to GHCR. Existing tenants pulled
+# their image once at boot and never re-pull, so the new image just
+# sits unused until the tenant is reprovisioned.
+#
+# This workflow closes the gap by calling staging-CP's
+# /cp/admin/tenants/redeploy-fleet, which performs a canary-first,
+# batched, health-gated SSM redeploy across every live staging tenant.
+# Same endpoint shape as prod CP — only the host differs.
+#
+# Runtime ordering:
+#   1. publish-workspace-server-image completes on staging branch →
+#      new :staging-latest in GHCR.
+#   2. This workflow fires via workflow_run, waits 30s for GHCR's CDN
+#      to propagate the new tag.
+#   3. Calls redeploy-fleet with no canary (staging IS canary; we don't
+#      need a sub-canary inside it). Soak still applies to the first
+#      tenant in case of bad-deploy detection.
+#   4. Any failure aborts the rollout and leaves older tenants on the
+#      prior image — safer default than half-and-half state.
+#
+# Rollback path: re-run with workflow_dispatch + target_tag=staging-<sha>
+# of a known-good build.
+
+on:
+  workflow_run:
+    workflows: ['publish-workspace-server-image']
+    types: [completed]
+    branches: [staging]
+  workflow_dispatch:
+    inputs:
+      target_tag:
+        description: 'Tenant image tag to deploy (e.g. "staging-latest" or "staging-a59f1a6c"). Defaults to staging-latest when empty.'
+        required: false
+        type: string
+        default: 'staging-latest'
+      canary_slug:
+        description: 'Tenant slug to deploy first + soak (empty = skip canary, fan out immediately). Default empty for staging since staging itself is the canary.'
+        required: false
+        type: string
+        default: ''
+      soak_seconds:
+        description: 'Seconds to wait after canary before fanning out. Only meaningful if canary_slug is set.'
+        required: false
+        type: string
+        default: '60'
+      batch_size:
+        description: 'How many tenants SSM redeploys in parallel per batch.'
+        required: false
+        type: string
+        default: '3'
+      dry_run:
+        description: 'Plan only — do not actually redeploy.'
+        required: false
+        type: boolean
+        default: false
+
+permissions:
+  contents: read
+  # No write scopes needed — the workflow hits an external CP endpoint,
+  # not the GitHub API.
+
+# Serialize per-branch so two rapid staging pushes' redeploys don't
+# overlap and cause confusing per-tenant SSM state. cancel-in-progress
+# is false because aborting a half-rolled-out fleet leaves tenants
+# stuck on whatever image they happened to be on when cancelled.
+concurrency:
+  group: redeploy-tenants-on-staging
+  cancel-in-progress: false
+
+jobs:
+  redeploy:
+    # Skip the auto-trigger if publish-workspace-server-image didn't
+    # actually succeed. workflow_run fires on any completion state; we
+    # don't want to redeploy against a half-built image.
+    if: |
+      github.event_name == 'workflow_dispatch' ||
+      (github.event_name == 'workflow_run' && github.event.workflow_run.conclusion == 'success')
+    runs-on: ubuntu-latest
+    timeout-minutes: 25
+    steps:
+      - name: Wait for GHCR tag propagation
+        # GHCR's edge cache takes ~15-30s to consistently serve the new
+        # :staging-latest manifest after the registry accepts the push.
+        # Same rationale as redeploy-tenants-on-main.yml.
+        run: sleep 30
+
+      - name: Call staging-CP redeploy-fleet
+        # CP_STAGING_ADMIN_API_TOKEN must be set as a repo/org secret
+        # on Molecule-AI/molecule-core, matching staging-CP's
+        # CP_ADMIN_API_TOKEN env var (visible in Railway controlplane
+        # / staging environment). Stored separately from the prod
+        # CP_ADMIN_API_TOKEN so a leak of one doesn't auth the other.
+        env:
+          CP_URL: ${{ vars.STAGING_CP_URL || 'https://staging-api.moleculesai.app' }}
+          CP_STAGING_ADMIN_API_TOKEN: ${{ secrets.CP_STAGING_ADMIN_API_TOKEN }}
+          TARGET_TAG: ${{ inputs.target_tag || 'staging-latest' }}
+          CANARY_SLUG: ${{ inputs.canary_slug || '' }}
+          SOAK_SECONDS: ${{ inputs.soak_seconds || '60' }}
+          BATCH_SIZE: ${{ inputs.batch_size || '3' }}
+          DRY_RUN: ${{ inputs.dry_run || false }}
+        run: |
+          set -euo pipefail
+
+          # Schedule-vs-dispatch hardening (mirrors sweep-cf-orphans
+          # and sweep-cf-tunnels): hard-fail on auto-trigger when the
+          # secret is missing so a misconfigured-repo doesn't silently
+          # serve stale staging tenants. Soft-skip on operator dispatch.
+          if [ -z "${CP_STAGING_ADMIN_API_TOKEN:-}" ]; then
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::CP_STAGING_ADMIN_API_TOKEN secret not set — skipping redeploy"
+              echo "::warning::Set CP_STAGING_ADMIN_API_TOKEN in repo secrets to enable auto-redeploy."
+              echo "::notice::Pull the value from staging-CP's CP_ADMIN_API_TOKEN env in Railway."
+              exit 0
+            fi
+            echo "::error::staging redeploy cannot run — CP_STAGING_ADMIN_API_TOKEN secret missing"
+            echo "::error::set it at Settings → Secrets and Variables → Actions; pull from staging-CP's CP_ADMIN_API_TOKEN env in Railway."
+            exit 1
+          fi
+
+          BODY=$(jq -nc \
+            --arg tag "$TARGET_TAG" \
+            --arg canary "$CANARY_SLUG" \
+            --argjson soak "$SOAK_SECONDS" \
+            --argjson batch "$BATCH_SIZE" \
+            --argjson dry "$DRY_RUN" \
+            '{
+              target_tag: $tag,
+              canary_slug: $canary,
+              soak_seconds: $soak,
+              batch_size: $batch,
+              dry_run: $dry
+            }')
+
+          echo "POST $CP_URL/cp/admin/tenants/redeploy-fleet"
+          echo "  body: $BODY"
+
+          HTTP_RESPONSE=$(mktemp)
+          HTTP_CODE=$(curl -sS -o "$HTTP_RESPONSE" -w '%{http_code}' \
+            -m 1200 \
+            -H "Authorization: Bearer $CP_STAGING_ADMIN_API_TOKEN" \
+            -H "Content-Type: application/json" \
+            -X POST "$CP_URL/cp/admin/tenants/redeploy-fleet" \
+            -d "$BODY" || echo "000")
+
+          echo "HTTP $HTTP_CODE"
+          cat "$HTTP_RESPONSE" | jq . || cat "$HTTP_RESPONSE"
+
+          {
+            echo "## Staging tenant redeploy fleet"
+            echo ""
+            echo "**Target tag:** \`$TARGET_TAG\`"
+            echo "**Canary:** \`${CANARY_SLUG:-(none — staging is itself the canary)}\` (soak ${SOAK_SECONDS}s)"
+            echo "**Batch size:** $BATCH_SIZE"
+            echo "**Dry run:** $DRY_RUN"
+            echo "**HTTP:** $HTTP_CODE"
+            echo ""
+            echo "### Per-tenant result"
+            echo ""
+            echo '| Slug | Phase | SSM Status | Exit | Healthz | Error |'
+            echo '|------|-------|------------|------|---------|-------|'
+            jq -r '.results[]? | "| \(.slug) | \(.phase) | \(.ssm_status // "-") | \(.ssm_exit_code) | \(.healthz_ok) | \(.error // "-") |"' "$HTTP_RESPONSE" || true
+          } >> "$GITHUB_STEP_SUMMARY"
+
+          # Distinguish "real fleet failure" from "E2E teardown race".
+          #
+          # CP returns HTTP 500 + ok=false whenever ANY tenant in the
+          # fleet failed SSM or healthz. In practice the recurring source
+          # of these is ephemeral test tenants being torn down by their
+          # parent E2E run mid-redeploy: the EC2 dies → SSM exit=2 or
+          # healthz timeout → CP marks the fleet failed → this workflow
+          # goes red even though every operator-facing tenant rolled fine.
+          #
+          # Ephemeral slug prefixes (kept in sync with sweep-stale-e2e-orgs.yml
+          # — see that file for the source-of-truth list and rationale):
+          #   - e2e-*       — canvas/saas/ext E2E suites
+          #   - rt-e2e-*    — runtime-test harness fixtures (RFC #2251)
+          # Long-lived prefixes that are NOT ephemeral and MUST hard-fail:
+          # demo-prep, dryrun-*, dryrun2-*, plus all human tenant slugs.
+          #
+          # Filter: if HTTP=500/ok=false AND every failed slug matches an
+          # ephemeral prefix, treat as soft-warn and let the verify step
+          # downstream handle unreachable-vs-stale (#2402). Any non-ephemeral
+          # failure or a non-500 HTTP response remains a hard failure.
+          OK=$(jq -r '.ok // "false"' "$HTTP_RESPONSE")
+          FAILED_SLUGS=$(jq -r '
+            .results[]?
+            | select((.healthz_ok != true) or (.ssm_status != "Success"))
+            | .slug' "$HTTP_RESPONSE" 2>/dev/null || true)
+          EPHEMERAL_PREFIX_RE='^(e2e-|rt-e2e-)'
+          NON_EPHEMERAL_FAILED=$(printf '%s\n' "$FAILED_SLUGS" | grep -v '^$' | grep -Ev "$EPHEMERAL_PREFIX_RE" || true)
+
+          if [ "$HTTP_CODE" = "200" ] && [ "$OK" = "true" ]; then
+            : # happy path — fall through to verification
+          elif [ "$HTTP_CODE" = "500" ] && [ -z "$NON_EPHEMERAL_FAILED" ] && [ -n "$FAILED_SLUGS" ]; then
+            COUNT=$(printf '%s\n' "$FAILED_SLUGS" | grep -Ec "$EPHEMERAL_PREFIX_RE" || true)
+            echo "::warning::redeploy-fleet returned HTTP 500 but every failed tenant ($COUNT) is ephemeral (e2e-*/rt-e2e-*) — treating as teardown race, soft-warning."
+            printf '%s\n' "$FAILED_SLUGS" | sed 's/^/::warning::  failed: /'
+          elif [ "$HTTP_CODE" != "200" ]; then
+            echo "::error::redeploy-fleet returned HTTP $HTTP_CODE"
+            if [ -n "$NON_EPHEMERAL_FAILED" ]; then
+              echo "::error::non-ephemeral tenant(s) failed:"
+              printf '%s\n' "$NON_EPHEMERAL_FAILED" | sed 's/^/::error::  /'
+            fi
+            exit 1
+          else
+            # HTTP=200 but ok=false (shouldn't happen with current CP
+            # but keep the gate for completeness).
+            echo "::error::redeploy-fleet reported ok=false (see summary for which tenant halted the rollout)"
+            exit 1
+          fi
+          echo "::notice::Staging tenant fleet redeploy reported ssm_status=Success — verifying actual image roll on each tenant..."
+
+          cp "$HTTP_RESPONSE" "$RUNNER_TEMP/redeploy-response.json"
+
+      - name: Verify each staging tenant /buildinfo matches published SHA
+        # Mirror of the verify step in redeploy-tenants-on-main.yml — see
+        # there for the rationale (#2395 root fix). Staging has the same
+        # ssm_status-success-but-stale-image hazard and benefits from the
+        # same gate. Diff: TENANT_DOMAIN includes the `staging.` infix.
+        env:
+          EXPECTED_SHA: ${{ github.event.workflow_run.head_sha || github.sha }}
+          TARGET_TAG: ${{ inputs.target_tag || 'staging-latest' }}
+          TENANT_DOMAIN: 'staging.moleculesai.app'
+        run: |
+          set -euo pipefail
+
+          # staging-latest is the staging-side moving tag; treat it the
+          # same way main treats `latest`. Operator-pinned SHAs skip
+          # verification (see main variant for why).
+          if [ "$TARGET_TAG" != "staging-latest" ] && [ "$TARGET_TAG" != "latest" ] && [ "$TARGET_TAG" != "$EXPECTED_SHA" ]; then
+            echo "::notice::target_tag=$TARGET_TAG (operator-pinned) — skipping per-tenant SHA verification."
+            exit 0
+          fi
+
+          RESP="$RUNNER_TEMP/redeploy-response.json"
+          if [ ! -s "$RESP" ]; then
+            echo "::error::redeploy-response.json missing or empty"
+            exit 1
+          fi
+
+          mapfile -t SLUGS < <(jq -r '.results[]? | select(.healthz_ok == true) | .slug' "$RESP")
+          if [ ${#SLUGS[@]} -eq 0 ]; then
+            echo "::warning::No staging tenants reported healthz_ok — nothing to verify"
+            exit 0
+          fi
+
+          echo "Verifying ${#SLUGS[@]} staging tenant(s) against EXPECTED_SHA=${EXPECTED_SHA:0:7}..."
+
+          # Two distinct failure modes here:
+          #   STALE_COUNT      — tenant returned a SHA that doesn't match. THIS is
+          #                      the #2395 bug class: tenant up + serving old code.
+          #                      Always hard-fail the workflow.
+          #   UNREACHABLE_COUNT — tenant didn't respond. Almost always a benign
+          #                      teardown race: redeploy-fleet snapshot says
+          #                      healthz_ok=true, then the E2E suite tears the
+          #                      ephemeral tenant down before this step runs (the
+          #                      e2e-* fixtures churn 5-10/hour on staging). Soft-
+          #                      warn so we don't block staging→main on cleanup.
+          #                      Real "tenant up but unreachable" is caught by CP's
+          #                      own healthz monitor + the post-redeploy alert; we
+          #                      don't need to double-count it here.
+          STALE_COUNT=0
+          UNREACHABLE_COUNT=0
+          STALE_LINES=()
+          UNREACHABLE_LINES=()
+          for slug in "${SLUGS[@]}"; do
+            URL="https://${slug}.${TENANT_DOMAIN}/buildinfo"
+            BODY=$(curl -sS --max-time 30 --retry 3 --retry-delay 5 --retry-connrefused "$URL" || true)
+            ACTUAL_SHA=$(echo "$BODY" | jq -r '.git_sha // ""' 2>/dev/null || echo "")
+            if [ -z "$ACTUAL_SHA" ]; then
+              UNREACHABLE_COUNT=$((UNREACHABLE_COUNT + 1))
+              UNREACHABLE_LINES+=("| $slug | (no /buildinfo response) | ${EXPECTED_SHA:0:7} | ⚠ unreachable (likely teardown race) |")
+              continue
+            fi
+            if [ "$ACTUAL_SHA" = "$EXPECTED_SHA" ]; then
+              echo "  $slug: ${ACTUAL_SHA:0:7} ✓"
+            else
+              STALE_COUNT=$((STALE_COUNT + 1))
+              STALE_LINES+=("| $slug | ${ACTUAL_SHA:0:7} | ${EXPECTED_SHA:0:7} | ❌ stale |")
+            fi
+          done
+
+          {
+            echo ""
+            echo "### Per-tenant /buildinfo verification (staging)"
+            echo ""
+            echo "Expected SHA: \`${EXPECTED_SHA:0:7}\`"
+            echo ""
+            if [ $STALE_COUNT -gt 0 ]; then
+              echo "**${STALE_COUNT} STALE tenant(s) — these did NOT pick up the new image despite ssm_status=Success:**"
+              echo ""
+              echo "| Slug | Actual /buildinfo SHA | Expected | Status |"
+              echo "|------|----------------------|----------|--------|"
+              for line in "${STALE_LINES[@]}"; do echo "$line"; done
+              echo ""
+            fi
+            if [ $UNREACHABLE_COUNT -gt 0 ]; then
+              echo "**${UNREACHABLE_COUNT} unreachable tenant(s) — likely E2E teardown race (soft-warn, not failing):**"
+              echo ""
+              echo "| Slug | Actual /buildinfo SHA | Expected | Status |"
+              echo "|------|----------------------|----------|--------|"
+              for line in "${UNREACHABLE_LINES[@]}"; do echo "$line"; done
+              echo ""
+            fi
+            if [ $STALE_COUNT -eq 0 ] && [ $UNREACHABLE_COUNT -eq 0 ]; then
+              echo "All ${#SLUGS[@]} staging tenants returned matching SHA. ✓"
+            fi
+          } >> "$GITHUB_STEP_SUMMARY"
+
+          if [ $UNREACHABLE_COUNT -gt 0 ]; then
+            echo "::warning::$UNREACHABLE_COUNT staging tenant(s) unreachable post-redeploy. Likely benign teardown race — CP healthz monitor catches real outages."
+          fi
+
+          # Belt-and-suspenders sanity floor: if MORE than half the fleet is
+          # unreachable AND the fleet is large enough that "half down" is
+          # statistically meaningful, this is a real outage (e.g. new image
+          # crashes on startup), not a teardown race. Hard-fail.
+          #
+          # Floor only applies when TOTAL_VERIFIED >= 4 — below that, the
+          # canary-verify step is the actual gate for "all tenants down"
+          # detection (it runs against the canary first and aborts the
+          # rollout if the canary fails to come up). Without the >=4 gate,
+          # a 1-tenant fleet (e.g. a single ephemeral e2e-* tenant on a
+          # quiet staging push) would re-flake on the exact teardown-race
+          # condition #2402 fixed: 1 of 1 unreachable = 100% > 50% → fail.
+          TOTAL_VERIFIED=${#SLUGS[@]}
+          if [ $TOTAL_VERIFIED -ge 4 ] && [ $UNREACHABLE_COUNT -gt $((TOTAL_VERIFIED / 2)) ]; then
+            echo "::error::$UNREACHABLE_COUNT of $TOTAL_VERIFIED staging tenant(s) unreachable — exceeds 50% threshold on a fleet large enough that this signals a real outage, not teardown race."
+            exit 1
+          fi
+
+          if [ $STALE_COUNT -gt 0 ]; then
+            echo "::error::$STALE_COUNT staging tenant(s) returned a stale SHA. ssm_status=Success was misleading — see job summary."
+            exit 1
+          fi
+
+          echo "::notice::Staging tenant fleet redeploy complete — all reachable tenants on ${EXPECTED_SHA:0:7} (${UNREACHABLE_COUNT} unreachable, soft-warned)."

.github/workflows/runtime-pin-compat.yml

@@ -60,8 +60,8 @@ jobs:
     name: PyPI-latest install + import smoke
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-python@v5
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: '3.11'
           cache: pip

.github/workflows/runtime-prbuild-compat.yml

@@ -23,53 +23,88 @@ name: Runtime PR-Built Compatibility
 #
 # By building from the PR's source and smoke-importing THAT wheel, we
 # fail at PR-time instead of after publish.
+#
+# Required-check shape (2026-05-01): the workflow runs on EVERY push +
+# PR + merge_group event with no top-level `paths:` filter, then uses a
+# detect-changes job + per-step `if:` gates inside ONE always-running
+# job named `PR-built wheel + import smoke`. PRs that don't touch
+# wheel-relevant paths get a no-op SUCCESS check run, satisfying branch
+# protection without re-running the heavy build. Same pattern as
+# e2e-api.yml — see its comment for the full rationale + the 2026-04-29
+# PR #2264 incident that motivated the always-run-with-if-gates shape.
 
 on:
   push:
     branches: [main, staging]
-    paths:
-      # Broad filter: this workflow's verdict can change whenever any
-      # workspace/ source file changes (because the wheel we build is
-      # produced from those files), or when the build script itself
-      # changes (it controls the wheel layout).
-      - 'workspace/**'
-      - 'scripts/build_runtime_package.py'
-      - '.github/workflows/runtime-prbuild-compat.yml'
   pull_request:
     branches: [main, staging]
-    paths:
-      - 'workspace/**'
-      - 'scripts/build_runtime_package.py'
-      - '.github/workflows/runtime-prbuild-compat.yml'
   workflow_dispatch:
-  # Required-check support: when this becomes a branch-protection gate,
-  # merge_group runs let the queue green-check this in addition to PRs.
   merge_group:
     types: [checks_requested]
-  # No cron: the same pre-merge run already covered the commit, and
-  # re-running daily wouldn't surface anything new (workspace/ doesn't
-  # change between cron firings unless a PR already passed this gate).
 
 concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
+  group: ${{ github.workflow }}-${{ github.event.pull_request.head.sha || github.sha }}
   cancel-in-progress: true
 
 jobs:
+  detect-changes:
+    runs-on: ubuntu-latest
+    outputs:
+      wheel: ${{ steps.decide.outputs.wheel }}
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: dorny/paths-filter@fbd0ab8f3e69293af611ebaee6363fc25e6d187d # v4.0.1
+        id: filter
+        with:
+          filters: |
+            wheel:
+              - 'workspace/**'
+              - 'scripts/build_runtime_package.py'
+              - 'scripts/wheel_smoke.py'
+              - '.github/workflows/runtime-prbuild-compat.yml'
+      - id: decide
+        # Always run real work for manual dispatch + merge_group — no
+        # diff-against-base in those contexts, and the gate exists to
+        # validate the to-be-merged state regardless of which paths it
+        # touched (paths-filter would default to "no changes" which is
+        # the wrong answer when the queue is composing many PRs).
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ] || [ "${{ github.event_name }}" = "merge_group" ]; then
+            echo "wheel=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "wheel=${{ steps.filter.outputs.wheel }}" >> "$GITHUB_OUTPUT"
+          fi
+
+  # ONE job (no job-level `if:`) that always runs and reports under the
+  # required-check name `PR-built wheel + import smoke`. Real work is
+  # gated per-step on `needs.detect-changes.outputs.wheel`. Same shape
+  # as e2e-api.yml's e2e-api job — see its comment block for the full
+  # rationale (SKIPPED check runs block branch protection even with
+  # SUCCESS siblings; collapsing to one always-run job emits exactly
+  # one SUCCESS check run).
   local-build-install:
-    # Builds the wheel from THIS PR's workspace/ + scripts/ and tests
-    # IT — the artifact that WOULD be published if this PR merges.
+    needs: detect-changes
     name: PR-built wheel + import smoke
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-python@v5
+      - name: No-op pass (paths filter excluded this commit)
+        if: needs.detect-changes.outputs.wheel != 'true'
+        run: |
+          echo "No workspace/ / scripts/{build_runtime_package,wheel_smoke}.py / workflow changes — wheel gate satisfied without rebuilding."
+          echo "::notice::PR-built wheel + import smoke no-op pass (paths filter excluded this commit)."
+      - if: needs.detect-changes.outputs.wheel == 'true'
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - if: needs.detect-changes.outputs.wheel == 'true'
+        uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: '3.11'
           cache: pip
           cache-dependency-path: workspace/requirements.txt
       - name: Install build tooling
+        if: needs.detect-changes.outputs.wheel == 'true'
         run: pip install build
       - name: Build wheel from PR source (mirrors publish-runtime.yml)
+        if: needs.detect-changes.outputs.wheel == 'true'
         # Use a fixed test version so the wheel filename is predictable.
         # Doesn't reach PyPI — this build is local-only for the smoke.
         # Use the SAME build script with the SAME args as
@@ -86,6 +121,7 @@ jobs:
             --out /tmp/runtime-build
           cd /tmp/runtime-build && python -m build
       - name: Install built wheel + workspace requirements
+        if: needs.detect-changes.outputs.wheel == 'true'
         run: |
           python -m venv /tmp/venv-built
           /tmp/venv-built/bin/pip install --upgrade pip
@@ -94,7 +130,10 @@ jobs:
           /tmp/venv-built/bin/pip show molecule-ai-workspace-runtime a2a-sdk \
             | grep -E '^(Name|Version):'
       - name: Smoke import the PR-built wheel
-        env:
-          WORKSPACE_ID: 00000000-0000-0000-0000-000000000001
+        if: needs.detect-changes.outputs.wheel == 'true'
+        # Same script publish-runtime.yml runs against the to-be-PyPI wheel.
+        # Closes the PR-time vs publish-time gap: a PR adding a new SDK
+        # call-shape no longer passes here (narrow `import main_sync`) only
+        # to fail post-merge in publish-runtime's broader smoke.
         run: |
-          /tmp/venv-built/bin/python -c "from molecule_runtime.main import main_sync; print('PR-built runtime imports OK')"
+          /tmp/venv-built/bin/python "$GITHUB_WORKSPACE/scripts/wheel_smoke.py"

.github/workflows/secret-pattern-drift.yml

@@ -0,0 +1,58 @@
+name: SECRET_PATTERNS drift lint
+
+# Detects when the canonical SECRET_PATTERNS array in
+# .github/workflows/secret-scan.yml diverges from known consumer
+# mirrors (workspace-runtime's bundled pre-commit hook today; more
+# can be added as the consumer set grows).
+#
+# Why this exists: every side that scans for credentials has its own
+# copy of the pattern list. They drift — most recently the runtime
+# hook lagged the canonical by one pattern (sk-cp- / MiniMax F1088),
+# so a developer's local pre-commit would let a sk-cp- token through
+# while the org-wide CI scan would refuse it. The cost of that drift
+# is dev confusion + delayed feedback; the fix is automated detection.
+#
+# Triggers:
+#   - schedule: daily 05:00 UTC. Catches drift introduced by edits
+#     to a consumer copy that didn't update canonical here.
+#   - push to main/staging where the canonical or this lint changed:
+#     catches the inverse — canonical updated but consumers not yet
+#     bumped. The lint will fail the push; that's intentional, the
+#     person editing canonical is the right person to also update
+#     the consumer.
+#   - workflow_dispatch: ad-hoc operator runs.
+
+on:
+  schedule:
+    # 05:00 UTC = 22:00 PT / 01:00 ET. Quiet hours so a failure
+    # email lands when humans are starting their day, not
+    # interrupting it.
+    - cron: "0 5 * * *"
+  push:
+    branches: [main, staging]
+    paths:
+      - ".github/workflows/secret-scan.yml"
+      - ".github/workflows/secret-pattern-drift.yml"
+      - ".github/scripts/lint_secret_pattern_drift.py"
+      - ".githooks/pre-commit"
+  workflow_dispatch:
+
+# GITHUB_TOKEN scoped to read-only. The lint only does git checkout
+# + HTTPS GETs to public consumer files; no writes to anything.
+permissions:
+  contents: read
+
+jobs:
+  lint:
+    name: Detect SECRET_PATTERNS drift
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+    steps:
+      - uses: actions/checkout@v6
+
+      - uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
+        with:
+          python-version: "3.11"
+
+      - name: Run drift lint
+        run: python3 .github/scripts/lint_secret_pattern_drift.py

.github/workflows/secret-scan.yml

@@ -40,7 +40,7 @@ jobs:
     name: Scan diff for credential-shaped strings
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
         with:
           fetch-depth: 2  # need previous commit to diff against on push events
 
@@ -148,7 +148,13 @@ jobs:
           SELF=".github/workflows/secret-scan.yml"
 
           OFFENDING=""
-          for f in $CHANGED; do
+          # `while IFS= read -r` (not `for f in $CHANGED`) so filenames
+          # containing whitespace don't word-split silently — a path
+          # with a space would otherwise produce two iterations on
+          # tokens that aren't real filenames, breaking the
+          # self-exclude + diff lookup.
+          while IFS= read -r f; do
+            [ -z "$f" ] && continue
             [ "$f" = "$SELF" ] && continue
             if [ -n "$DIFF_RANGE" ]; then
               ADDED=$(git diff --no-color --unified=0 "$BASE" "$HEAD" -- "$f" 2>/dev/null | grep -E '^\+[^+]' || true)
@@ -164,11 +170,18 @@ jobs:
                 break
               fi
             done
-          done
+          done <<< "$CHANGED"
 
           if [ -n "$OFFENDING" ]; then
             echo "::error::Credential-shaped strings detected in diff additions:"
-            printf "$OFFENDING"
+            # `printf '%b' "$OFFENDING"` interprets backslash escapes
+            # (the literal `\n` we appended above becomes a newline)
+            # WITHOUT treating OFFENDING as a format string. Plain
+            # `printf "$OFFENDING"` is a format-string sink: a filename
+            # containing `%` would be interpreted as a conversion
+            # specifier, corrupting the error message (or printing
+            # `%(missing)` artifacts).
+            printf '%b' "$OFFENDING"
             echo ""
             echo "The actual matched values are NOT echoed here, deliberately —"
             echo "round-tripping a leaked credential into CI logs widens the blast"

.github/workflows/sweep-aws-secrets.yml

@@ -0,0 +1,129 @@
+name: Sweep stale AWS Secrets Manager secrets
+
+# Janitor for per-tenant AWS Secrets Manager secrets
+# (`molecule/tenant/<org_id>/bootstrap`) whose backing tenant no
+# longer exists. Parallel-shape to sweep-cf-tunnels.yml and
+# sweep-cf-orphans.yml — different cloud, same justification.
+#
+# Why this exists separately from a long-term reconciler integration:
+#   - molecule-controlplane's tenant_resources audit table (mig 024)
+#     currently tracks four resource kinds: CloudflareTunnel,
+#     CloudflareDNS, EC2Instance, SecurityGroup. SecretsManager is
+#     not in the list, so the existing reconciler doesn't catch
+#     orphan secrets.
+#   - At ~$0.40/secret/month the cost grew to ~$19/month before this
+#     sweeper was written, indicating ~45+ orphan secrets from
+#     crashed provisions and incomplete deprovision flows.
+#   - The proper fix (KindSecretsManagerSecret + recorder hook +
+#     reconciler enumerator) is filed as a separate controlplane
+#     issue. This sweeper is the immediate cost-relief stopgap.
+#
+# IAM principal: AWS_JANITOR_ACCESS_KEY_ID / AWS_JANITOR_SECRET_ACCESS_KEY.
+# This is a DEDICATED principal — the production `molecule-cp` IAM
+# user lacks `secretsmanager:ListSecrets` (it only has
+# Get/Create/Update/Delete on specific resources, scoped to its
+# operational needs). The janitor needs ListSecrets across the
+# `molecule/tenant/*` prefix, which warrants a separate principal so
+# we don't broaden the prod-CP policy.
+#
+# Safety: the script's MAX_DELETE_PCT gate (default 50%, mirroring
+# sweep-cf-orphans.yml — tenant secrets are durable by design, unlike
+# the mostly-orphan tunnels) refuses to nuke past the threshold.
+
+on:
+  schedule:
+    # Hourly at :30 — offsets from sweep-cf-orphans (:15) and
+    # sweep-cf-tunnels (:45) so the three janitors don't burst the
+    # CP admin endpoints at the same minute.
+    - cron: '30 * * * *'
+  workflow_dispatch:
+    inputs:
+      dry_run:
+        description: "Dry run only — list what would be deleted, no deletion"
+        required: false
+        type: boolean
+        default: true
+      max_delete_pct:
+        description: "Override safety gate (default 50, set higher only for major cleanup)"
+        required: false
+        default: "50"
+      grace_hours:
+        description: "Skip secrets created within this many hours (default 24)"
+        required: false
+        default: "24"
+
+# Don't let two sweeps race the same AWS account.
+concurrency:
+  group: sweep-aws-secrets
+  cancel-in-progress: false
+
+permissions:
+  contents: read
+
+jobs:
+  sweep:
+    name: Sweep AWS Secrets Manager
+    runs-on: ubuntu-latest
+    # 30 min cap, mirroring the other janitors. AWS DeleteSecret is
+    # fast (~0.3s/call) so even a 100+ backlog drains in seconds
+    # under the 8-way xargs parallelism, but the cap is set generously
+    # to leave headroom for any actual API hang.
+    timeout-minutes: 30
+    env:
+      AWS_REGION: ${{ secrets.AWS_REGION || 'us-east-1' }}
+      AWS_ACCESS_KEY_ID: ${{ secrets.AWS_JANITOR_ACCESS_KEY_ID }}
+      AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_JANITOR_SECRET_ACCESS_KEY }}
+      CP_PROD_ADMIN_TOKEN: ${{ secrets.CP_PROD_ADMIN_TOKEN }}
+      CP_STAGING_ADMIN_TOKEN: ${{ secrets.CP_STAGING_ADMIN_TOKEN }}
+      MAX_DELETE_PCT: ${{ github.event.inputs.max_delete_pct || '50' }}
+      GRACE_HOURS: ${{ github.event.inputs.grace_hours || '24' }}
+
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Verify required secrets present
+        id: verify
+        # Schedule-vs-dispatch behaviour split mirrors sweep-cf-orphans
+        # and sweep-cf-tunnels (hardened 2026-04-28). Same principle:
+        #   - schedule → exit 1 on missing secrets (red CI surfaces it)
+        #   - workflow_dispatch → exit 0 with warning (operator-driven,
+        #     they already accepted the repo state)
+        run: |
+          missing=()
+          for var in AWS_ACCESS_KEY_ID AWS_SECRET_ACCESS_KEY CP_PROD_ADMIN_TOKEN CP_STAGING_ADMIN_TOKEN; do
+            if [ -z "${!var:-}" ]; then
+              missing+=("$var")
+            fi
+          done
+          if [ ${#missing[@]} -gt 0 ]; then
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::skipping sweep — secrets not configured: ${missing[*]}"
+              echo "::warning::set them at Settings → Secrets and Variables → Actions, then rerun."
+              echo "::warning::AWS_JANITOR_* must belong to a principal with secretsmanager:ListSecrets and secretsmanager:DeleteSecret on molecule/tenant/* (the prod molecule-cp principal lacks ListSecrets)."
+              echo "skip=true" >> "$GITHUB_OUTPUT"
+              exit 0
+            fi
+            echo "::error::sweep cannot run — required secrets missing: ${missing[*]}"
+            echo "::error::set them at Settings → Secrets and Variables → Actions, or disable this workflow."
+            echo "::error::AWS_JANITOR_* must belong to a principal with secretsmanager:ListSecrets and secretsmanager:DeleteSecret on molecule/tenant/*."
+            exit 1
+          fi
+          echo "All required secrets present ✓"
+          echo "skip=false" >> "$GITHUB_OUTPUT"
+
+      - name: Run sweep
+        if: steps.verify.outputs.skip != 'true'
+        # Schedule-vs-dispatch dry-run asymmetry mirrors sweep-cf-tunnels:
+        #   - Scheduled: input empty → "false" → --execute (the whole
+        #     point of an hourly janitor).
+        #   - Manual workflow_dispatch: input default true → dry-run;
+        #     operator must flip it to actually delete.
+        run: |
+          set -euo pipefail
+          if [ "${{ github.event.inputs.dry_run || 'false' }}" = "true" ]; then
+            echo "Running in dry-run mode — no deletions"
+            bash scripts/ops/sweep-aws-secrets.sh
+          else
+            echo "Running with --execute — will delete identified orphans"
+            bash scripts/ops/sweep-aws-secrets.sh --execute
+          fi

.github/workflows/sweep-cf-orphans.yml

@@ -78,15 +78,30 @@ jobs:
       MAX_DELETE_PCT: ${{ github.event.inputs.max_delete_pct || '50' }}
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Verify required secrets present
         id: verify
-        # Soft skip when secrets aren't configured. The 6 secrets have
-        # to be set on the repo manually before this workflow can do
-        # real work; until they are, the schedule is a no-op rather
-        # than a recurring red CI run. workflow_dispatch surfaces a
-        # warning so an operator running it ad-hoc sees the gap.
+        # Schedule-vs-dispatch behaviour split (hardened 2026-04-28
+        # after the silent-no-op incident below):
+        #
+        # The earlier soft-skip-on-schedule policy hid a real leak. All
+        # six secrets were unset on this repo for an unknown duration;
+        # every hourly run printed a yellow ::warning:: and exited 0,
+        # so the workflow registered as "passing" while doing nothing.
+        # CF orphans accumulated to 152/200 (~76% of the zone quota
+        # gone) before a manual `dig`-driven audit caught it. Anything
+        # that runs as a janitor and reports green while idle is
+        # indistinguishable from "the janitor is healthy" — so we now
+        # treat schedule (and any future workflow_run/push triggers)
+        # as a hard-fail when secrets are missing.
+        #
+        #   - schedule / workflow_run / push → exit 1 (red CI run
+        #     surfaces the misconfiguration the next tick)
+        #   - workflow_dispatch              → exit 0 with a warning
+        #     (an operator ran this ad-hoc; they already accepted the
+        #     state of the repo and want the workflow to short-circuit
+        #     so they can rerun after fixing the secret)
         run: |
           missing=()
           for var in CF_API_TOKEN CF_ZONE_ID CP_PROD_ADMIN_TOKEN CP_STAGING_ADMIN_TOKEN AWS_ACCESS_KEY_ID AWS_SECRET_ACCESS_KEY; do
@@ -95,9 +110,16 @@ jobs:
             fi
           done
           if [ ${#missing[@]} -gt 0 ]; then
-            echo "::warning::skipping sweep — secrets not yet configured: ${missing[*]}"
-            echo "skip=true" >> "$GITHUB_OUTPUT"
-            exit 0
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::skipping sweep — secrets not configured: ${missing[*]}"
+              echo "::warning::set them at Settings → Secrets and Variables → Actions, then rerun."
+              echo "skip=true" >> "$GITHUB_OUTPUT"
+              exit 0
+            fi
+            echo "::error::sweep cannot run — required secrets missing: ${missing[*]}"
+            echo "::error::set them at Settings → Secrets and Variables → Actions, or disable this workflow."
+            echo "::error::a silent skip masked an active CF DNS leak (152/200 zone records) caught only by a manual audit on 2026-04-28; this gate exists to make the gap visible."
+            exit 1
           fi
           echo "All required secrets present ✓"
           echo "skip=false" >> "$GITHUB_OUTPUT"

.github/workflows/sweep-cf-tunnels.yml

@@ -0,0 +1,124 @@
+name: Sweep stale Cloudflare Tunnels
+
+# Janitor for Cloudflare Tunnels whose backing tenant no longer
+# exists. Parallel-shape to sweep-cf-orphans.yml (which sweeps DNS
+# records); same justification, different CF resource.
+#
+# Why this exists separately from sweep-cf-orphans:
+#   - DNS records live on the zone (`/zones/<id>/dns_records`).
+#   - Tunnels live on the account (`/accounts/<id>/cfd_tunnel`).
+#   - Different CF API surface, different scopes; the existing CF
+#     token might not have `account:cloudflare_tunnel:edit`. Splitting
+#     the workflows keeps each one's secret-presence gate independent
+#     so neither silent-skips when the other's secret is missing.
+#   - Cleaner blast radius — operators can disable one without the
+#     other if a regression surfaces.
+#
+# Safety: the script's MAX_DELETE_PCT gate (default 90% — higher than
+# the DNS sweep's 50% because tenant-shaped tunnels are mostly
+# orphans by design) refuses to nuke past the threshold.
+
+on:
+  schedule:
+    # Hourly at :45 — offset from sweep-cf-orphans (:15) so the two
+    # janitors don't issue parallel CF API bursts at the same minute.
+    - cron: '45 * * * *'
+  workflow_dispatch:
+    inputs:
+      dry_run:
+        description: "Dry run only — list what would be deleted, no deletion"
+        required: false
+        type: boolean
+        default: true
+      max_delete_pct:
+        description: "Override safety gate (default 90, set higher only for major cleanup)"
+        required: false
+        default: "90"
+
+# Don't let two sweeps race the same account.
+concurrency:
+  group: sweep-cf-tunnels
+  cancel-in-progress: false
+
+permissions:
+  contents: read
+
+jobs:
+  sweep:
+    name: Sweep CF tunnels
+    runs-on: ubuntu-latest
+    # 30 min cap. Was 5 min on the theory that the only thing that
+    # could take >5min is a CF-API hang — but on 2026-05-02 a backlog
+    # of 672 stale tunnels accumulated (large staging E2E run + delayed
+    # sweep) and the serial `curl -X DELETE` loop (~0.7s/tunnel) needed
+    # ~7-8min to drain. The 5-min cap killed the run mid-sweep
+    # (cancelled at 424/672, see run 25248788312); a manual rerun
+    # finished the remainder fine.
+    #
+    # The fix is two-part: parallelize the delete loop (8-way xargs in
+    # the script — see scripts/ops/sweep-cf-tunnels.sh), AND raise the
+    # cap so a one-off backlog doesn't trip a hangs-detector that
+    # turned out to be a real-job-too-slow detector. With 8-way
+    # parallelism, 600+ tunnels drains in ~60s; 30 min is generous
+    # headroom for actual hangs to still surface (and is in line with
+    # the sweep-cf-orphans companion job).
+    timeout-minutes: 30
+    env:
+      CF_API_TOKEN: ${{ secrets.CF_API_TOKEN }}
+      CF_ACCOUNT_ID: ${{ secrets.CF_ACCOUNT_ID }}
+      CP_PROD_ADMIN_TOKEN: ${{ secrets.CP_PROD_ADMIN_TOKEN }}
+      CP_STAGING_ADMIN_TOKEN: ${{ secrets.CP_STAGING_ADMIN_TOKEN }}
+      MAX_DELETE_PCT: ${{ github.event.inputs.max_delete_pct || '90' }}
+
+    steps:
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Verify required secrets present
+        id: verify
+        # Schedule-vs-dispatch behaviour split mirrors sweep-cf-orphans
+        # (hardened 2026-04-28 after the silent-no-op incident: the
+        # janitor reported green while doing nothing because secrets
+        # were unset, masking a 152/200 zone-record leak). Same
+        # principle applies here:
+        #   - schedule → exit 1 on missing secrets (red CI surfaces it)
+        #   - workflow_dispatch → exit 0 with warning (operator-driven,
+        #     they already accepted the repo state)
+        run: |
+          missing=()
+          for var in CF_API_TOKEN CF_ACCOUNT_ID CP_PROD_ADMIN_TOKEN CP_STAGING_ADMIN_TOKEN; do
+            if [ -z "${!var:-}" ]; then
+              missing+=("$var")
+            fi
+          done
+          if [ ${#missing[@]} -gt 0 ]; then
+            if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+              echo "::warning::skipping sweep — secrets not configured: ${missing[*]}"
+              echo "::warning::set them at Settings → Secrets and Variables → Actions, then rerun."
+              echo "::warning::CF_API_TOKEN must include account:cloudflare_tunnel:edit scope (separate from the zone:dns:edit scope used by sweep-cf-orphans)."
+              echo "skip=true" >> "$GITHUB_OUTPUT"
+              exit 0
+            fi
+            echo "::error::sweep cannot run — required secrets missing: ${missing[*]}"
+            echo "::error::set them at Settings → Secrets and Variables → Actions, or disable this workflow."
+            echo "::error::CF_API_TOKEN must include account:cloudflare_tunnel:edit scope."
+            exit 1
+          fi
+          echo "All required secrets present ✓"
+          echo "skip=false" >> "$GITHUB_OUTPUT"
+
+      - name: Run sweep
+        if: steps.verify.outputs.skip != 'true'
+        # Schedule-vs-dispatch dry-run asymmetry mirrors sweep-cf-orphans:
+        #   - Scheduled: input empty → "false" → --execute (the whole
+        #     point of an hourly janitor).
+        #   - Manual workflow_dispatch: input default true → dry-run;
+        #     operator must flip it to actually delete.
+        run: |
+          set -euo pipefail
+          if [ "${{ github.event.inputs.dry_run || 'false' }}" = "true" ]; then
+            echo "Running in dry-run mode — no deletions"
+            bash scripts/ops/sweep-cf-tunnels.sh
+          else
+            echo "Running with --execute — will delete identified orphans"
+            bash scripts/ops/sweep-cf-tunnels.sh --execute
+          fi

.github/workflows/sweep-stale-e2e-orgs.yml

@@ -87,20 +87,28 @@ jobs:
             > orgs.json
 
           # Filter:
-          #   1. slug starts with 'e2e-' (covers e2e-, e2e-canary-,
-          #      e2e-canvas-* — all variants the test scripts mint)
+          #   1. slug starts with one of the ephemeral test prefixes:
+          #        - 'e2e-'    — covers e2e-canary-, e2e-canvas-*, etc.
+          #        - 'rt-e2e-' — runtime-test harness fixtures (RFC #2251);
+          #                      missing this prefix left two such tenants
+          #                      orphaned 8h on staging (2026-05-03), then
+          #                      hard-failed redeploy-tenants-on-staging
+          #                      and broke the staging→main auto-promote
+          #                      chain. Kept in sync with the EPHEMERAL_PREFIX_RE
+          #                      regex in redeploy-tenants-on-staging.yml.
           #   2. created_at is older than MAX_AGE_MINUTES ago
           # Output one slug per line to a file the next step reads.
           python3 > stale_slugs.txt <<'PY'
           import json, os
           from datetime import datetime, timezone, timedelta
+          EPHEMERAL_PREFIXES = ("e2e-", "rt-e2e-")
           with open("orgs.json") as f:
               data = json.load(f)
           max_age = int(os.environ["MAX_AGE_MINUTES"])
           cutoff = datetime.now(timezone.utc) - timedelta(minutes=max_age)
           for o in data.get("orgs", []):
               slug = o.get("slug", "")
-              if not slug.startswith("e2e-"):
+              if not slug.startswith(EPHEMERAL_PREFIXES):
                   continue
               created = o.get("created_at")
               if not created:

.github/workflows/test-ops-scripts.yml

@@ -1,19 +1,27 @@
 name: Ops Scripts Tests
 
-# Runs the unittest suite for scripts/ops/ on every PR + push that touches
-# the directory. Kept separate from the main CI so a script-only change
-# doesn't trigger the heavier Go/Canvas/Python pipelines.
+# Runs the unittest suite for scripts/ on every PR + push that touches
+# anything under scripts/. Kept separate from the main CI so a script-only
+# change doesn't trigger the heavier Go/Canvas/Python pipelines.
+#
+# Discovery layout: tests sit alongside the code they test (see
+# scripts/ops/test_sweep_cf_decide.py for the pattern; scripts/
+# test_build_runtime_package.py for the rewriter coverage). The job
+# below runs `unittest discover` TWICE — once from `scripts/`, once
+# from `scripts/ops/` — because neither dir has an `__init__.py`, so
+# a single discover from `scripts/` doesn't recurse into the ops
+# subdir. Two passes is simpler than retrofitting namespace packages.
 
 on:
   push:
     branches: [main, staging]
     paths:
-      - 'scripts/ops/**'
+      - 'scripts/**'
       - '.github/workflows/test-ops-scripts.yml'
   pull_request:
     branches: [main, staging]
     paths:
-      - 'scripts/ops/**'
+      - 'scripts/**'
       - '.github/workflows/test-ops-scripts.yml'
   merge_group:
     types: [checks_requested]
@@ -27,10 +35,18 @@ jobs:
     name: Ops scripts (unittest)
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-python@v5
+      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+      - uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: '3.11'
-      - name: Run unittest
+      - name: Run scripts/ unittests (build_runtime_package, …)
+        # Top-level scripts/ tests live alongside their target file
+        # (e.g. scripts/test_build_runtime_package.py exercises
+        # scripts/build_runtime_package.py). discover from scripts/
+        # picks up only top-level test_*.py because scripts/ops/ has
+        # no __init__.py — that's intentional, so we run two passes.
+        working-directory: scripts
+        run: python -m unittest discover -t . -p 'test_*.py' -v
+      - name: Run scripts/ops/ unittests (sweep_cf_decide, …)
         working-directory: scripts/ops
         run: python -m unittest discover -p 'test_*.py' -v

.gitignore

@@ -146,3 +146,4 @@ backups/
 *-temp.txt
 /test-pmm-*.txt
 /tick-reflections-*.md
+tests/harness/cp-stub/cp-stub

CONTRIBUTING.md

@@ -53,6 +53,29 @@ cp .env.example .env
 
 See `CLAUDE.md` for a full list of environment variables and their purposes.
 
+## What goes where (content vs code)
+
+This repo is scoped to **code** (canvas, workspace, workspace-server, related
+infra). Public content (blog posts, marketing copy, OG images, SEO briefs,
+DevRel demos) lives in [`Molecule-AI/docs`](https://github.com/Molecule-AI/docs).
+The `Block forbidden paths` CI gate fails any PR that writes to `marketing/`
+or other removed paths — open against `Molecule-AI/docs` instead.
+
+| Content type | Target |
+|---|---|
+| Blog posts | `Molecule-AI/docs` → `content/blog/<YYYY-MM-DD-slug>/` |
+| Doc pages | `Molecule-AI/docs` → `content/docs/` |
+| Marketing copy / PMM positioning | `Molecule-AI/docs` → `marketing/` |
+| OG images, visual assets | `Molecule-AI/docs` → `app/` or `marketing/` |
+| SEO briefs | `Molecule-AI/docs` → `marketing/` |
+| DevRel demos (runnable code) | Standalone repo under `Molecule-AI/`, OR embedded in `Molecule-AI/docs` |
+| Launch checklists, internal tracking | GitHub Issues — **not** committed files |
+| Engineering docs (`docs/adr/`, `docs/architecture/`, `docs/incidents/`) | This repo (internal, not published) |
+| Live product pages (e.g. `canvas/src/app/pricing/page.tsx`) | This repo (these are app code, not marketing copy) |
+
+If a PR fails the `Block forbidden paths` check, the contents belong in
+`Molecule-AI/docs`. No CI drag, no Canvas E2E, content lands in minutes.
+
 ## Development Workflow
 
 ### Branch Naming
@@ -152,6 +175,17 @@ and run CI manually.
 - Type hints on public functions
 - pytest for all tests
 
+## External integrations
+
+Code in this repo lands in molecule-core. Some related runtime artifacts
+live in their own repos:
+
+- [`Molecule-AI/molecule-ai-workspace-runtime`](https://github.com/Molecule-AI/molecule-ai-workspace-runtime) — Python adapter SDK (`molecule_runtime`) that runs inside containerized Molecule workspaces. Bridges Claude Code SDK / hermes / langgraph / etc. → A2A queue.
+- [`Molecule-AI/molecule-sdk-python`](https://github.com/Molecule-AI/molecule-sdk-python) — `A2AServer` + `RemoteAgentClient` for external agents that register over the public `/registry/register` flow.
+- [`Molecule-AI/molecule-mcp-claude-channel`](https://github.com/Molecule-AI/molecule-mcp-claude-channel) — Claude Code channel plugin. Bridges A2A traffic into a running Claude Code session via MCP `notifications/claude/channel`. Polling-based (no tunnel required); install with `claude --channels plugin:molecule@Molecule-AI/molecule-mcp-claude-channel`.
+
+When extending the **A2A surface** in molecule-core (`workspace-server/internal/handlers/a2a_proxy.go` etc.), consider whether the change has a downstream impact on the runtime SDK or the channel plugin — they're versioned independently but share the wire shape.
+
 ## Architecture Overview
 
 See `CLAUDE.md` for detailed architecture documentation, including:

README.md

@@ -39,8 +39,8 @@
   <a href="./docs/agent-runtime/workspace-runtime.md"><strong>Workspace Runtime</strong></a>
 </p>
 
-[![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template?template=https://github.com/Molecule-AI/molecule-core)
-[![Deploy to Render](https://render.com/images/deploy-to-render-button.svg)](https://render.com/deploy?repo=https://github.com/Molecule-AI/molecule-core)
+[![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template?template=https://github.com/Molecule-AI/molecule-monorepo)
+[![Deploy to Render](https://render.com/images/deploy-to-render-button.svg)](https://render.com/deploy?repo=https://github.com/Molecule-AI/molecule-monorepo)
 
 </div>
 
@@ -249,8 +249,8 @@ Workspace Runtime (Python image with adapters)
 ## Quick Start
 
 ```bash
-git clone https://github.com/Molecule-AI/molecule-core.git
-cd molecule-core
+git clone https://github.com/Molecule-AI/molecule-monorepo.git
+cd molecule-monorepo
 
 cp .env.example .env
 # Defaults boot the stack locally out of the box. See .env.example for

canvas/components.json

@@ -4,10 +4,9 @@
   "rsc": true,
   "tsx": true,
   "tailwind": {
-    "config": "tailwind.config.ts",
     "css": "src/app/globals.css",
-    "baseColor": "zinc",
-    "cssVariables": false
+    "baseColor": "neutral",
+    "cssVariables": true
   },
   "aliases": {
     "components": "@/components",

canvas/e2e/staging-setup.ts

@@ -111,6 +111,20 @@ export default async function globalSetup(_config: FullConfig): Promise<void> {
   const adminAuth = { Authorization: `Bearer ${ADMIN_TOKEN}` };
   console.log(`[staging-setup] Using slug=${slug}`);
 
+  // Write the state file FIRST, before any CP call. Teardown (both
+  // Playwright globalTeardown and the workflow safety-net) reads this
+  // file to identify the slug it must clean up. If we wait until the
+  // end of setup to write it (the previous behavior), a crash during
+  // any of steps 1-6 leaves the org orphaned in CP with no record on
+  // disk — forcing the workflow safety-net into a pattern-sweep over
+  // every `e2e-canvas-<date>-*` org, which races with concurrent
+  // canvas-E2E runs and deletes their live tenants. Race observed
+  // 2026-04-30 on PR #2264 staging→main: three real-test runs killed
+  // each other's tenants mid-test, surfacing as `getaddrinfo ENOTFOUND`
+  // when CP cleaned up the just-deleted DNS record.
+  const stateFile = join(process.cwd(), ".playwright-staging-state.json");
+  writeFileSync(stateFile, JSON.stringify({ slug }, null, 2));
+
   // 1. Create org via admin endpoint — no WorkOS session needed
   const create = await jsonFetch(`${CP_URL}/cp/admin/orgs`, {
     method: "POST",
@@ -245,8 +259,8 @@ export default async function globalSetup(_config: FullConfig): Promise<void> {
   );
   console.log(`[staging-setup] Workspace online`);
 
-  // 7. Hand state off to tests + teardown
-  const stateFile = join(process.cwd(), ".playwright-staging-state.json");
+  // 7. Hand state off to tests + teardown — overwrite the slug-only
+  // bootstrap state with the full state spec tests need.
   writeFileSync(
     stateFile,
     JSON.stringify({ slug, tenantURL, workspaceId, tenantToken }, null, 2),

canvas/e2e/staging-teardown.ts

@@ -24,7 +24,11 @@ export default async function globalTeardown(): Promise<void> {
 
   const stateFile = join(process.cwd(), ".playwright-staging-state.json");
   if (!existsSync(stateFile)) {
-    console.warn("[staging-teardown] no state file — setup must have failed before org create; nothing to tear down");
+    // staging-setup writes this file as its first action, before any
+    // CP call. Missing here means setup never ran (CANVAS_E2E_STAGING
+    // unset, or ran in a different cwd) — there's no slug we created
+    // that needs cleaning up.
+    console.warn("[staging-teardown] no state file — nothing to tear down");
     return;
   }
 

canvas/package.json

@@ -32,15 +32,15 @@
     "@playwright/test": "^1.59.1",
     "@testing-library/jest-dom": "^6.6.0",
     "@testing-library/react": "^16.1.0",
-    "@types/node": "^22.0.0",
+    "@types/node": "^25.6.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@vitejs/plugin-react": "^6.0.1",
     "@vitest/coverage-v8": "^4.1.5",
-    "autoprefixer": "^10.4.0",
-    "jsdom": "^25.0.0",
-    "postcss": "^8.5.12",
-    "tailwindcss": "^3.4.0",
+    "@tailwindcss/postcss": "^4.0.0",
+    "jsdom": "^29.1.1",
+    "postcss": "^8.5.13",
+    "tailwindcss": "^4.0.0",
     "typescript": "^5.7.0",
     "vitest": "^4.1.2"
   }

canvas/postcss.config.js

@@ -1,6 +1,5 @@
 module.exports = {
   plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
+    "@tailwindcss/postcss": {},
   },
 };

canvas/src/app/api/buildinfo/__tests__/route.test.ts

@@ -0,0 +1,48 @@
+/**
+ * Canvas /api/buildinfo — version-display endpoint mirroring
+ * workspace-server's /buildinfo. Lets `curl <url>/api/buildinfo`
+ * confirm which git SHA is live on a canvas deployment.
+ */
+import { describe, it, expect, beforeEach, afterEach } from "vitest";
+import { GET } from "../route";
+
+const ENV_KEYS = ["VERCEL_GIT_COMMIT_SHA", "VERCEL_GIT_COMMIT_REF", "VERCEL_ENV"];
+
+describe("GET /api/buildinfo", () => {
+  let saved: Record<string, string | undefined>;
+
+  beforeEach(() => {
+    saved = Object.fromEntries(ENV_KEYS.map((k) => [k, process.env[k]]));
+    for (const k of ENV_KEYS) delete process.env[k];
+  });
+
+  afterEach(() => {
+    for (const k of ENV_KEYS) {
+      if (saved[k] === undefined) delete process.env[k];
+      else process.env[k] = saved[k];
+    }
+  });
+
+  it("returns dev sentinel when Vercel env vars are unset", async () => {
+    const res = await GET();
+    const body = await res.json();
+    expect(body).toEqual({ git_sha: "dev", git_ref: "", vercel_env: "local" });
+  });
+
+  it("reports the SHA Vercel injected at build time", async () => {
+    process.env.VERCEL_GIT_COMMIT_SHA = "abc1234567890";
+    process.env.VERCEL_GIT_COMMIT_REF = "main";
+    process.env.VERCEL_ENV = "production";
+    const res = await GET();
+    const body = await res.json();
+    expect(body.git_sha).toBe("abc1234567890");
+    expect(body.git_ref).toBe("main");
+    expect(body.vercel_env).toBe("production");
+  });
+
+  it("returns 200 status and JSON content type", async () => {
+    const res = await GET();
+    expect(res.status).toBe(200);
+    expect(res.headers.get("content-type")).toContain("application/json");
+  });
+});

canvas/src/app/api/buildinfo/route.ts

@@ -0,0 +1,18 @@
+import { NextResponse } from "next/server";
+
+// Mirror of workspace-server's GET /buildinfo (PR #2398). Lets a developer
+// confirm which git SHA is live on a canvas deployment with the same
+// `curl <url>/buildinfo` flow they use against tenant workspaces.
+//
+// Vercel injects VERCEL_GIT_COMMIT_SHA / _REF / VERCEL_ENV at build time
+// from the deploying commit; outside Vercel (local `next dev`, harness)
+// these are unset and the endpoint reports `git_sha: "dev"`. Same sentinel
+// the workspace-server uses pre-ldflags-injection so both surfaces speak
+// the same vocabulary.
+export async function GET() {
+  return NextResponse.json({
+    git_sha: process.env.VERCEL_GIT_COMMIT_SHA ?? "dev",
+    git_ref: process.env.VERCEL_GIT_COMMIT_REF ?? "",
+    vercel_env: process.env.VERCEL_ENV ?? "local",
+  });
+}

canvas/src/app/globals.css

@@ -1,28 +1,130 @@
+@import "tailwindcss";
+@plugin "@tailwindcss/typography";
+
+/*
+ * Load order:
+ *   1. Tailwind core (v4) — provides preflight + utility generation.
+ *   2. xterm — overrides preflight on its own .xterm-* class names; must
+ *      load AFTER tailwind so its specificity wins.
+ *   3. theme-tokens.css — canvas-only motion + deploy animation vars
+ *      (--mol-duration-*, --mol-easing-*, --mol-deploy-*). NOT colour
+ *      tokens; the warm-paper @theme block below owns those.
+ *   4. settings-panel.css / org-deploy.css — feature stylesheets that
+ *      reference the variables above.
+ */
 @import "xterm/css/xterm.css";
-/* Theme tokens MUST load before any feature stylesheet that
-   references them so custom properties are in scope. */
 @import "../styles/theme-tokens.css";
 @import "../styles/settings-panel.css";
 @import "../styles/org-deploy.css";
 
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+/*
+ * Warm-paper semantic tokens — light defaults via @theme, dark
+ * overrides via [data-theme="dark"]. Names are role-based
+ * (`bg-surface`, `text-ink`, `border-line`) not colour-based, so the
+ * same component classes work in either mode.
+ *
+ * Source of truth: molecule-app/app/globals.css. Keep aligned across
+ * surfaces (landing, market, app, canvas) so a token tweak ripples
+ * everywhere via a single PR per repo.
+ *
+ * Theme preference is persisted in the `mol_theme` cookie scoped to
+ * Domain=.moleculesai.app so the choice follows the user across
+ * subdomains. The inline boot script in app/layout.tsx applies it
+ * before paint to eliminate flash.
+ */
+@theme {
+  /* Surface — page / elevated card / sunken input / deep card */
+  --color-surface: #fafaf7;
+  --color-surface-elevated: #ffffff;
+  --color-surface-sunken: #f3f1ec;
+  --color-surface-card: #efece4;
+
+  /* Borders */
+  --color-line: #e6e2d8;
+  --color-line-soft: #efece4;
+
+  /* Text */
+  --color-ink: #15181c;
+  --color-ink-mid: #5a5e66;
+  --color-ink-soft: #8b8e95;
+
+  /* Brand + state */
+  --color-accent: #3b5bdb;
+  --color-accent-strong: #1a2f99;
+  --color-warm: #c0532b;
+  --color-good: #2f7a4d;
+  --color-bad: #b94e4a;
+}
+
+[data-theme="dark"] {
+  --color-surface: #0e1014;
+  --color-surface-elevated: #15181c;
+  --color-surface-sunken: #0a0b0e;
+  --color-surface-card: #1a1d23;
+
+  --color-line: #2a2f3a;
+  --color-line-soft: #1f2329;
+
+  --color-ink: #f4f1e9;
+  --color-ink-mid: #c8c2b4;
+  --color-ink-soft: #8d92a0;
+
+  /* Accents brighten slightly for AA contrast on dark backgrounds. */
+  --color-accent: #6883e8;
+  --color-accent-strong: #8aa1ee;
+  --color-warm: #d96f48;
+  --color-good: #4ca06e;
+  --color-bad: #d27773;
+}
+
+:root {
+  color-scheme: light;
+}
+[data-theme="dark"] {
+  color-scheme: dark;
+}
+
+/*
+ * Always-dark surface tokens. Terminals (xterm), the console modal,
+ * and log streams stay dark in both modes — readable green-on-black
+ * code surfaces don't translate cleanly to a light theme. Components
+ * that should not light-flip use `bg-bg`, `bg-bg-elev`, `bg-bg-card`,
+ * `text-ink-mute`, `text-ink-dim`, `border-line-strong` instead of
+ * the warm-paper utilities above.
+ *
+ * Distinct names (bg-* / ink-mute / ink-dim / line-strong) so they
+ * don't collide with the warm-paper namespace (surface / ink /
+ * line). Both palettes coexist; the choice between them is per
+ * component, not per theme.
+ */
+@theme {
+  --color-bg: rgb(9 9 11);            /* zinc-950 */
+  --color-bg-elev: rgb(24 24 27);     /* zinc-900 */
+  --color-bg-card: rgb(39 39 42);     /* zinc-800 */
+  --color-line-strong: rgb(63 63 70); /* zinc-700 */
+  --color-ink-mute: rgb(161 161 170); /* zinc-400 */
+  --color-ink-dim: rgb(113 113 122);  /* zinc-500 */
+  --color-accent-dim: rgb(96 165 250);/* blue-400 */
+  --color-plasma: rgb(59 130 246);    /* blue-500 */
+  --color-warn: rgb(251 191 36);      /* amber-400 */
+}
 
 body {
   margin: 0;
   padding: 0;
   overflow: hidden;
-  background: #09090b;
-  color: #e4e4e7;
+  background-color: var(--color-surface);
+  color: var(--color-ink);
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
-/* React Flow overrides for dark theme */
+/* React Flow overrides for both themes. Edge stroke pulls from the
+   semantic line token so dark mode keeps its existing zinc-700 look
+   and light mode picks up the warm-paper line colour. */
 .react-flow__edge-path {
-  stroke: #3f3f46 !important;
+  stroke: var(--color-line) !important;
   stroke-width: 1.5 !important;
 }
 
@@ -58,7 +160,8 @@ body {
   transition: box-shadow var(--mol-duration-fast) ease;
 }
 
-/* Scrollbar styling */
+/* Scrollbar styling. Track + thumb pull from the surface tokens so
+   they feel native to either theme. */
 ::-webkit-scrollbar {
   width: 6px;
   height: 6px;
@@ -69,17 +172,17 @@ body {
 }
 
 ::-webkit-scrollbar-thumb {
-  background: #3f3f46;
+  background: var(--color-line);
   border-radius: 3px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: #52525b;
+  background: var(--color-line-strong, var(--color-ink-soft));
 }
 
 /* Selection */
 ::selection {
-  background: rgba(59, 130, 246, 0.3);
+  background: color-mix(in srgb, var(--color-accent) 30%, transparent);
 }
 
 /* Panel slide animation */

canvas/src/app/layout.tsx

@@ -1,8 +1,14 @@
 import type { Metadata } from "next";
-import { headers } from "next/headers";
+import { cookies, headers } from "next/headers";
 import "./globals.css";
 import { AuthGate } from "@/components/AuthGate";
 import { CookieConsent } from "@/components/CookieConsent";
+import { ThemeProvider } from "@/lib/theme-provider";
+import {
+  THEME_COOKIE,
+  readThemeCookie,
+  themeBootScript,
+} from "@/lib/theme-cookie";
 
 export const metadata: Metadata = {
   title: "Molecule AI",
@@ -15,7 +21,7 @@ export default async function RootLayout({
   children: React.ReactNode;
 }) {
   // Read the per-request CSP nonce that middleware.ts sets via the
-  // `x-nonce` request header. This call is load-bearing for TWO
+  // `x-nonce` request header. This call is load-bearing for THREE
   // independent reasons:
   //
   //   1. It opts the root layout into dynamic rendering. Without a
@@ -31,22 +37,56 @@ export default async function RootLayout({
   //      is actually read via `headers()`. The header's existence on
   //      the request isn't enough — Next.js watches for the read.
   //
-  // Keeping the `nonce` variable unused is intentional: we don't need
-  // to pass it to any custom <Script nonce={...}> tags right now, the
-  // framework takes care of its own bootstrap scripts once the read
-  // happens. Destructuring via `await` + `.get()` is the minimum shape
-  // Next.js recognizes as "dynamic server-side access".
-  await headers();
+  //   3. We need the nonce to attach to the inline theme boot script
+  //      below, otherwise CSP rejects it in production where
+  //      script-src is `'self' 'nonce-{nonce}' 'strict-dynamic'`.
+  //      'strict-dynamic' propagates trust from a nonce'd script to
+  //      scripts it inserts, but does NOT forgive an un-nonce'd
+  //      sibling — the boot script must carry its own nonce.
+  const hdrs = await headers();
+  const nonce = hdrs.get("x-nonce") ?? undefined;
+
+  // SSR: read the user's saved preference. For light/dark we can stamp
+  // data-theme on <html> here so the very first paint matches; for
+  // "system" we leave the attribute off and let the inline boot script
+  // resolve from matchMedia before paint.
+  const cookieStore = await cookies();
+  const theme = readThemeCookie(cookieStore.get(THEME_COOKIE)?.value);
+  const initialDataTheme = theme === "system" ? undefined : theme;
 
   return (
-    <html lang="en">
-      <body className="bg-zinc-950 text-white">
-        {/* AuthGate is a client component; it checks the session on mount
-            and bounces anonymous users to the control plane's login page
-            when running on a tenant subdomain. Non-SaaS hosts (localhost,
-            vercel preview URL, apex) pass through unchanged. */}
-        <AuthGate>{children}</AuthGate>
-        <CookieConsent />
+    // suppressHydrationWarning on <html>: the inline boot script below
+    // mutates `data-theme` before React hydrates (system mode reads
+    // matchMedia + writes the attribute). That's the entire point of the
+    // script — eliminate the flash — and it's the documented escape hatch
+    // for "the server-rendered HTML is intentionally not what React would
+    // produce client-side at this exact attribute."
+    <html lang="en" data-theme={initialDataTheme} suppressHydrationWarning>
+      <head>
+        {/*
+         * Boot script: runs synchronously before the body paints, sets
+         * data-theme on <html> for "system" preference based on the OS
+         * media query. For explicit light/dark, SSR already set the
+         * attribute above and the script's write is a no-op.
+         *
+         * `nonce` comes from middleware's per-request CSP nonce — see
+         * the comment block above for why CSP requires this even though
+         * the page also has 'strict-dynamic'.
+         */}
+        <script
+          nonce={nonce}
+          dangerouslySetInnerHTML={{ __html: themeBootScript }}
+        />
+      </head>
+      <body className="bg-surface text-ink">
+        <ThemeProvider initialTheme={theme}>
+          {/* AuthGate is a client component; it checks the session on mount
+              and bounces anonymous users to the control plane's login page
+              when running on a tenant subdomain. Non-SaaS hosts (localhost,
+              vercel preview URL, apex) pass through unchanged. */}
+          <AuthGate>{children}</AuthGate>
+          <CookieConsent />
+        </ThemeProvider>
       </body>
     </html>
   );

canvas/src/app/orgs/page.tsx

@@ -110,15 +110,15 @@ export default function OrgsPage() {
   }, []);
 
   if (session === "loading" || (orgs === null && error === null)) {
-    return <Shell><p className="text-zinc-400">Loading…</p></Shell>;
+    return <Shell><p className="text-ink-mid">Loading…</p></Shell>;
   }
   if (error) {
     return (
       <Shell>
-        <p role="alert" className="text-red-400">Error: {error}</p>
+        <p role="alert" className="text-bad">Error: {error}</p>
         <button
           onClick={() => window.location.reload()}
-          className="mt-4 rounded bg-zinc-800 px-4 py-2 text-sm text-zinc-200 hover:bg-zinc-700"
+          className="mt-4 rounded bg-surface-card px-4 py-2 text-sm text-ink hover:bg-surface-card"
         >
           Retry
         </button>
@@ -136,7 +136,7 @@ export default function OrgsPage() {
           <OrgRow key={o.id} org={o} />
         ))}
       </ul>
-      <div className="mt-8 border-t border-zinc-800 pt-6">
+      <div className="mt-8 border-t border-line pt-6">
         <CreateOrgForm
           onCreated={(slug) => {
             // Refresh the list so the new org appears + its CTA fires.
@@ -162,11 +162,11 @@ function CheckoutBanner() {
 
 function Shell({ children }: { children: React.ReactNode }) {
   return (
-    <main className="min-h-screen bg-zinc-950 text-zinc-100">
+    <main className="min-h-screen bg-surface text-ink">
       <TermsGate>
         <div className="mx-auto max-w-2xl px-6 pt-20 pb-12">
-          <h1 className="text-3xl font-bold text-white">Your organizations</h1>
-          <p className="mt-2 text-zinc-400">
+          <h1 className="text-3xl font-bold text-ink">Your organizations</h1>
+          <p className="mt-2 text-ink-mid">
             Each org is an isolated Molecule workspace.
           </p>
           <DataResidencyNotice />
@@ -184,7 +184,7 @@ function Shell({ children }: { children: React.ReactNode }) {
 // region dropdown.
 function DataResidencyNotice() {
   return (
-    <p className="mt-3 rounded border border-zinc-800 bg-zinc-900/60 px-3 py-2 text-xs text-zinc-400">
+    <p className="mt-3 rounded border border-line bg-surface-sunken/60 px-3 py-2 text-xs text-ink-mid">
       Workspaces run in AWS us-east-2 (Ohio, United States). EU region support is on the roadmap — reach out to
       {" "}
       <a href="mailto:support@moleculesai.app" className="underline">
@@ -197,11 +197,11 @@ function DataResidencyNotice() {
 
 function OrgRow({ org }: { org: Org }) {
   return (
-    <li className="rounded-lg border border-zinc-800 bg-zinc-900 p-4">
+    <li className="rounded-lg border border-line bg-surface-sunken p-4">
       <div className="flex items-center justify-between">
         <div>
-          <div className="font-medium text-white">{org.name}</div>
-          <div className="text-sm text-zinc-400">
+          <div className="font-medium text-ink">{org.name}</div>
+          <div className="text-sm text-ink-mid">
             {org.slug} · <StatusLabel status={org.status} /> · {org.plan || "free"}
           </div>
           <div className="mt-2 flex items-center gap-2">
@@ -237,21 +237,21 @@ function LowCreditsBanner({ org }: { org: Org }) {
   if (kind === "overage") {
     const used = (org.overage_used_credits ?? 0).toLocaleString();
     return (
-      <span className="text-xs text-amber-300">
+      <span className="text-xs text-warm">
         overage active · {used} used
       </span>
     );
   }
   if (kind === "out-of-credits") {
     return (
-      <a href={`/pricing?org=${encodeURIComponent(org.slug)}`} className="text-xs text-red-300 underline">
+      <a href={`/pricing?org=${encodeURIComponent(org.slug)}`} className="text-xs text-bad underline">
         out of credits — upgrade to keep running
       </a>
     );
   }
   // trial-tail
   return (
-    <a href={`/pricing?org=${encodeURIComponent(org.slug)}`} className="text-xs text-amber-300 underline">
+    <a href={`/pricing?org=${encodeURIComponent(org.slug)}`} className="text-xs text-warm underline">
       trial almost out
     </a>
   );
@@ -260,11 +260,11 @@ function LowCreditsBanner({ org }: { org: Org }) {
 function StatusLabel({ status }: { status: OrgStatus }) {
   const cls =
     status === "running"
-      ? "text-emerald-400"
+      ? "text-good"
       : status === "awaiting_payment"
-      ? "text-amber-400"
+      ? "text-warm"
       : status === "failed"
-      ? "text-red-400"
+      ? "text-bad"
       : "text-sky-400";
   const label =
     status === "awaiting_payment"
@@ -303,21 +303,21 @@ function OrgCTA({ org }: { org: Org }) {
     return (
       <a
         href="mailto:support@moleculesai.app"
-        className="rounded bg-zinc-700 px-4 py-2 text-sm font-medium text-zinc-200 hover:bg-zinc-600"
+        className="rounded bg-surface-card px-4 py-2 text-sm font-medium text-ink hover:bg-surface-card"
       >
         Contact support
       </a>
     );
   }
   // provisioning / unknown — non-interactive
-  return <span className="text-sm text-zinc-500">{org.status}…</span>;
+  return <span className="text-sm text-ink-soft">{org.status}…</span>;
 }
 
 function EmptyState({ banner }: { banner?: React.ReactNode }) {
   return (
     <Shell>
       {banner}
-      <p className="text-zinc-300">
+      <p className="text-ink-mid">
         You don't have any organizations yet. Create one to get started — your
         workspace spins up automatically once billing is set up.
       </p>
@@ -365,7 +365,7 @@ function CreateOrgForm({ onCreated }: { onCreated: (slug: string) => void }) {
   return (
     <form onSubmit={submit} className="space-y-3">
       <div>
-        <label htmlFor="org-slug" className="block text-sm text-zinc-300">Slug (URL)</label>
+        <label htmlFor="org-slug" className="block text-sm text-ink-mid">Slug (URL)</label>
         <input
           id="org-slug"
           value={slug}
@@ -374,28 +374,28 @@ function CreateOrgForm({ onCreated }: { onCreated: (slug: string) => void }) {
           placeholder="acme"
           required
           aria-describedby="org-slug-hint"
-          className="mt-1 w-full rounded border border-zinc-700 bg-zinc-800 px-3 py-2 text-sm text-zinc-100"
+          className="mt-1 w-full rounded border border-line bg-surface-card px-3 py-2 text-sm text-ink"
         />
-        <p id="org-slug-hint" className="mt-1 text-xs text-zinc-500">
+        <p id="org-slug-hint" className="mt-1 text-xs text-ink-soft">
           Lowercase letters, numbers, and hyphens only. Cannot be changed later.
         </p>
       </div>
       <div>
-        <label htmlFor="org-name" className="block text-sm text-zinc-300">Display name</label>
+        <label htmlFor="org-name" className="block text-sm text-ink-mid">Display name</label>
         <input
           id="org-name"
           value={name}
           onChange={(e) => setName(e.target.value)}
           placeholder="Acme Corp"
           required
-          className="mt-1 w-full rounded border border-zinc-700 bg-zinc-800 px-3 py-2 text-sm text-zinc-100"
+          className="mt-1 w-full rounded border border-line bg-surface-card px-3 py-2 text-sm text-ink"
         />
       </div>
-      {err && <p role="alert" className="text-sm text-red-400">{err}</p>}
+      {err && <p role="alert" className="text-sm text-bad">{err}</p>}
       <button
         type="submit"
         disabled={submitting}
-        className="rounded bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-500 disabled:opacity-50"
+        className="rounded bg-accent-strong px-4 py-2 text-sm font-medium text-white hover:bg-accent disabled:opacity-50"
       >
         {submitting ? "Creating…" : "Create organization"}
       </button>

canvas/src/app/page.tsx

@@ -53,10 +53,10 @@ export default function Home() {
 
   if (hydrating) {
     return (
-      <div className="fixed inset-0 flex items-center justify-center bg-zinc-950">
+      <div className="fixed inset-0 flex items-center justify-center bg-surface">
         <div className="flex flex-col items-center gap-3">
           <Spinner size="lg" />
-          <span className="text-xs text-zinc-500">Loading canvas...</span>
+          <span className="text-xs text-ink-soft">Loading canvas...</span>
         </div>
       </div>
     );
@@ -79,15 +79,15 @@ export default function Home() {
           // selector that's used by other transient toasts. Don't rename
           // without updating that spec.
           data-testid="hydration-error"
-          className="fixed inset-0 flex flex-col items-center justify-center bg-zinc-950 text-zinc-300 gap-4 z-[9999]"
+          className="fixed inset-0 flex flex-col items-center justify-center bg-surface text-ink-mid gap-4 z-[9999]"
         >
-          <p className="text-zinc-400 text-sm">{hydrationError}</p>
+          <p className="text-ink-mid text-sm">{hydrationError}</p>
           <button
             onClick={() => {
               setHydrationError(null);
               window.location.reload();
             }}
-            className="px-4 py-2 bg-blue-600 hover:bg-blue-500 text-white rounded-md text-sm"
+            className="px-4 py-2 bg-accent-strong hover:bg-accent text-white rounded-md text-sm"
           >
             Retry
           </button>
@@ -108,28 +108,28 @@ function PlatformDownDiagnostic() {
   return (
     <div
       role="alert"
-      className="fixed inset-0 flex flex-col items-center justify-center bg-zinc-950 text-zinc-300 gap-5 z-[9999] px-6"
+      className="fixed inset-0 flex flex-col items-center justify-center bg-surface text-ink-mid gap-5 z-[9999] px-6"
     >
-      <div className="text-amber-400 text-sm font-semibold uppercase tracking-wider">
+      <div className="text-warm text-sm font-semibold uppercase tracking-wider">
         Platform infrastructure unreachable
       </div>
-      <p className="text-zinc-400 text-sm max-w-lg text-center leading-relaxed">
-        The platform server returned <code className="font-mono text-amber-300">503 platform_unavailable</code>.
+      <p className="text-ink-mid text-sm max-w-lg text-center leading-relaxed">
+        The platform server returned <code className="font-mono text-warm">503 platform_unavailable</code>.
         That means it can&apos;t reach Postgres or Redis to validate your session.
         Most common cause on a dev host: one of those services stopped.
       </p>
-      <div className="bg-zinc-900/80 border border-zinc-700/50 rounded-lg px-4 py-3 max-w-lg w-full">
-        <div className="text-[10px] uppercase tracking-wider text-zinc-500 mb-2">Try first</div>
-        <pre className="text-[12px] text-zinc-300 font-mono whitespace-pre-wrap leading-relaxed">{`brew services start postgresql@14
+      <div className="bg-surface-sunken/80 border border-line/50 rounded-lg px-4 py-3 max-w-lg w-full">
+        <div className="text-[10px] uppercase tracking-wider text-ink-soft mb-2">Try first</div>
+        <pre className="text-[12px] text-ink-mid font-mono whitespace-pre-wrap leading-relaxed">{`brew services start postgresql@14
 brew services start redis`}</pre>
       </div>
-      <p className="text-[11px] text-zinc-500 max-w-lg text-center">
+      <p className="text-[11px] text-ink-soft max-w-lg text-center">
         If both are running, check <code className="font-mono">/tmp/molecule-server.log</code> for
         the underlying error. If you&apos;re on hosted SaaS, this is a platform incident — try again in a moment.
       </p>
       <button
         onClick={() => window.location.reload()}
-        className="px-4 py-2 bg-blue-600 hover:bg-blue-500 text-white rounded-md text-sm mt-2"
+        className="px-4 py-2 bg-accent-strong hover:bg-accent text-white rounded-md text-sm mt-2"
       >
         Reload
       </button>

canvas/src/app/pricing/page.tsx

@@ -19,17 +19,17 @@ export const metadata = {
 
 export default function PricingPage() {
   return (
-    <main className="min-h-screen bg-zinc-950 text-zinc-100">
+    <main className="min-h-screen bg-surface text-ink">
       <div className="mx-auto max-w-5xl px-6 pt-20 pb-8 text-center">
-        <h1 className="text-5xl font-bold tracking-tight text-white md:text-6xl">
+        <h1 className="text-5xl font-bold tracking-tight text-ink md:text-6xl">
           Pricing
         </h1>
-        <p className="mx-auto mt-4 max-w-2xl text-lg text-zinc-300">
+        <p className="mx-auto mt-4 max-w-2xl text-lg text-ink-mid">
           One flat price per org — not per seat. Every paid tier includes the
           full runtime stack. You upgrade for scale, support, and dedicated
           infrastructure.
         </p>
-        <p className="mx-auto mt-2 max-w-xl text-sm text-zinc-400">
+        <p className="mx-auto mt-2 max-w-xl text-sm text-ink-mid">
           5-person team? You pay $29/month — not $200. No seat math, ever.
         </p>
       </div>
@@ -37,42 +37,42 @@ export default function PricingPage() {
       <PricingTable />
 
       <section className="mx-auto mt-20 max-w-3xl px-6 text-center">
-        <h2 className="text-2xl font-semibold text-white">Questions?</h2>
-        <p className="mt-2 text-zinc-400">
+        <h2 className="text-2xl font-semibold text-ink">Questions?</h2>
+        <p className="mt-2 text-ink-mid">
           We publish the{" "}
           <a
             href="https://github.com/Molecule-AI/molecule-monorepo"
-            className="text-blue-400 underline hover:text-blue-300"
+            className="text-accent underline hover:text-accent"
           >
             full source on GitHub
           </a>
           {" "}— if something's ambiguous, file an issue or{" "}
           <a
             href="mailto:support@moleculesai.app"
-            className="text-blue-400 underline hover:text-blue-300"
+            className="text-accent underline hover:text-accent"
           >
             email support
           </a>
           .
         </p>
-        <p className="mt-6 text-sm text-zinc-500">
+        <p className="mt-6 text-sm text-ink-soft">
           Prices shown in USD. Flat-rate per org — no per-seat fees on any paid tier.
           Enterprise / self-hosted licensing available — contact us.
         </p>
       </section>
 
-      <footer className="mx-auto mt-20 max-w-5xl border-t border-zinc-800 px-6 py-6 text-center text-sm text-zinc-500">
+      <footer className="mx-auto mt-20 max-w-5xl border-t border-line px-6 py-6 text-center text-sm text-ink-soft">
         <p>
           © {new Date().getFullYear()} Molecule AI, Inc. ·{" "}
-          <a href="/legal/terms" className="hover:text-zinc-300">
+          <a href="/legal/terms" className="hover:text-ink-mid">
             Terms
           </a>
           {" "}·{" "}
-          <a href="/legal/privacy" className="hover:text-zinc-300">
+          <a href="/legal/privacy" className="hover:text-ink-mid">
             Privacy
           </a>
           {" "}·{" "}
-          <a href="/legal/dpa" className="hover:text-zinc-300">
+          <a href="/legal/dpa" className="hover:text-ink-mid">
             DPA
           </a>
         </p>

canvas/src/components/ApprovalBanner.tsx

@@ -61,13 +61,13 @@ export function ApprovalBanner() {
         >
           <div className="flex items-start gap-3">
             <div className="w-8 h-8 rounded-lg bg-amber-800/40 flex items-center justify-center shrink-0 mt-0.5">
-              <span className="text-amber-300 text-lg" aria-hidden="true">⚠</span>
+              <span className="text-warm text-lg" aria-hidden="true">⚠</span>
             </div>
             <div className="flex-1 min-w-0">
               <div className="text-xs text-amber-200 font-semibold">{approval.workspace_name} needs approval</div>
               <div className="text-sm text-amber-100 mt-0.5 font-medium">{approval.action}</div>
               {approval.reason && (
-                <div className="text-xs text-amber-300/70 mt-1">{approval.reason}</div>
+                <div className="text-xs text-warm/70 mt-1">{approval.reason}</div>
               )}
               <div className="flex gap-2 mt-3">
                 <button
@@ -80,7 +80,7 @@ export function ApprovalBanner() {
                 <button
                   type="button"
                   onClick={() => handleDecide(approval, "denied")}
-                  className="px-3 py-1.5 bg-zinc-700 hover:bg-zinc-600 text-xs rounded-lg text-zinc-300 transition-colors"
+                  className="px-3 py-1.5 bg-surface-card hover:bg-surface-card text-xs rounded-lg text-ink-mid transition-colors"
                 >
                   Deny
                 </button>

canvas/src/components/AuditTrailPanel.tsx

@@ -9,7 +9,7 @@ import type { AuditEntry, AuditResponse } from "@/types/audit";
 type EventFilter = "all" | AuditEntry["event_type"];
 
 const BADGE_COLORS: Record<AuditEntry["event_type"], { text: string; bg: string; border: string }> = {
-  delegation: { text: "text-blue-400",   bg: "bg-blue-950/40",   border: "border-blue-800/40" },
+  delegation: { text: "text-accent",   bg: "bg-blue-950/40",   border: "border-blue-800/40" },
   decision:   { text: "text-violet-400", bg: "bg-violet-950/40", border: "border-violet-800/40" },
   gate:       { text: "text-yellow-400", bg: "bg-yellow-950/40", border: "border-yellow-800/40" },
   hitl:       { text: "text-orange-400", bg: "bg-orange-950/40", border: "border-orange-800/40" },
@@ -127,7 +127,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
   if (loading) {
     return (
       <div className="flex items-center justify-center h-32">
-        <span className="text-xs text-zinc-500">Loading audit trail…</span>
+        <span className="text-xs text-ink-soft">Loading audit trail…</span>
       </div>
     );
   }
@@ -135,7 +135,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
   return (
     <div className="flex flex-col h-full">
       {/* Filter bar */}
-      <div className="px-4 py-2.5 border-b border-zinc-800/40 flex items-center gap-1 overflow-x-auto shrink-0">
+      <div className="px-4 py-2.5 border-b border-line/40 flex items-center gap-1 overflow-x-auto shrink-0">
         {FILTERS.map((f) => (
           <button
             type="button"
@@ -144,8 +144,8 @@ export function AuditTrailPanel({ workspaceId }: Props) {
             aria-pressed={filter === f.id}
             className={`px-2 py-1 text-[10px] rounded-md font-medium transition-all shrink-0 ${
               filter === f.id
-                ? "bg-zinc-700 text-zinc-100 ring-1 ring-zinc-600"
-                : "text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/60"
+                ? "bg-surface-card text-ink ring-1 ring-zinc-600"
+                : "text-ink-soft hover:text-ink-mid hover:bg-surface-card/60"
             }`}
           >
             {f.label}
@@ -155,7 +155,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
         <button
           type="button"
           onClick={loadEntries}
-          className="px-2 py-1 text-[10px] bg-zinc-800 hover:bg-zinc-700 text-zinc-400 rounded transition-colors shrink-0"
+          className="px-2 py-1 text-[10px] bg-surface-card hover:bg-surface-card text-ink-mid rounded transition-colors shrink-0"
           aria-label="Refresh audit trail"
         >
           ↻
@@ -164,7 +164,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
 
       {/* Error banner */}
       {error && (
-        <div className="mx-4 mt-3 px-3 py-2 bg-red-950/30 border border-red-800/40 rounded text-xs text-red-400 shrink-0">
+        <div className="mx-4 mt-3 px-3 py-2 bg-red-950/30 border border-red-800/40 rounded text-xs text-bad shrink-0">
           {error}
         </div>
       )}
@@ -174,9 +174,9 @@ export function AuditTrailPanel({ workspaceId }: Props) {
         {entries.length === 0 ? (
           /* Empty state */
           <div className="flex flex-col items-center justify-center py-16 gap-3 text-center">
-            <span className="text-4xl text-zinc-700" aria-hidden="true">⊟</span>
-            <p className="text-sm font-medium text-zinc-400">No audit events yet</p>
-            <p className="text-[11px] text-zinc-600 max-w-[200px] leading-relaxed">
+            <span className="text-4xl text-ink-soft" aria-hidden="true">⊟</span>
+            <p className="text-sm font-medium text-ink-mid">No audit events yet</p>
+            <p className="text-[11px] text-ink-soft max-w-[200px] leading-relaxed">
               Delegation, decision, gate, and human-in-the-loop events will appear here.
             </p>
           </div>
@@ -195,7 +195,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
                   type="button"
                   onClick={loadMore}
                   disabled={loadingMore}
-                  className="px-4 py-2 text-[11px] bg-zinc-800 hover:bg-zinc-700 disabled:opacity-50 disabled:cursor-not-allowed text-zinc-300 rounded-lg transition-colors"
+                  className="px-4 py-2 text-[11px] bg-surface-card hover:bg-surface-card disabled:opacity-50 disabled:cursor-not-allowed text-ink-mid rounded-lg transition-colors"
                 >
                   {loadingMore ? "Loading…" : "Load more"}
                 </button>
@@ -203,7 +203,7 @@ export function AuditTrailPanel({ workspaceId }: Props) {
             )}
 
             {/* Entry count footer */}
-            <p className="mt-3 text-center text-[9px] text-zinc-600">
+            <p className="mt-3 text-center text-[9px] text-ink-soft">
               {entries.length} event{entries.length !== 1 ? "s" : ""} loaded
               {cursor ? " · more available" : " · all loaded"}
             </p>
@@ -227,15 +227,15 @@ export interface AuditEntryRowProps {
  */
 export function AuditEntryRow({ entry, now }: AuditEntryRowProps) {
   const badge = BADGE_COLORS[entry.event_type] ?? {
-    text: "text-zinc-400",
-    bg: "bg-zinc-800/40",
-    border: "border-zinc-700/40",
+    text: "text-ink-mid",
+    bg: "bg-surface-card/40",
+    border: "border-line/40",
   };
 
   return (
     <div
       role="listitem"
-      className="rounded-lg border border-zinc-800/60 bg-zinc-900/50 px-3 py-2.5 space-y-1.5"
+      className="rounded-lg border border-line/60 bg-surface-sunken/50 px-3 py-2.5 space-y-1.5"
     >
       {/* Header row: badge · actor · tamper flag · timestamp */}
       <div className="flex items-center gap-2">
@@ -248,14 +248,14 @@ export function AuditEntryRow({ entry, now }: AuditEntryRowProps) {
         </span>
 
         {/* Actor name */}
-        <span className="text-[10px] text-zinc-400 truncate flex-1 min-w-0 font-mono">
+        <span className="text-[10px] text-ink-mid truncate flex-1 min-w-0 font-mono">
           {entry.actor}
         </span>
 
         {/* Tamper warning — only rendered when chain is invalid */}
         {!entry.chain_valid && (
           <span
-            className="shrink-0 text-[11px] text-red-400 font-bold leading-none"
+            className="shrink-0 text-[11px] text-bad font-bold leading-none"
             title="Chain integrity check failed — this entry may have been tampered with"
             aria-label="Chain integrity warning: tampered entry"
             role="img"
@@ -265,13 +265,13 @@ export function AuditEntryRow({ entry, now }: AuditEntryRowProps) {
         )}
 
         {/* Relative timestamp */}
-        <span className="shrink-0 text-[9px] text-zinc-600">
+        <span className="shrink-0 text-[9px] text-ink-soft">
           {formatAuditRelativeTime(entry.created_at, now)}
         </span>
       </div>
 
       {/* Summary text */}
-      <p className="text-[11px] text-zinc-300 leading-relaxed break-words">
+      <p className="text-[11px] text-ink-mid leading-relaxed break-words">
         {entry.summary}
       </p>
     </div>

canvas/src/components/AuthGate.tsx

@@ -63,7 +63,7 @@ export function AuthGate({ children }: { children: ReactNode }) {
   if (state.kind === "loading") {
     // Zinc-950 backdrop matches the canvas background so the browser
     // never paints a white flash while the session round-trip resolves.
-    return <div className="fixed inset-0 bg-zinc-950" aria-hidden="true" />;
+    return <div className="fixed inset-0 bg-surface" aria-hidden="true" />;
   }
   if (state.kind === "anonymous" && !state.skipRedirect) {
     // Redirect already firing from the effect above; render nothing in

canvas/src/components/BatchActionBar.tsx

@@ -80,14 +80,14 @@ export function BatchActionBar() {
     <div
       role="toolbar"
       aria-label="Batch workspace actions"
-      className="fixed bottom-6 left-1/2 -translate-x-1/2 z-[200] flex items-center gap-3 px-4 py-2.5 rounded-2xl bg-zinc-900/95 border border-zinc-700/70 shadow-2xl shadow-black/50 backdrop-blur-md"
+      className="fixed bottom-6 left-1/2 -translate-x-1/2 z-[200] flex items-center gap-3 px-4 py-2.5 rounded-2xl bg-surface-sunken/95 border border-line/70 shadow-2xl shadow-black/50 backdrop-blur-md"
     >
       {/* Selection count badge */}
-      <span className="text-[12px] font-semibold text-zinc-100 bg-blue-600/80 px-2.5 py-0.5 rounded-full tabular-nums">
+      <span className="text-[12px] font-semibold text-white bg-accent-strong/80 px-2.5 py-0.5 rounded-full tabular-nums">
         {count} selected
       </span>
 
-      <div className="w-px h-5 bg-zinc-700/60" aria-hidden="true" />
+      <div className="w-px h-5 bg-surface-card/60" aria-hidden="true" />
 
       {/* Action buttons */}
       <button
@@ -104,7 +104,7 @@ export function BatchActionBar() {
         type="button"
         disabled={busy}
         onClick={() => setPending("pause")}
-        className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[12px] font-medium text-amber-300 bg-amber-900/30 hover:bg-amber-800/50 border border-amber-700/30 hover:border-amber-600/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/70"
+        className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[12px] font-medium text-warm bg-amber-900/30 hover:bg-amber-800/50 border border-amber-700/30 hover:border-amber-600/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/70"
       >
         <span aria-hidden="true">⏸</span>
         Pause All
@@ -114,13 +114,13 @@ export function BatchActionBar() {
         type="button"
         disabled={busy}
         onClick={() => setPending("delete")}
-        className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[12px] font-medium text-red-300 bg-red-900/30 hover:bg-red-800/50 border border-red-700/30 hover:border-red-600/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500/70"
+        className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[12px] font-medium text-bad bg-red-900/30 hover:bg-red-800/50 border border-red-700/30 hover:border-red-600/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500/70"
       >
         <span aria-hidden="true">✕</span>
         Delete All
       </button>
 
-      <div className="w-px h-5 bg-zinc-700/60" aria-hidden="true" />
+      <div className="w-px h-5 bg-surface-card/60" aria-hidden="true" />
 
       {/* Deselect */}
       <button
@@ -129,7 +129,7 @@ export function BatchActionBar() {
         onClick={clearSelection}
         aria-label="Clear selection"
         title="Clear selection (Escape)"
-        className="p-1.5 rounded-lg text-[12px] text-zinc-400 hover:text-zinc-200 hover:bg-zinc-700/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/70"
+        className="p-1.5 rounded-lg text-[12px] text-ink-mid hover:text-ink hover:bg-surface-card/50 transition-colors disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-500/70"
       >
         ✕
       </button>

canvas/src/components/BundleDropZone.tsx

@@ -112,7 +112,7 @@ export function BundleDropZone() {
         onClick={() => fileInputRef.current?.click()}
         aria-label="Import bundle file"
         aria-controls="bundle-file-input"
-        className="sr-only focus:not-sr-only fixed bottom-20 right-4 z-30 px-3 py-1.5 bg-zinc-900/90 border border-zinc-700/50 rounded-lg text-[10px] text-zinc-400 hover:text-zinc-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 transition-colors"
+        className="sr-only focus:not-sr-only fixed bottom-20 right-4 z-30 px-3 py-1.5 bg-surface-sunken/90 border border-line/50 rounded-lg text-[10px] text-ink-mid hover:text-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent transition-colors"
       >
         📦 Import bundle
       </button>
@@ -120,19 +120,19 @@ export function BundleDropZone() {
       {/* Visual overlay when dragging */}
       {isDragging && (
         <div className="fixed inset-0 z-20 flex items-center justify-center bg-blue-950/40 backdrop-blur-sm border-2 border-dashed border-blue-400/50 pointer-events-none">
-          <div className="bg-zinc-900/95 border border-blue-500/50 rounded-2xl px-8 py-6 shadow-2xl text-center">
+          <div className="bg-surface-sunken/95 border border-accent/50 rounded-2xl px-8 py-6 shadow-2xl text-center">
             <div className="text-3xl mb-2" aria-hidden="true">📦</div>
-            <div className="text-sm font-semibold text-zinc-100">Drop Bundle to Import</div>
-            <div className="text-xs text-zinc-500 mt-1">.bundle.json files only</div>
+            <div className="text-sm font-semibold text-ink">Drop Bundle to Import</div>
+            <div className="text-xs text-ink-soft mt-1">.bundle.json files only</div>
           </div>
         </div>
       )}
 
       {/* Importing spinner */}
       {importing && (
-        <div className="fixed bottom-6 left-1/2 -translate-x-1/2 z-50 bg-zinc-900/95 border border-zinc-700/60 rounded-xl px-5 py-3 shadow-2xl flex items-center gap-3">
+        <div className="fixed bottom-6 left-1/2 -translate-x-1/2 z-50 bg-surface-sunken/95 border border-line/60 rounded-xl px-5 py-3 shadow-2xl flex items-center gap-3">
           <div className="w-4 h-4 border-2 border-sky-400 border-t-transparent rounded-full animate-spin" />
-          <span className="text-sm text-zinc-200">Importing bundle...</span>
+          <span className="text-sm text-ink">Importing bundle...</span>
         </div>
       )}
 

canvas/src/components/Canvas.tsx

@@ -13,6 +13,7 @@ import {
 import "@xyflow/react/dist/style.css";
 
 import { useCanvasStore } from "@/store/canvas";
+import { useTheme } from "@/lib/theme-provider";
 import { A2ATopologyOverlay } from "./A2ATopologyOverlay";
 import { WorkspaceNode } from "./WorkspaceNode";
 import { SidePanel } from "./SidePanel";
@@ -69,6 +70,14 @@ export function Canvas() {
 }
 
 function CanvasInner() {
+  // ReactFlow's `colorMode` prop drives the styling of every viewport
+  // primitive it renders directly (background dots, edge defaults,
+  // selection rings, controls, minimap mask). Pre-fix this was hard-pinned
+  // to "dark" — so on light theme the chrome (toolbar, side panel) flipped
+  // to warm-paper but the canvas backplate + edges stayed black, leaving a
+  // half-themed page. Pull resolvedTheme so the canvas matches the user's
+  // selected mode (and the system preference when they pick "system").
+  const { resolvedTheme } = useTheme();
   const rawNodes = useCanvasStore((s) => s.nodes);
   const edges = useCanvasStore((s) => s.edges);
   const a2aEdges = useCanvasStore((s) => s.a2aEdges);
@@ -244,13 +253,13 @@ function CanvasInner() {
     <>
       <a
         href="#canvas-main"
-        className="sr-only focus:not-sr-only focus:absolute focus:top-2 focus:left-2 focus:z-50 focus:px-4 focus:py-2 focus:bg-zinc-900 focus:text-zinc-100 focus:rounded-lg focus:border focus:border-zinc-700"
+        className="sr-only focus:not-sr-only focus:absolute focus:top-2 focus:left-2 focus:z-50 focus:px-4 focus:py-2 focus:bg-surface-sunken focus:text-ink focus:rounded-lg focus:border focus:border-line"
       >
         Skip to canvas
       </a>
-      <main id="canvas-main" className="w-screen h-screen bg-zinc-950">
+      <main id="canvas-main" className="w-screen h-screen bg-surface">
         <ReactFlow
-          colorMode="dark"
+          colorMode={resolvedTheme}
           nodes={nodes}
           edges={allEdges}
           onNodesChange={onNodesChange}
@@ -273,15 +282,19 @@ function CanvasInner() {
             variant={BackgroundVariant.Dots}
             gap={24}
             size={1}
-            color="#27272a"
+            // Match the line token so dots fade with the surface.
+            // Hard-coded zinc-800 was invisible on warm-paper.
+            color={resolvedTheme === "dark" ? "#27272a" : "#d4d0c4"}
           />
           <Controls
-            className="!bg-zinc-900/90 !border-zinc-700/50 !rounded-lg !shadow-xl !shadow-black/20 [&>button]:!bg-zinc-800 [&>button]:!border-zinc-700/50 [&>button]:!text-zinc-400 [&>button:hover]:!bg-zinc-700 [&>button:hover]:!text-zinc-200"
+            className="!bg-surface-sunken/90 !border-line/50 !rounded-lg !shadow-xl !shadow-black/20 [&>button]:!bg-surface-card [&>button]:!border-line/50 [&>button]:!text-ink-mid [&>button:hover]:!bg-surface-card [&>button:hover]:!text-ink"
             showInteractive={false}
           />
           <MiniMap
-            className="!bg-zinc-900/90 !border-zinc-700/50 !rounded-lg !shadow-xl !shadow-black/20"
-            maskColor="rgba(0, 0, 0, 0.7)"
+            className="!bg-surface-sunken/90 !border-line/50 !rounded-lg !shadow-xl !shadow-black/20"
+            // Mask dims off-viewport areas; tint matches the surface so
+            // the dimming doesn't show as a black bar in light mode.
+            maskColor={resolvedTheme === "dark" ? "rgba(0, 0, 0, 0.7)" : "rgba(232, 226, 211, 0.7)"}
             nodeColor={(node) => {
               // Parents show as a filled region — hierarchy visible at
               // a glance in the minimap without needing to zoom.

canvas/src/components/CommunicationOverlay.tsx

@@ -102,7 +102,7 @@ export function CommunicationOverlay() {
         type="button"
         onClick={() => setVisible(true)}
         aria-label="Show communications panel"
-        className="fixed top-16 right-4 z-30 px-3 py-1.5 bg-zinc-900/90 border border-zinc-700/50 rounded-lg text-[10px] text-zinc-400 hover:text-zinc-200 transition-colors"
+        className="fixed top-16 right-4 z-30 px-3 py-1.5 bg-surface-sunken/90 border border-line/50 rounded-lg text-[10px] text-ink-mid hover:text-ink transition-colors"
       >
         <span aria-hidden="true">↗↙ </span>{comms.length > 0 ? `${comms.length} comms` : "Communications"}
       </button>
@@ -110,16 +110,16 @@ export function CommunicationOverlay() {
   }
 
   return (
-    <div className="fixed top-16 right-4 z-30 w-[320px] max-h-[400px] bg-zinc-900/95 border border-zinc-700/50 rounded-xl shadow-xl shadow-black/30 backdrop-blur-sm overflow-hidden">
-      <div className="flex items-center justify-between px-3 py-2 border-b border-zinc-800/60">
-        <div className="text-[10px] font-semibold text-zinc-400 uppercase tracking-wider">
+    <div className="fixed top-16 right-4 z-30 w-[320px] max-h-[400px] bg-surface-sunken/95 border border-line/50 rounded-xl shadow-xl shadow-black/30 backdrop-blur-sm overflow-hidden">
+      <div className="flex items-center justify-between px-3 py-2 border-b border-line/60">
+        <div className="text-[10px] font-semibold text-ink-mid uppercase tracking-wider">
           <span aria-hidden="true">↗↙ </span>Communications ({comms.length})
         </div>
         <button
           type="button"
           onClick={() => setVisible(false)}
           aria-label="Close communications panel"
-          className="text-zinc-500 hover:text-zinc-300 text-xs"
+          className="text-ink-soft hover:text-ink-mid text-xs"
         >
           <span aria-hidden="true">✕</span>
         </button>
@@ -128,10 +128,10 @@ export function CommunicationOverlay() {
       <div className="overflow-y-auto max-h-[350px] p-2 space-y-1">
         {comms.map((c) => {
           const isSelected = selectedNodeId === c.sourceId || selectedNodeId === c.targetId;
-          const typeColor = c.type === "a2a_send" ? "text-cyan-400" : c.type === "a2a_receive" ? "text-blue-400" : "text-amber-400";
+          const typeColor = c.type === "a2a_send" ? "text-cyan-400" : c.type === "a2a_receive" ? "text-accent" : "text-warm";
           const typeIcon = c.type === "a2a_send" ? "↗" : c.type === "a2a_receive" ? "↙" : "◆";
           const statusIcon = c.status === "ok" ? "✓" : c.status === "error" ? "✕" : "⏱";
-          const statusColor = c.status === "ok" ? "text-emerald-400" : c.status === "error" ? "text-red-400" : "text-amber-400";
+          const statusColor = c.status === "ok" ? "text-good" : c.status === "error" ? "text-bad" : "text-warm";
           const age = formatAge(c.timestamp);
 
           return (
@@ -140,31 +140,31 @@ export function CommunicationOverlay() {
               className={`rounded-lg px-2.5 py-1.5 text-[9px] border transition-all ${
                 isSelected
                   ? "bg-blue-950/30 border-blue-800/40"
-                  : "bg-zinc-800/30 border-zinc-700/20 hover:bg-zinc-800/50"
+                  : "bg-surface-card/30 border-line/20 hover:bg-surface-card/50"
               }`}
             >
               <div className="flex items-center justify-between gap-2">
                 <div className="flex items-center gap-1.5 min-w-0">
                   <span className={typeColor} aria-hidden="true">{typeIcon}</span>
                   <span className="sr-only">{COMM_TYPE_LABELS[c.type] ?? c.type}</span>
-                  <span className="text-zinc-300 font-medium truncate">
+                  <span className="text-ink-mid font-medium truncate">
                     {c.sourceName}
                   </span>
-                  <span className="text-zinc-400" aria-hidden="true">→</span>
+                  <span className="text-ink-mid" aria-hidden="true">→</span>
                   <span className="sr-only">to</span>
-                  <span className="text-zinc-300 truncate">{c.targetName}</span>
+                  <span className="text-ink-mid truncate">{c.targetName}</span>
                 </div>
                 <div className="flex items-center gap-1 shrink-0">
                   <span className={statusColor} aria-hidden="true">{statusIcon}</span>
                   <span className="sr-only">{c.status}</span>
-                  <span className="text-zinc-400">{age}</span>
+                  <span className="text-ink-mid">{age}</span>
                 </div>
               </div>
               {c.summary && (
-                <div className="text-zinc-500 truncate mt-0.5 pl-4">{c.summary}</div>
+                <div className="text-ink-soft truncate mt-0.5 pl-4">{c.summary}</div>
               )}
               {c.durationMs && (
-                <div className="text-zinc-400 pl-4">{c.durationMs}ms</div>
+                <div className="text-ink-mid pl-4">{c.durationMs}ms</div>
               )}
             </div>
           );

canvas/src/components/ConfirmDialog.tsx

@@ -96,7 +96,7 @@ export function ConfirmDialog({
       ? "bg-red-600 hover:bg-red-500 text-white"
       : confirmVariant === "warning"
         ? "bg-amber-600 hover:bg-amber-500 text-white"
-        : "bg-blue-600 hover:bg-blue-500 text-white";
+        : "bg-accent-strong hover:bg-accent text-white";
 
   // Render via Portal so the fixed-position dialog escapes any containing block
   // (e.g. parents with transform, filter, will-change that break position:fixed).
@@ -111,19 +111,19 @@ export function ConfirmDialog({
         role="dialog"
         aria-modal="true"
         aria-labelledby="confirm-dialog-title"
-        className="relative bg-zinc-900 border border-zinc-700 rounded-xl shadow-2xl shadow-black/50 max-w-[380px] w-full mx-4 overflow-hidden"
+        className="relative bg-surface-sunken border border-line rounded-xl shadow-2xl shadow-black/50 max-w-[380px] w-full mx-4 overflow-hidden"
       >
         <div className="px-5 py-4">
-          <h3 id="confirm-dialog-title" className="text-sm font-semibold text-zinc-100 mb-2">{title}</h3>
-          <p className="text-[13px] text-zinc-400 leading-relaxed">{message}</p>
+          <h3 id="confirm-dialog-title" className="text-sm font-semibold text-ink mb-2">{title}</h3>
+          <p className="text-[13px] text-ink-mid leading-relaxed">{message}</p>
         </div>
 
-        <div className="flex items-center justify-end gap-2 px-5 py-3 border-t border-zinc-800 bg-zinc-950/50">
+        <div className="flex items-center justify-end gap-2 px-5 py-3 border-t border-line bg-surface/50">
           {!singleButton && (
             <button
               type="button"
               onClick={onCancel}
-              className="px-3.5 py-1.5 text-[13px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+              className="px-3.5 py-1.5 text-[13px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
             >
               Cancel
             </button>

canvas/src/components/ConsoleModal.tsx

@@ -95,15 +95,15 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
         role="dialog"
         aria-modal="true"
         aria-labelledby="console-modal-title"
-        className="relative bg-zinc-950 border border-zinc-800 rounded-xl shadow-2xl w-[min(900px,90vw)] h-[min(70vh,700px)] flex flex-col overflow-hidden"
+        className="relative bg-surface border border-line rounded-xl shadow-2xl w-[min(900px,90vw)] h-[min(70vh,700px)] flex flex-col overflow-hidden"
       >
-        <div className="flex items-center justify-between px-4 py-3 border-b border-zinc-800">
+        <div className="flex items-center justify-between px-4 py-3 border-b border-line">
           <div>
-            <h3 id="console-modal-title" className="text-sm font-semibold text-zinc-100">
+            <h3 id="console-modal-title" className="text-sm font-semibold text-ink">
               EC2 console output
             </h3>
             {workspaceName && (
-              <div className="text-[11px] text-zinc-500 mt-0.5 truncate max-w-[600px]">
+              <div className="text-[11px] text-ink-soft mt-0.5 truncate max-w-[600px]">
                 {workspaceName}
               </div>
             )}
@@ -113,7 +113,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
             ref={closeButtonRef}
             onClick={onClose}
             aria-label="Close"
-            className="text-zinc-400 hover:text-zinc-100 text-sm px-2"
+            className="text-ink-mid hover:text-ink text-sm px-2"
           >
             ✕
           </button>
@@ -121,14 +121,14 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
 
         <div className="flex-1 overflow-auto bg-black/80 p-4">
           {loading && (
-            <div className="text-[12px] text-zinc-500" data-testid="console-loading">
+            <div className="text-[12px] text-ink-soft" data-testid="console-loading">
               Loading console output…
             </div>
           )}
           {!loading && error && (
             <div
               role="alert"
-              className="text-[12px] text-amber-300 bg-amber-950/30 border border-amber-900/40 rounded px-3 py-2"
+              className="text-[12px] text-warm bg-amber-950/30 border border-amber-900/40 rounded px-3 py-2"
               data-testid="console-error"
             >
               {error}
@@ -136,7 +136,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
           )}
           {!loading && !error && output !== null && (
             <pre
-              className="text-[11px] text-zinc-300 font-mono whitespace-pre-wrap break-all leading-tight"
+              className="text-[11px] text-ink-mid font-mono whitespace-pre-wrap break-all leading-tight"
               data-testid="console-output"
             >
               {output || "(console output is empty — the instance may still be booting)"}
@@ -144,7 +144,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
           )}
         </div>
 
-        <div className="flex items-center justify-end gap-2 px-4 py-3 border-t border-zinc-800 bg-zinc-900/40">
+        <div className="flex items-center justify-end gap-2 px-4 py-3 border-t border-line bg-surface-sunken/40">
           {output && (
             <button
               type="button"
@@ -155,7 +155,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
                   showToast("Copy requires HTTPS — please select and copy manually", "info");
                 }
               }}
-              className="px-3 py-1.5 text-[11px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+              className="px-3 py-1.5 text-[11px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
             >
               Copy
             </button>
@@ -163,7 +163,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop
           <button
             type="button"
             onClick={onClose}
-            className="px-3 py-1.5 text-[11px] text-zinc-300 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+            className="px-3 py-1.5 text-[11px] text-ink-mid bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
           >
             Close
           </button>

canvas/src/components/ContextMenu.tsx

@@ -287,24 +287,24 @@ export function ContextMenu() {
       role="menu"
       aria-label={`Actions for ${contextMenu.nodeData.name}`}
       onKeyDown={handleMenuKeyDown}
-      className="fixed z-[60] min-w-[200px] bg-zinc-950/95 backdrop-blur-xl border border-zinc-800/60 rounded-xl shadow-2xl shadow-black/60 py-1 overflow-hidden"
+      className="fixed z-[60] min-w-[200px] bg-surface/95 backdrop-blur-xl border border-line/60 rounded-xl shadow-2xl shadow-black/60 py-1 overflow-hidden"
       style={{ left: contextMenu.x, top: contextMenu.y }}
     >
       {/* Header */}
-      <div className="px-3.5 py-2 border-b border-zinc-800/40 mb-0.5">
-        <div className="text-[11px] font-semibold text-zinc-200 truncate">{contextMenu.nodeData.name}</div>
+      <div className="px-3.5 py-2 border-b border-line/40 mb-0.5">
+        <div className="text-[11px] font-semibold text-ink truncate">{contextMenu.nodeData.name}</div>
         <div className="flex items-center gap-1.5 mt-0.5">
           <div
             aria-hidden="true"
             className={`w-1.5 h-1.5 rounded-full ${statusDotClass(contextMenu.nodeData.status)}`}
           />
-          <span className="text-[10px] text-zinc-500">{contextMenu.nodeData.status}</span>
+          <span className="text-[10px] text-ink-soft">{contextMenu.nodeData.status}</span>
         </div>
       </div>
 
       {items.map((item, i) => {
         if (item.divider) {
-          return <div key={i} role="separator" className="h-px bg-zinc-800/60 my-1" />;
+          return <div key={i} role="separator" className="h-px bg-surface-card/60 my-1" />;
         }
         return (
           <button
@@ -316,8 +316,8 @@ export function ContextMenu() {
             aria-disabled={item.disabled}
             className={`w-full px-3.5 py-1.5 flex items-center gap-2.5 text-left text-[11px] transition-colors focus:outline-none focus:ring-1 focus:ring-inset focus:ring-zinc-600 disabled:opacity-25 disabled:cursor-not-allowed ${
               item.danger
-                ? "text-red-400 hover:bg-red-950/40 hover:text-red-300"
-                : "text-zinc-300 hover:bg-zinc-800/40 hover:text-zinc-100"
+                ? "text-bad hover:bg-red-950/40 hover:text-bad"
+                : "text-ink-mid hover:bg-surface-card/40 hover:text-ink"
             }`}
           >
             <span aria-hidden="true" className="w-4 text-center text-[10px] shrink-0 opacity-50">{item.icon}</span>

canvas/src/components/ConversationTraceModal.tsx

@@ -99,14 +99,14 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
           aria-label="Conversation trace"
         >
           {/* Modal panel */}
-          <div className="relative bg-zinc-900 border border-zinc-700 rounded-xl shadow-2xl max-w-[700px] w-full max-h-[85vh] flex flex-col overflow-hidden">
+          <div className="relative bg-surface-sunken border border-line rounded-xl shadow-2xl max-w-[700px] w-full max-h-[85vh] flex flex-col overflow-hidden">
             {/* Header */}
-            <div className="flex items-center justify-between px-5 py-3 border-b border-zinc-800">
+            <div className="flex items-center justify-between px-5 py-3 border-b border-line">
               <div>
-                <Dialog.Title className="text-sm font-semibold text-zinc-100">
+                <Dialog.Title className="text-sm font-semibold text-ink">
                   Conversation Trace
                 </Dialog.Title>
-                <p className="text-[10px] text-zinc-500 mt-0.5">
+                <p className="text-[10px] text-ink-soft mt-0.5">
                   {entries.length} events across all workspaces
                 </p>
               </div>
@@ -114,7 +114,7 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
                 <button
                   type="button"
                   aria-label="Close conversation trace"
-                  className="text-zinc-500 hover:text-zinc-300 text-lg px-2"
+                  className="text-ink-soft hover:text-ink-mid text-lg px-2"
                 >
                   ✕
                 </button>
@@ -124,13 +124,13 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
             {/* Timeline */}
             <div className="flex-1 overflow-y-auto px-5 py-4">
               {loading && (
-                <div className="text-xs text-zinc-500 text-center py-8">
+                <div className="text-xs text-ink-soft text-center py-8">
                   Loading trace from all workspaces...
                 </div>
               )}
 
               {!loading && entries.length === 0 && (
-                <div className="text-xs text-zinc-500 text-center py-8">
+                <div className="text-xs text-ink-soft text-center py-8">
                   No activity found
                 </div>
               )}
@@ -160,28 +160,28 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
                                 : isSend
                                 ? "bg-cyan-500"
                                 : isReceive
-                                ? "bg-blue-500"
-                                : "bg-zinc-600"
+                                ? "bg-accent"
+                                : "bg-surface-card"
                             }`}
                           />
-                          <div className="w-px flex-1 bg-zinc-800 min-h-[8px]" />
+                          <div className="w-px flex-1 bg-surface-card min-h-[8px]" />
                         </div>
 
                         {/* Content */}
                         <div className="flex-1 pb-3 min-w-0">
                           <div className="flex items-center gap-2 flex-wrap">
-                            <span className="text-[9px] text-zinc-400 font-mono">
+                            <span className="text-[9px] text-ink-mid font-mono">
                               {time}
                             </span>
                             <span
                               className={`text-[9px] font-semibold px-1.5 py-0.5 rounded ${
                                 isError
-                                  ? "bg-red-950/50 text-red-400"
+                                  ? "bg-red-950/50 text-bad"
                                   : isSend
                                   ? "bg-cyan-950/50 text-cyan-400"
                                   : isReceive
-                                  ? "bg-blue-950/50 text-blue-400"
-                                  : "bg-zinc-800 text-zinc-400"
+                                  ? "bg-blue-950/50 text-accent"
+                                  : "bg-surface-card text-ink-mid"
                               }`}
                             >
                               {isSend
@@ -191,7 +191,7 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
                                 : entry.activity_type.toUpperCase()}
                             </span>
                             {entry.duration_ms != null && entry.duration_ms > 0 && (
-                              <span className="text-[9px] text-zinc-400">
+                              <span className="text-[9px] text-ink-mid">
                                 {entry.duration_ms > 1000
                                   ? `${Math.round(entry.duration_ms / 1000)}s`
                                   : `${entry.duration_ms}ms`}
@@ -207,19 +207,19 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
                                   <span className="text-cyan-400 font-medium">
                                     {sourceName || wsName}
                                   </span>
-                                  <span className="text-zinc-400"> → </span>
-                                  <span className="text-blue-400 font-medium">
+                                  <span className="text-ink-mid"> → </span>
+                                  <span className="text-accent font-medium">
                                     {targetName}
                                   </span>
                                 </span>
                               ) : (
                                 <span>
-                                  <span className="text-blue-400 font-medium">
+                                  <span className="text-accent font-medium">
                                     {targetName || wsName}
                                   </span>
                                   {sourceName && (
                                     <>
-                                      <span className="text-zinc-400">
+                                      <span className="text-ink-mid">
                                         {" "}← {" "}
                                       </span>
                                       <span className="text-cyan-400 font-medium">
@@ -234,40 +234,40 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
 
                           {/* Summary */}
                           {entry.summary && !isA2A(entry) && (
-                            <div className="text-[10px] text-zinc-400 mt-1">
-                              <span className="text-zinc-300 font-medium">{wsName}:</span>{" "}
+                            <div className="text-[10px] text-ink-mid mt-1">
+                              <span className="text-ink-mid font-medium">{wsName}:</span>{" "}
                               {entry.summary}
                             </div>
                           )}
 
                           {/* Error */}
                           {isError && entry.error_detail && (
-                            <div className="text-[10px] text-red-400/80 mt-1 truncate">
+                            <div className="text-[10px] text-bad/80 mt-1 truncate">
                               {entry.error_detail.slice(0, 200)}
                             </div>
                           )}
 
                           {/* Message content — show request and/or response */}
                           {requestText && (
-                            <div className="mt-1.5 bg-zinc-950/60 border border-zinc-800/50 rounded-lg px-3 py-2 max-h-32 overflow-y-auto">
-                              <div className="text-[8px] text-zinc-500 uppercase mb-1">
+                            <div className="mt-1.5 bg-surface/60 border border-line/50 rounded-lg px-3 py-2 max-h-32 overflow-y-auto">
+                              <div className="text-[8px] text-ink-soft uppercase mb-1">
                                 {isSend ? "Task" : "Request"}
                               </div>
-                              <div className="text-[10px] text-zinc-300 whitespace-pre-wrap break-words leading-relaxed">
+                              <div className="text-[10px] text-ink-mid whitespace-pre-wrap break-words leading-relaxed">
                                 {requestText.slice(0, 2000)}
                                 {requestText.length > 2000 && (
-                                  <span className="text-zinc-400"> ...({requestText.length} chars)</span>
+                                  <span className="text-ink-mid"> ...({requestText.length} chars)</span>
                                 )}
                               </div>
                             </div>
                           )}
                           {responseText && (
-                            <div className="mt-1 bg-zinc-950/60 border border-emerald-900/30 rounded-lg px-3 py-2 max-h-32 overflow-y-auto">
-                              <div className="text-[8px] text-emerald-500/60 uppercase mb-1">Response</div>
-                              <div className="text-[10px] text-zinc-300 whitespace-pre-wrap break-words leading-relaxed">
+                            <div className="mt-1 bg-surface/60 border border-emerald-900/30 rounded-lg px-3 py-2 max-h-32 overflow-y-auto">
+                              <div className="text-[8px] text-good/60 uppercase mb-1">Response</div>
+                              <div className="text-[10px] text-ink-mid whitespace-pre-wrap break-words leading-relaxed">
                                 {responseText.slice(0, 2000)}
                                 {responseText.length > 2000 && (
-                                  <span className="text-zinc-400"> ...({responseText.length} chars)</span>
+                                  <span className="text-ink-mid"> ...({responseText.length} chars)</span>
                                 )}
                               </div>
                             </div>
@@ -281,11 +281,11 @@ export function ConversationTraceModal({ open, workspaceId: _workspaceId, onClos
             </div>
 
             {/* Footer */}
-            <div className="px-5 py-3 border-t border-zinc-800 bg-zinc-950/50 flex justify-end">
+            <div className="px-5 py-3 border-t border-line bg-surface/50 flex justify-end">
               <Dialog.Close asChild>
                 <button
                   type="button"
-                  className="px-4 py-1.5 text-[12px] bg-zinc-800 hover:bg-zinc-700 text-zinc-300 rounded-lg transition-colors"
+                  className="px-4 py-1.5 text-[12px] bg-surface-card hover:bg-surface-card text-ink-mid rounded-lg transition-colors"
                 >
                   Close
                 </button>

canvas/src/components/CookieConsent.tsx

@@ -103,21 +103,21 @@ export function CookieConsent() {
       aria-modal="true"
       aria-labelledby="cookie-consent-title"
       aria-describedby="cookie-consent-body"
-      className="fixed bottom-0 left-0 right-0 z-[9999] border-t border-zinc-800 bg-zinc-950/95 backdrop-blur-sm p-4 shadow-[0_-4px_12px_rgba(0,0,0,0.4)]"
+      className="fixed bottom-0 left-0 right-0 z-[9999] border-t border-line bg-surface/95 backdrop-blur-sm p-4 shadow-[0_-4px_12px_rgba(0,0,0,0.4)]"
     >
       <div className="mx-auto flex max-w-5xl flex-col gap-3 md:flex-row md:items-center md:justify-between">
-        <div className="text-sm text-zinc-300">
-          <p id="cookie-consent-title" className="font-medium text-zinc-100">
+        <div className="text-sm text-ink-mid">
+          <p id="cookie-consent-title" className="font-medium text-ink">
             Cookies &amp; your privacy
           </p>
-          <p id="cookie-consent-body" className="mt-1 text-zinc-400">
+          <p id="cookie-consent-body" className="mt-1 text-ink-mid">
             We use strictly-necessary cookies for authentication and session
             continuity. Accept to also allow optional functional cookies that
             improve your canvas experience (layout preferences, recent
             workspaces). See our{" "}
             <a
               href="https://moleculesai.app/legal/privacy"
-              className="text-blue-400 underline hover:text-blue-300"
+              className="text-accent underline hover:text-accent"
               target="_blank"
               rel="noreferrer"
             >
@@ -130,14 +130,14 @@ export function CookieConsent() {
           <button
             type="button"
             onClick={() => decide("rejected")}
-            className="rounded border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm text-zinc-200 hover:bg-zinc-800"
+            className="rounded border border-line bg-surface-sunken px-4 py-2 text-sm text-ink hover:bg-surface-card"
           >
             Necessary only
           </button>
           <button
             type="button"
             onClick={() => decide("accepted")}
-            className="rounded border border-blue-600 bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-500"
+            className="rounded border border-accent bg-accent-strong px-4 py-2 text-sm font-medium text-white hover:bg-accent"
           >
             Accept all
           </button>

canvas/src/components/CreateWorkspaceDialog.tsx

@@ -12,6 +12,19 @@ interface WorkspaceOption {
   tier: number;
 }
 
+// Subset of the /templates row used here. Mirrors the shape ConfigTab
+// reads. `providers` is the per-template declarative list of supported
+// LLM providers — sourced from the template's
+// runtime_config.providers (config.yaml). When present, it filters
+// the modal's provider <select> so an operator can only pick a
+// provider the template actually supports.
+interface TemplateSpec {
+  id: string;
+  name?: string;
+  runtime?: string;
+  providers?: string[];
+}
+
 interface HermesProvider {
   id: string;
   label: string;
@@ -55,6 +68,13 @@ export function CreateWorkspaceButton() {
   const [creating, setCreating] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [workspaces, setWorkspaces] = useState<WorkspaceOption[]>([]);
+  // Templates fetched from /api/templates — drives the dynamic provider
+  // filter below. Same data source ConfigTab uses (PR #2454). When the
+  // selected template declares `runtime_config.providers` in its
+  // config.yaml, the modal surfaces only those providers in the
+  // <select>. Empty/missing list falls back to the full HERMES_PROVIDERS
+  // catalog so older templates without the field keep working.
+  const [templateSpecs, setTemplateSpecs] = useState<TemplateSpec[]>([]);
   // External-runtime path: skip docker provision, mint a workspace_auth_token,
   // and surface the connection snippet in a modal after create. When
   // isExternal is true the template / model / hermes-provider fields are
@@ -130,6 +150,52 @@ export function CreateWorkspaceButton() {
 
   const isHermes = template.trim().toLowerCase() === "hermes";
 
+  // Resolve the selected template's spec from the /templates response.
+  // The `template` input is free-text; templates can be matched by id,
+  // name, or runtime so any of those work. Lower-cased compare keeps
+  // "Hermes" / "hermes" / "HERMES" interchangeable.
+  const selectedTemplateSpec = useMemo<TemplateSpec | null>(() => {
+    const t = template.trim().toLowerCase();
+    if (!t) return null;
+    return (
+      templateSpecs.find(
+        (s) =>
+          (s.id || "").toLowerCase() === t ||
+          (s.name || "").toLowerCase() === t ||
+          (s.runtime || "").toLowerCase() === t,
+      ) ?? null
+    );
+  }, [template, templateSpecs]);
+
+  // Filter HERMES_PROVIDERS by what the template declares it supports.
+  // Empty/missing declared list → fall back to the full catalog so
+  // templates that haven't migrated to the explicit `providers:` field
+  // (and self-hosted setups without /templates) keep working unchanged.
+  const availableProviders = useMemo<HermesProvider[]>(() => {
+    const declared = selectedTemplateSpec?.providers;
+    if (!declared || declared.length === 0) return HERMES_PROVIDERS;
+    const allowed = new Set(declared.map((p) => p.toLowerCase()));
+    const filtered = HERMES_PROVIDERS.filter((p) => allowed.has(p.id.toLowerCase()));
+    // Defensive: if the template's declared list doesn't match anything
+    // in our static catalog (e.g. brand-new provider id we don't have
+    // metadata for yet), fall back to the full list rather than render
+    // an empty <select>. Better to over-show than to lock the user out.
+    return filtered.length > 0 ? filtered : HERMES_PROVIDERS;
+  }, [selectedTemplateSpec]);
+
+  // If the currently-selected provider is filtered out by a template
+  // change, snap back to the first available. Without this, the
+  // hermesProvider state could refer to a provider not in the dropdown
+  // — confusing UI + the API key field's envVar would be wrong.
+  useEffect(() => {
+    if (!isHermes) return;
+    if (availableProviders.length === 0) return;
+    if (!availableProviders.some((p) => p.id === hermesProvider)) {
+      setHermesProvider(availableProviders[0].id);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [availableProviders, isHermes]);
+
   // Auto-fill hermesModel with the provider's defaultModel whenever the
   // provider changes, but only if the user hasn't already typed their own
   // slug. Prevents the empty-model → "auto" → Anthropic-default 401 trap.
@@ -163,6 +229,10 @@ export function CreateWorkspaceButton() {
       .get<WorkspaceOption[]>("/workspaces")
       .then((ws) => setWorkspaces(ws))
       .catch(() => {});
+    api
+      .get<TemplateSpec[]>("/templates")
+      .then((rows) => setTemplateSpecs(Array.isArray(rows) ? rows : []))
+      .catch(() => { /* keep empty — HERMES_PROVIDERS fallback below */ });
     // defaultTier is stable for the session (derived from window.location),
     // safe to omit from deps.
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -240,7 +310,7 @@ export function CreateWorkspaceButton() {
   return (
     <Dialog.Root open={open} onOpenChange={setOpen}>
       <Dialog.Trigger asChild>
-        <button type="button" className="fixed bottom-6 right-6 z-40 px-5 py-2.5 bg-blue-600 hover:bg-blue-500 active:bg-blue-700 text-sm font-medium rounded-xl text-white shadow-lg shadow-blue-600/20 hover:shadow-xl hover:shadow-blue-500/30 transition-all duration-200 flex items-center gap-2">
+        <button type="button" className="fixed bottom-6 right-6 z-40 px-5 py-2.5 bg-accent-strong hover:bg-accent active:bg-accent-strong text-sm font-medium rounded-xl text-white shadow-lg shadow-blue-600/20 hover:shadow-xl hover:shadow-blue-500/30 transition-all duration-200 flex items-center gap-2">
           <svg
             width="14"
             height="14"
@@ -263,12 +333,12 @@ export function CreateWorkspaceButton() {
       <Dialog.Portal>
         <Dialog.Overlay className="fixed inset-0 z-50 bg-black/70 backdrop-blur-sm" />
         <Dialog.Content
-          className="fixed z-50 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 bg-zinc-900 border border-zinc-700/60 rounded-2xl shadow-2xl shadow-black/40 w-[400px] max-h-[90vh] overflow-y-auto p-6"
+          className="fixed z-50 left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 bg-surface-sunken border border-line/60 rounded-2xl shadow-2xl shadow-black/40 w-[400px] max-h-[90vh] overflow-y-auto p-6"
         >
-          <Dialog.Title className="text-base font-semibold text-zinc-100 mb-1">
+          <Dialog.Title className="text-base font-semibold text-ink mb-1">
             Create Workspace
           </Dialog.Title>
-          <p className="text-xs text-zinc-500 mb-5">
+          <p className="text-xs text-ink-soft mb-5">
             Add a new workspace node to the canvas
           </p>
 
@@ -297,7 +367,7 @@ export function CreateWorkspaceButton() {
             {/* External toggle — when on, this workspace is BYO-compute:
                 no template, no model, no hermes provider fields. Backend
                 returns a copyable connection snippet via the modal. */}
-            <label className="flex items-start gap-2 rounded-lg border border-zinc-800 p-3 cursor-pointer hover:border-zinc-700 transition-colors">
+            <label className="flex items-start gap-2 rounded-lg border border-line p-3 cursor-pointer hover:border-line transition-colors">
               <input
                 type="checkbox"
                 checked={isExternal}
@@ -305,8 +375,8 @@ export function CreateWorkspaceButton() {
                 className="mt-0.5"
               />
               <div className="text-xs">
-                <div className="text-zinc-200 font-medium">External agent (bring your own compute)</div>
-                <div className="text-zinc-500 mt-0.5">
+                <div className="text-ink font-medium">External agent (bring your own compute)</div>
+                <div className="text-ink-soft mt-0.5">
                   Skip the container. We&apos;ll return a workspace_id + auth token + ready-to-paste snippet so an agent running on your laptop / server / CI can register via A2A.
                 </div>
               </div>
@@ -328,7 +398,7 @@ export function CreateWorkspaceButton() {
                 aria-label="Workspace tier"
                 className={`grid gap-1.5 ${isSaaS ? "grid-cols-1" : "grid-cols-4"}`}
               >
-                <div className={`text-[11px] text-zinc-400 mb-1 ${isSaaS ? "" : "col-span-4"}`}>
+                <div className={`text-[11px] text-ink-mid mb-1 ${isSaaS ? "" : "col-span-4"}`}>
                   Tier{isSaaS ? " — dedicated VM" : ""}
                 </div>
                 {TIERS.map((t, idx) => (
@@ -343,8 +413,8 @@ export function CreateWorkspaceButton() {
                     onKeyDown={(e) => handleRadioKeyDown(e, idx)}
                     className={`py-2 rounded-lg text-center transition-colors ${
                       tier === t.value
-                        ? "bg-blue-600/20 border border-blue-500/50 text-blue-300"
-                        : "bg-zinc-800/60 border border-zinc-700/40 text-zinc-400 hover:text-zinc-300 hover:border-zinc-600"
+                        ? "bg-accent-strong/20 border border-accent/50 text-accent"
+                        : "bg-surface-card/60 border border-line/40 text-ink-mid hover:text-ink-mid hover:border-line"
                     }`}
                   >
                     <div className="text-xs font-mono font-semibold">
@@ -359,13 +429,13 @@ export function CreateWorkspaceButton() {
             </div>
 
             <div>
-              <label className="text-[11px] text-zinc-400 block mb-1">
+              <label className="text-[11px] text-ink-mid block mb-1">
                 Parent Workspace
               </label>
               <select
                 value={parentId}
                 onChange={(e) => setParentId(e.target.value)}
-                className="w-full bg-zinc-800/60 border border-zinc-700/50 rounded-lg px-3 py-2 text-sm text-zinc-100 focus:outline-none focus:border-blue-500/60 focus:ring-1 focus:ring-blue-500/20 transition-colors"
+                className="w-full bg-surface-card/60 border border-line/50 rounded-lg px-3 py-2 text-sm text-ink focus:outline-none focus:border-accent/60 focus:ring-1 focus:ring-accent/20 transition-colors"
               >
                 <option value="">None (root level)</option>
                 {workspaces.map((ws) => (
@@ -386,7 +456,7 @@ export function CreateWorkspaceButton() {
               <p className="text-[11px] font-semibold text-violet-400 uppercase tracking-wide">
                 Hermes Provider
               </p>
-              <p className="text-[11px] text-zinc-500 -mt-1">
+              <p className="text-[11px] text-ink-soft -mt-1">
                 Choose the AI provider and paste your API key. The key is
                 stored as an encrypted workspace secret.
               </p>
@@ -394,7 +464,7 @@ export function CreateWorkspaceButton() {
               <div>
                 <label
                   htmlFor="hermes-provider-select"
-                  className="text-[11px] text-zinc-400 block mb-1"
+                  className="text-[11px] text-ink-mid block mb-1"
                 >
                   Provider
                 </label>
@@ -403,9 +473,9 @@ export function CreateWorkspaceButton() {
                   value={hermesProvider}
                   onChange={(e) => setHermesProvider(e.target.value)}
                   aria-label="Hermes provider"
-                  className="w-full bg-zinc-800/60 border border-zinc-700/50 rounded-lg px-3 py-2 text-sm text-zinc-100 focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors"
+                  className="w-full bg-surface-card/60 border border-line/50 rounded-lg px-3 py-2 text-sm text-ink focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors"
                 >
-                  {HERMES_PROVIDERS.map((p) => (
+                  {availableProviders.map((p) => (
                     <option key={p.id} value={p.id}>
                       {p.label}
                     </option>
@@ -416,10 +486,10 @@ export function CreateWorkspaceButton() {
               <div>
                 <label
                   htmlFor="hermes-api-key-input"
-                  className="text-[11px] text-zinc-400 block mb-1"
+                  className="text-[11px] text-ink-mid block mb-1"
                 >
                   API Key{" "}
-                  <span aria-hidden="true" className="text-red-400">
+                  <span aria-hidden="true" className="text-bad">
                     *
                   </span>
                   <span className="sr-only"> (required)</span>
@@ -432,17 +502,17 @@ export function CreateWorkspaceButton() {
                   placeholder="sk-…"
                   aria-label="Hermes API key"
                   autoComplete="off"
-                  className="w-full bg-zinc-800/60 border border-zinc-700/50 rounded-lg px-3 py-2 text-sm text-zinc-100 placeholder-zinc-600 focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors font-mono"
+                  className="w-full bg-surface-card/60 border border-line/50 rounded-lg px-3 py-2 text-sm text-ink placeholder-zinc-600 focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors font-mono"
                 />
               </div>
 
               <div>
                 <label
                   htmlFor="hermes-model-input"
-                  className="text-[11px] text-zinc-400 block mb-1"
+                  className="text-[11px] text-ink-mid block mb-1"
                 >
                   Model{" "}
-                  <span aria-hidden="true" className="text-red-400">
+                  <span aria-hidden="true" className="text-bad">
                     *
                   </span>
                   <span className="sr-only"> (required)</span>
@@ -457,14 +527,14 @@ export function CreateWorkspaceButton() {
                   autoComplete="off"
                   spellCheck={false}
                   list="hermes-model-suggestions"
-                  className="w-full bg-zinc-800/60 border border-zinc-700/50 rounded-lg px-3 py-2 text-sm text-zinc-100 placeholder-zinc-600 focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors font-mono"
+                  className="w-full bg-surface-card/60 border border-line/50 rounded-lg px-3 py-2 text-sm text-ink placeholder-zinc-600 focus:outline-none focus:border-violet-500/60 focus:ring-1 focus:ring-violet-500/20 transition-colors font-mono"
                 />
                 <datalist id="hermes-model-suggestions">
                   {HERMES_PROVIDERS.find((p) => p.id === hermesProvider)?.models.map(
                     (m) => <option key={m} value={m} />,
                   )}
                 </datalist>
-                <p className="text-[10px] text-zinc-500 mt-1">
+                <p className="text-[10px] text-ink-soft mt-1">
                   Slug determines which provider hermes routes to at install time.
                 </p>
               </div>
@@ -474,7 +544,7 @@ export function CreateWorkspaceButton() {
           {error && (
             <div
               role="alert"
-              className="mt-4 px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-red-400"
+              className="mt-4 px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-bad"
             >
               {error}
             </div>
@@ -482,7 +552,7 @@ export function CreateWorkspaceButton() {
 
           <div className="flex justify-end gap-2.5 mt-6">
             <Dialog.Close asChild>
-              <button type="button" className="px-4 py-2 bg-zinc-800 hover:bg-zinc-700 text-sm rounded-lg text-zinc-300 transition-colors">
+              <button type="button" className="px-4 py-2 bg-surface-card hover:bg-surface-card text-sm rounded-lg text-ink-mid transition-colors">
                 Cancel
               </button>
             </Dialog.Close>
@@ -490,7 +560,7 @@ export function CreateWorkspaceButton() {
               type="button"
               onClick={handleCreate}
               disabled={creating}
-              className="px-5 py-2 bg-blue-600 hover:bg-blue-500 active:bg-blue-700 text-sm rounded-lg text-white disabled:opacity-50 transition-colors"
+              className="px-5 py-2 bg-accent-strong hover:bg-accent active:bg-accent-strong text-sm rounded-lg text-white disabled:opacity-50 transition-colors"
             >
               {creating ? "Creating..." : "Create"}
             </button>
@@ -534,11 +604,11 @@ function InputField({
 
   return (
     <div>
-      <label htmlFor={inputId} className="text-[11px] text-zinc-400 block mb-1">
+      <label htmlFor={inputId} className="text-[11px] text-ink-mid block mb-1">
         {label}{" "}
         {required && (
           <>
-            <span aria-hidden="true" className="text-red-400">
+            <span aria-hidden="true" className="text-bad">
               *
             </span>
             <span className="sr-only"> (required)</span>
@@ -553,10 +623,10 @@ function InputField({
         placeholder={placeholder}
         min={type === "number" ? "0" : undefined}
         step={type === "number" ? "0.01" : undefined}
-        className={`w-full bg-zinc-800/60 border border-zinc-700/50 rounded-lg px-3 py-2 text-sm text-zinc-100 placeholder-zinc-500 focus:outline-none focus:border-blue-500/60 focus:ring-1 focus:ring-blue-500/20 transition-colors ${mono ? "font-mono text-xs" : ""}`}
+        className={`w-full bg-surface-card/60 border border-line/50 rounded-lg px-3 py-2 text-sm text-ink placeholder-zinc-500 focus:outline-none focus:border-accent/60 focus:ring-1 focus:ring-accent/20 transition-colors ${mono ? "font-mono text-xs" : ""}`}
       />
       {helper && (
-        <p className="mt-1 text-xs text-zinc-500">{helper}</p>
+        <p className="mt-1 text-xs text-ink-soft">{helper}</p>
       )}
     </div>
   );

canvas/src/components/DeleteCascadeConfirmDialog.tsx

@@ -89,10 +89,10 @@ export function DeleteCascadeConfirmDialog({
         role="dialog"
         aria-modal="true"
         aria-labelledby="cascade-dialog-title"
-        className="relative bg-zinc-900 border border-red-800/60 rounded-xl shadow-2xl shadow-black/50 max-w-[420px] w-full mx-4 overflow-hidden"
+        className="relative bg-surface-sunken border border-red-800/60 rounded-xl shadow-2xl shadow-black/50 max-w-[420px] w-full mx-4 overflow-hidden"
       >
-        <div className="px-5 py-4 border-b border-zinc-800">
-          <h3 id="cascade-dialog-title" className="text-sm font-semibold text-red-400">
+        <div className="px-5 py-4 border-b border-line">
+          <h3 id="cascade-dialog-title" className="text-sm font-semibold text-bad">
             Delete Workspace and Children
           </h3>
         </div>
@@ -101,20 +101,20 @@ export function DeleteCascadeConfirmDialog({
           {/* Warning */}
           <div className="flex gap-3 mb-4">
             <div className="mt-0.5 shrink-0 w-8 h-8 rounded-full bg-red-900/30 flex items-center justify-center">
-              <svg width="16" height="16" viewBox="0 0 16 16" fill="none" className="text-red-400" aria-hidden="true">
+              <svg width="16" height="16" viewBox="0 0 16 16" fill="none" className="text-bad" aria-hidden="true">
                 <path d="M8 3L14 13H2L8 3Z" stroke="currentColor" strokeWidth="1.5" strokeLinejoin="round"/>
                 <path d="M8 7v3M8 11.5v.5" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round"/>
               </svg>
             </div>
-            <p className="text-[13px] text-zinc-300 leading-relaxed">
-              <span className="font-medium text-red-300">"{name}"</span> has{" "}
-              <strong className="text-zinc-100">{children.length}</strong> child{" "}
+            <p className="text-[13px] text-ink-mid leading-relaxed">
+              <span className="font-medium text-bad">"{name}"</span> has{" "}
+              <strong className="text-ink">{children.length}</strong> child{" "}
               {children.length === 1 ? "workspace" : "workspaces"}:
             </p>
           </div>
 
           {/* Child list */}
-          <ul className="space-y-1.5 mb-4 ml-4 list-disc list-inside text-[12px] text-zinc-400 max-h-32 overflow-y-auto">
+          <ul className="space-y-1.5 mb-4 ml-4 list-disc list-inside text-[12px] text-ink-mid max-h-32 overflow-y-auto">
             {children.map((c) => (
               <li key={c.id} className="truncate" title={c.name}>{c.name}</li>
             ))}
@@ -122,7 +122,7 @@ export function DeleteCascadeConfirmDialog({
 
           {/* Cascade warning */}
           <div className="rounded border border-red-900/40 bg-red-950/20 px-3 py-2.5 mb-4">
-            <p className="text-[12px] text-red-300/80 leading-relaxed">
+            <p className="text-[12px] text-bad/80 leading-relaxed">
               Deleting will cascade — <strong className="text-red-200">all child workspaces and their data will be permanently removed.</strong> This cannot be undone.
             </p>
           </div>
@@ -133,19 +133,19 @@ export function DeleteCascadeConfirmDialog({
               type="checkbox"
               checked={checked}
               onChange={(e) => onCheckedChange(e.target.checked)}
-              className="mt-0.5 w-4 h-4 rounded border-zinc-600 bg-zinc-800 text-red-500 focus:ring-red-500 focus:ring-offset-0 focus:ring-offset-zinc-900 cursor-pointer"
+              className="mt-0.5 w-4 h-4 rounded border-line bg-surface-card text-bad focus:ring-red-500 focus:ring-offset-0 focus:ring-offset-zinc-900 cursor-pointer"
             />
-            <span className="text-[12px] text-zinc-400 group-hover:text-zinc-300 leading-relaxed">
+            <span className="text-[12px] text-ink-mid group-hover:text-ink-mid leading-relaxed">
               I understand this will permanently delete all listed workspaces and their data
             </span>
           </label>
         </div>
 
-        <div className="flex items-center justify-end gap-2 px-5 py-3 border-t border-zinc-800 bg-zinc-950/50">
+        <div className="flex items-center justify-end gap-2 px-5 py-3 border-t border-line bg-surface/50">
           <button
             type="button"
             onClick={onCancel}
-            className="px-3.5 py-1.5 text-[13px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+            className="px-3.5 py-1.5 text-[13px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
           >
             Cancel
           </button>
@@ -156,7 +156,7 @@ export function DeleteCascadeConfirmDialog({
             className={`px-3.5 py-1.5 text-[13px] rounded-lg transition-colors
               ${checked
                 ? "bg-red-600 hover:bg-red-500 text-white cursor-pointer"
-                : "bg-red-900/30 text-red-500/40 cursor-not-allowed"
+                : "bg-red-900/30 text-bad/40 cursor-not-allowed"
               }`}
           >
             Delete All

canvas/src/components/EmptyState.tsx

@@ -75,11 +75,11 @@ export function EmptyState() {
 
   return (
     <div className="absolute inset-0 flex items-start justify-center pointer-events-none z-[1] overflow-y-auto py-8">
-      <div className="relative max-w-2xl w-full rounded-3xl border border-zinc-800/70 bg-zinc-950/80 backdrop-blur-xl px-8 py-8 text-center shadow-2xl shadow-black/40 pointer-events-auto mx-4">
+      <div className="relative max-w-2xl w-full rounded-3xl border border-line/70 bg-surface/80 backdrop-blur-xl px-8 py-8 text-center shadow-2xl shadow-black/40 pointer-events-auto mx-4">
         <div className="absolute inset-x-8 top-0 h-px bg-gradient-to-r from-transparent via-blue-500/50 to-transparent" />
 
         {/* Logo */}
-        <div className="w-16 h-16 mx-auto mb-4 rounded-2xl bg-gradient-to-br from-sky-500/20 via-blue-500/20 to-violet-500/20 border border-blue-500/20 flex items-center justify-center">
+        <div className="w-16 h-16 mx-auto mb-4 rounded-2xl bg-gradient-to-br from-sky-500/20 via-blue-500/20 to-violet-500/20 border border-accent/20 flex items-center justify-center">
           <svg width="28" height="28" viewBox="0 0 28 28" fill="none">
             <rect x="3" y="3" width="10" height="10" rx="2" stroke="#60a5fa" strokeWidth="1.5" opacity="0.65" />
             <rect x="15" y="3" width="10" height="10" rx="2" stroke="#60a5fa" strokeWidth="1.5" opacity="0.65" />
@@ -91,16 +91,16 @@ export function EmptyState() {
         <p className="text-[10px] font-semibold uppercase tracking-[0.28em] text-sky-400/80 mb-2">
           Welcome to Molecule AI
         </p>
-        <h2 className="text-xl font-semibold text-zinc-100 mb-1">
+        <h2 className="text-xl font-semibold text-ink mb-1">
           Deploy your first agent
         </h2>
-        <p className="text-sm text-zinc-400 mb-6 leading-relaxed">
+        <p className="text-sm text-ink-mid mb-6 leading-relaxed">
           Pick a template to get started instantly, or create a blank workspace.
         </p>
 
         {/* Template grid */}
         {loading ? (
-          <div className="flex items-center justify-center gap-2 text-xs text-zinc-400 py-4">
+          <div className="flex items-center justify-center gap-2 text-xs text-ink-mid py-4">
             <Spinner />
             Loading templates...
           </div>
@@ -114,21 +114,21 @@ export function EmptyState() {
                   key={t.id}
                   onClick={() => void deploy(t)}
                   disabled={anyDeploying}
-                  className="group rounded-xl border border-zinc-800/60 bg-zinc-900/50 px-3.5 py-3 hover:border-blue-500/40 hover:bg-zinc-900/80 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:border-zinc-800/60 disabled:hover:bg-zinc-900/50 text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70"
+                  className="group rounded-xl border border-line/60 bg-surface-sunken/50 px-3.5 py-3 hover:border-accent/40 hover:bg-surface-sunken/80 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:border-line/60 disabled:hover:bg-surface-sunken/50 text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70"
                 >
                   <div className="flex items-center gap-2 mb-1">
-                    <span className="text-sm font-medium text-zinc-200 group-hover:text-zinc-100 truncate">
+                    <span className="text-sm font-medium text-ink group-hover:text-ink truncate">
                       {deploying === t.id ? "Deploying..." : t.name}
                     </span>
                     <span className={`text-[8px] font-mono font-semibold px-1.5 py-0.5 rounded-md border ${tierColor}`}>
                       T{t.tier}
                     </span>
                   </div>
-                  <p className="text-[11px] text-zinc-500 line-clamp-2 leading-relaxed">
+                  <p className="text-[11px] text-ink-soft line-clamp-2 leading-relaxed">
                     {t.description || "No description"}
                   </p>
                   {t.skill_count > 0 && (
-                    <p className="text-[9px] text-zinc-500 mt-1.5">
+                    <p className="text-[9px] text-ink-soft mt-1.5">
                       {t.skill_count} skill{t.skill_count !== 1 ? "s" : ""}
                       {t.model ? ` · ${t.model}` : ""}
                     </p>
@@ -144,18 +144,18 @@ export function EmptyState() {
           type="button"
           onClick={createBlank}
           disabled={anyDeploying}
-          className="w-full rounded-xl border border-dashed border-zinc-700/60 bg-zinc-900/30 px-4 py-3 text-sm text-zinc-400 hover:text-zinc-200 hover:border-zinc-600 hover:bg-zinc-900/50 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:text-zinc-400 disabled:hover:border-zinc-700/60 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70"
+          className="w-full rounded-xl border border-dashed border-line/60 bg-surface-sunken/30 px-4 py-3 text-sm text-ink-mid hover:text-ink hover:border-line hover:bg-surface-sunken/50 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:text-ink-mid disabled:hover:border-line/60 focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70"
         >
           {blankCreating ? "Creating..." : "+ Create blank workspace"}
         </button>
 
         {/* Org templates — instantiate a whole team in one click */}
-        <div className="mt-4 pt-4 border-t border-zinc-800/50 text-left">
+        <div className="mt-4 pt-4 border-t border-line/50 text-left">
           <OrgTemplatesSection />
         </div>
 
         {displayError && (
-          <div role="alert" className="mt-3 px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-red-400">
+          <div role="alert" className="mt-3 px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-bad">
             {displayError}
           </div>
         )}
@@ -166,13 +166,13 @@ export function EmptyState() {
         {modal}
 
         {/* Tips */}
-        <div className="mt-5 pt-4 border-t border-zinc-800/50">
-          <div className="flex items-center justify-center gap-6 text-[10px] text-zinc-400">
+        <div className="mt-5 pt-4 border-t border-line/50">
+          <div className="flex items-center justify-center gap-6 text-[10px] text-ink-mid">
             <span>Drag to nest workspaces into teams</span>
-            <span className="text-zinc-700">|</span>
+            <span className="text-ink-soft">|</span>
             <span>Right-click for actions</span>
-            <span className="text-zinc-700">|</span>
-            <span>Press <kbd className="px-1 py-0.5 bg-zinc-800 rounded text-zinc-500 font-mono">&#8984;K</kbd> to search</span>
+            <span className="text-ink-soft">|</span>
+            <span>Press <kbd className="px-1 py-0.5 bg-surface-card rounded text-ink-soft font-mono">&#8984;K</kbd> to search</span>
           </div>
         </div>
       </div>

canvas/src/components/ErrorBoundary.tsx

@@ -51,8 +51,8 @@ export class ErrorBoundary extends React.Component<
   render() {
     if (this.state.hasError) {
       return (
-        <div className="fixed inset-0 flex items-center justify-center bg-zinc-950 z-50">
-          <div className="max-w-md rounded-2xl border border-red-500/30 bg-zinc-900/90 px-8 py-8 text-center shadow-2xl shadow-black/40">
+        <div className="fixed inset-0 flex items-center justify-center bg-surface z-50">
+          <div className="max-w-md rounded-2xl border border-red-500/30 bg-surface-sunken/90 px-8 py-8 text-center shadow-2xl shadow-black/40">
             <div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-red-500/10 border border-red-500/30">
               <svg
                 width="24"
@@ -70,20 +70,20 @@ export class ErrorBoundary extends React.Component<
                 <line x1="12" y1="16" x2="12.01" y2="16" />
               </svg>
             </div>
-            <h2 className="text-lg font-semibold text-zinc-100 mb-2">
+            <h2 className="text-lg font-semibold text-ink mb-2">
               Something went wrong
             </h2>
-            <p className="text-sm text-zinc-400 mb-1">
+            <p className="text-sm text-ink-mid mb-1">
               An unexpected error occurred while rendering the application.
             </p>
-            <p className="text-xs text-red-400/80 mb-6 font-mono break-all">
+            <p className="text-xs text-bad/80 mb-6 font-mono break-all">
               {this.state.error?.message ?? "Unknown error"}
             </p>
             <div className="flex items-center justify-center gap-3">
               <button
                 type="button"
                 onClick={this.handleReload}
-                className="rounded-lg bg-blue-600 hover:bg-blue-500 px-5 py-2 text-sm font-medium text-white transition-colors"
+                className="rounded-lg bg-accent-strong hover:bg-accent px-5 py-2 text-sm font-medium text-white transition-colors"
               >
                 Reload
               </button>
@@ -93,7 +93,7 @@ export class ErrorBoundary extends React.Component<
                   e.preventDefault();
                   this.handleReport();
                 }}
-                className="rounded-lg border border-zinc-700 hover:border-zinc-600 px-5 py-2 text-sm font-medium text-zinc-300 hover:text-zinc-100 transition-colors"
+                className="rounded-lg border border-line hover:border-line px-5 py-2 text-sm font-medium text-ink-mid hover:text-ink transition-colors"
               >
                 Report
               </a>

canvas/src/components/ExternalConnectModal.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 // ExternalConnectModal — shown once after creating a runtime="external"
 // workspace. Surfaces the workspace_auth_token + ready-to-paste snippets
 // so the operator can hand them to whoever runs their off-host agent
@@ -24,6 +26,20 @@ export interface ExternalConnectionInfo {
   heartbeat_endpoint: string;
   curl_register_template: string;
   python_snippet: string;
+  // Claude Code channel plugin snippet — for operators whose external
+  // agent IS a Claude Code session. Polling-based; no tunnel required.
+  // Optional in the type for backward compat with platforms that
+  // haven't shipped molecule-core PR #2304 yet (older response payload
+  // omits the field; tab is hidden if empty).
+  claude_code_channel_snippet?: string;
+  // Universal MCP snippet — runtime-agnostic outbound tool path via
+  // the `molecule-mcp` console script in the
+  // molecule-ai-workspace-runtime PyPI wheel. Works with any MCP-aware
+  // agent runtime (Claude Code, hermes, codex, third-party). Outbound-
+  // only: pair with claude_code_channel or python tabs for heartbeat
+  // + inbound. Optional for backward compat with platforms that
+  // haven't shipped PR #2413 yet.
+  universal_mcp_snippet?: string;
 }
 
 interface Props {
@@ -31,10 +47,14 @@ interface Props {
   onClose: () => void;
 }
 
-type Tab = "python" | "curl" | "fields";
+type Tab = "python" | "curl" | "claude" | "mcp" | "fields";
 
 export function ExternalConnectModal({ info, onClose }: Props) {
-  const [tab, setTab] = useState<Tab>("python");
+  // Default to Claude Code when the platform offers it — that's the
+  // newest + simplest path (no tunnel needed). Falls back to Python
+  // for older platform builds that don't ship the snippet.
+  const initialTab: Tab = info?.claude_code_channel_snippet ? "claude" : "python";
+  const [tab, setTab] = useState<Tab>(initialTab);
   const [copiedKey, setCopiedKey] = useState<string | null>(null);
 
   const copy = useCallback(async (value: string, key: string) => {
@@ -70,18 +90,36 @@ export function ExternalConnectModal({ info, onClose }: Props) {
     'WORKSPACE_AUTH_TOKEN="<paste from create response>"',
     `WORKSPACE_AUTH_TOKEN="${info.auth_token}"`,
   );
+  // The channel snippet asks the operator to paste the auth_token into
+  // the .env file's MOLECULE_WORKSPACE_TOKENS field. Stamp it server-side
+  // here so the copy-paste-block is truly ready-to-run.
+  const filledChannel = info.claude_code_channel_snippet?.replace(
+    'MOLECULE_WORKSPACE_TOKENS=<paste auth_token from create response>',
+    `MOLECULE_WORKSPACE_TOKENS=${info.auth_token}`,
+  );
+  // Universal MCP snippet uses MOLECULE_WORKSPACE_TOKEN as the env-var
+  // name passed through to molecule-mcp via `claude mcp add ... -- env
+  // MOLECULE_WORKSPACE_TOKEN=...`. The placeholder must match the
+  // template's literal — pre-2026-04-30 polish this looked for
+  // WORKSPACE_AUTH_TOKEN (carryover from the curl tab), which silently
+  // skipped the substitution and left "<paste from create response>"
+  // visible in the operator's clipboard.
+  const filledUniversalMcp = info.universal_mcp_snippet?.replace(
+    'MOLECULE_WORKSPACE_TOKEN="<paste from create response>"',
+    `MOLECULE_WORKSPACE_TOKEN="${info.auth_token}"`,
+  );
 
   return (
     <Dialog.Root open onOpenChange={(o) => !o && onClose()}>
       <Dialog.Portal>
         <Dialog.Overlay className="fixed inset-0 bg-black/60 z-50" />
-        <Dialog.Content className="fixed left-1/2 top-1/2 z-50 w-[min(720px,92vw)] -translate-x-1/2 -translate-y-1/2 rounded-xl bg-zinc-900 border border-zinc-700 p-6 shadow-2xl">
-          <Dialog.Title className="text-lg font-semibold text-white">
+        <Dialog.Content className="fixed left-1/2 top-1/2 z-50 w-[min(720px,92vw)] -translate-x-1/2 -translate-y-1/2 rounded-xl bg-surface-sunken border border-line p-6 shadow-2xl">
+          <Dialog.Title className="text-lg font-semibold text-ink">
             Connect your external agent
           </Dialog.Title>
-          <Dialog.Description className="mt-1 text-sm text-zinc-400">
+          <Dialog.Description className="mt-1 text-sm text-ink-mid">
             Paste the snippet below into your agent&apos;s deployment. The
-            auth token is shown <span className="text-amber-400">only once</span>
+            auth token is shown <span className="text-warm">only once</span>
             {" "}— save it somewhere safe before closing this dialog.
           </Dialog.Description>
 
@@ -89,9 +127,21 @@ export function ExternalConnectModal({ info, onClose }: Props) {
           <div
             role="tablist"
             aria-label="Connection snippet format"
-            className="mt-4 flex gap-1 border-b border-zinc-800"
+            className="mt-4 flex gap-1 border-b border-line"
           >
-            {(["python", "curl", "fields"] as Tab[]).map((t) => (
+            {(() => {
+              // Build the tab order dynamically. Claude Code first
+              // (when offered) since it's the simplest setup; Python
+              // SDK second (full register+heartbeat+inbound); Universal
+              // MCP third (any MCP-aware runtime, outbound-only); curl
+              // for one-shot register; Fields for raw values.
+              const tabs: Tab[] = [];
+              if (filledChannel) tabs.push("claude");
+              tabs.push("python");
+              if (filledUniversalMcp) tabs.push("mcp");
+              tabs.push("curl", "fields");
+              return tabs;
+            })().map((t) => (
               <button
                 key={t}
                 type="button"
@@ -100,21 +150,38 @@ export function ExternalConnectModal({ info, onClose }: Props) {
                 onClick={() => setTab(t)}
                 className={`px-3 py-2 text-sm border-b-2 -mb-px transition-colors ${
                   tab === t
-                    ? "border-blue-500 text-white"
-                    : "border-transparent text-zinc-500 hover:text-zinc-300"
+                    ? "border-accent text-ink"
+                    : "border-transparent text-ink-soft hover:text-ink-mid"
                 }`}
               >
-                {t === "python" ? "Python SDK" : t === "curl" ? "curl" : "Fields"}
+                {t === "claude"
+                  ? "Claude Code"
+                  : t === "python"
+                  ? "Python SDK"
+                  : t === "mcp"
+                  ? "Universal MCP"
+                  : t === "curl"
+                  ? "curl"
+                  : "Fields"}
               </button>
             ))}
           </div>
 
           {/* Snippet area */}
           <div className="mt-3">
+            {tab === "claude" && filledChannel && (
+              <SnippetBlock
+                value={filledChannel}
+                label="Claude Code channel — polls workspace's A2A; no tunnel needed"
+                copyKey="claude"
+                copied={copiedKey === "claude"}
+                onCopy={() => copy(filledChannel, "claude")}
+              />
+            )}
             {tab === "python" && (
               <SnippetBlock
                 value={filledPython}
-                label="Python (recommended — includes heartbeat loop)"
+                label="Python SDK — includes heartbeat loop (push-mode, needs public URL)"
                 copyKey="python"
                 copied={copiedKey === "python"}
                 onCopy={() => copy(filledPython, "python")}
@@ -129,6 +196,15 @@ export function ExternalConnectModal({ info, onClose }: Props) {
                 onCopy={() => copy(filledCurl, "curl")}
               />
             )}
+            {tab === "mcp" && filledUniversalMcp && (
+              <SnippetBlock
+                value={filledUniversalMcp}
+                label="Universal MCP — standalone register + heartbeat + tools for any MCP-aware runtime (Claude Code, hermes, codex). Pair with Python or Claude Code tab if you need inbound A2A delivery."
+                copyKey="mcp"
+                copied={copiedKey === "mcp"}
+                onCopy={() => copy(filledUniversalMcp, "mcp")}
+              />
+            )}
             {tab === "fields" && (
               <div className="space-y-2">
                 <Field label="workspace_id" value={info.workspace_id} onCopy={() => copy(info.workspace_id, "wsid")} copied={copiedKey === "wsid"} />
@@ -150,7 +226,7 @@ export function ExternalConnectModal({ info, onClose }: Props) {
             <button
               type="button"
               onClick={onClose}
-              className="px-4 py-2 text-sm rounded-lg bg-zinc-800 hover:bg-zinc-700 text-zinc-200"
+              className="px-4 py-2 text-sm rounded-lg bg-surface-card hover:bg-surface-card text-ink"
             >
               I&apos;ve saved it — close
             </button>
@@ -176,16 +252,16 @@ function SnippetBlock({
   return (
     <div>
       <div className="flex items-center justify-between pb-1">
-        <span className="text-xs text-zinc-500">{label}</span>
+        <span className="text-xs text-ink-soft">{label}</span>
         <button
           type="button"
           onClick={onCopy}
-          className="text-xs px-2 py-1 rounded bg-blue-600/80 hover:bg-blue-500 text-white"
+          className="text-xs px-2 py-1 rounded bg-accent-strong/80 hover:bg-accent text-white"
         >
           {copied ? "Copied!" : "Copy"}
         </button>
       </div>
-      <pre className="text-xs bg-zinc-950 border border-zinc-800 rounded-lg p-3 max-h-80 overflow-auto whitespace-pre-wrap break-all font-mono text-zinc-200">
+      <pre className="text-xs bg-surface border border-line rounded-lg p-3 max-h-80 overflow-auto whitespace-pre-wrap break-all font-mono text-ink">
         {value}
       </pre>
     </div>
@@ -207,9 +283,9 @@ function Field({
 }) {
   return (
     <div className="flex items-center gap-2">
-      <span className="text-xs text-zinc-500 w-36 shrink-0">{label}</span>
+      <span className="text-xs text-ink-soft w-36 shrink-0">{label}</span>
       <code
-        className={`flex-1 text-xs bg-zinc-950 border border-zinc-800 rounded px-2 py-1 text-zinc-200 break-all ${mono ? "font-mono" : ""}`}
+        className={`flex-1 text-xs bg-surface border border-line rounded px-2 py-1 text-ink break-all ${mono ? "font-mono" : ""}`}
       >
         {value || "(missing)"}
       </code>
@@ -217,7 +293,7 @@ function Field({
         type="button"
         onClick={onCopy}
         disabled={!value}
-        className="text-xs px-2 py-1 rounded bg-zinc-800 hover:bg-zinc-700 text-zinc-200 disabled:opacity-40"
+        className="text-xs px-2 py-1 rounded bg-surface-card hover:bg-surface-card text-ink disabled:opacity-40"
       >
         {copied ? "Copied!" : "Copy"}
       </button>

canvas/src/components/Legend.tsx

@@ -65,7 +65,7 @@ export function Legend() {
         onClick={openLegend}
         aria-label="Show legend"
         title="Show legend"
-        className={`fixed bottom-6 ${leftClass} z-30 flex items-center gap-1.5 rounded-full bg-zinc-900/95 border border-zinc-700/50 px-3 py-1.5 text-[11px] font-semibold text-zinc-400 uppercase tracking-wider shadow-xl shadow-black/30 backdrop-blur-sm hover:text-zinc-200 hover:border-zinc-600 transition-[left,colors] duration-200`}
+        className={`fixed bottom-6 ${leftClass} z-30 flex items-center gap-1.5 rounded-full bg-surface-sunken/95 border border-line/50 px-3 py-1.5 text-[11px] font-semibold text-ink-mid uppercase tracking-wider shadow-xl shadow-black/30 backdrop-blur-sm hover:text-ink hover:border-line transition-[left,colors] duration-200`}
       >
         <span aria-hidden="true" className="text-[10px]">ⓘ</span>
         Legend
@@ -74,15 +74,15 @@ export function Legend() {
   }
 
   return (
-    <div className={`fixed bottom-6 ${leftClass} z-30 bg-zinc-900/95 border border-zinc-700/50 rounded-xl px-4 py-3 shadow-xl shadow-black/30 backdrop-blur-sm max-w-[280px] transition-[left] duration-200`}>
+    <div className={`fixed bottom-6 ${leftClass} z-30 bg-surface-sunken/95 border border-line/50 rounded-xl px-4 py-3 shadow-xl shadow-black/30 backdrop-blur-sm max-w-[280px] transition-[left] duration-200`}>
       <div className="flex items-start justify-between mb-2">
-        <div className="text-[11px] font-semibold text-zinc-400 uppercase tracking-wider">Legend</div>
+        <div className="text-[11px] font-semibold text-ink-mid uppercase tracking-wider">Legend</div>
         <button
           type="button"
           onClick={closeLegend}
           aria-label="Hide legend"
           title="Hide legend"
-          className="-mt-0.5 -mr-1 px-1.5 text-[14px] leading-none text-zinc-500 hover:text-zinc-200 transition-colors"
+          className="-mt-0.5 -mr-1 px-1.5 text-[14px] leading-none text-ink-soft hover:text-ink transition-colors"
         >
           ×
         </button>
@@ -90,7 +90,7 @@ export function Legend() {
 
       {/* Status */}
       <div className="mb-2">
-        <div className="text-[11px] text-zinc-500 font-medium mb-1">Status</div>
+        <div className="text-[11px] text-ink-soft font-medium mb-1">Status</div>
         <div className="flex flex-wrap gap-x-3 gap-y-1">
           {LEGEND_STATUSES.map((s) => (
             <StatusItem key={s} color={STATUS_CONFIG[s].dot} label={STATUS_CONFIG[s].label} />
@@ -100,22 +100,22 @@ export function Legend() {
 
       {/* Tiers */}
       <div className="mb-2">
-        <div className="text-[11px] text-zinc-500 font-medium mb-1">Tier</div>
+        <div className="text-[11px] text-ink-soft font-medium mb-1">Tier</div>
         <div className="flex flex-wrap gap-x-3 gap-y-1">
           <TierItem tier={1} label="Sandboxed" color="text-sky-300 bg-sky-950/40 border-sky-700/30" />
           <TierItem tier={2} label="Standard" color="text-violet-300 bg-violet-950/40 border-violet-700/30" />
-          <TierItem tier={3} label="Full Access" color="text-amber-300 bg-amber-950/40 border-amber-700/30" />
+          <TierItem tier={3} label="Full Access" color="text-warm bg-amber-950/40 border-amber-700/30" />
         </div>
       </div>
 
       {/* Communication */}
       <div>
-        <div className="text-[11px] text-zinc-500 font-medium mb-1">Communication</div>
+        <div className="text-[11px] text-ink-soft font-medium mb-1">Communication</div>
         <div className="flex flex-wrap gap-x-3 gap-y-1">
           <CommItem icon="↗" color="text-cyan-400" label="A2A Out" />
-          <CommItem icon="↙" color="text-blue-400" label="A2A In" />
-          <CommItem icon="◆" color="text-amber-400" label="Task" />
-          <CommItem icon="!" color="text-red-400" label="Error" />
+          <CommItem icon="↙" color="text-accent" label="A2A In" />
+          <CommItem icon="◆" color="text-warm" label="Task" />
+          <CommItem icon="!" color="text-bad" label="Error" />
         </div>
       </div>
     </div>
@@ -126,7 +126,7 @@ function StatusItem({ color, label }: { color: string; label: string }) {
   return (
     <div className="flex items-center gap-1">
       <div className={`w-1.5 h-1.5 rounded-full ${color}`} />
-      <span className="text-[11px] text-zinc-400">{label}</span>
+      <span className="text-[11px] text-ink-mid">{label}</span>
     </div>
   );
 }
@@ -135,7 +135,7 @@ function TierItem({ tier, label, color }: { tier: number; label: string; color:
   return (
     <div className="flex items-center gap-1">
       <span className={`text-[11px] font-mono px-1 py-0.5 rounded border ${color}`}>T{tier}</span>
-      <span className="text-[11px] text-zinc-400">{label}</span>
+      <span className="text-[11px] text-ink-mid">{label}</span>
     </div>
   );
 }
@@ -144,7 +144,7 @@ function CommItem({ icon, color, label }: { icon: string; color: string; label:
   return (
     <div className="flex items-center gap-1">
       <span className={`text-[11px] ${color}`}>{icon}</span>
-      <span className="text-[11px] text-zinc-400">{label}</span>
+      <span className="text-[11px] text-ink-mid">{label}</span>
     </div>
   );
 }

canvas/src/components/MemoryInspectorPanel.tsx

@@ -54,13 +54,13 @@ function MemorySkeletonRows() {
       {Array.from({ length: 3 }).map((_, i) => (
         <div
           key={i}
-          className="rounded-lg border border-zinc-800/60 bg-zinc-900/50 px-3 py-3 animate-pulse"
+          className="rounded-lg border border-line/60 bg-surface-sunken/50 px-3 py-3 animate-pulse"
         >
           <div className="flex items-center gap-2">
-            <div className="h-2 rounded bg-zinc-700/50 flex-1" />
-            <div className="h-2 rounded bg-zinc-700/50 w-8" />
-            <div className="h-2 rounded bg-zinc-700/50 w-6" />
-            <div className="h-2 rounded bg-zinc-700/50 w-10" />
+            <div className="h-2 rounded bg-surface-card/50 flex-1" />
+            <div className="h-2 rounded bg-surface-card/50 w-8" />
+            <div className="h-2 rounded bg-surface-card/50 w-6" />
+            <div className="h-2 rounded bg-surface-card/50 w-10" />
           </div>
         </div>
       ))}
@@ -148,7 +148,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
   if (loading && entries.length === 0 && !error) {
     return (
       <div className="flex items-center justify-center h-32">
-        <span className="text-xs text-zinc-500">Loading memories…</span>
+        <span className="text-xs text-ink-soft">Loading memories…</span>
       </div>
     );
   }
@@ -156,7 +156,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
   return (
     <div className="flex flex-col h-full">
       {/* Scope tabs */}
-      <div className="px-4 pt-3 pb-2 border-b border-zinc-800/40 shrink-0">
+      <div className="px-4 pt-3 pb-2 border-b border-line/40 shrink-0">
         <div className="flex items-center gap-1">
           {SCOPES.map((scope) => (
             <button
@@ -167,8 +167,8 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
               className={[
                 "px-3 py-1 text-[11px] rounded transition-colors",
                 activeScope === scope
-                  ? "bg-blue-600 text-white"
-                  : "bg-zinc-800 text-zinc-400 hover:bg-zinc-700 hover:text-zinc-200",
+                  ? "bg-accent-strong text-white"
+                  : "bg-surface-card text-ink-mid hover:bg-surface-card hover:text-ink",
               ].join(" ")}
             >
               {scope}
@@ -178,7 +178,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
       </div>
 
       {/* Search bar + namespace filter */}
-      <div className="px-4 pt-3 pb-2 border-b border-zinc-800/40 shrink-0 space-y-2">
+      <div className="px-4 pt-3 pb-2 border-b border-line/40 shrink-0 space-y-2">
         <div className="relative flex items-center">
           {/* Magnifying glass icon */}
           <svg
@@ -186,7 +186,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
             height="12"
             viewBox="0 0 16 16"
             fill="none"
-            className="absolute left-2.5 text-zinc-500 pointer-events-none shrink-0"
+            className="absolute left-2.5 text-ink-soft pointer-events-none shrink-0"
             aria-hidden="true"
           >
             <circle cx="7" cy="7" r="4.5" stroke="currentColor" strokeWidth="1.5" />
@@ -198,7 +198,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
             onChange={(e) => setSearchQuery(e.target.value)}
             placeholder="Semantic search…"
             aria-label="Search memories"
-            className="w-full bg-zinc-900 border border-zinc-700/60 focus:border-blue-500/60 rounded-lg pl-8 pr-7 py-1.5 text-[11px] text-zinc-200 placeholder-zinc-600 focus:outline-none transition-colors"
+            className="w-full bg-surface-sunken border border-line/60 focus:border-accent/60 rounded-lg pl-8 pr-7 py-1.5 text-[11px] text-ink placeholder-zinc-600 focus:outline-none transition-colors"
           />
           {searchQuery && (
             <button
@@ -208,7 +208,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
                 setDebouncedQuery("");
               }}
               aria-label="Clear search"
-              className="absolute right-2 text-zinc-500 hover:text-zinc-200 transition-colors text-sm leading-none"
+              className="absolute right-2 text-ink-soft hover:text-ink transition-colors text-sm leading-none"
             >
               ×
             </button>
@@ -217,7 +217,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
 
         {/* Namespace filter */}
         <div className="flex items-center gap-2">
-          <label htmlFor="namespace-filter" className="text-[10px] text-zinc-500 shrink-0">
+          <label htmlFor="namespace-filter" className="text-[10px] text-ink-soft shrink-0">
             Namespace:
           </label>
           <input
@@ -227,14 +227,14 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
             onChange={(e) => setActiveNamespace(e.target.value)}
             placeholder="all namespaces"
             aria-label="Filter by namespace"
-            className="flex-1 bg-zinc-900 border border-zinc-700/60 focus:border-blue-500/60 rounded px-2 py-1 text-[11px] text-zinc-200 placeholder-zinc-600 focus:outline-none transition-colors min-w-0"
+            className="flex-1 bg-surface-sunken border border-line/60 focus:border-accent/60 rounded px-2 py-1 text-[11px] text-ink placeholder-zinc-600 focus:outline-none transition-colors min-w-0"
           />
         </div>
       </div>
 
       {/* Toolbar */}
-      <div className="px-4 py-2.5 border-b border-zinc-800/40 flex items-center justify-between shrink-0">
-        <span className="text-[11px] text-zinc-500">
+      <div className="px-4 py-2.5 border-b border-line/40 flex items-center justify-between shrink-0">
+        <span className="text-[11px] text-ink-soft">
           {debouncedQuery
             ? `${entries.length} result${entries.length !== 1 ? "s" : ""}`
             : entries.length === 1
@@ -244,7 +244,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
         <button
           type="button"
           onClick={loadEntries}
-          className="px-2 py-1 text-[11px] bg-zinc-800 hover:bg-zinc-700 text-zinc-300 rounded transition-colors"
+          className="px-2 py-1 text-[11px] bg-surface-card hover:bg-surface-card text-ink-mid rounded transition-colors"
           aria-label="Refresh memories"
         >
           ↻ Refresh
@@ -256,7 +256,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
         <div
           role="alert"
           aria-live="assertive"
-          className="mx-4 mt-3 px-3 py-2 bg-red-950/30 border border-red-800/40 rounded text-xs text-red-400 shrink-0"
+          className="mx-4 mt-3 px-3 py-2 bg-red-950/30 border border-red-800/40 rounded text-xs text-bad shrink-0"
         >
           {error}
         </div>
@@ -269,11 +269,11 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
         ) : entries.length === 0 ? (
           debouncedQuery ? (
             <div className="flex flex-col items-center justify-center py-16 gap-3 text-center">
-              <span className="text-4xl text-zinc-700" aria-hidden="true">◇</span>
-              <p className="text-sm font-medium text-zinc-400">
+              <span className="text-4xl text-ink-soft" aria-hidden="true">◇</span>
+              <p className="text-sm font-medium text-ink-mid">
                 No memories match your search
               </p>
-              <p className="text-[11px] text-zinc-600 max-w-[200px] leading-relaxed">
+              <p className="text-[11px] text-ink-soft max-w-[200px] leading-relaxed">
                 Try a different query or{" "}
                 <button
                   type="button"
@@ -281,7 +281,7 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
                     setSearchQuery("");
                     setDebouncedQuery("");
                   }}
-                  className="text-blue-500 hover:text-blue-400 underline transition-colors"
+                  className="text-accent hover:text-accent underline transition-colors"
                 >
                   clear the search
                 </button>
@@ -290,9 +290,9 @@ export function MemoryInspectorPanel({ workspaceId }: Props) {
             </div>
           ) : (
             <div className="flex flex-col items-center justify-center py-16 gap-3 text-center">
-              <span className="text-4xl text-zinc-700" aria-hidden="true">◇</span>
-              <p className="text-sm font-medium text-zinc-400">No {activeScope} memories</p>
-              <p className="text-[11px] text-zinc-600 max-w-[200px] leading-relaxed">
+              <span className="text-4xl text-ink-soft" aria-hidden="true">◇</span>
+              <p className="text-sm font-medium text-ink-mid">No {activeScope} memories</p>
+              <p className="text-[11px] text-ink-soft max-w-[200px] leading-relaxed">
                 {activeScope === "LOCAL"
                   ? "This workspace has not written any local memories yet."
                   : activeScope === "TEAM"
@@ -340,11 +340,11 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
   const bodyId = `mem-body-${sanitizeId(entry.id)}`;
 
   return (
-    <div className="rounded-lg border border-zinc-800/60 bg-zinc-900/50 overflow-hidden">
+    <div className="rounded-lg border border-line/60 bg-surface-sunken/50 overflow-hidden">
       {/* Header row */}
       <button
         type="button"
-        className="w-full flex items-center gap-2 px-3 py-2.5 text-left hover:bg-zinc-800/30 transition-colors"
+        className="w-full flex items-center gap-2 px-3 py-2.5 text-left hover:bg-surface-card/30 transition-colors"
         onClick={() => setExpanded((prev) => !prev)}
         aria-expanded={expanded}
         aria-controls={bodyId}
@@ -354,9 +354,9 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
           className={[
             "text-[9px] shrink-0 font-mono px-1 py-0.5 rounded",
             entry.scope === "LOCAL"
-              ? "bg-zinc-700 text-zinc-400"
+              ? "bg-surface-card text-ink-mid"
               : entry.scope === "TEAM"
-              ? "bg-blue-950 text-blue-400"
+              ? "bg-blue-950 text-accent"
               : "bg-violet-950 text-violet-400",
           ].join(" ")}
           title={`Scope: ${entry.scope}`}
@@ -365,12 +365,12 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
         </span>
 
         {/* Namespace tag */}
-        <span className="text-[9px] shrink-0 font-mono text-zinc-500 truncate max-w-[80px]" title={entry.namespace}>
+        <span className="text-[9px] shrink-0 font-mono text-ink-soft truncate max-w-[80px]" title={entry.namespace}>
           {entry.namespace}
         </span>
 
         {/* Content preview */}
-        <span className="flex-1 min-w-0 text-[10px] font-mono text-zinc-300 truncate text-left">
+        <span className="flex-1 min-w-0 text-[10px] font-mono text-ink-mid truncate text-left">
           {entry.content.length > 60 ? entry.content.slice(0, 60) + "…" : entry.content}
         </span>
 
@@ -380,8 +380,8 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
             className={[
               "text-[9px] shrink-0 font-mono tabular-nums",
               entry.similarity_score >= 0.8
-                ? "text-blue-500"
-                : "text-zinc-400",
+                ? "text-accent"
+                : "text-ink-mid",
             ].join(" ")}
             title={`Similarity: ${(entry.similarity_score * 100).toFixed(1)}%`}
             data-testid="similarity-badge"
@@ -390,10 +390,10 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
           </span>
         )}
 
-        <span className="text-[9px] text-zinc-600 shrink-0">
+        <span className="text-[9px] text-ink-soft shrink-0">
           {formatRelativeTime(entry.created_at)}
         </span>
-        <span className="text-[9px] text-zinc-500 shrink-0" aria-hidden="true">
+        <span className="text-[9px] text-ink-soft shrink-0" aria-hidden="true">
           {expanded ? "▼" : "▶"}
         </span>
       </button>
@@ -404,13 +404,13 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
           id={bodyId}
           role="region"
           aria-label="Memory details"
-          className="border-t border-zinc-800/50 px-3 pb-3 pt-2 space-y-2"
+          className="border-t border-line/50 px-3 pb-3 pt-2 space-y-2"
         >
-          <pre className="text-[10px] font-mono text-zinc-300 bg-zinc-950 rounded p-2 overflow-x-auto max-h-48 whitespace-pre-wrap break-all">
+          <pre className="text-[10px] font-mono text-ink-mid bg-surface rounded p-2 overflow-x-auto max-h-48 whitespace-pre-wrap break-all">
             {entry.content}
           </pre>
           <div className="flex items-center justify-between gap-2">
-            <span className="text-[9px] text-zinc-600">
+            <span className="text-[9px] text-ink-soft">
               Created: {new Date(entry.created_at).toLocaleString()}
             </span>
             <button
@@ -420,7 +420,7 @@ function MemoryEntryRow({ entry, onDelete }: MemoryEntryRowProps) {
                 onDelete();
               }}
               aria-label="Delete memory"
-              className="text-[10px] px-2 py-0.5 bg-red-950/40 hover:bg-red-900/50 border border-red-900/30 rounded text-red-400 transition-colors shrink-0"
+              className="text-[10px] px-2 py-0.5 bg-red-950/40 hover:bg-red-900/50 border border-red-900/30 rounded text-bad transition-colors shrink-0"
             >
               Delete
             </button>

canvas/src/components/MissingKeysModal.tsx

@@ -3,7 +3,17 @@
 import { useState, useEffect, useCallback, useRef, useMemo } from "react";
 import { createPortal } from "react-dom";
 import { api } from "@/lib/api";
-import { getKeyLabel, type ProviderChoice } from "@/lib/deploy-preflight";
+import {
+  getKeyLabel,
+  type ModelSpec,
+  type ProviderChoice,
+} from "@/lib/deploy-preflight";
+import {
+  ProviderModelSelector,
+  buildProviderCatalog,
+  findProviderForModel,
+  type SelectorValue,
+} from "./ProviderModelSelector";
 
 interface Props {
   open: boolean;
@@ -16,14 +26,43 @@ interface Props {
   /** Runtime slug — used only for the "The <runtime> runtime …"
    *  headline; behavior is driven by providers/missingKeys. */
   runtime: string;
-  /** Called when all required keys for the chosen provider are saved. */
-  onKeysAdded: () => void;
+  /** Called when all required keys for the chosen provider are saved.
+   *  Receives the model slug if the modal collected one (template-deploy
+   *  flow); legacy callers ignore it. */
+  onKeysAdded: (model?: string) => void;
   /** Called when the user cancels the deploy. */
   onCancel: () => void;
   /** Optional — open the Settings Panel (Config tab → Secrets). */
   onOpenSettings?: () => void;
   /** If provided, secrets save at workspace scope instead of global. */
   workspaceId?: string;
+  /** Set of env var names already configured in the relevant scope
+   *  (global or workspace). When provided, entries whose key is already
+   *  in this set start as `saved: true` so the user can confirm without
+   *  re-entering. Used by the template-deploy "always ask" flow so a
+   *  user can pick a different provider even when global env covers
+   *  the default one. */
+  configuredKeys?: Set<string>;
+  /** Model slug suggestions (datalist) — populated from the template's
+   *  models[]. When non-empty the picker renders a model input above
+   *  the API-key fields. The picker passes the entered slug back via
+   *  onKeysAdded. */
+  modelSuggestions?: string[];
+  /** Full model specs from the template (with required_env per model).
+   *  When provided, the picker auto-snaps the provider radio to the
+   *  matching provider as the user changes the model — fixes the
+   *  "type MiniMax model, see ANTHROPIC_API_KEY field" cascade bug
+   *  (sibling of the ConfigTab cascade fix in #2516). Optional so
+   *  callers without model→provider mapping data can still use the
+   *  picker as-is. */
+  models?: ModelSpec[];
+  /** Pre-fill the model input. */
+  initialModel?: string;
+  /** Override the modal's title + description copy. The default
+   *  "Missing API Keys" title misreads when the modal is opened to
+   *  pick provider/model with keys already configured. */
+  title?: string;
+  description?: string;
 }
 
 interface KeyEntry {
@@ -60,6 +99,12 @@ export function MissingKeysModal({
   onCancel,
   onOpenSettings,
   workspaceId,
+  configuredKeys,
+  modelSuggestions,
+  models,
+  initialModel,
+  title,
+  description,
 }: Props) {
   const pickerProviders = providers ?? [];
   const pickerMode = pickerProviders.length > 1;
@@ -74,6 +119,12 @@ export function MissingKeysModal({
         onCancel={onCancel}
         onOpenSettings={onOpenSettings}
         workspaceId={workspaceId}
+        configuredKeys={configuredKeys}
+        modelSuggestions={modelSuggestions}
+        models={models}
+        initialModel={initialModel}
+        title={title}
+        description={description}
       />
     );
   }
@@ -100,6 +151,22 @@ export function MissingKeysModal({
 // Provider-picker mode — choose one option, save its env var(s), deploy.
 // -----------------------------------------------------------------------------
 
+/** Provider id derived from a model spec — sorted+joined required_env,
+ *  matching the formula in providersFromTemplate(). When the model has
+ *  no required_env (local/self-hosted endpoints) returns null, since
+ *  there's no provider option the radio could snap to. Exported for
+ *  the cascade-snap test. */
+export function providerIdForModel(
+  modelId: string,
+  models: ModelSpec[] | undefined,
+): string | null {
+  const trimmed = modelId.trim();
+  if (!trimmed || !models) return null;
+  const m = models.find((x) => x.id === trimmed);
+  if (!m?.required_env || m.required_env.length === 0) return null;
+  return [...m.required_env].sort().join("|");
+}
+
 function ProviderPickerModal({
   open,
   providers,
@@ -108,47 +175,120 @@ function ProviderPickerModal({
   onCancel,
   onOpenSettings,
   workspaceId,
+  configuredKeys,
+  modelSuggestions,
+  models,
+  initialModel,
+  title,
+  description,
 }: {
   open: boolean;
   providers: ProviderChoice[];
   runtime: string;
-  onKeysAdded: () => void;
+  onKeysAdded: (model?: string) => void;
   onCancel: () => void;
   onOpenSettings?: () => void;
   workspaceId?: string;
+  configuredKeys?: Set<string>;
+  modelSuggestions?: string[];
+  models?: ModelSpec[];
+  initialModel?: string;
+  title?: string;
+  description?: string;
 }) {
-  const [selectedId, setSelectedId] = useState(providers[0].id);
+  // Single model source: `models` from caller when present, else
+  // synthesize a stub list from the legacy `providers` shape so older
+  // callers (pre-PR-2534) still drive the picker. ProviderModelSelector
+  // and findProviderForModel BOTH consume this list — passing the same
+  // shape to both keeps ids identical, so back-derivation matches the
+  // dropdown's option values.
+  const selectorModels = useMemo(() => {
+    if (models && models.length > 0) return models;
+    return providers.map((p) => ({
+      id: p.id,
+      name: p.label,
+      required_env: p.envVars,
+    }));
+  }, [models, providers]);
+
+  const catalog = useMemo(() => buildProviderCatalog(selectorModels), [selectorModels]);
+
+  // Initial selector value: prefer back-derivation from initialModel
+  // (template-deploy passes the template default), then the first
+  // provider already satisfied by configuredKeys, then catalog[0].
+  const initial = useMemo<SelectorValue>(() => {
+    if (initialModel) {
+      const matched = findProviderForModel(catalog, initialModel);
+      if (matched) {
+        return {
+          providerId: matched.id,
+          model: initialModel,
+          envVars: matched.envVars,
+        };
+      }
+    }
+    if (configuredKeys) {
+      const satisfied = catalog.find((p) =>
+        p.envVars.every((k) => configuredKeys.has(k)),
+      );
+      if (satisfied) {
+        return {
+          providerId: satisfied.id,
+          model: satisfied.wildcard ? "" : satisfied.models[0]?.id ?? "",
+          envVars: satisfied.envVars,
+        };
+      }
+    }
+    const first = catalog[0];
+    if (!first) return { providerId: "", model: "", envVars: [] };
+    return {
+      providerId: first.id,
+      model: first.wildcard ? "" : first.models[0]?.id ?? "",
+      envVars: first.envVars,
+    };
+  }, [catalog, initialModel, configuredKeys]);
+
+  const [selectorValue, setSelectorValue] = useState<SelectorValue>(initial);
   const [entries, setEntries] = useState<KeyEntry[]>([]);
   const firstInputRef = useRef<HTMLInputElement>(null);
 
+  // Legacy compat: map the selector value back into the old `selected`/
+  // `model` shape for the rest of the modal body (footer copy, etc.).
   const selected = useMemo(
-    () => providers.find((p) => p.id === selectedId) ?? providers[0],
-    [providers, selectedId],
+    () =>
+      providers.find((p) => p.id === selectorValue.providerId) ??
+      providers[0],
+    [providers, selectorValue.providerId],
   );
+  const model = selectorValue.model;
+  const showModelInput = catalog.length > 0;
 
   useEffect(() => {
     if (!open) return;
-    setSelectedId(providers[0].id);
-  }, [open, providers]);
+    setSelectorValue(initial);
+  }, [open, initial]);
 
   useEffect(() => {
     if (!open) return;
     setEntries(
-      selected.envVars.map((key) => ({
+      selectorValue.envVars.map((key) => ({
         key,
         value: "",
-        saved: false,
+        // Pre-mark as saved when the key is already in the configured
+        // set (global or workspace scope). Lets the user click Deploy
+        // without re-entering a key the platform already holds.
+        saved: configuredKeys?.has(key) ?? false,
         saving: false,
         error: null,
       })),
     );
-  }, [open, selected]);
+  }, [open, selectorValue.envVars, configuredKeys]);
 
   useEffect(() => {
     if (!open) return;
     const raf = requestAnimationFrame(() => firstInputRef.current?.focus());
     return () => cancelAnimationFrame(raf);
-  }, [open, selectedId]);
+  }, [open, selectorValue.providerId]);
 
   useEffect(() => {
     if (!open) return;
@@ -228,9 +368,9 @@ function ProviderPickerModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="missing-keys-title"
-        className="relative bg-zinc-900 border border-zinc-700 rounded-xl shadow-2xl shadow-black/50 max-w-[480px] w-full mx-4 max-h-[80vh] overflow-auto"
+        className="relative bg-surface-sunken border border-line rounded-xl shadow-2xl shadow-black/50 max-w-[480px] w-full mx-4 max-h-[80vh] overflow-auto"
       >
-        <div className="px-5 py-4 border-b border-zinc-800">
+        <div className="px-5 py-4 border-b border-line">
           <div className="flex items-center gap-2 mb-1">
             <div
               className="w-5 h-5 rounded-md bg-amber-600/20 border border-amber-500/30 flex items-center justify-center"
@@ -242,68 +382,49 @@ function ProviderPickerModal({
                 <circle cx="6" cy="8.5" r="0.5" fill="#fbbf24" />
               </svg>
             </div>
-            <h3 id="missing-keys-title" className="text-sm font-semibold text-zinc-100">
-              Missing API Keys
+            <h3 id="missing-keys-title" className="text-sm font-semibold text-ink">
+              {title ?? "Missing API Keys"}
             </h3>
           </div>
-          <p className="text-[12px] text-zinc-400 leading-relaxed">
-            The <span className="text-amber-300 font-medium">{runtimeLabel}</span>{" "}
-            runtime supports multiple providers. Pick one and paste its API key.
+          <p className="text-[12px] text-ink-mid leading-relaxed">
+            {description ?? (
+              <>
+                The <span className="text-warm font-medium">{runtimeLabel}</span>{" "}
+                runtime supports multiple providers. Pick one and paste its API key.
+              </>
+            )}
           </p>
         </div>
 
         <div className="px-5 py-4 space-y-3">
-          <fieldset className="space-y-1.5">
-            <legend className="text-[10px] uppercase tracking-wide text-zinc-500 font-semibold mb-1.5">
-              Provider
-            </legend>
-            {providers.map((p) => (
-              <label
-                key={p.id}
-                className={`flex items-start gap-2.5 rounded-lg border px-3 py-2 cursor-pointer transition-colors ${
-                  selectedId === p.id
-                    ? "bg-blue-600/15 border-blue-500/50"
-                    : "bg-zinc-800/40 border-zinc-700/50 hover:border-zinc-600"
-                }`}
-              >
-                <input
-                  type="radio"
-                  name="provider"
-                  value={p.id}
-                  checked={selectedId === p.id}
-                  onChange={() => setSelectedId(p.id)}
-                  className="mt-0.5 accent-blue-500"
-                />
-                <div className="min-w-0 flex-1">
-                  <div className="text-[12px] text-zinc-100 font-medium">{p.label}</div>
-                  <div className="text-[10px] font-mono text-zinc-500">
-                    {p.envVars.join(", ")}
-                  </div>
-                  {p.note && (
-                    <div className="text-[10px] text-zinc-500 mt-1 leading-relaxed">
-                      {p.note}
-                    </div>
-                  )}
-                </div>
-              </label>
-            ))}
-          </fieldset>
+          {/* Shared provider→model selector. Source of truth for provider
+              taxonomy + model filtering. Same component is used in
+              ConfigTab so behavior + vendor split is identical across
+              all 3 deploy surfaces (modal here, settings tab, template
+              palette flow). */}
+          <ProviderModelSelector
+            models={selectorModels}
+            value={selectorValue}
+            onChange={setSelectorValue}
+            variant="stack"
+            idPrefix="provider-picker"
+          />
 
           <div className="space-y-2">
             {entries.map((entry, index) => (
               <div
                 key={entry.key}
-                className="bg-zinc-800/50 rounded-lg px-3 py-2.5 border border-zinc-700/50"
+                className="bg-surface-card/50 rounded-lg px-3 py-2.5 border border-line/50"
               >
                 <div className="flex items-center justify-between mb-1.5">
                   <div>
-                    <div className="text-[11px] text-zinc-300 font-medium">
+                    <div className="text-[11px] text-ink-mid font-medium">
                       {getKeyLabel(entry.key)}
                     </div>
-                    <div className="text-[9px] font-mono text-zinc-500">{entry.key}</div>
+                    <div className="text-[9px] font-mono text-ink-soft">{entry.key}</div>
                   </div>
                   {entry.saved && (
-                    <span className="text-[9px] text-emerald-400 bg-emerald-900/30 px-1.5 py-0.5 rounded flex items-center gap-1">
+                    <span className="text-[9px] text-good bg-emerald-900/30 px-1.5 py-0.5 rounded flex items-center gap-1">
                       <svg width="8" height="8" viewBox="0 0 8 8" fill="none" aria-hidden="true">
                         <path d="M1.5 4L3.5 6L6.5 2" stroke="currentColor" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" />
                       </svg>
@@ -325,12 +446,12 @@ function ProviderPickerModal({
                           handleSaveKey(index);
                         }
                       }}
-                      className="flex-1 bg-zinc-900 border border-zinc-600 rounded px-2 py-1.5 text-[11px] text-zinc-100 font-mono focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500/20 transition-colors"
+                      className="flex-1 bg-surface-sunken border border-line rounded px-2 py-1.5 text-[11px] text-ink font-mono focus:outline-none focus:border-accent focus:ring-1 focus:ring-accent/20 transition-colors"
                     />
                     <button
                       onClick={() => handleSaveKey(index)}
                       disabled={!entry.value.trim() || entry.saving}
-                      className="px-3 py-1.5 bg-blue-600 hover:bg-blue-500 text-[11px] rounded text-white disabled:opacity-30 transition-colors shrink-0"
+                      className="px-3 py-1.5 bg-accent-strong hover:bg-accent text-[11px] rounded text-white disabled:opacity-30 transition-colors shrink-0"
                     >
                       {entry.saving ? "..." : "Save"}
                     </button>
@@ -338,19 +459,19 @@ function ProviderPickerModal({
                 )}
 
                 {entry.error && (
-                  <div className="mt-1.5 text-[10px] text-red-400">{entry.error}</div>
+                  <div className="mt-1.5 text-[10px] text-bad">{entry.error}</div>
                 )}
               </div>
             ))}
           </div>
         </div>
 
-        <div className="px-5 py-3 border-t border-zinc-800 bg-zinc-950/50 flex items-center justify-between gap-2">
+        <div className="px-5 py-3 border-t border-line bg-surface/50 flex items-center justify-between gap-2">
           <div>
             {onOpenSettings && (
               <button
                 onClick={onOpenSettings}
-                className="text-[11px] text-blue-400 hover:text-blue-300 transition-colors"
+                className="text-[11px] text-accent hover:text-accent transition-colors"
               >
                 Open Settings Panel
               </button>
@@ -359,14 +480,19 @@ function ProviderPickerModal({
           <div className="flex items-center gap-2">
             <button
               onClick={onCancel}
-              className="px-3.5 py-1.5 text-[12px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+              className="px-3.5 py-1.5 text-[12px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
             >
               Cancel Deploy
             </button>
             <button
-              onClick={onKeysAdded}
-              disabled={!allSaved || anySaving}
-              className="px-3.5 py-1.5 text-[12px] bg-blue-600 hover:bg-blue-500 text-white rounded-lg transition-colors disabled:opacity-40"
+              onClick={() => onKeysAdded(showModelInput ? model.trim() : undefined)}
+              disabled={
+                !allSaved ||
+                anySaving ||
+                !selectorValue.providerId ||
+                (showModelInput && model.trim() === "")
+              }
+              className="px-3.5 py-1.5 text-[12px] bg-accent-strong hover:bg-accent text-white rounded-lg transition-colors disabled:opacity-40"
             >
               {allSaved ? "Deploy" : entries.length > 1 ? "Add Keys" : "Add Key"}
             </button>
@@ -514,9 +640,9 @@ function AllKeysModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="missing-keys-title"
-        className="relative bg-zinc-900 border border-zinc-700 rounded-xl shadow-2xl shadow-black/50 max-w-[440px] w-full mx-4 max-h-[80vh] overflow-auto"
+        className="relative bg-surface-sunken border border-line rounded-xl shadow-2xl shadow-black/50 max-w-[440px] w-full mx-4 max-h-[80vh] overflow-auto"
       >
-        <div className="px-5 py-4 border-b border-zinc-800">
+        <div className="px-5 py-4 border-b border-line">
           <div className="flex items-center gap-2 mb-1">
             <div
               className="w-5 h-5 rounded-md bg-amber-600/20 border border-amber-500/30 flex items-center justify-center"
@@ -528,12 +654,12 @@ function AllKeysModal({
                 <circle cx="6" cy="8.5" r="0.5" fill="#fbbf24" />
               </svg>
             </div>
-            <h3 id="missing-keys-title" className="text-sm font-semibold text-zinc-100">
+            <h3 id="missing-keys-title" className="text-sm font-semibold text-ink">
               Missing API Keys
             </h3>
           </div>
-          <p className="text-[12px] text-zinc-400 leading-relaxed">
-            The <span className="text-amber-300 font-medium">{runtimeLabel}</span>{" "}
+          <p className="text-[12px] text-ink-mid leading-relaxed">
+            The <span className="text-warm font-medium">{runtimeLabel}</span>{" "}
             runtime requires the following keys to be configured before deploying.
           </p>
         </div>
@@ -542,17 +668,17 @@ function AllKeysModal({
           {entries.map((entry, index) => (
             <div
               key={entry.key}
-              className="bg-zinc-800/50 rounded-lg px-3 py-2.5 border border-zinc-700/50"
+              className="bg-surface-card/50 rounded-lg px-3 py-2.5 border border-line/50"
             >
               <div className="flex items-center justify-between mb-1">
                 <div>
-                  <div className="text-[11px] text-zinc-300 font-medium">
+                  <div className="text-[11px] text-ink-mid font-medium">
                     {getKeyLabel(entry.key)}
                   </div>
-                  <div className="text-[9px] font-mono text-zinc-500">{entry.key}</div>
+                  <div className="text-[9px] font-mono text-ink-soft">{entry.key}</div>
                 </div>
                 {entry.saved && (
-                  <span className="text-[9px] text-emerald-400 bg-emerald-900/30 px-1.5 py-0.5 rounded flex items-center gap-1">
+                  <span className="text-[9px] text-good bg-emerald-900/30 px-1.5 py-0.5 rounded flex items-center gap-1">
                     <svg width="8" height="8" viewBox="0 0 8 8" fill="none">
                       <path d="M1.5 4L3.5 6L6.5 2" stroke="currentColor" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" />
                     </svg>
@@ -574,37 +700,37 @@ function AllKeysModal({
                         handleSaveKey(index);
                       }
                     }}
-                    className="flex-1 bg-zinc-900 border border-zinc-600 rounded px-2 py-1.5 text-[11px] text-zinc-100 font-mono focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500/20 transition-colors"
+                    className="flex-1 bg-surface-sunken border border-line rounded px-2 py-1.5 text-[11px] text-ink font-mono focus:outline-none focus:border-accent focus:ring-1 focus:ring-accent/20 transition-colors"
                   />
                   <button
                     type="button"
                     onClick={() => handleSaveKey(index)}
                     disabled={!entry.value.trim() || entry.saving}
-                    className="px-3 py-1.5 bg-blue-600 hover:bg-blue-500 text-[11px] rounded text-white disabled:opacity-30 transition-colors shrink-0"
+                    className="px-3 py-1.5 bg-accent-strong hover:bg-accent text-[11px] rounded text-white disabled:opacity-30 transition-colors shrink-0"
                   >
                     {entry.saving ? "..." : "Save"}
                   </button>
                 </div>
               )}
 
-              {entry.error && <div className="mt-1.5 text-[10px] text-red-400">{entry.error}</div>}
+              {entry.error && <div className="mt-1.5 text-[10px] text-bad">{entry.error}</div>}
             </div>
           ))}
 
           {globalError && (
-            <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[11px] text-red-400">
+            <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[11px] text-bad">
               {globalError}
             </div>
           )}
         </div>
 
-        <div className="px-5 py-3 border-t border-zinc-800 bg-zinc-950/50 flex items-center justify-between gap-2">
+        <div className="px-5 py-3 border-t border-line bg-surface/50 flex items-center justify-between gap-2">
           <div>
             {onOpenSettings && (
               <button
                 type="button"
                 onClick={onOpenSettings}
-                className="text-[11px] text-blue-400 hover:text-blue-300 transition-colors"
+                className="text-[11px] text-accent hover:text-accent transition-colors"
               >
                 Open Settings Panel
               </button>
@@ -614,7 +740,7 @@ function AllKeysModal({
             <button
               type="button"
               onClick={onCancel}
-              className="px-3.5 py-1.5 text-[12px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+              className="px-3.5 py-1.5 text-[12px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
             >
               Cancel Deploy
             </button>
@@ -622,7 +748,7 @@ function AllKeysModal({
               type="button"
               onClick={handleAddKeysAndDeploy}
               disabled={!allSaved || anySaving}
-              className="px-3.5 py-1.5 text-[12px] bg-blue-600 hover:bg-blue-500 text-white rounded-lg transition-colors disabled:opacity-40"
+              className="px-3.5 py-1.5 text-[12px] bg-accent-strong hover:bg-accent text-white rounded-lg transition-colors disabled:opacity-40"
             >
               {anySaving ? "Saving..." : allSaved ? "Deploy" : "Add Keys"}
             </button>

canvas/src/components/OnboardingWizard.tsx

@@ -132,10 +132,10 @@ export function OnboardingWizard() {
     <div
       role="complementary"
       aria-label="Onboarding guide"
-      className="fixed bottom-20 left-4 z-50 w-80 rounded-2xl border border-zinc-700/60 bg-zinc-900/95 backdrop-blur-xl shadow-2xl shadow-black/40 overflow-hidden"
+      className="fixed bottom-20 left-4 z-50 w-80 rounded-2xl border border-line/60 bg-surface-sunken/95 backdrop-blur-xl shadow-2xl shadow-black/40 overflow-hidden"
     >
       {/* Progress bar */}
-      <div className="h-1 bg-zinc-800">
+      <div className="h-1 bg-surface-card">
         <div
           className="h-full bg-gradient-to-r from-blue-500 to-sky-400 transition-all duration-500"
           style={{ width: `${((currentStepIdx + 1) / STEPS.length) * 100}%` }}
@@ -162,17 +162,17 @@ export function OnboardingWizard() {
             type="button"
             onClick={dismiss}
             aria-label="Skip onboarding guide"
-            className="text-[10px] text-zinc-400 hover:text-zinc-200 transition-colors"
+            className="text-[10px] text-ink-mid hover:text-ink transition-colors"
           >
             Skip guide
           </button>
         </div>
 
         {/* Content */}
-        <h3 className="text-sm font-medium text-zinc-100 mb-1">
+        <h3 className="text-sm font-medium text-ink mb-1">
           {currentStep.title}
         </h3>
-        <p className="text-[11px] text-zinc-400 leading-relaxed mb-3">
+        <p className="text-[11px] text-ink-mid leading-relaxed mb-3">
           {currentStep.description}
         </p>
 
@@ -181,7 +181,7 @@ export function OnboardingWizard() {
           <button
             type="button"
             onClick={handleAction}
-            className="flex-1 px-3 py-1.5 bg-blue-600/90 hover:bg-blue-500 rounded-lg text-[11px] font-medium text-white transition-colors"
+            className="flex-1 px-3 py-1.5 bg-accent-strong/90 hover:bg-accent rounded-lg text-[11px] font-medium text-white transition-colors"
           >
             {step === "welcome"
               ? "Create Workspace"
@@ -199,7 +199,7 @@ export function OnboardingWizard() {
                 if (next) setStep(next.id);
                 else dismiss();
               }}
-              className="px-3 py-1.5 bg-zinc-800 hover:bg-zinc-700 rounded-lg text-[11px] text-zinc-400 transition-colors"
+              className="px-3 py-1.5 bg-surface-card hover:bg-surface-card rounded-lg text-[11px] text-ink-mid transition-colors"
             >
               Next
             </button>

canvas/src/components/OrgImportPreflightModal.tsx

@@ -240,14 +240,14 @@ export function OrgImportPreflightModal({
       onClick={onCancel}
     >
       <div
-        className="w-[560px] max-h-[80vh] overflow-auto rounded-xl bg-zinc-900 border border-zinc-700 shadow-2xl"
+        className="w-[560px] max-h-[80vh] overflow-auto rounded-xl bg-surface-sunken border border-line shadow-2xl"
         onClick={(e) => e.stopPropagation()}
       >
-        <header className="px-5 py-4 border-b border-zinc-800">
-          <h2 id="org-preflight-title" className="text-sm font-semibold text-zinc-100">
+        <header className="px-5 py-4 border-b border-line">
+          <h2 id="org-preflight-title" className="text-sm font-semibold text-ink">
             Deploy {orgName}
           </h2>
-          <p className="mt-0.5 text-[11px] text-zinc-500">
+          <p className="mt-0.5 text-[11px] text-ink-soft">
             {workspaceCount} workspace{workspaceCount === 1 ? "" : "s"}.
             Review the credentials needed before import.
           </p>
@@ -283,23 +283,23 @@ export function OrgImportPreflightModal({
             />
           )}
           {requiredEnv.length === 0 && recommendedEnv.length === 0 && (
-            <p className="text-[12px] text-zinc-400">
+            <p className="text-[12px] text-ink-mid">
               No additional credentials required for this template.
             </p>
           )}
         </section>
 
-        <footer className="px-5 py-3 border-t border-zinc-800 flex items-center justify-between">
+        <footer className="px-5 py-3 border-t border-line flex items-center justify-between">
           <button
             type="button"
             onClick={onCancel}
-            className="px-3 py-1.5 text-[11px] rounded bg-zinc-800 hover:bg-zinc-700 text-zinc-300"
+            className="px-3 py-1.5 text-[11px] rounded bg-surface-card hover:bg-surface-card text-ink-mid"
           >
             Cancel
           </button>
           <div className="flex items-center gap-2">
             {missingRecommended.length > 0 && canProceed && (
-              <span className="text-[10px] text-amber-400/90">
+              <span className="text-[10px] text-warm/90">
                 {missingRecommended.length} recommended key
                 {missingRecommended.length === 1 ? "" : "s"} still unset
               </span>
@@ -308,7 +308,7 @@ export function OrgImportPreflightModal({
               type="button"
               onClick={onProceed}
               disabled={!canProceed}
-              className="px-4 py-1.5 text-[11px] font-semibold rounded bg-blue-600 hover:bg-blue-500 text-white disabled:bg-zinc-700 disabled:text-zinc-500 disabled:cursor-not-allowed"
+              className="px-4 py-1.5 text-[11px] font-semibold rounded bg-accent-strong hover:bg-accent text-white disabled:bg-surface-card disabled:text-white-soft disabled:cursor-not-allowed"
             >
               Import
             </button>
@@ -346,14 +346,14 @@ function EnvList({
       ? "border-red-800/60 bg-red-950/20"
       : "border-amber-800/50 bg-amber-950/15";
   const headerColor =
-    tone === "required" ? "text-red-300" : "text-amber-300";
+    tone === "required" ? "text-bad" : "text-warm";
 
   return (
     <div className={`rounded-lg border ${accent} p-3`}>
       <h3 className={`text-[11px] font-semibold uppercase tracking-wide ${headerColor}`}>
         {title}
       </h3>
-      <p className="mt-0.5 mb-2 text-[10px] text-zinc-400">{subtitle}</p>
+      <p className="mt-0.5 mb-2 text-[10px] text-ink-mid">{subtitle}</p>
       <ul className="space-y-2">
         {entries.map((entry) =>
           typeof entry === "string" ? (
@@ -397,16 +397,16 @@ function StrictEnvRow({
   onSave,
 }: StrictEnvRowProps) {
   return (
-    <li className="flex items-center gap-2 rounded bg-zinc-900/70 border border-zinc-800 px-2 py-1.5">
+    <li className="flex items-center gap-2 rounded bg-surface-sunken/70 border border-line px-2 py-1.5">
       <code
         className={`text-[11px] font-mono flex-1 ${
-          configured ? "text-zinc-500 line-through" : "text-zinc-200"
+          configured ? "text-ink-soft line-through" : "text-ink"
         }`}
       >
         {envKey}
       </code>
       {configured ? (
-        <span className="text-[10px] text-emerald-400">✓ set</span>
+        <span className="text-[10px] text-good">✓ set</span>
       ) : (
         <>
           <input
@@ -422,20 +422,20 @@ function StrictEnvRow({
               }
             }}
             disabled={d?.saving}
-            className="flex-1 px-2 py-1 rounded bg-zinc-800 border border-zinc-700 text-[11px] text-zinc-200 focus:outline-none focus:border-blue-500 disabled:opacity-50"
+            className="flex-1 px-2 py-1 rounded bg-surface-card border border-line text-[11px] text-ink focus:outline-none focus:border-accent disabled:opacity-50"
           />
           <button
             type="button"
             onClick={() => onSave(envKey)}
             disabled={d?.saving || !d?.value.trim()}
-            className="px-2 py-1 text-[10px] rounded bg-blue-600 hover:bg-blue-500 text-white disabled:opacity-40 disabled:cursor-not-allowed"
+            className="px-2 py-1 text-[10px] rounded bg-accent-strong hover:bg-accent text-white disabled:opacity-40 disabled:cursor-not-allowed"
           >
             {d?.saving ? "…" : "Save"}
           </button>
         </>
       )}
       {d?.error && (
-        <span className="text-[9px] text-red-400 basis-full pl-1">
+        <span className="text-[9px] text-bad basis-full pl-1">
           {d.error}
         </span>
       )}
@@ -467,13 +467,13 @@ function AnyOfEnvGroup({
 }: AnyOfEnvGroupProps) {
   const satisfiedBy = members.find((m) => configuredKeys.has(m));
   return (
-    <li className="rounded border border-zinc-800 bg-zinc-900/50 px-2.5 py-2">
+    <li className="rounded border border-line bg-surface-sunken/50 px-2.5 py-2">
       <div className="flex items-center justify-between mb-1.5">
-        <span className="text-[10px] uppercase tracking-wide text-zinc-400">
+        <span className="text-[10px] uppercase tracking-wide text-ink-mid">
           Configure any one
         </span>
         {satisfiedBy && (
-          <span className="text-[10px] text-emerald-400">
+          <span className="text-[10px] text-good">
             ✓ using <code className="font-mono">{satisfiedBy}</code>
           </span>
         )}
@@ -486,19 +486,19 @@ function AnyOfEnvGroup({
           return (
             <li
               key={m}
-              className={`flex items-center gap-2 rounded bg-zinc-900/70 border border-zinc-800 px-2 py-1 ${
+              className={`flex items-center gap-2 rounded bg-surface-sunken/70 border border-line px-2 py-1 ${
                 dimmed ? "opacity-50" : ""
               }`}
             >
               <code
                 className={`text-[11px] font-mono flex-1 ${
-                  isConfigured ? "text-zinc-500 line-through" : "text-zinc-200"
+                  isConfigured ? "text-ink-soft line-through" : "text-ink"
                 }`}
               >
                 {m}
               </code>
               {isConfigured ? (
-                <span className="text-[10px] text-emerald-400">✓ set</span>
+                <span className="text-[10px] text-good">✓ set</span>
               ) : (
                 <>
                   <input
@@ -514,20 +514,20 @@ function AnyOfEnvGroup({
                       }
                     }}
                     disabled={d?.saving}
-                    className="flex-1 px-2 py-1 rounded bg-zinc-800 border border-zinc-700 text-[11px] text-zinc-200 focus:outline-none focus:border-blue-500 disabled:opacity-50"
+                    className="flex-1 px-2 py-1 rounded bg-surface-card border border-line text-[11px] text-ink focus:outline-none focus:border-accent disabled:opacity-50"
                   />
                   <button
                     type="button"
                     onClick={() => onSave(m)}
                     disabled={d?.saving || !d?.value.trim()}
-                    className="px-2 py-1 text-[10px] rounded bg-blue-600 hover:bg-blue-500 text-white disabled:opacity-40 disabled:cursor-not-allowed"
+                    className="px-2 py-1 text-[10px] rounded bg-accent-strong hover:bg-accent text-white disabled:opacity-40 disabled:cursor-not-allowed"
                   >
                     {d?.saving ? "…" : "Save"}
                   </button>
                 </>
               )}
               {d?.error && (
-                <span className="text-[9px] text-red-400 basis-full pl-1">
+                <span className="text-[9px] text-bad basis-full pl-1">
                   {d.error}
                 </span>
               )}

canvas/src/components/PricingTable.tsx

@@ -97,27 +97,27 @@ function PlanCard({
   onSelect: () => void;
 }) {
   const ring = plan.highlighted
-    ? "border-blue-600 ring-2 ring-blue-600/30"
-    : "border-zinc-800";
+    ? "border-accent ring-2 ring-blue-600/30"
+    : "border-line";
   return (
     <article
-      className={`flex flex-col rounded-lg border ${ring} bg-zinc-900/40 p-6`}
+      className={`flex flex-col rounded-lg border ${ring} bg-surface-sunken/40 p-6`}
       aria-labelledby={`plan-${plan.id}-name`}
     >
       {plan.highlighted && (
-        <span className="mb-3 inline-block rounded-full bg-blue-600/20 px-3 py-1 text-xs font-medium text-blue-300">
+        <span className="mb-3 inline-block rounded-full bg-accent-strong/20 px-3 py-1 text-xs font-medium text-accent">
           Most popular
         </span>
       )}
-      <h2 id={`plan-${plan.id}-name`} className="text-xl font-semibold text-white">
+      <h2 id={`plan-${plan.id}-name`} className="text-xl font-semibold text-ink">
         {plan.name}
       </h2>
-      <p className="mt-1 text-sm text-zinc-400">{plan.tagline}</p>
-      <p className="mt-4 text-3xl font-bold text-white">{plan.price}</p>
-      <ul className="mt-6 flex-1 space-y-2 text-sm text-zinc-300">
+      <p className="mt-1 text-sm text-ink-mid">{plan.tagline}</p>
+      <p className="mt-4 text-3xl font-bold text-ink">{plan.price}</p>
+      <ul className="mt-6 flex-1 space-y-2 text-sm text-ink-mid">
         {plan.features.map((f) => (
           <li key={f} className="flex items-start">
-            <span className="mr-2 text-blue-400" aria-hidden>
+            <span className="mr-2 text-accent" aria-hidden>
               ✓
             </span>
             {f}
@@ -130,8 +130,8 @@ function PlanCard({
         disabled={loading}
         className={`mt-6 rounded-lg px-4 py-3 text-sm font-medium ${
           plan.highlighted
-            ? "bg-blue-600 text-white hover:bg-blue-500 disabled:bg-blue-900"
-            : "border border-zinc-700 bg-zinc-900 text-zinc-100 hover:bg-zinc-800 disabled:opacity-50"
+            ? "bg-accent-strong text-white hover:bg-accent disabled:bg-blue-900"
+            : "border border-line bg-surface-sunken text-ink hover:bg-surface-card disabled:opacity-50"
         }`}
       >
         {loading ? "Opening checkout…" : plan.ctaLabel}

canvas/src/components/ProviderModelSelector.tsx

@@ -0,0 +1,523 @@
+"use client";
+
+/**
+ * ProviderModelSelector — single source of truth for the provider→model
+ * dropdown chain shared across:
+ *   1. MissingKeysModal (template deploy / first-time onboarding modal)
+ *   2. ConfigTab (per-workspace settings — Runtime section)
+ *   3. TemplatePalette (template side panel — inherits via MissingKeysModal)
+ *
+ * The user picks Provider FIRST (Anthropic API, Claude Code subscription,
+ * MiniMax, Z.ai GLM, ...). The model dropdown then filters to only that
+ * provider's models. Wildcard providers (huggingface/*, openrouter/*,
+ * custom/*) reveal a free-text model input with a tooltip explaining the
+ * wildcard.
+ *
+ * Provider taxonomy:
+ *   - Multiple models can share the same `required_env` (e.g. all
+ *     ANTHROPIC_AUTH_TOKEN-routed third-party providers — MiniMax, GLM,
+ *     Kimi, DeepSeek). Grouping ONLY by env-tuple collapses them all into
+ *     one bucket. We split further by vendor inferred from the model id
+ *     so the user sees "MiniMax" and "Z.ai (GLM)" as separate options.
+ *   - Vendor is inferred via prefix rules below. Templates that ship
+ *     explicit vendor metadata (future) should override the heuristic.
+ */
+
+import { useId, useMemo } from "react";
+
+export interface SelectorModel {
+  id: string;
+  name?: string;
+  required_env?: string[];
+}
+
+/** A provider option in the dropdown — one row corresponds to one
+ *  vendor + env-tuple combo, holding the models that map to it. */
+export interface ProviderEntry {
+  /** Stable id used as the <option value>. `${vendor}|${sortedEnv}`. */
+  id: string;
+  /** Inferred vendor key (e.g. "minimax", "anthropic-oauth"). */
+  vendor: string;
+  /** Human label shown in the dropdown. */
+  label: string;
+  /** Env vars required by every model in this provider. */
+  envVars: string[];
+  /** Models bucketed under this provider. */
+  models: SelectorModel[];
+  /** True when ANY model id contains "*" — UI shows free-text model input. */
+  wildcard: boolean;
+  /** Optional tooltip text (rendered as native title=). */
+  tooltip?: string;
+}
+
+export interface SelectorValue {
+  /** ProviderEntry.id of the selected provider. Empty string = nothing
+   *  picked yet (parent should treat as invalid for save). */
+  providerId: string;
+  /** Selected model slug. For wildcard providers this is whatever the
+   *  user typed in the free-text input. */
+  model: string;
+  /** Snapshot of envVars from the selected provider. Re-emitted on every
+   *  change so consumers can re-render credential fields without
+   *  re-inferring from the model. */
+  envVars: string[];
+}
+
+interface Props {
+  models: SelectorModel[];
+  value: SelectorValue;
+  onChange: (next: SelectorValue) => void;
+  /** Display variant. "grid" = label+control side-by-side (used in ConfigTab
+   *  Runtime section). "stack" = vertical (used in MissingKeysModal). */
+  variant?: "grid" | "stack";
+  /** When true, parent caller is opting in to power-user free-text. Adds a
+   *  "Custom (type model id)..." escape-hatch entry as a model option even
+   *  when the chosen provider isn't wildcard. ConfigTab uses this; the
+   *  deploy modal does not. */
+  allowCustomModelEscape?: boolean;
+  disabled?: boolean;
+  /** Optional id-prefix for label↔control wiring (WCAG 1.3.1). Default
+   *  uses useId(). */
+  idPrefix?: string;
+}
+
+// -----------------------------------------------------------------------------
+// Vendor detection — id-prefix heuristic + bare-name patterns.
+// -----------------------------------------------------------------------------
+
+/** Vendor keys → human label. Add new vendors here when templates pick
+ *  up new model families. */
+const VENDOR_LABELS: Record<string, string> = {
+  "anthropic-oauth": "Claude Code subscription",
+  anthropic: "Anthropic API",
+  minimax: "MiniMax",
+  zai: "Z.ai (GLM)",
+  moonshot: "Moonshot (Kimi)",
+  deepseek: "DeepSeek",
+  "xiaomi-mimo": "Xiaomi MiMo",
+  openai: "OpenAI",
+  google: "Google Gemini",
+  alibaba: "Alibaba Qwen (DashScope)",
+  nousresearch: "Nous Research (Hermes)",
+  openrouter: "OpenRouter (any model)",
+  huggingface: "Hugging Face Inference",
+  "ai-gateway": "Vercel AI Gateway",
+  "opencode-zen": "OpenCode Zen",
+  "opencode-go": "OpenCode Go",
+  kilocode: "Kilo Code",
+  "kimi-coding": "Moonshot Kimi (coding-tuned)",
+  "minimax-cn": "MiniMax China",
+  "ollama-cloud": "Ollama Cloud",
+  ollama: "Ollama (self-hosted)",
+  nvidia: "NVIDIA NIM",
+  arcee: "Arcee",
+  xiaomi: "Xiaomi MiMo",
+  gemini: "Google Gemini",
+  custom: "Custom OpenAI-compat endpoint",
+};
+
+/** Optional per-vendor tooltip shown on hover. */
+const VENDOR_TOOLTIPS: Record<string, string> = {
+  "anthropic-oauth":
+    "Use your Claude.ai (Pro/Max/Team) subscription via OAuth. Run `claude login` in the workspace terminal to mint the token, then paste it here. No API spend.",
+  anthropic:
+    "Pay-per-token via the Anthropic API (Console). Provide an API key starting with sk-ant-…",
+  minimax:
+    "MiniMax models served through their Anthropic-API-compatible endpoint. Get a key at platform.minimax.io.",
+  zai:
+    "Zhipu AI / z.ai GLM models through the Anthropic-compatible gateway. Get a key at docs.z.ai.",
+  moonshot:
+    "Moonshot Kimi K2-series via Anthropic-API-compatible endpoint. Get a key at platform.kimi.ai.",
+  deepseek:
+    "DeepSeek V4 via Anthropic-API-compatible endpoint. Get a key at api-docs.deepseek.com.",
+  openrouter:
+    "OpenRouter routes to 200+ models behind one API. Use any openrouter/<model> id. Get a key at openrouter.ai.",
+  huggingface:
+    "Any model hosted on Hugging Face Inference. Type the full model id (e.g. mistralai/Mistral-7B-Instruct-v0.3).",
+  custom:
+    "Self-hosted OpenAI-compatible endpoint (LM Studio, Ollama local, vLLM, llama.cpp). Configure base_url in the workspace's runtime config. No API key required.",
+};
+
+/** Sentinel value used in the model <select> for the free-text escape hatch
+ *  added by `allowCustomModelEscape`. The component swaps to a text input
+ *  when this is selected. */
+const CUSTOM_MODEL_SENTINEL = "__custom__";
+
+/** Bare-id vendor patterns (no slash separator). Order matters — first
+ *  match wins. */
+const BARE_VENDOR_PATTERNS: Array<{ test: (id: string) => boolean; vendor: string }> = [
+  { test: (id) => /^minimax-/i.test(id) || /^MiniMax-/.test(id), vendor: "minimax" },
+  { test: (id) => /^GLM-/i.test(id), vendor: "zai" },
+  { test: (id) => /^kimi-/i.test(id), vendor: "moonshot" },
+  { test: (id) => /^deepseek-/i.test(id), vendor: "deepseek" },
+  { test: (id) => /^mimo-/i.test(id), vendor: "xiaomi-mimo" },
+  { test: (id) => /^claude-/i.test(id), vendor: "anthropic" },
+  { test: (id) => /^gpt-/i.test(id), vendor: "openai" },
+  { test: (id) => /^gemini-/i.test(id), vendor: "google" },
+  { test: (id) => /^qwen-/i.test(id), vendor: "alibaba" },
+  // Claude-Code OAuth aliases — bare "sonnet"/"opus"/"haiku" + CLAUDE_CODE_OAUTH_TOKEN
+  // is the strongest signal that this is a subscription model. We also
+  // gate on env in inferVendor() below to avoid mis-tagging non-OAuth
+  // models that happen to be named "sonnet".
+  { test: (id) => /^(sonnet|opus|haiku)$/i.test(id), vendor: "anthropic-oauth" },
+];
+
+/** Infer a vendor key from a model spec. Combines id-prefix and env
+ *  signals. Exported for tests. */
+export function inferVendor(model: SelectorModel): string {
+  const id = model.id || "";
+  const envSet = new Set(model.required_env ?? []);
+
+  // 1. Explicit slash-separated prefix wins (e.g. nousresearch/hermes-4-70b).
+  const slashIdx = id.indexOf("/");
+  if (slashIdx > 0) {
+    return id.slice(0, slashIdx).toLowerCase();
+  }
+
+  // 2. Bare-id pattern. Special-case the OAuth aliases — they only count
+  //    when the env actually demands the OAuth token. Otherwise (e.g.
+  //    a hypothetical "sonnet" alias against ANTHROPIC_API_KEY) fall
+  //    through and let the env-based fallback bucket it under
+  //    "anthropic".
+  for (const p of BARE_VENDOR_PATTERNS) {
+    if (!p.test(id)) continue;
+    if (p.vendor === "anthropic-oauth" && !envSet.has("CLAUDE_CODE_OAUTH_TOKEN")) {
+      continue;
+    }
+    return p.vendor;
+  }
+
+  // 3. Env-tuple fallback. Pick the first env's "namespace" as the
+  //    vendor — e.g. OPENROUTER_API_KEY → "openrouter".
+  const env = model.required_env?.[0];
+  if (env) {
+    const ns = env.replace(/_API_KEY$|_TOKEN$|_KEY$/i, "").toLowerCase();
+    return ns || "unknown";
+  }
+
+  return "unknown";
+}
+
+/** Build the provider catalog from the template's models[]. Models are
+ *  bucketed by `(vendor, sortedEnv)` so two distinct env-tuples for the
+ *  same vendor (rare but possible) become two separate entries. */
+export function buildProviderCatalog(models: SelectorModel[]): ProviderEntry[] {
+  const buckets = new Map<string, ProviderEntry>();
+
+  for (const m of models) {
+    const envs = m.required_env ?? [];
+    const sortedEnv = [...envs].sort().join("|");
+    const vendor = inferVendor(m);
+    const id = `${vendor}|${sortedEnv}`;
+    const wildcard = m.id.includes("*");
+
+    let entry = buckets.get(id);
+    if (!entry) {
+      const baseLabel = VENDOR_LABELS[vendor] ?? vendor;
+      entry = {
+        id,
+        vendor,
+        label: baseLabel,
+        envVars: envs,
+        models: [],
+        wildcard,
+        tooltip: VENDOR_TOOLTIPS[vendor],
+      };
+      buckets.set(id, entry);
+    }
+    entry.models.push(m);
+    // Wildcard sticks if any model in the bucket is a wildcard — same
+    // bucket can't mix wildcard and concrete because they'd typically
+    // share required_env but rarely the same vendor. Defensive OR.
+    entry.wildcard = entry.wildcard || wildcard;
+  }
+
+  // Decorate label with model-count when ≥2 concrete models share the
+  // bucket. Helps the user understand "Anthropic API (5 models)" vs
+  // "MiniMax (3 models)".
+  for (const e of buckets.values()) {
+    if (!e.wildcard && e.models.length > 1) {
+      e.label = `${e.label} (${e.models.length} models)`;
+    }
+  }
+
+  return Array.from(buckets.values());
+}
+
+/** Find the provider entry that contains a given model id. Used by
+ *  callers to back-derive the provider when only the model is known
+ *  (e.g. ConfigTab loading from saved state). */
+export function findProviderForModel(
+  catalog: ProviderEntry[],
+  modelId: string,
+): ProviderEntry | null {
+  if (!modelId) return null;
+  for (const p of catalog) {
+    if (p.models.some((m) => m.id === modelId)) return p;
+    // Wildcard match — entry has model id ending in "*" and the typed
+    // id starts with the wildcard's prefix (e.g. "openrouter/anthropic/
+    // claude-3.5-sonnet" matches the "openrouter/*" bucket).
+    if (p.wildcard) {
+      for (const m of p.models) {
+        if (!m.id.endsWith("*")) continue;
+        const prefix = m.id.slice(0, -1);
+        if (modelId.startsWith(prefix)) return p;
+      }
+    }
+  }
+  return null;
+}
+
+// -----------------------------------------------------------------------------
+// Component
+// -----------------------------------------------------------------------------
+
+export function ProviderModelSelector({
+  models,
+  value,
+  onChange,
+  variant = "stack",
+  allowCustomModelEscape = false,
+  disabled = false,
+  idPrefix,
+}: Props) {
+  const generatedId = useId();
+  const baseId = idPrefix ?? generatedId;
+  const providerSelectId = `${baseId}-provider`;
+  const modelSelectId = `${baseId}-model`;
+
+  const catalog = useMemo(() => buildProviderCatalog(models), [models]);
+  const selected = useMemo(
+    () => catalog.find((p) => p.id === value.providerId) ?? null,
+    [catalog, value.providerId],
+  );
+
+  // True when the user picked the "Custom (type model id)..." escape entry
+  // in the model dropdown — switches to free-text. Wildcard providers
+  // ALWAYS use free-text, so this flag is for the escape hatch on
+  // non-wildcard providers.
+  const userPickedCustom = value.model === CUSTOM_MODEL_SENTINEL || (
+    !!selected &&
+    !selected.wildcard &&
+    !!value.model &&
+    !selected.models.some((m) => m.id === value.model)
+  );
+  const useTextInput = (selected?.wildcard ?? false) || userPickedCustom;
+
+  const handleProviderChange = (nextProviderId: string) => {
+    const next = catalog.find((p) => p.id === nextProviderId) ?? null;
+    if (!next) {
+      onChange({ providerId: "", model: "", envVars: [] });
+      return;
+    }
+    // When switching providers:
+    //   - wildcard provider → empty (free-text input takes over)
+    //   - exactly 1 concrete model → auto-pick (no choice to make)
+    //   - 2+ concrete models → leave empty so the operator MUST pick
+    //
+    // Background: previously this defaulted to `next.models[0]` for any
+    // non-wildcard provider, which silently set the alphabetically-first
+    // model in the bucket. Bit a real user on 2026-05-03 — they picked
+    // the MiniMax provider intending `MiniMax-M2.7` but the form silently
+    // set `MiniMax-M2` (first in the list). They never saw the model
+    // dropdown change because the provider+model widgets are visually
+    // distinct, and the workspace deployed with the wrong model. Caller
+    // already disables Deploy/Save while `model.trim() === ""`, so the
+    // empty default forces an explicit pick without loosening any other
+    // gate.
+    const defaultModel = next.wildcard
+      ? ""
+      : next.models.length === 1
+        ? next.models[0]?.id ?? ""
+        : "";
+    onChange({
+      providerId: next.id,
+      model: defaultModel,
+      envVars: next.envVars,
+    });
+  };
+
+  const handleModelChange = (nextModel: string) => {
+    if (!selected) {
+      onChange({ ...value, model: nextModel });
+      return;
+    }
+    onChange({
+      providerId: selected.id,
+      model: nextModel,
+      envVars: selected.envVars,
+    });
+  };
+
+  const containerClass = variant === "grid" ? "grid grid-cols-2 gap-3" : "space-y-3";
+
+  return (
+    <div className={containerClass} data-testid="provider-model-selector">
+      <div>
+        <label
+          htmlFor={providerSelectId}
+          className="text-[10px] uppercase tracking-wide text-ink-soft font-semibold mb-1.5 block"
+        >
+          Provider <span aria-hidden="true" className="text-bad">*</span>
+          <span className="sr-only"> (required)</span>
+        </label>
+        <select
+          id={providerSelectId}
+          value={value.providerId}
+          onChange={(e) => handleProviderChange(e.target.value)}
+          disabled={disabled || catalog.length === 0}
+          aria-describedby={selected?.tooltip ? `${providerSelectId}-help` : undefined}
+          data-testid="provider-select"
+          className="w-full bg-surface-sunken border border-line rounded px-2 py-1.5 text-[11px] text-ink focus:outline-none focus:border-accent focus:ring-1 focus:ring-accent/20 transition-colors disabled:opacity-50"
+        >
+          <option value="" disabled>
+            — select provider —
+          </option>
+          {catalog.map((p) => (
+            <option key={p.id} value={p.id} title={p.tooltip}>
+              {p.label}
+            </option>
+          ))}
+        </select>
+        {selected?.tooltip && (
+          <p
+            id={`${providerSelectId}-help`}
+            className="text-[9px] text-ink-soft mt-1 leading-relaxed"
+          >
+            {selected.tooltip}
+          </p>
+        )}
+        {selected && selected.envVars.length > 0 && (
+          <p className="text-[9px] text-ink-soft mt-0.5 font-mono">
+            requires: {selected.envVars.join(", ")}
+          </p>
+        )}
+      </div>
+
+      <div>
+        <label
+          htmlFor={modelSelectId}
+          className="text-[10px] uppercase tracking-wide text-ink-soft font-semibold mb-1.5 block"
+        >
+          Model <span aria-hidden="true" className="text-bad">*</span>
+          <span className="sr-only"> (required)</span>
+        </label>
+        {useTextInput ? (
+          <>
+            <input
+              id={modelSelectId}
+              type="text"
+              value={
+                value.model === CUSTOM_MODEL_SENTINEL ? "" : value.model
+              }
+              onChange={(e) => handleModelChange(e.target.value.trim())}
+              placeholder={
+                selected?.wildcard
+                  ? wildcardPlaceholder(selected)
+                  : "type any model id"
+              }
+              disabled={disabled || !selected}
+              spellCheck={false}
+              autoComplete="off"
+              data-testid="model-input"
+              className="w-full bg-surface-sunken border border-line rounded px-2 py-1.5 text-[11px] text-ink font-mono focus:outline-none focus:border-accent focus:ring-1 focus:ring-accent/20 transition-colors disabled:opacity-50"
+            />
+            <p className="text-[9px] text-ink-soft mt-1 leading-relaxed">
+              {selected?.wildcard
+                ? wildcardHelpText(selected)
+                : "Free-text model id. Make sure the provider can resolve it."}
+            </p>
+            {!selected?.wildcard && (
+              <button
+                type="button"
+                onClick={() => {
+                  // Switch back to dropdown by setting model to first
+                  // concrete option.
+                  if (selected) {
+                    handleModelChange(selected.models[0]?.id ?? "");
+                  }
+                }}
+                className="text-[9px] text-accent hover:text-accent mt-0.5"
+              >
+                ← back to model list
+              </button>
+            )}
+          </>
+        ) : (
+          <select
+            id={modelSelectId}
+            value={
+              value.model && selected?.models.some((m) => m.id === value.model)
+                ? value.model
+                : ""
+            }
+            onChange={(e) => {
+              if (e.target.value === CUSTOM_MODEL_SENTINEL) {
+                handleModelChange(CUSTOM_MODEL_SENTINEL);
+              } else {
+                handleModelChange(e.target.value);
+              }
+            }}
+            disabled={disabled || !selected || selected.models.length === 0}
+            data-testid="model-select"
+            className="w-full bg-surface-sunken border border-line rounded px-2 py-1.5 text-[11px] text-ink font-mono focus:outline-none focus:border-accent focus:ring-1 focus:ring-accent/20 transition-colors disabled:opacity-50"
+          >
+            <option value="" disabled>
+              {selected ? "— select model —" : "— select provider first —"}
+            </option>
+            {selected?.models
+              .filter((m) => !m.id.includes("*"))
+              .map((m) => (
+                <option
+                  key={m.id}
+                  value={m.id}
+                  title={m.name ?? m.id}
+                >
+                  {m.name ?? m.id}
+                </option>
+              ))}
+            {allowCustomModelEscape && selected && (
+              <option value={CUSTOM_MODEL_SENTINEL}>
+                Custom (type model id)…
+              </option>
+            )}
+          </select>
+        )}
+      </div>
+    </div>
+  );
+}
+
+function wildcardPlaceholder(p: ProviderEntry): string {
+  const example = p.models.find((m) => m.id.includes("*"))?.id ?? "";
+  if (!example) return "type any model id";
+  // Strip trailing star — show the pattern as a hint.
+  const prefix = example.replace(/\*$/, "");
+  switch (p.vendor) {
+    case "huggingface":
+      return `e.g. ${prefix}meta-llama/Meta-Llama-3-70B-Instruct`;
+    case "openrouter":
+      return `e.g. ${prefix}anthropic/claude-3.5-sonnet`;
+    case "custom":
+      return `e.g. ${prefix}my-local-model`;
+    default:
+      return `e.g. ${prefix}<model-id>`;
+  }
+}
+
+function wildcardHelpText(p: ProviderEntry): string {
+  switch (p.vendor) {
+    case "huggingface":
+      return "Any model hosted on Hugging Face Inference. Browse at huggingface.co/models?inference=warm.";
+    case "openrouter":
+      return "Any of OpenRouter's 200+ routed models. Browse at openrouter.ai/models.";
+    case "custom":
+      return "Self-hosted endpoint. Configure base_url in your workspace's runtime config (no API key required).";
+    case "ai-gateway":
+      return "Vercel AI Gateway model id. See vercel.com/docs/ai-gateway.";
+    case "opencode-zen":
+      return "OpenCode Zen model id. See opencode.zen.";
+    default:
+      return "Wildcard provider — type the model id in full. Provider routes by id prefix.";
+  }
+}

canvas/src/components/ProvisioningTimeout.tsx

@@ -321,17 +321,17 @@ export function ProvisioningTimeout({
                     onClick={() => handleDismiss(entry.workspaceId)}
                     aria-label="Dismiss provisioning timeout warning"
                     title="Dismiss — keep this workspace running without the warning"
-                    className="shrink-0 text-amber-400/60 hover:text-amber-200 transition-colors -mr-1"
+                    className="shrink-0 text-warm/60 hover:text-amber-200 transition-colors -mr-1"
                   >
                     <svg width="14" height="14" viewBox="0 0 16 16" fill="none" aria-hidden="true">
                       <path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" />
                     </svg>
                   </button>
                 </div>
-                <div className="text-[11px] text-amber-300/80 leading-relaxed">
+                <div className="text-[11px] text-warm/80 leading-relaxed">
                   <span className="font-medium text-amber-200">{entry.workspaceName}</span>{" "}
                   has been provisioning for{" "}
-                  <span className="font-mono text-amber-300">{formatDuration(elapsed)}</span>.
+                  <span className="font-mono text-warm">{formatDuration(elapsed)}</span>.
                   It may have encountered an issue.
                 </div>
 
@@ -349,14 +349,14 @@ export function ProvisioningTimeout({
                     type="button"
                     onClick={() => handleCancelRequest(entry.workspaceId)}
                     disabled={isRetrying || isCancelling}
-                    className="px-3 py-1.5 bg-zinc-800 hover:bg-zinc-700 text-[11px] text-zinc-300 rounded-lg border border-zinc-600 disabled:opacity-40 transition-colors"
+                    className="px-3 py-1.5 bg-surface-card hover:bg-surface-card text-[11px] text-ink-mid rounded-lg border border-line disabled:opacity-40 transition-colors"
                   >
                     {isCancelling ? "Cancelling..." : "Cancel"}
                   </button>
                   <button
                     type="button"
                     onClick={() => handleViewLogs(entry.workspaceId)}
-                    className="px-3 py-1.5 text-[11px] text-amber-400 hover:text-amber-300 transition-colors"
+                    className="px-3 py-1.5 text-[11px] text-warm hover:text-warm transition-colors"
                   >
                     View Logs
                   </button>
@@ -371,18 +371,18 @@ export function ProvisioningTimeout({
       {confirmingCancel && (
         <div className="fixed inset-0 z-50 flex items-center justify-center">
           <div aria-hidden="true" className="absolute inset-0 bg-black/60" onClick={() => setConfirmingCancel(null)} />
-          <div className="relative bg-zinc-900 border border-zinc-700 rounded-xl shadow-2xl p-5 max-w-[340px] w-full mx-4">
-            <h3 className="text-sm font-semibold text-zinc-100 mb-2">
+          <div className="relative bg-surface-sunken border border-line rounded-xl shadow-2xl p-5 max-w-[340px] w-full mx-4">
+            <h3 className="text-sm font-semibold text-ink mb-2">
               Cancel deployment?
             </h3>
-            <p className="text-[12px] text-zinc-400 mb-4 leading-relaxed">
+            <p className="text-[12px] text-ink-mid mb-4 leading-relaxed">
               This will permanently remove the workspace. This action cannot be undone.
             </p>
             <div className="flex justify-end gap-2">
               <button
                 type="button"
                 onClick={() => setConfirmingCancel(null)}
-                className="px-3.5 py-1.5 text-[12px] text-zinc-400 hover:text-zinc-200 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-lg transition-colors"
+                className="px-3.5 py-1.5 text-[12px] text-ink-mid hover:text-ink bg-surface-card hover:bg-surface-card border border-line rounded-lg transition-colors"
               >
                 Keep
               </button>

canvas/src/components/SearchDialog.tsx

@@ -92,12 +92,12 @@ export function SearchDialog() {
         role="dialog"
         aria-modal="true"
         aria-label="Search workspaces"
-        className="w-[420px] bg-zinc-950/95 backdrop-blur-xl border border-zinc-800/60 rounded-2xl shadow-2xl shadow-black/50 overflow-hidden"
+        className="w-[420px] bg-surface/95 backdrop-blur-xl border border-line/60 rounded-2xl shadow-2xl shadow-black/50 overflow-hidden"
         onClick={(e) => e.stopPropagation()}
       >
         {/* Search input */}
-        <div className="flex items-center gap-3 px-4 py-3 border-b border-zinc-800/40">
-          <svg width="16" height="16" viewBox="0 0 16 16" fill="none" className="shrink-0 text-zinc-500" aria-hidden="true">
+        <div className="flex items-center gap-3 px-4 py-3 border-b border-line/40">
+          <svg width="16" height="16" viewBox="0 0 16 16" fill="none" className="shrink-0 text-ink-soft" aria-hidden="true">
             <circle cx="7" cy="7" r="5.5" stroke="currentColor" strokeWidth="1.5" />
             <path d="M11 11l3.5 3.5" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" />
           </svg>
@@ -113,9 +113,9 @@ export function SearchDialog() {
             onChange={(e) => setQuery(e.target.value)}
             onKeyDown={handleInputKeyDown}
             placeholder="Search workspaces..."
-            className="flex-1 bg-transparent text-sm text-zinc-100 placeholder-zinc-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus:outline-none rounded"
+            className="flex-1 bg-transparent text-sm text-ink placeholder-zinc-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus:outline-none rounded"
           />
-          <kbd className="text-[9px] text-zinc-400 bg-zinc-800/60 px-1.5 py-0.5 rounded border border-zinc-700/40">ESC</kbd>
+          <kbd className="text-[9px] text-ink-mid bg-surface-card/60 px-1.5 py-0.5 rounded border border-line/40">ESC</kbd>
         </div>
 
         {/* Results */}
@@ -126,7 +126,7 @@ export function SearchDialog() {
           className="max-h-[300px] overflow-y-auto py-1"
         >
           {filtered.length === 0 ? (
-            <div role="status" aria-live="polite" className="px-4 py-6 text-center text-xs text-zinc-400">
+            <div role="status" aria-live="polite" className="px-4 py-6 text-center text-xs text-ink-mid">
               {query ? "No workspaces match" : "No workspaces yet"}
             </div>
           ) : (
@@ -139,7 +139,7 @@ export function SearchDialog() {
                 aria-selected={index === focusedIndex}
                 onClick={() => handleSelect(node.id)}
                 className={`w-full px-4 py-2.5 flex items-center gap-3 text-left transition-colors ${
-                  index === focusedIndex ? "bg-zinc-800/60" : "hover:bg-zinc-800/40"
+                  index === focusedIndex ? "bg-surface-card/60" : "hover:bg-surface-card/40"
                 }`}
               >
                 <div
@@ -147,13 +147,13 @@ export function SearchDialog() {
                   className={`w-2 h-2 rounded-full shrink-0 ${statusDotClass(node.data.status)}`}
                 />
                 <div className="min-w-0 flex-1">
-                  <div className="text-sm text-zinc-200 truncate">{node.data.name}</div>
+                  <div className="text-sm text-ink truncate">{node.data.name}</div>
                   {node.data.role && (
-                    <div className="text-[10px] text-zinc-500 truncate">{node.data.role}</div>
+                    <div className="text-[10px] text-ink-soft truncate">{node.data.role}</div>
                   )}
                 </div>
                 <span
-                  className="text-[9px] font-mono text-zinc-400"
+                  className="text-[9px] font-mono text-ink-mid"
                   aria-label={`Tier ${node.data.tier}`}
                 >
                   T{node.data.tier}
@@ -164,11 +164,11 @@ export function SearchDialog() {
         </div>
 
         {/* Footer */}
-        <div className="px-4 py-2 border-t border-zinc-800/40 flex items-center justify-between">
-          <span className="text-[9px] text-zinc-400">{filtered.length} workspace{filtered.length !== 1 ? "s" : ""}</span>
+        <div className="px-4 py-2 border-t border-line/40 flex items-center justify-between">
+          <span className="text-[9px] text-ink-mid">{filtered.length} workspace{filtered.length !== 1 ? "s" : ""}</span>
           <div className="flex gap-2">
-            <kbd className="text-[9px] text-zinc-400 bg-zinc-800/60 px-1.5 py-0.5 rounded border border-zinc-700/40">↑↓ navigate</kbd>
-            <kbd className="text-[9px] text-zinc-400 bg-zinc-800/60 px-1.5 py-0.5 rounded border border-zinc-700/40">↵ select</kbd>
+            <kbd className="text-[9px] text-ink-mid bg-surface-card/60 px-1.5 py-0.5 rounded border border-line/40">↑↓ navigate</kbd>
+            <kbd className="text-[9px] text-ink-mid bg-surface-card/60 px-1.5 py-0.5 rounded border border-line/40">↵ select</kbd>
           </div>
         </div>
       </div>

canvas/src/components/SidePanel.tsx

@@ -137,7 +137,7 @@ export function SidePanel() {
 
   return (
     <div
-      className="fixed top-0 right-0 h-full bg-zinc-950/95 backdrop-blur-xl border-l border-zinc-800/50 flex flex-col z-50 shadow-2xl shadow-black/50 animate-in slide-in-from-right duration-200"
+      className="fixed top-0 right-0 h-full bg-surface/95 backdrop-blur-xl border-l border-line/50 flex flex-col z-50 shadow-2xl shadow-black/50 animate-in slide-in-from-right duration-200"
       style={{ width }}
     >
       {/* Resize handle */}
@@ -151,26 +151,26 @@ export function SidePanel() {
         tabIndex={0}
         onMouseDown={onMouseDown}
         onKeyDown={onResizeKeyDown}
-        className="absolute left-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-blue-500/30 active:bg-blue-500/50 transition-colors z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-inset"
+        className="absolute left-0 top-0 bottom-0 w-1.5 cursor-col-resize hover:bg-accent/30 active:bg-accent/50 transition-colors z-10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-inset"
       />
       {/* Header */}
-      <div className="flex items-center justify-between px-5 py-4 border-b border-zinc-800/40 bg-zinc-900/30">
+      <div className="flex items-center justify-between px-5 py-4 border-b border-line/40 bg-surface-sunken/30">
         <div className="flex items-center gap-3 min-w-0">
           <div className="relative">
             <StatusDot status={node.data.status} size="md" />
           </div>
           <div className="min-w-0">
-            <h2 className="text-[14px] font-semibold text-zinc-100 truncate leading-tight">
+            <h2 className="text-[14px] font-semibold text-ink truncate leading-tight">
               {node.data.name}
             </h2>
             <div className="flex items-center gap-2 mt-0.5">
               {node.data.role && (
-                <span className="text-[10px] text-zinc-500 truncate">
+                <span className="text-[10px] text-ink-soft truncate">
                   {node.data.role}
                 </span>
               )}
               <span className={`text-[9px] px-1.5 py-0.5 rounded-md font-mono ${
-                isOnline ? "text-emerald-400 bg-emerald-950/30" : "text-zinc-500 bg-zinc-800/50"
+                isOnline ? "text-good bg-emerald-950/30" : "text-ink-soft bg-surface-card/50"
               }`}>
                 T{node.data.tier}
               </span>
@@ -181,7 +181,7 @@ export function SidePanel() {
           type="button"
           onClick={() => selectNode(null)}
           aria-label="Close workspace panel"
-          className="w-7 h-7 flex items-center justify-center rounded-lg text-zinc-500 hover:text-zinc-200 hover:bg-zinc-800/60 transition-colors"
+          className="w-7 h-7 flex items-center justify-center rounded-lg text-ink-soft hover:text-ink hover:bg-surface-card/60 transition-colors"
         >
           <svg width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true">
             <path d="M1 1l10 10M11 1L1 11" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" />
@@ -190,7 +190,7 @@ export function SidePanel() {
       </div>
 
       {/* Capability summary */}
-      <div className="px-5 py-3 border-b border-zinc-800/40 bg-zinc-900/20">
+      <div className="px-5 py-3 border-b border-line/40 bg-surface-sunken/20">
         <div className="flex flex-wrap gap-2">
           <MetaPill label="Tier" value={`T${node.data.tier}`} />
           <MetaPill label="Runtime" value={capability.runtime || "unknown"} />
@@ -200,13 +200,13 @@ export function SidePanel() {
       </div>
 
       {/* Tabs — relative wrapper lets the fade gradient position against the scroll container */}
-      <div className="relative border-b border-zinc-800/40">
+      <div className="relative border-b border-line/40">
         {/* Right-edge fade: signals more tabs are hidden off-screen when the bar overflows */}
         <div className="pointer-events-none absolute inset-y-0 right-0 w-8 bg-gradient-to-l from-zinc-950 to-transparent z-10" aria-hidden="true" />
       <div
         role="tablist"
         aria-label="Workspace panel tabs"
-        className="flex overflow-x-auto bg-zinc-900/20 px-1"
+        className="flex overflow-x-auto bg-surface-sunken/20 px-1"
         onKeyDown={(e) => {
           const idx = TABS.findIndex((t) => t.id === panelTab);
           let next: number | null = null;
@@ -230,10 +230,10 @@ export function SidePanel() {
             aria-controls={`panel-${tab.id}`}
             tabIndex={panelTab === tab.id ? 0 : -1}
             onClick={() => setPanelTab(tab.id)}
-            className={`shrink-0 px-3 py-2.5 text-[10px] font-medium tracking-wide transition-all rounded-t-lg mx-0.5 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70 ${
+            className={`shrink-0 px-3 py-2.5 text-[10px] font-medium tracking-wide transition-all rounded-t-lg mx-0.5 focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70 ${
               panelTab === tab.id
-                ? "text-zinc-100 bg-zinc-800/40 border-b-2 border-blue-500"
-                : "text-zinc-500 hover:text-zinc-200 hover:bg-zinc-800/40"
+                ? "text-ink bg-surface-card/40 border-b-2 border-accent"
+                : "text-ink-soft hover:text-ink hover:bg-surface-card/40"
             }`}
           >
             <span className="mr-1 opacity-50" aria-hidden="true">{tab.icon}</span>
@@ -264,7 +264,7 @@ export function SidePanel() {
         <Tooltip text={node.data.currentTask as string}>
           <div className="px-4 py-2 bg-amber-950/20 border-b border-amber-800/20 flex items-center gap-2 cursor-default">
             <div className="w-1.5 h-1.5 rounded-full bg-amber-400 motion-safe:animate-pulse shrink-0" />
-            <span className="text-[10px] text-amber-300/90 truncate">
+            <span className="text-[10px] text-warm/90 truncate">
               {node.data.currentTask}
             </span>
           </div>
@@ -295,8 +295,8 @@ export function SidePanel() {
       </div>
 
       {/* Footer — workspace ID */}
-      <div className="px-5 py-2 border-t border-zinc-800/40 bg-zinc-900/20">
-        <span className="text-[9px] font-mono text-zinc-500 select-all">
+      <div className="px-5 py-2 border-t border-line/40 bg-surface-sunken/20">
+        <span className="text-[9px] font-mono text-ink-soft select-all">
           {selectedNodeId}
         </span>
       </div>
@@ -306,9 +306,9 @@ export function SidePanel() {
 
 function MetaPill({ label, value, tone = "zinc" }: { label: string; value: string; tone?: "zinc" | "emerald" | "amber" }) {
   const toneClasses = {
-    zinc: "border-zinc-700/50 bg-zinc-900/70 text-zinc-400",
-    emerald: "border-emerald-500/20 bg-emerald-950/20 text-emerald-300",
-    amber: "border-amber-500/20 bg-amber-950/20 text-amber-300",
+    zinc: "border-line/50 bg-surface-sunken/70 text-ink-mid",
+    emerald: "border-emerald-500/20 bg-emerald-950/20 text-good",
+    amber: "border-amber-500/20 bg-amber-950/20 text-warm",
   }[tone];
 
   return (

canvas/src/components/TemplatePalette.tsx

@@ -236,7 +236,7 @@ export function OrgTemplatesSection() {
           onClick={() => setExpanded((v) => !v)}
           aria-expanded={expanded}
           aria-controls="org-templates-body"
-          className="flex items-center gap-1.5 text-[10px] uppercase tracking-wide text-zinc-500 hover:text-zinc-300 font-semibold transition-colors"
+          className="flex items-center gap-1.5 text-[10px] uppercase tracking-wide text-ink-soft hover:text-ink-mid font-semibold transition-colors"
         >
           <span
             aria-hidden="true"
@@ -246,7 +246,7 @@ export function OrgTemplatesSection() {
           </span>
           Org Templates
           {orgs.length > 0 && (
-            <span className="text-zinc-600 normal-case tracking-normal">
+            <span className="text-ink-soft normal-case tracking-normal">
               ({orgs.length})
             </span>
           )}
@@ -255,7 +255,7 @@ export function OrgTemplatesSection() {
           type="button"
           onClick={loadOrgs}
           aria-label="Refresh org templates"
-          className="text-[10px] text-zinc-500 hover:text-zinc-300"
+          className="text-[10px] text-ink-soft hover:text-ink-mid"
         >
           ↻
         </button>
@@ -264,20 +264,20 @@ export function OrgTemplatesSection() {
       {expanded && (
         <div id="org-templates-body" className="space-y-2">
       {loading && (
-        <div role="status" aria-live="polite" className="flex items-center gap-1.5 text-[10px] text-zinc-500">
+        <div role="status" aria-live="polite" className="flex items-center gap-1.5 text-[10px] text-ink-soft">
           <Spinner size="sm" />
           Loading…
         </div>
       )}
 
       {!loading && orgs.length === 0 && (
-        <div className="text-[10px] text-zinc-500">
+        <div className="text-[10px] text-ink-soft">
           No org templates in <code>org-templates/</code>
         </div>
       )}
 
       {error && (
-        <div className="px-2 py-1 bg-red-950/40 border border-red-800/50 rounded text-[10px] text-red-400">
+        <div className="px-2 py-1 bg-red-950/40 border border-red-800/50 rounded text-[10px] text-bad">
           {error}
         </div>
       )}
@@ -287,10 +287,10 @@ export function OrgTemplatesSection() {
         return (
           <div
             key={o.dir}
-            className="bg-zinc-900/50 border border-zinc-800/60 rounded-xl p-3 hover:border-zinc-700/60 transition-all"
+            className="bg-surface-sunken/50 border border-line/60 rounded-xl p-3 hover:border-line/60 transition-all"
           >
             <div className="flex items-center justify-between mb-1">
-              <span className="text-[12px] font-semibold text-zinc-200 truncate">
+              <span className="text-[12px] font-semibold text-ink truncate">
                 {o.name || o.dir}
               </span>
               <span className="text-[9px] font-mono text-sky-400 bg-sky-950/40 px-1.5 py-0.5 rounded-md shrink-0">
@@ -298,7 +298,7 @@ export function OrgTemplatesSection() {
               </span>
             </div>
             {o.description && (
-              <p className="text-[10px] text-zinc-500 mb-2.5 line-clamp-2 leading-relaxed">
+              <p className="text-[10px] text-ink-soft mb-2.5 line-clamp-2 leading-relaxed">
                 {o.description}
               </p>
             )}
@@ -306,7 +306,7 @@ export function OrgTemplatesSection() {
               type="button"
               onClick={() => handleImport(o)}
               disabled={isImporting}
-              className="w-full px-2 py-1.5 bg-blue-600/20 hover:bg-blue-600/30 border border-blue-500/30 rounded-lg text-[10px] text-blue-300 font-medium transition-colors disabled:opacity-50"
+              className="w-full px-2 py-1.5 bg-accent-strong/20 hover:bg-accent-strong/30 border border-accent/30 rounded-lg text-[10px] text-accent font-medium transition-colors disabled:opacity-50"
             >
               {isImporting ? "Importing…" : "Import org"}
             </button>
@@ -411,7 +411,7 @@ function ImportAgentButton({ onImported }: { onImported: () => void }) {
         type="button"
         onClick={() => fileInputRef.current?.click()}
         disabled={importing}
-        className="w-full px-3 py-2 bg-blue-600/20 hover:bg-blue-600/30 border border-blue-500/30 rounded-lg text-[11px] text-blue-300 font-medium transition-colors disabled:opacity-50"
+        className="w-full px-3 py-2 bg-accent-strong/20 hover:bg-accent-strong/30 border border-accent/30 rounded-lg text-[11px] text-accent font-medium transition-colors disabled:opacity-50"
       >
         {importing ? "Importing..." : "Import Agent Folder"}
       </button>
@@ -476,8 +476,8 @@ export function TemplatePalette() {
         onClick={() => setOpen(!open)}
         className={`fixed top-4 left-4 z-40 w-9 h-9 flex items-center justify-center rounded-lg transition-colors ${
           open
-            ? "bg-blue-600 text-white"
-            : "bg-zinc-900/90 border border-zinc-700/50 text-zinc-400 hover:text-zinc-200 hover:border-zinc-600"
+            ? "bg-accent-strong text-white"
+            : "bg-surface-sunken/90 border border-line/50 text-ink-mid hover:text-ink hover:border-line"
         }`}
         title="Template Palette"
         aria-label={open ? "Close template palette" : "Open template palette"}
@@ -496,10 +496,10 @@ export function TemplatePalette() {
 
       {/* Sidebar */}
       {open && (
-        <div className="fixed top-0 left-0 h-full w-[280px] bg-zinc-900/95 backdrop-blur-md border-r border-zinc-800/60 z-30 flex flex-col shadow-2xl shadow-black/40">
-          <div className="px-4 pt-14 pb-3 border-b border-zinc-800/60">
-            <h2 className="text-sm font-semibold text-zinc-100">Templates</h2>
-            <p className="text-[10px] text-zinc-500 mt-0.5">Click to deploy a workspace</p>
+        <div className="fixed top-0 left-0 h-full w-[280px] bg-surface-sunken/95 backdrop-blur-md border-r border-line/60 z-30 flex flex-col shadow-2xl shadow-black/40">
+          <div className="px-4 pt-14 pb-3 border-b border-line/60">
+            <h2 className="text-sm font-semibold text-ink">Templates</h2>
+            <p className="text-[10px] text-ink-soft mt-0.5">Click to deploy a workspace</p>
           </div>
 
           <div className="flex-1 overflow-y-auto p-3 space-y-2">
@@ -509,20 +509,20 @@ export function TemplatePalette() {
             <OrgTemplatesSection />
 
             {loading && (
-              <div role="status" aria-live="polite" className="flex items-center justify-center gap-2 text-xs text-zinc-500 text-center py-8">
+              <div role="status" aria-live="polite" className="flex items-center justify-center gap-2 text-xs text-ink-soft text-center py-8">
                 <Spinner />
                 Loading…
               </div>
             )}
 
             {!loading && templates.length === 0 && (
-              <div role="status" aria-live="polite" className="text-xs text-zinc-500 text-center py-8">
+              <div role="status" aria-live="polite" className="text-xs text-ink-soft text-center py-8">
                 No templates found in<br />workspace-configs-templates/
               </div>
             )}
 
             {error && (
-              <div className="px-3 py-1.5 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-red-400">
+              <div className="px-3 py-1.5 bg-red-950/40 border border-red-800/50 rounded-lg text-xs text-bad">
                 {error}
               </div>
             )}
@@ -537,10 +537,10 @@ export function TemplatePalette() {
                   key={t.id}
                   onClick={() => void handleDeploy(t)}
                   disabled={isDeploying}
-                  className="w-full text-left bg-zinc-800/40 hover:bg-zinc-800/70 border border-zinc-700/40 hover:border-zinc-600/50 rounded-xl p-3 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-zinc-800/40 disabled:hover:border-zinc-700/40 group focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70"
+                  className="w-full text-left bg-surface-card/40 hover:bg-surface-card/70 border border-line/40 hover:border-line/50 rounded-xl p-3 transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-surface-card/40 disabled:hover:border-line/40 group focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70"
                 >
                   <div className="flex items-center justify-between mb-1">
-                    <span className="text-[12px] font-semibold text-zinc-200 group-hover:text-zinc-100 truncate">
+                    <span className="text-[12px] font-semibold text-ink group-hover:text-ink truncate">
                       {t.name}
                     </span>
                     <span className={`text-[9px] font-mono px-1.5 py-0.5 rounded-md shrink-0 ${tierCfg.color}`}>
@@ -549,7 +549,7 @@ export function TemplatePalette() {
                   </div>
 
                   {t.description && (
-                    <p className="text-[10px] text-zinc-500 mb-2 line-clamp-2 leading-relaxed">
+                    <p className="text-[10px] text-ink-soft mb-2 line-clamp-2 leading-relaxed">
                       {t.description}
                     </p>
                   )}
@@ -557,12 +557,12 @@ export function TemplatePalette() {
                   {t.skills?.length > 0 && (
                     <div className="flex flex-wrap gap-1">
                       {t.skills.slice(0, 3).map((s) => (
-                        <span key={s} className="text-[8px] text-zinc-400 bg-zinc-700/40 px-1.5 py-0.5 rounded">
+                        <span key={s} className="text-[8px] text-ink-mid bg-surface-card/40 px-1.5 py-0.5 rounded">
                           {s}
                         </span>
                       ))}
                       {t.skills.length > 3 && (
-                        <span className="text-[8px] text-zinc-500">+{t.skills.length - 3}</span>
+                        <span className="text-[8px] text-ink-soft">+{t.skills.length - 3}</span>
                       )}
                     </div>
                   )}
@@ -575,12 +575,12 @@ export function TemplatePalette() {
             })}
           </div>
 
-          <div className="px-4 py-3 border-t border-zinc-800/60 space-y-3">
+          <div className="px-4 py-3 border-t border-line/60 space-y-3">
             <ImportAgentButton onImported={loadTemplates} />
             <button
               type="button"
               onClick={loadTemplates}
-              className="text-[10px] text-zinc-500 hover:text-zinc-300 transition-colors block"
+              className="text-[10px] text-ink-soft hover:text-ink-mid transition-colors block"
             >
               Refresh templates
             </button>

canvas/src/components/TermsGate.tsx

@@ -77,15 +77,15 @@ export function TermsGate({ children }: { children: React.ReactNode }) {
     <>
       {children}
       {status === "pending" && (
-        <div aria-hidden="true" className="fixed inset-0 z-50 flex items-center justify-center bg-zinc-950/80 backdrop-blur-sm">
+        <div aria-hidden="true" className="fixed inset-0 z-50 flex items-center justify-center bg-surface/80 backdrop-blur-sm">
           <div
             role="dialog"
             aria-modal="true"
             aria-labelledby="terms-dialog-title"
-            className="mx-4 max-w-lg rounded-lg border border-zinc-700 bg-zinc-900 p-6 shadow-xl"
+            className="mx-4 max-w-lg rounded-lg border border-line bg-surface-sunken p-6 shadow-xl"
           >
-            <h2 id="terms-dialog-title" className="text-lg font-semibold text-white">Terms &amp; conditions</h2>
-            <p className="mt-3 text-sm text-zinc-300">
+            <h2 id="terms-dialog-title" className="text-lg font-semibold text-ink">Terms &amp; conditions</h2>
+            <p className="mt-3 text-sm text-ink-mid">
               Before you create an organization, please review our{" "}
               <a href="/legal/terms" className="text-sky-400 underline" target="_blank" rel="noreferrer">
                 Terms of Service
@@ -96,10 +96,10 @@ export function TermsGate({ children }: { children: React.ReactNode }) {
               </a>
               . Click agree to continue.
             </p>
-            <p className="mt-3 text-xs text-zinc-500">
+            <p className="mt-3 text-xs text-ink-soft">
               By agreeing you acknowledge that workspace data is stored in AWS us-east-2 (Ohio, United States).
             </p>
-            {error && <p role="alert" className="mt-3 text-sm text-red-400">{error}</p>}
+            {error && <p role="alert" className="mt-3 text-sm text-bad">{error}</p>}
             <div className="mt-5 flex justify-end gap-2">
               <button
                 type="button"

canvas/src/components/ThemeToggle.tsx

@@ -0,0 +1,81 @@
+"use client";
+
+import { useTheme, type ThemePreference } from "@/lib/theme-provider";
+
+const OPTIONS: { value: ThemePreference; label: string; icon: string }[] = [
+  // Sun: explicit light
+  {
+    value: "light",
+    label: "Light",
+    icon: "M12 3v1.5M12 19.5V21M4.22 4.22l1.06 1.06M18.72 18.72l1.06 1.06M3 12h1.5M19.5 12H21M4.22 19.78l1.06-1.06M18.72 5.28l1.06-1.06M16 12a4 4 0 11-8 0 4 4 0 018 0z",
+  },
+  // Monitor: follow OS
+  {
+    value: "system",
+    label: "System",
+    icon: "M3 5h18v11H3zM8 21h8M9 21l1-5h4l1 5",
+  },
+  // Moon: explicit dark
+  {
+    value: "dark",
+    label: "Dark",
+    icon: "M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z",
+  },
+];
+
+/**
+ * Three-way preference picker: System / Light / Dark.
+ *
+ * Highlights the user's *picked* preference, not the resolved render
+ * mode. So "System" stays highlighted while the screen renders dark
+ * (because the OS is dark) — that's the user's mental model: "I told
+ * the app to follow my OS."
+ *
+ * Aligned with molecule-app/components/theme-toggle.tsx so the picker
+ * behaves identically across surfaces.
+ */
+export function ThemeToggle({ className = "" }: { className?: string }) {
+  const { theme, setTheme } = useTheme();
+
+  return (
+    <div
+      role="radiogroup"
+      aria-label="Theme preference"
+      className={`inline-flex items-center gap-0.5 rounded-md border border-line bg-surface-sunken p-0.5 ${className}`}
+    >
+      {OPTIONS.map((opt) => {
+        const active = theme === opt.value;
+        return (
+          <button
+            key={opt.value}
+            type="button"
+            role="radio"
+            aria-checked={active}
+            aria-label={opt.label}
+            onClick={() => setTheme(opt.value)}
+            className={
+              "flex h-6 w-6 items-center justify-center rounded transition-colors " +
+              (active
+                ? "bg-surface-elevated text-ink shadow-sm"
+                : "text-ink-soft hover:text-ink-mid")
+            }
+          >
+            <svg
+              width={13}
+              height={13}
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="1.6"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              aria-hidden="true"
+            >
+              <path d={opt.icon} />
+            </svg>
+          </button>
+        );
+      })}
+    </div>
+  );
+}

canvas/src/components/Toaster.tsx

@@ -44,7 +44,7 @@ export function Toaster() {
         ? "bg-emerald-950/90 border border-emerald-700/40 text-emerald-200"
         : type === "error"
         ? "bg-red-950/90 border border-red-700/40 text-red-200"
-        : "bg-zinc-900/90 border border-zinc-700/40 text-zinc-200"
+        : "bg-surface-sunken/90 border border-line/40 text-ink"
     }`;
 
   const pos =
@@ -66,7 +66,7 @@ export function Toaster() {
                 type="button"
                 onClick={() => dismiss(toast.id)}
                 aria-label="Dismiss notification"
-                className="ml-1 p-1 rounded hover:bg-zinc-700/50 transition-colors opacity-70 hover:opacity-100 shrink-0"
+                className="ml-1 p-1 rounded hover:bg-surface-card/50 transition-colors opacity-70 hover:opacity-100 shrink-0"
               >
                 ×
               </button>
@@ -94,7 +94,7 @@ export function Toaster() {
                 type="button"
                 onClick={() => dismiss(toast.id)}
                 aria-label="Dismiss notification"
-                className="ml-1 p-1 rounded hover:bg-zinc-700/50 transition-colors opacity-70 hover:opacity-100 shrink-0"
+                className="ml-1 p-1 rounded hover:bg-surface-card/50 transition-colors opacity-70 hover:opacity-100 shrink-0"
               >
                 ×
               </button>

canvas/src/components/Toolbar.tsx

@@ -7,6 +7,7 @@ import { SettingsButton } from "@/components/settings/SettingsButton";
 import { settingsGearRef } from "@/components/settings/SettingsPanel";
 import { ConfirmDialog } from "@/components/ConfirmDialog";
 import { showToast } from "@/components/Toaster";
+import { ThemeToggle } from "@/components/ThemeToggle";
 import { statusDotClass } from "@/lib/design-tokens";
 
 export function Toolbar() {
@@ -128,13 +129,13 @@ export function Toolbar() {
 
   return (
     <div
-      className="fixed top-3 left-1/2 -translate-x-1/2 z-20 flex items-center gap-3 bg-zinc-900/80 backdrop-blur-md border border-zinc-800/60 rounded-xl px-4 py-2 shadow-xl shadow-black/20 transition-[margin-left] duration-200"
+      className="fixed top-3 left-1/2 -translate-x-1/2 z-20 flex items-center gap-3 bg-surface-sunken/80 backdrop-blur-md border border-line/60 rounded-xl px-4 py-2 shadow-xl shadow-black/20 transition-[margin-left] duration-200"
       style={toolbarOffsetStyle}
     >
       {/* Logo / Title */}
-      <div className="flex items-center gap-2 pr-3 border-r border-zinc-800/60">
+      <div className="flex items-center gap-2 pr-3 border-r border-line/60">
         <img src="/molecule-icon.png" alt="Molecule AI" className="w-5 h-5" />
-        <span className="text-[11px] font-semibold text-zinc-300 tracking-wide">Molecule AI</span>
+        <span className="text-[11px] font-semibold text-ink-mid tracking-wide">Molecule AI</span>
       </div>
 
       {/* Status pills + workspace total in one segment — previously two
@@ -153,15 +154,15 @@ export function Toolbar() {
         {counts.failed > 0 && (
           <StatusPill color={statusDotClass("failed")} count={counts.failed} label="failed" />
         )}
-        <span className="text-zinc-700" aria-hidden="true">·</span>
-        <span className="text-[10px] text-zinc-500 whitespace-nowrap">
+        <span className="text-ink-soft" aria-hidden="true">·</span>
+        <span className="text-[10px] text-ink-soft whitespace-nowrap">
           {counts.roots} workspace{counts.roots !== 1 ? "s" : ""}
-          {counts.children > 0 && <span className="text-zinc-600"> + {counts.children} sub</span>}
+          {counts.children > 0 && <span className="text-ink-soft"> + {counts.children} sub</span>}
         </span>
       </div>
 
       {/* WebSocket connection status */}
-      <div className="pl-3 border-l border-zinc-800/60">
+      <div className="pl-3 border-l border-line/60">
         <WsStatusPill status={wsStatus} />
       </div>
 
@@ -175,10 +176,10 @@ export function Toolbar() {
           title={`Stop all running tasks (${counts.activeTasks} active)`}
           aria-label={stopping ? "Stopping all running tasks" : `Stop all running tasks (${counts.activeTasks} active)`}
         >
-          <svg width="10" height="10" viewBox="0 0 16 16" fill="currentColor" className="text-red-400" aria-hidden="true">
+          <svg width="10" height="10" viewBox="0 0 16 16" fill="currentColor" className="text-bad" aria-hidden="true">
             <rect x="2" y="2" width="12" height="12" rx="2" />
           </svg>
-          <span className="text-[10px] text-red-300 font-medium">
+          <span className="text-[10px] text-bad font-medium">
             {stopping ? "Stopping..." : `Stop All (${counts.activeTasks})`}
           </span>
         </button>
@@ -194,10 +195,10 @@ export function Toolbar() {
           title={`Restart ${needsRestartNodes.length} workspace${needsRestartNodes.length === 1 ? "" : "s"} that need to pick up config or secret changes`}
           aria-label={restartingAll ? "Restarting workspaces" : `Restart ${needsRestartNodes.length} workspace${needsRestartNodes.length === 1 ? "" : "s"} pending config or secret changes`}
         >
-          <svg width="10" height="10" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.8" className="text-amber-400" aria-hidden="true">
+          <svg width="10" height="10" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.8" className="text-warm" aria-hidden="true">
             <path d="M2 8a6 6 0 1 1 1.76 4.24M2 13v-3h3" strokeLinecap="round" strokeLinejoin="round" />
           </svg>
-          <span className="text-[10px] text-amber-300 font-medium">
+          <span className="text-[10px] text-warm font-medium">
             {restartingAll ? "Restarting..." : `Restart Pending (${needsRestartNodes.length})`}
           </span>
         </button>
@@ -217,8 +218,8 @@ export function Toolbar() {
         title={showA2AEdges ? "Hide A2A delegation edges" : "Show A2A delegation edges (last 60 min)"}
         className={`flex items-center justify-center w-7 h-7 border rounded-lg transition-colors ${
           showA2AEdges
-            ? "bg-blue-950/50 hover:bg-blue-900/50 border-blue-800/40 text-blue-300"
-            : "bg-zinc-800/50 hover:bg-zinc-700/50 border-zinc-700/40 text-zinc-500 hover:text-zinc-300"
+            ? "bg-blue-950/50 hover:bg-blue-900/50 border-blue-800/40 text-accent"
+            : "bg-surface-card/50 hover:bg-surface-card/50 border-line/40 text-ink-soft hover:text-ink-mid"
         }`}
       >
         {/* Mesh / network icon */}
@@ -254,7 +255,7 @@ export function Toolbar() {
         }}
         aria-label="Open audit trail for selected workspace"
         title="Audit — view ledger for the selected workspace"
-        className="flex items-center justify-center w-7 h-7 bg-zinc-800/50 hover:bg-zinc-700/50 border border-zinc-700/40 rounded-lg transition-colors text-zinc-500 hover:text-zinc-300"
+        className="flex items-center justify-center w-7 h-7 bg-surface-card/50 hover:bg-surface-card/50 border border-line/40 rounded-lg transition-colors text-ink-soft hover:text-ink-mid"
       >
         {/* Scroll / ledger icon */}
         <svg
@@ -276,7 +277,7 @@ export function Toolbar() {
         onClick={() => useCanvasStore.getState().setSearchOpen(true)}
         aria-label="Search workspaces"
         title="Search (⌘K)"
-        className="flex items-center justify-center w-7 h-7 bg-zinc-800/50 hover:bg-zinc-700/50 border border-zinc-700/40 rounded-lg transition-colors text-zinc-500 hover:text-zinc-300"
+        className="flex items-center justify-center w-7 h-7 bg-surface-card/50 hover:bg-surface-card/50 border border-line/40 rounded-lg transition-colors text-ink-soft hover:text-ink-mid"
       >
         <svg width="14" height="14" viewBox="0 0 16 16" fill="none" aria-hidden="true">
           <circle cx="7" cy="7" r="5" stroke="currentColor" strokeWidth="1.5" />
@@ -289,7 +290,7 @@ export function Toolbar() {
         <button
           type="button"
           onClick={() => setHelpOpen((open) => !open)}
-          className="flex items-center justify-center w-7 h-7 bg-zinc-800/50 hover:bg-zinc-700/50 border border-zinc-700/40 rounded-lg transition-colors text-zinc-500 hover:text-zinc-300"
+          className="flex items-center justify-center w-7 h-7 bg-surface-card/50 hover:bg-surface-card/50 border border-line/40 rounded-lg transition-colors text-ink-soft hover:text-ink-mid"
           aria-expanded={helpOpen}
           aria-label="Open quick help"
           title="Help — shortcuts & quick start"
@@ -301,13 +302,13 @@ export function Toolbar() {
         </button>
 
         {helpOpen && (
-          <div className="absolute right-0 top-full mt-2 w-72 rounded-xl border border-zinc-700/60 bg-zinc-950/95 p-3 shadow-2xl shadow-black/50 backdrop-blur-md">
+          <div className="absolute right-0 top-full mt-2 w-72 rounded-xl border border-line/60 bg-surface/95 p-3 shadow-2xl shadow-black/50 backdrop-blur-md">
             <div className="mb-2 flex items-center justify-between">
-              <span className="text-[10px] font-semibold uppercase tracking-[0.24em] text-zinc-400">Quick start</span>
+              <span className="text-[10px] font-semibold uppercase tracking-[0.24em] text-ink-mid">Quick start</span>
               <button
                 type="button"
                 onClick={() => setHelpOpen(false)}
-                className="text-[10px] text-zinc-600 hover:text-zinc-300 transition-colors"
+                className="text-[10px] text-ink-soft hover:text-ink-mid transition-colors"
               >
                 Close
               </button>
@@ -324,6 +325,9 @@ export function Toolbar() {
         )}
       </div>
 
+      {/* Theme picker — System / Light / Dark */}
+      <ThemeToggle />
+
       {/* Settings gear icon */}
       <SettingsButton ref={settingsGearRef} />
 
@@ -344,7 +348,7 @@ function StatusPill({ color, count, label }: { color: string; count: number; lab
   return (
     <div className="flex items-center gap-1.5" title={`${count} ${label}`} aria-label={`${count} ${label}`}>
       <div className={`w-1.5 h-1.5 rounded-full ${color}`} aria-hidden="true" />
-      <span className="text-[10px] text-zinc-400 tabular-nums" aria-hidden="true">{count}</span>
+      <span className="text-[10px] text-ink-mid tabular-nums" aria-hidden="true">{count}</span>
     </div>
   );
 }
@@ -354,7 +358,7 @@ function WsStatusPill({ status }: { status: "connected" | "connecting" | "discon
     return (
       <div className="flex items-center gap-1.5" title="Real-time updates: connected" aria-label="Real-time updates: connected">
         <div className={`w-1.5 h-1.5 rounded-full ${statusDotClass("online")}`} aria-hidden="true" />
-        <span className="text-[10px] text-zinc-500" aria-hidden="true">Live</span>
+        <span className="text-[10px] text-ink-soft" aria-hidden="true">Live</span>
       </div>
     );
   }
@@ -362,25 +366,25 @@ function WsStatusPill({ status }: { status: "connected" | "connecting" | "discon
     return (
       <div className="flex items-center gap-1.5" title="Real-time updates: reconnecting…" aria-label="Real-time updates: reconnecting">
         <div className="w-1.5 h-1.5 rounded-full bg-amber-400 motion-safe:animate-pulse" aria-hidden="true" />
-        <span className="text-[10px] text-zinc-500" aria-hidden="true">Reconnecting</span>
+        <span className="text-[10px] text-ink-soft" aria-hidden="true">Reconnecting</span>
       </div>
     );
   }
   return (
     <div className="flex items-center gap-1.5" title="Real-time updates: disconnected" aria-label="Real-time updates: disconnected">
       <div className={`w-1.5 h-1.5 rounded-full ${statusDotClass("failed")}`} aria-hidden="true" />
-      <span className="text-[10px] text-zinc-500" aria-hidden="true">Offline</span>
+      <span className="text-[10px] text-ink-soft" aria-hidden="true">Offline</span>
     </div>
   );
 }
 
 function HelpRow({ shortcut, text }: { shortcut: string; text: string }) {
   return (
-    <div className="flex items-start gap-3 rounded-lg border border-zinc-800/70 bg-zinc-900/45 px-3 py-2">
-      <span className="shrink-0 rounded-md border border-zinc-700/60 bg-zinc-950/70 px-2 py-0.5 text-[9px] font-medium uppercase tracking-[0.18em] text-zinc-400">
+    <div className="flex items-start gap-3 rounded-lg border border-line/70 bg-surface-sunken/45 px-3 py-2">
+      <span className="shrink-0 rounded-md border border-line/60 bg-surface/70 px-2 py-0.5 text-[9px] font-medium uppercase tracking-[0.18em] text-ink-mid">
         {shortcut}
       </span>
-      <p className="text-[11px] leading-relaxed text-zinc-500">{text}</p>
+      <p className="text-[11px] leading-relaxed text-ink-soft">{text}</p>
     </div>
   );
 }

canvas/src/components/Tooltip.tsx

@@ -66,10 +66,10 @@ export function Tooltip({ text, children }: Props) {
         <div
           id={tooltipId.current}
           role="tooltip"
-          className="fixed z-[9999] max-w-[400px] max-h-[300px] overflow-y-auto px-3 py-2 bg-zinc-800 border border-zinc-600 rounded-lg shadow-2xl shadow-black/60 pointer-events-none"
+          className="fixed z-[9999] max-w-[400px] max-h-[300px] overflow-y-auto px-3 py-2 bg-surface-card border border-line rounded-lg shadow-2xl shadow-black/60 pointer-events-none"
           style={{ left: pos.x, top: Math.max(8, pos.y - 8), transform: "translateY(-100%)" }}
         >
-          <div className="text-[11px] text-zinc-200 whitespace-pre-wrap break-words leading-relaxed">
+          <div className="text-[11px] text-ink whitespace-pre-wrap break-words leading-relaxed">
             {text}
           </div>
         </div>,

canvas/src/components/WorkspaceNode.tsx

@@ -36,7 +36,7 @@ function EjectIcon(props: React.SVGProps<SVGSVGElement>) {
 
 export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>) {
   const statusCfg = STATUS_CONFIG[data.status] || STATUS_CONFIG.offline;
-  const tierCfg = TIER_CONFIG[data.tier] || { label: `T${data.tier}`, color: "text-zinc-500 bg-zinc-800" };
+  const tierCfg = TIER_CONFIG[data.tier] || { label: `T${data.tier}`, color: "text-ink-soft bg-surface-card" };
   // Org-deploy context — four derived flags off one store subscription.
   // Drives the shimmer while provisioning, the dimmed/non-draggable
   // treatment on locked descendants, and the Cancel pill on the root.
@@ -69,8 +69,8 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
         isVisible={isSelected}
         minWidth={hasChildren ? 360 : 210}
         minHeight={hasChildren ? 200 : 110}
-        lineClassName="!border-blue-500/40"
-        handleClassName="!w-2 !h-2 !bg-blue-500 !border !border-blue-300"
+        lineClassName="!border-accent/40"
+        handleClassName="!w-2 !h-2 !bg-accent !border !border-blue-300"
       />
     <div
       role="button"
@@ -137,13 +137,13 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
         ${isDragTarget
           ? "bg-emerald-950/40 border-2 border-emerald-400/60 ring-2 ring-emerald-400/20 scale-[1.03]"
           : isBatchSelected
-          ? "bg-zinc-900/95 border-2 border-blue-500/80 ring-2 ring-blue-500/30 shadow-lg shadow-blue-500/15"
+          ? "bg-surface-sunken/95 border-2 border-accent/80 ring-2 ring-accent/30 shadow-lg shadow-blue-500/15"
           : isSelected
-          ? "bg-zinc-900/95 border border-blue-500/70 ring-1 ring-blue-500/30 shadow-lg shadow-blue-500/10"
-          : "bg-zinc-900/90 border border-zinc-700/80 hover:border-zinc-500/60 shadow-lg shadow-black/30 hover:shadow-xl hover:shadow-black/40"
+          ? "bg-surface-sunken/95 border border-accent/70 ring-1 ring-accent/30 shadow-lg shadow-blue-500/10"
+          : "bg-surface-sunken/90 border border-line/80 hover:border-zinc-500/60 shadow-lg shadow-black/30 hover:shadow-xl hover:shadow-black/40"
         }
         backdrop-blur-sm
-        focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70 focus-visible:ring-offset-1 focus-visible:ring-offset-zinc-950
+        focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70 focus-visible:ring-offset-1 focus-visible:ring-offset-zinc-950
         ${deploy.isActivelyProvisioning ? "mol-deploy-shimmer" : ""}
         ${deploy.isLockedChild ? "mol-deploy-locked" : ""}
       `}
@@ -165,7 +165,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
       <Handle
         type="target"
         position={Position.Top}
-        className="!w-2.5 !h-1 !rounded-full !bg-zinc-600/80 !border-0 !-top-0.5 hover:!bg-blue-400 hover:!h-1.5 transition-all"
+        className="!w-2.5 !h-1 !rounded-full !bg-surface-card/80 !border-0 !-top-0.5 hover:!bg-blue-400 hover:!h-1.5 transition-all"
       />
 
       <div className="relative px-3.5 py-2.5">
@@ -173,7 +173,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
         <div className="flex items-center justify-between gap-2 mb-1">
           <div className="flex items-center gap-2 min-w-0">
             <div className={`w-2 h-2 rounded-full shrink-0 ${statusCfg.dot} ${statusCfg.glow} shadow-sm`} />
-            <span className="text-[13px] font-semibold text-zinc-100 truncate leading-tight">
+            <span className="text-[13px] font-semibold text-ink truncate leading-tight">
               {data.name}
             </span>
           </div>
@@ -213,7 +213,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
                   ★ REMOTE
                 </span>
               ) : (
-                <span className="text-[7px] font-mono px-1.5 py-0.5 rounded-md text-zinc-400 bg-zinc-800/60 border border-zinc-700/30">
+                <span className="text-[7px] font-mono px-1.5 py-0.5 rounded-md text-ink-mid bg-surface-card/60 border border-line/30">
                   {runtime}
                 </span>
               )}
@@ -226,7 +226,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
          *  grow arbitrarily tall, which wrecks the grid-slot layout
          *  because siblings all plan for the same CHILD_DEFAULT_HEIGHT. */}
         {data.role && (
-          <div className="text-[10px] text-zinc-400 mb-1.5 leading-tight line-clamp-2">{data.role}</div>
+          <div className="text-[10px] text-ink-mid mb-1.5 leading-tight line-clamp-2">{data.role}</div>
         )}
 
         {/* Skills */}
@@ -237,15 +237,15 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
                 key={skill}
                 className={`text-[10px] px-1.5 py-0.5 rounded-md border ${
                   isOnline
-                    ? "text-emerald-300/80 bg-emerald-950/30 border-emerald-800/30"
-                    : "text-zinc-400 bg-zinc-800/60 border-zinc-700/40"
+                    ? "text-good/80 bg-emerald-950/30 border-emerald-800/30"
+                    : "text-ink-mid bg-surface-card/60 border-line/40"
                 }`}
               >
                 {skill}
               </span>
             ))}
             {skills.length > 4 && (
-              <span className="text-[10px] text-zinc-500 self-center">
+              <span className="text-[10px] text-ink-soft self-center">
                 +{skills.length - 4}
               </span>
             )}
@@ -261,7 +261,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
           <Tooltip text={String(data.currentTask)}>
             <div className="flex items-center gap-1.5 mt-1 bg-amber-950/20 px-2 py-1 rounded-md border border-amber-800/20 cursor-default">
               <div className="w-1.5 h-1.5 rounded-full bg-amber-400 motion-safe:animate-pulse shrink-0" />
-              <span className="text-[10px] text-amber-300/80 truncate">{data.currentTask}</span>
+              <span className="text-[10px] text-warm/80 truncate">{data.currentTask}</span>
             </div>
           </Tooltip>
         )}
@@ -274,7 +274,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
               e.stopPropagation();
               useCanvasStore.getState().restartWorkspace(id).catch(() => showToast("Restart failed", "error"));
             }}
-            className="flex items-center gap-1.5 mt-1 w-full bg-sky-950/30 px-2 py-1 rounded-md border border-sky-800/30 hover:bg-sky-900/40 transition-colors text-left focus-visible:ring-2 focus-visible:ring-blue-500/70 focus-visible:outline-none"
+            className="flex items-center gap-1.5 mt-1 w-full bg-sky-950/30 px-2 py-1 rounded-md border border-sky-800/30 hover:bg-sky-900/40 transition-colors text-left focus-visible:ring-2 focus-visible:ring-accent/70 focus-visible:outline-none"
           >
             <span className="text-[10px]">↻</span>
             <span className="text-[10px] text-sky-300/80">Restart to apply changes</span>
@@ -285,10 +285,10 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
         <div className="flex items-center justify-between mt-0.5">
           {data.status !== "online" ? (
             <div className={`text-[10px] uppercase tracking-widest font-medium ${
-              data.status === "failed" ? "text-red-400" :
-              data.status === "degraded" ? "text-amber-300" :
+              data.status === "failed" ? "text-bad" :
+              data.status === "degraded" ? "text-warm" :
               data.status === "provisioning" ? "text-sky-400" :
-              "text-zinc-500"
+              "text-ink-soft"
             }`}>
               {statusCfg.label}
             </div>
@@ -297,7 +297,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
           {data.activeTasks > 0 && (
             <div className="flex items-center gap-1">
               <div className="w-1 h-1 rounded-full bg-amber-400 motion-safe:animate-pulse" />
-              <span className="text-[10px] text-amber-300/80 tabular-nums">
+              <span className="text-[10px] text-warm/80 tabular-nums">
                 {data.activeTasks} task{data.activeTasks > 1 ? "s" : ""}
               </span>
             </div>
@@ -307,7 +307,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
         {/* Degraded error preview */}
         {data.status === "degraded" && data.lastSampleError && (
           <div
-            className="text-[10px] text-amber-300/60 truncate mt-1 bg-amber-950/20 px-1.5 py-0.5 rounded border border-amber-800/20"
+            className="text-[10px] text-warm/60 truncate mt-1 bg-amber-950/20 px-1.5 py-0.5 rounded border border-amber-800/20"
             title={data.lastSampleError}
           >
             {data.lastSampleError}
@@ -318,7 +318,7 @@ export function WorkspaceNode({ id, data }: NodeProps<Node<WorkspaceNodeData>>)
       <Handle
         type="source"
         position={Position.Bottom}
-        className="!w-2.5 !h-1 !rounded-full !bg-zinc-600/80 !border-0 !-bottom-0.5 hover:!bg-blue-400 hover:!h-1.5 transition-all"
+        className="!w-2.5 !h-1 !rounded-full !bg-surface-card/80 !border-0 !-bottom-0.5 hover:!bg-blue-400 hover:!h-1.5 transition-all"
       />
     </div>
     </>
@@ -357,7 +357,7 @@ function TeamMemberChip({
 }) {
   const { data } = node;
   const statusCfg = STATUS_CONFIG[data.status] || STATUS_CONFIG.offline;
-  const tierCfg = TIER_CONFIG[data.tier] || { label: `T${data.tier}`, color: "text-zinc-500 bg-zinc-800" };
+  const tierCfg = TIER_CONFIG[data.tier] || { label: `T${data.tier}`, color: "text-ink-soft bg-surface-card" };
   const isOnline = data.status === "online";
   const skills = getSkillNames(data.agentCard);
 
@@ -376,7 +376,7 @@ function TeamMemberChip({
       role="button"
       tabIndex={0}
       aria-label={`Select ${data.name}`}
-      className="group/child relative rounded-lg bg-zinc-800/60 hover:bg-zinc-700/70 border border-zinc-700/30 hover:border-zinc-600/40 overflow-hidden transition-colors cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/70"
+      className="group/child relative rounded-lg bg-surface-card/60 hover:bg-surface-card/70 border border-line/30 hover:border-line/40 overflow-hidden transition-colors cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/70"
       onClick={(e) => {
         e.stopPropagation();
         onSelect(node.id);
@@ -402,7 +402,7 @@ function TeamMemberChip({
         <div className="flex items-center justify-between gap-1 mb-0.5">
           <div className="flex items-center gap-1.5 min-w-0">
             <div className={`w-1.5 h-1.5 rounded-full shrink-0 ${statusCfg.dot}`} />
-            <span className="text-[10px] font-semibold text-zinc-200 truncate leading-tight">
+            <span className="text-[10px] font-semibold text-ink truncate leading-tight">
               {data.name}
             </span>
           </div>
@@ -423,7 +423,7 @@ function TeamMemberChip({
                 e.stopPropagation();
                 onExtract(node.id);
               }}
-              className="opacity-0 group-hover/child:opacity-100 text-zinc-500 hover:text-sky-400 transition-all focus-visible:ring-2 focus-visible:ring-blue-500/70 focus-visible:outline-none rounded"
+              className="opacity-0 group-hover/child:opacity-100 text-ink-soft hover:text-sky-400 transition-all focus-visible:ring-2 focus-visible:ring-accent/70 focus-visible:outline-none rounded"
             >
               <EjectIcon aria-hidden="true" />
             </button>
@@ -432,7 +432,7 @@ function TeamMemberChip({
 
         {/* Role */}
         {data.role && (
-          <div className="text-[10px] text-zinc-500 mb-1 leading-tight truncate">{data.role}</div>
+          <div className="text-[10px] text-ink-soft mb-1 leading-tight truncate">{data.role}</div>
         )}
 
         {/* Skills */}
@@ -443,15 +443,15 @@ function TeamMemberChip({
                 key={skill}
                 className={`text-[10px] px-1 py-0.5 rounded border ${
                   isOnline
-                    ? "text-emerald-300/70 bg-emerald-950/20 border-emerald-800/20"
-                    : "text-zinc-500 bg-zinc-800/40 border-zinc-700/30"
+                    ? "text-good/70 bg-emerald-950/20 border-emerald-800/20"
+                    : "text-ink-soft bg-surface-card/40 border-line/30"
                 }`}
               >
                 {skill}
               </span>
             ))}
             {skills.length > 3 && (
-              <span className="text-[10px] text-zinc-400 self-center">+{skills.length - 3}</span>
+              <span className="text-[10px] text-ink-mid self-center">+{skills.length - 3}</span>
             )}
           </div>
         )}
@@ -460,10 +460,10 @@ function TeamMemberChip({
         <div className="flex items-center justify-between">
           {data.status !== "online" ? (
             <span className={`text-[10px] uppercase tracking-widest font-medium ${
-              data.status === "failed" ? "text-red-400" :
-              data.status === "degraded" ? "text-amber-300" :
+              data.status === "failed" ? "text-bad" :
+              data.status === "degraded" ? "text-warm" :
               data.status === "provisioning" ? "text-sky-400" :
-              "text-zinc-500"
+              "text-ink-soft"
             }`}>
               {statusCfg.label}
             </span>
@@ -471,7 +471,7 @@ function TeamMemberChip({
           {data.activeTasks > 0 && (
             <div className="flex items-center gap-0.5">
               <div className="w-1 h-1 rounded-full bg-amber-400 motion-safe:animate-pulse" />
-              <span className="text-[10px] text-amber-300 tabular-nums">
+              <span className="text-[10px] text-warm tabular-nums">
                 {data.activeTasks}
               </span>
             </div>
@@ -483,15 +483,15 @@ function TeamMemberChip({
           <Tooltip text={String(data.currentTask)}>
             <div className="flex items-center gap-1 mt-0.5 px-1.5 py-0.5 bg-amber-950/20 rounded border border-amber-800/20 cursor-default">
               <div className="w-1 h-1 rounded-full bg-amber-400 motion-safe:animate-pulse shrink-0" />
-              <span className="text-[10px] text-amber-300 truncate">{data.currentTask}</span>
+              <span className="text-[10px] text-warm truncate">{data.currentTask}</span>
             </div>
           </Tooltip>
         )}
 
         {/* Recursive sub-children rendered inside this card */}
         {hasSubChildren && depth < MAX_NESTING_DEPTH && (
-          <div className="mt-1.5 pt-1.5 border-t border-zinc-700/20">
-            <div className="text-[10px] text-zinc-400 uppercase tracking-widest mb-1">Team</div>
+          <div className="mt-1.5 pt-1.5 border-t border-line/20">
+            <div className="text-[10px] text-ink-mid uppercase tracking-widest mb-1">Team</div>
             <div className={subChildren.length >= 2 ? "grid grid-cols-2 gap-1" : "space-y-1"}>
               {subChildren.map((sub) => (
                 <TeamMemberChip key={sub.id} node={sub} allNodes={allNodes} depth={depth + 1} onSelect={onSelect} onExtract={onExtract} />

canvas/src/components/WorkspaceUsage.tsx

@@ -46,16 +46,16 @@ export function WorkspaceUsage({ workspaceId }: WorkspaceUsageProps) {
 
   return (
     <div
-      className="rounded-md border border-zinc-700 bg-zinc-900 p-3 space-y-2"
+      className="rounded-md border border-line bg-surface-sunken p-3 space-y-2"
       data-testid="workspace-usage"
     >
       <div className="flex items-center justify-between">
-        <h4 className="text-xs font-semibold text-zinc-400 uppercase tracking-wider">
+        <h4 className="text-xs font-semibold text-ink-mid uppercase tracking-wider">
           Usage
         </h4>
         {!loading && metrics && (
           <span
-            className="text-[10px] text-zinc-600 font-mono"
+            className="text-[10px] text-ink-soft font-mono"
             data-testid="usage-period"
           >
             {formatPeriod(metrics.period_start, metrics.period_end)}
@@ -71,7 +71,7 @@ export function WorkspaceUsage({ workspaceId }: WorkspaceUsageProps) {
             <SkeletonRow />
           </>
         ) : error ? (
-          <p className="text-xs text-red-400" data-testid="usage-error">
+          <p className="text-xs text-bad" data-testid="usage-error">
             {error}
           </p>
         ) : metrics ? (
@@ -114,8 +114,8 @@ function SkeletonRow() {
       className="flex justify-between items-center animate-pulse"
       data-testid="usage-skeleton-row"
     >
-      <div className="h-3 w-20 rounded bg-zinc-700" />
-      <div className="h-3 w-16 rounded bg-zinc-700" />
+      <div className="h-3 w-20 rounded bg-surface-card" />
+      <div className="h-3 w-16 rounded bg-surface-card" />
     </div>
   );
 }
@@ -131,8 +131,8 @@ function StatRow({
 }) {
   return (
     <div className="flex justify-between items-center" data-testid={testId}>
-      <span className="text-xs text-zinc-500">{label}</span>
-      <span className="text-xs text-zinc-400 font-mono">{value}</span>
+      <span className="text-xs text-ink-soft">{label}</span>
+      <span className="text-xs text-ink-mid font-mono">{value}</span>
     </div>
   );
 }

canvas/src/components/__tests__/AuthGate.test.tsx

@@ -51,7 +51,7 @@ describe("AuthGate — loading state", () => {
       </AuthGate>
     );
 
-    const overlay = container.querySelector(".bg-zinc-950.fixed.inset-0");
+    const overlay = container.querySelector(".bg-surface.fixed.inset-0");
     expect(overlay).not.toBeNull();
     expect(overlay?.getAttribute("aria-hidden")).toBe("true");
   });

canvas/src/components/__tests__/CreateWorkspaceDialog.test.tsx

@@ -190,6 +190,91 @@ describe("CreateWorkspaceDialog — Hermes provider picker", () => {
     expect(ids).toContain("hermes");
   });
 
+  // Pins the dynamic-providers behavior: when the matched template's
+  // /templates row declares `providers`, the dropdown filters to that
+  // subset instead of showing the full HERMES_PROVIDERS catalog. Same
+  // data source ConfigTab uses (PR #2454) — keeps the modal and the
+  // settings tab honest about which providers a template supports.
+  it("hermes provider dropdown filters to template-declared providers when /templates ships them", async () => {
+    // Per-URL mock: /workspaces returns the existing fixture, /templates
+    // returns a hermes row that only allows anthropic + minimax + openai.
+    mockGet.mockImplementation(async (url: string) => {
+      if (url === "/templates") {
+        return [
+          { id: "hermes", name: "Hermes", runtime: "hermes", providers: ["anthropic", "minimax", "openai"] },
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        ] as any;
+      }
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      return SAMPLE_WORKSPACES as any;
+    });
+
+    await openDialog();
+    await setTemplate("hermes");
+    await waitFor(() =>
+      expect(document.querySelector("[data-testid='hermes-provider-section']")).toBeTruthy()
+    );
+    const providerSelect = document.getElementById("hermes-provider-select") as HTMLSelectElement;
+    // Filtered list arrives async after /templates fetch resolves —
+    // keep waiting until the dropdown shrinks below the full catalog.
+    await waitFor(() => expect(providerSelect.options.length).toBe(3));
+    const ids = Array.from(providerSelect.options).map((o) => o.value);
+    expect(ids).toEqual(expect.arrayContaining(["anthropic", "minimax", "openai"]));
+    expect(ids).not.toContain("gemini");
+    expect(ids).not.toContain("deepseek");
+  });
+
+  // Back-compat: a template that hasn't migrated to runtime_config.providers
+  // (older templates, self-hosted setups without /templates server) keeps
+  // showing the full provider catalog. Operators picking from those
+  // templates can't be locked out of providers we know hermes supports.
+  it("hermes provider dropdown falls back to all providers when template declares no providers list", async () => {
+    mockGet.mockImplementation(async (url: string) => {
+      if (url === "/templates") {
+        // No `providers` field — empty/missing → fall back to full catalog.
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return [{ id: "hermes", name: "Hermes", runtime: "hermes" }] as any;
+      }
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      return SAMPLE_WORKSPACES as any;
+    });
+
+    await openDialog();
+    await setTemplate("hermes");
+    await waitFor(() =>
+      expect(document.querySelector("[data-testid='hermes-provider-section']")).toBeTruthy()
+    );
+    const providerSelect = document.getElementById("hermes-provider-select") as HTMLSelectElement;
+    expect(providerSelect.options.length).toBe(HERMES_PROVIDERS.length);
+  });
+
+  // Defensive: a template's declared list with NO matches against our
+  // static catalog (e.g. a brand-new provider id we don't have label/
+  // envVar metadata for yet) must not render an empty <select> — the
+  // operator can't pick a provider, the form locks. Component falls
+  // back to the full catalog so the user can still proceed.
+  it("hermes provider dropdown falls back to all providers when template declares only unknown providers", async () => {
+    mockGet.mockImplementation(async (url: string) => {
+      if (url === "/templates") {
+        return [
+          { id: "hermes", name: "Hermes", runtime: "hermes", providers: ["totally-new-provider-2030"] },
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        ] as any;
+      }
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      return SAMPLE_WORKSPACES as any;
+    });
+
+    await openDialog();
+    await setTemplate("hermes");
+    await waitFor(() =>
+      expect(document.querySelector("[data-testid='hermes-provider-section']")).toBeTruthy()
+    );
+    const providerSelect = document.getElementById("hermes-provider-select") as HTMLSelectElement;
+    // Stays at full catalog length — no flapping to 0 then back.
+    expect(providerSelect.options.length).toBe(HERMES_PROVIDERS.length);
+  });
+
   it("hermes API key field is a password input (masked)", async () => {
     await openDialog();
     await setTemplate("hermes");

canvas/src/components/__tests__/MissingKeysModal.cascade.test.tsx

@@ -0,0 +1,229 @@
+// @vitest-environment jsdom
+/**
+ * Provider→model cascade in the deploy modal.
+ *
+ * Original bug (2026-05-02 hongming Hermes Agent):
+ *   1. Modal pre-fills MODEL with template default (e.g. MiniMax-M2.7-highspeed)
+ *   2. Provider radio defaults to providers[0] (Anthropic) — wrong vendor
+ *   3. ENV-VAR input shows ANTHROPIC_API_KEY
+ *   4. User pastes a key, deploys
+ *   5. Workspace boots with model=MiniMax + ANTHROPIC_API_KEY → adapter
+ *      crashes before /registry/register → WORKSPACE_PROVISION_FAILED.
+ *
+ * Fix: pre-deploy modal back-derives provider from initialModel and pins
+ * the selector to the matching vendor. The dropdown UI (replacing the
+ * old radios in PR shipped 2026-05-02) keeps the same invariant.
+ */
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+
+import { MissingKeysModal, providerIdForModel } from "../MissingKeysModal";
+import { buildProviderCatalog } from "../ProviderModelSelector";
+import type { ModelSpec, ProviderChoice } from "@/lib/deploy-preflight";
+
+vi.mock("@/lib/api", () => ({
+  api: { get: vi.fn(), put: vi.fn() },
+}));
+
+vi.mock("@/lib/deploy-preflight", async () => {
+  const actual = await vi.importActual<typeof import("@/lib/deploy-preflight")>(
+    "@/lib/deploy-preflight",
+  );
+  return actual;
+});
+
+// Hermes-shaped fixture: 3 providers, multiple models per provider, one
+// "no required_env" local model that should never block a deploy.
+const HERMES_PROVIDERS: ProviderChoice[] = [
+  {
+    id: "ANTHROPIC_API_KEY",
+    label: "Anthropic (8 models)",
+    envVars: ["ANTHROPIC_API_KEY"],
+  },
+  {
+    id: "MINIMAX_API_KEY",
+    label: "MiniMax (2 models)",
+    envVars: ["MINIMAX_API_KEY"],
+  },
+  {
+    id: "OPENROUTER_API_KEY",
+    label: "OpenRouter (14 models)",
+    envVars: ["OPENROUTER_API_KEY"],
+  },
+];
+
+const HERMES_MODELS: ModelSpec[] = [
+  { id: "claude-sonnet-4-6", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "claude-opus-4-7", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "MiniMax-M2.7-highspeed", required_env: ["MINIMAX_API_KEY"] },
+  { id: "MiniMax-M2.7", required_env: ["MINIMAX_API_KEY"] },
+  { id: "openrouter/anthropic/claude-3.5-sonnet", required_env: ["OPENROUTER_API_KEY"] },
+  // Local/self-hosted endpoint — no required_env. Picker should
+  // never snap on this one because there's no provider to snap to.
+  { id: "local-llama3", required_env: [] },
+];
+
+/** Resolve the selector option-value for a given vendor against the
+ *  vendor-aware catalog. Catalog ids are `${vendor}|${sortedEnv}`, so
+ *  test code shouldn't hard-code them. */
+function providerIdForVendor(vendor: string): string {
+  const catalog = buildProviderCatalog(HERMES_MODELS);
+  const entry = catalog.find((p) => p.vendor === vendor);
+  if (!entry) throw new Error(`vendor "${vendor}" not in catalog`);
+  return entry.id;
+}
+
+describe("providerIdForModel (legacy helper, still exported for tests)", () => {
+  it("returns the provider id (sorted+joined required_env) for a known model", () => {
+    expect(providerIdForModel("MiniMax-M2.7-highspeed", HERMES_MODELS)).toBe(
+      "MINIMAX_API_KEY",
+    );
+    expect(providerIdForModel("claude-opus-4-7", HERMES_MODELS)).toBe(
+      "ANTHROPIC_API_KEY",
+    );
+  });
+
+  it("sorts required_env so the id matches providersFromTemplate's formula", () => {
+    const models: ModelSpec[] = [
+      { id: "weird", required_env: ["Z_KEY", "A_KEY"] },
+    ];
+    expect(providerIdForModel("weird", models)).toBe("A_KEY|Z_KEY");
+  });
+
+  it("trims whitespace before lookup so a stray space doesn't miss a match", () => {
+    expect(providerIdForModel("  MiniMax-M2.7  ", HERMES_MODELS)).toBe(
+      "MINIMAX_API_KEY",
+    );
+  });
+
+  it("returns null for empty / undefined / whitespace-only model id", () => {
+    expect(providerIdForModel("", HERMES_MODELS)).toBeNull();
+    expect(providerIdForModel("   ", HERMES_MODELS)).toBeNull();
+  });
+
+  it("returns null when models are not provided (free-text mode)", () => {
+    expect(providerIdForModel("anything", undefined)).toBeNull();
+  });
+
+  it("returns null when model isn't in the registry (free-text)", () => {
+    expect(providerIdForModel("not-a-listed-model", HERMES_MODELS)).toBeNull();
+  });
+
+  it("returns null when the model has no required_env (local endpoint)", () => {
+    expect(providerIdForModel("local-llama3", HERMES_MODELS)).toBeNull();
+  });
+});
+
+describe("ProviderPickerModal — model→provider cascade (dropdown UI)", () => {
+  afterEach(() => cleanup());
+
+  // The headline bug: opening the modal with the MiniMax default
+  // pre-filled should NOT leave the selector on Anthropic just because
+  // Anthropic was first in providers[]. Back-derivation snaps it on
+  // first paint to the MiniMax vendor entry.
+  it("snaps provider selector to MiniMax when initialModel is a MiniMax model", () => {
+    render(
+      <MissingKeysModal
+        open
+        missingKeys={["ANTHROPIC_API_KEY", "MINIMAX_API_KEY", "OPENROUTER_API_KEY"]}
+        providers={HERMES_PROVIDERS}
+        runtime="hermes"
+        modelSuggestions={HERMES_MODELS.map((m) => m.id)}
+        models={HERMES_MODELS}
+        initialModel="MiniMax-M2.7-highspeed"
+        onKeysAdded={vi.fn()}
+        onCancel={vi.fn()}
+      />,
+    );
+    const providerSelect = screen.getByTestId("provider-select") as HTMLSelectElement;
+    expect(providerSelect.value).toBe(providerIdForVendor("minimax"));
+    // The env-var input underneath should be for MINIMAX_API_KEY,
+    // not ANTHROPIC_API_KEY — that's the load-bearing UX win. The
+    // entry uses a password input with a fixed "sk-..." placeholder
+    // when the key name contains "API_KEY"; assert exactly ONE such
+    // input exists, which proves only the selected provider's envVars
+    // were rendered into entries[].
+    const apiKeyInputs = screen.getAllByPlaceholderText("sk-...");
+    expect(apiKeyInputs).toHaveLength(1);
+  });
+
+  // Mid-flow change: user starts with the pre-filled MiniMax model and
+  // switches the provider dropdown to Anthropic. Env-var rows below
+  // re-render to show ANTHROPIC_API_KEY only. Same shape-pin as above.
+  it("re-renders credential entries when provider is switched", () => {
+    render(
+      <MissingKeysModal
+        open
+        missingKeys={["ANTHROPIC_API_KEY", "MINIMAX_API_KEY", "OPENROUTER_API_KEY"]}
+        providers={HERMES_PROVIDERS}
+        runtime="hermes"
+        modelSuggestions={HERMES_MODELS.map((m) => m.id)}
+        models={HERMES_MODELS}
+        initialModel="MiniMax-M2.7-highspeed"
+        onKeysAdded={vi.fn()}
+        onCancel={vi.fn()}
+      />,
+    );
+    const providerSelect = screen.getByTestId("provider-select") as HTMLSelectElement;
+    fireEvent.change(providerSelect, {
+      target: { value: providerIdForVendor("anthropic") },
+    });
+    expect(providerSelect.value).toBe(providerIdForVendor("anthropic"));
+    // Exactly one password input means only the selected provider's
+    // envVars landed in entries[].
+    expect(screen.getAllByPlaceholderText("sk-...")).toHaveLength(1);
+  });
+
+  // Backwards-compat: callers that don't pass `models` (legacy
+  // call sites) fall back to a synthesized catalog from `providers`
+  // — selector still works, but vendor split is degraded to env-tuple
+  // grouping (one entry per ProviderChoice).
+  it("falls back to providers[] when models prop is omitted", () => {
+    render(
+      <MissingKeysModal
+        open
+        missingKeys={["ANTHROPIC_API_KEY", "MINIMAX_API_KEY", "OPENROUTER_API_KEY"]}
+        providers={HERMES_PROVIDERS}
+        runtime="hermes"
+        modelSuggestions={HERMES_MODELS.map((m) => m.id)}
+        // models intentionally omitted — legacy caller shape.
+        onKeysAdded={vi.fn()}
+        onCancel={vi.fn()}
+      />,
+    );
+    // Without `models`, no back-derivation: selector defaults to
+    // providers[0] (Anthropic). Dropdown still populated with all 3
+    // entries — synthesized catalog uses `${vendor}|${envTuple}` ids
+    // (matching the selector's own catalog shape), so the value is
+    // "anthropic|ANTHROPIC_API_KEY", not the raw "ANTHROPIC_API_KEY".
+    const providerSelect = screen.getByTestId("provider-select") as HTMLSelectElement;
+    expect(providerSelect.value).toBe("anthropic|ANTHROPIC_API_KEY");
+    expect(providerSelect.options.length).toBeGreaterThanOrEqual(4); // 3 providers + the disabled placeholder
+  });
+
+  // configuredKeys interaction: when a provider's keys are already
+  // saved globally, the picker pre-selects that satisfied provider.
+  // BUT the model-derived snap still wins — the user explicitly
+  // picked a model, that intent overrides "you already have this key".
+  it("model-derived selection beats configuredKeys-satisfied default", () => {
+    render(
+      <MissingKeysModal
+        open
+        missingKeys={["ANTHROPIC_API_KEY", "MINIMAX_API_KEY", "OPENROUTER_API_KEY"]}
+        providers={HERMES_PROVIDERS}
+        runtime="hermes"
+        // User has Anthropic globally. Without back-derivation,
+        // selector would land on Anthropic. WITH it, the typed
+        // MiniMax model wins.
+        configuredKeys={new Set(["ANTHROPIC_API_KEY"])}
+        modelSuggestions={HERMES_MODELS.map((m) => m.id)}
+        models={HERMES_MODELS}
+        initialModel="MiniMax-M2.7-highspeed"
+        onKeysAdded={vi.fn()}
+        onCancel={vi.fn()}
+      />,
+    );
+    const providerSelect = screen.getByTestId("provider-select") as HTMLSelectElement;
+    expect(providerSelect.value).toBe(providerIdForVendor("minimax"));
+  });
+});

canvas/src/components/__tests__/ProviderModelSelector.test.tsx

@@ -0,0 +1,294 @@
+// @vitest-environment jsdom
+/**
+ * ProviderModelSelector — vendor detection + dropdown cascade.
+ */
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+
+import {
+  ProviderModelSelector,
+  buildProviderCatalog,
+  inferVendor,
+  findProviderForModel,
+  type SelectorModel,
+  type SelectorValue,
+} from "../ProviderModelSelector";
+
+afterEach(() => cleanup());
+
+// Fixture mirrors the real claude-code-default config.yaml — covers
+// the env-collision scenario (9 models share ANTHROPIC_AUTH_TOKEN
+// but represent 4 distinct vendors).
+const CLAUDE_CODE_MODELS: SelectorModel[] = [
+  { id: "sonnet", name: "Claude Sonnet (OAuth)", required_env: ["CLAUDE_CODE_OAUTH_TOKEN"] },
+  { id: "opus", name: "Claude Opus (OAuth)", required_env: ["CLAUDE_CODE_OAUTH_TOKEN"] },
+  { id: "haiku", name: "Claude Haiku (OAuth)", required_env: ["CLAUDE_CODE_OAUTH_TOKEN"] },
+  { id: "claude-sonnet-4-6", name: "Claude Sonnet 4.6 (API)", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "claude-opus-4-7", name: "Claude Opus 4.7 (API)", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "mimo-v2-flash", name: "Xiaomi MiMo Flash", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "mimo-v2-pro", name: "Xiaomi MiMo Pro", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "MiniMax-M2", name: "MiniMax M2", required_env: ["ANTHROPIC_AUTH_TOKEN"] },
+  { id: "MiniMax-M2.7", name: "MiniMax M2.7", required_env: ["ANTHROPIC_AUTH_TOKEN"] },
+  { id: "GLM-4.6", name: "Z.ai GLM-4.6", required_env: ["ANTHROPIC_AUTH_TOKEN"] },
+  { id: "kimi-k2", name: "Moonshot Kimi K2", required_env: ["ANTHROPIC_AUTH_TOKEN"] },
+  { id: "deepseek-v4-pro", name: "DeepSeek V4 Pro", required_env: ["ANTHROPIC_AUTH_TOKEN"] },
+];
+
+const HERMES_MODELS: SelectorModel[] = [
+  { id: "nousresearch/hermes-4-70b", name: "Hermes 4 70B", required_env: ["HERMES_API_KEY"] },
+  { id: "anthropic/claude-sonnet-4-5", name: "Claude Sonnet (direct)", required_env: ["ANTHROPIC_API_KEY"] },
+  { id: "openai/gpt-5", name: "GPT-5 via OR", required_env: ["OPENROUTER_API_KEY"] },
+  { id: "huggingface/*", name: "Any HF model", required_env: ["HF_TOKEN"] },
+  { id: "openrouter/*", name: "Any OpenRouter model", required_env: ["OPENROUTER_API_KEY"] },
+  { id: "custom/*", name: "Self-hosted endpoint", required_env: [] },
+];
+
+describe("inferVendor", () => {
+  it("uses slash prefix when present", () => {
+    expect(inferVendor({ id: "nousresearch/hermes-4-70b", required_env: ["HERMES_API_KEY"] }))
+      .toBe("nousresearch");
+    expect(inferVendor({ id: "anthropic/claude-sonnet-4-5", required_env: ["ANTHROPIC_API_KEY"] }))
+      .toBe("anthropic");
+    expect(inferVendor({ id: "openai/gpt-5", required_env: ["OPENROUTER_API_KEY"] }))
+      .toBe("openai");
+  });
+
+  it("infers vendor from bare-id pattern when no slash", () => {
+    expect(inferVendor({ id: "MiniMax-M2.7", required_env: ["ANTHROPIC_AUTH_TOKEN"] })).toBe("minimax");
+    expect(inferVendor({ id: "GLM-4.6", required_env: ["ANTHROPIC_AUTH_TOKEN"] })).toBe("zai");
+    expect(inferVendor({ id: "kimi-k2", required_env: ["ANTHROPIC_AUTH_TOKEN"] })).toBe("moonshot");
+    expect(inferVendor({ id: "deepseek-v4-pro", required_env: ["ANTHROPIC_AUTH_TOKEN"] })).toBe("deepseek");
+    expect(inferVendor({ id: "mimo-v2-flash", required_env: ["ANTHROPIC_API_KEY"] })).toBe("xiaomi-mimo");
+    expect(inferVendor({ id: "claude-sonnet-4-6", required_env: ["ANTHROPIC_API_KEY"] })).toBe("anthropic");
+  });
+
+  it("treats bare sonnet/opus/haiku as anthropic-oauth ONLY when env demands OAuth", () => {
+    expect(inferVendor({ id: "sonnet", required_env: ["CLAUDE_CODE_OAUTH_TOKEN"] }))
+      .toBe("anthropic-oauth");
+    expect(inferVendor({ id: "opus", required_env: ["CLAUDE_CODE_OAUTH_TOKEN"] }))
+      .toBe("anthropic-oauth");
+    // Hypothetical sonnet alias against API key — must NOT be tagged OAuth.
+    expect(inferVendor({ id: "sonnet", required_env: ["ANTHROPIC_API_KEY"] }))
+      .toBe("anthropic");
+  });
+
+  it("falls back to env namespace for unknown vendors", () => {
+    expect(inferVendor({ id: "unknown-id", required_env: ["OPENROUTER_API_KEY"] }))
+      .toBe("openrouter");
+    expect(inferVendor({ id: "unknown-id", required_env: ["HERMES_API_KEY"] }))
+      .toBe("hermes");
+  });
+});
+
+describe("buildProviderCatalog", () => {
+  it("splits ANTHROPIC_AUTH_TOKEN models by vendor (not just env)", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const vendors = catalog.map((p) => p.vendor).sort();
+    // The 4 third-party vendors that share ANTHROPIC_AUTH_TOKEN must
+    // all appear as separate entries.
+    expect(vendors).toContain("minimax");
+    expect(vendors).toContain("zai");
+    expect(vendors).toContain("moonshot");
+    expect(vendors).toContain("deepseek");
+    // Plus the OAuth, Anthropic API, and Xiaomi MiMo entries.
+    expect(vendors).toContain("anthropic-oauth");
+    expect(vendors).toContain("anthropic");
+    expect(vendors).toContain("xiaomi-mimo");
+  });
+
+  it("buckets models under the correct vendor", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const minimax = catalog.find((p) => p.vendor === "minimax");
+    expect(minimax).toBeDefined();
+    expect(minimax!.models.map((m) => m.id).sort()).toEqual(["MiniMax-M2", "MiniMax-M2.7"]);
+    const oauth = catalog.find((p) => p.vendor === "anthropic-oauth");
+    expect(oauth!.models.map((m) => m.id).sort()).toEqual(["haiku", "opus", "sonnet"]);
+  });
+
+  it("flags wildcard providers", () => {
+    const catalog = buildProviderCatalog(HERMES_MODELS);
+    const hf = catalog.find((p) => p.vendor === "huggingface");
+    expect(hf?.wildcard).toBe(true);
+    const custom = catalog.find((p) => p.vendor === "custom");
+    expect(custom?.wildcard).toBe(true);
+    const nous = catalog.find((p) => p.vendor === "nousresearch");
+    expect(nous?.wildcard).toBe(false);
+  });
+
+  it("decorates label with model count when ≥2 concrete models", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const oauth = catalog.find((p) => p.vendor === "anthropic-oauth");
+    expect(oauth?.label).toMatch(/3 models/);
+    // Wildcard buckets don't get the count suffix.
+    const hfCatalog = buildProviderCatalog(HERMES_MODELS);
+    const hf = hfCatalog.find((p) => p.vendor === "huggingface");
+    expect(hf?.label).not.toMatch(/models\)/);
+  });
+});
+
+describe("findProviderForModel", () => {
+  const catalog = buildProviderCatalog(HERMES_MODELS);
+
+  it("matches concrete model ids directly", () => {
+    expect(findProviderForModel(catalog, "nousresearch/hermes-4-70b")?.vendor)
+      .toBe("nousresearch");
+    expect(findProviderForModel(catalog, "openai/gpt-5")?.vendor).toBe("openai");
+  });
+
+  it("matches wildcard providers by prefix", () => {
+    expect(findProviderForModel(catalog, "huggingface/meta-llama/Meta-Llama-3-70B")?.vendor)
+      .toBe("huggingface");
+    expect(findProviderForModel(catalog, "openrouter/anthropic/claude-3.5-sonnet")?.vendor)
+      .toBe("openrouter");
+    expect(findProviderForModel(catalog, "custom/local-vllm")?.vendor).toBe("custom");
+  });
+
+  it("returns null on no match", () => {
+    expect(findProviderForModel(catalog, "")).toBeNull();
+    expect(findProviderForModel(catalog, "unknown-model-xyz")).toBeNull();
+  });
+});
+
+// -----------------------------------------------------------------------------
+// Component behavior
+// -----------------------------------------------------------------------------
+
+function setup(overrides?: Partial<{ value: SelectorValue; models: SelectorModel[]; onChange: (v: SelectorValue) => void }>) {
+  const onChange = overrides?.onChange ?? vi.fn();
+  const value: SelectorValue = overrides?.value ?? { providerId: "", model: "", envVars: [] };
+  render(
+    <ProviderModelSelector
+      models={overrides?.models ?? CLAUDE_CODE_MODELS}
+      value={value}
+      onChange={onChange}
+    />,
+  );
+  return { onChange };
+}
+
+describe("<ProviderModelSelector>", () => {
+  it("renders provider dropdown with all vendor options", () => {
+    setup();
+    const select = screen.getByTestId("provider-select") as HTMLSelectElement;
+    const optionTexts = Array.from(select.options).map((o) => o.text);
+    expect(optionTexts).toContain("Claude Code subscription (3 models)");
+    expect(optionTexts.some((t) => t.startsWith("MiniMax"))).toBe(true);
+    expect(optionTexts.some((t) => t.startsWith("Z.ai"))).toBe(true);
+  });
+
+  it("model dropdown is disabled until provider is picked", () => {
+    setup();
+    const modelSelect = screen.getByTestId("model-select") as HTMLSelectElement;
+    expect(modelSelect.disabled).toBe(true);
+  });
+
+  it("picking a multi-model provider emits onChange with empty model (forces explicit pick)", () => {
+    const { onChange } = setup();
+    const providerSelect = screen.getByTestId("provider-select");
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const minimax = catalog.find((p) => p.vendor === "minimax")!;
+    // MiniMax bucket holds 2 models (MiniMax-M2 + MiniMax-M2.7). Auto-
+    // picking the first one used to bite a real user (2026-05-03):
+    // they wanted M2.7 but the silent default put M2 in the deploy
+    // payload. Now the model field must come back empty so the next
+    // dropdown is required-empty and Save/Deploy stay disabled until
+    // the user picks.
+    fireEvent.change(providerSelect, { target: { value: minimax.id } });
+    expect(onChange).toHaveBeenCalledWith({
+      providerId: minimax.id,
+      model: "",
+      envVars: ["ANTHROPIC_AUTH_TOKEN"],
+    });
+  });
+
+  it("picking a single-model provider auto-fills the model (no choice to make)", () => {
+    const { onChange } = setup();
+    const providerSelect = screen.getByTestId("provider-select");
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    // GLM-4.6 is the only model under the zai vendor in the fixture —
+    // a "0 vs many" boundary check. With only one option, forcing the
+    // user to re-pick adds friction without preventing any error.
+    const zai = catalog.find((p) => p.vendor === "zai")!;
+    expect(zai.models.length).toBe(1);
+    fireEvent.change(providerSelect, { target: { value: zai.id } });
+    expect(onChange).toHaveBeenCalledWith({
+      providerId: zai.id,
+      model: "GLM-4.6",
+      envVars: ["ANTHROPIC_AUTH_TOKEN"],
+    });
+  });
+
+  it("picking provider then model emits combined value", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const minimax = catalog.find((p) => p.vendor === "minimax")!;
+    const onChange = vi.fn();
+    setup({
+      value: { providerId: minimax.id, model: "MiniMax-M2", envVars: ["ANTHROPIC_AUTH_TOKEN"] },
+      onChange,
+    });
+    const modelSelect = screen.getByTestId("model-select");
+    fireEvent.change(modelSelect, { target: { value: "MiniMax-M2.7" } });
+    expect(onChange).toHaveBeenCalledWith({
+      providerId: minimax.id,
+      model: "MiniMax-M2.7",
+      envVars: ["ANTHROPIC_AUTH_TOKEN"],
+    });
+  });
+
+  it("wildcard provider switches model UI to free-text input", () => {
+    const catalog = buildProviderCatalog(HERMES_MODELS);
+    const hf = catalog.find((p) => p.vendor === "huggingface")!;
+    setup({
+      models: HERMES_MODELS,
+      value: { providerId: hf.id, model: "", envVars: hf.envVars },
+    });
+    expect(screen.queryByTestId("model-select")).toBeNull();
+    expect(screen.queryByTestId("model-input")).not.toBeNull();
+  });
+
+  it("wildcard input emits typed value as model", () => {
+    const catalog = buildProviderCatalog(HERMES_MODELS);
+    const openrouter = catalog.find((p) => p.vendor === "openrouter")!;
+    const onChange = vi.fn();
+    setup({
+      models: HERMES_MODELS,
+      value: { providerId: openrouter.id, model: "", envVars: openrouter.envVars },
+      onChange,
+    });
+    const input = screen.getByTestId("model-input");
+    fireEvent.change(input, { target: { value: "openrouter/anthropic/claude-3.5-sonnet" } });
+    expect(onChange).toHaveBeenCalledWith({
+      providerId: openrouter.id,
+      model: "openrouter/anthropic/claude-3.5-sonnet",
+      envVars: ["OPENROUTER_API_KEY"],
+    });
+  });
+
+  it("renders required env hint for selected provider", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const oauth = catalog.find((p) => p.vendor === "anthropic-oauth")!;
+    setup({
+      value: { providerId: oauth.id, model: "sonnet", envVars: oauth.envVars },
+    });
+    expect(screen.getByText(/requires:/).textContent).toMatch(/CLAUDE_CODE_OAUTH_TOKEN/);
+  });
+
+  it("switching to a multi-model provider clears the stale model id", () => {
+    const catalog = buildProviderCatalog(CLAUDE_CODE_MODELS);
+    const oauth = catalog.find((p) => p.vendor === "anthropic-oauth")!;
+    const minimax = catalog.find((p) => p.vendor === "minimax")!;
+    const onChange = vi.fn();
+    setup({
+      value: { providerId: oauth.id, model: "sonnet", envVars: oauth.envVars },
+      onChange,
+    });
+    fireEvent.change(screen.getByTestId("provider-select"), { target: { value: minimax.id } });
+    // Empty rather than auto-picked — see "picking a multi-model
+    // provider …" test above for the user-facing rationale.
+    expect(onChange).toHaveBeenCalledWith({
+      providerId: minimax.id,
+      model: "",
+      envVars: ["ANTHROPIC_AUTH_TOKEN"],
+    });
+  });
+});

canvas/src/components/canvas/A2AEdge.tsx

@@ -89,7 +89,7 @@ function A2AEdgeImpl({
   // The edge stroke color matches what buildA2AEdges sets on the SVG
   // path style. Mirror it on the badge border so the visual identity
   // (hot=violet vs warm=blue) carries to the clickable label.
-  const accent = isHot ? "border-violet-500/60" : "border-blue-500/60";
+  const accent = isHot ? "border-violet-500/60" : "border-accent/60";
   const accentText = isHot ? "text-violet-200" : "text-blue-200";
   const ariaLabel = `${count} delegation${count === 1 ? "" : "s"} from ${
     edgeData.label?.split(" · ")[1] ?? "recent"
@@ -119,7 +119,7 @@ function A2AEdgeImpl({
               onClick={handleClick}
               aria-label={ariaLabel}
               title="Open source workspace's activity feed"
-              className={`px-2 py-0.5 rounded-full bg-zinc-900/95 border ${accent} ${accentText} text-[10px] font-medium shadow-md shadow-black/40 backdrop-blur-sm hover:bg-zinc-800 hover:border-opacity-100 transition-colors cursor-pointer`}
+              className={`px-2 py-0.5 rounded-full bg-surface-sunken/95 border ${accent} ${accentText} text-[10px] font-medium shadow-md shadow-black/40 backdrop-blur-sm hover:bg-surface-card hover:border-opacity-100 transition-colors cursor-pointer`}
             >
               {labelText}
             </button>

canvas/src/components/canvas/OrgCancelButton.tsx

@@ -112,10 +112,10 @@ export function OrgCancelButton({ rootId, rootName, workspaceCount }: Props) {
   if (confirming) {
     return (
       <div
-        className="nodrag absolute -top-10 right-0 z-20 flex items-center gap-1.5 rounded-lg bg-zinc-900/95 px-2 py-1 shadow-lg border border-red-800/60"
+        className="nodrag absolute -top-10 right-0 z-20 flex items-center gap-1.5 rounded-lg bg-surface-sunken/95 px-2 py-1 shadow-lg border border-red-800/60"
         onClick={(e) => e.stopPropagation()}
       >
-        <span className="text-[10px] text-zinc-300">
+        <span className="text-[10px] text-ink-mid">
           Delete {workspaceCount} workspace{workspaceCount === 1 ? "" : "s"}?
         </span>
         <button
@@ -130,7 +130,7 @@ export function OrgCancelButton({ rootId, rootName, workspaceCount }: Props) {
           type="button"
           onClick={() => setConfirming(false)}
           disabled={submitting}
-          className="px-2 py-0.5 rounded bg-zinc-700/80 hover:bg-zinc-600 text-[10px] text-zinc-200"
+          className="px-2 py-0.5 rounded bg-surface-card/80 hover:bg-surface-card text-[10px] text-ink"
         >
           No
         </button>

canvas/src/components/canvas/__tests__/A2AEdge.test.tsx

@@ -168,7 +168,10 @@ describe("A2AEdge — render", () => {
       />,
     );
     const btn = screen.getByRole("button");
-    expect(btn.className).toContain("border-blue-500/60");
+    // Warm-paper migration: blue-500 border was mapped to the semantic
+    // accent token; the text-blue-200 literal is intentionally retained
+    // because tinted-state pill text reads in both themes.
+    expect(btn.className).toContain("border-accent/60");
     expect(btn.className).toContain("text-blue-200");
   });
 

canvas/src/components/settings/OrgTokensTab.tsx

@@ -105,11 +105,11 @@ export function OrgTokensTab() {
     <div className="p-4 space-y-4">
       <div>
         <div className="flex items-center justify-between mb-1">
-          <h3 className="text-sm font-semibold text-zinc-200">
+          <h3 className="text-sm font-semibold text-ink">
             Organization API Keys
           </h3>
         </div>
-        <p className="text-[10px] text-zinc-500 leading-relaxed">
+        <p className="text-[10px] text-ink-soft leading-relaxed">
           Full-admin bearer tokens for this organization. Use with external
           integrations, CLI tools, or AI agents that need to manage
           workspaces, settings, and secrets. Each key has the same
@@ -126,12 +126,12 @@ export function OrgTokensTab() {
           placeholder="Label (e.g. zapier, my-ci)"
           maxLength={100}
           aria-label="Organization API key label"
-          className="flex-1 text-[11px] bg-zinc-900/60 border border-zinc-700/50 rounded px-2 py-1.5 text-zinc-200 placeholder-zinc-600"
+          className="flex-1 text-[11px] bg-surface-sunken/60 border border-line/50 rounded px-2 py-1.5 text-ink placeholder-zinc-600"
         />
         <button
           onClick={handleCreate}
           disabled={creating}
-          className="px-3 py-1.5 bg-blue-600/20 hover:bg-blue-600/30 border border-blue-500/30 rounded-lg text-[11px] text-blue-300 font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-1.5"
+          className="px-3 py-1.5 bg-accent-strong/20 hover:bg-accent-strong/30 border border-accent/30 rounded-lg text-[11px] text-accent font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-1.5"
         >
           {creating ? (
             <>
@@ -147,10 +147,10 @@ export function OrgTokensTab() {
       {newToken && (
         <div className="bg-emerald-950/30 border border-emerald-800/40 rounded-lg p-3 space-y-2">
           <div className="flex items-center gap-2">
-            <span className="text-[10px] text-emerald-400 font-semibold uppercase tracking-wider">
+            <span className="text-[10px] text-good font-semibold uppercase tracking-wider">
               {newTokenName ? `New Key: ${newTokenName}` : 'New Key Created'}
             </span>
-            <span className="text-[9px] text-emerald-500/70">
+            <span className="text-[9px] text-good/70">
               Copy now — it won't be shown again
             </span>
           </div>
@@ -160,14 +160,14 @@ export function OrgTokensTab() {
             </code>
             <button
               onClick={handleCopy}
-              className="shrink-0 px-2 py-1.5 bg-emerald-800/40 hover:bg-emerald-700/50 border border-emerald-700/40 rounded text-[10px] text-emerald-300 transition-colors"
+              className="shrink-0 px-2 py-1.5 bg-emerald-800/40 hover:bg-emerald-700/50 border border-emerald-700/40 rounded text-[10px] text-good transition-colors"
             >
               {copied ? 'Copied' : 'Copy'}
             </button>
           </div>
           <button
             onClick={() => setNewToken(null)}
-            className="text-[9px] text-emerald-500/60 hover:text-emerald-400 transition-colors"
+            className="text-[9px] text-good/60 hover:text-good transition-colors"
           >
             Dismiss
           </button>
@@ -175,20 +175,20 @@ export function OrgTokensTab() {
       )}
 
       {error && (
-        <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[10px] text-red-400">
+        <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[10px] text-bad">
           {error}
         </div>
       )}
 
       {/* Token list */}
       {loading ? (
-        <div className="flex items-center justify-center gap-2 py-6 text-zinc-500 text-xs">
+        <div className="flex items-center justify-center gap-2 py-6 text-ink-soft text-xs">
           <Spinner /> Loading keys...
         </div>
       ) : tokens.length === 0 ? (
         <div className="text-center py-6">
-          <p className="text-xs text-zinc-500">No active keys</p>
-          <p className="text-[10px] text-zinc-600 mt-1">
+          <p className="text-xs text-ink-soft">No active keys</p>
+          <p className="text-[10px] text-ink-soft mt-1">
             Create a key above to authenticate API calls to this organization.
           </p>
         </div>
@@ -197,19 +197,19 @@ export function OrgTokensTab() {
           {tokens.map((t) => (
             <div
               key={t.id}
-              className="flex items-center justify-between bg-zinc-800/40 border border-zinc-700/30 rounded-lg px-3 py-2"
+              className="flex items-center justify-between bg-surface-card/40 border border-line/30 rounded-lg px-3 py-2"
             >
               <div className="flex items-center gap-3 min-w-0 flex-1">
-                <code className="text-[11px] font-mono text-zinc-300 bg-zinc-900/60 px-1.5 py-0.5 rounded shrink-0">
+                <code className="text-[11px] font-mono text-ink-mid bg-surface-sunken/60 px-1.5 py-0.5 rounded shrink-0">
                   {t.prefix}...
                 </code>
                 <div className="flex flex-col min-w-0">
                   {t.name && (
-                    <span className="text-[11px] text-zinc-200 truncate">
+                    <span className="text-[11px] text-ink truncate">
                       {t.name}
                     </span>
                   )}
-                  <div className="text-[9px] text-zinc-500 space-x-3">
+                  <div className="text-[9px] text-ink-soft space-x-3">
                     <span>Created {formatAge(t.created_at)}</span>
                     {t.last_used_at && (
                       <span>Last used {formatAge(t.last_used_at)}</span>
@@ -219,7 +219,7 @@ export function OrgTokensTab() {
               </div>
               <button
                 onClick={() => setRevokeTarget(t)}
-                className="text-[10px] text-red-400/70 hover:text-red-400 transition-colors px-2 py-1 shrink-0"
+                className="text-[10px] text-bad/70 hover:text-bad transition-colors px-2 py-1 shrink-0"
               >
                 Revoke
               </button>

canvas/src/components/settings/TokensTab.tsx

@@ -80,15 +80,15 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
     <div className="p-4 space-y-4">
       <div className="flex items-center justify-between">
         <div>
-          <h3 className="text-sm font-semibold text-zinc-200">API Tokens</h3>
-          <p className="text-[10px] text-zinc-500 mt-0.5">
+          <h3 className="text-sm font-semibold text-ink">API Tokens</h3>
+          <p className="text-[10px] text-ink-soft mt-0.5">
             Bearer tokens for authenticating API calls to this workspace.
           </p>
         </div>
         <button
           onClick={handleCreate}
           disabled={creating}
-          className="px-3 py-1.5 bg-blue-600/20 hover:bg-blue-600/30 border border-blue-500/30 rounded-lg text-[11px] text-blue-300 font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-1.5"
+          className="px-3 py-1.5 bg-accent-strong/20 hover:bg-accent-strong/30 border border-accent/30 rounded-lg text-[11px] text-accent font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-1.5"
         >
           {creating ? <><Spinner size="sm" /> Creating...</> : '+ New Token'}
         </button>
@@ -98,8 +98,8 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
       {newToken && (
         <div className="bg-emerald-950/30 border border-emerald-800/40 rounded-lg p-3 space-y-2">
           <div className="flex items-center gap-2">
-            <span className="text-[10px] text-emerald-400 font-semibold uppercase tracking-wider">New Token Created</span>
-            <span className="text-[9px] text-emerald-500/70">Copy now — it won't be shown again</span>
+            <span className="text-[10px] text-good font-semibold uppercase tracking-wider">New Token Created</span>
+            <span className="text-[9px] text-good/70">Copy now — it won't be shown again</span>
           </div>
           <div className="flex items-center gap-2">
             <code className="flex-1 text-[11px] text-emerald-200 bg-emerald-950/50 px-2 py-1.5 rounded font-mono break-all select-all">
@@ -107,14 +107,14 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
             </code>
             <button
               onClick={handleCopy}
-              className="shrink-0 px-2 py-1.5 bg-emerald-800/40 hover:bg-emerald-700/50 border border-emerald-700/40 rounded text-[10px] text-emerald-300 transition-colors"
+              className="shrink-0 px-2 py-1.5 bg-emerald-800/40 hover:bg-emerald-700/50 border border-emerald-700/40 rounded text-[10px] text-good transition-colors"
             >
               {copied ? 'Copied' : 'Copy'}
             </button>
           </div>
           <button
             onClick={() => setNewToken(null)}
-            className="text-[9px] text-emerald-500/60 hover:text-emerald-400 transition-colors"
+            className="text-[9px] text-good/60 hover:text-good transition-colors"
           >
             Dismiss
           </button>
@@ -122,20 +122,20 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
       )}
 
       {error && (
-        <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[10px] text-red-400">
+        <div className="px-3 py-2 bg-red-950/40 border border-red-800/50 rounded-lg text-[10px] text-bad">
           {error}
         </div>
       )}
 
       {/* Token list */}
       {loading ? (
-        <div className="flex items-center justify-center gap-2 py-6 text-zinc-500 text-xs">
+        <div className="flex items-center justify-center gap-2 py-6 text-ink-soft text-xs">
           <Spinner /> Loading tokens...
         </div>
       ) : tokens.length === 0 ? (
         <div className="text-center py-6">
-          <p className="text-xs text-zinc-500">No active tokens</p>
-          <p className="text-[10px] text-zinc-600 mt-1">
+          <p className="text-xs text-ink-soft">No active tokens</p>
+          <p className="text-[10px] text-ink-soft mt-1">
             Create a token to authenticate API calls.
           </p>
         </div>
@@ -144,13 +144,13 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
           {tokens.map((t) => (
             <div
               key={t.id}
-              className="flex items-center justify-between bg-zinc-800/40 border border-zinc-700/30 rounded-lg px-3 py-2"
+              className="flex items-center justify-between bg-surface-card/40 border border-line/30 rounded-lg px-3 py-2"
             >
               <div className="flex items-center gap-3 min-w-0">
-                <code className="text-[11px] font-mono text-zinc-300 bg-zinc-900/60 px-1.5 py-0.5 rounded">
+                <code className="text-[11px] font-mono text-ink-mid bg-surface-sunken/60 px-1.5 py-0.5 rounded">
                   {t.prefix}...
                 </code>
-                <div className="text-[9px] text-zinc-500 space-x-3">
+                <div className="text-[9px] text-ink-soft space-x-3">
                   <span>Created {formatAge(t.created_at)}</span>
                   {t.last_used_at && (
                     <span>Last used {formatAge(t.last_used_at)}</span>
@@ -159,7 +159,7 @@ export function TokensTab({ workspaceId }: TokensTabProps) {
               </div>
               <button
                 onClick={() => setRevokeTarget(t)}
-                className="text-[10px] text-red-400/70 hover:text-red-400 transition-colors px-2 py-1"
+                className="text-[10px] text-bad/70 hover:text-bad transition-colors px-2 py-1"
               >
                 Revoke
               </button>

canvas/src/components/tabs/ActivityTab.tsx

@@ -24,18 +24,18 @@ const FILTERS: { id: FilterType; label: string; icon: string }[] = [
 ];
 
 const TYPE_COLORS: Record<string, { text: string; bg: string; border: string }> = {
-  a2a_receive: { text: "text-blue-400", bg: "bg-blue-950/30", border: "border-blue-800/30" },
+  a2a_receive: { text: "text-accent", bg: "bg-blue-950/30", border: "border-blue-800/30" },
   a2a_send: { text: "text-cyan-400", bg: "bg-cyan-950/30", border: "border-cyan-800/30" },
-  task_update: { text: "text-amber-400", bg: "bg-amber-950/30", border: "border-amber-800/30" },
+  task_update: { text: "text-warm", bg: "bg-amber-950/30", border: "border-amber-800/30" },
   skill_promotion: { text: "text-violet-300", bg: "bg-violet-950/30", border: "border-violet-800/30" },
-  agent_log: { text: "text-zinc-400", bg: "bg-zinc-800/30", border: "border-zinc-700/30" },
-  error: { text: "text-red-400", bg: "bg-red-950/30", border: "border-red-800/30" },
+  agent_log: { text: "text-ink-mid", bg: "bg-surface-card/30", border: "border-line/30" },
+  error: { text: "text-bad", bg: "bg-red-950/30", border: "border-red-800/30" },
 };
 
 const STATUS_ICONS: Record<string, { icon: string; color: string }> = {
-  ok: { icon: "✓", color: "text-emerald-400" },
-  error: { icon: "✕", color: "text-red-400" },
-  timeout: { icon: "⏱", color: "text-amber-400" },
+  ok: { icon: "✓", color: "text-good" },
+  error: { icon: "✕", color: "text-bad" },
+  timeout: { icon: "⏱", color: "text-warm" },
 };
 
 export function ActivityTab({ workspaceId }: Props) {
@@ -75,7 +75,7 @@ export function ActivityTab({ workspaceId }: Props) {
   return (
     <div className="flex flex-col h-full">
       {/* Filter bar */}
-      <div className="px-3 pt-3 pb-2 border-b border-zinc-800/40">
+      <div className="px-3 pt-3 pb-2 border-b border-line/40">
         <div className="flex items-center gap-1 flex-wrap">
           {FILTERS.map((f) => (
             <button
@@ -84,8 +84,8 @@ export function ActivityTab({ workspaceId }: Props) {
               aria-pressed={filter === f.id}
               className={`px-2 py-1 text-[11px] rounded-md font-medium transition-all ${
                 filter === f.id
-                  ? "bg-zinc-700 text-zinc-100 ring-1 ring-zinc-600"
-                  : "text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/60"
+                  ? "bg-surface-card text-ink ring-1 ring-zinc-600"
+                  : "text-ink-soft hover:text-ink-mid hover:bg-surface-card/60"
               }`}
             >
               <span className="mr-0.5 opacity-60">{f.icon}</span> {f.label}
@@ -96,7 +96,7 @@ export function ActivityTab({ workspaceId }: Props) {
               onClick={() => setAutoRefresh(!autoRefresh)}
               aria-pressed={autoRefresh}
               className={`text-[11px] px-1.5 py-0.5 rounded ${
-                autoRefresh ? "text-emerald-400 bg-emerald-950/30" : "text-zinc-500"
+                autoRefresh ? "text-good bg-emerald-950/30" : "text-ink-soft"
               }`}
               title={autoRefresh ? "Auto-refresh ON" : "Auto-refresh OFF"}
             >
@@ -104,20 +104,20 @@ export function ActivityTab({ workspaceId }: Props) {
             </button>
             <button
               onClick={() => setTraceOpen(true)}
-              className="px-2 py-1 bg-blue-900/40 hover:bg-blue-800/50 text-[11px] rounded text-blue-300 border border-blue-800/30"
+              className="px-2 py-1 bg-blue-900/40 hover:bg-blue-800/50 text-[11px] rounded text-accent border border-blue-800/30"
               title="View full conversation trace across all workspaces"
             >
               Full Trace
             </button>
             <button
               onClick={loadActivities}
-              className="px-2 py-1 bg-zinc-700 hover:bg-zinc-600 text-[11px] rounded text-zinc-300"
+              className="px-2 py-1 bg-surface-card hover:bg-surface-card text-[11px] rounded text-ink-mid"
             >
               Refresh
             </button>
           </div>
         </div>
-        <div className="mt-1.5 text-[10px] text-zinc-500">
+        <div className="mt-1.5 text-[10px] text-ink-soft">
           {activities.length} {filter === "all" ? "activities" : filter.replace("_", " ") + " entries"}
         </div>
       </div>
@@ -125,19 +125,19 @@ export function ActivityTab({ workspaceId }: Props) {
       {/* Activity list */}
       <div className="flex-1 overflow-y-auto p-3 space-y-1.5">
         {loading && activities.length === 0 && (
-          <div className="text-xs text-zinc-500 text-center py-8">Loading activity...</div>
+          <div className="text-xs text-ink-soft text-center py-8">Loading activity...</div>
         )}
 
         {error && (
-          <div className="px-3 py-1.5 bg-red-900/30 border border-red-800 rounded text-xs text-red-400">
+          <div className="px-3 py-1.5 bg-red-900/30 border border-red-800 rounded text-xs text-bad">
             {error}
           </div>
         )}
 
         {!loading && !error && activities.length === 0 && (
           <div className="text-center py-8">
-            <div className="text-zinc-600 text-xs">No activity recorded yet</div>
-            <div className="text-zinc-700 text-[9px] mt-1">
+            <div className="text-ink-soft text-xs">No activity recorded yet</div>
+            <div className="text-ink-soft text-[9px] mt-1">
               Activity logs appear when agents communicate or perform tasks
             </div>
           </div>
@@ -184,7 +184,7 @@ function ActivityRow({
       className={`rounded-lg border transition-colors ${
         isError
           ? "bg-red-950/20 border-red-900/30"
-          : "bg-zinc-800/60 border-zinc-700/40"
+          : "bg-surface-card/60 border-line/40"
       }`}
     >
       <button type="button" onClick={onToggle} className="w-full text-left px-3 py-2">
@@ -195,7 +195,7 @@ function ActivityRow({
           </span>
 
           {entry.method && (
-            <span className="text-[10px] font-mono text-zinc-300 truncate">
+            <span className="text-[10px] font-mono text-ink-mid truncate">
               {entry.method}
             </span>
           )}
@@ -205,23 +205,23 @@ function ActivityRow({
           </span>
 
           {entry.duration_ms != null && (
-            <span className="text-[8px] text-zinc-500 font-mono tabular-nums shrink-0">
+            <span className="text-[8px] text-ink-soft font-mono tabular-nums shrink-0">
               {entry.duration_ms}ms
             </span>
           )}
 
-          <span className="text-[8px] text-zinc-500 shrink-0">
+          <span className="text-[8px] text-ink-soft shrink-0">
             {formatTime(entry.created_at)}
           </span>
 
-          <span className="text-[9px] text-zinc-500">
+          <span className="text-[9px] text-ink-soft">
             {expanded ? "▼" : "▶"}
           </span>
         </div>
 
         {/* Summary — replace raw IDs with workspace names */}
         {entry.summary && (
-          <div className="text-[10px] text-zinc-400 mt-1 truncate">
+          <div className="text-[10px] text-ink-mid mt-1 truncate">
             {entry.summary
               .replace(entry.source_id || "", resolveName(entry.source_id))
               .replace(entry.target_id || "", resolveName(entry.target_id))}
@@ -236,9 +236,9 @@ function ActivityRow({
                 {resolveName(entry.source_id)}
               </span>
             )}
-            <span className="text-[9px] text-zinc-500">→</span>
+            <span className="text-[9px] text-ink-soft">→</span>
             {entry.target_id && (
-              <span className="text-[9px] text-blue-400/80 truncate max-w-[140px]" title={entry.target_id}>
+              <span className="text-[9px] text-accent/80 truncate max-w-[140px]" title={entry.target_id}>
                 {resolveName(entry.target_id)}
               </span>
             )}
@@ -247,7 +247,7 @@ function ActivityRow({
 
         {/* Error detail */}
         {isError && entry.error_detail && (
-          <div className="text-[9px] text-red-400/80 mt-1 truncate">
+          <div className="text-[9px] text-bad/80 mt-1 truncate">
             {entry.error_detail}
           </div>
         )}
@@ -255,7 +255,7 @@ function ActivityRow({
 
       {/* Expanded details */}
       {expanded && (
-        <div className="px-3 pb-3 space-y-2 border-t border-zinc-700/30 mt-1 pt-2">
+        <div className="px-3 pb-3 space-y-2 border-t border-line/30 mt-1 pt-2">
           {entry.source_id && (
             <Detail label="Source" value={`${resolveName(entry.source_id)} (${entry.source_id.slice(0, 8)})`} />
           )}
@@ -278,7 +278,7 @@ function ActivityRow({
           {entry.response_body && (
             <JsonBlock label="Response" data={entry.response_body} />
           )}
-          <div className="text-[8px] text-zinc-500 font-mono select-all">
+          <div className="text-[8px] text-ink-soft font-mono select-all">
             ID: {entry.id}
           </div>
         </div>
@@ -298,10 +298,10 @@ function A2AErrorPreview({ label, raw }: { label: string; raw: string }) {
   const hint = inferA2AErrorHint(detail);
   return (
     <div>
-      <div className="text-[8px] text-red-400/80 uppercase tracking-wider mb-1">{label} — delivery failed</div>
-      <div className="text-[10px] text-red-300 bg-red-950/30 border border-red-800/40 rounded p-2 space-y-1.5">
+      <div className="text-[8px] text-bad/80 uppercase tracking-wider mb-1">{label} — delivery failed</div>
+      <div className="text-[10px] text-bad bg-red-950/30 border border-red-800/40 rounded p-2 space-y-1.5">
         <div className="font-mono whitespace-pre-wrap break-words max-h-32 overflow-y-auto">{detail}</div>
-        <div className="text-[9px] text-red-300/70 leading-relaxed border-t border-red-800/30 pt-1.5">{hint}</div>
+        <div className="text-[9px] text-bad/70 leading-relaxed border-t border-red-800/30 pt-1.5">{hint}</div>
       </div>
     </div>
   );
@@ -326,8 +326,8 @@ function MessagePreview({ label, body }: { label: string; body: Record<string, u
       }
       return (
         <div>
-          <div className="text-[8px] text-zinc-500 uppercase tracking-wider mb-1">{label}</div>
-          <div className="text-[10px] text-zinc-300 bg-zinc-900/60 rounded p-2 max-h-32 overflow-y-auto whitespace-pre-wrap break-words">
+          <div className="text-[8px] text-ink-soft uppercase tracking-wider mb-1">{label}</div>
+          <div className="text-[10px] text-ink-mid bg-surface-sunken/60 rounded p-2 max-h-32 overflow-y-auto whitespace-pre-wrap break-words">
             {text.slice(0, 2000)}
           </div>
         </div>
@@ -369,8 +369,8 @@ function MessagePreview({ label, body }: { label: string; body: Record<string, u
 
   return (
     <div>
-      <div className="text-[8px] text-zinc-500 uppercase tracking-wider mb-1">{label}</div>
-      <div className="text-[10px] text-zinc-300 bg-zinc-900/60 rounded p-2 max-h-32 overflow-y-auto whitespace-pre-wrap break-words">
+      <div className="text-[8px] text-ink-soft uppercase tracking-wider mb-1">{label}</div>
+      <div className="text-[10px] text-ink-mid bg-surface-sunken/60 rounded p-2 max-h-32 overflow-y-auto whitespace-pre-wrap break-words">
         {text.slice(0, 2000)}
       </div>
     </div>
@@ -380,8 +380,8 @@ function MessagePreview({ label, body }: { label: string; body: Record<string, u
 function Detail({ label, value, mono, error: isError }: { label: string; value: string; mono?: boolean; error?: boolean }) {
   return (
     <div className="flex items-start gap-2">
-      <span className="text-[8px] text-zinc-500 uppercase tracking-wider w-14 shrink-0 pt-0.5">{label}</span>
-      <span className={`text-[9px] break-all ${isError ? "text-red-400" : "text-zinc-300"} ${mono ? "font-mono" : ""}`}>
+      <span className="text-[8px] text-ink-soft uppercase tracking-wider w-14 shrink-0 pt-0.5">{label}</span>
+      <span className={`text-[9px] break-all ${isError ? "text-bad" : "text-ink-mid"} ${mono ? "font-mono" : ""}`}>
         {value}
       </span>
     </div>
@@ -391,8 +391,8 @@ function Detail({ label, value, mono, error: isError }: { label: string; value:
 function JsonBlock({ label, data }: { label: string; data: Record<string, unknown> }) {
   return (
     <div>
-      <div className="text-[8px] text-zinc-500 uppercase tracking-wider mb-1">{label}</div>
-      <pre className="text-[9px] text-zinc-300 bg-zinc-900/80 rounded p-2 overflow-x-auto max-h-48 font-mono">
+      <div className="text-[8px] text-ink-soft uppercase tracking-wider mb-1">{label}</div>
+      <pre className="text-[9px] text-ink-mid bg-surface-sunken/80 rounded p-2 overflow-x-auto max-h-48 font-mono">
         {JSON.stringify(data, null, 2)}
       </pre>
     </div>