@orangecheck/app-design 0.6.1 → 1.1.0

package/dist/components.js

@@ -5,10 +5,20 @@ var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var jsxRuntime = require('react/jsx-runtime');
 var classVarianceAuthority = require('class-variance-authority');
+var TabsPrimitive = require('@radix-ui/react-tabs');
 var lucideReact = require('lucide-react');
 var reactSlot = require('@radix-ui/react-slot');
 var SeparatorPrimitive = require('@radix-ui/react-separator');
 require('sonner');
+var Link = require('next/link');
+var CheckboxPrimitive = require('@radix-ui/react-checkbox');
+var LabelPrimitive = require('@radix-ui/react-label');
+var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
+var SelectPrimitive = require('@radix-ui/react-select');
+var SwitchPrimitive = require('@radix-ui/react-switch');
+var DialogPrimitive = require('@radix-ui/react-dialog');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -28,7 +38,15 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
 var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
+var Link__default = /*#__PURE__*/_interopDefault(Link);
+var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
+var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
+var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
+var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
+var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
+var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
 
 var merge = tailwindMerge.extendTailwindMerge({
   extend: {
@@ -292,6 +310,7 @@ function useActiveHeading(ids) {
   const [active, setActive] = react.useState(ids[0]);
   const key = ids.join("|");
   react.useEffect(() => {
+    setActive(key.split("|")[0] || void 0);
     const els = key.split("|").map((id) => document.getElementById(id)).filter((el) => el !== null);
     if (els.length === 0 || typeof IntersectionObserver === "undefined") return;
     const io = new IntersectionObserver(
@@ -365,13 +384,13 @@ var badgeVariants = classVarianceAuthority.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",
@@ -441,6 +460,487 @@ function StepGrid({ items, look = "cards", className }) {
     ] }) }, i)
   ) });
 }
