magic-agent 1.0.3 → 1.0.49

package/client-ui/shared/conversation.js

@@ -12,6 +12,10 @@
  *                                              onOpen(runID) / onEvent(coreEvent) / onEnd(exitCode)
  *      control({id, op, text?})             -> Promise   （op: interrupt | stop | answer）
  *      readSession(id, {after?})            -> Promise<{events, lastSeq?, snapshotRequired?}>
+ *      listAsks()                           -> Promise<[{id, engine, started, session?, run?}]>  （可选）
+ *                                              打开还在跑的会话时用它续上实时流（见 attachRunningAsk）
+ *      upload(file)                         -> Promise<{path, name, size, mime, url?}>  （可选）
+ *      mediaUrl(path)                       -> string  （可选）附件回读地址；有它历史气泡才画得出缩略图
  *    掌天瓶走 IPC → CLI；别的对接方可能走 HTTP —— 组件对此一无所知。
  *    现成的 HTTP 实现见同目录 transport-http.js。
  *
@@ -23,8 +27,12 @@
  *      engine, model, permission: 可选初始值（空 = 不传，由 core 用自己的默认）
  *      engines:       可选。给了就用这份清单，不给则调 transport.listEngines()
  *      titleEl:       可选。宿主显示会话标题的元素（组件会写「新会话 · <引擎>」这类文案）
+ *      showPermission: 可选。false 则不显示输入框下的「授权」选择器（权限仍可用 openPermissionPicker 打开）
  *      onEvent:       可选。每个 core 事件透传一份给宿主（只读）
  *      onBusy:        可选。一轮开始/结束时回调 (busy:boolean)
+ *      onPick:        可选。用户在选择器里**落定**引擎/模型时回调 (engine, model)。
+ *                     宿主可据此把它记成下次新建任务的默认值（移动端「我的 → 默认引擎/模型」）；
+ *                     只点左列引擎浏览模型不回调。引擎清单探测到记住的引擎已不可用而回退时也回调。
  *    });
  *    conv.send('…');  conv.interrupt();  conv.stop();  conv.answer('…');
  *    conv.setSession(sid) / conv.newSession() / conv.refreshEngines() / conv.destroy();
@@ -40,17 +48,34 @@
 
   /* 组件自带的图标集：宿主**不必**自己准备这些 symbol。
      前 7 个与 client-ui-mobile 里的定义逐字相同（保持两端图标一致），
-     i-cpu / i-set 是选择器要用的，移动端原先没有，按其同一套线宽补画。 */
+     选择器（i-cpu / i-set）、标记行（i-terminal）、工具卡归类（i-filepen / i-bot /
+     i-hammer / i-search / i-mcp / i-listcheck）都是本组件要用的，按其同一套线宽补画。
+     ⚠️ i-terminal / i-filepen / i-bot / i-hammer 曾经**只被引用、从未定义**
+        （toolIconId 一直在返回这四个 id）→ <use> 指不到东西，工具卡的图标一直是空白。
+        改这块时请连同本表一起看：id 打错同样是静默失败。 */
   var SPRITE =
     '<symbol id="i-chev" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6.5 9.5 5.5 5.5 5.5-5.5"/></symbol>' +
     '<symbol id="i-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="11" height="11" rx="2.2"/><path d="M15 6.2V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h.2"/></symbol>' +
-    '<symbol id="i-share" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M21 3h-6M21 3v6M21 3l-8 8"/><path d="M20 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h5"/></symbol>' +
+    '<symbol id="i-retry" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M20 12a8 8 0 1 1-2.34-5.66"/><path d="M20 4v4h-4"/></symbol>' +
     '<symbol id="i-spark" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M9.9 4.3a.6.6 0 0 1 1.1 0l1.3 3.7a.6.6 0 0 0 .4.4l3.7 1.3a.6.6 0 0 1 0 1.1l-3.7 1.3a.6.6 0 0 0-.4.4l-1.3 3.7a.6.6 0 0 1-1.1 0l-1.3-3.7a.6.6 0 0 0-.4-.4L4.5 10.8a.6.6 0 0 1 0-1.1l3.7-1.3a.6.6 0 0 0 .4-.4z"/><path d="M18 5.5v4M20 7.5h-4M17 16v3M18.5 17.5h-3"/></symbol>' +
     '<symbol id="i-alert" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 8v5M12 16.5h.01"/></symbol>' +
     '<symbol id="i-clock" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></symbol>' +
+    '<symbol id="i-terminal" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4.5" width="18" height="15" rx="2.5"/><path d="M7.6 10l2.2 2.2-2.2 2.2M12.8 14.6h3.6"/></symbol>' +
+    '<symbol id="i-filepen" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M13.4 3.5H7a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h4.2"/><path d="M13.4 3.5 18.5 8.6v3.6"/><path d="M20 12.4a1.5 1.5 0 0 0-2.1 0l-4.1 4.1-.7 3.1 3.1-.7 3.8-3.8a1.5 1.5 0 0 0 0-2.7z"/></symbol>' +
+    '<symbol id="i-bot" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="8" width="16" height="11" rx="3"/><path d="M12 4.5V8"/><path d="M9.2 12.6h.01M14.8 12.6h.01"/><path d="M10 16.2h4"/></symbol>' +
+    '<symbol id="i-hammer" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M14.2 3.6 20.4 9.8l-2.3 2.3-6.2-6.2z"/><path d="M11.9 8.3 4.6 15.6a1.7 1.7 0 0 0 0 2.4l1.4 1.4a1.7 1.7 0 0 0 2.4 0l7.3-7.3"/></symbol>' +
+    '<symbol id="i-search" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><circle cx="10.8" cy="10.8" r="6.3"/><path d="M15.5 15.5 20.5 20.5"/></symbol>' +
+    '<symbol id="i-mcp" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M9 3.5v3.8M15 3.5v3.8"/><path d="M6.4 7.3h11.2v3.2a5.6 5.6 0 0 1-11.2 0z"/><path d="M12 16.1v4.4"/></symbol>' +
+    '<symbol id="i-listcheck" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M4.4 7.4 6 9l2.6-2.6M4.4 16.4 6 18l2.6-2.6"/><path d="M11.4 8h8.2M11.4 17h8.2"/></symbol>' +
     '<symbol id="i-up" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19.5V5M5.8 11.2 12 5l6.2 6.2"/></symbol>' +
     '<symbol id="i-cpu" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"><rect x="7" y="7" width="10" height="10" rx="2"/><path d="M10 4v3M14 4v3M10 17v3M14 17v3M4 10h3M4 14h3M17 10h3M17 14h3"/></symbol>' +
-    '<symbol id="i-set" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"><circle cx="12" cy="12" r="3"/><path d="M12 3.5v2.2M12 18.3v2.2M20.5 12h-2.2M5.7 12H3.5M18 6l-1.6 1.6M7.6 16.4 6 18M18 18l-1.6-1.6M7.6 7.6 6 6"/></symbol>';
+    '<symbol id="i-set" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"><circle cx="12" cy="12" r="3"/><path d="M12 3.5v2.2M12 18.3v2.2M20.5 12h-2.2M5.7 12H3.5M18 6l-1.6 1.6M7.6 16.4 6 18M18 18l-1.6-1.6M7.6 7.6 6 6"/></symbol>' +
+    '<symbol id="i-plus" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M12 5.5v13M5.5 12h13"/></symbol>' +
+    '<symbol id="i-cam" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M4 9a2 2 0 0 1 2-2h1.3l.9-1.5h5.6l.9 1.5H18a2 2 0 0 1 2 2v7.5a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z"/><circle cx="12" cy="12.3" r="3.1"/></symbol>' +
+    '<symbol id="i-img" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><rect x="3.5" y="5" width="17" height="14" rx="2.5"/><circle cx="9" cy="10" r="1.6"/><path d="M4.2 16.6l4.3-3.9 3.4 3 2.5-2.2 5.4 4.4"/></symbol>' +
+    '<symbol id="i-link" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M9.6 14.4l4.8-4.8"/><path d="M8.2 11.6l-1.7 1.7a3.3 3.3 0 0 0 4.7 4.7l1.7-1.7"/><path d="M15.8 12.4l1.7-1.7a3.3 3.3 0 0 0-4.7-4.7l-1.7 1.7"/></symbol>' +
+    '<symbol id="i-doc" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5"/></symbol>' +
+    '<symbol id="i-user" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8.5" r="3.6"/><path d="M5 20a7 7 0 0 1 14 0"/></symbol>';
 
   var spriteDone = false;
   function ensureSprite() {
@@ -64,6 +89,100 @@
     document.body.appendChild(s);
   }
 
+  /* ══════════ 掌天瓶（绿液 loading 的图形本体）══════════
+     2026-10-20 用户：「要更有创意 使用掌天瓶填充绿液作为加载效果 app 启动动画也要有绿液」。
+     瓶 = 这个产品的名字（掌天瓶），绿液 = 灌进去的「灵液」，涨满 = 加载完成。
+     三处用同一份图形：读历史的居中 loading、App 启动闪屏、以后别的等待态。
+     ⚠️ 只在这里画一次瓶身，别在宿主页里另抄一份 —— 抄了就会像历史上那三份对话实现一样漂移。
+     实现要点：
+       · 瓶型取**瓷瓶**（细颈 · 丰腹 · 小圈足），不是烧瓶：这是「掌天瓶」这个名字的形，
+         圆烧瓶那种造型一眼读成化学实验，创意就落到了错的地方。
+       · 用 SVG 而不是 div/CSS：液面要做**波浪**，CSS 做不了曲线；viewBox 固定 96×120，
+         调用方给 width/height 就能任意缩放，瓶身不会变形。
+       · 绿液用 `<clipPath>` 剪在**瓶腔以内** —— 液面涨到瓶颈时自然收窄，
+         这是「往瓶里灌」而不是「给瓶子刷绿漆」的分界。
+       · 所有动效只动 transform / opacity：回放大日志会占死主线程（见 histLoading 那段注释）。 */
+  var BOTTLE_VB = { w: 96, h: 120 };
+  /* 瓶腔：梅瓶形 —— 长颈 · 广肩 · 最宽在上腹（y≈68）· 下腹圆润回收 · 平底圈足（x31..65）。
+     液面靠这个路径裁剪。
+     ⚠️ 为什么最宽点必须在**上腹**而不是正中：最宽点一半高度、底部再收成一个半圆，那是
+        圆烧瓶（一眼读成化学实验）。最宽上移 + 底部收成平足，才读得出「坛/瓶」。
+     ⚠️ 下腹的弧度要**缓**：收得太急会变成沙漏（试过 x68.5@94.5 → 61.5@102.5，就是那个效果）。
+     关键尺寸（改形时一起对）：瓶口 x43..53 @y11 · 最宽 x13.5..82.5 @y68 · 足 x31..65 @y106。 */
+  var BOTTLE_CAVITY = 'M48 11C50.8 11 53 12.6 53 15.4V22'
+    + 'C53 34 53 40 53 45'
+    + 'C59 47 72 50 78 56C81.6 60 82.5 64 82.5 68'
+    + 'C82.5 78 79 88 72 95C68 98.8 65 101 65 103.6'
+    + 'C65 105.4 63.8 106 61.8 106H34.2C32.2 106 31 105.4 31 103.6'
+    + 'C31 101 28 98.8 24 95C17 88 13.5 78 13.5 68'
+    + 'C13.5 64 14.4 60 18 56C24 50 37 47 43 45'
+    + 'C43 40 43 34 43 22V15.4C43 12.6 45.2 11 48 11Z';
+  /** 造一枚掌天瓶。`opts.fill` = 液面停在哪（0 = 空瓶 / 1 = 满），`opts.anim` = 'hist'（涨落循环）| 'rise'（一次灌满）。
+   *  @returns {SVGElement} 直接 appendChild 用。 */
+  function bottleSVG(opts) {
+    opts = opts || {};
+    var uid = 'btl' + (bottleSeq++);
+    var f = Math.max(0, Math.min(1, opts.fill == null ? 0.55 : opts.fill));
+    /* 液面顶边：在「y45（满到颈根下沿）→ y100（贴瓶底）」之间按 fill 移动。
+       上限取 45 而不是颈口 15：满瓶也要在颈里留一截空气，否则读成「塞住了」；
+       而下腹最宽点在上腹（y69），液面停在 45 时正好盖住整个腹部 —— 视觉上「装了大半瓶」。 */
+    var topY = 100 - 55 * f;
+    var svg = document.createElementNS(SVG_NS, 'svg');
+    svg.setAttribute('viewBox', '0 0 ' + BOTTLE_VB.w + ' ' + BOTTLE_VB.h);
+    svg.setAttribute('preserveAspectRatio', 'xMidYMid meet');
+    svg.setAttribute('aria-hidden', 'true');
+    svg.setAttribute('class', 'qbottle' + (opts.cls ? ' ' + opts.cls : '')
+      + (opts.anim ? ' qbottle--' + opts.anim : ''));
+    /* 波浪起伏幅度：液面越高、可见瓶腔越窄，浪要收得越小，否则会「浪出瓶外」 */
+    var amp = 3.2 + 3.4 * (1 - f);
+    svg.innerHTML =
+        '<defs>'
+      +   '<clipPath id="' + uid + 'c"><path d="' + BOTTLE_CAVITY + '"/></clipPath>'
+      /* 绿液：上亮下深的竖向渐变，读起来像「液面反光 + 深处沉色」 */
+      +   '<linearGradient id="' + uid + 'g" x1="0" y1="0" x2="0" y2="1">'
+      +     '<stop offset="0" stop-color="var(--q-bottle-hi, #7CF7A8)"/>'
+      +     '<stop offset=".55" stop-color="var(--q-bottle, #34D27B)"/>'
+      +     '<stop offset="1" stop-color="var(--q-bottle-lo, #128A4C)"/>'
+      +   '</linearGradient>'
+      /* 液面高光：贴着液面那条亮边（越往下越透，读成「液面反光」而不是第二层液） */
+      +   '<linearGradient id="' + uid + 's" x1="0" y1="0" x2="0" y2="1">'
+      +     '<stop offset="0" stop-color="#EAFFF2" stop-opacity=".9"/>'
+      +     '<stop offset="1" stop-color="#EAFFF2" stop-opacity="0"/>'
+      +   '</linearGradient>'
+      + '</defs>'
+      /* ── 瓶身：瓷质剪影（描边 + 极淡内底，别填实 —— 要透出后面的页面底色）── */
+      + '<path d="' + BOTTLE_CAVITY + '" fill="var(--q-bottle-shell, rgba(255,255,255,.03))"'
+      +   ' stroke="var(--q-bottle-line, currentColor)" stroke-width="2.2" stroke-linejoin="round"/>'
+      /* ── 绿液：整块剪在瓶腔里，靠 translateY 涨上来 ── */
+      + '<g clip-path="url(#' + uid + 'c)">'
+      +   '<g class="qbottle__liquid">'
+      /* 波峰：横跨 5 个周期（每周期 48），横移一个周期就是无缝循环；
+         左右各多画一段（-96 / 到 240）是为了横移时不露边。 */
+      +     '<path class="qbottle__wave" fill="url(#' + uid + 'g)" d="M-96 ' + topY + ' '
+      +       'q24 -' + amp + ' 48 0 t48 0 t48 0 t48 0 t48 0 t48 0 t48 0 V124 H-96 Z"/>'
+      +     '<path fill="url(#' + uid + 's)" d="M-96 ' + topY + ' q24 -' + amp + ' 48 0'
+      +       ' t48 0 t48 0 t48 0 t48 0 t48 0 t48 0 V' + (topY + 7) + ' H-96 Z" opacity=".45"/>'
+      /* 气泡固定落在**下腹深处**（y≈94），升高 16px 也仍在液面之下（见 CSS 的 qbBubble）：
+         fill .55 时液面在 y≈66，涨落 ±8 也只到 y≈74，气泡最高到 y≈78 —— 不会「浮在空气里」。 */
+      +     '<circle class="qbottle__bubble" cx="42" cy="96" r="2.4"/>'
+      +     '<circle class="qbottle__bubble qbottle__bubble--b" cx="55" cy="99" r="1.8"/>'
+      +     '<circle class="qbottle__bubble qbottle__bubble--c" cx="47" cy="101" r="1.4"/>'
+      +   '</g>'
+      + '</g>'
+      /* ── 瓶塞：瓶颈上一枚圆角木塞（宽 16 > 瓶颈 10，两侧各出 3px，读成「塞住瓶口」）── */
+      + '<rect x="40" y="2.6" width="16" height="9.4" rx="2.6"'
+      +   ' fill="var(--q-bottle-cork, currentColor)" opacity=".42"/>'
+      /* 木塞顶面一道细亮边，免得它读成一块实心方块 */
+      + '<rect x="40" y="2.6" width="16" height="3.2" rx="1.6"'
+      +   ' fill="var(--q-bottle-hi, #7CF7A8)" opacity=".22"/>'
+      /* ── 反光：左肩一道竖向亮线 + 上腹一点高光，让瓶「有弧度」── */
+      + '<path d="M23 62c-3.4 4.4-4.6 9.4-4 14.6" stroke="var(--q-bottle-hi, #7CF7A8)" stroke-width="3"'
+      +   ' stroke-linecap="round" fill="none" opacity=".3"/>'
+      + '<ellipse cx="31" cy="78" rx="4.2" ry="6.4" fill="var(--q-bottle-hi, #7CF7A8)" opacity=".14"/>';
+    return svg;
+  }
+  var bottleSeq = 0;
+
   function create(opts) {
     opts = opts || {};
     var root = opts.el;
@@ -76,6 +195,18 @@
     if (!transport || typeof transport.ask !== 'function') {
       throw new Error('MagicConversation.create: 缺 transport（需实现 listEngines / ask / control / readSession）');
     }
+    /* 对话内核（`shared/conv/`）必须**先**加载：画面由它画（本文件不再各留一套）。
+       缺了就在**开场**当场报错 —— 拖到运行中才 ReferenceError 的话，
+       表现是「某一笔突然画不出来」，而那时已经不知道该怪谁了。 */
+    if (typeof qaRenderMine !== 'function' || typeof qaRenderAnswer !== 'function'
+        || typeof qaStreamApply !== 'function' || typeof qaRenderDone !== 'function'
+        || typeof bindQaStreamDelegation !== 'function'
+        || typeof mdToHtmlOnly !== 'function' || typeof highlightIn !== 'function') {
+      throw new Error('MagicConversation.create: 缺对话内核 —— 宿主页要按 shared/conv/manifest.json 的'
+        + '顺序引全 12 片（画面的唯一实现：qaRenderMine / qaRenderAnswer / qaStreamApply / '
+        + 'qaRenderDone / bindQaStreamDelegation 与 markdown 渲染栈都在里面），'
+        + '并在它之前引 marked / DOMPurify（shared/vendor/），再引 shared/host-glue.js');
+    }
     ensureSprite();
 
     /* ── 组件自有的 DOM 引用 ──
@@ -106,6 +237,7 @@
       s.appendChild(u);
       return s;
     }
+
     function box(cls, iconId, size) {
       var d = el('span', cls);
       d.appendChild(svgIcon(iconId, size));
@@ -114,436 +246,172 @@
 
     var state = {
       engines: opts.engines || [], engine: opts.engine || '', model: opts.model || '',
-      permission: opts.permission || '', session: opts.session || '', busy: false, askId: null,
-      renderedSeq: {}, cur: null, agentRaw: '', rsn: null, rsnRaw: '', lastTool: null,
-      working: null, autoFollow: true, resultSeen: false
+      permission: opts.permission || '', workspace: opts.workspace || '', attachments: [], session: opts.session || '', busy: false, askId: null,
+      renderedSeq: {}, agentRaw: '', replay: false,
+      /* 本轮已收到的最大 seq（**流 seq，每轮从 1 重来**，见 render 的 seq 去重注释）。
+         断线后拿它当游标调 /desk/ask/{id}/events?after= 增量续传。 */
+      lastSeq: 0,
+      /* 断线续传轮询的取消钩子（换会话 / 开新轮时调用，避免旧轮的事件落进新画面） */
+      resumeStop: null,
+      working: null, autoFollow: true, lastPrompt: '', lastAttPaths: [],
+      /* 这一轮的渲染句柄（内核给的 h + 它的工具 / 委派登记表 + 起点），见 qaEnsureAnswer */
+      qa: null,
+      /* 本轮**已收尾**（turn_end / error / end 已落过收尾行）。
+         收尾后仍会有迟到的事件：core 的 result 信封在进程退出前才补发，虽然 turn_end 已经
+         把权威正文画过了，这条 result 还会再走一遍 kernelApply。若放它进 qaEnsureAnswer，
+         就会凭空长出第二条助手气泡 + 一枚永远停在「生成中」的运行胶囊
+         （2026-10-19 真实报障：回复被画两遍、底部一直生成中）。 */
+      qaClosed: false,
+      /* 历史分页游标：`{before, more, loading}`，null = 没加载 / 旧服务端（整份回放）。
+         `before` 是「从文件尾跳过多少条事件」（不是 seq），见 loadHistory。 */
+      hist: null,
+      /* 回放时的「真实时间轴」：日志每条事件自带 `at`（ISO 墙钟）。
+         回放发生在几毫秒内，拿墙上时钟算时长会写成「任务耗时 0.0s」——
+         这里记本轮首条 / 末条事件的 `at`，收尾时用它们的差（拿不到就不写时间）。 */
+      replayT0: 0, replayLastAt: 0,
+      /* 打开一条**还在跑**的会话时，这一轮的真实起点（日志里最后一条 user 的 `at`）。
+         续传轮没有本地的「发送时刻」，收尾耗时只能从这个起点算起 ——
+         否则会写成「总耗时 3s」（打开页面到结束的时长），与真实耗时差一个数量级。
+         0 = 本轮不是续传来的，按 q.t0 算。 */
+      resumeT0: 0,
+      /* 引擎停在一问上等答案（见 MagicHost.send：这种时候作答要走控制通道，不能当新的一轮发） */
+      awaitingAnswer: false,
+      /* 内核「重试」走 MagicHost.send(…, {echo:false})：那条气泡已经在画布上了，别再画一遍 */
+      noEcho: false
     };
 
-  /* ══════════ markdown 渲染 ══════════
-     对齐 AgentMarkdownText.kt：commonmark + autolink + strikethrough + tables + task list。
-     不引第三方库 —— 只覆盖 agent 回复里实际会出现的子集，够用且零依赖。 */
-  function esc(s) {
-    return String(s == null ? '' : s).replace(/[&<>"]/g, function (c) {
-      return { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' }[c];
-    });
-  }
-  // :937-942 parseFileRef —— 形如 src/app.ts:12 的路径引用
-  function fileRef(t) {
-    if (!t || /\s/.test(t) || t.indexOf('://') >= 0) return null;
-    if (t.indexOf('/') < 0) return null;
-    if (!/\.[a-zA-Z0-9]+(?::\d+(?::\d+)?)?$/.test(t)) return null;
-    return t.replace(/:\d+(?::\d+)?$/, '');
-  }
-  var COPY_TOKEN = '\u0000';
-  var HARD_BREAK = '\u0001';
-  var copyBin = [];
-  function copyAttr(text) {
-    copyBin.push(String(text == null ? '' : text));
-    return ' data-copy-idx="' + (copyBin.length - 1) + '"';
-  }
-  var COPY_BTN_HTML = '<button type="button" class="copybtn copybtn--sm" aria-label="复制"' + '\u0002' +
-    '><svg width="15" height="15"><use href="#i-copy"/></svg></button>';
-
-  function inlineMd(src) {
-    var tokens = [];
-    var s = String(src == null ? '' : src);
-    // 硬换行（行尾两空格 或 反斜杠）
-    s = s.replace(/\\\n/g, HARD_BREAK).replace(/ {2,}\n/g, HARD_BREAK);
-    // 行内码先摘出来，避免被转义与强调规则动到
-    s = s.replace(/`([^`]+)`/g, function (_, code) {
-      var isFile = fileRef(code);
-      tokens.push('<code class="md-code' + (isFile ? ' md-code--file' : '') +
-        (code.length > 30 || /\s/.test(code) ? ' md-code--wrap' : '') + '">' + esc(code) + '</code>');
-      return COPY_TOKEN + (tokens.length - 1) + COPY_TOKEN;
-    });
-    // markdown 链接也先摘出来
-    s = s.replace(/\[([^\]]*)\]\(([^)\s]+)\)/g, function (_, text, href) {
-      tokens.push('<a href="' + esc(href) + '" target="_blank" rel="noreferrer noopener">' + esc(text) + '</a>');
-      return COPY_TOKEN + (tokens.length - 1) + COPY_TOKEN;
-    });
-    // 图片 → 只保留 alt 文字（:428）
-    s = s.replace(/!\[([^\]]*)\]\([^)]*\)/g, '$1');
-    s = esc(s);
-    // 尖括号自动链接
-    s = s.replace(/&lt;((?:https?:\/\/|mailto:)[^\s&]+)&gt;/g, function (_, url) {
-      return '<a href="' + url + '" target="_blank" rel="noreferrer noopener">' + url + '</a>';
-    });
-    // 裸 URL
-    s = s.replace(/(^|[\s(（])((?:https?:\/\/)[^\s<>"'）)]+)/g, function (_, pre, url) {
-      var tail = '';
-      while (/[.,;:!?]$/.test(url)) { tail = url.slice(-1) + tail; url = url.slice(0, -1); }
-      if (!url) return pre;
-      return pre + '<a href="' + url + '" target="_blank" rel="noreferrer noopener">' + url + '</a>' + tail;
-    });
-    s = s.replace(/\*\*([^\s*](?:[\s\S]*?[^\s*])?)\*\*/g, '<strong>$1</strong>');
-    s = s.replace(/__([^\s_](?:[\s\S]*?[^\s_])?)__/g, '<strong>$1</strong>');
-    s = s.replace(/~~([^\s~](?:[\s\S]*?[^\s~])?)~~/g, '<del>$1</del>');
-    s = s.replace(/(^|[^*\w])\*([^\s*](?:[^*]*?[^\s*])?)\*/g, '$1<em>$2</em>');
-    s = s.replace(/(^|[^_\w])_([^\s_](?:[^_]*?[^\s_])?)_/g, '$1<em>$2</em>');
-    s = s.split(HARD_BREAK).join('<br>').split('\n').join(' ');
-    s = s.replace(new RegExp(COPY_TOKEN + '(\\d+)' + COPY_TOKEN, 'g'), function (_, i) { return tokens[+i]; });
-    return s;
-  }
+  /* ══════════ markdown 渲染（**栈归内核**）══════════
+     2026-10-16 阶段三：本文件以前自带一套手写解析（inlineMd / readTable / readList /
+     codePanelHtml / mdToHtml，约 200 行）—— 只覆盖「agent 回复里实际会出现」的子集，
+     表格嵌套、块级代码、任务列表、行内 HTML、流程图都不认，而且与 PC 那份长期漂移。
+     现在渲染栈只有内核那一份：`shared/conv/10-markdown-render.js`（marked + DOMPurify +
+     highlight.js + mermaid；宿主页要先引 marked / purify 与内核分片）。
+     渲染**之后**的两件收尾仍归本组件（那才是「皮」）：
+       ① 代码块补一枚复制按钮（内核那层不画按钮）；
+       ② 调内核的 `highlightIn`：语法高亮 + 流程图出图（它自己按需加载 highlight.js，
+          地址由宿主给 `window.QA_HLJS_URL`）。
+     ⚠️ 内核那份自带消毒（DOMPurify：禁 script / iframe / 内联事件），所以这里不再自己转义。 */
 
-  function splitCells(line) {
-    return line.trim().replace(/^\|/, '').replace(/\|$/, '').split('|').map(function (c) { return c.trim(); });
-  }
-  function isTableDelim(line) {
-    var c = splitCells(line);
-    return c.length >= 2 && c.every(function (x) { return /^:?-{1,}:?$/.test(x); });
-  }
-  function isTableHeader(line) {
-    if (isTableDelim(line)) return false;
-    var c = splitCells(line);
-    return c.length >= 2 && c.some(function (x) { return x !== ''; });
-  }
-  function readTable(lines, i) {
-    var header = splitCells(lines[i]);
-    var aligns = splitCells(lines[i + 1]).map(function (x) {
-      if (/^:-+:$/.test(x)) return 'center';
-      if (/^-+:$/.test(x)) return 'right';
-      return 'left';
-    });
-    i += 2;
-    var body = [];
-    while (i < lines.length && lines[i].trim() && lines[i].indexOf('|') >= 0) { body.push(splitCells(lines[i])); i++; }
-    var h = '<div class="md-table-wrap"><table><thead><tr>';
-    header.forEach(function (c, k) {
-      h += '<th style="text-align:' + (aligns[k] || 'left') + '">' + inlineMd(c) + '</th>';
-    });
-    h += '</tr></thead><tbody>';
-    body.forEach(function (r) {
-      h += '<tr>';
-      for (var k = 0; k < header.length; k++) {
-        h += '<td style="text-align:' + (aligns[k] || 'left') + '">' + inlineMd(r[k] || '') + '</td>';
-      }
-      h += '</tr>';
-    });
-    return { html: h + '</tbody></table></div>', next: i };
-  }
-  function readList(lines, i) {
-    var ordered = /^\s*\d+[.)]\s+/.test(lines[i]);
-    var m = lines[i].match(/^\s*(\d+)[.)]\s+/);
-    var start = m ? parseInt(m[1], 10) : 1;
-    var items = [], idx = 0;
-    while (i < lines.length) {
-      var mm = lines[i].match(/^\s*(?:[-*+]|\d+[.)])\s+(.*)$/);
-      if (!mm) break;
-      var body = mm[1], task = null;
-      var tm = body.match(/^\[([ xX])\]\s+(.*)$/);
-      if (tm) { task = tm[1].toLowerCase() === 'x'; body = tm[2]; }
-      // 续行：缩进的普通行并到上一条
-      i++;
-      while (i < lines.length && lines[i].trim() && /^\s{2,}/.test(lines[i]) &&
-             !/^\s*(?:[-*+]|\d+[.)])\s+/.test(lines[i])) {
-        body += ' ' + lines[i].trim(); i++;
-      }
-      items.push({ task: task, text: body, num: ordered ? start + idx : null });
-      idx++;
-    }
-    var tag = ordered ? 'ol' : 'ul';
-    var h = '<' + tag + '>';
-    items.forEach(function (it) {
-      // :222-227 anywhere 的 bullet 前缀就是字面量 "-"（不是圆点）；任务列表走 mono 的 [ ] / [x]
-      var mk = it.task === null ? (it.num != null ? it.num + '.' : '-') : (it.task ? '[x]' : '[ ]');
-      h += '<li><span class="mk' + (it.task !== null ? ' mk--mono' : '') + '">' + esc(mk) + '</span>' +
-           '<span class="li-b">' + inlineMd(it.text) + '</span></li>';
-    });
-    return { html: h + '</' + tag + '>', next: i };
-  }
-  var BASH_LABELS = { bash: 1, sh: 1, shell: 1, zsh: 1, console: 1, terminal: 1 };
-  function codePanelHtml(label, code) {
-    var isBash = !!BASH_LABELS[String(label || '').toLowerCase()];
-    var body;
-    if (isBash) {
-      // MarkdownCodePanel(:515-544) 走 BashCommandCard：按行拆，首个 token 上 prompt 色
-      var cmds = String(code).split('\n').map(function (x) { return x.replace(/\s+$/, ''); })
-        .filter(function (x) { return x.trim() !== ''; });
-      if (!cmds.length) cmds = [code];
-      body = cmds.map(function (c) {
-        var t = c.trim(), sp = t.indexOf(' ');
-        var first = sp < 0 ? t : t.slice(0, sp);
-        var rest = sp < 0 ? '' : t.slice(sp + 1).replace(/^\s+/, '');
-        return '<div class="cmdline"><span class="cmdline__p">' + esc(first) + '</span>' +
-               (rest ? '<span class="cmdline__r">' + esc(rest) + '</span>' : '') + '</div>';
-      }).join('');
-    } else {
-      body = '<pre class="codepanel__pre">' + esc(code) + '</pre>';
-    }
-    return '<div class="codepanel"><div class="codepanel__head">' +
-      '<span class="codepanel__label">' + esc(isBash ? 'Bash' : (label || 'code')) + '</span>' +
-      COPY_BTN_HTML.split('\u0002').join(copyAttr(code)) +
-      '</div><div class="codepanel__code">' + body + '</div></div>';
-  }
-  function mdToHtml(src) {
-    var lines = String(src == null ? '' : src).replace(/\r\n?/g, '\n').split('\n');
-    // :883-911 normalizeMarkdownTables：表格前一行不是空行时补一个空行
-    var norm = [], inFence = false, k;
-    for (k = 0; k < lines.length; k++) {
-      if (!inFence && k + 1 < lines.length && isTableHeader(lines[k]) && isTableDelim(lines[k + 1]) &&
-          norm.length && norm[norm.length - 1].trim() !== '') norm.push('');
-      norm.push(lines[k]);
-      if (/^\s*(```|~~~)/.test(lines[k])) inFence = !inFence;
-    }
-    var n = norm.length, i = 0, out = [];
-    while (i < n) {
-      var line = norm[i];
-      if (!line.trim()) { i++; continue; }
-      var fence = line.match(/^\s*(```|~~~)\s*(.*)$/);
-      if (fence) {
-        var mark = fence[1];
-        var label = (fence[2] || '').trim().split(/\s+/)[0] || 'code';
-        var buf = []; i++;
-        while (i < n && !new RegExp('^\\s*' + mark).test(norm[i])) { buf.push(norm[i]); i++; }
-        i++;
-        out.push(codePanelHtml(label, buf.join('\n')));
-        continue;
-      }
-      var h = line.match(/^(#{1,6})\s+(.*)$/);
-      if (h) { out.push('<h' + h[1].length + '>' + inlineMd(h[2].trim()) + '</h' + h[1].length + '>'); i++; continue; }
-      if (/^\s*([-*_])(\s*\1){2,}\s*$/.test(line)) { out.push('<hr>'); i++; continue; }
-      if (/^\s*>/.test(line)) {
-        var qb = [];
-        while (i < n && /^\s*>/.test(norm[i])) { qb.push(norm[i].replace(/^\s*>\s?/, '')); i++; }
-        out.push('<blockquote><span class="bar"></span><div class="q-b">' + mdToHtml(qb.join('\n')) + '</div></blockquote>');
-        continue;
-      }
-      if (/^\s*(?:[-*+]|\d+[.)])\s+/.test(line)) {
-        var rl = readList(norm, i); out.push(rl.html); i = rl.next; continue;
-      }
-      if (isTableHeader(line) && i + 1 < n && isTableDelim(norm[i + 1])) {
-        var rt = readTable(norm, i); out.push(rt.html); i = rt.next; continue;
-      }
-      var pb = [];
-      while (i < n && norm[i].trim() &&
-             !/^\s*(```|~~~)/.test(norm[i]) && !/^#{1,6}\s/.test(norm[i]) &&
-             !/^\s*>/.test(norm[i]) && !/^\s*(?:[-*+]|\d+[.)])\s+/.test(norm[i]) &&
-             !/^\s*([-*_])(\s*\1){2,}\s*$/.test(norm[i]) &&
-             !(isTableHeader(norm[i]) && i + 1 < n && isTableDelim(norm[i + 1]))) {
-        pb.push(norm[i]); i++;
-      }
-      if (pb.length) out.push('<p>' + inlineMd(pb.join('\n')) + '</p>');
-      else i++;
-    }
-    return out.join('');
-  }
-
-  /* ══════════ 对话区组件 ══════════ */
   function thread() { return $('thread'); }
   function scrollBottom() { var t = thread(); t.scrollTop = t.scrollHeight; }
   function nearBottom() { var t = thread(); return t.scrollHeight - t.scrollTop - t.clientHeight < 48; }
   function pushItem(node, force) {
-    thread().appendChild(node);
+    var t = thread();
+    t.appendChild(node);
+    /* 运行指示器始终贴在**最新内容之后**：它读作「此刻在干什么」，
+       而不是「这一轮从这里开始」。只搬节点、不重建 —— 重建会让秒表与动画重新开始。
+       ⚠️ 只在它**还在画布里**时搬（2026-10-20）：它已经被并进这一轮那条消息的行内之后
+       （见 mountWorking），这里再 append 一下就等于把它从消息里拽回画布、又变成独占一行。 */
+    var w = state.working && state.working.el;
+    if (w && w !== node && w.parentNode === t) t.appendChild(w);
     if (force || state.autoFollow) scrollBottom();
   }
-  function tgroup() { return el('div', 'tgroup'); }
-  function doCopy(text) {
-    var s = String(text == null ? '' : text);
-    try {
-      if (navigator.clipboard && navigator.clipboard.writeText) navigator.clipboard.writeText(s);
-      else {
-        var ta = el('textarea');
-        ta.value = s; ta.style.cssText = 'position:fixed;left:-9999px';
-        document.body.appendChild(ta); ta.select();
-        try { document.execCommand('copy'); } catch (e) {}
-        document.body.removeChild(ta);
-      }
-    } catch (e) {}
-  }
-  function copyBtn(text) {
-    var b = el('button', 'copybtn');
-    b.type = 'button';
-    b.setAttribute('aria-label', '复制');
-    b.appendChild(svgIcon('i-copy', 17));
-    b.onclick = function () { doCopy(text); };
-    return b;
-  }
 
