@chrisdudek/yg 5.2.6 → 5.4.0

package/dist/templates/portal/js/views/relations-matrix.js

@@ -0,0 +1,185 @@
+/*
+ * V4 part (a) — the allowed-relations matrix (Canvas grid + DOM mirror).
+ *
+ * The architecture's allowed-relations rules as a node-type × node-type grid: a filled cell
+ * means the architecture permits that relation type from the row type to the column type; an
+ * empty cell means it permits none (a forbidden pair). This is *allowed*, not *actual* —
+ * conformance is the separate live boundary check. The dense grid is drawn on Canvas 2D (the
+ * one place §3a sanctions Canvas), with a DOM-list MIRROR beside it so the matrix is not
+ * opaque to a screen reader (Canvas alone is). Colors come from CSS custom properties read off
+ * the page; this module paints relation presence only — it never paints a verdict state, so it
+ * does not (and must not) invent a green.
+ *
+ * Browser globals only — reads the already-resolved PortalData; no network, no Node.
+ */
+(function () {
+  'use strict';
+
+  var Yg = (window.YgPortal = window.YgPortal || {});
+  var dom = Yg.dom;
+  Yg.views = Yg.views || {};
+  Yg.matrix = {};
+
+  var CELL = 26;
+  var HEADER = 92;
+  var ROWLBL = 150;
+
+  // Relation type → a stable, colorblind-safe hue (presence marker only, not a state).
+  var REL_COLOR = {
+    calls: '#0d74ce',
+    uses: '#208368',
+    extends: '#9a6700',
+    implements: '#8e4ec6',
+    emits: '#d6409f',
+    listens: '#d6409f',
+  };
+
+  /** The sorted union of every type that appears as a relation source or target. */
+  Yg.matrix.axisTypes = function (types) {
+    var ids = (types || []).map(function (t) {
+      return t.id;
+    });
+    return ids.slice().sort();
+  };
+
+  /** The relation types allowed from `rowType` to `colType`, by the architecture matrix. */
+  Yg.matrix.allowedBetween = function (typesById, rowType, colType) {
+    var row = typesById[rowType];
+    if (!row || !row.allowedRelations) return [];
+    var out = [];
+    for (var rel in row.allowedRelations) {
+      if (!Object.prototype.hasOwnProperty.call(row.allowedRelations, rel)) continue;
+      var targets = row.allowedRelations[rel] || [];
+      if (targets.indexOf(colType) !== -1) out.push(rel);
+    }
+    return out;
+  };
+
+  function cssVar(name, fallback) {
+    try {
+      var v = getComputedStyle(document.documentElement).getPropertyValue(name);
+      return (v && v.trim()) || fallback;
+    } catch (_e) {
+      return fallback;
+    }
+  }
+
+  function drawCanvas(canvas, axis, typesById) {
+    var ctx = canvas.getContext && canvas.getContext('2d');
+    if (!ctx) return; // jsdom/test sandbox without canvas — the DOM mirror carries the data
+    var n = axis.length;
+    var muted = cssVar('--text-secondary', '#60646c');
+    var border = cssVar('--border-subtle', '#d9d9e0');
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.font = '11px ui-sans-serif, system-ui, sans-serif';
+    ctx.textBaseline = 'middle';
+
+    // Column headers (rotated) + row labels.
+    for (var c = 0; c < n; c += 1) {
+      ctx.save();
+      ctx.translate(ROWLBL + c * CELL + CELL / 2, HEADER - 6);
+      ctx.rotate(-Math.PI / 3);
+      ctx.fillStyle = muted;
+      ctx.textAlign = 'left';
+      ctx.fillText(axis[c], 0, 0);
+      ctx.restore();
+    }
+    for (var r = 0; r < n; r += 1) {
+      ctx.fillStyle = muted;
+      ctx.textAlign = 'right';
+      ctx.fillText(axis[r], ROWLBL - 8, HEADER + r * CELL + CELL / 2);
+    }
+
+    // Cells.
+    ctx.textAlign = 'center';
+    for (var ri = 0; ri < n; ri += 1) {
+      for (var ci = 0; ci < n; ci += 1) {
+        var x = ROWLBL + ci * CELL;
+        var y = HEADER + ri * CELL;
+        ctx.strokeStyle = border;
+        ctx.strokeRect(x, y, CELL, CELL);
+        if (ri === ci) {
+          ctx.fillStyle = cssVar('--surface-2', '#f0f0f3');
+          ctx.fillRect(x + 1, y + 1, CELL - 2, CELL - 2);
+          continue;
+        }
+        var rels = Yg.matrix.allowedBetween(typesById, axis[ri], axis[ci]);
+        if (rels.length) {
+          ctx.fillStyle = REL_COLOR[rels[0]] || muted;
+          ctx.beginPath();
+          ctx.arc(x + CELL / 2, y + CELL / 2, 4, 0, Math.PI * 2);
+          ctx.fill();
+        }
+      }
+    }
+  }
+
+  /** A DOM-list mirror of the matrix: every allowed (row → rel → col) edge, screen-reader-legible. */
+  function buildMirror(axis, typesById) {
+    var mirror = dom.el('div', 'mtx-mirror');
+    mirror.setAttribute('aria-label', 'Allowed relations, as a list');
+    var any = false;
+    for (var ri = 0; ri < axis.length; ri += 1) {
+      for (var ci = 0; ci < axis.length; ci += 1) {
+        if (ri === ci) continue;
+        var rels = Yg.matrix.allowedBetween(typesById, axis[ri], axis[ci]);
+        if (!rels.length) continue;
+        any = true;
+        var line = dom.el('div', 'mtx-mirror-row');
+        line.appendChild(dom.el('span', 'mono', axis[ri]));
+        line.appendChild(dom.el('span', 'mtx-arrow', ' → '));
+        line.appendChild(dom.el('span', 'mtx-rels', rels.join(' / ')));
+        line.appendChild(dom.el('span', 'mtx-arrow', ' → '));
+        line.appendChild(dom.el('span', 'mono', axis[ci]));
+        mirror.appendChild(line);
+      }
+    }
+    if (!any) mirror.appendChild(dom.el('p', 'mtx-empty', 'The architecture declares no allowed relations between these types — every pair is a forbidden cell.'));
+    return mirror;
+  }
+
+  function legend() {
+    var box = dom.el('div', 'mtx-legend');
+    for (var rel in REL_COLOR) {
+      if (!Object.prototype.hasOwnProperty.call(REL_COLOR, rel)) continue;
+      if (rel === 'listens') continue; // emits/listens share one swatch
+      var k = dom.el('span', 'mtx-legend-k');
+      var sw = dom.el('span', 'mtx-swatch');
+      sw.style.background = REL_COLOR[rel];
+      k.appendChild(sw);
+      k.appendChild(dom.el('span', null, rel === 'emits' ? 'emits/listens' : rel));
+      box.appendChild(k);
+    }
+    var empty = dom.el('span', 'mtx-legend-k mtx-legend-empty', 'empty = forbidden by architecture');
+    box.appendChild(empty);
+    return box;
+  }
+
+  /** Render the allowed-relations matrix (Canvas + DOM mirror) into `mount`. */
+  Yg.matrix.render = function (mount, data) {
+    var typesById = {};
+    (data.types || []).forEach(function (t) {
+      typesById[t.id] = t;
+    });
+    var axis = Yg.matrix.axisTypes(data.types);
+
+    mount.appendChild(dom.el('p', 'view-lead', "What's allowed to depend on what — the architecture's node-type × node-type rules. An empty cell means no relation is permitted there. This is allowed, not actual: conformance is the live boundary check below."));
+
+    // The dense grid keeps its intrinsic pixel size and scrolls WITHIN its own container
+    // (overflow-x on .mtx-scroll), so a wide matrix never pushes the page into a horizontal
+    // scrollbar — it stays legible and contained instead of being scaled down.
+    var scroll = dom.el('div', 'mtx-scroll');
+    var canvas = document.createElement('canvas');
+    canvas.className = 'mtx-canvas';
+    canvas.width = ROWLBL + axis.length * CELL + 4;
+    canvas.height = HEADER + axis.length * CELL + 4;
+    canvas.setAttribute('role', 'img');
+    canvas.setAttribute('aria-label', 'Allowed-relations matrix; a list mirror follows');
+    scroll.appendChild(canvas);
+    mount.appendChild(scroll);
+    drawCanvas(canvas, axis, typesById);
+
+    mount.appendChild(legend());
+    mount.appendChild(buildMirror(axis, typesById));
+  };
+})();

