From 2a9af3ade9317e9bb8f2b81b94e902eaea7e4e5a Mon Sep 17 00:00:00 2001
From: callumalpass <callumalpass@gmail.com>
Date: Sat, 1 Aug 2026 08:14:15 +1000
Subject: [PATCH 1/5] Add beta access signup page

---
 src/components/SiteFooter.astro |   1 +
 src/pages/beta/index.astro      | 325 ++++++++++++++++++++++++++++++++
 src/pages/connect/index.astro   |   4 +-
 src/pages/index.astro           |   6 +-
 src/pages/privacy/index.astro   |   8 +-
 5 files changed, 337 insertions(+), 7 deletions(-)
 create mode 100644 src/pages/beta/index.astro

diff --git a/src/components/SiteFooter.astro b/src/components/SiteFooter.astro
index 7a9e78c..678ecc2 100644
--- a/src/components/SiteFooter.astro
+++ b/src/components/SiteFooter.astro
@@ -6,6 +6,7 @@
     </div>
     <nav aria-label="Footer navigation">
       <a href="/#orientation">Start here</a>
+      <a href="/beta/">Beta access</a>
       <a href="/connect/">Connect</a>
       <a href="/sdk/">SDK docs</a>
       <a href="/interop/">Interoperability</a>
diff --git a/src/pages/beta/index.astro b/src/pages/beta/index.astro
new file mode 100644
index 0000000..8f40edb
--- /dev/null
+++ b/src/pages/beta/index.astro
@@ -0,0 +1,325 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+
+const connectOrigin = import.meta.env.PUBLIC_MDBASE_CONNECT_URL
+  ?? "https://connect.mdbase.dev";
+const betaAccessEndpoint = new URL(
+  "/v1/beta-access-requests",
+  connectOrigin
+).toString();
+---
+
+<BaseLayout
+  title="Request beta access"
+  description="Request access to the mdbase Connect private beta."
+>
+  <section class="beta-opening">
+    <header class="beta-opening__copy">
+      <p class="eyebrow">Connect private beta</p>
+      <h1>Request beta access.</h1>
+      <p>
+        mdbase Connect is opening gradually while the remaining release checks
+        are completed.
+      </p>
+    </header>
+
+    <div class="beta-intake">
+      <form
+        class="beta-form"
+        data-beta-form
+        data-endpoint={betaAccessEndpoint}
+        action={betaAccessEndpoint}
+        method="post"
+        novalidate
+      >
+        <label for="beta-email">Email address</label>
+        <div class="beta-form__entry">
+          <input
+            id="beta-email"
+            name="email"
+            type="email"
+            autocomplete="email"
+            inputmode="email"
+            maxlength="320"
+            required
+            spellcheck="false"
+          />
+          <button type="submit">Request access</button>
+        </div>
+        <div class="beta-honeypot" aria-hidden="true">
+          <label for="beta-website">Website</label>
+          <input
+            id="beta-website"
+            name="website"
+            type="text"
+            autocomplete="off"
+            tabindex="-1"
+          />
+        </div>
+        <p class="beta-form__status" data-beta-status role="status" aria-live="polite"></p>
+      </form>
+      <p class="beta-intake__privacy">
+        We use this address to manage beta access and contact you about the
+        beta. Requesting access does not guarantee immediate availability.
+        <a href="/privacy/">Privacy</a>
+      </p>
+    </div>
+  </section>
+
+  <section class="beta-next">
+    <p class="eyebrow">After your request</p>
+    <div>
+      <h2>Invitations are sent in small batches.</h2>
+      <p>
+        If access is available, you will receive a one-time signup link at the
+        address you submitted. Connect remains pre-release software, so keep
+        independent backups of important collections.
+      </p>
+    </div>
+  </section>
+
+  <script>
+    const form = document.querySelector("[data-beta-form]");
+    if (form instanceof HTMLFormElement) {
+      const email = form.elements.namedItem("email");
+      const website = form.elements.namedItem("website");
+      const button = form.querySelector("button[type='submit']");
+      const status = form.querySelector("[data-beta-status]");
+
+      form.addEventListener("submit", async (event) => {
+        event.preventDefault();
+        if (
+          !(email instanceof HTMLInputElement)
+          || !(website instanceof HTMLInputElement)
+          || !(button instanceof HTMLButtonElement)
+          || !(status instanceof HTMLElement)
+        ) return;
+
+        const address = email.value.trim();
+        email.value = address;
+        email.removeAttribute("aria-invalid");
+        if (!address || !email.validity.valid) {
+          email.setAttribute("aria-invalid", "true");
+          status.dataset.state = "error";
+          status.textContent = "Enter a valid email address.";
+          email.focus();
+          return;
+        }
+
+        button.disabled = true;
+        button.setAttribute("aria-busy", "true");
+        button.textContent = "Requesting…";
+        status.dataset.state = "pending";
+        status.textContent = "Sending your request.";
+
+        try {
+          const response = await fetch(form.dataset.endpoint ?? "", {
+            method: "POST",
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify({
+              email: address,
+              ...(website.value ? { website: website.value } : {})
+            })
+          });
+          if (!response.ok) {
+            if (response.status === 429) {
+              throw new Error("rate_limited");
+            }
+            throw new Error("request_failed");
+          }
+          email.disabled = true;
+          button.removeAttribute("aria-busy");
+          status.dataset.state = "success";
+          status.textContent =
+            "Request received. We’ll email you when beta access is available.";
+          button.textContent = "Request received";
+        } catch (error) {
+          button.disabled = false;
+          button.removeAttribute("aria-busy");
+          button.textContent = "Request access";
+          status.dataset.state = "error";
+          status.textContent = error instanceof Error && error.message === "rate_limited"
+            ? "Too many requests have been sent. Please try again later."
+            : "We couldn’t send your request. Please try again.";
+        }
+      });
+    }
+  </script>
+</BaseLayout>
+
+<style>
+  .beta-opening {
+    display: grid;
+    width: min(100% - 2rem, var(--page));
+    min-height: min(42rem, calc(100vh - var(--header)));
+    margin-inline: auto;
+    padding-block: clamp(4rem, 9vw, 8rem);
+    align-items: end;
+    grid-template-columns: minmax(0, 0.92fr) minmax(20rem, 0.68fr);
+    gap: clamp(3rem, 9vw, 9rem);
+  }
+
+  .beta-opening__copy h1 {
+    max-width: 11ch;
+    margin-top: 1rem;
+    font-size: clamp(3rem, 6vw, 5.75rem);
+    letter-spacing: -0.055em;
+  }
+
+  .beta-opening__copy > p:last-child {
+    max-width: 34rem;
+    margin-top: 1.5rem;
+    color: var(--ink-soft);
+    font-size: clamp(1rem, 1.5vw, 1.125rem);
+  }
+
+  .beta-intake {
+    padding-top: 1.25rem;
+    border-top: 1px solid var(--line-strong);
+  }
+
+  .beta-form label {
+    display: block;
+    color: var(--ink);
+    font-size: 0.8rem;
+    font-weight: 700;
+  }
+
+  .beta-form__entry {
+    display: grid;
+    margin-top: 0.55rem;
+    grid-template-columns: minmax(0, 1fr) auto;
+  }
+
+  .beta-form input {
+    width: 100%;
+    min-height: 2.75rem;
+    padding: 0.55rem 0.7rem;
+    color: var(--ink);
+    background: var(--canvas);
+    border: 1px solid var(--line-strong);
+    border-radius: var(--radius) 0 0 var(--radius);
+  }
+
+  .beta-form input:hover {
+    border-color: var(--ink-muted);
+  }
+
+  .beta-form input[aria-invalid="true"] {
+    border-color: var(--danger);
+  }
+
+  .beta-form button {
+    min-height: 2.75rem;
+    padding: 0.55rem 0.9rem;
+    color: var(--ink);
+    background: var(--canvas);
+    border: 1px solid var(--ink-soft);
+    border-left: 0;
+    border-radius: 0 var(--radius) var(--radius) 0;
+    font-size: 0.78rem;
+    font-weight: 700;
+    white-space: nowrap;
+    transition:
+      color 160ms var(--ease),
+      background-color 160ms var(--ease),
+      border-color 160ms var(--ease);
+  }
+
+  .beta-form button:hover:not(:disabled) {
+    color: var(--blue-strong);
+    background: var(--surface);
+    border-color: var(--blue);
+  }
+
+  .beta-form button:disabled {
+    cursor: default;
+    opacity: 0.66;
+  }
+
+  .beta-form__status {
+    min-height: 1.4rem;
+    margin-top: 0.65rem;
+    color: var(--ink-muted);
+    font-size: 0.78rem;
+  }
+
+  .beta-form__status[data-state="error"] {
+    color: var(--danger);
+  }
+
+  .beta-form__status[data-state="success"] {
+    color: var(--signal);
+  }
+
+  .beta-intake__privacy {
+    margin-top: 1rem;
+    color: var(--ink-muted);
+    font-size: 0.75rem;
+    line-height: 1.55;
+  }
+
+  .beta-honeypot {
+    position: absolute;
+    left: -10000px;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+  }
+
+  .beta-next {
+    display: grid;
+    width: min(100% - 2rem, var(--page));
+    margin-inline: auto;
+    padding-block: clamp(3rem, 6vw, 5rem);
+    border-top: 1px solid var(--line);
+    grid-template-columns: minmax(12rem, 0.42fr) minmax(0, 1fr);
+    gap: clamp(2rem, 7vw, 7rem);
+  }
+
+  .beta-next h2 {
+    max-width: 18ch;
+    font-size: clamp(1.6rem, 3vw, 2.5rem);
+  }
+
+  .beta-next div p {
+    max-width: 52ch;
+    margin-top: 1rem;
+    color: var(--ink-soft);
+  }
+
+  @media (max-width: 48rem) {
+    .beta-opening {
+      min-height: 0;
+      align-items: start;
+      grid-template-columns: 1fr;
+      gap: 3.5rem;
+    }
+
+    .beta-opening__copy h1 {
+      font-size: clamp(3rem, 14vw, 4.6rem);
+    }
+
+    .beta-next {
+      grid-template-columns: 1fr;
+      gap: 1rem;
+    }
+  }
+
+  @media (max-width: 31rem) {
+    .beta-form__entry {
+      grid-template-columns: 1fr;
+      gap: 0.55rem;
+    }
+
+    .beta-form input,
+    .beta-form button {
+      border: 1px solid var(--line-strong);
+      border-radius: var(--radius);
+    }
+
+    .beta-form button {
+      justify-self: start;
+    }
+  }
+</style>
diff --git a/src/pages/connect/index.astro b/src/pages/connect/index.astro
index aa1f6a9..02e7974 100644
--- a/src/pages/connect/index.astro
+++ b/src/pages/connect/index.astro
@@ -39,8 +39,8 @@ const steps = [
           the folder or hosted collection it can use.
         </p>
         <div class="button-row">
-          <a class="button button--primary" href="#use-connect">See how it works</a>
-          <a class="button" href="/sdk/connect-quickstart/">Build an app</a>
+          <a class="button button--primary" href="/beta/">Request beta access</a>
+          <a class="button" href="#use-connect">See how it works</a>
         </div>
       </div>
     </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index b1b4983..2de004e 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -31,8 +31,8 @@ import HomeLayout from "../layouts/HomeLayout.astro";
           <li><span>Controlled</span><strong>Each app gets only the access you approve</strong></li>
         </ul>
         <div class="chapter__actions chapter__actions--intro">
-          <a class="button" href="/sdk/quickstart/">Run the local example</a>
-          <a class="text-link" href="#orientation">See how the pieces fit</a>
+          <a class="button" href="/beta/">Request beta access</a>
+          <a class="text-link" href="/sdk/quickstart/">Run the local example</a>
         </div>
       </div>
     </section>
@@ -281,7 +281,7 @@ easier to understand.</code></pre>
         </div>
         <div>
           <dt>Connect service</dt>
-          <dd><strong>Private beta</strong><span>Local and hosted authorities are deployed for beta accounts</span></dd>
+          <dd><strong><a href="/beta/">Private beta</a></strong><span>Local and hosted authorities are deployed for beta accounts</span></dd>
         </div>
         <div>
           <dt>Connect SDK</dt>
diff --git a/src/pages/privacy/index.astro b/src/pages/privacy/index.astro
index 1db4532..a301e0e 100644
--- a/src/pages/privacy/index.astro
+++ b/src/pages/privacy/index.astro
@@ -14,8 +14,12 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     <h2>Website</h2>
     <p>
       mdbase.dev is a public static documentation website. It has no account
-      system or advertising trackers. The hosting provider may retain ordinary
-      request logs for security and service operation.
+      system or advertising trackers. When you request beta access, mdbase
+      Connect retains the submitted email address and request time so the
+      request can be reviewed and an invitation can be sent. Rate-limit records
+      use keyed digests of the email and network address; the access-request
+      record does not store the network address. The hosting provider may also
+      retain ordinary request logs for security and service operation.
     </p>
     <h2>Connect</h2>
     <p>

From 41a2f6925701cb9e35739df89f8d5a111b266479 Mon Sep 17 00:00:00 2001
From: callumalpass <callumalpass@gmail.com>
Date: Sat, 1 Aug 2026 09:16:46 +1000
Subject: [PATCH 2/5] Fix landing page reading wash

---
 src/styles/home.css | 43 +++++++++++++++++++++++--------------------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/src/styles/home.css b/src/styles/home.css
index 21c3971..c4919de 100644
--- a/src/styles/home.css
+++ b/src/styles/home.css
@@ -30,15 +30,7 @@
 }
 
 .home-body::before {
-  z-index: 1;
-  background: linear-gradient(
-    90deg,
-    var(--paper) 0%,
-    var(--paper) 45%,
-    color-mix(in oklch, var(--paper) 96%, transparent) 50%,
-    color-mix(in oklch, var(--paper) 62%, transparent) 58%,
-    transparent 66%
-  );
+  display: none;
 }
 
 .home-body > main {
@@ -394,23 +386,34 @@
 }
 
 @media (max-width: 820px) {
-  .home-body::before {
-    background: linear-gradient(
-      180deg,
-      transparent 0%,
-      transparent 38vh,
-      color-mix(in oklch, var(--paper) 44%, transparent) 44vh,
-      color-mix(in oklch, var(--paper) 96%, transparent) 54vh,
-      var(--paper) 58vh
-    );
-  }
-
   .home-body .chapter__inner,
   .home-body .chapter.is-active .chapter__inner {
+    position: relative;
+    z-index: 1;
+    isolation: isolate;
     opacity: 1;
     transform: none;
   }
 
+  .home-body .chapter__inner::before {
+    position: absolute;
+    z-index: -1;
+    top: -20vh;
+    bottom: -16vh;
+    left: 50%;
+    width: 100vw;
+    content: "";
+    pointer-events: none;
+    background: linear-gradient(
+      180deg,
+      transparent 0%,
+      color-mix(in oklch, var(--paper) 44%, transparent) 6vh,
+      color-mix(in oklch, var(--paper) 96%, transparent) 16vh,
+      var(--paper) 20vh
+    );
+    transform: translateX(-50%);
+  }
+
   .home-body h1 {
     font-size: clamp(2.75rem, 13.5vw, 4rem);
   }

From 376cbe67eb7907182a13c939b9de8504caa9fd64 Mon Sep 17 00:00:00 2001
From: callumalpass <callumalpass@gmail.com>
Date: Sat, 1 Aug 2026 12:41:45 +1000
Subject: [PATCH 3/5] Simplify website product pages

---
 scripts/import-spec.mjs               |   3 +-
 src/components/SiteFooter.astro       |   5 +-
 src/components/SiteHeader.astro       |   5 +-
 src/layouts/BaseLayout.astro          |   2 +-
 src/pages/connect/index.astro         | 913 ++++++++++++++++++--------
 src/pages/implementations/index.astro | 117 ----
 src/pages/index.astro                 | 319 +--------
 src/pages/interop/index.astro         | 160 -----
 src/pages/runtime/index.astro         |   2 +-
 src/pages/sdk/contracts/index.astro   |   4 +-
 src/pages/testbed/index.astro         | 573 ----------------
 src/styles/home.css                   | 345 +---------
 12 files changed, 688 insertions(+), 1760 deletions(-)
 delete mode 100644 src/pages/implementations/index.astro
 delete mode 100644 src/pages/interop/index.astro
 delete mode 100644 src/pages/testbed/index.astro

diff --git a/scripts/import-spec.mjs b/scripts/import-spec.mjs
index 37f3518..e948dfc 100644
--- a/scripts/import-spec.mjs
+++ b/scripts/import-spec.mjs
@@ -53,7 +53,8 @@ function rewrite(html, archive) {
     .replaceAll('href="style.css', 'href="/spec/style.css')
     .replaceAll('href="mdbase-favicon.svg"', 'href="/spec/mdbase-favicon.svg"')
     .replaceAll('href="runtime.html"', 'href="/runtime/"')
-    .replaceAll('href="ecosystem.html"', 'href="/implementations/"')
+    .replaceAll('<a href="ecosystem.html">Implementations</a>', '')
+    .replaceAll('href="/testbed/"', 'href="#section-16"')
     .replaceAll('href="spec-v0.2.html"', 'href="/spec/v0.2/"')
     .replaceAll('href="spec.html"', 'href="/spec/"')
     .replaceAll(
diff --git a/src/components/SiteFooter.astro b/src/components/SiteFooter.astro
index 678ecc2..6c2f981 100644
--- a/src/components/SiteFooter.astro
+++ b/src/components/SiteFooter.astro
@@ -5,15 +5,12 @@
       <p>Markdown collections with types, queries, and explicit app permissions.</p>
     </div>
     <nav aria-label="Footer navigation">
-      <a href="/#orientation">Start here</a>
+      <a href="/#intro">Start here</a>
       <a href="/beta/">Beta access</a>
       <a href="/connect/">Connect</a>
       <a href="/sdk/">SDK docs</a>
-      <a href="/interop/">Interoperability</a>
-      <a href="/testbed/">Testbed</a>
       <a href="/runtime/">Runtime</a>
       <a href="/contracts/">Contracts</a>
-      <a href="/implementations/">Implementations</a>
       <a href="/spec/">Specification</a>
       <a href="/security/">Security</a>
       <a href="/privacy/">Privacy</a>
diff --git a/src/components/SiteHeader.astro b/src/components/SiteHeader.astro
index d8fdc2a..5f36b47 100644
--- a/src/components/SiteHeader.astro
+++ b/src/components/SiteHeader.astro
@@ -2,7 +2,7 @@
 import BrandMark from "./BrandMark.astro";
 
 interface Props {
-  current?: "home" | "connect" | "sdk" | "interop" | "testbed" | "runtime" | "implementations" | "spec";
+  current?: "home" | "connect" | "sdk" | "runtime" | "spec";
   showSceneCount?: boolean;
 }
 
@@ -11,9 +11,6 @@ const links = [
   { href: "/", label: "Learn", key: "home" },
   { href: "/connect/", label: "Connect", key: "connect" },
   { href: "/sdk/quickstart/", label: "Build", key: "sdk" },
-  { href: "/interop/", label: "Interop", key: "interop" },
-  { href: "/testbed/", label: "Test", key: "testbed" },
-  { href: "/implementations/", label: "Implement", key: "implementations" },
   { href: "/spec/", label: "Spec", key: "spec" }
 ] as const;
 ---
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 99535a4..89bb313 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -12,7 +12,7 @@ import ThemeControlScript from "../components/ThemeControlScript.astro";
 interface Props {
   title: string;
   description: string;
-  current?: "home" | "connect" | "sdk" | "interop" | "testbed" | "runtime" | "implementations" | "spec";
+  current?: "home" | "connect" | "sdk" | "runtime" | "spec";
   noIndex?: boolean;
 }
 
diff --git a/src/pages/connect/index.astro b/src/pages/connect/index.astro
index 02e7974..4100d14 100644
--- a/src/pages/connect/index.astro
+++ b/src/pages/connect/index.astro
@@ -1,314 +1,677 @@
 ---
 import BaseLayout from "../../layouts/BaseLayout.astro";
-
-const steps = [
-  {
-    title: "The application declares what it understands",
-    copy: "Its bundled v1 manifest declares web callbacks or portable distribution, required domain contracts, collection kind, and any type definitions that can be installed safely."
-  },
-  {
-    title: "Connect checks collection compatibility",
-    copy: "The local or hosted authority returns a readiness status for each collection: ready, provisionable, or incompatible. Collection contents remain private during authorization."
-  },
-  {
-    title: "The user approves exact operations",
-    copy: "The decision names one collection and concrete operations. Contract access is scoped to records that match the declared domain contracts unless full collection access is explicitly requested."
-  },
-  {
-    title: "Every request is checked at the authority",
-    copy: "The connector or hosted provider rechecks the current grant. Narrowing, pausing, or revoking access takes effect at the place that can open the data."
-  }
-];
 ---
 
 <BaseLayout
   title="mdbase Connect"
-  description="Choose which apps can use your local or hosted mdbase collections, and exactly what each app can do."
+  description="Choose which apps can use a local folder or hosted mdbase collection, review exact permissions, and revoke access at any time."
   current="connect"
 >
-  <section class="page-hero">
-    <div class="page-hero__inner">
-      <div>
-        <p class="eyebrow"><i></i> Private beta</p>
-        <h1>Use your Markdown with the apps you choose.</h1>
+  <section class="connect-opening">
+    <div class="connect-opening__copy">
+      <p class="eyebrow">Connect private beta</p>
+      <h1>Choose which apps can use your Markdown.</h1>
+      <p class="connect-opening__lead">
+        When an app asks to use a collection, Connect shows whether it wants
+        to view, change, or delete records. You choose the collection and can
+        change or revoke access at any time.
+      </p>
+      <div class="button-row">
+        <a class="button button--primary" href="/beta/">Request beta access</a>
+        <a class="button" href="#how-connect-works">See how Connect works</a>
       </div>
-      <div class="page-hero__aside">
-        <p>
-          Start in the app you want to use. mdbase Connect opens when that app
-          needs a collection, shows what it is asking for, and lets you choose
-          the folder or hosted collection it can use.
-        </p>
-        <div class="button-row">
-          <a class="button button--primary" href="/beta/">Request beta access</a>
-          <a class="button" href="#use-connect">See how it works</a>
+    </div>
+
+    <figure class="connect-example" aria-label="Example Connect access request">
+      <figcaption>Example access request</figcaption>
+      <div class="connect-request">
+        <header class="connect-request__header">
+          <div>
+            <p class="eyebrow">Access request</p>
+            <p class="connect-request__app">Project app</p>
+          </div>
+          <span class="connect-request__status">Waiting for you</span>
+        </header>
+
+        <div class="connect-request__section">
+          <div>
+            <strong>Collection</strong>
+            <small>Choose where Project app can work.</small>
+          </div>
+          <div class="connect-request__collection">
+            <span>Projects</span>
+            <small>On this computer</small>
+          </div>
         </div>
+
+        <div class="connect-request__section">
+          <div>
+            <strong>Permissions</strong>
+            <small>Open the details to narrow access.</small>
+          </div>
+          <ul class="connect-request__permissions">
+            <li>
+              <span class="permission-state permission-state--selected" aria-hidden="true">✓</span>
+              <span>View and find records</span>
+            </li>
+            <li>
+              <span class="permission-state permission-state--selected" aria-hidden="true">✓</span>
+              <span>Create and edit records</span>
+            </li>
+            <li class="permission-unselected">
+              <span class="permission-state" aria-hidden="true"></span>
+              <span>Delete records</span>
+            </li>
+          </ul>
+        </div>
+
+        <footer class="connect-request__footer">
+          <p>
+            Project app will use Projects until you revoke access.
+          </p>
+          <div class="connect-request__actions" aria-hidden="true">
+            <span>Deny</span>
+            <span class="connect-request__allow">Allow Project app</span>
+          </div>
+        </footer>
       </div>
-    </div>
+    </figure>
   </section>
 
-  <section class="content-section" id="use-connect">
-    <p class="eyebrow"><i></i> For people using apps</p>
-    <h2>Start in the app you want to use</h2>
-    <p>
-      Connect keeps the same request open while it helps you sign in, pair this
-      computer, and choose or create a collection.
-    </p>
-    <ol class="plain-sequence" aria-label="Using an app with mdbase Connect">
-      <li>
-        <strong>Open the app</strong>
-        <span>Choose its Connect action. It opens a request that names the app and the access it needs.</span>
-      </li>
-      <li>
-        <strong>Choose your collection</strong>
-        <span>Use a folder on this computer or a hosted collection. Connect guides any sign-in or computer pairing along the way.</span>
-      </li>
-      <li>
-        <strong>Review the result</strong>
-        <span>See whether the app can view, edit, or delete records. You can remove permissions before approving.</span>
-      </li>
-      <li>
-        <strong>Return to the app</strong>
-        <span>Connect sends the approved collection back to the app. Pause, narrow, or revoke access at any time.</span>
-      </li>
-    </ol>
-    <div class="callout">
-      <strong>Local folder behavior</strong>
+  <section class="connect-section connect-how" id="how-connect-works">
+    <header class="connect-section__intro">
+      <p class="eyebrow">How it works</p>
+      <h2>Start in the app.</h2>
       <p>
-        A collection kept on your computer remains ordinary Markdown in the
-        folder you chose. The app and account service do not receive that
-        folder path.
+        Connect keeps the request open while you sign in, choose a collection,
+        and decide what the app may do.
       </p>
-    </div>
-  </section>
+    </header>
 
-  <section class="content-section">
-    <p class="eyebrow"><i></i> For developers</p>
-    <h2>Where Connect sits</h2>
-    <p>
-      Connect is optional. Applications can also use a conforming mdbase
-      implementation directly. Connect provides a common approval and routing
-      path when independent applications need access to a user's collections.
-    </p>
-    <ol class="plain-sequence" aria-label="Connect request path">
+    <ol class="connect-steps" aria-label="Using an app with mdbase Connect">
       <li>
-        <strong>Application</strong>
-        <span>Declares compatible collections and requests exact operations.</span>
-      </li>
-      <li>
-        <strong>Connect</strong>
-        <span>Presents the request, records the decision, and selects the route.</span>
+        <span>01</span>
+        <div>
+          <h3>An app asks for access</h3>
+          <p>
+            The request names the app and the actions it needs. The app cannot
+            use a collection before you make a decision.
+          </p>
+        </div>
       </li>
       <li>
-        <strong>Collection authority</strong>
-        <span>Rechecks the grant and executes each approved operation.</span>
+        <span>02</span>
+        <div>
+          <h3>You choose the collection and permissions</h3>
+          <p>
+            Use a folder on this computer or a hosted collection. Remove any
+            requested permissions you do not want to grant.
+          </p>
+        </div>
       </li>
       <li>
-        <strong>mdbase collection</strong>
-        <span>Remains the authoritative Markdown and collection history.</span>
+        <span>03</span>
+        <div>
+          <h3>Connect returns you to the app</h3>
+          <p>
+            The approved access stays attached to that app and collection. You
+            can narrow, pause, or revoke it later.
+          </p>
+        </div>
       </li>
     </ol>
   </section>
 
-  <section class="content-section">
-    <h2>Local and hosted collections</h2>
-    <p>
-      Applications use the same SDK and operation envelopes. Routing changes
-      according to which connector or provider currently holds the collection's
-      authority.
-    </p>
-    <table class="trust-table">
-      <thead>
-        <tr>
-          <th>Authority</th>
-          <th>Where Markdown lives</th>
-          <th>Application route</th>
-          <th>What the control plane sees</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>Local connector</td>
-          <td>A folder on the user's computer</td>
-          <td>Direct loopback, then encrypted relay fallback</td>
-          <td>Account, grant, operation name, routing metadata, timing, and sizes</td>
-        </tr>
-        <tr>
-          <td>Hosted provider</td>
-          <td>Encrypted provider storage, with optional local mirror</td>
-          <td>Direct, short-lived provider capability</td>
-          <td>Account, grant, capability issuance, and provider routing metadata</td>
-        </tr>
-      </tbody>
-    </table>
-    <div class="callout">
-      <strong>Hosted collections use a standard hosted trust model.</strong>
-      <p>
-        The provider must decrypt collection data to execute canonical mdbase
-        operations. The provider acts as a trusted data processor for hosted
-        collections.
-      </p>
-    </div>
-  </section>
-
-  <section class="content-section" id="one-authority">
-    <h2>Why one movable authority?</h2>
-    <p>
-      Authority is a coordination role, not the only copy of a collection.
-      Writable mirrors can keep ordinary Markdown on several devices, accept
-      changes while offline, and synchronize them later. One authority orders
-      the final accepted changes, enforces collection-wide rules, and gives
-      every mirror the same history to converge on.
-    </p>
-    <p>
-      Removing that role would not remove coordination. It would require every
-      peer—including filesystem editors that only know how to rewrite a
-      Markdown file—to preserve causal history and agree continuously about
-      concurrent edits, renames, deletes, schema changes, revocation, and
-      garbage collection.
-    </p>
-    <table class="trust-table">
-      <thead>
-        <tr>
-          <th>Concern</th>
-          <th>Equal peers would require</th>
-          <th>One movable authority provides</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>Ordinary Markdown tools</td>
-          <td>CRDT or event metadata preserved by every writer</td>
-          <td>Open files remain the editable local format</td>
-        </tr>
-        <tr>
-          <td>Concurrent changes</td>
-          <td>A deterministic merge for every body and frontmatter value</td>
-          <td>Revision checks, durable mutation receipts, and explicit conflicts</td>
-        </tr>
-        <tr>
-          <td>Renames, deletes, and configuration</td>
-          <td>Distributed agreement over paths, tombstones, schemas, and constraints</td>
-          <td>One canonical order for collection-wide decisions</td>
-        </tr>
-        <tr>
-          <td>Offline devices</td>
-          <td>Split-brain reconciliation and peer-membership machinery</td>
-          <td>Queued local work that safely converges when the mirror reconnects</td>
-        </tr>
-      </tbody>
-    </table>
-    <div class="callout">
-      <strong>The role can move without changing the collection.</strong>
+  <section class="connect-section connect-storage">
+    <header class="connect-section__intro connect-section__intro--wide">
+      <p class="eyebrow">Where your collection lives</p>
+      <h2>Keep it on your computer or host it online.</h2>
       <p>
-        Authority transfer preserves the collection and record identities,
-        advances an authority epoch, and retires the previous authority. When
-        the previous authority was a local folder, that folder can continue as
-        a mirror. A stale authority cannot accept writes after cutover.
+        Apps use the same approval flow in both cases. The location of the
+        collection determines which component can open the records and execute
+        approved operations.
       </p>
-    </div>
-  </section>
+    </header>
 
-  <section class="content-section">
-    <h2>The authorization sequence</h2>
-    <div class="steps">
-      {
-        steps.map((step) => (
-          <div class="step">
-            <div>
-              <h3>{step.title}</h3>
-              <p>{step.copy}</p>
-            </div>
-          </div>
-        ))
-      }
-    </div>
-  </section>
+    <div class="collection-modes">
+      <article class="collection-mode">
+        <header>
+          <h3>Local folder</h3>
+          <p>On this computer</p>
+        </header>
+        <div>
+          <strong>Where Markdown lives</strong>
+          <p>
+            In an ordinary folder you choose. The files remain available to
+            your text editor and other local tools.
+          </p>
+        </div>
+        <div>
+          <strong>Who can read records</strong>
+          <p>
+            The local connector and apps using an active grant. The Connect
+            control plane cannot read local operation payloads or results.
+          </p>
+        </div>
+      </article>
 
-  <section class="content-section">
-    <h2>Who can read records</h2>
-    <p>
-      Connect limits the components that can read records. Local and hosted
-      collections have different trust boundaries.
-    </p>
-    <table class="trust-table">
-      <thead>
-        <tr>
-          <th>Component</th>
-          <th>Can read collection records?</th>
-          <th>Responsibility</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>Application</td>
-          <td>Only through its current grant</td>
-          <td>Uses authorized results and protects its local SDK credentials</td>
-        </tr>
-        <tr>
-          <td>Local connector</td>
-          <td>Yes, for registered local collections</td>
-          <td>Final local authorization boundary and operation executor</td>
-        </tr>
-        <tr>
-          <td>Connect control plane</td>
-          <td>No local operation payloads or results</td>
-          <td>Identity, pairing, grants, short-lived tokens, and relay routing</td>
-        </tr>
-        <tr>
-          <td>Hosted provider</td>
-          <td>Yes, for hosted collections</td>
-          <td>Encrypted storage, canonical execution, sync, and durable receipts</td>
-        </tr>
-      </tbody>
-    </table>
-    <div class="button-row" style="margin-top: 2rem">
-      <a class="button" href="/security/">Complete security model</a>
-      <a class="button" href="/sdk/routing/">Routing guide</a>
+      <article class="collection-mode">
+        <header>
+          <h3>Hosted collection</h3>
+          <p>Available online</p>
+        </header>
+        <div>
+          <strong>Where Markdown lives</strong>
+          <p>
+            In encrypted provider storage, with an optional local Markdown
+            mirror for offline work.
+          </p>
+        </div>
+        <div>
+          <strong>Who can read records</strong>
+          <p>
+            The hosted provider decrypts records to execute approved
+            operations and acts as a trusted data processor.
+          </p>
+        </div>
+      </article>
     </div>
-  </section>
 
-  <section class="content-section">
-    <p class="eyebrow"><i></i> Release status</p>
-    <h2 style="margin-top: 1rem">Release status</h2>
-    <p>
-      The private-beta stack includes local and hosted authorities, encrypted
-      relay operations, grant narrowing and revocation, sync, notifications,
-      the browser SDK, and key-bound authorization for downloaded HTML files.
-      The npm packages have not yet received their first public release. Public
-      registration, a production restore drill, signed desktop releases, and
-      abuse-response operations are still required before public registration.
-    </p>
-    <div class="button-row" style="margin-top: 2rem">
-      <a class="button button--primary" href="/sdk/">Read the SDK documentation</a>
-      <a class="button" href="https://github.com/mdbase-dev/mdbase-connect/blob/main/README.md">
-        Follow release status
-      </a>
+    <div class="connect-control-note">
+      <strong>Permissions can change later.</strong>
+      <p>
+        Narrow an app to fewer actions, pause access temporarily, or revoke the
+        connection. The collection remains usable after an app is removed.
+      </p>
     </div>
   </section>
 
-  <section class="content-section">
-    <h2>Terms used on this site</h2>
-    <dl class="glossary-list">
-      <div>
-        <dt>Grant</dt>
-        <dd>One user's approval for one application, one collection, and a concrete set of operations.</dd>
-      </div>
-      <div>
-        <dt>Authority</dt>
-        <dd>The movable coordination role that orders accepted changes, enforces collection rules, and makes the final authorization decision.</dd>
-      </div>
-      <div>
-        <dt>Control plane</dt>
-        <dd>The Connect service for identity, pairing, grants, short-lived tokens, and route coordination.</dd>
-      </div>
+  <section class="connect-closing">
+    <div class="connect-closing__inner">
       <div>
-        <dt>Contract</dt>
-        <dd>A portable declaration of domain behavior and its mapping to one collection type.</dd>
+        <p class="eyebrow">Connect private beta</p>
+        <h2>Try Connect with your own Markdown.</h2>
+        <p>
+          Invitations are sent in small batches. Requesting access only needs
+          your email address.
+        </p>
       </div>
-      <div>
-        <dt>Operation envelope</dt>
-        <dd>A typed result containing a validity flag, result value, and structured diagnostics.</dd>
+      <div class="button-row">
+        <a class="button button--primary" href="/beta/">Request beta access</a>
+        <a class="button" href="/sdk/connect-quickstart/">Build with the SDK</a>
       </div>
-    </dl>
+    </div>
+
+    <nav class="connect-resources" aria-label="Connect technical resources">
+      <span>Technical details</span>
+      <a href="/sdk/authorization/">Authorization guide</a>
+      <a href="/sdk/routing/">Routing guide</a>
+      <a href="/security/">Security model</a>
+      <a href="https://github.com/mdbase-dev/mdbase-connect/blob/main/README.md">Release status</a>
+    </nav>
   </section>
 </BaseLayout>
+
+<style>
+  .connect-opening,
+  .connect-section,
+  .connect-closing {
+    width: min(100% - 2rem, var(--page));
+    margin-inline: auto;
+  }
+
+  .connect-opening {
+    display: grid;
+    min-height: min(48rem, calc(100vh - var(--header)));
+    padding-block: clamp(4rem, 8vw, 7rem);
+    align-items: center;
+    grid-template-columns: minmax(0, 0.78fr) minmax(26rem, 0.92fr);
+    gap: clamp(3rem, 8vw, 8rem);
+    border-bottom: 1px solid var(--line);
+  }
+
+  .connect-opening__copy h1 {
+    max-width: 11ch;
+    margin-top: 1rem;
+    font-size: clamp(3rem, 5.8vw, 5.5rem);
+    letter-spacing: -0.055em;
+  }
+
+  .connect-opening__lead {
+    max-width: 35rem;
+    margin-top: 1.5rem;
+    color: var(--ink-soft);
+    font-size: clamp(1rem, 1.4vw, 1.125rem);
+  }
+
+  .connect-opening__copy .button-row {
+    margin-top: 1.75rem;
+  }
+
+  .connect-example {
+    min-width: 0;
+    padding: clamp(1rem, 2.6vw, 2rem);
+    background: var(--surface);
+    border: 1px solid var(--line);
+  }
+
+  .connect-example > figcaption {
+    margin-bottom: 0.65rem;
+    color: var(--ink-muted);
+    font: 500 0.65rem/1.4 var(--mono);
+  }
+
+  .connect-request {
+    background: var(--canvas);
+    border: 1px solid var(--line-strong);
+    border-radius: var(--radius);
+    box-shadow: 0 1.5rem 4rem color-mix(in oklch, var(--ink) 7%, transparent);
+  }
+
+  .connect-request__header,
+  .connect-request__section,
+  .connect-request__footer {
+    display: grid;
+    padding: 1rem 1.1rem;
+    grid-template-columns: minmax(9rem, 0.7fr) minmax(0, 1fr);
+    gap: 1.25rem;
+  }
+
+  .connect-request__header,
+  .connect-request__section {
+    border-bottom: 1px solid var(--line);
+  }
+
+  .connect-request__header {
+    position: relative;
+    align-items: start;
+  }
+
+  .connect-request__app {
+    margin-top: 0.35rem;
+    color: var(--ink);
+    font-size: 1.2rem;
+    font-weight: 700;
+    line-height: 1.1;
+  }
+
+  .connect-request__status {
+    justify-self: end;
+    padding: 0.28rem 0.45rem;
+    color: var(--ink-soft);
+    background: var(--surface);
+    border: 1px solid var(--line);
+    border-radius: 2px;
+    font: 500 0.62rem/1.2 var(--mono);
+  }
+
+  .connect-request__section strong,
+  .collection-mode strong {
+    display: block;
+    color: var(--ink);
+    font-size: 0.82rem;
+  }
+
+  .connect-request__section small {
+    display: block;
+    margin-top: 0.25rem;
+    color: var(--ink-muted);
+    font-size: 0.76rem;
+    line-height: 1.4;
+  }
+
+  .connect-request__collection {
+    padding: 0.65rem 0.75rem;
+    background: var(--surface);
+    border: 1px solid var(--line);
+    border-radius: 3px;
+  }
+
+  .connect-request__collection > span {
+    display: block;
+    color: var(--ink);
+    font-size: 0.86rem;
+    font-weight: 700;
+  }
+
+  .connect-request__permissions {
+    padding: 0;
+    list-style: none;
+  }
+
+  .connect-request__permissions li {
+    display: grid;
+    max-width: none;
+    min-height: 2.35rem;
+    padding: 0.45rem 0;
+    align-items: center;
+    grid-template-columns: 1.1rem minmax(0, 1fr);
+    gap: 0.55rem;
+    color: var(--ink);
+    border-top: 1px solid var(--line);
+    font-size: 0.82rem;
+  }
+
+  .connect-request__permissions li:first-child {
+    border-top: 0;
+  }
+
+  .permission-state {
+    display: grid;
+    width: 0.95rem;
+    height: 0.95rem;
+    place-items: center;
+    color: var(--canvas);
+    border: 1px solid var(--line-strong);
+    border-radius: 2px;
+    font-size: 0.68rem;
+    line-height: 1;
+  }
+
+  .permission-state--selected {
+    background: var(--blue);
+    border-color: var(--blue);
+  }
+
+  .connect-request__permissions .permission-unselected {
+    color: var(--ink-muted);
+  }
+
+  .connect-request__footer {
+    align-items: center;
+    grid-template-columns: minmax(0, 1fr) auto;
+  }
+
+  .connect-request__footer p {
+    color: var(--ink-soft);
+    font-size: 0.76rem;
+  }
+
+  .connect-request__actions {
+    display: flex;
+    gap: 0.45rem;
+  }
+
+  .connect-request__actions span {
+    display: inline-flex;
+    min-height: 2rem;
+    padding: 0.35rem 0.65rem;
+    align-items: center;
+    color: var(--ink-soft);
+    background: var(--canvas);
+    border: 1px solid var(--line);
+    border-radius: 3px;
+    font-size: 0.7rem;
+    font-weight: 700;
+  }
+
+  .connect-request__actions .connect-request__allow {
+    color: var(--canvas);
+    background: var(--ink);
+    border-color: var(--ink);
+  }
+
+  .connect-section {
+    padding-block: clamp(4rem, 7vw, 6.5rem);
+    border-bottom: 1px solid var(--line);
+  }
+
+  .connect-how {
+    display: grid;
+    grid-template-columns: minmax(15rem, 0.58fr) minmax(0, 1fr);
+    gap: clamp(3rem, 9vw, 9rem);
+  }
+
+  .connect-section__intro h2 {
+    max-width: 14ch;
+    margin-top: 0.9rem;
+  }
+
+  .connect-section__intro > p:last-child {
+    max-width: 39rem;
+    margin-top: 1.15rem;
+    color: var(--ink-soft);
+    font-size: 1rem;
+  }
+
+  .connect-section__intro--wide h2 {
+    max-width: 19ch;
+  }
+
+  .connect-steps {
+    padding: 0;
+    border-top: 1px solid var(--line-strong);
+    list-style: none;
+  }
+
+  .connect-steps li {
+    display: grid;
+    max-width: none;
+    padding: 1.4rem 0;
+    grid-template-columns: 2.4rem minmax(0, 1fr);
+    gap: 1rem;
+    border-bottom: 1px solid var(--line);
+  }
+
+  .connect-steps > li > span {
+    color: var(--ink-muted);
+    font: 500 0.65rem/1.5 var(--mono);
+  }
+
+  .connect-steps h3 {
+    max-width: none;
+    font-size: 1.05rem;
+  }
+
+  .connect-steps p {
+    margin-top: 0.5rem;
+    color: var(--ink-soft);
+    font-size: 0.95rem;
+  }
+
+  .collection-modes {
+    margin-top: clamp(2.5rem, 5vw, 4.5rem);
+    border-top: 1px solid var(--line-strong);
+  }
+
+  .collection-mode {
+    display: grid;
+    padding-block: 1.5rem;
+    grid-template-columns: minmax(11rem, 0.48fr) repeat(2, minmax(0, 1fr));
+    gap: clamp(1.5rem, 4vw, 4rem);
+    border-bottom: 1px solid var(--line);
+  }
+
+  .collection-mode h3 {
+    font-size: 1.1rem;
+  }
+
+  .collection-mode header p {
+    margin-top: 0.35rem;
+    color: var(--ink-muted);
+    font: 500 0.65rem/1.4 var(--mono);
+  }
+
+  .collection-mode > div p {
+    margin-top: 0.45rem;
+    color: var(--ink-soft);
+    font-size: 0.9rem;
+  }
+
+  .connect-control-note {
+    display: grid;
+    margin-top: 2.5rem;
+    padding-top: 1.25rem;
+    grid-template-columns: minmax(11rem, 0.48fr) minmax(0, 1fr);
+    gap: clamp(1.5rem, 4vw, 4rem);
+    border-top: 1px solid var(--line-strong);
+  }
+
+  .connect-control-note strong {
+    color: var(--ink);
+    font-size: 1rem;
+  }
+
+  .connect-control-note p {
+    max-width: 43rem;
+    color: var(--ink-soft);
+    font-size: 0.95rem;
+  }
+
+  .connect-closing {
+    padding-block: clamp(4.5rem, 8vw, 7.5rem) 2rem;
+  }
+
+  .connect-closing__inner {
+    display: grid;
+    align-items: end;
+    grid-template-columns: minmax(0, 1fr) auto;
+    gap: 3rem;
+  }
+
+  .connect-closing h2 {
+    max-width: 15ch;
+    margin-top: 0.9rem;
+    font-size: clamp(2.2rem, 4vw, 3.8rem);
+  }
+
+  .connect-closing__inner p:last-child {
+    max-width: 38rem;
+    margin-top: 1.15rem;
+    color: var(--ink-soft);
+    font-size: 1rem;
+  }
+
+  .connect-resources {
+    display: flex;
+    margin-top: clamp(3.5rem, 7vw, 6rem);
+    padding-top: 1rem;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 0.55rem 1.35rem;
+    border-top: 1px solid var(--line);
+    font-size: 0.78rem;
+  }
+
+  .connect-resources span {
+    color: var(--ink-muted);
+    font: 500 0.65rem/1.4 var(--mono);
+  }
+
+  .connect-resources a {
+    color: var(--ink-soft);
+    text-decoration-color: var(--line-strong);
+  }
+
+  .connect-resources a:hover {
+    color: var(--blue-strong);
+  }
+
+  @media (max-width: 60rem) {
+    .connect-opening {
+      min-height: auto;
+      grid-template-columns: 1fr;
+    }
+
+    .connect-opening__copy {
+      max-width: 42rem;
+    }
+
+    .connect-example {
+      width: min(100%, 42rem);
+    }
+
+    .connect-how {
+      grid-template-columns: 1fr;
+      gap: 2.5rem;
+    }
+
+    .connect-section__intro {
+      max-width: 40rem;
+    }
+  }
+
+  @media (max-width: 42rem) {
+    .connect-opening,
+    .connect-section,
+    .connect-closing {
+      width: min(100% - 1.25rem, var(--page));
+    }
+
+    .connect-opening {
+      padding-block: 3.5rem 4rem;
+      gap: 2.75rem;
+    }
+
+    .connect-opening__copy h1 {
+      font-size: clamp(2.75rem, 13vw, 4rem);
+    }
+
+    .connect-example {
+      padding: 0.65rem;
+    }
+
+    .connect-request__header,
+    .connect-request__section,
+    .connect-request__footer {
+      padding: 0.9rem;
+      grid-template-columns: 1fr;
+      gap: 0.8rem;
+    }
+
+    .connect-request__status {
+      position: absolute;
+      margin-top: 0.05rem;
+      justify-self: end;
+    }
+
+    .connect-request__footer {
+      align-items: stretch;
+    }
+
+    .connect-request__actions {
+      justify-content: flex-end;
+    }
+
+    .collection-mode {
+      grid-template-columns: 1fr;
+      gap: 1.35rem;
+    }
+
+    .collection-mode > div {
+      display: grid;
+      grid-template-columns: minmax(8.5rem, 0.7fr) minmax(0, 1fr);
+      gap: 1rem;
+    }
+
+    .collection-mode > div p {
+      margin-top: 0;
+    }
+
+    .connect-control-note,
+    .connect-closing__inner {
+      grid-template-columns: 1fr;
+      gap: 1.25rem;
+    }
+
+    .connect-closing__inner .button-row {
+      margin-top: 0.5rem;
+    }
+  }
+
+  @media (max-width: 28rem) {
+    .collection-mode > div {
+      grid-template-columns: 1fr;
+      gap: 0.35rem;
+    }
+
+    .connect-request__actions {
+      display: grid;
+      grid-template-columns: auto minmax(0, 1fr);
+    }
+
+    .connect-request__actions span {
+      justify-content: center;
+    }
+  }
+</style>
diff --git a/src/pages/implementations/index.astro b/src/pages/implementations/index.astro
deleted file mode 100644
index 064cfa0..0000000
--- a/src/pages/implementations/index.astro
+++ /dev/null
@@ -1,117 +0,0 @@
----
-import BaseLayout from "../../layouts/BaseLayout.astro";
-import conformance from "../../data/conformance.json";
----
-
-<BaseLayout
-  title="Implementations"
-  description="Compare mdbase v0.3 conformance profiles and evidence for the Rust and TypeScript implementations."
-  current="implementations"
->
-  <section class="page-hero">
-    <div class="page-hero__inner">
-      <div>
-        <p class="eyebrow"><i></i> mdbase v0.3</p>
-        <h1>Implementation support</h1>
-      </div>
-      <div class="page-hero__aside">
-        <p>
-          mdbase v0.3 uses atomic profiles. Each row below names an artifact,
-          version, evidence date, and the profiles it claims. Atomic profiles
-          replace the legacy “Level 6” descriptions.
-        </p>
-        <div class="button-row">
-          <a class="button button--primary" href="/spec/#section-16">Conformance rules</a>
-          <a class="button" href="https://github.com/mdbase-dev/mdbase-spec/tree/main/tests/v0.3">
-            Shared fixtures
-          </a>
-        </div>
-      </div>
-    </div>
-  </section>
-
-  <section class="content-section">
-    <h2>Conformance claims</h2>
-    <table class="profile-table">
-      <thead>
-        <tr>
-          <th>Artifact</th>
-          <th>Version</th>
-          <th>Profiles</th>
-          <th>Evidence</th>
-        </tr>
-      </thead>
-      <tbody>
-        {
-          conformance.implementations.map((implementation) => (
-            <tr>
-              <td>
-                <a href={implementation.repository}>{implementation.name}</a><br />
-                <small>{implementation.language}</small>
-              </td>
-              <td><code>{implementation.version}</code></td>
-              <td>
-                {implementation.profiles.map((profile) => <code style="display: block">{profile}</code>)}
-                {
-                  implementation.optional_features.length > 0 && (
-                    <small>Optional: {implementation.optional_features.join(", ")}</small>
-                  )
-                }
-              </td>
-              <td>
-                <span>{implementation.evidence_date}</span><br />
-                <small>{implementation.note}</small>
-              </td>
-            </tr>
-          ))
-        }
-      </tbody>
-    </table>
-  </section>
-
-  <section class="content-section">
-    <h2>Fixture coverage status</h2>
-    <p>
-      An implementation claim and the shared suite's coverage status answer
-      different questions. The claim says what an artifact asserts it passes.
-      The coverage ledger says whether the specification's maintainers consider
-      the shared fixture set complete for that profile.
-    </p>
-    <table class="profile-table">
-      <thead>
-        <tr>
-          <th>Profile</th>
-          <th>Shared fixture coverage</th>
-        </tr>
-      </thead>
-      <tbody>
-        {
-          conformance.coverage.coverage_complete.map((profile) => (
-            <tr>
-              <td><code>{profile}</code></td>
-              <td><span class="status">Coverage complete</span></td>
-            </tr>
-          ))
-        }
-        {
-          conformance.coverage.draft.map((profile) => (
-            <tr>
-              <td><code>{profile}</code></td>
-              <td><span class="status status--draft">Draft coverage</span></td>
-            </tr>
-          ))
-        }
-      </tbody>
-    </table>
-    <div class="callout">
-      <strong>Runtime 0.2 has separate evidence.</strong>
-      <p>
-        The <code>mdbase-runtime-rs</code> row claims{" "}
-        <code>runtime/0.2</code> for durable admission, exact bindings,
-        recovery, and timers. The <code>mdbase-rs</code> row remains a
-        collection-engine claim; installing the collection crate alone does
-        not imply workflow execution.
-      </p>
-    </div>
-  </section>
-</BaseLayout>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 2de004e..d6dc09b 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -4,7 +4,7 @@ import HomeLayout from "../layouts/HomeLayout.astro";
 
 <HomeLayout
   title="mdbase"
-  description="A first introduction to mdbase collections, app permissions, and local or hosted storage."
+  description="Use the same Markdown files in different apps, keep the main copy where you choose, and approve access explicitly."
 >
   <div class="scroll-progress" aria-hidden="true"></div>
 
@@ -14,25 +14,15 @@ import HomeLayout from "../layouts/HomeLayout.astro";
     <section id="intro" class="chapter is-active" data-scene="intro">
       <div class="chapter__inner">
         <p class="chapter__status">mdbase v0.3 · Connect private beta</p>
-        <h1>Different apps can use the same Markdown files, online or offline.</h1>
+        <h1>Use the same Markdown files in different apps.</h1>
         <p class="chapter__lead">
-          An mdbase is a folder of ordinary Markdown files, plus a small
-          description of how they fit together. You can read the files
-          yourself, keep them where you choose, and let more than one app work
-          with them.
+          An mdbase is a folder of ordinary Markdown files that more than one
+          app can understand. You can open the files yourself, keep them where
+          you choose, and decide which apps may use them.
         </p>
-        <p class="chapter__body">
-          mdbase gives independent apps a shared, durable collection of
-          ordinary files. The collection remains under your control.
-        </p>
-        <ul class="facts" aria-label="The three ideas behind mdbase">
-          <li><span>Readable</span><strong>Markdown you can open with ordinary tools</strong></li>
-          <li><span>Understandable</span><strong>Shared definitions tell apps what records mean</strong></li>
-          <li><span>Controlled</span><strong>Each app gets only the access you approve</strong></li>
-        </ul>
         <div class="chapter__actions chapter__actions--intro">
           <a class="button" href="/beta/">Request beta access</a>
-          <a class="text-link" href="/sdk/quickstart/">Run the local example</a>
+          <a class="text-link" href="#example">See how it works</a>
         </div>
       </div>
     </section>
@@ -41,8 +31,9 @@ import HomeLayout from "../layouts/HomeLayout.astro";
       <div class="chapter__inner">
         <h2>Here is one small mdbase.</h2>
         <p class="chapter__lead">
-          This project collection has ordinary Markdown records, definitions
-          for the kinds of records it contains, and one configuration file.
+          This one contains project records, type definitions, and a small
+          configuration file. A project app, a report, and a text editor can
+          all use the same files.
         </p>
         <pre class="file-tree" aria-label="Example mdbase folder"><code><span>projects/</span>
 ├── <strong>mdbase.yaml</strong>
@@ -53,26 +44,15 @@ import HomeLayout from "../layouts/HomeLayout.astro";
 │   └── website-redesign.md
 └── <span>people/</span>
     └── sam.md</code></pre>
-        <p class="chapter__body">
-          Each record remains useful on its own. The extra files let an app
-          recognise a project, understand fields such as status and owner, and
-          check that a change is valid.
-        </p>
-        <ul class="facts" aria-label="Three ways to use the example collection">
-          <li><span>Project app</span><strong>Updates status and owner through typed operations</strong></li>
-          <li><span>Report app</span><strong>Reads the same projects for a weekly summary</strong></li>
-          <li><span>Text editor</span><strong>Opens the exact Markdown records directly</strong></li>
-        </ul>
       </div>
     </section>
 
     <section id="meaning" class="chapter" data-scene="structure">
       <div class="chapter__inner">
-        <h2>The files make sense to people and apps.</h2>
+        <h2>The files stay readable.</h2>
         <p class="chapter__lead">
-          A project record is still a normal Markdown document. A short block
-          at the top gives apps the facts they need; the rest is writing you can
-          read and edit anywhere.
+          Each record is still a normal Markdown document. A short block at the
+          top gives apps shared facts such as its title, status, and owner.
         </p>
         <pre class="record-example" aria-label="Example project record"><code><span>---</span>
 type: project
@@ -84,290 +64,53 @@ owner: "[[people/sam.md]]"
 The new site should make mdbase
 easier to understand.</code></pre>
         <p class="chapter__body">
-          The type definition stored in the same collection explains these
-          fields. A new app can check that it understands them before asking
-          you for access.
+          The type definition stored beside the records explains what those
+          fields mean, so different apps can use them consistently.
         </p>
       </div>
     </section>
 
     <section id="storage" class="chapter" data-scene="modes">
       <div class="chapter__inner">
-        <h2>Keep it local or host it with mdbase.</h2>
+        <h2>Keep it on your computer or host it online.</h2>
         <p class="chapter__lead">
-          Hosting is optional. In both cases the records remain Markdown, apps
-          use the same basic actions, and you decide which apps can connect.
+          For a local mdbase, the folder on your computer is the main copy. For
+          a hosted mdbase, mdbase keeps the main copy available online.
         </p>
         <p class="chapter__body">
-          The difference is which copy has the final say. For a local mdbase,
-          that is the folder on your computer. For a hosted mdbase, it is the
-          online copy kept by mdbase.
+          The records stay Markdown in both places, and you choose which apps
+          may connect.
         </p>
-        <ul class="facts" aria-label="Collection storage choices">
-          <li><span>Local</span><strong>Your folder is the main copy; your computer must be reachable</strong></li>
-          <li><span>Hosted</span><strong>mdbase keeps the main copy available online</strong></li>
-          <li><span>Either way</span><strong>You keep readable files and explicit app permissions</strong></li>
-        </ul>
       </div>
     </section>
 
     <section id="permission" class="chapter" data-scene="grant">
       <div class="chapter__inner">
-        <h2>An app asks before it sees anything.</h2>
+        <h2>You choose what each app can do.</h2>
         <p class="chapter__lead">
-          The request names the app, the kind of collection it understands, and
-          every action it wants to perform. Your records stay private while you
-          decide.
-        </p>
-        <p class="chapter__body">
-          You choose one compatible collection and approve only the actions
-          that make sense. Permission belongs to that app and that collection;
-          it can be narrowed, paused, or revoked later.
+          An app asks for one collection and a specific set of actions. You
+          review the request before it can read or change anything.
         </p>
         <ol class="steps" aria-label="How an app receives access">
-          <li><span>1</span><strong>Review the app and the collection it understands</strong></li>
-          <li><span>2</span><strong>Choose a collection and its allowed actions</strong></li>
-          <li><span>3</span><strong>Approve the connection or keep the collection private</strong></li>
+          <li><span>1</span><strong>See which app is asking</strong></li>
+          <li><span>2</span><strong>Choose the collection it may use</strong></li>
+          <li><span>3</span><strong>Approve only the actions you want</strong></li>
         </ol>
-        <ul class="facts" aria-label="Actions an app may request">
-          <li><span>Read</span><strong>Open records and see their contents</strong></li>
-          <li><span>Search</span><strong>Find matching records</strong></li>
-          <li><span>Edit</span><strong>Create, update, rename, or delete records</strong></li>
-        </ul>
       </div>
     </section>
 
     <section id="after-approval" class="chapter" data-scene="access">
       <div class="chapter__inner">
-        <h2>The main copy stays in control.</h2>
+        <h2>Access stays under your control.</h2>
         <p class="chapter__lead">
-          For a local collection, the mdbase connector on your computer checks
-          every request before opening or changing a file. Local folder paths
-          stay on your computer.
-        </p>
-        <p class="chapter__body">
-          For a hosted collection, mdbase checks the same permission beside the
-          online main copy. An approved app may keep an offline copy of records
-          it can use, and you may keep an optional synced Markdown copy for
-          local tools.
+          Pause or remove an app's access at any time. The main copy keeps every
+          change in order while approved apps can keep working copies for
+          offline use.
         </p>
-        <ul class="facts" aria-label="What remains true after approval">
-          <li><span>Main copy</span><strong>One authoritative history keeps changes in order</strong></li>
-          <li><span>Working copies</span><strong>Useful for offline and local work</strong></li>
-          <li><span>Your control</span><strong>Pause or revoke an app's access at any time</strong></li>
-        </ul>
         <div class="chapter__actions">
-          <a class="button" href="#orientation">Choose a next step</a>
-          <a class="text-link" href="/spec/">Read the specification</a>
-        </div>
-      </div>
-    </section>
-
-    <section id="orientation" class="home-reference orientation">
-      <div class="home-reference__opening">
-        <p class="section-label">The ecosystem</p>
-        <h2>Five names, one route to the files.</h2>
-        <p>
-          <strong>mdbase</strong> is the collection format and specification.
-          The other names describe software that reads a collection, connects
-          applications to it, or runs workflows beside it.
-        </p>
-      </div>
-
-      <ol class="ecosystem-flow" aria-label="How the mdbase ecosystem fits together">
-        <li>
-          <span>01</span>
-          <div>
-            <strong>Application</strong>
-            <p>A project board, reporting tool, agent, or general collection editor.</p>
-          </div>
-          <a href="/sdk/">uses the Connect SDK</a>
-        </li>
-        <li>
-          <span>02</span>
-          <div>
-            <strong><code>@mdbase/connect</code></strong>
-            <p>The application SDK for authorization, saved connections, routing, and typed operations.</p>
-          </div>
-          <a href="/sdk/quickstart/">try it locally</a>
-        </li>
-        <li>
-          <span>03</span>
-          <div>
-            <strong>mdbase Connect</strong>
-            <p>The optional access layer for application grants, local routing, and hosted collections.</p>
-          </div>
-          <a href="/connect/">understand Connect</a>
-        </li>
-        <li>
-          <span>04</span>
-          <div>
-            <strong>Conforming implementation</strong>
-            <p>Executes collection discovery, validation, queries, links, and revision-safe changes.</p>
-          </div>
-          <a href="/implementations/">compare support</a>
-        </li>
-        <li>
-          <span>05</span>
-          <div>
-            <strong>mdbase collection</strong>
-            <p>The authoritative Markdown, YAML, types, and collection configuration.</p>
-          </div>
-          <a href="/spec/">read the specification</a>
-        </li>
-      </ol>
-
-      <p class="orientation__runtime">
-        <a href="/interop/">Event and action interoperability</a> lets
-        independent applications cooperate through shared contracts.{" "}
-        <a href="/runtime/">Durable runtime execution</a> is an optional layer
-        for persisted workflows, timers, retries, and recovery.
-      </p>
-    </section>
-
-    <section class="home-reference working-example">
-      <div class="home-reference__opening">
-        <p class="section-label">A current example</p>
-        <h2>One task collection, three useful views.</h2>
-        <p>
-          TaskNotes and the mdbase-tasknotes command line tool can use the same
-          task type and Markdown records. Ordinary file tools continue to read
-          and version those records directly.
-        </p>
-      </div>
-      <div class="tool-example">
-        <div>
-          <span>Obsidian</span>
-          <strong>TaskNotes</strong>
-          <p>Provides task views and editing inside an Obsidian vault with mdbase export enabled.</p>
-          <a href="https://github.com/callumalpass/tasknotes">Open TaskNotes</a>
-        </div>
-        <div>
-          <span>Terminal</span>
-          <strong>mdbase-tasknotes</strong>
-          <p>Creates and queries the same tasks through the shared collection core.</p>
-          <a href="https://github.com/callumalpass/mdbase-tasknotes">Open the CLI</a>
-        </div>
-        <div>
-          <span>Files</span>
-          <strong>Editor and Git</strong>
-          <p>Read the Markdown, inspect frontmatter, and review every durable change as text.</p>
-          <a href="/spec/#section-03">Read record semantics</a>
-        </div>
-      </div>
-      <p class="working-example__note">
-        The specification defines the shared collection behavior. Each tool
-        owns its interface and task-domain behavior.
-      </p>
-    </section>
-
-    <section class="home-reference availability">
-      <div class="home-reference__opening">
-        <p class="section-label">Availability</p>
-        <h2>What you can use today.</h2>
-        <p>
-          The specification and implementation evidence are public. Connect is
-          operating as a private beta while its release gates are completed.
-        </p>
-      </div>
-      <dl class="availability-list">
-        <div>
-          <dt>Specification</dt>
-          <dd><strong>Public</strong><span>mdbase v0.3, fixtures, and conformance rules</span></dd>
-        </div>
-        <div>
-          <dt>Implementations</dt>
-          <dd><strong>Public source</strong><span>Versioned Rust and TypeScript profile claims</span></dd>
-        </div>
-        <div>
-          <dt>Connect service</dt>
-          <dd><strong><a href="/beta/">Private beta</a></strong><span>Local and hosted authorities are deployed for beta accounts</span></dd>
-        </div>
-        <div>
-          <dt>Connect SDK</dt>
-          <dd><strong>Source build</strong><span>The npm packages await their first public release</span></dd>
+          <a class="button" href="/beta/">Request beta access</a>
+          <a class="text-link" href="/sdk/quickstart/">Build with the SDK</a>
         </div>
-      </dl>
-    </section>
-
-    <section class="home-reference next-steps">
-      <div class="home-reference__opening">
-        <p class="section-label">Choose a path</p>
-        <h2>Start with the outcome you need.</h2>
-      </div>
-      <div class="route-list">
-        <a href="/sdk/quickstart/">
-          <span>Run an example</span>
-          <strong>Use the real SDK against an in-memory collection, with no account or service.</strong>
-          <i aria-hidden="true">01</i>
-        </a>
-        <a href="/sdk/connect-quickstart/">
-          <span>Build an application</span>
-          <strong>Add a manifest, request a grant, and operate on one approved collection.</strong>
-          <i aria-hidden="true">02</i>
-        </a>
-        <a href="/implementations/">
-          <span>Implement the specification</span>
-          <strong>Compare profiles, open the shared fixtures, and publish exact evidence.</strong>
-          <i aria-hidden="true">03</i>
-        </a>
-        <a href="/interop/">
-          <span>Connect applications</span>
-          <strong>Publish CloudEvents and invoke schema-validated actions through a local or durable bridge.</strong>
-          <i aria-hidden="true">04</i>
-        </a>
-      </div>
-    </section>
-
-    <section class="home-reference fit-guide">
-      <div class="home-reference__opening">
-        <p class="section-label">Fit guide</p>
-        <h2>Questions to settle early.</h2>
-      </div>
-      <div class="fit-guide__questions">
-        <details>
-          <summary>Is mdbase an application, a database, or a service?</summary>
-          <p>
-            mdbase is a specification for collections of Markdown records.
-            Implementations provide database-like operations over those files.
-            Connect is an optional service and local connector for application
-            authorization and routing.
-          </p>
-        </details>
-        <details>
-          <summary>Does an application need mdbase Connect?</summary>
-          <p>
-            An application can work directly with a conforming implementation.
-            Connect is useful when independent applications need user-approved
-            access to local or hosted collections through one SDK.
-          </p>
-        </details>
-        <details>
-          <summary>Can an existing Markdown folder become a collection?</summary>
-          <p>
-            Yes. Add <code>mdbase.yaml</code>, then introduce type definitions
-            as the collection needs validation, shared field meaning, links,
-            queries, or lifecycle rules.
-          </p>
-        </details>
-        <details>
-          <summary>Who can read collection records?</summary>
-          <p>
-            Local records are read by the registered connector and approved
-            applications. Hosted records are also readable by the hosted
-            provider so it can execute operations. The
-            <a href="/security/">security model</a> names each boundary.
-          </p>
-        </details>
-        <details>
-          <summary>Which path should a new developer take?</summary>
-          <p>
-            Run the <a href="/sdk/quickstart/">local SDK example</a> first.
-            Continue to the
-            <a href="/sdk/connect-quickstart/">Connect authorization guide</a>
-            when the collection operations and revision model are familiar.
-          </p>
-        </details>
       </div>
     </section>
   </main>
diff --git a/src/pages/interop/index.astro b/src/pages/interop/index.astro
deleted file mode 100644
index 22c7541..0000000
--- a/src/pages/interop/index.astro
+++ /dev/null
@@ -1,160 +0,0 @@
----
-import BaseLayout from "../../layouts/BaseLayout.astro";
-import CodeBlock from "../../components/CodeBlock.astro";
-
-const eventSource = `const tasknotes = bridge.connect({
-  application: "tasknotes",
-  implementation: "tasknotes.obsidian",
-  version: "5.0.0"
-});
-
-await tasknotes.registerEventSource({
-  declaration_id: "tasknotes.events",
-  contracts: [{ contract: taskCompletedContract }]
-});
-
-await tasknotes.publishEvent({
-  contract: { id: "tasknotes.task.completed", version: "1.0.0" },
-  subject: "Tasks/Ship%20contracts.md",
-  correlation_id: "workflow-42",
-  data: {
-    task_id: "task-42",
-    task_path: "Tasks/Ship contracts.md",
-    title: "Ship contracts",
-    status: "done",
-    completed_at: "2026-07-28T10:15:00Z"
-  }
-});`;
-
-const actionCaller = `const outcome = await workflows.invokeAction({
-  request_id: "workflow:run-42:add-card",
-  contract: { id: "canvas.card.create", version: "^1.0.0" },
-  requested_provider: { application: "canvas-bases" },
-  correlation_id: "workflow-42",
-  causation_id: "evt-42",
-  idempotency_key: "run-42:add-card",
-  input: {
-    canvas_path: "TaskNotes/Canvases/Completed tasks.canvas",
-    card: { kind: "file", file: "Tasks/Ship contracts.md" }
-  }
-});
-
-if (outcome.status !== "succeeded") {
-  throw new Error(\`\${outcome.error.message} [\${outcome.error.code}]\`);
-}`;
----
-
-<BaseLayout
-  title="Event and action interoperability"
-  description="Exchange schema-validated CloudEvents and explicitly resolved actions between independent mdbase applications."
-  current="interop"
->
-  <section class="page-hero">
-    <div class="page-hero__inner">
-      <div>
-        <p class="eyebrow"><i></i> Interoperability profile 0.1</p>
-        <h1>Shared contracts. Independent applications.</h1>
-      </div>
-      <div class="page-hero__aside">
-        <p>
-          Applications can publish events and invoke actions without adopting
-          one universal runtime. JSON Schema proves compatibility; a separate
-          bridge grant supplies authority.
-        </p>
-        <div class="button-row">
-          <a class="button button--primary" href="/spec/#section-05b">
-            Read the specification
-          </a>
-          <a class="button" href="/interop/schemas/v0.1/profile.schema.json">
-            Download the schemas
-          </a>
-        </div>
-      </div>
-    </div>
-  </section>
-
-  <section class="content-section">
-    <h2>The mental model</h2>
-    <div class="steps">
-      <div class="step">
-        <div>
-          <h3>Contracts define meaning</h3>
-          <p>
-            Every record, event, and action is an ordinary first-class{" "}
-            <code>mdbase.contract</code>. Its discriminated shape names the
-            relevant JSON Schemas: <code>record_schema</code>,{" "}
-            <code>data_schema</code>, or action input and outcome schemas.
-          </p>
-        </div>
-      </div>
-      <div class="step">
-        <div>
-          <h3>Applications declare one role at a time</h3>
-          <p>
-            An application may be an event source, event consumer, action
-            caller, or action provider. A type file uses <code>implements</code>{" "}
-            only for record contracts; application declarations provide event
-            sources and action handlers.
-          </p>
-        </div>
-      </div>
-      <div class="step">
-        <div>
-          <h3>The bridge validates and routes</h3>
-          <p>
-            Events multicast to every authorized compatible consumer. Actions
-            resolve to exactly one authorized provider before any side effect.
-            Multiple eligible providers produce <code>ambiguous_provider</code>{" "}
-            until the caller or policy selects one.
-          </p>
-        </div>
-      </div>
-    </div>
-  </section>
-
-  <section class="content-section">
-    <h2>Events are CloudEvents 1.0</h2>
-    <p>
-      The profile uses CloudEvents structured JSON and adds exact contract
-      version, digest, application, and implementation attributes. The event
-      ID survives redelivery. Correlation and causation are explicit. Event
-      data always validates against the exact contract artifact.
-    </p>
-    <CodeBlock code={eventSource} language="ts" label="tasknotes-event.ts" />
-  </section>
-
-  <section class="content-section">
-    <h2>Actions produce evidence, not a delivery fiction</h2>
-    <p>
-      A logical request is admitted as an exact invocation with a selected
-      provider and concrete attempt. Its terminal outcome is{" "}
-      <code>succeeded</code>, <code>rejected</code>, <code>failed</code>,{" "}
-      <code>cancelled</code>, or <code>outcome_indeterminate</code>. Accepting a
-      message for delivery is never reported as successful execution.
-    </p>
-    <CodeBlock code={actionCaller} language="ts" label="workflow-action.ts" />
-  </section>
-
-  <section class="content-section">
-    <h2>What stays outside the profile</h2>
-    <table class="profile-table">
-      <thead>
-        <tr><th>In the profile</th><th>Owned elsewhere</th></tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>Contract identity, exact digests, envelopes, validation, resolution</td>
-          <td>Workflow languages, scheduling, retries, and application behavior</td>
-        </tr>
-        <tr>
-          <td>Correlation, causation, cancellation, duplicate and indeterminate semantics</td>
-          <td>Persistence, journals, leases, recovery, and offline queues</td>
-        </tr>
-        <tr>
-          <td>Identity and authorization context carried to a bridge</td>
-          <td>The user grant or transport-specific policy engine</td>
-        </tr>
-      </tbody>
-    </table>
-  </section>
-</BaseLayout>
diff --git a/src/pages/runtime/index.astro b/src/pages/runtime/index.astro
index 16947a5..08131c0 100644
--- a/src/pages/runtime/index.astro
+++ b/src/pages/runtime/index.astro
@@ -21,7 +21,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
         </p>
         <div class="button-row">
           <a class="button button--primary" href="/spec/#section-13">Read the runtime profile</a>
-          <a class="button" href="/interop/">Interoperability profile</a>
+          <a class="button" href="/spec/#section-05b">Interoperability profile</a>
         </div>
       </div>
     </div>
diff --git a/src/pages/sdk/contracts/index.astro b/src/pages/sdk/contracts/index.astro
index 9ce3b2d..1bdf2c5 100644
--- a/src/pages/sdk/contracts/index.astro
+++ b/src/pages/sdk/contracts/index.astro
@@ -152,7 +152,7 @@ export class WorklogCollection {
   </p>
   <p>
     Event sources and action providers declare executable implementations
-    through the <a href="/interop/">interoperability bridge</a>, not through a
-    type file.
+    through the <a href="/spec/#section-05b">interoperability bridge</a>, not
+    through a type file.
   </p>
 </DocsLayout>
diff --git a/src/pages/testbed/index.astro b/src/pages/testbed/index.astro
deleted file mode 100644
index b01002a..0000000
--- a/src/pages/testbed/index.astro
+++ /dev/null
@@ -1,573 +0,0 @@
----
-import BaseLayout from "../../layouts/BaseLayout.astro";
-import CodeBlock from "../../components/CodeBlock.astro";
-
-const runCommand = `npm install --save-dev @callumalpass/mdbase-testbed
-
-npx mdbase-testbed validate
-npx mdbase-testbed run \\
-  --adapter ./scripts/testbed-adapter.mjs \\
-  --evidence ./conformance/testbed-evidence.json`;
-
-const protocol = `your-adapter describe
-# writes one adapter-description JSON document
-
-your-adapter run
-# reads one scenario request from stdin
-# writes one observable transcript to stdout`;
-
-const rings = [
-  {
-    id: "contract",
-    number: "01",
-    title: "Contract",
-    count: 1,
-    summary: "One contract, one implementing type, one record, two consumers.",
-    scenarios: [
-      ["core.shared-contract-consumers", "Both consumers receive the same validated contract view."]
-    ]
-  },
-  {
-    id: "interop",
-    number: "02",
-    title: "Interop",
-    count: 11,
-    summary: "Live sources, consumers, callers, and providers cross an authorization boundary.",
-    scenarios: [
-      ["interop.event-multicast", "One event reaches every compatible consumer."],
-      ["interop.action-single-provider", "One eligible provider is selected."],
-      ["interop.action-ambiguous", "Two eligible providers stop implicit dispatch."],
-      ["interop.action-explicit-provider", "An explicit selector resolves ambiguity."],
-      ["interop.provider-disappearance", "An unloaded provider is unavailable."],
-      ["interop.contract-digest-drift", "Same version with a different digest is rejected."],
-      ["interop.invalid-payload", "Schema-invalid data never reaches a handler."],
-      ["interop.authority-boundary", "Compatibility cannot grant authority."],
-      ["interop.request-replay", "A logical request is not applied twice."],
-      ["interop.application-provider-lifecycle", "A real app provider registers, validates, runs, and unloads."],
-      ["interop.application-event-multicast", "A real app source reaches two independent consumers."]
-    ]
-  },
-  {
-    id: "runtime",
-    number: "03",
-    title: "Runtime",
-    count: 3,
-    summary: "Durable admission, recovery, and worker fencing are observed through the store.",
-    scenarios: [
-      ["runtime.crash-recovery", "A lost outcome reuses the same attempt and invocation."],
-      ["runtime.competing-workers", "A stale worker cannot commit after its lease expires."],
-      ["runtime.application-execution", "A real app catalog produces one exact successful run."]
-    ]
-  }
-];
----
-
-<BaseLayout
-  title="Interoperability testbed"
-  description="Run the same portable black-box scenarios against every mdbase contract, interoperability, and durable runtime implementation."
-  current="testbed"
->
-  <section class="page-hero testbed-hero">
-    <div class="page-hero__inner">
-      <div>
-        <p class="eyebrow"><i></i> Portable testbed 0.1</p>
-        <h1>Make the same promise. Prove the same behavior.</h1>
-      </div>
-      <div class="page-hero__aside">
-        <p>
-          One neutral suite tests TypeScript, Rust, plugins, desktop services,
-          and future implementations through a process boundary. Products keep
-          their own architecture; users get comparable evidence.
-        </p>
-        <div class="button-row">
-          <a class="button button--primary" href="#run-it">Run the testbed</a>
-          <a class="button" href="/testbed/v0.1/scenarios/core.shared-contract-consumers.json">
-            Open a scenario
-          </a>
-        </div>
-      </div>
-    </div>
-  </section>
-
-  <section class="trace-section" aria-labelledby="trace-title">
-    <div class="trace-heading">
-      <div>
-        <p class="eyebrow">The black-box boundary</p>
-        <h2 id="trace-title">The spec asks. Your implementation answers.</h2>
-      </div>
-      <p>
-        Each scenario starts a fresh adapter process. Only stable facts cross
-        the boundary; generated IDs, database keys, and wall-clock timing stay
-        inside.
-      </p>
-    </div>
-    <div class="trace-board" role="img" aria-label="Contract, interop, and runtime scenarios pass through a process adapter and produce canonical transcripts">
-      <div class="trace-board__header">
-        <span>Neutral scenario</span>
-        <span>Process adapter</span>
-        <span>Canonical transcript</span>
-      </div>
-      {
-        rings.map((ring) => (
-          <div class="trace-row">
-            <div class="trace-ring">
-              <span>{ring.number}</span>
-              <strong>{ring.title}</strong>
-            </div>
-            <div class="trace-wire" aria-hidden="true"><i></i><b>run</b><i></i></div>
-            <div class="trace-adapter">
-              <code>describe</code>
-              <code>run</code>
-            </div>
-            <div class="trace-wire" aria-hidden="true"><i></i><b>JSON</b><i></i></div>
-            <div class="trace-pass"><span>PASS</span><strong>{String(ring.count).padStart(2, "0")}</strong></div>
-          </div>
-        ))
-      }
-    </div>
-  </section>
-
-  <section class="content-section">
-    <h2>What the testbed separates</h2>
-    <div class="testbed-principles">
-      <article>
-        <span>Owned by the specification</span>
-        <h3>The question and the oracle</h3>
-        <p>
-          Draft 2020-12 schemas define neutral fixtures, run requests, adapter
-          descriptions, transcripts, and evidence. Every expected transcript
-          lives beside its scenario.
-        </p>
-      </article>
-      <article>
-        <span>Owned by the implementation</span>
-        <h3>The behavior under test</h3>
-        <p>
-          An adapter drives public collection, bridge, provider, runtime, and
-          store boundaries. It reduces observations to stable facts; it does
-          not reimplement the feature.
-        </p>
-      </article>
-      <article>
-        <span>Owned by neither</span>
-        <h3>Authority</h3>
-        <p>
-          Passing proves behavior, not permission. A transcript cannot grant
-          access, register a provider, publish an event, or authorize a side
-          effect.
-        </p>
-      </article>
-    </div>
-  </section>
-
-  <section class="content-section scenario-section">
-    <div class="section-intro">
-      <div>
-        <p class="eyebrow">15 scenarios · 3 rings</p>
-        <h2>The portable inventory</h2>
-      </div>
-      <p>
-        Small scenarios isolate failures. Application scenarios then repeat
-        the critical paths with real product contracts and providers.
-      </p>
-    </div>
-    <div class="ring-inventory">
-      {
-        rings.map((ring) => (
-          <article id={`ring-${ring.id}`} class="ring-card">
-            <header>
-              <span>{ring.number}</span>
-              <div>
-                <h3>{ring.title}</h3>
-                <p>{ring.summary}</p>
-              </div>
-              <strong>{ring.count}</strong>
-            </header>
-            <ul>
-              {
-                ring.scenarios.map(([id, description]) => (
-                  <li>
-                    <a href={`/testbed/v0.1/scenarios/${id}.json`}><code>{id}</code></a>
-                    <span>{description}</span>
-                  </li>
-                ))
-              }
-            </ul>
-          </article>
-        ))
-      }
-    </div>
-  </section>
-
-  <section id="run-it" class="content-section run-section">
-    <div class="section-intro">
-      <div>
-        <p class="eyebrow">Fresh process per scenario</p>
-        <h2>Run it from any language</h2>
-      </div>
-      <p>
-        The runner launches an executable directly—never through a shell—and
-        validates both sides of every exchange before comparing observations.
-      </p>
-    </div>
-    <div class="run-grid">
-      <div>
-        <h3>Install and verify</h3>
-        <CodeBlock code={runCommand} language="sh" label="terminal" />
-      </div>
-      <div>
-        <h3>Implement two commands</h3>
-        <CodeBlock code={protocol} language="text" label="adapter protocol" />
-      </div>
-    </div>
-    <div class="button-row">
-      <a class="button button--primary" href="/testbed/v0.1/README.md">
-        Read the adapter protocol
-      </a>
-      <a class="button" href="/testbed/schemas/v0.1/scenario.schema.json">
-        Scenario JSON Schema
-      </a>
-      <a class="button" href="https://github.com/mdbase-dev/mdbase-spec/tree/main/packages/testbed">
-        Reference implementation
-      </a>
-    </div>
-  </section>
-
-  <section class="content-section">
-    <h2>Evidence is precise—and deliberately limited</h2>
-    <p>
-      A passing run can emit a machine-readable evidence document containing
-      the implementation identity, scenario IDs, profile names, and canonical
-      transcript digests. Attach it to a conformance claim to make the tested
-      behavior reproducible.
-    </p>
-    <div class="callout callout--success">
-      <strong>Supplemental evidence, not a blanket badge</strong>
-      <p>
-        A complete profile claim still runs every normative conformance test
-        for that profile. The testbed adds cross-language behavioral evidence;
-        it does not silently widen the claim.
-      </p>
-    </div>
-  </section>
-</BaseLayout>
-
-<style>
-  .testbed-hero h1 {
-    max-width: 14ch;
-  }
-
-  .trace-section {
-    width: min(100% - 2rem, var(--page));
-    margin-inline: auto;
-    padding-block: clamp(3.5rem, 6vw, 5.5rem);
-    border-bottom: 1px solid var(--line);
-  }
-
-  .trace-heading,
-  .section-intro {
-    display: grid;
-    grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 0.7fr);
-    gap: clamp(2rem, 6vw, 6rem);
-    align-items: end;
-  }
-
-  .trace-heading h2,
-  .section-intro h2 {
-    margin-top: 0.65rem;
-  }
-
-  .trace-heading > p,
-  .section-intro > p {
-    color: var(--ink-soft);
-    font-size: 0.9rem;
-  }
-
-  .trace-board {
-    margin-top: 2.5rem;
-    padding: 0.9rem;
-    background:
-      linear-gradient(var(--line) 1px, transparent 1px),
-      linear-gradient(90deg, var(--line) 1px, transparent 1px),
-      var(--surface);
-    background-size: 1.5rem 1.5rem;
-    border: 1px solid var(--line-strong);
-    border-radius: var(--radius);
-  }
-
-  .trace-board__header,
-  .trace-row {
-    display: grid;
-    grid-template-columns: minmax(8rem, 1fr) minmax(3rem, 0.48fr) minmax(8rem, 0.8fr) minmax(3rem, 0.48fr) minmax(5rem, 0.55fr);
-    align-items: center;
-  }
-
-  .trace-board__header {
-    padding: 0.2rem 0.7rem 0.65rem;
-    color: var(--ink-muted);
-    font: 500 0.58rem/1.3 var(--mono);
-  }
-
-  .trace-board__header span:nth-child(2) {
-    grid-column: 3;
-  }
-
-  .trace-board__header span:nth-child(3) {
-    grid-column: 5;
-    text-align: right;
-  }
-
-  .trace-row {
-    min-height: 5.25rem;
-    padding: 0.7rem;
-    background: color-mix(in oklch, var(--canvas) 94%, transparent);
-    border: 1px solid var(--line);
-  }
-
-  .trace-row + .trace-row {
-    margin-top: 0.5rem;
-  }
-
-  .trace-ring,
-  .trace-pass {
-    display: flex;
-    align-items: center;
-    gap: 0.75rem;
-  }
-
-  .trace-ring span,
-  .ring-card header > span {
-    color: var(--ink-muted);
-    font: 500 0.6rem/1 var(--mono);
-  }
-
-  .trace-ring strong {
-    font-size: 0.9rem;
-  }
-
-  .trace-wire {
-    display: grid;
-    grid-template-columns: 1fr auto 1fr;
-    align-items: center;
-    gap: 0.35rem;
-  }
-
-  .trace-wire i {
-    height: 1px;
-    background: var(--line-strong);
-  }
-
-  .trace-wire b {
-    color: var(--ink-muted);
-    font: 500 0.52rem/1 var(--mono);
-  }
-
-  .trace-adapter {
-    display: flex;
-    padding: 0.55rem 0.65rem;
-    justify-content: space-between;
-    gap: 0.5rem;
-    background: var(--canvas);
-    border: 1px solid var(--line-strong);
-    border-radius: var(--radius);
-  }
-
-  .trace-adapter code {
-    color: var(--ink-soft);
-    font-size: 0.65rem;
-  }
-
-  .trace-pass {
-    justify-content: flex-end;
-  }
-
-  .trace-pass span {
-    padding: 0.28rem 0.42rem;
-    color: var(--ink);
-    background: color-mix(in oklch, var(--surface) 78%, var(--signal));
-    border: 1px solid color-mix(in oklch, var(--line) 55%, var(--signal));
-    border-radius: 2px;
-    font: 500 0.56rem/1 var(--mono);
-  }
-
-  .trace-pass strong {
-    min-width: 1.8rem;
-    color: var(--ink-muted);
-    font: 500 0.72rem/1 var(--mono);
-    text-align: right;
-  }
-
-  .testbed-principles {
-    display: grid;
-    margin-top: 2.5rem;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-    border-top: 1px solid var(--line-strong);
-  }
-
-  .testbed-principles article {
-    padding: 1.25rem 1.25rem 0 0;
-  }
-
-  .testbed-principles article + article {
-    padding-left: 1.25rem;
-    border-left: 1px solid var(--line);
-  }
-
-  .testbed-principles span {
-    color: var(--ink-muted);
-    font: 500 0.58rem/1.3 var(--mono);
-  }
-
-  .testbed-principles h3 {
-    margin-top: 0.55rem;
-  }
-
-  .testbed-principles p {
-    margin-top: 0.65rem;
-    color: var(--ink-soft);
-    font-size: 0.84rem;
-  }
-
-  .ring-inventory {
-    margin-top: 2.5rem;
-    border-top: 1px solid var(--line-strong);
-  }
-
-  .ring-card {
-    padding-block: 1.5rem;
-    border-bottom: 1px solid var(--line);
-  }
-
-  .ring-card header {
-    display: grid;
-    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
-    gap: 1rem;
-  }
-
-  .ring-card header p {
-    max-width: 60ch;
-    margin-top: 0.3rem;
-    color: var(--ink-soft);
-    font-size: 0.82rem;
-  }
-
-  .ring-card header > strong {
-    color: var(--ink-muted);
-    font: 500 1.4rem/1 var(--mono);
-  }
-
-  .ring-card ul {
-    display: grid;
-    padding: 0;
-    margin: 1.1rem 0 0 3.5rem;
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    column-gap: 2rem;
-    list-style: none;
-  }
-
-  .ring-card li {
-    display: grid;
-    max-width: none;
-    padding-block: 0.65rem;
-    grid-template-columns: minmax(14rem, 0.7fr) minmax(0, 1fr);
-    gap: 1rem;
-    border-top: 1px solid var(--line);
-  }
-
-  .ring-card li a {
-    min-width: 0;
-    overflow-wrap: anywhere;
-  }
-
-  .ring-card li code {
-    font-size: 0.67rem;
-  }
-
-  .ring-card li span {
-    color: var(--ink-soft);
-    font-size: 0.76rem;
-  }
-
-  .run-grid {
-    display: grid;
-    margin-top: 2rem;
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    gap: 1rem;
-  }
-
-  .run-grid h3 {
-    font-size: 0.88rem;
-  }
-
-  .run-grid .code-block {
-    height: calc(100% - 1.7rem);
-  }
-
-  .run-section > .button-row {
-    margin-top: 1.25rem;
-  }
-
-  @media (max-width: 60rem) {
-    .trace-heading,
-    .section-intro,
-    .testbed-principles,
-    .run-grid {
-      grid-template-columns: 1fr;
-    }
-
-    .testbed-principles article + article {
-      padding-left: 0;
-      border-top: 1px solid var(--line);
-      border-left: 0;
-    }
-
-    .trace-board__header {
-      display: none;
-    }
-
-    .trace-row {
-      grid-template-columns: minmax(6.5rem, 1fr) 2rem minmax(7rem, 1fr) 2rem minmax(4rem, 0.7fr);
-    }
-
-    .trace-wire b {
-      display: none;
-    }
-
-    .ring-card ul {
-      grid-template-columns: 1fr;
-    }
-  }
-
-  @media (max-width: 40rem) {
-    .trace-board {
-      padding: 0.5rem;
-    }
-
-    .trace-row {
-      grid-template-columns: 1fr auto;
-      gap: 0.75rem;
-    }
-
-    .trace-wire,
-    .trace-adapter {
-      display: none;
-    }
-
-    .trace-pass {
-      grid-column: 2;
-    }
-
-    .ring-card header {
-      grid-template-columns: 2rem minmax(0, 1fr) auto;
-    }
-
-    .ring-card ul {
-      margin-left: 3rem;
-    }
-
-    .ring-card li {
-      grid-template-columns: 1fr;
-      gap: 0.3rem;
-    }
-  }
-</style>
diff --git a/src/styles/home.css b/src/styles/home.css
index c4919de..0472ec7 100644
--- a/src/styles/home.css
+++ b/src/styles/home.css
@@ -81,8 +81,7 @@
   transform: translateY(12px);
 }
 
-.home-body .chapter__status,
-.section-label {
+.home-body .chapter__status {
   margin: 0 0 1rem;
   color: var(--muted);
   font: 500 0.625rem/1.4 var(--mono);
@@ -103,289 +102,17 @@
   margin-top: 1.5rem;
 }
 
-.home-reference {
-  position: relative;
-  z-index: 3;
-  padding: clamp(5rem, 10vw, 9rem) clamp(1.25rem, 6.8vw, 6.5rem);
-  color: var(--ink);
-  background: var(--paper);
-  border-top: 1px solid var(--line);
-}
-
-.home-reference + .home-reference {
-  border-top-color: var(--line);
-}
-
-.home-reference__opening {
-  display: grid;
-  width: min(100%, 78rem);
-  margin-inline: auto;
-  grid-template-columns: minmax(16rem, 0.86fr) minmax(18rem, 0.65fr);
-  column-gap: clamp(2rem, 8vw, 8rem);
-}
-
-.home-reference__opening .section-label {
-  grid-column: 1 / -1;
-}
-
-.home-body .home-reference h2 {
-  max-width: 13ch;
-  font-size: clamp(2.65rem, 6vw, 5.25rem);
-}
-
-.home-reference__opening > p:last-child {
-  max-width: 55ch;
-  padding-top: 0.4rem;
-  color: var(--ink-soft);
-  font-size: clamp(1rem, 1.35vw, 1.125rem);
-  line-height: 1.62;
-}
-
-.home-reference__opening > p strong {
-  color: var(--ink);
-}
-
-.ecosystem-flow,
-.availability-list,
-.route-list,
-.fit-guide__questions,
-.tool-example {
-  width: min(100%, 78rem);
-  margin: clamp(3.5rem, 7vw, 6rem) auto 0;
-}
-
-.ecosystem-flow {
-  padding: 0;
-  list-style: none;
-  border-top: 1px solid var(--line-strong);
-}
-
-.ecosystem-flow li {
-  display: grid;
-  max-width: none;
-  padding: 1.3rem 0;
-  align-items: baseline;
-  grid-template-columns: 3rem minmax(0, 1fr) minmax(10rem, 0.35fr);
-  gap: 1rem;
-  border-bottom: 1px solid var(--line);
-}
-
-.ecosystem-flow li > span,
-.route-list i {
-  color: var(--muted);
-  font: 500 0.625rem/1.4 var(--mono);
-}
-
-.ecosystem-flow li > div {
-  display: grid;
-  align-items: baseline;
-  grid-template-columns: minmax(10rem, 0.38fr) minmax(0, 1fr);
-  gap: 1rem;
-}
-
-.ecosystem-flow strong {
-  font-size: 0.9rem;
-}
-
-.ecosystem-flow p {
-  color: var(--ink-soft);
-  font-size: 0.875rem;
-}
-
-.ecosystem-flow a,
-.orientation__runtime a {
-  color: var(--ink);
-  font-size: 0.78rem;
-  font-weight: 700;
-  text-underline-offset: 0.25rem;
-}
-
-.orientation__runtime {
-  width: min(100%, 78rem);
-  max-width: none;
-  margin: 1.25rem auto 0;
-  color: var(--muted);
-  font-size: 0.78rem;
-}
-
-.working-example {
-  background: var(--paper-soft);
-}
-
-.tool-example {
-  display: grid;
-  border-top: 1px solid var(--line-strong);
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-}
-
-.tool-example > div {
-  padding: 1.2rem 1.25rem 1.25rem 0;
-  border-bottom: 1px solid var(--line);
-}
-
-.tool-example > div + div {
-  padding-right: 1.25rem;
-  padding-left: 1.25rem;
-  border-left: 1px solid var(--line);
-}
-
-.tool-example > div:last-child {
-  padding-right: 0;
-}
-
-.tool-example span {
-  display: block;
-  color: var(--muted);
-  font: 500 0.625rem/1.4 var(--mono);
-}
-
-.tool-example strong {
-  display: block;
-  margin-top: 0.5rem;
-  font-size: 1rem;
-}
-
-.tool-example p {
-  margin-top: 0.45rem;
-  color: var(--ink-soft);
-  font-size: 0.82rem;
-  line-height: 1.55;
-}
-
-.tool-example a {
-  display: inline-block;
-  margin-top: 0.9rem;
-  color: var(--ink);
-  font-size: 0.76rem;
-  font-weight: 700;
-}
-
-.working-example__note {
-  width: min(100%, 78rem);
-  max-width: none;
-  margin: 1.25rem auto 0;
-  color: var(--muted);
-  font-size: 0.78rem;
-}
-
-.availability {
-  background: var(--paper);
-}
-
-.availability-list {
-  border-top: 1px solid var(--line-strong);
-}
-
-.availability-list > div {
-  display: grid;
-  padding: 1.2rem 0;
-  grid-template-columns: minmax(10rem, 0.38fr) minmax(0, 1fr);
-  gap: 1rem;
-  border-bottom: 1px solid var(--line);
-}
-
-.availability-list dt {
-  color: var(--muted);
-  font: 500 0.68rem/1.5 var(--mono);
-}
-
-.availability-list dd {
-  display: grid;
-  grid-template-columns: minmax(8rem, 0.3fr) minmax(0, 1fr);
-  gap: 1rem;
-  color: var(--ink-soft);
-  font-size: 0.875rem;
-}
-
-.availability-list dd strong {
-  color: var(--ink);
-}
-
-.route-list {
-  border-top: 1px solid var(--line-strong);
-}
-
-.route-list a {
-  display: grid;
-  max-width: none;
-  padding: clamp(1.2rem, 2.5vw, 2rem) 0;
-  align-items: baseline;
-  grid-template-columns: minmax(10rem, 0.38fr) minmax(0, 1fr) 2rem;
-  gap: 1rem;
-  color: var(--ink);
-  border-bottom: 1px solid var(--line);
-  text-decoration: none;
-}
-
-.route-list a:hover span,
-.route-list a:hover strong {
-  color: var(--accent);
-}
-
-.route-list span {
-  color: var(--muted);
-  font: 500 0.68rem/1.5 var(--mono);
-}
-
-.route-list strong {
-  max-width: 46rem;
-  font-size: clamp(1rem, 2vw, 1.35rem);
-  line-height: 1.35;
-}
-
-.route-list i {
-  font-style: normal;
-  text-align: right;
-}
-
-.fit-guide {
-  background: var(--paper-soft);
-}
-
-.fit-guide__questions {
-  border-top: 1px solid var(--line-strong);
-}
-
-.fit-guide details {
-  border-bottom: 1px solid var(--line);
-}
-
-.fit-guide summary {
-  position: relative;
-  padding: 1.2rem 3rem 1.2rem 0;
-  color: var(--ink);
-  font-size: clamp(0.95rem, 1.5vw, 1.1rem);
-  font-weight: 700;
-  list-style: none;
-  cursor: pointer;
-}
-
-.fit-guide summary::-webkit-details-marker {
-  display: none;
-}
-
-.fit-guide summary::after {
-  position: absolute;
-  top: 1.1rem;
-  right: 0;
-  color: var(--muted);
-  content: "+";
-  font: 400 1.15rem/1 var(--mono);
-}
-
-.fit-guide details[open] summary::after {
-  content: "−";
-}
+@media (max-width: 820px) {
+  .home-body .chapter {
+    min-height: 128vh;
+    padding-bottom: 12vh;
+  }
 
-.fit-guide details p {
-  max-width: 65ch;
-  padding: 0 0 1.35rem;
-  color: var(--ink-soft);
-  font-size: 0.9rem;
-  line-height: 1.65;
-}
+  .home-body .chapter:first-child,
+  .home-body .chapter:last-child {
+    min-height: 136vh;
+  }
 
-@media (max-width: 820px) {
   .home-body .chapter__inner,
   .home-body .chapter.is-active .chapter__inner {
     position: relative;
@@ -399,7 +126,7 @@
     position: absolute;
     z-index: -1;
     top: -20vh;
-    bottom: -16vh;
+    bottom: -12vh;
     left: 50%;
     width: 100vw;
     content: "";
@@ -432,60 +159,10 @@
     line-height: 1.72;
   }
 
-  .home-body .facts span {
-    font-size: 0.6875rem;
-  }
-
-  .home-body .facts strong,
   .home-body .steps strong {
     font-size: 0.8125rem;
     line-height: 1.5;
   }
-
-  .home-reference__opening {
-    grid-template-columns: 1fr;
-    gap: 1.5rem;
-  }
-
-  .home-reference__opening .section-label {
-    grid-column: auto;
-    margin-bottom: 0;
-  }
-
-  .ecosystem-flow li {
-    grid-template-columns: 2rem minmax(0, 1fr);
-  }
-
-  .ecosystem-flow li > div {
-    grid-template-columns: 1fr;
-    gap: 0.35rem;
-  }
-
-  .ecosystem-flow li > a {
-    grid-column: 2;
-  }
-
-  .availability-list > div,
-  .availability-list dd,
-  .route-list a {
-    grid-template-columns: 1fr;
-    gap: 0.35rem;
-  }
-
-  .route-list i {
-    display: none;
-  }
-
-  .tool-example {
-    grid-template-columns: 1fr;
-  }
-
-  .tool-example > div,
-  .tool-example > div + div,
-  .tool-example > div:last-child {
-    padding: 1.15rem 0;
-    border-left: 0;
-  }
 }
 
 @media (max-width: 480px) {

From 7ab168e2cac3f0b3020c6bdbc8c6838556fb9c09 Mon Sep 17 00:00:00 2001
From: callumalpass <callumalpass@gmail.com>
Date: Sun, 2 Aug 2026 09:23:34 +1000
Subject: [PATCH 4/5] Improve product positioning and beta onboarding

---
 DESIGN.md                            |   4 +-
 public/mdbase-introduction.css       |  11 --
 public/mdbase-murmuration.js         |   7 +-
 public/mdbase-shell.css              |  68 ++++++----
 scripts/sync-sources.mjs             |  39 +++++-
 src/components/DocsLayout.astro      |  13 +-
 src/components/SiteFooter.astro      |  33 +++--
 src/components/SiteHeader.astro      |  14 +-
 src/layouts/BaseLayout.astro         |  21 ++-
 src/layouts/HomeLayout.astro         |   6 +-
 src/pages/beta/index.astro           | 189 +++++++++++++++++++++++----
 src/pages/connect/index.astro        |  10 +-
 src/pages/index.astro                |  53 ++++++--
 src/pages/sdk/index.astro            |  28 +++-
 src/pages/sdk/quickstart/index.astro |   6 +-
 src/styles/global.css                |  25 +++-
 src/styles/home.css                  | 109 ++++++++++++++-
 src/styles/shell.css                 |  68 ++++++----
 18 files changed, 530 insertions(+), 174 deletions(-)

diff --git a/DESIGN.md b/DESIGN.md
index 39e8d18..f98fab9 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -59,7 +59,9 @@ mobile text region begins.
 
 Only the homepage particle field moves. Its transformations explain the current
 chapter. Reduced-motion preferences place the particles directly into each
-formation. Interior pages do not use decorative animation.
+formation. Coarse-pointer screens up to 820px use the same static formations to
+reduce battery use during the mobile reading journey. Interior pages do not use
+decorative animation.
 
 ## Language
 
diff --git a/public/mdbase-introduction.css b/public/mdbase-introduction.css
index 892706a..d26c0c9 100644
--- a/public/mdbase-introduction.css
+++ b/public/mdbase-introduction.css
@@ -113,13 +113,6 @@
       text-underline-offset: 5px;
     }
 
-    .scene-count {
-      min-width: 52px;
-      color: var(--muted);
-      font: 520 10px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-      text-align: right;
-    }
-
     .scroll-progress {
       position: fixed;
       z-index: 6;
@@ -440,10 +433,6 @@
         font-size: 11px;
       }
 
-      .scene-count {
-        min-width: auto;
-      }
-
       .chapter {
         padding-right: 22px;
         padding-left: 22px;
diff --git a/public/mdbase-murmuration.js b/public/mdbase-murmuration.js
index 0d41d12..ca4e6f5 100644
--- a/public/mdbase-murmuration.js
+++ b/public/mdbase-murmuration.js
@@ -3,8 +3,9 @@
       const canvas = document.querySelector("#diagram");
       const context = canvas.getContext("2d", { alpha: true });
       const chapters = [...document.querySelectorAll(".chapter")];
-      const sceneCount = document.querySelector("#scene-count");
-      const reduceMotion = matchMedia("(prefers-reduced-motion: reduce)").matches;
+      const reduceMotion =
+        matchMedia("(prefers-reduced-motion: reduce)").matches
+        || matchMedia("(max-width: 820px) and (pointer: coarse)").matches;
       const particleCount = 361;
       const cellSize = 104;
       const particles = [];
@@ -1058,8 +1059,6 @@
         chapters.forEach((chapter, chapterIndex) => {
           chapter.classList.toggle("is-active", chapterIndex === index);
         });
-        sceneCount.textContent =
-          `${String(index + 1).padStart(2, "0")} / ${String(chapters.length).padStart(2, "0")}`;
         buildScene(scene);
       }
 
diff --git a/public/mdbase-shell.css b/public/mdbase-shell.css
index e096745..9ee4e0b 100644
--- a/public/mdbase-shell.css
+++ b/public/mdbase-shell.css
@@ -133,12 +133,6 @@
   gap: 0.35rem;
 }
 
-.scene-count {
-  color: var(--color-text-muted);
-  font: 500 0.625rem/1 var(--mono);
-  white-space: nowrap;
-}
-
 .theme-menu {
   position: relative;
   flex: 0 0 auto;
@@ -146,14 +140,14 @@
 
 .theme-menu > summary {
   display: grid;
-  width: 2rem;
-  height: 2rem;
+  width: 2.75rem;
+  height: 2.75rem;
   padding: 0;
   place-items: center;
   color: var(--color-text-faint);
   background: transparent;
   border: 0;
-  border-radius: 3px;
+  border-radius: var(--radius);
   list-style: none;
   cursor: pointer;
 }
@@ -199,20 +193,20 @@
   padding: 0.3rem;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong);
-  border-radius: 3px;
+  border-radius: var(--radius);
 }
 
 .theme-menu__options button {
   display: grid;
   width: 100%;
-  min-height: 1.9rem;
+  min-height: 2.75rem;
   padding: 0 0.5rem;
   align-items: center;
   grid-template-columns: 1fr auto;
   color: var(--color-text-soft);
   background: transparent;
   border: 0;
-  border-radius: 2px;
+  border-radius: var(--radius);
   font: 400 0.66rem/1 var(--mono);
   text-align: left;
   cursor: pointer;
@@ -251,7 +245,10 @@
 }
 
 .mobile-nav summary {
-  padding: 0.35rem 0;
+  display: flex;
+  min-height: 2.75rem;
+  padding: 0.35rem 0.25rem;
+  align-items: center;
   color: var(--color-text-soft);
   font-size: 0.78rem;
   list-style: none;
@@ -300,11 +297,11 @@
 .site-footer__inner {
   display: grid;
   width: min(100% - 2rem, var(--site-width));
-  min-height: 5.5rem;
+  min-height: 8rem;
   margin-inline: auto;
-  padding-block: 1.5rem;
-  align-items: center;
-  grid-template-columns: 1fr auto;
+  padding-block: 2rem;
+  align-items: start;
+  grid-template-columns: minmax(14rem, 0.72fr) minmax(0, 1.28fr);
   gap: 2rem;
 }
 
@@ -319,11 +316,22 @@
   font-size: 0.78rem;
 }
 
-.site-footer nav {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  gap: 0.5rem 1.1rem;
+.site-footer .site-footer__nav {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 1.5rem;
+}
+
+.site-footer__nav > div {
+  display: grid;
+  align-content: start;
+  gap: 0.5rem;
+}
+
+.site-footer__nav > div > strong {
+  margin-bottom: 0.15rem;
+  color: var(--color-text-muted);
+  font-size: 0.625rem;
 }
 
 .site-footer nav a {
@@ -358,16 +366,18 @@
     width: min(100% - 1.25rem, var(--site-width));
   }
 
-  .scene-count {
-    display: none;
-  }
-
   .site-footer__inner {
     grid-template-columns: 1fr;
-    gap: 1rem;
+    gap: 1.5rem;
+  }
+
+  .site-footer .site-footer__nav {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
+}
 
-  .site-footer nav {
-    justify-content: flex-start;
+@media (max-width: 30rem) {
+  .site-footer .site-footer__nav {
+    grid-template-columns: 1fr;
   }
 }
diff --git a/scripts/sync-sources.mjs b/scripts/sync-sources.mjs
index d73b3ef..7d39b67 100644
--- a/scripts/sync-sources.mjs
+++ b/scripts/sync-sources.mjs
@@ -55,11 +55,15 @@ cpSync(runtimeSchemaSource, runtimeSchemaDestination, { recursive: true, force:
 const introductionSource = join(connectDir, "docs", "mdbase-configurations-v2.html");
 required(introductionSource, "Connect introduction prototype");
 const introduction = readFileSync(introductionSource, "utf8");
-const introductionStyles = extract(introduction, /<style>([\s\S]*?)<\/style>/, "prototype styles");
-const introductionScript = extract(
-  introduction,
-  /<script>([\s\S]*?)<\/script>\s*<\/body>/,
-  "prototype murmuration"
+const introductionStyles = removeSceneCounterStyles(
+  extract(introduction, /<style>([\s\S]*?)<\/style>/, "prototype styles")
+);
+const introductionScript = removeSceneCounterScript(
+  extract(
+    introduction,
+    /<script>([\s\S]*?)<\/script>\s*<\/body>/,
+    "prototype murmuration"
+  )
 );
 const themedIntroductionScript = addThemeAwareCanvasPalette(introductionScript);
 writeFileSync(
@@ -196,6 +200,16 @@ function extract(source, pattern, label) {
   return match[1];
 }
 
+function removeSceneCounterStyles(source) {
+  return source.replace(/\n\s*\.scene-count\s*\{[^}]*\}/g, "");
+}
+
+function removeSceneCounterScript(source) {
+  return source
+    .replace(/^\s*const sceneCount = document\.querySelector\("#scene-count"\);\n/m, "")
+    .replace(/\n\s*sceneCount\.textContent =\s*\n\s*`[^`]+`;/, "");
+}
+
 function addThemeAwareCanvasPalette(source) {
   const palettePattern = /      const palette = \{[\s\S]*?      \};/;
   if (!palettePattern.test(source)) {
@@ -388,11 +402,22 @@ function addThemeAwareCanvasPalette(source) {
 
       function draw(now)`
   );
+  const motionPreference =
+    '      const reduceMotion = matchMedia("(prefers-reduced-motion: reduce)").matches;';
+  if (!withParticles.includes(motionPreference)) {
+    throw new Error("Could not find the prototype motion preference");
+  }
+  const withMobileMotion = withParticles.replace(
+    motionPreference,
+    `      const reduceMotion =
+        matchMedia("(prefers-reduced-motion: reduce)").matches
+        || matchMedia("(max-width: 820px) and (pointer: coarse)").matches;`
+  );
   const initialization = "      resize();\n      updateScrollState();";
-  if (!withParticles.includes(initialization)) {
+  if (!withMobileMotion.includes(initialization)) {
     throw new Error("Could not find the prototype initialization");
   }
-  const withInitialization = withParticles.replace(
+  const withInitialization = withMobileMotion.replace(
     initialization,
     "      syncPalette();\n      resize();\n      updateScrollState();"
   );
diff --git a/src/components/DocsLayout.astro b/src/components/DocsLayout.astro
index 86e5e97..fb555f0 100644
--- a/src/components/DocsLayout.astro
+++ b/src/components/DocsLayout.astro
@@ -13,7 +13,7 @@ const docGroups = [
   {
     label: "Start",
     docs: [
-      { href: "/sdk/quickstart/", label: "Try the SDK locally", key: "quickstart" },
+      { href: "/sdk/quickstart/", label: "Run the source-built sandbox", key: "quickstart" },
       { href: "/sdk/connect-quickstart/", label: "Connect a browser app", key: "connect-quickstart" },
       { href: "/sdk/", label: "SDK overview", key: "overview" }
     ]
@@ -45,7 +45,7 @@ const docGroups = [
 <BaseLayout title={title} description={description} current="sdk">
   <div class="docs-shell">
     <aside class="docs-nav">
-      <details open>
+      <details open data-docs-nav>
         <summary>Connect SDK</summary>
         <nav aria-label="SDK documentation">
           {
@@ -93,4 +93,13 @@ const docGroups = [
       )
     }
   </div>
+  <script is:inline>
+    const docsNavigation = document.querySelector("[data-docs-nav]");
+    if (
+      docsNavigation instanceof HTMLDetailsElement
+      && window.matchMedia("(max-width: 60rem)").matches
+    ) {
+      docsNavigation.open = false;
+    }
+  </script>
 </BaseLayout>
diff --git a/src/components/SiteFooter.astro b/src/components/SiteFooter.astro
index 6c2f981..f426f5f 100644
--- a/src/components/SiteFooter.astro
+++ b/src/components/SiteFooter.astro
@@ -4,18 +4,27 @@
       <strong>mdbase</strong>
       <p>Markdown collections with types, queries, and explicit app permissions.</p>
     </div>
-    <nav aria-label="Footer navigation">
-      <a href="/#intro">Start here</a>
-      <a href="/beta/">Beta access</a>
-      <a href="/connect/">Connect</a>
-      <a href="/sdk/">SDK docs</a>
-      <a href="/runtime/">Runtime</a>
-      <a href="/contracts/">Contracts</a>
-      <a href="/spec/">Specification</a>
-      <a href="/security/">Security</a>
-      <a href="/privacy/">Privacy</a>
-      <a href="/terms/">Terms</a>
-      <a href="https://github.com/mdbase-dev">GitHub</a>
+    <nav aria-label="Footer navigation" class="site-footer__nav">
+      <div>
+        <strong>Product</strong>
+        <a href="/">Overview</a>
+        <a href="/connect/">Connect</a>
+        <a href="/beta/">Connect beta access</a>
+        <a href="/security/">Security</a>
+      </div>
+      <div>
+        <strong>Developers</strong>
+        <a href="/sdk/">SDK documentation</a>
+        <a href="/runtime/">Runtime</a>
+        <a href="/contracts/">Contracts</a>
+        <a href="/spec/">Specification</a>
+      </div>
+      <div>
+        <strong>Project</strong>
+        <a href="https://github.com/mdbase-dev">GitHub</a>
+        <a href="/privacy/">Privacy</a>
+        <a href="/terms/">Terms</a>
+      </div>
     </nav>
   </div>
 </footer>
diff --git a/src/components/SiteHeader.astro b/src/components/SiteHeader.astro
index 5f36b47..ee3a409 100644
--- a/src/components/SiteHeader.astro
+++ b/src/components/SiteHeader.astro
@@ -3,15 +3,14 @@ import BrandMark from "./BrandMark.astro";
 
 interface Props {
   current?: "home" | "connect" | "sdk" | "runtime" | "spec";
-  showSceneCount?: boolean;
 }
 
-const { current, showSceneCount = false } = Astro.props;
+const { current } = Astro.props;
 const links = [
-  { href: "/", label: "Learn", key: "home" },
+  { href: "/", label: "Overview", key: "home" },
   { href: "/connect/", label: "Connect", key: "connect" },
-  { href: "/sdk/quickstart/", label: "Build", key: "sdk" },
-  { href: "/spec/", label: "Spec", key: "spec" }
+  { href: "/sdk/", label: "Developers", key: "sdk" },
+  { href: "/spec/", label: "Specification", key: "spec" }
 ] as const;
 ---
 
@@ -22,11 +21,6 @@ const links = [
         <BrandMark compact />
         <span>mdbase</span>
       </a>
-      {
-        showSceneCount && (
-          <span id="scene-count" class="scene-count" aria-live="polite">01 / 06</span>
-        )
-      }
     </div>
     <div class="header-actions">
       <nav class="desktop-nav" aria-label="Primary navigation">
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 89bb313..b5795de 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -25,7 +25,7 @@ const fullTitle = title === "mdbase" ? title : `${title} | mdbase`;
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
     <title>{fullTitle}</title>
     <meta name="description" content={description} />
     <link rel="canonical" href={canonical} />
@@ -45,22 +45,33 @@ const fullTitle = title === "mdbase" ? title : `${title} | mdbase`;
   <body class="site-body">
     <a class="skip-link" href="#main">Skip to content</a>
     <SiteHeader current={current} />
-    <main id="main">
+    <main id="main" tabindex="-1">
       <slot />
     </main>
     <SiteFooter />
     <ThemeControlScript />
+    <p class="sr-only" id="copy-status" role="status" aria-live="polite"></p>
     <script is:inline>
       document.querySelectorAll("[data-copy-code]").forEach((button) => {
         button.addEventListener("click", async () => {
           const wrapper = button.closest(".code-block");
           const code = wrapper?.querySelector("code")?.textContent ?? "";
-          await navigator.clipboard.writeText(code);
           const previous = button.textContent;
-          button.textContent = "Copied";
+          const status = document.querySelector("#copy-status");
+          try {
+            await navigator.clipboard.writeText(code);
+            button.textContent = "Copied";
+            if (status) status.textContent = "Code copied to the clipboard.";
+          } catch {
+            button.textContent = "Copy failed";
+            if (status) {
+              status.textContent =
+                "Code could not be copied. Select the code and copy it manually.";
+            }
+          }
           window.setTimeout(() => {
             button.textContent = previous;
-          }, 1400);
+          }, 1800);
         });
       });
     </script>
diff --git a/src/layouts/HomeLayout.astro b/src/layouts/HomeLayout.astro
index a7cad5c..5f1ced8 100644
--- a/src/layouts/HomeLayout.astro
+++ b/src/layouts/HomeLayout.astro
@@ -22,7 +22,7 @@ const canonical = new URL(Astro.url.pathname, Astro.site);
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
     <title>{title}</title>
     <meta name="description" content={description} />
     <link rel="canonical" href={canonical} />
@@ -40,8 +40,8 @@ const canonical = new URL(Astro.url.pathname, Astro.site);
     <script is:inline src="/theme-bootstrap.js"></script>
   </head>
   <body class="home-body">
-    <a class="home-skip-link" href="#intro">Skip to introduction</a>
-    <SiteHeader current="home" showSceneCount />
+    <a class="home-skip-link" href="#main">Skip to content</a>
+    <SiteHeader current="home" />
     <slot />
     <SiteFooter />
     <ThemeControlScript />
diff --git a/src/pages/beta/index.astro b/src/pages/beta/index.astro
index 8f40edb..90f8255 100644
--- a/src/pages/beta/index.astro
+++ b/src/pages/beta/index.astro
@@ -10,16 +10,18 @@ const betaAccessEndpoint = new URL(
 ---
 
 <BaseLayout
-  title="Request beta access"
+  title="Request Connect beta access"
   description="Request access to the mdbase Connect private beta."
+  current="connect"
 >
   <section class="beta-opening">
     <header class="beta-opening__copy">
       <p class="eyebrow">Connect private beta</p>
-      <h1>Request beta access.</h1>
+      <h1>Request Connect beta access.</h1>
       <p>
-        mdbase Connect is opening gradually while the remaining release checks
-        are completed.
+        The managed Connect service is opening in small batches while release
+        checks continue. The open mdbase specification and local tools do not
+        require an invitation.
       </p>
     </header>
 
@@ -30,9 +32,11 @@ const betaAccessEndpoint = new URL(
         data-endpoint={betaAccessEndpoint}
         action={betaAccessEndpoint}
         method="post"
-        novalidate
       >
         <label for="beta-email">Email address</label>
+        <p class="beta-form__help" id="beta-email-help">
+          Use the address where you want to receive an invitation.
+        </p>
         <div class="beta-form__entry">
           <input
             id="beta-email"
@@ -43,8 +47,9 @@ const betaAccessEndpoint = new URL(
             maxlength="320"
             required
             spellcheck="false"
+            aria-describedby="beta-email-help beta-status"
           />
-          <button type="submit">Request access</button>
+          <button type="submit">Request Connect access</button>
         </div>
         <div class="beta-honeypot" aria-hidden="true">
           <label for="beta-website">Website</label>
@@ -56,35 +61,110 @@ const betaAccessEndpoint = new URL(
             tabindex="-1"
           />
         </div>
-        <p class="beta-form__status" data-beta-status role="status" aria-live="polite"></p>
+        <p
+          class="beta-form__status"
+          id="beta-status"
+          data-beta-status
+          role="status"
+          aria-live="polite"
+        ></p>
+        <noscript>
+          <p class="beta-form__noscript">
+            This form still submits without JavaScript. Connect will show a
+            plain confirmation response after it receives the request.
+          </p>
+        </noscript>
       </form>
       <p class="beta-intake__privacy">
         We use this address to manage beta access and contact you about the
         beta. Requesting access does not guarantee immediate availability.
-        <a href="/privacy/">Privacy</a>
+        {" "}<a href="/privacy/">Privacy</a>
       </p>
     </div>
   </section>
 
-  <section class="beta-next">
-    <p class="eyebrow">After your request</p>
+  <section class="beta-details" aria-labelledby="beta-includes">
+    <h2 id="beta-includes">What beta access includes.</h2>
+    <dl class="beta-facts">
+      <div>
+        <dt>Managed Connect</dt>
+        <dd>
+          Create an account, pair a supported desktop build, connect local
+          folders, and create hosted collections.
+        </dd>
+      </div>
+      <div>
+        <dt>Approved applications</dt>
+        <dd>
+          Connect compatible web or native apps and MCP clients to one chosen
+          collection with explicit operations.
+        </dd>
+      </div>
+      <div>
+        <dt>Private-beta timing</dt>
+        <dd>
+          Invitations are sent in small batches. There is no published wait
+          time, and a request does not guarantee immediate availability.
+        </dd>
+      </div>
+    </dl>
+  </section>
+
+  <section class="beta-next" aria-labelledby="after-request">
     <div>
-      <h2>Invitations are sent in small batches.</h2>
+      <h2 id="after-request">After your request.</h2>
       <p>
         If access is available, you will receive a one-time signup link at the
         address you submitted. Connect remains pre-release software, so keep
         independent backups of important collections.
       </p>
     </div>
+    <div>
+      <h2>Use mdbase while you wait.</h2>
+      <p>
+        The specification and local developer path are already open. You can
+        inspect the collection model or run the SDK sandbox without an account.
+      </p>
+      <div class="button-row">
+        <a class="button button--primary" href="/spec/">Read the specification</a>
+        <a class="button" href="/sdk/quickstart/">Try the beta SDK from source</a>
+        <a class="button" href="/connect/">Understand Connect</a>
+      </div>
+    </div>
   </section>
 
   <script>
     const form = document.querySelector("[data-beta-form]");
     if (form instanceof HTMLFormElement) {
+      form.noValidate = true;
       const email = form.elements.namedItem("email");
       const website = form.elements.namedItem("website");
       const button = form.querySelector("button[type='submit']");
       const status = form.querySelector("[data-beta-status]");
+      const submittedKey = "mdbase-connect-beta-requested";
+
+      const showSubmitted = () => {
+        if (
+          !(email instanceof HTMLInputElement)
+          || !(button instanceof HTMLButtonElement)
+          || !(status instanceof HTMLElement)
+        ) return;
+        email.disabled = true;
+        button.disabled = true;
+        button.removeAttribute("aria-busy");
+        button.textContent = "Request received";
+        status.dataset.state = "success";
+        status.textContent =
+          "Request received. We’ll email you when Connect beta access is available.";
+      };
+
+      try {
+        if (window.sessionStorage.getItem(submittedKey) === "true") {
+          showSubmitted();
+        }
+      } catch {
+        // Submission still works when browser storage is unavailable.
+      }
 
       form.addEventListener("submit", async (event) => {
         event.preventDefault();
@@ -123,24 +203,37 @@ const betaAccessEndpoint = new URL(
           });
           if (!response.ok) {
             if (response.status === 429) {
-              throw new Error("rate_limited");
+              const retryAfter = Number.parseInt(
+                response.headers.get("retry-after") ?? "",
+                10
+              );
+              const retryLabel = Number.isFinite(retryAfter)
+                ? retryAfter >= 3600
+                  ? `${Math.ceil(retryAfter / 3600)} hour${retryAfter > 3600 ? "s" : ""}`
+                  : `${Math.max(1, Math.ceil(retryAfter / 60))} minute${retryAfter > 60 ? "s" : ""}`
+                : null;
+              throw new Error(
+                retryLabel ? `rate_limited:${retryLabel}` : "rate_limited"
+              );
             }
             throw new Error("request_failed");
           }
-          email.disabled = true;
-          button.removeAttribute("aria-busy");
-          status.dataset.state = "success";
-          status.textContent =
-            "Request received. We’ll email you when beta access is available.";
-          button.textContent = "Request received";
+          try {
+            window.sessionStorage.setItem(submittedKey, "true");
+          } catch {
+            // The confirmation remains visible for this page view.
+          }
+          showSubmitted();
         } catch (error) {
           button.disabled = false;
           button.removeAttribute("aria-busy");
-          button.textContent = "Request access";
+          button.textContent = "Request Connect access";
           status.dataset.state = "error";
-          status.textContent = error instanceof Error && error.message === "rate_limited"
-            ? "Too many requests have been sent. Please try again later."
-            : "We couldn’t send your request. Please try again.";
+          status.textContent = error instanceof Error && error.message.startsWith("rate_limited")
+            ? error.message.includes(":")
+              ? `Too many requests have been sent. Try again in about ${error.message.split(":")[1]}.`
+              : "Too many requests have been sent. Please try again later."
+            : "We couldn’t send your request. Check your connection and try again; your address is still here.";
         }
       });
     }
@@ -163,7 +256,7 @@ const betaAccessEndpoint = new URL(
     max-width: 11ch;
     margin-top: 1rem;
     font-size: clamp(3rem, 6vw, 5.75rem);
-    letter-spacing: -0.055em;
+    letter-spacing: -0.035em;
   }
 
   .beta-opening__copy > p:last-child {
@@ -191,6 +284,14 @@ const betaAccessEndpoint = new URL(
     grid-template-columns: minmax(0, 1fr) auto;
   }
 
+  .beta-form__help,
+  .beta-form__noscript {
+    margin-top: 0.35rem;
+    color: var(--ink-muted);
+    font-size: 0.75rem;
+    line-height: 1.5;
+  }
+
   .beta-form input {
     width: 100%;
     min-height: 2.75rem;
@@ -267,27 +368,57 @@ const betaAccessEndpoint = new URL(
     overflow: hidden;
   }
 
+  .beta-details,
   .beta-next {
     display: grid;
     width: min(100% - 2rem, var(--page));
     margin-inline: auto;
     padding-block: clamp(3rem, 6vw, 5rem);
     border-top: 1px solid var(--line);
-    grid-template-columns: minmax(12rem, 0.42fr) minmax(0, 1fr);
+    grid-template-columns: minmax(14rem, 0.48fr) minmax(0, 1fr);
     gap: clamp(2rem, 7vw, 7rem);
   }
 
+  .beta-details h2,
   .beta-next h2 {
     max-width: 18ch;
     font-size: clamp(1.6rem, 3vw, 2.5rem);
   }
 
-  .beta-next div p {
+  .beta-next > div > p {
     max-width: 52ch;
     margin-top: 1rem;
     color: var(--ink-soft);
   }
 
+  .beta-facts {
+    border-top: 1px solid var(--line-strong);
+  }
+
+  .beta-facts > div {
+    display: grid;
+    padding-block: 1rem;
+    border-bottom: 1px solid var(--line);
+    grid-template-columns: minmax(9rem, 0.42fr) minmax(0, 1fr);
+    gap: 1.5rem;
+  }
+
+  .beta-facts dt {
+    color: var(--ink);
+    font-size: 0.82rem;
+    font-weight: 700;
+  }
+
+  .beta-facts dd {
+    margin: 0;
+    color: var(--ink-soft);
+    font-size: 0.88rem;
+  }
+
+  .beta-next .button-row {
+    margin-top: 1.25rem;
+  }
+
   @media (max-width: 48rem) {
     .beta-opening {
       min-height: 0;
@@ -300,6 +431,7 @@ const betaAccessEndpoint = new URL(
       font-size: clamp(3rem, 14vw, 4.6rem);
     }
 
+    .beta-details,
     .beta-next {
       grid-template-columns: 1fr;
       gap: 1rem;
@@ -319,7 +451,12 @@ const betaAccessEndpoint = new URL(
     }
 
     .beta-form button {
-      justify-self: start;
+      width: 100%;
+    }
+
+    .beta-facts > div {
+      grid-template-columns: 1fr;
+      gap: 0.3rem;
     }
   }
 </style>
diff --git a/src/pages/connect/index.astro b/src/pages/connect/index.astro
index 4100d14..9227a42 100644
--- a/src/pages/connect/index.astro
+++ b/src/pages/connect/index.astro
@@ -234,7 +234,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     max-width: 11ch;
     margin-top: 1rem;
     font-size: clamp(3rem, 5.8vw, 5.5rem);
-    letter-spacing: -0.055em;
+    letter-spacing: -0.035em;
   }
 
   .connect-opening__lead {
@@ -301,7 +301,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     color: var(--ink-soft);
     background: var(--surface);
     border: 1px solid var(--line);
-    border-radius: 2px;
+    border-radius: var(--radius);
     font: 500 0.62rem/1.2 var(--mono);
   }
 
@@ -324,7 +324,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     padding: 0.65rem 0.75rem;
     background: var(--surface);
     border: 1px solid var(--line);
-    border-radius: 3px;
+    border-radius: var(--radius);
   }
 
   .connect-request__collection > span {
@@ -363,7 +363,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     place-items: center;
     color: var(--canvas);
     border: 1px solid var(--line-strong);
-    border-radius: 2px;
+    border-radius: var(--radius);
     font-size: 0.68rem;
     line-height: 1;
   }
@@ -400,7 +400,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     color: var(--ink-soft);
     background: var(--canvas);
     border: 1px solid var(--line);
-    border-radius: 3px;
+    border-radius: var(--radius);
     font-size: 0.7rem;
     font-weight: 700;
   }
diff --git a/src/pages/index.astro b/src/pages/index.astro
index d6dc09b..4c63062 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -10,18 +10,36 @@ import HomeLayout from "../layouts/HomeLayout.astro";
 
   <canvas id="diagram" aria-hidden="true"></canvas>
 
-  <main>
+  <main id="main" tabindex="-1">
     <section id="intro" class="chapter is-active" data-scene="intro">
       <div class="chapter__inner">
-        <p class="chapter__status">mdbase v0.3 · Connect private beta</p>
+        <p class="chapter__status">mdbase specification v0.3 · open source</p>
         <h1>Use the same Markdown files in different apps.</h1>
         <p class="chapter__lead">
           An mdbase is a folder of ordinary Markdown files that more than one
           app can understand. You can open the files yourself, keep them where
           you choose, and decide which apps may use them.
         </p>
+        <dl class="product-map" aria-label="The parts of mdbase">
+          <div>
+            <dt><a href="/spec/">Specification</a></dt>
+            <dd>Open rules for typed, queryable Markdown collections</dd>
+          </div>
+          <div>
+            <dt><a href="/spec/#section-16">Libraries and CLI</a></dt>
+            <dd>Open tools that work directly with local collections</dd>
+          </div>
+          <div data-product="connect">
+            <dt><a href="/connect/">Connect</a></dt>
+            <dd id="connect-summary">App permissions, routing, and optional managed hosting</dd>
+          </div>
+          <div>
+            <dt><a href="/runtime/">Runtime</a></dt>
+            <dd>Optional durable workflows, timers, and recovery</dd>
+          </div>
+        </dl>
         <div class="chapter__actions chapter__actions--intro">
-          <a class="button" href="/beta/">Request beta access</a>
+          <a class="button" href="/beta/" aria-describedby="connect-summary">Request Connect beta access</a>
           <a class="text-link" href="#example">See how it works</a>
         </div>
       </div>
@@ -65,7 +83,8 @@ The new site should make mdbase
 easier to understand.</code></pre>
         <p class="chapter__body">
           The type definition stored beside the records explains what those
-          fields mean, so different apps can use them consistently.
+          fields mean. Queries, links, validation, and safe updates follow the
+          same open specification in every conforming tool.
         </p>
       </div>
     </section>
@@ -78,8 +97,9 @@ easier to understand.</code></pre>
           a hosted mdbase, mdbase keeps the main copy available online.
         </p>
         <p class="chapter__body">
-          The records stay Markdown in both places, and you choose which apps
-          may connect.
+          The open specification and local tools need no account. Connect is
+          the optional service for approving apps, reaching a local collection
+          remotely, or keeping the authoritative copy online.
         </p>
       </div>
     </section>
@@ -91,11 +111,17 @@ easier to understand.</code></pre>
           An app asks for one collection and a specific set of actions. You
           review the request before it can read or change anything.
         </p>
-        <ol class="steps" aria-label="How an app receives access">
-          <li><span>1</span><strong>See which app is asking</strong></li>
-          <li><span>2</span><strong>Choose the collection it may use</strong></li>
-          <li><span>3</span><strong>Approve only the actions you want</strong></li>
-        </ol>
+        <dl class="grant-summary" aria-label="Example Connect access request">
+          <div><dt>App</dt><dd>Project app</dd></div>
+          <div><dt>Collection</dt><dd>Projects · on this computer</dd></div>
+          <div><dt>Allow</dt><dd>View, find, create, and edit records</dd></div>
+          <div><dt>Keep blocked</dt><dd>Delete records</dd></div>
+        </dl>
+        <p class="chapter__body">
+          The local connector enforces grants for local folders. The hosted
+          provider executes approved operations for hosted collections.
+          {" "}<a href="/connect/">See the complete trust boundary</a>.
+        </p>
       </div>
     </section>
 
@@ -108,8 +134,9 @@ easier to understand.</code></pre>
           offline use.
         </p>
         <div class="chapter__actions">
-          <a class="button" href="/beta/">Request beta access</a>
-          <a class="text-link" href="/sdk/quickstart/">Build with the SDK</a>
+          <a class="button" href="/beta/">Request Connect beta access</a>
+          <a class="text-link" href="/spec/">Explore the open specification</a>
+          <a class="text-link" href="/sdk/quickstart/">Try the beta SDK locally</a>
         </div>
       </div>
     </section>
diff --git a/src/pages/sdk/index.astro b/src/pages/sdk/index.astro
index 53beba7..89688da 100644
--- a/src/pages/sdk/index.astro
+++ b/src/pages/sdk/index.astro
@@ -34,12 +34,12 @@ export async function listOpenTasks(client: MdbaseCollectionClient<Task>) {
   <h2 id="start">Choose the first result you need</h2>
   <div class="start-options">
     <div>
-      <strong>Learn the collection API</strong>
+      <strong>Learn the Connect client boundary</strong>
       <p>
         Run typed reads and revision-safe changes against an in-memory
-        collection. This path needs no account or running service.
+        collection. This source-built sandbox needs no account or service.
       </p>
-      <a href="/sdk/quickstart/">Try the SDK locally</a>
+      <a href="/sdk/quickstart/">Run the source-built sandbox</a>
     </div>
     <div>
       <strong>Connect a real application</strong>
@@ -49,6 +49,14 @@ export async function listOpenTasks(client: MdbaseCollectionClient<Task>) {
       </p>
       <a href="/sdk/connect-quickstart/">Open the Connect guide</a>
     </div>
+    <div>
+      <strong>Implement the open specification</strong>
+      <p>
+        Build a conforming collection tool or use the versioned TypeScript and
+        Rust implementations without the managed Connect service.
+      </p>
+      <a href="/spec/">Open the specification</a>
+    </div>
   </div>
   <div class="callout">
     <strong>Private-beta release status</strong>
@@ -56,7 +64,15 @@ export async function listOpenTasks(client: MdbaseCollectionClient<Task>) {
       The production service and protocol 1 are deployed for beta accounts.
       The npm packages await their first public release. Current developers
       build or pack the versioned artifacts from the
-      <a href="https://github.com/mdbase-dev/mdbase-connect">Connect repository</a>.
+      {" "}<a href="https://github.com/mdbase-dev/mdbase-connect">Connect repository</a>.
+    </p>
+  </div>
+  <div class="callout callout--success">
+    <strong>Versioned implementation evidence</strong>
+    <p>
+      The current site records mdbase specification 0.3.0 claims for the
+      TypeScript 0.3.0-rc.4 and Rust 0.4.0-rc.3 implementations, with evidence
+      dated 29 July 2026. <a href="/spec/#section-16">Review conformance resources</a>.
     </p>
   </div>
 
@@ -165,8 +181,8 @@ export async function listOpenTasks(client: MdbaseCollectionClient<Task>) {
   </table>
 
   <div class="button-row" style="margin-top: 2rem">
-    <a class="button button--primary" href="/sdk/quickstart/">Run the local example</a>
+    <a class="button button--primary" href="/sdk/quickstart/">Run the source-built sandbox</a>
     <a class="button" href="/sdk/connect-quickstart/">Connect a browser app</a>
-    <a class="button" href="/sdk/portable-apps/">Build one HTML file</a>
+    <a class="button" href="/spec/">Implement the specification</a>
   </div>
 </DocsLayout>
diff --git a/src/pages/sdk/quickstart/index.astro b/src/pages/sdk/quickstart/index.astro
index 7ee1e6e..e0881e0 100644
--- a/src/pages/sdk/quickstart/index.astro
+++ b/src/pages/sdk/quickstart/index.astro
@@ -71,8 +71,8 @@ Markdown paths: tasks/first.md, tasks/second.md`;
 ---
 
 <DocsLayout
-  title="Try the SDK locally"
-  description="Run a typed read, create, update, and query against an in-memory mdbase collection with no account or service."
+  title="Run the source-built SDK sandbox"
+  description="Build the current beta packages from source, then run typed operations against an in-memory collection with no account or service."
   active="quickstart"
   headings={[
     { href: "#prerequisites", label: "Prerequisites" },
@@ -84,7 +84,7 @@ Markdown paths: tasks/first.md, tasks/second.md`;
   ]}
 >
   <div class="callout callout--success">
-    <strong>No account, connector, or hosted service is required.</strong>
+    <strong>Local sandbox · source build · no account required</strong>
     <p>
       This example uses the real typed collection client and the deterministic
       developer sandbox. It keeps every record in memory and makes no network
diff --git a/src/styles/global.css b/src/styles/global.css
index ae84a3d..ec7647d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -139,6 +139,10 @@ code {
   outline-offset: 3px;
 }
 
+main[tabindex="-1"]:focus {
+  outline: none;
+}
+
 .sr-only {
   position: absolute;
   width: 1px;
@@ -189,7 +193,7 @@ code {
 
 .button {
   display: inline-flex;
-  min-height: 2.25rem;
+  min-height: 2.75rem;
   padding: 0.4rem 0.8rem;
   align-items: center;
   justify-content: center;
@@ -408,7 +412,7 @@ code {
 
 .code-block figcaption {
   display: flex;
-  min-height: 2.25rem;
+  min-height: 2.75rem;
   padding: 0 0.75rem;
   align-items: center;
   justify-content: space-between;
@@ -418,7 +422,9 @@ code {
 }
 
 .code-block button {
-  padding: 0.25rem;
+  min-width: 2.75rem;
+  min-height: 2.75rem;
+  padding: 0.25rem 0.4rem;
   color: inherit;
   background: transparent;
   border: 0;
@@ -467,7 +473,7 @@ code {
   display: grid;
   margin-top: 1.25rem;
   border-top: 1px solid var(--line-strong);
-  grid-template-columns: repeat(2, minmax(0, 1fr));
+  grid-template-columns: repeat(3, minmax(0, 1fr));
 }
 
 .start-options > div {
@@ -645,7 +651,7 @@ code {
   color: var(--ink);
   background: var(--surface);
   border: 1px solid var(--line);
-  border-radius: 3px;
+  border-radius: var(--radius);
 }
 
 .docs-toc {
@@ -755,7 +761,10 @@ code {
   }
 
   .docs-nav summary {
-    padding: 0.15rem;
+    display: flex;
+    min-height: 2.75rem;
+    padding: 0.15rem 0.4rem;
+    align-items: center;
     cursor: pointer;
   }
 
@@ -775,6 +784,10 @@ code {
 }
 
 @media (max-width: 42rem) {
+  body {
+    font-size: 1rem;
+  }
+
   .page-shell,
   .page-hero__inner,
   .content-section {
diff --git a/src/styles/home.css b/src/styles/home.css
index 0472ec7..793d24f 100644
--- a/src/styles/home.css
+++ b/src/styles/home.css
@@ -33,6 +33,10 @@
   display: none;
 }
 
+.home-body {
+  overflow-x: visible;
+}
+
 .home-body > main {
   z-index: 2;
   min-height: 100vh;
@@ -54,7 +58,7 @@
   font-weight: 650;
   text-decoration: none;
   background: var(--accent);
-  border-radius: 3px;
+  border-radius: var(--radius);
   transform: translateY(-160%);
 }
 
@@ -95,13 +99,103 @@
 .home-body h1,
 .home-body h2 {
   line-height: 0.98;
-  letter-spacing: -0.05em;
+  letter-spacing: -0.035em;
 }
 
 .home-body .chapter__actions--intro {
   margin-top: 1.5rem;
 }
 
+.home-body .chapter__actions {
+  flex-wrap: wrap;
+}
+
+.product-map,
+.grant-summary {
+  width: min(33.75rem, 100%);
+  margin-top: 1.75rem;
+  border-top: 1px solid var(--line-strong);
+}
+
+.product-map > div,
+.grant-summary > div {
+  display: grid;
+  padding-block: 0.7rem;
+  border-bottom: 1px solid var(--line);
+  grid-template-columns: minmax(7.75rem, 0.72fr) minmax(0, 1.5fr);
+  gap: 1rem;
+}
+
+.product-map > div {
+  transition:
+    background-color 140ms ease-out,
+    border-color 140ms ease-out;
+}
+
+.product-map dt,
+.grant-summary dt {
+  color: var(--muted);
+  font: 500 0.625rem/1.45 var(--mono);
+}
+
+.product-map dt a {
+  color: var(--ink);
+  font-weight: 600;
+  text-underline-offset: 0.24rem;
+}
+
+.product-map dd,
+.grant-summary dd {
+  margin: 0;
+  color: var(--ink-soft);
+  font-size: 0.75rem;
+  line-height: 1.5;
+}
+
+.product-map [data-product="connect"] :is(a, dd) {
+  transition: color 140ms ease-out;
+}
+
+.chapter__inner:has(.chapter__actions--intro .button:focus-visible)
+  .product-map
+  [data-product="connect"] {
+  background: color-mix(in oklch, var(--accent) 12%, transparent);
+  border-bottom-color: color-mix(in oklch, var(--accent) 48%, var(--line));
+}
+
+.chapter__inner:has(.chapter__actions--intro .button:focus-visible)
+  .product-map
+  [data-product="connect"]
+  :is(a, dd) {
+  color: var(--accent);
+}
+
+@media (hover: hover) and (pointer: fine) {
+  .chapter__inner:has(.chapter__actions--intro .button:hover)
+    .product-map
+    [data-product="connect"] {
+    background: color-mix(in oklch, var(--accent) 12%, transparent);
+    border-bottom-color: color-mix(in oklch, var(--accent) 48%, var(--line));
+  }
+
+  .chapter__inner:has(.chapter__actions--intro .button:hover)
+    .product-map
+    [data-product="connect"]
+    :is(a, dd) {
+    color: var(--accent);
+  }
+}
+
+.grant-summary dd {
+  color: var(--ink);
+  font-weight: 600;
+}
+
+.home-body .chapter__body a {
+  color: var(--ink-soft);
+  text-underline-offset: 0.22rem;
+}
+
 @media (max-width: 820px) {
   .home-body .chapter {
     min-height: 128vh;
@@ -163,6 +257,11 @@
     font-size: 0.8125rem;
     line-height: 1.5;
   }
+
+  .product-map > div,
+  .grant-summary > div {
+    grid-template-columns: minmax(6.75rem, 0.62fr) minmax(0, 1.38fr);
+  }
 }
 
 @media (max-width: 480px) {
@@ -170,4 +269,10 @@
   .home-body .record-example {
     font-size: 0.6875rem;
   }
+
+  .product-map > div,
+  .grant-summary > div {
+    grid-template-columns: 1fr;
+    gap: 0.25rem;
+  }
 }
diff --git a/src/styles/shell.css b/src/styles/shell.css
index e096745..9ee4e0b 100644
--- a/src/styles/shell.css
+++ b/src/styles/shell.css
@@ -133,12 +133,6 @@
   gap: 0.35rem;
 }
 
-.scene-count {
-  color: var(--color-text-muted);
-  font: 500 0.625rem/1 var(--mono);
-  white-space: nowrap;
-}
-
 .theme-menu {
   position: relative;
   flex: 0 0 auto;
@@ -146,14 +140,14 @@
 
 .theme-menu > summary {
   display: grid;
-  width: 2rem;
-  height: 2rem;
+  width: 2.75rem;
+  height: 2.75rem;
   padding: 0;
   place-items: center;
   color: var(--color-text-faint);
   background: transparent;
   border: 0;
-  border-radius: 3px;
+  border-radius: var(--radius);
   list-style: none;
   cursor: pointer;
 }
@@ -199,20 +193,20 @@
   padding: 0.3rem;
   background: var(--color-surface);
   border: 1px solid var(--color-border-strong);
-  border-radius: 3px;
+  border-radius: var(--radius);
 }
 
 .theme-menu__options button {
   display: grid;
   width: 100%;
-  min-height: 1.9rem;
+  min-height: 2.75rem;
   padding: 0 0.5rem;
   align-items: center;
   grid-template-columns: 1fr auto;
   color: var(--color-text-soft);
   background: transparent;
   border: 0;
-  border-radius: 2px;
+  border-radius: var(--radius);
   font: 400 0.66rem/1 var(--mono);
   text-align: left;
   cursor: pointer;
@@ -251,7 +245,10 @@
 }
 
 .mobile-nav summary {
-  padding: 0.35rem 0;
+  display: flex;
+  min-height: 2.75rem;
+  padding: 0.35rem 0.25rem;
+  align-items: center;
   color: var(--color-text-soft);
   font-size: 0.78rem;
   list-style: none;
@@ -300,11 +297,11 @@
 .site-footer__inner {
   display: grid;
   width: min(100% - 2rem, var(--site-width));
-  min-height: 5.5rem;
+  min-height: 8rem;
   margin-inline: auto;
-  padding-block: 1.5rem;
-  align-items: center;
-  grid-template-columns: 1fr auto;
+  padding-block: 2rem;
+  align-items: start;
+  grid-template-columns: minmax(14rem, 0.72fr) minmax(0, 1.28fr);
   gap: 2rem;
 }
 
@@ -319,11 +316,22 @@
   font-size: 0.78rem;
 }
 
-.site-footer nav {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  gap: 0.5rem 1.1rem;
+.site-footer .site-footer__nav {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 1.5rem;
+}
+
+.site-footer__nav > div {
+  display: grid;
+  align-content: start;
+  gap: 0.5rem;
+}
+
+.site-footer__nav > div > strong {
+  margin-bottom: 0.15rem;
+  color: var(--color-text-muted);
+  font-size: 0.625rem;
 }
 
 .site-footer nav a {
@@ -358,16 +366,18 @@
     width: min(100% - 1.25rem, var(--site-width));
   }
 
-  .scene-count {
-    display: none;
-  }
-
   .site-footer__inner {
     grid-template-columns: 1fr;
-    gap: 1rem;
+    gap: 1.5rem;
+  }
+
+  .site-footer .site-footer__nav {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
+}
 
-  .site-footer nav {
-    justify-content: flex-start;
+@media (max-width: 30rem) {
+  .site-footer .site-footer__nav {
+    grid-template-columns: 1fr;
   }
 }

From 770473c55e5b7a39c8534f3895294a435fb2c98d Mon Sep 17 00:00:00 2001
From: callumalpass <callumalpass@gmail.com>
Date: Mon, 3 Aug 2026 14:57:40 +1000
Subject: [PATCH 5/5] Present Connect beta access as a waitlist

---
 src/components/SiteFooter.astro |  2 +-
 src/pages/beta/index.astro      | 36 +++++++++++++++++----------------
 src/pages/connect/index.astro   |  8 ++++----
 src/pages/index.astro           |  4 ++--
 src/pages/privacy/index.astro   |  2 +-
 5 files changed, 27 insertions(+), 25 deletions(-)

diff --git a/src/components/SiteFooter.astro b/src/components/SiteFooter.astro
index f426f5f..f81d813 100644
--- a/src/components/SiteFooter.astro
+++ b/src/components/SiteFooter.astro
@@ -9,7 +9,7 @@
         <strong>Product</strong>
         <a href="/">Overview</a>
         <a href="/connect/">Connect</a>
-        <a href="/beta/">Connect beta access</a>
+        <a href="/beta/">Connect beta waitlist</a>
         <a href="/security/">Security</a>
       </div>
       <div>
diff --git a/src/pages/beta/index.astro b/src/pages/beta/index.astro
index 90f8255..0996e89 100644
--- a/src/pages/beta/index.astro
+++ b/src/pages/beta/index.astro
@@ -10,18 +10,19 @@ const betaAccessEndpoint = new URL(
 ---
 
 <BaseLayout
-  title="Request Connect beta access"
-  description="Request access to the mdbase Connect private beta."
+  title="Join the Connect beta waitlist"
+  description="Join the waitlist for the mdbase Connect private beta."
   current="connect"
 >
   <section class="beta-opening">
     <header class="beta-opening__copy">
       <p class="eyebrow">Connect private beta</p>
-      <h1>Request Connect beta access.</h1>
+      <h1>Join the Connect beta waitlist.</h1>
       <p>
-        The managed Connect service is opening in small batches while release
-        checks continue. The open mdbase specification and local tools do not
-        require an invitation.
+        The managed Connect service is not open for general registration.
+        Join the waitlist and we will send invitations in small batches when
+        beta access is available. The open mdbase specification and local
+        tools do not require an invitation.
       </p>
     </header>
 
@@ -49,7 +50,7 @@ const betaAccessEndpoint = new URL(
             spellcheck="false"
             aria-describedby="beta-email-help beta-status"
           />
-          <button type="submit">Request Connect access</button>
+          <button type="submit">Join the waitlist</button>
         </div>
         <div class="beta-honeypot" aria-hidden="true">
           <label for="beta-website">Website</label>
@@ -76,8 +77,9 @@ const betaAccessEndpoint = new URL(
         </noscript>
       </form>
       <p class="beta-intake__privacy">
-        We use this address to manage beta access and contact you about the
-        beta. Requesting access does not guarantee immediate availability.
+        We use this address to manage the waitlist and contact you about beta
+        access. Joining does not guarantee an invitation or immediate
+        availability.
         {" "}<a href="/privacy/">Privacy</a>
       </p>
     </div>
@@ -103,8 +105,8 @@ const betaAccessEndpoint = new URL(
       <div>
         <dt>Private-beta timing</dt>
         <dd>
-          Invitations are sent in small batches. There is no published wait
-          time, and a request does not guarantee immediate availability.
+          We will invite people in small batches when we are ready. There is
+          no published wait time, and joining does not guarantee an invitation.
         </dd>
       </div>
     </dl>
@@ -112,7 +114,7 @@ const betaAccessEndpoint = new URL(
 
   <section class="beta-next" aria-labelledby="after-request">
     <div>
-      <h2 id="after-request">After your request.</h2>
+      <h2 id="after-request">After you join.</h2>
       <p>
         If access is available, you will receive a one-time signup link at the
         address you submitted. Connect remains pre-release software, so keep
@@ -152,10 +154,10 @@ const betaAccessEndpoint = new URL(
         email.disabled = true;
         button.disabled = true;
         button.removeAttribute("aria-busy");
-        button.textContent = "Request received";
+        button.textContent = "You’re on the waitlist";
         status.dataset.state = "success";
         status.textContent =
-          "Request received. We’ll email you when Connect beta access is available.";
+          "You’re on the waitlist. We’ll email you when we’re ready to invite more people.";
       };
 
       try {
@@ -188,9 +190,9 @@ const betaAccessEndpoint = new URL(
 
         button.disabled = true;
         button.setAttribute("aria-busy", "true");
-        button.textContent = "Requesting…";
+        button.textContent = "Joining…";
         status.dataset.state = "pending";
-        status.textContent = "Sending your request.";
+        status.textContent = "Adding your address to the waitlist.";
 
         try {
           const response = await fetch(form.dataset.endpoint ?? "", {
@@ -227,7 +229,7 @@ const betaAccessEndpoint = new URL(
         } catch (error) {
           button.disabled = false;
           button.removeAttribute("aria-busy");
-          button.textContent = "Request Connect access";
+          button.textContent = "Join the waitlist";
           status.dataset.state = "error";
           status.textContent = error instanceof Error && error.message.startsWith("rate_limited")
             ? error.message.includes(":")
diff --git a/src/pages/connect/index.astro b/src/pages/connect/index.astro
index 9227a42..54b9328 100644
--- a/src/pages/connect/index.astro
+++ b/src/pages/connect/index.astro
@@ -17,7 +17,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
         change or revoke access at any time.
       </p>
       <div class="button-row">
-        <a class="button button--primary" href="/beta/">Request beta access</a>
+        <a class="button button--primary" href="/beta/">Join the beta waitlist</a>
         <a class="button" href="#how-connect-works">See how Connect works</a>
       </div>
     </div>
@@ -192,12 +192,12 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
         <p class="eyebrow">Connect private beta</p>
         <h2>Try Connect with your own Markdown.</h2>
         <p>
-          Invitations are sent in small batches. Requesting access only needs
-          your email address.
+          The waitlist is open. Invitations will be sent in small batches when
+          we are ready. Joining only needs your email address.
         </p>
       </div>
       <div class="button-row">
-        <a class="button button--primary" href="/beta/">Request beta access</a>
+        <a class="button button--primary" href="/beta/">Join the beta waitlist</a>
         <a class="button" href="/sdk/connect-quickstart/">Build with the SDK</a>
       </div>
     </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 4c63062..2914621 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -39,7 +39,7 @@ import HomeLayout from "../layouts/HomeLayout.astro";
           </div>
         </dl>
         <div class="chapter__actions chapter__actions--intro">
-          <a class="button" href="/beta/" aria-describedby="connect-summary">Request Connect beta access</a>
+          <a class="button" href="/beta/" aria-describedby="connect-summary">Join the Connect beta waitlist</a>
           <a class="text-link" href="#example">See how it works</a>
         </div>
       </div>
@@ -134,7 +134,7 @@ easier to understand.</code></pre>
           offline use.
         </p>
         <div class="chapter__actions">
-          <a class="button" href="/beta/">Request Connect beta access</a>
+          <a class="button" href="/beta/">Join the Connect beta waitlist</a>
           <a class="text-link" href="/spec/">Explore the open specification</a>
           <a class="text-link" href="/sdk/quickstart/">Try the beta SDK locally</a>
         </div>
diff --git a/src/pages/privacy/index.astro b/src/pages/privacy/index.astro
index a301e0e..81aa8a2 100644
--- a/src/pages/privacy/index.astro
+++ b/src/pages/privacy/index.astro
@@ -14,7 +14,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
     <h2>Website</h2>
     <p>
       mdbase.dev is a public static documentation website. It has no account
-      system or advertising trackers. When you request beta access, mdbase
+      system or advertising trackers. When you join the beta waitlist, mdbase
       Connect retains the submitted email address and request time so the
       request can be reviewed and an invitation can be sent. Rate-limit records
       use keyed digests of the email and network address; the access-request