@tokenoftrust/storefront-runner 1.3.4-rc.3 → 1.4.0

package/apps/storefront/src/pages/cockpit.astro

@@ -14,8 +14,8 @@
  * mockup's visual system — the tokenoftrust tenant theme (navy ink #0A2540 + trust teal
  * #0E9F8E on cool-white #F7F9FC), Plus Jakarta Sans / Inter / JetBrains Mono, rounded cards —
  * now with full dark-mode (system + manual toggle) and reduced-motion support. Same CSP as
- * every storefront response (googleapis/gstatic allowlisted, so the shared typefaces load);
- * inline style/script carry this request's nonce.
+ * every storefront response; the shared typefaces are self-hosted same-origin (@fontsource,
+ * imported via `@/styles/fonts.css`), and inline style/script carry this request's nonce.
  *
  * The one command honours the shipped browserless-signin fastpath: a developer who reached
  * this page from their magic link already has a session here, so the Copy button mints a
@@ -25,12 +25,24 @@
  */
 import { readViewerSession } from "@/lib/auth/route";
 import { staticTenants } from "@/config/tenants";
+import { resolvePreviewTenant } from "@/config/previewTenantLookup";
+import { readTenantPreviewStatus, isStoreNotSetUp } from "@/lib/dev/previewStatus";
 import { resolveDevApiBase } from "@/lib/dev/apiBase";
+import { resolveCockpitStoreResource } from "@/lib/dev/cockpitStore";
 import { normalizeEmailHint, redactEmailForHint } from "@/lib/privacy/emailHint";
+// Self-hosted web fonts (audit finding 6) — same-origin @fontsource, replacing
+// the render-blocking fonts.googleapis.com stylesheet. Covers Plus Jakarta Sans,
+// Inter, and JetBrains Mono used by this page's inline styles.
+import "@/styles/fonts.css";
 
 export const prerender = false;
 const cspNonce = Astro.locals.cspNonce;
 const url = new URL(Astro.request.url);
+// The tenant prefix ("" host-routed, "/<tenant>" path-routed) this cockpit is served
+// under — set by the middleware. Every self-link + same-store API call below carries
+// it so a `/<tenant>/cockpit` invite keeps its store across the login round-trip and
+// the command mint (see resolveCockpitStoreResource / the basePath-scoped fetches).
+const basePath = Astro.locals.basePath ?? "";
 const isCredentialRecovery = url.searchParams.get("recover") === "cli";
 const legacyRecoveryEmail = (url.searchParams.get("email") ?? "").trim();
 const recoveryEmailHint =
@@ -42,34 +54,41 @@ if (isCredentialRecovery && url.searchParams.has("email")) {
   canonical.delete("email");
   if (recoveryEmailHint) canonical.set("email_hint", recoveryEmailHint);
   return Astro.redirect(
-    `/cockpit${canonical.toString() ? `?${canonical.toString()}` : ""}`,
+    `${basePath}/cockpit${canonical.toString() ? `?${canonical.toString()}` : ""}`,
     302,
   );
 }
-const cockpitNext = isCredentialRecovery ? "/cockpit?recover=cli" : "/cockpit";
+const cockpitNext = `${basePath}/cockpit${isCredentialRecovery ? "?recover=cli" : ""}`;
 const loginParams = new URLSearchParams({ next: cockpitNext });
 if (recoveryEmailHint) loginParams.set("email_hint", recoveryEmailHint);
 const loginHref = `/auth/login?${loginParams.toString()}`;
 
 const session = await readViewerSession({ cookies: Astro.cookies });
 const signedIn = !!session;
+// d1 (board: d1-unmask-invite-email) — the FULL invite address to show its OWNER in the
+// recovery notice, never a redacted hint. Prefer the validated session email; else a full
+// `?email=` if one ever survives to render. Empty when only a redacted `email_hint` is on
+// hand (the common case — the CLI masks the address upstream before it reaches this page),
+// and the notice then falls back to neutral, non-redacted copy rather than re-showing the
+// owner a masked form of their own address. redactEmailForHint/emailHint.ts stay intact for
+// every other caller (e.g. the /auth/login hint below) — we simply stop masking HERE.
+const recoveryEmailFull =
+  session?.email ||
+  (/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(legacyRecoveryEmail) ? legacyRecoveryEmail.toLowerCase() : "");
 // The fastpath (browserless terminal sign-in) is gated behind the developer's own session +
 // capability — the same gate /api/dev/cli-signin-code enforces. Mirror it here so a
 // logged-out / no-capability visitor gets the generic command, never a broken mint.
 const hasStoreAccess = signedIn && !!session?.capability && session.capability !== "none";
 
