@bongos/core 1.19.473 → 1.19.475

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/hall-render.js

@@ -3,7 +3,7 @@
 // Carved out of builders.js by task 1003206 (goal 1000079, the R03 de-monolith
 // plan): that file was 2,558 lines, the largest first-party file left over the
 // 1,500-line ratchet. This holds the view painters — landing, profile, welcome,
-// onboarding, recent ships, the AI-dev curve, the leaderboard, the nav and hall
+// onboarding, recent ships, the AI-dev curve, the nav and hall
 // widgets — plus the helpers and view state only they touch.
 //
 // WHY A FACTORY, and not a flat namespace like goals-lib.js. goals-lib.js can be
@@ -85,10 +85,13 @@
       `</span>` +
     `</span>`;
   }
+  // Mirrors dom-utils.js HALL_VIEWS. task 1003441 dropped the `leaderboard`
+  // key with the view: no widget can declare view:’leaderboard’ any more, so
+  // widgetHost() could never have read it, and index.html no longer carries the
+  // #zone-leaderboard mount it named.
   const VIEW_CONTAINERS = {
     home: 'zone-home-main',
     standing: 'zone-standing',
-    leaderboard: 'zone-leaderboard',
   };
   const STANDING_GROUPS = [
     { key: 'work', label: 'Work' },
@@ -1099,99 +1102,10 @@
       kindsEl.innerHTML = '';
     }
   }
-  const ACH_EMOJI = {
-    'first-ship': '🚢',
-    'first-claim': '🪙',
-    'first-parallel-claim': '⚓',
-    'streak-3': '🔥',
-    'streak-7': '🌋',
-    'art-pipeline-shipper': '🎨',
-    'gds-shipper': '⚙️',
-    'breaking-the-100c-bar': '💯',
-  };
-  function renderAchievementRow(ids) {
-    if (!Array.isArray(ids) || ids.length === 0) return '';
-    const inner = ids
-      .map((id) => {
-        const emoji = ACH_EMOJI[id];
-        if (!emoji) return '';
-        // Title attribute is the achievement id (kebab) — terse enough that hover
-        // discloses the laurel without overstating the prose.
-        return `<span class="lb-ach" title="${escapeHtml(id)}" aria-label="${escapeHtml(id)}">${emoji}</span>`;
-      })
-      .join('');
-    return inner ? `<span class="lb-ach-row" aria-label="achievements">${inner}</span>` : '';
-  }
-  const lbState = {
-    rows: [],
-    sortBy: 'drachmae',     // 'rank' | 'drachmae' | 'karma' | 'tokens'
-    sortDir: 'desc',        // 'desc' | 'asc'
-  };
-  const lbPager = window.OTBKit.makePager('lb', 'otb.standing.leaderboardPerPage', { defaultPerPage: 25 });
-  function sortedLeaderboardRows() {
-    const indexed = lbState.rows.map((row, idx) => ({ row, idx }));
-    const dir = lbState.sortDir === 'asc' ? 1 : -1;
-    if (lbState.sortBy === 'rank') {
-      return indexed
-        .sort((a, b) => {
-          const diff = (rankWeight(a.row.rank) - rankWeight(b.row.rank)) * dir;
-          return diff !== 0 ? diff : a.idx - b.idx;
-        })
-        .map(({ row }) => row);
-    }
-    if (lbState.sortBy === 'karma') {
-      return indexed
-        .sort((a, b) => {
-          const ak = Number(a.row.karma) || 0;
-          const bk = Number(b.row.karma) || 0;
-          const diff = (ak - bk) * dir;
-          if (diff !== 0) return diff;
-          // Tie-break on drachmae DESC, then stable on server order.
-          const ac = Number(a.row.total_credits) || 0;
-          const bc = Number(b.row.total_credits) || 0;
-          if (ac !== bc) return bc - ac;
-          return a.idx - b.idx;
-        })
-        .map(({ row }) => row);
-    }
-    if (lbState.sortBy === 'tokens') {
-      // task 1473: sort by total tokens used. tokens_used arrives as a string
-      // (pg bigint), so coerce. Tie-break on drachmae DESC then server order,
-      // matching the karma branch.
-      return indexed
-        .sort((a, b) => {
-          const at = Number(a.row.tokens_used) || 0;
-          const bt = Number(b.row.tokens_used) || 0;
-          const diff = (at - bt) * dir;
-          if (diff !== 0) return diff;
-          const ac = Number(a.row.total_credits) || 0;
-          const bc = Number(b.row.total_credits) || 0;
-          if (ac !== bc) return bc - ac;
-          return a.idx - b.idx;
-        })
-        .map(({ row }) => row);
-    }
-    if (lbState.sortBy === 'drachmae') {
-      // Server already DESCs by drachmae, so the default mode is a no-op
-      // copy. The ASC branch flips it.
-      if (lbState.sortDir === 'desc') return lbState.rows.slice();
-      return indexed
-        .sort((a, b) => {
-          const ac = Number(a.row.total_credits) || 0;
-          const bc = Number(b.row.total_credits) || 0;
-          const diff = (ac - bc) * dir;
-          return diff !== 0 ? diff : a.idx - b.idx;
-        })
-        .map(({ row }) => row);
-    }
-    return lbState.rows.slice();
-  }
-  const LB_SORT_HEADERS = {
-    rank: 'lb-sort-rank',
-    drachmae: 'lb-sort-drachmae',
-    karma: 'lb-sort-karma',
-    tokens: 'lb-sort-tokens',
-  };
+  // The Roll’s rows, kept ONLY for leaderboardPlace() below — the Standing
+  // card’s "#N on the leaderboard" stat. sortBy/sortDir went to /roster with
+  // the table (task 1003441); nothing on this page sorts them any more.
+  const lbState = { rows: [] };
   function leaderboardPlace(login) {
     const rows = Array.isArray(lbState.rows) ? lbState.rows : [];
     if (!rows.length || !login) return null;
@@ -1201,53 +1115,7 @@
     const idx = ranked.findIndex((r) => r.github_login === login);
     return idx === -1 ? null : { place: idx + 1, total: ranked.length };
   }
