From 6f39b2b2cd0d6ac9a92fdf2f1894397315ba4f67 Mon Sep 17 00:00:00 2001
From: Mick <103085050+Apolloccrypt@users.noreply.github.com>
Date: Thu, 3 Sep 2026 09:16:08 +0200
Subject: [PATCH 1/4] ParaSend takes its API key from the session, and from
 nowhere else

A buyer review walked into this: Send in the signed-in navigation opened
/parashare on a card headed "Your API key" with an empty box in it, and
the key he typed there was not the key of the account he was signed in
with. The page had two sources of truth. GET /api/user/account/key was
one; a localStorage entry written by any earlier visit, on any account,
was the other, and the second outlived the first. A stale or hand-typed
key sails past the format check, fails at the relay, and all the sender
sees is a button that will not light up.

One source now.

* parashare.page.js reads the account key from the session on every load
  and keeps it in memory. No localStorage write, no localStorage read.
  nginx puts /api/user/ in the relay_auth zone with burst 5, so a 429 is
  the page arriving next to its own siblings rather than a broken
  account: one fetch, one retry two seconds later, then it gives up.
* When it gives up, it says so. A banner names the endpoint failure, what
  to do about it, and where to write if it keeps happening, and it keeps
  the manual card one click away for a self-host whose deployment has no
  such endpoint.
* The slim key row is now the default state of step 1 and the manual card
  is the exception, which is the class logic the other way round from
  what shipped. The row is amber and says "loading" until the key is
  really in; it may not claim a key it does not have.
* keyValid no longer waits on discoverRelay. A sector that answers and
  refuses the key is a verdict on the key and still disables the button;
  a sector that answers nothing at all is a network problem and now
  reports itself at "Create secure session", with a retry, instead of
  leaving a silent disabled button on screen.
* /privacy listed paramant_api_key as "removed when you sign out" and
  nothing removed it. The key is gone from the list and from the row-28
  inventory in docs/site-claims.md, and sign-out clears an old one that
  an earlier build left behind.

Gates. site-claims row 28 now harvests get/set as storage and asserts a
remove-only key is NOT on the list, because naming a key the browser no
longer keeps is the same untruth as omitting one it does; it also pins
by name that no frontend file writes paramant_api_key again. A new
suite, tests/parasend-session-key.test.mjs, runs parashare.page.js for
real in a vm context with a hand-built DOM and a stubbed fetch, node
builtins only, and measures 200, 429-then-200 and 500 against the slim
row, the button, the banner and the absence of any localStorage write.
Every case was verified by sabotage in both directions, listed in the
file header.

nav-auth.js keeps its ?v=6: the version is shared by 52 pages and the
cache-bust guard requires one version per asset, so bumping it here
would collide with the navigation work in flight. The line added there
is legacy cleanup whose delay by one cache generation costs nothing.
---
 docs/site-claims.md                 |   2 +-
 frontend/js/nav-auth.js             |   1 +
 frontend/js/parashare.page.js       | 177 +++++++++++++------
 frontend/parashare.html             |  53 +++++-
 frontend/privacy.html               |   1 -
 tests/parasend-session-key.test.mjs | 253 ++++++++++++++++++++++++++++
 tests/site-claims.test.mjs          |  50 ++++--
 7 files changed, 465 insertions(+), 72 deletions(-)
 create mode 100644 tests/parasend-session-key.test.mjs

diff --git a/docs/site-claims.md b/docs/site-claims.md
index 622da03a..03eaeba2 100644
--- a/docs/site-claims.md
+++ b/docs/site-claims.md
@@ -56,7 +56,7 @@ Pages not in scope: everything behind a login or in a one-shot flow
 | 25 | The sub-processor lists are the parties the server code calls, and no page may deny the US one | privacy, dpa, press, architecture, sweep | Every `https.request({hostname})`, `fetch('https://…')` and `*_HOST` constant in `relay/*.js`, `relay/lib/*.js`, `admin/server.js`, `admin/lib/*.js`. That is `api.resend.com` and `api.mollie.com`. **Mollie was missing from the /dpa table** that customers sign while /privacy named it; added. Bunny.net (DNS, Slovenia) added to the /privacy list, which the rest of the site already named. Extended in the review round: /press and /architecture said "No US entity in the chain" while the signed /dpa table names Resend Inc. in the US under SCCs, so no page may make that denial while a US row stands | this PR |
 | 26 | Signing-envelope and delivery-receipt retention | privacy, dpa | `relay/envelope.js` `DEFAULT_TTL_DAYS = 30`, `MAX_TTL_DAYS = 365`; `relay/relay.js` `RECEIPT_TTL_MS = 15 * 60 * 1000`. The page said "until its expiry" for the first and nothing at all for the second; both now carry the number, and the signed /dpa sub-processor row carries the same two figures instead of "may persist until envelope expiry" | this PR |
 | 27 | The CT-log hash | privacy, dpa | `relay/lib/ct-hash.js` is SHA3-256 throughout. /dpa said SHA3-256, /privacy said SHA-256 in the same row; corrected | this PR |
-| 28 | The browser-storage list | privacy | Every `localStorage` key the frontend writes, resolved through literals, constants and key-building helpers. The page listed `ps_free_uses` "to enforce the 10/day limit" and `pm_docs_key`, neither of which exists anywhere in the repository, and the limit it described is 10 a month; it did not list `paramant_api_key`, `paramant_status_v1`, `parasign.placement.tpl.v1`, `paramant_fp_…` or `paramant.keysetup.dismissed.v1`, which it does write. Pinned in both directions | this PR |
+| 28 | The browser-storage list | privacy | Every `localStorage` key the frontend reads or writes, resolved through literals, constants and key-building helpers. The page listed `ps_free_uses` "to enforce the 10/day limit" and `pm_docs_key`, neither of which exists anywhere in the repository, and the limit it described is 10 a month; it did not list `paramant_status_v1`, `parasign.placement.tpl.v1`, `paramant_fp_…` or `paramant.keysetup.dismissed.v1`, which it does write. `paramant_api_key` was listed as "removed when you sign out" while nothing removed it; ParaSend has since stopped writing it altogether (`/parashare` reads `GET /api/user/account/key` on every load and keeps the key in memory), so the row is off the list and the two remaining mentions in the frontend are `removeItem` cleanup of what an older build stored. The harvest therefore counts get/set as storage and asserts a remove-only key is NOT named: claiming a key the browser no longer keeps is the same untruth as omitting one it does. Pinned in both directions, plus a named assertion that no frontend file writes `paramant_api_key` again | this PR |
 | 29 | What a self-hosted relay logs | security | `deploy/nginx-selfhost.conf` `log_format paramant_minimal` starts with `$remote_addr`. The IP-logging row described the hosted config only, so a self-hoster read "logging is off" about a config that logs addresses. Row extended | this PR |
 | 30 | One Hetzner location | dpa, privacy, README, sweep | The DPA is the document a customer relies on and says Nuremberg (NBG1); `README.md` said Frankfurt in the table that claims EU jurisdiction. Corrected to the DPA, and no file may name a second city. Which datacentre actually runs the service is still not provable from this repository | this PR |
 | 31 | What Mollie receives, and the billing stance | dpa, privacy, terms | `relay/relay.js` routes `/v2/billing/checkout` and `/v2/billing/webhook` and calls `mollie.createPayment` unconditionally, so the sub-processor row stays. The payload is amount, description, redirectUrl, webhookUrl and `metadata{accountId, product, plan, interval}`, and **no e-mail**: the only path that would send one is `ensureCustomer`, which returns `recurring_disabled` while `BILLING_MODE` is unset (`relay/lib/billing-recurring.js:123`, `relay/lib/mollie.js` `billingStance`). /dpa named an e-mail address it never sends; /privacy and /terms still said billing was not live and plans were arranged by hand. All three now describe one-off Mollie payments with no subscriptions, and the stance is asserted by calling `billingStance()` rather than by reading it | this PR |
diff --git a/frontend/js/nav-auth.js b/frontend/js/nav-auth.js
index 33814d8f..65347cb6 100644
--- a/frontend/js/nav-auth.js
+++ b/frontend/js/nav-auth.js
@@ -115,6 +115,7 @@
       try {
         await fetch('/api/user/logout', { method: 'POST', credentials: 'include' });
       } catch (err) {}
+      try { localStorage.removeItem('paramant_api_key'); } catch (err) {} // legacy: /parashare no longer writes it, clear an old one
       if (location.pathname === '/account' || location.pathname.startsWith('/auth/')) {
         location.href = '/';
       } else {
diff --git a/frontend/js/parashare.page.js b/frontend/js/parashare.page.js
index fffb18b0..27e2cbf5 100644
--- a/frontend/js/parashare.page.js
+++ b/frontend/js/parashare.page.js
@@ -10,6 +10,13 @@ const RELAY_SECTORS = {
 let RELAY_API = RELAY_SECTORS.health; // updated after key validation
 
 let apiKey = '', keyValid = false, selectedFile = null, selectedFiles = [];
+// Sector discovery is its own question, kept apart from keyValid: a key can be
+// perfectly good while not one of the four sectors answers. relayReady says a
+// sector was found; relayError carries the reason it was not.
+let relayReady = false, relayError = '';
+// nginx puts /api/user/ in the relay_auth zone (burst 5). One fetch for the
+// account key, and at most one retry, 2 s later, when that fetch is throttled.
+const KEY_RETRY_MS = 2000;
 let sessionToken = '', ws = null;
 let receiverPubs = null;
 
@@ -58,17 +65,22 @@ function setStepperStage(key) {
   });
 }
 
-// Show the full API-key card (used by the "Change" link in the slim row)
+// Show the full API-key card. Two callers: the "Change" link in the slim row,
+// and the way out on the error banner, which is the path a self-hoster without
+// /api/user/account/key takes.
 function expandApiKeyCard() {
   var s = $('step-setup');
-  if (s) s.classList.remove('has-saved-key');
+  if (s) s.classList.add('manual-key');
+  setKeyError(false);
   var inp = $('api-key');
   if (inp) { inp.value = ''; inp.focus(); onKeyInput(); }
+  // Legacy only. This page no longer writes the key to localStorage; this
+  // clears whatever a build from before that change left behind.
   try { localStorage.removeItem('paramant_api_key'); } catch (_) {}
 }
 
