dsh-mini-remote 0.1.8 → 0.2.0

package/lib/page.html

@@ -21,13 +21,15 @@
          需要"显眼一点"的地方一律用鲸鱼娘的冰蓝 --ice，别动这两个。
        · --ok/--run/--err 是状态点的语义色，占的是 8px 一个小点，不算强调色。
        · 配色以鲸鱼娘为准心：深海墨蓝打底，她的冰蓝作次级色。
-       · 两套主题：这套（默认，深色）和 [data-theme="light"]，色调跟宣传图
+       · 两套主题：[data-theme="light"]（默认，浅色）和深色，色调跟宣传图
          （docs/promo.png）统一。**颜色令牌两边必须一一对应**——缺一个，就有元素
          在某个主题下"隐身"，而且只在那个主题下才看得出来。守卫在 test/ui.test.mjs。 */
   :root {
     color-scheme: dark;
     --bg: #0a0f16;
     --bg-top: #101a27;
+    /* 基准字号：设置页「字体大小」三档控制，默认 15.5px */
+    --font-base: 15.5px;
     --bg-deep: #070b11;
     --panel: #121a25;
     --panel-2: #18222f;
@@ -40,6 +42,7 @@
     --act: #c9a55c;       /* 强调色当**底**用：一屏一个的主按钮 */
     --ok: #4fb477;
     --run: #a9c8e8;
+    --shimmer: #eaf4ff;   /* 跑着的行那道扫光的亮色（照 PC 的 label-shimmer，2026-10-04） */
     --err: #d4614f;
     --r: 2px;
     --sh-1: 0 1px 2px rgba(0, 0, 0, .28);
@@ -71,6 +74,7 @@
     --act: #3b6fc4;       /* 主按钮底：用宣传图那个宝蓝（用户 2026-09-27 裁决） */
     --ok: #2e9a5f;
     --run: #3b6fc4;
+    --shimmer: #7ea6e6;   /* 浅色下的扫光要比 --run 亮、又不能白到看不见 */
     --err: #c0392b;
     --sh-1: 0 1px 2px rgba(28, 60, 110, .07);
     --sh-2: 0 2px 8px rgba(28, 60, 110, .12);
@@ -124,6 +128,12 @@
     font-size: 16px; display: grid; place-items: center; cursor: pointer;
   }
   .icon-btn:active { transform: scale(.94); }
+  #btnSubagents.subagent-running svg { animation: subagent-spin 1.6s linear infinite; }
+  #btnSubagents.subagent-running { border-color: var(--run); color: var(--run); }
+  @keyframes subagent-spin { to { transform: rotate(360deg); } }
+  @media (prefers-reduced-motion: reduce) {
+    #btnSubagents.subagent-running svg { animation: none; }
+  }
 
   /* ---------- 子智能体（2026-10-03） ----------
      整块**只新增两条外观**：列表里的一行、聊天记录里那张完工卡片。其余全部复用：
@@ -146,6 +156,67 @@
     font: inherit; font-size: 14px; cursor: pointer; padding: 0;
   }
   .sa-none { color: var(--muted); font-size: 14px; padding: 6px 0 2px; }
+
+  /* ---------- 插件页面（2026-10-04） ----------
+     外壳和设置抽屉 / 子智能体**同一套**（#xxx.open + .sheet），不新建样式体系。
+     层级比设置抽屉高一档（60 > 50）：它从设置里点开，得盖在设置**上面**，
+     而不是掉到输入框下面去（2026-10-04 用户真机报的正是这一条）。 */
+  #plugins {
+    position: fixed; inset: 0; background: var(--scrim);
+    display: none; align-items: flex-end; z-index: 60;
+  }
+  #plugins.open { display: flex; }
+  /* .sa-list 把两边拽到贴屏边（负 16px，让分隔线横贯），所以这里的左右缩进
+     得自己补回同一个 16px——少这一笔，文字就贴着屏幕边（用户报的「两侧没有留白」）。
+
+     ---------- 分组可折可展（2026-10-05 用户要「分组做成可以折叠展开，默认折叠」）----------
+     用浏览器原生的 <details>/<summary>：不写一行脚本去演它、不加关键帧，键盘和读屏
+     也都认（和子智能体那张完工卡片同一个做法，见 .sa-card）。默认收起：HTML 里
+     不写 open 属性就自然是收着的，所以「默认折叠」不需要额外的代码去保证。
+
+     小三角**用 CSS 画**（两条边框拼一个实心三角），不写字形——字形依赖字体，
+     换个机型就可能变成豆腐块；颜色用 currentColor，深浅两套主题自动都对。 */
+  .plugin-fold { margin: 16px 0 0; }
+  .plugin-fold > summary {
+    display: flex; align-items: center; gap: 8px; list-style: none;
+    margin: 0 16px 6px; padding: 4px 0;
+    font-size: 13px; color: var(--muted); cursor: pointer;
+  }
+  .plugin-fold > summary::-webkit-details-marker { display: none; }
+  /* 收起时朝右，展开时朝下——和 PC 那页的分组箭头一个意思。 */
+  .plugin-fold > summary::before {
+    content: ""; flex: 0 0 auto; width: 0; height: 0;
+    border-left: 5px solid currentColor;
+    border-top: 4px solid transparent;
+    border-bottom: 4px solid transparent;
+  }
+  .plugin-fold[open] > summary::before {
+    border-left: 5px solid transparent;
+    border-top: 5px solid currentColor;
+    border-right: 5px solid transparent;
+  }
+  /* 展开的那一组，标题点亮一点，免得收/开两态看着一样。 */
+  .plugin-fold[open] > summary { color: var(--fg); }
+  /* 一级分组（官方 / 已安装）比二级（全局插件 / 会话插件 / 预设名）重一点。 */
+  .plugin-fold.depth-1 > summary { font-size: 14px; margin-top: 4px; }
+  .plugin-fold.depth-2 { margin-top: 10px; }
+  .plugin-fold.depth-2 > summary { font-size: 12px; color: var(--dim); }
+  .plugin-fold.depth-2[open] > summary { color: var(--muted); }
+  .plugin-note { font-size: 12px; color: var(--err); margin: 6px 16px; }
+  .plugin-row {
+    display: flex; align-items: center; gap: 10px;
+    padding: 12px 16px; border-bottom: 1px solid var(--line);
+  }
+  .plugin-row:last-child { border-bottom: none; }
+  .plugin-info { flex: 1 1 auto; min-width: 0; }
+  .plugin-name { display: block; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .plugin-desc { display: block; font-size: 12px; color: var(--muted); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  /* 插件报错/装不上：那一行说人话，颜色用状态语义色 --err（不是强调色）。 */
+  .plugin-problem { color: var(--err); }
+  .plugin-badge { flex: 0 0 auto; font-size: 10px; padding: 2px 6px; border-radius: var(--r); }
+  .plugin-badge.on { color: var(--ok); border: 1px solid var(--ok); }
+  .plugin-badge.off { color: var(--dim); border: 1px solid var(--line); }
+  .plugin-badge.err { color: var(--err); border: 1px solid var(--err); }
   /* 行负着左右两边的 16px：让分隔线横贯整个抽屉，而不是在里面缩一截。 */
   .sa-list { margin: 0 -16px; }
   .sa-row {
@@ -226,7 +297,7 @@
        回答正文第一行之间贴得太紧」——10px 是「同一条消息内部」的距离，
        而这里跨的是「我说的话」和「它答的话」，是更大的一个断点，该给更多。 */
     margin-bottom: 18px; white-space: pre-wrap; word-break: break-word;
-    font-size: 15.5px; line-height: 1.7;
+    font-size: var(--font-base); line-height: 1.7;
   }
   .bubble.user { margin-left: auto; background: var(--panel-2); border: 1px solid var(--line); }
   .bubble.assistant { margin-right: auto; background: var(--panel); border: 1px solid var(--line); }
@@ -242,7 +313,7 @@
   /* ---------- Markdown 正文 ---------- */
   /* 外层是 pre-wrap（用户消息和旧内容靠它），markdown 输出的是真块级元素，
      所以要在这里把 pre-wrap 收掉，否则段落之间会多出一堆空行。 */
-  .md { white-space: normal; }
+  .md { white-space: normal; font-size: var(--font-base); line-height: 1.7; }
   /* 回复里的图。地址有两种写法，见下面 mdInline() 里那段注释。
      宽度只封顶不写死：窄屏上占满可用宽度、按比例缩，圆角沿用全站那 2 像素。 */
   /* 图片没加载出来时的那一圈虚线。用中性灰，不动暖金——那是唯一的强调色，一屏最多两次。 */
@@ -535,6 +606,11 @@
   }
   .stop:disabled { opacity: .5; }
 
+  /* 「完整」模式不放装饰（2026-10-03 用户点名）：立绘、气泡、光流进度条都不出现——
+     那一屏的过程由轨迹自己在逐条冒，再挂一只跑动的鲸鱼娘就是重复。只留
+     「已 N 秒 / 停止」那一行：去掉它就中止不了任务了。 */
+  .work.bare .work-top, .work.bare .work-progress { display: none; }
+
   /* 排队中的指令。跑着任务时接着发的那几条排在这儿，等这一轮跑完再跑。
      单帧模式下你发出去的那句话在别处一个字都看不见（那一模式只显示回复），
      所以这块是唯一的反馈，不能省。 */
@@ -580,6 +656,14 @@
     display: flex; align-items: center; gap: 8px; padding: 3px 0;
     font-size: 13.5px; line-height: 1.45;
   }
+  /* 「插话」那一行的标记（2026-10-06）。不标的话，插话和排队在列表里长得一模一样，
+     而两者的等待时间差一个数量级（插话几秒、排队可能几分钟）——用户根本分不出
+     自己那条到底插进去了没有。颜色用既有的状态色 --run（和轨迹里的「进行中」同色）。 */
+  .queue .q-tag {
+    flex: 0 0 auto; font-size: 11px; line-height: 1;
+    padding: 2px 5px; border-radius: var(--r);
+    color: var(--run); border: 1px solid var(--run);
+  }
   /* 长指令折行，但最多两行——队列是「提醒还有几条」，不是给人重读全文的地方。 */
   .queue .q-text {
     flex: 1 1 auto; min-width: 0; color: var(--fg);
@@ -602,6 +686,8 @@
     .work-stage { animation: none; }
     .pose { animation: none; transition: none; }
     .work-progress i { width: 100%; opacity: .45; animation: none; }
+    /* 扫光是状态指示、不是装饰，但用户要「减少动效」时整条关掉——底色照旧。 */
+    .traj-shimmer { animation: none; background-image: none; color: var(--run); }
     .queue .q-node i { transition: none; }
     .dot { transition: none; }
   }
@@ -636,11 +722,40 @@
     border: 1px solid var(--line); background: var(--panel-2); color: var(--muted);
     display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
   }
-  .attach svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
+  /* 图标是 DSH 桌面端那个鲸鱼（见 HTML 里那段注释）。
+     和原来的回形针有两点不一样，两条都得改：
+       · 它是**实心**路径（fill），不是描边的——留着 stroke 会把整个轮廓再描一圈；
+       · 它是横长条（23.16 : 17.04），不是正方形——照原来 19×19 会被拉扁。
+     颜色走 currentColor（跟着按钮的 var(--muted)），所以深浅两套主题各自适配。 */
+  .attach svg { width: 22px; height: 16.2px; fill: currentColor; stroke: none; }
   .attach:disabled { opacity: .4; }
-  /* 上传中：图标转起来。这条路上没有进度条，至少要让人看出「它在动」。 */
-  .attach.busy svg { animation: spin 1s linear infinite; }
-  @keyframes spin { to { transform: rotate(360deg); } }
+  /* 上传中：鲸鱼**原地游动**（2026-10-05 用户要求换掉转圈）。
+     为什么不用转圈：转圈是「物件在转」的语汇（齿轮、加载器），用在活物身上
+     读起来像标本被转着看。鲸鱼该有的动作是**游**。
+
+     这一组值改过两轮：用户先审了 1.5px / ±4 度，看过之后说「幅度可以再大一些」，
+     于是放到 **2.5px / ±7 度**（上下各大了 67%、俯仰大了 75%）。
+     一个来回仍是 1.8 秒（用户只提了幅度，速度没动）。
+     幅度占图标高度的 15%（16.2px 里的 2.5px）；连同俯仰撑开的量，
+     离 42px 按钮的边还有 8px 以上余量，跑不出去。
+
+     **俯仰的方向别写反**（第一版就写反了，靠放大渲染才发现）：
+     鲸鱼是**朝左**的（鼻头在左、尾巴在右上），而 CSS 里正角度是顺时针
+     ——顺时针会把**左边**抬起来（拿 rotate(90deg) 想：左边的点会转到上方）。
+     所以「鼻尖抬起」是**正角度**。要的效果是「朝着前进的方向点头」：
+     上浮时鼻尖朝上、下潜时鼻尖朝下。于是 0%/100%（最高点）用 +7deg，
+     50%（最低点）用 -7deg。写反了看起来就像它在倒着游。 */
+  .attach.busy svg { animation: whaleSwim 1.8s ease-in-out infinite; }
+  @keyframes whaleSwim {
+    0%, 100% { transform: translateY(-2.5px) rotate(7deg); }
+    50%      { transform: translateY(2.5px) rotate(-7deg); }
+  }
+  /* 用户要「减少动效」时它就不动——但**忙碌的表示没丢**：
+     按钮此时是禁用态（opacity .4），本来就是「正在进行」的样子。
+     （这一条同时补掉一个遗留缺口：原来那个转圈压根没管减少动效。） */
+  @media (prefers-reduced-motion: reduce) {
+    .attach.busy svg { animation: none; }
+  }
 
   /* 附件小条：排在输入框上面，让你发之前看得见自己带了什么。 */
   .attach-bar {
@@ -676,24 +791,35 @@
     backdrop-filter: blur(14px) saturate(1.1);
   }
   .cmd-menu[hidden] { display: none; }
-  .cmd-menu .cmd-row {
+  /* 面板里的指令列表（#opsCmds）和这只菜单**长得一样、也共用这份规则**：
+     同一份数据、同一种行，没有第二套样式。 */
+  .cmd-menu .cmd-row,
+  .ops-cmds .cmd-row {
     display: flex; align-items: baseline; gap: 10px; width: 100%;
     padding: 9px 8px; border: none; border-radius: var(--r); background: none;
     color: var(--fg); font: inherit; font-size: 14.5px; text-align: left; cursor: pointer;
   }
-  .cmd-menu .cmd-row:active { background: var(--panel-2); }
-  .cmd-menu .cmd-name {
+  .cmd-menu .cmd-row:active,
+  .ops-cmds .cmd-row:active { background: var(--panel-2); }
+  .cmd-menu .cmd-name,
+  .ops-cmds .cmd-name {
     flex: 0 0 auto; color: var(--ice);
     font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   }
   /* 说明收成一行：这一屏是「扫一眼挑一个」，不是读文档的地方。 */
-  .cmd-menu .cmd-desc {
+  .cmd-menu .cmd-desc,
+  .ops-cmds .cmd-desc {
     flex: 1 1 auto; min-width: 0; color: var(--muted); font-size: 12.5px;
     overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
   }
   /* 取不到指令时说清原因，**不显示空列表**：空列表看着就像「这个会话没有指令」，
      而真实原因多半是「这个会话现在没在跑」——两件事，用户能做的事也不一样。 */
-  .cmd-menu .cmd-note { padding: 10px 8px; color: var(--muted); font-size: 13px; }
+  .cmd-menu .cmd-note,
+  .ops-cmds .cmd-note { padding: 10px 8px; color: var(--muted); font-size: 13px; }
+  /* 面板那一行多两样：一层包住名字和说明（好让右边那面小旗挨着它排），以及那面小旗本身
+     （声明了收附件的指令，手机这一版带不了）。名字和说明的省略规则照旧用上面那一套。 */
+  .ops-cmds .cmd-top { display: flex; align-items: baseline; gap: 10px; flex: 1 1 auto; min-width: 0; }
+  .ops-cmds .cmd-flag { flex: none; color: var(--muted); font-size: 12px; white-space: nowrap; }
 
   /* ---------- 左侧导航栏 ---------- */
   #nav {
@@ -764,6 +890,22 @@
   .ws-new:active { background: var(--panel-2); }
   .ws-new[disabled] { color: var(--muted); cursor: default; }
 
+  /* 「新建会话」下展开的模式清单（2026-10-04）。行内展开、点谁建谁——照
+     「新建文件夹」的先例不弹窗；左侧一条细线表明它是那一行展开的内容；
+     坏档灰字不可点。 */
+  .ws-modes { margin: 2px 0 8px; padding-left: 10px; border-left: 1px solid var(--line); }
+  .ws-mode {
+    display: block; width: 100%; text-align: left; cursor: pointer;
+    font: inherit; font-size: 12.5px; line-height: 1.5;
+    padding: 7px 8px; color: var(--fg);
+    background: none; border: none;
+  }
+  .ws-mode:active { background: var(--panel-2); }
+  .ws-mode b { font-weight: 650; }
+  .ws-mode-desc { display: block; color: var(--muted); font-size: 11.5px; }
+  .ws-mode-def { margin-left: 8px; color: var(--dim); font-size: 11px; }
+  .ws-mode-broken { color: var(--muted); cursor: default; }
+
   /* 导航栏最上面那条「新建工作区」。跟工作区条目之间用一条线隔开：
      它是这一屏的入口，不是一个工作区。 */
   .nav-cta {
@@ -837,6 +979,106 @@
      露和收之间就不会把下面的消息顶来顶去（那会是一次小跳）。 */
   .more-note.hide { visibility: hidden; }
 
+  /* 「完整」模式：过程组穿插在对话原位，长相对齐 PC 的 turn-process（tasks/todo.md 11）：
+     行首一枚细线小图标 + 灰色状态词/标题（叫法照抄 DSH，一个字不自创），点开才见原文。
+     只用现成令牌、不加动效不加新颜色：它是补充信息，不是这一屏的主角。 */
+  .traj-group { margin-bottom: 10px; }
+  .traj-head {
+    display: flex; align-items: baseline; gap: 6px; width: 100%; text-align: left; cursor: pointer;
+    font: inherit; font-size: 12.5px; line-height: 1.6;
+    padding: 6px 4px; color: var(--muted);
+    background: none; border: none; border-top: 1px dashed var(--line);
+  }
+  .traj-entries { margin: 2px 0 0 4px; padding-left: 10px; border-left: 1px solid var(--line); }
+  .traj-row {
+    display: flex; align-items: baseline; gap: 6px; width: 100%; text-align: left; cursor: pointer;
+    font: inherit; font-size: 13px; line-height: 1.6;
+    padding: 5px 4px; color: var(--fg);
+    background: none; border: none;
+  }
+  .traj-row:active { background: var(--panel-2); }
+  .traj-ico { flex: none; width: 14px; height: 14px; color: var(--muted); }
+  .traj-ico svg { display: block; width: 14px; height: 14px; }
+  .traj-name { flex: none; color: var(--muted); }
+  /* 折叠行右侧的内容一行截断（照 PC）：折叠行是给人扫的，不是给人读的——
+     具体东西在展开里。组头标题同款处理（活片段再长也不许换行刷屏）。 */
+  .traj-detail {
+    flex: 1 1 auto; min-width: 0;
+    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+    color: var(--fg);
+  }
+  .traj-head .traj-title, .traj-head .traj-run {
+    flex: 1 1 auto; min-width: 0;
+    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+  }
+  .traj-say {
+    margin: 4px 0 8px; padding: 0 2px;
+    word-break: break-word;
+    color: var(--fg); font-size: 13px; line-height: 1.7;
+  }
+  .traj-say p { margin: 0 0 6px; }
+  .traj-say p:last-child { margin-bottom: 0; }
+  /* 思考正文（照 PC 的 compact Markdown）：普通段落、三级灰、左缩进 22px，不套框。 */
+  .traj-think {
+    margin: 2px 0 8px; padding: 4px 0 4px 22px;
+    color: var(--muted); font-size: 13px; line-height: 20px;
+    word-break: break-word;
+  }
+  .traj-think p { margin: 0 0 6px; }
+  .traj-think p:last-child { margin-bottom: 0; }
+  /* 工具展开卡（照 PC 的通用 IN/OUT 卡）：标签小字灰、正文等宽、细线分隔、出错整段红。 */
+  .traj-io {
+    margin: 2px 0 8px;
+    background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--r);
+  }
+  .traj-io-row { display: flex; gap: 10px; padding: 8px 10px; }
+  .traj-io-row + .traj-io-row { border-top: 1px solid var(--line); }
+  .traj-io-label { flex: none; width: 34px; color: var(--muted); font-size: 11px; line-height: 1.7; }
+  .traj-io-body { flex: 1 1 auto; min-width: 0; color: var(--muted); font-size: 12.5px; line-height: 1.6; }
+  .traj-io-body pre {
+    margin: 0; white-space: pre-wrap; word-break: break-word;
+    font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px;
+  }
+  .traj-io-err pre { color: var(--err); }
+  .traj-io-note { margin-top: 4px; color: var(--dim); font-size: 11px; }
+  /* 四类状态的字样：只上色、零动效（动效守卫只认那五种关键帧），颜色全取现成令牌。 */
+  .traj-err { color: var(--err); }   /* 失败首行：折叠处一眼可见 */
+  .traj-run { color: var(--run); }   /* 进行中：有标识；2026-10-04 起再加一道扫光（用户点名） */
+  /* 条目行里那两个字样**不许被压扁、不许折行**（2026-10-06 用户真机反馈：
+     「进行中」的「中」挂到下一行）。
+     根因：它们是直接拼在 .traj-row 里的裸 <span>，而 .traj-row 是**弹性容器**
+     ——于是各自变成一个弹性项，默认 flex: 0 1 auto、min-width: auto。
+     中文的「最小内容宽度」是**一个字**，空间一紧它就缩成一字宽，文字自己折行，
+     变成「进 / 行 / 中」竖着排，还把整行撑高（真机复现过，长摘要那一行最明显）。
+     修法：让它不参与压缩、且不许折行——**正好也是 2026-10-04 定下的口径**
+     （「出错/进行中的字样是独立的一段，不许被省略号吃掉」）：它保持完整宽度，
+     让左边那段 .traj-detail 去缩、去打省略号。
+     只挂在 .traj-row 下：组头那份 .traj-head .traj-run 自己有 nowrap + 省略号，
+     不要动它。 */
+  .traj-row .traj-err, .traj-row .traj-run { flex: none; white-space: nowrap; }
+  /* 跑着的行有一道渐变光扫过去（照 DSH 的 TextShimmer，2026-10-04 用户点名复现，
+     要适配主题）。机制照 PC：底色还是语义色（--run），一道亮色（--shimmer）扫过；
+     每秒 48 格、1.5 秒一轮、走前 2/3 停后 1/3，与 PC 同参。颜色全走现成令牌，
+     深浅两套主题各看各的。行上带一个负 delay（trajShimStyle）：页面整块重画会把
+     动画打回开头，接上全局时钟的相位才不会变成频闪。 */
+  .traj-shimmer {
+    background-image: linear-gradient(105deg,
+      var(--run) 38%, var(--shimmer) 50%, var(--run) 62%);
+    background-size: 260% 100%;
+    -webkit-background-clip: text; background-clip: text;
+    color: transparent;
+    animation: shimSweep 1.5s steps(48, end) infinite;
+  }
+  @keyframes shimSweep {
+    0% { background-position: 150% 0; }
+    66.6667%, 100% { background-position: -50% 0; }
+  }
+  .traj-note {
+    margin: 0 0 10px; padding: 6px 8px;
+    background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--r);
+    color: var(--muted); font-size: 12.5px; line-height: 1.6;
+  }
+
   /* ---------- 设置抽屉 ---------- */
   #settings {
     position: fixed; inset: 0; background: var(--scrim);
@@ -852,11 +1094,87 @@
     backdrop-filter: blur(14px) saturate(1.1);
   }
   .sheet h2 { margin: 0 0 14px; font-size: 16px; }
+
+  /* ---------- 设置页：整屏（2026-10-05 用户要求） ----------
+     内容越来越多，贴底那张最高 86vh 的抽屉不够用了。
+
+     **只改设置这一处**，不动 .sheet 本身——设置 / 统一操作面板 / 子智能体 / 插件页
+     共用那一套（✓ 毛玻璃底色照旧，一个字没改），另外三处本来就短，照旧贴底。
+
+     布局改成一列：页眉（.sheet-head）待在**滚动区外面**，内容（.sheet-body）自己滚。
+     为什么要这样而不是把页眉做成吸顶的：吸顶的页眉得自己铺一层底色去挡滚上来的内容，
+     而它铺在抽屉的毛玻璃之上会**再叠一层**、叠出更深的色，顶上就一道色差。
+     页眉不进滚动区，底下就还是抽屉本来的那层毛玻璃，什么都不用铺。
+
+     圆角和上边框去掉：它们本来是「贴着底边只露一截」才需要的，整屏之后那两条边
+     就是屏幕边。 */
+  #settings .sheet {
+    display: flex; flex-direction: column;
+    overflow: hidden;
+    max-height: none; height: 100%;
+    border-radius: 0; border-top: none;
+    padding: 0;
+  }
+  /* 页眉。**整屏之后必须有一个一直看得见的关闭口**：原来「点抽屉外面」那条路没了
+     （没有露在外面的遮罩可点），光靠底部那个「完成」得先滚到底才行。
+
+     高度是省出来的（2026-10-05 用户说太高）：原来上下留 16/10px，而真正把这条页眉
+     顶高的是右边那个按钮——.btn 默认上下各 8px 内边距、14px 字，光它就 39px，
+     加起来 65px，比页面自己那条顶栏还高。
+       · 上内边距收到 10px，和页面顶栏（header）**同一条竖向节奏**；
+       · 页眉里这一个按钮单独紧凑一档（见下），别处照旧。
+     两处合起来约 50px。 */
+  .sheet-head {
+    flex: 0 0 auto;
+    display: flex; align-items: center; justify-content: space-between; gap: 12px;
+    padding: calc(env(safe-area-inset-top) + 10px) 16px 10px;
+    border-bottom: 1px solid var(--line);
+  }
+  .sheet-head h2 { margin: 0; }
+  /* 设置页真正滚的那一块。左右 16px 和底部安全区都是从 .sheet 挪过来的
+     （那边 padding 已归零，账不能丢）。 */
+  #settings .sheet-body {
+    flex: 1 1 auto; overflow-y: auto;
+    padding: 14px 16px calc(env(safe-area-inset-bottom) + 18px);
+  }
   .row {
     display: flex; align-items: center; justify-content: space-between;
     gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line);
   }
   .row:last-of-type { border-bottom: none; }
