@orangecheck/app-design 0.6.0 → 1.0.0

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
-import { forwardRef, createContext, useContext, useRef, useState, useCallback, useEffect, useId, isValidElement, cloneElement, createElement, Children, Component, useMemo } from 'react';
+import { forwardRef, createContext, useContext, useRef, useState, useCallback, useEffect, useId, isValidElement, cloneElement, useSyncExternalStore, useMemo, createElement, Children, Component, Fragment as Fragment$1 } from 'react';
 import { clsx } from 'clsx';
 import { extendTailwindMerge } from 'tailwind-merge';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
@@ -12,13 +12,14 @@ import * as LabelPrimitive from '@radix-ui/react-label';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
-import { ChevronDown, Check, X, Copy, Menu, ChevronRight, Sun, Moon, SunMoon } from 'lucide-react';
+import { ChevronDown, Check, X, ChevronLeft, ChevronRight, Copy, ArrowUpRight, Menu, Sun, Moon, SunMoon, CircleDashed, CircleMinus, Clock, CircleX, CircleCheck } from 'lucide-react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
-import Link2 from 'next/link';
+import QRCode from 'qrcode';
+import Link5 from 'next/link';
 import { useTheme } from 'next-themes';
 
 // src/tokens/index.ts
@@ -35,7 +36,8 @@ var appColors = {
     border: "#ECECEC",
     hairlineStrong: "#DADADA",
     accentDisplay: "#F55819",
-    accentInk: "#C73F09"
+    accentInk: "#C73F09",
+    ring: "#EA580B"
   },
   dark: {
     background: "#0A0A0A",
@@ -44,10 +46,11 @@ var appColors = {
     muted: "#1E1E1E",
     mutedForeground: "#A3A6AA",
     subtleForeground: "#8B8E93",
-    border: "#262626",
+    border: "#2A2A2A",
     hairlineStrong: "#333333",
     accentDisplay: "#F66D36",
-    accentInk: "#F0835A"
+    accentInk: "#F0835A",
+    ring: "#F66D36"
   },
   brand: {
     orange: "#F66D36",
@@ -249,13 +252,13 @@ var badgeVariants = cva(
       tone: {
         neutral: "border-border bg-card text-foreground",
         muted: "border-transparent bg-muted text-muted-foreground",
-        brand: "border-transparent bg-[color-mix(in_oklab,var(--oca-orange)_12%,var(--card))] text-oca-accent-ink",
+        brand: "border-transparent bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--card))] text-oca-accent-ink",
         danger: "border-transparent bg-[color-mix(in_oklab,var(--destructive)_12%,var(--card))] text-destructive",
         // A good state is a neutral pill with a green dot, not a green pill.
         success: GOOD_DOT,
         // Aliases kept so older call sites keep compiling: attention is
         // the brand accent, information is neutral.
-        warning: "border-transparent bg-[color-mix(in_oklab,var(--oca-orange)_12%,var(--card))] text-oca-accent-ink",
+        warning: "border-transparent bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--card))] text-oca-accent-ink",
         info: "border-border bg-card text-foreground",
         // Inverted in dark mode, where ink would sit on a card of nearly its own colour.
         ink: "border-transparent bg-oca-ink text-oca-ink-foreground dark:bg-foreground dark:text-background",
@@ -293,6 +296,30 @@ function StatusPill({
     }
   );
 }
+var WORD = {
+  live: "Live",
+  testing: "In testing",
+  "not-yet": "Not yet",
+  paused: "Paused",
+  good: "Good",
+  caution: "Caution",
+  refused: "Refused"
+};
+var TONE = {
+  live: "success",
+  testing: "brand",
+  "not-yet": "muted",
+  paused: "muted",
+  good: "success",
+  caution: "brand",
+  refused: "danger"
+};
+function statusWord(status) {
+  return WORD[status];
+}
+function StatusBadge({ status, className, ...props }) {
+  return /* @__PURE__ */ jsx(Badge, { tone: TONE[status], "data-status": status, className: cn(className), ...props, children: WORD[status] });
+}
 var cardVariants = cva("relative rounded-[1.25rem] border", {
   variants: {
     tone: {
@@ -476,7 +503,8 @@ var Switch = forwardRef(function Switch2({ className, ...props }, ref) {
       className: cn(
         "peer inline-flex h-6 w-11 shrink-0 items-center rounded-full border border-transparent bg-input p-0.5",
         "outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-        "data-[state=checked]:bg-brand disabled:cursor-not-allowed disabled:opacity-50",
+        // The deep orange: the track is the state, so it must clear 3:1 on a card.
+        "data-[state=checked]:bg-oca-orange-deep disabled:cursor-not-allowed disabled:opacity-50",
         className
       ),
       ...props,
@@ -768,6 +796,245 @@ var TabsTrigger = forwardRef(function TabsTrigger2({ className, ...props }, ref)
 var TabsContent = forwardRef(function TabsContent2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(TabsPrimitive.Content, { ref, className: cn("mt-6 outline-none", className), ...props });
 });
+var GroupName = createContext(void 0);
+function Accordion({
+  single = false,
+  children,
+  className
+}) {
+  const name = useId();
+  return /* @__PURE__ */ jsx(GroupName.Provider, { value: single ? name : void 0, children: /* @__PURE__ */ jsx("div", { className: cn("divide-y divide-border overflow-hidden rounded-[1.25rem] border border-border bg-card", className), children }) });
+}
+function AccordionItem({
+  title,
+  children,
+  defaultOpen = false,
+  id,
+  className
+}) {
+  const name = useContext(GroupName);
+  return /* @__PURE__ */ jsxs("details", { id, name, open: defaultOpen || void 0, className: cn("group scroll-mt-24", className), children: [
+    /* @__PURE__ */ jsxs(
+      "summary",
+      {
+        className: cn(
+          "flex min-h-14 cursor-pointer list-none items-center justify-between gap-4 px-5 py-4 text-[1rem] font-medium leading-snug md:px-6",
+          // Inside the card's clip, so the ring is drawn within the row.
+          "transition-colors hover:bg-accent/60 focus-visible:outline-offset-[-2px] [&::-webkit-details-marker]:hidden"
+        ),
+        children: [
+          title,
+          /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              "aria-hidden": true,
+              className: "size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "oca-body px-5 pb-5 text-[0.9375rem] md:px-6 md:pb-6", children })
+  ] });
+}
+var queue = [];
+var asked = 0;
+var hosts = 0;
+var listeners = /* @__PURE__ */ new Set();
+var emit = () => listeners.forEach((l) => l());
+function ask(item) {
+  queue = [...queue, { ...item, id: ++asked }];
+  emit();
+}
+function done() {
+  queue = queue.slice(1);
+  emit();
+}
+function confirm(options) {
+  if (hosts === 0) {
+    console.error("confirm(): no <DialogHost /> is mounted, so nothing was asked; treating it as no.");
+    return Promise.resolve(false);
+  }
+  return new Promise((resolve) => ask({ id: 0, kind: "confirm", options, settle: resolve }));
+}
+function prompt(options) {
+  if (hosts === 0) {
+    console.error("prompt(): no <DialogHost /> is mounted, so nothing was asked; treating it as cancelled.");
+    return Promise.resolve(null);
+  }
+  return new Promise((resolve) => ask({ id: 0, kind: "prompt", options, settle: resolve }));
+}
+function subscribe(listener) {
+  listeners.add(listener);
+  hosts++;
+  return () => {
+    listeners.delete(listener);
+    hosts--;
+  };
+}
+var current = () => queue[0] ?? null;
+var none = () => null;
+function PromptBody({ ask: a }) {
+  const o = a.options;
+  const [value, setValue] = useState(o.defaultValue ?? "");
+  const [error, setError] = useState(null);
+  const submit = (e) => {
+    e.preventDefault();
+    if (o.minLength && value.length < o.minLength) {
+      setError(`At least ${o.minLength} characters.`);
+      return;
+    }
+    const refused = o.validate?.(value);
+    if (refused) {
+      setError(refused);
+      return;
+    }
+    a.settle(value);
+    done();
+  };
+  return /* @__PURE__ */ jsxs("form", { onSubmit: submit, noValidate: true, children: [
+    /* @__PURE__ */ jsx(Field, { label: o.label ?? "Your answer", hint: o.hint, error, children: /* @__PURE__ */ jsx(
+      Input,
+      {
+        autoFocus: true,
+        type: o.secret ? "password" : "text",
+        autoComplete: o.secret ? "new-password" : "off",
+        placeholder: o.placeholder,
+        value,
+        onChange: (e) => {
+          setValue(e.target.value);
+          setError(null);
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          onClick: () => {
+            a.settle(null);
+            done();
+          },
+          children: o.cancelLabel ?? "Cancel"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { type: "submit", variant: o.destructive ? "danger" : "primary", children: o.confirmLabel ?? "Continue" })
+    ] })
+  ] });
+}
+function DialogHost() {
+  const a = useSyncExternalStore(subscribe, current, none);
+  const cancel = () => {
+    if (!a) return;
+    if (a.kind === "confirm") a.settle(false);
+    else a.settle(null);
+    done();
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open: a !== null, onOpenChange: (open) => open ? void 0 : cancel(), children: a ? /* @__PURE__ */ jsxs(
+    DialogContent,
+    {
+      role: "alertdialog",
+      ...a.options.message ? {} : { "aria-describedby": void 0 },
+      className: "w-[min(92vw,28rem)]",
+      children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: a.options.title }),
+          a.options.message ? /* @__PURE__ */ jsx(DialogDescription, { children: a.options.message }) : null
+        ] }),
+        a.kind === "prompt" ? (
+          // Keyed by the ask, so a second prompt starts empty.
+          /* @__PURE__ */ jsx(PromptBody, { ask: a }, a.id)
+        ) : /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: cancel, children: a.options.cancelLabel ?? "Cancel" }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: a.options.destructive ? "danger" : "primary",
+              onClick: () => {
+                a.settle(true);
+                done();
+              },
+              children: a.options.confirmLabel ?? "Continue"
+            }
+          )
+        ] })
+      ]
+    }
+  ) : null });
+}
+var N = new Intl.NumberFormat("en-US");
+function Pagination({
+  pageIndex,
+  pageSize,
+  total,
+  onPage,
+  label = "Pages",
+  className
+}) {
+  const pages = Math.max(1, Math.ceil(total / pageSize));
+  const index = Math.min(Math.max(0, pageIndex), pages - 1);
+  if (index !== pageIndex && typeof process !== "undefined" && process.env.NODE_ENV !== "production") {
+    console.warn(`Pagination: pageIndex ${pageIndex} is outside 0\u2013${pages - 1}; it counts from 0.`);
+  }
+  if (total <= pageSize) return null;
+  const from = index * pageSize + 1;
+  const to = Math.min(total, (index + 1) * pageSize);
+  return /* @__PURE__ */ jsxs("nav", { "aria-label": label, className: cn("flex items-center justify-between gap-4", className), children: [
+    /* @__PURE__ */ jsxs("p", { "aria-live": "polite", className: "oca-tabular text-[0.875rem] text-muted-foreground", children: [
+      N.format(from),
+      "\u2013",
+      N.format(to),
+      " of ",
+      N.format(total)
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs(Button, { variant: "secondary", size: "sm", disabled: index === 0, onClick: () => onPage(index - 1), className: "pl-3", children: [
+        /* @__PURE__ */ jsx(ChevronLeft, { "aria-hidden": true }),
+        "Previous"
+      ] }),
+      /* @__PURE__ */ jsxs(Button, { variant: "secondary", size: "sm", disabled: index >= pages - 1, onClick: () => onPage(index + 1), className: "pr-3", children: [
+        "Next",
+        /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true })
+      ] })
+    ] })
+  ] });
+}
+function QrCode({
+  value,
+  size = 200,
+  label,
+  className
+}) {
+  const matrix = useMemo(() => {
+    try {
+      return QRCode.create(value, { errorCorrectionLevel: "M" }).modules;
+    } catch {
+      return null;
+    }
+  }, [value]);
+  const path = useMemo(() => {
+    if (!matrix) return "";
+    let d = "";
+    for (let y = 0; y < matrix.size; y++) {
+      for (let x = 0; x < matrix.size; x++) {
+        if (matrix.get(y, x)) d += `M${x} ${y}h1v1h-1z`;
+      }
+    }
+    return d;
+  }, [matrix]);
+  const short = value.length > 28 ? `${value.slice(0, 28)}\u2026` : value;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "img",
+      "aria-label": matrix ? label ?? `QR code for ${short}` : "Too long for a QR code",
+      className: cn("inline-block shrink-0 rounded-2xl bg-white p-3 ring-1 ring-border", className),
+      style: { width: size, height: size },
+      children: matrix ? /* @__PURE__ */ jsx("svg", { viewBox: `0 0 ${matrix.size} ${matrix.size}`, shapeRendering: "crispEdges", "aria-hidden": true, className: "block size-full", children: /* @__PURE__ */ jsx("path", { d: path, fill: "#0a0a0a" }) }) : /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "flex size-full items-center justify-center text-center text-[0.8125rem] text-[#54585e]", children: "Too long for a QR code" })
+    }
+  );
+}
 var TOP = "0,3 2,2 6,4 14,0 16,1 6,6";
 var LEFT = "0,3 6,6 6,8 0,5";
 var RIGHT = "6,6 16,1 16,3 6,8";