-// Apply slim API-key view when a key was auto-fetched (login flow) or
-// saved locally. Pure cosmetic: the underlying input still holds the key.
+// The slim row is the default state of step 1. This fills it in once the
+// session key has really arrived: the mask, the label, and the green dot.
 function applySlimApiKeyView() {
   var inp = $('api-key');
   if (!inp || !inp.value) return;
@@ -76,9 +88,25 @@ function applySlimApiKeyView() {
   if (mask) {
     var v = inp.value;
     mask.textContent = v.length > 14 ? v.slice(0, 8) + '...' + v.slice(-4) : v;
+    mask.hidden = false;
   }
+  var label = $('ps-key-slim-label');
+  if (label) label.textContent = 'Using your account key';
+  var row = $('ps-key-slim');
+  if (row) { row.classList.remove('is-loading'); row.hidden = false; }
   var s = $('step-setup');
-  if (s) s.classList.add('has-saved-key');
+  if (s) s.classList.remove('manual-key');
+  setKeyError(false);
+}
+
+// The banner. Shown only when the account key could not be loaded at all, and
+// it takes the slim row with it: a row that says "using your account key" while
+// there is no key would be the same lie the manual box used to tell.
+function setKeyError(on) {
+  var box = $('ps-key-error');
+  if (box) box.classList.toggle('is-shown', !!on);
+  var row = $('ps-key-slim');
+  if (row && on) row.hidden = true;
 }
 function setStatus(id, msg, cls) {
   const el = $(id);
@@ -191,6 +219,10 @@ async function showReceiverConnected(kyberPub, ecdhPub) {
 }
 
 // ── Relay discovery: try all sectors in parallel, pick first valid ──
+// It used to fold two different failures into one null: "a sector answered and
+// refused this key" and "not one sector answered". The first is about the key,
+// the second is about the network, and only the first should ever disable the
+// button. So the two are reported apart.
 async function discoverRelay(key) {
   const results = await Promise.allSettled(
     Object.entries(RELAY_SECTORS).map(async ([sector, url]) => {
@@ -199,43 +231,67 @@ async function discoverRelay(key) {
         signal: AbortSignal.timeout(5000)
       });
       const d = await r.json();
-      if (!d.valid) throw new Error('invalid');
-      return { sector, url, plan: d.plan };
+      return { sector, url, plan: d.plan, valid: !!d.valid };
     })
   );
-  const valid = results.filter(r => r.status === 'fulfilled').map(r => r.value);
-  if (!valid.length) return null;
-  // Prefer health; otherwise first sector that responded
-  return valid.find(v => v.sector === 'health') || valid[0];
+  const answered = results.filter(r => r.status === 'fulfilled').map(r => r.value);
+  const valid = answered.filter(a => a.valid);
+  return {
+    // Every sector that spoke said no. That is a verdict on the key.
+    rejected: answered.length > 0 && valid.length === 0,
+    // Prefer health; otherwise first sector that responded
+    found: valid.find(v => v.sector === 'health') || valid[0] || null
+  };
 }
 
 // ── Key validation ──
+// The key is never written to localStorage. It comes from the session
+// (/api/user/account/key) or, on a self-host without that endpoint, from the
+// manual card. Persisting it bought nothing and put a bearer credential in a
+// store that outlives the sign-out that was documented to clear it.
 async function onKeyInput() {
   apiKey = $('api-key').value.trim();
-  if (apiKey) localStorage.setItem('paramant_api_key', apiKey);
+  setCreateStatus('');
   if (apiKey.length < 10 || !apiKey.startsWith('pgp_')) {
     setStatus('key-status', 'Invalid format');
-    keyValid = false; updateBtn(); return;
+    keyValid = false; relayReady = false; relayError = ''; updateBtn(); return;
   }
+  // A well-formed key that came from the session is usable now. Whether a
+  // sector answers is a separate question, and it is answered below without
+  // holding the button hostage.
+  keyValid = true; relayReady = false; relayError = '';
   setStatus('key-status', 'Checking...');
+  updateBtn();
+  let d;
   try {
-    const found = await discoverRelay(apiKey);
-    if (found) {
-      RELAY_API = found.url;
-      const sectorLabel = found.sector !== 'health' ? ` · ${found.sector}` : '';
-      setStatus('key-status', `✓ Valid — plan: ${found.plan}${sectorLabel}`, 'ok');
-      keyValid = true;
-    } else {
-      setStatus('key-status', 'Invalid or revoked key', 'err');
-      keyValid = false;
-    }
-  } catch(e) {
-    setStatus('key-status', 'Could not verify key', 'err');
+    d = await discoverRelay(apiKey);
+  } catch (e) {
+    d = { answered: false, rejected: false, found: null };
+  }
+  if (d.found) {
+    RELAY_API = d.found.url;
+    relayReady = true;
+    const sectorLabel = d.found.sector !== 'health' ? ` · ${d.found.sector}` : '';
+    setStatus('key-status', `✓ Valid, plan: ${d.found.plan}${sectorLabel}`, 'ok');
+  } else if (d.rejected) {
+    setStatus('key-status', 'Invalid or revoked key', 'err');
     keyValid = false;
+  } else {
+    // Nothing answered. Say so where the user is looking, and let the button
+    // stay live: the failure belongs at the press, with a reason attached.
+    relayError = 'No relay sector answered. Check your connection and press Create secure session again.';
+    setStatus('key-status', 'Could not reach a relay sector. You can still continue.', 'err');
   }
   updateBtn();
 }
 
+function setCreateStatus(msg, cls) {
+  const el = $('create-status');
+  if (!el) return;
+  el.textContent = msg || '';
+  el.className = 'status-line' + (cls ? ' ' + cls : '');
+}
+
 function onFileSelect() {
   const files = $('file-input').files;
   selectedFile = files[0] || null;
@@ -261,6 +317,18 @@ function updateBtn() {
 
 // ── Session creation ──
 async function createSession() {
+  // A sector that would not answer during discovery used to leave this button
+  // disabled with no explanation. Try once more here, and if it still will not
+  // answer, say so out loud instead of going quiet.
+  if (!relayReady) {
+    setCreateStatus('Looking for a relay sector...');
+    await onKeyInput();
+    if (!relayReady) {
+      setCreateStatus(relayError || 'No relay sector answered. Try again in a moment.', 'err');
+      return;
+    }
+  }
+  setCreateStatus('');
   // Generate random invite token
   const tokenBytes = crypto.getRandomValues(new Uint8Array(16));
   sessionToken = 'inv_' + u8toHex(tokenBytes).slice(0, 32);
@@ -558,35 +626,44 @@ document.addEventListener('DOMContentLoaded', () => {
     return;
   }
 
-  // Prefer the session-derived key: if the user is logged in, their current API key
-  // is the authoritative value. localStorage may still hold a stale key from a
-  // previous (revoked/rotated) account and would otherwise show "Invalid key".
-  (async function resolveKey(){
-    try {
-      const r = await fetch('/api/user/account/key', { credentials: 'include' });
-      if (r.ok) {
-        const d = await r.json();
-        if (d && d.api_key) {
-          $('api-key').value = d.api_key;
-          try { localStorage.setItem('paramant_api_key', d.api_key); } catch {}
-          onKeyInput();
-          applySlimApiKeyView();
-          return;
-        }
-      }
-    } catch {}
-    // Not logged in or endpoint unavailable: fall back to localStorage (manual paste flow).
-    const saved = localStorage.getItem('paramant_api_key');
-    if (saved) {
-      $('api-key').value = saved;
-      onKeyInput();
-      applySlimApiKeyView();
-    }
-  })();
+  loadAccountKey();
   // Small delay so DOM is fully painted before Globe.gl reads dimensions
   setTimeout(() => initGlobe(), 400);
 });
 
+// The session is the only source of the key. localStorage used to be a second
+// one, and it is what the buyer review caught: a stale or hand-typed key sat
+// there, the slim row said "using your account key", and Send died on a key
+// that belonged to nobody. One source, one failure mode, one banner.
+async function fetchAccountKey() {
+  let r = await fetch('/api/user/account/key', { credentials: 'include' });
+  // nginx rate-limits /api/user/ (zone relay_auth, burst 5). A 429 here is the
+  // page arriving next to its own siblings, not a broken account, so it earns
+  // exactly one retry and then gives up.
+  if (r.status === 429) {
+    await new Promise(res => setTimeout(res, KEY_RETRY_MS));
+    r = await fetch('/api/user/account/key', { credentials: 'include' });
+  }
+  if (!r.ok) throw new Error('account key: HTTP ' + r.status);
+  const d = await r.json();
+  if (!d || !d.api_key) throw new Error('account key: none on this session');
+  return d.api_key;
+}
+
+async function loadAccountKey() {
+  try {
+    const key = await fetchAccountKey();
+    $('api-key').value = key;
+    applySlimApiKeyView();
+    await onKeyInput();
+  } catch (e) {
+    setKeyError(true);
+    setStatus('key-status', 'Account key could not be loaded', 'err');
+    keyValid = false;
+    updateBtn();
+  }
+}
+
 function toggleGlobe() {
   const overlay = document.getElementById('globe-overlay');
   const mainEl  = document.querySelector('main');
diff --git a/frontend/parashare.html b/frontend/parashare.html
index d6bf27bd..8db66b93 100644
--- a/frontend/parashare.html
+++ b/frontend/parashare.html
@@ -45,15 +45,37 @@
 .ps-guide strong{color:var(--ink-1);font-weight:600}
 .ps-guide .ps-guide-kicker{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:5px;font-weight:600}
 
-/* Slim API-key row -- shown when key was auto-fetched from /api/user/account/key */
-.ps-key-slim{display:none;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-1);background:var(--surface-sunk);margin-bottom:16px;font-family:var(--mono);font-size:11px;color:var(--ink-3);flex-wrap:wrap}
+/* The account key comes from the session and from nowhere else, so the slim row
+   is the DEFAULT state of step 1 and the manual card is the exception. It used
+   to be the other way round: the card was the default and the slim row appeared
+   only after a key had been fetched, which is why a signed-in sender was shown
+   an empty "API key" box and typed one in by hand. #step-setup carries
+   .manual-key only when the user asks for the box (the Change link, or the way
+   out on the error banner), which is the self-host / paste-a-key path. */
+.ps-key-slim{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-1);background:var(--surface-sunk);margin-bottom:16px;font-family:var(--mono);font-size:11px;color:var(--ink-3);flex-wrap:wrap}
+.ps-key-slim[hidden]{display:none}
 .ps-key-slim .ps-key-status{display:inline-flex;align-items:center;gap:8px}
 .ps-key-slim .ps-key-status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sig-done);flex-shrink:0}
+/* Amber while the fetch is in flight: the row must not claim a key it does not
+   have yet. It turns green in applySlimApiKeyView, once the key is really in. */
+.ps-key-slim.is-loading .ps-key-status::before{background:var(--sig-wait)}
 .ps-key-slim .ps-key-mask{color:var(--ink-1);font-weight:600}
-.ps-key-slim .ps-key-change{background:transparent;border:none;min-height:36px;padding:4px 6px;color:var(--accent);font:inherit;font-size:11px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;letter-spacing:.04em}
-.ps-key-slim .ps-key-change:hover{color:var(--accent-hov)}
-#step-setup.has-saved-key .ps-key-card{display:none}
-#step-setup.has-saved-key .ps-key-slim{display:flex}
+.ps-key-mask[hidden]{display:none}
+/* Not scoped to the slim row: the same control is the way out on the error
+   banner, and there it has to look like an action too. */
+.ps-key-change{background:transparent;border:none;min-height:36px;padding:4px 6px;color:var(--accent);font:inherit;font-size:11px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;letter-spacing:.04em}
+.ps-key-change:hover{color:var(--accent-hov)}
+.ps-key-card{display:none}
+#step-setup.manual-key .ps-key-card{display:block}
+#step-setup.manual-key .ps-key-slim{display:none}
+
+/* The one thing that must never fail silently: no key, no ParaSend. The banner
+   says what happened, what to do, and leaves a door open for a self-hoster
+   whose deployment has no /api/user/account/key at all. */
+.ps-key-error{display:none;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:16px;padding:12px 14px;border:1px solid var(--line-2);border-left:3px solid var(--sig-stop);border-radius:var(--r-1);background:var(--sig-stop-bg);font:13px/1.62 var(--sans);color:var(--ink-1)}
+.ps-key-error.is-shown{display:flex}
+.ps-key-error p{margin:0}
+.ps-key-error .ps-key-change{padding-left:0;font-family:var(--mono)}
 
 /* design-system.css puts 32px of padding on every .card; here the padding
    belongs to .card-head and .card-body, so it is reset. */
@@ -394,11 +416,16 @@ <h1>Encrypted file relay</h1>
     <strong>Pick a file, set how long the link lives.</strong> Your file stays in your browser until step 4. The relay never sees plaintext.
   </div>
 
-  <div class="ps-key-slim" aria-label="Signed-in API key">
-    <span class="ps-key-status">Using your account key <span class="ps-key-mask" id="ps-key-mask">pgp_...</span></span>
+  <div class="ps-key-slim is-loading" id="ps-key-slim" aria-label="Account key">
+    <span class="ps-key-status"><span id="ps-key-slim-label">Loading your account key</span> <span class="ps-key-mask" id="ps-key-mask" hidden></span></span>
     <button type="button" class="ps-key-change" data-click="expandApiKeyCard">Change</button>
   </div>
 
+  <div class="ps-key-error" id="ps-key-error" role="alert">
+    <p>Your account key could not be loaded. Sign in again; if it keeps happening, mail <a href="mailto:privacy@paramant.app">privacy@paramant.app</a>.</p>
+    <button type="button" class="ps-key-change" data-click="expandApiKeyCard">Use a key by hand</button>
+  </div>
+
   <div class="card ps-key-card">
     <div class="card-head"><div class="dot"></div><div class="card-head-title">Your API key</div></div>
     <div class="card-body">
@@ -433,6 +460,10 @@ <h1>Encrypted file relay</h1>
   </div>
 
   <button class="btn" id="btn-create-session" disabled data-click="createSession">Create secure session &rarr;</button>
+  <!-- A sector that will not answer used to leave this button quietly disabled
+       with no reason given. It now reports itself here, at the moment of the
+       press. -->
+  <div class="status-line" id="create-status" role="status"></div>
 </div>
 
 <!-- STEP 2: Waiting for receiver -->
@@ -609,7 +640,11 @@ <h2 class="paramant-h1">Sent.</h2>
 <!-- One sentence for "we broke it, here is what to do", shared with the signer.
      Plain script, above the page code that reads window.paramantErrors. -->
 <script src="/js/error-message.js?v=1" defer></script>
