@abot-ai/runtime 1.8.1 → 2.0.0

package/dist/src/web-ui/app/styles/11-workspace-header-width.css

@@ -24,7 +24,7 @@
 
 /* Primary headers share one height and title style on every page. */
 .app-shell {
-  --workspace-header-height: 64px;
+  --workspace-header-height: 32px;
 }
 
 .home-workspace-header,
@@ -36,7 +36,7 @@
   flex-shrink: 0;
   align-items: center;
   align-content: center;
-  padding-block: 6px;
+  padding-block: 1px;
 }
 
 .home-workspace-header h1,
@@ -44,12 +44,35 @@
 .chat-header h2 {
   margin: 0;
   font-family: var(--font-display);
-  font-size: var(--font-size-4xl);
+  font-size: var(--font-size-md);
   font-weight: 400;
-  line-height: 1.25;
+  line-height: 16px;
   letter-spacing: -0.015em;
 }
 
+/* Keep header actions readable inside the smaller shared row. */
+.home-workspace-header > button,
+.workspace-page-header > button,
+.workspace-page-header .toolbar-actions button,
+.sidebar-topline .icon-button {
+  height: 24px;
+  min-height: 24px;
+  padding: 1px 6px;
+  font-size: var(--font-size-xs);
+  line-height: 18px;
+}
+.home-workspace-header .home-notifications-entry { white-space: nowrap; }
+.home-notifications-entry > span:not([aria-hidden]) { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
+.sidebar-topline .icon-button { width: 24px; min-width: 24px; padding: 0; }
+.sidebar-topline .icon-button svg { width: 15px; height: 15px; }
+#sessionsHeading { font-size: var(--font-size-sm); line-height: 16px; }
+.workspace-page-header .toolbar-actions { gap: 4px; }
+.workspace-page-header .workspace-page-heading { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
+.workspace-page-header .workspace-page-heading h2 { min-width: 0; order: -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.chat-header .chat-heading-copy { gap: 0; }
+.chat-header .current-project-context { font-size: 10px; line-height: 11px; }
+.workspace-page-header .product-site-link { font-size: 10px; line-height: 14px; }
+
 /* Join the brand, navigation and workspace at the shared baseline. */
 @media (min-width: 761px) {
   .workspace-rail {
@@ -67,18 +90,14 @@
   }
 
   .workspace-brand img {
-    width: 36px;
-    height: 36px;
+    width: 18px;
+    height: 18px;
   }
 
-  .workspace-rail::before,
-  .workspace-rail::after {
+  .workspace-rail::before {
     position: absolute;
     content: "";
     pointer-events: none;
-  }
-
-  .workspace-rail::before {
     top: calc(var(--workspace-header-height) - 1px);
     right: -1px;
     left: 0;
@@ -86,19 +105,6 @@
     background: var(--line);
   }
 
-  .workspace-rail::after {
-    top: calc(var(--workspace-header-height) - 61px);
-    right: -100px;
-    width: 200px;
-    height: 120px;
-    background: radial-gradient(
-      ellipse,
-      color-mix(in srgb, var(--accent) 10%, transparent),
-      transparent 70%
-    );
-    filter: blur(18px);
-  }
-
   .app-shell .sessions-panel {
     padding-top: 0;
   }
@@ -114,8 +120,14 @@
 
 @media (max-width: 760px) {
   .app-shell {
-    --workspace-header-height: 56px;
+    --workspace-header-height: 28px;
   }
+  .home-workspace-header h1,
+  .workspace-page-header h2,
+  .chat-header h2 { font-size: var(--font-size-sm); line-height: 14px; }
+  .chat-header .current-project-context { font-size: 9px; line-height: 10px; }
+  .workspace-page-header { gap: 8px; }
+  .workspace-page-header .workspace-page-heading { gap: 6px; }
 }
 
 /* Keep narrow-screen header actions clear of the shared title. */

package/dist/src/web-ui/app/styles/12-conversation-sidebar.css

@@ -14,23 +14,40 @@
   min-height: 34px;
 }
 
-.sessions-section {
+.session-navigation-tools {
+  order: 1;
+  display: grid;
+  flex-shrink: 0;
   gap: 8px;
+  padding-block: 0 6px;
+  border-bottom: 1px solid var(--line);
 }
 
-.sessions-list-label {
-  font-size: var(--font-size-sm);
+.sessions-section {
+  grid-template-rows: minmax(0, 1fr);
+  gap: 0;
 }
 
-.session-search input {
+.session-search[hidden] {
+  display: none;
+}
+
+.session-search input,
+.session-search input:hover,
+.session-search input:focus,
+.session-search input:focus-visible {
   min-height: 32px;
+  padding-inline: 10px;
+  border: 1px solid var(--line);
+  border-radius: 6px;
+  background: var(--control-bg);
   font-size: var(--font-size-sm);
+  outline: none;
+  box-shadow: none;
 }
 
-.sessions-panel .session-create-row {
-  flex-direction: column;
-  align-items: stretch;
-  gap: 2px;
+.session-search input:focus-visible {
+  background: var(--control-bg-hover);
 }
 
 .sessions-new-button,
@@ -38,24 +55,18 @@
   display: flex;
   align-items: center;
   gap: 7px;
-  width: auto;
-  min-height: 28px;
-  padding: 2px 0;
-  border: 0;
-  border-radius: 4px;
+  width: fit-content;
+  min-height: 26px;
+  padding: 2px 4px;
+  border: 1px solid transparent;
+  border-radius: 6px;
   background: transparent;
   color: var(--muted);
-  font-size: var(--font-size-sm);
+  font-size: var(--font-size-xs);
   font-weight: 400;
   text-align: start;
 }
 
-.sessions-new-button:hover:not(:disabled),
-.sessions-project-button:hover:not(:disabled) {
-  background: transparent;
-  color: var(--accent-strong);
-}
-
 .sessions-new-button svg,
 .sessions-project-button svg {
   flex-shrink: 0;
@@ -64,11 +75,34 @@
 }
 
 .sessions-panel #newSessionButton {
-  order: 0;
-  min-height: 32px;
+  border-color: transparent;
+  background: transparent;
   color: var(--text);
 }
 
+.sessions-panel #newSessionButton:hover:not(:disabled) {
+  border-color: transparent;
+  background: transparent;
+  color: var(--accent-strong);
+}
+
+.sessions-project-button {
+  margin-block: 2px 6px;
+  font-size: var(--font-size-xs);
+}
+
+.sessions-project-button:hover:not(:disabled) {
+  border-color: transparent;
+  background: var(--control-bg);
+  color: var(--text-strong);
+}
+
+.sessions-new-button:focus-visible,
+.sessions-project-button:focus-visible {
+  outline: 2px solid var(--accent-strong);
+  outline-offset: 2px;
+}
+
 .app-shell.sessions-docked {
   grid-template-columns:
     var(--workspace-rail-width) var(--sessions-panel-width)

package/dist/src/web-ui/app/styles/13-projects.css

@@ -277,25 +277,6 @@
   padding: 0;
   text-align: left;
 }
-.project-group-chevron {
-  display: grid;
-  place-items: center;
-  flex: 0 0 28px;
-  width: 28px;
-  height: 28px;
-}
-.project-group-chevron::after {
-  content: "";
-  flex: none;
-  width: 5px;
-  height: 5px;
-  border-right: 1px solid currentColor;
-  border-bottom: 1px solid currentColor;
-  transform: rotate(45deg);
-}
-.project-group-toggle[aria-expanded="false"] .project-group-chevron::after {
-  transform: rotate(-45deg);
-}
 .project-session-group .session-item {
   width: calc(100% - 16px);
   margin-inline-start: 16px;
@@ -388,3 +369,59 @@
 .project-session-more:focus-visible {
   color: var(--accent-strong);
 }
+
+.project-group-controls {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  flex: none;
+}
+
+.project-group-controls .project-group-new,
+.project-group-actions .session-menu-button {
+  display: grid;
+  place-items: center;
+  width: 22px;
+  min-width: 22px;
+  height: 22px;
+  min-height: 22px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--muted);
+  cursor: pointer;
+}
+
+.project-group-controls .project-group-new {
+  font-size: 14px;
+  line-height: 1;
+}
+
+.project-group-controls button:hover:not(:disabled) {
+  color: var(--text-strong);
+}
+
+.project-group-actions.session-actions {
+  position: relative;
+  top: auto;
+  right: auto;
+  flex: none;
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.project-group-actions .session-menu-button svg {
+  width: 12px;
+  height: 12px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 1.4;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.project-group-controls button:disabled {
+  opacity: 0.5;
+  cursor: default;
+}

package/dist/src/web-ui/app/styles/19-runtime-setup.css

@@ -400,3 +400,19 @@
     flex-wrap: wrap;
   }
 }
+
+/* The thinking capability is a compact checkbox, not a full-width text field. */
+.runtime-setup-reasoning-toggle-label {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+.runtime-setup-field.runtime-setup-reasoning-toggle input[type="checkbox"] {
+  width: 1rem;
+  height: 1rem;
+  min-width: 1rem;
+  min-height: 1rem;
+  margin: 0;
+  padding: 0;
+  flex: 0 0 1rem;
+}

package/dist/src/web-ui/app/styles/22-reasoning-budget.css

@@ -0,0 +1,39 @@
+[data-reasoning-preference]:not([hidden]) { display: grid; gap: 10px; }
+[data-reasoning-preference] label:not([hidden]) { display: grid; gap: 6px; font-size: 12px; }
+[data-reasoning-preference] select,
+[data-reasoning-preference] input {
+  box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 10px;
+  border: 1px solid var(--line); border-radius: 7px; background: var(--panel);
+  color: var(--text); font: inherit;
+}
+[data-reasoning-preference] small,
+[data-reasoning-model-change-note] { color: var(--muted); font-size: 11px; line-height: 1.5; }
+[data-reasoning-preference] [hidden] { display: none; }
+[data-save-budget], [data-spark-save-thinking] {
+  margin-top: 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 7px;
+  background: var(--panel); color: var(--accent); font: inherit; font-size: 12px; cursor: pointer;
+}
+[data-budget-error] { color: var(--danger); font-size: 12px; }
+[data-spark-thinking-budget]:not(:empty) { padding: 14px 0; border-top: 1px solid var(--line); }
+
+.reasoning-mode-default-note { display: block; color: var(--muted); font-size: 11px; line-height: 1.5; margin: 8px; }
+[data-mode-error] { color: var(--danger); font-size: 12px; margin: 8px; }
+.reasoning-budget-control { flex: none; }
+.reasoning-budget-control[hidden] { display: none; }
+.reasoning-budget-menu { width: min(300px, calc(100vw - 32px)); padding: 14px; }
+.reasoning-budget-button { max-width: 150px; white-space: nowrap; }
+@container (max-width: 600px) {
+  .composer-model-controls { flex-wrap: wrap; }
+  .agent-mode-control, .reasoning-budget-control { position: static; }
+  #agentModeMenu, .reasoning-budget-menu { left: 0; right: auto; }
+}
+@container (max-width: 400px) {
+  .agent-mode-control, .agent-mode-control .agent-mode-button, .reasoning-budget-button { width: auto; }
+  .agent-mode-control .agent-mode-button { padding: 0 6px; }
+  .agent-mode-control .agent-mode-icon { display: none; }
+  .agent-mode-control .agent-mode-button > span:last-child {
+    position: static; width: auto; height: auto; padding: 0; clip-path: none; overflow: hidden;
+  }
+  .reasoning-budget-button { padding: 0 6px; }
+  .reasoning-budget-menu { left: 0; right: auto; width: min(300px, 100%); }
+}

package/dist/src/web-ui/app/styles/24-conversation-role-cards.css

@@ -332,3 +332,61 @@
   overflow-y: auto;
   scrollbar-gutter: stable;
 }
+
+.conversation-role-history {
+  display: grid;
+  gap: 8px;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.conversation-role-history + .conversation-role-summary {
+  margin-block-start: 8px;
+}
+
+.conversation-role-history-toggle {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: 3px 8px;
+  cursor: pointer;
+  list-style: none;
+  border-radius: 4px;
+}
+
+.conversation-role-history-toggle::-webkit-details-marker {
+  display: none;
+}
+
+.conversation-role-history-toggle:focus-visible {
+  outline: 2px solid var(--role-accent);
+  outline-offset: 3px;
+}
+
+.conversation-role-history-label,
+.conversation-role-history-chevron {
+  color: var(--role-accent);
+  font-size: var(--font-size-xs);
+  line-height: 1.5;
+}
+
+.conversation-role-history-text {
+  grid-column: 1 / -1;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  font-size: var(--font-size-md);
+  line-height: 1.6;
+}
+
+.conversation-role-history-item[open] .conversation-role-history-text {
+  display: block;
+  -webkit-line-clamp: unset;
+}
+
+.conversation-role-history-item[open] .conversation-role-history-chevron {
+  transform: rotate(180deg);
+}

package/dist/src/web-ui/app/styles/27-conversation-memory.css

@@ -0,0 +1,45 @@
+.conversation-memory-bubble { --role-accent: var(--accent); }
+
+.conversation-activity-group,
+.conversation-memory-activity {
+  display: grid;
+  gap: 6px;
+  min-width: 0;
+}
+
+.conversation-memory-row {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 4px 7px;
+  color: var(--muted);
+  font-size: var(--font-size-sm);
+  line-height: 1.5;
+}
+
+.conversation-memory-icon {
+  display: inline-flex;
+  align-self: flex-start;
+  flex: none;
+  width: 15px;
+  height: 15px;
+  margin-block-start: 2px;
+}
+
+.conversation-memory-icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+.conversation-memory-row[data-state="active"] .conversation-memory-label {
+  color: var(--text);
+}
+
+.conversation-memory-row[data-state="failed"] {
+  color: var(--danger);
+}
+
+.conversation-memory-detail {
+  min-width: 0;
+  overflow-wrap: anywhere;
+}

package/dist/src/web-ui/app/styles/27-conversation-skills.css

@@ -0,0 +1,96 @@
+.conversation-skill-collection {
+  display: grid;
+  gap: 4px;
+  min-width: 0;
+  margin: 0;
+}
+
+.conversation-skill-collection + * {
+  margin-block-start: 6px;
+}
+
+.conversation-skill-icon {
+  display: inline-flex;
+  flex: none;
+  width: 15px;
+  height: 15px;
+  color: var(--muted);
+}
+
+.conversation-skill-icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+.conversation-skill-inline-row {
+  display: flex;
+  align-items: flex-start;
+  gap: 7px;
+  min-width: 0;
+}
+
+.conversation-skill-inline-row > .conversation-skill-icon {
+  margin-block-start: 2px;
+}
+
+.conversation-skill-read-label {
+  flex: none;
+  color: var(--muted);
+  font-size: var(--font-size-sm);
+  line-height: 1.5;
+}
+
+.conversation-skill-items {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px 6px;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.conversation-role-skill-activity {
+  display: inline-flex;
+  align-items: baseline;
+  gap: 7px;
+  min-width: 0;
+  color: var(--text);
+  font-size: var(--font-size-sm);
+  line-height: 1.5;
+}
+
+.conversation-role-skill-activity + .conversation-role-skill-activity::before {
+  content: "·";
+  flex: none;
+  color: var(--muted);
+}
+
+.conversation-skill-summary {
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.conversation-role-skill-activity[data-tone="failed"] {
+  color: var(--danger);
+}
+
+.conversation-role-skill-activity[data-tone="neutral"] {
+  color: var(--muted);
+}
+
+.conversation-tool.is-skill-read .conversation-tool-title {
+  color: var(--muted);
+}
+
+.conversation-tool.is-skill-read .conversation-tool-target {
+  color: var(--text);
+}
+
+.conversation-tool.is-skill-read.is-completed .conversation-tool-status {
+  color: var(--green);
+}
+
+.conversation-tool.is-skill-read.is-failed .conversation-tool-status {
+  color: var(--danger);
+}

package/dist/src/web-ui/app/styles/28-tool-approval-card.css

@@ -94,7 +94,7 @@
   grid-column: 2;
   grid-row: 1;
   display: grid;
-  grid-template-columns: repeat(2, minmax(76px, auto));
+  grid-template-columns: repeat(3, minmax(76px, auto));
   gap: 8px;
 }
 
@@ -131,6 +131,7 @@
 }
 
 .tool-approval-button:focus-visible,
+.tool-approval-rejection-text:focus-visible,
 .approval-message-explanation > summary:focus-visible {
   outline: 2px solid var(--accent);
   outline-offset: 3px;
@@ -142,6 +143,40 @@
   box-shadow: none;
 }
 
+.tool-approval-rejection-editor {
+  grid-column: 1 / -1;
+  min-width: 0;
+}
+
+.tool-approval-rejection-label {
+  display: grid;
+  gap: 8px;
+  color: var(--muted);
+  font-size: var(--font-size-sm);
+}
+
+.tool-approval-rejection-text {
+  box-sizing: border-box;
+  width: 100%;
+  min-height: 90px;
+  resize: vertical;
+  padding: 10px 12px;
+  border: 1px solid var(--line);
+  border-radius: 5px;
+  background: var(--bg);
+  color: var(--text);
+  font: inherit;
+  line-height: 1.5;
+  text-align: start;
+}
+
+.tool-approval-rejection-controls {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 10px;
+}
+
 @media (max-width: 600px) {
   .message-row.assistant .approval-message-bubble {
     grid-template-columns: minmax(0, 1fr);
@@ -157,5 +192,7 @@
     grid-column: 1;
     grid-row: auto;
     justify-self: stretch;
+    display: flex;
+    flex-wrap: wrap;
   }
 }