+var KIND = {
+  package: "text-oca-code-package",
+  tag: "text-oca-code-tag",
+  link: "text-oca-code-link"
+};
+function PackageCard({ items, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "grid gap-x-10 gap-y-7 rounded-[1.25rem] border border-oca-ink-line bg-oca-ink-card p-6 text-oca-ink-foreground md:grid-cols-2 md:p-9",
+        className
+      ),
+      children: items.map((it, i) => {
+        const code = /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-[0.9375rem]", KIND[it.kind ?? "package"]), children: it.code });
+        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[1.125rem] font-semibold tracking-[-0.01em] text-oca-ink-title", children: it.title }),
+          it.href ? /* @__PURE__ */ jsxRuntime.jsx("a", { href: it.href, className: "w-fit underline decoration-transparent underline-offset-4 hover:decoration-current", children: code }) : code,
+          it.note ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[0.9375rem] leading-relaxed text-oca-ink-subtle", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: "// " }),
+            it.note
+          ] }) : null
+        ] }, i);
+      })
+    }
+  );
+}
+
+// src/code/highlight.ts
+var TOKEN_CLASS = {
+  keyword: "oca-k",
+  string: "oca-s",
+  number: "oca-n",
+  function: "oca-f",
+  type: "oca-y",
+  property: "oca-p",
+  comment: "oca-c",
+  tag: "oca-g",
+  url: "oca-u"
+};
+var ALIASES = {
+  ts: "js",
+  typescript: "js",
+  tsx: "js",
+  js: "js",
+  javascript: "js",
+  jsx: "js",
+  mjs: "js",
+  cjs: "js",
+  json: "json",
+  jsonc: "json",
+  json5: "json",
+  bash: "shell",
+  sh: "shell",
+  shell: "shell",
+  zsh: "shell",
+  console: "shell",
+  terminal: "shell",
+  py: "python",
+  python: "python",
+  yaml: "yaml",
+  yml: "yaml",
+  diff: "diff"
+};
+function grammarOf(lang) {
+  return lang && ALIASES[lang.toLowerCase()] || "plain";
+}
+function collector() {
+  const tokens = [];
+  const emit = (text, kind) => {
+    if (!text) return;
+    const last = tokens[tokens.length - 1];
+    if (last && last.kind === kind) last.text += text;
+    else tokens.push(kind ? { text, kind } : { text });
+  };
+  return { emit, tokens };
+}
+function at(re, src, i) {
+  re.lastIndex = i;
+  const m = re.exec(src);
+  return m ? m[0] : null;
+}
+var WS = /[ \t]+/y;
+var NEWLINE = /\r?\n/y;
+var JS_KEYWORDS = new Set(
+  "abstract as async await break case catch class const continue debugger declare default delete do else enum export extends finally for from function get if implements import in infer instanceof interface is keyof let module namespace new of override private protected public readonly return satisfies set static super switch this throw try type typeof unique var void while with yield".split(" ")
+);
+var JS_CONSTANTS = /* @__PURE__ */ new Set(["true", "false", "null", "undefined", "NaN", "Infinity"]);
+var TS_PRIMITIVES = /* @__PURE__ */ new Set(["string", "number", "boolean", "bigint", "symbol", "object", "unknown", "any", "never"]);
+var isConstant = (m) => /^[A-Z][A-Z\d_]+$/.test(m) && (m.includes("_") || m.length > 4);
+var JS_LINE_COMMENT = /\/\/[^\n]*/y;
+var JS_BLOCK_COMMENT = /\/\*[\s\S]*?(?:\*\/|$)/y;
+var JS_TEMPLATE = /`(?:\\[\s\S]|[^\\`])*`?/y;
+var JS_STRING = /'(?:\\.|[^\\'\n])*'?|"(?:\\.|[^\\"\n])*"?/y;
+var JS_NUMBER = /(?:0[xX][\da-fA-F_]+|0[bB][01_]+|0[oO][0-7_]+|\d[\d_]*(?:\.[\d_]+)?(?:[eE][+-]?\d+)?|\.\d[\d_]*(?:[eE][+-]?\d+)?)n?/y;
+var JS_IDENT = /[A-Za-z_$][\w$]*/y;
+var JS_DECORATOR = /@[A-Za-z_$][\w$.]*/y;
+var JS_CALL_AFTER = /\s*(?:<[\w$\s,.[\]|&'"]*>)?\s*\(/y;
+var JS_TAG = /<\/?(?=[A-Za-z])/y;
+var JS_TAG_NAME = /[A-Za-z][\w$.:-]*/y;
+var JS_PUNCT = /=>|\.\.\.|[{}()[\];,.<>=+\-*/%!?:&|^~#]/y;
+var JSX_BEFORE = /* @__PURE__ */ new Set(["(", ",", "=", "?", ":", "{", "[", ";", ">", "&&", "||", "=>", "return"]);
+function scanJs(src, emit, jsx35) {
+  let i = 0;
+  let prev = "";
+  let tagDepth = 0;
+  let braceInTag = 0;
+  const sig = (t) => {
+    prev = t;
+  };
+  while (i < src.length) {
+    let m;
+    if ((m = at(WS, src, i)) || (m = at(NEWLINE, src, i))) {
+      emit(m);
+      i += m.length;
+      continue;
+    }
+    if ((m = at(JS_LINE_COMMENT, src, i)) || (m = at(JS_BLOCK_COMMENT, src, i))) {
+      emit(m, "comment");
+      i += m.length;
+      continue;
+    }
+    if ((m = at(JS_TEMPLATE, src, i)) || (m = at(JS_STRING, src, i))) {
+      emit(m, "string");
+      i += m.length;
+      sig('"');
+      continue;
+    }
+    if (jsx35 && tagDepth === 0 && (m = at(JS_TAG, src, i)) && (prev === "" || JSX_BEFORE.has(prev))) {
+      const name = at(JS_TAG_NAME, src, i + m.length);
+      if (name) {
+        emit(m);
+        emit(name, "tag");
+        i += m.length + name.length;
+        tagDepth = 1;
+        braceInTag = 0;
+        sig("tag");
+        continue;
+      }
+    }
+    if (jsx35 && tagDepth > 0 && braceInTag === 0) {
+      if (src.startsWith("/>", i) || src[i] === ">") {
+        const close = src[i] === ">" ? ">" : "/>";
+        emit(close);
+        i += close.length;
+        tagDepth = 0;
+        sig(">");
+        continue;
+      }
+      if ((m = at(JS_IDENT, src, i)) && /^\s*=/.test(src.slice(i + m.length, i + m.length + 4))) {
+        emit(m, "property");
+        i += m.length;
+        continue;
+      }
+      if (m = at(JS_IDENT, src, i)) {
+        emit(m, "property");
+        i += m.length;
+        continue;
+      }
+      if (src[i] === "{") braceInTag = 1;
+    } else if (jsx35 && tagDepth > 0 && braceInTag > 0) {
+      if (src[i] === "{") braceInTag++;
+      else if (src[i] === "}") braceInTag--;
+    }
+    if (m = at(JS_DECORATOR, src, i)) {
+      emit(m, "function");
+      i += m.length;
+      sig("@");
+      continue;
+    }
+    if (m = at(JS_IDENT, src, i)) {
+      const end = i + m.length;
+      let kind;
+      if (prev !== "." && JS_CONSTANTS.has(m)) kind = "number";
+      else if (prev !== "." && JS_KEYWORDS.has(m)) kind = "keyword";
+      else if (at(JS_CALL_AFTER, src, end) !== null) kind = "function";
+      else if (prev !== "." && TS_PRIMITIVES.has(m)) kind = "type";
+      else if (isConstant(m)) kind = "number";
+      else if (/^[A-Z]/.test(m)) kind = "type";
+      emit(m, kind);
+      i = end;
+      sig(kind === "keyword" ? m : "id");
+      continue;
+    }
+    if (m = at(JS_NUMBER, src, i)) {
+      emit(m, "number");
+      i += m.length;
+      sig("0");
+      continue;
+    }
+    if (m = at(JS_PUNCT, src, i)) {
+      emit(m);
+      i += m.length;
+      sig(m === "." ? "." : m);
+      continue;
+    }
+    emit(src[i]);
+    i++;
+  }
+}
+var JSON_STRING = /"(?:\\.|[^\\"\n])*"?/y;
+var JSON_KEY_AFTER = /\s*:/y;
+var JSON_NUMBER = /-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?/y;
+var JSON_WORD = /true|false|null/y;
+function scanJson(src, emit) {
+  let i = 0;
+  while (i < src.length) {
+    let m;
+    if ((m = at(JS_LINE_COMMENT, src, i)) || (m = at(JS_BLOCK_COMMENT, src, i))) {
+      emit(m, "comment");
+    } else if (m = at(JSON_STRING, src, i)) {
+      emit(m, at(JSON_KEY_AFTER, src, i + m.length) !== null ? "property" : "string");
+    } else if ((m = at(JSON_NUMBER, src, i)) || (m = at(JSON_WORD, src, i))) {
+      emit(m, "number");
+    } else {
+      m = src[i];
+      emit(m);
+    }
+    i += m.length;
+  }
+}
+var SH_KEYWORDS = new Set(
+  "if then else elif fi for in do done case esac while until function return export local select time".split(" ")
+);
+var SH_PROMPT = /\$ (?=\S)/y;
+var SH_COMMENT = /#[^\n]*/y;
+var SH_SINGLE = /'[^']*'?/y;
+var SH_DOUBLE = /"(?:\\.|[^\\"])*"?/y;
+var SH_VAR = /\$(?:\{[^}\n]*\}?|[A-Za-z_][\w]*|[@*#?$!\d])/y;
+var SH_URL = /https?:\/\/[^\s'"`)]+/y;
+var SH_FLAG = /--?[A-Za-z][\w-]*/y;
+var SH_ASSIGN = /[A-Za-z_][\w]*(?==)/y;
+var SH_VALUE = /=[^\s|&;()<>'"`$]*/y;
+var SH_WORD = /[^\s|&;()<>'"`$#]+/y;
+var SH_OPERATOR = /\|\||&&|[|;&]|\$\(|[()<>]/y;
+function scanShell(src, emit) {
+  let i = 0;
+  let command = true;
+  let lineStart = true;
+  while (i < src.length) {
+    let m;
+    if (m = at(NEWLINE, src, i)) {
+      emit(m);
+      i += m.length;
+      command = !/\\\s*$/.test(src.slice(0, i - m.length));
+      lineStart = true;
+      continue;
+    }
+    if (m = at(WS, src, i)) {
+      emit(m);
+      i += m.length;
+      continue;
+    }
+    if (lineStart && (m = at(SH_PROMPT, src, i))) {
+      emit(m, "comment");
+      i += m.length;
+      lineStart = false;
+      continue;
+    }
+    lineStart = false;
+    if ((m = at(SH_COMMENT, src, i)) && (i === 0 || /\s/.test(src[i - 1]))) {
+      emit(m, "comment");
+      i += m.length;
+      continue;
+    }
+    if ((m = at(SH_SINGLE, src, i)) || (m = at(SH_DOUBLE, src, i))) {
+      emit(m, "string");
+      i += m.length;
+      command = false;
+      continue;
+    }
+    if (m = at(SH_OPERATOR, src, i)) {
+      emit(m);
+      i += m.length;
+      command = m !== ")" && m !== ">" && m !== "<";
+      continue;
+    }
+    if (m = at(SH_VAR, src, i)) {
+      emit(m, "type");
+      i += m.length;
+      command = false;
+      continue;
+    }
+    if (m = at(SH_URL, src, i)) {
+      emit(m, "url");
+      i += m.length;
+      command = false;
+      continue;
+    }
+    if (command && (m = at(SH_ASSIGN, src, i))) {
+      emit(m, "property");
+      i += m.length;
+      const v = at(SH_VALUE, src, i);
+      emit(v);
+      i += v.length;
+      continue;
+    }
+    if ((m = at(SH_FLAG, src, i)) && !command) {
+      emit(m, "keyword");
+      i += m.length;
+      continue;
+    }
+    if (m = at(SH_WORD, src, i)) {
+      if (command && SH_KEYWORDS.has(m)) emit(m, "keyword");
+      else if (command) {
+        emit(m, "function");
+        command = m === "sudo" || m === "npx" || m === "env" || m === "time";
+        i += m.length;
+        continue;
+      } else emit(m);
+      i += m.length;
+      continue;
+    }
+    emit(src[i]);
+    i++;
+  }
+}
+var PY_KEYWORDS = new Set(
+  "and as assert async await break class continue def del elif else except finally for from global if import in is lambda match case nonlocal not or pass raise return try while with yield self cls".split(" ")
+);
+var PY_CONSTANTS = /* @__PURE__ */ new Set(["True", "False", "None"]);
+var PY_TYPES = /* @__PURE__ */ new Set(["int", "str", "bool", "float", "bytes", "list", "dict", "tuple", "set", "object"]);
+var PY_COMMENT = /#[^\n]*/y;
+var PY_TRIPLE = /[rRbBuUfF]{0,2}(?:"""[\s\S]*?(?:"""|$)|'''[\s\S]*?(?:'''|$))/y;
+var PY_STRING = /[rRbBuUfF]{0,2}(?:'(?:\\.|[^\\'\n])*'?|"(?:\\.|[^\\"\n])*"?)/y;
+var PY_NUMBER = /(?:0[xX][\da-fA-F_]+|\d[\d_]*(?:\.[\d_]*)?(?:[eE][+-]?\d+)?j?)/y;
+var PY_IDENT = /[A-Za-z_]\w*/y;
+var PY_DECORATOR = /@[A-Za-z_][\w.]*/y;
+var PY_CALL_AFTER = /\s*\(/y;
+function scanPython(src, emit) {
+  let i = 0;
+  let prev = "";
+  while (i < src.length) {
+    let m;
+    if ((m = at(WS, src, i)) || (m = at(NEWLINE, src, i))) {
+      emit(m);
+      i += m.length;
+      continue;
+    }
+    if (m = at(PY_COMMENT, src, i)) {
+      emit(m, "comment");
+    } else if ((m = at(PY_TRIPLE, src, i)) || (m = at(PY_STRING, src, i))) {
+      if (/^[A-Za-z]+$/.test(m)) {
+        emit(m);
+      } else emit(m, "string");
+      prev = '"';
+    } else if (m = at(PY_DECORATOR, src, i)) {
+      emit(m, "function");
+      prev = "@";
+    } else if (m = at(PY_IDENT, src, i)) {
+      let kind;
+      if (PY_CONSTANTS.has(m)) kind = "number";
+      else if (prev !== "." && PY_KEYWORDS.has(m)) kind = "keyword";
+      else if (prev === "def" || at(PY_CALL_AFTER, src, i + m.length) !== null) kind = "function";
+      else if (prev === "class" || /^[A-Z][a-z]/.test(m) || PY_TYPES.has(m)) kind = "type";
+      else if (isConstant(m)) kind = "number";
+      emit(m, kind);
+      prev = kind === "keyword" ? m : "id";
+    } else if (m = at(PY_NUMBER, src, i)) {
+      emit(m, "number");
+      prev = "0";
+    } else {
+      m = src[i];
+      emit(m);
+      prev = m;
+    }
+    i += m.length;
+  }
+}
+var YAML_KEY = /[ \t]*(?:- )?[\w.$/-]+(?=[ \t]*:(?:\s|$))/y;
+var YAML_VALUE_WORD = /(?:true|false|null|yes|no|~|-?\d+(?:\.\d+)?)(?=\s*(?:#|$))/y;
+function scanYaml(src, emit) {
+  let i = 0;
+  let lineStart = true;
+  while (i < src.length) {
+    let m;
+    if (m = at(NEWLINE, src, i)) {
+      emit(m);
+      i += m.length;
+      lineStart = true;
+      continue;
+    }
+    if (lineStart && (m = at(YAML_KEY, src, i))) {
+      const dash = m.match(/^([ \t]*(?:- )?)/)[1];
+      emit(dash);
+      emit(m.slice(dash.length), "property");
+      i += m.length;
+      lineStart = false;
+      continue;
+    }
+    lineStart = false;
+    if ((m = at(SH_COMMENT, src, i)) && (i === 0 || /\s/.test(src[i - 1]))) emit(m, "comment");
+    else if ((m = at(SH_SINGLE, src, i)) || (m = at(JSON_STRING, src, i))) emit(m, "string");
+    else if (m = at(YAML_VALUE_WORD, src, i)) emit(m, "number");
+    else if (m = at(SH_URL, src, i)) emit(m, "url");
+    else {
+      m = src[i];
+      emit(m);
+    }
+    i += m.length;
+  }
+}
+function toLines(tokens) {
+  const lines = [[]];
+  for (const t of tokens) {
+    const parts = t.text.split(/\r?\n/);
+    parts.forEach((part, j) => {
+      if (j > 0) lines.push([]);
+      if (part) lines[lines.length - 1].push(t.kind ? { text: part, kind: t.kind } : { text: part });
+    });
+  }
+  return lines;
+}
+function highlight(code, lang) {
+  const src = code.replace(/\r?\n$/, "");
+  const grammar = grammarOf(lang);
+  const { emit, tokens } = collector();
+  const name = (lang ?? "").toLowerCase();
+  switch (grammar) {
+    case "js":
+      scanJs(src, emit, name === "tsx" || name === "jsx");
+      break;
+    case "json":
+      scanJson(src, emit);
+      break;
+    case "shell":
+      scanShell(src, emit);
+      break;
+    case "python":
+      scanPython(src, emit);
+      break;
+    case "yaml":
+      scanYaml(src, emit);
+      break;
+    default:
+      emit(src);
+  }
+  return toLines(tokens);
+}
+function readDiff(code) {
+  const diff = /* @__PURE__ */ new Map();
+  const lines = code.replace(/\r?\n$/, "").split(/\r?\n/);
+  const out = lines.map((line, i) => {
+    const c = line[0];
+    if (c === "+" || c === "-") {
+      diff.set(i + 1, c === "+" ? "add" : "remove");
+      return line.slice(1);
+    }
+    return c === " " ? line.slice(1) : line;
+  });
+  return { code: out.join("\n"), diff };
+}
+function parseLineRanges(spec) {
+  if (!spec) return /* @__PURE__ */ new Set();
+  if (typeof spec !== "string") return new Set(spec);
+  const out = /* @__PURE__ */ new Set();
+  for (const part of spec.split(",")) {
+    const m = part.trim().match(/^(\d+)(?:\s*-\s*(\d+))?$/);
+    if (!m) continue;
+    const a = Number(m[1]);
+    const b = m[2] ? Number(m[2]) : a;
+    for (let n = Math.min(a, b); n <= Math.max(a, b) && n - a < 1e4; n++) out.add(n);
+  }
+  return out;
+}
+var ESCAPE = { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" };
+function escapeHtml(s) {
+  return s.replace(/[&<>"]/g, (c) => ESCAPE[c]);
+}
+function linesToHtml(lines, marks = {}) {
+  return lines.map((line, i) => {
+    const n = i + 1;
+    const attrs = [
+      'data-line=""',
+      marks.highlight?.has(n) ? 'data-mark=""' : "",
+      marks.diff?.has(n) ? `data-diff="${marks.diff.get(n)}"` : ""
+    ].filter(Boolean).join(" ");
+    const body = line.map((t) => t.kind ? `<span class="${TOKEN_CLASS[t.kind]}">${escapeHtml(t.text)}</span>` : escapeHtml(t.text)).join("");
+    return `<span ${attrs}>${body}</span>`;
+  }).join("\n");
+}
 function ScrollFade({ fade = "var(--card)", className, innerClassName, children, ...props }) {
   const ref = react.useRef(null);
   const [edges, setEdges] = react.useState({ left: false, right: false });
@@ -499,7 +999,73 @@ function ScrollFade({ fade = "var(--card)", className, innerClassName, children,
     )
   ] });
 }
-var ShellContext = react.createContext({});
+
+// src/format/index.ts
+var EXPLORER = "https://mempool.space";
+function explorerUrl(kind, value, network = "mainnet") {
+  const net = network === "mainnet" ? "" : `/${network}`;
+  return `${EXPLORER}${net}/${kind}/${encodeURIComponent(String(value))}`;
+}
+function shortenMiddle(value, head = 8, tail = 6) {
+  return value.length <= head + tail + 1 ? value : `${value.slice(0, head)}\u2026${value.slice(-tail)}`;
+}
+function formatBlockHeight(height) {
+  return Math.trunc(height).toLocaleString("en-US");
+}
+function blocksToDuration(blocks, minutesPerBlock = 10) {
+  const minutes = Math.max(0, Math.round(blocks * minutesPerBlock));
+  if (minutes < 60) return `about ${minutes} minute${minutes === 1 ? "" : "s"}`;
+  const units = [
+    [60 * 24 * 7, "week"],
+    [60 * 24, "day"],
+    [60, "hour"],
+    [1, "minute"]
+  ];
+  const parts = [];
+  let rest = minutes;
+  for (const [size, word] of units) {
+    const n = Math.floor(rest / size);
+    if (n > 0 && parts.length < 2) {
+      parts.push(`${n} ${word}${n === 1 ? "" : "s"}`);
+      rest -= n * size;
+    } else if (parts.length > 0) break;
+  }
+  return `about ${parts.join(" ")}`;
+}
+var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+function formatUtc(at2, opts = {}) {
+  const d = typeof at2 === "number" ? new Date(at2 * 1e3) : new Date(at2);
+  if (Number.isNaN(d.getTime())) return "\u2014";
+  const day = `${d.getUTCDate()} ${MONTHS[d.getUTCMonth()]} ${d.getUTCFullYear()}`;
+  if (opts.date) return day;
+  const hh = String(d.getUTCHours()).padStart(2, "0");
+  const mm = String(d.getUTCMinutes()).padStart(2, "0");
+  return `${day}, ${hh}:${mm} UTC`;
+}
+function formatBytes(bytes) {
+  if (!Number.isFinite(bytes) || bytes < 0) return "\u2014";
+  if (bytes < 1024) return `${bytes} B`;
+  const units = ["KB", "MB", "GB", "TB"];
+  let v = bytes / 1024;
+  let u = 0;
+  while (v >= 1024 && u < units.length - 1) {
+    v /= 1024;
+    u++;
+  }
+  return `${v < 10 ? v.toFixed(1).replace(/\.0$/, "") : Math.round(v)} ${units[u]}`;
+}
+function sharedContext(name, initial) {
+  const key = /* @__PURE__ */ Symbol.for(`@orangecheck/app-design/${name}`);
+  const store = globalThis;
+  return store[key] ?? (store[key] = react.createContext(initial));
+}
+
+// src/lib/density.ts
+var DensityContext = sharedContext("density", "comfortable");
+function useDensity() {
+  return react.useContext(DensityContext);
+}
+var ShellContext = sharedContext("shell-place", {});
 function useShellPlace() {
   return react.useContext(ShellContext);
 }
@@ -554,6 +1120,18 @@ react.forwardRef(function Separator2({ className, orientation = "horizontal", de
     }
   );
 });
+function Kbd({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "kbd",
+    {
+      className: cn(
+        "inline-flex h-5 min-w-5 items-center justify-center rounded-md border border-border bg-card px-1.5 font-mono text-[11px] text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
 var buttonVariants = classVarianceAuthority.cva(
   [
     "inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap rounded-full font-medium",
@@ -627,26 +1205,30 @@ function PageHeader({
   ] });
 }
 var InStatGrid = react.createContext(false);
-function StatCard({ label, value, hint, className }) {
+function StatCard({ label, value, hint, size, className }) {
   const inGrid = react.useContext(InStatGrid);
+  const density = useDensity();
+  const sm = (size ?? (density === "compact" ? "sm" : "md")) === "sm";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       "data-ui": "stat",
       className: cn(
-        "rounded-[1.25rem] border border-border bg-card p-5 md:p-6",
+        "border border-border bg-card",
+        sm ? "rounded-2xl p-4" : "rounded-[1.25rem] p-5 md:p-6",
         // In a grid, label, value and hint each share a row with their
         // neighbours, so values line up whatever wraps above them.
         inGrid ? "row-span-3 grid grid-rows-subgrid gap-1.5" : "flex flex-col gap-2",
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: label }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("leading-snug text-muted-foreground", sm ? "text-[0.8125rem]" : "text-[0.875rem]"), children: label }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
             className: cn(
-              "break-words oca-tabular text-[1.5rem] leading-tight tracking-[-0.02em] md:text-[1.75rem]",
+              "break-words oca-tabular leading-tight tracking-[-0.02em]",
+              sm ? "text-[1.25rem]" : "text-[1.5rem] md:text-[1.75rem]",
               inGrid && "self-end"
             ),
             children: value
@@ -708,6 +1290,7 @@ function StatGrid({ columns, empty, isEmpty, className, children, ...props }) {
   const items = react.Children.toArray(children).filter(react.isValidElement);
   const n = items.length;
   const allZero = n > 0 && items.every((el) => "raw" in el.props && (el.props.raw === 0 || el.props.raw === null));
+  const compact = useDensity() === "compact";
   if (isEmpty ?? allZero) return /* @__PURE__ */ jsxRuntime.jsx(EmptyLine, { className, children: empty ?? "Nothing here yet." });
   const lg = columns ?? statColumns(n);
   const md = lg > 4 ? 3 : lg;
@@ -717,7 +1300,8 @@ function StatGrid({ columns, empty, isEmpty, className, children, ...props }) {
     "div",
     {
       className: cn(
-        "grid gap-3 md:gap-4",
+        "grid",
+        compact ? "gap-2.5 md:gap-3" : "gap-3 md:gap-4",
         n === 1 ? "grid-cols-1" : "grid-cols-2",
         MD_COLS[md],
         LG_COLS[lg],
@@ -736,11 +1320,40 @@ function StatGrid({ columns, empty, isEmpty, className, children, ...props }) {
     }
   ) });
 }
-function KeyValueList({ items, className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("dl", { className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: items.map((it, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 px-5 py-3.5 sm:flex-row sm:items-baseline sm:gap-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "shrink-0 text-[0.875rem] text-muted-foreground sm:w-48", children: it.label }),
-    /* @__PURE__ */ jsxRuntime.jsx("dd", { className: cn("min-w-0 break-words text-[0.9375rem]", it.mono && "font-mono text-[0.875rem]"), children: it.value })
-  ] }, i)) });
+function KeyValueList({
+  items,
+  dense,
+  className
+}) {
+  const density = useDensity();
+  const tight = dense ?? density === "compact";
+  return (
+    // The rows go side by side when the list itself is wide enough, wherever it sits: a narrow card stacks them.
+    /* @__PURE__ */ jsxRuntime.jsx("dl", { className: cn("@container divide-y divide-border border border-border bg-card", tight ? "rounded-2xl" : "rounded-[1.25rem]", className), children: items.map((it, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex flex-col gap-1 @md:flex-row @md:items-baseline",
+          tight ? "px-4 py-2.5 @md:gap-5" : "px-5 py-3.5 @md:gap-6"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: cn("shrink-0 text-muted-foreground", tight ? "text-[0.8125rem] @md:w-36" : "text-[0.875rem] @md:w-48"), children: it.label }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "dd",
+            {
+              className: cn(
+                "min-w-0 break-words",
+                tight ? "text-[0.875rem]" : "text-[0.9375rem]",
+                it.mono && (tight ? "font-mono text-[0.8125rem]" : "font-mono text-[0.875rem]")
+              ),
+              children: it.value
+            }
+          )
+        ]
+      },
+      i
+    )) })
+  );
 }
 function DataTable({
   columns,
@@ -749,8 +1362,11 @@ function DataTable({
   empty,
   caption,
   phone = "cards",
+  dense,
   className
 }) {
+  const density = useDensity();
+  const tight = dense ?? density === "compact";
   if (rows.length === 0 && empty) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: empty });
   const primary = columns.find((c) => c.primary) ?? columns[0];
   const right = (c) => c.numeric || c.align === "end";
@@ -758,11 +1374,12 @@ function DataTable({
     "div",
     {
       className: cn(
-        "overflow-hidden rounded-[1.25rem] border border-border bg-card",
+        "overflow-hidden border border-border bg-card",
+        tight ? "rounded-2xl" : "rounded-[1.25rem]",
         phone === "cards" && "max-sm:hidden",
         className
       ),
-      children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full border-collapse text-left text-[0.9375rem]", children: [
+      children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: cn("w-full border-collapse text-left", tight ? "text-[0.875rem]" : "text-[0.9375rem]"), children: [
         caption ? /* @__PURE__ */ jsxRuntime.jsx("caption", { className: "sr-only", children: caption }) : null,
         /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { className: "border-b border-border", children: columns.map((c) => /* @__PURE__ */ jsxRuntime.jsx(
           "th",
@@ -770,7 +1387,8 @@ function DataTable({
             scope: "col",
             style: { width: c.width, minWidth: c.minWidth },
             className: cn(
-              "whitespace-nowrap px-5 py-3 text-[0.8125rem] font-medium text-muted-foreground",
+              "whitespace-nowrap text-[0.8125rem] font-medium text-muted-foreground",
+              tight ? "px-4 py-2.5" : "px-5 py-3",
               right(c) && "text-right",
               c.wide && "hidden md:table-cell"
             ),
@@ -783,7 +1401,8 @@ function DataTable({
           {
             style: { minWidth: c.minWidth },
             className: cn(
-              "px-5 py-3.5 align-middle",
+              "align-middle",
+              tight ? "px-4 py-2" : "px-5 py-3.5",
               right(c) && "text-right",
               c.numeric && "whitespace-nowrap oca-tabular",
               c.wide && "hidden md:table-cell"
@@ -803,8 +1422,12 @@ function DataTable({
       "ul",
       {
         "aria-label": caption,
-        className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card sm:hidden", className),
-        children: rows.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex flex-col gap-2.5 px-4 py-4", children: [
+        className: cn(
+          "divide-y divide-border border border-border bg-card sm:hidden",
+          tight ? "rounded-2xl" : "rounded-[1.25rem]",
+          className
+        ),
+        children: rows.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cn("flex flex-col gap-2.5 px-4", tight ? "py-3" : "py-4"), children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 break-words text-[0.9375rem] font-medium", children: primary?.cell(r) }),
           rest.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "grid grid-cols-[minmax(5.5rem,auto)_minmax(0,1fr)] gap-x-4 gap-y-1.5 text-[0.875rem]", children: rest.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "contents", children: [
             /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground", children: c.header }),
@@ -851,13 +1474,14 @@ function Notice({
   title,
   children,
   action,
+  role,
   className
 }) {
   const kind = NOTICE_KIND[tone];
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      role: tone === "danger" || tone === "warning" ? "alert" : "note",
+      role: role ?? (tone === "danger" || tone === "warning" ? "alert" : "note"),
       "data-tone": kind,
       className: cn(
         "flex flex-col gap-3 rounded-2xl border border-border bg-card px-5 py-4 sm:flex-row sm:items-start sm:justify-between",
@@ -907,45 +1531,66 @@ function LoadingBlock({
   }
   return /* @__PURE__ */ jsxRuntime.jsx("div", { role: "status", "aria-label": label, className: cn("flex flex-col gap-3", className), children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-16 rounded-2xl" }, i)) });
 }
-function middle(v, head, tail) {
-  return v.length <= head + tail + 1 ? v : `${v.slice(0, head)}\u2026${v.slice(-tail)}`;
+async function wipeIfUnchanged(expected) {
+  try {
+    if (await navigator.clipboard.readText() !== expected) return;
+  } catch {
+  }
+  try {
+    await navigator.clipboard.writeText("");
+  } catch {
+  }
 }
 function useCopy(timeoutMs = 1600) {
   const [copied, setCopied] = react.useState(false);
   const t = react.useRef(null);
-  react.useEffect(() => () => {
-    if (t.current) clearTimeout(t.current);
-  }, []);
+  const wipe = react.useRef(null);
+  react.useEffect(
+    () => () => {
+      if (t.current) clearTimeout(t.current);
+    },
+    []
+  );
   const copy = react.useCallback(
-    async (text) => {
+    async (text, opts = {}) => {
       try {
         await navigator.clipboard.writeText(text);
         setCopied(true);
         if (t.current) clearTimeout(t.current);
         t.current = setTimeout(() => setCopied(false), timeoutMs);
+        if (opts.clearAfter && opts.clearAfter > 0) {
+          if (wipe.current) clearTimeout(wipe.current);
+          wipe.current = setTimeout(() => void wipeIfUnchanged(text), opts.clearAfter);
+        }
+        return true;
       } catch {
         setCopied(false);
+        return false;
       }
     },
     [timeoutMs]
   );
   return { copied, copy };
 }
-function CopyButton({ value, label = "Copy", className }) {
+function CopyButton({ value, label = "Copy", clearAfter, onCopied, className }) {
   const { copied, copy } = useCopy();
+  const done = copied ? clearAfter ? `Copied. Cleared in ${Math.round(clearAfter / 1e3)} seconds` : "Copied" : "";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
       type: "button",
-      onClick: () => void copy(value),
+      onClick: async () => {
+        if (await copy(typeof value === "function" ? value() : value, { clearAfter })) onCopied?.();
+      },
       "aria-label": copied ? "Copied" : label,
+      title: label,
       className: cn(
         "inline-flex size-8 shrink-0 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
         className
       ),
       children: [
         copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-4 text-success" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: "size-4" }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-live": "polite", className: "sr-only", children: copied ? "Copied" : "" })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-live": "polite", className: "sr-only", children: done })
       ]
     }
   );
@@ -956,12 +1601,27 @@ function HashChip({
   tail = 6,
   copy = true,
   href,
+  explorer,
+  network = "mainnet",
   className
 }) {
-  const shown = middle(value, head, tail);
+  const shown = shortenMiddle(value, head, tail);
+  const link = href ?? (explorer ? explorerUrl(explorer, value, network) : void 0);
+  const offsite = !!link && /^https?:\/\//.test(link);
   const text = /* @__PURE__ */ jsxRuntime.jsx("span", { title: value, className: "font-mono text-[0.875rem]", children: shown });
   return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex max-w-full items-center gap-1", className), children: [
-    href ? /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: "underline decoration-foreground/35 underline-offset-4 hover:decoration-foreground", children: text }) : text,
+    link ? /* @__PURE__ */ jsxRuntime.jsxs(
+      "a",
+      {
+        href: link,
+        ...offsite ? { target: "_blank", rel: "noreferrer" } : {},
+        className: "underline decoration-foreground/35 underline-offset-4 hover:decoration-foreground",
+        children: [
+          text,
+          offsite ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: " (opens in a new tab)" }) : null
+        ]
+      }
+    ) : text,
     copy ? /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { value, label: "Copy full value" }) : null
   ] });
 }
@@ -1015,96 +1675,269 @@ function ActivityList({ items, empty, className }) {
     return /* @__PURE__ */ jsxRuntime.jsx("li", { children: it.href ? /* @__PURE__ */ jsxRuntime.jsx("a", { href: it.href, className: "block transition-colors hover:bg-accent/60", children: body }) : body }, it.id);
   }) });
 }
-var KIND = {
-  package: "text-oca-code-package",
-  tag: "text-oca-code-tag",
-  link: "text-oca-code-link"
+var LANG_NAME = {
+  ts: "TypeScript",
+  typescript: "TypeScript",
+  tsx: "TSX",
+  js: "JavaScript",
+  javascript: "JavaScript",
+  jsx: "JSX",
+  mjs: "JavaScript",
+  json: "JSON",
+  jsonc: "JSON",
+  bash: "Shell",
+  sh: "Shell",
+  shell: "Shell",
+  zsh: "Shell",
+  console: "Terminal",
+  terminal: "Terminal",
+  python: "Python",
+  py: "Python",
+  yaml: "YAML",
+  yml: "YAML",
+  diff: "Diff",
+  text: "Text"
 };
-function PackageCard({ items, className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: cn(
-        "grid gap-x-10 gap-y-7 rounded-[1.25rem] border border-oca-ink-line bg-oca-ink-card p-6 text-oca-ink-foreground md:grid-cols-2 md:p-9",
-        className
-      ),
-      children: items.map((it, i) => {
-        const code = /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("text-[0.9375rem]", KIND[it.kind ?? "package"]), children: it.code });
-        return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[1.125rem] font-semibold tracking-[-0.01em] text-oca-ink-title", children: it.title }),
-          it.href ? /* @__PURE__ */ jsxRuntime.jsx("a", { href: it.href, className: "w-fit underline decoration-transparent underline-offset-4 hover:decoration-current", children: code }) : code,
-          it.note ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[0.9375rem] leading-relaxed text-oca-ink-subtle", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: "// " }),
-            it.note
-          ] }) : null
-        ] }, i);
-      })
-    }
-  );
+function languageName(lang) {
+  return lang ? LANG_NAME[lang.toLowerCase()] ?? lang : void 0;
+}
+function forClipboard(text, lang) {
+  if (grammarOf(lang) !== "shell") return text;
+  const lines = text.split("\n");
+  if (!lines.some((l) => l.startsWith("$ "))) return text;
+  return lines.filter((l) => l.startsWith("$ ")).map((l) => l.slice(2)).join("\n");
+}
+function linesFromDom(pre) {
+  if (!pre) return null;
+  const lines = pre.querySelectorAll("[data-line]");
+  if (lines.length === 0) return pre.textContent ?? "";
+  return Array.from(lines).filter((l) => l.getAttribute("data-diff") !== "remove").map((l) => l.textContent ?? "").join("\n");
+}
+function prepare(code, lang, marks, diff) {
+  const d = diff ? readDiff(code) : null;
+  const src = d ? d.code : code.replace(/\r?\n$/, "");
+  const lines = highlight(src, lang === "diff" ? void 0 : lang);
+  const kept = d ? src.split("\n").filter((_, i) => d.diff.get(i + 1) !== "remove") : null;
+  return {
+    html: linesToHtml(lines, { highlight: parseLineRanges(marks), diff: d?.diff }),
+    copy: kept ? kept.join("\n") : src,
+    lines: lines.length,
+    diff: !!d
+  };
+}
+function Well({
+  preRef,
+  html,
+  children,
+  lang,
+  lines,
+  maxLines,
+  diff,
+  lineNumbers
+}) {
+  const foldable = maxLines !== void 0 && lines > maxLines + 2;
+  const [open, setOpen] = react.useState(false);
+  const folded = foldable && !open;
+  const lined = html !== void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(folded && "overflow-hidden"),
+        style: folded ? { maxHeight: `calc(${maxLines} * 1.625em + 2rem)` } : void 0,
+        children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--oca-code-surface)", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "pre",
+          {
+            ref: preRef,
+            "data-diff": diff ? "" : void 0,
+            "data-line-numbers": lineNumbers ? "" : void 0,
+            className: cn(
+              "oca-code w-max min-w-full py-4 font-mono text-[0.875rem] leading-[1.625] text-oca-ink-muted [font-variant-ligatures:none]",
+              !lined && "px-5"
+            ),
+            children: lined ? /* @__PURE__ */ jsxRuntime.jsx("code", { className: "block", "data-lang": lang, dangerouslySetInnerHTML: { __html: html } }) : /* @__PURE__ */ jsxRuntime.jsx("code", { className: "block", "data-lang": lang, children })
+          }
+        ) })
+      }
+    ),
+    foldable ? /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn("flex justify-center px-5 pb-4", folded && "absolute inset-x-0 bottom-0 pt-16"),
+        style: folded ? { background: "linear-gradient(to top, var(--oca-code-surface) 40%, transparent)" } : void 0,
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setOpen((v) => !v),
+            "aria-expanded": open,
+            className: "rounded-full border border-white/20 px-4 py-1.5 text-[0.8125rem] text-white transition-colors hover:bg-white/10",
+            children: open ? "Show less" : `Show all ${lines} lines`
+          }
+        )
+      }
+    ) : null
+  ] });
 }
