privateboard 0.1.11 → 0.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "privateboard",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "PrivateBoard · your private board meeting, on call. Local-first, multi-agent thinking amplifier.",
   "type": "module",
   "bin": {
@@ -45,6 +45,7 @@
     "commander": "^12.1.0",
     "hono": "^4.6.14",
     "open": "^10.1.0",
+    "tiny-pinyin": "^1.3.2",
     "yaml": "^2.8.4"
   },
   "devDependencies": {

package/public/adjourn-overlay.css

@@ -29,8 +29,11 @@
 .adjourn-modal {
   position: relative;
   z-index: 1;
-  width: 100%;
-  max-width: 880px;
+  /* Width matches the convene-follow-up overlay (.supplement-modal)
+     so the room's two terminal-action overlays read as the same
+     family. Was max-width: 880px which felt oversized for a
+     short-form action confirm. */
+  width: min(560px, calc(100vw - 32px));
   max-height: calc(100vh - 48px);
   background: var(--panel);
   border: 0.5px solid var(--line-strong);
@@ -441,8 +444,9 @@
   pointer-events: none;
 }
 
-/* Narrow modal */
+/* Narrow viewport · summary rows tighten. The modal width itself
+   already collapses gracefully below ~592px via the
+   `min(560px, calc(100vw - 32px))` rule on .adjourn-modal. */
 @media (max-width: 640px) {
-  .adjourn-modal { max-width: 100%; }
   .adjourn-summary-row { grid-template-columns: 78px 1fr; gap: 10px; padding: 9px 12px; }
 }

package/public/agent-profile.css

@@ -4046,3 +4046,348 @@
 .ap-voice-advanced[open] summary::after { content: "−"; }
 .ap-voice-advanced summary:hover { color: var(--text, #eee); }
 .ap-voice-advanced summary:hover::after { color: var(--text); }
+
+/* ────────────────────────────────────────────────────────────
+   Persona dossier · Full-mode agents only
+   ────────────────────────────────────────────────────────────
+   Reads as a gamified character-sheet entry below the rules
+   section. The card is the entire button — keyboard + click
+   land on the same element. Stat values use the mono register
+   so digits hold a fixed grid; labels are upper-mono kickers
+   for the dossier flavour. */
+.ap-persona-block .ap-block-h-tag {
+  font-family: var(--mono);
+  font-size: 9px;
+  letter-spacing: 0.16em;
+  text-transform: uppercase;
+  color: var(--lime);
+  padding: 2px 8px;
+  border: 0.5px solid var(--lime-dim, var(--line));
+  border-radius: 999px;
+}
+.ap-persona-card {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+  width: 100%;
+  padding: 16px 18px 14px;
+  background: var(--panel-2);
+  border: 0.5px solid var(--line);
+  text-align: left;
+  cursor: pointer;
+  font-family: inherit;
+  color: inherit;
+  transition: border-color 0.12s, background 0.12s, transform 0.12s;
+  position: relative;
+  overflow: hidden;
+}
+.ap-persona-card::before {
+  /* Faint diagonal hatch behind the card · evokes a stamped
+     dossier surface without competing with content. Pure CSS,
+     pinned to the corner so it doesn't follow the cta. */
+  content: "";
+  position: absolute;
+  top: 0; right: 0;
+  width: 110px; height: 110px;
+  background-image: repeating-linear-gradient(
+    45deg,
+    transparent 0,
+    transparent 6px,
+    var(--line) 6px,
+    var(--line) 7px
+  );
+  opacity: 0.35;
+  pointer-events: none;
+}
+.ap-persona-card:hover {
+  border-color: var(--lime);
+  background: var(--panel-3, var(--panel-2));
+}
+.ap-persona-card:active { transform: translateY(1px); }
+.ap-persona-card:focus-visible {
+  outline: 1px solid var(--lime);
+  outline-offset: 2px;
+}
+.ap-persona-card-head {
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+  gap: 14px;
+}
+.ap-persona-card-glyph {
+  width: 44px; height: 44px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--lime);
+  border: 0.5px solid var(--lime-dim, var(--line));
+  background: var(--panel);
+}
+.ap-persona-card-id { min-width: 0; }
+.ap-persona-card-kicker {
+  font-family: var(--mono);
+  font-size: 9.5px;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--lime);
+  margin-bottom: 4px;
+}
+.ap-persona-card-title {
+  font-family: var(--font-human);
+  font-size: 17px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.01em;
+  line-height: 1.2;
+}
+.ap-persona-card-meta {
+  font-family: var(--mono);
+  font-size: 10px;
+  letter-spacing: 0.06em;
+  color: var(--text-faint);
+  margin-top: 4px;
+  text-transform: uppercase;
+}
+.ap-persona-card-score {
+  text-align: right;
+  padding-left: 12px;
+  border-left: 0.5px solid var(--line);
+}
+.ap-persona-card-score-v {
+  font-family: var(--mono);
+  font-size: 26px;
+  font-weight: 600;
+  color: var(--lime);
+  letter-spacing: 0.02em;
+  line-height: 1;
+}
+.ap-persona-card-score-l {
+  font-family: var(--mono);
+  font-size: 8.5px;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--text-faint);
+  margin-top: 5px;
+}
+.ap-persona-card-grid {
+  display: grid;
+  grid-template-columns: repeat(6, minmax(0, 1fr));
+  gap: 0;
+  border-top: 0.5px solid var(--line);
+  border-bottom: 0.5px solid var(--line);
+}
+.ap-persona-stat {
+  padding: 10px 8px;
+  text-align: center;
+  border-right: 0.5px solid var(--line);
+}
+.ap-persona-stat:last-child { border-right: none; }
+.ap-persona-stat-v {
+  font-family: var(--mono);
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text);
+  line-height: 1;
+}
+.ap-persona-stat-l {
+  font-family: var(--mono);
+  font-size: 8px;
+  letter-spacing: 0.16em;
+  text-transform: uppercase;
+  color: var(--text-faint);
+  margin-top: 5px;
+}
+.ap-persona-card-cta {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+}
+.ap-persona-card-cta-label {
+  font-family: var(--mono);
+  font-size: 11px;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--lime);
+  font-weight: 600;
+}
+.ap-persona-card-cta-hint {
+  font-family: var(--mono);
+  font-size: 9px;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: var(--text-faint);
+}
+@media (max-width: 720px) {
+  .ap-persona-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+  .ap-persona-stat:nth-child(3) { border-right: none; }
+  .ap-persona-stat:nth-child(n+4) { border-top: 0.5px solid var(--line); }
+}
+
+/* ────────────────────────────────────────────────────────────
+   Persona dossier overlay · markdown preview + download
+   ──────────────────────────────────────────────────────────── */
+.ap-persona-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 9500;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ap-persona-overlay-backdrop {
+  position: absolute;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.6);
+  backdrop-filter: blur(3px);
+  cursor: pointer;
+}
+.ap-persona-overlay-modal {
+  position: relative;
+  width: min(820px, calc(100vw - 32px));
+  max-height: calc(100vh - 48px);
+  display: flex;
+  flex-direction: column;
+  background: var(--panel);
+  border: 0.5px solid var(--line-strong, var(--line));
+  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.5);
+}
+.ap-persona-overlay-classification {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 18px;
+  background: var(--panel-2);
+  border-bottom: 0.5px solid var(--line);
+  font-family: var(--mono);
+  font-size: 9.5px;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  color: var(--text-faint);
+}
+.ap-persona-overlay-classification .dot { color: var(--lime); margin-right: 4px; }
+.ap-persona-overlay-classification .right { color: var(--text-soft); }
+.ap-persona-overlay-head {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 14px;
+  padding: 14px 22px;
+  border-bottom: 0.5px solid var(--line);
+}
+.ap-persona-overlay-title {
+  font-family: var(--font-human);
+  font-size: 16px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.005em;
+}
+.ap-persona-overlay-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.ap-persona-overlay-dl {
+  font-family: var(--mono);
+  font-size: 10px;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: var(--lime);
+  text-decoration: none;
+  padding: 6px 12px;
+  border: 0.5px solid var(--lime-dim, var(--line));
+  background: var(--panel-2);
+  transition: background 0.12s, color 0.12s;
+}
+.ap-persona-overlay-dl:hover {
+  background: var(--lime);
+  color: var(--bg, #0c0c0c);
+}
+.ap-persona-overlay-close {
+  width: 30px;
+  height: 30px;
+  background: transparent;
+  border: 0.5px solid var(--line);
+  color: var(--text-soft);
+  font-size: 14px;
+  cursor: pointer;
+  transition: color 0.12s, border-color 0.12s;
+}
+.ap-persona-overlay-close:hover { color: var(--text); border-color: var(--line-strong, var(--line)); }
+.ap-persona-overlay-body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  padding: 22px 28px 28px;
+}
+.ap-persona-overlay-loading,
+.ap-persona-overlay-error {
+  font-family: var(--mono);
+  font-size: 11px;
+  letter-spacing: 0.06em;
+  color: var(--text-faint);
+  text-align: center;
+  padding: 60px 0;
+}
+.ap-persona-overlay-error { color: var(--ink, #c97373); }
+.ap-persona-overlay-md {
+  font-family: var(--font-human);
+  font-size: 13.5px;
+  line-height: 1.65;
+  color: var(--text);
+}
+.ap-persona-overlay-md h2 {
+  font-family: var(--font-human);
+  font-size: 16px;
+  font-weight: 700;
+  color: var(--text);
+  margin: 24px 0 8px;
+  padding-bottom: 6px;
+  border-bottom: 0.5px solid var(--line);
+}
+.ap-persona-overlay-md h3 {
+  font-family: var(--font-human);
+  font-size: 13px;
+  font-weight: 700;
+  color: var(--text);
+  margin: 18px 0 6px;
+}
+.ap-persona-overlay-md h4 {
+  font-family: var(--mono);
+  font-size: 10.5px;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+  color: var(--lime);
+  margin: 14px 0 4px;
+}
+.ap-persona-overlay-md p { margin: 8px 0; }
+.ap-persona-overlay-md ul, .ap-persona-overlay-md ol {
+  margin: 8px 0 8px 22px;
+  padding: 0;
+}
+.ap-persona-overlay-md li { margin: 3px 0; }
+.ap-persona-overlay-md blockquote {
+  margin: 10px 0;
+  padding: 6px 12px;
+  border-top: 0.5px solid var(--line);
+  border-bottom: 0.5px solid var(--line);
+  font-style: italic;
+  color: var(--text-soft);
+}
+.ap-persona-overlay-md code {
+  font-family: var(--mono);
+  font-size: 12px;
+  background: var(--panel-2);
+  padding: 1px 5px;
+  color: var(--text);
+}
+.ap-persona-overlay-md pre {
+  background: var(--panel-2);
+  padding: 10px 12px;
+  overflow-x: auto;
+  margin: 10px 0;
+  border: 0.5px solid var(--line);
+}
+.ap-persona-overlay-md pre code { background: transparent; padding: 0; font-size: 11.5px; }
+.ap-persona-overlay-md strong { color: var(--text); font-weight: 700; }
+.ap-persona-overlay-md em { color: var(--lime); font-style: italic; }
+body.ap-persona-overlay-open { overflow: hidden; }

package/public/agent-profile.js

@@ -1079,6 +1079,100 @@
   function renderRulesBlock(slug) {
     return `<div class="ap-rules-block" data-ap-rules-block data-slug="${escape(slug)}">${renderRulesInner(slug)}</div>`;
   }
+
+  /** Persona dossier card · only mounted for Full-mode agents (those
+   *  with `personaSpec` populated by the deep-build pipeline). The
+   *  card reads as a gamified character-sheet · mono kicker, big
+   *  divergence stat, secondary stat grid, ▸ CTA. Clicking opens an
+   *  overlay that previews the persona.md content with a Download
+   *  affordance. Hidden entirely for Signal-mode agents and seeded
+   *  directors so the panel doesn't render an empty section.
+   *
+   *  Stats source from `live.personaSpec` (resolved from
+   *  window.app.agentsById at render time · the `p` object passed in
+   *  doesn't carry the spec, so we reach across). */
+  function renderPersonaDossierSection(slug, p) {
+    const live = window.app && window.app.agentsById ? window.app.agentsById[slug] : null;
+    const spec = live && live.personaSpec ? live.personaSpec : null;
+    if (!spec) return "";
+    // Stats. Differentiation score is the headline — null when the
+    // build skipped the eval pass (rare). The rest are counts of the
+    // structured artifacts so the user can eyeball depth at a glance.
+    const score = typeof spec.differentiationScore === "number" ? spec.differentiationScore : null;
+    const scorePct = score == null ? "—" : `${Math.round(score * 100)}%`;
+    const knowledge = spec.knowledge || {};
+    const sourceCount = (knowledge.keyThinkers || []).length
+      + (knowledge.foundationalWorks || []).length
+      + (knowledge.recentDevelopments || []).length
+      + (knowledge.contestedClaims || []).length;
+    const searchCount = (knowledge.searchQueries || []).length;
+    const fewShotCount = (spec.fewShot || []).length;
+    const rulesCount = (spec.rules || []).length;
+    const checklistCount = (spec.reflectionChecklist || []).length;
+    const evalCount = (spec.evalSet || []).length;
+    const builtIso = spec.generatedAt || "";
+    const builtLabel = builtIso ? new Date(builtIso).toLocaleDateString(undefined, { year: "numeric", month: "short", day: "numeric" }) : "";
+    return `
+      <section class="ap-block ap-persona-block">
+        <header class="ap-block-h">
+          <span class="ap-block-h-title">Persona dossier</span>
+          <span class="ap-block-h-tag">Full-mode build</span>
+        </header>
+        <button type="button" class="ap-persona-card" data-ap-persona-open data-slug="${escape(slug)}" aria-label="Open persona dossier">
+          <div class="ap-persona-card-head">
+            <div class="ap-persona-card-glyph" aria-hidden="true">
+              <svg viewBox="0 0 32 32" width="28" height="28" fill="none" stroke="currentColor" stroke-width="1.4">
+                <circle cx="16" cy="16" r="12" />
+                <circle cx="16" cy="16" r="5" />
+                <line x1="16" y1="2"  x2="16" y2="8" />
+                <line x1="16" y1="24" x2="16" y2="30" />
+                <line x1="2"  y1="16" x2="8"  y2="16" />
+                <line x1="24" y1="16" x2="30" y2="16" />
+              </svg>
+            </div>
+            <div class="ap-persona-card-id">
+              <div class="ap-persona-card-kicker">— PERSONA · 7-PHASE DOSSIER</div>
+              <div class="ap-persona-card-title">${escape(p && p.name ? p.name : "Director")}</div>
+              ${builtLabel ? `<div class="ap-persona-card-meta">Built · ${escape(builtLabel)}</div>` : ""}
+            </div>
+            <div class="ap-persona-card-score" title="Differentiation vs generic-AI baseline">
+              <div class="ap-persona-card-score-v">${escape(scorePct)}</div>
+              <div class="ap-persona-card-score-l">DIVERGENCE</div>
+            </div>
+          </div>
+          <div class="ap-persona-card-grid">
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${sourceCount}</div>
+              <div class="ap-persona-stat-l">SOURCES</div>
+            </div>
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${searchCount}</div>
+              <div class="ap-persona-stat-l">SEARCHES</div>
+            </div>
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${fewShotCount}</div>
+              <div class="ap-persona-stat-l">VOICE EX.</div>
+            </div>
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${rulesCount}</div>
+              <div class="ap-persona-stat-l">RULES</div>
+            </div>
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${checklistCount}</div>
+              <div class="ap-persona-stat-l">CHECKS</div>
+            </div>
+            <div class="ap-persona-stat">
+              <div class="ap-persona-stat-v">${evalCount}</div>
+              <div class="ap-persona-stat-l">EVALS</div>
+            </div>
+          </div>
+          <div class="ap-persona-card-cta">
+            <span class="ap-persona-card-cta-label">▸ OPEN DOSSIER</span>
+            <span class="ap-persona-card-cta-hint">preview · download .md</span>
+          </div>
+        </button>
+      </section>`;
+  }
   function renderRulesInner(slug) {
     const rules = rulesForAgent(slug);
     const list = rules.length === 0
@@ -1772,6 +1866,79 @@
     `;
   }
 
+  /* ─── Persona dossier overlay ──────────────────────────
+     Full-screen modal that previews the persona.md content. Opens
+     from the dossier card in the main column. Fetches the route
+     once per open (no caching · the file is small and downloads
+     are cheap), renders via the in-file renderMarkdown helper, and
+     surfaces a Download button that hits the same endpoint with
+     the browser's native download path. Closed on backdrop click
+     or Escape. */
+  let _personaOverlayEsc = null;
+  function openPersonaOverlay(slug, agentName) {
+    closePersonaOverlay();
+    const overlay = document.createElement("div");
+    overlay.id = "ap-persona-overlay";
+    overlay.className = "ap-persona-overlay";
+    overlay.innerHTML = `
+      <div class="ap-persona-overlay-backdrop" data-ap-persona-close></div>
+      <div class="ap-persona-overlay-modal" role="dialog" aria-modal="true" aria-label="Persona dossier">
+        <div class="ap-persona-overlay-classification">
+          <span><span class="dot">●</span> CLASSIFIED · DIRECTOR DOSSIER</span>
+          <span class="right">${escape(agentName || "")}</span>
+        </div>
+        <div class="ap-persona-overlay-head">
+          <div class="ap-persona-overlay-title">Persona dossier</div>
+          <div class="ap-persona-overlay-actions">
+            <a class="ap-persona-overlay-dl" href="/api/agents/${encodeURIComponent(slug)}/persona.md" download>
+              <span aria-hidden="true">↓</span> Download .md
+            </a>
+            <button type="button" class="ap-persona-overlay-close" data-ap-persona-close aria-label="Close">✕</button>
+          </div>
+        </div>
+        <div class="ap-persona-overlay-body" data-ap-persona-body>
+          <div class="ap-persona-overlay-loading">Decrypting dossier…</div>
+        </div>
+      </div>
+    `;
+    document.body.appendChild(overlay);
+    document.body.classList.add("ap-persona-overlay-open");
+    _personaOverlayEsc = (ev) => {
+      if (ev.key === "Escape") {
+        ev.stopImmediatePropagation();
+        closePersonaOverlay();
+      }
+    };
+    document.addEventListener("keydown", _personaOverlayEsc, true);
+    // Fetch + render. Same-origin so credentials default. The
+    // fetch path returns text/markdown; we feed it straight into
+    // the existing renderMarkdown helper.
+    fetch(`/api/agents/${encodeURIComponent(slug)}/persona.md`, { credentials: "same-origin" })
+      .then((r) => {
+        if (!r.ok) throw new Error(`HTTP ${r.status}`);
+        return r.text();
+      })
+      .then((md) => {
+        const body = overlay.querySelector("[data-ap-persona-body]");
+        if (!body) return;
+        body.innerHTML = `<div class="ap-persona-overlay-md">${renderMarkdown(md)}</div>`;
+      })
+      .catch((err) => {
+        const body = overlay.querySelector("[data-ap-persona-body]");
+        if (!body) return;
+        body.innerHTML = `<div class="ap-persona-overlay-error">Could not load dossier · ${escape(String(err && err.message ? err.message : err))}</div>`;
+      });
+  }
+  function closePersonaOverlay() {
+    const el = document.getElementById("ap-persona-overlay");
+    if (el) el.remove();
+    document.body.classList.remove("ap-persona-overlay-open");
+    if (_personaOverlayEsc) {
+      document.removeEventListener("keydown", _personaOverlayEsc, true);
+      _personaOverlayEsc = null;
+    }
+  }
+
   /* ─── Profile · ⋯ menu (top-right of the cover) ─────
      Small popover anchored to the menu button with one or more
      actions. v1 ships a single "regenerate 8-bit avatar" item. */
@@ -1807,6 +1974,20 @@
           <span>Regenerate 8-bit avatar</span>
         </button>`);
     }
+    // Persona MD download · only present for Full-mode agents (those
+    // built via the deep persona-builder pipeline). Their `personaSpec`
+    // field carries the 7-phase artifact; the route renders it as
+    // Markdown. Hidden for Signal-mode agents and seeded directors —
+    // they have no spec to export.
+    const hasPersonaSpec = !!(live && live.personaSpec);
+    if (hasPersonaSpec) {
+      parts.push(`<div class="ap-id-menu-divider" aria-hidden="true"></div>`);
+      parts.push(`
+        <a class="ap-id-menu-item" href="/api/agents/${encodeURIComponent(slug)}/persona.md" target="_blank" rel="noopener" data-ap-menu-action="persona-md">
+          <span class="ap-id-menu-mark">↓</span>
+          <span>Download persona.md</span>
+        </a>`);
+    }
     if (isCustom) {
       parts.push(`<div class="ap-id-menu-divider" aria-hidden="true"></div>`);
       parts.push(`
@@ -2408,7 +2589,6 @@
     ensureVoiceOptions();
     const v = voiceForAgent(slug);
     const label = v ? `${v.provider} · ${v.voiceId}` : uiT("ap_voice_browser_default");
-    const deck = v ? v.model : uiT("ap_voice_engine_browser");
     const speed = v?.speed ?? 1;
     const pitch = v?.pitch ?? 0;
     const emotion = v?.emotion || "";
@@ -2424,7 +2604,6 @@
           <button type="button" class="ap-model-trigger" data-ap-voice-trigger>
             <span class="ap-model-trigger-text">
               <span class="ap-model-trigger-name" data-ap-voice-name>${escape(label)}</span>
-              <span class="ap-model-trigger-provider" data-ap-voice-provider>${escape(deck)}</span>
             </span>
             <span class="ap-model-trigger-caret">▾</span>
           </button>
@@ -2709,6 +2888,8 @@
               </div>
             </section>
 
+            ${renderPersonaDossierSection(slug, p)}
+
             <section class="ap-block">
               <header class="ap-block-h">
                 <span class="ap-block-h-title">${escape(uiT("ap_instruction"))}</span>
@@ -3158,6 +3339,34 @@
         return;
       }
 
+      // Persona dossier card · open the preview overlay. Card is a
+      // <button>, so the click lands on the button or any of its
+      // children — closest() catches both. The overlay reads the
+      // slug from the data attribute and fetches /persona.md.
+      const personaOpen = e.target.closest("[data-ap-persona-open]");
+      if (personaOpen) {
+        e.preventDefault();
+        e.stopPropagation();
+        const slug = personaOpen.getAttribute("data-slug");
+        if (!slug) return;
+        const live = window.app && window.app.agentsById ? window.app.agentsById[slug] : null;
+        const agentName = live && live.name ? live.name : "";
+        openPersonaOverlay(slug, agentName);
+        return;
+      }
+      // Persona dossier overlay · backdrop / close-button click. The
+      // download anchor inside the overlay is NOT marked with the
+      // close attr, so it doesn't fire here — its native href
+      // navigation handles the download and the user can dismiss
+      // the overlay manually if they wish.
+      const personaClose = e.target.closest("[data-ap-persona-close]");
+      if (personaClose) {
+        e.preventDefault();
+        e.stopPropagation();
+        closePersonaOverlay();
+        return;
+      }
+
       // ⋯ menu · open the popover (anchored to the button).
       const idMenuBtn = e.target.closest("[data-ap-id-menu]");
       if (idMenuBtn) {
@@ -3173,10 +3382,20 @@
       // ⋯ menu · action click.
       const menuAction = e.target.closest("[data-ap-menu-action]");
       if (menuAction) {
-        e.preventDefault();
         const action = menuAction.getAttribute("data-ap-menu-action");
         const pop = document.getElementById("ap-id-menu-pop");
         const slug = pop?.dataset.slug;
+        // persona-md is rendered as an <a href=…> · let the browser
+        // navigate natively (the route returns the file with a
+        // download Content-Disposition). preventDefault here would
+        // kill the download. For the button-based actions below we
+        // DO want preventDefault (otherwise the button-as-form-
+        // submitter behaviour and click bubbling can both fire).
+        if (action === "persona-md") {
+          closeProfileIdMenu();
+          return;
+        }
+        e.preventDefault();
         closeProfileIdMenu();
         if (action === "regen-avatar" && slug) regenerateProfileAvatar(slug);
         if (action === "delete" && slug && window.app && typeof window.app.deleteAgent === "function") {