dsh-token-total 1.0.6 → 1.0.7

package/lib/client.js

@@ -29650,6 +29650,20 @@ window.__ModuleLoader__.load({
 			}
 			return out;
 		}
+		/** Decode throughput across rows: Σ(output tokens) / Σ(decode window), matching
+		*  the `sessionStats` projection's decodeTokens/decodeMs rate that the composer
+		*  bottom bar shows. Rows without a decode window (failed attempts, cancelled
+		*  steps, running requests) are excluded, so the card, the turn summaries and
+		*  the bottom bar all report one speed. */
+		function decodeRateOf(rows) {
+			let ms = 0;
+			let tokens = 0;
+			for (const row of rows) if (typeof row.decodeMs === "number" && Number.isFinite(row.decodeMs)) {
+				ms += row.decodeMs;
+				tokens += row.totals.outputTokens;
+			}
+			return ms > 0 ? tokens / (ms / 1e3) : null;
+		}
 		/** Canonicalize a DISPLAY NAME, never a route id. Case and word separators
 		*  do not distinguish models, but versions, punctuation and suffixes do:
 		*  gpt-6.1-sol / GPT 6.1 sol -> gpt-6.1-sol, not gpt-6.1 or gpt-61-sol.
@@ -32638,6 +32652,7 @@ window.__ModuleLoader__.load({
 			(0, react.useEffect)(() => {
 				let active = true;
 				let pending = false;
+				let wantedNow = false;
 				let timer;
 				let controller;
 				const request = () => {
@@ -32649,23 +32664,29 @@ window.__ModuleLoader__.load({
 						if (active) setReading({
 							sessionId,
 							detail,
-							error: false
+							error: false,
+							updatedAt: Date.now()
 						});
 					}).catch(() => {
 						if (active) setReading((previous) => ({
 							sessionId,
 							detail: previous?.sessionId === sessionId ? previous.detail : null,
-							error: true
+							error: true,
+							updatedAt: previous?.sessionId === sessionId ? previous.updatedAt : null
 						}));
 					}).finally(() => {
 						pending = false;
-						if (active) timer = setTimeout(request, DETAIL_POLL_MS);
+						if (active) timer = setTimeout(request, wantedNow ? 0 : DETAIL_POLL_MS);
+						wantedNow = false;
 					});
 				};
 				const wake = () => {
 					if (document.visibilityState === "visible") request();
 				};
-				refresh.current = request;
+				refresh.current = () => {
+					if (pending) wantedNow = true;
+					else request();
+				};
 				document.addEventListener("visibilitychange", wake);
 				request();
 				return () => {
@@ -32681,7 +32702,8 @@ window.__ModuleLoader__.load({
 				detail: current?.detail ?? null,
 				loading: current === null,
 				error: current?.error ?? false,
-				retry: () => refresh.current?.()
+				refresh: () => refresh.current?.(),
+				updatedAt: current?.updatedAt ?? null
 			};
 		}
 		//#endregion
@@ -32854,7 +32876,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0token-total-css:/home/runner/work/dsh-token-total/dsh-token-total/src/client/SessionUsageView.module.css?inline
-		const css = "/* A light, self-contained Usage surface. Tables fit the available width:\n * no horizontal scroll containers, fixed column contracts, titles for names.\n * Stat cards follow the reference dashboard: tinted left edge + icon chip,\n * label, big value, small subtitle. Request log folds by conversation turn. */\n.scroll_900471699 { height:100%; min-height:0; overflow-y:auto; background:#ffffff; color:#252936; color-scheme:light; container-type:inline-size; }\n.page_900471699 { box-sizing:border-box; width:100%; max-width:1160px; margin:0 auto; padding:24px 26px 32px; font-family:system-ui,-apple-system,\"Segoe UI\",sans-serif; font-size:13px; }\n.page_900471699 * { box-sizing:border-box; }\n.scope_900471699 { color:#8790a3; font-size:11px; margin:0 0 14px; }\n.stats_900471699 { display:grid; gap:12px; margin-bottom:18px; }\n.statRow_900471699 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }\n.stat_900471699 { min-width:0; position:relative; overflow:hidden; background:#fff; border:1px solid #e4e7ee; border-left:4px solid var(--tone); border-radius:12px; padding:12px 16px 11px; }\n.statHead_900471699 { display:flex; align-items:center; gap:8px; margin-bottom:8px; }\n.statIcon_900471699 { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:10px; color:#fff; background:linear-gradient(135deg, var(--tone), var(--tone-soft)); flex-shrink:0; box-shadow:0 3px 8px var(--tone-soft); }\n.statMark_900471699 { position:absolute; right:-14px; bottom:-18px; width:92px; height:92px; color:var(--tone); pointer-events:none; }\n.statLabel_900471699 { font-size:12px; color:#7d8495; }\n.statValue_900471699 { display:block; font-size:25px; font-weight:650; letter-spacing:-0.5px; white-space:nowrap; font-variant-numeric:tabular-nums; }\n.statSub_900471699 { display:block; margin-top:5px; font-size:11px; color:#939aac; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }\n.toneBlue_900471699 { --tone:#4f79f6; --tone-soft:#eaf0fe; }\n.tonePurple_900471699 { --tone:#8b5cf6; --tone-soft:#f1ebfe; }\n.toneGreen_900471699 { --tone:#18a97b; --tone-soft:#e5f6f0; }\n.toneOrange_900471699 { --tone:#e8892c; --tone-soft:#fcf1e4; }\n.toneTeal_900471699 { --tone:#16a4b8; --tone-soft:#e4f5f8; }\n.tonePink_900471699 { --tone:#d9538c; --tone-soft:#fbeaf1; }\n.card_900471699 { min-width:0; background:#fff; border:1px solid #e4e7ee; border-radius:12px; margin-bottom:18px; overflow:hidden; }\n.cardHead_900471699 { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:54px; padding:15px 18px; border-bottom:1px solid #eef0f4; }\n.cardHead_900471699 h2 { font-size:14px; font-weight:600; margin:0; }\n.cardHead_900471699 > span { display:flex; gap:7px; align-items:center; font-size:11px; }\n.count_900471699 { display:inline-flex; align-items:center; justify-content:center; min-width:21px; padding:2px 6px; font-size:10px; color:#8b93a3; background:#f3f5f8; border-radius:5px; margin-left:5px; font-weight:500; }\n.mid_900471699 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:stretch; }\n.mid_900471699 .card_900471699 { height:100%; margin-bottom:0; }\n.mid_900471699 { margin-bottom:18px; }\n.table_900471699 { border-collapse:collapse; width:100%; table-layout:fixed; font-size:11px; }\n.table_900471699 th { color:#929aaa; font-weight:500; padding:12px 5px; text-align:right; vertical-align:middle; line-height:1.3; overflow-wrap:anywhere; }\n.table_900471699 td { padding:13px 5px; text-align:right; border-top:1px solid #eef0f4; color:#626c80; font-variant-numeric:tabular-nums; white-space:nowrap; }\n.table_900471699 th:first-child,.table_900471699 td:first-child { text-align:left; padding-left:16px; }\n.table_900471699 th:last-child,.table_900471699 td:last-child { padding-right:16px; }\n.childName_900471699 { width:28%; }\n.childRequests_900471699 { width:11%; }\n.modelName_900471699 { width:30%; }\n.modelRequests_900471699 { width:11%; }\n.modelHit_900471699 { width:16%; }\n.ellipsis_900471699 { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#394354; }\n/* By-model rows lead with the model's brand logo; the name keeps truncating\n * inside the flexible remainder of the cell. */\n.modelNameCell_900471699 { display:flex; align-items:center; gap:6px; min-width:0; }\n.modelNameCell_900471699 .ellipsis_900471699 { flex:1; min-width:0; }\n/* Gray provider label under a model name shown by several rows (同名模型). */\n.modelProvider_900471699 { display:block; margin-top:2px; font-size:10px; color:#939aaa; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }\n.number_900471699 { font-variant-numeric:tabular-nums; }\n.speedCell_900471699 { display:inline-flex; align-items:baseline; gap:3px; white-space:nowrap; }\n.speedCell_900471699 small { font-size:9px; color:#929aaa; }\n.good_900471699 { color:#21a17b; }\n.warn_900471699 { color:#d69a21; }\n.bad_900471699 { color:#e06571; }\n.live_900471699 { color:#169bb3; }\n.muted_900471699 { color:#939aaa; }\n.empty_900471699 { margin:0; padding:28px 18px; color:#9aa2b1; font-size:12px; text-align:center; }\n.action_900471699 { color:#818b9e; background:none; border:0; padding:3px 0; font:inherit; font-size:11px; cursor:pointer; }\n.action_900471699:hover { color:#279cb6; }\n.action_900471699:focus-visible,.turnHead_900471699:focus-visible { outline:2px solid #2ab1c6; outline-offset:-2px; }\n.turnList_900471699 { padding:0 14px 14px; }\n.turn_900471699 { margin-top:10px; border:1px solid #e7eaf0; border-radius:9px; background:#fff; overflow:hidden; }\n.turnHead_900471699 { display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px 14px; width:100%; text-align:left; background:#f8f9fc; border:0; cursor:pointer; color:#616c7f; font:inherit; font-size:11px; }\n.chevron_900471699 { color:#99a1af; transition:transform 0.2s; }\n.rotated_900471699 { transform:rotate(90deg); }\n.turnTitle_900471699 { display:flex; align-items:center; gap:6px; min-width:0; font-size:12px; font-weight:600; color:#394354; }\n/* Turn topic is the group title now (the page header owns the session name),\n * so it carries the primary text color and truncates before the metrics. */\n.turnTopic_900471699 { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }\n/* A subagent's turns look like this session's turns apart from the agent tag;\n * the tag keeps the full session name in its tooltip. */\n.turnAgent_900471699 { flex:none; padding:1px 6px; border-radius:5px; background:#e9edf4; color:#6f7889; font-size:10px; font-weight:500; }\n.turnSummary_900471699 { display:flex; gap:5px; align-items:center; white-space:nowrap; }\n.turnSummary_900471699 > span:last-child { margin-left:8px; }\n.turnBody_900471699 { border-top:1px solid #eef0f4; }\n.turnBody_900471699[hidden] { display:none; }\n/* A request row is one line: time, what answered, and its metrics pinned to the\n * row end. The metrics never wrap; they truncate with a tooltip before the head\n * gives up its model name. */\n.turnRequest_900471699 { display:grid; grid-template-columns:64px minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 16px; border-top:1px solid #f3f5f9; }\n.turnRequest_900471699:first-child { border-top:0; }\n.turnRequestHead_900471699 { display:flex; align-items:center; gap:8px; font-size:11px; color:#616c7f; min-width:0; }\n.requestTime_900471699 { color:#9aa3b3; font-variant-numeric:tabular-nums; flex-shrink:0; }\n.statusDot_900471699 { width:5px; height:5px; border-radius:50%; background:currentColor; flex-shrink:0; }\n/* Per-model brand logo: colors are baked into each logo's markup, only the\n * layout contract lives here. Unknown models get the neutral gray fallback. */\n.modelLogo_900471699 { flex-shrink:0; }\n.recordModel_900471699 { min-width:0; display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#394354; font-weight:500; }\n.routeText_900471699 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#8b93a4; flex-shrink:1; }\n.effort_900471699 { white-space:nowrap; color:#9aa3b3; background:#f1f3f7; border-radius:5px; padding:1px 6px; }\n.recordMeta_900471699 { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right; font-size:10px; color:#949cab; font-variant-numeric:tabular-nums; }\n.note_900471699 { font-size:10px; line-height:1.7; color:#9aa3b3; margin:0; }\n.error_900471699 { background:#fff4f1; color:#b86751; border:1px solid #f4d8ce; border-radius:9px; padding:12px 16px; margin-bottom:16px; font-size:12px; display:flex; gap:16px; justify-content:space-between; }\n@container (max-width:1050px) {\n  .mid_900471699 { grid-template-columns:minmax(0,1fr); }\n  .statRow_900471699 { grid-template-columns:repeat(2,minmax(0,1fr)); }\n  .statValue_900471699 { font-size:23px; }\n  .table_900471699 { font-size:12px; }\n  .childName_900471699 { width:34%; }\n}\n@container (max-width:700px) {\n  .page_900471699 { padding:18px 14px 24px; }\n  .stat_900471699 { padding:12px 12px 11px; }\n  .statValue_900471699 { font-size:20px; }\n  .table_900471699 { font-size:10px; }\n  .table_900471699 th,.table_900471699 td { padding:10px 3px; }\n  .table_900471699 th:first-child,.table_900471699 td:first-child { padding-left:10px; }\n  .table_900471699 th:last-child,.table_900471699 td:last-child { padding-right:10px; }\n  .childName_900471699 { width:25%; }\n  .childRequests_900471699 { width:11%; }\n  .modelName_900471699 { width:25%; }\n  .modelRequests_900471699 { width:11%; }\n  .modelHit_900471699 { width:17%; }\n  .turnHead_900471699 { gap:8px; padding:11px 10px; }\n  .turnSummary_900471699 { grid-column:2; font-size:10px; }\n  .turnRequest_900471699 { grid-template-columns:56px minmax(120px,1fr) auto; gap:8px; padding:10px; }\n  .turnRequestHead_900471699 { gap:6px; }\n  .routeText_900471699 { display:none; }\n}\n@media (prefers-reduced-motion:reduce) {\n  .chevron_900471699 { transition:none; }\n}\n";
+		const css = "/* A light, self-contained Usage surface. Tables fit the available width:\n * no horizontal scroll containers, fixed column contracts, titles for names.\n * Stat cards follow the reference dashboard: tinted left edge + icon chip,\n * label, big value, small subtitle. Request log folds by conversation turn. */\n.scroll_900471699 { height:100%; min-height:0; overflow-y:auto; background:#ffffff; color:#252936; color-scheme:light; container-type:inline-size; }\n.page_900471699 { box-sizing:border-box; width:100%; max-width:1160px; margin:0 auto; padding:24px 26px 32px; font-family:system-ui,-apple-system,\"Segoe UI\",sans-serif; font-size:13px; }\n.page_900471699 * { box-sizing:border-box; }\n/* Freshness header: live badge + last-read stamp on the left, manual refresh\n * pinned to the right edge. */\n.head_900471699 { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; }\n.headStatus_900471699 { display:flex; align-items:center; gap:7px; min-width:0; font-size:11px; color:#8790a3; }\n.liveDot_900471699 { width:6px; height:6px; border-radius:50%; background:#18a97b; box-shadow:0 0 0 3px #e5f6f0; flex-shrink:0; }\n.asOf_900471699 { color:#9aa3b3; font-variant-numeric:tabular-nums; white-space:nowrap; }\n.refresh_900471699 { display:inline-flex; align-items:center; gap:5px; flex:none; color:#6f7a8d; background:#fff; border:1px solid #e4e7ee; border-radius:8px; padding:5px 11px; font:inherit; font-size:11px; cursor:pointer; }\n.refresh_900471699:hover { color:#279cb6; border-color:#cbd3e0; }\n.refresh_900471699:disabled { opacity:.55; cursor:default; }\n.scope_900471699 { color:#8790a3; font-size:11px; margin:0 0 14px; }\n.stats_900471699 { display:grid; gap:12px; margin-bottom:18px; }\n.statRow_900471699 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }\n.stat_900471699 { min-width:0; position:relative; overflow:hidden; background:#fff; border:1px solid #e4e7ee; border-left:4px solid var(--tone); border-radius:12px; padding:12px 16px 11px; }\n.statHead_900471699 { display:flex; align-items:center; gap:8px; margin-bottom:8px; }\n.statIcon_900471699 { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:10px; color:#fff; background:linear-gradient(135deg, var(--tone), var(--tone-soft)); flex-shrink:0; box-shadow:0 3px 8px var(--tone-soft); }\n.statMark_900471699 { position:absolute; right:-14px; bottom:-18px; width:92px; height:92px; color:var(--tone); pointer-events:none; }\n.statLabel_900471699 { font-size:12px; color:#7d8495; }\n.statValue_900471699 { display:block; font-size:25px; font-weight:650; letter-spacing:-0.5px; white-space:nowrap; font-variant-numeric:tabular-nums; }\n.statSub_900471699 { display:block; margin-top:5px; font-size:11px; color:#939aac; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }\n.toneBlue_900471699 { --tone:#4f79f6; --tone-soft:#eaf0fe; }\n.tonePurple_900471699 { --tone:#8b5cf6; --tone-soft:#f1ebfe; }\n.toneGreen_900471699 { --tone:#18a97b; --tone-soft:#e5f6f0; }\n.toneOrange_900471699 { --tone:#e8892c; --tone-soft:#fcf1e4; }\n.toneTeal_900471699 { --tone:#16a4b8; --tone-soft:#e4f5f8; }\n.tonePink_900471699 { --tone:#d9538c; --tone-soft:#fbeaf1; }\n.card_900471699 { min-width:0; background:#fff; border:1px solid #e4e7ee; border-radius:12px; margin-bottom:18px; overflow:hidden; }\n.cardHead_900471699 { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:54px; padding:15px 18px; border-bottom:1px solid #eef0f4; }\n.cardHead_900471699 h2 { font-size:14px; font-weight:600; margin:0; }\n.cardHead_900471699 > span { display:flex; gap:7px; align-items:center; font-size:11px; }\n.count_900471699 { display:inline-flex; align-items:center; justify-content:center; min-width:21px; padding:2px 6px; font-size:10px; color:#8b93a3; background:#f3f5f8; border-radius:5px; margin-left:5px; font-weight:500; }\n.mid_900471699 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:stretch; }\n.mid_900471699 .card_900471699 { height:100%; margin-bottom:0; }\n.mid_900471699 { margin-bottom:18px; }\n.table_900471699 { border-collapse:collapse; width:100%; table-layout:fixed; font-size:11px; }\n.table_900471699 th { color:#929aaa; font-weight:500; padding:12px 5px; text-align:right; vertical-align:middle; line-height:1.3; overflow-wrap:anywhere; }\n.table_900471699 td { padding:13px 5px; text-align:right; border-top:1px solid #eef0f4; color:#626c80; font-variant-numeric:tabular-nums; white-space:nowrap; }\n.table_900471699 th:first-child,.table_900471699 td:first-child { text-align:left; padding-left:16px; }\n.table_900471699 th:last-child,.table_900471699 td:last-child { padding-right:16px; }\n.childName_900471699 { width:28%; }\n.childRequests_900471699 { width:11%; }\n.modelName_900471699 { width:30%; }\n.modelRequests_900471699 { width:11%; }\n.modelHit_900471699 { width:16%; }\n.ellipsis_900471699 { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#394354; }\n/* By-model rows lead with the model's brand logo; the name keeps truncating\n * inside the flexible remainder of the cell. */\n.modelNameCell_900471699 { display:flex; align-items:center; gap:6px; min-width:0; }\n.modelNameCell_900471699 .ellipsis_900471699 { flex:1; min-width:0; }\n/* Gray provider label under a model name shown by several rows (同名模型). */\n.modelProvider_900471699 { display:block; margin-top:2px; font-size:10px; color:#939aaa; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }\n.number_900471699 { font-variant-numeric:tabular-nums; }\n.speedCell_900471699 { display:inline-flex; align-items:baseline; gap:3px; white-space:nowrap; }\n.speedCell_900471699 small { font-size:9px; color:#929aaa; }\n.good_900471699 { color:#21a17b; }\n.warn_900471699 { color:#d69a21; }\n.bad_900471699 { color:#e06571; }\n.live_900471699 { color:#169bb3; }\n.muted_900471699 { color:#939aaa; }\n.empty_900471699 { margin:0; padding:28px 18px; color:#9aa2b1; font-size:12px; text-align:center; }\n.action_900471699 { color:#818b9e; background:none; border:0; padding:3px 0; font:inherit; font-size:11px; cursor:pointer; }\n.action_900471699:hover { color:#279cb6; }\n.action_900471699:focus-visible,.turnHead_900471699:focus-visible,.refresh_900471699:focus-visible { outline:2px solid #2ab1c6; outline-offset:-2px; }\n.turnList_900471699 { padding:0 14px 14px; }\n.turn_900471699 { margin-top:10px; border:1px solid #e7eaf0; border-radius:9px; background:#fff; overflow:hidden; }\n.turnHead_900471699 { display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px 14px; width:100%; text-align:left; background:#f8f9fc; border:0; cursor:pointer; color:#616c7f; font:inherit; font-size:11px; }\n.chevron_900471699 { color:#99a1af; transition:transform 0.2s; }\n.rotated_900471699 { transform:rotate(90deg); }\n.turnTitle_900471699 { display:flex; align-items:center; gap:6px; min-width:0; font-size:12px; font-weight:600; color:#394354; }\n/* Turn topic is the group title now (the page header owns the session name),\n * so it carries the primary text color and truncates before the metrics. */\n.turnTopic_900471699 { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }\n/* A subagent's turns look like this session's turns apart from the agent tag;\n * the tag keeps the full session name in its tooltip. */\n.turnAgent_900471699 { flex:none; padding:1px 6px; border-radius:5px; background:#e9edf4; color:#6f7889; font-size:10px; font-weight:500; }\n.turnSummary_900471699 { display:flex; gap:5px; align-items:center; white-space:nowrap; }\n.turnSummary_900471699 > span:last-child { margin-left:8px; }\n.turnBody_900471699 { border-top:1px solid #eef0f4; }\n.turnBody_900471699[hidden] { display:none; }\n/* A request row is one line: time, what answered, and its metrics pinned to the\n * row end. The metrics never wrap; they truncate with a tooltip before the head\n * gives up its model name. */\n.turnRequest_900471699 { display:grid; grid-template-columns:64px minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 16px; border-top:1px solid #f3f5f9; }\n.turnRequest_900471699:first-child { border-top:0; }\n.turnRequestHead_900471699 { display:flex; align-items:center; gap:8px; font-size:11px; color:#616c7f; min-width:0; }\n.requestTime_900471699 { color:#9aa3b3; font-variant-numeric:tabular-nums; flex-shrink:0; }\n.statusDot_900471699 { width:5px; height:5px; border-radius:50%; background:currentColor; flex-shrink:0; }\n/* Per-model brand logo: colors are baked into each logo's markup, only the\n * layout contract lives here. Unknown models get the neutral gray fallback. */\n.modelLogo_900471699 { flex-shrink:0; }\n.recordModel_900471699 { min-width:0; display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#394354; font-weight:500; }\n.routeText_900471699 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#8b93a4; flex-shrink:1; }\n.effort_900471699 { white-space:nowrap; color:#9aa3b3; background:#f1f3f7; border-radius:5px; padding:1px 6px; }\n.recordMeta_900471699 { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right; font-size:10px; color:#949cab; font-variant-numeric:tabular-nums; }\n.note_900471699 { font-size:10px; line-height:1.7; color:#9aa3b3; margin:0; }\n.error_900471699 { background:#fff4f1; color:#b86751; border:1px solid #f4d8ce; border-radius:9px; padding:12px 16px; margin-bottom:16px; font-size:12px; display:flex; gap:16px; justify-content:space-between; }\n@container (max-width:1050px) {\n  .mid_900471699 { grid-template-columns:minmax(0,1fr); }\n  .statRow_900471699 { grid-template-columns:repeat(2,minmax(0,1fr)); }\n  .statValue_900471699 { font-size:23px; }\n  .table_900471699 { font-size:12px; }\n  .childName_900471699 { width:34%; }\n}\n@container (max-width:700px) {\n  .page_900471699 { padding:18px 14px 24px; }\n  .stat_900471699 { padding:12px 12px 11px; }\n  .statValue_900471699 { font-size:20px; }\n  .table_900471699 { font-size:10px; }\n  .table_900471699 th,.table_900471699 td { padding:10px 3px; }\n  .table_900471699 th:first-child,.table_900471699 td:first-child { padding-left:10px; }\n  .table_900471699 th:last-child,.table_900471699 td:last-child { padding-right:10px; }\n  .childName_900471699 { width:25%; }\n  .childRequests_900471699 { width:11%; }\n  .modelName_900471699 { width:25%; }\n  .modelRequests_900471699 { width:11%; }\n  .modelHit_900471699 { width:17%; }\n  .turnHead_900471699 { gap:8px; padding:11px 10px; }\n  .turnSummary_900471699 { grid-column:2; font-size:10px; }\n  .turnRequest_900471699 { grid-template-columns:56px minmax(120px,1fr) auto; gap:8px; padding:10px; }\n  .turnRequestHead_900471699 { gap:6px; }\n  .routeText_900471699 { display:none; }\n}\n@media (prefers-reduced-motion:reduce) {\n  .chevron_900471699 { transition:none; }\n}\n";
 		const tagId = "dsh-token-total/SessionUsageView.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=\"" + tagId + "\"]") === null) {
 			const tag = document.createElement("style");
@@ -32866,6 +32888,11 @@ window.__ModuleLoader__.load({
 		var SessionUsageView_module_default = {
 			"scroll": "scroll_900471699",
 			"page": "page_900471699",
+			"head": "head_900471699",
+			"headStatus": "headStatus_900471699",
+			"liveDot": "liveDot_900471699",
+			"asOf": "asOf_900471699",
+			"refresh": "refresh_900471699",
 			"scope": "scope_900471699",
 			"stats": "stats_900471699",
 			"statRow": "statRow_900471699",
@@ -33316,8 +33343,8 @@ window.__ModuleLoader__.load({
 							const totals = sum(group.rows);
 							const billed = billedTotal(totals);
 							const running = group.rows.filter((row) => row.status === "running").length;
-							const rates = group.rows.map((row) => row.tokensPerSecond).filter((n) => n !== null);
-							const avgRate = rates.length ? Math.round(rates.reduce((a, b) => a + b, 0) / rates.length) : null;
+							const rate = decodeRateOf(group.rows);
+							const avgRate = rate === null ? null : Math.round(rate);
 							return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("article", {
 								className: SessionUsageView_module_default.turn,
 								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
@@ -33388,7 +33415,7 @@ window.__ModuleLoader__.load({
 									id: `usage-turn-${encodeURIComponent(group.key)}`,
 									className: SessionUsageView_module_default.turnBody,
 									hidden: !open,
-									children: group.rows.map((record) => {
+									children: group.rows.slice().reverse().map((record) => {
 										const duration = record.finishedAt !== null ? record.finishedAt - record.startedAt : null;
 										const billed = billedTotal(record.totals);
 										const hit = cacheHitPercentOf(record.totals);
@@ -33431,14 +33458,14 @@ window.__ModuleLoader__.load({
 																modelShort(record.model) || "—"
 															]
 														}),
-														statusText !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-															className: record.status === "running" ? SessionUsageView_module_default.live : record.status === "failed" ? SessionUsageView_module_default.bad : SessionUsageView_module_default.muted,
-															children: statusText
-														}),
 														record.effort ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 															className: SessionUsageView_module_default.effort,
 															children: ["· ", record.effort]
-														}) : null
+														}) : null,
+														statusText !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+															className: record.status === "running" ? SessionUsageView_module_default.live : record.status === "failed" ? SessionUsageView_module_default.bad : SessionUsageView_module_default.muted,
+															children: statusText
+														})
 													]
 												}),
 												record.finishedAt !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -33488,13 +33515,51 @@ window.__ModuleLoader__.load({
 			] });
 		}
 		function SessionUsageView({ sessionId, t }) {
-			const { detail, loading, error, retry } = useSessionDetail(sessionId);
+			const { detail, loading, error, refresh, updatedAt } = useSessionDetail(sessionId);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: SessionUsageView_module_default.scroll,
 				"data-dsh-session-usage": true,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: SessionUsageView_module_default.page,
 					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+							className: SessionUsageView_module_default.head,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: SessionUsageView_module_default.headStatus,
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: SessionUsageView_module_default.liveDot,
+										"aria-hidden": "true"
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("live") }),
+									updatedAt !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+										className: SessionUsageView_module_default.asOf,
+										children: [
+											t("asOf"),
+											" ",
+											clock(updatedAt)
+										]
+									})
+								]
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+								type: "button",
+								className: SessionUsageView_module_default.refresh,
+								onClick: refresh,
+								disabled: loading,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+									width: "12",
+									height: "12",
+									viewBox: "0 0 24 24",
+									fill: "none",
+									stroke: "currentColor",
+									strokeWidth: "2",
+									strokeLinecap: "round",
+									strokeLinejoin: "round",
+									"aria-hidden": "true",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M21 3v5h-5" })]
+								}), t("refresh")]
+							})]
+						}),
 						loading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 							className: SessionUsageView_module_default.empty,
 							role: "status",
