diff --git a/design-system/apps/design-lab/src/preview/FlowChatToolGallery.css b/design-system/apps/design-lab/src/preview/FlowChatToolGallery.css
index dc8cdab64c..336f7a7149 100644
--- a/design-system/apps/design-lab/src/preview/FlowChatToolGallery.css
+++ b/design-system/apps/design-lab/src/preview/FlowChatToolGallery.css
@@ -10,6 +10,25 @@
   margin-top: 42px;
 }
 
+.flow-chat-tool-sequence {
+  display: grid;
+  min-inline-size: 0;
+  gap: var(--openbitfun-space-5);
+}
+
+.flow-chat-tool-sequence__rows {
+  min-inline-size: 0;
+}
+
+.flow-chat-tool-sequence__rows > * + * {
+  margin-block-start: var(--openbitfun-control-flow-chat-flow-item-gap);
+}
+
+.flow-chat-tool-sequence__rows > [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-attention='ambient'][data-openbitfun-expanded-shell='false']
+  + [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-attention='ambient'][data-openbitfun-expanded-shell='false'] {
+  margin-block-start: 0;
+}
+
 .flow-chat-tool-gallery > .component-catalog-section-heading {
   margin-block: 0 -8px;
   padding-top: 34px;
diff --git a/design-system/apps/design-lab/src/preview/FlowChatToolGallery.tsx b/design-system/apps/design-lab/src/preview/FlowChatToolGallery.tsx
index 2b17f1d87a..c6cb713c5d 100644
--- a/design-system/apps/design-lab/src/preview/FlowChatToolGallery.tsx
+++ b/design-system/apps/design-lab/src/preview/FlowChatToolGallery.tsx
@@ -2,6 +2,9 @@ import {
   ArrowRight,
   Eye,
 } from "lucide-react";
+import { useState } from "react";
+import { TabGroup } from "@openbitfun/ui";
+import { AgentWaitToolCard, SkillToolCard, TerminalControlToolCard, TodoToolCard } from "@openbitfun/ui/flow-chat";
 import { useI18n } from "../i18n";
 import { getComponentDescription } from "../i18n/componentMetadata";
 import {
@@ -28,6 +31,47 @@ const productOwnedToolExamples = [
   "PatchCanvas",
 ] as const;
 
+function ToolSequencePreview() {
+  const { t } = useI18n();
+  const [status, setStatus] = useState<"running" | "completed" | "error">("running");
+  const [expanded, setExpanded] = useState(false);
+  const completed = status === "completed";
+  return <section className="flow-chat-tool-sequence" data-openbitfun-pattern="tool-sequence">
+    <TabGroup
+      size="sm"
+      value={status}
+      onValueChange={(value) => setStatus(value as typeof status)}
+      items={[
+        { value: "running", label: t("components.preview.flowChat.running") },
+        { value: "completed", label: t("components.preview.flowChat.completed") },
+        { value: "error", label: t("components.preview.flowChat.failed") },
+      ]}
+    />
+    <div className="flow-chat-tool-sequence__rows">
+      <SkillToolCard action="Skill" status="completed" summary="Read the public component contract" />
+      <TodoToolCard
+        title="Tasks"
+        status={status}
+        summary="Align long workspace paths and tool summaries with the conversation text column"
+        mode="standard"
+        loading={status === "running"}
+        allCompleted={completed}
+        completedCount={completed ? 3 : 1}
+        totalCount={3}
+        items={[
+          { key: "columns", content: "Align public and product row columns", status: "completed" },
+          { key: "detail", content: "Verify expansion with long text and file paths", status: completed ? "completed" : "in_progress" },
+          { key: "replay", content: "Review the completed transcript", status: completed ? "completed" : "pending" },
+        ]}
+        isExpanded={expanded}
+        onToggle={() => setExpanded(!expanded)}
+      />
+      <AgentWaitToolCard action="AgentWait" status={status} summary={t(`components.preview.flowChat.${status === "error" ? "failed" : status}`)} />
+      <TerminalControlToolCard action="TerminalControl" status="completed" summary="src/features/workspace/remote/connection-profile-with-a-long-name.ts" />
+    </div>
+  </section>;
+}
+
 function ToolSpecimenCard({
   componentName,
   specimen,
@@ -67,6 +111,8 @@ export function FlowChatToolGallery({
         <p>{t("components.flowChat.toolsDescription")}</p>
       </header>
 
+      <ToolSequencePreview />
+
       {toolCardEntries.map(({ component, definition }) => (
         <section className="flow-chat-tool-group" key={component.name}>
           <header className="flow-chat-tool-group__heading">
@@ -105,6 +151,7 @@ export function FlowChatToolGallery({
         <div>
           <strong>{t("components.flowChat.dedicatedTitle")}</strong>
           <p>{t("components.flowChat.dedicatedDescription")}</p>
+          <code>ModelThinkingDisplay · ExploreGroupRenderer · RuntimeStatusSlot</code>
         </div>
         <code>{productOwnedToolExamples.join(" · ")}</code>
       </aside>
diff --git a/design-system/packages/design-tokens/src/system.tokens.json b/design-system/packages/design-tokens/src/system.tokens.json
index 32fb07dbbd..e0a6abf81c 100644
--- a/design-system/packages/design-tokens/src/system.tokens.json
+++ b/design-system/packages/design-tokens/src/system.tokens.json
@@ -495,19 +495,21 @@
     "flowChat": {
       "$description": "Shared FlowChat rhythm for product and package-owned conversation surfaces.",
       "$type": "dimension",
-      "flowItemGap": { "$value": "0.42rem" },
+      "rowIconSize": { "$value": "{control.icon.sizeSm}" },
+      "rowIconGap": { "$value": "{space.1}" },
+      "flowItemGap": { "$value": "{space.2}" },
       "turnGap": { "$value": "{space.4}" },
-      "inlineGap": { "$value": "0.35rem" },
-      "controlGap": { "$value": "0.5rem" },
-      "controlPaddingBlock": { "$value": "0.35rem" },
+      "inlineGap": { "$value": "{space.1}" },
+      "controlGap": { "$value": "{space.2}" },
+      "controlPaddingBlock": { "$value": "{space.1}" },
       "controlPaddingInline": { "$value": "0.75rem" },
       "contentPaddingInline": { "$value": "3rem" },
       "contentPaddingInlineMobile": { "$value": "1.5rem" },
-      "cardGap": { "$value": "0.42rem" },
+      "cardGap": { "$value": "{control.flowChat.flowItemGap}" },
       "cardRadius": { "$value": "{radius.base}" },
       "cardPaddingBlock": { "$value": "0.625rem" },
       "cardPaddingInline": { "$value": "0.75rem" },
-      "cardExpandedPaddingBlock": { "$value": "0.5rem" },
+      "cardExpandedPaddingBlock": { "$value": "{space.2}" },
       "cardExpandedPaddingInline": { "$value": "0.625rem" },
       "codeBlockPaddingBlock": { "$value": "0.55rem" },
       "codeBlockPaddingInline": { "$value": "0.75rem" }
diff --git a/design-system/packages/ui/README.md b/design-system/packages/ui/README.md
index 9242c36222..c9ae0daf6b 100644
--- a/design-system/packages/ui/README.md
+++ b/design-system/packages/ui/README.md
@@ -440,3 +440,17 @@ long description while metadata and sibling actions retain their own slots.
 Lab Patterns includes long paths, large change counts, expandable detail and
 disabled actions. The current Web UI has no direct ActivityItem consumer;
 FlowChat ambient tool cards keep their separate presentation contract.
+
+Ambient FlowChat summaries, product thinking/explore headers and runtime status
+share a 14px icon column followed by a 4px gap. The icon column starts at the
+transcript body edge; heading text starts 18px after that edge. Loading, tool
+and disclosure glyphs occupy that same column. Expanded thinking prose remains
+aligned with the body edge; bordered tool detail retains its own content inset.
+The 12px/4px Figma inline trace is a smaller typography scene; the existing
+product 14px glyph size is retained when applying its gap to these summaries.
+
+FlowChat vertical composition uses an 8px item/section gap and 4px inline gap.
+Collapsed ambient tool runs use their 22px minimum line boxes without extra
+spacing between adjacent rows; expanded/prominent cards retain the section gap.
+The enclosing composition owns those gaps, and card bodies own their internal
+padding. The Lab tool sequence demonstrates both arrangements with real cards.
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/ActivityToolCards.tsx b/design-system/packages/ui/src/flow-chat/tool-cards/ActivityToolCards.tsx
index fcba529cd3..53028e269c 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/ActivityToolCards.tsx
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/ActivityToolCards.tsx
@@ -52,6 +52,7 @@ function ActivityToolCardBase({
           ) : undefined}
           icon={(
             <ToolCardStatusSlot
+              size={14}
               defaultIcon={defaultIcon}
               status={status}
               toolIcon={icon}
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/AmbientToolCard.meta.ts b/design-system/packages/ui/src/flow-chat/tool-cards/AmbientToolCard.meta.ts
index 7bb8cd473e..7197fa6a5d 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/AmbientToolCard.meta.ts
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/AmbientToolCard.meta.ts
@@ -22,6 +22,8 @@ export const ambientToolCardMeta = {
     "color.status.danger.content",
     "control.height.md",
     "control.toolCard.ambientRowMinBlockSize",
+    "control.flowChat.rowIconSize",
+    "control.flowChat.rowIconGap",
     "font.family.sans",
     "font.size.sm",
     "font.size.xl",
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/FlowChatToolCard.module.css b/design-system/packages/ui/src/flow-chat/tool-cards/FlowChatToolCard.module.css
index a73fd1e4bd..0b3dd48d20 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/FlowChatToolCard.module.css
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/FlowChatToolCard.module.css
@@ -454,8 +454,8 @@
     display: flex;
     min-block-size: max(1lh, var(--openbitfun-control-tool-card-ambient-row-min-block-size));
     align-items: center;
-    gap: var(--openbitfun-space-1);
-    padding-inline: var(--openbitfun-space-1) var(--openbitfun-space-2);
+    gap: var(--openbitfun-control-flow-chat-row-icon-gap);
+    padding-inline: 0 var(--openbitfun-space-2);
     border: 0;
     background: transparent;
     box-shadow: none;
@@ -476,9 +476,8 @@
   }
 
   .ambientSurface .iconSlot {
-    --_tool-card-action-size: var(--openbitfun-space-5);
-
-    margin-inline-end: 1px;
+    --_tool-card-action-size: var(--openbitfun-control-flow-chat-row-icon-size);
+    --_flow-chat-tool-card-icon-size: var(--openbitfun-control-flow-chat-row-icon-size);
   }
 
   .ambientAction {
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.module.css b/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.module.css
index 250cc824cf..7d477f450e 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.module.css
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.module.css
@@ -211,20 +211,23 @@
     display: flex;
     min-inline-size: 0;
     align-items: center;
-    gap: var(--openbitfun-space-2);
+    gap: var(--openbitfun-control-flow-chat-row-icon-gap);
     color: var(--openbitfun-color-content-muted);
     font-size: var(--openbitfun-type-body-sm-font-size);
   }
 
   .todoCompactIcon {
     display: inline-flex;
-    flex: 0 0 auto;
+    flex: 0 0 var(--openbitfun-control-flow-chat-row-icon-size);
+    inline-size: var(--openbitfun-control-flow-chat-row-icon-size);
+    block-size: var(--openbitfun-control-flow-chat-row-icon-size);
     align-items: center;
+    justify-content: center;
   }
 
   .todoCompactIcon > svg {
-    inline-size: 0.875rem;
-    block-size: 0.875rem;
+    inline-size: 100%;
+    block-size: 100%;
   }
 
   .todoCompactMeta {
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.tsx b/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.tsx
index 6051796cf1..46adf81397 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.tsx
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/StandardAmbientToolCards.tsx
@@ -98,7 +98,7 @@ export function RunCodeToolCard({
           action={action}
           content={summary}
           extra={actions ? <ToolCardActions>{actions}</ToolCardActions> : undefined}
-          icon={<ToolCardStatusSlot status={status} toolIcon={<Code2 aria-hidden="true" />} />}
+          icon={<ToolCardStatusSlot size={14} status={status} toolIcon={<Code2 aria-hidden="true" />} />}
         />
       )}
       isExpanded={Boolean(isExpanded && hasDetails)}
@@ -181,7 +181,7 @@ export function WebFetchToolCard({
           action={action}
           content={<OverflowText className={styles.fetchTitle} title={typeof title === "string" ? title : undefined}>{title}</OverflowText>}
           icon={(
-            <ToolCardStatusSlot
+            <ToolCardStatusSlot size={14}
               defaultIcon={status === "completed" || status === "error" ? "tool" : "status"}
               status={status}
               toolIcon={<Globe aria-hidden="true" />}
@@ -260,7 +260,7 @@ export function DefaultToolCard({
           action={displayName}
           content={summary}
           icon={hasVisibleToolCardStatusGlyph(status) || icon
-            ? <ToolCardStatusSlot status={status} toolIcon={icon} />
+            ? <ToolCardStatusSlot size={14} status={status} toolIcon={icon} />
             : undefined}
         />
       )}
@@ -337,7 +337,7 @@ export function ViewImageToolCard({
         header={(
           <AmbientToolCardHeader
             action={statusText}
-            icon={<ToolCardStatusSlot status={status} toolIcon={<ImageIcon aria-hidden="true" />} />}
+            icon={<ToolCardStatusSlot size={14} status={status} toolIcon={<ImageIcon aria-hidden="true" />} />}
           />
         )}
         isExpanded={Boolean(source && isExpanded)}
@@ -461,7 +461,7 @@ export function TodoToolCard({
           action={isExpanded ? undefined : title}
           content={headerSummary}
           icon={(
-            <ToolCardStatusSlot
+            <ToolCardStatusSlot size={14}
               defaultIcon={status === "error" || status === "cancelled" || allCompleted ? "status" : "tool"}
               status={allCompleted ? "completed" : status}
               toolIcon={<ListTodo aria-hidden="true" />}
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/StandardToolCards.meta.ts b/design-system/packages/ui/src/flow-chat/tool-cards/StandardToolCards.meta.ts
index 00f212e96d..f96b4620de 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/StandardToolCards.meta.ts
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/StandardToolCards.meta.ts
@@ -1,6 +1,8 @@
 import type { ComponentMeta } from "../../registry.types";
 
 const ambientTokens = [
+  "control.flowChat.rowIconSize",
+  "control.flowChat.rowIconGap",
   "color.content.primary",
   "color.content.secondary",
   "color.content.muted",
diff --git a/design-system/packages/ui/src/flow-chat/tool-cards/ToolCardStatusSlot.module.css b/design-system/packages/ui/src/flow-chat/tool-cards/ToolCardStatusSlot.module.css
index a77493ff23..42cd2b839a 100644
--- a/design-system/packages/ui/src/flow-chat/tool-cards/ToolCardStatusSlot.module.css
+++ b/design-system/packages/ui/src/flow-chat/tool-cards/ToolCardStatusSlot.module.css
@@ -11,6 +11,8 @@
   .statusLayer,
   .iconLayer {
     display: inline-flex;
+    inline-size: 100%;
+    block-size: 100%;
     align-items: center;
     justify-content: center;
     transition: opacity var(--openbitfun-motion-duration-fast) var(--openbitfun-motion-easing-standard);
diff --git a/src/apps/data-migrator/ui/generated/design-system.css b/src/apps/data-migrator/ui/generated/design-system.css
index 9e73ba51a0..f140c030d3 100644
--- a/src/apps/data-migrator/ui/generated/design-system.css
+++ b/src/apps/data-migrator/ui/generated/design-system.css
@@ -69,9 +69,9 @@
     --openbitfun-control-composer-surface-padding: var(--openbitfun-space-2);
     --openbitfun-control-composer-surface-radius: var(--openbitfun-radius-xl);
     --openbitfun-control-composer-toolbar-gap: var(--openbitfun-space-2);
-    --openbitfun-control-flow-chat-card-expanded-padding-block: 0.5rem;
+    --openbitfun-control-flow-chat-card-expanded-padding-block: var(--openbitfun-space-2);
     --openbitfun-control-flow-chat-card-expanded-padding-inline: 0.625rem;
-    --openbitfun-control-flow-chat-card-gap: 0.42rem;
+    --openbitfun-control-flow-chat-card-gap: var(--openbitfun-control-flow-chat-flow-item-gap);
     --openbitfun-control-flow-chat-card-padding-block: 0.625rem;
     --openbitfun-control-flow-chat-card-padding-inline: 0.75rem;
     --openbitfun-control-flow-chat-card-radius: var(--openbitfun-radius-base);
@@ -79,11 +79,13 @@
     --openbitfun-control-flow-chat-code-block-padding-inline: 0.75rem;
     --openbitfun-control-flow-chat-content-padding-inline: 3rem;
     --openbitfun-control-flow-chat-content-padding-inline-mobile: 1.5rem;
-    --openbitfun-control-flow-chat-control-gap: 0.5rem;
-    --openbitfun-control-flow-chat-control-padding-block: 0.35rem;
+    --openbitfun-control-flow-chat-control-gap: var(--openbitfun-space-2);
+    --openbitfun-control-flow-chat-control-padding-block: var(--openbitfun-space-1);
     --openbitfun-control-flow-chat-control-padding-inline: 0.75rem;
-    --openbitfun-control-flow-chat-flow-item-gap: 0.42rem;
-    --openbitfun-control-flow-chat-inline-gap: 0.35rem;
+    --openbitfun-control-flow-chat-flow-item-gap: var(--openbitfun-space-2);
+    --openbitfun-control-flow-chat-inline-gap: var(--openbitfun-space-1);
+    --openbitfun-control-flow-chat-row-icon-gap: var(--openbitfun-space-1);
+    --openbitfun-control-flow-chat-row-icon-size: var(--openbitfun-control-icon-size-sm);
     --openbitfun-control-flow-chat-turn-gap: var(--openbitfun-space-4);
     --openbitfun-control-height-lg: 48px;
     --openbitfun-control-height-md: 40px;
diff --git a/src/web-ui/src/flow_chat/_item-rhythm.scss b/src/web-ui/src/flow_chat/_item-rhythm.scss
new file mode 100644
index 0000000000..f5f3a36a93
--- /dev/null
+++ b/src/web-ui/src/flow_chat/_item-rhythm.scss
@@ -0,0 +1,28 @@
+// Composition owns inter-item space. Leaf views own only their content padding.
+// A model round retains its trailing gap across virtual rows; enclosed content
+// drops it so the enclosing section does not count the last gap twice.
+@mixin apply($enclosed: false) {
+  > :is(.flow-text-block, .flow-thinking-item, .flowchat-flow-item,
+    .task-with-subagent-wrapper, .subagent-projection-text--truncated) {
+    margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;
+  }
+
+  // Consecutive collapsed ambient tools form a continuous run of 22px lines.
+  > .flowchat-flow-item:has(
+    > .flow-tool-card-wrapper[data-openbitfun-attention='ambient']
+      [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-part='root'][data-openbitfun-expanded-shell='false']
+  ):has(
+    + .flowchat-flow-item
+      > .flow-tool-card-wrapper[data-openbitfun-attention='ambient']
+        [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-part='root'][data-openbitfun-expanded-shell='false']
+  ) {
+    margin-bottom: 0;
+  }
+
+  @if $enclosed {
+    > :is(.flow-text-block, .flow-thinking-item, .flowchat-flow-item,
+      .task-with-subagent-wrapper, .subagent-projection-text--truncated):last-child {
+      margin-bottom: 0;
+    }
+  }
+}
diff --git a/src/web-ui/src/flow_chat/components/FlowTextBlock.scss b/src/web-ui/src/flow_chat/components/FlowTextBlock.scss
index 600f4f3519..431258ffb3 100644
--- a/src/web-ui/src/flow_chat/components/FlowTextBlock.scss
+++ b/src/web-ui/src/flow_chat/components/FlowTextBlock.scss
@@ -10,12 +10,10 @@
   @include markdownTypography.apply;
 
   width: 100%;
-  margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;
+  margin: 0;
   font-size: var(--openbitfun-type-flow-body-font-size);
   line-height: var(--openbitfun-type-flow-body-line-height);
-  /* Transparent border to match the box-sizing of bordered FlowChat cards,
-   * TerminalRegion, etc.) so that text and card content share the same left edge. */
-  border: 1px solid transparent;
+  border: 0;
   box-sizing: border-box;
 
   .markdown-renderer {
diff --git a/src/web-ui/src/flow_chat/components/FlowToolCard.scss b/src/web-ui/src/flow_chat/components/FlowToolCard.scss
index 72b0fad5a3..294a5f2959 100644
--- a/src/web-ui/src/flow_chat/components/FlowToolCard.scss
+++ b/src/web-ui/src/flow_chat/components/FlowToolCard.scss
@@ -1,24 +1,9 @@
 .flowchat-flow-item {
-  margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;
+  margin: 0;
   font-size: var(--openbitfun-type-flow-body-font-size);
   line-height: var(--openbitfun-type-flow-support-line-height);
 }
 
-/* A run of collapsed ambient tools reads like consecutive transcript lines.
- * Keep the normal flow-item gap at either edge of the run, but do not insert a
- * card gap between each one-line row. Expanded ambient cards retain section
- * spacing because they are content surfaces rather than line items. */
-.flowchat-flow-item:has(
-  > .flow-tool-card-wrapper[data-openbitfun-attention='ambient']
-    [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-part='root'][data-openbitfun-expanded-shell='false']
-):has(
-  + .flowchat-flow-item
-    > .flow-tool-card-wrapper[data-openbitfun-attention='ambient']
-      [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-part='root'][data-openbitfun-expanded-shell='false']
-) {
-  margin-bottom: 0;
-}
-
 .flow-tool-card-wrapper {
   display: flex;
   flex-direction: column;
diff --git a/src/web-ui/src/flow_chat/components/modern/ExploreRegion.scss b/src/web-ui/src/flow_chat/components/modern/ExploreRegion.scss
index d09dd0cbf7..8b22df39a5 100644
--- a/src/web-ui/src/flow_chat/components/modern/ExploreRegion.scss
+++ b/src/web-ui/src/flow_chat/components/modern/ExploreRegion.scss
@@ -1,3 +1,5 @@
+@use '../../item-rhythm' as itemRhythm;
+
 /* Explore region styling for consecutive explore tool calls. */
 
 .explore-region {
@@ -18,14 +20,15 @@
 // ==================== Collapsible (header + animated content) ====================
 
 .explore-region--collapsible {
-  margin: 0 0 0.3rem 0;
+  margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;
   font-size: var(--openbitfun-type-flow-control-font-size);
   line-height: var(--openbitfun-type-flow-support-line-height);
 
   .explore-region__header {
+    min-block-size: max(1lh, var(--openbitfun-control-tool-card-ambient-row-min-block-size));
     display: flex;
     align-items: center;
-    gap: var(--openbitfun-control-flow-chat-inline-gap);
+    gap: var(--openbitfun-control-flow-chat-row-icon-gap);
     padding: 0;
     background: transparent;
     color: var(--openbitfun-color-content-muted);
@@ -58,14 +61,13 @@
 
   .explore-region__leading-icon {
     position: relative;
-    width: var(--openbitfun-control-icon-size-sm);
-    height: var(--openbitfun-control-icon-size-sm);
+    width: var(--openbitfun-control-flow-chat-row-icon-size);
+    height: var(--openbitfun-control-flow-chat-row-icon-size);
     flex-shrink: 0;
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    color: var(--openbitfun-color-content-muted);
-    opacity: 0.6;
+    color: var(--openbitfun-color-content-caption);
     transition: opacity 0.15s ease;
 
     > [data-openbitfun-component='icon'] {
@@ -87,7 +89,7 @@
   .explore-region__summary {
     font-size: var(--openbitfun-type-flow-control-font-size);
     line-height: var(--openbitfun-type-flow-support-line-height);
-    opacity: 0.8;
+    color: var(--openbitfun-color-content-secondary);
   }
 
   // Inner div must have min-height: 0 for height animation clipping to work.
@@ -97,10 +99,11 @@
   }
 
   .explore-region__content {
+    @include itemRhythm.apply($enclosed: true);
     position: relative;
     // Keep expanded rows on the same leading edge as the collapsed group.
     // A nested inset makes auto-collapse read as a horizontal jump.
-    padding: 0;
+    padding: var(--openbitfun-space-2) 0 0;
     box-sizing: border-box;
     // Hide scrollbar track by default; only show when content actually overflows.
     overflow: hidden;
@@ -134,7 +137,7 @@
     content: '';
     position: absolute;
     // Account for collapsible header height.
-    top: 28px;
+    top: max(1lh, var(--openbitfun-control-tool-card-ambient-row-min-block-size));
     left: 0;
     right: 0;
     height: 16px;
@@ -176,7 +179,7 @@
     max-height: 400px;
     // Add bottom padding so the last line of text isn't obscured by the
     // gradient overlay or clipped at the container edge.
-    padding-bottom: 8px;
+    padding-bottom: var(--openbitfun-space-2);
   }
 }
 
@@ -185,13 +188,6 @@
   overflow-y: auto;
 }
 
-// ==================== Adjacent collapsed regions ====================
-
-// Reduce spacing between adjacent collapsed regions.
-.explore-region--collapsed + .explore-region--collapsed {
-  margin-top: -2px;
-}
-
 // ==================== Cross-ModelRound collapse ====================
 
 // Reduce spacing for explore-only model rounds.
diff --git a/src/web-ui/src/flow_chat/components/modern/ExportImageButton.scss b/src/web-ui/src/flow_chat/components/modern/ExportImageButton.scss
index d1c0f9e711..1f2b862a40 100644
--- a/src/web-ui/src/flow_chat/components/modern/ExportImageButton.scss
+++ b/src/web-ui/src/flow_chat/components/modern/ExportImageButton.scss
@@ -143,7 +143,7 @@
   }
 
   &__text-item {
-    margin-bottom: 8px;
+    margin-bottom: var(--openbitfun-control-flow-chat-flow-item-gap);
     
     // Ensure FlowTextBlock styles render correctly.
     .flow-text-block {
@@ -151,7 +151,7 @@
   }
 
   &__thinking-item {
-    margin-bottom: 8px;
+    margin-bottom: var(--openbitfun-control-flow-chat-flow-item-gap);
   }
 
   &__thinking-item--expanded {
@@ -177,7 +177,7 @@
   }
 
   &__tool-item {
-    margin-bottom: 8px;
+    margin-bottom: var(--openbitfun-control-flow-chat-flow-item-gap);
     
     // Hide tool card action buttons and expanded content.
     .tool-card__actions,
diff --git a/src/web-ui/src/flow_chat/components/modern/FLOWCHAT_VIRTUALIZATION.md b/src/web-ui/src/flow_chat/components/modern/FLOWCHAT_VIRTUALIZATION.md
index c061cb5260..b07d3502e5 100644
--- a/src/web-ui/src/flow_chat/components/modern/FLOWCHAT_VIRTUALIZATION.md
+++ b/src/web-ui/src/flow_chat/components/modern/FLOWCHAT_VIRTUALIZATION.md
@@ -186,3 +186,35 @@ package.
 - `virtualMessageListLayout.ts`
 - `VirtualItemRenderer.tsx` + `.scss`
 - `VirtualMessageList.tsx`
+
+## Transcript row columns
+
+Thinking, Explore, ambient tool summaries and the runtime-status footer use
+`control.flowChat.rowIconSize` (14px) and `rowIconGap` (4px). The outer content
+column owns its responsive inset. Borderless rows add no leading padding or
+transparent border; text-only replies and expanded thinking begin at that same
+body edge. A summary with an icon starts its label 18px later. Tool/arrow/status
+layers keep their slot during state changes. Native SVG artwork may contain
+internal whitespace; do not compensate for it with per-tool margins.
+
+Thinking/Explore labels use secondary content directly and their icons use the
+caption role, avoiding a second opacity multiplier. These layout rules do not
+change virtual-item identity, measurement ownership or viewport writes.
+
+## Transcript vertical rhythm
+
+The shared item gap is 8px and the inline gap is 4px. Thinking, Explore and
+retry disclosure headers share the ambient 22px minimum line box, growing with
+text. Consecutive collapsed ambient tools remain continuous lines with no added
+inter-item gap. The existing projection flag preserves that rule across virtual
+model-round boundaries; expanded and prominent cards keep the ordinary 8px gap.
+
+The item-rhythm mixin belongs to ModelRoundItem, retry-attempt contents,
+Explore contents and the subagent projection. Leaves carry no outer margin.
+Enclosed contents remove their last gap; model rounds retain it until the virtual
+Turn boundary removes it. Expanded Task wrappers use the same parent-owned gap
+as other items; their body owns its internal padding. Export wrappers and the
+Lab sequence own their own gaps. Thinking/Explore content has an 8px top inset;
+bounded Explore retains 8px bottom padding for its scroll fade. There is no
+negative adjacent-region margin. The resident runtime slot stays 24px high and
+continues to participate in the existing footer/reservation contract.
diff --git a/src/web-ui/src/flow_chat/components/modern/FlowChatCollapseAlignment.test.ts b/src/web-ui/src/flow_chat/components/modern/FlowChatCollapseAlignment.test.ts
index 586bfb50da..319bf350a9 100644
--- a/src/web-ui/src/flow_chat/components/modern/FlowChatCollapseAlignment.test.ts
+++ b/src/web-ui/src/flow_chat/components/modern/FlowChatCollapseAlignment.test.ts
@@ -42,9 +42,9 @@ describe('FlowChat collapse spacing', () => {
     const exploreContent = extractBlock(exploreStyles, '.explore-region__content');
     const thinkingContent = extractBlock(thinkingStyles, '.thinking-content');
 
-    expect(exploreContent).toContain('padding: 0;');
+    expect(exploreContent).toContain('padding: var(--openbitfun-space-2) 0 0;');
     expect(thinkingContent).toMatch(
-      /padding:\s*var\(--openbitfun-control-flow-chat-card-expanded-padding-block\)\s*var\(--openbitfun-control-flow-chat-card-expanded-padding-inline\)\s*var\(--openbitfun-control-flow-chat-card-expanded-padding-block\)\s*0;/,
+      /padding:\s*var\(--openbitfun-control-flow-chat-card-expanded-padding-block\)\s*var\(--openbitfun-control-flow-chat-card-expanded-padding-inline\)\s*0\s*0;/,
     );
   });
 
diff --git a/src/web-ui/src/flow_chat/components/modern/FlowChatRhythm.test.ts b/src/web-ui/src/flow_chat/components/modern/FlowChatRhythm.test.ts
index 5e01b429e6..f7798e508c 100644
--- a/src/web-ui/src/flow_chat/components/modern/FlowChatRhythm.test.ts
+++ b/src/web-ui/src/flow_chat/components/modern/FlowChatRhythm.test.ts
@@ -40,7 +40,7 @@ describe('FlowChat transcript rhythm', () => {
   }
 
   it('treats collapsed ambient tool runs as text-like rows', () => {
-    const toolStyles = readSource('../FlowToolCard.scss');
+    const toolStyles = readSource('../../_item-rhythm.scss');
 
     expect(toolStyles).toContain(
       'margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;',
@@ -55,7 +55,12 @@ describe('FlowChat transcript rhythm', () => {
       "> [data-openbitfun-component='flow-chat-tool-card'][data-openbitfun-part='root'][data-openbitfun-expanded-shell='false']",
     );
     expect(toolStyles).not.toContain('+ .task-with-subagent-wrapper');
-    expect(toolStyles).not.toContain('.task-with-subagent-wrapper:not(');
+    for (const owner of ['./ModelRoundItem.scss', './ExploreRegion.scss', '../subagent/SubagentProjectionView.scss']) {
+      expect(readSource(owner)).toContain('@include itemRhythm.apply');
+    }
+    for (const leaf of ['../FlowToolCard.scss', '../FlowTextBlock.scss', '../../tool-cards/ModelThinkingDisplay.scss']) {
+      expect(readSource(leaf)).not.toContain('margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;');
+    }
   });
 
   it('gives every new user Turn one token-owned boundary gap', () => {
@@ -119,8 +124,7 @@ describe('FlowChat transcript rhythm', () => {
     expect(rendererStyles).not.toContain(
       '.task-with-subagent-wrapper:last-child:not(.task-with-subagent-wrapper--expanded)',
     );
-    expect(taskStyles).toMatch(
-      /\.task-with-subagent-wrapper\s*\{[\s\S]*?margin-block:\s*0;[\s\S]*?&\.task-with-subagent-wrapper--expanded\s*\{\s*margin-block:\s*var\(--openbitfun-space-1\) var\(--openbitfun-space-3\);/,
-    );
+    expect(taskStyles).toContain('margin-block: 0;');
+    expect(taskStyles).not.toMatch(/&\.task-with-subagent-wrapper--expanded\s*\{\s*margin-block:/);
   });
 });
diff --git a/src/web-ui/src/flow_chat/components/modern/ModelRoundItem.scss b/src/web-ui/src/flow_chat/components/modern/ModelRoundItem.scss
index 0324dd4347..1e644036d1 100644
--- a/src/web-ui/src/flow_chat/components/modern/ModelRoundItem.scss
+++ b/src/web-ui/src/flow_chat/components/modern/ModelRoundItem.scss
@@ -1,9 +1,12 @@
+@use '../../item-rhythm' as itemRhythm;
+
 /* Model round item styles (BEM). */
 .model-round-item {
+  @include itemRhythm.apply;
   /*
-   * No bottom margin — the inter-round gap is covered by the same line-height rhythm
-   * as inter-item gaps inside a round, so flow text → tool / tool → thinking / cross-
-   * round transitions all read as one continuous, evenly-spaced text column.
+   * The composition assigns one 8px trailing gap to each item, including the
+   * last item across a model-round boundary. Consecutive collapsed ambient
+   * tools have no extra gap, within a round and across virtual rows.
    *
    * No mount / enter animation lives here on purpose. The list is virtualized:
    * any animation keyed off mount replays whenever an item scrolls back into
@@ -86,12 +89,13 @@
 .model-round-item__retry-history {
   display: flex;
   flex-direction: column;
-  gap: 0.5rem;
-  margin-bottom: 0.5rem;
+  gap: var(--openbitfun-control-flow-chat-flow-item-gap);
+  margin-bottom: var(--openbitfun-control-flow-chat-flow-item-gap);
 }
 
 .model-round-item__retry-toggle {
   align-self: flex-start;
+  min-block-size: max(1lh, var(--openbitfun-control-tool-card-ambient-row-min-block-size));
   padding: 0;
   background: transparent;
   border: none;
@@ -113,7 +117,8 @@
 }
 
 .model-round-item__retry-attempt {
-  padding: 0.35rem 0 0.15rem;
+  @include itemRhythm.apply($enclosed: true);
+  padding: var(--openbitfun-space-2) 0 0;
   border-top: 1px solid color-mix(in srgb, var(--openbitfun-color-border-default) 62%, transparent);
 }
 
@@ -121,8 +126,8 @@
   display: flex;
   align-items: center;
   flex-wrap: wrap;
-  gap: 0.25rem;
-  margin-bottom: 0.35rem;
+  gap: var(--openbitfun-space-1);
+  margin-bottom: var(--openbitfun-space-1);
   color: var(--openbitfun-color-content-muted);
   font-size: var(--openbitfun-type-flow-meta-font-size);
   line-height: var(--openbitfun-type-flow-meta-line-height);
diff --git a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.appearance.ts b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.appearance.ts
index 30c03cb9cd..03a6bf8a6c 100644
--- a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.appearance.ts
+++ b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.appearance.ts
@@ -2,5 +2,5 @@ import type { AppearanceSurfaceDescriptor } from '@/infrastructure/appearance';
 
 export const runtimeStatusSlotAppearanceDescriptor: AppearanceSurfaceDescriptor = {
   id: 'runtime-status-slot',
-  parts: [{ id: 'root' }, { id: 'content' }, { id: 'hint' }],
+  parts: [{ id: 'root' }, { id: 'content' }, { id: 'leadingIcon' }, { id: 'hint' }],
 };
diff --git a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.scss b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.scss
index 61ad554fd2..232aeb28ec 100644
--- a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.scss
+++ b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.scss
@@ -10,10 +10,10 @@
   &__content {
     display: flex;
     align-items: center;
-    gap: var(--openbitfun-control-flow-chat-control-gap);
+    gap: var(--openbitfun-control-flow-chat-row-icon-gap);
     height: 24px;
     min-width: 0;
-    color: var(--openbitfun-color-content-muted);
+    color: var(--openbitfun-color-content-secondary);
     font-size: var(--openbitfun-type-flow-body-font-size);
     line-height: var(--openbitfun-type-flow-support-line-height);
     opacity: 0;
@@ -24,7 +24,7 @@
   }
 
   &--visible &__content {
-    opacity: 0.86;
+    opacity: 1;
     transform: translateY(0);
   }
 
@@ -34,6 +34,16 @@
     white-space: nowrap;
   }
 
+  &__icon {
+    display: inline-flex;
+    flex: 0 0 var(--openbitfun-control-flow-chat-row-icon-size);
+    width: var(--openbitfun-control-flow-chat-row-icon-size);
+    height: var(--openbitfun-control-flow-chat-row-icon-size);
+    align-items: center;
+    justify-content: center;
+    color: var(--openbitfun-color-content-caption);
+  }
+
   &--footer &__content {
     width: 100%;
     max-width: 900px;
diff --git a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.test.tsx b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.test.tsx
index a938c73afc..f00e58c9f9 100644
--- a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.test.tsx
+++ b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.test.tsx
@@ -39,6 +39,8 @@ describe('RuntimeStatusSlot', () => {
       root.render(<RuntimeStatusSlot sessionId="session-1" placement="footer" />);
     });
     const slot = container.querySelector<HTMLElement>('.runtime-status-slot');
+    const iconSlot = container.querySelector('[data-openbitfun-part="leadingIcon"]');
+    expect(iconSlot?.querySelector('[data-testid="dot-matrix"]')).not.toBeNull();
     expect(slot).not.toBeNull();
     expect(slot?.dataset.runtimeStatusVisible).toBe('false');
 
@@ -62,11 +64,13 @@ describe('RuntimeStatusSlot', () => {
       });
     });
     expect(slot?.textContent).toContain('Transferring workspace');
+    expect(container.querySelector('[data-openbitfun-part="leadingIcon"]')).toBe(iconSlot);
 
     act(() => {
       useRuntimeStatusStore.getState().clear({ sessionId: 'session-1' });
     });
     expect(container.querySelector('.runtime-status-slot')).toBe(slot);
     expect(slot?.dataset.runtimeStatusVisible).toBe('false');
+    expect(container.querySelector('[data-openbitfun-part="leadingIcon"]')).toBe(iconSlot);
   });
 });
diff --git a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.tsx b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.tsx
index 73a2ce83a6..3b013db898 100644
--- a/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.tsx
+++ b/src/web-ui/src/flow_chat/components/modern/RuntimeStatusSlot.tsx
@@ -49,7 +49,9 @@ export const RuntimeStatusSlot: React.FC<RuntimeStatusSlotProps> = ({
         data-openbitfun-component="runtime-status-slot"
         data-openbitfun-part="content"
       >
-        <Spinner size="sm" />
+        <span className="runtime-status-slot__icon" data-openbitfun-component="runtime-status-slot" data-openbitfun-part="leadingIcon" aria-hidden="true">
+          <Spinner size="sm" />
+        </span>
         <OverflowText
           className="runtime-status-slot__hint"
           data-openbitfun-component="runtime-status-slot"
diff --git a/src/web-ui/src/flow_chat/components/subagent/SubagentProjectionView.scss b/src/web-ui/src/flow_chat/components/subagent/SubagentProjectionView.scss
index 4ac2f2ca69..4a4f9dd0cb 100644
--- a/src/web-ui/src/flow_chat/components/subagent/SubagentProjectionView.scss
+++ b/src/web-ui/src/flow_chat/components/subagent/SubagentProjectionView.scss
@@ -1,3 +1,5 @@
+@use '../../item-rhythm' as itemRhythm;
+
 .subagent-projection-wrapper {
   width: 100%;
 }
@@ -5,7 +7,7 @@
 .subagent-projection-container {
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: var(--openbitfun-control-flow-chat-flow-item-gap);
   overflow-y: auto;
   overscroll-behavior: contain;
   box-sizing: border-box;
@@ -23,10 +25,11 @@
 .subagent-projection-text--truncated {
   display: flex;
   flex-direction: column;
-  gap: 6px;
+  gap: var(--openbitfun-control-flow-chat-inline-gap);
 }
 
 .subagent-projection-content {
+  @include itemRhythm.apply($enclosed: true);
   min-width: 0;
 
   .flow-thinking-item .thinking-content {
diff --git a/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.scss b/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.scss
index 6c7b37f907..e05ec31665 100644
--- a/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.scss
+++ b/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.scss
@@ -19,12 +19,10 @@
  *   flow so flex `align-items: center` stays stable. */
 .flow-thinking-item {
   padding: 0;
-  /* Match `.flow-text-block` and the tool wrappers so flow items share one visual gap. */
-  margin: 0 0 var(--openbitfun-control-flow-chat-flow-item-gap) 0;
+  /* The enclosing transcript composition owns the gap to the next item. */
+  margin: 0;
   background: transparent;
-  /* Transparent border to match the box-sizing of bordered cards so that thinking
-   * items and card content share the same left edge. */
-  border: 1px solid transparent;
+  border: 0;
   box-sizing: border-box;
   /* Collapsed summary line: match `.explore-region--collapsible` (e.g. command count). */
   font-size: var(--openbitfun-type-flow-control-font-size);
@@ -33,9 +31,10 @@
 }
 
 .thinking-collapsed-header {
+  min-block-size: max(1lh, var(--openbitfun-control-tool-card-ambient-row-min-block-size));
   display: flex;
   align-items: center;
-  gap: var(--openbitfun-control-flow-chat-inline-gap);
+  gap: var(--openbitfun-control-flow-chat-row-icon-gap);
   padding: 0;
   border-radius: 4px;
   cursor: pointer;
@@ -64,11 +63,10 @@
 
   .thinking-leading-icon {
     position: relative;
-    width: var(--openbitfun-control-icon-size-sm);
-    height: var(--openbitfun-control-icon-size-sm);
+    width: var(--openbitfun-control-flow-chat-row-icon-size);
+    height: var(--openbitfun-control-flow-chat-row-icon-size);
     flex-shrink: 0;
-    color: var(--openbitfun-color-content-muted);
-    opacity: 0.6;
+    color: var(--openbitfun-color-content-caption);
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -94,8 +92,7 @@
     min-width: 0;
     font-size: var(--openbitfun-type-flow-control-font-size);
     font-weight: var(--openbitfun-type-body-sm-font-weight);
-    color: var(--openbitfun-color-content-muted);
-    opacity: 0.8;
+    color: var(--openbitfun-color-content-secondary);
     line-height: var(--openbitfun-type-flow-support-line-height);
   }
 }
@@ -114,7 +111,6 @@
 
 .flow-thinking-item.summary .thinking-label {
   color: var(--openbitfun-color-content-secondary);
-  opacity: 0.9;
 }
 
 .flow-thinking-item.expanded {
@@ -159,7 +155,7 @@
   font-family:var(--openbitfun-type-body-sm-font-family);
   word-break: break-word;
   color: var(--openbitfun-color-content-muted);
-  padding: var(--openbitfun-control-flow-chat-card-expanded-padding-block) var(--openbitfun-control-flow-chat-card-expanded-padding-inline) var(--openbitfun-control-flow-chat-card-expanded-padding-block) 0;
+  padding: var(--openbitfun-control-flow-chat-card-expanded-padding-block) var(--openbitfun-control-flow-chat-card-expanded-padding-inline) 0 0;
   background: transparent;
   border: none;
   border-radius: 6px;
diff --git a/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.test.tsx b/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.test.tsx
index 12fb2161f5..a8ed7c303c 100644
--- a/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.test.tsx
+++ b/src/web-ui/src/flow_chat/tool-cards/ModelThinkingDisplay.test.tsx
@@ -124,6 +124,8 @@ describe('ModelThinkingDisplay reasoning summary', () => {
     await act(async () => {
       root.render(<ModelThinkingDisplay thinkingItem={summaryItem(content)} />);
     });
+    const leadingIcon = container.querySelector('[data-openbitfun-part="leadingIcon"]');
+    const label = container.querySelector('[data-openbitfun-part="label"]');
 
     await act(async () => {
       (container.querySelector('[data-testid="chat-thinking-toggle"]') as HTMLElement).click();
@@ -134,6 +136,8 @@ describe('ModelThinkingDisplay reasoning summary', () => {
       .toBe('Thinking Summary');
     expect(container.querySelector('[data-testid="thinking-markdown"]')?.textContent)
       .toBe(content);
+    expect(container.querySelector('[data-openbitfun-part="leadingIcon"]')).toBe(leadingIcon);
+    expect(container.querySelector('[data-openbitfun-part="label"]')).toBe(label);
 
     await act(async () => {
       root.render(<ModelThinkingDisplay thinkingItem={summaryItem(
@@ -142,6 +146,7 @@ describe('ModelThinkingDisplay reasoning summary', () => {
     });
     expect(container.querySelector('[data-testid="chat-thinking-panel"]')
       ?.getAttribute('data-expanded')).toBe('true');
+    expect(container.querySelector('[data-openbitfun-part="leadingIcon"]')).toBe(leadingIcon);
   });
 });
 
diff --git a/src/web-ui/src/flow_chat/tool-cards/TaskToolDisplay.scss b/src/web-ui/src/flow_chat/tool-cards/TaskToolDisplay.scss
index 7e1895bd74..39cf6eb3cb 100644
--- a/src/web-ui/src/flow_chat/tool-cards/TaskToolDisplay.scss
+++ b/src/web-ui/src/flow_chat/tool-cards/TaskToolDisplay.scss
@@ -67,7 +67,6 @@
   }
 
   &.task-with-subagent-wrapper--expanded {
-    margin-block: var(--openbitfun-space-1) var(--openbitfun-space-3);
     overflow: hidden;
     border: var(--openbitfun-border-width-default) solid var(--openbitfun-color-border-default);
     background: var(--openbitfun-color-surface-panel);