dsh-activity-pane 0.2.2 → 0.4.0

package/.dsh-plugin/client.js

@@ -1073,6 +1073,31 @@ function usageSummary({ uncachedInputTokens = null, cacheReadTokens = null, cach
 	return { inputTokens, cacheHitPct };
 }
 
+/** 从 sessions.list 的投影统一归一卡片统计：运行卡与最近卡共享同一口径。 */
+function statsFromProjection(projection = null, elapsedMs = null) {
+	const usage = isRecord(projection?.tokenUsage) ? projection.tokenUsage : {};
+	const sessionStats = isRecord(projection?.sessionStats) ? projection.sessionStats : {};
+	const rateTokS = Number.isFinite(sessionStats.decodeMs) && sessionStats.decodeMs > 0
+		? sessionStats.decodeTokens / (sessionStats.decodeMs / 1000)
+		: null;
+	return {
+		...runtimeStats({ elapsedMs, outputTokens: usage.outputTokens, rateTokS }),
+		...usageSummary(usage),
+	};
+}
+
+/** 统计字段按字段合并：当前值有效时优先，否则回退到上一份已知值；不合并 elapsedMs。 */
+function mergeRuntimeStats(current = null, fallback = null) {
+	const currentStats = isRecord(current) ? current : {};
+	const fallbackStats = isRecord(fallback) ? fallback : {};
+	return {
+		outputTokens: currentStats.outputTokens ?? fallbackStats.outputTokens ?? null,
+		inputTokens: currentStats.inputTokens ?? fallbackStats.inputTokens ?? null,
+		cacheHitPct: currentStats.cacheHitPct ?? fallbackStats.cacheHitPct ?? null,
+		rateTokS: currentStats.rateTokS ?? fallbackStats.rateTokS ?? null,
+	};
+}
+
 /** 需要用户行动的种类的展示文案。 */
 function pendingText(kind) {
 	return PENDING_LABELS[kind] ?? PENDING_UNKNOWN_LABEL;
@@ -1174,8 +1199,8 @@ function escapeCssString(value) {
  *  windowComplete（R-01-009/AC-06、R-01-012/AC-12 冷窗口兜底）：快照已就绪但窗口缺
  *  锚点数据（开放回合起点或可锚用户行在窗口外）时为 false——此时仍发起一次 history
  *  补读，供进度锚点与指令锚行兜底。previewFallbackNeeded 表示最近卡的快照预览
- *  不完整，同样补读一次 history（R-01-013/AC-03、AC-04）；durationFallbackNeeded 表示等待卡
- *  需要在已加载的旧 history 之后再取一次最新回合边界（R-01-009/AC-12）。 */
+ *  不完整，同样补读一次 history（R-01-013/AC-03、AC-04）；durationFallbackNeeded 表示等待卡或最近卡
+ *  需要在已加载的旧 history 之后再取一次最新回合边界（R-01-009/AC-12、R-01-013/AC-12）。 */
 function detailLoadPlan({
 	detail = {},
 	isSubagent = false,
@@ -1600,11 +1625,6 @@ function listLoadState(snapshot) {
 	return "ready";
 }
 
-/** 历史窗口：会话最后一次活动距现在不超过该毫秒数则视为"最近使用过"。 */
-const HISTORY_WINDOW_MS = 24 * 60 * 60 * 1000;
-/** 历史区最多展示的最近会话条数。 */
-const HISTORY_MAX = 20;
-
 /** 会话行是否为某主会话的直属子代理。 */
 function isSubagentRow(row, byId = {}) {
 	const id = row?.parentId;
@@ -1708,7 +1728,7 @@ function entryErrorNote(completion) {
 
 /**
  * 活动区→历史区迁移检测（R-01-010/AC-07）：上一帧活动区 id 在本帧离开活动区且出现于
- * 历史区即判定为一次迁移；彻底消失（归档、滑出历史窗口）不判定。prevActiveIds 为上一帧
+ * 历史区即判定为一次迁移；彻底消失（归档、不再被会话服务列出）不判定。prevActiveIds 为上一帧
  * 已渲染的活动区 id 集合，active/recent 为本帧派生条目。
  */
 function movedToRecentIds(prevActiveIds, active, recent) {
@@ -1724,7 +1744,7 @@ function movedToRecentIds(prevActiveIds, active, recent) {
 
 /**
  * 历史区→活动区迁移检测（R-01-010/AC-07）：上一帧历史区 id 在本帧离开历史区且出现于
- * 活动区即判定为一次反向迁移；彻底消失（归档、滑出历史窗口）不判定。prevRecentIds 为上一帧
+ * 活动区即判定为一次反向迁移；彻底消失（归档、不再被会话服务列出）不判定。prevRecentIds 为上一帧
  * 已渲染的历史区 id 集合，active/recent 为本帧派生条目。与 movedToRecentIds 镜像对称。
  */
 function movedToActiveIds(prevRecentIds, active, recent) {
@@ -1824,16 +1844,12 @@ function lastTurnDuration({ turnTimings = null, history = [] } = {}) {
 }
 
 /**
- * 构建最近历史区条目：当前非活动、且在历史窗口内最后一次活动过的**主会话**
- * （子代理是临时工作单元，不入最近历史；故需同时排除表白会话与已结束子代理），
- * 按最后活动时间从新到旧，最多 HISTORY_MAX 条。blank 会话不出现（从未用过）；
- * 归档会话不出现——原生 runtime 会立即清空对归档会话的选中，列出它只会得到
- * 一张点了回落到新会话界面的死卡。完成确认中的会话留在活动区，不入历史区；
- * 委托周期（含耗尽空窗）中的会话同样留在活动区（delegatingIds，分区不变量）。
- * 窗口候选判定用宿主列表时间（下界）；turnEnds（id → 已知回合结束时刻）驱动
- * 时间精化：条目 activityAt 取宿主列表时间与回合结束时刻的较新者（R-01-010/AC-08、AC-09）。
+ * 构建历史区条目：当前非活动的**主会话**，按最后活动时间从新到旧返回完整候选集合。
+ * 子代理是临时工作单元，不入历史区；归档、空会话、完成/错误提醒与委托周期中的会话
+ * 也不入历史区。历史区不再按时间窗口或条数截断；turnEnds（id → 已知回合结束时刻）驱动
+ * activityAt 精化（R-01-010、R-01-019）。
  */
-function buildRecent(snapshot, workspaceItems, now, windowMs = HISTORY_WINDOW_MS, detailsById = {}, archivedIds = [], completions = null, delegatingIds = null, turnEnds = null) {
+function buildRecent(snapshot, workspaceItems, now, detailsById = {}, archivedIds = [], completions = null, delegatingIds = null, turnEnds = null) {
 	const byId = isRecord(snapshot) && isRecord(snapshot.byId) ? snapshot.byId : {};
 	const ids = Array.isArray(snapshot?.ids) ? snapshot.ids : [];
 	const current = snapshot?.current ?? null;
@@ -1854,7 +1870,7 @@ function buildRecent(snapshot, workspaceItems, now, windowMs = HISTORY_WINDOW_MS
 		if (isActiveRow(row, byId, activeIds)) continue;
 		const updatedAt = Number(row.updatedAt);
 		if (!Number.isFinite(updatedAt)) continue;
-		if (updatedAt > now || now - updatedAt > windowMs) continue;
+		if (Number.isFinite(now) && updatedAt > now) continue;
 		const turnEnd = Number(mapValue(turnEnds, id));
 		const activityAt = Number.isFinite(turnEnd) ? Math.max(updatedAt, turnEnd) : updatedAt;
 		const details = mapValue(detailsById, id) ?? {};
@@ -1878,8 +1894,14 @@ function buildRecent(snapshot, workspaceItems, now, windowMs = HISTORY_WINDOW_MS
 		});
 	}
 
-	entries.sort((a, b) => b.activityAt - a.activityAt);
-	return entries.slice(0, HISTORY_MAX);
+	entries.sort((a, b) => {
+		const byActivity = b.activityAt - a.activityAt;
+		if (byActivity !== 0) return byActivity;
+		const aId = String(a.id);
+		const bId = String(b.id);
+		return aId < bId ? -1 : aId > bId ? 1 : 0;
+	});
+	return entries;
 }
 
 /** 毫秒时长的人性化短格式，例如 "47s"、"3m12s"。 */
@@ -1890,6 +1912,41 @@ function fmtElapsedMs(ms) {
 	return `${Math.floor(s / 60)}m${s % 60}s`;
 }
 
+/** 历史卡相对活动时间：按分钟、小时、天、周、月、年分级；负值返回空。 */
+function fmtRelativeAge(ageMs) {
+	if (!Number.isFinite(ageMs) || ageMs < 0) return "";
+	const minute = 60_000;
+	const hour = 60 * minute;
+	const day = 24 * hour;
+	if (ageMs < minute) return "刚刚";
+	if (ageMs < hour) return `${Math.floor(ageMs / minute)}分钟前`;
+	if (ageMs < day) return `${Math.floor(ageMs / hour)}小时前`;
+	if (ageMs < 7 * day) return `${Math.floor(ageMs / day)}天前`;
+	if (ageMs < 30 * day) return `${Math.floor(ageMs / (7 * day))}周前`;
+	if (ageMs < 365 * day) return `${Math.floor(ageMs / (30 * day))}个月前`;
+	return `${Math.floor(ageMs / (365 * day))}年前`;
+}
+
+/** 历史卡绝对活动时间：使用浏览器/宿主本地时区，当前年份省略年份，跨年补年份。 */
+function fmtAbsoluteDateTime(ts, now = Date.now()) {
+	if (ts === null || ts === undefined || now === null || now === undefined) return "";
+	try {
+		const value = Number(ts);
+		const current = Number(now);
+		const date = new Date(value);
+		const today = new Date(current);
+		if (!Number.isFinite(value) || !Number.isFinite(current) || !Number.isFinite(date.getTime()) || !Number.isFinite(today.getTime())) return "";
+		const dateOptions = { month: "2-digit", day: "2-digit" };
+		if (date.getFullYear() !== today.getFullYear()) dateOptions.year = "numeric";
+		return `${date.toLocaleDateString([], dateOptions)} ${date.toLocaleTimeString([], {
+			hour: "2-digit",
+			minute: "2-digit",
+		})}`;
+	} catch {
+		return "";
+	}
+}
+
 /** token 计数的人性化短格式，例如 "847"、"1.2k"；非有限非负时返回 null。 */
 /** token 计数紧凑缩写，镜像原生统计行 formatTokens：847 / 12.2K / 517K / 2.8M——
  *  千以下原样；K/M 档缩写值百位以上取整、不足百位保留一位小数；非法输入返回 null 不展示。 */
@@ -2128,8 +2185,12 @@ const INDENT_PX = 16;
 const MOBILE_BREAKPOINT = "767px";
 /** 运行卡时钟：只要存在运行中会话，就以该周期刷新时长显示。 */
 const CLOCK_MS = 1000;
+/** 历史卡相对时间刷新周期；无需每秒重绘整列。 */
+const RECENT_TIME_REFRESH_MS = 60_000;
 /** 冷数据读取并发池上限：慢网下避免几十张卡片的 models/history 一次性挤占通道。 */
 const LOAD_CONCURRENCY = 3;
+/** 历史分页每批数量；后续批次只由底部按钮显式加载。 */
+const RECENT_PAGE_SIZE = 10;
 /** 「回到顶部」悬浮按钮显隐阈值：scrollTop 超过该值（px）时显示（R-01-018/AC-01）。 */
 const TOP_THRESHOLD = 200;
 
@@ -2213,21 +2274,34 @@ const CSS = `
   touch-action: pan-y;
   -webkit-overflow-scrolling: touch;
   padding: 0 0 10px;
-}
-/* 滚动条仅在滚动时显示（R-01-004/AC-03，与外壳侧栏一致）：thumb 默认透明，滚动中
-   经 data-scrolling 显示。Firefox 路径必须在 @supports 门内——非 auto 的
-   scrollbar-color 会让 Chromium 丢弃该元素的 ::-webkit-scrollbar 规则。 */
+  /* Keep the native scrollbar just left of the edge handle, as in the host
+     sidebar; stable keeps the list geometry unchanged when overflow appears. */
+  margin-right: var(--dsh-scrollbar-width, 8px);
+  scrollbar-gutter: stable;
+}
+/* 滚动条在滚动或鼠标进入窗格时显示（R-01-004/AC-03，与外壳侧栏一致）：thumb 默认透明，
+   经 data-scrolling/data-pointer-inside 显示，悬停时读取主题 hover token。Firefox 路径必须在
+   @supports 门内——非 auto 的 scrollbar-color 会让 Chromium 丢弃该元素的 ::-webkit-scrollbar 规则。 */
 [data-dsh-activity-pane] .dap-scroll::-webkit-scrollbar-thumb {
   background: transparent;
 }
 [data-dsh-activity-pane] .dap-scroll[data-scrolling]::-webkit-scrollbar-thumb {
   background: var(--dsh-scrollbar-thumb, color-mix(in srgb, currentColor 25%, transparent));
 }
+[data-dsh-activity-pane][data-pointer-inside] .dap-scroll::-webkit-scrollbar-thumb {
+  background: var(--dsh-scrollbar-thumb, color-mix(in srgb, currentColor 25%, transparent));
+}
+[data-dsh-activity-pane][data-pointer-inside] .dap-scroll::-webkit-scrollbar-thumb:hover {
+  background: var(--dsh-scrollbar-thumb-hover, color-mix(in srgb, currentColor 40%, transparent));
+}
 @supports not selector(::-webkit-scrollbar) {
   [data-dsh-activity-pane] .dap-scroll { scrollbar-color: transparent transparent; }
   [data-dsh-activity-pane] .dap-scroll[data-scrolling] {
     scrollbar-color: var(--dsh-scrollbar-thumb, color-mix(in srgb, currentColor 25%, transparent)) transparent;
   }
+  [data-dsh-activity-pane][data-pointer-inside] .dap-scroll {
+    scrollbar-color: var(--dsh-scrollbar-thumb, color-mix(in srgb, currentColor 25%, transparent)) transparent;
+  }
 }
 /* 「回到顶部」悬浮图标按钮（R-01-018）：窗格内右下角圆形按钮，纯图标无文字、不透明底色；
    默认 hidden，scrollTop 超阈值时由滚动监听揭隐。基类 display:flex 会压过 UA 的
@@ -2284,6 +2358,29 @@ const CSS = `
   color: color-mix(in srgb, currentColor 52%, transparent);
   text-transform: uppercase;
 }
+/* 历史分页只在用户明确激活底部按钮后追加（R-01-019/AC-02）。 */
+[data-dsh-activity-pane] .dap-recent-more {
+  align-self: center;
+  flex: none;
+  min-width: 132px;
+  padding: 5px 10px;
+  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
+  border-radius: 6px;
+  background: color-mix(in srgb, currentColor 7%, transparent);
+  color: color-mix(in srgb, currentColor 70%, transparent);
+  font: inherit;
+  font-size: 11px;
+  line-height: 16px;
+  cursor: pointer;
+}
+[data-dsh-activity-pane] .dap-recent-more:hover,
+[data-dsh-activity-pane] .dap-recent-more:focus-visible {
+  background: color-mix(in srgb, currentColor 13%, transparent);
+  color: inherit;
+}
+[data-dsh-activity-pane] .dap-recent-more:focus-visible { outline: 2px solid color-mix(in srgb, currentColor 45%, transparent); outline-offset: 1px; }
+[data-dsh-activity-pane] .dap-recent-more[disabled] { cursor: wait; opacity: 0.6; }
+[data-dsh-activity-pane] .dap-recent-more[hidden] { display: none; }
 /* 折叠：仅桌面生效；窄条 + 竖排标题与计数（R-01-011/AC-04）。 */
 [data-dsh-activity-pane] .dap-rail {
   display: none;
@@ -2322,7 +2419,8 @@ const CSS = `
   background: rgba(46, 42, 26, 0.97);
   animation: dap-await-pulse 1.2s ease-in-out infinite;
 }
-/* 桌面拖拽调宽手柄（R-01-015）：右缘 6px 命中区，拖拽实时写入 --dap-width；
+/* 桌面拖拽调宽手柄（R-01-015）：右缘 6px 透明命中区，拖拽实时写入 --dap-width；
+   滚动区在其左侧留出 native scrollbar 命中带，手柄只改变光标、不绘制 hover 高亮；
    折叠窄条与移动端抽屉不提供拖拽（下方两处媒体查询隐藏）。 */
 [data-dsh-activity-pane] .dap-resize {
   position: absolute;
@@ -2332,10 +2430,6 @@ const CSS = `
   touch-action: none;
   z-index: 6;
 }
-[data-dsh-activity-pane] .dap-resize:hover,
-[data-dsh-activity-pane] .dap-resize[data-dragging] {
-  background: color-mix(in srgb, currentColor 18%, transparent);
-}
 /* 桌面：窗格作为中间列内的真实 flex 行元素参与布局——中间列被置为行方向，
    窗格固定宽、会话区弹性收缩，整个会话内容被真实挤到右边；折叠时收窄为窄条。 */
 @media (min-width: 768px) {
@@ -2580,14 +2674,10 @@ body:not([data-ds-dark-theme]) [data-dsh-activity-pane] .dap-workspace {
   display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
   min-width: 0; margin: 2px 0 0;
 }
-/* 等待类型胶囊与上一轮耗时同行：时长沿用运行统计行的右缘位置，不参与等待脉冲。 */
+/* 等待类型胶囊独立同行：耗时回到统计行最右侧，不参与等待脉冲。 */
 [data-dsh-activity-pane] .dap-await-head {
   display: flex; align-items: center; gap: 8px; align-self: stretch; min-width: 0;
 }
-[data-dsh-activity-pane] .dap-await-head .dap-token-time {
-  margin-left: auto; flex: none; font-size: 10px; line-height: 14px;
-  color: #8f9aaa; font-variant-numeric: tabular-nums;
-}
 [data-dsh-activity-pane] .dap-note-row {
   display: flex; align-items: center; gap: 6px; min-width: 0; align-self: stretch;
 }
@@ -2606,7 +2696,7 @@ body:not([data-ds-dark-theme]) [data-dsh-activity-pane] .dap-workspace {
   color: color-mix(in srgb, currentColor 82%, transparent);
   background: color-mix(in srgb, currentColor 14%, transparent);
 }
-/* 运行卡富化（对齐 answer-pet 卡片；MIT 参考，见 README）。 */
+/* 运行卡与最近卡统计（对齐 answer-pet 卡片；MIT 参考，见 README）。 */
 [data-dsh-activity-pane] .dap-progress {
   display: flex; align-items: center; gap: 7px; min-width: 0;
 }
@@ -3041,12 +3131,15 @@ function livenessFromSnapshot(snap) {
 	return { startTime };
 }
 
-function fmtRecentTime(ts) {
+/** 历史卡时间同时给出本地绝对日期时分与相对年龄；跨年份的绝对日期带年份。 */
+function fmtRecentTime(ts, now = Date.now()) {
 	try {
-		return `最近 ${new Date(ts).toLocaleTimeString([], {
-			hour: "2-digit",
-			minute: "2-digit",
-		})}`;
+		const value = Number(ts);
+		const current = Number(now);
+		const absolute = fmtAbsoluteDateTime(ts, now);
+		if (!absolute) return "";
+		const relative = fmtRelativeAge(current - value);
+		return relative ? `最后活动 · ${absolute} · ${relative}` : `最后活动 · ${absolute}`;
 	} catch {
 		return "";
 	}
@@ -3080,6 +3173,7 @@ function apply(ctx) {
 	let sessionUnsubscribe = null;
 	let workspaceUnsubscribe = null;
 	let clockTimer = null;
+	let recentTimeTimer = null;
 	let syncScheduled = false;
 	let lastSig = "";
 	/** 等待条目 id/类别队列签名：变化时统一重启数量胶囊与等待卡末行动画对相（R-01-002/AC-07、AC-08）。 */
@@ -3132,11 +3226,16 @@ function apply(ctx) {
 	const cardsById = new Map();
 	/** 历史区卡片 id → { el } 复用表。 */
 	const recentCardsById = new Map();
+	/** 历史区渐进呈现状态：候选由核心完整派生，DOM 与详情读取只覆盖当前前缀。 */
+	let recentVisibleCount = RECENT_PAGE_SIZE;
+	let recentTotal = 0;
+	let recentHasMore = false;
+	let recentAppendQueued = false;
 	/** 运行中会话原生快照订阅：id → { unsubscribe, liveness, snapshot }。 */
 	const livenessById = new Map();
 	/** 委托周期进度锚点记账：id → progressAnchor 状态（R-01-009/AC-06）。 */
 	const progressAnchorById = new Map();
-	/** 订阅停止后保留最近快照，供 awaiting/recent 卡继续显示上下文。 */
+	/** 订阅停止后保留最近快照与最后已知运行统计，供 awaiting/recent 卡继续显示上下文。 */
 	const sessionDetailsById = new Map();
 	/** 会话跳转的单一重试链；避免重复点击叠加 refresh/timer。 */
 	const openRetryStates = new Map();
@@ -3545,12 +3644,25 @@ function apply(ctx) {
 			window.dispatchEvent(new Event("resize"));
 		} catch {}
 	}
+	function loadMoreRecent() {
+		if (disposed || !recentHasMore || recentAppendQueued) return false;
+		const nextCount = Math.min(recentVisibleCount + RECENT_PAGE_SIZE, recentTotal);
+		if (nextCount <= recentVisibleCount) return false;
+		recentAppendQueued = true;
+		recentVisibleCount = nextCount;
+		queueSync();
+		return true;
+	}
 	function bindPaneControls(pane) {
 		const header = pane.querySelector(".dap-header");
 		const rail = pane.querySelector(".dap-rail");
 		const resize = pane.querySelector(".dap-resize");
 		const scroll = pane.querySelector(".dap-scroll");
 		const topBtn = pane.querySelector(".dap-top");
+		const recentMore = pane.querySelector(".dap-recent-more");
+		const onRecentMoreClick = () => {
+			if (loadMoreRecent() && recentMore !== null) recentMore.disabled = true;
+		};
 		// 标题行整体即收起控件，两端断点一致：桌面折叠为窄条（R-01-011/AC-03）；
 		// 移动端断点解释为收起抽屉，而非折叠窄条（R-01-008/AC-02、R-01-011/AC-06）。
 		const onHeaderActivate = () => {
@@ -3573,6 +3685,15 @@ function apply(ctx) {
 		const syncTopBtn = () => {
 			if (topBtn !== null && scroll !== null) topBtn.hidden = scroll.scrollTop <= TOP_THRESHOLD;
 		};
+		// 鼠标进入窗格即显示 scrollbar（R-01-004/AC-03）；触摸指针不改变桌面滚动条可见状态。
+		const onPanePointerEnter = (event) => {
+			if (event.pointerType !== "mouse") return;
+			pane.setAttribute("data-pointer-inside", "");
+		};
+		const onPanePointerLeave = (event) => {
+			if (event.pointerType !== "mouse") return;
+			pane.removeAttribute("data-pointer-inside");
+		};
 		const onRailClick = () => {
 			collapsed = false;
 			pane.setAttribute("data-collapsed", "false");
@@ -3615,8 +3736,9 @@ function apply(ctx) {
 			resize.addEventListener("pointercancel", onResizeUp);
 			resize.setPointerCapture(event.pointerId);
 		};
-		// 滚动条仅滚动时显示（R-01-004/AC-03）：滚动即置位，停滚 600ms 后隐藏。
-		// 同一监听承载「回到顶部」按钮显隐（R-01-018/AC-01、AC-03）：回顶后的收口不经额外事件，
+		// 滚动条随滚动或窗格内鼠标指针显示（R-01-004/AC-03）：滚动即置位，停滚 600ms 后收口；
+		// 指针离开后若仍在滚动拖尾内则保持显示，拖尾结束后隐藏。同一监听承载「回到顶部」按钮显隐
+		//（R-01-018/AC-01、AC-03）：回顶后的收口不经额外事件，
 		// 由平滑滚动触发的 scroll 事件自然完成。
 		let scrollHideTimer = null;
 		const onScroll = () => {
@@ -3637,14 +3759,21 @@ function apply(ctx) {
 		header?.addEventListener("click", onHeaderActivate);
 		header?.addEventListener("keydown", onHeaderKeydown);
 		rail?.addEventListener("click", onRailClick);
+		pane.addEventListener("pointerenter", onPanePointerEnter);
+		pane.addEventListener("pointerleave", onPanePointerLeave);
 		scroll?.addEventListener("scroll", onScroll, { passive: true });
+		recentMore?.addEventListener("click", onRecentMoreClick);
 		topBtn?.addEventListener("click", onTopClick);
 		resize?.addEventListener("pointerdown", onResizeDown);
 		return () => {
 			header?.removeEventListener("click", onHeaderActivate);
 			header?.removeEventListener("keydown", onHeaderKeydown);
 			rail?.removeEventListener("click", onRailClick);
+			pane.removeEventListener("pointerenter", onPanePointerEnter);
+			pane.removeEventListener("pointerleave", onPanePointerLeave);
+			pane.removeAttribute("data-pointer-inside");
 			scroll?.removeEventListener("scroll", onScroll);
+			recentMore?.removeEventListener("click", onRecentMoreClick);
 			if (scrollHideTimer !== null) clearTimeout(scrollHideTimer);
 			topBtn?.removeEventListener("click", onTopClick);
 			resize?.removeEventListener("pointerdown", onResizeDown);
@@ -3674,7 +3803,8 @@ function apply(ctx) {
 				<div class="dap-scroll">
 					<div class="dap-list" tabindex="-1"><div class="dap-tracks" aria-hidden="true"></div></div>
 					<div class="dap-recent">
-						<div class="dap-recent-head"><span>最近历史 · 24h</span></div>
+						<div class="dap-recent-head"><span>最近历史</span></div>
+						<button class="dap-recent-more" type="button" hidden>加载更多...</button>
 					</div>
 				</div>
 				<button class="dap-top" type="button" aria-label="回到顶部" title="回到顶部" hidden></button>
@@ -3780,7 +3910,10 @@ function apply(ctx) {
 			const agentLabel = makeEl("span", "dap-history-label");
 			agentLabel.textContent = "助手";
 			agentLine.append(agentIcon, agentLabel, makeEl("span", "dap-history-separator"), makeEl("span", "dap-history-text"));
-			return [head, row, userLine, agentLine, makeEl("div", "dap-note")];
+			const statsRow = makeEl("div", "dap-token-stats");
+			statsRow.append(makeEl("span", "dap-token-main"), makeEl("span", "dap-token-time"));
+			statsRow.hidden = true;
+			return [head, row, userLine, agentLine, statsRow, makeEl("div", "dap-note")];
 		}
 		if (kind === "awaiting") {
 			const row = makeEl("div", "dap-row");
@@ -3794,10 +3927,13 @@ function apply(ctx) {
 			const noteRow = makeEl("div", "dap-note-row");
 			noteRow.append(makeEl("div", "dap-note"), makeConfirmButton());
 			const awaitHead = makeEl("div", "dap-await-head");
-			awaitHead.append(capsule, makeEl("span", "dap-token-time"));
+			awaitHead.append(capsule);
+			const statsRow = makeEl("div", "dap-token-stats");
+			statsRow.append(makeEl("span", "dap-token-main"), makeEl("span", "dap-token-time"));
+			statsRow.hidden = true;
 			const foot = makeEl("div", "dap-foot");
 			foot.append(awaitHead, noteRow);
-			return [head, row, makeEl("div", "dap-trace"), foot];
+			return [head, row, makeEl("div", "dap-trace"), statsRow, foot];
 		}
 		const row = makeEl("div", "dap-row");
 		row.append(makeEl("span", "dap-dot"), makeEl("span", "dap-title"));
@@ -4158,14 +4294,19 @@ function apply(ctx) {
 		}
 	}
 
-	/** 统计行渲染：运行卡写入速率、token 与耗时，旧骨架缺节点时就地补齐。 */
+	/** 统计行渲染：运行卡、等待卡与最近卡写入速率、token 与耗时，旧骨架缺节点时就地补齐。 */
 	function renderTokenStats(el, entry) {
 		let stats = el.querySelector(".dap-token-stats");
 		if (stats === null) {
 			stats = makeEl("div", "dap-token-stats");
 			stats.append(makeEl("span", "dap-token-main"), makeEl("span", "dap-token-time"));
 			stats.hidden = true;
-			el.append(stats);
+			const foot = entry.kind === "awaiting" ? el.querySelector(".dap-foot") : null;
+			if (foot !== null) el.insertBefore(stats, foot);
+			else el.append(stats);
+		} else if (entry.kind === "awaiting") {
+			const foot = el.querySelector(".dap-foot");
+			if (foot !== null && stats.nextElementSibling !== foot) el.insertBefore(stats, foot);
 		}
 		let mainTextEl = stats.querySelector(".dap-token-main");
 		let timeEl = stats.querySelector(".dap-token-time");
@@ -4187,25 +4328,9 @@ function apply(ctx) {
 		if (stats.hidden !== statsHidden) stats.hidden = statsHidden;
 	}
 
-	/** 等待卡耗时写入：与等待类型胶囊同一行靠右，旧骨架缺该行时就地补齐。 */
-	function renderAwaitingDuration(el, entry) {
-		const foot = el.querySelector(".dap-foot");
-		if (foot === null) return;
-		let head = foot.querySelector(".dap-await-head");
-		if (head === null) {
-			const capsule = foot.querySelector(".dap-capsule");
-			if (capsule === null) return;
-			head = makeEl("div", "dap-await-head");
-			capsule.replaceWith(head);
-			head.append(capsule);
-		}
-		let time = head.querySelector(".dap-token-time");
-		if (time === null) {
-			time = makeEl("span", "dap-token-time");
-			head.append(time);
-		}
-		const text = Number.isFinite(entry.elapsedMs) && entry.elapsedMs >= 0 ? fmtElapsedMs(entry.elapsedMs) : "";
-		if (time.textContent !== text) time.textContent = text;
+	/** 旧热装等待骨架清理：耗时已迁回统计行，去掉胶囊同行残留的时长节点。 */
+	function removeAwaitingHeadDuration(el) {
+		el.querySelector(".dap-await-head .dap-token-time")?.remove();
 	}
 
 	/** 时间线区加载指示：数据在途且尚无工作项时显示活动图标行（R-01-014/AC-02）。 */
@@ -4340,12 +4465,14 @@ function apply(ctx) {
 					restoreTextField(text, previews[i]);
 				}
 			}
+			renderTokenStats(el, entry);
 		}
 
 		if (entry.kind === "awaiting") {
 			const traceContainer = el.querySelector(".dap-trace");
 			if (traceContainer !== null) renderTimelineArea(traceContainer, entry);
-			renderAwaitingDuration(el, entry);
+			removeAwaitingHeadDuration(el);
+			renderTokenStats(el, entry);
 			const confirm = el.querySelector(".dap-confirm");
 			if (confirm !== null) {
 				// 激活锚点：只在结构重建时绑一次（卡片按 id 复用，kind 变化会重建骨架）。
@@ -4454,6 +4581,16 @@ function apply(ctx) {
 		}
 	}
 
+	/** 历史卡相对时间只需分钟级刷新；无历史卡时停止定时器，避免空窗格常驻唤醒。 */
+	function syncRecentTimeClock(wanted) {
+		if (wanted && recentTimeTimer === null) {
+			recentTimeTimer = setInterval(() => queueSync(), RECENT_TIME_REFRESH_MS);
+		} else if (!wanted && recentTimeTimer !== null) {
+			clearInterval(recentTimeTimer);
+			recentTimeTimer = null;
+		}
+	}
+
 	function getSessionSnapshot(session) {
 		try {
 			return session?.getSnapshot?.() ?? null;
@@ -4662,11 +4799,14 @@ function apply(ctx) {
 		if (entry.waitClass === "blocked" || entry.waitClass === "done" || entry.waitClass === "error")
 			rec.el.setAttribute("data-wait", entry.waitClass);
 		else rec.el.removeAttribute("data-wait");
+		const recentTimeText = entry.kind === "recent" ? fmtRecentTime(entry.activityAt) : "";
 		rec.el.setAttribute(
 			"aria-label",
 			`${entry.workspaceTitle ? entry.workspaceTitle + " - " : ""}${entry.title}${
 				entry.pendingText ? "，" + entry.pendingText : ""
-			}${(entry.waitClass === "done" || entry.waitClass === "error") && entry.noteText ? "，" + entry.noteText : ""}`,
+			}${(entry.waitClass === "done" || entry.waitClass === "error") && entry.noteText ? "，" + entry.noteText : ""}${
+				recentTimeText ? "，" + recentTimeText : ""
+			}`,
 		);
 		renderCardInto(rec.el, entry, hueByWorkspace);
 		// 只有顺序/归属真正变化时才移动 DOM：每次渲染无条件 appendChild 会把所有
@@ -4857,6 +4997,10 @@ function apply(ctx) {
 			pulseSignature = "";
 			prevRenderedActiveIds = new Set();
 			prevRenderedRecentIds = new Set();
+			recentVisibleCount = RECENT_PAGE_SIZE;
+			recentTotal = 0;
+			recentHasMore = false;
+			recentAppendQueued = false;
 			// 旧窗格已脱离文档：其在飞平移的 transitionend 不再触发，逐元素取消避免残留。
 			for (const el of [...shiftCleanups.keys()]) cancelShift(el);
 		}
@@ -4876,6 +5020,8 @@ function apply(ctx) {
 			}
 		}
 		const listState = listLoadState(snapshot);
+		// 只消费上一轮追加请求；列表短暂 pending 时保留已展开页，ready 后继续从同一前缀呈现。
+		recentAppendQueued = false;
 		const workspaceSnapshot = getSnapshot(workspaces, "list");
 		const workspaceItems = workspaceSnapshot?.items ?? [];
 		const archivedSessionIds = workspaceSnapshot?.archivedSessionIds ?? [];
@@ -4971,11 +5117,11 @@ function apply(ctx) {
 			// token/速率取自 sessions.list 条目的投影（tokenUsage/sessionStats），
 			// 复用既有列表订阅，无新增轮询（R-01-009/AC-05、R-02-004/AC-02）。
 			const projection = snapshot?.byId?.[entry.id]?.projectionValues;
-			const stats = projection?.sessionStats;
-			const rateTokS =
-				stats && Number.isFinite(stats.decodeMs) && stats.decodeMs > 0
-					? stats.decodeTokens / (stats.decodeMs / 1000)
-					: null;
+			const projectionStats = statsFromProjection(projection);
+			if (entry.kind === "awaiting") {
+				// 等待期间冻结运行停止前的最后已知统计；刷新/无留存时回退当前列表投影。
+				Object.assign(entry, mergeRuntimeStats(detail?.lastRuntimeStats, projectionStats));
+			}
 			// 委托周期锚点（R-01-009/AC-06）：全部活动条目逐帧记账——锚点不因呈现翻转
 			// （委托期与 awaiting 互转）或瞬时不可见而丢失，仅 dispose 时整体清除；周期内
 			// 进度连续（含 settle 处理回合），周期外由宿主回合起点驱动（新回合归零）。
@@ -4991,13 +5137,15 @@ function apply(ctx) {
 			progressAnchorById.set(entry.id, anchor);
 			if (entry.kind === "running") {
 				const elapsedMs = Number.isFinite(anchor.anchor) ? Math.max(0, now - anchor.anchor) : null;
-				const outputTokens = projection?.tokenUsage?.outputTokens ?? null;
-				Object.assign(entry, runtimeStats({ elapsedMs, outputTokens, rateTokS }));
-				Object.assign(entry, usageSummary(projection?.tokenUsage ?? {}));
+				Object.assign(entry, projectionStats, { elapsedMs });
+				if (detail) {
+					// 列表投影短暂缺字段时，不覆盖此前已知的有效统计。
+					detail.lastRuntimeStats = mergeRuntimeStats(projectionStats, detail.lastRuntimeStats);
+				}
 				// 回合进度：纯时间驱动 y = t/(t+k)，半衰期每帧按最新实测速率现算，固定
 				// k 下单调性由函数本身保证；k 变化时允许进度随速率回落而回退（委托周期
 				// 连续、周期外回合切换归零，R-01-009/AC-06，C-014、C-044）。
-				entry.progress = progressOf({ elapsedMs: elapsedMs ?? 0, halfLifeSec: progressHalfLifeSec({ rateTokS }) });
+				entry.progress = progressOf({ elapsedMs: elapsedMs ?? 0, halfLifeSec: progressHalfLifeSec({ rateTokS: projectionStats.rateTokS }) });
 			}
 		}
 		// 历史区时间精化（R-01-010/AC-08、AC-09）：从保留快照的 turnTimings 与已拉取的
@@ -5014,8 +5162,29 @@ function apply(ctx) {
 			}
 			if (detail.memoTurnEnd != null) turnEnds[id] = detail.memoTurnEnd;
 		}
-		const recent = buildRecent(snapshot, workspaceItems, now, undefined, sessionDetailsById, archivedSessionIds, completeAcksById, delegatingIds, turnEnds);
-		// 预览只对 recent 卡计算（活动卡不显示预览）；快照/历史引用不变时命中缓存。
+		const recentCandidates = buildRecent(snapshot, workspaceItems, now, sessionDetailsById, archivedSessionIds, completeAcksById, delegatingIds, turnEnds);
+		recentTotal = recentCandidates.length;
+		const recent = recentCandidates.slice(0, recentVisibleCount);
+		recentHasMore = recent.length < recentTotal;
+		// 最近卡统计复用运行卡的列表投影口径；耗时从保留快照或已读 history 取最近完整回合，
+		// 缺边界时仅为当前可见历史卡安排一次既有 history 补读（R-01-013/AC-12）。
+		const recentDurationFallbackIds = new Set();
+		for (const entry of recent) {
+			const detail = sessionDetailsById.get(entry.id);
+			const detailSnapshot = livenessById.get(entry.id)?.snapshot ?? detail?.snapshot ?? null;
+			const elapsedMs = lastTurnDuration({ turnTimings: detailSnapshot?.turnTimings, history: detail?.history });
+			const stats = statsFromProjection(snapshot?.byId?.[entry.id]?.projectionValues, elapsedMs);
+			const retained = detail?.lastRuntimeStats;
+			Object.assign(entry, stats, retained ? {
+				outputTokens: retained.outputTokens ?? stats.outputTokens,
+				inputTokens: retained.inputTokens ?? stats.inputTokens,
+				cacheHitPct: retained.cacheHitPct ?? stats.cacheHitPct,
+				rateTokS: retained.rateTokS ?? stats.rateTokS,
+			} : null);
+			if (elapsedMs === null) recentDurationFallbackIds.add(entry.id);
+		}
+		syncRecentTimeClock(recent.length > 0);
+		// 预览只对当前显示的 recent 卡计算（活动卡不显示预览）；快照/历史引用不变时命中缓存。
 		// 完成瞬间的窗口快照可能先有用户消息、后到 agent reply；缺任一预览时补读一次 history。
 		const previewFallbackIds = new Set();
 		for (const entry of recent) {
@@ -5033,8 +5202,11 @@ function apply(ctx) {
 			if (!entry.userPreview || !entry.agentPreview) previewFallbackIds.add(entry.id);
 			entry.loadingPreviews = (!entry.userPreview || !entry.agentPreview) && historyLoads.has(entry.id);
 		}
-		// 补充数据读取优先级：当前会话最优先，活动区先于历史区（区内按显示顺序）。
-		const durationFallbackIds = new Set(active.filter((entry) => entry.kind === "awaiting").map((entry) => entry.id));
+		// 补充数据读取优先级：当前会话最优先，活动区先于当前已显示历史页（区内按显示顺序）。
+		const durationFallbackIds = new Set([
+			...active.filter((entry) => entry.kind === "awaiting").map((entry) => entry.id),
+			...recentDurationFallbackIds,
+		]);
 		const detailIds = [...active, ...recent].map((entry) => entry.id);
 		detailIds.sort((a, b) => Number(String(b) === String(snapshot?.current)) - Number(String(a) === String(snapshot?.current)));
 		loadNativeDetails(detailIds, previewFallbackIds, durationFallbackIds);
@@ -5055,7 +5227,9 @@ function apply(ctx) {
 		// listState 参与签名：空列表从 pending/error → ready 时卡集合不变，若只比较卡片
 		// 会被提前返回冻结在「加载中」/「列表加载失败」；数量胶囊可见面变化同样需要
 		// 进入渲染，以便与当前可见等待卡末行重新对相（R-01-002/AC-07）。
-		const sig = JSON.stringify([listState, cardSignature(visibleEntries), pulseSurface]);
+		// 历史卡的相对活动时间随分钟级时钟变化，纳入签名后只在文案实际变化时重绘。
+		const recentTimeSignature = recent.map((entry) => fmtRecentTime(entry.activityAt));
+		const sig = JSON.stringify([listState, cardSignature(visibleEntries), pulseSurface, recentTimeSignature]);
 		if (sig === lastSig) return;
 		const hueByWorkspace = resolveWorkspaceHues(visibleEntries.map((entry) => entry.workspaceKey));
 		// 跨区迁移（双向，R-01-010/AC-07）：DOM 写入前量取旧卡矩形并克隆 ghost。
@@ -5104,6 +5278,11 @@ function apply(ctx) {
 		if (recentSection !== null) {
 			recentSection.hidden = listState === "ready" && recent.length === 0;
 			ensureListStatus(recentSection, listState !== "ready" && recent.length === 0, listState === "loading" ? "加载中…" : "列表加载失败", { loading: listState === "loading" });
+			const recentMore = recentSection.querySelector(".dap-recent-more");
+			if (recentMore !== null) {
+				recentMore.hidden = !recentHasMore;
+				recentMore.disabled = recentAppendQueued;
+			}
 		}
 		runMoveGhosts(movePlans);
 		if (shiftRects !== null) runShiftAnimations(shiftRects);
@@ -5164,6 +5343,8 @@ function apply(ctx) {
 		const headerExpanded = collapsed ? "false" : "true";
 		if (headerEl !== null && headerEl.getAttribute("aria-expanded") !== headerExpanded)
 			headerEl.setAttribute("aria-expanded", headerExpanded);
+		// 历史分页只由底部按钮显式触发；追加只排队一帧，避免重复点击造成重复增长
+		//（R-01-019/AC-01～AC-03）。
 
 		// 渲染签名在整轮 DOM 写入全部成功后提交：任何一步失败都保留下一轮
 		// 同步重试的机会，避免故障被签名吞掉后卡片永久滞留（R-01-013/AC-02）。
@@ -5348,6 +5529,7 @@ function apply(ctx) {
 		window.removeEventListener("pageshow", onPageShow);
 		completeAcksById.clear();
 		if (clockTimer !== null) clearInterval(clockTimer);
+		if (recentTimeTimer !== null) clearInterval(recentTimeTimer);
 		if (e2eListReleaseTimer !== null) clearTimeout(e2eListReleaseTimer);
 		for (const [timer, resolve] of e2eModelDelayWaiters) {
 			clearTimeout(timer);