npm - @zigrivers/scaffold - Versions diffs - 3.29.0 → 3.31.0 - Mend

@zigrivers/scaffold 3.29.0 → 3.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (86) hide show

package/content/guides/AUTHORING.md +146 -0
package/content/guides/cli/index.html +1855 -0
package/content/guides/cli/index.md +206 -0
package/content/guides/concepts/index.html +1970 -0
package/content/guides/concepts/index.md +347 -0
package/content/guides/dashboard/index.html +1913 -0
package/content/guides/dashboard/index.md +264 -0
package/content/guides/index.html +368 -15
package/content/guides/install/.diagrams/diagram-0.svg +1 -0
package/content/guides/install/.diagrams/manifest.json +3 -0
package/content/guides/install/index.html +1653 -0
package/content/guides/install/index.md +186 -0
package/content/guides/knowledge/.diagrams/diagram-0.svg +1 -0
package/content/guides/knowledge/.diagrams/manifest.json +3 -0
package/content/guides/knowledge/index.html +1765 -0
package/content/guides/knowledge/index.md +209 -0
package/content/guides/knowledge-freshness/.diagrams/diagram-0.svg +1 -0
package/content/guides/knowledge-freshness/.diagrams/manifest.json +3 -0
package/content/guides/knowledge-freshness/index.html +2795 -0
package/content/guides/knowledge-freshness/index.md +893 -0
package/content/guides/mmr/index.html +407 -36
package/content/guides/mmr/index.md +39 -16
package/content/guides/multi-agent/.diagrams/diagram-0.svg +1 -0
package/content/guides/multi-agent/.diagrams/manifest.json +3 -0
package/content/guides/multi-agent/index.html +1715 -0
package/content/guides/multi-agent/index.md +243 -0
package/content/guides/observability/.diagrams/diagram-0.svg +1 -0
package/content/guides/observability/.diagrams/diagram-1.svg +1 -0
package/content/guides/observability/.diagrams/diagram-2.svg +1 -0
package/content/guides/observability/.diagrams/diagram-3.svg +1 -0
package/content/guides/observability/.diagrams/manifest.json +6 -0
package/content/guides/observability/index.html +3257 -0
package/content/guides/observability/index.md +1097 -0
package/content/guides/pipeline/.diagrams/diagram-0.svg +1 -0
package/content/guides/pipeline/.diagrams/diagram-1.svg +1 -0
package/content/guides/pipeline/.diagrams/manifest.json +4 -0
package/content/guides/pipeline/index.html +1973 -0
package/content/guides/pipeline/index.md +387 -0
package/content/guides/review-workflow/.diagrams/diagram-0.svg +1 -0
package/content/guides/review-workflow/.diagrams/diagram-1.svg +1 -0
package/content/guides/review-workflow/.diagrams/manifest.json +4 -0
package/content/guides/review-workflow/index.html +1790 -0
package/content/guides/review-workflow/index.md +248 -0
package/dist/guides/build.d.ts +1 -1
package/dist/guides/build.d.ts.map +1 -1
package/dist/guides/build.js +21 -9
package/dist/guides/build.js.map +1 -1
package/dist/guides/build.test.js +47 -0
package/dist/guides/build.test.js.map +1 -1
package/dist/guides/chrome.d.ts.map +1 -1
package/dist/guides/chrome.js +83 -12
package/dist/guides/chrome.js.map +1 -1
package/dist/guides/dashboard-theme.css +8 -0
package/dist/guides/directives-cite.test.d.ts +2 -0
package/dist/guides/directives-cite.test.d.ts.map +1 -0
package/dist/guides/directives-cite.test.js +26 -0
package/dist/guides/directives-cite.test.js.map +1 -0
package/dist/guides/directives-tabs.test.js +47 -0
package/dist/guides/directives-tabs.test.js.map +1 -1
package/dist/guides/directives.d.ts +1 -0
package/dist/guides/directives.d.ts.map +1 -1
package/dist/guides/directives.js +38 -0
package/dist/guides/directives.js.map +1 -1
package/dist/guides/guides.css +268 -0
package/dist/guides/index-page.d.ts.map +1 -1
package/dist/guides/index-page.js +41 -8
package/dist/guides/index-page.js.map +1 -1
package/dist/guides/links.d.ts +14 -0
package/dist/guides/links.d.ts.map +1 -0
package/dist/guides/links.js +56 -0
package/dist/guides/links.js.map +1 -0
package/dist/guides/links.test.d.ts +2 -0
package/dist/guides/links.test.d.ts.map +1 -0
package/dist/guides/links.test.js +72 -0
package/dist/guides/links.test.js.map +1 -0
package/dist/guides/render.d.ts +1 -0
package/dist/guides/render.d.ts.map +1 -1
package/dist/guides/render.js +1 -1
package/dist/guides/render.js.map +1 -1
package/dist/guides/sanitize.d.ts.map +1 -1
package/dist/guides/sanitize.js +5 -0
package/dist/guides/sanitize.js.map +1 -1
package/dist/guides/template.d.ts.map +1 -1
package/dist/guides/template.js +7 -2
package/dist/guides/template.js.map +1 -1
package/package.json +2 -2

package/content/guides/concepts/index.html ADDED Viewed