+var FRAME = "overflow-hidden rounded-[1.25rem] border border-[var(--oca-code-line)] bg-[var(--oca-code-surface)]";
+var COPY_ON_INK = "text-oca-ink-subtle hover:bg-white/10 hover:text-white";
 function CodeBlock({
   code,
+  html,
+  children,
+  lang,
   caption,
   copy = true,
+  clearAfter,
   maxLines,
+  highlight: marks,
+  diff,
+  lineNumbers,
+  actions,
   className
 }) {
-  const lines = code.split("\n").length;
-  const foldable = maxLines !== void 0 && lines > maxLines + 2;
-  const [open, setOpen] = react.useState(false);
-  const folded = foldable && !open;
+  const preRef = react.useRef(null);
+  const isDiff = diff || lang === "diff";
+  const markKey = typeof marks === "string" ? marks : marks?.join(",");
+  const prepared = react.useMemo(
+    () => html === void 0 && children === void 0 && code !== void 0 ? prepare(code, lang, markKey, !!isDiff) : null,
+    [code, html, children, lang, markKey, isDiff]
+  );
+  const markup = prepared?.html ?? html;
+  const lines = prepared?.lines ?? (html !== void 0 ? html.split("\n").length : code?.split("\n").length ?? 0);
+  const read = () => forClipboard(prepared?.copy ?? linesFromDom(preRef.current) ?? code ?? "", lang);
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { className: cn(FRAME, className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("figcaption", { className: "flex h-11 items-center justify-between gap-3 border-b border-[var(--oca-code-line)] pl-5 pr-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[0.8125rem] text-oca-ink-subtle", children: caption ?? languageName(lang) ?? "Code" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex shrink-0 items-center gap-1", children: [
+        actions,
+        copy ? /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { value: read, label: "Copy code", clearAfter, className: COPY_ON_INK }) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Well,
+      {
+        preRef,
+        html: markup,
+        lang,
+        lines,
+        maxLines,
+        diff: prepared ? prepared.diff : isDiff,
+        lineNumbers,
+        children
+      }
+    )
+  ] });
+}
+var tabListeners = /* @__PURE__ */ new Map();
+var tabMemory = /* @__PURE__ */ new Map();
+var storeKey = (k) => `oca-code-tab:${k}`;
+function readTab(key) {
+  if (tabMemory.has(key)) return tabMemory.get(key);
+  try {
+    return window.localStorage.getItem(storeKey(key));
+  } catch {
+    return null;
+  }
+}
+function writeTab(key, value) {
+  tabMemory.set(key, value);
+  try {
+    window.localStorage.setItem(storeKey(key), value);
+  } catch {
+  }
+  tabListeners.get(key)?.forEach((l) => l());
+}
+function useSyncedTab(key) {
+  const subscribe = react.useCallback(
+    (cb) => {
+      if (!key) return () => {
+      };
+      const set = tabListeners.get(key) ?? /* @__PURE__ */ new Set();
+      set.add(cb);
+      tabListeners.set(key, set);
+      return () => {
+        set.delete(cb);
+      };
+    },
+    [key]
+  );
+  const value = react.useSyncExternalStore(
+    subscribe,
+    () => key ? readTab(key) : null,
+    () => null
+  );
+  return [value, (v) => key && writeTab(key, v)];
+}
+function CodeTabs({
+  items,
+  syncKey,
+  defaultValue,
+  maxLines,
+  className
+}) {
+  const [synced, setSynced] = useSyncedTab(syncKey);
+  const [local, setLocal] = react.useState(null);
+  const labels = items.map((it) => it.label);
+  const pick = [local, synced, defaultValue].find((v) => !!v && labels.includes(v)) ?? labels[0] ?? "";
+  const active = items.find((it) => it.label === pick);
+  const prepared = react.useMemo(() => items.map((it) => prepare(it.code, it.lang, void 0, it.lang === "diff")), [items]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    "figure",
+    TabsPrimitive__namespace.Root,
     {
-      className: cn(
-        "overflow-hidden rounded-[1.25rem] border border-[var(--oca-code-line)] bg-[var(--oca-code-surface)]",
-        className
-      ),
+      value: pick,
+      onValueChange: (v) => {
+        setLocal(v);
+        setSynced(v);
+      },
+      className: cn(FRAME, className),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("figcaption", { className: "flex h-11 items-center justify-between gap-3 border-b border-[var(--oca-code-line)] pl-5 pr-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[0.8125rem] text-oca-ink-subtle", children: caption ?? "Code" }),
-          copy ? /* @__PURE__ */ jsxRuntime.jsx(
-            CopyButton,
-            {
-              value: code,
-              label: "Copy code",
-              className: "text-oca-ink-subtle hover:bg-white/10 hover:text-white"
-            }
-          ) : null
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: cn(folded && "overflow-hidden"),
-              style: folded ? { maxHeight: `calc(${maxLines} * 1.625em + 2.5rem)` } : void 0,
-              children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--oca-code-surface)", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "w-max min-w-full p-5 font-mono text-[0.875rem] leading-[1.625] text-oca-ink-muted [font-variant-ligatures:none]", children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: code }) }) })
-            }
-          ),
-          foldable ? /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-11 items-center justify-between gap-3 border-b border-[var(--oca-code-line)] pl-2 pr-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--oca-code-surface)", className: "min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(TabsPrimitive__namespace.List, { "aria-label": "Versions", className: "flex w-max items-center gap-0.5", children: items.map((it) => /* @__PURE__ */ jsxRuntime.jsx(
+            TabsPrimitive__namespace.Trigger,
             {
+              value: it.label,
               className: cn(
-                "flex justify-center px-5 pb-4",
-                folded && "absolute inset-x-0 bottom-0 pt-16"
+                "relative inline-flex h-11 items-center whitespace-nowrap px-3 text-[0.8125rem] text-oca-ink-subtle outline-none transition-colors",
+                "hover:text-white focus-visible:text-white focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+                "data-[state=active]:text-white",
+                "after:absolute after:inset-x-3 after:bottom-0 after:h-0.5 after:rounded-full after:bg-transparent data-[state=active]:after:bg-oca-orange"
               ),
-              style: folded ? { background: "linear-gradient(to top, var(--oca-code-surface) 40%, transparent)" } : void 0,
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => setOpen((v) => !v),
-                  className: "rounded-full border border-white/20 px-4 py-1.5 text-[0.8125rem] text-white transition-colors hover:bg-white/10",
-                  children: open ? "Show less" : `Show all ${lines} lines`
-                }
-              )
+              children: it.label
+            },
+            it.label
+          )) }) }),
+          active ? /* @__PURE__ */ jsxRuntime.jsx(
+            CopyButton,
+            {
+              value: () => forClipboard(prepared[items.indexOf(active)]?.copy ?? active.code, active.lang),
+              label: `Copy ${active.label}`,
+              className: COPY_ON_INK
             }
           ) : null
