openclaw-openagent 1.0.9 → 1.0.12

package/src/plugin-ui/assets/openagent-override.js

@@ -2,7 +2,7 @@
  * OpenAgent UI Override — Auto-generated, do not edit directly!
  *
  * Source: src/plugin-ui/modules/
- * Built:  2026-06-29T06:32:31.586Z
+ * Built:  2026-07-06T03:23:32.989Z
  *
  * To modify, edit the source modules and run:
  *   npm run build:override
@@ -48,6 +48,12 @@ const CL = {
   handleDelegateWsEvent: function(msg) {},
   processCustomCards: function(bubble) {},
 
+  // ── Host 版本（构建时注入，fallback 运行时检测）──
+  hostVersion: '__OPENCLAW_HOST_VERSION__',
+
+  // ── Override 构建标识（构建时注入，用于缓存自检）──
+  buildId: "65bf8968e270",
+
   // ── 配置 ──
   OPENAGENT_API: 'https://api.openagent.club',
   AUTH_API: '/plugins/openagent',  // Proxied via Gateway registerHttpRoute (see src/proxy/auth-proxy.ts)
@@ -56,6 +62,252 @@ const CL = {
   CACHE_TTL: 30000,
 };
 
+function _clFindOverrideScript() {
+  try {
+    var scripts = document.querySelectorAll('script[src*="openagent-override.js"]');
+    return scripts.length ? scripts[scripts.length - 1] : null;
+  } catch (e) {
+    return null;
+  }
+}
+
+function _clReadOverrideScriptVersionFromDocument() {
+  try {
+    var script = _clFindOverrideScript();
+    if (!script) return '';
+    var src = script.getAttribute('src') || '';
+    var url = new URL(src, window.location.href);
+    return url.searchParams.get('v') || '';
+  } catch (e) {
+    return '';
+  }
+}
+
+function _clResolveControlUiIndexUrl() {
+  try {
+    var script = _clFindOverrideScript();
+    if (script) {
+      var scriptUrl = new URL(script.src || script.getAttribute('src'), window.location.href);
+      return new URL('./', scriptUrl.href).href;
+    }
+  } catch (e) {}
+  try {
+    var url = new URL(window.location.href);
+    url.hash = '';
+    url.search = '';
+    return url.href;
+  } catch (e) {
+    return '/';
+  }
+}
+
+function _clExtractOverrideScriptVersionFromHtml(html) {
+  var match = String(html || '').match(/openagent-override\.js\?v=([A-Za-z0-9._-]+)/);
+  return match ? match[1] : '';
+}
+
+function _clInstallOverrideUpdateCheck() {
+  if (window.__openagentOverrideUpdateCheckInstalled) return;
+  window.__openagentOverrideUpdateCheckInstalled = true;
+
+  var currentVersion = _clReadOverrideScriptVersionFromDocument() || CL.buildId || '';
+  var storageKey = 'openagent.overrideScriptVersion.v1';
+  var reloadKey = 'openagent.overrideReloadedVersion.v1';
+  try {
+    document.documentElement.setAttribute('data-openagent-build-id', CL.buildId || 'unknown');
+    if (currentVersion) document.documentElement.setAttribute('data-openagent-script-version', currentVersion);
+  } catch (e) {}
+
+  try {
+    if (window.localStorage && currentVersion) {
+      window.localStorage.setItem(storageKey, currentVersion);
+    }
+  } catch (e) {}
+
+  function reloadForVersion(nextVersion) {
+    if (!nextVersion || nextVersion === currentVersion) return;
+    try {
+      if (window.sessionStorage && window.sessionStorage.getItem(reloadKey) === nextVersion) return;
+      if (window.sessionStorage) window.sessionStorage.setItem(reloadKey, nextVersion);
+    } catch (e) {}
+    console.info('[openagent] override updated, reloading Control UI', currentVersion, '→', nextVersion);
+    window.location.reload();
+  }
+
+  async function checkLatestOverrideVersion() {
+    if (document.visibilityState && document.visibilityState === 'hidden') return;
+    try {
+      var res = await fetch(_clResolveControlUiIndexUrl(), { cache: 'no-store' });
+      if (!res || !res.ok) return;
+      var latestVersion = _clExtractOverrideScriptVersionFromHtml(await res.text());
+      reloadForVersion(latestVersion);
+    } catch (e) {}
+  }
+
+  setTimeout(checkLatestOverrideVersion, 3000);
+  setInterval(checkLatestOverrideVersion, 60000);
+  window.addEventListener('focus', checkLatestOverrideVersion);
+  document.addEventListener('visibilitychange', function() {
+    if (!document.hidden) checkLatestOverrideVersion();
+  });
+}
+
+_clInstallOverrideUpdateCheck();
+
+// ── 版本解析与比较（供 execution-card V2 分支使用）──
+
+function _clParseHostVersion(v) {
+  if (!v) return [0, 0, 0];
+  var base = String(v).split('-')[0];
+  var parts = base.split('.');
+  if (parts.length !== 3) return [0, 0, 0];
+  var y = parseInt(parts[0], 10);
+  var m = parseInt(parts[1], 10);
+  var d = parseInt(parts[2], 10);
+  if (isNaN(y) || isNaN(m) || isNaN(d)) return [0, 0, 0];
+  return [y, m, d];
+}
+
+function _clIsHostVersionGte(minVer) {
+  if (CL.hostVersionSource !== 'exact' && CL.hostVersionSource !== 'script' && CL.hostVersionSource !== 'runtime') {
+    _clRefreshHostVersionFromRuntime();
+  }
+  var cur = _clParseHostVersion(CL.hostVersion || '');
+  var min = _clParseHostVersion(minVer);
+  for (var i = 0; i < 3; i++) {
+    if (cur[i] > min[i]) return true;
+    if (cur[i] < min[i]) return false;
+  }
+  return true;
+}
+
+function _clResolveHostProfile(version) {
+  var parsed = _clParseHostVersion(version || '');
+  if (parsed[0] === 2026 && parsed[1] === 4) return 'oc-2026-04';
+  if (parsed[0] === 2026 && parsed[1] === 5) return 'oc-2026-05';
+  if (parsed[0] === 2026 && parsed[1] === 6) return 'oc-2026-06';
+  return 'oc-unknown';
+}
+
+function _clNormalizeHostVersion(value) {
+  var match = String(value || '').match(/20\d{2}\.\d{1,2}\.\d{1,2}(?:-[A-Za-z0-9._-]+)?/);
+  return match ? match[0] : '';
+}
+
+function _clGetByPath(root, path) {
+  var cur = root;
+  for (var i = 0; i < path.length; i++) {
+    if (!cur) return '';
+    cur = cur[path[i]];
+  }
+  return cur;
+}
+
+function _clReadHostVersionFromRuntime() {
+  try {
+    var scripts = document.querySelectorAll('script[data-openagent-host-version]');
+    for (var i = scripts.length - 1; i >= 0; i--) {
+      var scriptVersion = _clNormalizeHostVersion(scripts[i].getAttribute('data-openagent-host-version'));
+      if (scriptVersion) return { version: scriptVersion, source: 'script' };
+    }
+  } catch (e) {}
+
+  var globals = [
+    window.__OPENCLAW_HOST_VERSION__,
+    window.__OPENCLAW_VERSION__,
+    window.__openclawVersion,
+    window.openclawVersion,
+  ];
+  for (var g = 0; g < globals.length; g++) {
+    var globalVersion = _clNormalizeHostVersion(globals[g]);
+    if (globalVersion) return { version: globalVersion, source: 'runtime' };
+  }
+
+  try {
+    var metaVersion = _clNormalizeHostVersion(
+      document.querySelector('meta[name="openclaw-version"],meta[name="openclaw:version"]')?.getAttribute('content')
+    );
+    if (metaVersion) return { version: metaVersion, source: 'runtime' };
+  } catch (e) {}
+
+  try {
+    var app = document.querySelector('openclaw-app');
+    if (app) {
+      var paths = [
+        ['runtime', 'version'],
+        ['hello', 'server', 'version'],
+        ['hello', 'version'],
+        ['client', 'hello', 'server', 'version'],
+        ['client', 'version'],
+        ['version'],
+        ['appVersion'],
+      ];
+      for (var p = 0; p < paths.length; p++) {
+        var appVersion = _clNormalizeHostVersion(_clGetByPath(app, paths[p]));
+        if (appVersion) return { version: appVersion, source: 'runtime' };
+      }
+    }
+  } catch (e) {}
+
+  return null;
+}
+
+function _clApplyHostVersion(version, source) {
+  CL.hostVersion = version || '2026.3.0';
+  CL.hostVersionSource = source || 'fallback';
+  CL.hostProfile = _clResolveHostProfile(CL.hostVersion);
+  try {
+    document.documentElement.setAttribute('data-openagent-host-version', CL.hostVersion || 'unknown');
+    document.documentElement.setAttribute('data-openagent-host-profile', CL.hostProfile);
+    document.documentElement.setAttribute('data-openagent-host-version-source', CL.hostVersionSource);
+  } catch (e) {}
+}
+
+function _clRefreshHostVersionFromRuntime() {
+  var detected = _clReadHostVersionFromRuntime();
+  if (!detected) return false;
+  if (detected.version !== CL.hostVersion || detected.source !== CL.hostVersionSource) {
+    _clApplyHostVersion(detected.version, detected.source);
+    console.log('[cl-version] detected via ' + detected.source + ': ' + detected.version);
+  }
+  return true;
+}
+
+function _clScheduleHostVersionRefresh() {
+  var attempts = 0;
+  var timer = setInterval(function() {
+    attempts++;
+    if (_clRefreshHostVersionFromRuntime() || attempts >= 20) {
+      clearInterval(timer);
+    }
+  }, 500);
+}
+
+var _clInitialExactVersion = _clNormalizeHostVersion(CL.hostVersion);
+if (_clInitialExactVersion) {
+  _clApplyHostVersion(_clInitialExactVersion, 'exact');
+} else if (!_clRefreshHostVersionFromRuntime()) {
+  // ─ 运行时 fallback：只做版本族保守判断，避免把 2026.5 误判为 2026.6.9 ──
+  // v5.x (2026.5+) 有 data-theme / --glass-*；v4.x 有 data-theme-mode / --vscode-*。
+  try {
+    var cs = getComputedStyle(document.documentElement);
+    if (document.documentElement.hasAttribute('data-theme-mode')
+      || cs.getPropertyValue('--vscode-editor-background').trim()) {
+      _clApplyHostVersion('2026.4.0', 'feature-fallback');
+    } else if (document.documentElement.hasAttribute('data-theme')
+      || cs.getPropertyValue('--glass-surface').trim()
+      || cs.getPropertyValue('--kn-bg-primary').trim()) {
+      _clApplyHostVersion('2026.5.0', 'feature-fallback');
+    } else {
+      _clApplyHostVersion('2026.3.0', 'feature-fallback');
+    }
+    console.log('[cl-version] fallback via DOM/CSS features: ' + CL.hostVersion);
+  } catch (e) {
+    _clApplyHostVersion('2026.3.0', 'feature-fallback');
+  }
+  _clScheduleHostVersionRefresh();
+}
+
 // 暴露到 window 供控制台调试/测试
 window.__CL = CL;
 
@@ -89,6 +341,28 @@ CL._saveAgentIdentityCache = function() {
   } catch (err) {}
 };
 
+CL.pickAgentIdentityDescription = function(agent) {
+  if (!agent || typeof agent !== 'object') return '';
+  var keys = [
+    'agent_bio',
+    'agentBio',
+    'bio',
+    'description',
+    'desc',
+    'agent_description',
+    'agentDescription',
+    'MOM',
+    'mom',
+    'introduction',
+    'summary'
+  ];
+  for (var i = 0; i < keys.length; i++) {
+    var value = agent[keys[i]];
+    if (typeof value === 'string' && value.trim()) return value.trim();
+  }
+  return '';
+};
+
 CL.storeAgentIdentity = function(agent, fallbackName) {
   if (!agent || typeof agent !== 'object') return null;
   CL._loadAgentIdentityCache();
@@ -97,12 +371,16 @@ CL.storeAgentIdentity = function(agent, fallbackName) {
     agent.user_id || agent.userId || agent.identifier || agent.tim_user_id || agent.timUserId || '';
   var name = agent.name || agent.agent_name || agent.agentName || fallbackName || '';
   var avatar = agent.avatar || agent.avatar_url || agent.avatarUrl || agent.image || agent.logo || agent.photo || '';
+  var bio = CL.pickAgentIdentityDescription(agent);
   var record = {
     id: id,
     agent_id: id,
     tag: agent.tag || id,
     name: name,
     avatar: avatar || null,
+    bio: bio,
+    description: agent.description || bio || '',
+    MOM: agent.MOM || agent.mom || '',
   };
 
   var keys = [id, record.tag, name, fallbackName].filter(Boolean);
@@ -576,6 +854,62 @@ if (!window.__clDiagClickProbeInstalled) {
   }, true);
 }
 
+// ════════════════════════════════════════════════════════════════
+// MODULE: host-adapter/selected
+// ════════════════════════════════════════════════════════════════
+
+/*__OPENAGENT_HOST_ADAPTER_START__*/
+// HOST ADAPTER: oc-unknown
+// ── Unknown OpenClaw host adapter ──
+// Fail closed: render OpenAgent's own card, but do not apply host-structure
+// takeover selectors when the host version is not one of the supported series.
+
+(function _clInstallHostAdapterUnknown() {
+  function _false() { return false; }
+
+  var adapter = {
+    id: 'oc-unknown',
+    family: 'unknown',
+    css: {
+      remoteShell: [],
+      outputHostMargin: [],
+      outputHostMarginReset: [],
+      summaryHidden: [],
+      hostShellRawText: [],
+      rawTextCardHosts: [],
+      rawTextPlaceholderHosts: [],
+      hostBody: [],
+      manualOpenReset: [],
+      hostShellReset: [],
+      hostShellSummary: [],
+      modernCardLayout: false,
+    },
+    nativeStyle: {
+      shellSelectors: [],
+      summarySelectors: [],
+      indentSelectors: [],
+    },
+    selectors: {
+      textContext: '.chat-text',
+      summary: '',
+      forceOpenHeader: '',
+      rawTextHostClosest: [],
+      rawTextHostsWithinShell: '',
+    },
+    isRemoteNativeToolShellCandidate: _false,
+    isNativeToolShell: _false,
+    isToolLikeShell: _false,
+    isToolBody: _false,
+    isMarkableHost: _false,
+  };
+
+  CL.hostAdapter = adapter;
+  try {
+    document.documentElement.setAttribute('data-openagent-host-adapter', adapter.id);
+  } catch (e) {}
+})();
+/*__OPENAGENT_HOST_ADAPTER_END__*/
+
 // ════════════════════════════════════════════════════════════════
 // MODULE: loader/ws-intercept.js
 // ════════════════════════════════════════════════════════════════
@@ -1405,7 +1739,7 @@ function avatarUrl(agent) {
     if (agent.avatar.startsWith('http')) return agent.avatar;
     return CL.AUTH_API + '/' + agent.avatar;
   }
-  return `https://ui-avatars.com/api/?name=${encodeURIComponent(agent.name)}&background=random&size=64`;
+  return './icon.png';
 }
 
 const ESC_MAP = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' };
@@ -1478,17 +1812,23 @@ function AgentCard(agent, opts = {}) {
     info.appendChild(_text('div', 'agent-card__name', agent.name || ''));
     info.appendChild(_text('div', 'agent-card__bio', agent.bio || '暂无简介'));
     const stats = _el('div', 'agent-card__stats');
-    stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', `${formatNumber(agent.claws)}☆`));
+    // 星标 + 数字 紧密组合（Figma gap 1.5px）
+    const statGroup = _el('span', 'agent-card__stat-group');
+    var starIcon = _el('span', 'agent-card__stat-icon');
+    starIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M5.94531 0.525391C6.08953 0.525551 6.20334 0.604267 6.25098 0.701172L7.59668 3.43262L7.71875 3.68066L7.99121 3.7207L11.0859 4.16992V4.1709H11.0869C11.1865 4.18536 11.2656 4.2375 11.3135 4.30371L11.3506 4.37402C11.3752 4.44422 11.3691 4.52183 11.3301 4.58984L11.2803 4.6543L9.01172 6.86914L8.81543 7.06152L8.86133 7.33301L9.3877 10.4043C9.40428 10.501 9.36472 10.6085 9.26172 10.6797C9.20158 10.7197 9.13 10.7412 9.05762 10.7412C9.00017 10.7412 8.94132 10.7275 8.8877 10.7002L6.18945 9.2793L5.94531 9.15039L5.7002 9.2793L3.00684 10.6982C2.95198 10.7266 2.89097 10.7412 2.83203 10.7412C2.77821 10.7412 2.72454 10.7298 2.67578 10.707L2.62891 10.6797C2.52556 10.6083 2.48649 10.5012 2.50293 10.4053V10.4043L3.0293 7.33301L3.0752 7.06152L2.87793 6.86914L0.611328 4.6543L0.610352 4.65332L0.560547 4.58984C0.521516 4.522 0.515166 4.44401 0.540039 4.37305L0.539062 4.37207C0.573747 4.27569 0.671018 4.18999 0.803711 4.1709L0.804688 4.16992L3.89844 3.7207L4.17188 3.68066L4.29395 3.43262L5.63867 0.702148C5.68788 0.603278 5.80274 0.525391 5.94531 0.525391Z" stroke="#666666" stroke-width="1.05"/></svg>';
+    statGroup.appendChild(starIcon);
+    statGroup.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', formatNumber(agent.claws)));
+    stats.appendChild(statGroup);
     if (agent.owner) {
-      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · owner${agent.owner}`));
+      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · ${agent.owner}`));
     }
     info.appendChild(stats);
     contentGroup.appendChild(info);
 
     row1.appendChild(contentGroup);
 
