agentix-cli 0.23.0 → 0.26.0

package/dist/chunk-P4VWIVKN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/daemon/ui/tokens.ts","../src/daemon/ui/components.css.ts","../src/daemon/ui/shell.ts","../src/daemon/ui/util.ts","../src/daemon/ui/components.ts"],"sourcesContent":["// --- Design tokens for every dashboard surface ---\n//\n// SINGLE source of truth. Every page imports AX_TOKENS_CSS and drops it in\n// its <style> block once, so no page carries its own :root copy.\n//\n// The palette and shape language are ported from the agentina console\n// (packages/console/src/index.ts) — a deliberately plain, friendly system\n// built on three principles worth restating here, because they are as much\n// about what we remove as how it looks:\n//\n//   1. CONTACTS, NOT CONCEPTS — surface the people and agents you work with;\n//      grants, sessions and adapters stay machinery.\n//   2. ONE SCREEN, ONE JOB — a flow is a short wizard with one obvious next\n//      action, not a dense panel of every option.\n//   3. HONEST UI — nothing simulated. Offline is offline, denied is denied.\n//\n// What was ported and what was not:\n//   - Ported: the four-colour brand palette, 2px borders, generous radii,\n//     pill chips, the hard offset shadow (`0 4px 0 <darker>`) that makes\n//     controls read as physical, and Outfit / Roboto Mono.\n//   - NOT ported: light-only. agentina is a consumer console; this is a\n//     dense ops dashboard people read at 2am, so the dark variant stays and\n//     carries the same shape language with the palette lifted for contrast.\n//   - Removed: the `crt` theme. Two well-maintained themes beat three, and\n//     it had no users.\n//\n// Guideline for adding tokens: every token must be page-neutral. Page-\n// specific padding/gaps belong in the page's own CSS file, not here.\n\nexport const AX_TOKENS_CSS = `:root {\n  /* --- Brand (agentina) --------------------------------------------- */\n  --ax-blue: #2979FF;\n  --ax-blue-d: #1B5FD9;\n  --ax-blue-t: #E7F0FF;\n  --ax-blue-e: #A9CBFF;\n  --ax-green: #22B573;\n  --ax-green-d: #178F58;\n  --ax-green-e: #A9E8C9;\n  --ax-amber: #FFB300;\n  --ax-amber-e: #FFE08A;\n  --ax-amber-t: #FFFCF5;\n  --ax-red: #F23A3A;\n  --ax-red-t: #FEECEC;\n  --ax-red-e: #F9C1C1;\n\n  /* --- Surfaces + text ---------------------------------------------- */\n  --ax-bg: #f8f9fa;\n  --ax-bg-elev: #f1f3f4;\n  --ax-surface: #ffffff;\n  --ax-surface-2: #f8f9fa;\n  --ax-surface-3: #f1f3f4;\n  --ax-border: #e8eaed;\n  --ax-border-2: #dadce0;\n  --ax-text: #202124;\n  --ax-text-2: #5f6368;\n  --ax-muted: #9aa0a6;\n\n  /* --- Semantic ------------------------------------------------------ */\n  --ax-accent: var(--ax-blue);\n  --ax-accent-2: var(--ax-blue-d);\n  --ax-accent-t: var(--ax-blue-t);\n  --ax-ok: var(--ax-green);\n  --ax-warn: var(--ax-amber);\n  --ax-err: var(--ax-red);\n  --ax-info: var(--ax-blue);\n\n  /* --- Shape ---------------------------------------------------------\n     The offset shadow is the signature move: a solid, un-blurred drop in a\n     darker shade of the element's own colour. It reads as a physical edge\n     rather than a glow, and it is what stops flat 2px-bordered boxes from\n     looking like a wireframe. */\n  --ax-border-w: 2px;\n  --ax-radius: 16px;\n  --ax-radius-lg: 20px;\n  --ax-radius-sm: 12px;\n  --ax-radius-pill: 999px;\n  --ax-shadow: 0 3px 0 var(--ax-border);\n  --ax-shadow-lg: 0 4px 0 var(--ax-border-2);\n  --ax-shadow-accent: 0 4px 0 var(--ax-blue-d);\n  --ax-shadow-ok: 0 4px 0 var(--ax-green-d);\n\n  /* --- Spacing ------------------------------------------------------- */\n  --ax-pad: 16px;\n  --ax-pad-sm: 10px;\n  --ax-gap: 12px;\n\n  /* --- Type ---------------------------------------------------------- */\n  --ax-font: \"Outfit\", -apple-system, \"Segoe UI\", system-ui, sans-serif;\n  --ax-mono: \"Roboto Mono\", ui-monospace, \"SF Mono\", Consolas, monospace;\n  --ax-fs: 14px;\n  --ax-fs-sm: 13px;\n  --ax-fs-xs: 12px;\n\n  /* Legacy aliases so older CSS blocks keep rendering until they're ported. */\n  --bg: var(--ax-bg);\n  --card: var(--ax-surface);\n  --node: var(--ax-bg-elev);\n  --border: var(--ax-border);\n  --text: var(--ax-text);\n  --muted: var(--ax-muted);\n  --accent: var(--ax-accent);\n  --yellow: var(--ax-warn);\n  --red: var(--ax-err);\n  --blue: var(--ax-info);\n  --gray: var(--ax-muted);\n  color-scheme: light;\n}\n\n/* Dark is not a tint of light — the brand colours are lifted toward their\n   tints so they keep contrast against a dark ground, and the offset shadow\n   goes DARKER than the surface instead of lighter. Same shape language,\n   inverted physics. */\n[data-theme=\"dark\"] {\n  --ax-blue: #6BA5FF;\n  --ax-blue-d: #1B5FD9;\n  --ax-blue-t: #16233d;\n  --ax-blue-e: #2f4d7a;\n  --ax-green: #4ED89B;\n  --ax-green-d: #178F58;\n  --ax-green-e: #1e4a36;\n  --ax-amber: #FFC948;\n  --ax-amber-e: #4a3a12;\n  --ax-amber-t: #2a2313;\n  --ax-red: #FF6B6B;\n  --ax-red-t: #3a1c1c;\n  --ax-red-e: #6b2f2f;\n\n  --ax-bg: #14161a;\n  --ax-bg-elev: #191c21;\n  --ax-surface: #1e2228;\n  --ax-surface-2: #23272e;\n  --ax-surface-3: #2a2f37;\n  --ax-border: #2f353e;\n  --ax-border-2: #3d444f;\n  --ax-text: #f1f3f4;\n  --ax-text-2: #b6bcc4;\n  --ax-muted: #858c96;\n\n  --ax-shadow: 0 3px 0 #0e1013;\n  --ax-shadow-lg: 0 4px 0 #0e1013;\n  --ax-shadow-accent: 0 4px 0 #14396e;\n  --ax-shadow-ok: 0 4px 0 #11402c;\n  color-scheme: dark;\n}\n\n/* Base element resets shared across every page. */\n* { box-sizing: border-box; }\nhtml, body {\n  margin: 0; min-height: 100vh;\n  background: var(--ax-bg); color: var(--ax-text);\n  font-family: var(--ax-font); font-size: var(--ax-fs);\n  -webkit-font-smoothing: antialiased;\n}\npre, code, .ax-mono {\n  font-family: var(--ax-mono); font-variant-numeric: tabular-nums;\n  letter-spacing: -0.01em;\n}\na { color: var(--ax-accent); text-decoration: none; font-weight: 600; }\na:hover { color: var(--ax-accent-2); text-decoration: underline; }\n.ax-muted { color: var(--ax-muted); }\n.ax-accent { color: var(--ax-accent); }`\n","// --- Shared component CSS ---\n//\n// Styles for the primitives in components.ts. Kept separate from tokens so a\n// page can opt-in to only what it uses (setup-wizard doesn't need stat-strip\n// styles, for example). Most pages just emit both blocks together.\n//\n// All class names are prefixed `ax-` — they won't collide with host-app or\n// per-page styles.\n\nexport const AX_COMPONENTS_CSS = `\n/* --- Dots --- */\n.ax-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--ax-muted); }\n.ax-dot--ok, .ax-dot--live { background: var(--ax-accent); }\n.ax-dot--warn { background: var(--ax-warn); }\n.ax-dot--err { background: var(--ax-err); }\n.ax-dot--off { background: var(--ax-border-2); }\n.ax-dot--pulse {\n  box-shadow: 0 0 0 0 currentColor;\n  animation: ax-pulse 1.8s infinite;\n  color: var(--ax-accent);\n}\n@keyframes ax-pulse {\n  0%   { box-shadow: 0 0 0 0 color-mix(in oklch, var(--ax-accent) 70%, transparent); }\n  70%  { box-shadow: 0 0 0 6px color-mix(in oklch, var(--ax-accent) 0%, transparent); }\n  100% { box-shadow: 0 0 0 0 color-mix(in oklch, var(--ax-accent) 0%, transparent); }\n}\n\n/* --- Badges --- */\n.ax-badge {\n  display: inline-flex; align-items: center; gap: 4px;\n  padding: 2px 10px; border-radius: var(--ax-radius-pill); font-size: var(--ax-fs-xs); line-height: 18px;\n  border: var(--ax-border-w) solid var(--ax-border-2); color: var(--ax-text-2);\n  background: var(--ax-surface); font-weight: 600;\n}\n.ax-badge--mono {\n  font-family: var(--ax-mono); letter-spacing: 0.02em;\n  text-transform: uppercase; font-size: 10px;\n}\n.ax-badge--accent {\n  color: var(--ax-accent);\n  border-color: color-mix(in oklch, var(--ax-accent) 50%, transparent);\n}\n.ax-badge--live {\n  color: var(--ax-accent);\n  background: color-mix(in oklch, var(--ax-accent) 14%, transparent);\n  border-color: color-mix(in oklch, var(--ax-accent) 60%, transparent);\n  font-weight: 600; letter-spacing: 0.06em;\n}\n.ax-badge--warn {\n  color: var(--ax-warn);\n  border-color: color-mix(in oklch, var(--ax-warn) 50%, transparent);\n}\n.ax-badge--err {\n  color: var(--ax-err);\n  border-color: color-mix(in oklch, var(--ax-err) 50%, transparent);\n}\n.ax-badge--ghost {\n  color: var(--ax-muted); border-color: var(--ax-border); background: var(--ax-surface-2);\n}\n\n/* --- Buttons --- */\n.ax-btn {\n  background: var(--ax-surface); color: var(--ax-text-2);\n  border: var(--ax-border-w) solid var(--ax-border-2); border-radius: var(--ax-radius);\n  padding: 8px 16px; font: inherit; font-size: var(--ax-fs); font-weight: 600;\n  cursor: pointer; line-height: 1.4;\n  box-shadow: var(--ax-shadow);\n  transition: border-color 0.1s, color 0.1s, background 0.1s, transform 0.06s, box-shadow 0.06s;\n}\n.ax-btn:hover:not(:disabled) { color: var(--ax-text); border-color: var(--ax-accent); }\n/* The offset shadow collapses on press so the control physically sinks —\n   the whole point of an un-blurred drop rather than a glow. */\n.ax-btn:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 1px 0 var(--ax-border); }\n.ax-btn:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; }\n\n.ax-btn--primary {\n  background: color-mix(in oklch, var(--ax-accent) 15%, var(--ax-surface));\n  color: var(--ax-accent);\n  border-color: color-mix(in oklch, var(--ax-accent) 50%, var(--ax-border-2));\n  font-weight: 700;\n  box-shadow: var(--ax-shadow-accent);\n}\n.ax-btn--primary:hover:not(:disabled) {\n  background: color-mix(in oklch, var(--ax-accent) 25%, var(--ax-surface));\n  border-color: var(--ax-accent);\n}\n\n.ax-btn--ghost {\n  background: transparent; color: var(--ax-muted);\n  border-color: var(--ax-border); box-shadow: none;\n}\n.ax-btn--ghost:active:not(:disabled) { transform: none; }\n\n.ax-btn--danger {\n  color: var(--ax-err);\n  border-color: var(--ax-red-e);\n  box-shadow: 0 4px 0 var(--ax-red-e);\n}\n.ax-btn--danger:hover:not(:disabled) {\n  background: color-mix(in oklch, var(--ax-err) 12%, var(--ax-surface));\n  border-color: var(--ax-err);\n}\n\n/* --- Chips (read-only labels used in kanban filters, etc.) --- */\n.ax-chip {\n  display: inline-block; padding: 0 6px; font-family: var(--ax-mono);\n  font-size: 11px; line-height: 18px; border-radius: var(--ax-radius-pill); color: var(--ax-text-2);\n  border: var(--ax-border-w) solid var(--ax-border); background: var(--ax-surface); font-weight: 600;\n}\n\n/* --- Cards --- */\n.ax-card {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: var(--ax-pad);\n  box-shadow: var(--ax-shadow);\n}\n\n/* Step cards used by the setup wizard / onboarding-style flows. */\n.ax-step {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius); padding: 20px 22px; margin: 14px 0;\n}\n.ax-step__head {\n  font-size: var(--ax-fs-xs); font-weight: 600; text-transform: uppercase;\n  letter-spacing: 0.08em; color: var(--ax-muted);\n  margin: 0 0 14px; display: flex; align-items: center; gap: 10px;\n}\n.ax-step__num {\n  width: 22px; height: 22px; border-radius: var(--ax-radius-sm);\n  background: color-mix(in oklch, var(--ax-accent) 15%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 45%, var(--ax-border-2));\n  color: var(--ax-accent);\n  display: inline-flex; align-items: center; justify-content: center;\n  font-family: var(--ax-mono); font-size: 11px; font-weight: 700;\n  letter-spacing: 0; text-transform: none;\n}\n\n/* --- Stat strip (the \"COUNT / label\" cards across the top of Live) --- */\n.ax-statstrip {\n  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));\n  gap: var(--ax-gap); padding: var(--ax-pad) var(--ax-pad) 0;\n}\n.ax-stat {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius); padding: 14px 16px;\n}\n.ax-stat__label {\n  font-size: var(--ax-fs-xs); text-transform: uppercase; letter-spacing: 0.06em;\n  color: var(--ax-muted); display: flex; align-items: center; gap: 6px;\n}\n.ax-stat__value {\n  font-size: 24px; font-weight: 600; margin-top: 4px; letter-spacing: -0.02em;\n  font-family: var(--ax-mono); font-variant-numeric: tabular-nums;\n}\n.ax-stat__sub {\n  font-size: var(--ax-fs-xs); color: var(--ax-muted); margin-top: 2px;\n  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;\n}\n.ax-stat--live .ax-stat__value { color: var(--ax-accent); }\n.ax-stat--warn .ax-stat__value { color: var(--ax-warn); }\n.ax-stat--err .ax-stat__value { color: var(--ax-err); }\n\n/* --- Forms --- */\n.ax-field { margin: 10px 0 0; }\n.ax-field:first-child { margin-top: 0; }\n.ax-field label {\n  display: block; margin-bottom: 5px;\n  font-size: var(--ax-fs-xs); color: var(--ax-muted);\n  text-transform: uppercase; letter-spacing: 0.06em; font-weight: 500;\n}\n.ax-field label .ax-hint {\n  text-transform: none; letter-spacing: 0; color: var(--ax-muted);\n  font-weight: 400; font-size: var(--ax-fs-xs); margin-left: 6px;\n}\n.ax-field input, .ax-field textarea, .ax-field select {\n  width: 100%;\n  background: var(--ax-bg); color: var(--ax-text);\n  border: var(--ax-border-w) solid var(--ax-border-2); border-radius: var(--ax-radius);\n  padding: 11px 14px; font: inherit; font-size: var(--ax-fs);\n  transition: border-color 0.1s ease;\n}\n.ax-field input:focus, .ax-field textarea:focus, .ax-field select:focus {\n  outline: none; border-color: var(--ax-accent);\n  box-shadow: 0 0 0 2px color-mix(in oklch, var(--ax-accent) 18%, transparent);\n}\n.ax-field textarea { resize: vertical; min-height: 72px; font-family: var(--ax-font); }\n.ax-field input::placeholder, .ax-field textarea::placeholder {\n  color: var(--ax-muted); opacity: 0.7;\n}\n\n.ax-row { display: flex; gap: 12px; }\n.ax-row > * { flex: 1; }\n\n/* --- Section titles shared across pages --- */\n.ax-section-title {\n  display: flex; justify-content: space-between; align-items: center;\n  margin-bottom: 12px;\n}\n.ax-section-title__label {\n  font-size: var(--ax-fs-xs); text-transform: uppercase;\n  letter-spacing: 0.08em; color: var(--ax-muted);\n}\n.ax-section-title__right {\n  display: flex; align-items: center; gap: 8px;\n  font-size: var(--ax-fs-xs); color: var(--ax-muted);\n}\n\n/* ============================================================\n * Settings-page design system (also reusable on other pages).\n * Ported from the Stitch redesign mockup so the primitives can\n * be consumed by any page — not just /admin. Sections:\n *   page-head     — kicker + h1 + lead paragraph\n *   health-strip  — 4-up status cards with coloured dot\n *   wit           — dismissable \"what is this?\" info banner\n *   section-head  — icon chip + title + lead + right-aligned CTA\n *   row-card      — list row with avatar + info + actions + expand\n *   avatar        — coloured-initial square (teal/coral/amber/blue)\n *   pill          — small status pill with coloured dot (chip-flavor)\n *   connectors    — 2-up grid of connector cards\n *   tab-count     — mono count bubble on a tab\n *   toast         — bottom-right ephemeral notification\n *   modal         — simple centred dialog + backdrop\n *   sec-label     — uppercase mini-heading with optional CTA\n * ============================================================ */\n\n/* --- Page head --- */\n.ax-page-head {\n  max-width: 1040px; margin: 0 auto; padding: 28px 24px 12px;\n}\n.ax-page-head .ax-kicker {\n  display: inline-block; font-size: 10px; letter-spacing: 0.1em;\n  color: var(--ax-muted); text-transform: uppercase; margin-bottom: 6px;\n  font-family: var(--ax-mono);\n}\n.ax-page-head h1 {\n  font-size: 22px; font-weight: 600; letter-spacing: -0.015em;\n  margin: 0 0 4px; display: flex; align-items: center; gap: 10px;\n}\n.ax-page-head .ax-lead {\n  color: var(--ax-text-2); margin: 0; font-size: 13px;\n  max-width: 640px; line-height: 1.6;\n}\n.ax-page-head .ax-lead code {\n  font-family: var(--ax-mono); font-size: 11.5px;\n  background: var(--ax-surface-2); padding: 1px 6px; border-radius: var(--ax-radius-sm);\n}\n\n/* --- Health strip --- */\n.ax-health-strip {\n  max-width: 1040px; margin: 18px auto 22px; padding: 0 24px;\n  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;\n}\n.ax-health-card {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); padding: 12px 14px;\n  display: flex; align-items: center; gap: 11px;\n  transition: border-color 120ms;\n}\n.ax-health-card:hover { border-color: var(--ax-border-2); }\n.ax-health-card .ax-hc-dot {\n  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;\n}\n.ax-health-card .ax-hc-dot--ok {\n  background: var(--ax-accent);\n  box-shadow: 0 0 8px color-mix(in oklch, var(--ax-accent) 50%, transparent);\n}\n.ax-health-card .ax-hc-dot--warn { background: var(--ax-warn); }\n.ax-health-card .ax-hc-dot--off { background: var(--ax-border-2); }\n.ax-health-card .ax-hc-txt { flex: 1; min-width: 0; }\n.ax-health-card .ax-hc-num {\n  font-size: 17px; font-weight: 600; letter-spacing: -0.015em;\n}\n.ax-health-card .ax-hc-lbl {\n  font-size: 11px; color: var(--ax-muted); margin-top: 1px;\n}\n\n/* --- \"What is this?\" info banner (dismissable) --- */\n.ax-wit {\n  background: color-mix(in oklch, var(--ax-info) 6%, var(--ax-bg-elev));\n  border: 1px solid color-mix(in oklch, var(--ax-info) 22%, var(--ax-border));\n  border-radius: var(--ax-radius-sm); padding: 12px 14px; margin-bottom: 18px;\n  font-size: 12.5px; color: var(--ax-text-2); line-height: 1.6;\n  display: flex; gap: 10px; align-items: flex-start;\n}\n.ax-wit__icon {\n  width: 18px; height: 18px; border-radius: 50%;\n  background: color-mix(in oklch, var(--ax-info) 18%, transparent);\n  color: var(--ax-info);\n  display: grid; place-items: center;\n  font-size: 11px; font-weight: 600; flex-shrink: 0; margin-top: 1px;\n}\n.ax-wit b { color: var(--ax-text); font-weight: 600; }\n.ax-wit code {\n  font-family: var(--ax-mono); font-size: 11.5px;\n  background: var(--ax-bg); padding: 1px 5px; border-radius: var(--ax-radius-sm);\n  border: var(--ax-border-w) solid var(--ax-border);\n}\n.ax-wit .ax-wit__dismiss {\n  background: transparent; border: 0; color: var(--ax-muted);\n  font-size: 16px; cursor: pointer; margin-left: auto;\n  padding: 0 4px; line-height: 1;\n}\n.ax-wit .ax-wit__dismiss:hover { color: var(--ax-text); }\n\n/* --- Section head (icon + title + lead + right CTA) --- */\n.ax-section-head {\n  display: flex; align-items: flex-start; gap: 16px; margin-bottom: 18px;\n}\n.ax-section-head__icon {\n  width: 44px; height: 44px; border-radius: var(--ax-radius);\n  background: color-mix(in oklch, var(--ax-accent) 10%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 25%, var(--ax-border));\n  display: grid; place-items: center; flex-shrink: 0;\n  color: var(--ax-accent);\n}\n.ax-section-head__icon svg { width: 22px; height: 22px; }\n.ax-section-head__text { flex: 1; }\n.ax-section-head h2 {\n  font-size: 18px; margin: 0 0 3px;\n  font-weight: 600; letter-spacing: -0.01em;\n}\n.ax-section-head .ax-lead {\n  color: var(--ax-text-2); margin: 0; font-size: 13px; line-height: 1.55;\n  max-width: 640px;\n}\n\n/* --- Row cards (collapsible list items) --- */\n.ax-stack { display: flex; flex-direction: column; gap: 10px; }\n.ax-row-card {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 14px 16px;\n  transition: border-color 160ms, transform 160ms;\n}\n.ax-row-card:hover { border-color: var(--ax-border-2); }\n.ax-row-card__top { display: flex; align-items: center; gap: 12px; }\n.ax-row-card__info { flex: 1; min-width: 0; }\n.ax-row-card__info .ax-name {\n  font-size: 14px; font-weight: 600; letter-spacing: -0.005em;\n  display: flex; align-items: center; gap: 8px;\n}\n.ax-row-card__info .ax-slug {\n  font-family: var(--ax-mono); font-size: 11px;\n  color: var(--ax-muted); margin-left: 4px;\n}\n.ax-row-card__info .ax-sub {\n  font-size: 12px; color: var(--ax-text-2); margin-top: 3px;\n  line-height: 1.5; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;\n}\n.ax-row-card__actions { display: flex; gap: 6px; align-items: center; }\n.ax-row-card__details {\n  display: none; margin-top: 14px; padding-top: 14px;\n  border-top: 1px dashed var(--ax-border);\n  font-size: 12.5px; color: var(--ax-text-2); line-height: 1.6;\n}\n.ax-row-card.is-open .ax-row-card__details { display: block; }\n.ax-row-card.is-open .ax-chev { transform: rotate(180deg); }\n.ax-chev { transition: transform 160ms; }\n\n.ax-detail-grid {\n  display: grid; grid-template-columns: repeat(2, 1fr);\n  gap: 12px 20px; margin-bottom: 12px;\n}\n.ax-detail-grid dt {\n  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;\n  color: var(--ax-muted); margin-bottom: 3px; font-family: var(--ax-mono);\n}\n.ax-detail-grid dd {\n  margin: 0; font-size: 12.5px; color: var(--ax-text);\n}\n.ax-triggers { display: flex; gap: 4px; flex-wrap: wrap; }\n.ax-trigger-pill {\n  font-family: var(--ax-mono); font-size: 11px;\n  padding: 2px 8px; background: var(--ax-bg);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm);\n  color: var(--ax-text);\n}\n\n/* --- Avatars (coloured initial square) --- */\n.ax-avatar {\n  width: 36px; height: 36px; border-radius: var(--ax-radius); flex-shrink: 0;\n  background: var(--ax-surface-2); border: var(--ax-border-w) solid var(--ax-border-2);\n  display: grid; place-items: center;\n  font-weight: 600; font-size: 14px; letter-spacing: -0.01em;\n  color: var(--ax-text);\n}\n.ax-avatar--teal {\n  background: color-mix(in oklch, var(--ax-accent) 18%, var(--ax-surface));\n  border-color: color-mix(in oklch, var(--ax-accent) 35%, var(--ax-border));\n  color: var(--ax-accent);\n}\n.ax-avatar--coral {\n  background: color-mix(in oklch, var(--ax-err) 14%, var(--ax-surface));\n  border-color: color-mix(in oklch, var(--ax-err) 30%, var(--ax-border));\n  color: var(--ax-err);\n}\n.ax-avatar--amber {\n  background: color-mix(in oklch, var(--ax-warn) 14%, var(--ax-surface));\n  border-color: color-mix(in oklch, var(--ax-warn) 30%, var(--ax-border));\n  color: var(--ax-warn);\n}\n.ax-avatar--blue {\n  background: color-mix(in oklch, var(--ax-info) 14%, var(--ax-surface));\n  border-color: color-mix(in oklch, var(--ax-info) 30%, var(--ax-border));\n  color: var(--ax-info);\n}\n\n/* --- Pills (status indicator with coloured dot) ---\n *\n * Different from .ax-badge: pills have a rounded (10px) shape, a small\n * leading coloured dot, and stronger semantics (ok/warn/off/info). Use\n * for \"live\", \"idle\", \"receiving\", \"stale\" states next to a name.\n */\n.ax-pill {\n  display: inline-flex; align-items: center; gap: 5px;\n  font-size: 11px; padding: 2px 8px; line-height: 16px;\n  border-radius: var(--ax-radius); background: var(--ax-surface-2);\n  color: var(--ax-text-2); border: var(--ax-border-w) solid var(--ax-border);\n  white-space: nowrap;\n}\n.ax-pill .ax-pill__dot {\n  width: 6px; height: 6px; border-radius: 50%; background: currentColor;\n}\n.ax-pill--ok {\n  background: color-mix(in oklch, var(--ax-accent) 14%, transparent);\n  color: var(--ax-accent);\n  border-color: color-mix(in oklch, var(--ax-accent) 30%, transparent);\n}\n.ax-pill--warn {\n  background: color-mix(in oklch, var(--ax-warn) 14%, transparent);\n  color: var(--ax-warn);\n  border-color: color-mix(in oklch, var(--ax-warn) 30%, transparent);\n}\n.ax-pill--off { color: var(--ax-muted); }\n.ax-pill--info {\n  background: color-mix(in oklch, var(--ax-info) 14%, transparent);\n  color: var(--ax-info);\n  border-color: color-mix(in oklch, var(--ax-info) 30%, transparent);\n}\n\n/* --- Connectors grid (Channels tab) --- */\n.ax-connectors {\n  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;\n}\n.ax-connector {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 18px 18px 16px;\n  cursor: pointer; position: relative;\n  transition: border-color 160ms, transform 160ms, background 160ms;\n}\n.ax-connector:hover { border-color: var(--ax-border-2); background: var(--ax-surface-2); }\n.ax-connector.is-on {\n  border-color: color-mix(in oklch, var(--ax-accent) 40%, var(--ax-border));\n}\n.ax-connector.is-active {\n  border-color: var(--ax-accent);\n  background: color-mix(in oklch, var(--ax-accent) 8%, var(--ax-surface));\n}\n.ax-connector__top {\n  display: flex; align-items: center; gap: 12px; margin-bottom: 10px;\n}\n.ax-connector__logo {\n  width: 40px; height: 40px; border-radius: var(--ax-radius);\n  display: grid; place-items: center;\n  font-weight: 700; font-size: 15px; letter-spacing: -0.02em; flex-shrink: 0;\n  background: var(--ax-surface-2); border: var(--ax-border-w) solid var(--ax-border-2);\n  color: var(--ax-text); font-family: var(--ax-mono);\n}\n.ax-connector__meta { flex: 1; }\n.ax-connector__name {\n  font-weight: 600; font-size: 14px; letter-spacing: -0.005em;\n}\n.ax-connector__sub {\n  font-size: 11.5px; color: var(--ax-muted); margin-top: 2px;\n}\n.ax-connector__status { margin-left: auto; }\n.ax-connector__desc {\n  font-size: 12.5px; color: var(--ax-text-2); line-height: 1.5; min-height: 36px;\n}\n.ax-connector__foot {\n  margin-top: 12px; display: flex; align-items: center; justify-content: space-between;\n  font-size: 11.5px; color: var(--ax-muted);\n}\n.ax-connector__cta {\n  color: var(--ax-accent); font-weight: 500;\n  display: inline-flex; align-items: center; gap: 4px;\n}\n.ax-connector__cta svg { width: 12px; height: 12px; }\n\n/* --- Tab counts + warn indicator --- */\n.ax-tab-count {\n  font-family: var(--ax-mono); font-size: 10px;\n  padding: 1px 6px; background: var(--ax-surface-2);\n  color: var(--ax-muted); border-radius: var(--ax-radius); line-height: 14px;\n  margin-left: 6px;\n}\n.is-active .ax-tab-count {\n  background: color-mix(in oklch, var(--ax-accent) 18%, transparent);\n  color: var(--ax-accent);\n}\n.ax-tab-warn {\n  width: 6px; height: 6px; border-radius: 50%; background: var(--ax-warn);\n  display: inline-block; margin-left: 6px;\n}\n\n/* --- Section mini-labels --- */\n.ax-sec-label {\n  display: flex; align-items: center; justify-content: space-between;\n  margin: 22px 0 10px;\n}\n.ax-sec-label h3 {\n  font-size: 12px; font-weight: 600; letter-spacing: 0.06em;\n  text-transform: uppercase; color: var(--ax-muted);\n  margin: 0; font-family: var(--ax-mono);\n}\n\n/* --- Toast --- */\n.ax-toast {\n  position: fixed; bottom: 24px; right: 24px;\n  background: var(--ax-surface-2);\n  border: var(--ax-border-w) solid var(--ax-accent); color: var(--ax-text);\n  padding: 10px 16px; border-radius: var(--ax-radius); font-size: 12.5px;\n  display: flex; align-items: center; gap: 10px;\n  box-shadow: 0 10px 30px rgba(0,0,0,0.3);\n  opacity: 0; transform: translateY(10px); pointer-events: none;\n  transition: opacity 200ms, transform 200ms; z-index: 100;\n}\n.ax-toast.is-show { opacity: 1; transform: none; }\n.ax-toast__icon { color: var(--ax-accent); }\n\n/* --- Modal (centred dialog + backdrop) --- */\n.ax-modal-bd {\n  position: fixed; inset: 0;\n  background: color-mix(in oklch, var(--ax-bg) 60%, black);\n  display: none; align-items: center; justify-content: center;\n  z-index: 200; padding: 24px;\n}\n.ax-modal-bd.is-show { display: flex; }\n.ax-modal {\n  width: min(560px, 94vw); max-height: 86vh; overflow: auto;\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border-2);\n  border-radius: var(--ax-radius-lg); padding: 0;\n  box-shadow: 0 20px 60px rgba(0,0,0,0.5);\n}\n.ax-modal > header {\n  padding: 18px 22px 10px; border-bottom: var(--ax-border-w) solid var(--ax-border);\n  display: flex; align-items: center; gap: 10px;\n}\n.ax-modal > header h3 {\n  margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -0.01em; flex: 1;\n}\n.ax-modal > header .ax-modal__close {\n  background: transparent; border: 0; color: var(--ax-muted);\n  font-size: 22px; cursor: pointer; line-height: 1; padding: 0 6px;\n}\n.ax-modal__body { padding: 18px 22px; }\n.ax-modal__foot {\n  padding: 12px 22px 18px;\n  display: flex; justify-content: flex-end; gap: 8px;\n  border-top: var(--ax-border-w) solid var(--ax-border);\n}\n\n/* --- Mesh hero (enable toggle + SVG network viz) --- */\n.ax-mesh-hero {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 20px;\n  display: grid; grid-template-columns: 1fr 240px; gap: 24px;\n  align-items: center; margin-bottom: 18px;\n}\n.ax-mesh-hero h3 { margin: 0 0 4px; font-size: 15px; font-weight: 600; }\n.ax-mesh-hero p { margin: 0 0 12px; font-size: 12.5px; color: var(--ax-text-2); line-height: 1.5; }\n.ax-mesh-viz { position: relative; width: 240px; height: 140px; }\n.ax-mesh-dot {\n  position: absolute; width: 44px; height: 44px; border-radius: 50%;\n  background: var(--ax-surface-2); border: 2px solid var(--ax-border-2);\n  display: grid; place-items: center;\n  font-family: var(--ax-mono); font-size: 10px; font-weight: 600;\n  color: var(--ax-text-2);\n}\n.ax-mesh-dot.self {\n  background: color-mix(in oklch, var(--ax-accent) 18%, var(--ax-surface));\n  border-color: var(--ax-accent); color: var(--ax-accent);\n}\n.ax-mesh-dot.empty {\n  border-style: dashed; color: var(--ax-muted); font-size: 14px;\n}\n.ax-mesh-wires { position: absolute; inset: 0; }\n.ax-mesh-wires line { stroke: var(--ax-border-2); stroke-width: 1.5; stroke-dasharray: 3 3; }\n.ax-mesh-wires line.live { stroke: var(--ax-accent); stroke-dasharray: 0; opacity: 0.6; }\n\n/* Pill-shaped toggle (used for the mesh enable switch + similar binary actions). */\n.ax-mesh-toggle {\n  display: inline-flex; align-items: center; gap: 10px;\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: 20px; padding: 4px 14px 4px 5px;\n  cursor: pointer; user-select: none; font-size: 12px;\n}\n.ax-mesh-switch {\n  width: 32px; height: 18px; background: var(--ax-surface-3);\n  border-radius: var(--ax-radius); position: relative; transition: background 160ms;\n}\n.ax-mesh-switch::after {\n  content: \"\"; position: absolute; top: 2px; left: 2px;\n  width: 14px; height: 14px; border-radius: 50%;\n  background: var(--ax-text-2); transition: all 160ms;\n}\n.ax-mesh-toggle.is-on .ax-mesh-switch {\n  background: color-mix(in oklch, var(--ax-accent) 80%, transparent);\n}\n.ax-mesh-toggle.is-on .ax-mesh-switch::after {\n  left: 16px; background: var(--ax-bg);\n}\n\n/* --- Schedule builder: sentence-builder + pill picks + day picker --- */\n.ax-builder {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 20px;\n}\n.ax-builder h3 {\n  margin: 0 0 4px; font-size: 15px; font-weight: 600; letter-spacing: -0.005em;\n}\n.ax-builder__hint { margin: 0 0 16px; font-size: 12.5px; color: var(--ax-muted); }\n.ax-builder__lbl {\n  display: block; font-size: 11px; color: var(--ax-muted);\n  letter-spacing: 0.03em; text-transform: uppercase; margin: 12px 0 5px;\n  font-weight: 500;\n}\n.ax-builder__lbl .opt {\n  text-transform: none; letter-spacing: 0; font-weight: 400;\n  opacity: 0.75; margin-left: 6px;\n}\n.ax-builder__inp {\n  width: 100%; background: var(--ax-bg); color: var(--ax-text);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm);\n  padding: 8px 11px; font: inherit; font-size: 13px;\n  transition: border-color 120ms, box-shadow 120ms;\n}\n.ax-builder__inp:focus {\n  outline: none; border-color: var(--ax-accent);\n  box-shadow: 0 0 0 3px color-mix(in oklch, var(--ax-accent) 18%, transparent);\n}\ntextarea.ax-builder__inp { min-height: 80px; line-height: 1.5; resize: vertical; }\n\n.ax-mode-switch {\n  display: inline-flex; background: var(--ax-surface-2);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius); padding: 3px;\n  margin-bottom: 14px;\n}\n.ax-mode-switch button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 6px 14px; font: inherit; font-size: 12px; cursor: pointer;\n  border-radius: var(--ax-radius-sm); font-weight: 500;\n}\n.ax-mode-switch button.is-active {\n  background: var(--ax-surface); color: var(--ax-text);\n}\n\n.ax-sentence {\n  display: flex; align-items: center; gap: 8px;\n  font-size: 16px; line-height: 1.9; flex-wrap: wrap;\n  margin-bottom: 14px; padding: 14px 16px;\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm);\n}\n.ax-sentence > span { color: var(--ax-text-2); }\n.ax-pill-pick {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border-2);\n  color: var(--ax-accent); padding: 3px 10px; border-radius: var(--ax-radius);\n  font-size: 14px; font-family: inherit; cursor: pointer; font-weight: 500;\n}\n.ax-pill-pick:hover { background: var(--ax-surface-2); border-color: var(--ax-accent); }\n.ax-pill-pick--sm { font-size: 13px; padding: 3px 8px; }\n\n.ax-day-picker { display: flex; gap: 4px; }\n.ax-day-picker button {\n  width: 30px; height: 30px; border-radius: var(--ax-radius);\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  color: var(--ax-muted); font: inherit; font-size: 11px; font-weight: 500;\n  cursor: pointer;\n}\n.ax-day-picker button:hover { border-color: var(--ax-border-2); color: var(--ax-text); }\n.ax-day-picker button.is-active {\n  background: color-mix(in oklch, var(--ax-accent) 20%, var(--ax-surface));\n  border-color: var(--ax-accent); color: var(--ax-accent);\n}\n\n.ax-preview-box {\n  background: color-mix(in oklch, var(--ax-accent) 5%, var(--ax-bg-elev));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 20%, var(--ax-border));\n  border-radius: var(--ax-radius-sm); padding: 12px 14px; margin-top: 12px;\n  font-size: 12.5px; color: var(--ax-text-2);\n  display: flex; align-items: center; gap: 10px;\n}\n.ax-preview-box svg { width: 15px; height: 15px; color: var(--ax-accent); flex-shrink: 0; }\n.ax-preview-box b { color: var(--ax-text); font-weight: 600; }\n\n.ax-cron-hints {\n  display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 18px;\n  margin-top: 10px; font-size: 11.5px; color: var(--ax-muted);\n}\n.ax-cron-hints code {\n  font-family: var(--ax-mono); color: var(--ax-text);\n  background: var(--ax-bg); border: var(--ax-border-w) solid var(--ax-border);\n  padding: 1px 6px; border-radius: var(--ax-radius-sm); margin-right: 6px;\n}\n\n/* --- JSON tree viewer (Advanced tab) --- */\n.ax-jv-toolbar {\n  display: flex; align-items: center; gap: 8px;\n  padding: 8px 12px; background: var(--ax-bg-elev);\n  border: var(--ax-border-w) solid var(--ax-border); border-bottom: 0;\n  border-radius: var(--ax-radius) var(--ax-radius) 0 0;\n}\n.ax-jv-toolbar .ax-jv-spacer { flex: 1; }\n.ax-jv-toolbar .ax-jv-seg {\n  display: inline-flex; background: var(--ax-surface);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm); padding: 2px;\n}\n.ax-jv-toolbar .ax-jv-seg button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 4px 10px; font: inherit; font-size: 11px;\n  cursor: pointer; border-radius: var(--ax-radius-sm);\n}\n.ax-jv-toolbar .ax-jv-seg button.is-active { background: var(--ax-surface-2); color: var(--ax-text); }\n.ax-jv-search {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); padding: 4px 9px; font: inherit; font-size: 12px;\n  color: var(--ax-text); width: 180px;\n}\n.ax-jv-search:focus { outline: none; border-color: var(--ax-accent); }\n\n.ax-jv-viewer {\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-top: 0; border-radius: 0 0 var(--ax-radius) var(--ax-radius);\n  font-family: var(--ax-mono); font-size: 12.5px; line-height: 1.75;\n  padding: 14px 18px; max-height: 620px; overflow: auto;\n}\n.ax-jv-line {\n  display: flex; align-items: flex-start; padding: 1px 0; gap: 0;\n  position: relative; border-radius: var(--ax-radius-sm); white-space: nowrap;\n}\n.ax-jv-line:hover { background: color-mix(in oklch, var(--ax-accent) 5%, transparent); }\n.ax-jv-line.is-match { background: color-mix(in oklch, var(--ax-warn) 16%, transparent); }\n.ax-jv-toggle {\n  width: 12px; display: inline-block; color: var(--ax-muted);\n  cursor: pointer; user-select: none; text-align: center;\n  font-size: 9px; line-height: 1.75;\n}\n.ax-jv-toggle.empty { cursor: default; }\n.ax-jv-key { color: var(--ax-info); margin-right: 0; }\n.ax-jv-punc { color: var(--ax-muted); }\n.ax-jv-string { color: var(--ax-accent); }\n.ax-jv-number { color: var(--ax-warn); }\n.ax-jv-bool { color: var(--ax-info); font-weight: 500; }\n.ax-jv-null { color: var(--ax-muted); font-style: italic; }\n.ax-jv-comment {\n  color: var(--ax-muted); font-family: var(--ax-font);\n  font-style: italic; font-size: 11.5px; margin-left: 8px; opacity: 0.8;\n}\n.ax-jv-children {\n  padding-left: 18px;\n  border-left: 1px dashed color-mix(in oklch, var(--ax-border) 80%, transparent);\n  margin-left: 4px;\n}\n.ax-jv-children.is-collapsed { display: none; }\n.ax-jv-collapsed-note {\n  color: var(--ax-muted); font-size: 11px; font-style: italic; margin-left: 4px;\n}\n.ax-jv-empty-brace { color: var(--ax-muted); }\n\n/* ============================================================\n * Detail-page primitives (Agent manage, and any future\n * detail-view). Built around a 3-col layout:\n *\n *   [rail 200px] [main] [test-drive 360px]\n *\n * Scales down: test-drive hides at 1180px, rail hides at 780px.\n * ============================================================ */\n\n/* Crumb */\n.ax-crumb {\n  max-width: 1400px; margin: 0 auto; padding: 16px 24px 0;\n  font-size: 12px; color: var(--ax-muted);\n  display: flex; align-items: center; gap: 6px;\n}\n.ax-crumb a { color: var(--ax-muted); }\n.ax-crumb a:hover { color: var(--ax-accent); text-decoration: none; }\n.ax-crumb .ax-crumb__sep { color: var(--ax-border-2); }\n.ax-crumb .ax-crumb__cur { color: var(--ax-text); }\n\n/* Hero — large avatar + editable name + chip row + actions */\n.ax-hero {\n  max-width: 1400px; margin: 0 auto; padding: 14px 24px 18px;\n  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;\n}\n.ax-hero__ava {\n  width: 64px; height: 64px; border-radius: 14px;\n  background: color-mix(in oklch, var(--ax-accent) 20%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 40%, var(--ax-border));\n  display: grid; place-items: center;\n  font-weight: 700; font-size: 22px; letter-spacing: -0.02em;\n  color: var(--ax-accent); flex-shrink: 0; position: relative;\n}\n.ax-hero__on {\n  position: absolute; bottom: -2px; right: -2px;\n  width: 16px; height: 16px; border-radius: 50%;\n  background: var(--ax-accent); border: 3px solid var(--ax-bg);\n}\n.ax-hero__title { flex: 1; min-width: 260px; }\n.ax-hero h1 {\n  margin: 0 0 3px; font-size: 22px; font-weight: 600;\n  letter-spacing: -0.02em; display: flex; align-items: center; gap: 10px;\n}\n.ax-hero h1 input {\n  background: transparent; border: 0; color: var(--ax-text);\n  font: inherit; padding: 0; border-bottom: 1px dashed transparent;\n  transition: border-color 120ms; max-width: 260px;\n}\n.ax-hero h1 input:hover { border-color: var(--ax-border-2); }\n.ax-hero h1 input:focus { outline: none; border-color: var(--ax-accent); }\n.ax-hero__sub {\n  color: var(--ax-text-2); font-size: 13px; margin-top: 2px;\n  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;\n}\n.ax-hero__sub .ax-hero__dot {\n  width: 3px; height: 3px; background: var(--ax-border-2); border-radius: 50%;\n}\n.ax-hero__actions { display: flex; gap: 8px; align-items: center; }\n\n/* Inline stats strip (smaller than the settings health strip — fits in\n * the detail page hero below the hero title). */\n.ax-stats-inline {\n  max-width: 1400px; margin: 0 auto; padding: 0 24px;\n  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;\n}\n.ax-stat-inline {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); padding: 10px 12px;\n  display: flex; align-items: center; gap: 11px;\n}\n.ax-stat-inline__icon {\n  width: 26px; height: 26px; border-radius: var(--ax-radius);\n  background: color-mix(in oklch, var(--ax-accent) 12%, var(--ax-surface-2));\n  display: grid; place-items: center;\n  color: var(--ax-accent); flex-shrink: 0;\n}\n.ax-stat-inline__icon svg { width: 14px; height: 14px; }\n.ax-stat-inline__v {\n  font-size: 15px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.1;\n}\n.ax-stat-inline__l {\n  font-size: 11px; color: var(--ax-muted); margin-top: 1px;\n}\n\n/* Detail layout — 2-col rail + main. Overlays (test-drive, history, etc.)\n * dock separately via fixed positioning. */\n.ax-layout {\n  max-width: 1400px; margin: 22px auto 0; padding: 0 24px 60px;\n  display: grid; grid-template-columns: 200px 1fr;\n  gap: 22px; align-items: flex-start;\n}\n\n/* Left rail — sticky nav list with grouped items */\n.ax-rail {\n  position: sticky; top: 72px;\n  display: flex; flex-direction: column; gap: 1px;\n}\n.ax-rail a {\n  display: flex; align-items: center; gap: 10px;\n  padding: 9px 11px; border-radius: var(--ax-radius);\n  color: var(--ax-text-2); font-size: 13px; font-weight: 500;\n  cursor: pointer; position: relative;\n  transition: background 120ms, color 120ms;\n}\n.ax-rail a svg {\n  width: 15px; height: 15px; flex-shrink: 0; color: var(--ax-muted);\n}\n.ax-rail a:hover {\n  background: var(--ax-surface); color: var(--ax-text); text-decoration: none;\n}\n.ax-rail a:hover svg { color: var(--ax-text); }\n.ax-rail a.is-active {\n  background: color-mix(in oklch, var(--ax-accent) 12%, var(--ax-surface));\n  color: var(--ax-accent);\n}\n.ax-rail a.is-active svg { color: var(--ax-accent); }\n.ax-rail a.is-active::before {\n  content: \"\"; position: absolute; left: -3px; top: 7px; bottom: 7px;\n  width: 2px; border-radius: var(--ax-radius-sm); background: var(--ax-accent);\n}\n.ax-rail__count {\n  margin-left: auto; font-family: var(--ax-mono);\n  font-size: 10px; padding: 1px 6px; background: var(--ax-surface-2);\n  color: var(--ax-muted); border-radius: var(--ax-radius); line-height: 14px;\n}\n.ax-rail a.is-active .ax-rail__count {\n  background: color-mix(in oklch, var(--ax-accent) 22%, transparent);\n  color: var(--ax-accent);\n}\n.ax-rail__sep { height: 1px; background: var(--ax-border); margin: 8px 4px; }\n.ax-rail__label {\n  font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;\n  color: var(--ax-muted); padding: 6px 11px 4px; font-family: var(--ax-mono);\n}\n\n/* Main panel containers (one per section) */\n.ax-panel {\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 22px;\n}\n.ax-panel + .ax-panel { margin-top: 12px; }\n.ax-panel h2 {\n  margin: 0 0 4px; font-size: 16px; font-weight: 600; letter-spacing: -0.01em;\n}\n.ax-panel .ax-lead {\n  margin: 0 0 16px; font-size: 12.5px; color: var(--ax-text-2); line-height: 1.55;\n}\n.ax-panel__head {\n  display: flex; align-items: flex-start; justify-content: space-between;\n  gap: 12px; margin-bottom: 14px;\n}\n.ax-panel__head h2 { margin: 0 0 3px; }\n.ax-panel__tab { display: none; animation: ax-fade 180ms ease; }\n.ax-panel__tab.is-active { display: block; }\n@keyframes ax-fade {\n  from { opacity: 0; transform: translateY(4px); }\n  to   { opacity: 1; transform: none; }\n}\n\n/* Grids for form rows */\n.ax-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }\n.ax-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }\n\n/* Slider-style setting row — label + hint + segmented options */\n.ax-slider-row {\n  display: grid; grid-template-columns: 140px 1fr auto;\n  gap: 12px; align-items: center;\n  padding: 10px 0; border-bottom: 1px dashed var(--ax-border);\n}\n.ax-slider-row:last-child { border-bottom: 0; }\n.ax-slider-row label { font-size: 12.5px; color: var(--ax-text); margin: 0; }\n.ax-slider-row .ax-hint {\n  margin: 0; color: var(--ax-muted); font-size: 11.5px;\n}\n.ax-slider-row .ax-opts {\n  display: flex; gap: 4px; background: var(--ax-bg);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm); padding: 2px;\n}\n.ax-slider-row .ax-opts button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 5px 11px; font: inherit; font-size: 11.5px;\n  cursor: pointer; border-radius: var(--ax-radius-sm); white-space: nowrap;\n}\n.ax-slider-row .ax-opts button.is-active {\n  background: var(--ax-surface-2); color: var(--ax-text);\n}\n\n/* Sub-tabs (Guided/Freeform, CLAUDE.md/SOUL.md/IDENTITY.md) */\n.ax-subtabs {\n  display: inline-flex; background: var(--ax-bg);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius);\n  padding: 3px; margin-bottom: 16px;\n}\n.ax-subtabs button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 6px 14px; font: inherit; font-size: 12px;\n  cursor: pointer; border-radius: var(--ax-radius-sm); font-weight: 500;\n}\n.ax-subtabs button.is-active {\n  background: var(--ax-surface-2); color: var(--ax-text);\n}\n\n/* Trigger-word chips with inline input (for Wake words field) */\n.ax-triggers-edit {\n  display: flex; flex-wrap: wrap; gap: 6px;\n  background: var(--ax-bg); border: var(--ax-border-w) solid var(--ax-border);\n  padding: 7px; border-radius: var(--ax-radius-sm); min-height: 38px;\n  align-items: center; cursor: text;\n}\n.ax-triggers-edit:focus-within {\n  border-color: var(--ax-accent);\n  box-shadow: 0 0 0 3px color-mix(in oklch, var(--ax-accent) 18%, transparent);\n}\n.ax-trig-pill {\n  display: inline-flex; align-items: center; gap: 6px;\n  font-family: var(--ax-mono); font-size: 11px;\n  padding: 3px 4px 3px 9px;\n  background: color-mix(in oklch, var(--ax-accent) 16%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 30%, var(--ax-border));\n  border-radius: var(--ax-radius-sm); color: var(--ax-accent);\n}\n.ax-trig-pill button {\n  background: transparent; border: 0; color: currentColor;\n  opacity: 0.6; cursor: pointer; font-size: 13px; line-height: 1;\n  padding: 0 2px; border-radius: var(--ax-radius-sm);\n}\n.ax-trig-pill button:hover {\n  opacity: 1;\n  background: color-mix(in oklch, var(--ax-accent) 20%, transparent);\n}\n.ax-triggers-edit input {\n  flex: 1; min-width: 120px;\n  background: transparent; border: 0; color: var(--ax-text);\n  font: inherit; font-size: 12.5px;\n  padding: 4px 6px; font-family: var(--ax-mono);\n}\n.ax-triggers-edit input:focus { outline: none; }\n\n/* Prompt editor (freeform CLAUDE.md) */\n.ax-prompt-edit { position: relative; }\n.ax-prompt-edit textarea { min-height: 220px; line-height: 1.6; }\n.ax-prompt-badges {\n  position: absolute; top: 8px; right: 8px; display: flex; gap: 6px;\n}\n.ax-prompt-badges .ax-pbadge {\n  font-size: 10px; padding: 3px 7px; border-radius: var(--ax-radius-sm);\n  background: var(--ax-surface-2); color: var(--ax-muted);\n  font-family: var(--ax-mono); letter-spacing: 0.03em;\n}\n\n/* Skill gallery */\n.ax-skill-toolbar {\n  display: flex; gap: 10px; align-items: center;\n  margin-bottom: 14px; flex-wrap: wrap;\n}\n.ax-search {\n  position: relative; flex: 1; min-width: 220px;\n}\n.ax-search svg {\n  position: absolute; left: 10px; top: 50%; transform: translateY(-50%);\n  width: 13px; height: 13px; color: var(--ax-muted); pointer-events: none;\n}\n.ax-search input { width: 100%; padding-left: 30px; }\n.ax-skill-filter {\n  display: flex; gap: 4px; background: var(--ax-bg);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm); padding: 2px;\n}\n.ax-skill-filter button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 5px 10px; font: inherit; font-size: 11.5px;\n  cursor: pointer; border-radius: var(--ax-radius-sm);\n}\n.ax-skill-filter button.is-active {\n  background: var(--ax-surface-2); color: var(--ax-text);\n}\n.ax-skill-grid {\n  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));\n  gap: 10px;\n}\n.ax-skill-card {\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 14px;\n  display: flex; flex-direction: column; gap: 8px;\n  cursor: pointer; position: relative; overflow: hidden;\n  transition: border-color 160ms, transform 160ms, background 160ms;\n}\n.ax-skill-card:hover { border-color: var(--ax-border-2); transform: translateY(-1px); }\n.ax-skill-card.is-on {\n  border-color: color-mix(in oklch, var(--ax-accent) 40%, var(--ax-border));\n  background: color-mix(in oklch, var(--ax-accent) 5%, var(--ax-bg-elev));\n}\n.ax-skill-card.is-on::after {\n  content: \"\"; position: absolute; top: 0; right: 0;\n  width: 0; height: 0;\n  border-left: 26px solid transparent;\n  border-top: 26px solid var(--ax-accent);\n}\n.ax-skill-card.is-on::before {\n  content: \"\"; position: absolute; top: 5px; right: 3px;\n  width: 7px; height: 4px;\n  border-left: 2px solid var(--ax-bg);\n  border-bottom: 2px solid var(--ax-bg);\n  transform: rotate(-45deg); z-index: 2;\n}\n.ax-skill-card__top { display: flex; align-items: center; gap: 10px; }\n.ax-skill-card__icon {\n  width: 32px; height: 32px; border-radius: var(--ax-radius);\n  background: var(--ax-surface-2);\n  display: grid; place-items: center; flex-shrink: 0;\n  color: var(--ax-accent);\n}\n.ax-skill-card__icon svg { width: 16px; height: 16px; }\n.ax-skill-card__name {\n  font-weight: 600; font-size: 13px; letter-spacing: -0.005em;\n}\n.ax-skill-card__slug {\n  font-family: var(--ax-mono); font-size: 10.5px;\n  color: var(--ax-muted); margin-top: 1px;\n}\n.ax-skill-card__desc {\n  font-size: 12px; color: var(--ax-text-2); line-height: 1.5;\n  flex: 1; min-height: 32px;\n}\n.ax-skill-card__foot {\n  display: flex; align-items: center; justify-content: space-between;\n  font-size: 11px; color: var(--ax-muted);\n}\n\n/* Info callout (similar to wit but inline inside panels) */\n.ax-callout {\n  background: color-mix(in oklch, var(--ax-info) 5%, var(--ax-bg-elev));\n  border: 1px solid color-mix(in oklch, var(--ax-info) 20%, var(--ax-border));\n  border-radius: var(--ax-radius-sm); padding: 12px 14px;\n  font-size: 12.5px; color: var(--ax-text-2); line-height: 1.6;\n  display: flex; gap: 10px; align-items: flex-start; margin-bottom: 16px;\n}\n.ax-callout__icon {\n  width: 18px; height: 18px; border-radius: 50%;\n  background: color-mix(in oklch, var(--ax-info) 18%, transparent);\n  color: var(--ax-info); display: grid; place-items: center;\n  font-size: 11px; font-weight: 600; flex-shrink: 0; margin-top: 1px;\n}\n.ax-callout b { color: var(--ax-text); }\n.ax-callout code {\n  font-family: var(--ax-mono); font-size: 11.5px;\n  background: var(--ax-bg); padding: 1px 5px; border-radius: var(--ax-radius-sm);\n  border: var(--ax-border-w) solid var(--ax-border);\n}\n\n/* Channel-binding rows (agent-specific view) */\n.ax-chan-row {\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); padding: 12px 14px;\n  display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\n}\n.ax-chan-row__logo {\n  width: 32px; height: 32px; border-radius: var(--ax-radius);\n  display: grid; place-items: center;\n  font-weight: 700; font-size: 13px; color: white; flex-shrink: 0;\n  font-family: var(--ax-mono);\n}\n.ax-chan-row__info { flex: 1; }\n.ax-chan-row__name { font-size: 13px; font-weight: 600; }\n.ax-chan-row__desc {\n  font-size: 12px; color: var(--ax-muted);\n  margin-top: 2px; font-family: var(--ax-mono);\n}\n\n/* Handover viz (from-agent → to-agent arrow) */\n.ax-handover-viz {\n  display: flex; align-items: center; justify-content: space-between;\n  gap: 14px; padding: 16px 18px;\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); margin-bottom: 14px;\n}\n.ax-ho-side {\n  display: flex; flex-direction: column; align-items: center;\n  gap: 6px; flex: 0 0 130px;\n}\n.ax-ho-side__av {\n  width: 42px; height: 42px; border-radius: var(--ax-radius);\n  display: grid; place-items: center;\n  font-weight: 600; font-size: 15px;\n}\n.ax-ho-side--from .ax-ho-side__av {\n  background: color-mix(in oklch, var(--ax-accent) 18%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 35%, var(--ax-border));\n  color: var(--ax-accent);\n}\n.ax-ho-side--to .ax-ho-side__av {\n  background: var(--ax-surface-2); border: var(--ax-border-w) solid var(--ax-border-2);\n  color: var(--ax-text);\n}\n.ax-ho-side__nm { font-size: 12px; font-weight: 600; }\n.ax-ho-side__rl {\n  font-size: 10px; color: var(--ax-muted);\n  text-transform: uppercase; letter-spacing: 0.06em;\n  font-family: var(--ax-mono);\n}\n.ax-ho-wire {\n  flex: 1; height: 2px; position: relative;\n  background: repeating-linear-gradient(90deg,\n    var(--ax-border-2) 0, var(--ax-border-2) 4px,\n    transparent 4px, transparent 8px);\n}\n.ax-ho-wire svg {\n  position: absolute; right: -6px; top: 50%; transform: translateY(-50%);\n  width: 16px; height: 16px; color: var(--ax-accent);\n}\n.ax-ho-list-row {\n  display: flex; align-items: center; gap: 10px;\n  padding: 10px 12px;\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); margin-bottom: 6px;\n  font-size: 12.5px;\n}\n.ax-ho-list-row .ax-who { flex: 1; color: var(--ax-text-2); }\n.ax-ho-list-row .ax-who b {\n  color: var(--ax-text); font-family: var(--ax-mono); font-weight: 500;\n}\n.ax-ho-list-row .ax-when { color: var(--ax-muted); font-size: 11px; }\n\n/* Activity cells + spark + session rows */\n.ax-activity-grid {\n  display: grid; grid-template-columns: repeat(4, 1fr);\n  gap: 10px; margin-bottom: 18px;\n}\n.ax-activity-cell {\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); padding: 14px;\n}\n.ax-activity-cell .ax-v {\n  font-size: 20px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2;\n}\n.ax-activity-cell .ax-l {\n  font-size: 11px; color: var(--ax-muted); margin-top: 2px;\n}\n.ax-activity-cell .ax-delta {\n  font-size: 11px; margin-top: 6px;\n  display: inline-flex; align-items: center; gap: 3px;\n}\n.ax-activity-cell .ax-delta--up { color: var(--ax-accent); }\n.ax-activity-cell .ax-delta--down { color: var(--ax-muted); }\n\n.ax-spark { width: 100%; height: 100px; margin: 10px 0 14px; }\n\n.ax-session {\n  display: flex; align-items: center; gap: 10px;\n  padding: 10px 12px;\n  background: var(--ax-bg-elev); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-sm); margin-bottom: 6px;\n  font-size: 12.5px;\n}\n.ax-session__ch {\n  width: 24px; height: 24px; border-radius: var(--ax-radius-sm);\n  display: grid; place-items: center;\n  font-weight: 700; font-size: 10px; color: white;\n  flex-shrink: 0; font-family: var(--ax-mono);\n}\n.ax-session__body { flex: 1; min-width: 0; }\n.ax-session__txt {\n  color: var(--ax-text); overflow: hidden; text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.ax-session__meta {\n  font-size: 11px; color: var(--ax-muted);\n  margin-top: 1px; font-family: var(--ax-mono);\n}\n\n/* Log row (Conversations tab) */\n.ax-log-head {\n  display: grid; grid-template-columns: 24px 90px 160px 1fr auto;\n  gap: 12px; padding: 8px 10px;\n  border-bottom: var(--ax-border-w) solid var(--ax-border-2);\n  font-size: 10px; color: var(--ax-muted);\n  text-transform: uppercase; letter-spacing: 0.06em; font-family: var(--ax-mono);\n}\n.ax-log-row {\n  display: grid; grid-template-columns: 24px 90px 160px 1fr auto;\n  gap: 12px; align-items: center; padding: 9px 10px;\n  border-bottom: var(--ax-border-w) solid var(--ax-border); font-size: 12px;\n}\n.ax-log-row:hover { background: color-mix(in oklch, var(--ax-accent) 4%, transparent); }\n.ax-log-row .ax-sev {\n  width: 8px; height: 8px; border-radius: 50%; margin-left: 8px;\n}\n.ax-log-row .ax-sev--ok { background: var(--ax-accent); }\n.ax-log-row .ax-sev--warn { background: var(--ax-warn); }\n.ax-log-row .ax-sev--err { background: var(--ax-err); }\n.ax-log-row .ax-t {\n  font-family: var(--ax-mono); color: var(--ax-muted); font-size: 11px;\n}\n.ax-log-row .ax-who {\n  font-family: var(--ax-mono); font-size: 11px; color: var(--ax-text-2);\n}\n.ax-log-row .ax-msg {\n  color: var(--ax-text); overflow: hidden;\n  text-overflow: ellipsis; white-space: nowrap;\n}\n.ax-log-row .ax-ms {\n  color: var(--ax-muted); font-family: var(--ax-mono); font-size: 11px;\n}\n\n/* Danger zone */\n.ax-panel--danger {\n  border-color: color-mix(in oklch, var(--ax-err) 30%, var(--ax-border));\n}\n.ax-danger-item {\n  display: flex; align-items: center; gap: 14px;\n  padding: 14px 0; border-bottom: 1px dashed var(--ax-border);\n}\n.ax-danger-item:last-child { border-bottom: 0; padding-bottom: 0; }\n.ax-danger-item:first-child { padding-top: 4px; }\n.ax-danger-item__info { flex: 1; }\n.ax-danger-item__name { font-size: 13px; font-weight: 600; margin-bottom: 3px; }\n.ax-danger-item__desc { font-size: 12px; color: var(--ax-muted); line-height: 1.5; }\n\n/* Test-drive panel — docked to the right edge, slides in from outside\n * the viewport when toggled. Similar to the Live page history-panel. */\n.ax-td-panel {\n  position: fixed; top: 0; right: 0; bottom: 0; width: 420px;\n  background: var(--ax-bg-elev); border-left: var(--ax-border-w) solid var(--ax-border);\n  z-index: 900;\n  display: flex; flex-direction: column;\n  box-shadow: -8px 0 24px rgba(0,0,0,0.4);\n  transform: translateX(100%); transition: transform 0.22s ease;\n}\n.ax-td-panel.is-open { transform: translateX(0); }\n@media (max-width: 520px) {\n  .ax-td-panel { width: 100vw; }\n}\n.ax-td-head {\n  padding: 12px 14px; border-bottom: var(--ax-border-w) solid var(--ax-border);\n  background: var(--ax-bg-elev);\n  display: flex; align-items: center; gap: 10px;\n}\n.ax-td-head__dot {\n  width: 8px; height: 8px; border-radius: 50%;\n  background: var(--ax-accent);\n  box-shadow: 0 0 8px color-mix(in oklch, var(--ax-accent) 60%, transparent);\n  animation: ax-pulse 2.2s infinite;\n}\n.ax-td-head__t { flex: 1; font-size: 12px; font-weight: 600; }\n.ax-td-head__sub {\n  font-size: 11px; color: var(--ax-muted); font-family: var(--ax-mono);\n}\n.ax-td-head__seg {\n  display: inline-flex; background: var(--ax-surface);\n  border: var(--ax-border-w) solid var(--ax-border); border-radius: var(--ax-radius-sm); padding: 2px;\n}\n.ax-td-head__seg button {\n  background: transparent; border: 0; color: var(--ax-muted);\n  padding: 3px 8px; font: inherit; font-size: 10.5px;\n  cursor: pointer; border-radius: var(--ax-radius-sm); font-family: var(--ax-mono);\n}\n.ax-td-head__seg button.is-active {\n  background: var(--ax-surface-2); color: var(--ax-text);\n}\n\n.ax-td-scenarios {\n  padding: 10px 14px; background: var(--ax-bg-elev);\n  border-bottom: var(--ax-border-w) solid var(--ax-border);\n  display: flex; gap: 5px; flex-wrap: wrap;\n}\n.ax-td-scenarios__lbl {\n  font-size: 10px; color: var(--ax-muted);\n  text-transform: uppercase; letter-spacing: 0.06em;\n  font-family: var(--ax-mono); width: 100%; margin-bottom: 3px;\n}\n.ax-td-scenario {\n  font-size: 11px; padding: 3px 8px;\n  background: var(--ax-surface); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius); color: var(--ax-text-2);\n  cursor: pointer; transition: all 120ms;\n}\n.ax-td-scenario:hover { border-color: var(--ax-accent); color: var(--ax-accent); }\n\n.ax-td-chat {\n  flex: 1; overflow-y: auto; padding: 14px;\n  display: flex; flex-direction: column; gap: 8px;\n  background: var(--ax-bg);\n}\n.ax-td-chat__msg-wrap {\n  display: flex; flex-direction: column; gap: 2px; max-width: 86%;\n}\n.ax-td-chat__msg-wrap.is-user { align-self: flex-end; align-items: flex-end; }\n.ax-td-chat__msg-wrap.is-bot { align-self: flex-start; }\n.ax-td-chat__bubble {\n  padding: 8px 12px; border-radius: var(--ax-radius-lg);\n  font-size: 12.5px; line-height: 1.55; word-wrap: break-word;\n}\n.ax-td-chat__bubble.is-user {\n  background: var(--ax-accent); color: var(--ax-bg);\n  border-bottom-right-radius: 3px; font-weight: 500;\n}\n.ax-td-chat__bubble.is-bot {\n  background: var(--ax-surface-2); color: var(--ax-text);\n  border-bottom-left-radius: 3px; border: var(--ax-border-w) solid var(--ax-border);\n}\n.ax-td-chat__meta {\n  font-size: 9.5px; color: var(--ax-muted);\n  font-family: var(--ax-mono); padding: 0 4px;\n}\n.ax-td-chat__typing {\n  align-self: flex-start; padding: 10px 14px;\n  background: var(--ax-surface-2); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius-lg); border-bottom-left-radius: 3px;\n  display: inline-flex; gap: 4px;\n}\n.ax-td-chat__typing span {\n  width: 6px; height: 6px; background: var(--ax-muted);\n  border-radius: 50%; animation: axTypingBounce 1.2s infinite;\n}\n.ax-td-chat__typing span:nth-child(2) { animation-delay: 0.15s; }\n.ax-td-chat__typing span:nth-child(3) { animation-delay: 0.3s; }\n@keyframes axTypingBounce {\n  0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }\n  30% { transform: translateY(-5px); opacity: 1; }\n}\n.ax-td-input {\n  padding: 10px; border-top: var(--ax-border-w) solid var(--ax-border);\n  background: var(--ax-bg-elev); display: flex; gap: 6px;\n}\n.ax-td-input input {\n  flex: 1; background: var(--ax-bg); border: var(--ax-border-w) solid var(--ax-border);\n  border-radius: var(--ax-radius); padding: 8px 11px;\n  color: var(--ax-text); font: inherit; font-size: 12.5px;\n}\n.ax-td-input input:focus { outline: none; border-color: var(--ax-accent); }\n.ax-td-input button {\n  background: var(--ax-accent); color: var(--ax-bg); border: 0;\n  border-radius: var(--ax-radius); padding: 0 12px;\n  cursor: pointer; font-weight: 600;\n}\n.ax-td-input button:hover {\n  background: color-mix(in oklch, var(--ax-accent) 88%, white);\n}\n\n/* Inline task-queue chip on bot messages */\n.ax-td-task-chip {\n  display: inline-flex; align-items: center; gap: 5px;\n  margin-top: 5px; padding: 3px 8px;\n  background: color-mix(in oklch, var(--ax-accent) 10%, var(--ax-surface));\n  border: 1px solid color-mix(in oklch, var(--ax-accent) 35%, var(--ax-border));\n  border-radius: var(--ax-radius); font-size: 10px; color: var(--ax-accent);\n  font-family: var(--ax-mono); letter-spacing: 0.04em;\n  cursor: default; user-select: none;\n}\n.ax-td-task-chip__dot {\n  width: 6px; height: 6px; border-radius: 50%;\n  background: var(--ax-accent); flex-shrink: 0;\n}\n.ax-td-task-chip--queued .ax-td-task-chip__dot {\n  background: var(--ax-muted);\n}\n.ax-td-task-chip__id {\n  font-family: var(--ax-mono); opacity: 0.7; font-size: 9px;\n}\n\n/* Section mini-label used throughout detail pages */\n.ax-sec-label-d {\n  display: flex; align-items: center; justify-content: space-between;\n  margin: 20px 0 10px;\n}\n.ax-sec-label-d h3 {\n  font-size: 11px; font-weight: 600; letter-spacing: 0.06em;\n  text-transform: uppercase; color: var(--ax-muted);\n  margin: 0; font-family: var(--ax-mono);\n}\n\n/* --- Responsive collapses for the settings primitives --- */\n@media (max-width: 1180px) {\n  .ax-layout { grid-template-columns: 180px 1fr; }\n}\n@media (max-width: 760px) {\n  .ax-health-strip { grid-template-columns: repeat(2, 1fr); }\n  .ax-connectors { grid-template-columns: 1fr; }\n  .ax-detail-grid { grid-template-columns: 1fr; }\n  .ax-mesh-hero { grid-template-columns: 1fr; }\n  .ax-mesh-viz { margin: 0 auto; }\n  .ax-cron-hints { grid-template-columns: 1fr; }\n  .ax-layout { grid-template-columns: 1fr; }\n  .ax-rail { display: none; }\n  .ax-stats-inline { grid-template-columns: repeat(2, 1fr); }\n  .ax-activity-grid { grid-template-columns: repeat(2, 1fr); }\n  .ax-log-head, .ax-log-row { grid-template-columns: 8px 80px 1fr auto; }\n  .ax-log-head span:nth-child(3), .ax-log-row .ax-who { display: none; }\n  .ax-grid-2, .ax-grid-3 { grid-template-columns: 1fr; }\n}`\n","// --- Page shell renderer ---\n//\n// Every dashboard page used to hand-roll its own <html><head><body> wrapper:\n// meta tags, font links, theme bootstrap script, style tags, topbar markup,\n// closing tags. That's ~60 lines of boilerplate per page, identical across\n// ~8 pages. This module centralises it.\n//\n// A page calls `renderShell({ title, activeTab, subtitle, body, css, ... })`\n// and gets back a complete HTML document with:\n//   - Correct <meta>, <title>, Plex font link, theme-bootstrap script\n//   - AX_TOKENS_CSS (design tokens) + AX_COMPONENTS_CSS (badge/stat/card/...)\n//   - TOPBAR_CSS (chrome) always included\n//   - Page-specific CSS appended after\n//   - renderTopbar() at the top\n//   - <main> with the page body\n//   - TOPBAR_SCRIPT (theme toggle + mesh selector) at the end\n//   - Page-specific <script> appended after\n//\n// Pages that want a slimmer header (e.g. /setup, which has its own simplified\n// topbar) can pass `renderHeader: \"custom\"` and provide their own <header>.\n\nimport { AX_TOKENS_CSS } from \"./tokens\"\nimport { AX_COMPONENTS_CSS } from \"./components.css\"\nimport {\n  TOPBAR_HEAD,\n  TOPBAR_CSS,\n  TOPBAR_SCRIPT,\n  renderTopbar,\n  type TopbarOpts,\n  type TopbarPeer,\n} from \"../topbar\"\n\nexport interface ShellOpts {\n  /** Browser tab title — \"AgentX · Live\", \"AgentX · Settings\", etc. */\n  title: string\n  /**\n   * The topbar tab to highlight, OR \"custom\" to skip rendering the default\n   * topbar so the page can provide its own header.\n   */\n  activeTab: TopbarOpts[\"activeTab\"] | \"custom\"\n  /** Subtitle after the brand — \"Live\", \"Settings\", \"Setup\", \"Intent Graph\". */\n  subtitle: string\n  /** Page body HTML — everything inside <main>. */\n  body: string\n  /** Optional HTML inserted as a second row under the topbar. */\n  subheader?: string\n  /**\n   * Page-specific CSS appended after the shared blocks. Use this for styles\n   * that aren't worth promoting to components.css (e.g. kanban column\n   * layout, graph tree indentation).\n   */\n  css?: string\n  /** Page-specific <script> blocks (full tags, not raw JS). */\n  scripts?: string\n  /** Mesh peers to populate the selector. */\n  peers?: TopbarPeer[]\n  currentPeerId?: string\n  /** If provided, replaces the default topbar entirely. */\n  customHeader?: string\n  /**\n   * When true, omit the <main> wrapper — caller renders their own. Useful\n   * for pages (e.g. boards kanban) that need a full-viewport layout without\n   * the default padding.\n   */\n  noMain?: boolean\n  /** Extra content to inject into <head> (rare — e.g. preload hints). */\n  headExtras?: string\n}\n\nexport function renderShell(opts: ShellOpts): string {\n  const css = `${AX_TOKENS_CSS}\\n${AX_COMPONENTS_CSS}\\n${TOPBAR_CSS}${opts.css ? \"\\n\" + opts.css : \"\"}`\n\n  const header = opts.customHeader\n    ?? (opts.activeTab === \"custom\"\n      ? \"\"\n      : renderTopbar({\n          activeTab: opts.activeTab,\n          subtitle: opts.subtitle,\n          subheader: opts.subheader,\n          peers: opts.peers,\n          currentPeerId: opts.currentPeerId,\n        }))\n\n  const main = opts.noMain ? opts.body : `<main>${opts.body}</main>`\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<title>${escapeTitle(opts.title)}</title>\n${TOPBAR_HEAD}\n${opts.headExtras || \"\"}\n<style>${css}</style>\n</head>\n<body>\n${header}\n${main}\n${TOPBAR_SCRIPT}\n${opts.scripts || \"\"}\n</body>\n</html>`\n}\n\nfunction escapeTitle(s: string): string {\n  return String(s || \"\").replace(/[<>&]/g, (c) => ({ \"<\": \"&lt;\", \">\": \"&gt;\", \"&\": \"&amp;\" }[c] as string))\n}\n","// Shared small utilities for UI renderers.\n\n/**\n * HTML-escape a string so it's safe to interpolate inside attributes or text\n * content. Every page used to ship its own `esc` / `escapeHtml` / `safe` —\n * this is the canonical one.\n */\nexport function esc(s: unknown): string {\n  return String(s ?? \"\").replace(/[&<>\"']/g, (c) => ({\n    \"&\": \"&amp;\", \"<\": \"&lt;\", \">\": \"&gt;\", '\"': \"&quot;\", \"'\": \"&#39;\",\n  }[c] as string))\n}\n\n/** Join class names, dropping falsy values. */\nexport function cx(...parts: Array<string | false | null | undefined>): string {\n  return parts.filter(Boolean).join(\" \")\n}\n","// --- Shared UI components ---\n//\n// Small helpers that return HTML strings. Used by every page to produce\n// consistent badges, cards, form rows, buttons without copy-pasting.\n//\n// ### Philosophy\n//\n// - Pure functions: `string` in, `string` out. No classes, no DSL, no JSX.\n// - Caller composes: `cardHtml(children)` not `Card({children})`.\n// - Null/undefined opts render an empty string, so conditional composition\n//   just inlines: `${badge(...) ?? \"\"}` without wrapper ifs.\n// - Variants are flat classnames, not object props: `badge(\"LIVE\", \"live\")`\n//   not `badge({label: \"LIVE\", variant: \"live\"})`. Cheaper to read, easier\n//   to grep for.\n\nimport { esc } from \"./util\"\n\n// --- Dots (status indicators) ---\n\nexport type DotKind = \"ok\" | \"live\" | \"warn\" | \"err\" | \"off\" | undefined\n\nexport function dot(kind?: DotKind, pulse = false): string {\n  const classes = [\"ax-dot\", kind ? `ax-dot--${kind}` : \"\", pulse ? \"ax-dot--pulse\" : \"\"]\n    .filter(Boolean).join(\" \")\n  return `<span class=\"${classes}\"></span>`\n}\n\n// --- Badges (small pill labels) ---\n\nexport type BadgeKind = \"accent\" | \"live\" | \"warn\" | \"err\" | \"ghost\" | \"mono\" | undefined\n\nexport function badge(label: string, kind?: BadgeKind, extraClass = \"\"): string {\n  const classes = [\"ax-badge\", kind ? `ax-badge--${kind}` : \"\", extraClass]\n    .filter(Boolean).join(\" \")\n  return `<span class=\"${classes}\">${esc(label)}</span>`\n}\n\n// --- Buttons ---\n\nexport interface BtnOpts {\n  type?: \"button\" | \"submit\"\n  primary?: boolean\n  ghost?: boolean\n  danger?: boolean\n  id?: string\n  disabled?: boolean\n  extraClass?: string\n  onclick?: string\n}\n\nexport function btn(label: string, opts: BtnOpts = {}): string {\n  const classes = [\"ax-btn\",\n    opts.primary ? \"ax-btn--primary\" : \"\",\n    opts.ghost ? \"ax-btn--ghost\" : \"\",\n    opts.danger ? \"ax-btn--danger\" : \"\",\n    opts.extraClass || \"\",\n  ].filter(Boolean).join(\" \")\n  const attrs = [\n    `type=\"${opts.type || \"button\"}\"`,\n    `class=\"${classes}\"`,\n    opts.id ? `id=\"${esc(opts.id)}\"` : \"\",\n    opts.disabled ? \"disabled\" : \"\",\n    opts.onclick ? `onclick=\"${esc(opts.onclick)}\"` : \"\",\n  ].filter(Boolean).join(\" \")\n  return `<button ${attrs}>${esc(label)}</button>`\n}\n\n// --- Stat cards (the \"NUMBER + label\" strip) ---\n\nexport interface StatOpts {\n  label: string\n  value: string\n  sub?: string\n  kind?: \"live\" | \"warn\" | \"err\"\n}\n\nexport function stat(opts: StatOpts): string {\n  const cls = opts.kind ? `ax-stat ax-stat--${opts.kind}` : \"ax-stat\"\n  return `<div class=\"${cls}\">\n    <div class=\"ax-stat__label\">${esc(opts.label)}</div>\n    <div class=\"ax-stat__value\">${esc(opts.value)}</div>\n    ${opts.sub ? `<div class=\"ax-stat__sub\">${esc(opts.sub)}</div>` : \"\"}\n  </div>`\n}\n\nexport function statStrip(stats: StatOpts[]): string {\n  return `<div class=\"ax-statstrip\">${stats.map(stat).join(\"\")}</div>`\n}\n\n// --- Form field (label + input/textarea/select) ---\n\nexport interface FieldOpts {\n  name: string\n  label: string\n  hint?: string\n  type?: \"text\" | \"password\" | \"email\" | \"url\" | \"number\" | \"textarea\" | \"select\"\n  value?: string\n  placeholder?: string\n  pattern?: string\n  required?: boolean\n  readonly?: boolean\n  rows?: number\n  options?: Array<{ value: string; label: string; selected?: boolean }>\n  extraAttrs?: string\n}\n\nexport function field(opts: FieldOpts): string {\n  const labelHtml = `<label>${esc(opts.label)}${\n    opts.hint ? ` <span class=\"ax-hint\">${opts.hint}</span>` : \"\"\n  }</label>`\n  let controlHtml = \"\"\n  const common = [\n    `name=\"${esc(opts.name)}\"`,\n    opts.required ? \"required\" : \"\",\n    opts.readonly ? \"readonly\" : \"\",\n    opts.placeholder ? `placeholder=\"${esc(opts.placeholder)}\"` : \"\",\n    opts.extraAttrs || \"\",\n  ].filter(Boolean).join(\" \")\n\n  if (opts.type === \"textarea\") {\n    controlHtml = `<textarea ${common} rows=\"${opts.rows || 3}\">${esc(opts.value || \"\")}</textarea>`\n  } else if (opts.type === \"select\" && opts.options) {\n    const options = opts.options.map(o =>\n      `<option value=\"${esc(o.value)}\"${o.selected ? \" selected\" : \"\"}>${esc(o.label)}</option>`\n    ).join(\"\")\n    controlHtml = `<select ${common}>${options}</select>`\n  } else {\n    const type = opts.type || \"text\"\n    controlHtml = `<input type=\"${type}\" ${common}`\n      + (opts.value !== undefined ? ` value=\"${esc(opts.value)}\"` : \"\")\n      + (opts.pattern ? ` pattern=\"${esc(opts.pattern)}\"` : \"\")\n      + \" />\"\n  }\n  return `<div class=\"ax-field\">${labelHtml}${controlHtml}</div>`\n}\n\nexport function row(children: string[]): string {\n  return `<div class=\"ax-row\">${children.join(\"\")}</div>`\n}\n\n// --- Cards ---\n\nexport function card(content: string, extraClass = \"\"): string {\n  return `<div class=\"ax-card${extraClass ? \" \" + extraClass : \"\"}\">${content}</div>`\n}\n\nexport function stepCard(num: number | string, title: string, body: string): string {\n  return `<section class=\"ax-step\">\n    <div class=\"ax-step__head\"><span class=\"ax-step__num\">${esc(String(num))}</span>${esc(title)}</div>\n    ${body}\n  </section>`\n}\n\n// --- Small layout helpers ---\n\nexport function spacer(height = 12): string {\n  return `<div style=\"height:${height}px\"></div>`\n}\n\n// ============================================================================\n// Settings-page primitives (from the Stitch redesign)\n// ============================================================================\n\n/** Page head — kicker + h1 + lead. Lives outside <main> so it can span wider. */\nexport interface PageHeadOpts {\n  kicker?: string\n  title: string\n  lead?: string\n}\nexport function pageHead(opts: PageHeadOpts): string {\n  return `<div class=\"ax-page-head\">\n    ${opts.kicker ? `<div class=\"ax-kicker\">${esc(opts.kicker)}</div>` : \"\"}\n    <h1>${esc(opts.title)}</h1>\n    ${opts.lead ? `<p class=\"ax-lead\">${opts.lead}</p>` : \"\"}\n  </div>`\n}\n\n/** 4-up health strip: colour-coded status cards across the top of a page. */\nexport interface HealthCardOpts {\n  kind?: \"ok\" | \"warn\" | \"off\"\n  num: string\n  label: string\n}\nexport function healthCard(opts: HealthCardOpts): string {\n  const kind = opts.kind || \"off\"\n  return `<div class=\"ax-health-card\">\n    <div class=\"ax-hc-dot ax-hc-dot--${kind}\"></div>\n    <div class=\"ax-hc-txt\">\n      <div class=\"ax-hc-num\">${esc(opts.num)}</div>\n      <div class=\"ax-hc-lbl\">${esc(opts.label)}</div>\n    </div>\n  </div>`\n}\nexport function healthStrip(cards: HealthCardOpts[]): string {\n  return `<div class=\"ax-health-strip\">${cards.map(healthCard).join(\"\")}</div>`\n}\n\n/**\n * \"What is this?\" banner. Renders a dismissable explanatory box for users\n * meeting a tab for the first time. Pass raw HTML for body — short runs\n * with <b> and <code> are the intended style.\n */\nexport interface WitOpts {\n  bodyHtml: string\n  /** Persist the dismissal under this key in localStorage. Optional. */\n  persistKey?: string\n  icon?: string\n}\nexport function witBanner(opts: WitOpts): string {\n  const attr = opts.persistKey ? ` data-wit=\"${esc(opts.persistKey)}\"` : \"\"\n  return `<div class=\"ax-wit\"${attr}>\n    <span class=\"ax-wit__icon\">${esc(opts.icon || \"?\")}</span>\n    <div>${opts.bodyHtml}</div>\n    <button class=\"ax-wit__dismiss\" onclick=\"this.parentElement.style.display='none'\">×</button>\n  </div>`\n}\n\n/**\n * Section header with icon chip + title + lead + optional right-aligned\n * action. Icon is raw SVG so the caller picks the glyph; feed a 24x24\n * stroked Feather-style icon for best fit.\n */\nexport interface SectionHeadOpts {\n  icon: string\n  title: string\n  lead?: string\n  actionHtml?: string\n}\nexport function sectionHead(opts: SectionHeadOpts): string {\n  return `<div class=\"ax-section-head\">\n    <div class=\"ax-section-head__icon\">${opts.icon}</div>\n    <div class=\"ax-section-head__text\">\n      <h2>${esc(opts.title)}</h2>\n      ${opts.lead ? `<p class=\"ax-lead\">${esc(opts.lead)}</p>` : \"\"}\n    </div>\n    ${opts.actionHtml || \"\"}\n  </div>`\n}\n\n/** Coloured-initial avatar — pass 1-2 letters; variant sets the tint. */\nexport type AvatarVariant = \"plain\" | \"teal\" | \"coral\" | \"amber\" | \"blue\"\nexport function avatar(initials: string, variant: AvatarVariant = \"plain\"): string {\n  const cls = variant === \"plain\" ? \"ax-avatar\" : `ax-avatar ax-avatar--${variant}`\n  return `<div class=\"${cls}\">${esc(initials)}</div>`\n}\n\n/**\n * Status pill with coloured dot — \"live\", \"idle\", \"receiving\", \"stale\".\n * Different from {@link badge}: pill has a rounded shape (10px radius) and\n * a leading dot. Prefer for attached-to-name status labels.\n */\nexport type PillKind = \"ok\" | \"warn\" | \"off\" | \"info\" | \"plain\"\nexport function pill(label: string, kind: PillKind = \"plain\", withDot = true): string {\n  const cls = kind === \"plain\" ? \"ax-pill\" : `ax-pill ax-pill--${kind}`\n  const dot = withDot && kind !== \"plain\" && kind !== \"off\" ? `<span class=\"ax-pill__dot\"></span>` : \"\"\n  return `<span class=\"${cls}\">${dot}${esc(label)}</span>`\n}\n\n/**\n * Row card with colored avatar + info + actions + optional expandable\n * details section. Details are hidden behind `.is-open` on the card;\n * toggleCard() on the client flips it.\n */\nexport interface RowCardOpts {\n  avatarHtml?: string\n  /** Left block: title + pills + sub-line. Raw HTML. */\n  infoHtml: string\n  /** Right-aligned action cluster. Raw HTML (usually btns). */\n  actionsHtml?: string\n  /** Collapsible details. When provided, the card is collapsible. */\n  detailsHtml?: string\n  /** Initial open state. Default false. */\n  open?: boolean\n  /** Extra classes on the card wrapper. */\n  extraClass?: string\n}\nexport function rowCard(opts: RowCardOpts): string {\n  const cls = [\"ax-row-card\", opts.open ? \"is-open\" : \"\", opts.extraClass || \"\"]\n    .filter(Boolean).join(\" \")\n  return `<div class=\"${cls}\">\n    <div class=\"ax-row-card__top\">\n      ${opts.avatarHtml || \"\"}\n      <div class=\"ax-row-card__info\">${opts.infoHtml}</div>\n      ${opts.actionsHtml ? `<div class=\"ax-row-card__actions\">${opts.actionsHtml}</div>` : \"\"}\n    </div>\n    ${opts.detailsHtml ? `<div class=\"ax-row-card__details\">${opts.detailsHtml}</div>` : \"\"}\n  </div>`\n}\n\n/**\n * Channel/webhook-style connector card — big logo, name, status pill,\n * description, foot row. Clickable (caller attaches onclick / wraps\n * in <a>).\n */\nexport interface ConnectorOpts {\n  logoHtml: string\n  name: string\n  sub: string\n  statusHtml?: string\n  desc: string\n  footLeft?: string\n  footCta?: string\n  isOn?: boolean\n  onclick?: string\n  extraStyle?: string\n}\nexport function connector(opts: ConnectorOpts): string {\n  const cls = opts.isOn ? \"ax-connector is-on\" : \"ax-connector\"\n  const onclick = opts.onclick ? ` onclick=\"${esc(opts.onclick)}\"` : \"\"\n  const style = opts.extraStyle ? ` style=\"${esc(opts.extraStyle)}\"` : \"\"\n  return `<div class=\"${cls}\"${onclick}${style}>\n    <div class=\"ax-connector__top\">\n      ${opts.logoHtml}\n      <div class=\"ax-connector__meta\">\n        <div class=\"ax-connector__name\">${esc(opts.name)}</div>\n        <div class=\"ax-connector__sub\">${esc(opts.sub)}</div>\n      </div>\n      ${opts.statusHtml ? `<div class=\"ax-connector__status\">${opts.statusHtml}</div>` : \"\"}\n    </div>\n    <div class=\"ax-connector__desc\">${opts.desc}</div>\n    <div class=\"ax-connector__foot\">\n      <span>${esc(opts.footLeft || \"\")}</span>\n      ${opts.footCta\n        ? `<span class=\"ax-connector__cta\">${esc(opts.footCta)} <svg viewBox=\"0 0 12 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M4 2l4 4-4 4\"/></svg></span>`\n        : \"\"}\n    </div>\n  </div>`\n}\n\n/** Empty state used when a tab has nothing yet. */\nexport interface EmptyOpts {\n  title: string\n  desc?: string\n  actionHtml?: string\n}\nexport function emptyState(opts: EmptyOpts): string {\n  return `<div class=\"ax-empty-card\" style=\"text-align:center;padding:42px 22px;background:var(--ax-surface);border:1px dashed var(--ax-border-2);border-radius:var(--ax-radius-lg);color:var(--ax-muted)\">\n    <h3 style=\"margin:0 0 4px;color:var(--ax-text);font-size:15px;font-weight:600\">${esc(opts.title)}</h3>\n    ${opts.desc ? `<p style=\"margin:0 0 16px;font-size:13px;line-height:1.55;max-width:380px;margin-left:auto;margin-right:auto\">${esc(opts.desc)}</p>` : \"\"}\n    ${opts.actionHtml || \"\"}\n  </div>`\n}\n\n/** Mini-label used to divide sections inside a tab. */\nexport interface SecLabelOpts {\n  label: string\n  rightHtml?: string\n}\nexport function secLabel(opts: SecLabelOpts): string {\n  return `<div class=\"ax-sec-label\"><h3>${esc(opts.label)}</h3>${opts.rightHtml || \"\"}</div>`\n}\n\n/** Toast element + helper script. Include once per page that uses it. */\nexport const TOAST_HTML = `<div class=\"ax-toast\" id=\"ax-toast\">\n  <svg class=\"ax-toast__icon\" width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M20 6L9 17l-5-5\"/></svg>\n  <span id=\"ax-toast-msg\">Copied</span>\n</div>`\nexport const TOAST_SCRIPT = `\n  let __axToastTimer;\n  window.showToast = function(msg) {\n    const el = document.getElementById('ax-toast');\n    const m = document.getElementById('ax-toast-msg');\n    if (!el || !m) return;\n    m.textContent = msg;\n    el.classList.add('is-show');\n    clearTimeout(__axToastTimer);\n    __axToastTimer = setTimeout(function(){ el.classList.remove('is-show'); }, 1800);\n  };\n  window.copyText = function(_btn, text) {\n    try { navigator.clipboard.writeText(text); } catch (e) {}\n    window.showToast('Copied to clipboard');\n  };`\n\n/** Client script that wires `.ax-row-card` expand/collapse on any button\n *  that calls `toggleCard(this)`. Include once per page. */\nexport const ROW_CARD_SCRIPT = `\n  window.toggleCard = function(btn) {\n    const card = btn.closest('.ax-row-card');\n    if (card) card.classList.toggle('is-open');\n  };`\n"],"mappings":"6DA6BO,IAAMA,EAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;yCCpBtB,IAAMC,EAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;A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","names":["AX_TOKENS_CSS","AX_COMPONENTS_CSS","renderShell","opts","css","AX_TOKENS_CSS","AX_COMPONENTS_CSS","TOPBAR_CSS","header","renderTopbar","main","escapeTitle","TOPBAR_HEAD","TOPBAR_SCRIPT","s","c","esc","s","c","btn","label","opts","classes","esc","field","opts","labelHtml","esc","controlHtml","common","options","o","row","children","stepCard","num","title","body","esc","pageHead","opts","esc","healthCard","healthStrip","cards","witBanner","sectionHead","secLabel","opts","esc","TOAST_HTML","TOAST_SCRIPT","ROW_CARD_SCRIPT"]}

