instar 1.3.1176 → 1.3.1177

package/dashboard/index.html

@@ -3540,11 +3540,22 @@
       <div class="tab-purpose">
         What the internal AI calls cost, and where the paid-door caps sit. The dollar figures are a
         <b>reporting</b> view — immutable token counts priced against a reviewed price list on read, so a
-        price correction reflows automatically. <b>No paid door is live yet</b>, so metered spend is $0;
-        subscription/CLI doors are <b>$0 (not per-token billed)</b>. The spend figures above are a report;
-        the controls below set a door's ceilings and take it live, and each of those takes your PIN.
+        price correction reflows automatically. <b>A paid door spends nothing until you arm it below</b>,
+        so metered spend stays $0 until then; subscription/CLI doors are <b>$0 (not per-token billed)</b>.
+        The spend figures above are a report; the controls below set a door's ceilings and take it live,
+        and each of those takes your PIN.
+        <!-- This used to state flatly "No paid door is live yet". That was true only while no operator
+             could arm one; it becomes FALSE the moment they use the controls directly beneath it, and a
+             false statement on the money screen is worse than a vague one. The per-door state is
+             rendered live below and is the authority. -->
       </div>
 
+      <!-- The operator's ON SWITCH (money-layer-operator-enable-surface.md, Phase 2 UI).
+           FIRST on the tab and rendered from the PRE-GATE routes, which answer while the
+           layer is off — everything below it is gated on this switch, so when it is off
+           the rest of the tab can only 503 and would otherwise read as broken. -->
+      <div id="moneyLayerEnable" class="spend-arm-root"></div>
+
       <!-- Glance floors F10/F11 (topic 29836, Phase 3): the shared component renders
            the headline + totals tiles + drill-down here. "Metered / paid door / reflows"
            became plain words at the glance ("pay-per-use"); the per-model math and the
