clay-server 4.0.0-beta.8 → 4.0.0

package/lib/public/css/capsule-ui.css

@@ -384,6 +384,44 @@ textarea.tool-input { min-height: 92px; resize: vertical; }
   .tool-pagination { flex-wrap: wrap; justify-content: flex-start; }
 }
 
+/* Capsule engagement note in the Mate transcript: a quiet system line, not a
+   speech bubble, because no one typed it. */
+.home-capsule-turn-note {
+  align-self: center;
+  margin: 6px auto;
+  padding: 3px 12px;
+  border-radius: 999px;
+  background: color-mix(in srgb, var(--text-muted) 10%, transparent);
+  color: var(--text-muted);
+  font-size: 11.5px;
+  text-align: center;
+}
+
+/* Rich Display frame: the additive sandboxed element above the floor. */
+/* There is no global .hidden utility, so the capsule surfaces scope their own:
+   the frame stays invisible until its bridge reports ready, the floor hides
+   behind the toggle, and a cleared error leaves the screen. */
+.home-tool-frame-wrap.hidden,
+.home-tool-frame-toggle.hidden,
+.home-tool-display.hidden,
+.home-tool-error.hidden { display: none; }
+.home-tool-frame-wrap { width: 100%; }
+.home-tool-frame { display: block; width: 100%; min-height: 0; border: 0; border-radius: 10px; background: var(--bg); }
+.home-tool-frame-toggle {
+  display: block; margin: 6px 0 0 auto; padding: 3px 10px;
+  border: 1px solid var(--border-subtle); border-radius: 999px;
+  background: transparent; color: var(--text-muted); font-size: 11px; cursor: pointer;
+}
+.home-tool-frame-toggle:hover { color: var(--text); border-color: var(--accent); }
+
+/* Host-side attribution flash when the other seat's act changes state. */
+@keyframes capsule-remote-act-flash {
+  0% { box-shadow: 0 0 0 2px var(--accent); }
+  100% { box-shadow: 0 0 0 2px transparent; }
+}
+.capsule-remote-act { animation: capsule-remote-act-flash 0.8s ease-out; }
+
 @media (prefers-reduced-motion: reduce) {
   .tool-button, .tool-input, .tool-select { transition: none; }
+  .capsule-remote-act { animation: none; }
 }

package/lib/public/css/command-palette.css

@@ -486,7 +486,8 @@ body.mate-dm-active .search-clay-transcript .search-clay-message-user .bubble,
 .search-clay-activity-item small { color: var(--text-dimmer); font-size: 10px; line-height: 1.35; }
 @keyframes searchClaySpin { to { transform: rotate(360deg); } }
 