package/dist/chunk-U2CKL755.js

@@ -0,0 +1,4 @@
+import{marked as l}from"marked";import{markedTerminal as y}from"marked-terminal";import s from"chalk";var g=-1;function k(e){e!==g&&(g=e,l.setOptions({gfm:!0,breaks:!1}),l.use(y({width:e,reflowText:!0,showSectionPrefix:!1,tab:2,heading:s.bold.cyan,firstHeading:s.bold.cyan,code:s.gray,codespan:s.yellow,blockquote:s.gray.italic,link:s.blue.underline,href:s.blue.underline})))}function w(e){let n=e;(n.match(/```/g)||[]).length%2===1&&(n+="\n```");let t=n.replace(/```[\s\S]*?```/g,"");return(t.match(/`/g)||[]).length%2===1&&(n+="`"),(t.match(/\*\*/g)||[]).length%2===1&&(n+="**"),n}function R(e,n=80,t){let o=Math.max(20,Math.min(n,120));try{k(o);let r=t?.balance?w(e):e;return l.parse(r,{async:!1}).replace(/\n+$/,"").replace(/^(\s*)\* /gm,"$1\u2022 ")}catch{return e.trimEnd()}}import{readdirSync as M}from"fs";import{resolve as C,dirname as S,basename as v,join as T}from"path";function $(e){let n=/(^|\s)@([\w./@-]*)$/.exec(e);return n?{token:n[2],start:n.index+n[1].length}:null}function P(e,n){let t=e.toLowerCase();return n.filter(o=>o.toLowerCase().includes(t)).map(o=>`@${o}`)}function L(e,n){try{let t=e.includes("/")?S(e):".",o=e.includes("/")?v(e):e,r=C(n,t);return M(r,{withFileTypes:!0}).filter(i=>!i.name.startsWith(".")&&i.name.toLowerCase().startsWith(o.toLowerCase())).map(i=>{let a=t==="."?i.name:T(t,i.name);return i.isDirectory()?`${a}/`:a})}catch{return[]}}function W(e,n,t,o=6){let r=$(e);if(!r)return null;let i=[...P(r.token,n),...L(r.token,t)].slice(0,o);return i.length?{mention:r,items:i}:null}function u(e,n,t){let o=e.slice(0,n.start),r=t.endsWith("/")?"":" ";return o+t+r}function z(e,n,t,o){if(n.current){let i=n.current;return i.idx=(i.idx+1)%i.items.length,u(e,{token:"",start:i.start},i.items[i.idx])}let r=W(e,t,o);return r?(n.current={start:r.mention.start,items:r.items,idx:0},u(e,r.mention,r.items[0])):null}function H(e,n,t){let o=(e??"").replace(/[\r\n]+$/,"");if(/[\r\n]/.test(o))return{kind:"paste",text:o.replace(/\r\n?/g,`
+`)};if(n||/[\r\n]$/.test(e??"")){let r=t+o;return r.endsWith("\\")?{kind:"continue",buffer:r.slice(0,-1)+`
+`}:{kind:"submit",text:r}}return e?{kind:"type",text:e}:{kind:"none"}}import{useEffect as I,useState as A}from"react";import{Text as c}from"ink";import{jsx as D,jsxs as d}from"react/jsx-runtime";var m=["\u2736","\u2738","\u2739","\u273A","\u2739","\u2737"],p=["Thinking","Pondering","Cerebrating","Noodling","Percolating","Ruminating","Conjuring","Synthesizing","Deliberating","Marinating"];function Q({startedAt:e,phase:n,hint:t,indent:o="  "}){let[r,i]=A(0);I(()=>{let b=setInterval(()=>i(x=>x+1),120);return()=>clearInterval(b)},[]);let a=m[r%m.length],f=Math.floor((Date.now()-e)/1e3),h=n==="responding"?"Responding":p[Math.floor(r/16)%p.length];return d(c,{children:[o,D(c,{color:"magenta",children:a})," ",d(c,{color:"magenta",bold:!0,children:[h,"\u2026"]})," ",d(c,{dimColor:!0,children:["(",f,"s",t?` \xB7 ${t}`:"",")"]})]})}function Y(e,n){let t=(n||"").toLowerCase();switch(e){case"claude-code":return{id:"claude",label:"claude",command:"claude",color:"yellow",glyph:"\u2726"};case"codex-cli":return{id:"codex",label:"codex",command:"codex",color:"green",glyph:"\u2733"};case"opencode":return{id:"opencode",label:"opencode",command:"opencode",color:"cyan",glyph:"\u25C6"};case"sdk":return{id:"anthropic",label:"anthropic",command:"@anthropic-ai/sdk",color:"yellow",glyph:"\u2726"};case"orchestrator":return t.includes("deepseek")?{id:"deepseek",label:"deepseek",command:"deepseek",color:"blue",glyph:"\u25C6"}:t.includes("gpt")||t.includes("o1")||t.includes("o3")||t.includes("openai")?{id:"openai",label:"openai",command:"openai",color:"cyan",glyph:"\u25C6"}:t.includes("gemini")?{id:"gemini",label:"gemini",command:"gemini",color:"magenta",glyph:"\u25C6"}:t.includes("claude")?{id:"claude",label:"claude",command:"anthropic",color:"yellow",glyph:"\u2726"}:{id:"orchestrator",label:"orchestrator",command:e,color:"gray",glyph:"\u25C6"};default:return{id:"unknown",label:e||"agent",command:e||"",color:"gray",glyph:"\u25C6"}}}function Z(e){return e?e.replace(/^(claude|gpt|gemini|deepseek|anthropic)-/i,""):""}export{R as a,W as b,z as c,H as d,Q as e,Y as f,Z as g};
+//# sourceMappingURL=chunk-U2CKL755.js.map

package/dist/chunk-U2CKL755.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tui/markdown.ts","../src/tui/mention-complete.ts","../src/tui/composer-input.ts","../src/tui/working-status.tsx","../src/tui/provider.ts"],"sourcesContent":["import { marked } from \"marked\"\nimport { markedTerminal } from \"marked-terminal\"\nimport chalk from \"chalk\"\n\n// Render an agent's markdown reply to ANSI for the terminal — bold/italic,\n// headings, lists, blockquotes, and syntax-highlighted fenced code blocks\n// (marked-terminal delegates code highlighting to cli-highlight). Kept as a\n// pure string→string function so it works in both the plain REPL and inside\n// an Ink <Text>. Falls back to the raw markdown on any parser error so a\n// malformed reply is never swallowed.\n\nlet configuredWidth = -1\n\n/** (Re)configure the marked instance for a given wrap width. marked is a\n *  singleton, so we only re-apply the extension when the width changes. */\nfunction ensureConfigured(width: number): void {\n  if (width === configuredWidth) return\n  configuredWidth = width\n  marked.setOptions({ gfm: true, breaks: false })\n  marked.use(\n    markedTerminal({\n      width,\n      reflowText: true,\n      // Don't prepend literal \"## \" to headings — render the text styled only.\n      showSectionPrefix: false,\n      // Shallower indent for lists/code so replies read as chat, not a man page.\n      tab: 2,\n      heading: chalk.bold.cyan,\n      firstHeading: chalk.bold.cyan,\n      code: chalk.gray,\n      codespan: chalk.yellow,\n      blockquote: chalk.gray.italic,\n      link: chalk.blue.underline,\n      href: chalk.blue.underline,\n    }) as any,\n  )\n}\n\n/**\n * Auto-close markdown markers left open by a mid-stream partial reply, so a\n * half-written `**bold` or ```` ```code ```` renders styled immediately\n * instead of flashing raw syntax while the closing marker is still arriving.\n * Conservative: only balances unterminated code fences, inline code, and\n * bold — the markers that actually cause visible flashes.\n */\nexport function balanceMarkdown(md: string): string {\n  let out = md\n  // Unterminated fenced code block → close it.\n  if (((out.match(/```/g) || []).length) % 2 === 1) out += \"\\n```\"\n  // After fences are balanced, count inline markers outside code blocks.\n  const bare = out.replace(/```[\\s\\S]*?```/g, \"\")\n  if (((bare.match(/`/g) || []).length) % 2 === 1) out += \"`\"\n  if (((bare.match(/\\*\\*/g) || []).length) % 2 === 1) out += \"**\"\n  return out\n}\n\n/** Render markdown → ANSI string, wrapped to `width` columns. When `balance`\n *  is set (live streaming), open markers are auto-closed first (see above). */\nexport function renderMarkdown(md: string, width = 80, opts?: { balance?: boolean }): string {\n  const w = Math.max(20, Math.min(width, 120))\n  try {\n    ensureConfigured(w)\n    const src = opts?.balance ? balanceMarkdown(md) : md\n    const out = marked.parse(src, { async: false }) as string\n    // marked-terminal hardcodes \"* \" list bullets — swap for a cleaner \"•\".\n    return out.replace(/\\n+$/, \"\").replace(/^(\\s*)\\* /gm, \"$1• \")\n  } catch {\n    return md.trimEnd()\n  }\n}\n","import { readdirSync } from \"fs\"\nimport { resolve, dirname, basename, join } from \"path\"\n\n// `@`-mention autocomplete for the chat composer: `@agent` completes to a\n// registered agent id, `@path/frag` completes to files/dirs under cwd. The\n// parse + agent match are pure (unit-tested); file match touches the fs.\n\nexport interface Mention {\n  /** The text after `@` being typed (may be empty). */\n  token: string\n  /** Index of the `@` in the input buffer. */\n  start: number\n}\n\n/** The trailing `@mention` being typed at the end of the buffer, or null.\n *  Only fires at a word boundary so mid-word emails/handles don't trigger. */\nexport function parseMention(input: string): Mention | null {\n  const m = /(^|\\s)@([\\w./@-]*)$/.exec(input)\n  if (!m) return null\n  return { token: m[2], start: m.index + m[1].length }\n}\n\n/** Agent ids containing `token`, as `@id`. */\nexport function matchAgents(token: string, agentIds: string[]): string[] {\n  const t = token.toLowerCase()\n  return agentIds.filter((id) => id.toLowerCase().includes(t)).map((id) => `@${id}`)\n}\n\n/** Files/dirs under cwd whose name starts with the token's basename.\n *  Directories get a trailing slash so completion can continue into them. */\nexport function matchFiles(token: string, cwd: string): string[] {\n  try {\n    const dir = token.includes(\"/\") ? dirname(token) : \".\"\n    const base = token.includes(\"/\") ? basename(token) : token\n    const abs = resolve(cwd, dir)\n    return readdirSync(abs, { withFileTypes: true })\n      .filter((e) => !e.name.startsWith(\".\") && e.name.toLowerCase().startsWith(base.toLowerCase()))\n      .map((e) => {\n        const rel = dir === \".\" ? e.name : join(dir, e.name)\n        return e.isDirectory() ? `${rel}/` : rel\n      })\n  } catch {\n    return []\n  }\n}\n\nexport interface MentionSuggestions {\n  mention: Mention\n  items: string[]\n}\n\n/** Combined agent + file suggestions for the trailing mention, capped. */\nexport function mentionSuggestions(input: string, agentIds: string[], cwd: string, limit = 6): MentionSuggestions | null {\n  const mention = parseMention(input)\n  if (!mention) return null\n  const items = [...matchAgents(mention.token, agentIds), ...matchFiles(mention.token, cwd)].slice(0, limit)\n  return items.length ? { mention, items } : null\n}\n\n/** Replace the mention token with a completion. Agents and files get a\n *  trailing space; a directory (ends with `/`) stays open to keep typing. */\nexport function applyMention(input: string, mention: Mention, item: string): string {\n  const head = input.slice(0, mention.start)\n  const trailing = item.endsWith(\"/\") ? \"\" : \" \"\n  return head + item + trailing\n}\n\n/** Frozen suggestion list for Tab-cycling: the `@` position + the items as\n *  captured on the first Tab, so subsequent Tabs cycle without the (now\n *  completed) buffer re-deriving a different list. */\nexport interface MentionCycle {\n  start: number\n  items: string[]\n  idx: number\n}\n\n/**\n * Tab handler: on the first Tab, freeze the current suggestions and apply the\n * top one; on subsequent Tabs, cycle to the next and re-apply at the frozen\n * `@` position. Returns the new buffer, or null when there's nothing to\n * complete. Callers reset `cycleRef.current` to null on any non-Tab edit.\n */\nexport function advanceMention(\n  input: string,\n  cycleRef: { current: MentionCycle | null },\n  agentIds: string[],\n  cwd: string,\n): string | null {\n  if (cycleRef.current) {\n    const c = cycleRef.current\n    c.idx = (c.idx + 1) % c.items.length\n    return applyMention(input, { token: \"\", start: c.start }, c.items[c.idx])\n  }\n  const s = mentionSuggestions(input, agentIds, cwd)\n  if (!s) return null\n  cycleRef.current = { start: s.mention.start, items: s.items, idx: 0 }\n  return applyMention(input, s.mention, s.items[0])\n}\n","// Classify a composer keystroke/paste chunk into an action. Ink calls the\n// input handler once per stdin data event with the whole chunk, so a\n// multi-line paste arrives intact (internal newlines, not a discrete Enter)\n// while a real Enter arrives as an empty chunk with key.return set. Kept pure\n// so both composers (standalone ChatApp + tui pane) share it and it's\n// unit-testable without a pty.\n\nexport type ComposerAction =\n  | { kind: \"paste\"; text: string }       // append (multi-line paste; newlines preserved)\n  | { kind: \"type\"; text: string }        // append typed characters\n  | { kind: \"continue\"; buffer: string }  // trailing \"\\\" → newline, don't submit\n  | { kind: \"submit\"; text: string }      // Enter (or single-line text+newline)\n  | { kind: \"none\" }\n\nexport function classifyComposerInput(chunk: string, isReturn: boolean, buffer: string): ComposerAction {\n  const body = (chunk ?? \"\").replace(/[\\r\\n]+$/, \"\")\n  // Internal newline in a single chunk ⇒ multi-line paste: keep it whole.\n  if (/[\\r\\n]/.test(body)) {\n    return { kind: \"paste\", text: body.replace(/\\r\\n?/g, \"\\n\") }\n  }\n  // A real Enter (empty chunk + key.return) or a single-line \"text\\n\" chunk.\n  if (isReturn || /[\\r\\n]$/.test(chunk ?? \"\")) {\n    const combined = buffer + body\n    if (combined.endsWith(\"\\\\\")) return { kind: \"continue\", buffer: combined.slice(0, -1) + \"\\n\" }\n    return { kind: \"submit\", text: combined }\n  }\n  if (chunk) return { kind: \"type\", text: chunk }\n  return { kind: \"none\" }\n}\n","import React, { useEffect, useState } from \"react\"\nimport { Text } from \"ink\"\n\n// Claude-Code-style animated working indicator: a pulsing glyph, a rotating\n// gerund while the model is thinking, a live elapsed counter, and (in the\n// standalone REPL) a real \"esc to interrupt\" hint. Self-contained: its own\n// interval drives the frame, so mounting it is all a caller needs.\n\nconst PULSE = [\"✶\", \"✸\", \"✹\", \"✺\", \"✹\", \"✷\"]\nconst GERUNDS = [\n  \"Thinking\", \"Pondering\", \"Cerebrating\", \"Noodling\", \"Percolating\",\n  \"Ruminating\", \"Conjuring\", \"Synthesizing\", \"Deliberating\", \"Marinating\",\n]\n\nexport function WorkingStatus({\n  startedAt,\n  phase,\n  hint,\n  indent = \"  \",\n}: {\n  startedAt: number\n  phase: \"thinking\" | \"responding\"\n  /** Trailing hint, e.g. \"esc to interrupt\". Omit in constrained panes. */\n  hint?: string\n  indent?: string\n}) {\n  const [frame, setFrame] = useState(0)\n  useEffect(() => {\n    const t = setInterval(() => setFrame((f) => f + 1), 120)\n    return () => clearInterval(t)\n  }, [])\n  const glyph = PULSE[frame % PULSE.length]\n  const secs = Math.floor((Date.now() - startedAt) / 1000)\n  const word = phase === \"responding\" ? \"Responding\" : GERUNDS[Math.floor(frame / 16) % GERUNDS.length]\n  return (\n    <Text>\n      {indent}<Text color=\"magenta\">{glyph}</Text> <Text color=\"magenta\" bold>{word}…</Text>{\" \"}\n      <Text dimColor>({secs}s{hint ? ` · ${hint}` : \"\"})</Text>\n    </Text>\n  )\n}\n","// Map an agent's tier (+ model) to the underlying provider/command that\n// actually runs it, so the UI reflects reality — agentx is provider-agnostic,\n// not Claude-only. The `tier` decides the spawn path; `model` disambiguates\n// the orchestrator tier's backend.\n\nexport interface ProviderInfo {\n  id: \"claude\" | \"codex\" | \"opencode\" | \"anthropic\" | \"deepseek\" | \"openai\" | \"gemini\" | \"orchestrator\" | \"unknown\"\n  /** Short label shown in the UI, e.g. \"claude\". */\n  label: string\n  /** The underlying command/SDK, e.g. \"claude\", \"codex\", \"@anthropic-ai/sdk\". */\n  command: string\n  /** Badge accent color (per provider — distinct from the agentx accent). */\n  color: string\n  /** A small mark for the badge. */\n  glyph: string\n}\n\nexport function resolveProvider(tier: string, model?: string): ProviderInfo {\n  const m = (model || \"\").toLowerCase()\n  switch (tier) {\n    case \"claude-code\":\n      return { id: \"claude\", label: \"claude\", command: \"claude\", color: \"yellow\", glyph: \"✦\" }\n    case \"codex-cli\":\n      return { id: \"codex\", label: \"codex\", command: \"codex\", color: \"green\", glyph: \"✳\" }\n    case \"opencode\":\n      return { id: \"opencode\", label: \"opencode\", command: \"opencode\", color: \"cyan\", glyph: \"◆\" }\n    case \"sdk\":\n      return { id: \"anthropic\", label: \"anthropic\", command: \"@anthropic-ai/sdk\", color: \"yellow\", glyph: \"✦\" }\n    case \"orchestrator\": {\n      if (m.includes(\"deepseek\")) return { id: \"deepseek\", label: \"deepseek\", command: \"deepseek\", color: \"blue\", glyph: \"◆\" }\n      if (m.includes(\"gpt\") || m.includes(\"o1\") || m.includes(\"o3\") || m.includes(\"openai\")) return { id: \"openai\", label: \"openai\", command: \"openai\", color: \"cyan\", glyph: \"◆\" }\n      if (m.includes(\"gemini\")) return { id: \"gemini\", label: \"gemini\", command: \"gemini\", color: \"magenta\", glyph: \"◆\" }\n      if (m.includes(\"claude\")) return { id: \"claude\", label: \"claude\", command: \"anthropic\", color: \"yellow\", glyph: \"✦\" }\n      return { id: \"orchestrator\", label: \"orchestrator\", command: tier, color: \"gray\", glyph: \"◆\" }\n    }\n    default:\n      return { id: \"unknown\", label: tier || \"agent\", command: tier || \"\", color: \"gray\", glyph: \"◆\" }\n  }\n}\n\n/** Strip a provider prefix from a model id for compact display\n *  (claude-opus-4-8 → opus-4-8, gpt-5-codex → 5-codex). */\nexport function shortModel(model?: string): string {\n  if (!model) return \"\"\n  return model.replace(/^(claude|gpt|gemini|deepseek|anthropic)-/i, \"\")\n}\n"],"mappings":"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","names":["marked","markedTerminal","chalk","configuredWidth","ensureConfigured","width","balanceMarkdown","md","out","bare","renderMarkdown","opts","w","src","readdirSync","resolve","dirname","basename","join","parseMention","input","m","matchAgents","token","agentIds","id","matchFiles","cwd","dir","base","abs","e","rel","mentionSuggestions","limit","mention","items","applyMention","item","head","trailing","advanceMention","cycleRef","c","s","classifyComposerInput","chunk","isReturn","buffer","body","combined","useEffect","useState","Text","jsx","jsxs","PULSE","GERUNDS","WorkingStatus","startedAt","phase","hint","indent","frame","setFrame","t","f","glyph","secs","word","resolveProvider","tier","model","m","shortModel"]}

package/dist/chunk-UCQ2N3KO.js

@@ -0,0 +1,9 @@
+import{a as o}from"./chunk-M4AMWP3H.js";import{existsSync as s}from"fs";import{resolve as a}from"path";function u(){return!!(process.env.VITEST||process.env.NODE_ENV==="test"||process.env.AGENTX_NO_TELEMETRY)}function c(){let n=process.cwd();for(let t=0;t<5;t++){if(s(a(n,".agentx"))||s(a(n,"agentx.json")))return n;let e=a(n,"..");if(e===n)break;n=e}return null}function d(n=new Date){return n.toISOString().slice(0,10)}function m(n,t,e=new Date){try{if(!t||u()||!c())return;let r=o({quiet:!0});if(!r)return;r.prepare(`INSERT INTO surface_usage (kind, name, day, count, last_at)
+       VALUES (?, ?, ?, 1, ?)
+       ON CONFLICT(kind, name, day)
+       DO UPDATE SET count = count + 1, last_at = excluded.last_at`).run(n,t,d(e),e.toISOString())}catch{}}function g(n={}){try{let t=o({quiet:!0});if(!t)return[];let e=new Date(Date.now()-(n.sinceDays??30)*864e5).toISOString().slice(0,10),r=["day >= ?"],i=[e];return n.kind&&(r.push("kind = ?"),i.push(n.kind)),t.prepare(`SELECT kind, name, SUM(count) AS count, COUNT(DISTINCT day) AS days, MAX(last_at) AS last_at
+         FROM surface_usage
+         WHERE ${r.join(" AND ")}
+         GROUP BY kind, name
+         ORDER BY count DESC`).all(...i)}catch{return[]}}function E(n){let t=[],e=n;for(;e&&typeof e.name=="function";){let r=e.name();e.parent&&t.unshift(r),e=e.parent}return t.join(" ")}var f=new Set(["guard check","completion","serve"]);function T(n){return!!n&&!f.has(n)}export{m as a,g as b,E as c,T as d};
+//# sourceMappingURL=chunk-UCQ2N3KO.js.map

package/dist/chunk-UCQ2N3KO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/observability/surface-usage.ts"],"sourcesContent":["import { existsSync } from \"fs\"\nimport { resolve } from \"path\"\nimport { openDb } from \"@/storage/sqlite\"\n\n// --- Which operator surfaces actually get used ---\n//\n// `task_history` answers \"which agents ran\". It says nothing about which of\n// the ~46 CLI commands or 16 dashboard pages anyone ever opens — and those are\n// the two biggest surfaces by count, so they are exactly what the\n// surface-reduction work needs evidence for.\n//\n// See docs/architecture/surface-reduction.md for the bar a surface has to\n// clear to survive. This module is the missing measurement.\n//\n// Three rules, all of them about being unobtrusive:\n//\n//   1. Names only. `agentx guard log --limit 5` records \"guard log\". A page\n//      view records \"/live\". Never arguments, never query strings, never\n//      payloads. This counts which door was opened, not what went through it.\n//   2. Never create state. If there is no `.agentx` here, we are being run\n//      from someone's home directory or a random repo — recording would\n//      litter a stray database. Do nothing instead.\n//   3. Never throw, never block. A telemetry bug must not break the CLI or a\n//      dashboard request. Every failure is swallowed.\n\n/**\n * True while a test runner is driving us.\n *\n * Three suites (trace-cli, process-cli, intent-ledger-cli) shell out to the\n * real CLI, so a full `pnpm test` recorded dozens of invocations of exactly\n * the commands that happen to have CLI tests — `trace list` showed 72 uses\n * against a human total of zero. That is worse than no data: it inverts the\n * ranking, making well-tested commands look popular and untested ones look\n * dead, which is precisely backwards for deciding what to remove.\n */\nfunction underTest(): boolean {\n  return Boolean(process.env.VITEST || process.env.NODE_ENV === \"test\" || process.env.AGENTX_NO_TELEMETRY)\n}\n\n/** Where the install lives, or null when we're not inside one. Never creates\n *  anything — the check IS the guard against writing stray databases. */\nfunction installRoot(): string | null {\n  let dir = process.cwd()\n  for (let i = 0; i < 5; i++) {\n    if (existsSync(resolve(dir, \".agentx\")) || existsSync(resolve(dir, \"agentx.json\"))) return dir\n    const parent = resolve(dir, \"..\")\n    if (parent === dir) break\n    dir = parent\n  }\n  return null\n}\n\nfunction today(now = new Date()): string {\n  return now.toISOString().slice(0, 10)\n}\n\nexport type SurfaceKind = \"cli\" | \"page\"\n\n/**\n * Record one use of a surface. Silent no-op when we're outside an install,\n * when SQLite is unavailable, or on any error.\n */\nexport function recordSurfaceUse(kind: SurfaceKind, name: string, now = new Date()): void {\n  try {\n    if (!name) return\n    if (underTest()) return\n    if (!installRoot()) return\n    const db = openDb({ quiet: true })\n    if (!db) return\n    db.prepare(\n      `INSERT INTO surface_usage (kind, name, day, count, last_at)\n       VALUES (?, ?, ?, 1, ?)\n       ON CONFLICT(kind, name, day)\n       DO UPDATE SET count = count + 1, last_at = excluded.last_at`,\n    ).run(kind, name, today(now), now.toISOString())\n  } catch {\n    /* telemetry must never break the thing it measures */\n  }\n}\n\nexport interface SurfaceRow {\n  kind: string\n  name: string\n  count: number\n  days: number\n  last_at: string | null\n}\n\n/** Usage totals over a window, busiest first. Powers `agentx usage surfaces`. */\nexport function listSurfaceUse(opts: { kind?: SurfaceKind; sinceDays?: number } = {}): SurfaceRow[] {\n  try {\n    const db = openDb({ quiet: true })\n    if (!db) return []\n    const since = new Date(Date.now() - (opts.sinceDays ?? 30) * 86_400_000)\n      .toISOString()\n      .slice(0, 10)\n    const where = [\"day >= ?\"]\n    const params: unknown[] = [since]\n    if (opts.kind) {\n      where.push(\"kind = ?\")\n      params.push(opts.kind)\n    }\n    return db\n      .prepare(\n        `SELECT kind, name, SUM(count) AS count, COUNT(DISTINCT day) AS days, MAX(last_at) AS last_at\n         FROM surface_usage\n         WHERE ${where.join(\" AND \")}\n         GROUP BY kind, name\n         ORDER BY count DESC`,\n      )\n      .all(...params) as SurfaceRow[]\n  } catch {\n    return []\n  }\n}\n\n/**\n * The command path a commander invocation resolved to — \"guard log\", not\n * \"guard log --limit 5\". Walks up from the deepest matched subcommand so\n * nesting is preserved without ever touching argv.\n */\nexport function commandPath(cmd: { name(): string; parent?: unknown } | null | undefined): string {\n  const parts: string[] = []\n  let node: any = cmd\n  while (node && typeof node.name === \"function\") {\n    const n = node.name()\n    // The root program is \"agentx\" itself — not a surface worth counting.\n    if (node.parent) parts.unshift(n)\n    node = node.parent\n  }\n  return parts.join(\" \")\n}\n\n/** Hook entrypoints fire per tool call, not per human decision. Counting them\n *  would swamp the table and tell us nothing about operator behaviour. */\nconst NOT_A_SURFACE = new Set([\"guard check\", \"completion\", \"serve\"])\n\nexport function shouldRecordCommand(path: string): boolean {\n  return Boolean(path) && !NOT_A_SURFACE.has(path)\n}\n"],"mappings":"wCAAA,OAAS,cAAAA,MAAkB,KAC3B,OAAS,WAAAC,MAAe,OAkCxB,SAASC,GAAqB,CAC5B,MAAO,GAAQ,QAAQ,IAAI,QAAU,QAAQ,IAAI,WAAa,QAAU,QAAQ,IAAI,oBACtF,CAIA,SAASC,GAA6B,CACpC,IAAIC,EAAM,QAAQ,IAAI,EACtB,QAASC,EAAI,EAAGA,EAAI,EAAGA,IAAK,CAC1B,GAAIC,EAAWC,EAAQH,EAAK,SAAS,CAAC,GAAKE,EAAWC,EAAQH,EAAK,aAAa,CAAC,EAAG,OAAOA,EAC3F,IAAMI,EAASD,EAAQH,EAAK,IAAI,EAChC,GAAII,IAAWJ,EAAK,MACpBA,EAAMI,EAER,OAAO,IACT,CAEA,SAASC,EAAMC,EAAM,IAAI,KAAgB,CACvC,OAAOA,EAAI,YAAY,EAAE,MAAM,EAAG,EAAE,CACtC,CAQO,SAASC,EAAiBC,EAAmBC,EAAcH,EAAM,IAAI,KAAc,CACxF,GAAI,CAGF,GAFI,CAACG,GACDX,EAAU,GACV,CAACC,EAAY,EAAG,OACpB,IAAMW,EAAKC,EAAO,CAAE,MAAO,EAAK,CAAC,EACjC,GAAI,CAACD,EAAI,OACTA,EAAG,QACD;AAAA;AAAA;AAAA,mEAIF,EAAE,IAAIF,EAAMC,EAAMJ,EAAMC,CAAG,EAAGA,EAAI,YAAY,CAAC,CACjD,MAAE,CAEF,CACF,CAWO,SAASM,EAAeC,EAAmD,CAAC,EAAiB,CAClG,GAAI,CACF,IAAMH,EAAKC,EAAO,CAAE,MAAO,EAAK,CAAC,EACjC,GAAI,CAACD,EAAI,MAAO,CAAC,EACjB,IAAMI,EAAQ,IAAI,KAAK,KAAK,IAAI,GAAKD,EAAK,WAAa,IAAM,KAAU,EACpE,YAAY,EACZ,MAAM,EAAG,EAAE,EACRE,EAAQ,CAAC,UAAU,EACnBC,EAAoB,CAACF,CAAK,EAChC,OAAID,EAAK,OACPE,EAAM,KAAK,UAAU,EACrBC,EAAO,KAAKH,EAAK,IAAI,GAEhBH,EACJ,QACC;AAAA;AAAA,iBAESK,EAAM,KAAK,OAAO;AAAA;AAAA,6BAG7B,EACC,IAAI,GAAGC,CAAM,CAClB,MAAE,CACA,MAAO,CAAC,CACV,CACF,CAOO,SAASC,EAAYC,EAAsE,CAChG,IAAMC,EAAkB,CAAC,EACrBC,EAAYF,EAChB,KAAOE,GAAQ,OAAOA,EAAK,MAAS,YAAY,CAC9C,IAAMC,EAAID,EAAK,KAAK,EAEhBA,EAAK,QAAQD,EAAM,QAAQE,CAAC,EAChCD,EAAOA,EAAK,OAEd,OAAOD,EAAM,KAAK,GAAG,CACvB,CAIA,IAAMG,EAAgB,IAAI,IAAI,CAAC,cAAe,aAAc,OAAO,CAAC,EAE7D,SAASC,EAAoBC,EAAuB,CACzD,MAAO,EAAQA,GAAS,CAACF,EAAc,IAAIE,CAAI,CACjD","names":["existsSync","resolve","underTest","installRoot","dir","i","existsSync","resolve","parent","today","now","recordSurfaceUse","kind","name","db","openDb","listSurfaceUse","opts","since","where","params","commandPath","cmd","parts","node","n","NOT_A_SURFACE","shouldRecordCommand","path"]}