-// Resolve the developer's tenant from their first membership (or ?tenant= for an
-// ANONYMOUS preview only — never override a signed-in developer's own tenant with
-// caller-supplied input; the mint/activity endpoints already derive tenant solely
-// from the session/token, but letting the query param win here still meant a
-// signed-in dev could be shown another vendor's branding + `tot checkout <theirs>`
-// instructions, which is confusing/spoofable chrome even though nothing privileged
-// leaked).
-const wanted = (
-  session
-    ? (session?.tenants?.[0]?.resource ?? session?.resource ?? "")
-    : (url.searchParams.get("tenant") ?? "")
-).toLowerCase();
+// Resolve which store this cockpit is for. The URL wins when a `/<tenant>/cockpit`
+// request named a specific store the signed-in developer can access (the trusted
+// host/path seam on `locals.tenant`, membership-checked) — this is the regression
+// fix: an invite to another store than the session's first membership no longer
+// "loses" that store. Otherwise: the developer's own first store (generic host), or
+// — for an ANONYMOUS viewer only — the path store's branding, else `?tenant=`. Never
+// a signed-in developer's store overridden by caller-supplied query input.
+// See resolveCockpitStoreResource; the same resolver gates the mint + /api/dev/*.
+const wanted = resolveCockpitStoreResource(Astro, session);
 const tenant =
   (wanted
     ? staticTenants.find((t) =>
@@ -82,9 +101,42 @@ const tenant =
   staticTenants[0];
 
 const appDomain = tenant?.appDomain ?? "tokenoftrust.com";
-// Signed in, but the account carries no developer capability on any store — an honest
-// recovery state (not a 401): show what to do, not the fastpath.
-const noStoreAccess = signedIn && !hasStoreAccess;
+
+// fix-staff-cockpit-403: `hasStoreAccess` above only proves the session carries SOME
+// eligible capability — the federated sign-in path stamps capability:"member"
+// unconditionally (auth/magic-exchange), so a ToT-staff viewer admitted by the
+// loginGate staff bypass (no real store membership) passes it too, even on the home
+// host where `wanted` never names a real store. Every /api/dev/* route instead gates
+// on this SAME tenant actually RESOLVING (resolvePreviewTenant — see
+// lib/dev/hostedCockpit.ts, api/dev/activity.ts) — mirror that here so we never mint a
+// setup command or start polling for a viewer who'd just 403-loop against it.
+const resolvedStoreTenant = hasStoreAccess && wanted ? await resolvePreviewTenant(wanted) : null;
+// Capability-eligible, but no store resolves for this viewer/host (the staff/home-host
+// case above). Gets its own calm "pick a store" state instead of the full flow.
+const noResolvableStore = hasStoreAccess && !resolvedStoreTenant;
+
+// STORE-NOT-SET-UP (#8425 invite-gated-auto-build): a developer WITH access + a
+// resolvable store, but whose forge repo isn't provisioned yet — the invite landed
+// before (or without) the store being set up. Offering the fastpath here would hand
+// them a `tot login --code … && tot start` that dies at checkout on "Repo … is not
+// provisioned" (James's first-run failure). Ask the credential-free MCP preview-status
+// seam; only a DEFINITIVE not-provisioned flips the state (an unconfigured / can't-answer
+// seam keeps the normal fastpath, with the CLI's own clean "not set up yet" error as the
+// backstop — so no regression on local/dev or a transient MCP blip). This is a DISTINCT
+// axis from noResolvableStore/noStoreAccess and gets its own honest notice below.
+const storeNotSetUp =
+  hasStoreAccess && !noResolvableStore && isStoreNotSetUp(await readTenantPreviewStatus(appDomain));
+
+// The gate for rendering the setup-command + activity-poll flow: eligible AND a real
+// store to point it at AND that store is actually provisioned. Use this (never the raw
+// hasStoreAccess) for anything that mints a command or starts the activity poll.
+const canSetupStore = hasStoreAccess && !noResolvableStore && !storeNotSetUp;
+
+// Signed in, but either no developer capability on any store OR (staff bypass) no store
+// resolves for this viewer/host — an honest recovery state (not a 401): show what to
+// do, not the fastpath. NOTE: storeNotSetUp is deliberately NOT folded in here — it is
+// its own state with its own notice, so this stays computed from resolvable-store only.
+const noStoreAccess = signedIn && (!hasStoreAccess || noResolvableStore);
 // The generic command shown (and copied) when we can't mint a personalised one.
 // Pinned to the EXACT CLI version this build was cut alongside (`@tokenoftrust/cli@<version>`,
 // astro.config Vite define) so the paste installs precisely the CLI this cockpit expects —
@@ -112,7 +164,7 @@ const isLocalDevLoop = import.meta.env.DEV;
 // on our hosted surface. It is NOT a port of the local-only Monitor/Files/preview
 // panels (those depend on /__tot/* endpoints that exist only under `astro dev`;
 // bringing those hosted is cp-tree/cp-file/cp-preview, tracked separately).
-const hostedActivity = !isLocalDevLoop && hasStoreAccess;
+const hostedActivity = !isLocalDevLoop && canSetupStore;
 
 // cp-env (cloud-dev-cockpit Phase 0): the file-tree/viewer/diff + click-to-source
 // cockpit scripts below (filesScript, c8Script) are ENVIRONMENT-AWARE — same client
@@ -121,7 +173,7 @@ const hostedActivity = !isLocalDevLoop && hasStoreAccess;
 // cp-locate — separate cards). Resolving it here, unconditionally, means those cards
 // don't each have to invent the same env check; on isLocalDevLoop this is a no-op
 // (resolves to the unchanged /__tot base). See decision architecture-environment-aware-cockpit.
-const apiBase = resolveDevApiBase(isLocalDevLoop);
+const apiBase = resolveDevApiBase(isLocalDevLoop, basePath);
 
 // Live loop Monitor (C1) client. Polls the dev server's /__tot/dev-loop-status
 // and renders the loopbar: server health, watched file, and the save→reload
@@ -568,20 +620,22 @@ const filesScript = `
   }
   if (diffBtn) diffBtn.addEventListener("click", doDiff);
 
-  // cp-publish: draft -> TEST channel (never live — see decision
-  // cp-publish-scope-correction). Confirm-before-publish per the card.
+  // cp-publish: draft -> PR-backed candidate for review (unit s6, milestone
+  // "PR-Backed Hosted Review Loop") — never straight to live, and no longer
+  // straight to the test channel either; it opens/updates a pull request an
+  // owner reviews and accepts. Confirm-before-submit per the card.
   function doPublish() {
     if (!cur || !cur.writable || !publishBtn) return;
-    if (!window.confirm("Publish your saved edit to the test channel? (Not your live site.)")) return;
+    if (!window.confirm("Submit your saved edit for review? (Opens/updates a pull request \\u2014 not your live site.)")) return;
     var prevLabel = publishBtn.textContent;
     publishBtn.disabled = true;
-    setStatus("Publishing\\u2026");
+    setStatus("Submitting\\u2026");
     fetch(apiBase + "/publish", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ path: cur.path }) })
       .then(function (r) { return r.json().then(function (j) { return { s: r.status, j: j }; }); })
       .then(function (res) {
-        if (res.s === 200 && res.j && res.j.ok) { setStatus(res.j.applied ? "Published to test \\u2713" : "Published (not persisted \\u2014 no storage configured)", "ok"); return; }
-        if (res.s === 409 && res.j && res.j.status === "no_draft") { setStatus("No unpublished edit to publish.", "warn"); return; }
-        setStatus((res.j && res.j.message) || "Publish failed", "warn");
+        if (res.s === 200 && res.j && res.j.ok) { setStatus("Submitted for review \\u2713" + (res.j.prNumber ? " (PR #" + res.j.prNumber + ")" : ""), "ok"); return; }
+        if (res.s === 409 && res.j && res.j.status === "no_draft") { setStatus("No unpublished edit to submit.", "warn"); return; }
+        setStatus((res.j && res.j.message) || "Submit failed", "warn");
       })
       .catch(function () { setStatus(offlineMsg, "warn"); })
       .then(function () { publishBtn.disabled = false; publishBtn.textContent = prevLabel; });
@@ -718,6 +772,12 @@ const hostedActivityScript = `
   var root = document.getElementById("hostedActivity");
   if (!root) return;
 
+  // The request's tenant prefix ("" host-routed, "/<tenant>" path-routed). Every
+  // /api/dev/* call below carries it so the activity feed + the CLI sign-in-code mint
+  // run in THIS store's scope (locals.tenant on the API request) — the same store this
+  // /<tenant>/cockpit rendered for, never the session's first membership.
+  var basePath = ${JSON.stringify(basePath)};
+
   // ?reset — a TRUE reset for re-testing the onboarding loop: clear THIS browser's
   // stepper progress AND the server-side KV (live-runtime record + activity buffer),
   // then reload clean. Clearing the server too means a stopped local loop stops reading
@@ -730,7 +790,7 @@ const hostedActivityScript = `
       var reloaded = false;
       var doneReset = function () { if (reloaded) return; reloaded = true; location.replace(location.pathname); };
       setTimeout(doneReset, 2000); // fallback so a hung request still lands us fresh
-      try { fetch("/api/dev/activity", { method: "DELETE", cache: "no-store" }).then(doneReset, doneReset); }
+      try { fetch(basePath + "/api/dev/activity", { method: "DELETE", cache: "no-store" }).then(doneReset, doneReset); }
       catch (e) { doneReset(); }
       return; // the post-clear reload re-runs this script against a fresh, empty state
     }
@@ -750,12 +810,42 @@ const hostedActivityScript = `
   var bKicker = document.getElementById("bKicker");
   var bHint = document.getElementById("bHint");
   var bDiag = document.getElementById("bDiag");
+  var bTxt = document.getElementById("bTxt");
+  var bObstacle = document.getElementById("bObstacle");
+  var bObTitle = document.getElementById("bObTitle");
+  var bObMsg = document.getElementById("bObMsg");
+  var bObCmd = document.getElementById("bObCmd");
+  var bObNote = document.getElementById("bObNote");
   var doneRunMeta = document.getElementById("doneRunMeta");
-  function updateBridge(rt) {
+  function updateBridge(rt, obstacle) {
     if (!bridge) return;
-    if (!rt || !rt.url) { bridge.hidden = true; return; }
-    var live = !!rt.live;
+    var live = !!(rt && rt.live);
     if (live) sawLive = true;
+    // Obstacle lane (v2 §6): a failed \`tot start\` is the ONE reason the strip
+    // shows BEFORE the loop was ever live this page-view — the developer needs the
+    // fix, not a silent "watching…". The server returns \`obstacle\` only when there
+    // is no live heartbeat, so a live loop supersedes it. Fill from server copy.
+    if (obstacle && !live) {
+      bridge.hidden = false;
+      bridge.setAttribute("data-live", "obstacle");
+      if (bTxt) bTxt.hidden = true;
+      if (bDiag) bDiag.hidden = true;
+      if (bGo) bGo.hidden = true;
+      if (bHint) bHint.hidden = true;
+      if (bObstacle) bObstacle.hidden = false;
+      if (bObTitle) bObTitle.textContent = obstacle.title || "Setup hit a snag";
+      if (bObMsg) bObMsg.textContent = obstacle.message || "";
+      if (bObCmd) {
+        if (obstacle.fixCommand) { bObCmd.textContent = obstacle.fixCommand; bObCmd.hidden = false; }
+        else bObCmd.hidden = true;
+      }
+      if (bObNote) bObNote.textContent = obstacle.fixNote || "";
+      return;
+    }
+    // Back to the normal live/quiet strip: restore the pieces the obstacle state hid.
+    if (bObstacle) bObstacle.hidden = true;
+    if (bTxt) bTxt.hidden = false;
+    if (!rt || !rt.url) { bridge.hidden = true; return; }
     // On FIRST arrival, a stale runtime record (offline, never seen live this
     // page-view — e.g. left over from a prior run, still within the heartbeat TTL)
     // must NOT show — let Step 1 "Get your store running" do the work. Only surface
@@ -1081,29 +1171,40 @@ const hostedActivityScript = `
   }
 
   function poll() {
-    fetch("/api/dev/activity", { cache: "no-store" })
+    fetch(basePath + "/api/dev/activity", { cache: "no-store" })
       .then(function (r) { return r.ok ? r.json() : Promise.reject(); })
       .then(function (d) {
         var events = (d && d.events) || [];
         var rt = d && d.runtime;
         var isLive = !!(rt && rt.live);
         liveNow = isLive; // drives Step 1 minimize + the Step-2 teaser visibility below
-        updateBridge(rt); // same poll drives the bridge strip
+        updateBridge(rt, d && d.obstacle); // same poll drives the bridge strip (+ obstacle lane)
         render(events);
-        var last = events.length ? events[events.length - 1] : null;
-        var latest = last ? last.at : 0;
-        var lastIsEdit = last && last.event !== "up"; // "up" = a server-running ping, not an edit
+        // b1 fix — Step-2 completion must key off the SAME events the feed shows:
+        // REAL file edits (event !== "up"), NOT the single newest buffer entry. The
+        // local loop interleaves recurring "up" liveness pings into this one ring
+        // buffer, so the newest event is frequently an "up" ping even right after a
+        // save. The old gate read events[last]: when an "up" ping landed AFTER the
+        // edit it (1) made lastIsEdit false so completeStep("edit") never fired, and
+        // (2) still advanced the baseline watermark past the edit's timestamp —
+        // permanently stranding Step 2 even though the save rendered in "Your
+        // activity". Filter to real edits (mirroring render()'s filter) and advance
+        // the watermark only from real edits, so a liveness ping can neither satisfy
+        // nor poison the gate.
+        var realEdits = events.filter(function (e) { return e && e.event !== "up"; });
+        var lastEdit = realEdits.length ? realEdits[realEdits.length - 1] : null;
+        var latestEdit = lastEdit ? lastEdit.at : 0;
         // Step 1 "Get running" completes once localhost reports LIVE (or any activity
         // arrives). Once complete, renderSteps() minimizes Step 1 and reveals the Step-2 nudge.
         if (isLive || events.length) completeStep("run");
         if (baseline === null) {
-          setBaseline(latest); // first poll primes the watermark — no edit inferred yet
-        } else if (latest > baseline) {
-          setBaseline(latest);
-          // Step 2 completes only on a real FILE edit landing (not a running ping).
+          setBaseline(latestEdit); // first poll primes the watermark from real edits — no edit inferred yet
+        } else if (latestEdit > baseline) {
+          setBaseline(latestEdit);
+          // A real FILE edit landed after the watermark → Step 2 completes (once).
           // completeStep flips + persists once, returning true on that first poll only.
-          if (lastIsEdit && completeStep("edit")) {
-            celebrate(last && last.file);
+          if (completeStep("edit")) {
+            celebrate(lastEdit && lastEdit.file);
             if (current === "edit") current = null; // minimize Step 2 → reveal Step-3 teaser
           }
         }
@@ -1149,13 +1250,21 @@ const hostedActivityScript = `
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="robots" content="noindex, nofollow" />
-    <title>Get your store running — {appDomain}</title>
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link
-      rel="stylesheet"
-      href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap"
-    />
+    <title>Developer Cockpit — {appDomain}</title>
+    {/* cockpit-theme-persist: seed data-theme from the STORED choice before the stylesheet/
+        style below ever paint, so a reload of a manually-toggled theme doesn't flash the OS
+        default first. Runs before the theme toggle's own script (end of body) exists — it
+        only ever READS here; the toggle is what writes. No stored choice → leave the
+        attribute unset, so the `@media (prefers-color-scheme)` block keeps deciding. */}
+    <script nonce={cspNonce} is:inline>
+      (function () {
+        try {
+          var v = localStorage.getItem("tot.theme");
+          if (v === "dark" || v === "light") document.documentElement.setAttribute("data-theme", v);
+        } catch (e) {}
+      })();
+    </script>
+    {/* Web fonts are self-hosted via `@/styles/fonts.css` (imported above). */}
     <style nonce={cspNonce}>
       :root {
         --bg: #f7f9fc; --bg-2: #eef3f9; --surface: #ffffff;
@@ -1250,6 +1359,8 @@ const hostedActivityScript = `
       .brand .dom { font-family: var(--display); font-weight: 700; color: var(--ink); font-size: .98rem; letter-spacing: -.01em; }
       .brand .sub { font-family: var(--mono); font-size: .7rem; color: var(--faint); text-transform: uppercase; letter-spacing: .12em; }
       .topbar .right { display: flex; align-items: center; gap: .9rem; font-family: var(--mono); font-size: .78rem; color: var(--muted); }
+      .cockpit-lede { margin: -0.6rem 0 1.6rem; font-family: var(--body); font-size: .92rem; color: var(--muted); max-width: 60ch; }
+      .cockpit-lede strong { color: var(--ink); font-weight: 600; }
       .topbar .right .sess { display: inline-flex; align-items: center; gap: .45rem; }
       .topbar .right .sess::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-wash); }
       .themetog {
@@ -1344,6 +1455,25 @@ const hostedActivityScript = `
       .b-go:hover { background: var(--accent-ink); transform: translateY(-1px); }
       .b-hint { flex-basis: 100%; margin: 0; font-size: .8rem; color: var(--amber); }
       .b-hint code { font-family: var(--mono); }
+      /* Obstacle lane (v2 §6): a failed `tot start` — an ERROR, so it uses the
+         existing --warn (red) token triple (NO new palette values), which also sets
+         it apart from the amber "went quiet". Content is a stacked block, so the
+         beacon aligns to the top rather than centering on a tall card. */
+      .bridge[data-live="obstacle"] { align-items: flex-start; border-color: var(--warn-line); background: var(--warn-wash); }
+      .bridge[data-live="obstacle"] .beacon { background: var(--warn); }
+      .b-obstacle { flex: 1 1 100%; display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
+      .b-ob-title { color: var(--warn); }
+      .b-ob-title::before { content: "\26A0  "; } /* ⚠ warning glyph */
+      .b-ob-msg { margin: 0; font-size: .9rem; font-weight: 600; color: var(--ink); }
+      .b-ob-fix { margin: 0; font-size: .82rem; color: var(--muted); line-height: 1.5; }
+      .b-ob-lead { color: var(--warn); font-weight: 700; }
+      .b-ob-cmd { font-family: var(--mono); font-size: .8rem; background: var(--bg-2); color: var(--ink); padding: .1rem .35rem; border-radius: var(--r-sm); }
+      /* These three set their own `display`, which (author > UA) would beat the UA
+         [hidden]{display:none} — so the script's `.hidden` toggles silently no-op on
+         them. Re-assert [hidden] at higher specificity so hidden means hidden: the
+         obstacle block and the live-strip text swap cleanly, AND the quiet-state CTA
+         (b-go) actually hides. */
+      .b-txt[hidden], .b-go[hidden], .b-obstacle[hidden] { display: none; }
       @media (prefers-reduced-motion: reduce) { .bridge[data-live="1"], .beacon, .b-go { animation: none !important; transition: none; } }
       @media (max-width: 34rem) { .b-diag { display: none; } }
 
@@ -1551,6 +1681,34 @@ const hostedActivityScript = `
       .term-bar .dot { width: 11px; height: 11px; border-radius: 50%; }
       .dot.r { background: #ff5f56; } .dot.y { background: #ffbd2e; } .dot.g { background: #27c93f; }
       .term-bar .ttl { margin-left: .4rem; font-size: .72rem; color: var(--term-dim); }
+      /* Standard "copy this code block" affordance, docked in the terminal chrome.
+         Revealed once the command is minted; its icon→check swap is the obvious,
+         inline copy confirmation (no reliance on the transient toast). */
+      .term-copy {
+        margin-left: auto; display: inline-flex; align-items: center; justify-content: center;
+        width: 30px; height: 26px; padding: 0; border-radius: var(--r-sm); cursor: pointer;
+        background: rgba(255,255,255,.04); border: 1px solid var(--term-line);
+        color: var(--term-dim); transition: color .12s, background .12s, border-color .12s;
+      }
+      .term-copy:hover { color: var(--term-fg); background: rgba(255,255,255,.09); border-color: var(--term-dim); }
+      .term-copy svg { width: 15px; height: 15px; }
+      .term-copy .ic-check { display: none; }
+      .term-copy[data-copied="1"] { color: var(--term-ok); border-color: var(--term-ok); }
+      .term-copy[data-copied="1"] .ic-copy { display: none; }
+      .term-copy[data-copied="1"] .ic-check { display: block; }
+      /* Rendezvous approval widget — the confirm-your-terminal step after pasting. */
+      .rzv { margin-top: 14px; }
+      .rzv[hidden] { display: none; }
+      .rzv-wait { display: flex; align-items: center; gap: 10px; font-size: .92rem; opacity: .8; }
+      .rzv-confirm { border: 1px solid var(--term-ok, #0e9f8e); border-radius: 12px; padding: 16px 18px; background: color-mix(in srgb, var(--term-ok, #0e9f8e) 8%, transparent); }
+      .rzv-q { margin: 0 0 6px; font-weight: 600; }
+      .rzv-fp { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1.75rem; letter-spacing: .12em; text-align: center; margin: 8px 0 16px; }
+      .rzv-actions { display: flex; gap: 10px; flex-wrap: wrap; }
+      .rzv-actions .cta { margin: 0; }
+      .rzv-deny { background: none; border: 1px solid currentColor; opacity: .7; border-radius: 8px; padding: 8px 14px; cursor: pointer; color: inherit; font: inherit; }
+      .rzv-deny:hover { opacity: 1; }
+      .rzv-deny[disabled], .rzv-actions .cta[disabled] { opacity: .5; cursor: default; }
+      .rzv-done { margin-top: 12px; font-weight: 600; }
       .term-body { padding: 1rem 1.05rem 1.1rem; color: var(--term-fg); white-space: pre-wrap; word-break: break-word; }
       /* block, not inline — Astro trims the whitespace text node between the spans, so the
          line break must be structural or the comment + command collapse onto one line. */
@@ -1726,6 +1884,9 @@ const hostedActivityScript = `
       .df-view { flex: 1 1 auto; width: 100%; box-sizing: border-box; display: block; margin: 0; border: 0; resize: none; outline: none; overflow: auto; padding: .75rem .9rem; font-family: var(--mono); font-size: .76rem; line-height: 1.55; color: var(--term-fg); background: var(--term); white-space: pre; tab-size: 2; }
       .df-view[readonly] { opacity: .9; }
       .df-diffbtn { margin-left: auto; }
+      .df-publishbtn { border-color: var(--accent); color: var(--accent-ink); font-weight: 600; }
+      .df-publishbtn:hover { background: var(--accent-wash); }
+      .df-publishbtn:disabled { opacity: .6; cursor: default; }
       .df-diff { flex: 1 1 auto; margin: 0; overflow: auto; padding: .5rem 0; font-family: var(--mono); font-size: .76rem; line-height: 1.5; background: var(--term); color: var(--term-fg); }
       .df-diff .dl { display: block; padding: 0 .9rem; white-space: pre; }
       .df-diff .add { background: rgba(52, 211, 153, .16); color: #bff2e0; }
@@ -1781,6 +1942,11 @@ const hostedActivityScript = `
       .ask-foot { padding: .7rem 1.1rem; border-top: 1px solid var(--border-2); font-family: var(--mono); font-size: .68rem; color: var(--faint); }
       @media (prefers-reduced-motion: reduce) { .ask-panel { transition: none; } }
 
+      /* ---- connect the MCP (d3-unhold-dev-step0-connect-mcp) ---- */
+      #stage-mcp { margin-top: 2rem; }
+      /* disable ligatures so `--transport` renders as literal characters, not a glyph */
+      #mcpCmdText { font-variant-ligatures: none; font-feature-settings: "liga" 0, "calt" 0; }
+
       /* ---- what's next : coming soon shelf (U4) ---- */
       .next { margin-top: 3.4rem; padding-top: 2rem; border-top: 1px dashed var(--border); }
       .next h3 { font-family: var(--display); font-weight: 700; color: var(--ink-2); font-size: 1.1rem; margin: 0 0 .3rem; letter-spacing: -.02em; }
@@ -1832,7 +1998,7 @@ const hostedActivityScript = `
           <span class="mark" aria-hidden="true">
             <svg viewBox="0 0 24 24" fill="none"><path d="M12 2.5 20 6v6c0 4.6-3.2 7.9-8 9.5-4.8-1.6-8-4.9-8-9.5V6l8-3.5Z" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="m8.5 12 2.4 2.4L15.8 9.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
           </span>
-          <span class="who"><span class="dom">{appDomain}</span><span class="sub">Developer</span></span>
+          <span class="who"><span class="dom">{appDomain}</span><span class="sub">Developer Cockpit</span></span>
         </div>
         <div class="right">
           {session?.email ? <span class="sess">{session.email}</span> : null}
@@ -1840,11 +2006,23 @@ const hostedActivityScript = `
         </div>
       </header>
 
+      {/* U1 anchor — name the surface so a developer knows which page is "home". */}
+      <p class="cockpit-lede">This is your <strong>Developer Cockpit</strong> — your home base while your store spins up.</p>
+
       {signedIn === false && (
         <div class="notice">
+          {/* d1 (board: d1-unmask-invite-email) — the invitee owns this address (the
+              link was sent to it), so masking it back to them is pointless friction.
+              Show the FULL invite email when we actually have it; NEVER show the redacted
+              hint to its owner. This branch is signed-OUT, so there's no session.email to
+              read; the recovery link arrives carrying only a redacted `email_hint` (the
+              full address is masked UPSTREAM by the CLI before it ever reaches this page —
+              see report), so the full email is genuinely unavailable here and we fall back
+              to neutral copy rather than re-displaying the redacted form. `recoveryEmailFull`
+              lights up automatically the moment a full address is available. */}
           <p>{isCredentialRecovery
-            ? recoveryEmailHint
-              ? <>Sign in with the invite email hinted as <strong>{recoveryEmailHint}</strong> to generate a fresh setup command for this machine.</>
+            ? recoveryEmailFull
+              ? <>Sign in with your invite email, <strong>{recoveryEmailFull}</strong>, to generate a fresh setup command for this machine.</>
               : <>Sign in with the same email that accepted the invite to generate a fresh setup command for this machine.</>
             : <>Sign in with the email your invite came to — then this page shows your store and your one command.</>}</p>
           <a class="action" href={loginHref}>Sign in</a>
@@ -1853,8 +2031,27 @@ const hostedActivityScript = `
 
       {noStoreAccess && (
         <div class="notice">
-          <p>You're signed in{session?.email ? <>{" "}as <strong>{session.email}</strong></> : null}, but this account isn't linked to a store yet. Ask whoever sent your invite to grant developer access — then reload this page.</p>
-          <a class="action" href="/auth/logout">Switch account</a>
+          {noResolvableStore
+            ? <>
+                <p>You're signed in{session?.email ? <>{" "}as <strong>{session.email}</strong></> : null}, but this page doesn't have a store to set up yet. Pick one from your dashboard to get its setup command.</p>
+                <a class="action" href="/dashboard">Pick a store</a>
+              </>
+            : <>
+                <p>You're signed in{session?.email ? <>{" "}as <strong>{session.email}</strong></> : null}, but this account isn't linked to a store yet. Ask whoever sent your invite to grant developer access — then reload this page.</p>
+                <a class="action" href="/auth/logout">Switch account</a>
+              </>}
+        </div>
+      )}
+
+      {/* STORE-NOT-SET-UP notice — a real, signed-in developer whose store's repo isn't
+          provisioned yet. We deliberately withhold the setup command here (canSetupStore
+          is false, so the mint fastpath + activity rail below don't render) rather than
+          hand out a `tot start` that would die at checkout. Honest, low-friction copy:
+          nothing for them to do but wait + reload. */}
+      {storeNotSetUp && (
+        <div class="notice">
+          <p>You're all set{session?.email ? <>{" "}as <strong>{session.email}</strong></> : null} — but <strong>{appDomain}</strong>'s store is still being set up. Your one-paste setup command appears here the moment it's ready. Nothing to do on your end; check back shortly, or ask your Token of Trust contact if it's urgent.</p>
+          <a class="action" href="/cockpit">Reload</a>
         </div>
       )}
 
@@ -1866,13 +2063,22 @@ const hostedActivityScript = `
       {hostedActivity && (
         <section class="bridge" id="bridge" data-live="1" hidden>
           <span class="beacon" aria-hidden="true"></span>
-          <div class="b-txt">
+          <div class="b-txt" id="bTxt">
             <span class="b-kicker" id="bKicker">Live on your machine</span>
             <a class="b-url" id="bUrl" href="#" target="_blank" rel="noreferrer">http://localhost/</a>
           </div>
           <span class="b-diag" id="bDiag" hidden></span>
           <a class="b-go" id="bGo" href="#" target="_blank" rel="noreferrer">Open your store ↗</a>
           <p class="b-hint" id="bHint" hidden>Your store went quiet. Run <code>tot start</code> in your project to bring it back — Step 1 has the command.</p>
+          {/* Obstacle lane (v2 §6): a failed `tot start` (wrong Node, missing pnpm,
+              install/clone error) beacons why via the setup command's activity token;
+              the strip becomes an actionable fix card. Text is set via textContent from
+              the SERVER-composed remediation copy (obstacleStore) — never innerHTML. */}
+          <div class="b-obstacle" id="bObstacle" hidden>
+            <span class="b-kicker b-ob-title" id="bObTitle">Setup hit a snag</span>
+            <p class="b-ob-msg" id="bObMsg"></p>
+            <p class="b-ob-fix"><span class="b-ob-lead">Fix:</span> <code class="b-ob-cmd" id="bObCmd" hidden></code> <span id="bObNote"></span></p>
+          </div>
         </section>
       )}
 
@@ -1930,31 +2136,62 @@ const hostedActivityScript = `
               <span class="info-pop" role="tooltip">Installs the <code>tot</code> command, signs your terminal in with a single-use code, checks out your store into a new <code>{appDomain}</code> folder, runs it, and opens your browser. No Docker, no browser sign-in, nothing to provision. From then on it's just <code>tot start</code>.</span>
             </span>
           </h1>
-          <p class="goal">{hasStoreAccess
+          <p class="goal">{canSetupStore
             ? isCredentialRecovery
               ? <>Generate a fresh personal setup command, then paste it into your terminal and press Enter.</>
               : <>Generate your personal setup command, then paste it into your terminal and press Enter.</>
-            : <>Open the invite link we emailed you to unlock your personal setup command.</>}</p>
+            : storeNotSetUp
+              ? <>We're finishing setting up <strong>{appDomain}</strong>. Your one-paste setup command appears here the moment it's ready — check back shortly.</>
+              : <>Open the invite link we emailed you to unlock your personal setup command.</>}</p>
 
           <div class="term">
-            <div class="term-bar"><span class="dots"><span class="dot r"></span><span class="dot y"></span><span class="dot g"></span></span><span class="ttl">your terminal</span></div>
+            <div class="term-bar"><span class="dots"><span class="dot r"></span><span class="dot y"></span><span class="dot g"></span></span><span class="ttl">your terminal</span>{canSetupStore && (
+              <button class="term-copy" id="copyIcon" type="button" aria-label="Copy the command" title="Copy the command" hidden>
+                <svg class="ic-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>
+                <svg class="ic-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
+              </button>
+            )}</div>
             <div class="term-body"><span class="c"># your personal, single-use setup command</span>
-<span class="cmd is-placeholder" id="cli-cmd-text">{hasStoreAccess ? (isCredentialRecovery ? "→ click “Generate a fresh setup command” below" : "→ click “Generate my setup command” below") : "→ available once you’re signed in via your invite"}</span></div>
+<span class="cmd is-placeholder" id="cli-cmd-text">{canSetupStore ? (isCredentialRecovery ? "→ click “Generate a fresh setup command” below" : "→ click “Generate my setup command” below") : storeNotSetUp ? "→ available once your store finishes setting up" : "→ available once you’re signed in via your invite"}</span></div>
           </div>
 
-          {hasStoreAccess && (
+          {canSetupStore && (
             <div class="cmd-actions">
-              <button class="cta" id="copyCmd" type="button" data-fastpath="1">
+              <button class="cta" id="copyCmd" type="button" data-fastpath="1" data-base-path={basePath}>
                 <svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
                 {isCredentialRecovery ? "Generate a fresh setup command" : "Generate my setup command"}
               </button>
             </div>
           )}
-          <p class="cmd-note" id="cli-cmd-note">{hasStoreAccess
+
+          {/* Rendezvous approval — after you paste the command, your terminal connects here and
+              you confirm the code it printed matches (the load-bearing security step: it's how
+              you prove it's YOUR terminal, not an interceptor's). Hidden until a command is
+              generated; the client script drives the wait → confirm → done states. */}
+          {canSetupStore && (
+            <div class="rzv" id="rzvApprove" hidden aria-live="polite">
+              <div class="rzv-wait" id="rzvWait" hidden>
+                <span class="radar" aria-hidden="true"></span>
+                <span>Waiting for your terminal to connect — run the pasted command, then come back here.</span>
+              </div>
+              <div class="rzv-confirm" id="rzvConfirm" hidden>
+                <p class="rzv-q">Your terminal is asking to sign in. Confirm the code it printed matches:</p>
+                <p class="rzv-fp" id="rzvFp">····-····</p>
+                <div class="rzv-actions">
+                  <button class="cta" id="rzvApproveBtn" type="button">Yes — that's my terminal, approve</button>
+                  <button class="rzv-deny" id="rzvDenyBtn" type="button">Not me — reject</button>
+                </div>
+              </div>
+              <p class="rzv-done" id="rzvDone" hidden></p>
+            </div>
+          )}
+          <p class="cmd-note" id="cli-cmd-note">{canSetupStore
             ? <>This mints a <em>single-use, short-lived</em> sign-in code, shows the full command here, and copies it to your clipboard. Paste it <em>from the folder where you keep projects</em> — it creates a <code>{appDomain}</code> folder there with your store's code, signs you in, runs your store, and opens your browser. Nothing to retype.</>
-            : <>You'll need <em>Node.js 22.12+ (24 LTS recommended) and your invite</em>. Sign in through your invite link and this page hands you a one-paste setup command — no Docker, nothing to provision.</>}</p>
+            : storeNotSetUp
+              ? <>Nothing to do on your end — a Token of Trust reviewer is finishing your store's first setup. Once it's ready, reload and this page hands you the one-paste command.</>
+              : <>You'll need <em>Node.js 22.12+ (24 LTS recommended) and your invite</em>. Sign in through your invite link and this page hands you a one-paste setup command — no Docker, nothing to provision.</>}</p>
 
-          <p class="cmd-steps">Prefer the steps? <code>npm i -g {cliInstallSpec}</code>, then <code>tot checkout {appDomain}</code>, <code>cd {appDomain}</code>, <code>tot dev</code>. New to Node? Get Node 24 (LTS) at <a href="https://nodejs.org">nodejs.org</a> — it includes <code>npm</code>.</p>
+          <p class="cmd-steps">Prefer the steps? <code>npm i -g {cliInstallSpec}</code>, then <code>tot clone {appDomain}</code>, <code>cd {appDomain}</code>, <code>tot dev</code>. New to Node? Get Node 24 (LTS) at <a href="https://nodejs.org">nodejs.org</a> — it includes <code>npm</code>.</p>
 
           {isLocalDevLoop && (
             <div class="detect" id="detect" data-listening="true">
@@ -2024,11 +2261,11 @@ const hostedActivityScript = `
           <div class="stage-body">
             <span class="kicker">Step 3</span>
             <h1>Submit your change for preview.</h1>
-            <p class="goal">You've got the loop: edit locally, see it reflected here. When a change is ready, submit it for a preview build — it goes through the compliance review step before it can go live.</p>
+            <p class="goal">You've got the loop: edit locally, see it reflected here. When a change is ready, <code>tot preview</code> bundles it into a compliance-reviewed preview build; once that preview looks right, <code>tot ship</code> promotes it live.</p>
             <div class="term">
               <div class="term-bar"><span class="dots"><span class="dot r"></span><span class="dot y"></span><span class="dot g"></span></span><span class="ttl">preview</span></div>
               <div class="term-body"><span class="c"># bundle your local changes into a reviewable preview</span>
-<span class="cmd">COMING SOON (tot submit)</span></div>
+<span class="cmd">tot preview</span></div>
             </div>
             <div class="cmd-actions">
               <button class="cta" id="submitPreview" type="button">
@@ -2036,7 +2273,7 @@ const hostedActivityScript = `
                 Submit for preview
               </button>
             </div>
-            <p class="cmd-note">This packages your changes and kicks off a compliance-reviewed preview build.</p>
+            <p class="cmd-note">This packages your changes and kicks off a compliance-reviewed preview build. Once it reconciles cleanly, <code>tot ship</code> promotes it live — it always shows you the diff and asks for a confirm first.</p>
           </div>
         </section>
           </div>
@@ -2108,6 +2345,7 @@ const hostedActivityScript = `
                       <button type="button" class="df-mini" id="filesForce">Overwrite</button>
                     </span>
                     <button type="button" class="df-mini df-diffbtn" id="filesDiffBtn" hidden>Diff</button>
+                    <button type="button" class="df-mini df-publishbtn" id="filesPublishBtn" hidden>Publish</button>
                   </div>
                   <textarea class="df-view" id="filesView" readonly spellcheck="false" wrap="off">Pick a file on the left to view its source.</textarea>
                   <pre class="df-diff" id="filesDiff" hidden></pre>
@@ -2160,18 +2398,44 @@ const hostedActivityScript = `
         </div>
       )}
 
+      {/* d3-unhold-dev-step0-connect-mcp: un-held now that MCP access follows the tot20
+          developer grant (federated sign-in / 8425 Stage B is live) — an invited developer
+          already has what this needs, so it's no longer aspirational. Copy/command carried
+          over from the pre-U1-strip /dev (dev.astro @ 110f73e); the "FUNCTIONALLY PENDING"
+          caveat from e58eab5 is dropped since the prerequisite is now real. Static, renders
+          unconditionally like the "next" teaser grid below — not gated on capability. */}
+      <section class="stage" id="stage-mcp">
+        <div class="stage-body">
+          <span class="kicker">Connect the MCP</span>
+          <h1>Bring your AI assistant into the loop.</h1>
+          <p class="goal">The Regulated Storefront is a native AI platform — connecting the Token of Trust MCP lets Claude, Cursor, or any MCP-speaking assistant work your store directly. It works with every major AI platform. On Claude:</p>
+          <div class="term">
+            <div class="term-bar">
+              <span class="dots"><span class="dot r"></span><span class="dot y"></span><span class="dot g"></span></span><span class="ttl">Claude Code</span>
+              <button class="term-copy" id="mcpCopyIcon" type="button" aria-label="Copy the command" title="Copy the command">
+                <svg class="ic-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>
+                <svg class="ic-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
+              </button>
+            </div>
+            <div class="term-body"><span class="c"># add the Token of Trust MCP</span>
+<span class="cmd" id="mcpCmdText">claude mcp add --transport http tot https://mcp.tokenoftrust.com/mcp</span>
+<span class="c">&nbsp;</span>
+<span class="c"># then run /mcp in Claude and sign in with your invite email</span></div>
+          </div>
+          <p class="cmd-note">Other assistants: point them at <code>https://mcp.tokenoftrust.com/mcp</code>. Sign in with the email your invite came to — your access follows your developer grant on this store.</p>
+        </div>
+      </section>
+
       {/* Static "coming soon" cards — pure /dev rendering with no dependency on the
           isLocalDevLoop-only /__tot/* endpoints and no need for the activity bridge, so
           it renders unconditionally on the deployed hosted panel (and locally). Not
-          gated on capability either — it's a teaser of what's next, and AI is one card
-          among several, not a prerequisite. */}
+          gated on capability either — it's a teaser of what's next. */}
       <section class="next">
         <h3>The rest of the workflow</h3>
         <p class="sub">Previews, publish checks, AI assistance, and diagnostics. These open up once you've got the loop — coming soon.</p>
         <div class="nextgrid">
           <div class="nextcard"><span class="path">Share a preview</span><span class="d">Put a branch or PR up at a shareable URL.</span><span class="soon">Coming soon</span></div>
           <div class="nextcard"><span class="path">Publish readiness</span><span class="d">What happens if you publish today — checks &amp; blockers.</span><span class="soon">Coming soon</span></div>
-          <div class="nextcard"><span class="path">Edit with AI</span><span class="d">Connect Claude, Cursor, or Codex to your store.</span><span class="soon">Coming soon</span></div>
           <div class="nextcard"><span class="path">Troubleshooting</span><span class="d">Doctor, logs, server health, and auth checks.</span><span class="soon">Coming soon</span></div>
         </div>
       </section>
@@ -2246,16 +2510,55 @@ const hostedActivityScript = `
     )}
 
     <script nonce={cspNonce} is:inline>
-      // Theme toggle: flip data-theme on <html>, seeded from the OS preference on first click.
+      // Theme toggle: flip data-theme on <html>, seeded from the OS preference on first
+      // click, and PERSISTED to localStorage so a reload stays on the manual choice (the
+      // head seed script above reads this same key before first paint). Clearing storage
+      // falls back to prefers-color-scheme again, same as a first-ever visit.
       (function () {
         var root = document.documentElement;
         var btn = document.getElementById("themeBtn");
         if (!btn) return;
+        var KEY = "tot.theme";
+        function store(v) { try { localStorage.setItem(KEY, v); } catch (e) {} }
         btn.addEventListener("click", function () {
           var cur = root.getAttribute("data-theme");
           var next = cur === "dark" ? "light" : cur === "light" ? "dark"
             : (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "light" : "dark");
           root.setAttribute("data-theme", next);
+          store(next);
+        });
+      })();
+    </script>
+
+    <script nonce={cspNonce} is:inline>
+      // Copy the "connect the MCP" command (d3-unhold-dev-step0-connect-mcp). Static
+      // text (no minting), so unlike #copyIcon this button is visible from load.
+      (function () {
+        var copyIcon = document.getElementById("mcpCopyIcon");
+        var cmdText = document.getElementById("mcpCmdText");
+        var toast = document.getElementById("toast");
+        var toastMsg = document.getElementById("toastMsg");
+        if (!copyIcon || !cmdText) return;
+        var tT;
+        function ping(m) {
+          if (!toast || !toastMsg) return;
+          toastMsg.textContent = m; toast.classList.add("show");
+          clearTimeout(tT); tT = setTimeout(function () { toast.classList.remove("show"); }, 1900);
+        }
+        copyIcon.addEventListener("click", function () {
+          var text = cmdText.textContent;
+          var done = navigator.clipboard
+            ? navigator.clipboard.writeText(text).then(function () { return true; }).catch(function () { return false; })
+            : Promise.resolve(false);
+          done.then(function (ok) {
+            if (ok) {
+              copyIcon.setAttribute("data-copied", "1");
+              setTimeout(function () { copyIcon.removeAttribute("data-copied"); }, 1600);
+              ping("Copied");
+            } else {
+              ping("Select the command above to copy");
+            }
+          });
         });
       })();
     </script>
@@ -2283,9 +2586,16 @@ const hostedActivityScript = `
         var note = document.getElementById("cli-cmd-note");
         var toast = document.getElementById("toast");
         var toastMsg = document.getElementById("toastMsg");
+        var copyIcon = document.getElementById("copyIcon");
         if (!btn || !textEl) return;
         var generic = btn.getAttribute("data-generic") || "";
         var fastpath = btn.getAttribute("data-fastpath") === "1";
+        // The request's tenant prefix ("" host-routed, "/<tenant>" path-routed). Carried
+        // as a data-attr because `basePath` is otherwise defined only inside the SEPARATE
+        // hostedActivity IIFE — referencing it here (the cli-signin-code / -status / -approve
+        // fetches below) was a ReferenceError that the mint's catch surfaced as the opaque
+        // "Couldn't reach the sign-in service" with no request ever sent.
+        var basePath = btn.getAttribute("data-base-path") || "";
         var tT;
         function ping(m) {
           if (!toast) return;
@@ -2298,6 +2608,111 @@ const hostedActivityScript = `
         }
         function label(s) { btn.childNodes[btn.childNodes.length - 1].textContent = s; }
 
+        // Standard copy-icon affordance on the terminal box. Once the command is
+        // revealed, this is the obvious, always-there way to (re)copy it — the
+        // icon→check swap is its own inline confirmation, so copying no longer
+        // depends on the transient toast being noticed.
+        var iconT;
+        function flashCopied() {
+          if (!copyIcon) return;
+          copyIcon.setAttribute("data-copied", "1");
+          copyIcon.setAttribute("aria-label", "Copied");
+          copyIcon.setAttribute("title", "Copied");
+          clearTimeout(iconT);
+          iconT = setTimeout(function () {
+            copyIcon.removeAttribute("data-copied");
+            copyIcon.setAttribute("aria-label", "Copy the command");
+            copyIcon.setAttribute("title", "Copy the command");
+          }, 1600);
+        }
+        function revealIcon() {
+          if (copyIcon) copyIcon.hidden = false;
+        }
+        if (copyIcon) {
+          copyIcon.addEventListener("click", function () {
+            copy(textEl.textContent).then(function (ok) {
+              if (ok) { flashCopied(); ping("Copied — paste & press Enter"); }
+              else ping("Select the command above to copy");
+            });
+          });
+        }
+
+        // ── Rendezvous approval: after a command is generated, the terminal ATTACHES
+        // its own PKCE key and prints a fingerprint; the developer confirms it HERE. This
+        // is the load-bearing anti-interception step — approving the wrong fingerprint is
+        // how a hijack is caught, so the confirm is an explicit, human decision.
+        var rzvRoot = document.getElementById("rzvApprove");
+        var rzvWait = document.getElementById("rzvWait");
+        var rzvConfirm = document.getElementById("rzvConfirm");
+        var rzvFp = document.getElementById("rzvFp");
+        var rzvApproveBtn = document.getElementById("rzvApproveBtn");
+        var rzvDenyBtn = document.getElementById("rzvDenyBtn");
+        var rzvDone = document.getElementById("rzvDone");
+        var rzvTimer = null, rzvCode = null, rzvDecided = false;
+        function rzvShow(el) { if (el) el.hidden = false; }
+        function rzvHide(el) { if (el) el.hidden = true; }
+        function rzvStopPoll() { if (rzvTimer) { clearTimeout(rzvTimer); rzvTimer = null; } }
+        function rzvFinish(msg) {
+          rzvStopPoll(); rzvDecided = true;
+          rzvHide(rzvWait); rzvHide(rzvConfirm);
+          if (rzvDone) { rzvDone.textContent = msg; rzvDone.hidden = false; }
+        }
+        async function rzvPoll() {
+          if (rzvDecided) return;
+          var r, b;
+          try {
+            r = await fetch(basePath + "/api/dev/cli-signin-status", {
+              method: "POST", headers: { "content-type": "application/json" },
+              body: JSON.stringify({ rendezvousCode: rzvCode }),
+            });
+            b = await r.json().catch(function () { return {}; });
+          } catch (e) { rzvTimer = setTimeout(rzvPoll, 2800); return; }
+          if (!r || !r.ok) { rzvTimer = setTimeout(rzvPoll, 3200); return; }
+          if (b.state === "attached" && b.fingerprint) {
+            rzvHide(rzvWait); rzvShow(rzvConfirm);
+            if (rzvFp) { rzvFp.textContent = b.fingerprint; rzvFp.setAttribute("data-fp", b.fingerprint); }
+            return; // stop polling — wait for the human decision
+          }
+          if (b.state === "approved") { rzvFinish("Signed in ✓ — your terminal is good to go."); return; }
+          if (b.state === "denied") { rzvFinish("Rejected — that terminal wasn’t approved. You’re safe; generate a fresh command to try again."); return; }
+          if (b.state === "expired") { rzvFinish("This sign-in expired. Generate a fresh setup command above."); return; }
+          rzvTimer = setTimeout(rzvPoll, 2500); // pending → keep watching
+        }
+        function rzvStart(code) {
+          rzvCode = code; rzvDecided = false;
+          if (rzvApproveBtn) rzvApproveBtn.disabled = false;
+          if (rzvDenyBtn) rzvDenyBtn.disabled = false;
+          rzvShow(rzvRoot); rzvShow(rzvWait); rzvHide(rzvConfirm); rzvHide(rzvDone);
+          rzvStopPoll(); rzvPoll();
+        }
+        async function rzvDecide(decision) {
+          if (rzvDecided) return;
+          var fp = rzvFp ? (rzvFp.getAttribute("data-fp") || "") : "";
+          if (rzvApproveBtn) rzvApproveBtn.disabled = true;
+          if (rzvDenyBtn) rzvDenyBtn.disabled = true;
+          var r;
+          try {
+            r = await fetch(basePath + "/api/dev/cli-signin-approve", {
+              method: "POST", headers: { "content-type": "application/json" },
+              body: JSON.stringify({ rendezvousCode: rzvCode, fingerprint: fp, decision: decision }),
+            });
+          } catch (e) {
+            if (rzvApproveBtn) rzvApproveBtn.disabled = false;
+            if (rzvDenyBtn) rzvDenyBtn.disabled = false;
+            return;
+          }
+          if (decision === "deny") { rzvFinish("Rejected — that terminal wasn’t approved."); return; }
+          if (r.ok) { rzvFinish("Signed in ✓ — your terminal is good to go."); return; }
+          if (rzvApproveBtn) rzvApproveBtn.disabled = false;
+          if (rzvDenyBtn) rzvDenyBtn.disabled = false;
+          var m = r.status === 403 ? "That didn’t match your identity — generate a fresh command and try again."
+            : r.status === 409 ? "That code didn’t match a waiting terminal — re-check it, or generate a fresh command."
+            : "Couldn’t complete approval — try again.";
+          if (rzvDone) { rzvDone.textContent = m; rzvDone.hidden = false; }
+        }
+        if (rzvApproveBtn) rzvApproveBtn.addEventListener("click", function () { rzvDecide("approve"); });
+        if (rzvDenyBtn) rzvDenyBtn.addEventListener("click", function () { rzvDecide("deny"); });
+
         if (!fastpath) {
           btn.addEventListener("click", function () {
             copy(generic).then(function (ok) {
@@ -2316,7 +2731,7 @@ const hostedActivityScript = `
           label(" …"); btn.disabled = true;
           var res, body;
           try {
-            res = await fetch("/api/dev/cli-signin-code", {
+            res = await fetch(basePath + "/api/dev/cli-signin-code", {
               method: "POST",
               headers: { "content-type": "application/json" },
               body: "{}",
@@ -2331,6 +2746,7 @@ const hostedActivityScript = `
             var byStatus = {
               401: "Your session expired — reload the page and sign in again.",
               403: "This account doesn’t have developer access to a store yet.",
+              409: "Your store isn’t set up yet — reload this page for its status.",
               502: "The sign-in service is having a moment — try again.",
               503: "Terminal sign-in isn’t configured on this environment.",
             };
@@ -2338,9 +2754,15 @@ const hostedActivityScript = `
             label(" Copy the command"); btn.disabled = false; busy = false;
             return;
           }
-          // Reveal the real command (contains the one-time code) as a pure text node, then copy it.
+          // Reveal the real command (carries the non-secret rendezvous handle) as a pure
+          // text node, then copy it.
           textEl.textContent = body.command;
+          textEl.classList.remove("is-placeholder");
+          revealIcon();
+          // Start watching for the terminal to attach so we can prompt for approval.
+          if (body.rendezvousCode) rzvStart(body.rendezvousCode);
           var ok = await copy(body.command);
+          if (ok) flashCopied();
           label(ok ? " Copied ✓" : " Select & copy");
           ping(ok ? "Copied — paste & press Enter" : "Select the command above to copy");
           if (note) {