@bongos/core 1.24.51 → 1.24.53

package/modules/discord/webhook.js

@@ -71,16 +71,36 @@ function capContent(text) {
   return String(text).slice(0, 2000);
 }
 
+// THE BRAND ON A POST (task 1005091). A broadcast goes out as an EMBED, not as bare
+// message text: the same words as the embed's description, with the pack's accent as
+// the embed's colour bar, so every post in a channel reads as the product's. The
+// description cap is 4096 (an embed's own limit). Mentions inside an embed never ring,
+// which is #871's rule anyway; allowed_mentions stays parse:[] belt-and-braces.
+// The pack's accent as Discord's integer colour, or null (no bar) when it is not a hex.
+function brandColor(brand) {
+  let accent = '';
+  try { accent = ((brand || api.clientBranding()).theme || {}).colors.accent || ''; } catch { accent = ''; }
+  const m = /^#([0-9a-f]{6})$/i.exec(String(accent).trim());
+  return m ? parseInt(m[1], 16) : null;
+}
+// The body of a broadcast post: one embed carrying the text, coloured with the accent.
+function embedBody(text, brand) {
+  const embed = { description: String(text).slice(0, 4096) };
+  const color = brandColor(brand);
+  if (color !== null) embed.color = color;
+  return { embeds: [embed], allowed_mentions: { parse: [] } };
+}
+
 // R22 (the board mirror) needs the id of the message it just posted so the close
 // can be edited onto it, so the POST asks for the created message back
 // (`?wait=true` — Discord then answers 200 + the message JSON instead of 204 with
 // no body). The extra field is additive: every existing caller ignores the return.