-.clayos-session-link {
+.clayos-session-link,
+.clayos-log-link {
   display: inline-flex;
   align-items: center;
   gap: 6px;
@@ -503,7 +504,8 @@ body.mate-dm-active .search-clay-transcript .search-clay-message-user .bubble,
   vertical-align: middle;
   cursor: pointer;
 }
-.clayos-session-link::before {
+.clayos-session-link::before,
+.clayos-log-link::before {
   content: "\2197";
   display: grid;
   place-items: center;
@@ -514,13 +516,21 @@ body.mate-dm-active .search-clay-transcript .search-clay-message-user .bubble,
   color: var(--accent);
   font-size: 12px;
 }
-.clayos-session-link > span { font-weight: 620; }
-.clayos-session-link > small { color: var(--text-muted); font-size: 10px; }
-.clayos-session-link:hover { border-color: color-mix(in srgb, var(--accent) 52%, var(--border)); background: color-mix(in srgb, var(--accent) 11%, var(--bg-alt)); }
-.clayos-session-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
-.clayos-session-link.is-loading { opacity: 0.62; cursor: progress; }
-.clayos-session-link.is-loading::before { animation: searchClaySpin 1.2s linear infinite; }
-.clayos-session-link.is-error { border-color: color-mix(in srgb, var(--warning) 48%, var(--border)); }
+.clayos-log-link::before { content: "\2261"; }
+.clayos-session-link > span,
+.clayos-log-link > span { font-weight: 620; }
+.clayos-session-link > small,
+.clayos-log-link > small { color: var(--text-muted); font-size: 10px; }
+.clayos-session-link:hover,
+.clayos-log-link:hover { border-color: color-mix(in srgb, var(--accent) 52%, var(--border)); background: color-mix(in srgb, var(--accent) 11%, var(--bg-alt)); }
+.clayos-session-link:focus-visible,
+.clayos-log-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.clayos-session-link.is-loading,
+.clayos-log-link.is-loading { opacity: 0.62; cursor: progress; }
+.clayos-session-link.is-loading::before,
+.clayos-log-link.is-loading::before { animation: searchClaySpin 1.2s linear infinite; }
+.clayos-session-link.is-error,
+.clayos-log-link.is-error { border-color: color-mix(in srgb, var(--warning) 48%, var(--border)); }
 
 .search-clay-pending {
   align-self: flex-start;

package/lib/public/css/git-placard.css

@@ -0,0 +1,154 @@
+/* Repository placard — the always-visible Git block directly under the tool
+   strip. Refined utilitarian: it borrows the panel's own surface tokens and
+   type scale so it reads as part of the sidebar chrome, and stays visually
+   subordinate to the tool tiles above it while remaining legible at a glance.
+   No new palette, no card shadow, no dashboard framing. */
+
+.git-placard {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  align-items: center;
+  gap: 6px;
+  margin: 2px 8px 0;
+  padding: 7px 7px 7px 8px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 8px;
+  background: var(--bg-alt);
+  cursor: pointer;
+  font-family: "Pretendard", "Twemoji", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+}
+
+.git-placard.hidden { display: none; }
+.git-placard:hover { border-color: var(--border); }
+
+.git-placard-body { min-width: 0; }
+
+.git-placard-identity {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+}
+
+.git-placard-glyph {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: var(--accent);
+}
+.git-placard-glyph svg { width: 13px; height: 13px; }
+
+.git-placard-names { display: block; min-width: 0; }
+
+.git-placard-repo {
+  display: block;
+  color: var(--text);
+  font-size: 11px;
+  font-weight: 700;
+  line-height: 1.3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.git-placard-branch {
+  display: block;
+  color: var(--text-muted);
+  font-size: 10px;
+  font-weight: 500;
+  line-height: 1.35;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.git-placard-meta {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: wrap;
+  margin: 5px 0 0 19px;
+}
+
+.git-placard-badge {
+  padding: 1px 5px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 999px;
+  background: var(--bg);
+  color: var(--text-dimmer);
+  font-size: 9px;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+.git-placard-badge-warn {
+  border-color: color-mix(in srgb, var(--warning) 38%, var(--border-subtle));
+  color: var(--warning);
+}
+
+.git-placard-stat {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  color: var(--text-dimmer);
+  font-size: 9px;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+  white-space: nowrap;
+}
+.git-placard-stat svg { width: 9px; height: 9px; }
+.git-placard-stat-active { color: var(--text-muted); }
+.git-placard-stat-warn { color: var(--error); }
+
+.git-placard-remote {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  margin: 4px 0 0 19px;
+  color: var(--text-dimmer);
+  font-size: 9px;
+  min-width: 0;
+}
+.git-placard-remote svg { width: 9px; height: 9px; flex-shrink: 0; }
+.git-placard-remote span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* The single focusable control in the block. Everything else is a pointer
+   convenience that forwards here, so keyboard users get one stop and one
+   action rather than a row of ambiguous targets. */
+.git-placard-more {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  align-self: center;
+  padding: 3px 5px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 6px;
+  background: var(--bg);
+  color: var(--text-dimmer);
+  font-family: inherit;
+  font-size: 9px;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  text-transform: uppercase;
+  cursor: pointer;
+  transition: color 140ms ease, border-color 140ms ease;
+}
+.git-placard-more svg { width: 10px; height: 10px; }
+.git-placard:hover .git-placard-more,
+.git-placard-more:hover { color: var(--text-muted); border-color: var(--border); }
+.git-placard-more:focus-visible {
+  outline: none;
+  border-color: var(--accent);
+  box-shadow: 0 0 0 2px var(--accent-25);
+  color: var(--text);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .git-placard-more { transition: none; }
+}

package/lib/public/css/home-hub.css

@@ -12,6 +12,10 @@ body.home-active #sidebar-overlay,
 body.home-active .title-bar-content,
 body.home-active #user-island { display: none !important; }
 
+body.capsules-disabled #home-tools-btn,
+body.capsules-disabled #home-dock-divider,
+body.capsules-disabled #home-tool-workbench { display: none !important; }
+
 body.home-active #main-area { border: 0; border-radius: 0; }
 
 body.home-surface-boot-pending #connect-overlay.hidden {

package/lib/public/css/home-session-actions.css

@@ -22,6 +22,72 @@
 .home-sidebar-recent-item .home-sidebar-recent-row:hover,
 .home-conversations-sheet-item .home-conversations-sheet-row:hover { background: transparent; }
 
+.home-conversations-driver-header {
+  display: flex;
+  align-items: stretch;
+}
+
+.home-conversations-driver-header > .home-conversations-sheet-item {
+  min-width: 0;
+  flex: 1;
+}
+
+.home-conversations-driver-toggle {
+  width: 32px;
+  padding: 0;
+  border: 0;
+  border-radius: 8px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: var(--text-dimmer);
+  background: transparent;
+  cursor: pointer;
+}
+
+.home-conversations-driver-toggle:hover,
+.home-conversations-driver-toggle:focus-visible {
+  color: var(--text);
+  background: rgba(var(--overlay-rgb), 0.05);
+  outline: none;
+}
+
+.home-conversations-driver-toggle .lucide {
+  width: 14px;
+  height: 14px;
+  transition: transform 0.15s ease;
+}
+
+.home-conversations-driver-toggle[aria-expanded="true"] .lucide {
+  transform: rotate(90deg);
+}
+
+.home-conversations-driver-header:not(:has(.home-conversations-sheet-item)) .home-conversations-driver-toggle {
+  width: 100%;
+  min-height: 38px;
+  padding: 0 10px;
+  justify-content: flex-start;
+  gap: 9px;
+  font: inherit;
+  font-size: 11px;
+  text-align: left;
+}
+
+.home-conversations-driver-header:not(:has(.home-conversations-sheet-item)) .home-conversations-driver-toggle span:first-of-type {
+  flex: 1;
+}
+
+.home-conversations-worker-children {
+  margin-left: 16px;
+  padding-left: 10px;
+  border-left: 1px solid color-mix(in srgb, var(--text-dimmer) 22%, transparent);
+}
+
+.home-conversations-worker-item .home-conversations-sheet-row {
+  padding-block: 8px;
+}
+
 .home-sidebar-recent-row:focus-visible,
 .home-conversations-sheet-row:focus-visible {
   position: relative;

package/lib/public/css/home-sidebar.css

@@ -478,6 +478,72 @@
   line-height: 1.45;
 }
 
+.home-sidebar-driver-header {
+  display: flex;
+  align-items: stretch;
+}
+
+.home-sidebar-driver-header > .home-sidebar-recent-item {
+  min-width: 0;
+  flex: 1;
+}
+
+.home-sidebar-driver-toggle {
+  width: 27px;
+  padding: 0;
+  border: 0;
+  border-radius: 7px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: var(--text-dimmer);
+  background: transparent;
+  cursor: pointer;
+}
+
+.home-sidebar-driver-toggle:hover,
+.home-sidebar-driver-toggle:focus-visible {
+  color: var(--text);
+  background: rgba(var(--overlay-rgb), 0.05);
+  outline: none;
+}
+
+.home-sidebar-driver-toggle .lucide {
+  width: 13px;
+  height: 13px;
+  transition: transform 0.15s ease;
+}
+
+.home-sidebar-driver-toggle[aria-expanded="true"] .lucide {
+  transform: rotate(90deg);
+}
+
+.home-sidebar-worker-children {
+  margin-left: 13px;
+  padding-left: 8px;
+  border-left: 1px solid color-mix(in srgb, var(--text-dimmer) 22%, transparent);
+}
+
+.home-sidebar-worker-item .home-sidebar-recent-row {
+  min-height: 38px;
+}
+
+.home-sidebar-orphan-toggle {
+  width: 100%;
+  min-height: 34px;
+  padding: 0 8px;
+  justify-content: flex-start;
+  gap: 7px;
+  font: inherit;
+  font-size: 11px;
+  text-align: left;
+}
+
+.home-sidebar-orphan-toggle span:first-of-type {
+  flex: 1;
+}
+
 .home-sidebar-expand {
   position: absolute;
   top: 8px;

package/lib/public/css/input.css

@@ -52,11 +52,32 @@
   background: var(--bg-alt);
   border: 1px solid var(--border);
   border-radius: 10px;
-  padding: 6px 10px;
+  padding: 0;
   font-size: 12px;
   max-width: 200px;
 }
 
+.pasted-chip-open {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+  padding: 6px 4px 6px 10px;
+  border: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+}
+
+.pasted-chip-open:hover .pasted-chip-preview,
+.pasted-chip-open:focus-visible .pasted-chip-preview { color: var(--text); }
+
+.pasted-chip-open:focus-visible,
+.pasted-chip-remove:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 1px;
+}
+
 .pasted-chip-preview {
   color: var(--text-muted);
   overflow: hidden;
@@ -87,6 +108,7 @@
   cursor: pointer;
   padding: 0;
   flex-shrink: 0;
+  margin-right: 6px;
 }
 
 .pasted-chip-remove .lucide { width: 12px; height: 12px; }
@@ -156,6 +178,59 @@
   min-height: 0;
 }
 
+.paste-modal-editor,
+.paste-modal-footer { display: none; }
+
+.paste-modal-editing .paste-modal-body { display: none; }
+
+.paste-modal-editing .paste-modal-editor {
+  display: block;
+  width: 100%;
+  min-height: min(52vh, 420px);
+  resize: vertical;
+  border: 0;
+  border-radius: 0;
+  outline: 0;
+  padding: 16px 20px;
+  background: var(--bg);
+  color: var(--text-secondary);
+  font-family: "Roboto Mono", monospace;
+  font-size: 13px;
+  line-height: 1.55;
+}
+
+.paste-modal-editing .paste-modal-editor:focus {
+  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent) 55%, transparent);
+}
+
+.paste-modal-editing .paste-modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  padding: 12px 16px;
+  border-top: 1px solid var(--border-subtle);
+}
+
+.paste-modal-cancel,
+.paste-modal-save {
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  padding: 7px 12px;
+  font: inherit;
+  cursor: pointer;
+}
+
+.paste-modal-cancel {
+  background: transparent;
+  color: var(--text-secondary);
+}
+
+.paste-modal-save {
+  border-color: var(--accent);
+  background: var(--accent);
+  color: var(--accent-text, white);
+}
+
 /* --- File chips (input preview) --- */
 .file-chip {
   display: inline-flex;
@@ -286,9 +361,11 @@
 #context-sources-add {
   display: inline-flex;
   align-items: center;
-  gap: 3px;
+  justify-content: center;
+  position: relative;
+  width: 36px;
   height: 36px;
-  padding: 0 10px;
+  padding: 0;
   border-radius: 18px;
   border: none;
   background: transparent;
@@ -322,6 +399,9 @@
   font-size: 10px;
   font-weight: 700;
   line-height: 1;
+  position: absolute;
+  top: 0;
+  right: -1px;
 }
 
 .context-chip {
@@ -1270,6 +1350,7 @@
    Attach (files/images -> path injection) and voice input stay available. */
 body.tui-composer-active #schedule-btn,
 body.tui-composer-active #ask-mate-btn,
+body.tui-composer-active .composer-session-action,
 body.tui-composer-active #active-vendor-indicator,
 body.tui-composer-active #config-chip-wrap {
   display: none !important;

package/lib/public/css/messages.css

@@ -693,6 +693,8 @@ pre.mermaid-error {
 
 .thinking-header {
   display: inline-flex;
+  max-width: 100%;
+  box-sizing: border-box;
   align-items: center;
   gap: 6px;
   cursor: pointer;
@@ -726,9 +728,44 @@ pre.mermaid-error {
 .thinking-label {
   font-size: 13px;
   color: var(--text-muted);
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
+.thinking-live .thinking-header {
+  padding: 6px 0;
+  background: transparent;
+  border-radius: 0;
+}
+
+.thinking-live .thinking-chevron { display: none; }
+
+.thinking-live .thinking-label {
+  background: linear-gradient(100deg, var(--text-muted) 40%, var(--text-dimmer) 50%, var(--text-muted) 60%);
+  background-size: 300% 100%;
+  background-clip: text;
+  -webkit-background-clip: text;
+  color: transparent;
+  animation: thinking-summary-shimmer 2.8s ease-in-out infinite;
+}
+
+@keyframes thinking-summary-shimmer {
+  from { background-position: 100% 0; }
+  to { background-position: 0% 0; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .thinking-live .thinking-label { animation: none; background: none; color: var(--text-muted); }
+}
+
+.thinking-header[aria-disabled="true"] { cursor: default; }
+.thinking-header:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.thinking-item .thinking-spinner { display: none; }
+
 .thinking-duration {
+  flex-shrink: 0;
   color: var(--text-dimmer);
   font-size: 12px;
 }
@@ -753,7 +790,7 @@ pre.mermaid-error {
   font-size: 13px;
   line-height: 1.55;
   color: var(--text-muted);
-  white-space: pre-wrap;
+  white-space: normal;
   word-break: break-word;
   max-height: 300px;
   overflow-y: auto;
@@ -762,6 +799,8 @@ pre.mermaid-error {
 }
 
 .thinking-item.expanded .thinking-content { display: block; }
+.thinking-content > :first-child { margin-top: 0; }
+.thinking-content > :last-child { margin-bottom: 0; }
 
 /* ==========================================================================
    Tool Items

package/lib/public/css/mobile-nav.css

@@ -612,6 +612,86 @@
     font-weight: 600;
   }
 
+  .mobile-driver-header {
+    display: flex;
+    align-items: center;
+  }
+
+  .mobile-driver-header > .mobile-session-item {
+    min-width: 0;
+    flex: 1;
+  }
+
+  .mobile-driver-toggle {
+    width: 32px;
+    height: 44px;
+    padding: 0;
+    border: 0;
+    border-radius: 8px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-dimmer);
+    background: transparent;
+  }
+
+  .mobile-driver-toggle .lucide,
+  .mobile-orphan-toggle .lucide {
+    width: 15px;
+    height: 15px;
+    transition: transform 0.15s ease;
+  }
+
+  .mobile-driver-toggle[aria-expanded="true"] .lucide,
+  .mobile-orphan-toggle[aria-expanded="true"] .lucide {
+    transform: rotate(90deg);
+  }
+
+  .mobile-worker-children {
+    margin-left: 16px;
+    padding-left: 12px;
+    border-left: 1px solid color-mix(in srgb, var(--text-dimmer) 24%, transparent);
+  }
+
+  .mobile-worker-item {
+    min-height: 43px;
+    padding-block: 9px;
+  }
+
+  .mobile-worker-generation {
+    flex-shrink: 0;
+    padding: 2px 6px;
+    border-radius: 999px;
+    color: var(--text-dimmer);
+    background: rgba(var(--overlay-rgb), 0.04);
+    font-size: 10px;
+    font-weight: 650;
+  }
+
+  .mobile-worker-generation.current {
+    color: var(--success);
+    background: color-mix(in srgb, var(--success) 10%, transparent);
+  }
+
+  .mobile-orphan-toggle {
+    width: 100%;
+    min-height: 42px;
+    padding: 8px 12px;
+    border: 0;
+    border-radius: 9px;
+    display: flex;
+    align-items: center;
+    gap: 9px;
+    color: var(--text-dimmer);
+    background: transparent;
+    font: inherit;
+    text-align: left;
+  }
+
+  .mobile-orphan-toggle span:first-of-type {
+    flex: 1;
+  }
+
   .mobile-session-title {
     flex: 1;
     display: inline-flex;