-  function renderLeaderboard() {
-    const rows = sortedLeaderboardRows();
-    // paginate() clamps the page, slices, and paints the whole #lb-* bar.
-    const slice = window.OTBKit.paginate(rows, lbPager);
-    const start = (lbPager.page - 1) * lbPager.perPage;
-    const tbody = $('#leaderboard tbody');
-
-    if (!slice.length) {
-      tbody.innerHTML = emptyRow(6, 'No more builders to show.');
-    } else {
-      tbody.innerHTML = slice.map((b, i) => {
-        const place = start + i + 1;
-        const name = b.display_name || b.github_login || 'unknown builder';
-        const badges = renderAchievementRow(b.achievements);
-        const rank = renderRankBadge(normalizeRank(b.rank));
-        // task 1467: link the name to the builder's public profile page. Guarded
-        // on b.id (the /leaderboard row carries it) so a row without an id degrades
-        // to plain text rather than a broken /profile?id=undefined link.
-        const nameCell = b.id != null
-          ? `<a class="lb-name" href="/profile?id=${encodeURIComponent(b.id)}">${escapeHtml(name)}</a>`
-          : escapeHtml(name);
-        return `
-          <tr>
-            <td class="ledger__num">${place}</td>
-            <td>${nameCell} <span style="color:var(--ink-faint);font-size:0.86rem">@${escapeHtml(b.github_login || '')}</span>${badges}</td>
-            <td class="ledger__rank">${rank}</td>
-            <td class="ledger__drachmae">${fmtNum(b.total_credits)}</td>
-            <td class="ledger__drachmae">${fmtNum(b.karma)}</td>
-            <td class="ledger__drachmae" title="${Number(b.total_credits) > 0 ? `${fmtNum(Math.round(Number(b.tokens_used) / Number(b.total_credits)))} tokens per drachma` : 'no drachmae earned yet'}">${fmtNum(b.tokens_used)}</td>
-          </tr>
-        `;
-      }).join('');
-    }
-
-    // Reflect the active sort on every sortable header. Only one column
-    // shows its arrow at a time; the others reset to "none" — matches the
-    // ARIA-sort spec.
-    for (const [key, headerId] of Object.entries(LB_SORT_HEADERS)) {
-      const head = document.getElementById(headerId);
-      if (!head) continue;
-      const ariaSort = (lbState.sortBy === key && lbState.sortDir)
-        ? (lbState.sortDir === 'asc' ? 'ascending' : 'descending')
-        : 'none';
-      head.setAttribute('aria-sort', ariaSort);
-    }
-  }
 