+
+  /* **这一句不能省。** `hidden` 只是 UA 样式表里的一条 `display:none`，
+     而上面 `.row` 写了 `display:flex`——作者样式表压得住 UA 那一句（同一个道理
+     见 `#mirrorView[hidden]`、`.sheet .version[hidden]`）。
+     少了它，`.row` 上的 `hidden` 等于没写：元素照样撑开一段高度（2026-10-08 实测
+     358×70，`getComputedStyle` 回来还是 `flex`），于是设置里「电脑端界面」那一行
+     在进阶设置关着时照样露着。**改脚本没用**——脚本一直是对的，它确实把 hidden
+     设上了；漏的是这条兜底样式。 */
+  .row[hidden] { display: none; }
+
+  /* 权限档位那一块外面套了一层（#permBlock，服务拿不到时整块要藏起来）。
+     它下面**没有分割线**，而别的板块之间都有——2026-10-05 用户截图点名。
+     原因：别的板块的分割线都是「那一行自己的下边线」（.row 的 border-bottom），
+     而权限档位那层的最后一个元素是**那排按钮**（.seg，它自带边框），
+     那层自己没有下边线，所以两块之间是空的。
+
+     修法就照其他线的做法，一模一样：**让这一块自己带一条下边线，
+     并且先留出 12px**——线因此落在「按钮 + 12px」处，
+     和别处的线一样居中在留白里（下一行也有 12px 上边距）。
+     为什么不给「繁忙」那行加 border-top：那会让线紧贴着按钮的边框，
+     看起来只是按钮框变粗，不像一条分割线。
+     藏起来时（hidden = display:none）这条线自然不画，
+     上面「字体大小」那条线正好接上，不会两条挤在一起。 */
+  #permBlock { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
+  /* 权限档位里面那行标签**不要自己的下边线**（2026-10-05 用户截图点名：
+     「权限档位格子的上缘有一条粗线」）。
+     原因：那行标签按 .row 的规矩带着一条下边线，而它下面紧挨着的就是**按钮框**
+     （.seg 自带整圈边框）——两条 1px 的线贴在一起，看起来就是一条粗线。
+     实测：上缘 2 个 CSS 像素、下缘 1 个，粗细不一样。
+     为什么那行没被「最后一个不画下边线」那条规则管到：权限档位这一层里，
+     按钮框排在标签**后面**，所以标签那行不算「最后一个」。
+     它本来也不该有线——它是下面那排按钮的标签，中间画一条分割线没有道理。 */
+  #permBlock .row { border-bottom: none; }
   .row .label { font-size: 15px; }
   .row .hint { font-size: 12px; color: var(--muted); margin-top: 2px; }
   /* flex-shrink: 0 不能省。它是弹性项，左边的说明文字一长就会被压缩；
@@ -868,15 +1186,133 @@
     font-size: 13px; cursor: pointer;
   }
   .seg button.active { background: var(--ice); color: var(--on-act); }
+  /* 权限档位那排按钮要**撑满**它的框（2026-10-05 用户截图点名：「自动审查那一格
+     背景颜色没填满」）。
+     根因：别的 .seg 都套在 .row 里（那是弹性容器），所以框会缩到内容那么宽，
+     按钮正好填满；而权限档位这一排是 #permBlock 的直接子元素，**在块级上下文里**
+     → 框被拉成整行宽，而四个按钮只占自己文字那么宽，右边就空出一条
+     （实测约 10 个 CSS 像素），露出来的是框自己的底色，看着像那一格没填满。
+     修法：让它们按内容分配、再把多出来的空间摊平（1 1 auto）。
+     不用 flex: 1 1 0（四等分）——「工作区内修改」六个字比别的宽，
+     强行等分会把它挤到换行。 */
+  #segPerm button { flex: 1 1 auto; }
   select, .btn {
     padding: 8px 12px; border-radius: var(--r); border: 1px solid var(--line);
     background: var(--panel-2); color: var(--fg); font: inherit; font-size: 14px;
   }
   .btn { cursor: pointer; }
   .btn.primary { background: var(--act); border-color: var(--act); color: var(--on-act); font-weight: 600; }
+  /* 页眉里那个动作按钮（关闭）比通用 .btn 紧凑一档。
+
+     通用 .btn 是给面板正身用的：上下各 8px 内边距 + 14px 字，约 39px 高。
+     摆进页眉就比标题高出一大截——**整条页眉的高度其实是它顶出来的**，而且那个
+     方框比标题那行字高出一圈，看着又大又不像跟标题对齐。
+     2026-10-05 用户两次报到这里：先说设置页「页眉高度太大」，又说插件页
+     「关闭按钮太大了，没跟插件两个字对齐」。
+
+     **四个面板页眉共用这一档**（统一操作面板 / 子智能体 / 插件页 / 设置页），
+     免得一处收了一处没收、几个面板长得不一样。
+     通用 .btn 的内边距一个字没动——它别处到处在用，动它等于整页跟着变。 */
+  .ops-head .btn, .sa-head .btn, .sheet-head .btn {
+    padding: 5px 11px; font-size: 13px;
+  }
   .sheet .foot { margin-top: 18px; display: flex; gap: 10px; }
+  /* 设置抽屉最底下那行 DSH 版本：做成一条**收尾的分隔线**——两侧各一条细线、
+     版本号居中，把这一屏收住，免得孤零零一行小字吊在最后（2026-10-05 用户要的
+     「加一点设计感，比如两侧加横线」）。
+     线用现成的 --line（细线色），不新造令牌、不加关键帧、不碰圆角——这一屏的
+     层次本来就靠这条 1px 细线建立，别为了一行版本号另起一套。
+
+     `[hidden]` 那一句**不能省**：下面写了 display: flex，而作者样式表里的
+     display 会盖掉 HTML `hidden` 自带的 display: none——少了它，问不到版本时
+     这一行照样显示，变成一条空的分隔条。 */
+  .sheet .version {
+    display: flex; align-items: center; gap: 10px;
+    padding: 18px 0 6px; font-size: 12px; color: var(--muted);
+    letter-spacing: 0.04em;
+  }
+  .sheet .version[hidden] { display: none; }
+  .sheet .version::before,
+  .sheet .version::after {
+    content: ""; flex: 1 1 0; height: 1px; background: var(--line);
+  }
   .sheet .foot .btn { flex: 1 1 0; text-align: center; }
 
+  /* ---------- 「电脑端设置界面」那一整屏（内嵌，不跳转） ----------
+     原委写在页面里 `#mirrorView` 上面那段注释里：跳转那条路在用户手机上三次都没成，
+     所以改成嵌在这一页里——点一下只是把这一层显示出来、给里面的框设个地址，
+     **浏览器没有任何东西可以拦**。
+
+     层级 80：要盖住设置抽屉（50）和那些动态小面板（70），但**必须在**授权卡（300+）
+     和门禁页（100）**下面**——那两样是打断性的，任何时候都该在最上面。
+
+     `[hidden]` 那一句不能省：下面写了 display: flex，作者样式表里的 [hidden] 会被压住
+     （和 `.sheet .version[hidden]` 同一个道理，见上面那段注释）。 */
+  #mirrorView {
+    position: fixed; inset: 0; z-index: 80;
+    /* 高度跟「看得见的那块」走，而不是跟「地址栏收起时的那块」走（2026-10-07）。
+       `inset:0` 的高度是按**大视口**算的（地址栏收起时的高度），而手机地址栏拉出来之后，
+       真正看得见的只有下面那一截——于是框比可视区高，里面那份界面在框里**垂直居中**，
+       底边就落到屏幕外面去了（用户报过「面板底边被切掉」）。
+       `100dvh` 跟可视区走。**这条是「从参考插件学来、但落点要换」的典型**：它给官方面板补
+       `max-height:calc(100dvh - 32px)`，可那个 `dvh` 是**框里面**的，框里的可视区单位等于
+       框自己的高，等于白写；要治这个病只能写在**外层**这一页——这里 `dvh` 才是真的。
+       老浏览器不认 `dvh` 会丢掉这一条，退回现在的行为，不会崩。 */
+    height: 100dvh;
+    display: flex; flex-direction: column;
+    background: var(--bg);
+  }
+  #mirrorView[hidden] { display: none; }
+  .mv-bar {
+    flex: 0 0 auto; display: flex; align-items: center; gap: 10px;
+    padding: 10px 12px;
+    padding-top: calc(10px + env(safe-area-inset-top, 0px));
+    border-bottom: 1px solid var(--line);
+    background: var(--bg-top);
+  }
+  .mv-title { flex: 1 1 auto; font-size: 14px; color: var(--fg); }
+  #mirrorFrame {
+    flex: 1 1 auto; width: 100%; border: 0; background: var(--bg);
+    /* 底部让开手势条（2026-10-07 从「被镜像的那份页面」搬回来的）。
+       这条原先是写在 lib/mirror.js 的 ADAPT_CSS 里，而那段样式是**注进框里那份文档**的
+       ——`#mirrorFrame` 是本文件（外层）的元素，两个不同的文档，所以那条规则一个像素
+       都没生效：活服务上量过，框的 `padding-bottom` 是 0px，被镜像的那份 HTML 里反倒
+       躺着一份没人用的 `#mirrorFrame` 规则（官方界面里根本没有这个 id）。
+       顶部那条不归这里管：外层横条 .mv-bar 自己写了 padding-top。 */
+    padding-bottom: env(safe-area-inset-bottom, 0px); box-sizing: border-box;
+  }
+
+  /* ---------- 统一操作面板（输入框旁边那一个入口点开的东西） ----------
+     骨架和设置抽屉**是同一套**：同一个 `#xxx.open` 即时显隐、同一个贴底的 `.sheet`
+     （它自带 max-height / overflow-y / safe-area 那三样，窄屏顶不出去），不新建样式体系。
+     这里独有的只有上面两段小节头和那个筛选框；指令行沿用 .cmd-menu 那一套。 */
+  #ops {
+    position: fixed; inset: 0; background: var(--scrim);
+    display: none; align-items: flex-end; z-index: 50;
+  }
+  #ops.open { display: flex; }
+  .ops-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
+  .ops-head h2 { flex: 1 1 auto; margin: 0; }
+  /* 两个动作平分一行。都是既有 .btn（细边框 + --r 圆角 + --panel-2 底），
+     没有主按钮——这一屏不放强调色（#settings 那一屏已经有一处「完成」）。 */
+  .ops-acts { display: flex; gap: 10px; }
+  .ops-acts .btn { flex: 1 1 0; text-align: center; }
+  .ops-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
+  .ops-files[hidden] { display: none; }
+  /* 「调用指令」这个小标题**要带上前面的类**，不能只写 .ops-sub。
+     2026-10-05 用户截图点名：「调用指令和上方选文件拍照那一行要有点留白」。
+     根因：这里本来写着 margin: 20px 0 10px，但上面有条 `.sheet h2 { margin: 0 0 14px }`
+     ——它是「一个类 + 一个元素」(0,1,1)，比只有「一个类」的 .ops-sub (0,1,0) 优先级高，
+     于是 margin-top 被盖成 0，那 20px 从来没生效过，标题就贴着按钮。
+     写成 .sheet .ops-sub (0,2,0) 才压得住那条规则。 */
+  .sheet .ops-sub { margin: 20px 0 10px; font-size: 16px; }
+  .ops-filter {
+    width: 100%; padding: 9px 12px; border-radius: var(--r); border: 1px solid var(--line);
+    background: var(--panel-2); color: var(--fg); font: inherit; font-size: 16px;
+  }
+  /* 列表自己滚，别把整张抽屉撑出屏幕。 */
+  .ops-cmds { margin-top: 8px; max-height: 40vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
+
   /* ---------- token 输入 ---------- */
   #gate { position: fixed; inset: 0; background: var(--bg); z-index: 100;
           display: none; flex-direction: column; justify-content: center;
@@ -955,17 +1391,222 @@
     width: 18px; height: 18px; fill: none; stroke: currentColor;
     stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
   }
+
+  /* ---------- 「回到底部」浮标（2026-10-08） ----------
+     用户要的是「瞬间回到底部的按钮，圈子里一个简约的往下箭头」，参考电脑端 DSH 那颗。
+
+     形状照电脑端那颗抄：圆底 + 一根下折线（矢量 svg，不是字形、不是 emoji——
+     字形换个机型就可能变成豆腐块）。尺寸不一样：电脑端 34×34，这一颗 38×38
+     （第四轮缩到 27、第五轮回到 31，见下面那两段）。
+     圆角走 999px 那一档，不新造档位。
+
+     ---- 第二轮：用户要「克制而高级的主题适配」，外观只动下面这三处 ----
+
+     ① 边界从「画上去的一根 1px 线」改成「从面里长出来的一道 0.5px 环」：
+        去掉 border，环改由 box-shadow 的第一层 `0 0 0 .5px` 来画。这不是自创——
+        电脑端那套高度系统本来就长这样（dsh-client-ui-theme 里那道 elevation-stroke
+        就是「0 0 0 .5px 加描边色」，官方那颗浮标挂的 elevation-panel 第一位正是它）。
+        0.5px 在 2 倍屏上正好落成 1 个物理像素：比 1px 细一半，看得见轮廓，
+        又找不到那根线。颜色仍走 --line（全页的细线都用它）。
+
+     ② 投影换轻一档，深色单独处理：
+        · 浅色用 --sh-1，不再用 --sh-2。--sh-2（0 2px 8px / 12%）是这两档里更重的
+          一档，压在这颗 38px 的小圆上像贴了块膏药；--sh-1（0 1px 2px / 7%）
+          同一个蓝调，更小更柔。官方那套的第二三层（0 3px 8px @3% 加 0 0 16px @2%）
+          比这更浅也更宽——要贴到那个程度就得现调一组新数，与这一轮「克制」的调子
+          相悖，所以取现成的那一档。
+        · 深色把投影层整个去掉。实测它在深色下等于零：浮标落在页面底色渐变最暗的
+          那一头（近黑的 #070b11），再压一层黑色投影，同一像素开关投影前后最多差
+          5/255（整幅平均 0.07/255）。层次改由**底色本身**立——实测按钮的 --panel #121a25 比它脚下的
+          背景 #070b11 亮 (+11,+15,+20)，本身就已经高出一档，和官方那颗（深色下用
+          比背景亮的浮层底色）是同一个道理。底线是静息色不能改成 --panel-2：
+          那是这颗按钮**按下**时的底色，拿它当静息色，按下去就没有反馈了。
+
+     ③ 看得见的圆缩到 38，手指的范围反而变大：原来 42×42 是「看得见多大就点得到
+        多大」，而 42 其实低于常说的那条 44 下限；现在圆缩到 38，看不见的热区用
+        ::before 撑到 46×46。图标等比缩到 14.5px（16 × 38/42），箭头在圆里占的比例
+        和原来一样，既不空也不挤。
+
+     颜色**一个令牌都不新造**，全用主屏现成的那几个：底 --panel、线 --line、
+     图标 --fg、按下 --panel-2、投影 --sh-1。两套主题各自成对。
+
+     ---- 第四轮（2026-10-08）：看得见的面积减半，同时往左让开滚动条那一条 ----
+
+     用户两条原话：「这个按钮还可以再缩小一半的面积」「如果旁边滚动条显示的话，
+     点不下去，是否可以触压位往左侧再拖拽一些」。两件事分开算：
+
+     ① 面积减半 = 直径乘 √2 的一半（0.707），不是把直径砍一半。
+        38 × 0.707 = 26.87 → **27**。（真把直径砍成 19，面积就只有四分之一，
+        那不是「减半」，是「小得离谱」。）
+        看得见的地方小一半，可点的地方一点没缩：热区仍 **≥44**（46 → 45，见 ::before），
+        这是手指那条下限，不能跟着圆一起缩。
+        图标跟着等比缩：16 × 27/38 = **10.3px**——占圆的比例和 38 那会儿一模一样，
+        所以圆里既不空也不挤。
+
+     ② 往左让开滚动条（这条更要紧，用户是点不下去才说的）。两件事都在**活页面**上量过：
+        · 手机仿真（= 手机上的实际形态）下 main 的 `offsetWidth - clientWidth` **= 0**：
+          滚动条是**覆盖式**的，版面上一个像素都不占，内容区照样通到最右边 390。
+          所以按钮的右沿天生停在 390 − 14（main 的 padding-right）= **376**，
+          右边只剩 14px——滚动条一冒出来就贴在那一条上，正好压住按钮右半边。
+        · 换一个**经典式**（占宽度）的形态量，滚动条占的正是**最右边那条 15px**
+          （x 375..390，盒模型与像素两边对得上，见 ui.test.mjs 里那条断言）。
+          也就是：不管哪一种形态，那条带都从 375 起头。
+        于是往左挪的量按**实测那条带**算，不拍脑袋：
+          滚动条带左沿 375 —— 热区右沿要退到 372（留 3px 余量，免得取整蹭上去）
+          —— 热区比圆右侧多出 9px（inset −9）—— 所以圆的右沿要退到 363。
+          现在圆右沿是 376，**往左 13px** 正好落在 363。
+        落法只有一处：`.to-bottom` 自己的 `margin-right: 13px`。槽是 flex-end，
+        给它一个右外边距就等于把它从槽的右沿往里推 13px。
+        sticky 那套机制、main 的布局、滚动条的样式，一行都没碰。
+        （经典式形态下滚动条本来就把内容区挤窄 15px，那时圆右沿是 361，
+          再让 13px 是 348——只会更宽裕，不会挤到别处。）
+
+     为什么不用脚本算滚动条有多宽：覆盖式的宽度脚本根本量不到（上面那个 0 就是证据），
+     而且 sticky 的位置本来就不该由脚本碰。按实测到的那条**最宽**的带留出固定余量，
+     两种形态都盖得住，这才是稳的写法。
+
+     ---- 第五轮（2026-10-08）：用户说「有点缩得太小了，增大 15%」 ----
+
+     ① 「15%」按**看得见的直径**读：27 × 1.15 = 31.05 → **31**。
+        （另一种读法是「面积增大 15%」，那只有 27 × √1.15 = 28.96 → 29。
+          两个读法只差 2px；这颗圆刚被上一轮削到 27，取大的那个才叫「不再偏小」。）
+        图标继续等比：10.3 × 31/27 = **11.8px**——箭头在圆里占的比例，和 38、27 那两轮
+        一模一样（16/38 = 10.3/27 = 11.8/31），所以圆里既不空也不挤。
+        `margin-top` 必须跟着等于 −31：它是负的自身高度，槽高 0，只有相等下沿才落在槽线上。
+
+     ② 热区一个数都没动，它自己长大了：31 + 9×2 = **49**（44 那条手指下限照旧守住）。
+        这正是 inset 不必跟着改的原因——圆缩时热区不许跟着缩，圆长时它跟着长是白赚的。
+
+     ③ **第四轮那条「让开滚动条」没有被弄坏，因为要守的是右沿、不是宽度**：
+        按钮走 flex-end，直径一变只往**左**边长；右沿的位置只由
+        main 的 padding-right（14）加按钮自己的 margin-right（13）定，
+        所以圆的右沿仍是 376 − 13 = **363**，热区再往右 9px 是 **372**，
+        离滚动条那条带（左沿 375）仍是 3px。margin-right 一个字没动。
+
+     位置的关键在 .to-bottom-slot：它是 main 的最后一个孩子，靠 `position: sticky`
+     贴在**滚动口下沿往上 16px** 的地方。这一手的好处是位置不用脚本算——
+     main 的下沿天生就是输入区那一摞（附件条 / 指令菜单 / 底栏）的上沿，
+     所以输入框长高、附件条冒出来、指令菜单弹开，它都跟着一起让位，永远不会盖住
+     输入框和发送键；底部那条手势条也由 footer 自己的 safe-area 内边距让开了，
+     它比输入区还高一截，离手势条更远。 */
+  .to-bottom-slot {
+    position: sticky; bottom: 16px; z-index: 5;
+    height: 0; display: flex; justify-content: flex-end;
+    /* 这一条不能省：槽是通栏的，不设 none 就会在底边上拦掉底下内容的点击。
+       按钮自己再打开 auto，所以只有那一个圆圈可点。 */
+    pointer-events: none;
+  }
+  .to-bottom {
+    /* position 只是为了给下面那片透明热区一个定位原点；左右位置由 margin-right 让出来。 */
+    position: relative;
+    /* margin-top 是负的自身高度：按钮的下沿才会正好落在槽那条线上（槽高 0）。
+       第五轮起圆是 31（第四轮 27 × 1.15），这个数就得跟着是 -31——
+       留着 -27 会把它整圈**下**移 4px（下沿掉到槽线下面去）。
+       margin-right: 13px 是第四轮那条「让开滚动条」的全部落法，数怎么来的见上面；
+       它让的是**右沿**，而右沿只由 14 + 13 定，跟直径无关——所以这一条不用重算。 */
+    width: 31px; height: 31px; margin-top: -31px; margin-right: 13px; padding: 0;
+    border: 0; border-radius: 999px;
+    background: var(--panel); color: var(--fg);
+    /* ① 第一层就是那道 0.5px 环；深色到此为止（② 的深色那半：投影在那儿等于零）。 */
+    box-shadow: 0 0 0 .5px var(--line);
+    cursor: pointer; pointer-events: auto;
+    display: flex; align-items: center; justify-content: center;
+    /* ---- 第三轮（2026-10-08）：出现 / 消失各来一段 130ms 的淡入淡出 ----
+       用户原话「这个按键消失的时候应该有个渐出效果，官方 pc 端是做了的」。
+       真去量了电脑端那份界面（/mini/mirror 上逐帧采 opacity + MutationObserver 看 DOM），
+       结论是**两半都对一半**，两头都得记下来：
+
+       · 电脑端那颗按钮**身上确实挂着一条 `opacity .13s ease`**——但它不是 ChatView 自己的
+         样式，是外形（skin）那层的基础按钮规则给的（选择器是
+         `html[data-dsh-skin="claude"] button, …[role="button"], …`，实测这条很清楚地匹配到
+         那颗浮标）。所以「官方做了渐出」这句话在**声明**上是对的。
+       · 可它**画面上从来没淡过**：ChatView 是 `!followingTail && <div class=toBottomSlot>…`
+         的条件挂载，一滚到底整块节点直接被 React 摘掉，那条 transition 根本没有机会跑。
+         活服务上逐帧采样实测：消失前后只有两个状态（t≈1.5ms 时 opacity=1 且 isConnected=true，
+         t≈18.6ms 时节点已 isConnected=false、computed 全空），中间**一帧过渡值都没有**；
+         MutationObserver 同一时刻记下的是 toBottomSlot 被 childList 整块移除，没有任何
+         「先加类、过一会儿再摘」的动作。也就是说：**设计语言里那一档是 130ms ease，
+         但官方的手法是硬卸载**。
+
+       所以这里按用户的要求把它补上，并且**只补官方自己没接上的那一段**：时长与缓动
+       直接取官方那颗按钮身上现成的那一档 `130ms / ease`，不另起一个数。
+       方向对称：消失淡出、出现淡入，两边同一档，不做缩放、不做弹跳。
+
+       为什么不用 `display:none` 收：`display:none` 一挂上，元素就不在渲染树里了，
+       过渡根本无从谈起——所以「用 display 收尾」和「要一段淡出」这两件事天生互斥。两条正路：
+         (a) 脚本两端配合（先淡出，等过渡结束再置 hidden）；
+         (b) `transition-behavior: allow-discrete` + `@starting-style`。
+       这里走的是第三条、也是同一件事的**更保险写法**：藏起来用
+       `visibility: hidden` + `pointer-events: none` 代替 `display:none`。
+       理由有两条，都是实打实的：
+         · 兼容面。`allow-discrete` / `@starting-style` 要 Chrome 117 / Safari 17.4 /
+           Firefox 129 往上；手机浏览器五花八门，老一档的机器上那两条会被整条丢掉，
+           结果就是**一点淡出都没有**——正好回到用户抱怨的那个状态。而 `visibility`
+           的过渡是十年以上的老写法，哪台机器都认。
+         · 「过渡走完才真正藏起来」这件事由浏览器替我办：`visibility` 的插值规则很特别，
+           只要两端有一端是 `visible`，整个过渡期间它就一直算 `visible`，
+           到进度 1 才翻成 `hidden`。所以淡出那 130ms 里它照样画在屏幕上，
+           走完就真的不可见——等于把 (a) 交给浏览器做，脚本一行都不用加，
+           `paintToBottom` 仍然是「只改 hidden」那一个动作（页面测试也是这么钉的）。
+
+       `visibility` 那条也顺手把「出现」这半边解决了：元素在藏着的时候**仍然有计算样式**
+       （因为它不是 display:none），opacity 老老实实是 0，所以一露出来就是 0→1 的淡入，
+       不需要 `@starting-style` 去给一个起点。
+
+       最后一句：这里只有 `transition`，没有关键帧、没有 animation——
+       它是一颗按钮，不是一段表演（`test/ui.test.mjs` 里那条护栏就是钉这个的）。 */
+    transition: opacity .13s ease, visibility .13s;
+    opacity: 1; visibility: visible;
+  }
+  /* ③ 手指要的那 44 由这片**看不见**的热区补上：圆 31，热区 49。
+     绝对定位 + 负 inset 让它溢出去，不参与版式（槽的高度还是 0，位置照旧全交给
+     CSS 的 sticky）；它是按钮自己的伪元素，命中的点事件目标仍然是按钮，所以
+     「只有那一个圆圈可点」这条规矩没破，只是那个圈比看得见的那个大 9px。
+     inset 从 −4 放到 −9 是**跟着第四轮那个 27 一起算的**：27 + 9×2 = 45 ≥ 44。
+     第五轮圆长到 31 之后一直是 31 + 9×2 = 49 ≥ 44，所以这个数**不用动**——
+     热区跟着圆一起长是白赚的，而它绝不会跟着圆一起缩（那是手指的下限，不是外观）。 */
+  .to-bottom::before {
+    content: ''; position: absolute; inset: -9px; border-radius: 999px;
+  }
+  /* ② 浅色那边：环比深色**深一档**，再叠第二层更安静的那一档投影（深色两层都不动）。
+     为什么不用现成变量：浅色这套色阶里，--line（相对亮度 0.747）往下一格是空的——
+     再往下就只剩 --dim（0.298）和 --muted（0.207），一用就把「一道细线」变成「一圈描边」
+     （实测它们相对底色要差 85 / 109 个灰阶、对比度 2.4 / 3.1:1，放在这颗小圆上太重）。
+     所以在 --line 与 --fg（正文色，同一个蓝调家族）之间取一成的 --fg：
+     实测环相对相邻底色由 11/255 变成 28/255（对比度 1.096 → 1.292:1），
+     刚好从「几乎看不见」跨成「看得见的一道细线」，离 --dim 那一档还差着三倍。
+     颜色仍全部来自现成令牌，不写死任何色值；深色那边一个数没动，还是 --line。 */
+  [data-theme="light"] .to-bottom {
+    box-shadow: 0 0 0 .5px color-mix(in srgb, var(--line) 90%, var(--fg)), var(--sh-1);
+  }
+  .to-bottom:active { background: var(--panel-2); }
+  /* 藏起来的那个状态。**这一句不能省**：作者样式表里的 display:flex 会顶掉 hidden 自带的
+     display:none，所以「藏」这件事必须由我们自己在这条规则里写实。
+     原来写的是 display:none，现在换成下面这三条（为什么换见上面那段长注释）：
+       · opacity: 0 —— 淡出的终点，130ms 里从 1 走到 0；
+       · visibility: hidden —— 过渡期间它一直是 visible（visibility 的插值规则），
+         走完才翻成 hidden，所以真正不可见发生在淡出**结束之后**；
+       · pointer-events: none —— 这一条**不进过渡**，属性一挂上就立刻生效，
+         所以淡出那 130ms 里它已经点不到了；淡完之后它也不是一层透明的可点层。
+     版式一个像素都没动：槽高是 0，按钮靠 margin-top 负的自身高度挂在槽线上方，
+     这两个状态里它的盒子一样大，所以不产生任何位移。 */
+  .to-bottom[hidden] { opacity: 0; visibility: hidden; pointer-events: none; }
+  /* 箭头等比缩：10.3 × 31/27 = 11.8。占圆的比例和 27、38 那两轮一样，不空也不挤。 */
+  .to-bottom svg { width: 11.8px; height: 11.8px; }
 </style>
 <script>
   // 主题必须在**首屏画出来之前**定下来，否则浅色手机打开会先闪一下深色底。
   // 所以这一段留在 <head> 里、样式表后面，**别挪到页面底部那段脚本区去**。
   (function () {
     try {
-      var pick = localStorage.getItem('dshMiniTheme') || 'dark';
+      var pick = localStorage.getItem('dshMiniTheme') || 'light';
       var dark = !window.matchMedia || window.matchMedia('(prefers-color-scheme: dark)').matches;
-      document.documentElement.setAttribute('data-theme',
-        pick === 'auto' ? (dark ? 'dark' : 'light') : pick);
-    } catch (e) { /* 无痕模式下 localStorage 会抛；按默认深色走，不影响页面 */ }
+      var use = pick === 'auto' ? (dark ? 'dark' : 'light') : pick;
+      document.documentElement.setAttribute('data-theme', use);
+      // 首屏时也更新状态栏颜色，否则浅色页配深色状态栏会闪一下
+      var meta = document.querySelector('meta[name="theme-color"]');
+      if (meta) meta.setAttribute('content', use === 'light' ? '#eaf3fc' : '#0a0f16');
+    } catch (e) { /* 无痕模式下 localStorage 会抛；按默认浅色走，不影响页面 */ }
   })();
 </script>
 </head>