-        ] })
+        ] }),
+        items.map((it, i) => /* @__PURE__ */ jsxRuntime.jsx(TabsPrimitive__namespace.Content, { value: it.label, className: "outline-none", tabIndex: -1, children: /* @__PURE__ */ jsxRuntime.jsx(
+          Well,
+          {
+            html: prepared[i].html,
+            lang: it.lang,
+            lines: prepared[i].lines,
+            maxLines,
+            diff: prepared[i].diff
+          }
+        ) }, it.label))
       ]
     }
   );
 }
+function InstallTabs({ pkg, dev = false, className }) {
+  const items = [
+    { label: "npm", code: `npm install ${dev ? "--save-dev " : ""}${pkg}`, lang: "bash" },
+    { label: "yarn", code: `yarn add ${dev ? "--dev " : ""}${pkg}`, lang: "bash" },
+    { label: "pnpm", code: `pnpm add ${dev ? "--save-dev " : ""}${pkg}`, lang: "bash" }
+  ];
+  return /* @__PURE__ */ jsxRuntime.jsx(CodeTabs, { items, syncKey: "package-manager", className });
+}
 function SplitBar({
   segments,
   caption,
@@ -1455,53 +2288,2470 @@ var ErrorBoundary = class extends react.Component {
     ) });
   }
 };