-    return { LB_SORT_HEADERS, SETUP_CONFIG_KEY, analyticsState, lbPager, lbState, mountHallWidgets, onboardingBox, renderCurveBody, renderLanding, renderLeaderboard, renderNav, renderOnboarding, renderProfile, renderRecentShips, renderWelcomeCore, shipState, shipsPager, welcomeDismissalKey };
+    return { SETUP_CONFIG_KEY, analyticsState, lbState, mountHallWidgets, onboardingBox, renderCurveBody, renderLanding, renderNav, renderOnboarding, renderProfile, renderRecentShips, renderWelcomeCore, shipState, shipsPager, welcomeDismissalKey };
   };
 })();

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

@@ -3,7 +3,7 @@
 // Every widget — core here, module-contributed from a module's own client script —
 // registers into the window.OTB hall-widget registry (dom-utils.js), and builders.js
 // mounts the registered set into the shell's view containers (task 1723 redesign):
-//   view:  'home' | 'standing' | 'leaderboard'  (default 'home')
+//   view:  'home' | 'standing'  (default 'home')
 //   zone:  a finer mount target inside the Home view
 //          ('home-banner' | 'home-stats' | 'home-band' | 'home-main')
 //   group: a finer mount target inside Standing — which rail section this card
@@ -198,19 +198,9 @@
     '<div class="ach-grid" id="ach-grid"><div class="profile__placeholder">…</div></div>',
     { view: 'standing', group: 'achievements', labelledby: 'ach-h' });
 
-  /* ---------------- Leaderboard ---------------- */
-
-  // 8. Leaderboard.
-  w('leaderboard-scroll', 'Leaderboard', 90,
-    '<h2 id="lb-h" class="sr-only">Leaderboard</h2>' +
-    '<table class="ledger" id="leaderboard"><thead><tr>' +
-      '<th>Place</th><th>Builder</th>' +
-      '<th class="ledger__sortable" id="lb-sort-rank" aria-sort="none" title="Sort by rank">Rank</th>' +
-      '<th class="ledger__sortable" id="lb-sort-drachmae" aria-sort="descending" title="Sort by ' + curLabel() + ' (work shipped)" data-currency-label="caps">Credits</th>' +
-      '<th class="ledger__sortable" id="lb-sort-karma" aria-sort="none" title="Sort by karma (peer recognition + approvals)">Karma</th>' +
-      '<th class="ledger__sortable" id="lb-sort-tokens" aria-sort="none" title="Sort by tokens used across recorded sessions — efficiency is tokens ÷ credits (hover a row for tokens-per-drachma)">Tokens</th>' +
-    '</tr></thead><tbody><tr><td colspan="6" class="ledger__empty">…</td></tr></tbody></table>' +
-    // task 2174: OTBKit pager — same #lb-* id prefix as the bar it replaces.
-    window.OTBKit.pagerBarHtml('lb', { label: 'builders' }),
-    { view: 'leaderboard', labelledby: 'lb-h' });
+  // task 1003441: the Leaderboard widget is GONE from this page. It is a real
+  // page now (/roster — roster.html + roster.js), which is what the Community
+  // nav group needed: it used to read as one page plus a link into index.html.
+  // Nothing here declares view:'leaderboard' any more, and dom-utils.js's
+  // HALL_VIEWS no longer accepts it.
 })();

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

@@ -71,9 +71,6 @@
           </div>
         </section>
 
-        <section class="view" id="view-leaderboard" data-view-title="Leaderboard" hidden>
-          <div class="view-zone" id="zone-leaderboard"></div>
-        </section>
       </main>
 
       <footer class="app-foot" id="app-foot"></footer>

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

@@ -7,10 +7,11 @@
   "_feeds": "As work.states.json: the kit's stub is not the hall's feed set, so Home renders its skeletons and empty states here. The populated dashboard is the hall-preview harness.",
   "ignoreRequests": ["/api/(gds|bongos)/me$", "/api/(gds|bongos)/me/", "/api/(gds|bongos)/tasks", "/api/(gds|bongos)/claims", "/api/(gds|bongos)/goals", "/api/(gds|bongos)/inbox", "/api/(gds|bongos)/live", "/api/(gds|bongos)/analytics/", "/api/(gds|bongos)/achievements", "/api/(gds|bongos)/versions", "/api/(gds|bongos)/leaderboard"],
   "ignoreConsole": ["/api/(gds|bongos)/", "\b401\b", "\b404\b", "Unauthorized", "Not Found", "load failed"],
