@x12i/connectix-docs 0.1.0 → 0.1.2

package/dist/web/assets/extras.css

@@ -135,3 +135,305 @@
 
 .empty-state h2{ color: var(--ink); }
 .empty-state p{ color: var(--ink-muted); }
+
+/* ---------- install why / when / not-for ---------- */
+
+.install-why{
+  margin: 4px 0 10px;
+}
+
+.install-why-title{
+  font-family: var(--font-mono);
+  font-size: 11px;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--ink-faint, #6b7785);
+  margin-bottom: 6px;
+}
+
+.install-why-list{
+  margin: 0;
+  padding-left: 18px;
+  font-size: 13.5px;
+  color: var(--ink-muted, #3d4a57);
+  line-height: 1.55;
+}
+
+.install-why-list li{ margin-bottom: 2px; }
+
+.install-when,
+.install-not-for{
+  margin: 0 0 6px;
+  font-size: 13px;
+  color: var(--ink-muted, #3d4a57);
+  line-height: 1.45;
+}
+
+.install-flag{
+  display: inline-block;
+  font-family: var(--font-mono);
+  font-size: 10.5px;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  padding: 2px 7px;
+  border-radius: 4px;
+  margin-right: 8px;
+  background: var(--accent-soft, #e8edf5);
+  color: var(--accent, #16324f);
+}
+
+.install-not-for .install-flag{
+  background: var(--accent-alt-soft, #f5ece8);
+  color: var(--accent-alt, #b14a2c);
+}
+
+/* ---------- tutorials section (chapter index into a start book) ---------- */
+
+.tutorials-section .section-lead{
+  margin: 0 0 18px;
+  font-size: 14.5px;
+  color: var(--ink-muted, #3d4a57);
+  max-width: 640px;
+}
+
+.tutorials-list{
+  max-width: 680px;
+}
+
+/* ---------- journey (interactive sequence) ---------- */
+
+.journey-section{ padding-top: 8px; }
+
+.journey-toolbar{
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 28px;
+}
+
+.journey-toolbar-label{
+  font-family: var(--font-mono);
+  font-size: 11px;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--ink-faint, #6b7785);
+  margin-right: 4px;
+}
+
+.journey-filter{
+  font-family: var(--font-sans);
+  font-size: 13px;
+  font-weight: 500;
+  padding: 6px 14px;
+  border: 1px solid var(--border, #d8dee6);
+  border-radius: 999px;
+  background: #fff;
+  color: var(--ink-muted, #3d4a57);
+  cursor: pointer;
+}
+
+.journey-filter.active{
+  background: var(--accent, #16324f);
+  border-color: var(--accent, #16324f);
+  color: #fff;
+}
+
+.journey-filter.alt.active{
+  background: var(--accent-alt, #b14a2c);
+  border-color: var(--accent-alt, #b14a2c);
+}
+
+.journey-seq{ margin-bottom: 48px; }
+
+.journey-title{
+  font-size: 24px;
+  margin: 0 0 8px;
+  color: var(--ink, #15202b);
+}
+
+.journey-lead{
+  margin: 0 0 24px;
+  font-size: 15px;
+  color: var(--ink-muted, #3d4a57);
+  max-width: 640px;
+  line-height: 1.5;
+}
+
+.journey-steps{
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  border-left: 2px solid var(--border-strong, #c3ccd6);
+}
+
+.journey-step{
+  position: relative;
+  margin: 0 0 6px;
+  padding-left: 24px;
+}
+
+.journey-step::before{
+  content: "";
+  position: absolute;
+  left: -7px;
+  top: 16px;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  background: var(--accent, #16324f);
+}
+
+.journey-step.optional::before{
+  background: #fff;
+  border: 2px solid var(--border-strong, #c3ccd6);
+}
+
+.journey-step-head{
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  width: 100%;
+  text-align: left;
+  background: none;
+  border: 0;
+  padding: 10px 8px;
+  border-radius: var(--radius, 6px);
+  cursor: pointer;
+  font-family: var(--font-sans);
+}
+
+.journey-step-head:hover{ background: var(--surface-dim, #f4f6f8); }
+
+.journey-num{
+  font-family: var(--font-mono);
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--accent, #16324f);
+  min-width: 20px;
+}
+
+.journey-step.optional .journey-num{ color: var(--ink-faint, #6b7785); }
+
+.journey-label{
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--ink, #15202b);
+  flex: 1;
+}
+
+.journey-step.optional .journey-label{ color: var(--ink-muted, #3d4a57); }
+
+.journey-flag{
+  font-family: var(--font-mono);
+  font-size: 10.5px;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  padding: 2px 8px;
+  border-radius: 4px;
+  background: var(--accent-soft, #e8edf5);
+  color: var(--accent, #16324f);
+}
+
+.journey-step.optional .journey-flag{
+  background: var(--surface-dim, #f4f6f8);
+  color: var(--ink-faint, #6b7785);
+  border: 1px solid var(--border, #d8dee6);
+}
+
+.journey-panel{
+  padding: 4px 8px 16px 32px;
+}
+
+.journey-summary{
+  margin: 0 0 12px;
+  font-size: 14px;
+  color: var(--ink-muted, #3d4a57);
+  line-height: 1.5;
+  max-width: 620px;
+}
+
+.journey-links{
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.journey-link{
+  font-size: 13px;
+  font-weight: 600;
+  padding: 7px 13px;
+  border-radius: var(--radius, 6px);
+  border: 1px solid var(--accent, #16324f);
+  color: var(--accent, #16324f);
+  background: #fff;
+}
+
+.journey-link:hover{
+  background: var(--accent, #16324f);
+  color: #fff;
+}
+
+.journey-link.alt{
+  border-color: var(--accent-alt, #b14a2c);
+  color: var(--accent-alt, #b14a2c);
+}
+
+.journey-link.alt:hover{
+  background: var(--accent-alt, #b14a2c);
+  color: #fff;
+}
+
+.journey-nolinks{
+  font-size: 13px;
+  color: var(--ink-faint, #6b7785);
+}
+
+.journey-loading{
+  font-size: 14px;
+  color: var(--ink-faint, #6b7785);
+}
+
+.why-block{
+  border-left: 4px solid var(--accent, #16324f);
+  background: var(--surface-dim, #f4f6f8);
+  padding: 1rem 1.1rem;
+  margin: 1rem 0 1.5rem;
+  border-radius: 0 6px 6px 0;
+}
+.why-block h2{ margin-top:0; font-size:1rem; }
+.confirm-banner, .confirm-note{
+  background: #fff8e6;
+  border: 1px solid #e6c35c;
+  padding: .65rem .85rem;
+  border-radius: 6px;
+  margin: .75rem 0;
+}
+.knowledge-page .prose-column{
+  max-width: 46rem;
+  margin: 0 auto;
+  padding: 1.5rem 1.25rem 3rem;
+}
+.guide-steps .expected, .expected{ opacity:.8; font-size:.92rem; margin-top:.25rem; }
+.skip-link{
+  position:absolute; left:-999px; top:0; background:#000; color:#fff; padding:.5rem 1rem; z-index:100;
+}
+.skip-link:focus{ left:.5rem; top:.5rem; }
+.kicker{ text-transform:uppercase; letter-spacing:.06em; font-size:.75rem; opacity:.65; }
+.lead{ font-size:1.1rem; line-height:1.45; }
+.tech-name{ font-size:.95rem; }
+.muted{ opacity:.7; }
+
+.search-label { display:block; font-weight:600; margin-bottom:.35rem; }
+.search-input { width:100%; max-width:40rem; padding:.65rem .75rem; font:inherit; border:1px solid var(--border,#d8dee6); border-radius:6px; }
+.search-filters { display:flex; flex-wrap:wrap; gap:.4rem; margin: .75rem 0 1rem; }
+.search-results { list-style:none; padding:0; margin:0; }
+.search-results li { padding:.55rem 0; border-bottom:1px solid rgba(0,0,0,.06); }
+.search-type { font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; opacity:.65; margin-right:.35rem; }
+.diagram-block { margin:1.5rem 0; }
+.diagram-toolbar { display:flex; flex-wrap:wrap; gap:.4rem; margin:.75rem 0; }
+.diagram-text-alt { margin-top:1rem; padding:.75rem 1rem; background:var(--surface-dim,#f4f6f8); border-radius:6px; }
+.diagram-table { width:100%; border-collapse:collapse; font-size:.9rem; }
+.diagram-table th, .diagram-table td { border:1px solid var(--border,#d8dee6); padding:.4rem .55rem; text-align:left; }
+.diagram-list { padding-left:1.25rem; }
+.diagram-spatial { overflow:auto; border:1px solid var(--border,#d8dee6); border-radius:6px; padding:.5rem; }

package/dist/web/assets/site.css

@@ -267,6 +267,27 @@ main{ flex: 1; }
   gap: 10px;
 }
 
+a.grid-cell-link{
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background 0.15s ease, box-shadow 0.15s ease;
+}
+
+a.grid-cell-link:hover{
+  background: var(--surface-dim, #f4f6f8);
+}
+
+a.grid-cell-link:hover .cell-title{
+  color: var(--accent);
+}
+
+a.grid-cell-link:focus-visible{
+  outline: 2px solid var(--accent);
+  outline-offset: -2px;
+  z-index: 1;
+}
+
 .cell-title{ font-weight: 600; font-size: 17px; }
 .cell-body{
   font-size: 14.5px;

package/dist/web/books/00-orient-connectix.html

@@ -8,6 +8,40 @@
 <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
 <link rel="stylesheet" href="/assets/site.css">
 <link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
 </head>
 <body class="page-book-landing" style="--accent:#2f6feb;--accent-alt:#1f6e5c" data-page="book-landing">
 <div class="page-shell">
@@ -29,8 +63,7 @@
     <div class="hero-kicker">Book 00</div>
     <h1>Orient on Connectix</h1>
     <p class="hero-lead">The Connectix mental model: curated operations, bindings instead of secrets, stub versus live execution, and the Credorix/Memorix ownership boundaries.</p>
-    <div class="tag-row"><span class="tag ">developers</span></div>
-    <div class="cta-row"><a class="btn btn-primary" href="/read?book=00-orient-connectix&role=developers">Read — developers</a></div>
+    <div class="cta-row"><a class="btn btn-primary" href="/read?book=00-orient-connectix&role=developers">Read for developers</a></div>
   </section>
   <section class="section meta-grid">
     

package/dist/web/books/01-tools-and-simulator.html

@@ -8,6 +8,40 @@
 <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
 <link rel="stylesheet" href="/assets/site.css">
 <link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
 </head>
 <body class="page-book-landing" style="--accent:#2f6feb;--accent-alt:#1f6e5c" data-page="book-landing">
 <div class="page-shell">
@@ -29,8 +63,7 @@
     <div class="hero-kicker">Book 01</div>
     <h1>AI Tools and the Package Simulator</h1>
     <p class="hero-lead">How to expose Connectix as LLM tools with @x12i/connectix-tools, run the @x12i/connectix-simulator package simulator, and understand catalog extension provenance.</p>
-    <div class="tag-row"><span class="tag ">developers</span></div>
-    <div class="cta-row"><a class="btn btn-primary" href="/read?book=01-tools-and-simulator&role=developers">Read — developers</a></div>
+    <div class="cta-row"><a class="btn btn-primary" href="/read?book=01-tools-and-simulator&role=developers">Read for developers</a></div>
   </section>
   <section class="section meta-grid">
     

package/dist/web/catalog.html

@@ -8,6 +8,40 @@
 <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
 <link rel="stylesheet" href="/assets/site.css">
 <link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
 </head>
 <body class="page-catalog" style="--accent:#2f6feb;--accent-alt:#1f6e5c" data-page="catalog">
 <div class="page-shell">
@@ -37,9 +71,13 @@
     <p class="install-lead">Knowledge SDK — install as a <strong>devDependency</strong> only (not a production runtime).</p>
     <pre class="install-cmd install-cmd-primary"><code>npm i -D @x12i/connectix-docs</code></pre>
     
+    
+    
+    
     <p class="install-more"><a href="/agents">Agents / SDK details →</a> · <a href="/agent-manifest.json">agent-manifest.json</a></p>
   </div>
 </section>
+
 <section class="section" data-hydrate="catalog">
   <div id="catalog-root" class="list-table-wrap" data-coming-soon=""></div>
 </section>

package/dist/web/concepts.html

@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Concepts · Connectix</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="/assets/site.css">
+<link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
+</head>
+<body>
+<a class="skip-link" href="#main-content">Skip to content</a>
+<header class="site-header">
+  <a class="brand" href="/docs">
+    <span class="brand-mark" aria-hidden="true"></span>
+    <span class="brand-name">connectix</span>
+    <span class="brand-badge">docs</span>
+  </a>
+  <button type="button" class="nav-toggle" aria-label="Menu" data-nav-toggle>Menu</button>
+  <nav class="site-nav" data-site-nav>
+    <a href="/getting-started">Getting started</a><a href="/use-cases">Use cases</a><a href="/catalog">Catalog</a><a href="/agents">Agents/SDK</a><a href="/search">Search</a><a href="/explore">Explore</a>
+  </nav>
+</header>
+<main id="main-content" class="knowledge-page">
+<article class="prose-column"><h1>Concepts</h1><ul class="knowledge-index"></ul></article>
+</main>
+<script src="/app.js"></script>
+<script>bindNavToggle();</script>
+</body>
+</html>

package/dist/web/diagrams.html

@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Diagrams · Connectix</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="/assets/site.css">
+<link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
+</head>
+<body>
+<a class="skip-link" href="#main-content">Skip to content</a>
+<header class="site-header">
+  <a class="brand" href="/docs">
+    <span class="brand-mark" aria-hidden="true"></span>
+    <span class="brand-name">connectix</span>
+    <span class="brand-badge">docs</span>
+  </a>
+  <button type="button" class="nav-toggle" aria-label="Menu" data-nav-toggle>Menu</button>
+  <nav class="site-nav" data-site-nav>
+    <a href="/getting-started">Getting started</a><a href="/use-cases">Use cases</a><a href="/catalog">Catalog</a><a href="/agents">Agents/SDK</a><a href="/search">Search</a><a href="/explore">Explore</a>
+  </nav>
+</header>
+<main id="main-content" class="knowledge-page">
+<article class="prose-column"><h1>Diagrams</h1><ul class="knowledge-index"></ul></article>
+</main>
+<script src="/app.js"></script>
+<script>bindNavToggle();</script>
+</body>
+</html>

package/dist/web/docs.html

@@ -8,6 +8,40 @@
 <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap" rel="stylesheet">
 <link rel="stylesheet" href="/assets/site.css">
 <link rel="stylesheet" href="/assets/extras.css">
+<script data-docify-guard="docify:serve-guard">
+(function () {
+  if (window.location.protocol !== "file:") return;
+  var cmd = "npm run docs";
+  var dir = "";
+  function render() {
+    var host = document.createElement("div");
+    host.setAttribute("role", "alert");
+    host.setAttribute("style", "position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:24px;margin:0;background:#0b0e14;color:#e6e9ef;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif");
+    host.innerHTML =
+      '<div style="max-width:44rem">' +
+      '<p style="margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8b95a7">Docify</p>' +
+      '<h1 style="margin:0 0 12px;font-size:28px;line-height:1.2">Serve this site to view it</h1>' +
+      '<p style="margin:0 0 16px;color:#b6bfcf">This page was opened from the file system, so its stylesheets and scripts ' +
+      'cannot load and the layout you see is not the real design. Docify sites are served over HTTP.</p>' +
+      '<pre style="margin:0 0 16px;padding:14px 16px;border-radius:10px;background:#151a23;border:1px solid #232a36;overflow:auto;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e6e9ef"><code>' +
+      (dir ? "cd " + dir + "\n" : "") + cmd + '</code></pre>' +
+      '<p style="margin:0;color:#8b95a7;font-size:14px">The command builds the bundle, starts the local server, and opens the correct URL.</p>' +
+      "</div>";
+    document.documentElement.style.background = "#0b0e14";
+    if (document.body) {
+      document.body.innerHTML = "";
+      document.body.appendChild(host);
+    } else {
+      document.documentElement.appendChild(host);
+    }
+  }
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", render);
+  } else {
+    render();
+  }
+})();
+</script>
 </head>
 <body class="page-docs-home" style="--accent:#2f6feb;--accent-alt:#1f6e5c" data-page="docs-home">
 <div class="page-shell">
@@ -37,9 +71,13 @@
     <p class="install-lead">Knowledge SDK — install as a <strong>devDependency</strong> only (not a production runtime).</p>
     <pre class="install-cmd install-cmd-primary"><code>npm i -D @x12i/connectix-docs</code></pre>
     
+    
+    
+    
     <p class="install-more"><a href="/agents">Agents / SDK details →</a> · <a href="/agent-manifest.json">agent-manifest.json</a></p>
   </div>
 </section>
+
 <section class="section tracks"><div class="track track-main">
   <div class="tag ">Developers</div>
   <ol class="step-list"><li><span class="step-num">1</span><span class="step-text"><a href="/books/00-orient-connectix">Orient on Connectix</a></span></li><li><span class="step-num">2</span><span class="step-text"><a href="/use-cases">Expose AI tools</a></span></li><li><span class="step-num">3</span><span class="step-text"><a href="/books/01-tools-and-simulator">Run the package simulator</a></span></li></ol>