@@ -792,6 +1059,20 @@ function Mark({ title, size, className, ...rest }) {
     }
   );
 }
+function MarkOutline({ className }) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "-0.2 -0.2 16.4 8.4", "aria-hidden": true, className: cn("shrink-0 overflow-visible", className), children: [TOP, LEFT, RIGHT].map((points) => /* @__PURE__ */ jsx(
+    "polygon",
+    {
+      points,
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1",
+      strokeLinejoin: "round",
+      vectorEffect: "non-scaling-stroke"
+    },
+    points
+  )) });
+}
 function AppIcon({ title, size = 32, className, ...rest }) {
   return /* @__PURE__ */ jsxs(
     "svg",
@@ -2116,7 +2397,7 @@ var LABEL = {
   "not-yet": "Not yet",
   no: "No"
 };
-var TONE = {
+var TONE2 = {
   yes: "text-oca-accent-ink",
   testing: "text-foreground",
   "not-yet": "text-muted-foreground",
@@ -2137,7 +2418,7 @@ function TruthTable({
           className
         ),
         children: rows.map((r, i) => /* @__PURE__ */ jsxs("li", { className: "flex flex-col gap-1.5 px-4 py-3.5", children: [
-          /* @__PURE__ */ jsx("span", { className: cn("text-[0.875rem] font-medium", TONE[r.status]), children: LABEL[r.status] }),
+          /* @__PURE__ */ jsx("span", { className: cn("text-[0.875rem] font-medium", TONE2[r.status]), children: LABEL[r.status] }),
           /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] leading-relaxed", children: r.what })
         ] }, i))
       }
@@ -2154,7 +2435,7 @@ function TruthTable({
             className: cn(
               "border-t border-oca-hairline-strong px-4 py-3 font-medium",
               i === 0 && "border-t-0",
-              TONE[r.status]
+              TONE2[r.status]
             ),
             children: LABEL[r.status]
           }
@@ -2413,126 +2694,1286 @@ var ErrorBoundary = class extends Component {
     ) });
   }
 };
-function NavLink({ item, className, onNavigate }) {
-  const cls = cn(
-    "rounded-full px-3 py-2 text-[0.9375rem] transition-colors",
-    item.active ? "text-foreground" : "text-muted-foreground hover:text-foreground",
-    className
-  );
-  if (item.external) {
-    return /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: item.label });
+var WORDS = {
+  404: {
+    name: "Not found",
+    title: "This page isn\u2019t here.",
+    detail: "The link may be old, or the address mistyped."
+  },
+  500: {
+    name: "Server error",
+    title: "Something broke on our side.",
+    detail: "Try again in a moment."
   }
-  return /* @__PURE__ */ jsx(Link2, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: item.label });
-}
-function SiteHeader({
-  home = "/",
-  brand,
-  nav = [],
+};
+function ErrorPage({
+  code = 404,
+  title,
+  detail,
   actions,
+  home = "/",
+  art,
   className
 }) {
-  const [open, setOpen] = useState(false);
-  return /* @__PURE__ */ jsx(
-    "header",
+  const words = WORDS[code] ?? (code >= 500 ? WORDS[500] : WORDS[404]);
+  const server = code >= 500;
+  return /* @__PURE__ */ jsx(Section, { space: "none", className: cn("flex min-h-[min(40rem,72dvh)] items-center py-16 md:py-24", className), children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-12 md:grid-cols-12", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex max-w-[40rem] flex-col items-start gap-6 md:col-span-7", children: [
+      /* @__PURE__ */ jsxs("p", { className: "oca-eyebrow oca-enter", children: [
+        /* @__PURE__ */ jsx("span", { className: "oca-tabular", children: code }),
+        " \xB7 ",
+        WORDS[code]?.name ?? (server ? "Error" : "Not available")
+      ] }),
+      /* @__PURE__ */ jsx("h1", { className: "oca-display-2 oca-enter [--enter-delay:70ms]", children: title ?? words.title }),
+      /* @__PURE__ */ jsx("p", { className: "oca-lead oca-enter [--enter-delay:150ms]", children: detail ?? words.detail }),
+      /* @__PURE__ */ jsx("div", { className: "oca-enter flex flex-wrap gap-3 [--enter-delay:230ms]", children: actions ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        server ? /* @__PURE__ */ jsx(Button, { onClick: () => window.location.reload(), children: "Try again" }) : null,
+        /* @__PURE__ */ jsx(Button, { asChild: true, variant: server ? "secondary" : "primary", children: /* @__PURE__ */ jsx(Link5, { href: home, children: "Go home" }) })
+      ] }) })
+    ] }),
+    art !== null ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-enter hidden justify-center md:col-span-5 md:flex [--enter-delay:120ms]", children: art ?? /* @__PURE__ */ jsx(MarkOutline, { className: "w-full max-w-[20rem] text-oca-hairline-strong" }) }) : null
+  ] }) });
+}
+function SectionHeading({
+  eyebrow,
+  title,
+  lead,
+  id,
+  onInk = false,
+  level = 2,
+  as = "h2",
+  align = "start",
+  reveal = true,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(SectionIntro, { align, reveal, className: cn("max-w-3xl gap-4 md:gap-4", className), children: [
+    eyebrow ? /* @__PURE__ */ jsx(Eyebrow, { onInk, children: eyebrow }) : null,
+    /* @__PURE__ */ jsx(Display, { level, as, id, className: "scroll-mt-24", children: title }),
+    lead ? /* @__PURE__ */ jsx("p", { className: cn("oca-lead", onInk && "text-oca-ink-muted"), children: lead }) : null
+  ] });
+}
+function FactBlock({
+  id,
+  title,
+  description,
+  aside,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("section", { id, className: cn("flex scroll-mt-24 flex-col gap-6", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:items-end md:justify-between md:gap-8", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex max-w-[44rem] flex-col gap-3", children: [
+        /* @__PURE__ */ jsx("h2", { className: "oca-display-3", children: title }),
+        description ? /* @__PURE__ */ jsx("div", { className: "oca-body text-[1.0625rem]", children: description }) : null
+      ] }),
+      aside ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 flex-wrap gap-x-5 gap-y-2 text-[0.9375rem]", children: aside }) : null
+    ] }),
+    children
+  ] });
+}
+function FactRows({
+  rows,
+  columns = 1,
+  label,
+  className
+}) {
+  return /* @__PURE__ */ jsx("ul", { "aria-label": label, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: rows.map((r) => /* @__PURE__ */ jsxs("li", { className: "flex flex-col gap-5 px-5 py-6 md:px-8 md:py-7", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-x-6", children: [
+      /* @__PURE__ */ jsx("h3", { className: "oca-title min-w-0 text-pretty", children: r.title }),
+      r.figure ? /* @__PURE__ */ jsx("span", { className: "oca-tabular shrink-0 whitespace-nowrap text-[1.75rem] leading-none tracking-[-0.02em]", children: r.figure }) : null
+    ] }),
+    /* @__PURE__ */ jsx("dl", { className: columns === 2 ? "grid grid-cols-1 gap-x-10 gap-y-4 md:grid-cols-2" : "flex flex-col gap-4", children: r.fields.map((f, i) => /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
+      /* @__PURE__ */ jsx("dt", { className: "text-[0.875rem] font-medium text-muted-foreground", children: f.label }),
+      /* @__PURE__ */ jsx("dd", { className: "break-words text-[1rem] leading-relaxed", children: f.value })
+    ] }, i)) })
+  ] }, r.key)) });
+}
+function EndpointList({ items, label, className }) {
+  return /* @__PURE__ */ jsx("ul", { "aria-label": label, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: items.map((a) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+    "a",
     {
-      className: cn(
-        "sticky top-0 z-40 w-full border-b border-transparent bg-background/85 backdrop-blur-md supports-[backdrop-filter]:bg-background/70",
-        className
-      ),
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "oca-container flex h-16 items-center justify-between gap-4 md:h-[4.5rem]",
-            // Three columns, the outer two each at least their content: the
-            // navigation stays centred whatever the actions hold, so it does
-            // not shift when they change (signed out to signed in).
-            nav.length > 0 && "md:grid md:grid-cols-[minmax(max-content,1fr)_auto_minmax(max-content,1fr)]"
-          ),
-          children: [
-            /* @__PURE__ */ jsxs(Link2, { href: home, className: "-ml-1 justify-self-start rounded-lg p-1", children: [
-              brand ?? /* @__PURE__ */ jsx(Lockup, { size: 28 }),
-              /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
-            ] }),
-            nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map((n) => /* @__PURE__ */ jsx(NavLink, { item: n }, n.href)) }) : null,
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 justify-self-end", children: [
-              actions,
-              nav.length > 0 ? /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
-                /* @__PURE__ */ jsx(
-                  SheetTrigger,
-                  {
-                    className: "inline-flex size-10 items-center justify-center rounded-full text-foreground hover:bg-accent md:hidden",
-                    "aria-label": "Open menu",
-                    children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
-                  }
-                ),
-                /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "pt-16", children: [
-                  /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Menu" }),
-                  /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "flex flex-col", children: nav.map((n) => /* @__PURE__ */ jsx(
-                    NavLink,
-                    {
-                      item: n,
-                      className: "rounded-xl px-3 py-3 text-[1.0625rem]",
-                      onNavigate: () => setOpen(false)
-                    },
-                    n.href
-                  )) })
-                ] })
-              ] }) : null
-            ] })
-          ]
-        }
-      )
+      href: a.href,
+      target: "_blank",
+      rel: "noreferrer",
+      className: "flex flex-col gap-1 px-5 py-3.5 transition-colors hover:bg-accent/60 sm:flex-row sm:items-baseline sm:justify-between sm:gap-6",
+      children: [
+        /* @__PURE__ */ jsx("code", { className: "break-all text-[0.875rem] text-foreground", children: a.label ?? a.href }),
+        /* @__PURE__ */ jsxs("span", { className: "text-[0.875rem] text-muted-foreground sm:text-right", children: [
+          a.description,
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: " (opens in a new tab)" })
+        ] })
+      ]
     }