@@ -33506,7 +33571,7 @@ window.__ModuleLoader__.load({
 							children: [t("failedLoad"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 								type: "button",
 								className: SessionUsageView_module_default.action,
-								onClick: retry,
+								onClick: refresh,
 								children: t("retry")
 							})]
 						}),
@@ -33577,7 +33642,10 @@ window.__ModuleLoader__.load({
 			cacheShort: "缓存",
 			avgCache: "平均缓存",
 			avgRate: "平均速率",
-			inProgress: "个进行中"
+			inProgress: "个进行中",
+			live: "实时更新",
+			asOf: "统计截至",
+			refresh: "刷新"
 		};
 		const usageEn = {
 			tab: "Usage",
@@ -33634,7 +33702,10 @@ window.__ModuleLoader__.load({
 			cacheShort: "cache",
 			avgCache: "avg cache",
 			avgRate: "avg rate",
-			inProgress: "in progress"
+			inProgress: "in progress",
+			live: "Live",
+			asOf: "as of",
+			refresh: "Refresh"
 		};
 		const usageZhTW = {
 			...usageZh,
@@ -33691,7 +33762,10 @@ window.__ModuleLoader__.load({
 			cacheShort: "快取",
 			avgCache: "平均快取",
 			avgRate: "平均速率",
-			inProgress: "個進行中"
+			inProgress: "個進行中",
+			live: "即時更新",
+			asOf: "統計截至",
+			refresh: "重新整理"
 		};
 		//#endregion
 		//#region src/client/index.tsx

package/lib/index.js

@@ -47,6 +47,20 @@ function modelNameOf(modelRef) {
 	if (i > 0) return modelRef.slice(i + 1);
 	return modelRef;
 }
+/** Decode throughput across rows: Σ(output tokens) / Σ(decode window), matching
+*  the `sessionStats` projection's decodeTokens/decodeMs rate that the composer
+*  bottom bar shows. Rows without a decode window (failed attempts, cancelled
+*  steps, running requests) are excluded, so the card, the turn summaries and
+*  the bottom bar all report one speed. */
+function decodeRateOf(rows) {
+	let ms = 0;
+	let tokens = 0;
+	for (const row of rows) if (typeof row.decodeMs === "number" && Number.isFinite(row.decodeMs)) {
+		ms += row.decodeMs;
+		tokens += row.totals.outputTokens;
+	}
+	return ms > 0 ? tokens / (ms / 1e3) : null;
+}
 /** Canonicalize a DISPLAY NAME, never a route id. Case and word separators
 *  do not distinguish models, but versions, punctuation and suffixes do:
 *  gpt-6.1-sol / GPT 6.1 sol -> gpt-6.1-sol, not gpt-6.1 or gpt-61-sol.
@@ -1411,6 +1425,9 @@ var UsageCollector = class UsageCollector {
 //#region src/model-names.ts
 const LOOKUP_CONCURRENCY = 4;
 const LOOKUP_TIMEOUT_MS = 2e3;
+/** Raised when a lookup's own timer fires — i.e. the shared phase budget is
+*  spent. Workers stop on this instead of trusting the wall clock again. */
+var LookupTimeoutError = class extends Error {};
 /** Bound metadata queries even if an adapter fails to honor cancellation. */
 async function lookup(read, timeoutMs) {
 	const controller = new AbortController();
@@ -1419,7 +1436,7 @@ async function lookup(read, timeoutMs) {
 		return await Promise.race([Promise.resolve().then(() => read(controller.signal)), new Promise((_, reject) => {
 			timer = setTimeout(() => {
 				controller.abort();
-				reject(/* @__PURE__ */ new Error("model display-name lookup timed out"));
+				reject(new LookupTimeoutError("model display-name lookup timed out"));
 			}, timeoutMs);
 		})]);
 	} finally {
@@ -1470,7 +1487,9 @@ async function resolveModelNames(modelRefs, llm) {
 				try {
 					const info = await lookup((signal) => llm.resolveModelInfo(providerOf(ref), modelNameOf(ref), signal), remaining);
 					if (info.name?.trim()) names.set(ref, info.name);
-				} catch {}
+				} catch (error) {
+					if (error instanceof LookupTimeoutError) break;
+				}
 			}
 		}));
 	}
@@ -1490,7 +1509,9 @@ async function resolveModelNames(modelRefs, llm) {
 						const name = byId.get(modelNameOf(ref));
 						if (name?.trim()) names.set(ref, name);
 					}
-				} catch {}
+				} catch (error) {
+					if (error instanceof LookupTimeoutError) break;
+				}
 			}
 		}));
 	}