+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";
+var MARK_FACES = { top: "#FED8AB", left: "#FB933C", right: "#EA580B" };
+function Mark({ title, size, className, ...rest }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      viewBox: "0 0 16 8",
+      width: size,
+      height: size ? size / 2 : void 0,
+      role: title ? "img" : void 0,
+      "aria-hidden": title ? void 0 : true,
+      className: cn("shrink-0", className),
+      ...rest,
+      children: [
+        title ? /* @__PURE__ */ jsxRuntime.jsx("title", { children: title }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: LEFT, fill: MARK_FACES.left }),
+        /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: RIGHT, fill: MARK_FACES.right }),
+        /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: TOP, fill: MARK_FACES.top })
+      ]
+    }
+  );
+}
+function MarkOutline({ className }) {
+  return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
+    "polygon",
+    {
+      points,
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1",
+      strokeLinejoin: "round",
+      vectorEffect: "non-scaling-stroke"
+    },
+    points
+  )) });
+}
+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."
+  }
+};
+function ErrorPage({
+  code = 404,
+  title,
+  detail,
+  actions,
+  home = "/",
+  art,
+  className
+}) {
+  const words = WORDS[code] ?? (code >= 500 ? WORDS[500] : WORDS[404]);
+  const server = code >= 500;
+  return /* @__PURE__ */ jsxRuntime.jsx(Section, { space: "none", className: cn("flex min-h-[min(40rem,72dvh)] items-center py-16 md:py-24", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-center gap-12 md:grid-cols-12", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex max-w-[40rem] flex-col items-start gap-6 md:col-span-7", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "oca-eyebrow oca-enter", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-tabular", children: code }),
+        " \xB7 ",
+        WORDS[code]?.name ?? (server ? "Error" : "Not available")
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "oca-display-2 oca-enter [--enter-delay:70ms]", children: title ?? words.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-lead oca-enter [--enter-delay:150ms]", children: detail ?? words.detail }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oca-enter flex flex-wrap gap-3 [--enter-delay:230ms]", children: actions ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        server ? /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: () => window.location.reload(), children: "Try again" }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(Button, { asChild: true, variant: server ? "secondary" : "primary", children: /* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { href: home, children: "Go home" }) })
+      ] }) })
+    ] }),
+    art !== null ? /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": true, className: "oca-enter hidden justify-center md:col-span-5 md:flex [--enter-delay:120ms]", children: art ?? /* @__PURE__ */ jsxRuntime.jsx(MarkOutline, { className: "w-full max-w-[20rem] text-oca-hairline-strong" }) }) : null
+  ] }) });
+}
+function IsoCheck({ size = 360, settle = false, shadow = true, tilt = false, title, className }) {
+  const ref = react.useRef(null);
+  react.useEffect(() => {
+    const el = ref.current;
+    if (!el || !tilt || window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
+    let raf = 0;
+    let tx = 0;
+    let ty = 0;
+    let x = 0;
+    let y = 0;
+    const step = () => {
+      x += (tx - x) * 0.08;
+      y += (ty - y) * 0.08;
+      el.style.setProperty("--rx", `${(-y * 10).toFixed(2)}deg`);
+      el.style.setProperty("--ry", `${(x * 14).toFixed(2)}deg`);
+      raf = Math.abs(tx - x) + Math.abs(ty - y) > 1e-3 ? requestAnimationFrame(step) : 0;
+    };
+    const move = (e) => {
+      const b = el.getBoundingClientRect();
+      tx = Math.max(-1, Math.min(1, (e.clientX - (b.left + b.width / 2)) / (window.innerWidth / 2)));
+      ty = Math.max(-1, Math.min(1, (e.clientY - (b.top + b.height / 2)) / (window.innerHeight / 2)));
+      if (!raf) raf = requestAnimationFrame(step);
+    };
+    window.addEventListener("pointermove", move, { passive: true });
+    return () => {
+      cancelAnimationFrame(raf);
+      window.removeEventListener("pointermove", move);
+    };
+  }, [tilt]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn("relative inline-block", settle && "oca-animate-settle", className),
+      style: { width: size, perspective: tilt ? 900 : void 0 },
+      children: [
+        tilt ? /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "absolute left-1/2 top-1/2 -z-0 aspect-square w-[120%] -translate-x-1/2 -translate-y-1/2 rounded-full opacity-70 blur-3xl",
+            style: { background: "radial-gradient(closest-side, rgb(255 140 70 / 0.35), transparent)" }
+          }
+        ) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "relative z-10 transition-transform duration-300 ease-out",
+            style: tilt ? { transform: "rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg))", transformStyle: "preserve-3d" } : void 0,
+            children: /* @__PURE__ */ jsxRuntime.jsx(Mark, { size, title, className: "block" })
+          }
+        ),
+        shadow ? /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "absolute left-[8%] right-[8%] rounded-[50%] opacity-60 blur-xl",
+            style: { height: size * 0.08, bottom: -size * 0.04, background: "rgb(234 88 11 / 0.18)" }
+          }
+        ) : null
+      ]
+    }
+  );
+}
+var GroupName = react.createContext(void 0);
+function Accordion({
+  single = false,
+  children,
+  className
+}) {
+  const name = react.useId();
+  return /* @__PURE__ */ jsxRuntime.jsx(GroupName.Provider, { value: single ? name : void 0, children: /* @__PURE__ */ jsxRuntime.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 = react.useContext(GroupName);
+  return /* @__PURE__ */ jsxRuntime.jsxs("details", { id, name, open: defaultOpen || void 0, className: cn("group scroll-mt-24", className), children: [
+    /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
+            lucideReact.ChevronDown,
+            {
+              "aria-hidden": true,
+              className: "size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oca-body px-5 pb-5 text-[0.9375rem] md:px-6 md:pb-6", children })
+  ] });
+}
+function SectionHeading({
+  eyebrow,
+  title,
+  lead,
+  id,
+  onInk = false,
+  level = 2,
+  as = "h2",
+  align = "start",
+  reveal = true,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(SectionIntro, { align, reveal, className: cn("max-w-3xl gap-4 md:gap-4", className), children: [
+    eyebrow ? /* @__PURE__ */ jsxRuntime.jsx(Eyebrow, { onInk, children: eyebrow }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(Display, { level, as, id, className: "scroll-mt-24", children: title }),
+    lead ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("oca-lead", onInk && "text-oca-ink-muted"), children: lead }) : null
+  ] });
+}
+function FactBlock({
+  id,
+  title,
+  description,
+  aside,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("section", { id, className: cn("flex scroll-mt-24 flex-col gap-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 md:flex-row md:items-end md:justify-between md:gap-8", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex max-w-[44rem] flex-col gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "oca-display-3", children: title }),
+        description ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oca-body text-[1.0625rem]", children: description }) : null
+      ] }),
+      aside ? /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("li", { className: "flex flex-col gap-5 px-5 py-6 md:px-8 md:py-7", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-x-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "oca-title min-w-0 text-pretty", children: r.title }),
+      r.figure ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-tabular shrink-0 whitespace-nowrap text-[1.75rem] leading-none tracking-[-0.02em]", children: r.figure }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-[0.875rem] font-medium text-muted-foreground", children: f.label }),
+      /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "break-words text-[1rem] leading-relaxed", children: f.value })
+    ] }, i)) })
+  ] }, r.key)) });
+}
+function EndpointList({ items, label, className }) {
+  return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      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__ */ jsxRuntime.jsx("code", { className: "break-all text-[0.875rem] text-foreground", children: a.label ?? a.href }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[0.875rem] text-muted-foreground sm:text-right", children: [
+          a.description,
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: " (opens in a new tab)" })
+        ] })
+      ]
+    }
+  ) }, a.href)) });
+}
+function ProofStrip({ items, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("border-y border-border", className), children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "flex", children: it.icon }) : null,
+        it.label
+      ]
+    },
+    i
+  )) }) });
+}
+function Closing({
+  title,
+  lead,
+  actions,
+  art,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Section, { className: cn("overflow-hidden", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-center gap-12 md:grid-cols-12", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Reveal, { className: "flex flex-col items-start gap-8 md:col-span-7", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "oca-display-1 text-[clamp(2.5rem,1.5rem+4vw,5rem)] leading-[1]", children: title }),
+        lead ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-lead max-w-[34rem]", children: lead }) : null
+      ] }),
+      actions ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-3", children: actions }) : null
+    ] }),
+    art !== null ? (
+      // Room under the check on a phone, so its glow fades before the band ends.
+      /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": true, className: "flex justify-center max-md:pb-16 md:col-span-5", children: art ?? /* @__PURE__ */ jsxRuntime.jsx(IsoCheck, { size: 340, settle: true, tilt: true, className: "max-w-full" }) })
+    ) : null
+  ] }) });
+}
+function Faq({
+  items,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Accordion, { single: true, className, children: items.map((it, i) => /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(Link__default.default, { href, className: cn(LINK, className), children });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("a", { href, className: cn(LINK, className), ...offsite ? { target: "_blank", rel: "noreferrer" } : {}, children: [
+    children,
+    offsite ? /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: text.split(INLINE).map((part, i) => {
+    if (!part) return null;
+    if (part.startsWith("**") && part.endsWith("**") && part.length > 4) {
+      return /* @__PURE__ */ jsxRuntime.jsx("strong", { children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: part.slice(2, -2) }) }, i);
+    }
+    if (part.startsWith("`") && part.endsWith("`") && part.length > 2) return /* @__PURE__ */ jsxRuntime.jsx("code", { children: part.slice(1, -1) }, i);
+    const link = LINK2.exec(part);
+    if (link) {
+      return /* @__PURE__ */ jsxRuntime.jsx(TextLink, { href: link[2] ?? "", children: link[1] }, i);
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Fragment, { children: part }, i);
+  }) });
+}
+function BlockView({ block }) {
+  switch (block.kind) {
+    case "para":
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: block.text.split(/\n{2,}/).map((para, i) => /* @__PURE__ */ jsxRuntime.jsx("p", { children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: para }) }, i)) });
+    case "subhead":
+      return /* @__PURE__ */ jsxRuntime.jsx("h3", { children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: headingCase(block.text) }) });
+    case "bullets":
+      return /* @__PURE__ */ jsxRuntime.jsx("ul", { children: block.items.map(
+        (item, i) => typeof item === "string" ? /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: item }) }, i) : /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+            headingCase(item.k),
+            "."
+          ] }),
+          " ",
+          /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: openSentence(item.v) })
+        ] }, i)
+      ) });
+    case "callout":
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "not-prose my-6", children: /* @__PURE__ */ jsxRuntime.jsx(Notice, { tone: block.emphatic ? "brand" : "neutral", children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: block.text }) }) });
+    case "stub":
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "not-prose my-6", children: /* @__PURE__ */ jsxRuntime.jsx(Notice, { tone: "brand", title: "Pending counsel review", children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { text: block.text }) }) });
+  }
+}
+function LegalDocument({ doc, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    DocLayout,
+    {
+      className,
+      header: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("article", { className: "min-w-0", children: /* @__PURE__ */ jsxRuntime.jsxs(Prose, { children: [
+        doc.preamble?.map((b, i) => /* @__PURE__ */ jsxRuntime.jsx(BlockView, { block: b }, i)),
+        doc.sections.map((s) => /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("h2", { id: s.id, className: "scroll-mt-24", children: [
+            s.num ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "oca-tabular text-muted-foreground", children: [
+              s.num,
+              " "
+            ] }) : null,
+            headingCase(s.heading)
+          ] }),
+          s.hint ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.9375rem]", children: headingCase(s.hint) }) : null,
+          s.blocks.map((b, i) => /* @__PURE__ */ jsxRuntime.jsx(BlockView, { block: b }, i))
+        ] }, s.id)),
+        doc.summary ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "mt-14 border-t border-border pt-6 text-[0.9375rem]", children: [
+          /* @__PURE__ */ jsxRuntime.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 BY_SLUG = new Map(FAMILY.map((s) => [s.slug, s]));
+function protocolSite(slug) {
+  return BY_SLUG.get(slug);
+}
+[
+  {
+    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 WORD = {
+  live: "Live",
+  testing: "In testing",
+  "not-yet": "Not yet",
+  paused: "Paused",
+  good: "Good",
+  caution: "Caution",
+  refused: "Refused"
+};
+var TONE2 = {
+  live: "success",
+  testing: "brand",
+  "not-yet": "muted",
+  paused: "muted",
+  good: "success",
+  caution: "brand",
+  refused: "danger"
+};
+function StatusBadge({ status, className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: TONE2[status], "data-status": status, className: cn(className), ...props, children: WORD[status] });
+}
+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__ */ jsxRuntime.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__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(CARD, "gap-4"), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "oca-numeral", children: [
+          pad2(i),
+          " ",
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1.5 capitalize", children: p.verb })
+        ] }),
+        p.status !== "live" ? /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: p.status }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "oca-display-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "a",
+        {
+          href: link === "tool" ? p.toolHref : link === "docs" ? `${DOCS_HREF}/${p.slug}` : p.pageHref,
+          className: STRETCH,
+          children: p.label
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-body", children: p.line }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-auto flex items-center justify-between gap-3 pt-2 text-[0.875rem] text-muted-foreground", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "oca-tabular", children: [
+          "Nostr kind ",
+          p.kinds
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          lucideReact.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__ */ jsxRuntime.jsxs("div", { className: cn(CARD, "gap-3", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "oca-title", children: /* @__PURE__ */ jsxRuntime.jsx("a", { href, className: STRETCH, children: name }) }),
+      status !== "live" ? /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-body text-[0.9375rem]", children: line }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-auto flex items-end justify-between gap-3 pt-3", children: [
+      protocols.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "flex flex-wrap items-center gap-1.5 text-[0.8125rem] text-muted-foreground", children: [
+        "Shows",
+        protocols.map((p) => /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: "muted", children: p }, p))
+      ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+      /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.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__ */ jsxRuntime.jsx("ul", { className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2 md:gap-5", className), children: list.map((s) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(AppCard, { name: s.label, line: s.line, href: s.href, protocols: s.protocols, status: s.status }) }, s.slug)) });
+}
+var fieldBase = [
+  "w-full rounded-xl border border-input bg-card text-foreground placeholder:text-oca-subtle",
+  "text-base md:text-[0.9375rem] outline-none transition-[border-color,box-shadow]",
+  "focus:border-foreground/35 focus:ring-4 focus:ring-[color-mix(in_oklab,var(--oca-orange)_16%,transparent)]",
+  "disabled:cursor-not-allowed disabled:opacity-55",
+  "aria-[invalid=true]:border-destructive aria-[invalid=true]:focus:ring-[color-mix(in_oklab,var(--destructive)_14%,transparent)]"
+];
+var FIELD_SIZE = {
+  md: "h-11 px-3.5",
+  sm: "h-9 rounded-[0.625rem] px-3 md:text-[0.875rem]"
+};
+var Input = react.forwardRef(function Input2({ className, type = "text", size, ...props }, ref) {
+  const density = useDensity();
+  const s = size ?? (density === "compact" ? "sm" : "md");
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "input",
+    {
+      ref,
+      type,
+      "data-ui": "input",
+      "data-size": s,
+      className: cn(fieldBase, FIELD_SIZE[s], className),
+      ...props
+    }
+  );
+});
+var Textarea = react.forwardRef(
+  function Textarea2({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        ref,
+        "data-ui": "textarea",
+        className: cn(fieldBase, "min-h-28 px-3.5 py-3 leading-relaxed", className),
+        ...props
+      }
+    );
+  }
+);
+var Label = react.forwardRef(function Label2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    LabelPrimitive__namespace.Root,
+    {
+      ref,
+      className: cn("text-sm font-medium leading-none text-foreground", className),
+      ...props
+    }
+  );
+});
+function Field({ label, hint, optional, error, children, className, hideLabel, action }) {
+  const id = react.useId();
+  const hintId = hint ? `${id}-hint` : void 0;
+  const errorId = error ? `${id}-error` : void 0;
+  const describedBy = [hintId, errorId].filter(Boolean).join(" ") || void 0;
+  const control = react.isValidElement(children) ? react.cloneElement(children, {
+    id,
+    "aria-describedby": describedBy,
+    "aria-invalid": error ? true : void 0
+  }) : children;
+  const hintNode = hint ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: hintId, className: "text-[0.8125rem] leading-snug text-muted-foreground", children: hint }) : null;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Label, { htmlFor: id, className: hideLabel ? "sr-only" : "flex items-baseline gap-2", children: [
+      label,
+      optional ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.8125rem] font-normal text-muted-foreground", children: "Optional" }) : null
+    ] }),
+    action ? (
+      // The hint belongs to the input, so it sits under the input, not under the button.
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-start", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-2 [&>input]:w-full", children: [
+          control,
+          hintNode
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: action })
+      ] })
+    ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      control,
+      hintNode
+    ] }),
+    error ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, role: "alert", className: "text-[0.8125rem] leading-snug text-destructive", children: error }) : null
+  ] });
+}
+var SelectFieldContext = sharedContext("select-field", null);
+react.forwardRef(function SelectTrigger2({ className, children, size, ...props }, ref) {
+  const density = useDensity();
+  const field = react.useContext(SelectFieldContext);
+  const s = size ?? (density === "compact" ? "sm" : "md");
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    SelectPrimitive__namespace.Trigger,
+    {
+      ref,
+      id: field?.id,
+      "aria-describedby": field?.["aria-describedby"],
+      "aria-invalid": field?.["aria-invalid"],
+      className: cn(fieldBase, FIELD_SIZE[s], "flex items-center justify-between gap-2 text-left", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "size-4 shrink-0 text-muted-foreground" }) })
+      ]
+    }
+  );
+});
+react.forwardRef(function SelectContent2({ className, children, position = "popper", ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    SelectPrimitive__namespace.Content,
+    {
+      ref,
+      position,
+      sideOffset: 6,
+      className: cn(
+        "oca-animate-fade z-50 max-h-[min(24rem,var(--radix-select-content-available-height))] min-w-[var(--radix-select-trigger-width)] overflow-hidden rounded-xl border border-border bg-popover p-1 text-popover-foreground shadow-lg",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Viewport, { children })
+    }
+  ) });
+});
+react.forwardRef(function SelectItem2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    SelectPrimitive__namespace.Item,
+    {
+      ref,
+      className: cn(
+        "relative flex h-10 cursor-default select-none items-center rounded-lg pl-3 pr-9 text-[0.9375rem] outline-none",
+        "data-[highlighted]:bg-accent data-[disabled]:opacity-50",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { className: "absolute right-3", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-4" }) })
+      ]
+    }
+  );
+});
+react.forwardRef(function Checkbox2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    CheckboxPrimitive__namespace.Root,
+    {
+      ref,
+      className: cn(
+        "peer inline-flex size-5 shrink-0 items-center justify-center rounded-[6px] border border-input bg-card",
+        "outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+        "data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(CheckboxPrimitive__namespace.Indicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-3.5", strokeWidth: 3 }) })
+    }
+  );
+});
+react.forwardRef(function Switch2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SwitchPrimitive__namespace.Root,
+    {
+      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",
+        // 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,
+      children: /* @__PURE__ */ jsxRuntime.jsx(SwitchPrimitive__namespace.Thumb, { className: "pointer-events-none block size-5 rounded-full bg-white shadow-sm transition-transform data-[state=checked]:translate-x-5" })
+    }
+  );
+});
+react.forwardRef(function RadioGroup2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Root, { ref, className: cn("grid gap-3", className), ...props });
+});
+react.forwardRef(function RadioGroupItem2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadioGroupPrimitive__namespace.Item,
+    {
+      ref,
+      className: cn(
+        "inline-flex size-5 shrink-0 items-center justify-center rounded-full border border-input bg-card",
+        "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+        "data-[state=checked]:border-primary disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(RadioGroupPrimitive__namespace.Indicator, { className: "block size-2.5 rounded-full bg-primary" })
+    }
+  );
+});
+function ProtocolHero({
+  protocol: protocol2,
+  title,
+  lead,
+  actions,
+  art,
+  children,
+  className
+}) {
+  const p = protocolSite(protocol2);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    PageHero,
+    {
+      className,
+      eyebrow: `Protocol \xB7 ${p.verb}`,
+      title,
+      lead,
+      actions,
+      art,
+      children: p.status !== "live" || children ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-4", children: [
+        p.status !== "live" ? /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: p.status }) : null,
+        children
+      ] }) : null
+    }
+  );
+}
+function ProtocolNav({
+  current,
+  link = "page",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Protocols", className, children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--background)", children: /* @__PURE__ */ jsxRuntime.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 === current;
+    return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsx("span", { className: "font-mono text-[0.8125rem] text-foreground", children: repo }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: facts.map(([k, v]) => k === "Version" ? `v${v}` : k === "Nostr kind" ? `kind ${v}` : v).join(" \xB7 ") }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-auto flex items-center gap-1 text-muted-foreground group-hover:text-foreground", children: [
+            "Read the spec ",
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpRight, { "aria-hidden": true, className: "size-4" })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.875rem] text-muted-foreground", children: "The spec" }),
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "oca-title break-all font-mono text-[1.0625rem] tracking-normal", children: repo })
+      ] }),
+      p.status !== "live" ? /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: p.status }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "grid grid-cols-2 gap-x-6 gap-y-4 sm:grid-cols-4", children: facts.map(([k, v]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-[0.8125rem] text-muted-foreground", children: k }),
+      /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "oca-tabular text-[1.0625rem]", children: v })
+    ] }, k)) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Button, { asChild: true, variant: "secondary", size: "sm", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { href: p.specHref, children: [
+      "Read the spec ",
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.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] = react.useState("");
+  const submit = (e) => {
+    if (!onVerify) return;
+    e.preventDefault();
+    if (value.trim()) onVerify(value.trim());
+  };
+  const button = /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", className: multiline ? void 0 : "w-full sm:w-auto", children: submitLabel });
+  return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+          title ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "oca-title", children: title }) : null,
+          description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-body text-[0.9375rem]", children: description }) : null
+        ] }) : null,
+        multiline ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Field, { label, hint, children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("div", { children: button })
+        ] }) : /* @__PURE__ */ jsxRuntime.jsx(Field, { label, hint, action: button, children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("ul", { "aria-label": label, style, className: cn("divide-y divide-border rounded-[1.25rem] border border-border bg-card", className), children: [
+    /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("span", { children: propertyHeading }),
+          columns.map((c) => /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-title-sm", children: r.label }),
+        r.note ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: r.note }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid grid-cols-2 gap-1", desk === "lg" ? "lg:contents" : "md:contents"), children: columns.map((c) => {
+        return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.CircleCheck, {}), tone: "text-success" },
+  fail: { word: "Failed", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleX, {}), tone: "text-destructive" },
+  pending: { word: "Pending", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, {}), tone: "text-oca-accent-ink" },
+  skipped: { word: "Skipped", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleMinus, {}), tone: "text-muted-foreground" },
+  unchecked: { word: "Not checked", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleDashed, {}), tone: "text-oca-subtle" }
+};
+function VerifyReport({
+  verdict,
+  title,
+  summary,
+  checks,
+  facts,
+  notChecked,
+  actions,
+  as: Heading = "h2",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      "aria-label": "Verification result",
+      className: cn("overflow-hidden rounded-[1.25rem] border border-border bg-card", className),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex flex-col items-start gap-3 p-6 md:p-8", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: verdict }),
+          /* @__PURE__ */ jsxRuntime.jsx(Heading, { className: "oca-display-3", children: title }),
+          summary ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "oca-body max-w-[40rem]", children: summary }) : null
+        ] }),
+        /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-3 px-6 py-3.5 md:px-8", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: cn("mt-0.5 shrink-0 [&_svg]:size-[1.125rem]", k.tone), children: k.icon }),
+            /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.9375rem]", children: c.label }),
+                c.note ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "break-words text-[0.8125rem] leading-snug text-muted-foreground", children: c.note }) : null
+              ] }),
+              /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 border-t border-border bg-muted/50 px-6 py-5 md:px-8", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.875rem] font-medium", children: "What this did not check" }),
+          /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("li", { children: n }, i)) })
+        ] }) : null,
+        actions ? /* @__PURE__ */ jsxRuntime.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] = react.useState("");
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-5", className), children: [
+    lead ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.9375rem] leading-relaxed", children: lead }) : null,
+    wallets ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: wallets }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 text-[0.8125rem] text-muted-foreground", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-px flex-1 bg-border" }),
+        "or sign it in any wallet",
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-px flex-1 bg-border" })
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, { code: message, caption: "Message to sign" }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "form",
+      {
+        className: "flex flex-col gap-4",
+        onSubmit: (e) => {
+          e.preventDefault();
+          if (pasted.trim()) onSignature(pasted.trim());
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Field,
+            {
+              label: "Signature",
+              error,
+              hint: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                "From your wallet\u2019s \u201Csign message\u201D (BIP-322), signed by",
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "break-all font-mono", children: address }),
+                "."
+              ] }),
+              children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", loading: busy, disabled: !pasted.trim(), children: submitLabel }),
+            secondary
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+var isInternal = (href) => href.startsWith("/") || href.startsWith("#");
+function DocLink({ href, className, children, ...rest }) {
+  return isInternal(href) ? /* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { href, className, ...rest, children }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href, className, ...rest, children });
+}
+function Breadcrumbs({ items, action, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex min-h-11 items-center justify-between gap-4 sm:min-h-0", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", className: "min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "flex min-w-0 items-center gap-1.5 text-[0.875rem] text-muted-foreground", children: items.map((c, i) => {
+      const last = i === items.length - 1;
+      return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: cn("flex items-center gap-1.5", last ? "min-w-0" : "shrink-0"), children: [
+        c.href && !last ? /* @__PURE__ */ jsxRuntime.jsx(DocLink, { href: c.href, className: "inline-flex min-h-11 items-center transition-colors hover:text-foreground sm:min-h-0", children: c.label }) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-current": last ? "page" : void 0, className: cn("truncate", last && "text-foreground"), children: c.label }),
+        !last ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { "aria-hidden": true, className: "size-3.5 shrink-0 text-oca-subtle" }) : null
+      ] }, i);
+    }) }) }),
+    action ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 text-[0.875rem]", children: action }) : null
+  ] });
+}
+function DocsPager({ prev, next, className }) {
+  if (!prev && !next) return null;
+  const card = (l, dir) => /* @__PURE__ */ jsxRuntime.jsxs(
+    DocLink,
+    {
+      href: l.href,
+      className: cn(
+        "group flex min-h-20 flex-col justify-center gap-1 rounded-2xl border border-border bg-card px-5 py-4 transition-colors hover:border-oca-hairline-strong",
+        dir === "next" && "items-end text-right sm:col-start-2"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5 text-[0.8125rem] text-muted-foreground", children: [
+          dir === "prev" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { "aria-hidden": true, className: "size-3.5" }) : null,
+          dir === "prev" ? "Previous" : "Next",
+          l.section ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: "\xB7" }) : null,
+          l.section ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: l.section }) : null,
+          dir === "next" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { "aria-hidden": true, className: "size-3.5" }) : null
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: l.label })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("nav", { "aria-label": "Previous and next page", className: cn("grid grid-cols-1 gap-3 border-t border-border pt-8 sm:grid-cols-2", className), children: [
+    prev ? card(prev, "prev") : null,
+    next ? card(next, "next") : null
+  ] });
+}
+function useHeadings(selector = "#docs-content", key) {
+  const [items, setItems] = react.useState([]);
+  react.useEffect(() => {
+    const read = () => {
+      const root = document.querySelector(selector);
+      if (!root) return setItems([]);
+      setItems(
+        Array.from(root.querySelectorAll("h2[id], h3[id]")).map((h) => ({
+          id: h.id,
+          // The anchor link's "#" is not part of the name.
+          label: (h.querySelector("[data-heading-text]") ?? h).textContent?.trim() ?? "",
+          level: h.tagName === "H3" ? 3 : 2
+        }))
+      );
+    };
+    const raf = requestAnimationFrame(read);
+    const t = setTimeout(read, 80);
+    return () => {
+      cancelAnimationFrame(raf);
+      clearTimeout(t);
+    };
+  }, [selector, key]);
+  const activeId = useActiveHeading(items.map((i) => i.id));
+  return { items, activeId };
+}
+function OnThisPage({
+  items,
+  activeId,
+  title = "On this page",
+  onNavigate,
+  className
+}) {
+  const id = react.useId();
+  if (items.length === 0) return null;
+  return (
+    // With no visible title (a folded list under its own summary) the name is still "On this page".
+    /* @__PURE__ */ jsxRuntime.jsxs("nav", { "aria-labelledby": title ? id : void 0, "aria-label": title ? void 0 : "On this page", className, children: [
+      title ? /* @__PURE__ */ jsxRuntime.jsx("p", { id, className: "mb-3 text-[0.875rem] font-medium", children: title }) : null,
+      /* @__PURE__ */ jsxRuntime.jsx("ul", { children: items.map((t) => {
+        const on = t.id === activeId;
+        return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: `#${t.id}`,
+            onClick: onNavigate,
+            "aria-current": on ? "location" : void 0,
+            className: cn(
+              "block border-l py-1.5 text-[0.875rem] leading-snug transition-colors",
+              t.level === 3 ? "pl-7" : "pl-4",
+              on ? "border-foreground text-foreground" : "border-border text-muted-foreground hover:text-foreground"
+            ),
+            children: t.label
+          }
+        ) }, t.id);
+      }) })
+    ] })
+  );
+}
+var CALLOUT_TONE = { note: "neutral", warning: "brand", danger: "danger" };
+function Callout({
+  tone = "note",
+  title,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Notice,
+    {
+      tone: CALLOUT_TONE[tone],
+      title,
+      role: "note",
+      className: cn("my-6 [&_p]:my-0 [&_p]:text-[0.9375rem] [&_p]:leading-relaxed [&_p+p]:mt-3", className),
+      children
+    }
+  );
+}
+function Step({ title, id, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "relative pb-8 pl-11 last:pb-0 [counter-increment:oca-step]", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "absolute left-0 top-0 flex size-7 items-center justify-center rounded-full border border-oca-hairline-strong bg-card text-[0.8125rem] oca-tabular text-foreground before:content-[counter(oca-step)]"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "absolute bottom-1 left-[0.8125rem] top-9 w-px bg-border" }),
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { id, className: "scroll-mt-28 pt-0.5 text-[1.0625rem] font-medium leading-snug tracking-[-0.008em] text-foreground", children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 text-muted-foreground [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", children })
+  ] });
+}
+function Steps({ children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("ol", { className: cn("not-prose my-8 flex flex-col [counter-reset:oca-step] [&>li:last-child>span:nth-child(2)]:hidden", className), children });
+}
+function LinkCard({
+  href,
+  title,
+  description,
+  icon,
+  meta,
+  className
+}) {
+  const Arrow = isInternal(href) ? lucideReact.ArrowRight : lucideReact.ArrowUpRight;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    DocLink,
+    {
+      href,
+      className: cn(
+        "group flex h-full flex-col gap-3 rounded-[1.25rem] border border-border bg-card p-5 transition-colors hover:border-oca-hairline-strong",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-start justify-between gap-3", children: [
+          icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground [&_svg]:size-[1.125rem]", children: icon }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex shrink-0 items-center gap-2", children: [
+            meta,
+            /* @__PURE__ */ jsxRuntime.jsx(Arrow, { "aria-hidden": true, className: "size-4 text-muted-foreground transition-transform group-hover:translate-x-0.5 group-hover:text-foreground" })
+          ] })
+        ] }),
+        icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[1rem] font-medium leading-snug text-foreground", children: title }) : null,
+        description ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.9375rem] leading-relaxed text-muted-foreground", children: description }) : null
+      ]
+    }
+  );
+}
+function CardGrid({ columns = 2, children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("not-prose my-6 grid grid-cols-1 gap-3 sm:grid-cols-2", columns === 3 && "lg:grid-cols-3", className), children });
+}
+function MdxTable({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "not-prose my-6 overflow-hidden rounded-2xl border border-border bg-card", children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "table",
+    {
+      className: cn(
+        "w-full border-collapse text-left text-[0.875rem] leading-relaxed",
+        "[&_th]:whitespace-nowrap [&_th]:border-b [&_th]:border-oca-hairline-strong [&_th]:bg-oca-table-head [&_th]:px-4 [&_th]:py-2.5 [&_th]:text-[0.8125rem] [&_th]:font-medium [&_th]:text-foreground",
+        "[&_td]:border-t [&_td]:border-border [&_td]:px-4 [&_td]:py-2.5 [&_td]:align-top [&_td]:text-muted-foreground [&_tbody_tr:first-child_td]:border-t-0",
+        "[&_td_code]:bg-transparent [&_td_code]:p-0 [&_td_code]:text-foreground [&_td:first-child]:text-foreground",
+        "[&_[align=center]]:text-center [&_[align=right]]:text-right",
+        // On a phone a cell keeps a readable width; the table scrolls instead of crushing it.
+        "max-sm:[&_td]:min-w-[9rem]",
+        className
+      ),
+      ...props
+    }
+  ) }) });
+}
+function ApiTable({
+  rows,
+  caption,
+  nameHeader = "Name",
+  className
+}) {
+  const hasDefault = rows.some((r) => r.default !== void 0);
+  const marks = (r) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    r.required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.75rem] text-oca-accent-ink", children: "Required" }) : null,
+    r.deprecated ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: "muted", children: "Deprecated" }) : null,
+    r.status ? /* @__PURE__ */ jsxRuntime.jsx(StatusBadge, { status: r.status }) : null
+  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("not-prose my-6", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-2xl border border-border bg-card max-sm:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxRuntime.jsxs("table", { className: "w-full border-collapse text-left text-[0.875rem]", children: [
+      caption ? /* @__PURE__ */ jsxRuntime.jsx("caption", { className: "sr-only", children: caption }) : null,
+      /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "border-b border-oca-hairline-strong bg-oca-table-head text-[0.8125rem]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: nameHeader }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Type" }),
+        hasDefault ? /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Default" }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "col", className: "px-4 py-2.5 font-medium", children: "Description" })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: "divide-y divide-border", children: rows.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: "align-top", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("th", { scope: "row", className: "px-4 py-3 text-left font-normal", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col items-start gap-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("code", { className: cn("font-mono text-[0.8125rem] text-foreground", r.deprecated && "line-through decoration-oca-subtle"), children: r.name }),
+          marks(r)
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 font-mono text-[0.8125rem] text-muted-foreground", children: r.type ?? "\u2014" }),
+        hasDefault ? /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 font-mono text-[0.8125rem] text-muted-foreground", children: r.default ?? "\u2014" }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-4 py-3 leading-relaxed text-muted-foreground", children: r.description })
+      ] }, r.name)) })
+    ] }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { "aria-label": caption, className: "divide-y divide-border rounded-2xl border border-border bg-card sm:hidden", children: rows.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex flex-col gap-1.5 px-4 py-3.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-wrap items-baseline gap-x-2 gap-y-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("code", { className: cn("font-mono text-[0.875rem] text-foreground", r.deprecated && "line-through decoration-oca-subtle"), children: r.name }),
+        r.type ? /* @__PURE__ */ jsxRuntime.jsx("code", { className: "break-all font-mono text-[0.8125rem] text-muted-foreground", children: r.type }) : null
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex flex-wrap items-center gap-2 empty:hidden", children: marks(r) }),
+      r.description ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.875rem] leading-relaxed text-muted-foreground", children: r.description }) : null,
+      r.default !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[0.8125rem] text-muted-foreground", children: [
+        "Default ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { className: "font-mono text-foreground", children: r.default })
+      ] }) : null
+    ] }, r.name)) })
+  ] });
+}
+function useDarkMode() {
+  const [dark, setDark] = react.useState(false);
+  react.useEffect(() => {
+    const root = document.documentElement;
+    const read = () => setDark(root.classList.contains("dark"));
+    read();
+    const mo = new MutationObserver(read);
+    mo.observe(root, { attributes: true, attributeFilter: ["class"] });
+    return () => mo.disconnect();
+  }, []);
+  return dark;
+}
+function mermaidTheme(el) {
+  const css = getComputedStyle(el);
+  const v = (name) => css.getPropertyValue(name).trim();
+  const card = v("--card");
+  const muted = v("--muted");
+  const text = v("--foreground");
+  const subtle = v("--muted-foreground");
+  const line = v("--input");
+  const hair = v("--oca-hairline-strong");
+  return {
+    background: "transparent",
+    fontFamily: css.fontFamily,
+    fontSize: "14px",
+    textColor: text,
+    mainBkg: card,
+    primaryColor: card,
+    primaryTextColor: text,
+    primaryBorderColor: hair,
+    secondaryColor: muted,
+    secondaryTextColor: text,
+    secondaryBorderColor: hair,
+    tertiaryColor: muted,
+    tertiaryTextColor: text,
+    tertiaryBorderColor: hair,
+    nodeBorder: hair,
+    lineColor: line,
+    edgeLabelBackground: card,
+    clusterBkg: muted,
+    clusterBorder: hair,
+    titleColor: text,
+    noteBkgColor: muted,
+    noteTextColor: text,
+    noteBorderColor: hair,
+    actorBkg: card,
+    actorBorder: hair,
+    actorTextColor: text,
+    actorLineColor: line,
+    signalColor: text,
+    signalTextColor: text,
+    labelBoxBkgColor: card,
+    labelBoxBorderColor: hair,
+    labelTextColor: text,
+    loopTextColor: subtle,
+    activationBkgColor: muted,
+    activationBorderColor: hair,
+    sequenceNumberColor: card
+  };
+}
+function naturalSize(svg) {
+  const w = svg.match(/viewBox="[\d.-]+ [\d.-]+ ([\d.]+) [\d.]+"/)?.[1];
+  if (!w) return svg;
+  return svg.replace(/<svg([^>]*?)\swidth="100%"/, `<svg$1 width="${Math.ceil(Number(w))}"`).replace(/max-width:\s*[\d.]+px;?/, "");
+}
+function Diagram({ chart, caption, load, className }) {
+  const ref = react.useRef(null);
+  const dark = useDarkMode();
+  const raw = react.useId();
+  const [svg, setSvg] = react.useState(null);
+  const [failed, setFailed] = react.useState(false);
+  react.useEffect(() => {
+    let live = true;
+    const el = ref.current;
+    if (!el) return;
+    (async () => {
+      try {
+        const mod = await load();
+        const mermaid = "default" in mod ? mod.default : mod;
+        mermaid.initialize({ startOnLoad: false, securityLevel: "strict", theme: "base", themeVariables: mermaidTheme(el) });
+        const { svg: drawn } = await mermaid.render(`oca-diagram-${raw.replace(/[^a-zA-Z0-9]/g, "")}-${dark ? "d" : "l"}`, chart);
+        if (live) {
+          setSvg(naturalSize(drawn));
+          setFailed(false);
+        }
+      } catch {
+        if (live) setFailed(true);
+      }
+    })();
+    return () => {
+      live = false;
+    };
+  }, [chart, dark, load, raw]);
+  if (failed) return /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, { code: chart, caption: "Diagram (shown as its source)", className: cn("my-6", className) });
+  return /* @__PURE__ */ jsxRuntime.jsxs("figure", { ref, className: cn("not-prose my-6 overflow-hidden rounded-[1.25rem] border border-border bg-card", className), children: [
+    svg ? /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--card)", children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "flex w-max min-w-full justify-center p-6 [&_svg]:h-auto [&_svg]:max-w-none",
+        role: "img",
+        "aria-label": typeof caption === "string" ? caption : "Diagram",
+        dangerouslySetInnerHTML: { __html: svg }
+      }
+    ) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { role: "status", "aria-label": "Drawing the diagram", className: "p-6", children: /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-40 w-full rounded-xl" }) }),
+    caption ? /* @__PURE__ */ jsxRuntime.jsx("figcaption", { className: "border-t border-border px-5 py-3 text-[0.8125rem] text-muted-foreground", children: caption }) : null
+  ] });
+}
+var HEADING = {
+  h1: "oca-display-3 mb-4 text-foreground",
+  h2: "mb-3 mt-12 text-[1.375rem] font-medium leading-tight tracking-[-0.015em] text-foreground md:text-[1.5rem]",
+  h3: "mb-2 mt-9 text-[1.125rem] font-medium leading-snug tracking-[-0.01em] text-foreground",
+  h4: "mb-2 mt-7 text-[1rem] font-medium leading-snug text-foreground"
+};
+function DocsHeading({
+  as: Tag,
+  id,
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Tag, { id, className: cn("group scroll-mt-28", HEADING[Tag], className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { "data-heading-text": "", children }),
+    id && Tag !== "h1" ? /* @__PURE__ */ jsxRuntime.jsxs(
+      "a",
+      {
+        href: `#${id}`,
+        className: "ml-2 inline-block rounded-md px-1 align-baseline text-[0.85em] font-normal text-oca-subtle no-underline opacity-0 transition-opacity hover:text-foreground focus-visible:opacity-100 group-hover:opacity-100",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: "#" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Link to this section" })
+        ]
+      }
+    ) : null
+  ] });
+}
+function useMacKeys() {
+  const [mac, setMac] = react.useState(true);
+  react.useEffect(() => {
+    setMac(/Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent));
+  }, []);
+  return mac;
+}
+var typing = (el) => el instanceof HTMLElement && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName));
+var SearchButton = react.forwardRef(function SearchButton2({ label = "Search", onClick, className }, ref) {
+  const mac = useMacKeys();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      onClick,
+      "aria-keyshortcuts": mac ? "Meta+K" : "Control+K",
+      className: cn(
+        "inline-flex size-10 items-center justify-center gap-2 rounded-full text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
+        "md:h-10 md:w-56 md:justify-start md:border md:border-border md:bg-card md:pl-3.5 md:pr-2 md:hover:border-oca-hairline-strong md:hover:bg-card",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { "aria-hidden": true, className: "size-[1.125rem] shrink-0 md:size-4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only flex-1 text-left text-[0.9375rem] md:not-sr-only", children: label }),
+        /* @__PURE__ */ jsxRuntime.jsx(Kbd, { "aria-hidden": true, className: "hidden md:inline-flex", children: mac ? "\u2318K" : "Ctrl K" })
+      ]
+    }
+  );
+});
+function SearchDialog({
+  onQuery,
+  open: openProp,
+  onOpenChange,
+  onSelect,
+  button = true,
+  hotkey = true,
+  label = "Search",
+  placeholder = "Search the docs",
+  idle,
+  defaultQuery = "",
+  debounceMs = 120,
+  className
+}) {
+  const [own, setOwn] = react.useState(false);
+  const open = openProp ?? own;
+  const setOpen = (v) => {
+    if (openProp === void 0) setOwn(v);
+    onOpenChange?.(v);
+  };
+  const [query, setQuery] = react.useState(defaultQuery);
+  const [groups, setGroups] = react.useState([]);
+  const [state, setState] = react.useState("idle");
+  const [active, setActive] = react.useState(0);
+  const listId = react.useId();
+  const listRef = react.useRef(null);
+  const buttonRef = react.useRef(null);
+  const returnTo = react.useRef(null);
+  const flat = react.useMemo(() => groups.flatMap((g) => g.results), [groups]);
+  const latest = react.useRef({ open, setOpen, onQuery });
+  latest.current = { open, setOpen, onQuery };
+  react.useEffect(() => {
+    if (!hotkey) return;
+    const onKey = (e) => {
+      const { open: isOpen, setOpen: set } = latest.current;
+      if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k") {
+        e.preventDefault();
+        set(!isOpen);
+      } else if (e.key === "/" && !isOpen && !typing(e.target)) {
+        e.preventDefault();
+        set(true);
+      }
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [hotkey]);
+  react.useEffect(() => {
+    const q = query.trim();
+    if (!q) {
+      setGroups([]);
+      setState("idle");
+      return;
+    }
+    const ctl = new AbortController();
+    setState("loading");
+    const t = setTimeout(async () => {
+      try {
+        const out = await latest.current.onQuery(q, ctl.signal);
+        if (ctl.signal.aborted) return;
+        setGroups(out.filter((g) => g.results.length > 0));
+        setActive(0);
+        setState("done");
+      } catch {
+        if (!ctl.signal.aborted) setState("error");
+      }
+    }, debounceMs);
+    return () => {
+      clearTimeout(t);
+      ctl.abort();
+    };
+  }, [query, debounceMs]);
+  react.useEffect(() => {
+    listRef.current?.querySelector('[aria-selected="true"]')?.scrollIntoView({ block: "nearest" });
+  }, [active]);
+  const choose = (r) => {
+    setOpen(false);
+    if (onSelect) onSelect(r);
+    else window.location.assign(r.href);
+  };
+  const optionId = (i) => `${listId}-o${i}`;
+  const showList = state === "done" && flat.length > 0;
+  let index = -1;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    button ? /* @__PURE__ */ jsxRuntime.jsx(SearchButton, { ref: buttonRef, label, onClick: () => setOpen(true), className }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Portal, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Overlay, { className: "oca-animate-fade fixed inset-0 z-50 bg-[rgb(10_10_10/0.38)] backdrop-blur-[2px]" }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        DialogPrimitive__namespace.Content,
+        {
+          "aria-describedby": void 0,
+          onOpenAutoFocus: () => {
+            const el = document.activeElement;
+            returnTo.current = el instanceof HTMLElement && el !== document.body ? el : null;
+          },
+          onCloseAutoFocus: (e) => {
+            const back = returnTo.current?.isConnected ? returnTo.current : buttonRef.current;
+            if (back) {
+              e.preventDefault();
+              back.focus();
+            }
+          },
+          className: "oca-animate-rise fixed left-1/2 top-3 z-50 flex max-h-[calc(100dvh-1.5rem)] w-[calc(100vw-1.5rem)] -translate-x-1/2 flex-col overflow-hidden rounded-[1.5rem] border border-border bg-popover text-popover-foreground shadow-xl outline-none sm:top-[12vh] sm:max-h-[min(36rem,76vh)] sm:w-[min(92vw,40rem)]",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Title, { className: "sr-only", children: label }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-14 shrink-0 items-center gap-3 border-b border-border pl-5 pr-3", children: [
+              state === "loading" ? /* @__PURE__ */ jsxRuntime.jsx(Spinner, { className: "size-[1.125rem] text-muted-foreground" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { "aria-hidden": true, className: "size-[1.125rem] shrink-0 text-muted-foreground" }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "input",
+                {
+                  autoFocus: true,
+                  value: query,
+                  onChange: (e) => setQuery(e.target.value),
+                  onKeyDown: (e) => {
+                    if (!showList) return;
+                    if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+                      e.preventDefault();
+                      const d = e.key === "ArrowDown" ? 1 : -1;
+                      setActive((a) => (a + d + flat.length) % flat.length);
+                    } else if (e.key === "Enter" && flat[active]) {
+                      e.preventDefault();
+                      choose(flat[active]);
+                    }
+                  },
+                  placeholder,
+                  role: "combobox",
+                  "aria-label": label,
+                  "aria-expanded": showList,
+                  "aria-controls": listId,
+                  "aria-autocomplete": "list",
+                  "aria-activedescendant": showList ? optionId(active) : void 0,
+                  spellCheck: false,
+                  autoComplete: "off",
+                  className: "h-full min-w-0 flex-1 bg-transparent text-base text-foreground outline-none placeholder:text-oca-subtle"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "inline-flex h-8 shrink-0 items-center rounded-md border border-border px-2 text-[0.75rem] text-muted-foreground transition-colors hover:text-foreground", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sm:hidden", children: "Close" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-sm:hidden", "aria-hidden": true, children: "Esc" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only max-sm:hidden", children: "Close search" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: listRef, className: "min-h-0 flex-1 overflow-y-auto overscroll-contain p-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { id: listId, role: "listbox", "aria-label": "Results", className: cn(!showList && "hidden"), children: groups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs("div", { role: "group", "aria-label": typeof g.label === "string" ? g.label : void 0, className: "pb-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { "aria-hidden": true, className: "px-3 pb-1.5 pt-3 text-[0.8125rem] text-muted-foreground", children: g.label }),
+                g.results.map((r) => {
+                  index++;
+                  const i = index;
+                  const on = i === active;
+                  return /* @__PURE__ */ jsxRuntime.jsxs(
+                    "a",
+                    {
+                      id: optionId(i),
+                      href: r.href,
+                      role: "option",
+                      "aria-selected": on,
+                      tabIndex: -1,
+                      onMouseMove: () => setActive(i),
+                      onClick: (e) => {
+                        if (e.metaKey || e.ctrlKey || e.shiftKey) return;
+                        e.preventDefault();
+                        choose(r);
+                      },
+                      className: cn(
+                        "flex items-start gap-3 rounded-xl px-3 py-2.5 transition-colors",
+                        on ? "bg-accent" : "hover:bg-accent"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[0.9375rem] font-medium text-foreground", children: r.title }),
+                          r.section ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[0.8125rem] text-muted-foreground", children: r.section }) : null,
+                          r.excerptHtml ? /* @__PURE__ */ jsxRuntime.jsx(
+                            "span",
+                            {
+                              className: "line-clamp-2 text-[0.875rem] leading-snug text-muted-foreground [&_mark]:rounded-sm [&_mark]:bg-[color-mix(in_oklab,var(--oca-orange)_22%,transparent)] [&_mark]:px-0.5 [&_mark]:text-foreground",
+                              dangerouslySetInnerHTML: { __html: r.excerptHtml }
+                            }
+                          ) : r.excerpt ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "line-clamp-2 text-[0.875rem] leading-snug text-muted-foreground", children: r.excerpt }) : null
+                        ] }),
+                        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CornerDownLeft, { "aria-hidden": true, className: cn("mt-1 size-4 shrink-0 text-muted-foreground", !on && "invisible") })
+                      ]
+                    },
+                    r.id
+                  );
+                })
+              ] }, gi)) }),
+              state === "idle" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 py-6 text-[0.9375rem] text-muted-foreground", children: idle ?? "Type a word: a protocol, a function, an error." }) : null,
+              state === "done" && flat.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("p", { role: "status", className: "px-3 py-6 text-[0.9375rem] text-muted-foreground", children: [
+                "No results for \u201C",
+                query.trim(),
+                "\u201D."
+              ] }) : null,
+              state === "error" ? /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", className: "px-3 py-6 text-[0.9375rem] text-muted-foreground", children: "Search is not available right now. Try again in a moment." }) : null
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { "aria-hidden": true, className: "hidden shrink-0 items-center gap-4 border-t border-border px-5 py-2.5 text-[0.75rem] text-muted-foreground sm:flex", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: "\u2191" }),
+                /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: "\u2193" }),
+                " to move"
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: "\u21B5" }),
+                " to open"
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Kbd, { children: "esc" }),
+                " to close"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-live": "polite", className: "sr-only", children: state === "done" ? `${flat.length} result${flat.length === 1 ? "" : "s"}` : "" })
+          ]
+        }
+      )
+    ] }) })
+  ] });
+}
+function pretty(content) {
+  try {
+    return JSON.stringify(JSON.parse(content), null, 2);
+  } catch {
+    return null;
+  }
+}
+function download(content, filename, mime) {
+  const url = URL.createObjectURL(new Blob([content], { type: mime }));
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+  setTimeout(() => URL.revokeObjectURL(url), 0);
+}
+var BAR_BUTTON = "inline-flex h-7 items-center gap-1.5 rounded-full px-2.5 text-[0.75rem] text-oca-ink-subtle transition-colors hover:bg-white/10 hover:text-white";
+function ArtifactView({
+  content,
+  title,
+  filename,
+  mime,
+  defaultView = "formatted",
+  maxLines = 28,
+  className
+}) {
+  const formatted = react.useMemo(() => pretty(content), [content]);
+  const [view, setView] = react.useState(formatted ? defaultView : "raw");
+  const shown = view === "formatted" && formatted ? formatted : content;
+  const json = formatted !== null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    CodeBlock,
+    {
+      code: shown,
+      lang: json ? "json" : void 0,
+      caption: title,
+      maxLines,
+      className,
+      actions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        json ? /* @__PURE__ */ jsxRuntime.jsx("span", { role: "group", "aria-label": "View", className: "mr-1 flex items-center rounded-full bg-white/[0.06] p-0.5", children: ["formatted", "raw"].map((v) => /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-pressed": view === v,
+            onClick: () => setView(v),
+            className: cn(
+              "h-7 rounded-full px-2.5 text-[0.75rem] transition-colors",
+              view === v ? "bg-white/[0.12] text-white" : "text-oca-ink-subtle hover:text-white"
+            ),
+            children: v === "formatted" ? "Formatted" : "Raw"
+          },
+          v
+        )) }) : null,
+        filename ? /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => download(content, filename, mime ?? (json ? "application/json" : "text/plain")),
+            className: BAR_BUTTON,
+            "aria-label": `Download ${filename}`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { "aria-hidden": true, className: "size-3.5" }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-sm:hidden", children: "Download" })
+            ]
+          }
+        ) : null
+      ] })
+    }
+  );
+}
+function DropZone({
+  onFile,
+  onText,
+  accept,
+  title = "Drop a file here, or choose one",
+  hint,
+  privacy = "It stays in your browser. Only its hash leaves this page.",
+  file,
+  progress,
+  progressLabel = "Hashing",
+  onClear,
+  error,
+  disabled = false,
+  className
+}) {
+  const input = react.useRef(null);
+  const [over, setOver] = react.useState(false);
+  const depth = react.useRef(0);
+  const [mode, setMode] = react.useState("file");
+  const [text, setText] = react.useState("");
+  const errorId = react.useId();
+  const titleId = react.useId();
+  const busy = progress !== null && progress !== void 0;
+  const pct = busy ? Math.round(Math.max(0, Math.min(1, progress)) * 100) : 0;
+  const take = (f) => {
+    if (f && !disabled) onFile(f);
+  };
+  const privacyLine = privacy === null ? null : /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "flex items-start gap-2 text-[0.8125rem] leading-snug text-muted-foreground", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { "aria-hidden": true, className: "mt-0.5 size-3.5 shrink-0" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { children: privacy })
+  ] });
+  if (mode === "text" && onText) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-3", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Textarea,
+        {
+          value: text,
+          onChange: (e) => setText(e.target.value),
+          rows: 6,
+          "aria-label": "Text",
+          "aria-describedby": error ? errorId : void 0,
+          "aria-invalid": error ? true : void 0,
+          placeholder: "Paste the text here",
+          className: "font-mono text-base md:text-[0.875rem]"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", disabled: !text.trim() || disabled, onClick: () => onText(text), children: "Use this text" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "ghost", onClick: () => setMode("file"), children: "Choose a file instead" })
+      ] }),
+      error ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, role: "alert", className: "text-[0.8125rem] text-destructive", children: error }) : null,
+      privacyLine
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-3", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        role: "group",
+        "aria-labelledby": titleId,
+        "aria-describedby": error ? errorId : void 0,
+        "aria-busy": busy || void 0,
+        onDragEnter: (e) => {
+          e.preventDefault();
+          depth.current++;
+          if (!disabled) setOver(true);
+        },
+        onDragOver: (e) => e.preventDefault(),
+        onDragLeave: () => {
+          depth.current = Math.max(0, depth.current - 1);
+          if (depth.current === 0) setOver(false);
+        },
+        onDrop: (e) => {
+          e.preventDefault();
+          depth.current = 0;
+          setOver(false);
+          take(e.dataTransfer.files?.[0]);
+        },
+        className: cn(
+          "relative flex flex-col gap-3 rounded-[1.25rem] border border-dashed transition-colors",
+          file ? "px-4 py-4 sm:px-5" : "items-center px-5 py-8 text-center md:py-10",
+          over ? "border-foreground bg-accent" : "border-oca-hairline-strong bg-card",
+          error && "border-destructive",
+          disabled && "opacity-55"
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              ref: input,
+              type: "file",
+              accept,
+              disabled,
+              tabIndex: -1,
+              "aria-hidden": true,
+              className: "sr-only",
+              onChange: (e) => {
+                take(e.target.files?.[0]);
+                e.target.value = "";
+              }
+            }
+          ),
+          file ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-muted text-foreground", children: busy ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { "aria-hidden": true, className: "size-5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": true, className: "size-5" }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { id: titleId, className: "truncate text-[0.9375rem] font-medium", title: file.name, children: file.name }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[0.8125rem] text-muted-foreground", children: [formatBytes(file.size), file.type].filter(Boolean).join(" \xB7 ") })
+              ] }),
+              !busy && onClear ? /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "secondary", onClick: onClear, disabled, className: "shrink-0", children: "Choose another" }) : null
+            ] }),
+            busy ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  role: "progressbar",
+                  "aria-valuemin": 0,
+                  "aria-valuemax": 100,
+                  "aria-valuenow": pct,
+                  "aria-label": typeof progressLabel === "string" ? progressLabel : "Progress",
+                  className: "h-1.5 overflow-hidden rounded-full bg-muted",
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full rounded-full bg-foreground transition-[width] duration-200", style: { width: `${pct}%` } })
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[0.8125rem] text-muted-foreground oca-tabular", children: [
+                progressLabel,
+                " ",
+                pct,
+                "%"
+              ] })
+            ] }) : null
+          ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-11 items-center justify-center rounded-full bg-muted text-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { "aria-hidden": true, className: "size-5" }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("p", { id: titleId, className: "text-[1rem] font-medium", children: over ? "Drop it to add it" : title }),
+              hint ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.875rem] text-muted-foreground", children: hint }) : null
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex flex-wrap items-center justify-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "secondary", disabled, onClick: () => input.current?.click(), children: "Choose a file" }),
+              onText ? /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", variant: "ghost", disabled, onClick: () => setMode("text"), children: "Paste text instead" }) : null
+            ] })
+          ] })
+        ]
+      }
+    ),
+    error ? /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, role: "alert", className: "text-[0.8125rem] text-destructive", children: error }) : null,
+    privacyLine
+  ] });
+}
+function FormSection({
+  n,
+  title,
+  hint,
+  status,
+  action,
+  as: Heading = "h2",
+  id,
+  children,
+  className
+}) {
+  const titleId = react.useId();
+  const tight = useDensity() === "compact";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      id,
+      "aria-labelledby": titleId,
+      "aria-current": status === "current" ? "step" : void 0,
+      className: cn("scroll-mt-24 rounded-[1.25rem] border border-border bg-card", className),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("header", { className: cn("flex items-start gap-3.5", tight ? "px-5 pt-5" : "px-6 pt-6"), children: [
+          n !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "aria-hidden": true,
+              className: cn(
+                "mt-px flex size-7 shrink-0 items-center justify-center rounded-full border text-[0.8125rem] oca-tabular",
+                status === "done" && "border-primary bg-primary text-primary-foreground",
+                status === "current" && "border-brand text-oca-accent-ink",
+                status === "blocked" && "border-destructive text-destructive",
+                (status === "upcoming" || status === void 0) && "border-oca-hairline-strong text-muted-foreground"
+              ),
+              children: status === "done" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-3.5", strokeWidth: 3 }) : n
+            }
+          ) : null,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(Heading, { id: titleId, className: "text-[1.0625rem] font-medium leading-snug tracking-[-0.008em]", children: [
+              n !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "sr-only", children: [
+                "Step ",
+                n,
+                ": "
+              ] }) : null,
+              title,
+              status === "done" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: " (done)" }) : null
+            ] }),
+            hint ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: hint }) : null
+          ] }),
+          action ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: action }) : null
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col", tight ? "gap-4 p-5" : "gap-5 p-6", n !== void 0 && (tight ? "sm:pl-[3.875rem]" : "sm:pl-[4.125rem]")), children })
+      ]
+    }
+  );
+}
+var STATE_TONE = { good: "success", attention: "brand", bad: "danger", neutral: "neutral", quiet: "muted" };
+function StateBadge({
+  tone = "neutral",
+  children,
+  title,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: STATE_TONE[tone], title, className, children });
+}
+function createStateBadge(states) {
+  function ProtocolStateBadge({ state, className }) {
+    const def = states[state];
+    if (!def) {
+      if (typeof process !== "undefined" && process.env.NODE_ENV !== "production") {
+        console.warn(`StateBadge: no state "${state}"; known: ${Object.keys(states).join(", ")}`);
+      }
+      return /* @__PURE__ */ jsxRuntime.jsx(StateBadge, { className, children: String(state) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(StateBadge, { tone: def.tone, title: def.hint, className, children: def.label });
+  }
+  return ProtocolStateBadge;
+}
+function BlockHeight({
+  height,
+  label = false,
+  link = true,
+  network = "mainnet",
+  className
+}) {
+  const text = `${label ? "block " : ""}${formatBlockHeight(height)}`;
+  if (!link) return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("oca-tabular", className), children: text });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "a",
+    {
+      href: explorerUrl("block", Math.trunc(height), network),
+      target: "_blank",
+      rel: "noreferrer",
+      title: `Block ${formatBlockHeight(height)} on mempool.space`,
+      className: cn("oca-tabular underline decoration-foreground/35 underline-offset-4 hover:decoration-foreground", className),
+      children: [
+        text,
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: " (opens mempool.space in a new tab)" })
+      ]
+    }
+  );
+}
+var ANCHOR = {
+  anchored: { label: "Anchored", tone: "good" },
+  pending: { label: "Anchor pending", tone: "attention" },
+  unverified: { label: "Not checked", tone: "quiet" },
+  none: { label: "Not anchored", tone: "quiet" },
+  fail: { label: "Does not check out", tone: "bad" }
+};
+function hostOf(url) {
+  try {
+    return new URL(url).host;
+  } catch {
+    return url;
+  }
+}
+function AnchorStatus({
+  state,
+  blockHeight,
+  blockTime,
+  submittedAt,
+  calendar,
+  message,
+  network = "mainnet",
+  variant = "detail",
+  className
+}) {
+  const def = ANCHOR[state];
+  const block = blockHeight !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(BlockHeight, { height: blockHeight, label: true, network }) : null;
+  const line = message ?? (state === "anchored" ? block ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    "In ",
+    block,
+    blockTime !== void 0 ? ` \xB7 ${formatUtc(blockTime)}` : null
+  ] }) : "Its hash is in a Bitcoin block." : state === "pending" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    "Submitted",
+    submittedAt !== void 0 ? ` ${formatUtc(submittedAt)}` : "",
+    " to",
+    " ",
+    calendar ? hostOf(calendar) : "an OpenTimestamps calendar",
+    ". Waiting for a Bitcoin block."
+  ] }) : state === "unverified" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    "The proof names ",
+    block ?? "a block",
+    ", but its header could not be fetched to check it."
+  ] }) : state === "fail" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    "The proof does not lead to ",
+    block ?? "the block it names",
+    "."
+  ] }) : "No timestamp yet. The signature still checks offline.");
+  if (variant === "badge") {
+    const plain = typeof line === "string" ? line : void 0;
+    return /* @__PURE__ */ jsxRuntime.jsx(StateBadge, { tone: def.tone, title: plain, className, children: def.label });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col items-start gap-1.5", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(StateBadge, { tone: def.tone, children: def.label }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.875rem] leading-snug text-muted-foreground", children: line })
+  ] });
+}
+function BlockCountdown({
+  target,
+  tip,
+  from,
+  reached = "Reached",
+  minutesPerBlock = 10,
+  network = "mainnet",
+  className
+}) {
+  const known = typeof tip === "number";
+  const left = known ? target - tip : null;
+  const done = left !== null && left <= 0;
+  const share = known && from !== void 0 && target > from ? Math.min(1, Math.max(0, (tip - from) / (target - from))) : null;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.9375rem] leading-snug", children: !known ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      "At ",
+      /* @__PURE__ */ jsxRuntime.jsx(BlockHeight, { height: target, label: true, network })
+    ] }) : done ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      reached,
+      " at ",
+      /* @__PURE__ */ jsxRuntime.jsx(BlockHeight, { height: target, label: true, network })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      "In ",
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-tabular font-medium", children: formatBlockHeight(left) }),
+      " block",
+      left === 1 ? "" : "s",
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground", children: [
+        ", ",
+        blocksToDuration(left, minutesPerBlock)
+      ] })
+    ] }) }),
+    share !== null ? /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        role: "progressbar",
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-valuenow": Math.round(share * 100),
+        "aria-label": "Blocks passed",
+        className: "h-1.5 overflow-hidden rounded-full bg-muted",
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full rounded-full bg-foreground", style: { width: `${share * 100}%` } })
+      }
+    ) : null,
+    known && !done ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-[0.8125rem] text-muted-foreground", children: [
+      "Target ",
+      /* @__PURE__ */ jsxRuntime.jsx(BlockHeight, { height: target, network }),
+      " \xB7 tip ",
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-tabular", children: formatBlockHeight(tip) })
+    ] }) : null
+  ] });
+}
+function Meter({
+  value,
+  max,
+  ghost,
+  label,
+  figure,
+  tone = "ink",
+  size = "md",
+  className
+}) {
+  const id = react.useId();
+  const total = max > 0 ? max : 1;
+  const v = Math.max(0, Math.min(1, value / total));
+  const g = ghost ? Math.max(0, Math.min(1 - v, ghost / total)) : 0;
+  const pct = `${Math.round(v * 100)}%`;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-4 text-[0.875rem]", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { id, className: "min-w-0 truncate", children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 oca-tabular text-muted-foreground", children: figure ?? pct })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        role: "meter",
+        "aria-labelledby": id,
+        "aria-valuemin": 0,
+        "aria-valuemax": max,
+        "aria-valuenow": value,
+        "aria-valuetext": typeof figure === "string" ? figure : pct,
+        className: cn("flex overflow-hidden rounded-full bg-muted", size === "sm" ? "h-1.5" : "h-2.5"),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn("h-full shrink-0 rounded-full", tone === "brand" ? "bg-oca-orange-deep" : "bg-foreground"),
+              style: { width: `${v * 100}%` }
+            }
+          ),
+          g > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              "aria-hidden": true,
+              className: "-ml-1.5 h-full shrink-0 rounded-r-full pl-1.5 text-foreground/45",
+              style: {
+                width: `calc(${g * 100}% + 0.375rem)`,
+                backgroundImage: "repeating-linear-gradient(-45deg, currentColor 0 2px, transparent 2px 6px)"
+              }
+            }
+          ) : null
+        ]
+      }
+    )
+  ] });
+}
+function FilterChips({
+  options,
+  value,
+  onChange,
+  label,
+  className
+}) {
+  const tight = useDensity() === "compact";
+  const multi = Array.isArray(value);
+  const isOn = (v) => multi ? value.includes(v) : value === v;
+  const press = (v) => {
+    if (multi) {
+      const cur = value;
+      onChange(cur.includes(v) ? cur.filter((x) => x !== v) : [...cur, v]);
+    } else onChange(v);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(ScrollFade, { fade: "var(--background)", className: cn("w-full", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { role: "group", "aria-label": label, className: "flex w-max items-center gap-2 py-0.5", children: options.map((o) => {
+    const on = isOn(o.value);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        "aria-pressed": on,
+        onClick: () => press(o.value),
+        className: cn(
+          "inline-flex shrink-0 items-center gap-1.5 rounded-full border px-3.5 text-[0.875rem] transition-colors",
+          tight ? "h-8" : "h-9",
+          on ? "border-foreground bg-foreground text-background" : "border-border bg-card text-muted-foreground hover:border-oca-hairline-strong hover:text-foreground"
+        ),
+        children: [
+          o.label,
+          o.count !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oca-tabular", children: o.count.toLocaleString("en-US") }) : null
+        ]
+      },
+      o.value
+    );
+  }) }) });
+}
+function ToolGrid({
+  tools,
+  as: Heading = "h2",
+  className
+}) {
+  const tight = useDensity() === "compact";
+  const n = tools.length;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "ul",
+    {
+      className: cn(
+        "grid grid-cols-1 gap-3 sm:grid-cols-2 md:gap-4",
+        // Three or four sit in one row on a wide screen.
+        n === 3 || n === 6 ? "lg:grid-cols-3" : n === 4 ? "xl:grid-cols-4" : null,
+        className
+      ),
+      children: tools.map((t) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: cn(
+            "group relative flex h-full flex-col rounded-[1.25rem] border border-border bg-card transition-colors",
+            tight ? "gap-3 p-5" : "gap-4 p-6",
+            "hover:border-oca-hairline-strong 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"
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+              t.icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 items-center justify-center rounded-xl bg-muted text-foreground [&_svg]:size-5", children: t.icon }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                lucideReact.ArrowRight,
+                {
+                  "aria-hidden": true,
+                  className: "size-4 text-muted-foreground transition-transform duration-200 group-hover:translate-x-0.5 group-hover:text-foreground"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Heading, { className: "oca-title-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
+                Link__default.default,
+                {
+                  href: t.href,
+                  className: "outline-none after:absolute after:inset-0 after:rounded-[1.25rem] after:content-['']",
+                  children: t.label
+                }
+              ) }),
+              t.description ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[0.9375rem] leading-relaxed text-muted-foreground", children: t.description }) : null
+            ] })
+          ]
+        }
+      ) }, t.href))
+    }
+  );
+}
 
 exports.Accent = Accent;
 exports.ActivityList = ActivityList;
