@quanta-intellect/vessel-browser 0.1.18 → 0.1.20

package/out/renderer/assets/{index-DAaJOss-.js → index-CKOT_IZt.js}

@@ -13,6 +13,7 @@ const UNOWNED = {
   context: null,
   owner: null
 };
+const NO_INIT = {};
 var Owner = null;
 let Transition = null;
 let ExternalSourceConfig = null;
@@ -52,6 +53,10 @@ function createSignal(value, options) {
   };
   return [readSignal.bind(s), setter];
 }
+function createComputed(fn, value, options) {
+  const c = createComputation(fn, value, true, STALE);
+  updateComputation(c);
+}
 function createRenderEffect(fn, value, options) {
   const c = createComputation(fn, value, false, STALE);
   updateComputation(c);
@@ -71,6 +76,123 @@ function createMemo(fn, value, options) {
   updateComputation(c);
   return readSignal.bind(c);
 }
+function isPromise(v) {
+  return v && typeof v === "object" && "then" in v;
+}
+function createResource(pSource, pFetcher, pOptions) {
+  let source;
+  let fetcher;
+  let options;
+  if (typeof pFetcher === "function") {
+    source = pSource;
+    fetcher = pFetcher;
+    options = {};
+  } else {
+    source = true;
+    fetcher = pSource;
+    options = pFetcher || {};
+  }
+  let pr = null, initP = NO_INIT, scheduled = false, resolved = "initialValue" in options, dynamic = typeof source === "function" && createMemo(source);
+  const contexts = /* @__PURE__ */ new Set(), [value, setValue] = (options.storage || createSignal)(options.initialValue), [error, setError] = createSignal(void 0), [track, trigger] = createSignal(void 0, {
+    equals: false
+  }), [state, setState] = createSignal(resolved ? "ready" : "unresolved");
+  function loadEnd(p, v, error2, key) {
+    if (pr === p) {
+      pr = null;
+      key !== void 0 && (resolved = true);
+      if ((p === initP || v === initP) && options.onHydrated) queueMicrotask(() => options.onHydrated(key, {
+        value: v
+      }));
+      initP = NO_INIT;
+      completeLoad(v, error2);
+    }
+    return v;
+  }
+  function completeLoad(v, err) {
+    runUpdates(() => {
+      if (err === void 0) setValue(() => v);
+      setState(err !== void 0 ? "errored" : resolved ? "ready" : "unresolved");
+      setError(err);
+      for (const c of contexts.keys()) c.decrement();
+      contexts.clear();
+    }, false);
+  }
+  function read() {
+    const c = SuspenseContext, v = value(), err = error();
+    if (err !== void 0 && !pr) throw err;
+    if (Listener && !Listener.user && c) ;
+    return v;
+  }
+  function load(refetching = true) {
+    if (refetching !== false && scheduled) return;
+    scheduled = false;
+    const lookup = dynamic ? dynamic() : source;
+    if (lookup == null || lookup === false) {
+      loadEnd(pr, untrack(value));
+      return;
+    }
+    let error2;
+    const p = initP !== NO_INIT ? initP : untrack(() => {
+      try {
+        return fetcher(lookup, {
+          value: value(),
+          refetching
+        });
+      } catch (fetcherError) {
+        error2 = fetcherError;
+      }
+    });
+    if (error2 !== void 0) {
+      loadEnd(pr, void 0, castError(error2), lookup);
+      return;
+    } else if (!isPromise(p)) {
+      loadEnd(pr, p, void 0, lookup);
+      return p;
+    }
+    pr = p;
+    if ("v" in p) {
+      if (p.s === 1) loadEnd(pr, p.v, void 0, lookup);
+      else loadEnd(pr, void 0, castError(p.v), lookup);
+      return p;
+    }
+    scheduled = true;
+    queueMicrotask(() => scheduled = false);
+    runUpdates(() => {
+      setState(resolved ? "refreshing" : "pending");
+      trigger();
+    }, false);
+    return p.then((v) => loadEnd(p, v, void 0, lookup), (e) => loadEnd(p, void 0, castError(e), lookup));
+  }
+  Object.defineProperties(read, {
+    state: {
+      get: () => state()
+    },
+    error: {
+      get: () => error()
+    },
+    loading: {
+      get() {
+        const s = state();
+        return s === "pending" || s === "refreshing";
+      }
+    },
+    latest: {
+      get() {
+        if (!resolved) return read();
+        const err = error();
+        if (err && !pr) throw err;
+        return value();
+      }
+    }
+  });
+  let owner = Owner;
+  if (dynamic) createComputed(() => (owner = Owner, load(false)));
+  else load(false);
+  return [read, {
+    refetch: (info) => runWithOwner(owner, () => load(info)),
+    mutate: setValue
+  }];
+}
 function untrack(fn) {
   if (Listener === null) return fn();
   const listener = Listener;
@@ -91,6 +213,22 @@ function onCleanup(fn) {
   else Owner.cleanups.push(fn);
   return fn;
 }
+function runWithOwner(o, fn) {
+  const prev = Owner;
+  const prevListener = Listener;
+  Owner = o;
+  Listener = null;
+  try {
+    return runUpdates(fn, true);
+  } catch (err) {
+    handleError(err);
+  } finally {
+    Owner = prev;
+    Listener = prevListener;
+  }
+}
+const [transPending, setTransPending] = /* @__PURE__ */ createSignal(false);
+let SuspenseContext;
 function readSignal() {
   if (this.sources && this.state) {
     if (this.state === STALE) updateComputation(this);
@@ -703,13 +841,54 @@ function cleanChildren(parent, current, marker, replacement) {
   } else parent.insertBefore(node, marker);
   return [node];
 }
-var _tmpl$$b = /* @__PURE__ */ template(`<div class=title-bar><div class=title-bar-drag></div><div class=window-controls><button class=window-btn data-tooltip=Minimize><svg width=10 height=10 viewBox="0 0 10 10"><rect x=1 y=5 width=8 height=1 fill=currentColor></rect></svg></button><button class=window-btn data-tooltip=Maximize><svg width=10 height=10 viewBox="0 0 10 10"><rect x=1 y=1 width=8 height=8 fill=none stroke=currentColor stroke-width=1></rect></svg></button><button class="window-btn window-btn-close"data-tooltip=Close><svg width=10 height=10 viewBox="0 0 10 10"><line x1=1 y1=1 x2=9 y2=9 stroke=currentColor stroke-width=1.2></line><line x1=9 y1=1 x2=1 y2=9 stroke=currentColor stroke-width=1.2>`);
+var _tmpl$$c = /* @__PURE__ */ template(`<div class=title-bar><div class=title-bar-drag></div><div class=mcp-status-area><button class=mcp-status-indicator><span class=mcp-dot></span><span class=mcp-label>MCP</span></button></div><div class=window-controls><button class=window-btn data-tooltip=Minimize><svg width=10 height=10 viewBox="0 0 10 10"><rect x=1 y=5 width=8 height=1 fill=currentColor></rect></svg></button><button class=window-btn data-tooltip=Maximize><svg width=10 height=10 viewBox="0 0 10 10"><rect x=1 y=1 width=8 height=8 fill=none stroke=currentColor stroke-width=1></rect></svg></button><button class="window-btn window-btn-close"data-tooltip=Close><svg width=10 height=10 viewBox="0 0 10 10"><line x1=1 y1=1 x2=9 y2=9 stroke=currentColor stroke-width=1.2></line><line x1=9 y1=1 x2=1 y2=9 stroke=currentColor stroke-width=1.2>`);
 const TitleBar = () => {
+  const [mcpStatus, setMcpStatus] = createSignal("starting");
+  const [mcpTooltip, setMcpTooltip] = createSignal("MCP: starting...");
+  const pollHealth = async () => {
+    try {
+      const health = await window.vessel.settings.getHealth();
+      setMcpStatus(health.mcp.status);
+      if (health.mcp.status === "ready") {
+        setMcpTooltip(`MCP ready — ${health.mcp.endpoint}`);
+      } else if (health.mcp.status === "error") {
+        setMcpTooltip(`MCP error: ${health.mcp.message}`);
+      } else {
+        setMcpTooltip(`MCP: ${health.mcp.status}`);
+      }
+    } catch {
+      setMcpStatus("error");
+      setMcpTooltip("MCP: status unavailable");
+    }
+  };
+  let healthInterval;
+  onMount(() => {
+    void pollHealth();
+    healthInterval = setInterval(() => void pollHealth(), 1e4);
+  });
+  onCleanup(() => clearInterval(healthInterval));
+  const handleMcpClick = () => {
+    window.vessel.ui.setSettingsVisibility(true);
+  };
   return (() => {
-    var _el$ = _tmpl$$b(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling;
-    _el$4.$$click = () => window.vessel.window.minimize();
-    _el$5.$$click = () => window.vessel.window.maximize();
-    _el$6.$$click = () => window.vessel.window.close();
+    var _el$ = _tmpl$$c(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild, _el$5 = _el$3.nextSibling, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$7.nextSibling;
+    _el$4.$$click = handleMcpClick;
+    _el$6.$$click = () => window.vessel.window.minimize();
+    _el$7.$$click = () => window.vessel.window.maximize();
+    _el$8.$$click = () => window.vessel.window.close();
+    createRenderEffect((_p$) => {
+      var _v$ = !!(mcpStatus() === "ready"), _v$2 = !!(mcpStatus() === "error"), _v$3 = !!(mcpStatus() === "starting" || mcpStatus() === "stopped"), _v$4 = mcpTooltip();
+      _v$ !== _p$.e && _el$4.classList.toggle("mcp-ready", _p$.e = _v$);
+      _v$2 !== _p$.t && _el$4.classList.toggle("mcp-error", _p$.t = _v$2);
+      _v$3 !== _p$.a && _el$4.classList.toggle("mcp-starting", _p$.a = _v$3);
+      _v$4 !== _p$.o && setAttribute(_el$4, "title", _p$.o = _v$4);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0
+    });
     return _el$;
   })();
 };
@@ -905,7 +1084,7 @@ function getAgentPresence(state, currentTime = Date.now()) {
   }
   return "idle";
 }
-var _tmpl$$a = /* @__PURE__ */ template(`<img class=tab-favicon alt>`), _tmpl$2$9 = /* @__PURE__ */ template(`<span class=tab-favicon-fallback>`), _tmpl$3$6 = /* @__PURE__ */ template(`<div class=tab-bar><div class=tab-list><button class=tab-new data-tooltip="New Tab">+`), _tmpl$4$5 = /* @__PURE__ */ template(`<div role=tab><span class=tab-title></span><button class=tab-close>×`), _tmpl$5$3 = /* @__PURE__ */ template(`<span class=tab-agent-indicator aria-hidden=true title="Agent active on this tab">`), _tmpl$6$3 = /* @__PURE__ */ template(`<span class=tab-loading>`);
+var _tmpl$$b = /* @__PURE__ */ template(`<img class=tab-favicon alt>`), _tmpl$2$a = /* @__PURE__ */ template(`<span class=tab-favicon-fallback>`), _tmpl$3$7 = /* @__PURE__ */ template(`<div class=tab-bar><div class=tab-list><button class=tab-new data-tooltip="New Tab">+`), _tmpl$4$7 = /* @__PURE__ */ template(`<div role=tab><span class=tab-title></span><button class=tab-close>×`), _tmpl$5$5 = /* @__PURE__ */ template(`<span class=tab-agent-indicator aria-hidden=true title="Agent active on this tab">`), _tmpl$6$5 = /* @__PURE__ */ template(`<span class=tab-loading>`);
 function stringToHue(str) {
   let hash = 0;
   for (let i = 0; i < str.length; i++) {
@@ -931,14 +1110,14 @@ const TabFavicon = (props) => {
     },
     get fallback() {
       return (() => {
-        var _el$2 = _tmpl$2$9();
+        var _el$2 = _tmpl$2$a();
         insert(_el$2, letter);
         createRenderEffect((_$p) => setStyleProperty(_el$2, "--favicon-hue", `${hue()}`));
         return _el$2;
       })();
     },
     get children() {
-      var _el$ = _tmpl$$a();
+      var _el$ = _tmpl$$b();
       _el$.addEventListener("error", () => setFailed(true));
       createRenderEffect(() => setAttribute(_el$, "src", props.favicon));
       return _el$;
@@ -961,13 +1140,13 @@ const TabBar = () => {
   onCleanup(() => clearInterval(ticker));
   const modelActiveTabIds = createMemo(() => getAgentActiveTabIds(runtimeState2(), now()));
   return (() => {
-    var _el$3 = _tmpl$3$6(), _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild;
+    var _el$3 = _tmpl$3$7(), _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild;
     insert(_el$4, createComponent(For, {
       get each() {
         return tabs2();
       },
       children: (tab) => (() => {
-        var _el$6 = _tmpl$4$5(), _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling;
+        var _el$6 = _tmpl$4$7(), _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling;
         _el$6.addEventListener("auxclick", (e) => {
           if (e.button === 1) closeTab(tab.id);
         });
@@ -985,12 +1164,12 @@ const TabBar = () => {
         }), _el$7);
         insert(_el$6, (() => {
           var _c$ = memo(() => !!modelActiveTabIds().has(tab.id));
-          return () => _c$() && _tmpl$5$3();
+          return () => _c$() && _tmpl$5$5();
         })(), _el$7);
         insert(_el$7, () => tab.title || "New Tab");
         insert(_el$6, (() => {
           var _c$2 = memo(() => !!tab.isLoading);
-          return () => _c$2() && _tmpl$6$3();
+          return () => _c$2() && _tmpl$6$5();
         })(), _el$8);
         _el$8.$$click = (e) => {
           e.stopPropagation();
@@ -1094,7 +1273,7 @@ function useUI() {
     }
   };
 }
-var _tmpl$$9 = /* @__PURE__ */ template(`<span class=nav-btn-badge>`), _tmpl$2$8 = /* @__PURE__ */ template(`<div class=address-bar><div class=nav-controls><button class=nav-btn data-tooltip=Back><svg width=14 height=14 viewBox="0 0 14 14"><path d="M9 2L4 7l5 5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=nav-btn data-tooltip=Forward><svg width=14 height=14 viewBox="0 0 14 14"><path d="M5 2l5 5-5 5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=nav-btn data-tooltip=Reload><svg width=14 height=14 viewBox="0 0 14 14"><path d="M2.5 7a4.5 4.5 0 1 1 1 3"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round></path><path d="M2 4v3.5h3.5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button></div><div class=url-shell><form class=url-form><input class=url-input type=text placeholder="Search or enter URL"></form><div><span class=agent-status-dot aria-hidden=true></span><span class=agent-status-text></span></div></div><div class=toolbar-actions><button class=nav-btn data-tooltip="Reader Mode"><svg width=14 height=14 viewBox="0 0 14 14"><rect x=2 y=1 width=10 height=12 rx=1 fill=none stroke=currentColor stroke-width=1.2></rect><line x1=4 y1=4 x2=10 y2=4 stroke=currentColor stroke-width=1></line><line x1=4 y1=6.5 x2=10 y2=6.5 stroke=currentColor stroke-width=1></line><line x1=4 y1=9 x2=8 y2=9 stroke=currentColor stroke-width=1></line></svg></button><button class=nav-btn data-tooltip="Dev Tools"><svg width=14 height=14 viewBox="0 0 14 14"><polyline points="3,5 1,7 3,9"fill=none stroke=currentColor stroke-width=1.2 stroke-linecap=round stroke-linejoin=round></polyline><polyline points="11,5 13,7 11,9"fill=none stroke=currentColor stroke-width=1.2 stroke-linecap=round stroke-linejoin=round></polyline><line x1=8.5 y1=2 x2=5.5 y2=12 stroke=currentColor stroke-width=1.2 stroke-linecap=round></line></svg></button><button class="nav-btn nav-btn-sidebar"><svg width=14 height=14 viewBox="0 0 14 14"><rect x=1 y=1 width=12 height=12 rx=1.5 fill=none stroke=currentColor stroke-width=1.2></rect><line x1=9 y1=1 x2=9 y2=13 stroke=currentColor stroke-width=1.2></line></svg></button><button class=nav-btn data-tooltip=Settings><svg width=14 height=14 viewBox="0 0 14 14"><circle cx=7 cy=7 r=2 fill=none stroke=currentColor stroke-width=1.2></circle><path d="M7 1v2M7 11v2M1 7h2M11 7h2M2.8 2.8l1.4 1.4M9.8 9.8l1.4 1.4M11.2 2.8l-1.4 1.4M4.2 9.8l-1.4 1.4"stroke=currentColor stroke-width=1 stroke-linecap=round>`);
+var _tmpl$$a = /* @__PURE__ */ template(`<span class=nav-btn-badge>`), _tmpl$2$9 = /* @__PURE__ */ template(`<div class=address-bar><div class=nav-controls><button class=nav-btn data-tooltip=Back><svg width=14 height=14 viewBox="0 0 14 14"><path d="M9 2L4 7l5 5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=nav-btn data-tooltip=Forward><svg width=14 height=14 viewBox="0 0 14 14"><path d="M5 2l5 5-5 5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=nav-btn data-tooltip=Reload><svg width=14 height=14 viewBox="0 0 14 14"><path d="M2.5 7a4.5 4.5 0 1 1 1 3"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round></path><path d="M2 4v3.5h3.5"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button></div><div class=url-shell><form class=url-form><input class=url-input type=text placeholder="Search or enter URL"></form><div><span class=agent-status-dot aria-hidden=true></span><span class=agent-status-text></span></div></div><div class=toolbar-actions><button class=nav-btn data-tooltip="Reader Mode"><svg width=14 height=14 viewBox="0 0 14 14"><rect x=2 y=1 width=10 height=12 rx=1 fill=none stroke=currentColor stroke-width=1.2></rect><line x1=4 y1=4 x2=10 y2=4 stroke=currentColor stroke-width=1></line><line x1=4 y1=6.5 x2=10 y2=6.5 stroke=currentColor stroke-width=1></line><line x1=4 y1=9 x2=8 y2=9 stroke=currentColor stroke-width=1></line></svg></button><button class=nav-btn data-tooltip="Dev Tools"><svg width=14 height=14 viewBox="0 0 14 14"><polyline points="3,5 1,7 3,9"fill=none stroke=currentColor stroke-width=1.2 stroke-linecap=round stroke-linejoin=round></polyline><polyline points="11,5 13,7 11,9"fill=none stroke=currentColor stroke-width=1.2 stroke-linecap=round stroke-linejoin=round></polyline><line x1=8.5 y1=2 x2=5.5 y2=12 stroke=currentColor stroke-width=1.2 stroke-linecap=round></line></svg></button><button class="nav-btn nav-btn-sidebar"><svg width=14 height=14 viewBox="0 0 14 14"><rect x=1 y=1 width=12 height=12 rx=1.5 fill=none stroke=currentColor stroke-width=1.2></rect><line x1=9 y1=1 x2=9 y2=13 stroke=currentColor stroke-width=1.2></line></svg></button><button class=nav-btn data-tooltip=Settings><svg width=14 height=14 viewBox="0 0 14 14"><circle cx=7 cy=7 r=2 fill=none stroke=currentColor stroke-width=1.2></circle><path d="M7 1v2M7 11v2M1 7h2M11 7h2M2.8 2.8l1.4 1.4M9.8 9.8l1.4 1.4M11.2 2.8l-1.4 1.4M4.2 9.8l-1.4 1.4"stroke=currentColor stroke-width=1 stroke-linecap=round>`);
 const AddressBar = () => {
   const {
     activeTab,
@@ -1135,7 +1314,7 @@ const AddressBar = () => {
     }
   };
   return (() => {
-    var _el$ = _tmpl$2$8(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$2.nextSibling, _el$7 = _el$6.firstChild, _el$8 = _el$7.firstChild, _el$9 = _el$7.nextSibling, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$10 = _el$6.nextSibling, _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling, _el$13 = _el$12.nextSibling;
+    var _el$ = _tmpl$2$9(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$2.nextSibling, _el$7 = _el$6.firstChild, _el$8 = _el$7.firstChild, _el$9 = _el$7.nextSibling, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling, _el$10 = _el$6.nextSibling, _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling, _el$13 = _el$12.nextSibling;
     _el$13.firstChild;
     var _el$16 = _el$13.nextSibling;
     addEventListener(_el$3, "click", goBack);
@@ -1156,7 +1335,7 @@ const AddressBar = () => {
         return pendingApprovalCount() > 0;
       },
       get children() {
-        var _el$15 = _tmpl$$9();
+        var _el$15 = _tmpl$$a();
         insert(_el$15, pendingApprovalCount);
         createRenderEffect(() => setAttribute(_el$15, "aria-label", `${pendingApprovalCount()} pending`));
         return _el$15;
@@ -1189,7 +1368,7 @@ const AddressBar = () => {
   })();
 };
 delegateEvents(["click", "input"]);
-var _tmpl$$8 = /* @__PURE__ */ template(`<div class=bookmark-toast-stack aria-live=polite aria-atomic=true>`), _tmpl$2$7 = /* @__PURE__ */ template(`<div class=bookmark-toast role=status><div class=bookmark-toast-title></div><div class=bookmark-toast-message>`);
+var _tmpl$$9 = /* @__PURE__ */ template(`<div class=bookmark-toast-stack aria-live=polite aria-atomic=true>`), _tmpl$2$8 = /* @__PURE__ */ template(`<div class=bookmark-toast role=status><div class=bookmark-toast-title></div><div class=bookmark-toast-message>`);
 const TOAST_DURATION_MS$1 = 4200;
 const TOAST_EXIT_MS$1 = 300;
 function isBookmarkToastCandidate(action) {
@@ -1249,13 +1428,13 @@ const BookmarkNotifications = () => {
     timeoutIds.clear();
   });
   return (() => {
-    var _el$ = _tmpl$$8();
+    var _el$ = _tmpl$$9();
     insert(_el$, createComponent(For, {
       get each() {
         return toasts();
       },
       children: (toast) => (() => {
-        var _el$2 = _tmpl$2$7(), _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
+        var _el$2 = _tmpl$2$8(), _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
         insert(_el$3, () => toast.title);
         insert(_el$4, () => toast.message);
         createRenderEffect(() => _el$2.classList.toggle("bookmark-toast-leaving", !!toast.leaving));
@@ -1265,7 +1444,7 @@ const BookmarkNotifications = () => {
     return _el$;
   })();
 };
-var _tmpl$$7 = /* @__PURE__ */ template(`<div class=bookmark-toast-stack aria-live=polite><div class="bookmark-toast highlight-toast"role=status><div class=bookmark-toast-title></div><div class=bookmark-toast-message>`);
+var _tmpl$$8 = /* @__PURE__ */ template(`<div class=bookmark-toast-stack aria-live=polite><div class="bookmark-toast highlight-toast"role=status><div class=bookmark-toast-title></div><div class=bookmark-toast-message>`);
 const TOAST_DURATION_MS = 3e3;
 const TOAST_EXIT_MS = 300;
 const HighlightNotifications = (props) => {
@@ -1304,7 +1483,7 @@ const HighlightNotifications = (props) => {
       return memo(() => !!visible())() && current();
     },
     get children() {
-      var _el$ = _tmpl$$7(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
+      var _el$ = _tmpl$$8(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
       insert(_el$3, () => current().title);
       insert(_el$4, () => current().message);
       createRenderEffect(() => _el$2.classList.toggle("bookmark-toast-leaving", !!leaving()));
@@ -1330,7 +1509,7 @@ function useScrollFade(el) {
     observer.disconnect();
   });
 }
-var _tmpl$$6 = /* @__PURE__ */ template(`<span class=agent-transcript-live><span class=agent-transcript-live-dot aria-hidden=true></span>Live`), _tmpl$2$6 = /* @__PURE__ */ template(`<div class=agent-transcript-list>`), _tmpl$3$5 = /* @__PURE__ */ template(`<aside class=agent-transcript-dock><div class=agent-transcript-header><div class=agent-transcript-title-row><span class=agent-transcript-title>Agent Transcript</span></div><div class=agent-transcript-actions><button class=agent-transcript-icon></button><button class=agent-transcript-icon data-tooltip=Hide>×`), _tmpl$4$4 = /* @__PURE__ */ template(`<article><div class=agent-transcript-meta><span class=agent-transcript-badge></span><span class=agent-transcript-time></span></div><div class=agent-transcript-text>`);
+var _tmpl$$7 = /* @__PURE__ */ template(`<span class=agent-transcript-live><span class=agent-transcript-live-dot aria-hidden=true></span>Live`), _tmpl$2$7 = /* @__PURE__ */ template(`<div class=agent-transcript-list>`), _tmpl$3$6 = /* @__PURE__ */ template(`<aside class=agent-transcript-dock><div class=agent-transcript-header><div class=agent-transcript-title-row><span class=agent-transcript-title>Agent Transcript</span></div><div class=agent-transcript-actions><button class=agent-transcript-icon></button><button class=agent-transcript-icon data-tooltip=Hide>×`), _tmpl$4$6 = /* @__PURE__ */ template(`<article><div class=agent-transcript-meta><span class=agent-transcript-badge></span><span class=agent-transcript-time></span></div><div class=agent-transcript-text>`);
 const AgentTranscriptDock = () => {
   const {
     runtimeState: runtimeState2
@@ -1365,7 +1544,7 @@ const AgentTranscriptDock = () => {
       return memo(() => mode() === "full")() && visibleEntries().length > 0;
     },
     get children() {
-      var _el$ = _tmpl$3$5(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild;
+      var _el$ = _tmpl$3$6(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild;
       _el$3.firstChild;
       var _el$6 = _el$3.nextSibling, _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling;
       insert(_el$3, createComponent(Show, {
@@ -1373,7 +1552,7 @@ const AgentTranscriptDock = () => {
           return hasStreamingEntry();
         },
         get children() {
-          return _tmpl$$6();
+          return _tmpl$$7();
         }
       }), null);
       _el$7.$$click = () => setCollapsed((value) => !value);
@@ -1384,14 +1563,14 @@ const AgentTranscriptDock = () => {
           return !collapsed();
         },
         get children() {
-          var _el$9 = _tmpl$2$6();
+          var _el$9 = _tmpl$2$7();
           use((el) => useScrollFade(el), _el$9);
           insert(_el$9, createComponent(For, {
             get each() {
               return visibleEntries();
             },
             children: (entry) => (() => {
-              var _el$0 = _tmpl$4$4(), _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$10.nextSibling, _el$12 = _el$1.nextSibling;
+              var _el$0 = _tmpl$4$6(), _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$10.nextSibling, _el$12 = _el$1.nextSibling;
               insert(_el$10, () => entry.title || entry.kind);
               insert(_el$11, () => formatTime2(entry.updatedAt));
               insert(_el$12, () => entry.text);
@@ -1486,12 +1665,13 @@ function useAI() {
     clearHistory: () => setMessages([])
   };
 }
-var _tmpl$$5 = /* @__PURE__ */ template(`<div class=command-bar-recent><span class=command-bar-recent-label>Recent</span><div class=command-bar-recent-list>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div class=command-bar-overlay><div class=command-bar><form><div class=command-bar-icon><svg width=16 height=16 viewBox="0 0 16 16"><circle cx=8 cy=8 r=6 fill=none stroke=var(--accent-primary) stroke-width=1.5></circle><circle cx=6 cy=7 r=0.8 fill=var(--accent-primary)></circle><circle cx=10 cy=7 r=0.8 fill=var(--accent-primary)></circle><path d="M6 10c0.5 0.8 3.5 0.8 4 0"fill=none stroke=var(--accent-primary) stroke-width=0.8 stroke-linecap=round></path></svg></div><input class=command-bar-input type=text placeholder="Ask about this page, summarize, or search..."></form><div class=command-bar-hints><span><kbd>Enter</kbd> to ask</span><span><kbd>Esc</kbd> to close</span><span>Try "summarize" or ask a question`), _tmpl$3$4 = /* @__PURE__ */ template(`<button class=command-bar-recent-item type=button>`);
+var _tmpl$$6 = /* @__PURE__ */ template(`<div class=command-bar-no-provider><p>Configure a chat provider to start using the AI assistant.</p><button class=command-bar-no-provider-btn>Open Settings <kbd>Ctrl+,`), _tmpl$2$6 = /* @__PURE__ */ template(`<div class=command-bar-recent><span class=command-bar-recent-label>Recent</span><div class=command-bar-recent-list>`), _tmpl$3$5 = /* @__PURE__ */ template(`<span>Try "summarize" or ask a question`), _tmpl$4$5 = /* @__PURE__ */ template(`<div class=command-bar-overlay><div class=command-bar><form><div class=command-bar-icon><svg width=16 height=16 viewBox="0 0 16 16"><circle cx=8 cy=8 r=6 fill=none stroke=var(--accent-primary) stroke-width=1.5></circle><circle cx=6 cy=7 r=0.8 fill=var(--accent-primary)></circle><circle cx=10 cy=7 r=0.8 fill=var(--accent-primary)></circle><path d="M6 10c0.5 0.8 3.5 0.8 4 0"fill=none stroke=var(--accent-primary) stroke-width=0.8 stroke-linecap=round></path></svg></div><input class=command-bar-input type=text></form><div class=command-bar-hints><span><kbd>Enter</kbd> to ask</span><span><kbd>Esc</kbd> to close`), _tmpl$5$4 = /* @__PURE__ */ template(`<button class=command-bar-recent-item type=button>`), _tmpl$6$4 = /* @__PURE__ */ template(`<span>Set up a provider in Settings first`);
 const CommandBar = () => {
   const {
     commandBarOpen: commandBarOpen2,
     closeCommandBar,
-    toggleSidebar
+    toggleSidebar,
+    openSettings
   } = useUI();
   const {
     query,
@@ -1500,6 +1680,8 @@ const CommandBar = () => {
     cancel
   } = useAI();
   const [input, setInput] = createSignal("");
+  const [settings] = createResource(() => commandBarOpen2(), async (open) => open ? window.vessel.settings.get() : null);
+  const hasProvider = () => settings()?.chatProvider !== null && settings()?.chatProvider !== void 0;
   const handleSubmit = async (e) => {
     e.preventDefault();
     const val = input().trim();
@@ -1531,7 +1713,8 @@ const CommandBar = () => {
       return commandBarOpen2();
     },
     get children() {
-      var _el$ = _tmpl$2$5(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$9 = _el$3.nextSibling;
+      var _el$ = _tmpl$4$5(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$10 = _el$3.nextSibling, _el$11 = _el$10.firstChild;
+      _el$11.nextSibling;
       addEventListener(_el$, "click", closeCommandBar);
       _el$2.$$click = (e) => e.stopPropagation();
       _el$3.addEventListener("submit", handleSubmit);
@@ -1541,24 +1724,57 @@ const CommandBar = () => {
       setAttribute(_el$5, "spellcheck", false);
       insert(_el$2, createComponent(Show, {
         get when() {
-          return memo(() => recentQueries2().length > 0)() && !input().trim();
+          return !hasProvider();
+        },
+        get children() {
+          var _el$6 = _tmpl$$6(), _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling;
+          _el$8.$$click = () => {
+            closeCommandBar();
+            openSettings();
+          };
+          return _el$6;
+        }
+      }), _el$10);
+      insert(_el$2, createComponent(Show, {
+        get when() {
+          return memo(() => !!(hasProvider() && recentQueries2().length > 0))() && !input().trim();
         },
         get children() {
-          var _el$6 = _tmpl$$5(), _el$7 = _el$6.firstChild, _el$8 = _el$7.nextSibling;
-          insert(_el$8, createComponent(For, {
+          var _el$9 = _tmpl$2$6(), _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling;
+          insert(_el$1, createComponent(For, {
             get each() {
               return recentQueries2();
             },
             children: (q) => (() => {
-              var _el$0 = _tmpl$3$4();
-              _el$0.$$click = () => void handleRecentClick(q);
-              insert(_el$0, q);
-              return _el$0;
+              var _el$14 = _tmpl$5$4();
+              _el$14.$$click = () => void handleRecentClick(q);
+              insert(_el$14, q);
+              return _el$14;
             })()
           }));
-          return _el$6;
+          return _el$9;
+        }
+      }), _el$10);
+      insert(_el$10, createComponent(Show, {
+        get when() {
+          return hasProvider();
+        },
+        get fallback() {
+          return _tmpl$6$4();
+        },
+        get children() {
+          return _tmpl$3$5();
         }
-      }), _el$9);
+      }), null);
+      createRenderEffect((_p$) => {
+        var _v$ = hasProvider() ? "Ask about this page, summarize, or search..." : "No chat provider configured", _v$2 = !hasProvider();
+        _v$ !== _p$.e && setAttribute(_el$5, "placeholder", _p$.e = _v$);
+        _v$2 !== _p$.t && (_el$5.disabled = _p$.t = _v$2);
+        return _p$;
+      }, {
+        e: void 0,
+        t: void 0
+      });
       createRenderEffect(() => _el$5.value = input());
       return _el$;
     }
@@ -3070,7 +3286,7 @@ function getBookmarkSearchMatch(args) {
   }
   return { matchedFields, score };
 }
-var _tmpl$$4 = /* @__PURE__ */ template(`<div class=dropdown-select-menu role=listbox>`), _tmpl$2$4 = /* @__PURE__ */ template(`<div><button class=dropdown-select-trigger type=button aria-haspopup=listbox><span class=dropdown-select-value></span><span class=dropdown-select-caret aria-hidden=true>▾`), _tmpl$3$3 = /* @__PURE__ */ template(`<span class=dropdown-select-option-description>`), _tmpl$4$3 = /* @__PURE__ */ template(`<button class=dropdown-select-option type=button role=option><span class=dropdown-select-option-copy><span class=dropdown-select-option-label>`);
+var _tmpl$$5 = /* @__PURE__ */ template(`<div class=dropdown-select-menu role=listbox>`), _tmpl$2$5 = /* @__PURE__ */ template(`<div><button class=dropdown-select-trigger type=button aria-haspopup=listbox><span class=dropdown-select-value></span><span class=dropdown-select-caret aria-hidden=true>▾`), _tmpl$3$4 = /* @__PURE__ */ template(`<span class=dropdown-select-option-description>`), _tmpl$4$4 = /* @__PURE__ */ template(`<button class=dropdown-select-option type=button role=option><span class=dropdown-select-option-copy><span class=dropdown-select-option-label>`);
 const DropdownSelect = (props) => {
   const [open, setOpen] = createSignal(false);
   let rootRef;
@@ -3094,7 +3310,7 @@ const DropdownSelect = (props) => {
     });
   });
   return (() => {
-    var _el$ = _tmpl$2$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
+    var _el$ = _tmpl$2$5(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
     var _ref$ = rootRef;
     typeof _ref$ === "function" ? use(_ref$, _el$) : rootRef = _el$;
     _el$2.$$click = () => setOpen((current) => !current);
@@ -3104,13 +3320,13 @@ const DropdownSelect = (props) => {
         return open();
       },
       get children() {
-        var _el$5 = _tmpl$$4();
+        var _el$5 = _tmpl$$5();
         insert(_el$5, createComponent(For, {
           get each() {
             return props.options;
           },
           children: (option) => (() => {
-            var _el$6 = _tmpl$4$3(), _el$7 = _el$6.firstChild, _el$8 = _el$7.firstChild;
+            var _el$6 = _tmpl$4$4(), _el$7 = _el$6.firstChild, _el$8 = _el$7.firstChild;
             _el$6.$$click = () => {
               props.onChange(option.value);
               setOpen(false);
@@ -3121,7 +3337,7 @@ const DropdownSelect = (props) => {
                 return option.description;
               },
               get children() {
-                var _el$9 = _tmpl$3$3();
+                var _el$9 = _tmpl$3$4();
                 insert(_el$9, () => option.description);
                 return _el$9;
               }
@@ -3159,7 +3375,7 @@ const DropdownSelect = (props) => {
 };
 delegateEvents(["click"]);
 const vesselLogo = "" + new URL("vessel-logo-transparent-IT25qr-Z.png", import.meta.url).href;
-var _tmpl$$3 = /* @__PURE__ */ template(`<div class="message-content markdown-content">`), _tmpl$2$3 = /* @__PURE__ */ template(`<span class=sidebar-tab-badge>`), _tmpl$3$2 = /* @__PURE__ */ template(`<div class=agent-section-title>Pending approvals`), _tmpl$4$2 = /* @__PURE__ */ template(`<button class=agent-section-toggle type=button>`), _tmpl$5$2 = /* @__PURE__ */ template(`<section class=agent-panel><div class=agent-panel-header><div><div class=agent-panel-title>Supervisor</div><div class=agent-panel-subtitle></div></div><span class=agent-status-pill></span></div><div class=agent-panel-controls><button class=agent-control-button type=button></button><button class=agent-control-button type=button>Restore session</button></div><div class=agent-muted></div><div class=agent-section-header><div class=agent-section-title>Recent actions`), _tmpl$6$2 = /* @__PURE__ */ template(`<span class=bookmark-status-pill>Saved`), _tmpl$7$2 = /* @__PURE__ */ template(`<div class=bookmark-save-card><div class=bookmark-current-title></div><div class=bookmark-current-url></div><div class=bookmark-save-controls><button class=bookmark-primary-button type=button>Save page</button></div><textarea class=bookmark-note-input placeholder="Optional note about why this matters"rows=2>`), _tmpl$8$2 = /* @__PURE__ */ template(`<section class=bookmark-panel><div class=bookmark-panel-header><div><div class=bookmark-panel-title>Bookmarks</div><div class=bookmark-panel-subtitle></div></div></div><input class="bookmark-input bookmark-search-input"placeholder="Search titles, URLs, notes, and folders"><div class=bookmark-save-shell><button class=bookmark-save-toggle type=button><span class=bookmark-save-toggle-copy><span class=bookmark-save-toggle-title>Save Current Page</span><span class=bookmark-save-toggle-subtitle>Manual bookmark save options</span></span><span class=bookmark-save-toggle-caret aria-hidden=true>▾</span></button></div><form class=bookmark-folder-create><div class=bookmark-folder-form-fields><input class=bookmark-input placeholder="Create a folder"><input class=bookmark-input placeholder="Optional one-line summary"></div><button class=bookmark-secondary-button type=submit>New folder</button></form><div class=bookmark-folder-list>`), _tmpl$9$2 = /* @__PURE__ */ template(`<div class=checkpoint-timeline>`), _tmpl$0$2 = /* @__PURE__ */ template(`<section class="agent-panel checkpoint-panel"><div class=agent-panel-header><div><div class=agent-panel-title>Checkpoints</div><div class=agent-panel-subtitle></div></div></div><div class=agent-panel-body><div class=agent-checkpoint-row><input class=agent-input placeholder="Checkpoint name"><button class=agent-primary-button type=button>Save checkpoint</button></div><div class=agent-section-title>Recent checkpoints`), _tmpl$1$2 = /* @__PURE__ */ template(`<span>`), _tmpl$10$2 = /* @__PURE__ */ template(`<div><div class=streaming-status><span class=streaming-pulse aria-hidden=true></span><span>Generating`), _tmpl$11$2 = /* @__PURE__ */ template(`<div class="message message-assistant"><div class=message-content>`), _tmpl$12$2 = /* @__PURE__ */ template(`<div class=sidebar-empty><svg class=sidebar-empty-icon width=48 height=48 viewBox="0 0 48 48"aria-hidden=true><line x1=8 y1=8 x2=24 y2=5 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=24 y1=5 x2=40 y2=10 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=8 y1=8 x2=6 y2=24 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=40 y1=10 x2=44 y2=26 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=6 y1=24 x2=10 y2=38 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=44 y1=26 x2=38 y2=40 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=10 y1=38 x2=24 y2=44 stroke=var(--border-visible) stroke-width=1 opacity=0.35></line><line x1=38 y1=40 x2=24 y2=44 stroke=var(--border-visible) stroke-width=1 opacity=0.35></line><line x1=8 y1=8 x2=20 y2=18 stroke=var(--border-visible) stroke-width=1 opacity=0.5></line><line x1=24 y1=5 x2=20 y2=18 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=40 y1=10 x2=32 y2=20 stroke=var(--border-visible) stroke-width=1 opacity=0.5></line><line x1=20 y1=18 x2=32 y2=20 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.3></line><line x1=6 y1=24 x2=18 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=20 y1=18 x2=18 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=32 y1=20 x2=36 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=44 y1=26 x2=36 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=18 y1=30 x2=36 y2=30 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.25></line><line x1=18 y1=30 x2=10 y2=38 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=36 y1=30 x2=38 y2=40 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=18 y1=30 x2=24 y2=44 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.2></line><line x1=36 y1=30 x2=24 y2=44 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.2></line><circle cx=8 cy=8 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.55></circle><circle cx=24 cy=5 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.45></circle><circle cx=40 cy=10 r=3 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.7></circle><circle cx=6 cy=24 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=44 cy=26 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.55></circle><circle cx=10 cy=38 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=38 cy=40 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.45></circle><circle cx=24 cy=44 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=20 cy=18 r=3.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.85></circle><circle cx=32 cy=20 r=4 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.9></circle><circle cx=18 cy=30 r=3 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.75></circle><circle cx=36 cy=30 r=3.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.8></circle></svg><p class=sidebar-empty-title>Your move.</p><p class=sidebar-empty-hint>Configure a provider in Settings (Ctrl+,) then ask anything about the current page or beyond.`), _tmpl$13$1 = /* @__PURE__ */ template(`<button class=chat-action-btn title="Stop generating"><svg width=14 height=14 viewBox="0 0 14 14"fill=none aria-hidden=true><rect x=2 y=2 width=10 height=10 rx=1.5 fill=currentColor></rect></svg>Stop`), _tmpl$14$1 = /* @__PURE__ */ template(`<button class=chat-action-btn title="Retry last prompt"><svg width=14 height=14 viewBox="0 0 14 14"fill=none aria-hidden=true><path d="M11.5 7a4.5 4.5 0 1 1-1.3-3.2"stroke=currentColor stroke-width=1.5 stroke-linecap=round></path><path d="M10.5 1v3h-3"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg>Retry`), _tmpl$15$1 = /* @__PURE__ */ template(`<div class=chat-actions>`), _tmpl$16$1 = /* @__PURE__ */ template(`<div class=highlight-nav><button class=highlight-nav-btn type=button title="Previous highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><path d="M8 10L4 6l4-4"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=highlight-nav-label type=button title="Go to current highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><circle cx=6 cy=6 r=3 fill="rgba(196, 160, 90, 0.6)"stroke="rgba(196, 160, 90, 0.9)"stroke-width=1></circle></svg></button><button class=highlight-nav-btn type=button title="Next highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><path d="M4 2l4 4-4 4"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round>`), _tmpl$17$1 = /* @__PURE__ */ template(`<div class=sidebar-input-area><textarea class=sidebar-input rows=2 placeholder="Ask anything..."></textarea><button class=sidebar-send>Send`), _tmpl$18$1 = /* @__PURE__ */ template(`<div class=sidebar><div class=sidebar-resize-handle></div><div class=sidebar-header><div class=sidebar-brand><img class=sidebar-logo alt=Vessel><span class=sidebar-brand-text>Vessel Browser</span></div><div class=sidebar-header-actions><button class=sidebar-clear title="Clear chat">Clear</button><button class=sidebar-close title="Close AI chat (Esc)"aria-label="Close AI chat"><svg width=14 height=14 viewBox="0 0 14 14"aria-hidden=true><path d="M3.5 3.5l7 7M10.5 3.5l-7 7"fill=none stroke=currentColor stroke-width=1.4 stroke-linecap=round></path></svg></button></div></div><div class=sidebar-tabs role=tablist><button class=sidebar-tab role=tab>Supervisor</button><button class=sidebar-tab role=tab>Bookmarks</button><button class=sidebar-tab role=tab>Checkpoints</button><button class=sidebar-tab role=tab>Chat</button></div><div class=sidebar-messages><div>`), _tmpl$19$1 = /* @__PURE__ */ template(`<div class=agent-muted>No pending approvals.`), _tmpl$20 = /* @__PURE__ */ template(`<div class="agent-card agent-card-approval"><div class=agent-card-approval-stripe aria-hidden=true></div><div class=agent-card-title></div><div class=agent-card-copy></div><div class=agent-card-copy></div><div class=agent-card-actions><button class=agent-primary-button type=button>Approve</button><button class=agent-control-button type=button>Reject`), _tmpl$21 = /* @__PURE__ */ template(`<div class=agent-muted>No actions yet.`), _tmpl$22 = /* @__PURE__ */ template(`<div class=agent-muted>Recent actions are collapsed to reduce noise.`), _tmpl$23 = /* @__PURE__ */ template(`<div class="agent-card-copy success">`), _tmpl$24 = /* @__PURE__ */ template(`<div class="agent-card-copy error">`), _tmpl$25 = /* @__PURE__ */ template(`<div class=agent-card><div class=agent-action-row><span class=agent-card-title></span><span></span></div><div class=agent-card-copy>`), _tmpl$26 = /* @__PURE__ */ template(`<div class=bookmark-empty-folder>`), _tmpl$27 = /* @__PURE__ */ template(`<div class=bookmark-folder-summary>`), _tmpl$28 = /* @__PURE__ */ template(`<div class=bookmark-folder-actions><button class=bookmark-ghost-button type=button>Rename</button><button class="bookmark-ghost-button danger"type=button>Delete`), _tmpl$29 = /* @__PURE__ */ template(`<div class=bookmark-folder-edit><div class=bookmark-folder-form-fields><input class=bookmark-input><input class=bookmark-input placeholder="Optional one-line summary"></div><button class=bookmark-secondary-button type=button>Save</button><button class=bookmark-ghost-button type=button>Cancel`), _tmpl$30 = /* @__PURE__ */ template(`<div class=bookmark-items>`), _tmpl$31 = /* @__PURE__ */ template(`<div class=bookmark-folder-section><div class="bookmark-folder-header clickable"role=button tabindex=0><div class=bookmark-folder-overview><span class=bookmark-folder-chevron aria-hidden=true>▸</span><div><div class=bookmark-folder-name></div><div class=bookmark-folder-meta> saved`), _tmpl$32 = /* @__PURE__ */ template(`<div class=bookmark-folder-collapsed-hint>Click to view saved links.`), _tmpl$33 = /* @__PURE__ */ template(`<div class=bookmark-empty-folder>No bookmarks in this folder yet.`), _tmpl$34 = /* @__PURE__ */ template(`<div class=bookmark-item-note>`), _tmpl$35 = /* @__PURE__ */ template(`<div class=bookmark-item><button class=bookmark-item-link type=button><span class=bookmark-item-title></span><span class=bookmark-item-url></span></button><div class=bookmark-item-footer><span class=bookmark-item-time></span><button class="bookmark-ghost-button danger"type=button>Remove`), _tmpl$36 = /* @__PURE__ */ template(`<div class=agent-muted>No checkpoints yet.`), _tmpl$37 = /* @__PURE__ */ template(`<span class=checkpoint-timeline-line>`), _tmpl$38 = /* @__PURE__ */ template(`<div class=checkpoint-timeline-item><div class=checkpoint-timeline-rail><span class=checkpoint-timeline-dot></span></div><div class=checkpoint-timeline-content><div class=checkpoint-timeline-name></div><div class=checkpoint-timeline-time></div><button class=agent-control-button type=button>Restore`), _tmpl$39 = /* @__PURE__ */ template(`<div>`), _tmpl$40 = /* @__PURE__ */ template(`<div class=thinking-state><div class=thinking-orb aria-hidden=true><span></span><span></span><span></span></div><div class=thinking-copy><div class=thinking-title>Thinking`), _tmpl$41 = /* @__PURE__ */ template(`<div class=chat-approval-detail>`), _tmpl$42 = /* @__PURE__ */ template(`<div class=chat-approval><div class=chat-approval-icon aria-hidden=true><svg width=16 height=16 viewBox="0 0 16 16"fill=none><path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM7.25 4.75a.75.75 0 011.5 0v3.5a.75.75 0 01-1.5 0v-3.5zM8 11.5a.75.75 0 110-1.5.75.75 0 010 1.5z"fill=currentColor></path></svg></div><div class=chat-approval-body><div class=chat-approval-title>Approval needed: <strong></strong></div><div class=chat-approval-detail></div><div class=chat-approval-actions><button class="chat-approval-btn chat-approval-approve"type=button>Approve</button><button class="chat-approval-btn chat-approval-reject"type=button>Reject`);
+var _tmpl$$4 = /* @__PURE__ */ template(`<div class="message-content markdown-content">`), _tmpl$2$4 = /* @__PURE__ */ template(`<span class=sidebar-tab-badge>`), _tmpl$3$3 = /* @__PURE__ */ template(`<div class=agent-section-title>Pending approvals`), _tmpl$4$3 = /* @__PURE__ */ template(`<button class=agent-section-toggle type=button>`), _tmpl$5$3 = /* @__PURE__ */ template(`<section class=agent-panel><div class=agent-panel-header><div><div class=agent-panel-title>Supervisor</div><div class=agent-panel-subtitle></div></div><span class=agent-status-pill></span></div><div class=agent-panel-controls><button class=agent-control-button type=button></button><button class=agent-control-button type=button>Restore session</button></div><div class=agent-muted></div><div class=agent-section-header><div class=agent-section-title>Recent actions`), _tmpl$6$3 = /* @__PURE__ */ template(`<span class=bookmark-status-pill>Saved`), _tmpl$7$2 = /* @__PURE__ */ template(`<div class=bookmark-save-card><div class=bookmark-current-title></div><div class=bookmark-current-url></div><div class=bookmark-save-controls><button class=bookmark-primary-button type=button>Save page</button></div><textarea class=bookmark-note-input placeholder="Optional note about why this matters"rows=2>`), _tmpl$8$2 = /* @__PURE__ */ template(`<section class=bookmark-panel><div class=bookmark-panel-header><div><div class=bookmark-panel-title>Bookmarks</div><div class=bookmark-panel-subtitle></div></div></div><input class="bookmark-input bookmark-search-input"placeholder="Search titles, URLs, notes, and folders"><div class=bookmark-save-shell><button class=bookmark-save-toggle type=button><span class=bookmark-save-toggle-copy><span class=bookmark-save-toggle-title>Save Current Page</span><span class=bookmark-save-toggle-subtitle>Manual bookmark save options</span></span><span class=bookmark-save-toggle-caret aria-hidden=true>▾</span></button></div><form class=bookmark-folder-create><div class=bookmark-folder-form-fields><input class=bookmark-input placeholder="Create a folder"><input class=bookmark-input placeholder="Optional one-line summary"></div><button class=bookmark-secondary-button type=submit>New folder</button></form><div class=bookmark-folder-list>`), _tmpl$9$2 = /* @__PURE__ */ template(`<div class=checkpoint-timeline>`), _tmpl$0$2 = /* @__PURE__ */ template(`<section class="agent-panel checkpoint-panel"><div class=agent-panel-header><div><div class=agent-panel-title>Checkpoints</div><div class=agent-panel-subtitle></div></div></div><div class=agent-panel-body><div class=agent-checkpoint-row><input class=agent-input placeholder="Checkpoint name"><button class=agent-primary-button type=button>Save checkpoint</button></div><div class=agent-section-title>Recent checkpoints`), _tmpl$1$2 = /* @__PURE__ */ template(`<span>`), _tmpl$10$2 = /* @__PURE__ */ template(`<div><div class=streaming-status><span class=streaming-pulse aria-hidden=true></span><span>Generating`), _tmpl$11$2 = /* @__PURE__ */ template(`<div class="message message-assistant"><div class=message-content>`), _tmpl$12$2 = /* @__PURE__ */ template(`<div class=sidebar-empty><svg class=sidebar-empty-icon width=48 height=48 viewBox="0 0 48 48"aria-hidden=true><line x1=8 y1=8 x2=24 y2=5 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=24 y1=5 x2=40 y2=10 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=8 y1=8 x2=6 y2=24 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=40 y1=10 x2=44 y2=26 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=6 y1=24 x2=10 y2=38 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=44 y1=26 x2=38 y2=40 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=10 y1=38 x2=24 y2=44 stroke=var(--border-visible) stroke-width=1 opacity=0.35></line><line x1=38 y1=40 x2=24 y2=44 stroke=var(--border-visible) stroke-width=1 opacity=0.35></line><line x1=8 y1=8 x2=20 y2=18 stroke=var(--border-visible) stroke-width=1 opacity=0.5></line><line x1=24 y1=5 x2=20 y2=18 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=40 y1=10 x2=32 y2=20 stroke=var(--border-visible) stroke-width=1 opacity=0.5></line><line x1=20 y1=18 x2=32 y2=20 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.3></line><line x1=6 y1=24 x2=18 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=20 y1=18 x2=18 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=32 y1=20 x2=36 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=44 y1=26 x2=36 y2=30 stroke=var(--border-visible) stroke-width=1 opacity=0.45></line><line x1=18 y1=30 x2=36 y2=30 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.25></line><line x1=18 y1=30 x2=10 y2=38 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=36 y1=30 x2=38 y2=40 stroke=var(--border-visible) stroke-width=1 opacity=0.4></line><line x1=18 y1=30 x2=24 y2=44 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.2></line><line x1=36 y1=30 x2=24 y2=44 stroke=var(--accent-primary) stroke-width=0.75 opacity=0.2></line><circle cx=8 cy=8 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.55></circle><circle cx=24 cy=5 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.45></circle><circle cx=40 cy=10 r=3 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.7></circle><circle cx=6 cy=24 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=44 cy=26 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.55></circle><circle cx=10 cy=38 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=38 cy=40 r=2 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.45></circle><circle cx=24 cy=44 r=2.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.5></circle><circle cx=20 cy=18 r=3.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.85></circle><circle cx=32 cy=20 r=4 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.9></circle><circle cx=18 cy=30 r=3 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.75></circle><circle cx=36 cy=30 r=3.5 fill=var(--bg-secondary) stroke=var(--accent-primary) stroke-width=1.5 opacity=0.8></circle></svg><p class=sidebar-empty-title>Your move.</p><p class=sidebar-empty-hint>Configure a provider in Settings (Ctrl+,) then ask anything about the current page or beyond.`), _tmpl$13$1 = /* @__PURE__ */ template(`<button class=chat-action-btn title="Stop generating"><svg width=14 height=14 viewBox="0 0 14 14"fill=none aria-hidden=true><rect x=2 y=2 width=10 height=10 rx=1.5 fill=currentColor></rect></svg>Stop`), _tmpl$14$1 = /* @__PURE__ */ template(`<button class=chat-action-btn title="Retry last prompt"><svg width=14 height=14 viewBox="0 0 14 14"fill=none aria-hidden=true><path d="M11.5 7a4.5 4.5 0 1 1-1.3-3.2"stroke=currentColor stroke-width=1.5 stroke-linecap=round></path><path d="M10.5 1v3h-3"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg>Retry`), _tmpl$15$1 = /* @__PURE__ */ template(`<div class=chat-actions>`), _tmpl$16$1 = /* @__PURE__ */ template(`<div class=highlight-nav><button class=highlight-nav-btn type=button title="Previous highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><path d="M8 10L4 6l4-4"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round></path></svg></button><button class=highlight-nav-label type=button title="Go to current highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><circle cx=6 cy=6 r=3 fill="rgba(196, 160, 90, 0.6)"stroke="rgba(196, 160, 90, 0.9)"stroke-width=1></circle></svg></button><button class=highlight-nav-btn type=button title="Next highlight"><svg width=12 height=12 viewBox="0 0 12 12"fill=none aria-hidden=true><path d="M4 2l4 4-4 4"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round>`), _tmpl$17$1 = /* @__PURE__ */ template(`<div class=sidebar-input-area><textarea class=sidebar-input rows=2 placeholder="Ask anything..."></textarea><button class=sidebar-send>Send`), _tmpl$18$1 = /* @__PURE__ */ template(`<div class=sidebar><div class=sidebar-resize-handle></div><div class=sidebar-header><div class=sidebar-brand><img class=sidebar-logo alt=Vessel><span class=sidebar-brand-text>Vessel Browser</span></div><div class=sidebar-header-actions><button class=sidebar-clear title="Clear chat">Clear</button><button class=sidebar-close title="Close AI chat (Esc)"aria-label="Close AI chat"><svg width=14 height=14 viewBox="0 0 14 14"aria-hidden=true><path d="M3.5 3.5l7 7M10.5 3.5l-7 7"fill=none stroke=currentColor stroke-width=1.4 stroke-linecap=round></path></svg></button></div></div><div class=sidebar-tabs role=tablist><button class=sidebar-tab role=tab>Supervisor</button><button class=sidebar-tab role=tab>Bookmarks</button><button class=sidebar-tab role=tab>Checkpoints</button><button class=sidebar-tab role=tab>Chat</button></div><div class=sidebar-messages><div>`), _tmpl$19$1 = /* @__PURE__ */ template(`<div class=agent-muted>No pending approvals.`), _tmpl$20$1 = /* @__PURE__ */ template(`<div class="agent-card agent-card-approval"><div class=agent-card-approval-stripe aria-hidden=true></div><div class=agent-card-title></div><div class=agent-card-copy></div><div class=agent-card-copy></div><div class=agent-card-actions><button class=agent-primary-button type=button>Approve</button><button class=agent-control-button type=button>Reject`), _tmpl$21$1 = /* @__PURE__ */ template(`<div class=agent-muted>No actions yet.`), _tmpl$22$1 = /* @__PURE__ */ template(`<div class=agent-muted>Recent actions are collapsed to reduce noise.`), _tmpl$23$1 = /* @__PURE__ */ template(`<div class="agent-card-copy success">`), _tmpl$24$1 = /* @__PURE__ */ template(`<div class="agent-card-copy error">`), _tmpl$25$1 = /* @__PURE__ */ template(`<div class=agent-card><div class=agent-action-row><span class=agent-card-title></span><span></span></div><div class=agent-card-copy>`), _tmpl$26$1 = /* @__PURE__ */ template(`<div class=bookmark-empty-folder>`), _tmpl$27$1 = /* @__PURE__ */ template(`<div class=bookmark-folder-summary>`), _tmpl$28 = /* @__PURE__ */ template(`<div class=bookmark-folder-actions><button class=bookmark-ghost-button type=button>Rename</button><button class="bookmark-ghost-button danger"type=button>Delete`), _tmpl$29 = /* @__PURE__ */ template(`<div class=bookmark-folder-edit><div class=bookmark-folder-form-fields><input class=bookmark-input><input class=bookmark-input placeholder="Optional one-line summary"></div><button class=bookmark-secondary-button type=button>Save</button><button class=bookmark-ghost-button type=button>Cancel`), _tmpl$30 = /* @__PURE__ */ template(`<div class=bookmark-items>`), _tmpl$31 = /* @__PURE__ */ template(`<div class=bookmark-folder-section><div class="bookmark-folder-header clickable"role=button tabindex=0><div class=bookmark-folder-overview><span class=bookmark-folder-chevron aria-hidden=true>▸</span><div><div class=bookmark-folder-name></div><div class=bookmark-folder-meta> saved`), _tmpl$32 = /* @__PURE__ */ template(`<div class=bookmark-folder-collapsed-hint>Click to view saved links.`), _tmpl$33 = /* @__PURE__ */ template(`<div class=bookmark-empty-folder>No bookmarks in this folder yet.`), _tmpl$34 = /* @__PURE__ */ template(`<div class=bookmark-item-note>`), _tmpl$35 = /* @__PURE__ */ template(`<div class=bookmark-item><button class=bookmark-item-link type=button><span class=bookmark-item-title></span><span class=bookmark-item-url></span></button><div class=bookmark-item-footer><span class=bookmark-item-time></span><button class="bookmark-ghost-button danger"type=button>Remove`), _tmpl$36 = /* @__PURE__ */ template(`<div class=agent-muted>No checkpoints yet.`), _tmpl$37 = /* @__PURE__ */ template(`<span class=checkpoint-timeline-line>`), _tmpl$38 = /* @__PURE__ */ template(`<div class=checkpoint-timeline-item><div class=checkpoint-timeline-rail><span class=checkpoint-timeline-dot></span></div><div class=checkpoint-timeline-content><div class=checkpoint-timeline-name></div><div class=checkpoint-timeline-time></div><button class=agent-control-button type=button>Restore`), _tmpl$39 = /* @__PURE__ */ template(`<div>`), _tmpl$40 = /* @__PURE__ */ template(`<div class=thinking-state><div class=thinking-orb aria-hidden=true><span></span><span></span><span></span></div><div class=thinking-copy><div class=thinking-title>Thinking`), _tmpl$41 = /* @__PURE__ */ template(`<div class=chat-approval-detail>`), _tmpl$42 = /* @__PURE__ */ template(`<div class=chat-approval><div class=chat-approval-icon aria-hidden=true><svg width=16 height=16 viewBox="0 0 16 16"fill=none><path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM7.25 4.75a.75.75 0 011.5 0v3.5a.75.75 0 01-1.5 0v-3.5zM8 11.5a.75.75 0 110-1.5.75.75 0 010 1.5z"fill=currentColor></path></svg></div><div class=chat-approval-body><div class=chat-approval-title>Approval needed: <strong></strong></div><div class=chat-approval-detail></div><div class=chat-approval-actions><button class="chat-approval-btn chat-approval-approve"type=button>Approve</button><button class="chat-approval-btn chat-approval-reject"type=button>Reject`);
 const UNSORTED_FOLDER = {
   id: "unsorted",
   name: "Unsorted",
@@ -3168,7 +3384,7 @@ const UNSORTED_FOLDER = {
 const MarkdownMessage = (props) => {
   const html2 = createMemo(() => renderMarkdown(props.content));
   return (() => {
-    var _el$ = _tmpl$$3();
+    var _el$ = _tmpl$$4();
     createRenderEffect(() => _el$.innerHTML = html2());
     return _el$;
   })();
@@ -3317,7 +3533,7 @@ ${contextBlock}` : contextBlock);
   const [editingFolderSummary, setEditingFolderSummary] = createSignal("");
   const [expandedFolderIds, setExpandedFolderIds] = createSignal([UNSORTED_FOLDER.id]);
   const [actionsExpanded, setActionsExpanded] = createSignal(false);
-  createSignal(false);
+  const [checkpointsExpanded, setCheckpointsExpanded] = createSignal(false);
   const [isDragging, setIsDragging] = createSignal(false);
   const [elapsedSeconds, setElapsedSeconds] = createSignal(0);
   let messagesContainerRef;
@@ -3511,7 +3727,7 @@ ${contextBlock}` : contextBlock);
           return runtimeState2().supervisor.pendingApprovals.length > 0;
         },
         get children() {
-          var _el$11 = _tmpl$2$3();
+          var _el$11 = _tmpl$2$4();
           insert(_el$11, () => runtimeState2().supervisor.pendingApprovals.length);
           return _el$11;
         }
@@ -3528,7 +3744,7 @@ ${contextBlock}` : contextBlock);
           return sidebarTab() === "supervisor";
         },
         get children() {
-          var _el$16 = _tmpl$5$2(), _el$17 = _el$16.firstChild, _el$18 = _el$17.firstChild, _el$19 = _el$18.firstChild, _el$20 = _el$19.nextSibling, _el$21 = _el$18.nextSibling, _el$22 = _el$17.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$23.nextSibling, _el$25 = _el$22.nextSibling, _el$27 = _el$25.nextSibling;
+          var _el$16 = _tmpl$5$3(), _el$17 = _el$16.firstChild, _el$18 = _el$17.firstChild, _el$19 = _el$18.firstChild, _el$20 = _el$19.nextSibling, _el$21 = _el$18.nextSibling, _el$22 = _el$17.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$23.nextSibling, _el$25 = _el$22.nextSibling, _el$27 = _el$25.nextSibling;
           _el$27.firstChild;
           insert(_el$20, () => runtimeState2().supervisor.paused ? "Agent is paused" : "Agent is live");
           insert(_el$21, () => runtimeState2().supervisor.paused ? "Paused" : "Running");
@@ -3555,12 +3771,12 @@ ${contextBlock}` : contextBlock);
               return _tmpl$19$1();
             },
             get children() {
-              return [_tmpl$3$2(), createComponent(For, {
+              return [_tmpl$3$3(), createComponent(For, {
                 get each() {
                   return runtimeState2().supervisor.pendingApprovals;
                 },
                 children: (approval) => (() => {
-                  var _el$85 = _tmpl$20(), _el$86 = _el$85.firstChild, _el$87 = _el$86.nextSibling, _el$88 = _el$87.nextSibling, _el$89 = _el$88.nextSibling, _el$90 = _el$89.nextSibling, _el$91 = _el$90.firstChild, _el$92 = _el$91.nextSibling;
+                  var _el$85 = _tmpl$20$1(), _el$86 = _el$85.firstChild, _el$87 = _el$86.nextSibling, _el$88 = _el$87.nextSibling, _el$89 = _el$88.nextSibling, _el$90 = _el$89.nextSibling, _el$91 = _el$90.firstChild, _el$92 = _el$91.nextSibling;
                   insert(_el$87, () => approval.name);
                   insert(_el$88, () => approval.argsSummary);
                   insert(_el$89, () => approval.reason);
@@ -3576,7 +3792,7 @@ ${contextBlock}` : contextBlock);
               return recentActions().length > 0;
             },
             get children() {
-              var _el$29 = _tmpl$4$2();
+              var _el$29 = _tmpl$4$3();
               _el$29.$$click = () => setActionsExpanded((current) => !current);
               insert(_el$29, (() => {
                 var _c$ = memo(() => !!actionsExpanded());
@@ -3590,7 +3806,7 @@ ${contextBlock}` : contextBlock);
               return recentActions().length > 0;
             },
             get fallback() {
-              return _tmpl$21();
+              return _tmpl$21$1();
             },
             get children() {
               return createComponent(Show, {
@@ -3598,7 +3814,7 @@ ${contextBlock}` : contextBlock);
                   return actionsExpanded();
                 },
                 get fallback() {
-                  return _tmpl$22();
+                  return _tmpl$22$1();
                 },
                 get children() {
                   return createComponent(For, {
@@ -3606,7 +3822,7 @@ ${contextBlock}` : contextBlock);
                       return recentActions();
                     },
                     children: (action) => (() => {
-                      var _el$95 = _tmpl$25(), _el$96 = _el$95.firstChild, _el$97 = _el$96.firstChild, _el$98 = _el$97.nextSibling, _el$99 = _el$96.nextSibling;
+                      var _el$95 = _tmpl$25$1(), _el$96 = _el$95.firstChild, _el$97 = _el$96.firstChild, _el$98 = _el$97.nextSibling, _el$99 = _el$96.nextSibling;
                       insert(_el$97, () => action.name);
                       insert(_el$98, () => action.status);
                       insert(_el$99, () => action.argsSummary);
@@ -3615,7 +3831,7 @@ ${contextBlock}` : contextBlock);
                           return action.resultSummary;
                         },
                         get children() {
-                          var _el$100 = _tmpl$23();
+                          var _el$100 = _tmpl$23$1();
                           insert(_el$100, () => action.resultSummary);
                           return _el$100;
                         }
@@ -3625,7 +3841,7 @@ ${contextBlock}` : contextBlock);
                           return action.error;
                         },
                         get children() {
-                          var _el$101 = _tmpl$24();
+                          var _el$101 = _tmpl$24$1();
                           insert(_el$101, () => action.error);
                           return _el$101;
                         }
@@ -3657,7 +3873,7 @@ ${contextBlock}` : contextBlock);
               return currentTabSaved();
             },
             get children() {
-              return _tmpl$6$2();
+              return _tmpl$6$3();
             }
           }), null);
           _el$36.$$input = (e) => setBookmarkSearchQuery(e.currentTarget.value);
@@ -3697,7 +3913,7 @@ ${contextBlock}` : contextBlock);
             },
             get fallback() {
               return (() => {
-                var _el$102 = _tmpl$26();
+                var _el$102 = _tmpl$26$1();
                 insert(_el$102, (() => {
                   var _c$5 = memo(() => !!normalizedBookmarkSearch());
                   return () => _c$5() ? `No bookmarks matched "${bookmarkSearchQuery().trim()}".` : "No bookmarks saved yet.";
@@ -3726,7 +3942,7 @@ ${contextBlock}` : contextBlock);
                       return folder.summary;
                     },
                     get children() {
-                      var _el$111 = _tmpl$27();
+                      var _el$111 = _tmpl$27$1();
                       insert(_el$111, () => folder.summary);
                       return _el$111;
                     }
@@ -4095,7 +4311,7 @@ ${contextBlock}` : contextBlock);
   });
 };
 delegateEvents(["pointerdown", "click", "input", "keydown"]);
-var _tmpl$$2 = /* @__PURE__ */ template(`<div class=devtools-console>`), _tmpl$2$2 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for console output... Console monitoring activates when an agent uses devtools.`), _tmpl$3$1 = /* @__PURE__ */ template(`<div><span></span><span class=console-time></span><span class=console-text></span><span class=console-source>`), _tmpl$4$1 = /* @__PURE__ */ template(`<div class=devtools-network><div class=network-header><span>Method</span><span>URL</span><span>Status</span><span>Type</span><span>Time`), _tmpl$5$1 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for network requests... Network monitoring activates when an agent uses devtools.`), _tmpl$6$1 = /* @__PURE__ */ template(`<div><span class=network-method></span><span class=network-url></span><span></span><span class=network-type></span><span class=network-duration>`), _tmpl$7$1 = /* @__PURE__ */ template(`<div class=devtools-activity>`), _tmpl$8$1 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for agent devtools activity...`), _tmpl$9$1 = /* @__PURE__ */ template(`<div class=activity-entry><span class=activity-time></span><span class=activity-tool></span><span class=activity-args></span><span></span><span class=activity-duration>`), _tmpl$0$1 = /* @__PURE__ */ template(`<span class="devtools-tab-badge error">`), _tmpl$1$1 = /* @__PURE__ */ template(`<span class="devtools-tab-badge count">`), _tmpl$10$1 = /* @__PURE__ */ template(`<div class=export-date-inputs><div class=export-date-row><span class=export-date-label>From</span><input class=export-date-input type=date></div><div class=export-date-row><span class=export-date-label>To</span><input class=export-date-input type=date>`), _tmpl$11$1 = /* @__PURE__ */ template(`<div class=devtools-export-dropdown><div class=export-section><div class=export-section-label>Log Types</div><label class=export-checkbox><input type=checkbox>Console</label><label class=export-checkbox><input type=checkbox>Network</label><label class=export-checkbox><input type=checkbox>Activity</label></div><div class=export-section><div class=export-section-label>Date Range</div><div class=export-date-btns><button>Today</button><button>Custom</button></div></div><button class=export-submit>Export JSON`), _tmpl$12$1 = /* @__PURE__ */ template(`<div class=devtools-panel><div class=devtools-tabs><button>Console</button><button>Network</button><button>Activity</button><div class=devtools-tab-spacer></div><div class=devtools-export-wrap><button title="Export Logs"><svg width=13 height=13 viewBox="0 0 13 13"fill=none style=vertical-align:middle><path d="M6.5 1v7M3.5 5l3 3 3-3"stroke=currentColor stroke-width=1.3 stroke-linecap=round stroke-linejoin=round></path><path d="M1 9.5v1A1.5 1.5 0 0 0 2.5 12h8A1.5 1.5 0 0 0 12 10.5v-1"stroke=currentColor stroke-width=1.3 stroke-linecap=round></path></svg></button></div><button class=devtools-close-btn title="Close DevTools">×</button></div><div class=devtools-content>`);
+var _tmpl$$3 = /* @__PURE__ */ template(`<div class=devtools-console>`), _tmpl$2$3 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for console output... Console monitoring activates when an agent uses devtools.`), _tmpl$3$2 = /* @__PURE__ */ template(`<div><span></span><span class=console-time></span><span class=console-text></span><span class=console-source>`), _tmpl$4$2 = /* @__PURE__ */ template(`<div class=devtools-network><div class=network-header><span>Method</span><span>URL</span><span>Status</span><span>Type</span><span>Time`), _tmpl$5$2 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for network requests... Network monitoring activates when an agent uses devtools.`), _tmpl$6$2 = /* @__PURE__ */ template(`<div><span class=network-method></span><span class=network-url></span><span></span><span class=network-type></span><span class=network-duration>`), _tmpl$7$1 = /* @__PURE__ */ template(`<div class=devtools-activity>`), _tmpl$8$1 = /* @__PURE__ */ template(`<div class=devtools-empty>Waiting for agent devtools activity...`), _tmpl$9$1 = /* @__PURE__ */ template(`<div class=activity-entry><span class=activity-time></span><span class=activity-tool></span><span class=activity-args></span><span></span><span class=activity-duration>`), _tmpl$0$1 = /* @__PURE__ */ template(`<span class="devtools-tab-badge error">`), _tmpl$1$1 = /* @__PURE__ */ template(`<span class="devtools-tab-badge count">`), _tmpl$10$1 = /* @__PURE__ */ template(`<div class=export-date-inputs><div class=export-date-row><span class=export-date-label>From</span><input class=export-date-input type=date></div><div class=export-date-row><span class=export-date-label>To</span><input class=export-date-input type=date>`), _tmpl$11$1 = /* @__PURE__ */ template(`<div class=devtools-export-dropdown><div class=export-section><div class=export-section-label>Log Types</div><label class=export-checkbox><input type=checkbox>Console</label><label class=export-checkbox><input type=checkbox>Network</label><label class=export-checkbox><input type=checkbox>Activity</label></div><div class=export-section><div class=export-section-label>Date Range</div><div class=export-date-btns><button>Today</button><button>Custom</button></div></div><button class=export-submit>Export JSON`), _tmpl$12$1 = /* @__PURE__ */ template(`<div class=devtools-panel><div class=devtools-tabs><button>Console</button><button>Network</button><button>Activity</button><div class=devtools-tab-spacer></div><div class=devtools-export-wrap><button title="Export Logs"><svg width=13 height=13 viewBox="0 0 13 13"fill=none style=vertical-align:middle><path d="M6.5 1v7M3.5 5l3 3 3-3"stroke=currentColor stroke-width=1.3 stroke-linecap=round stroke-linejoin=round></path><path d="M1 9.5v1A1.5 1.5 0 0 0 2.5 12h8A1.5 1.5 0 0 0 12 10.5v-1"stroke=currentColor stroke-width=1.3 stroke-linecap=round></path></svg></button></div><button class=devtools-close-btn title="Close DevTools">×</button></div><div class=devtools-content>`);
 function formatTime(iso) {
   try {
     const d = new Date(iso);
@@ -4168,10 +4384,10 @@ const ConsoleView = (props) => {
       return props.entries.length > 0;
     },
     get fallback() {
-      return _tmpl$2$2();
+      return _tmpl$2$3();
     },
     get children() {
-      var _el$ = _tmpl$$2();
+      var _el$ = _tmpl$$3();
       _el$.addEventListener("scroll", onScroll);
       var _ref$ = scrollRef;
       typeof _ref$ === "function" ? use(_ref$, _el$) : scrollRef = _el$;
@@ -4180,7 +4396,7 @@ const ConsoleView = (props) => {
           return props.entries;
         },
         children: (entry) => (() => {
-          var _el$3 = _tmpl$3$1(), _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling;
+          var _el$3 = _tmpl$3$2(), _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling;
           insert(_el$4, () => entry.level);
           insert(_el$5, () => formatTime(entry.timestamp));
           insert(_el$6, () => entry.text);
@@ -4222,10 +4438,10 @@ const NetworkView = (props) => {
       return props.entries.length > 0;
     },
     get fallback() {
-      return _tmpl$5$1();
+      return _tmpl$5$2();
     },
     get children() {
-      var _el$8 = _tmpl$4$1();
+      var _el$8 = _tmpl$4$2();
       _el$8.firstChild;
       _el$8.addEventListener("scroll", onScroll);
       var _ref$2 = scrollRef;
@@ -4235,7 +4451,7 @@ const NetworkView = (props) => {
           return props.entries;
         },
         children: (entry) => (() => {
-          var _el$1 = _tmpl$6$1(), _el$10 = _el$1.firstChild, _el$11 = _el$10.nextSibling, _el$12 = _el$11.nextSibling, _el$13 = _el$12.nextSibling, _el$14 = _el$13.nextSibling;
+          var _el$1 = _tmpl$6$2(), _el$10 = _el$1.firstChild, _el$11 = _el$10.nextSibling, _el$12 = _el$11.nextSibling, _el$13 = _el$12.nextSibling, _el$14 = _el$13.nextSibling;
           insert(_el$10, () => entry.method);
           insert(_el$11, () => shortenUrl(entry.url));
           insert(_el$12, (() => {
@@ -4542,7 +4758,7 @@ const DevToolsPanel = () => {
   })();
 };
 delegateEvents(["click", "input"]);
-var _tmpl$$1 = /* @__PURE__ */ template(`<input id=max-tool-iterations class=settings-input type=number min=10 max=1000 placeholder=200>`), _tmpl$2$1 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-provider>Provider</label><select id=chat-provider class="settings-input settings-select">`), _tmpl$3 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-api-key>API Key</label><input id=chat-api-key class=settings-input type=password>`), _tmpl$4 = /* @__PURE__ */ template(`<select id=chat-model class="settings-input settings-select"style=flex:1>`), _tmpl$5 = /* @__PURE__ */ template(`<p class=settings-hint style=color:var(--error)>Could not fetch models — check your API key and connection.`), _tmpl$6 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-model>Model</label><div style=display:flex;gap:6px;align-items:center><button type=button class=settings-refresh-btn title="Refresh model list">↺`), _tmpl$7 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-base-url>Base URL</label><input id=chat-base-url class=settings-input>`), _tmpl$8 = /* @__PURE__ */ template(`<div class=premium-section><div class=premium-active-badge>Premium Active</div><p class=premium-detail></p><div class=premium-actions-row><button class="premium-btn premium-btn-manage">Manage Subscription</button><button class="premium-btn premium-btn-reset">Sign Out`), _tmpl$9 = /* @__PURE__ */ template(`<div class=command-bar-overlay><div class=settings-panel><h2 class=settings-title>Runtime Settings</h2><div class=settings-callout><div class=settings-callout-title>External Agent Control</div><p class=settings-callout-copy>Vessel is configured to run under an external harness such as Hermes Agent or OpenClaw. Provider and model selection are not configured inside Vessel.</p></div><div class=settings-field><label class=settings-label for=default-homepage>Homepage</label><input id=default-homepage class=settings-input placeholder=https://start.duckduckgo.com><p class=settings-hint>The page that opens when you create a new tab or launch Vessel without restoring a previous session.</p></div><div class=settings-field><label class=settings-label for=mcp-port>MCP Port</label><input id=mcp-port class=settings-input placeholder=3100><p class=settings-hint>External harnesses connect to Vessel at <code>http://127.0.0.1:&lt;port&gt;/mcp</code>. Changing this value restarts the MCP server immediately.</p></div><div class=settings-field><label class=settings-label for=max-tool-iterations>Max Tool Iterations</label><p class=settings-hint></p></div><div class=settings-field><label class=settings-label for=obsidian-vault-path>Obsidian Vault Path</label><input id=obsidian-vault-path class=settings-input placeholder=/home/you/Documents/MyVault><p class=settings-hint>Optional. When set, Vessel memory tools can write markdown notes into this vault for research breadcrumbs and summaries.</p></div><div class=settings-field><label class=settings-label for=agent-transcript-mode>Agent Transcript Monitor</label><select id=agent-transcript-mode class="settings-input settings-select"><option value=off>Off</option><option value=summary>Summary HUD</option><option value=full>Full transcript</option></select><p class=settings-hint>Controls the in-browser transcript monitor when an external harness publishes reasoning or status updates into Vessel via the<code>vessel_publish_transcript</code> MCP tool. Summary HUD shows a compact 2-line status surface; Full transcript shows the recent entry list.</p></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Restore last browser session on launch</span></label></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Start bookmarks fresh on launch</span></label><p class=settings-hint>Off by default. When enabled, bookmark folders and saved pages are cleared each time Vessel starts.</p></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Enable Chat Assistant</span></label><p class=settings-hint>Adds a Chat tab to the sidebar for conversing with an AI provider of your choice.</p></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-label>Vessel Premium</label></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Anonymous Usage Analytics</span></label><p class=settings-hint>Help improve Vessel by sending anonymous usage data (tool popularity, session duration, provider type). No URLs, page content, queries, or personal data is ever collected.</p></div><div class=settings-actions><button class=settings-save>Save</button><button class=settings-close>Close`), _tmpl$0 = /* @__PURE__ */ template(`<style>
+var _tmpl$$2 = /* @__PURE__ */ template(`<div class=welcome-banner><div class=welcome-banner-header><span class=welcome-banner-title>Welcome to Vessel</span><button class=welcome-banner-dismiss>&times;</button></div><p class=welcome-banner-text>Get started in three steps:</p><ol class=welcome-banner-steps><li><strong>Configure a chat provider</strong> — scroll to Chat Assistant below and add an API key</li><li><strong>Connect your agent harness</strong> — point it at the MCP endpoint shown below</li><li><strong>Learn the shortcuts</strong> — press <kbd>?</kbd> anytime for a quick reference`), _tmpl$2$2 = /* @__PURE__ */ template(`<input id=max-tool-iterations class=settings-input type=number min=10 max=1000 placeholder=200>`), _tmpl$3$1 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-provider>Provider</label><select id=chat-provider class="settings-input settings-select">`), _tmpl$4$1 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-api-key>API Key</label><input id=chat-api-key class=settings-input type=password>`), _tmpl$5$1 = /* @__PURE__ */ template(`<select id=chat-model class="settings-input settings-select"style=flex:1>`), _tmpl$6$1 = /* @__PURE__ */ template(`<p class=settings-hint style=color:var(--error)>Could not fetch models — check your API key and connection.`), _tmpl$7 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-model>Model</label><div style=display:flex;gap:6px;align-items:center><button type=button class=settings-refresh-btn title="Refresh model list">↺`), _tmpl$8 = /* @__PURE__ */ template(`<div class=settings-field><label class=settings-label for=chat-base-url>Base URL</label><input id=chat-base-url class=settings-input>`), _tmpl$9 = /* @__PURE__ */ template(`<div class=premium-section><div class=premium-active-badge>Premium Active</div><p class=premium-detail></p><div class=premium-actions-row><button class="premium-btn premium-btn-manage">Manage Subscription</button><button class="premium-btn premium-btn-reset">Sign Out`), _tmpl$0 = /* @__PURE__ */ template(`<span class=vault-premium-badge>Premium`), _tmpl$1 = /* @__PURE__ */ template(`<p class=settings-hint style=margin-bottom:10px>Store credentials for agent-driven logins. Credentials are encrypted at rest and never sent to AI providers — they are filled directly into login forms with your consent.`), _tmpl$10 = /* @__PURE__ */ template(`<div class=vault-entries>`), _tmpl$11 = /* @__PURE__ */ template(`<button class=vault-add-btn>+ Add Credential`), _tmpl$12 = /* @__PURE__ */ template(`<div class=vault-add-form><input class=settings-input placeholder="Label (e.g. Work GitHub)"><input class=settings-input placeholder="Domain pattern (e.g. github.com, *.aws.amazon.com)"><input class=settings-input placeholder="Username / email"><input class=settings-input type=password placeholder=Password><input class=settings-input placeholder="TOTP secret (optional, base32)"><input class=settings-input placeholder="Notes (optional)"><div class=vault-add-actions><button class="premium-btn premium-btn-activate">Save Credential</button><button class="premium-btn premium-btn-reset">Cancel`), _tmpl$13 = /* @__PURE__ */ template(`<div class=command-bar-overlay><div class=settings-panel><h2 class=settings-title>Runtime Settings</h2><div class=settings-callout><div class=settings-callout-title>External Agent Control</div><p class=settings-callout-copy>Vessel is configured to run under an external harness such as Hermes Agent or OpenClaw. Provider and model selection are not configured inside Vessel.</p></div><div class=settings-field><label class=settings-label for=default-homepage>Homepage</label><input id=default-homepage class=settings-input placeholder=https://start.duckduckgo.com><p class=settings-hint>The page that opens when you create a new tab or launch Vessel without restoring a previous session.</p></div><div class=settings-field><label class=settings-label for=mcp-port>MCP Port</label><input id=mcp-port class=settings-input placeholder=3100><p class=settings-hint>External harnesses connect to Vessel at <code>http://127.0.0.1:&lt;port&gt;/mcp</code>. Changing this value restarts the MCP server immediately.</p></div><div class=settings-field><label class=settings-label for=max-tool-iterations>Max Tool Iterations</label><p class=settings-hint></p></div><div class=settings-field><label class=settings-label for=obsidian-vault-path>Obsidian Vault Path</label><input id=obsidian-vault-path class=settings-input placeholder=/home/you/Documents/MyVault><p class=settings-hint>Optional. When set, Vessel memory tools can write markdown notes into this vault for research breadcrumbs and summaries.</p></div><div class=settings-field><label class=settings-label for=agent-transcript-mode>Agent Transcript Monitor</label><select id=agent-transcript-mode class="settings-input settings-select"><option value=off>Off</option><option value=summary>Summary HUD</option><option value=full>Full transcript</option></select><p class=settings-hint>Controls the in-browser transcript monitor when an external harness publishes reasoning or status updates into Vessel via the<code>vessel_publish_transcript</code> MCP tool. Summary HUD shows a compact 2-line status surface; Full transcript shows the recent entry list.</p></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Restore last browser session on launch</span></label></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Start bookmarks fresh on launch</span></label><p class=settings-hint>Off by default. When enabled, bookmark folders and saved pages are cleared each time Vessel starts.</p></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Enable Chat Assistant</span></label><p class=settings-hint>Adds a Chat tab to the sidebar for conversing with an AI provider of your choice.</p></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-label>Vessel Premium</label></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-label>Agent Credential Vault</label></div><div class=settings-section-divider></div><div class=settings-field><label class=settings-toggle><button type=button class=toggle-switch role=switch><span class=toggle-switch-thumb></span></button><span>Anonymous Usage Analytics</span></label><p class=settings-hint>Help improve Vessel by sending anonymous usage data (tool popularity, session duration, provider type). No URLs, page content, queries, or personal data is ever collected.</p></div><div class=settings-actions><button class=settings-save>Save</button><button class=settings-close>Close`), _tmpl$14 = /* @__PURE__ */ template(`<style>
         .settings-panel {
           width: min(440px, calc(100vw - 32px));
           max-height: calc(100vh - 48px);
@@ -4877,7 +5093,174 @@ var _tmpl$$1 = /* @__PURE__ */ template(`<input id=max-tool-iterations class=set
           color: var(--text-secondary);
           background: var(--bg-tertiary);
         }
-      `), _tmpl$1 = /* @__PURE__ */ template(`<div class="settings-input settings-input-disabled"title="Upgrade to Vessel Premium for unlimited tool iterations">50`), _tmpl$10 = /* @__PURE__ */ template(`<div class=settings-health-issues>`), _tmpl$11 = /* @__PURE__ */ template(`<div class=settings-health><div class=settings-callout-title>Runtime Health</div><p class=settings-hint>MCP status: <strong></strong> `), _tmpl$12 = /* @__PURE__ */ template(`<p class=settings-hint>Active endpoint: <code>`), _tmpl$13 = /* @__PURE__ */ template(`<div class=settings-health-issue><strong></strong><div>`), _tmpl$14 = /* @__PURE__ */ template(`<div>`), _tmpl$15 = /* @__PURE__ */ template(`<option>`), _tmpl$16 = /* @__PURE__ */ template(`<input id=chat-model class=settings-input style=flex:1>`), _tmpl$17 = /* @__PURE__ */ template(`<button class="premium-btn premium-btn-reset">Clear Saved Email`), _tmpl$18 = /* @__PURE__ */ template(`<div class=premium-section><p class=premium-description>Unlock screenshot/vision analysis, session management, Obsidian integration, workflow tracking, DevTools tools, table extraction, and unlimited tool iterations.</p><div class=premium-activate-row><input class="settings-input premium-email-input"type=email placeholder="Enter your subscription email"><button class="premium-btn premium-btn-activate"></button></div><button class="premium-btn premium-btn-upgrade">Subscribe to Premium — 5-day free trial`), _tmpl$19 = /* @__PURE__ */ template(`<p class=settings-status>`);
+
+        /* Welcome banner */
+        .welcome-banner {
+          margin-bottom: 20px;
+          padding: 16px;
+          border-radius: var(--radius-md);
+          border: 1px solid rgba(196, 160, 90, 0.25);
+          background: rgba(196, 160, 90, 0.08);
+        }
+        .welcome-banner-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-bottom: 8px;
+        }
+        .welcome-banner-title {
+          font-size: 13px;
+          font-weight: 600;
+          color: var(--accent-primary);
+        }
+        .welcome-banner-dismiss {
+          width: 22px;
+          height: 22px;
+          border-radius: 4px;
+          background: transparent;
+          border: none;
+          color: var(--text-muted);
+          font-size: 16px;
+          cursor: pointer;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+        .welcome-banner-dismiss:hover {
+          background: rgba(255, 255, 255, 0.08);
+          color: var(--text-primary);
+        }
+        .welcome-banner-text {
+          font-size: 12px;
+          color: var(--text-secondary);
+          margin: 0 0 8px;
+        }
+        .welcome-banner-steps {
+          margin: 0;
+          padding-left: 20px;
+          font-size: 12px;
+          line-height: 1.7;
+          color: var(--text-secondary);
+        }
+        .welcome-banner-steps li {
+          margin-bottom: 2px;
+        }
+        .welcome-banner-steps li.done {
+          color: var(--text-muted);
+          text-decoration: line-through;
+          opacity: 0.6;
+        }
+        .welcome-banner-steps kbd {
+          display: inline-block;
+          padding: 0 5px;
+          font-size: 11px;
+          font-family: var(--font-mono);
+          background: rgba(255, 255, 255, 0.08);
+          border: 1px solid rgba(255, 255, 255, 0.1);
+          border-radius: 3px;
+          color: var(--text-primary);
+        }
+
+        /* Agent Credential Vault */
+        .vault-premium-badge {
+          display: inline-block;
+          font-size: 10px;
+          font-weight: 600;
+          color: #f0c636;
+          background: rgba(240, 198, 54, 0.15);
+          padding: 1px 6px;
+          border-radius: 4px;
+          margin-left: 8px;
+          vertical-align: middle;
+        }
+        .vault-entries {
+          display: flex;
+          flex-direction: column;
+          gap: 6px;
+          margin-bottom: 10px;
+        }
+        .vault-entry {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding: 8px 12px;
+          background: var(--bg-tertiary);
+          border: 1px solid var(--border-subtle);
+          border-radius: var(--radius-md);
+        }
+        .vault-entry-info {
+          display: flex;
+          flex-direction: column;
+          gap: 2px;
+          min-width: 0;
+        }
+        .vault-entry-label {
+          font-size: 12px;
+          font-weight: 500;
+          color: var(--text-primary);
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+        .vault-entry-detail {
+          font-size: 11px;
+          color: var(--text-muted);
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+        .vault-entry-remove {
+          flex-shrink: 0;
+          width: 24px;
+          height: 24px;
+          border-radius: 4px;
+          background: transparent;
+          border: none;
+          color: var(--text-tertiary, #71717a);
+          font-size: 16px;
+          cursor: pointer;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          transition: background var(--duration-fast), color var(--duration-fast);
+        }
+        .vault-entry-remove:hover {
+          background: rgba(255, 108, 91, 0.12);
+          color: #ff8e8e;
+        }
+        .vault-add-btn {
+          height: 32px;
+          padding: 0 14px;
+          border-radius: var(--radius-md);
+          font-size: 12px;
+          font-weight: 500;
+          background: var(--bg-tertiary);
+          border: 1px dashed var(--border-subtle);
+          color: var(--text-secondary);
+          cursor: pointer;
+          width: 100%;
+          transition: background var(--duration-fast), border-color var(--duration-fast);
+        }
+        .vault-add-btn:hover {
+          background: var(--border-visible);
+          border-color: var(--border-visible);
+        }
+        .vault-add-form {
+          display: flex;
+          flex-direction: column;
+          gap: 8px;
+          padding: 12px;
+          background: rgba(255, 255, 255, 0.02);
+          border: 1px solid var(--border-subtle);
+          border-radius: var(--radius-md);
+        }
+        .vault-add-actions {
+          display: flex;
+          gap: 8px;
+          justify-content: flex-end;
+          margin-top: 4px;
+        }
+      `), _tmpl$15 = /* @__PURE__ */ template(`<div class="settings-input settings-input-disabled"title="Upgrade to Vessel Premium for unlimited tool iterations">50`), _tmpl$16 = /* @__PURE__ */ template(`<div class=settings-health-issues>`), _tmpl$17 = /* @__PURE__ */ template(`<div class=settings-health><div class=settings-callout-title>Runtime Health</div><p class=settings-hint>MCP status: <strong></strong> `), _tmpl$18 = /* @__PURE__ */ template(`<p class=settings-hint>Active endpoint: <code>`), _tmpl$19 = /* @__PURE__ */ template(`<div class=settings-health-issue><strong></strong><div>`), _tmpl$20 = /* @__PURE__ */ template(`<div>`), _tmpl$21 = /* @__PURE__ */ template(`<option>`), _tmpl$22 = /* @__PURE__ */ template(`<input id=chat-model class=settings-input style=flex:1>`), _tmpl$23 = /* @__PURE__ */ template(`<button class="premium-btn premium-btn-reset">Clear Saved Email`), _tmpl$24 = /* @__PURE__ */ template(`<div class=premium-section><p class=premium-description>Unlock screenshot/vision analysis, session management, Obsidian integration, workflow tracking, DevTools tools, table extraction, Agent Credential Vault, and unlimited tool iterations.</p><div class=premium-activate-row><input class="settings-input premium-email-input"type=email placeholder="Enter your subscription email"><button class="premium-btn premium-btn-activate"></button></div><button class="premium-btn premium-btn-upgrade">Subscribe to Premium — 5-day free trial`), _tmpl$25 = /* @__PURE__ */ template(`<p class=settings-status>`), _tmpl$26 = /* @__PURE__ */ template(`<p class=settings-hint>Securely store credentials for agent-driven logins. Upgrade to Premium to unlock the Agent Credential Vault.`), _tmpl$27 = /* @__PURE__ */ template(`<div class=vault-entry><div class=vault-entry-info><span class=vault-entry-label></span><span class=vault-entry-detail> &middot; </span></div><button class=vault-entry-remove title="Remove credential">&times;`);
 const CHAT_PROVIDERS = [{
   id: "anthropic",
   name: "Anthropic",
@@ -4959,6 +5342,80 @@ const Settings = () => {
   const [defaultUrl, setDefaultUrl] = createSignal("https://start.duckduckgo.com");
   const [status, setStatus] = createSignal(null);
   const [telemetryEnabled, setTelemetryEnabled] = createSignal(true);
+  const [vaultEntries, setVaultEntries] = createSignal([]);
+  const [vaultExpanded, setVaultExpanded] = createSignal(false);
+  const [vaultAdding, setVaultAdding] = createSignal(false);
+  const [vaultNewLabel, setVaultNewLabel] = createSignal("");
+  const [vaultNewDomain, setVaultNewDomain] = createSignal("");
+  const [vaultNewUsername, setVaultNewUsername] = createSignal("");
+  const [vaultNewPassword, setVaultNewPassword] = createSignal("");
+  const [vaultNewTotp, setVaultNewTotp] = createSignal("");
+  const [vaultNewNotes, setVaultNewNotes] = createSignal("");
+  const [vaultMessage, setVaultMessage] = createSignal(null);
+  const FIRST_RUN_KEY = "vessel.onboarding.dismissed";
+  const [showWelcome, setShowWelcome] = createSignal(!localStorage.getItem(FIRST_RUN_KEY));
+  const dismissWelcome = () => {
+    localStorage.setItem(FIRST_RUN_KEY, "1");
+    setShowWelcome(false);
+  };
+  const loadVaultEntries = async () => {
+    try {
+      const entries2 = await window.vessel.vault.list();
+      setVaultEntries(entries2);
+    } catch {
+    }
+  };
+  const handleVaultAdd = async () => {
+    if (!vaultNewLabel().trim() || !vaultNewDomain().trim() || !vaultNewUsername().trim() || !vaultNewPassword().trim()) {
+      setVaultMessage({
+        kind: "error",
+        text: "Label, domain, username, and password are required."
+      });
+      return;
+    }
+    try {
+      await window.vessel.vault.add({
+        label: vaultNewLabel().trim(),
+        domainPattern: vaultNewDomain().trim(),
+        username: vaultNewUsername().trim(),
+        password: vaultNewPassword().trim(),
+        totpSecret: vaultNewTotp().trim() || void 0,
+        notes: vaultNewNotes().trim() || void 0
+      });
+      setVaultNewLabel("");
+      setVaultNewDomain("");
+      setVaultNewUsername("");
+      setVaultNewPassword("");
+      setVaultNewTotp("");
+      setVaultNewNotes("");
+      setVaultAdding(false);
+      setVaultMessage({
+        kind: "success",
+        text: "Credential added."
+      });
+      await loadVaultEntries();
+    } catch (err) {
+      setVaultMessage({
+        kind: "error",
+        text: err instanceof Error ? err.message : "Failed to add credential."
+      });
+    }
+  };
+  const handleVaultRemove = async (id) => {
+    try {
+      await window.vessel.vault.remove(id);
+      await loadVaultEntries();
+      setVaultMessage({
+        kind: "success",
+        text: "Credential removed."
+      });
+    } catch {
+      setVaultMessage({
+        kind: "error",
+        text: "Failed to remove credential."
+      });
+    }
+  };
   const [premiumState, setPremiumState] = createSignal({
     status: "free",
     customerId: "",
@@ -5052,6 +5509,7 @@ const Settings = () => {
       if (ps.email) setPremiumEmail(ps.email);
     } catch {
     }
+    await loadVaultEntries();
   };
   onMount(() => {
     void loadState();
@@ -5108,31 +5566,44 @@ const Settings = () => {
     },
     get children() {
       return [(() => {
-        var _el$ = _tmpl$9(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$5.nextSibling, _el$9 = _el$8.firstChild, _el$0 = _el$9.nextSibling, _el$1 = _el$8.nextSibling, _el$10 = _el$1.firstChild, _el$12 = _el$10.nextSibling, _el$13 = _el$1.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling, _el$16 = _el$13.nextSibling, _el$17 = _el$16.firstChild, _el$18 = _el$17.nextSibling, _el$19 = _el$16.nextSibling, _el$20 = _el$19.firstChild, _el$21 = _el$20.firstChild, _el$22 = _el$19.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$23.firstChild, _el$25 = _el$22.nextSibling, _el$26 = _el$25.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.firstChild, _el$44 = _el$26.nextSibling, _el$45 = _el$44.nextSibling;
-        _el$45.firstChild;
-        var _el$54 = _el$45.nextSibling, _el$55 = _el$54.nextSibling, _el$56 = _el$55.firstChild, _el$57 = _el$56.firstChild, _el$58 = _el$55.nextSibling, _el$59 = _el$58.firstChild, _el$60 = _el$59.nextSibling;
+        var _el$ = _tmpl$13(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$1 = _el$3.nextSibling, _el$10 = _el$1.nextSibling, _el$11 = _el$10.firstChild, _el$12 = _el$11.nextSibling, _el$13 = _el$10.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling, _el$16 = _el$13.nextSibling, _el$17 = _el$16.firstChild, _el$19 = _el$17.nextSibling, _el$20 = _el$16.nextSibling, _el$21 = _el$20.firstChild, _el$22 = _el$21.nextSibling, _el$23 = _el$20.nextSibling, _el$24 = _el$23.firstChild, _el$25 = _el$24.nextSibling, _el$26 = _el$23.nextSibling, _el$27 = _el$26.firstChild, _el$28 = _el$27.firstChild, _el$29 = _el$26.nextSibling, _el$30 = _el$29.firstChild, _el$31 = _el$30.firstChild, _el$32 = _el$29.nextSibling, _el$33 = _el$32.nextSibling, _el$34 = _el$33.firstChild, _el$35 = _el$34.firstChild, _el$51 = _el$33.nextSibling, _el$52 = _el$51.nextSibling;
+        _el$52.firstChild;
+        var _el$61 = _el$52.nextSibling, _el$62 = _el$61.nextSibling, _el$63 = _el$62.firstChild;
+        _el$63.firstChild;
+        var _el$79 = _el$62.nextSibling, _el$80 = _el$79.nextSibling, _el$81 = _el$80.firstChild, _el$82 = _el$81.firstChild, _el$83 = _el$80.nextSibling, _el$84 = _el$83.firstChild, _el$85 = _el$84.nextSibling;
         addEventListener(_el$, "click", closeSettings);
         _el$2.$$keydown = handleKeyDown;
         _el$2.$$click = (e) => e.stopPropagation();
-        _el$7.$$input = (e) => setDefaultUrl(e.currentTarget.value);
-        setAttribute(_el$7, "spellcheck", false);
-        _el$0.$$input = (e) => setMcpPort(e.currentTarget.value);
-        setAttribute(_el$0, "spellcheck", false);
-        insert(_el$1, createComponent(Show, {
+        insert(_el$2, createComponent(Show, {
+          get when() {
+            return showWelcome();
+          },
+          get children() {
+            var _el$4 = _tmpl$$2(), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$5.nextSibling, _el$9 = _el$8.nextSibling, _el$0 = _el$9.firstChild;
+            _el$7.$$click = dismissWelcome;
+            createRenderEffect(() => _el$0.classList.toggle("done", !!chatEnabled()));
+            return _el$4;
+          }
+        }), _el$1);
+        _el$12.$$input = (e) => setDefaultUrl(e.currentTarget.value);
+        setAttribute(_el$12, "spellcheck", false);
+        _el$15.$$input = (e) => setMcpPort(e.currentTarget.value);
+        setAttribute(_el$15, "spellcheck", false);
+        insert(_el$16, createComponent(Show, {
           get when() {
             return premiumActive();
           },
           get fallback() {
-            return _tmpl$1();
+            return _tmpl$15();
           },
           get children() {
-            var _el$11 = _tmpl$$1();
-            _el$11.$$input = (e) => setMaxToolIterations(e.currentTarget.value);
-            createRenderEffect(() => _el$11.value = maxToolIterations());
-            return _el$11;
+            var _el$18 = _tmpl$2$2();
+            _el$18.$$input = (e) => setMaxToolIterations(e.currentTarget.value);
+            createRenderEffect(() => _el$18.value = maxToolIterations());
+            return _el$18;
           }
-        }), _el$12);
-        insert(_el$12, createComponent(Show, {
+        }), _el$19);
+        insert(_el$19, createComponent(Show, {
           get when() {
             return premiumActive();
           },
@@ -5144,71 +5615,71 @@ const Settings = () => {
             return health();
           },
           children: (currentHealth) => (() => {
-            var _el$63 = _tmpl$11(), _el$64 = _el$63.firstChild, _el$65 = _el$64.nextSibling, _el$66 = _el$65.firstChild, _el$68 = _el$66.nextSibling;
-            _el$68.nextSibling;
-            insert(_el$68, () => currentHealth().mcp.status);
-            insert(_el$65, () => currentHealth().mcp.message, null);
-            insert(_el$63, createComponent(Show, {
+            var _el$88 = _tmpl$17(), _el$89 = _el$88.firstChild, _el$90 = _el$89.nextSibling, _el$91 = _el$90.firstChild, _el$93 = _el$91.nextSibling;
+            _el$93.nextSibling;
+            insert(_el$93, () => currentHealth().mcp.status);
+            insert(_el$90, () => currentHealth().mcp.message, null);
+            insert(_el$88, createComponent(Show, {
               get when() {
                 return currentHealth().mcp.endpoint;
               },
               children: (endpoint) => (() => {
-                var _el$71 = _tmpl$12(), _el$72 = _el$71.firstChild, _el$73 = _el$72.nextSibling;
-                insert(_el$73, endpoint);
-                return _el$71;
+                var _el$96 = _tmpl$18(), _el$97 = _el$96.firstChild, _el$98 = _el$97.nextSibling;
+                insert(_el$98, endpoint);
+                return _el$96;
               })()
             }), null);
-            insert(_el$63, createComponent(Show, {
+            insert(_el$88, createComponent(Show, {
               get when() {
                 return currentHealth().startupIssues.length > 0;
               },
               get children() {
-                var _el$70 = _tmpl$10();
-                insert(_el$70, () => currentHealth().startupIssues.map((issue) => (() => {
-                  var _el$74 = _tmpl$13(), _el$75 = _el$74.firstChild, _el$76 = _el$75.nextSibling;
-                  insert(_el$75, () => issue.title);
-                  insert(_el$76, () => issue.detail);
-                  insert(_el$74, createComponent(Show, {
+                var _el$95 = _tmpl$16();
+                insert(_el$95, () => currentHealth().startupIssues.map((issue) => (() => {
+                  var _el$99 = _tmpl$19(), _el$100 = _el$99.firstChild, _el$101 = _el$100.nextSibling;
+                  insert(_el$100, () => issue.title);
+                  insert(_el$101, () => issue.detail);
+                  insert(_el$99, createComponent(Show, {
                     get when() {
                       return issue.action;
                     },
                     children: (action) => (() => {
-                      var _el$77 = _tmpl$14();
-                      insert(_el$77, action);
-                      return _el$77;
+                      var _el$102 = _tmpl$20();
+                      insert(_el$102, action);
+                      return _el$102;
                     })()
                   }), null);
                   createRenderEffect((_p$) => {
                     var _v$9 = !!(issue.severity === "warning"), _v$0 = !!(issue.severity === "error");
-                    _v$9 !== _p$.e && _el$74.classList.toggle("warning", _p$.e = _v$9);
-                    _v$0 !== _p$.t && _el$74.classList.toggle("error", _p$.t = _v$0);
+                    _v$9 !== _p$.e && _el$99.classList.toggle("warning", _p$.e = _v$9);
+                    _v$0 !== _p$.t && _el$99.classList.toggle("error", _p$.t = _v$0);
                     return _p$;
                   }, {
                     e: void 0,
                     t: void 0
                   });
-                  return _el$74;
+                  return _el$99;
                 })()));
-                return _el$70;
+                return _el$95;
               }
             }), null);
-            return _el$63;
+            return _el$88;
           })()
-        }), _el$13);
-        _el$15.$$input = (e) => setObsidianVaultPath(e.currentTarget.value);
-        setAttribute(_el$15, "spellcheck", false);
-        _el$18.addEventListener("change", (e) => setAgentTranscriptMode(e.currentTarget.value));
-        _el$21.$$click = () => setAutoRestoreSession(!autoRestoreSession());
-        _el$24.$$click = () => setClearBookmarksOnLaunch(!clearBookmarksOnLaunch());
-        _el$28.$$click = () => setChatEnabled(!chatEnabled());
+        }), _el$20);
+        _el$22.$$input = (e) => setObsidianVaultPath(e.currentTarget.value);
+        setAttribute(_el$22, "spellcheck", false);
+        _el$25.addEventListener("change", (e) => setAgentTranscriptMode(e.currentTarget.value));
+        _el$28.$$click = () => setAutoRestoreSession(!autoRestoreSession());
+        _el$31.$$click = () => setClearBookmarksOnLaunch(!clearBookmarksOnLaunch());
+        _el$35.$$click = () => setChatEnabled(!chatEnabled());
         insert(_el$2, createComponent(Show, {
           get when() {
             return chatEnabled();
           },
           get children() {
             return [(() => {
-              var _el$29 = _tmpl$2$1(), _el$30 = _el$29.firstChild, _el$31 = _el$30.nextSibling;
-              _el$31.addEventListener("change", (e) => {
+              var _el$36 = _tmpl$3$1(), _el$37 = _el$36.firstChild, _el$38 = _el$37.nextSibling;
+              _el$38.addEventListener("change", (e) => {
                 const id = e.currentTarget.value;
                 setChatProviderId(id);
                 setChatModel("");
@@ -5217,99 +5688,99 @@ const Settings = () => {
                 setProviderModels([]);
                 setModelFetchState("idle");
               });
-              insert(_el$31, createComponent(For, {
+              insert(_el$38, createComponent(For, {
                 each: CHAT_PROVIDERS,
                 children: (p) => (() => {
-                  var _el$78 = _tmpl$15();
-                  insert(_el$78, () => p.name);
-                  createRenderEffect(() => _el$78.value = p.id);
-                  return _el$78;
+                  var _el$103 = _tmpl$21();
+                  insert(_el$103, () => p.name);
+                  createRenderEffect(() => _el$103.value = p.id);
+                  return _el$103;
                 })()
               }));
-              createRenderEffect(() => _el$31.value = chatProviderId());
-              return _el$29;
+              createRenderEffect(() => _el$38.value = chatProviderId());
+              return _el$36;
             })(), createComponent(Show, {
               get when() {
                 return chatProviderMeta().requiresKey;
               },
               get children() {
-                var _el$32 = _tmpl$3(), _el$33 = _el$32.firstChild, _el$34 = _el$33.nextSibling;
-                _el$34.$$input = (e) => setChatApiKey(e.currentTarget.value);
-                setAttribute(_el$34, "spellcheck", false);
-                createRenderEffect(() => setAttribute(_el$34, "placeholder", chatProviderMeta().keyPlaceholder));
-                createRenderEffect(() => _el$34.value = chatApiKey());
-                return _el$32;
+                var _el$39 = _tmpl$4$1(), _el$40 = _el$39.firstChild, _el$41 = _el$40.nextSibling;
+                _el$41.$$input = (e) => setChatApiKey(e.currentTarget.value);
+                setAttribute(_el$41, "spellcheck", false);
+                createRenderEffect(() => setAttribute(_el$41, "placeholder", chatProviderMeta().keyPlaceholder));
+                createRenderEffect(() => _el$41.value = chatApiKey());
+                return _el$39;
               }
             }), (() => {
-              var _el$35 = _tmpl$6(), _el$36 = _el$35.firstChild, _el$37 = _el$36.nextSibling, _el$39 = _el$37.firstChild;
-              insert(_el$37, createComponent(Show, {
+              var _el$42 = _tmpl$7(), _el$43 = _el$42.firstChild, _el$44 = _el$43.nextSibling, _el$46 = _el$44.firstChild;
+              insert(_el$44, createComponent(Show, {
                 get when() {
                   return providerModels().length > 0;
                 },
                 get fallback() {
                   return (() => {
-                    var _el$79 = _tmpl$16();
-                    _el$79.$$input = (e) => setChatModel(e.currentTarget.value);
-                    setAttribute(_el$79, "spellcheck", false);
-                    createRenderEffect(() => setAttribute(_el$79, "placeholder", modelFetchState() === "loading" ? "Fetching models…" : chatProviderMeta().requiresKey && !chatApiKey().trim() ? "Enter API key to load models" : chatProviderMeta().defaultModel || "model name"));
-                    createRenderEffect(() => _el$79.value = chatModel());
-                    return _el$79;
+                    var _el$104 = _tmpl$22();
+                    _el$104.$$input = (e) => setChatModel(e.currentTarget.value);
+                    setAttribute(_el$104, "spellcheck", false);
+                    createRenderEffect(() => setAttribute(_el$104, "placeholder", modelFetchState() === "loading" ? "Fetching models…" : chatProviderMeta().requiresKey && !chatApiKey().trim() ? "Enter API key to load models" : chatProviderMeta().defaultModel || "model name"));
+                    createRenderEffect(() => _el$104.value = chatModel());
+                    return _el$104;
                   })();
                 },
                 get children() {
-                  var _el$38 = _tmpl$4();
-                  _el$38.addEventListener("change", (e) => setChatModel(e.currentTarget.value));
-                  insert(_el$38, createComponent(For, {
+                  var _el$45 = _tmpl$5$1();
+                  _el$45.addEventListener("change", (e) => setChatModel(e.currentTarget.value));
+                  insert(_el$45, createComponent(For, {
                     get each() {
                       return providerModels();
                     },
                     children: (m) => (() => {
-                      var _el$80 = _tmpl$15();
-                      _el$80.value = m;
-                      insert(_el$80, m);
-                      return _el$80;
+                      var _el$105 = _tmpl$21();
+                      _el$105.value = m;
+                      insert(_el$105, m);
+                      return _el$105;
                     })()
                   }));
-                  createRenderEffect(() => _el$38.value = chatModel());
-                  return _el$38;
+                  createRenderEffect(() => _el$45.value = chatModel());
+                  return _el$45;
                 }
-              }), _el$39);
-              _el$39.$$click = doFetchModels;
-              insert(_el$35, createComponent(Show, {
+              }), _el$46);
+              _el$46.$$click = doFetchModels;
+              insert(_el$42, createComponent(Show, {
                 get when() {
                   return modelFetchState() === "error";
                 },
                 get children() {
-                  return _tmpl$5();
+                  return _tmpl$6$1();
                 }
               }), null);
-              createRenderEffect(() => _el$39.disabled = modelFetchState() === "loading");
-              return _el$35;
+              createRenderEffect(() => _el$46.disabled = modelFetchState() === "loading");
+              return _el$42;
             })(), createComponent(Show, {
               get when() {
                 return chatProviderMeta().needsBaseUrl || chatProviderId() === "custom";
               },
               get children() {
-                var _el$41 = _tmpl$7(), _el$42 = _el$41.firstChild, _el$43 = _el$42.nextSibling;
-                _el$43.$$input = (e) => setChatBaseUrl(e.currentTarget.value);
-                setAttribute(_el$43, "spellcheck", false);
-                createRenderEffect(() => setAttribute(_el$43, "placeholder", chatProviderMeta().defaultBaseUrl ?? "https://..."));
-                createRenderEffect(() => _el$43.value = chatBaseUrl());
-                return _el$41;
+                var _el$48 = _tmpl$8(), _el$49 = _el$48.firstChild, _el$50 = _el$49.nextSibling;
+                _el$50.$$input = (e) => setChatBaseUrl(e.currentTarget.value);
+                setAttribute(_el$50, "spellcheck", false);
+                createRenderEffect(() => setAttribute(_el$50, "placeholder", chatProviderMeta().defaultBaseUrl ?? "https://..."));
+                createRenderEffect(() => _el$50.value = chatBaseUrl());
+                return _el$48;
               }
             })];
           }
-        }), _el$44);
-        insert(_el$45, createComponent(Show, {
+        }), _el$51);
+        insert(_el$52, createComponent(Show, {
           get when() {
             return premiumActive();
           },
           get fallback() {
             return (() => {
-              var _el$81 = _tmpl$18(), _el$82 = _el$81.firstChild, _el$83 = _el$82.nextSibling, _el$84 = _el$83.firstChild, _el$85 = _el$84.nextSibling, _el$86 = _el$83.nextSibling;
-              _el$84.$$input = (e) => setPremiumEmail(e.currentTarget.value);
-              setAttribute(_el$84, "spellcheck", false);
-              _el$85.$$click = async () => {
+              var _el$106 = _tmpl$24(), _el$107 = _el$106.firstChild, _el$108 = _el$107.nextSibling, _el$109 = _el$108.firstChild, _el$110 = _el$109.nextSibling, _el$111 = _el$108.nextSibling;
+              _el$109.$$input = (e) => setPremiumEmail(e.currentTarget.value);
+              setAttribute(_el$109, "spellcheck", false);
+              _el$110.$$click = async () => {
                 setPremiumLoading(true);
                 setPremiumMessage(null);
                 try {
@@ -5335,54 +5806,54 @@ const Settings = () => {
                   setPremiumLoading(false);
                 }
               };
-              insert(_el$85, () => premiumLoading() ? "Checking..." : "Activate");
-              _el$86.$$click = () => {
+              insert(_el$110, () => premiumLoading() ? "Checking..." : "Activate");
+              _el$111.$$click = () => {
                 void window.vessel.premium.checkout(premiumEmail().trim() || void 0);
               };
-              insert(_el$81, createComponent(Show, {
+              insert(_el$106, createComponent(Show, {
                 get when() {
                   return premiumMessage();
                 },
                 children: (msg) => (() => {
-                  var _el$88 = _tmpl$19();
-                  insert(_el$88, () => msg().text);
+                  var _el$113 = _tmpl$25();
+                  insert(_el$113, () => msg().text);
                   createRenderEffect((_p$) => {
                     var _v$1 = !!(msg().kind === "success"), _v$10 = !!(msg().kind === "error");
-                    _v$1 !== _p$.e && _el$88.classList.toggle("success", _p$.e = _v$1);
-                    _v$10 !== _p$.t && _el$88.classList.toggle("error", _p$.t = _v$10);
+                    _v$1 !== _p$.e && _el$113.classList.toggle("success", _p$.e = _v$1);
+                    _v$10 !== _p$.t && _el$113.classList.toggle("error", _p$.t = _v$10);
                     return _p$;
                   }, {
                     e: void 0,
                     t: void 0
                   });
-                  return _el$88;
+                  return _el$113;
                 })()
               }), null);
-              insert(_el$81, createComponent(Show, {
+              insert(_el$106, createComponent(Show, {
                 get when() {
                   return premiumState().email || premiumEmail();
                 },
                 get children() {
-                  var _el$87 = _tmpl$17();
-                  _el$87.$$click = async () => {
+                  var _el$112 = _tmpl$23();
+                  _el$112.$$click = async () => {
                     const state = await window.vessel.premium.reset();
                     setPremiumState(state);
                     setPremiumEmail("");
                     setPremiumMessage(null);
                   };
-                  return _el$87;
+                  return _el$112;
                 }
               }), null);
-              createRenderEffect(() => _el$85.disabled = premiumLoading() || !premiumEmail().trim());
-              createRenderEffect(() => _el$84.value = premiumEmail());
-              return _el$81;
+              createRenderEffect(() => _el$110.disabled = premiumLoading() || !premiumEmail().trim());
+              createRenderEffect(() => _el$109.value = premiumEmail());
+              return _el$106;
             })();
           },
           get children() {
-            var _el$47 = _tmpl$8(), _el$48 = _el$47.firstChild;
-            _el$48.firstChild;
-            var _el$50 = _el$48.nextSibling, _el$51 = _el$50.nextSibling, _el$52 = _el$51.firstChild, _el$53 = _el$52.nextSibling;
-            insert(_el$48, createComponent(Show, {
+            var _el$54 = _tmpl$9(), _el$55 = _el$54.firstChild;
+            _el$55.firstChild;
+            var _el$57 = _el$55.nextSibling, _el$58 = _el$57.nextSibling, _el$59 = _el$58.firstChild, _el$60 = _el$59.nextSibling;
+            insert(_el$55, createComponent(Show, {
               get when() {
                 return premiumState().status === "trialing";
               },
@@ -5390,8 +5861,8 @@ const Settings = () => {
                 return [" ", "(Trial)"];
               }
             }), null);
-            insert(_el$50, () => premiumState().email, null);
-            insert(_el$50, createComponent(Show, {
+            insert(_el$57, () => premiumState().email, null);
+            insert(_el$57, createComponent(Show, {
               get when() {
                 return premiumState().expiresAt;
               },
@@ -5399,50 +5870,163 @@ const Settings = () => {
                 return [" ", "· Renews", " ", memo(() => new Date(premiumState().expiresAt).toLocaleDateString())];
               }
             }), null);
-            _el$52.$$click = () => {
+            _el$59.$$click = () => {
               void window.vessel.premium.portal();
             };
-            _el$53.$$click = async () => {
+            _el$60.$$click = async () => {
               const state = await window.vessel.premium.reset();
               setPremiumState(state);
               setPremiumEmail("");
               setPremiumMessage(null);
             };
-            return _el$47;
+            return _el$54;
           }
         }), null);
-        _el$57.$$click = () => setTelemetryEnabled(!telemetryEnabled());
-        _el$59.$$click = handleSave;
-        addEventListener(_el$60, "click", closeSettings);
+        insert(_el$63, createComponent(Show, {
+          get when() {
+            return !premiumActive();
+          },
+          get children() {
+            return _tmpl$0();
+          }
+        }), null);
+        insert(_el$62, createComponent(Show, {
+          get when() {
+            return premiumActive();
+          },
+          get fallback() {
+            return _tmpl$26();
+          },
+          get children() {
+            return [_tmpl$1(), createComponent(Show, {
+              get when() {
+                return vaultEntries().length > 0;
+              },
+              get children() {
+                var _el$67 = _tmpl$10();
+                insert(_el$67, createComponent(For, {
+                  get each() {
+                    return vaultEntries();
+                  },
+                  children: (entry) => (() => {
+                    var _el$115 = _tmpl$27(), _el$116 = _el$115.firstChild, _el$117 = _el$116.firstChild, _el$118 = _el$117.nextSibling, _el$119 = _el$118.firstChild, _el$120 = _el$116.nextSibling;
+                    insert(_el$117, () => entry.label);
+                    insert(_el$118, () => entry.username, _el$119);
+                    insert(_el$118, () => entry.domainPattern, null);
+                    insert(_el$118, createComponent(Show, {
+                      get when() {
+                        return entry.useCount > 0;
+                      },
+                      get children() {
+                        return [" ", "· Used ", memo(() => entry.useCount), "x"];
+                      }
+                    }), null);
+                    _el$120.$$click = () => handleVaultRemove(entry.id);
+                    return _el$115;
+                  })()
+                }));
+                return _el$67;
+              }
+            }), createComponent(Show, {
+              get when() {
+                return !vaultAdding();
+              },
+              get children() {
+                var _el$68 = _tmpl$11();
+                _el$68.$$click = () => {
+                  setVaultAdding(true);
+                  setVaultMessage(null);
+                };
+                return _el$68;
+              }
+            }), createComponent(Show, {
+              get when() {
+                return vaultAdding();
+              },
+              get children() {
+                var _el$69 = _tmpl$12(), _el$70 = _el$69.firstChild, _el$71 = _el$70.nextSibling, _el$72 = _el$71.nextSibling, _el$73 = _el$72.nextSibling, _el$74 = _el$73.nextSibling, _el$75 = _el$74.nextSibling, _el$76 = _el$75.nextSibling, _el$77 = _el$76.firstChild, _el$78 = _el$77.nextSibling;
+                _el$70.$$input = (e) => setVaultNewLabel(e.currentTarget.value);
+                setAttribute(_el$70, "spellcheck", false);
+                _el$71.$$input = (e) => setVaultNewDomain(e.currentTarget.value);
+                setAttribute(_el$71, "spellcheck", false);
+                _el$72.$$input = (e) => setVaultNewUsername(e.currentTarget.value);
+                setAttribute(_el$72, "spellcheck", false);
+                _el$73.$$input = (e) => setVaultNewPassword(e.currentTarget.value);
+                _el$74.$$input = (e) => setVaultNewTotp(e.currentTarget.value);
+                setAttribute(_el$74, "spellcheck", false);
+                _el$75.$$input = (e) => setVaultNewNotes(e.currentTarget.value);
+                setAttribute(_el$75, "spellcheck", false);
+                _el$77.$$click = handleVaultAdd;
+                _el$78.$$click = () => {
+                  setVaultAdding(false);
+                  setVaultNewLabel("");
+                  setVaultNewDomain("");
+                  setVaultNewUsername("");
+                  setVaultNewPassword("");
+                  setVaultNewTotp("");
+                  setVaultNewNotes("");
+                };
+                createRenderEffect(() => _el$70.value = vaultNewLabel());
+                createRenderEffect(() => _el$71.value = vaultNewDomain());
+                createRenderEffect(() => _el$72.value = vaultNewUsername());
+                createRenderEffect(() => _el$73.value = vaultNewPassword());
+                createRenderEffect(() => _el$74.value = vaultNewTotp());
+                createRenderEffect(() => _el$75.value = vaultNewNotes());
+                return _el$69;
+              }
+            }), createComponent(Show, {
+              get when() {
+                return vaultMessage();
+              },
+              children: (msg) => (() => {
+                var _el$121 = _tmpl$25();
+                insert(_el$121, () => msg().text);
+                createRenderEffect((_p$) => {
+                  var _v$11 = !!(msg().kind === "success"), _v$12 = !!(msg().kind === "error");
+                  _v$11 !== _p$.e && _el$121.classList.toggle("success", _p$.e = _v$11);
+                  _v$12 !== _p$.t && _el$121.classList.toggle("error", _p$.t = _v$12);
+                  return _p$;
+                }, {
+                  e: void 0,
+                  t: void 0
+                });
+                return _el$121;
+              })()
+            })];
+          }
+        }), null);
+        _el$82.$$click = () => setTelemetryEnabled(!telemetryEnabled());
+        _el$84.$$click = handleSave;
+        addEventListener(_el$85, "click", closeSettings);
         insert(_el$2, createComponent(Show, {
           get when() {
             return status();
           },
           children: (currentStatus) => (() => {
-            var _el$89 = _tmpl$19();
-            insert(_el$89, () => currentStatus().text);
+            var _el$122 = _tmpl$25();
+            insert(_el$122, () => currentStatus().text);
             createRenderEffect((_p$) => {
-              var _v$11 = !!(currentStatus().kind === "success"), _v$12 = !!(currentStatus().kind === "error");
-              _v$11 !== _p$.e && _el$89.classList.toggle("success", _p$.e = _v$11);
-              _v$12 !== _p$.t && _el$89.classList.toggle("error", _p$.t = _v$12);
+              var _v$13 = !!(currentStatus().kind === "success"), _v$14 = !!(currentStatus().kind === "error");
+              _v$13 !== _p$.e && _el$122.classList.toggle("success", _p$.e = _v$13);
+              _v$14 !== _p$.t && _el$122.classList.toggle("error", _p$.t = _v$14);
               return _p$;
             }, {
               e: void 0,
               t: void 0
             });
-            return _el$89;
+            return _el$122;
           })()
         }), null);
         createRenderEffect((_p$) => {
           var _v$ = !!autoRestoreSession(), _v$2 = autoRestoreSession(), _v$3 = !!clearBookmarksOnLaunch(), _v$4 = clearBookmarksOnLaunch(), _v$5 = !!chatEnabled(), _v$6 = chatEnabled(), _v$7 = !!telemetryEnabled(), _v$8 = telemetryEnabled();
-          _v$ !== _p$.e && _el$21.classList.toggle("on", _p$.e = _v$);
-          _v$2 !== _p$.t && setAttribute(_el$21, "aria-checked", _p$.t = _v$2);
-          _v$3 !== _p$.a && _el$24.classList.toggle("on", _p$.a = _v$3);
-          _v$4 !== _p$.o && setAttribute(_el$24, "aria-checked", _p$.o = _v$4);
-          _v$5 !== _p$.i && _el$28.classList.toggle("on", _p$.i = _v$5);
-          _v$6 !== _p$.n && setAttribute(_el$28, "aria-checked", _p$.n = _v$6);
-          _v$7 !== _p$.s && _el$57.classList.toggle("on", _p$.s = _v$7);
-          _v$8 !== _p$.h && setAttribute(_el$57, "aria-checked", _p$.h = _v$8);
+          _v$ !== _p$.e && _el$28.classList.toggle("on", _p$.e = _v$);
+          _v$2 !== _p$.t && setAttribute(_el$28, "aria-checked", _p$.t = _v$2);
+          _v$3 !== _p$.a && _el$31.classList.toggle("on", _p$.a = _v$3);
+          _v$4 !== _p$.o && setAttribute(_el$31, "aria-checked", _p$.o = _v$4);
+          _v$5 !== _p$.i && _el$35.classList.toggle("on", _p$.i = _v$5);
+          _v$6 !== _p$.n && setAttribute(_el$35, "aria-checked", _p$.n = _v$6);
+          _v$7 !== _p$.s && _el$82.classList.toggle("on", _p$.s = _v$7);
+          _v$8 !== _p$.h && setAttribute(_el$82, "aria-checked", _p$.h = _v$8);
           return _p$;
         }, {
           e: void 0,
@@ -5454,16 +6038,154 @@ const Settings = () => {
           s: void 0,
           h: void 0
         });
-        createRenderEffect(() => _el$7.value = defaultUrl());
-        createRenderEffect(() => _el$0.value = mcpPort());
-        createRenderEffect(() => _el$15.value = obsidianVaultPath());
-        createRenderEffect(() => _el$18.value = agentTranscriptMode());
+        createRenderEffect(() => _el$12.value = defaultUrl());
+        createRenderEffect(() => _el$15.value = mcpPort());
+        createRenderEffect(() => _el$22.value = obsidianVaultPath());
+        createRenderEffect(() => _el$25.value = agentTranscriptMode());
         return _el$;
-      })(), _tmpl$0()];
+      })(), _tmpl$14()];
     }
   });
 };
 delegateEvents(["click", "keydown", "input"]);
+var _tmpl$$1 = /* @__PURE__ */ template(`<div class=command-bar-overlay><div class=keyboard-help><div class=keyboard-help-header><h2 class=keyboard-help-title>Keyboard Shortcuts</h2><button class=keyboard-help-close><kbd>Esc</kbd></button></div><div class=keyboard-help-grid>`), _tmpl$2$1 = /* @__PURE__ */ template(`<style>
+        .keyboard-help {
+          width: min(380px, calc(100vw - 32px));
+          background: var(--bg-elevated);
+          border: 1px solid var(--border-visible);
+          border-radius: 14px;
+          padding: 24px;
+          box-shadow:
+            0 4px 24px rgba(0, 0, 0, 0.2),
+            0 24px 64px rgba(0, 0, 0, 0.3),
+            inset 0 1px 0 rgba(255, 255, 255, 0.04);
+          animation: command-bar-enter 350ms var(--ease-out-expo) both;
+        }
+        .keyboard-help-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-bottom: 20px;
+        }
+        .keyboard-help-title {
+          font-size: 15px;
+          font-weight: 600;
+          color: var(--text-primary);
+          margin: 0;
+        }
+        .keyboard-help-close {
+          background: transparent;
+          border: none;
+          cursor: pointer;
+          padding: 0;
+        }
+        .keyboard-help-close kbd {
+          background: rgba(255, 255, 255, 0.06);
+          border: 1px solid rgba(255, 255, 255, 0.08);
+          padding: 2px 8px;
+          border-radius: 4px;
+          font-size: 11px;
+          color: var(--text-muted);
+          font-family: var(--font-ui);
+        }
+        .keyboard-help-close:hover kbd {
+          background: rgba(255, 255, 255, 0.1);
+          color: var(--text-secondary);
+        }
+        .keyboard-help-grid {
+          display: grid;
+          grid-template-columns: auto 1fr;
+          gap: 10px 20px;
+          align-items: center;
+        }
+        .keyboard-help-keys {
+          display: flex;
+          align-items: center;
+          gap: 2px;
+          justify-self: end;
+        }
+        .keyboard-help-keys kbd {
+          display: inline-block;
+          min-width: 24px;
+          padding: 3px 7px;
+          text-align: center;
+          font-size: 11px;
+          font-family: var(--font-mono);
+          font-weight: 500;
+          background: rgba(255, 255, 255, 0.06);
+          border: 1px solid rgba(255, 255, 255, 0.08);
+          border-radius: 4px;
+          color: var(--text-primary);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
+        }
+        .keyboard-help-plus {
+          font-size: 10px;
+          color: var(--text-muted);
+          margin: 0 1px;
+        }
+        .keyboard-help-action {
+          font-size: 13px;
+          color: var(--text-secondary);
+        }
+      `), _tmpl$3 = /* @__PURE__ */ template(`<div class=keyboard-help-keys>`), _tmpl$4 = /* @__PURE__ */ template(`<div class=keyboard-help-action>`), _tmpl$5 = /* @__PURE__ */ template(`<kbd>`), _tmpl$6 = /* @__PURE__ */ template(`<span class=keyboard-help-plus>+`);
+const SHORTCUTS = [{
+  keys: "Ctrl+L",
+  action: "AI Command Bar"
+}, {
+  keys: "Ctrl+Shift+L",
+  action: "Toggle AI Sidebar"
+}, {
+  keys: "Ctrl+Shift+F",
+  action: "Toggle Focus Mode"
+}, {
+  keys: "F12",
+  action: "Toggle Dev Tools Panel"
+}, {
+  keys: "Ctrl+T",
+  action: "New Tab"
+}, {
+  keys: "Ctrl+W",
+  action: "Close Tab"
+}, {
+  keys: "Ctrl+,",
+  action: "Settings"
+}, {
+  keys: "Ctrl+H",
+  action: "Capture Highlight"
+}, {
+  keys: "?",
+  action: "This help overlay"
+}];
+const KeyboardHelp = (props) => {
+  return createComponent(Show, {
+    get when() {
+      return props.open;
+    },
+    get children() {
+      return [(() => {
+        var _el$ = _tmpl$$1(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$3.nextSibling;
+        addEventListener(_el$, "click", props.onClose);
+        _el$2.$$click = (e) => e.stopPropagation();
+        addEventListener(_el$5, "click", props.onClose);
+        insert(_el$6, () => SHORTCUTS.map((s) => [(() => {
+          var _el$8 = _tmpl$3();
+          insert(_el$8, () => s.keys.split("+").map((k, i) => [i > 0 && _tmpl$6(), (() => {
+            var _el$0 = _tmpl$5();
+            insert(_el$0, k);
+            return _el$0;
+          })()]));
+          return _el$8;
+        })(), (() => {
+          var _el$9 = _tmpl$4();
+          insert(_el$9, () => s.action);
+          return _el$9;
+        })()]));
+        return _el$;
+      })(), _tmpl$2$1()];
+    }
+  });
+};
+delegateEvents(["click"]);
 function setupKeybindings(handlers) {
   const listener = (e) => {
     const ctrl = e.ctrlKey || e.metaKey;
@@ -5507,6 +6229,14 @@ function setupKeybindings(handlers) {
       handlers.toggleDevTools?.();
       return;
     }
+    if (e.key === "?" && !ctrl && !e.altKey) {
+      const tag = e.target?.tagName;
+      if (tag !== "INPUT" && tag !== "TEXTAREA" && !e.target?.isContentEditable) {
+        e.preventDefault();
+        handlers.toggleKeyboardHelp?.();
+        return;
+      }
+    }
   };
   document.addEventListener("keydown", listener);
   return () => document.removeEventListener("keydown", listener);
@@ -5528,6 +6258,7 @@ const App = () => {
     activeTab
   } = useTabs();
   const [highlightToast, setHighlightToast] = createSignal(null);
+  const [keyboardHelpOpen, setKeyboardHelpOpen] = createSignal(false);
   const captureHighlight = async () => {
     try {
       const result = await window.vessel.highlights.capture();
@@ -5579,7 +6310,8 @@ const App = () => {
       captureHighlight,
       toggleDevTools: () => {
         window.vessel.devtoolsPanel.toggle();
-      }
+      },
+      toggleKeyboardHelp: () => setKeyboardHelpOpen((v) => !v)
     });
     const cleanupCapture = window.vessel.highlights.onCaptureResult(showHighlightResult);
     onCleanup(() => {
@@ -5618,6 +6350,12 @@ const App = () => {
     }), null);
     insert(_el$, createComponent(CommandBar, {}), null);
     insert(_el$, createComponent(Settings, {}), null);
+    insert(_el$, createComponent(KeyboardHelp, {
+      get open() {
+        return keyboardHelpOpen();
+      },
+      onClose: () => setKeyboardHelpOpen(false)
+    }), null);
     createRenderEffect(() => _el$.classList.toggle("focus-mode", !!focusMode2()));
     return _el$;
   })();