@@ -3660,8 +3671,27 @@
       .spend-arm-plan-text { font-size:14px; line-height:1.5; padding:12px; border-radius:8px;
         border:1px solid var(--border,#2a2a2a); white-space:pre-wrap; word-break:break-word; }
       .spend-arm-plan-expiry, .spend-arm-note { font-size:12px; opacity:.7; }
+      .spend-arm-status { font-size:13px; opacity:.85; line-height:1.5; }
+      .spend-arm-pin-row { display:flex; flex-direction:column; gap:8px; margin-top:10px; }
+      .spend-arm-pin { width:100%; box-sizing:border-box; min-height:44px; padding:10px 12px;
+        font-size:16px; border:1px solid var(--border,#2a2a2a); border-radius:8px;
+        background:transparent; color:inherit; }
       @media (max-width:520px) { .spend-arm-btn { flex:1 1 100%; } }
 
+      /* The operator's ON SWITCH for the spending controls. Colour carries the ONE fact
+         that matters — enforcing vs not — and never implies that spending is armed. */
+      .mle-state { border:1px solid var(--border,#2a2a2a); border-left-width:4px; border-radius:8px;
+        padding:12px 14px; display:flex; flex-direction:column; gap:6px; }
+      .mle-state-enforcing { border-left-color:#16a34a; }
+      .mle-state-pending-restart { border-left-color:#eab308; }
+      .mle-state-failed { border-left-color:#dc2626; }
+      .mle-state-off { border-left-color:var(--border,#2a2a2a); }
+      .mle-headline { font-size:15px; font-weight:600; }
+      .mle-detail { font-size:13px; opacity:.8; line-height:1.5; }
+      .mle-config-notice { font-size:13px; line-height:1.5; color:#f59e0b; }
+      .mle-machine { font-size:12px; opacity:.6; }
+      .mle-actions { display:flex; flex-wrap:wrap; gap:8px; }
+
       /* Provider group heading — only rendered when more than one provider is
          enrolled, so a single-provider install looks exactly as it did before. */
       .sub-provider-heading { font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
@@ -3695,6 +3725,10 @@
       #subMatrix { width:100%; min-width:0; overflow-x:auto; }
       .sub-matrix th, .sub-matrix td { border:1px solid var(--border,#2a2a2a); padding:8px 10px; text-align:center; vertical-align:top; }
       .sub-matrix-acct { text-align:left; font-weight:600; word-break:break-all; }
+      /* Provider band inside the grid — same rule as the cards above: it exists only when
+         more than one provider is enrolled, so a single-provider install is unchanged. */
+      .sub-matrix-group { text-align:left; font-size:11px; font-weight:700; letter-spacing:.06em;
+        text-transform:uppercase; opacity:.75; background:var(--panel-alt,rgba(255,255,255,.04)); }
       .sub-matrix-mach { font-weight:600; }
       .sub-matrix-off { opacity:.55; }
       .sub-matrix-cell.sub-matrix-offline { opacity:.5; }
@@ -6014,6 +6048,12 @@
       if (!glanceRoot) return;
       const grain = (document.getElementById('spendGrain') || {}).value || 'day';
 
+      // The switch renders FIRST and independently: its routes answer while the layer is
+      // off, and every fetch below is gated on the layer being on. Rendering it after the
+      // gated calls would mean the one control that can fix a 503 disappears whenever the
+      // 503 happens — which is exactly the state the operator is in when they need it.
+      loadMoneyLayerEnable();
+
       const glance = await loadGlanceModule();
       if (!glance) { glanceRoot.textContent = 'Loading the glance view failed — refresh to retry.'; return; }
 
@@ -8667,6 +8707,210 @@
       return __glanceModule;
     }
 
+    // ── Spend tab — the operator's ON SWITCH (money-layer enable, Phase 2 UI) ──
+    // The six pre-gate routes answer 200 while the money layer is OFF; that is what makes
+    // this panel possible at all. Flow: read status → plan (Bearer, no PIN) → the SERVER's
+    // words shown verbatim → PIN commit → if it is now switched on but not yet built, the
+    // restart step → poll status until it reports enforcing.
+    let __mleModule = null;
+    async function loadMleModule() {
+      if (!__mleModule) {
+        try { __mleModule = await import('/dashboard/money-layer-enable.js'); }
+        catch (e) { console.error('[money-layer-enable] module load failed', e); return null; }
+      }
+      return __mleModule;
+    }
+
+    // The plan (or restart nonce) currently awaiting the operator's PIN. Cleared on every
+    // re-render so a PIN can never be applied to an approval that has since gone stale.
+    let __mlePendingPlan = null;
+    let __mlePendingRestart = null;
+
+    function setMleStatus(text) {
+      const n = document.getElementById('mleStatus');
+      if (n) n.textContent = text || '';
+    }
+
+    async function loadMoneyLayerEnable() {
+      const root = document.getElementById('moneyLayerEnable');
+      if (!root) return;
+      const M = await loadMleModule();
+      if (!M) { root.textContent = 'Loading the spending-control switch failed — refresh to retry.'; return; }
+
+      let status = null;
+      try {
+        status = await apiFetch('/routing-spend/enable-status');
+      } catch (err) {
+        root.replaceChildren();
+        const note = document.createElement('div');
+        note.className = 'spend-arm-note';
+        note.textContent = M.enableNote(err && err.message);
+        root.appendChild(note);
+        return;
+      }
+
+      __mlePendingPlan = null;
+      __mlePendingRestart = null;
+      root.replaceChildren();
+
+      const h = document.createElement('h3');
+      h.className = 'spend-arm-h';
+      h.textContent = 'Spending controls';
+      root.appendChild(h);
+
+      const panel = document.createElement('div');
+      root.appendChild(panel);
+      M.renderEnablePanel(document, panel, status, { onAction: (action) => onMleAction(action) });
+
+      const approval = document.createElement('div');
+      approval.id = 'mleApproval';
+      root.appendChild(approval);
+
+      const st = document.createElement('div');
+      st.id = 'mleStatus';
+      st.className = 'spend-arm-status';
+      root.appendChild(st);
+    }
+
+    /** Render the PIN box + Approve button under whichever approval is pending. */
+    function mleShowPinBox(label, onApprove) {
+      const holder = document.getElementById('mleApproval');
+      if (!holder) return;
+      const row = document.createElement('div');
+      row.className = 'spend-arm-pin-row';
+      const pin = document.createElement('input');
+      pin.type = 'password';
+      pin.inputMode = 'numeric';
+      pin.id = 'mlePin';
+      pin.className = 'spend-arm-pin';
+      pin.placeholder = 'Dashboard PIN';
+      pin.autocomplete = 'off';
+      const go = document.createElement('button');
+      go.className = 'spend-arm-btn spend-arm-btn-commit';
+      go.textContent = label;
+      go.addEventListener('click', () => onApprove((pin.value || '').trim()));
+      row.appendChild(pin);
+      row.appendChild(go);
+      holder.appendChild(row);
+    }
+
+    async function onMleAction(action) {
+      const M = await loadMleModule();
+      if (!M) return;
+      setMleStatus('');
+      if (action === '__restart') { return mleStartRestart(); }
+      const holder = document.getElementById('mleApproval');
+      if (!holder) return;
+      try {
+        const plan = await apiFetch('/routing-spend/plan-money-layer', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify(M.planRequest(action)),
+        });
+        __mlePendingPlan = plan;
+        __mlePendingRestart = null;
+        // The SERVER's words, verbatim — including the case where it substituted the
+        // acknowledged "this will not stop spending" variant for a plain disable.
+        M.renderPlanApproval(document, holder, plan);
+        mleShowPinBox('Approve with PIN', (pinValue) => mleCommit(pinValue));
+      } catch (err) {
+        holder.replaceChildren();
+        setMleStatus(M.enableNote(err && err.message));
+      }
+    }
+
+    async function mleCommit(pinValue) {
+      const M = await loadMleModule();
+      if (!M || !__mlePendingPlan) { setMleStatus('Preview a change first.'); return; }
+      if (!pinValue) { setMleStatus('Enter your dashboard PIN to approve.'); return; }
+      try {
+        const out = await apiFetch('/routing-spend/money-layer/commit', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify(M.commitRequest(__mlePendingPlan, pinValue)),
+        });
+        __mlePendingPlan = null;
+        // The server's own message is the report — it is the only thing that knows whether
+        // this enabled, half-enabled, or cleared a flag that did not stop spending.
+        setMleStatus(out && out.message ? String(out.message) : 'Applied.');
+        const next = M.nextStepAfterCommit(out);
+        await loadMoneyLayerEnable();
+        setMleStatus(out && out.message ? String(out.message) : 'Applied.');
+        if (next === 'restart') mleStartRestart();
+      } catch (err) {
+        setMleStatus(M.enableNote(err && err.message));
+      }
+    }
+
+    async function mleStartRestart() {
+      const M = await loadMleModule();
+      if (!M) return;
+      const holder = document.getElementById('mleApproval');
+      if (!holder) return;
+      try {
+        const mint = await apiFetch('/routing-spend/money-layer/restart-nonce', { method: 'POST' });
+        __mlePendingRestart = mint;
+        __mlePendingPlan = null;
+        M.renderRestartConfirmation(document, holder, mint);
+        mleShowPinBox('Restart with PIN', (pinValue) => mleCommitRestart(pinValue));
+      } catch (err) {
+        holder.replaceChildren();
+        setMleStatus(M.enableNote(err && err.message));
+      }
+    }
+
+    async function mleCommitRestart(pinValue) {
+      const M = await loadMleModule();
+      if (!M || !__mlePendingRestart) { setMleStatus('Start the restart step first.'); return; }
+      if (!pinValue) { setMleStatus('Enter your dashboard PIN to approve.'); return; }
+      let hash;
+      try {
+        // The hash is taken over the text that was DISPLAYED, which is what binds the
+        // restart to words the operator actually saw.
+        hash = await M.sha256Hex(__mlePendingRestart.confirmationText);
+      } catch {
+        setMleStatus('This page can’t approve a restart over a plain http address — open the ' +
+          'dashboard on its https link (or on this machine directly) and try again. Nothing has changed.');
+        return;
+      }
+      try {
+        const out = await apiFetch('/routing-spend/money-layer/restart', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify(M.restartRequest(__mlePendingRestart.nonce, hash, pinValue)),
+        });
+        __mlePendingRestart = null;
+        const holder = document.getElementById('mleApproval');
+        if (holder) holder.replaceChildren();
+        setMleStatus(out && out.message ? String(out.message) : 'Restart requested.');
+        // The restart response cannot observe the NEW process, so the panel keeps checking
+        // until the status it reads says the controls are enforcing.
+        mlePollAfterRestart(0);
+      } catch (err) {
+        setMleStatus(M.enableNote(err && err.message));
+      }
+    }
+
+    function mlePollAfterRestart(attempt) {
+      if (attempt > 20) {
+        setMleStatus('The server has not come back yet. Refresh this tab in a moment to see ' +
+          'whether the spending controls are enforcing.');
+        return;
+      }
+      setTimeout(async () => {
+        let status = null;
+        try { status = await apiFetch('/routing-spend/enable-status'); }
+        catch { return mlePollAfterRestart(attempt + 1); }   /* @silent-fallback-ok — the server is restarting; keep waiting */
+        await loadMoneyLayerEnable();
+        if (status && status.enforcementReady === true) {
+          setMleStatus('Spending controls are up and enforcing. Nothing is armed yet — arm a door below.');
+          loadRoutingSpend();
+        } else {
+          mlePollAfterRestart(attempt + 1);
+        }
+      }, 3000);
+    }
+
     // ── Spend tab — paid-door arming (Increment B UI) ──
     // Two PIN-committed steps (set both ceilings, then go live), each previewed as the
     // SERVER's rendered wording before the PIN box appears. The commit posts only the
@@ -8750,6 +8994,10 @@
       btns.appendChild(mkBtn('Preview cap change', 'spend-arm-btn', () => previewSpendPlan('caps-adjust')));
       btns.appendChild(mkBtn('Preview go live', 'spend-arm-btn', () => previewSpendPlan('go-live')));
       btns.appendChild(mkBtn('Freeze this door', 'spend-arm-btn spend-arm-btn-freeze', freezeSpendDoor));
+      // Freeze is always available and needs no PIN — so its REVERSE has to be reachable from
+      // the same screen, or the operator can stop spending here and has nowhere to resume it.
+      // Unfreeze is PIN-gated on purpose: releasing money is the operator's, halting it is cheap.
+      btns.appendChild(mkBtn('Unfreeze this door', 'spend-arm-btn', () => previewSpendPlan('unfreeze')));
       root.appendChild(btns);
 
       const planBox = document.createElement('div');
@@ -8804,7 +9052,12 @@
       if (!row) { setSpendArmStatus('Pick a door first.'); return; }
 
       let fields;
-      if (action === 'caps-adjust') {
+      if (action === 'unfreeze') {
+        // Say so here rather than posting a plan the server would refuse: "that door isn't
+        // frozen" is an answer; a 400 from the commit is a puzzle.
+        if (!row.frozen) { setSpendArmStatus('That door isn’t frozen — there is nothing to release.'); return; }
+        fields = { keyRef: row.keyRef };
+      } else if (action === 'caps-adjust') {
         const num = (id) => {
           const raw = (document.getElementById(id) || {}).value;
           return raw === '' || raw === undefined ? '' : Number(raw);
@@ -8840,8 +9093,13 @@
       const pinEl = document.getElementById('spendArmPin');
       const pin = pinEl ? pinEl.value : '';
       if (!pin) { setSpendArmStatus('Enter your dashboard PIN to approve.'); return; }
+      // Each action has its OWN commit route and each refuses a plan signed for a different
+      // one. Posting everything to caps/adjust made "go live" — arming a door, the point of
+      // this panel — fail with a 400 after the operator had already entered their PIN.
+      const route = M.commitRoute(__spendPendingPlan);
+      if (!route) { setSpendArmStatus('That approval is no longer valid. Preview the change again.'); return; }
       try {
-        await apiFetch('/routing-spend/caps/adjust', {
+        await apiFetch(route, {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify(M.commitRequest(__spendPendingPlan, pin)),

package/dashboard/money-layer-enable.js

@@ -0,0 +1,293 @@
+/**
+ * Spend tab — the operator's ON SWITCH for the spending-control layer (Phase 2 UI for
+ * docs/specs/money-layer-operator-enable-surface.md).
+ *
+ * Phase 1 built six pre-gate routes and no screen. The operator's report was the same
+ * sentence twice: *"still has no path/mechanism to enable any options."* The arming
+ * controls next to this panel sit BEHIND this switch, so until there is a button here,
+ * every one of them answers 503 and the tab reads as broken rather than as off.
+ *
+ * Four things this module refuses to do, because each one would re-create a failure the
+ * spec is built around:
+ *
+ * 1. It never says "spending works". Enabling arms NO door — every paid door stays
+ *    refused at $0 until it is separately armed. The copy says "spending controls are up
+ *    and enforcing" and nothing stronger.
+ * 2. It never claims enabling took effect immediately. The layer is CONSTRUCTED at server
+ *    start, so a commit answers `enable-pending-restart` and this panel says so and offers
+ *    the restart, rather than showing a switch that reads on over machinery that is down.
+ * 3. It never paraphrases the server's words. The plan text and the restart confirmation
+ *    text are displayed VERBATIM — a client that paraphrased could show a reassuring label
+ *    over a different signed action.
+ * 4. It never presents a store-only disable as "stopped". When the config file is what
+ *    enables the layer, clearing the operator flag does NOT stop spending, and this panel
+ *    leads with freeze instead of a disable that would quietly do nothing.
+ *
+ * A lifecycle enum value is never rendered — the operator sees copy derived from
+ * `enforcementReady` and `enableSources`, never `probed` or `enable-pending-restart` raw.
+ *
+ * Every dynamic value is written with textContent (same contract as subscriptions.js).
+ */
+
+/** Element helper — textContent ONLY, never innerHTML. */
+function el(doc, tag, cls, text) {
+  const n = doc.createElement(tag);
+  if (cls) n.className = cls;
+  if (text !== undefined && text !== null) n.textContent = String(text);
+  return n;
+}
+
+/**
+ * What to tell the operator when a pre-gate call fails.
+ *
+ * These six routes answer 200 while the layer is OFF — that is their whole purpose — so a
+ * 503 here means something quite different from a 503 on the arming controls: the enable
+ * SURFACE itself did not construct. Saying "your switch is off" there would send the
+ * operator to flip a switch that is not the problem.
+ */
+export function enableNote(message) {
+  const m = message === undefined || message === null ? '' : String(message);
+  if (/bad-pin|pin/i.test(m)) {
+    return 'That PIN was not accepted. Nothing has changed.';
+  }
+  if (/lock-not-held/i.test(m)) {
+    return 'Another copy of the agent server owns this machine right now, so this one will ' +
+      'not act on money settings. Nothing has changed.';
+  }
+  if (/stale-nonce|confirmation-hash-mismatch|expired/i.test(m)) {
+    return 'That approval went stale before it was used. Nothing has changed — start it again.';
+  }
+  if (/nothing-to-mirror/i.test(m)) {
+    return 'There is nothing to copy — the config file is not switching this on.';
+  }
+  if (/rate|too many/i.test(m)) {
+    return 'That was too soon after the last attempt. Nothing has changed — wait a moment ' +
+      'and try again.';
+  }
+  if (/503|surface-unavailable|surface-error/i.test(m)) {
+    return 'The spending-control settings could not be read on this machine, so nothing here ' +
+      'will act rather than guess. Nothing has changed.';
+  }
+  return 'Could not reach the spending-control settings just now. Nothing has changed — try again.';
+}
+
+/**
+ * The headline state, in the operator's words.
+ *
+ * `enforcementReady` is the ONE fact that means the controls are live; everything else is
+ * a reason they are not. The three off-reasons are kept distinct because the remedy
+ * differs: off (turn it on), asked-for-but-not-built (restart), and built-but-refusing
+ * (restart, and say which part refused).
+ */
+export function enableHeadline(status) {
+  const s = status || {};
+  if (s.enforcementReady === true) {
+    return {
+      state: 'enforcing',
+      headline: 'Spending controls are up and enforcing',
+      // The one sentence that stops "on" being read as "spend works".
+      detail: 'Turning them on arms nothing by itself — every paid service stays refused, at $0, ' +
+        'until you arm it below.',
+    };
+  }
+  const lifecycle = typeof s.lifecycleState === 'string' ? s.lifecycleState : '';
+  if (lifecycle === 'enable-pending-restart') {
+    return {
+      state: 'pending-restart',
+      headline: 'Switched on — waiting for a restart to take effect',
+      detail: 'The spending controls are built when the agent server starts, so they are not ' +
+        'enforcing yet. Restarting this machine’s agent server finishes it.',
+    };
+  }
+  if (lifecycle === 'construction-failed' || lifecycle === 'probe-failed') {
+    const part = typeof s.failingComponent === 'string' && s.failingComponent ? s.failingComponent : '';
+    return {
+      state: 'failed',
+      headline: 'Switched on, but the controls are NOT enforcing',
+      detail: (part ? `The part that refused is: ${part}. ` : '') +
+        'Nothing can spend in this state — the paid path refuses when the controls are not up. ' +
+        'A restart of this machine’s agent server is the remedy.',
+    };
+  }
+  return {
+    state: 'off',
+    headline: 'Spending controls are off',
+    detail: 'While they are off, the caps and go-live controls below cannot act. Turning them ' +
+      'on is your decision — it is deliberately not something an agent can flip.',
+  };
+}
+
+/**
+ * The notice for an enable that came from the CONFIG FILE rather than from this screen.
+ *
+ * This is the trap in the whole feature: pressing "turn off" here clears the operator flag
+ * only. No route writes the config file, so with `config-enabled` the layer stays on and a
+ * disable that looked successful would not have stopped anything. Freeze is the control
+ * that actually halts money, so the notice leads with it.
+ */
+export function configSourceNotice(status) {
+  const state = (status && status.enableSources && status.enableSources.state) || '';
+  if (state === 'config-enabled') {
+    return 'This is switched on by the config file on this machine, not from here. Turning it ' +
+      'off here clears only my setting — it will NOT stop spending. To stop spending now, ' +
+      'freeze the door below; freezing is instant and always available.';
+  }
+  if (state === 'both-enabled') {
+    return 'This is switched on both here and in the config file on this machine. Turning it ' +
+      'off here clears only my setting; the config file would keep it on.';
+  }
+  return null;
+}
+
+/**
+ * Which actions this state genuinely offers. Buttons are derived from state rather than
+ * always rendered and conditionally refused — an inert button is the same "where do I tap?"
+ * failure this screen exists to remove.
+ */
+export function availableActions(status) {
+  const s = status || {};
+  const sources = s.enableSources || {};
+  const out = [];
+  if (s.enforcementReady !== true) {
+    // Offered in EVERY not-enforcing state, including one already switched on: "switch says
+    // on, machinery down" is exactly the state this control exists to rescue, so re-pressing
+    // it must re-verify rather than be treated as a no-op.
+    out.push({ action: 'money-layer-enable', label: sources.store === true ? 'Re-check and turn on' : 'Turn on spending controls' });
+  }
+  if (sources.config === true && sources.store !== true) {
+    out.push({ action: 'money-layer-mirror-config', label: 'Also record it here' });
+  }
+  if (sources.store === true) {
+    out.push({ action: 'money-layer-disable', label: 'Turn off' });
+  }
+  if (s.restartEligible === true) {
+    out.push({ action: '__restart', label: 'Restart the agent server' });
+  }
+  return out;
+}
+
+/** The plan request. Bearer-only and deliberately PIN-free: the operator must see the
+ *  server's words BEFORE any secret leaves the page. */
+export function planRequest(action) {
+  return { action };
+}
+
+/** The commit body — the plan identity plus the PIN, never a form field. The server
+ *  derives what to apply solely from the plan it rendered. */
+export function commitRequest(plan, pin) {
+  return { planId: (plan || {}).planId, nonce: (plan || {}).nonce, pin };
+}
+
+/** The restart body. The hash binds the restart to the exact confirmation text that was
+ *  DISPLAYED, so a restart cannot be approved against words the operator never saw. */
+export function restartRequest(nonce, confirmationTextHash, pin) {
+  return { nonce, confirmationTextHash, pin };
+}
+
+/**
+ * SHA-256 of the confirmation text, hex.
+ *
+ * The server mints the text and its hash but returns only the TEXT, so the client hashes
+ * what it displayed — that is what makes the binding meaningful. `crypto.subtle` exists on
+ * https and on localhost; over plain http to a LAN address it does not, and the honest
+ * answer there is to say the restart cannot be approved from this page rather than to
+ * silently send an unbound request.
+ */
+export async function sha256Hex(text) {
+  const subtle = (globalThis.crypto && globalThis.crypto.subtle) || null;
+  if (!subtle) {
+    throw new Error('secure-context-required');
+  }
+  const bytes = new TextEncoder().encode(String(text));
+  const digest = await subtle.digest('SHA-256', bytes);
+  return Array.from(new Uint8Array(digest)).map((b) => b.toString(16).padStart(2, '0')).join('');
+}
+
+/** Render the server's plan text for approval — verbatim, never paraphrased. */
+export function renderPlanApproval(doc, target, plan) {
+  if (!target) return;
+  target.replaceChildren();
+  if (!plan || !plan.renderedText) {
+    target.appendChild(el(doc, 'div', 'spend-arm-note', 'Nothing to approve yet.'));
+    return;
+  }
+  target.appendChild(el(doc, 'div', 'spend-arm-plan-label', 'Approve exactly this:'));
+  target.appendChild(el(doc, 'div', 'spend-arm-plan-text', plan.renderedText));
+  if (plan.expiresAt) {
+    target.appendChild(el(doc, 'div', 'spend-arm-plan-expiry', `This approval expires at ${plan.expiresAt}.`));
+  }
+}
+
+/**
+ * Render the restart confirmation — the server's words, verbatim, plus the one fact the
+ * server's text cannot know the operator is missing: this restarts the WHOLE agent server
+ * on this machine, not just the spending controls.
+ */
+export function renderRestartConfirmation(doc, target, mint) {
+  if (!target) return;
+  target.replaceChildren();
+  if (!mint || !mint.confirmationText) {
+    target.appendChild(el(doc, 'div', 'spend-arm-note', 'Nothing to approve yet.'));
+    return;
+  }
+  target.appendChild(el(doc, 'div', 'spend-arm-plan-label', 'Approve exactly this:'));
+  target.appendChild(el(doc, 'div', 'spend-arm-plan-text', mint.confirmationText));
+  target.appendChild(el(doc, 'div', 'spend-arm-note',
+    'This restarts the whole agent server on this machine, not only the spending controls. ' +
+    'It comes back on its own; anything mid-flight is interrupted.'));
+  if (mint.expiresAt) {
+    target.appendChild(el(doc, 'div', 'spend-arm-plan-expiry', `This approval expires at ${mint.expiresAt}.`));
+  }
+}
+
+/**
+ * What a commit's own words mean for what happens next. The server's `message` is shown
+ * as-is; this decides whether the RESTART step is now the operator's next move.
+ */
+export function nextStepAfterCommit(result) {
+  const r = result || {};
+  // ORDER IS LOAD-BEARING. A store-only disable under a config enable comes back with
+  // `enforcementReady: true` — the layer really is still enforcing, because clearing the
+  // operator flag did not stop it. Checking `enforcementReady` first would report that
+  // outcome as 'done', which is precisely the "I disabled it and it is still on" reading
+  // the whole surface exists to make legible. What the operator DID is decided first.
+  if (r.storeCleared === true) {
+    const sources = r.enableSources || {};
+    return sources.config === true ? 'still-enabled-by-config' : 'done';
+  }
+  if (r.enforcementReady === true) return 'done';
+  return 'restart';
+}
+
+/** Render the state block. `target` is replaced. */
+export function renderEnablePanel(doc, target, status, opts = {}) {
+  if (!target) return;
+  target.replaceChildren();
+  if (!status) {
+    target.appendChild(el(doc, 'div', 'spend-arm-note',
+      'Could not read whether the spending controls are on. Nothing has changed.'));
+    return;
+  }
+  const head = enableHeadline(status);
+  const box = el(doc, 'div', `mle-state mle-state-${head.state}`);
+  box.appendChild(el(doc, 'div', 'mle-headline', head.headline));
+  box.appendChild(el(doc, 'div', 'mle-detail', head.detail));
+  const notice = configSourceNotice(status);
+  if (notice) box.appendChild(el(doc, 'div', 'mle-config-notice', notice));
+  if (status.anyKeyFrozen === true) {
+    box.appendChild(el(doc, 'div', 'mle-detail', 'At least one door is frozen — that door cannot spend.'));
+  }
+  if (status.machineNickname) {
+    box.appendChild(el(doc, 'div', 'mle-machine', `These controls belong to ${status.machineNickname}.`));
+  }
+  target.appendChild(box);
+
+  const btns = el(doc, 'div', 'mle-actions');
+  for (const a of availableActions(status)) {
+    const b = el(doc, 'button', 'spend-arm-btn', a.label);
+    b.setAttribute('data-mle-action', a.action);
+    if (typeof opts.onAction === 'function') b.addEventListener('click', () => opts.onAction(a.action));
+    btns.appendChild(b);
+  }
+  target.appendChild(btns);
+}

package/dashboard/spend-arming.js

@@ -123,6 +123,31 @@ export function commitRequest(plan, pin) {
   return { planId: (plan || {}).planId, nonce: (plan || {}).nonce, pin };
 }
 
+/**
+ * WHICH route commits a rendered plan.
+ *
+ * The server has one commit route per action and each REFUSES a plan whose signed action
+ * is not its own — the plan-binding discipline, working exactly as designed. The dashboard
+ * posted every plan to `/routing-spend/caps/adjust`, so "Preview go live" rendered its plan
+ * correctly, took the operator's PIN, and then failed with a 400 they could do nothing
+ * about: arming a door — the whole point of the panel — was unreachable from the screen
+ * built to do it. Found by driving the panel against a real server, not by a test; the unit
+ * tests were green because none of them knew a second route existed.
+ *
+ * Derived from the PLAN's action, never from the button that was pressed: the server may
+ * substitute a different action than the one requested, and the commit must follow what was
+ * actually rendered and approved.
+ */
+export function commitRoute(plan) {
+  const action = plan && typeof plan.action === 'string' ? plan.action : '';
+  if (action === 'go-live') return '/routing-spend/go-live';
+  if (action === 'unfreeze') return '/routing-spend/unfreeze';
+  if (action === 'caps-adjust') return '/routing-spend/caps/adjust';
+  // An unknown action gets NO route rather than a default one: posting an unrecognised plan
+  // to the caps route is how this defect happened, and the server would refuse it anyway.
+  return null;
+}
+
 /** Render the server's plan text for approval. The text is the server's, shown verbatim. */
 export function renderPlanPreview(doc, target, plan) {
   if (!target) return;