+exports.AnchorStatus = AnchorStatus;
+exports.ApiTable = ApiTable;
+exports.AppCard = AppCard;
+exports.AppGrid = AppGrid;
+exports.ArtifactView = ArtifactView;
+exports.BlockCountdown = BlockCountdown;
+exports.BlockHeight = BlockHeight;
+exports.Breadcrumbs = Breadcrumbs;
 exports.BrowserFrame = BrowserFrame;
+exports.Callout = Callout;
+exports.CardGrid = CardGrid;
+exports.Closing = Closing;
 exports.CodeBlock = CodeBlock;
+exports.CodeTabs = CodeTabs;
+exports.ComparisonTable = ComparisonTable;
 exports.Container = Container;
 exports.CopyButton = CopyButton;
 exports.DataTable = DataTable;
+exports.Diagram = Diagram;
 exports.Display = Display;
 exports.DocHeader = DocHeader;
 exports.DocLayout = DocLayout;
+exports.DocsHeading = DocsHeading;
+exports.DocsPager = DocsPager;
+exports.DropZone = DropZone;
 exports.EmptyLine = EmptyLine;
 exports.EmptyState = EmptyState;
+exports.EndpointList = EndpointList;
 exports.ErrorBoundary = ErrorBoundary;
+exports.ErrorPage = ErrorPage;
 exports.Eyebrow = Eyebrow;
