diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index dfd20ee..d647ebd 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -72,7 +72,7 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: '20'
+          node-version: '22'
 
       - name: Build site
         run: node scripts/build.js
@@ -86,36 +86,36 @@ jobs:
           fi
 
       - name: Run skill-a11y-audit (WCAG 2.1 AA)
-        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@main
+        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@6af2c95a56ff058cddf0c6febc71512db1d6d19b # v3.1.0
         with:
           serve-path: ./docs
           sitemap: http://localhost:8088/sitemap.xml
           sitemap-find: ${{ steps.site.outputs.base }}
           sitemap-replace: http://localhost:8088
-          fail-on: errors
+          fail-on: major
 
       - name: Audit canonical root landing
         if: github.repository == 'snapsynapse/knowledge-as-code-template'
-        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@main
+        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@6af2c95a56ff058cddf0c6febc71512db1d6d19b # v3.1.0
         with:
           serve-path: ./
           port: 8089
           sitemap: http://localhost:8089/tests/fixtures/a11y-root-sitemap.xml
           sitemap-find: https://knowledge-as-code.com
           sitemap-replace: http://localhost:8089
-          fail-on: errors
+          fail-on: major
           artifact-name: a11y-root-results
 
       - name: Audit canonical demo deployment
         if: github.repository == 'snapsynapse/knowledge-as-code-template'
-        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@main
+        uses: snapsynapse/skill-a11y-audit/.github/actions/scan@6af2c95a56ff058cddf0c6febc71512db1d6d19b # v3.1.0
         with:
           serve-path: ./demo
           port: 8090
           sitemap: http://localhost:8090/sitemap.xml
           sitemap-find: https://knowledge-as-code.com/demo
           sitemap-replace: http://localhost:8090
-          fail-on: errors
+          fail-on: major
           artifact-name: a11y-demo-results
 
 # GitHub Pages serves directly from `main` branch root on this canonical repo.
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 39b1fbc..7f6231f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,12 @@ pattern.
 
 ## [Unreleased]
 
+### Changed
+- Pinned all three accessibility scan surfaces to A11y Audit v3.1.0 at its verified immutable commit, selected Node.js 22 explicitly for the scanner, and adopted the fail-closed major-findings policy.
+
+### Fixed
+- Repaired shared generated-site and canonical landing contrast, link distinction, decorative marker, matrix-label, and theme-control behavior found while scanning all 45 required routes.
+
 ## [1.2.0] - 2026-09-05
 
 ### Added
diff --git a/MAINTENANCE.md b/MAINTENANCE.md
index 481d856..6d6142f 100644
--- a/MAINTENANCE.md
+++ b/MAINTENANCE.md
@@ -16,6 +16,10 @@ The maintained public path is:
 
 The current supported runtime is Node.js 18 or later on macOS and Linux. Windows may work but is not part of the tested support promise.
 
+## Accessibility gate
+
+The canonical CI scans the generated template, canonical root landing, and canonical demo with the immutable A11y Audit identity and fail-closed major-findings policy recorded in [the 2026-09-07 accessibility adoption evidence](audits/a11y-2026-09-07.md). The generator keeps its Node.js 18-or-later support promise; the accessibility job selects its scanner's required Node.js 22 runtime explicitly.
+
 ## Maintenance priorities
 
 Work is prioritized in this order:
diff --git a/MANIFEST.yaml b/MANIFEST.yaml
index 48a962c..42cd8b3 100644
--- a/MANIFEST.yaml
+++ b/MANIFEST.yaml
@@ -82,7 +82,7 @@ files:
 
   - path: scripts/build.js
     role: tooling
-    hash: sha256:0b9445770253923bee61b49b90a883bf3db3a6511777b9da928ae26022f8382a
+    hash: sha256:ad7861d1350c55c69294d08bbaa175ffe9b11b53139f17b8ac7ebed58bea3191
     note: Static site generator
 
   - path: scripts/assets/favicon.svg
@@ -122,7 +122,7 @@ files:
 
   - path: scripts/eval.js
     role: tooling
-    hash: sha256:7f5622d2245588bf7cdf00cd2afcf651f7b9a44565b3572645b931bdfcfd0e49
+    hash: sha256:f87c45678844465c5d84bb838664802cfa3aeaab397f3b60cddda33a6ad4a043
     note: Behavioral and security regression suite
 
   - path: mcp-server.js
@@ -157,7 +157,7 @@ files:
 
   - path: index.html
     role: protocol
-    hash: sha256:8a431b58a12102a94602548fa3810ce348e10b5e2701e0a708649c1c78c595f7
+    hash: sha256:2c13538b1d72fb4b365f54e77a41a9697fc77f71d9ab26622e55e47147f9f8db
     note: Canonical landing and executable quick start
 
   - path: sitemap.xml
@@ -182,7 +182,7 @@ files:
 
   - path: MAINTENANCE.md
     role: protocol
-    hash: sha256:0d1fde34cb47dc6a25e71ff9bbfa28adb23ebf41bc99167850d919369881457d
+    hash: sha256:51a5afe6c658692a7d1789dc695d64451ba7c4660719e43a6776b1ef03c8e4fa
     note: Compatibility and upgrade policy
 
   - path: VERIFICATION.md