@@ -1048,6 +1689,22 @@
        排队和鲸鱼娘是两件事——前者是「还有几条在等」，后者是「她正在忙」，
        别因为后者要藏就把前者一起藏了。 -->
   <div class="queue" id="queue" hidden></div>
+
+  <!-- 「回到底部」浮标（2026-10-08 用户要求）。样子参考电脑端 DSH 那颗
+       （ChatView.module.css 的 .xz4KEq_toBottom：34×34 圆底 + 一根 14×14 的下折线 svg），
+       位置、尺寸和配色按手机这页的规格重做，见样式表里那一段。
+
+       **它必须留在 #reply 外面**：跟 #work 同一个道理——拼进重绘里的话，每次状态广播
+       都会把它重建一次，用户正按着它就没了。也**必须在 main 里面**：只有作为滚动口的孩子，
+       CSS 的 sticky 才贴得住（位置由 CSS 算，脚本一个像素都不碰）。
+
+       箭头路径原样抄自电脑端那颗图标（dsh-client-ui-primitives 的 IconChevronDownOutline），
+       没有自己重画：viewBox 0 0 16 16、1px 描边、fill:none、颜色走 currentColor。 -->
+  <div class="to-bottom-slot" id="toBottomSlot">
+    <button class="to-bottom" id="toBottom" type="button" aria-label="回到底部" hidden>
+      <svg viewBox="0 0 16 16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1"><path d="M4 6L7.29289 9.29289C7.68342 9.68342 8.31658 9.68342 8.70711 9.29289L12 6"/></svg>
+    </button>
+  </div>
 </main>
 
 <div class="attach-bar" id="attachBar" hidden></div>
@@ -1057,9 +1714,14 @@
 <div class="cmd-menu" id="cmdMenu" hidden></div>
 
 <footer>
-  <!-- 回形针。input 藏起来，按钮点它——iOS 上直接放一个 file input 样式很难统一。 -->
-  <button class="attach" id="btnAttach" type="button" aria-label="上传文件" title="上传文件">
-    <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg>
+  <!-- 统一入口。位置和尺寸一个像素都没动（还是原来回形针那个 42×42），改的只是点了之后
+       干什么：原来直接开文件选择器，现在开下面那张统一操作面板（文件 + 指令都在里面）。
+       input 藏起来，按钮点它——iOS 上直接放一个 file input 样式很难统一。 -->
+  <button class="attach" id="btnAttach" type="button" aria-label="添加文件或调用指令" title="添加文件或调用指令">
+    <!-- 图标是 DSH 桌面端那个鲸鱼（dsh-client-ui-primitives 的 FishLogo，
+           viewBox 0 0 23.16 17.04）。路径**原样抄自桌面端**，没有自己重画。
+           填色走 currentColor，所以跟着按钮的 var(--muted) 走，深浅两套主题各自适配。 -->
+      <svg viewBox="0 0 23.16 17.04" aria-hidden="true"><path d="M22.9168 1.43018C22.6713 1.31018 22.5658 1.53918 22.4223 1.65519C22.3733 1.69269 22.3318 1.74169 22.2903 1.78669C21.9317 2.1697 21.5127 2.42121 20.9657 2.39121C20.1657 2.34621 19.4827 2.59771 18.8787 3.20973C18.7502 2.45521 18.3236 2.0047 17.6746 1.71569C17.3351 1.56568 16.9916 1.41518 16.7536 1.08867C16.5876 0.856163 16.5421 0.597155 16.4591 0.341647C16.4061 0.187643 16.3536 0.0301382 16.1761 0.00363739C15.9836 -0.0263635 15.9081 0.135141 15.8326 0.270145C15.5306 0.822162 15.4136 1.43018 15.4251 2.0462C15.4516 3.43174 16.0366 4.53527 17.1991 5.3203C17.3311 5.4103 17.3651 5.5003 17.3236 5.63181C17.2441 5.90231 17.1501 6.16482 17.0671 6.43533C17.0141 6.60784 16.9351 6.64584 16.7501 6.57033C16.1121 6.30383 15.5611 5.90931 15.074 5.4328C14.2475 4.63328 13.5 3.75075 12.568 3.05973C12.349 2.89822 12.13 2.74822 11.9034 2.60522C10.9524 1.68169 12.028 0.923165 12.277 0.833162C12.5375 0.739159 12.3675 0.41615 11.5259 0.42015C10.6844 0.42365 9.91439 0.705658 8.93286 1.08117C8.78935 1.13767 8.63835 1.17867 8.48384 1.21267C7.59332 1.04367 6.66829 1.00617 5.70226 1.11517C3.88321 1.31768 2.43016 2.1777 1.36213 3.64575C0.0790928 5.4103 -0.222916 7.41536 0.146595 9.50642C0.535106 11.7105 1.66014 13.535 3.38869 14.9616C5.18125 16.4406 7.24581 17.1657 9.60138 17.0266C11.0319 16.9441 12.6245 16.7526 14.421 15.2321C14.874 15.4576 15.3496 15.5476 16.1381 15.6151C16.7456 15.6716 17.3306 15.5851 17.7836 15.4911C18.4931 15.3411 18.4441 14.6841 18.1876 14.5636C16.1081 13.595 16.5646 13.9891 16.1496 13.67C17.2061 12.42 18.8202 10.1979 19.3182 7.17235C19.3672 6.83834 19.4297 6.36783 19.4222 6.09732C19.4182 5.93231 19.4562 5.86831 19.6447 5.84931C20.1657 5.78931 20.6712 5.64681 21.1357 5.3913C22.4833 4.65528 23.0268 3.44624 23.1548 1.9972C23.1738 1.77569 23.1508 1.54668 22.9168 1.43018ZM11.1749 14.4736C9.15936 12.889 8.18184 12.3675 7.77832 12.39C7.40081 12.4125 7.46881 12.8445 7.55182 13.126C7.63882 13.404 7.75182 13.5955 7.91033 13.8396C8.01983 14.0011 8.09533 14.2411 7.80083 14.4216C7.15181 14.8231 6.02327 14.2866 5.97027 14.2601C4.65673 13.4865 3.5587 12.4655 2.78467 11.069C2.03715 9.72493 1.60314 8.28289 1.53164 6.74384C1.51264 6.37233 1.62214 6.24082 1.99215 6.17332C2.47916 6.08332 2.98118 6.06432 3.46769 6.13582C5.52476 6.43633 7.27581 7.35586 8.74385 8.8129C9.58188 9.64243 10.2159 10.634 10.8689 11.6025C11.5634 12.631 12.3105 13.611 13.262 14.4146C13.598 14.6961 13.866 14.9101 14.1225 15.0681C13.349 15.1546 12.058 15.1731 11.1749 14.4746L11.1749 14.4736ZM12.141 8.25988C12.141 8.09488 12.273 7.96338 12.439 7.96338C12.4765 7.96338 12.5105 7.97088 12.541 7.98188C12.5825 7.99688 12.6205 8.01938 12.6505 8.05338C12.7035 8.10588 12.7335 8.18088 12.7335 8.25988C12.7335 8.42489 12.6015 8.55639 12.4355 8.55639C12.2695 8.55639 12.141 8.42489 12.141 8.25988ZM15.1415 9.79893C14.949 9.87793 14.7565 9.94544 14.5715 9.95294C14.2845 9.96794 13.9715 9.85143 13.8015 9.70893C13.5375 9.48742 13.3485 9.36342 13.2695 8.97691C13.2355 8.8119 13.2545 8.55639 13.2845 8.40989C13.3525 8.09438 13.277 7.89187 13.0545 7.70787C12.8735 7.55786 12.643 7.51636 12.39 7.51636C12.2955 7.51636 12.209 7.47486 12.1445 7.44136C12.039 7.38886 11.9519 7.25735 12.035 7.09585C12.0615 7.04335 12.19 6.91584 12.22 6.89334C12.5635 6.69784 12.9595 6.76184 13.326 6.90834C13.6655 7.04735 13.9225 7.30236 14.292 7.66287C14.6695 8.09838 14.7375 8.21838 14.9525 8.54539C15.1225 8.8009 15.277 9.06341 15.3831 9.36392C15.4471 9.55142 15.3641 9.70493 15.1415 9.79893Z" fill="currentColor"/></svg>
   </button>
   <input type="file" id="filePick" hidden>
   <textarea id="input" rows="1" placeholder="说点什么…" enterkeyhint="send"></textarea>
@@ -1079,7 +1741,16 @@
 
 <div id="settings">
   <div class="sheet">
-    <h2>设置</h2>
+    <!-- 页眉。整屏之后「点外面关掉」没了，所以这里必须有一个一直看得见的关闭口
+         （滚到哪儿都在）；底部那个「完成」照样留着。
+
+         它在**滚动区外面**（里面那个 .sheet-body 才是滚动区）：这样页眉底下就是抽屉
+         本来那层毛玻璃，不用为它另铺一层底色——铺了会叠出更深的色，顶部一道色差。 -->
+    <div class="sheet-head">
+      <h2>设置</h2>
+      <button class="btn" id="btnSettingsClose">关闭</button>
+    </div>
+    <div class="sheet-body">
 
     <div class="row">
       <div>
@@ -1089,6 +1760,7 @@
       <div class="seg" id="segMode">
         <button data-mode="minimal">单帧</button>
         <button data-mode="chat">聊天</button>
+        <button data-mode="full">完整</button>
       </div>
     </div>
 
@@ -1105,6 +1777,18 @@
       </div>
     </div>
 
+    <!-- 字体大小：三档，存 localStorage，改 CSS 变量 --font-base -->
+    <div class="row">
+      <div>
+        <div class="label">字体大小</div>
+      </div>
+      <div class="seg" id="segFont">
+        <button data-font="small">小</button>
+        <button data-font="normal">标准</button>
+        <button data-font="large">大</button>
+      </div>
+    </div>
+
     <!-- 权限档位。整块由脚本填：这台电脑有哪些档位是**运行时读**的，一个都不写死。
          服务拿不到时整块不显示——它是附加能力，缺了遥控本身照常。 -->
     <div id="permBlock" hidden>
@@ -1117,6 +1801,23 @@
       <div class="seg" id="segPerm"></div>
     </div>
 
+    <!-- 繁忙时的发送行为（2026-10-05 用户要求搬进手机设置）。
+         PC 上「设置 → 通用 → 繁忙时的发送行为」就是它：智能体跑着的时候，
+         你发的那句话是排队等这一轮跑完，还是当场插进去让它调整方向。
+         **两端共用宿主那一份设置**——手机上改，电脑上也是这个值。
+         文案照抄 PC 词条表（settings.enter.*），一个字不自创。
+         读不到时整条藏起来（见 loadBusyEnter），不摆一个点了没用的开关。 -->
+    <div class="row" id="rowBusyEnter" hidden>
+      <div>
+        <div class="label">繁忙时的发送行为</div>
+        <div class="hint">智能体运行时发送按钮的行为</div>
+      </div>
+      <div class="seg" id="segBusyEnter">
+        <button data-busy="queue">排队发送</button>
+        <button data-busy="steer">插话发送</button>
+      </div>
+    </div>
+
     <!--
       这里原来有两行：「完成后提醒」和「语音输入」。
 
@@ -1181,10 +1882,109 @@
       <button class="btn" id="btnReconnect">重连</button>
     </div>
 
+    <div class="row">
+      <div>
+        <div class="label">插件</div>
+        <div class="hint">查看官方插件和已安装插件</div>
+      </div>
+      <button class="btn" id="btnPlugins">查看</button>
+    </div>
+
+    <!--
+      「进阶设置（电脑端界面）」（2026-10-06 用户要求）。
+
+      手机上这张遥控页是**专门为手机做的**，所以电脑上那些插件贡献的设置页它进不去。
+      这一项是退路：**把电脑端的界面整个搬过来看**——同一份界面，不迁移、不逐个适配。
+
+      **默认关，而且开着要付代价**：打开它 = 把这个令牌的权限从「我们那张手机页暴露的
+      那点事」扩到**整个电脑端设置面**（模型配置、凭据页、插件装卸、会话记录……）。
+      所以：默认关、后果写在提示里、开启要点两次（见下面 tapMirror）。
+
+      服务端没这个能力时（没拿到 DSH_WEB_URL）整行不显示——**不摆一个假的开关**，
+      和「繁忙时的发送行为」同一条口径。 -->
+    <div class="row" id="rowMirror" hidden>
+      <div>
+        <div class="label">进阶设置</div>
+        <div class="hint" id="mirrorHint">打开电脑上的 DSH 界面，改那些手机上没有的设置</div>
+      </div>
+      <div class="seg" id="segMirror">
+        <button data-mirror="on">开</button>
+        <button data-mirror="off">关</button>
+      </div>
+    </div>
+
+    <div class="row" id="rowMirrorOpen" hidden>
+      <div>
+        <div class="label">电脑端界面</div>
+        <div class="hint">电脑端dsh完整页面</div>
+      </div>
+      <button class="btn" id="btnMirrorOpen" type="button">打开</button>
+    </div>
+
     <div class="foot">
       <button class="btn" id="btnForget">清除 token</button>
       <button class="btn primary" id="btnClose">完成</button>
     </div>
+
+    <div class="version" id="dshVersion" hidden></div>
+    </div>
+  </div>
+</div>
+
+<!--
+  「电脑端设置界面」那一整屏：**嵌在这一页里，不跳转、不开新标签。**
+
+  ## 为什么最后做成内嵌（2026-10-06 用户三次实机报「点击打开没反应」）
+
+  前两版都想让它「打开」出去，都栽了：
+  · 第一版 `<a target="_blank">`：内嵌浏览器（微信这类）常把新标签直接拦掉；
+  · 第二版加了 JS 兜底（`window.open` 失败就同标签跳）：还是没反应——那些浏览器里
+    `window.open` 会「成功」返回一个对象，代码以为开好了就不再跳，而新标签开在后台；
+  · 第三版干脆用普通 `<a href>` 同标签跳（理论上拦不掉）：**用户那边仍然没反应**。
+
+  三次都在赌「跳转」这个动作本身。**这一版不赌了**：点一下只是把这一层显示出来、
+  给里面的框设个地址——没有跳转、没有新标签、没有弹窗，**浏览器没有任何东西可以拦**。
+  已经用真浏览器验过：那个界面**愿意被嵌**（不设「不许被嵌」的响应头，实测里面
+  标题、侧栏、欢迎页全都正常）。
+
+  另外整行都能点（不只右边那个按钮）——按钮只有 54×40，手指容易点偏。
+-->
+<div id="mirrorView" hidden>
+  <div class="mv-bar">
+    <span class="mv-title">电脑端界面</span>
+    <button class="btn" id="mirrorClose" type="button">返回</button>
+  </div>
+  <!-- 地址是点开那一刻才设的：没点之前一个字节都不加载。 -->
+  <iframe id="mirrorFrame" title="电脑端界面"></iframe>
+</div>
+
+<!-- 统一操作面板：输入框旁边那一个入口点开的就是它，上面「添加文件」、下面「调用指令」。
+     原来这两件事各有各的门（回形针直接开文件选择器、打 `/` 才弹指令菜单），手机上没人
+     知道打一个斜杠还能调指令。
+
+     外壳是设置抽屉那一套**一模一样**的写法（`#xxx.open` 即时显隐 + `.sheet` 贴底），
+     不新建样式体系；令牌、圆角、细边框也全是现成的。
+
+     它盖住整屏、贴着底边（和设置抽屉同一层），所以不和底栏抢位置；打开时先把键盘收起来，
+     不然手机键盘会把这张抽屉顶到看不见的地方。 -->
+<div id="ops">
+  <div class="sheet">
+    <div class="ops-head">
+      <h2>添加文件</h2>
+      <button class="btn" id="opsClose">关闭</button>
+    </div>
+    <div class="ops-acts">
+      <button class="btn" id="opsPick" type="button">选文件</button>
+      <button class="btn" id="opsShot" type="button">拍照</button>
+    </div>
+    <!-- 已选文件的去处和附件小条**是同一份数据**（state.uploads，同一个 renderAttach）。
+         这里画一遍是为了让用户在面板里就看得到自己带了什么，不必先关掉面板。 -->
+    <div class="ops-files" id="opsFiles" hidden></div>
+
+    <h2 class="ops-sub">调用指令</h2>
+    <input class="ops-filter" id="opsFilter" type="text" placeholder="筛选指令…"
+           autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false">
+    <div class="ops-cmds" id="opsCmds"></div>
   </div>
 </div>
 
@@ -1210,6 +2010,20 @@
   </div>
 </div>
 
+<!-- 插件页面（2026-10-04 用户要求：移动端设置里加插件入口）。
+     外壳和子智能体面板同一套（.sheet），显示官方插件和已安装插件（内置+第三方）。 -->
+<div id="plugins">
+  <div class="sheet">
+    <div class="sa-head">
+      <h2>插件</h2>
+      <button class="btn" id="pluginsClose">关闭</button>
+    </div>
+    <div class="sa-list" id="pluginsList">
+      <div class="sa-none sa-none-indent">正在读取插件列表…</div>
+    </div>
+  </div>
+</div>
+
 <div id="gate">
   <h1>需要访问令牌</h1>
   <p>在电脑上打开 DSH 的「设置 → 手机遥控」，用手机重新扫一次二维码就能进来。
@@ -1241,12 +2055,15 @@
     mode: localStorage.getItem('dshMiniMode') || DEFAULT_MODE || 'minimal',
     // 外观：'dark' | 'light' | 'auto'。默认深色——不给老用户换掉现在的样子；
     // 要浅色或跟着系统走，去设置页「外观」点一下。
-    theme: localStorage.getItem('dshMiniTheme') || 'dark',
+    theme: localStorage.getItem('dshMiniTheme') || 'light',
+    // 字体大小：'small' | 'normal' | 'large'。默认标准。
+    fontSize: localStorage.getItem('dshMiniFont') || 'normal',
     sound: localStorage.getItem('dshMiniSound') !== 'off',
     // 锁屏也能提醒（系统通知）。默认关着——它要用户主动点一下才会申请权限，
     // 不能替他决定。明文连接下这一项永远是空转的，见下面「锁屏也能提醒」那一段。
     notify: localStorage.getItem('dshMiniNotify') === 'on',
     running: false,
+    subagentsRunning: false,
     sessions: [],
     // 排队中的指令（[{ id, text, placement }]）。跑着任务时接着发的那几条排在这儿，
     // 由服务端每次取快照时从 agent 的收件箱现读，手机不自己记。
@@ -1272,6 +2089,24 @@
     // 「这份历史只到最近一段」（服务端读历史有上限时会给这一句）。
     historyTruncated: false,
     historyNote: '',
+    /**
+     * 执行轨迹（「完整」模式里的过程）：一组一轮，形状与服务端
+     * `GET /mini/api/trajectory` 的 `turns` 一字不差
+     * （`[{ turn, state, reason, entries:[…] }]`）。
+     *
+     * **它和 latest / history 是两回事**：思考正文只活在 `entries[].output` 里，
+     * 回答气泡那两条路（`state.latest` / `state.history`）一个字都不碰它——
+     * 这是 2026-09-27 用户定的边界（思维链一个字都不上气泡）。
+     *
+     * 只在「完整」模式订阅、只在那里画；切回单帧/聊天就退订，不再收也不再画。
+     */
+    trajectory: [],
+    trajectoryNote: '',        // 「这份轨迹不是全部」时服务端给的那句话（展示下一棒接手）
+    trajectoryTruncated: false,
+    trajectoryLoading: false,  // 服务端还在读会话记录（**不等于「没有过程」**）
+    trajectoryEpoch: '',       // 服务换了一代（重启）就不能再往旧的那份上面接
+    trajectorySeq: 0,          // 收到第几帧，用来认出「我漏了几帧」（只进不退）
+    trajectoryLive: '',        // 活片段：正在想的那一句（只有完整模式有值，落盘即清）
     // 斜杠指令的列表（在输入框里打 / 时弹出来的那个菜单）。
     // **按绑定的会话缓存**：指令表是每个会话一份的，而这个会话没在跑时服务端一条都
     // 读不到（回 ok:false + 一句话）。所以换了会话必须重取——否则用户点到的是上一个
@@ -1279,7 +2114,15 @@
     commands: null,        // null = 还没取到
     commandsError: '',     // 取不到时服务端给的那句话，原样显示给用户
     commandsFor: null,     // 上面这份数据是哪个会话的
-    commandsLoading: false // 正在取（挡住重复请求，见 loadCommands）
+    commandsLoading: false, // 正在取（挡住重复请求，见 loadCommands）
+    /**
+     * 「输入框里这一行曾经是一条指令」——点过面板/菜单里某一条之后，这里记着它的名字。
+     *
+     * 用来堵一个真缺口：点了一条要参数的指令，用户把 `/名字 ` 里的名字删掉、只留参数，
+     * 那一行就不再以 `/` 开头，会被当成普通提问发给模型，白花一次额度。
+     * 有这枚标记时，send() 会把这一行拦下来，让他补回名字或**清空输入框**（= 明确取消）。
+     */
+    pendingCommand: null
   };
   if (params.get('token')) {
     localStorage.setItem('dshMiniToken', params.get('token'));
@@ -1287,6 +2130,232 @@
     history.replaceState(null, '', location.pathname);
   }
 