-  );
+  ) }, a.href)) });
 }
-function SiteFooter({
-  columns = [],
-  fineprint,
-  meta,
-  signature = true,
+function ProofStrip({ items, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("border-y border-border", className), children: /* @__PURE__ */ jsx("ul", { className: "oca-container grid grid-cols-2 gap-x-6 gap-y-4 py-6 md:grid-cols-4", children: items.map((it, i) => /* @__PURE__ */ jsxs(
+    "li",
+    {
+      className: "flex items-center gap-3 text-[0.9375rem] [&_svg]:size-[1.1rem] [&_svg]:shrink-0 [&_svg]:text-oca-accent-ink",
+      children: [
+        it.icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "flex", children: it.icon }) : null,
+        it.label
+      ]
+    },
+    i
+  )) }) });
+}
+function Closing({
+  title,
+  lead,
+  actions,
+  art,
   className
 }) {
-  return /* @__PURE__ */ jsxs("footer", { className: cn("border-t border-border bg-background", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "oca-container grid grid-cols-2 gap-x-6 gap-y-10 py-14 md:grid-cols-[1.3fr_repeat(3,1fr)] md:py-16", children: [
-      /* @__PURE__ */ jsxs("div", { className: "col-span-2 flex flex-col gap-4 md:col-span-1", children: [
-        /* @__PURE__ */ jsx(Lockup, { size: 26 }),
-        fineprint ? /* @__PURE__ */ jsx("p", { className: "max-w-xs text-[0.9375rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
+  return /* @__PURE__ */ jsx(Section, { className: cn("overflow-hidden", className), children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-12 md:grid-cols-12", children: [
+    /* @__PURE__ */ jsxs(Reveal, { className: "flex flex-col items-start gap-8 md:col-span-7", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
+        /* @__PURE__ */ jsx("h2", { className: "oca-display-1 text-[clamp(2.5rem,1.5rem+4vw,5rem)] leading-[1]", children: title }),
+        lead ? /* @__PURE__ */ jsx("p", { className: "oca-lead max-w-[34rem]", children: lead }) : null
       ] }),
-      columns.map((col, i) => {
-        const spans = columns.length % 2 === 1 && i === columns.length - 1;
-        return /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: cn("flex min-w-0 flex-col gap-1", spans && "col-span-2 md:col-span-1"),
-            children: [
-              /* @__PURE__ */ jsx("p", { className: "mb-2 text-[0.875rem] font-medium", children: col.heading }),
-              /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1", spans && "grid grid-cols-2 gap-x-6 md:flex md:flex-col"), children: col.links.map((l) => /* @__PURE__ */ jsx(
-                NavLink,
-                {
-                  item: l,
-                  className: "-mx-3 py-2.5 text-[0.9375rem] md:py-1.5"
-                },
-                l.href
-              )) })
-            ]
-          },
-          col.heading
-        );
-      })
+      actions ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3", children: actions }) : null
     ] }),
-    signature ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-container select-none overflow-hidden pb-8 md:pb-12", children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-[0.18em] text-[clamp(3rem,11.5vw,10rem)] leading-[0.78] tracking-[-0.065em] [font-family:var(--oc-font-display)]", children: [
-      /* @__PURE__ */ jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsx(Mark, { className: "block h-auto w-full" }) }),
-      /* @__PURE__ */ jsx("span", { children: "orangecheck" })
-    ] }) }) : null,
-    meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsx("div", { className: "border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: meta }) }) : null
+    art !== null ? (
+      // Room under the check on a phone, so its glow fades before the band ends.
+      /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "flex justify-center max-md:pb-16 md:col-span-5", children: art ?? /* @__PURE__ */ jsx(IsoCheck, { size: 340, settle: true, tilt: true, className: "max-w-full" }) })
+    ) : null
+  ] }) });
+}
+function Faq({
+  items,
+  className
+}) {
+  return /* @__PURE__ */ jsx(Accordion, { single: true, className, children: items.map((it, i) => /* @__PURE__ */ jsx(AccordionItem, { id: it.id, title: it.q, children: it.a }, it.id ?? i)) });
+}
+var LINK = "text-foreground underline decoration-foreground/35 underline-offset-4 transition-colors hover:decoration-foreground";
+function TextLink({
+  href,
+  children,
+  external,
+  className
+}) {
+  const internal = href.startsWith("/") && !href.startsWith("/api/") && !href.startsWith("/.well-known/");
+  const offsite = external ?? /^https?:\/\//.test(href);
+  if (internal && !offsite) {
+    return /* @__PURE__ */ jsx(Link5, { href, className: cn(LINK, className), children });
+  }
+  return /* @__PURE__ */ jsxs("a", { href, className: cn(LINK, className), ...offsite ? { target: "_blank", rel: "noreferrer" } : {}, children: [
+    children,
+    offsite ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: " (opens in a new tab)" }) : null
   ] });
 }