package/dist/templates/portal/js/views/relations-view.js

@@ -0,0 +1,185 @@
+/*
+ * V4 Relations & Boundaries — orchestrator (hubs + the live boundary), with the matrix.
+ *
+ * Three parts, all MVP (§3.4, §3a V4): (a) the allowed-relations matrix (delegated to
+ * Yg.matrix), (b) the fan-in / fan-out hub ranking (the load-bearing nodes), and (c) the LIVE
+ * boundary, recomputed at generation, never read from the lock.
+ *
+ * CRITICAL HONESTY — the boundary has THREE classes, and they are NOT the same thing:
+ *   - phantom        — a real undeclared code dependency. A VIOLATION (boundary state, error).
+ *   - forbiddenType  — a code dependency to a type the architecture forbids. A VIOLATION.
+ *   - declaredOnly   — a DECLARED relation with no static code backing (reflection / DI / HTTP /
+ *                      events). LEGITIMATE by design; rendered NEUTRALLY / informationally,
+ *                      never red, never called a violation, never summed into a violation count.
+ * And when the live parse could not run (boundary.unknown), the surface renders UNKNOWN — not
+ * clean, not zero — never a fabricated green. Every verdict-state treatment is read from the one
+ * shared honest-state model.
+ *
+ * Browser globals only — reads the already-resolved PortalData; no network, no Node.
+ */
+(function () {
+  'use strict';
+
+  var Yg = (window.YgPortal = window.YgPortal || {});
+  var dom = Yg.dom;
+  Yg.views = Yg.views || {};
+
+  function hubColumn(title, cap, entries, nav) {
+    var col = dom.el('div', 'rel-hubcol');
+    col.appendChild(dom.el('h3', 'rel-hubh', title));
+    col.appendChild(dom.el('div', 'rel-hubcap', cap));
+    var max = 1;
+    for (var i = 0; i < entries.length; i += 1) max = Math.max(max, entries[i].count);
+    if (!entries.length) {
+      col.appendChild(dom.el('p', 'rel-empty', 'None.'));
+      return col;
+    }
+    for (var j = 0; j < entries.length; j += 1) {
+      var e = entries[j];
+      var row = dom.el('button', 'rel-hubrow');
+      row.type = 'button';
+      row.appendChild(dom.el('span', 'rel-hubname mono', e.path));
+      var bar = dom.el('span', 'rel-hubbar');
+      bar.style.width = Math.round((e.count / max) * 120) + 'px';
+      row.appendChild(bar);
+      row.appendChild(dom.el('span', 'rel-hubn', String(e.count)));
+      row.addEventListener('click', function (p) {
+        return function () {
+          nav({ view: 'tree', node: p });
+        };
+      }(e.path));
+      col.appendChild(row);
+    }
+    return col;
+  }
+
+  function summaryCard(count, label, tone) {
+    var card = dom.el('div', 'rel-scard' + (tone ? ' rel-scard-' + tone : ''));
+    card.appendChild(dom.el('b', null, String(count)));
+    card.appendChild(dom.el('div', 'rel-scard-l', label));
+    return card;
+  }
+
+  /** A phantom (undeclared) violation row — a real error, with a copy-ready relation stanza. */
+  function phantomRow(v, nav) {
+    var row = dom.el('div', 'rel-viol rel-viol-phantom');
+    row.appendChild(Yg.states.badge('boundary'));
+    var link = dom.el('button', 'rel-viol-src mono');
+    link.type = 'button';
+    link.textContent = v.source + ' → ' + v.target;
+    link.addEventListener('click', function () {
+      nav({ view: 'tree', node: v.source });
+    });
+    row.appendChild(link);
+    var stanza = dom.el('pre', 'rel-stanza', 'relations:\n  - target: ' + v.target + '\n    type: <allowed-type>');
+    row.appendChild(stanza);
+    return row;
+  }
+
+  /** A forbidden-type violation — links to the Type Model / matrix that forbids the pair. */
+  function forbiddenRow(v, nav) {
+    var row = dom.el('div', 'rel-viol rel-viol-forbidden');
+    row.appendChild(Yg.states.badge('boundary'));
+    row.appendChild(dom.el('span', 'rel-viol-src mono', v.source + ' → ' + v.target));
+    var to = dom.el('button', 'rel-viol-link');
+    to.type = 'button';
+    to.textContent = 'see the architecture decision →';
+    to.addEventListener('click', function () {
+      nav({ view: 'types' });
+    });
+    row.appendChild(to);
+    return row;
+  }
+
+  /** A declared-only edge — NEUTRAL / informational. Never red, never a violation. */
+  function declaredOnlyRow(v) {
+    var row = dom.el('div', 'rel-decl');
+    row.appendChild(dom.el('span', 'rel-decl-mark', '↪'));
+    row.appendChild(dom.el('span', 'mono', v.source + ' → ' + v.target));
+    row.appendChild(dom.el('span', 'rel-decl-note', 'declared, no static backing — legitimate (DI / HTTP / reflection / events)'));
+    return row;
+  }
+
+  function renderBoundary(stage, boundary, nav) {
+    var head = dom.el('div', 'rel-bhead');
+    head.appendChild(dom.el('span', 'cov-livebadge', 'LIVE'));
+    head.appendChild(dom.el('span', null, 'recomputed now, never cached · always an error · not suppressible'));
+    stage.appendChild(head);
+
+    // UNKNOWN degraded state — honest, never a fabricated clean.
+    if (boundary.unknown) {
+      var unk = dom.el('div', 'rel-unknown');
+      unk.appendChild(Yg.states.badge('unverified'));
+      unk.appendChild(dom.el('b', null, 'UNKNOWN — relation health unknown, not clean'));
+      unk.appendChild(dom.el('p', null, 'The live relation parse could not run, so the boundary cannot be computed. This is not a clean result and not zero. Re-run yg check once the parse can complete.'));
+      stage.appendChild(unk);
+      return;
+    }
+
+    var phantom = boundary.phantom || [];
+    var declaredOnly = boundary.declaredOnly || [];
+    var forbidden = boundary.forbiddenType || [];
+
+    var summary = dom.el('div', 'rel-summary');
+    summary.appendChild(summaryCard(phantom.length, 'phantom (undeclared) ' + (phantom.length === 0 ? '— clean' : '— error'), phantom.length === 0 ? 'clean' : 'err'));
+    summary.appendChild(summaryCard(declaredOnly.length, 'declared-only (informational)', 'info'));
+    summary.appendChild(summaryCard(forbidden.length, 'forbidden-type crossings', forbidden.length === 0 ? 'clean' : 'err'));
+    stage.appendChild(summary);
+
+    // Phantom — violations.
+    var phSect = dom.el('section', 'rel-class');
+    phSect.appendChild(dom.el('h3', 'rel-classh', 'Phantom — code depends on a node it never declared'));
+    if (phantom.length === 0) {
+      phSect.appendChild(dom.el('p', 'rel-clean', '✓ clean — no undeclared dependency on current inputs.'));
+    } else {
+      for (var i = 0; i < phantom.length; i += 1) phSect.appendChild(phantomRow(phantom[i], nav));
+    }
+    stage.appendChild(phSect);
+
+    // Forbidden-type — violations.
+    var fbSect = dom.el('section', 'rel-class');
+    fbSect.appendChild(dom.el('h3', 'rel-classh', 'Forbidden-type — a dependency the architecture allows no relation for'));
+    if (forbidden.length === 0) {
+      fbSect.appendChild(dom.el('p', 'rel-clean', '✓ clean — no forbidden-type crossing on current inputs.'));
+    } else {
+      for (var f = 0; f < forbidden.length; f += 1) fbSect.appendChild(forbiddenRow(forbidden[f], nav));
+    }
+    stage.appendChild(fbSect);
+
+    // Declared-only — NEUTRAL, never red.
+    var doSect = dom.el('section', 'rel-class rel-class-info');
+    doSect.appendChild(dom.el('h3', 'rel-classh', 'Declared-only — relation declared, no static backing (legitimate, never red)'));
+    doSect.appendChild(dom.el('p', 'rel-decl-intro', 'One-directional contract: a declared relation needs no code behind it. These are correct, not dead edges.'));
+    if (declaredOnly.length === 0) {
+      doSect.appendChild(dom.el('p', 'rel-empty', 'None on current inputs.'));
+    } else {
+      for (var d = 0; d < declaredOnly.length; d += 1) doSect.appendChild(declaredOnlyRow(declaredOnly[d]));
+    }
+    stage.appendChild(doSect);
+  }
+
+  Yg.views.relations = function (stage, route, data, ctx) {
+    var nav = ctx && ctx.navigate ? ctx.navigate : function () {};
+
+    // (a) allowed-relations matrix.
+    var mtxSect = dom.el('section', 'rel-part');
+    mtxSect.appendChild(dom.el('h2', 'rel-parth', 'Allowed relations'));
+    Yg.matrix.render(mtxSect, data);
+    stage.appendChild(mtxSect);
+
+    // (b) fan-in / fan-out hubs.
+    var hubSect = dom.el('section', 'rel-part');
+    hubSect.appendChild(dom.el('h2', 'rel-parth', 'Dependency hubs'));
+    var cols = dom.el('div', 'rel-hubcols');
+    cols.appendChild(hubColumn('Most depended-on (fan-in)', 'If one of these breaks, a lot breaks with it.', (data.hubs && data.hubs.fanIn) || [], nav));
+    cols.appendChild(hubColumn('Depends on the most (fan-out)', 'Wide reach often signals responsibilities to split.', (data.hubs && data.hubs.fanOut) || [], nav));
+    hubSect.appendChild(cols);
+    stage.appendChild(hubSect);
+
+    // (c) the live boundary.
+    var bSect = dom.el('section', 'rel-part');
+    bSect.appendChild(dom.el('h2', 'rel-parth', 'Live boundary'));
+    renderBoundary(bSect, data.boundary || { unknown: false }, nav);
+    stage.appendChild(bSect);
+  };
+})();

