@bongos/core 1.21.10 → 1.21.11

package/modules/hall-ui/public/street-inside.js

@@ -0,0 +1,568 @@
+// modules/hall-ui/public/street-inside.js — INSIDE EVERY BUILDING, and inside
+// every district, as data (task 1004526, goal 1000125; R04 of the Governor City).
+//
+// WHAT THIS IS. The two interior views of the reference design,
+// docs/design/mocks/governor-city/Street.dc.html: buildingView() (the building
+// in section: every storey a real floor with its slab, cut walls and glazing,
+// three lamps, a partition with a doorway, a framed sign carrying the floor's
+// symbol, its name and state lettered on the wall, its count and level number;
+// dark empty floors up to the building's capacity; the crown; the lift in its
+// shaft; the annex lot; and the right panel) and districtView() (a goal's work
+// as small buildings on a road, shape the craft, stage the status). The kit
+// pieces are the prototype's, ported verbatim: crown(), workItem(),
+// floorSymbol(), symbolPath() and the section drawing itself.
+// tests/hall_street_inside.mjs holds them equal by running the prototype's own
+// Component class beside this file, on the prototype's own sample floors.
+// The front-on kit (box, gable, sawtooth, light) is street-draw.js's and the
+// decision glyphs city-draw.js's: one copy, never a fork.
+//
+// ONE CHANGE OF INPUT, as on the street. The prototype filled each building
+// from civicInfo(), its sample council, and each district from districtInfo().
+// Here:
+//  * A building's floors are the prototype's floor STRUCTURE (PLAN below: the
+//    same floors, in the same order, at the same capacity, with the names that
+//    are about the government rather than the sample project). A floor the
+//    governor docket (GET /government/docket) already reads is BOUND to it: a
+//    source (its open matters, their count, needs you when one does) or a
+//    reading (its figure and line), or, for Planning's goals, the open goals the
+//    street already holds. Every other floor stands in an honest "not recorded
+//    yet" state: its name, what it holds, no number. Real data for every floor
+//    is task 1004527, which fills these same descriptors (floorFor()).
+//  * Who holds a building and how it decides. The docket does not carry a
+//    holder yet (task 1004529 sets who decides what, per project); until it
+//    does the seat is drawn empty and says so, and the rule is the one the
+//    building's own open matters are decided by, else the design's default,
+//    named as the default. A docket building that carries `holders` / `rule`
+//    is read first (holderOf()).
+//  * On the table here: the docket's matters at this building. Each row opens
+//    the short card (GovStreet.cardFor(); task 1004528 makes it act).
+//  * The record: those same matters filed by the month they were opened, one
+//    drawer a month, newest first.
+//  * The annex lot stands when the building is full, as the prototype's
+//    "growth" lines say it would.
+//  * A district's work is the goal's tasks (GET /tasks?goal_id=N): shape from
+//    the task's discipline, stage from its status, label its kind; up to
+//    MAX_ITEMS stand on the road and the rest are counted, with a link to the
+//    goal. Heights come from the task's estimate, not from a random.
+//
+// PURE. No DOM, no fetch, no clock: street.js passes everything in.
+
+(function (root) {
+  'use strict';
+  const City = root.GovCity || (typeof require === 'function' ? require('./city-draw.js') : null);
+  const S = root.GovStreet || (typeof require === 'function' ? require('./street-draw.js') : null);
+  const push = S.push, rect = S.rect, ellipse = S.ellipse;
+
+  // ---------- the kit pieces (verbatim) ----------
+
+  // The crown caps the section with the building's own silhouette.
+  function crown(out, T, kind, x0, w, top) {
+    const C = T.civic, R = T.roof, Gl = T.glass;
+    const r = (x, y, ww, hh, tone) => push(out, rect(x, y, ww, hh), tone.f, tone.s);
+    if (kind === 'charter') { r(x0 + 60, top - 26, w - 120, 26, C); r(x0 + 130, top - 52, w - 260, 26, C); r(x0 + 175, top - 74, w - 350, 22, Gl); S.light(out, x0 + w / 2, top - 84, 3.5, T.beacon); }
+    else if (kind === 'rules') r(x0 - 12, top - 10, w + 24, 10, R);
+    else if (kind === 'treasury') { r(x0 - 10, top - 10, w + 20, 10, R); r(x0 + 120, top - 32, w - 240, 22, C); }
+    else if (kind === 'planning') S.sawtooth(out, x0, top, w, 6, 22, R, Gl);
+    else if (kind === 'review') { r(x0 + 16, top - 30, w - 32, 30, Gl); r(x0 + 10, top - 34, w - 20, 4, R); }
+    else if (kind === 'release') { r(x0 + 26, top - 64, 26, 64, C); r(x0 + w - 52, top - 64, 26, 64, C); r(x0 + 52, top - 50, w - 104, 12, C); S.light(out, x0 + 39, top - 72, 2.8, T.beacon); S.light(out, x0 + w - 39, top - 72, 2.8, T.beacon); }
+    else if (kind === 'automation') { r(x0 + 40, top - 70, 34, 70, C); r(x0 + w - 130, top - 28, 100, 28, R); S.light(out, x0 + 57, top - 80, 3, T.beacon); }
+    else if (kind === 'people' || kind === 'disputes') { const hr = kind === 'people' ? 54 : 38; push(out, 'M' + (x0 - 8) + ' ' + top + 'L' + (x0 + w / 2) + ' ' + (top - hr) + 'L' + (x0 + w + 8) + ' ' + top + 'Z', R.f, R.s); }
+  }
+
+  // A district work item: shape from the craft, stage from the status.
+  function workItem(out, T, craft, stage, x, w, h) {
+    if (stage === 'backlog') {
+      push(out, 'M' + x + ' 0L' + (x + 7) + ' -7L' + (x + w + 7) + ' -7L' + (x + w) + ' 0Z', 'none', T.ghost.s, '3 3');
+      push(out, 'M' + (x + 3) + ' 0V-16M' + (x + w - 3) + ' 0V-16', 'none', T.ghost.s);
+      return;
+    }
+    if (stage === 'ready') { S.box(out, T, x, 0, w, 6, T.work, { d: 6 }); return; }
+    if (stage === 'being built') { S.box(out, T, x, 0, w, h, T.scaffold, { d: 6, brace: true }); return; }
+    const lit = stage === 'shipped';
+    let top = h;
+    if (craft === 'artist') { const bh = Math.round(h * 0.8); S.box(out, T, x, 0, w, bh, T.work, { d: 6, win: true, lit: lit }); S.sawtooth(out, x, -bh, w, 3, 12, T.roof, T.glass); top = bh + 12; }
+    else if (craft === 'ui') { S.box(out, T, x, 0, w, h, T.glass, { d: 6, grid: 3 }); S.box(out, T, x - 2, 0, w + 4, 4, T.roof, { d: 6, z: h }); top = h + 4; }
+    else if (craft === 'ideator') { S.box(out, T, x, 0, w, 22, T.work, { d: 6, door: true }); S.gable(out, x, -22, w, 14, T.roof); top = 36; }
+    else S.box(out, T, x, 0, w, h, T.work, { d: 6, win: true, lit: lit });
+    if (!lit) {
+      const fx = x + w / 2;
+      push(out, 'M' + fx + ' ' + (-top) + 'V' + (-top - 18), 'none', T.line);
+      push(out, 'M' + fx + ' ' + (-top - 18) + 'h11l-3 4l3 4h-11Z', stage === 'awaiting a tester' ? '#fb9569' : T.line, 'none');
+    }
+  }
+
+  // Every floor carries a sign: one symbol, drawn on a 24-unit grid, that says
+  // what the floor is. PROTO_SYMBOLS is the prototype's map, verbatim; the
+  // floors PLAN names that the sample project did not are added after it, each
+  // to one of the forty symbols of the library (never a new one).
+  const PROTO_SYMBOLS = {
+    '§1 Purpose': 'compass', '§2 Membership': 'door', '§3 The council': 'council', '§4 Rules': 'gavel', '§5 Money': 'coins', '§6 Review': 'magnifier', '§7 Release': 'gate',
+    'Bugs go to the maintenance goal': 'bug', 'Newcomers start on newcomer tasks': 'sprout', 'Payouts every Friday': 'calendar', 'Screenshots on UI work': 'frame', 'Small fixes ship without a vote': 'wrench',
+    'Security report: sign-in limits': 'shield', 'Removal: the old search page': 'removal', 'Appeal: the refund flow grade': 'scales',
+    'The council': 'council', 'Testers': 'badge', 'Builders': 'people', 'Newcomers': 'sprout', 'Waiting to join': 'hourglass',
+    'Hall': 'hall', 'Payments': 'card', 'Onboarding': 'door', 'Modules': 'modules', 'Payouts v2': 'coinhand',
+    'Being tested': 'magnifier', 'Signed off': 'seal', 'Waiting outside': 'hourglass',
+    'Held back': 'pause', 'Core update': 'update', 'Live this month': 'live', 'Ready to go': 'crate',
+    'Builder rewards': 'coinhand', 'AI grading': 'chip', 'Hosting': 'server', 'Reserve': 'safe', 'Second AI reviewer': 'chip',
+    'Founding': 'flag', 'Ideas to ratify': 'bulb', 'Priorities': 'ordered', 'Versions': 'layers', 'Waiting on a decision': 'hourglass',
+    'Ranks': 'ladder', 'Goal teams': 'team', 'Overrides': 'key',
+    'The switch': 'power', 'Allowed goals': 'flag', 'Running now': 'chip', 'Spending limit': 'gauge', 'Reports': 'doc',
+  };
+  const PLAN_SYMBOLS = {
+    'Rules in force': 'gavel', 'New rules': 'wrench', 'Security reports': 'shield', 'Removals': 'removal', 'Grade appeals': 'scales',
+    'Goals': 'flag', 'Promises': 'seal', 'Spending matters': 'coins',
+  };
+  function floorSymbol(name) {
+    return PROTO_SYMBOLS[name] || PLAN_SYMBOLS[name] || 'crate';
+  }
+
+  const SYMBOLS = {
+    compass: ['M21 12a9 9 0 1 1-18 0a9 9 0 1 1 18 0Z M12 5L14.5 12L12 19L9.5 12Z', 'M12 5L14.5 12L9.5 12Z'],
+    door: ['M5 21V3h9v18 M14 5.5l5 2V21 M3 21h18 M11.5 12v1.5', ''],
+    council: ['M3 15h18 M5 15v5 M19 15v5 M9 15v5 M15 15v5', 'M3.4 10.5a1.6 1.6 0 1 0 3.2 0a1.6 1.6 0 1 0-3.2 0Z M6.9 8.5a1.6 1.6 0 1 0 3.2 0a1.6 1.6 0 1 0-3.2 0Z M10.4 7.5a1.6 1.6 0 1 0 3.2 0a1.6 1.6 0 1 0-3.2 0Z M13.9 8.5a1.6 1.6 0 1 0 3.2 0a1.6 1.6 0 1 0-3.2 0Z M17.4 10.5a1.6 1.6 0 1 0 3.2 0a1.6 1.6 0 1 0-3.2 0Z'],
+    gavel: ['M5.5 9.5l5-5 4 4-5 5Z M10.5 11.5L19 20 M3 21h9', ''],
+    coins: ['M3 9a4 1.6 0 1 0 8 0a4 1.6 0 1 0-8 0Z M3 9v8a4 1.6 0 0 0 8 0V9 M3 13a4 1.6 0 0 0 8 0 M13 13a4 1.6 0 1 0 8 0a4 1.6 0 1 0-8 0Z M13 13v4a4 1.6 0 0 0 8 0v-4', ''],
+    magnifier: ['M15.5 10a5.5 5.5 0 1 1-11 0a5.5 5.5 0 1 1 11 0Z M14.2 14.2L20 20 M7.5 10l1.8 1.8 3.2-3.3', ''],
+    gate: ['M4 21V8 M20 21V8 M4 8q8-6.5 16 0 M2 21h20 M8 15h7 M12.5 12l3 3-3 3', ''],
+    bug: ['M8 13.5a4 5 0 1 0 8 0a4 5 0 1 0-8 0Z M12 8.5v10 M8 11.5H4 M8 15.5H4 M16 11.5h4 M16 15.5h4 M10 8l-2-3.5 M14 8l2-3.5', ''],
+    sprout: ['M12 21v-9 M12 12c0-4.5 3-6.5 7.5-6.5 0 4.5-3 6.5-7.5 6.5Z M12 15c0-3.5-2.5-5.5-6.5-5.5 0 3.5 2.5 5.5 6.5 5.5Z M7 21h10', ''],
+    calendar: ['M4 6h16v15H4Z M4 10h16 M8 4v4 M16 4v4', 'M13 15.5a2 2 0 1 0 4 0a2 2 0 1 0-4 0Z'],
+    frame: ['M3 5h18v14H3Z M3 16l5-5 4 4 3-3 6 6', 'M14.5 9a1.5 1.5 0 1 0 3 0a1.5 1.5 0 1 0-3 0Z'],
+    wrench: ['M15 4a5 5 0 0 0-4.6 6.9L4 17.3 6.7 20l6.4-6.4A5 5 0 0 0 20 9l-3 3-3-1-1-3Z', ''],
+    shield: ['M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6Z M8.5 12l2.5 2.5 4.5-4.5', ''],
+    removal: ['M6 3h9l4 4v14H6Z M15 3v4h4 M9.5 12.5l5 5 M14.5 12.5l-5 5', ''],
+    scales: ['M12 4v16 M7 20h10 M4 7h16 M4 7l-2.5 6h5Z M20 7l-2.5 6h5Z', ''],
+    badge: ['M13 20c0-3.5-2.5-6-5-6s-5 2.5-5 6 M14.5 13l2 2 4.5-4.5', 'M5 8a3 3 0 1 0 6 0a3 3 0 1 0-6 0Z'],
+    people: ['M2.5 20c0-3 2-5 4.5-5s4.5 2 4.5 5 M8 20c0-3.5 1.8-6 4-6s4 2.5 4 6 M12.5 20c0-3 2-5 4.5-5s4.5 2 4.5 5', 'M4.8 10a2.2 2.2 0 1 0 4.4 0a2.2 2.2 0 1 0-4.4 0Z M9.8 8.5a2.2 2.2 0 1 0 4.4 0a2.2 2.2 0 1 0-4.4 0Z M14.8 10a2.2 2.2 0 1 0 4.4 0a2.2 2.2 0 1 0-4.4 0Z'],
+    hourglass: ['M6 3h12 M6 21h12 M7 3h10l-5 9 5 9H7l5-9Z', 'M9 6h6l-3 5Z'],
+    hall: ['M3 10l9-6 9 6 M5 10v10 M19 10v10 M3 20h18 M9.5 20v-6h5v6 M8 12h.01 M16 12h.01', ''],
+    card: ['M3 6h18v12H3Z M3 10h18 M6 15h4', ''],
+    modules: ['M4 4h7v7H4Z M13 4h7v7h-7Z M4 13h7v7H4Z M13 13h7v7h-7Z', ''],
+    coinhand: ['M3 15h3.5l4 2h5a1.8 1.8 0 0 0 0-3.6h-4 M3 20h9l8.5-4.5a1.8 1.8 0 0 0-1.8-3L15 14 M15.5 7a3.5 3.5 0 1 1-7 0a3.5 3.5 0 1 1 7 0Z', ''],
+    seal: ['M21 12a9 9 0 1 1-18 0a9 9 0 1 1 18 0Z M8 12.5l3 3 5-6', ''],
+    pause: ['M21 12a9 9 0 1 1-18 0a9 9 0 1 1 18 0Z M10 8.5v7 M14 8.5v7', ''],
+    update: ['M4 8.5l8-4.5 8 4.5v9L12 22l-8-4.5Z M12 9v7.5 M9 13.5l3 3 3-3', ''],
+    live: ['M8.5 8.5a5 5 0 0 0 0 7 M15.5 8.5a5 5 0 0 1 0 7 M5.5 5.5a9.2 9.2 0 0 0 0 13 M18.5 5.5a9.2 9.2 0 0 1 0 13', 'M10.2 12a1.8 1.8 0 1 0 3.6 0a1.8 1.8 0 1 0-3.6 0Z'],
+    crate: ['M4 9h16v11H4Z M3 5.5h18V9H3Z M10 13h4', ''],
+    chip: ['M7 7h10v10H7Z M10 10h4v4h-4Z M9.5 4v3 M14.5 4v3 M9.5 17v3 M14.5 17v3 M4 9.5h3 M4 14.5h3 M17 9.5h3 M17 14.5h3', ''],
+    server: ['M4 4h16v6H4Z M4 14h16v6H4Z M11 7h6 M11 17h6', 'M6.3 7a1 1 0 1 0 2 0a1 1 0 1 0-2 0Z M6.3 17a1 1 0 1 0 2 0a1 1 0 1 0-2 0Z'],
+    safe: ['M4 4h16v15H4Z M15 11.5a3 3 0 1 1-6 0a3 3 0 1 1 6 0Z M12 8.5v1.2 M12 13.3v1.2 M6 19v2 M18 19v2', ''],
+    flag: ['M5 21V3.5 M5 4h12l-2.5 4.5L17 13H5', ''],
+    bulb: ['M9 17h6 M10 20.5h4 M12 3a6 6 0 0 0-3.6 10.8c.6.5 1 1.3 1 2.2h5.2c0-.9.4-1.7 1-2.2A6 6 0 0 0 12 3Z', ''],
+    ordered: ['M10 6h10 M10 12h10 M10 18h10 M4 5l1.5-1V8 M3.5 11.2a1.3 1.3 0 0 1 2.4.6c0 .9-2.4 2-2.4 2.7h2.6 M3.6 16.5h2.2l-1.2 1.3a1.1 1.1 0 1 1-1 1.7', ''],
+    layers: ['M12 3l9 4.5-9 4.5-9-4.5Z M3 12l9 4.5 9-4.5 M3 16.5L12 21l9-4.5', ''],
+    ladder: ['M7 3v18 M17 3v18 M7 7h10 M7 11.5h10 M7 16h10', 'M10.5 2.5h3l-1.5-2Z'],
+    team: ['M4 20c0-3 2-5 4.5-5s4.5 2 4.5 5 M14 14.5c2.6 0 4.5 2 4.5 5 M16.5 9.5', 'M6 9.5a2.5 2.5 0 1 0 5 0a2.5 2.5 0 1 0-5 0Z M14 8.5a2.2 2.2 0 1 0 4.4 0a2.2 2.2 0 1 0-4.4 0Z'],
+    key: ['M14.5 9.5a4.5 4.5 0 1 1-9 0a4.5 4.5 0 1 1 9 0Z M13 13l7.5 7.5 M17 17l2-2 M19 19.5l1.5-1.5', ''],
+    power: ['M12 3v8 M7 6.3a7.5 7.5 0 1 0 10 0', ''],
+    gauge: ['M3.5 17a8.5 8.5 0 1 1 17 0 M12 17l4.5-6 M3.5 17h17', ''],
+    doc: ['M6 3h9l4 4v14H6Z M15 3v4h4 M9 11h7 M9 14.5h7 M9 18h4', ''],
+  };
+  function symbolPath(name) {
+    const p = SYMBOLS[name] || SYMBOLS.crate;
+    return { d: p[0], f: p[1] };
+  }
+
+  // A floor that is not recorded yet, switched off, or could not be read is
+  // lettered faint, like the prototype's proposed floors, and says which on the
+  // wall where a count would stand.
+  const QUIET = Object.freeze({ proposed: '', coming: 'not recorded yet', off: 'switched off', unavailable: 'not read', not_yours: 'not yours' });
+
+  // ---------- the building in section (Street.dc.html buildingView) ----------
+  //   T    GovStreet.theme(mode)
+  //   key  one of the nine civic keys
+  //   b    the building, in civicInfo()'s shape: { group, name, holds, seats,
+  //        who, rule, how, cap, growth, floors: [{ name, line, count, status,
+  //        lines }], record: [{ label, items }], onFile, table: [rows], annex }
+  //   st   { floor, drawer, picks, vacant, reviewHeld, evening }
+  // Everything the prototype's template binds, as data, plus `selFloor` and
+  // `selDrawer`. The geometry is the prototype's to the pixel.
+  function buildingView(T, key, b, st) {
+    st = st || {};
+    const vacant = !!st.vacant;
+    const dark = T.bg === '#000000';
+    const X = 130, W = 460, FH = 52, GY = 676;
+    const occ = b.floors.length, cap = Math.max(b.cap, occ), top = GY - cap * FH;
+    const firstPending = b.floors.findIndex((f) => f.status === 'pending' || f.status === 'proposed');
+    const pick = st.floor === null || st.floor === undefined ? null : Number(st.floor);
+    const selFloor = pick === null || !isFinite(pick) ? (firstPending >= 0 ? firstPending : occ - 1) : Math.max(0, Math.min(pick, occ - 1));
+    const M2 = dark
+      ? { slab: '#4a4a52', wall: '#2c2c32', room: '#121215', roomLit: '#2b2219', lamp: '#55565a', lampLit: '#ffd9a8', glow: 'rgba(255,217,168,0.10)', pane: 'rgba(150,170,255,0.22)', paneLit: 'rgba(255,214,170,0.55)', kit: 'rgba(255,255,255,0.34)', kitFill: 'rgba(255,255,255,0.05)', name: '#ffffff', line: '#c0c0c0', faint: '#8e8e93' }
+      : { slab: '#b9b8be', wall: '#e2e1e5', room: '#f8f7f9', roomLit: '#fdf0e2', lamp: '#a9a8ad', lampLit: '#f0a86a', glow: 'rgba(240,168,106,0.12)', pane: 'rgba(91,111,208,0.20)', paneLit: 'rgba(240,168,106,0.45)', kit: 'rgba(23,24,26,0.40)', kitFill: 'rgba(23,24,26,0.05)', name: '#17181a', line: '#55565a', faint: '#65656a' };
+    if (key === 'review' && st.reviewHeld) { M2.room = dark ? '#121722' : '#f1f3fb'; M2.pane = dark ? 'rgba(150,170,255,0.35)' : 'rgba(91,111,208,0.30)'; }
+    const shapes = [], texts = [], syms = [];
+    const sans = "Manrope, 'Segoe UI', system-ui, sans-serif", mono = "'JetBrains Mono', ui-monospace, Consolas, monospace";
+    const txt = (x, y, v, c, s, w, a, f, ls) => texts.push({ key: 't' + texts.length, x: Math.round(x), y: Math.round(y), v: v, c: c, s: s, w: w || 400, a: a || 'start', f: f || sans, ls: ls || 'normal' });
+    const cut = (s, n) => s.length > n ? s.slice(0, n - 1) + '…' : s;
+    const ghost = vacant, dash = ghost ? '4 4' : 'none';
+    const fillOr = (c) => ghost ? 'none' : c, line = ghost ? T.ghost.s : 'none';
+    push(shapes, 'M0 ' + GY + 'H800', 'none', T.line);
+    push(shapes, rect(X - 10, GY, W + 20, 8), fillOr(M2.slab), line, dash);
+    if (!ghost) {
+      push(shapes, 'M' + (X + W) + ' ' + top + 'L' + (X + W + 16) + ' ' + (top - 16) + 'L' + (X + W + 16) + ' ' + (GY - 16) + 'L' + (X + W) + ' ' + GY + 'Z', T.civic.r, T.civic.s);
+      crown(shapes, T, key, X, W, top);
+    }
+    for (let i = 0; i < cap; i++) {
+      const y0 = GY - (i + 1) * FH, y1 = y0 + FH, fl = b.floors[i];
+      const used = !!fl, sel = used && i === selFloor;
+      const pend = used && fl.status === 'pending';
+      const prop = used && (fl.status === 'proposed' || QUIET[fl.status] !== undefined);
+      const lit = sel || (used && st.evening);
+      push(shapes, rect(X - 6, y1 - 5, W + 12, 5), fillOr(M2.slab), line, dash);
+      push(shapes, rect(X + 9, y0, W - 18, FH - 5), fillOr(lit ? M2.roomLit : M2.room), line, dash);
+      [X, X + W - 9].forEach((wx) => {
+        push(shapes, rect(wx, y0, 9, FH - 5), fillOr(M2.wall), line, dash);
+        if (!ghost) push(shapes, rect(wx + 3, y0 + 9, 3, FH - 23), lit ? M2.paneLit : M2.pane, 'none');
+      });
+      if (i === 0 && !ghost) push(shapes, rect(X, y1 - 33, 9, 28), lit ? M2.roomLit : M2.room, 'none');
+      txt(X - 50, y0 + 30, String(i + 1).padStart(2, '0'), sel ? T.accentText : M2.faint, 11, 400, 'end', mono, '0.08em');
+      if (!used) {
+        if (!ghost) txt(X + 24, y0 + 30, 'empty floor', M2.faint, 12.5, 400);
+        continue;
+      }
+      const px = Math.round(X + W * 0.62);
+      push(shapes, 'M' + px + ' ' + y0 + 'V' + (y1 - 25), 'none', ghost ? T.ghost.s : M2.kit, dash);
+      [0.2, 0.45, 0.8].forEach((f) => {
+        const lx = Math.round(X + W * f);
+        push(shapes, 'M' + lx + ' ' + y0 + 'V' + (y0 + 7), 'none', ghost ? T.ghost.s : M2.kit);
+        push(shapes, ellipse(lx, y0 + 9, 2.4, 2.4), lit ? M2.lampLit : M2.lamp, 'none');
+        if (lit) push(shapes, ellipse(lx, y0 + 12, 12, 7), M2.glow, 'none');
+      });
+      // the floor's sign: a plate on the wall carrying the one symbol that says what this floor is
+      const sx0 = px + 16, sy0 = y0 + 5;
+      push(shapes, rect(sx0 - 4, sy0 - 1, 44, 40), ghost ? 'none' : M2.wall, ghost ? T.ghost.s : M2.kit, dash);
+      const sp = symbolPath(floorSymbol(fl.name));
+      syms.push({ key: 's' + i, x: sx0 + 2, y: sy0 + 2, k: 1.333, d: sp.d, f: sp.f, c: sel ? '#fb9569' : pend ? T.accentText : (ghost || prop ? M2.faint : M2.line), w: sel ? 1.9 : 1.5 });
+      if (pend) push(shapes, rect(X + 11, y0 + 2, W - 22, FH - 9), 'none', '#fb9569', '4 4');
+      txt(X + 24, y0 + 24, cut(fl.name, 34), ghost || prop ? M2.faint : M2.name, 14.5, 500);
+      txt(X + 24, y0 + 40, cut(fl.line, 44), pend ? T.accentText : M2.line, 12, 400);
+      if (fl.count) txt(X + W - 22, y0 + 34, fl.count, M2.name, 20, 300, 'end', sans, '-0.02em');
+      else if (pend) txt(X + W - 22, y0 + 32, 'being decided', T.accentText, 11.5, 500, 'end');
+      else if (QUIET[fl.status]) txt(X + W - 22, y0 + 32, QUIET[fl.status], M2.faint, 11.5, 400, 'end');
+    }
+    // the chosen floor gets a frame, and a lift runs in its shaft beside the building to meet it
+    if (b.floors[selFloor]) push(shapes, rect(X - 3, GY - (selFloor + 1) * FH - 2, W + 6, FH - 1), 'none', '#fb9569', 'none', 1.5);
+    push(shapes, rect(X - 40, top, 22, cap * FH), 'none', ghost ? T.ghost.s : M2.kit, ghost ? '4 4' : 'none');
+    let rungs = '';
+    for (let i = 1; i < cap; i++) rungs += 'M' + (X - 40) + ' ' + (GY - i * FH) + 'h22';
+    push(shapes, rungs, 'none', M2.kit, '2 3');
+    const floors = b.floors.map((f, i) => ({ key: f.name, index: i, x: X, y: GY - (i + 1) * FH, w: W, h: FH - 5, aria: 'Open ' + f.name, selected: i === selFloor }));
+    const record = Array.isArray(b.record) ? b.record : [];
+    const selDrawer = record.length ? Math.max(0, Math.min(st.drawer === null || st.drawer === undefined ? 0 : Number(st.drawer) || 0, record.length - 1)) : -1;
+    const seatOf = (s) => s === 'you'
+      ? { key: s, init: 'you', bg: 'transparent', fg: T.accentText, border: '2px solid #fb9569' }
+      : s === '—' ? { key: s, init: '', bg: 'transparent', fg: T.faint, border: '1px dashed ' + T.seatOpen }
+        : { key: s, init: s, bg: T.seatFor.bg, fg: T.seatFor.fg, border: 'none' };
+    const g = City.glyph(b.rule, 9, 9, 16);
+    const pct = Math.round(occ / cap * 100);
+    const table = Array.isArray(b.table) ? b.table : [];
+    const f = b.floors[selFloor];
+    const quietWord = f && QUIET[f.status] !== undefined ? ' · ' + (f.status === 'proposed' ? 'proposed' : QUIET[f.status]) : '';
+    return {
+      kicker: b.group + ' · ' + b.name.toLowerCase(), name: b.name, holds: b.holds,
+      seats: b.seats.map(seatOf), whoText: b.who, gf: g.fill, gl: g.line, howText: b.how,
+      fill: pct, fillColor: pct >= 80 ? '#fb9569' : T.line,
+      growth: (vacant ? 'Not built yet. ' : occ + ' of ' + cap + ' floors in use. ') + b.growth,
+      hasTable: table.length > 0, table: table,
+      openKicker: 'floor ' + (selFloor + 1) + (f && f.status === 'pending' ? ' · being decided' : quietWord),
+      sym: f ? Object.assign(symbolPath(floorSymbol(f.name)), { c: '#fb9569' }) : { d: '', f: '', c: 'none' },
+      flipA: ((st.picks || 0) % 2) === 0, flipB: ((st.picks || 0) % 2) === 1,
+      openTitle: f ? f.name : '', openLines: f ? f.lines.map((l, i) => ({ key: 'l' + i, text: l[0], meta: l[1] })) : [],
+      drawers: record.map((r, i) => ({ key: r.label, index: i, label: r.label, count: r.items.length, aria: 'Open the ' + r.label + ' drawer', selected: i === selDrawer, bg: i === selDrawer ? T.wash : 'transparent', border: i === selDrawer ? T.ink : T.ruleStrong, handle: i === selDrawer ? T.ink : T.ruleStrong, color: T.ink })),
+      drawerItems: selDrawer >= 0 ? record[selDrawer].items.map((it, i) => ({ key: 'r' + i, text: it[0], meta: it[1] })) : [],
+      onFile: b.onFile, shapes: shapes, texts: texts, syms: syms, floors: floors,
+      lift: { x: X - 38, y: GY - FH + 6, ty: -(selFloor * FH), h: FH - 16 },
+      hasAnnex: !!b.annex, annex: b.annex ? { x: 628, y: GY - 156, w: 160, h: 156, text: b.annex } : { x: 0, y: 0, w: 0, h: 0, text: '' },
+      selFloor: selFloor, selDrawer: selDrawer, cap: cap, occ: occ,
+    };
+  }
+
+  // ---------- inside a district (Street.dc.html districtView) ----------
+  //   d  { name, line, items: [[name, kind, craft, stage, h, label?]] }
+  // `stage` is the drawing stage in the prototype's words ('backlog', 'ready',
+  // 'being built', 'shipped', or a check it waits on); `label`, when given, is
+  // the pill's words for a status the prototype did not name.
+  function districtView(T, key, d) {
+    const shapes = [];
+    const iw = 40, gap = 46, s = 1.6, GY = 520;
+    let x = 0;
+    const placed = d.items.map((it) => {
+      workItem(shapes, T, it[2], it[3], x, iw, it[4]);
+      const p = { lx: x, name: it[0], kind: it[1], craft: it[2], stage: it[5] || it[3], draw: it[3], href: it[6] || null };
+      x += iw + gap;
+      return p;
+    });
+    const tx = Math.round((1440 - (x - gap) * s) / 2);
+    return {
+      kicker: 'the work · ' + key, name: d.name, line: d.line,
+      road: rect(32, GY, 1376, 26), ground: 'M32 ' + GY + 'H1408', tx: tx, ty: GY, s: s, shapes: shapes,
+      items: placed.map((p) => ({
+        key: p.name, x: Math.round(tx + p.lx * s + iw * s / 2 - 62), y: GY + 36, w: 124, name: p.name, meta: p.kind + ' · ' + p.craft, stage: p.stage, href: p.href,
+        stageColor: p.draw === 'awaiting a tester' ? T.accentText : p.draw === 'shipped' ? T.ink : T.soft,
+        stageEdge: p.draw === 'awaiting a tester' ? 'rgba(251,149,105,0.6)' : T.ruleStrong,
+      })),
+      legend: [
+        { key: 'a', text: 'Shape is the craft: tower for engineer, studio roof for artist, glass front for UI, a small pavilion for ideator.' },
+        { key: 'b', text: 'Stage is the status: staked plot, slab, scaffold, built, then lit once shipped. A flag means it waits on a check.' },
+      ],
+    };
+  }
+
+  // ---------- the real buildings (see the header) ----------
+
+  // The prototype's words for each building that are about the government, not
+  // its sample project: what it holds, the rule the design gives it, its
+  // capacity, its growth line and its annex.
+  const GROUPS = Object.freeze({ charter: 'how we decide', rules: 'how we decide', disputes: 'how we decide', people: 'who and what', planning: 'who and what', automation: 'the work', review: 'checks and going live', release: 'checks and going live', treasury: 'money' });
+  const RULE_WORDS = Object.freeze({ decide: 'one person decides', first: 'first yes wins', consent: 'passes unless someone objects', majority: 'more than half must say yes', unanimous: 'everyone has to agree', signoff: 'signed off by someone who did not build it', rule: 'settled by a rule' });
+
+  // A floor: [name, what it holds, binding]. A binding is { source }, { reading }
+  // or { goals: true }; no binding is a floor not recorded yet.
+  const PLAN = Object.freeze({
+    charter: {
+      holds: 'The form of government. Seven sections say who holds each building and how it decides.', rule: 'unanimous', cap: 9,
+      growth: 'Room for more sections before the charter needs a second volume.', annex: 'room for a second volume',
+      floors: [['Founding', 'the starting government'], ['§1 Purpose', 'what this project is for'], ['§2 Membership', 'who belongs, and how they join'], ['§3 The council', 'who sits on the council'], ['§4 Rules', 'how a rule passes'], ['§5 Money', 'who may spend, and how much'], ['§6 Review', 'who signs off finished work'], ['§7 Release', 'who puts work live']],
+    },
+    rules: {
+      holds: 'Standing rules. Each one settles a kind of matter so the council never votes on it again.', rule: 'majority', cap: 8,
+      growth: 'When the hall fills, the council can open an annex for one area, such as money rules.', annex: 'room for an annex, such as money rules',
+      floors: [['Rules in force', 'the rules settling matters now', { reading: 'rules' }], ['New rules', 'a rule put to the council', { source: 'standing_rules' }]],
+    },
+    disputes: {
+      holds: 'Grade appeals, removal requests and security reports. Every ruling becomes precedent for the next one.', rule: 'decide', cap: 5,
+      growth: 'Busy weeks go to a panel of three once a second room is built.', annex: 'room for a second room, a panel of three',
+      floors: [['Security reports', 'flaws found in our own walls', { source: 'redteam_reports' }], ['Removals', 'work proposed for removal', { source: 'removal_proposals' }], ['Grade appeals', 'a grade someone asks to change', { source: 'grade_appeals' }]],
+    },
+    people: {
+      holds: 'Who belongs, the rank each person holds, and who sits in which seat.', rule: 'consent', cap: 8,
+      growth: 'A new floor opens whenever the charter creates a new seat.', annex: 'room for an annex of seats',
+      floors: [['The council', 'who sits, and for how long'], ['Testers', 'who signs off finished work'], ['Builders', 'who builds here', { reading: 'people' }], ['Newcomers', 'builders on newcomer tasks'], ['Waiting to join', 'asked to join the project', { source: 'access_requests' }], ['Ranks', 'the ranks, and who holds each'], ['Goal teams', 'asked to join a goal team', { source: 'goal_join_requests' }]],
+    },
+    planning: {
+      holds: 'Goals, and the promises that say when each one is done. Kept promises are what the project owes its users.', rule: 'majority', cap: 9,
+      growth: 'When it fills, the next new goal opens a second planning office.', annex: 'room for a second planning office',
+      floors: [['Goals', 'the open goals', { goals: true }], ['Promises', 'what the goals say they deliver', { reading: 'promises' }], ['Ideas to ratify', 'full ideas waiting for a vote'], ['Priorities', 'the order goals are worked in'], ['Versions', 'what each version holds'], ['Waiting on a decision', 'blockers holding work', { source: 'blockers' }]],
+    },
+    automation: {
+      holds: 'AI builders working on their own. You choose which goals they may build and how much they may spend, and you can stop them at any time.', rule: 'decide', cap: 6,
+      growth: 'A new floor opens for each goal you let it build.', annex: 'room for an annex',
+      floors: [['The switch', 'unattended building, on or off', { source: 'autobongos_fence' }], ['Allowed goals', 'the goals it may build'], ['Running now', 'builds in progress'], ['Spending limit', 'what it may spend a day'], ['Reports', 'what it did, told without asking']],
+    },
+    review: {
+      holds: 'Testing finished work and signing it off. Work does not count until someone who did not build it says it works.', rule: 'signoff', cap: 5,
+      growth: 'When one queue of testers is not enough, an annex can take design reviews.', vacantGrowth: 'Nothing is built here until the charter says who holds the seat.', annex: 'room for an annex, such as design review',
+      floors: [['Testers', 'who signs off finished work'], ['Waiting outside', 'finished work waiting for a tester', { source: 'criteria_uat' }], ['Signed off', 'work a tester has signed off']],
+    },
+    release: {
+      holds: 'Putting finished work live, and taking updates to Bongos itself.', rule: 'decide', cap: 7,
+      growth: 'Room for a second gate if releases are ever split by area.', annex: 'room for a second gate',
+      floors: [['Overrides', 'past a failed check or grade', { source: 'override_requests' }], ['Modules', 'listed modules, and their re-checks', { source: 'module_rechecks' }], ['Held back', 'work held from going live'], ['Core update', 'a new version of Bongos', { source: 'core_update' }], ['Live this month', 'what went live'], ['Ready to go', 'signed off, waiting to go live', { source: 'gate_approvals' }]],
+    },
+    treasury: {
+      holds: 'The budget, and who gets paid for what.', rule: 'majority', cap: 7,
+      growth: 'Each new spending line takes a floor.', annex: 'room for an annex of spending lines',
+      floors: [['Builder rewards', 'paid for shipped work'], ['AI grading', 'the reviewer that grades every ship'], ['Hosting', 'servers and storage'], ['Reserve', 'what is left this month', { reading: 'money' }], ['Spending matters', 'spending put to a vote', { source: 'treasury_spending' }]],
+    },
+  });
+  const MONTHS = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
+  const STATE_WORDS = Object.freeze({ needs: 'needs you', moving: 'moving', settled: 'settled' });
+  const MAX_LINES = 4;
+
+  function stateOf(m) { return m && (m.state === 'needs' || m.state === 'moving' || m.state === 'settled') ? m.state : 'moving'; }
+  function matterMeta(m, now) {
+    const when = S.whenWord(m.deadline, now);
+    return STATE_WORDS[stateOf(m)] + (when ? ' · ' + when : '');
+  }
+  function countLine(ms) {
+    const n = { needs: 0, moving: 0, settled: 0 };
+    ms.forEach((m) => { n[stateOf(m)] += 1; });
+    if (n.needs) return n.needs + (n.needs === 1 ? ' needs you' : ' need you');
+    if (n.moving) return n.moving + ' moving';
+    if (n.settled) return n.settled + ' settled';
+    return 'nothing open';
+  }
+  // The short figure a reading stands on its floor: '12 builders' → '12'.
+  function shortFigure(figure) {
+    const m = /^[$]?[0-9][0-9,.]*/.exec(String(figure || ''));
+    return m ? m[0] : '';
+  }
+  function F(name, line, count, status, lines) { return { name: name, line: line, count: count, status: status || 'ok', lines: lines || [] }; }
+
+  // One floor of the PLAN, read against the docket. A floor nothing reads yet
+  // keeps its name and what it holds, and says it is not recorded.
+  function floorFor(spec, ctx) {
+    const name = spec[0], what = spec[1], bind = spec[2] || null;
+    const docket = ctx.docket, now = ctx.now;
+    if (!bind) return F(name, what, '', 'coming', [['What this floor holds is not recorded in Bongos yet.', 'coming']]);
+    if (!docket) return F(name, what, '', 'unavailable', [['The docket could not be read just now.', '']]);
+    if (bind.goals) {
+      const goals = ctx.goals || [];
+      const lines = goals.slice(0, MAX_LINES).map((g) => [String(g.title || 'Goal ' + g.id), 'open']);
+      if (goals.length > MAX_LINES) lines.push(['and ' + (goals.length - MAX_LINES) + ' more on the goals page', '']);
+      return F(name, goals.length ? goals.length + (goals.length === 1 ? ' goal open' : ' goals open') : 'no goal open', String(goals.length), 'ok', lines.length ? lines : [['No goal is open.', '']]);
+    }
+    if (bind.reading) {
+      const r = (Array.isArray(docket.readings) ? docket.readings : []).find((x) => x && x.key === bind.reading);
+      if (!r) return F(name, what, '', 'unavailable', [['This reading could not be read just now.', '']]);
+      if (r.status === 'live') return F(name, String(r.line || what), shortFigure(r.figure), r.hot ? 'pending' : 'ok', [[String(r.line || what), String(r.figure || '')]]);
+      return quietFloor(name, what, r.status, r.reason);
+    }
+    const src = (Array.isArray(docket.sources) ? docket.sources : []).find((x) => x && x.source === bind.source);
+    if (!src) return F(name, what, '', 'unavailable', [['This could not be read just now.', '']]);
+    if (src.status !== 'live') return quietFloor(name, what, src.status, src.reason);
+    const ms = (docket.matters || []).filter((m) => m && m.source === bind.source && (!ctx.key || m.building === ctx.key));
+    const lines = ms.slice(0, MAX_LINES).map((m) => [String(m.title || m.short || ''), matterMeta(m, now)]);
+    if (ms.length > MAX_LINES) lines.push(['and ' + (ms.length - MAX_LINES) + ' more', '']);
+        return F(name, countLine(ms), String(ms.length), ms.some((m) => stateOf(m) === 'needs') ? 'pending' : 'ok', lines.length ? lines : [['Nothing open here.', '']]);
+  }
+  function quietFloor(name, what, status, reason) {
+    if (status === 'not_yours') return F(name, what, '', 'not_yours', [['This is not yours to read here.', '']]);
+    if (status === 'off') return F(name, what, '', 'off', [[String(reason || 'The module that holds this is not enabled here.'), 'off']]);
+    if (status === 'coming') return F(name, what, '', 'coming', [[String(reason || 'This is not recorded in Bongos yet.'), 'coming']]);
+    return F(name, what, '', 'unavailable', [[String(reason || 'It could not be read just now.'), '']]);
+  }
+
+  // Who holds the building and how it decides. A docket building that names
+  // its holders (task 1004529) is read first; otherwise the seat is empty and
+  // says so, and the rule is its matters' own, else the design's default (and
+  // the words say 'by default', so a default is never read as a decision).
+  function holderOf(key, info, matters) {
+    const plan = PLAN[key];
+    const holders = info && Array.isArray(info.holders) ? info.holders.filter((h) => h && (h.name || h.login)) : [];
+    const seats = holders.length ? holders.slice(0, 5).map((h) => String(h.name || h.login).charAt(0).toUpperCase()) : ['—'];
+    const who = info && info.who ? String(info.who) : holders.length ? holders.map((h) => String(h.name || h.login)).join(', ') : 'who holds it is not set on this project yet';
+    const fromMatter = matters.find((m) => m && RULE_WORDS[m.rule]);
+    const rule = info && RULE_WORDS[info.rule] ? info.rule : fromMatter ? fromMatter.rule : plan.rule;
+    const how = RULE_WORDS[rule] + (info && RULE_WORDS[info.rule] ? '' : fromMatter ? '' : ' · by default');
+    return { seats: seats, who: who, rule: rule, how: how };
+  }
+
+  // The record: the building's matters filed by the month each was opened.
+  function recordOf(matters, now) {
+    const by = new Map();
+    matters.forEach((m) => {
+      const t = m.opened_at ? new Date(m.opened_at) : null;
+      const ok = t && !isNaN(t.getTime());
+      const k = ok ? t.getUTCFullYear() * 12 + t.getUTCMonth() : -1;
+      if (!by.has(k)) by.set(k, []);
+      by.get(k).push([String(m.title || m.short || ''), STATE_WORDS[stateOf(m)]]);
+    });
+    const thisYear = new Date(now || 0).getUTCFullYear();
+    return [...by.keys()].sort((a, b) => b - a).map((k) => ({
+      label: k < 0 ? 'undated' : MONTHS[k % 12] + (Math.floor(k / 12) === thisYear ? '' : ' ' + String(Math.floor(k / 12)).slice(2)),
+      items: by.get(k),
+    }));
+  }
+
+  // The whole building as civicInfo() shaped it, from the real feeds.
+  //   ctx { docket, goals (open), now }
+  function civicInfo(key, ctx) {
+    const plan = PLAN[key];
+    if (!plan) return null;
+    const docket = ctx && ctx.docket && Array.isArray(ctx.docket.matters) ? ctx.docket : null;
+    const c = { key: key, docket: docket, goals: (ctx && ctx.goals) || [], now: (ctx && ctx.now) || 0 };
+    const matters = docket ? docket.matters.filter((m) => m && m.building === key) : [];
+    const info = docket && Array.isArray(docket.buildings) ? docket.buildings.find((b) => b && b.key === key) : null;
+    const h = holderOf(key, info, matters);
+    const vacant = key === 'review' && !S.reviewHeldOf(docket);
+    const floors = plan.floors.map((spec) => floorFor(spec, c));
+    const order = { needs: 0, moving: 1, settled: 2 };
+    const table = matters.slice().sort((a, b) => order[stateOf(a)] - order[stateOf(b)]).map((m) => {
+      const s = stateOf(m), when = S.whenWord(m.deadline, c.now);
+      return { key: String(m.id), matter: String(m.id), label: String(m.title || m.short || ''), status: s === 'needs' ? 'needs you' + (when ? ' · ' + when : '') : s === 'moving' ? 'moving' + (when ? ' · ' + when : '') : (when || 'settled'), state: s, color: s === 'needs' ? 'accent' : 'ink' };
+    });
+    const record = recordOf(matters, c.now);
+    return {
+      key: key, group: GROUPS[key], name: info && info.name ? String(info.name) : key.charAt(0).toUpperCase() + key.slice(1), holds: plan.holds,
+      seats: h.seats, who: h.who, rule: h.rule, how: h.how, cap: plan.cap,
+      growth: vacant ? plan.vacantGrowth : plan.growth,
+      floors: floors, record: record,
+      onFile: !docket ? 'the docket could not be read just now' : matters.length ? matters.length + (matters.length === 1 ? ' matter' : ' matters') + ' on the docket' : 'nothing on file yet',
+      table: table, annex: !vacant && floors.length >= plan.cap ? plan.annex : null, vacant: vacant,
+    };
+  }
+
+  // The building interior as data: civicInfo() drawn by buildingView().
+  //   input { key, docket, goals, mode, now, floor, drawer, picks }
+  function buildingModel(input) {
+    const o = input || {};
+    if (S.CIVIC_KEYS.indexOf(o.key) < 0) return null;
+    const mode = o.mode === 'light' ? 'light' : 'dark';
+    const T = S.theme(mode);
+    const goals = (Array.isArray(o.goals) ? o.goals : []).filter((g) => g && g.status === 'open');
+    const b = civicInfo(o.key, { docket: o.docket, goals: goals, now: o.now });
+    const docket = o.docket && Array.isArray(o.docket.matters) ? o.docket : null;
+    const evening = !!docket && !(docket.counts && Number(docket.counts.needs) > 0);
+    const bv = buildingView(T, o.key, b, { floor: o.floor, drawer: o.drawer, picks: o.picks, vacant: b.vacant, reviewHeld: !b.vacant, evening: evening });
+    bv.table = bv.table.map((r) => Object.assign({}, r, { color: r.color === 'accent' ? T.accentText : T.ink }));
+    bv.key = o.key; bv.mode = mode; bv.vacant = b.vacant;
+    bv.label = b.name + ' in section: ' + b.floors.length + ' of ' + bv.cap + ' floors in use' + (bv.hasTable ? ', ' + bv.table.length + ' on the table' : '') + '.';
+    return bv;
+  }
+
+  // ---------- the real districts ----------
+  const CRAFTS = Object.freeze(['engineer', 'artist', 'ui', 'ideator']);
+  // A task's status as the prototype's construction stage: [drawing stage, pill words].
+  const STAGES = Object.freeze({
+    shipped: ['shipped', 'shipped'], confirmed: ['graded · landing', 'graded · landing'], completed: ['being graded', 'being graded'],
+    active: ['being built', 'being built'], ready: ['ready', 'ready'], blocked: ['backlog', 'blocked'], backlog: ['backlog', 'backlog'],
+  });
+  const PIPELINE = Object.freeze(['shipped', 'confirmed', 'completed', 'active', 'ready', 'blocked', 'backlog']);
+  const PRIORITY = Object.freeze(['active', 'completed', 'confirmed', 'ready', 'blocked', 'shipped', 'backlog']);
+  const MAX_ITEMS = 10;
+
+  function taskHeight(t) {
+    const est = Number(t && (t.est_minutes_calibrated || t.est_minutes)) || 60;
+    return Math.max(40, Math.min(120, 36 + Math.round(est / 6)));
+  }
+
+  // A goal's work as districtInfo() shaped it.
+  //   goal   { id, title } (or null when it is not one of the open goals)
+  //   tasks  GET /tasks?goal_id=N tasks[], null while reading, false when it failed
+  function districtInfo(goalId, goal, tasks) {
+    const id = String(goalId);
+    const name = goal && goal.title ? String(goal.title) : 'Goal ' + id;
+    if (tasks === null || tasks === undefined) return { name: name, line: 'reading the goal’s work', items: [], more: 0, total: 0 };
+    if (tasks === false) return { name: name, line: 'the goal’s work could not be read just now', items: [], more: 0, total: 0 };
+    const mine = tasks.filter((t) => t && String(t.goal_id) === id && STAGES[t.status]);
+    const rank = (t) => PRIORITY.indexOf(t.status);
+    const recent = (t) => -(Date.parse(t.shipped_at || t.updated_at || t.created_at || '') || 0);
+    const shown = mine.slice().sort((a, b) => rank(a) - rank(b) || recent(a) - recent(b) || Number(a.id) - Number(b.id)).slice(0, MAX_ITEMS)
+      .sort((a, b) => PIPELINE.indexOf(a.status) - PIPELINE.indexOf(b.status) || Number(a.id) - Number(b.id));
+    const items = shown.map((t) => {
+      const craft = CRAFTS.indexOf(t.discipline) >= 0 ? t.discipline : 'engineer';
+      const st = STAGES[t.status];
+      const built = ['ready', 'backlog'].indexOf(st[0]) < 0;
+      return [String(t.title || 'task ' + t.id), String(t.kind || 'task'), craft, st[0], built ? taskHeight(t) : 0, st[1], '/builders/task/' + encodeURIComponent(t.id)];
+    });
+    const n = (s) => mine.filter((t) => t.status === s).length;
+    const parts = [[n('shipped'), 'shipped'], [n('active'), 'being built'], [n('completed') + n('confirmed'), 'waiting on a check'], [n('ready') + n('blocked') + n('backlog'), 'not started']].filter((p) => p[0] > 0).map((p) => p[0] + ' ' + p[1]);
+    return { name: name, line: parts.length ? 'the goal’s work · ' + parts.join(' · ') : 'no work in this goal yet', items: items, more: mine.length - items.length, total: mine.length };
+  }
+
+  //   input { goalId, goals, tasks, mode }
+  function districtModel(input) {
+    const o = input || {};
+    const mode = o.mode === 'light' ? 'light' : 'dark';
+    const T = S.theme(mode);
+    const goal = (Array.isArray(o.goals) ? o.goals : []).find((g) => g && String(g.id) === String(o.goalId)) || null;
+    const d = districtInfo(o.goalId, goal, o.tasks);
+    const kicker = String(d.name).toLowerCase();
+    const dv = districtView(T, kicker.length > 40 ? kicker.slice(0, 39) + '…' : kicker, d);
+    dv.goalId = String(o.goalId); dv.mode = mode; dv.open = !!goal && goal.status === 'open';
+    dv.more = d.more; dv.total = d.total;
+    dv.goalHref = '/builders/goals#/goal/' + encodeURIComponent(o.goalId);
+    dv.label = d.name + ': ' + d.items.length + ' pieces of work on the road' + (d.more ? ', ' + d.more + ' more on the goal page' : '') + '.';
+    return dv;
+  }
+
+  const api = {
+    crown: crown, workItem: workItem, floorSymbol: floorSymbol, symbolPath: symbolPath, buildingView: buildingView, districtView: districtView,
+    civicInfo: civicInfo, floorFor: floorFor, holderOf: holderOf, recordOf: recordOf, buildingModel: buildingModel,
+    districtInfo: districtInfo, districtModel: districtModel,
+    PLAN: PLAN, SYMBOL_NAMES: Object.freeze(Object.keys(SYMBOLS)), RULE_WORDS: RULE_WORDS, MAX_ITEMS: MAX_ITEMS, QUIET: QUIET,
+  };
+  root.GovInside = api;
+  if (typeof module !== 'undefined' && module.exports) module.exports = api;
+}(typeof window !== 'undefined' ? window : globalThis));