@@ -1519,9 +1540,6 @@ function usageOf(x) {
 		cacheWriteTokens: Number(u?.cacheWriteTokens) || 0
 	};
 }
-function positive(u) {
-	return u.uncachedInputTokens + u.outputTokens + u.cacheReadTokens + u.cacheWriteTokens > 0;
-}
 function routeOf(x) {
 	const source = x?.message?.source ?? x?.source ?? x?.request ?? x?.context ?? x;
 	return {
@@ -1529,19 +1547,65 @@ function routeOf(x) {
 		model: typeof source?.model === "string" ? source.model : ""
 	};
 }
+/** Whether one stream chunk carries the model's first output token. Mirrors
+*  `isTokenDelta` in @deepseek-ai/dsh-llm so the decode window starts on the
+*  same chunk the official `sessionStats` projection starts it on. */
+function isTokenDelta(chunk) {
+	switch (chunk?.type) {
+		case "text-delta":
+		case "reasoning-delta": return chunk.text !== "";
+		case "tool-call-delta": return chunk.argumentsDelta !== "" || chunk.name !== void 0;
+		default: return false;
+	}
+}
+/** Reconstructed time of the first token in one packed delta run (mirrors
+*  `runFirstTokenTime`): a name-bearing tool-call run starts at its first
+*  member, every other run at its first non-empty fragment. */
+function runFirstTokenTime(run) {
+	if (run?.type === "tool-call-chunks" && run.name !== void 0) return run.time0;
+	const fragments = run?.type === "tool-call-chunks" ? run.args : run?.texts;
+	if (!Array.isArray(fragments)) return void 0;
+	let time = Number(run.time0);
+	for (let i = 0; i < fragments.length; i++) {
+		if (i > 0) time += Number(run.dt?.[i - 1]) || 0;
+		if (fragments[i] !== "") return time;
+	}
+}
+/** Time of the first token in one compact attempt stream (mirrors
+*  `assistantStreamFirstTokenTime`). */
+function streamFirstTokenTime(stream) {
+	for (const r of Array.isArray(stream) ? stream : []) {
+		const t = r?.type === "chunk" ? isTokenDelta(r.chunk) ? r.time : void 0 : runFirstTokenTime(r);
+		if (typeof t === "number" && Number.isFinite(t)) return t;
+	}
+}
+/** Time of the first token carried by one live `assistant/chunk` payload. */
+function chunkFirstTokenTime(data, fallback) {
+	const c = data?.chunk;
+	if (!c) return void 0;
+	const timed = c.chunk && typeof c.time === "number" ? c : null;
+	if (!isTokenDelta(timed ? timed.chunk : c)) return void 0;
+	return timed ? timed.time : typeof c.time === "number" ? c.time : fallback;
+}
 function streamUsage(data) {
-	let firstTime;
 	let usage;
-	for (const r of Array.isArray(data?.stream) ? data.stream : []) {
-		const t = typeof r?.time === "number" ? r.time : void 0;
-		if (firstTime === void 0 && t !== void 0 && (r?.type === "chunk" || r?.chunk?.type === "text" || r?.chunk?.type === "content")) firstTime = t;
-		if (r?.type === "chunk" && r?.chunk?.type === "usage") usage = usageOf(r.chunk);
+	let raw;
+	for (const r of Array.isArray(data?.stream) ? data.stream : []) if (r?.type === "chunk" && r?.chunk?.type === "usage") {
+		usage = usageOf(r.chunk);
+		raw = r.chunk.usage ?? r.chunk;
 	}
 	return {
 		usage,
-		firstTime
+		raw
 	};
 }
+/** Provider-reported completion tokens, or null when unreported or invalid:
+*  an invalid count must not enter the decode quotient (mirrors
+*  `usageOutputTokens` in the sessionStats projection). */
+function usageOutputTokens(x) {
+	const value = (x?.usage ?? x)?.outputTokens;
+	return typeof value === "number" && Number.isFinite(value) && value >= 0 ? value : null;
+}
 function headerOf$1(item) {
 	const x = item;
 	if (x?.header?.id && typeof x.header.id === "string") return x.header;
@@ -1607,6 +1671,8 @@ async function one(p, id, header, live) {
 		if (label && title) break;
 	}
 	const name = label || title || nameOf(header, id);
+	const stepTokens = /* @__PURE__ */ new Map();
+	const closedSteps = /* @__PURE__ */ new Set();
 	for (const ev of own) {
 		const d = ev.data ?? {};
 		const turn = Number.isFinite(d.turn) ? d.turn : 0;
@@ -1665,6 +1731,7 @@ async function one(p, id, header, live) {
 					status: "running",
 					totals: zero(),
 					firstTokenMs: null,
+					decodeMs: null,
 					tokensPerSecond: null,
 					turnName: "",
 					effort,
@@ -1675,7 +1742,8 @@ async function one(p, id, header, live) {
 				byKey.set(key, rec);
 			}
 		} else if (ev.type === "assistant/chunk" || ev.type === "assistant/message" || ev.type === "assistant/attempt") {
-			rec = byKey.get(`${turn}:${step}`);
+			const key = `${turn}:${step}`;
+			rec = byKey.get(key);
 			if (!rec) {
 				rec = {
 					id: `${id}:${turn}:${step}:${ordinal++}`,
@@ -1690,6 +1758,7 @@ async function one(p, id, header, live) {
 					status: "running",
 					totals: zero(),
 					firstTokenMs: null,
+					decodeMs: null,
 					tokensPerSecond: null,
 					turnName: "",
 					effort,
@@ -1697,7 +1766,7 @@ async function one(p, id, header, live) {
 					_lastUsage: zero()
 				};
 				records.push(rec);
-				byKey.set(`${turn}:${step}`, rec);
+				byKey.set(key, rec);
 			}
 			if (r.provider) rec.provider = r.provider;
 			if (r.model) rec.model = r.model;
@@ -1706,17 +1775,22 @@ async function one(p, id, header, live) {
 			if (u) {
 				rec._lastUsage = u;
 				rec.totals = u;
-				if (positive(u) && rec.firstTokenMs === null) {
-					const rawFirst = su.firstTime ?? (typeof d.chunk?.time === "number" ? d.chunk.time : ev.time);
-					rec.firstTokenMs = Math.max(0, rawFirst - rec.startedAt);
-				}
+			}
+			const tokenAt = streamFirstTokenTime(d.stream) ?? chunkFirstTokenTime(d, ev.time);
+			if (tokenAt !== void 0) {
+				if (!stepTokens.has(key)) stepTokens.set(key, tokenAt);
+				if (rec.firstTokenMs === null) rec.firstTokenMs = Math.max(0, tokenAt - rec.startedAt);
 			}
 			if (ev.type !== "assistant/chunk") {
 				rec.finishedAt = ev.time;
 				rec.status = ev.type === "assistant/attempt" ? "failed" : "completed";
+				const stepFirst = stepTokens.get(key);
+				if (rec.status === "completed" && !closedSteps.has(key) && stepFirst !== void 0 && usageOutputTokens(d.usage) !== null) {
+					closedSteps.add(key);
+					rec.decodeMs = Math.max(0, rec.finishedAt - stepFirst);
+					if (rec.decodeMs > 0 && rec.totals.outputTokens > 0) rec.tokensPerSecond = rec.totals.outputTokens / (rec.decodeMs / 1e3);
+				}
 			}
-			const elapsedMs = rec.finishedAt === null ? null : Math.max(0, rec.finishedAt - rec.startedAt);
-			if (elapsedMs !== null && elapsedMs > 0 && rec.totals.outputTokens > 0) rec.tokensPerSecond = rec.totals.outputTokens / (elapsedMs / 1e3);
 		} else if (ev.type === "turn/end") {
 			const recs = records.filter((x) => x.turn === turn && x.status === "running");
 			for (const x of recs) {
@@ -1738,6 +1812,7 @@ async function one(p, id, header, live) {
 				status: "completed",
 				totals: u,
 				firstTokenMs: null,
+				decodeMs: null,
 				tokensPerSecond: null,
 				turnName: "",
 				effort: "",
@@ -1755,9 +1830,7 @@ async function one(p, id, header, live) {
 		});
 	}
 	const requests = records.length;
-	const firsts = records.map((x) => x.firstTokenMs).filter((x) => x !== null);
-	const outputSeconds = records.reduce((n, x) => n + x.totals.outputTokens, 0);
-	const elapsed = records.reduce((n, x) => n + (x.firstTokenMs ?? 0), 0);
+	const firsts = records.filter((x) => x.status === "completed").map((x) => x.firstTokenMs).filter((x) => x !== null);
 	for (const x of records) {
 		x.turnName = turnTopics.get(x.turn) ?? "";
 		delete x._attempt;
@@ -1771,7 +1844,7 @@ async function one(p, id, header, live) {
 		records,
 		requests,
 		averageFirstTokenMs: firsts.length ? firsts.reduce((a, b) => a + b, 0) / firsts.length : null,
-		tokensPerSecond: elapsed > 0 ? outputSeconds / (elapsed / 1e3) : null
+		tokensPerSecond: decodeRateOf(records)
 	};
 }
 async function buildSessionUsageDetail(persistence, sessions, rootId, ctx) {
@@ -1793,7 +1866,6 @@ async function buildSessionUsageDetail(persistence, sessions, rootId, ctx) {
 	}
 	const all = [rootId, ...ids];
 	const parts = await Promise.all(all.map((id) => one(persistence, id, headers.find((h) => h.id === id), live.get(id))));
-	const root = parts[0];
 	const totals = zero();
 	const models = /* @__PURE__ */ new Map();
 	const records = parts.flatMap((x) => x.records);
@@ -1852,12 +1924,13 @@ async function buildSessionUsageDetail(persistence, sessions, rootId, ctx) {
 			if (resolved) return resolved;
 		}
 	};
+	const firsts = records.filter((x) => x.status === "completed").map((x) => x.firstTokenMs).filter((x) => x !== null);
 	return {
 		sessionId: rootId,
 		totals,
 		requests: parts.reduce((n, p) => n + p.requests, 0),
-		averageFirstTokenMs: root.averageFirstTokenMs,
-		tokensPerSecond: root.tokensPerSecond,
+		averageFirstTokenMs: firsts.length ? firsts.reduce((a, b) => a + b, 0) / firsts.length : null,
+		tokensPerSecond: decodeRateOf(records),
 		subagents,
 		models: [...models.entries()].map(([model, x]) => {
 			const name = displayNameOf(model, x.providers);

package/lib/types/client/format.d.ts

@@ -7,7 +7,7 @@
  * from the shared zero-dependency module so the host and client halves share
  * one implementation.
  */
-export { providerOf, modelNameOf, normalizeModelName, daysInRange as daysBetween } from '../shared.ts';
+export { providerOf, modelNameOf, normalizeModelName, daysInRange as daysBetween, decodeRateOf } from '../shared.ts';
 /** Exact token counts with thousands separators — no 万/亿/k/M units, the
  *  user reads the precise number (long values shrink to fit via FitText).
  *  Compact units stay on the axis labels and card sub-values only. */

package/lib/types/client/session-usage-locales.d.ts

@@ -56,6 +56,9 @@ export declare const usageZh: {
     avgCache: string;
     avgRate: string;
     inProgress: string;
+    live: string;
+    asOf: string;
+    refresh: string;
 };
 export type SessionUsageKey = keyof typeof usageZh;
 export declare const usageEn: Record<SessionUsageKey, string>;

package/lib/types/client/use-session-detail.d.ts

@@ -4,5 +4,8 @@ export declare function useSessionDetail(sessionId: string): {
     detail: SessionUsageDetail | null;
     loading: boolean;
     error: boolean;
-    retry: () => void;
+    /** Manual refresh: runs now when idle, or right after an in-flight poll lands. */
+    refresh: () => void;
+    /** Wall-clock time of the last successful read, for the "as of" stamp. */
+    updatedAt: number | null;
 };

package/lib/types/shared.d.ts

@@ -18,6 +18,21 @@ export declare function providerOf(modelRef: string): string;
 /** The bare model id/name after a provider prefix. This does NOT resolve the
  *  human-readable display name; the host model metadata does that. */
 export declare function modelNameOf(modelRef: string): string;
+/** The decode accounting one request row must expose: the wall window from the
+ *  step's first token to its assembled assistant message, plus the output tokens
+ *  that window produced. */
+export interface DecodeRowLike {
+    decodeMs: number | null;
+    totals: {
+        outputTokens: number;
+    };
+}
+/** Decode throughput across rows: Σ(output tokens) / Σ(decode window), matching
+ *  the `sessionStats` projection's decodeTokens/decodeMs rate that the composer
+ *  bottom bar shows. Rows without a decode window (failed attempts, cancelled
+ *  steps, running requests) are excluded, so the card, the turn summaries and
+ *  the bottom bar all report one speed. */
+export declare function decodeRateOf(rows: readonly DecodeRowLike[]): number | null;
 /** Canonicalize a DISPLAY NAME, never a route id. Case and word separators
  *  do not distinguish models, but versions, punctuation and suffixes do:
  *  gpt-6.1-sol / GPT 6.1 sol -> gpt-6.1-sol, not gpt-6.1 or gpt-61-sol.

package/lib/types/wire.d.ts

@@ -172,6 +172,11 @@ export interface SessionUsageDetail {
         status: 'running' | 'completed' | 'failed' | 'interrupted';
         totals: SessionUsageTotals;
         firstTokenMs: number | null;
+        /** Wall window from this step's first token to the assembled assistant
+         *  message — the same decode window the `sessionStats` projection counts
+         *  (decodeMs). Null when the request never assembled a message or reported
+         *  no usage, so it stays out of every throughput quotient. */
+        decodeMs: number | null;
         tokensPerSecond: number | null;
         turnName: string;
         effort: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-token-total",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "DSH web plugin: token 用量统计看板 + 单会话（主智能体 + 子智能体）用量统计。提供今日/近3天/近7天/近1月/近3月/自定义筛选、六个汇总卡片、活跃热力图、缓存命中率折线与分模型柱状图、按模型/按供应商 Top5 列表。",
   "icon": "./icon.svg",
   "type": "module",

package/src/client/SessionUsageView.module.css

@@ -5,6 +5,15 @@
 .scroll { height:100%; min-height:0; overflow-y:auto; background:#ffffff; color:#252936; color-scheme:light; container-type:inline-size; }
 .page { box-sizing:border-box; width:100%; max-width:1160px; margin:0 auto; padding:24px 26px 32px; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; font-size:13px; }
 .page * { box-sizing:border-box; }
+/* Freshness header: live badge + last-read stamp on the left, manual refresh
+ * pinned to the right edge. */
+.head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; }
+.headStatus { display:flex; align-items:center; gap:7px; min-width:0; font-size:11px; color:#8790a3; }
+.liveDot { width:6px; height:6px; border-radius:50%; background:#18a97b; box-shadow:0 0 0 3px #e5f6f0; flex-shrink:0; }
+.asOf { color:#9aa3b3; font-variant-numeric:tabular-nums; white-space:nowrap; }
+.refresh { display:inline-flex; align-items:center; gap:5px; flex:none; color:#6f7a8d; background:#fff; border:1px solid #e4e7ee; border-radius:8px; padding:5px 11px; font:inherit; font-size:11px; cursor:pointer; }
+.refresh:hover { color:#279cb6; border-color:#cbd3e0; }
+.refresh:disabled { opacity:.55; cursor:default; }
 .scope { color:#8790a3; font-size:11px; margin:0 0 14px; }
 .stats { display:grid; gap:12px; margin-bottom:18px; }
 .statRow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
@@ -57,7 +66,7 @@
 .empty { margin:0; padding:28px 18px; color:#9aa2b1; font-size:12px; text-align:center; }
 .action { color:#818b9e; background:none; border:0; padding:3px 0; font:inherit; font-size:11px; cursor:pointer; }
 .action:hover { color:#279cb6; }
-.action:focus-visible,.turnHead:focus-visible { outline:2px solid #2ab1c6; outline-offset:-2px; }
+.action:focus-visible,.turnHead:focus-visible,.refresh:focus-visible { outline:2px solid #2ab1c6; outline-offset:-2px; }
 .turnList { padding:0 14px 14px; }
 .turn { margin-top:10px; border:1px solid #e7eaf0; border-radius:9px; background:#fff; overflow:hidden; }
 .turnHead { display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px 14px; width:100%; text-align:left; background:#f8f9fc; border:0; cursor:pointer; color:#616c7f; font:inherit; font-size:11px; }

package/src/client/SessionUsageView.tsx

@@ -2,7 +2,7 @@ import { useState } from 'react'
 import type { PropsLocale } from '@deepseek-ai/dsh-client-ui-slots'
 import type { SessionUsageDetail, SessionUsageTotals } from '../wire.ts'
 import { billedTotal, cacheHitPercentOf } from './session-usage-core.ts'
-import { formatCompact, formatTokens, normalizeModelName } from './format.ts'
+import { formatCompact, formatTokens, normalizeModelName, decodeRateOf } from './format.ts'
 import { SESSION_USAGE_NS, type SessionUsageKey } from './session-usage-locales.ts'
 import { useSessionDetail } from './use-session-detail.ts'
 import { ModelLogo } from './ModelLogo.tsx'
@@ -156,8 +156,11 @@ function Records({ detail, t }: { detail: SessionUsageDetail; t: T }): JSX.Eleme
       const totals = sum(group.rows)
       const billed = billedTotal(totals)
       const running = group.rows.filter(row => row.status === 'running').length
-      const rates = group.rows.map(row => row.tokensPerSecond).filter((n): n is number => n !== null)
-      const avgRate = rates.length ? Math.round(rates.reduce((a, b) => a + b, 0) / rates.length) : null
+      // Same decode based rate as the card and the composer bottom bar: the
+      // turn's output tokens over its summed decode windows, never the mean of
+      // independently rounded per-request rates.
+      const rate = decodeRateOf(group.rows)
+      const avgRate = rate === null ? null : Math.round(rate)
       return <article key={group.key} className={css.turn}>
         <button type="button" className={css.turnHead} onClick={() => toggle(group.key)} aria-expanded={open} aria-controls={`usage-turn-${encodeURIComponent(group.key)}`}>
           <svg className={`${css.chevron} ${open ? css.rotated : ''}`} width="12" height="12" viewBox="0 0 12 12" aria-hidden="true"><path d="m4 2 4 4-4 4" stroke="currentColor" strokeWidth="1.5" fill="none" /></svg>
@@ -172,7 +175,9 @@ function Records({ detail, t }: { detail: SessionUsageDetail; t: T }): JSX.Eleme
           </span>
         </button>
         <div id={`usage-turn-${encodeURIComponent(group.key)}`} className={css.turnBody} hidden={!open}>
-          {group.rows.map(record => {
+          {/* Requests arrive in event order, so every turn lists its newest
+              request first; turn groups themselves keep chronological order. */}
+          {group.rows.slice().reverse().map(record => {
             const duration = record.finishedAt !== null ? record.finishedAt - record.startedAt : null
             const billed = billedTotal(record.totals)
             const hit = cacheHitPercentOf(record.totals)
@@ -189,8 +194,8 @@ function Records({ detail, t }: { detail: SessionUsageDetail; t: T }): JSX.Eleme
                 <span className={`${css.statusDot} ${record.status === 'running' ? css.live : record.status === 'failed' ? css.bad : record.status === 'interrupted' ? css.muted : css.good}`} />
                 <span className={css.recordModel} title={`${record.provider} / ${record.model}`}><ModelLogo provider={record.provider} model={record.model} className={css.modelLogo} />{record.model || '—'}</span>
                 <span className={css.routeText} title={record.provider}>{providerNames.get(record.provider) || record.provider || '—'} · {modelShort(record.model) || '—'}</span>
-                {statusText !== '' && <span className={record.status === 'running' ? css.live : record.status === 'failed' ? css.bad : css.muted}>{statusText}</span>}
                 {record.effort ? <span className={css.effort}>· {record.effort}</span> : null}
+                {statusText !== '' && <span className={record.status === 'running' ? css.live : record.status === 'failed' ? css.bad : css.muted}>{statusText}</span>}
               </div>
               {record.finishedAt !== null && <div className={css.recordMeta}>{meta.map((item, i) => <span key={i} title={item.title}>{i > 0 ? ' · ' : ''}{item.text}</span>)}</div>}
             </div>
@@ -207,10 +212,24 @@ export function SessionUsageContent({ detail, t }: { detail: SessionUsageDetail;
 }
 
 export function SessionUsageView({ sessionId, t }: SessionUsageViewProps): JSX.Element {
-  const { detail, loading, error, retry } = useSessionDetail(sessionId)
+  const { detail, loading, error, refresh, updatedAt } = useSessionDetail(sessionId)
   return <div className={css.scroll} data-dsh-session-usage><div className={css.page}>
+    {/* Freshness header: the view polls continuously, so it always shows a live
+        badge with the time of the last successful read, plus a manual refresh
+        that refetches immediately. */}
+    <header className={css.head}>
+      <span className={css.headStatus}>
+        <span className={css.liveDot} aria-hidden="true" />
+        <span>{t('live')}</span>
+        {updatedAt !== null && <span className={css.asOf}>{t('asOf')} {clock(updatedAt)}</span>}
+      </span>
+      <button type="button" className={css.refresh} onClick={refresh} disabled={loading}>
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8" /><path d="M21 3v5h-5" /></svg>
+        {t('refresh')}
+      </button>
+    </header>
     {loading && <p className={css.empty} role="status">{t('loading')}</p>}
-    {error && <div className={css.error} role="status">{t('failedLoad')}<button type="button" className={css.action} onClick={retry}>{t('retry')}</button></div>}
+    {error && <div className={css.error} role="status">{t('failedLoad')}<button type="button" className={css.action} onClick={refresh}>{t('retry')}</button></div>}
     {detail && <SessionUsageContent detail={detail} t={t} />}
   </div></div>
 }

package/src/client/format.ts

@@ -10,7 +10,7 @@
 
 // Shared with the host half (src/shared.ts has no Node/DOM types, so the
 // client bundle may import it at runtime).
-export { providerOf, modelNameOf, normalizeModelName, daysInRange as daysBetween } from '../shared.ts'
+export { providerOf, modelNameOf, normalizeModelName, daysInRange as daysBetween, decodeRateOf } from '../shared.ts'
 
 /** Exact token counts with thousands separators — no 万/亿/k/M units, the
  *  user reads the precise number (long values shrink to fit via FitText).

package/src/client/session-usage-locales.ts

@@ -15,6 +15,7 @@ export const usageZh = {
   provider: '供应商', status: '状态', exact: '完整 token 数',
   answering: '正在回答...', firstWait: '首字耗时', sec: '秒', tokenWord: 'token', perSec: 'token/秒',
   cacheShort: '缓存', avgCache: '平均缓存', avgRate: '平均速率', inProgress: '个进行中',
+  live: '实时更新', asOf: '统计截至', refresh: '刷新',
 }
 export type SessionUsageKey = keyof typeof usageZh
 export const usageEn: Record<SessionUsageKey, string> = {
@@ -32,6 +33,7 @@ export const usageEn: Record<SessionUsageKey, string> = {
   provider: 'Provider', status: 'Status', exact: 'Exact token count',
   answering: 'answering...', firstWait: 'first token', sec: 's', tokenWord: 'token', perSec: 'token/s',
   cacheShort: 'cache', avgCache: 'avg cache', avgRate: 'avg rate', inProgress: 'in progress',
+  live: 'Live', asOf: 'as of', refresh: 'Refresh',
 }
 export const usageZhTW: Record<SessionUsageKey, string> = {
   ...usageZh,
@@ -47,4 +49,5 @@ export const usageZhTW: Record<SessionUsageKey, string> = {
   main: '主會話', turn: '輪', step: '步', started: '開始', duration: '耗時', firstDetail: '首 token', provider: '供應商', status: '狀態', exact: '完整 token 數',
   answering: '正在回答...', firstWait: '首字耗時', sec: '秒', tokenWord: 'token', perSec: 'token/秒',
   cacheShort: '快取', avgCache: '平均快取', avgRate: '平均速率', inProgress: '個進行中',
+  live: '即時更新', asOf: '統計截至', refresh: '重新整理',
 }

package/src/client/use-session-detail.ts

@@ -10,13 +10,17 @@ export function useSessionDetail(sessionId: string): {
   detail: SessionUsageDetail | null
   loading: boolean
   error: boolean
-  retry: () => void
+  /** Manual refresh: runs now when idle, or right after an in-flight poll lands. */
+  refresh: () => void
+  /** Wall-clock time of the last successful read, for the "as of" stamp. */
+  updatedAt: number | null
 } {
-  const [reading, setReading] = useState<{ sessionId: string; detail: SessionUsageDetail | null; error: boolean } | null>(null)
+  const [reading, setReading] = useState<{ sessionId: string; detail: SessionUsageDetail | null; error: boolean; updatedAt: number | null } | null>(null)
   const refresh = useRef<(() => void) | null>(null)
   useEffect(() => {
     let active = true
     let pending = false
+    let wantedNow = false
     let timer: ReturnType<typeof setTimeout> | undefined
     let controller: AbortController | undefined
     const request = (): void => {
@@ -25,16 +29,21 @@ export function useSessionDetail(sessionId: string): {
       pending = true
       controller = new AbortController()
       void fetchSessionDetail(sessionId, controller.signal).then(detail => {
-        if (active) setReading({ sessionId, detail, error: false })
+        if (active) setReading({ sessionId, detail, error: false, updatedAt: Date.now() })
       }).catch(() => {
-        if (active) setReading(previous => ({ sessionId, detail: previous?.sessionId === sessionId ? previous.detail : null, error: true }))
+        if (active) setReading(previous => ({ sessionId, detail: previous?.sessionId === sessionId ? previous.detail : null, error: true, updatedAt: previous?.sessionId === sessionId ? previous.updatedAt : null }))
       }).finally(() => {
         pending = false
-        if (active) timer = setTimeout(request, DETAIL_POLL_MS)
+        // A refresh pressed mid-poll skips the regular interval and refetches
+        // as soon as the in-flight answer lands, so the click never stalls.
+        if (active) timer = setTimeout(request, wantedNow ? 0 : DETAIL_POLL_MS)
+        wantedNow = false
       })
     }
     const wake = (): void => { if (document.visibilityState === 'visible') request() }
-    refresh.current = request
+    // Manual refresh: fire immediately when idle; when a poll is already in
+    // flight, mark it and refetch right after it settles.
+    refresh.current = () => { if (pending) wantedNow = true; else request() }
     document.addEventListener('visibilitychange', wake)
     request()
     return () => {
@@ -46,5 +55,5 @@ export function useSessionDetail(sessionId: string): {
     }
   }, [sessionId])
   const current = reading?.sessionId === sessionId ? reading : null
-  return { detail: current?.detail ?? null, loading: current === null, error: current?.error ?? false, retry: () => refresh.current?.() }
+  return { detail: current?.detail ?? null, loading: current === null, error: current?.error ?? false, refresh: () => refresh.current?.(), updatedAt: current?.updatedAt ?? null }
 }

package/src/model-names.ts

@@ -7,6 +7,10 @@ import { modelNameOf, providerOf } from './shared.ts'
 const LOOKUP_CONCURRENCY = 4
 const LOOKUP_TIMEOUT_MS = 2000
 
+/** Raised when a lookup's own timer fires — i.e. the shared phase budget is
+ *  spent. Workers stop on this instead of trusting the wall clock again. */
+class LookupTimeoutError extends Error {}
+
 /** Bound metadata queries even if an adapter fails to honor cancellation. */
 async function lookup<T>(read: (signal: AbortSignal) => Promise<T>, timeoutMs: number): Promise<T> {
   const controller = new AbortController()
@@ -17,7 +21,7 @@ async function lookup<T>(read: (signal: AbortSignal) => Promise<T>, timeoutMs: n
       new Promise<never>((_, reject) => {
         timer = setTimeout(() => {
           controller.abort()
-          reject(new Error('model display-name lookup timed out'))
+          reject(new LookupTimeoutError('model display-name lookup timed out'))
         }, timeoutMs)
       }),
     ])
@@ -81,8 +85,12 @@ export async function resolveModelNames(
         try {
           const info = await lookup((signal) => llm.resolveModelInfo!(providerOf(ref), modelNameOf(ref), signal), remaining)
           if (info.name?.trim()) names.set(ref, info.name)
-        } catch {
+        } catch (error) {
           // Metadata is auxiliary: never lose usage because a route is gone.
+          // The shared budget is spent once our own timer fires; stop instead
+          // of trusting the clock again (setTimeout vs Date.now can disagree
+          // by ~1ms and would otherwise queue extra lookups past the deadline).
+          if (error instanceof LookupTimeoutError) break
         }
       }
     }))
@@ -105,8 +113,10 @@ export async function resolveModelNames(
             const name = byId.get(modelNameOf(ref))
             if (name?.trim()) names.set(ref, name)
           }
-        } catch {
-          // A dormant provider must not prevent historical totals from loading.
+        } catch (error) {
+          // A dormant provider must not prevent historical totals from loading;
+          // a fired timer still ends the whole catalog phase (see above).
+          if (error instanceof LookupTimeoutError) break
         }
       }
     }))

package/src/session-detail.ts

@@ -9,6 +9,7 @@ import type {
 } from './context-types.ts'
 import { UsageFold } from './collector.ts'
 import { resolveModelNames, resolveProviderNames } from './model-names.ts'
+import { decodeRateOf } from './shared.ts'
 import type { SessionUsageDetail, SessionUsageTotals } from './wire.ts'
 
 const zero = (): SessionUsageTotals => ({ uncachedInputTokens: 0, outputTokens: 0, cacheReadTokens: 0, cacheWriteTokens: 0 })
@@ -20,20 +21,65 @@ function usageOf(x: any): SessionUsageTotals {
   const u = x?.usage ?? x
   return { uncachedInputTokens: Number(u?.inputTokens) || 0, outputTokens: Number(u?.outputTokens) || 0, cacheReadTokens: Number(u?.cacheReadTokens) || 0, cacheWriteTokens: Number(u?.cacheWriteTokens) || 0 }
 }
-function positive(u: SessionUsageTotals): boolean { return u.uncachedInputTokens + u.outputTokens + u.cacheReadTokens + u.cacheWriteTokens > 0 }
 function routeOf(x: any): { provider: string; model: string } {
   const source = x?.message?.source ?? x?.source ?? x?.request ?? x?.context ?? x
   return { provider: typeof source?.provider === 'string' ? source.provider : '', model: typeof source?.model === 'string' ? source.model : '' }
 }
-function streamUsage(data: any): { usage?: SessionUsageTotals; firstTime?: number } {
-  let firstTime: number | undefined
+/** Whether one stream chunk carries the model's first output token. Mirrors
+ *  `isTokenDelta` in @deepseek-ai/dsh-llm so the decode window starts on the
+ *  same chunk the official `sessionStats` projection starts it on. */
+function isTokenDelta(chunk: any): boolean {
+  switch (chunk?.type) {
+    case 'text-delta': case 'reasoning-delta': return chunk.text !== ''
+    case 'tool-call-delta': return chunk.argumentsDelta !== '' || chunk.name !== undefined
+    default: return false
+  }
+}
+/** Reconstructed time of the first token in one packed delta run (mirrors
+ *  `runFirstTokenTime`): a name-bearing tool-call run starts at its first
+ *  member, every other run at its first non-empty fragment. */
+function runFirstTokenTime(run: any): number | undefined {
+  if (run?.type === 'tool-call-chunks' && run.name !== undefined) return run.time0
+  const fragments = run?.type === 'tool-call-chunks' ? run.args : run?.texts
+  if (!Array.isArray(fragments)) return undefined
+  let time = Number(run.time0)
+  for (let i = 0; i < fragments.length; i++) {
+    if (i > 0) time += Number(run.dt?.[i - 1]) || 0
+    if (fragments[i] !== '') return time
+  }
+  return undefined
+}
+/** Time of the first token in one compact attempt stream (mirrors
+ *  `assistantStreamFirstTokenTime`). */
+function streamFirstTokenTime(stream: any): number | undefined {
+  for (const r of Array.isArray(stream) ? stream : []) {
+    const t = r?.type === 'chunk' ? (isTokenDelta(r.chunk) ? r.time : undefined) : runFirstTokenTime(r)
+    if (typeof t === 'number' && Number.isFinite(t)) return t
+  }
+  return undefined
+}
+/** Time of the first token carried by one live `assistant/chunk` payload. */
+function chunkFirstTokenTime(data: any, fallback: number): number | undefined {
+  const c = data?.chunk
+  if (!c) return undefined
+  const timed = c.chunk && typeof c.time === 'number' ? c : null
+  if (!isTokenDelta(timed ? timed.chunk : c)) return undefined
+  return timed ? timed.time : typeof c.time === 'number' ? c.time : fallback
+}
+function streamUsage(data: any): { usage?: SessionUsageTotals; raw?: any } {
   let usage: SessionUsageTotals | undefined
+  let raw: any
   for (const r of Array.isArray(data?.stream) ? data.stream : []) {
-    const t = typeof r?.time === 'number' ? r.time : undefined
-    if (firstTime === undefined && t !== undefined && (r?.type === 'chunk' || r?.chunk?.type === 'text' || r?.chunk?.type === 'content')) firstTime = t
-    if (r?.type === 'chunk' && r?.chunk?.type === 'usage') usage = usageOf(r.chunk)
+    if (r?.type === 'chunk' && r?.chunk?.type === 'usage') { usage = usageOf(r.chunk); raw = r.chunk.usage ?? r.chunk }
   }
-  return { usage, firstTime }
+  return { usage, raw }
+}
+/** Provider-reported completion tokens, or null when unreported or invalid:
+ *  an invalid count must not enter the decode quotient (mirrors
+ *  `usageOutputTokens` in the sessionStats projection). */
+function usageOutputTokens(x: any): number | null {
+  const value = (x?.usage ?? x)?.outputTokens
+  return typeof value === 'number' && Number.isFinite(value) && value >= 0 ? value : null
 }
 function headerOf(item: UsageSessionHeader | UsageSessionSnapshot): UsageSessionHeader | null {
   const x: any = item
@@ -83,6 +129,12 @@ async function one(p: UsageSessionPersistence, id: string, header: UsageSessionH
     if (label && title) break
   }
   const name = label || title || nameOf(header, id)
+  // Decode accounting mirrors the official `sessionStats` projection: a step
+  // records its first token once (the earliest attempt wins, surviving an
+  // in-step retry), and only the assembled `assistant/message` closes the
+  // decode window, so failed attempts and cancelled steps stay uncounted.
+  const stepTokens = new Map<string, number>()
+  const closedSteps = new Set<string>()
   for (const ev of own) {
     const d: any = ev.data ?? {}; const turn = Number.isFinite(d.turn) ? d.turn : 0; const step = Number.isFinite(d.step) ? d.step : 0
     if (ev.type === 'request/context') { route = { ...route, ...routeOf(d) }; continue }
@@ -110,28 +162,41 @@ async function one(p: UsageSessionPersistence, id: string, header: UsageSessionH
       if (ev.type === 'llm/retry-started' || !byKey.has(key)) {
         const previous = byKey.get(key)
         if (previous && ev.type === 'llm/retry-started' && previous.status === 'running') { previous.status = 'failed'; previous.finishedAt = ev.time }
-        rec = { id: `${id}:${turn}:${step}:${ordinal++}`, sessionId: id, sessionName: name, turn, step, startedAt: ev.time, finishedAt: null, provider: r.provider || route.provider || '', model: r.model || route.model || '', status: 'running', totals: zero(), firstTokenMs: null, tokensPerSecond: null, turnName: '', effort, _attempt: ev.type === 'llm/retry-started' ? 1 : 0, _lastUsage: zero() }
+        rec = { id: `${id}:${turn}:${step}:${ordinal++}`, sessionId: id, sessionName: name, turn, step, startedAt: ev.time, finishedAt: null, provider: r.provider || route.provider || '', model: r.model || route.model || '', status: 'running', totals: zero(), firstTokenMs: null, decodeMs: null, tokensPerSecond: null, turnName: '', effort, _attempt: ev.type === 'llm/retry-started' ? 1 : 0, _lastUsage: zero() }
         records.push(rec); byKey.set(key, rec)
       }
     } else if (ev.type === 'assistant/chunk' || ev.type === 'assistant/message' || ev.type === 'assistant/attempt') {
-      rec = byKey.get(`${turn}:${step}`)
-      if (!rec) { rec = { id: `${id}:${turn}:${step}:${ordinal++}`, sessionId: id, sessionName: name, turn, step, startedAt: ev.time, finishedAt: null, provider: r.provider || route.provider || '', model: r.model || route.model || '', status: 'running', totals: zero(), firstTokenMs: null, tokensPerSecond: null, turnName: '', effort, _attempt: 0, _lastUsage: zero() }; records.push(rec); byKey.set(`${turn}:${step}`, rec) }
+      const key = `${turn}:${step}`
+      rec = byKey.get(key)
+      if (!rec) { rec = { id: `${id}:${turn}:${step}:${ordinal++}`, sessionId: id, sessionName: name, turn, step, startedAt: ev.time, finishedAt: null, provider: r.provider || route.provider || '', model: r.model || route.model || '', status: 'running', totals: zero(), firstTokenMs: null, decodeMs: null, tokensPerSecond: null, turnName: '', effort, _attempt: 0, _lastUsage: zero() }; records.push(rec); byKey.set(key, rec) }
       if (r.provider) rec.provider = r.provider; if (r.model) rec.model = r.model
       const su = streamUsage(d); const u = ev.type === 'assistant/message' ? (d.usage ? usageOf(d) : su.usage) : ev.type === 'assistant/chunk' ? (d.chunk?.type === 'usage' ? usageOf(d.chunk) : undefined) : (d.usage ? usageOf(d) : su.usage)
-      if (u) {
-        rec._lastUsage = u; rec.totals = u
-        if (positive(u) && rec.firstTokenMs === null) {
-          const rawFirst = su.firstTime ?? (typeof d.chunk?.time === 'number' ? d.chunk.time : ev.time)
-          rec.firstTokenMs = Math.max(0, rawFirst - rec.startedAt)
+      if (u) { rec._lastUsage = u; rec.totals = u }
+      // The first token opens both this row's first-token wait and the step's
+      // decode window; the earliest attempt keeps it across an in-step retry.
+      const tokenAt = streamFirstTokenTime(d.stream) ?? chunkFirstTokenTime(d, ev.time)
+      if (tokenAt !== undefined) {
+        if (!stepTokens.has(key)) stepTokens.set(key, tokenAt)
+        if (rec.firstTokenMs === null) rec.firstTokenMs = Math.max(0, tokenAt - rec.startedAt)
+      }
+      if (ev.type !== 'assistant/chunk') {
+        rec.finishedAt = ev.time; rec.status = ev.type === 'assistant/attempt' ? 'failed' : 'completed'
+        // Only an assembled message closes the decode window, and only its own
+        // top-level `usage` counts, exactly as the official sessionStats
+        // projection counts it: a failed attempt, a cancelled step or a
+        // stream-only usage sample contributes no decode time, so the card, the
+        // turn summaries and the composer bottom bar all quote one speed.
+        const stepFirst = stepTokens.get(key)
+        if (rec.status === 'completed' && !closedSteps.has(key) && stepFirst !== undefined && usageOutputTokens(d.usage) !== null) {
+          closedSteps.add(key)
+          rec.decodeMs = Math.max(0, rec.finishedAt - stepFirst)
+          if (rec.decodeMs > 0 && rec.totals.outputTokens > 0) rec.tokensPerSecond = rec.totals.outputTokens / (rec.decodeMs / 1000)
         }
       }
-      if (ev.type !== 'assistant/chunk') { rec.finishedAt = ev.time; rec.status = ev.type === 'assistant/attempt' ? 'failed' : 'completed' }
-      const elapsedMs = rec.finishedAt === null ? null : Math.max(0, rec.finishedAt - rec.startedAt)
-      if (elapsedMs !== null && elapsedMs > 0 && rec.totals.outputTokens > 0) rec.tokensPerSecond = rec.totals.outputTokens / (elapsedMs / 1000)
     } else if (ev.type === 'turn/end') {
       const recs = records.filter(x => x.turn === turn && x.status === 'running'); for (const x of recs) { x.status = 'interrupted'; x.finishedAt = ev.time }
     } else if (ev.type === 'compaction/summary') {
-      const u = usageOf(d); rec = { id: `${id}:compaction:${ordinal++}`, sessionId: id, sessionName: name, turn: 0, step: 0, startedAt: ev.time, finishedAt: ev.time, provider: typeof d.provider === 'string' ? d.provider : '', model: typeof d.model === 'string' ? d.model : '', status: 'completed', totals: u, firstTokenMs: null, tokensPerSecond: null, turnName: '', effort: '', _attempt: 0, _lastUsage: u }; records.push(rec)
+      const u = usageOf(d); rec = { id: `${id}:compaction:${ordinal++}`, sessionId: id, sessionName: name, turn: 0, step: 0, startedAt: ev.time, finishedAt: ev.time, provider: typeof d.provider === 'string' ? d.provider : '', model: typeof d.model === 'string' ? d.model : '', status: 'completed', totals: u, firstTokenMs: null, decodeMs: null, tokensPerSecond: null, turnName: '', effort: '', _attempt: 0, _lastUsage: u }; records.push(rec)
     }
     const sample = fold.fold(ev); if (sample && !sample.turn) add(totals, { uncachedInputTokens: sample.inputTokens, outputTokens: sample.outputTokens, cacheReadTokens: sample.cacheReadTokens, cacheWriteTokens: sample.cacheWriteTokens })
   }
@@ -139,11 +204,11 @@ async function one(p: UsageSessionPersistence, id: string, header: UsageSessionH
   // a stream sample disappear, so reconcile aggregate totals from the records only
   // for presentation while `totals` remains the authoritative UsageFold result.
   const requests = records.length
-  const firsts = records.map(x => x.firstTokenMs).filter((x): x is number => x !== null)
-  const outputSeconds = records.reduce((n, x) => n + x.totals.outputTokens, 0)
-  const elapsed = records.reduce((n, x) => n + (x.firstTokenMs ?? 0), 0)
+  // The first-token average quotes answered requests only: a failed attempt or
+  // a cancelled step is not a wait the reader experienced as an answer.
+  const firsts = records.filter(x => x.status === 'completed').map(x => x.firstTokenMs).filter((x): x is number => x !== null)
   for (const x of records) { x.turnName = turnTopics.get(x.turn) ?? ''; delete (x as any)._attempt; delete (x as any)._lastUsage }
-  return { id, name, header, totals, records: records as SessionUsageDetail['records'], requests, averageFirstTokenMs: firsts.length ? firsts.reduce((a, b) => a + b, 0) / firsts.length : null, tokensPerSecond: elapsed > 0 ? outputSeconds / (elapsed / 1000) : null }
+  return { id, name, header, totals, records: records as SessionUsageDetail['records'], requests, averageFirstTokenMs: firsts.length ? firsts.reduce((a, b) => a + b, 0) / firsts.length : null, tokensPerSecond: decodeRateOf(records) }
 }
 
 export async function buildSessionUsageDetail(persistence: UsageSessionPersistence, sessions: UsageSessionStore | undefined, rootId: string, ctx?: Context): Promise<SessionUsageDetail> {
@@ -155,7 +220,7 @@ export async function buildSessionUsageDetail(persistence: UsageSessionPersisten
   const ids: string[] = []; const seen = new Set([rootId]); const q = [rootId]
   while (q.length) for (const c of children.get(q.shift()!) ?? []) if (!seen.has(c)) { seen.add(c); ids.push(c); q.push(c) }
   const all = [rootId, ...ids]; const parts = await Promise.all(all.map(id => one(persistence, id, headers.find(h => h.id === id), live.get(id))))
-  const root = parts[0]; const totals = zero(); const models = new Map<string, { totals: SessionUsageTotals; requests: number; providers: Set<string> }>(); const records = parts.flatMap(x => x.records); for (const p of parts) add(totals, p.totals)
+  const totals = zero(); const models = new Map<string, { totals: SessionUsageTotals; requests: number; providers: Set<string> }>(); const records = parts.flatMap(x => x.records); for (const p of parts) add(totals, p.totals)
   for (const r of records) { const key = r.model || '(unknown)'; const m = models.get(key) ?? { totals: zero(), requests: 0, providers: new Set<string>() }; add(m.totals, r.totals); m.requests++; if (r.provider) m.providers.add(r.provider); models.set(key, m) }
   const subagents = parts.slice(1).map(p => ({ sessionId: p.id, name: p.name, totals: p.totals, requests: p.requests, averageFirstTokenMs: p.averageFirstTokenMs, tokensPerSecond: p.tokensPerSecond }))
   const routeMap = new Map<string, SessionUsageDetail['routes'][number]>()
@@ -178,5 +243,8 @@ export async function buildSessionUsageDetail(persistence: UsageSessionPersisten
     for (const key of keys) { const resolved = names.get(key)?.trim(); if (resolved) return resolved }
     return undefined
   }
-  return { sessionId: rootId, totals, requests: parts.reduce((n, p) => n + p.requests, 0), averageFirstTokenMs: root.averageFirstTokenMs, tokensPerSecond: root.tokensPerSecond, subagents, models: [...models.entries()].map(([model, x]) => { const name = displayNameOf(model, x.providers); return { model, ...(name ? { name } : {}), providers: [...x.providers].map(provider => providerNames[provider] || provider), totals: x.totals, requests: x.requests } }), records, routes: [...routeMap.values()] }
+  // The card is scoped to this session and every subagent, so its speed and
+  // first-token average fold the same records its token totals do.
+  const firsts = records.filter(x => x.status === 'completed').map(x => x.firstTokenMs).filter((x): x is number => x !== null)
+  return { sessionId: rootId, totals, requests: parts.reduce((n, p) => n + p.requests, 0), averageFirstTokenMs: firsts.length ? firsts.reduce((a, b) => a + b, 0) / firsts.length : null, tokensPerSecond: decodeRateOf(records), subagents, models: [...models.entries()].map(([model, x]) => { const name = displayNameOf(model, x.providers); return { model, ...(name ? { name } : {}), providers: [...x.providers].map(provider => providerNames[provider] || provider), totals: x.totals, requests: x.requests } }), records, routes: [...routeMap.values()] }
 }

package/src/shared.ts

@@ -53,6 +53,29 @@ export function modelNameOf(modelRef: string): string {
   return modelRef
 }
 
+/** The decode accounting one request row must expose: the wall window from the
+ *  step's first token to its assembled assistant message, plus the output tokens
+ *  that window produced. */
+export interface DecodeRowLike {
+  decodeMs: number | null
+  totals: { outputTokens: number }
+}
+
+/** Decode throughput across rows: Σ(output tokens) / Σ(decode window), matching
+ *  the `sessionStats` projection's decodeTokens/decodeMs rate that the composer
+ *  bottom bar shows. Rows without a decode window (failed attempts, cancelled
+ *  steps, running requests) are excluded, so the card, the turn summaries and
+ *  the bottom bar all report one speed. */
+export function decodeRateOf(rows: readonly DecodeRowLike[]): number | null {
+  let ms = 0
+  let tokens = 0
+  // typeof, not `!== null`: a bundle newer than the payload it is handed (a
+  // cached detail, an older server) leaves `decodeMs` absent, and one absent
+  // field must not turn the whole sum into NaN.
+  for (const row of rows) if (typeof row.decodeMs === 'number' && Number.isFinite(row.decodeMs)) { ms += row.decodeMs; tokens += row.totals.outputTokens }
+  return ms > 0 ? tokens / (ms / 1000) : null
+}
+
 /** Canonicalize a DISPLAY NAME, never a route id. Case and word separators
  *  do not distinguish models, but versions, punctuation and suffixes do:
  *  gpt-6.1-sol / GPT 6.1 sol -> gpt-6.1-sol, not gpt-6.1 or gpt-61-sol.

package/src/wire.ts

@@ -179,6 +179,11 @@ export interface SessionUsageDetail {
     status: 'running' | 'completed' | 'failed' | 'interrupted'
     totals: SessionUsageTotals
     firstTokenMs: number | null
+    /** Wall window from this step's first token to the assembled assistant
+     *  message — the same decode window the `sessionStats` projection counts
+     *  (decodeMs). Null when the request never assembled a message or reported
+     *  no usage, so it stays out of every throughput quotient. */
+    decodeMs: number | null
     tokensPerSecond: number | null
     turnName: string
     effort: string