@design.estate/dees-catalog 5.0.0 → 6.0.0

package/dist_bundle/bundle.js

@@ -173566,6 +173566,7 @@ var markdownStyles = i`
 init_dist_ts26();
 var harnessCardStyles = i`
   .harness-card {
+    position: relative;
     border: 1px solid var(--dees-color-border-subtle);
     border-left: 2px solid var(--dees-color-border-default);
     border-radius: var(--dees-radius-lg);
@@ -173576,6 +173577,14 @@ var harnessCardStyles = i`
   .harness-card.status-running,
   .harness-card.status-pending {
     border-left-color: var(--dees-color-accent-primary);
+  }
+  .harness-card.status-running::before,
+  .harness-card.status-pending::before,
+  .harness-card.outcomeScan::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
     background:
       linear-gradient(
         105deg,
@@ -173584,9 +173593,13 @@ var harnessCardStyles = i`
         color-mix(in srgb, var(--dees-color-accent-primary) 20%, transparent) 50%,
         color-mix(in srgb, var(--dees-color-accent-primary) 6%, transparent) 55%,
         transparent 60%
-      ) 100% 0 / 250% 100% no-repeat,
-      var(--dees-color-bg-secondary);
+      ) 100% 0 / 250% 100% no-repeat;
     animation: harness-card-running-scan 2s linear infinite;
+    opacity: 1;
+    transition: opacity 0.18s var(--dees-ease-out);
+  }
+  .harness-card.outcomeScan::before {
+    opacity: 0;
   }
   .harness-card.status-completed {
     border-left-color: var(--dees-color-accent-success);
@@ -173606,13 +173619,19 @@ var harnessCardStyles = i`
   @media (prefers-reduced-motion: reduce) {
     .harness-card.status-running,
     .harness-card.status-pending {
-      animation: none;
       background: color-mix(
         in srgb,
         var(--dees-color-accent-primary) 8%,
         var(--dees-color-bg-secondary)
       );
     }
+    .harness-card.status-running::before,
+    .harness-card.status-pending::before,
+    .harness-card.outcomeScan::before {
+      animation: none;
+      opacity: 0;
+      transition: none;
+    }
   }
 `;
 var harnessPillStyles = i`
@@ -174246,7 +174265,6 @@ var demoFunc51 = /* @__PURE__ */ __name(() => b2`
     );
   }
 }}
-    @harness-toggle-sidebar=${() => console.log("harness-toggle-sidebar")}
     @harness-scratchpad-save=${(event) => console.log("harness-scratchpad-save", event.detail)}
     @harness-session-intelligence-ask=${(event) => {
   console.log("harness-session-intelligence-ask", event.detail);
@@ -175769,9 +175787,9 @@ var DeesHarnessToolFullscreen = _DeesHarnessToolFullscreen;
 init_dist_ts26();
 init_theme();
 init_dees_icon();
-var _returnFlash_dec, _bodyOverflowing_dec, _uncapped_dec, _bodyCapPx_dec, _outputExpanded_dec, _expanded_dec2, _toolRegistry_dec2, _call_dec2, _a80, _DeesHarnessToolCard_decorators, _init81, _call2, _toolRegistry2, _expanded2, _outputExpanded, _bodyCapPx, _uncapped, _bodyOverflowing, _returnFlash;
+var _outcomeScanTone_dec, _returnFlash_dec, _bodyOverflowing_dec, _uncapped_dec, _bodyCapPx_dec, _outputExpanded_dec, _expanded_dec2, _toolRegistry_dec2, _call_dec2, _a80, _DeesHarnessToolCard_decorators, _init81, _call2, _toolRegistry2, _expanded2, _outputExpanded, _bodyCapPx, _uncapped, _bodyOverflowing, _returnFlash, _outcomeScanTone;
 _DeesHarnessToolCard_decorators = [customElement("dees-harness-tool-card")];
-var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElement, _call_dec2 = [n5({ attribute: false })], _toolRegistry_dec2 = [n5({ attribute: false })], _expanded_dec2 = [r5()], _outputExpanded_dec = [r5()], _bodyCapPx_dec = [n5({ type: Number })], _uncapped_dec = [n5({ type: Boolean })], _bodyOverflowing_dec = [r5()], _returnFlash_dec = [r5()], _a80) {
+var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElement, _call_dec2 = [n5({ attribute: false })], _toolRegistry_dec2 = [n5({ attribute: false })], _expanded_dec2 = [r5()], _outputExpanded_dec = [r5()], _bodyCapPx_dec = [n5({ type: Number })], _uncapped_dec = [n5({ type: Boolean })], _bodyOverflowing_dec = [r5()], _returnFlash_dec = [r5()], _outcomeScanTone_dec = [r5()], _a80) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _call2, __runInitializers(_init81, 8, this, { id: "", name: "", status: "pending" })), __runInitializers(_init81, 11, this);
@@ -175782,6 +175800,7 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElemen
     __privateAdd(this, _uncapped, __runInitializers(_init81, 28, this, false)), __runInitializers(_init81, 31, this);
     __privateAdd(this, _bodyOverflowing, __runInitializers(_init81, 32, this, false)), __runInitializers(_init81, 35, this);
     __privateAdd(this, _returnFlash, __runInitializers(_init81, 36, this, false)), __runInitializers(_init81, 39, this);
+    __privateAdd(this, _outcomeScanTone, __runInitializers(_init81, 40, this, null)), __runInitializers(_init81, 43, this);
     __publicField(this, "bodyResizeObserver", null);
     __publicField(this, "observedBodyInner", null);
     __publicField(this, "fullscreenPortal", null);
@@ -175795,6 +175814,7 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElemen
       this.fullscreenPortal = portal;
     }, "openFullscreen"));
     __publicField(this, "flashFallbackTimeout", null);
