clankerbend 0.1.0 → 0.1.2

package/host/src/codex-desktop-renderer-bridge.js

@@ -1,7 +1,7 @@
 (function installCodexVimNavigator() {
   const VIM_NAV_APP_ID = "onewill.vim-nav";
-  const BRIDGE_VERSION = 112;
-  const RUNTIME_KEY = "__oneWhackRuntime";
+  const BRIDGE_VERSION = 115;
+  const RUNTIME_KEY = "__clankerbendRuntime";
   const STYLE_ID = "codex-vim-nav-style";
   const ANNOTATION_CLASS = "codex-vim-nav-annotation";
   const ANCHOR_CLASS = "codex-vim-nav-anchor";
@@ -9,10 +9,11 @@
   const HIGHLIGHT_CLASS = "codex-vim-nav-highlight";
   const STATUS_CHROME_CLASS = "codex-vim-nav-status-chrome";
   const MODE_BADGE_ID = "codex-vim-nav-mode-badge";
-  const HOST_UI_CLASS = "onewhack-host-ui";
-  const SELECTION_MENU_ID = "onewhack-selection-menu";
-  const OVERLAY_ID = "onewhack-anchored-overlay";
-  const COMPOSER_CHIPS_ID = "onewhack-composer-chips";
+  const HOST_UI_CLASS = "clankerbend-host-ui";
+  const SELECTION_MENU_ID = "clankerbend-selection-menu";
+  const ACCOUNT_SWITCHER_ID = "clankerbend-account-switcher";
+  const OVERLAY_ID = "clankerbend-anchored-overlay";
+  const COMPOSER_CHIPS_ID = "clankerbend-composer-chips";
   const SELECTOR = [
     "[data-content-search-unit-key]",
     "[data-turn-key]",
@@ -20,7 +21,7 @@
     "[data-thread-user-message-navigation-item-id]"
   ].join(",");
 
-  const existingBridge = oneWhackRuntime().getBridge(VIM_NAV_APP_ID);
+  const existingBridge = clankerbendRuntime().getBridge(VIM_NAV_APP_ID);
   if (existingBridge?.name === "vim-nav" && existingBridge?.version === BRIDGE_VERSION) {
     return existingBridge.snapshot();
   }
@@ -36,9 +37,9 @@
     vimMode: false,
     helpOpen: false,
     badgeHidden: readBadgeHidden(),
-    ctrlDown: false,
+    metaDown: false,
     altDown: false,
-    ctrlAltToggleDown: false,
+    metaAltToggleDown: false,
     pendingKeys: "",
     countPrefix: "",
     anchorOrder: [],
@@ -60,11 +61,19 @@
     lastBottomJump: null,
     lastOrderFallback: null,
     commandChain: Promise.resolve(),
+    relativeMoveInFlight: false,
+    pendingRelativeDelta: 0,
     hostState: null,
     hostEvents: [],
     activeTextSelection: null,
     lastSelectionMenuAt: 0,
     renderedOverlaySignature: null,
+    accountUiStatus: "",
+    accountAddOpen: false,
+    accountAddLabel: "",
+    accountManageOpen: false,
+    accountPendingAdoptId: null,
+    accountPendingDeleteId: null,
     pendingComposerSubmission: null,
     submittedComposerSubmissions: []
   };
@@ -119,6 +128,7 @@
         color: #241f12 !important;
       }
       #${OVERLAY_ID} button,
+      #${ACCOUNT_SWITCHER_ID} button,
       #${COMPOSER_CHIPS_ID} button {
         appearance: none !important;
         border: 0 !important;
@@ -129,6 +139,202 @@
         font: 650 12px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
         padding: 7px 8px !important;
       }