+var PROPER = {
+  kyc: "KYC",
+  pii: "PII",
+  ccpa: "CCPA",
+  cpra: "CPRA",
+  gdpr: "GDPR",
+  uk: "UK",
+  eu: "EU",
+  california: "California",
+  europe: "Europe",
+  united: "United",
+  kingdom: "Kingdom"
+};
+function headingCase(text) {
+  const words = text.replace(/\b[a-z]+\b/g, (w) => PROPER[w] ?? w);
+  if (/^orangecheck\b/.test(words)) return `OrangeCheck${words.slice("orangecheck".length)}`;
+  return words.length === 0 ? words : words[0].toUpperCase() + words.slice(1);
+}
+function sentencesCase(text) {
+  return text.split(/(?<=[.!?])\s+/).map((s) => headingCase(s)).join(" ");
+}
+function openSentence(text) {
+  const first = /^\S+/.exec(text)?.[0] ?? "";
+  if (!/^[a-z][a-z'’-]*,?$/.test(first)) return text;
+  return text[0].toUpperCase() + text.slice(1);
+}
+var INLINE = /(\*\*[^*]+\*\*|`[^`]+`|\[[^\]]+\]\([^)]+\))/g;
+var LINK2 = /^\[([^\]]+)\]\(([^)]+)\)$/;
+function Inline({ text }) {
+  return /* @__PURE__ */ jsx(Fragment, { children: text.split(INLINE).map((part, i) => {
+    if (!part) return null;
+    if (part.startsWith("**") && part.endsWith("**") && part.length > 4) {
+      return /* @__PURE__ */ jsx("strong", { children: /* @__PURE__ */ jsx(Inline, { text: part.slice(2, -2) }) }, i);
+    }
+    if (part.startsWith("`") && part.endsWith("`") && part.length > 2) return /* @__PURE__ */ jsx("code", { children: part.slice(1, -1) }, i);
+    const link = LINK2.exec(part);
+    if (link) {
+      return /* @__PURE__ */ jsx(TextLink, { href: link[2] ?? "", children: link[1] }, i);
+    }
+    return /* @__PURE__ */ jsx(Fragment$1, { children: part }, i);
+  }) });
+}
+function BlockView({ block }) {
+  switch (block.kind) {
+    case "para":
+      return /* @__PURE__ */ jsx(Fragment, { children: block.text.split(/\n{2,}/).map((para, i) => /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(Inline, { text: para }) }, i)) });
+    case "subhead":
+      return /* @__PURE__ */ jsx("h3", { children: /* @__PURE__ */ jsx(Inline, { text: headingCase(block.text) }) });
+    case "bullets":
+      return /* @__PURE__ */ jsx("ul", { children: block.items.map(
+        (item, i) => typeof item === "string" ? /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Inline, { text: item }) }, i) : /* @__PURE__ */ jsxs("li", { children: [
+          /* @__PURE__ */ jsxs("strong", { children: [
+            headingCase(item.k),
+            "."
+          ] }),
+          " ",
+          /* @__PURE__ */ jsx(Inline, { text: openSentence(item.v) })
+        ] }, i)
+      ) });
+    case "callout":
+      return /* @__PURE__ */ jsx("div", { className: "not-prose my-6", children: /* @__PURE__ */ jsx(Notice, { tone: block.emphatic ? "brand" : "neutral", children: /* @__PURE__ */ jsx(Inline, { text: block.text }) }) });
+    case "stub":
+      return /* @__PURE__ */ jsx("div", { className: "not-prose my-6", children: /* @__PURE__ */ jsx(Notice, { tone: "brand", title: "Pending counsel review", children: /* @__PURE__ */ jsx(Inline, { text: block.text }) }) });
+  }
+}
+function LegalDocument({ doc, className }) {
+  return /* @__PURE__ */ jsx(
+    DocLayout,
+    {
+      className,
+      header: /* @__PURE__ */ jsx(
+        DocHeader,
+        {
+          eyebrow: headingCase(doc.eyebrow),
+          title: doc.title,
+          lead: doc.description,
+          meta: `Effective ${doc.effective} \xB7 last updated ${doc.updated}`
+        }
+      ),
+      toc: doc.sections.map((s) => ({ id: s.id, label: headingCase(s.heading) })),
+      children: /* @__PURE__ */ jsx("article", { className: "min-w-0", children: /* @__PURE__ */ jsxs(Prose, { children: [
+        doc.preamble?.map((b, i) => /* @__PURE__ */ jsx(BlockView, { block: b }, i)),
+        doc.sections.map((s) => /* @__PURE__ */ jsxs("section", { children: [
+          /* @__PURE__ */ jsxs("h2", { id: s.id, className: "scroll-mt-24", children: [
+            s.num ? /* @__PURE__ */ jsxs("span", { className: "oca-tabular text-muted-foreground", children: [
+              s.num,
+              " "
+            ] }) : null,
+            headingCase(s.heading)
+          ] }),
+          s.hint ? /* @__PURE__ */ jsx("p", { className: "text-[0.9375rem]", children: headingCase(s.hint) }) : null,
+          s.blocks.map((b, i) => /* @__PURE__ */ jsx(BlockView, { block: b }, i))
+        ] }, s.id)),
+        doc.summary ? /* @__PURE__ */ jsxs("p", { className: "mt-14 border-t border-border pt-6 text-[0.9375rem]", children: [
+          /* @__PURE__ */ jsx("strong", { children: "In short." }),
+          " ",
+          sentencesCase(doc.summary.replace(/^summary:\s*/i, ""))
+        ] }) : null
+      ] }) })
+    }
+  );
+}
+
+// src/family/index.ts
+var OCHK_IO = "https://ochk.io";
+var DOCS_HREF = `${OCHK_IO}/docs`;
+function protocol(slug, verb, line, kinds) {
+  return {
+    slug,
+    label: slug,
+    href: `${OCHK_IO}/${slug}`,
+    group: "protocol",
+    line,
+    status: "live",
+    verb,
+    pageHref: `${OCHK_IO}/${slug}`,
+    toolHref: `https://${slug}.ochk.io`,
+    specHref: `https://github.com/orangecheck/oc-${slug}-protocol`,
+    kinds
+  };
+}
+var PROTOCOLS = [
+  protocol("attest", "identity", "Show that an address holds bitcoin, and for how long.", "30078"),
+  protocol("lock", "confidentiality", "Encrypt to a Bitcoin address, so only its holder can open it.", "30078"),
+  protocol("vote", "legitimacy", "Polls weighed in sats, that anyone can tally.", "30080\u201330082"),
+  protocol("stamp", "provenance", "Prove who signed something, and when.", "30083"),
+  protocol("agent", "authority", "Give software scoped, revocable permission to act for you.", "30083\u201330086"),
+  protocol("pledge", "commitment", "Make a promise with bitcoin behind it, on a public record.", "30078")
+];
+var PROTOCOL_ORDER = PROTOCOLS.map((p) => p.slug);
+var FAMILY = [
+  {
+    slug: "home",
+    label: "ochk.io",
+    href: OCHK_IO,
+    group: "orangecheck",
+    line: "The open protocols, and the company behind them.",
+    status: "live"
+  },
+  {
+    slug: "me",
+    label: "ochk.app",
+    href: "https://ochk.app",
+    group: "orangecheck",
+    line: "One account, with Bitcoin behind it.",
+    status: "testing"
+  },
+  {
+    slug: "docs",
+    label: "docs",
+    href: DOCS_HREF,
+    group: "orangecheck",
+    line: "Specs, SDKs and guides for every protocol.",
+    status: "live"
+  },
+  ...PROTOCOLS,
+  {
+    slug: "vault",
+    label: "vault",
+    href: "https://vault.ochk.io",
+    group: "app",
+    line: "A password manager, encrypted in your browser.",
+    status: "live",
+    protocols: ["lock"]
+  },
+  {
+    slug: "chat",
+    label: "chat",
+    href: "https://chat.ochk.io",
+    group: "app",
+    line: "Messages only the holder of a Bitcoin address can read.",
+    status: "testing",
+    protocols: ["lock"]
+  },
+  {
+    slug: "cosign",
+    label: "cosign",
+    href: "https://cosign.ochk.io",
+    group: "app",
+    line: "Builders find co-founders and backers.",
+    status: "testing",
+    protocols: ["attest"]
+  },
+  {
+    slug: "me-demo",
+    // "demo", not the made-up app's own name, so nobody takes it for ours.
+    label: "demo",
+    href: "https://me-demo.ochk.io",
+    group: "app",
+    line: "Lumen Notes, a made-up app that signs in with orangecheck.",
+    status: "live"
+  },
+  {
+    slug: "globe",
+    label: "globe",
+    href: "https://globe.ochk.io",
+    group: "public-good",
+    line: "The Bitcoin network, live, on a globe.",
+    status: "live"
+  },
+  {
+    slug: "btc",
+    label: "btc",
+    href: "https://btc.ochk.io",
+    group: "public-good",
+    line: "A free desk for reading the Bitcoin market.",
+    status: "live"
+  }
+];
+var FAMILY_GROUPS = [
+  { id: "orangecheck", label: "orangecheck" },
+  { id: "protocol", label: "Protocols" },
+  { id: "app", label: "Apps" },
+  { id: "public-good", label: "Public goods" }
+];
+var BY_SLUG = new Map(FAMILY.map((s) => [s.slug, s]));
+function familySite(slug) {
+  return BY_SLUG.get(slug);
+}
+function protocolSite(slug) {
+  return BY_SLUG.get(slug);
+}
+function familyByGroup() {
+  return FAMILY_GROUPS.map((g) => ({ ...g, sites: FAMILY.filter((s) => s.group === g.id) }));
+}
+var LEGAL_LINKS = [
+  { href: `${OCHK_IO}/privacy`, label: "Privacy" },
+  { href: `${OCHK_IO}/terms`, label: "Terms" },
+  { href: `${OCHK_IO}/security`, label: "Security" },
+  { href: `${OCHK_IO}/trademark`, label: "Trademarks" },
+  { href: `${OCHK_IO}/contact`, label: "Contact" }
+];
+var OCHK_IO_NAV = [
+  {
+    href: `${OCHK_IO}/protocols`,
+    label: "Protocols",
+    children: PROTOCOLS.map((p) => ({ href: p.pageHref, label: p.label, description: p.line }))
+  },
+  { href: `${OCHK_IO}/apps`, label: "Apps" },
+  { href: DOCS_HREF, label: "Docs" },
+  { href: `${OCHK_IO}/trust`, label: "Trust" },
+  { href: `${OCHK_IO}/about`, label: "About" }
+];
+var OCHK_IO_FOOTER = [
+  {
+    heading: "Company",
+    links: [
+      { href: `${OCHK_IO}/about`, label: "About" },
+      { href: `${OCHK_IO}/trust`, label: "Trust" },
+      { href: "https://github.com/orangecheck", label: "GitHub", external: true }
+    ]
+  }
+];
+var CARD = "group relative flex h-full flex-col rounded-[1.25rem] border border-border bg-card p-6 transition-colors hover:border-oca-hairline-strong md:p-7 has-[a:focus-visible]:ring-2 has-[a:focus-visible]:ring-ring has-[a:focus-visible]:ring-offset-2 has-[a:focus-visible]:ring-offset-background";
+var STRETCH = 'outline-none after:absolute after:inset-0 after:rounded-[1.25rem] after:content-[""]';
+var pad2 = (n) => String(n + 1).padStart(2, "0");
+function ProtocolGrid({
+  protocols = PROTOCOL_ORDER,
+  link = "page",
+  className
+}) {
+  return /* @__PURE__ */ jsx("ul", { className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 md:gap-5", className), children: protocols.map((slug) => {
+    const p = protocolSite(slug);
+    const i = PROTOCOL_ORDER.indexOf(slug);
+    return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: cn(CARD, "gap-4"), children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsxs("span", { className: "oca-numeral", children: [
+          pad2(i),
+          " ",
+          /* @__PURE__ */ jsx("span", { className: "ml-1.5 capitalize", children: p.verb })
+        ] }),
+        p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null
+      ] }),
+      /* @__PURE__ */ jsx("h3", { className: "oca-display-3", children: /* @__PURE__ */ jsx("a", { href: link === "tool" ? p.toolHref : p.pageHref, className: STRETCH, children: p.label }) }),
+      /* @__PURE__ */ jsx("p", { className: "oca-body", children: p.line }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-auto flex items-center justify-between gap-3 pt-2 text-[0.875rem] text-muted-foreground", children: [
+        /* @__PURE__ */ jsxs("span", { className: "oca-tabular", children: [
+          "Nostr kind ",
+          p.kinds
+        ] }),
+        /* @__PURE__ */ jsx(
+          ArrowUpRight,
+          {
+            "aria-hidden": true,
+            className: "size-4 transition-transform duration-200 group-hover:-translate-y-0.5 group-hover:translate-x-0.5 group-hover:text-foreground"
+          }
+        )
+      ] })
+    ] }) }, slug);
+  }) });
+}
+function AppCard({ name, line, href, protocols = [], status = "live", className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn(CARD, "gap-3", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+      /* @__PURE__ */ jsx("h3", { className: "oca-title", children: /* @__PURE__ */ jsx("a", { href, className: STRETCH, children: name }) }),
+      status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status }) : null
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "oca-body text-[0.9375rem]", children: line }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-auto flex items-end justify-between gap-3 pt-3", children: [
+      protocols.length > 0 ? /* @__PURE__ */ jsxs("p", { className: "flex flex-wrap items-center gap-1.5 text-[0.8125rem] text-muted-foreground", children: [
+        "Shows",
+        protocols.map((p) => /* @__PURE__ */ jsx(Badge, { tone: "muted", children: p }, p))
+      ] }) : /* @__PURE__ */ jsx("span", {}),
+      /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-1 text-[0.875rem] text-muted-foreground transition-colors group-hover:text-foreground", children: [
+        href.replace(/^https?:\/\//, ""),
+        /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true, className: "size-4" })
+      ] })
+    ] })
+  ] });
+}
+function AppGrid({
+  group = "app",
+  sites,
+  className
+}) {
+  const list = sites ? sites.map((slug) => FAMILY.find((s) => s.slug === slug)).filter((s) => s !== void 0) : FAMILY.filter((s) => s.group === group);
+  return /* @__PURE__ */ jsx("ul", { className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2 md:gap-5", className), children: list.map((s) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(AppCard, { name: s.label, line: s.line, href: s.href, protocols: s.protocols, status: s.status }) }, s.slug)) });
+}
+function ProtocolHero({
+  protocol: protocol2,
+  title,
+  lead,
+  actions,
+  art,
+  children,
+  className
+}) {
+  const p = protocolSite(protocol2);
+  return /* @__PURE__ */ jsx(
+    PageHero,
+    {
+      className,
+      eyebrow: `Protocol \xB7 ${p.verb}`,
+      title,
+      lead,
+      actions,
+      art,
+      children: p.status !== "live" || children ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-4", children: [
+        p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null,
+        children
+      ] }) : null
+    }
+  );
+}
+function ProtocolNav({
+  current: current2,
+  link = "page",
+  className
+}) {
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", className, children: /* @__PURE__ */ jsx(ScrollFade, { fade: "var(--background)", children: /* @__PURE__ */ jsx("ul", { className: "flex w-max min-w-full items-center gap-6 border-b border-border", children: PROTOCOLS.map((p) => {
+    const on = p.slug === current2;
+    return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: link === "tool" ? p.toolHref : p.pageHref,
+        "aria-current": on ? "page" : void 0,
+        className: cn(
+          "-mb-px inline-flex h-11 items-center border-b-2 text-[0.9375rem] transition-colors",
+          on ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
+        ),
+        children: p.label
+      }
+    ) }, p.slug);
+  }) }) }) });
+}
+function SpecCard({
+  protocol: protocol2,
+  version,
+  license,
+  vectors,
+  size = "md",
+  className
+}) {
+  const p = protocolSite(protocol2);
+  const repo = `oc-${p.slug}-protocol`;
+  const facts = [
+    ["Version", version],
+    ...license ? [["Licence", license]] : [],
+    ["Nostr kind", p.kinds],
+    ...vectors !== void 0 ? [["Test vectors", String(vectors)]] : []
+  ];
+  if (size === "sm") {
+    return /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: p.specHref,
+        className: cn(
+          "group flex flex-wrap items-center gap-x-4 gap-y-1 rounded-2xl border border-border bg-card px-4 py-3 text-[0.875rem] transition-colors hover:border-oca-hairline-strong",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "font-mono text-[0.8125rem] text-foreground", children: repo }),
+          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: facts.map(([k, v]) => k === "Version" ? `v${v}` : k === "Nostr kind" ? `kind ${v}` : v).join(" \xB7 ") }),
+          /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1 text-muted-foreground group-hover:text-foreground", children: [
+            "Read the spec ",
+            /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true, className: "size-4" })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-6 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-[0.875rem] text-muted-foreground", children: "The spec" }),
+        /* @__PURE__ */ jsx("h3", { className: "oca-title break-all font-mono text-[1.0625rem] tracking-normal", children: repo })
+      ] }),
+      p.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: p.status }) : null
+    ] }),
+    /* @__PURE__ */ jsx("dl", { className: "grid grid-cols-2 gap-x-6 gap-y-4 sm:grid-cols-4", children: facts.map(([k, v]) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsx("dt", { className: "text-[0.8125rem] text-muted-foreground", children: k }),
+      /* @__PURE__ */ jsx("dd", { className: "oca-tabular text-[1.0625rem]", children: v })
+    ] }, k)) }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { asChild: true, variant: "secondary", size: "sm", children: /* @__PURE__ */ jsxs("a", { href: p.specHref, children: [
+      "Read the spec ",
+      /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": true })
+    ] }) }) })
+  ] });
+}
+function VerifyBox({
+  action,
+  param = "q",
+  title,
+  description,
+  label = "Id, envelope or link",
+  placeholder,
+  hint,
+  submitLabel = "Verify",
+  multiline = false,
+  onVerify,
+  className
+}) {
+  const [value, setValue] = useState("");
+  const submit = (e) => {
+    if (!onVerify) return;
+    e.preventDefault();
+    if (value.trim()) onVerify(value.trim());
+  };
+  const button = /* @__PURE__ */ jsx(Button, { type: "submit", className: multiline ? void 0 : "w-full sm:w-auto", children: submitLabel });
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      action,
+      method: "get",
+      onSubmit: submit,
+      className: cn("flex flex-col gap-5 rounded-[1.25rem] border border-border bg-card p-6 md:p-8", className),
+      children: [
+        title || description ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+          title ? /* @__PURE__ */ jsx("h3", { className: "oca-title", children: title }) : null,
+          description ? /* @__PURE__ */ jsx("p", { className: "oca-body text-[0.9375rem]", children: description }) : null
+        ] }) : null,
+        multiline ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Field, { label, hint, children: /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              name: param,
+              required: true,
+              value,
+              onChange: (e) => setValue(e.target.value),
+              placeholder,
+              spellCheck: false,
+              className: "min-h-32 font-mono text-base md:text-[0.8125rem]"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { children: button })
+        ] }) : /* @__PURE__ */ jsx(Field, { label, hint, action: button, children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            name: param,
+            required: true,
+            value,
+            onChange: (e) => setValue(e.target.value),
+            placeholder,
+            spellCheck: false,
+            autoComplete: "off",
+            className: "font-mono text-base md:text-[0.875rem]"
+          }
+        ) })
+      ]
+    }
+  );
+}
+var TINT = "bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--card))]";
+function ComparisonTable({
+  columns,
+  rows,
+  label,
+  propertyHeading = "Property",
+  className
+}) {
+  const wide = columns.length > 3;
+  const grid = wide ? "lg:grid lg:grid-cols-[var(--oca-compare)]" : "md:grid md:grid-cols-[var(--oca-compare)]";
+  const desk = wide ? "lg" : "md";
+  const style = {
+    // The argued-for column gets a little more room: its answers carry the page.
+    "--oca-compare": ["minmax(0, 1.4fr)", ...columns.map((c) => c.highlight ? "minmax(0, 1.3fr)" : "minmax(0, 1fr)")].join(" ")
+  };
+  const ordered = [...columns].sort((a, b) => Number(Boolean(b.highlight)) - Number(Boolean(a.highlight)));
+  return /* @__PURE__ */ jsxs("ul", { "aria-label": label, style, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: [
+    /* @__PURE__ */ jsxs(
+      "li",
+      {
+        "aria-hidden": true,
+        className: cn(
+          "hidden gap-5 px-5 py-4 text-[0.875rem] font-medium text-muted-foreground",
+          wide ? "lg:grid lg:px-8" : "md:grid md:px-8",
+          grid
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { children: propertyHeading }),
+          columns.map((c) => /* @__PURE__ */ jsx("span", { className: cn(c.highlight && cn(TINT, "-my-4 px-4 py-4 text-oca-accent-ink")), children: c.label }, c.key))
+        ]
+      }
+    ),
+    rows.map((r, ri) => /* @__PURE__ */ jsxs("li", { className: cn("grid grid-cols-1 gap-3 px-5 py-5", wide ? "lg:items-start lg:gap-5 lg:px-8" : "md:items-start md:gap-5 md:px-8", grid), children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
+        /* @__PURE__ */ jsx("span", { className: "oca-title-sm", children: r.label }),
+        r.note ? /* @__PURE__ */ jsx("span", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: r.note }) : null
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-2 gap-1", desk === "lg" ? "lg:contents" : "md:contents"), children: columns.map((c) => {
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: { "--oca-order": ordered.indexOf(c) },
+            className: cn(
+              // Two rows of the pair's grid (name, answer), so answers line up
+              // across a pair even when one name wraps.
+              "order-[var(--oca-order)] row-span-2 grid min-w-0 grid-rows-subgrid gap-1 rounded-xl px-3 py-2.5",
+              desk === "lg" ? "lg:order-none lg:row-span-1 lg:flex lg:flex-col" : "md:order-none md:row-span-1 md:flex md:flex-col",
+              c.highlight ? cn(
+                TINT,
+                "col-span-2",
+                desk === "lg" ? "lg:col-span-1 lg:-my-5 lg:self-stretch lg:rounded-none lg:px-4 lg:py-5" : "md:col-span-1 md:-my-5 md:self-stretch md:rounded-none md:px-4 md:py-5"
+              ) : desk === "lg" ? "lg:p-0" : "md:p-0"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "text-[0.8125rem]",
+                    c.highlight ? "text-oca-accent-ink" : "text-muted-foreground",
+                    desk === "lg" ? "lg:sr-only" : "md:sr-only"
+                  ),
+                  children: c.label
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: cn("text-[0.9375rem]", c.highlight && "font-medium"), children: r.values[c.key] ?? "\u2014" })
+            ]
+          },
+          c.key
+        );
+      }) })
+    ] }, ri))
+  ] });
+}
+var CHECK = {
+  ok: { word: "Passed", icon: /* @__PURE__ */ jsx(CircleCheck, {}), tone: "text-success" },
+  fail: { word: "Failed", icon: /* @__PURE__ */ jsx(CircleX, {}), tone: "text-destructive" },
+  pending: { word: "Pending", icon: /* @__PURE__ */ jsx(Clock, {}), tone: "text-oca-accent-ink" },
+  skipped: { word: "Skipped", icon: /* @__PURE__ */ jsx(CircleMinus, {}), tone: "text-muted-foreground" },
+  unchecked: { word: "Not checked", icon: /* @__PURE__ */ jsx(CircleDashed, {}), tone: "text-oca-subtle" }
+};
+function VerifyReport({
+  verdict,
+  title,
+  summary,
+  checks,
+  facts,
+  notChecked,
+  actions,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-label": "Verification result",
+      className: cn("overflow-hidden rounded-[1.25rem] border border-border bg-card", className),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex flex-col items-start gap-3 p-6 md:p-8", children: [
+          /* @__PURE__ */ jsx(StatusBadge, { status: verdict }),
+          /* @__PURE__ */ jsx("h3", { className: "oca-display-3", children: title }),
+          summary ? /* @__PURE__ */ jsx("p", { className: "oca-body max-w-[40rem]", children: summary }) : null
+        ] }),
+        /* @__PURE__ */ jsx("ul", { "aria-label": "Checks", className: "divide-y divide-border border-t border-border", children: checks.map((c, i) => {
+          const k = CHECK[c.state];
+          return /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-3 px-6 py-3.5 md:px-8", children: [
+            /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: cn("mt-0.5 shrink-0 [&_svg]:size-[1.125rem]", k.tone), children: k.icon }),
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5 sm:flex-row sm:items-baseline sm:justify-between sm:gap-6", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem]", children: c.label }),
+                c.note ? /* @__PURE__ */ jsx("span", { className: "break-words text-[0.8125rem] leading-snug text-muted-foreground", children: c.note }) : null
+              ] }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "shrink-0 text-[0.8125rem]",
+                    c.state === "fail" ? "text-destructive" : "text-muted-foreground"
+                  ),
+                  children: k.word
+                }
+              )
+            ] })
+          ] }, i);
+        }) }),
+        facts && facts.length > 0 ? /* @__PURE__ */ jsx(KeyValueList, { items: facts, className: "rounded-none border-x-0 border-b-0 bg-transparent [&>div]:px-6 md:[&>div]:px-8" }) : null,
+        notChecked && notChecked.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-t border-border bg-muted/50 px-6 py-5 md:px-8", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-[0.875rem] font-medium", children: "What this did not check" }),
+          /* @__PURE__ */ jsx("ul", { className: "flex list-disc flex-col gap-1 pl-5 text-[0.875rem] leading-relaxed text-muted-foreground", children: notChecked.map((n, i) => /* @__PURE__ */ jsx("li", { children: n }, i)) })
+        ] }) : null,
+        actions ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3 border-t border-border px-6 py-5 md:px-8", children: actions }) : null
+      ]
+    }
+  );
+}
+function SignMessage({
+  lead,
+  address,
+  message,
+  wallets,
+  busy = false,
+  error,
+  submitLabel = "Confirm",
+  secondary,
+  onSignature,
+  className
+}) {
+  const [pasted, setPasted] = useState("");
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-5", className), children: [
+    lead ? /* @__PURE__ */ jsx("p", { className: "text-[0.9375rem] leading-relaxed", children: lead }) : null,
+    wallets ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: wallets }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 text-[0.8125rem] text-muted-foreground", children: [
+        /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-border" }),
+        "or sign it in any wallet",
+        /* @__PURE__ */ jsx("span", { className: "h-px flex-1 bg-border" })
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsx(CodeBlock, { code: message, caption: "Message to sign" }),
+    /* @__PURE__ */ jsxs(
+      "form",
+      {
+        className: "flex flex-col gap-4",
+        onSubmit: (e) => {
+          e.preventDefault();
+          if (pasted.trim()) onSignature(pasted.trim());
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            Field,
+            {
+              label: "Signature",
+              error,
+              hint: /* @__PURE__ */ jsxs(Fragment, { children: [
+                "From your wallet\u2019s \u201Csign message\u201D (BIP-322), signed by",
+                " ",
+                /* @__PURE__ */ jsx("span", { className: "break-all font-mono", children: address }),
+                "."
+              ] }),
+              children: /* @__PURE__ */ jsx(
+                Textarea,
+                {
+                  value: pasted,
+                  onChange: (e) => setPasted(e.target.value),
+                  rows: 3,
+                  spellCheck: false,
+                  className: "min-h-24 font-mono text-base md:text-[0.8125rem]"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+            /* @__PURE__ */ jsx(Button, { type: "submit", loading: busy, disabled: !pasted.trim(), children: submitLabel }),
+            secondary
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function SiteRow({ site, here, onNavigate }) {
+  return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href: site.href,
+      onClick: onNavigate,
+      "aria-current": here ? "page" : void 0,
+      className: cn(
+        "flex flex-col gap-0.5 rounded-xl px-3 py-2 transition-colors hover:bg-accent",
+        here && "bg-muted hover:bg-muted dark:bg-white/[0.06]"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 text-[0.9375rem] font-medium leading-6", children: [
+          site.label,
+          site.status !== "live" ? /* @__PURE__ */ jsx(StatusBadge, { status: site.status }) : null,
+          here ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: "(this site)" }) : null
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-[0.8125rem] leading-snug text-muted-foreground", children: site.line })
+      ]
+    }
+  ) });
+}
+var PLACE = {
+  orangecheck: "sm:col-start-1 sm:row-start-1 lg:row-span-2",
+  protocol: "sm:col-start-1 sm:row-start-2 lg:col-start-2 lg:row-start-1 lg:row-span-2",
+  app: "sm:col-start-2 sm:row-start-1 lg:col-start-3",
+  "public-good": "sm:col-start-2 sm:row-start-2 lg:col-start-3"
+};
+function FamilyList({
+  current: current2,
+  onNavigate,
+  stack = false,
+  className
+}) {
+  const id = useId();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "grid grid-cols-1 gap-x-2 gap-y-4",
+        // The second desk row takes the slack, so the public goods sit right under the apps.
+        !stack && "sm:grid-cols-2 lg:grid-cols-3 lg:grid-rows-[auto_1fr]",
+        className
+      ),
+      children: familyByGroup().map((g) => /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1", !stack && PLACE[g.id]), children: [
+        /* @__PURE__ */ jsx("p", { id: `${id}-${g.id}`, className: "px-3 pt-1 text-[0.8125rem] text-muted-foreground", children: g.label }),
+        /* @__PURE__ */ jsx("ul", { "aria-labelledby": `${id}-${g.id}`, className: "flex flex-col", children: g.sites.map((s) => /* @__PURE__ */ jsx(SiteRow, { site: s, here: s.slug === current2, onNavigate }, s.slug)) })
+      ] }, g.id))
+    }
+  );
+}
+function FamilyMenu({ current: current2, className }) {
+  const [open, setOpen] = useState(false);
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(
+      PopoverTrigger,
+      {
+        "aria-label": "All orangecheck sites",
+        className: cn(
+          "group inline-flex size-8 shrink-0 items-center justify-center rounded-full text-muted-foreground transition-colors",
+          "hover:bg-accent hover:text-foreground data-[state=open]:bg-accent data-[state=open]:text-foreground",
+          className
+        ),
+        children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 transition-transform duration-200 group-data-[state=open]:rotate-180" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      PopoverContent,
+      {
+        align: "start",
+        sideOffset: 14,
+        collisionPadding: 16,
+        className: "max-h-[min(40rem,var(--radix-popover-content-available-height))] w-[min(calc(100vw-2rem),42rem)] overflow-y-auto p-3 lg:w-[min(calc(100vw-2rem),56rem)]",
+        children: /* @__PURE__ */ jsx(FamilyList, { current: current2, onNavigate: () => setOpen(false) })
+      }
+    )
+  ] });
+}
+function NavLink({ item, className, onNavigate }) {
+  const cls = cn(
+    "rounded-full px-3 py-2 text-[0.9375rem] transition-colors",
+    item.active ? "text-foreground" : "text-muted-foreground hover:text-foreground",
+    className
+  );
+  if (item.external) {
+    return /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: item.label });
+  }
+  return /* @__PURE__ */ jsx(Link5, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: item.label });
+}
+function NavRow({ item, onNavigate }) {
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[0.9375rem] font-medium leading-6 text-foreground", children: item.label }),
+    item.description ? /* @__PURE__ */ jsx("span", { className: "text-[0.8125rem] leading-snug text-muted-foreground", children: item.description }) : null
+  ] });
+  const cls = cn(
+    "flex flex-col gap-0.5 rounded-xl px-3 py-2 transition-colors hover:bg-accent",
+    item.active && "bg-muted hover:bg-muted dark:bg-white/[0.06]"
+  );
+  return item.external ? /* @__PURE__ */ jsx("a", { href: item.href, className: cls, rel: "noreferrer", onClick: onNavigate, children: body }) : /* @__PURE__ */ jsx(Link5, { href: item.href, className: cls, "aria-current": item.active ? "page" : void 0, onClick: onNavigate, children: body });
+}
+var seeAll = (item) => typeof item.label === "string" ? `All ${item.label.toLowerCase()}` : "See all";
+function NavDropdown({ item }) {
+  const [open, setOpen] = useState(false);
+  const active = item.active || item.children?.some((c) => c.active);
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxs(
+      PopoverTrigger,
+      {
+        className: cn(
+          "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors",
+          active ? "text-foreground" : "text-muted-foreground hover:text-foreground data-[state=open]:text-foreground"
+        ),
+        children: [
+          item.label,
+          /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-3.5 transition-transform duration-200 group-data-[state=open]:rotate-180" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(PopoverContent, { align: "center", sideOffset: 10, className: "w-[min(calc(100vw-2rem),26rem)] p-2", children: [
+      /* @__PURE__ */ jsx("ul", { className: "flex flex-col", children: item.children?.map((c) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(NavRow, { item: c, onNavigate: () => setOpen(false) }) }, c.href)) }),
+      /* @__PURE__ */ jsx("div", { className: "mt-1.5 border-t border-border px-1 pt-1.5", children: /* @__PURE__ */ jsx(
+        NavLink,
+        {
+          item: { ...item, label: seeAll(item), children: void 0 },
+          className: "block rounded-xl px-2 py-2 text-[0.875rem]",
+          onNavigate: () => setOpen(false)
+        }
+      ) })
+    ] })
+  ] });
+}
+function SiteHeader({
+  home = "/",
+  brand,
+  product,
+  family,
+  nav = [],
+  search,
+  actions,
+  variant = "site",
+  className
+}) {
+  const [open, setOpen] = useState(false);
+  const tool = variant === "tool";
+  const size = tool ? 24 : 28;
+  const current2 = typeof family === "string" ? family : void 0;
+  const menu = nav.length > 0 || Boolean(family);
+  const brandNode = brand ?? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center", children: [
+    /* @__PURE__ */ jsx(Lockup, { size }),
+    product ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "mx-3 h-5 w-px bg-oca-hairline-strong" }),
+      /* @__PURE__ */ jsx("span", { className: "font-medium tracking-[-0.01em]", style: { fontSize: size * 0.56 }, children: product })
+    ] }) : null
+  ] });
+  const navigation = nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map((n) => n.children?.length ? /* @__PURE__ */ jsx(NavDropdown, { item: n }, n.href) : /* @__PURE__ */ jsx(NavLink, { item: n }, n.href)) }) : null;
+  return /* @__PURE__ */ jsx(
+    "header",
+    {
+      className: cn(
+        "sticky top-0 z-40 w-full border-b bg-background/95 backdrop-blur-md supports-[backdrop-filter]:bg-background/90",
+        tool ? "border-border" : "border-transparent",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex items-center justify-between gap-4",
+            tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem]",
+            // Three columns, the outer two each at least their content: the
+            // navigation stays centred whatever the actions hold, so it does
+            // not shift when they change (signed out to signed in).
+            !tool && nav.length > 0 && "md:grid md:grid-cols-[minmax(max-content,1fr)_auto_minmax(max-content,1fr)]"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center gap-1", tool ? "md:gap-1" : "justify-self-start"), children: [
+              /* @__PURE__ */ jsxs(Link5, { href: home, className: "-ml-1 min-w-0 rounded-lg p-1", children: [
+                brandNode,
+                /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
+              ] }),
+              family ? /* @__PURE__ */ jsx(FamilyMenu, { current: current2, className: "max-md:hidden" }) : null,
+              tool && navigation ? /* @__PURE__ */ jsx("div", { className: "ml-5", children: navigation }) : null
+            ] }),
+            !tool ? navigation : null,
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 justify-self-end", children: [
+              search,
+              actions,
+              menu ? /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
+                /* @__PURE__ */ jsx(
+                  SheetTrigger,
+                  {
+                    className: "inline-flex size-10 items-center justify-center rounded-full text-foreground hover:bg-accent md:hidden",
+                    "aria-label": "Open menu",
+                    children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
+                  }
+                ),
+                /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "pt-16", children: [
+                  /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Menu" }),
+                  nav.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Main", className: "flex flex-col", children: nav.map(
+                    (n) => n.children?.length ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col py-2", children: [
+                      /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: n.label }),
+                      n.children.map((c) => /* @__PURE__ */ jsx(
+                        NavLink,
+                        {
+                          item: c,
+                          className: "rounded-xl px-3 py-2.5 text-[1.0625rem]",
+                          onNavigate: () => setOpen(false)
+                        },
+                        c.href
+                      ))
+                    ] }, n.href) : /* @__PURE__ */ jsx(
+                      NavLink,
+                      {
+                        item: n,
+                        className: "rounded-xl px-3 py-3 text-[1.0625rem]",
+                        onNavigate: () => setOpen(false)
+                      },
+                      n.href
+                    )
+                  ) }) : null,
+                  family ? /* @__PURE__ */ jsxs("details", { className: cn("group", nav.length > 0 && "mt-2 border-t border-border pt-4"), children: [
+                    /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer list-none items-center justify-between rounded-xl px-3 py-2.5 text-[1.0625rem] [&::-webkit-details-marker]:hidden", children: [
+                      "All orangecheck sites",
+                      /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-open:rotate-180" })
+                    ] }),
+                    /* @__PURE__ */ jsx(FamilyList, { current: current2, onNavigate: () => setOpen(false), stack: true, className: "mt-2" })
+                  ] }) : null
+                ] })
+              ] }) : null
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+function SkipLink({ href = "#main-content", children = "Skip to content" }) {
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href,
+      className: "sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-3 focus:z-50 focus:rounded-full focus:border focus:border-border focus:bg-card focus:px-4 focus:py-2 focus:text-[0.9375rem] focus:font-medium focus:text-foreground focus:shadow-md",
+      children
+    }
+  );
+}
+var BANNER_TONE = {
+  neutral: "border-border bg-muted",
+  brand: "border-[color-mix(in_oklab,var(--oca-orange)_30%,var(--border))] bg-[color-mix(in_oklab,var(--oca-orange)_9%,var(--background))]",
+  danger: "border-[color-mix(in_oklab,var(--destructive)_35%,var(--border))] bg-[color-mix(in_oklab,var(--destructive)_8%,var(--background))]"
+};
+function SiteBanner({
+  tone = "neutral",
+  children,
+  action,
+  className
+}) {
+  return /* @__PURE__ */ jsx("div", { role: "status", "aria-live": "polite", "data-tone": tone, className: cn("border-b text-[0.875rem]", BANNER_TONE[tone], className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-wrap items-center justify-between gap-x-4 gap-y-1 py-2.5", children: [
+    /* @__PURE__ */ jsxs("p", { className: "flex min-w-0 items-baseline gap-2.5 leading-snug", children: [
+      tone !== "neutral" ? /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "size-2 shrink-0 translate-y-[-0.05em] rounded-full",
+            tone === "brand" ? "bg-oca-orange" : "bg-destructive"
+          )
+        }
+      ) : null,
+      /* @__PURE__ */ jsx("span", { children })
+    ] }),
+    action ? /* @__PURE__ */ jsx("div", { className: cn("shrink-0 font-medium", tone !== "neutral" && "max-sm:pl-[1.125rem]"), children: action }) : null
+  ] }) });
+}
+var FOOT_LINK = "inline-flex min-h-11 items-center transition-colors hover:text-foreground md:min-h-0";
+function LegalRow() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:items-center sm:justify-between", children: [
+    /* @__PURE__ */ jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5", children: LEGAL_LINKS.map((l) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
+    /* @__PURE__ */ jsxs("p", { children: [
+      "\xA9 ",
+      (/* @__PURE__ */ new Date()).getFullYear(),
+      " OrangeCheck"
+    ] })
+  ] });
+}
+function SiteFooter({
+  columns = [],
+  family = false,
+  legal = false,
+  compact = false,
+  fineprint,
+  meta,
+  signature = true,
+  className
+}) {
+  if (compact) {
+    return /* @__PURE__ */ jsx("footer", { className: cn("border-t border-border bg-background text-[0.875rem] text-muted-foreground", className), children: /* @__PURE__ */ jsxs("div", { className: "oca-container flex flex-col gap-x-8 gap-y-3 py-5 lg:flex-row lg:items-center lg:justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1", children: [
+        /* @__PURE__ */ jsx("a", { href: OCHK_IO, className: "rounded-lg text-foreground", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
+        family ? /* @__PURE__ */ jsx("nav", { "aria-label": "Protocols", children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-4", children: PROTOCOLS.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("a", { href: p.pageHref, className: FOOT_LINK, children: p.label }) }, p.slug)) }) }) : null
+      ] }),
+      legal || meta ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
+        legal ? /* @__PURE__ */ jsx(LegalRow, {}) : null,
+        meta
+      ] }) : null
+    ] }) });
+  }
+  const cols = [
+    ...columns,
+    ...family ? familyByGroup().map((g) => ({
+      // The lockup above already says orangecheck.
+      heading: g.id === "orangecheck" ? "Start here" : g.label,
+      links: g.sites.map((s) => ({ href: s.href, label: s.label, external: true }))
+    })) : []
+  ];
+  const n = cols.length;
+  const inline = n <= 5;
+  const grid = {
+    "--oca-footer-md": `repeat(${Math.max(1, Math.min(n, 4))}, minmax(0, 1fr))`,
+    "--oca-footer-lg": inline ? `minmax(0, 1.3fr) repeat(${Math.max(1, n)}, minmax(0, 1fr))` : `repeat(${Math.min(n, 6)}, minmax(0, 1fr))`
+  };
+  return /* @__PURE__ */ jsxs("footer", { className: cn("border-t border-border bg-background", className), children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: grid,
+        className: "oca-container grid grid-cols-2 gap-x-6 gap-y-10 py-14 md:grid-cols-[var(--oca-footer-md)] md:py-16 lg:grid-cols-[var(--oca-footer-lg)]",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: cn("col-span-full flex flex-col gap-4", inline && "lg:col-span-1"), children: [
+            /* @__PURE__ */ jsx(Lockup, { size: 26 }),
+            fineprint ? /* @__PURE__ */ jsx("p", { className: "max-w-xs text-[0.9375rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
+          ] }),
+          cols.map((col, i) => {
+            const spans = n % 2 === 1 && i === n - 1;
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn("flex min-w-0 flex-col gap-1", spans && "col-span-2 md:col-span-1"),
+                children: [
+                  /* @__PURE__ */ jsx("p", { className: "mb-2 text-[0.875rem] font-medium", children: col.heading }),
+                  /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1", spans && "grid grid-cols-2 gap-x-6 md:flex md:flex-col"), children: col.links.map((l) => /* @__PURE__ */ jsx(
+                    NavLink,
+                    {
+                      item: l,
+                      className: "-mx-3 py-2.5 text-[0.9375rem] md:py-1.5"
+                    },
+                    l.href
+                  )) })
+                ]
+              },
+              col.heading
+            );
+          })
+        ]
+      }
+    ),
+    signature ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "oca-container select-none overflow-hidden pb-8 md:pb-12", children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-[0.18em] text-[clamp(3rem,11.5vw,10rem)] leading-[0.78] tracking-[-0.065em] [font-family:var(--oc-font-display)]", children: [
+      /* @__PURE__ */ jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsx(Mark, { className: "block h-auto w-full" }) }),
+      /* @__PURE__ */ jsx("span", { children: "orangecheck" })
+    ] }) }) : null,
+    legal || meta ? /* @__PURE__ */ jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
+      legal ? /* @__PURE__ */ jsx(LegalRow, {}) : null,
+      meta
+    ] }) }) : null
+  ] });
+}
+function SignInFrame({
+  title = "Sign in",
+  lead,
+  children,
+  error,
+  fineprint,
+  brand,
+  home = "/",
+  back,
+  art,
+  caption,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "main",
+    {
+      id: "main-content",
+      className: cn("grid min-h-dvh grid-cols-1 bg-background text-foreground lg:grid-cols-2", className),
+      children: [
+        /* @__PURE__ */ jsxs("section", { className: "flex flex-col px-4 pb-8 pt-5 sm:px-8 lg:px-14 lg:pt-8", children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-4", children: [
+            /* @__PURE__ */ jsxs(Link5, { href: home, className: "w-fit rounded-lg", children: [
+              brand ?? /* @__PURE__ */ jsx(Lockup, { size: 28 }),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: " home" })
+            ] }),
+            back === void 0 ? /* @__PURE__ */ jsx(
+              Link5,
+              {
+                href: home,
+                className: "text-[0.9375rem] text-muted-foreground underline-offset-4 hover:text-foreground hover:underline",
+                children: "Back to home"
+              }
+            ) : back
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[25rem] flex-1 flex-col justify-center gap-9 py-12", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+              /* @__PURE__ */ jsx("h1", { className: "oca-display-2", children: title }),
+              lead ? /* @__PURE__ */ jsx("p", { className: "oca-lead", children: lead }) : null
+            ] }),
+            /* @__PURE__ */ jsx("div", { children }),
+            error ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[0.9375rem] text-destructive", children: error }) : null,
+            fineprint ? /* @__PURE__ */ jsx("p", { className: "text-[0.8125rem] leading-relaxed text-muted-foreground", children: fineprint }) : null
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "aside",
+          {
+            "aria-hidden": true,
+            className: "relative hidden flex-col justify-between gap-10 overflow-hidden border-l border-[var(--oca-band-line)] bg-oca-ink p-14 text-oca-ink-foreground lg:flex",
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center", children: art ?? /* @__PURE__ */ jsx(IsoCheck, { size: 340, settle: true, tilt: true, className: "max-w-full" }) }),
+              caption ? /* @__PURE__ */ jsx("div", { className: "flex max-w-[24rem] flex-col gap-3", children: caption }) : null
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
 function SideNav({ groups, onNavigate }) {
   return /* @__PURE__ */ jsx("nav", { "aria-label": "Pages", className: "flex flex-col gap-5", children: groups.map((g, gi) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
     g.label ? /* @__PURE__ */ jsx("p", { className: "px-3 pb-1 text-[0.8125rem] text-muted-foreground", children: g.label }) : null,
     g.items.map((it) => /* @__PURE__ */ jsxs(
-      Link2,
+      Link5,
       {
         href: it.href,
         onClick: onNavigate,
@@ -2554,7 +3995,7 @@ function SideNav({ groups, onNavigate }) {
 }
 function SectionSwitch({
   sections,
-  current,
+  current: current2,
   onNavigate
 }) {
   const cols = sections.length <= 3 ? sections.length : 2;
@@ -2565,9 +4006,9 @@ function SectionSwitch({
       className: cn("grid gap-1 bg-muted p-1", cols === sections.length ? "rounded-full" : "rounded-[1.25rem]"),
       style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
       children: sections.map((sec) => {
-        const on = sec.id === current.id;
+        const on = sec.id === current2.id;
         return /* @__PURE__ */ jsx(
-          Link2,
+          Link5,
           {
             href: sec.href,
             onClick: onNavigate,
@@ -2597,7 +4038,7 @@ function TabBar({ items }) {
           className: "mx-auto grid h-14 max-w-[32rem] px-1.5",
           style: { gridTemplateColumns: `repeat(${items.length}, minmax(0, 1fr))` },
           children: items.map((it) => /* @__PURE__ */ jsxs(
-            Link2,
+            Link5,
             {
               href: it.href,
               "aria-current": it.active ? "page" : void 0,
@@ -2662,19 +4103,19 @@ function AppShell({
   className
 }) {
   const [open, setOpen] = useState(false);
-  const current = sections && sections.length > 0 ? sections.find((sec) => sec.id === activeSection) ?? sections.find((sec) => activeItem(sec.groups)) ?? sections[0] : void 0;
-  const groups = current ? [...current.groups, ...persistent] : [...nav ?? [], ...persistent];
+  const current2 = sections && sections.length > 0 ? sections.find((sec) => sec.id === activeSection) ?? sections.find((sec) => activeItem(sec.groups)) ?? sections[0] : void 0;
+  const groups = current2 ? [...current2.groups, ...persistent] : [...nav ?? [], ...persistent];
   warnDuplicateLabels(groups);
-  const tabs = current ? null : tabsFor(groups);
+  const tabs = current2 ? null : tabsFor(groups);
   const page = activeItem(groups);
   const place = useMemo(
     () => ({
-      section: current ? current.title ?? current.label : void 0,
+      section: current2 ? current2.title ?? current2.label : void 0,
       page: pageOverride ?? page?.label
     }),
-    [current, page?.label, pageOverride]
+    [current2, page?.label, pageOverride]
   );
-  const switcher = sections && current && sections.length > 1 ? /* @__PURE__ */ jsx(SectionSwitch, { sections, current, onNavigate: () => setOpen(false) }) : null;
+  const switcher = sections && current2 && sections.length > 1 ? /* @__PURE__ */ jsx(SectionSwitch, { sections, current: current2, onNavigate: () => setOpen(false) }) : null;
   return /* @__PURE__ */ jsx(ShellContext.Provider, { value: place, children: /* @__PURE__ */ jsxs(
     "div",
     {
@@ -2706,7 +4147,7 @@ function AppShell({
                 footer ? /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer }) : null
               ] })
             ] }),
-            /* @__PURE__ */ jsx(Link2, { href: home, "aria-label": "Home", className: "rounded-lg p-1", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
+            /* @__PURE__ */ jsx(Link5, { href: home, "aria-label": "Home", className: "rounded-lg p-1", children: /* @__PURE__ */ jsx(Lockup, { size: 22 }) }),
             /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center", children: account })
           ] }),
           place.page ? /* @__PURE__ */ jsxs(
@@ -2729,7 +4170,7 @@ function AppShell({
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[90rem]", children: [
           /* @__PURE__ */ jsxs("aside", { className: "sticky top-0 hidden h-dvh w-[17rem] shrink-0 flex-col gap-6 overflow-y-auto px-4 py-6 lg:flex", children: [
-            /* @__PURE__ */ jsx(Link2, { href: home, className: "px-2", "aria-label": "Home", children: /* @__PURE__ */ jsx(Lockup, { size: 26 }) }),
+            /* @__PURE__ */ jsx(Link5, { href: home, className: "px-2", "aria-label": "Home", children: /* @__PURE__ */ jsx(Lockup, { size: 26 }) }),
             switcher,
             /* @__PURE__ */ jsx(SideNav, { groups }),
             /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-3", children: footer })
@@ -2774,7 +4215,7 @@ function AccountMenu({
       ] }),
       /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
       items.map(
-        (it, i) => it === "separator" ? /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, `sep-${i}`) : it.href ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, destructive: it.destructive, children: /* @__PURE__ */ jsxs(Link2, { href: it.href, children: [
+        (it, i) => it === "separator" ? /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, `sep-${i}`) : it.href ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, destructive: it.destructive, children: /* @__PURE__ */ jsxs(Link5, { href: it.href, children: [
           it.icon,
           it.label
         ] }) }, it.label) : /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: it.onSelect, destructive: it.destructive, children: [
@@ -2789,16 +4230,16 @@ function ThemeToggle({ className }) {
   const { theme, setTheme } = useTheme();
   const [mounted, setMounted] = useState(false);
   useEffect(() => setMounted(true), []);
-  const current = mounted ? theme ?? "system" : "system";
-  const next = current === "light" ? "dark" : current === "dark" ? "system" : "light";
-  const Icon2 = current === "light" ? Sun : current === "dark" ? Moon : SunMoon;
+  const current2 = mounted ? theme ?? "system" : "system";
+  const next = current2 === "light" ? "dark" : current2 === "dark" ? "system" : "light";
+  const Icon2 = current2 === "light" ? Sun : current2 === "dark" ? Moon : SunMoon;
   return /* @__PURE__ */ jsx(
     "button",
     {
       type: "button",
       onClick: () => setTheme(next),
-      "aria-label": `Theme: ${current}. Switch to ${next}`,
-      title: `Theme: ${current}`,
+      "aria-label": `Theme: ${current2}. Switch to ${next}`,
+      title: `Theme: ${current2}`,
       className: cn(
         "inline-flex size-10 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
         className
@@ -2808,6 +4249,6 @@ function ThemeToggle({ className }) {
   );
 }
 
-export { APP_ATTRIBUTE, APP_ID, Accent, AccountMenu, ActivityList, AppIcon, AppShell, Badge, BrowserFrame, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardNumeral, CardTitle, Checkbox, CodeBlock, Container, CopyButton, Crowd, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Display, DocHeader, DocLayout, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EmptyLine, EmptyState, ErrorBoundary, Eyebrow, Field, FloatChip, Footnote, HalftoneCanvas, HalftoneSphere, HashChip, Input, IsoCheck, Kbd, KeyValueList, Label, Lead, LoadingBlock, Lockup, MARK_FACES, Mark, Monogram, Notice, PackageCard, PageHeader, PageHero, PhoneFrame, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProgressSteps, Prose, RadioGroup, RadioGroupItem, Reveal, SPHERE_GRADIENT, Sats, SatsFigure, ScrollFade, ScrollStory, Section, SectionIntro, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetTitle, SheetTrigger, ShellContext, SiteFooter, SiteHeader, Skeleton, Spinner, SplitBar, StatCard, StatGrid, StatusDot, StatusPill, StepGrid, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, Ticker, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TruthTable, UsdApprox, appColors, appFonts, badgeVariants, buttonVariants, cardVariants, cn, monogramGround, monogramLetter, portraitTone, satsText, sectionVariants, useCopy, useInView, useShellPlace, useTimedOut };
+export { APP_ATTRIBUTE, APP_ID, Accent, Accordion, AccordionItem, AccountMenu, ActivityList, AppCard, AppGrid, AppIcon, AppShell, Badge, BrowserFrame, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardNumeral, CardTitle, Checkbox, Closing, CodeBlock, ComparisonTable, Container, CopyButton, Crowd, DOCS_HREF, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogHost, DialogTitle, DialogTrigger, Display, DocHeader, DocLayout, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EmptyLine, EmptyState, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FAMILY, FAMILY_GROUPS, FactBlock, FactRows, FamilyMenu, Faq, Field, FloatChip, Footnote, HalftoneCanvas, HalftoneSphere, HashChip, Input, IsoCheck, Kbd, KeyValueList, LEGAL_LINKS, Label, Lead, LegalDocument, LoadingBlock, Lockup, MARK_FACES, Mark, Monogram, Notice, OCHK_IO, OCHK_IO_FOOTER, OCHK_IO_NAV, PROTOCOLS, PROTOCOL_ORDER, PackageCard, PageHeader, PageHero, Pagination, PhoneFrame, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProgressSteps, ProofStrip, Prose, ProtocolGrid, ProtocolHero, ProtocolNav, QrCode, RadioGroup, RadioGroupItem, Reveal, SPHERE_GRADIENT, Sats, SatsFigure, ScrollFade, ScrollStory, Section, SectionHeading, SectionIntro, Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetTitle, SheetTrigger, ShellContext, SignInFrame, SignMessage, SiteBanner, SiteFooter, SiteHeader, Skeleton, SkipLink, SpecCard, Spinner, SplitBar, StatCard, StatGrid, StatusBadge, StatusDot, StatusPill, StepGrid, Switch, Tabs, TabsContent, TabsList, TabsTrigger, TextLink, Textarea, ThemeToggle, Ticker, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TruthTable, UsdApprox, VerifyBox, VerifyReport, appColors, appFonts, badgeVariants, buttonVariants, cardVariants, cn, confirm, familyByGroup, familySite, monogramGround, monogramLetter, portraitTone, prompt, protocolSite, satsText, sectionVariants, statusWord, useCopy, useInView, useShellPlace, useTimedOut };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map