+  "_1003441": "The `leaderboard` state left with the view: the Roll is the /roster page now and #leaderboard REDIRECTS there, so there is no #view-leaderboard on this page to make visible. The redirect is proven in tests/hall_nav.mjs (it asserts location.replace('/roster') fires on the index and nowhere else) rather than by a render state, because a state whose page navigates away measures the destination, not this page. `standing-karma` replaces the coverage: task 2178 made each Standing rail section addressable and none had a measured state.",
   "states": {
-    "home": { "auth": true, "expect": { "visible": ["#view-home"], "hidden": ["#view-standing", "#view-leaderboard"] } },
+    "home": { "auth": true, "expect": { "visible": ["#view-home"], "hidden": ["#view-standing"] } },
     "standing": { "auth": true, "url": "/builders/#standing", "actions": [["wait", 400]], "expect": { "visible": ["#view-standing"] } },
-    "leaderboard": { "auth": true, "url": "/builders/#leaderboard", "actions": [["wait", 400]], "expect": { "visible": ["#view-leaderboard"] } },
+    "standing-karma": { "auth": true, "url": "/builders/#standing-karma", "actions": [["wait", 400]], "expect": { "visible": ["#view-standing"] } },
     "out": { "auth": false }
   },
   "reducedMotion": { "auth": true }

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/profile.js

@@ -555,7 +555,7 @@
       head.innerHTML = `
         <div class="profile__placeholder">
           No builder selected. Open a builder from the
-          <a href="/#leaderboard">leaderboard</a>, or
+          <a href="/roster">roster</a>, or
           <a href="${API}/auth/web/start">sign in</a> to see your own profile.
         </div>`;
     }

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/modules/hall-ui/public/roster.html

@@ -0,0 +1,63 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Builders — {{worldName}}</title>
+  <meta name="description" content="Who builds on this project: the roster, ranked by work shipped, with rank, credits, karma and tokens.">
+  <link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text x='16' y='24' font-size='24' text-anchor='middle' font-family='sans-serif'>⌂</text></svg>">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link rel="stylesheet" href="/builders/style.css?v=2026-07-02-shell1">
+  <!-- task 1003441: the identity cell (avatar, name, login) is shared with the
+       cross-project directory — one definition, both rosters. -->
+  <link rel="stylesheet" href="/builders/people.css">
+</head>
+<body data-page="roster" data-page-title="Builders">
+
+<div class="app">
+  <aside class="app-sidebar" id="app-sidebar" aria-label="Primary"></aside>
+  <div class="app-scrim" id="app-scrim" hidden></div>
+  <div class="app-body">
+    <header class="app-topbar" id="app-topbar"></header>
+    <div class="app-content">
+      <!-- The board page head (task 1003307): the label voice. The sub is
+           rewritten by roster.js once the roster has loaded. -->
+      <div class="page-head page-head--board">
+        <h1 class="page-head__h">Builders</h1>
+        <p class="page-head__sub" id="roster-sub">Who builds on this project, ranked by work shipped. This project's own ledger — unlike the cross-project directory, it lists everyone who builds here.</p>
+      </div>
+
+      <main id="hall-main">
+        <!-- task 1003441: this was the #leaderboard HASH VIEW on the home page,
+             which is why the Community group used to read as one real page plus a
+             link into index.html. It is a page now; /#leaderboard redirects here. -->
+        <section class="scroll" id="roster-scroll" aria-labelledby="roster-h">
+          <h2 id="roster-h" class="scroll__h">The roster<span class="count-pill" id="roster-count" hidden></span></h2>
+          <div id="roster-filters"></div>
+          <div id="roster-body">
+            <div class="profile__placeholder">Loading the roster…</div>
+          </div>
+        </section>
+      </main>
+
+      <footer class="app-foot" id="app-foot"></footer>
+    </div>
+  </div>
+</div>
+
+<div id="toast" class="toast" role="status" aria-live="polite" data-visible="0"></div>
+
+<!-- The app shell (sidebar + top bar). Dependency-free; loaded FIRST so the
+     chrome exists before the page script runs. -->
+<script src="/builders/shell.js?v=2026-07-02-shell1"></script>
+<!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
+<script src="/builders/palette.js" defer></script>
+<!-- shared frontend toolkit (window.OTB — rank labels, number formats) + the
+     branding pack's currency label, loaded BEFORE roster.js. -->
+<script src="/builders/dom-utils.js?v=2026-06-14-domutils"></script>
+<script src="/builders/brand-apply.js"></script>
+<script src="/builders/hall-kit.js"></script>
+<script src="/builders/roster.js"></script>
+</body>
+</html>