+    __publicField(this, "outcomeScanFallbackTimeout", null);
     __publicField(this, "closeFullscreen", /* @__PURE__ */ __name(() => {
       const portal = this.fullscreenPortal;
       if (!portal) return;
@@ -175837,10 +175857,12 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElemen
     const statusTone = call.isError ? "error" : call.status === "completed" ? "success" : call.status;
     const duration = harnessFormatDuration(call.startedAt, call.finishedAt);
     return b2`
-      <div class="harness-card status-${call.isError ? "error" : call.status} ${descriptor.destructive ? "destructive" : ""} ${this.returnFlash ? "returnFlash" : ""}"
+      <div class="harness-card status-${call.isError ? "error" : call.status} ${descriptor.destructive ? "destructive" : ""} ${this.returnFlash ? "returnFlash" : ""} ${this.outcomeScanTone ? `outcomeScan outcomeScan-${this.outcomeScanTone}` : ""}"
         @animationend=${(event) => {
       if (event.animationName === "harness-card-return-flash") {
         this.endReturnFlash();
+      } else if (event.animationName === "harness-tool-outcome-scan") {
+        this.endOutcomeScan();
       }
     }}
       >
@@ -175898,8 +175920,35 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElemen
       composed: true
     }));
   }
+  startOutcomeScan(toneArg) {
+    if (this.outcomeScanFallbackTimeout) clearTimeout(this.outcomeScanFallbackTimeout);
+    this.outcomeScanTone = toneArg;
+    this.outcomeScanFallbackTimeout = setTimeout(() => this.endOutcomeScan(), 750);
+  }
+  endOutcomeScan() {
+    if (this.outcomeScanFallbackTimeout) {
+      clearTimeout(this.outcomeScanFallbackTimeout);
+      this.outcomeScanFallbackTimeout = null;
+    }
+    this.outcomeScanTone = null;
+  }
+  willUpdate(changedProperties) {
+    super.willUpdate(changedProperties);
+    const previousCall = changedProperties.get("call");
+    if (!previousCall || previousCall.id !== this.call.id) return;
+    const wasActive = previousCall.status === "pending" || previousCall.status === "running";
+    const outcomeTone = this.call.status === "error" || this.call.isError ? "error" : this.call.status === "completed" ? "success" : null;
+    if (wasActive && outcomeTone) {
+      this.startOutcomeScan(outcomeTone);
+    } else if (!outcomeTone && this.outcomeScanTone) {
+      this.endOutcomeScan();
+    }
+  }
   updated(changedProperties) {
     super.updated(changedProperties);
+    if (changedProperties.has("call") && this.fullscreenPortal) {
+      this.fullscreenPortal.call = this.enrichedCall;
+    }
     if (this.uncapped) return;
     const bodyInner = this.shadowRoot?.querySelector(".bodyInner") ?? null;
     if (bodyInner === this.observedBodyInner) return;
@@ -175921,6 +175970,10 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a80 = DeesElemen
       clearTimeout(this.flashFallbackTimeout);
       this.flashFallbackTimeout = null;
     }
+    if (this.outcomeScanFallbackTimeout) {
+      clearTimeout(this.outcomeScanFallbackTimeout);
+      this.outcomeScanFallbackTimeout = null;
+    }
     this.fullscreenPortal?.remove();
     this.fullscreenPortal = null;
     this.bodyResizeObserver?.disconnect();
@@ -176010,6 +176063,7 @@ _bodyCapPx = new WeakMap();
 _uncapped = new WeakMap();
 _bodyOverflowing = new WeakMap();
 _returnFlash = new WeakMap();
+_outcomeScanTone = new WeakMap();
 __decorateElement(_init81, 4, "call", _call_dec2, _DeesHarnessToolCard, _call2);
 __decorateElement(_init81, 4, "toolRegistry", _toolRegistry_dec2, _DeesHarnessToolCard, _toolRegistry2);
 __decorateElement(_init81, 4, "expanded", _expanded_dec2, _DeesHarnessToolCard, _expanded2);
@@ -176018,6 +176072,7 @@ __decorateElement(_init81, 4, "bodyCapPx", _bodyCapPx_dec, _DeesHarnessToolCard,
 __decorateElement(_init81, 4, "uncapped", _uncapped_dec, _DeesHarnessToolCard, _uncapped);
 __decorateElement(_init81, 4, "bodyOverflowing", _bodyOverflowing_dec, _DeesHarnessToolCard, _bodyOverflowing);
 __decorateElement(_init81, 4, "returnFlash", _returnFlash_dec, _DeesHarnessToolCard, _returnFlash);
+__decorateElement(_init81, 4, "outcomeScanTone", _outcomeScanTone_dec, _DeesHarnessToolCard, _outcomeScanTone);
 _DeesHarnessToolCard = __decorateElement(_init81, 0, "DeesHarnessToolCard", _DeesHarnessToolCard_decorators, _DeesHarnessToolCard);
 __name(_DeesHarnessToolCard, "DeesHarnessToolCard");
 __publicField(_DeesHarnessToolCard, "demo", demoFunc55);
@@ -176281,6 +176336,30 @@ __publicField(_DeesHarnessToolCard, "styles", [
         transform-origin: center;
       }
 
+      .harness-card.outcomeScan {
+        --harness-outcome-scan-color: var(--dees-color-accent-success);
+      }
+
+      .harness-card.outcomeScan-error {
+        --harness-outcome-scan-color: var(--dees-color-accent-error);
+      }
+
+      .harness-card.outcomeScan::after {
+        content: '';
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        background: linear-gradient(
+          105deg,
+          transparent 40%,
+          color-mix(in srgb, var(--harness-outcome-scan-color) 3%, transparent) 45%,
+          color-mix(in srgb, var(--harness-outcome-scan-color) 14%, transparent) 50%,
+          color-mix(in srgb, var(--harness-outcome-scan-color) 3%, transparent) 55%,
+          transparent 60%
+        ) 100% 0 / 250% 100% no-repeat;
+        animation: harness-tool-outcome-scan 0.48s linear 0.08s both;
+      }
+
       @keyframes harness-card-return-flash {
         0%, 100% {
           transform: scale(1);
@@ -176290,10 +176369,20 @@ __publicField(_DeesHarnessToolCard, "styles", [
         }
       }
 
+      @keyframes harness-tool-outcome-scan {
+        from { background-position: 100% 0; }
+        to { background-position: 0 0; }
+      }
+
       @media (prefers-reduced-motion: reduce) {
         .harness-card.returnFlash {
           animation: none;
         }
+
+        .harness-card.outcomeScan::after {
+          animation: none;
+          opacity: 0;
+        }
       }
     `
 ]);
@@ -178655,11 +178744,11 @@ var demoFunc62 = /* @__PURE__ */ __name(() => b2`
 init_dist_ts26();
 init_theme();
 init_dees_icon();
-var _intelligenceQuestion_dec, _scratchpadStale_dec, _scratchpadDirty_dec, _scratchpadDraftRevision_dec, _scratchpadDraft_dec, _disabled_dec6, _intelligenceError_dec, _intelligenceBusy_dec, _intelligenceExchanges_dec, _intelligenceEnabled_dec, _scratchpadError_dec, _scratchpadBusy_dec, _scratchpad_dec, _metrics_dec2, _showTasks_dec, _todos_dec2, _a87, _DeesHarnessSessionSidebar_decorators, _init88, _todos2, _showTasks, _metrics2, _scratchpad, _scratchpadBusy, _scratchpadError, _intelligenceEnabled, _intelligenceExchanges, _intelligenceBusy, _intelligenceError, _disabled6, _scratchpadDraft, _scratchpadDraftRevision, _scratchpadDirty, _scratchpadStale, _intelligenceQuestion;
+var _expandedSection_dec, _intelligenceQuestion_dec, _scratchpadStale_dec, _scratchpadDirty_dec, _scratchpadDraftRevision_dec, _scratchpadDraft_dec, _disabled_dec6, _intelligenceError_dec, _intelligenceBusy_dec, _intelligenceExchanges_dec, _intelligenceEnabled_dec, _scratchpadError_dec, _scratchpadBusy_dec, _scratchpad_dec, _metrics_dec2, _showTasks_dec, _todos_dec2, _a87, _DeesHarnessSessionSidebar_decorators, _init88, _todos2, _showTasks, _metrics2, _scratchpad, _scratchpadBusy, _scratchpadError, _intelligenceEnabled, _intelligenceExchanges, _intelligenceBusy, _intelligenceError, _disabled6, _scratchpadDraft, _scratchpadDraftRevision, _scratchpadDirty, _scratchpadStale, _intelligenceQuestion, _expandedSection;
 var { repeat: repeat5 } = directives_exports;
 var formatTokenCount = /* @__PURE__ */ __name((valueArg) => valueArg.toLocaleString("en-US"), "formatTokenCount");
 _DeesHarnessSessionSidebar_decorators = [customElement("dees-harness-session-sidebar")];
-var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87 = DeesElement, _todos_dec2 = [n5({ attribute: false })], _showTasks_dec = [n5({ type: Boolean })], _metrics_dec2 = [n5({ attribute: false })], _scratchpad_dec = [n5({ attribute: false })], _scratchpadBusy_dec = [n5({ type: Boolean })], _scratchpadError_dec = [n5()], _intelligenceEnabled_dec = [n5({ type: Boolean })], _intelligenceExchanges_dec = [n5({ attribute: false })], _intelligenceBusy_dec = [n5({ type: Boolean })], _intelligenceError_dec = [n5()], _disabled_dec6 = [n5({ type: Boolean })], _scratchpadDraft_dec = [r5()], _scratchpadDraftRevision_dec = [r5()], _scratchpadDirty_dec = [r5()], _scratchpadStale_dec = [r5()], _intelligenceQuestion_dec = [r5()], _a87) {
+var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87 = DeesElement, _todos_dec2 = [n5({ attribute: false })], _showTasks_dec = [n5({ type: Boolean })], _metrics_dec2 = [n5({ attribute: false })], _scratchpad_dec = [n5({ attribute: false })], _scratchpadBusy_dec = [n5({ type: Boolean })], _scratchpadError_dec = [n5()], _intelligenceEnabled_dec = [n5({ type: Boolean })], _intelligenceExchanges_dec = [n5({ attribute: false })], _intelligenceBusy_dec = [n5({ type: Boolean })], _intelligenceError_dec = [n5()], _disabled_dec6 = [n5({ type: Boolean })], _scratchpadDraft_dec = [r5()], _scratchpadDraftRevision_dec = [r5()], _scratchpadDirty_dec = [r5()], _scratchpadStale_dec = [r5()], _intelligenceQuestion_dec = [r5()], _expandedSection_dec = [r5()], _a87) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _todos2, __runInitializers(_init88, 8, this, [])), __runInitializers(_init88, 11, this);
@@ -178678,6 +178767,8 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
     __privateAdd(this, _scratchpadDirty, __runInitializers(_init88, 60, this, false)), __runInitializers(_init88, 63, this);
     __privateAdd(this, _scratchpadStale, __runInitializers(_init88, 64, this, false)), __runInitializers(_init88, 67, this);
     __privateAdd(this, _intelligenceQuestion, __runInitializers(_init88, 68, this, "")), __runInitializers(_init88, 71, this);
+    __privateAdd(this, _expandedSection, __runInitializers(_init88, 72, this)), __runInitializers(_init88, 75, this);
+    __publicField(this, "sectionStateInitialized", false);
     __publicField(this, "discardScratchpadDraft", /* @__PURE__ */ __name(() => {
       if (this.scratchpad) this.acceptScratchpad(this.scratchpad);
     }, "discardScratchpadDraft"));
@@ -178712,6 +178803,13 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
     }, "askIntelligence"));
   }
   willUpdate(changedPropertiesArg) {
+    const availableSections = this.availableSections;
+    if (!this.sectionStateInitialized && availableSections.length > 0) {
+      this.expandedSection = this.defaultExpandedSection;
+      this.sectionStateInitialized = true;
+    } else if (this.expandedSection !== void 0 && !availableSections.includes(this.expandedSection)) {
+      this.expandedSection = this.defaultExpandedSection;
+    }
     if (!changedPropertiesArg.has("scratchpad")) return;
     const next2 = this.scratchpad;
     if (!next2) {
@@ -178751,13 +178849,60 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
   get hasMetrics() {
     return Object.values(this.metrics).some((value2) => value2 !== void 0);
   }
-  renderTasks() {
+  get availableSections() {
+    return [
+      ...this.showTasks ? ["tasks"] : [],
+      ...this.hasMetrics ? ["metrics"] : [],
+      ...this.scratchpad ? ["scratchpad"] : [],
+      ...this.intelligenceEnabled ? ["intelligence"] : []
+    ];
+  }
+  get defaultExpandedSection() {
+    if (this.showTasks && this.todos.length > 0) return "tasks";
+    if (this.hasMetrics) return "metrics";
+    if (this.scratchpad) return "scratchpad";
+    if (this.intelligenceEnabled) return "intelligence";
+    return this.showTasks ? "tasks" : void 0;
+  }
+  renderSection(idArg, labelArg, iconArg, contentArg, summaryArg = "") {
+    const expanded = this.expandedSection === idArg;
+    const contentId = `harness-session-section-${idArg}`;
     return b2`
-      <section class="section tasksSection">
-        <dees-harness-todos heading="Tasks" .todos=${this.todos}></dees-harness-todos>
+      <section class=${`section ${idArg}Section ${expanded ? "expanded" : ""}`}>
+        <button
+          class="sectionHeading"
+          type="button"
+          aria-expanded=${String(expanded)}
+          aria-controls=${contentId}
+          @click=${() => {
+      this.sectionStateInitialized = true;
+      this.expandedSection = expanded ? void 0 : idArg;
+    }}
+        >
+          <dees-icon
+            icon=${expanded ? "lucide:ChevronDown" : "lucide:ChevronRight"}
+            iconSize="13"
+          ></dees-icon>
+          <dees-icon icon=${iconArg} iconSize="13"></dees-icon>
+          <span class="sectionHeadingText">${labelArg}</span>
+          ${summaryArg ? b2`<span class="sectionSummary">${summaryArg}</span>` : ""}
+        </button>
+        <div id=${contentId} class="sectionContent" ?hidden=${!expanded}>
+          ${contentArg}
+        </div>
       </section>
     `;
   }
+  renderTasks() {
+    const completed = this.todos.filter((todo) => todo.status === "completed").length;
+    return this.renderSection(
+      "tasks",
+      "Tasks",
+      "lucide:ListChecks",
+      b2`<dees-harness-todos .todos=${this.todos} .showProgress=${false}></dees-harness-todos>`,
+      this.todos.length > 0 ? `${completed}/${this.todos.length}` : ""
+    );
+  }
   renderMetrics() {
     const metrics2 = this.metrics;
     const percentage = this.contextPercentage;
@@ -178768,12 +178913,11 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
       ["Context window", metrics2.maxContextTokens],
       ["Current context", metrics2.currentContextTokens]
     ];
-    return b2`
-      <section class="section metricsSection">
-        <div class="sectionHeading">
-          <dees-icon icon="lucide:Gauge" iconSize="13"></dees-icon>
-          <span>Tokens</span>
-        </div>
+    return this.renderSection(
+      "metrics",
+      "Tokens",
+      "lucide:Gauge",
+      b2`
         <div class="metricList">
           ${rows.map(([label, value2]) => value2 === void 0 ? "" : b2`
             <div class="metricRow">
@@ -178796,37 +178940,32 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
             </div>
           `}
         </div>
-      </section>
-    `;
+      `
+    );
   }
   renderScratchpad() {
     const scratchpad2 = this.scratchpad;
-    const updatedBy = scratchpad2.updatedBy === "intelligence" ? "Session Intelligence" : "you";
-    return b2`
-      <section class="section scratchpadSection">
-        <div class="sectionHeading">
-          <dees-icon icon="lucide:NotebookPen" iconSize="13"></dees-icon>
-          <span>Session Scratchpad</span>
-        </div>
+    return this.renderSection(
+      "scratchpad",
+      "Session Scratchpad",
+      "lucide:NotebookPen",
+      b2`
         <textarea
           aria-label="Session scratchpad"
           maxlength="32768"
           .value=${this.scratchpadDraft}
           ?disabled=${this.disabled || this.scratchpadBusy}
           @input=${(event) => {
-      this.scratchpadDraft = event.currentTarget.value;
-      this.scratchpadDirty = this.scratchpadDraft !== scratchpad2.text;
-    }}
+        this.scratchpadDraft = event.currentTarget.value;
+        this.scratchpadDirty = this.scratchpadDraft !== scratchpad2.text;
+      }}
           @keydown=${(event) => {
-      if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
-        event.preventDefault();
-        this.saveScratchpad();
-      }
-    }}
+        if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+          event.preventDefault();
+          this.saveScratchpad();
+        }
+      }}
         ></textarea>
-        <div class="editorMeta">
-          Revision ${scratchpad2.revision}${scratchpad2.updatedAt ? ` \xB7 updated by ${updatedBy} ${new Date(scratchpad2.updatedAt).toLocaleString()}` : ""}
-        </div>
         ${this.scratchpadStale ? b2`
           <div class="conflict" role="status">
             A newer revision arrived. Keep this draft on the latest revision or discard it.
@@ -178847,7 +178986,8 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
           </div>
         ` : ""}
         ${this.scratchpadError ? b2`<div class="error" role="alert">${this.scratchpadError}</div>` : ""}
-        <div class="actions">
+        <div class="scratchpadFooter">
+          <span class="editorMeta">rev. ${scratchpad2.revision}</span>
           <dees-button
             size="sm"
             type="accent"
@@ -178857,56 +178997,60 @@ var _DeesHarnessSessionSidebar = class _DeesHarnessSessionSidebar extends (_a87
             @clicked=${this.saveScratchpad}
           ></dees-button>
         </div>
-      </section>
-    `;
+      `
+    );
   }
   renderIntelligence() {
-    return b2`
-      <section class="section intelligenceSection">
-        <div class="sectionHeading">
-          <dees-icon icon="lucide:Sparkles" iconSize="13"></dees-icon>
-          <span>Session Intelligence</span>
+    return this.renderSection(
+      "intelligence",
+      "Session Intelligence",
+      "lucide:Sparkles",
+      b2`
+        <div class="intelligenceHistory" role="log" aria-live="polite">
+          ${this.intelligenceExchanges.length ? b2`
+            <div class="exchangeList">
+              ${repeat5(
+        this.intelligenceExchanges,
+        (exchange) => exchange.id,
+        (exchange) => this.renderExchange(exchange)
+      )}
+            </div>
+          ` : b2`<div class="empty">Ask about this session without interrupting its main work.</div>`}
         </div>
-        ${this.intelligenceExchanges.length ? b2`
-          <div class="exchangeList" role="log" aria-live="polite">
-            ${repeat5(
-      this.intelligenceExchanges,
-      (exchange) => exchange.id,
-      (exchange) => this.renderExchange(exchange)
-    )}
+        <div class="intelligenceComposer">
+          <textarea
+            class="intelligenceInput"
+            aria-label="Ask Session Intelligence"
+            placeholder="Ask a parallel question…"
+            maxlength="8192"
+            rows="2"
+            .value=${this.intelligenceQuestion}
+            ?disabled=${this.disabled || this.intelligenceBusy}
+            @input=${(event) => {
+        this.intelligenceQuestion = event.currentTarget.value;
+      }}
+            @keydown=${(event) => {
+        if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+          event.preventDefault();
+          this.askIntelligence();
+        }
+      }}
+          ></textarea>
+          <div class="intelligenceControls">
+            <span class="hint">Parallel session · Ctrl/⌘ + Enter</span>
+            <dees-button
+              size="sm"
+              type="accent"
+              text="Ask"
+              .status=${this.intelligenceBusy ? "pending" : "normal"}
+              ?disabled=${this.disabled || this.intelligenceBusy || !this.intelligenceQuestion.trim()}
+              @clicked=${this.askIntelligence}
+            ></dees-button>
           </div>
-        ` : b2`<div class="empty">Ask about this session without interrupting its main work.</div>`}
-        <textarea
-          class="intelligenceInput"
-          aria-label="Ask Session Intelligence"
-          placeholder="Ask a parallel question…"
-          maxlength="8192"
-          .value=${this.intelligenceQuestion}
-          ?disabled=${this.disabled || this.intelligenceBusy}
-          @input=${(event) => {
-      this.intelligenceQuestion = event.currentTarget.value;
-    }}
-          @keydown=${(event) => {
-      if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
-        event.preventDefault();
-        this.askIntelligence();
-      }
-    }}
-        ></textarea>
-        <div class="hint">Runs separately from the main session. Ctrl/⌘ + Enter to ask.</div>
-        ${this.intelligenceError ? b2`<div class="error" role="alert">${this.intelligenceError}</div>` : ""}
-        <div class="actions">
-          <dees-button
-            size="sm"
-            type="accent"
-            text="Ask"
-            .status=${this.intelligenceBusy ? "pending" : "normal"}
-            ?disabled=${this.disabled || this.intelligenceBusy || !this.intelligenceQuestion.trim()}
-            @clicked=${this.askIntelligence}
-          ></dees-button>
+          ${this.intelligenceError ? b2`<div class="error" role="alert">${this.intelligenceError}</div>` : ""}
         </div>
-      </section>
-    `;
+      `
+    );
   }
   renderExchange(exchangeArg) {
     const answer = exchangeArg.status === "running" ? "Thinking in parallel\u2026" : exchangeArg.status === "error" ? exchangeArg.error || "Session Intelligence failed." : exchangeArg.answer || "";
@@ -178942,6 +179086,7 @@ _scratchpadDraftRevision = new WeakMap();
 _scratchpadDirty = new WeakMap();
 _scratchpadStale = new WeakMap();
 _intelligenceQuestion = new WeakMap();
+_expandedSection = new WeakMap();
 __decorateElement(_init88, 4, "todos", _todos_dec2, _DeesHarnessSessionSidebar, _todos2);
 __decorateElement(_init88, 4, "showTasks", _showTasks_dec, _DeesHarnessSessionSidebar, _showTasks);
 __decorateElement(_init88, 4, "metrics", _metrics_dec2, _DeesHarnessSessionSidebar, _metrics2);
@@ -178958,6 +179103,7 @@ __decorateElement(_init88, 4, "scratchpadDraftRevision", _scratchpadDraftRevisio
 __decorateElement(_init88, 4, "scratchpadDirty", _scratchpadDirty_dec, _DeesHarnessSessionSidebar, _scratchpadDirty);
 __decorateElement(_init88, 4, "scratchpadStale", _scratchpadStale_dec, _DeesHarnessSessionSidebar, _scratchpadStale);
 __decorateElement(_init88, 4, "intelligenceQuestion", _intelligenceQuestion_dec, _DeesHarnessSessionSidebar, _intelligenceQuestion);
+__decorateElement(_init88, 4, "expandedSection", _expandedSection_dec, _DeesHarnessSessionSidebar, _expandedSection);
 _DeesHarnessSessionSidebar = __decorateElement(_init88, 0, "DeesHarnessSessionSidebar", _DeesHarnessSessionSidebar_decorators, _DeesHarnessSessionSidebar);
 __name(_DeesHarnessSessionSidebar, "DeesHarnessSessionSidebar");
 __publicField(_DeesHarnessSessionSidebar, "demo", demoFunc62);
@@ -178967,8 +179113,10 @@ __publicField(_DeesHarnessSessionSidebar, "styles", [
   cssManager.defaultStyles,
   i`
       :host {
-        display: block;
+        display: flex;
+        flex-direction: column;
         min-width: 0;
+        min-height: 0;
         height: 100%;
         font-family: var(--dees-font-family);
         color: var(--dees-color-text-primary);
@@ -178977,32 +179125,206 @@ __publicField(_DeesHarnessSessionSidebar, "styles", [
       .sidebar {
         display: flex;
         flex-direction: column;
-        min-height: 100%;
+        min-height: 0;
+        height: 100%;
+        overflow: hidden;
       }
 
       .section {
-        padding: var(--dees-spacing-sm) var(--dees-spacing-md);
+        display: flex;
+        flex: 0 0 auto;
+        flex-direction: column;
+        min-height: 0;
+        overflow: hidden;
         border-bottom: 1px solid var(--dees-color-border-subtle);
       }
 
+      .section.expanded {
+        flex: 1 1 0;
+      }
+
       .section:last-child {
         border-bottom: 0;
       }
 
       .sectionHeading {
         display: flex;
+        flex: 0 0 auto;
         align-items: center;
         gap: var(--dees-spacing-xs);
-        margin-bottom: var(--dees-spacing-sm);
+        width: 100%;
+        min-height: 30px;
+        margin: 0;
+        padding: 6px var(--dees-spacing-md) 6px var(--dees-spacing-xs);
+        border: 0;
+        background: var(--dees-color-bg-secondary);
         color: var(--dees-color-text-primary);
+        font-family: inherit;
         font-size: var(--dees-font-control-size-sm, 12px);
         font-weight: 650;
+        text-align: left;
+        cursor: pointer;
+      }
+
+      .sectionHeading:hover {
+        background: var(--dees-color-badge-default-bg);
+      }
+
+      .sectionHeading:focus-visible {
+        position: relative;
+        z-index: 1;
+        outline: 2px solid var(--dees-color-accent-primary);
+        outline-offset: -2px;
       }
 
       .sectionHeading dees-icon {
+        flex: 0 0 auto;
+        color: var(--dees-color-text-secondary);
+      }
+
+      .sectionHeadingText {
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .sectionSummary {
+        flex: 0 0 auto;
+        margin-left: auto;
+        color: var(--dees-color-text-muted);
+        font-size: var(--dees-font-caption2-size, 10px);
+        font-variant-numeric: tabular-nums;
+        font-weight: 500;
+      }
+
+      .sectionContent {
+        flex: 1;
+        min-height: 0;
+        overflow-x: hidden;
+        overflow-y: auto;
+        padding: var(--dees-spacing-sm) var(--dees-spacing-md);
+        scrollbar-width: thin;
+        scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
+      }
+
+      .sectionContent[hidden] {
+        display: none;
+      }
+
+      .sectionContent dees-harness-todos {
+        min-width: 0;
+      }
+
+      .scratchpadSection .sectionContent:not([hidden]) {
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        padding: 0;
+      }
+
+      .scratchpadSection textarea {
+        flex: 1;
+        min-height: 0;
+        resize: none;
+        overflow-y: auto;
+        padding: var(--dees-spacing-sm) var(--dees-spacing-md);
+        border: 0;
+        border-radius: 0;
+        background: color-mix(in srgb, var(--dees-color-bg-secondary) 92%, black);
         color: var(--dees-color-text-secondary);
       }
 
+      .scratchpadSection textarea:focus-visible {
+        border-color: transparent;
+        background: color-mix(in srgb, var(--dees-color-bg-secondary) 92%, black);
+        box-shadow: none;
+      }
+
+      .scratchpadSection .conflict,
+      .scratchpadSection .error {
+        margin-right: var(--dees-spacing-md);
+        margin-left: var(--dees-spacing-md);
+      }
+
+      .scratchpadFooter {
+        display: flex;
+        flex: 0 0 auto;
+        align-items: center;
+        justify-content: space-between;
+        gap: var(--dees-spacing-sm);
+        padding: var(--dees-spacing-xs) var(--dees-spacing-md) var(--dees-spacing-sm);
+        border-top: 0;
+        background: linear-gradient(
+          to bottom,
+          color-mix(in srgb, var(--dees-color-bg-secondary) 92%, black),
+          var(--dees-color-bg-secondary)
+        );
+      }
+
+      .scratchpadFooter .editorMeta {
+        margin-top: 0;
+      }
+
+      .intelligenceSection .sectionContent:not([hidden]) {
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        padding: 0;
+      }
+
+      .intelligenceHistory {
+        flex: 1;
+        min-height: 0;
+        overflow-x: hidden;
+        overflow-y: auto;
+        padding: var(--dees-spacing-sm) var(--dees-spacing-md);
+        scrollbar-width: thin;
+        scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
+      }
+
+      .intelligenceComposer {
+        flex: 0 0 auto;
+        padding: var(--dees-spacing-sm) var(--dees-spacing-md) var(--dees-spacing-md);
+        background: linear-gradient(
+          to bottom,
+          var(--dees-color-bg-primary),
+          var(--dees-color-bg-secondary)
+        );
+        box-shadow: var(--dees-shadow-up-sm);
+      }
+
+      .intelligenceComposer textarea {
+        min-height: 64px;
+        max-height: 160px;
+        resize: none;
+        padding: var(--dees-spacing-sm) 0;
+        border: 0;
+        border-radius: 0;
+        background: transparent;
+        color: var(--dees-color-text-primary);
+        font-family: inherit;
+        font-size: var(--dees-font-control-size, 13px);
+      }
+
+      .intelligenceComposer textarea:focus-visible {
+        border-color: transparent;
+        box-shadow: none;
+        outline: 2px solid color-mix(in srgb, var(--dees-color-accent-primary) 55%, transparent);
+        outline-offset: 2px;
+      }
+
+      .intelligenceControls {
+        display: flex;
+        align-items: center;
+        gap: var(--dees-spacing-sm);
+      }
+
+      .intelligenceControls .hint {
+        flex: 1;
+        min-width: 0;
+      }
+
       .metricList {
         display: grid;
         gap: 6px;
@@ -179265,9 +179587,9 @@ var DeesHarnessUsage = _DeesHarnessUsage;
 init_dist_ts26();
 init_theme();
 init_dees_icon();
-var _toolRegistry_dec5, _modeOptions_dec2, _mode_dec3, _effortOptions_dec2, _reasoningEffort_dec2, _modelOptions_dec2, _model_dec2, _attachments_dec2, _composerValue_dec, _queuedCount_dec2, _busy_dec4, _disabled_dec7, _showTimestamps_dec2, _showRoles_dec2, _showToolbar_dec, _subheading_dec, _heading_dec6, _sessionSidebarOpen_dec, _intelligenceError_dec2, _intelligenceBusy_dec2, _intelligenceExchanges_dec2, _sessionIntelligenceEnabled_dec, _scratchpadError_dec2, _scratchpadBusy_dec2, _scratchpad_dec2, _sessionMetrics_dec, _showSessionSidebar_dec, _showTodosPanel_dec, _todos_dec3, _usage_dec2, _status_dec6, _questions_dec2, _permissions_dec2, _messages_dec2, _a89, _DeesHarnessChat_decorators, _init90, _messages2, _permissions2, _questions2, _status6, _usage2, _todos3, _showTodosPanel, _showSessionSidebar, _sessionMetrics, _scratchpad2, _scratchpadBusy2, _scratchpadError2, _sessionIntelligenceEnabled, _intelligenceExchanges2, _intelligenceBusy2, _intelligenceError2, _sessionSidebarOpen, _heading6, _subheading, _showToolbar, _showRoles2, _showTimestamps2, _disabled7, _busy4, _queuedCount2, _composerValue, _attachments2, _model2, _modelOptions2, _reasoningEffort2, _effortOptions2, _mode3, _modeOptions2, _toolRegistry5;
+var _toolRegistry_dec5, _modeOptions_dec2, _mode_dec3, _effortOptions_dec2, _reasoningEffort_dec2, _modelOptions_dec2, _model_dec2, _attachments_dec2, _composerValue_dec, _queuedCount_dec2, _busy_dec4, _disabled_dec7, _showTimestamps_dec2, _showRoles_dec2, _showToolbar_dec, _subheading_dec, _heading_dec6, _narrowSessionLayout_dec, _desktopSessionSidebarVisible_dec, _sessionSidebarOpen_dec, _intelligenceError_dec2, _intelligenceBusy_dec2, _intelligenceExchanges_dec2, _sessionIntelligenceEnabled_dec, _scratchpadError_dec2, _scratchpadBusy_dec2, _scratchpad_dec2, _sessionMetrics_dec, _showSessionSidebar_dec, _showTodosPanel_dec, _todos_dec3, _usage_dec2, _status_dec6, _questions_dec2, _permissions_dec2, _messages_dec2, _a89, _DeesHarnessChat_decorators, _init90, _messages2, _permissions2, _questions2, _status6, _usage2, _todos3, _showTodosPanel, _showSessionSidebar, _sessionMetrics, _scratchpad2, _scratchpadBusy2, _scratchpadError2, _sessionIntelligenceEnabled, _intelligenceExchanges2, _intelligenceBusy2, _intelligenceError2, _sessionSidebarOpen, _desktopSessionSidebarVisible, _narrowSessionLayout, _heading6, _subheading, _showToolbar, _showRoles2, _showTimestamps2, _disabled7, _busy4, _queuedCount2, _composerValue, _attachments2, _model2, _modelOptions2, _reasoningEffort2, _effortOptions2, _mode3, _modeOptions2, _toolRegistry5;
 _DeesHarnessChat_decorators = [customElement("dees-harness-chat")];
-var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _messages_dec2 = [n5({ attribute: false })], _permissions_dec2 = [n5({ attribute: false })], _questions_dec2 = [n5({ attribute: false })], _status_dec6 = [n5({ attribute: false })], _usage_dec2 = [n5({ attribute: false })], _todos_dec3 = [n5({ attribute: false })], _showTodosPanel_dec = [n5({ type: Boolean })], _showSessionSidebar_dec = [n5({ type: Boolean })], _sessionMetrics_dec = [n5({ attribute: false })], _scratchpad_dec2 = [n5({ attribute: false })], _scratchpadBusy_dec2 = [n5({ type: Boolean })], _scratchpadError_dec2 = [n5()], _sessionIntelligenceEnabled_dec = [n5({ type: Boolean })], _intelligenceExchanges_dec2 = [n5({ attribute: false })], _intelligenceBusy_dec2 = [n5({ type: Boolean })], _intelligenceError_dec2 = [n5()], _sessionSidebarOpen_dec = [r5()], _heading_dec6 = [n5()], _subheading_dec = [n5()], _showToolbar_dec = [n5({ type: Boolean })], _showRoles_dec2 = [n5({ type: Boolean })], _showTimestamps_dec2 = [n5({ type: Boolean })], _disabled_dec7 = [n5({ type: Boolean })], _busy_dec4 = [n5({ type: Boolean })], _queuedCount_dec2 = [n5({ type: Number })], _composerValue_dec = [n5()], _attachments_dec2 = [n5({ attribute: false })], _model_dec2 = [n5()], _modelOptions_dec2 = [n5({ attribute: false })], _reasoningEffort_dec2 = [n5()], _effortOptions_dec2 = [n5({ attribute: false })], _mode_dec3 = [n5()], _modeOptions_dec2 = [n5({ attribute: false })], _toolRegistry_dec5 = [n5({ attribute: false })], _a89) {
+var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _messages_dec2 = [n5({ attribute: false })], _permissions_dec2 = [n5({ attribute: false })], _questions_dec2 = [n5({ attribute: false })], _status_dec6 = [n5({ attribute: false })], _usage_dec2 = [n5({ attribute: false })], _todos_dec3 = [n5({ attribute: false })], _showTodosPanel_dec = [n5({ type: Boolean })], _showSessionSidebar_dec = [n5({ type: Boolean })], _sessionMetrics_dec = [n5({ attribute: false })], _scratchpad_dec2 = [n5({ attribute: false })], _scratchpadBusy_dec2 = [n5({ type: Boolean })], _scratchpadError_dec2 = [n5()], _sessionIntelligenceEnabled_dec = [n5({ type: Boolean })], _intelligenceExchanges_dec2 = [n5({ attribute: false })], _intelligenceBusy_dec2 = [n5({ type: Boolean })], _intelligenceError_dec2 = [n5()], _sessionSidebarOpen_dec = [r5()], _desktopSessionSidebarVisible_dec = [r5()], _narrowSessionLayout_dec = [r5()], _heading_dec6 = [n5()], _subheading_dec = [n5()], _showToolbar_dec = [n5({ type: Boolean })], _showRoles_dec2 = [n5({ type: Boolean })], _showTimestamps_dec2 = [n5({ type: Boolean })], _disabled_dec7 = [n5({ type: Boolean })], _busy_dec4 = [n5({ type: Boolean })], _queuedCount_dec2 = [n5({ type: Number })], _composerValue_dec = [n5()], _attachments_dec2 = [n5({ attribute: false })], _model_dec2 = [n5()], _modelOptions_dec2 = [n5({ attribute: false })], _reasoningEffort_dec2 = [n5()], _effortOptions_dec2 = [n5({ attribute: false })], _mode_dec3 = [n5()], _modeOptions_dec2 = [n5({ attribute: false })], _toolRegistry_dec5 = [n5({ attribute: false })], _a89) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _messages2, __runInitializers(_init90, 8, this, [])), __runInitializers(_init90, 11, this);
@@ -179287,24 +179609,31 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
     __privateAdd(this, _intelligenceBusy2, __runInitializers(_init90, 64, this, false)), __runInitializers(_init90, 67, this);
     __privateAdd(this, _intelligenceError2, __runInitializers(_init90, 68, this, "")), __runInitializers(_init90, 71, this);
     __privateAdd(this, _sessionSidebarOpen, __runInitializers(_init90, 72, this, false)), __runInitializers(_init90, 75, this);
-    __privateAdd(this, _heading6, __runInitializers(_init90, 76, this, "")), __runInitializers(_init90, 79, this);
-    __privateAdd(this, _subheading, __runInitializers(_init90, 80, this, "")), __runInitializers(_init90, 83, this);
-    __privateAdd(this, _showToolbar, __runInitializers(_init90, 84, this, true)), __runInitializers(_init90, 87, this);
-    __privateAdd(this, _showRoles2, __runInitializers(_init90, 88, this, true)), __runInitializers(_init90, 91, this);
-    __privateAdd(this, _showTimestamps2, __runInitializers(_init90, 92, this, true)), __runInitializers(_init90, 95, this);
-    __privateAdd(this, _disabled7, __runInitializers(_init90, 96, this, false)), __runInitializers(_init90, 99, this);
-    __privateAdd(this, _busy4, __runInitializers(_init90, 100, this, false)), __runInitializers(_init90, 103, this);
-    __privateAdd(this, _queuedCount2, __runInitializers(_init90, 104, this, 0)), __runInitializers(_init90, 107, this);
-    __privateAdd(this, _composerValue, __runInitializers(_init90, 108, this, "")), __runInitializers(_init90, 111, this);
-    __privateAdd(this, _attachments2, __runInitializers(_init90, 112, this, [])), __runInitializers(_init90, 115, this);
-    __privateAdd(this, _model2, __runInitializers(_init90, 116, this, "")), __runInitializers(_init90, 119, this);
-    __privateAdd(this, _modelOptions2, __runInitializers(_init90, 120, this, [])), __runInitializers(_init90, 123, this);
-    __privateAdd(this, _reasoningEffort2, __runInitializers(_init90, 124, this, "")), __runInitializers(_init90, 127, this);
-    __privateAdd(this, _effortOptions2, __runInitializers(_init90, 128, this, [])), __runInitializers(_init90, 131, this);
-    __privateAdd(this, _mode3, __runInitializers(_init90, 132, this, "")), __runInitializers(_init90, 135, this);
-    __privateAdd(this, _modeOptions2, __runInitializers(_init90, 136, this, [])), __runInitializers(_init90, 139, this);
-    __privateAdd(this, _toolRegistry5, __runInitializers(_init90, 140, this, DeesHarnessToolRegistry.default)), __runInitializers(_init90, 143, this);
+    __privateAdd(this, _desktopSessionSidebarVisible, __runInitializers(_init90, 76, this, true)), __runInitializers(_init90, 79, this);
+    __privateAdd(this, _narrowSessionLayout, __runInitializers(_init90, 80, this, false)), __runInitializers(_init90, 83, this);
+    __publicField(this, "sessionLayoutResizeObserver");
+    __privateAdd(this, _heading6, __runInitializers(_init90, 84, this, "")), __runInitializers(_init90, 87, this);
+    __privateAdd(this, _subheading, __runInitializers(_init90, 88, this, "")), __runInitializers(_init90, 91, this);
+    __privateAdd(this, _showToolbar, __runInitializers(_init90, 92, this, true)), __runInitializers(_init90, 95, this);
+    __privateAdd(this, _showRoles2, __runInitializers(_init90, 96, this, true)), __runInitializers(_init90, 99, this);
+    __privateAdd(this, _showTimestamps2, __runInitializers(_init90, 100, this, true)), __runInitializers(_init90, 103, this);
+    __privateAdd(this, _disabled7, __runInitializers(_init90, 104, this, false)), __runInitializers(_init90, 107, this);
+    __privateAdd(this, _busy4, __runInitializers(_init90, 108, this, false)), __runInitializers(_init90, 111, this);
+    __privateAdd(this, _queuedCount2, __runInitializers(_init90, 112, this, 0)), __runInitializers(_init90, 115, this);
+    __privateAdd(this, _composerValue, __runInitializers(_init90, 116, this, "")), __runInitializers(_init90, 119, this);
+    __privateAdd(this, _attachments2, __runInitializers(_init90, 120, this, [])), __runInitializers(_init90, 123, this);
+    __privateAdd(this, _model2, __runInitializers(_init90, 124, this, "")), __runInitializers(_init90, 127, this);
+    __privateAdd(this, _modelOptions2, __runInitializers(_init90, 128, this, [])), __runInitializers(_init90, 131, this);
+    __privateAdd(this, _reasoningEffort2, __runInitializers(_init90, 132, this, "")), __runInitializers(_init90, 135, this);
+    __privateAdd(this, _effortOptions2, __runInitializers(_init90, 136, this, [])), __runInitializers(_init90, 139, this);
+    __privateAdd(this, _mode3, __runInitializers(_init90, 140, this, "")), __runInitializers(_init90, 143, this);
+    __privateAdd(this, _modeOptions2, __runInitializers(_init90, 144, this, [])), __runInitializers(_init90, 147, this);
+    __privateAdd(this, _toolRegistry5, __runInitializers(_init90, 148, this, DeesHarnessToolRegistry.default)), __runInitializers(_init90, 151, this);
     __publicField(this, "toggleSessionSidebar", /* @__PURE__ */ __name(() => {
+      if (!this.narrowSessionLayout) {
+        this.desktopSessionSidebarVisible = !this.desktopSessionSidebarVisible;
+        return;
+      }
       if (this.sessionSidebarOpen) {
         void this.closeSessionSidebar();
         return;
@@ -179328,6 +179657,29 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
   scrollToBottom(force = false) {
     this.listElement?.scrollToBottom(force);
   }
+  async connectedCallback() {
+    await super.connectedCallback();
+    await this.updateComplete;
+    if (!this.isConnected) return;
+    this.syncSessionLayout(this.getBoundingClientRect().width);
+    this.sessionLayoutResizeObserver?.disconnect();
+    this.sessionLayoutResizeObserver = new ResizeObserver((entries) => {
+      const entry = entries[0];
+      if (entry) this.syncSessionLayout(entry.contentRect.width);
+    });
+    this.sessionLayoutResizeObserver.observe(this);
+  }
+  async disconnectedCallback() {
+    this.sessionLayoutResizeObserver?.disconnect();
+    this.sessionLayoutResizeObserver = void 0;
+    await super.disconnectedCallback();
+  }
+  syncSessionLayout(widthArg) {
+    const narrow = widthArg <= 680;
+    if (narrow === this.narrowSessionLayout) return;
+    this.narrowSessionLayout = narrow;
+    this.sessionSidebarOpen = false;
+  }
   get effectiveTodos() {
     if (this.todos.length) return this.todos;
     for (let index3 = this.messages.length - 1; index3 >= 0; index3--) {
@@ -179360,7 +179712,9 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
   async closeSessionSidebar() {
     this.sessionSidebarOpen = false;
     await this.updateComplete;
-    const toggleButton = this.shadowRoot?.querySelector(".sessionPanelToggle");
+    const toggleButton = this.shadowRoot?.querySelector(
+      this.showToolbar ? ".toolbarSessionPanelToggle" : ".sessionPanelToggle"
+    );
     toggleButton?.focus();
   }
   // ----------------------------------------------------------------- render
@@ -179386,7 +179740,7 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
                   <span class="composerContextTitle">${this.heading}</span>
                 </div>
               ` : ""}
-          ${this.hasSessionSidebar ? b2`
+          ${this.hasSessionSidebar && !this.showToolbar ? b2`
             <button
               class="sessionPanelToggle"
               type="button"
@@ -179411,11 +179765,13 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
               ></button>
               <aside
                 id="harness-session-panel"
-                class=${`todosPanel sessionPanel ${this.sessionSidebarOpen ? "open" : ""}`}
+                class=${`todosPanel sessionPanel ${this.sessionSidebarOpen ? "open" : ""} ${this.desktopSessionSidebarVisible ? "" : "desktopHidden"}`}
                 aria-label="Session details"
+                aria-hidden=${String(this.narrowSessionLayout ? !this.sessionSidebarOpen : !this.desktopSessionSidebarVisible)}
+                ?inert=${this.narrowSessionLayout ? !this.sessionSidebarOpen : !this.desktopSessionSidebarVisible}
                 tabindex="-1"
                 @keydown=${(event) => {
-      if (event.key !== "Escape") return;
+      if (event.key !== "Escape" || !this.narrowSessionLayout) return;
       event.preventDefault();
       event.stopPropagation();
       void this.closeSessionSidebar();
@@ -179486,21 +179842,26 @@ var _DeesHarnessChat = class _DeesHarnessChat extends (_a89 = DeesElement, _mess
         </div>
         <div class="toolbarActions">
           <dees-harness-usage compact .usage=${this.usage}></dees-harness-usage>
-          <dees-button
-            size="icon"
-            type="ghost"
-            icon="lucide:PanelLeft"
-            text="Toggle chat sidebar"
-            title="Toggle chat sidebar"
-            @clicked=${() => this.emit("harness-toggle-sidebar")}
-          ></dees-button>
+          ${this.hasSessionSidebar ? b2`
+            <button
+              class="toolbarSessionPanelToggle"
+              type="button"
+              aria-label="Toggle session details"
+              title="Toggle session details"
+              aria-expanded=${String(this.narrowSessionLayout ? this.sessionSidebarOpen : this.desktopSessionSidebarVisible)}
+              aria-controls="harness-session-panel"
+              @click=${this.toggleSessionSidebar}
+            >
+              <dees-icon
+                icon=${this.narrowSessionLayout ? this.sessionSidebarOpen ? "lucide:PanelRightClose" : "lucide:PanelRightOpen" : this.desktopSessionSidebarVisible ? "lucide:PanelRightClose" : "lucide:PanelRightOpen"}
+                iconSize="16"
+              ></dees-icon>
+            </button>
+          ` : ""}
         </div>
       </div>
     `;
   }
-  emit(name) {
-    this.dispatchEvent(new CustomEvent(name, { detail: {}, bubbles: true, composed: true }));
-  }
 };
 _init90 = __decoratorStart(_a89);
 _messages2 = new WeakMap();
@@ -179520,6 +179881,8 @@ _intelligenceExchanges2 = new WeakMap();
 _intelligenceBusy2 = new WeakMap();
 _intelligenceError2 = new WeakMap();
 _sessionSidebarOpen = new WeakMap();
+_desktopSessionSidebarVisible = new WeakMap();
+_narrowSessionLayout = new WeakMap();
 _heading6 = new WeakMap();
 _subheading = new WeakMap();
 _showToolbar = new WeakMap();
@@ -179554,6 +179917,8 @@ __decorateElement(_init90, 4, "intelligenceExchanges", _intelligenceExchanges_de
 __decorateElement(_init90, 4, "intelligenceBusy", _intelligenceBusy_dec2, _DeesHarnessChat, _intelligenceBusy2);
 __decorateElement(_init90, 4, "intelligenceError", _intelligenceError_dec2, _DeesHarnessChat, _intelligenceError2);
 __decorateElement(_init90, 4, "sessionSidebarOpen", _sessionSidebarOpen_dec, _DeesHarnessChat, _sessionSidebarOpen);
+__decorateElement(_init90, 4, "desktopSessionSidebarVisible", _desktopSessionSidebarVisible_dec, _DeesHarnessChat, _desktopSessionSidebarVisible);
+__decorateElement(_init90, 4, "narrowSessionLayout", _narrowSessionLayout_dec, _DeesHarnessChat, _narrowSessionLayout);
 __decorateElement(_init90, 4, "heading", _heading_dec6, _DeesHarnessChat, _heading6);
 __decorateElement(_init90, 4, "subheading", _subheading_dec, _DeesHarnessChat, _subheading);
 __decorateElement(_init90, 4, "showToolbar", _showToolbar_dec, _DeesHarnessChat, _showToolbar);
@@ -179614,21 +179979,32 @@ __publicField(_DeesHarnessChat, "styles", [
       .sessionPanel {
         flex: 0 0 232px;
         min-width: 0;
-        overflow-y: auto;
-        scrollbar-width: thin;
-        scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
-        padding: var(--dees-spacing-sm) var(--dees-spacing-md);
+        min-height: 0;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        padding: 0;
         border-left: 1px solid var(--dees-color-border-subtle);
         background: var(--dees-color-bg-secondary);
       }
 
+      .sessionPanel.desktopHidden {
+        display: none;
+      }
+
+      .sessionPanel > dees-harness-session-sidebar {
+        flex: 1;
+        min-height: 0;
+      }
+
       .sessionPanelClose,
       .sessionPanelToggle,
       .sessionPanelBackdrop {
         display: none;
       }
 
-      .sessionPanelToggle {
+      .sessionPanelToggle,
+      .toolbarSessionPanelToggle {
         box-sizing: border-box;
         width: var(--dees-control-height-lg);
         height: var(--dees-control-height-lg);
@@ -179643,11 +180019,17 @@ __publicField(_DeesHarnessChat, "styles", [
         cursor: pointer;
       }
 
-      .sessionPanelToggle:hover {
+      .toolbarSessionPanelToggle {
+        display: flex;
+      }
+
+      .sessionPanelToggle:hover,
+      .toolbarSessionPanelToggle:hover {
         background: var(--dees-color-badge-default-bg);
       }
 
-      .sessionPanelToggle:focus-visible {
+      .sessionPanelToggle:focus-visible,
+      .toolbarSessionPanelToggle:focus-visible {
         outline: 2px solid var(--dees-color-accent-primary);
         outline-offset: 2px;
       }
@@ -179658,9 +180040,10 @@ __publicField(_DeesHarnessChat, "styles", [
         .sessionPanel {
           position: absolute;
           inset: 0 0 0 auto;
+          display: flex;
           width: min(320px, calc(100% - 36px));
           max-width: none;
-          padding-top: 42px;
+          padding: 42px 0 0;
           border-left-color: var(--dees-color-border-default);
           box-shadow: var(--dees-shadow-lg);
           visibility: hidden;
@@ -179670,6 +180053,10 @@ __publicField(_DeesHarnessChat, "styles", [
             visibility 0s linear var(--dees-transition-default);
         }
 
+        .sessionPanel.desktopHidden {
+          display: flex;
+        }
+
         .sessionPanel.open {
           visibility: visible;
           transform: translateX(0);
@@ -203405,7 +203792,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "5.0.0",
+  version: "6.0.0",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };