dsh-desktop-statusbar 2.1.1 → 2.2.0

package/lib/client.js

@@ -50,6 +50,10 @@ window.__ModuleLoader__.load({
 		const PRICES_URL = "/dsh-desktop-statusbar/api/prices";
 		const HOLIDAYS_URL = "/dsh-desktop-statusbar/api/holidays";
 		const VERSION_URL = "/dsh-desktop-statusbar/api/version";
+		/** 一键更新：由本插件自己的 host 端执行（不依赖任何别的插件，见 self-update 说明）。 */
+		const SELF_UPDATE_URL = "/dsh-desktop-statusbar/api/self-update";
+		/** 客户端侧更新失败的上报端点（host 写进日志；宿主自己不知道浏览器里发生了什么）。 */
+		const UPDATE_FAILURE_URL = "/dsh-desktop-statusbar/api/update-failure";
 		/* 子智能体（Agent Teams 的队友）用量的聚合端点：队友是**独立会话**，它的消耗不在本会话
 		   的投影里，只能由 host 按 parentSession 找出来，「总计」「本轮」才真的把队友算进去。
 		   带 since（毫秒）= 只要那个时刻之后的用量，客户端拿它取「本轮」这一段。 */
@@ -58,15 +62,19 @@ window.__ModuleLoader__.load({
 		    所以这里取 1 秒 —— 用户要的「实时跳动」；也不必为它新增定时器。
 		    没有变化时后台只比对文件的 mtime/size（实测几毫秒），每秒重拉的开销可以忽略。 */
 		const SUBAGENT_REFRESH_MS = 1000;
-		/** 聚合请求自己的超时：接口卡住时不能把「总计」一直吊着，超时就退回只算本会话。 */
-		const SUBAGENT_TIMEOUT_MS = 8000;
+		/** 聚合请求自己的超时：接口卡住时不能把「总计」一直吊着，超时就退回只算本会话。
+		    上百个子智能体时 host 要把所有子会话日志解压聚合，实测 146 个活跃子会话首轮聚合
+		    可以明显超过 8s；超时被当成失败后客户端会沿用"上一次成功的小值"，界面就卡在偏小
+		    数字上、等某一次偶然成功再跳大。所以把超时放宽到 20s（配合 host 侧按文件缓存，
+		    热路径通常几百毫秒）。 */
+		const SUBAGENT_TIMEOUT_MS = 20000;
 		/**
 		 * 配置结构版本。
 		 * v6 起：`segments` 存全部段的有序列表（顺序对整份列表生效），`hidden` 存未勾选的段。
 		 */
 		const CONFIG_VERSION = 6;
 		/** 插件版本：显示在设置页底部，用来确认页面加载的是哪一版客户端代码。 */
-		const VERSION = "2.1.1";
+		const VERSION = "2.2.0";
 		/** 官方参考价的版本：官方调价时改这个数字，老价格库会自动并入新参考价。 */
 		const PRICE_VERSION = 2;
 		/** 项目主页：设置页那个「去 GitHub 点 star」按钮跳这里（与 package.json 的 repository 同址）。 */
@@ -650,6 +658,21 @@ window.__ModuleLoader__.load({
 				+ (bucket.output || 0) * tier.output) / 1e6;
 		}
 
+		/**
+		 * 按**指定档位**算一段用量的费用（不按时刻判断）。返回未舍入数值；没单价返回 null。
+		 * 专供 host 回传的 overflow 用 —— 那部分已经按档归好类（host 侧判的峰谷），
+		 * 这里不能再拿一个时刻去猜档位。没勾「峰谷计价」的条目两档同价，取 peak 即可。
+		 */
+		function costOfTier(bucket, model, peak) {
+			const price = priceOf(model);
+			if (price === null || bucket === undefined || bucket === null) return null;
+			const tier = price.tiered === false ? price.peak : (peak === true ? price.peak : price.offPeak);
+			return ((bucket.input || 0) * tier.input
+				+ (bucket.cacheRead || 0) * tier.cacheRead
+				+ (bucket.cacheWrite || 0) * tier.cacheWrite
+				+ (bucket.output || 0) * tier.output) / 1e6;
+		}
+
 		/**
 		 * 费用显示：一律两位小数，不满一分钱也进到 0.01（0.0075 → 0.01），不出现更长的小数位。
 		 * 累加用 costOf 的原始值，只在这里做一次舍入。
@@ -852,13 +875,232 @@ window.__ModuleLoader__.load({
 			return { value: value, hold: { sessionId: sessionId, turnKey: turnKey, value: value === null ? floor : value } };
 		}
 
-		/** 本会话的令牌三段 + 队友的三段：同一个数字直接相加，不新增行。 */
+		/**
+		 * 账本里「已结算调用指纹」集合的容量上限。
+		 *
+		 * 为什么需要上限：`calls` 最多 MAX_CALLS(4000) 条，但账本跨会话存活期间可能累计更多。
+		 * 超出后按**插入顺序**淘汰最老的（Map 保证插入序）—— 这不会造成重复计费：
+		 * 被淘汰的指纹对应的调用早已滑出 `calls` 窗口（host 那边按 4000 条滚动），不会再出现在
+		 * 后续快照里；万一真的又出现（极端情况下 host 重新回放），代价是这一条被再算一次，
+		 * 而不是像旧实现那样**每一拍**都重复加 overflow + 队友。取 2×MAX_CALLS 留足余量。
+		 */
+		const SEEN_LIMIT = 8000;
+
+		/**
+		 * 「总计」的**增量式记账**（用户拍板的口径）：
+		 *   **每条调用只算一次钱，算完就固化，之后永不重算**；
+		 *   没价的模型记**欠账 token**，后来补上价了只补算这部分。
+		 *
+		 * 为什么必须换掉旧实现（「锁定基准 + 差值修正」，已删除）：它每拍都用**当前价**把全部历史
+		 * 调用重算一遍，再用 `lockedCost` 把差额盖回去 —— 有三个必错的地方：
+		 *   ① 锁的是"整笔显示金额"（含 overflow 与队友），而差值修正只重算 calls
+		 *      ⇒ 那两块每一拍都被重复加一次（切会话时能把上个会话的队友花费永久算进来）；
+		 *   ② 首帧算不出价时 `lockedCost` 被锁成 0 且永不重建 ⇒ 补价后总计永久显示 ¥0.00；
+		 *   ③ 用**数组下标**（`lockedCount`）切分新旧，而 calls 满 MAX_CALLS 后会从队首丢弃
+		 *      ⇒ 下标整体错位，扣错钱。
+		 *
+		 * 现在的做法：账本里记一份「已经结算过的调用指纹」集合，每拍只结算**没见过的**调用。
+		 * 为什么用指纹而不是时间游标：`calls` **不保证按 at 升序**（实测 verify-pricing 里就是
+		 * [22:00, 10:00, 10:00]），也不是只追加（MAX_CALLS 会从队首丢弃）—— 任何"只往后推游标"
+		 * 的做法都会漏算乱序到达的调用。指纹对乱序、滚动窗口、同毫秒并行调用全部免疫。
+		 *
+		 * `hold`（调用方 ref 里那个对象，**就地更新**）的形状：
+		 *   · `sessionId`      —— 这份账属于哪个会话；变了就把整份状态清空重建
+		 *   · `seen`           —— 已结算调用的指纹集合（Map: 指纹 → true），见下面 ① 的说明
+		 *   · `cost`           —— 已结算金额（累计，只增）
+		 *   · `tokens`         —— 已结算的 token 三段（累计，只增）
+		 *   · `priced`         —— 是否**成功定价过至少一条**（用来区分「真的是 0 元」与「一条都算不出价」）
+		 *   · `subCostSettled` —— 已计入的队友金额（算增量用；队友是快照，没有逐条时间戳）
+		 *   · `debts`          —— 欠账，**Map**：`模型名 → { peak: 桶|null, offPeak: 桶|null }`
+		 *     （用 Map 而不是普通对象：模型名是上游给的任意字符串，`__proto__` 这类键
+		 *      在普通对象上会变成设原型、静默丢失 —— 详见换会话清空处的说明）
+		 *
+		 * 返回 `{ cost, tokens, hold }`；`cost` 为 null 表示"一条都算不出价"（界面给横杠）。
+		 *
+		 * 输入就是**一个素材包**（calls / overflow / subCost / tokens / 价格库等），只有这一种形态。
+		 */
+		function applyTotalFloor(hold, sessionId, input) {
+			const prev = hold !== null && hold !== undefined && typeof hold === "object" ? hold : null;
+			const sameSession = prev !== null && prev.sessionId === sessionId;
+			const snap = input !== null && input !== undefined && typeof input === "object" ? input : {};
+			/* 账本就地更新：调用方持有的是 useRef 里同一个对象，跨渲染靠它留住累计值 */
+			const box = prev !== null ? prev : {
+				sessionId: null, seen: new Map(), cost: 0, tokens: null,
+				priced: false, subCostSettled: 0, debts: new Map()
+			};
+			/* 换会话（含首次）：整份状态清空。清空后 seen 为空，
+			   下面那段"只结算没见过的调用"自然退化成"结算现有全部调用"，不必另写一套初始化。 */
+			if (sameSession !== true) {
+				box.sessionId = sessionId;
+				box.seen = new Map();
+				box.cost = 0;
+				box.tokens = null;
+				box.priced = false;
+				box.subCostSettled = 0;
+				/* 欠账必须用 **Map** 而不是普通对象：模型名是上游给的任意字符串，
+				   用 `obj[model] = slot` 时若 model 恰好是 `__proto__`，那是**设置原型**、
+				   不是加键 —— `Object.keys` 遍历不到它，补价时永远结算不回来，
+				   总计会永久少算这笔钱（实测确认）。`constructor` / `toString` 这类
+				   虽然"碰巧能跑"（读到原型函数、把函数当字典用），也不该依赖这种巧合。
+				   Map 没有原型链，任意字符串键都安全 —— 与同文件 seen 的写法一致。 */
+				box.debts = new Map();
+			}
+			/* 兼容老账本对象（升级前 ref 里可能还留着 debts: {} 的形态）：
+			   就地换成 Map，把已有条目搬过去 —— ref 跨热更新存活时不会丢欠账。 */
+			if (typeof Map !== "undefined" && (box.debts instanceof Map) !== true) {
+				const migrated = new Map();
+				const oldDebts = box.debts;
+				if (oldDebts !== null && oldDebts !== undefined && typeof oldDebts === "object") {
+					Object.keys(oldDebts).forEach((model) => {
+						const slot = oldDebts[model];
+						if (slot !== null && slot !== undefined && typeof slot === "object") migrated.set(model, slot);
+					});
+				}
+				box.debts = migrated;
+			}
+			/* 把一段用量按"它发生时的档位"记进欠账，等有价了再结算 */
+			const owe = (model, peak, bucket) => {
+				if (bucket === null || bucket === undefined) return;
+				const one = box.debts.get(model);
+				const slot = one === undefined ? { peak: null, offPeak: null } : one;
+				const key = peak === true ? "peak" : "offPeak";
+				const had = slot[key];
+				slot[key] = had === null || had === undefined
+					? { input: bucket.input || 0, cacheRead: bucket.cacheRead || 0, cacheWrite: bucket.cacheWrite || 0, output: bucket.output || 0 }
+					: {
+						input: had.input + (bucket.input || 0),
+						cacheRead: had.cacheRead + (bucket.cacheRead || 0),
+						cacheWrite: had.cacheWrite + (bucket.cacheWrite || 0),
+						output: had.output + (bucket.output || 0)
+					};
+				box.debts.set(model, slot);
+			};
+			const shown = (amount, model) => toDisplayCurrency(amount, snap.models, model, snap.displayCurrency, snap.defaultCurrency);
+
+			/* ---------- ① 逐条结算「还没结算过」的调用 ---------- */
+			/* 判据是**调用指纹 + 出现次数**，不用数组下标、也不用时间游标：
+			   · 不用下标：calls 是滚动窗口，队首会随 MAX_CALLS 丢弃，下标会整体错位（旧实现在这里扣错钱）；
+			   · 也不用时间游标：calls **不保证按 at 升序**（实测有 [22:00, 10:00, 10:00] 这种），
+			     任何"只往后推游标"的写法都会把乱序到达的早期调用永久漏掉；
+			   · 用**计数**而不是"见过/没见过"：同一毫秒可能有两条完全相同的并行调用
+			     （at、model、token 数都一样），只记布尔会把第二条永久当成重复。
+			     每拍数一遍每个指纹在 calls 里出现几次，与账本里已结算次数比，差额才补算。
+			   指纹只增不减：调用滚出 calls 窗口后计数仍留着，同指纹再来时按已结算处理
+			   （宁可极低概率地少算一条，也绝不重复计费）。
+			   契约保证 usageCall.at 必有（host 侧 schema），缺 at 的坏数据跳过。 */
+			const calls = Array.isArray(snap.calls) ? snap.calls : [];
+			/* 第一遍：数每个指纹在这一拍的 calls 里出现几次 */
+			const counts = new Map();
+			const firsts = new Map();
+			for (let i = 0; i < calls.length; i += 1) {
+				const call = calls[i];
+				if (call === null || call === undefined || typeof call !== "object") continue;
+				const at = typeof call.at === "number" && Number.isFinite(call.at) ? call.at : null;
+				if (at === null) continue;
+				const model = typeof call.model === "string" ? call.model : snap.fallbackModel;
+				const print = at + "|" + String(model) + "|" + (call.input || 0) + "|"
+					+ (call.cacheRead || 0) + "|" + (call.cacheWrite || 0) + "|" + (call.output || 0);
+				counts.set(print, (counts.has(print) === true ? counts.get(print) : 0) + 1);
+				if (firsts.has(print) !== true) firsts.set(print, call);
+			}
+			/* 第二遍：与账本里「已结算次数」比，只补算差额部分 */
+			counts.forEach((nowCount, print) => {
+				const done = box.seen.has(print) === true ? box.seen.get(print) : 0;
+				if (nowCount <= done) return;
+				const call = firsts.get(print);
+				const model = typeof call.model === "string" ? call.model : snap.fallbackModel;
+				const at = call.at;
+				/* 每条单价都一样，差额直接按条数乘；没价的按条数累进欠账 */
+				const one = costOf(call, model, at);
+				if (one === null) {
+					for (let n = done; n < nowCount; n += 1) owe(model, isPeakTime(at), call);
+				} else {
+					box.cost += shown(one, model) * (nowCount - done);
+					box.priced = true;
+				}
+				box.seen.set(print, nowCount);
+				/* 超出上限就淘汰最老的（Map 插入序 = 结算顺序）：见 SEEN_LIMIT 的说明 */
+				while (box.seen.size > SEEN_LIMIT) {
+					const oldest = box.seen.keys().next();
+					if (oldest.done === true) break;
+					box.seen.delete(oldest.value);
+				}
+			});
+			/* ---------- ② overflow：只加一次 ---------- */
+			/* host 把被 MAX_CALLS 截掉的最老调用按「模型 + 峰谷档」累计好了。它没有逐条时间戳，
+			   只能在**首次建立账本**那一拍计入一次 —— 之后每拍再加就是旧实现那个重复计费的错。 */
+			if (sameSession !== true && snap.overflow !== null && snap.overflow !== undefined
+				&& typeof snap.overflow === "object") {
+				Object.keys(snap.overflow).forEach((model) => {
+					const byTier = snap.overflow[model];
+					if (byTier === null || byTier === undefined) return;
+					const peak = costOfTier(byTier.peak, model, true);
+					const offPeak = costOfTier(byTier.offPeak, model, false);
+					if (peak === null) owe(model, true, byTier.peak); else { box.cost += shown(peak, model); box.priced = true; }
+					if (offPeak === null) owe(model, false, byTier.offPeak); else { box.cost += shown(offPeak, model); box.priced = true; }
+				});
+			}
+
+			/* ---------- ③ 补算欠账：现在能算价的按**当前价**结算，仍没价的留着 ---------- */
+			box.debts.forEach((slot, model) => {
+				if (slot === null || slot === undefined) { box.debts.delete(model); return; }
+				let done = true;
+				["peak", "offPeak"].forEach((key) => {
+					const bucket = slot[key];
+					if (bucket === null || bucket === undefined) return;
+					const one = costOfTier(bucket, model, key === "peak");
+					if (one === null) { done = false; return; }
+					box.cost += shown(one, model);
+					box.priced = true;
+					slot[key] = null;
+				});
+				if (done === true && slot.peak === null && slot.offPeak === null) box.debts.delete(model);
+			});
+
+			/* ---------- ④ 队友（子智能体）：只能算增量 ---------- */
+			/* 它是**快照**不是逐条调用，没有时间戳，没法按时间切分 —— 这是数据形状决定的限制。
+			   用「当前队友金额 − 已计入的队友金额」算增量：请求偶发失败时当前值会掉回 0，
+			   取 max(0, …) 就自动不回退（防闪照旧，且不会把队友的钱重复加）。 */
+			const subCost = typeof snap.subCost === "number" && Number.isFinite(snap.subCost) ? snap.subCost : 0;
+			const subSettled = typeof box.subCostSettled === "number" && Number.isFinite(box.subCostSettled)
+				? box.subCostSettled
+				: 0;
+			if (subCost > subSettled) {
+				box.cost += subCost - subSettled;
+				box.subCostSettled = subCost;
+				box.priced = true;
+			}
+
+			/* ---------- ⑤ token 三段：本会话 + 队友，只增不减 ---------- */
+			const tokens = snap.tokens;
+			if (tokens !== null && tokens !== undefined && typeof tokens === "object") {
+				const had = box.tokens;
+				box.tokens = had === null || had === undefined
+					? { cached: tokens.cached || 0, missInput: tokens.missInput || 0, output: tokens.output || 0 }
+					: {
+						cached: Math.max(had.cached, tokens.cached || 0),
+						missInput: Math.max(had.missInput, tokens.missInput || 0),
+						output: Math.max(had.output, tokens.output || 0)
+					};
+			}
+			return {
+				/* 欠账部分**不计入显示**：它还没有价，算进去只能是错的；补价后会自动结算进来 */
+				cost: box.priced === true ? box.cost : null,
+				tokens: box.tokens,
+				hold: box
+			};
+		}
+
+		/** 本会话的令牌三段 + 队友的三段：同一个数字直接相加，不新增行。
+		 *  两段都容忍 null / undefined（当 0）：「总计用量」要把官方投影 + 压缩摘要 + 队友
+		 *  三段加起来，其中任一段在宿主老版本 / 没数据时都可能是 null。 */
 		function mergeTokenParts(parts, sub) {
 			const base = parts === null || parts === undefined ? { cached: 0, missInput: 0, output: 0 } : parts;
+			const extra = sub === null || sub === undefined ? { cached: 0, missInput: 0, output: 0 } : sub;
 			return {
-				cached: base.cached + sub.cached,
-				missInput: base.missInput + sub.missInput,
-				output: base.output + sub.output
+				cached: (base.cached || 0) + (extra.cached || 0),
+				missInput: (base.missInput || 0) + (extra.missInput || 0),
+				output: (base.output || 0) + (extra.output || 0)
 			};
 		}
 
@@ -984,6 +1226,11 @@ window.__ModuleLoader__.load({
 			updateTo: "更新 {version} 版本",
 			updateRunning: "正在更新中",
 			updateFailed: "更新失败",
+			updateDone: "更新成功，重启 DSH 后生效",
+			/* 开发模式：连点版本号 5 次进入。不做成可见控件 —— 它面向作者调试，
+			   普通用户装了插件也不该看到一个「预览」勾选框。进入后标题右侧挂一枚胶囊。 */
+			devModeBadge: "开发模式",
+			devModeHint: "开发模式：点更新按钮只演示状态，不会真的安装",
 			sectionTitle: "状态栏设置",
 			intro: "接管对话区底部的统计行。勾选要显示的字段、拖动调整顺序或配置模型费用单价。",
 			segContext: "上下文占用",
@@ -1027,10 +1274,14 @@ window.__ModuleLoader__.load({
 			tipCountsSkills: "技能注入",
 			tipCountsCompactAt: "上下文压缩",
 			tipCountsToolCalls: "工具调用",
+			/* 手动调用 / 手动压缩那行星号的悬停说明：星号自己 aria-hidden，含义靠这句文字给 */
+			tipManual: "手动触发",
 			/* 压缩明细逐条列时的两段：序号用中文序数（第一次 / 第二次），落点用「第X轮Y步」 */
 			tipCompactItem: "第{index}次压缩",
 			tipCompactWhere: "第{turn}轮{step}步",
 			tipCompactTurnOnly: "第{turn}轮",
+			/* 手动 / 轮间压缩没有 turn，用「发生在第几轮之后」给落点（afterTurn） */
+			tipCompactAfter: "第{turn}轮后",
 			contextAria: "上下文已用 {percent}",
 			contextSystem: "系统提示词",
 			contextTools: "工具定义",
@@ -1045,6 +1296,15 @@ window.__ModuleLoader__.load({
 			f_lastCost: "本轮 {symbol}{cost}",
 			f_balance: "余额 {symbol}{amount}",
 			f_balanceSubCent: "余额 <{symbol}0.01",
+			/* WorkBuddy 积分口径的套餐气泡（只在宿主给了非空 rewards 时出现）。
+			   标题用中性词「积分套餐」：列表里第一条是月度基础包，不都是「平台奖励」。 */
+			tipCreditsTitle: "积分套餐",
+			tipCreditsMonthly: "（每月刷新）",
+			tipCreditsRefresh: " · {date} 刷新",
+			tipCreditsExpire: " · {date} 到期",
+			tipCreditsRefreshLatest: " · {date} 刷新(最近)",
+			tipCreditsExpireLatest: " · {date} 到期(最近)",
+			tipCreditsUsed: "已用 {used} / {total}",
 			dragHint: "拖动排序",
 			secSegments: "统计字段",
 			secSegmentsHint: "勾选显示；按住拖动调整顺序。",
@@ -1061,7 +1321,7 @@ window.__ModuleLoader__.load({
 			segTpsHint: "token 的每秒平均输出速度。",
 			segSessionTimeHint: "当前会话的总计运行时间。",
 			segCostHint: "当前会话估算消耗费用，包含主模型、子代理和辅助调用。",
-			segLastCostHint: "当前或最近一轮交流的估算消耗费用。",
+			segLastCostHint: "当前或最近一轮交流的估算消耗费用，包含主模型、子代理和辅助调用。",
 			segBalanceHint: "账户余额，每分钟刷新。",
 			priceCurrent: "当前会话使用：",
 			modelUnknown: "未识别",
@@ -1095,6 +1355,9 @@ window.__ModuleLoader__.load({
 			updateTo: "Update to {version}",
 			updateRunning: "Updating",
 			updateFailed: "Update failed",
+			updateDone: "Update succeeded — restart DSH to apply",
+			devModeBadge: "Dev mode",
+			devModeHint: "Dev mode: the update button only simulates states — nothing is installed",
 			sectionTitle: "Status Bar Settings",
 			intro: "Replaces the stats line under the message input. Select the fields to show, drag to reorder, or set model prices.",
 			segContext: "Context usage",
@@ -1138,10 +1401,13 @@ window.__ModuleLoader__.load({
 			tipCountsSkills: "Skills injected",
 			tipCountsCompactAt: "Context compactions",
 			tipCountsToolCalls: "Tool calls",
+			/* 星号的悬停说明（见中文那份的同名键） */
+			tipManual: "Manually invoked",
 			/* 压缩明细逐条列时的两段：英文直接用阿拉伯数字，落点「Turn X·Step Y」 */
 			tipCompactItem: "Compaction {index}",
 			tipCompactWhere: "Turn {turn}·Step {step}",
 			tipCompactTurnOnly: "Turn {turn}",
+			tipCompactAfter: "After turn {turn}",
 			contextAria: "{percent} of context used",
 			contextSystem: "System prompt",
 			contextTools: "Tool definitions",
@@ -1155,6 +1421,14 @@ window.__ModuleLoader__.load({
 			f_lastCost: "This turn {symbol}{cost}",
 			f_balance: "Balance {symbol}{amount}",
 			f_balanceSubCent: "Balance <{symbol}0.01",
+			/* 积分口径的套餐气泡（见中文那份的同名键） */
+			tipCreditsTitle: "Points packages",
+			tipCreditsMonthly: " (monthly)",
+			tipCreditsRefresh: " · refreshes {date}",
+			tipCreditsExpire: " · expires {date}",
+			tipCreditsRefreshLatest: " · refreshes {date} (nearest)",
+			tipCreditsExpireLatest: " · expires {date} (nearest)",
+			tipCreditsUsed: "Used {used} / {total}",
 			dragHint: "Drag to reorder",
 			secSegments: "Stats fields",
 			secSegmentsHint: "Select to show; drag to reorder.",
@@ -1171,7 +1445,7 @@ window.__ModuleLoader__.load({
 			segTpsHint: "Average output rate, in tokens per second.",
 			segSessionTimeHint: "Total run time of the current session.",
 			segCostHint: "Estimated session cost, including the main model, subagents, and helper calls.",
-			segLastCostHint: "Estimated cost of the current or most recent turn.",
+			segLastCostHint: "Estimated cost of the current or most recent turn, including the main model, subagents, and helper calls.",
 			segBalanceHint: "Account balance, refreshed every minute.",
 			priceCurrent: "Current session:",
 			modelUnknown: "unknown",
@@ -1701,14 +1975,21 @@ window.__ModuleLoader__.load({
 			};
 		}
 
-		/** 官方那种分段小条（分项面板里那条）。 */
+		/** 官方那种分段小条（分项面板里那条）。子代理「命中」那段挂 dsb-bar-sub（75% 浅灰）。 */
 		function meterBar(meter) {
 			return h("span", { className: "dsb-bar", style: barTrackStyle(meter.compact) },
-				meter.segments.map((segment, index) => h("span", {
-					className: "dsb-bar-seg",
-					key: "__bar" + index,
-					style: { width: segment.width + "%", background: segment.color }
-				})));
+				meter.segments.map((segment, index) => {
+					const style = { width: segment.width + "%" };
+					/* 浅色子段（子代理命中）交给 CSS 的 75% 灰：这里不写颜色，否则行内样式会盖掉 class 的背景。
+					   必须用 background-color 长写：`background` 简写会把 background-clip 重置成 border-box，
+					   段内那条「1px 透明右边框」的间隔就不生效了（见 CSS .dsb-bar-seg:not(:last-child)）。 */
+					if (segment.light !== true) style.backgroundColor = segment.color;
+					return h("span", {
+						className: segment.light === true ? "dsb-bar-seg dsb-bar-sub" : "dsb-bar-seg",
+						key: "__bar" + index,
+						style: style
+					});
+				}));
 		}
 
 		/**
@@ -1814,19 +2095,53 @@ window.__ModuleLoader__.load({
 			};
 		}
 
-		function tokenPanelView(cached, missInput, output, t) {
+		/**
+		 * 令牌面板数据：第一行是总用量，第二行三段占比（顶满 100%），下面三行明细。
+		 * 数字一律千分位精确值，不带单位（面板标题已经说明是 token 用量）。
+		 * `sub` 是子代理（队友）的三段；有子代理用量时，条上拆成 6 小段：
+		 * **子代理块在左、主会话块在右**：[子·命中][子·未命中][子·输出][主·命中][主·未命中][主·输出]。
+		 * 子·命中用 75% 浅灰（与活跃总览高峰段同款），子·未命中 / 子·输出用正常主色；
+		 * **数字与行仍是合并口径**（主 + 子），不新增行。
+		 */
+		function tokenPanelView(cached, missInput, output, t, sub) {
 			const total = cached + missInput + output;
 			if (total <= 0) return null;
+			const subParts = sub === null || sub === undefined
+				? { cached: 0, missInput: 0, output: 0 }
+				: {
+					cached: Math.max(0, Number(sub.cached) || 0),
+					missInput: Math.max(0, Number(sub.missInput) || 0),
+					output: Math.max(0, Number(sub.output) || 0)
+				};
 			const parts = [
-				{ label: t("f_tokensHit"), color: "var(--dsw-static-neutral-bluish-400)", value: cached },
-				{ label: t("f_tokensMiss"), color: "#a78bfa", value: missInput },
-				{ label: t("f_tokensOut"), color: "var(--dsw-static-blue-450)", value: output }
+				/* lightSub：只有「命中」那一档的子代理段用 75% 浅灰，其余子段用主色 */
+				{ label: t("f_tokensHit"), color: "var(--dsw-static-neutral-bluish-400)", value: cached, sub: subParts.cached, lightSub: true },
+				{ label: t("f_tokensMiss"), color: "#a78bfa", value: missInput, sub: subParts.missInput },
+				{ label: t("f_tokensOut"), color: "var(--dsw-static-blue-450)", value: output, sub: subParts.output }
 			];
+			/* 段顺序（用户拍板）：**子代理块在左、主会话块在右**：
+			   子·命中 → 子·未命中 → 子·输出 → 主·命中 → 主·未命中 → 主·输出。
+			   主段 = 合并值 - 子值，子段 = 子值；哪边是 0 就不画那一段。
+			   宽度仍是占总量的比例，所以 6 小段合起来仍顶满 100%。
+			   子代理命中段标 light（用活跃总览高峰段同款 75% 灰，见 CSS .dsb-bar-sub）；
+			   子代理未命中 / 输出不浅化，用正常主色。 */
+			const segments = [];
+			parts.forEach((one) => {
+				const subValue = Math.min(one.value, one.sub);
+				if (subValue > 0) {
+					const segment = { color: one.color, width: (subValue / total) * 100, sub: true };
+					if (one.lightSub === true) segment.light = true;
+					segments.push(segment);
+				}
+			});
+			parts.forEach((one) => {
+				const subValue = Math.min(one.value, one.sub);
+				const mainValue = Math.max(0, one.value - subValue);
+				if (mainValue > 0) segments.push({ color: one.color, width: (mainValue / total) * 100 });
+			});
 			return {
 				totalText: formatTokensExact(total),
-				segments: parts
-					.map((one) => ({ color: one.color, width: (one.value / total) * 100 }))
-					.filter((one) => one.width > 0),
+				segments: segments,
 				rows: parts.map((one) => ({
 					label: one.label,
 					color: one.color,
@@ -1852,6 +2167,102 @@ window.__ModuleLoader__.load({
 			]);
 		}
 
+		/**
+		 * 积分套餐面板（WorkBuddy）：标题 + 总积分，下面每个套餐一个块：
+		 * 第一行 = 包名/备注 + 「已用 X / 总数」；第二行 = 一条进度。
+		 * 进度方向：**已用从左侧起**（剩余在右）—— 两段实现：前段灰（已用宽 = percent，
+		 * 颜色同「充值余额」图例 BALANCE_COLORS.topUp）、后段透明（剩余宽 = 100 - percent，露出轨道底色）。
+		 * `.dsb-bar` 始终渲染：percent=0 时只有空轨道、没有填充段（与已用套餐视觉一致）。
+		 * **聚合行（×N）可点**：点进去是子视图 —— 内容与主面板同一套套餐块（一行 + 一条进度），
+		 * 只是每个块代表该组合并前的一个原始包（自己的名字/日期备注、真实已用/总数），竖排单列可滚动；
+		 * 标题只显示聚合的显示名（不带 ×N），右侧不再重复总积分。点标题返回。
+		 * 颜色与轨道高度/圆角沿用令牌/配额条那套 `.dsb-bar`；列表容器带半屏高度上限可滚动
+		 * （滚动条隐藏，见 CSS），14 条套餐也不会把气泡撑出屏幕。没有新造颜色或新字号。
+		 */
+		function creditsPanel(panel, title, pos, ref, sub) {
+			const openedAt = sub === undefined || sub === null || typeof sub.id !== "number" ? null : sub.id;
+			const opened = openedAt === null || panel.rewards[openedAt] === undefined ? null : panel.rewards[openedAt];
+			/* 一个套餐块 = 一行（名字/备注 + 已用/总数）+ 它自己的一条进度。
+			   主列表与下钻子视图共用这一份，别各写一遍。 */
+			const barOf = (one, key) => {
+				const used = Math.max(0, Math.min(100, one.percent));
+				/* 已用在左（灰段）、剩余在右（透明段）；100% 只画整条灰；0% 只有空轨道 */
+				const segments = [];
+				if (used >= 100) {
+					segments.push(h("span", {
+						className: "dsb-bar-seg", key: key + "a",
+						style: { width: "100%", backgroundColor: BALANCE_COLORS.topUp }
+					}));
+				} else if (used > 0) {
+					segments.push(h("span", {
+						className: "dsb-bar-seg", key: key + "a",
+						style: { width: used + "%", backgroundColor: BALANCE_COLORS.topUp }
+					}));
+					segments.push(h("span", {
+						className: "dsb-bar-seg", key: key + "b",
+						style: { width: (100 - used) + "%", backgroundColor: "transparent" }
+					}));
+				}
+				return h("span", { className: "dsb-bar", key: key + "bar" }, segments);
+			};
+			const creditBlock = (one, index, clickable) => {
+				const base = "__cr" + index;
+				const rowNode = h("span", {
+					/* 聚合行用独立修饰类：只给 cursor:pointer，不要 .dsb-meter-row-click 的悬停灰底胶囊
+					   （那是「会话数据」那类行才有的反馈，套餐行只要可点感） */
+					className: clickable ? "dsb-meter-row dsb-meter-row-plain" : "dsb-meter-row",
+					key: base + "r",
+					onClick: clickable
+						? (event) => {
+							stopTipClick(event);
+							if (sub.open !== undefined) sub.open(index);
+						}
+						: undefined
+				}, [
+					h("span", { className: "dsb-meter-name", key: base + "n" }, one.label),
+					h("span", { className: "dsb-meter-value", key: base + "v" }, one.valueText)
+				]);
+				return h("span", { className: "dsb-credit", key: base }, [rowNode, barOf(one, base)]);
+			};
+			let body = null;
+			if (opened === null) {
+				body = h("span", { className: "dsb-meter-rows dsb-meter-rows-fit dsb-credits-list", key: "__clist" },
+					panel.rewards.map((one, index) => creditBlock(one, index, one.count > 1)));
+			} else {
+				/* 子视图：每个原始包一块（与主面板同样的行 + 进度条），竖排单列、可滚动 */
+				body = h("span", { className: "dsb-meter-rows dsb-meter-rows-fit dsb-credits-list", key: "__clist" },
+					opened.items.map((one, index) => creditBlock(one, index, false)));
+			}
+			const headline = opened === null
+				? h("span", { className: "dsb-meter-headline", key: "__ctl" }, title)
+				: h("span", {
+					/* 点标题回上一层：与 rowsPanel 子视图同一套交互。
+					   标题显示聚合行的名字与数量（如「运营裂变包×12」）；右侧是**该组剩余积分**
+					   （total - used，动态）。 */
+					className: "dsb-meter-headline dsb-meter-back",
+					key: "__ctl",
+					onClick: (event) => {
+						stopTipClick(event);
+						if (sub.back !== undefined) sub.back();
+					}
+				}, opened.count > 1 ? opened.name + "×" + opened.count : opened.name);
+			return h("span", {
+				className: "dsb-tip dsb-meter",
+				key: "__tip", ref: ref, style: panelStyle(pos), onClick: stopTipClick, onMouseDown: stopTipClick
+			}, [
+				h("span", { className: "dsb-meter-head", key: "__ch" }, [
+					headline,
+					/* 主面板右侧是全局总积分；下钻子视图换成该组剩余积分（不显示组总容量） */
+					h("span", { className: "dsb-meter-figures", key: "__ctt" },
+						opened === null ? panel.totalText : opened.remainingText)
+				]),
+				/* 与其它 rows 气泡一致：标题下一条横杠（复用 .dsb-meter-divider，不新增 CSS）。
+				   只有 credits 面板加；tokenPanel 那种自带分段条的不加。 */
+				h("span", { className: "dsb-meter-divider", key: "__cdiv" }),
+				body
+			]);
+		}
+
 		/* ------------------------------------------------------ 活跃总览柱状图 */
 		/** 柱状图用的三色：与令牌面板的三段同色（命中缓存=灰 / 未命中=紫 / 输出=蓝）。 */
 		const WEEK_COLORS = {
@@ -1875,7 +2286,16 @@ window.__ModuleLoader__.load({
 			tool: "var(--dsw-static-blue-450)"
 		};
 
-		/** 本地日期键，用来认「今天」那根柱子。 */
+		/**
+		 * 日期键（YYYY-MM-DD），用来认「今天」那根柱子。
+		 *
+		 * 按**装机者所在时区**取，与 host 的 localDateKey 同一口径：使用者看的是自己
+		 * 日历上的今天/昨天。曾经固定用北京时间，UTC+8 装机时看不出差别，非 UTC+8 的
+		 * 机器上整块活跃总览会错一天（「今天」高亮成昨天、未来/过去的灰阶也偏）。
+		 *
+		 * 注意与 isPeakTime 区分：**峰谷计价**仍按北京时间，那是 DeepSeek 的官方规则；
+		 * 只有「日期归属」跟着装机者时区走。
+		 */
 		function dateKeyOf(ms) {
 			const d = new Date(ms === undefined || ms === null ? Date.now() : ms);
 			const pad = (n) => (n < 10 ? "0" + n : String(n));
@@ -1923,6 +2343,73 @@ window.__ModuleLoader__.load({
 			]);
 		}
 
+		/** 悬停文字与「工具调用」标题之间至少留 1ch（11px 字号下约 7px）。 */
+		const HOVER_PLAIN_TITLE_GAP = 7;
+
+		/**
+		 * 工具彩条悬停文字的**水平夹取范围**（用户拍板）：
+		 *   左 = 「工具调用」标题四个字的右边界 **再往右 1ch**（至少离标题 1ch，不能压到标题上）；
+		 *   右 = **色条本身**（`.dsb-bar`）的右边界，不能超出色条；再与视口右缘取小。
+		 * 色条拿不到时退回气泡右边界；两者都没有就只用视口。
+		 * 纯函数，便于单测；返回 { min, max }，max 是文字右边界能到的最远位置。
+		 */
+		function plainBoundsOf(headBox, barBox, viewportWidth) {
+			const viewport = typeof viewportWidth === "number" && viewportWidth > 0 ? viewportWidth : 0;
+			const barRight = barBox !== null && barBox !== undefined && typeof barBox.right === "number"
+				? barBox.right
+				: null;
+			const titleRight = headBox !== null && headBox !== undefined && typeof headBox.right === "number"
+				? headBox.right
+				: null;
+			let min = 8;
+			if (titleRight !== null) min = Math.max(8, titleRight + HOVER_PLAIN_TITLE_GAP);
+			let max = barRight !== null ? barRight : (viewport > 0 ? viewport - 8 : null);
+			if (max === null) return null;
+			if (viewport > 0) max = Math.min(max, viewport - 8);
+			if (max < min) return null;
+			return { min: min, max: max };
+		}
+
+		/**
+		 * 把文字提示的 left 夹进 plainBoundsOf 给的范围（夹不下就贴左边界）；没有范围只夹视口。
+		 */
+		function clampPlainLeft(centered, width, bounds, viewportWidth) {
+			const viewport = typeof viewportWidth === "number" && viewportWidth > 0 ? viewportWidth : 0;
+			const viewMin = 8;
+			const viewMax = viewport > 0 ? viewport - width - 8 : null;
+			let min = viewMin;
+			let max = viewMax;
+			if (bounds !== null && bounds !== undefined) {
+				min = Math.max(min, bounds.min);
+				if (max === null || bounds.max - width < max) max = bounds.max - width;
+			}
+			if (max === null) return Math.max(min, centered);
+			return Math.max(min, Math.min(centered, max));
+		}
+
+		/**
+		 * 纯文字提示在「可用区间比文字还窄」时的缩放比例（用户拍板：**特例才缩，一般情况不缩**）。
+		 * 可用区间 = plainBoundsOf 给的 min~max（再与视口夹）；没有 bounds 就退回视口两侧各留 8px。
+		 * 返回 1 = 不缩放；< 1 = 需要等比缩小。
+		 * 下限 0.5：11px 缩到 5.5px 已经是能辨认的极限，再小不如不显示。
+		 */
+		function plainFitScale(textWidth, bounds, viewportWidth) {
+			if (typeof textWidth !== "number" || Number.isFinite(textWidth) !== true || textWidth <= 0) return 1;
+			const viewport = typeof viewportWidth === "number" && viewportWidth > 0 ? viewportWidth : 0;
+			let min = 8;
+			let max = viewport > 0 ? viewport - 8 : null;
+			if (bounds !== null && bounds !== undefined) {
+				min = Math.max(min, bounds.min);
+				if (max === null || bounds.max < max) max = bounds.max;
+			}
+			if (max === null) return 1;
+			const available = max - min;
+			/* 区间本身就是负的（标题右边界已经越过色条右边）：没有可用的横向空间，不缩也无处可放 */
+			if (available <= 0) return 1;
+			if (textWidth <= available) return 1;
+			return Math.max(0.5, available / textWidth);
+		}
+
 		/**
 		 * 悬停浮层的内容：日期（或周区间）+ 三项总计 → 命中/未命中/输出三行 → API 请求次数 → 消费金额。
 		 * 六行全部走「名称左、数值右」的双边对齐；数量精确到个位并带千分位，不做缩写。
@@ -2128,7 +2615,6 @@ window.__ModuleLoader__.load({
 				const hasPeak = pkHit + pkMiss + pkOut > 0;
 				return h("span", {
 					className: "dsb-day"
-						+ (day.date === tip.today ? " dsb-day-today" : "")
 						+ (activeBar === index ? " dsb-day-active" : ""),
 					key: "__wd" + index,
 					/* 悬停整列都让判定区变灰 —— 没有用量的天也一样；浮层只在有用量时弹 */
@@ -2172,9 +2658,7 @@ window.__ModuleLoader__.load({
 				style: panelStyle(pos),
 				/* 吃下鼠标事件：不穿透到下面，也不冒泡回去把气泡关掉 */
 				onClick: stopTipClick,
-				onMouseDown: stopTipClick,
-				/* 诊断：定位回调把「模式 + 基准 + 结果」写在这里（不可见），同时会回传给 host 落盘 */
-				"data-dsb-align": pos === null || pos === undefined || pos.align === undefined ? undefined : pos.align
+				onMouseDown: stopTipClick
 			}, [
 				h("span", { className: "dsb-meter-head", key: "__wh" }, [
 					h("span", { className: "dsb-meter-headline", key: "__wt" }, tip.title)
@@ -2189,22 +2673,72 @@ window.__ModuleLoader__.load({
 		}
 
 		/**
-		 * 长列表分列：**每一竖列最多三行**，超过就多开一竖列（列数不设上限，
-		 * 放不下时由 CSS 折到下一排，整体高度另有屏幕半高的兜底上限）。
+		 * 长列表分列：**每一竖列最多三行**，超过就多开一竖列（列数不设上限）。
+		 * 列网格是 `flex-wrap:nowrap`（用户拍板：**绝不折行**），一排放不下就横向滚动；
+		 * 在那之前先**逐档加每列行数**（3 → 4 → 5 …，上限见 LIST_ROWS_PER_COLUMN_MAX）——
+		 * 行数一加，列数就变少，放得下的机会更大，而且气泡宽度会跟着收窄（用户称"理解 B"）。
 		 */
 		const LIST_ROWS_PER_COLUMN = 3;
-		function listColumns(rows) {
-			const size = LIST_ROWS_PER_COLUMN;
+		/* 工具调用每列行数的上限：再往上加会让气泡高得离谱，12 行（约 264px）够收住绝大多数工具数。
+		   12 行仍放不下才真正进入横向滚动（此时列网格 overflow-x 生效）。 */
+		const LIST_ROWS_PER_COLUMN_MAX = 12;
+		function listColumns(rows, rowsPerColumn) {
+			const size = rowsPerColumn === undefined || rowsPerColumn === null ? LIST_ROWS_PER_COLUMN : rowsPerColumn;
 			const out = [];
 			for (let i = 0; i < rows.length; i += size) out.push(rows.slice(i, i + size));
 			return out;
 		}
 
+		/**
+		 * 工具调用子视图「每列行数」的下一档：放得下就保持；放不下且还没到上限就 +1。
+		 * 只升不降 —— 一放不下就升、升过头也不回退，避免行数在两档之间来回跳。
+		 * 到 12 行都还放不下就停在这里，由列网格的横向滚动兜底（不再折行）。
+		 * 纯函数，方便单测（4→5、上限 12 这两条边界都由它钉住）。
+		 * 第二参按"这一排放不下"传（历史上叫 wrapped，折行已不可能发生，语义见 toolColumnsOverflow）。
+		 */
+		function nextToolRows(current, wrapped) {
+			if (wrapped !== true) return current;
+			return current < LIST_ROWS_PER_COLUMN_MAX ? current + 1 : current;
+		}
+
+		/**
+		 * 工具调用子视图的列网格**是否横向放不下**：放不下返回 true，交给 nextToolRows 逐档加行
+		 * （3 → 4 → 5 …，行数加上去列数就变少，直到一排放得下）。
+		 *
+		 * 为什么不是「量各列 top 判断折行」：列网格已改成 `flex-wrap:nowrap`（用户拍板：
+		 * **绝不能折行**），折行在任何情况下都不会发生 —— 再按 top 判会恒为 false，
+		 * 逐档加行就彻底失效了。改成量**内容宽度 vs 容器宽度**（scrollWidth > clientWidth），
+		 * 这才是 nowrap 下"放不下"的唯一表现，也是加行的原始动机。
+		 *
+		 * 判据用 `1px` 容差：scrollWidth / clientWidth 都是整数，亚像素取整可能差 1px，
+		 * 差 1px 不该被当成溢出，否则会白加一档行数。真溢出时通常差几十上百像素。
+		 *
+		 * 只有工具调用那个子视图（带 dsb-meter-tight）才换行数，别的子视图不参与。
+		 * 拿不到 DOM 几何（测试替身 / 面板还没挂上）时一律当"放得下"，避免在非浏览器环境里误判。
+		 */
+		function toolColumnsOverflow(panel) {
+			if (panel === null || panel === undefined) return false;
+			if (typeof panel.querySelector !== "function" || typeof panel.querySelectorAll !== "function") return false;
+			if (panel.querySelector(".dsb-meter-tight") === null) return false;
+			const grids = panel.querySelectorAll(".dsb-meter-cols");
+			if (grids === null || grids === undefined) return false;
+			for (let g = 0; g < grids.length; g += 1) {
+				const node = grids[g];
+				if (node === null || node === undefined) continue;
+				const scrollWidth = typeof node.scrollWidth === "number" ? node.scrollWidth : null;
+				const clientWidth = typeof node.clientWidth === "number" ? node.clientWidth : null;
+				if (scrollWidth === null || clientWidth === null) continue;
+				if (clientWidth <= 0) continue;
+				if (scrollWidth - clientWidth > 1) return true;
+			}
+			return false;
+		}
+
 		/**
 		 * 两列面板：标题 + 主数值，下面若干「名称 / 数值」行（用时、极值、命中率、余额、会话数据这类段用）。
 		 * 行上带 sub 的（会话数据那三行）点一下就把整个气泡换成子视图：标题变成子视图名、内容换成列表，
 		 * 子视图沿用主气泡的字号字色（不是二次气泡），点标题回到上一层。
-		 * 子视图的列表每列最多三行、超了往右加列；只有名字的行（技能注入）不占数值那一格。
+		 * 子视图的列表每列最多三行、超了往右加列（工具调用那档按量测逐档加到 4、5 … 直到不折行）。
 		 */
 		function rowsPanel(tip, pos, ref, sub) {
 			const rows = tip.rows === undefined ? [] : tip.rows;
@@ -2213,7 +2747,8 @@ window.__ModuleLoader__.load({
 				? null
 				: rows[openedAt].sub;
 			/* 一行里的三块：色块（可选，与上面那条色条一一对应）+ 名称 + 数值。
-			   没有数值的行（技能注入的子视图）只出名字，不占右边那一格，气泡宽度就是最长那个名字。
+			   名称也可能是节点数组（手动调用 / 手动压缩的名字后要跟上标星号，压缩的星号还得夹在
+			   序号后面 —— 拼成字符串就插不进去了），这里原样交给 React 当子节点。
 			   可点行与普通行共用这一份，别各写一遍。 */
 			const parts = (row, key) => [
 				row.color === undefined || row.color === null
@@ -2242,7 +2777,14 @@ window.__ModuleLoader__.load({
 						}, parts(row, "__xr" + index));
 					}));
 			} else {
-				const columns = listColumns(opened.rows);
+				/* 每列几行：工具调用那档由 StatusBar 量完 DOM 后逐档加（3 → 4 → 5 …，最多 12），
+				   其余子视图照旧 3。所有行统一走**一个**列网格 —— 工具名就是原生英文名，
+				   不再有「中文/英文整行块」两套结构。 */
+				const perColumn = opened.tight === true && sub !== undefined && sub !== null
+					&& typeof sub.rowsPerColumn === "number"
+					? sub.rowsPerColumn
+					: LIST_ROWS_PER_COLUMN;
+				const columns = listColumns(opened.rows, perColumn);
 				wide = columns.length > 1;
 				/* 一列时不套外层（与其它面板的行结构完全一致），分列才多一层；
 				   子视图带 tight 的（工具调用）另挂一个类，把名字与数值的间隙收紧 */
@@ -2256,7 +2798,11 @@ window.__ModuleLoader__.load({
 					: h("span", { className: cls, key: "__xrows" },
 						(columns[0] === undefined ? [] : columns[0]).map((row, index) => cell(row, "__r" + index)));
 			}
-			const segments = Array.isArray(tip.segments) ? tip.segments : [];
+			/* 标题下那条：根视图用 tip.segments（余额/用时那种），子视图用 opened.segments（工具调用彩条）；
+			   都没有就退回普通分隔线。彩条里的 title 只做悬浮提示，不加交互。 */
+			const barSegments = opened === null
+				? (Array.isArray(tip.segments) ? tip.segments : [])
+				: (Array.isArray(opened.segments) ? opened.segments : []);
 			return h("span", {
 				className: wide === true ? "dsb-tip dsb-meter dsb-meter-wide" : "dsb-tip dsb-meter",
 				key: "__tip", ref: ref, style: panelStyle(pos), onClick: stopTipClick, onMouseDown: stopTipClick
@@ -2277,12 +2823,42 @@ window.__ModuleLoader__.load({
 						? null
 						: h("span", { className: "dsb-meter-figures", key: "__xhf" }, tip.head)
 				]),
-				/* 有分段数据就画色条（与令牌面板同一条），否则还是那条普通分隔线 */
-				segments.length > 0
-					? h("span", { className: "dsb-bar", key: "__xbar" }, segments.map((one, index) => h("span", {
-						className: "dsb-bar-seg", key: "__xseg" + index,
-						style: { width: one.width + "%", background: one.color }
-					})))
+				/* 有分段数据就画色条（与令牌面板同一条），否则还是那条普通分隔线。
+				   子视图的彩条（工具调用）每段挂插件自己的悬停处理：**只显示一行纯文字**
+				   （工具名 + 占比），没有气泡、没有阴影（用户拍板）。 */
+				barSegments.length > 0
+					? h("span", {
+						/* 悬停放大的动效**只在工具调用这个下钻子视图**启用：opened 非空且是 tight 列表才挂
+						   dsb-bar-hoverable。根视图的分段条（余额/用时）与其它子视图一律是普通 .dsb-bar，
+						   不参与任何悬停放大/过渡。 */
+						className: opened !== null && opened.tight === true
+							? "dsb-bar dsb-bar-hoverable"
+							: "dsb-bar",
+						key: "__xbar"
+					}, barSegments.map((one, index) => {
+						const segProps = {
+							className: "dsb-bar-seg",
+							key: "__xseg" + index,
+							/* background-color 长写（不是 background 简写）：简写会把 background-clip 重置成
+							   border-box，段内 1px 透明右边框的分隔就失效了 */
+							style: { width: one.width + "%", backgroundColor: one.color }
+						};
+						if (opened !== null && sub !== undefined && sub !== null && typeof sub.hover === "function"
+							&& one.name !== undefined) {
+							/* 用户拍板：不要气泡，只显示一行文字（工具名 + 占比），贴在鼠标上方最近处 */
+							segProps.onMouseEnter = (event) => sub.hover(event, {
+								plain: one.name + " " + one.percentText,
+								follow: true
+							});
+							/* 在同一个色段里移动时只更新文字位置，不重建内容（避免闪断） */
+							segProps.onMouseMove = (event) => {
+								if (typeof sub.hoverMove === "function") sub.hoverMove(event);
+								if (typeof event.stopPropagation === "function") event.stopPropagation();
+							};
+							segProps.onMouseLeave = () => sub.hover(null);
+						}
+						return h("span", segProps);
+					}))
 					: h("span", { className: "dsb-meter-divider", key: "__xdiv" }),
 				body
 			]);
@@ -2308,9 +2884,35 @@ window.__ModuleLoader__.load({
 			});
 		}
 
-		/** 令牌面板的 tip。没有数据也给面板（三行横杠）—— 气泡必须任何情况下都点得开。 */
-		function tokensTip(parts, title, t) {
-			const panel = parts === null ? null : tokenPanelView(parts.cached, parts.missInput, parts.output, t);
+		/**
+		 * 宿主投影里的「压缩摘要 token 累计」→ 与本面板同样的三段。
+		 *
+		 * 为什么要单独加这一份：**「总计费用」含摘要，「总计用量」原本不含** ——
+		 * 费用是我们自己逐条算的（`addCallTotals` 对 `compaction/summary` 也累加），
+		 * 而用量来自官方 `tokenUsage` 投影，官方只折 `assistant` 事件、不含压缩摘要。
+		 * 结果同一个气泡里两个数字口径不一致。用户拍板「官方投影继续用，只把摘要这部分
+		 * 额外加上」，这个函数就是那个「额外加上」的部分。
+		 *
+		 * 口径必须与 `billableParts` 一致：`input` + `cacheWrite` 都算未命中（missInput），
+		 * `cacheRead` 算命中，`output` 算输出 —— 否则三行明细与总计对不上。
+		 * 宿主老版本没有 `summaryParts`（或值为空）时返回 null，调用方跳过即可。
+		 */
+		function summaryTokenParts(summaryParts) {
+			if (summaryParts === undefined || summaryParts === null || typeof summaryParts !== "object") return null;
+			return billableParts(summaryParts);
+		}
+
+		/**
+		 * 令牌面板的 tip。没有数据也给面板（三行横杠）—— 气泡必须任何情况下都点得开。
+		 * `sub` 是子代理三段：条上会拆出浅色子段；`parts` 为 null（本会话还没上报用量）
+		 * 但有子代理数据时，用子代理的三段当合并值，不能退化成横杠（否则队友的量看不见）。
+		 */
+		function tokensTip(parts, title, t, sub) {
+			const subParts = sub === null || sub === undefined ? null : sub;
+			const merged = parts === null || parts === undefined
+				? (subParts === null ? null : { cached: subParts.cached, missInput: subParts.missInput, output: subParts.output })
+				: parts;
+			const panel = merged === null ? null : tokenPanelView(merged.cached, merged.missInput, merged.output, t, subParts);
 			return { kind: "tokens", title: title, panel: panel === null ? dashTokenPanel(t) : panel };
 		}
 
@@ -2407,109 +3009,152 @@ window.__ModuleLoader__.load({
 			return head + (rest < 10 ? "零" + DIGITS[rest] : under100(rest));
 		}
 
+		/**
+		 * 手动调用 / 手动压缩那一项的星号：做成**上标**（像 X² 的 ²），不是普通的星号字符。
+		 * 读屏要能听到「手动触发」：span 默认是 generic 角色、aria-label 会被忽略，
+		 * 所以给它 img 角色当纯图形标注，视觉里仍然只有那个 *。
+		 * title 留给鼠标悬停；中英界面都要显示，所以由调用方传当前语言的 t 进来。
+		 */
+		function manualStar(t) {
+			/* 只有读屏名称，**不挂 title**：星号只有 11px，鼠标几乎落不到它上面，
+			   留一个原生悬停气泡只会是"偶尔冒出来一下"的意外行为（用户明确不要）。
+			   aria-label 保留 —— 它只服务屏幕阅读器，不产生任何可见元素。 */
+			return h("span", {
+				className: "dsb-sup",
+				key: "__star",
+				role: "img",
+				"aria-label": t("tipManual")
+			}, "*");
+		}
+
 		/** 子视图没有内容时给一行横杠：气泡任何情况下都要打得开，也不能是一片空白。 */
 		function emptyList(title) {
 			return { title: title, rows: [{ label: title, value: "-" }] };
 		}
 
-		/** 技能注入子视图：只列名字，不跟数值（次数在上面那一行已经给了）。
-		    全局提示词（AGENTS.md 这类）排在最前，它也是「注入」的一种；
-		    其余技能按首次注入的先后，重复注入聚合成一行；气泡宽度就是最长那个名字。 */
+		/**
+		 * 技能注入子视图：只列名字，**不显示统计次数**（用户明确要求：次数只用来排序）。
+		 * 同名注入在内部聚合计数，排序 = **名字短的在前** → 注入次数多的在前 → 字典序；
+		 * 次数只参与排序，不进界面（与工具调用「次」那套无关）。
+		 * 手动调用的技能（`manual: true`）名字后跟上标星号；只要其中有一次是手动就算。
+		 * 全局提示词（AGENTS.md 这类）**固定排第一**：它也是注入的一种，但不是技能调用，
+		 * 不参与上面那套技能排序；其余技能照常排。
+		 */
 		function skillList(skills, globalInstruction, t) {
 			const title = t("tipCountsSkills");
 			const names = [];
-			if (typeof globalInstruction === "string" && globalInstruction.length > 0) names.push(globalInstruction);
-			if (skills !== null) {
-				skills.forEach((name) => {
-					const key = String(name);
-					if (names.indexOf(key) < 0) names.push(key);
+			const counts = new Map();
+			const manual = new Set();
+			const pinned = typeof globalInstruction === "string" && globalInstruction.length > 0 ? globalInstruction : null;
+			const add = (name, isManual) => {
+				const key = String(name);
+				if (key.length === 0) return;
+				if (counts.has(key) !== true) {
+					counts.set(key, 0);
+					names.push(key);
+				}
+				counts.set(key, counts.get(key) + 1);
+				if (isManual === true) manual.add(key);
+			};
+			if (pinned !== null) add(pinned, false);
+			if (Array.isArray(skills)) {
+				skills.forEach((entry) => {
+					/* 契约是 `{ name, manual }`；旧宿主（还没升级的那一半）只给字符串，兼容一下 */
+					if (typeof entry === "string") {
+						add(entry, false);
+						return;
+					}
+					if (entry === null || entry === undefined || typeof entry.name !== "string") return;
+					add(entry.name, entry.manual === true);
 				});
 			}
 			if (names.length === 0) return emptyList(title);
-			return { title: title, rows: names.map((name) => ({ label: name })) };
+			const rest = names.filter((name) => name !== pinned);
+			rest.sort((a, b) => a.length - b.length
+				|| counts.get(b) - counts.get(a)
+				|| (a < b ? -1 : (a > b ? 1 : 0)));
+			const ordered = pinned !== null && counts.has(pinned) ? [pinned].concat(rest) : rest;
+			/* 行上只有名字（手动调用的带行尾星号），不带 value —— 次数只用于上面的排序 */
+			return {
+				title: title,
+				rows: ordered.map((name) => ({
+					label: manual.has(name) === true ? [name, manualStar(t)] : name
+				}))
+			};
 		}
 
+		/* 工具调用分段条的 32 色（按 01→32 顺序使用、浅→浓，每 8 个一行）。
+		   颜色跟着「显示顺序」走：第 1 个工具用第 1 色，超过 32 个循环回第 1 色。 */
+		const TOOL_BAR_COLORS = [
+			"#FFBFD1", "#FFC5AB", "#F4D06A", "#B0E693", "#72ECD6", "#93E0FF", "#C3D2FF", "#EBC1FF",
+			"#FFA29E", "#F5AE60", "#C0C762", "#77D6A1", "#57D4DE", "#87C5FF", "#C0B3FC", "#EDA3D8",
+			"#EB9067", "#CAA63E", "#88BC6B", "#42C2AD", "#54B9DD", "#91A7EC", "#C496D9", "#E68BA8",
+			"#CA8634", "#989E36", "#4DAD79", "#1BAAB4", "#609CD4", "#998BD1", "#C27BAF", "#D67774"
+		];
+
 		/**
-		 * 工具名的中文显示名。工具名本身是会话日志里的键（英文标识），这里换成读者看得懂的词；
-		 * **没列到的工具照原样显示** —— 插件工具、MCP 工具随时可能出现，不能因为查不到就留白。
-		 * 只在中文界面用；英文界面直接用原名。
+		 * 「工具调用」子视图：直接显示**原生工具名**（不翻译，用户拍板：翻不准就用原名）。
+		 * **先按名字长度升序（短的在前），同长再按调用次数降序，最后字典序**；
+		 * 同名（同名原始名）合并计数 —— 不同工具天然不同名，不会被合并。
+		 * 名字短、列多，标 tight 让名字与次数之间的间隙收到 1ch。
+		 * 所有行统一走一个列网格：每列默认 3 行，折行时逐档 4→5…（上限 12，见 LIST_ROWS_PER_COLUMN_MAX；
+		 * LIST_ROWS_PER_COLUMN 是默认值 3，别把两者搞混）。
+		 * 同时给出 `segments`：标题下那条彩条，按上面的显示顺序取 32 色（第 33 个循环回第 1 色），
+		 * 宽度 = 该工具次数 ÷ 总次数；每段带 `name` / `percentText`（两位小数占比），给状态栏的悬停提示用。
 		 */
-		const TOOL_LABELS_ZH = {
-			pwsh: "命令行",
-			bash: "命令行",
-			read: "读取文件",
-			write: "写入文件",
-			edit: "修改文件",
-			glob: "查找文件",
-			grep: "搜索内容",
-			todo_write: "待办清单",
-			skill: "技能",
-			subagent: "子智能体",
-			subagent_fork: "子智能体（继承）",
-			ask_user_question: "询问用户",
-			create_goal: "新建目标",
-			update_goal: "更新目标",
-			get_goal: "查看目标",
-			present: "展示文件",
-			web_search: "联网搜索",
-			web_fetch: "抓取网页",
-			job_list: "后台任务列表",
-			job_output: "后台任务输出",
-			job_kill: "取消后台任务",
-			spawn_teammate: "新增队友",
-			send_message: "发送消息",
-			wait_agent: "等待队友",
-			interrupt_agent: "中断队友",
-			list_agents: "队友列表",
-			team_task_create: "新建任务",
-			team_task_list: "任务列表",
-			team_task_get: "查看任务",
-			team_task_update: "更新任务",
-			exit_plan_mode: "退出计划模式",
-			load_workspace_dependencies: "加载工作区依赖",
-			find_dsh_plugin: "查找插件",
-			workflow: "工作流"
-		};
-
-		/** 工具名 → 显示名：中文界面查表（查不到给原名），英文界面直接用原名。 */
-		function toolLabel(name, t) {
-			if (detectLocale(t) !== "zh") return name;
-			const label = TOOL_LABELS_ZH[name];
-			return label === undefined ? name : label;
-		}
-
-		/** 「工具调用」子视图：**先按显示名长短（短的在前），同名长短再按调用次数降序**。
-		    名字短、列多，标 tight 让名字与次数之间的间隙收到 1ch。 */
 		function toolList(counts, t) {
 			const title = t("tipCountsToolCalls");
 			if (counts === null || typeof counts !== "object") return Object.assign(emptyList(title), { tight: true });
-			const rows = Object.keys(counts)
-				.map((name) => ({ label: toolLabel(name, t), count: Number(counts[name]) || 0 }))
+			const entries = Object.keys(counts)
+				.map((name) => ({ label: name, count: Number(counts[name]) || 0 }))
 				.filter((one) => one.count > 0)
 				.sort((a, b) => a.label.length - b.label.length
 					|| b.count - a.count
-					|| (a.label < b.label ? -1 : (a.label > b.label ? 1 : 0)))
-				.map((one) => ({ label: one.label, value: formatTokensExact(one.count) + t("unitCountCalls") }));
-			if (rows.length === 0) return Object.assign(emptyList(title), { tight: true });
-			return { title: title, rows: rows, tight: true };
+					|| (a.label < b.label ? -1 : (a.label > b.label ? 1 : 0)));
+			if (entries.length === 0) return Object.assign(emptyList(title), { tight: true });
+			const total = entries.reduce((sum, one) => sum + one.count, 0);
+			const rows = entries.map((one) => ({ label: one.label, value: formatTokensExact(one.count) + t("unitCountCalls") }));
+			const segments = entries.map((one, index) => {
+				const percent = (one.count / total) * 100;
+				return {
+					color: TOOL_BAR_COLORS[index % TOOL_BAR_COLORS.length],
+					width: percent,
+					/* 悬停浮层用：工具名 + 占比（两位小数，不带次数；浮层由 StatusBar 的 onHover 统一渲染） */
+					name: one.label,
+					percentText: percent.toFixed(2) + "%"
+				};
+			});
+			return { title: title, rows: rows, tight: true, segments: segments };
 		}
 
-		/** 「上下文压缩」子视图：逐条列出每次压缩落在第几轮第几步（顺序就是发生的顺序）。 */
+		/**
+		 * 「上下文压缩」子视图：逐条列出每次压缩落在第几轮第几步（顺序就是发生的顺序）。
+		 * host 已经滤掉失败的压缩，这里只按契约渲染。落点三档：
+		 *   turn 是数字 → 「第X轮Y步」（step 为空时「第X轮」）；
+		 *   turn 为 null（手动 /compact 的轮间压缩）→ 用 afterTurn 显示「第X轮后」，
+		 *     否则手动压缩只剩一个横杠，用户看不出它发生在哪儿（2026-10 实测反馈）；
+		 *   afterTurn 也没有 → 「-」。
+		 * 手动压缩（`manual: true`）在**行尾**跟上标星号（「第二次压缩*」）—— 星号不插进序号里，
+		 * 免得把「第二次」拆开。
+		 */
 		function compactList(compacts, t) {
 			const title = t("tipCountsCompactAt");
-			if (compacts === null || compacts.length === 0) return emptyList(title);
+			if (compacts === null || compacts === undefined || compacts.length === 0) return emptyList(title);
 			const ordinal = detectLocale(t) === "zh";
 			const rows = compacts.map((one, at) => {
 				const index = at + 1;
 				const word = ordinal === true ? chineseNumber(index) : null;
+				const text = word === null ? String(index) : word;
 				const mark = one === null || one === undefined ? {} : one;
 				const turn = typeof mark.turn === "number" ? mark.turn : null;
 				const step = typeof mark.step === "number" ? mark.step : null;
+				const afterTurn = typeof mark.afterTurn === "number" ? mark.afterTurn : null;
+				const label = t("tipCompactItem", { index: text });
 				return {
-					label: t("tipCompactItem", { index: word === null ? String(index) : word }),
-					value: turn === null
-						? "-"
-						: (step === null ? t("tipCompactTurnOnly", { turn: turn }) : t("tipCompactWhere", { turn: turn, step: step }))
+					label: mark.manual === true ? [label, manualStar(t)] : label,
+					value: turn !== null
+						? (step === null ? t("tipCompactTurnOnly", { turn: turn }) : t("tipCompactWhere", { turn: turn, step: step }))
+						: (afterTurn === null ? "-" : t("tipCompactAfter", { turn: afterTurn }))
 				};
 			});
 			return { title: title, rows: rows };
@@ -2520,6 +3165,150 @@ window.__ModuleLoader__.load({
 			return typeof value === "string" && value.length > 0 ? value : "0.00";
 		}
 
+		/**
+		 * 积分数字（used / total）→ 显示文本：**保留两位小数、去掉无意义的尾零**。
+		 * 上游给的是原始 number，实测带浮点尾数（12.389999979999999、552.42999936），
+		 * 直接 String() 会显示一长串；这里四舍五入到分位：552.43 / 12.39 / 500。
+		 */
+		function formatCredits(value) {
+			const n = Number(value);
+			if (Number.isFinite(n) !== true) return "0";
+			return String(Math.round(n * 100) / 100);
+		}
+
+		/**
+		 * 积分套餐的一行文字：包名 + 备注（月度刷新 / 每月刷新兜底 / 到期），不排序。
+		 * 聚合行（count > 1）名称带「×X」，日期换用「(最近)」版文案 —— 合并后只代表合计与最近到期日。
+		 */
+		function creditsLabel(one, t) {
+			const merged = typeof one.count === "number" && one.count > 1;
+			let label = merged ? one.name + "×" + one.count : one.name;
+			if (one.monthly === true) {
+				/* 月度包：有刷新日期就给日期，没有才退回「每月刷新」 */
+				if (typeof one.refreshAt === "string" && one.refreshAt.length >= 10) {
+					label += t(merged ? "tipCreditsRefreshLatest" : "tipCreditsRefresh", { date: one.refreshAt.slice(5, 10) });
+				} else {
+					label += t("tipCreditsMonthly");
+				}
+			} else if (typeof one.expireAt === "string" && one.expireAt.length >= 10) {
+				label += t(merged ? "tipCreditsExpireLatest" : "tipCreditsExpire", { date: one.expireAt.slice(5, 10) });
+			}
+			return label;
+		}
+
+		/* 积分套餐名里的公共前缀：按顺序剥、只剥开头、可连续剥（例如
+		   CodeBuddy个人版国内运营裂变包 → 个人版国内运营裂变包 → 国内运营裂变包 → 运营裂变包）。
+		   纯本地实现，不查任何外部数据：上游以后新增什么套餐名都照样能剥。 */
+		const CREDITS_NAME_PREFIXES = ["CodeBuddy", "个人版", "国内"];
+
+		/**
+		 * 显示用的套餐名：**保持上游原名，只剥渠道前缀**（不翻译）。
+		 *
+		 * 为什么不翻译：国内站（region=cn）的包名上游就是中文、国际站（region=global）上游就是英文，
+		 * 本来就该原样显示。以前维护过一张双向映射表，但上游随时可能出新包
+		 * （如国际站的 `Launch Bonus`），表里没覆盖到就会漏翻、比不翻更糟 —— 所以整张表已删除。
+		 *
+		 * 剥前缀规则（纯本地、可连续剥、大小写不敏感、**只剥开头**）：
+		 *   ① 按 CREDITS_NAME_PREFIXES 顺序反复剥，直到一轮下来一个都没剥掉；
+		 *   ② 全剥完是空串时保留原名 —— 不能给用户一行只有「· 11-01 到期」没有名字的东西；
+		 *   ③ 前缀出现在中间（如 `我的CodeBuddy包`）不剥，因为只匹配开头。
+		 *
+		 * 入参 `t` 已不再使用（保留形参是为了不动调用方），但**不要**据此认为它有用。
+		 */
+		function creditDisplayName(name) {
+			let out = name;
+			let stripped = true;
+			while (stripped === true) {
+				stripped = false;
+				for (let i = 0; i < CREDITS_NAME_PREFIXES.length; i += 1) {
+					const prefix = CREDITS_NAME_PREFIXES[i];
+					if (out.toLowerCase().indexOf(prefix.toLowerCase()) === 0) {
+						out = out.slice(prefix.length);
+						stripped = true;
+						break;
+					}
+				}
+			}
+			return out.length === 0 ? name : out;
+		}
+
+		/** 两个 ISO 日期里取更早的那个（null 不参与）；合并相邻同名包时「只显示最近到期日」。 */
+		function earliestDate(a, b) {
+			if (a === null || a === undefined) return b === undefined ? null : b;
+			if (b === null || b === undefined) return a;
+			return a <= b ? a : b;
+		}
+
+		/**
+		 * 积分套餐面板数据：`{ title, totalText, rewards[] }`。
+		 * 每个套餐带上显示用字段（label / valueText / percent），渲染函数只负责画。
+		 * **相邻且显示名相同**的套餐合并成一行：used/total 相加、percent 按合计重算、count 记原条数；
+		 * 日期只取最近的一个（monthly 取最早 refreshAt，否则取最早 expireAt），不显示区间；
+		 * 顺序按首次出现位置。字段缺失（name 不是非空字符串）的套餐直接跳过。
+		 * percent = clamp(used / total × 100, 0, 100)，total<=0 时给 0（画空轨道）。
+		 */
+		function creditsView(rewards, totalText, t) {
+			const list = Array.isArray(rewards) ? rewards : [];
+			const merged = [];
+			list.forEach((one) => {
+				if (one === null || one === undefined || typeof one !== "object") return;
+				if (typeof one.name !== "string" || one.name.length === 0) return;
+				const name = creditDisplayName(one.name);
+				const used = Number(one.used) || 0;
+				const total = Number(one.total) || 0;
+				const monthly = one.monthly === true;
+				const expireAt = typeof one.expireAt === "string" && one.expireAt.length >= 10 ? one.expireAt : null;
+				const refreshAt = typeof one.refreshAt === "string" && one.refreshAt.length >= 10 ? one.refreshAt : null;
+				/* 每个原始包自己保留一份明细（子视图里逐条列出，各自真实值 + 自己的日期备注） */
+				const itemLabel = creditsLabel({ name: name, monthly: monthly, expireAt: expireAt, refreshAt: refreshAt, count: 1 }, t);
+				const item = {
+					name: one.name,
+					used: used,
+					total: total,
+					expireAt: expireAt,
+					refreshAt: refreshAt,
+					monthly: monthly,
+					label: itemLabel,
+					valueText: t("tipCreditsUsed", { used: formatCredits(used), total: formatCredits(total) }),
+					percent: total > 0 ? Math.max(0, Math.min(100, (used / total) * 100)) : 0
+				};
+				const last = merged.length > 0 ? merged[merged.length - 1] : null;
+				if (last !== null && last.name === name) {
+					last.used += used;
+					last.total += total;
+					last.count += 1;
+					last.expireAt = earliestDate(last.expireAt, expireAt);
+					last.refreshAt = earliestDate(last.refreshAt, refreshAt);
+					last.items.push(item);
+					return;
+				}
+				merged.push({
+					name: name, used: used, total: total, count: 1,
+					expireAt: expireAt, refreshAt: refreshAt, monthly: monthly, items: [item]
+				});
+			});
+			const rows = merged.map((one) => {
+				/* 该组剩余积分 = 总容量 - 已用（不小于 0）；下钻标题右侧显示它，随用量动态变化 */
+				const remaining = Math.max(0, one.total - one.used);
+				return {
+					name: one.name,
+					used: one.used,
+					total: one.total,
+					remaining: remaining,
+					remainingText: formatCredits(remaining),
+					count: one.count,
+					items: one.items,
+					expireAt: one.expireAt,
+					refreshAt: one.refreshAt,
+					monthly: one.monthly,
+					label: creditsLabel(one, t),
+					valueText: t("tipCreditsUsed", { used: formatCredits(one.used), total: formatCredits(one.total) }),
+					percent: one.total > 0 ? Math.max(0, Math.min(100, (one.used / one.total) * 100)) : 0
+				};
+			});
+			return { title: t("tipCreditsTitle"), totalText: totalText, rewards: rows };
+		}
+
 		/** 单次调用的缓存命中率（%）；这次调用一个输入 token 都没有时返回 null（算不出比例）。 */
 		function hitRateOf(call) {
 			const denominator = (call.input || 0) + (call.cacheRead || 0) + (call.cacheWrite || 0);
@@ -2803,33 +3592,51 @@ window.__ModuleLoader__.load({
 				const calls = sessionUsage === undefined || sessionUsage === null || Array.isArray(sessionUsage.calls) !== true
 					? []
 					: sessionUsage.calls;
-				/* 每条调用按自己发生的那一刻、自己的模型定峰谷：跨时段、跨模型都不会串价。
-				   累加的是未舍入金额，最后一次性舍入 —— 逐条舍入会累积出几毛钱的误差。
-				   **每条还要按它自己条目的币种折到显示币种**：会话里 A 是人民币、B 是美元时，
-				   底栏给的是一个数字（折到主模型那种币），不是两种货币相加。 */
 				const fallbackModel = src.sessionModel !== undefined && src.sessionModel !== null ? src.sessionModel.model : null;
-				let total = 0;
-				let priced = false;
-				for (let i = 0; i < calls.length; i += 1) {
-					const callModel = typeof calls[i].model === "string" ? calls[i].model : fallbackModel;
-					const one = costOf(calls[i], callModel, calls[i].at);
-					if (one === null) continue;
-					priced = true;
-					total += toDisplayCurrency(one, src.models, callModel, symbolCurrency, src.defaultCurrency);
-				}
-				/* 队友（子智能体）是**独立会话**，它的用量不在上面这份本会话调用表里，
-				   host 按 parentSession 算好单独给回来；这里直接把数字并进「总计」，
-				   不另开一行也不加任何提示字 —— 用户报的正是"总计没算队友"。
-				   两段数据（整会话 / 本轮窗口）各自拿到才用，没拿到的那段当 0。 */
+				/* 被 host 的 MAX_CALLS 截掉的那部分（host 按「模型 + 峰谷档」累计好给回来）。
+				   不补这一段的话，长会话的费用只算了最近 4000 条 —— 实测 5000 次少 20%、
+				   2 万次少 80%，而「总计用量」用的是官方全量数据，两者会在同一个界面上对不上。
+				   档位由 host 按北京时间判定（与逐条计价同一套规则），所以这里直接按档取价即可。 */
+				const overflow = sessionUsage === undefined || sessionUsage === null
+					|| sessionUsage.overflow === undefined || sessionUsage.overflow === null
+					|| typeof sessionUsage.overflow !== "object"
+					? {}
+					: sessionUsage.overflow;
+				/* 队友（子智能体）是**独立会话**，它的用量不在本会话调用表里，
+				   host 按 parentSession 算好单独给回来；这里把金额并进「总计」，
+				   不另开一行也不加任何提示字 —— 用户报的正是"总计没算队友"。 */
 				const sub = subagentOf(src.subagent, "session");
 				const subCost = subagentCostOf(src.subagent, "session", symbolCurrency);
-				const grand = total + subCost;
+				/* 「总计用量」= 官方投影 + 压缩摘要 + 队友。
+				   为什么必须加摘要那一份：官方 `tokenUsage` 只折 assistant 事件、**不含压缩摘要**，
+				   而「总计费用」是我们自己逐条算的、**含摘要**；不加的话同一气泡里两个数字
+				   口径不一致（费用把摘要算进去了、用量没算）。宿主老版本没有 summaryParts，
+				   这里会是 null，`mergeTokenParts` 对 null 段当 0 处理 —— 行为退回改动前。 */
+				const mergedTokens = mergeTokenParts(
+					mergeTokenParts(sessionTokenParts(src.usage), summaryTokenParts(src.sessionUsage === undefined || src.sessionUsage === null
+						? null
+						: src.sessionUsage.summaryParts)),
+					sub);
+				/* 增量式记账：把**原始素材**交给 applyTotalFloor，由它自己决定"哪些还没结算过"。
+				   逐条计价、峰谷判定（按每条自己的 at）、overflow 兜底、队友增量、欠账补算
+				   全在那一个函数里 —— 这里不再做任何重算，也不再有锁定基准与差值修正。 */
+				const held = applyTotalFloor(src.totalHold, src.sessionId, {
+					calls: calls,
+					fallbackModel: fallbackModel,
+					overflow: overflow,
+					subCost: subCost,
+					tokens: mergedTokens,
+					models: src.models,
+					displayCurrency: symbolCurrency,
+					defaultCurrency: src.defaultCurrency
+				});
 				return {
 					id: id,
-					/* 算不出价（本会话与队友都没价）时给横杠：与"这笔真的是 0"区分开 */
-					text: t("f_cost", { symbol: symbol, cost: priced === true || subCost > 0 ? costText(grand) : "-" }),
-					/* token 计数并进总计：本会话的 + 队友的，同一个数字相加，不新增行 */
-					tip: tokensTip(mergeTokenParts(sessionTokenParts(src.usage), sub), t("f_tokensTotal"), t)
+					/* 一条都算不出价（本会话与队友都没价）时给横杠：与"这笔真的是 0"区分开 */
+					text: t("f_cost", { symbol: symbol, cost: held.cost === null ? "-" : costText(held.cost) }),
+					/* token 计数并进总计：本会话的 + 队友的，同一个数字相加，不新增行；
+					   条形图里队友那部分单独成块画在左边（sub） */
+					tip: tokensTip(held.tokens, t("f_tokensTotal"), t, sub)
 				};
 			}
 
@@ -2868,7 +3675,7 @@ window.__ModuleLoader__.load({
 				const subTurn = subagentOf(src.subagent, "turn");
 				/* 队友这一段折到显示币种后的金额（逐桶折算，见 subagentDisplayCost） */
 				const subTurnCost = subagentCostOf(src.subagent, "turn", symbolCurrency);
-				const turnTip = tokensTip(mergeTokenParts(billableParts(turnParts), subTurn), t("f_tokensTurn"), t);
+				const turnTip = tokensTip(mergeTokenParts(billableParts(turnParts), subTurn), t("f_tokensTurn"), t, subTurn);
 				/* 「本轮」同轮内只增不减（用户实测要求）：把这次的金额过一遍粘性下限。
 				   窗口起点在一轮内可能移动（父会话日志多一条 user/message、折叠出的最早时间戳变化、
 				   host 收敛起点），窗口一变数字就会小一截；这里把已经显示过的最大值兜住，
@@ -2995,12 +3802,19 @@ window.__ModuleLoader__.load({
 				const balSymbol = balance.isPercent === true || isCredits === true
 					? ""
 					: currencySymbol(balance.currency !== undefined && balance.currency !== null ? balance.currency : src.currency);
-				/* 积分口径：只有一个总积分，没有「充值 / 赠金」构成可展开 ⇒ 不给 tip。
-				   段没有 tip 就不会被渲染成可点击项（渲染处按 tip !== null 决定 className
-				   与 onClick），所以气泡点不开、悬停也不弹 —— 这正是要的：
-				   弹一个只有标题、没有任何内容的空气泡只会让人以为还能点。 */
+				/* 积分口径：段只显示总积分；**宿主给了非空 rewards 时**才生成「积分套餐」气泡
+				   （kind:'credits'，每个套餐一行 + 一条已用进度条，面板外壳与令牌面板同一套样式）。
+				   rewards 为空 / 缺字段 / 旧插件 → 照旧不给 tip：没有可展开的内容，
+				   弹一个只有标题的空气泡只会让人以为还能点。 */
 				if (isCredits === true) {
-					return { id: id, text: t("f_balance", { symbol: balSymbol, amount: balance.total }) };
+					const creditsText = t("f_balance", { symbol: balSymbol, amount: balance.total });
+					const panel = creditsView(balance.rewards, balance.total, t);
+					if (panel.rewards.length === 0) return { id: id, text: creditsText };
+					return {
+						id: id,
+						text: creditsText,
+						tip: { kind: "credits", title: t("tipCreditsTitle"), panel: panel }
+					};
 				}
 				/* 分隔线换成色条，两种情况各一套：
 				   金额余额（DeepSeek 等）= 充值 : 赠金，按金额占比分两段（紫 / 蓝）；
@@ -3086,8 +3900,9 @@ window.__ModuleLoader__.load({
 			 * 两条不依赖官方构建 hash 的要点：
 			 *   1. 用 .dsb-root 认自己，而不是官方组件的类名（hash 会随 DSH 更新变，2.0.10 踩过）；
 			 *   2. 自己带标记与“后代里带标记”都要判 —— :has() 只看后代，漏掉前者会把自己的行也藏掉。
-			 * 整条规则挂在 html.dsb-on 上：设置页取消勾选「启用状态栏」后这个类会被摘掉，
-			 * 官方原本的统计行与上下文按钮随即恢复（不然关掉插件只剩一片空白）。 */
+			 * 整条规则挂在 html.dsb-on 上：这个类由插件挂载/卸载时增删（设置页里
+			 * **没有**「启用状态栏」开关，别按那个理解）。卸下后官方原本的统计行与
+			 * 上下文按钮随即恢复（否则关掉插件只剩一片空白）。 */
 			'html.dsb-on [data-slot="conversation.composer.dock"] > *:not(.dsb-root):not(:has(.dsb-root)){display:none !important}',
 			/* 官方新版在输入卡片下方右侧另有一个上下文占用按钮：已被本插件的圆环接管，藏掉它。
 			 * 用 aria-label 认它（中文含"上下文"、英文含"context used"，随语言变），不碰官方 hash 类名。 */
@@ -3114,8 +3929,35 @@ window.__ModuleLoader__.load({
 			"@media (prefers-reduced-motion: reduce){.dsb-ring-running .dsb-ring-fill{animation:none}}",
 			".dsb-ring-error .dsb-ring-fill{stroke:#ef4444}",
 			".dsb-ring-approval .dsb-ring-fill{stroke:#f59e0b}",
+			/* 条形图恢复原设计：**段与段之间 1px 间隔（gap:1px）+ 分段 1px 圆角**。
+			   曾试过「段内 1px 透明右边框 + background-clip:padding-box」来固定间隔，但边框算在段宽内，
+			   0.76% / 0.29% 这种亚像素小段会被整段吃掉、直接看不见（实测紫/蓝段消失）—— 已回退。
+			   间隔 1–2px 的观感差异是小数百分比宽度 + 像素取整造成的，不再用会吞掉小段的办法去「修」。
+			   整条外框圆角与裁切仍由 .dsb-bar 的 border-radius + overflow:hidden 负责。 */
 			".dsb-bar{display:flex;gap:1px;height:4px;border-radius:999px;background:var(--dsw-alias-interactive-bg-hover,rgba(127,127,127,.15));overflow:hidden;margin:6px 0 2px}",
-			".dsb-bar-seg{flex:none;min-width:2px;height:100%;border-radius:1px;background:var(--dsw-alias-label-tertiary)}",
+			/* 段宽是「各段占比 %」：允许收缩（flex:0 1 auto），否则小数百分比取整后总宽略超 100% 会被
+			   `.dsb-bar` 的 overflow:hidden 从**右侧**裁掉小段。**不设最小宽度**（用户拍板去掉 2px 保底）：
+			   极小段可能不足 1px、由浏览器自行渲染或直接看不见，这是预期 —— 精确比例以面板里那三行数字为准。
+			   圆角 999px：条高只有 4px，浏览器会把半径夹到半高，所以每段两端都是完整半圆（胶囊头），
+			   不会出现任何竖直直边 —— 未放大时也是圆的。 */
+			".dsb-bar-seg{flex:0 1 auto;min-width:0;height:100%;border-radius:999px;background:var(--dsw-alias-label-tertiary)}",
+			/* 令牌条里「子代理·命中」那一段：与活跃总览柱状图的高峰段同一处理（75% 灰）。
+			   只有命中这一档的浅色子段用这个类；子代理未命中 / 输出仍用正常主色（行内 background-color 长写）。 */
+			".dsb-bar-sub{background:color-mix(in srgb,var(--dsw-static-neutral-bluish-400) 75%,transparent)}",
+			/* 工具调用彩条的悬停动效：鼠标移到某一段时该段轻微纵向放大，像从条上凸起一块。
+			   平时 .dsb-bar 仍是 overflow:hidden（保住两端的圆角裁切）；工具彩条这个类放开裁切，
+			   否则 4px 高的段放大会被条上下切平，看不出"凸起"。scaleY(1.45) 后约 6px（用户要求放大倍率收窄）。
+			   圆角沿用 999px：放大后仍是完整胶囊头（左右两端是半圆），不会变成直角方块。
+			   ::before 是**透明的放大判定区**：上下各外扩 7px（用户要求上下判定范围放宽），
+			   鼠标在条上方/下方几个像素内也算悬停到这一段；左右不越界，不会抢相邻段的判定。
+			   transition 用缓出曲线、时长稍长，段与段之间的放大/复原更顺滑。 */
+			".dsb-bar-hoverable{overflow:visible}",
+			".dsb-bar-hoverable .dsb-bar-seg{position:relative;transition:transform .2s cubic-bezier(.16,1,.3,1)}",
+			".dsb-bar-hoverable .dsb-bar-seg::before{content:\"\";position:absolute;left:0;right:0;top:-7px;bottom:-7px}",
+			".dsb-bar-hoverable .dsb-bar-seg:hover{transform:scaleY(1.45);z-index:2}",
+			/* 工具彩条的悬停提示：**不要气泡、也不要阴影**，只显示一行文字（比 10px 的悬停浮层大、
+			   但小于 12px 的标题）。位置由 JS 给 left/top，贴在鼠标上方很近处。 */
+			".dsb-hover-plain{position:fixed;z-index:41;pointer-events:none;white-space:nowrap;font-size:11px;line-height:15px;font-weight:500;color:var(--dsw-alias-label-primary);font-variant-numeric:tabular-nums}",
 			/* 宽度按内容自适应：width:max-content 让气泡收到"最长那一行"的宽度，
 			 * 行内标签与数值之间至少留 5ch（.dsb-meter-value 的 padding-left），所以不会出现大片留白；
 			 * 内容超过 max-width 时退回换行（white-space:normal）。 */
@@ -3142,6 +3984,21 @@ window.__ModuleLoader__.load({
 			/* 两列面板里的行：标签与数值之间至少留 5ch（工具调用那个子视图另有一条更紧的覆盖，
 			   见 .dsb-meter-tight），其余行在这个宽度里右对齐。 */
 			".dsb-meter-value{margin-left:auto;padding-left:5ch;color:var(--dsw-alias-label-primary);font-variant-numeric:tabular-nums}",
+			/* 手动调用 / 手动压缩的星号：做成上标（像 X² 的 ²），不是普通的星号字符。
+			   .7em 收小、vertical-align:super 抬到基线以上；line-height:0 防止把行盒撑高
+			   （行高 18px 是按字体度量算好的，多 1px 同排的行就会错位）。 */
+			".dsb-sup{font-size:.7em;line-height:0;vertical-align:super;margin-left:1px}",
+			/* 积分套餐列表：同一屏最多显示 5 个套餐块，超出就往下滑。高度按单块 37px 推算：
+			   .dsb-credit 上下 padding 2+1=3px + .dsb-meter-row（line-height 18 + padding 1+3=4 → 22px）
+			   + .dsb-bar（height 4 + margin 6+2=8 → 12px）= 37px；5 块 = 185px。
+			   **改块内间距/行高时要同步这个数**。下钻子视图复用同一个类，因此同样最多 5 块可滚。
+			   **滚动条隐藏但保留滚动**：气泡很窄，常驻滚动条会挤掉内容宽度；
+			   Firefox/旧 Edge 用 scrollbar-width:none / -ms-overflow-style:none，
+			   WebKit/Chromium 用下面那条 ::-webkit-scrollbar。 */
+			".dsb-credits-list{max-height:calc(5 * 37px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none}",
+			".dsb-credits-list::-webkit-scrollbar{display:none}",
+			/* 积分套餐的单块：上面一行「包名/备注 + 已用/总量」，下面一条进度 */
+			".dsb-credit{display:flex;flex-direction:column;padding:2px 0 1px}",
 			/* 工具调用子视图：名字短、列多，5ch 太占宽度，收到 1ch */
 			".dsb-meter-tight .dsb-meter-value{padding-left:1ch}",
 			/* 可点行（会话数据那几行）：光标 + 悬停底色，跟设置页那些可点项同一套反馈。
@@ -3149,13 +4006,28 @@ window.__ModuleLoader__.load({
 			   上下内边距跟 .dsb-meter-row 保持一致（1/3），可点与不可点的行文字才不会错位。 */
 			".dsb-meter-row-click{cursor:pointer;margin:0 -4px;padding:1px 4px 3px;border-radius:999px}",
 			".dsb-meter-row-click:hover{background:var(--dsw-alias-interactive-bg-hover,rgba(127,127,127,.1))}",
+			/* 积分套餐的聚合行：只要 cursor:pointer，**不要**上面那个悬停灰底（用户拍板）。
+			   走独立修饰类，不碰「会话数据」那些可点行的悬停样式。 */
+			".dsb-meter-row-plain{cursor:pointer}",
 			/* 子视图标题就是返回入口：不加返回箭头，悬停变亮 */
 			".dsb-meter-back{cursor:pointer}",
 			".dsb-meter-back:hover{color:var(--dsw-alias-label-secondary)}",
 			/* 子视图列表分列：每列最多三行（由 listColumns 决定），每列自己两列对齐。
-			   列多到一排放不下就折到下一排；兜底再压一道高度上限，不越过屏幕可用高度的一半。 */
-			".dsb-meter-cols{flex-direction:row;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:6px 16px;max-height:calc(50vh - 46px);overflow-y:auto;overscroll-behavior:contain}",
-			".dsb-meter-col{display:flex;flex-direction:column}",
+			   **绝不折行**（用户拍板）：`flex-wrap:nowrap` 让所有列排成一排，一排放不下时由
+			   横向滚动兜底（`overflow-x:auto`），而不是折到下一排 —— 折行会让"第二排只有一两列、
+			   右边一大片空白"，用户明确禁止。优先级链：先加每列行数（列数随之变少）直到放得下，
+			   只有 12 行仍放不下才真的滚动（判定见 toolColumnsOverflow / nextToolRows）。
+			   宽度方向：气泡是 `width:max-content`，列数少了宽度自然跟着收窄（"理解 B"：
+			   宽度 = 加完行数之后刚好不折的那个宽度，不许停在加行之前的旧宽度）。
+			   **必须自带 display:flex**：这个类是从块级堆叠变成横向排布的那一步 ——
+			   少了它，各列会被当成块级元素上下叠成一段（实测踩过）。
+			   滚动条隐藏但保留滚动：沿用 .dsb-credits-list 那套写法（见下方 ::-webkit-scrollbar）。 */
+			".dsb-meter-cols{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:flex-start;align-items:flex-start;gap:6px 16px;max-height:calc(50vh - 46px);overflow-x:auto;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none}",
+			".dsb-meter-cols::-webkit-scrollbar{display:none}",
+			/* 每列**不收缩**（flex:none）：容器放不下时 flex 默认会先把列压扁（flex-shrink:1），
+			   那等于用"挤扁内容"替代折行 —— 同样是用户禁止的坏形态，而且会让"是否溢出"的
+			   判定失真。列保持自身内容宽度，放不下就交给上面的横向滚动。 */
+			".dsb-meter-col{display:flex;flex-direction:column;flex:none}",
 			".dsb-tip.dsb-meter-wide{max-width:min(880px,100vw - 24px)}",
 			/* 活跃总览：标题 → 分隔线 → 数值行 → 左边柱状图 + 右边当月活跃度 */
 			".dsb-week{display:flex;flex-direction:column;gap:4px}",
@@ -3213,9 +4085,9 @@ window.__ModuleLoader__.load({
 			".dsb-tip.dsb-hovercard .dsb-meter-rows{margin-top:2px}",
 			".dsb-tip.dsb-hovercard .dsb-meter-row{padding:0;gap:4px}",
 			".dsb-tip.dsb-hovercard .dsb-meter-figures{font-weight:400;padding-left:5ch}",
-			/* 柱的悬停：::before 只负责把热区左右各撑 2px（透明、看不见），
-			   ::after 才是变灰反馈，left/right 都是 0 —— 严格不超出柱身那 5px。
-			   同样由 JS 状态驱动，用 :hover 的话划过柱间缝隙会一闪一闪。 */
+			/* 柱的悬停：::before 只负责把热区左右各撑 2px（透明、看不见）；
+			   变灰反馈由下面的 `.dsb-day-active .dsb-day-track` 画（JS 状态加类，
+			   严格不超出柱身那 5px）。用 :hover 的话划过柱间缝隙会一闪一闪。 */
 			".dsb-day{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;width:5px}",
 			/* 热区：左右各撑 2px，透明看不见（让鼠标不会掉进柱间 4px 的缝） */
 			".dsb-day::before{content:\"\";position:absolute;left:-2px;right:-2px;top:0;bottom:0;border-radius:3px}",
@@ -3343,7 +4215,6 @@ window.__ModuleLoader__.load({
 			   又排在后面，会把高度覆盖回去（实测踩过：用户看到"又变高了"）。
 			   自定义模型的名称框走通用规则，保持 28px。 */
 			".dsb-settings .dsb-field input[type=text],.dsb-settings .dsb-field input[type=number]{width:52px;height:24px;text-align:right}",
-			".dsb-settings input[type=number]{text-align:right}",
 			".dsb-settings input[type=number]::-webkit-outer-spin-button,.dsb-settings input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}",
 			".dsb-settings input[type=number]{-moz-appearance:textfield;appearance:textfield}",
 			".dsb-settings input::placeholder{color:var(--dsw-alias-label-tertiary);opacity:.5}",
@@ -3371,6 +4242,20 @@ window.__ModuleLoader__.load({
 			".dsb-settings .dsb-star-wrap:hover .dsb-star-tip,.dsb-settings .dsb-star-wrap:focus-within .dsb-star-tip{visibility:visible;opacity:1}",
 			/* 导航项后面的「发现新版本」胶囊：细描边圆角胶囊 + 次级文字色，字号刻意比导航文字小一档 */
 			".dsb-nav-pill{box-sizing:border-box;margin-left:4px;padding:0 5px;border:1px solid var(--dsw-alias-separator-primary,rgba(127,127,127,.3));border-radius:999px;font-size:8px;line-height:1.4;font-weight:400;color:var(--dsw-alias-label-secondary);white-space:nowrap}",
+			/* 开发模式**不给可见开关**：入口是页脚版本号的「连点 5 次」。
+			   胶囊做成标题的上标角标（像 x² 的那个 2）：
+			     · 行内 flex + 靠左对齐 → 胶囊紧跟着标题文字，不甩到面板最右；
+			     · align-items:flex-start → 胶囊浮在标题文字的右上角，而不是垂直居中。
+			   三个刻意的取值：
+			     · font-size 与「发现新版本」那枚导航胶囊**逐字一致**（都走 .dsb-nav-pill 的 8px），
+			       所以这里不覆盖字号 —— 覆盖过一次（10px）就显得比导航那枚大，两处观感不统一。
+			     · **不做负 margin-top**：父级 .dsb-head 是纵向 flex，把胶囊往上顶出容器会被裁掉
+			       （实测缺陷：胶囊上边框被切）。
+			     · 用 `margin-top:2px` **往下压一点**：标题是 18px、行盒有约 2px 的行距余量，
+			       胶囊要落在这段余量里，顶端才不高于标题文字的上边界。 */
+			".dsb-settings .dsb-titlerow{display:flex;align-items:flex-start;justify-content:flex-start;gap:4px}",
+			".dsb-settings .dsb-dev-pill{margin-left:0;margin-top:2px;padding:0 5px;cursor:default}",
+			".dsb-settings .dsb-version{user-select:none;-webkit-user-select:none}",
 		].join("");
 
 		/* 导航图标使用外部传入的 gauge（24x24 lucide，stroke=currentColor，随主题变色） */
@@ -3383,15 +4268,41 @@ window.__ModuleLoader__.load({
 		/* 导航项里挂「发现新版本」胶囊用：标记本插件那一项，避免胶囊文字混进文案后匹配不上。 */
 		const NAV_MARK = "data-dsb-nav";
 
-		/* 宿主上下文（apply 时存下来）：一键更新要用它的 remote 命名空间。 */
-		let pluginCtx = null;
-
 		/**
 		 * 版本自检结果 —— 导航胶囊和设置页那颗「更新」按钮共用这一份，两边同进同出。
 		 * 默认什么都没有：只有 registry 上确实更新才显示，查不到就安静地不显示。
-		 * note 是更新动作的结果：null / "done" / "failed" / "no-manager"。
+		 * note 是更新动作的结果：null / "done" / "failed"。
+		 * failedTarget 记「失败的那次试的是哪个版本」：失败态点一下退回可重试时，
+		 * 文案要回到那个版本号（而不是 last 里可能已被刷新的别的版本）。
 		 */
-		let updateState = { hasUpdate: false, latest: null, busy: false, note: null, reason: null };
+		let updateState = { hasUpdate: false, latest: null, busy: false, note: null, reason: null, failedTarget: null };
+
+		/**
+		 * 开发模式（连点版本号 5 次进入）：让作者在没有新版本的时候也能看到更新按钮的
+		 * **全部**状态与动效，用来检查「点下去有没有反馈、文案看不看得懂、失败会不会静默」。
+		 *
+		 * 打开后：
+		 *   - 按钮**常驻**显示（不看 registry 有没有新版），版本号用一个假的演示版本；
+		 *   - 每点一次，依次演示「更新中 → 已更新 → 更新失败 → 回到空闲」四种状态；
+		 *   - **绝不发安装请求**：走的是纯本地的状态机，不碰任何网络与子进程。
+		 *
+		 * 为什么不给一个可见的开关：普通用户装了这插件，界面上不该多出一个面向作者的调试项。
+		 * 入口做成「连点版本号 5 次」——记得住、够隐蔽，也不会被误触（这是常见的开发者模式手势）。
+		 * 进入后标题右侧挂一枚「开发模式」胶囊，明确告诉你当前处于这个状态；再连点 5 次退出。
+		 *
+		 * 它只影响本插件的界面，不改变任何真实配置；退出即恢复原样。
+		 */
+		let devMode = false;
+		/** 演示用的假版本号：一眼看出不是真版本，避免被误当成真实更新。 */
+		const DEV_VERSION = "9.9.9";
+		/** 演示用的假失败原因，走的就是真实失败时那条显示路径。 */
+		const DEV_FAIL_REASON = "release-age";
+		/** 「更新中」演示的时长：够看清三个点的动效，又不至于让人等。 */
+		const DEV_BUSY_MS = 2200;
+		/** 进入/退出开发模式需要连点几次版本号。 */
+		const DEV_CLICKS = 5;
+		/** 连点计数：两次点击间隔超过这个毫秒数就重新计数（否则慢慢点 5 次也会进去）。 */
+		const DEV_CLICK_WINDOW_MS = 1500;
 		const updateListeners = new Set();
 		function subscribeUpdate(fn) {
 			updateListeners.add(fn);
@@ -3413,7 +4324,13 @@ window.__ModuleLoader__.load({
 				if (has !== null && typeof has.remove === "function") has.remove();
 				return;
 			}
-			if (has !== null) { has.textContent = text; return; }
+			/* 已经挂上就只更新文字。**必须先比值**：写 textContent 即使内容一样也会
+			   替换文本节点、产生 childList 记录，而上面那个 observer 监听的正是
+			   childList+subtree —— 不比较就会「写 → 触发 → 下一帧再写」一直空转。 */
+			if (has !== null) {
+				if (has.textContent !== text) has.textContent = text;
+				return;
+			}
 			const pill = document.createElement("span");
 			pill.className = "dsb-nav-pill";
 			pill.textContent = text;
@@ -3436,38 +4353,223 @@ window.__ModuleLoader__.load({
 				.catch(() => null);
 		}
 
-		/** 从安装结果里抠出失败原因；拿不到就给空串。 */
+		/** 从更新结果里抠出人能看懂的原因；拿不到就给空串。 */
 		function reasonOf(result) {
 			const raw = result === null || result === undefined ? null : result.reason;
 			return typeof raw === "string" && raw.length > 0 ? raw : "";
 		}
 
 		/**
-		 * 一键更新：调 DSH 官方的插件安装接口（和插件管理页同一条路，内部跑 pnpm）。
-		 * 装完由 DSH 自己接管生效；客户端这半边是旧代码，得刷新页面才是新的。
+		 * 客户端侧失败上报：把「浏览器里到底怎么失败的」写成一条日志交给 host。
+		 *
+		 * 宿主侧失败它自己会记（`update: 结果 {...}`），但**客户端**这边的失败
+		 * （fetch 被代理拦、响应解不出来、网络断）宿主完全看不见 —— 用户点完只看到
+		 * 「更新失败」，日志里没有任何痕迹，想拿日志问 AI 也无从下手。
+		 *
+		 * 只发诊断字段、不改任何状态；任何异常都静默（日志补不上不能连累界面）。
+		 */
+		function reportUpdateFailure(info) {
+			try {
+				window.fetch(UPDATE_FAILURE_URL, {
+					method: "POST",
+					headers: { "content-type": "application/json" },
+					body: JSON.stringify(info)
+				}).catch(() => { /* 静默 */ });
+			} catch (error) {
+				/* 静默 */
+			}
+		}
+
+		/**
+		 * 一键更新：调**本插件自己的** host 路由，由它自己跑 pnpm 把新版本装上。
+		 *
+		 * 为什么不用 DSH 官方的 `ctx.remote.pluginManager.installBundle`：
+		 *   1. 那个服务由「插件管理器」这个**别的插件**提供。没装它的 profile 上，
+		 *      读 `ctx.remote` 会直接抛错（DSH 的依赖注入对未声明服务就这个行为），
+		 *      异常冒出 onClick 没人接 —— 界面表现就是「点了完全没反应」。
+		 *   2. 它跑裸 `pnpm add pkg@版本`，会被 pnpm 11 的 24 小时发布年龄策略拦下
+		 *      （报 NO_MATURE_MATCHING_VERSION），新版本刚发布时装不上。
+		 *
+		 * 所以更新必须由插件自己完成：host 端先把这个精确版本写进 profile 的
+		 * `minimumReleaseAgeExclude` 放行，再用精确版本安装。
+		 *
+		 * **装完要重启 DSH，光刷新页面不生效**：插件包元数据（含 client.js 的 revision）
+		 * 在 DSH 里「缓存至重启」（见 dsh-client-modules 的说明），刷新只会重新拉同一份
+		 * 旧 bundle。官方插件管理器也是这个口径（「已安装，下次启动后加载」）。
+		 * 按钮文案据此提示重启，而不是刷新。
 		 */
 		function startPluginUpdate() {
-			const remote = pluginCtx === null || pluginCtx === undefined ? null : pluginCtx.remote;
-			const manager = remote === null || remote === undefined ? null : remote.pluginManager;
-			/* 官方桌面端一定带插件管理器；真取不到就按失败处理，不另开一个用户看不懂的分支 */
-			if (manager === null || manager === undefined || typeof manager.installBundle !== "function") {
-				setUpdateState({ busy: false, note: "failed", reason: null });
-				return;
-			}
+			/* 开发模式下只演示：不真实安装（见 runDevPreview） */
+			if (devMode === true) { runDevPreview(); return; }
 			if (updateState.latest === null || updateState.busy === true) return;
 			const target = updateState.latest;
-			setUpdateState({ busy: true, note: null, reason: null });
-			Promise.resolve(manager.installBundle(
-				"dsh-desktop-statusbar@" + target,
-				{ requestId: "dsh-desktop-statusbar-" + String(Date.now()) }
-			)).then((result) => {
-				const ok = result !== null && result !== undefined && result.ok === true;
-				setUpdateState({ busy: false, note: ok ? "done" : "failed", reason: ok ? null : reasonOf(result) });
-			}).catch(() => {
-				setUpdateState({ busy: false, note: "failed", reason: null });
-			});
+			/* 失败时记下"这个版本已经试过了"：按钮点一下回到可重试文案时要用它。 */
+			setUpdateState({ busy: true, note: null, reason: null, failedTarget: null });
+			const startedAt = Date.now();
+			/* 失败收敛到一处：状态 + 日志。三条失败路径（响应解不出 / 应答 ok:false / 网络异常）
+			   都走这里，保证每一条都在日志里留下同样的字段。 */
+			const fail = (reason, extra) => {
+				const info = Object.assign({
+					reason: reason,
+					target: target,
+					current: VERSION,
+					at: Date.now(),
+					elapsedMs: Date.now() - startedAt
+				}, extra === undefined ? {} : extra);
+				reportUpdateFailure(info);
+				setUpdateState({ busy: false, note: "failed", reason: reason, failedTarget: target });
+			};
+			window.fetch(SELF_UPDATE_URL, {
+				method: "POST",
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify({ version: target })
+			}).then((response) => {
+				/* fetch 对 4xx/5xx 是 **resolve** 不是 reject：必须自己看状态码，
+				   否则 403（跨站防护）/ 409（正在更新）/ 500 都会被当成"响应解不出来"。 */
+				if (response.ok !== true) {
+					fail("http-error", { stage: "request", httpStatus: response.status });
+					return null;
+				}
+				return response.json();
+			})
+				.then((payload) => {
+					/* null 有两种来源：上面的 HTTP 错误（已处理过）或 JSON 解析失败 */
+					if (payload === null || payload === undefined) return;
+					const ok = payload.ok === true;
+					if (ok === true) {
+						setUpdateState({ busy: false, note: "done", reason: null, failedTarget: null });
+						return;
+					}
+					/* 宿主明确回了失败原因（release-age / verify-failed / pnpm-failed…）：
+					   宿主自己已经记过日志，这里补的是"客户端看到的那一份"，两边能对上。 */
+					fail(reasonOf(payload), { stage: "host", detail: JSON.stringify(payload).slice(0, 300) });
+				})
+				.catch((error) => {
+					const detail = error !== null && error !== undefined && typeof error.message === "string"
+						? error.message
+						: String(error);
+					fail("network", { stage: "request", detail: detail });
+				});
+		}
+
+		/**
+		 * 开发模式下的一次点击：纯本地状态机，走完「更新中 → 已更新 → 更新失败 → 空闲」。
+		 *
+		 * 用真的 setUpdateState / 真的渲染分支，所以看到的动效、文案、按钮禁用行为
+		 * 与真实更新**完全一致**；唯一的区别是不发请求、不安装。
+		 */
+		function runDevPreview() {
+			const phase = updateState.note;
+			if (updateState.busy === true) return;
+			if (phase === null) {
+				/* ① 更新中：亮起那三个点 */
+				setUpdateState({ busy: true, note: null, reason: null, latest: DEV_VERSION });
+				devTimer = setTimeout(() => {
+					devTimer = null;
+					/* ② 已更新 */
+					setUpdateState({ busy: false, note: "done", reason: null });
+				}, DEV_BUSY_MS);
+				return;
+			}
+			if (phase === "done") {
+				/* ③ 更新失败：走真实失败那条显示路径 */
+				setUpdateState({ busy: false, note: "failed", reason: DEV_FAIL_REASON });
+				return;
+			}
+			/* ④ 回到空闲，可以再点一遍 */
+			setUpdateState({ busy: false, note: null, reason: null, latest: DEV_VERSION });
+		}
+
+		/** 开发模式里「更新中」那一步的定时器；退出开发模式或卸载时要清掉。 */
+		let devTimer = null;
+
+		/**
+		 * 「更新失败」那一态下点按钮：**只把状态退回可重试，不直接重试**。
+		 *
+		 * 用户原话：「"更新失败"还能点啊，点完就回到，更新X.X.X版本这个按钮，
+		 * 然后用户就会再点一次更新来重试更新。」
+		 * ——所以这里是"点一下退回去、再点一下才真装"，不是"点一下就重装"：
+		 * 前者用户看得见自己点过了、也能先确认网络/版本再动手；后者会让人以为
+		 * 按钮没反应（毕竟失败→重装→再失败 的往返太快）。
+		 *
+		 * 退回后的文案是「更新到 X.X.X 版本」，那个版本号取失败时记下的 failedTarget
+		 * （比 updateState.latest 更可靠：latest 若被后台刷新改掉，文案会跳到别的版本）。
+		 */
+		function dismissUpdateFailure() {
+			const target = updateState.failedTarget === null || updateState.failedTarget === undefined
+				? updateState.latest
+				: updateState.failedTarget;
+			setUpdateState({ busy: false, note: null, reason: null, latest: target, failedTarget: null });
+		}
+
+		/**
+		 * 更新按钮的点击入口：按当前状态分派。
+		 *   · 失败态 → 只退回可重试（不重试，见 dismissUpdateFailure）
+		 *   · 其余   → 真的发起一次更新
+		 * 更新中（busy）按钮本来就是 disabled，走不到这里。
+		 */
+		function onUpdateClick() {
+			if (updateState.note === "failed") {
+				dismissUpdateFailure();
+				return;
+			}
+			startPluginUpdate();
+		}
+
+		/** 开发模式当前是否开着（给测试与自检读）。 */
+		function isDevMode() {
+			return devMode;
+		}
+
+		/**
+		 * 开关开发模式。
+		 * 打开时把状态摆成「有新版本可更新」的样子（但版本号是假的一眼可辨），
+		 * 关闭时清掉定时器并恢复成「没有更新」。
+		 */
+		function setDevMode(on) {
+			devMode = on === true;
+			if (devTimer !== null) { clearTimeout(devTimer); devTimer = null; }
+			if (devMode === true) {
+				setUpdateState({ hasUpdate: true, latest: DEV_VERSION, busy: false, note: null, reason: null });
+			} else {
+				/* 关掉时**同步**把演示相关状态一次清干净：忙碌态、结论、演示版本、按钮可见性。
+				   这几项都先落到「没有更新」，再去问真实的 registry 结果 —— 反过来（先等网络）
+				   会让按钮在关掉之后还多显示一会儿，看起来像没关掉。
+				   清 busy 尤其必要：演示可能正停在「更新中」，只撤按钮不撤 busy，
+				   界面会留在一个永远转下去的「正在更新中」。 */
+				setUpdateState({ hasUpdate: false, latest: null, busy: false, note: null, reason: null });
+				loadUpdateFlag().then((result) => {
+					if (result !== null) setUpdateState(result);
+				});
+			}
+		}
+
+		/**
+		 * 版本号被点了一下：连点 DEV_CLICKS 次进入（或退出）开发模式。
+		 *
+		 * 为什么用「连点」而不是一个可见开关：普通用户装了这插件，界面上不该多出
+		 * 一个面向作者的调试项。连点是常见的开发者模式手势，记得住、不会被误触。
+		 * 两次点击间隔超过 DEV_CLICK_WINDOW_MS 就重新计数 —— 否则慢慢点 5 次也会进去。
+		 *
+		 * @returns {object} 供测试断言的计数快照
+		 */
+		function onVersionClick() {
+			const now = Date.now();
+			if (devClickAt !== 0 && now - devClickAt > DEV_CLICK_WINDOW_MS) devClickCount = 0;
+			devClickAt = now;
+			devClickCount += 1;
+			if (devClickCount >= DEV_CLICKS) {
+				devClickCount = 0;
+				devClickAt = 0;
+				setDevMode(devMode !== true);
+			}
+			return { count: devClickCount, on: devMode };
 		}
 
+		/** 连点计数与最近一次点击时刻。 */
+		let devClickCount = 0;
+		let devClickAt = 0;
+
 		/**
 		 * 把设置导航里本插件那一项的前导图标换成 gauge。
 		 * 定位方式是按导航文案匹配（DSH 没给导航项留 id 属性），匹配不到就什么都不做。
@@ -3505,10 +4607,13 @@ window.__ModuleLoader__.load({
 			observer.observe(document.body, { childList: true, subtree: true });
 			/* 版本状态一变就重挂一次胶囊：查完发现没新版（撤掉）、或有新版（挂上） */
 			const stopWatch = subscribeUpdate(apply);
-			/* 启动自检一次。卸载之后结果才到的话直接丢弃，别再往 DOM 里塞东西。 */
+			/* 启动自检一次。卸载之后结果才到的话直接丢弃，别再往 DOM 里塞东西。
+			   开发模式期间也要丢弃：它是模块级开关，用户可能在这次网络请求返回前就连点
+			   进去了，此时真实结果会把演示状态冲掉 —— 胶囊还在、按钮却没了。 */
 			let alive = true;
 			loadUpdateFlag().then((result) => {
 				if (alive !== true || result === null) return;
+				if (devMode === true) return;
 				setUpdateState(result);
 			});
 			return () => {
@@ -3546,7 +4651,6 @@ window.__ModuleLoader__.load({
 			const t = props.t;
 			const useProjection = props.useProjection;
 			const useSession = props.useSession;
-			const useSessions = props.useSessions;
 			const sessionId = props.sessionId;
 			const cfg = useConfig();
 
@@ -3596,7 +4700,20 @@ window.__ModuleLoader__.load({
 					method: "POST",
 					headers: { "content-type": "application/json" },
 					body: JSON.stringify({ models: models })
-				}).catch(() => { /* 上报失败不影响底栏 */ });
+				}).then((response) => {
+					/* 失败要说出来。原先只有 `.catch(() => {})`，而 fetch 对 4xx/5xx 是
+					   **resolve** 不是 reject —— 上报被拒（如体积超限返回 400）时既不进
+					   catch 也没人看 response，于是用户的价目表一直送不到 host。
+					   后果分两种：**新产生**的用量会按内置官方价计费（不是用户填的价）；
+					   只在自定义表里的模型则永远算不出钱、一直留在欠费明细里。
+					   已算好的费用不受影响，也不会被改写 —— 那是既定语义。
+					   底栏本身不受影响，所以只告警、不改界面。 */
+					if (response.ok !== true) {
+						console.warn("[dsh-desktop-statusbar] 价格库上报被拒 HTTP " + String(response.status) + "，host 会继续用内置参考价给新用量记账");
+					}
+				}).catch((error) => {
+					console.warn("[dsh-desktop-statusbar] 价格库上报失败：" + String(error && error.message));
+				});
 			}, [reportedPrices]);
 
 			const running = pick(useSession, (s) => s.running, undefined);
@@ -3618,21 +4735,51 @@ window.__ModuleLoader__.load({
 			/* 「本轮」显示值的粘性下限盒子（同轮内只增不减，换轮作废）：一个可变盒子，
 			   由 lastCost 段在渲染时更新，跨渲染靠这个 ref 留住（见 applyTurnFloor）。 */
 			const lastCostHoldRef = react.useRef({ sessionId: null, turnKey: null, value: 0 });
-			/* 点开「总计」气泡时 +1：强制重拉一次队友用量（别的触发条件都带 3 秒节流） */
+			/* 「总计」的**增量式账本**（见 applyTotalFloor 的长注释）：
+			   { sessionId, seen, cost, tokens, priced, subCostSettled, debts }。
+			   一个可变盒子：段里渲染时按需把它推到最新，跨渲染靠这个 ref 留住累计值。
+			   换会话时整份状态由 applyTotalFloor 自己清空，这里不必额外处理。 */
+			const totalHoldRef = react.useRef({
+				sessionId: null, seen: new Map(), cost: 0, tokens: null,
+				priced: false, subCostSettled: 0, debts: new Map()
+			});
+			/* 点开「总计」气泡时 +1：强制重拉一次队友用量（别的触发条件都带 SUBAGENT_REFRESH_MS 节流） */
 			const [subagentTick, setSubagentTick] = react.useState(0);
 			const [tipId, setTipId] = react.useState(null);
 			const [tipPos, setTipPos] = react.useState(null);
 			/* 气泡里的下钻层：null = 根视图，数字 = 点开了第几行（会话数据那三行的子视图）。
 			   换字段、收起气泡都要清掉，否则下次打开会停在上次的子视图上。 */
 			const [tipSub, setTipSub] = react.useState(null);
+			/* 积分套餐气泡的下钻层：null = 根视图，数字 = 点开了第几个聚合行（×N 那行）。
+			   换字段 / 收起气泡 / 点标题返回都清掉，下次打开回到套餐列表。 */
+			const [creditSub, setCreditSub] = react.useState(null);
+			/* 工具调用子视图「每列几行」：默认 3 行一列；量到一排放不下（列被折到下一排）就
+			   逐档 +1（最多 12 行，见下面气泡定位那条 layout effect）。换字段 / 换子视图都重置回 3。 */
+			const [toolRows, setToolRows] = react.useState(LIST_ROWS_PER_COLUMN);
 			/* 柱 / 方块 / 每周底条的悬停浮层：内容 + 触发元素的位置（自己算 fixed 坐标） */
 			const [hoverCard, setHoverCard] = react.useState(null);
 			const [hoverPos, setHoverPos] = react.useState(null);
+			/* 工具彩条段悬停的「无气泡纯文字」内容（工具名 + 占比）；有值时只渲染一行文字 */
+			const [hoverPlain, setHoverPlain] = react.useState(null);
+			/* 纯文字提示的固定垂直位置（与气泡标题行文字居中对齐）：定位 effect 算好后存这里，
+			   段内左右移动时直接复用，保证「只左右移动、不上下移动」且不抖。 */
+			const hoverPlainTopRef = react.useRef(null);
+			/* 纯文字提示的**未缩放原始宽度**（px）：段内移动时按它算缩放比例。
+			   不能拿 getBoundingClientRect().width —— 那个节点此时已经带 `transform: scale(x)`，
+			   量到的是**缩放后**的视觉宽，再乘一次比例就会越缩越小、来回振荡（长 MCP 工具名
+			   + 窄窗时可见）。定位 effect 在还没写 transform 的那一帧量一次存这里。 */
+			const hoverPlainWidthRef = react.useRef(0);
+			/* 纯文字提示的水平夹取范围：左 = 「工具调用」标题右边界 + 1ch，右 = 色条右边界
+			   （再与视口右缘取小）。定位 effect 里算一次存这里，段内移动时复用。 */
+			const hoverPlainBoundsRef = react.useRef(null);
 			/* 当前悬停的是哪一周（用来给那条底板加深）；悬停方块/柱子时为 null */
 			const [hoverWeek, setHoverWeek] = react.useState(null);
 			/* 当前悬停的是哪一根柱（那一列的判定区变灰）；不在柱上时为 null */
 			const [hoverBar, setHoverBar] = react.useState(null);
 			const hoverRef = react.useRef(null);
+			/* 工具调用彩条悬停时「跟着鼠标走」：鼠标坐标（clientX / clientY）。
+			   仅鼠标跟随型浮层（payload.follow === true）设置；活跃总览的柱/方块不设，仍贴整个气泡上方。 */
+			const [hoverMouse, setHoverMouse] = react.useState(null);
 			const hoverTimerRef = react.useRef(null);
 			/* 收起延后一小会儿：鼠标在相邻的空位格之间横向移动会先 leave 再 enter，
 			   当场清空就会一闪一闪；紧接着的新悬停会把定时器取消掉，等于没关过。 */
@@ -3644,9 +4791,13 @@ window.__ModuleLoader__.load({
 					setHoverPos(null);
 					setHoverWeek(null);
 					setHoverBar(null);
+					setHoverPlain(null);
+					setHoverMouse(null);
 				}, 110);
 			}, []);
-			/* payload 为对象：rows 有值时弹浮层，week 有值时那条底板加深，bar 有值时那根柱的判定区变灰。
+			/* payload 为对象：rows 有值时弹浮层，plain 有值时只显示一行文字（无气泡），
+			   week 有值时那条底板加深，bar 有值时那根柱的判定区变灰。
+			   follow === true 时浮层跟着鼠标走（贴鼠标上方、水平居中）。
 			   传空表示离开判定区（延后收起，避免在相邻区域间横向移动时闪烁）。 */
 			const onHover = react.useCallback((event, payload) => {
 				if (payload === null || payload === undefined) {
@@ -3658,10 +4809,61 @@ window.__ModuleLoader__.load({
 					hoverTimerRef.current = null;
 				}
 				setHoverPos(null);
+				const pointer = event !== null && event !== undefined
+					&& typeof event.clientX === "number" && typeof event.clientY === "number"
+					? { x: event.clientX, y: event.clientY }
+					: null;
+				setHoverMouse(payload.follow === true ? pointer : null);
+				setHoverPlain(typeof payload.plain === "string" ? payload.plain : null);
 				setHoverCard(payload.rows === undefined ? null : payload.rows);
 				setHoverWeek(typeof payload.week === "number" ? payload.week : null);
 				setHoverBar(typeof payload.bar === "number" ? payload.bar : null);
 			}, [closeHoverSoon]);
+			/* 同一色段里移动：**直接写提示的 left**，不走 setState —— 跟鼠标是同一帧，
+			   不会有 React 重渲染 + layout effect 的一到两帧延迟（用户实测「不跟手」）。
+			   纯文字提示**只左右移动、上下固定**（垂直位置与气泡标题文字居中对齐，
+			   固定值由定位 effect 算好后存在 hoverPlainTopRef 里）；气泡版仍按鼠标上下跟。
+			   只在内容切换（进入另一个色段）时才走 onHover 重设位置；这里改完不触发渲染。 */
+			const onHoverMove = react.useCallback((event) => {
+				if (event === null || event === undefined) return;
+				if (typeof event.clientX !== "number" || typeof event.clientY !== "number") return;
+				const node = hoverRef.current;
+				if (node === null || node === undefined || typeof node.getBoundingClientRect !== "function") return;
+				/* 测试替身没有 style（不是真实 DOM）：直接跳过，几何本身由其它用例覆盖 */
+				if (node.style === undefined || node.style === null) return;
+				const size = node.getBoundingClientRect();
+				if (hoverPlain !== null) {
+					/* 纯文字提示：水平夹在「标题右边界 ~ 色条右边界」之间。
+					   区间放不下这段文字时（长 MCP 工具名 + 窄窗）**等比缩小到放得下**，
+					   一般情况 scale 就是 1、不做任何缩放。
+					   ⚠ 宽度必须用**未缩放**的原始宽，两个来源都行、但都不能含 transform：
+					     ① hoverPlainWidthRef（定位 effect 用 offsetWidth 存好的）；
+					     ② 现场量 node.offsetWidth（同样不含 transform）。
+					   绝不能用 getBoundingClientRect().width —— 此时节点可能已经带着
+					   transform: scale()，量到的是缩放后的视觉宽，再乘一次比例就会越缩越小。 */
+					const layoutWidth = typeof node.offsetWidth === "number" && node.offsetWidth > 0
+						? node.offsetWidth
+						: size.width;
+					const natural = hoverPlainWidthRef.current > 0 ? hoverPlainWidthRef.current : layoutWidth;
+					const scale = plainFitScale(natural, hoverPlainBoundsRef.current, window.innerWidth);
+					const shown = scale === 1 ? natural : Math.round(natural * scale);
+					const left = clampPlainLeft(event.clientX - shown / 2, shown, hoverPlainBoundsRef.current, window.innerWidth);
+					node.style.left = left + "px";
+					/* 缩放以左端为基准：left 已经按缩小后的宽度算好，transform 原点放左上角才对得上 */
+					node.style.transform = scale === 1 ? "" : "scale(" + scale + ")";
+					node.style.transformOrigin = scale === 1 ? "" : "left center";
+					/* 上下固定：沿用 title 行居中算出的 top */
+					if (hoverPlainTopRef.current !== null) node.style.top = hoverPlainTopRef.current + "px";
+				} else {
+					const left = Math.max(8, Math.min(event.clientX - size.width / 2, window.innerWidth - size.width - 8));
+					node.style.left = left + "px";
+					node.style.top = Math.max(8, event.clientY - size.height - 12) + "px";
+					node.style.transform = "";
+					node.style.transformOrigin = "";
+				}
+				/* 直径写宽度会把「贴段居中」的旧宽档带过来，鼠标跟随时让提示按内容自适应 */
+				node.style.width = "";
+			}, [hoverPlain]);
 			react.useEffect(() => () => {
 				if (hoverTimerRef.current !== null) clearTimeout(hoverTimerRef.current);
 			}, []);
@@ -3897,7 +5099,7 @@ window.__ModuleLoader__.load({
 			   跟着 scroll 收起的话，气泡会在这些时刻莫名其妙消失。 */
 			react.useEffect(() => {
 				if (tipId === null) return undefined;
-				const close = () => { setTipId(null); setTipPos(null); setTipSub(null); };
+				const close = () => { setTipId(null); setTipPos(null); setTipSub(null); setCreditSub(null); };
 				const onDocClick = (event) => {
 					if (rootRef.current !== null && rootRef.current.contains(event.target)) return;
 					close();
@@ -3912,10 +5114,6 @@ window.__ModuleLoader__.load({
 				};
 			}, [tipId]);
 
-			/* 气泡坐标：宽度由内容决定（CSS 里 width:max-content），所以只能等面板挂上再量。
-			   最左、最右那两项贴边对齐，其余跟该字段居中对齐，最后按视口左右夹住。
-			   用 layout effect 是为了在浏览器绘制前就落位，不会先闪一下再跳。
-			   anchorRef 存的是触发项节点本身，每次都重新量 —— 窗口缩放后位置才是对的。 */
 			/* 气泡坐标：宽度由内容决定（CSS 里 width:max-content），所以只能等面板挂上再量。
 			   **不设依赖数组**：下钻换子视图、数字位数变化都会改宽度，坐标必须跟着重算 ——
 			   只在 tipId 变时算的话，换子视图后会沿用上一个宽度，气泡就偏到一边去。
@@ -3936,6 +5134,17 @@ window.__ModuleLoader__.load({
 				const width = node !== null && node !== undefined && typeof node.getBoundingClientRect === "function"
 					? node.getBoundingClientRect().width
 					: 0;
+				/* 工具调用子视图：默认每列 3 行，一排放不下就逐档加行
+				   （3 → 4 → 5 …，上限 LIST_ROWS_PER_COLUMN_MAX）。只有这一套行数 ——
+				   不再有「中文/英文整行块」两套结构（见 rowsPanel 的注释）。
+				   列网格是 nowrap（绝不折行），所以"放不下"用横向溢出判（见 toolColumnsOverflow）；
+				   每加一行列数就少一档，直到一排放得下。行数一加气泡就变窄 —— 这就是用户要的
+				   "宽度 = 加完行数之后刚好不折的那个宽度"（理解 B），不会停在加行前的旧宽度上。
+				   只升不降（回退会让行数在两档之间来回跳）；换字段 / 开子视图 / 返回时都重置回 3。
+				   到 12 行仍放不下就停在 12，横向滚动兜底（不再折行）。
+				   量的是 DOM 几何，测试替身里拿不到就一律当放得下（量测函数自己兜住）。 */
+				const nextRows = nextToolRows(toolRows, toolColumnsOverflow(node));
+				if (nextRows !== toolRows) setToolRows(nextRows);
 				const centered = anchor.left + anchor.width / 2 - width / 2;
 				/* 左右两条硬约束，任何气泡都适用，而且是**对齐**不是仅仅不越界：
 				   左 —— 可见左边缘压在上下文占用那个**圆圈灰底**的左边。灰底是圆环按钮自己画的
@@ -3962,20 +5171,23 @@ window.__ModuleLoader__.load({
 					? lastSeg.getBoundingClientRect().right
 					: anchor.right;
 				const barRightIn = barRight - TIP_OUTLINE_PX;
-				/* 气泡比底栏还宽时（工具调用那种多列面板），先把宽度压到底栏跨度以内，
-				   多出来的列由 flex-wrap 折到下一排 —— 否则右边界怎么挪都会顶出去。 */
+				/* 气泡比底栏还宽时（工具调用那种多列面板），先把宽度压到底栏跨度以内 ——
+				   否则右边界怎么挪都会顶出去。
+				   **注意：多出来的列不是折到下一排**（`flex-wrap` 已是 nowrap，用户明确要求永不折行），
+				   而是由内层 `.dsb-meter-cols` 横向滚动（`overflow-x:auto`）接住；
+				   行数在 12 行以内时优先加行把列数压下来，列少了气泡自然变窄（这就是"自适应宽度"）。 */
 				const span = barRightIn - barLeft;
 				const maxWidth = span > 0 ? Math.min(span, window.innerWidth - 24) : null;
 				const maxLeft = Math.min(barRightIn - width, window.innerWidth - width - 8);
 				const left = Math.max(barLeft, Math.min(centered, maxLeft));
 				const bottom = Math.max(8, window.innerHeight - anchor.top + 6);
-				/* 诊断：这几个数会写到气泡的 data-dsb-align 上（也作为悬停提示） */
+				/* 诊断串：只用于下面回传给 host 落盘（不写进 DOM，浏览器也不显示） */
 				const align = "center left=" + left.toFixed(1) + " ring=" + barLeft.toFixed(1)
 					+ " bar=" + barRight.toFixed(1) + " anchor=" + Math.round(anchor.left) + " w=" + Math.round(width);
 				setTipPos((prev) => (prev !== null && prev.left === left && prev.bottom === bottom
-					&& prev.maxWidth === maxWidth && prev.align === align
+					&& prev.maxWidth === maxWidth
 					? prev
-					: { left: left, bottom: bottom, maxWidth: maxWidth, align: align }));
+					: { left: left, bottom: bottom, maxWidth: maxWidth }));
 				/* 诊断回传：本机打不开控制台也能核对，host 会落到 <DSH_HOME>/dsh-status-bar/tip-diag.log。
 				   只在坐标真的变了时才回传，不然每次渲染都发一遍会把日志刷满。 */
 				if (tipDiagRef.current !== align) {
@@ -3995,21 +5207,71 @@ window.__ModuleLoader__.load({
 				}
 			});
 
-			/* 悬停浮层定位：固定贴在活跃总览气泡的正上方，且左右边界与它对齐（同宽），不遮挡它 */
+			/* 悬停定位：两种情形。
+			   ① 工具调用彩条的纯文字提示（hoverPlain）—— **垂直方向固定**：与气泡标题文字居中对齐，
+			      不随鼠标上下移动；只有 left 跟着鼠标水平居中（用户拍板：只左右移动、不上下移动）。
+			      水平位置用 hoverMouse 记下的鼠标坐标（onHover 时写入）。
+			   ② 活跃总览的柱 / 方块 / 底板 —— 固定贴在气泡正上方、左右同宽。
+			   hoverMouse 由 onHover 记录；离开后由 closeHoverSoon 清空。 */
 			useTipLayout(() => {
-				if (hoverCard === null) return;
+				if (hoverCard === null && hoverPlain === null) return;
 				const node = hoverRef.current;
 				const panel = tipRef.current;
 				if (node === null || node === undefined || panel === null || panel === undefined) return;
 				if (typeof node.getBoundingClientRect !== "function" || typeof panel.getBoundingClientRect !== "function") return;
 				const size = node.getBoundingClientRect();
+				if (hoverPlain !== null) {
+					const one = hoverMouse;
+					if (one === null || one === undefined) return;
+					/* 标题行（.dsb-meter-head）的垂直中心：文字提示与它居中对齐 */
+					const head = typeof panel.querySelector === "function" ? panel.querySelector(".dsb-meter-head") : null;
+					const headBox = head !== null && head !== undefined && typeof head.getBoundingClientRect === "function"
+						? head.getBoundingClientRect()
+						: null;
+					const fixedTop = headBox === null || headBox.height <= 0
+						? Math.max(8, node.getBoundingClientRect().top)
+						: headBox.top + headBox.height / 2 - size.height / 2;
+					hoverPlainTopRef.current = fixedTop;
+					/* 水平范围：左 = 标题右边界 + 1ch；右 = **色条本身**的右边界（不是气泡右边界） */
+					const title = typeof panel.querySelector === "function" ? panel.querySelector(".dsb-meter-headline") : null;
+					const titleBox = title !== null && title !== undefined && typeof title.getBoundingClientRect === "function"
+						? title.getBoundingClientRect()
+						: null;
+					const bar = typeof panel.querySelector === "function" ? panel.querySelector(".dsb-bar") : null;
+					const barBox = bar !== null && bar !== undefined && typeof bar.getBoundingClientRect === "function"
+						? bar.getBoundingClientRect()
+						: panel.getBoundingClientRect();
+					const bounds = plainBoundsOf(titleBox, barBox, window.innerWidth);
+					hoverPlainBoundsRef.current = bounds;
+					/* 记下**未缩放**的原始宽度，段内移动时按它算比例（见 onHoverMove）。
+					   ⚠ 必须用 offsetWidth（布局宽度），**不能**用 getBoundingClientRect().width：
+					   后者含 transform。这条 effect 的依赖里有 hoverMouse（鼠标一动就变），
+					   所以它会重跑；重跑时节点上还留着上一帧写的 transform: scale(x)，
+					   用 getBoundingClientRect 量到的是缩放后的宽 → ref 被写小 → 下次更小
+					   → 悬停文字一路缩到 0.5 下限（实测自然宽 600 被写成 300）。
+					   offsetWidth 不受 transform 影响，重跑多少次都是自然宽。
+					   offsetWidth 是整数且老浏览器/替身里可能没有，取不到就退回 size.width。 */
+					const layoutWidth = typeof node.offsetWidth === "number" && node.offsetWidth > 0
+						? node.offsetWidth
+						: size.width;
+					hoverPlainWidthRef.current = layoutWidth;
+					/* 区间放不下这段文字时缩小到放得下（一般情况 scale=1，不缩） */
+					const scale = plainFitScale(layoutWidth, bounds, window.innerWidth);
+					const shown = scale === 1 ? layoutWidth : Math.round(layoutWidth * scale);
+					setHoverPos({
+						left: clampPlainLeft(one.x - shown / 2, shown, bounds, window.innerWidth),
+						top: Math.max(8, fixedTop),
+						scale: scale
+					});
+					return;
+				}
 				const box = panel.getBoundingClientRect();
 				setHoverPos({
 					left: Math.max(8, box.left),
 					top: Math.max(8, box.top - size.height - 6),
 					width: box.width
 				});
-			}, [hoverCard]);
+			}, [hoverCard, hoverPlain, hoverMouse]);
 
 			/* 主气泡收起时顺手把悬停浮层也收掉，避免它孤零零留在屏幕上 */
 			react.useEffect(() => {
@@ -4019,7 +5281,6 @@ window.__ModuleLoader__.load({
 				}
 			}, [tipId]);
 
-			/* 开关状态同步到 <html>：CSS 里那两条"藏官方底栏"的规则挂在 html.dsb-on 上。 */
 			/* 开关状态同步到 <html>：CSS 里那两条"藏官方底栏"的规则挂在 html.dsb-on 上。 */
 			react.useEffect(() => {
 				if (typeof document === "undefined" || document === null) return undefined;
@@ -4102,7 +5363,9 @@ window.__ModuleLoader__.load({
 				progress: progress, subagent: subagent,
 				/* 「本轮」同轮粘性下限的载体：sessionId/turnKey 说明"这份下限属于谁"，
 				   lastCostHold 是个可变盒子（ref 里那个对象），段里渲染时按需更新它 —— 见 applyTurnFloor。 */
-				sessionId: sessionId, lastCostTurn: subagentTurnKey, lastCostHold: lastCostHoldRef.current
+				sessionId: sessionId, lastCostTurn: subagentTurnKey, lastCostHold: lastCostHoldRef.current,
+				/* 「总计」增量式账本的载体（见 applyTotalFloor 的注释） */
+				totalHold: totalHoldRef.current
 			};
 
 			const views = [];
@@ -4133,6 +5396,9 @@ window.__ModuleLoader__.load({
 			const toggleTip = (id, event) => {
 				/* 换字段（含收起）一律回到根视图，别把上一个字段的下钻层带过来 */
 				setTipSub(null);
+				setCreditSub(null);
+				/* 工具调用子视图的行数也回到默认 3：换字段 / 重开都重新量 */
+				setToolRows(LIST_ROWS_PER_COLUMN);
 				if (tipId === id) {
 					setTipId(null);
 					setTipPos(null);
@@ -4141,7 +5407,8 @@ window.__ModuleLoader__.load({
 				/* 点开余额 / 峰谷用量：顺手重查一次（收起那一下不查），数据回来气泡自己更新 */
 				if (id === "balance" && balanceReloadRef.current !== null) balanceReloadRef.current();
 				if (id === "status" && dailyReloadRef.current !== null) dailyReloadRef.current();
-				/* 总计：队友的数字也要重取一次 —— 3 秒节流靠的是那条每秒时钟，而会话完全空闲时
+				/* 总计：队友的数字也要重取一次 —— 节流靠的是那条每秒时钟（SUBAGENT_REFRESH_MS），
+			   而会话完全空闲时
 				   它不跳（睡到下一个峰谷边界），光靠它会让数字停在旧值 */
 				if (id === "cost" && subagentReloadRef.current !== null) subagentReloadRef.current();
 				const target = event !== undefined && event !== null ? event.currentTarget : null;
@@ -4154,9 +5421,33 @@ window.__ModuleLoader__.load({
 			const tipPanelOf = (tip) => {
 				if (tip === undefined || tip === null) return null;
 				if (tip.kind === "tokens") return tokenPanel(tip.panel, tip.title, tipPos, tipRef);
+				if (tip.kind === "credits") {
+					return creditsPanel(tip.panel, tip.title, tipPos, tipRef, {
+						id: creditSub,
+						/* 点聚合行进入明细子视图；点标题返回套餐列表 */
+						open: (index) => setCreditSub(index),
+						back: () => setCreditSub(null)
+					});
+				}
 				if (tip.kind === "meter") return meterPanel(tip.meter, t, tipPos, tipRef);
 				if (tip.kind === "bars") return weekBarsPanel(tip, t, tipPos, tipRef, onHover, { week: hoverWeek, bar: hoverBar });
-				return rowsPanel(tip, tipPos, tipRef, { id: tipSub, open: setTipSub, back: () => setTipSub(null) });
+				return rowsPanel(tip, tipPos, tipRef, {
+					id: tipSub,
+					/* 打开 / 返回都把行数重置回 3：另一个子视图不该沿用上一条量出来的行数 */
+					open: (index) => {
+						setToolRows(LIST_ROWS_PER_COLUMN);
+						setTipSub(index);
+					},
+					back: () => {
+						setToolRows(LIST_ROWS_PER_COLUMN);
+						setTipSub(null);
+					},
+					rowsPerColumn: toolRows,
+					/* 工具调用彩条每段的悬停浮层（工具名 + 占比）走同一套 onHover，与柱状图互不干扰；
+					   onHoverMove 只更新鼠标坐标，让浮层在同一个色段里跟着鼠标走而不闪断。 */
+					hover: onHover,
+					hoverMove: onHoverMove
+				});
 			};
 			/* 圆环自己就是触发项：点开上下文占用面板；峰谷那两个字不带气泡 */
 			const contextTip = contextMeter === null ? null : { kind: "meter", meter: contextMeter };
@@ -4190,6 +5481,26 @@ window.__ModuleLoader__.load({
 					? [h("span", { key: "__txt" }, view.text), tipId === view.id ? tipPanelOf(tip) : null]
 					: view.text));
 			});
+			/* 工具彩条悬停：**不要气泡**，只渲染一行文字（工具名 + 占比），贴在鼠标上方。
+			   字号 11px（比悬停浮层的 10px 大、比标题 12px 小），无背景/圆角/描边。
+			   极窄区间放不下时按 plainFitScale 等比缩小（transform 不动布局，left/top 照常）。 */
+			if (hoverPlain !== null) {
+				const hoverStyle = hoverPos === null
+					? undefined
+					: (hoverPos.scale === undefined || hoverPos.scale === 1
+						? { left: hoverPos.left + "px", top: hoverPos.top + "px" }
+						: {
+							left: hoverPos.left + "px", top: hoverPos.top + "px",
+							transform: "scale(" + hoverPos.scale + ")",
+							transformOrigin: "left center"
+						});
+				children.push(h("span", {
+					className: "dsb-hover-plain",
+					key: "__hoverplain",
+					ref: hoverRef,
+					style: hoverStyle
+				}, hoverPlain));
+			}
 			/* 悬停浮层：与主气泡同一套质感，fixed 定位在触发元素上方。
 			   必须先挂上节点（此时 pos 还是 null、不给 left/bottom），
 			   layout effect 才量得到宽度并把坐标算出来 —— 否则会永远卡在"没有坐标"而不显示。 */
@@ -4259,6 +5570,26 @@ window.__ModuleLoader__.load({
 			const t = props.t;
 			const cfg = useConfig();
 			const update = useUpdateState();
+			/* 开发模式是本组件内的界面状态；它不写配置、不动真实更新。
+			   **不给它可见开关**：入口是页脚版本号的「连点 5 次」（见 onVersionClick）。
+			   进入后标题右侧挂一枚「开发模式」胶囊，这是唯一的可见迹象。 */
+			const [devOn, setDevOn] = react.useState(false);
+			/* 版本号被点击：累计连点次数，够 5 次就切换开发模式。
+			   计数与时间窗在模块级（onVersionClick），这里只负责把结果同步给 React。 */
+			const onVersionClicked = () => {
+				const state = onVersionClick();
+				setDevOn(state.on === true);
+			};
+			/* 卸载时清掉演示的定时器，并把开发模式**一并关掉**。
+			   只清定时器是不够的：devMode 是模块级变量，而 devOn 是本组件的 useState。
+			   卸载后重挂时 devOn 回到 false，devMode 若还是 true，两者就不同步了 ——
+			   界面看不见「开发模式」胶囊，更新按钮却仍显示演示版本号，点下去走
+			   startPluginUpdate 的 devMode 分支只播演示、不安装也不报错，用户无从判断。
+			   只在**真的开着**时才复位：setDevMode(false) 会顺手重查一次 registry，
+			   没开还调用等于每次卸载白打一次网络请求，并且会把已有的真实更新提示清掉。 */
+			react.useEffect(() => () => {
+				if (devMode === true) setDevMode(false);
+			}, []);
 
 			/* 自绘拖拽：全程用 pointer 事件自己跟手。不用原生 HTML5 拖拽 ——
 			   原生拖拽会话期间浏览器不给页面 wheel 事件（滚轮失灵），而且只有松手才换位。 */
@@ -4566,7 +5897,15 @@ window.__ModuleLoader__.load({
 			const sections = [];
 
 			sections.push(h("div", { className: "dsb-head", key: "__head" }, [
-				h("h2", { className: "dsb-pagetitle" }, t("sectionTitle")),
+				/* 标题那一行：开发模式开着时，标题文字右上角跟一枚胶囊 —— 像 x² 的上标那样
+				   紧贴着标题，而不是甩到面板最右边（那样看不出是「这个标题的」标记）。
+				   关着时这一行与原来**完全一样** —— 不多任何元素。 */
+				h("div", { className: "dsb-titlerow", key: "__titlerow" },
+					h("h2", { className: "dsb-pagetitle" }, t("sectionTitle")),
+					devOn === true
+						? h("span", { className: "dsb-nav-pill dsb-dev-pill", key: "__devpill", title: t("devModeHint") }, t("devModeBadge"))
+						: null
+				),
 				h("p", { className: "dsb-intro" }, t("intro"))
 			]));
 
@@ -4994,9 +6333,17 @@ window.__ModuleLoader__.load({
 						type: "button",
 						className: "dsb-action",
 						key: "__star",
-						/* window.open 会被主窗口的 setWindowOpenHandler 接住，转 shell.openExternal → 默认浏览器；
+						/* 点完**主动松开焦点**再跳转。气泡的显示条件是 `:hover` 或 `:focus-within`；
+						   点击会让按钮获得 DOM 焦点，而跳去浏览器只让**窗口**失焦、DOM 焦点还留在按钮上 ——
+						   于是 `:focus-within` 一直为真，用户关掉浏览器回来时气泡就卡住常显（实测缺陷）。
+						   blur 掉之后气泡回到只跟鼠标悬停走，行为才符合预期。
+						   window.open 会被主窗口的 setWindowOpenHandler 接住，转 shell.openExternal → 默认浏览器；
 						   noopener 只是不给新窗口留 window.opener（这里窗口本来就被拒了） */
-						onClick: () => window.open(REPO_URL, "_blank", "noopener")
+						onClick: (event) => {
+							const button = event === null || event === undefined ? null : event.currentTarget;
+							if (button !== null && button !== undefined && typeof button.blur === "function") button.blur();
+							window.open(REPO_URL, "_blank", "noopener");
+						}
 					}, t("starRepo"))
 				]),
 				h("button", {
@@ -5026,28 +6373,55 @@ window.__ModuleLoader__.load({
 						});
 					}
 				}, t("reset")),
-				/* 有新版才出现：与导航胶囊同一个来源（updateState），点它走 DSH 官方的插件安装接口。
-				   三种状态都写在按钮自己身上：空闲报版本号、更新中带动效点、失败就说「更新失败」；
-				   装完直接撤掉 —— 末尾的版本号尾标会变成新版本，不必再多一句提示。 */
-				update.hasUpdate === true && update.note !== "done"
+				/* 有新版才出现：与导航胶囊同一个来源（updateState）。
+				   点它由本插件自己的 host 端执行更新（不依赖插件管理器，也不吃 pnpm 的
+				   24 小时发布年龄限制）。三种状态都写在按钮自己身上：空闲报版本号、
+				   更新中带动效点、失败就说「更新失败」。
+
+				   **失败态仍然可点**：点一下只是退回「更新到 X.X.X 版本」，让用户看清
+				   自己点过了、可以再点一次真重试（见 dismissUpdateFailure 的说明）。
+				   唯一 disabled 的是「更新中」——那时候不能重复发起。
+
+				   **装完必须重启 DSH，刷新页面没有用** —— 这不是保守说法，是 DSH 的设计：
+				     · `@deepseek-ai/dsh-hmr` 的已知限制原文：「通过插件管理器替换已安装包版本
+				       仍需要重启。浏览器 Client 模块图保留独立的浏览器侧加载机制。」
+				     · `dsh-client-modules` 的包元数据（含 client.js 的 revision）
+				       「缓存至重启」，所以刷新只会重新拉同一份旧 bundle。
+				     · 官方插件管理器的文案也是同一口径：「已安装，下次启动后加载。」
+				   桌面宿主只提供退出能力、没有自我重启能力（`app.relaunch()` 只在开发模式
+				   的菜单里），所以这里只如实提示，不假装能替用户重启。 */
+				update.hasUpdate === true
 					? h("button", {
 						type: "button",
 						className: "dsb-action",
 						key: "__update",
 						disabled: update.busy === true,
-						onClick: startPluginUpdate
+						onClick: onUpdateClick
 					}, update.busy === true
 						? [t("updateRunning"), h("span", { className: "dsb-dots", key: "__dots" }, [
 							h("span", { key: "__d1" }, "."),
 							h("span", { key: "__d2" }, "."),
 							h("span", { key: "__d3" }, ".")
 						])]
-						: (update.note === "failed"
-							? t("updateFailed")
-							: t("updateTo", { version: update.latest === null ? "" : update.latest })))
+						: (update.note === "done"
+							? t("updateDone")
+							: (update.note === "failed"
+								? t("updateFailed")
+								: t("updateTo", { version: update.latest === null ? "" : update.latest }))))
 					: null,
-				/* 版本标记贴右、与行内底边对齐：改了客户端代码要刷新页面才生效，这行字让"跑的是哪版"一眼可见 */
-				h("span", { className: "dsb-version", key: "__version" }, "dsh-desktop-statusbar " + VERSION)
+				/* 版本标记贴右、与行内底边对齐：这行字让「现在跑的是哪一版」一眼可见 ——
+				   注意**光刷新页面看不出差别**：插件包元数据缓存至重启，刷新拿到的还是旧 bundle；
+				   要换版本必须重启 DSH，重启后这行字才会变成新号。
+
+				   它同时是**开发模式的隐藏入口**：连点 5 次进入 / 退出（见 onVersionClick）。
+				   挂在版本号上的原因：这个入口面向作者调试，普通用户的界面里不该多出
+				   任何可见元素；连点是常见手势，记得住又不会被误触。
+				   进入后的可见迹象是标题右侧那枚「开发模式」胶囊，不在这一行。 */
+				h("span", {
+					className: "dsb-version",
+					key: "__version",
+					onClick: onVersionClicked
+				}, "dsh-desktop-statusbar " + VERSION)
 			]));
 
 			return h("div", { className: "dsb-settings" }, sections);
@@ -5062,12 +6436,26 @@ window.__ModuleLoader__.load({
 		exports.__test = {
 			nextSubagentState: nextSubagentState,
 			applyTurnFloor: applyTurnFloor,
-			SUBAGENT_STATE_EMPTY: SUBAGENT_STATE_EMPTY
+			SUBAGENT_STATE_EMPTY: SUBAGENT_STATE_EMPTY,
+			/* 开发模式的驱动入口：测试要能直接触发连点、并读回状态，
+			   不然这段只存在于设置页组件里的逻辑没法离线验证。 */
+			setDevMode: setDevMode,
+			runDevPreview: runDevPreview,
+			isDevMode: isDevMode,
+			onVersionClick: onVersionClick,
+			/* 更新按钮的两个点击入口：失败态只退回可重试、其余真发起更新 */
+			onUpdateClick: onUpdateClick,
+			dismissUpdateFailure: dismissUpdateFailure,
+			DEV_VERSION: DEV_VERSION,
+			DEV_FAIL_REASON: DEV_FAIL_REASON,
+			DEV_CLICKS: DEV_CLICKS,
+			DEV_CLICK_WINDOW_MS: DEV_CLICK_WINDOW_MS
 		};
 
 		function apply(ctx) {
-			/* 存下来给「更新」按钮用：它要调 ctx.remote.pluginManager */
-			pluginCtx = ctx;
+			/* 注意：这里**不保存 ctx**。更新走本插件自己的 host 路由
+			   （见 startPluginUpdate 的说明），界面其余部分也不需要宿主上下文 ——
+			   曾经存过一份 `pluginCtx` 只写不读，已删除。 */
 			ctx.effect(installStyles, "dsh-desktop-statusbar: styles");
 			ctx.effect(() => ctx.locale.register(NS, { zh: zh, en: en }), "dsh-desktop-statusbar: locale");
 			ctx.effect(() => installNavIcon(