-  /* UserBubble(:1286-1394)  22dp 圆角 · 17/13dp 内边距 · 16.5sp/24sp · 最多 8 行 */
-  function userBubble(text, failed) {
-    var wrap = tgroup();
-    var row = el('div', 'urow');
-    row.appendChild(copyBtn(text));                 // :1332 左侧 30dp 圆复制按钮
-    var col = el('div', 'urow__col');
-    var bub = el('div', 'ubub');
-    var t = el('div', 'ubub__t', text);
-    bub.appendChild(t);
-    col.appendChild(bub);
-    if (failed) col.appendChild(el('div', 'ubub__meta', '发送失败'));
-    row.appendChild(col);
-    wrap.appendChild(row);
-    pushItem(wrap, true);
-    // :1352-1356 maxLines = 8，溢出时给「展开 / 收起」
-    var w = t.clientWidth;
-    if (w > 0) {
-      var probe = el('div', 'ubub__t');
-      probe.style.cssText = 'position:absolute;left:-99999px;top:0;visibility:hidden;' +
-                            'display:block;max-height:none;overflow:visible;width:' + w + 'px';
-      probe.textContent = text;
-      document.body.appendChild(probe);
-      var full = probe.scrollHeight;
-      document.body.removeChild(probe);
-      if (full > 8 * 24 + 2) {
-        var btn = el('button', 'ubub__more', '展开');
-        btn.type = 'button';
-        btn.onclick = function () { btn.textContent = bub.classList.toggle('is-open') ? '收起' : '展开'; };
-        bub.appendChild(btn);
-      }
-    }
+  /** 耗时文案：<60s 给一位小数的秒、<60m 给「7m 16s」、再往上给「1h 2m」。
+   *  ⚠️ 拿不到耗时（没起点 / 非数 / 负数）回空串 —— **不编一个 0.0s**。 */
+  function durText(ms) {
+    if (ms == null || ms === '') return '';
+    var n = Number(ms);
+    if (!isFinite(n) || n < 0) return '';
+    var sec = Math.round(n / 1000);
+    if (sec < 60) return (n / 1000).toFixed(1) + 's';
+    var m = Math.floor(sec / 60);
+    if (m < 60) return m + 'm ' + (sec % 60) + 's';
+    return Math.floor(m / 60) + 'h ' + (m % 60) + 'm';
   }
 
-  /* AgentMessageContent(:1238-1260) → AgentMarkdownText */
-  function ensureAgent() {
-    if (state.cur) return state.cur;
-    var wrap = tgroup();
-    var md = el('div', 'md');
-    wrap.appendChild(md);
-    pushItem(wrap);
-    state.cur = { wrap: wrap, md: md };
-    state.agentRaw = '';
-    return state.cur;
-  }
   var mdTimer = 0;
-  function flushMd() {
-    mdTimer = 0;
-    if (!state.cur) return;
-    state.cur.md.innerHTML = mdToHtml(state.agentRaw);
-    if (state.autoFollow) scrollBottom();
-  }
-  function scheduleMd() {
-    if (mdTimer) return;
-    mdTimer = setTimeout(flushMd, 40);   // 流式期间合并重绘，避免每个 chunk 都跑一遍 markdown
-  }
-  function finalizeAgent(withActions) {
-    if (!state.cur) return;
-    if (mdTimer) { clearTimeout(mdTimer); mdTimer = 0; }
-    flushMd();
-    if (withActions && state.agentRaw.trim()) state.cur.wrap.appendChild(replyActions(state.agentRaw));
-    state.cur = null; state.agentRaw = '';
-  }
 
-  /* AgentReplyActions(:554-587)  分割线 + 复制 / 分享（各 30dp 圆） */
-  function replyActions(text) {
-    var d = el('div', 'acts');
-    d.appendChild(el('div', 'acts__line'));
-    var row = el('div', 'acts__row');
-    row.appendChild(copyBtn(text));
-    var share = el('button', 'copybtn');
-    share.type = 'button';
-    share.setAttribute('aria-label', '分享');
-    share.appendChild(svgIcon('i-share', 17));
-    share.onclick = function () {
-      var s = String(text || '');
-      if (navigator.share) { try { navigator.share({ text: s }); return; } catch (e) {} }
-      doCopy(s);
-    };
-    row.appendChild(share);
-    d.appendChild(row);
-    return d;
-  }
+  /* WorkingIndicator(:1072-1120)
+     一轮从 setWorking 到第一条输出之间可能是几十秒的空白（起进程 / 探测引擎 / 长思考）。
+     这一行负责证明「还在动」：实时秒数给没卡死的佐证，bot 头像的呼吸给在动的观感 ——
+     与 PC 的思考行 / 工具行的「秒数跳动」同一口径（:1693 / :1710）。
+     ⚠️ 这里的类名与 conversation.css 的 `.working*` 成对，改名要两边一起改。
 
-  /* ReasoningSection(:1530-1608)  Sparkles + 13sp mono 标题 + 可折叠 */
-  function ensureRsn() {
-    if (state.rsn) return state.rsn;
-    var d = el('div', 'rsn');
-    var head = el('button', 'rsn__head');
-    head.type = 'button';
-    head.setAttribute('aria-expanded', 'false');
-    var chev = box('chev', 'i-chev', 16);
-    head.appendChild(chev);
-    head.appendChild(box('ico', 'i-spark', 16));
-    var title = el('span', 'rsn__title', '思考');
-    head.appendChild(title);
-    var body = el('div', 'rsn__body');
-    var md = el('div', 'md');
-    body.appendChild(md);
-    body.style.display = 'none';
-    head.onclick = function () {
-      // :1572 只有可展开时才挂点击；单段短摘要那种（plain）是纯展示，点不动
-      if (head.getAttribute('data-plain') === '1') return;
-      var open = head.getAttribute('aria-expanded') !== 'true';
-      head.setAttribute('aria-expanded', String(open));
-      body.style.display = open ? '' : 'none';
-    };
-    d.appendChild(head); d.appendChild(body);
-    pushItem(d);
-    state.rsn = { el: d, head: head, chev: chev, title: title, body: body, md: md, plain: false };
-    state.rsnRaw = '';
-    return state.rsn;
-  }
-  function plainSummary(s) {
-    return String(s || '')
-      .replace(/!\[([^\]]*)\]\([^)]*\)/g, '$1')
-      .replace(/\[([^\]]+)\]\([^)]*\)/g, '$1')
-      .replace(/`([^`]+)`/g, '$1')
-      .replace(/[*_~#>]+/g, '')
-      .replace(/\s+/g, ' ')
-      .trim();
+     2026-10-20 用户：「agent 运行中这一段和下面的bot图标合并到一行 运行中的图标动画也改到bot上显示」。
+     它原本是画布里**独占一行**的兄弟节点，于是运行中永远是两行（这行 + 下面那条 bot 头像行）。
+     改法：**只并、不单画** —— 这一轮的消息一旦建出来（qaRenderAnswer，见 mountWorking），
+     把这个节点搬进那条消息里、与 bot 头像同一行；转圈那一枚交给 bot 图标自己
+     （`.qa-runlive` 的规则与本文件同侧的 conversation.css 成对 —— 它关联的是内核画的
+     `.qa-msg` / `.qa-ico`，但**类由本壳盖**，所以规则跟着本壳走，见 conv/README 的边界表）。
+     ⚠️ 消息还没建出来时（起进程 / 探测引擎那段空白）**什么都不画**：
+        用户看到那行「等待处理… + 蓝圈 + 秒数」时明确表态「不需要这个效果」——
+        一条没有正文、却顶着 spinner 的假 bot 行，读起来像第二条回复。
+        那段时间的「还在跑」由输入区那行「生成中」承担（见 composer 的 `composer__gen`）。 */
+  var WORK_TICK = 0, WORK_T0 = 0;
+  /* 「运行中」并进去之后，宿主给它盖的这一枚类（挂在**那条消息**上，不是画布上）。
+     为什么由宿主盖而不是内核画：这一行是**本壳**的业务（引擎起没起来），内核那条消息
+     并不知情 —— 见 shared/conv/README.md 的边界表「事件 → 画面」与「宿主外壳」那一行。 */
+  var RUNLIVE_CLS = 'qa-runlive';
+  function workElapsed() {
+    var w = state.working;
+    if (w && w.d) w.d.textContent = WORK_T0 ? durText(Date.now() - WORK_T0) : '';
   }
-  function updateRsnTitle() {
-    var m = state.rsn;
-    if (!m) return;
-    var segs = String(state.rsnRaw).split(/\n{2,}/).filter(function (x) { return x.trim(); });
-    var one = segs.length === 1 ? plainSummary(segs[0]) : null;
-    if (one && one.length <= 80) {
-      // :1539-1545 单段且能压成一行 → 直接内联成摘要，不给折叠
-      m.title.textContent = '思考：' + one;
-      m.plain = true;
-      m.chev.style.display = 'none';
-      m.head.setAttribute('data-plain', '1');
-      m.head.setAttribute('aria-expanded', 'false');
-      m.body.style.display = 'none';
-    } else {
-      m.title.textContent = segs.length ? '思考 · ' + segs.length + ' 段' : '思考';
-      m.plain = false;
-      m.chev.style.display = '';
-      m.head.removeAttribute('data-plain');
-    }
-    // 不可展开时去掉「像能点」的反馈
-    m.head.style.cursor = m.plain ? 'default' : 'pointer';
-  }
-  function finalizeRsn() {
-    if (!state.rsn) return;
-    updateRsnTitle();
-    if (state.rsn.plain) state.rsn.body.style.display = 'none';
-    state.rsn = null; state.rsnRaw = '';
+  /* 把「运行中」并到这一轮消息的 bot 头像那一行。
+     幂等：只在「消息里有它、画布里没有它」时搬 —— 反复调用（每条事件都过一次）不会搬第二次。
+     ⚠️ 只认 `state.qa.h.el`（**这一轮**那条消息）：拿画布里最后一条 `.qa-msg` 去并会把指示器
+        贴到上一轮的收尾行上。 */
+  function mountWorking() {
+    var w = state.working; if (!w) return;
+    var msg = state.qa && state.qa.h && state.qa.h.el;
+    if (!msg || !msg.parentNode) return;
+    if (w.el.parentNode === msg) return;
+    if (w.el.parentNode && w.el.parentNode !== thread()) return;   // 已经并到别的消息里去了
+    /* ⚠️ 必须插在 `.qa-ico` **之后、`.qa-bd` 之前**（2026-10-20）：正文那条
+       `.qa-msg:not(.qa-mine) > .qa-bd` 是 `flex:0 0 100%` 整行，appendChild 会让
+       「运行中」落到第三行（头像一行、正文一行、它在最后一行）—— 用户要的是
+       `[脸][引擎名][运行中·秒数]` 同一行，正文仍整行在下面。 */
+    var ico = null;
+    for (var n = msg.firstChild; n; n = n.nextSibling) {
+      if (n.nodeType === 1 && n.classList && n.classList.contains('qa-ico')) { ico = n; break; }
+    }
+    msg.insertBefore(w.el, ico ? ico.nextSibling : msg.firstChild);
+    msg.classList.add(RUNLIVE_CLS);
+    /* 这一行放不下了整串「引擎 · 模型」，先把小标收短（start 事件那条重写路径
+       会带着 ctx.whoModelOnly 跟上，见 09-stream-apply 的 start 分支）。
+       收尾时由 clearWorking 显式写回整串 —— 摘类不管文字（`.qa-runlive` 只管排版）。 */
+    if (state.qa && state.qa.h && typeof state.qa.h.setWho === 'function') {
+      state.qa.h.setWho(state.engine, state.model, true);
+    }
   }
-
-  /* WorkingIndicator(:1072-1120) */
-  function setWorking(label) {
+  /* ⚠️ **不画文字、也不单独占一行**（2026-10-20 用户：「agent运行中 的文字就不需要」→
+     「agent运行中还在」→「不需要这个效果」）：
+     文字以前靠 `.qa-runlive` 那条 CSS 隐藏 —— 只要「并进消息」那一步没生效（消息还没建出来 /
+     类没盖上），那串字就照旧露出来；独立一行则在没有正文时伪造出一条「假 bot 行」。
+     现在节点**只活在 state.working 里**，等这一轮的消息建出来再并进去（mountWorking）；
+     在那之前不落画布，界面上什么都不显示。 */
+  function setWorking() {
     clearWorking();
     var d = el('div', 'working');
     d.appendChild(el('div', 'working__sp'));
-    d.appendChild(el('span', 'working__t', label));
-    state.working = d;
-    pushItem(d);
+    var act = el('span', 'working__act');
+    var dur = el('span', 'working__d');
+    d.appendChild(act); d.appendChild(dur);
+    state.working = { el: d, act: act, d: dur };
+    WORK_T0 = Date.now();
+    workElapsed();
+    WORK_TICK = setInterval(workElapsed, 100);   // 100ms：与 PC 的秒数跳动同频
+    mountWorking();                               // 这一轮的消息已经在了就直接并进去
   }
   function clearWorking() {
-    if (state.working) { state.working.remove(); state.working = null; }
+    if (WORK_TICK) { clearInterval(WORK_TICK); WORK_TICK = 0; }
+    var w = state.working;
+    if (!w) return;
+    /* 类挂在**父节点**（那条消息）上，摘节点之前先摘类 —— 否则下一轮会带着上一轮的
+       「运行中」标记进来（那会让新消息一建出来就是运行态）。 */
+    var host = w.el.parentNode;
+    if (host && host.classList) host.classList.remove(RUNLIVE_CLS);
+    /* ⚠️ 小标要**显式**恢复整串，摘类不会 —— `setWho` 写的是 textContent，
+       `.qa-runlive` 那条 CSS 只管排版不管文字。这条消息收尾后还要留在画布上当历史，
+       得让它显示回「引擎 · 模型」（runlive 时按 mountWorking 收短过）。
+       ⚠️ 必须在摘 `state.qa` 之前做：`setWho` 挂在这一轮的句柄上。 */
+    if (state.qa && state.qa.h && typeof state.qa.h.setWho === 'function') {
+      state.qa.h.setWho(state.engine, state.model, false);
+    }
+    w.el.remove();
+    state.working = null;
   }
 
-  /* ToolPlaceholder(:2199-2270)  Clock / CircleAlert + 13sp Bold + 状态胶囊 */
-  function phItem(text, kind, status) {
-    var wrap = tgroup();
-    var d = el('div', 'ph' + (kind === 'err' ? ' ph--err' : ''));
-    var row = el('div', 'ph__row');
-    row.appendChild(box('ph__ico', kind === 'err' ? 'i-alert' : 'i-clock', 16));
-    row.appendChild(el('span', 'ph__t', text));
-    if (status) row.appendChild(el('span', 'pill' + (kind === 'err' ? ' pill--err' : ''), status));
-    d.appendChild(row);
-    wrap.appendChild(d);
-    return wrap;
-  }
-  /* CompactTimelineSeparator(:2272-2315) */
-  function sepItem(text) {
-    var wrap = tgroup();
-    var d = el('div', 'sep');
-    d.appendChild(el('div', 'sep__line'));
-    d.appendChild(el('span', 'sep__t', text));
-    d.appendChild(el('div', 'sep__line'));
-    wrap.appendChild(d);
-    return wrap;
-  }
   /* AuthErrorNotice(Components.kt:88-117) */
   function noticeItem(text) {
     var d = el('div', 'notice');
@@ -552,184 +420,269 @@
     pushItem(d, true);
   }
 
-  /* ToolActivityCard(:1625-1748)
-     折叠行 8dp 圆角 + activitySurface + chevron + 16dp 图标 + 13sp mono 摘要
-     展开体 14dp 圆角 + subtle + 1dp 描边；Command 走 CommandLineBar，其余走 输入/输出 段落 */
-  function toolIconId(name) {
-    var n = String(name || '').toLowerCase();
-    if (/bash|shell|zsh|command|exec|run|terminal|\bcmd\b/.test(n)) return 'i-terminal';
-    if (/write|edit|read|file|glob|grep|patch|diff|apply|notebook/.test(n)) return 'i-filepen';
-    if (/agent|task|subagent|delegate/.test(n)) return 'i-bot';
-    return 'i-hammer';
+  /* ⚠️ 2026-10-16（块③ 三端瘦身）：**「事件 → 画面」整层已交给对话内核**（`shared/conv/*`）——
+     工具归类与人话标题、diff 判定与推导、标记行、斜杠命令生命周期、引擎产出的图片、
+     思考块与工具组、收尾行…… 这些本文件里那套实现（约 1000 行）连同各自的注释一起删了：
+     留着只会是第二份真相，漂移了最难查。要让画面多出什么形态，改内核那一份。
+
+     本文件从此只管**外壳**：输入区 / 附件 / 引擎与授权选择器 / 传输层，
+     外加把内核要的宿主符号接上（`shared/host-glue.js` 给值型与桩，本文件的 MagicHost 桥给真转发）。 */
+
+  /* ── 事件 → 界面（历史与实时共用同一条路径，靠 seq 去重） ── */
+  /* ── 事件入口：去重 → 认锚点 → **归一** → 逐条落笔 ──
+     ⚠️ 归一那一步（2026-10-16 阶段三）是引用对话内核 `shared/conv/08-ask-event-map.js` 的
+     `qaEventNormalize`：本文件以前只认扁平事件 —— 引擎原生的 `assistant` / `user`
+     （正文与工具调用装在 `message.content[]` 里）到这里会掉进末尾「未识别的事件」兜底行，
+     手机上「模型答了但什么都没有」，而 PC 上一切正常。
+     现在先归一、再逐条画：扁平事件原样通过（行为不变），原生形态被翻译成同一批扁平事件。
+     ⚠️ seq 去重与会话锚点留在**入口**这一层（合金帧只带一次 session_id，翻译出来的子事件不带）。 */
+  function render(ev) {
+    /* ⚠️ seq 去重**只服务于实时流**（同一帧可能重复投递）。
+       回放**不走它**（2026-10-16 修，用户报「多轮对话只显示一轮」）：
+       会话日志是**跨轮追加**的，而老的日志里每一轮的 seq 都从 1 重来（每轮一个新 core
+       进程），回放时按 seq 去重会把第二轮起的事件全当成「重复帧」丢掉 ——
+       界面上就只剩第一轮。回放的权威是文件本身，那里不可能有重复行，跳过是安全的。
+
+       2026-10-20：网关合成的「用户提问」事件**没有 seq**（seq 固定 0，见
+       internal/client/service.go 的 appendPrompt）—— 用它的 `prompt_id` 当去重键。
+       为什么需要：core 首行到达之前，补拉会以 after=0 反复轮询，同一句提问
+       否则会被画很多遍；它也不该推进游标（游标只认 core 流的 seq）。 */
+    var key = ev.seq != null ? ev.seq : (ev.prompt_id ? 'p:' + ev.prompt_id : null);
+    if (key != null && !state.replay) {
+      if (state.renderedSeq[key]) return;
+      state.renderedSeq[key] = true;
+      /* 断点续传的游标：只认**实时流**收到的最大 seq（回放的 seq 是跨轮文件级，
+         与流 seq 不同口径 —— 拿回放去推进游标会让续传错位）。 */
+      if (ev.seq != null) {
+        var seqN = Number(ev.seq);
+        if (isFinite(seqN) && seqN > state.lastSeq) state.lastSeq = seqN;
+      }
+    }
+    /* 会话锚点：**任何**带 session_id 的事件都认（--events 下 core 一拿到 id 就每行都带；
+       收尾的 result 行恒带）。以前只在 turn_end / turn_failed 里认 —— 而 dsh 走 headless
+       的轮次（续接轮、以及 SDK 通道不可用时的回退轮）那条 turn_end 不带 id，客户端就永远
+       学不到锚点，下一步追问被发成了**新会话**（真实报障：追问变成了新任务）。 */
+    if (ev.session_id) state.session = ev.session_id;
+    /* ⚠️ 2026-10-16（块②后半）：这幅画面**不再由本文件画** ——
+       「一条事件流 → 对话」的映射收归对话内核一份（`shared/conv/09-stream-apply.js`），
+       组件这边只递事件、递画布、把回调接回自己的状态。见下面 kernelApply。 */
+    kernelApply(ev);
   }
-  function isCmdTool(name) {
-    return /bash|shell|zsh|command|exec|run|terminal|\bcmd\b/i.test(String(name || ''));
+
+  /* ══════════ 事件 → 画面：走内核那一份实现 ══════════
+     三端（掌天瓶工作台 / 本组件 · PC 宿主 / 本组件 · 移动宿主）共用同一份脚本，
+     所以这里**只有四个调用**：
+       qaRenderMine(text, atts)        —— 用户那条气泡
+       h = qaRenderAnswer(#qa-stream)  —— 拿这一轮的渲染句柄
+       qaStreamApply(ev, ctx)          —— 把每条事件交给内核
+       qaRenderDone(ok, label, …)      —— 收尾行
+     本文件仍然负责的是**外壳**（输入区 / 附件 / 引擎与授权选择器 / 传输层）——
+     内核管「事件画成什么」，外壳管「这一屏长什么样、数据从哪来」。
+
+     ── 喂之前要做的两件事（都是宿主这一层的活儿）──
+     ① 落盘拼写：实时流用 `type`，落盘的 `<session_id>.jsonl` 用 `kind`
+        （internal/cli/sessionlog.go）—— 内核只认 `type`，这里翻一次。
+     ② 会话锚点与 seq 去重留在**入口这一层**（见上面的 render）：归一之后每条子事件
+        不带 session_id，而 seq 是**每轮从 1 重来**的（每起一个 core 进程一个新序列）。 */
+  /* ── 产物卡要的宿主桥（2026-10-20 用户：「也没显示会话产物，跟pc端统一逻辑」）──
+     内核（shared/conv/19-attachments.js）画产物只问宿主三件事：
+       window.desk.pathProbe({ base, paths }) —— 这些路径真的在盘上吗（一次批量）
+       window.desk.mediaUrl(abs)              —— 本机文件怎么回读（<img>/<video> 的 src）
+       window.desk.pathRead({ path, base })   —— 文本产物怎么读（产物卡「查看」阅读用）
+     桌面壳由 Electron 主进程注入这一组；组件宿主（PC 网页 / 移动端）没有主进程，
+     但服务端就跑在 core 那台机器上 —— 用 transport 顶上即可（/desk/path-probe、/desk/media、/desk/path-read）。
+     ⚠️ 已有的实现**不覆盖**（宿主那份是 IPC 直连，链路更短）。 */
+  (function installDeskProbe() {
+    if (!transport) return;
+    var d = window.desk;
+    if (!d || typeof d !== 'object') { d = window.desk = {}; }
+    if (typeof d.pathProbe !== 'function' && typeof transport.pathProbe === 'function') {
+      d.pathProbe = function (req) { return transport.pathProbe(req); };
+    }
+    if (typeof d.mediaUrl !== 'function' && typeof transport.fileUrl === 'function') {
+      d.mediaUrl = function (p) { return transport.fileUrl(p); };
+    }
+    if (typeof d.pathRead !== 'function' && typeof transport.pathRead === 'function') {
+      d.pathRead = function (req) { return transport.pathRead(req); };
+    }
+  })();
+
+  /* 本轮产物：与 PC 工作台 / magic-test 用**同一套**（内核 qaTurnArtsTrack，见 19-attachments.js）——
+     收（写类工具参数 / 工具输出 / notice 里的产物路径）与画（封口时补在这条消息末尾）。
+     不接这一下，回放与实时都只有正文里写出来的那些图，没写进正文的产物一张不显示。 */
+  var turnArts = (typeof qaTurnArtsTrack === 'function') ? qaTurnArtsTrack() : null;
+
+  function kernelApply(ev) {
+    if (!ev || typeof ev !== 'object') return;
+    var t = ev.type || ev.kind;
+    if (!t) return;                                    // 畸形帧（连类型都没有）
+    var e = ev.type ? ev : Object.assign({}, ev, { type: t });
+    if (t === 'start') {
+      /* 一轮真正用的引擎 / 模型（配置里的模型链会自动降级）→ 选择器跟着改口 */
+      if (e.engine) state.engine = String(e.engine);
+      if (e.model) state.model = String(e.model);
+      syncPickers();
+    }
+    if (t === 'ask') state.awaitingAnswer = true;       // 引擎在等这一问的答案（见 MagicHost.send）
+    /* 画布上已经有东西了 → 撤掉那句空态说明（它只在一条都还没画时该在） */
+    var em = document.getElementById('qa-stream');
+    var empty = em && em.querySelector('.conv__empty');
+    if (empty) empty.remove();
+    /* ⚠️ 历史里**用户那条**（落盘 `kind:"user"`，见 internal/cli/sessionlog.go 的 Attachments 注释）
+       不是渲染层事件 —— 内核的事件流里没有「用户气泡」这一支（它在 `qaStreamApply` 的**忽略清单**里，
+       免得实时流把用户刚发的那条画两遍）。回放时得**宿主自己**调 qaRenderMine ——
+       magic-test 的 27-conv-log.js 与 pc 工作台的 93-rail.js 都是这么做的。
+       2026-10-17 用户报：「移动端看不到会话历史」—— 症状是历史里的助手那一侧画出来了、
+       用户那句提问**一个字都没有**（问到哪了全靠猜）。 */
+    if (t === 'user') {
+      /* 历史回放里「用户那句」就是一轮的新起点：上一轮的已收尾标记到此作废，
+         否则第二轮的助手消息会被 qaEnsureAnswer 拒开（见 state.qaClosed 注释）。 */
+      state.qaClosed = false;
+      /* ⚠️ 回放时还必须**把上一轮封口**：上一轮若被中断（没有 turn_end / result），
+         kernelDone 从未执行，state.qa 会一直挂着 —— 下一轮的思考 / 工具 / 正文就全被
+         写进上一轮那条气泡里，而最新一轮看上去一个字都没有（真实报障：「切回来还是没好」）。
+         封口走内核的 `h.finish()`（与实时收尾同一动作：落定工具卡、并进「任务耗时」组），
+         但**不画收尾行** —— 那轮没有终态事件，写「已完成」是编的。 */
+      if (state.replay) finishReplayRound();
+      if (state.replay) {
+        state.replayT0 = replayAt(e); state.replayLastAt = state.replayT0;
+      }
+      qaRenderMine(String(e.text || ''), Array.isArray(e.attachments) ? e.attachments : []);
+      return;
+    }
+    /* 产物收集：这一轮的工具参数 / 工具输出 / notice 里出现的落盘路径（见 turnArts 注释）。
+       内核那一支只认 `kind`，所以把实时流的 `type` 归一成 `kind` 再喂。 */
+    if (turnArts) turnArts.note(Object.assign({}, e, { kind: t }));
+    /* 回放：记本轮真实时间轴，并**先**把时长写到句柄上（turn_end 那条一进来就会 finish 并定格组头，
+       喂完再改就来不及了 —— 与 27-conv-ledger 的 qaSessionReplay 同一口径）。 */
+    if (state.replay) {
+      var at = replayAt(e);
+      if (at) {
+        if (!state.replayT0) state.replayT0 = at;
+        if (at > state.replayLastAt) state.replayLastAt = at;
+      }
+      if (state.qa && state.qa.h && state.qa.h.el) {
+        state.qa.h.el.__qaReplay = true;
+        state.qa.h.el.__qaMs = replaySpan();
+      }
+    }
+    qaStreamApply(e, qaCtx());
   }
-  function toolCard(name, opts) {
-    opts = opts || {};
-    var cmd = isCmdTool(name);
-    var d = el('div', 'tool' + (cmd ? ' tool--cmd' : '') + (opts.failed ? ' tool--err' : ''));
-    var head = el('button', 'tool__head');
-    head.type = 'button';
-    head.setAttribute('aria-expanded', 'false');
-    head.appendChild(box('chev', 'i-chev', 16));
-    head.appendChild(box('tool__ico', toolIconId(name), 16));
-    var sum = el('span', 'tool__sum', String(opts.summary || name || '工具'));
-    head.appendChild(sum);
-    if (opts.pill) head.appendChild(el('span', 'pill' + (opts.failed ? ' pill--err' : ''), opts.pill));
-    d.appendChild(head);
-    var detail = el('div', 'tool__detail');
-    detail.style.display = 'none';
-    d.appendChild(detail);
-    head.onclick = function () {
-      var open = head.getAttribute('aria-expanded') !== 'true';
-      head.setAttribute('aria-expanded', String(open));
-      detail.style.display = open ? '' : 'none';
-      if (open) { try { if (navigator.vibrate) navigator.vibrate(12); } catch (e) {} }  // :1656 触感
-    };
-    pushItem(d);
-    return { el: d, head: head, sum: sum, detail: detail, cmd: cmd };
+  /** 日志事件的墙钟（ISO → ms；解析不出来回 0） */
+  function replayAt(e) {
+    var t = Date.parse(String((e && e.at) || ''));
+    return isFinite(t) ? t : 0;
   }
-  /* CommandLineBar(:1969-2019)  14dp 圆角 · sessionCodeSurface · "$" + 13sp mono */
-  function cmdBar(label, command) {
-    var w = el('div', 'cmdbar');
-    var h = el('div', 'cmdbar__head');
-    h.appendChild(el('span', 'cmdbar__label', label || '命令'));
-    h.appendChild(copyBtn(command));
-    w.appendChild(h);
-    var b = el('div', 'cmdbar__body');
-    b.appendChild(el('span', 'cmdbar__p', '$'));
-    b.appendChild(el('span', 'cmdbar__t', command));
-    w.appendChild(b);
-    return w;
+  /** 回放这一轮真实花了多久：拿不到（日志没带 `at`）就返回 null —— 宁可没有，不编 0.0s */
+  function replaySpan() {
+    if (!state.replayT0 || !state.replayLastAt || state.replayLastAt <= state.replayT0) return null;
+    return state.replayLastAt - state.replayT0;
   }
-  /* CommandPreviewSection(:2021-2052)  11sp Bold 标签 + 12dp 圆角代码块（min 64dp） */
-  function toolSection(label, text, isErr) {
-    var s = el('div', 'sect');
-    var h = el('div', 'sect__head');
-    h.appendChild(el('span', 'sect__label', label));
-    h.appendChild(copyBtn(text));
-    s.appendChild(h);
-    var c = el('div', 'sect__code');
-    c.appendChild(el('pre', 'sect__pre' + (isErr ? ' sect__pre--err' : ''), String(text == null ? '' : text)));
-    s.appendChild(c);
-    return s;
+  /** 回放里的一轮被封口（下一条 user 到来 / 日志读完）：时长交给内核的「任务耗时」组头 */
+  function finishReplayRound() {
+    var q = state.qa;
+    state.qa = null;
+    if (!q || !q.h) return;
+    if (q.h.el) { q.h.el.__qaReplay = true; q.h.el.__qaMs = replaySpan(); }
+    /* 先补挂「本轮产物」再封口（在 qaRunEnd 拆卡之前 —— 与 27-conv-ledger 的 finish 同序）。 */
+    if (turnArts) { try { turnArts.flush(q.h); } catch (e0) {} }
+    /* qaRunEnd = finish + 摘掉「生成中」胶囊（内核的统一收口，见 03-chat-message）。
+       这里只 finish 会把那枚胶囊永久钉在画布上（回放里已经真实出现过）。 */
+    try { if (typeof qaRunEnd === 'function') qaRunEnd(q.h); else if (q.h.finish) q.h.finish(); }
+    catch (e) { /* 封口失败不影响后面的轮次 */ }
   }
-  function stopPrevTool() {
-    if (state.lastTool) {
-      state.lastTool.sum.classList.remove('shimmer');
-      state.lastTool = null;
+  /** 这一轮的渲染句柄（每轮一个 `.qa-msg`）：内核按 host 落笔，句柄管这一轮 */
+  function qaEnsureAnswer() {
+    /* 收尾后**不再开新的一笔**：迟到事件（result / end）到此为止（见 state.qaClosed）。 */
+    if (state.qaClosed) return null;
+    var s = thread();
+    if (!s) return null;
+    if (!state.qa || !state.qa.h) {
+      var h = qaRenderAnswer(s);
+      if (!h) return null;
+      /* 回放里新开的那一笔：时长同样只认日志 `at`（见 replaySpan），不按墙上时钟。 */
+      if (state.replay && h.el) { h.el.__qaReplay = true; h.el.__qaMs = replaySpan(); }
+      state.qa = { h: h, tools: new Map(), agents: new Map(), rid: 'conv-' + Date.now(), t0: Date.now(), ms: 0 };
+      /* 这条消息刚建出来 → 前面还挂在画布里的「运行中」现在有地方可并了（见 mountWorking）。
+         为什么必须在这里补：setWorking 早于这一轮的第一条事件，那时消息还不存在，
+         指示器只能先单独占一行；不补这一下，它会一直独占一行到收尾。 */
+      mountWorking();
     }
+    return state.qa.h;
   }
-  function onToolUse(ev) {
-    finalizeRsn();
-    finalizeAgent(false);
-    stopPrevTool();
-    var name = ev.name || '工具';
-    var input = String(ev.text == null ? '' : ev.text);
-    var head = input.split('\n')[0].trim();
-    var summary = head ? (name + ' · ' + head) : name;
-    if (summary.length > 120) summary = summary.slice(0, 120) + '…';
-    var card = toolCard(name, { summary: summary });
-    if (input) {
-      card.detail.appendChild(card.cmd ? cmdBar('命令', input) : toolSection('输入', input));
-    }
-    card.sum.classList.add('shimmer');   // :1704 运行中做扫光
-    state.lastTool = card;
+  /** 内核要的 ctx（12 键，实测契约见 shared/conv/dom-map.md §5-1b —— 少一个就地 TypeError） */
+  function qaCtx() {
+    var h = qaEnsureAnswer();
+    /* 已收尾时 h 为 null：仍然给一份**结构完整**的 ctx（内核只认形状），
+       让迟到事件停在 qaStreamApplyOne 的 `if(!h)` 守卫上，而不是让这里解引用 null 炸掉。 */
+    var q = state.qa;
+    return {
+      h: h, tools: q ? q.tools : new Map(), agents: q ? q.agents : new Map(),
+      rid: q ? q.rid : '', taskId: state.session || '',
+      setMs: function (ms) { if (q) q.ms = Number(ms) || 0; },
+      /* 会话锚点：任何带 session_id 的事件当场认（内核自己已经在各分支里认过一遍了） */
+      onSession: function (sid) { if (sid) state.session = String(sid); },
+      /* 正文台账：重试 / 快照要用；result 那条是**权威全文**（覆盖增量） */
+      onText: function (t) { state.agentRaw += String(t || ''); },
+      onResult: function (t) { state.agentRaw = String(t || ''); },
+      /* 过程步骤（思考 / 工具 / 结果）：组件这一层不留台账（历史由 core 的会话日志给） */
+      onStep: function () {},
+      /* 头像右边那枚小标在运行态只显示**模型名**（2026-10-20 用户：「只显示模型即可
+         不然现在换行了」）：那一行并着秒数，「引擎 · 模型」整串太长会把秒数挤到换行。
+         ⚠️ 这条**由本壳决定、内核执行**（内核才有那枚小标的节点与文案口径）——
+            其他宿主（PC 工作台）不传这一项就仍是整串，三端各自按自己的排布取舍。 */
+      whoModelOnly: true,
+      onError: function (e) {
+        /* 显示「根因」优先：`reason` 是 CLI 给的最内层原因（429 / 额度 / 认证），
+           `error` 是带引擎包装的完整链 —— 前 80 字常被包装词吃掉。 */
+        var why = String((e && e.reason) || '').trim();
+        kernelDone(false, '调用失败 · ' + (why ? why.slice(0, 200) : String((e && e.error) || '未知错误').slice(0, 80)));
+      },
+      onDone: function (e) { kernelDone(true, (e && e.stopped) ? '已停止' : '已完成'); },
+    };
   }
-  function onToolResult(ev) {
-    var text = String(ev.text == null ? '' : ev.text);
-    var card = state.lastTool;
-    if (!card) card = toolCard('结果', { summary: '结果' });
-    var err = /^\s*(error|错误|失败)/i.test(text) || /\bexit code [1-9]/.test(text);
-    if (card.cmd && !card.detail.firstChild && !err) {
-      // 命令卡还没展开过命令本体时，把结果当输出段
-      card.detail.appendChild(cmdBar('命令', text));
-    } else {
-      card.detail.appendChild(toolSection('输出', text, err));
-    }
-    if (err) {
-      card.el.classList.add('tool--err');
-      card.head.appendChild(el('span', 'pill pill--err', 'failed'));
-    }
-    stopPrevTool();
-  }
-
-  /* ── 事件 → 界面（历史与实时共用同一条路径，靠 seq 去重） ── */
-  function render(ev) {
-    if (ev.seq != null && state.renderedSeq[ev.seq]) return;
-    if (ev.seq != null) state.renderedSeq[ev.seq] = true;
-    /* ⚠️ 两套字段名都要认：
-       实时 SSE（magic-agent --stream --events）事件用 `type`；
-       落盘的 <session_id>.jsonl 用 `kind`（internal/cli/sessionlog.go 的 sessionEvent.Kind）。
-       只认 type 的后果是「从列表点进会话」历史整段空白 —— 静默失败，最难查。 */
-    var t = ev.type || ev.kind;
-    if (t === 'ready') {
-      setWorking('Agent 运行中');
-    } else if (t === 'thinking') {
-      var m = ensureRsn();
-      state.rsnRaw += ev.text || '';
-      m.md.innerHTML = mdToHtml(state.rsnRaw);
-      updateRsnTitle();
-      if (state.autoFollow) scrollBottom();
-    } else if (t === 'text') {
-      finalizeRsn();
-      ensureAgent();
-      state.agentRaw += ev.text || '';
-      scheduleMd();
-    } else if (t === 'tool_use') {
-      onToolUse(ev);
-    } else if (t === 'tool_result') {
-      onToolResult(ev);
-    } else if (t === 'user') {
-      // 历史里「用户自己那条」。core 目前只落引擎事件，这条是给落盘后预留的；
-      // 认它不花成本，落盘一上线历史就自然有气泡。
-      finalizeRsn(); finalizeAgent(true); stopPrevTool(); clearWorking();
-      userBubble(String(ev.text || ''), false);
-    } else if (t === 'turn_end') {
-      if (ev.session_id) state.session = ev.session_id;
-      clearWorking();
-      finalizeRsn();
-      // 兜底：个别引擎只在 turn_end 带整轮正文（正文增量一条都没到时用它）
-      if (!state.cur && !state.agentRaw && ev.text) { ensureAgent(); state.agentRaw = ev.text; }
-      finalizeAgent(true);
-      stopPrevTool();
-    } else if (t === 'result') {
-      clearWorking();
-      finalizeRsn();
-      finalizeAgent(true);
-      stopPrevTool();
-      state.resultSeen = true;
-      pushItem(sepItem('完成 · ' + (ev.latency_ms || 0) + 'ms'));
-    } else if (t === 'error') {
-      clearWorking();
-      finalizeRsn();
-      finalizeAgent(true);
-      stopPrevTool();
-      pushItem(phItem('本轮失败：' + (ev.reason || ev.error || ''), 'err', 'failed'), true);
-    } else if (t === 'ask') {
-      finalizeRsn(); finalizeAgent(true); stopPrevTool();
-      /* 审批 / 提问卡。原先这里只弹一行 notice —— 而 ask 是 headless 下**唯一**能
-         喂答案的通道（core 的 --control answer），只弹一行等于把这条路掐断了：
-         引擎卡在等待批准，手机上却没有任何办法推进它。
-         结构与桌面版 approval() 对齐（同一份 events 契约），样式按 AA 的状态胶囊走。 */
-      approvalCard(ev);
-    } else if (t === 'interrupted' || t === 'stopped') {
-      clearWorking();
-      finalizeRsn();
-      finalizeAgent(true);
-      stopPrevTool();
-      pushItem(phItem(t === 'interrupted' ? '已中断' : '已停止', 'ok', null));
-    }
+  /** 一轮收尾（成功 / 失败 / 被停）：内核的收尾动作已经做完（收思考区 / 工具卡 / 运行胶囊），
+   *  这一层只补**收尾行**（状态语 + 总耗时，取墙上时钟 —— 与掌天瓶那边同一口径）。 */
+  function kernelDone(ok, label) {
+    var q = state.qa; if (!q) return;                  // 幂等：终态可能来两条（turn_end 之后还有 end）
+    state.qa = null;
+    state.qaClosed = true;                             // 迟到事件不再开新一笔（见 state.qaClosed）
+    state.awaitingAnswer = false;
+    /* 耗时只认**真实观测到的**：实时流取墙上时钟（或 result 的 latency_ms）；
+       续传轮从日志里那条 user 的 `at` 起算（见 state.resumeT0）；
+       回放取日志 `at` 算出的本轮间隔，拿不到就**不显示** —— 不能把「回放花掉的几毫秒」
+       写成「总耗时 0.0s」糊弄人（2026-10-20 报障）。 */
+    var ms = q.ms || (state.replay ? replaySpan() : Date.now() - (state.resumeT0 || q.t0));
+    /* 收尾行落下之前补挂「本轮产物」（这一步只追加节点，不影响收尾行的位置）。 */
+    if (turnArts) { try { turnArts.flush(q.h); } catch (e0) {} }
+    qaRenderDone(ok, label, thread(), ms);
+    if (opts.onBusy) { try { opts.onBusy(false); } catch (err) {} }
   }
 
   function clearThread() {
+    /* 换会话先停掉上一轮的断线续传轮询：否则补拉回来的事件会落进新会话的画面。 */
+    if (state.resumeStop) { var rs = state.resumeStop; state.resumeStop = null; try { rs(); } catch (e) {} }
     thread().innerHTML = '';
-    state.cur = null; state.agentRaw = '';
-    state.rsn = null; state.rsnRaw = '';
-    state.lastTool = null; state.working = null;
+    /* 「加载更早」入口是画布的**常驻第一个孩子**（内核只往画布尾追加，不会碰它）——
+       innerHTML 清空会把它一起带走，这里补回来（显隐由 syncMore 按 hist 决定）。 */
+    if (moreBtn && !moreBtn.parentNode) threadEl.insertBefore(moreBtn, threadEl.firstChild);
+    /* 骨架屏同理（它也是常驻位置上的独立节点）：清空画布就把「上一轮还在读」这件事作废，
+       否则迟到的 140ms 计时器会在新画布上补一块谁都读不到结果的占位。 */
+    endHistLoading(false);
+    state.hist = null;
+    syncMore();
+    if (typeof qaScrollReset === 'function') { try { qaScrollReset(); } catch (e) {} }
+    state.agentRaw = '';
+    state.lastSeq = 0;
+    /* 换会话：这一轮的渲染句柄也归零（否则下一条事件会落进**上一个会话**的那条消息里） */
+    if (turnArts) { try { turnArts.flush(null); } catch (e0) {} }   // 上一会话残留的产物路径不带走
+    state.qa = null;
+    state.qaClosed = false;
+    state.replayT0 = 0; state.replayLastAt = 0;
+    state.resumeT0 = 0;
+    state.awaitingAnswer = false;
+    clearWorking();                              // 递带停掉秒表（只置 null 会让定时器空转）
     state.autoFollow = true;
-    copyBin.length = 0;
     if (mdTimer) { clearTimeout(mdTimer); mdTimer = 0; }
     nearBottom(); syncBottomBtn();
   }
@@ -737,7 +690,6 @@
     $('btnBottom').classList.toggle('tobottom--on', !state.autoFollow && thread().scrollHeight > thread().clientHeight + 80);
   }
 
-
   /* 控制通道：打断 / 收工 / 回答案。op 的语义与 core 的 --control 同协议；
      具体怎么送到 core 由 transport.control 决定（HTTP / IPC / CLI 都可能）。
      ⚠️ 没有 askId 就如实说，不要静默失败 —— 一个按下去没反应的按钮比报错更难查。
@@ -762,73 +714,10 @@
   /* ── 审批 / 提问卡 ──
      与桌面版 approval() 同一套 events 契约（CLIENT-CONTRACT.md 的 ask 事件）：
      ev.ask.questions[] 每题带 options[]，multi_select 为真时是多选。
-     答复走 control 的 op:'answer' —— 与 core 的 --control answer 同协议。 */
-  function approvalCard(ev) {
-    var ask = ev.ask || {};
-    var card = el('div', 'askcard');
-    var head = el('div', 'askcard__head');
-    head.appendChild(el('span', 'askcard__dot'));
-    head.appendChild(el('span', null, ask.kind === 'approval' ? '需要授权' : '需要确认'));
-    card.appendChild(head);
-
-    var qs = ask.questions || [];
-    if (!qs.length) {
-      card.appendChild(el('p', 'askcard__q', ev.text || '模型需要你的选择'));
-      var fb = el('button', 'askcard__btn askcard__btn--primary', '用输入框内容作答');
-      fb.onclick = function () { answerAsk(card, $('input').value.trim() || '是'); };
-      card.appendChild(fb);
-      pushItem(card, true);
-      return;
-    }
-
-    qs.forEach(function (q) {
-      card.appendChild(el('p', 'askcard__q', (q.header ? '【' + q.header + '】' : '') + (q.text || '')));
-      var opts = q.options || [];
-      var chosen = [];
-      var row = el('div', 'askcard__opts');
-      if (q.multi_select) {
-        opts.forEach(function (o) {
-          var b = el('button', 'askcard__btn', o.label || '');
-          if (o.description) b.title = o.description;
-          b.onclick = function () {
-            var i = chosen.indexOf(o.label);
-            if (i >= 0) { chosen.splice(i, 1); b.classList.remove('askcard__btn--primary'); }
-            else { chosen.push(o.label); b.classList.add('askcard__btn--primary'); }
-          };
-          row.appendChild(b);
-        });
-        var sub = el('button', 'askcard__btn askcard__btn--primary', '提交');
-        sub.onclick = function () { if (chosen.length) answerAsk(card, chosen.join('、')); };
-        row.appendChild(sub);
-      } else {
-        opts.forEach(function (o) {
-          var b = el('button', 'askcard__opt');
-          b.appendChild(el('b', null, o.label || ''));
-          if (o.description) b.appendChild(el('span', null, o.description));
-          b.onclick = function () { answerAsk(card, o.label || ''); };
-          row.appendChild(b);
-        });
-        if (!opts.length) {
-          var fb2 = el('button', 'askcard__btn askcard__btn--primary', '用输入框内容作答');
-          fb2.onclick = function () { answerAsk(card, $('input').value.trim() || '是'); };
-          row.appendChild(fb2);
-        }
-      }
-      card.appendChild(row);
-    });
-    pushItem(card, true);
-  }
-
-  function answerAsk(card, text) {
-    control('answer', text).then(function (ok) {
-      if (!ok) return;
-      card.innerHTML = '';
-      var head = el('div', 'askcard__head');
-      head.appendChild(el('span', 'askcard__dot askcard__dot--ok'));
-      head.appendChild(el('span', null, '已答复：' + text));
-      card.appendChild(head);
-    });
-  }
+     答复走 control 的 op:'answer' —— 与 core 的 --control answer 同协议。
+     ⚠️ 2026-10-16 阶段三：**题目形状的归一交给内核**（`qaAskFromEvent`，shared/conv/08-ask-event-map.js）——
+        两套拼写（`question`/`text`、`multiSelect`/`multi_select`）与空题过滤都由它做，
+        本文件以前只认其中一套，换一份引擎输出就会「卡上没题」。渲染这一层仍归本组件。 */
 
   /* ── 三项基础能力：引擎 / 模型 / 授权 ──
      移动端原先只有引擎选择，模型与授权都是空的，而这两样恰恰是「能不能安全用」的
@@ -861,27 +750,6 @@
     return PERMISSION_TIERS[0];
   }
 
-  function renderPermission() {
-    var b = $('btnPerm');
-    if (!b) return;
-    var t = tierOf(state.permission || '');
-    b.textContent = t.label;
-    b.setAttribute('data-tier', state.permission || '');
-    b.title = t.hint;
-    b.disabled = !engineSupportsPermission(state.engine);
-  }
-
-  /* 引擎选完，模型与授权的可选范围都要跟着变（模型属于引擎，授权取决于引擎支不支持）。 */
-  function onEnginePicked(name) {
-    state.engine = name;
-    var models = (state.engines || []).filter(function (x) { return x.engine === name; })[0];
-    var list = (models && models.models) || [];
-    if (list.indexOf(state.model) < 0) state.model = '';
-    if (!engineSupportsPermission(name)) state.permission = '';
-    if ($('chatTitle').textContent.indexOf('新会话') === 0) $('chatTitle').textContent = '新会话 · ' + name;
-    renderPermission();
-  }
-
     /* ══════════ 组件外壳：对话区 + 输入区 ══════════
        下面这些是宿主原先自己写的那部分（会话详情里的发送、底部面板、接线），
        抽到组件里由组件负责 —— 这样两端不必各写一遍。 */
@@ -896,33 +764,148 @@
       var text = ctx.input.value.trim();
       if (!text || state.busy) return;
       if (!state.engine) { noticeItem('还没有可用引擎：请先选一个引擎'); return; }
-      userBubble(text, false);
+      if ((state.attachments || []).some(function (a) { return a.uploading; })) { noticeItem('附件还在上传，请稍候'); return; }
+      state.lastPrompt = text;
+      /* 发出前先把附件快照下来：气泡缩略图走**回读地址**（不用 objectURL —— 发送后
+         clearAttachments 会 revoke，气泡若依赖它们会当场裂图）；本轮的附件路径也一并带走。 */
+      var sent = (state.attachments || []).filter(function (a) { return a.path; });
+      var sentAtts = sent.map(function (a) { return { name: a.name, remoteUrl: a.remoteUrl }; });
+      var attPaths = sent.map(function (a) { return a.path; });
+      state.lastAttPaths = attPaths;             // 记住本轮附件，重试时一起重发
+      /* 用户那条气泡由**内核**画（qaRenderMine）—— 与另外两端逐字同一份实现；
+         随消息发出的截图也一并交给它（第二个参数是附件清单）。
+         ⚠️ 内核的「重试」走 MagicHost.send(…, {echo:false})：那条气泡本来就在画布上，
+            再画一次会有两条一模一样的问题（见上面挂桥那一段）。 */
+      if (!state.noEcho) qaRenderMine(text, sentAtts);
+      state.noEcho = false;
       ctx.input.value = ''; autoGrow();
+      clearAttachments();                        // 附件随本轮带走，输入框立刻清空（不等 runTurn 结束）
+      await runTurn(text, attPaths);
+    }
+
+    async function runTurn(prompt, attPaths) {
       state.busy = true; setSendMode('busy');
-      finalizeRsn(); finalizeAgent(true); stopPrevTool();
-      setWorking('Agent 运行中');
-      state.resultSeen = false;
+      /* 发送前的等待门：宿主可在这里「按任务模式」把这一轮挂起（串行模式同空间已有任务时）。
+         info.isNew = 这是不是一段**新会话的首轮**（历史会话的追问 isNew=false、不受限）。 */
+      if (typeof opts.beforeAsk === 'function') {
+        setWorking();
+        try { await opts.beforeAsk({ isNew: !state.session, workspace: state.workspace, engine: state.engine, prompt: prompt }); } catch (e) {}
+      }
+      /* ⚠️ 收尾一律由**内核那一路**做（h.finish / qaRunEnd / qaRenderDone，见 kernelDone）——
+         这里不再补「收思考区 / 收工具卡 / 把过程并进任务耗时组」那一套（那是旧渲染器的活儿，
+         现在只会往内核画的画布上多添一笔）。这里只管**这一轮自己的状态**。 */
+      setWorking();
       state.askId = null;
+      /* 新一轮 = 新的一笔：把上一轮的渲染句柄掀掉（下一笔由 qaEnsureAnswer 现开），
+         正文台账与「引擎在等答案」的标记一并复位。 */
+      if (turnArts) { try { turnArts.flush(null); } catch (e0) {} }   // 上一轮没收口就成新轮：残留路径作废
+      state.qa = null;
+      state.qaClosed = false;                      // 新一轮开始：上一轮的收尾标记作废
+      state.agentRaw = '';
+      state.awaitingAnswer = false;
+      /* ⚠️ 每轮清空 seq 去重表：--events 的 seq 每起一个 core 进程都从 1 重来，
+         不清的话第二轮会撞上第一轮的 seq、被当成重复帧丢掉 ——
+         表现正是「第二条消息没有输出 / 不流式」。
+         续传游标同理每轮归零（它跟的是**本轮流 seq**）。 */
+      state.renderedSeq = {};
+      state.lastSeq = 0;
+      state.resumeT0 = 0;                          // 新一轮是本地发起的：耗时的起点就是 q.t0
+      if (state.resumeStop) { var rs0 = state.resumeStop; state.resumeStop = null; try { rs0(); } catch (e) {} }
       if (opts.onBusy) { try { opts.onBusy(true); } catch (e) {} }
       try {
-        var payload = { engine: state.engine, prompt: text };
+        var payload = { engine: state.engine, prompt: prompt };
         if (state.model) payload.model = state.model;
-        /* 空值就不传：让 core 用它自己的默认档，不替用户预设（安全语义）。
-           引擎不支持显式选档时同样不传 —— core 只在显式传过时才校验。 */
+        if (state.workspace) payload.workspace = state.workspace;
+        if (attPaths && attPaths.length) payload.attachments = attPaths;
+        /* 空值就不传：让 core 用它自己的默认档，不替用户预设（安全语义）。 */
         if (state.permission && engineSupportsPermission(state.engine)) payload.permission = state.permission;
         if (state.session) payload.session = state.session;
-        /* 一轮的完整生命周期交给 transport：
-             onOpen  → 拿到轮次 id（控制通道的唯一落点）
-             onEvent → 逐条 core 事件
-             onEnd   → 本轮收尾（含 core 退出码）
-           transport 负责保证 onEnd 一定会被调到一次 —— 否则界面会永远卡在 busy。 */
         await new Promise(function (resolve) {
+          var resolved = false;
+          var deliver = function () {
+            if (resolved) return;
+            resolved = true;
+            state.resumeStop = null;
+            resolve();
+          };
+
+          /* 兜底收尾：流断了、补拉也拿不到终态时才走这里。
+             一条终态事件（turn_end / error / end）都没收到时，画布上只剩提问，
+             回复区一片空白、也没有任何提示（2026-10-19 用户报「不显示回复」）。
+             这里补一条明确的收尾，别让「生成中」一直转下去。 */
+          var hardFinish = function (code, label) {
+            var failed = code !== 0 && code != null;
+            if (failed) noticeItem('core 退出码 ' + code);
+            if (!state.qaClosed) {
+              if (state.qa && state.qa.h) {
+                var h = state.qa.h;
+                /* 内核的收尾动作（关光标 / 摘「生成中」胶囊）只在终态事件路径里做
+                   （qaRunEnd），这条兜底恰恰是「终态事件一条都没来」，
+                   得自己补 —— 否则胶囊会一直转（2026-10-19 用户截图
+                   「dsh · 生成中」与「连接中断」同屏）。 */
+                if (typeof qaRunEnd === 'function') qaRunEnd(h);
+                /* 一句正文/过程都没收到时，那条空助手气泡（只剩引擎抬头）也一并撤掉，
+                   免得收尾行上方留一块空白。 */
+                var el = h.el;
+                if (el && !el.querySelector('.qa-t, .qa-think, .qa-tools, .qa-tool, .qa-ask, .qa-agent, .qa-mk, .qa-sep, .qa-img')) {
+                  if (el.parentNode) el.parentNode.removeChild(el);
+                }
+                kernelDone(false, label || (failed ? '没有收到回复 · core 异常退出' : '没有收到回复 · 连接中断'));
+              } else {
+                noticeItem('本轮没有收到任何输出（连接可能已断开），请重试');
+              }
+            }
+            deliver();
+          };
+
+          /* 断线续传（2026-10-19）：SSE 断了不代表本轮结束 —— 服务端把 core 的事件
+             留在按 ask id 的缓冲里，这里拿 lastSeq 增量补到终态或 done 为止，
+             而不是一刀切报「连接中断」。只有拿不到 askId / 宿主没实现 askEvents 时
+             才退回原来的兜底。
+             2026-10-20：补拉器抽成模块级的 tailAsk（打开运行中会话也用它），
+             这里只负责「补不到终态时怎么收尾」。 */
+          var resume = function (runID, code) {
+            tailAsk(runID, {
+              onEnd: function (reason, endCode, incomplete) {
+                if (reason === 'stopped' || reason === 'closed') return deliver();
+                /* 服务端已判定本轮结束：终态事件通常已在补拉里画过（qaClosed）。
+                   极端情况下一个终态都没补到，也得落一条「已完成」，别留「生成中」。 */
+                if (reason === 'done') {
+                  if (state.qaClosed) return deliver();
+                  return hardFinish(0, incomplete ? '已完成 · 部分过程事件已丢失' : '已完成');
+                }
+                if (reason === 'missing') noticeItem('无法续传本轮事件（服务端未保留），请刷新会话');
+                else if (reason === 'unreachable') noticeItem('连接中断且无法续传，请刷新会话');
+                else if (reason === 'timeout') noticeItem('连接中断后补拉超时，回复可能不完整，请刷新会话');
+                endNow(endCode != null ? endCode : code, incomplete);
+              }
+            });
+          };
+
+          /* 补不到终态时的收尾措辞：已经画出内容时说「没有收到回复」自相矛盾。 */
+          var endNow = function (code, incomplete) {
+            if (state.qaClosed) return deliver();
+            var hasText = !!(state.agentRaw && state.agentRaw.trim());
+            var label;
+            if (code !== 0 && code != null) {
+              label = hasText ? 'core 异常退出 · 回复可能不完整' : '没有收到回复 · core 异常退出';
+            } else if (incomplete || hasText) {
+              label = '连接中断 · 回复可能不完整';
+            } else {
+              label = '没有收到回复 · 连接中断';
+            }
+            hardFinish(code, label);
+          };
+
           var settled = false;
           var finish = function (code) {
             if (settled) return;
             settled = true;
-            if (code !== 0 && code != null) noticeItem('core 退出码 ' + code);
-            resolve();
+            if (state.qaClosed) return deliver();       // 正常收尾，无事可做
+            if (state.askId && typeof transport.askEvents === 'function') {
+              return resume(state.askId, code);
+            }
+            hardFinish(code);
           };
           try {
             transport.ask(payload, {
@@ -938,8 +921,10 @@
       } catch (e) {
         noticeItem('发送失败：' + (e.message || e));
       } finally {
-        clearWorking(); finalizeRsn(); finalizeAgent(true); stopPrevTool();
-        if (!state.resultSeen) pushItem(sepItem('完成'));
+        /* 这一轮的收尾行与工具组已由内核落定（turn_end / end → onDone → kernelDone）。
+           这里只摘掉本壳自己的「运行中」指示并把状态放开 —— 别再补「完成」这类行，
+           内核那条收尾行已经写了，补一条会变成画布上多一行重复的「完成」。 */
+        clearWorking();
         state.busy = false; state.askId = null; setSendMode('idle');
         if (opts.onBusy) { try { opts.onBusy(false); } catch (e) {} }
       }
@@ -956,120 +941,704 @@
       b.appendChild(svgIcon(mode === 'busy' ? 'i-clock' : 'i-up', 17));
       b.setAttribute('aria-label', mode === 'busy' ? '中断' : '发送');
       b.title = mode === 'busy' ? '中断这一轮' : '发送';
+      /* 「生成中」提示行（2026-10-20 用户：「两个胶囊合并成1个 在下面显示生成中效果即可」）：
+         这枚胶囊**下面**那一行小字，就是合并后「这一轮在跑」的表达 ——
+         画布底部内核那枚同文案的胶囊在本壳不画（见 conversation.css）。
+         ⚠️ 跟着 busy 走（setSendMode 是 busy 的唯一出口：发一轮 / 收一轮 / 续传轮
+         都经过它），所以不需要另开一个状态位。 */
+      if (ctx.genRow) ctx.genRow.classList.toggle('on', mode === 'busy');
     }
 
-    /* ── 选择器浮层 ──
-       fixed + 挂 body，用视口坐标定位：不受任何祖先的 overflow / transform 影响。
-       这一条踩过坑 —— 菜单 append 进 flex 行里做 absolute 时宽高会塌成 0×0。 */
-    var openPick = null;
-    function closePick() {
-      if (openPick) { openPick.remove(); openPick = null; }
-      document.removeEventListener('mousedown', onPickDown, true);
-      document.removeEventListener('keydown', onPickKey, true);
-      window.removeEventListener('resize', closePick);
-      window.removeEventListener('scroll', closePick, true);
-    }
-    function onPickDown(e) { if (!(e.target.closest && e.target.closest('.pick'))) closePick(); }
-    function onPickKey(e) { if (e.key === 'Escape') { e.preventDefault(); closePick(); } }
-    function placePick(p, anchor) {
-      var a = anchor.getBoundingClientRect(), w = p.offsetWidth, h = p.offsetHeight;
-      var left = a.left;
-      if (left + w > window.innerWidth - 8) left = Math.max(8, window.innerWidth - w - 8);
-      var top = a.bottom + 6;
-      if (top + h > window.innerHeight - 8) top = Math.max(8, a.top - h - 6);
-      p.style.left = Math.round(left) + 'px';
-      p.style.top = Math.round(top) + 'px';
-    }
-    function showPick(anchor, build) {
-      if (openPick && openPick._anchor === anchor) { closePick(); return; }
-      closePick();
-      var p = el('div', 'pick pick--on');
-      p._anchor = anchor;
-      build(p);
-      document.body.appendChild(p);
-      placePick(p, anchor);
-      openPick = p;
-      document.addEventListener('mousedown', onPickDown, true);
-      document.addEventListener('keydown', onPickKey, true);
-      window.addEventListener('resize', closePick);
-      window.addEventListener('scroll', closePick, true);
-    }
-    function pickRow(label, desc, selected, onPick, danger) {
-      var b = el('button', 'pick__row' + (danger ? ' pick__danger' : ''));
-      b.type = 'button';
-      b.setAttribute('aria-selected', String(!!selected));
-      b.appendChild(el('span', 'pick__ck', selected ? '✓' : ''));
-      var col = el('span');
-      col.appendChild(el('span', 'pick__l', label));
-      if (desc) col.appendChild(el('span', 'pick__d', desc));
-      b.appendChild(col);
-      b.onclick = function () { closePick(); onPick(); };
-      return b;
-    }
-
-    /* 引擎 · 模型：一级列引擎，点开二级是该引擎的模型 */
-    function openEnginePicker(anchor) {
-      showPick(anchor, function (p) {
-        if (!state.engines.length) {
-          p.appendChild(el('div', 'pick__cap', '没有可用引擎'));
-          p.appendChild(el('div', 'pick__row', 'magic-agent --engines 会给每个引擎的一键安装命令'));
-          return;
-        }
-        p.appendChild(el('div', 'pick__cap', '选择引擎'));
-        state.engines.forEach(function (en) {
-          var models = en.models || [];
-          var row = pickRow(en.engine + (en.ok ? '' : '（未安装）'),
-            en.ok ? (models.length + ' 个模型') : '未安装', state.engine === en.engine, function () {
-              if (!en.ok) return;
-              state.engine = en.engine;
-              if (models.indexOf(state.model) < 0) state.model = '';
-              if (!engineSupportsPermission(en.engine)) state.permission = '';
-              syncPickers();
-            });
-          if (!en.ok) { row.disabled = true; p.appendChild(row); return; }
-          p.appendChild(row);
-          if (models.length) {
-            p.appendChild(el('div', 'pick__cap', '　└ ' + en.engine + ' 的模型'));
-            p.appendChild(pickRow('默认模型', '不传 -m，由引擎自己挑',
-              state.engine === en.engine && !state.model, function () {
-                state.engine = en.engine; state.model = ''; syncPickers();
-              }));
-            models.forEach(function (n) {
-              p.appendChild(pickRow(n, '', state.engine === en.engine && state.model === n, function () {
-                state.engine = en.engine; state.model = n; syncPickers();
-              }));
-            });
+    /* ══════════ 底部抽屉组件 Sheet（引擎 / 模型 / 授权共用）══════════
+       一个实例统一负责：scrim、贴底抽屉、抓条、标题栏、可滚动内容区、层级、
+       安全区、关闭（scrim / Esc / 再点同一按钮）。调用方只写内容。
+       之前这套逻辑散在 showPick/pickRow 里、层级只有 301 —— 被 in-app 浏览器底部栏
+       和叠加元素盖住；现在收成一个组件：层级拉高、高度用 dvh 贴合真实可视区。 */
+    var Sheet = (function () {
+      var scrim = null, panel = null, bodyEl = null, titleEl = null, curAnchor = null;
+      function onKey(e) { if (e.key === 'Escape') { e.preventDefault(); close(); } }
+      function build() {
+        scrim = el('div', 'pick-scrim');
+        scrim.onclick = close;
+        panel = el('div', 'pick pick--on');
+        panel.appendChild(el('div', 'pick__grab'));
+        var head = el('div', 'pick__head');
+        titleEl = el('span', 'pick__title');
+        head.appendChild(titleEl);
+        var x = el('button', 'pick__x', '✕');
+        x.type = 'button';
+        x.setAttribute('aria-label', '关闭');
+        x.onclick = close;
+        head.appendChild(x);
+        panel.appendChild(head);
+        bodyEl = el('div', 'pick__body');
+        panel.appendChild(bodyEl);
+        document.body.appendChild(scrim);
+        document.body.appendChild(panel);
+        document.addEventListener('keydown', onKey, true);
+      }
+      function close() {
+        if (!panel) return;
+        document.removeEventListener('keydown', onKey, true);
+        panel.remove(); scrim.remove();
+        scrim = null; panel = null; bodyEl = null; titleEl = null; curAnchor = null;
+      }
+      /* 内容 API：title(text) / row({label,desc,selected,danger,keepOpen,onPick}) / back(label,fn) / node(el) */
+      function render(fn) {
+        bodyEl.innerHTML = '';
+        fn({
+          title: function (t) { titleEl.textContent = t || ''; },
+          node: function (n) { bodyEl.appendChild(n); },
+          cap: function (t) { bodyEl.appendChild(el('div', 'pick__cap', t)); },
+          row: function (o) {
+            var b = el('button', 'pick__row' + (o.danger ? ' pick__danger' : ''));
+            b.type = 'button';
+            b.setAttribute('aria-selected', String(!!o.selected));
+            b.appendChild(el('span', 'pick__ck', o.selected ? '✓' : ''));
+            var col = el('span');
+            col.appendChild(el('span', 'pick__l', o.label));
+            if (o.desc) col.appendChild(el('span', 'pick__d', o.desc));
+            b.appendChild(col);
+            if (o.chev) b.appendChild(el('span', 'pick__chev', '›'));
+            /* keepOpen：一级「引擎」行点进去要切到二级，不能先关抽屉 */
+            b.onclick = function () { if (!o.keepOpen) close(); if (o.onPick) o.onPick(); };
+            bodyEl.appendChild(b);
+          },
+          back: function (label, onBack) {
+            var b = el('button', 'pick__back');
+            b.type = 'button';
+            b.appendChild(el('span', 'pick__back__a', '←'));
+            b.appendChild(el('span', null, label));
+            b.onclick = onBack;
+            bodyEl.appendChild(b);
           }
         });
-      });
+      }
+      function open(anchor, fn) {
+        /* 同一按钮再点一次 = 收起 */
+        if (panel && curAnchor === anchor) { close(); return; }
+        close();
+        curAnchor = anchor;
+        build();
+        render(fn);
+      }
+      return { open: open, close: close, render: render };
+    })();
+
+    /* 引擎 · 模型：**省市联动**（左列引擎 · 右列该引擎的模型，选中实时联动切换）。
+       —— 不是「下钻二级」那种一列换一列；两列同屏，像省市选择器。 */
+    function openEnginePicker(anchor) {
+      Sheet.open(anchor, function (M) { engineModelCascade(M); });
+    }
+    /* 引擎/模型**落定**（点了具体模型或「默认模型」）时通知宿主。
+       宿主据此把它记成下次新建任务的默认值（移动端「我的 → 默认引擎/模型」）；
+       只点左列引擎切右列不算落定 —— 那时模型还没选，记下来会挂到旧引擎上。
+       可选回调：没给就什么都不做（PC 宿主有自己的 localStorage 口径）。 */
+    function notifyPick() {
+      if (!opts.onPick) return;
+      try { opts.onPick(state.engine, state.model); } catch (e) {}
+    }
+    function engineModelCascade(M) {
+      var all = state.engines || [];
+      var available = all.filter(function (x) { return x.ok; });
+      M.title('选择引擎 / 模型（' + available.length + ' / ' + all.length + '）');
+      if (!available.length) {
+        M.row({ label: '没有可用引擎', desc: 'magic-agent --engines 会给每个引擎的一键安装命令' });
+        return;
+      }
+      var wrap = el('div', 'pick__cols');
+      var left = el('div', 'pick__col');
+      var right = el('div', 'pick__col pick__col--r');
+      wrap.appendChild(left); wrap.appendChild(right);
+      M.node(wrap);
+
+      var cur = null;
+      available.forEach(function (en) { if (en.engine === state.engine) cur = en; });
+      if (!cur) cur = available[0];
+
+      function chooseEngine(en) {
+        cur = en;
+        var models = en.models || [];
+        state.engine = en.engine;
+        if (models.indexOf(state.model) < 0) state.model = '';
+        if (!engineSupportsPermission(en.engine)) state.permission = '';
+        syncPickers();
+        paint();
+      }
+      function paint() {
+        left.innerHTML = ''; right.innerHTML = '';
+        available.forEach(function (en) {
+          var n = (en.models || []).length;
+          var b = el('button', 'pick__citem' + (en.engine === cur.engine ? ' is-on' : ''));
+          b.type = 'button';
+          b.appendChild(el('span', 'pick__cl', en.engine));
+          b.appendChild(el('span', 'pick__cd', n ? (n + ' 个模型') : '引擎默认'));
+          b.onclick = function () { chooseEngine(en); };
+          left.appendChild(b);
+        });
+        var models = cur.models || [];
+        var d = el('button', 'pick__citem' + (state.engine === cur.engine && !state.model ? ' is-on' : ''));
+        d.type = 'button';
+        d.appendChild(el('span', 'pick__cl', '默认模型'));
+        d.appendChild(el('span', 'pick__cd', '不传 -m，由引擎自己挑'));
+        d.onclick = function () { state.engine = cur.engine; state.model = ''; syncPickers(); notifyPick(); Sheet.close(); };
+        right.appendChild(d);
+        models.forEach(function (mm) {
+          var b = el('button', 'pick__citem' + (state.engine === cur.engine && state.model === mm ? ' is-on' : ''));
+          b.type = 'button';
+          b.appendChild(el('span', 'pick__cl', mm));
+          b.onclick = function () { state.engine = cur.engine; state.model = mm; syncPickers(); notifyPick(); Sheet.close(); };
+          right.appendChild(b);
+        });
+      }
+      paint();
     }
 
     function openPermissionPicker(anchor) {
-      showPick(anchor, function (p) {
-        p.appendChild(el('div', 'pick__cap', '授权档位'));
+      Sheet.open(anchor, function (M) {
+        M.title('授权档位');
         if (!engineSupportsPermission(state.engine)) {
-          p.appendChild(el('div', 'pick__row', (state.engine || '当前引擎') + ' 不支持显式选档'));
-          p.appendChild(el('div', 'pick__d', '仅 claude / codebuddy / codebuddy-ai，会沿用 core 默认'));
+          M.row({ label: (state.engine || '当前引擎') + ' 不支持显式选档',
+                  desc: '仅 claude / codebuddy / codebuddy-ai，会沿用 core 默认' });
           return;
         }
         PERMISSION_TIERS.forEach(function (t) {
-          p.appendChild(pickRow(t.label, t.hint, (state.permission || '') === t.v, function () {
-            state.permission = t.v; syncPickers();
-          }, t.v === 'full'));
+          M.row({
+            label: t.label, desc: t.hint, danger: t.v === 'full',
+            selected: (state.permission || '') === t.v,
+            onPick: function () { state.permission = t.v; syncPickers(); }
+          });
         });
       });
     }
 
+    /* ══════════ 续传：按 ask 缓冲补齐（断线重连 / 打开运行中会话共用）══════════
+       ⚠️ 游标只能是 `state.lastSeq`（**本轮流 seq**，每轮从 1）。会话日志里的 seq 是
+       文件级跨轮接号的（internal/cli/sessionlog.go 的 openFile 会接着最大 seq 编号），
+       两套口径对不上 —— 拿日志 seq 当游标续拉会错位（多补一整轮或一条都不补）。
+
+       h.onEnd(reason, code, incomplete) 只回调一次，reason ∈
+         done        服务端说这轮结束了（终态事件已在本次 events 里画过）
+         closed      补拉期间终态已由别处落定（state.qaClosed）
+         missing     404 / 连续失败：服务端没保留这轮，补不到了
+         unreachable 连续 40 次网络失败
+         timeout     10 分钟还没等到终态
+         stopped     被取消（换会话 / 开新轮）—— 调用方只需收摊，不要报错 */
+    function tailAsk(runID, h) {
+      h = h || {};
+      var tries = 0, backoff = 600, incomplete = false, stopped = false, timer = 0;
+      var deadline = Date.now() + 10 * 60 * 1000;
+      var cancel = function () { stop('stopped', null); };
+      var stop = function (reason, code) {
+        if (stopped) return;
+        stopped = true;
+        if (timer) { clearTimeout(timer); timer = 0; }
+        /* 只清自己挂上去的钩子：新轮可能已经把自己的 cancel 换进来了，别误清。 */
+        if (state.resumeStop === cancel) state.resumeStop = null;
+        try { if (h.onEnd) h.onEnd(reason || 'stopped', code, incomplete); } catch (e) {}
+      };
+      state.resumeStop = cancel;
+      var poll = function () {
+        if (stopped) return;
+        if (state.qaClosed) return stop('closed', null);
+        if (Date.now() > deadline) return stop('timeout', null);
+        var p;
+        try { p = transport.askEvents(runID, state.lastSeq || 0); }
+        catch (e) { p = Promise.reject(e); }
+        Promise.resolve(p).then(function (res) {
+          tries = 0;
+          if (!res || !Array.isArray(res.events)) throw new Error('events 载荷不合法');
+          /* 游标落在服务端裁剪窗口之前：中间事件已丢，补出来的是残卷。 */
+          if (res.snapshotRequired) incomplete = true;
+          res.events.forEach(function (ev) {
+            try {
+              /* 宿主已经用别处的来源画过的事件（如日志里重放过的用户提问）在这里跳过，
+                 见 attachRunningAsk 的 alreadyRenderedUser。 */
+              if (h.skipEvent && h.skipEvent(ev)) return;
+              render(ev);
+            } catch (e) {}
+          });
+          if (stopped) return;
+          if (state.qaClosed) return stop('closed', null);
+          if (res.done) return stop('done', res.code);
+          timer = setTimeout(poll, 1000);            // 还在跑：继续等增量
+        }).catch(function (e) {
+          if (stopped) return;
+          /* 404 = 服务端没保留这轮（已过保留期，或网关还是旧版没这个接口）——
+             再重试也不会有，直接收尾，别让用户干等几分钟。 */
+          if (e && e.status === 404) return stop('missing', null);
+          tries++;
+          if (tries > 40) return stop('unreachable', null);
+          backoff = Math.min(8000, backoff * 2);
+          timer = setTimeout(poll, backoff);
+        });
+      };
+      poll();
+      return { stop: function () { stop('stopped', null); } };
+    }
+
+    /* 本进程里挂在 `sid` 上的运行中轮次（多条取 started 最晚的那条）。
+       服务端没给 session（旧版 / 新会话尚未拿到 session_id）→ 认不出来，返回 null。 */
+    function runningAskOf(asks, sid) {
+      if (!Array.isArray(asks) || !sid) return null;
+      var best = null, bestT = -Infinity;
+      asks.forEach(function (a) {
+        if (!a || !a.id) return;
+        /* 会话 id 可能是 session_id，也可能是 run_id（引擎整轮不吐 session_id 时
+           登记表里只有 run_id，客户端列表也用 run_id 当 id，见 mobile 的 sidOf）。
+           a.session 与 a.run 都要比。 */
+        if (a.session !== sid && a.run !== sid) return;
+        var t = Date.parse(String(a.started || ''));
+        if (!isFinite(t)) t = 0;
+        if (!best || t >= bestT) { best = a; bestT = t; }
+      });
+      return best;
+    }
+
+    /* 日志里最后一轮的用户提问在哪、有没有收尾。
+       打开一条**还在跑**的会话时，这一轮「提问之后」的事件不能从日志重放：
+       日志可能还没 flush（1s 一批）、且它的 seq 与 ask 缓冲不同口径 ——
+       只重放到这条 user 为止，其余交给 ask 缓冲从 0 补齐。 */
+    function lastTurnInfo(events) {
+      var idx = -1;
+      for (var i = 0; i < events.length; i++) {
+        var k = events[i] && (events[i].kind || events[i].type);
+        if (k === 'user') idx = i;
+      }
+      var terminal = false;
+      for (var j = idx + 1; j < events.length; j++) {
+        var k2 = events[j] && (events[j].kind || events[j].type);
+        if (k2 === 'turn_end' || k2 === 'turn_failed' || k2 === 'result' || k2 === 'error' || k2 === 'end') { terminal = true; break; }
+      }
+      return { index: idx, terminal: terminal, at: idx >= 0 ? replayAt(events[idx]) : 0 };
+    }
+
+    /* 补拉路径的收口：内核的统一收尾（qaRunEnd = finish + 摘「生成中」胶囊）之后
+       再补收尾行。为什么不能只调 kernelDone：内核的 `result` 分支**不收尾**
+       （实时流靠网关的 SSE `end` 帧收尾），而 ask 缓冲里只有 core 的 stdout 行 ——
+       llm 这类整轮只吐 `result` 的引擎补到最后也等不到 end 帧，
+       胶囊会永久钉在画布上（2026-10-20 真机实测「llm · 生成中」与「已完成」同屏）。 */
+    function closeAttached(ok, label) {
+      var q = state.qa;
+      if (!q || !q.h) return;
+      if (turnArts) { try { turnArts.flush(q.h); } catch (e0) {} }   // 补挂产物要在拆卡之前
+      try {
+        if (typeof qaRunEnd === 'function') qaRunEnd(q.h);
+        else if (typeof q.h.finish === 'function') q.h.finish();
+      } catch (e) { /* 封口失败不影响收尾行 */ }
+      kernelDone(ok, label);
+    }
+
+    /* 把画面接回一条**还在跑**的轮次（2026-10-20 用户：「切回来还是没好」）。
+       打开会话时若发现同会话的轮次仍在跑：历史只回放到那条 user，这里从 ask 缓冲
+       `after=0` 补齐并持续增量补拉，直到终态；同时置 busy（拦住误发新消息）。
+
+       alreadyRenderedUser：那条 user 已经由日志重放画过了（loadHistory 的 partial 分支）。
+       网关从 2026-10-20 起会在缓冲头合成一条 `type:"user"`（core 的事件流里没有这条），
+       不跳过它这一轮就会出现两个用户气泡。旧网关没有这条合成事件 —— 跳过逻辑等不到它，
+       什么也不影响。 */
+    function attachRunningAsk(run, t0, alreadyRenderedUser) {
+      if (!run || !run.id || typeof transport.askEvents !== 'function') return false;
+      if (state.busy && state.askId === run.id) return false;   // 已经在看这条流了
+      var runID = run.id;
+      var pendingUser = !!alreadyRenderedUser;
+      state.askId = runID;
+      state.busy = true;
+      setSendMode('busy');
+      state.qaClosed = false;
+      state.renderedSeq = {};        // 每轮从 1：这是新的一轮，别拿上一轮的 seq 判重
+      state.lastSeq = 0;             // 缓冲里这一轮的事件从头补
+      state.resumeT0 = t0 || 0;      // 收尾耗时从日志里那条 user 的 `at` 起算
+      setWorking();
+      if (opts.onBusy) { try { opts.onBusy(true); } catch (e) {} }
+      tailAsk(runID, {
+        skipEvent: function (ev) {
+          if (!pendingUser || !ev || (ev.type || ev.kind) !== 'user') return false;
+          pendingUser = false;
+          return true;
+        },
+        onEnd: function (reason, code, incomplete) {
+          /* 已被新一轮接管（用户在这期间发了消息）：这一轮的收摊不归这里管。 */
+          if (state.askId && state.askId !== runID) return;
+          clearWorking();
+          state.busy = false;
+          state.askId = null;
+          state.resumeT0 = 0;
+          setSendMode('idle');
+          if (opts.onBusy) { try { opts.onBusy(false); } catch (e) {} }
+          if (reason === 'stopped' || reason === 'closed') return;
+          if (reason === 'done') {
+            /* 补到终态的引擎（turn_end / error）已由内核自己封口；llm 这类只有 result
+               的引擎在这里兜底，否则底部会永远留着「生成中」胶囊和「Agent 运行中」。 */
+            if (!state.qaClosed && state.qa && state.qa.h) {
+              closeAttached(code === 0 || code == null, '已完成');
+            }
+            return;
+          }
+          /* 补不到了：如实说，并把还挂着的那一笔封口（否则「生成中」一直转）。 */
+          if (reason === 'timeout') noticeItem('补拉超时，回复可能不完整，请刷新会话');
+          else if (reason === 'unreachable') noticeItem('连接中断且无法续传，请刷新会话');
+          else noticeItem('无法续传本轮事件（服务端未保留），回复可能不完整');
+          if (!state.qaClosed && state.qa && state.qa.h) {
+            closeAttached(false, '连接中断 · 回复可能不完整');
+          } else if (incomplete) {
+            noticeItem('部分过程事件已丢失，回复可能不完整');
+          }
+        }
+      });
+      return true;
+    }
+
+    /* 相邻 thinking 分片并成一条（只并相邻；用数组攒再 join，别用 text += 逐片拼）。 */
+    function mergeThinkDeltas(list) {
+      var out = [];
+      for (var i = 0; i < list.length; i++) {
+        var ev = list[i];
+        if (ev && ev.kind === 'thinking' && list[i + 1] && list[i + 1].kind === 'thinking') {
+          var parts = [String(ev.text == null ? '' : ev.text)];
+          var j = i + 1;
+          while (j < list.length && list[j] && list[j].kind === 'thinking') {
+            parts.push(String(list[j].text == null ? '' : list[j].text));
+            j++;
+          }
+          var merged = {};
+          for (var k in ev) { if (Object.prototype.hasOwnProperty.call(ev, k)) merged[k] = ev[k]; }
+          merged.text = parts.join('');
+          out.push(merged);
+          i = j - 1;
+        } else {
+          out.push(ev);
+        }
+      }
+      return out;
+    }
+    /* ── 历史分页（2026-10-20 用户：「默认加载最近的一轮用户和回复即可」「滚一下至少也要
+       补一轮回话 不是只补几个子过程」）──
+       服务端 `?before=N&limit=M` 反向分页：N = 从文件尾跳过多少条（不是 seq），并保证一页
+       至少含一个轮次起点（user，见 internal/session/sessionlog.go 的 alignTo）。这里首屏再
+       **自己裁到最后一个 user**，于是「默认只画最近一轮」不依赖 limit 恰好等于一轮长度。
+       相邻页都从 user 起头 ⇒ 前插不会把同一轮切成两半（PC 那边的 qaConvJoinTurn 因此不需要）。
+       旧服务端不认识 before → 返回全量且**没有 more 字段**，据此退回整份回放、不出入口。 */
+    var HIST_PAGE = 200;       // 一页事件数（服务端还会往前凑到轮次起点）
+    var HIST_MAX_PAGES = 6;    // 超长单轮（一页全是思考/工具）：首屏最多往回捞几页
+
+    function histHasMore(r) { return !!r && Object.prototype.hasOwnProperty.call(r, 'more'); }
+    function readHistPage(sid, before) {
+      return Promise.resolve(transport.readSession(sid, { before: before, limit: HIST_PAGE }));
+    }
+    /** 一串事件里最后一条用户提问的下标（没有回 -1）。 */
+    function lastUserIdx(list) {
+      for (var i = list.length - 1; i >= 0; i--) {
+        var k = list[i] && (list[i].kind || list[i].type);
+        if (k === 'user') return i;
+      }
+      return -1;
+    }
+    /* 首屏：从文件尾取一页。页内找不到 user 说明这一轮长到一页装不下（页上限被 maxTurnPage
+       截断）—— 继续往前捞，最多 HIST_MAX_PAGES 页；仍没有就整页显示（入口照留）。 */
+    function histFirstPage(sid) {
+      var older = [], pages = [], before = 0, tried = 0;
+      function step() {
+        return readHistPage(sid, before).then(function (r) {
+          if (!histHasMore(r)) return { events: (r && r.events) || [], legacy: true };
+          var evs = (r && r.events) || [];
+          tried++;
+          /* pages 按「旧 → 新」排列：页首是该页最老的一条，nextBefore 是它的绝对游标 +1。 */
+          pages.unshift({ nextBefore: Number(r.nextBefore) || 0, len: evs.length, more: !!r.more });
+          older = evs.concat(older);
+          var keep = lastUserIdx(older);
+          if (keep >= 0 || !r.more || tried >= HIST_MAX_PAGES) {
+            return { events: older, pages: pages, keep: keep };
+          }
+          before = Number(r.nextBefore) || 0;
+          if (!before) return { events: older, pages: pages, keep: keep };
+          return step();
+        });
+      }
+      return step();
+    }
+    /* 把「从 keep 起才画」翻译成下一页的游标：
+       before = 页首绝对游标 − 页内偏移（页内相邻事件的游标严格递减 1，见 sessionlog.go 的 dist）。 */
+    function histCursor(r, keep) {
+      var pages = r.pages || [];
+      var acc = 0;
+      for (var i = 0; i < pages.length; i++) {
+        var pg = pages[i];
+        if (keep < acc + pg.len) {
+          return { before: Math.max(0, pg.nextBefore - (keep - acc)), more: i > 0 || keep > acc || pg.more };
+        }
+        acc += pg.len;
+      }
+      return { before: 0, more: false };
+    }
+    /* ── 读历史时的页面 loading（2026-10-20 用户：「要页面 loading 的水平垂直居中的那种效果」
+       →「要撑满宽高」→「要更有创意 使用掌天瓶填充绿液作为加载效果」）──
+       从点开一条会话到第一屏真正画出来之间，是**纯等网络**的空窗：反向分页要往返 1～3 次，
+       超大日志还要多捞几页（HIST_MAX_PAGES）。此前这段时间画布是空的，用户只看到顶栏标题
+       变了、下面一片白，分不清「正在读」「这条会话是空的」「加载挂了」。
+       形态：**整块画布居中的一枚掌天瓶，绿液缓缓涨起来**（图形见上面的 bottleSVG）。
+       为什么是瓶而不是转环/骨架：这个产品就叫掌天瓶，「灌绿液」既是品牌动作，也真的读得出
+       「在往里装东西」—— 比一枚通用转环多一层「装的是这条会话的历史」的意思。
+       绿液**不确定进度**（不知道还要读几页），所以是无限循环的涨落，涨满→回落，不假装百分比。
+       只在**首载**（after == null）出现，且三种情况都会撤：
+         · 第一条事件真画出来（render 包装里 endHistLoading(false)）；
+         · 读完是空会话 / 读失败（loadHistory 收尾 endHistLoading(true) → 空态那句还回去）。
+       140ms 内就回来的（本地小会话）根本不亮，避免「刚出现就消失」的抖动。
+       ⚠️ 动画只动 transform / opacity（见 conversation.css）：回放大日志会占死主线程，
+          动 layout 的属性会让这一屏跟着冻住，看上去就像「卡在读取」。 */
+    var histLoading = null;         // loading 节点（懒建：没读过历史就不建）
+    var histLoadingWant = false;    // 这一轮首载还没结束
+    var histLoadingTimer = 0;       // 「140ms 还没回来才显示」的定时器
+    function histLoadingNode() {
+      if (histLoading) return histLoading;
+      var n = el('div', 'conv__loading');
+      n.setAttribute('role', 'status');
+      n.setAttribute('aria-live', 'polite');
+      n.setAttribute('aria-busy', 'true');
+      var stage = el('div', 'conv__loading__bottle');
+      /* fill .55：液面停在腹部偏上 —— 不空（看得出是绿液）也不满（满瓶就该收工了）。
+         涨落由 CSS 的 qbRise 叠在上面（±8px），见 conversation.css。 */
+      stage.appendChild(bottleSVG({ fill: 0.68, anim: 'hist' }));
+      n.appendChild(stage);
+      n.appendChild(el('div', 'conv__loading__label', '正在读取会话历史…'));
+      histLoading = n;
+      return n;
+    }
+    function showHistLoading() {
+      var n = histLoadingNode();
+      /* 空态那句「还没有事件」先让位：两条同时出现会被读成「历史就是空的，还读什么」。 */
+      if (empty && empty.parentNode) empty.parentNode.removeChild(empty);
+      /* 常驻第二个孩子（紧跟「加载更早」入口）—— 内容一律往画布尾追加，它自然在最上面。 */
+      if (!n.parentNode) threadEl.insertBefore(n, moreBtn.nextSibling || null);
+    }
+    function endHistLoading(restoreEmpty) {
+      histLoadingWant = false;
+      if (histLoadingTimer) { clearTimeout(histLoadingTimer); histLoadingTimer = 0; }
+      if (histLoading && histLoading.parentNode) histLoading.parentNode.removeChild(histLoading);
+      /* 一条事件都没画出来（空会话 / 读失败）→ 把空态还回去；有内容时别塞（会被当成新会话引导）。 */
+      if (restoreEmpty && empty && !empty.parentNode &&
+          !threadEl.querySelector('.qa-msg, .qa-hist-note')) threadEl.appendChild(empty);
+    }
+    function beginHistLoading() {
+      histLoadingWant = true;
+      if (histLoadingTimer) return;                 // 已在计时：别把上一拍的延时越攒越长
+      histLoadingTimer = setTimeout(function () {
+        histLoadingTimer = 0;
+        if (histLoadingWant) showHistLoading();
+      }, 140);
+    }
+
     function loadHistory(sid, after) {
       if (!sid) return Promise.resolve(0);
-      return Promise.resolve(transport.readSession(sid, after == null ? {} : { after: after }))
-        .then(function (r) {
-          var events = (r && r.events) || [];
-          events.sort(function (a, b) { return Number(a.seq || 0) - Number(b.seq || 0); });
-          events.forEach(function (ev) { try { render(ev); } catch (e) { /* 单条坏事件吞掉 */ } });
-          var t = thread(); t.scrollTop = t.scrollHeight;
-          return events.length;
+      if (after == null) beginHistLoading();
+      /* 打开会话时**并行**问两件事：日志 + 本进程有没有挂在同一会话上的运行中轮次。
+         后者决定历史回放到哪（见 lastTurnInfo）；拉不到就当没有 ——
+         旧网关没有 /desk/asks，不能因为它让历史打不开。 */
+      var asksP = (after == null && typeof transport.listAsks === 'function')
+        ? Promise.resolve().then(function () { return transport.listAsks(); }).catch(function () { return []; })
+        : Promise.resolve([]);
+      /* after != null 是增量续读（老调用方），维持原样；首载走反向分页。 */
+      var firstP = after == null
+        ? histFirstPage(sid)
+        : Promise.resolve(transport.readSession(sid, { after: after }));
+      var done = Promise.all([firstP, asksP]).then(function (rs) {
+        var r = rs[0];
+        var events = (r && r.events) || [];
+        /* ⚠️ **不按 seq 排序**（2026-10-16）：日志是跨轮追加的，老日志里每轮的 seq
+           都从 1 重来（每轮一个新 core 进程），按 seq 排会把各轮事件**交错**在一起
+           （所有 seq=1 的排前面…）。文件本身的顺序就是时间顺序 —— 直接照它渲染。
+           新核心已把 seq 改成跨轮接号（见 cli/sessionlog.go 的 openFile），
+           所以这里排不排都不影响新数据。 */
+        /* 首载只画最近一轮：裁到页面里最后一个 user。没有 user（日志本来就没有提问）
+           或旧服务端 → 原样全画。 */
+        var hist = null;
+        if (after == null && r && !r.legacy) {
+          var keep = typeof r.keep === 'number' ? r.keep : lastUserIdx(events);
+          if (keep > 0) {
+            events = events.slice(keep);
+          } else if (keep < 0) {
+            keep = 0;
+          }
+          hist = histCursor(r, keep);
+        }
+        /* ⚠️ 回放标记（2026-10-12）：回放**不走 seq 去重**（见 render 开头那段）——
+           日志是跨轮追加的，老日志里每轮的 seq 都从 1 重来，去重会把第二轮起的事件当成
+           重复帧全丢掉。打了这个标，render 那边就跳过 seq 判重。 */
+        var run = runningAskOf(rs[1], sid);
+        var info = lastTurnInfo(events);
+        /* 有运行中的同会话轮次、且日志里那一轮还没收尾 → 只重放到那条 user（含），
+           提问之后的助手侧内容一律交给 ask 缓冲补齐（日志可能落后 / seq 口径不同）。 */
+        var partial = !!(run && info.index >= 0 && !info.terminal);
+        state.replay = true;
+        state.replayT0 = 0; state.replayLastAt = 0;
+        try {
+          var replayList = events.slice(0, partial ? info.index + 1 : events.length);
+          /* 相邻思考增量先并成一段再喂（2026-10-20 用户：「移动端加载也很慢」）：
+             日志是按流式增量落盘的，一条长会话实测 95838 条事件里 94015 条是
+             ~3 字符的 thinking 分片 —— 逐条 render 要 16s、主线程整段占死。
+             思考区本来就是「一段连续 thinking 一块」（见 03-chat-message），
+             合并后画出来的内容完全相同。服务端 `?lean=1` 已做过同一刀，
+             这里兜底旧服务端（它不认识 lean）。
+             ⚠️ 只并**相邻**的，中间夹了别的 kind 就断开。 */
+          replayList = mergeThinkDeltas(replayList);
+          replayList.forEach(function (ev) {
+            try { render(ev); } catch (e) { /* 单条坏事件吞掉 */ }
+          });
+          /* 日志尾部没有终态事件（那一轮被中断）→ 把最后一轮也封口，
+             否则底部会永远留着一枚「生成中」胶囊。
+             续传中的那一轮**不封**：它的收尾由 ask 缓冲的终态事件落定。 */
+          if (!partial) finishReplayRound();
+        } finally { state.replay = false; }
+        var t = thread(); t.scrollTop = t.scrollHeight;
+        /* 打开 / 切换会话 = 从底部开始看：把内核的「用户离开底部」闸复位（见 qaScrollReset）。 */
+        if (typeof qaScrollReset === 'function') { try { qaScrollReset(); } catch (e) {} }
+        state.autoFollow = true;
+        /* 分页游标落定后才显示入口（旧服务端 hist = null → 不显示，行为与改动前一致）。 */
+        state.hist = after == null ? hist : state.hist;
+        syncMore();
+        /* partial 时那条 user 已由上面的日志重放画过 → 让 attach 跳过网关合成的同一条。 */
+        if (run) attachRunningAsk(run, info.at, partial);
+        /* 首载结束：骨架屏撤下。一条都没画出来（空会话）→ 把空态那句还回去。
+           ⚠️ 期间用户可能已经切走（迟到的这一份不许撤新会话的骨架屏）。 */
+        if (after == null && sid === state.session) endHistLoading(true);
+        return events.length;
+      });
+      /* 读失败也要撤骨架屏（否则它会一直挂着，看着像永远读不完）。 */
+      return done.catch(function (e) {
+        if (after == null && sid === state.session) endHistLoading(true);
+        throw e;
+      });
+    }
+
+    /** 顶上「加载更早」入口的显隐与文案（入口本身是画布的第一个孩子，见 clearThread）。 */
+    function syncMore() {
+      if (!moreBtn) return;
+      var h = state.hist;
+      var show = !!(h && (h.more || h.loading));
+      moreBtn.hidden = !show;
+      if (!show) return;
+      moreBtn.textContent = h.loading ? '正在加载更早的消息…' : '向上滚动加载更早的消息';
+      moreBtn.classList.toggle('conv__more--wait', !!h.loading);
+      if (!moreBtn.parentNode) threadEl.insertBefore(moreBtn, threadEl.firstChild);
+    }
+
+    /* 前插一页（PC 宿主同款做法，见 magic-test/src/js/27-conv-log.js 的 qaConvPrepend）：
+       ① 现有内容整体摘进 fragment（顺序不变）；② 用同一套 render 把这一页画进空画布；
+       ③ 旧内容接回去；④ scrollTop += 新增高度 —— 用户正看着的那一行因此停在原地。 */
+    function prependPage(evs) {
+      var t = thread();
+      var prevTop = t.scrollTop, prevH = t.scrollHeight;
+      var frag = document.createDocumentFragment();
+      Array.prototype.slice.call(t.childNodes).forEach(function (n) {
+        if (n !== moreBtn) frag.appendChild(n);
+      });
+      state.replay = true;
+      state.replayT0 = 0; state.replayLastAt = 0;
+      state.qaClosed = false;      // 历史轮次要先能开新的一笔
+      try {
+        mergeThinkDeltas(evs).forEach(function (ev) {
+          try { render(ev); } catch (e) { /* 单条坏事件吞掉 */ }
         });
+        /* 页尾通常切在同一轮中间（页首才是 user，见 histCursor）→ 封口，
+           否则最后一笔会一直挂着「生成中」胶囊；整轮完整时这里已是空操作。 */
+        finishReplayRound();
+      } finally { state.replay = false; }
+      t.appendChild(frag);
+      /* 别让内核把这个动作当成「有新内容」把画面拽回底部（qaUserAway 是它的滚动闸）。 */
+      if (typeof qaUserAway !== 'undefined') { try { qaUserAway = true; } catch (e) {} }
+      state.autoFollow = false;
+      t.scrollTop = prevTop + (t.scrollHeight - prevH);
+      syncBottomBtn();
+    }
+
+    /** 上翻一页（服务端保证页首是本轮 user ⇒ 「滚一下至少补一轮回话」）。 */
+    function loadMore() {
+      var h = state.hist;
+      var sid = state.session;
+      if (!sid || !h || h.loading || !h.more) return Promise.resolve(false);
+      /* 正在看一条运行中的轮次：前插会打乱实时事件的落笔位置，等它收尾再翻。 */
+      if (state.busy) return Promise.resolve(false);
+      h.loading = true;
+      syncMore();
+      /* 一页装不下一整轮时（实测一条会话有 5000 条思考/工具的分页上限），服务端只能给出
+         从轮中间起头的一页 —— 这时继续往前要，直到页首落在 user 上再一次性前插：
+         否则滚一下只多出半截子过程，正是用户说的「看着像滚了没反应」。 */
+      var acc = [], cursor = h.before, more = h.more, pages = 0;
+      function step() {
+        return readHistPage(sid, cursor).then(function (r) {
+          if (sid !== state.session || state.hist !== h) return { stop: true };
+          if (!histHasMore(r)) { more = false; return { stop: true }; }   // 服务端退回旧版（正常不该发生）
+          var evs = (r && r.events) || [];
+          if (!evs.length) { more = false; return { stop: true }; }
+          acc = evs.concat(acc);
+          pages++;
+          cursor = Number(r.nextBefore) || 0;
+          more = !!r.more;
+          var head = acc[0] && (acc[0].kind || acc[0].type);
+          if (head === 'user' || !more || !cursor || pages >= HIST_MAX_PAGES) return { stop: true };
+          return step();
+        });
+      }
+      return step().then(function (res) {
+        if (sid !== state.session || state.hist !== h) return false;
+        if (!acc.length) { h.more = more; return false; }
+        prependPage(acc);
+        h.before = cursor;
+        h.more = more;
+        return true;
+      }).catch(function (e) {
+        noticeItem('加载更早的消息失败：' + (e && e.message ? e.message : e));
+        return false;
+      }).then(function (ok) {
+        h.loading = false;
+        if (state.hist === h) syncMore();
+        return ok;
+      });
+    }
+
+    /* ══════════ 停留期发现新轮次（轻量版）══════════
+       详情页打开时只 loadHistory 一次（一次性快照）。如果这时 PC 端（或另一个窗口）
+       在**同一个会话**里另起了一轮，本页没有任何触发，画面就停在上轮、只能退出重进
+       （2026-10-20 报障：「pc端新的追问 在移动端是不显示的」）。
+
+       这里每 5s 问一次本进程的运行中轮次（/desk/asks，只比 session / run，不拉事件）：
+       发现同会话有 run、而本页没接上它 → 清画布重跑 loadHistory（它回放日志到那条
+       user，再由 attachRunningAsk 接 ask 缓冲继续流）。
+       - 后台页不跑：省电，也避免用户切回来时和 setSession 的那次加载打架。
+       - busy 一律不打扰：本页正在看一轮（本地发的 / 已 attach 的）时，收尾归它自己管。
+       - 网关旧版没有 /desk/asks → 静默，行为与改动前完全一致。 */
+    var WATCH_MS = 5000;
+    var watchTimer = 0, watchInflight = false, watchSeen = '';
+    function stopWatch() {
+      if (watchTimer) { clearInterval(watchTimer); watchTimer = 0; }
+      watchSeen = '';
+      watchInflight = false;
+    }
+    function watchTick() {
+      var sid = state.session;
+      if (!sid || state.busy || watchInflight) return;
+      if (typeof document !== 'undefined' && document.visibilityState && document.visibilityState !== 'visible') return;
+      if (typeof transport.listAsks !== 'function') return;
+      watchInflight = true;
+      Promise.resolve().then(function () { return transport.listAsks(); }).then(function (asks) {
+        /* 期间换了会话：这一拍作废（新会话有自己的加载与轮询）。 */
+        if (sid !== state.session || state.busy) return;
+        var run = runningAskOf(asks, sid);
+        /* 同一条 run 只刷一次：接不上（旧网关缺 askEvents）时别每 5s 重画一遍。 */
+        if (!run || watchSeen === run.id) return;
+        watchSeen = run.id;
+        clearThread();
+        threadEl.appendChild(empty);
+        state.askId = null;
+        state.renderedSeq = {};
+        return loadHistory(sid).catch(function () { /* 读不到就等下一拍 */ });
+      }).catch(function () { /* 网络抖动 / 旧网关：静默 */ })
+        .then(function () { if (sid === state.session) watchInflight = false; });
+    }
+    function startWatch() {
+      stopWatch();
+      if (!state.session) return;
+      watchTimer = setInterval(watchTick, WATCH_MS);
     }
 
     function syncPickers() {
@@ -1087,6 +1656,9 @@
         chip.title = engineSupportsPermission(state.engine) ? t.hint
           : (state.engine || '当前引擎') + ' 不支持显式选授权档位（仅 claude / codebuddy / codebuddy-ai），会沿用 core 默认';
       }
+      /* 选择器是状态变化最集中的出口（换引擎 / 换模型 / 拉到清单 / 切入历史会话都经过它）——
+         顺手把内核要读的那几个值同步到 window（见下面的 syncHostState）。 */
+      syncHostState();
     }
 
     /* ══════════ 搭 DOM ══════════
@@ -1094,17 +1666,41 @@
        都指向它）—— 所以**不再套内层 wrapper**，宽屏居中靠 CSS 的对称 padding。 */
     var wrap = el('div', 'conv');
     var threadEl = el('div', 'conv__thread');
+    /* ⚠️ 这块容器就是**内核的画布**：内核那批函数按 `#qa-stream` 找地方落笔
+       （qaRenderMine / qaScrollIntoView / 收尾行），所以 id 必须叫这个，
+       而且**一页只能有一个** —— 宿主页里那份独立的 #qa-stream 已随之撤掉（块②后半）。 */
+    threadEl.id = 'qa-stream';
     ctx.thread = threadEl;
+    /* 「加载更早」入口：画布的**常驻第一个孩子**（内核只往尾部追加，不会碰它）。
+       默认藏起来，首屏分页拿到 `more` 后由 syncMore 亮出来；clearThread 清空画布后补回。 */
+    var moreBtn = el('button', 'conv__more');
+    moreBtn.type = 'button';
+    moreBtn.hidden = true;
+    moreBtn.textContent = '向上滚动加载更早的消息';
+    moreBtn.addEventListener('click', function () { loadMore(); });
+    threadEl.appendChild(moreBtn);
     wrap.appendChild(threadEl);
     /* 组件内不需要「回到底部」按钮，留个游离节点承接保留段落里的赋值，不让它报错 */
     ctx.bottomBtn = el('span', 'tobottom');
 
     var form = el('form', 'composer');
     var cbox = el('div', 'composer__box');
+    /* 提问卡的**停靠位**：内核按固定 id 找它（`home-askdock`，见 shared/conv/06-ask-answer.js），
+       引擎提问 / 待授权时卡钉在输入框上方。显隐与进出全由内核管，这里只给一块地。 */
+    var askDock = el('div', 'qa-askdock'); askDock.id = 'home-askdock'; askDock.hidden = true;
+    cbox.appendChild(askDock);
+    var attachBar = el('div', 'attachbar'); attachBar.hidden = true;
+    ctx.attachBar = attachBar;
+    cbox.appendChild(attachBar);
     ctx.input = el('textarea'); ctx.input.rows = 1; ctx.input.placeholder = '回复 Agent';
     cbox.appendChild(ctx.input);
     var crow = el('div', 'composer__row');
     var cleft = el('div', 'composer__left');
+    if (opts.showAttach) {
+      ctx.attachBtn = el('button', 'iconbtn'); ctx.attachBtn.type = 'button'; ctx.attachBtn.setAttribute('aria-label', '添加');
+      ctx.attachBtn.appendChild(svgIcon('i-plus', 18));
+      cleft.appendChild(ctx.attachBtn);
+    }
     var casc = el('button', 'casc');
     casc.type = 'button';
     casc.appendChild(svgIcon('i-cpu', 14));
@@ -1117,11 +1713,30 @@
     ctx.permBtn.type = 'button';
     ctx.permBtn.appendChild(svgIcon('i-set', 14));
     ctx.permBtn.appendChild(el('span', null, '授权 · 沿用默认'));
-    cleft.appendChild(casc); cleft.appendChild(ctx.permBtn);
+    /* 参数行（引擎 · 模型 + 授权档位）**浮在输入框整个上方**，不属于那个圆角框
+       （2026-10-20 用户定稿 B 方案）。原来它们与 ＋ / 发送挤在同一行，`.casc` 只能分到
+       280px 里的一半，引擎名和模型名各被截一半。现在整行宽度都是它们的，且框内只剩
+       输入与动作。 */
+    var trow = el('div', 'composer__tools');
+    trow.appendChild(casc);
+    if (opts.showPermission !== false) trow.appendChild(ctx.permBtn);
+    /* 「生成中」提示行（2026-10-20 用户：「两个胶囊合并成1个 在下面显示生成中效果即可」）：
+       画布底部内核那枚「引擎 · 模型 · 生成中」胶囊，与本行这枚「引擎 · 模型」胶囊
+       显示的是同一串字、上下挨着，像同一件事说了两遍 → 画布那枚在本壳**不画**
+       （皮肤见 conversation.css 的 .conv__thread .qa-run）；「这一轮在跑」改由
+       这枚胶囊**下面**这一行小字表达（转圈 + 「生成中」）。
+       ⚠️ 引擎·模型的真值仍在 .casc 上：降级换模型时 'start' 事件会改写它
+       （见 kernelApply 的 'start' 分支 → syncPickers），所以不丢信息。 */
+    var genRow = el('div', 'composer__gen');
+    genRow.appendChild(el('span', 'composer__gen__sp'));
+    genRow.appendChild(el('span', 'composer__gen__t', '生成中'));
+    ctx.genRow = genRow;
     ctx.sendBtn = el('button', 'sendbtn');
     ctx.sendBtn.type = 'submit';
     crow.appendChild(cleft); crow.appendChild(ctx.sendBtn);
     cbox.appendChild(crow);
+    form.appendChild(trow);
+    form.appendChild(genRow);
     form.appendChild(cbox);
     wrap.appendChild(form);
     root.appendChild(wrap);
@@ -1131,17 +1746,26 @@
     threadEl.appendChild(empty);
 
     /* ══════════ 接线 ══════════ */
-    threadEl.addEventListener('click', function (ev) {
-      var t = ev.target && ev.target.closest ? ev.target.closest('[data-copy-idx]') : null;
-      if (t) doCopy(copyBin[Number(t.getAttribute('data-copy-idx'))]);
+    /* 代码块与工具明细的复制按钮、提问卡选项、思考块折叠……这些点击**全部**走内核那份委托
+       （`shared/conv/07-stream-delegation.js` 的 bindQaStreamDelegation，在下面挂桥那段绑一次）。
+       本文件不再挂自己的画布委托 —— 节点随快照重建也不会失效。 */
+    threadEl.addEventListener('scroll', function () {
+      state.autoFollow = nearBottom();
+      syncBottomBtn();
+      /* 滚到顶再往上 = 翻页（页首对齐到 user，见 loadMore）。 */
+      if (threadEl.scrollTop <= 8) loadMore();
     });
-    threadEl.addEventListener('scroll', function () { state.autoFollow = nearBottom(); syncBottomBtn(); });
+    /* 内容不足一屏时没有 scroll 事件，只能靠滚轮方向兜住「想往上翻」这个动作。 */
+    threadEl.addEventListener('wheel', function (e) {
+      if (e.deltaY < 0 && threadEl.scrollHeight <= threadEl.clientHeight + 8) loadMore();
+    }, { passive: true });
     ctx.input.addEventListener('input', autoGrow);
     form.addEventListener('submit', function (e) { e.preventDefault(); send(); });
     ctx.input.addEventListener('keydown', function (e) {
       if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) { e.preventDefault(); send(); }
     });
     casc.addEventListener('click', function (e) { e.stopPropagation(); openEnginePicker(casc); });
+    if (ctx.attachBtn) ctx.attachBtn.addEventListener('click', function (e) { e.stopPropagation(); openAttachSheet(ctx.attachBtn); });
     ctx.permBtn.addEventListener('click', function (e) { e.stopPropagation(); openPermissionPicker(ctx.permBtn); });
     ctx.sendBtn.addEventListener('click', function (e) {
       if (!state.busy) return;          // 空闲时照常 submit
@@ -1149,47 +1773,347 @@
       control('interrupt');
     });
 
-    /* 首个事件进来就把空态拿走 */
+    /* ── 宿主状态回写（内核把 `qaEngine` / `qaModel` / … 当**变量**读）──
+       内核渲染角色行、判断模型降级、拼产物地址都要这几个值；它们在组件闭包里，
+       所以每次状态变化（选引擎 / 选模型 / 认到会话 id / 拉到引擎清单）都同步一份到 window。
+       （内核侧那批符号是值不是函数，见 shared/host-glue.js 第三节的说明。） */
+    function syncHostState() {
+      try {
+        window.qaEngine = state.engine || '';
+        window.qaModel = state.model || '';
+        window.qaModelPick = state.model || '';
+        window.qaEngines = Array.isArray(state.engines) ? state.engines : [];
+        window.qaActiveId = state.session || '';
+        window.qaWorkspace = state.workspace || '';
+      } catch (e) { /* 非浏览器环境（测试桩）忽略 */ }
+    }
+
+    /* ── 宿主能力桥（`window.MagicHost`）：内核里「只能由宿主做」的三件事转回本组件 ──
+       ① 重试 / 追问 / 提问卡作答 → 重新发一条（本壳的 send / control）；
+       ② 模型显示名（内核的「引擎 · 模型」小标要用它）；
+       ③ 轻提示（本壳没有 toast 位，如实进 console，不假装弹过）。 */
+    window.MagicHost = window.MagicHost || {};
+    window.MagicHost.send = function (text, o) {
+      var t = String(text == null ? '' : text).trim();
+      if (!t) return;
+      /* 引擎正等这一问的答案 → 走控制通道（与「作答」原语义一致）；当成新的一轮发出去的话，
+         引擎那边还在等，这一问就断了。 */
+      if (state.awaitingAnswer) { control('answer', t); return; }
+      state.noEcho = !!(o && o.echo === false);     // 内核的重试路径：那条气泡已经在画布上了
+      ctx.input.value = t;
+      send();
+    };
+    window.MagicHost.model = {
+      cur: function () { return state.model || ''; },
+      name: function (id) { return id ? String(id) : (state.model || ''); },
+      set: function (id) { state.model = id ? String(id) : ''; syncPickers(); return true; },
+    };
+    window.MagicHost.toast = function (msg) { console.info('[conv] ' + String(msg == null ? '' : msg)); };
+    /* 内核自带的点击委托（复制 / 重试 / 提问卡选项 / 思考块与待办折叠）——
+       绑一次就够（内部有幂等标记）；它做的是**事件委托**，节点随快照重建也不怕。 */
+    if (typeof bindQaStreamDelegation === 'function') bindQaStreamDelegation();
+
+    /* ── 附件（＋）：拍照 / 照片·视频 / 添加文件 + 专家 / 技能 / 连接器 / 定时任务 ──
+       文件先 POST 给宿主（transport.upload）拿到 core 所在机器的**绝对路径**，
+       再由 ask 的 payload.attachments 透传给 -a/--attach —— 附件是本地路径，跨机无意义。 */
+    /* 附件视觉：图片出缩略图，其余退回文件名 chip。onRemove 为空 = 只读（用户气泡 / 历史回放）。
+       历史附件没有本地 objectURL，靠回读地址（transport.mediaUrl）；回读失败就地退回 chip，不留破图。 */
+    function thumbNode(a, onRemove, removeArg) {
+      var node = el('span', 'attachthumb');
+      var img = el('img', 'attachthumb__img');
+      img.src = a.url || a.remoteUrl || '';
+      img.alt = a.name || '';
+      img.onerror = function () {
+        var chip = el('span', 'attachchip');
+        chip.appendChild(el('span', 'attachchip__n', a.name || '附件'));
+        if (node.parentNode) node.parentNode.replaceChild(chip, node);
+      };
+      node.appendChild(img);
+      if (a.uploading) node.appendChild(el('span', 'attachthumb__mask', '上传中…'));
+      else if (a.error) node.appendChild(el('span', 'attachthumb__mask attachthumb__mask--err', '失败'));
+      if (onRemove) {
+        var x = el('button', 'attachthumb__x', '✕');
+        x.type = 'button'; x.setAttribute('aria-label', '移除');
+        // removeArg 是列表里的**原对象**：渲染用的是包装对象，移除必须按原对象身份查（否则 indexOf 恒为 -1）。
+        x.onclick = function () { onRemove(removeArg || a); };
+        node.appendChild(x);
+      }
+      node.title = a.name || '';
+      return node;
+    }
+    function chipNode(a, onRemove, removeArg) {
+      var node = el('span', 'attachchip');
+      node.appendChild(el('span', 'attachchip__n', a.name || '附件'));
+      if (onRemove) {
+        var x = el('button', 'attachchip__x', '✕');
+        x.type = 'button'; x.setAttribute('aria-label', '移除');
+        x.onclick = function () { onRemove(removeArg || a); };
+        node.appendChild(x);
+      }
+      return node;
+    }
+    /* 统一两种形态：发送中的附件（name/url/remoteUrl）与历史附件（path/mime）。 */
+    function attNode(a, onRemove) {
+      // 历史附件只有绝对路径；文件名去掉上传时加的 <UnixNano>- 前缀，还原成用户看到的名字。
+      var name = a && a.name ? String(a.name)
+        : (a && a.path ? String(a.path).split(/[\\/]/).pop().replace(/^\d{13,}-/, '') : '附件');
+      var url = a && a.url ? a.url : '';
+      var remote = a && a.remoteUrl ? a.remoteUrl : '';
+      if (!url && !remote && a && a.path && transport.mediaUrl) remote = transport.mediaUrl(a.path);
+      var mime = a && a.mime ? String(a.mime) : '';
+      var isImg = !!url || !!remote || /^image\//i.test(mime) || /\.(png|jpe?g|gif|webp|bmp)$/i.test(name);
+      if (isImg && (url || remote)) {
+        return thumbNode({ name: name, url: url, remoteUrl: remote, uploading: a.uploading, error: a.error }, onRemove, a);
+      }
+      return chipNode({ name: name }, onRemove, a);
+    }
+    /* 附件条：图片出缩略图（objectURL 立刻可见），其余类型退回文件名 chip。 */
+    function renderAttach() {
+      var bar = ctx.attachBar;
+      if (!bar) return;
+      bar.innerHTML = '';
+      var list = state.attachments || [];
+      bar.hidden = !list.length;
+      list.forEach(function (a) { bar.appendChild(attNode(a, removeAttachment)); });
+    }
+    /* 按对象身份移除（不要用下标：上传是异步的，多次渲染后下标会漂）。 */
+    function removeAttachment(a) {
+      var i = (state.attachments || []).indexOf(a);
+      if (i < 0) return;
+      if (a.url && typeof URL !== 'undefined' && URL.revokeObjectURL) {
+        try { URL.revokeObjectURL(a.url); } catch (e) {}
+      }
+      state.attachments.splice(i, 1);
+      renderAttach();
+    }
+    /* 发送后清空：连同仍在持有（未发走）的 objectURL 一起释放。 */
+    function clearAttachments() {
+      (state.attachments || []).forEach(function (a) {
+        if (a.url && typeof URL !== 'undefined' && URL.revokeObjectURL) {
+          try { URL.revokeObjectURL(a.url); } catch (e) {}
+        }
+      });
+      state.attachments = [];
+      renderAttach();
+    }
+    function pickFiles(accept, capture, multiple, onPick) {
+      var inp = document.createElement('input');
+      inp.type = 'file';
+      if (accept) inp.accept = accept;
+      if (capture) inp.setAttribute('capture', capture);
+      if (multiple) inp.multiple = true;
+      inp.style.display = 'none';
+      document.body.appendChild(inp);
+      inp.addEventListener('change', function () {
+        var files = Array.prototype.slice.call(inp.files || []);
+        inp.remove();
+        if (files.length) onPick(files);
+      });
+      inp.click();
+    }
+    /* 转码参数：转码后最长边 / 「已是引擎认识类型」的体积上限（超过就压一压）。
+       1920 与 PC 端的 ATT_EDGE 同口径（界面文字还看得清，又不至于拖慢每轮对话）。 */
+    var IMG_EDGE = 1920;
+    var IMG_EDGE_BYTES = 2 * 1024 * 1024;
+    /* 相册原图可能是 HEIC/HEIF/AVIF 或超大图 —— 引擎的图片块只吃 png/jpeg/gif/webp，
+       识别不了就会被降级成「把路径写进提示词」，模型只能 OCR（见 PC 端 07-chat-stream-render 同款注释）。
+       策略：类型已是引擎认识的且不大 → 原样传；否则 canvas 解码后统一转 JPEG（顺带缩到长边 ≤ IMG_EDGE）。 */
+    function maybeNormalize(f) {
+      var type = f.type || '';
+      var looksImg = /^image\//i.test(type) || /\.(png|jpe?g|gif|webp|bmp|heic|heif|avif)$/i.test(f.name || '');
+      var apiType = /^image\/(png|jpeg|jpg|gif|webp|bmp)$/i.test(type);
+      if (!looksImg) return Promise.resolve(f);
+      if (apiType && f.size <= IMG_EDGE_BYTES) return Promise.resolve(f);
+      return normalizeImage(f).then(function (out) { return out || f; });
+    }
+    function normalizeImage(file) {
+      return new Promise(function (resolve) {
+        var objUrl = '';
+        var finish = function (out) {
+          if (objUrl && typeof URL !== 'undefined' && URL.revokeObjectURL) { try { URL.revokeObjectURL(objUrl); } catch (e) {} }
+          resolve(out);
+        };
+        function decodeViaImg(ff) {
+          return new Promise(function (res, rej) {
+            objUrl = URL.createObjectURL(ff);
+            var im = new Image();
+            im.onload = function () { res(im); };
+            im.onerror = function () { rej(new Error('decode failed')); };
+            im.src = objUrl;
+          });
+        }
+        var decode = (typeof createImageBitmap === 'function')
+          ? createImageBitmap(file).catch(function () { return decodeViaImg(file); })
+          : decodeViaImg(file);
+        decode.then(function (img) {
+          var w = img.width || img.naturalWidth || 0, h = img.height || img.naturalHeight || 0;
+          if (!w || !h) return finish(null);
+          var scale = Math.min(1, IMG_EDGE / Math.max(w, h));
+          var tw = Math.max(1, Math.round(w * scale)), th = Math.max(1, Math.round(h * scale));
+          var cv = document.createElement('canvas'); cv.width = tw; cv.height = th;
+          var cx = cv.getContext('2d');
+          if (!cx) return finish(null);
+          try { cx.drawImage(img, 0, 0, tw, th); } catch (e) { return finish(null); }
+          if (img.close) { try { img.close(); } catch (e) {} }
+          var base = String(file.name || 'image').replace(/\.[^.]+$/, '') || 'image';
+          cv.toBlob(function (blob) {
+            if (!blob) return finish(null);
+            var out;
+            try { out = new File([blob], base + '.jpg', { type: 'image/jpeg' }); }
+            catch (e) { out = blob; }        // 老内核没有 File 构造器：退回 Blob（后端按魔数嗅探，不受影响）
+            finish(out);
+          }, 'image/jpeg', 0.85);
+        }).catch(function () { finish(null); });
+      });
+    }
+    function uploadFiles(files) {
+      var chain = Promise.resolve();
+      files.forEach(function (f) {
+        chain = chain.then(function () {
+          if (!transport.upload) { noticeItem('当前传输层不支持上传附件'); return; }
+          /* 先转码再传：保证引擎收到的是它认识的图片格式。 */
+          return maybeNormalize(f).then(function (up) {
+            var isImg = /^image\//i.test(up.type || '');
+            var nm = up.name || f.name;
+            var item = { path: '', name: nm, size: up.size, url: '', remoteUrl: '', uploading: true, error: '' };
+            if (isImg && typeof URL !== 'undefined' && URL.createObjectURL) {
+              try { item.url = URL.createObjectURL(up); } catch (e) {}
+            }
+            state.attachments.push(item);
+            renderAttach();
+            return transport.upload(up).then(function (r) {
+              item.path = r.path;
+              item.name = r.name || nm;
+              item.size = r.size;
+              if (isImg) item.remoteUrl = r.url || '';
+              item.uploading = false;
+              renderAttach();
+            }).catch(function (e) {
+              item.uploading = false;
+              item.error = (e && e.message ? e.message : String(e));
+              renderAttach();
+              noticeItem('上传失败：' + item.error);
+            });
+          });
+        });
+      });
+      return chain;
+    }
+    function openAttachSheet(anchor) {
+      Sheet.open(anchor, function (M) {
+        M.title('添加');
+        var grid = el('div', 'attachgrid');
+        function tile(icon, label, onTap) {
+          var b = el('button', 'tile'); b.type = 'button';
+          b.appendChild(svgIcon(icon, 22));
+          b.appendChild(el('span', 'tile__l', label));
+          b.onclick = onTap; grid.appendChild(b);
+        }
+        tile('i-cam', '拍照', function () { Sheet.close(); pickFiles('image/*', 'environment', false, uploadFiles); });
+        tile('i-img', '照片 / 视频', function () { Sheet.close(); pickFiles('image/*,video/*', null, true, uploadFiles); });
+        tile('i-doc', '添加文件', function () { Sheet.close(); pickFiles(null, null, true, uploadFiles); });
+        M.node(grid);
+        var rows = [['i-user', '专家', 'specialist'], ['i-spark', '技能', 'skills'], ['i-link', '连接器', 'connectors'], ['i-clock', '定时任务', 'scheduled']];
+        rows.forEach(function (r) {
+          var b = el('button', 'sheetrow'); b.type = 'button';
+          b.appendChild(svgIcon(r[0], 18));
+          b.appendChild(el('span', 'sheetrow__l', r[1]));
+          b.appendChild(svgIcon('i-chev', 16));
+          b.onclick = function () {
+            Sheet.close();
+            if (r[2] === 'scheduled' && opts.onMenu) { try { opts.onMenu('scheduled'); } catch (e) {} return; }
+            noticeItem(r[1] + '：暂未接入（需要后端提供清单接口）');
+          };
+          M.node(b);
+        });
+      });
+    }
+
+    /* 首个事件进来就把空态拿走（骨架屏同理：真内容一到，占位就该让位） */
     var _render = render;
     render = function (ev) {
       if (empty.parentNode) empty.remove();
+      if (histLoadingWant) endHistLoading(false);
       if (opts.onEvent) { try { opts.onEvent(ev); } catch (e) {} }
       return _render(ev);
     };
 
+    /* 新会话的标题文案：「打开会话」那一支是 setSession，这两支互斥。
+       ⚠️ 必须在**挂载时**也写一次，不能只在 newSession() 里写：移动端「新建任务」不是调
+       newSession()，而是销毁组件后重新 create、复用同一个 #title（client-ui-mobile/index.html
+       的 mountConversation）—— 新实例不写，标题就留着上一个会话的（2026-10-20 用户：
+       「新会话不应该显示别的会话的标题」）。 */
+    function newTitleText() { return state.engine ? ('新会话 · ' + state.engine) : '新会话'; }
+    function syncNewTitle() { if (ctx.titleEl && !state.session) ctx.titleEl.textContent = newTitleText(); }
     function newSession() {
+      stopWatch();
       state.session = null; state.askId = null;
       clearThread();
+      clearAttachments();                              // 新会话不继承上一段会话待发的附件
+      ctx.input.value = ''; autoGrow();
       threadEl.appendChild(empty);
-      if (ctx.titleEl) ctx.titleEl.textContent = state.engine ? ('新会话 · ' + state.engine) : '新会话';
+      syncNewTitle();
       setTimeout(function () { ctx.input.focus(); }, 0);
     }
     function setSession(sid, s) {
+      stopWatch();                                     // 上一段会话的「新轮次发现」不许落进这一段
       state.session = sid || null;
       if (s && s.engine) { state.engine = s.engine; }
+      /* 模型跟引擎一起继承（2026-10-20 用户：「没有显示历史会话对应的模型 引擎显示了」）——
+         清单行里带着这条会话真正用的 `model`（core 的 --sessions，见 session.Record），
+         不接过来就会一直显示宿主的全局偏好。与 PC 工作台同一口径（93-rail.js 的
+         `t.model = s.model || ""`）：空值 = 让 core 用默认档，不替用户预设。 */
+      state.model = (s && s.model) || '';
       clearThread();
       threadEl.appendChild(empty);
+      /* ⚠️ 会话标题**以 core 的 `title` 为准**（2026-10-18 用户：「同一个会话 pc 端还是跟移动端
+         标题不一样 需一致」）。core 的 `--sessions` 早已把「标题表的归纳结果 → prompt_head」
+         合并成一个 `title` 字段，列表页（移动端 titleOf / PC 掌天瓶的 cliRows）读的都是它；
+         只有**这个详情页顶栏**此前优先 `prompt_head` —— 于是同一条会话：PC 显示归纳要点
+         （如「完整复刻水世界场景」），移动端详情页显示首问原文（如「现在水世界跟参考图还不一样…」）。
+         老 core 没有 `title` 字段 → 回落 `prompt_head`；再没有就用会话 id 前 8 位。 */
       if (ctx.titleEl) ctx.titleEl.textContent =
-        (s && (s.prompt_head || s.title)) || (sid ? String(sid).slice(0, 8) : '会话');
+        (s && (s.title || s.prompt_head)) || (sid ? String(sid).slice(0, 8) : '会话');
       syncPickers();
       if (sid) {
-        loadHistory(sid).catch(function (e) { noticeItem('历史加载失败：' + (e.message || e)); });
+        startWatch();
+        /* watchInflight：这次首载期间别让 watcher 再插一次 loadHistory（大日志可能超过 5s）。 */
+        watchInflight = true;
+        loadHistory(sid)
+          .catch(function (e) { noticeItem('历史加载失败：' + (e.message || e)); })
+          .then(function () { if (sid === state.session) watchInflight = false; });
       }
-      setTimeout(function () { ctx.input.focus(); }, 0);
+      /* 打开一条已有的回话（看历史 / 接着聊）时**不**自动把焦点塞进输入框：
+         移动端上这一下会直接顶起软键盘，刚回放出来的历史被键盘挡掉大半。
+         要打字时用户自己点输入框即可；newSession（用户主动「新建」）仍保留聚焦。 */
     }
     function refreshEngines() {
       return Promise.resolve(transport.listEngines()).then(function (list) {
         state.engines = Array.isArray(list) ? list : [];
+        /* 记住的引擎已不在本机（卸载 / 改名 / 清单变了）→ 回首个可用。
+           不做这步的话，带着一个跑不起来的引擎发任务，报错指向 core 而不是
+           「这个引擎没了」；宿主记的默认值也会一直卡在死引擎上。
+           （清单为空 = 探测失败，保持原引擎不动，别把用户的默认值清掉。） */
+        var okRows = state.engines.filter(function (x) { return x.ok; });
         if (!state.engine) {
-          var first = state.engines.filter(function (x) { return x.ok; })[0];
-          if (first) state.engine = first.engine;
+          var firstOk = okRows[0];
+          if (firstOk) state.engine = firstOk.engine;   // 「自动」档：静默取首个可用，不回写宿主
+        } else if (!okRows.some(function (x) { return x.engine === state.engine; })) {
+          var fallback = okRows[0];
+          if (fallback) {
+            state.engine = fallback.engine;
+            state.model = '';
+            notifyPick();        // 宿主把默认值同步改成实际会用的引擎
+          }
         }
         syncPickers();
+        syncNewTitle();          // 引擎清单是异步到的：新会话标题里那枚引擎名跟着落定
         return state.engines;
       });
     }
     function destroy() {
-      closePick();
+      stopWatch();
+      Sheet.close();
       if (wrap.parentNode) wrap.parentNode.removeChild(wrap);
     }
 
@@ -1198,6 +2122,7 @@
     setSendMode('idle');
     syncPickers();
     if (state.session) setSession(state.session);
+    else syncNewTitle();       // 新挂载 = 新会话：标题必须从这里重写，别留着上一实例写的值
 
     return {
       version: 1,
@@ -1210,6 +2135,10 @@
       setEngine: function (n) { state.engine = n; syncPickers(); },
       setModel: function (n) { state.model = n; syncPickers(); },
       setPermission: function (v) { state.permission = v; syncPickers(); },
+      setWorkspace: function (v) { state.workspace = v || ''; },
+      permissionLabel: function () { return tierOf(state.permission || '').label; },
+      permissionTier: function () { return state.permission || ''; },
+      openPermissionPicker: openPermissionPicker,
       setEngines: function (list) { state.engines = list || []; syncPickers(); },
       refreshEngines: refreshEngines,
       setSession: setSession,
@@ -1222,4 +2151,9 @@
   }
 
   window.MagicConversation = { version: 1, create: create };
+  /* 掌天瓶图形也给宿主用（App 启动闪屏要同一枚瓶，见 client-ui-mobile/index.html 的 .splash）：
+     它是**图形**不是对话逻辑，所以放在这个命名空间下而不是 hostSymbols 里 ——
+     宿主拿到的是「一枚造好的 SVG」，不需要知道瓶身怎么画。 */
+  window.MagicConversation.bottle = bottleSVG;
+  window.MagicConversation.BOTTLE_VB = BOTTLE_VB;
 })();