diff --git a/audits/a11y-2026-09-07.md b/audits/a11y-2026-09-07.md
new file mode 100644
index 0000000..daec18d
--- /dev/null
+++ b/audits/a11y-2026-09-07.md
@@ -0,0 +1,47 @@
+# Accessibility adoption evidence
+
+Date: 2026-09-07
+
+## Action and policy identity
+
+The three required accessibility scans use A11y Audit v3.1.0 at immutable commit `6af2c95a56ff058cddf0c6febc71512db1d6d19b`. The public annotated tag `refs/tags/v3.1.0` resolves through tag object `1fccece25b28c99bcbbf26881edc336c586f6d5e` to that commit. This relationship was independently verified from the public Git remote before adoption.
+
+The accessibility job selects Node.js 22 explicitly. The action requires Node.js 22.12.0 or later and runs axe-core 4.12.1 through Puppeteer 25.10.0. Local acceptance used Node.js 26.7.0, which satisfies that runtime floor, with the same scanner dependencies from the v3.1.0 source checkout.
+
+All three scans use `fail-on: major` without a baseline. Confirmed critical or serious standards violations block. Moderate, minor, and best-practice-only findings remain advisory. Unknown violation impact, potentially major incomplete evidence, missing coverage, and scan errors cannot pass.
+
+## Built surfaces and route coverage
+
+The tested source was the clean v1.2.0 baseline at `51abb92806393ae4ff0e6e671e77fe383ae0f690` plus the reviewed accessibility changes described below.
+
+| Surface | Build or source identity | Required routes | Result | Result SHA-256 |
+|---|---|---:|---|---|
+| Template default | `node scripts/build.js`, transient `docs/`, `https://example.com/` rewritten to the local origin | 22/22 sitemap routes | Pass | `67e34ff3d895103d4edbbfebe74f795cd1fb711779e075e8d3593ce914d8cfec` |
+| Canonical root landing | Hand-maintained root `index.html`, root fixture sitemap, Pages root unchanged | 1/1 reviewed route | Pass | `e1492560ce7ae26b34d57ef3f3558871b2013d6c65b1eac4e186d0ae55127f30` |
+| Canonical demo | `KAC_OUTPUT_DIR=demo KAC_SITE_URL=https://knowledge-as-code.com/demo/ KAC_REPO_URL=https://github.com/snapsynapse/knowledge-as-code-template node scripts/build.js` | 22/22 sitemap routes | Pass | `d8cbce799fe5ec0b90def3a6b127d6b034b3c61fe2f479ad480a5f61dafef2fc` |
+
+Each final result contains zero confirmed major findings, zero nonblocking findings, zero unknown-impact violations, zero blocking or advisory incomplete candidates, and zero scan errors. The result files are local execution evidence and are identified here by digest; they are not shipped as product artifacts.
+
+The initializer golden path passed after the source changes. It continues to generate the supported fork structure and derives `.github/workflows/pages.yml` without moving the canonical repository's root Pages source. The generator's Node.js 18 and 20 compatibility matrix also remains in place; Node.js 22 is specific to the accessibility job.
+
+## Findings and repairs
+
+The initial template and demo scans had no confirmed violations, but each was inconclusive with 380 serious incomplete candidates across all 22 routes. A body gradient prevented deterministic contrast evaluation for 296 color candidates and 84 links. The root landing had one confirmed serious link distinction violation on the `PUBLISH-MCP.md` link plus 14 serious incomplete candidates involving a roleless labeled wordmark, decorative punctuation, and gradient-backed text.
+
+Repairs were made in the owning sources and regenerated into both output trees:
+
+- The generated site uses the existing dark or light background token as a solid page background so text contrast can be evaluated deterministically.
+- Prose, list, breadcrumb, and footer links are visibly underlined.
+- Timeline rails and markers are real decorative elements, relationship arrows are expressed as the words “maps to,” matrix counts have descriptive accessible names, and empty matrix cells retain “Not covered” text for assistive technology.
+- The root wordmark has an image role, decorative separators and file arrows were removed, the confirmed link is underlined, and promotional statistics retain real text on a solid backing over the decorative gradient.
+- The generated skip link and back-to-top control choose black or white foreground text from each configured accent color.
+
+No axe rule was disabled, no route was skipped, and no baseline was created or refreshed.
+
+## Theme checks
+
+Targeted axe checks covered the root landing under light and dark `prefers-color-scheme` emulation. The generated template and canonical demo index, matrix, and timeline pages were checked after applying and settling the same `light-mode` class changed by their theme button, and again in the default dark state. All 14 page-and-theme cases returned zero violations and zero incomplete candidates.
+
+The root highlighted heading text measured 17.40:1 against the light page background and 16.34:1 against the light highlight; the dark equivalents were 16.62:1 and 13.69:1. The generated back-to-top glyph measured 7.29:1 in light mode and 10.48:1 in dark mode. Its control boundary measured 6.70:1 and 8.51:1 respectively.
+
+This automated result covers only the routes, themes, and rules described here. It does not establish complete WCAG conformance or replace manual testing.
diff --git a/demo/404.html b/demo/404.html
index 85db421..933cf38 100644
--- a/demo/404.html
+++ b/demo/404.html
@@ -28,6 +28,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <script>
         (function() {
@@ -109,7 +111,7 @@ <h1 style="margin-top:2rem;">404 — Page Not Found</h1>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/about.html b/demo/about.html
index dc85242..a8e3bad 100644
--- a/demo/about.html
+++ b/demo/about.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="How Example Knowledge Base is sourced, verified, and maintained: 2 frameworks, 3 requirements, and 4 provisions from 2 organizations.">
     <meta property="og:title" content="About">
@@ -79,7 +81,7 @@ <h1><a href="index.html" onclick="passTheme(this)">Example Knowledge Base</a></h
         <h2 style="margin-top: 0.5rem;">About</h2>
         <p>A structured reference tracking example entities across categories. Tracks <strong>2 frameworks</strong>, <strong>3 requirements</strong>, <strong>4 provisions</strong>, and <strong>2 organizations</strong>.</p>
         <h3>Data Model</h3>
-        <p><strong>Organization</strong> &rarr; <strong>Framework</strong> &rarr; <strong>Provision</strong> &rarr; <strong>Requirement</strong></p>
+        <p><strong>Organization</strong> maps to <strong>Framework</strong> maps to <strong>Provision</strong> maps to <strong>Requirement</strong></p>
         <p>Requirements are the stable anchors. Provisions are the implementations — different frameworks implements the same requirements differently.</p>
         <h3>JSON API</h3>
         <ul>
@@ -129,7 +131,7 @@ <h3>Contributing</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/applies-to/federal/index.html b/demo/applies-to/federal/index.html
index 09e3e63..94fb8ea 100644
--- a/demo/applies-to/federal/index.html
+++ b/demo/applies-to/federal/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="1 framework that applies to Federal, with status and effective dates.">
@@ -129,7 +131,7 @@ <h1><a href="../../index.html" onclick="passTheme(this)">Example Knowledge Base<
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/applies-to/international/index.html b/demo/applies-to/international/index.html
index 2fdcdec..54db095 100644
--- a/demo/applies-to/international/index.html
+++ b/demo/applies-to/international/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="1 framework that applies to International, with status and effective dates.">
@@ -129,7 +131,7 @@ <h1><a href="../../index.html" onclick="passTheme(this)">Example Knowledge Base<
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/assets/styles.css b/demo/assets/styles.css
index c4bf5f8..4c67a69 100644
--- a/demo/assets/styles.css
+++ b/demo/assets/styles.css
@@ -54,6 +54,18 @@ html {
     top: 0;
 }
 
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
 /* ========================================
    CSS VARIABLES (DARK MODE DEFAULT)
    ======================================== */
@@ -125,7 +137,7 @@ html {
 
 body {
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-    background: linear-gradient(135deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
+    background: var(--bg-gradient-start);
     min-height: 100vh;
     color: var(--text-primary);
     padding: 20px;
@@ -137,6 +149,14 @@ body {
 a { color: var(--accent); text-decoration: none; }
 a:hover { text-decoration: underline; }
 
+#main-content p a,
+#main-content li a,
+.breadcrumb a,
+footer p a {
+    text-decoration: underline;
+    text-underline-offset: 0.12em;
+}
+
 h2 {
     font-size: 1.5rem;
     color: var(--text-heading);
@@ -702,8 +722,7 @@ th[data-sortable].sort-desc::after {
     position: relative;
 }
 
-.timeline::before {
-    content: '';
+.timeline-track {
     position: absolute;
     left: 20px;
     top: 0;
@@ -726,8 +745,7 @@ th[data-sortable].sort-desc::after {
     margin: 4px 0;
 }
 
-.timeline-entry::before {
-    content: '';
+.timeline-marker {
     position: absolute;
     left: 14px;
     top: 18px;
@@ -738,17 +756,17 @@ th[data-sortable].sort-desc::after {
     background: var(--bg-gradient-start);
 }
 
-.timeline-entry.past::before {
+.timeline-entry.past .timeline-marker {
     background: var(--status-enforcing);
     border-color: var(--status-enforcing);
 }
 
-.timeline-entry.future::before {
+.timeline-entry.future .timeline-marker {
     background: transparent;
     border-color: var(--accent);
 }
 
-.timeline-entry.today-marker::before {
+.timeline-entry.today-marker .timeline-marker {
     background: var(--accent);
     border-color: var(--accent);
     box-shadow: 0 0 8px var(--accent);
diff --git a/demo/authority/iso/index.html b/demo/authority/iso/index.html
index 5957a10..2a764d7 100644
--- a/demo/authority/iso/index.html
+++ b/demo/authority/iso/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="International Organization for Standardization — 1 framework published by this organization.">
@@ -133,7 +135,7 @@ <h3>Frameworks (1)</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/authority/nist/index.html b/demo/authority/nist/index.html
index 67d5d3d..6fddf74 100644
--- a/demo/authority/nist/index.html
+++ b/demo/authority/nist/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="National Institute of Standards and Technology — 1 framework published by this organization.">
@@ -133,7 +135,7 @@ <h3>Frameworks (1)</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/compare.html b/demo/compare.html
index e407b55..cf1b074 100644
--- a/demo/compare.html
+++ b/demo/compare.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="Compare any two or three of 2 frameworks side by side to see where their coverage overlaps and diverges.">
     <meta property="og:title" content="Compare">
@@ -158,7 +160,7 @@ <h3>Side-by-side pages</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/compare/iso-27001-vs-nist-csf/index.html b/demo/compare/iso-27001-vs-nist-csf/index.html
index 67c0951..6e2634e 100644
--- a/demo/compare/iso-27001-vs-nist-csf/index.html
+++ b/demo/compare/iso-27001-vs-nist-csf/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="ISO/IEC 27001:2022 vs NIST Cybersecurity Framework: 1 shared requirement and where the two diverge.">
@@ -137,7 +139,7 @@ <h1><a href="../../index.html" onclick="passTheme(this)">Example Knowledge Base<
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/container/iso-27001/index.html b/demo/container/iso-27001/index.html
index 13a4606..e81b92f 100644
--- a/demo/container/iso-27001/index.html
+++ b/demo/container/iso-27001/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="ISO/IEC 27001:2022 — 2 provisions.">
@@ -163,7 +165,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/container/nist-csf/index.html b/demo/container/nist-csf/index.html
index 2f97ffc..6b768f0 100644
--- a/demo/container/nist-csf/index.html
+++ b/demo/container/nist-csf/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="NIST Cybersecurity Framework — 2 provisions.">
@@ -163,7 +165,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/containers.html b/demo/containers.html
index 98b0c53..327a2f1 100644
--- a/demo/containers.html
+++ b/demo/containers.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="All 2 frameworks tracked in Example Knowledge Base, with status, effective date, and provision count.">
     <meta property="og:title" content="Frameworks">
@@ -152,7 +154,7 @@ <h2 style="margin-top: 0.5rem;">Frameworks</h2>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/index.html b/demo/index.html
index c3f745c..0ad4506 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="A structured reference tracking example entities across categories.">
     <meta property="og:title" content="Home">
@@ -173,7 +175,7 @@ <h2>Quick Links</h2>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/matrix.html b/demo/matrix.html
index 5e97749..c334f07 100644
--- a/demo/matrix.html
+++ b/demo/matrix.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="Coverage matrix showing which of 2 frameworks address each of 3 requirements.">
     <meta property="og:title" content="Coverage Matrix">
@@ -81,9 +83,9 @@ <h2 style="margin-top: 0.5rem;">Coverage Matrix</h2>
         <div class="matrix-wrapper">
             <table class="matrix-table">
                 <thead><tr><th class="matrix-corner">Requirement</th><th><a href="container/iso-27001/index.html" onclick="passTheme(this)" title="ISO/IEC 27001:2022">International</a></th><th><a href="container/nist-csf/index.html" onclick="passTheme(this)" title="NIST Cybersecurity Framework">Federal</a></th></tr></thead>
-                <tbody><tr><td class="matrix-row-header group-governance"><a href="primary/access-control/index.html" onclick="passTheme(this)" style="color:inherit;">Access Control</a></td><td class="matrix-cell covered" title="Access Control — ISO/IEC 27001:2022: 1"><a href="requires/iso-27001/access-control/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;">1</a></td><td class="matrix-cell covered" title="Access Control — NIST Cybersecurity Framework: 1"><a href="requires/nist-csf/access-control/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;">1</a></td></tr>
-<tr><td class="matrix-row-header group-operational"><a href="primary/incident-response/index.html" onclick="passTheme(this)" style="color:inherit;">Incident Response</a></td><td class="matrix-cell empty">&mdash;</td><td class="matrix-cell covered" title="Incident Response — NIST Cybersecurity Framework: 1"><a href="requires/nist-csf/incident-response/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;">1</a></td></tr>
-<tr><td class="matrix-row-header group-technical"><a href="primary/information-integrity/index.html" onclick="passTheme(this)" style="color:inherit;">Information Integrity</a></td><td class="matrix-cell covered" title="Information Integrity — ISO/IEC 27001:2022: 1"><a href="requires/iso-27001/information-integrity/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;">1</a></td><td class="matrix-cell empty">&mdash;</td></tr></tbody>
+                <tbody><tr><td class="matrix-row-header group-governance"><a href="primary/access-control/index.html" onclick="passTheme(this)" style="color:inherit;">Access Control</a></td><td class="matrix-cell covered" title="Access Control — ISO/IEC 27001:2022: 1 provision"><a href="requires/iso-27001/access-control/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;" aria-label="Access Control — ISO/IEC 27001:2022: 1 provision">1</a></td><td class="matrix-cell covered" title="Access Control — NIST Cybersecurity Framework: 1 provision"><a href="requires/nist-csf/access-control/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;" aria-label="Access Control — NIST Cybersecurity Framework: 1 provision">1</a></td></tr>
+<tr><td class="matrix-row-header group-operational"><a href="primary/incident-response/index.html" onclick="passTheme(this)" style="color:inherit;">Incident Response</a></td><td class="matrix-cell empty"><span aria-hidden="true">&mdash;</span><span class="sr-only">Not covered</span></td><td class="matrix-cell covered" title="Incident Response — NIST Cybersecurity Framework: 1 provision"><a href="requires/nist-csf/incident-response/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;" aria-label="Incident Response — NIST Cybersecurity Framework: 1 provision">1</a></td></tr>
+<tr><td class="matrix-row-header group-technical"><a href="primary/information-integrity/index.html" onclick="passTheme(this)" style="color:inherit;">Information Integrity</a></td><td class="matrix-cell covered" title="Information Integrity — ISO/IEC 27001:2022: 1 provision"><a href="requires/iso-27001/information-integrity/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;" aria-label="Information Integrity — ISO/IEC 27001:2022: 1 provision">1</a></td><td class="matrix-cell empty"><span aria-hidden="true">&mdash;</span><span class="sr-only">Not covered</span></td></tr></tbody>
             </table>
         </div>
     
@@ -126,7 +128,7 @@ <h2 style="margin-top: 0.5rem;">Coverage Matrix</h2>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/pattern.html b/demo/pattern.html
index 35cadf7..5183438 100644
--- a/demo/pattern.html
+++ b/demo/pattern.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="A zero-dependency generator for evidence-backed reference sites.">
     <meta property="og:title" content="Knowledge as Code">
@@ -101,7 +103,7 @@ <h2>Six Properties</h2>
         <h2>The Ontology</h2>
         <p>Every Knowledge-as-Code project has four entity roles:</p>
         <div style="text-align: center; padding: 1.5rem 0; font-size: 1.1rem;">
-            <strong>Organization</strong> → <strong>Framework</strong> → <strong>Provision</strong> → <strong>Requirement</strong>
+            <strong>Organization</strong> maps to <strong>Framework</strong> maps to <strong>Provision</strong> maps to <strong>Requirement</strong>
         </div>
         <table class="data-table">
             <thead><tr><th>Role</th><th>This Project</th><th>What It Is</th></tr></thead>
@@ -201,7 +203,7 @@ <h2>Get Started</h2>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/primaries.html b/demo/primaries.html
index 58a85cb..d8e17d9 100644
--- a/demo/primaries.html
+++ b/demo/primaries.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="All 3 requirements tracked in Example Knowledge Base, grouped by category and linked to the frameworks that cover them.">
     <meta property="og:title" content="Requirements">
@@ -141,7 +143,7 @@ <h3><span class="group-badge operational">operational</span> Operational</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/primary/access-control/index.html b/demo/primary/access-control/index.html
index c79b134..4689bbd 100644
--- a/demo/primary/access-control/index.html
+++ b/demo/primary/access-control/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Access Control — Requirement to restrict system and data access based on defined roles, responsibilities, and the principle of least privilege.">
@@ -135,7 +137,7 @@ <h3>Implementing Frameworks</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/primary/incident-response/index.html b/demo/primary/incident-response/index.html
index b56fd05..30d6826 100644
--- a/demo/primary/incident-response/index.html
+++ b/demo/primary/incident-response/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Incident Response — Requirement to detect, respond to, and recover from security incidents with defined procedures and communication plans.">
@@ -134,7 +136,7 @@ <h3>Implementing Frameworks</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/primary/information-integrity/index.html b/demo/primary/information-integrity/index.html
index 1601086..bac14c4 100644
--- a/demo/primary/information-integrity/index.html
+++ b/demo/primary/information-integrity/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Information Integrity — Requirement to protect information from unauthorized or accidental alteration, erasure, or damage.">
@@ -134,7 +136,7 @@ <h3>Implementing Frameworks</h3>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/requires/iso-27001/access-control/index.html b/demo/requires/iso-27001/access-control/index.html
index b2a9d39..483aeca 100644
--- a/demo/requires/iso-27001/access-control/index.html
+++ b/demo/requires/iso-27001/access-control/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Does ISO/IEC 27001:2022 require Access Control? Yes.">
@@ -146,7 +148,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/requires/iso-27001/information-integrity/index.html b/demo/requires/iso-27001/information-integrity/index.html
index 6348a44..83509f3 100644
--- a/demo/requires/iso-27001/information-integrity/index.html
+++ b/demo/requires/iso-27001/information-integrity/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Does ISO/IEC 27001:2022 require Information Integrity? Yes.">
@@ -146,7 +148,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/requires/nist-csf/access-control/index.html b/demo/requires/nist-csf/access-control/index.html
index 9c37b44..8a18355 100644
--- a/demo/requires/nist-csf/access-control/index.html
+++ b/demo/requires/nist-csf/access-control/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Does NIST Cybersecurity Framework require Access Control? Yes.">
@@ -146,7 +148,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/requires/nist-csf/incident-response/index.html b/demo/requires/nist-csf/incident-response/index.html
index b5f6fb1..b82304a 100644
--- a/demo/requires/nist-csf/incident-response/index.html
+++ b/demo/requires/nist-csf/incident-response/index.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     
     <meta name="description" content="Does NIST Cybersecurity Framework require Incident Response? Yes.">
@@ -146,7 +148,7 @@ <h4>Requirements</h4><table class="data-table"><thead><tr><th>Requirement</th><t
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/demo/timeline.html b/demo/timeline.html
index 58fba37..4d9371d 100644
--- a/demo/timeline.html
+++ b/demo/timeline.html
@@ -29,6 +29,8 @@
 :is(html, body).light-mode .status-badge.deprecated { background: #455a64; color: #fff; }
 :root { --accent: #4fc3f7; }
 :is(html, body).light-mode { --accent: #0055aa; }
+.skip-link, .back-to-top { color: #000; }
+:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: #fff; }
 </style>
     <meta name="description" content="Chronological timeline of 3 milestones across 2 frameworks, with past and upcoming effective dates.">
     <meta property="og:title" content="Timeline">
@@ -77,8 +79,9 @@ <h1><a href="index.html" onclick="passTheme(this)">Example Knowledge Base</a></h
     <main class="container" id="main-content">
         <h2 style="margin-top: 0.5rem;">Timeline</h2>
         <p style="color: var(--text-secondary); margin-bottom: 1rem;">Key dates. Solid dots are past; hollow dots are future.</p>
-        <div class="timeline"><div class="timeline-year">2018</div>
+        <div class="timeline"><span class="timeline-track" aria-hidden="true"></span><div class="timeline-year">2018</div>
 <div class="timeline-entry past">
+            <span class="timeline-marker" aria-hidden="true"></span>
             <div class="timeline-date">Apr 16, 2018</div>
             <div class="timeline-content">
                 <a href="container/nist-csf/index.html" onclick="passTheme(this)" class="timeline-regulation">NIST Cybersecurity Framework</a>
@@ -88,6 +91,7 @@ <h2 style="margin-top: 0.5rem;">Timeline</h2>
         </div>
 <div class="timeline-year">2022</div>
 <div class="timeline-entry past">
+            <span class="timeline-marker" aria-hidden="true"></span>
             <div class="timeline-date">Oct 25, 2022</div>
             <div class="timeline-content">
                 <a href="container/iso-27001/index.html" onclick="passTheme(this)" class="timeline-regulation">ISO/IEC 27001:2022</a>
@@ -97,6 +101,7 @@ <h2 style="margin-top: 0.5rem;">Timeline</h2>
         </div>
 <div class="timeline-year">2024</div>
 <div class="timeline-entry past">
+            <span class="timeline-marker" aria-hidden="true"></span>
             <div class="timeline-date">Feb 26, 2024</div>
             <div class="timeline-content">
                 <a href="container/nist-csf/index.html" onclick="passTheme(this)" class="timeline-regulation">NIST Cybersecurity Framework</a>
@@ -143,7 +148,7 @@ <h2 style="margin-top: 0.5rem;">Timeline</h2>
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
diff --git a/index.html b/index.html
index 0639f41..955fa70 100644
--- a/index.html
+++ b/index.html
@@ -143,7 +143,7 @@
   code, pre, .mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
   a { color: var(--accent); text-decoration: none; }
   a:hover { text-decoration: underline; }
-  p a, aside a { text-decoration: underline; text-underline-offset: 0.12em; }
+  p a, aside a, .plain a { text-decoration: underline; text-underline-offset: 0.12em; }
 
   nav {
     position: sticky; top: 0; z-index: 10;
@@ -223,7 +223,7 @@
     margin: 0 0 14px;
   }
   h1 .mark {
-    background: linear-gradient(180deg, transparent 62%, var(--highlight-soft) 62%);
+    box-shadow: inset 0 -0.32em var(--highlight-soft);
     padding: 0 4px;
   }
   .byline {
@@ -352,6 +352,8 @@
     font-size: 12.5px;
     color: var(--accent);
     word-break: break-all;
+    text-decoration: underline;
+    text-underline-offset: 0.12em;
   }
   .split .card.primary-card {
     background: var(--highlight-soft);
@@ -433,18 +435,15 @@
     padding: 14px;
     text-align: center;
   }
-  .used-by-card .thumb-text .big-num {
+  .used-by-card .thumb-text-copy {
+    padding: 10px 14px;
+    border-radius: 8px;
+    background: var(--bg);
+    color: var(--text);
     font-family: ui-monospace, monospace;
-    font-size: 2.2rem;
-    font-weight: 700;
-    color: var(--accent);
-    line-height: 1;
-  }
-  .used-by-card .thumb-text .unit {
-    font-size: 12px;
-    color: var(--muted);
-    text-transform: uppercase;
-    letter-spacing: 0.08em;
+    font-size: 1rem;
+    font-weight: 650;
+    line-height: 1.6;
   }
   .used-by-card .body { padding: 16px 18px 18px; }
   .used-by-card h3 {
@@ -539,7 +538,7 @@
 
 <nav>
   <div class="nav-inner">
-    <div class="brand" aria-label="knowledge-as-code"><span class="brace">{</span><span class="sp"></span><span class="kw">knowledge</span><span class="dash">-</span><span class="kw">as</span><span class="dash">-</span><span class="kw">code</span><span class="sp"></span><span class="brace">}</span></div>
+    <div class="brand" role="img" aria-label="knowledge-as-code"><span class="brace">{</span><span class="sp"></span><span class="kw">knowledge</span><span class="dash">-</span><span class="kw">as</span><span class="dash">-</span><span class="kw">code</span><span class="sp"></span><span class="brace">}</span></div>
     <div class="nav-links">
       <a href="#what">What</a>
       <a href="#why">Why</a>
@@ -566,13 +565,9 @@
   <h1><span class="mark">Knowledge as Code</span></h1>
   <p class="byline">
     By <a href="https://paice.work/" rel="author">Sam Rogers</a>, <a href="https://paice.work/">PAICE.work PBC</a>
-    <span class="sep">·</span>
     Published <time datetime="2026-01-20">January 20, 2026</time>
-    <span class="sep">·</span>
     Updated <time datetime="2026-09-05">September 5, 2026</time>
-    <span class="sep">·</span>
     <span class="version">v1.2</span>
-    <span class="sep">·</span>
     <a href="https://creativecommons.org/licenses/by/4.0/" rel="license">CC&nbsp;BY&nbsp;4.0</a>
   </p>
   <p class="lede">
@@ -707,10 +702,10 @@ <h3><span class="kbd">.md</span> The source markdown</h3>
         the body. Git diffs are human-readable. No database, no CMS, no migrations.
       </p>
       <ul class="files">
-        <li>→ <a href="/data/examples/frameworks/iso-27001.md">data/examples/frameworks/iso-27001.md</a></li>
-        <li>→ <a href="/data/examples/requirements/access-control.md">data/examples/requirements/access-control.md</a></li>
-        <li>→ <a href="/data/examples/organizations/iso.md">data/examples/organizations/iso.md</a></li>
-        <li>→ <a href="/project.yml">project.yml</a> <span style="color:var(--muted);font-family:inherit;font-size:12px;">— the ontology config</span></li>
+        <li><a href="/data/examples/frameworks/iso-27001.md">data/examples/frameworks/iso-27001.md</a></li>
+        <li><a href="/data/examples/requirements/access-control.md">data/examples/requirements/access-control.md</a></li>
+        <li><a href="/data/examples/organizations/iso.md">data/examples/organizations/iso.md</a></li>
+        <li><a href="/project.yml">project.yml</a> <span style="color:var(--muted);font-family:inherit;font-size:12px;">— the ontology config</span></li>
       </ul>
     </div>
   </div>
@@ -748,10 +743,7 @@ <h3>everyailaw.com</h3>
 
     <a class="used-by-card" href="https://VirtualClassroom.watch/" target="_blank" rel="noopener">
       <span class="thumb-text">
-        <span class="big-num">22</span>
-        <span class="unit">meeting tools</span>
-        <span class="big-num" style="font-size:1.3rem;margin-top:4px;">9</span>
-        <span class="unit">facilitation primitives</span>
+        <span class="thumb-text-copy">22 meeting tools<br>9 facilitation primitives</span>
       </span>
       <div class="body">
         <h3>VirtualClassroom.watch</h3>
diff --git a/scripts/assets/styles.css b/scripts/assets/styles.css
index c4bf5f8..4c67a69 100644
--- a/scripts/assets/styles.css
+++ b/scripts/assets/styles.css
@@ -54,6 +54,18 @@ html {
     top: 0;
 }
 
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
 /* ========================================
    CSS VARIABLES (DARK MODE DEFAULT)
    ======================================== */
@@ -125,7 +137,7 @@ html {
 
 body {
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-    background: linear-gradient(135deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
+    background: var(--bg-gradient-start);
     min-height: 100vh;
     color: var(--text-primary);
     padding: 20px;
@@ -137,6 +149,14 @@ body {
 a { color: var(--accent); text-decoration: none; }
 a:hover { text-decoration: underline; }
 
+#main-content p a,
+#main-content li a,
+.breadcrumb a,
+footer p a {
+    text-decoration: underline;
+    text-underline-offset: 0.12em;
+}
+
 h2 {
     font-size: 1.5rem;
     color: var(--text-heading);
@@ -702,8 +722,7 @@ th[data-sortable].sort-desc::after {
     position: relative;
 }
 
-.timeline::before {
-    content: '';
+.timeline-track {
     position: absolute;
     left: 20px;
     top: 0;
@@ -726,8 +745,7 @@ th[data-sortable].sort-desc::after {
     margin: 4px 0;
 }
 
-.timeline-entry::before {
-    content: '';
+.timeline-marker {
     position: absolute;
     left: 14px;
     top: 18px;
@@ -738,17 +756,17 @@ th[data-sortable].sort-desc::after {
     background: var(--bg-gradient-start);
 }
 
-.timeline-entry.past::before {
+.timeline-entry.past .timeline-marker {
     background: var(--status-enforcing);
     border-color: var(--status-enforcing);
 }
 
-.timeline-entry.future::before {
+.timeline-entry.future .timeline-marker {
     background: transparent;
     border-color: var(--accent);
 }
 
-.timeline-entry.today-marker::before {
+.timeline-entry.today-marker .timeline-marker {
     background: var(--accent);
     border-color: var(--accent);
     box-shadow: 0 0 8px var(--accent);
diff --git a/scripts/build.js b/scripts/build.js
index 2a1de8c..cdb7e5c 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -219,12 +219,16 @@ function generateConfigCSS(config) {
     });
 
     // Theme accent overrides
+    const accent = cssColor(theme.accent, '#4fc3f7');
+    const accentLight = cssColor(theme.accent_light, '#0055aa');
     if (theme.accent) {
-        css += `:root { --accent: ${cssColor(theme.accent, '#4fc3f7')}; }\n`;
+        css += `:root { --accent: ${accent}; }\n`;
     }
     if (theme.accent_light) {
-        css += `:is(html, body).light-mode { --accent: ${cssColor(theme.accent_light, '#0055aa')}; }\n`;
+        css += `:is(html, body).light-mode { --accent: ${accentLight}; }\n`;
     }
+    css += `.skip-link, .back-to-top { color: ${readableTextColor(accent)}; }\n`;
+    css += `:is(html, body).light-mode .skip-link, :is(html, body).light-mode .back-to-top { color: ${readableTextColor(accentLight)}; }\n`;
 
     return escapeStyle(css);
 }
@@ -278,7 +282,7 @@ function renderThemeScript() {
             var btn = document.createElement('button');
             btn.className = 'back-to-top';
             btn.setAttribute('aria-label', 'Back to top');
-            btn.textContent = '\\u2191';
+            btn.innerHTML = '<span aria-hidden="true">\\u2191</span>';
             document.body.appendChild(btn);
             window.addEventListener('scroll', function() { btn.classList.toggle('visible', window.scrollY > 400); });
             btn.addEventListener('click', function() { window.scrollTo({ top: 0, behavior: 'smooth' }); });
@@ -687,9 +691,10 @@ function generateMatrixPage(config, data, configCSS) {
             const entry = (matrix[p.id] || {})[c.id];
             if (entry && entry.covered) {
                 const n = entry.provisions.length;
-                return `<td class="matrix-cell covered" title="${escapeHTML(pLabel)} — ${escapeHTML(c.name)}: ${n}"><a href="requires/${pathSegment(c.id, 'Container ID')}/${pathSegment(p.id, 'Primary ID')}/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;">${n}</a></td>`;
+                const provisionLabel = `${n} provision${n === 1 ? '' : 's'}`;
+                return `<td class="matrix-cell covered" title="${escapeHTML(pLabel)} — ${escapeHTML(c.name)}: ${provisionLabel}"><a href="requires/${pathSegment(c.id, 'Container ID')}/${pathSegment(p.id, 'Primary ID')}/index.html" onclick="passTheme(this)" style="color:inherit;text-decoration:none;" aria-label="${escapeHTML(pLabel)} — ${escapeHTML(c.name)}: ${provisionLabel}">${n}</a></td>`;
             }
-            return `<td class="matrix-cell empty">&mdash;</td>`;
+            return `<td class="matrix-cell empty"><span aria-hidden="true">&mdash;</span><span class="sr-only">Not covered</span></td>`;
         }).join('');
         return `<tr><td class="matrix-row-header group-${cssClassName(p.group, 'other')}"><a href="primary/${pathSegment(p.id, 'Primary ID')}/index.html" onclick="passTheme(this)" style="color:inherit;">${escapeHTML(pLabel)}</a></td>${cells}</tr>`;
     }).join('\n');
@@ -735,6 +740,7 @@ function generateTimelinePage(config, data, configCSS) {
     const html = Object.keys(byYear).sort().map(year =>
         `<div class="timeline-year">${year}</div>\n` +
         byYear[year].map(ev => `<div class="timeline-entry ${ev.date <= today ? 'past' : 'future'}">
+            <span class="timeline-marker" aria-hidden="true"></span>
             <div class="timeline-date">${formatDate(ev.date)}</div>
             <div class="timeline-content">
                 <a href="container/${pathSegment(ev.containerId, 'Container ID')}/index.html" onclick="passTheme(this)" class="timeline-regulation">${escapeHTML(ev.container)}</a>
@@ -746,7 +752,7 @@ function generateTimelinePage(config, data, configCSS) {
 
     const content = `<h2 style="margin-top: 0.5rem;">Timeline</h2>
         <p style="color: var(--text-secondary); margin-bottom: 1rem;">Key dates. Solid dots are past; hollow dots are future.</p>
-        <div class="timeline">${html}</div>`;
+        <div class="timeline"><span class="timeline-track" aria-hidden="true"></span>${html}</div>`;
 
     const timelineDescription = `Chronological timeline of ${events.length} milestones across ${containers.length} ${(config.entities?.container?.plural || 'containers').toLowerCase()}, with past and upcoming effective dates.`;
     const structuredData = {
@@ -843,7 +849,7 @@ function generateAboutPage(config, data, configCSS) {
         <h2 style="margin-top: 0.5rem;">About</h2>
         <p>${escapeHTML(config.description || '')} Tracks <strong>${containers.length} ${cPlural.toLowerCase()}</strong>, <strong>${primaries.length} ${pPlural.toLowerCase()}</strong>, <strong>${totalProvisions} ${secName.toLowerCase()}s</strong>, and <strong>${authorities.length} ${authName.toLowerCase()}${authorities.length !== 1 ? 's' : ''}</strong>.</p>
         <h3>Data Model</h3>
-        <p><strong>${escapeHTML(authName)}</strong> &rarr; <strong>${escapeHTML(cName)}</strong> &rarr; <strong>${escapeHTML(secName)}</strong> &rarr; <strong>${escapeHTML(pName)}</strong></p>
+        <p><strong>${escapeHTML(authName)}</strong> maps to <strong>${escapeHTML(cName)}</strong> maps to <strong>${escapeHTML(secName)}</strong> maps to <strong>${escapeHTML(pName)}</strong></p>
         <p>${escapeHTML(pPlural)} are the stable anchors. ${escapeHTML(secName)}s are the implementations — different ${cPlural.toLowerCase()} ${rel} the same ${pPlural.toLowerCase()} differently.</p>
         <h3>JSON API</h3>
         <ul>
@@ -1203,7 +1209,7 @@ function generatePatternPage(config, data, configCSS) {
         <h2>The Ontology</h2>
         <p>Every Knowledge-as-Code project has four entity roles:</p>
         <div style="text-align: center; padding: 1.5rem 0; font-size: 1.1rem;">
-            <strong>${escapeHTML(authorityName)}</strong> → <strong>${escapeHTML(containerName)}</strong> → <strong>${escapeHTML(secondaryName)}</strong> → <strong>${escapeHTML(primaryName)}</strong>
+            <strong>${escapeHTML(authorityName)}</strong> maps to <strong>${escapeHTML(containerName)}</strong> maps to <strong>${escapeHTML(secondaryName)}</strong> maps to <strong>${escapeHTML(primaryName)}</strong>
         </div>
         <table class="data-table">
             <thead><tr><th>Role</th><th>This Project</th><th>What It Is</th></tr></thead>
diff --git a/scripts/eval.js b/scripts/eval.js
index 4a62d09..1283a4c 100644
--- a/scripts/eval.js
+++ b/scripts/eval.js
@@ -780,7 +780,7 @@ function evalPublicSurface() {
         'Canonical and generated favicon sources should remain byte-identical.'
     );
     assertIncludes(landing, '--accent: #047857;');
-    assertIncludes(landing, 'p a, aside a { text-decoration: underline;');
+    assertIncludes(landing, 'p a, aside a, .plain a { text-decoration: underline;');
     assertIncludes(landing, '.btn-primary { background: var(--accent); color: var(--bg); }');
     const jsonLdBlocks = [...landing.matchAll(/<script type="application\/ld\+json">([\s\S]*?)<\/script>/g)];
     assert.ok(jsonLdBlocks.length > 0, 'Landing should include JSON-LD.');
@@ -929,6 +929,27 @@ function evalGeneratedArtifactCleanliness() {
 
 function evalWorkflowContract() {
     const workflow = fs.readFileSync(path.join(ROOT, '.github/workflows/build.yml'), 'utf8');
+    const a11yJob = workflow.match(/\n  a11y:\n([\s\S]+)$/)?.[1] || '';
+    const scanPin = 'snapsynapse/skill-a11y-audit/.github/actions/scan@6af2c95a56ff058cddf0c6febc71512db1d6d19b';
+    const scanSteps = [
+        ['Run skill-a11y-audit (WCAG 2.1 AA)', ['serve-path: ./docs', 'sitemap: http://localhost:8088/sitemap.xml']],
+        ['Audit canonical root landing', ['serve-path: ./', 'port: 8089', 'sitemap: http://localhost:8089/tests/fixtures/a11y-root-sitemap.xml', 'artifact-name: a11y-root-results']],
+        ['Audit canonical demo deployment', ['serve-path: ./demo', 'port: 8090', 'sitemap: http://localhost:8090/sitemap.xml', 'artifact-name: a11y-demo-results']]
+    ];
+    assertIncludes(a11yJob, "node-version: '22'");
+    for (const [name, surfaceContract] of scanSteps) {
+        const escapedName = name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+        const step = a11yJob.match(new RegExp(`- name: ${escapedName}\\n([\\s\\S]*?)(?=\\n      - name:|$)`))?.[1] || '';
+        assert.ok(step, `Accessibility workflow is missing step: ${name}`);
+        assertIncludes(step, `uses: ${scanPin}`);
+        assertIncludes(step, 'fail-on: major');
+        for (const requirement of surfaceContract) assertIncludes(step, requirement);
+    }
+    assert.strictEqual(
+        (a11yJob.match(/^\s*uses: snapsynapse\/skill-a11y-audit\/\.github\/actions\/scan@/gm) || []).length,
+        scanSteps.length,
+        'Every accessibility action use must belong to one of the three required scan surfaces.'
+    );
     for (const required of [
         "node: ['18', '20']",
         'KAC_OUTPUT_DIR: demo',
@@ -936,11 +957,7 @@ function evalWorkflowContract() {
         'KAC_REPO_URL: https://github.com/snapsynapse/knowledge-as-code-template',
         'Verify generated outputs are current',
         'Audit canonical root landing',
-        'Audit canonical demo deployment',
-        'port: 8089',
-        'artifact-name: a11y-root-results',
-        'port: 8090',
-        'artifact-name: a11y-demo-results'
+        'Audit canonical demo deployment'
     ]) assertIncludes(workflow, required);
 }