@design.estate/dees-catalog 10.0.0 → 11.0.0

package/dist_bundle/bundle.js

@@ -122196,6 +122196,20 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         }
         return _DeesServiceLibLoader.instance;
       }
+      /**
+       * Shares one in-flight load between concurrent callers — but only for as long
+       * as that load can still succeed. A rejected load clears its own cache entry,
+       * so the next call makes a fresh attempt instead of replaying a stale failure
+       * for the lifetime of the page. Every load below goes through this.
+       */
+      shareLoad(loadArg, readArg, writeArg) {
+        const pending = loadArg();
+        writeArg(pending);
+        pending.catch(() => {
+          if (readArg() === pending) writeArg(null);
+        });
+        return pending;
+      }
       /**
        * Load xterm terminal emulator from CDN
        * @returns Promise resolving to xterm module with Terminal class
@@ -122207,19 +122221,24 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.xtermLoadingPromise) {
           return this.xtermLoadingPromise;
         }
-        this.xtermLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/xterm@${CDN_VERSIONS.xterm}/+esm`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          await this.injectXtermStyles();
-          this.xtermLib = {
-            Terminal: module.Terminal
-          };
-          return this.xtermLib;
-        })();
-        return this.xtermLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/xterm@${CDN_VERSIONS.xterm}/+esm`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            await this.injectXtermStyles();
+            this.xtermLib = {
+              Terminal: module.Terminal
+            };
+            return this.xtermLib;
+          },
+          () => this.xtermLoadingPromise,
+          (promiseArg) => {
+            this.xtermLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Provides xterm modules from the host application instead of the CDN.
@@ -122257,18 +122276,23 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.xtermFitAddonLoadingPromise) {
           return this.xtermFitAddonLoadingPromise;
         }
-        this.xtermFitAddonLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/xterm-addon-fit@${CDN_VERSIONS.xtermAddonFit}/+esm`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          this.xtermFitAddonLib = {
-            FitAddon: module.FitAddon
-          };
-          return this.xtermFitAddonLib;
-        })();
-        return this.xtermFitAddonLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/xterm-addon-fit@${CDN_VERSIONS.xtermAddonFit}/+esm`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            this.xtermFitAddonLib = {
+              FitAddon: module.FitAddon
+            };
+            return this.xtermFitAddonLib;
+          },
+          () => this.xtermFitAddonLoadingPromise,
+          (promiseArg) => {
+            this.xtermFitAddonLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Load xterm-addon-search from CDN
@@ -122281,18 +122305,23 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.xtermSearchAddonLoadingPromise) {
           return this.xtermSearchAddonLoadingPromise;
         }
-        this.xtermSearchAddonLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/xterm-addon-search@${CDN_VERSIONS.xtermAddonSearch}/+esm`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          this.xtermSearchAddonLib = {
-            SearchAddon: module.SearchAddon
-          };
-          return this.xtermSearchAddonLib;
-        })();
-        return this.xtermSearchAddonLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/xterm-addon-search@${CDN_VERSIONS.xtermAddonSearch}/+esm`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            this.xtermSearchAddonLib = {
+              SearchAddon: module.SearchAddon
+            };
+            return this.xtermSearchAddonLib;
+          },
+          () => this.xtermSearchAddonLoadingPromise,
+          (promiseArg) => {
+            this.xtermSearchAddonLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Inject xterm CSS styles into the document head
@@ -122331,16 +122360,21 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.highlightJsLoadingPromise) {
           return this.highlightJsLoadingPromise;
         }
-        this.highlightJsLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/highlight.js@${CDN_VERSIONS.highlightJs}/+esm`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          this.highlightJsLib = module.default;
-          return this.highlightJsLib;
-        })();
-        return this.highlightJsLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/highlight.js@${CDN_VERSIONS.highlightJs}/+esm`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            this.highlightJsLib = module.default;
+            return this.highlightJsLib;
+          },
+          () => this.highlightJsLoadingPromise,
+          (promiseArg) => {
+            this.highlightJsLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Load TradingView Lightweight Charts from CDN
@@ -122353,23 +122387,28 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.lightweightChartsLoadingPromise) {
           return this.lightweightChartsLoadingPromise;
         }
-        this.lightweightChartsLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/lightweight-charts@${CDN_VERSIONS.lightweightCharts}/+esm`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          this.lightweightChartsLib = {
-            createChart: module.createChart,
-            AreaSeries: module.AreaSeries,
-            LineSeries: module.LineSeries,
-            ColorType: module.ColorType,
-            LineType: module.LineType,
-            CrosshairMode: module.CrosshairMode
-          };
-          return this.lightweightChartsLib;
-        })();
-        return this.lightweightChartsLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/lightweight-charts@${CDN_VERSIONS.lightweightCharts}/+esm`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            this.lightweightChartsLib = {
+              createChart: module.createChart,
+              AreaSeries: module.AreaSeries,
+              LineSeries: module.LineSeries,
+              ColorType: module.ColorType,
+              LineType: module.LineType,
+              CrosshairMode: module.CrosshairMode
+            };
+            return this.lightweightChartsLib;
+          },
+          () => this.lightweightChartsLoadingPromise,
+          (promiseArg) => {
+            this.lightweightChartsLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Load Apache ECharts from CDN
@@ -122382,20 +122421,25 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.echartsLoadingPromise) {
           return this.echartsLoadingPromise;
         }
-        this.echartsLoadingPromise = (async () => {
-          const url = `${CDN_BASE}/echarts@${CDN_VERSIONS.echarts}/dist/echarts.esm.min.js`;
-          const module = await import(
-            /* @vite-ignore */
-            url
-          );
-          this.echartsLib = {
-            init: module.init,
-            dispose: module.dispose,
-            getInstanceByDom: module.getInstanceByDom
-          };
-          return this.echartsLib;
-        })();
-        return this.echartsLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const url = `${CDN_BASE}/echarts@${CDN_VERSIONS.echarts}/dist/echarts.esm.min.js`;
+            const module = await import(
+              /* @vite-ignore */
+              url
+            );
+            this.echartsLib = {
+              init: module.init,
+              dispose: module.dispose,
+              getInstanceByDom: module.getInstanceByDom
+            };
+            return this.echartsLib;
+          },
+          () => this.echartsLoadingPromise,
+          (promiseArg) => {
+            this.echartsLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Load Tiptap rich text editor and extensions from CDN
@@ -122408,26 +122452,31 @@ body > div[style*="top: -50000px"][style*="width: 50000px"] {
         if (this.tiptapLoadingPromise) {
           return this.tiptapLoadingPromise;
         }
-        this.tiptapLoadingPromise = (async () => {
-          const [coreModule, starterKitModule, underlineModule, textAlignModule, linkModule, typographyModule] = await Promise.all([
-            Promise.resolve().then(() => (init_dist17(), dist_exports2)),
-            Promise.resolve().then(() => (init_dist43(), dist_exports3)),
-            Promise.resolve().then(() => (init_dist44(), dist_exports4)),
-            Promise.resolve().then(() => (init_dist45(), dist_exports5)),
-            Promise.resolve().then(() => (init_dist46(), dist_exports6)),
-            Promise.resolve().then(() => (init_dist47(), dist_exports7))
-          ]);
-          this.tiptapLib = {
-            Editor: coreModule.Editor,
-            StarterKit: starterKitModule.default || starterKitModule.StarterKit,
-            Underline: underlineModule.default || underlineModule.Underline,
-            TextAlign: textAlignModule.default || textAlignModule.TextAlign,
-            Link: linkModule.default || linkModule.Link,
-            Typography: typographyModule.default || typographyModule.Typography
-          };
-          return this.tiptapLib;
-        })();
-        return this.tiptapLoadingPromise;
+        return this.shareLoad(
+          async () => {
+            const [coreModule, starterKitModule, underlineModule, textAlignModule, linkModule, typographyModule] = await Promise.all([
+              Promise.resolve().then(() => (init_dist17(), dist_exports2)),
+              Promise.resolve().then(() => (init_dist43(), dist_exports3)),
+              Promise.resolve().then(() => (init_dist44(), dist_exports4)),
+              Promise.resolve().then(() => (init_dist45(), dist_exports5)),
+              Promise.resolve().then(() => (init_dist46(), dist_exports6)),
+              Promise.resolve().then(() => (init_dist47(), dist_exports7))
+            ]);
+            this.tiptapLib = {
+              Editor: coreModule.Editor,
+              StarterKit: starterKitModule.default || starterKitModule.StarterKit,
+              Underline: underlineModule.default || underlineModule.Underline,
+              TextAlign: textAlignModule.default || textAlignModule.TextAlign,
+              Link: linkModule.default || linkModule.Link,
+              Typography: typographyModule.default || typographyModule.Typography
+            };
+            return this.tiptapLib;
+          },
+          () => this.tiptapLoadingPromise,
+          (promiseArg) => {
+            this.tiptapLoadingPromise = promiseArg;
+          }
+        );
       }
       /**
        * Preload multiple libraries in parallel
@@ -165037,9 +165086,9 @@ var _DeesAppui = class _DeesAppui extends (_a75 = DeesElement, _appbarMenuItems_
   /**
    * Set the selected secondary menu item by key (for tab items only)
    */
-  setSecondaryMenuSelection(itemKey) {
+  setSecondaryMenuSelection(itemKey2) {
     for (const group of this.secondarymenuGroups) {
-      const item = group.items.find((i11) => "key" in i11 && i11.key === itemKey);
+      const item = group.items.find((i11) => "key" in i11 && i11.key === itemKey2);
       if (item && (!("type" in item) || item.type === "tab" || item.type === void 0)) {
         this.secondarymenuSelectedItem = item;
         return;
@@ -179337,7 +179386,7 @@ init_dist_ts26();
 init_templates();
 init_theme();
 init_dees_contextmenu();
-var _showDetails_dec, _notice_dec, _associations_dec, _ungroupedSessionIds_dec, _groups_dec2, _selectedSessionId_dec, _sessions_dec, _a99, _DeesDemoSessionWorkspace_decorators, _init101, _sessions, _selectedSessionId, _groups2, _ungroupedSessionIds, _associations, _notice, _showDetails;
+var _showDetails_dec, _notice_dec, _associations_dec, _ungroupedItemIds_dec, _groups_dec2, _selectedSessionId_dec, _sessions_dec, _a99, _DeesDemoSessionWorkspace_decorators, _init101, _sessions, _selectedSessionId, _groups2, _ungroupedItemIds, _associations, _notice, _showDetails;
 var stages = {
   idle: { state: "normal", label: "Ready to start", description: "The brief is ready. Start the session to prepare the workspace." },
   starting: { state: "working", label: "Starting", description: "Opening the workspace and reading the project instructions." },
@@ -179366,9 +179415,29 @@ var demoSessions = /* @__PURE__ */ __name(() => [
   preview: stages[session.stage].description
 })), "demoSessions");
 var demoGroups = [
-  { id: "active", name: "Workspace", sessionIds: ["session-0", "session-1", "session-2", "session-6"] },
-  { id: "review", name: "Recent", sessionIds: ["session-3", "session-5", "session-4"] }
+  {
+    id: "active",
+    name: "Workspace",
+    itemIds: [
+      { kind: "session", id: "session-0" },
+      { kind: "resource", id: "terminal:build" },
+      { kind: "session", id: "session-1" },
+      { kind: "session", id: "session-2" },
+      { kind: "session", id: "session-6" }
+    ]
+  },
+  {
+    id: "review",
+    name: "Recent",
+    itemIds: [
+      { kind: "session", id: "session-3" },
+      { kind: "session", id: "session-5" },
+      { kind: "session", id: "session-4" }
+    ]
+  }
 ];
+var cloneGroups = /* @__PURE__ */ __name((groupsArg) => groupsArg.map((group) => ({ ...group, itemIds: group.itemIds.map((ref) => ({ ...ref })) })), "cloneGroups");
+var sameRef = /* @__PURE__ */ __name((leftArg, rightArg) => leftArg.kind === rightArg.kind && leftArg.id === rightArg.id, "sameRef");
 var demoResources = [
   {
     id: "terminal:build",
@@ -179397,34 +179466,43 @@ var demoResources = [
   }
 ];
 var demoResourceAssociations = [
-  { resourceId: "terminal:build", sessionId: "session-4" },
-  { resourceId: "file:release-notes", sessionId: "session-4" }
+  { resourceId: "terminal:build", target: { kind: "session", id: "session-4" } },
+  { resourceId: "file:release-notes", target: { kind: "resource", id: "terminal:build" } }
+];
+var demoEligibleSessionTargets = [
+  { kind: "session", id: "session-0" },
+  { kind: "session", id: "session-1" },
+  { kind: "session", id: "session-2" },
+  { kind: "session", id: "session-4" }
 ];
-var demoResourceEligibleSessionIds = Object.fromEntries(
-  demoResources.map((resource) => [resource.id, ["session-0", "session-1", "session-2", "session-4"]])
+var demoResourceEligibleTargets = Object.fromEntries(
+  demoResources.map((resource) => [
+    resource.id,
+    resource.kind === "terminal" ? demoEligibleSessionTargets : [...demoEligibleSessionTargets, { kind: "resource", id: "terminal:build" }]
+  ])
 );
 var handleSessionSelect = /* @__PURE__ */ __name((event) => {
   const list5 = event.currentTarget;
   list5.selectedSessionId = event.detail.session.id;
 }, "handleSessionSelect");
-var handleSessionMove = /* @__PURE__ */ __name((event) => {
+var handleItemMove = /* @__PURE__ */ __name((event) => {
   const list5 = event.currentTarget;
-  applySessionMove(list5, event.detail);
-}, "handleSessionMove");
-var applySessionMove = /* @__PURE__ */ __name((list5, detail) => {
-  const { sessionId, groupId, beforeSessionId } = detail;
+  applyItemMove(list5, event.detail);
+}, "handleItemMove");
+var applyItemMove = /* @__PURE__ */ __name((list5, moveArg) => {
+  const { item, toGroupId, beforeItem } = moveArg;
   const groups = list5.groups.map((group) => ({
     ...group,
-    sessionIds: group.sessionIds.filter((id) => id !== sessionId)
+    itemIds: group.itemIds.filter((ref) => !sameRef(ref, item))
   }));
-  const ungroupedSessionIds = list5.ungroupedSessionIds.filter((id) => id !== sessionId);
-  const targetIds = groupId === null ? ungroupedSessionIds : groups.find((group) => group.id === groupId)?.sessionIds;
+  const ungroupedItemIds = list5.ungroupedItemIds.filter((ref) => !sameRef(ref, item));
+  const targetIds = toGroupId === null ? ungroupedItemIds : groups.find((group) => group.id === toGroupId)?.itemIds;
   if (!targetIds) return;
-  const anchorIndex = beforeSessionId ? targetIds.indexOf(beforeSessionId) : -1;
-  targetIds.splice(anchorIndex >= 0 ? anchorIndex : targetIds.length, 0, sessionId);
+  const anchorIndex = beforeItem ? targetIds.findIndex((ref) => sameRef(ref, beforeItem)) : -1;
+  targetIds.splice(anchorIndex >= 0 ? anchorIndex : targetIds.length, 0, { ...item });
   list5.groups = groups;
-  list5.ungroupedSessionIds = ungroupedSessionIds;
-}, "applySessionMove");
+  list5.ungroupedItemIds = ungroupedItemIds;
+}, "applyItemMove");
 var handleSessionOpen = /* @__PURE__ */ __name((event) => {
   const list5 = event.currentTarget;
   list5.selectedSessionId = event.detail.session.id;
@@ -179437,7 +179515,10 @@ var handleSessionContext = /* @__PURE__ */ __name(async (event, onChange = () =>
   const invokingControl = originalEvent.composedPath().find(
     (target) => target instanceof HTMLButtonElement
   );
-  const currentGroup = list5.groups.find((group) => group.sessionIds.includes(session.id));
+  const sessionRef = { kind: "session", id: session.id };
+  const currentGroup = list5.groups.find(
+    (group) => group.itemIds.some((ref) => sameRef(ref, sessionRef))
+  );
   const menu = await DeesContextmenu.openContextMenuWithOptions(originalEvent, [
     {
       name: "Open conversation",
@@ -179457,7 +179538,7 @@ var handleSessionContext = /* @__PURE__ */ __name(async (event, onChange = () =>
       name: `Move to ${group.name}`,
       iconName: "lucide:FolderInput",
       action: /* @__PURE__ */ __name(async () => {
-        applySessionMove(list5, { sessionId: session.id, groupId: group.id, index: group.sessionIds.length });
+        applyItemMove(list5, { item: sessionRef, toGroupId: group.id, beforeItem: null });
         onChange();
         showDemoResult(list5, `Moved \u201C${session.title}\u201D to ${group.name}.`);
       }, "action")
@@ -179466,7 +179547,7 @@ var handleSessionContext = /* @__PURE__ */ __name(async (event, onChange = () =>
       name: "Move to Ungrouped",
       iconName: "lucide:FolderInput",
       action: /* @__PURE__ */ __name(async () => {
-        applySessionMove(list5, { sessionId: session.id, groupId: null, index: list5.ungroupedSessionIds.length });
+        applyItemMove(list5, { item: sessionRef, toGroupId: null, beforeItem: null });
         onChange();
         showDemoResult(list5, `Moved \u201C${session.title}\u201D to Ungrouped.`);
       }, "action")
@@ -179486,33 +179567,34 @@ var handleResourceAssociation = /* @__PURE__ */ __name((event) => {
   const next2 = list5.resourceAssociations.filter(
     (association2) => association2.resourceId !== event.detail.resource.id
   );
-  if (event.detail.toSessionId) {
+  if (event.detail.toTarget) {
     next2.push({
       resourceId: event.detail.resource.id,
-      sessionId: event.detail.toSessionId
+      target: { ...event.detail.toTarget }
     });
   }
   list5.resourceAssociations = next2;
 }, "handleResourceAssociation");
 var handleResourceContext = /* @__PURE__ */ __name(async (event) => {
   const list5 = event.currentTarget;
-  const currentSessionId = event.detail.sessionId;
-  const eligibleSessionIds = list5.eligibleSessionIdsByResourceId[event.detail.resource.id] ?? [];
+  const currentTarget = event.detail.target;
+  const eligibleTargets = list5.eligibleTargetsByResourceId[event.detail.resource.id] ?? [];
+  const titleFor = /* @__PURE__ */ __name((refArg) => (refArg.kind === "session" ? list5.sessions.find((session) => session.id === refArg.id)?.title : list5.resources.find((resource) => resource.id === refArg.id)?.title) ?? refArg.id, "titleFor");
   const menu = await DeesContextmenu.openContextMenuWithOptions(
     new MouseEvent("contextmenu", {
       clientX: event.detail.clientX,
       clientY: event.detail.clientY
     }),
     [
-      ...eligibleSessionIds.filter((sessionId) => sessionId !== currentSessionId).map((sessionId) => ({
-        name: `${currentSessionId ? "Reassign" : "Attach"} to ${list5.sessions.find((session) => session.id === sessionId)?.title}`,
+      ...eligibleTargets.filter((target) => !currentTarget || !sameRef(target, currentTarget)).map((target) => ({
+        name: `${currentTarget ? "Reassign" : "Attach"} to ${titleFor(target)}`,
         iconName: "lucide:Link",
         action: /* @__PURE__ */ __name(async () => {
-          event.detail.requestAssociation(sessionId);
+          event.detail.requestAssociation(target);
           event.detail.close();
         }, "action")
       })),
-      ...currentSessionId ? [{
+      ...currentTarget ? [{
         name: "Detach",
         iconName: "lucide:Unlink",
         action: /* @__PURE__ */ __name(async () => {
@@ -179534,7 +179616,7 @@ var openModal = /* @__PURE__ */ __name(async (sessions, groups) => {
   const content3 = document.createElement("dees-harness-session-list");
   content3.sessions = sessions;
   content3.groups = groups;
-  content3.ungroupedSessionIds = [];
+  content3.ungroupedItemIds = [];
   content3.enableGrouping = true;
   content3.style.height = "420px";
   content3.addEventListener("harness-session-select", handleSessionSelect);
@@ -179542,7 +179624,7 @@ var openModal = /* @__PURE__ */ __name(async (sessions, groups) => {
   content3.addEventListener("harness-session-context", (event) => {
     void handleSessionContext(event);
   });
-  content3.addEventListener("harness-session-move", handleSessionMove);
+  content3.addEventListener("harness-item-move", handleItemMove);
   DeesModal2.createAndShow({
     heading: "Conversations",
     content: b2`<style>${demoStyles}</style><div class="dees-demo-stack">${content3}${demoOutput("Choose a conversation action.")}</div>`,
@@ -179550,13 +179632,13 @@ var openModal = /* @__PURE__ */ __name(async (sessions, groups) => {
   });
 }, "openModal");
 _DeesDemoSessionWorkspace_decorators = [customElement("dees-demo-session-workspace")];
-var _DeesDemoSessionWorkspace = class _DeesDemoSessionWorkspace extends (_a99 = DeesElement, _sessions_dec = [r5()], _selectedSessionId_dec = [r5()], _groups_dec2 = [r5()], _ungroupedSessionIds_dec = [r5()], _associations_dec = [r5()], _notice_dec = [r5()], _showDetails_dec = [r5()], _a99) {
+var _DeesDemoSessionWorkspace = class _DeesDemoSessionWorkspace extends (_a99 = DeesElement, _sessions_dec = [r5()], _selectedSessionId_dec = [r5()], _groups_dec2 = [r5()], _ungroupedItemIds_dec = [r5()], _associations_dec = [r5()], _notice_dec = [r5()], _showDetails_dec = [r5()], _a99) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _sessions, __runInitializers(_init101, 8, this, demoSessions())), __runInitializers(_init101, 11, this);
     __privateAdd(this, _selectedSessionId, __runInitializers(_init101, 12, this, "session-0")), __runInitializers(_init101, 15, this);
-    __privateAdd(this, _groups2, __runInitializers(_init101, 16, this, demoGroups.map((group) => ({ ...group, sessionIds: [...group.sessionIds] })))), __runInitializers(_init101, 19, this);
-    __privateAdd(this, _ungroupedSessionIds, __runInitializers(_init101, 20, this, [])), __runInitializers(_init101, 23, this);
+    __privateAdd(this, _groups2, __runInitializers(_init101, 16, this, cloneGroups(demoGroups))), __runInitializers(_init101, 19, this);
+    __privateAdd(this, _ungroupedItemIds, __runInitializers(_init101, 20, this, [])), __runInitializers(_init101, 23, this);
     __privateAdd(this, _associations, __runInitializers(_init101, 24, this, [...demoResourceAssociations])), __runInitializers(_init101, 27, this);
     __privateAdd(this, _notice, __runInitializers(_init101, 28, this, "Interactive demo \xB7 Changes stay in this example.")), __runInitializers(_init101, 31, this);
     __privateAdd(this, _showDetails, __runInitializers(_init101, 32, this, false)), __runInitializers(_init101, 35, this);
@@ -179569,7 +179651,7 @@ var _DeesDemoSessionWorkspace = class _DeesDemoSessionWorkspace extends (_a99 =
     if (!list5) return;
     this.selectedSessionId = list5.selectedSessionId;
     this.groups = list5.groups;
-    this.ungroupedSessionIds = list5.ungroupedSessionIds;
+    this.ungroupedItemIds = list5.ungroupedItemIds;
     this.associations = list5.resourceAssociations;
   }
   async select(event) {
@@ -179602,8 +179684,8 @@ var _DeesDemoSessionWorkspace = class _DeesDemoSessionWorkspace extends (_a99 =
   reset() {
     this.sessions = demoSessions();
     this.selectedSessionId = "session-0";
-    this.groups = demoGroups.map((group) => ({ ...group, sessionIds: [...group.sessionIds] }));
-    this.ungroupedSessionIds = [];
+    this.groups = cloneGroups(demoGroups);
+    this.ungroupedItemIds = [];
     this.associations = [...demoResourceAssociations];
     this.notice = "Demo reset. Choose a session or respond to the approval request.";
     if (this.list) {
@@ -179632,23 +179714,23 @@ var _DeesDemoSessionWorkspace = class _DeesDemoSessionWorkspace extends (_a99 =
             <span class="attentionSummary"><dees-icon icon="lucide:CircleAlert" iconSize="12"></dees-icon>${attentionCount} need attention</span>
           </div>
           <dees-harness-session-list
-            .sessions=${this.sessions} .groups=${this.groups} .ungroupedSessionIds=${this.ungroupedSessionIds}
+            .sessions=${this.sessions} .groups=${this.groups} .ungroupedItemIds=${this.ungroupedItemIds}
             .resources=${demoResources} .resourceAssociations=${this.associations}
-            .eligibleSessionIdsByResourceId=${demoResourceEligibleSessionIds} .enableGrouping=${true}
+            .eligibleTargetsByResourceId=${demoResourceEligibleTargets} .enableGrouping=${true}
             .selectedSessionId=${this.selectedSessionId}
             @harness-session-select=${this.select} @harness-session-open=${this.select}
             @harness-session-context=${(event) => handleSessionContext(event, (opened) => {
       this.syncList();
       if (opened) void this.revealSession();
     })}
-            @harness-session-move=${(event) => {
-      handleSessionMove(event);
+            @harness-item-move=${(event) => {
+      handleItemMove(event);
       this.syncList();
     }}
             @harness-group-create-request=${() => {
-      this.groups = [...this.groups, { id: `group-${this.groups.length}`, name: `Group ${this.groups.length + 1}`, sessionIds: [] }];
+      this.groups = [...this.groups, { id: `group-${this.groups.length}`, name: `Group ${this.groups.length + 1}`, itemIds: [] }];
       if (this.list) this.list.search = "";
-      this.notice = "Group created. Drag a session here or use its Actions menu.";
+      this.notice = "Group created. Drag a conversation or resource here, or use its Actions menu.";
     }}
             @harness-resource-select=${(event) => {
       event.currentTarget.selectedResourceId = event.detail.resource.id;
@@ -179738,14 +179820,14 @@ _init101 = __decoratorStart(_a99);
 _sessions = new WeakMap();
 _selectedSessionId = new WeakMap();
 _groups2 = new WeakMap();
-_ungroupedSessionIds = new WeakMap();
+_ungroupedItemIds = new WeakMap();
 _associations = new WeakMap();
 _notice = new WeakMap();
 _showDetails = new WeakMap();
 __decorateElement(_init101, 4, "sessions", _sessions_dec, _DeesDemoSessionWorkspace, _sessions);
 __decorateElement(_init101, 4, "selectedSessionId", _selectedSessionId_dec, _DeesDemoSessionWorkspace, _selectedSessionId);
 __decorateElement(_init101, 4, "groups", _groups_dec2, _DeesDemoSessionWorkspace, _groups2);
-__decorateElement(_init101, 4, "ungroupedSessionIds", _ungroupedSessionIds_dec, _DeesDemoSessionWorkspace, _ungroupedSessionIds);
+__decorateElement(_init101, 4, "ungroupedItemIds", _ungroupedItemIds_dec, _DeesDemoSessionWorkspace, _ungroupedItemIds);
 __decorateElement(_init101, 4, "associations", _associations_dec, _DeesDemoSessionWorkspace, _associations);
 __decorateElement(_init101, 4, "notice", _notice_dec, _DeesDemoSessionWorkspace, _notice);
 __decorateElement(_init101, 4, "showDetails", _showDetails_dec, _DeesDemoSessionWorkspace, _showDetails);
@@ -179801,12 +179883,18 @@ var demoFunc67 = /* @__PURE__ */ __name(() => demoApp(b2`<dees-demo-session-work
 init_dist_ts26();
 init_theme();
 init_dees_icon();
-var _resourceContextResourceId_dec, _moveAnnouncement_dec, _bottomScrollShadowVisible_dec, _topScrollShadowVisible_dec, _collapsedGroupIds_dec, _expandedSessionIds_dec, _draggedItemHeight_dec, _dropSlot_dec, _resourceDropTargetSessionId_dec, _draggingResourceId_dec, _draggingSessionId_dec, _search_dec, _eligibleSessionIdsByResourceId_dec, _selectedResourceId_dec, _resourceAssociations_dec, _resources_dec, _ungroupedSessionIds_dec2, _enableGrouping_dec, _groups_dec3, _emptyText_dec2, _loading_dec5, _selectedSessionId_dec2, _sessions_dec2, _a100, _DeesHarnessSessionList_decorators, _init102, _sessions2, _selectedSessionId2, _loading5, _emptyText2, _groups3, _enableGrouping, _ungroupedSessionIds2, _resources, _resourceAssociations, _selectedResourceId, _eligibleSessionIdsByResourceId, _search, _draggingSessionId, _draggingResourceId, _resourceDropTargetSessionId, _dropSlot, _draggedItemHeight, _expandedSessionIds, _collapsedGroupIds, _topScrollShadowVisible, _bottomScrollShadowVisible, _moveAnnouncement, _resourceContextResourceId;
+var _resourceContextResourceId_dec, _moveAnnouncement_dec, _bottomScrollShadowVisible_dec, _topScrollShadowVisible_dec, _collapsedGroupIds_dec, _expandedSessionIds_dec, _draggedItemHeight_dec, _dropSlot_dec, _draggingItem_dec, _search_dec, _eligibleTargetsByResourceId_dec, _selectedResourceId_dec, _resourceAssociations_dec, _resources_dec, _ungroupedItemIds_dec2, _enableGrouping_dec, _groups_dec3, _emptyText_dec2, _loading_dec5, _selectedSessionId_dec2, _sessions_dec2, _a100, _DeesHarnessSessionList_decorators, _init102, _sessions2, _selectedSessionId2, _loading5, _emptyText2, _groups3, _enableGrouping, _ungroupedItemIds2, _resources, _resourceAssociations, _selectedResourceId, _eligibleTargetsByResourceId, _search, _draggingItem, _dropSlot, _draggedItemHeight, _expandedSessionIds, _collapsedGroupIds, _topScrollShadowVisible, _bottomScrollShadowVisible, _moveAnnouncement, _resourceContextResourceId;
 var { repeat: repeat6 } = directives_exports;
 var dragAutoScrollMaxPixelsPerSecond = 900;
 var dragThresholdPixels = 4;
+var itemKey = /* @__PURE__ */ __name((refArg) => `${refArg.kind}:${refArg.id}`, "itemKey");
+var itemRef = /* @__PURE__ */ __name((itemArg) => ({
+  kind: itemArg.kind,
+  id: itemArg.id
+}), "itemRef");
+var sameItem = /* @__PURE__ */ __name((leftArg, rightArg) => !!leftArg && !!rightArg && leftArg.kind === rightArg.kind && leftArg.id === rightArg.id, "sameItem");
 _DeesHarnessSessionList_decorators = [customElement("dees-harness-session-list")];
-var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = DeesElement, _sessions_dec2 = [n5({ attribute: false })], _selectedSessionId_dec2 = [n5()], _loading_dec5 = [n5({ type: Boolean })], _emptyText_dec2 = [n5()], _groups_dec3 = [n5({ attribute: false })], _enableGrouping_dec = [n5({ type: Boolean })], _ungroupedSessionIds_dec2 = [n5({ attribute: false })], _resources_dec = [n5({ attribute: false })], _resourceAssociations_dec = [n5({ attribute: false })], _selectedResourceId_dec = [n5()], _eligibleSessionIdsByResourceId_dec = [n5({ attribute: false })], _search_dec = [r5()], _draggingSessionId_dec = [r5()], _draggingResourceId_dec = [r5()], _resourceDropTargetSessionId_dec = [r5()], _dropSlot_dec = [r5()], _draggedItemHeight_dec = [r5()], _expandedSessionIds_dec = [r5()], _collapsedGroupIds_dec = [r5()], _topScrollShadowVisible_dec = [r5()], _bottomScrollShadowVisible_dec = [r5()], _moveAnnouncement_dec = [r5()], _resourceContextResourceId_dec = [r5()], _a100) {
+var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = DeesElement, _sessions_dec2 = [n5({ attribute: false })], _selectedSessionId_dec2 = [n5()], _loading_dec5 = [n5({ type: Boolean })], _emptyText_dec2 = [n5()], _groups_dec3 = [n5({ attribute: false })], _enableGrouping_dec = [n5({ type: Boolean })], _ungroupedItemIds_dec2 = [n5({ attribute: false })], _resources_dec = [n5({ attribute: false })], _resourceAssociations_dec = [n5({ attribute: false })], _selectedResourceId_dec = [n5()], _eligibleTargetsByResourceId_dec = [n5({ attribute: false })], _search_dec = [r5()], _draggingItem_dec = [r5()], _dropSlot_dec = [r5()], _draggedItemHeight_dec = [r5()], _expandedSessionIds_dec = [r5()], _collapsedGroupIds_dec = [r5()], _topScrollShadowVisible_dec = [r5()], _bottomScrollShadowVisible_dec = [r5()], _moveAnnouncement_dec = [r5()], _resourceContextResourceId_dec = [r5()], _a100) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _sessions2, __runInitializers(_init102, 8, this, [])), __runInitializers(_init102, 11, this);
@@ -179815,23 +179903,21 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     __privateAdd(this, _emptyText2, __runInitializers(_init102, 20, this, "No conversations yet.")), __runInitializers(_init102, 23, this);
     __privateAdd(this, _groups3, __runInitializers(_init102, 24, this, [])), __runInitializers(_init102, 27, this);
     __privateAdd(this, _enableGrouping, __runInitializers(_init102, 28, this, false)), __runInitializers(_init102, 31, this);
-    __privateAdd(this, _ungroupedSessionIds2, __runInitializers(_init102, 32, this, [])), __runInitializers(_init102, 35, this);
+    __privateAdd(this, _ungroupedItemIds2, __runInitializers(_init102, 32, this, [])), __runInitializers(_init102, 35, this);
     __privateAdd(this, _resources, __runInitializers(_init102, 36, this, [])), __runInitializers(_init102, 39, this);
     __privateAdd(this, _resourceAssociations, __runInitializers(_init102, 40, this, [])), __runInitializers(_init102, 43, this);
     __privateAdd(this, _selectedResourceId, __runInitializers(_init102, 44, this, "")), __runInitializers(_init102, 47, this);
-    __privateAdd(this, _eligibleSessionIdsByResourceId, __runInitializers(_init102, 48, this, {})), __runInitializers(_init102, 51, this);
+    __privateAdd(this, _eligibleTargetsByResourceId, __runInitializers(_init102, 48, this, {})), __runInitializers(_init102, 51, this);
     __privateAdd(this, _search, __runInitializers(_init102, 52, this, "")), __runInitializers(_init102, 55, this);
-    __privateAdd(this, _draggingSessionId, __runInitializers(_init102, 56, this, "")), __runInitializers(_init102, 59, this);
-    __privateAdd(this, _draggingResourceId, __runInitializers(_init102, 60, this, "")), __runInitializers(_init102, 63, this);
-    __privateAdd(this, _resourceDropTargetSessionId, __runInitializers(_init102, 64, this, "")), __runInitializers(_init102, 67, this);
-    __privateAdd(this, _dropSlot, __runInitializers(_init102, 68, this)), __runInitializers(_init102, 71, this);
-    __privateAdd(this, _draggedItemHeight, __runInitializers(_init102, 72, this, 0)), __runInitializers(_init102, 75, this);
-    __privateAdd(this, _expandedSessionIds, __runInitializers(_init102, 76, this, /* @__PURE__ */ new Set())), __runInitializers(_init102, 79, this);
-    __privateAdd(this, _collapsedGroupIds, __runInitializers(_init102, 80, this, /* @__PURE__ */ new Set())), __runInitializers(_init102, 83, this);
-    __privateAdd(this, _topScrollShadowVisible, __runInitializers(_init102, 84, this, false)), __runInitializers(_init102, 87, this);
-    __privateAdd(this, _bottomScrollShadowVisible, __runInitializers(_init102, 88, this, false)), __runInitializers(_init102, 91, this);
-    __privateAdd(this, _moveAnnouncement, __runInitializers(_init102, 92, this, "")), __runInitializers(_init102, 95, this);
-    __privateAdd(this, _resourceContextResourceId, __runInitializers(_init102, 96, this, "")), __runInitializers(_init102, 99, this);
+    __privateAdd(this, _draggingItem, __runInitializers(_init102, 56, this)), __runInitializers(_init102, 59, this);
+    __privateAdd(this, _dropSlot, __runInitializers(_init102, 60, this)), __runInitializers(_init102, 63, this);
+    __privateAdd(this, _draggedItemHeight, __runInitializers(_init102, 64, this, 0)), __runInitializers(_init102, 67, this);
+    __privateAdd(this, _expandedSessionIds, __runInitializers(_init102, 68, this, /* @__PURE__ */ new Set())), __runInitializers(_init102, 71, this);
+    __privateAdd(this, _collapsedGroupIds, __runInitializers(_init102, 72, this, /* @__PURE__ */ new Set())), __runInitializers(_init102, 75, this);
+    __privateAdd(this, _topScrollShadowVisible, __runInitializers(_init102, 76, this, false)), __runInitializers(_init102, 79, this);
+    __privateAdd(this, _bottomScrollShadowVisible, __runInitializers(_init102, 80, this, false)), __runInitializers(_init102, 83, this);
+    __privateAdd(this, _moveAnnouncement, __runInitializers(_init102, 84, this, "")), __runInitializers(_init102, 87, this);
+    __privateAdd(this, _resourceContextResourceId, __runInitializers(_init102, 88, this, "")), __runInitializers(_init102, 91, this);
     __publicField(this, "reflowGeneration", 0);
     __publicField(this, "reflowAnimations", /* @__PURE__ */ new Set());
     __publicField(this, "pointerDragGesture");
@@ -179859,16 +179945,8 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
         eventArg.clientX - gesture.startClientX,
         eventArg.clientY - gesture.startClientY
       ) < dragThresholdPixels) return;
-      if (gesture.phase === "pending" && !(gesture.type === "session" ? this.startPointerDrag(eventArg, gesture) : this.startResourcePointerDrag(eventArg, gesture))) return;
+      if (gesture.phase === "pending" && !this.startPointerDrag(eventArg, gesture)) return;
       eventArg.preventDefault();
-      if (gesture.type === "resource") {
-        this.moveResourceDragPreview(eventArg.clientX, eventArg.clientY, gesture);
-        this.dragAutoScrollClientX = eventArg.clientX;
-        this.dragAutoScrollClientY = eventArg.clientY;
-        this.updateDragAutoScrollVelocity();
-        this.updateResourceDropTargetFromPointer(eventArg.clientX, eventArg.clientY);
-        return;
-      }
       this.moveDragPreview(eventArg.clientX, eventArg.clientY, gesture);
       this.dragAutoScrollClientX = eventArg.clientX;
       this.dragAutoScrollClientY = eventArg.clientY;
@@ -179879,14 +179957,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       const gesture = this.pointerDragGesture;
       if (!gesture || eventArg.pointerId !== gesture.pointerId) return;
       if (gesture.phase === "active") {
-        if (gesture.type === "resource") {
-          this.dragAutoScrollClientX = eventArg.clientX;
-          this.dragAutoScrollClientY = eventArg.clientY;
-          this.moveResourceDragPreview(eventArg.clientX, eventArg.clientY, gesture);
-          this.updateResourceDropTargetFromPointer(eventArg.clientX, eventArg.clientY);
-          this.finishPointerDrag(true);
-          return;
-        }
         this.dragAutoScrollClientX = eventArg.clientX;
         this.dragAutoScrollClientY = eventArg.clientY;
         this.moveDragPreview(eventArg.clientX, eventArg.clientY, gesture);
@@ -179926,14 +179996,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
         this.stopDragAutoScroll();
         return;
       }
-      if (gesture.type === "resource") {
-        this.updateResourceDropTargetFromPointer(
-          this.dragAutoScrollClientX,
-          this.dragAutoScrollClientY
-        );
-      } else {
-        this.updateDropSlotFromPointer();
-      }
+      this.updateDropSlotFromPointer();
       this.dragAutoScrollFrame = requestAnimationFrame(this.runDragAutoScroll);
     }, "runDragAutoScroll"));
     __publicField(this, "syncScrollShadowState", /* @__PURE__ */ __name(() => {
@@ -179945,9 +180008,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       if (this.bottomScrollShadowVisible !== bottomVisible) this.bottomScrollShadowVisible = bottomVisible;
     }, "syncScrollShadowState"));
   }
-  get sessionsById() {
-    return new Map(this.sessions.map((session) => [session.id, session]));
-  }
   get resourcesById() {
     const result = /* @__PURE__ */ new Map();
     for (const resource of this.resources) {
@@ -179956,20 +180016,103 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     }
     return result;
   }
-  /** First valid record wins; unknown and duplicate records remain untouched but are not projected. */
+  /**
+   * First valid record wins; unknown records, self-references and duplicates
+   * remain untouched but are not projected. Keyed by resource id.
+   */
   get acceptedResourceAssociations() {
     const resourcesById = this.resourcesById;
-    const sessionsById = this.sessionsById;
+    const itemsByKey = this.itemsByKey;
     const result = /* @__PURE__ */ new Map();
     for (const association2 of this.resourceAssociations) {
-      if (!resourcesById.has(association2.resourceId) || !sessionsById.has(association2.sessionId) || result.has(association2.resourceId)) continue;
-      result.set(association2.resourceId, association2.sessionId);
+      if (!association2.target || !resourcesById.has(association2.resourceId) || !itemsByKey.has(itemKey(association2.target)) || sameItem(association2.target, { kind: "resource", id: association2.resourceId }) || result.has(association2.resourceId)) continue;
+      result.set(association2.resourceId, itemRef(association2.target));
     }
     return result;
   }
   get acceptedResources() {
     return [...this.resourcesById.values()];
   }
+  /** Sessions and resources as one pool of orderable items, before grouping and search. */
+  get acceptedItems() {
+    const result = [];
+    const seenSessionIds = /* @__PURE__ */ new Set();
+    for (const session of this.sessions) {
+      if (!session.id || seenSessionIds.has(session.id)) continue;
+      seenSessionIds.add(session.id);
+      result.push({
+        kind: "session",
+        key: `session:${session.id}`,
+        id: session.id,
+        title: session.title || session.id,
+        sortable: session.draggable !== false,
+        timestamp: session.updatedAt ?? session.createdAt ?? 0,
+        session
+      });
+    }
+    for (const resource of this.resourcesById.values()) {
+      result.push({
+        kind: "resource",
+        key: `resource:${resource.id}`,
+        id: resource.id,
+        title: resource.title || resource.id,
+        sortable: resource.draggable !== false,
+        timestamp: resource.updatedAt ?? resource.createdAt ?? 0,
+        resource
+      });
+    }
+    return result;
+  }
+  get itemsByKey() {
+    return new Map(this.acceptedItems.map((item) => [item.key, item]));
+  }
+  /** Groups only organize the list while grouping is enabled. */
+  get effectiveGroups() {
+    return this.enableGrouping ? this.groups : [];
+  }
+  get groupedItemKeys() {
+    const keys3 = /* @__PURE__ */ new Set();
+    for (const group of this.effectiveGroups) {
+      for (const ref of group.itemIds) keys3.add(itemKey(ref));
+    }
+    return keys3;
+  }
+  itemsForGroup(groupIdArg) {
+    if (groupIdArg === null) return this.ungroupedItems;
+    const group = this.effectiveGroups.find((candidate) => candidate.id === groupIdArg);
+    if (!group) return [];
+    const byKey = this.itemsByKey;
+    const seen = /* @__PURE__ */ new Set();
+    const result = [];
+    for (const ref of group.itemIds) {
+      const key2 = itemKey(ref);
+      const item = byKey.get(key2);
+      if (!item || seen.has(key2)) continue;
+      seen.add(key2);
+      result.push(item);
+    }
+    return result;
+  }
+  /** Pinned entries first, then explicitly ordered items, then unknown items by recency. */
+  get ungroupedItems() {
+    const grouped = this.groupedItemKeys;
+    const available = this.acceptedItems.filter((item) => !grouped.has(item.key));
+    const pinned = available.filter((item) => !item.sortable);
+    const sortableByKey = new Map(
+      available.filter((item) => item.sortable).map((item) => [item.key, item])
+    );
+    const ordered = [];
+    for (const ref of this.ungroupedItemIds) {
+      const item = sortableByKey.get(itemKey(ref));
+      if (!item) continue;
+      ordered.push(item);
+      sortableByKey.delete(item.key);
+    }
+    const unknown3 = [...sortableByKey.values()].sort(
+      (left, right) => right.timestamp - left.timestamp
+    );
+    return [...pinned, ...ordered, ...unknown3];
+  }
   resourceMatchesSearch(resourceArg, queryArg) {
     return [resourceArg.id, resourceArg.kind, resourceArg.title, resourceArg.preview].filter(Boolean).join(" ").toLowerCase().includes(queryArg);
   }
@@ -179984,95 +180127,69 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       this.sessionStateLabel(sessionArg.state ?? "normal")
     ].filter(Boolean).join(" ").toLowerCase().includes(queryArg);
   }
-  resourcesForSession(sessionArg) {
-    const associations = this.acceptedResourceAssociations;
-    const associated = this.acceptedResources.filter(
-      (resource) => associations.get(resource.id) === sessionArg.id
-    );
-    const query3 = this.search.trim().toLowerCase();
-    if (!query3 || this.sessionMatchesSearch(sessionArg, query3)) return associated;
-    return associated.filter((resource) => this.resourceMatchesSearch(resource, query3));
-  }
-  get unattachedResources() {
-    const associations = this.acceptedResourceAssociations;
-    const query3 = this.search.trim().toLowerCase();
-    return this.acceptedResources.filter((resource) => !associations.has(resource.id) && (!query3 || this.resourceMatchesSearch(resource, query3)));
-  }
-  get groupedSessionIds() {
-    const ids = /* @__PURE__ */ new Set();
-    for (const group of this.groups) {
-      for (const id of group.sessionIds) ids.add(id);
-    }
-    return ids;
-  }
-  /** Pinned entries first, followed by explicitly ordered sortable sessions. */
-  get ungroupedSessions() {
-    const grouped = this.groupedSessionIds;
-    const available = this.sessions.filter((session) => !grouped.has(session.id));
-    const pinned = available.filter((session) => session.draggable === false);
-    const sortableById = new Map(
-      available.filter((session) => session.draggable !== false).map((session) => [session.id, session])
-    );
-    const ordered = [];
-    for (const sessionId of this.ungroupedSessionIds) {
-      const session = sortableById.get(sessionId);
-      if (!session) continue;
-      ordered.push(session);
-      sortableById.delete(sessionId);
-    }
-    const newSessions = [...sortableById.values()].sort(
-      (left, right) => (right.updatedAt ?? right.createdAt ?? 0) - (left.updatedAt ?? left.createdAt ?? 0)
-    );
-    return [...pinned, ...ordered, ...newSessions];
+  itemMatchesSearch(itemArg, queryArg) {
+    return itemArg.kind === "session" ? this.sessionMatchesSearch(itemArg.session, queryArg) : this.resourceMatchesSearch(itemArg.resource, queryArg);
   }
-  get filteredSessions() {
+  /** Search flattens the list: sessions and resources match as peers, newest first. */
+  get searchItems() {
     const query3 = this.search.trim().toLowerCase();
-    const associations = this.acceptedResourceAssociations;
-    const matchingAttachedSessionIds = new Set(
-      this.acceptedResources.filter((resource) => query3 && this.resourceMatchesSearch(resource, query3)).map((resource) => associations.get(resource.id)).filter((sessionId) => sessionId !== void 0)
-    );
-    const sorted = [...this.sessions].sort(
-      (left, right) => (right.updatedAt ?? right.createdAt ?? 0) - (left.updatedAt ?? left.createdAt ?? 0)
+    const sorted = [...this.acceptedItems].sort(
+      (left, right) => right.timestamp - left.timestamp
     );
     if (!query3) return sorted;
-    return sorted.filter(
-      (session) => this.sessionMatchesSearch(session, query3) || matchingAttachedSessionIds.has(session.id)
-    );
+    return sorted.filter((item) => this.itemMatchesSearch(item, query3));
+  }
+  get searchActive() {
+    return this.search.trim().length > 0;
+  }
+  sortableItems(itemsArg, excludeDraggingArg = true) {
+    return itemsArg.filter((item) => item.sortable && (!excludeDraggingArg || !sameItem(this.draggingItem, item)));
+  }
+  groupIdForItem(refArg) {
+    return this.effectiveGroups.find(
+      (group) => group.itemIds.some((candidate) => sameItem(candidate, refArg))
+    )?.id ?? null;
+  }
+  rowElementFor(refArg) {
+    return Array.from(
+      this.shadowRoot?.querySelectorAll("[data-item-kind][data-item-id]") ?? []
+    ).find((candidate) => candidate.dataset.itemKind === refArg.kind && candidate.dataset.itemId === refArg.id);
   }
   focusSearch() {
     this.shadowRoot?.querySelector(".searchRow input")?.focus();
   }
-  requestResourceAssociation(resourceIdArg, toSessionIdArg, sourceArg = "action") {
+  requestResourceAssociation(resourceIdArg, toTargetArg, sourceArg = "action") {
     const resource = this.resourcesById.get(resourceIdArg);
     if (!resource) return false;
-    const fromSessionId = this.acceptedResourceAssociations.get(resourceIdArg) ?? null;
-    if (fromSessionId === toSessionIdArg) return false;
-    if (toSessionIdArg !== null && (!this.sessionsById.has(toSessionIdArg) || !this.isResourceTargetEligible(resourceIdArg, toSessionIdArg))) return false;
-    if (toSessionIdArg === null && fromSessionId === null) return false;
-    const detail = fromSessionId === null ? {
+    const fromTarget = this.acceptedResourceAssociations.get(resourceIdArg) ?? null;
+    if (sameItem(fromTarget, toTargetArg)) return false;
+    if (toTargetArg !== null && (!this.itemsByKey.has(itemKey(toTargetArg)) || sameItem(toTargetArg, { kind: "resource", id: resourceIdArg }) || !this.isResourceTargetEligible(resourceIdArg, toTargetArg))) return false;
+    if (toTargetArg === null && fromTarget === null) return false;
+    const toTarget = toTargetArg === null ? null : itemRef(toTargetArg);
+    const detail = fromTarget === null ? {
       intent: "attach",
       resource,
-      fromSessionId: null,
-      toSessionId: toSessionIdArg,
+      fromTarget: null,
+      toTarget,
       source: sourceArg
-    } : toSessionIdArg === null ? {
+    } : toTarget === null ? {
       intent: "detach",
       resource,
-      fromSessionId,
-      toSessionId: null,
+      fromTarget,
+      toTarget: null,
       source: sourceArg
     } : {
       intent: "reassign",
       resource,
-      fromSessionId,
-      toSessionId: toSessionIdArg,
+      fromTarget,
+      toTarget,
       source: sourceArg
     };
     this.pendingResourceAssociationRequest = {
       resourceId: resource.id,
       resourceTitle: resource.title || resource.id,
-      fromSessionId,
-      toSessionId: toSessionIdArg,
+      fromTarget,
+      toTarget,
       intent: detail.intent
     };
     this.moveAnnouncement = this.resourceAssociationAnnouncement(detail, false);
@@ -180095,9 +180212,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     }
     if (changedProperties.has("sessions")) {
       const knownIds = new Set(this.sessions.map((session) => session.id));
-      if (this.pointerDragGesture?.type === "session" && !knownIds.has(this.pointerDragGesture.sessionId)) {
-        this.finishPointerDrag(false);
-      }
       const nextExpanded = new Set(
         [...this.expandedSessionIds].filter((sessionId) => knownIds.has(sessionId))
       );
@@ -180106,22 +180220,14 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       }
     }
     if (changedProperties.has("resources") || changedProperties.has("resourceAssociations")) {
-      const gesture = this.pointerDragGesture;
-      if (gesture?.type === "resource") {
-        const currentSessionId = this.acceptedResourceAssociations.get(gesture.resourceId) ?? null;
-        if (!this.resourcesById.has(gesture.resourceId) || currentSessionId !== gesture.fromSessionId) {
-          this.finishPointerDrag(false);
-        }
-      }
       if (this.resourceContextResourceId && !this.resourcesById.has(this.resourceContextResourceId)) this.closeResourceContext(this.resourceContextGeneration);
       this.reconcilePendingResourceAssociation();
     }
-    if (changedProperties.has("sessions") || changedProperties.has("eligibleSessionIdsByResourceId")) {
+    if (changedProperties.has("sessions") || changedProperties.has("resources") || changedProperties.has("search")) {
       const gesture = this.pointerDragGesture;
-      if (gesture?.type === "resource" && !this.sameSessionIds(
-        gesture.eligibleSessionIds,
-        new Set(this.eligibleSessionIds(gesture.resourceId))
-      )) this.finishPointerDrag(false);
+      if (gesture && (this.searchActive || !this.itemsByKey.has(itemKey(gesture.item)))) {
+        this.finishPointerDrag(false);
+      }
     }
   }
   async connectedCallback() {
@@ -180141,7 +180247,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     await super.disconnectedCallback();
   }
   render() {
-    const groupingActive = this.enableGrouping && !this.search.trim();
     return b2`
       <div class="searchRow">
         <div class="searchField">
@@ -180175,11 +180280,11 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       <div class="listFrame">
         <div class="scrollShadow top ${this.topScrollShadowVisible ? "visible" : ""}"></div>
         <div
-          class="list ${this.draggingSessionId || this.draggingResourceId ? "dragActive" : ""}"
+          class="list ${this.draggingItem ? "dragActive" : ""}"
           @scroll=${this.syncScrollShadowState}
         >
           <div class="listContent">
-            ${this.loading ? b2`<div class="emptyNote">Loading conversations…</div>` : groupingActive ? this.renderGroupedList() : this.renderFlatList()}
+            ${this.loading ? b2`<div class="emptyNote">Loading conversations…</div>` : this.searchActive ? this.renderSearchList() : this.renderOrderedList()}
           </div>
         </div>
         <div class="scrollShadow bottom ${this.bottomScrollShadowVisible ? "visible" : ""}"></div>
@@ -180187,70 +180292,25 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       <div class="visuallyHidden" aria-live="polite">${this.moveAnnouncement}</div>
     `;
   }
-  renderFlatList() {
-    const sessions = this.filteredSessions;
-    const unattachedResources = this.unattachedResources;
-    if (!sessions.length && !unattachedResources.length) {
-      return b2`<div class="emptyNote">
-        ${this.acceptedResources.length ? this.sessions.length ? "No conversations or resources match this search." : "No resources match this search." : this.sessions.length ? "No conversations match this search." : this.emptyText}
-      </div>`;
-    }
-    return b2`
-      <div class="section">
-        ${repeat6(
-      sessions,
-      (session) => session.id,
-      (session) => this.renderItem(session, null, -1)
-    )}
-      </div>
-      ${this.renderUnattachedResources(unattachedResources)}
-    `;
+  renderEmptyNote() {
+    return b2`<div class="emptyNote">
+      ${this.acceptedResources.length ? this.sessions.length ? "No conversations or resources match this search." : "No resources match this search." : this.sessions.length ? "No conversations match this search." : this.emptyText}
+    </div>`;
   }
-  renderGroupedList() {
-    const byId = this.sessionsById;
-    const ungrouped = this.ungroupedSessions;
-    const unattachedResources = this.unattachedResources;
-    if (!this.sessions.length && !this.groups.length && !unattachedResources.length) {
+  renderSearchList() {
+    const items = this.searchItems;
+    if (!items.length) return this.renderEmptyNote();
+    return this.renderSection(items, null, false);
+  }
+  renderOrderedList() {
+    const groups = this.effectiveGroups;
+    const ungrouped = this.ungroupedItems;
+    if (!this.acceptedItems.length && !groups.length) {
       return b2`<div class="emptyNote">${this.emptyText}</div>`;
     }
     return b2`
-      ${this.groups.map((group) => {
-      const members = group.sessionIds.map((id) => byId.get(id)).filter((session) => session !== void 0);
-      const collapsed = this.collapsedGroupIds.has(group.id);
-      const attentionCount = members.filter((session) => session.state === "attention" || session.state === "error").length;
-      const isHeaderDrop = this.dropSlot?.groupId === group.id && this.dropSlot.index === this.sortableSessions(members).length && collapsed;
-      return b2`
-          <button
-            class="groupHeader ${collapsed ? "collapsed" : ""} ${isHeaderDrop ? "dropTarget" : ""}"
-            data-drop-group-id=${group.id}
-            data-drop-index=${this.sortableSessions(members).length}
-            data-drop-kind="slot"
-            type="button"
-            @click=${() => this.toggleGroupCollapsed(group.id)}
-            @contextmenu=${(event) => {
-        event.preventDefault();
-        const detail = {
-          group,
-          clientX: event.clientX,
-          clientY: event.clientY,
-          originalEvent: event
-        };
-        this.dispatchEvent(
-          new CustomEvent("harness-group-context", { detail, bubbles: true, composed: true })
-        );
-      }}
-          >
-            <dees-icon class="chevron" icon="lucide:ChevronDown" iconSize="12"></dees-icon>
-            <span>${group.name}</span>
-            ${attentionCount ? b2`<span class="groupAttention" aria-label=${`${attentionCount} need attention`}>
-              <dees-icon aria-hidden="true" icon="lucide:CircleAlert" iconSize="11"></dees-icon>${attentionCount}
-            </span>` : ""}
-            <span class="groupCount">${members.length}</span>
-          </button>
-          ${collapsed ? "" : this.renderSection(members, group.id)}
-        `;
-    })}
-      ${this.groups.length && (ungrouped.length || this.draggingSessionId) ? b2`
+      ${groups.map((group) => this.renderGroup(group))}
+      ${groups.length && (ungrouped.length || this.draggingItem) ? b2`
             <button
               class="groupHeader"
               data-drop-group-id=""
@@ -180263,43 +180323,85 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
               <span class="groupCount">${ungrouped.length}</span>
             </button>
           ` : ""}
-      ${this.renderSection(ungrouped, null)}
-      ${this.renderUnattachedResources(unattachedResources)}
+      ${this.renderSection(ungrouped, null, true)}
+    `;
+  }
+  renderGroup(groupArg) {
+    const members = this.itemsForGroup(groupArg.id);
+    const collapsed = this.collapsedGroupIds.has(groupArg.id);
+    const attentionCount = members.filter((item) => item.kind === "session" && (item.session.state === "attention" || item.session.state === "error")).length;
+    const appendIndex = this.sortableItems(members).length;
+    const isHeaderDrop = this.dropSlot?.groupId === groupArg.id && this.dropSlot.index === appendIndex && collapsed;
+    return b2`
+      <button
+        class="groupHeader ${collapsed ? "collapsed" : ""} ${isHeaderDrop ? "dropTarget" : ""}"
+        data-drop-group-id=${groupArg.id}
+        data-drop-index=${appendIndex}
+        data-drop-kind="slot"
+        type="button"
+        @click=${() => this.toggleGroupCollapsed(groupArg.id)}
+        @contextmenu=${(event) => {
+      event.preventDefault();
+      const detail = {
+        group: groupArg,
+        clientX: event.clientX,
+        clientY: event.clientY,
+        originalEvent: event
+      };
+      this.dispatchEvent(
+        new CustomEvent("harness-group-context", { detail, bubbles: true, composed: true })
+      );
+    }}
+      >
+        <dees-icon class="chevron" icon="lucide:ChevronDown" iconSize="12"></dees-icon>
+        <span>${groupArg.name}</span>
+        ${attentionCount ? b2`<span class="groupAttention" aria-label=${`${attentionCount} need attention`}>
+          <dees-icon aria-hidden="true" icon="lucide:CircleAlert" iconSize="11"></dees-icon>${attentionCount}
+        </span>` : ""}
+        <span class="groupCount">${members.length}</span>
+      </button>
+      ${collapsed ? "" : this.renderSection(members, groupArg.id, true)}
     `;
   }
-  renderSection(sessions, groupId) {
-    const slot = this.dropSlot;
+  renderSection(itemsArg, groupIdArg, sortableArg) {
+    const slot = sortableArg ? this.dropSlot : void 0;
     const entries = [];
     let logicalIndex = 0;
-    for (const session of sessions) {
-      const isDragging = session.id === this.draggingSessionId;
-      const sortable = session.draggable !== false;
-      if (slot && slot.groupId === groupId && slot.index === logicalIndex && !isDragging && sortable) {
-        entries.push({ type: "placeholder", key: `placeholder:${groupId ?? "ungrouped"}` });
+    for (const item of itemsArg) {
+      const isDragging = sameItem(this.draggingItem, item);
+      const sortable = sortableArg && item.sortable;
+      if (slot && slot.groupId === groupIdArg && slot.index === logicalIndex && !isDragging && sortable) {
+        entries.push({ type: "placeholder", key: `placeholder:${groupIdArg ?? "ungrouped"}` });
       }
       entries.push({
-        type: "session",
-        key: `session:${session.id}`,
-        session,
+        type: "item",
+        key: item.key,
+        item,
         logicalIndex: sortable ? logicalIndex : -1
       });
       if (sortable && !isDragging) logicalIndex += 1;
     }
-    if (slot && slot.groupId === groupId && slot.index === logicalIndex) {
-      entries.push({ type: "placeholder", key: `placeholder:${groupId ?? "ungrouped"}` });
+    if (slot && slot.groupId === groupIdArg && slot.index === logicalIndex) {
+      entries.push({ type: "placeholder", key: `placeholder:${groupIdArg ?? "ungrouped"}` });
     }
     const hasPlaceholder = entries.some((entry) => entry.type === "placeholder");
+    const associations = this.acceptedResourceAssociations;
     return b2`
-      <div class="section" data-group-id=${groupId ?? ""}>
+      <div class="section" data-group-id=${groupIdArg ?? ""}>
         ${repeat6(
       entries,
       (entry) => entry.key,
-      (entry) => entry.type === "placeholder" ? this.renderDropPlaceholder(groupId, slot?.index ?? 0) : this.renderItem(entry.session, groupId, entry.logicalIndex)
+      (entry) => entry.type === "placeholder" ? this.renderDropPlaceholder(groupIdArg, slot?.index ?? 0) : entry.item.kind === "session" ? this.renderSessionItem(entry.item.session, groupIdArg, entry.logicalIndex) : this.renderResourceItem(
+        entry.item.resource,
+        groupIdArg,
+        entry.logicalIndex,
+        associations.get(entry.item.id) ?? null
+      )
     )}
-        ${this.draggingSessionId && !hasPlaceholder && this.sortableSessions(sessions).length === 0 ? b2`
+        ${this.draggingItem && sortableArg && !hasPlaceholder && this.sortableItems(itemsArg).length === 0 ? b2`
               <div
                 class="emptyDropZone"
-                data-drop-group-id=${groupId ?? ""}
+                data-drop-group-id=${groupIdArg ?? ""}
                 data-drop-index="0"
                 data-drop-kind="slot"
               ></div>
@@ -180314,30 +180416,56 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
         data-drop-group-id=${groupId ?? ""}
         data-drop-index=${index3}
         data-drop-kind="slot"
-        style=${`height: ${Math.max(46, this.draggedItemHeight)}px`}
+        style=${`height: ${Math.max(24, this.draggedItemHeight)}px`}
       ></div>
     `;
   }
-  renderItem(session, groupId, index3) {
-    const draggable = this.enableGrouping && session.draggable !== false && index3 >= 0;
+  /** One grip for both kinds; only its size and extra class differ. */
+  renderDragHandle(refArg, titleArg, groupIdArg, logicalIndexArg) {
+    const isResource = refArg.kind === "resource";
+    return b2`
+      <button
+        class="dragHandle ${isResource ? "resourceDragHandle" : ""}"
+        type="button"
+        title="Drag to reorder; use arrow, Home, or End keys for keyboard reordering"
+        aria-label=${`Reorder ${titleArg}`}
+        aria-keyshortcuts="ArrowUp ArrowDown Home End"
+        @pointerdown=${(event) => {
+      this.handlePointerDown(event, refArg, groupIdArg, logicalIndexArg);
+    }}
+        @pointermove=${this.handlePointerMove}
+        @pointerup=${this.handlePointerUp}
+        @pointercancel=${this.handlePointerCancel}
+        @lostpointercapture=${this.handleLostPointerCapture}
+        @keydown=${(event) => {
+      this.handleKeyboardMove(event, refArg, titleArg, groupIdArg);
+    }}
+      >
+        <dees-icon icon="lucide:GripVertical" iconSize=${isResource ? "13" : "14"}></dees-icon>
+      </button>
+    `;
+  }
+  renderSessionItem(session, groupId, index3) {
+    const draggable = index3 >= 0;
     const expanded = this.expandedSessionIds.has(session.id);
     const state4 = session.state ?? "normal";
     const statusLabel = this.sessionStatusLabel(session);
     const active = (state4 === "normal" || state4 === "working") && (session.working ?? state4 === "working");
     const detailsId = `session-details-${session.id}`;
     const dropIndex = index3 < 0 ? 0 : index3;
-    const resources = this.resourcesForSession(session);
-    const isResourceDropTarget = this.resourceDropTargetSessionId === session.id;
+    const title = session.title || session.id;
     return b2`
       <article
-        class="item state-${state4} ${active ? "active" : ""} ${expanded ? "expanded" : ""} ${session.id === this.selectedSessionId ? "selected" : ""} ${this.draggingSessionId === session.id ? "dragging" : ""} ${isResourceDropTarget ? "resourceDropTarget" : ""}"
+        class="item state-${state4} ${active ? "active" : ""} ${expanded ? "expanded" : ""} ${session.id === this.selectedSessionId ? "selected" : ""} ${sameItem(this.draggingItem, { kind: "session", id: session.id }) ? "dragging" : ""}"
         data-session-id=${session.id}
+        data-item-kind="session"
+        data-item-id=${session.id}
         data-drop-group-id=${groupId ?? ""}
         data-drop-index=${dropIndex}
         data-drop-kind=${index3 < 0 ? "slot" : "card"}
         @dblclick=${(event) => {
       if (this.eventTargetsExpandToggle(event) || this.eventTargetsDragHandle(event) || this.eventTargetsSessionActions(event)) return;
-      this.emit("harness-session-open", session);
+      this.emitSession("harness-session-open", session);
     }}
         @contextmenu=${(event) => {
       if (this.eventTargetsExpandToggle(event)) return;
@@ -180356,38 +180484,18 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       >
         <div class="itemInner">
           <div class="itemHeader ${draggable ? "draggable" : ""}">
-            ${draggable ? b2`
-                  <button
-                    class="dragHandle"
-                    type="button"
-                    title="Drag to reorder; use arrow, Home, or End keys for keyboard reordering"
-                    aria-label=${`Reorder ${session.title || session.id}`}
-                    aria-keyshortcuts="ArrowUp ArrowDown Home End"
-                    @pointerdown=${(event) => {
-      this.handlePointerDown(event, session, groupId, index3);
-    }}
-                    @pointermove=${this.handlePointerMove}
-                    @pointerup=${this.handlePointerUp}
-                    @pointercancel=${this.handlePointerCancel}
-                    @lostpointercapture=${this.handleLostPointerCapture}
-                    @keydown=${(event) => {
-      this.handleKeyboardMove(event, session, groupId);
-    }}
-                  >
-                    <dees-icon icon="lucide:GripVertical" iconSize="14"></dees-icon>
-                  </button>
-                ` : ""}
+            ${draggable ? this.renderDragHandle({ kind: "session", id: session.id }, title, groupId, index3) : ""}
             <button
               class="itemPrimary"
               type="button"
               aria-keyshortcuts="ContextMenu Shift+F10"
               aria-current=${session.id === this.selectedSessionId ? "true" : "false"}
-              @click=${() => this.emit("harness-session-select", session)}
+              @click=${() => this.emitSession("harness-session-select", session)}
               @keydown=${(event) => {
       if (this.handleSessionContextKey(event)) return;
       if (event.key !== "Enter") return;
       event.preventDefault();
-      this.emit("harness-session-open", session);
+      this.emitSession("harness-session-open", session);
     }}
             >
               <span class="stateDot" aria-hidden="true">
@@ -180396,7 +180504,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
               <span class="itemCopy">
                 <span class="itemTitle">
                   ${session.icon ? b2`<dees-icon class="itemIcon" icon=${session.icon} iconSize="13"></dees-icon>` : ""}
-                  <span class="titleText">${session.title || session.id}</span>
+                  <span class="titleText">${title}</span>
                 </span>
                 <span class="itemStatus" title=${statusLabel}>${statusLabel}</span>
                 <span class="itemIdentity">
@@ -180413,7 +180521,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
               class="sessionActions"
               type="button"
               title="Actions"
-              aria-label=${`Actions for ${session.title || session.id}`}
+              aria-label=${`Actions for ${title}`}
               aria-haspopup="menu"
               aria-keyshortcuts="ContextMenu Shift+F10"
               @click=${this.invokeSessionContext}
@@ -180435,16 +180543,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
               <dees-icon icon="lucide:ChevronDown" iconSize="15"></dees-icon>
             </button>
           </div>
-          ${isResourceDropTarget ? b2`<div class="resourceDropLabel">Associate resource with ${session.title || session.id}</div>` : ""}
-          ${resources.length ? b2`
-                <ul class="resourceChildren" aria-label=${`Resources for ${session.title || session.id}`}>
-                  ${repeat6(
-      resources,
-      (resource) => resource.id,
-      (resource) => this.renderResource(resource, session.id)
-    )}
-                </ul>
-              ` : ""}
           ${expanded ? b2`
                 <div class="itemDetails" id=${detailsId}>
                   ${session.preview ? b2`<div class="itemPreview">${session.preview}</div>` : ""}
@@ -180457,77 +180555,54 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       </article>
     `;
   }
-  renderUnattachedResources(resourcesArg) {
-    if (!resourcesArg.length) return b2``;
-    return b2`
-      <section class="resourceSection" aria-labelledby="unattached-resources-heading">
-        <h2 class="resourceSectionTitle" id="unattached-resources-heading">Resources</h2>
-        <ul class="resourceList" aria-label="Unattached resources">
-          ${repeat6(
-      resourcesArg,
-      (resource) => resource.id,
-      (resource) => this.renderResource(resource, null)
-    )}
-        </ul>
-      </section>
-    `;
-  }
-  renderResource(resourceArg, sessionIdArg) {
+  renderResourceItem(resourceArg, groupIdArg, indexArg, attachedTarget) {
     const selected = resourceArg.id === this.selectedResourceId;
-    const dragging = resourceArg.id === this.draggingResourceId;
-    const eligibleTargetCount = this.eligibleSessionIds(resourceArg.id).filter(
-      (sessionId) => sessionId !== sessionIdArg
-    ).length;
+    const draggable = indexArg >= 0;
+    const dragging = sameItem(this.draggingItem, { kind: "resource", id: resourceArg.id });
     const contextOpen = resourceArg.id === this.resourceContextResourceId;
+    const attachedTitle = attachedTarget ? this.itemTitleFor(attachedTarget) : "";
+    const title = resourceArg.title || resourceArg.id;
+    const dropIndex = indexArg < 0 ? 0 : indexArg;
     return b2`
-      <li
-        class="resourceRow ${selected ? "selected" : ""} ${dragging ? "resourceDragging" : ""}"
+      <article
+        class="resourceRow ${selected ? "selected" : ""} ${draggable ? "draggable" : ""} ${dragging ? "dragging" : ""}"
         data-resource-id=${resourceArg.id}
-        data-resource-session-id=${sessionIdArg ?? ""}
+        data-item-kind="resource"
+        data-item-id=${resourceArg.id}
+        data-resource-target=${attachedTarget ? `${attachedTarget.kind}:${attachedTarget.id}` : ""}
+        data-drop-group-id=${groupIdArg ?? ""}
+        data-drop-index=${dropIndex}
+        data-drop-kind=${indexArg < 0 ? "slot" : "card"}
         @dblclick=${(event) => {
       event.stopPropagation();
-      if (this.eventTargetsResourceControl(event)) return;
-      this.emitResource("harness-resource-open", resourceArg, sessionIdArg);
+      if (this.eventTargetsResourceControl(event) || this.eventTargetsDragHandle(event)) return;
+      this.emitResource("harness-resource-open", resourceArg, attachedTarget);
     }}
         @contextmenu=${(event) => {
       event.preventDefault();
       event.stopPropagation();
       const focusTarget = event.composedPath().find((target) => target instanceof HTMLElement && target.matches("button:not(:disabled)")) ?? event.currentTarget.querySelector(".resourcePrimary") ?? event.currentTarget;
-      this.emitResourceContext(event, resourceArg, sessionIdArg, "pointer", focusTarget);
+      this.emitResourceContext(event, resourceArg, attachedTarget, "pointer", focusTarget);
     }}
       >
-        <button
-          class="resourceDragHandle"
-          type="button"
-          title=${eligibleTargetCount ? "Drag to associate with an eligible conversation" : "No eligible conversations"}
-          aria-label=${`Associate ${resourceArg.title || resourceArg.id} by dragging`}
-          aria-keyshortcuts="ContextMenu Shift+F10"
-          ?disabled=${eligibleTargetCount === 0}
-          @pointerdown=${(event) => {
-      this.handleResourcePointerDown(event, resourceArg, sessionIdArg);
-    }}
-          @pointermove=${this.handlePointerMove}
-          @pointerup=${this.handlePointerUp}
-          @pointercancel=${this.handlePointerCancel}
-          @lostpointercapture=${this.handleLostPointerCapture}
-          @keydown=${(event) => {
-      this.handleResourceContextKey(event, resourceArg, sessionIdArg);
-    }}
-        >
-          <dees-icon icon="lucide:GripVertical" iconSize="13"></dees-icon>
-        </button>
+        ${draggable ? this.renderDragHandle(
+      { kind: "resource", id: resourceArg.id },
+      title,
+      groupIdArg,
+      indexArg
+    ) : ""}
         <button
           class="resourcePrimary"
           type="button"
           aria-current=${selected ? "true" : "false"}
-          @click=${() => this.emitResource("harness-resource-select", resourceArg, sessionIdArg)}
+          @click=${() => this.emitResource("harness-resource-select", resourceArg, attachedTarget)}
           @keydown=${(event) => {
       if (event.key === "Enter") {
         event.preventDefault();
-        this.emitResource("harness-resource-open", resourceArg, sessionIdArg);
+        this.emitResource("harness-resource-open", resourceArg, attachedTarget);
         return;
       }
-      this.handleResourceContextKey(event, resourceArg, sessionIdArg);
+      this.handleResourceContextKey(event, resourceArg, attachedTarget);
     }}
         >
           <dees-icon
@@ -180536,32 +180611,45 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
             iconSize="14"
           ></dees-icon>
           <span class="resourceCopy">
-            <span class="resourceTitle">${resourceArg.title || resourceArg.id}</span>
+            <span class="resourceTitle">${title}</span>
             ${resourceArg.preview ? b2`<span class="resourcePreview">${resourceArg.preview}</span>` : ""}
             <span class="resourceMeta">
               ${resourceArg.kind}${resourceArg.state ? ` \xB7 ${resourceArg.state}` : ""}${resourceArg.updatedAt || resourceArg.createdAt ? ` \xB7 ${harnessFormatRelativeTime(resourceArg.updatedAt ?? resourceArg.createdAt)}` : ""}
             </span>
+            ${attachedTarget ? b2`
+                  <span class="resourceAttachment" title=${`Attached to ${attachedTitle}`}>
+                    <dees-icon aria-hidden="true" icon="lucide:Link" iconSize="10"></dees-icon>
+                    <span class="visuallyHidden">Attached to </span>
+                    <span class="resourceAttachmentName">${attachedTitle}</span>
+                  </span>
+                ` : ""}
           </span>
         </button>
         <button
           class="resourceActions"
           type="button"
           title="Resource actions"
-          aria-label=${`Actions for ${resourceArg.title || resourceArg.id}`}
+          aria-label=${`Actions for ${title}`}
           aria-haspopup="menu"
           aria-expanded=${contextOpen ? "true" : "false"}
           aria-keyshortcuts="ContextMenu Shift+F10"
           @click=${(event) => {
       event.stopPropagation();
-      this.emitResourceContext(event, resourceArg, sessionIdArg, "action", event.currentTarget);
+      this.emitResourceContext(
+        event,
+        resourceArg,
+        attachedTarget,
+        "action",
+        event.currentTarget
+      );
     }}
           @keydown=${(event) => {
-      this.handleResourceContextKey(event, resourceArg, sessionIdArg);
+      this.handleResourceContextKey(event, resourceArg, attachedTarget);
     }}
         >
           <dees-icon icon="lucide:Ellipsis" iconSize="15"></dees-icon>
         </button>
-      </li>
+      </article>
     `;
   }
   invokeSessionContext(event) {
@@ -180599,7 +180687,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
   }
   eventTargetsResourceControl(event) {
     return event.composedPath().some(
-      (target) => target instanceof HTMLElement && (target.classList.contains("resourceDragHandle") || target.classList.contains("resourceActions"))
+      (target) => target instanceof HTMLElement && target.classList.contains("resourceActions")
     );
   }
   sessionStateLabel(state4) {
@@ -180648,28 +180736,17 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     }
     this.collapsedGroupIds = next2;
   }
-  sortableSessions(sessionsArg, excludeDraggingArg = true) {
-    return sessionsArg.filter((session) => session.draggable !== false && (!excludeDraggingArg || session.id !== this.draggingSessionId));
-  }
-  sessionsForGroup(groupIdArg) {
-    if (groupIdArg === null) return this.ungroupedSessions;
-    const group = this.groups.find((candidate) => candidate.id === groupIdArg);
-    if (!group) return [];
-    const byId = this.sessionsById;
-    return group.sessionIds.map((sessionId) => byId.get(sessionId)).filter((session) => session !== void 0);
-  }
-  handlePointerDown(eventArg, sessionArg, groupIdArg, logicalIndexArg) {
+  handlePointerDown(eventArg, refArg, groupIdArg, logicalIndexArg) {
     if (this.pointerDragGesture || eventArg.button !== 0 || !eventArg.isPrimary || logicalIndexArg < 0) return;
     const handle3 = eventArg.currentTarget;
-    const source = handle3.closest(".item");
+    const source = handle3.closest(".item, .resourceRow");
     if (!source) return;
     const sourceRect = source.getBoundingClientRect();
     this.pointerDragGesture = {
-      type: "session",
       pointerId: eventArg.pointerId,
       handle: handle3,
       source,
-      sessionId: sessionArg.id,
+      item: itemRef(refArg),
       sourceGroupId: groupIdArg,
       sourceLogicalIndex: logicalIndexArg,
       startClientX: eventArg.clientX,
@@ -180686,34 +180763,6 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       this.finishPointerDrag(false);
     }
   }
-  handleResourcePointerDown(eventArg, resourceArg, fromSessionIdArg) {
-    if (this.pointerDragGesture || eventArg.button !== 0 || !eventArg.isPrimary || this.eligibleSessionIds(resourceArg.id).every((sessionId) => sessionId === fromSessionIdArg)) return;
-    const handle3 = eventArg.currentTarget;
-    const source = handle3.closest(".resourceRow");
-    if (!source) return;
-    const sourceRect = source.getBoundingClientRect();
-    this.pointerDragGesture = {
-      type: "resource",
-      pointerId: eventArg.pointerId,
-      handle: handle3,
-      source,
-      resourceId: resourceArg.id,
-      fromSessionId: fromSessionIdArg,
-      eligibleSessionIds: new Set(this.eligibleSessionIds(resourceArg.id)),
-      startClientX: eventArg.clientX,
-      startClientY: eventArg.clientY,
-      grabOffsetX: eventArg.clientX - sourceRect.left,
-      grabOffsetY: eventArg.clientY - sourceRect.top,
-      phase: "pending"
-    };
-    window.addEventListener("keydown", this.handleDragKeyDown, true);
-    window.addEventListener("blur", this.handleDragWindowBlur);
-    try {
-      handle3.setPointerCapture(eventArg.pointerId);
-    } catch {
-      this.finishPointerDrag(false);
-    }
-  }
   startPointerDrag(eventArg, gestureArg) {
     const sourceRect = gestureArg.source.getBoundingClientRect();
     gestureArg.source.classList.add("dragging");
@@ -180730,32 +180779,15 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     gestureArg.phase = "active";
     this.reflowGeneration += 1;
     this.cancelReflowAnimations();
-    this.draggedItemHeight = Math.ceil(sourceRect.height);
-    this.draggingSessionId = gestureArg.sessionId;
-    const remainingCount = this.sortableSessions(this.sessionsForGroup(gestureArg.sourceGroupId)).length;
+    this.draggedItemHeight = sourceRect.height;
+    this.draggingItem = itemRef(gestureArg.item);
+    const remainingCount = this.sortableItems(this.itemsForGroup(gestureArg.sourceGroupId)).length;
     this.dropSlot = {
       groupId: gestureArg.sourceGroupId,
       index: Math.min(gestureArg.sourceLogicalIndex, remainingCount)
     };
     return true;
   }
-  startResourcePointerDrag(eventArg, gestureArg) {
-    const sourceRect = gestureArg.source.getBoundingClientRect();
-    gestureArg.source.classList.add("resourceDragging");
-    gestureArg.source.style.setProperty("--resource-drag-preview-width", `${sourceRect.width}px`);
-    this.moveResourceDragPreview(eventArg.clientX, eventArg.clientY, gestureArg);
-    gestureArg.source.setAttribute("popover", "manual");
-    try {
-      gestureArg.source.showPopover();
-    } catch {
-      this.finishPointerDrag(false);
-      return false;
-    }
-    gestureArg.phase = "active";
-    this.draggingResourceId = gestureArg.resourceId;
-    this.resourceDropTargetSessionId = "";
-    return true;
-  }
   moveDragPreview(clientXArg, clientYArg, gestureArg) {
     gestureArg.source.style.setProperty(
       "--drag-preview-x",
@@ -180766,38 +180798,20 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       `${clientYArg - gestureArg.grabOffsetY}px`
     );
   }
-  moveResourceDragPreview(clientXArg, clientYArg, gestureArg) {
-    gestureArg.source.style.setProperty(
-      "--resource-drag-preview-x",
-      `${clientXArg - gestureArg.grabOffsetX}px`
-    );
-    gestureArg.source.style.setProperty(
-      "--resource-drag-preview-y",
-      `${clientYArg - gestureArg.grabOffsetY}px`
-    );
-  }
-  updateResourceDropTargetFromPointer(clientXArg, clientYArg) {
-    const gesture = this.pointerDragGesture;
-    if (gesture?.type !== "resource" || gesture.phase !== "active") return;
-    const hit = this.shadowRoot?.elementFromPoint(clientXArg, clientYArg);
-    const target = hit?.closest(".item[data-session-id]");
-    const sessionId = target?.dataset.sessionId ?? "";
-    this.resourceDropTargetSessionId = sessionId && sessionId !== gesture.fromSessionId && this.isResourceTargetEligible(gesture.resourceId, sessionId) ? sessionId : "";
-  }
   setDropSlot(groupIdArg, indexArg) {
     const current = this.dropSlot;
     if (current && current.groupId === groupIdArg && current.index === indexArg) return;
-    const previousRects = this.captureCardRects();
+    const previousRects = this.captureRowRects();
     const generation = ++this.reflowGeneration;
     this.dropSlot = { groupId: groupIdArg, index: indexArg };
-    void this.animateCardReflow(previousRects, generation);
+    void this.animateRowReflow(previousRects, generation);
   }
   clearDropSlot() {
     if (!this.dropSlot) return;
-    const previousRects = this.captureCardRects();
+    const previousRects = this.captureRowRects();
     const generation = ++this.reflowGeneration;
     this.dropSlot = void 0;
-    void this.animateCardReflow(previousRects, generation);
+    void this.animateRowReflow(previousRects, generation);
   }
   updateDragAutoScrollVelocity() {
     const container = this.scrollContainer;
@@ -180842,6 +180856,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       }
     }
     const selector = "[data-drop-group-id][data-drop-index][data-drop-kind]";
+    const dragging = this.draggingItem;
     let target;
     const offsets = this.dragAutoScrollVelocity === 0 ? [0, -8, 8, -16, 16, -32, 32] : [0, 8, 16, 32, 48, 64, 96].map(
       (value2) => value2 * (this.dragAutoScrollVelocity < 0 ? 1 : -1)
@@ -180849,7 +180864,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     for (const offset of offsets) {
       const hit = this.shadowRoot?.elementFromPoint(pointerX, pointerY + offset);
       const candidate = hit?.closest(selector);
-      if (candidate && candidate.dataset.sessionId !== this.draggingSessionId && Number(candidate.dataset.dropIndex) >= 0) {
+      if (candidate && !(dragging && candidate.dataset.itemKind === dragging.kind && candidate.dataset.itemId === dragging.id) && Number(candidate.dataset.dropIndex) >= 0) {
         target = candidate;
         break;
       }
@@ -180886,83 +180901,79 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     this.dragAutoScrollVelocity = 0;
     this.dragAutoScrollLastFrame = 0;
   }
-  createMoveDetail(sessionIdArg, groupIdArg, indexArg) {
-    const targetSessions = this.sortableSessions(this.sessionsForGroup(groupIdArg));
-    const beforeSessionId = targetSessions[Math.max(0, indexArg)]?.id;
-    const sourceGroupId = this.groups.find((group) => group.sessionIds.includes(sessionIdArg))?.id ?? null;
-    const sourceSessions = this.sortableSessions(this.sessionsForGroup(sourceGroupId), false);
-    const sourceIndex = sourceSessions.findIndex((session) => session.id === sessionIdArg);
-    const compatibilityIndex = sourceGroupId === groupIdArg && sourceIndex >= 0 && indexArg > sourceIndex ? indexArg + 1 : indexArg;
+  createMoveDetail(refArg, toGroupIdArg, indexArg, sourceArg) {
+    const targetItems = this.sortableItems(this.itemsForGroup(toGroupIdArg));
+    const beforeItem = targetItems[Math.max(0, indexArg)];
     return {
-      sessionId: sessionIdArg,
-      groupId: groupIdArg,
-      index: Math.max(0, compatibilityIndex),
-      ...beforeSessionId ? { beforeSessionId } : {}
+      item: itemRef(refArg),
+      fromGroupId: this.groupIdForItem(refArg),
+      toGroupId: toGroupIdArg,
+      beforeItem: beforeItem ? itemRef(beforeItem) : null,
+      source: sourceArg
     };
   }
-  handleKeyboardMove(eventArg, sessionArg, groupIdArg) {
+  emitItemMove(detailArg) {
+    this.dispatchEvent(
+      new CustomEvent("harness-item-move", { detail: detailArg, bubbles: true, composed: true })
+    );
+  }
+  handleKeyboardMove(eventArg, refArg, titleArg, groupIdArg) {
     if (!["ArrowUp", "ArrowDown", "Home", "End"].includes(eventArg.key)) return;
     eventArg.preventDefault();
     eventArg.stopPropagation();
-    const sessions = this.sortableSessions(this.sessionsForGroup(groupIdArg), false);
-    const sourceIndex = sessions.findIndex((session) => session.id === sessionArg.id);
+    const items = this.sortableItems(this.itemsForGroup(groupIdArg), false);
+    const sourceIndex = items.findIndex((item) => sameItem(item, refArg));
     if (sourceIndex < 0) return;
-    const sectionIds = [...this.groups.map((group) => group.id), null];
+    const sectionIds = [...this.effectiveGroups.map((group) => group.id), null];
     const sectionIndex = sectionIds.indexOf(groupIdArg);
-    const adjacentGroupId = eventArg.key === "ArrowUp" && sourceIndex === 0 && sectionIndex > 0 ? sectionIds[sectionIndex - 1] : eventArg.key === "ArrowDown" && sourceIndex === sessions.length - 1 && sectionIndex >= 0 && sectionIndex < sectionIds.length - 1 ? sectionIds[sectionIndex + 1] : void 0;
+    const adjacentGroupId = eventArg.key === "ArrowUp" && sourceIndex === 0 && sectionIndex > 0 ? sectionIds[sectionIndex - 1] : eventArg.key === "ArrowDown" && sourceIndex === items.length - 1 && sectionIndex >= 0 && sectionIndex < sectionIds.length - 1 ? sectionIds[sectionIndex + 1] : void 0;
     if (adjacentGroupId !== void 0) {
-      const targetSessions = this.sortableSessions(this.sessionsForGroup(adjacentGroupId), false);
-      const targetIndex2 = eventArg.key === "ArrowUp" ? targetSessions.length : 0;
-      const beforeSession2 = targetSessions[targetIndex2];
-      const detail2 = {
-        sessionId: sessionArg.id,
-        groupId: adjacentGroupId,
-        index: targetIndex2,
-        ...beforeSession2 ? { beforeSessionId: beforeSession2.id } : {}
-      };
-      const groupName = adjacentGroupId === null ? "Ungrouped" : this.groups.find((group) => group.id === adjacentGroupId)?.name ?? adjacentGroupId;
-      this.moveAnnouncement = `Moved ${sessionArg.title || sessionArg.id} to ${groupName}.`;
-      this.keyboardMoveFocus = { sessionId: sessionArg.id, groupId: adjacentGroupId };
-      this.dispatchEvent(
-        new CustomEvent("harness-session-move", { detail: detail2, bubbles: true, composed: true })
-      );
+      const targetItems = this.sortableItems(this.itemsForGroup(adjacentGroupId), false);
+      const targetIndex2 = eventArg.key === "ArrowUp" ? targetItems.length : 0;
+      const beforeItem2 = targetItems[targetIndex2];
+      const groupName = adjacentGroupId === null ? "Ungrouped" : this.effectiveGroups.find((group) => group.id === adjacentGroupId)?.name ?? adjacentGroupId;
+      this.moveAnnouncement = `Moved ${titleArg} to ${groupName}.`;
+      this.keyboardMoveFocus = { item: itemRef(refArg), groupId: adjacentGroupId };
+      this.emitItemMove({
+        item: itemRef(refArg),
+        fromGroupId: groupIdArg,
+        toGroupId: adjacentGroupId,
+        beforeItem: beforeItem2 ? itemRef(beforeItem2) : null,
+        source: "keyboard"
+      });
       return;
     }
-    const remaining = sessions.filter((session) => session.id !== sessionArg.id);
+    const remaining = items.filter((item) => !sameItem(item, refArg));
     const targetIndex = eventArg.key === "Home" ? 0 : eventArg.key === "End" ? remaining.length : eventArg.key === "ArrowUp" ? Math.max(0, sourceIndex - 1) : Math.min(remaining.length, sourceIndex + 1);
     if (targetIndex === sourceIndex) return;
-    const beforeSession = remaining[targetIndex];
-    const compatibilityIndex = targetIndex > sourceIndex ? targetIndex + 1 : targetIndex;
-    const detail = {
-      sessionId: sessionArg.id,
-      groupId: groupIdArg,
-      index: compatibilityIndex,
-      ...beforeSession ? { beforeSessionId: beforeSession.id } : {}
-    };
-    this.moveAnnouncement = beforeSession ? `Moved ${sessionArg.title || sessionArg.id} before ${beforeSession.title || beforeSession.id}.` : `Moved ${sessionArg.title || sessionArg.id} to the end.`;
-    this.dispatchEvent(
-      new CustomEvent("harness-session-move", { detail, bubbles: true, composed: true })
-    );
+    const beforeItem = remaining[targetIndex];
+    this.moveAnnouncement = beforeItem ? `Moved ${titleArg} before ${beforeItem.title}.` : `Moved ${titleArg} to the end.`;
+    this.emitItemMove({
+      item: itemRef(refArg),
+      fromGroupId: groupIdArg,
+      toGroupId: groupIdArg,
+      beforeItem: beforeItem ? itemRef(beforeItem) : null,
+      source: "keyboard"
+    });
   }
-  captureCardRects() {
+  rowKey(rowArg) {
+    return `${rowArg.dataset.itemKind}:${rowArg.dataset.itemId}`;
+  }
+  captureRowRects() {
     const result = /* @__PURE__ */ new Map();
-    for (const item of this.shadowRoot?.querySelectorAll(".item[data-session-id]") ?? []) {
-      if (item.dataset.sessionId === this.draggingSessionId) continue;
-      result.set(item.dataset.sessionId ?? "", item.getBoundingClientRect());
+    const draggingKey = this.draggingItem ? itemKey(this.draggingItem) : "";
+    for (const row of this.shadowRoot?.querySelectorAll("[data-item-kind][data-item-id]") ?? []) {
+      const key2 = this.rowKey(row);
+      if (key2 === draggingKey) continue;
+      result.set(key2, row.getBoundingClientRect());
     }
     return result;
   }
   restoreKeyboardMoveFocus() {
     const pending = this.keyboardMoveFocus;
     if (!pending) return;
-    const currentGroupId = this.groups.find(
-      (group) => group.sessionIds.includes(pending.sessionId)
-    )?.id ?? null;
-    if (currentGroupId !== pending.groupId) return;
-    const item = Array.from(
-      this.shadowRoot?.querySelectorAll(".item[data-session-id]") ?? []
-    ).find((candidate) => candidate.dataset.sessionId === pending.sessionId);
-    const handle3 = item?.querySelector(".dragHandle");
+    if (this.groupIdForItem(pending.item) !== pending.groupId) return;
+    const handle3 = this.rowElementFor(pending.item)?.querySelector(".dragHandle");
     if (handle3) {
       handle3.focus();
       this.keyboardMoveFocus = void 0;
@@ -180976,43 +180987,52 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       this.keyboardMoveFocus = void 0;
     }
   }
-  eligibleSessionIds(resourceIdArg) {
-    const knownSessionIds = new Set(this.sessions.map((session) => session.id));
+  /** Known, de-duplicated targets the host allows; an absent entry means unrestricted. */
+  eligibleTargets(resourceIdArg) {
+    const declared = this.eligibleTargetsByResourceId[resourceIdArg];
+    if (!declared) return void 0;
+    const itemsByKey = this.itemsByKey;
     const result = [];
     const seen = /* @__PURE__ */ new Set();
-    for (const sessionId of this.eligibleSessionIdsByResourceId[resourceIdArg] ?? []) {
-      if (!knownSessionIds.has(sessionId) || seen.has(sessionId)) continue;
-      seen.add(sessionId);
-      result.push(sessionId);
+    for (const target of declared) {
+      const key2 = target && itemKey(target);
+      if (!key2 || seen.has(key2) || !itemsByKey.has(key2) || sameItem(target, { kind: "resource", id: resourceIdArg })) continue;
+      seen.add(key2);
+      result.push(itemRef(target));
     }
     return result;
   }
-  sameSessionIds(firstArg, secondArg) {
-    return firstArg.size === secondArg.size && [...firstArg].every((sessionId) => secondArg.has(sessionId));
+  isResourceTargetEligible(resourceIdArg, targetArg) {
+    const eligible = this.eligibleTargets(resourceIdArg);
+    return eligible === void 0 || eligible.some((candidate) => sameItem(candidate, targetArg));
   }
-  isResourceTargetEligible(resourceIdArg, sessionIdArg) {
-    return this.eligibleSessionIds(resourceIdArg).includes(sessionIdArg);
+  itemTitleFor(refArg) {
+    return this.itemsByKey.get(itemKey(refArg))?.title ?? refArg.id;
   }
-  emitResource(nameArg, resourceArg, sessionIdArg) {
+  emitSession(nameArg, sessionArg) {
+    const detail = { session: sessionArg };
+    this.dispatchEvent(new CustomEvent(nameArg, { detail, bubbles: true, composed: true }));
+  }
+  emitResource(nameArg, resourceArg, targetArg) {
     const detail = {
       resource: resourceArg,
-      sessionId: sessionIdArg
+      target: targetArg
     };
     this.dispatchEvent(new CustomEvent(nameArg, { detail, bubbles: true, composed: true }));
   }
-  handleResourceContextKey(eventArg, resourceArg, sessionIdArg) {
+  handleResourceContextKey(eventArg, resourceArg, targetArg) {
     if (!(eventArg.key === "ContextMenu" || eventArg.key === "F10" && eventArg.shiftKey)) return;
     eventArg.preventDefault();
     eventArg.stopPropagation();
     this.emitResourceContext(
       eventArg,
       resourceArg,
-      sessionIdArg,
+      targetArg,
       "keyboard",
       eventArg.currentTarget
     );
   }
-  emitResourceContext(eventArg, resourceArg, sessionIdArg, sourceArg, focusTargetArg) {
+  emitResourceContext(eventArg, resourceArg, targetArg, sourceArg, focusTargetArg) {
     const rect = focusTargetArg.getBoundingClientRect();
     const contextGeneration = ++this.resourceContextGeneration;
     this.resourceContextResourceId = resourceArg.id;
@@ -181024,14 +181044,14 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     ].find((className) => focusTargetArg.classList.contains(className)) ?? "resourcePrimary";
     const detail = {
       resource: resourceArg,
-      sessionId: sessionIdArg,
+      target: targetArg,
       clientX: sourceArg === "pointer" && eventArg instanceof MouseEvent ? eventArg.clientX : rect.left + rect.width / 2,
       clientY: sourceArg === "pointer" && eventArg instanceof MouseEvent ? eventArg.clientY : rect.bottom,
       source: sourceArg,
       originalEvent: eventArg,
-      requestAssociation: /* @__PURE__ */ __name((toSessionIdArg) => this.requestResourceAssociation(
+      requestAssociation: /* @__PURE__ */ __name((toTargetArg) => this.requestResourceAssociation(
         resourceArg.id,
-        toSessionIdArg,
+        toTargetArg,
         sourceArg === "keyboard" ? "keyboard" : "action"
       ), "requestAssociation"),
       close: /* @__PURE__ */ __name(() => this.closeResourceContext(contextGeneration), "close")
@@ -181053,9 +181073,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
         focusTarget.focus();
         return;
       }
-      const row = Array.from(
-        this.shadowRoot?.querySelectorAll(".resourceRow[data-resource-id]") ?? []
-      ).find((candidate) => candidate.dataset.resourceId === resourceId);
+      const row = this.rowElementFor({ kind: "resource", id: resourceId });
       row?.querySelector(`.${focusClass || "resourcePrimary"}`)?.focus();
     });
   }
@@ -181072,40 +181090,41 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       this.pendingResourceAssociationRequest = void 0;
       return;
     }
-    const currentSessionId = this.acceptedResourceAssociations.get(pending.resourceId) ?? null;
-    if (currentSessionId !== pending.toSessionId) {
-      if (currentSessionId !== pending.fromSessionId) {
-        const controlledSession = currentSessionId ? this.sessionsById.get(currentSessionId)?.title ?? currentSessionId : "unattached";
-        this.moveAnnouncement = `Association request for ${pending.resourceTitle} was not applied; controlled association is ${controlledSession}.`;
+    const currentTarget = this.acceptedResourceAssociations.get(pending.resourceId) ?? null;
+    if (!sameItem(currentTarget, pending.toTarget) && !(currentTarget === null && pending.toTarget === null)) {
+      if (!sameItem(currentTarget, pending.fromTarget) && !(currentTarget === null && pending.fromTarget === null)) {
+        const controlledTitle = currentTarget ? this.itemTitleFor(currentTarget) : "unattached";
+        this.moveAnnouncement = `Association request for ${pending.resourceTitle} was not applied; controlled association is ${controlledTitle}.`;
         this.pendingResourceAssociationRequest = void 0;
       }
       return;
     }
-    const fromSession = pending.fromSessionId ? this.sessionsById.get(pending.fromSessionId)?.title ?? pending.fromSessionId : "";
-    const toSession = pending.toSessionId ? this.sessionsById.get(pending.toSessionId)?.title ?? pending.toSessionId : "";
-    this.moveAnnouncement = pending.intent === "attach" ? `${pending.resourceTitle} is now attached to ${toSession}.` : pending.intent === "detach" ? `${pending.resourceTitle} is now detached from ${fromSession}.` : `${pending.resourceTitle} is now reassigned from ${fromSession} to ${toSession}.`;
+    const fromTitle = pending.fromTarget ? this.itemTitleFor(pending.fromTarget) : "";
+    const toTitle = pending.toTarget ? this.itemTitleFor(pending.toTarget) : "";
+    this.moveAnnouncement = pending.intent === "attach" ? `${pending.resourceTitle} is now attached to ${toTitle}.` : pending.intent === "detach" ? `${pending.resourceTitle} is now detached from ${fromTitle}.` : `${pending.resourceTitle} is now reassigned from ${fromTitle} to ${toTitle}.`;
     this.pendingResourceAssociationRequest = void 0;
   }
   resourceAssociationAnnouncement(detailArg, completedArg) {
     const resourceTitle = detailArg.resource.title || detailArg.resource.id;
-    const fromTitle = detailArg.fromSessionId ? this.sessionsById.get(detailArg.fromSessionId)?.title ?? detailArg.fromSessionId : "";
-    const toTitle = detailArg.toSessionId ? this.sessionsById.get(detailArg.toSessionId)?.title ?? detailArg.toSessionId : "";
+    const fromTitle = detailArg.fromTarget ? this.itemTitleFor(detailArg.fromTarget) : "";
+    const toTitle = detailArg.toTarget ? this.itemTitleFor(detailArg.toTarget) : "";
     const verb = completedArg ? "completed" : "requested";
     return detailArg.intent === "attach" ? `Attach ${verb} for ${resourceTitle} to ${toTitle}.` : detailArg.intent === "detach" ? `Detach ${verb} for ${resourceTitle} from ${fromTitle}.` : `Reassign ${verb} for ${resourceTitle} from ${fromTitle} to ${toTitle}.`;
   }
-  async animateCardReflow(previousRectsArg, generationArg) {
+  async animateRowReflow(previousRectsArg, generationArg) {
     await this.updateComplete;
     if (generationArg !== this.reflowGeneration || !this.isConnected || globalThis.matchMedia?.("(prefers-reduced-motion: reduce)").matches) return;
     this.cancelReflowAnimations();
-    for (const item of this.shadowRoot?.querySelectorAll(".item[data-session-id]") ?? []) {
-      const sessionId = item.dataset.sessionId ?? "";
-      if (!sessionId || sessionId === this.draggingSessionId) continue;
-      const previous3 = previousRectsArg.get(sessionId);
+    const draggingKey = this.draggingItem ? itemKey(this.draggingItem) : "";
+    for (const row of this.shadowRoot?.querySelectorAll("[data-item-kind][data-item-id]") ?? []) {
+      const key2 = this.rowKey(row);
+      if (key2 === draggingKey) continue;
+      const previous3 = previousRectsArg.get(key2);
       if (!previous3) continue;
-      const current = item.getBoundingClientRect();
+      const current = row.getBoundingClientRect();
       const deltaY = previous3.top - current.top;
       if (Math.abs(deltaY) < 0.5) continue;
-      const animation = item.animate(
+      const animation = row.animate(
         [
           { transform: `translateY(${deltaY}px)` },
           { transform: "translateY(0)" }
@@ -181125,11 +181144,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
   finishPointerDrag(commitArg) {
     const gesture = this.pointerDragGesture;
     if (!gesture) return;
-    const sessionMoveDetail = gesture.type === "session" && commitArg && gesture.phase === "active" && this.dropSlot ? this.createMoveDetail(gesture.sessionId, this.dropSlot.groupId, this.dropSlot.index) : void 0;
-    const resourceRequest = gesture.type === "resource" && commitArg && gesture.phase === "active" && this.resourceDropTargetSessionId ? {
-      resourceId: gesture.resourceId,
-      toSessionId: this.resourceDropTargetSessionId
-    } : void 0;
+    const moveDetail = commitArg && gesture.phase === "active" && this.dropSlot ? this.createMoveDetail(gesture.item, this.dropSlot.groupId, this.dropSlot.index, "pointer") : void 0;
     this.pointerDragGesture = void 0;
     window.removeEventListener("keydown", this.handleDragKeyDown, true);
     window.removeEventListener("blur", this.handleDragWindowBlur);
@@ -181138,19 +181153,14 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
     this.cancelReflowAnimations();
     if (gesture.source.matches(":popover-open")) gesture.source.hidePopover();
     gesture.source.removeAttribute("popover");
-    gesture.source.classList.remove("dragging", "resourceDragging");
+    gesture.source.classList.remove("dragging");
     for (const property of [
       "--drag-preview-width",
       "--drag-preview-height",
       "--drag-preview-x",
-      "--drag-preview-y",
-      "--resource-drag-preview-width",
-      "--resource-drag-preview-x",
-      "--resource-drag-preview-y"
+      "--drag-preview-y"
     ]) gesture.source.style.removeProperty(property);
-    this.draggingSessionId = "";
-    this.draggingResourceId = "";
-    this.resourceDropTargetSessionId = "";
+    this.draggingItem = void 0;
     this.draggedItemHeight = 0;
     this.dropSlot = void 0;
     try {
@@ -181159,21 +181169,7 @@ var _DeesHarnessSessionList = class _DeesHarnessSessionList extends (_a100 = Dee
       }
     } catch {
     }
-    if (sessionMoveDetail) {
-      this.dispatchEvent(
-        new CustomEvent("harness-session-move", {
-          detail: sessionMoveDetail,
-          bubbles: true,
-          composed: true
-        })
-      );
-    }
-    if (resourceRequest) {
-      this.requestResourceAssociation(resourceRequest.resourceId, resourceRequest.toSessionId, "drop");
-    }
-  }
-  emit(name, session) {
-    this.dispatchEvent(new CustomEvent(name, { detail: { session }, bubbles: true, composed: true }));
+    if (moveDetail) this.emitItemMove(moveDetail);
   }
 };
 _init102 = __decoratorStart(_a100);
@@ -181183,15 +181179,13 @@ _loading5 = new WeakMap();
 _emptyText2 = new WeakMap();
 _groups3 = new WeakMap();
 _enableGrouping = new WeakMap();
-_ungroupedSessionIds2 = new WeakMap();
+_ungroupedItemIds2 = new WeakMap();
 _resources = new WeakMap();
 _resourceAssociations = new WeakMap();
 _selectedResourceId = new WeakMap();
-_eligibleSessionIdsByResourceId = new WeakMap();
+_eligibleTargetsByResourceId = new WeakMap();
 _search = new WeakMap();
-_draggingSessionId = new WeakMap();
-_draggingResourceId = new WeakMap();
-_resourceDropTargetSessionId = new WeakMap();
+_draggingItem = new WeakMap();
 _dropSlot = new WeakMap();
 _draggedItemHeight = new WeakMap();
 _expandedSessionIds = new WeakMap();
@@ -181206,15 +181200,13 @@ __decorateElement(_init102, 4, "loading", _loading_dec5, _DeesHarnessSessionList
 __decorateElement(_init102, 4, "emptyText", _emptyText_dec2, _DeesHarnessSessionList, _emptyText2);
 __decorateElement(_init102, 4, "groups", _groups_dec3, _DeesHarnessSessionList, _groups3);
 __decorateElement(_init102, 4, "enableGrouping", _enableGrouping_dec, _DeesHarnessSessionList, _enableGrouping);
-__decorateElement(_init102, 4, "ungroupedSessionIds", _ungroupedSessionIds_dec2, _DeesHarnessSessionList, _ungroupedSessionIds2);
+__decorateElement(_init102, 4, "ungroupedItemIds", _ungroupedItemIds_dec2, _DeesHarnessSessionList, _ungroupedItemIds2);
 __decorateElement(_init102, 4, "resources", _resources_dec, _DeesHarnessSessionList, _resources);
 __decorateElement(_init102, 4, "resourceAssociations", _resourceAssociations_dec, _DeesHarnessSessionList, _resourceAssociations);
 __decorateElement(_init102, 4, "selectedResourceId", _selectedResourceId_dec, _DeesHarnessSessionList, _selectedResourceId);
-__decorateElement(_init102, 4, "eligibleSessionIdsByResourceId", _eligibleSessionIdsByResourceId_dec, _DeesHarnessSessionList, _eligibleSessionIdsByResourceId);
+__decorateElement(_init102, 4, "eligibleTargetsByResourceId", _eligibleTargetsByResourceId_dec, _DeesHarnessSessionList, _eligibleTargetsByResourceId);
 __decorateElement(_init102, 4, "search", _search_dec, _DeesHarnessSessionList, _search);
-__decorateElement(_init102, 4, "draggingSessionId", _draggingSessionId_dec, _DeesHarnessSessionList, _draggingSessionId);
-__decorateElement(_init102, 4, "draggingResourceId", _draggingResourceId_dec, _DeesHarnessSessionList, _draggingResourceId);
-__decorateElement(_init102, 4, "resourceDropTargetSessionId", _resourceDropTargetSessionId_dec, _DeesHarnessSessionList, _resourceDropTargetSessionId);
+__decorateElement(_init102, 4, "draggingItem", _draggingItem_dec, _DeesHarnessSessionList, _draggingItem);
 __decorateElement(_init102, 4, "dropSlot", _dropSlot_dec, _DeesHarnessSessionList, _dropSlot);
 __decorateElement(_init102, 4, "draggedItemHeight", _draggedItemHeight_dec, _DeesHarnessSessionList, _draggedItemHeight);
 __decorateElement(_init102, 4, "expandedSessionIds", _expandedSessionIds_dec, _DeesHarnessSessionList, _expandedSessionIds);
@@ -181391,7 +181383,9 @@ __publicField(_DeesHarnessSessionList, "styles", [
           border-color var(--dees-transition-fast) var(--dees-ease-standard);
       }
 
-      .item.dragging {
+      /* One drag preview for both item kinds. */
+      .item.dragging,
+      .resourceRow.dragging {
         position: fixed;
         inset: 0 auto auto 0;
         width: var(--drag-preview-width);
@@ -181434,12 +181428,6 @@ __publicField(_DeesHarnessSessionList, "styles", [
         box-shadow: inset 3px 0 var(--card-accent);
       }
 
-      .item.resourceDropTarget {
-        outline: 2px solid var(--dees-color-accent-primary);
-        outline-offset: 2px;
-        box-shadow: 0 0 0 5px var(--dees-color-focus-ring), var(--dees-shadow-lg);
-      }
-
       .itemHeader {
         display: grid;
         grid-template-columns: minmax(0, 1fr) 30px 30px;
@@ -181616,75 +181604,31 @@ __publicField(_DeesHarnessSessionList, "styles", [
         font-size: var(--dees-font-caption2-size, 10px);
       }
 
-      .resourceDropLabel {
-        margin: 0 10px 10px;
-        padding: 6px 9px;
-        border-radius: var(--dees-radius-md);
-        background: color-mix(in srgb, var(--dees-color-accent-primary) 14%, transparent);
-        color: var(--dees-color-accent-primary);
-        font-size: var(--dees-font-caption1-size, 11px);
-        font-weight: 680;
-        text-align: center;
-      }
-
-      .resourceChildren {
-        display: grid;
-        gap: 4px;
-        margin: 0 8px 8px 24px;
-        padding: 0;
-        list-style: none;
-      }
-
-      .resourceSection {
-        margin-top: var(--dees-spacing-md);
-      }
-
-      .resourceSectionTitle {
-        margin: 0 0 7px;
-        padding: var(--dees-spacing-xs) 6px;
-        color: var(--dees-color-text-secondary);
-        font-size: var(--dees-font-caption1-size, 11px);
-        font-weight: 600;
-      }
-
-      .resourceList {
-        display: grid;
-        gap: var(--dees-spacing-sm);
-        margin: 0;
-        padding: 0;
-        list-style: none;
-      }
-
+      /* Resource rows are peers of session cards in the same ordered section. */
       .resourceRow {
+        position: relative;
         display: grid;
-        grid-template-columns: 26px minmax(0, 1fr) 38px;
+        grid-template-columns: minmax(0, 1fr) 38px;
         min-width: 0;
         overflow: hidden;
         border: 1px solid var(--dees-color-border-subtle);
         border-radius: var(--dees-radius-lg);
+        corner-shape: var(--dees-corner-shape);
         background: color-mix(in srgb, var(--dees-color-bg-secondary) 76%, transparent);
         color: var(--dees-color-text-primary);
         box-shadow: var(--dees-shadow-xs);
         box-sizing: border-box;
       }
 
+      .resourceRow.draggable {
+        grid-template-columns: 26px minmax(0, 1fr) 38px;
+      }
+
       .resourceRow.selected {
         border-color: var(--dees-color-accent-primary);
         background: color-mix(in srgb, var(--dees-color-accent-primary) 10%, var(--dees-color-bg-secondary));
       }
 
-      .resourceRow.resourceDragging {
-        position: fixed;
-        inset: 0 auto auto 0;
-        width: var(--resource-drag-preview-width);
-        max-width: none;
-        margin: 0;
-        opacity: 0.96;
-        pointer-events: none;
-        transform: translate3d(var(--resource-drag-preview-x), var(--resource-drag-preview-y), 0);
-        box-shadow: var(--dees-shadow-xl);
-      }
-
       .resourceDragHandle,
       .resourcePrimary,
       .resourceActions {
@@ -181696,22 +181640,7 @@ __publicField(_DeesHarnessSessionList, "styles", [
       }
 
       .resourceDragHandle {
-        display: grid;
-        place-items: center;
         min-width: 26px;
-        padding: 0;
-        color: var(--dees-color-text-muted);
-        cursor: grab;
-        touch-action: none;
-      }
-
-      .resourceDragHandle:disabled {
-        opacity: 0.35;
-        cursor: default;
-      }
-
-      .resourceDragHandle:not(:disabled):active {
-        cursor: grabbing;
       }
 
       .resourcePrimary {
@@ -181765,6 +181694,29 @@ __publicField(_DeesHarnessSessionList, "styles", [
         white-space: nowrap;
       }
 
+      /* Decorative marker for the controlled association; never interactive. */
+      .resourceAttachment {
+        display: flex;
+        min-width: 0;
+        align-items: center;
+        gap: 4px;
+        margin-top: 2px;
+        color: var(--dees-color-link);
+        font-size: var(--dees-font-caption2-size, 10px);
+        font-weight: 600;
+      }
+
+      .resourceAttachment dees-icon {
+        flex: 0 0 auto;
+      }
+
+      .resourceAttachmentName {
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
       .resourceActions {
         display: grid;
         place-items: center;
@@ -181802,7 +181754,7 @@ __publicField(_DeesHarnessSessionList, "styles", [
       .emptyDropZone {
         display: grid;
         place-items: center;
-        min-height: 46px;
+        overflow: hidden;
         border: 1px dashed color-mix(in srgb, var(--dees-color-accent-primary) 68%, transparent);
         border-radius: var(--dees-radius-xl);
         background: color-mix(in srgb, var(--dees-color-accent-primary) 8%, transparent);
@@ -181810,9 +181762,14 @@ __publicField(_DeesHarnessSessionList, "styles", [
         box-sizing: border-box;
       }
 
+      /* The placeholder matches the dragged row exactly; only the empty zone has a floor. */
+      .emptyDropZone {
+        min-height: 46px;
+      }
+
       .dropPlaceholder::after,
       .emptyDropZone::after {
-        content: 'Drop conversation here';
+        content: 'Drop here';
         font-size: var(--dees-font-caption2-size, 10px);
         font-weight: 650;
         letter-spacing: 0.02em;
@@ -181955,6 +181912,10 @@ __publicField(_DeesHarnessSessionList, "styles", [
         .expandToggle { margin: 0 3px 0 0; }
 
         .resourceRow {
+          grid-template-columns: minmax(0, 1fr) 44px;
+        }
+
+        .resourceRow.draggable {
           grid-template-columns: 44px minmax(0, 1fr) 44px;
         }
 
@@ -181971,10 +181932,6 @@ __publicField(_DeesHarnessSessionList, "styles", [
       }
 
       @media (max-width: 280px) {
-        .resourceChildren {
-          margin-left: 8px;
-        }
-
         .resourcePreview {
           display: none;
         }
@@ -182015,10 +181972,13 @@ init_dist_ts26();
 init_theme();
 init_services();
 var _disabled_dec10, _fontSize_dec, _a101, _DeesTerminalView_decorators, _init103, _fontSize, _disabled10;
+var maxPendingWriteBytes = 8 * 1024 * 1024;
+var RIS = "\x1Bc";
+var chunkByteLength = /* @__PURE__ */ __name((chunkArg) => typeof chunkArg === "string" ? chunkArg.length * 2 : chunkArg.byteLength, "chunkByteLength");
 _DeesTerminalView_decorators = [customElement("dees-terminal-view")];
 var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _fontSize_dec = [n5({ type: Number })], _disabled_dec10 = [n5({ type: Boolean })], _a101) {
   constructor() {
-    super(...arguments);
+    super();
     __privateAdd(this, _fontSize, __runInitializers(_init103, 8, this, 13)), __runInitializers(_init103, 11, this);
     __privateAdd(this, _disabled10, __runInitializers(_init103, 12, this, false)), __runInitializers(_init103, 15, this);
     __publicField(this, "terminal");
@@ -182026,45 +181986,138 @@ var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _f
     __publicField(this, "resizeObserver");
     __publicField(this, "inputDisposable");
     __publicField(this, "lastReportedSize", "");
-    // Output that arrives before xterm finished loading is replayed in order.
+    // Output that arrives before xterm is live is replayed in order, bounded by
+    // maxPendingWriteBytes and retained across a disconnect.
     __publicField(this, "pendingWrites", []);
+    __publicField(this, "pendingWriteBytes", 0);
+    __publicField(this, "pendingWritesDropped", false);
     __publicField(this, "setupPromise");
+    __publicField(this, "readyPending", true);
+    __publicField(this, "readyResolve", /* @__PURE__ */ __name(() => void 0, "readyResolve"));
+    __publicField(this, "readyReject", /* @__PURE__ */ __name(() => void 0, "readyReject"));
+    /**
+     * Resolves once the terminal of the current connection is live; a fresh
+     * promise is created for every connection. It rejects with the load error
+     * when xterm cannot be loaded (`terminal-error` carries the same error), and
+     * when the element is disconnected before the terminal came up.
+     */
+    __publicField(this, "ready");
+    this.ready = this.createReadyPromise();
+    this.registerStartupFunction(async (signalArg) => {
+      await this.ensureTerminal(signalArg);
+    });
+    this.registerGarbageFunction(() => {
+      this.teardownTerminal();
+    });
   }
   render() {
     return b2`<div class="terminalHost"></div>`;
   }
-  async firstUpdated() {
-    this.setupPromise = this.setupTerminal();
-    await this.setupPromise;
+  connectedCallback() {
+    if (!this.readyPending) this.ready = this.createReadyPromise();
+    return super.connectedCallback();
   }
   /** Feed remote output into the terminal; safe to call before setup finishes. */
   write(dataArg) {
-    if (this.terminal) {
-      this.terminal.write(dataArg);
-    } else {
-      this.pendingWrites.push(dataArg);
+    if (this.terminal && this.isConnected) {
+      this.writeToTerminal(this.terminal, dataArg);
+      return;
     }
+    this.bufferWrite(dataArg);
   }
   /** Reset the screen and scrollback, e.g. before a full replay. */
   clear() {
-    this.pendingWrites = [];
-    this.terminal?.reset();
+    const terminal = this.terminal;
+    if (terminal && this.isConnected) {
+      this.writeToTerminal(terminal, RIS);
+      return;
+    }
+    this.pendingWrites = [RIS];
+    this.pendingWriteBytes = chunkByteLength(RIS);
+    this.pendingWritesDropped = false;
   }
   focus() {
     this.terminal?.focus();
   }
-  /** Current grid size, or undefined while xterm is still loading. */
+  /** Current grid size, or undefined while no terminal is live. */
   get currentSize() {
     if (!this.terminal) return void 0;
     return { rows: this.terminal.rows, cols: this.terminal.cols };
   }
-  async setupTerminal() {
+  createReadyPromise() {
+    this.readyPending = true;
+    const promise = new Promise((resolveArg, rejectArg) => {
+      this.readyResolve = () => {
+        this.readyPending = false;
+        resolveArg();
+      };
+      this.readyReject = (reasonArg) => {
+        this.readyPending = false;
+        rejectArg(reasonArg);
+      };
+    });
+    promise.catch(() => void 0);
+    return promise;
+  }
+  bufferWrite(chunkArg) {
+    this.pendingWrites.push(chunkArg);
+    this.pendingWriteBytes += chunkByteLength(chunkArg);
+    while (this.pendingWriteBytes > maxPendingWriteBytes && this.pendingWrites.length > 1) {
+      const droppedChunk = this.pendingWrites.shift();
+      this.pendingWriteBytes -= chunkByteLength(droppedChunk);
+      this.pendingWritesDropped = true;
+    }
+  }
+  flushPendingWrites(terminalArg) {
+    const pending = this.pendingWrites;
+    const dropped = this.pendingWritesDropped;
+    this.pendingWrites = [];
+    this.pendingWriteBytes = 0;
+    this.pendingWritesDropped = false;
+    if (dropped && !this.writeToTerminal(terminalArg, RIS)) return;
+    for (const chunk of pending) {
+      if (!this.writeToTerminal(terminalArg, chunk)) return;
+    }
+  }
+  /** xterm throws at its own flow-control watermark; that has to reach the host. */
+  writeToTerminal(terminalArg, chunkArg) {
+    try {
+      terminalArg.write(chunkArg);
+      return true;
+    } catch (error) {
+      this.reportError(error);
+      return false;
+    }
+  }
+  reportError(errorArg) {
+    if (this.readyPending) this.readyReject(errorArg);
+    const detail = { error: errorArg };
+    this.dispatchEvent(
+      new CustomEvent("terminal-error", { detail, bubbles: true, composed: true })
+    );
+  }
+  ensureTerminal(signalArg) {
+    if (this.terminal) return Promise.resolve();
+    if (!this.setupPromise) this.setupPromise = this.setupTerminal(signalArg);
+    return this.setupPromise;
+  }
+  async setupTerminal(signalArg) {
+    try {
+      await this.createTerminal(signalArg);
+    } catch (error) {
+      this.reportError(error);
+    } finally {
+      if (!this.terminal) this.setupPromise = void 0;
+    }
+  }
+  async createTerminal(signalArg) {
+    await this.updateComplete;
     const libLoader = DeesServiceLibLoader.getInstance();
     const [xterm, fit] = await Promise.all([
       libLoader.loadXterm(),
       libLoader.loadXtermFitAddon()
     ]);
-    if (!this.isConnected) return;
+    if (signalArg.aborted || !this.isConnected) return;
     const host = this.shadowRoot?.querySelector(".terminalHost");
     if (!host) return;
     const computed2 = getComputedStyle(this);
@@ -182084,9 +182137,18 @@ var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _f
         cursor: themeColor("--dees-color-accent-primary", "#e6e6e6")
       }
     });
-    const fitAddon = new fit.FitAddon();
-    terminal.loadAddon(fitAddon);
-    terminal.open(host);
+    let fitAddon;
+    try {
+      fitAddon = new fit.FitAddon();
+      terminal.loadAddon(fitAddon);
+      terminal.open(host);
+    } catch (error) {
+      try {
+        terminal.dispose();
+      } catch {
+      }
+      throw error;
+    }
     this.terminal = terminal;
     this.fitAddon = fitAddon;
     this.inputDisposable = terminal.onData((dataArg) => {
@@ -182096,11 +182158,11 @@ var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _f
         new CustomEvent("terminal-input", { detail, bubbles: true, composed: true })
       );
     });
-    for (const pending of this.pendingWrites) terminal.write(pending);
-    this.pendingWrites = [];
+    this.flushPendingWrites(terminal);
     this.refit();
     this.resizeObserver = new ResizeObserver(() => this.refit());
     this.resizeObserver.observe(host);
+    this.readyResolve();
   }
   refit() {
     if (!this.terminal || !this.fitAddon) return;
@@ -182120,8 +182182,7 @@ var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _f
       new CustomEvent("terminal-resize", { detail, bubbles: true, composed: true })
     );
   }
-  async disconnectedCallback() {
-    await super.disconnectedCallback();
+  teardownTerminal() {
     this.resizeObserver?.disconnect();
     this.resizeObserver = void 0;
     this.inputDisposable?.dispose();
@@ -182129,7 +182190,13 @@ var _DeesTerminalView = class _DeesTerminalView extends (_a101 = DeesElement, _f
     this.terminal?.dispose();
     this.terminal = void 0;
     this.fitAddon = void 0;
-    this.pendingWrites = [];
+    this.lastReportedSize = "";
+    this.setupPromise = void 0;
+    if (this.readyPending) {
+      this.readyReject(
+        new Error("dees-terminal-view was disconnected before the terminal became ready")
+      );
+    }
   }
 };
 _init103 = __decoratorStart(_a101);
@@ -223678,7 +223745,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "10.0.0",
+  version: "11.0.0",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };
 
@@ -223889,6 +223956,7 @@ export {
   isInViewport,
   makeStreamingSimulator,
   markdownStyles,
+  maxPendingWriteBytes,
   mosaicEqualize,
   mosaicFindLeaf,
   mosaicFindLeafBySurface,