-<script src="/js/parashare.page.js?v=4" defer></script>
+<!-- v5, not v4. #396 shipped a v4 of this file and so did the commit below it;
+     two different contents under one immutable url is exactly what the ?v= is
+     there to prevent, and check-cache-bust cannot see it because both sides
+     agree on the number. -->
+<script src="/js/parashare.page.js?v=5" defer></script>
 <script src="/nav.js?v=15" defer></script>
 <script src="/js/nav-auth.js?v=7" defer></script>
 <footer>
diff --git a/frontend/privacy.html b/frontend/privacy.html
index 94a7706b..73f335a0 100644
--- a/frontend/privacy.html
+++ b/frontend/privacy.html
@@ -260,7 +260,6 @@ <h2>Local storage in your browser</h2>
 <ul>
 <li><strong>ECDH + ML-KEM key pairs</strong>: generated locally for end-to-end encryption (SDK / Ghost Pipe sessions)</li>
 <li><strong>Nonce registry</strong>: replay-attack protection (SDK sessions)</li>
-<li><strong>API key</strong> (<code>paramant_api_key</code>): the key of the account you are signed in with, kept so the send screen does not ask for it again. Removed when you sign out.</li>
 <li><strong>Status history</strong> (<code>paramant_status_v1</code>): the last 24 hours of relay health checks your own browser made on the status page</li>
 <li><strong>Signature placement template</strong> (<code>parasign.placement.tpl.v1</code>): where you last put a seal on a page, so the next document opens the same way</li>
 <li><strong>Seen signing fingerprints</strong> (<code>paramant_fp_&hellip;</code>): a marker per signing key you have already been shown, so a known key is not flagged as new</li>