+      #${ACCOUNT_SWITCHER_ID} {
+        display: grid !important;
+        gap: 7px !important;
+        min-width: 220px !important;
+        max-width: 320px !important;
+        border-top: 1px solid rgba(148, 163, 184, .24) !important;
+        border-bottom: 1px solid rgba(148, 163, 184, .18) !important;
+        margin: 5px 0 !important;
+        padding: 8px 4px !important;
+        color: inherit !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-head {
+        display: flex !important;
+        align-items: center !important;
+        justify-content: space-between !important;
+        gap: 8px !important;
+        padding: 0 6px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-title {
+        color: currentColor !important;
+        font: 700 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+        letter-spacing: 0 !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-status {
+        color: color-mix(in srgb, currentColor 62%, transparent) !important;
+        font: 500 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-list {
+        display: grid !important;
+        gap: 2px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-row {
+        display: grid !important;
+        grid-template-columns: minmax(0, 1fr) auto !important;
+        align-items: center !important;
+        gap: 5px !important;
+        border-radius: 6px !important;
+        padding: 2px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-row.is-active {
+        background: rgba(143, 199, 212, .14) !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-main {
+        display: grid !important;
+        min-width: 0 !important;
+        border-radius: 5px !important;
+        padding: 6px !important;
+        text-align: left !important;
+        color: inherit !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-main:hover,
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-icon:hover {
+        background: rgba(148, 163, 184, .16) !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-label,
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-meta {
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-label {
+        font: 650 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-meta {
+        color: color-mix(in srgb, currentColor 58%, transparent) !important;
+        font: 500 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-icon {
+        width: 28px !important;
+        height: 28px !important;
+        display: inline-grid !important;
+        place-items: center !important;
+        border-radius: 5px !important;
+        color: color-mix(in srgb, currentColor 76%, transparent) !important;
+        padding: 0 !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-actions {
+        display: grid !important;
+        grid-template-columns: 1fr 1fr !important;
+        gap: 4px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-actions button {
+        border-radius: 5px !important;
+        background: rgba(148, 163, 184, .12) !important;
+        color: inherit !important;
+        min-width: 0 !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-add-form {
+        display: grid !important;
+        gap: 6px !important;
+        border-radius: 6px !important;
+        background: rgba(148, 163, 184, .10) !important;
+        padding: 6px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-add-form input {
+        width: 100% !important;
+        min-width: 0 !important;
+        border: 1px solid rgba(148, 163, 184, .32) !important;
+        border-radius: 5px !important;
+        background: rgba(0, 0, 0, .18) !important;
+        color: inherit !important;
+        font: 500 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+        outline: none !important;
+        padding: 7px 8px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-add-form input:focus {
+        border-color: rgba(143, 199, 212, .76) !important;
+        box-shadow: 0 0 0 2px rgba(143, 199, 212, .18) !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-add-actions {
+        display: grid !important;
+        grid-template-columns: 1fr 1fr !important;
+        gap: 4px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-add-actions button {
+        background: rgba(148, 163, 184, .14) !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage {
+        display: grid !important;
+        gap: 7px !important;
+        border-top: 1px solid rgba(148, 163, 184, .18) !important;
+        padding-top: 7px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-head {
+        display: flex !important;
+        align-items: baseline !important;
+        justify-content: space-between !important;
+        gap: 8px !important;
+        padding: 0 6px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-head strong {
+        font: 700 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-head span {
+        color: color-mix(in srgb, currentColor 58%, transparent) !important;
+        font: 500 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-list {
+        display: grid !important;
+        gap: 6px !important;
+        max-height: 204px !important;
+        overflow-y: auto !important;
+        overscroll-behavior: contain !important;
+        padding-right: 2px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-list::-webkit-scrollbar {
+        width: 8px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-list::-webkit-scrollbar-thumb {
+        border-radius: 999px !important;
+        background: rgba(148, 163, 184, .34) !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-row {
+        display: grid !important;
+        grid-template-columns: minmax(0, 1fr) auto !important;
+        align-items: center !important;
+        gap: 7px !important;
+        border-radius: 6px !important;
+        background: rgba(148, 163, 184, .10) !important;
+        padding: 6px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-title {
+        display: grid !important;
+        min-width: 0 !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-title strong,
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-title span {
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-title strong {
+        font: 650 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-title span {
+        color: color-mix(in srgb, currentColor 58%, transparent) !important;
+        font: 500 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-actions {
+        display: flex !important;
+        align-items: center !important;
+        justify-content: flex-end !important;
+        gap: 4px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} .clankerbend-account-manage-actions button {
+        background: rgba(148, 163, 184, .14) !important;
+        white-space: nowrap !important;
+        padding: 6px 7px !important;
+      }
+      #${ACCOUNT_SWITCHER_ID} button:disabled {
+        cursor: default !important;
+        opacity: .55 !important;
+      }
       #${OVERLAY_ID} {
         position: fixed !important;
         z-index: 2147483004 !important;
@@ -159,7 +365,7 @@
         font: 13px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
         padding: 9px !important;
       }
-      #${OVERLAY_ID} .onewhack-overlay-actions {
+      #${OVERLAY_ID} .clankerbend-overlay-actions {
         display: flex !important;
         justify-content: flex-end !important;
         gap: 6px !important;
@@ -168,6 +374,10 @@
         background: rgba(80, 65, 20, .78) !important;
         color: #fff7d7 !important;
       }
+      #${OVERLAY_ID} button.clankerbend-overlay-secondary {
+        background: transparent !important;
+        color: rgba(58, 45, 12, .82) !important;
+      }
       #${COMPOSER_CHIPS_ID} {
         position: absolute !important;
         z-index: 2147483002 !important;
@@ -180,7 +390,7 @@
       #${COMPOSER_CHIPS_ID}.is-visible {
         display: flex !important;
       }
-      #${COMPOSER_CHIPS_ID} .onewhack-context-chip {
+      #${COMPOSER_CHIPS_ID} .clankerbend-context-chip {
         display: inline-flex !important;
         align-items: center !important;
         gap: 5px !important;
@@ -194,7 +404,7 @@
         padding: 5px 8px !important;
         pointer-events: auto !important;
       }
-      .onewhack-submitted-context-row .onewhack-context-chip {
+      .clankerbend-submitted-context-row .clankerbend-context-chip {
         display: inline-flex !important;
         align-items: center !important;
         gap: 5px !important;
@@ -206,24 +416,24 @@
         font: 600 12px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
         padding: 5px 8px !important;
       }
-      .onewhack-submitted-context-row .onewhack-context-chip::before {
+      .clankerbend-submitted-context-row .clankerbend-context-chip::before {
         content: "□" !important;
         color: #8a7327 !important;
         font-size: 10px !important;
         line-height: 1 !important;
       }
-      #${COMPOSER_CHIPS_ID} .onewhack-context-chip::before {
+      #${COMPOSER_CHIPS_ID} .clankerbend-context-chip::before {
         content: "□" !important;
         color: #8a7327 !important;
         font-size: 10px !important;
         line-height: 1 !important;
       }
-      #${COMPOSER_CHIPS_ID} .onewhack-context-chip span {
+      #${COMPOSER_CHIPS_ID} .clankerbend-context-chip span {
         overflow: hidden !important;
         text-overflow: ellipsis !important;
         white-space: nowrap !important;
       }
-      #${COMPOSER_CHIPS_ID} .onewhack-context-chip button {
+      #${COMPOSER_CHIPS_ID} .clankerbend-context-chip button {
         padding: 0 2px !important;
         color: #725f20 !important;
       }
@@ -380,7 +590,7 @@
     const titleRow = document.createElement("div");
     titleRow.className = "codex-vim-nav-title-row";
     const title = document.createElement("strong");
-    title.textContent = "OneWill VimNav";
+    title.textContent = "VimNav";
     const mode = document.createElement("span");
     mode.className = "codex-vim-nav-state";
     mode.textContent = `[${state.vimMode ? "ON" : "OFF"}]`;
@@ -388,7 +598,7 @@
     dismiss.type = "button";
     dismiss.className = "codex-vim-nav-dismiss";
     dismiss.textContent = "x";
-    dismiss.title = "Hide VimNav badge until Ctrl-Alt";
+    dismiss.title = "Hide VimNav badge until Cmd-Option";
     dismiss.addEventListener("click", (event) => {
       event.preventDefault();
       event.stopPropagation();
@@ -403,12 +613,23 @@
     helpButton.className = "codex-vim-nav-help-toggle";
     helpButton.textContent = "?";
     helpButton.title = "Toggle VimNav help";
-    helpButton.addEventListener("click", (event) => {
+    const activateHelp = (event) => {
       event.preventDefault();
       event.stopPropagation();
+      event.stopImmediatePropagation?.();
+      if (event.type === "click" && helpButton.dataset.clankerbendPressed === "true") {
+        helpButton.dataset.clankerbendPressed = "";
+        return;
+      }
+      if (event.type !== "click" && helpButton.dataset.clankerbendPressed === "true") return;
+      if (event.type !== "click") helpButton.dataset.clankerbendPressed = "true";
       toggleHelp();
-    });
-    toggleRow.append("(Ctrl-Alt toggles, ", helpButton, " for help)");
+    };
+    helpButton.addEventListener("pointerdown", activateHelp);
+    helpButton.addEventListener("mousedown", activateHelp);
+    helpButton.addEventListener("touchstart", activateHelp, { passive: false });
+    helpButton.addEventListener("click", activateHelp);
+    toggleRow.append("(Cmd-Option toggles, ", helpButton, " for help)");
     badge.appendChild(toggleRow);
     if (buffer) {
       const row = document.createElement("div");
@@ -1297,13 +1518,13 @@
       if (!(el instanceof HTMLElement)) continue;
       el.classList.add(ANCHOR_CLASS);
       el.classList.toggle(CURRENT_CLASS, item.anchorId === state.currentAnchorId);
-      let label = el.querySelector(`.${ANNOTATION_CLASS}[data-anchor-id="${cssEscape(item.anchorId)}"][data-onewhack-app-id="${VIM_NAV_APP_ID}"]`);
+      let label = el.querySelector(`.${ANNOTATION_CLASS}[data-anchor-id="${cssEscape(item.anchorId)}"][data-clankerbend-app-id="${VIM_NAV_APP_ID}"]`);
       if (!label) {
         label = document.createElement("button");
         label.type = "button";
         label.className = ANNOTATION_CLASS;
         label.dataset.anchorId = item.anchorId;
-        label.dataset.onewhackAppId = VIM_NAV_APP_ID;
+        label.dataset.clankerbendAppId = VIM_NAV_APP_ID;
         label.addEventListener("click", (event) => {
           event.preventDefault();
           event.stopImmediatePropagation();
@@ -1318,10 +1539,10 @@
       }
       label.textContent = markerGlyph(item);
       label.title = item.indexed
-        ? `Vim Nav ${item.order}: ${item.inferredRole || item.kind}`
-        : `Vim Nav index pending: ${item.inferredRole || item.kind}`;
+        ? `VimNav ${item.order}: ${item.inferredRole || item.kind}`
+        : `VimNav index pending: ${item.inferredRole || item.kind}`;
       label.setAttribute("aria-label", label.title);
-      oneWhackRuntime().placeAnnotation?.(el, {
+      clankerbendRuntime().placeAnnotation?.(el, {
         appId: VIM_NAV_APP_ID,
         anchorId: item.anchorId,
         markerId: `vim-nav:${item.anchorId}`,
@@ -1329,9 +1550,9 @@
         element: label
       }) || el.insertAdjacentElement("afterbegin", label);
     }
-    oneWhackRuntime().removeAnnotations?.(VIM_NAV_APP_ID, ids);
-    document.querySelectorAll(`.${ANNOTATION_CLASS}[data-onewhack-app-id="${VIM_NAV_APP_ID}"]`).forEach((node) => {
-      if (!ids.has(node.dataset.anchorId) && !node.closest(".onewhack-transcript-annotation-slot")) node.remove();
+    clankerbendRuntime().removeAnnotations?.(VIM_NAV_APP_ID, ids);
+    document.querySelectorAll(`.${ANNOTATION_CLASS}[data-clankerbend-app-id="${VIM_NAV_APP_ID}"]`).forEach((node) => {
+      if (!ids.has(node.dataset.anchorId) && !node.closest(".clankerbend-transcript-annotation-slot")) node.remove();
     });
   }
 
@@ -1429,123 +1650,6 @@
     });
   }
 
-  async function jumpRelativeMountedAcrossGap(delta, currentOrder, beforeAnchorId) {
-    const targetIndex = currentOrder - 1 + delta;
-    const indexedTarget = await mountTargetForIndex(targetIndex, delta, {
-      approximate: true,
-      preferExact: true
-    });
-    if (indexedTarget && indexedTarget.anchorId !== beforeAnchorId) {
-      setCurrent(indexedTarget.anchorId, "adapter", indexedTarget.order - 1);
-      return scrollToAnchor(indexedTarget.anchorId, {
-        behavior: "auto",
-        block: "start",
-        indexHint: indexedTarget.order - 1
-      });
-    }
-
-    for (let attempt = 0; attempt < 5; attempt += 1) {
-      const mounted = anchors().sort((a, b) => a.order - b.order);
-      const adjacent = delta < 0
-        ? [...mounted].reverse().find((item) => item.order < currentOrder && item.anchorId !== beforeAnchorId)
-        : mounted.find((item) => item.order > currentOrder && item.anchorId !== beforeAnchorId);
-      if (adjacent) {
-        setCurrent(adjacent.anchorId, "adapter", adjacent.order - 1);
-        return scrollToAnchor(adjacent.anchorId, {
-          behavior: "auto",
-          block: blockForAnchorVisibility(adjacent.anchorId, "start"),
-          indexHint: adjacent.order - 1
-        });
-      }
-      await delay(90);
-    }
-
-    const searchRoot = () => findScrollContainer() || nearestScrollContainer(anchorElements()[0] || findAnchor(state.currentAnchorId) || document.body);
-    let root = searchRoot();
-    const viewport = Math.min(root.clientHeight || window.innerHeight || 720, 1200);
-    const step = delta < 0
-      ? Math.max(520, viewport * 1.45)
-      : Math.max(520, Math.min(viewport, 900) * 1.35);
-    const attempts = [];
-    for (let attempt = 0; attempt < 18; attempt += 1) {
-      root = searchRoot();
-      const beforeTop = scrollTopOf(root);
-      scrollRootTo(root, scrollTopForViewportDelta(root, delta < 0 ? -step : step));
-      await delay(80);
-      const mounted = anchors().sort((a, b) => a.order - b.order);
-      const target = delta < 0
-        ? [...mounted].reverse().find((item) =>
-          item.order < currentOrder && item.anchorId !== beforeAnchorId
-        )
-        : mounted.find((item) =>
-          item.order > currentOrder && item.anchorId !== beforeAnchorId
-        );
-      attempts.push({
-        attempt,
-        beforeTop: Math.round(beforeTop),
-        afterTop: Math.round(scrollTopOf(root)),
-        mounted: mounted.map((item) => item.order)
-      });
-      state.lastMountSearch = { mode: "relative-mounted-gap", direction: delta, currentOrder, attempts: attempts.slice(-5) };
-      if (target) {
-        setCurrent(target.anchorId, "adapter", target.order - 1);
-        return scrollToAnchor(target.anchorId, {
-          behavior: "auto",
-          block: "start",
-          indexHint: target.order - 1
-        });
-      }
-      if (Math.abs(scrollTopOf(root) - beforeTop) <= 1) break;
-    }
-    if (delta > 0) {
-      root = searchRoot();
-      scrollRootTo(root, scrollRootRange(root).max);
-      await delay(120);
-      const mounted = anchors().sort((a, b) => a.order - b.order);
-      const target = mounted.find((item) =>
-        item.order > currentOrder && item.anchorId !== beforeAnchorId
-      ) || mounted[mounted.length - 1];
-      if (target && target.anchorId !== beforeAnchorId && target.order > currentOrder) {
-        setCurrent(target.anchorId, "adapter", target.order - 1);
-        return scrollToAnchor(target.anchorId, {
-          behavior: "auto",
-          block: "start",
-          indexHint: target.order - 1
-        });
-      }
-    }
-    if (delta > 0 && currentOrder < lastKnownIndex() + 1) {
-      return jumpToBottom();
-    }
-    if (delta < 0 && currentOrder > 1) {
-      return jumpToIndex(0, { block: "start", direction: -1, behavior: "auto" });
-    }
-    return jumpRelativeMounted(delta);
-  }
-
-  function renderedCurrentOrder() {
-    const desiredTop = topVisibleInset() + 8;
-    const visibleMarker = Array.from(document.querySelectorAll(`.${ANNOTATION_CLASS}`))
-      .map((marker) => {
-        const rect = marker.getBoundingClientRect();
-        return {
-          order: Number(marker.textContent.trim()),
-          top: rect.top,
-          bottom: rect.bottom
-        };
-      })
-      .filter((item) =>
-        Number.isSafeInteger(item.order) &&
-        item.bottom >= topVisibleInset() &&
-        item.top <= viewportSafeBottom()
-      )
-      .sort((a, b) => Math.abs(a.top - desiredTop) - Math.abs(b.top - desiredTop))[0];
-    if (visibleMarker) return visibleMarker.order;
-    const currentMarker = document.querySelector(`.${CURRENT_CLASS} .${ANNOTATION_CLASS}`);
-    const currentValue = Number(currentMarker?.textContent?.trim());
-    return Number.isSafeInteger(currentValue) ? currentValue : null;
-  }
-
   function mountedFloorTargetForIndex(index) {
     const visible = viewportVisibleAnchors(anchors()).sort((a, b) => a.order - b.order);
     const visibleExact = visible.find((item) => item.order - 1 === index);
@@ -1791,59 +1895,56 @@
     });
   }
 
-  async function jumpRelative(delta) {
-    const visible = viewportVisibleAnchors(anchors());
-    const currentVisible = state.currentAnchorId ? isAnchorViewportVisible(state.currentAnchorId) : false;
+  function jumpRelativeFast(delta) {
+    if (!hasAppServerOrder()) return jumpRelativeMounted(delta);
+    const startIndex = currentIndex();
+    const targetIndex = startIndex + delta;
+    const lastIndex = lastKnownIndex();
+    if (targetIndex < 0 || targetIndex > lastIndex) {
+      state.lastRelativeDebug = {
+        delta,
+        path: "edge",
+        startIndex,
+        targetIndex,
+        lastIndex
+      };
+      return {
+        ok: true,
+        noop: true,
+        edge: delta < 0 ? "top" : "bottom",
+        anchorId: state.currentAnchorId
+      };
+    }
+    const targetId = state.anchorOrder[targetIndex] || state.anchorIdByIndex[targetIndex] || null;
     const mounted = anchors().sort((a, b) => a.order - b.order);
-    const selectedIsMounted = Boolean(state.currentAnchorId && mounted.some((item) => item.anchorId === state.currentAnchorId));
-    if (!visible.length && !currentVisible) {
-      return jumpRelativeMounted(delta);
-    }
-    if (!currentVisible && visible.length && !selectedIsMounted) {
-      const target = delta < 0
-        ? visible.sort((a, b) => a.viewportTop - b.viewportTop)[0]
-        : visible.sort((a, b) => b.viewportBottom - a.viewportBottom)[0];
-      if (target) setCurrent(target.anchorId, "adapter", target.order - 1);
-    }
-    const renderedOrder = renderedCurrentOrder();
-    const selectedOrder = state.currentAnchorId ? anchorNumber(state.currentAnchorId) : null;
-    const currentAnchorOrder = selectedIsMounted ? selectedOrder : renderedOrder || selectedOrder;
-    const currentOrder = currentAnchorOrder != null && currentAnchorOrder <= state.anchorOrder.length
-      ? currentAnchorOrder
-      : Number.isInteger(state.currentIndexValue) ? state.currentIndexValue + 1 : null;
-    const adjacentMounted = delta < 0
-      ? [...mounted].reverse().find((item) => item.order < currentOrder && item.anchorId !== state.currentAnchorId)
-      : mounted.find((item) => item.order > currentOrder && item.anchorId !== state.currentAnchorId);
+    const target = targetId
+      ? mounted.find((item) => item.anchorId === targetId)
+      : mounted.find((item) => item.order - 1 === targetIndex);
     state.lastRelativeDebug = {
       delta,
-      renderedOrder,
-      currentAnchorOrder,
-      currentOrder,
-      currentAnchorId: state.currentAnchorId,
-      selectedIsMounted,
-      adjacent: adjacentMounted ? { order: adjacentMounted.order, anchorId: adjacentMounted.anchorId } : null,
+      path: "fast",
+      startIndex,
+      targetIndex,
+      target: target ? { order: target.order, anchorId: target.anchorId } : null,
       mounted: mounted.map((item) => item.order)
     };
-    if (adjacentMounted) {
-      setCurrent(adjacentMounted.anchorId, "adapter", adjacentMounted.order - 1);
-      return scrollToAnchor(adjacentMounted.anchorId, {
+    if (!target || !findAnchor(target.anchorId)) {
+      return jumpToIndex(targetIndex, {
+        block: "start",
+        direction: delta,
         behavior: "auto",
-        block: blockForAnchorVisibility(adjacentMounted.anchorId, "start"),
-        indexHint: adjacentMounted.order - 1
+        approximate: true,
+        preferExact: true,
+        resolveMissing: "floor-on-overshoot",
+        skipScrollIfResolvedFloor: true
       });
     }
-    const beforeAnchorId = state.currentAnchorId;
-    if (delta < 0) {
-      return jumpRelativeMountedAcrossGap(delta, currentOrder, beforeAnchorId);
-    }
-    const beforeIndex = currentIndex();
-    const result = await jumpToIndex(beforeIndex + delta, { block: "start", direction: delta, behavior: "auto" });
-    const afterIndex = state.anchorOrder.indexOf(state.currentAnchorId);
-    const moved = result?.ok &&
-      state.currentAnchorId !== beforeAnchorId &&
-      (delta < 0 ? afterIndex < beforeIndex : afterIndex > beforeIndex);
-    if (moved) return result;
-    return jumpRelativeMountedAcrossGap(delta, currentOrder, beforeAnchorId);
+    setCurrent(target.anchorId, "adapter", target.order - 1);
+    return scrollToAnchor(target.anchorId, {
+      behavior: "auto",
+      block: "start",
+      indexHint: target.order - 1
+    });
   }
 
   function jumpToNumberIndex(requested) {
@@ -2173,14 +2274,14 @@
     return new Promise((resolve) => setTimeout(resolve, ms));
   }
 
-  function oneWhackRuntime() {
+  function clankerbendRuntime() {
     if (window[RUNTIME_KEY]?.registerApp) return window[RUNTIME_KEY];
     const runtime = {
       protocolVersion: null,
       hostUrl: null,
       apps: {},
       registerApp(app) {
-        if (!app?.appId) throw new Error("OneWhack appId is required");
+        if (!app?.appId) throw new Error("ClankerBend appId is required");
         const current = this.apps[app.appId] || {};
         const currentVersion = Number(current.bridge?.version);
         const nextVersion = Number(app.bridge?.version);
@@ -2191,7 +2292,7 @@
           Number.isFinite(nextVersion) &&
           nextVersion < currentVersion
         ) {
-          throw new Error("OneWhack app bridge version regressed for " + app.appId);
+          throw new Error("ClankerBend app bridge version regressed for " + app.appId);
         }
         const slot = {
           ...current,
@@ -2234,6 +2335,8 @@
 
   function applyHostState(hostState) {
     state.hostState = hostState || null;
+    settleAccountUiStatus();
+    renderCodexAccountSwitcher();
     renderSelectionMenu();
     renderOverlay();
     renderComposerContextChips();
@@ -2242,6 +2345,430 @@
     return { ok: true };
   }
 
+  function settleAccountUiStatus() {
+    if (state.accountUiStatus !== "Saving default...") return;
+    if (state.hostState?.codexAccounts?.switching) return;
+    state.accountUiStatus = "Default saved";
+    setTimeout(() => {
+      if (state.accountUiStatus !== "Default saved") return;
+      state.accountUiStatus = "";
+      renderCodexAccountSwitcher();
+    }, 1400);
+  }
+
+  function codexAccountsState() {
+    return state.hostState?.codexAccounts || null;
+  }
+
+  function visibleElement(el) {
+    if (!(el instanceof HTMLElement)) return false;
+    if (!el.isConnected) return false;
+    if (isHostUiElement(el)) return false;
+    const rect = el.getBoundingClientRect();
+    if (rect.width <= 0 || rect.height <= 0) return false;
+    const style = getComputedStyle(el);
+    return style.visibility !== "hidden" && style.display !== "none";
+  }
+
+  function normalizedText(el) {
+    return String(el?.innerText || el?.textContent || "").replace(/\s+/g, " ").trim();
+  }
+
+  function findLogoutMenuItem() {
+    const candidates = Array.from(document.querySelectorAll("button,a,[role='menuitem'],[role='button']"))
+      .filter(visibleElement)
+      .map((el) => {
+        const text = normalizedText(el);
+        const label = [text, el.getAttribute("aria-label"), el.getAttribute("title")].filter(Boolean).join(" ");
+        return { el, label };
+      })
+      .filter((candidate) => /\b(log\s*out|logout|sign\s*out)\b/i.test(candidate.label));
+    return candidates
+      .map((candidate) => candidate.el.closest?.("button,a,[role='menuitem']") || candidate.el)
+      .find((el) => el instanceof HTMLElement && visibleElement(el)) || null;
+  }
+
+  function accountMenuInsertionParent(logoutItem) {
+    if (!(logoutItem instanceof HTMLElement)) return null;
+    for (let node = logoutItem.parentElement; node && node !== document.body && node !== document.documentElement; node = node.parentElement) {
+      if (isHostUiElement(node)) return null;
+      const rect = node.getBoundingClientRect();
+      if (rect.width < 150 || rect.width > 520 || rect.height < 40 || rect.height > window.innerHeight * 0.9) continue;
+      if (node.contains(logoutItem)) return node;
+    }
+    return logoutItem.parentElement;
+  }
+
+  function accountMenuInsertionReference(parent, logoutItem) {
+    if (!(parent instanceof HTMLElement) || !(logoutItem instanceof HTMLElement)) return null;
+    let reference = logoutItem;
+    while (reference?.parentElement && reference.parentElement !== parent) {
+      reference = reference.parentElement;
+    }
+    return reference?.parentElement === parent ? reference : null;
+  }
+
+  function accountUiSignature(accountsState) {
+    const accounts = accountsState?.accounts || [];
+    return JSON.stringify({
+      active: accountsState?.activeAccountId || null,
+      def: accountsState?.clankerbendDefaultAccountId || null,
+      switching: Boolean(accountsState?.switching),
+      status: state.accountUiStatus,
+      addOpen: state.accountAddOpen,
+      manageOpen: state.accountManageOpen,
+      pendingAdopt: state.accountPendingAdoptId,
+      pendingDelete: state.accountPendingDeleteId,
+      accounts: accounts.map((account) => [
+        account.id,
+        account.kind,
+        account.label,
+        account.codexHome,
+        account.auth?.authJson ? 1 : 0,
+        account.backup ? 1 : 0
+      ])
+    });
+  }
+
+  function renderCodexAccountSwitcher() {
+    const accountsState = codexAccountsState();
+    const logoutItem = findLogoutMenuItem();
+    if (!accountsState?.available || !logoutItem) {
+      document.getElementById(ACCOUNT_SWITCHER_ID)?.remove();
+      return;
+    }
+
+    const parent = accountMenuInsertionParent(logoutItem);
+    if (!(parent instanceof HTMLElement)) return;
+    const reference = accountMenuInsertionReference(parent, logoutItem);
+    if (!(reference instanceof HTMLElement)) return;
+    let ui = document.getElementById(ACCOUNT_SWITCHER_ID);
+    if (ui && ui.parentElement !== parent) {
+      ui.remove();
+      ui = null;
+    }
+    if (!ui) {
+      ui = document.createElement("div");
+      ui.id = ACCOUNT_SWITCHER_ID;
+      ui.className = HOST_UI_CLASS;
+      stopNativeMenuPropagation(ui);
+      parent.insertBefore(ui, reference);
+    } else if (ui.nextElementSibling !== reference) {
+      parent.insertBefore(ui, reference);
+    }
+
+    const signature = accountUiSignature(accountsState);
+    if (ui.dataset.signature === signature) return;
+    ui.dataset.signature = signature;
+    ui.replaceChildren();
+
+    const head = document.createElement("div");
+    head.className = "clankerbend-account-head";
+    const title = document.createElement("div");
+    title.className = "clankerbend-account-title";
+    title.textContent = "ClankerID";
+    const status = document.createElement("div");
+    status.className = "clankerbend-account-status";
+    status.textContent = state.accountUiStatus || (accountsState.switching ? "Switching..." : `${accountsState.accounts?.length || 0}/${accountsState.maxAccounts || 20}`);
+    head.append(title, status);
+    ui.appendChild(head);
+
+    if (state.accountManageOpen) {
+      ui.appendChild(renderCodexAccountManage(accountsState));
+    } else {
+      const list = document.createElement("div");
+      list.className = "clankerbend-account-list";
+      for (const account of accountsState.accounts || []) {
+        list.appendChild(renderCodexAccountRow(account, accountsState));
+      }
+      ui.appendChild(list);
+    }
+
+    const actions = document.createElement("div");
+    actions.className = "clankerbend-account-actions";
+    const add = document.createElement("button");
+    add.type = "button";
+    add.textContent = "Add account";
+    add.disabled = Boolean(accountsState.switching) || (accountsState.accounts?.length || 0) >= (accountsState.maxAccounts || 20);
+    bindInjectedActivation(add, () => {
+      state.accountAddOpen = true;
+      state.accountUiStatus = "";
+      renderCodexAccountSwitcher();
+      setTimeout(() => {
+        document.querySelector(`#${ACCOUNT_SWITCHER_ID} input[data-clankerbend-account-label]`)?.focus?.({ preventScroll: true });
+      }, 0);
+    });
+    const manage = document.createElement("button");
+    manage.type = "button";
+    manage.textContent = state.accountManageOpen ? "Done" : "Manage";
+    bindInjectedActivation(manage, () => {
+      state.accountManageOpen = !state.accountManageOpen;
+      state.accountPendingAdoptId = null;
+      state.accountPendingDeleteId = null;
+      state.accountUiStatus = "";
+      renderCodexAccountSwitcher();
+    });
+    actions.append(add, manage);
+    ui.appendChild(actions);
+    if (state.accountAddOpen) ui.appendChild(renderCodexAccountAddForm(accountsState));
+  }
+
+  function renderCodexAccountAddForm(accountsState) {
+    const form = document.createElement("div");
+    form.className = "clankerbend-account-add-form";
+
+    const input = document.createElement("input");
+    input.type = "text";
+    input.dataset.clankerbendAccountLabel = "true";
+    input.placeholder = "Account label";
+    input.value = state.accountAddLabel || "";
+    input.autocomplete = "off";
+    input.spellcheck = false;
+    const stopInputEvent = (event) => {
+      event.stopPropagation();
+      event.stopImmediatePropagation?.();
+    };
+    input.addEventListener("pointerdown", stopInputEvent, true);
+    input.addEventListener("mousedown", stopInputEvent, true);
+    input.addEventListener("click", stopInputEvent, true);
+    input.addEventListener("input", () => {
+      state.accountAddLabel = input.value;
+    });
+    input.addEventListener("keydown", (event) => {
+      event.stopPropagation();
+      event.stopImmediatePropagation?.();
+      if (event.key === "Enter") {
+        event.preventDefault();
+        submitCodexAccountAdd(input.value);
+      } else if (event.key === "Escape") {
+        event.preventDefault();
+        cancelCodexAccountAdd();
+      }
+    }, true);
+
+    const buttons = document.createElement("div");
+    buttons.className = "clankerbend-account-add-actions";
+    const cancel = document.createElement("button");
+    cancel.type = "button";
+    cancel.textContent = "Cancel";
+    bindInjectedActivation(cancel, cancelCodexAccountAdd);
+    const create = document.createElement("button");
+    create.type = "button";
+    create.textContent = "Create";
+    create.disabled = Boolean(accountsState.switching);
+    bindInjectedActivation(create, () => submitCodexAccountAdd(input.value));
+    buttons.append(cancel, create);
+    form.append(input, buttons);
+    return form;
+  }
+
+  function cancelCodexAccountAdd() {
+    state.accountAddOpen = false;
+    state.accountAddLabel = "";
+    state.accountUiStatus = "";
+    renderCodexAccountSwitcher();
+  }
+
+  function submitCodexAccountAdd(rawLabel) {
+    const label = String(rawLabel || "").trim();
+    if (!label) {
+      state.accountUiStatus = "Label required";
+      renderCodexAccountSwitcher();
+      setTimeout(() => {
+        if (state.accountUiStatus !== "Label required") return;
+        state.accountUiStatus = "";
+        renderCodexAccountSwitcher();
+      }, 1400);
+      return;
+    }
+    state.accountAddOpen = false;
+    state.accountAddLabel = "";
+    state.accountUiStatus = "Creating...";
+    renderCodexAccountSwitcher();
+    enqueueHostEvent({ kind: "codexAccountCreateAndSwitch", label });
+  }
+
+  function renderCodexAccountManage(accountsState) {
+    const wrap = document.createElement("div");
+    wrap.className = "clankerbend-account-manage";
+    const head = document.createElement("div");
+    head.className = "clankerbend-account-manage-head";
+    const title = document.createElement("strong");
+    title.textContent = "Manage profiles";
+    const count = document.createElement("span");
+    const managed = (accountsState.accounts || []).filter((account) => account.kind === "managed");
+    count.textContent = `${managed.length} managed`;
+    head.append(title, count);
+    wrap.appendChild(head);
+    const list = document.createElement("div");
+    list.className = "clankerbend-account-manage-list";
+    if (!managed.length) {
+      const row = document.createElement("div");
+      row.className = "clankerbend-account-manage-row";
+      const title = document.createElement("div");
+      title.className = "clankerbend-account-manage-title";
+      const strong = document.createElement("strong");
+      strong.textContent = "No managed accounts";
+      const hint = document.createElement("span");
+      hint.textContent = "Create one with Add account.";
+      title.append(strong, hint);
+      row.appendChild(title);
+      list.appendChild(row);
+      wrap.appendChild(list);
+      return wrap;
+    }
+    for (const account of managed) list.appendChild(renderCodexAccountManageRow(account, accountsState));
+    wrap.appendChild(list);
+    return wrap;
+  }
+
+  function renderCodexAccountManageRow(account, accountsState) {
+    const row = document.createElement("div");
+    row.className = "clankerbend-account-manage-row";
+    row.title = accountCodexHomeTitle(account);
+    const title = document.createElement("div");
+    title.className = "clankerbend-account-manage-title";
+    const strong = document.createElement("strong");
+    strong.textContent = account.label || account.id;
+    const hint = document.createElement("span");
+    const pendingAdopt = state.accountPendingAdoptId === account.id;
+    const pendingDelete = state.accountPendingDeleteId === account.id;
+    hint.textContent = pendingAdopt
+      ? "Replace ~/.codex with this profile; current primary is backed up."
+      : pendingDelete
+        ? "Hide this profile and move its files to archive storage."
+        : [account.auth?.authJson ? "signed in" : "not signed in", account.backup ? "backup" : ""].filter(Boolean).join(" · ");
+    title.append(strong, hint);
+
+    const actions = document.createElement("div");
+    actions.className = "clankerbend-account-manage-actions";
+    const adopt = document.createElement("button");
+    adopt.type = "button";
+    adopt.textContent = pendingAdopt ? "Replace ~/.codex" : "Make primary";
+    adopt.title = "Make this the primary Codex home";
+    adopt.disabled = Boolean(accountsState.switching);
+    bindInjectedActivation(adopt, () => {
+      if (!pendingAdopt) {
+        state.accountPendingAdoptId = account.id;
+        state.accountPendingDeleteId = null;
+        state.accountUiStatus = "";
+        renderCodexAccountSwitcher();
+        return;
+      }
+      state.accountUiStatus = "Making primary...";
+      state.accountPendingAdoptId = null;
+      renderCodexAccountSwitcher();
+      enqueueHostEvent({ kind: "codexAccountAdoptAsPrimary", accountId: account.id });
+    });
+
+    const remove = document.createElement("button");
+    remove.type = "button";
+    remove.textContent = pendingDelete ? "Archive profile" : "Archive";
+    remove.title = "Archive this managed profile";
+    remove.disabled = Boolean(accountsState.switching) || account.id === accountsState.activeAccountId;
+    bindInjectedActivation(remove, () => {
+      if (!pendingDelete) {
+        state.accountPendingDeleteId = account.id;
+        state.accountPendingAdoptId = null;
+        state.accountUiStatus = "";
+        renderCodexAccountSwitcher();
+        return;
+      }
+      state.accountUiStatus = "Archiving...";
+      state.accountPendingDeleteId = null;
+      renderCodexAccountSwitcher();
+      enqueueHostEvent({ kind: "codexAccountDelete", accountId: account.id });
+    });
+
+    actions.append(adopt, remove);
+    row.append(title, actions);
+    return row;
+  }
+
+  function stopNativeMenuPropagation(el) {
+    const stop = (event) => {
+      event.stopPropagation();
+      event.stopImmediatePropagation?.();
+    };
+    el.addEventListener("pointerdown", stop);
+    el.addEventListener("mousedown", stop);
+    el.addEventListener("touchstart", stop, { passive: false });
+    el.addEventListener("click", stop);
+  }
+
+  function bindInjectedActivation(button, handler) {
+    let lastRunAt = 0;
+    const run = (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      event.stopImmediatePropagation?.();
+      if (button.disabled) return;
+      const now = Date.now();
+      if (now - lastRunAt < 450) return;
+      lastRunAt = now;
+      handler(event);
+    };
+    button.addEventListener("pointerdown", run, true);
+    button.addEventListener("mousedown", run, true);
+    button.addEventListener("touchstart", run, { capture: true, passive: false });
+    button.addEventListener("click", run, true);
+  }
+
+  function renderCodexAccountRow(account, accountsState) {
+    const row = document.createElement("div");
+    row.className = `clankerbend-account-row${account.id === accountsState.activeAccountId ? " is-active" : ""}`;
+
+    const main = document.createElement("button");
+    main.type = "button";
+    main.className = "clankerbend-account-main";
+    main.disabled = Boolean(accountsState.switching) || account.id === accountsState.activeAccountId;
+    main.title = [
+      account.id === accountsState.activeAccountId ? "Current Codex account profile" : `Switch to ${account.label || account.id}`,
+      accountCodexHomeTitle(account)
+    ].filter(Boolean).join("\n");
+    bindInjectedActivation(main, () => {
+      if (account.id === accountsState.activeAccountId) return;
+      state.accountUiStatus = "Switching...";
+      renderCodexAccountSwitcher();
+      enqueueHostEvent({ kind: "codexAccountSwitch", accountId: account.id });
+    });
+
+    const label = document.createElement("span");
+    label.className = "clankerbend-account-label";
+    label.textContent = account.label || account.id;
+    const meta = document.createElement("span");
+    meta.className = "clankerbend-account-meta";
+    meta.textContent = [
+      account.kind,
+      account.id === accountsState.clankerbendDefaultAccountId ? "default" : "",
+      account.auth?.authJson ? "signed in" : "not signed in"
+    ].filter(Boolean).join(" · ");
+    main.append(label, meta);
+
+    const def = document.createElement("button");
+    def.type = "button";
+    def.className = "clankerbend-account-icon";
+    def.textContent = account.id === accountsState.clankerbendDefaultAccountId ? "✓" : "☆";
+    def.setAttribute("aria-label", account.id === accountsState.clankerbendDefaultAccountId ? "Launches by default" : "Launch by default");
+    def.title = [
+      account.id === accountsState.clankerbendDefaultAccountId ? "Launches by default" : "Launch by default",
+      accountCodexHomeTitle(account)
+    ].filter(Boolean).join("\n");
+    def.disabled = Boolean(accountsState.switching) || account.id === accountsState.clankerbendDefaultAccountId;
+    bindInjectedActivation(def, () => {
+      state.accountUiStatus = "Saving default...";
+      renderCodexAccountSwitcher();
+      enqueueHostEvent({ kind: "codexAccountSetDefault", accountId: account.id });
+    });
+
+    row.append(main, def);
+    return row;
+  }
+
+  function accountCodexHomeTitle(account) {
+    return account?.codexHome ? `CODEX_HOME: ${account.codexHome}` : "";
+  }
+
   function hostSelectionActions() {
     return (state.hostState?.selectionActions || [])
       .filter((action) => action?.enabled !== false && action.appliesTo === "text-selection");
@@ -2332,7 +2859,7 @@
   function hideSelectionMenu() {
     const menu = document.getElementById(SELECTION_MENU_ID);
     menu?.remove();
-    document.querySelectorAll("[data-onewhack-native-selection-action='true']").forEach((node) => node.remove());
+    document.querySelectorAll("[data-clankerbend-native-selection-action='true']").forEach((node) => node.remove());
   }
 
   function selectionPayloadForAction(action, selection) {
@@ -2419,7 +2946,7 @@
 
   function extendNativeSelectionToolbar(toolbar, target) {
     if (!(toolbar instanceof HTMLElement)) return;
-    toolbar.dataset.onewhackNativeSelectionToolbar = "true";
+    toolbar.dataset.clankerbendNativeSelectionToolbar = "true";
     toolbar.style.setProperty("display", "inline-flex", "important");
     toolbar.style.setProperty("align-items", "center", "important");
     toolbar.style.setProperty("flex-wrap", "nowrap", "important");
@@ -2465,7 +2992,7 @@
       triggerSelectionAction(action, selection);
     };
     button.type = "button";
-    button.dataset.onewhackNativeSelectionAction = "true";
+    button.dataset.clankerbendNativeSelectionAction = "true";
     button.textContent = nativeSelectionButtonLabel(action);
     button.title = action.label || action.type;
     button.style.cssText = [
@@ -2503,7 +3030,7 @@
   function injectNativeSelectionActions(selection, actions) {
     const toolbar = nativeSelectionToolbar();
     if (!toolbar) return false;
-    document.querySelectorAll("[data-onewhack-native-selection-action='true']").forEach((node) => node.remove());
+    document.querySelectorAll("[data-clankerbend-native-selection-action='true']").forEach((node) => node.remove());
     const target = nativeSelectionInsertionTarget(toolbar);
     extendNativeSelectionToolbar(toolbar, target);
     const referenceButton = nativeSelectionReferenceButton(toolbar);
@@ -2525,7 +3052,7 @@
     const actions = hostSelectionActions();
     if (!selection || !actions.length) {
       menu?.remove();
-      document.querySelectorAll("[data-onewhack-native-selection-action='true']").forEach((node) => node.remove());
+      document.querySelectorAll("[data-clankerbend-native-selection-action='true']").forEach((node) => node.remove());
       return;
     }
     if (injectNativeSelectionActions(selection, actions)) {
@@ -2563,8 +3090,8 @@
   }
 
   function overlayFieldValues(el) {
-    return Object.fromEntries([...el.querySelectorAll("[data-onewhack-field-id]")]
-      .map((input) => [input.dataset.onewhackFieldId, input.value || ""]));
+    return Object.fromEntries([...el.querySelectorAll("[data-clankerbend-field-id]")]
+      .map((input) => [input.dataset.clankerbendFieldId, input.value || ""]));
   }
 
   function positionOverlay(el, overlay) {
@@ -2613,13 +3140,13 @@
       return;
     }
     const currentValues = overlayFieldValues(el);
-    const activeFieldId = document.activeElement?.dataset?.onewhackFieldId || null;
+    const activeFieldId = document.activeElement?.dataset?.clankerbendFieldId || null;
     const fields = (overlay.fields || []).map((field) => {
       const input = field.kind === "textarea" ? document.createElement("textarea") : document.createElement("input");
       input.name = field.fieldId;
       input.placeholder = field.label || field.fieldId;
       input.value = currentValues[field.fieldId] ?? field.value ?? "";
-      input.dataset.onewhackFieldId = field.fieldId;
+      input.dataset.clankerbendFieldId = field.fieldId;
       return input;
     });
     const titleText = String(overlay.title || "").trim();
@@ -2627,14 +3154,22 @@
     const title = titleText && titleText !== firstFieldLabel ? document.createElement("strong") : null;
     if (title) title.textContent = titleText;
     const actions = document.createElement("div");
-    actions.className = "onewhack-overlay-actions";
+    actions.className = "clankerbend-overlay-actions";
     for (const action of overlay.actions || []) {
       const button = document.createElement("button");
       button.type = "button";
       button.textContent = action.label || "Apply";
+      button.className = action.type === "overlay.close" ? "clankerbend-overlay-secondary" : "clankerbend-overlay-primary";
       button.addEventListener("click", () => {
-        const values = Object.fromEntries([...el.querySelectorAll("[data-onewhack-field-id]")]
-          .map((input) => [input.dataset.onewhackFieldId, input.value || ""]));
+        if (action.type === "overlay.close") {
+          enqueueHostEvent({
+            kind: "overlayClose",
+            overlayId: overlay.overlayId
+          });
+          return;
+        }
+        const values = Object.fromEntries([...el.querySelectorAll("[data-clankerbend-field-id]")]
+          .map((input) => [input.dataset.clankerbendFieldId, input.value || ""]));
         enqueueHostEvent({
           kind: "appAction",
           appId: overlay.appId,
@@ -2653,7 +3188,7 @@
     el.classList.add("is-visible");
     positionOverlay(el, overlay);
     const activeField = activeFieldId
-      ? [...el.querySelectorAll("[data-onewhack-field-id]")].find((field) => field.dataset.onewhackFieldId === activeFieldId)
+      ? [...el.querySelectorAll("[data-clankerbend-field-id]")].find((field) => field.dataset.clankerbendFieldId === activeFieldId)
       : null;
     const firstField = fields.find((field) => field instanceof HTMLTextAreaElement || field instanceof HTMLInputElement);
     setTimeout(() => focusOverlayField(activeField || firstField), 0);
@@ -2738,7 +3273,7 @@
     }
     el.replaceChildren(...items.map((item) => {
       const chip = document.createElement("div");
-      chip.className = "onewhack-context-chip";
+      chip.className = "clankerbend-context-chip";
       const label = document.createElement("span");
       label.textContent = item.label || item.body || item.itemId;
       chip.title = item.body || item.label || item.itemId;
@@ -2817,10 +3352,10 @@
     return true;
   }
 
-  function oneWhackSubmitPrompt(submission) {
+  function clankerbendSubmitPrompt(submission) {
     const lines = [
-      `[[ONEWHACK_CONTEXT:${submission.submissionId}]]`,
-      "Use these OneWhack sticky notes as context. Do not mention the marker."
+      `[[CLANKERBEND_CONTEXT:${submission.submissionId}]]`,
+      "Use these ClankerBend sticky notes as context. Do not mention the marker."
     ];
     for (const [index, item] of submission.items.entries()) {
       const selected = item.range?.quote || item.range?.text || item.label || "";
@@ -2841,16 +3376,16 @@
       }
     }
     lines.push(
-      `[[/ONEWHACK_CONTEXT:${submission.submissionId}]]`,
+      `[[/CLANKERBEND_CONTEXT:${submission.submissionId}]]`,
       "",
-      submission.userText || "Use the OneWhack context above."
+      submission.userText || "Use the ClankerBend context above."
     );
     return lines.join("\n");
   }
 
   function submittedChipRow(submission) {
     const row = document.createElement("div");
-    row.className = "onewhack-submitted-context-row";
+    row.className = "clankerbend-submitted-context-row";
     row.style.cssText = [
       "display:flex",
       "flex-wrap:wrap",
@@ -2859,7 +3394,7 @@
     ].join(";");
     for (const item of submission.items) {
       const chip = document.createElement("span");
-      chip.className = "onewhack-context-chip";
+      chip.className = "clankerbend-context-chip";
       chip.textContent = item.label || item.body || item.itemId;
       chip.title = item.body || item.label || item.itemId;
       row.appendChild(chip);
@@ -2870,15 +3405,15 @@
   function maskSubmittedComposerContexts() {
     if (!state.submittedComposerSubmissions.length) return;
     for (const submission of state.submittedComposerSubmissions) {
-      const marker = `[[ONEWHACK_CONTEXT:${submission.submissionId}]]`;
+      const marker = `[[CLANKERBEND_CONTEXT:${submission.submissionId}]]`;
       const candidates = Array.from(document.querySelectorAll("main *, [role='main'] *, body *"))
         .filter((el) => el instanceof HTMLElement && !isHostUiElement(el))
         .filter((el) => (el.innerText || el.textContent || "").includes(marker))
         .filter((el) => !Array.from(el.children || []).some((child) => (child.innerText || child.textContent || "").includes(marker)))
         .sort((a, b) => (a.textContent || "").length - (b.textContent || "").length);
       const target = candidates[0];
-      if (!target || target.dataset.onewhackMaskedSubmission === submission.submissionId) continue;
-      target.dataset.onewhackMaskedSubmission = submission.submissionId;
+      if (!target || target.dataset.clankerbendMaskedSubmission === submission.submissionId) continue;
+      target.dataset.clankerbendMaskedSubmission = submission.submissionId;
       const prompt = document.createElement("span");
       prompt.textContent = submission.userText || "";
       target.replaceChildren(submittedChipRow(submission), prompt);
@@ -2904,7 +3439,7 @@
       items: items.map((item) => ({ ...item })),
       submittedAt: Date.now()
     };
-    const nextText = oneWhackSubmitPrompt(submission);
+    const nextText = clankerbendSubmitPrompt(submission);
     if (!setComposerText(input, nextText)) return false;
     state.pendingComposerSubmission = submission;
     state.submittedComposerSubmissions = [...state.submittedComposerSubmissions, submission].slice(-8);
@@ -2941,22 +3476,22 @@
   }
 
   function installComposerSubmitInterceptor() {
-    if (window.__oneWhackComposerSubmitInterceptorInstalled) return;
-    window.__oneWhackComposerSubmitInterceptorInstalled = true;
-    window.__oneWhackComposerSubmitClickHandler = (event) => {
+    if (window.__clankerbendComposerSubmitInterceptorInstalled) return;
+    window.__clankerbendComposerSubmitInterceptorInstalled = true;
+    window.__clankerbendComposerSubmitClickHandler = (event) => {
       if (isComposerSubmitButton(event.target)) prepareComposerContextForSubmit();
     };
-    window.__oneWhackComposerSubmitKeyHandler = (event) => {
+    window.__clankerbendComposerSubmitKeyHandler = (event) => {
       if (event.key !== "Enter" || event.shiftKey || event.altKey || event.ctrlKey || event.metaKey) return;
       const input = composerInputElement();
       if (input && (event.target === input || input.contains?.(event.target))) prepareComposerContextForSubmit();
     };
-    document.addEventListener("click", window.__oneWhackComposerSubmitClickHandler, true);
-    document.addEventListener("keydown", window.__oneWhackComposerSubmitKeyHandler, true);
+    document.addEventListener("click", window.__clankerbendComposerSubmitClickHandler, true);
+    document.addEventListener("keydown", window.__clankerbendComposerSubmitKeyHandler, true);
   }
 
-  function oneWhackAppUrl() {
-    return String(oneWhackRuntime().getEntryUrl(VIM_NAV_APP_ID) || "").trim();
+  function clankerbendAppUrl() {
+    return String(clankerbendRuntime().getEntryUrl(VIM_NAV_APP_ID) || "").trim();
   }
 
   async function ensureNativeBrowserPanel() {
@@ -3010,8 +3545,8 @@
   }
 
   async function doOpenPanel() {
-    const serverUrl = oneWhackAppUrl().replace(/\/$/, "");
-    if (!serverUrl) return { ok: false, error: "OneWhack host URL missing" };
+    const serverUrl = clankerbendAppUrl().replace(/\/$/, "");
+    if (!serverUrl) return { ok: false, error: "ClankerBend host URL missing" };
     const panelUrl = `${serverUrl}/`;
     const webviews = () => Array.from(document.querySelectorAll("webview, iframe"));
     const normalizedSrc = (el) => String(el.getAttribute("src") || "")
@@ -3076,7 +3611,7 @@
         : null;
     };
     const installPanelIframe = async () => {
-      const existing = document.getElementById("onewhack-vim-nav-side-panel-frame");
+      const existing = document.getElementById("clankerbend-vim-nav-side-panel-frame");
       if (existing) {
         existing.setAttribute("src", panelUrl);
         await delay(300);
@@ -3109,10 +3644,10 @@
       if (!input && !/new tab|start browsing|enter a url|browser/i.test(panelText)) return null;
       if (getComputedStyle(panel).position === "static") panel.style.position = "relative";
       const frame = document.createElement("iframe");
-      frame.id = "onewhack-vim-nav-side-panel-frame";
+      frame.id = "clankerbend-vim-nav-side-panel-frame";
       frame.src = panelUrl;
-      frame.title = "Vim Nav";
-      frame.setAttribute("data-onewhack-panel-frame", VIM_NAV_APP_ID);
+      frame.title = "VimNav";
+      frame.setAttribute("data-clankerbend-panel-frame", VIM_NAV_APP_ID);
       frame.style.cssText = [
         "position:absolute",
         "left:0",
@@ -3154,12 +3689,12 @@
     if (!browserUrlInput() && !localServerButton()) {
       return { ok: false, error: "native Browser panel controls not found", debug: panelDebug({ stage: "no-controls" }) };
     }
-    return { ok: false, error: "native Browser panel did not navigate to Vim Nav", debug: panelDebug({ stage: "not-navigated" }) };
+    return { ok: false, error: "native Browser panel did not navigate to VimNav", debug: panelDebug({ stage: "not-navigated" }) };
   }
 
   function shouldIgnoreKey(event) {
+    if (effectiveCommandOption(event)) return false;
     if (event.metaKey) return true;
-    if (effectiveCtrlAlt(event)) return false;
     if (state.vimMode) return false;
     if (event.defaultPrevented) return true;
     if (event.ctrlKey || event.altKey) return true;
@@ -3170,25 +3705,25 @@
   }
 
   function isModifierOnlyKey(event) {
-    return event.key === "Control" ||
+    return event.key === "Meta" ||
       event.key === "Alt" ||
-      event.code === "ControlLeft" ||
-      event.code === "ControlRight" ||
+      event.code === "MetaLeft" ||
+      event.code === "MetaRight" ||
       event.code === "AltLeft" ||
       event.code === "AltRight";
   }
 
   function updateModifierState(event, isDown) {
-    if (event.key === "Control" || event.code === "ControlLeft" || event.code === "ControlRight") {
-      state.ctrlDown = Boolean(isDown);
+    if (event.key === "Meta" || event.code === "MetaLeft" || event.code === "MetaRight") {
+      state.metaDown = Boolean(isDown);
     }
     if (event.key === "Alt" || event.code === "AltLeft" || event.code === "AltRight") {
       state.altDown = Boolean(isDown);
     }
   }
 
-  function effectiveCtrlAlt(event) {
-    return Boolean((event.ctrlKey && event.altKey) || (state.ctrlDown && state.altDown));
+  function effectiveCommandOption(event) {
+    return Boolean((event.metaKey && event.altKey) || (state.metaDown && state.altDown));
   }
 
   function digitFromKeyEvent(event) {
@@ -3228,12 +3763,44 @@
           return null;
         });
     };
-    if (effectiveCtrlAlt(event)) {
+    const runRelativeCommand = (name, delta, commandForDelta) => {
+      if (state.relativeMoveInFlight) {
+        state.pendingRelativeDelta = Math.max(-1, Math.min(1, state.pendingRelativeDelta + Math.sign(delta)));
+        state.lastCommandResult = { name, pending: true, pendingRelativeDelta: state.pendingRelativeDelta };
+        ensureModeBadge();
+        return;
+      }
+      const prefixBefore = state.countPrefix;
+      state.relativeMoveInFlight = true;
+      state.commandChain = state.commandChain
+        .catch(() => {})
+        .then(async () => {
+          let step = Math.sign(delta);
+          let result = null;
+          try {
+            while (step) {
+              result = await Promise.resolve().then(() => commandForDelta(step));
+              state.lastCommandResult = { name, prefixBefore, result };
+              ensureModeBadge();
+              step = state.pendingRelativeDelta;
+              state.pendingRelativeDelta = 0;
+            }
+            return result;
+          } catch (err) {
+            state.lastCommandResult = { name, prefixBefore, ok: false, error: err?.message || String(err) };
+            ensureModeBadge();
+            return null;
+          } finally {
+            state.relativeMoveInFlight = false;
+          }
+        });
+    };
+    if (effectiveCommandOption(event)) {
       if (isModifierOnlyKey(event)) {
         event.preventDefault();
         event.stopImmediatePropagation();
-        if (!event.repeat && !state.ctrlAltToggleDown) {
-          state.ctrlAltToggleDown = true;
+        if (!event.repeat && !state.metaAltToggleDown) {
+          state.metaAltToggleDown = true;
           setVimMode(!state.vimMode);
         }
         return;
@@ -3249,35 +3816,35 @@
       if (code === "KeyJ" || key === "j" || key === "ArrowDown") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-j", () => withVisibleMountedIndex(() => hasAppServerOrder() ? jumpRelative(1) : jumpRelativeMounted(1)));
+        runRelativeCommand("cmd-option-j", 1, (step) => withVisibleMountedIndex(() => jumpRelativeFast(step)));
       } else if (code === "KeyK" || key === "k" || key === "ArrowUp") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-k", () => withVisibleMountedIndex(() => hasAppServerOrder() ? jumpRelative(-1) : jumpRelativeMounted(-1)));
+        runRelativeCommand("cmd-option-k", -1, (step) => withVisibleMountedIndex(() => jumpRelativeFast(step)));
       } else if ((code === "KeyG" && event.shiftKey) || key === "G" || key === "End") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-G", () => afterIndexing(() => jumpToBottom()));
+        runCommand("cmd-option-G", () => afterIndexing(() => jumpToBottom()));
       } else if (code === "KeyG" || key === "g" || key === "Home") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-g", () => afterIndexing(() => jumpToIndex(0, { block: "start", behavior: "auto" })));
+        runCommand("cmd-option-g", () => afterIndexing(() => jumpToIndex(0, { block: "start", behavior: "auto" })));
       } else if (key === "[" || (code === "BracketLeft" && !event.shiftKey)) {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-[", () => alignCurrent("start"));
+        runCommand("cmd-option-[", () => alignCurrent("start"));
       } else if (key === "]" || (code === "BracketRight" && !event.shiftKey)) {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-]", () => alignCurrent("end"));
+        runCommand("cmd-option-]", () => alignCurrent("end"));
       } else if (key === "{" || (code === "BracketLeft" && event.shiftKey) || key === "PageUp") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-{", () => jumpRole("user", -1));
+        runCommand("cmd-option-{", () => jumpRole("user", -1));
       } else if (key === "}" || (code === "BracketRight" && event.shiftKey) || key === "PageDown") {
         event.preventDefault();
         event.stopImmediatePropagation();
-        runCommand("ctrl-alt-}", () => jumpRole("user", 1));
+        runCommand("cmd-option-}", () => jumpRole("user", 1));
       } else if (key === "?" || (code === "Slash" && event.shiftKey)) {
         event.preventDefault();
         event.stopImmediatePropagation();
@@ -3349,12 +3916,12 @@
       event.preventDefault();
       state.countPrefix = "";
       ensureModeBadge();
-      runCommand("j", () => withVisibleMountedIndex(() => hasAppServerOrder() ? jumpRelative(1) : jumpRelativeMounted(1)));
+      runRelativeCommand("j", 1, (step) => withVisibleMountedIndex(() => jumpRelativeFast(step)));
     } else if (code === "KeyK" || key === "k") {
       event.preventDefault();
       state.countPrefix = "";
       ensureModeBadge();
-      runCommand("k", () => withVisibleMountedIndex(() => hasAppServerOrder() ? jumpRelative(-1) : jumpRelativeMounted(-1)));
+      runRelativeCommand("k", -1, (step) => withVisibleMountedIndex(() => jumpRelativeFast(step)));
     } else if ((code === "KeyG" && event.shiftKey) || key === "G") {
       event.preventDefault();
       const prefix = state.countPrefix;
@@ -3391,10 +3958,10 @@
 
   function handleKeyUp(event) {
     updateModifierState(event, false);
-    if ((event.key === "Control" || event.key === "Alt" || !event.ctrlKey || !event.altKey) &&
-        state.ctrlAltToggleDown &&
-        !effectiveCtrlAlt(event)) {
-      state.ctrlAltToggleDown = false;
+    if ((event.key === "Meta" || event.key === "Alt" || !event.metaKey || !event.altKey) &&
+        state.metaAltToggleDown &&
+        !effectiveCommandOption(event)) {
+      state.metaAltToggleDown = false;
     }
   }
 
@@ -3409,9 +3976,9 @@
   }
 
   function resetModifierState() {
-    state.ctrlDown = false;
+    state.metaDown = false;
     state.altDown = false;
-    state.ctrlAltToggleDown = false;
+    state.metaAltToggleDown = false;
   }
 
   function snapshot() {
@@ -3464,10 +4031,10 @@
   document.removeEventListener("keydown", window.__codexVimNavKeyHandler, true);
   window.removeEventListener("keyup", window.__codexVimNavKeyUpHandler, true);
   document.removeEventListener("keyup", window.__codexVimNavKeyUpHandler, true);
-  document.removeEventListener("mouseup", window.__oneWhackTextSelectionHandler, true);
+  document.removeEventListener("mouseup", window.__clankerbendTextSelectionHandler, true);
   window.__codexVimNavKeyHandler = handleKey;
   window.__codexVimNavKeyUpHandler = handleKeyUp;
-  window.__oneWhackTextSelectionHandler = handlePossibleTextSelection;
+  window.__clankerbendTextSelectionHandler = handlePossibleTextSelection;
   window.addEventListener("keydown", handleKey, true);
   document.addEventListener("keydown", handleKey, true);
   window.addEventListener("keyup", handleKeyUp, true);
@@ -3478,6 +4045,7 @@
   const mutationObserver = new MutationObserver(() => {
     state.version += 1;
     scheduleAnnotationRefresh();
+    renderCodexAccountSwitcher();
     maskSubmittedComposerContexts();
   });
   window.addEventListener("resize", resizeHandler);
@@ -3489,14 +4057,15 @@
     window.removeEventListener("keyup", handleKeyUp, true);
     document.removeEventListener("keyup", handleKeyUp, true);
     document.removeEventListener("mouseup", handlePossibleTextSelection, true);
-    document.removeEventListener("click", window.__oneWhackComposerSubmitClickHandler, true);
-    document.removeEventListener("keydown", window.__oneWhackComposerSubmitKeyHandler, true);
+    document.removeEventListener("click", window.__clankerbendComposerSubmitClickHandler, true);
+    document.removeEventListener("keydown", window.__clankerbendComposerSubmitKeyHandler, true);
+    document.getElementById(ACCOUNT_SWITCHER_ID)?.remove();
     window.removeEventListener("resize", resizeHandler);
     window.removeEventListener("blur", blurHandler);
     mutationObserver.disconnect();
     if (annotationRefreshTimer) clearTimeout(annotationRefreshTimer);
     annotationRefreshTimer = null;
-    window.__oneWhackComposerSubmitInterceptorInstalled = false;
+    window.__clankerbendComposerSubmitInterceptorInstalled = false;
   };
 
   const bridge = {
@@ -3508,18 +4077,18 @@
     openPanel,
     scrollToAnchor,
     highlightAnchor,
-    highlightRange: (range, options) => oneWhackRuntime().highlightRange
-      ? oneWhackRuntime().highlightRange(range, options)
+    highlightRange: (range, options) => clankerbendRuntime().highlightRange
+      ? clankerbendRuntime().highlightRange(range, options)
       : highlightAnchor(range?.anchorId, options),
     setAnnotations,
     setTranscriptOrder,
     primeAnchorOrder,
     jumpToIndex,
-    jumpRelative,
+    jumpRelativeFast,
     __testUpdateTextSelectionFromDom: updateTextSelectionFromDom
   };
 
-  oneWhackRuntime().registerApp({
+  clankerbendRuntime().registerApp({
     appId: VIM_NAV_APP_ID,
     capabilities: {
       transcriptRead: true,