+exports.FactBlock = FactBlock;
+exports.FactRows = FactRows;
+exports.Faq = Faq;
+exports.FilterChips = FilterChips;
 exports.FloatChip = FloatChip;
 exports.Footnote = Footnote;
+exports.FormSection = FormSection;
 exports.HashChip = HashChip;
+exports.InstallTabs = InstallTabs;
 exports.KeyValueList = KeyValueList;
 exports.Lead = Lead;
+exports.LegalDocument = LegalDocument;
+exports.LinkCard = LinkCard;
 exports.LoadingBlock = LoadingBlock;
+exports.MdxTable = MdxTable;
+exports.Meter = Meter;
 exports.Monogram = Monogram;
 exports.Notice = Notice;
+exports.OnThisPage = OnThisPage;
 exports.PackageCard = PackageCard;
 exports.PageHeader = PageHeader;
 exports.PageHero = PageHero;
 exports.PhoneFrame = PhoneFrame;
 exports.ProgressSteps = ProgressSteps;
+exports.ProofStrip = ProofStrip;
 exports.Prose = Prose;
+exports.ProtocolGrid = ProtocolGrid;
+exports.ProtocolHero = ProtocolHero;
+exports.ProtocolNav = ProtocolNav;
 exports.Reveal = Reveal;
 exports.Sats = Sats;
 exports.SatsFigure = SatsFigure;
 exports.ScrollStory = ScrollStory;