package/dist/templates/portal/js/views/rulebook-view.js

@@ -0,0 +1,174 @@
+/*
+ * V5 Rulebook — the aspect catalogue + per-aspect node list with HONEST cells.
+ *
+ * The rulebook a lead screen-shares (§3.5, §3a V5). Every rule the code must satisfy, as a
+ * searchable catalogue: id + rule prose, a kind badge (LLM / deterministic / aggregating), a
+ * status badge (draft / advisory / enforced), scope (per node / file + `when` presence), how
+ * many nodes it lands on, and a coverage micro-summary. The micro-summary has THREE DISTINCT
+ * honest renderings the contract keeps apart and this view must never collapse into one green:
+ *   - normal     — a real V/R/U tally over the aspect's expected units (a reviewer/check ran).
+ *   - aggregate  — an aggregating bundle has no own reviewer: it "judges nothing".
+ *   - vacuous    — a rule-bearing aspect with ZERO expected units "verifies nothing", with the
+ *                  resolved reason (draft / no effective node / scope-when excludes all).
+ * Selecting an aspect expands the node list it lands on, each node rendered with its honest
+ * verdict cell (§3a V5: aspect row → node cell → SHELL-panel). Every state treatment is read
+ * from the one shared honest-state model; nothing here invents a green.
+ *
+ * Browser globals only — reads the already-resolved PortalData; no network, no Node.
+ */
+(function () {
+  'use strict';
+
+  var Yg = (window.YgPortal = window.YgPortal || {});
+  var dom = Yg.dom;
+  Yg.views = Yg.views || {};
+
+  /** A kind badge (LLM / deterministic / aggregating) — presentation only, never a verdict. */
+  function kindBadge(kind) {
+    var label = kind === 'llm' ? 'LLM' : kind === 'aggregate' ? 'aggregating' : 'deterministic';
+    return dom.el('span', 'rb-badge rb-badge-' + kind, label);
+  }
+
+  /** A status badge (draft / advisory / enforced) — rendering of how a verdict blocks, not green. */
+  function statusBadge(status) {
+    return dom.el('span', 'rb-st rb-st-' + status, status);
+  }
+
+  /**
+   * The honest coverage cell for one aspect tally. NEVER green for an aspect that judges or
+   * verifies nothing: an aggregate reads "judges nothing", a vacuous aspect reads "verifies
+   * nothing" with its reason. A normal tally paints a micro-bar sized by the real V/R/U states.
+   */
+  function tallyCell(tally) {
+    var cell = dom.el('td', 'rb-cov');
+    if (tally.render === 'aggregate') {
+      cell.appendChild(dom.el('span', 'rb-note', 'judges nothing — bundle (state = union of children)'));
+      return cell;
+    }
+    if (tally.render === 'vacuous') {
+      var note = dom.el('span', 'rb-note rb-note-vacuous', 'verifies nothing — ' + tally.reason);
+      cell.appendChild(note);
+      return cell;
+    }
+    // normal — a micro-bar sized by the real pair states, so an unverified unit never paints
+    // green and an advisory refusal paints its own warning segment, never a blocking red.
+    var bar = dom.el('div', 'rb-bar');
+    var warning = tally.warning || 0;
+    var segs = [
+      { state: 'verified', n: tally.verified },
+      { state: 'refused', n: tally.refused },
+      { state: 'warning', n: warning },
+      { state: 'unverified', n: tally.unverified },
+    ];
+    for (var i = 0; i < segs.length; i += 1) {
+      if (segs[i].n <= 0) continue;
+      var seg = dom.el('i', 'rb-bar-seg ' + Yg.states.cssClass(segs[i].state));
+      seg.style.flex = String(segs[i].n);
+      bar.appendChild(seg);
+    }
+    if (!bar.firstChild) bar.appendChild(dom.el('i', 'rb-bar-seg ' + Yg.states.cssClass('no-rule')));
+    cell.appendChild(bar);
+    var num =
+      tally.verified + ' verified / ' + tally.refused + ' refused / ' +
+      (warning > 0 ? warning + ' advisory / ' : '') + tally.unverified + ' unverified';
+    cell.appendChild(dom.el('div', 'rb-covnum mono', num));
+    return cell;
+  }
+
+  /** One aspect row in the catalogue table. Clicking the id toggles its per-node expansion. */
+  function aspectRow(a, selected, nav) {
+    var tr = dom.el('tr', 'rb-row' + (selected ? ' rb-row-sel' : ''));
+
+    var idCell = dom.el('td', 'rb-aid');
+    var idBtn = dom.el('button', 'rb-idbtn mono');
+    idBtn.type = 'button';
+    idBtn.textContent = a.id;
+    idBtn.addEventListener('click', function () {
+      // Toggle: clicking the open aspect collapses it (route back to the bare rulebook).
+      nav(selected ? { view: 'rulebook' } : { view: 'rulebook', aspect: a.id });
+    });
+    idCell.appendChild(idBtn);
+    var prose = a.description || (a.ruleProse ? firstLine(a.ruleProse) : '') || a.name;
+    if (prose) idCell.appendChild(dom.el('span', 'rb-desc', prose));
+    tr.appendChild(idCell);
+
+    tr.appendChild(dom.el('td', null, kindBadge(a.kind)));
+    tr.appendChild(dom.el('td', null, statusBadge(a.status)));
+
+    var scopeCell = dom.el('td', 'mono rb-scope');
+    scopeCell.textContent = a.kind === 'aggregate' ? '—' : 'per:' + a.scope + (a.hasWhen ? ' · when' : '');
+    tr.appendChild(scopeCell);
+
+    var appliesCell = dom.el('td', 'rb-applies');
+    appliesCell.textContent = appliesText(a);
+    tr.appendChild(appliesCell);
+
+    tr.appendChild(tallyCell(a.tally));
+    return tr;
+  }
+
+  /** "Applies to N nodes" / "via implies" / "0 nodes" — derived honestly from the tally. */
+  function appliesText(a) {
+    if (a.kind === 'aggregate') return 'via implies';
+    if (a.tally.render === 'vacuous') return '0 nodes';
+    return a.tally.units + (a.tally.units === 1 ? ' unit' : ' units');
+  }
+
+  /** The first non-heading prose line of a content.md, for a one-line description. */
+  function firstLine(prose) {
+    var lines = String(prose).split('\n');
+    for (var i = 0; i < lines.length; i += 1) {
+      var t = lines[i].trim();
+      if (t && t.charAt(0) !== '#') return t.length > 140 ? t.slice(0, 137) + '…' : t;
+    }
+    return '';
+  }
+
+
+  function counts(aspects) {
+    var llm = 0;
+    var det = 0;
+    var agg = 0;
+    for (var i = 0; i < aspects.length; i += 1) {
+      if (aspects[i].kind === 'llm') llm += 1;
+      else if (aspects[i].kind === 'aggregate') agg += 1;
+      else det += 1;
+    }
+    return aspects.length + ' rules · ' + llm + ' LLM · ' + det + ' deterministic · ' + agg + ' aggregating';
+  }
+
+  Yg.views.rulebook = function (stage, route, data, ctx) {
+    var nav = ctx && ctx.navigate ? ctx.navigate : function () {};
+    var aspects = (data.aspects || []).slice();
+    var selectedId = route && route.aspect ? route.aspect : null;
+
+    stage.appendChild(dom.el('p', 'view-lead', 'Every rule the code must satisfy — the rulebook. A green tally means a reviewer actually checked those units; a bundle judges nothing of its own, and a rule with no expected units verifies nothing. Absence of red is not a pass. Click a rule to see every node it lands on.'));
+    stage.appendChild(dom.el('div', 'rb-sub', counts(aspects)));
+
+    var table = dom.el('table', 'rb-table');
+    var thead = dom.el('thead');
+    var htr = dom.el('tr');
+    ['rule', 'kind', 'status', 'scope', 'applies', 'coverage'].forEach(function (h) {
+      htr.appendChild(dom.el('td', null, h));
+    });
+    thead.appendChild(htr);
+    table.appendChild(thead);
+
+    var tbody = dom.el('tbody');
+    var selectedAspect = null;
+    for (var i = 0; i < aspects.length; i += 1) {
+      var isSel = aspects[i].id === selectedId;
+      if (isSel) selectedAspect = aspects[i];
+      tbody.appendChild(aspectRow(aspects[i], isSel, nav));
+      // The selected rule's full detail opens in the shared inspector panel (the aspect-side
+      // mirror of the node attestation), reached via the #/aspect/<id> route — not inline here.
+    }
+    table.appendChild(tbody);
+    stage.appendChild(table);
+
+    if (!selectedAspect && selectedId) {
+      // A deep-linked aspect id that no longer exists — honest, never a blank.
+      stage.appendChild(dom.el('p', 'rb-empty', 'No rule named "' + selectedId + '" — it may have been removed.'));
+    }
+  };
+})();