+  /**
+   * ---------------- 执行轨迹：订阅与收帧（数据层） ----------------
+   *
+   * 轨迹**不走全量快照**：实测它的正文是回答正文的 90.7 倍（单轮最高约 946KB），
+   * 而 `event: state` 是「每条广播都发整份」。所以它走单独的增量帧
+   * （`event: trajectory`，每帧只带新加的几条和改了的几笔），且**只有「完整」模式的
+   * 连接才订**——不看这块的人一个字节都不付。
+   *
+   * 三件事一起看才完整：切到「完整」时订上并 GET 一次当前状态；切回单帧/聊天就退订；
+   * 断线重连把 clientId 和 `?full=1` 带在流地址上（服务端自动重新订上），重连后再
+   * GET 一次对齐——帧里的 epoch 变了就整个重拉。
+   *
+   * 本片到「收进 state.trajectory」为止；画法（三层折叠）在 renderFull 后面那一片。
+   * clientId / subscribedClientId 两个连接身份变量声明在下面 SSE 一节里——
+   * 那一节被测试整段抠出来跑，身份必须跟流地址待在一起才找得到。
+   */
+
+  /**
+   * 这一帧该不该接、接到哪一组。三道门：
+   * 不是「完整」模式不接（退订之后可能还有在路上的旧帧）；
+   * 不是当前这个会话不接（切会话了，旧会话的过程与新会话无关）。
+   * 没有这一组就立一个（turn 号是帧给的，组里 entries 往后只增不减）。
+   */
+  function trajectoryKeyOf(frame) {
+    if (state.mode !== 'full') return null;
+    if (frame.sessionId && state.boundSessionId && frame.sessionId !== state.boundSessionId) return null;
+    var turn = typeof frame.turn === 'number' ? frame.turn : null;
+    for (var i = 0; i < state.trajectory.length; i++) {
+      if (state.trajectory[i].turn === turn) return state.trajectory[i];
+    }
+    var group = { turn: turn, state: 'running', reason: null, entries: [] };
+    state.trajectory.push(group);
+    return group;
+  }
+
+  /**
+   * 把一条增量补丁贴到已有条目上。**只改补丁里真有的字段**——「停了」那种补丁不该
+   * 顺手把输出清空；截断信息是合并而不是替换（一条工具步可能参数超长、结果也超长）。
+   * 写法和 lib/trajectory.js 的 applyTrajectoryPatch 一致：两端对同一笔补丁的理解
+   * 必须一样，否则手机上会出现「明明有结果却还写着正在跑」。
+   */
+  function patchTrajectoryEntry(entry, patch) {
+    if (!entry || !patch) return;
+    if (typeof patch.state === 'string') entry.state = patch.state;
+    if (Object.prototype.hasOwnProperty.call(patch, 'output')) entry.output = patch.output;
+    if (Object.prototype.hasOwnProperty.call(patch, 'error')) entry.error = patch.error;
+    if (patch.truncated) {
+      entry.truncated = Object.assign({}, entry.truncated || {}, patch.truncated);
+    }
+  }
+
+  /**
+   * 一帧的落法，四步按顺序走：
+   *
+   * 1. **换代认新**：帧里 epoch 和手里记的不一样（服务重启过），旧的那份整份作废，
+   *    用 GET 重拉——旧代的 seq 在新代里毫无意义，硬拼会出现「凭空多出半截过程」。
+   * 2. **缺帧认补**：帧的 seq 比预期大出不止一格，中间丢过帧，GET 重拉；
+   *    seq 只进不退（重连后服务端可能从头再发一轮）。
+   * 3. **add 幂等**：同一条目按 id 认——收过就改成补丁，没收过才追加。
+   *    同一帧送两遍（重连重放）不会长出两份，这是「帧重复」的硬要求。
+   * 4. **组态只进结论**：一组的 running 是过程中的默认值，收下任何结论态就不再
+   *    被后面的 running 盖回去（结论到了之后又来一条旧的 running 帧，不算输）。
+   */
+  function applyTrajectoryFrame(frame) {
+    if (!frame || typeof frame !== 'object') return false;
+    var epoch = typeof frame.epoch === 'string' ? frame.epoch : '';
+    if (state.trajectoryEpoch && epoch && epoch !== state.trajectoryEpoch) {
+      state.trajectoryEpoch = epoch;
+      state.trajectorySeq = 0;
+      state.trajectory = [];
+      if (state.mode === 'full') requestTrajectory();
+      return false;
+    }
+    if (!state.trajectoryEpoch && epoch) state.trajectoryEpoch = epoch;
+    var seq = typeof frame.seq === 'number' ? frame.seq : 0;
+    if (seq > 0 && state.trajectorySeq > 0 && seq > state.trajectorySeq + 1) {
+      state.trajectorySeq = seq;
+      if (state.mode === 'full') requestTrajectory();
+      return false;
+    }
+    if (seq > state.trajectorySeq) state.trajectorySeq = seq;
+
+    var group = trajectoryKeyOf(frame);
+    if (!group) return false;
+
+    var add = Array.isArray(frame.add) ? frame.add : [];
+    for (var i = 0; i < add.length; i++) {
+      var raw = add[i];
+      if (!raw || typeof raw.id !== 'string' || !raw.id) continue;
+      var hit = null;
+      for (var j = 0; j < group.entries.length; j++) {
+        if (group.entries[j].id === raw.id) { hit = group.entries[j]; break; }
+      }
+      if (hit) {
+        patchTrajectoryEntry(hit, raw);
+      } else {
+        group.entries.push({
+          id: raw.id,
+          turn: typeof raw.turn === 'number' ? raw.turn : group.turn,
+          step: raw.step,
+          // 三种条目照单全收（think / say / tool）——旁白（say）是 2026-10-04 加的，
+          // 这里原来写死成两种，实时帧里的旁白会被画成「工具调用」空壳行，
+          // 等下一次整份对齐才变回正文段落（真机上就是「展现不对」）。
+          kind: raw.kind === 'think' || raw.kind === 'say' ? raw.kind : 'tool',
+          name: raw.name,
+          args: raw.args,
+          summary: raw.summary,
+          output: raw.output,
+          state: typeof raw.state === 'string' ? raw.state : 'running',
+          error: raw.error || null,
+          truncated: raw.truncated || null,
+          timestamp: raw.timestamp,
+        });
+      }
+    }
+    // 真条目进来了：活片段让位（服务端也会喊清，这里兜一道——影子不许盖住落定的字）。
+    if (add.length) state.trajectoryLive = '';
+    var upd = Array.isArray(frame.update) ? frame.update : [];
+    for (var k = 0; k < upd.length; k++) {
+      var patch = upd[k];
+      if (!patch || typeof patch.id !== 'string') continue;
+      for (var m = 0; m < group.entries.length; m++) {
+        if (group.entries[m].id === patch.id) { patchTrajectoryEntry(group.entries[m], patch); break; }
+      }
+    }
+    if (typeof frame.state === 'string' && frame.state !== 'running') {
+      group.state = frame.state;
+      group.reason = frame.reason || null;
+    } else if (group.state === 'running') {
+      if (frame.reason) group.reason = frame.reason;
+    }
+    return true;
+  }
+
+  /** 一帧到了：落进手里那份，只在「完整」模式下重画。 */
+  function receiveTrajectoryFrame(frame) {
+    if (!applyTrajectoryFrame(frame)) return;
+    render();
+  }
+
+  /**
+   * 用一份 GET 结果把手里那份**整个换掉**（不是往里合）：GET 是服务端按当前记录
+   * 重新汇总的全量视图，比任何增量拼接都新，换掉就不会「补丁叠在过期底稿上」。
+   * `loading` 如实收下——它说的是「还在读会话记录」，不是「没有过程」。
+   */
+  function setTrajectoryFromGet(view) {
+    if (!view || view.ok !== true) return;
+    state.trajectoryEpoch = typeof view.epoch === 'string' ? view.epoch : state.trajectoryEpoch;
+    state.trajectorySeq = typeof view.seq === 'number' ? view.seq : 0;
+    state.trajectory = Array.isArray(view.turns) ? view.turns : [];
+    state.trajectoryTruncated = view.truncated === true;
+    state.trajectoryNote = typeof view.note === 'string' && view.note ? view.note : '';
+    state.trajectoryLoading = view.loading === true;
+    render();
+  }
+
+  /**
+   * 拉一次当前过程。只在「完整」模式发；不是完整模式宁可什么都不说——去要一份
+   * 自己没订的数据，等于给服务端添一次白跑。读完只有两种岔路：是完整模式且还是
+   * 同一个会话才收下（发请求后切了会话/切了模式，这份就是旧账，直接丢），
+   * 读不到就把原因写出来，不说「没有过程」。
+   */
+  function requestTrajectory() {
+    if (state.mode !== 'full' || !state.token) return;
+    var sessionId = state.boundSessionId;
+    if (!sessionId) {
+      state.trajectory = [];
+      state.trajectorySeq = 0;
+      state.trajectoryLoading = false;
+      return;
+    }
+    state.trajectoryLoading = true;
+    api('/mini/api/trajectory?sessionId=' + encodeURIComponent(sessionId))
+      .then(function (view) {
+        if (state.mode !== 'full' || state.boundSessionId !== sessionId) return;
+        setTrajectoryFromGet(view);
+      })
+      .catch(function () {
+        if (state.mode !== 'full' || state.boundSessionId !== sessionId) return;
+        state.trajectoryLoading = false;
+        state.trajectoryNote = '读不到这个会话的过程。';
+        render();
+      });
+  }
+
+  /**
+   * 模式开关的订阅侧动作，跟着「显示模式」按钮走：
+   *
+   * - 切到「完整」：连流时没带 `?full=1`（连流那一刻不是完整模式）就得补一次
+   *   POST 订上，然后 GET 一次把手里的换成当前状态；已经订过就只 GET 对齐。
+   * - 切走：POST 退订，同时把身份清掉——服务端那条连接已经不再推了，
+   *   手里这个「已订」的记号必须同步作废，否则下次切回来会误以为还订着。
+   * - POST 回 404：这条流已经不在了（服务重启或断流没重连），立刻重连一次；
+   *   重连的地址自带 `?full=1`（当前就是完整模式），服务端会重新把这条连接订上。
+   *   重连成功与否都不用在这里补救——`open` 里那一套会再走一遍。
+   */
+  function syncTrajectorySubscription() {
+    if (!state.token) return;
+    var want = state.mode === 'full';
+    if (!want) {
+      if (subscribedClientId) {
+        var was = subscribedClientId;
+        subscribedClientId = '';
+        api('/mini/api/trajectory/subscribe', {
+          method: 'POST',
+          body: JSON.stringify({ clientId: was, on: false }),
+        }).catch(function () { /* 断了就断了：服务端本来就会随连接清理 */ });
+      }
+      return;
+    }
+    if (subscribedClientId) {
+      requestTrajectory();
+      return;
+    }
+    api('/mini/api/trajectory/subscribe', {
+      method: 'POST',
+      body: JSON.stringify({ clientId: clientId, on: true }),
+    }).then(function () {
+      if (state.mode !== 'full') return; // 刚要订又切走了，回包当没看见
+      subscribedClientId = clientId;
+      requestTrajectory();
+    }).catch(function (err) {
+      if (err && err.status === 404) connect();
+    });
+  }
+
   var $ = function (id) { return document.getElementById(id); };
   var mainEl = $('main'), replyEl = $('reply'), inputEl = $('input');
   var dotEl = $('dot'), statusEl = $('status');
@@ -2024,13 +3093,30 @@
     if (list.length > shown) nodes += '<div class="q-node"><i></i><b>…</b></div>';
     var rows = '';
     for (var i = 0; i < list.length; i += 1) {
+      // 插话和排队**要分得出来**（2026-10-06）：服务端每条都带 placement，
+      // `next-step` 是插话（下一个步骤边界就取走，通常几秒），
+      // `next-turn` 是排队（等这一轮跑完，可能几分钟）。原来两条画得一模一样。
+      var isSteer = list[i].placement === 'next-step';
       rows += '<div class="q-row">'
+        + (isSteer ? '<span class="q-tag">插话</span>' : '')
         + '<span class="q-text">' + escapeHtml(list[i].text) + '</span>'
         + '<button class="q-drop" type="button" data-drop="' + escapeHtml(list[i].id) + '"'
         + ' aria-label="撤掉这条"><svg viewBox="0 0 24 24" aria-hidden="true">'
         + '<path d="M6 6l12 12M18 6L6 18"/></svg></button></div>';
     }
-    el.innerHTML = '<div class="q-head">排队中 ' + list.length + ' 条 · 跑完这轮就轮到它们</div>'
+    // 标题得跟着实际内容说：**只要有一条插话，「跑完这轮就轮到它们」就是假话**。
+    // 三种情况各说各的，不糊一句通用的。
+    var steerCount = 0;
+    for (var k = 0; k < list.length; k += 1) {
+      if (list[k].placement === 'next-step') steerCount += 1;
+    }
+    var waitCount = list.length - steerCount;
+    var head = steerCount && waitCount
+      ? '插话 ' + steerCount + ' 条（下一步就看到） · 排队 ' + waitCount + ' 条'
+      : steerCount
+        ? '插话 ' + steerCount + ' 条 · 它下一步就看到'
+        : '排队中 ' + list.length + ' 条 · 跑完这轮就轮到它们';
+    el.innerHTML = '<div class="q-head">' + head + '</div>'
       + '<div class="q-scale">' + nodes + '</div>' + rows;
   }
 
@@ -2408,8 +3494,50 @@
     el.classList.toggle('hide', !chatNoteVisible());
   }
 