diff --git a/tests/parasend-session-key.test.mjs b/tests/parasend-session-key.test.mjs
new file mode 100644
index 00000000..ebf438ec
--- /dev/null
+++ b/tests/parasend-session-key.test.mjs
@@ -0,0 +1,253 @@
+// ParaSend takes its API key from the session and from nowhere else.
+//
+// The bug a buyer walked into: Send in the signed-in navigation opened
+// /parashare on a card headed "Your API key" with an empty box in it, and the
+// key he typed there was not the key of the account he was signed in with. The
+// page had two sources of truth. GET /api/user/account/key was one; a
+// localStorage entry written by any earlier visit, on any account, was the
+// other, and the second outlived the first. A stale or hand-typed key sails
+// past the format check, fails at the relay, and the only thing the sender sees
+// is a button that will not light up.
+//
+// So: one source. frontend/js/parashare.page.js reads the account key from the
+// session on every load, keeps it in memory, and never writes it to
+// localStorage. This suite runs that page script for real, in a vm context
+// with a hand-built DOM and a stubbed fetch, node builtins only, so it runs in
+// the "Root integration suites" job next to the other tests/*.mjs, and it
+// measures the three answers the endpoint can give.
+//
+// Verified by sabotage, both directions:
+//   • put `localStorage.setItem('paramant_api_key', apiKey)` back into
+//     onKeyInput and the "never persists" case goes red (and so does row 28 of
+//     site-claims.test.mjs);
+//   • drop the 429 retry, or make the 500 path silent instead of showing the
+//     banner, and the matching case goes red;
+//   • make keyValid depend on discoverRelay again and "a dead sector does not
+//     disable the button" goes red;
+//   • and each case was run against an unpatched parashare.page.js, where the
+//     slim-row, banner and retry cases fail and only the happy path passes.
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { fileURLToPath } from 'node:url';
+
+const PS_ROOT = path.join(path.dirname(fileURLToPath(import.meta.url)), '..');
+const PS_JS = fs.readFileSync(path.join(PS_ROOT, 'frontend/js/parashare.page.js'), 'utf8');
+const PS_HTML = fs.readFileSync(path.join(PS_ROOT, 'frontend/parashare.html'), 'utf8');
+const KEY_URL = '/api/user/account/key';
+const FAKE_KEY = 'pgp_livetestkey0000000000abcd';
+
+// ── A DOM small enough to read, big enough to run the page script ────────────
+function makeElement(id) {
+  const classes = new Set();
+  const el = {
+    id, value: '', textContent: '', innerHTML: '', className: '',
+    hidden: false, disabled: false, files: [], style: {},
+    classList: {
+      add: (...c) => c.forEach((x) => classes.add(x)),
+      remove: (...c) => c.forEach((x) => classes.delete(x)),
+      toggle: (c, on) => (on === undefined ? (classes.has(c) ? classes.delete(c) : classes.add(c)) : (on ? classes.add(c) : classes.delete(c))),
+      contains: (c) => classes.has(c),
+    },
+    focus() {}, blur() {}, setAttribute() {}, getAttribute: () => null,
+    addEventListener() {}, appendChild() {}, closest: () => null,
+  };
+  return el;
+}
+
+// A run of the page: the vm context, the DOM it saw, and what it asked for.
+function runPage({ keyResponses, sectorOk = true }) {
+  const elements = new Map();
+  const getElementById = (id) => {
+    if (!elements.has(id)) elements.set(id, makeElement(id));
+    return elements.get(id);
+  };
+  const listeners = new Map();
+  const calls = { key: 0, sector: 0, urls: [], timeouts: [], storage: [] };
+  let keyTurn = 0;
+
+  const respond = (spec) => ({
+    ok: spec.status < 400,
+    status: spec.status,
+    json: async () => spec.body,
+  });
+
+  const context = {
+    console,
+    URLSearchParams,
+    AbortSignal: { timeout: () => null },
+    crypto: globalThis.crypto,
+    navigator: { clipboard: { writeText: async () => {} } },
+    location: { search: '', hash: '', origin: 'https://paramant.app', pathname: '/parashare', reload() {} },
+    localStorage: {
+      getItem: (k) => { calls.storage.push(['get', k]); return null; },
+      setItem: (k, v) => { calls.storage.push(['set', k, v]); },
+      removeItem: (k) => { calls.storage.push(['remove', k]); },
+    },
+    document: {
+      getElementById,
+      querySelector: () => null,
+      querySelectorAll: () => [],
+      createElement: () => makeElement('created'),
+      head: { appendChild() {} },
+      body: { appendChild() {} },
+      addEventListener: (type, fn) => { listeners.set(type, (listeners.get(type) || []).concat(fn)); },
+    },
+    // Every timer resolves on the next microtask; the delay asked for is
+    // recorded instead, which is how the 2 s retry is measured without waiting.
+    setTimeout: (fn, ms) => { calls.timeouts.push(ms); queueMicrotask(() => { try { fn(); } catch (_) {} }); return 0; },
+    clearTimeout: () => {}, setInterval: () => 0, clearInterval: () => {},
+    queueMicrotask,
+    act: () => {},
+    fetch: async (url) => {
+      calls.urls.push(url);
+      if (String(url).endsWith(KEY_URL)) {
+        calls.key += 1;
+        const spec = keyResponses[Math.min(keyTurn++, keyResponses.length - 1)];
+        return respond(spec);
+      }
+      calls.sector += 1;
+      if (!sectorOk) throw new Error('sector unreachable');
+      return respond({ status: 200, body: { valid: true, plan: 'pro' } });
+    },
+  };
+  context.window = context;
+  context.globalThis = context;
+  vm.createContext(context);
+  vm.runInContext(PS_JS, context, { filename: 'parashare.page.js' });
+  return { context, elements, calls, listeners, getElementById };
+}
+
+// Fire DOMContentLoaded and let every pending microtask drain.
+async function loadPage(opts) {
+  const run = runPage(opts);
+  for (const fn of run.listeners.get('DOMContentLoaded') || []) fn();
+  for (let i = 0; i < 60; i += 1) await new Promise((r) => setImmediate(r));
+  return run;
+}
+
+// `let keyValid` at the top of a script is a lexical binding, not a property of
+// the context object, so the page's state is read back through the context
+// rather than off it.
+const evalIn = (run, expr) => vm.runInContext(expr, run.context);
+
+function pickAFile(run) {
+  run.getElementById('file-input').files = [{ name: 'contract.pdf', size: 4096 }];
+  evalIn(run, 'updateBtn()');
+  return !run.getElementById('btn-create-session').disabled;
+}
+
+const wroteTheKey = (run) => run.calls.storage.some(([op, k]) => op === 'set' && k === 'paramant_api_key');
+
+// ── 1. The endpoint answers ─────────────────────────────────────────────────
+test('a 200 from /api/user/account/key gives the slim row, a usable button, and nothing in localStorage', async () => {
+  const run = await loadPage({ keyResponses: [{ status: 200, body: { api_key: FAKE_KEY, revealable: true } }] });
+
+  assert.equal(run.calls.key, 1, 'the account key is fetched exactly once when the endpoint answers');
+  assert.equal(run.getElementById('api-key').value, FAKE_KEY, 'the session key is the key the page holds');
+
+  // The slim row is the state the sender lands in: no empty "API key" box.
+  const slim = run.getElementById('ps-key-slim');
+  assert.equal(slim.hidden, false, 'the slim row is shown');
+  assert.equal(slim.classList.contains('is-loading'), false, 'the slim row stops claiming to be loading');
+  assert.equal(run.getElementById('ps-key-slim-label').textContent, 'Using your account key');
+  assert.equal(run.getElementById('ps-key-mask').hidden, false, 'the masked key is revealed next to the label');
+  assert.match(run.getElementById('ps-key-mask').textContent, /^pgp_.*\.\.\..{4}$/, 'the row shows a masked key, not the whole one');
+  assert.equal(run.getElementById('step-setup').classList.contains('manual-key'), false,
+    'the manual card stays closed: #step-setup only carries .manual-key when the user asks for the box');
+  assert.equal(run.getElementById('ps-key-error').classList.contains('is-shown'), false, 'no banner on the happy path');
+
+  assert.equal(evalIn(run, 'keyValid'), true, 'the key is usable');
+  assert.equal(pickAFile(run), true, 'pick a file and "Create secure session" is live');
+  assert.equal(wroteTheKey(run), false, 'the account key is never written to localStorage');
+});
+
+// ── 2. nginx throttles the page ─────────────────────────────────────────────
+// /api/user/ sits in the relay_auth zone (deploy/nginx-paramant-live.conf:146,
+// burst 5). /parashare loads next to nav-auth's session check and the quota
+// call, so a 429 here is the page arriving in its own crowd, not a broken
+// account. One retry, 2 s later, and then it gives up.
+test('a 429 on the account key is retried once, two seconds later, and then succeeds', async () => {
+  const run = await loadPage({
+    keyResponses: [
+      { status: 429, body: {} },
+      { status: 200, body: { api_key: FAKE_KEY, revealable: true } },
+    ],
+  });
+
+  assert.equal(run.calls.key, 2, 'exactly one retry: the rate limiter must not be hammered');
+  assert.ok(run.calls.timeouts.includes(2000), `the retry waits 2000 ms; delays asked for were ${run.calls.timeouts.join(', ')}`);
+  assert.equal(run.getElementById('api-key').value, FAKE_KEY, 'the retry is what delivers the key');
+  assert.equal(run.getElementById('ps-key-slim').hidden, false, 'the slim row is reached through the retry');
+  assert.equal(run.getElementById('ps-key-error').classList.contains('is-shown'), false, 'a throttled first try is not an error to the user');
+  assert.equal(evalIn(run, 'keyValid'), true);
+  assert.equal(wroteTheKey(run), false, 'the account key is never written to localStorage');
+});
+
+// ── 3. The endpoint is broken ───────────────────────────────────────────────
+test('a 500 on the account key shows the banner, hides the slim row, and offers a key by hand', async () => {
+  const run = await loadPage({ keyResponses: [{ status: 500, body: {} }] });
+
+  assert.equal(run.calls.key, 1, 'a 500 is not a rate limit: no retry');
+  assert.equal(run.getElementById('ps-key-error').classList.contains('is-shown'), true, 'the failure is stated, not swallowed');
+  assert.equal(run.getElementById('ps-key-slim').hidden, true,
+    'the slim row may not say "using your account key" when there is no account key');
+  assert.equal(evalIn(run, 'keyValid'), false);
+  assert.equal(pickAFile(run), false, 'without a key the button stays disabled, and the banner says why');
+  assert.equal(wroteTheKey(run), false, 'the account key is never written to localStorage');
+
+  // The way out for a self-host whose deployment has no such endpoint.
+  evalIn(run, 'expandApiKeyCard()');
+  assert.equal(run.getElementById('step-setup').classList.contains('manual-key'), true, 'the manual card opens on request');
+  assert.equal(run.getElementById('ps-key-error').classList.contains('is-shown'), false, 'and the banner steps aside');
+});
+
+// ── 4. The banner's words, and the default state of the markup ──────────────
+test('/parashare ships the banner copy and opens on the slim row, not the manual card', () => {
+  assert.ok(PS_HTML.includes('Your account key could not be loaded. Sign in again; if it keeps happening, mail <a href="mailto:privacy@paramant.app">privacy@paramant.app</a>.'),
+    'the banner must name the one thing to do and the one address to write to');
+  assert.match(PS_HTML, /data-click="expandApiKeyCard">Use a key by hand</, 'the banner must carry the manual way out');
+
+  // The class logic, the other way round from what shipped: the slim row is the
+  // default and the card is the exception.
+  assert.match(PS_HTML, /\.ps-key-slim\{display:flex/, 'the slim row is the default');
+  assert.match(PS_HTML, /\.ps-key-card\{display:none\}/, 'the manual card is hidden by default');
+  assert.match(PS_HTML, /#step-setup\.manual-key \.ps-key-card\{display:block\}/, '.manual-key opens the card');
+  assert.match(PS_HTML, /#step-setup\.manual-key \.ps-key-slim\{display:none\}/, '.manual-key closes the slim row');
+  assert.ok(!/has-saved-key/.test(PS_HTML) && !/has-saved-key/.test(PS_JS),
+    'has-saved-key was the old inverted class; nothing may still reference it');
+  assert.ok(!/localStorage\.setItem\(\s*['"]paramant_api_key/.test(PS_JS),
+    'parashare.page.js must not persist the account key');
+  assert.ok(!/localStorage\.getItem\(\s*['"]paramant_api_key/.test(PS_JS),
+    'parashare.page.js must not read a key back out of localStorage: the session is the only source');
+});
+
+// ── 5. A dead sector is an error, not a dead button ─────────────────────────
+// discoverRelay races four sector hosts. When none of them answers, that says
+// nothing about the key, and it used to leave the button greyed out with no
+// reason on screen. The key and the sector are now separate questions.
+test('a sector that will not answer leaves the button live and reports itself at the press', async () => {
+  const run = await loadPage({ keyResponses: [{ status: 200, body: { api_key: FAKE_KEY, revealable: true } }], sectorOk: false });
+
+  assert.ok(run.calls.sector >= 4, 'all four sectors were tried');
+  assert.equal(evalIn(run, 'keyValid'), true, 'the session key is good; only the sector is unreachable');
+  assert.equal(evalIn(run, 'relayReady'), false);
+  assert.equal(pickAFile(run), true, 'the button is usable: a silent disabled button explains nothing');
+
+  await evalIn(run, 'createSession()');
+  const status = run.getElementById('create-status');
+  assert.match(status.textContent, /No relay sector answered/, 'pressing the button states the sector failure');
+  assert.equal(status.className, 'status-line err');
+  assert.equal(run.getElementById('session-link').textContent, '', 'and no session is created on a dead sector');
+});
+
+// ── 6. Sign-out clears what an older build stored ───────────────────────────
+test('signing out removes a paramant_api_key left behind by an earlier build', () => {
+  const nav = fs.readFileSync(path.join(PS_ROOT, 'frontend/js/nav-auth.js'), 'utf8');
+  const signout = nav.slice(nav.indexOf("signout.addEventListener('click'"));
+  assert.ok(signout.length > 0, 'nav-auth.js must still wire a sign-out handler');
+  assert.match(signout.slice(0, 700), /localStorage\.removeItem\('paramant_api_key'\)/,
+    '/privacy said this key was "removed when you sign out" and nothing removed it. The page no longer writes it, and sign-out now clears an old one.');
+});
diff --git a/tests/site-claims.test.mjs b/tests/site-claims.test.mjs
index ead08113..ca90df1d 100644
--- a/tests/site-claims.test.mjs
+++ b/tests/site-claims.test.mjs
@@ -1453,8 +1453,19 @@ test('the CT-log hash named on /privacy and /dpa is the one ct-hash.js computes'
 // 28 ── The browser-storage list. It named ps_free_uses "to enforce the 10/day
 // limit client-side" and pm_docs_key; neither string exists anywhere in the
 // repository, and the limit it described is 10 a month, not a day. Meanwhile the
-// key the site really does write, an API key, was not on the list at all.
-// Verified by sabotage: deleting any one <code> entry fails this by key name.
+// key the site really did write, an API key, was not on the list at all.
+//
+// That API key is now the other half of the same problem. The page also said
+// paramant_api_key was "removed when you sign out" and nothing removed it, and
+// ParaSend has since stopped writing it altogether: /parashare reads
+// GET /api/user/account/key on every load and keeps the key in memory only. So
+// the inventory harvests what the frontend READS OR WRITES, and a key it only
+// ever DELETES (legacy cleanup of what an older build stored) is asserted to be
+// OFF the list rather than on it. Naming a key the site no longer keeps is the
+// same untruth as omitting one it does.
+// Verified by sabotage in both directions: deleting any one <code> entry fails
+// this by key name; putting localStorage.setItem('paramant_api_key', …) back
+// into frontend/js/parashare.page.js fails it by the ParaSend assertion below.
 test('the browser storage /privacy lists is the storage the frontend writes', () => {
   const files = [];
   (function walk(dir, prefix) {
@@ -1465,21 +1476,35 @@ test('the browser storage /privacy lists is the storage the frontend writes', ()
   })(path.join(ROOT, 'frontend'), '');
   assert.ok(files.length > 20, `the frontend walk found only ${files.length} files; the check would be vacuous`);
 
-  const keys = new Set();
-  for (const f of files) {
-    const src = stripJsComments(read(`frontend/${f}`));
-    for (const m of src.matchAll(/localStorage\.(?:get|set|remove)Item\(\s*['"`]([^'"`]+)/g)) keys.add(m[1]);
+  // Three shapes of key, harvested twice: once for the verbs that mean the
+  // browser is holding something (get/set), once for the verb that means the
+  // browser is being emptied (remove).
+  const harvest = (src, verbs, into) => {
+    for (const m of src.matchAll(new RegExp(`localStorage\\.(?:${verbs})Item\\(\\s*['"\`]([^'"\`]+)`, 'g'))) into.add(m[1]);
     // A key held in a constant, and a key built by a helper: both are used here.
-    for (const m of src.matchAll(/localStorage\.(?:get|set|remove)Item\(\s*([A-Za-z_$][\w$]*)\s*[,)]/g)) {
+    for (const m of src.matchAll(new RegExp(`localStorage\\.(?:${verbs})Item\\(\\s*([A-Za-z_$][\\w$]*)\\s*[,)]`, 'g'))) {
       const c = new RegExp(`(?:const|let|var)\\s+${m[1]}\\s*=\\s*['"\`]([^'"\`]+)`).exec(src);
-      if (c) keys.add(c[1]);
+      if (c) into.add(c[1]);
     }
-    for (const m of src.matchAll(/localStorage\.(?:get|set|remove)Item\(\s*([A-Za-z_$][\w$]*)\(/g)) {
+    for (const m of src.matchAll(new RegExp(`localStorage\\.(?:${verbs})Item\\(\\s*([A-Za-z_$][\\w$]*)\\(`, 'g'))) {
       const fn = new RegExp(`function\\s+${m[1]}\\s*\\([^)]*\\)\\s*\\{\\s*return\\s+['"\`]([^'"\`]+)`).exec(src);
-      if (fn) keys.add(fn[1]);
+      if (fn) into.add(fn[1]);
     }
+  };
+  const keys = new Set();
+  const cleared = new Set();
+  for (const f of files) {
+    const src = stripJsComments(read(`frontend/${f}`));
+    harvest(src, 'get|set', keys);
+    harvest(src, 'remove', cleared);
   }
-  assert.ok(keys.size >= 5, `only ${keys.size} storage keys resolved; the check would be vacuous`);
+  assert.ok(keys.size >= 4, `only ${keys.size} storage keys resolved; the check would be vacuous`);
+
+  // The ParaSend pin. Send in the signed-in navigation used to die on a key the
+  // sender had typed by hand, because localStorage was a second source of truth
+  // next to the session. There is one source now, and it is not this store.
+  assert.ok(!keys.has('paramant_api_key'),
+    'a frontend file reads or writes paramant_api_key again. ParaSend takes the account key from GET /api/user/account/key on every load and keeps it in memory; /privacy no longer lists this key, so putting it back in localStorage makes that page untrue.');
 
   const priv = visible(page('privacy'));
   const list = priv.slice(priv.indexOf('<h2>Local storage in your browser</h2>'), priv.indexOf('</ul>', priv.indexOf('<h2>Local storage in your browser</h2>')));
@@ -1491,6 +1516,9 @@ test('the browser storage /privacy lists is the storage the frontend writes', ()
   for (const n of named) {
     if (![...keys].some((k) => k === n || k.startsWith(n))) problems.push(`privacy: the storage list names "${n}" and no frontend file writes it`);
   }
+  for (const k of [...cleared].filter((c) => !keys.has(c)).sort()) {
+    if (named.some((n) => k === n || k.startsWith(n))) problems.push(`privacy: the storage list names "${k}" and the frontend only ever deletes it, which is not storage the browser keeps`);
+  }
   assert.deepEqual(problems, [], `\n  ${problems.join('\n  ')}\n`);
 });
 

From b99d18faf33bf63c91c60873203981ccd466edf2 Mon Sep 17 00:00:00 2001
From: T <t@t.t>
Date: Thu, 3 Sep 2026 09:51:07 +0200
Subject: [PATCH 2/4] Steps 1 and 2 of ParaSend, written for the person sending
 the file

Buyer re-review of the key work. The blockage is gone, and what is left is
that the screen still talks like the protocol it runs.

Say the live handshake before it costs anything. A sender reached step 2,
"WAITING FOR RECEIVER", before finding out that the other person has to be
at their screen right now. By then he had chosen a file and made a link.
One sentence now stands above step 1: the person you send to has to be
online while you send, and you confirm a short code together. It is pinned
in tests/ui-truthfulness.test.mjs to the flow rather than to itself: both
halves are read back out of parashare.page.js, so the sentence cannot
outlive the behaviour it describes.

Steps 1 and 2 in plain words. The heading was "Encrypted file relay" and
the lede explained the tool with keypair, fingerprint, plaintext and relay.
All four are accurate and none of them tells a small firm what the thing
does. The heading is now "Send a file that deletes itself". The jargon is
not deleted, it is moved: a "How this works" panel holds the mechanism and
keeps the real names, ML-KEM-768, ECDH, AES-256-GCM, ML-DSA-65, one click
away. The verify card is named after what it asks you to do, "Compare this
code together", and so is stage 3 of the stepper. The file label reads
"Choose a file (or several)" instead of announcing vault mode.

The key banner points at the door that opens. It offered one way out, "use
a key by hand", which on the hosted relay is no way out at all: the relay
mints the key and the sender has never seen it. Signing in again is the
primary action now, and the manual card sits beside it with "for
self-hosted relays" under it.

Step 2 failures get the same treatment as the key banner. A dropped socket
wrote the single word "Disconnected" into a status line, which answers none
of the three questions a sender has after handing over a file. It now says
what happened, that nothing was uploaded and the file is still in this
browser, and offers one button that makes a fresh session. A socket that
closes after the receiver is known is the normal end of the handshake and
raises nothing.

An empty key field is no longer called invalid. Pressing "Change" cleared
the box and then told the user its format was wrong. An empty box gets an
invitation; a typed value that cannot be a key gets an error, and looks
like one.

Four new cases in tests/parasend-session-key.test.mjs, all in function
scope against the real page script, each verified by sabotage in both
directions and listed in the file header. The "How this works" summary got
a 44px target so the coarse-pointer half of app-contrast stays green.
---
 frontend/js/parashare.page.js       |  73 ++++++++++++--
 frontend/parashare.html             | 108 +++++++++++++++------
 tests/parasend-session-key.test.mjs | 141 +++++++++++++++++++++++++++-
 tests/ui-truthfulness.test.mjs      |  53 +++++++++++
 4 files changed, 338 insertions(+), 37 deletions(-)

diff --git a/frontend/js/parashare.page.js b/frontend/js/parashare.page.js
index 27e2cbf5..9ef60679 100644
--- a/frontend/js/parashare.page.js
+++ b/frontend/js/parashare.page.js
@@ -14,6 +14,9 @@ let apiKey = '', keyValid = false, selectedFile = null, selectedFiles = [];
 // perfectly good while not one of the four sectors answers. relayReady says a
 // sector was found; relayError carries the reason it was not.
 let relayReady = false, relayError = '';
+// The receiver-pubkey poll lives next to the socket, and reopenSession has to
+// be able to stop it: a second poll on a dead token would keep asking forever.
+let pubkeyPoll = null;
 // nginx puts /api/user/ in the relay_auth zone (burst 5). One fetch for the
 // account key, and at most one retry, 2 s later, when that fetch is throttled.
 const KEY_RETRY_MS = 2000;
@@ -102,12 +105,41 @@ function applySlimApiKeyView() {
 // The banner. Shown only when the account key could not be loaded at all, and
 // it takes the slim row with it: a row that says "using your account key" while
 // there is no key would be the same lie the manual box used to tell.
+// TODO(#396): route the wording through failureText() in js/error-message.js
+// once that file is on main, so this page has one failure voice.
 function setKeyError(on) {
   var box = $('ps-key-error');
   if (box) box.classList.toggle('is-shown', !!on);
   var row = $('ps-key-slim');
   if (row && on) row.hidden = true;
 }
+
+// Step 2 used to answer a dropped socket with the bare word "Disconnected",
+// which tells the sender nothing about the file they just handed over. Same
+// treatment as the key banner: what happened, where the file is, one action.
+function setLinkError(on, msg) {
+  var box = $('ps-link-error');
+  if (!box) return;
+  if (on && msg) {
+    var t = $('ps-link-error-text');
+    if (t) t.textContent = msg;
+  }
+  box.classList.toggle('is-shown', !!on);
+}
+
+// Make a fresh session: new token, new link, new socket. The file is untouched
+// in the file input, so the sender does not pick it again.
+async function reopenSession() {
+  setLinkError(false);
+  if (pubkeyPoll) { clearInterval(pubkeyPoll); pubkeyPoll = null; }
+  if (ws) { try { ws.onclose = null; ws.close(); } catch (_) {} ws = null; }
+  receiverPubs = null;
+  var fp = $('fp-card');
+  if (fp) fp.style.display = 'none';
+  $('waiting-title').textContent = 'Waiting for receiver...';
+  $('waiting-dot').className = 'dot amber';
+  await createSession();
+}
 function setStatus(id, msg, cls) {
   const el = $(id);
   el.textContent = msg;
@@ -204,7 +236,8 @@ async function showReceiverConnected(kyberPub, ecdhPub) {
   $('fp-display').textContent = fp;
   $('waiting-title').textContent = 'Receiver connected';
   $('waiting-dot').className = 'dot';
-  setStatus('waiting-status', 'Receiver is waiting for you to verify the fingerprint');
+  setLinkError(false);
+  setStatus('waiting-status', 'Your receiver is waiting for you to compare the code');
   setStepperStage('verify');
   // TOFU: check if we've verified this fingerprint before
   if (isFingerprintKnown(fp)) {
@@ -252,8 +285,15 @@ async function discoverRelay(key) {
 async function onKeyInput() {
   apiKey = $('api-key').value.trim();
   setCreateStatus('');
+  // An empty box has nothing wrong with it yet. Calling it invalid is what the
+  // "Change" link did the moment it cleared the field: a red-flavoured verdict
+  // on a field the user had not filled in.
+  if (!apiKey) {
+    setStatus('key-status', 'Enter your API key to continue');
+    keyValid = false; relayReady = false; relayError = ''; updateBtn(); return;
+  }
   if (apiKey.length < 10 || !apiKey.startsWith('pgp_')) {
-    setStatus('key-status', 'Invalid format');
+    setStatus('key-status', 'That does not look like a key. It starts with pgp_.', 'err');
     keyValid = false; relayReady = false; relayError = ''; updateBtn(); return;
   }
   // A well-formed key that came from the session is usable now. Whether a
@@ -300,7 +340,7 @@ function onFileSelect() {
     setStatus('file-status', '✓ ' + files[0].name + ' (' + (files[0].size/1024/1024).toFixed(1) + ' MB)', 'ok');
     $('vault-list').style.display = 'none';
   } else {
-    setStatus('file-status', '✓ ' + files.length + ' files selected — vault mode', 'ok');
+    setStatus('file-status', '✓ ' + files.length + ' files, sent as a single package', 'ok');
     const vl = $('vault-list');
     vl.style.display = 'block';
     vl.innerHTML = [...files].map(f =>
@@ -338,6 +378,7 @@ async function createSession() {
   const recvUrl = `${location.origin}/ontvang?s=${encodeURIComponent(sessionToken)}&r=${activeSector}`;
   $('session-link').textContent = recvUrl;
 
+  setLinkError(false);
   showStep('step-waiting');
   connectWebSocket();
 }
@@ -356,17 +397,19 @@ async function connectWebSocket() {
   ws.onopen = () => {
     // Join the invite room
     ws.send(JSON.stringify({ type: 'join', room: sessionToken, nick: 'sender' }));
-    setStatus('waiting-status', 'Waiting for receiver to open the link...');
+    setLinkError(false);
+    setStatus('waiting-status', 'Waiting for your receiver to open the link...');
   };
 
   // Poll voor receiver pubkey via ghost pipe relay
-  let pubkeyPollInterval = setInterval(async () => {
+  if (pubkeyPoll) clearInterval(pubkeyPoll);
+  pubkeyPoll = setInterval(async () => {
     try {
       const r = await fetch(`${RELAY_API}/v2/pubkey/${encodeURIComponent(sessionToken)}`, { headers: { 'X-Api-Key': apiKey }, signal: AbortSignal.timeout(3000) });
       if (r.ok) {
         const d = await r.json();
         if (d.kyber_pub && d.ecdh_pub) {
-          clearInterval(pubkeyPollInterval);
+          clearInterval(pubkeyPoll); pubkeyPoll = null;
           await showReceiverConnected(d.kyber_pub, d.ecdh_pub);
         }
       }
@@ -383,15 +426,26 @@ async function connectWebSocket() {
       }
 
       if (msg.type === 'peer_left') {
-        setStatus('waiting-status', 'Receiver disconnected', 'err');
+        setStatus('waiting-status', 'Your receiver closed the link', 'err');
+        setLinkError(true, 'Your receiver closed the link before you compared the code. Nothing was uploaded and your file is still here in this browser.');
       }
     } catch(err) {
       setStatus('waiting-status', failureText('receiver message', err), 'err');
     }
   };
 
-  ws.onerror = () => setStatus('waiting-status', 'Connection error', 'err');
-  ws.onclose = () => { if (!receiverPubs) setStatus('waiting-status', 'Disconnected', 'err'); };
+  // Both of these used to write one word into a status line. A sender who has
+  // just handed over a file needs to know that it did not go anywhere.
+  ws.onerror = () => {
+    if (receiverPubs) return;
+    setStatus('waiting-status', 'Connection lost', 'err');
+    setLinkError(true, 'The connection to the relay failed before your receiver arrived. Nothing was uploaded and your file is still here in this browser.');
+  };
+  ws.onclose = () => {
+    if (receiverPubs) return;
+    setStatus('waiting-status', 'Connection lost', 'err');
+    setLinkError(true, 'The connection to the relay dropped before your receiver arrived. Nothing was uploaded and your file is still here in this browser.');
+  };
 }
 
 // ── Fingerprint confirmed — encrypt & send ──
@@ -946,3 +1000,4 @@ act('click','confirmFingerprint',()=>confirmFingerprint());act('click','copyLink
 act('click','createSession',()=>createSession());act('click','expandApiKeyCard',()=>expandApiKeyCard());
 act('click','rejectFingerprint',()=>rejectFingerprint());act('input','onKeyInput',()=>onKeyInput());
 act('click','reload',()=>location.reload());
+act('click','reopenSession',()=>reopenSession());
diff --git a/frontend/parashare.html b/frontend/parashare.html
index 8db66b93..3786025b 100644
--- a/frontend/parashare.html
+++ b/frontend/parashare.html
@@ -69,13 +69,41 @@
 #step-setup.manual-key .ps-key-card{display:block}
 #step-setup.manual-key .ps-key-slim{display:none}
 
-/* The one thing that must never fail silently: no key, no ParaSend. The banner
-   says what happened, what to do, and leaves a door open for a self-hoster
-   whose deployment has no /api/user/account/key at all. */
-.ps-key-error{display:none;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:16px;padding:12px 14px;border:1px solid var(--line-2);border-left:3px solid var(--sig-stop);border-radius:var(--r-1);background:var(--sig-stop-bg);font:13px/1.62 var(--sans);color:var(--ink-1)}
-.ps-key-error.is-shown{display:flex}
-.ps-key-error p{margin:0}
-.ps-key-error .ps-key-change{padding-left:0;font-family:var(--mono)}
+/* One alert style, used by both places on this page where something can fail
+   in front of the user: the account key that will not load, and the relay
+   connection that drops while step 2 is waiting. Each says what happened, what
+   the file is doing meanwhile, and offers the one action that helps. */
+.ps-alert{display:none;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:16px;padding:12px 14px;border:1px solid var(--line-2);border-left:3px solid var(--sig-stop);border-radius:var(--r-1);background:var(--sig-stop-bg);font:13px/1.62 var(--sans);color:var(--ink-1)}
+.ps-alert.is-shown{display:flex}
+.ps-alert p{margin:0}
+.ps-alert-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
+/* The primary action is the one that actually works on paramant.app: sign in
+   again. Typing a key by hand only helps a self-hosted relay, so it sits next
+   to it as a link with that said out loud. */
+.ps-alert-primary{display:inline-flex;align-items:center;min-height:var(--tap);padding:9px 16px;border:1px solid var(--accent);border-radius:var(--r-1);background:var(--accent);color:var(--accent-ink);font:600 13px/1 var(--sans);text-decoration:none}
+.ps-alert-primary:hover{background:var(--accent-hov);border-color:var(--accent-hov)}
+.ps-alert-primary:focus-visible{outline:none;box-shadow:var(--ring)}
+.ps-alert-note{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-3)}
+/* The note belongs to the secondary action and to nothing else, so it is
+   stacked under it rather than left to wrap under both buttons. */
+.ps-alert-secondary{display:inline-flex;flex-direction:column;align-items:flex-start;gap:0}
+.ps-alert .ps-key-change{padding-left:0;font-family:var(--mono)}
+
+/* Said before the sender starts, not discovered on step 2: this is a live
+   handshake and the other person has to be there for it. */
+.ps-live-note{margin:0 0 16px;padding:11px 14px;border:1px solid var(--line-2);border-left:3px solid var(--mark);border-radius:0 var(--r-1) var(--r-1) 0;background:var(--surface-sunk);font:14px/1.6 var(--sans);color:var(--ink-1)}
+
+/* The jargon lives here instead of in the flow. A sender who wants ML-KEM-768
+   can open it; a sender who wants to send a file never has to read it. */
+.ps-how{margin:0 0 18px;border:1px solid var(--line);border-radius:var(--r-1);background:var(--surface)}
+.ps-how summary{cursor:pointer;display:flex;align-items:center;min-height:var(--tap);padding:11px 14px;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);list-style:none}
+.ps-how summary::-webkit-details-marker{display:none}
+.ps-how summary::after{content:" +";color:var(--ink-3)}
+.ps-how[open] summary::after{content:" \2013";color:var(--ink-3)}
+.ps-how summary:focus-visible{outline:none;box-shadow:var(--ring)}
+.ps-how-body{padding:0 14px 14px;font:13.5px/1.62 var(--sans);color:var(--ink-2)}
+.ps-how-body p{margin:0 0 10px}
+.ps-how-body p:last-child{margin-bottom:0}
 
 /* design-system.css puts 32px of padding on every .card; here the padding
    belongs to .card-head and .card-body, so it is reset. */
@@ -378,8 +406,8 @@
 <section class="page-hero">
 <div class="page-hero-inner">
   <span class="eyebrow">PARASEND</span>
-  <h1>Encrypted file relay</h1>
-  <p class="lede">End-to-end encrypted file transfer. The receiver's browser generates a keypair — you verify the fingerprint before encrypting. The relay never sees plaintext.</p>
+  <h1>Send a file that deletes itself</h1>
+  <p class="lede">Pick a file and send a one-time link. The file is locked in your own browser before it leaves, so nobody in between can open it, and that includes us.</p>
 </div>
 </section>
 
@@ -397,7 +425,7 @@ <h1>Encrypted file relay</h1>
   </li>
   <li class="ps-step" data-step-key="verify">
     <span class="ps-step-dot" aria-hidden="true"></span>
-    <span class="ps-step-label">3 &middot; Verify</span>
+    <span class="ps-step-label">3 &middot; Compare</span>
   </li>
   <li class="ps-step" data-step-key="encrypt">
     <span class="ps-step-dot" aria-hidden="true"></span>
@@ -411,9 +439,20 @@ <h1>Encrypted file relay</h1>
 
 <!-- STEP 1: Setup -->
 <div class="step active" id="step-setup">
+  <p class="ps-live-note" id="ps-live-note">The person you send to has to be online while you send; you confirm a short code together.</p>
+
+  <details class="ps-how">
+    <summary>How this works</summary>
+    <div class="ps-how-body">
+      <p>Your receiver's browser makes a fresh pair of keys and sends us only the public half. Your browser locks the file for that public half and uploads the locked version. We hold no key, so what sits on our relay cannot be opened by us or by anyone who takes it from us.</p>
+      <p>The short code you compare is built from the receiver's public keys, and both browsers work it out on their own. If anything had swapped those keys along the way, the two codes would not match. That is why you read the code to each other on a channel we do not run, such as a phone call.</p>
+      <p>For the reader who wants the names: ML-KEM-768 and ECDH for the key exchange, AES-256-GCM for the file, ML-DSA-65 signatures per chunk. The locked file is stored with an expiry and is destroyed when the link runs out or once the download link has been spent.</p>
+    </div>
+  </details>
+
   <div class="ps-guide">
     <span class="ps-guide-kicker">Step 1 of 5 &middot; Setup</span>
-    <strong>Pick a file, set how long the link lives.</strong> Your file stays in your browser until step 4. The relay never sees plaintext.
+    <strong>Choose a file and say how long the link should live.</strong> The file stays on your own computer until step 4. We never hold it in a form we could open.
   </div>
 
   <div class="ps-key-slim is-loading" id="ps-key-slim" aria-label="Account key">
@@ -421,9 +460,15 @@ <h1>Encrypted file relay</h1>
     <button type="button" class="ps-key-change" data-click="expandApiKeyCard">Change</button>
   </div>
 
-  <div class="ps-key-error" id="ps-key-error" role="alert">
+  <div class="ps-alert" id="ps-key-error" role="alert">
     <p>Your account key could not be loaded. Sign in again; if it keeps happening, mail <a href="mailto:privacy@paramant.app">privacy@paramant.app</a>.</p>
-    <button type="button" class="ps-key-change" data-click="expandApiKeyCard">Use a key by hand</button>
+    <div class="ps-alert-actions">
+      <a class="ps-alert-primary" href="/auth/login">Sign in again</a>
+      <span class="ps-alert-secondary">
+        <button type="button" class="ps-key-change" data-click="expandApiKeyCard">Use a key by hand</button>
+        <span class="ps-alert-note">for self-hosted relays</span>
+      </span>
+    </div>
   </div>
 
   <div class="card ps-key-card">
@@ -438,8 +483,9 @@ <h1>Encrypted file relay</h1>
   <div class="card">
     <div class="card-head"><div class="dot amber"></div><div class="card-head-title">File</div></div>
     <div class="card-body">
-      <label class="label" for="file-input">Select file(s) &mdash; select multiple for vault mode</label>
+      <label class="label" for="file-input">Choose a file (or several)</label>
       <input type="file" id="file-input" multiple data-change="onFileSelect">
+      <p class="ps-meta">Pick more than one and they travel as a single package.</p>
       <div class="status-line" id="file-status">No file selected</div>
       <div id="vault-list" style="margin-top:8px;display:none"></div>
     </div>
@@ -455,7 +501,7 @@ <h1>Encrypted file relay</h1>
         <option value="3600000" selected>1 hour</option>
         <option value="86400000">24 hours</option>
       </select>
-      <p class="ps-meta" id="ttl-status">Relay permanently deletes blobs after expiry</p>
+      <p class="ps-meta" id="ttl-status">When the link runs out we destroy the file, picked up or not.</p>
     </div>
   </div>
 
@@ -469,10 +515,18 @@ <h1>Encrypted file relay</h1>
 <!-- STEP 2: Waiting for receiver -->
 <div class="step" id="step-waiting">
   <h2 class="paramant-h1">Share this link</h2>
-  <p class="sub">Send this link to the receiver. Their browser will generate a keypair. You'll see their fingerprint appear below &mdash; verify it with them before sending.</p>
+  <p class="sub">Send the link to your receiver any way you like. Keep this page open: the moment they open it, a short code appears here and the two of you compare it.</p>
   <div class="ps-guide">
     <span class="ps-guide-kicker">Step 2 of 5 &middot; Share</span>
-    <strong>Send the one-time link via any channel.</strong> The link only tells the receiver where to connect; no key, no file, no metadata. When they open it, their browser generates an ML-KEM-768 keypair and we move to verify.
+    <strong>The link says where to connect, and nothing else.</strong> No key, no file, no file name. Your receiver has to open it while you are still on this page.
+  </div>
+
+  <div class="ps-alert" id="ps-link-error" role="alert">
+    <p id="ps-link-error-text">The connection to the relay dropped before your receiver arrived. Nothing was uploaded and your file is still here in this browser.</p>
+    <div class="ps-alert-actions">
+      <button type="button" class="ps-alert-primary" data-click="reopenSession">Open the session again</button>
+      <span class="ps-alert-note">this makes a fresh link</span>
+    </div>
   </div>
 
   <div class="card">
@@ -484,29 +538,29 @@ <h2 class="paramant-h1">Share this link</h2>
       <button type="button" class="ps-copy" id="ps-copy-btn" data-click="copyLink">Copy link</button>
       </div>
       <p class="ps-meta" id="ps-link-meta">The link carries no key and no file name. It only says where to connect.</p>
-      <div class="status-line" id="waiting-status">Share this link with the receiver</div>
+      <div class="status-line" id="waiting-status">Send this link, and wait here for your receiver to open it</div>
     </div>
   </div>
 
   <div class="card" id="fp-card" style="display:none">
-    <div class="card-head"><div class="dot" id="fp-dot"></div><div class="card-head-title">Receiver connected — verify fingerprint</div></div>
+    <div class="card-head"><div class="dot" id="fp-dot"></div><div class="card-head-title">Compare this code together</div></div>
     <div class="card-body">
-      <p class="status-line" style="margin-bottom:6px">Call or message the receiver via a <strong>separate channel</strong> (phone, Signal, etc.) and ask: <em>"What is your fingerprint?"</em></p>
-      <p class="ps-caution">A compromised relay can return a fake key. Only fingerprint verification via a separate channel proves you are encrypting to the right person.</p>
+      <p class="status-line" style="margin-bottom:6px">Call or message your receiver on a <strong>different channel</strong> (phone, Signal) and read the code below to each other. Both screens have to show the same one.</p>
+      <p class="ps-caution">If the codes differ, stop here. A tampered relay can hand you the wrong key, and comparing the code on a channel we do not run is what catches it.</p>
       <div class="fingerprint" id="fp-display">—</div>
-      <div id="fp-seen-before" style="display:none;font-size:10px;color:var(--cobalt);margin:-4px 0 10px;text-align:center;font-family:var(--mono)">✓ Matches stored fingerprint from a previous session</div>
-      <div id="fp-new-device" style="display:none;font-size:10px;color:var(--cobalt);margin:-4px 0 10px;text-align:center">◈ First contact with this receiver — verify carefully</div>
+      <div id="fp-seen-before" style="display:none;font-size:10px;color:var(--cobalt);margin:-4px 0 10px;text-align:center;font-family:var(--mono)">✓ Same code as the last time you sent to this person</div>
+      <div id="fp-new-device" style="display:none;font-size:10px;color:var(--cobalt);margin:-4px 0 10px;text-align:center">◈ First time with this receiver. Compare with extra care.</div>
       <div style="display:flex;justify-content:center;margin:12px 0 4px">
         <canvas id="fp-qr" style="display:none;border:4px solid #fff"></canvas>
       </div>
-      <p style="font-size:10px;color:var(--ink-dim);text-align:center;margin-bottom:10px" id="fp-qr-label">QR — receiver can scan to compare</p>
+      <p style="font-size:10px;color:var(--ink-dim);text-align:center;margin-bottom:10px" id="fp-qr-label">Your receiver can scan this instead of reading it out</p>
       <label style="display:flex;align-items:center;gap:8px;margin:12px 0 4px;font-size:11px;cursor:pointer;user-select:none">
         <input type="checkbox" id="fp-confirm-check" data-change="fpConfirmToggle" style="width:14px;height:14px;accent-color:var(--cobalt)">
-        I have verified this fingerprint with the receiver via a separate channel
+        We compared the code on a different channel and it matched
       </label>
       <div style="display:flex;gap:8px;margin-top:4px">
-        <button class="btn btn-green" id="fp-confirm-btn" data-click="confirmFingerprint" disabled>✓ Verified — encrypt &amp; send</button>
-        <button class="btn btn-red btn-outline" data-click="rejectFingerprint">✗ Mismatch — abort</button>
+        <button class="btn btn-green" id="fp-confirm-btn" data-click="confirmFingerprint" disabled>✓ Codes match, send the file</button>
+        <button class="btn btn-red btn-outline" data-click="rejectFingerprint">✗ Codes differ, stop</button>
       </div>
     </div>
   </div>
diff --git a/tests/parasend-session-key.test.mjs b/tests/parasend-session-key.test.mjs
index ebf438ec..2eab0140 100644
--- a/tests/parasend-session-key.test.mjs
+++ b/tests/parasend-session-key.test.mjs
@@ -65,6 +65,7 @@ function runPage({ keyResponses, sectorOk = true }) {
     return elements.get(id);
   };
   const listeners = new Map();
+  const sockets = [];
   const calls = { key: 0, sector: 0, urls: [], timeouts: [], storage: [] };
   let keyTurn = 0;
 
@@ -101,6 +102,13 @@ function runPage({ keyResponses, sectorOk = true }) {
     clearTimeout: () => {}, setInterval: () => 0, clearInterval: () => {},
     queueMicrotask,
     act: () => {},
+    // A socket the test can drive: step 2 has to be measurable when the relay
+    // connection dies, which is the case that used to print "Disconnected".
+    WebSocket: class {
+      constructor(url) { this.url = url; sockets.push(this); }
+      send() {}
+      close() { this.closed = true; }
+    },
     fetch: async (url) => {
       calls.urls.push(url);
       if (String(url).endsWith(KEY_URL)) {
@@ -117,7 +125,7 @@ function runPage({ keyResponses, sectorOk = true }) {
   context.globalThis = context;
   vm.createContext(context);
   vm.runInContext(PS_JS, context, { filename: 'parashare.page.js' });
-  return { context, elements, calls, listeners, getElementById };
+  return { context, elements, calls, listeners, getElementById, sockets };
 }
 
 // Fire DOMContentLoaded and let every pending microtask drain.
@@ -251,3 +259,134 @@ test('signing out removes a paramant_api_key left behind by an earlier build', (
   assert.match(signout.slice(0, 700), /localStorage\.removeItem\('paramant_api_key'\)/,
     '/privacy said this key was "removed when you sign out" and nothing removed it. The page no longer writes it, and sign-out now clears an old one.');
 });
+
+// ── 7. The banner points at the door that actually opens ────────────────────
+// The first version of this banner offered one way out, "use a key by hand",
+// and on paramant.app that is not a way out at all: the hosted relay mints the
+// key, the sender has never seen it, and typing one is only meaningful on a
+// self-hosted deployment. The action that helps a hosted customer is signing in
+// again, so that is the button, and the other one says who it is for.
+// Verified by sabotage: swap the two, or drop the self-host note, and this
+// fails by name.
+test('the key banner leads with signing in again, and says who the manual key is for', () => {
+  const bannerAt = PS_HTML.indexOf('id="ps-key-error"');
+  assert.ok(bannerAt > 0, 'the banner markup must still be findable by its id');
+  const banner = PS_HTML.slice(bannerAt, bannerAt + 900);
+  assert.match(banner, /class="ps-alert-primary" href="\/auth\/login">Sign in again</,
+    'signing in again is the action that works on the hosted relay, so it is the primary');
+  assert.match(banner, /data-click="expandApiKeyCard">Use a key by hand</,
+    'the manual card must stay reachable for a self-host with no /api/user/account/key');
+  assert.match(banner, /for self-hosted relays/,
+    'a hosted customer must be told the manual key is not meant for them');
+  // Compared inside the action row, not the whole banner: the sentence above it
+  // also says "Sign in again", and matching that would pass whatever the buttons
+  // do.
+  const actionsAt = banner.indexOf('class="ps-alert-actions"');
+  assert.ok(actionsAt > 0, 'the banner must group its actions, so their order is a fact and not an accident of wrapping');
+  const actions = banner.slice(actionsAt);
+  assert.ok(actions.indexOf('href="/auth/login"') < actions.indexOf('data-click="expandApiKeyCard"'),
+    'the primary action must come first in the markup, which is the order a screen reader and a phone both follow');
+});
+
+// ── 8. An empty box is not a mistake ────────────────────────────────────────
+// "Change" clears the field and calls onKeyInput, and the field it just emptied
+// was told its format was invalid. A verdict on a field the user has not filled
+// in yet. Verified by sabotage: make the empty case take the malformed branch
+// and this goes red on both the wording and the error class.
+test('an empty manual key field is asked to be filled in, not called invalid', async () => {
+  const run = await loadPage({ keyResponses: [{ status: 500, body: {} }] });
+  evalIn(run, 'expandApiKeyCard()');
+  const status = run.getElementById('key-status');
+  assert.equal(status.textContent, 'Enter your API key to continue',
+    'an empty field gets an invitation, not a verdict');
+  assert.equal(status.className, 'status-line',
+    'and no error styling: nothing has gone wrong yet');
+
+  // A key that really is malformed still says so, otherwise the case above is
+  // just silence.
+  run.getElementById('api-key').value = 'not-a-key';
+  await evalIn(run, 'onKeyInput()');
+  assert.match(run.getElementById('key-status').textContent, /starts with pgp_/,
+    'a typed value that cannot be a key must say what a key looks like');
+  assert.equal(run.getElementById('key-status').className, 'status-line err',
+    'that one is an error and is allowed to look like one');
+});
+
+// ── 9. A dropped relay connection on step 2 ─────────────────────────────────
+// The sender has just handed over a file and made a link. When the socket died
+// the page wrote the single word "Disconnected" into a status line, which
+// answers none of the three questions a sender has: what happened, where is my
+// file, and what do I do now. Same treatment as the key banner.
+// Verified by sabotage: put the bare setStatus back, or drop the reopen action,
+// and this goes red.
+test('a relay connection that drops before the receiver arrives says so, and offers a way back', async () => {
+  const run = await loadPage({ keyResponses: [{ status: 200, body: { api_key: FAKE_KEY, revealable: true } }] });
+  pickAFile(run);
+  await evalIn(run, 'createSession()');
+  for (let i = 0; i < 10; i += 1) await new Promise((r) => setImmediate(r));
+
+  assert.equal(run.sockets.length, 1, 'creating a session opens exactly one relay socket');
+  const firstLink = run.getElementById('session-link').textContent;
+  assert.match(firstLink, /\/ontvang\?s=inv_/, 'the sender gets a one-time receiver link');
+  assert.equal(run.getElementById('ps-link-error').classList.contains('is-shown'), false,
+    'no alarm while the socket is healthy');
+
+  run.sockets[0].onclose();
+  const box = run.getElementById('ps-link-error');
+  assert.equal(box.classList.contains('is-shown'), true, 'a dropped socket is stated, not whispered into a status line');
+  const said = run.getElementById('ps-link-error-text').textContent;
+  assert.match(said, /dropped before your receiver arrived/, 'it says what happened');
+  assert.match(said, /Nothing was uploaded/, 'it says the file did not go anywhere');
+  assert.match(said, /still here in this browser/, 'it says where the file is');
+
+  // The way back: a fresh session, a new link, and the alarm cleared.
+  await evalIn(run, 'reopenSession()');
+  for (let i = 0; i < 10; i += 1) await new Promise((r) => setImmediate(r));
+  assert.equal(run.sockets.length, 2, 'reopening makes a new relay connection');
+  assert.notEqual(run.getElementById('session-link').textContent, firstLink,
+    'and a new one-time link: the old token died with the old socket');
+  assert.equal(box.classList.contains('is-shown'), false, 'the alarm clears once the session is back');
+
+  // A socket that closes after the receiver is already known is the normal end
+  // of the handshake, not a failure.
+  run.sockets[1].onopen();
+  await evalIn(run, "showReceiverConnected('aa'.repeat(16), 'bb'.repeat(16))");
+  run.sockets[1].onclose();
+  assert.equal(box.classList.contains('is-shown'), false,
+    'closing after the receiver has been seen is not an error and must not raise the banner');
+});
+
+// ── 10. The words a buyer reads on steps 1 and 2 ────────────────────────────
+// The page opened on "Encrypted file relay" and explained itself with keypair,
+// fingerprint, plaintext and relay. Every one of those is accurate and none of
+// them tells a small firm what the tool does. The jargon is not deleted, it is
+// moved: a "How this works" panel holds it, and the flow above it is written
+// for someone who wants to send a file. Verified by sabotage: put any of the
+// four words back into the flow, or drop the panel, and this fails by word.
+test('steps 1 and 2 are written for the sender, with the jargon moved into "How this works"', () => {
+  assert.match(PS_HTML, /<h1>Send a file that deletes itself<\/h1>/,
+    'the heading says what the tool does for the reader, not what it is made of');
+  assert.match(PS_HTML, /<details class="ps-how">[\s\S]*?<summary>How this works<\/summary>/,
+    'the technical account must still be on the page, one click away');
+  assert.match(PS_HTML, /ML-KEM-768[\s\S]{0,400}ML-DSA-65/,
+    'the panel must keep the real names: moving the jargon may not mean losing it');
+  assert.match(PS_HTML, /Choose a file \(or several\)/,
+    'the file label must ask for a file, not announce vault mode');
+
+  // The flow itself, steps 1 and 2 only, with the panel cut out.
+  // Visible words only: the ids and handler names below (fp-display,
+  // confirmFingerprint) are code, and renaming those buys the reader nothing.
+  const flowText = PS_HTML
+    .slice(PS_HTML.indexOf('id="step-setup"'), PS_HTML.indexOf('id="step-encrypting"'))
+    .replace(/<details class="ps-how">[\s\S]*?<\/details>/, ' ')
+    .replace(/<[^>]+>/g, ' ');
+  for (const word of ['keypair', 'key pair', 'plaintext', 'ML-KEM', 'ML-DSA', 'AES-256', 'fingerprint', 'vault mode', 'blob']) {
+    assert.ok(!new RegExp(word, 'i').test(flowText),
+      `steps 1 and 2 still say "${word}" to the reader; that belongs in the How this works panel, not in the path a sender walks`);
+  }
+  // And the fingerprint step is named after the thing the sender does.
+  assert.match(PS_HTML, /<div class="card-head-title">Compare this code together<\/div>/,
+    'the verify card must be named for the action, not for the data structure');
+  assert.match(PS_HTML, /<span class="ps-step-label">3 &middot; Compare<\/span>/,
+    'the stepper must name the same step the same way');
+});
diff --git a/tests/ui-truthfulness.test.mjs b/tests/ui-truthfulness.test.mjs
index f66422d3..1d3fa9bf 100644
--- a/tests/ui-truthfulness.test.mjs
+++ b/tests/ui-truthfulness.test.mjs
@@ -1848,3 +1848,56 @@ console.log('ui-truthfulness: the rules page is Our rules on /rules, with /parar
 })();
 
 console.log('ui-truthfulness: the appearance switch says only what theme.js and app-2026.css do');
+
+// ── /parashare says up front that this is a live handshake ──────────────────
+// A buyer reached step 2 before finding out that the other person has to be at
+// their screen right now. The stepper said "2 . Share", the card said "Waiting
+// for receiver", and by then he had already picked a file and made a link. That
+// is not a copy problem on step 2; it is a fact about the product that belongs
+// above step 1, in the words someone would use out loud.
+//
+// The sentence is pinned to the flow rather than to itself. It claims two
+// things: that the receiver has to be online while you send, and that the two
+// of you confirm a short code together. Both are properties of
+// parashare.page.js, so both are read back from it here. Verified by sabotage:
+// drop the sentence, or let confirmFingerprint run without receiverPubs, or
+// let createSession reach step-encrypting without going through the waiting
+// step, and this block goes red.
+(() => {
+  const parashare = read('frontend/parashare.html');
+  const psJs = read('frontend/js/parashare.page.js');
+
+  assert.match(parashare, /The person you send to has to be online while you send; you confirm a short code together\./,
+    '/parashare must say above step 1 that the receiver has to be there; a sender should not discover a live handshake on step 2');
+  // Above step 1 means above it, not somewhere on the page: the sentence has to
+  // sit before the step-1 guide inside #step-setup.
+  const setupAt = parashare.indexOf('id="step-setup"');
+  const noteAt = parashare.indexOf('The person you send to has to be online');
+  const guideAt = parashare.indexOf('Step 1 of 5');
+  assert.ok(setupAt > 0 && noteAt > setupAt && noteAt < guideAt,
+    'the sentence must stand inside #step-setup and above the step-1 guide, which is where a sender reads before choosing a file');
+
+  // Claim 1: sending really does wait for the other person. createSession goes
+  // to the waiting step and opens the socket, and nothing else advances.
+  assert.match(psJs, /showStep\('step-waiting'\);\s*\n\s*connectWebSocket\(\);/,
+    'createSession must hand over to the waiting step: that wait is what the sentence promises');
+  assert.equal((psJs.match(/showStep\('step-encrypting'\)/g) || []).length, 1,
+    'more than one path now reaches the encrypt step; the promise that the receiver has to be online is only true while confirmFingerprint is the single door');
+  const confirm = psJs.slice(psJs.indexOf('async function confirmFingerprint()'));
+  const guardAt = confirm.indexOf('if (!receiverPubs) return;');
+  const encryptAt = confirm.indexOf('showStep(\'step-encrypting\')');
+  assert.ok(guardAt >= 0,
+    'confirmFingerprint no longer refuses to run without a receiver; the sentence above step 1 promises the receiver has to be there');
+  assert.ok(encryptAt > guardAt,
+    'the encrypt step must sit behind the receiverPubs guard, so a sender cannot send to nobody');
+
+  // Claim 2: there really is a short code, and both sides work it out.
+  assert.match(psJs, /async function genFingerprint\(/,
+    'the short code the sentence promises is genFingerprint; without it the sentence describes nothing');
+  assert.match(parashare, /Compare this code together/,
+    'the card where the two of you compare must be named after what it asks you to do');
+  assert.match(read('frontend/js/ontvang.page.js'), /genFingerprint|fp-display/,
+    'the receiver side must compute a code too, otherwise "together" is one-sided');
+})();
+
+console.log('ui-truthfulness: /parashare says the receiver has to be online, and the flow really waits for them');

From 5edd5b71fe5b8f708fd1dde928be198e0e9145fb Mon Sep 17 00:00:00 2001
From: T <t@t.t>
Date: Thu, 3 Sep 2026 10:06:25 +0200
Subject: [PATCH 3/4] One failure voice on /parashare, and a cache-bust that
 tells the truth

Follow-up to the security review, on top of #396.

The failure sites this branch added now go through failureText(), the
helper #396 put at the top of this file, so /parashare has one voice for
what we did not plan for instead of three. The account-key failure reports
through it and keeps its own banner sentence, because a key that will not
load is a case we DID plan for and "sign in again" is a better next step
than "try again in a minute". Same for the relay-sector sentence; what used
to be a second wording invented at the call site is now the shared one.

parashare.page.js goes to ?v=5. #396 shipped a v4 of that file and the
commit below this one shipped a different v4. Both sides agree on the
number, so check-cache-bust cannot see it: one immutable url, two contents,
and whichever a browser cached first is the one it keeps. The order of the
two script tags is pinned in the suite as well, because error-message.js is
a plain script and failureText reads window.paramantErrors at call time: put
parashare.page.js first and the page quietly falls back to its own copy of
the sentence. Verified by sabotage.

The vm suite now loads the real frontend/js/error-message.js into the
context, so what it measures is the shipped sentence and not the fallback.
---
 frontend/js/parashare.page.js       | 13 ++++++++++---
 tests/parasend-session-key.test.mjs | 11 +++++++++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/frontend/js/parashare.page.js b/frontend/js/parashare.page.js
index 9ef60679..9d2f84a2 100644
--- a/frontend/js/parashare.page.js
+++ b/frontend/js/parashare.page.js
@@ -105,8 +105,10 @@ function applySlimApiKeyView() {
 // The banner. Shown only when the account key could not be loaded at all, and
 // it takes the slim row with it: a row that says "using your account key" while
 // there is no key would be the same lie the manual box used to tell.
-// TODO(#396): route the wording through failureText() in js/error-message.js
-// once that file is on main, so this page has one failure voice.
+// The banner keeps its own words on purpose: failureText is the sentence for
+// what we did not plan for, and a key that will not load is planned, with a
+// better next step than "try again in a minute". Its unplanned tail goes
+// through failureText like everything else on this page.
 function setKeyError(on) {
   var box = $('ps-key-error');
   if (box) box.classList.toggle('is-shown', !!on);
@@ -364,7 +366,9 @@ async function createSession() {
     setCreateStatus('Looking for a relay sector...');
     await onKeyInput();
     if (!relayReady) {
-      setCreateStatus(relayError || 'No relay sector answered. Try again in a moment.', 'err');
+      // relayError is the planned sentence. Reaching here without one is a state
+      // we did not plan for, so it gets the page's one sentence for that.
+      setCreateStatus(relayError || failureText('relay sector discovery', new Error('no sector answered')), 'err');
       return;
     }
   }
@@ -712,6 +716,9 @@ async function loadAccountKey() {
     await onKeyInput();
   } catch (e) {
     setKeyError(true);
+    // The banner carries the sentence; failureText logs the detail through the
+    // one reporter and keeps the console readable when three things fail at once.
+    failureText('account key', e);
     setStatus('key-status', 'Account key could not be loaded', 'err');
     keyValid = false;
     updateBtn();
diff --git a/tests/parasend-session-key.test.mjs b/tests/parasend-session-key.test.mjs
index 2eab0140..29d24eea 100644
--- a/tests/parasend-session-key.test.mjs
+++ b/tests/parasend-session-key.test.mjs
@@ -31,11 +31,15 @@ import assert from 'node:assert/strict';
 import fs from 'node:fs';
 import path from 'node:path';
 import vm from 'node:vm';
+import { createRequire } from 'node:module';
 import { fileURLToPath } from 'node:url';
 
 const PS_ROOT = path.join(path.dirname(fileURLToPath(import.meta.url)), '..');
 const PS_JS = fs.readFileSync(path.join(PS_ROOT, 'frontend/js/parashare.page.js'), 'utf8');
 const PS_HTML = fs.readFileSync(path.join(PS_ROOT, 'frontend/parashare.html'), 'utf8');
+// The real error module, in the context, so the page's one failure sentence is
+// the one this suite measures rather than the fallback copy inside failureText.
+const PS_ERRORS = createRequire(import.meta.url)('../frontend/js/error-message.js');
 const KEY_URL = '/api/user/account/key';
 const FAKE_KEY = 'pgp_livetestkey0000000000abcd';
 
@@ -102,6 +106,7 @@ function runPage({ keyResponses, sectorOk = true }) {
     clearTimeout: () => {}, setInterval: () => 0, clearInterval: () => {},
     queueMicrotask,
     act: () => {},
+    paramantErrors: PS_ERRORS,
     // A socket the test can drive: step 2 has to be measurable when the relay
     // connection dies, which is the case that used to print "Disconnected".
     WebSocket: class {
@@ -217,6 +222,12 @@ test('/parashare ships the banner copy and opens on the slim row, not the manual
   assert.ok(PS_HTML.includes('Your account key could not be loaded. Sign in again; if it keeps happening, mail <a href="mailto:privacy@paramant.app">privacy@paramant.app</a>.'),
     'the banner must name the one thing to do and the one address to write to');
   assert.match(PS_HTML, /data-click="expandApiKeyCard">Use a key by hand</, 'the banner must carry the manual way out');
+  // error-message.js is a plain script and parashare.page.js reads
+  // window.paramantErrors at call time, so the order of these two tags is what
+  // decides whether this page speaks the shared failure sentence or its own
+  // fallback copy of it.
+  assert.ok(PS_HTML.indexOf('/js/error-message.js') < PS_HTML.indexOf('/js/parashare.page.js'),
+    'error-message.js must load before parashare.page.js, or the page falls back to its own copy of the sentence');
 
   // The class logic, the other way round from what shipped: the slim row is the
   // default and the card is the exception.

From 5ca4ef8fce61235fbf51c2596b5332ee70c9b9dd Mon Sep 17 00:00:00 2001
From: T <t@t.t>
Date: Thu, 3 Sep 2026 10:11:25 +0200
Subject: [PATCH 4/4] Only the unplanned half of a missing account key is worth
 reporting

The heartbeat gate caught this within a minute of the last commit, and it
was right. tests/product-heartbeat.test.mjs loads /parashare from a static
checkout with no admin server behind it, so GET /api/user/account/key
answers 404, and routing that through failureText put

  [paramant] account key Error: account key: HTTP 404

into the console of a page that was behaving correctly. The gate reads that
console and went red.

A 401 or 403 is a browser with no session. A 404 is a self-host that never
built the endpoint. A 200 with no api_key is an account whose key is not
revealable, which the reveal route documents in as many words. All three
are answers, not faults: the banner is the whole response to them, and a
console error on every signed-out page load is noise that also cries wolf
at the one gate watching for real ones. They are marked expected where they
are thrown, and only what is left, a 5xx or a fetch that never arrived,
goes to the reporter.

Case 11 of the suite measures both halves, and the harness now runs
frontend/js/error-message.js inside the vm context the way the page loads
it, as a plain script assigning self.paramantErrors. Requiring it from the
test process closed it over the wrong console and the 500 case could not
see its own log. Three sabotages, each red on the half it targets.
---
 frontend/js/parashare.page.js       | 24 ++++++++++---
 tests/parasend-session-key.test.mjs | 53 +++++++++++++++++++++++++----
 2 files changed, 65 insertions(+), 12 deletions(-)

diff --git a/frontend/js/parashare.page.js b/frontend/js/parashare.page.js
index 9d2f84a2..6e41f837 100644
--- a/frontend/js/parashare.page.js
+++ b/frontend/js/parashare.page.js
@@ -702,9 +702,21 @@ async function fetchAccountKey() {
     await new Promise(res => setTimeout(res, KEY_RETRY_MS));
     r = await fetch('/api/user/account/key', { credentials: 'include' });
   }
-  if (!r.ok) throw new Error('account key: HTTP ' + r.status);
+  // Expected, and marked so: a browser with no session gets 401/403, and a
+  // self-host that never built this endpoint answers 404. Both mean "no key
+  // here", the banner is the whole answer, and neither is worth a line in the
+  // console of every signed-out visitor.
+  if (!r.ok) {
+    const noSession = new Error('account key: HTTP ' + r.status);
+    noSession.expected = r.status === 401 || r.status === 403 || r.status === 404;
+    throw noSession;
+  }
   const d = await r.json();
-  if (!d || !d.api_key) throw new Error('account key: none on this session');
+  if (!d || !d.api_key) {
+    const noKey = new Error('account key: none on this session');
+    noKey.expected = true;
+    throw noKey;
+  }
   return d.api_key;
 }
 
@@ -716,9 +728,11 @@ async function loadAccountKey() {
     await onKeyInput();
   } catch (e) {
     setKeyError(true);
-    // The banner carries the sentence; failureText logs the detail through the
-    // one reporter and keeps the console readable when three things fail at once.
-    failureText('account key', e);
+    // The banner carries the sentence either way. Only the unplanned half gets
+    // reported: a 500, or a fetch that never arrived. Reporting the planned half
+    // would put a console error on every signed-out page load, which is both
+    // noise and a false alarm for the heartbeat that reads that console.
+    if (!e || !e.expected) failureText('account key', e);
     setStatus('key-status', 'Account key could not be loaded', 'err');
     keyValid = false;
     updateBtn();
diff --git a/tests/parasend-session-key.test.mjs b/tests/parasend-session-key.test.mjs
index 29d24eea..04ab4ecc 100644
--- a/tests/parasend-session-key.test.mjs
+++ b/tests/parasend-session-key.test.mjs
@@ -31,15 +31,16 @@ import assert from 'node:assert/strict';
 import fs from 'node:fs';
 import path from 'node:path';
 import vm from 'node:vm';
-import { createRequire } from 'node:module';
 import { fileURLToPath } from 'node:url';
 
 const PS_ROOT = path.join(path.dirname(fileURLToPath(import.meta.url)), '..');
 const PS_JS = fs.readFileSync(path.join(PS_ROOT, 'frontend/js/parashare.page.js'), 'utf8');
 const PS_HTML = fs.readFileSync(path.join(PS_ROOT, 'frontend/parashare.html'), 'utf8');
-// The real error module, in the context, so the page's one failure sentence is
-// the one this suite measures rather than the fallback copy inside failureText.
-const PS_ERRORS = createRequire(import.meta.url)('../frontend/js/error-message.js');
+// The real error module, run INSIDE the context the way the page loads it: as a
+// plain script that assigns self.paramantErrors. Requiring it here instead would
+// close it over this process's console, and half of what this suite measures is
+// what the page does or does not write to the browser's.
+const PS_ERRORS_JS = fs.readFileSync(path.join(PS_ROOT, 'frontend/js/error-message.js'), 'utf8');
 const KEY_URL = '/api/user/account/key';
 const FAKE_KEY = 'pgp_livetestkey0000000000abcd';
 
@@ -79,8 +80,11 @@ function runPage({ keyResponses, sectorOk = true }) {
     json: async () => spec.body,
   });
 
+  const consoleErrors = [];
   const context = {
-    console,
+    console: Object.assign(Object.create(console), {
+      error: (...args) => { consoleErrors.push(args.map(String).join(' ')); },
+    }),
     URLSearchParams,
     AbortSignal: { timeout: () => null },
     crypto: globalThis.crypto,
@@ -106,7 +110,6 @@ function runPage({ keyResponses, sectorOk = true }) {
     clearTimeout: () => {}, setInterval: () => 0, clearInterval: () => {},
     queueMicrotask,
     act: () => {},
-    paramantErrors: PS_ERRORS,
     // A socket the test can drive: step 2 has to be measurable when the relay
     // connection dies, which is the case that used to print "Disconnected".
     WebSocket: class {
@@ -128,9 +131,13 @@ function runPage({ keyResponses, sectorOk = true }) {
   };
   context.window = context;
   context.globalThis = context;
+  context.self = context;
   vm.createContext(context);
+  // Script order matters and the page ships it that way: the reporter first,
+  // then the page code that reads window.paramantErrors at call time.
+  vm.runInContext(PS_ERRORS_JS, context, { filename: 'error-message.js' });
   vm.runInContext(PS_JS, context, { filename: 'parashare.page.js' });
-  return { context, elements, calls, listeners, getElementById, sockets };
+  return { context, elements, calls, listeners, getElementById, sockets, consoleErrors };
 }
 
 // Fire DOMContentLoaded and let every pending microtask drain.
@@ -401,3 +408,35 @@ test('steps 1 and 2 are written for the sender, with the jargon moved into "How
   assert.match(PS_HTML, /<span class="ps-step-label">3 &middot; Compare<\/span>/,
     'the stepper must name the same step the same way');
 });
+
+// ── 11. Which failures are worth a line in the console ──────────────────────
+// The page reports the unplanned case through failureText, which is the shared
+// reporter from js/error-message.js. "No key for this session" is not that
+// case: a signed-out browser gets 401 or 403 and a self-host that never built
+// the endpoint gets 404, and the banner is the whole answer to both. Reporting
+// them would put a console error on every signed-out visit, and
+// tests/product-heartbeat.test.mjs reads that console: it caught exactly this
+// and went red on "account key: HTTP 404". A 500 is a different thing and does
+// get reported. Verified by sabotage in both directions: report the expected
+// half and the 404 case goes red; stop reporting the 500 and the 500 case does.
+test('a missing session key is not a console error, and a broken endpoint is', async () => {
+  for (const status of [401, 403, 404]) {
+    const quiet = await loadPage({ keyResponses: [{ status, body: {} }] });
+    assert.equal(quiet.getElementById('ps-key-error').classList.contains('is-shown'), true,
+      `a ${status} must still raise the banner: the sender has to know why there is no key`);
+    assert.deepEqual(quiet.consoleErrors, [],
+      `a ${status} is the ordinary "no key here" answer and may not write to the console of every signed-out visit`);
+  }
+
+  const broken = await loadPage({ keyResponses: [{ status: 500, body: {} }] });
+  assert.equal(broken.getElementById('ps-key-error').classList.contains('is-shown'), true);
+  assert.ok(broken.consoleErrors.some((line) => /\[paramant\] account key/.test(line)),
+    'a 500 is unplanned, and its detail belongs in the console through the one reporter');
+
+  // A 200 that carries no key is the non-revealable account, which is planned
+  // as well: the reveal route says so in as many words.
+  const noKey = await loadPage({ keyResponses: [{ status: 200, body: { api_key: null, revealable: false } }] });
+  assert.equal(noKey.getElementById('ps-key-error').classList.contains('is-shown'), true);
+  assert.deepEqual(noKey.consoleErrors, [],
+    'an account whose key is not revealable is a documented state, not a fault to report');
+});