@@ -0,0 +1,1970 @@
+<!DOCTYPE html>
+<html lang="en" data-chrome-version="1">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Concepts &amp; Glossary</title>
+<!-- scaffold:chrome v1 -->
+<style>/* Scaffold Dashboard Theme
+ * All CSS for the generated pipeline dashboard.
+ * Embedded into HTML by scripts/generate-dashboard.sh.
+ * Design system reference: docs/design-system.md
+ *
+ * Aesthetic: "Precision Industrial" — Swiss-typographic control room.
+ * Deep navy dark mode with indigo accents, clean cool-white light mode.
+ */
+/* ─── Design Tokens (Light Mode) ──────────────── */
+:root {
+    /* Surface */
+    --bg:           #f5f6fa;
+    --bg-card:      #ffffff;
+    --bg-hover:     #eef0f6;
+    --bg-inset:     #e8eaf2;
+    /* Text */
+    --text:         #1a1d2e;
+    --text-muted:   #6b7294;
+    --text-faint:   #9ba1c0;
+    /* Borders & Structure */
+    --border:       #dde0ed;
+    --border-light: #eceef5;
+    --radius:       10px;
+    --radius-sm:    6px;
+    /* Accent */
+    --accent:       #4f46e5;
+    --accent-hover: #4338ca;
+    --accent-glow:  rgba(79, 70, 229, 0.10);
+    /* Semantic: Status */
+    --green:        #059669;
+    --green-bg:     #ecfdf5;
+    --green-border: #a7f3d0;
+    --blue:         #2563eb;
+    --blue-bg:      #eff6ff;
+    --blue-border:  #bfdbfe;
+    --yellow:       #d97706;
+    --yellow-bg:    #fffbeb;
+    --yellow-border:#fde68a;
+    --red:          #dc2626;
+    --red-bg:       #fef2f2;
+    --red-border:   #fecaca;
+    --gray:         #9ca3af;
+    --gray-bg:      #f3f4f6;
+    --gray-border:  #e5e7eb;
+    --scrim:        rgba(15, 17, 23, 0.45);
+    /* Semantic: Next Banner */
+    --next-bg:      #eef2ff;
+    --next-border:  #4f46e5;
+    --next-glow:    rgba(79, 70, 229, 0.06);
+    /* Semantic: Progress */
+    --progress-bg:  #e5e7eb;
+    --progress-h:   10px;
+    /* Depth */
+    --shadow-sm:    0 1px 2px rgba(30, 34, 60, 0.04);
+    --shadow:       0 1px 3px rgba(30, 34, 60, 0.07), 0 1px 2px rgba(30, 34, 60, 0.04);
+    --shadow-md:    0 4px 12px rgba(30, 34, 60, 0.08), 0 1px 3px rgba(30, 34, 60, 0.05);
+    --shadow-lg:    0 8px 24px rgba(30, 34, 60, 0.10), 0 2px 6px rgba(30, 34, 60, 0.04);
+    /* Spacing scale (4px base) */
+    --sp-1: 4px;
+    --sp-2: 8px;
+    --sp-3: 12px;
+    --sp-4: 16px;
+    --sp-5: 20px;
+    --sp-6: 24px;
+    --sp-8: 32px;
+    --sp-10: 40px;
+    /* Typography */
+    --font-sans:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+    --font-mono:  "SF Mono", "Cascadia Code", "Fira Code", "JetBrains Mono", Menlo, Consolas, monospace;
+    --text-xs:    0.75rem;
+    --text-sm:    0.8125rem;
+    --text-base:  0.9375rem;
+    --text-lg:    1.125rem;
+    --text-xl:    1.375rem;
+    --text-2xl:   1.75rem;
+    --lh-tight:   1.25;
+    --lh-normal:  1.5;
+    --lh-relaxed: 1.625;
+    --ls-tight:   -0.01em;
+    --ls-wide:    0.025em;
+    --fw-normal:  400;
+    --fw-medium:  500;
+    --fw-semi:    600;
+    --fw-bold:    700;
+    /* Layout */
+    --max-w:      960px;
+    --page-pad:   24px;
+}
+/* ─── Design Tokens (Dark Mode) ───────────────── */
+[data-theme="dark"] {
+    /* Surface */
+    --bg:           #0f1117;
+    --bg-card:      #1a1d2e;
+    --bg-hover:     #252940;
+    --bg-inset:     #141724;
+    /* Text */
+    --text:         #e2e5f0;
+    --text-muted:   #7c82a8;
+    --text-faint:   #555c80;
+    /* Borders & Structure */
+    --border:       #2a2f45;
+    --border-light: #21253a;
+    /* Accent */
+    --accent:       #818cf8;
+    --accent-hover: #a5b4fc;
+    --accent-glow:  rgba(129, 140, 248, 0.12);
+    /* Semantic: Status */
+    --green:        #34d399;
+    --green-bg:     rgba(6, 78, 59, 0.25);
+    --green-border: rgba(52, 211, 153, 0.25);
+    --blue:         #60a5fa;
+    --blue-bg:      rgba(30, 58, 95, 0.30);
+    --blue-border:  rgba(96, 165, 250, 0.25);
+    --yellow:       #fbbf24;
+    --yellow-bg:    rgba(120, 53, 15, 0.25);
+    --yellow-border:rgba(251, 191, 36, 0.20);
+    --red:          #f87171;
+    --red-bg:       rgba(127, 29, 29, 0.25);
+    --red-border:   rgba(248, 113, 113, 0.22);
+    --gray:         #6b7294;
+    --gray-bg:      #252940;
+    --gray-border:  #363c58;
+    --scrim:        rgba(0, 0, 0, 0.6);
+    /* Semantic: Next Banner */
+    --next-bg:      rgba(30, 27, 75, 0.50);
+    --next-border:  #818cf8;
+    --next-glow:    rgba(129, 140, 248, 0.08);
+    /* Semantic: Progress */
+    --progress-bg:  #1f2337;
+    /* Depth */
+    --shadow-sm:    0 1px 2px rgba(0, 0, 0, 0.20);
+    --shadow:       0 1px 3px rgba(0, 0, 0, 0.30), 0 1px 2px rgba(0, 0, 0, 0.15);
+    --shadow-md:    0 4px 12px rgba(0, 0, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.20);
+    --shadow-lg:    0 8px 24px rgba(0, 0, 0, 0.40), 0 2px 6px rgba(0, 0, 0, 0.20);
+}
+/* ─── Theme Toggle ───────────────────────────── */
+.theme-toggle {
+    background: var(--bg-inset);
+    border: 1px solid var(--border);
+    border-radius: var(--radius-sm);
+    padding: var(--sp-1) var(--sp-2);
+    cursor: pointer;
+    font-size: var(--text-base);
+    line-height: 1;
+    color: var(--text-muted);
+    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
+    display: flex;
+    align-items: center;
+    margin-left: auto;
+}
+.theme-toggle:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+    background: var(--accent-glow);
+}
+/* ─── Base ────────────────────────────────────── */
+*, *::before, *::after {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+body {
+    font-family: var(--font-sans);
+    font-size: var(--text-base);
+    line-height: var(--lh-normal);
+    color: var(--text);
+    background: var(--bg);
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+/* ─── Layout ──────────────────────────────────── */
+.wrap {
+    max-width: var(--max-w);
+    margin: 0 auto;
+    padding: var(--sp-8) var(--page-pad);
+}
+/* ─── Header ──────────────────────────────────── */
+.header {
+    display: flex;
+    align-items: baseline;
+    gap: var(--sp-3);
+    margin-bottom: var(--sp-2);
+    flex-wrap: wrap;
+}
+h1 {
+    font-size: var(--text-2xl);
+    font-weight: var(--fw-bold);
+    letter-spacing: var(--ls-tight);
+    line-height: var(--lh-tight);
+}
+h2 {
+    font-size: var(--text-lg);
+    font-weight: var(--fw-semi);
+    letter-spacing: var(--ls-tight);
+    line-height: var(--lh-tight);
+    margin-bottom: var(--sp-3);
+}
+.header-meta {
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    margin-bottom: var(--sp-6);
+    letter-spacing: var(--ls-wide);
+    text-transform: uppercase;
+}
+/* ─── Badge ───────────────────────────────────── */
+.badge {
+    display: inline-block;
+    padding: 2px var(--sp-2);
+    border-radius: 99px;
+    font-size: var(--text-xs);
+    font-weight: var(--fw-semi);
+    letter-spacing: var(--ls-wide);
+    background: var(--accent);
+    color: #fff;
+    text-transform: uppercase;
+}
+.badge-optional {
+    background: var(--yellow-bg);
+    color: var(--yellow);
+    border: 1px solid var(--yellow-border);
+}
+/* ─── Progress Bar ────────────────────────────── */
+.progress-bar {
+    width: 100%;
+    height: var(--progress-h);
+    background: var(--progress-bg);
+    border-radius: 99px;
+    overflow: hidden;
+    margin-bottom: var(--sp-6);
+    display: flex;
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06);
+}
+.progress-bar .seg-done {
+    background: linear-gradient(135deg, var(--green), #10b981);
+    box-shadow: 0 0 8px rgba(5, 150, 105, 0.3);
+}
+.progress-bar .seg-likely {
+    background: linear-gradient(135deg, var(--blue), #3b82f6);
+    box-shadow: 0 0 8px rgba(37, 99, 235, 0.25);
+}
+.progress-bar .seg-skip {
+    background: var(--gray);
+    opacity: 0.7;
+}
+/* ─── Summary Cards ───────────────────────────── */
+.cards {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
+    gap: var(--sp-3);
+    margin-bottom: var(--sp-6);
+}
+.card {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    padding: var(--sp-4) var(--sp-5);
+    box-shadow: var(--shadow);
+    transition: box-shadow 0.15s ease, transform 0.15s ease;
+}
+.card:hover {
+    box-shadow: var(--shadow-md);
+    transform: translateY(-1px);
+}
+.card-num {
+    font-size: var(--text-2xl);
+    font-weight: var(--fw-bold);
+    font-family: var(--font-mono);
+    letter-spacing: var(--ls-tight);
+    line-height: 1;
+}
+.card-lbl {
+    font-size: var(--text-xs);
+    color: var(--text-muted);
+    margin-top: var(--sp-1);
+    letter-spacing: var(--ls-wide);
+    text-transform: uppercase;
+    font-weight: var(--fw-medium);
+}
+/* ─── What's Next Banner ──────────────────────── */
+.next-banner {
+    background: var(--next-bg);
+    border: 1px solid var(--next-border);
+    border-left: 4px solid var(--next-border);
+    border-radius: var(--radius);
+    padding: var(--sp-5) var(--sp-6);
+    margin-bottom: var(--sp-6);
+    box-shadow: 0 0 0 1px var(--next-glow), var(--shadow);
+    position: relative;
+    overflow: hidden;
+}
+.next-banner::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 4px;
+    height: 100%;
+    background: var(--next-border);
+    animation: pulse-border 2.5s ease-in-out infinite;
+}
+@keyframes pulse-border {
+    0%, 100% { opacity: 1; }
+    50%      { opacity: 0.5; }
+}
+.next-banner h2 {
+    color: var(--accent);
+    margin-bottom: var(--sp-1);
+    font-size: var(--text-base);
+    font-weight: var(--fw-semi);
+    letter-spacing: var(--ls-wide);
+    text-transform: uppercase;
+}
+.next-banner p {
+    color: var(--text);
+    font-size: var(--text-base);
+}
+.next-cmd {
+    font-family: var(--font-mono);
+    background: var(--bg-card);
+    padding: var(--sp-1) var(--sp-3);
+    border-radius: var(--radius-sm);
+    font-size: var(--text-sm);
+    display: inline-flex;
+    align-items: center;
+    gap: var(--sp-2);
+    margin-top: var(--sp-3);
+    border: 1px solid var(--border);
+}
+/* ─── Phase Headers (Collapsible) ─────────────── */
+.phase {
+    margin-bottom: var(--sp-6);
+}
+.phase-hdr {
+    display: flex;
+    align-items: center;
+    gap: var(--sp-2);
+    cursor: pointer;
+    padding: var(--sp-2) 0;
+    user-select: none;
+    border-bottom: 2px solid var(--border);
+    margin-bottom: var(--sp-3);
+    transition: border-color 0.15s ease;
+}
+.phase-hdr:hover {
+    border-bottom-color: var(--accent);
+}
+.phase-hdr:hover h2 {
+    color: var(--accent);
+}
+.phase-hdr h2 {
+    transition: color 0.15s ease;
+}
+.phase-hdr .arr {
+    transition: transform 0.2s ease;
+    font-size: var(--text-xs);
+    color: var(--text-muted);
+}
+.phase-hdr.closed .arr {
+    transform: rotate(-90deg);
+}
+.phase-cnt {
+    font-size: var(--text-xs);
+    font-family: var(--font-mono);
+    color: var(--text-faint);
+    margin-left: auto;
+    letter-spacing: var(--ls-wide);
+}
+/* ─── Prompt List ─────────────────────────────── */
+.plist {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sp-2);
+}
+/* ─── Prompt Cards ────────────────────────────── */
+.pcard {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    padding: var(--sp-3) var(--sp-4);
+    box-shadow: var(--shadow-sm);
+    display: grid;
+    grid-template-columns: auto 1fr auto;
+    gap: var(--sp-2) var(--sp-3);
+    align-items: start;
+    transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
+}
+.pcard:hover {
+    box-shadow: var(--shadow);
+    transform: translateY(-1px);
+    border-color: var(--accent-glow);
+}
+/* ─── Status Badges ──────────────────────────── */
+.status-badge {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--sp-1);
+    font-size: var(--text-xs);
+    font-weight: var(--fw-medium);
+    padding: 2px var(--sp-2);
+    border-radius: 99px;
+    white-space: nowrap;
+    flex-shrink: 0;
+    letter-spacing: var(--ls-wide);
+    line-height: var(--lh-tight);
+}
+.st-completed {
+    background: var(--green-bg);
+    color: var(--green);
+    border: 1px solid var(--green-border);
+}
+.st-likely-completed {
+    background: var(--blue-bg);
+    color: var(--blue);
+    border: 1px solid var(--blue-border);
+}
+.st-skipped {
+    background: var(--gray-bg);
+    color: var(--gray);
+    border: 1px solid var(--gray-border);
+}
+.st-pending {
+    background: var(--bg-inset);
+    color: var(--text-faint);
+    border: 1px solid var(--border);
+}
+/* ─── Status Legend ──────────────────────────── */
+.status-legend {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--sp-2);
+    margin-bottom: var(--sp-4);
+    padding: var(--sp-2) 0;
+}
+.status-legend .status-badge {
+    cursor: default;
+}
+/* ─── Prompt Card Inner ───────────────────────── */
+.pinfo {
+    min-width: 0;
+}
+.pname {
+    font-weight: var(--fw-semi);
+    font-size: var(--text-base);
+}
+.pstep {
+    font-size: var(--text-xs);
+    font-family: var(--font-mono);
+    color: var(--text-faint);
+    letter-spacing: var(--ls-wide);
+}
+.pdesc {
+    font-size: var(--text-sm);
+    color: var(--text-muted);
+    margin-top: 2px;
+    line-height: var(--lh-relaxed);
+}
+.pdesc-long {
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    margin-top: 2px;
+}
+.pdeps {
+    font-size: var(--text-xs);
+    color: var(--yellow);
+    margin-top: var(--sp-1);
+    font-weight: var(--fw-medium);
+}
+/* ─── Copy Command Button ─────────────────────── */
+.pcmd {
+    font-family: var(--font-mono);
+    font-size: var(--text-xs);
+    background: var(--bg-inset);
+    padding: 3px var(--sp-2);
+    border-radius: var(--radius-sm);
+    cursor: pointer;
+    border: 1px solid var(--border);
+    white-space: nowrap;
+    align-self: center;
+    color: var(--text-muted);
+    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
+    letter-spacing: var(--ls-wide);
+}
+.pcmd:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+    background: var(--accent-glow);
+}
+.pcmd.copied {
+    border-color: var(--green);
+    color: var(--green);
+    background: var(--green-bg);
+}
+/* ─── Prompt Modal ────────────────────────────── */
+.modal-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.6);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1000;
+    padding: var(--sp-4);
+}
+.modal {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    box-shadow: var(--shadow-lg);
+    max-width: 720px;
+    width: 100%;
+    max-height: 85vh;
+    display: flex;
+    flex-direction: column;
+}
+.modal-header {
+    display: flex;
+    align-items: center;
+    gap: var(--sp-3);
+    padding: var(--sp-4) var(--sp-5);
+    border-bottom: 1px solid var(--border);
+    flex-shrink: 0;
+}
+.modal-header h3 {
+    font-size: var(--text-lg);
+    font-weight: var(--fw-semi);
+    flex: 1;
+    min-width: 0;
+}
+.modal-close {
+    background: var(--bg-inset);
+    border: 1px solid var(--border);
+    border-radius: var(--radius-sm);
+    padding: var(--sp-1) var(--sp-2);
+    cursor: pointer;
+    font-size: var(--text-base);
+    color: var(--text-muted);
+    line-height: 1;
+    transition: border-color 0.15s ease, color 0.15s ease;
+}
+.modal-close:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+}
+.modal-body {
+    padding: var(--sp-5);
+    overflow-y: auto;
+    flex: 1;
+}
+.modal-body pre {
+    font-family: var(--font-mono);
+    font-size: var(--text-sm);
+    line-height: var(--lh-relaxed);
+    white-space: pre-wrap;
+    word-break: break-word;
+    color: var(--text);
+}
+.modal-body pre .md-heading {
+    font-weight: var(--fw-bold);
+    color: var(--accent);
+}
+.modal-body pre .md-code {
+    background: var(--bg-inset);
+    padding: 1px 4px;
+    border-radius: 3px;
+    font-size: var(--text-xs);
+}
+.modal-footer {
+    display: flex;
+    gap: var(--sp-2);
+    padding: var(--sp-3) var(--sp-5);
+    border-top: 1px solid var(--border);
+    flex-shrink: 0;
+}
+.modal-copy-btn {
+    background: var(--accent);
+    color: #fff;
+    border: none;
+    border-radius: var(--radius-sm);
+    padding: var(--sp-2) var(--sp-4);
+    font-size: var(--text-sm);
+    font-weight: var(--fw-medium);
+    cursor: pointer;
+    transition: background 0.15s ease;
+}
+.modal-copy-btn:hover {
+    background: var(--accent-hover);
+}
+.modal-copy-btn.copied {
+    background: var(--green);
+}
+/* ─── Beads Task Section ─────────────────────── */
+.beads-section {
+    margin-top: var(--sp-8);
+    margin-bottom: var(--sp-6);
+}
+.beads-filters {
+    display: flex;
+    gap: var(--sp-2);
+    margin-bottom: var(--sp-3);
+}
+.beads-filter {
+    background: var(--bg-inset);
+    border: 1px solid var(--border);
+    border-radius: 99px;
+    padding: var(--sp-1) var(--sp-3);
+    font-size: var(--text-xs);
+    font-weight: var(--fw-medium);
+    color: var(--text-muted);
+    cursor: pointer;
+    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
+    letter-spacing: var(--ls-wide);
+}
+.beads-filter:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+}
+.beads-filter.active {
+    background: var(--accent);
+    color: #fff;
+    border-color: var(--accent);
+}
+/* ─── Beads Status Badges ────────────────────── */
+.st-bead-open {
+    background: var(--accent-glow);
+    color: var(--accent);
+    border: 1px solid var(--accent);
+}
+.st-bead-progress {
+    background: var(--blue-bg);
+    color: var(--blue);
+    border: 1px solid var(--blue-border);
+}
+.st-bead-blocked {
+    background: var(--yellow-bg);
+    color: var(--yellow);
+    border: 1px solid var(--yellow-border);
+}
+.st-bead-deferred {
+    background: var(--gray-bg);
+    color: var(--gray);
+    border: 1px solid var(--gray-border);
+}
+.st-bead-closed {
+    background: var(--green-bg);
+    color: var(--green);
+    border: 1px solid var(--green-border);
+}
+/* ─── Beads Filter Separator ─────────────────── */
+.beads-filter-sep {
+    width: 1px;
+    background: var(--border);
+    align-self: stretch;
+    margin: 0 var(--sp-1);
+}
+/* ─── Beads Priority Filter ──────────────────── */
+.beads-prio-filter {
+    background: var(--bg-inset);
+    border: 1px solid var(--border);
+    border-radius: 99px;
+    padding: var(--sp-1) var(--sp-3);
+    font-size: var(--text-xs);
+    font-weight: var(--fw-medium);
+    color: var(--text-muted);
+    cursor: pointer;
+    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
+    letter-spacing: var(--ls-wide);
+}
+.beads-prio-filter:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+}
+.beads-prio-filter.active {
+    background: var(--accent);
+    color: #fff;
+    border-color: var(--accent);
+}
+/* ─── Beads Task Detail Modal ────────────────── */
+.bead-meta-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: var(--sp-3);
+    padding: var(--sp-4) 0;
+    border-bottom: 1px solid var(--border-light);
+}
+.bead-meta-item {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+}
+.bead-meta-label {
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    text-transform: uppercase;
+    letter-spacing: var(--ls-wide);
+    font-weight: var(--fw-medium);
+}
+.bead-meta-value {
+    font-size: var(--text-sm);
+    font-weight: var(--fw-medium);
+    color: var(--text);
+}
+.bead-description {
+    padding: var(--sp-4) 0;
+    border-bottom: 1px solid var(--border-light);
+    white-space: pre-wrap;
+    font-size: var(--text-sm);
+    line-height: var(--lh-relaxed);
+    color: var(--text-muted);
+}
+.bead-deps {
+    padding: var(--sp-4) 0;
+    border-bottom: 1px solid var(--border-light);
+}
+.bead-dep-group {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--sp-2);
+    margin-bottom: var(--sp-2);
+}
+.bead-dep-group:last-child {
+    margin-bottom: 0;
+}
+.bead-dep-label {
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    text-transform: uppercase;
+    letter-spacing: var(--ls-wide);
+    font-weight: var(--fw-medium);
+    min-width: 80px;
+}
+.bead-dep-link {
+    display: inline-block;
+    font-family: var(--font-mono);
+    font-size: var(--text-xs);
+    padding: 2px var(--sp-2);
+    border-radius: 99px;
+    background: var(--accent-glow);
+    color: var(--accent);
+    border: 1px solid var(--accent);
+    cursor: pointer;
+    transition: background 0.15s ease, color 0.15s ease;
+    text-decoration: none;
+}
+.bead-dep-link:hover {
+    background: var(--accent);
+    color: #fff;
+}
+.bead-timestamps {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--sp-4);
+    padding: var(--sp-4) 0;
+}
+.bead-ts-item {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+}
+.bead-ts-label {
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    text-transform: uppercase;
+    letter-spacing: var(--ls-wide);
+    font-weight: var(--fw-medium);
+}
+.bead-ts-value {
+    font-size: var(--text-sm);
+    color: var(--text-muted);
+}
+.bead-ts-value[title] {
+    border-bottom: 1px dotted var(--text-faint);
+    cursor: help;
+}
+/* ─── Standalone Commands Section ─────────────── */
+.ongoing {
+    margin-top: var(--sp-10);
+}
+.ongoing h2 {
+    letter-spacing: var(--ls-wide);
+    text-transform: uppercase;
+    font-size: var(--text-sm);
+    color: var(--text-muted);
+    margin-bottom: var(--sp-4);
+    border-bottom: 2px solid var(--border);
+    padding-bottom: var(--sp-2);
+}
+/* ─── Footer ──────────────────────────────────── */
+.footer {
+    text-align: center;
+    font-size: var(--text-xs);
+    color: var(--text-faint);
+    margin-top: var(--sp-10);
+    padding-top: var(--sp-4);
+    border-top: 1px solid var(--border-light);
+    letter-spacing: var(--ls-wide);
+}
+/* ─── Utilities ───────────────────────────────── */
+.hidden {
+    display: none;
+}
+/* Build-observability severity + verdict tokens (Plan 4) */
+:root {
+  --sev-p0: #dc2626;        /* red 600 */
+  --sev-p1: #ea580c;        /* orange 600 */
+  --sev-p2: #ca8a04;        /* yellow 600 */
+  --sev-p3: #2563eb;        /* blue 600 */
+  --sev-pass: #16a34a;      /* green 600 */
+}
+[data-theme="dark"] {
+  --sev-p0: #f87171;
+  --sev-p1: #fb923c;
+  --sev-p2: #facc15;
+  --sev-p3: #60a5fa;
+  --sev-pass: #4ade80;
+}
+/* Build-observability panel layout */
+.panel {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    padding: var(--sp-4) var(--sp-6);
+    margin-bottom: var(--sp-6);
+}
+.panel > header {
+    display: flex;
+    align-items: center;
+    gap: var(--sp-3);
+    margin-bottom: var(--sp-4);
+    flex-wrap: wrap;
+}
+.panel > header h2 {
+    margin: 0;
+    font-size: var(--text-base);
+    font-weight: var(--fw-semi);
+}
+.panel .meta {
+    color: var(--text-muted);
+    font-size: var(--text-sm);
+}
+.grid { display: grid; gap: var(--sp-4); }
+.grid-2 { grid-template-columns: repeat(2, 1fr); }
+@media (max-width: 640px) { .grid-2 { grid-template-columns: 1fr; } }
+/* Finding filters */
+.finding-filters {
+    display: flex;
+    gap: var(--sp-2);
+    flex-wrap: wrap;
+    margin-bottom: var(--sp-4);
+}
+.finding-filters button {
+    padding: var(--sp-1) var(--sp-3);
+    border: 1px solid var(--border);
+    border-radius: var(--radius-sm);
+    background: var(--bg-inset);
+    color: var(--text);
+    font-size: var(--text-sm);
+    cursor: pointer;
+}
+.finding-filters button:hover,
+.finding-filters button.active {
+    background: var(--accent);
+    border-color: var(--accent);
+    color: #fff;
+}
+/* Findings list */
+.findings {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    gap: var(--sp-3);
+}
+.finding {
+    background: var(--bg-inset);
+    border: 1px solid var(--border-light);
+    border-radius: var(--radius-sm);
+    padding: var(--sp-3) var(--sp-4);
+}
+.finding header {
+    display: flex;
+    align-items: center;
+    gap: var(--sp-2);
+    flex-wrap: wrap;
+    margin-bottom: var(--sp-2);
+}
+.finding-id {
+    font-family: var(--font-mono, monospace);
+    font-size: var(--text-xs);
+    color: var(--text-muted);
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    padding: 1px var(--sp-1);
+}
+.finding .lens {
+    font-size: var(--text-xs);
+    color: var(--text-muted);
+}
+.finding .title {
+    font-size: var(--text-sm);
+    font-weight: var(--fw-semi);
+    flex: 1;
+}
+.finding p { margin: 0; font-size: var(--text-sm); color: var(--text-muted); }
+.empty { color: var(--text-muted); font-size: var(--text-sm); text-align: center; padding: var(--sp-4); }
+/* ── Mermaid diagrams ─────────────────────────────────────────────────────────
+   The build renders mermaid to inline SVG via mmdc, then sanitizeSvg() +
+   rehype-sanitize strip the SVG's own <script>, <foreignObject>, AND <style>
+   for security. Stripping <style> means the diagram arrives unstyled (nodes
+   default to a black fill). These theme-token rules restyle the SVG so nodes,
+   edges, arrowheads, and labels render correctly — and follow light/dark mode.
+   Authors must render with htmlLabels:false (the generator forces this) so node
+   labels are native <text>/<tspan> rather than stripped <foreignObject> HTML. */
+figure.mermaid { margin: var(--sp-5) 0; text-align: center; }
+figure.mermaid svg { max-width: 100%; height: auto; }
+/* Node shapes */
+figure.mermaid svg .node rect,
+figure.mermaid svg .node circle,
+figure.mermaid svg .node ellipse,
+figure.mermaid svg .node polygon,
+figure.mermaid svg .node path {
+    fill: var(--bg-inset);
+    stroke: var(--border);
+    stroke-width: 1px;
+}
+/* Background helper rects mermaid emits behind labels */
+figure.mermaid svg .node .label-container { fill: var(--bg-inset); stroke: var(--border); }
+figure.mermaid svg rect.background { fill: none; stroke: none; }
+/* Labels (rendered as <text>/<tspan> when htmlLabels:false) */
+figure.mermaid svg .nodeLabel,
+figure.mermaid svg .node text,
+figure.mermaid svg text.nodeLabel,
+figure.mermaid svg .label text,
+figure.mermaid svg span.nodeLabel {
+    fill: var(--text);
+    color: var(--text);
+    font-family: var(--font-sans);
+}
+/* Edges: thin strokes, not filled blobs */
+figure.mermaid svg .edgePath path,
+figure.mermaid svg path.flowchart-link,
+figure.mermaid svg .flowchart-link {
+    fill: none;
+    stroke: var(--text-faint);
+    stroke-width: 1.5px;
+}
+/* Arrowheads */
+figure.mermaid svg marker path,
+figure.mermaid svg .marker {
+    fill: var(--text-faint);
+    stroke: var(--text-faint);
+}
+figure.mermaid svg .edgeLabel,
+figure.mermaid svg .edgeLabel text { fill: var(--text-muted); color: var(--text-muted); }
+/* ============================================================================
+ * guides.css — component + layout styles for `scaffold guides` reference pages.
+ *
+ * Pairs with lib/dashboard-theme.css (the token source) and src/guides/chrome.ts
+ * (the behavior). Styles the guide CHROME (.topbar, .layout, .rail, nav.toc,
+ * .content) and the markdown DIRECTIVES (callouts, sev chips, filter-tables,
+ * charts, tabs, citations) plus base prose typography.
+ *
+ * DESIGN SYSTEM: all COLORS come from dashboard-theme.css tokens, and spacing
+ * uses the --sp-* scale wherever it maps. The few structural layout constants
+ * (topbar height, rail/drawer width, chart label column, card min) are declared
+ * as local custom properties below; a handful of sub-scale UI values (chip/bar
+ * sizing, em-based inline-code padding) and the responsive breakpoint are
+ * literal because no token expresses them. Both themes are covered because every
+ * color is a token.
+ * ==========================================================================*/
+:root {
+  --topbar-h: 52px;       /* sticky topbar height; rail sticky offset keys off it */
+  --rail-w: 260px;        /* desktop TOC sidebar column */
+  --drawer-w: 280px;      /* mobile off-canvas TOC drawer */
+  --card-min: 260px;      /* index card min track width */
+  --chart-label-w: 90px;  /* chart row label column min */
+}
+/* ── Base / reset on top of the token base in dashboard-theme.css ─────────── */
+.content a { color: var(--accent); text-decoration: none; }
+.content a:hover { text-decoration: underline; }
+.content strong { font-weight: var(--fw-semi); }
+.content hr { border: 0; border-top: 1px solid var(--border-light); margin: var(--sp-6) 0; }
+/* Consistent keyboard focus for every interactive control (a11y). */
+.topbar button:focus-visible,
+.copy-btn:focus-visible,
+.tab-btn:focus-visible,
+.filter-input:focus-visible,
+nav.toc a:focus-visible,
+.guide-card:focus-visible,
+.content a:focus-visible {
+  outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--radius-sm);
+}
+/* ── Topbar ────────────────────────────────────────────────────────────────*/
+.topbar {
+  position: sticky; top: 0; z-index: 60; height: var(--topbar-h);
+  display: flex; align-items: center; gap: var(--sp-3);
+  padding: 0 var(--page-pad);
+  background: var(--bg-card); border-bottom: 1px solid var(--border);
+}
+.topbar h1 {
+  flex: 1; min-width: 0; margin: 0;
+  font-size: var(--text-lg); font-weight: var(--fw-bold);
+  letter-spacing: var(--ls-tight);
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+}
+.topbar button {
+  background: var(--bg-card); border: 1px solid var(--border); color: var(--text);
+  border-radius: var(--radius-sm); padding: var(--sp-1) var(--sp-3); font-size: var(--text-base);
+  line-height: 1; cursor: pointer; font-family: inherit;
+}
+.topbar button:hover { background: var(--bg-hover); border-color: var(--accent); }
+.nav-toggle { display: none; }
+/* ── Layout: sticky sidebar TOC + reading-width content ──────────────────── */
+.layout {
+  max-width: var(--max-w); margin: 0 auto;
+  display: grid; grid-template-columns: var(--rail-w) minmax(0, 1fr);
+  gap: var(--sp-8); padding: 0 var(--page-pad);
+}
+.rail {
+  position: sticky; top: var(--topbar-h); align-self: start;
+  height: calc(100vh - var(--topbar-h)); overflow-y: auto;
+  padding: var(--sp-5) 0; border-right: 1px solid var(--border-light);
+}
+.content { min-width: 0; padding: var(--sp-6) 0 var(--sp-10); }
+/* Backdrop behind the mobile drawer (toggled with the rail via chrome.ts). */
+.rail-backdrop { display: none; }
+/* In-drawer close button — hidden on desktop (the rail is a static sidebar). */
+.rail-close { display: none; }
+/* ── Table of contents (scrollspy marks a.active) ────────────────────────── */
+nav.toc ul { list-style: none; margin: 0; padding: 0; }
+nav.toc li { margin: 0; }
+nav.toc a {
+  display: block; padding: var(--sp-1) var(--sp-3); line-height: 1.35;
+  color: var(--text-muted); font-size: var(--text-sm);
+  text-decoration: none; border-left: 2px solid transparent;
+  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
+}
+nav.toc a:hover { color: var(--text); background: var(--bg-hover); }
+nav.toc a.active {
+  color: var(--accent); border-left-color: var(--accent);
+  background: var(--accent-glow); font-weight: var(--fw-medium);
+}
+nav.toc li.toc-3 a { padding-left: var(--sp-6); font-size: var(--text-xs); }
+/* ── Prose typography ──────────────────────────────────────────────────────*/
+.content h2 {
+  font-size: var(--text-xl); letter-spacing: var(--ls-tight);
+  margin: var(--sp-8) 0 var(--sp-3); padding-bottom: var(--sp-2);
+  border-bottom: 1px solid var(--border-light); scroll-margin-top: calc(var(--topbar-h) + var(--sp-3));
+}
+.content h3 {
+  font-size: var(--text-lg); margin: var(--sp-5) 0 var(--sp-2);
+  scroll-margin-top: calc(var(--topbar-h) + var(--sp-3));
+}
+.content p { margin: var(--sp-3) 0; line-height: var(--lh-relaxed); }
+.content ul, .content ol { margin: var(--sp-3) 0; padding-left: var(--sp-6); }
+.content li { margin: var(--sp-1) 0; line-height: var(--lh-relaxed); }
+.content blockquote {
+  margin: var(--sp-3) 0; padding: var(--sp-1) var(--sp-4);
+  border-left: 3px solid var(--border); color: var(--text-muted);
+}
+/* ── Inline code + code blocks (chrome.ts wraps <pre> in .code + .copy-btn) ──*/
+.content code {
+  font-family: var(--font-mono); font-size: 0.85em;
+  background: var(--bg-inset); padding: 0.12em 0.4em; border-radius: var(--radius-sm);
+}
+.content .code { position: relative; margin: var(--sp-3) 0; }
+.content .code pre {
+  margin: 0; padding: var(--sp-3) var(--sp-4); overflow-x: auto;
+  background: var(--bg-inset); border: 1px solid var(--border-light);
+  border-radius: var(--radius-sm); font-family: var(--font-mono);
+  font-size: var(--text-sm); line-height: var(--lh-relaxed);
+}
+.content .code pre code { background: none; padding: 0; font-size: inherit; }
+.copy-btn {
+  position: absolute; top: var(--sp-1); right: var(--sp-1);
+  background: var(--bg-card); border: 1px solid var(--border); color: var(--text-muted);
+  border-radius: var(--radius-sm); font-size: var(--text-xs); padding: var(--sp-1) var(--sp-2);
+  cursor: pointer; opacity: 0.85; font-family: inherit;
+}
+.copy-btn:hover { color: var(--accent); border-color: var(--accent); opacity: 1; }
+/* ── Callouts ─ (border-color BEFORE border-left-color so the accent wins) ── */
+.callout {
+  margin: var(--sp-4) 0; padding: var(--sp-3) var(--sp-4);
+  border: 1px solid var(--border); border-left-width: 3px;
+  border-radius: var(--radius-sm); background: var(--bg-card);
+}
+.callout > :first-child { margin-top: 0; }
+.callout > :last-child { margin-bottom: 0; }
+.callout-note, .callout-info { background: var(--blue-bg);   border-color: var(--blue-border);   border-left-color: var(--blue); }
+.callout-tip                 { background: var(--green-bg);  border-color: var(--green-border);  border-left-color: var(--green); }
+.callout-warning             { background: var(--yellow-bg); border-color: var(--yellow-border); border-left-color: var(--yellow); }
+.callout-danger              { background: var(--red-bg);    border-color: var(--red-border);    border-left-color: var(--red); }
+/* ── Severity chips (:sev) — tight pill, sub-scale vertical padding ───────── */
+.sev {
+  display: inline-block; font-size: var(--text-xs); font-weight: var(--fw-semi);
+  padding: 1px var(--sp-2); border-radius: 999px; line-height: 1.5;
+  border: 1px solid var(--border); background: var(--bg-inset); color: var(--text-muted);
+  white-space: nowrap;
+}
+.sev-p0   { color: var(--sev-p0);   border-color: var(--sev-p0); }
+.sev-p1   { color: var(--sev-p1);   border-color: var(--sev-p1); }
+.sev-p2   { color: var(--sev-p2);   border-color: var(--sev-p2); }
+.sev-p3   { color: var(--sev-p3);   border-color: var(--sev-p3); }
+.sev-pass { color: var(--sev-pass); border-color: var(--sev-pass); }
+/* ── Citations (:cite) — inline provenance refs ──────────────────────────── */
+.fp, .cite-advisory {
+  font-family: var(--font-mono); font-size: 0.82em;
+  padding: 0.05em 0.35em; border-radius: var(--radius-sm);
+  background: var(--bg-inset); border: 1px solid var(--border-light);
+}
+.fp { color: var(--accent); }
+.cite-advisory { color: var(--text-faint); border-style: dashed; }
+/* ── Tables + filter-tables ──────────────────────────────────────────────── */
+.content table { width: 100%; border-collapse: collapse; margin: var(--sp-3) 0; font-size: var(--text-sm); }
+.content th, .content td { text-align: left; padding: var(--sp-2) var(--sp-3); border-bottom: 1px solid var(--border-light); vertical-align: top; }
+.content th {
+  color: var(--text-muted); font-weight: var(--fw-semi); font-size: var(--text-xs);
+  text-transform: uppercase; letter-spacing: var(--ls-wide); border-bottom-color: var(--border);
+}
+.content tbody tr:hover { background: var(--bg-hover); }
+.content td code { white-space: nowrap; }
+.filter-table { margin: var(--sp-4) 0; }
+.filter-input {
+  width: 100%; max-width: 320px; margin-bottom: var(--sp-2);
+  padding: var(--sp-2) var(--sp-3); font-family: inherit; font-size: var(--text-sm);
+  color: var(--text); background: var(--bg-card);
+  border: 1px solid var(--border); border-radius: var(--radius-sm);
+}
+.filter-input:focus { border-color: var(--accent); }
+/* ── Charts (:::chart) — label + proportional bar (fill carries inline width%) */
+.chart-block { margin: var(--sp-4) 0; }
+.chart-row {
+  display: grid; grid-template-columns: minmax(var(--chart-label-w), 24%) 1fr;
+  align-items: center; gap: var(--sp-3); margin: var(--sp-1) 0;
+}
+.chart-label {
+  font-size: var(--text-sm); color: var(--text-muted); text-align: right;
+  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+}
+.chart-row .chart-bar {
+  height: 0.9em; min-width: 2px; background: var(--accent);
+  border-radius: var(--radius-sm);
+}
+/* ── Tabs (::::tabs / :::tab) ─────────────────────────────────────────────── */
+.tabs { margin: var(--sp-4) 0; }
+.tablist { display: flex; flex-wrap: wrap; gap: var(--sp-1); border-bottom: 1px solid var(--border); margin-bottom: var(--sp-3); }
+.tab-btn {
+  background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px;
+  padding: var(--sp-2) var(--sp-3); color: var(--text-muted);
+  font-family: inherit; font-size: var(--text-sm); font-weight: var(--fw-medium); cursor: pointer;
+}
+.tab-btn:hover { color: var(--text); }
+.tab-btn.active { color: var(--accent); border-bottom-color: var(--accent); }
+.tabpane { display: none; }
+.tabpane.active { display: block; }
+/* ── Mermaid diagrams ────────────────────────────────────────────────────── */
+.content figure { margin: var(--sp-4) 0; text-align: center; }
+.content figure svg, .content > svg, .content .mermaid svg { max-width: 100%; height: auto; }
+/* ── Index page: category card grid ──────────────────────────────────────── */
+.content .lead { color: var(--text-muted); font-size: var(--text-base); max-width: 60ch; margin-top: var(--sp-2); }
+.guide-cards {
+  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(var(--card-min), 100%), 1fr));
+  gap: var(--sp-4); margin: var(--sp-4) 0 var(--sp-6);
+}
+.guide-card {
+  display: flex; flex-direction: column; gap: var(--sp-2);
+  padding: var(--sp-4); background: var(--bg-card);
+  border: 1px solid var(--border); border-radius: var(--radius);
+  color: inherit; text-decoration: none;
+  transition: border-color 0.15s ease, box-shadow 0.15s ease;
+}
+.guide-card:hover { border-color: var(--accent); box-shadow: var(--shadow-md); text-decoration: none; }
+.guide-card-title { font-weight: var(--fw-semi); color: var(--accent); font-size: var(--text-base); }
+.guide-card-desc { color: var(--text-muted); font-size: var(--text-sm); line-height: var(--lh-normal); }
+/* ── Responsive: TOC becomes an off-canvas drawer (chrome.ts toggles .open) ──*/
+/* 860px is literal — media queries cannot read custom properties. Revisit it if
+   --topbar-h / --rail-w / --drawer-w change (the drawer sticky offsets key off them). */
+@media (max-width: 860px) {
+  .nav-toggle { display: inline-flex; align-items: center; }
+  .layout { grid-template-columns: 1fr; gap: 0; }
+  .rail {
+    position: fixed; top: var(--topbar-h); left: 0; bottom: 0; width: var(--drawer-w); z-index: 50;
+    height: auto; background: var(--bg-card); border-right: 1px solid var(--border);
+    padding: var(--sp-4); box-shadow: var(--shadow-lg);
+    transform: translateX(-100%); transition: transform 0.2s ease, visibility 0.2s ease;
+    /* Closed drawer is off-screen AND removed from tab order / pointer events. */
+    visibility: hidden; pointer-events: none;
+  }
+  .rail.open { transform: translateX(0); visibility: visible; pointer-events: auto; }
+  .rail-close {
+    display: block; margin-left: auto; margin-bottom: var(--sp-2);
+    background: var(--bg-card); border: 1px solid var(--border); color: var(--text);
+    border-radius: var(--radius-sm); padding: var(--sp-1) var(--sp-3); font-size: var(--text-base);
+    line-height: 1; cursor: pointer; font-family: inherit;
+  }
+  .rail-close:hover { background: var(--bg-hover); border-color: var(--accent); }
+  .rail-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+  .rail-backdrop {
+    display: block; position: fixed; inset: var(--topbar-h) 0 0 0;
+    background: var(--scrim); z-index: 49;
+    opacity: 0; pointer-events: none; transition: opacity 0.2s ease;
+  }
+  .rail.open ~ .rail-backdrop { opacity: 1; pointer-events: auto; }
+}
+</style>
+<script>(function(){try{var t=localStorage.getItem('guide-theme');if(!t&&window.matchMedia&&matchMedia('(prefers-color-scheme: dark)').matches)t='dark';if(t)document.documentElement.setAttribute('data-theme',t);}catch(e){}})();</script>
+</head>
+<body>
+<header class="topbar">
+  <button data-action="nav" class="nav-toggle" aria-label="Toggle navigation"
+    aria-expanded="false" aria-controls="guide-toc">☰</button>
+  <h1>Concepts &amp; Glossary</h1>
+  <button data-action="theme" class="theme-toggle" aria-label="Toggle theme">◐</button>
+</header>
+<div class="layout">
+  <aside class="rail" id="guide-toc">
+    <button class="rail-close" data-action="nav" aria-label="Close navigation">✕</button>
+    <nav class="toc" aria-label="Table of contents"><ul><li class="toc-2"><a href="#how-to-read-this-guide">How to read this guide</a></li><li class="toc-2"><a href="#pipeline-concepts">Pipeline concepts</a></li><li class="toc-3"><a href="#phase">Phase</a></li><li class="toc-3"><a href="#planning-vs-build-regime">Planning vs. build regime</a></li><li class="toc-3"><a href="#dependencies-hard-gate">dependencies (hard gate)</a></li><li class="toc-3"><a href="#reads-soft-reference">reads (soft reference)</a></li><li class="toc-3"><a href="#conditional-if-needed">Conditional / if-needed</a></li><li class="toc-3"><a href="#stateless-step">Stateless step</a></li><li class="toc-3"><a href="#create-vs-update-mode">CREATE vs. UPDATE mode</a></li><li class="toc-3"><a href="#methodology-preset">Methodology preset</a></li><li class="toc-3"><a href="#depth-15">Depth (1–5)</a></li><li class="toc-3"><a href="#overlay">Overlay</a></li><li class="toc-2"><a href="#observability-concepts">Observability concepts</a></li><li class="toc-3"><a href="#ledger">Ledger</a></li><li class="toc-3"><a href="#event">Event</a></li><li class="toc-3"><a href="#adapter">Adapter</a></li><li class="toc-3"><a href="#lens-ai">Lens (A–I)</a></li><li class="toc-3"><a href="#finding">Finding</a></li><li class="toc-3"><a href="#audit-verdict">Audit verdict</a></li><li class="toc-3"><a href="#fix-threshold">fix_threshold</a></li><li class="toc-3"><a href="#--fix-flow">--fix flow</a></li><li class="toc-3"><a href="#stall-signal">Stall signal</a></li><li class="toc-3"><a href="#phase-boundary-audit">Phase-boundary audit</a></li><li class="toc-3"><a href="#doc-conformance-channel">doc-conformance channel</a></li><li class="toc-2"><a href="#knowledge-concepts">Knowledge concepts</a></li><li class="toc-3"><a href="#knowledge-entry">Knowledge entry</a></li><li class="toc-3"><a href="#volatility-tier">Volatility tier</a></li><li class="toc-3"><a href="#knowledge-gap-signal">Knowledge-gap signal</a></li><li class="toc-2"><a href="#review-concepts">Review concepts</a></li><li class="toc-3"><a href="#channel">Channel</a></li><li class="toc-3"><a href="#compensating-pass">Compensating pass</a></li><li class="toc-3"><a href="#reconcile">Reconcile</a></li><li class="toc-3"><a href="#finding-key">finding_key</a></li><li class="toc-3"><a href="#mmr-verdict">MMR verdict</a></li><li class="toc-2"><a href="#multi-agent-concepts">Multi-agent concepts</a></li><li class="toc-3"><a href="#worktree">Worktree</a></li><li class="toc-3"><a href="#worktree-identity">Worktree identity</a></li><li class="toc-3"><a href="#ledger-harvest">Ledger harvest</a></li><li class="toc-3"><a href="#teardown">Teardown</a></li><li class="toc-2"><a href="#see-also">See also</a></li></ul></nav>
+  </aside>
+  <main class="content"><h2 id="how-to-read-this-guide">How to read this guide</h2>
+<p>Scaffold's other guides each go deep on one system; this one is the <strong>map of the
+vocabulary</strong> they share. Every term below gets a short definition and a link to
+the guide that owns the full story. When two guides use the same word slightly
+differently (a "verdict" in MMR vs. in the audit engine; a "lens" that lives in
+the audit but reasons about the knowledge base), this guide is where the seam is
+named.</p>
+<p>Terms cluster into four families:</p>
+<ul>
+<li><strong>Pipeline</strong> — how an idea becomes a build-ready spec.</li>
+<li><strong>Observability</strong> — the durable record of what the build actually did.</li>
+<li><strong>Review</strong> — how independent models gate changes.</li>
+<li><strong>Multi-agent</strong> — how parallel worktrees coordinate without stepping on each other.</li>
+</ul>
+<div class="filter-table"><input type="text" class="filter-input" placeholder="Filter…" aria-label="Filter table rows" disabled>
+<table><thead><tr><th>Term</th><th>Cluster</th><th>See also</th></tr></thead><tbody><tr><td>Phase</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Planning vs. build regime</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td><code>dependencies</code> (hard gate)</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td><code>reads</code> (soft reference)</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Conditional / <code>if-needed</code></td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Stateless step</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>CREATE vs. UPDATE mode</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Methodology preset</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Depth (1–5)</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Overlay</td><td>Pipeline</td><td><a href="../pipeline/index.md">pipeline</a></td></tr><tr><td>Ledger</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Event</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Adapter</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Lens (A–I)</td><td>Observability</td><td><a href="../observability/index.md">observability</a> · <a href="../knowledge-freshness/index.md">knowledge-freshness</a></td></tr><tr><td>Finding</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Audit verdict</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td><code>fix_threshold</code></td><td>Observability · Review</td><td><a href="../observability/index.md">observability</a> · <a href="../mmr/index.md">mmr</a></td></tr><tr><td><code>--fix</code> flow</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Stall signal</td><td>Observability</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Phase-boundary audit</td><td>Observability · Pipeline</td><td><a href="../observability/index.md">observability</a> · <a href="../pipeline/index.md">pipeline</a></td></tr><tr><td><code>doc-conformance</code> channel</td><td>Observability · Review</td><td><a href="../observability/index.md">observability</a> · <a href="../mmr/index.md">mmr</a></td></tr><tr><td>Knowledge entry</td><td>Knowledge</td><td><a href="../knowledge-freshness/index.md">knowledge-freshness</a> · <a href="../knowledge/index.md">knowledge</a></td></tr><tr><td>Volatility tier</td><td>Knowledge</td><td><a href="../knowledge-freshness/index.md">knowledge-freshness</a></td></tr><tr><td>Knowledge-gap signal</td><td>Knowledge</td><td><a href="../knowledge-freshness/index.md">knowledge-freshness</a></td></tr><tr><td>Channel</td><td>Review</td><td><a href="../mmr/index.md">mmr</a> · <a href="../review-workflow/index.md">review-workflow</a></td></tr><tr><td>Compensating pass</td><td>Review</td><td><a href="../mmr/index.md">mmr</a></td></tr><tr><td>Reconcile</td><td>Review</td><td><a href="../mmr/index.md">mmr</a></td></tr><tr><td><code>finding_key</code></td><td>Review</td><td><a href="../mmr/index.md">mmr</a></td></tr><tr><td>MMR verdict</td><td>Review</td><td><a href="../mmr/index.md">mmr</a></td></tr><tr><td>Worktree</td><td>Multi-agent</td><td><a href="../multi-agent/index.md">multi-agent</a> · <a href="../observability/index.md">observability</a></td></tr><tr><td>Worktree identity</td><td>Multi-agent</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Ledger harvest</td><td>Multi-agent</td><td><a href="../observability/index.md">observability</a></td></tr><tr><td>Teardown</td><td>Multi-agent</td><td><a href="../observability/index.md">observability</a></td></tr></tbody></table></div>
+<h2 id="pipeline-concepts">Pipeline concepts</h2>
+<p>These describe the meta-prompt pipeline that turns an idea into a frozen,
+build-ready spec. Full treatment: <a href="../pipeline/index.md">the pipeline guide</a>.</p>
+<h3 id="phase">Phase</h3>
+<p>One of the <strong>16 ordered stages</strong> the pipeline divides into, numbered 0 (vision)
+through 15 (build). The phase list, slugs, numbers, and display names are defined
+exactly once, in the <code>PHASES</code> constant
+<span class="fp" data-path="src/types/frontmatter.ts:6">src/types/frontmatter.ts:6</span>; every doc, skill, and command resolves
+against it. Steps within a phase run in <code>order</code> sequence (phase N occupies the
+N00–N99 band). See <a href="../pipeline/index.md#the-16-phases-at-a-glance">the pipeline guide</a>.</p>
+<h3 id="planning-vs-build-regime">Planning vs. build regime</h3>
+<p>The pipeline splits into two regimes. <strong>Planning</strong> (phases 0–14) is <em>stateful</em>
+and <em>sequential</em> — each step produces a durable artifact and is run roughly once,
+in dependency order, working toward a frozen spec. <strong>Build</strong> (phase 15) is
+<em>stateless</em> and <em>on-demand</em> — the execution loops you run repeatedly while
+actually writing code. See <a href="../pipeline/index.md#the-mental-model">the pipeline guide</a>.</p>
+<h3 id="dependencies-hard-gate"><code>dependencies</code> (hard gate)</h3>
+<p>A step's frontmatter <code>dependencies</code> <span class="fp" data-path="src/types/frontmatter.ts:114">src/types/frontmatter.ts:114</span> are
+<strong>hard gates</strong>: <code>scaffold run</code> refuses a step until each dependency is
+<code>completed</code>, <code>skipped</code>, or disabled by the resolved pipeline/overlay (a disabled
+dep counts as satisfied). Contrast <code>reads</code>. See
+<a href="../pipeline/index.md#why-a-step-is-blocked">Why a step is blocked</a>.</p>
+<h3 id="reads-soft-reference"><code>reads</code> (soft reference)</h3>
+<p>A step's <code>reads</code> <span class="fp" data-path="src/types/frontmatter.ts:122">src/types/frontmatter.ts:122</span> are <strong>soft references</strong> — a
+step uses an upstream artifact if it's present, but a missing read never blocks
+execution (the assembler silently skips it). The
+<a href="../pipeline/index.md#why-a-step-is-blocked">pipeline guide</a> explains why
+<code>reads ≠ dependencies</code> is a common trip-up.</p>
+<h3 id="conditional-if-needed">Conditional / <code>if-needed</code></h3>
+<p>A step marked <code>conditional: 'if-needed'</code> <span class="fp" data-path="src/types/frontmatter.ts:118">src/types/frontmatter.ts:118</span> is
+enabled but only <em>applies</em> to certain project shapes (e.g. <code>database-schema</code>
+runs only if your project has a database layer). Conditional steps that don't
+apply count as "satisfied" for dependency purposes. See
+<a href="../pipeline/index.md#conditional-if-needed-steps">Conditional steps</a>.</p>
+<h3 id="stateless-step">Stateless step</h3>
+<p>A phase-15 build step with <code>stateless: true</code> <span class="fp" data-path="src/types/frontmatter.ts:126">src/types/frontmatter.ts:126</span>
+— it carries no completion state and can be run over and over (the agent loops,
+resume commands, <code>quick-task</code>, <code>new-enhancement</code>). The pipeline never tracks or
+gates these. See <a href="../pipeline/index.md#the-mental-model">the pipeline guide</a>.</p>
+<h3 id="create-vs-update-mode">CREATE vs. UPDATE mode</h3>
+<p>Every document-creating prompt detects whether its output file already exists. On
+first run it's <strong>CREATE mode</strong>; on a re-run it's <strong>UPDATE mode</strong>, which preserves
+human/team customizations and changes only what genuinely needs to change. This
+is what makes planning phases safe to iterate. See
+<a href="../pipeline/index.md#create-vs-update-mode">CREATE vs UPDATE mode</a>.</p>
+<h3 id="methodology-preset">Methodology preset</h3>
+<p><em>Which</em> steps are enabled. Three presets ship — <code>mvp</code>, <code>custom</code> (balanced), and
+<code>deep</code> (the schema default and most thorough). Presets are layered with
+<strong>overlays</strong>. See <a href="../pipeline/index.md#methodology-depth">Methodology &#x26; depth</a>.</p>
+<h3 id="depth-15">Depth (1–5)</h3>
+<p><em>How thorough</em> each enabled step's output is, on a 1–5 scale from Minimal to
+Exhaustive (depth 3 is the recommended default). Orthogonal to the preset:
+the preset picks the steps, depth dials each one's detail. At depth 4–5 some
+review/validation steps add external- or multi-model dispatch. See
+<a href="../pipeline/index.md#depth-15">Depth</a>.</p>
+<h3 id="overlay">Overlay</h3>
+<p>A preset layer (<code>content/methodology/*-overlay.yml</code>) applied on top of a
+preset. Overlays are either <strong>project-type</strong> (keyed by <code>project-type</code>, e.g.
+web-app, mobile, CLI, library) or <strong>structural</strong> (e.g. <code>multi-service</code>, which
+has no <code>project-type</code> and is activated by the presence of <code>services[]</code> in
+config). Most overlays only <strong>inject domain knowledge</strong> into existing steps; a
+few <strong>enable whole step families</strong> (game, multi-service). See
+<a href="../pipeline/index.md#project-type-playbooks">Project-type playbooks</a>.</p>
+<h2 id="observability-concepts">Observability concepts</h2>
+<p>These describe Build Observability — the durable record of what the build did,
+and the audit that checks it against the planning docs. Full treatment:
+<a href="../observability/index.md">the build observability guide</a>.</p>
+<h3 id="ledger">Ledger</h3>
+<p>The append-only <code>.scaffold/activity.jsonl</code> file where every durable observation
+lands as one JSON object per line. Writes are lock-guarded so parallel worktrees
+never corrupt it, each event is capped at 4 KiB, and secrets and home paths are
+redacted on the way in and out. See <a href="../observability/index.md#the-ledger">The ledger</a>.</p>
+<h3 id="event">Event</h3>
+<p>One typed entry in the ledger, written via <code>scaffold observe event &#x3C;type> …</code>.
+There are <strong>nine event types</strong> <span class="fp" data-path="src/observability/engine/types.ts:9">src/observability/engine/types.ts:9</span>
+(<code>task_claimed</code>, <code>task_completed</code>, <code>decision_recorded</code>, <code>blocker_hit</code>,
+<code>blocker_resolved</code>, <code>pr_opened</code>, <code>progress_heartbeat</code>, <code>finding_acknowledged</code>,
+<code>knowledge_gap_signal</code>), each with its own payload allow-list. See
+<a href="../observability/index.md#the-nine-event-types">The nine event types</a>.</p>
+<h3 id="adapter">Adapter</h3>
+<p>A component that <em>synthesizes</em> events from the surrounding tools (git, GitHub,
+MMR jobs, pipeline state, test runs) so the timeline reflects more than what
+agents chose to record. Eight adapters exist
+<span class="fp" data-path="src/observability/engine/types.ts:69">src/observability/engine/types.ts:69</span>; five emit replay events, three are
+availability probes. See <a href="../observability/index.md#adapters">Adapters</a>.</p>
+<h3 id="lens-ai">Lens (A–I)</h3>
+<p>An independent audit check function inside <code>scaffold observe audit</code>. The suite
+runs <strong>nine lenses, A through I</strong> — TDD coverage, AC coverage, coding-standards
+drift, tech-stack drift, design-system drift, scope, decisions, cross-doc
+consistency, and knowledge gaps. Lenses A–G run under <code>--scope code</code>, H and I
+under <code>--scope docs</code>. See
+<a href="../observability/index.md#the-nine-lens-audit">The nine-lens audit</a>. <strong>Lens I</strong>
+(<code>I-knowledge-gaps</code>) lives in the audit but reasons about the knowledge base —
+its full behavior is in <a href="../knowledge-freshness/index.md#lens-i-gap-detection-suppression">the knowledge-freshness guide</a>.</p>
+<h3 id="finding">Finding</h3>
+<p>A single issue a lens reports, carrying a severity (<code>P0</code>–<code>P3</code>), a title, a
+source doc, and an optional fix hint. Findings can be <code>open</code>, <code>acknowledged</code>
+(silenced via <code>scaffold observe ack</code>), or <code>skipped</code> (a lens whose required
+adapter was missing). See
+<a href="../observability/index.md#the-nine-lens-audit">The nine-lens audit</a>.</p>
+<h3 id="audit-verdict">Audit verdict</h3>
+<p>The overall result of an audit run. The engine computes exactly <strong>three</strong>
+verdicts <span class="fp" data-path="src/observability/engine/types.ts:6">src/observability/engine/types.ts:6</span>: <code>pass</code> (no blocking
+findings, no skipped lenses), <code>degraded-pass</code> (no blocking findings but ≥1 lens
+skipped), and <code>blocked</code> (≥1 open finding at or above <code>fix_threshold</code>). Note
+this is <strong>not</strong> the same set as MMR's four verdicts — see <a href="#mmr-verdict">MMR verdict</a>.
+See <a href="../observability/index.md#verdict-taxonomy">Verdict taxonomy</a>.</p>
+<h3 id="fix-threshold"><code>fix_threshold</code></h3>
+<p>The severity cutoff that decides which findings count as <em>blocking</em>. A finding
+blocks when its status is <code>open</code> and its severity is at or above the threshold
+(default <strong>P2</strong>). The threshold never hides findings — it only decides which
+ones drive a <code>blocked</code> verdict. The same name and default govern the MMR gate.
+See <a href="../observability/index.md#verdict-taxonomy"><code>fix_threshold</code></a> and the
+<a href="../mmr/index.md#the-gate-the-four-verdicts">MMR gate</a>.</p>
+<h3 id="--fix-flow"><code>--fix</code> flow</h3>
+<p><code>scaffold observe audit --fix</code> doesn't just report blocking findings — it
+dispatches an agent to fix each one, verifies the fix with a single-lens
+re-audit, and writes a post-fix report, all under abort-safe stashing. See
+<a href="../observability/index.md#the---fix-flow">The --fix flow</a>.</p>
+<h3 id="stall-signal">Stall signal</h3>
+<p>A staleness alert raised on the "Needs Attention" surface when
+<code>scaffold observe progress</code> runs — e.g. a claimed task with no recent activity,
+a PR that hasn't merged, an unaddressed blocker. Six signals are defined; five
+fire today. Thresholds are configurable under <code>stall:</code> in
+<code>.scaffold/observability.yaml</code>. See
+<a href="../observability/index.md#stall-detection-the-six-signals">Stall detection</a>.</p>
+<h3 id="phase-boundary-audit">Phase-boundary audit</h3>
+<p>A non-gating cross-document audit that fires automatically when a planning
+document at a phase boundary is marked complete. It runs only the <code>H-cross-doc</code>
+lens at <code>scope=docs</code>, prints a one-line summary, and never blocks the state
+transition. The six boundary steps are <code>user-stories</code>, <code>tech-stack</code>,
+<code>coding-standards</code>, <code>design-system</code>, <code>implementation-plan</code>, and
+<code>implementation-playbook</code>. See
+<a href="../observability/index.md#phase-boundary-triggers">Phase-boundary triggers</a> and
+the <a href="../pipeline/index.md#phase-boundary-audits">pipeline view</a>.</p>
+<h3 id="doc-conformance-channel"><code>doc-conformance</code> channel</h3>
+<p>The seam where the audit plugs into multi-model review: a built-in MMR channel
+that runs <code>scaffold observe audit --output-mode=mmr-findings</code> and emits findings
+in MMR's <code>Finding</code> shape. Disabled by default; enable with
+<code>--channels=doc-conformance</code>. See
+<a href="../observability/index.md#mmr-doc-conformance-channel">MMR doc-conformance channel</a>
+and the <a href="../mmr/index.md#channel-architecture">MMR channel architecture</a>.</p>
+<h2 id="knowledge-concepts">Knowledge concepts</h2>
+<p>These describe the knowledge base and how it stays current. Full treatment:
+<a href="../knowledge-freshness/index.md">the knowledge-freshness guide</a> and
+<a href="../knowledge/index.md">the knowledge guide</a>.</p>
+<h3 id="knowledge-entry">Knowledge entry</h3>
+<p>A domain-expertise document under <code>content/knowledge/&#x3C;category>/&#x3C;slug>.md</code>,
+injected into prompts during assembly. Each declares a <code>name</code>, <code>volatility</code>
+tier, and a list of <code>sources</code>. See
+<a href="../knowledge/index.md">the knowledge guide</a> and
+<a href="../knowledge-freshness/index.md#adding-a-new-entry-to-the-kb">Adding a new entry</a>.</p>
+<h3 id="volatility-tier">Volatility tier</h3>
+<p>How often an entry is expected to drift, on a three-tier scale — <code>fast-moving</code>,
+<code>evolving</code> (default), <code>stable</code> — which sets the daily cron's re-audit cadence
+(14 / 60 / 180 days). See
+<a href="../knowledge-freshness/index.md#cadence-model">the cadence model</a>.</p>
+<h3 id="knowledge-gap-signal">Knowledge-gap signal</h3>
+<p>A <code>knowledge_gap_signal</code> ledger event emitted when an agent hits a topic the KB
+doesn't cover. <strong>Lens I</strong> aggregates these over a rolling 90-day window into
+P1/P2 findings, suppressing any topic an entry already covers. This is where the
+observability and knowledge-freshness systems meet. See
+<a href="../knowledge-freshness/index.md#how-a-gap-closes">How a gap closes</a>.</p>
+<h2 id="review-concepts">Review concepts</h2>
+<p>These describe Multi-Model Review (MMR). Full treatment:
+<a href="../mmr/index.md">the MMR guide</a> and
+<a href="../review-workflow/index.md">the review-workflow guide</a>.</p>
+<h3 id="channel">Channel</h3>
+<p>One independent AI reviewer in an MMR run — a separate subprocess given the same
+prompt and run in isolation. The built-in channels are <code>codex</code>, <code>gemini</code>,
+<code>claude</code>, <code>grok</code>, and the opt-in <code>doc-conformance</code>; the <code>scaffold run</code> wrappers
+add a Superpowers code-reviewer <em>agent</em> channel. A channel is pure config data,
+not per-channel code. See <a href="../mmr/index.md#channel-architecture">Channel architecture</a>.</p>
+<h3 id="compensating-pass">Compensating pass</h3>
+<p>When a channel is degraded (not installed, auth-failed, timed out), MMR runs a
+<code>claude -p</code> pass focused on that channel's strength area, labeled e.g.
+<code>[compensating: Grok-equivalent]</code>. These findings are single-source and
+low-confidence. See <a href="../mmr/index.md#degraded-mode-compensation-auth">Degraded mode</a>.</p>
+<h3 id="reconcile">Reconcile</h3>
+<p>The step that groups every channel's findings by a stable key, de-duplicates
+them, and scores each group for agreement and confidence — producing the single
+list and verdict. Agreement <em>between</em> channels raises confidence; disagreement
+surfaces ambiguity. <code>mmr reconcile</code> also folds an external agent channel's
+findings into an existing job. See
+<a href="../mmr/index.md#findings-reconciliation-verdicts">Findings, reconciliation &#x26; verdicts</a>.</p>
+<h3 id="finding-key"><code>finding_key</code></h3>
+<p>The stable identity MMR computes for a finding so the same issue can be tracked
+across rounds and acknowledgments. Line numbers are stripped from the location
+and severity is excluded, so the same issue at P1 vs. P2 collapses to one key;
+a character-5-gram shingle backs a fuzzy match for re-worded findings. See
+<a href="../mmr/index.md#stable-identity-finding-key">Stable identity</a>.</p>
+<h3 id="mmr-verdict">MMR verdict</h3>
+<p>The gate result of a review. MMR computes <strong>four</strong> verdicts: <code>pass</code>,
+<code>degraded-pass</code>, <code>blocked</code>, and <code>needs-user-decision</code> (no channel completed).
+Proceed only on <code>pass</code> or <code>degraded-pass</code>.</p>
+<div class="callout callout-warning"><p><strong>Two verdict vocabularies — don't conflate them.</strong> The MMR review gate has
+<em>four</em> verdicts (the fourth, <code>needs-user-decision</code>, fires when no channel
+completes). The Build Observability audit engine emits only <em>three</em> —
+<code>needs-user-decision</code> is <strong>not</strong> an audit-engine verdict. See
+<a href="../mmr/index.md#the-gate-the-four-verdicts">the MMR gate</a> and
+<a href="../observability/index.md#verdict-taxonomy">the audit verdict taxonomy</a>.</p></div>
+<h2 id="multi-agent-concepts">Multi-agent concepts</h2>
+<p>These describe how parallel agents share a repo without colliding. Full
+treatment: <a href="../multi-agent/index.md">the multi-agent guide</a>, with the durable
+record covered in <a href="../observability/index.md">the observability guide</a>.</p>
+<h3 id="worktree">Worktree</h3>
+<p>An isolated git working tree used for parallel agent execution, so multiple
+agents (and humans) can build different parts of a project at once without
+sharing a checkout. Each worktree has its own ledger. See
+<a href="../multi-agent/index.md">the multi-agent guide</a>.</p>
+<h3 id="worktree-identity">Worktree identity</h3>
+<p>The stable per-worktree identity recorded in <code>.scaffold/identity.json</code> on first
+write — a <code>worktree_id</code> (UUID), a <code>worktree_label</code>, and <code>created_at</code>. It's what
+lets the harvester tell one worktree's events from another's, and what stamps
+every event's <code>worktree_id</code>. See
+<a href="../observability/index.md#worktree-identity">Worktree identity</a>.</p>
+<h3 id="ledger-harvest">Ledger harvest</h3>
+<p>Copying a worktree's local ledger into the primary repo's archive <em>before</em> the
+worktree is removed, so the build's reasoning survives teardown.
+<code>harvest --recover</code> separately rotates already-harvested stale entries from
+<code>.scaffold/activity-archive/active/</code> into the monthly <code>YYYY-MM.jsonl</code> archives
+when their worktree is no longer live — it does <strong>not</strong> rescue an unharvested
+ledger; that ledger is lost once the worktree is removed. See
+<a href="../observability/index.md#harvest-recover-teardown">Harvest, recover &#x26; teardown</a>.</p>
+<h3 id="teardown">Teardown</h3>
+<p>Removing a finished worktree the safe way — <code>scripts/teardown-agent-worktree.sh</code>
+harvests the ledger first, then runs <code>git worktree remove</code>, then deletes the
+workspace branch. Harvesting before removal is what closes the
+decisions-die-at-teardown gap. See
+<a href="../observability/index.md#harvest-recover-teardown">Harvest, recover &#x26; teardown</a>.</p>
+<h2 id="see-also">See also</h2>
+<ul>
+<li><a href="../pipeline/index.md">The Scaffold Pipeline</a> — phases, dependencies, presets, depth.</li>
+<li><a href="../observability/index.md">Build Observability</a> — ledger, events, the nine lenses, verdicts, <code>--fix</code>.</li>
+<li><a href="../knowledge-freshness/index.md">Knowledge Freshness</a> — volatility tiers, gap signals, Lens I.</li>
+<li><a href="../mmr/index.md">MMR Reference</a> — channels, reconciliation, the four verdicts.</li>
+<li><a href="../multi-agent/index.md">Multi-agent</a> — worktrees and parallel execution.</li>
+<li><a href="../review-workflow/index.md">Review workflow</a> — running reviews end to end.</li>
+<li><a href="../cli/index.md">CLI reference</a> — the full command surface.</li>
+</ul></main>
+  <div class="rail-backdrop" data-action="nav" aria-hidden="true"></div>
+</div>
+<script>(function(){
+  var LS_KEY = 'guide-theme';
+  function applyTheme(t) {
+    document.documentElement.setAttribute('data-theme', t);
+  }
+  document.addEventListener('DOMContentLoaded', function() {
+    // ─── Theme toggle ────────────────────────────────────────────────────────
+    document.querySelectorAll('[data-action="theme"]').forEach(function(btn) {
+      btn.addEventListener('click', function() {
+        var current = document.documentElement.getAttribute('data-theme');
+        var next = current === 'dark' ? 'light' : 'dark';
+        applyTheme(next);
+        try { localStorage.setItem(LS_KEY, next); } catch(e) {}
+      });
+    });
+    // ─── Mobile nav (drawer + backdrop; aria-expanded + Escape-to-close) ──────
+    function setNav(open) {
+      var rail = document.querySelector('.rail');
+      if (rail) rail.classList.toggle('open', open);
+      var toggle = document.querySelector('.nav-toggle');
+      if (toggle) toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
+      // Modal-drawer focus containment: while open, make the page content inert
+      // (out of tab order + a11y tree) and move focus into the drawer; on close,
+      // restore content and return focus to the toggle.
+      var main = document.querySelector('.content');
+      if (main) main.inert = open;
+      if (open) {
+        var first = rail && rail.querySelector('a, button, [tabindex]:not([tabindex="-1"])');
+        if (first) first.focus();
+        else if (rail) { rail.setAttribute('tabindex', '-1'); rail.focus(); }
+      } else if (toggle) {
+        toggle.focus();
+      }
+    }
+    // If the viewport grows past the mobile breakpoint while the drawer is open,
+    // the rail becomes the desktop sidebar and the toggle hides — clear the open
+    // state so .content doesn't stay inert with no way to close it.
+    if (window.matchMedia) {
+      var mq = window.matchMedia('(max-width: 860px)');
+      var onMq = function() {
+        if (mq.matches) return;
+        var rail = document.querySelector('.rail');
+        if (rail) rail.classList.remove('open');
+        var toggle = document.querySelector('.nav-toggle');
+        if (toggle) toggle.setAttribute('aria-expanded', 'false');
+        var main = document.querySelector('.content');
+        if (main) main.inert = false;
+      };
+      if (mq.addEventListener) mq.addEventListener('change', onMq);
+      else if (mq.addListener) mq.addListener(onMq);
+    }
+    document.querySelectorAll('[data-action="nav"]').forEach(function(btn) {
+      btn.addEventListener('click', function() {
+        var rail = document.querySelector('.rail');
+        setNav(!(rail && rail.classList.contains('open')));
+      });
+    });
+    // Selecting a TOC link closes the drawer (so the now-active content isn't
+    // left inert behind the panel) before the anchor navigation scrolls.
+    var drawerRail = document.querySelector('.rail');
+    if (drawerRail) {
+      drawerRail.querySelectorAll('a').forEach(function(a) {
+        a.addEventListener('click', function() {
+          if (drawerRail.classList.contains('open')) setNav(false);
+        });
+      });
+    }
+    document.addEventListener('keydown', function(e) {
+      var rail = document.querySelector('.rail');
+      if (!rail || !rail.classList.contains('open')) return;
+      if (e.key === 'Escape') { setNav(false); return; } // setNav restores focus to the toggle
+      // Trap Tab within the open drawer (modal pattern).
+      if (e.key !== 'Tab') return;
+      var f = rail.querySelectorAll('a[href], button, [tabindex]:not([tabindex="-1"])');
+      if (!f.length) return;
+      var first = f[0], last = f[f.length - 1];
+      if (e.shiftKey && document.activeElement === first) { e.preventDefault(); last.focus(); }
+      else if (!e.shiftKey && document.activeElement === last) { e.preventDefault(); first.focus(); }
+    });
+    // ─── Copy buttons ─────────────────────────────────────────────────────────
+    document.querySelectorAll('pre').forEach(function(pre) {
+      if (!pre.parentNode) return;
+      var wrapper = document.createElement('div');
+      wrapper.className = 'code';
+      pre.parentNode.insertBefore(wrapper, pre);
+      wrapper.appendChild(pre);
+      var btn = document.createElement('button');
+      btn.className = 'copy-btn';
+      btn.textContent = 'Copy';
+      btn.addEventListener('click', function() {
+        var text = pre.textContent || '';
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          navigator.clipboard.writeText(text).then(function() {
+            btn.textContent = 'Copied';
+            setTimeout(function() { btn.textContent = 'Copy'; }, 1200);
+          }, function() {
+            btn.textContent = 'Copy';
+          });
+        }
+      });
+      wrapper.insertBefore(btn, pre);
+    });
+    // ─── Tabs (ARIA pattern: aria-selected + roving tabindex + arrow keys) ────
+    function activateTab(group, btn, focus) {
+      var idx = btn.getAttribute('data-tab');
+      group.querySelectorAll('.tab-btn').forEach(function(b) {
+        var on = b === btn;
+        b.classList.toggle('active', on);
+        b.setAttribute('aria-selected', on ? 'true' : 'false');
+        b.setAttribute('tabindex', on ? '0' : '-1');
+      });
+      group.querySelectorAll('.tabpane').forEach(function(pane) {
+        pane.classList.toggle('active', pane.getAttribute('data-tab') === idx);
+      });
+      if (focus) btn.focus();
+    }
+    document.querySelectorAll('.tabs').forEach(function(group) {
+      var btns = [].slice.call(group.querySelectorAll('.tab-btn'));
+      btns.forEach(function(btn, i) {
+        btn.addEventListener('click', function() { activateTab(group, btn, false); });
+        btn.addEventListener('keydown', function(e) {
+          var ni = -1;
+          if (e.key === 'ArrowRight' || e.key === 'ArrowDown') ni = (i + 1) % btns.length;
+          else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') ni = (i - 1 + btns.length) % btns.length;
+          else if (e.key === 'Home') ni = 0;
+          else if (e.key === 'End') ni = btns.length - 1;
+          if (ni >= 0) { e.preventDefault(); activateTab(group, btns[ni], true); }
+        });
+      });
+    });
+    // ─── Filter tables ────────────────────────────────────────────────────────
+    document.querySelectorAll('.filter-input').forEach(function(input) {
+      input.addEventListener('input', function() {
+        var q = input.value.toLowerCase();
+        var container = input.closest('.filter-table');
+        if (!container) return;
+        container.querySelectorAll('tbody tr').forEach(function(row) {
+          var text = (row.textContent || '').toLowerCase();
+          row.style.display = text.includes(q) ? '' : 'none';
+        });
+      });
+    });
+    // ─── Scrollspy ────────────────────────────────────────────────────────────
+    if (typeof IntersectionObserver === 'undefined') return;
+    var headings = document.querySelectorAll('h2[id],h3[id]');
+    if (!headings.length) return;
+    var observer = new IntersectionObserver(function(entries) {
+      entries.forEach(function(entry) {
+        if (!entry.isIntersecting) return;
+        var id = entry.target.getAttribute('id');
+        document.querySelectorAll('.toc a').forEach(function(a) {
+          a.classList.toggle('active', a.getAttribute('href') === '#' + id);
+        });
+      });
+    }, { rootMargin: '0px 0px -70% 0px', threshold: 0 });
+    headings.forEach(function(h) { observer.observe(h); });
+  });
+})();</script>
+</body>
+</html>