@ychris12138/dsh-usage-stats 0.2.10 → 0.3.0

package/lib/client.js

@@ -31,6 +31,15 @@ window.__ModuleLoader__.load({
 			".usg_badgeOk{color:var(--dsw-alias-state-success-primary)}",
 			".usg_badgeBad{color:var(--dsw-alias-state-error-primary)}",
 			".usg_badgeCount{color:var(--dsw-alias-label-tertiary);font-variant-numeric:tabular-nums;flex:none;margin-left:auto;font-size:12px;line-height:16px}",
+			".usg_sessionPill{box-sizing:border-box;max-width:220px;height:28px;color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-fill-l1,transparent);border:1px solid var(--dsw-alias-border-l2);border-radius:999px;align-items:center;gap:5px;padding:0 8px;font:inherit;font-size:11px;line-height:16px;cursor:pointer;display:inline-flex;white-space:nowrap;overflow:hidden}",
+			".usg_sessionPill:hover{background:var(--dsw-alias-interactive-bg-hover)}",
+			".usg_sessionPill:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:1px}",
+			".usg_sessionPill[data-tone=normal]{color:var(--dsw-alias-label-secondary)}",
+			".usg_sessionPill[data-tone=warning]{color:var(--dsw-alias-state-warn-label,var(--dsw-alias-state-warn-primary));border-color:var(--dsw-alias-state-warn-secondary,var(--dsw-alias-border-l2))}",
+			".usg_sessionPill[data-tone=critical]{color:var(--dsw-alias-state-error-primary);border-color:var(--dsw-alias-state-error-secondary,var(--dsw-alias-border-l2))}",
+			".usg_sessionPillProvider{max-width:88px;color:var(--dsw-alias-label-primary);font-weight:500;text-overflow:ellipsis;overflow:hidden}",
+			".usg_sessionPillSeparator{color:var(--dsw-alias-label-caption);flex:none}",
+			".usg_sessionPillValue{max-width:112px;font-variant-numeric:tabular-nums;text-overflow:ellipsis;overflow:hidden}",
 			".usg_layer.usg_rail{width:36px;height:36px;margin:0}",
 			".usg_layer.usg_rail .usg_badge{border-radius:50%;justify-content:center;gap:0;width:36px;height:36px;padding:0}",
 			".usg_layer.usg_rail .usg_footerButtons{flex-direction:column;gap:2px}",
@@ -59,6 +68,9 @@ window.__ModuleLoader__.load({
 			".usg_providerPickerLabel{color:var(--dsw-alias-label-tertiary);flex:none}",
 			".usg_providerSelect{box-sizing:border-box;min-width:0;flex:1;color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-overlay,var(--dsw-alias-bg-base));border:1px solid var(--dsw-alias-border-l2);border-radius:8px;padding:4px 6px;font:inherit;font-size:12px;line-height:18px}",
 			".usg_accountGrid{flex-direction:column;gap:8px;display:flex}",
+			".usg_exportLinks{display:flex;flex-wrap:wrap;gap:6px}",
+			".usg_exportLink{color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-fill-l1,transparent);border:1px solid var(--dsw-alias-border-l2);border-radius:7px;padding:4px 7px;font-size:11px;line-height:16px;text-decoration:none}",
+			".usg_exportLink:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}",
 			".usg_accountCard{--usg-providerAccent:#1f6feb;box-sizing:border-box;border:1px solid var(--dsw-alias-border-l2);background:linear-gradient(135deg,color-mix(in srgb,var(--usg-providerAccent) 8%,transparent),transparent 42%);border-radius:12px;padding:10px 11px;display:flex;flex-direction:column;gap:9px}",
 			".usg_accountCard[data-provider=deepseek],.usg_accountCard[data-provider=deepseek-official]{--usg-providerAccent:#1f6feb}",
 			".usg_accountCard[data-provider=opencode-go]{--usg-providerAccent:#00a67d}",
@@ -73,6 +85,9 @@ window.__ModuleLoader__.load({
 			".usg_accountPlan{color:var(--dsw-alias-label-tertiary);text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:14px;overflow:hidden}",
 			".usg_accountStatus{color:var(--dsw-alias-label-tertiary);background:var(--dsw-alias-fill-l2);border-radius:999px;padding:2px 7px;font-size:10px;line-height:16px;white-space:nowrap}",
 			".usg_accountStatus[data-status=ok]{color:var(--usg-providerAccent);background:color-mix(in srgb,var(--usg-providerAccent) 12%,transparent)}",
+			".usg_accountHealth{border-top:1px solid var(--dsw-alias-border-l1);grid-template-columns:auto minmax(0,1fr);gap:3px 10px;margin:2px 0 0;padding-top:7px;display:grid}",
+			".usg_accountHealth dt{color:var(--dsw-alias-label-caption);font-size:10px;line-height:15px}",
+			".usg_accountHealth dd{color:var(--dsw-alias-label-secondary);min-width:0;margin:0;font-size:10px;line-height:15px;text-align:right;overflow-wrap:anywhere}",
 			".usg_quotaList{flex-direction:column;gap:8px;display:flex}",
 			".usg_quotaRow{display:flex;flex-direction:column;gap:4px}",
 			".usg_quotaMeta{align-items:baseline;gap:8px;display:flex}",
@@ -155,6 +170,10 @@ window.__ModuleLoader__.load({
 			badgeOk: "usg_badgeOk",
 			badgeBad: "usg_badgeBad",
 			badgeCount: "usg_badgeCount",
+			sessionPill: "usg_sessionPill",
+			sessionPillProvider: "usg_sessionPillProvider",
+			sessionPillSeparator: "usg_sessionPillSeparator",
+			sessionPillValue: "usg_sessionPillValue",
 			panel: "usg_panel",
 			header: "usg_header",
 			headerLeft: "usg_headerLeft",
@@ -171,6 +190,8 @@ window.__ModuleLoader__.load({
 			providerPickerLabel: "usg_providerPickerLabel",
 			providerSelect: "usg_providerSelect",
 			accountGrid: "usg_accountGrid",
+			exportLinks: "usg_exportLinks",
+			exportLink: "usg_exportLink",
 			accountCard: "usg_accountCard",
 			accountHead: "usg_accountHead",
 			accountMark: "usg_accountMark",
@@ -178,6 +199,7 @@ window.__ModuleLoader__.load({
 			accountName: "usg_accountName",
 			accountPlan: "usg_accountPlan",
 			accountStatus: "usg_accountStatus",
+			accountHealth: "usg_accountHealth",
 			quotaList: "usg_quotaList",
 			quotaRow: "usg_quotaRow",
 			quotaMeta: "usg_quotaMeta",
@@ -301,6 +323,21 @@ window.__ModuleLoader__.load({
 			}
 		}
 
+		function budgetWindowText(period, window, translate) {
+			if (window === null || typeof window !== "object" || window.limit === null || window.limit === void 0) return null;
+			const spent = window.costComplete === true ? fmtCurrency(window.estimatedSpend, window.currency) : "—";
+			const limit = fmtCurrency(window.limit, window.currency);
+			const level = ["normal", "warning", "critical"].includes(window.level)
+				? translate(`budget.level.${window.level}`)
+				: translate("budget.level.unknown");
+			return translate("budget.summary", {
+				period: translate(`budget.period.${period}`),
+				spent,
+				limit,
+				level
+			});
+		}
+
 		/**
 		 * Collapsed-badge account value, derived from the unified v0.2.0 account
 		 * snapshot. Balance providers show a real-currency amount; subscription /
@@ -367,13 +404,25 @@ window.__ModuleLoader__.load({
 			return !inside(layer) && !inside(panel);
 		}
 
+		const SAFE_DIAGNOSTIC_REASONS = new Set([
+			"dns-resolution-failed",
+			"timeout",
+			"rate-limited",
+			"unauthorized",
+			"upstream-invalid-json",
+			"upstream-not-json",
+			"upstream-too-large",
+			"upstream-invalid-response",
+			"blocked-network",
+			"all-addresses-unreachable",
+			"no-validated-address",
+			"sub2api-balance-shape-unrecognized",
+			"unknown"
+		]);
+
 		/** Defense-in-depth filter for server-provided, secret-free diagnostic reasons. */
 		function safeDiagnosticReason(reason) {
-			if (typeof reason !== "string") return null;
-			const value = reason.trim();
-			if (value === "" || value.length > 160) return null;
-			if (/(authorization|bearer\s|api[_-]?key|cookie|token\s*[=:]|sk-[a-z0-9])/i.test(value)) return null;
-			return value;
+			return typeof reason === "string" && SAFE_DIAGNOSTIC_REASONS.has(reason) ? reason : null;
 		}
 
 		function diagnosticReasonText(reason, translate) {
@@ -383,8 +432,15 @@ window.__ModuleLoader__.load({
 			if (value === "all-addresses-unreachable") return translate("account.reason.allAddressesUnreachable");
 			if (value === "upstream-not-json") return translate("account.reason.upstreamNotJson");
 			if (value === "upstream-invalid-json") return translate("account.reason.upstreamInvalidJson");
+			if (value === "upstream-too-large") return translate("account.reason.upstreamTooLarge");
+			if (value === "upstream-invalid-response") return translate("account.reason.upstreamInvalidResponse");
+			if (value === "timeout") return translate("account.reason.timeout");
+			if (value === "rate-limited") return translate("account.reason.rateLimited");
+			if (value === "unauthorized") return translate("account.reason.unauthorized");
+			if (value === "blocked-network") return translate("account.reason.blockedNetwork");
+			if (value === "no-validated-address") return translate("account.reason.noValidatedAddress");
 			if (value === "sub2api-balance-shape-unrecognized") return translate("account.reason.sub2apiBalanceShapeUnrecognized");
-			return value;
+			return translate("account.reason.unknown");
 		}
 
 		/**
@@ -412,6 +468,264 @@ window.__ModuleLoader__.load({
 			return payload;
 		}
 
+		//#region CurrentSessionPill
+		/**
+		 * Compact event signature from the formal composer slot's point-in-time
+		 * session snapshot. These fields change at turn/message boundaries where
+		 * the server-side currentRoute can change, without reacting to every input
+		 * keystroke or adding a timer/DOM observer.
+		 */
+		function sessionContextSignalOf(session) {
+			const nodes = Array.isArray(session?.nodes) ? session.nodes.length : 0;
+			const order = Array.isArray(session?.chat?.order) ? session.chat.order.length : 0;
+			return `${session?.running === true ? 1 : 0}:${nodes}:${order}:${session?.partial === null || session?.partial === void 0 ? 0 : 1}:${session?.removed === true ? 1 : 0}`;
+		}
+
+		/** Event signature from DSH's existing per-session model selector store. */
+		function modelSelectionSignalOf(snapshot) {
+			const provider = typeof snapshot?.current?.provider === "string" ? snapshot.current.provider : "";
+			const model = typeof snapshot?.current?.model === "string" ? snapshot.current.model : "";
+			return JSON.stringify([provider, model]);
+		}
+
+		/** Stable signature for DSH's native cumulative tokenUsage projection. */
+		function tokenUsageSignalOf(projection) {
+			return JSON.stringify([
+				projection?.uncachedInputTokens,
+				projection?.outputTokens,
+				projection?.cacheReadTokens,
+				projection?.cacheWriteTokens
+			]);
+		}
+
+		function projectionBucketsOf(projection) {
+			const pairs = [
+				["inputTokens", projection?.uncachedInputTokens],
+				["outputTokens", projection?.outputTokens],
+				["cacheReadTokens", projection?.cacheReadTokens],
+				["cacheWriteTokens", projection?.cacheWriteTokens]
+			];
+			const buckets = {};
+			for (const [key, value] of pairs) {
+				if (typeof value !== "number" || !Number.isFinite(value) || value < 0) return null;
+				buckets[key] = value;
+			}
+			return buckets;
+		}
+
+		/**
+		 * The browser never prices cumulative tokens. It displays the server's
+		 * event-time estimate only when its folded buckets exactly match DSH's
+		 * native current-session projection.
+		 */
+		function currentSessionCostLabel(session, projection) {
+			const buckets = projectionBucketsOf(projection);
+			if (session === null || typeof session !== "object" || buckets === null) return "—";
+			for (const key of ["inputTokens", "outputTokens", "cacheReadTokens", "cacheWriteTokens"]) {
+				if (session[key] !== buckets[key]) return "—";
+			}
+			if (session.costComplete !== true || typeof session.estimatedCost !== "number" || !Number.isFinite(session.estimatedCost)
+				|| typeof session.currency !== "string" || session.currency === "") return "—";
+			return `≈${fmtCurrency(session.estimatedCost, session.currency)}`;
+		}
+
+		/**
+		 * Resolve one explicit DSH session through the server-owned identity and
+		 * account protocols. The account endpoint reads AccountService's existing
+		 * cache; this function owns no provider mapping, credential, or cache.
+		 */
+		async function loadSessionPillSnapshot(sessionId, request = fetchJson, selectedRoute = null) {
+			if (typeof sessionId !== "string" || sessionId === "") return null;
+			const selectionQuery = typeof selectedRoute?.provider === "string" && selectedRoute.provider !== ""
+				&& typeof selectedRoute.model === "string" && selectedRoute.model !== ""
+				? `&provider=${encodeURIComponent(selectedRoute.provider)}&model=${encodeURIComponent(selectedRoute.model)}`
+				: "";
+			const contextPayload = await request(`/api/usage-stats/session-context?session=${encodeURIComponent(sessionId)}${selectionQuery}`);
+			if (contextPayload?.ok !== true || contextPayload.context === null || typeof contextPayload.context !== "object") return null;
+			const context = contextPayload.context;
+			const accountId = typeof context.accountId === "string" && context.accountId !== ""
+				? context.accountId
+				: typeof context.providerId === "string" && context.providerId !== "" ? context.providerId : null;
+			if (accountId === null) return null;
+			try {
+				const accountPayload = await request(`/api/usage-stats/account?provider=${encodeURIComponent(accountId)}&activity=active`);
+				if (accountPayload?.ok === true && accountPayload.account !== null && typeof accountPayload.account === "object") {
+					return { context, account: accountPayload.account };
+				}
+				return {
+					context,
+					account: null,
+					status: accountPayload?.error === "unknown-provider" ? "unsupported" : "unavailable"
+				};
+			} catch {
+				return { context, account: null, status: "unavailable" };
+			}
+		}
+
+		function percentLabel(value) {
+			return `${value.toFixed(value % 1 === 0 ? 0 : 1)}%`;
+		}
+
+		/** Reduce a server snapshot to display-only fields; never retain secrets. */
+		function sessionPillViewOf(snapshot, translate, now = Date.now()) {
+			if (snapshot === null || snapshot === void 0 || snapshot.context === null || typeof snapshot.context !== "object") return null;
+			const account = snapshot.account !== null && typeof snapshot.account === "object" ? snapshot.account : null;
+			const providerId = typeof snapshot.context.accountId === "string" && snapshot.context.accountId !== ""
+				? snapshot.context.accountId
+				: typeof snapshot.context.providerId === "string" && snapshot.context.providerId !== "" ? snapshot.context.providerId : null;
+			if (providerId === null) return null;
+			const providerLabel = typeof account?.displayName === "string" && account.displayName !== ""
+				? account.displayName
+				: typeof snapshot.context.providerId === "string" && snapshot.context.providerId !== "" ? snapshot.context.providerId : providerId;
+			let status = typeof account?.status === "string" ? account.status : typeof snapshot.status === "string" ? snapshot.status : "unavailable";
+			const costLabel = currentSessionCostLabel(snapshot.context.session, snapshot.tokenUsage);
+			if (account?.stale === true && status === "ok") status = "unavailable";
+			if (status !== "ok") {
+				const accountValue = status === "unsupported"
+					? translate("sessionPill.status.unsupported")
+					: subscriptionStatusLabel(status, translate);
+				const value = `${accountValue} · ${costLabel}`;
+				return {
+					providerId,
+					providerLabel,
+					status,
+					value,
+					tone: "neutral",
+					ariaLabel: translate("sessionPill.aria", { provider: providerLabel, value })
+				};
+			}
+
+			let value = null;
+			let auxiliaryLabel = "";
+			if (account?.mode === "subscription") {
+				const windows = Array.isArray(account.windows)
+					? account.windows.filter((entry) => entry !== null && typeof entry === "object" && typeof entry.remainingPercent === "number" && Number.isFinite(entry.remainingPercent))
+					: [];
+				const tightest = windows.reduce((current, entry) => current === null || entry.remainingPercent < current.remainingPercent ? entry : current, null);
+				if (tightest !== null) {
+					value = `${quotaLabel(tightest.kind, translate)} · ${percentLabel(tightest.remainingPercent)}`;
+					auxiliaryLabel = resetLabel(tightest.resetsAt, translate, now);
+				}
+			} else if (account?.balance?.unlimited === true) {
+				value = "∞";
+			} else if (account?.balance !== null && account?.balance !== void 0 && account.balance.remaining !== null && account.balance.remaining !== void 0 && Number.isFinite(Number(account.balance.remaining))) {
+				value = fmtCurrency(account.balance.remaining, account.balance.currency);
+			}
+
+			if (value === null) {
+				const invalid = translate("account.status.invalidResponse");
+				const invalidValue = `${invalid} · ${costLabel}`;
+				return {
+					providerId,
+					providerLabel,
+					status: "invalid-response",
+					value: invalidValue,
+					tone: "neutral",
+					ariaLabel: translate("sessionPill.aria", { provider: providerLabel, value: invalidValue })
+				};
+			}
+			const alertLevel = account?.alert?.level;
+			const tone = alertLevel === "normal" || alertLevel === "warning" || alertLevel === "critical" ? alertLevel : "neutral";
+			value = `${value} · ${costLabel}`;
+			const accessibleValue = auxiliaryLabel === "" ? value : `${value} · ${auxiliaryLabel}`;
+			return {
+				providerId,
+				providerLabel,
+				status,
+				value,
+				tone,
+				ariaLabel: translate("sessionPill.aria", { provider: providerLabel, value: accessibleValue })
+			};
+		}
+
+		const usageStatsPanelOpeners = /* @__PURE__ */ new Set();
+
+		function subscribeUsageStatsPanel(opener) {
+			if (typeof opener !== "function") return () => {};
+			usageStatsPanelOpeners.add(opener);
+			return () => usageStatsPanelOpeners.delete(opener);
+		}
+
+		function requestUsageStatsPanel(providerId) {
+			const openers = [...usageStatsPanelOpeners];
+			openers[openers.length - 1]?.(providerId);
+		}
+
+		function enableFooterActionWrapping(host) {
+			const hostStyle = window.getComputedStyle(host);
+			if (!hostStyle.display.includes("flex")
+				|| hostStyle.flexDirection.startsWith("column")
+				|| hostStyle.flexWrap !== "nowrap") return void 0;
+			const previous = host.style.flexWrap;
+			host.style.flexWrap = "wrap";
+			return () => {
+				host.style.flexWrap = previous;
+			};
+		}
+
+		/** Pure compact pill view, separated for render/click regression tests. */
+		function CurrentSessionPillView({ snapshot, translate, onOpen = requestUsageStatsPanel, now = Date.now() }) {
+			const view = sessionPillViewOf(snapshot, translate, now);
+			if (view === null) return null;
+			return react_jsx_runtime.jsxs("button", {
+				type: "button",
+				className: S.sessionPill,
+				"data-current-session-pill": true,
+				"data-provider": view.providerId,
+				"data-status": view.status,
+				"data-tone": view.tone,
+				"aria-label": view.ariaLabel,
+				title: view.ariaLabel,
+				onClick: () => onOpen(view.providerId),
+				children: [
+					react_jsx_runtime.jsx("span", { className: S.sessionPillProvider, children: view.providerLabel }),
+					react_jsx_runtime.jsx("span", { className: S.sessionPillSeparator, "aria-hidden": true, children: "·" }),
+					react_jsx_runtime.jsx("span", { className: S.sessionPillValue, children: view.value })
+				]
+			});
+		}
+
+		/** Formal `conversation.input.right` slot occupant. */
+		function CurrentSessionPill({ sessionId, session, modelDirectory, useProjection = () => void 0, request = fetchJson, t }) {
+			const translate = (key, params) => interpolate(t !== void 0 ? t(key) : key, params);
+			const [loaded, setLoaded] = react.useState({ key: null, snapshot: null });
+			const loaderRef = react.useRef(null);
+			if (loaderRef.current === null) loaderRef.current = createLoader();
+			const signal = sessionContextSignalOf(session);
+			const tokenUsage = useProjection("tokenUsage");
+			const tokenSignal = tokenUsageSignalOf(tokenUsage);
+			const subscribeModelSelection = react.useCallback((notify) => typeof modelDirectory?.subscribe === "function"
+				? modelDirectory.subscribe(notify)
+				: () => {}, [modelDirectory]);
+			const getModelSelectionSignal = react.useCallback(() => modelSelectionSignalOf(
+				typeof modelDirectory?.getSnapshot === "function" ? modelDirectory.getSnapshot() : null
+			), [modelDirectory]);
+			const modelSignal = react.useSyncExternalStore(subscribeModelSelection, getModelSelectionSignal, getModelSelectionSignal);
+			const requestKey = JSON.stringify([sessionId, signal, modelSignal, tokenSignal]);
+			const [selectedProvider, selectedModel] = JSON.parse(modelSignal);
+			const selectedRoute = selectedProvider !== "" && selectedModel !== ""
+				? { provider: selectedProvider, model: selectedModel }
+				: null;
+			react.useEffect(() => {
+				const seq = loaderRef.current.start();
+				let mounted = true;
+				setLoaded({ key: requestKey, snapshot: null });
+				loadSessionPillSnapshot(sessionId, request, selectedRoute).then((next) => {
+					if (mounted && loaderRef.current.isCurrent(seq)) setLoaded({ key: requestKey, snapshot: next });
+				}).catch(() => {
+					if (mounted && loaderRef.current.isCurrent(seq)) setLoaded({ key: requestKey, snapshot: null });
+				});
+				return () => {
+					mounted = false;
+				};
+			}, [sessionId, signal, modelSignal, tokenSignal, request, requestKey, selectedRoute?.provider, selectedRoute?.model]);
+			return react_jsx_runtime.jsx(CurrentSessionPillView, {
+				snapshot: loaded.key === requestKey && loaded.snapshot !== null ? { ...loaded.snapshot, tokenUsage } : null,
+				translate
+			});
+		}
+		//#endregion
+
 		/**
 		 * Build one month's calendar heatmap: weeks as rows (Mon-first), only
 		 * the month's own days, padded with null placeholders. Cell tokens come
@@ -473,6 +787,57 @@ window.__ModuleLoader__.load({
 		//#endregion
 
 		//#region UsageStatsPanel
+		const SELECTED_PROVIDER_STORAGE_KEY = "@ychris12138/dsh-usage-stats:selected-provider:v1";
+
+		function browserStorage() {
+			try {
+				return typeof window === "object" ? window.localStorage ?? null : null;
+			} catch {
+				return null;
+			}
+		}
+
+		function validStoredProvider(value) {
+			return typeof value === "string" && value.length > 0 && value.length <= 256 && !value.includes("\0") ? value : null;
+		}
+
+		function readSelectedProvider(storage = browserStorage()) {
+			try {
+				const stored = storage?.getItem?.(SELECTED_PROVIDER_STORAGE_KEY) ?? null;
+				const normalized = validStoredProvider(stored);
+				if (stored !== null && normalized === null) storage?.removeItem?.(SELECTED_PROVIDER_STORAGE_KEY);
+				return normalized;
+			} catch {
+				return null;
+			}
+		}
+
+		function writeSelectedProvider(providerId, storage = browserStorage()) {
+			try {
+				const normalized = validStoredProvider(providerId);
+				if (normalized === null) storage?.removeItem?.(SELECTED_PROVIDER_STORAGE_KEY);
+				else storage?.setItem?.(SELECTED_PROVIDER_STORAGE_KEY, normalized);
+			} catch {
+				// Storage may be disabled or quota-limited. Selection remains usable
+				// for the current mount and silently falls back on the next one.
+			}
+		}
+
+		function reconcileSelectedProvider(current, providers, storage = browserStorage()) {
+			if (Array.isArray(providers) && providers.some((provider) => provider?.id === current)) return current;
+			if (current !== null) writeSelectedProvider(null, storage);
+			if (!Array.isArray(providers) || providers.length === 0) return null;
+			return providers.find((provider) => provider.id === "deepseek-official" && provider.configured)?.id
+				?? providers.find((provider) => provider.id === "deepseek")?.id
+				?? providers.find((provider) => provider.configured)?.id
+				?? providers[0].id;
+		}
+
+		function authoritativeProviderList(payload) {
+			if (payload?.ok !== true) return null;
+			return Array.isArray(payload.providers) ? payload.providers : [];
+		}
+
 		/**
 		 * Sidebar footer action: badge + floating panel with balance and usage.
 		 * @param props - `wide` from the sidebar shell, `t` bound by the slot runtime.
@@ -485,8 +850,9 @@ window.__ModuleLoader__.load({
 			const [selectedDay, setSelectedDay] = react.useState(null);
 			const [viewMonth, setViewMonth] = react.useState(() => currentMonthKey());
 			const [providers, setProviders] = react.useState([]);
-			const [providersLoaded, setProvidersLoaded] = react.useState(false);
-			const [selectedProvider, setSelectedProvider] = react.useState(null);
+			const [providersAuthoritative, setProvidersAuthoritative] = react.useState(false);
+			const storageRef = react.useRef(browserStorage());
+			const [selectedProvider, setSelectedProvider] = react.useState(() => readSelectedProvider(storageRef.current));
 			const [account, setAccount] = react.useState(null);
 			const [accountLoading, setAccountLoading] = react.useState(false);
 			const [accountError, setAccountError] = react.useState(null);
@@ -500,6 +866,20 @@ window.__ModuleLoader__.load({
 			if (accountLoaderRef.current === null) accountLoaderRef.current = createLoader();
 			const providerChoices = react.useMemo(() => buildProviderChoices(providers), [providers]);
 			const selectedProviderInfo = providerChoices.find((provider) => provider.id === selectedProvider) ?? null;
+			const selectProvider = react.useCallback((providerId) => {
+				const normalized = validStoredProvider(providerId);
+				setSelectedProvider(normalized);
+				writeSelectedProvider(normalized, storageRef.current);
+			}, []);
+			const openForProvider = react.useCallback((providerId) => {
+				if (validStoredProvider(providerId) !== null) selectProvider(providerId);
+				setOpen(true);
+			}, [selectProvider]);
+
+			// The composer pill and sidebar panel are separate slot roots. A tiny
+			// in-module subscription bridge opens this existing panel without DOM
+			// clicks, a new panel implementation, or another account state/cache.
+			react.useEffect(() => subscribeUsageStatsPanel(openForProvider), [openForProvider]);
 
 			const loadUsage = react.useCallback(() => {
 				const seq = usageLoaderRef.current.start();
@@ -521,17 +901,14 @@ window.__ModuleLoader__.load({
 			const loadProviders = react.useCallback(() => {
 				fetchJson("/api/usage-stats/providers").then((payload) => {
 					if (!mountedRef.current) return;
-					if (payload.ok !== true) {
-						setProvidersLoaded(true);
-						return;
-					}
-					const list = Array.isArray(payload.providers) ? payload.providers : [];
+					const list = authoritativeProviderList(payload);
+					if (list === null) return;
 					setProviders(list);
-					setProvidersLoaded(true);
-				}).catch(() => { setProvidersLoaded(true); });
+					setProvidersAuthoritative(true);
+				}).catch(() => {});
 			}, []);
 
-			const loadAccount = react.useCallback((providerId, force = false) => {
+			const loadAccount = react.useCallback((providerId, force = false, activity = null) => {
 				const seq = accountLoaderRef.current.start();
 				setAccountLoading(true);
 				setAccountError(null);
@@ -541,7 +918,8 @@ window.__ModuleLoader__.load({
 					setAccountError("no providers");
 					return;
 				}
-				const query = `?provider=${encodeURIComponent(target)}${force ? "&refresh=1" : ""}`;
+				const activityQuery = activity === "detail" ? "&activity=detail" : "";
+				const query = `?provider=${encodeURIComponent(target)}${force ? "&refresh=1" : ""}${activityQuery}`;
 				fetchJson(`/api/usage-stats/account${query}`).then((payload) => {
 					if (!mountedRef.current || !accountLoaderRef.current.isCurrent(seq)) return;
 					if (payload.ok !== true) {
@@ -565,13 +943,12 @@ window.__ModuleLoader__.load({
 				};
 			}, []);
 
-			// The host footer-actions container lays sidebar.footer.action list
-			// registrations out in a ROW, so two full-width entries squeeze onto
-			// one line and the later one (us) is pushed out of view (#21). Switch
-			// the container to column stacking while mounted and restore its
-			// previous inline value on unmount. Walking up (instead of targeting
-			// the host's hashed class) keeps this working across dsh versions,
-			// and a container that is already columnar is left untouched.
+			// The shared footer-actions host lays full-width registrations out in a
+			// row. Let those actions wrap onto separate lines for #21 without
+			// changing the row main axis used by sibling plugins (#82). Walking up
+			// avoids depending on the host's hashed CSS-module class. Existing
+			// column/wrap layouts are left untouched, and our inline wrap override
+			// is restored on unmount.
 			react.useEffect(() => {
 				let host = layerRef.current?.parentElement ?? null;
 				for (let depth = 0; host !== null && depth < 3; depth += 1) {
@@ -579,13 +956,7 @@ window.__ModuleLoader__.load({
 					host = host.parentElement;
 				}
 				if (host === null) return void 0;
-				const hostStyle = window.getComputedStyle(host);
-				if (!hostStyle.display.includes("flex") || hostStyle.flexDirection === "column") return void 0;
-				const previous = host.style.flexDirection;
-				host.style.flexDirection = "column";
-				return () => {
-					host.style.flexDirection = previous;
-				};
+				return enableFooterActionWrapping(host);
 			}, []);
 
 
@@ -611,15 +982,9 @@ window.__ModuleLoader__.load({
 			// Keep exactly one valid provider selected across independent provider
 			// and subscription responses. DeepSeek remains the initial preference.
 			react.useEffect(() => {
-				if (!providersLoaded || providerChoices.length === 0) return;
-				setSelectedProvider((current) => {
-					if (current !== null && providerChoices.some((provider) => provider.id === current)) return current;
-					return providerChoices.find((provider) => provider.id === "deepseek-official" && provider.configured)?.id
-						?? providerChoices.find((provider) => provider.id === "deepseek")?.id
-						?? providerChoices.find((provider) => provider.configured)?.id
-						?? providerChoices[0].id;
-				});
-			}, [providerChoices, providersLoaded]);
+				if (!providersAuthoritative) return;
+				setSelectedProvider((current) => reconcileSelectedProvider(current, providerChoices, storageRef.current));
+			}, [providerChoices, providersAuthoritative]);
 
 			react.useEffect(() => {
 				if (!open) return;
@@ -634,18 +999,18 @@ window.__ModuleLoader__.load({
 			}, [open, loadUsage, loadProviders]);
 
 			// Fetch the selected account for BOTH the panel and the collapsed
-			// sidebar badge. The server refreshes all providers in the background
-			// (five-minute cache); the client re-reads that cache every five
-			// minutes (no refresh=1 — the upstream fetch stays server-owned) so
-			// the badge/panel never stays on a stale balance or quota value.
+			// sidebar badge. The server owns the adaptive upstream schedule; this
+			// pre-existing shared panel path only re-reads that cache every five
+			// minutes (no refresh=1), and marks an open detail view as active.
 			react.useEffect(() => {
 				if (selectedProvider === null) return;
-				loadAccount(selectedProvider);
-				const cacheTimer = window.setInterval(() => loadAccount(selectedProvider), 300000);
+				const activity = open ? "detail" : null;
+				loadAccount(selectedProvider, false, activity);
+				const cacheTimer = window.setInterval(() => loadAccount(selectedProvider, false, activity), 300000);
 				return () => {
 					window.clearInterval(cacheTimer);
 				};
-			}, [selectedProvider, loadAccount]);
+			}, [selectedProvider, loadAccount, open]);
 
 			const dayMap = react.useMemo(() => {
 				const map = new Map();
@@ -702,6 +1067,10 @@ window.__ModuleLoader__.load({
 
 			const selectedEntry = selectedDay !== null ? dayMap.get(selectedDay) ?? null : null;
 			const badgeCount = stats !== null ? fmtCompact(stats.dayTokens) : null;
+			const budgetRows = usage?.budgets === null || usage?.budgets === void 0 ? [] : [
+				["daily", usage.budgets.daily],
+				["monthly", usage.budgets.monthly]
+			].map(([period, window]) => ({ period, window, text: budgetWindowText(period, window, translate) })).filter((entry) => entry.text !== null);
 
 			// Collapsed-badge account value, derived from the unified v0.2.0
 			// account snapshot. Balance providers show a real-currency amount;
@@ -723,7 +1092,7 @@ window.__ModuleLoader__.load({
 			const retry = () => {
 				loadUsage();
 				loadProviders();
-				if (selectedProvider !== null) loadAccount(selectedProvider, true);
+				if (selectedProvider !== null) loadAccount(selectedProvider, true, open ? "detail" : null);
 			};
 
 			const updatedLabel = refreshedAt === null ? "" : translate("panel.updatedAt", {
@@ -799,9 +1168,9 @@ window.__ModuleLoader__.load({
 												children: react_jsx_runtime.jsx("h3", { className: S.sectionTitle, children: translate("account.title") })
 											}),
 											react_jsx_runtime.jsx(ProviderPicker, {
-												providers: providerChoices,
-												selectedProvider,
-												onSelect: (id) => setSelectedProvider(id),
+								providers: providerChoices,
+								selectedProvider,
+								onSelect: selectProvider,
 												translate
 											}),
 											selectedProviderInfo === null ? react_jsx_runtime.jsx("p", { className: S.note, children: translate("account.loading") }) : react_jsx_runtime.jsx("div", {
@@ -812,7 +1181,7 @@ window.__ModuleLoader__.load({
 												accountLoading,
 												accountError,
 												translate,
-												onRetry: () => loadAccount(selectedProvider, true)
+												onRetry: () => loadAccount(selectedProvider, true, "detail")
 												}, selectedProviderInfo.id)
 											}),
 											react_jsx_runtime.jsx("section", {
@@ -837,9 +1206,9 @@ window.__ModuleLoader__.load({
 													react_jsx_runtime.jsxs("div", {
 														className: S.statsRow,
 														children: [
-															react_jsx_runtime.jsx("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.dayTokens) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.today") })] }),
-															react_jsx_runtime.jsx("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.monthTokens) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.month") })] }),
-															react_jsx_runtime.jsx("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.total) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.total") })] })
+													react_jsx_runtime.jsxs("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.dayTokens) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.today") })] }),
+													react_jsx_runtime.jsxs("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.monthTokens) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.month") })] }),
+													react_jsx_runtime.jsxs("div", { className: S.stat, children: [react_jsx_runtime.jsx("span", { className: S.statValue, children: fmt(stats.total) }), react_jsx_runtime.jsx("span", { className: S.statLabel, children: translate("usage.total") })] })
 														]
 													}),
 													react_jsx_runtime.jsx("p", {
@@ -849,10 +1218,16 @@ window.__ModuleLoader__.load({
 																translate("usage.hit.today"),
 																": ",
 																react_jsx_runtime.jsx("b", { children: fmtHit(stats.todayHit) })
-															]
-														})
+														]
 													})
-												]
+												}),
+												...budgetRows.map((entry) => react_jsx_runtime.jsx("p", {
+													className: S.hitCaption,
+													"data-budget-period": entry.period,
+													"data-budget-level": entry.window.level,
+													children: entry.text
+												}, entry.period))
+											]
 											}),
 											usage !== null && usageError === null && react_jsx_runtime.jsxs("section", {
 												className: S.section,
@@ -898,7 +1273,7 @@ window.__ModuleLoader__.load({
 													})
 												]
 											}),
-											recent.length > 0 && react_jsx_runtime.jsxs("section", {
+										recent.length > 0 && react_jsx_runtime.jsxs("section", {
 												className: S.section,
 												children: [
 													react_jsx_runtime.jsx("h3", { className: S.sectionTitle, children: translate("usage.recent") }),
@@ -923,8 +1298,22 @@ window.__ModuleLoader__.load({
 														})
 													})
 												]
-											}),
-											updatedLabel !== "" && react_jsx_runtime.jsx("p", { className: S.footerNote, children: updatedLabel })
+										}),
+										react_jsx_runtime.jsxs("section", {
+											className: S.section,
+											children: [
+												react_jsx_runtime.jsx("h3", { className: S.sectionTitle, children: translate("export.title") }),
+												react_jsx_runtime.jsxs("div", {
+													className: S.exportLinks,
+													children: [
+														react_jsx_runtime.jsx("a", { className: S.exportLink, href: "/api/usage-stats/export/daily.csv", download: "dsh-usage-daily.csv", "data-export-format": "daily-csv", children: translate("export.dailyCsv") }),
+														react_jsx_runtime.jsx("a", { className: S.exportLink, href: "/api/usage-stats/export/sessions.csv", download: "dsh-usage-sessions.csv", "data-export-format": "sessions-csv", children: translate("export.sessionsCsv") }),
+														react_jsx_runtime.jsx("a", { className: S.exportLink, href: "/api/usage-stats/export.json", download: "dsh-usage-stats.json", "data-export-format": "json", children: translate("export.json") })
+													]
+												})
+											]
+										}),
+										updatedLabel !== "" && react_jsx_runtime.jsx("p", { className: S.footerNote, children: updatedLabel })
 										]
 									})
 								]
@@ -1043,6 +1432,7 @@ window.__ModuleLoader__.load({
 			if (status === "invalid-response") return translate("account.status.invalidResponse");
 			if (status === "blocked") return translate("account.status.blocked");
 			if (status === "unsupported") return translate("account.status.unsupported");
+			if (status === "unknown") return translate("account.status.unknown");
 			return translate("subscription.status.unavailable");
 		}
 
@@ -1056,12 +1446,69 @@ window.__ModuleLoader__.load({
 			return kind;
 		}
 
-		function resetLabel(resetsAt, translate) {
+		function durationLabel(totalMinutes, translate) {
+			if (totalMinutes >= 1440) {
+				const days = Math.floor(totalMinutes / 1440);
+				const hours = Math.floor(totalMinutes % 1440 / 60);
+				return translate("duration.daysHours", { days, hours });
+			}
+			if (totalMinutes >= 60) {
+				const hours = Math.floor(totalMinutes / 60);
+				const minutes = totalMinutes % 60;
+				return translate("duration.hoursMinutes", { hours, minutes });
+			}
+			return translate("duration.minutes", { minutes: totalMinutes });
+		}
+
+		function formatResetCountdown(resetsAt, now, translate) {
 			if (typeof resetsAt !== "string") return "";
 			const date = new Date(resetsAt);
 			if (Number.isNaN(date.getTime())) return "";
-			return translate("subscription.resets", {
-				time: date.toLocaleString([], { month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" })
+			const diffMs = date.getTime() - now;
+			if (diffMs <= 0) return translate("subscription.resetDue");
+			const totalMinutes = Math.max(1, Math.ceil(diffMs / 60000));
+			return translate("subscription.resets", { time: durationLabel(totalMinutes, translate) });
+		}
+
+		function resetLabel(resetsAt, translate, now = Date.now()) {
+			return formatResetCountdown(resetsAt, now, translate);
+		}
+
+		function provenanceLabel(provenance, translate) {
+			if (provenance === "official") return translate("account.provenance.official");
+			if (provenance === "provider") return translate("account.provenance.provider");
+			if (provenance === "configured") return translate("account.provenance.configured");
+			if (provenance === "experimental") return translate("account.provenance.experimental");
+			return translate("account.provenance.unknown");
+		}
+
+		function healthTimeLabel(value) {
+			if (typeof value !== "number" || !Number.isFinite(value)) return "";
+			const date = new Date(value);
+			return Number.isNaN(date.getTime()) ? "" : date.toLocaleString([], { month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" });
+		}
+
+		function healthAgeLabel(value, translate) {
+			if (typeof value !== "number" || !Number.isFinite(value) || value < 0) return "";
+			return durationLabel(Math.floor(value / 60000), translate);
+		}
+
+		function AccountHealth({ account, translate }) {
+			if (account === null || account === void 0 || typeof account !== "object") return null;
+			const rows = [];
+			const attempted = healthTimeLabel(account.lastAttemptAt);
+			const succeeded = healthTimeLabel(account.lastSuccessAt);
+			const age = healthAgeLabel(account.ageMs, translate);
+			if (attempted !== "") rows.push(["account.health.lastAttempt", attempted]);
+			if (succeeded !== "") rows.push(["account.health.lastSuccess", succeeded]);
+			if (age !== "") rows.push(["account.health.age", age]);
+			rows.push(["account.health.provenance", provenanceLabel(account.provenance, translate)]);
+			return react_jsx_runtime.jsx("dl", {
+				className: S.accountHealth,
+				children: rows.flatMap(([label, value]) => [
+					react_jsx_runtime.jsx("dt", { children: translate(label) }, `${label}-term`),
+					react_jsx_runtime.jsx("dd", { children: value }, `${label}-value`)
+				])
 			});
 		}
 
@@ -1115,7 +1562,8 @@ window.__ModuleLoader__.load({
 			const mode = account?.mode ?? provider.accountMode ?? "balance";
 			const subscriptionMode = mode === "subscription";
 			const status = accountLoading && account === null ? "loading" : account?.status ?? "unavailable";
-			const statusText = status === "loading" ? translate("account.status.loading")
+			const statusText = account?.stale === true ? translate("account.status.stale")
+				: status === "loading" ? translate("account.status.loading")
 				: status === "blocked" ? translate("account.status.blocked")
 					: status === "unsupported" ? translate("account.status.unsupported")
 						: subscriptionStatusLabel(status, translate);
@@ -1133,6 +1581,7 @@ window.__ModuleLoader__.load({
 				"data-provider": provider.id,
 				"data-adapter": provider.adapter ?? provider.accountMode ?? "",
 				"data-account-mode": mode,
+				"data-account-stale": account?.stale === true,
 				children: [
 					react_jsx_runtime.jsxs("div", {
 						className: S.accountHead,
@@ -1159,7 +1608,8 @@ window.__ModuleLoader__.load({
 							? react_jsx_runtime.jsx("p", { className: S.quotaEmpty, children: translate("subscription.loading") })
 							: react_jsx_runtime.jsx(SubscriptionContent, { provider: account ?? { status: "unavailable", windows: [] }, translate })
 						: react_jsx_runtime.jsx(BalanceContent, { balance: account?.balance ?? null, state: balanceState, message: balanceMessage, translate, onRetry }),
-					reasonText !== null && status !== "ok" ? react_jsx_runtime.jsx("p", { className: S.note, children: reasonText }) : null
+				react_jsx_runtime.jsx(AccountHealth, { account, translate }),
+				reasonText !== null && status !== "ok" ? react_jsx_runtime.jsx("p", { className: S.note, children: reasonText }) : null
 				]
 			});
 		}
@@ -1318,20 +1768,41 @@ window.__ModuleLoader__.load({
 		const zh = {
 			"panel.title": "用量与余额",
 			"panel.badge": "用量/余额",
+			"sessionPill.aria": "{provider} 账户：{value}",
+			"sessionPill.status.unsupported": "不支持",
 			"account.title": "供应商账户",
 			"account.provider": "当前供应商",
 			"account.balanceMode": "API 余额",
 			"account.loading": "正在加载供应商…",
 			"account.status.loading": "查询中",
+			"account.status.stale": "数据已过期",
 			"account.status.blocked": "已阻止",
 			"account.status.unsupported": "不支持余额",
 			"account.status.invalidResponse": "响应异常",
+			"account.status.unknown": "未知",
 			"account.invalidResponse": "供应商返回了无法识别的额度数据。",
 			"account.reason.dnsResolutionFailed": "无法解析供应商域名。",
 			"account.reason.allAddressesUnreachable": "已验证的网络地址均无法连接。",
 			"account.reason.upstreamNotJson": "上游返回的不是 JSON",
 			"account.reason.upstreamInvalidJson": "上游返回了无法解析的 JSON",
 			"account.reason.sub2apiBalanceShapeUnrecognized": "Sub2API 余额接口返回了未识别的数据结构。",
+			"account.reason.timeout": "账户请求超时。",
+			"account.reason.rateLimited": "供应商限制了账户查询频率。",
+			"account.reason.unauthorized": "账户凭据未通过验证。",
+			"account.reason.upstreamTooLarge": "上游响应超过安全大小限制。",
+			"account.reason.upstreamInvalidResponse": "上游返回了无法识别的响应。",
+			"account.reason.blockedNetwork": "账户请求被本地网络安全策略阻止。",
+			"account.reason.noValidatedAddress": "没有可安全连接的供应商地址。",
+			"account.reason.unknown": "账户查询失败，未提供可安全展示的诊断信息。",
+			"account.health.lastAttempt": "上次尝试",
+			"account.health.lastSuccess": "上次成功",
+			"account.health.age": "数据年龄",
+			"account.health.provenance": "数据来源",
+			"account.provenance.official": "官方接口",
+			"account.provenance.provider": "供应商接口",
+			"account.provenance.configured": "自定义配置",
+			"account.provenance.experimental": "实验性探测",
+			"account.provenance.unknown": "未知",
 			"account.blocked": "账户查询被本地安全策略阻止，请检查 HTTPS、同源和私网访问设置。",
 			"balance.title": "账户余额",
 			"balance.provider": "供应商",
@@ -1362,7 +1833,11 @@ window.__ModuleLoader__.load({
 			"subscription.window.quota": "总额度",
 			"subscription.window.mcp": "MCP 月度额度",
 			"subscription.used": "已用 {value}%",
-			"subscription.resets": "{time} 重置",
+			"subscription.resets": "{time}后重置",
+			"subscription.resetDue": "已到重置时间",
+			"duration.minutes": "{minutes} 分钟",
+			"duration.hoursMinutes": "{hours} 小时 {minutes} 分钟",
+			"duration.daysHours": "{days} 天 {hours} 小时",
 			"subscription.notConfigured": "配置 {refs} 后显示真实订阅比例。",
 			"subscription.unauthorized": "凭据已失效，请更新后重试。",
 			"subscription.rateLimited": "供应商暂时限制查询，请稍后重试。",
@@ -1386,6 +1861,17 @@ window.__ModuleLoader__.load({
 			"usage.cacheRead": "缓存读",
 			"usage.unknownModel": "未知模型",
 			"usage.noModels": "这一天没有分模型数据。",
+			"export.title": "安全导出",
+			"export.dailyCsv": "每日 CSV",
+			"export.sessionsCsv": "会话 CSV",
+			"export.json": "完整 JSON",
+			"budget.period.daily": "今日估算",
+			"budget.period.monthly": "本月估算",
+			"budget.level.normal": "正常",
+			"budget.level.warning": "接近预算",
+			"budget.level.critical": "已超预算",
+			"budget.level.unknown": "费用不完整",
+			"budget.summary": "{period}：{spent} / {limit} · {level}",
 			"month.year": "{year}年{month}",
 			"action.refresh": "刷新",
 			"action.retry": "重试",
@@ -1406,20 +1892,41 @@ window.__ModuleLoader__.load({
 		const en = {
 			"panel.title": "Usage & Balance",
 			"panel.badge": "Usage/Balance",
+			"sessionPill.aria": "{provider} account: {value}",
+			"sessionPill.status.unsupported": "Unsupported",
 			"account.title": "Provider account",
 			"account.provider": "Current provider",
 			"account.balanceMode": "API balance",
 			"account.loading": "Loading providers…",
 			"account.status.loading": "Loading",
+			"account.status.stale": "Stale data",
 			"account.status.blocked": "Blocked",
 			"account.status.unsupported": "Balance unsupported",
 			"account.status.invalidResponse": "Invalid response",
+			"account.status.unknown": "Unknown",
 			"account.invalidResponse": "The provider returned unrecognized quota data.",
 			"account.reason.dnsResolutionFailed": "The provider hostname could not be resolved.",
 			"account.reason.allAddressesUnreachable": "None of the validated network addresses could be reached.",
 			"account.reason.upstreamNotJson": "The upstream response was not JSON",
 			"account.reason.upstreamInvalidJson": "The upstream returned unparsable JSON",
 			"account.reason.sub2apiBalanceShapeUnrecognized": "The Sub2API balance endpoint returned an unrecognized data shape.",
+			"account.reason.timeout": "The account request timed out.",
+			"account.reason.rateLimited": "The provider rate limited account checks.",
+			"account.reason.unauthorized": "The account credential was rejected.",
+			"account.reason.upstreamTooLarge": "The upstream response exceeded the safety size limit.",
+			"account.reason.upstreamInvalidResponse": "The upstream returned an unrecognized response.",
+			"account.reason.blockedNetwork": "The account request was blocked by the local network policy.",
+			"account.reason.noValidatedAddress": "No validated provider address was available.",
+			"account.reason.unknown": "The account check failed without a safe diagnostic detail.",
+			"account.health.lastAttempt": "Last attempt",
+			"account.health.lastSuccess": "Last success",
+			"account.health.age": "Data age",
+			"account.health.provenance": "Source",
+			"account.provenance.official": "Official API",
+			"account.provenance.provider": "Provider API",
+			"account.provenance.configured": "Configured",
+			"account.provenance.experimental": "Experimental",
+			"account.provenance.unknown": "Unknown",
 			"account.blocked": "The account query was blocked by the local security policy. Check HTTPS, same-origin, and private-network settings.",
 			"balance.title": "Account balance",
 			"balance.provider": "Provider",
@@ -1450,7 +1957,11 @@ window.__ModuleLoader__.load({
 			"subscription.window.quota": "Total quota",
 			"subscription.window.mcp": "Monthly MCP quota",
 			"subscription.used": "{value}% used",
-			"subscription.resets": "Resets {time}",
+			"subscription.resets": "Resets in {time}",
+			"subscription.resetDue": "Reset due",
+			"duration.minutes": "{minutes}m",
+			"duration.hoursMinutes": "{hours}h {minutes}m",
+			"duration.daysHours": "{days}d {hours}h",
 			"subscription.notConfigured": "Configure {refs} to show live subscription usage.",
 			"subscription.unauthorized": "The credential has expired; update it and retry.",
 			"subscription.rateLimited": "The provider is rate limiting checks; retry later.",
@@ -1474,6 +1985,17 @@ window.__ModuleLoader__.load({
 			"usage.cacheRead": "Cache read",
 			"usage.unknownModel": "Unknown model",
 			"usage.noModels": "No per-model data for this day.",
+			"export.title": "Secret-free export",
+			"export.dailyCsv": "Daily CSV",
+			"export.sessionsCsv": "Sessions CSV",
+			"export.json": "Full JSON",
+			"budget.period.daily": "Today estimated",
+			"budget.period.monthly": "This month estimated",
+			"budget.level.normal": "Normal",
+			"budget.level.warning": "Near budget",
+			"budget.level.critical": "Over budget",
+			"budget.level.unknown": "Incomplete cost",
+			"budget.summary": "{period}: {spent} / {limit} · {level}",
 			"month.year": "{month} {year}",
 			"action.refresh": "Refresh",
 			"action.retry": "Retry",
@@ -1498,7 +2020,8 @@ window.__ModuleLoader__.load({
 		const inject = ["slots", "locale"];
 
 		/**
-		 * Client plugin body: register the dictionaries and the sidebar footer action.
+		 * Client plugin body: register dictionaries, the sidebar account panel, and
+		 * the current-session pill beside the host's model selector.
 		 * @param ctx - client root context.
 		 */
 		function apply(ctx) {
@@ -1509,12 +2032,26 @@ window.__ModuleLoader__.load({
 				locale: NS,
 				order: 10
 			}, UsageStatsPanel));
+			// The model-directory service is optional so older/mutated DSH clients
+			// keep the sidebar panel even when the inline slot cannot be supported.
+			ctx.inject(["slots", "modelDirectories"], (scope) => {
+				const models = scope.modelDirectories;
+				scope.slots.inject("conversation.input.right", () => scope.slots.register({
+					name: "conversation.input.right",
+					id: "usage-stats-current-session-pill",
+					locale: NS,
+					order: 10,
+					inject: (sessionId) => ({ modelDirectory: models.directoryFor(sessionId).store })
+				}, CurrentSessionPill));
+			});
 		}
 		//#endregion
 
 		exports.apply = apply;
 		exports.inject = inject;
 		exports.UsageStatsPanel = UsageStatsPanel;
+		exports.CurrentSessionPill = CurrentSessionPill;
+		exports.CurrentSessionPillView = CurrentSessionPillView;
 		exports.DayDetail = DayDetail;
 		exports.ProviderAccountCard = ProviderAccountCard;
 		exports.MonthHeatmap = MonthHeatmap;
@@ -1525,10 +2062,26 @@ window.__ModuleLoader__.load({
 		exports.modelLabelOf = modelLabelOf;
 		exports.fmt = fmt;
 		exports.fmtCurrency = fmtCurrency;
+		exports.budgetWindowText = budgetWindowText;
 		exports.badgeAccountValue = badgeAccountValue;
 		exports.badgeWarnOf = badgeWarnOf;
 		exports.shouldDismissPanel = shouldDismissPanel;
 		exports.safeDiagnosticReason = safeDiagnosticReason;
+		exports.formatResetCountdown = formatResetCountdown;
+		exports.loadSessionPillSnapshot = loadSessionPillSnapshot;
+		exports.modelSelectionSignalOf = modelSelectionSignalOf;
+		exports.tokenUsageSignalOf = tokenUsageSignalOf;
+		exports.currentSessionCostLabel = currentSessionCostLabel;
+		exports.requestUsageStatsPanel = requestUsageStatsPanel;
+		exports.sessionContextSignalOf = sessionContextSignalOf;
+		exports.sessionPillViewOf = sessionPillViewOf;
+		exports.subscribeUsageStatsPanel = subscribeUsageStatsPanel;
+		exports.enableFooterActionWrapping = enableFooterActionWrapping;
+		exports.SELECTED_PROVIDER_STORAGE_KEY = SELECTED_PROVIDER_STORAGE_KEY;
+		exports.authoritativeProviderList = authoritativeProviderList;
+		exports.readSelectedProvider = readSelectedProvider;
+		exports.reconcileSelectedProvider = reconcileSelectedProvider;
+		exports.writeSelectedProvider = writeSelectedProvider;
 		return module.exports;
 	}
 });