@bongos/core 1.19.473 → 1.19.474

package/modules/hall-ui/public/drachmae.js

@@ -1,18 +1,28 @@
-// drachmae.js — the in-hall reader for the "Drachmae & karma" onboarding doc
-// (task 1472). Fetches the canonical markdown at /builders/drachmae-and-karma.md
-// (mounted from docs/onboarding/drachmae-and-karma.md — single source of truth,
-// also the one the primer links to) and renders it with the shared OTBMdReader,
-// so builders can read exactly how they get paid without leaving the hall for
-// GitHub. Reuses the primer's layout/TOC/progress DOM + primer.css; no ack gate
-// (this is reference reading, not an onboarding checkpoint).
+// drachmae.js — the in-hall reader for the "Drachmae & karma" doc (task 1472),
+// rebuilt as the hall's first REFERENCE room (task 1003473, goal 1000081).
+// Fetches the canonical markdown at /builders/drachmae-and-karma.md (mounted
+// from docs/onboarding/drachmae-and-karma.md — single source of truth, also the
+// one the primer links to) and renders it through the shared OTBMdReader, so
+// builders can read exactly how they get paid without leaving the hall.
 //
-// task 2174: the red-team bounty rate card moved here off Standing. It is a
-// published reward SCHEDULE — reference material that reads the same for every
-// builder — so it belongs with the rest of the reward model, not in a personal
-// standing view. The doc's §"Red-team / security bounty" describes it in prose;
-// the LIVE numbers come from /public/bounty-table and are appended as a real
-// section (h2 + table) so the TOC, scrollspy and progress bar pick it up like
-// any other section of the article.
+// WHAT A REFERENCE OWES THAT THE PRIMER DOES NOT. People arrive at this page to
+// answer one question about how they get paid, so it is scanned and deep-linked
+// rather than read start to finish. Three things follow, and they are the whole
+// difference between this file and primer.js (the room itself — the layout, the
+// glass contents, the card — is room.css's, shared):
+//   * the outline goes to h3 depth and the scrollspy lights the section AND
+//     its part (the trail), with the phone toggle naming where the reader is;
+//   * every h2/h3/h4 carries its own link (.room-anchor), which copies the
+//     address on click, and a deep link lands after the async render;
+//   * there is no progress hairline and no acknowledge gate: a reference has
+//     no end to reach.
+//
+// task 2174: the red-team bounty rate card lives here. It is a published reward
+// SCHEDULE — reference material that reads the same for every builder — so it
+// belongs with the rest of the reward model. The doc's §"Red-team / security
+// bounty" describes it in prose; the LIVE numbers come from /public/bounty-table
+// and are inserted as a real section (h2 + table) ahead of the closing links,
+// so the outline and the scrollspy pick it up like any other section.
 
 (() => {
   'use strict';
@@ -23,12 +33,31 @@
   const BOUNTY_URL = '/api/gds/public/bounty-table';
   const BOUNTY_SECTION_ID = 'security-bounty-rates';
   const BOUNTY_SECTION_TITLE = 'Security bounty rates';
+  // The section the live table is inserted AHEAD of: the doc's closing links.
+  // Matched by its opening words, so a retitled footer falls back to appending.
+  const CLOSING_H2 = /^see it/i;
+  // The y (viewport space) treated as "where the reader is looking": below the
+  // sticky top bar, where the eye lands reading down a page.
+  const READING_LINE_Y = 100;
+  const LINK_ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6.6 9.4a2.7 2.7 0 0 0 3.8 0l2.3-2.3a2.7 2.7 0 0 0-3.8-3.8L7.7 4.5"/><path d="M9.4 6.6a2.7 2.7 0 0 0-3.8 0L3.3 8.9a2.7 2.7 0 0 0 3.8 3.8l1.2-1.2"/></svg>';
 
   let repoBlobBase = null;
   let repoTreeBase = null;
 
   function $(sel) { return document.querySelector(sel); }
 
+  // The shell's toast (style.css .toast[data-visible="1"]), the same contract
+  // primer.js and copy-on-click.js speak; this page loads no dom-utils.js.
+  function toast(msg) {
+    const el = $('#toast');
+    if (!el) return;
+    el.textContent = msg;
+    el.dataset.type = 'info';
+    el.dataset.visible = '1';
+    clearTimeout(toast._t);
+    toast._t = setTimeout(() => { el.dataset.visible = '0'; }, 2400);
+  }
+
   async function loadRepoInfoBases() {
     try {
       const r = await fetch('/api/gds/public/repo-info', { credentials: 'same-origin' });
@@ -39,10 +68,11 @@
     } catch (_) { /* links degrade to the original href */ }
   }
 
-  // Append the live bounty rate card to the article and return its TOC heading,
-  // or null when the schedule can't be read (the prose section stays; we just
-  // don't show an empty table or a TOC entry that leads nowhere).
-  async function appendBountySection(article) {
+  // The live rate card as a real section of the article, placed ahead of the
+  // closing links so the doc still ends on "dig deeper". Returns false when the
+  // schedule can't be read: the prose section stays, and no empty table or
+  // outline entry that leads nowhere is rendered.
+  async function insertBountySection(article) {
     let payload;
     try {
       const r = await fetch(BOUNTY_URL, { credentials: 'same-origin' });
@@ -50,19 +80,19 @@
       payload = await r.json();
     } catch (err) {
       console.warn('[drachmae] bounty schedule unavailable:', err.message);
-      return null;
+      return false;
     }
     const rows = Array.isArray(payload && payload.table) ? payload.table : [];
-    if (!rows.length) return null;
+    if (!rows.length) return false;
 
     const esc = window.OTBMdReader.escapeHtml;
     const currency = payload.currency || 'credits';
     const section = document.createElement('section');
     section.innerHTML =
       `<h2 id="${esc(BOUNTY_SECTION_ID)}">${esc(BOUNTY_SECTION_TITLE)}</h2>` +
-      `<p>Find a flaw in the system’s own walls and report it — rewards are paid in ` +
+      `<p>Find a flaw in the system’s own walls and report it: rewards are paid in ` +
       `${esc(currency)} by severity. These are the live numbers, read from the server ` +
-      `just now, so a tuned rate shows up here immediately.</p>` +
+      `when you opened this page, so a tuned rate shows up here immediately.</p>` +
       '<table><thead><tr><th>Severity</th>' +
       `<th>${esc(currency.charAt(0).toUpperCase() + currency.slice(1))}</th>` +
       '<th>What counts</th></tr></thead><tbody>' +
@@ -74,58 +104,117 @@
           `<td>${esc(r.blurb || '')}</td></tr>`;
       }).join('') +
       '</tbody></table>';
-    article.appendChild(section);
-    return { level: 2, id: BOUNTY_SECTION_ID, text: BOUNTY_SECTION_TITLE };
+    const closing = [...article.querySelectorAll('h2')].find((h) => CLOSING_H2.test(h.textContent.trim()));
+    if (closing) article.insertBefore(section, closing); else article.appendChild(section);
+    return true;
+  }
+
+  // The outline is read from the RENDERED headings rather than the parser's raw
+  // text, so `*not*` and a [link](…) in a heading arrive as plain words, and so
+  // the live section inserted above is simply one more heading in order.
+  function collectHeadings(article) {
+    return [...article.querySelectorAll('h2[id], h3[id]')].map((el) => ({
+      level: Number(el.tagName.charAt(1)), id: el.id, text: el.textContent.trim(),
+    }));
   }
 
+  // h2s as the list, each h3 nested under its part; no numerals (room.css turns
+  // the room's counter off for a reference). Returns the flat list in document
+  // order, each entry carrying its part's id and title, which is what the
+  // scrollspy walks and what the phone toggle names.
   function renderToc(headings) {
     const list = $('#primer-toc-list');
     if (!list) return [];
-    const h2s = headings.filter((h) => h.level === 2);
-    if (h2s.length === 0) { list.innerHTML = '<li class="primer-toc__placeholder">(no sections)</li>'; return []; }
+    if (headings.length === 0) { list.innerHTML = '<li class="primer-toc__placeholder">(no sections)</li>'; return []; }
     const esc = window.OTBMdReader.escapeHtml;
-    list.innerHTML = h2s.map((h) =>
-      `<li><a href="#${esc(h.id)}" data-section="${esc(h.id)}">${esc(h.text)}</a></li>`
+    const link = (h) => `<a href="#${esc(h.id)}" data-section="${esc(h.id)}">${esc(h.text)}</a>`;
+    const parts = [];
+    for (const h of headings) {
+      const last = parts[parts.length - 1];
+      if (h.level === 3 && last) last.subs.push(h);
+      else parts.push({ head: h, subs: [] });
+    }
+    list.innerHTML = parts.map((p) =>
+      `<li>${link(p.head)}${p.subs.length
+        ? `<ol class="primer-toc__sub">${p.subs.map((s) => `<li>${link(s)}</li>`).join('')}</ol>`
+        : ''}</li>`
     ).join('');
-    return h2s;
+    const flat = [];
+    for (const p of parts) {
+      flat.push({ id: p.head.id, parent: null, part: p.head.text });
+      for (const s of p.subs) flat.push({ id: s.id, parent: p.head.id, part: p.head.text });
+    }
+    return flat;
   }
 
-  function setupScrollspy(tocSections) {
-    if (tocSections.length === 0) return;
+  // The active entry is the LAST heading whose top has scrolled past the
+  // reading line, so it stays put through a section's paragraphs. Its part, when
+  // the active entry is an h3, is the trail; the toggle's middle names the part.
+  function setupScrollspy(sections) {
+    if (sections.length === 0) return;
     const links = new Map();
     for (const a of document.querySelectorAll('.primer-toc__list a')) links.set(a.dataset.section, a);
     if (links.size === 0) return;
-    const READING_LINE_Y = 100;
+    const current = $('#primer-toc-current');
     let last = null;
     function update() {
       let active = null;
-      for (const s of tocSections) {
+      for (const s of sections) {
         const el = document.getElementById(s.id);
         if (!el) continue;
-        if (el.getBoundingClientRect().top <= READING_LINE_Y) active = s.id; else break;
+        if (el.getBoundingClientRect().top <= READING_LINE_Y) active = s; else break;
+      }
+      const id = active ? active.id : null;
+      if (id === last) return;
+      last = id;
+      const trail = active && active.parent;
+      for (const [sid, a] of links) {
+        a.classList.toggle('is-active', sid === id);
+        a.classList.toggle('is-trail', !!trail && sid === trail);
       }
-      if (active === last) return;
-      last = active;
-      for (const [id, a] of links) a.classList.toggle('is-active', id === active);
+      if (current) current.textContent = active ? active.part : '';
     }
     window.addEventListener('scroll', update, { passive: true });
     window.addEventListener('resize', update, { passive: true });
     update();
   }
 
-  function setupProgressBar(articleEl) {
-    const bar = $('#primer-progress-bar');
-    if (!bar) return;
-    function update() {
-      const rect = articleEl.getBoundingClientRect();
-      const viewport = window.innerHeight || document.documentElement.clientHeight;
-      const scrolled = Math.max(0, -rect.top);
-      const frac = rect.height > 0 ? Math.min(1, scrolled / Math.max(1, rect.height - viewport)) : 0;
-      bar.style.width = `${Math.round(frac * 100)}%`;
+  // Every heading is an address. The link is the heading's own id, so it works
+  // with the browser's hash navigation and no script; the click additionally
+  // copies the absolute address, so a reader can hand a colleague the exact
+  // answer, which is the reason a reference is deep-linked at all.
+  function addAnchors(article) {
+    for (const h of article.querySelectorAll('h2[id], h3[id], h4[id]')) {
+      const a = document.createElement('a');
+      a.className = 'room-anchor';
+      a.href = `#${h.id}`;
+      a.setAttribute('aria-label', `Link to this section: ${h.textContent.trim()}`);
+      a.innerHTML = LINK_ICON;
+      h.appendChild(a);
     }
-    window.addEventListener('scroll', update, { passive: true });
-    window.addEventListener('resize', update, { passive: true });
-    update();
+    article.addEventListener('click', (e) => {
+      const a = e.target.closest('a.room-anchor');
+      if (!a) return;
+      if (!(navigator.clipboard && navigator.clipboard.writeText && window.isSecureContext)) return;
+      const url = new URL(a.getAttribute('href'), window.location.href).href;
+      navigator.clipboard.writeText(url).then(() => toast('Link copied.'), () => { /* the hash still navigated */ });
+    });
+  }
+
+  // A deep link arrives before the article exists, so the browser's own jump
+  // finds nothing and its :target was resolved against nothing. Once the
+  // document and the live section are in the DOM the target is scrolled into
+  // view (scroll-margin-top clears the top bar) and marked (.is-target) until
+  // the next hash change hands the mark back to :target.
+  function landOnHash() {
+    let id = '';
+    // a malformed percent-escape in the fragment throws; there is nothing to land on
+    try { id = decodeURIComponent(window.location.hash.slice(1)); } catch (_) { return; }
+    const el = id && document.getElementById(id);
+    if (!el) return;
+    el.classList.add('is-target');
+    el.scrollIntoView({ block: 'start' });
+    window.addEventListener('hashchange', () => el.classList.remove('is-target'), { once: true });
   }
 
   function setupTocToggle() {
@@ -146,8 +235,7 @@
     });
   }
 
-  // The three panels the article can resolve into (the primer's show(), which
-  // this page's DOM has mirrored since task 1472 and now finally matches).
+  // The three panels the article can resolve into (the primer's show()).
   function show(which) {
     for (const [id, on] of [['#primer-skeleton', which === 'loading'],
                             ['#primer-article', which === 'article'],
@@ -185,18 +273,18 @@
     // The doc's leading "# …" is the same page name .page-head--room already
     // renders. Two <h1>s fails one-header-main-h1, and the page head is the one
     // that exists before the fetch and survives its failure (task 1003307).
-    const html = parsed.html.replace(/^\s*<h1\b[^>]*>[\s\S]*?<\/h1>\s*/, '');
-    const headings = parsed.headings.filter((h) => h.level > 1);
-    article.innerHTML = html;
+    article.innerHTML = parsed.html.replace(/^\s*<h1\b[^>]*>[\s\S]*?<\/h1>\s*/, '');
     article.removeAttribute('aria-busy');
     show('article');
-    // Awaited before the TOC is built so the rate card gets a TOC entry and a
+    // Awaited before the outline is built so the rate card gets its entry and a
     // scrollspy target; the article itself is already on screen by now.
-    const bountyHeading = await appendBountySection(article);
-    const tocSections = renderToc(bountyHeading ? [...headings, bountyHeading] : headings);
+    await insertBountySection(article);
+    addAnchors(article);
     setupTocToggle();
-    setupScrollspy(tocSections);
-    setupProgressBar(article);
+    setupScrollspy(renderToc(collectHeadings(article)));
+    // After the fonts: a swap after the jump moves everything above the target
+    // (measured: 300px short on a phone, past it on a desktop).
+    (document.fonts ? document.fonts.ready : Promise.resolve()).then(landOnHash);
   }
 
   if (document.readyState === 'loading') {

package/modules/hall-ui/public/drachmae.states.json

@@ -1,12 +1,12 @@
 {
-  "_": "Drachmae & karma — a READING ROOM, not a board: it shares the primer .primer-layout and takes .page-head--room. Public (no page gate), so the signed-out render is the one most readers get. Written with the re-skin (task 1003307) so this page is MEASURED at three widths in both modes rather than looked at once.",
+  "_": "Drachmae & karma — the hall's first REFERENCE room (task 1003473): the reading-room archetype (room.css) with the reference rules on (`room--reference`). Public (no page gate), so the signed-out render is the one most readers get. Measured at three widths in both modes rather than looked at once.",
   "page": "/builders/drachmae",
   "surface": "hall-ui",
   "stub": {
     "prefix": "/builders/"
   },
   "modeQuery": false,
-  "_feeds": "The kit's own stub carries no feed for this page, so against it the page renders its EMPTY and SKELETON states — which is the point: those are states the floors must hold in. Against the hall-preview harness the same states render populated. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
+  "_feeds": "The kit's own stub serves neither the markdown nor the bounty feed, so against it the page renders its SKELETON and then its FAILURE note — states the floors must hold in. The POPULATED document, the outline, the anchors and the live table need the hall-preview harness (node scripts/hall-preview/server.js --port 4620 --fixture-me, then this file with --base-in/--base-out pointed at it): it serves docs/onboarding/drachmae-and-karma.md and the checked-in public__bounty-table.json. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
   "ignoreRequests": [
     "/api/(gds|bongos)/me$",
     "/api/(gds|bongos)/me/",
@@ -26,39 +26,33 @@
     "Not Implemented",
     "load failed"
   ],
+  "_expect": "read pins the article, so this file is run against the harness (the kit stub can only ever show the failure note). jump is the deep link: the browser's own hash jump finds nothing on a page whose document arrives after load, so drachmae.js lands it, and the outline's lit entry with its trail, plus the phone toggle naming the part, are what the shot proves.",
   "states": {
     "read": {
       "auth": true,
-      "actions": [
-        [
-          "wait",
-          600
-        ]
-      ],
-      "expect": {
-        "visible": [
-          "#primer-article",
-          "#primer-toc"
-        ]
-      }
+      "actions": [["wait", 600]],
+      "expect": { "visible": ["#primer-article", "#primer-toc"] }
+    },
+    "toc-open": {
+      "auth": true,
+      "actions": [["clickIfVisible", "#primer-toc-toggle"], ["wait", 250]],
+      "_": "the room's one disclosure. Below 760px the contents collapse behind this toggle; above it the toggle is not rendered at all, so clickIfVisible is the right verb and the state is a no-op at 1440.",
+      "expect": { "visible": ["#primer-toc"] }
+    },
+    "jump": {
+      "auth": true,
+      "url": "/builders/drachmae#how-karma-is-earned-and-lost",
+      "actions": [["wait", 700]],
+      "_": "a deep link to an h3 under Part 3. At 1440 the outline shows the entry lit and its part in the trail; at 390 the collapsed toggle reads the part's name.",
+      "expect": { "visible": ["#primer-article", "#primer-toc"] }
     },
     "out": {
       "auth": false,
-      "actions": [
-        [
-          "wait",
-          600
-        ]
-      ]
+      "actions": [["wait", 600]]
     }
   },
   "reducedMotion": {
     "auth": true,
-    "actions": [
-      [
-        "wait",
-        600
-      ]
-    ]
+    "actions": [["wait", 600]]
   }
 }

package/modules/hall-ui/public/md-reader.js

@@ -33,6 +33,9 @@
   // Stable slug for heading anchors — lowercase, strip punctuation, dash-join.
   // Matches the primer's slugify so in-doc anchor links behave identically.
   function slugify(text) {
+    // A [link](target) in a heading slugs by its TEXT alone (task 1003473):
+    // the target's path is not part of the address a reader copies.
+    text = String(text).replace(/\[([^\]]+)\]\([^)]*\)/g, '$1');
     return String(text)
       .toLowerCase()
       .replace(/[—–]/g, '-')
@@ -113,7 +116,9 @@
       const attrs = external ? ' target="_blank" rel="noopener"' : '';
       return `<a href="${escapeHtml(resolved)}"${attrs}>${text}</a>`;
     });
-    out = out.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+    // Bold first, and lazily, so an *emphasis* INSIDE a bold run still renders
+    // (the "**It's the API *list* price**" line showed its asterisks before).
+    out = out.replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>');
     out = out.replace(/(^|[^*])\*([^*]+)\*(?!\*)/g, '$1<em>$2</em>');
     out = out.replace(/ CODE(\d+) /g, (_m, idx) => `<code>${escapeHtml(codeSpans[Number(idx)])}</code>`);
     return out;
@@ -147,9 +152,10 @@
         continue;
       }
 
-      // Headings.
+      // Headings, to h4: the economy doc's six earning sources are #### and
+      // rendered as paragraphs with a literal "####" until task 1003473.
       let hm;
-      if ((hm = raw.match(/^(#{1,3})\s+(.+?)\s*$/))) {
+      if ((hm = raw.match(/^(#{1,4})\s+(.+?)\s*$/))) {
         const level = hm[1].length;
         const text = hm[2];
         const id = slugify(text);
@@ -215,7 +221,7 @@
       i += 1;
       while (i < lines.length &&
              !/^\s*$/.test(lines[i]) &&
-             !/^(#{1,3})\s/.test(lines[i]) &&
+             !/^(#{1,4})\s/.test(lines[i]) &&
              !/^---+\s*$/.test(lines[i]) &&
              !/^```/.test(lines[i]) &&
              !/^>\s?/.test(lines[i]) &&

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

@@ -1,6 +1,7 @@
 /* room.css — the READING-ROOM archetype: a long document read end to end
-   (task 1003306, goal 1000081). Shared by the primer (primer.html) and the
-   diagrams index (diagrams.html).
+   (task 1003306, goal 1000081). Shared by the primer (primer.html), the
+   diagrams index (diagrams.html) and, as the hall's first REFERENCE, drachmae
+   (task 1003473; §8 below is what the room owes a document that is scanned).
 
    THE ARCHETYPE is v3 "the glass hall", the owner's pick from the composition
    round — docs/design/hall-direction-v2.md §6, mock
@@ -203,7 +204,8 @@ body.room .page-head { max-width: var(--room-max); }
 .primer-article > ol,
 .primer-article > blockquote,
 .primer-article > h2,
-.primer-article > h3 { max-width: var(--measure); }
+.primer-article > h3,
+.primer-article > h4 { max-width: var(--measure); }
 
 /* the document's own h1 is suppressed — the page head already names the room,
    and a second h1 in <main> fails the one-header-main-h1 floor outright */
@@ -244,6 +246,20 @@ body.room .page-head { max-width: var(--room-max); }
   scroll-margin-top: calc(var(--topbar-h) + 28px);
 }
 
+/* the fourth level: a run-in head in the body face at the body size, one weight
+   step up. The parser only reached h3 until task 1003473, so the economy doc's
+   six earning sources rendered as paragraphs with a literal "####". */
+.primer-article h4 {
+  margin: var(--sp-lg) 0 var(--sp-xs);
+  font-family: var(--font-body);
+  font-size: var(--room-size);
+  font-weight: 600;
+  line-height: 1.4;
+  letter-spacing: -0.01em;
+  color: var(--ink);
+  scroll-margin-top: calc(var(--topbar-h) + 28px);
+}
+
 .primer-article p { margin: 0 0 var(--sp-md); }
 .primer-article p:last-child { margin-bottom: 0; }
 /* the subtitle line at the very top of the document */
@@ -439,3 +455,100 @@ body.room .page-head { max-width: var(--room-max); }
     overflow-x: auto;
   }
 }
+
+/* ---- 8. the reference ----------------------------------------------------
+   The same room, a second document (task 1003473). The primer is read once,
+   start to finish, with a gate at the end; drachmae is a REFERENCE that people
+   open to answer one question about how they get paid. Nothing about the
+   composition changes — the head, the glass contents beside the card, the
+   measure — because the room is right for both. What changes is what the room
+   does for a reader who is looking rather than reading, and `room--reference`
+   on the body switches those content rules on:
+     * the counters are off (no numerals in the contents, no "01" over a
+       heading), because a reference has no order to keep;
+     * the contents nest h3s under their h2s, since the sub-questions are what
+       a reader scans for, and the spy lights the entry AND its part (.is-trail);
+     * every heading carries its own link (.room-anchor), always visible in the
+       faint ink — an address is part of the content, not a hover secret — and
+       in the accent when it is the one the reader arrived at (:target);
+     * the phone toggle's middle names the part the reader is in.
+   There is no progress hairline on a reference: the page omits the markup and
+   §1 above stays for the primer, whose gate is fed by it. Why a modifier and
+   not a second archetype: the third document that is scanned (the ranks, the
+   API docs) takes these four rules by one body class, and a sheet of its own
+   would be room.css again with the counter deleted. */
+.room--reference .primer-article h2::before,
+.room--reference .primer-toc__list a::before { content: none; }
+.room--reference .primer-toc__list a.is-trail { color: var(--ink); }
+.room--reference .primer-toc__sub {
+  list-style: none;
+  margin: 0 0 6px var(--sp-xs);
+  padding: 0 0 0 10px;
+  border-left: var(--line) solid var(--rule-soft);
+}
+.room--reference .primer-toc__sub a {
+  min-height: 30px;
+  padding: 6px var(--sp-xs);
+  font-size: 13px;
+  color: var(--ink-faint);
+}
+.room--reference .primer-toc__sub a:hover,
+.room--reference .primer-toc__sub a.is-active { color: var(--ink); }
+
+/* the toggle's middle: the part the reader is in, in the faint ink, cut with an
+   ellipsis before it can push the chevron off the row. Empty until the spy has
+   something to say, and then it takes no room at all. */
+.room--reference .primer-toc__toggle-label { flex: none; }
+.room--reference .primer-toc__current {
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: right;
+  font-size: 13px;
+  color: var(--ink-faint);
+}
+.room--reference .primer-toc__current:empty { display: none; }
+
+/* the address. Outranks the prose-link rule (.primer-article a): no underline,
+   no padding, a 24px box of its own so the floor holds without the padding
+   trick, and the glass under it on hover so the target reads as one. */
+.room--reference .primer-article .room-anchor {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  margin-left: 6px;
+  padding: 0;
+  vertical-align: middle;
+  color: var(--ink-faint);
+  text-decoration: none;
+  border-radius: var(--radius-sm);
+  transition: color 200ms cubic-bezier(.2, .7, .3, 1), background 200ms cubic-bezier(.2, .7, .3, 1);
+}
+.room--reference .primer-article .room-anchor:hover { color: var(--accent-ink); background: var(--glass); }
+/* the one the reader arrived at. :target alone misses a deep link into a
+   document that renders after load, so drachmae.js marks the landing itself. */
+.room--reference .primer-article :is(:target, .is-target) > .room-anchor { color: var(--accent-ink); }
+
+/* On a phone the collapsed outline rides under the top bar, so the reader can
+   open it from anywhere in the document and read which part they are in. The
+   toggle is glass, the same material as the bar it sits under, and below the
+   bar in the z ladder for the same reason the progress hairline is. */
+@media (max-width: 760px) {
+  .room--reference .primer-toc {
+    position: sticky;
+    top: calc(var(--topbar-h) + 8px);
+    z-index: var(--z-progress);
+  }
+  /* Riding over the article, the toggle and the open list take the card's
+     ground at 92% rather than the bare glass: light's glass has no blur, so
+     over scrolling prose the bare tint was the prose showing through the pill
+     (measured on the deep-link render at 390). The edge stays the glass edge. */
+  .room--reference .primer-toc__toggle,
+  .room--reference .primer-toc__inner { background: color-mix(in srgb, var(--bg-card) 92%, transparent); }
+  /* a landed heading has to clear the sticky toggle as well as the top bar */
+  .room--reference .primer-article :is(h2, h3, h4) { scroll-margin-top: calc(var(--topbar-h) + 72px); }
+}

package/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.473",
+  "version": "1.19.474",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@bongos/core",
-      "version": "1.19.473",
+      "version": "1.19.474",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "express": "^4.21.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.473",
+  "version": "1.19.474",
   "description": "Cloud Bongos — the AI-first build platform core (GDS + platform surfaces + module system), installed as a versioned dependency (ADR 0108).",
   "license": "AGPL-3.0-or-later",
   "main": "src/platform-server.js",

package/src/module-api.js

@@ -34,7 +34,7 @@ const { validateOrRespond, LIMITS, parseId, asyncHandler, corsPublicGet, parsePa
 // there. scripts/gds/bump-version.js still rewrites the literal below; it appends
 // the entry to that file. Look for a version's history there, not here.
 // ---------------------------------------------------------------------------
-const CORE_VERSION = '1.19.473'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
+const CORE_VERSION = '1.19.474'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
 
 // A namespaced logger so a module's log lines are attributable + consistent.
 // Usage: const log = api.logger('dev-box'); log.info('mounted');