-  function renderChat() {
-    mainEl.classList.remove('center');
+  /**
+   * 一条消息的 HTML。从 renderChat 的逐条循环里提出来：完整模式要把每轮的过程组
+   * **穿插进这串消息的原位**（renderFull → trajInterleave），聊天模式直接按顺序拼——
+   * 两边画同一条消息必须是同一段代码，两处各写一遍迟早走样。
+   */
+  function chatMsgHtml(m) {
+    // 指令行：这是会话做的一个动作，不是谁说的话，单独一种长相——
+    // 不套气泡、不给复制按钮（见 commandBlock 的说明）。
+    if (m.role === 'command') return commandBlock(m);
+    // 子智能体完工的通知：同一类「会话做的事」，画成一张可展开的卡片
+    // （见 noticeBlock 的说明）。它没有复制按钮，也没有气泡。
+    if (m.role === 'notice') return noticeBlock(m);
+    // 被按停的那一轮：标一句，别让人以为模型答到一半断了。
+    var stopped = m.interrupted ? '<span class="stopped">已停止</span>' : '';
+    // 两种消息都给复制按钮。自己敲的指令也常有「再发一遍」「拿去别处用」的时候，
+    // 原来只给 AI 气泡，用户反馈自己的话复制不了。
+    var copyBtn = '<button class="copy" type="button" aria-label="复制" title="复制"'
+      + ' data-copy="' + escapeHtml(m.text) + '">' + ICON_COPY + '</button>';
+    if (m.role === 'user') {
+      // 自己的指令：仍然是气泡，靠右。自己敲的是纯文本，不走 markdown——
+      // 不然打几个星号就变样了。
+      return '<div class="bubble user">' + linkify(m.text)
+        + '<span class="meta">' + stopped + timeLabel(m.timestamp) + copyBtn + '</span></div>';
+    }
+    // AI 的回答：**不套气泡**（用户要求「参考单帧模式那样」）。
+    // 于是一左一右、一个有框一个没框，正好分得清谁说的。
+    return '<div class="said">'
+      + (stopped ? '<div class="reply-bar">' + stopped + '</div>' : '')
+      + '<div class="md">' + mdToHtml(m.text) + '</div>'
+      + '<div class="reply-foot">' + copyBtn
+      + '<span class="time">' + timeLabel(m.timestamp) + '</span></div></div>';
+  }
+
+  /**
+   * 聊天那一串的「料」：滤掉排队那条、按窗口裁好、逐条变行。
+   *
+   * 返回的是**结构**（行数组 + 对应消息 + 滤后全量），不是拼好的字符串——
+   * renderChat 直接按顺序拼；renderFull 拼之前要把每轮的过程组插进 rows 的
+   * 原位（见 trajInterleave），只有结构在手才插得动。
+   *
+   * searchTurns 是「搜索命中的轮号」（只在完整模式搜索时给）：命中轮的消息
+   * 哪怕在窗口外也要露出来（10.3-3，「命中组在原位强开」的原位得先在场）。
+   */
+  function buildChat(searchTurns) {
     // 换了会话就把窗口收回首屏：上一个会话铺到多少条都不该跟过来——那正是这次要修的慢。
     // 判据用会话 id 而不是 history 的引用：服务端每次推的都是整份新数组，比引用永远「变了」。
     if (chatWindowFor !== state.boundSessionId) {
@@ -2440,61 +3568,47 @@
       // 「正在读」和「确实没有」是两件事，分开说。点开一个插件没看过的会话时，
       // 服务端要去 DSH 的会话记录里读它那一段（最大的那条 20 MB、约半秒），
       // 这期间说「还没有对话记录」会让人以为这个会话本来就是空的。
-      replyEl.innerHTML = state.historyLoading
-        ? '<div class="placeholder">正在读取这个会话的记录…</div>'
-        : '<div class="placeholder">还没有对话记录。</div>';
-      return;
+      return {
+        empty: state.historyLoading
+          ? '<div class="placeholder">正在读取这个会话的记录…</div>'
+          : '<div class="placeholder">还没有对话记录。</div>',
+        moreNote: '', rows: [], list: [], all: [],
+      };
     }
     // **只铺最近那几十条**，剩下的留在手里等用户往上滑（来由见 CHAT_PAGE 那段）。
     // 切在**滤掉排队那条之后**：不然被滤掉的那条会白占一个名额。
     var older = Math.max(0, chatLoaded - chatWindow);
-    if (older) list = list.slice(older);
-    var html = list.map(function (m) {
-      // 指令行：这是会话做的一个动作，不是谁说的话，单独一种长相——
-      // 不套气泡、不给复制按钮（见 commandBlock 的说明）。
-      if (m.role === 'command') return commandBlock(m);
-      // 子智能体完工的通知：同一类「会话做的事」，画成一张可展开的卡片
-      // （见 noticeBlock 的说明）。它没有复制按钮，也没有气泡。
-      if (m.role === 'notice') return noticeBlock(m);
-      // 被按停的那一轮：标一句，别让人以为模型答到一半断了。
-      var stopped = m.interrupted ? '<span class="stopped">已停止</span>' : '';
-      // 两种消息都给复制按钮。自己敲的指令也常有「再发一遍」「拿去别处用」的时候，
-      // 原来只给 AI 气泡，用户反馈自己的话复制不了。
-      var copyBtn = '<button class="copy" type="button" aria-label="复制" title="复制"'
-        + ' data-copy="' + escapeHtml(m.text) + '">' + ICON_COPY + '</button>';
-      if (m.role === 'user') {
-        // 自己的指令：仍然是气泡，靠右。自己敲的是纯文本，不走 markdown——
-        // 不然打几个星号就变样了。
-        return '<div class="bubble user">' + linkify(m.text)
-          + '<span class="meta">' + stopped + timeLabel(m.timestamp) + copyBtn + '</span></div>';
+    // 搜索命中轮把窗口上沿抬到自己（10.3-3）：不然命中的过程组按「组跟消息走」
+    // 的规矩被裁在窗口外，搜得到、看不见。
+    if (searchTurns && searchTurns.length) {
+      for (var t = 0; t < list.length; t++) {
+        if (list[t] && searchTurns.indexOf(String(list[t].turn)) >= 0 && t < older) {
+          older = t;
+          break;
+        }
       }
-      // AI 的回答：**不套气泡**（用户要求「参考单帧模式那样」）。
-      // 于是一左一右、一个有框一个没框，正好分得清谁说的。
-      return '<div class="said">'
-        + (stopped ? '<div class="reply-bar">' + stopped + '</div>' : '')
-        + '<div class="md">' + mdToHtml(m.text) + '</div>'
-        + '<div class="reply-foot">' + copyBtn
-        + '<span class="time">' + timeLabel(m.timestamp) + '</span></div></div>';
-    }).join('');
+    }
+    var all = list;
+    if (older) list = list.slice(older);
     // 「上面还有，往上滑」要贴在**看得到的顶上**，而且**离顶远了就收起来**——
     // 两处讲究见 .more-note 的样式注释。露 / 收在这里先按当前位置定一次，
     // 之后由滚动里的 paintChatNote 接着跟。
     var moreNote = older
       ? '<div class="more-note' + (chatNoteVisible() ? '' : ' hide') + '">往上滑看更早的</div>'
       : '';
-    // 「这不是全部」要说在**内容前面**：用户往上翻到顶时，第一眼看到的就是它，
-    // 免得以为这个会话只有这么点内容。读历史有上限（见服务端 HISTORY_MAX_*）。
-    if (state.historyTruncated) {
-      html = '<div class="history-note">'
-        + escapeHtml(state.historyNote || '这个会话很大，只显示了最近一段。')
-        + '</div>' + html;
+    return { empty: null, moreNote: moreNote, rows: list.map(chatMsgHtml), list: list, all: all };
+  }
+
+  function renderChat() {
+    mainEl.classList.remove('center');
+    var built = buildChat();
+    if (built.empty) {
+      replyEl.innerHTML = built.empty;
+      return;
     }
-    // 「正在执行」不再追加一个气泡——它是常驻的 #work，排在整串消息下面。
-    // 两种模式共用同一块，改的时候两边都走一遍。
-    if (state.live) html += liveBlock(state.live);
     // 先问「在不在底部」，再改内容——顺序反了永远是「在」（见 atBottom 的注释）。
     var stick = atBottom();
-    replyEl.innerHTML = moreNote + html;
+    replyEl.innerHTML = chatFrame(built, built.rows.join(''), state.live ? liveBlock(state.live) : '');
     scrollChat(stick);
   }
 
@@ -2507,8 +3621,8 @@
    */
   function maybeGrowChat() {
     // 单帧模式那边也在往 main 上滚（回答落定要跳到页面顶端），别把那一下当成「他在往上翻」；
-    // 本地都放完了也没什么可放的。
-    if (state.mode !== 'chat' || chatLoaded <= 0) return;
+    // 本地都放完了也没什么可放的。完整模式画的也是这串聊天记录，翻页照旧要能放。
+    if (state.mode === 'minimal' || chatLoaded <= 0) return;
     if (chatWindow >= chatLoaded) return;
     if (mainEl.scrollTop > chatEdge()) {
       // 滑下来了，这一轮重新装填：**一次靠近只放一屏**。
@@ -2541,7 +3655,10 @@
   function growChat() {
     var fromBottom = mainEl.scrollHeight - mainEl.scrollTop;
     chatWindow += CHAT_PAGE;
-    renderChat();
+    // 完整模式要走 render() 总分发：直画 renderChat 会把后面那块轨迹区抹掉。
+    // （位置补偿和聊天同一套：轨迹区每次重画高度不变，底部那一截没动。）
+    if (state.mode === 'full') render();
+    else renderChat();
     mainEl.scrollTop = mainEl.scrollHeight - fromBottom;
   }
 
@@ -2611,62 +3728,666 @@
     if (stick && !liveNow) mainEl.scrollTop = mainEl.scrollHeight;
   }
 
-  function render() {
-    $('hintMode').textContent = state.mode === 'chat' ? '聊天：常规问答对话' : '单帧：只留最新一条回复';
-      if (state.mode === 'chat') renderChat(); else renderMinimal();
+  /**
+   * 三种模式各自的提示语。「完整」= 聊天那一串 **+ 每一轮的过程组**，所以三句话
+   * 必须跟着模式一起改——收在一处是防两处走样（渲染处和点击处各写一遍的旧写法，
+   * 加第三种模式时漏一处，用户看到的就是「点了完整、说明还写着聊天」）。
+   */
+  function modeHint() {
+    if (state.mode === 'chat') return '聊天：常规问答对话';
+    if (state.mode === 'full') return '完整：附加每一步过程';
+    return '单帧：只留最新一条回复';
   }
 
-  function applySnapshot(snap) {
-    if (!snap) return;
-    if ('latest' in snap) state.latest = snap.latest;
-    // 正在流出来的那一段。服务端只在自己决定要显示之后才写它，所以这里是空字符串
-    // 不代表模型没在写，只代表「还不到显示的时候」。
-    if ('live' in snap) state.live = snap.live || '';
-    // 模型此刻的自言自语（鲸鱼娘的台词）。null = 这会儿没话说，气泡回到该姿势自己的词条。
-    if ('thought' in snap) state.thought = snap.thought || null;
-    if (snap.history) state.history = snap.history;
-    // 「服务端正去读这个会话的完整记录」。点开一个没看过的会话时，那一串要读一会儿
-    // 才补上来（最大的那条日志 20 MB、约半秒），这期间不能装作「这个会话是空的」。
-    state.historyLoading = snap.historyLoading === true;
-    // 「这份历史只到最近一段」。服务端读历史有上限（会话太大只读日志尾部），
-    // 所以内容可能是截断的——**这件事必须跟着内容一起传上来**，不能只在服务端知道。
-    state.historyTruncated = snap.historyTruncated === true;
-    state.historyNote = snap.historyNote || '';
-    if (snap.sessions) state.sessions = snap.sessions;
-    if (Array.isArray(snap.queued)) state.queued = snap.queued;
-    if ('boundSessionId' in snap) {
-      var wasBound = state.boundSessionId;
-      state.boundSessionId = snap.boundSessionId;
-      // 换了会话，指令菜单那份缓存就作废了（指令表是每个会话一份的，这个会话没在跑
-      // 时一条都读不到，见「斜杠指令」那一段）。重画一次，它自己会发现数据不属于
-      // 这个会话、去重取——否则用户点到的是上一个会话的指令，点下去必然被拒。
-      if (state.boundSessionId !== wasBound) paintCmdMenu();
+  /**
+   * 「完整」的底座：聊天那一串**全部照画**（分批、往上滑补页、滚动对齐都照旧），
+   * 每一轮的过程组**穿插进它那轮对话的原位**——指令之后、回答之前（10.3-1，
+   * 对齐 DSH 聊天视图的 turn-process 位置，2026-10-03 用户裁决「一定要让执行
+   * 轨迹的逻辑符合DSH本身」）。三层折叠那套跟着组走，落点规则见 trajInterleave。
+   * 但**「正在读取」和「没有过程」必须分清**：loading=true 是服务端还在读会话记录，
+   * 不是这个会话没有过程。这期间什么都不说，人就会以为没有过程——所以那句注记
+   * 照旧垫在最前面。没轨迹且不在 loading 时一个过程组都不画（这时完整模式和聊天
+   * 长得一样，是预期）。
+   */
+  function renderFull() {
+    // 换了会话，用户手动拨过的折叠开关就作废——和聊天窗 chatWindowFor 同一个道理：
+    // 两场会话的轮号会撞在一起，留在手里的开关会去拨新会话的组。
+    if (trajFor !== state.boundSessionId) {
+      trajFor = state.boundSessionId;
+      trajGroupOpen = {};
+      trajEntryOpen = {};
     }
-    // running 也在快照里，而且算的是**当前绑定的那个会话**。不接的话，
-    // 在导航栏切到别的会话时，那个会话会继承上一个会话的「正在执行」。
-    if ('running' in snap) setRunning(snap.running);
-    paintNavCurrent();
-    render();
+    mainEl.classList.remove('center');
+    var built = buildChat();
+    var html;
+    if (built.empty) {
+      // 一条消息都没有（正在读/确实没有）：手里有过程组就兜底页尾（10.3-1 d）。
+      // 这一路不滚动，和 renderChat 的空态同口径。
+      html = built.empty + trajInterleave([], [], built.all).join('');
+    } else {
+      // 先问「在不在底部」，再改内容——顺序反了永远是「在」（见 atBottom 的注释）。
+      var stick = atBottom();
+      html = chatFrame(built, trajInterleave(built.rows, built.list, built.all).join(''),
+        state.live ? liveBlock(state.live) : '');
+      replyEl.innerHTML = state.trajectoryLoading
+        ? '<div class="history-note">正在读取这个会话的过程…</div>' + html
+        : html;
+      scrollChat(stick);
+      bindTraj();
+      return;
+    }
+    if (state.trajectoryLoading) {
+      html = '<div class="history-note">正在读取这个会话的过程…</div>' + html;
+    }
+    replyEl.innerHTML = html;
+    bindTraj();
   }
 
-  // ---------------- 左侧导航栏 ----------------
-  // 数据分两层取：先列工作区（便宜），展开某个再去要它的会话（要读日志折标题，贵）。
-  // 本机实测 35 个工作区、最多的一个有 452 个会话，一次全拉会卡住手机。
-  var navList = null;      // 工作区列表，开一次取一次
-  var navSessions = {};    // workspaceId -> { sessions, total, truncated }
-  var navFollowTimers = {}; // workspaceId -> 当前标题补齐轮询定时器
-  var navExpanded = {};    // workspaceId -> 是否展开
-
-  function openNav() {
-    $('nav').classList.add('open');
-    loadWorkspaces(false);
+  /** 轨迹区的点击走一次容器委托就够（重绘都是全新 HTML，逐个绑必漏）。 */
+  function bindTraj() {
+    if (trajBound) return;
+    trajBound = true;
+    replyEl.addEventListener('click', onTrajectoryClick);
   }
-  function closeNav() { $('nav').classList.remove('open'); }
 
-  function loadWorkspaces(force) {
-    if (navList && !force) { renderNav(); return; }
-    if (!force && navPrefetchPromise) {
-      $('navBody').innerHTML = '<div class="placeholder">正在读取…</div>';
+  /**
+   * 聊天那串的外框：截断说明排内容前面、流式那段接在最后、moreNote 贴顶。
+   * 聊天与完整两个模式共用这一段——两处各写一遍的旧写法走样过（见 modeHint 的说明）。
+   * liveHtml 由调用方给（完整模式的切片里没有 liveBlock，传空串就是「没有流式」）。
+   *
+   * 定义在 renderFull 之后是**测试切片的约束**：trajHarness 切的是
+   * renderFull → applySnapshot，外框函数得在切片里才调得到；页面里函数提升，
+   * 位置不影响 renderChat 调它。
+   */
+  function chatFrame(built, body, liveHtml) {
+    var html = body;
+    // 「这不是全部」要说在**内容前面**：用户往上翻到顶时，第一眼看到的就是它，
+    // 免得以为这个会话只有这么点内容。读历史有上限（见服务端 HISTORY_MAX_*）。
+    if (state.historyTruncated) {
+      html = '<div class="history-note">'
+        + escapeHtml(state.historyNote || '这个会话很大，只显示了最近一段。')
+        + '</div>' + html;
+    }
+    // 「正在执行」不再追加一个气泡——它是常驻的 #work，排在整串消息下面。
+    // 流式那段（live）接在所有行（含穿插的过程组）之后：过程在回答之前，
+    // 正在流的半句就是「回答」那个位置（10.3-1）。
+    if (liveHtml) html += liveHtml;
+    return built.moreNote + html;
+  }
+
+  // ---------------- 轨迹的折叠与长相（完整模式，对齐 PC） ----------------
+  // 数据是上一棒收进 state.trajectory 的轮次组：组 {turn, state, entries[]}，
+  // 条目 {kind:'think'|'tool', name, args, summary, output, state, …}，字段语义
+  // 见 lib/trajectory.js 头上的说明（思考正文和工具结果都放 output）。
+  // 长相对齐 DSH 桌面端的 turn-process（tasks/todo.md 11）：组头一行 = 图标 +
+  // 状态词/标题（跑着是「正在…」活动词，收官是「已读取文件并调用工具」这类组合标题），
+  // 条目一行 = 图标 + 「工具显示名 · 参数摘要」（思考行是「思考 · 首行」），
+  // 点开才见正文（工具给「参数+结果」、思考给想的内容）。
+  // 折叠口径不变：组级把「已结束的多条组」收成一行（running 还在长、error 要给人看、
+  // 单条收了没信息量，这三种默认摊开）；条目级默认收。
+  // 用户拨过的开关存在下面两个对象里（组按轮号、条目按 id），只在本会话内有效，
+  // 换会话时在 renderFull 里清掉。
+  var trajFor = null;        // 上次渲染时的会话 id（变了就清开关）
+  var trajGroupOpen = {};    // 组级手动覆写：{ 轮号字符串: true|false }
+  var trajEntryOpen = {};    // 条目级手动覆写：{ 条目 id: true|false }
+  var trajBound = false;     // replyEl 上的委托绑过没有
+
+  /**
+   * 组默认摊不摊。收的条件是**两条一起成立**：条目够多（≥2）、已经跑完
+   * （running 还在长，收了就看不见新条目；error 出错的组自己摊到条目级给人看，
+   * 不用点）。用户手动拨过的开关优先于默认值。
+   */
+  function trajGroupIsOpen(g) {
+    var key = String(g.turn);
+    if (Object.prototype.hasOwnProperty.call(trajGroupOpen, key)) return trajGroupOpen[key];
+    if (!g.entries || g.entries.length < 2) return true;
+    if (g.state === 'running' || g.state === 'error') return true;
+    return false;
+  }
+  /** 一条摊不摊：用户开关优先；没有开关时默认收（点开才见正文）。 */
+  function trajEntryIsOpen(e) {
+    if (Object.prototype.hasOwnProperty.call(trajEntryOpen, e.id)) return trajEntryOpen[e.id];
+    return false;
+  }
+
+  /**
+   * 组头的开关。key 是 data 属性上的字符串（getAttribute 回来一定是字符串，
+   * 轮号是数字，两边统一按 String 比——有一边不转换就会拨空）。
+   * 拨完立刻重画：开关唯一可见的效果就是下一次渲染，不重画等于点了没反应。
+   */
+  function toggleTrajGroup(turnKey) {
+    var groups = state.trajectory || [];
+    for (var i = 0; i < groups.length; i++) {
+      if (String(groups[i].turn) !== String(turnKey)) continue;
+      trajGroupOpen[turnKey] = !trajGroupIsOpen(groups[i]);
+      break;
+    }
+    render();
+  }
+  // 点的当下算开还是收，要按「含搜索强制摊开」的实况来（不然搜索摊开的条目点了
+  // 收不回去）：先按 id 找到那条再取反；找不到时按手里原有的开关算，和原来一致。
+  function toggleTrajEntry(id) {
+    var open = trajEntryOpen[id] === true;
+    var groups = state.trajectory || [];
+    for (var i = 0; i < groups.length; i++) {
+      var es = groups[i].entries || [];
+      for (var j = 0; j < es.length; j++) {
+        if (String(es[j].id) === String(id)) open = trajEntryIsOpen(es[j]);
+      }
+    }
+    trajEntryOpen[id] = !open;
+    render();
+  }
+
+  /**
+   * 失败首行。reason 的第一行；reason 取不到就用错误名/错误码，都没有就如实说
+   * 「失败」——**不编原因**（和 lib/trajectory.js readError 同一条口径）。
+   */
+  function trajErrLine(e) {
+    if (!e || !e.error) return '';
+    var r = typeof e.error.reason === 'string' ? e.error.reason : '';
+    if (!r && typeof e.error.name === 'string' && e.error.name) r = e.error.name;
+    if (!r && typeof e.error.code === 'string' && e.error.code) r = e.error.code;
+    if (!r) return '失败';
+    return r.split('\n')[0];
+  }
+  /** 组头上的失败首行：组里第一条带失败身份的条目的那一行。 */
+  function trajGroupErrLine(g) {
+    if (!g.entries) return '';
+    for (var i = 0; i < g.entries.length; i++) {
+      var line = trajErrLine(g.entries[i]);
+      if (line) return line;
+    }
+    return '';
+  }
+
+  /**
+   * 截断标注。N 是**原始总字符数**（truncated 里的 chars 才是留下的那段），措辞照
+   * lib/trajectory.js clipForTrajectory 的原句。服务端在正文尾部写了同一句就不再
+   * 重复；没写（truncated 字段在、句子不在）就地补上——绝不静默砍尾。
+   */
+  function trajTruncNote(t, text) {
+    if (!t || typeof t.total !== 'number') return '';
+    if (String(text).indexOf('已截断') >= 0) return '';
+    return '\n… 已截断，共 ' + t.total + ' 字符';
+  }
+
+  /**
+   * 一条的正文（照 PC 的展开卡）：
+   *   思考 = 普通 Markdown 段落（PC 的 compact 变体：13px/20px、三级灰、左缩进 22px，
+   *          **不是等宽**——它是想的东西，不是机器吐的字节）；
+   *   工具 = 「输入 / 输出」两栏卡（标签小字灰、正文等宽、细线分隔）——输入是美化后
+   *          的 JSON（两空格，解析不了就原样），输出是结果文本，出错整段红色。
+   * 自动审查被拒（照 PC）：参数不显示，只说清楚为什么没跑。
+   * 截断标注照旧如实跟在后面。
+   */
+  function trajEntryBody(e) {
+    var tr = e.truncated || {};
+    if (e.kind === 'think') {
+      if (!e.output) return '';
+      return '<div class="traj-think">' + mdToHtml(e.output) + trajTruncLine(tr.think, e.output) + '</div>';
+    }
+    if (e.error && e.error.name === 'AutoReviewDeniedError' && e.error.code === 'AUTO_REVIEW_DENIED') {
+      var reason = typeof e.error.reason === 'string' && e.error.reason
+        ? e.error.reason : 'Auto review 未授权此次操作';
+      return '<div class="traj-io"><div class="traj-io-row"><div class="traj-io-label">输出</div>'
+        + '<div class="traj-io-body traj-io-err"><pre>工具未执行。原因：'
+        + escapeHtml(reason) + '</pre></div></div></div>';
+    }
+    var rows = '';
+    if (e.args) {
+      rows += '<div class="traj-io-row"><div class="traj-io-label">输入</div>'
+        + '<div class="traj-io-body"><pre>' + escapeHtml(trajPretty(e.args)) + '</pre>'
+        + trajTruncLine(tr.args, e.args) + '</div></div>';
+    }
+    var outText = e.output;
+    if (!outText && e.error) {
+      // 照 PC 的 resultText 兜底：空内容且失败时，给一行「名字: 码」，不装作没有结果。
+      outText = (e.error.name || 'Error') + (e.error.code ? ': ' + e.error.code : '');
+    }
+    if (outText) {
+      rows += '<div class="traj-io-row"><div class="traj-io-label">输出</div>'
+        + '<div class="traj-io-body' + (e.error ? ' traj-io-err' : '') + '"><pre>'
+        + escapeHtml(outText) + '</pre>' + trajTruncLine(tr.output, e.output || '') + '</div></div>';
+    }
+    if (!rows) return '';
+    return '<div class="traj-io">' + rows + '</div>';
+  }
+
+  /** 截断标注（如实）：单起一行小字。 */
+  function trajTruncLine(t, text) {
+    var note = trajTruncNote(t, text);
+    return note ? '<div class="traj-io-note">' + escapeHtml(note.trim()) + '</div>' : '';
+  }
+
+  /** 参数按 PC 的 formatToolBody：能解析就美化 JSON（两空格），解析不了就原样。 */
+  function trajPretty(raw) {
+    try {
+      return JSON.stringify(JSON.parse(raw), null, 2);
+    } catch (err) {
+      return String(raw);
+    }
+  }
+
+  // —— PC 同款词典（照抄 DSH 桌面端 0.2.0-rc.1，一个字不自创）——
+  // 动作分类：dsh-client-ui-chat 的 activity()（工具名 → 动作）。
+  function trajActivity(name) {
+    var n = String(name || '');
+    if (n === 'read') return 'read';
+    if (n === 'read_image') return 'readImage';
+    if (n === 'grep' || n === 'glob' || /_inspect$/.test(n)) return 'search';
+    if (n === 'write') return 'write';
+    if (n === 'edit' || n === 'apply_patch') return 'edit';
+    if (n === 'bash' || n === 'pwsh' || n === 'exec_command' || n === 'write_stdin'
+      || /^terminal_/.test(n)) return 'commands';
+    if (n === 'run_code') return 'code';
+    if (n === 'web_search') return 'webSearch';
+    if (n === 'web_fetch') return 'webFetch';
+    if (n === 'subagent' || /^subagent_/.test(n)) return 'subagents';
+    if (n === 'todo_write' || n === 'create_goal' || n === 'update_goal' || n === 'get_goal') {
+      return 'plan';
+    }
+    if (n === 'ask_user_question' || n === 'request_user_input') return 'questions';
+    return 'tools';
+  }
+  // 动作 → 完成词 / 活动词（dsh-client-ui-chat 的 message.stepProcess.done.* 与 .* 本体）。
+  var TRAJ_DONE = {
+    thinking: '已完成分析', read: '已读取文件', readImage: '已读取图片', write: '已写入文件',
+    search: '已搜索代码', edit: '修改了文件', commands: '执行了命令', code: '运行了代码',
+    webSearch: '已搜索网页', webFetch: '已访问网页', subagents: '已协调子智能体',
+    plan: '更新了计划', questions: '向用户提出了问题', tools: '已调用工具',
+  };
+  var TRAJ_LIVE = {
+    thinking: '正在分析请求', read: '正在读取文件', readImage: '正在读取图片', write: '正在写入文件',
+    search: '正在搜索代码', edit: '正在编辑文件', commands: '正在运行命令', code: '正在运行代码',
+    webSearch: '正在搜索网页', webFetch: '正在访问网页', subagents: '正在协调子智能体',
+    plan: '正在更新计划', questions: '等待你的操作', tools: '正在调用工具',
+  };
+  // 工具显示名（dsh-client-ui-tool 的 tool.title.*）。认不出名字的走变体标题，
+  // 变体也没有就落「工具调用」——和 PC 的 generic 同一口径。
+  var TRAJ_TOOL_TITLE = {
+    read: '读取', read_image: '读取图片', write: '写入', edit: '编辑', apply_patch: '编辑',
+    bash: '运行命令', pwsh: '运行命令', exec_command: '运行命令', write_stdin: '运行命令',
+    grep: '搜索文件内容', glob: '查找文件', run_code: '运行代码',
+    web_search: '网页搜索', web_fetch: '网页获取',
+    todo_write: '更新任务清单', ask_user_question: '提问', request_user_input: '提问',
+    create_goal: '创建目标', get_goal: '查看目标', update_goal: '更新目标',
+    subagent: '创建子智能体', list_agents: '查看子智能体', send_message: '发送消息',
+    interrupt_agent: '中断智能体', wait_agent: '等待子智能体', spawn_teammate: '创建队友',
+  };
+  var TRAJ_VARIANT_TITLE = {
+    read: '读取', readImage: '读取', webFetch: '读取', search: '搜索',
+    write: '写入', edit: '编辑', commands: '运行命令', code: '代码',
+    thinking: '工具调用', tools: '工具调用',
+  };
+  function trajToolTitle(name) {
+    var n = String(name || '');
+    if (TRAJ_TOOL_TITLE[n]) return TRAJ_TOOL_TITLE[n];
+    return TRAJ_VARIANT_TITLE[trajActivity(n)] || '工具调用';
+  }
+  // 图标：手写细线 SVG（1.5px 描边、currentColor），和全页图标同一种画法；
+  // 画的是 PC 那套图标的角色（思考/读/搜/改/命令/代码/网页/子代理/计划/提问/工具）。
+  var TRAJ_ICO = {
+    thinking: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="9" r="5"/><path d="M9.5 18h5M10.5 21h3"/></svg>',
+    read: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M6 3h8l4 4v14H6z"/><path d="M14 3v4h4M9 12h6M9 16h6"/></svg>',
+    search: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="11" cy="11" r="6"/><path d="M15.5 15.5L21 21"/></svg>',
+    edit: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M4 20l1-4L16 5l3 3L8 19z"/><path d="M14 7l3 3"/></svg>',
+    commands: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M5 7l5 5-5 5"/><path d="M12 17h7"/></svg>',
+    code: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M9 8l-5 4 5 4"/><path d="M15 8l5 4-5 4"/></svg>',
+    webSearch: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="12" r="8"/><path d="M4 12h16"/><path d="M12 4c3 3 3 13 0 16c-3-3-3-13 0-16z"/></svg>',
+    subagents: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="8" r="3"/><path d="M5 20a7 7 0 0 1 14 0"/></svg>',
+    plan: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M4 7l2 2 3-3M4 17l2 2 3-3"/><path d="M12 8h8M12 18h8"/></svg>',
+    questions: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="12" r="8"/><path d="M9.5 9.5a2.5 2.5 0 1 1 3.5 2.3c-.7.4-1 .8-1 1.7"/><path d="M12 16.5h.01"/></svg>',
+    tools: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 4l1.5 4.5L18 10l-4.5 1.5L12 16l-1.5-4.5L6 10l4.5-1.5z"/></svg>',
+  };
+  function trajIco(kind) {
+    return TRAJ_ICO[kind] || TRAJ_ICO.tools;
+  }
+  /** 折叠处给思考行的那一句：正文首行，压成一行、限 160 字（DSH 的行内摘要同款口径）。
+      星号去掉（PC 同款：摘录是给人扫的，星号只会碍眼——5854）。 */
+  function trajFirstLine(text) {
+    var s = String(text == null ? '' : text).split('\n')[0].replace(/\s+/g, ' ').trim();
+    s = s.replace(/\*\*/g, '');
+    return s.length > 160 ? s.slice(0, 159) + '…' : s;
+  }
+
+  /**
+   * 扫光的起点接「全局时钟」：页面每次整块重画都会把动画打回开头，每次都从头扫
+   * 就成了频闪。带上当前时间在 1.5 秒周期里的位置（负 delay），重画之后接着
+   * 上次的相位走，肉眼看不出断口。
+   */
+  function trajShimStyle() {
+    return ' style="animation-delay:-' + ((Date.now() % 1500) / 1000).toFixed(3) + 's"';
+  }
+  /**
+   * 收官标题：照抄 DSH 的 processTitle——工具条目按动作分类计数（多的在前，一样多按
+   * 出现先后），取前三类拼完成词；两类共享「已」字时第二个去「已」用「并」连，
+   * 三类用「，」连，超过三类加「等」；一条工具都没有（纯思考）落「已完成分析」。
+   */
+  function trajTitleOf(g) {
+    var order = [];
+    var count = {};
+    var es = g.entries || [];
+    for (var i = 0; i < es.length; i++) {
+      if (!es[i] || es[i].kind !== 'tool') continue;
+      var k = trajActivity(es[i].name || '');
+      if (count[k] === undefined) { count[k] = 0; order.push(k); }
+      count[k] += 1;
+    }
+    order.sort(function (a, b) { return count[b] - count[a]; });
+    var labels = order.slice(0, 3).map(function (k) { return TRAJ_DONE[k]; });
+    var first = labels[0];
+    if (first === undefined) return { kind: 'thinking', text: TRAJ_DONE.thinking };
+    if (labels[1] === undefined) return { kind: order[0], text: first };
+    if (labels.length === 2) {
+      var second = labels[1];
+      if (first.indexOf('已') === 0 && second.indexOf('已') === 0) second = second.slice(1);
+      return { kind: order[0], text: first + '并' + second };
+    }
+    return {
+      kind: order[0],
+      text: first + '，' + labels.slice(1).join('，') + (order.length > 3 ? '等' : ''),
+    };
+  }
+  /** 组头的图标与标题：跑着是活动词（正在…），收官是组合标题。 */
+  function trajGroupTitle(g) {
+    if (g.state === 'running') {
+      var es = g.entries || [];
+      var last = null;
+      for (var i = es.length - 1; i >= 0; i--) {
+        if (es[i] && es[i].state === 'running') { last = es[i]; break; }
+      }
+      // 还没有工具步在跑（正在想）就落「正在分析请求」——和 PC 的兜底同一个词。
+      var kind = last && last.kind === 'tool' ? trajActivity(last.name || '') : 'thinking';
+      // 活片段优先（正在想的那一句，随打字刷新，PC 的 label · detail 同款）；
+      // 没有片段才退到条目自己的摘要。
+      var prose = state.trajectoryLive
+        || (last && last.kind === 'think' ? trajFirstLine(last.output) : '');
+      var plain = !prose && last ? (last.summary || '') : '';
+      // 右边那半边是模型原话时走行内渲染：**加粗**、`代码` 要成样式，不是把记号原样贴在
+      // 脸上（2026-10-06 用户报的，和 2026-09-27 气泡那回同一个根因）。
+      // 工具摘要**不**走——那是命令/路径原文，一条「ls *.ts *.js」里的两个星号会被斜体
+      // 规则吃掉（在真渲染器上试过），摘要就照旧只转义。
+      var detail = prose ? mdInline(prose) : (plain ? escapeHtml(plain) : '');
+      return { kind: kind, live: true, text: TRAJ_LIVE[kind], detailHtml: detail };
+    }
+    return trajTitleOf(g);
+  }
+
+  /**
+   * 旁白那一段（对用户说的话，别的模式由鲸鱼娘气泡念，2026-10-04 起完整模式塞回轨迹）：
+   * 照 PC 是过程里的一段正文——不带图标、不可点开，说完就摆在这儿。
+   * 正文走 markdown 渲染（和回答区一个待遇：粗体、行内代码、列表都认），
+   * 不是原样贴星号（同日用户顺手报的）。
+   */
+  function trajSayHtml(e) {
+    var tr = e.truncated || {};
+    return '<div class="traj-say">'
+      + mdToHtml((e.output || '') + trajTruncNote(tr.output, e.output || '')) + '</div>';
+  }
+
+  /** 一行一条（PC 的成员行）：图标 +「显示名 · 摘要」，失败/进行中顶在这一行上。 */
+  function trajEntryHtml(e) {
+    if (e.kind === 'say') return trajSayHtml(e);
+    var think = e.kind === 'think';
+    var kind = think ? 'thinking' : trajActivity(e.name || '');
+    var label = think ? '思考' : trajToolTitle(e.name || '');
+    // 自动审查拒绝（照 PC）：行上摘要直接换成「Auto review 已拒绝」，别的都不重要了。
+    var denial = e.error && e.error.name === 'AutoReviewDeniedError'
+      && e.error.code === 'AUTO_REVIEW_DENIED';
+    // 思考行展开后行上只留「思考」（照 PC：摘录是折叠态的预览，展开了就退场）；
+    // 工具行不一样——展开后标题·摘要照旧留着（PC 的 keepContentWhenOpen）。
+    var open = trajEntryIsOpen(e);
+    var detail = denial ? 'Auto review 已拒绝'
+      : think ? (open ? '' : trajFirstLine(e.output)) : (e.summary || '');
+    // 跑着的行整行扫光（2026-10-04 用户点名：「某一行正在运行时会有一个渐变的效果
+    // 闪过去」）。不跑的行一个字节不变——类名后缀为空时拼出来就是原样。
+    var shim = e.state === 'running';
+    var shimCls = shim ? ' traj-shimmer' : '';
+    var shimSty = shim ? trajShimStyle() : '';
+    // 内容段与状态段**分开**：内容段一行截断（照 PC 的折叠行——折叠行是给人扫的），
+    // 出错/进行中的字样是独立的一段，不许被省略号吃掉（2026-10-04 真机返修）。
+    var body = '<span class="traj-detail' + shimCls + '"' + shimSty
+      + '>' + (detail ? ' · ' + escapeHtml(detail) : '') + '</span>';
+    var chips = '';
+    if (e.error) chips = ' · <span class="traj-err">' + escapeHtml(trajErrLine(e)) + '</span>';
+    else if (e.state === 'running') chips = ' · <span class="traj-run">进行中</span>';
+    var row = '<button type="button" class="traj-row" data-traj-entry="'
+      + escapeHtml(e.id) + '"><span class="traj-ico">' + trajIco(kind) + '</span>'
+      + '<span class="traj-name' + shimCls + '"' + shimSty + '>' + escapeHtml(label) + '</span>'
+      + body + chips + '</button>';
+    return '<div class="traj-entry">' + row
+      + (trajEntryIsOpen(e) ? trajEntryBody(e) : '') + '</div>';
+  }
+
+  /** 一个轮次组：PC 的组头一行（图标 + 状态词/标题），摊开时下面挂条目。 */
+  function trajGroupHtml(g) {
+    var open = trajGroupIsOpen(g);
+    var t = trajGroupTitle(g);
+    // 右半边（活片段/思考原话）在来源处已经渲染好、也转义过，见 trajGroupTitle；
+    // 状态词与收官标题是我们自己拼的词，这里照旧转义。
+    var title = t.live
+      ? '<span class="traj-run traj-shimmer"' + trajShimStyle() + '>' + escapeHtml(t.text)
+        + (t.detailHtml ? ' · ' + t.detailHtml : '') + '</span>'
+      : '<span class="traj-title">' + escapeHtml(t.text) + '</span>';
+    // 组头只显示状态词/标题，失败信息在下方条目行里显示，不重复。
+    var head = '<button type="button" class="traj-head" data-traj-group="'
+      + escapeHtml(String(g.turn)) + '"><span class="traj-ico">' + trajIco(t.kind) + '</span>'
+      + '<span class="traj-chev">' + (open ? '▾' : '▸') + '</span>'
+      + title + '</button>';
+    var entries = open && g.entries.length
+      ? '<div class="traj-entries">' + g.entries.map(trajEntryHtml).join('') + '</div>'
+      : '';
+    return '<div class="traj-group">' + head + entries + '</div>';
+  }
+
+  /**
+   * 把每轮的过程组插回它那轮对话的原位（10.3-1，对齐 DSH 的 turn-process 位置）。
+   * 落点四条：
+   *   a 该轮**第一个回答之前**——「指令 → 过程 → 回答」；
+   *   b 该轮没有回答（跑着/失败）落该轮**簇尾**（活轮即页尾，新步骤从这里冒出来）；
+   *   c 该轮有消息但都不在窗口里 → **不画**（组跟消息走，翻页上来自然带进来）；
+   *   d 该轮一条消息都没有（排队被滤掉、本地回显没号）→ 兜底**页尾**。
+   * rows[i] 与 list[i] 一一对应（list＝裁好窗的消息，all＝滤掉排队后的全量）。
+   * 返回插好之后的新数组，不动入参。
+   */
+
+  function trajInterleave(rows, list, all) {
+    var groups = (state.trajectory || []).filter(function (g) {
+      // 空组也可能是「正在想」的那一轮：turn/start 刚到、条目要等这一步说完才落
+      // （DSH 的事件就是这么给的）。它就是进展本身，不许因为还没条目就整组不画——
+      // 真机上那正是「跑的时候一片安静、跑完一次性全冒出来」的观感
+      // （2026-10-04 用户报的）。跑完还是空的才不画：那一组确实没有过程。
+      return g && Array.isArray(g.entries) && (g.entries.length > 0 || g.state === 'running');
+    });
+    // 服务端那句「这不是全部」跟着轨迹内容走（11.1-C）：排在第一个过程组前面；
+    // 一个过程组都没有（含轨迹读不到那条路）就兜底页尾——话必须说，位置不抢戏。
+    var noteHtml = trajNoticeHtml();
+    if (!groups.length) return rows.slice().concat(noteHtml ? [noteHtml] : []);
+    var slots = [];
+    for (var i = 0; i < groups.length; i++) {
+      var g = groups[i];
+      var at = -1;
+      // a：该轮第一个回答之前
+      for (var j = 0; j < list.length && at < 0; j++) {
+        if (list[j] && list[j].role === 'assistant' && sameTurn(list[j].turn, g.turn)) at = j;
+      }
+      // b：没有回答就落簇尾
+      if (at < 0) {
+        for (var k = list.length - 1; k >= 0; k--) {
+          if (list[k] && sameTurn(list[k].turn, g.turn)) { at = k + 1; break; }
+        }
+      }
+      if (at < 0) {
+        // c/d：窗口里没有这一轮的消息——全量里有＝出窗不画；没有＝兜底页尾。
+        var anywhere = false;
+        for (var n = 0; n < (all || []).length; n++) {
+          if (all[n] && sameTurn(all[n].turn, g.turn)) { anywhere = true; break; }
+        }
+        if (anywhere) continue;
+        at = list.length;
+      }
+      slots.push({ at: at, turn: g.turn, html: trajGroupHtml(g) });
+    }
+    // 同一落点上的组按轮号排（兜底页尾时可能好几组），插的时候按落点从前往后放。
+    slots.sort(function (x, y) { return x.at - y.at || x.turn - y.turn; });
+    var out = [];
+    var s = 0;
+    var noted = false;
+    for (var p = 0; p <= rows.length; p++) {
+      while (s < slots.length && slots[s].at === p) {
+        if (noteHtml && !noted) { out.push(noteHtml); noted = true; }
+        out.push(slots[s++].html);
+      }
+      if (p < rows.length) out.push(rows[p]);
+    }
+    if (noteHtml && !noted) out.push(noteHtml);
+    return out;
+  }
+  /** 轮号对得上吗：两边都要有号，再比字符串（号来自消息字段/组字段，类型不总一致）。 */
+  function sameTurn(a, b) {
+    return a != null && b != null && String(a) === String(b);
+  }
+
+  /**
+   * 服务端「这份轨迹不是全部」的说明（state.trajectoryNote / trajectoryTruncated）。
+   * 给了原句就原样显示；只有截断标志没给句子时补一句大实话兜底。**存在才显示**——
+   * 一个字都没有时不许占地方，完整模式的观感必须和聊天一致。轨迹空了但服务端留了
+   * 话（读取失败那条路）也要说：「读不到」不等于「没有过程」。
+   */
+  function trajNoticeHtml() {
+    if (state.trajectoryNote) {
+      return '<div class="traj-note">' + escapeHtml(state.trajectoryNote) + '</div>';
+    }
+    if (state.trajectoryTruncated) return '<div class="traj-note">这份轨迹不是全部。</div>';
+    return '';
+  }
+
+  // 轨迹区的点击全走这一根委托。先认条目再认组头——行和头各带各的 data 属性，
+  // 认错一个就拨错层。
+  function onTrajectoryClick(e) {
+    var t = e.target && e.target.closest ? e.target : null;
+    if (!t) return;
+    var row = t.closest('[data-traj-entry]');
+    if (row) { toggleTrajEntry(row.getAttribute('data-traj-entry')); return; }
+    var head = t.closest('[data-traj-group]');
+    if (head) toggleTrajGroup(head.getAttribute('data-traj-group'));
+  }
+
+  /**
+   * 「回到底部」那颗浮标的露 / 收。
+   *
+   * 判据直接用 atBottom()，不另设一个数。这样有个好处：**浮标出现的那一刻，正好
+   * 就是页面停止自动跟随的那一刻**——两处要是各用各的容差（比如浮标 25px、跟随 48px），
+   * 中间那段就会出现「浮标说没到底、页面却自己在往下滚」这种自相矛盾的样子。
+   * 电脑端那颗用的是它自己的 25px 容差（useChatReading 里的 useScrollFollow(_, 25)），
+   * 这里跟的是本页既有的 48px，因为本页的黏底判据就是它。
+   *
+   * **单帧模式下一律不出现**（用户 2026-10-08 要求）。那一模式整屏只留最新一条回答，
+   * 回答落定的那一刻页面**故意**把它的开头对齐到顶部（见 renderMinimal 里
+   * scrolledReplyAt 那一段），好让人从第一行读起。所以那儿「不在底部」是设计如此，
+   * **不是「用户翻上去了」**——这时候挂一颗「回到底部」，等于劝用户把刚对齐好的
+   * 开头再滚掉，正好把这个模式唯一要做的事抵消掉。
+   * 聊天 / 完整是多帧（一串历史一条条往上排），那里不在底部就是用户自己翻上去的，
+   * 照旧出现。所以这条判的是**模式**（state.mode），不是新设一个「离底多少像素」。
+   *
+   * 只改 hidden，**不碰任何位置和尺寸**：位置全在 CSS 的 sticky 里算好了（见样式表）。
+   * 每次现取元素、取不到就静静退出——页面测试会把 render 那一段单独抠出来跑，
+   * 那里给的 $ 是替身，不能假设它一定认得这个 id。
+   */
+  function paintToBottom() {
+    var el = $('toBottom');
+    if (!el) return;
+    el.hidden = atBottom() || state.mode === 'minimal';
+  }
+
+  function render() {
+    $('hintMode').textContent = modeHint();
+      if (state.mode === 'full') renderFull(); else if (state.mode === 'chat') renderChat(); else renderMinimal();
+    // 「完整」模式不放装饰（11.1-B）：给常驻的 #work 挂 bare，立绘、气泡、光流
+    // 进度条由 CSS 藏掉，只留「已 N 秒 / 停止」。#work 不跟着 #reply 重画，
+    // 所以这一下挂在总分发这里，切模式时各归各位。
+    $('work').className = 'work' + (state.mode === 'full' ? ' bare' : '');
+    // 重画之后滚动位置可能被浏览器夹回来（内容变短）——那种情况不一定发 scroll 事件，
+    // 所以浮标的状态也在这里跟一次。放在最后：上面几句可能刚动过 scrollTop。
+    paintToBottom();
+  }
+
+  function applySnapshot(snap) {
+    if (!snap) return;
+    if ('latest' in snap) state.latest = snap.latest;
+    // 正在流出来的那一段。服务端只在自己决定要显示之后才写它，所以这里是空字符串
+    // 不代表模型没在写，只代表「还不到显示的时候」。
+    if ('live' in snap) state.live = snap.live || '';
+    // 模型此刻的自言自语（鲸鱼娘的台词）。null = 这会儿没话说，气泡回到该姿势自己的词条。
+    if ('thought' in snap) state.thought = snap.thought || null;
+    if (snap.history) state.history = snap.history;
+    // 「服务端正去读这个会话的完整记录」。点开一个没看过的会话时，那一串要读一会儿
+    // 才补上来（最大的那条日志 20 MB、约半秒），这期间不能装作「这个会话是空的」。
+    state.historyLoading = snap.historyLoading === true;
+    // 「这份历史只到最近一段」。服务端读历史有上限（会话太大只读日志尾部），
+    // 所以内容可能是截断的——**这件事必须跟着内容一起传上来**，不能只在服务端知道。
+    state.historyTruncated = snap.historyTruncated === true;
+    state.historyNote = snap.historyNote || '';
+    if (snap.sessions) state.sessions = snap.sessions;
+    if (Array.isArray(snap.queued)) state.queued = snap.queued;
+    if ('boundSessionId' in snap) {
+      var wasBound = state.boundSessionId;
+      state.boundSessionId = snap.boundSessionId;
+      if (state.boundSessionId !== wasBound) {
+        saCache = null;
+        saCacheSession = null;
+        saCacheAt = 0;
+      }
+      // 手里那份轨迹属于上一个会话——换会话立刻作废：两场会话的轮号会撞在一起，
+      // 不清掉就会把新会话的过程贴到旧会话那一组上。完整模式下再拉一份新的。
+      if (state.boundSessionId !== wasBound) {
+        state.trajectory = [];
+        state.trajectorySeq = 0;
+        if (state.mode === 'full') requestTrajectory();
+      }
+      // 换了会话，指令菜单那份缓存就作废了（指令表是每个会话一份的，这个会话没在跑
+      // 时一条都读不到，见「斜杠指令」那一段）。重画一次，它自己会发现数据不属于
+      // 这个会话、去重取——否则用户点到的是上一个会话的指令，点下去必然被拒。
+      if (state.boundSessionId !== wasBound) paintCmdMenu();
+      // 权限档位也是每个会话各一份的（宿主的 currentValue 读的是这个会话那份投影）。
+      // 不重读的话，抽屉里显示的是上一个会话那一档——用户看到的就是一句假话。
+      if (state.boundSessionId !== wasBound) loadPermissions(state.boundSessionId);
+    }
+    // running 也在快照里，而且算的是**当前绑定的那个会话**。不接的话，
+    // 在导航栏切到别的会话时，那个会话会继承上一个会话的「正在执行」。
+    if ('running' in snap) setRunning(snap.running);
+    if ('subagentsRunning' in snap) {
+      state.subagentsRunning = snap.subagentsRunning === true;
+      $('btnSubagents').classList.toggle('subagent-running', state.subagentsRunning);
+      $('btnSubagents').setAttribute('aria-label', state.subagentsRunning ? '子智能体（运行中）' : '子智能体');
+    }
+    paintNavCurrent();
+    render();
+  }
+
+  // ---------------- 左侧导航栏 ----------------
+  // 数据分两层取：先列工作区（便宜），展开某个再去要它的会话（要读日志折标题，贵）。
+  // 本机实测 35 个工作区、最多的一个有 452 个会话，一次全拉会卡住手机。
+  var navList = null;      // 工作区列表，开一次取一次
+  var navSessions = {};    // workspaceId -> { sessions, total, truncated }
+  var navFollowTimers = {}; // workspaceId -> 当前标题补齐轮询定时器
+  var navExpanded = {};    // workspaceId -> 是否展开
+  var navWsFetching = {};  // workspaceId -> 会话列表请求在途（同一工作区只发一趟）
+  var navPresets = null;   // Agent 模式清单（2026-10-04：新建会话时手机上也要能选模式）
+  var navPresetsLoaded = false;
+  var navPickerWs = '';    // 正在挑模式的那个工作区（清单行内展开在它的「新建会话」下）
+
+  function openNav() {
+    $('nav').classList.add('open');
+    loadWorkspaces(false);
+  }
+  function closeNav() { $('nav').classList.remove('open'); }
+
+  function loadWorkspaces(force) {
+    if (navList && !force) { renderNav(); return; }
+    if (!force && navPrefetchPromise) {
+      $('navBody').innerHTML = '<div class="placeholder">正在读取…</div>';
       navPrefetchPromise.then(function () {
         if ($('nav').classList.contains('open')) renderNav();
       }).catch(function (err) {
@@ -2694,6 +4415,8 @@
   // 趁页面空闲先取一次；真正打开菜单时若已完成就直接画，不再把等待放在点击之后。
   var navPrefetchPromise = null;
   function prefetchWorkspaces() {
+    // Agent 模式清单也是导航栏要用的、也几乎不变——顺手一起预取（见 prefetchPresets）。
+    prefetchPresets();
     if (navList || navPrefetchPromise || navView !== 'tree' || !state.token) return;
     var run = function () {
       navPrefetchPromise = api('/mini/api/workspaces').then(function (body) {
@@ -2712,6 +4435,22 @@
     }
   }
 
+  /**
+   * Agent 模式清单（2026-10-04 用户要求：新建会话时手机上也要能选模式，PC 一直可以）。
+   * 只取一次；读不到就如实记「没有可选的」——建会话那条路会直接建默认，
+   * **不摆一个只有一项的选择题**，也不假装自己知道 DSH 有哪些模式。
+   */
+  function prefetchPresets() {
+    if (navPresetsLoaded || !state.token) return;
+    navPresetsLoaded = true;
+    api('/mini/api/agent-presets').then(function (body) {
+      navPresets = body && body.ok ? body : { ok: false, reason: (body && body.reason) || 'failed' };
+      if (navPickerWs && $('nav').classList.contains('open')) renderNav();
+    }).catch(function () {
+      navPresets = { ok: false, reason: 'failed' };
+    });
+  }
+
   function dayLabel(ts) {
     if (!ts) return '';
     var d = new Date(ts);
@@ -2724,6 +4463,11 @@
   function renderNav() {
     // 目录浏览那一屏接管整个面板。它自己画返回按钮，所以不走下面这套。
     if (navView === 'browse') { renderBrowse(); return; }
+    // 自愈：navigation-refresh（会话开跑/收工都会广播）清得掉数据、清不掉展开态，
+    // 重画出来的就是永远停着的「正在读取…」——取列表的请求原来只在点击时发，
+    // 没人补发就一直停着（真机报过：收起再展开才好，2026-10-03）。缺数据的补拉一次，
+    // loadWsSessions 自带在途闩，重复调用不会发第二趟。
+    Object.keys(navExpanded).forEach(function (id) { loadWsSessions(id); });
     var list = navList || [];
     // 「新建工作区」常驻在最上面：它是这一屏的入口，不该等有了会话才出现——
     // 一个工作区都还没有的人，恰恰最需要它。
@@ -2754,6 +4498,22 @@
     // 这一行都在。放在列表末尾的话，一个 452 条会话的工作区要划到底才看得到。
     var html = '<button class="ws-new" type="button" data-newws="' + escapeHtml(wsId) + '">'
       + '＋ 新建会话</button>';
+    // 模式清单（2026-10-04）：多于一种模式时，「新建会话」先把清单行内展开，
+    // 点谁建谁；坏档如实标「不可用」——不装作能点。
+    if (navPickerWs === wsId && navPresets && navPresets.ok && navPresets.presets.length > 1) {
+      html += '<div class="ws-modes">' + navPresets.presets.map(function (m) {
+        var title = '<b>' + escapeHtml(m.name || m.id) + '</b>';
+        var desc = m.description
+          ? '<span class="ws-mode-desc">' + escapeHtml(m.description) + '</span>' : '';
+        var def = navPresets.defaultId === m.id ? '<span class="ws-mode-def">默认</span>' : '';
+        if (m.broken) {
+          return '<div class="ws-mode ws-mode-broken">' + title
+            + '<span class="ws-mode-desc">不可用：' + escapeHtml(m.broken) + '</span></div>';
+        }
+        return '<button class="ws-mode" type="button" data-mode-ws="' + escapeHtml(wsId)
+          + '" data-mode-preset="' + escapeHtml(m.id) + '">' + title + desc + def + '</button>';
+      }).join('') + '</div>';
+    }
     var got = navSessions[wsId];
     if (!got) return html + '<div class="placeholder">正在读取…</div>';
     if (!got.sessions.length) return html + '<div class="placeholder">这个工作区还没有会话。</div>';
@@ -2995,7 +4755,17 @@
     }
     navExpanded[wsId] = true;
     renderNav();
-    if (navSessions[wsId]) return;
+    loadWsSessions(wsId);
+  }
+
+  // 取一个工作区的会话列表。点击和 renderNav 的自愈（见 renderNav 顶部）都走这里：
+  // navWsFetching 这道闩让同一工作区同时只有一趟在飞，别重复付读日志折标题的钱。
+  // 15 秒兜底解锁是给「请求永远不回来」留的——闩本身不能变成新的卡死点，
+  // 超过 15 秒就放行，让下一次渲染或点击还能再试（服务端有缓存，重发很便宜）。
+  function loadWsSessions(wsId) {
+    if (navSessions[wsId] || navWsFetching[wsId]) return;
+    navWsFetching[wsId] = true;
+    var bail = setTimeout(function () { delete navWsFetching[wsId]; }, 15000);
     /**
      * 接着问，直到服务端说「一条都不剩」。
      *
@@ -3025,11 +4795,15 @@
     }
     api('/mini/api/workspaces/' + encodeURIComponent(wsId) + '/sessions')
       .then(function (body) {
+        clearTimeout(bail);
         navSessions[wsId] = body;
+        delete navWsFetching[wsId];
         renderNav();
         followTitles(body, Date.now() + TITLE_FOLLOW_LIMIT_MS);
       })
       .catch(function (err) {
+        clearTimeout(bail);
+        delete navWsFetching[wsId];
         navSessions[wsId] = { sessions: [], total: 0 };
         renderNav();
         toast(err.message);
@@ -3041,7 +4815,17 @@
   // 服务端那道闸门拦不住这个：两个请求都是合法的。
   var creatingSession = false;
 
-  function createSession(wsId) {
+  function createSession(wsId, agentPreset) {
+    // 2026-10-04 用户要求：新建会话时手机上也要能选 agent 模式（PC 一直可以）。
+    // 多于一种模式、又没点名要哪种：先把清单行内展开让用户挑（照「新建文件夹」的
+    // 先例，不弹窗）；只有一种、或读不到清单：直接建 DSH 的默认模式——
+    // **不摆只有一个选项的选择题**，也不替用户猜。
+    if (agentPreset === undefined && navPresets && navPresets.ok && navPresets.presets.length > 1) {
+      navPickerWs = navPickerWs === wsId ? '' : wsId;
+      renderNav();
+      return Promise.resolve();
+    }
+    navPickerWs = '';
     if (creatingSession) return;
     creatingSession = true;
     Array.prototype.forEach.call($('navBody').querySelectorAll('.ws-new'), function (el) {
@@ -3061,7 +4845,7 @@
     // 不返回的话外面拿到的是 undefined，接不上任何后续。
     return api('/mini/api/workspaces/' + encodeURIComponent(wsId) + '/sessions', {
       method: 'POST',
-      body: '{}',
+      body: agentPreset ? JSON.stringify({ agentPreset: agentPreset }) : '{}',
     }).then(function (res) {
       done();
       // 接口把绑定后的快照一起给了，直接渲染——不这样的话，切过去的一瞬间
@@ -3132,6 +4916,12 @@
     if (at('[data-mkdir-cancel]')) { browseMkdir = false; renderNav(); return; }
     if (at('[data-mkdir-ok]')) { makeFolder(); return; }
 
+    // 模式清单里点一项：带着这个模式去建（2026-10-04，手机上也能选 agent 模式）。
+    var mode = at('[data-mode-preset]');
+    if (mode) {
+      createSession(mode.getAttribute('data-mode-ws'), mode.getAttribute('data-mode-preset'));
+      return;
+    }
     // 「新建会话」要排在 ws-head 之前判：它在 ws-body 里面、不是 ws-head，
     // 顺序上无所谓，但放在前面更清楚——这一支是动作，那一支是展开/收起。
     var fresh = at('.ws-new');
@@ -3142,24 +4932,91 @@
   });
 
   // ---------------- SSE ----------------
+  /** 从轨迹中取当前轮号：正在跑的那一组的轮号。没有就返回 null。 */
+  function currentTrajectoryTurn() {
+    var groups = state.trajectory || [];
+    for (var i = groups.length - 1; i >= 0; i--) {
+      var g = groups[i];
+      if (g && g.state === 'running' && g.turn != null) return g.turn;
+    }
+    // 没有正在跑的，取最近一个有轮号的
+    for (var j = groups.length - 1; j >= 0; j--) {
+      var h = groups[j];
+      if (h && h.turn != null) return h.turn;
+    }
+    return null;
+  }
+
+  /**
+   * 这条流是谁——轨迹订阅按连接记，就得先有身份。
+   *
+   * 服务端手上只有一条条 SSE 连接（`res`），一次普通的 POST 认不出「我是哪条流」。
+   * 所以由客户端自己报一个随机串，两处都带上：连流时的 `?clientId=…`，和之后每次
+   * 开关订阅的 POST。不报也能用，只是那种连接订不了轨迹。
+   *
+   * 存 `sessionStorage`（不是 localStorage）：一个标签页一个身份，第二个标签页不会
+   * 跟这一页抢同一条订阅；刷新后还在，免得每刷一次就多出一个「认不出」的连接。
+   * 无痕模式下存取会抛，就地退回「本次运行内固定」——订不上，但不影响别的功能。
+   */
+  var clientId = '';
+  try {
+    clientId = sessionStorage.getItem('dshMiniClient') || '';
+    if (!clientId) {
+      clientId = 'c' + Math.random().toString(36).slice(2, 10) + Date.now().toString(36);
+      sessionStorage.setItem('dshMiniClient', clientId);
+    }
+  } catch (e) {
+    clientId = 'c' + Math.random().toString(36).slice(2, 10) + Date.now().toString(36);
+  }
+  /** 服务端此刻认作「订了轨迹」的那个身份；空串 = 没订（切换模式的开关拿它判断）。 */
+  var subscribedClientId = '';
   var es = null;
   function connect() {
     if (es) { try { es.close(); } catch (e) {} es = null; }
     if (!state.token) { showGate(); return; }
     setStatus('', '连接中…');
-    es = new EventSource('/mini/api/stream?token=' + encodeURIComponent(state.token));
+    // clientId 每条连接都带（订阅的 POST 靠它认出这条流）；full=1 只在「完整」模式带，
+    // 服务端见到就自动把这条连接订上轨迹——断线重连沿用同一个地址，重新订上由服务端
+    // 自己完成，客户端不用再握手一次。
+    es = new EventSource('/mini/api/stream?token=' + encodeURIComponent(state.token)
+      + '&clientId=' + encodeURIComponent(clientId)
+      + (state.mode === 'full' ? '&full=1' : ''));
 
     es.addEventListener('open', function () {
       state.connected = true;
       updateStatusUI();
       $('connHint').textContent = '已连接';
       prefetchWorkspaces();
+      prefetchSubagents();
+      if (state.mode === 'full') {
+        // 首连与重连同一处：full=1 已让服务端订上这条连接，拿住身份，再对齐一次——
+        // 断线那一段路上可能丢过帧，用这份 GET 把 epoch/seq 校正（换代就整个换新）。
+        subscribedClientId = clientId;
+        requestTrajectory();
+      }
     });
     es.addEventListener('state', function (e) {
       state.connected = true;
       updateStatusUI();
       try { applySnapshot(JSON.parse(e.data)); } catch (err) {}
       prefetchWorkspaces();
+      prefetchSubagents();
+    });
+    // 轨迹的增量帧。JSON 解析失败就丢——宁可等下一份 GET 对齐，也不拿半帧去拼。
+    es.addEventListener('trajectory', function (e) {
+      var frame;
+      try { frame = JSON.parse(e.data); } catch (err) { return; }
+      receiveTrajectoryFrame(frame);
+    });
+    // 活片段帧（2026-10-04 用户解禁：完整模式要「正在想的片段一点点顺出来」）。
+    // 只进完整模式的轨迹组头；聊天/单帧、鲸鱼娘气泡一个字节都不碰。
+    es.addEventListener('trajectory-live', function (e) {
+      var frame;
+      try { frame = JSON.parse(e.data); } catch (err) { return; }
+      if (state.mode !== 'full') return;
+      if (frame.sessionId && state.boundSessionId && frame.sessionId !== state.boundSessionId) return;
+      state.trajectoryLive = typeof frame.detail === 'string' ? frame.detail : '';
+      render();
     });
     es.addEventListener('navigation-title', function (e) {
       var payload;
@@ -3177,6 +5034,37 @@
       }
       if (navExpanded[payload.workspaceId] && navView === 'tree') renderNav();
     });
+    es.addEventListener('subagent-metrics', function (e) {
+      var payload;
+      try { payload = JSON.parse(e.data); } catch (err) { return; }
+      if (!payload || payload.parentSessionId !== state.boundSessionId) return;
+      var row = null;
+      for (var i = 0; i < saRows.length; i++) {
+        if (saRows[i].id === payload.childId) { row = saRows[i]; break; }
+      }
+      if (!row) return;
+      row.tokens = payload.tokens;
+      row.durationMs = payload.durationMs;
+      row.lastTurnCompleted = payload.lastTurnCompleted;
+      if (saCache && saCacheSession === state.boundSessionId) {
+        for (var k = 0; k < (saCache.subagents || []).length; k++) {
+          if (saCache.subagents[k].id === payload.childId) {
+            Object.assign(saCache.subagents[k], payload);
+            break;
+          }
+        }
+      }
+      if (saPanel.classList.contains('open') && !saCurrent) saRenderList(saCache || { ok: true, subagents: saRows });
+    });
+    es.addEventListener('navigation-refresh', function () {
+      navList = null;
+      navSessions = {};
+      saCache = null;
+      saCacheSession = null;
+      saCacheAt = 0;
+      if ($('nav').classList.contains('open')) loadWorkspaces(false);
+      else prefetchWorkspaces();
+    });
     es.addEventListener('reply', function (e) {
       var payload = JSON.parse(e.data);
       // interrupted 必须带上：这条是「实时推过来的那一条」，走的是和刷新时
@@ -3187,11 +5075,16 @@
         text: payload.text, timestamp: payload.timestamp,
         sessionId: payload.sessionId, interrupted: cut,
       };
-      if (state.mode === 'chat') {
+      // 完整模式画的也是这串聊天记录（renderFull 复用 renderChat），回复落定
+      // 同样要追加进去，否则要等下一份快照才补上；单帧不画记录，照旧不进。
+      if (state.mode !== 'minimal') {
         state.history = (state.history || []).concat([
           {
             role: 'assistant', text: payload.text, timestamp: payload.timestamp,
             sessionId: payload.sessionId, interrupted: cut,
+            // 完整模式把轨迹块插回对话原位要用：从轨迹中取当前轮号。
+            // 手机本地回显时轮还没开，先留空；服务端快照补上来时会带上真轮号。
+            turn: currentTrajectoryTurn(),
           }
         ]);
       }
@@ -3463,17 +5356,29 @@
         // **不能显示成空列表**：那等于说「这个会话没有指令」，是另一回事。
         state.commandsError = (res && res.error) || '读不到指令列表';
       }
-      paintCmdMenu();
+      paintCommandViews();
     }).catch(function (err) {
       state.commandsLoading = false;
       if (forSession !== state.boundSessionId) return;
       state.commandsFor = forSession;
       state.commands = null;
       state.commandsError = err.message || '读不到指令列表';
-      paintCmdMenu();
+      paintCommandViews();
     });
   }
 
+  /**
+   * 指令表换了一份之后，**所有正在看着它的地方**都要重画。
+   *
+   * 现在有两处：打 / 弹出来的菜单，和统一操作面板里的那个列表。回调那一个由面板
+   * 那一段自己挂上——因为它在这一段下面，而这一段会被测试单独抠出来跑（那时面板还不存在）。
+   */
+  var onCommandsReady = null;
+  function paintCommandViews() {
+    paintCmdMenu();
+    if (onCommandsReady) onCommandsReady();
+  }
+
   /**
    * 画（或收起）那只菜单。
    *
@@ -3484,6 +5389,9 @@
   function paintCmdMenu() {
     var el = $('cmdMenu');
     if (!el) return;
+    // 输入框被清空了 = 用户把刚才那条指令整个删了，这是「明确取消」那一步。
+    // 放在这儿而不是 send() 里：清空之后他往往还要改写成普通提问，那次 send 不该再被拦。
+    if (!inputEl.value.trim()) state.pendingCommand = null;
     var prefix = slashQuery();
     if (prefix === null) { hideCmdMenu(); return; }
     var wasOpen = !el.hidden;
@@ -3516,16 +5424,22 @@
   }
 
   /**
-   * 菜单里点了一条。
+   * 菜单/面板里点了一条。
    *
-   * 分两路，判据是服务端给的 hint（这条指令要不要参数）：
+   * 分两路，判据是服务端给的 hint（这条指令要不要参数）。两路都**不执行**，
+   * 除非是打了 / 之后从菜单里点了一条不要参数的（那种当场跑，见 deferRun 的说明）：
    *   · 不要参数 —— 直接执行。让用户再按一次发送是白白多一步。
    *   · 要参数   —— 把 `/名字 ` 填进输入框，末尾留一个空格、光标停在后面，并把
    *     hint 那句话挂到输入框的 placeholder 上。
    *     **不自己编一句「请输入参数」**：只有服务端知道这条指令要什么，
    *     编一句就等于让用户照着一个错的提示去填。
+   *
+   * @param {string} name
+   * @param {boolean} [deferRun] 面板那条路传 true：**一次点击不执行**，只把这一行放进
+   *   输入框，由「发送」那一下确认（没有参数提示的指令也照此办理，宁可多问一句）。
+   *   打 / 弹出来的那个菜单不传——它本来就是「扫一眼挑一个」，多一步反而碍事。
    */
-  function pickCommand(name) {
+  function pickCommand(name, deferRun) {
     var list = state.commands || [];
     var cmd = null;
     for (var i = 0; i < list.length; i++) { if (list[i].name === name) cmd = list[i]; }
@@ -3537,12 +5451,25 @@
     if (cmd.hint) {
       inputEl.value = '/' + cmd.name + ' ';
       inputEl.placeholder = cmd.hint;
+      // 这一行「曾经是一条指令」：名字要是被删掉，send 不许拿它当普通提问发出去。
+      state.pendingCommand = cmd.name;
       inputEl.focus();
       // 光标停在最后：停在名字中间的话，用户接着打的字会插进名字里去。
       inputEl.setSelectionRange(inputEl.value.length, inputEl.value.length);
       autoGrow();
       return;
     }
+    if (deferRun) {
+      // 面板那条路：只填不跑。等用户按「发送」——那就是明确的确认执行动作。
+      inputEl.value = '/' + cmd.name;
+      state.pendingCommand = cmd.name;
+      inputEl.focus();
+      inputEl.setSelectionRange(inputEl.value.length, inputEl.value.length);
+      autoGrow();
+      return;
+    }
+    // 当场执行：框里不留东西，也就不存在「曾是指令」这回事。
+    state.pendingCommand = null;
     inputEl.value = '';
     autoGrow();
     runCommand('/' + cmd.name);
@@ -3605,10 +5532,13 @@
     // 本地上限和服务端是同一个数（由服务端注入），先拦一道省得白传一场。
     if (MAX_UPLOAD > 0 && file.size > MAX_UPLOAD) {
       toast('「' + name + '」有 ' + humanSize(file.size) + '，超过上限 ' + humanSize(MAX_UPLOAD));
-      return;
+      // 多选时是排队传的（见 filePick 的 change），所以这里也要回一个「承诺」——
+      // 否则这一份被拦下会让整条链断掉，后面几张就再也传不出去了。
+      return Promise.resolve();
     }
     setAttachBusy(true);
-    api('/mini/api/upload?name=' + encodeURIComponent(name) + '&size=' + file.size,
+    // 返回这条链：多选时调用方靠它排队（一张传完再传下一张）。
+    return api('/mini/api/upload?name=' + encodeURIComponent(name) + '&size=' + file.size,
       { method: 'POST', body: file })
       .then(function (res) {
         state.uploads.push({ uploadId: res.uploadId, name: res.name, bytes: res.bytes });
@@ -3620,17 +5550,38 @@
       .then(function () { setAttachBusy(false); });
   }
 
-  /** 附件小条。有东西才出现，没有就整块收起来——不占地方。 */
+  /**
+   * 附件小条。有东西才出现，没有就整块收起来——不占地方。
+   *
+   * 统一操作面板里那几行「已选文件」是**同一份数据、同一份 HTML**：都由这里画，
+   * 都读 state.uploads。别在面板里另存一个附件数组——那样两处迟早对不上
+   * （面板里删了一条，小条还挂着，用户就不知道该信哪个）。
+   */
   function renderAttach() {
     var bar = $('attachBar');
     if (!bar) return;
     var list = state.uploads || [];
-    bar.hidden = !list.length;
-    bar.innerHTML = list.map(function (f, i) {
+    var chips = list.map(function (f, i) {
       return '<span class="chip"><span class="nm">' + escapeHtml(f.name) + '</span>'
         + '<span class="sz">' + humanSize(f.bytes) + '</span>'
         + '<button class="x" type="button" data-drop="' + i + '" aria-label="去掉">×</button></span>';
     }).join('');
+    bar.hidden = !list.length;
+    bar.innerHTML = chips;
+    var box = $('opsFiles');
+    if (box) { box.hidden = !list.length; box.innerHTML = chips; }
+  }
+
+  /**
+   * 去掉一条已选文件。小条和面板共用这一处，别写两份。
+   *
+   * 编号必须从**被点的按钮**上读（`closest('[data-drop]')`），不能读 e.target：
+   * ✕ 是按钮里那个图形，手指落上去 e.target 就是图形本身，读它只能拿到 null，
+   * 于是静默什么都不做（2026-09-28 实机报过的那个 bug）。
+   */
+  function dropUpload(btn) {
+    state.uploads.splice(Number(btn.getAttribute('data-drop')), 1);
+    renderAttach();
   }
 
   function send() {
@@ -3643,6 +5594,21 @@
     // 只带文件、一个字不写也是合法的：「这份文件你看一下」本来就是常见用法。
     // 两样都没有才算空。
     if (!text && !files.length) return;
+
+    // **点过指令、又把名字删掉的那一行，不许当普通提问发出去。**
+    //
+    // 从面板/菜单点了一条「要参数」的指令之后，输入框里躺着 `/名字 参数`。用户要是把
+    // 名字删了、只留参数，这一行就不再以 / 开头，原来会被当成一次普通提问发给模型——
+    // 白花一次额度，而且他还以为自己跑的是那条指令。
+    //
+    // 拦在**清空输入框之前**：那一行字要留着，补回名字就能接着发。出路有两条，
+    // 都在提示里说清楚了：补回开头的指令名，或者清空输入框（清空 = 明确取消这条指令，
+    // 由 paintCmdMenu 在每次输入时把那枚标记撤掉）。
+    if (text.charAt(0) !== '/' && state.pendingCommand) {
+      toast('这是 /' + state.pendingCommand + ' 的参数，指令名被删掉了。'
+        + '把 /' + state.pendingCommand + ' 补回开头，或者清空输入框改问别的。');
+      return;
+    }
     unlockAudio();
     // **发指令这个动作，无条件拉回底部。**
     //
@@ -3677,6 +5643,8 @@
       // 这里**不动 state.uploads**——清掉就等于把用户刚传上来的文件悄悄扔了，
       // 而他还以为跟着发出去了。留在小条上看得见，想发就配一句话再发一次。
       if (files.length) toast('指令带不了附件，附件还留在下面');
+      // 跑出去了，那枚「曾是指令」的标记就该撤掉：留着会拦住下一条普通提问。
+      state.pendingCommand = null;
       runCommand(text);
       return;
     }
@@ -3702,22 +5670,34 @@
 
     api('/mini/api/send', { method: 'POST', body: JSON.stringify({ text: text, uploadIds: uploadIds }) })
       .then(function (res) {
-        // 服务端说这条排队了（发的时候正在跑），给一句话。
+        // 服务端说这条排队了 / 插话了（发的时候正在跑），给一句话。
         // 队列那块也会跟着推过来，但那要等一个来回；先给个即时反馈，
         // 免得用户以为又石沉大海了。
+        //
+        // **两条要说不同的话**（2026-10-06）：插话是「下一个步骤边界就取走」，
+        // 通常几秒；排队是「等这一轮跑完」，可能好几分钟。都回一句「已排队」
+        // 就等于把插话也说成了排队——用户就是这么发现「插话好像没实现」的。
+        if (res && res.steered) {
+          toast('已插话，它下一步就看到');
+          return;
+        }
         if (res && res.queued) {
           toast('已排队，跑完这轮就轮到它');
           // **排队不算发出去，所以这里不回显气泡。** 用户 2026-09-22 实机提的：
           // 排队的指令立刻长成一条指令气泡，看着就像已经发出去了，其实还在队列里。
           // 它已经在下面的排队列表里露过面了，那就是它此刻该待的地方；
           // 轮到它真跑起来时，服务端会把它记进 history，气泡那时才出现。
+          // 插话走的是同一条账（等它真被取走时才长气泡），所以这里一起 return。
           return;
         }
         // 真发出去了才回显。放在这里而不是发之前，是因为**发之前还不知道会不会排队**；
         // 顺带也解决了发送失败时屏幕上留一条假气泡的问题。
         if (state.mode !== 'minimal') {
           state.history = (state.history || []).concat([
-            { role: 'user', text: shown, timestamp: Date.now() }
+            { role: 'user', text: shown, timestamp: Date.now(),
+              // 完整模式把轨迹块插回对话原位要用：从轨迹中取当前轮号。
+              // 手机本地回显时轮还没开，先留空；服务端快照补上来时会带上真轮号。
+              turn: currentTrajectoryTurn() }
           ]);
           render();
         }
@@ -3735,22 +5715,160 @@
       });
   }
 
-  $('btnAttach').addEventListener('click', function () { $('filePick').click(); });
+  // ---------------- 统一操作面板（输入框旁边那一个入口） ----------------
+  //
+  // 形态是用户 2026-10-02 定的：输入框旁边**一个**入口，点开是一张底部抽屉，
+  // 上面「添加文件」、下面「调用指令」。原来这两件事各有各的门——回形针直接开文件
+  // 选择器、打 `/` 才弹指令菜单——手机上没人知道打一个斜杠还能调指令。
+  //
+  // 四条复用纪律（都不许另起一套）：
+  //   · 外壳 = 设置抽屉那一套（#settings.open + .sheet），不新建样式体系；
+  //   · 指令数据 = state.commands 那份按会话缓存，与打 / 弹出来的菜单**同一份**，
+  //     判据也共用 needCommands()，不写「面板专用」的第二套；
+  //   · 指令行 = 现成的 pickCommand(name, true)，一次点击**不执行**；
+  //   · 附件 = state.uploads + renderAttach()，面板里那几行就是小条那几行。
+  //
+  // 「指令带附件一起发」这一轮**不做**（手机的上传小票 DSH 的指令接口不认，见 onCommand
+  // 那段说明）——所以对声明了要附件的指令，面板上如实标一句「手机暂时带不了附件」，
+  // 不假装支持。
+  var ops = $('ops');
+  // 面板是不是开着。指令表换一份时要按它决定要不要重画列表（见 paintCommandViews）。
+  var opsOpen = false;
+
+  function openOps() {
+    opsOpen = true;
+    // 先把键盘收起来：这张抽屉贴着底边，键盘不收，它就被顶到看不见的地方。
+    if (inputEl.blur) inputEl.blur();
+    ops.classList.add('open');
+    // 与打 / 时同一个判据：换了会话要重取，上次没取到过就再试一次。
+    if (needCommands() || state.commandsError) loadCommands();
+    paintOps();
+  }
+
+  function closeOps() {
+    opsOpen = false;
+    ops.classList.remove('open');
+  }
+
+  /**
+   * 画面板里的指令列表。
+   *
+   * 和打 / 那个菜单同源（state.commands），但这里是「搜」不是「按前缀」：面板上那个框是
+   * 一句话搜索框，名字和说明都匹配（桌面端也是名字和标题一起匹配）。顺手带个 `/c` 也算，
+   * 那是用户平时打指令的手势。
+   *
+   * **取不到就说原因**，不显示成「一条都没有」——两件事，用户能做的也不同。
+   */
+  function paintOps() {
+    var listEl = $('opsCmds');
+    if (!listEl) return;
+    if (state.commandsError) {
+      listEl.innerHTML = '<div class="cmd-note">' + escapeHtml(state.commandsError) + '</div>';
+      return;
+    }
+    if (!state.commands) {
+      // 取回来之前先占个位——不然打开面板是一片空白，看着像坏了。
+      listEl.innerHTML = '<div class="cmd-note">正在读取可用的指令…</div>';
+      return;
+    }
+    var filterEl = $('opsFilter');
+    var q = String((filterEl && filterEl.value) || '').trim().toLowerCase();
+    if (q.charAt(0) === '/') q = q.slice(1);
+    var rows = state.commands.filter(function (c) {
+      if (!q) return true;
+      return (String(c.name) + ' ' + String(c.description || '')).toLowerCase().indexOf(q) >= 0;
+    });
+    if (!rows.length) {
+      listEl.innerHTML = '<div class="cmd-note">没有对得上的指令。</div>';
+      return;
+    }
+    listEl.innerHTML = rows.map(function (c) {
+      return '<button class="cmd-row" type="button" data-cmd="' + escapeHtml(c.name) + '">'
+        + '<span class="cmd-top">'
+        + '<span class="cmd-name">/' + escapeHtml(c.name) + '</span>'
+        + '<span class="cmd-desc">' + escapeHtml(c.description || '') + '</span>'
+        + '</span>'
+        + (c.attachments ? '<span class="cmd-flag">手机暂时带不了附件</span>' : '')
+        + '</button>';
+    }).join('');
+  }
+
+  // 面板里点一行：**一次点击不执行**（deferRun）。要参数的把 hint 挂成占位提示、把
+  // `/名字 ` 填进输入框；不要参数的也只填进去，等「发送」那一下——宁可多问一句，
+  // 也不能点错一下就真跑掉。
+  $('opsCmds').addEventListener('click', function (e) {
+    var btn = e.target && e.target.closest ? e.target.closest('[data-cmd]') : null;
+    if (!btn) return;
+    closeOps();
+    pickCommand(btn.getAttribute('data-cmd'), true);
+  });
+
+  $('opsFilter').addEventListener('input', paintOps);
+  $('opsClose').addEventListener('click', closeOps);
+  // 点抽屉外面那一层 = 关掉（和设置抽屉同一条规矩）。
+  ops.addEventListener('click', function (e) { if (e.target === ops) closeOps(); });
+
+  // 「添加文件」两件事：选文件、拍照。都走原来那个藏起来的 #filePick——手机上这两件事
+  // 本来就是同一个系统选择器，区别只在「要不要限定图片、要不要调后置摄像头」。
+  //
+  // **多选只给「选文件」**（2026-10-05 用户要求：图库和文件里只能单选，改成多选）。
+  // 拍照那一条不加 multiple：相机一次就出一张，摆个多选没有意义。
+  function openFilePicker(camera) {
+    var pick = $('filePick');
+    if (!pick) return;
+    if (camera) {
+      pick.setAttribute('accept', 'image/*');
+      pick.setAttribute('capture', 'environment');
+      pick.removeAttribute('multiple');
+    } else {
+      pick.removeAttribute('accept');
+      pick.removeAttribute('capture');
+      pick.setAttribute('multiple', '');
+    }
+    pick.click();
+  }
+  $('opsPick').addEventListener('click', function () { openFilePicker(false); });
+  $('opsShot').addEventListener('click', function () { openFilePicker(true); });
+
+  // 面板里那行已选文件上的 ✕。走的是和小条同一个 dropUpload()。
+  $('opsFiles').addEventListener('click', function (e) {
+    var btn = e.target && e.target.closest ? e.target.closest('[data-drop]') : null;
+    if (!btn) return;
+    dropUpload(btn);
+  });
+
+  // 指令表换了一份（换会话、第一次取到）时，面板开着就跟着重画。
+  onCommandsReady = function () { if (opsOpen) paintOps(); };
+
+  $('btnAttach').addEventListener('click', function () { openOps(); });
   $('filePick').addEventListener('change', function (e) {
-    var f = e.target.files && e.target.files[0];
+    // 多选：一次可能挑了好几张，**一个接一个传**（2026-10-05 用户要求多选）。
+    // 为什么不用并发：上传的「忙碌」是同一个开关（setAttachBusy 控制那个回形针），
+    // 并发传的话最后一个传完就把按钮放开了，其实还有在飞的——用户会以为传完了。
+    // 排队传则从头到尾都是忙的，什么时候能再点一目了然。
+    var files = Array.prototype.slice.call(e.target.files || []);
     // 清掉 value：不清的话，连着选同一个文件第二次不会触发 change，
     // 用户会觉得「点了没反应」。
     e.target.value = '';
-    if (f) uploadFile(f);
+    if (!files.length) return;
+    // **选完就回主页面**（2026-10-05 用户要求：选完文件点完成，直接回到主页面，
+    // 不要停在这张「添加文件」面板上）。
+    // 关在这里是安全的：文件是**后台在传**的，主页面上的附件小条会一条条冒出来；
+    // 面板里那几行「已选文件」本来也只是同一份数据的另一处画法（见 renderAttach），
+    // 关掉面板不会打断上传。
+    closeOps();
+    files.reduce(function (chain, f) {
+      return chain.then(function () { return uploadFile(f); });
+    }, Promise.resolve());
   });
   $('attachBar').addEventListener('click', function (e) {
     var btn = e.target.closest ? e.target.closest('[data-drop]') : null;
     if (!btn) return;
-    state.uploads.splice(Number(btn.getAttribute('data-drop')), 1);
-    renderAttach();
+    dropUpload(btn);
   });
 
   $('btnSend').addEventListener('click', send);
+
   inputEl.addEventListener('input', autoGrow);
   // 每敲一个字重算一次菜单。它自己会先看「是不是一个没打完的 / 名字」再决定动不动，
   // 所以这里不用加判据。
@@ -3781,8 +5899,21 @@
   $('btnSettings').addEventListener('click', function () {
     sheet.classList.add('open');
     $('connHint').textContent = state.connected ? '已连接' : '未连接';
+    // 权限档位那块也在这儿重读一次：它显示的是「现在在哪一档」的实时状态（电脑端
+    // 随时能改），而且启动时那一次要是没读成，不重读就整块再也不出现。
+    loadPermissions(state.boundSessionId);
+    // 版本号那行也现读一次：它只在设置页里看得见，没必要开机就为它跑一趟。
+    // （watchBuild 是同一个 script 块里的函数声明，这里调得到。）
+    watchBuild();
+    // 繁忙时的发送行为也现读一次：**电脑上随时能改**，开机读那一次会过期。
+    loadBusyEnter();
+    // 进阶设置（电脑端界面）同样现读。它还会被电脑端从小标签关掉——
+    // 手机上那份状态不能一直停在「开着」。
+    loadMirror();
   });
   $('btnClose').addEventListener('click', function () { sheet.classList.remove('open'); });
+  // 顶部吸顶那个关闭口（2026-10-05 设置页改整屏时加的）。
+  $('btnSettingsClose').addEventListener('click', function () { sheet.classList.remove('open'); });
   sheet.addEventListener('click', function (e) { if (e.target === sheet) sheet.classList.remove('open'); });
 
   // ---------------- 子智能体 ----------------
@@ -3796,6 +5927,11 @@
   var saPanel = $('subagents');
   var saRows = [];        // 最近一次读到的清单，点行时按 id 找回来
   var saCurrent = null;   // 正在看运行记录的那一道；null = 现在在看清单
+  var saCache = null;
+  var saCacheSession = null;
+  var saCacheAt = 0;
+  var saInflight = null;
+  var SA_CACHE_TTL = 5000;
 
   function saToList() {
     saCurrent = null;
@@ -3857,14 +5993,17 @@
 
   function saRenderList(body) {
     var listEl = $('subagentsList');
+    // 这两句空态都落在 .sa-list 里，而那个容器用负 16px 把内容拽到贴屏边
+    // （为了让分隔线横贯整屏）——所以得补上 sa-none-indent 把 16px 加回来，
+    // 否则这行字会顶到屏幕最左边。这个类是早就写好的，之前没给空态用上。
     if (!body || !body.ok) {
-      listEl.innerHTML = '<div class="sa-none">'
+      listEl.innerHTML = '<div class="sa-none sa-none-indent">'
         + escapeHtml((body && body.error) || '读不到子智能体。') + '</div>';
       return;
     }
     saRows = body.subagents || [];
     if (!saRows.length) {
-      listEl.innerHTML = '<div class="sa-none">这个会话还没有派出过子智能体。</div>';
+      listEl.innerHTML = '<div class="sa-none sa-none-indent">这个会话还没有派出过子智能体。</div>';
       return;
     }
     listEl.innerHTML = saRows.map(saRowHtml).join('');
@@ -3876,11 +6015,48 @@
     }
   }
 
-  function saLoad() {
+  function saLoad(force) {
+    var sessionId = state.boundSessionId || '';
+    if (!force && saCache && saCacheSession === sessionId && Date.now() - saCacheAt < SA_CACHE_TTL) {
+      saRenderList(saCache);
+      return;
+    }
+    if (!force && saInflight && saInflight.sessionId === sessionId) return;
     $('subagentsList').innerHTML = '<div class="sa-none sa-none-indent">正在读取…</div>';
-    api('/mini/api/subagents').then(saRenderList).catch(function (err) {
-      $('subagentsList').innerHTML = '<div class="sa-none">'
+    var request = api('/mini/api/subagents');
+    saInflight = { sessionId: sessionId, request: request };
+    request.then(function (body) {
+      if (state.boundSessionId === sessionId && body && body.ok) {
+        saCache = body;
+        saCacheSession = sessionId;
+        saCacheAt = Date.now();
+      }
+      saRenderList(body);
+    }).catch(function (err) {
+      $('subagentsList').innerHTML = '<div class="sa-none sa-none-indent">'
         + escapeHtml(err && err.message || '没读出来。') + '</div>';
+    }).finally(function () {
+      if (saInflight && saInflight.request === request) saInflight = null;
+    });
+  }
+
+  // 连接后趁页面空闲预取当前会话的子代理清单。首次读取可能很慢，不能把这段等待
+  // 放到用户点入口之后；入口点击时会复用 saInflight，和导航工作区同一套策略。
+  function prefetchSubagents() {
+    var sessionId = state.boundSessionId || '';
+    if (!sessionId || saCacheSession === sessionId || saInflight) return;
+    var request = api('/mini/api/subagents');
+    saInflight = { sessionId: sessionId, request: request };
+    request.then(function (body) {
+      if (state.boundSessionId !== sessionId || !body || !body.ok) return;
+      saCache = body;
+      saCacheSession = sessionId;
+      saCacheAt = Date.now();
+      if (saPanel.classList.contains('open') && !saCurrent) saRenderList(body);
+    }).catch(function () {
+      // 预取失败不影响入口；用户点开时仍会重试。
+    }).finally(function () {
+      if (saInflight && saInflight.request === request) saInflight = null;
     });
   }
 
@@ -4005,6 +6181,167 @@
     saLoad();
   });
   $('subagentsClose').addEventListener('click', function () { saPanel.classList.remove('open'); });
+
+  // ---------------- 插件页面（2026-10-04） ----------------
+  // 从设置里点「插件」→ 立刻盖到设置上面（#plugins 的 z-index 比 #settings 高一档）；
+  // 关掉它就回到设置，不用退出设置再去找。分层和两条留白见上面 #plugins 那段 CSS。
+  var pluginsPanel = $('plugins');
+  $('btnPlugins').addEventListener('click', function () {
+    pluginsPanel.classList.add('open');
+    loadPlugins();
+  });
+  $('pluginsClose').addEventListener('click', function () { pluginsPanel.classList.remove('open'); });
+  // 点浮层空白处也关掉（和子智能体面板同一套）。
+  pluginsPanel.addEventListener('click', function (e) {
+    if (e.target === pluginsPanel) pluginsPanel.classList.remove('open');
+  });
+
+  function loadPlugins() {
+    var listEl = $('pluginsList');
+    listEl.innerHTML = pluginNote('正在读取插件列表…');
+    api('/mini/api/plugins').then(function (r) {
+      listEl.innerHTML = renderPlugins(r || {});
+    }).catch(function (err) {
+      listEl.innerHTML = pluginNote('读不到插件列表：' + escapeHtml(err.message || '出错了'), true);
+    });
+  }
+
+  /**
+   * 三块，和 PC 的「插件」页 + 「内置插件」页对齐：
+   *
+   *   官方          —— 能装还没装的（npm 包那一层）
+   *   已安装 · 内置 —— **Cordis Loader 的实时条目表**，分「全局插件」和「会话插件」。
+   *                    这才是 DSH 的本体粒度：一整套系统是几百个插件模块拼起来的。
+   *                    （2026-10-04 用户指出：内置插件拿 npm 包充数是不对的，那只有几个。）
+   *   已安装 · 第三方 —— 用户自己装的包。DSH 自家的包不在这里列——它们在上面
+   *                    以「模块」的身份出现，那才是「一切皆插件」该有的样子。
+   */
+  function renderPlugins(r) {
+    var bundles = r.bundles || [];
+    var official = bundles.filter(function (b) { return b.optional && !b.installed; });
+    var third = bundles.filter(function (b) {
+      return b.installed && b.name.indexOf('@deepseek-ai/') !== 0;
+    });
+    var entries = r.entries || [];
+    var presets = r.presets || [];
+    var sessionRows = 0;
+    presets.forEach(function (p) { sessionRows += (p.rows || []).length; });
+
+    var html = '';
+    if (r.bundlesError) html += pluginNote('包清单读不到：' + escapeHtml(r.bundlesError), true);
+    if (r.officialError) html += pluginNote('官方卡片读不到：' + escapeHtml(r.officialError), true);
+    // 官方那一栏是两样拼的（PC 也是这个次序）：可开关的官方包在前，
+    // 注册了设置卡片的官方插件（终端 / Agent 循环 / 子智能体 / 网页搜索）在后。
+    html += pluginGroup('官方', official.concat(r.official || []), officialRow);
+
+    if (r.builtinError) {
+      html += pluginNote('内置插件读不到：' + escapeHtml(r.builtinError), true);
+    } else {
+      // 内置这一层自己也是一个可折的分组，里面再套「全局插件」「会话插件」两层。
+      var inner = '';
+      if (entries.length) inner += pluginGroup('全局插件', entries, invRow, 2);
+      if (sessionRows) {
+        // 这一层的数目是**四个预设各自行数之和**：同一个插件被好几个预设都带上，
+        // 所以会重复计（实测共 95 行、其实只有 32 个不重复的插件）。
+        // 这里**不再拿括号去解释**（2026-10-05 用户要那句去掉）——下面每个预设
+        // 各报各的数（29/30/6/30），加起来就是这个数，顺着看下去就能对上。
+        var sessionInner = '';
+        presets.forEach(function (p) {
+          var rows = p.rows || [];
+          if (!rows.length) return;
+          if (p.broken) sessionInner += pluginNote('这个预设的组合读不出来：' + escapeHtml(p.broken), true);
+          var body = rows.map(invRow).join('');
+          // 只有一个预设就不必再套一层；多预设才把预设名露出来（PC 那边是个下拉）。
+          // 「（默认）」照 PC 标上：它说的是「不指定模式时按它来」，用户得有这个参照。
+          sessionInner += presets.length > 1
+            ? pluginFold(p.name + (p.isDefault ? '（默认）' : ''), rows.length, body, 2)
+            : body;
+        });
+        inner += pluginFold('会话插件', sessionRows, sessionInner, 2);
+      }
+      html += inner
+        ? pluginFold('已安装 · 内置', entries.length + sessionRows, inner, 1)
+        : pluginNote('这台电脑没报出内置插件。');
+    }
+
+    html += pluginGroup('已安装 · 第三方', third, bundleRow);
+    if (!html) html = pluginNote('没有插件。');
+    return html;
+  }
+
+  function pluginNote(text, isErr) {
+    return '<div class="' + (isErr ? 'plugin-note' : 'sa-none sa-none-indent') + '">' + text + '</div>';
+  }
+
+  /**
+   * 一层**可折叠**的分组。默认收起——HTML 里不写 open 属性就自然是收着的，
+   * 「默认折叠」不需要额外的代码去保证。没有正文的空层整个不画（点开是个空壳没意义）。
+   *
+   * `depth` 只影响字号轻重（1 = 官方 / 已安装那一级，2 = 里面那两级）。
+   * `note` 是接在计数后面的小注（比如「32 个不重复，4 个预设各算各的」）。
+   */
+  function pluginFold(title, count, bodyHtml, depth, note) {
+    if (!bodyHtml) return '';
+    return '<details class="plugin-fold depth-' + (depth || 1) + '"><summary>'
+      + escapeHtml(title) + ' ' + count + (note ? '（' + escapeHtml(note) + '）' : '')
+      + '</summary>' + bodyHtml + '</details>';
+  }
+
+  /** 一堆插件：可折的一层。空的那堆整个不画（不占地方、也不说假话）。 */
+  function pluginGroup(title, rows, rowFn, depth) {
+    if (!rows.length) return '';
+    return pluginFold(title, rows.length, rows.map(rowFn).join(''), depth);
+  }
+
+  function rowHtml(name, desc, badge, descCls) {
+    return '<div class="plugin-row">'
+      + '<div class="plugin-info">'
+      + '<span class="plugin-name">' + escapeHtml(name) + '</span>'
+      + (desc ? '<span class="plugin-desc' + (descCls || '') + '">' + escapeHtml(desc) + '</span>' : '')
+      + '</div>'
+      + (badge ? '<span class="plugin-badge ' + badge[0] + '">' + escapeHtml(badge[1]) + '</span>' : '')
+      + '</div>';
+  }
+
+  /**
+   * 一行「包」（官方 / 第三方）。显示名用服务端给的 `title`（本地化标题），
+   * 没有就是包名——官方插件在 PC 上显示的正是「智能体团队」这类中文名。
+   */
+  function bundleRow(b) {
+    var desc = b.description || '';
+    if (b.problem) desc = desc ? desc + ' · ' + b.problem : b.problem;
+    return rowHtml(b.title || b.name, desc,
+      [b.enabled ? 'on' : 'off', b.enabled ? '已启用' : '已停用'],
+      b.problem ? ' plugin-problem' : '');
+  }
+
+  /**
+   * 官方那一栏的一行：两种东西都在这里。
+   *   · 包（bundles）——带启用状态，能开关；
+   *   · 设置卡片（cards）——不是开关，是一张设置页，所以没有状态徽标（PC 上也是这样）。
+   */
+  function officialRow(item) {
+    if (item.kind === 'card') return rowHtml(item.title, item.description || '', null);
+    return bundleRow(item);
+  }
+
+  /**
+   * 一行「内置插件」（Loader 条目 / 预设组合行）。`title` 是服务端压好的短名
+   * （`@deepseek-ai/dsh-tool-fs` → `tool-fs`），照 PC 的内置插件面板。
+   */
+  function invRow(e) {
+    return rowHtml(e.title || e.moduleName, e.description || '', invBadge(e));
+  }
+
+  /** 运行时状态。**问不到就不编**——预设没挂载时那一行本来就没有运行状态。 */
+  function invBadge(e) {
+    if (e.phase === 'failed') return ['err', '失败'];
+    if (e.conditional) return ['off', '按条件'];
+    if (!e.enabled) return ['off', '已停用'];
+    if (e.phase === 'active') return ['on', '运行中'];
+    if (e.phase === 'loading' || e.phase === 'pending') return ['off', '加载中'];
+    return null;
+  }
   $('subagentsBack').addEventListener('click', saToList);
   saPanel.addEventListener('click', function (e) {
     if (e.target === saPanel) saPanel.classList.remove('open');
@@ -4027,17 +6364,53 @@
   // 映射不到时会退回标识符本身，所以这里拿到的一定是个真名字，不会是空格。
   // 页面只管显示拿到的东西。
   var permOptions = null;   // null = 还没读到（或这台电脑没这个能力）
+  var permFor = null;       // 手上这一份 currentValue 是**哪个会话**的
   var permArmed = '';       // 哪一档正在等「再点一次」
 
-  function loadPermissions() {
+  /**
+   * 读一次档位盘。
+   *
+   * **这是个要反复读的动作，不是启动时读一次就够。** 三个理由：
+   *   · 答案会变——电脑端随时能改档位，而这一块的作用就是「标出现在是哪一档」；
+   *   · 一次读不到就会永远缺这一块——宿主刚重启、绑定会话还没装进 `ctx.agents`
+   *     那段时间里，服务端如实回 `no-session`（见 lib/permissions.js 的 listPresets）。
+   *     启动时那一次正好撞上，不重读就再也回不来，只有整页刷新能让它出现。
+   *     所以设置抽屉每次打开都重读（见上面「设置」那一段）；
+   *   · **`currentValue` 是每个会话各一份的**（宿主的 `permission/preset` 记在会话自己
+   *     的日志里，`service.current(session)` 读的是这个会话那份投影）。换了会话就不能
+   *     拿上一个会话那一档接着显示——那是在说一个假话。所以换会话也要重读
+   *     （见 applySnapshot 里换会话那一段）。
+   *
+   * 传参就是「按这个会话读」；不传是「还是这个会话，重读一次」。
+   *
+   * 读不到时**只在这块本来就空着的情况下才藏起来**：已经画出来的档位不许因为一次
+   * 读失败当场消失——那是把「此刻读不到」错当成「这台电脑没有这个能力」。
+   * 换了会话则相反：那一份高亮**必须**当场撤掉，因为它不是这个会话的值。
+   * 档位列表本身留着不动——那是宿主的本子，所有会话共用一份。
+   */
+  function loadPermissions(forSession) {
+    var session = forSession === undefined ? permFor : (forSession || null);
+    if (session !== permFor) {
+      permFor = session;
+      permArmed = '';   // 「再点一次」那半次确认也是上一个会话的，不跟着走
+      if (permOptions) {
+        permOptions.currentValue = '';
+        renderPerms();
+      }
+    }
     api('/mini/api/permissions').then(function (body) {
-      if (!body || !body.ok) { $('permBlock').hidden = true; return; }
+      // 请求飞在路上时用户又切走了：这一份属于上一个会话，扔掉。
+      if (session !== permFor) return;
+      if (!body || !body.ok) {
+        if (!permOptions) $('permBlock').hidden = true;
+        return;
+      }
       permOptions = body;
       renderPerms();
     }).catch(function () {
-      // 读不到就整块不显示。附加能力缺了，不该影响发指令。
-      permOptions = null;
-      $('permBlock').hidden = true;
+      if (session !== permFor) return;
+      // 附加能力缺了不该影响发指令：一个档位都没读到过时，整块不显示。
+      if (!permOptions) $('permBlock').hidden = true;
     });
   }
 
@@ -4104,7 +6477,7 @@
       });
   }
 
-  loadPermissions();
+  loadPermissions(state.boundSessionId);
 
   // 档位按钮的点击。
   //
@@ -4125,10 +6498,12 @@
   Array.prototype.forEach.call($('segMode').children, function (btn) {
     btn.addEventListener('click', function () {
       state.mode = btn.dataset.mode;
-        $('hintMode').textContent = state.mode === 'chat' ? '聊天：常规问答对话' : '单帧：只留最新一条回复';
+      $('hintMode').textContent = modeHint();
       localStorage.setItem('dshMiniMode', state.mode);
       syncSeg();
       render();
+      // 切到「完整」：订上并把已有的过程拉下来；切走：退订、停推。
+      syncTrajectorySubscription();
     });
   });
   Array.prototype.forEach.call($('segSound').children, function (btn) {
@@ -4172,6 +6547,21 @@
   }
   applyTheme();   // 补上首屏那次没做的一件事：把状态栏颜色对齐
 
+  // ---------------- 字体大小（小 / 标准 / 大） ----------------
+  function applyFontSize() {
+    var sizes = { small: '13px', normal: '15.5px', large: '18px' };
+    document.documentElement.style.setProperty('--font-base', sizes[state.fontSize] || sizes.normal);
+  }
+  Array.prototype.forEach.call($('segFont').children, function (btn) {
+    btn.addEventListener('click', function () {
+      state.fontSize = btn.dataset.font;
+      localStorage.setItem('dshMiniFont', state.fontSize);
+      applyFontSize();
+      syncSeg();
+    });
+  });
+  applyFontSize();  // 首屏应用
+
   function syncSeg() {
     Array.prototype.forEach.call($('segMode').children, function (b) {
       b.classList.toggle('active', b.dataset.mode === state.mode);
@@ -4182,6 +6572,9 @@
     Array.prototype.forEach.call($('segTheme').children, function (b) {
       b.classList.toggle('active', b.dataset.theme === state.theme);
     });
+    Array.prototype.forEach.call($('segFont').children, function (b) {
+      b.classList.toggle('active', b.dataset.font === state.fontSize);
+    });
   }
 
   // 会话切换挪到左侧导航栏了（原来这里是设置里的下拉框）。
@@ -4230,6 +6623,247 @@
     });
   }
 
+  /**
+   * 繁忙时的发送行为（2026-10-05 用户要求搬进手机设置）。
+   *
+   * 这是 PC「设置 → 通用」里那一条的同款：智能体跑着的时候，你发的话是
+   * 排队等这一轮跑完，还是当场插进去让它调整方向。**两端共用宿主那一份设置**，
+   * 所以这里改完，电脑上也是这个值——这是用户拍板要的（同一个开关，别两端各存一份）。
+   *
+   * **读不到就整条不画**：拿不到宿主设置时把那一行藏起来，不摆一个点了没用的开关。
+   * 这和插件页「宁可少画，不凭空多画」是同一条口径。
+   *
+   * 写的时候带上服务端给的 revision（乐观锁）：万一电脑上刚改过，这次写入会被挡下来，
+   * 而不是把对方那次改动悄悄盖掉——那种覆盖用户看不见，最难查。
+   */
+  var busyEnter = { current: 'queue', revision: null, ready: false };
+  function paintBusyEnter() {
+    Array.prototype.forEach.call($('segBusyEnter').children, function (b) {
+      b.classList.toggle('active', b.dataset.busy === busyEnter.current);
+    });
+  }
+  function loadBusyEnter() {
+    api('/mini/api/busy-enter').then(function (r) {
+      if (!r || !r.ok) {
+        // 这台电脑没提供这个设置（老版本 DSH、或设置文档里没这一项）。
+        // 藏起来就好，不用报错——那不是「出错」，是「这里本来就没有」。
+        $('rowBusyEnter').hidden = true;
+        return;
+      }
+      busyEnter.current = r.current === 'steer' ? 'steer' : 'queue';
+      busyEnter.revision = typeof r.revision === 'number' ? r.revision : null;
+      busyEnter.ready = true;
+      $('rowBusyEnter').hidden = false;
+      paintBusyEnter();
+    }).catch(function () {
+      $('rowBusyEnter').hidden = true;
+    });
+  }
+  $('segBusyEnter').addEventListener('click', function (e) {
+    var btn = e.target.closest ? e.target.closest('button[data-busy]') : null;
+    if (!btn || !busyEnter.ready) return;
+    var next = btn.dataset.busy;
+    if (next === busyEnter.current) return;
+    // 先画再发：这一下是用户自己按的，立刻有反馈；发失败了再画回去并说清。
+    var prev = busyEnter.current;
+    busyEnter.current = next;
+    paintBusyEnter();
+    api('/mini/api/busy-enter', {
+      method: 'POST',
+      body: JSON.stringify({ value: next }),
+    }).then(function (r) {
+      if (r && r.ok) {
+        toast(r.current === 'steer' ? '繁忙时改为插话发送' : '繁忙时改为排队发送');
+        busyEnter.revision = typeof r.revision === 'number' ? r.revision : busyEnter.revision;
+        return;
+      }
+      // 失败要画回去——留着那个没生效的选中态，用户会以为改成功了。
+      busyEnter.current = prev;
+      paintBusyEnter();
+      toast(r && r.reason === 'unavailable' ? '这台电脑改不了这一项' : '没能改成，再试一次');
+    }).catch(function () {
+      busyEnter.current = prev;
+      paintBusyEnter();
+      toast('没能改成，检查一下连接');
+    });
+  });
+
+  /**
+   * 「进阶设置（电脑端界面）」（2026-10-06 用户要求）。
+   *
+   * 手机上这张遥控页是**专门为手机做的**，所以电脑上那些插件贡献的设置页它进不去。
+   * 这一项是退路：**把电脑端的界面整个搬过来看**——同一份界面，不迁移、不逐个适配。
+   * 服务端怎么把这个界面转出来的，写在 lib/mirror.js 开头。
+   *
+   * **它是个权限开关，不是普通偏好。** 打开它 = 这个令牌的权限从「我们这张手机页
+   * 暴露的那点事」扩到整个电脑端设置面（模型配置、凭据页、插件装卸、会话记录……）。
+   * 所以三件事一个都不能省：
+   *   ① 默认关；
+   *   ② 后果写在提示里，而且要等**第二次点击**才真开（`armed`）——照「完全权限」
+   *      那一档的规矩，理由也一样（页内两步，不用 window.confirm：那种弹窗在微信
+   *      这类内嵌浏览器里会被直接屏蔽，屏蔽时万一返回真值就等于确认被跳过）；
+   *   ③ 关着的时候**入口那一行也不显示**——不是露一个点了没用的按钮。
+   *
+   * 读不到就整块不画：这台电脑没这个能力时（没拿到 DSH_WEB_URL），
+   * 藏起来就好，不摆一个假开关。
+   */
+  var mirror = { available: false, enabled: false, armed: false, ready: false };
+
+  function paintMirror() {
+    $('rowMirror').hidden = !mirror.available;
+    if (!mirror.available) {
+      $('rowMirrorOpen').hidden = true;
+      return;
+    }
+    Array.prototype.forEach.call($('segMirror').children, function (b) {
+      b.classList.toggle('active', (b.dataset.mirror === 'on') === mirror.enabled);
+    });
+    $('mirrorHint').textContent = mirror.enabled
+      ? '已打开。手机现在能进整个电脑设置面'
+      : mirror.armed
+        ? '打开的后果：手机将获得完整的电脑设置权限。再点一次「开」确认'
+        : '打开电脑上的 DSH 界面，改那些手机上没有的设置';
+    $('rowMirrorOpen').hidden = !mirror.enabled;
+  }
+
+  /**
+   * 镜像入口那个地址。
+   *
+   * **尾斜杠不能省**：那个界面外壳写着 `<base href="./">`，在 `/mini/mirror` 上它
+   * 解析成 `/mini/`，在 `/mini/mirror/` 上才是 `/mini/mirror/`——差这一个字符，
+   * 里面引用的脚本会全 404、界面白屏（真浏览器验出来的）。
+   *
+   * 地址里带 token：框里那些请求不一定都带得上 cookie（这个框是新开的文档），
+   * 入口那一下顺手把 cookie 写上，之后就靠 cookie 认人了。
+   */
+  function mirrorUrl() {
+    return '/mini/mirror/?token=' + encodeURIComponent(state.token || '');
+  }
+
+  /**
+   * 点「打开」：把那一整屏显示出来，并**在那一刻**才给框设地址（没点之前不加载）。
+   *
+   * 这一版为什么能成：**没有跳转、没有新标签、没有弹窗**——浏览器没有任何东西可以拦。
+   * 前两版都在赌「跳转」这个动作（详见页面里 `#mirrorView` 上面那段注释）。
+   */
+  function openMirror() {
+    if (!mirror.enabled) return;
+    // **先给一句提示，再显示那一屏。**
+    //
+    // 这一句不是装饰，是**诊断**（2026-10-06 用户三次报「点了没反应」之后加的）：
+    // 三种情况从此分得开——看到提示且界面出来＝成了；只看到提示＝显示那一步的问题；
+    // 连提示都没有＝点击压根没到按钮上。前三次就是分不开这三种，才一路猜错。
+    toast('正在打开电脑端界面…');
+    // **顺序要紧：先把这一层显示出来，再给框设地址。**
+    //
+    // 反过来的话，那个界面是**在 `display:none` 里开始加载的**——在不可见的上下文里
+    // 渲染出来的东西，要等用户点一下触发重绘才画全（真机上就是「图标旁边的文字
+    // 点一下才出来」）。2026-10-06 查出：**直接打开镜像没有这个毛病**，
+    // 差别就在这两行的先后。
+    $('mirrorView').hidden = false;
+    $('mirrorFrame').src = mirrorUrl();
+  }
+
+  function closeMirror() {
+    $('mirrorView').hidden = true;
+    // 把地址清掉：那一屏里是个完整应用（还在跑、还连着），关掉就该真停，
+    // 而不是留在后台继续占内存和连接。
+    $('mirrorFrame').src = 'about:blank';
+  }
+
+  // 按钮和**整行**都绑：那个按钮只有 54×40，手指容易点偏；整行点下去都算数。
+  $('btnMirrorOpen').addEventListener('click', openMirror);
+  $('rowMirrorOpen').addEventListener('click', function (e) {
+    // 点在按钮上时上面那个监听已经处理了，别处理两遍。
+    if (e.target === $('btnMirrorOpen')) return;
+    openMirror();
+  });
+  $('mirrorClose').addEventListener('click', closeMirror);
+
+  /**
+   * 框里那一页自己发的「返回手机页」。
+   *
+   * **为什么需要**：镜像那一屏里，框中的文档正常情况下是电脑端界面（它有自己的退出方式），
+   * 但**打不开的时候**它是我们自己发的一页提示（见 lib/server.js 的 sendMirrorUnavailable）
+   * ——那一页里除了浏览器自己的返回，没有别的出口，用户会卡在一个提示页上。
+   * 所以那一页的「返回」按钮往这里发一条消息，我们把这整屏收起来。
+   *
+   * 只认这一条字符串，且只认同源：这个监听**只做「收屏」这一件事**，别的消息一概不理。
+   */
+  window.addEventListener('message', function (e) {
+    if (e.origin === location.origin && e.data === 'mini-mirror-close') closeMirror();
+  });
+
+  function loadMirror() {
+    api('/mini/api/mirror').then(function (r) {
+      if (!r || !r.ok || !r.available) {
+        mirror.available = false;
+        paintMirror();
+        return;
+      }
+      mirror.available = true;
+      mirror.enabled = r.enabled === true;
+      mirror.ready = true;
+      paintMirror();
+    }).catch(function () {
+      mirror.available = false;
+      mirror.armed = false;
+      paintMirror();
+    });
+  }
+
+  function tapMirror(next) {
+    if (!mirror.ready) return;
+    if (next === 'off') {
+      // 关掉不需要确认：往「更安全」的方向走，不用拦。
+      mirror.armed = false;
+      if (!mirror.enabled) { paintMirror(); return; }
+      mirror.enabled = false;
+      paintMirror();
+      api('/mini/api/mirror', { method: 'POST', body: JSON.stringify({ enabled: false }) })
+        .then(function (r) {
+          if (r && r.ok) { toast('已关掉电脑端界面'); return; }
+          mirror.enabled = true;
+          paintMirror();
+          toast('没能关掉，再试一次');
+        })
+        .catch(function () {
+          mirror.enabled = true;
+          paintMirror();
+          toast('没能关掉，检查一下连接');
+        });
+      return;
+    }
+    // 开：第一次点只是「举起来」，把后果摆出来；再点一次才真开。
+    if (!mirror.enabled && !mirror.armed) {
+      mirror.armed = true;
+      paintMirror();
+      return;
+    }
+    if (mirror.enabled) return;
+    mirror.armed = false;
+    mirror.enabled = true;
+    paintMirror();
+    api('/mini/api/mirror', { method: 'POST', body: JSON.stringify({ enabled: true }) })
+      .then(function (r) {
+        if (r && r.ok) { toast('已打开，点下面的「打开」进去'); return; }
+        mirror.enabled = false;
+        paintMirror();
+        toast(r && r.reason === 'unavailable' ? '这台电脑没有这个能力' : '没能打开，再试一次');
+      })
+      .catch(function () {
+        mirror.enabled = false;
+        paintMirror();
+        toast('没能打开，检查一下连接');
+      });
+  }
+
+  $('segMirror').addEventListener('click', function (e) {
+    var btn = e.target.closest ? e.target.closest('button[data-mirror]') : null;
+    if (!btn) return;
+    tapMirror(btn.dataset.mirror);
+  });
+
   if (NOTIFY_OK) {
     // 先注册 service worker。**这一步不申请权限**——权限要用户主动点一下才给，
     // 页面一加载就弹窗会被浏览器直接拒掉，而且很讨厌。
@@ -4405,6 +7039,14 @@
   function watchBuild() {
     if (!state.token) return;
     api('/mini/api/version').then(function (r) {
+      // 设置页底部那行版本。**问到才显示**——问不到就整行不出现，
+      // 不拿「unknown」糊一行上去（那个字对用户没意义，还像页面坏了）。
+      // 产品名写全称（DeepSeek Harness）：缩写 DSH 只有我们自己人认。
+      // 大小写照 DSH 自己的界面串（实测 49 处全是这个写法）。
+      if (r && r.dshVersion && r.dshVersion !== 'unknown') {
+        var el = $('dshVersion');
+        if (el) { el.textContent = 'DeepSeek Harness ' + r.dshVersion; el.hidden = false; }
+      }
       if (!r || !r.build || r.build === BUILD) return;
       if (inputEl.value && inputEl.value.trim()) return;
       location.reload();
@@ -4430,6 +7072,30 @@
   // 整块抠出来求值，测试里的假 mainEl 没有 addEventListener，写在那边好几个测试当场报错。
   mainEl.addEventListener('scroll', onMainScroll);
 
+  // 「回到底部」浮标（2026-10-08）也挂在这一根滚动线上，但**另起一条监听**：
+  // onMainScroll 被页面测试整块抠出来跑（chatPager 那个替身只给了 state / replyEl /
+  // mainEl / timeLabel，没有 $），把浮标并进去会让那几个测试当场报 ReferenceError。
+  mainEl.addEventListener('scroll', paintToBottom);
+  // 首屏先定一次：刚进来是空页，按判据算「在底部」，浮标该是收着的。
+  paintToBottom();
+
+  // 点它：**瞬时**到底，不做平滑滚动。
+  //
+  // 两条理由，都是「跟现成的东西保持一致」而不是我挑的：
+  //   · 用户原话就是「瞬间」；
+  //   · 电脑端那颗也是瞬时的（ChatView 里 reading.followTail → viewport.scrollToBottom
+  //     → follow.toBottom(..., 'instant')）；
+  //   · 本页「按发送回底部」本来就是直接赋值（见 send 里那句
+  //     mainEl.scrollTop = mainEl.scrollHeight），同一件事用同一套动作，
+  //     用户不会看到「有时滑一下、有时直接跳」两种脾气。
+  //
+  // 赋值本身会发一次 scroll 事件，浮标自己就收了；这里再补一次是防「本来就在最底、
+  // 位置没变所以不发事件」那一种——补一下，状态就是确定的。
+  $('toBottom').addEventListener('click', function () {
+    mainEl.scrollTop = mainEl.scrollHeight;
+    paintToBottom();
+  });
+
   // ---------------- 启动 ----------------
   syncSeg();
   autoGrow();