+exports.SearchButton = SearchButton;
+exports.SearchDialog = SearchDialog;
 exports.Section = Section;
+exports.SectionHeading = SectionHeading;
 exports.SectionIntro = SectionIntro;
+exports.SignMessage = SignMessage;
+exports.SpecCard = SpecCard;
 exports.SplitBar = SplitBar;
 exports.StatCard = StatCard;
 exports.StatGrid = StatGrid;
+exports.StateBadge = StateBadge;
+exports.Step = Step;
 exports.StepGrid = StepGrid;
+exports.Steps = Steps;
+exports.TextLink = TextLink;
 exports.Ticker = Ticker;
+exports.ToolGrid = ToolGrid;
 exports.TruthTable = TruthTable;
 exports.UsdApprox = UsdApprox;
+exports.VerifyBox = VerifyBox;
+exports.VerifyReport = VerifyReport;
+exports.createStateBadge = createStateBadge;
+exports.languageName = languageName;
 exports.monogramGround = monogramGround;
 exports.monogramLetter = monogramLetter;
 exports.satsText = satsText;
 exports.sectionVariants = sectionVariants;
+exports.useActiveHeading = useActiveHeading;
 exports.useCopy = useCopy;
+exports.useHeadings = useHeadings;
 exports.useInView = useInView;
 //# sourceMappingURL=components.js.map
 //# sourceMappingURL=components.js.map