-async function postCore(channel, text, allowedMentions) {
+async function postCore(channel, body) {
   const url = resolveWebhookUrl(channel);
   const res = await fetch(`${url}${url.includes('?') ? '&' : '?'}wait=true`, {
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({ content: capContent(text), allowed_mentions: allowedMentions }),
+    body: JSON.stringify(body),
   });
   if (!res.ok) {
     const body = await res.text().catch(() => '');
@@ -96,7 +116,7 @@ async function postCore(channel, text, allowedMentions) {
 // attacker-influenceable; allowed_mentions:{parse:[]} renders text verbatim but
 // fires zero notifications. (Discord defaults to parsing mentions when omitted.)
 async function postWebhook(channel, text) {
-  return postCore(channel, text, { parse: [] });
+  return postCore(channel, embedBody(text));
 }
 
 // postWebhookMentions — the ONE sanctioned exception to #871's blanket mention
@@ -104,10 +124,12 @@ async function postWebhook(channel, text) {
 // notice"). Still parse:[] — nothing typed INTO the content can ever ping — but
 // an explicit `users` allowlist lets exactly the named ids ring. The ids must
 // come from the board-membership resolve (server data), NEVER from message
-// text; the cap of 20 is a sanity bound far above any real board.
+// text; the cap of 20 is a sanity bound far above any real board. It stays
+// MESSAGE TEXT, not an embed: a mention inside an embed never rings, and ringing
+// is this post's whole job (R22's edit rewrites the same text in place).
 async function postWebhookMentions(channel, text, userIds = []) {
   const users = [...new Set(userIds.filter((u) => /^\d+$/.test(String(u))))].slice(0, 20).map(String);
-  return postCore(channel, text, { parse: [], users });
+  return postCore(channel, { content: capContent(text), allowed_mentions: { parse: [], users } });
 }
 
 // editWebhook — rewrite a message this webhook already posted, in place (R22 of
@@ -149,5 +171,5 @@ function hasWebhook(channel) {
 
 module.exports = {
   CHANNELS, WEBHOOKS_PATH, loadWebhooks, resolveWebhookUrl, hasWebhook,
-  postWebhook, postWebhookMentions, editWebhook,
+  postWebhook, postWebhookMentions, editWebhook, embedBody,
 };

package/modules/hall-ui/public/ai-studio.html

@@ -90,6 +90,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/tweak-editor-lib.js?v=2026-09-28-tw23"></script>
 <script src="/builders/studio-lib.js?v=2026-10-09-day"></script>

package/modules/hall-ui/public/approval-queue.css

@@ -26,7 +26,6 @@
   --aq-glass: rgba(255, 255, 255, .075);
   --aq-glass-edge: rgba(255, 255, 255, .18);
   --aq-glass-rim: rgba(255, 255, 255, .22);
-  --aq-drop: rgba(0, 0, 0, .55);
   --aq-ink: #ffffff;
   --aq-ink-soft: #c0c0c0;
   --aq-ink-faint: #a8a8a8;
@@ -44,14 +43,8 @@
   --aq-rule: rgba(255, 255, 255, .12);
   --aq-face: var(--font-body, Manrope, "Segoe UI", system-ui, sans-serif);
   --aq-mono: var(--font-mono, "JetBrains Mono", ui-monospace, Consolas, monospace);
-  position: fixed;
-  inset: 0;
-  z-index: var(--z-modal, 160);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 24px;
-  box-sizing: border-box;
+  /* the layer, the placement and the gutter are the shared .hall-scrim's
+     (controls.css, task 1005085); only the artboard's tint is its own */
   background: var(--aq-scrim);
   color: var(--aq-ink);
   font-family: var(--aq-face);
@@ -60,7 +53,6 @@ html[data-theme="dark"] .aq-overlay { --aq-scrim: rgba(4, 5, 9, .42); }
 @media (prefers-color-scheme: dark) {
   html:not([data-theme]) .aq-overlay { --aq-scrim: rgba(4, 5, 9, .42); }
 }
-.aq-overlay[hidden] { display: none; }
 html.aq-open { overflow: hidden; }
 
 /* FITS THE SCREEN (task 1004381). The artboard's 1180 by 820 is a ceiling, never
@@ -80,7 +72,7 @@ html.aq-open { overflow: hidden; }
   border: 1px solid var(--aq-glass-edge);
   backdrop-filter: blur(30px) saturate(160%);
   -webkit-backdrop-filter: blur(30px) saturate(160%);
-  box-shadow: inset 0 1px 0 var(--aq-glass-rim), 0 40px 90px var(--aq-drop);
+  box-shadow: inset 0 1px 0 var(--aq-glass-rim), var(--ds-shadow-pop);
   display: flex;
   flex-direction: column;
   gap: 16px;

package/modules/hall-ui/public/approval-queue.js

@@ -79,11 +79,16 @@
     };
 
     const scrim = document.createElement('div');
-    scrim.className = 'aq-overlay';
+    // The shared overlay layer (controls.css .hall-scrim, task 1005085); the
+    // glass inside is the artboard's own.
+    scrim.className = 'hall-scrim aq-overlay';
     scrim.hidden = true;
     scrim.innerHTML = '<div class="aq-dialog" role="dialog" aria-modal="true" aria-labelledby="aq-title" tabindex="-1"></div>';
     root.appendChild(scrim);
     const dialog = scrim.querySelector('.aq-dialog');
+    // The hall's one dialog behaviour (hall-dialog.js, task 1005085): Escape, the
+    // focus trap, a click on the scrim, the scroll lock and focus back to the opener.
+    const modal = window.OTBDialog.bind(scrim, { panel: dialog, lockClass: 'aq-open', initialFocus: () => dialog, onClose: closed });
 
     const current = () => state.queue[state.idx] || null;
 
@@ -296,14 +301,11 @@
     // `pageId` (optional) lands on that page's card when it is in the queue, so a
     // row elsewhere that says "needs to be reviewed" opens its own card.
     async function open(pageId, { reload = true } = {}) {
-      state.opener = document.activeElement;
       state.open = true;
       state.error = null;
       state.noteOpen = false;
-      scrim.hidden = false;
-      document.documentElement.classList.add('aq-open');
       paint();
-      dialog.focus();
+      modal.open();
       if (reload || !state.loaded) await loadQueue();
       if (typeof pageId === 'string') {
         const at = state.queue.findIndex((q) => q.page_id === pageId);
@@ -315,17 +317,17 @@
       if (first) first.focus();
     }
 
-    function close() {
+    function close() { modal.close(); }
+
+    // Whatever closed it (the close button, Escape, the scrim), the queue settles here.
+    function closed() {
       state.open = false;
-      scrim.hidden = true;
-      document.documentElement.classList.remove('aq-open');
       // A decided page leaves the queue for good; the next open starts fresh.
       if (state.outcome.size) {
         state.queue = state.queue.filter((q) => !state.outcome.has(q.task_id));
         state.outcome.clear();
         state.idx = 0;
       }
-      if (state.opener && state.opener.focus) state.opener.focus();
     }
 
     // A switch repaints the dialog, so the pressed pill is focused again: a
@@ -338,7 +340,6 @@
     }
 
     scrim.addEventListener('click', (ev) => {
-      if (ev.target === scrim) return close();
       const t = ev.target.closest('button');
       if (!t || t.disabled) return undefined;
       if (('close' in t.dataset)) return close();
@@ -353,17 +354,9 @@
       return undefined;
     });
 
+    // Escape and the Tab trap are the shared dialog's (OTBDialog.bind above).
     scrim.addEventListener('keydown', (ev) => {
-      if (ev.key === 'Escape') { ev.preventDefault(); close(); return; }
-      if (ev.key === 'Enter' && ev.target && ev.target.id === 'aq-note') { ev.preventDefault(); decide('sent'); return; }
-      if (ev.key !== 'Tab') return;
-      // Keep focus inside the dialog while it is open (aria-modal).
-      const f = [...dialog.querySelectorAll('button:not([disabled]), input, [tabindex="0"]')];
-      if (!f.length) return;
-      const first = f[0];
-      const last = f[f.length - 1];
-      if (ev.shiftKey && document.activeElement === first) { ev.preventDefault(); last.focus(); }
-      else if (!ev.shiftKey && document.activeElement === last) { ev.preventDefault(); first.focus(); }
+      if (ev.key === 'Enter' && ev.target && ev.target.id === 'aq-note') { ev.preventDefault(); decide('sent'); }
     });
 
     scrim.addEventListener('input', (ev) => {

package/modules/hall-ui/public/atlas.html

@@ -93,6 +93,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/atlas.js?v=2026-09-02-index" defer></script>

package/modules/hall-ui/public/blockers.html

@@ -62,6 +62,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
 <script src="/builders/palette.js" defer></script>
 <!-- the branding pack's currency label, loaded BEFORE blockers.js. -->

package/modules/hall-ui/public/board-room.html

@@ -64,6 +64,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/hall-kit.js"></script>

package/modules/hall-ui/public/bulk-toolbar.js

@@ -246,8 +246,12 @@
       if (!entries.length) return;
       const label = entries.length === 1 ? `#${entries[0][1]}` : `${entries.length} tasks`;
       const pronoun = entries.length === 1 ? 'It returns' : 'They return';
-      if (!window.confirm(`Release ${label}? ${pronoun} to the queue and no ${curLabel()} are earned.`)) return;
       const btn = el('release');
+      if (!(await window.OTBDialog.confirm({
+        title: `Release ${label}?`,
+        body: `${pronoun} to the queue and no ${curLabel()} are earned.`,
+        confirmLabel: 'Release', danger: true, trigger: btn,
+      }))) return;
       if (btn) { btn.disabled = true; btn.textContent = 'Releasing…'; }
       try {
         const out = await claimAction.releaseMany(entries);

package/modules/hall-ui/public/city.html

@@ -109,6 +109,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers" defer></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals" defer></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark" defer></script>
+<script src="/builders/hall-dialog.js" defer></script>
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/gov-living.js?v=2026-10-09-positions1" defer></script>
 <script src="/builders/gov-feeds.js?v=2026-10-09-living3" defer></script>

package/modules/hall-ui/public/collab.html

@@ -163,6 +163,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/collab-lib.js?v=2026-09-24-archive"></script>
 <script src="/builders/collab.js?v=2026-09-24-archive"></script>

package/modules/hall-ui/public/commands.html

@@ -55,6 +55,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/hall-kit.js"></script>

package/modules/hall-ui/public/controls.css

@@ -221,3 +221,103 @@ select:disabled, input[type="text"]:disabled, input[type="search"]:disabled, tex
   cursor: not-allowed;
 }
 select option { background: var(--bg-card); color: var(--ink); }
+
+/* ---------- the danger button ----------
+   The one fill a confirm spends on an act that cannot be taken back (delete a
+   rank, end every session). The status red, with the card's own ground as its
+   text: --danger is measured at 4.5:1 against --bg-card in both modes
+   (tests/hall_tokens.mjs), so the pair holds whichever way round it is read. */
+.btn--danger {
+  color: var(--bg-card);
+  background: var(--danger);
+  border-color: transparent;
+}
+.btn--danger:hover:not(:disabled) {
+  color: var(--bg-card);
+  background: color-mix(in srgb, var(--danger) 86%, var(--ink));
+  text-decoration: none;
+}
+
+/* ---------- the dialog (task 1005085) ----------
+   THE HALL'S ONE DIALOG. hall-dialog.js builds it (OTBDialog.open / .confirm)
+   or binds a page's own <dialog class="hall-dialog"> (OTBDialog.bind). It is
+   DESIGN.md's panel lifted over the page: bg-card, one hairline, the panel
+   corner, and the one shadow the hall spends, on an element that floats over
+   the scrim. A native dialog opens with showModal(), so it sits in the top
+   layer; the z-index is the ladder's modal step for any reader that does not.
+   .hall-scrim is the same layer for a div overlay (the approval queue's and the
+   studio's glass): fixed over the page, centred, darkened by --scrim. */
+.hall-dialog {
+  z-index: var(--ds-z-modal);
+  box-sizing: border-box;
+  width: min(480px, calc(100vw - 2 * var(--ds-space-sm)));
+  max-height: calc(100dvh - 2 * var(--ds-space-md));
+  overflow-y: auto;
+  margin: auto;
+  padding: var(--ds-space-md);
+  color: var(--ink);
+  background: var(--bg-card);
+  border: var(--line) solid var(--rule);
+  border-radius: var(--ds-radius-panel);
+  box-shadow: var(--ds-shadow-pop);
+}
+.hall-dialog--wide { width: min(720px, calc(100vw - 2 * var(--ds-space-sm))); }
+.hall-dialog::backdrop { background: var(--scrim); }
+.hall-scrim {
+  position: fixed;
+  inset: 0;
+  z-index: var(--ds-z-modal);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  padding: var(--ds-space-md);
+  background: var(--scrim);
+}
+.hall-scrim[hidden] { display: none; }
+.hall-scrim > .hall-dialog { max-height: 100%; }
+.hall-dialog__head {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--ds-space-xs);
+  margin: 0 0 var(--ds-space-xs);
+}
+.hall-dialog__title {
+  flex: 1;
+  margin: 0;
+  font-family: var(--font-display);
+  font-size: var(--ds-text-3xl);
+  font-weight: 500;
+  line-height: 1.25;
+  color: var(--ink);
+}
+.hall-dialog__x {
+  flex: none;
+  min-width: 32px;
+  min-height: 32px;
+  margin: -4px -6px 0 0;
+  padding: 0;
+  font: inherit;
+  font-size: var(--ds-text-4xl);
+  line-height: 1;
+  color: var(--ink-soft);
+  background: transparent;
+  border: 0;
+  border-radius: var(--radius-pill);
+  cursor: pointer;
+}
+.hall-dialog__x:hover { color: var(--ink); }
+.hall-dialog__body p {
+  margin: 0 0 var(--ds-space-xs);
+  font-size: var(--ds-text-md);
+  line-height: 1.5;
+  color: var(--ink-soft);
+}
+.hall-dialog__body p:last-child { margin-bottom: 0; }
+.hall-dialog__actions {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  gap: var(--ds-space-xs);
+  margin-top: var(--ds-space-md);
+}

package/modules/hall-ui/public/copy-desk.css

@@ -2,9 +2,9 @@
    R02 of goal 1000074), rebuilt on the hall's row archetype by task 1003471:
    the counts are the shell's glass .stat-row, every list is a run of
    oversight.css's .ov-row, the filters and the search are the kit's .filters,
-   the two dialogs are the family's .ov-modal on a native <dialog>. What is
-   left here is what only this page has: the quoted string as evidence, the
-   reason as prose, the places a duplicate lives, the dialog's scrim.
+   the three dialogs are the hall's one dialog (controls.css .hall-dialog,
+   task 1005085). What is left here is what only this page has: the quoted
+   string as evidence, the reason as prose, the places a duplicate lives.
 
    px and tokens throughout, and state is COLOUR — the pill's verification
    vocabulary — never opacity. Opacity dims the panel behind the text as well
@@ -67,16 +67,12 @@
 .cd-find .filter input[type="search"] { width: 100%; }
 .cd-search-count { margin: 0 0 14px; }
 
-/* The three dialogs are the family modal on a native <dialog>: bg-card, one rule
-   hairline, no shadow. The backdrop is a SCRIM — it has to darken what is behind
-   it in EITHER mode, so it can take no ground token and no mix of --ink (which is
-   white on black). That is why it was a literal; task 1003495 gave the value a
-   home in style.css as --scrim instead, so the sheet keeps none. */
-.cd-dialog { width: min(480px, calc(100vw - 32px)); color: var(--ink); }
-.cd-dialog::backdrop { background: var(--scrim); }
+/* The three dialogs are the hall's one dialog (controls.css .hall-dialog: the
+   panel, the scrim, the shadow, task 1005085). What stays is the form inside. */
+.cd-dialog .cd-dialog__target { margin: var(--ds-space-xs) 0 0; font-size: var(--ds-text-sm-plus); line-height: 1.5; color: var(--ink-soft); }
 .cd-dialog .ov-form { margin: 14px 0 0; }
 .cd-dialog textarea { resize: vertical; line-height: 1.5; }
-.ov-modal .cd-dialog__err { min-height: 18px; margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: var(--danger); }
+.cd-dialog .cd-dialog__err { min-height: 18px; margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: var(--danger); }
 
 /* The placeholder rule, shown only for a sentence that has holes in it (task
    1003114 / R03). It is a CONSTRAINT, not a footnote — losing a hole is the one

package/modules/hall-ui/public/copy-desk.html

@@ -77,10 +77,10 @@
 <!-- The flag composer. A dialog rather than an inline field because the reason is
      the point: a one-line input invites "typo", and the queue is only worth
      reading if the reasons are. A native <dialog> (its own focus trap and
-     Escape) dressed as the family's confirm modal. -->
-<dialog id="cd-dialog" class="ov-modal cd-dialog">
+     Escape) dressed as the hall's one dialog (controls.css .hall-dialog, task 1005085). -->
+<dialog id="cd-dialog" class="hall-dialog cd-dialog" aria-labelledby="cd-dialog-h">
   <form method="dialog" id="cd-form">
-    <h3 class="scroll__h" id="cd-dialog-h">Flag this copy</h3>
+    <h3 class="hall-dialog__title" id="cd-dialog-h">Flag this copy</h3>
     <p class="cd-dialog__target" id="cd-dialog-target"></p>
     <div class="ov-form">
       <div class="ov-field ov-field--wide">
@@ -103,17 +103,17 @@
       <p class="ov-form__why">The artist reads this instead of guessing. A pointer with no judgement costs them a look and tells them nothing.</p>
     </div>
     <p class="cd-dialog__err" id="cd-dialog-err" role="alert"></p>
-    <div class="ov-modal__actions">
-      <button type="button" class="btn-ghost" id="cd-cancel">Cancel</button>
-      <button type="button" class="btn-accent" id="cd-submit">File the flag</button>
+    <div class="hall-dialog__actions">
+      <button type="button" class="btn btn--ghost" id="cd-cancel">Cancel</button>
+      <button type="button" class="btn" id="cd-submit">File the flag</button>
     </div>
   </form>
 </dialog>
 
 <!-- Closing a flag asks for a note for the same reason opening one does. -->
-<dialog id="cd-close-dialog" class="ov-modal cd-dialog">
+<dialog id="cd-close-dialog" class="hall-dialog cd-dialog" aria-labelledby="cd-close-h">
   <form method="dialog" id="cd-close-form">
-    <h3 class="scroll__h">Close this flag</h3>
+    <h3 class="hall-dialog__title" id="cd-close-h">Close this flag</h3>
     <p class="cd-dialog__target" id="cd-close-target"></p>
     <div class="ov-form">
       <div class="ov-field ov-field--wide">
@@ -135,9 +135,9 @@
       <p class="ov-form__why">The next person to notice this sentence reads your note instead of re-litigating it.</p>
     </div>
     <p class="cd-dialog__err" id="cd-close-err" role="alert"></p>
-    <div class="ov-modal__actions">
-      <button type="button" class="btn-ghost" id="cd-close-cancel">Cancel</button>
-      <button type="button" class="btn-accent" id="cd-close-submit">Close it</button>
+    <div class="hall-dialog__actions">
+      <button type="button" class="btn btn--ghost" id="cd-close-cancel">Cancel</button>
+      <button type="button" class="btn" id="cd-close-submit">Close it</button>
     </div>
   </form>
 </dialog>
@@ -147,9 +147,9 @@
      wrong, a proposal says this is what it should say instead, and one of them
      creates work on the board. The textarea opens PREFILLED with the current
      wording — an artist edits a sentence, they do not retype it from memory. -->
-<dialog id="cd-propose-dialog" class="ov-modal cd-dialog">
+<dialog id="cd-propose-dialog" class="hall-dialog cd-dialog" aria-labelledby="cd-propose-h">
   <form method="dialog" id="cd-propose-form">
-    <h3 class="scroll__h">Propose new wording</h3>
+    <h3 class="hall-dialog__title" id="cd-propose-h">Propose new wording</h3>
     <p class="cd-dialog__target" id="cd-propose-target"></p>
     <div class="ov-form">
       <div class="ov-field ov-field--wide">
@@ -168,9 +168,9 @@
       <p class="ov-form__why">Nothing changes yet. This files a task carrying your wording; whoever claims it lands the diff, and it ships graded like every other change.</p>
     </div>
     <p class="cd-dialog__err" id="cd-propose-err" role="alert"></p>
-    <div class="ov-modal__actions">
-      <button type="button" class="btn-ghost" id="cd-propose-cancel">Cancel</button>
-      <button type="button" class="btn-accent" id="cd-propose-submit">File the change</button>
+    <div class="hall-dialog__actions">
+      <button type="button" class="btn btn--ghost" id="cd-propose-cancel">Cancel</button>
+      <button type="button" class="btn" id="cd-propose-submit">File the change</button>
     </div>
   </form>
 </dialog>
@@ -181,6 +181,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/hall-kit.js"></script>
 <script src="/builders/copy-desk.js?v=2026-09-01-redesign"></script>

package/modules/hall-ui/public/copy-desk.js

@@ -354,6 +354,10 @@
   // the composer
   // ---------------------------------------------------------------------------
 
+  // The three dialogs are the hall's one dialog (hall-dialog.js, task 1005085):
+  // the shared Escape, focus trap, scrim click and focus return.
+  const dialog = (sel) => window.OTBDialog.bind($(sel));
+
   function openComposer(t) {
     target = t;
     $('#cd-dialog-target').innerHTML = t.string_id
@@ -361,7 +365,7 @@
       : `${pill('', 'whole surface')} <span class="ov-key ov-key--faint">${escapeHtml(t.surface)}</span>`;
     $('#cd-reason').value = '';
     $('#cd-dialog-err').textContent = '';
-    $('#cd-dialog').showModal();
+    dialog('#cd-dialog').open();
   }
 
   async function submitFlag() {
@@ -387,7 +391,7 @@
       $('#cd-dialog-err').textContent = d.what_this_means || d.why || err.message || 'Could not file the flag.';
       return;
     }
-    $('#cd-dialog').close();
+    dialog('#cd-dialog').close();
     toast('Flagged. It is in the queue.');
     await loadQueue();
     if ($('#cd-search').value.trim()) await runSearch();
@@ -423,7 +427,7 @@
         + `Keep all ${n} — move them if the new sentence needs them elsewhere, but do not remove one: `
         + 'the values come from the code, and dropping one is a code change.';
     }
-    $('#cd-propose-dialog').showModal();
+    dialog('#cd-propose-dialog').open();
   }
 
   async function submitProposal() {
@@ -463,7 +467,7 @@
       err.textContent = d.what_this_means || d.why || e.message || 'Could not file the change.';
       return;
     }
-    $('#cd-propose-dialog').close();
+    dialog('#cd-propose-dialog').close();
     const task = (res.data && res.data.task) || {};
     toast(res.data && res.data.created === false
       ? `Already filed — task #${task.id} carries this exact change.`
@@ -486,7 +490,7 @@
     $('#cd-close-note').value = '';
     $('#cd-close-task').value = '';
     $('#cd-close-err').textContent = '';
-    $('#cd-close-dialog').showModal();
+    dialog('#cd-close-dialog').open();
   }
 
   async function submitClose() {
@@ -506,7 +510,7 @@
       $('#cd-close-err').textContent = d.what_this_means || d.why || err.message || 'Could not close the flag.';
       return;
     }
-    $('#cd-close-dialog').close();
+    dialog('#cd-close-dialog').close();
     toast('Closed.');
     await loadQueue();
   }
@@ -560,11 +564,11 @@
     if (closeBtn) openCloser(closeBtn.dataset.flag);
   });
 
-  $('#cd-cancel').addEventListener('click', () => $('#cd-dialog').close());
+  $('#cd-cancel').addEventListener('click', () => dialog('#cd-dialog').close());
   $('#cd-submit').addEventListener('click', submitFlag);
-  $('#cd-propose-cancel').addEventListener('click', () => $('#cd-propose-dialog').close());
+  $('#cd-propose-cancel').addEventListener('click', () => dialog('#cd-propose-dialog').close());
   $('#cd-propose-submit').addEventListener('click', submitProposal);
-  $('#cd-close-cancel').addEventListener('click', () => $('#cd-close-dialog').close());
+  $('#cd-close-cancel').addEventListener('click', () => dialog('#cd-close-dialog').close());
   $('#cd-close-submit').addEventListener('click', submitClose);
 
   (async () => {

package/modules/hall-ui/public/deploy.html

@@ -82,6 +82,7 @@
 <script src="/builders/shell-trail.js?v=2026-11-05-numbers"></script>
 <script src="/builders/craft-mode.js?v=2026-11-05-goals"></script>
 <script src="/builders/shell.js?v=2026-11-07-brand-mark"></script>
+<script src="/builders/hall-dialog.js"></script>
 <script src="/builders/palette.js" defer></script>
 <script src="/builders/hall-kit.js"></script>
 <!-- the shared ask card the move is drawn with (task 1004829) -->