-    // @Try 按钮
-    const defaultLabel = 'Try';
+    // @召唤 按钮
+    const defaultLabel = '@召唤';
     const btn = _text('button', 'agent-card__action', actionLabel || defaultLabel);
     if (onAction) {
       btn.addEventListener('click', (e) => {
@@ -1524,14 +1864,19 @@ function AgentCard(agent, opts = {}) {
     body.appendChild(_text('div', 'agent-card__bio', agent.bio || '暂无简介'));
 
     const stats = _el('div', 'agent-card__stats');
-    stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', `${formatNumber(agent.claws)}☆`));
+    const statGroup = _el('span', 'agent-card__stat-group');
+    var starIcon = _el('span', 'agent-card__stat-icon');
+    starIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M5.94531 0.525391C6.08953 0.525551 6.20334 0.604267 6.25098 0.701172L7.59668 3.43262L7.71875 3.68066L7.99121 3.7207L11.0859 4.16992V4.1709H11.0869C11.1865 4.18536 11.2656 4.2375 11.3135 4.30371L11.3506 4.37402C11.3752 4.44422 11.3691 4.52183 11.3301 4.58984L11.2803 4.6543L9.01172 6.86914L8.81543 7.06152L8.86133 7.33301L9.3877 10.4043C9.40428 10.501 9.36472 10.6085 9.26172 10.6797C9.20158 10.7197 9.13 10.7412 9.05762 10.7412C9.00017 10.7412 8.94132 10.7275 8.8877 10.7002L6.18945 9.2793L5.94531 9.15039L5.7002 9.2793L3.00684 10.6982C2.95198 10.7266 2.89097 10.7412 2.83203 10.7412C2.77821 10.7412 2.72454 10.7298 2.67578 10.707L2.62891 10.6797C2.52556 10.6083 2.48649 10.5012 2.50293 10.4053V10.4043L3.0293 7.33301L3.0752 7.06152L2.87793 6.86914L0.611328 4.6543L0.610352 4.65332L0.560547 4.58984C0.521516 4.522 0.515166 4.44401 0.540039 4.37305L0.539062 4.37207C0.573747 4.27569 0.671018 4.18999 0.803711 4.1709L0.804688 4.16992L3.89844 3.7207L4.17188 3.68066L4.29395 3.43262L5.63867 0.702148C5.68788 0.603278 5.80274 0.525391 5.94531 0.525391Z" stroke="#666666" stroke-width="1.05"/></svg>';
+    statGroup.appendChild(starIcon);
+    statGroup.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', formatNumber(agent.claws)));
+    stats.appendChild(statGroup);
     if (agent.owner) {
-      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · owner${agent.owner}`));
+      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · ${agent.owner}`));
     }
     body.appendChild(stats);
     card.appendChild(body);
 
-    const btn = _text('button', 'agent-card__action', actionLabel || 'Try');
+    const btn = _text('button', 'agent-card__action', actionLabel || '@召唤');
     if (onAction) {
       btn.addEventListener('click', (e) => {
         e.stopPropagation();
@@ -1568,14 +1913,19 @@ function AgentCard(agent, opts = {}) {
     body.appendChild(_text('div', 'agent-card__bio', agent.bio || '暂无简介'));
 
     const stats = _el('div', 'agent-card__stats');
-    stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', `${formatNumber(agent.claws)}☆`));
+    const statGroup = _el('span', 'agent-card__stat-group');
+    var starIcon = _el('span', 'agent-card__stat-icon');
+    starIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M5.94531 0.525391C6.08953 0.525551 6.20334 0.604267 6.25098 0.701172L7.59668 3.43262L7.71875 3.68066L7.99121 3.7207L11.0859 4.16992V4.1709H11.0869C11.1865 4.18536 11.2656 4.2375 11.3135 4.30371L11.3506 4.37402C11.3752 4.44422 11.3691 4.52183 11.3301 4.58984L11.2803 4.6543L9.01172 6.86914L8.81543 7.06152L8.86133 7.33301L9.3877 10.4043C9.40428 10.501 9.36472 10.6085 9.26172 10.6797C9.20158 10.7197 9.13 10.7412 9.05762 10.7412C9.00017 10.7412 8.94132 10.7275 8.8877 10.7002L6.18945 9.2793L5.94531 9.15039L5.7002 9.2793L3.00684 10.6982C2.95198 10.7266 2.89097 10.7412 2.83203 10.7412C2.77821 10.7412 2.72454 10.7298 2.67578 10.707L2.62891 10.6797C2.52556 10.6083 2.48649 10.5012 2.50293 10.4053V10.4043L3.0293 7.33301L3.0752 7.06152L2.87793 6.86914L0.611328 4.6543L0.610352 4.65332L0.560547 4.58984C0.521516 4.522 0.515166 4.44401 0.540039 4.37305L0.539062 4.37207C0.573747 4.27569 0.671018 4.18999 0.803711 4.1709L0.804688 4.16992L3.89844 3.7207L4.17188 3.68066L4.29395 3.43262L5.63867 0.702148C5.68788 0.603278 5.80274 0.525391 5.94531 0.525391Z" stroke="#666666" stroke-width="1.05"/></svg>';
+    statGroup.appendChild(starIcon);
+    statGroup.appendChild(_text('span', 'agent-card__stat agent-card__stat--claws', formatNumber(agent.claws)));
+    stats.appendChild(statGroup);
     if (agent.owner) {
-      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · owner${agent.owner}`));
+      stats.appendChild(_text('span', 'agent-card__stat agent-card__stat--owner', ` · ${agent.owner}`));
     }
     body.appendChild(stats);
     card.appendChild(body);
 
-    const btn = _text('button', 'agent-card__action', actionLabel || '@ Chat');
+    const btn = _text('button', 'agent-card__action', actionLabel || '@召唤');
     if (onAction) {
       btn.addEventListener('click', (e) => { e.stopPropagation(); onAction(agent); });
       card.addEventListener('click', (e) => { e.stopPropagation(); onAction(agent); });
@@ -1685,10 +2035,13 @@ function AgentCard(agent, opts = {}) {
 // ── 样式注入 ──
 
 function injectStyles() {
-  if (document.getElementById('openagent-override-styles')) return;
+  var oldStyle = document.getElementById('openagent-override-styles');
+  if (oldStyle) oldStyle.remove();
 
   const style = document.createElement('style');
   style.id = 'openagent-override-styles';
+  style.setAttribute('data-openagent-style', 'agent-book-panel');
+  style.setAttribute('data-openagent-host-version', CL.hostVersion || 'unknown');
   style.textContent = `
     /* ── 流式回复边框闪烁：覆盖为蓝色 ── */
     @keyframes chatStreamPulse {
@@ -1700,80 +2053,39 @@ function injectStyles() {
       border-color: #3b82f6;
     }
 
-    /* ── @ Agent Book 按钮（Figma 1:1117 物理级复刻 — Mesh Gradient） ── */
+    /* ── @ Agent Book 按钮（Figma 129:955 Frame 72552 — 紫色渐变） ── */
     .openagent-at-btn {
       position: relative;
-      overflow: hidden; /* Figma clipsContent: true */
+      overflow: hidden;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 4px;
-      height: 26px;
-      padding: 0 16px;
-      border-radius: 100px;
+      height: 27px;
+      padding: 0 12px;
+      border-radius: 150px;
       border: none;
-      background: #6ECCFF; /* Figma Frame 72552 底色 */
-      box-shadow: inset 0 0 8.5px 0 #96ECFF; /* Figma INNER_SHADOW */
+      background: linear-gradient(90deg, #5c4aff 0%, #8274ff 100%);
       color: #fff;
-      font-size: 13px;
-      font-weight: 600;
+      font-size: 12px;
+      font-weight: 500;
       cursor: pointer;
       transition: all 0.2s ease;
-      line-height: 26px;
+      line-height: 27px;
       margin-left: 6px;
       white-space: nowrap;
       flex-shrink: 0;
       letter-spacing: 0.2px;
-      /* 建立层叠上下文，让伪元素在底层 */
-      z-index: 1;
-      isolation: isolate;
-    }
-
-    /* Figma 外层 Ellipse 12873：蓝色椭圆，偏左 */
-    .openagent-at-btn::before {
-      content: '';
-      position: absolute;
-      left: -13%;
-      top: -98%;
-      width: 50%;
-      height: 304%;
-      background: #7A94FF;
-      filter: blur(23px); /* Figma LAYER_BLUR: 23.2px */
-      transform: rotate(174deg);
-      z-index: -1;
-      pointer-events: none;
-    }
-
-    /* Figma 外层 Ellipse 12872：黄绿色椭圆，偏右 */
-    .openagent-at-btn::after {
-      content: '';
-      position: absolute;
-      left: 70%;
-      top: -49%;
-      width: 54%;
-      height: 145%;
-      background: #A1FF2E;
-      filter: blur(30.5px); /* Figma LAYER_BLUR: 30.5px */
-      transform: rotate(27deg);
-      z-index: -1;
-      pointer-events: none;
-    }
-
-    /* 确保文字始终在最高层 */
-    .openagent-at-btn .at-sym,
-    .openagent-at-btn span {
-      position: relative;
-      z-index: 2;
+      font-family: "PingFang SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
     }
 
     .openagent-at-btn:hover {
-      filter: brightness(1.08);
       transform: translateY(-1px);
-      box-shadow: inset 0 0 8.5px 0 #96ECFF, 0 2px 8px rgba(110, 204, 255, 0.4);
+      box-shadow: inset 0 0 6px 1px rgba(255, 255, 255, 0.65);
     }
     .openagent-at-btn .at-sym {
-      font-size: 14px;
-      font-weight: 700;
+      font-size: 11.6px;
+      font-weight: 500;
       color: #fff;
     }
 
@@ -1796,9 +2108,8 @@ function injectStyles() {
       position: fixed;
       max-height: none;
       background: var(--oa-panel-bg, #fff);
-      border: 1.2px solid var(--oa-border, rgba(47, 47, 51, 0.12));
-      border-radius: 18px;
-      box-shadow: 0 -4px 24px var(--oa-shadow-color, rgba(0,0,0,0.08)), 0 2px 8px var(--oa-shadow-color, rgba(0,0,0,0.04));
+      border: 0.5px solid #dbdbdb;
+      border-radius: 16px;
       z-index: 99999;
       overflow: hidden;
       display: none;
@@ -1810,6 +2121,7 @@ function injectStyles() {
     }
     .openagent-agent-panel.visible {
       display: flex;
+      padding: 30px;
       animation: openagent-up 0.25s cubic-bezier(0.16, 1, 0.3, 1);
     }
     @keyframes openagent-up {
@@ -1823,28 +2135,26 @@ function injectStyles() {
       justify-content: space-between;
       align-items: center;
       min-height: 26px;
-      padding: 6px 10px 0 10px;
       border-bottom: none;
     }
     .openagent-panel-title {
       display: flex;
       align-items: center;
       gap: 6px;
-      font-size: 16px;
+      font-size: 18px;
       font-weight: 500;
-      color: rgba(47, 47, 51, 0.8);
+      color: #333;
       text-transform: uppercase;
       letter-spacing: 0.3px;
     }
     .openagent-panel-title-icon {
-      width: 21px;
-      height: 21px;
+      width: 24px;
+      height: 24px;
       flex-shrink: 0;
     }
     .openagent-panel-close {
-      background: var(--oa-card-bg, rgba(249, 249, 249, 1));
+      background: transparent;
       border: none;
-      color: rgba(47, 47, 51, 0.6);
       cursor: pointer;
       width: 21px;
       height: 21px;
@@ -1860,17 +2170,184 @@ function injectStyles() {
     }
     .openagent-panel-close:hover {
       background: #eee;
-      color: rgba(47, 47, 51, 1);
     }
 
     /* ── 分隔线（Figma: 0.2px, opacity 0.16） ── */
     .openagent-panel-divider {
       height: 0;
       border: none;
-      border-top: 0.2px solid rgba(47, 47, 51, 0.16);
+      border-top: 0.2px solid #EAEAEA;
       margin: 0;
     }
 
+    /* ── 提示栏（Figma 141:3293，页面加载即显示） ── */
+    .openagent-hint-bar {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 12px 12px;
+      margin-bottom: 12px;
+      background: #fff;
+      border: 1.2px solid rgba(47, 47, 51, 0.1);
+      border-radius: var(--radius-lg, 18px);
+      gap: 12px;
+      width: 100%;
+      box-sizing: border-box;
+      margin:0 auto;
+      margin-bottom: 12px;
+    }
+    .openagent-hint-bar__content {
+      display: flex;
+      align-items: center;
+      gap: 9px;
+      flex: 1;
+      min-width: 0;
+    }
+    .openagent-hint-bar__icon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 27px;
+      height: 27px;
+      border-radius: 6px;
+      background: linear-gradient(135deg, rgba(130,116,255,0.1) 0%, rgba(56,144,255,0.1) 100%);
+      flex-shrink: 0;
+    }
+    .openagent-hint-bar__text {
+      font-family: "PingFang SC", sans-serif;
+      font-size: 15px;
+      font-weight: 400;
+      color: rgba(51, 51, 51, 0.8);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .openagent-hint-bar__close {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 21px;
+      height: 21px;
+      padding: 0;
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      flex-shrink: 0;
+      border-radius: 4px;
+      transition: all 0.1s;
+    }
+    .openagent-hint-bar__close:hover {
+      background: #eee;
+    }
+
+    /* 暗色主题 */
+    [data-theme-mode="dark"] .openagent-hint-bar,
+    [data-theme="dark"] .openagent-hint-bar {
+      background: #1c1c1c;
+      border-color: rgba(255,255,255,0.1);
+    }
+    [data-theme-mode="dark"] .openagent-hint-bar__text,
+    [data-theme="dark"] .openagent-hint-bar__text {
+      color: rgba(224, 224, 224, 0.8);
+    }
+    [data-theme-mode="dark"] .openagent-hint-bar__close,
+    [data-theme="dark"] .openagent-hint-bar__close {
+    }
+    [data-theme-mode="dark"] .openagent-hint-bar__close:hover,
+    [data-theme="dark"] .openagent-hint-bar__close:hover {
+      background: #333;
+    }
+
+    /* ── 空状态独立浮层（Figma 144:3444） ── */
+    .openagent-empty-toast {
+      display: flex;
+      align-items: center;
+      gap: 9px;
+      padding: 18px;
+      background: #fff;
+      border: 1.2px solid rgba(47, 47, 51, 0.1);
+      border-radius: 18px;
+      box-sizing: border-box;
+      animation: openagent-up 0.25s cubic-bezier(0.16, 1, 0.3, 1);
+      box-shadow: 0 -4px 24px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
+    }
+    [data-theme-mode="dark"] .openagent-empty-toast,
+    [data-theme="dark"] .openagent-empty-toast {
+      background: #1c1c1c; border-color: rgba(255,255,255,0.1);
+      box-shadow: 0 -4px 24px rgba(0,0,0,0.3);
+    }
+    [data-theme-mode="dark"] .openagent-empty-toast .openagent-empty-state__text,
+    [data-theme="dark"] .openagent-empty-toast .openagent-empty-state__text {
+      color: rgba(224, 224, 224, 0.8);
+    }
+    [data-theme-mode="dark"] .openagent-empty-toast .openagent-empty-state__close,
+    [data-theme="dark"] .openagent-empty-toast .openagent-empty-state__close {
+    }
+
+    /* ── 空状态（Figma 144:3444）— 无匹配结果 ── */
+    .openagent-empty-state {
+      padding: 18px;
+      background: #fff;
+      border: 1.2px solid rgba(47, 47, 51, 0.1);
+      border-radius: 18px;
+    }
+    .openagent-empty-state__row {
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      gap: 9px;
+    }
+    .openagent-empty-state__icon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 27px;
+      height: 27px;
+      border-radius: 6px;
+      background: linear-gradient(135deg, rgba(92,74,255,0.1) 0%, rgba(130,116,255,0.1) 100%);
+      flex-shrink: 0;
+    }
+    .openagent-empty-state__text {
+      flex: 1;
+      font-family: "PingFang SC", sans-serif;
+      font-size: 15px;
+      font-weight: 400;
+      color: rgba(51, 51, 51, 0.8);
+      line-height: 1.5;
+    }
+    .openagent-empty-state__close {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 21px;
+      height: 21px;
+      padding: 0;
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      flex-shrink: 0;
+      border-radius: 4px;
+    }
+    .openagent-empty-state__close:hover {
+      background: #eee;
+    }
+    [data-theme-mode="dark"] .openagent-empty-state,
+    [data-theme="dark"] .openagent-empty-state {
+      background: #1c1c1c;
+      border-color: rgba(255,255,255,0.1);
+    }
+    [data-theme-mode="dark"] .openagent-empty-state__text,
+    [data-theme="dark"] .openagent-empty-state__text {
+      color: rgba(224, 224, 224, 0.8);
+    }
+    [data-theme-mode="dark"] .openagent-empty-state__close,
+    [data-theme="dark"] .openagent-empty-state__close {
+    }
+    [data-theme-mode="dark"] .openagent-empty-state__close:hover,
+    [data-theme="dark"] .openagent-empty-state__close:hover {
+      background: #333;
+    }
+
     /* ── Agent 列表（section stack） ── */
     .openagent-agent-list {
       overflow-y: auto;
@@ -1878,7 +2355,6 @@ function injectStyles() {
       flex: 1;
       display: flex;
       flex-direction: column;
-      gap: 14px;
       min-height: 0;
       max-height: min(56vh, 451px);
       scrollbar-width: thin;
@@ -1901,9 +2377,9 @@ function injectStyles() {
     .openagent-agent-section {
       display: flex;
       flex-direction: column;
-      gap: 8px;
       width: 100%;
       min-width: 0;
+      margin-bottom: 30px;
     }
 
     /* ── 父分类标题（两级结构：Research > Market Research） ── */
@@ -1914,33 +2390,22 @@ function injectStyles() {
       width: 100%;
       min-width: 0;
     }
-    .openagent-parent-heading {
-      font-size: 11px;
-      font-weight: 600;
-      line-height: 13px;
-      color: rgba(47, 47, 51, 0.45);
-      padding: 0 12px;
-      text-transform: uppercase;
-      letter-spacing: 0.8px;
-    }
-
     /* ── 分组标题 ── */
     .openagent-section-heading {
-      font-size: 14px;
+      font-size: 16px;
       font-weight: 400;
-      line-height: 14px;
+      line-height: 16px;
       color: rgba(47, 47, 51, 0.80);
-      padding: 0 12px 0 12px;
       letter-spacing: 0;
+      margin-bottom: 20px;
     }
 
     /* ── 分组网格容器 ── */
     .openagent-section-grid {
       display: grid;
-      grid-template-columns: repeat(3, minmax(0, 439.5px));
+      grid-template-columns: repeat(3, 1fr);
       justify-content: start;
-      gap: 8px 14px;
-      padding: 0 12px;
+      gap: 12px;
       width: 100%;
       box-sizing: border-box;
     }
@@ -1973,9 +2438,15 @@ function injectStyles() {
     .agent-card__body { flex: 1; min-width: 0; }
     .agent-card__name-line { display: flex; align-items: baseline; gap: 8px; }
     .agent-card__name {
+      display: block;
+      min-width: 0;
+      max-width: 100%;
       font-family: "PingFang SC", sans-serif;
       font-weight: 600;
       color: rgba(47, 47, 51, 1);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
     }
     .agent-card__tag { font-size: 12px; color: #6366f1; font-weight: 500; }
     .agent-card__specialty { font-size: 12px; color: #999; font-weight: 400; }
@@ -1999,8 +2470,25 @@ function injectStyles() {
       gap: 0;
       flex-wrap: wrap;
     }
-    .agent-card__stat {
-      font-family: "PingFang SC", sans-serif;
+    /* 星标+数字 紧密组合（Figma gap 1.5px） */
+    .agent-card__stat-group {
+      display: flex;
+      align-items: center;
+      gap: 1.5px;
+    }
+    .agent-card__stat-icon {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 12px;
+      height: 12px;
+      font-size: 14px;
+      line-height: 1;
+      color: #666;
+      flex-shrink: 0;
+    }
+    .agent-card__stat {
+      font-family: "PingFang SC", sans-serif;
       font-size: 13.5px;
       font-weight: 400;
       white-space: nowrap;
@@ -2024,96 +2512,99 @@ function injectStyles() {
       white-space: nowrap;
     }
 
-    /* ── mode: mention（Figma Agent item → avart 实例） ── */
+    /* ── mode: mention（Figma Agent 卡片 142:3392） ── */
     .agent-card--mention {
       flex-direction: row;
-      align-items: stretch;
-      gap: 0;
-      padding: 0;
-      border-radius: 8px;
-      border: none;
-      background: transparent;
-      min-height: 88px;
+      align-items: center;
+      gap: 10px;
+      padding: 15px;
+      border-radius: 20px;
+      border: 0.5px solid #dbdbdb;
+      background: #fff;
       min-width: 0;
+      box-sizing: border-box;
     }
     .agent-card--mention:hover {
-      background: rgba(0, 0, 0, 0.02);
+      border-color: transparent;
+      box-shadow: 0 4px 12px 0 rgba(149, 147, 240, 0.10);
     }
-    /* 键盘导航高亮（§1.5）— 对标 TIM index.vue:32 'selected' class */
-    .agent-card--mention.openagent-card-selected {
-      background: rgba(99, 102, 241, 0.06);
-      outline: 2px solid rgba(99, 102, 241, 0.3);
-      outline-offset: -2px;
+    .openagent-agent-list .agent-card--mention:hover,
+    .openagent-agent-list .agent-card--search:hover {
+      position: relative;
+      border-color: transparent;
     }
-    [data-theme-mode="dark"] .agent-card--mention.openagent-card-selected {
-      background: rgba(99, 102, 241, 0.12);
-      outline-color: rgba(99, 102, 241, 0.4);
+    .openagent-agent-list .agent-card--mention:hover::after,
+    .openagent-agent-list .agent-card--search:hover::after {
+      content: "";
+      position: absolute;
+      inset: 0;
+      border-radius: inherit;
+      padding: 1px;
+      background: linear-gradient(90deg, rgba(92, 74, 255, 0.5), rgba(130, 116, 255, 0.5));
+      pointer-events: none;
+      box-sizing: border-box;
+      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+      -webkit-mask-composite: xor;
+      mask-composite: exclude;
     }
-
-    /* avart 外壳: Figma px 12, centered */
+    /* avart 外壳简化 — 不再需要 */
     .agent-card--mention .agent-card__avart {
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      gap: 0;
-      padding: 0 10px;
-      flex: 1;
+      display: contents;
+      padding: 0;
+      flex: none;
       min-width: 0;
-      box-sizing: border-box;
     }
 
-    /* 第一行: row, gap:24 (内容组 + @Try) */
+    /* 第一行: 内容区 + 按钮 */
     .agent-card--mention .agent-card__row1 {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      gap: 16px;
-      width: 100%;
+      display: contents;
+      gap: 0;
+      width: auto;
       min-width: 0;
     }
 
-    /* 内容组: row, gap:18 (头像 + 信息列) */
+    /* 内容组: 头像 + 信息列 */
     .agent-card--mention .agent-card__content-group {
       display: flex;
       flex-direction: row;
-      align-items: flex-start;
-      gap: 12px;
+      align-items: center;
+      gap: 10px;
       flex: 1;
       min-width: 0;
     }
 
-    /* 头像 */
+    /* 头像: 50×50 */
     .agent-card--mention .agent-card__avatar {
-      width: 48px;
-      height: 48px;
+      width: 50px;
+      height: 50px;
       border-radius: 50%;
       border: none;
       flex-shrink: 0;
       margin-top: 0;
     }
 
-    /* 信息列: name / bio / stats */
+    /* 信息列 */
     .agent-card--mention .agent-card__info {
       display: flex;
       flex-direction: column;
-      gap: 4px;
-      padding: 3px 0;
+      gap: 6px;
+      padding: 0;
       flex: 1;
       min-width: 0;
     }
 
     .agent-card--mention .agent-card__name {
-      font-size: 12px;
+      font-size: 15px;
       font-weight: 600;
-      line-height: 14px;
-      color: rgba(47, 47, 51, 1);
+      line-height: 1;
+      color: #333;
+      width:200px;
     }
     .agent-card--mention .agent-card__bio {
-      font-size: 10px;
+      font-size: 14px;
       font-weight: 400;
-      line-height: 14px;
-      color: rgba(47, 47, 51, 0.40);
-      text-align: justify;
+      line-height: 1.5;
+      color: rgba(47, 47, 51, 0.80);
       overflow: hidden;
       text-overflow: ellipsis;
       display: -webkit-box;
@@ -2122,37 +2613,31 @@ function injectStyles() {
       margin-top: 0;
     }
 
-    /* @Try 按钮 */
+    /* @召唤 按钮 */
     .agent-card--mention .agent-card__action {
-      width: 64px;
-      height: 30px;
-      padding: 0 14px;
-      border-radius: 10px;
-      background: #EFF0F2;
-      border: 1.286px solid rgba(47, 47, 51, 0.04);
-      color: rgba(47, 47, 51, 1);
+      height: 36px;
+      padding: 0 18px;
+      border-radius: 23px;
+      background: transparent;
+      border: 0.5px solid #dbdbdb;
+      color: #333;
       font-family: "PingFang SC", sans-serif;
-      font-size: 12px;
+      font-size: 16px;
       font-weight: 500;
-      line-height: 12px;
+      line-height: 15.43px;
       text-transform: capitalize;
       flex-shrink: 0;
       display: inline-flex;
       align-items: center;
       justify-content: center;
+      width: auto;
     }
-    .agent-card--mention .agent-card__action::before { content: '@'; font-weight: 600; }
+    .agent-card--mention .agent-card__action::before { content: none; }
     .agent-card--mention .agent-card__action:hover {
-      background: #e2e3e5;
+      background: rgba(0, 0, 0, 0.04);
     }
 
-    /* Legacy row2 kept for older generated DOM, but current mention card keeps stats in info. */
-    .agent-card--mention .agent-card__row2 {
-      display: none;
-      flex-direction: row;
-      align-items: center;
-      padding-left: 60px;
-    }
+    /* 统计行 */
     .agent-card--mention .agent-card__stats {
       display: flex;
       align-items: center;
@@ -2160,16 +2645,21 @@ function injectStyles() {
       margin-top: 0;
     }
     .agent-card--mention .agent-card__stat--claws {
-      color: rgba(240, 152, 0, 1);
-      font-size: 10px;
-      line-height: 12px;
-      letter-spacing: 1px;
+      color: #666;
+      font-size: 14px;
+      line-height: 1;
+      letter-spacing: 1.5px;
     }
     .agent-card--mention .agent-card__stat--owner {
-      color: rgba(47, 47, 51, 1);
-      font-size: 10px;
-      line-height: 12px;
-      letter-spacing: 1px;
+      color: #666;
+      font-size: 14px;
+      line-height: 1;
+      letter-spacing: 1.5px;
+    }
+
+    /* row2 (legacy compat) */
+    .agent-card--mention .agent-card__row2 {
+      display: none;
     }
 
     /* ── mode: search（有输入搜索结果，沿用旧式单列行） ── */
@@ -2179,18 +2669,11 @@ function injectStyles() {
       width: 100%;
       min-height: 64px;
       padding: 10px 12px;
-      border-radius: 10px;
+      border-radius: 20px;
       background: transparent;
+      border: 0.5px solid transparent;
       box-sizing: border-box;
     }
-    .agent-card--search:hover {
-      background: rgba(0, 0, 0, 0.02);
-    }
-    .agent-card--search.openagent-card-selected {
-      background: rgba(99, 102, 241, 0.06);
-      outline: 2px solid rgba(99, 102, 241, 0.3);
-      outline-offset: -2px;
-    }
     .agent-card--search .agent-card__avatar {
       width: 40px;
       height: 40px;
@@ -2204,48 +2687,50 @@ function injectStyles() {
       min-width: 0;
     }
     .agent-card--search .agent-card__name {
-      font-size: 13px;
+      font-size: 15px;
       line-height: 16px;
       font-weight: 600;
-      color: rgba(47, 47, 51, 1);
+      color: #333;
     }
     .agent-card--search .agent-card__bio {
-      font-size: 11px;
-      line-height: 15px;
-      color: rgba(47, 47, 51, 0.45);
+      font-size: 14px;
+      line-height: 1.5;
+      color: rgba(47, 47, 51, 0.80);
       -webkit-line-clamp: 1;
     }
     .agent-card--search .agent-card__stats {
       margin-top: 0;
     }
     .agent-card--search .agent-card__stat--claws {
-      font-size: 11px;
-      line-height: 13px;
-      color: rgba(240, 152, 0, 1);
+      font-size: 14px;
+      line-height: 1;
+      color: #666;
+      letter-spacing: 1.5px;
     }
     .agent-card--search .agent-card__stat--owner {
-      font-size: 11px;
-      line-height: 13px;
-      color: rgba(47, 47, 51, 0.65);
+      font-size: 14px;
+      line-height: 1;
+      color: #666;
+      letter-spacing: 1.5px;
     }
     .agent-card--search .agent-card__action {
-      width: 60px;
-      height: 28px;
-      padding: 0 12px;
-      border-radius: 10px;
-      background: #EFF0F2;
-      border: 1px solid rgba(47, 47, 51, 0.04);
-      color: rgba(47, 47, 51, 1);
+      height: 36px;
+      padding: 0 18px;
+      border-radius: 23px;
+      background: transparent;
+      border: 0.5px solid #dbdbdb;
+      color: #333;
       font-family: "PingFang SC", sans-serif;
-      font-size: 12px;
-      line-height: 12px;
+      font-size: 16px;
+      font-weight: 500;
+      line-height: 15.43px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
     }
-    .agent-card--search .agent-card__action::before { content: '@'; font-weight: 600; }
+    .agent-card--search .agent-card__action::before { content: none; }
     .agent-card--search .agent-card__action:hover {
-      background: #e2e3e5;
+      background: rgba(0, 0, 0, 0.04);
     }
 
     @media (max-width: 980px) {
@@ -2306,20 +2791,17 @@ function injectStyles() {
     [data-theme-mode="dark"] .openagent-agent-panel,
     [data-theme="dark"] .openagent-agent-panel {
       background: #1c1c1c; border-color: rgba(255,255,255,0.12);
-      box-shadow: 0 -4px 24px rgba(0,0,0,0.3);
     }
     [data-theme-mode="dark"] .openagent-panel-head,
     [data-theme="dark"] .openagent-panel-head { border-color: #2a2a2a; }
     [data-theme-mode="dark"] .openagent-panel-title,
     [data-theme="dark"] .openagent-panel-title { color: rgba(224, 224, 224, 0.8); }
     [data-theme-mode="dark"] .openagent-panel-close,
-    [data-theme="dark"] .openagent-panel-close { background: #2a2a2a; color: #888; }
+    [data-theme="dark"] .openagent-panel-close { background: #2a2a2a; }
     [data-theme-mode="dark"] .openagent-panel-close:hover,
-    [data-theme="dark"] .openagent-panel-close:hover { background: #333; color: #ccc; }
+    [data-theme="dark"] .openagent-panel-close:hover { background: #333; }
     [data-theme-mode="dark"] .openagent-section-heading,
     [data-theme="dark"] .openagent-section-heading { color: rgba(224, 224, 224, 0.45); }
-    [data-theme-mode="dark"] .openagent-parent-heading,
-    [data-theme="dark"] .openagent-parent-heading { color: rgba(224, 224, 224, 0.3); }
     [data-theme-mode="dark"] .openagent-panel-divider,
     [data-theme="dark"] .openagent-panel-divider { border-color: rgba(255,255,255,0.1); }
 
@@ -2331,28 +2813,37 @@ function injectStyles() {
     [data-theme="dark"] .agent-card__stat { color: #64748b; }
 
     [data-theme-mode="dark"] .agent-card--mention,
-    [data-theme="dark"] .agent-card--mention { background: transparent; }
+    [data-theme="dark"] .agent-card--mention { background: #1c1c1c; border-color: rgba(255,255,255,0.12); }
     [data-theme-mode="dark"] .agent-card--mention:hover,
-    [data-theme="dark"] .agent-card--mention:hover { background: #252525; }
+    [data-theme="dark"] .agent-card--mention:hover { border-color: transparent; }
+    [data-theme-mode="dark"] .agent-card--mention .agent-card__name,
+    [data-theme="dark"] .agent-card--mention .agent-card__name { color: #e0e0e0; }
+    [data-theme-mode="dark"] .agent-card--mention .agent-card__bio,
+    [data-theme="dark"] .agent-card--mention .agent-card__bio { color: rgba(224,224,224,0.7); }
+    [data-theme-mode="dark"] .agent-card--mention .agent-card__stat--claws,
+    [data-theme="dark"] .agent-card--mention .agent-card__stat--claws { color: #aaa; }
+    [data-theme-mode="dark"] .agent-card--mention .agent-card__stat--owner,
+    [data-theme="dark"] .agent-card--mention .agent-card__stat--owner { color: #aaa; }
     [data-theme-mode="dark"] .agent-card--mention .agent-card__action,
     [data-theme="dark"] .agent-card--mention .agent-card__action {
-      background: #333; border-color: #555; color: #ddd;
+      background: transparent; border-color: rgba(255,255,255,0.2); color: #ddd;
     }
     [data-theme-mode="dark"] .agent-card--mention .agent-card__action:hover,
-    [data-theme="dark"] .agent-card--mention .agent-card__action:hover { background: #444; }
-    [data-theme-mode="dark"] .agent-card--search:hover,
-    [data-theme="dark"] .agent-card--search:hover { background: #252525; }
-    [data-theme-mode="dark"] .agent-card--search.openagent-card-selected,
-    [data-theme="dark"] .agent-card--search.openagent-card-selected {
-      background: rgba(99, 102, 241, 0.12);
-      outline-color: rgba(99, 102, 241, 0.4);
-    }
+    [data-theme="dark"] .agent-card--mention .agent-card__action:hover { background: rgba(255,255,255,0.06); }
+    [data-theme-mode="dark"] .agent-card--search .agent-card__name,
+    [data-theme="dark"] .agent-card--search .agent-card__name { color: #e0e0e0; }
+    [data-theme-mode="dark"] .agent-card--search .agent-card__bio,
+    [data-theme="dark"] .agent-card--search .agent-card__bio { color: rgba(224, 224, 224, 0.65); }
+    [data-theme-mode="dark"] .agent-card--search .agent-card__stat--claws,
+    [data-theme="dark"] .agent-card--search .agent-card__stat--claws { color: #aaa; }
+    [data-theme-mode="dark"] .agent-card--search .agent-card__stat--owner,
+    [data-theme="dark"] .agent-card--search .agent-card__stat--owner { color: #aaa; }
     [data-theme-mode="dark"] .agent-card--search .agent-card__action,
     [data-theme="dark"] .agent-card--search .agent-card__action {
-      background: #333; border-color: #555; color: #ddd;
+      background: transparent; border-color: rgba(255,255,255,0.2); color: #ddd;
     }
     [data-theme-mode="dark"] .agent-card--search .agent-card__action:hover,
-    [data-theme="dark"] .agent-card--search .agent-card__action:hover { background: #444; }
+    [data-theme="dark"] .agent-card--search .agent-card__action:hover { background: rgba(255,255,255,0.06); }
 
 
     [data-theme-mode="dark"] .agent-card--inline,
@@ -2370,7 +2861,8 @@ function injectStyles() {
     [data-theme="dark"] .agent-card__loading {
       background: #1e1b3a; border-color: #2d2b55; color: #64748b;
     }
-  `;
+
+      `;
   document.head.appendChild(style);
 }
 
@@ -2597,6 +3089,7 @@ let panel = null;
 let backdrop = null;
 
 let inputWrapperRef = null; // 保存输入框包裹层引用
+let panelPositionResizeObserver = null;
 
 // ── 键盘导航状态（§1.5）──
 // 对标 TIM index.ts:13 "let selectedIndex: number = 0"
@@ -2631,14 +3124,14 @@ panel.className = 'openagent-agent-panel';
 panel.innerHTML = `
   <div class="openagent-panel-head">
     <span class="openagent-panel-title">
-      <svg class="openagent-panel-title-icon" width="28" height="28" viewBox="0 0 56 56" fill="none">
+      <svg class="openagent-panel-title-icon" width="24" height="24" viewBox="0 0 56 56" fill="none">
         <path d="M28 25H32C34.2091 25 36 26.7909 36 29V39C36 41.2091 34.2091 43 32 43H14C11.7909 43 10 41.2091 10 39V29C10 26.7909 11.7909 25 14 25H15" stroke="#12CCF6" stroke-width="3.3" stroke-linecap="round"/>
         <path d="M39 31H42C44.2091 31 46 29.2091 46 27V17C46 14.7909 44.2091 13 42 13H24C21.7909 13 20 14.7909 20 17V27C20 29.2091 21.7909 31 24 31H30.0652C30.236 31 30.3282 31.2004 30.217 31.3302L27.5 34.5" stroke="#12CCF6" stroke-width="3.3" stroke-linecap="round"/>
         <path d="M27 25.5L32.5 21" stroke="#12CCF6" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
       </svg>
-      <span class="panel-title-text">Agent Book</span>
+      <span class="panel-title-text">OpenAgent</span>
     </span>
-    <button class="openagent-panel-close">✕</button>
+    <button class="openagent-panel-close"><svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none"><path d="M5.625 5.625L15.375 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.375 5.625L5.625 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg></button>
   </div>
   <hr class="openagent-panel-divider" />
   <div class="openagent-agent-list">
@@ -2651,6 +3144,15 @@ panel.querySelector('.openagent-panel-close').addEventListener('click', () => {
   closePanel();
 });
 
+
+	// 提示栏关闭按钮
+	const hintClose = panel.querySelector('.openagent-hint-bar__close');
+	if (hintClose) {
+	  hintClose.addEventListener('click', () => {
+	    const hintBar = panel.querySelector('.openagent-hint-bar');
+	    if (hintBar) hintBar.style.display = 'none';
+	  });
+	}
 // 挂到 body（与 backdrop 同级，z-index 自然生效）
 document.body.appendChild(panel);
 return panel;
@@ -2665,12 +3167,71 @@ const width = Math.min(rect.width, window.innerWidth - viewportPadding * 2);
 const left = Math.max(viewportPadding, Math.min(rect.left, window.innerWidth - width - viewportPadding));
 panel.style.left = left + 'px';
 panel.style.width = width + 'px';
-panel.style.bottom = (window.innerHeight - rect.top + 8) + 'px';
+const toolbar = _findPanelToolbar();
+const isComposerWrapper = inputWrapperRef.classList
+  && inputWrapperRef.classList.contains('agent-chat__composer-combobox');
+if (isComposerWrapper) {
+  panel.style.bottom = (_readElementHeight(inputWrapperRef) + _readElementHeight(toolbar) + 35) + 'px';
+} else {
+  panel.style.bottom = (window.innerHeight - rect.top + 8) + 'px';
+}
 }
 
 /** resize 时实时跟随输入框 */
 function _onResize() { _positionPanel(); }
 
+function _findPanelToolbar() {
+  if (!inputWrapperRef) return null;
+  var chatInput = inputWrapperRef.closest && inputWrapperRef.closest('.agent-chat__input');
+  if (chatInput) {
+    var toolbar = chatInput.querySelector('.agent-chat__toolbar');
+    if (toolbar) return toolbar;
+  }
+
+  var parentEl = inputWrapperRef.parentElement;
+  if (parentEl) {
+    for (var i = 0; i < parentEl.children.length; i++) {
+      var child = parentEl.children[i];
+      if (child !== inputWrapperRef && child.className && String(child.className).indexOf('agent-chat__toolbar') !== -1) {
+        return child;
+      }
+    }
+  }
+  return null;
+}
+
+function _readElementHeight(el) {
+  if (!el) return 0;
+  var rect = el.getBoundingClientRect ? el.getBoundingClientRect() : null;
+  if (rect && rect.height > 0) return rect.height;
+  return typeof el.offsetHeight === 'number' ? el.offsetHeight : 0;
+}
+
+function _schedulePanelPosition() {
+  window.requestAnimationFrame
+    ? window.requestAnimationFrame(_positionPanel)
+    : setTimeout(_positionPanel, 0);
+}
+
+function _installPanelPositionObservers() {
+  if (panelPositionResizeObserver) {
+    panelPositionResizeObserver.disconnect();
+    panelPositionResizeObserver = null;
+  }
+  if (typeof ResizeObserver !== 'function' || !inputWrapperRef) return;
+
+  panelPositionResizeObserver = new ResizeObserver(_schedulePanelPosition);
+  panelPositionResizeObserver.observe(inputWrapperRef);
+  var toolbar = _findPanelToolbar();
+  if (toolbar) panelPositionResizeObserver.observe(toolbar);
+}
+
+function _teardownPanelPositionObservers() {
+  if (!panelPositionResizeObserver) return;
+  panelPositionResizeObserver.disconnect();
+  panelPositionResizeObserver = null;
+}
+
 // 搜索状态管理
 let currentAbort = null;  // AbortController for in-flight search
 let searchDebounceId = null;
@@ -2689,8 +3250,15 @@ return textarea.value.replace(/@/g, ' ').replace(/\s+/g, ' ').trim();
 }
 
 function openPanel(textarea) {
+// 清除上次的空状态弹窗
+var oldToast = document.querySelector('.openagent-empty-toast');
+if (oldToast) oldToast.remove();
+var oldEmpty = document.querySelector('.openagent-empty-state');
+if (oldEmpty) oldEmpty.remove();
+
 const p = ensurePanel();
 _positionPanel(); // 动态定位到 input 上方
+_installPanelPositionObservers();
 p.classList.add('visible');
 backdrop.classList.add('visible');
 window.addEventListener('resize', _onResize);
@@ -2753,6 +3321,7 @@ function closePanel() {
 if (panel) panel.classList.remove('visible');
 if (backdrop) backdrop.classList.remove('visible');
 window.removeEventListener('resize', _onResize);
+_teardownPanelPositionObservers();
 // 清理搜索状态
 if (currentAbort) { currentAbort.abort(); currentAbort = null; }
 if (searchDebounceId) { clearTimeout(searchDebounceId); searchDebounceId = null; }
@@ -2807,7 +3376,6 @@ function _scrollItemIntoView(index) {
 
 function _appendParentSection(container, parentTitle, children, textarea, renderedAgents) {
   const parentSec = _el('section', 'openagent-parent-section');
-  parentSec.appendChild(_text('div', 'openagent-parent-heading', parentTitle));
   children.forEach(function(child) {
     if (child.agents && child.agents.length > 0) {
       _appendAgentSection(parentSec, child.title, child.agents, textarea, renderedAgents);
@@ -2872,14 +3440,91 @@ function _appendSearchResults(container, agents, textarea, renderedAgents) {
   container.appendChild(list);
 }
 
+/**
+ * 空状态组件（Figma 144:3444）— 未匹配到 Agent 时显示
+ */
+/** 关闭已有空状态浮层 */
+function _dismissEmptyToast() {
+  var existing = document.querySelector('.openagent-empty-toast');
+  if (existing) existing.remove();
+}
+
+/** 独立浮层空状态（不在面板内） */
+function _getEmptyMessage(query) {
+  return CL.agentBookLastError ||
+    (query ? '暂未匹配到您想要的Agent 我们将持续上新～' : '暂无在线 Agent，请输入关键词搜索');
+}
+
+function _showEmptyToast(query, message) {
+  _dismissEmptyToast();
+  var toast = _el('div', 'openagent-empty-toast');
+
+  var iconWrap = _el('div', 'openagent-empty-state__icon');
+  iconWrap.innerHTML = '<svg width="14" height="14" viewBox="0 0 14 14" fill="none">' +
+    '<path d="M7 1.5C10.0376 1.5 12.5 3.96243 12.5 7C12.5 8.69527 11.7389 10.2145 10.5237 11.2559L13.0303 13.7626C13.3232 14.0555 13.3232 14.5303 13.0303 14.8232C12.7374 15.1161 12.2626 15.1161 11.9697 14.8232L9.38402 12.2376C8.53401 12.7803 7.49507 13.1079 6.37793 13.1079L7 12.5C6.99363 12.5008 6.98726 12.5012 6.98089 12.5012C3.9368 12.5307 1.46927 10.0632 1.49878 7.01908C1.52829 3.97499 3.99398 1.50537 7.03789 1.5H7ZM7 3C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11C9.20914 11 11 9.20914 11 7C11 4.79086 9.20914 3 7 3Z" fill="#8274ff" fill-opacity="0.6"/>' +
+    '</svg>';
+  toast.appendChild(iconWrap);
+
+  toast.appendChild(_text('span', 'openagent-empty-state__text', message || _getEmptyMessage(query)));
+
+  var closeBtn = _el('button', 'openagent-empty-state__close');
+  closeBtn.innerHTML = '<svg width="12" height="12" viewBox="0 0 12 12" fill="none">' +
+    '<path d="M1 1L11 11M11 1L1 11" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/>' +
+    '</svg>';
+  closeBtn.addEventListener('click', function() { toast.remove(); });
+  toast.appendChild(closeBtn);
+
+  // 定位到输入框上方
+  if (inputWrapperRef) {
+    var rect = inputWrapperRef.getBoundingClientRect();
+    toast.style.position = 'fixed';
+    toast.style.left = Math.max(16, rect.left) + 'px';
+    toast.style.width = Math.min(rect.width, window.innerWidth - 32) + 'px';
+    toast.style.bottom = (window.innerHeight - rect.top + 8) + 'px';
+    // ── V2 版本兼容：v1 bottom 固定 117px ──
+    var isV2Toast = typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9');
+    if (!isV2Toast) {
+      toast.style.bottom = '117px';
+    }
+    toast.style.zIndex = '100000';
+  }
+  document.body.appendChild(toast);
+}
+
+function _createEmptyState(query, message) {
+  var wrapper = _el('div', 'openagent-empty-state');
+  var row = _el('div', 'openagent-empty-state__row');
+
+  var iconWrap = _el('div', 'openagent-empty-state__icon');
+  iconWrap.innerHTML = '<svg width="14" height="14" viewBox="0 0 14 14" fill="none">' +
+    '<path d="M7 1.5C10.0376 1.5 12.5 3.96243 12.5 7C12.5 8.69527 11.7389 10.2145 10.5237 11.2559L13.0303 13.7626C13.3232 14.0555 13.3232 14.5303 13.0303 14.8232C12.7374 15.1161 12.2626 15.1161 11.9697 14.8232L9.38402 12.2376C8.53401 12.7803 7.49507 13.1079 6.37793 13.1079L7 12.5C6.99363 12.5008 6.98726 12.5012 6.98089 12.5012C3.9368 12.5307 1.46927 10.0632 1.49878 7.01908C1.52829 3.97499 3.99398 1.50537 7.03789 1.5H7ZM7 3C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11C9.20914 11 11 9.20914 11 7C11 4.79086 9.20914 3 7 3Z" fill="#8274ff" fill-opacity="0.6"/>' +
+    '</svg>';
+  row.appendChild(iconWrap);
+
+  var text = _text('span', 'openagent-empty-state__text', message || _getEmptyMessage(query));
+  row.appendChild(text);
+
+  var closeBtn = _el('button', 'openagent-empty-state__close');
+  closeBtn.innerHTML = '<svg width="12" height="12" viewBox="0 0 12 12" fill="none">' +
+    '<path d="M1 1L11 11M11 1L1 11" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/>' +
+    '</svg>';
+  closeBtn.addEventListener('click', function() {
+    wrapper.style.display = 'none';
+  });
+  row.appendChild(closeBtn);
+
+  wrapper.appendChild(row);
+  return wrapper;
+}
+
 function renderAgentList(container, agents, textarea, query) {
-if (!agents.length) {
-  const message = CL.agentBookLastError || '暂无在线 Agent';
-  container.innerHTML = '';
-  container.appendChild(_text('div', 'openagent-loading', message));
-  _currentAgents = [];
-  _currentTextarea = textarea;
-  return;
+  if (!agents.length) {
+      var emptyMessage = _getEmptyMessage(query);
+      _currentAgents = [];
+      _currentTextarea = textarea;
+      closePanel();
+      _showEmptyToast(query, emptyMessage);
+      return;
 }
 
 console.log('[openagent] renderAgentList:', agents.length, 'agents, textarea:', !!textarea);
@@ -2915,6 +3560,19 @@ _highlightItem(0);
  * 对齐 openagent-frontend NewChatPanel L92-105：
  * 找到最后一个 @，替换其后内容为 @agentName
  */
+function _pickMentionAgentDescription(agent) {
+  if (!agent || typeof agent !== 'object') return '';
+  if (CL && typeof CL.pickAgentIdentityDescription === 'function') {
+    return CL.pickAgentIdentityDescription(agent);
+  }
+  const keys = ['agent_bio', 'agentBio', 'bio', 'description', 'desc', 'agent_description', 'agentDescription', 'MOM', 'mom'];
+  for (let i = 0; i < keys.length; i++) {
+    const value = agent[keys[i]];
+    if (typeof value === 'string' && value.trim()) return value.trim();
+  }
+  return '';
+}
+
 function insertMention(textarea, agentName, agentData) {
 // 重新查找 textarea（Lit 可能重新渲染导致引用失效）
 const liveTextarea = document.querySelector(
@@ -2934,9 +3592,11 @@ liveTextarea.focus();
 const agentId = agentData?.agent_id || agentData?.agentId || agentData?.id || agentData?.tag ||
   agentData?.user_id || agentData?.userId || agentData?.identifier || agentData?.tim_user_id || agentData?.timUserId || '';
 const agentAvatar = agentData?.avatar || agentData?.avatar_url || agentData?.avatarUrl || agentData?.image || agentData?.logo || agentData?.photo || null;
+const agentBio = _pickMentionAgentDescription(agentData);
 console.log('[cl-diag][mention-select]', {
   agentName,
   resolvedAgentId: agentId || null,
+  hasAgentBio: !!agentBio,
   rawKeys: Object.keys(agentData || {}),
   rawAgent: agentData,
 });
@@ -2945,9 +3605,14 @@ if (!agentId) {
   console.warn('[openagent] mention skipped: missing agent identifier for', agentName, agentData);
   return;
 }
-CL.pendingMention = { agent_id: agentId, name: agentName, avatar: agentAvatar };
+CL.pendingMention = { agent_id: agentId, name: agentName, avatar: agentAvatar, agent_bio: agentBio };
 if (CL && typeof CL.storeAgentIdentity === 'function') {
-  CL.storeAgentIdentity({ agent_id: agentId, name: agentName, avatar: agentAvatar });
+  CL.storeAgentIdentity(Object.assign({}, agentData || {}, {
+    agent_id: agentId,
+    name: agentName,
+    avatar: agentAvatar,
+    agent_bio: agentBio,
+  }));
 }
 console.log('[openagent] mention stored:', CL.pendingMention);
 
@@ -3027,12 +3692,27 @@ function _setTextareaValue(textarea, value) {
   textarea.dispatchEvent(new Event('input', { bubbles: true }));
 }
 
+function _escapeRemoteAgentMarkerValue(value) {
+  return String(value || '')
+    .replace(/\s+/g, ' ')
+    .trim()
+    .replace(/"/g, "'");
+}
+
 function _buildRemoteAgentMarker(mention, userText) {
   const hasChinese = /[\u4e00-\u9fff]/.test(userText || '');
   const instruction = hasChinese
     ? '请调用 openagent_call_remote_agent 工具将此请求转发给远端 Agent 处理'
     : 'Please invoke the openagent_call_remote_agent tool to forward this request to the remote agent';
-  return `{openagent_call_remote_agent:agent_id="${mention.agent_id}",agent_name="${mention.name}",instruction="${instruction}"}`;
+  const attrs = [
+    `agent_id="${_escapeRemoteAgentMarkerValue(mention.agent_id)}"`,
+    `agent_name="${_escapeRemoteAgentMarkerValue(mention.name)}"`,
+  ];
+  if (mention.agent_bio) {
+    attrs.push(`agent_bio="${_escapeRemoteAgentMarkerValue(mention.agent_bio)}"`);
+  }
+  attrs.push(`instruction="${_escapeRemoteAgentMarkerValue(instruction)}"`);
+  return `{openagent_call_remote_agent:${attrs.join(',')}}`;
 }
 
 function _composeRemoteAgentMessage(textarea, mention) {
@@ -3213,6 +3893,8 @@ function tryInject() {
     const pos = ta.selectionStart;
     // 如果光标前已经是 @，不重复插入
     if (pos > 0 && val[pos - 1] === '@') {
+      // 按钮主动触发 → 清除 dismissed 状态，确保弹窗能打开
+      if (typeof resetMention === 'function') resetMention();
       _handleStateChange(ta);
       return;
     }
@@ -3271,9 +3953,140 @@ function tryInject() {
 
   console.log('[openagent] ✅ Agent Book UI injected (v3 hook-driven)');
 
+  // ── 提示栏（Figma 141:3293）：页面加载即显示 ──
+  _injectHintBar(inputContainer || textarea.parentElement, toolbarRow);
+
   return true;
 }
 
+/** 注入提示栏到输入区域上方 */
+function _injectHintBar(anchorEl, toolbarEl) {
+  if (!anchorEl || document.querySelector('.openagent-hint-bar')) return;
+
+  const hintBar = document.createElement('div');
+  hintBar.className = 'openagent-hint-bar';
+  hintBar.innerHTML = '' +
+    '<div class="openagent-hint-bar__content">' +
+      '<div class="openagent-hint-bar__icon">' +
+        '<svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" viewBox="0 0 27 27" fill="none">' +
+          '<rect width="27" height="27" rx="6" fill="url(#paint0_linear_141_3277)" fill-opacity="0.1"/>' +
+          '<path d="M13.5 6.75098C16.8137 6.75098 19.5 9.43727 19.5 12.751C19.5 14.3288 18.8894 15.7629 17.8936 16.834L20.7803 19.7207C21.0732 20.0136 21.0732 20.4884 20.7803 20.7812C20.4874 21.0741 20.0126 21.0741 19.7197 20.7812L16.7383 17.7998C15.8038 18.4004 14.6933 18.751 13.5 18.751C10.1863 18.751 7.5 16.0647 7.5 12.751C7.5 9.43727 10.1863 6.75098 13.5 6.75098ZM13.5 8.25098C11.0147 8.25098 9 10.2657 9 12.751C9 15.2363 11.0147 17.251 13.5 17.251C15.9853 17.251 18 15.2363 18 12.751C18 10.2657 15.9853 8.25098 13.5 8.25098Z" fill="url(#paint1_linear_141_3277)"/>' +
+          '<defs>' +
+            '<linearGradient id="paint0_linear_141_3277" x1="0" y1="13.5" x2="27" y2="13.5" gradientUnits="userSpaceOnUse">' +
+              '<stop stop-color="#8274FF"/>' +
+              '<stop offset="1" stop-color="#3890FF"/>' +
+            '</linearGradient>' +
+            '<linearGradient id="paint1_linear_141_3277" x1="7.5" y1="13.8759" x2="20.9999" y2="13.8759" gradientUnits="userSpaceOnUse">' +
+              '<stop stop-color="#8274FF"/>' +
+              '<stop offset="1" stop-color="#3890FF"/>' +
+            '</linearGradient>' +
+          '</defs>' +
+        '</svg>' +
+      '</div>' +
+      '<span class="openagent-hint-bar__text">输入你的需求，调配远端Agent为你解决</span>' +
+    '</div>' +
+    '<button class="openagent-hint-bar__close">' +
+      '<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none">' +
+        '<path d="M5.625 5.625L15.375 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>' +
+        '<path d="M15.375 5.625L5.625 15.375" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>' +
+      '</svg>' +
+    '</button>';
+
+  hintBar.querySelector('.openagent-hint-bar__close').addEventListener('click', () => {
+    hintBar.style.display = 'none';
+  });
+
+  // ── V2 版本兼容：≥ 2026.6.9 使用 absolute 定位，bottom 动态跟随输入区高度 ──
+  var isV2 = typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9');
+  if (isV2) {
+    hintBar.style.position = 'absolute';
+  }
+
+  // 插入到 wrapper 外面、上方
+  anchorEl.parentElement.insertBefore(hintBar, anchorEl);
+
+  function _findHintBarToolbar() {
+    if (toolbarEl) return toolbarEl;
+    var parentEl = anchorEl.parentElement;
+    if (parentEl) {
+      for (var i = 0; i < parentEl.children.length; i++) {
+        var child = parentEl.children[i];
+        if (child !== anchorEl && child.className && String(child.className).indexOf('agent-chat__toolbar') !== -1) {
+          return child;
+        }
+      }
+    }
+    return anchorEl.closest && anchorEl.closest('.agent-chat__input')
+      ? anchorEl.closest('.agent-chat__input').querySelector('.agent-chat__toolbar')
+      : null;
+  }
+
+  function _readElementHeight(el) {
+    if (!el) return 0;
+    var rect = el.getBoundingClientRect ? el.getBoundingClientRect() : null;
+    if (rect && rect.height > 0) return rect.height;
+    return typeof el.offsetHeight === 'number' ? el.offsetHeight : 0;
+  }
+
+  // 跟随 composer wrapper 的实际尺寸。侧栏拖拽/布局重排不一定触发 window resize。
+  function _syncHintBarLayout() {
+    var rect = anchorEl.getBoundingClientRect();
+    if (rect.width > 0) {
+      hintBar.style.width = rect.width + 'px';
+      var rootStyle = document.documentElement && document.documentElement.style;
+      if (rootStyle) {
+        rootStyle.setProperty('--openagent-input-wrapper-right-offset', Math.max(0, window.innerWidth - rect.right) + 'px');
+        rootStyle.setProperty('--openagent-input-wrapper-right-edge', Math.max(0, rect.right) + 'px');
+        rootStyle.setProperty('--openagent-input-wrapper-width', rect.width + 'px');
+      }
+      _syncSidebarRightEdge(rect);
+    }
+    if (isV2) {
+      var toolbar = _findHintBarToolbar();
+      var bottom = _readElementHeight(anchorEl) + _readElementHeight(toolbar) + 6;
+      hintBar.style.bottom = bottom + 'px';
+    }
+  }
+
+  function _syncSidebarRightEdge(inputRect) {
+    var sidebars = document.querySelectorAll('.chat-sidebar');
+    for (var i = 0; i < sidebars.length; i++) {
+      var sidebar = sidebars[i];
+      var sidebarRect = sidebar.getBoundingClientRect();
+      if (!sidebarRect || sidebarRect.width <= 0) continue;
+      var left = Math.max(0, sidebarRect.left);
+      var targetRight = Math.min(window.innerWidth, Math.max(0, inputRect.right));
+      var targetWidth = Math.floor(targetRight - left);
+      if (targetWidth <= 0) continue;
+      sidebar.style.setProperty('--openagent-sidebar-target-width', targetWidth + 'px');
+      sidebar.style.setProperty('width', targetWidth + 'px', 'important');
+      sidebar.style.setProperty('max-width', targetWidth + 'px', 'important');
+      sidebar.style.setProperty('flex-basis', targetWidth + 'px', 'important');
+      sidebar.style.setProperty('margin-right', '0px', 'important');
+    }
+  }
+
+  function _scheduleHintBarLayoutSync() {
+    window.requestAnimationFrame
+      ? window.requestAnimationFrame(_syncHintBarLayout)
+      : setTimeout(_syncHintBarLayout, 0);
+  }
+
+  _syncHintBarLayout();
+  _scheduleHintBarLayoutSync();
+  window.addEventListener('resize', _scheduleHintBarLayoutSync);
+  if (typeof ResizeObserver === 'function') {
+    var hintBarResizeObserver = new ResizeObserver(_scheduleHintBarLayoutSync);
+    hintBarResizeObserver.observe(anchorEl);
+    var toolbarForResize = _findHintBarToolbar();
+    if (toolbarForResize) hintBarResizeObserver.observe(toolbarForResize);
+  }
+  if (typeof MutationObserver === 'function' && document.body) {
+    var sidebarLayoutObserver = new MutationObserver(_scheduleHintBarLayoutSync);
+    sidebarLayoutObserver.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['class'] });
+  }
+}
+
 // ════════════════════════════════════════════════════════════════
 // ── window.__clMention — OC 注入钩子的桥接对象 ──
 // ════════════════════════════════════════════════════════════════
@@ -3618,10 +4431,12 @@ registerComponent('agent-card', async (data) => {
 function _clHandleTripDataSignal(payload, contextNode) {
   if (!payload) return;
   console.log('[trip-data] detected signal, payload:', payload.substring(0, 40));
+  const hostTextContextSelector = (typeof CL !== 'undefined' && CL.hostAdapter && CL.hostAdapter.selectors && CL.hostAdapter.selectors.textContext)
+    || '.chat-text';
 
   if (payload === 'file') {
     const chatText = contextNode && contextNode.closest
-      ? contextNode.closest('.chat-text, .chat-tool-card__detail, .chat-tools-collapse__body')
+      ? contextNode.closest(hostTextContextSelector)
       : null;
     if (chatText) {
       chatText.dataset.clProcessed = '';
@@ -3638,7 +4453,7 @@ function _clHandleTripDataSignal(payload, contextNode) {
       }
       console.log('[trip-data] ✅ Card data from base64');
       const chatText = contextNode && contextNode.closest
-        ? contextNode.closest('.chat-text, .chat-tool-card__detail, .chat-tools-collapse__body')
+        ? contextNode.closest(hostTextContextSelector)
         : null;
       if (chatText) {
         chatText.dataset.clProcessed = '';
@@ -3819,9 +4634,12 @@ if (document.readyState === 'loading') {
 // ── 1. CSS 注入 ──
 
 (function injectThoughtChainStyles() {
-  if (document.getElementById('cl-tools-collapse-css')) return;
+  var oldStyle = document.getElementById('cl-tools-collapse-css');
+  if (oldStyle) oldStyle.remove();
   const style = document.createElement('style');
   style.id = 'cl-tools-collapse-css';
+  style.setAttribute('data-openagent-style', 'thought-chain');
+  style.setAttribute('data-openagent-host-version', CL.hostVersion || 'unknown');
   style.textContent = `
     /* ── Agent Pill（通用身份标签） ── */
     .cl-agent-pill {
@@ -4025,7 +4843,12 @@ CL.handleDelegateWsEvent = function (msg) {
 // ════════════════════════════════════════════════════════════════
 
 // ── 1. CSS 注入 ──
+var _oldTripCSS = document.getElementById('openagent-trip-card-styles');
+if (_oldTripCSS) _oldTripCSS.remove();
 const _tripCSS = document.createElement('style');
+_tripCSS.id = 'openagent-trip-card-styles';
+_tripCSS.setAttribute('data-openagent-style', 'trip-card');
+_tripCSS.setAttribute('data-openagent-host-version', CL.hostVersion || 'unknown');
 _tripCSS.textContent = `
 /* ── 行程文字：普通文字灰色，特殊标注(粗体/链接/标题)黑色 ── */
 .trip-styled li, .trip-styled p { color: #888 !important; }
@@ -5449,20 +6272,32 @@ function _processCustomCards(bubble) {
 
 // CL.clScanCount lives on CL.clScanCount
 
+function _clIsInsideNativeToolHost(node) {
+  var adapter = CL && CL.hostAdapter;
+  var cur = node;
+  var hops = 0;
+  while (cur && cur !== document.body && hops < 12) {
+    if (adapter && adapter.isToolLikeShell && adapter.isToolLikeShell(cur)) return true;
+    cur = cur.parentElement;
+    hops++;
+  }
+  return !!(node && node.closest && node.closest('details'));
+}
+
 function _clScan() {
   CL.clScanCount++;
 
   // ── 0.5 清理标记 → 显示为 @agentName ──
-  // 新格式: {openagent_call_remote_agent:agent_id="...",agent_name="...",instruction="..."}
+  // 新格式: {openagent_call_remote_agent:agent_id="...",agent_name="...",agent_bio="...",instruction="..."}
   // 旧格式: {openagent:agent_id="...",agent_name="..."}
   // 两种都要匹配清理；这里只处理普通聊天气泡，不处理 ToolCard。
   var CL_MENTION_STYLE = '';
   document.querySelectorAll('.chat-bubble').forEach(function(el) {
     if (el.dataset.clMarkerCleaned) return;
-    if (el.closest('.chat-tool-card, .chat-tools-collapse, details')) return;
+    if (_clIsInsideNativeToolHost(el)) return;
 
     var text = el.textContent || '';
-    var rawRegex = /\{openagent(?:_call_remote_agent)?:agent_id="([^"]*)",agent_name="([^"]*)"(?:,instruction="[^"]*")?\}\s*/g;
+    var rawRegex = /\{openagent(?:_call_remote_agent)?:agent_id="([^"]*)",agent_name="([^"]*)"(?:,[^{}]*)?\}\s*/g;
     if (!rawRegex.test(text)) return;
 
     if (el.querySelector('.cl-remote-agent-card')) {
@@ -5470,7 +6305,7 @@ function _clScan() {
       return;  // 包含活 DOM，跳过 innerHTML 重写
     }
 
-    var htmlRegex = /\{openagent(?:_call_remote_agent)?:agent_id=(?:&quot;|")([^&"]*)(?:&quot;|"),agent_name=(?:&quot;|")([^&"]*)(?:&quot;|")(?:,instruction=(?:&quot;|")[^&"]*(?:&quot;|"))?\}\s*/g;
+    var htmlRegex = /\{openagent(?:_call_remote_agent)?:agent_id=(?:&quot;|")([^&"]*)(?:&quot;|"),agent_name=(?:&quot;|")([^&"]*)(?:&quot;|")(?:,[^{}]*)?\}\s*/g;
     if (CL && typeof CL.diagHtmlRewrite === 'function') {
       CL.diagHtmlRewrite('scanner.marker.before', el, { scan: CL.clScanCount });
     }
@@ -5505,7 +6340,7 @@ function _clScan() {
   if (mentionedAgents.length > 0) {
     document.querySelectorAll('.chat-bubble').forEach(function(el) {
       if (el.dataset.clAgentStyled) return;
-      if (el.closest('.chat-tool-card, .chat-tools-collapse, details')) return;
+      if (_clIsInsideNativeToolHost(el)) return;
 
       var text = el.textContent || '';
       var html = el.innerHTML;
@@ -5576,30 +6411,12 @@ function _clScan() {
 
 (function _clInitNativeStyleAdapter() {
   var _clNativeStyleSampled = false;
+  var hostAdapter = CL.hostAdapter || {};
+  var nativeStyle = hostAdapter.nativeStyle || {};
 
-  var SHELL_SELECTORS = [
-    '.chat-tool-card:not(:has(.cl-remote-agent-card))',
-    '.chat-tool-msg-collapse:not(:has(.cl-remote-agent-card))',
-    '.chat-tools-collapse:not(:has(.cl-remote-agent-card))',
-    // v5.x+ variants
-    '.tool-card:not(:has(.cl-remote-agent-card))',
-    '.chat-tool-card__wrapper:not(:has(.cl-remote-agent-card))'
-  ];
-
-  var SUMMARY_SELECTORS = [
-    '.chat-tool-card__header',
-    '.chat-tool-card__title',
-    '.chat-tool-msg-summary:not(.cl-remote-agent-host-shell *)',
-    '.chat-tools-summary:not(.cl-remote-agent-host-shell *)',
-    // v5.x+ variants
-    '.tool-card__header',
-    '.tool-card__title'
-  ];
-
-  var INDENT_SELECTORS = [
-    '.chat-group.tool:not(:has(.cl-remote-agent-card))',
-    '.chat-bubble:not(:has(.cl-remote-agent-card))'
-  ];
+  var SHELL_SELECTORS = nativeStyle.shellSelectors || [];
+  var SUMMARY_SELECTORS = nativeStyle.summarySelectors || [];
+  var INDENT_SELECTORS = nativeStyle.indentSelectors || [];
 
   // Fallback 默认值（和当前 styles.js 折叠态写死值保持一致，避免跳变）
   var FALLBACKS = {
@@ -5731,70 +6548,108 @@ function _clScan() {
 // 注意：不使用 .chat-tool-card 类名，避免 scanner.js 误匹配。
 
 (function _clInjectRemoteAgentStyles() {
-  if (document.getElementById('cl-remote-agent-styles')) return;
+  var oldStyle = document.getElementById('cl-remote-agent-styles');
+  if (oldStyle) oldStyle.remove();
   var style = document.createElement('style');
   style.id = 'cl-remote-agent-styles';
+  style.setAttribute('data-openagent-style', 'remote-agent');
+  style.setAttribute('data-openagent-host-version', CL.hostVersion || 'unknown');
+  style.setAttribute('data-openagent-host-adapter', (CL.hostAdapter && CL.hostAdapter.id) || 'oc-unknown');
+  var hostCss = (CL.hostAdapter && CL.hostAdapter.css) || {};
+  function _clSelectorList(selectors) {
+    if (!selectors) return '';
+    if (Array.isArray(selectors)) return selectors.filter(Boolean).join(',\n');
+    return String(selectors || '');
+  }
+  function _clRule(selectors, declarations) {
+    var selectorText = _clSelectorList(selectors);
+    if (!selectorText) return '';
+    return selectorText + ' {\n' + declarations.join('\n') + '\n}';
+  }
   style.textContent = [
-    // ── RenderHook 远端 Agent 卡片接管 native tool header ──
-    'details.chat-tools-collapse:has(.cl-remote-agent-card),',
-    'details.chat-tool-msg-collapse:has(.cl-remote-agent-card),',
-    '.chat-tools-collapse:has(.cl-remote-agent-card),',
-    '.chat-tool-msg-collapse:has(.cl-remote-agent-card) {',
-    '  width: 100% !important;',
-    '  max-width: none !important;',
-    '  box-sizing: border-box !important;',
-    '  border: 0 !important;',
-    '  background: transparent !important;',
-    '  box-shadow: none !important;',
-    '}',
-    '/* Align output host shells with execution shells. 3.28 renders output as',
-    '   chat-tools-collapse + .cl-output-card; some versions use chat-tool-msg-collapse.',
-    '   Move the host shell, not the inner OpenAgent card. */',
-    'details.chat-tools-collapse:has(.cl-output-card),',
-    '.chat-tools-collapse:has(.cl-output-card),',
-    'details.chat-tool-msg-collapse:has(.cl-remote-agent-card),',
-    '.chat-tool-msg-collapse:has(.cl-remote-agent-card) {',
-    '  margin-left: 12px !important;',
-    '}',
-    'details.chat-tools-collapse:has(.cl-remote-agent-card) > summary.chat-tools-summary,',
-    'details.chat-tool-msg-collapse:has(.cl-remote-agent-card) > summary.chat-tool-msg-summary,',
-    '.chat-tools-collapse:has(.cl-remote-agent-card) > .chat-tools-summary,',
-    '.chat-tool-msg-collapse:has(.cl-remote-agent-card) > .chat-tool-msg-summary {',
-    '  display: none !important;',
-    '}',
-    '.chat-tools-collapse__body.cl-remote-agent-host-shell > .chat-text,',
-    '.chat-tool-msg-body.cl-remote-agent-host-shell > .chat-text {',
+    // ── 隐藏宿主上下文用量提示 ──
+    '.context-notice.context-notice--usage,',
+    '.context-notice .context-notice--usage {',
     '  display: none !important;',
     '}',
+
+    // ── RenderHook 远端 Agent 卡片接管 native tool header ──
+    _clRule(hostCss.remoteShell, [
+      '  width: 100% !important;',
+      '  max-width: 100% !important;',
+      '  min-width: 0 !important;',
+      '  box-sizing: border-box !important;',
+      '  border: 0 !important;',
+      '  background: transparent !important;',
+      '  box-shadow: none !important;',
+    ]),
+    '/* Align output host shells with execution shells. Keep v4 msg-collapse',
+    '   separate from newer tools-collapse so modern spacing never leaks into',
+    '   the 2026.4 DOM. Move the host shell, not the inner OpenAgent card. */',
+    _clRule(hostCss.outputHostMargin, [
+      '  margin-left: 12px !important;',
+    ]),
+    _clRule(hostCss.outputHostMarginReset, [
+      '  margin-left: 0 !important;',
+    ]),
+    _clRule(hostCss.summaryHidden, [
+      '  display: none !important;',
+    ]),
+    _clRule(hostCss.hostShellRawText, [
+      '  display: none !important;',
+    ]),
     '.cl-remote-agent-raw-hidden > .chat-text,',
     '.cl-remote-agent-raw-hidden.chat-bubble > .chat-text {',
     '  display: none !important;',
     '}',
     '/* Phase A: 不依赖 host-shell class，用 :has() 直接隐藏宿主 raw text */',
-    '.chat-tools-collapse__body:has(.cl-remote-agent-card) > .chat-text,',
-    '.chat-tool-msg-body:has(.cl-remote-agent-card) > .chat-text,',
-    '.chat-tool-card__detail:has(.cl-remote-agent-card) > .chat-text,',
-    '.chat-tools-collapse__body:has(.cl-remote-agent-output-placeholder) > .chat-text,',
-    '.chat-tool-msg-body:has(.cl-remote-agent-output-placeholder) > .chat-text,',
-    '.chat-tool-card__detail:has(.cl-remote-agent-output-placeholder) > .chat-text {',
-    '  display: none !important;',
-    '}',
-    'details.chat-tools-collapse:has(.cl-remote-agent-card) > .chat-tools-collapse__body,',
-    'details.chat-tool-msg-collapse:has(.cl-remote-agent-card) > .chat-tool-msg-body,',
-    '.chat-tools-collapse:has(.cl-remote-agent-card) > .chat-tools-collapse__body,',
-    '.chat-tool-msg-collapse:has(.cl-remote-agent-card) > .chat-tool-msg-body {',
-    '  border: 0 !important;',
-    '  outline: 0 !important;',
-    '  background: transparent !important;',
-    '  box-shadow: none !important;',
-    '  padding: 0 !important;',
-    '  margin: 0 !important;',
-    '}',
+    _clRule(hostCss.rawTextCardHosts, [
+      '  display: none !important;',
+    ]),
+    _clRule(hostCss.rawTextPlaceholderHosts, [
+      '  display: none !important;',
+    ]),
+    _clRule(hostCss.hostBody, [
+      '  border: 0 !important;',
+      '  outline: 0 !important;',
+      '  background: transparent !important;',
+      '  box-shadow: none !important;',
+      '  padding: 0 !important;',
+      '  margin: 0 !important;',
+      '  width: 100% !important;',
+      '  max-width: 100% !important;',
+      '  min-width: 0 !important;',
+      '  box-sizing: border-box !important;',
+    ]),
     '.chat-bubble:has(.cl-remote-agent-card) {',
     '  border: 0 !important;',
     '  background: transparent !important;',
     '  box-shadow: none !important;',
-    '  padding-top: 0 !important;',
+    '  padding: 10px 0 !important;',
+    '  width: 100%;',
+    '  max-width: 100% !important;',
+    '  min-width: 0 !important;',
+    '  overflow: hidden !important;',
+    '  box-sizing: border-box !important;',
+    '}',
+    '.chat-split-container:has(.cl-output-card),',
+    '.chat-main:has(.cl-output-card),',
+    '.chat-sidebar:has(.cl-output-card),',
+    '.chat-side-result:has(.cl-output-card),',
+    '.chat-side-result__body:has(.cl-output-card) {',
+    '  min-width: 0 !important;',
+    '  max-width: 100% !important;',
+    '  box-sizing: border-box !important;',
+    '}',
+    _clRule(hostCss.manualOpenReset, [
+      '  margin-left: 0 !important;',
+    ]),
+    // ── 外层活动组容器 ──
+    '.chat-activity-group__body:has(.cl-remote-agent-card) {',
+    '  border-radius: 14px;',
+    '  border: 1px solid #E5E5EA;',
+    '  background: #F8F9FA;',
+    '  margin: 8px;',
     '  padding-bottom: 0 !important;',
     '}',
     '.chat-bubble:has(.cl-remote-agent-card) > .chat-text,',
@@ -5804,588 +6659,725 @@ function _clScan() {
     '.cl-remote-agent-host-shell {',
     '  width: min(100%, 912px) !important;',
     '  max-width: 100% !important;',
+    '  min-width: 0 !important;',
     '  box-sizing: border-box !important;',
     '}',
-    '.cl-remote-agent-host-shell.chat-tool-card,',
-    '.cl-remote-agent-host-shell.chat-tool-card__detail,',
-    '.cl-remote-agent-host-shell.chat-tools-collapse__body,',
-    '.cl-remote-agent-host-shell.chat-tool-msg-body,',
-    'details.cl-remote-agent-host-shell {',
-    '  border: 0 !important;',
-    '  outline: 0 !important;',
-    '  background: transparent !important;',
-    '  box-shadow: none !important;',
-    '}',
-    '.cl-remote-agent-host-shell > summary.chat-tools-summary,',
-    '.cl-remote-agent-host-shell > summary.chat-tool-msg-summary {',
-    '  display: none !important;',
-    '}',
+    _clRule(hostCss.hostShellReset, [
+      '  border: 0 !important;',
+      '  outline: 0 !important;',
+      '  background: transparent !important;',
+      '  box-shadow: none !important;',
+    ]),
+    _clRule(hostCss.hostShellSummary, [
+      '  display: none !important;',
+    ]),
     // ── 新卡片容器 ──
     // 覆盖 OpenClaw .chat-tool-card 的 max-height: 120px 限制
     '.cl-remote-agent-card {',
     '  max-height: none;',
     '  overflow: visible;',
-    '  width: fit-content;',
+    '  width: 100%;',
     '  max-width: 100%;',
-    '  border: 1px solid color-mix(in srgb, var(--border, rgba(47,47,51,0.10)) 85%, transparent);',
-    '  border-radius: var(--cl-native-shell-radius, 14px);',
-    '  padding: var(--cl-native-shell-padding, 8px);',
-    '  background: var(--card, #fff);',
+    '  border: 1px solid rgba(0,0,0,0.05);',
+    '  border-radius: 14px;',
+    '  background: #fff;',
     '  display: flex;',
     '  flex-direction: column;',
-    '  gap: var(--cl-native-shell-gap, 4px);',
     '  box-sizing: border-box;',
     '}',
+    _clRule(hostCss.modernCardLayout ? ['.cl-remote-agent-card'] : [], [
+      '  overflow: hidden;',
+      '  min-width: 0;',
+      '  gap: 0;',
+      '  padding: 15px;',
+    ]),
 
     // ── 顶部 OpenAgent 标题条 ──
     '.cl-openagent-header {',
-    '  width: fit-content;',
     '  max-width: 100%;',
-    '  min-height: var(--cl-native-summary-min-height, 34px);',
     '  display: flex;',
     '  align-items: center;',
-    '  gap: var(--cl-native-summary-gap, 6px);',
-    '  padding: var(--cl-native-summary-padding, 6px 10px);',
+    '  gap: 6px;',
+    '  height: 34px;',
+    '  padding: 6px 0;',
+    '  border-radius: 10px;',
     '  box-sizing: border-box;',
-    '  border: 1px solid color-mix(in srgb, var(--border, rgba(47,47,51,0.10)) 85%, transparent);',
-    '  border-radius: var(--cl-native-summary-radius, 10px);',
-    '  background: color-mix(in srgb, var(--bg-hover, #F4F5F7) 50%, transparent);',
-    '  color: var(--text, #2F2F33);',
+    '  border: none;',
+    '  background: transparent;',
     '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: var(--cl-native-summary-font-size, 13px);',
-    '  line-height: var(--cl-native-summary-line-height, 1.2);',
     '}',
-    '.cl-openagent-header-caret {',
-    '  width: 6px;',
-    '  color: var(--muted, rgba(47,47,51,0.45));',
-    '  font-size: 8px;',
-    '  line-height: 1;',
-    '  flex: 0 0 auto;',
+    '.cl-openagent-header:hover {',
     '}',
-    '.cl-openagent-header-icon {',
-    '  position: relative;',
+    _clRule(!hostCss.modernCardLayout ? ['.cl-openagent-header'] : [], [
+      '  height: auto;',
+      '  padding: 16px 25px;',
+    ]),
+    _clRule(hostCss.modernCardLayout ? ['.cl-openagent-header'] : [], [
+      '  gap: 0;',
+      '  height: auto;',
+      '  padding: 15px;',
+    ]),
+    '/* Output mode (Figma 373:12082) */',
+    '.cl-exec-v2 .cl-openagent-header--output {',
+    '  border-radius: 10px 10px 0 0 !important;',
+    '  border: 1px solid rgba(229, 229, 234, 0.75) !important;',
+    '  background: linear-gradient(90deg, rgba(220, 38, 38, 0.09) 0%, rgba(220, 38, 38, 0) 34%),',
+    '              linear-gradient(90deg, rgb(253, 253, 254) 0%, rgb(253, 253, 254) 100%) !important;',
+    '  box-shadow: 0px 8px 11px rgba(0, 0, 0, 0.12);',
+    '  padding: 8px 6px !important;',
+    '}',
+    '.cl-exec-v2 .cl-openagent-header--output .cl-openagent-agent {',
+    '  display: none;',
+    '}',
+    '.cl-exec-v2 .cl-openagent-header--output:hover {',
+    '  border-color: rgba(0,0,0,0.1);',
+    '}',
+    '.cl-openagent-expand-icon {',
+    '  display: flex;',
+    '  align-items: center;',
+    '  justify-content: center;',
     '  width: 15px;',
-    '  height: 14px;',
-    '  flex: 0 0 15px;',
+    '  height: 15px;',
+    '  flex-shrink: 0;',
+    '  transition: transform 0.2s ease;',
     '}',
-    '.cl-openagent-header-icon::before,',
-    '.cl-openagent-header-icon::after {',
-    '  content: "";',
-    '  position: absolute;',
-    '  width: 8px;',
-    '  height: 8px;',
-    '  border: 1.5px solid #10BDEB;',
-    '  border-radius: 2px;',
-    '  box-sizing: border-box;',
+    '.cl-openagent-expand-icon.cl-openagent-expanded {',
+    '  transform: rotate(180deg);',
     '}',
-    '.cl-openagent-header-icon::before { left: 2px; top: 5px; }',
-    '.cl-openagent-header-icon::after { left: 5px; top: 2px; }',
-    '.cl-openagent-header-title {',
+    '.cl-openagent-badge {',
+    '  width: 14px;',
+    '  height: 14px;',
+    '  border-radius: 14px;',
+    '  background: url(./icon.png) center / contain no-repeat;',
+    '  flex-shrink: 0;',
+    '  overflow: hidden;',
+    '}',
+    _clRule(hostCss.modernCardLayout ? ['.cl-openagent-badge'] : [], [
+      '  background: url(./icon.png) center/cover no-repeat;',
+      '  margin: 0 6px;',
+    ]),
+    '.cl-openagent-text-row {',
     '  display: flex;',
     '  align-items: center;',
-    '  gap: 3px;',
+    '  gap: 6px;',
     '  min-width: 0;',
+    '  line-height: 1.32;',
+    '}',
+    '.cl-openagent-label {',
+    '  font-size: 12px;',
+    '  font-weight: 500;',
+    '  color: #333;',
     '  white-space: nowrap;',
     '}',
-    '.cl-openagent-header-primary {',
-    '  color: var(--text, #2F2F33);',
-    '  font-weight: 600;',
-    '  overflow: hidden;',
-    '  text-overflow: ellipsis;',
+    '.cl-openagent-agent {',
+    '  font-size: 12px;',
+    '  font-weight: 500;',
+    '  color: #333;',
+    '  white-space: nowrap;',
     '}',
-    '.cl-openagent-header-secondary {',
-    '  color: var(--muted, rgba(47,47,51,0.40));',
+    '.cl-openagent-status {',
+    '  font-size: 11px;',
     '  font-weight: 400;',
+    '  color: #666;',
+    '  white-space: nowrap;',
     '}',
-    // ── Figma 内容框 ──
+    // ── Execution detail card (Figma 346:181) ──
     '.cl-thought-chain-content {',
-    '  width: 100%;',
-    '  min-height: 0;',
-    '  box-sizing: border-box;',
-    '  border: 1px solid color-mix(in srgb, var(--border, rgba(0,0,0,0.04)) 60%, transparent);',
-    '  border-radius: 8px;',
-    '  background: var(--card, #fff);',
-    '  padding: 8px;',
     '  display: flex;',
     '  flex-direction: column;',
-    '  align-items: flex-start;',
-    '  gap: 12px;',
-    '}',
-    // ── 共享展开态宿主清理 ──
-    'details.chat-tools-collapse:has(.cl-thought-chain-content--execution),',
-    'details.chat-tools-collapse:has(.cl-output-result),',
-    'details.chat-tool-msg-collapse:has(.cl-thought-chain-content--execution),',
-    'details.chat-tool-msg-collapse:has(.cl-output-result),',
-    '.chat-tools-collapse:has(.cl-thought-chain-content--execution),',
-    '.chat-tools-collapse:has(.cl-output-result),',
-    '.chat-tool-msg-collapse:has(.cl-thought-chain-content--execution),',
-    '.chat-tool-msg-collapse:has(.cl-output-result) {',
-    '  max-width: 100% !important;',
-    '  display: block !important;',
-    '  box-sizing: border-box !important;',
-    '}',
-    // ── 共享展开态 card 基础 ──
-    '.cl-remote-agent-card:has(.cl-thought-chain-content--execution),',
-    '.cl-remote-agent-card:has(.cl-output-result) {',
-    '  /* padding/radius/gap 继承 base card，不覆盖 */',
+    '  gap: 16px;',
+    '  min-width: 0;',
+    '  max-width: 100%;',
     '  box-sizing: border-box;',
     '}',
-    '.cl-remote-agent-card:has(.cl-thought-chain-content--execution:not(.cl-content-collapsed)) {',
-    '  width: 514px !important;',
+    _clRule(!hostCss.modernCardLayout ? ['.cl-thought-chain-content.cl-thought-chain-content--execution'] : [], [
+      '  padding: 0 15px 15px;',
+    ]),
+    _clRule(hostCss.modernCardLayout ? ['.cl-thought-chain-content'] : [], [
+      '  margin-left: 0;',
+      '  width: 100%;',
+      '  min-width: 0;',
+      '  box-sizing: border-box;',
+      '  overflow: hidden;',
+    ]),
+    '.cl-exec-detail-card {',
+    '  padding: 8px 16px 8px 12px;',
+    '  border-radius: 8px;',
+    '  background: #f8f8f8 url(./bg.png) no-repeat;',
+    '  background-size: 100% 100%;',
+    '  background-position: center;',
+    '  width: 460px;',
     '  max-width: 100%;',
+    '  box-sizing: border-box;',
     '}',
-    '.cl-remote-agent-card:has(.cl-thought-chain-content:not(.cl-content-collapsed)) .cl-openagent-header {',
-    '  width: 100%;',
+    '.cl-exec-detail-row {',
+    '  display: flex;',
+    '  align-items: center;',
+    '  gap: 16px;',
     '}',
-    // ── 展开内容宽度：外层 card 保持 fit-content，content 出现时自然撑开 ──
-    '.cl-thought-chain-content--execution {',
-    '  width: 100%;',
+    '.cl-exec-agent-avatar {',
+    '  width: 68px;',
+    '  height: 68px;',
+    '  object-fit: contain;',
+    '  flex-shrink: 0;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-thought-chain-content {',
-    '  width: min(900px, 100%);',
+    '.cl-exec-detail-info {',
+    '  display: flex;',
+    '  flex-direction: column;',
+    '  gap: 6px;',
+    '  flex: 1;',
+    '  min-width: 0;',
     '}',
-    // ── output 专用 content 样式 ──
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-thought-chain-content {',
-    '  border: 1.5px solid color-mix(in srgb, var(--border, rgba(0,0,0,0.06)) 60%, transparent);',
-    '  border-radius: 12px;',
-    '  padding: 12px;',
-    '  gap: 12px;',
+    '.cl-exec-name-row {',
+    '  display: flex;',
+    '  align-items: center;',
+    '  justify-content: space-between;',
+    '  gap: 8px;',
+    '  margin-bottom: 6px;',
     '}',
-    // ── Figma Agent pill（297:696）──
-    '.cl-agent-pill {',
-    '  display: inline-flex;',
+    '.cl-exec-agent-name {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 17px;',
+    '  font-weight: 500;',
+    '  color: #000;',
+    '  margin: 0;',
+    '  line-height: 1;',
+    '}',
+    '.cl-exec-star-badge {',
+    '  display: flex;',
     '  align-items: center;',
-    '  justify-content: center;',
-    '  gap: 9px;',
-    '  height: 42px;',
-    '  min-height: 42px;',
-    '  padding: 0 15px;',
-    '  border: 0;',
-    '  border-radius: 9px;',
-    '  background: #FBFBFB;',
-    '  box-shadow: inset 0 0 0 1.2px rgba(47,47,51,0.06);',
-    '  width: fit-content;',
-    '  box-sizing: border-box;',
+    '  gap: 2px;',
+    '  padding: 2px 10px 2px 8px;',
+    '  border-radius: 30px;',
+    '  background: #ebebeb;',
+    '  flex-shrink: 0;',
+    '}',
+    ,
+    ,
+    ,
+    '.cl-exec-star-count {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 11px;',
+    '  font-weight: 500;',
+    '  color: #555;',
+    '  white-space: nowrap;',
+    '}',
+    '.cl-exec-agent-bio {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 14px;',
+    '  font-weight: 400;',
+    '  color: #555;',
     '  margin: 0;',
+    '  line-height: 1;',
     '}',
-    '.cl-agent-pill-avatar {',
-    '  width: 24px;',
-    '  height: 24px;',
-    '  border-radius: 50%;',
-    '  object-fit: cover;',
-    '  flex: 0 0 24px;',
-    '  border: 0.6px solid rgba(47,47,51,0.20);',
-    '  box-sizing: border-box;',
+    _clRule(!hostCss.modernCardLayout ? ['.cl-exec-agent-bio'] : [], [
+      '  width: 250px;',
+      '  max-width: 100%;',
+      '  min-width: 0;',
+      '  box-sizing: border-box;',
+      '  overflow: hidden;',
+      '  text-overflow: ellipsis;',
+      '  display: -webkit-box;',
+      '  -webkit-line-clamp: 2;',
+      '  -webkit-box-orient: vertical;',
+    ]),
+
+    // ── Progress text (Figma 346:253) ──
+    '.cl-thought-chain-content.cl-content-collapsed {',
+    '  display: none;',
     '}',
-    '.cl-agent-pill-name {',
-    '  display: inline-flex;',
+    ,
+        '.cl-exec-progress-row {',
+    '  display: flex;',
     '  align-items: center;',
+    '  gap: 2px;',
+    '}',
+    '.cl-exec-progress-text {',
     '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: 15px;',
-    '  color: rgba(47,47,51,0.90);',
+    '  font-size: 14px;',
+    '  font-weight: 400;',
     '  line-height: 1.2;',
-    '  letter-spacing: 0;',
+    '  margin: 0;',
     '  white-space: nowrap;',
+    '  background-image: linear-gradient(90deg, #555 0%, #555 36%, #eee 55%, #555 77%, #555 100%);',
+    '  background-size: 200% 100%;',
+    '  -webkit-background-clip: text;',
+    '  background-clip: text;',
+    '  -webkit-text-fill-color: transparent;',
+    '  animation: cl-progress-shimmer 2.5s ease-in-out infinite;',
     '}',
-    '.cl-agent-pill-at { font-weight: 600; }',
-    '.cl-agent-pill-label { font-weight: 400; }',
-    '.cl-thought-chain-pill-slot {',
+    '.cl-exec-progress-arrow {',
     '  display: flex;',
     '  align-items: center;',
-    '  width: 100%;',
+    '  flex-shrink: 0;',
     '}',
-    '.cl-thought-chain-divider {',
-    '  display: none;',
+
+
+    // ── Progress shimmer keyframes ──
+    '@keyframes cl-progress-shimmer {',
+    '  0% { background-position: 200% 0; }',
+    '  100% { background-position: -200% 0; }',
     '}',
-    '.cl-thought-chain-content--execution {',
-    '  border: 1.5px solid rgba(0,0,0,0.04);',
+
+    // ── Output card（Figma 160:6681） ──
+    '.cl-output-card {',
+    '  background: #fff !important;',
+    '  border: 1.2px solid rgba(47,47,51,0.1) !important;',
+    '  border-radius: 24px !important;',
+    '  padding: 10px 15px !important;',
+    '  width: 100% !important;',
+    '  max-width: 100% !important;',
+    '  min-width: 0 !important;',
+    '  box-sizing: border-box !important;',
+    '  overflow: hidden;',
+    '}',
+    _clRule(hostCss.modernCardLayout ? ['.cl-output-card'] : [], [
+      '  gap: 10px !important;',
+    ]),
+    _clRule(!hostCss.modernCardLayout ? ['.cl-output-card'] : [], [
+      '  border-radius: 14px !important;',
+    ]),
+    _clRule(!hostCss.modernCardLayout ? ['.cl-remote-agent-card.cl-thought-chain.cl-output-card'] : [], [
+      '  padding: 0 !important;',
+    ]),
+    '.cl-output-card > .cl-thought-chain-content {',
+    '  background: #fff;',
+    '  border: 1px solid #f4f4f4;',
     '  border-radius: 12px;',
-    '  padding: 12px;',
-    '  gap: 18px;',
+    '  padding: 20px 30px;',
+    '  overflow: hidden;',
+    '  width: 100%;',
+    '  max-width: 100%;',
+    '  min-width: 0;',
+    '  box-sizing: border-box;',
     '}',
-    '.cl-thought-chain-content--execution .cl-agent-pill {',
-    '  gap: 9px;',
-    '  height: 42px;',
-    '  min-height: 42px;',
-    '  padding: 0 15px;',
-    '  border: 0;',
-    '  border-radius: 9px;',
-    '  box-shadow: inset 0 0 0 1.2px rgba(47,47,51,0.06);',
+    _clRule(!hostCss.modernCardLayout ? ['.cl-output-card > .cl-thought-chain-content'] : [], [
+      '  margin: 10px 15px;',
+      '  width: calc(100% - 30px);',
+    ]),
+    '.cl-output-card .cl-output-result {',
+    '  width: 100%;',
+    '  max-width: 100%;',
+    '  min-width: 0;',
+    '  box-sizing: border-box;',
+    '  overflow-wrap: anywhere;',
+    '  word-break: break-word;',
     '}',
-    '.cl-thought-chain-content--execution .cl-agent-pill-avatar {',
-    '  width: 24px;',
-    '  height: 24px;',
-    '  flex-basis: 24px;',
+    '.cl-output-card > .cl-thought-chain-content * {',
+    '  max-width: 100%;',
+    '  min-width: 0;',
+    '  box-sizing: border-box;',
     '}',
-    '.cl-thought-chain-content--execution .cl-agent-pill-name {',
-    '  font-size: 15px;',
-    '  line-height: 1.2;',
+    '.cl-output-card > .cl-thought-chain-content p,',
+    '.cl-output-card > .cl-thought-chain-content li,',
+    '.cl-output-card > .cl-thought-chain-content a {',
+    '  overflow-wrap: anywhere;',
+    '  word-break: break-word;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-agent-pill {',
-    '  gap: 9px;',
-    '  height: 42px;',
-    '  min-height: 42px;',
-    '  padding: 0 15px;',
+    '.cl-output-card > .cl-thought-chain-content hr {',
     '  border: 0;',
-    '  border-radius: 9px;',
-    '  box-shadow: inset 0 0 0 1.2px rgba(47,47,51,0.06);',
+    '  border-top: 1px solid #bdbdbd;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-agent-pill-avatar {',
-    '  width: 24px;',
-    '  height: 24px;',
-    '  flex-basis: 24px;',
+    '.cl-output-card > .cl-thought-chain-content pre,',
+    '.cl-output-card > .cl-thought-chain-content code {',
+    '  overflow-x: auto;',
+    '  white-space: pre-wrap;',
+    '  word-break: break-all;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-agent-pill-name {',
-    '  font-size: 15px;',
-    '  line-height: 1.2;',
+    // V2 output card：统一 border/padding 与 execution card 一致
+    '.cl-exec-v2.cl-output-card {',
+    '  border: 1px solid rgba(0,0,0,0.05) !important;',
+    '  border-radius: 14px !important;',
+    '  padding: 0 !important;',
+    '}',
+    // V2 output card：去掉 content 区多余的内边距，detail card 自带动间距
+    '.cl-exec-v2.cl-output-card > .cl-thought-chain-content {',
+    '  background: transparent;',
+    '  border: none;',
+    '  border-radius: 0;',
+    '  padding: 0 14px !important;',
     '}',
 
-    // ── Figma 思考步骤（297:716）──
-    '.cl-thought-chain-steps-section {',
-    '  width: 100%;',
-    '  display: flex;',
-    '  flex-direction: column;',
-    '  align-items: flex-start;',
-    '  gap: 4px;',
-    '  padding: 4px 0;',
-    '  box-sizing: border-box;',
+    // ── Collapsed state（Figma 145:3466） ──
+    '.cl-remote-agent-card:has(.cl-content-collapsed) {',
+    '  padding: 0 !important;',
     '}',
-    '.cl-tools-collapse-header {',
+    // ── Output card Footer（Figma 131:2091） ──
+    '.cl-output-footer {',
     '  display: flex;',
     '  align-items: center;',
-    '  gap: 0;',
-    '  padding: 0;',
-    '  cursor: default;',
-    '  user-select: none;',
-    '}',
-    '.cl-tools-collapse-header:hover { opacity: 1; }',
-    '.cl-tools-collapse-header-icon { display: none; }',
-    '.cl-tools-collapse-header-title {',
+    '  gap: 4px;',
     '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: 10px;',
-    '  font-weight: 600;',
-    '  line-height: 1.2;',
-    '  color: rgba(47,47,51,0.90);',
+    '  font-size: 14px;',
+    '  color: #999;',
     '}',
-    '.cl-tools-collapse-body {',
-    '  position: relative;',
+    _clRule(!hostCss.modernCardLayout ? ['.cl-output-footer'] : [], [
+      '  padding: 10px 15px;',
+      '  line-height: 22px;',
+    ]),
+    '.cl-output-footer-text {',
+    '  white-space: nowrap;',
+    '}',
+    '.cl-output-footer-star {',
     '  display: flex;',
-    '  flex-direction: column;',
-    '  gap: 4px;',
-    '  width: 100%;',
-    '  overflow: hidden;',
-    '  padding: 0;',
-    '  transition: max-height 0.25s ease, opacity 0.2s ease;',
+    '  align-items: center;',
+    '  flex-shrink: 0;',
     '}',
-    '.cl-tools-collapse-body::before {',
-    '  content: "";',
-    '  position: absolute;',
-    '  left: 7px;',
-    '  top: 14px;',
-    '  bottom: 14px;',
-    '  width: 1px;',
-    '  background: rgba(47,47,51,0.10);',
+    '.cl-output-footer-count {',
+    '  font-weight: 500;',
+    '  white-space: nowrap;',
     '}',
-    '.cl-tools-collapse-body.cl-expanded { max-height: 2000px; opacity: 1; }',
-    '.cl-tools-collapse-body.cl-collapsed { max-height: 0; opacity: 0; }',
-    '.cl-tools-collapse-step {',
-    '  position: relative;',
-    '  display: block;',
-    '  width: 100%;',
-    '  padding: 0;',
-    '  z-index: 1;',
+
+/* ── Sidebar 面板（Figma 145:5712） ── */
+    '.chat-sidebar {',
+    '  background: #fff !important;',
+    '  border: 1px solid rgba(0,0,0,0.05) !important;',
+    '  border-radius: 14px !important;',
+    '  padding: 16px 20px !important;',
+    '  box-sizing: border-box !important;',
+    '  min-width: 0 !important;',
+    '  max-width: 100% !important;',
+    '  overflow-x: hidden !important;',
+    '  display: flex !important;',
+    '  flex-direction: column !important;',
+    '  gap: 16px !important;',
     '}',
-    '.cl-tools-collapse-step-row {',
-    '  display: flex;',
-    '  align-items: center;',
-    '  gap: 8px;',
-    '  min-height: 14px;',
+    '.chat-sidebar > .sidebar-panel {',
+    '  display: flex !important;',
+    '  flex-direction: column !important;',
+    '  gap: 16px !important;',
+    '  width: 100% !important;',
+    '  min-width: 0 !important;',
+    '  max-width: 100% !important;',
+    '  overflow-x: hidden !important;',
+    '  box-sizing: border-box !important;',
+    '  background: transparent !important;',
     '}',
-    '.cl-tools-collapse-step-icon {',
-    '  width: 14px;',
-    '  height: 14px;',
-    '  flex: 0 0 14px;',
-    '  display: flex;',
-    '  align-items: center;',
-    '  justify-content: center;',
-    '  background: #fff;',
+    '.chat-sidebar .sidebar-header {',
+    '  display: flex !important;',
+    '  align-items: center !important;',
+    '  justify-content: space-between !important;',
+    '  padding: 6px 0 !important;',
+    '  border-radius: 10px !important;',
+    '  width: 100% !important;',
+    '  border: none !important;',
+    '  background: transparent !important;',
     '}',
-    '.cl-tools-collapse-step-dot {',
-    '  width: 5px;',
-    '  height: 5px;',
-    '  border-radius: 50%;',
-    '  background: #D9D9D9;',
-    '  animation: none;',
+    '.chat-sidebar .sidebar-title {',
+    '  font-family: "PingFang SC", sans-serif !important;',
+    '  font-weight: 500 !important;',
+    '  font-size: 18px !important;',
+    '  color: #333 !important;',
+    '  line-height: 1.32 !important;',
     '}',
-    '.cl-tools-collapse-step-dot::before,',
-    '.cl-tools-collapse-step-dot::after,',
-    '.cl-tools-collapse-step-dot span {',
-    '  content: none;',
-    '  display: none;',
+    '.chat-sidebar .sidebar-header button {',
+    '  width: 16px !important;',
+    '  height: 16px !important;',
+    '  padding: 0 !important;',
+    '  border: none !important;',
+    '  background: transparent !important;',
+    '  cursor: pointer !important;',
+    '  flex-shrink: 0 !important;',
     '}',
-    '.cl-tools-collapse-step-check {',
-    '  position: relative;',
-    '  width: 14px;',
-    '  height: 14px;',
-    '  border-radius: 50%;',
-    '  background: #D9D9D9;',
+    '.chat-sidebar .sidebar-content {',
+    '  font-family: "PingFang SC", sans-serif !important;',
+    '  font-size: 14px !important;',
+    '  font-weight: 400 !important;',
+    '  line-height: 1.8 !important;',
+    '  color: #333 !important;',
+    '  width: 100% !important;',
+    '  min-width: 0 !important;',
+    '  max-width: 100% !important;',
+    '  padding: 0 !important;',
+    '  overflow-x: hidden !important;',
+    '  box-sizing: border-box !important;',
+    '  overflow-wrap: anywhere !important;',
     '}',
-    '.cl-tools-collapse-step-check::after {',
-    '  content: "";',
-    '  position: absolute;',
-    '  left: 4px;',
-    '  top: 3px;',
-    '  width: 4px;',
-    '  height: 7px;',
-    '  border: solid #fff;',
-    '  border-width: 0 1.3px 1.3px 0;',
-    '  transform: rotate(45deg);',
+    '.chat-sidebar .sidebar-markdown {',
+    '  font-family: "PingFang SC", sans-serif !important;',
+    '  font-size: 14px !important;',
+    '  font-weight: 400 !important;',
+    '  line-height: 1.8 !important;',
+    '  color: #333 !important;',
+    '  background: transparent !important;',
+    '  border: none !important;',
+    '  padding: 0 !important;',
+    '  min-width: 0 !important;',
+    '  max-width: 100% !important;',
+    '  overflow-x: hidden !important;',
+    '  box-sizing: border-box !important;',
+    '  overflow-wrap: anywhere !important;',
     '}',
-    '.cl-tools-collapse-step-title {',
-    '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: 9.5px;',
-    '  font-weight: 400;',
-    '  line-height: 1.32;',
-    '  color: rgba(47,47,51,0.40);',
-    '  white-space: nowrap;',
-    '  overflow: hidden;',
-    '  text-overflow: ellipsis;',
+    '.chat-sidebar .sidebar-markdown * {',
+    '  max-width: 100% !important;',
+    '  min-width: 0 !important;',
+    '  box-sizing: border-box !important;',
     '}',
-    '.cl-tools-collapse-step-detail {',
-    '  margin: 2px 0 0 22px;',
-    '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: 9px;',
-    '  line-height: 1.32;',
-    '  color: rgba(47,47,51,0.40);',
+    '.chat-sidebar .sidebar-markdown pre,',
+    '.chat-sidebar .sidebar-markdown code {',
+    '  white-space: pre-wrap !important;',
+    '  word-break: break-word !important;',
     '}',
-    '.cl-thought-chain-content--execution .cl-thought-chain-steps-section {',
-    '  gap: 6px;',
-    '  padding: 6px 0;',
+    // 隐藏宿主 sidebar 自带的 "Rendered Markdown / View Raw Text" 工具栏
+    '.chat-sidebar .sidebar-markdown-shell__toolbar {',
+    '  display: none !important;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-header-title {',
-    '  font-size: 15px;',
-    '  line-height: 1.2;',
+    // ═══════════════════════════════════════════════════════════════
+    // V2 执行卡片样式（2026.6.9+ 新版 UI）
+    // 所有 V2 样式在 .cl-exec-v2 下隔离，不影响旧版
+    // ═══════════════════════════════════════════════════════════════
+
+    // ── V2 容器 ──
+    '.cl-exec-v2 {',
+    '  position: relative;',
+    '  gap: 10px;',
+    '  padding: 0;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-body {',
+
+    // ── V2 Header（Figma 371:6987 — 红晕渐变背景 + 独立边框）──
+    '.cl-exec-v2 .cl-openagent-header-v2 {',
+    '  background: linear-gradient(90deg, rgba(220, 38, 38, 0.09) 0%, rgba(220, 38, 38, 0) 34%),',
+    '              linear-gradient(90deg, rgb(253, 253, 254) 0%, rgb(253, 253, 254) 100%) !important;',
+    '  border-bottom: 1px solid rgba(229, 229, 234, 0.75) !important;',
+    '  padding: 8px 6px !important;',
+    '  margin: 0 !important;',
+    '  border-radius: 10px 10px 0 0;',
+    '  height: auto !important;',
+    '  min-height: auto !important;',
     '  gap: 6px;',
+    '  box-sizing: border-box;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-body::before {',
-    '  left: 10px;',
-    '  top: 21px;',
-    '  bottom: 21px;',
-    '  width: 1px;',
-    '  background: #DBDBDB;',
-    '  transform: scaleX(0.3);',
-    '  transform-origin: left center;',
+    '.cl-exec-v2 .cl-openagent-header-v2:hover {',
+    '  background: linear-gradient(90deg, rgba(220, 38, 38, 0.12) 0%, rgba(220, 38, 38, 0) 34%),',
+    '              linear-gradient(90deg, rgb(250, 250, 251) 0%, rgb(250, 250, 251) 100%) !important;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-row {',
-    '  gap: 12px;',
-    '  min-height: 21px;',
+
+    // ── V2 圆形灰色头像（替代小徽章）──
+    '.cl-exec-v2 .cl-openagent-avatar-v2 {',
+    '  display: inline-block;',
+    '  width: 24px;',
+    '  height: 24px;',
+    '  border-radius: 50%;',
+    '  background: #d0d0d0;',
+    '  flex-shrink: 0;',
+    '  margin-right: 4px;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-icon {',
-    '  width: 21px;',
-    '  height: 21px;',
-    '  flex-basis: 21px;',
+
+    // ── V2 隐藏旧版 OASN 小徽章和 @agentName ──
+    '.cl-exec-v2 .cl-openagent-badge,',
+    '.cl-exec-v2 .cl-openagent-agent {',
+    '  display: none !important;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-dot {',
-    '  width: 6px;',
-    '  height: 6px;',
-    '  background: #DCDCDC;',
+    // ── V2 隐藏步骤标题栏（▼ + "思考中..."），保留进度文字行 ──
+    '.cl-exec-v2 .cl-tools-collapse-header-v2 {',
+    '  display: none !important;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-check {',
-    '  width: 15px;',
-    '  height: 15px;',
-    '  background: #DCDCDC;',
+
+    // ── V2 Detail Card（大头像 + 右置星级 + 网格点背景）──
+    '.cl-exec-v2 .cl-exec-detail-card-v2 {',
+    '  max-width: 488px !important;',
+    '  width: 100% !important;',
+    '  padding: 8px 16px 8px 12px !important;',
+    '  padding-right: 90px !important;',
+    '  border-radius: 12px !important;',
+    '  background: #f7f7f8 !important;',
+    '  margin: 12px 14px 14px 14px !important;',
+    '  margin-top: 0 !important;',
+    '  margin-left: 0 !important;',
+    '  position: relative;',
+    '  overflow: hidden;',
+    '  box-sizing: border-box;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-check::after {',
-    '  left: 4px;',
-    '  top: 2px;',
-    '  width: 5px;',
-    '  height: 8px;',
-    '  border-width: 0 1.4px 1.4px 0;',
+    /* 四角网格点装饰 */
+    '.cl-exec-v2 .cl-exec-detail-card-v2::before,',
+    '.cl-exec-v2 .cl-exec-detail-card-v2::after {',
+    '  content: "";',
+    '  position: absolute;',
+    '  width: 40px;',
+    '  height: 40px;',
+    '  background-image: radial-gradient(circle, #ddd 1px, transparent 1px);',
+    '  background-size: 8px 8px;',
+    '  opacity: 0.5;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-title {',
-    '  font-size: 14px;',
-    '  line-height: 1.32;',
+    '.cl-exec-v2 .cl-exec-detail-card-v2::before {',
+    '  top: 8px;',
+    '  left: 8px;',
     '}',
-    '.cl-thought-chain-content--execution .cl-tools-collapse-step-detail {',
-    '  display: none;',
+    '.cl-exec-v2 .cl-exec-detail-card-v2::after {',
+    '  bottom: 8px;',
+    '  right: 8px;',
     '}',
 
-    // ── output 等待渲染完成前，隐藏整张 result card 和宿主 shell ──
-    'details.chat-tools-collapse:has(.cl-output-card--pending),',
-    'details.chat-tool-msg-collapse:has(.cl-output-card--pending),',
-    '.chat-tools-collapse:has(.cl-output-card--pending),',
-    '.chat-tool-msg-collapse:has(.cl-output-card--pending) {',
-    '  display: none !important;',
+    '.cl-exec-v2 .cl-exec-detail-row-v2 {',
+    '  display: flex;',
+    '  gap: 16px;',
     '}',
-    '.cl-output-card--pending {',
-    '  display: none !important;',
+
+    '.cl-exec-v2 .cl-exec-detail-info-v2 {',
+    '  display: flex;',
+    '  flex-direction: column;',
+    '  gap: 6px;',
+    '  flex: 1;',
+    '  min-width: 0;',
     '}',
 
-    // ── 结果展示区 ──
-    '.cl-output-result {',
-    '  margin-top: 4px;',
-    '  font-family: "PingFang SC", sans-serif;',
-    '  font-size: 13px;',
-    '  line-height: 1.6;',
-    '  color: #2F2F33;',
-    '  word-break: break-word;',
+    // ── V2 大头像 68×68 ──
+    '.cl-exec-v2 .cl-exec-agent-avatar-v2 {',
+    '  width: 68px !important;',
+    '  height: 68px !important;',
+    '  border-radius: 50% !important;',
+    '  object-fit: cover;',
+    '  flex-shrink: 0;',
     '}',
-    '.cl-output-result--pending {',
-    '  display: none !important;',
+
+    // ── V2 名称 ~20px/600/黑色 ──
+    '.cl-exec-v2 .cl-exec-agent-name-v2 {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 20px !important;',
+    '  font-weight: 600 !important;',
+    '  color: #000 !important;',
+    '  margin: 0;',
+    '  line-height: 1.3;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result {',
-    '  width: 100%;',
-    '  max-height: 600px;',
-    '  overflow-y: auto;',
-    '  overflow-x: hidden;',
-    '  box-sizing: border-box;',
-    '  margin-top: 0;',
-    '  padding: 6px 30px 24px 18px;',
-    '  border: 0;',
-    '  border-radius: 0;',
-    '  background: transparent;',
-    '  font-size: 14.25px;',
-    '  line-height: 1.42;',
-    '  color: rgba(47,47,51,0.50);',
-    '  scrollbar-width: thin;',
-    '  scrollbar-color: #ECECEC transparent;',
+
+    // ── V2 描述 ~14px/400/灰色 ──
+    '.cl-exec-v2 .cl-exec-agent-bio-v2 {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 14px !important;',
+    '  font-weight: 400;',
+    '  color: #888 !important;',
+    '  margin: 0;',
+    '  line-height: 1.4;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result::-webkit-scrollbar {',
-    '  width: 4.5px;',
+
+    // ── V2 星级右置到卡片右上角 ──
+    '.cl-exec-v2 .cl-exec-star-badge-v2 {',
+    '  position: absolute;',
+    '  right: 24px;',
+    '  top: 20px;',
+    '  display: flex;',
+    '  align-items: center;',
+    '  gap: 4px;',
+    '  padding: 4px 12px;',
+    '  border-radius: 30px;',
+    '  background: #ebebeb;',
+    '  z-index: 1;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result::-webkit-scrollbar-track {',
-    '  background: transparent;',
+    '.cl-exec-v2 .cl-exec-star-count-v2 {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 13px;',
+    '  font-weight: 500;',
+    '  color: #555;',
+    '  white-space: nowrap;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result::-webkit-scrollbar-thumb {',
-    '  background: #ECECEC;',
-    '  border-radius: 150px;',
+
+    // ── V2 Progress Row（Figma 373:9765 — shimmer 渐变文字 + 箭头）──
+    '.cl-exec-v2 .cl-exec-progress-row-v2 {',
+    '  display: flex;',
+    '  align-items: center;',
+    '  gap: 2px;',
+    '  margin-top: 16px;',
+    '  padding: 0 4px;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result h1,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result h2 {',
-    '  margin: 18px 0 9px;',
-    '  font-size: 20px;',
-    '  font-weight: 600;',
+    '.cl-exec-v2 .cl-exec-progress-row-v2 .cl-exec-progress-text {',
+    '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 14px;',
+    '  font-weight: 400;',
     '  line-height: 1.2;',
-    '  color: rgba(47,47,51,0.90);',
+    '  margin: 0;',
+    '  white-space: nowrap;',
+    '  background-image: linear-gradient(90deg, #555 0%, #555 36%, #eee 55%, #555 77%, #555 100%);',
+    '  background-size: 200% 100%;',
+    '  -webkit-background-clip: text;',
+    '  background-clip: text;',
+    '  -webkit-text-fill-color: transparent;',
+    '  animation: cl-progress-shimmer 2.5s ease-in-out infinite;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result h1:first-child,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result h2:first-child {',
-    '  margin-top: 6px;',
+    '.cl-exec-v2 .cl-exec-progress-row-v2 .cl-exec-progress-arrow {',
+    '  display: flex;',
+    '  align-items: center;',
+    '  flex-shrink: 0;',
+    '  opacity: 1;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result h3 {',
-    '  margin: 18px 0 9px;',
-    '  font-size: 15px;',
-    '  font-weight: 600;',
-    '  line-height: 1.2;',
-    '  color: rgba(47,47,51,0.90);',
+
+    // ── V2 隐藏旧版 name-row（星级原来在名称旁边）──
+    '.cl-exec-v2 .cl-exec-name-row,',
+    '.cl-exec-v2 .cl-exec-star-badge:not(.cl-exec-star-badge-v2) {',
+    '  display: none !important;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result p,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result li {',
-    '  font-size: 14.25px;',
-    '  line-height: 1.42;',
-    '  color: rgba(47,47,51,0.50);',
+
+    // ─ V2 步骤列表样式（覆盖 thought-chain-card.js 默认值）──
+    '.cl-exec-v2 .cl-tools-collapse-body-v2 {',
+    '  padding: 4px 0 8px;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result strong,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result b,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result a {',
-    '  color: rgba(47,47,51,0.90) !important;',
-    '  font-weight: 600;',
+    '.cl-exec-v2 .cl-tools-collapse-step {',
+    '  padding: 5px 0;',
+    '  gap: 10px;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result ul,',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result ol {',
-    '  padding-left: 20px;',
-    '  margin: 6px 0;',
+    '.cl-exec-v2 .cl-tools-collapse-step-title {',
+    '  font-size: 13px;',
+    '  color: #555;',
     '}',
-    '.cl-remote-agent-card:has(.cl-output-result) .cl-output-result hr {',
-    '  border: 0;',
-    '  border-top: 1px solid rgba(47,47,51,0.12);',
-    '  margin: 15px 0;',
+    '.cl-exec-v2 .cl-tools-collapse-step-check {',
+    '  width: 12px;',
+    '  height: 12px;',
+    '  background: #ccc;',
     '}',
-    '.cl-output-result p { margin: 4px 0; }',
-    '.cl-output-result ul, .cl-output-result ol { padding-left: 20px; margin: 4px 0; }',
-    '.cl-output-result code {',
-    '  background: rgba(0,0,0,0.05);',
-    '  padding: 1px 4px;',
-    '  border-radius: 3px;',
-    '  font-size: 12px;',
+    '.cl-exec-v2 .cl-tools-collapse-step-dot {',
+    '  width: 14px;',
+    '  height: 14px;',
+    '}',
+    '.cl-exec-v2 .cl-tools-collapse-step-dot::before,',
+    '.cl-exec-v2 .cl-tools-collapse-step-dot::after,',
+    '.cl-exec-v2 .cl-tools-collapse-step-dot span {',
+    '  width: 3px;',
+    '  height: 3px;',
+    '  background: #bbb;',
     '}',
 
-    // ── 附件下载区 ──
-    '.cl-openagent-media-links {',
+    // ── V2 Footer（-由xxx完成 + 星级）──
+    '.cl-exec-v2 .cl-output-footer-v2 {',
     '  display: flex;',
-    '  flex-wrap: wrap;',
-    '  gap: 8px;',
-    '  width: 100%;',
-    '  box-sizing: border-box;',
-    '  padding: 6px 18px 12px;',
-    '}',
-    '.cl-openagent-media-link {',
-    '  display: inline-grid;',
-    '  grid-template-columns: auto auto;',
-    '  grid-template-areas: "icon action" "icon file";',
     '  align-items: center;',
-    '  column-gap: 8px;',
-    '  row-gap: 1px;',
-    '  max-width: min(100%, 360px);',
-    '  box-sizing: border-box;',
-    '  padding: 8px 10px;',
-    '  border: 1px solid rgba(47,47,51,0.12);',
-    '  border-radius: 8px;',
-    '  background: rgba(47,47,51,0.03);',
-    '  color: rgba(47,47,51,0.90) !important;',
-    '  text-decoration: none !important;',
+    '  gap: 4px;',
     '  font-family: "PingFang SC", sans-serif;',
+    '  font-size: 13px;',
+    '  color: #999;',
+    '  padding: 12px;',
+    '  margin-top: 8px;',
     '}',
-    '.cl-openagent-media-link:hover {',
-    '  background: rgba(16,189,235,0.08);',
-    '  border-color: rgba(16,189,235,0.35);',
+    '.cl-exec-v2 .cl-output-footer-v2 .cl-output-footer-text {',
+    '  white-space: nowrap;',
     '}',
-    '.cl-openagent-media-link-icon {',
-    '  grid-area: icon;',
-    '  width: 28px;',
-    '  height: 28px;',
-    '  border-radius: 6px;',
-    '  background: rgba(16,189,235,0.12);',
-    '  color: #088BAE;',
-    '  display: inline-flex;',
+    '.cl-exec-v2 .cl-output-footer-v2 .cl-output-footer-star {',
+    '  display: flex;',
     '  align-items: center;',
-    '  justify-content: center;',
-    '  font-size: 11px;',
-    '  font-weight: 700;',
-    '}',
-    '.cl-openagent-media-link-text {',
-    '  grid-area: action;',
-    '  min-width: 0;',
-    '  font-size: 13px;',
-    '  font-weight: 600;',
-    '  line-height: 1.2;',
+    '  flex-shrink: 0;',
+    '  margin-left: 2px;',
     '}',
-    '.cl-openagent-media-link-file {',
-    '  grid-area: file;',
-    '  min-width: 0;',
-    '  overflow: hidden;',
-    '  text-overflow: ellipsis;',
+    '.cl-exec-v2 .cl-output-footer-v2 .cl-output-footer-count {',
+    '  font-weight: 500;',
     '  white-space: nowrap;',
-    '  font-size: 11px;',
-    '  line-height: 1.2;',
-    '  color: rgba(47,47,51,0.50);',
     '}',
 
-    // ── 错误状态 ──
-    '.cl-remote-agent-card--error {',
-    '  border-color: rgba(220, 38, 38, 0.3);',
-    '  background: rgba(254, 242, 242, 0.5);',
+    // ── chat-text 下 p 标签样式 ──
+    '.cl-remote-agent-card .chat-text p {',
+    '  color: #2F2F33 !important;',
+    '  text-align: justify;',
+    '  font-family: "PingFang SC" !important;',
+    '  font-size: 14px !important;',
+    '  font-style: normal !important;',
+    '  font-weight: 400 !important;',
+    '  line-height: 132% !important;',
     '}',
 
-    // ── Header 折叠/展开 ──
-    '.cl-openagent-header:hover {',
-    '  background: color-mix(in srgb, var(--bg-hover, #ECEDF0) 75%, transparent);',
-    '  transition: background 0.15s ease;',
-    '}',
-    '.cl-content-collapsed {',
-    '  display: none !important;',
+    // ── chat-text 下 code 标签样式（去背景、去边框、加粗）──
+    '.chat-text code,',
+    '.cl-remote-agent-card .chat-text code,',
+    '.cl-remote-agent-card .chat-text p code {',
+    '  background: transparent !important;',
+    '  border: none !important;',
+    '  font-weight: 700 !important;',
     '}',
   ].join('\n');
   document.head.appendChild(style);
@@ -6393,6 +7385,7 @@ function _clScan() {
   // 只处理当前 cardNode 的祖先链路，不 querySelectorAll 全局
   window._clMarkRemoteAgentHostShell = function _clMarkRemoteAgentHostShell(cardNode) {
     try {
+      var hostAdapter = CL.hostAdapter || {};
       var node = cardNode && cardNode.parentElement;
       var hops = 0;
       while (node && node !== document.body && hops < 10) {
@@ -6405,17 +7398,8 @@ function _clScan() {
 
         var shouldMark = false;
         var tag = (node.tagName || '').toLowerCase();
-        if (tag === 'details') {
-          shouldMark = node.matches && node.matches(
-            'details.chat-tools-collapse, details.chat-tool-msg-collapse'
-          );
-        } else if (node.matches) {
-          shouldMark = node.matches(
-            '.chat-tool-card,' +
-            '.chat-tool-card__detail,' +
-            '.chat-tools-collapse__body,' +
-            '.chat-tool-msg-body'
-          );
+        if (typeof hostAdapter.isMarkableHost === 'function') {
+          shouldMark = hostAdapter.isMarkableHost(node);
         }
 
         if (shouldMark && node.classList) {
@@ -7008,6 +7992,73 @@ function _clInferToolCardKind(card) {
   return 'call';
 }
 
+function _clPickAgentDescription(source) {
+  if (!source) return '';
+  var keys = [
+    'agent_bio',
+    'agentBio',
+    'bio',
+    'description',
+    'desc',
+    'agent_description',
+    'agentDescription',
+    'MOM',
+    'mom',
+    'introduction',
+    'summary'
+  ];
+  for (var i = 0; i < keys.length; i++) {
+    var value = source[keys[i]];
+    if (typeof value === 'string' && value.trim()) return value.trim();
+  }
+  return '';
+}
+
+function _clIsFailureStatusValue(value) {
+  var normalized = String(value || '').trim().toLowerCase();
+  return normalized === 'failed'
+    || normalized === 'failure'
+    || normalized === 'error'
+    || normalized === 'errored'
+    || normalized === 'rejected'
+    || normalized === 'cancelled'
+    || normalized === 'canceled';
+}
+
+function _clLooksLikeRemoteFailureText(text) {
+  var value = String(text || '').trim();
+  if (!value || value.length > 300) return false;
+  return /(^|[，。；\s])(调用失败|执行失败|任务失败|远端服务目前连不上|远端服务.*不可用|两次都返回了调用失败)([，。；\s]|$)/.test(value);
+}
+
+function _clInferToolCardError(card, chunks, rawText) {
+  if (chunks && chunks.some(function(c) { return c && c.type === 'error'; })) return true;
+  if (!card) return _clLooksLikeRemoteFailureText(rawText);
+  if (card.isError === true || card.error === true) return true;
+  if (_clIsFailureStatusValue(card.status)
+      || _clIsFailureStatusValue(card.state)
+      || _clIsFailureStatusValue(card.resultStatus)) {
+    return true;
+  }
+  if (card.error && typeof card.error === 'object') return true;
+  return _clLooksLikeRemoteFailureText(rawText);
+}
+
+function _clApplyAgentIdentityToModel(model) {
+  if (!model || typeof CL === 'undefined' || !CL || typeof CL.getAgentIdentity !== 'function') return model;
+  var identity = CL.getAgentIdentity(model.agentId, model.agentName);
+  if (!identity) return model;
+  model.agentId = model.agentId || identity.id || identity.agent_id;
+  if (!model.agentName || model.agentName === 'Remote Agent') {
+    model.agentName = identity.name || model.agentName;
+  }
+  model.agentAvatar = model.agentAvatar || identity.avatar || identity.avatar_url || identity.avatarUrl || null;
+  if (!model.agentBio) {
+    model.agentBio = _clPickAgentDescription(identity);
+  }
+  return model;
+}
+
 function _clParseToolCardModel(card) {
   var inferredKind = _clInferToolCardKind(card);
 
@@ -7016,6 +8067,8 @@ function _clParseToolCardModel(card) {
   var agentId = args.agent_id || args.agentId || null;
   var agentName = args.agent_name || args.agentName || agentId || 'Remote Agent';
   var agentAvatar = args.agent_avatar || args.agentAvatar || args.avatar || args.avatar_url || args.avatarUrl || null;
+  var agentBio = _clPickAgentDescription(args);
+  var agentStars = args.agent_stars || args.agentStars || args.stars || args.claws || '3.2万';
   var taskText = args.task || args.message || args.instruction || '';
 
   // 从 text 解析思考步骤 / 最终文本
@@ -7025,22 +8078,27 @@ function _clParseToolCardModel(card) {
     rawText: rawText
   });
   var hasOutput = inferredKind === 'result' && rawText.trim().length > 0;
-  var isError = chunks.some(function(c) { return c.type === 'error'; });
+  var isError = _clInferToolCardError(card, chunks, rawText);
 
   var model = {
     agentId: agentId,
     agentName: agentName,
     agentAvatar: agentAvatar,
+    agentBio: agentBio,
+    agentStars: agentStars,
     taskText: taskText,
     toolCallId: card.toolCallId || '',
-    status: hasOutput ? 'completed' : 'executing',
+    status: isError ? 'failed' : (hasOutput ? 'completed' : 'executing'),
     rawText: rawText,
+    text: rawText,
+    outputText: rawText,
     chunks: chunks,
     isError: isError,
     inferredKind: inferredKind,
   };
+  _clApplyAgentIdentityToModel(model);
 
-  console.log('[cl-model] parsed:', 'agent=' + agentName,
+  console.log('[cl-model] parsed:', 'agent=' + model.agentName,
     'status=' + model.status,
     'chunks=' + chunks.length,
     'error=' + isError);
@@ -7065,6 +8123,11 @@ function _clParseToolCardModel(card) {
 // UI 结构使用 shared thought-chain styles，数据来源是 RenderHook model。
 
 function _clRenderExecutionCard(model) {
+  // ── V2 版本判断：≥ 2026.6.9 启用新版 UI ──
+  if (typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9')) {
+    return _clRenderExecutionCardV2(model);
+  }
+
   var container = document.createElement('div');
   container.className = 'cl-remote-agent-card cl-thought-chain';
   if (CL && typeof CL.diagMarkCard === 'function') {
@@ -7074,111 +8137,46 @@ function _clRenderExecutionCard(model) {
   container.appendChild(_clCreateOpenAgentHeader(model));
 
   var content = document.createElement('div');
-  content.className = 'cl-thought-chain-content cl-thought-chain-content--execution';
+  content.className = 'cl-thought-chain-content cl-thought-chain-content--execution cl-content-collapsed';
   container.appendChild(content);
 
-  // ── Agent Pill ──
-  console.log('[cl-exec] 🏷️ agentName=' + JSON.stringify(model.agentName) + ' agentId=' + JSON.stringify(model.agentId));
-  var pillSlot = document.createElement('div');
-  pillSlot.className = 'cl-thought-chain-pill-slot';
-  var pill = _clCreateAgentPill(model.agentName, model.agentId, model.agentAvatar);
-  pillSlot.appendChild(pill);
-  content.appendChild(pillSlot);
-
-  // ── 分隔线 ──
-  var divider = document.createElement('div');
-  divider.className = 'cl-thought-chain-divider';
-  content.appendChild(divider);
-
-  // ── 思考步骤区 ──
-  var stepsSection = document.createElement('div');
-  stepsSection.className = 'cl-thought-chain-steps-section';
-
-  // 标题栏
-  var header = document.createElement('div');
-  header.className = 'cl-tools-collapse-header';
-
-  var headerIcon = document.createElement('span');
-  headerIcon.className = 'cl-tools-collapse-header-icon';
-  headerIcon.textContent = '▼';
-
-  var headerTitle = document.createElement('span');
-  headerTitle.className = 'cl-tools-collapse-header-title';
-
-  // 从 chunks 提取步骤
-  var steps = [];
-  for (var i = 0; i < model.chunks.length; i++) {
-    var chunk = model.chunks[i];
-    if (chunk.type === 'step') {
-      steps.push({ title: chunk.title, detail: chunk.detail || '' });
-    }
-  }
-
-  // 合并预缓冲步骤（WS 先于 Lit 渲染到达时）
-  if (model._bufferedSteps && model._bufferedSteps.length > 0) {
-    steps = model._bufferedSteps;
-  }
-  if (typeof _cl_compactThoughtSteps === 'function') {
-    steps = _cl_compactThoughtSteps(steps);
-  }
-
-  headerTitle.textContent = '思考中...';
-
-  header.appendChild(headerIcon);
-  header.appendChild(headerTitle);
-
-  // 步骤列表（可折叠）
-  var body = document.createElement('div');
-  body.className = 'cl-tools-collapse-body cl-expanded';
-
-  for (var si = 0; si < steps.length; si++) {
-    var isLatest = (si === steps.length - 1);
-    var stepEl = _clCreateStepElement(steps[si], isLatest);
-    body.appendChild(stepEl);
-  }
-
-  // 折叠/展开
-  header.style.cursor = 'pointer';
-  header.addEventListener('click', function(evt) {
-    evt.stopPropagation();  // 防止外层容器拦截
-    var isExpanded = body.classList.contains('cl-expanded');
-    console.log('[cl-exec] 🖱️ header click: expanded=' + isExpanded + ' bodyChildren=' + body.childElementCount);
-    if (isExpanded) {
-      body.classList.remove('cl-expanded');
-      body.classList.add('cl-collapsed');
-      headerIcon.classList.add('cl-collapsed');
-      if (typeof _cl_setCardUiState === 'function') {
-        _cl_setCardUiState(model, { stepsExpanded: false });
-      }
-    } else {
-      body.classList.remove('cl-collapsed');
-      body.classList.add('cl-expanded');
-      headerIcon.classList.remove('cl-collapsed');
-      if (typeof _cl_setCardUiState === 'function') {
-        _cl_setCardUiState(model, { stepsExpanded: true });
-      }
-    }
-  });
-
-  stepsSection.appendChild(header);
-  stepsSection.appendChild(body);
-  content.appendChild(stepsSection);
+  // ── Agent 详情卡片（Figma 346:181） ──
+  try {
+    var detailCard = _clCreateAgentDetailCard(model);
+    content.appendChild(detailCard);
+  } catch(e) {
+    console.warn('[cl-exec] detail card creation failed:', e);
+  }
+
+  // ── 进度文字（Figma 346:253） — 动态读取 response.progress?.safe_status_message ──
+  var progressRow = document.createElement('div');
+  progressRow.className = 'cl-exec-progress-row';
+  var progressText = document.createElement('p');
+  progressText.className = 'cl-exec-progress-text';
+  progressText.textContent = (model.progressMessage || model.rawText || '').trim() || '思考中，正在了解你的需求';
+  progressRow.appendChild(progressText);
+  // 箭头图标
+  var arrowIcon = document.createElement('span');
+  arrowIcon.className = 'cl-exec-progress-arrow';
+  arrowIcon.innerHTML = '<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M5 4L9 7L5 10" stroke="#555" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>';
+  progressRow.appendChild(arrowIcon);
+  content.appendChild(progressRow);
+  if (model.status === 'completed') progressRow.style.display = 'none';
 
   // ── 异步更新真实 Agent 身份 ──
   if ((model.agentId || model.agentName) && typeof fetchAgentById === 'function') {
     fetchAgentById(model.agentId, model.agentName).then(function(agent) {
       if (!agent) return;
-      var pa = container.querySelector('.cl-agent-pill-avatar');
-      var pn = container.querySelector('.cl-agent-pill-name');
-      if (pa && typeof avatarUrl === 'function') {
-        var resolvedAvatar = avatarUrl(agent);
-        console.log('[cl-diag][pill] fetch-update agentId=' + JSON.stringify(model.agentId)
-          + ' name=' + JSON.stringify(agent.name || model.agentName)
-          + ' src=' + JSON.stringify(resolvedAvatar));
-        pa.src = resolvedAvatar;
-        pa.style.display = '';
-      }
-      _clSetAgentPillName(container, agent.name || model.agentName);
+      var avatarEl = container.querySelector('.cl-exec-agent-avatar');
+      var nameEl = container.querySelector('.cl-exec-agent-name');
+      var bioEl = container.querySelector('.cl-exec-agent-bio');
+      var agentBio = _clGetAgentDescriptionText(agent);
+      // avatar 保持 icon.png，不覆盖
+      if (nameEl) nameEl.textContent = agent.name || model.agentName;
+      if (bioEl && agentBio) bioEl.textContent = agentBio;
+      var starsEl = container.querySelector('.cl-exec-star-count');
+      if (starsEl && agent.claws) starsEl.textContent = _cl_formatStarCount(agent.claws);
+      if (starsEl && agent.stars && !agent.claws) starsEl.textContent = _cl_formatStarCount(agent.stars);
       _clSetOpenAgentHeaderAgent(container, agent.name || model.agentName);
     }).catch(function() {});
   }
@@ -7187,40 +8185,137 @@ function _clRenderExecutionCard(model) {
     _cl_applyCardUiState(container, model);
   }
 
-  console.log('[cl-exec] ✅ execution card built: steps=' + steps.length);
+  console.log('[cl-exec] execution card built');
   return container;
 }
 
-// ── 共用 DOM 构建函数 ──
+function _clGetAgentDescriptionText(model) {
+  if (typeof _clPickAgentDescription === 'function') {
+    var direct = _clPickAgentDescription(model || {});
+    if (direct) return direct;
+    if (model && typeof CL !== 'undefined' && CL && typeof CL.getAgentIdentity === 'function') {
+      var identity = CL.getAgentIdentity(
+        model.agentId || model.agent_id || model.id || model.tag,
+        model.agentName || model.agent_name || model.name
+      );
+      var identityBio = _clPickAgentDescription(identity || {});
+      if (identityBio) return identityBio;
+    }
+    return '';
+  }
+  if (!model) return '';
+  return model.agentBio || model.bio || model.description || model.desc || model.agentDescription || model.agent_description || model.MOM || '';
+}
 
-function _clCreateOpenAgentHeader(model) {
-  var header = document.createElement('div');
-  header.className = 'cl-openagent-header';
-  header.style.cursor = 'pointer';
+function _clSyncOutputFooterVisibility(card, isCollapsed) {
+  if (!card || !card.querySelector || !card.querySelector('.cl-openagent-header--output')) return;
+  var footers = card.querySelectorAll('.cl-output-footer');
+  for (var i = 0; i < footers.length; i++) {
+    footers[i].style.display = isCollapsed ? 'none' : '';
+  }
+}
+
+function _clGetAgentStatusText(status) {
+  if (status === 'completed') return '执行已完成';
+  if (status === 'failed' || status === 'error') return '执行失败';
+  return '正在执行任务';
+}
 
-  var caret = document.createElement('span');
-  caret.className = 'cl-openagent-header-caret';
-  caret.textContent = '▼';
-  header.appendChild(caret);
+function _clIsAgentTerminalStatus(status) {
+  return status === 'completed' || status === 'failed' || status === 'error';
+}
+
+// ── Agent 详情卡片（Figma 266:11136） ──
+function _clCreateAgentDetailCard(model) {
+  var card = document.createElement('div');
+  card.className = 'cl-exec-detail-card';
+
+  var row = document.createElement('div');
+  row.className = 'cl-exec-detail-row';
 
-  var icon = document.createElement('span');
-  icon.className = 'cl-openagent-header-icon';
-  icon.setAttribute('aria-hidden', 'true');
-  header.appendChild(icon);
+  // 头像 68×68
+  var avatar = document.createElement('img');
+  avatar.className = 'cl-exec-agent-avatar';
+  avatar.alt = model.agentName || '';
+  avatar.src = './icon.png';
+  avatar.onerror = function() { this.style.visibility = 'hidden'; };
+  row.appendChild(avatar);
+
+  // 信息列
+  var info = document.createElement('div');
+  info.className = 'cl-exec-detail-info';
+
+  // 名称行：名称 + 星级徽章
+  var nameRow = document.createElement('div');
+  nameRow.className = 'cl-exec-name-row';
+
+  var nameEl = document.createElement('p');
+  nameEl.className = 'cl-exec-agent-name';
+  nameEl.textContent = model.agentName || 'Remote Agent';
+  nameRow.appendChild(nameEl);
+
+  // 星级徽章
+  var starBadge = document.createElement('div');
+  starBadge.className = 'cl-exec-star-badge';
+  var starSvgOutline = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M6.46401 1.8327C6.66621 1.36177 7.33396 1.36174 7.53612 1.8327L8.82412 4.83481L12.0718 5.1373C12.5808 5.18469 12.7873 5.8177 12.4039 6.15586L9.95148 8.31772L10.6687 11.5101C10.7809 12.0098 10.2404 12.4012 9.80052 12.139L7.00006 10.4699L4.19904 12.139C3.75913 12.4012 3.21924 12.0098 3.33145 11.5101L4.04808 8.31772L1.59626 6.15586C1.21282 5.81777 1.4189 5.18488 1.9278 5.1373L5.17601 4.83481L6.46401 1.8327ZM5.89435 5.8226L3.10073 6.08237L5.20905 7.94118L4.59325 10.6818L7.00006 9.24798L9.40575 10.6818L8.79108 7.94118L10.8983 6.08237L8.10521 5.8226L6.9995 3.24603L5.89435 5.8226Z" fill="#555555"/></svg>';
+  starBadge.innerHTML = starSvgOutline +
+    '<span class="cl-exec-star-count">' + (model.agentStars || '3.2万') + '</span>';
+  nameRow.appendChild(starBadge);
+  info.appendChild(nameRow);
+
+  var bioEl = document.createElement('p');
+  bioEl.className = 'cl-exec-agent-bio';
+  bioEl.textContent = _clGetAgentDescriptionText(model);
+  info.appendChild(bioEl);
+
+  row.appendChild(info);
+  card.appendChild(row);
 
-  var title = document.createElement('div');
-  title.className = 'cl-openagent-header-title';
+  return card;
+}
 
-  var primary = document.createElement('span');
-  primary.className = 'cl-openagent-header-primary';
-  primary.textContent = 'OpenAgent @' + (model.agentName || 'Remote Agent');
-  title.appendChild(primary);
+// ── 共用 DOM 构建函数 ──
 
-  var secondary = document.createElement('span');
-  secondary.className = 'cl-openagent-header-secondary';
-  title.appendChild(secondary);
+function _clCreateOpenAgentHeader(model) {
+  var header = document.createElement('div');
+  header.className = 'cl-openagent-header';
+  if (model._outputMode) header.classList.add('cl-openagent-header--output');
+  header.style.cursor = 'pointer';
 
-  header.appendChild(title);
+  // 展开/收起图标
+  var expandIcon = document.createElement('span');
+  expandIcon.className = 'cl-openagent-expand-icon';
+  // 收起态三角（向右）
+  expandIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M9.75 6.79978C10.0833 6.99223 10.0833 7.47336 9.75 7.66581L6.75 9.39786C6.41667 9.59031 6 9.34975 6 8.96485L6 5.50075C6 5.11585 6.41667 4.87528 6.75 5.06773L9.75 6.79978Z" fill="#666666"/></svg>';
+  // 展开态三角（向下）
+  var expandedSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M8.43313 8.98291C8.24068 9.31624 7.75955 9.31624 7.5671 8.98291L5.83505 5.98291C5.6426 5.64958 5.88316 5.23291 6.26806 5.23291L9.73216 5.23291C10.1171 5.23291 10.3576 5.64958 10.1652 5.98291L8.43313 8.98291Z" fill="#666666"/></svg>';
+  header.appendChild(expandIcon);
+
+  // OASN 小图标
+  var oasnBadge = document.createElement('span');
+  oasnBadge.className = 'cl-openagent-badge';
+  header.appendChild(oasnBadge);
+
+  // 文字行
+  var textRow = document.createElement('span');
+  textRow.className = 'cl-openagent-text-row';
+
+  var labelOpenAgent = document.createElement('span');
+  labelOpenAgent.className = 'cl-openagent-label';
+  labelOpenAgent.textContent = 'OpenAgent';
+  textRow.appendChild(labelOpenAgent);
+
+  var labelAgent = document.createElement('span');
+  labelAgent.className = 'cl-openagent-agent';
+  labelAgent.textContent = '@' + (model.agentName || 'Remote Agent');
+  textRow.appendChild(labelAgent);
+
+  var labelStatus = document.createElement('span');
+  labelStatus.className = 'cl-openagent-status';
+  labelStatus.textContent = _clGetAgentStatusText(model.status);
+  textRow.appendChild(labelStatus);
+
+  header.appendChild(textRow);
 
   // 点击 header 折叠/展开卡片内容
   header.addEventListener('click', function(e) {
@@ -7230,7 +8325,11 @@ function _clCreateOpenAgentHeader(model) {
     var content = card.querySelector('.cl-thought-chain-content');
     if (!content) return;
     var isCollapsed = content.classList.toggle('cl-content-collapsed');
-    caret.textContent = isCollapsed ? '▶' : '▼';
+    _clSyncOutputFooterVisibility(card, isCollapsed);
+    // 切换图标
+    expandIcon.innerHTML = isCollapsed
+      ? '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M9.75 6.79978C10.0833 6.99223 10.0833 7.47336 9.75 7.66581L6.75 9.39786C6.41667 9.59031 6 9.34975 6 8.96485L6 5.50075C6 5.11585 6.41667 4.87528 6.75 5.06773L9.75 6.79978Z" fill="#666666"/></svg>'
+      : '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M8.43313 8.98291C8.24068 9.31624 7.75955 9.31624 7.5671 8.98291L5.83505 5.98291C5.6426 5.64958 5.88316 5.23291 6.26806 5.23291L9.73216 5.23291C10.1171 5.23291 10.3576 5.64958 10.1652 5.98291L8.43313 8.98291Z" fill="#666666"/></svg>';
     if (typeof _cl_setCardUiState === 'function') {
       _cl_setCardUiState(model, { contentCollapsed: isCollapsed });
     }
@@ -7240,8 +8339,8 @@ function _clCreateOpenAgentHeader(model) {
 }
 
 function _clSetOpenAgentHeaderAgent(container, agentName) {
-  var title = container && container.querySelector('.cl-openagent-header-primary');
-  if (title) title.textContent = 'OpenAgent @' + (agentName || 'Remote Agent');
+  var label = container && container.querySelector('.cl-openagent-agent');
+  if (label) label.textContent = '@' + (agentName || 'Remote Agent');
 }
 
 function _clCreateAgentPill(agentName, agentId, agentAvatar) {
@@ -7263,7 +8362,7 @@ function _clCreateAgentPill(agentName, agentId, agentAvatar) {
   console.log('[cl-diag][pill] create agentName=' + JSON.stringify(agentName || '')
     + ' agentId=' + JSON.stringify(agentId || '')
     + ' src=' + JSON.stringify(avatar.getAttribute('src')));
-  avatar.onerror = function() { this.style.display = 'none'; };
+  avatar.onerror = function() { this.style.visibility = 'hidden'; };
   pill.appendChild(avatar);
 
   var nameEl = document.createElement('span');
@@ -7322,6 +8421,226 @@ function _clCreateStepElement(step, isLatest) {
   return item;
 }
 
+
+// ── 动态更新 header 状态文字 ──
+function _clUpdateAgentStatusText(cardNode, status) {
+  var label = cardNode && cardNode.querySelector('.cl-openagent-status');
+  if (label) label.textContent = _clGetAgentStatusText(status);
+  var progressRow = cardNode && cardNode.querySelector('.cl-exec-progress-row');
+  if (progressRow) progressRow.style.display = _clIsAgentTerminalStatus(status) ? 'none' : '';
+}
+
+function _cl_formatStarCount(count) {
+  var n = Number(count);
+  if (!isFinite(n)) return '3.2万';
+  if (n >= 10000) return (n / 10000).toFixed(1).replace(/.0$/, '') + '万';
+  if (n >= 1000) return (n / 1000).toFixed(1).replace(/.0$/, '') + 'k';
+  return String(Math.floor(n));
+}
+
+// ═══════════════════════════════════════════════════════════════
+// V2 执行卡片渲染（2026.6.9+ 新版 UI）
+// ═══════════════════════════════════════════════════════════════
+
+function _clRenderExecutionCardV2(model) {
+  var container = document.createElement('div');
+  container.className = 'cl-remote-agent-card cl-thought-chain cl-exec-v2';
+  if (CL && typeof CL.diagMarkCard === 'function') {
+    CL.diagMarkCard(container, 'execution', { tcid: model.toolCallId || '' });
+  }
+
+  container.appendChild(_clCreateOpenAgentHeaderV2(model));
+
+  var content = document.createElement('div');
+  content.className = 'cl-thought-chain-content cl-thought-chain-content--execution cl-content-collapsed';
+  container.appendChild(content);
+
+  // ── Agent 详情卡片 V2 ──
+  try {
+    var detailCard = _clCreateAgentDetailCardV2(model);
+    content.appendChild(detailCard);
+  } catch(e) {
+    console.warn('[cl-exec-v2] detail card creation failed:', e);
+  }
+
+  // ── 进度文字 V2 ──
+  var progressRow = document.createElement('div');
+  progressRow.className = 'cl-exec-progress-row cl-exec-progress-row-v2';
+  var progressText = document.createElement('p');
+  progressText.className = 'cl-exec-progress-text';
+  progressText.textContent = (model.progressMessage || model.rawText || '').trim() || '思考中，正在了解你的需求';
+  progressRow.appendChild(progressText);
+  var arrowIcon = document.createElement('span');
+  arrowIcon.className = 'cl-exec-progress-arrow';
+  arrowIcon.innerHTML = '<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M5 4L9 7L5 10" stroke="#555" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>';
+  progressRow.appendChild(arrowIcon);
+  content.appendChild(progressRow);
+  if (model.status === 'completed') progressRow.style.display = 'none';
+
+  // ── 步骤列表容器（供 _cl_updateCardSteps 使用）──
+  var stepsHeader = document.createElement('div');
+  stepsHeader.className = 'cl-tools-collapse-header cl-tools-collapse-header-v2';
+  var stepsHeaderIcon = document.createElement('span');
+  stepsHeaderIcon.className = 'cl-tools-collapse-header-icon';
+  stepsHeaderIcon.textContent = '▼';
+  stepsHeader.appendChild(stepsHeaderIcon);
+  var stepsHeaderTitle = document.createElement('span');
+  stepsHeaderTitle.className = 'cl-tools-collapse-header-title cl-tools-collapse-header-title-v2';
+  stepsHeaderTitle.textContent = '思考中...';
+  stepsHeader.appendChild(stepsHeaderTitle);
+  content.appendChild(stepsHeader);
+
+  var stepsBody = document.createElement('div');
+  stepsBody.className = 'cl-tools-collapse-body cl-tools-collapse-body-v2 cl-expanded';
+  content.appendChild(stepsBody);
+
+  // ─ Footer（Figma: -由xxx完成 + 星级）──
+  var footer = document.createElement('div');
+  footer.className = 'cl-output-footer cl-output-footer-v2';
+  footer.innerHTML = '<span class="cl-output-footer-text">-由' + (model.agentName || 'Remote Agent') + '完成</span>'
+    + '<span class="cl-output-footer-star"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1.16L8.356 5.33H12.78L9.195 7.94L10.565 12.1L7 9.51L3.435 12.1L4.805 7.94L1.22 5.33H5.644L7 1.16Z" stroke="#999" stroke-width="0.8"/></svg></span>'
+    + '<span class="cl-output-footer-count">' + (model.agentStars || '3.2万') + '</span>';
+  container.appendChild(footer);
+
+  // ── 异步更新真实 Agent 身份 ──
+  if ((model.agentId || model.agentName) && typeof fetchAgentById === 'function') {
+    fetchAgentById(model.agentId, model.agentName).then(function(agent) {
+      if (!agent) return;
+      var avatarEl = container.querySelector('.cl-exec-agent-avatar-v2');
+      var nameEl = container.querySelector('.cl-exec-agent-name-v2');
+      var bioEl = container.querySelector('.cl-exec-agent-bio-v2');
+      var agentBio = _clGetAgentDescriptionText(agent);
+      if (nameEl) nameEl.textContent = agent.name || model.agentName;
+      if (bioEl && agentBio) bioEl.textContent = agentBio;
+      var starsEl = container.querySelector('.cl-exec-star-count-v2');
+      if (starsEl && agent.claws) starsEl.textContent = _cl_formatStarCount(agent.claws);
+      if (starsEl && agent.stars && !agent.claws) starsEl.textContent = _cl_formatStarCount(agent.stars);
+    }).catch(function() {});
+  }
+
+  if (typeof _cl_applyCardUiState === 'function') {
+    _cl_applyCardUiState(container, model);
+  }
+
+  console.log('[cl-exec-v2] execution card built');
+  return container;
+}
+
+// ── V2 Header（粉色背景 + 圆形头像 + 无 @agentName）──
+function _clCreateOpenAgentHeaderV2(model) {
+  var header = document.createElement('div');
+  header.className = 'cl-openagent-header cl-openagent-header-v2';
+  if (model._outputMode) header.classList.add('cl-openagent-header--output');
+  header.style.cursor = 'pointer';
+
+  // 展开/收起图标
+  var expandIcon = document.createElement('span');
+  expandIcon.className = 'cl-openagent-expand-icon';
+  expandIcon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M9.75 6.79978C10.0833 6.99223 10.0833 7.47336 9.75 7.66581L6.75 9.39786C6.41667 9.59031 6 9.34975 6 8.96485L6 5.50075C6 5.11585 6.41667 4.87528 6.75 5.06773L9.75 6.79978Z" fill="#666666"/></svg>';
+  var expandedSvg = '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M8.43313 8.98291C8.24068 9.31624 7.75955 9.31624 7.5671 8.98291L5.83505 5.98291C5.6426 5.64958 5.88316 5.23291 6.26806 5.23291L9.73216 5.23291C10.1171 5.23291 10.3576 5.64958 10.1652 5.98291L8.43313 8.98291Z" fill="#666666"/></svg>';
+  header.appendChild(expandIcon);
+
+  // 圆形灰色头像（替代小徽章）
+  var avatar = document.createElement('span');
+  avatar.className = 'cl-openagent-avatar-v2';
+  header.appendChild(avatar);
+
+  // 文字行：OpenAgent + 状态文字（去掉 @agentName）
+  var textRow = document.createElement('span');
+  textRow.className = 'cl-openagent-text-row';
+
+  var labelOpenAgent = document.createElement('span');
+  labelOpenAgent.className = 'cl-openagent-label';
+  labelOpenAgent.textContent = 'OpenAgent';
+  textRow.appendChild(labelOpenAgent);
+
+  var labelStatus = document.createElement('span');
+  labelStatus.className = 'cl-openagent-status';
+  labelStatus.textContent = _clGetAgentStatusText(model.status);
+  textRow.appendChild(labelStatus);
+
+  header.appendChild(textRow);
+
+  // 点击 header 折叠/展开卡片内容
+  header.addEventListener('click', function(e) {
+    e.stopPropagation();
+    var card = header.closest('.cl-remote-agent-card');
+    if (!card) return;
+    var content = card.querySelector('.cl-thought-chain-content');
+    if (!content) return;
+    var isCollapsed = content.classList.toggle('cl-content-collapsed');
+    _clSyncOutputFooterVisibility(card, isCollapsed);
+    expandIcon.innerHTML = isCollapsed
+      ? '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M9.75 6.79978C10.0833 6.99223 10.0833 7.47336 9.75 7.66581L6.75 9.39786C6.41667 9.59031 6 9.34975 6 8.96485L6 5.50075C6 5.11585 6.41667 4.87528 6.75 5.06773L9.75 6.79978Z" fill="#666666"/></svg>'
+      : expandedSvg;
+    if (typeof _cl_setCardUiState === 'function') {
+      _cl_setCardUiState(model, { contentCollapsed: isCollapsed });
+    }
+  });
+
+  return header;
+}
+
+// ─ V2 Agent 详情卡片（大头像 + 右置星级 + 网格点背景）──
+function _clCreateAgentDetailCardV2(model) {
+  var card = document.createElement('div');
+  card.className = 'cl-exec-detail-card cl-exec-detail-card-v2';
+
+  var row = document.createElement('div');
+  row.className = 'cl-exec-detail-row cl-exec-detail-row-v2';
+
+  // 大头像 80×80
+  var avatar = document.createElement('img');
+  avatar.className = 'cl-exec-agent-avatar cl-exec-agent-avatar-v2';
+  avatar.alt = model.agentName || '';
+  avatar.src = './icon.png';
+  avatar.onerror = function() { this.style.visibility = 'hidden'; };
+  row.appendChild(avatar);
+
+  // 信息列
+  var info = document.createElement('div');
+  info.className = 'cl-exec-detail-info cl-exec-detail-info-v2';
+
+  // 名称（无星级徽章，星级右置到卡片右上角）
+  var nameEl = document.createElement('p');
+  nameEl.className = 'cl-exec-agent-name cl-exec-agent-name-v2';
+  nameEl.textContent = model.agentName || 'Remote Agent';
+  info.appendChild(nameEl);
+
+  // 描述文字
+  var bioEl = document.createElement('p');
+  bioEl.className = 'cl-exec-agent-bio cl-exec-agent-bio-v2';
+  bioEl.textContent = _clGetAgentDescriptionText(model);
+  info.appendChild(bioEl);
+
+  row.appendChild(info);
+  card.appendChild(row);
+
+  // 星级徽章右置到卡片右上角
+  var starBadge = document.createElement('div');
+  starBadge.className = 'cl-exec-star-badge cl-exec-star-badge-v2';
+  var starSvgOutline = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M6.46401 1.8327C6.66621 1.36177 7.33396 1.36174 7.53612 1.8327L8.82412 4.83481L12.0718 5.1373C12.5808 5.18469 12.7873 5.8177 12.4039 6.15586L9.95148 8.31772L10.6687 11.5101C10.7809 12.0098 10.2404 12.4012 9.80052 12.139L7.00006 10.4699L4.19904 12.139C3.75913 12.4012 3.21924 12.0098 3.33145 11.5101L4.04808 8.31772L1.59626 6.15586C1.21282 5.81777 1.4189 5.18488 1.9278 5.1373L5.17601 4.83481L6.46401 1.8327ZM5.89435 5.8226L3.10073 6.08237L5.20905 7.94118L4.59325 10.6818L7.00006 9.24798L9.40575 10.6818L8.79108 7.94118L10.8983 6.08237L8.10521 5.8226L6.9995 3.24603L5.89435 5.8226Z" fill="#555555"/></svg>';
+  starBadge.innerHTML = starSvgOutline +
+    '<span class="cl-exec-star-count cl-exec-star-count-v2">' + (model.agentStars || '3.2万') + '</span>';
+  card.appendChild(starBadge);
+
+  return card;
+}
+
+// ── V2 状态文字更新 ──
+function _clUpdateAgentStatusTextV2(cardNode, status) {
+  var label = cardNode && cardNode.querySelector('.cl-openagent-status');
+  if (label) label.textContent = _clGetAgentStatusText(status);
+  // 进度文字行：完成后隐藏
+  var progressRow = cardNode && cardNode.querySelector('.cl-exec-progress-row-v2');
+  if (progressRow) progressRow.style.display = _clIsAgentTerminalStatus(status) ? 'none' : '';
+  // 步骤列表：完成后隐藏
+  var stepsBody = cardNode && cardNode.querySelector('.cl-tools-collapse-body-v2');
+  if (stepsBody) stepsBody.style.display = _clIsAgentTerminalStatus(status) ? 'none' : '';
+  var stepsHeader = cardNode && cardNode.querySelector('.cl-tools-collapse-header-v2');
+  if (stepsHeader) stepsHeader.style.display = _clIsAgentTerminalStatus(status) ? 'none' : '';
+}
+
 // ════════════════════════════════════════════════════════════════
 // MODULE: remote-agent/markdown-renderer.js
 // ════════════════════════════════════════════════════════════════
@@ -7776,14 +9095,26 @@ function _clRenderOutputCard(model, onOpenSidebar) {
         ? _clStripOpenagentMediaLines(chunk.text)
         : chunk.text;
       if (_clShouldRenderOutputText(textChunk)) resultTexts.push(textChunk);
+    } else if (chunk.type === 'error') {
+      var errorText = chunk.text || model.rawText || '远端 Agent 调用失败';
+      if (_clShouldRenderOutputText(errorText)) resultTexts.push(errorText);
     }
   }
 
+  // ── V2 版本判断 ──
+  var isV2 = typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9');
+
   if (resultTexts.length === 0 && mediaLinks.length === 0) {
     var placeholder = document.createElement('span');
     placeholder.className = 'cl-remote-agent-card cl-remote-agent-output-placeholder';
     placeholder.style.display = 'none';
     placeholder.__clEmptyOutput = true;
+    // 防止 OpenClaw native 代码读 .textContent 报 undefined.trim()
+    var hiddenText = document.createElement('span');
+    hiddenText.className = 'chat-text';
+    hiddenText.style.display = 'none';
+    hiddenText.textContent = '';
+    placeholder.appendChild(hiddenText);
     if (model.toolCallId) {
       placeholder.dataset.clCardTcid = model.toolCallId;
     }
@@ -7792,34 +9123,54 @@ function _clRenderOutputCard(model, onOpenSidebar) {
   }
 
   var container = document.createElement('div');
-  container.className = 'cl-remote-agent-card cl-thought-chain cl-output-card'
+  var cardClasses = 'cl-remote-agent-card cl-thought-chain cl-output-card'
     + (resultTexts.length > 0 ? ' cl-output-card--pending' : '');
+  if (isV2) cardClasses += ' cl-exec-v2';
+  container.className = cardClasses;
   container.dataset.clCardRole = 'output';
+  // 防止 OpenClaw native 代码读 .textContent 报 undefined.trim()
+  var safetyText = document.createElement('div');
+  safetyText.className = 'chat-text';
+  safetyText.style.display = 'none';
+  safetyText.textContent = '';
+  container.appendChild(safetyText);
+  if (model.toolCallId) container.dataset.clCardTcid = model.toolCallId;
+  // 阻止点击冒泡到原生 tool card handler
+  container.addEventListener('click', function(e) { e.stopPropagation(); });
   if (CL && typeof CL.diagMarkCard === 'function') {
     CL.diagMarkCard(container, 'output', { tcid: model.toolCallId || '' });
   }
 
-  var shellHeader = _clCreateOpenAgentHeader(model);
-  container.appendChild(shellHeader);
-  if (typeof _clSetOpenAgentHeaderAgent === 'function') {
-    _clSetOpenAgentHeaderAgent(container, model.agentName || model.agentId || 'Remote Agent');
+  model._outputMode = true;
+  model.status = model.isError ? 'failed' : 'completed';
+  if (isV2) {
+    var v2Header = _clCreateOpenAgentHeaderV2(model);
+    v2Header.classList.remove('cl-openagent-header--output');
+    container.appendChild(v2Header);
+    if (typeof _clUpdateAgentStatusTextV2 === 'function') {
+      _clUpdateAgentStatusTextV2(container, model.status);
+    }
+  } else {
+    var shellHeader = _clCreateOpenAgentHeader(model);
+    container.appendChild(shellHeader);
+    if (typeof _clSetOpenAgentHeaderAgent === 'function') {
+      _clSetOpenAgentHeaderAgent(container, model.agentName || model.agentId || 'Remote Agent');
+    }
   }
 
   var content = document.createElement('div');
   content.className = 'cl-thought-chain-content';
   container.appendChild(content);
 
-  // ── Agent Pill ──
-  var pillSlot = document.createElement('div');
-  pillSlot.className = 'cl-thought-chain-pill-slot';
-  var pill = _clCreateAgentPill(model.agentName, model.agentId, model.agentAvatar);
-  pillSlot.appendChild(pill);
-  content.appendChild(pillSlot);
-
-  // ── 分隔线 ──
-  var divider = document.createElement('div');
-  divider.className = 'cl-thought-chain-divider';
-  content.appendChild(divider);
+  // ── V2 Agent 详情卡片 ──
+  if (isV2) {
+    try {
+      var detailCard = _clCreateAgentDetailCardV2(model);
+      content.appendChild(detailCard);
+    } catch(e) {
+      console.warn('[cl-output-v2] detail card creation failed:', e);
+    }
+  }
 
   // ── 附件下载链接 ──
   if (mediaLinks.length > 0 && typeof _clCreateOpenagentMediaLinksSection === 'function') {
@@ -7864,12 +9215,23 @@ function _clRenderOutputCard(model, onOpenSidebar) {
   }
 
   // ── onOpenSidebar 支持：点击展开到侧边栏 ──
-  if (onOpenSidebar && model.rawText) {
+  // 宿主 sidebar 渲染器要求 content 为 { kind: 'markdown', content, rawText } 对象，
+  // kind 必须为 'markdown' 才会进入 markdown 渲染路径，否则显示 "No previewable markdown content."。
+  // travel card 标签（<sh_card>等）sidebar 原生 markdown 解析不认，先 strip 再传。
+  var sidebarRaw = resultText || model.rawText || '';
+  var sidebarText = String(sidebarRaw).replace(/<\/?[a-z]+_card[^>]*>/gi, '');
+  if (typeof _clStripSuppressedTravelTags === 'function') {
+    sidebarText = _clStripSuppressedTravelTags(sidebarText);
+  }
+  if (onOpenSidebar && sidebarText.trim()) {
     container.style.cursor = 'pointer';
     container.addEventListener('click', function(e) {
-      // 不拦截折叠/展开点击
       if (e.target.closest('.cl-tools-collapse-header')) return;
-      onOpenSidebar(model.rawText);
+      onOpenSidebar({ kind: 'markdown', content: sidebarText, rawText: sidebarText });
+      setTimeout(function() {
+        var titleEl = document.querySelector('.chat-sidebar .sidebar-title');
+        if (titleEl) titleEl.textContent = 'OpenAgent @' + (model.agentName || 'Remote Agent');
+      }, 100);
     });
   }
 
@@ -7877,26 +9239,47 @@ function _clRenderOutputCard(model, onOpenSidebar) {
   if ((model.agentId || model.agentName) && typeof fetchAgentById === 'function') {
     fetchAgentById(model.agentId, model.agentName).then(function(agent) {
       if (!agent) return;
-      var pa = container.querySelector('.cl-agent-pill-avatar');
-      var pn = container.querySelector('.cl-agent-pill-name');
-      if (pa && typeof avatarUrl === 'function') {
-        var resolvedAvatar = avatarUrl(agent);
-        console.log('[cl-diag][pill] fetch-update agentId=' + JSON.stringify(model.agentId)
-          + ' name=' + JSON.stringify(agent.name || model.agentName)
-          + ' src=' + JSON.stringify(resolvedAvatar));
-        pa.src = resolvedAvatar;
-        pa.style.display = '';
+      if (isV2) {
+        var avatarElV2 = container.querySelector('.cl-exec-agent-avatar-v2');
+        var nameElV2 = container.querySelector('.cl-exec-agent-name-v2');
+        var bioElV2 = container.querySelector('.cl-exec-agent-bio-v2');
+        var agentBioV2 = typeof _clGetAgentDescriptionText === 'function'
+          ? _clGetAgentDescriptionText(agent)
+          : (agent.bio || agent.description || '');
+        if (nameElV2) nameElV2.textContent = agent.name || model.agentName;
+        if (bioElV2 && agentBioV2) bioElV2.textContent = agentBioV2;
+        var starsElV2 = container.querySelector('.cl-exec-star-count-v2');
+        if (starsElV2 && agent.claws) starsElV2.textContent = _cl_formatStarCount(agent.claws);
+        if (starsElV2 && agent.stars && !agent.claws) starsElV2.textContent = _cl_formatStarCount(agent.stars);
+      } else {
+        _clSetOpenAgentHeaderAgent(container, agent.name || model.agentName);
       }
-      _clSetAgentPillName(container, agent.name || model.agentName);
-      _clSetOpenAgentHeaderAgent(container, agent.name || model.agentName);
     }).catch(function() {});
   }
 
+  // ── Footer ──
+  if (isV2) {
+    var footerV2 = document.createElement('div');
+    footerV2.className = 'cl-output-footer cl-output-footer-v2';
+    footerV2.innerHTML = '<span class="cl-output-footer-text">-由' + (model.agentName || 'Remote Agent') + '完成</span>'
+      + '<span class="cl-output-footer-star"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1.16L8.356 5.33H12.78L9.195 7.94L10.565 12.1L7 9.51L3.435 12.1L4.805 7.94L1.22 5.33H5.644L7 1.16Z" stroke="#999" stroke-width="0.8"/></svg></span>'
+      + '<span class="cl-output-footer-count">' + (model.agentStars || '3.2万') + '</span>';
+    container.appendChild(footerV2);
+  } else {
+    // ── Footer（Figma 131:2091） ──
+    var footer = document.createElement('div');
+    footer.className = 'cl-output-footer';
+    footer.innerHTML = '<span class="cl-output-footer-text">-由' + (model.agentName || 'Remote Agent') + '完成</span>'
+      + '<span class="cl-output-footer-star"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1.16L8.356 5.33H12.78L9.195 7.94L10.565 12.1L7 9.51L3.435 12.1L4.805 7.94L1.22 5.33H5.644L7 1.16Z" stroke="#999" stroke-width="0.8"/></svg></span>'
+      + '<span class="cl-output-footer-count">' + (model.agentStars || '3.2万') + '</span>';
+    container.appendChild(footer);
+  }
+
   if (typeof _cl_applyCardUiState === 'function') {
     _cl_applyCardUiState(container, model);
   }
 
-  console.log('[cl-output] ✅ output card built: results=' + resultTexts.length);
+  console.log('[cl-output] ✅ output card built: results=' + resultTexts.length + ' v2=' + isV2);
   return container;
 }
 
@@ -8020,6 +9403,8 @@ function _clScheduleOutputCardProcessing(resultSection, model) {
   setTimeout(run, 0);
 }
 
+// ── Sidebar Figma 145:5712 内联样式 ──
+
 // ════════════════════════════════════════════════════════════════
 // MODULE: remote-agent/render-hooks.js
 // ════════════════════════════════════════════════════════════════
@@ -8039,8 +9424,14 @@ var __cl_toolStates = new Map();
 // 每个 entry: { steps: [], phase: 'active'|'completed', cardNode: null, args: {} }
 
 var __cl_lastCallModel = null;   // 同一 render cycle 里 call card 的 model（供 result card 读取 agent 身份）
-var __cl_outputCardCache = new Map();  // toolCallId → cached output DOM
-var __cl_cardUiStates = new Map();     // execution/output 展开状态，避免 OpenClaw rerender 覆盖用户操作
+var __cl_outputCardCache = new Map();    // toolCallId → cached output DOM
+var __cl_executionCardCache = new Map(); // toolCallId → cached historical execution DOM
+var __cl_cardUiStates = new Map();       // execution/output 展开状态，避免 OpenClaw rerender 覆盖用户操作
+var __cl_progressMessageMap = new Map(); // toolCallId → 动态进度文字（来自 response.progress?.safe_status_message）
+
+// ── 诊断：渲染频率计数器 ──
+var __clDiag = { renderCalls: 0, lastDiagTs: 0, version: 'v4-oneshot-20260630' };
+console.log('[cl-diag] render-hooks loaded, version=' + __clDiag.version);
 
 var CL_REMOTE_AGENT_PROGRESS_MODE_TRAVEL_TITLE = 'travel-title';
 var CL_REMOTE_AGENT_PROGRESS_MODE_GENERIC_STREAM = 'generic-stream';
@@ -8336,6 +9727,16 @@ function _cl_ensureRemoteToolState(toolCallId, data, rawText) {
 // ═══════════════════════════════════════════════════════════════
 
 window.__openagentRenderToolCard = function(card, onOpenSidebar) {
+  // ── 诊断：渲染频率计数器 ──
+  __clDiag.renderCalls++;
+  var diagNow = Date.now();
+  if (diagNow - __clDiag.lastDiagTs > 2000) {
+    var rps = (__clDiag.renderCalls / ((diagNow - __clDiag.lastDiagTs) / 1000)).toFixed(1);
+    console.log('[cl-diag] render rate: ' + rps + ' calls/sec, total=' + __clDiag.renderCalls + ', version=' + __clDiag.version);
+    __clDiag.renderCalls = 0;
+    __clDiag.lastDiagTs = diagNow;
+  }
+
   var n = (card && card.name || '').toLowerCase();
   var cardTcid = card && (card.toolCallId || '');
   var cardKind = typeof _clInferToolCardKind === 'function' ? _clInferToolCardKind(card) : (card && card.kind || '');
@@ -8373,19 +9774,34 @@ window.__openagentRenderToolCard = function(card, onOpenSidebar) {
         }
         if (state.phase === 'active') {
           model.status = 'executing';
+          if (typeof _clUpdateAgentStatusTextV2 === 'function' && state.cardNode && state.cardNode.classList.contains('cl-exec-v2')) {
+            _clUpdateAgentStatusTextV2(state.cardNode, 'executing');
+          } else if (typeof _clUpdateAgentStatusText === 'function') {
+            _clUpdateAgentStatusText(state.cardNode, 'executing');
+          }
         }
         // 有 streaming 状态 — 复用或新建
         if (state.cardNode) {
           // Lit 重复调用会复用同一个 DOM 节点；但 OpenClaw 外层 native
           // <details> 可能被 rerender 成 closed。这里重新打开的是外层原生
-          // details，不影响卡片内部的“思考中/思考完成”折叠状态。
+          // details，不影响卡片内部的”思考中/思考完成”折叠状态。
           _cl_applyCardUiState(state.cardNode, { toolCallId: tcid, cardKind: 'call' });
           if (state.phase === 'active') {
             _cl_autoOpenStepsIfUncontrolled(state.cardNode);
           }
-          _cl_forceOpenNativeToolDetails(state.cardNode, 'execution-cache', tcid);
-          if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(state.cardNode);
-          _cl_hideHostRawText(state.cardNode);
+          // ── 更新进度文字：来自 response.progress?.safe_status_message ──
+          var progressEl = state.cardNode.querySelector('.cl-exec-progress-text');
+          if (progressEl && model.rawText) {
+            var msg = (model.rawText || '').trim();
+            if (msg) progressEl.textContent = msg;
+          }
+          // ── 一次性外壳初始化：首次渲染时打开 native details + 隐藏 raw text，之后永久跳过 ──
+          if (!state.cardNode.__clShellReady) {
+            state.cardNode.__clShellReady = true;
+            _cl_forceOpenNativeToolDetails(state.cardNode, 'execution-cache', tcid);
+            if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(state.cardNode);
+            _cl_hideHostRawText(state.cardNode);
+          }
           return state.cardNode;
         }
 
@@ -8423,6 +9839,20 @@ window.__openagentRenderToolCard = function(card, onOpenSidebar) {
 
       // 无状态 → 刷新/历史态。前端 store 如果有同一 toolCallId 的卡片快照，
       // 就用快照参数重建 steps；没有 store 时仍展示完成态外壳。
+
+      // 缓存：历史态 execution card 只创建一次，Lit 重复调用时复用（与 output card 逻辑一致）
+      var cachedExecution = tcid ? __cl_executionCardCache.get(tcid) : null;
+      if (cachedExecution && cachedExecution.isConnected) {
+        _cl_applyCardUiState(cachedExecution, { toolCallId: tcid, cardKind: 'call' });
+        if (!cachedExecution.__clShellReady) {
+          cachedExecution.__clShellReady = true;
+          _cl_forceOpenNativeToolDetails(cachedExecution, 'execution-history-cache', tcid);
+          if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(cachedExecution);
+          _cl_hideHostRawText(cachedExecution);
+        }
+        return cachedExecution;
+      }
+
       var storedCallRecord = tcid && typeof _clRemoteAgentProgressStore !== 'undefined' && _clRemoteAgentProgressStore
         ? _clRemoteAgentProgressStore.get(tcid)
         : null;
@@ -8439,10 +9869,16 @@ window.__openagentRenderToolCard = function(card, onOpenSidebar) {
       model.cardKind = 'call';
       model.status = 'completed';
       var historyNode = _clRenderExecutionCard(model);
+      if (historyNode && historyNode.classList && historyNode.classList.contains('cl-exec-v2')) {
+        if (typeof _clUpdateAgentStatusTextV2 === 'function') _clUpdateAgentStatusTextV2(historyNode, 'completed');
+      } else if (typeof _clUpdateAgentStatusText === 'function') {
+        _clUpdateAgentStatusText(historyNode, 'completed');
+      }
       _cl_finalizeCard(historyNode, model._bufferedSteps || []);
       _cl_forceOpenNativeToolDetails(historyNode, 'execution-history', tcid);
       if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(historyNode);
       _cl_hideHostRawText(historyNode);
+      if (tcid) __cl_executionCardCache.set(tcid, historyNode);
       console.log('[cl-render] 🗂️ built historical call card, tcid=' + tcid.substring(0, 8));
       return historyNode;
     }
@@ -8490,14 +9926,27 @@ window.__openagentRenderToolCard = function(card, onOpenSidebar) {
 
       model.toolCallId = resTcid;
       model.cardKind = 'result';
+      if (model.isError) {
+        var executionNodeForResult = (resState && resState.cardNode)
+          || (resTcid ? __cl_executionCardCache.get(resTcid) : null);
+        if (executionNodeForResult && executionNodeForResult.classList && executionNodeForResult.classList.contains('cl-exec-v2')) {
+          if (typeof _clUpdateAgentStatusTextV2 === 'function') _clUpdateAgentStatusTextV2(executionNodeForResult, 'failed');
+        } else if (executionNodeForResult && typeof _clUpdateAgentStatusText === 'function') {
+          _clUpdateAgentStatusText(executionNodeForResult, 'failed');
+        }
+      }
 
       // 缓存：同一 toolCallId 的 output card 只创建一次，Lit 重复调用时复用
       var cachedOutput = resTcid ? __cl_outputCardCache.get(resTcid) : null;
       if (cachedOutput && cachedOutput.isConnected) {
         _cl_applyCardUiState(cachedOutput, { toolCallId: resTcid, cardKind: 'result' });
-        _cl_forceOpenNativeToolDetails(cachedOutput, 'output-cache', resTcid);
-        if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(cachedOutput);
-        _cl_hideHostRawText(cachedOutput);
+        // ── 一次性外壳初始化：首次渲染时打开 native details + 隐藏 raw text，之后永久跳过 ──
+        if (!cachedOutput.__clShellReady) {
+          cachedOutput.__clShellReady = true;
+          _cl_forceOpenNativeToolDetails(cachedOutput, 'output-cache', resTcid);
+          if (typeof _cl_scheduleHostShellMark === 'function') _cl_scheduleHostShellMark(cachedOutput);
+          _cl_hideHostRawText(cachedOutput);
+        }
         return cachedOutput;
       }
 
@@ -8580,6 +10029,8 @@ function _cl_replayBufferedSteps(toolCallId, state) {
 
 function _cl_hideHostRawText(cardNode) {
   if (!cardNode) return;
+  // 幂等性守卫：如果父链已经标记为隐藏，跳过重复操作
+  if (cardNode.closest && cardNode.closest('.cl-remote-agent-raw-hidden')) return;
   function hide() {
     var hosts = _cl_collectRawTextHosts(cardNode);
     for (var h = 0; h < hosts.length; h++) {
@@ -8589,10 +10040,7 @@ function _cl_hideHostRawText(cardNode) {
   hide();
   if (typeof requestAnimationFrame === 'function') requestAnimationFrame(hide);
   setTimeout(hide, 0);
-  setTimeout(hide, 80);
-  setTimeout(hide, 250);
-  setTimeout(hide, 800);
-  setTimeout(hide, 2000);
+  setTimeout(hide, 200);
 }
 
 function _cl_isRemoteToolNameText(text) {
@@ -8611,26 +10059,32 @@ function _cl_isRemoteRawTextContent(text) {
   return false;
 }
 
+function _cl_getHostAdapter() {
+  return (typeof CL !== 'undefined' && CL.hostAdapter) ? CL.hostAdapter : {};
+}
+
 function _cl_collectRawTextHosts(node) {
   var hosts = [];
+  var adapter = _cl_getHostAdapter();
+  var selectors = adapter.selectors && adapter.selectors.rawTextHostClosest;
   function add(host) {
     if (!host || hosts.indexOf(host) !== -1) return;
     hosts.push(host);
   }
   add(node.parentElement);
-  if (node.closest) {
-    add(node.closest('.chat-tools-collapse__body'));
-    add(node.closest('.chat-tool-msg-body'));
-    add(node.closest('.chat-tool-card__detail'));
-    add(node.closest('.chat-bubble'));
+  if (node.closest && Array.isArray(selectors)) {
+    for (var i = 0; i < selectors.length; i++) {
+      add(node.closest(selectors[i]));
+    }
   }
   return hosts;
 }
 
 function _cl_hideRawTextInHost(host) {
   if (!host || !host.querySelectorAll) return;
+  var adapter = _cl_getHostAdapter();
   host.classList.add('cl-remote-agent-raw-hidden');
-  if (host.classList.contains('chat-tools-collapse__body') || host.classList.contains('chat-tool-msg-body')) {
+  if (adapter.isToolBody && adapter.isToolBody(host)) {
     host.classList.add('cl-remote-agent-host-shell');
   }
   var texts = host.querySelectorAll(':scope > .chat-text');
@@ -8641,16 +10095,11 @@ function _cl_hideRawTextInHost(host) {
 }
 
 function _cl_findRemoteNativeToolShell(node) {
+  var adapter = _cl_getHostAdapter();
   var cur = node && (node.nodeType === 1 ? node : node.parentElement);
   var hops = 0;
   while (cur && cur !== document.body && hops < 12) {
-    if (cur.matches && cur.matches(
-      'details.chat-tools-collapse,' +
-      'details.chat-tool-msg-collapse,' +
-      '.chat-tools-collapse,' +
-      '.chat-tool-msg-collapse,' +
-      '.chat-tool-card'
-    )) {
+    if (adapter.isRemoteNativeToolShellCandidate && adapter.isRemoteNativeToolShellCandidate(cur)) {
       if (_cl_isRemoteNativeToolShell(cur)) return cur;
     }
     cur = cur.parentElement;
@@ -8661,14 +10110,12 @@ function _cl_findRemoteNativeToolShell(node) {
 
 function _cl_isRemoteNativeToolShell(shell) {
   if (!shell) return false;
+  var adapter = _cl_getHostAdapter();
+  var summarySelector = adapter.selectors && adapter.selectors.summary;
   var summaryText = '';
-  var summary = shell.querySelector && shell.querySelector(
-    ':scope > summary,' +
-    ':scope > .chat-tools-summary,' +
-    ':scope > .chat-tool-msg-summary,' +
-    '.chat-tools-summary,' +
-    '.chat-tool-msg-summary'
-  );
+  var summary = shell.querySelector && summarySelector
+    ? shell.querySelector(summarySelector)
+    : null;
   if (summary) summaryText = summary.textContent || '';
   if (_cl_isRemoteToolNameText(summaryText)) return true;
 
@@ -8709,27 +10156,23 @@ function _cl_tryHideRemoteRawTextNode(node) {
 
   var shell = _cl_findRemoteNativeToolShell(node);
   if (shell && shell.querySelectorAll) {
-    var hosts = shell.querySelectorAll('.chat-tools-collapse__body, .chat-tool-msg-body, .chat-tool-card__detail, .chat-bubble');
-    for (var h = 0; h < hosts.length; h++) {
-      _cl_hideRawTextInHost(hosts[h]);
+    var adapter = _cl_getHostAdapter();
+    var hostSelector = adapter.selectors && adapter.selectors.rawTextHostsWithinShell;
+    if (hostSelector) {
+      var hosts = shell.querySelectorAll(hostSelector);
+      for (var h = 0; h < hosts.length; h++) {
+        _cl_hideRawTextInHost(hosts[h]);
+      }
     }
   }
 }
 
 function _cl_findNearestToolLikeShell(node) {
+  var adapter = _cl_getHostAdapter();
   var cur = node && (node.nodeType === 1 ? node : node.parentElement);
   var hops = 0;
   while (cur && cur !== document.body && hops < 12) {
-    if (cur.matches && cur.matches(
-      'details.chat-tools-collapse,' +
-      'details.chat-tool-msg-collapse,' +
-      '.chat-tools-collapse,' +
-      '.chat-tool-msg-collapse,' +
-      '.chat-tool-card,' +
-      '.chat-tools-collapse__body,' +
-      '.chat-tool-msg-body,' +
-      '.chat-tool-card__detail'
-    )) {
+    if (adapter.isToolLikeShell && adapter.isToolLikeShell(cur)) {
       return cur;
     }
     cur = cur.parentElement;
@@ -8778,15 +10221,11 @@ _cl_installRemoteRawTextObserver();
 // ── 局部打开最近宿主 wrapper（不做全局扫描）──
 
 function _cl_findNearestNativeToolShell(node) {
+  var adapter = _cl_getHostAdapter();
   var cur = node && node.parentElement;
   var hops = 0;
   while (cur && cur !== document.body && hops < 10) {
-    if (cur.matches && cur.matches(
-      'details.chat-tools-collapse,' +
-      'details.chat-tool-msg-collapse,' +
-      '.chat-tools-collapse,' +
-      '.chat-tool-msg-collapse'
-    )) {
+    if (adapter.isNativeToolShell && adapter.isNativeToolShell(cur)) {
       return cur;
     }
     cur = cur.parentElement;
@@ -8814,7 +10253,9 @@ function _cl_forceOpenNativeToolDetails(node, source, tcid) {
 
     if (shell.classList && !shell.classList.contains('is-open')) {
       shell.classList.add('is-open');
-      var header = shell.querySelector('.chat-tool-msg-summary, .chat-tools-summary');
+      var adapter = _cl_getHostAdapter();
+      var headerSelector = (adapter.selectors && adapter.selectors.forceOpenHeader) || '';
+      var header = headerSelector ? shell.querySelector(headerSelector) : null;
       if (header) header.setAttribute('aria-expanded', 'true');
       console.log('[cl-render] 🔓 opened native collapse source=' + source
         + ' tcid=' + String(tcid || '').substring(0, 8));
@@ -8826,8 +10267,6 @@ function _cl_forceOpenNativeToolDetails(node, source, tcid) {
   // openNearest 是幂等的（已 open 不重复操作），不需要防抖。
   openNearest();
   if (typeof requestAnimationFrame === 'function') requestAnimationFrame(openNearest);
-  setTimeout(openNearest, 0);
-  setTimeout(openNearest, 80);
   setTimeout(openNearest, 300);  // 兜底：慢速 Lit render / 异步 wrapper 挂载
 }
 
@@ -8892,6 +10331,9 @@ function _cl_applyCardUiState(container, modelOrNode) {
       content.classList.remove('cl-content-collapsed');
       if (caret) caret.textContent = '▼';
     }
+    if (typeof _clSyncOutputFooterVisibility === 'function') {
+      _clSyncOutputFooterVisibility(container, state.contentCollapsed);
+    }
   }
 
   var body = container.querySelector('.cl-tools-collapse-body');
@@ -8921,6 +10363,14 @@ function _cl_applyStoredRecordToModel(model, record) {
   if (!model.agentAvatar) {
     model.agentAvatar = args.agent_avatar || args.agentAvatar || args.avatar || args.avatar_url || args.avatarUrl || null;
   }
+  if (!model.agentBio) {
+    model.agentBio = typeof _clPickAgentDescription === 'function'
+      ? _clPickAgentDescription(args)
+      : (args.agent_bio || args.agentBio || args.description || args.agent_description || args.MOM || '');
+  }
+  if (!model.agentStars) {
+    model.agentStars = args.agent_stars || args.agentStars || '3.2万';
+  }
   var identity = CL && typeof CL.getAgentIdentity === 'function'
     ? CL.getAgentIdentity(model.agentId, model.agentName)
     : null;
@@ -8928,6 +10378,11 @@ function _cl_applyStoredRecordToModel(model, record) {
     model.agentId = model.agentId || identity.id || identity.agent_id;
     model.agentName = (model.agentName && model.agentName !== 'Remote Agent') ? model.agentName : (identity.name || model.agentName);
     model.agentAvatar = model.agentAvatar || identity.avatar || null;
+    if (!model.agentBio) {
+      model.agentBio = typeof _clPickAgentDescription === 'function'
+        ? _clPickAgentDescription(identity)
+        : (identity.bio || identity.description || identity.agent_bio || identity.agentBio || identity.MOM || '');
+    }
   }
   model.taskText = model.taskText || args.task || args.message || args.instruction || '';
 }
@@ -9326,8 +10781,6 @@ function _cl_updateCardSteps(card, steps) {
     var stepEl = _clCreateStepElement(steps[i], i === steps.length - 1);
     body.appendChild(stepEl);
   }
-
-  _cl_forceOpenNativeToolDetails(card, 'steps-update', card.dataset && card.dataset.clCardTcid || '');
 }
 
 function _cl_autoOpenStepsIfUncontrolled(card) {
@@ -9335,7 +10788,11 @@ function _cl_autoOpenStepsIfUncontrolled(card) {
   var uiState = _cl_getCardUiState(card);
   if (uiState && uiState.stepsExpanded !== undefined) return;
 
-  var body = card.querySelector('.cl-tools-collapse-body');
+  // 缓存 body 引用，避免 5-16Hz Lit rerender 时重复 querySelector
+  if (!card.__clStepsBody) {
+    card.__clStepsBody = card.querySelector('.cl-tools-collapse-body');
+  }
+  var body = card.__clStepsBody;
   if (!body) return;
 
   body.classList.remove('cl-collapsed');
@@ -9390,6 +10847,11 @@ function _cl_countChunkTypes(chunks) {
 }
 
 function _cl_finalizeCard(card, steps) {
+  if (card && card.classList && card.classList.contains('cl-exec-v2')) {
+    if (typeof _clUpdateAgentStatusTextV2 === 'function') _clUpdateAgentStatusTextV2(card, 'completed');
+  } else if (typeof _clUpdateAgentStatusText === 'function') {
+    _clUpdateAgentStatusText(card, 'completed');
+  }
   var header = card.querySelector('.cl-tools-collapse-header-title');
   if (header) {
     header.textContent = '思考完成';
@@ -9400,6 +10862,20 @@ function _cl_finalizeCard(card, steps) {
     dots[i].className = 'cl-tools-collapse-step-check';
   }
 
+  // 执行完成后隐藏第一个 chat-bubble（execution card），仅保留 output card
+  // 仅 V2 启用：V1 的 output card 布局不同，不宜隐藏 execution bubble
+  var isV2Finalize = typeof _clIsHostVersionGte === 'function' && _clIsHostVersionGte('2026.6.9');
+  if (isV2Finalize && card && !card.__clBubbleHidden) {
+    card.__clBubbleHidden = true;
+    var bubble = card.closest && card.closest('.chat-bubble');
+    if (bubble) {
+      // 延迟隐藏，等 output card（第二个 bubble）渲染完毕
+      setTimeout(function() {
+        bubble.style.display = 'none';
+      }, 500);
+    }
+  }
+
   // Finalize 只负责把 execution card 标记为完成态。
   // 不在这里强制折叠 steps：OpenClaw 会周期性 rerender，若 finalize 每次都
   // 写 cl-collapsed，会覆盖用户手动展开后的状态。
@@ -9645,7 +11121,7 @@ var _clObserverTarget = null;
 
 const _clObserver = new MutationObserver(() => {
   if (_clDebounceTimer) clearTimeout(_clDebounceTimer);
-  _clDebounceTimer = setTimeout(_debouncedClScan, 50); // Reduced from 500ms to 50ms to fix UI flash
+  _clDebounceTimer = setTimeout(_debouncedClScan, 300); // Debounce to reduce DOM churn feedback loops
 });
 
 function _debouncedClScan() {