@linxin666/dsh-usage 0.3.24 → 0.4.0

package/lib/client.js

@@ -5,8 +5,8 @@ window.__ModuleLoader__.load({
 		var exports = module.exports;
 		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 		let react = require("react");
-		let react_dom_client = require("react-dom/client");
 		let react_jsx_runtime = require("react/jsx-runtime");
+		let react_dom_client = require("react-dom/client");
 		//#region \0dsh-store-engine
 		const platform = ["@deepseek-ai/dsh-client", "-store"].join("");
 		const legacy = ["@deepseek-ai/dsh-client-runtime", "/client"].join("");
@@ -98,6 +98,7 @@ window.__ModuleLoader__.load({
 			"usage.config.title": "设置",
 			"usage.config.enabled": "启用插件",
 			"usage.config.pollIntervalSec": "轮询间隔（秒）",
+			"usage.config.saveFailed": "保存失败：设置未被接受。",
 			"usage.bank.title": "鲸元券",
 			"usage.bank.hint": "官方 API 每消耗 100 万 tokens 铸造 1 鲸元；保存或分享这张票券。",
 			"usage.bank.noUsage": "暂无 DeepSeek 官方用量数据（统计自插件启用起）",
@@ -108,15 +109,11 @@ window.__ModuleLoader__.load({
 			"usage.bank.save": "保存图片",
 			"usage.bank.share": "分享",
 			"usage.bank.drawError": "票券生成失败：{error}",
-			"usage.sidebar.entry.label": "用量",
-			"usage.sidebar.entry.tooltip": "用量面板：套餐配额与余额",
-			"usage.sidebar.toggle.collapse": "折叠",
-			"usage.sidebar.toggle.expand": "展开",
-			"usage.sidebar.empty": "没有已配置的套餐或余额数据。",
-			"usage.sidebar.error": "加载失败：{error}",
-			"usage.sidebar.loading": "正在加载用量数据…",
-			"usage.sidebar.balanceLeft": "剩余 {balance}",
-			"usage.sidebar.todayUsage": "今日 {tokens} tokens"
+			"usage.foot.cost": "今日消费",
+			"usage.foot.noData": "今日暂无用量",
+			"usage.foot.open": "打开使用统计设置",
+			"usage.foot.collapse": "收起用量卡片",
+			"usage.foot.expand": "展开用量卡片"
 		};
 		/** English mirror; every zh key present. */
 		const en = {
@@ -159,6 +156,7 @@ window.__ModuleLoader__.load({
 			"usage.config.title": "Settings",
 			"usage.config.enabled": "Enable plugin",
 			"usage.config.pollIntervalSec": "Poll interval (seconds)",
+			"usage.config.saveFailed": "Save failed: the deployment did not accept the setting.",
 			"usage.bank.title": "Whale-yuan voucher",
 			"usage.bank.hint": "Every 1,000,000 tokens spent on the official API mint one whale yuan; save or share the note.",
 			"usage.bank.noUsage": "No official DeepSeek usage yet (counting starts when the plugin is enabled)",
@@ -169,15 +167,11 @@ window.__ModuleLoader__.load({
 			"usage.bank.save": "Save image",
 			"usage.bank.share": "Share",
 			"usage.bank.drawError": "Failed to render the voucher: {error}",
-			"usage.sidebar.entry.label": "Usage",
-			"usage.sidebar.entry.tooltip": "Usage panel: plan quotas and balances",
-			"usage.sidebar.toggle.collapse": "Collapse",
-			"usage.sidebar.toggle.expand": "Expand",
-			"usage.sidebar.empty": "No plan or balance data configured.",
-			"usage.sidebar.error": "Loading failed: {error}",
-			"usage.sidebar.loading": "Loading usage data…",
-			"usage.sidebar.balanceLeft": "{balance} left",
-			"usage.sidebar.todayUsage": "{tokens} tokens today"
+			"usage.foot.cost": "Today spend",
+			"usage.foot.noData": "No usage yet today",
+			"usage.foot.open": "Open usage statistics settings",
+			"usage.foot.collapse": "Collapse the usage card",
+			"usage.foot.expand": "Expand the usage card"
 		};
 		/**
 		* Active dictionary, picked by the document language at call time. The
@@ -195,7 +189,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:packages/dsh-usage/src/client/usage.module.css.mjs
-		const css = ".cvtkAW_section{color:inherit;flex-direction:column;gap:16px;display:flex}.cvtkAW_header{justify-content:space-between;align-items:center;gap:12px;display:flex}.cvtkAW_currentProvider{opacity:.75;font-size:13px}.cvtkAW_refreshBtn{appearance:none;color:inherit;font:inherit;cursor:pointer;opacity:.85;background:0 0;border:1px solid;border-radius:8px;padding:4px 12px;font-size:12px;transition:opacity .12s,background-color .12s}.cvtkAW_refreshBtn:hover:not(:disabled){opacity:1;background:color-mix(in srgb, currentColor 8%, transparent)}.cvtkAW_refreshBtn:disabled{cursor:default;opacity:.5}.cvtkAW_refreshBtn:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_tabs{border-bottom:1px solid color-mix(in srgb, currentColor 14%, transparent);gap:4px;display:flex}.cvtkAW_tab{appearance:none;color:inherit;font:inherit;cursor:pointer;opacity:.65;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:6px 14px;font-size:13px}.cvtkAW_tab:hover{opacity:.9}.cvtkAW_tab:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_tabActive{opacity:1;border-bottom-color:currentColor;font-weight:600}.cvtkAW_card{border:1px solid color-mix(in srgb, currentColor 14%, transparent);border-radius:12px;flex-direction:column;gap:10px;padding:14px 16px;display:flex}.cvtkAW_cardTitle{letter-spacing:.04em;text-transform:uppercase;opacity:.6;font-size:12px;font-weight:600}.cvtkAW_statRow{flex-wrap:wrap;gap:18px;display:flex}.cvtkAW_stat{flex-direction:column;gap:2px;display:flex}.cvtkAW_statValue{font-variant-numeric:tabular-nums;font-size:18px;font-weight:600}.cvtkAW_statLabel{opacity:.6;font-size:11px}.cvtkAW_providerRow{border-top:1px solid color-mix(in srgb, currentColor 8%, transparent);justify-content:space-between;align-items:center;gap:12px;padding:6px 0;font-size:13px;display:flex}.cvtkAW_providerRow:first-of-type{border-top:none}.cvtkAW_providerName{align-items:center;gap:8px;min-width:0;display:flex}.cvtkAW_providerTokens{font-variant-numeric:tabular-nums;opacity:.75;white-space:nowrap}.cvtkAW_providerBalance{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}.cvtkAW_currentBadge{border:1px solid color-mix(in srgb, currentColor 35%, transparent);opacity:.8;border-radius:999px;flex:none;padding:1px 7px;font-size:10px;font-weight:600}.cvtkAW_chart{flex-direction:column;gap:12px;display:flex}.cvtkAW_chartProvider{flex-direction:column;gap:4px;display:flex}.cvtkAW_chartHead{justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;display:flex}.cvtkAW_chartTokens{font-variant-numeric:tabular-nums;opacity:.65;white-space:nowrap;font-size:11px}.cvtkAW_chartBar{background:color-mix(in srgb, currentColor 8%, transparent);border-radius:999px;height:8px;display:block;overflow:hidden}.cvtkAW_chartFill{background:color-mix(in srgb, currentColor 55%, transparent);border-radius:999px;height:100%;transition:width .3s;display:block}.cvtkAW_chartModel{opacity:.8;grid-template-columns:minmax(80px,180px) 1fr auto;align-items:center;gap:8px;padding-left:14px;font-size:11px;display:grid}.cvtkAW_chartModelName{text-overflow:ellipsis;white-space:nowrap;opacity:.8;overflow:hidden}.cvtkAW_chartModelBar{background:color-mix(in srgb, currentColor 6%, transparent);border-radius:999px;height:4px;display:block;overflow:hidden}.cvtkAW_chartModelFill{background:color-mix(in srgb, currentColor 35%, transparent);border-radius:999px;height:100%;transition:width .3s;display:block}.cvtkAW_trendAxis{opacity:.5;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:10px;display:flex}.cvtkAW_muted{opacity:.6;font-size:12px}.cvtkAW_voucherPreview canvas{border-radius:8px;width:100%;height:auto;display:block}.cvtkAW_buttonRow{gap:8px;display:flex}.cvtkAW_errorLine{opacity:.75;font-size:12px}.cvtkAW_planCard{flex-direction:column;gap:8px;display:flex}.cvtkAW_planHead{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.cvtkAW_planName{font-size:14px;font-weight:600}.cvtkAW_windowRow{flex-direction:column;gap:4px;display:flex}.cvtkAW_windowLabel{opacity:.8;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:12px;display:flex}.cvtkAW_bar{background:color-mix(in srgb, currentColor 10%, transparent);border-radius:999px;height:6px;overflow:hidden}.cvtkAW_barFill{background:color-mix(in srgb, currentColor 55%, transparent);border-radius:999px;height:100%;transition:width .3s}.cvtkAW_barWarn{background:#d97706}.cvtkAW_barLow{background:#dc2626}.cvtkAW_resetLine{opacity:.55;font-variant-numeric:tabular-nums;font-size:11px}.cvtkAW_settingsGrid{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.cvtkAW_settingItem{align-items:center;gap:8px;font-size:13px;display:flex}.cvtkAW_settingItem input[type=checkbox]{accent-color:currentColor}.cvtkAW_settingItem input[type=number]{border:1px solid color-mix(in srgb, currentColor 25%, transparent);width:90px;color:inherit;font:inherit;background:0 0;border-radius:6px;padding:3px 8px;font-size:13px}.cvtkAW_settingItem select{border:1px solid color-mix(in srgb, currentColor 25%, transparent);color:inherit;font:inherit;background:0 0;border-radius:6px;padding:3px 8px;font-size:13px}.cvtkAW_settingItem input:focus-visible,.cvtkAW_settingItem select:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_entry{box-sizing:border-box;width:100%;height:36px;color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:0 10px;font-size:13px;display:flex}.cvtkAW_entry:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}.cvtkAW_entryIcon{flex:none;justify-content:center;align-items:center;width:24px;height:24px;display:inline-flex}.cvtkAW_entryIcon svg{width:18px;height:18px;display:block}.cvtkAW_entryLabel{text-overflow:ellipsis;overflow:hidden}.cvtkAW_entryMain{appearance:none;min-width:0;height:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;flex:1;align-items:center;gap:8px;padding:0;display:flex}.cvtkAW_entryAction{appearance:none;width:22px;height:22px;color:inherit;cursor:pointer;opacity:.55;background:0 0;border:none;border-radius:6px;flex:none;justify-content:center;align-items:center;padding:0;transition:opacity .12s,background-color .12s;display:inline-flex}.cvtkAW_entry:hover .cvtkAW_entryAction{opacity:.8}.cvtkAW_entryAction:hover{opacity:1;background:color-mix(in srgb, currentColor 10%, transparent)}.cvtkAW_entryAction:focus-visible,.cvtkAW_entryMain:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_entryAction:disabled{cursor:default;opacity:.4}.cvtkAW_entryAction svg{width:14px;height:14px;display:block}.cvtkAW_entryAction:disabled svg{animation:.9s linear infinite cvtkAW_usageEntrySpin}@keyframes cvtkAW_usageEntrySpin{to{transform:rotate(360deg)}}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_entry,[data-sidebar-collapsed] .cvtkAW_entry{border-radius:50%;justify-content:center;width:36px;height:36px;margin:0 auto 12px;padding:0}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_entryMain,[data-sidebar-collapsed] .cvtkAW_entryMain{flex:none;justify-content:center;width:100%}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_entryAction,[data-sidebar-collapsed] .cvtkAW_entryAction{display:none}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_sidebarSummary,[data-sidebar-collapsed] .cvtkAW_sidebarSummary{display:none}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_entryLabel,[data-sidebar-collapsed] .cvtkAW_entryLabel{display:none}.cvtkAW_sidebarSummary{color:inherit;opacity:.75;white-space:nowrap;align-items:baseline;gap:6px;margin:0 4px 12px;padding:0 10px;font-size:11px;display:flex;overflow:hidden}.cvtkAW_sidebarSummaryName{text-overflow:ellipsis;flex:none;max-width:40%;font-weight:600;overflow:hidden}.cvtkAW_sidebarSummaryFacts{text-overflow:ellipsis;font-variant-numeric:tabular-nums;overflow:hidden}.cvtkAW_sidebarPanel{border:1px solid color-mix(in srgb, currentColor 14%, transparent);color:inherit;background:color-mix(in srgb, currentColor 4%, transparent);border-radius:10px;flex-direction:column;gap:8px;margin:0 4px 12px;padding:10px 10px 12px;display:flex}.cvtkAW_sidebarProvider{flex-direction:column;gap:4px;display:flex}.cvtkAW_sidebarProviderHead{justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;display:flex}.cvtkAW_sidebarProviderName{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.cvtkAW_sidebarBalance{opacity:.75;flex:none}.cvtkAW_sidebarWindowRow{opacity:.85;align-items:center;gap:6px;font-size:11px;display:flex}.cvtkAW_sidebarBar{background:color-mix(in srgb, currentColor 14%, transparent);border-radius:2px;flex:1;height:4px;overflow:hidden}.cvtkAW_sidebarBarFill{background:currentColor;border-radius:2px;height:100%;display:block}.cvtkAW_sidebarMuted{opacity:.6;font-size:11px}";
+		const css = ".cvtkAW_section{color:inherit;flex-direction:column;gap:16px;display:flex}.cvtkAW_header{justify-content:space-between;align-items:center;gap:12px;display:flex}.cvtkAW_currentProvider{opacity:.75;font-size:13px}.cvtkAW_refreshBtn{appearance:none;color:inherit;font:inherit;cursor:pointer;opacity:.85;background:0 0;border:1px solid;border-radius:8px;padding:4px 12px;font-size:12px;transition:opacity .12s,background-color .12s}.cvtkAW_refreshBtn:hover:not(:disabled){opacity:1;background:color-mix(in srgb, currentColor 8%, transparent)}.cvtkAW_refreshBtn:disabled{cursor:default;opacity:.5}.cvtkAW_refreshBtn:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_tabs{border-bottom:1px solid color-mix(in srgb, currentColor 14%, transparent);gap:4px;display:flex}.cvtkAW_tab{appearance:none;color:inherit;font:inherit;cursor:pointer;opacity:.65;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:6px 14px;font-size:13px}.cvtkAW_tab:hover{opacity:.9}.cvtkAW_tab:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_tabActive{opacity:1;border-bottom-color:currentColor;font-weight:600}.cvtkAW_card{border:1px solid color-mix(in srgb, currentColor 14%, transparent);border-radius:12px;flex-direction:column;gap:10px;padding:14px 16px;display:flex}.cvtkAW_cardTitle{letter-spacing:.04em;text-transform:uppercase;opacity:.6;font-size:12px;font-weight:600}.cvtkAW_statRow{flex-wrap:wrap;gap:18px;display:flex}.cvtkAW_stat{flex-direction:column;gap:2px;display:flex}.cvtkAW_statValue{font-variant-numeric:tabular-nums;font-size:18px;font-weight:600}.cvtkAW_statLabel{opacity:.6;font-size:11px}.cvtkAW_providerRow{border-top:1px solid color-mix(in srgb, currentColor 8%, transparent);justify-content:space-between;align-items:center;gap:12px;padding:6px 0;font-size:13px;display:flex}.cvtkAW_providerRow:first-of-type{border-top:none}.cvtkAW_providerName{align-items:center;gap:8px;min-width:0;display:flex}.cvtkAW_providerTokens{font-variant-numeric:tabular-nums;opacity:.75;white-space:nowrap}.cvtkAW_providerBalance{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}.cvtkAW_currentBadge{border:1px solid color-mix(in srgb, currentColor 35%, transparent);opacity:.8;border-radius:999px;flex:none;padding:1px 7px;font-size:10px;font-weight:600}.cvtkAW_chart{flex-direction:column;gap:12px;display:flex}.cvtkAW_chartProvider{flex-direction:column;gap:4px;display:flex}.cvtkAW_chartHead{justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;display:flex}.cvtkAW_chartTokens{font-variant-numeric:tabular-nums;opacity:.65;white-space:nowrap;font-size:11px}.cvtkAW_chartBar{background:color-mix(in srgb, currentColor 8%, transparent);border-radius:999px;height:8px;display:block;overflow:hidden}.cvtkAW_chartFill{background:color-mix(in srgb, currentColor 55%, transparent);border-radius:999px;height:100%;transition:width .3s;display:block}.cvtkAW_chartModel{opacity:.8;grid-template-columns:minmax(80px,180px) 1fr auto;align-items:center;gap:8px;padding-left:14px;font-size:11px;display:grid}.cvtkAW_chartModelName{text-overflow:ellipsis;white-space:nowrap;opacity:.8;overflow:hidden}.cvtkAW_chartModelBar{background:color-mix(in srgb, currentColor 6%, transparent);border-radius:999px;height:4px;display:block;overflow:hidden}.cvtkAW_chartModelFill{background:color-mix(in srgb, currentColor 35%, transparent);border-radius:999px;height:100%;transition:width .3s;display:block}.cvtkAW_trendAxis{opacity:.5;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:10px;display:flex}.cvtkAW_muted{opacity:.6;font-size:12px}.cvtkAW_voucherPreview canvas{border-radius:8px;width:100%;height:auto;display:block}.cvtkAW_buttonRow{gap:8px;display:flex}.cvtkAW_errorLine{opacity:.75;font-size:12px}.cvtkAW_planCard{flex-direction:column;gap:8px;display:flex}.cvtkAW_planHead{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.cvtkAW_planName{font-size:14px;font-weight:600}.cvtkAW_windowRow{flex-direction:column;gap:4px;display:flex}.cvtkAW_windowLabel{opacity:.8;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:12px;display:flex}.cvtkAW_bar{background:color-mix(in srgb, currentColor 10%, transparent);border-radius:999px;height:6px;overflow:hidden}.cvtkAW_barFill{background:color-mix(in srgb, currentColor 55%, transparent);border-radius:999px;height:100%;transition:width .3s}.cvtkAW_barWarn{background:#d97706}.cvtkAW_barLow{background:#dc2626}.cvtkAW_resetLine{opacity:.55;font-variant-numeric:tabular-nums;font-size:11px}.cvtkAW_settingsGrid{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.cvtkAW_settingItem{align-items:center;gap:8px;font-size:13px;display:flex}.cvtkAW_settingItem input[type=checkbox]{accent-color:currentColor}.cvtkAW_settingItem input[type=number]{border:1px solid color-mix(in srgb, currentColor 25%, transparent);width:90px;color:inherit;font:inherit;background:0 0;border-radius:6px;padding:3px 8px;font-size:13px}.cvtkAW_settingItem select{border:1px solid color-mix(in srgb, currentColor 25%, transparent);color:inherit;font:inherit;background:0 0;border-radius:6px;padding:3px 8px;font-size:13px}.cvtkAW_settingItem input:focus-visible,.cvtkAW_settingItem select:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_footCard{box-sizing:border-box;background:color-mix(in srgb, currentColor 4%, transparent);width:100%;color:inherit;border:none;border-radius:12px;margin:2px 0 4px;transition:background-color .12s;position:relative}.cvtkAW_footCard:hover{background:var(--dsw-alias-interactive-bg-hover)}.cvtkAW_footCardCollapsed{background:0 0}.cvtkAW_footMain{appearance:none;box-sizing:border-box;width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:12px;flex-direction:column;gap:4px;padding:8px;display:flex}.cvtkAW_footMain:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_footToggle{appearance:none;width:20px;height:20px;color:inherit;cursor:pointer;opacity:.55;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:0;transition:opacity .12s,background-color .12s;display:inline-flex;position:absolute;top:6px;right:6px}.cvtkAW_footCard:hover .cvtkAW_footToggle{opacity:.8}.cvtkAW_footToggle:hover{opacity:1;background:color-mix(in srgb, currentColor 10%, transparent)}.cvtkAW_footToggle:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, currentColor 45%, transparent);outline:none}.cvtkAW_footToggle svg{display:block}.cvtkAW_footHead{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.cvtkAW_footTitle{opacity:.65;white-space:nowrap;align-items:center;gap:6px;min-width:0;font-size:12px;display:inline-flex}.cvtkAW_footTitle svg{flex:none;display:block}.cvtkAW_footValue{font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:18px;font-size:15px;font-weight:600}.cvtkAW_footLine{opacity:.7;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.cvtkAW_footMeta{opacity:.5;font-variant-numeric:tabular-nums;font-size:10px}.cvtkAW_footCardCollapsed .cvtkAW_footMain{min-height:36px;padding:7px 8px}.cvtkAW_footStrip{white-space:nowrap;align-items:center;gap:6px;padding-right:20px;font-size:12px;display:flex;overflow:hidden}.cvtkAW_footStrip svg{opacity:.65;flex:none;display:block}.cvtkAW_footStripProvider{text-overflow:ellipsis;flex:none;max-width:45%;font-weight:500;overflow:hidden}.cvtkAW_footStripLabel{opacity:.65;text-overflow:ellipsis;overflow:hidden}.cvtkAW_footStripValue{font-variant-numeric:tabular-nums;margin-left:auto;font-weight:600}[data-dsh-frame][data-sidebar-collapsed] .cvtkAW_footCard,[data-sidebar-collapsed] .cvtkAW_footCard{display:none}";
 		const tagId = "@linxin666/dsh-usage/packages/dsh-usage/src/client/usage.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
 			const tag = document.createElement("style");
@@ -224,12 +218,20 @@ window.__ModuleLoader__.load({
 			"chartTokens": "cvtkAW_chartTokens",
 			"currentBadge": "cvtkAW_currentBadge",
 			"currentProvider": "cvtkAW_currentProvider",
-			"entry": "cvtkAW_entry",
-			"entryAction": "cvtkAW_entryAction",
-			"entryIcon": "cvtkAW_entryIcon",
-			"entryLabel": "cvtkAW_entryLabel",
-			"entryMain": "cvtkAW_entryMain",
 			"errorLine": "cvtkAW_errorLine",
+			"footCard": "cvtkAW_footCard",
+			"footCardCollapsed": "cvtkAW_footCardCollapsed",
+			"footHead": "cvtkAW_footHead",
+			"footLine": "cvtkAW_footLine",
+			"footMain": "cvtkAW_footMain",
+			"footMeta": "cvtkAW_footMeta",
+			"footStrip": "cvtkAW_footStrip",
+			"footStripLabel": "cvtkAW_footStripLabel",
+			"footStripProvider": "cvtkAW_footStripProvider",
+			"footStripValue": "cvtkAW_footStripValue",
+			"footTitle": "cvtkAW_footTitle",
+			"footToggle": "cvtkAW_footToggle",
+			"footValue": "cvtkAW_footValue",
 			"header": "cvtkAW_header",
 			"muted": "cvtkAW_muted",
 			"planCard": "cvtkAW_planCard",
@@ -244,18 +246,6 @@ window.__ModuleLoader__.load({
 			"section": "cvtkAW_section",
 			"settingItem": "cvtkAW_settingItem",
 			"settingsGrid": "cvtkAW_settingsGrid",
-			"sidebarBalance": "cvtkAW_sidebarBalance",
-			"sidebarBar": "cvtkAW_sidebarBar",
-			"sidebarBarFill": "cvtkAW_sidebarBarFill",
-			"sidebarMuted": "cvtkAW_sidebarMuted",
-			"sidebarPanel": "cvtkAW_sidebarPanel",
-			"sidebarProvider": "cvtkAW_sidebarProvider",
-			"sidebarProviderHead": "cvtkAW_sidebarProviderHead",
-			"sidebarProviderName": "cvtkAW_sidebarProviderName",
-			"sidebarSummary": "cvtkAW_sidebarSummary",
-			"sidebarSummaryFacts": "cvtkAW_sidebarSummaryFacts",
-			"sidebarSummaryName": "cvtkAW_sidebarSummaryName",
-			"sidebarWindowRow": "cvtkAW_sidebarWindowRow",
 			"stat": "cvtkAW_stat",
 			"statLabel": "cvtkAW_statLabel",
 			"statRow": "cvtkAW_statRow",
@@ -264,356 +254,11 @@ window.__ModuleLoader__.load({
 			"tabActive": "cvtkAW_tabActive",
 			"tabs": "cvtkAW_tabs",
 			"trendAxis": "cvtkAW_trendAxis",
-			"usageEntrySpin": "cvtkAW_usageEntrySpin",
 			"voucherPreview": "cvtkAW_voucherPreview",
 			"windowLabel": "cvtkAW_windowLabel",
 			"windowRow": "cvtkAW_windowRow"
 		};
 		//#endregion
-		//#region src/client/body-mutations.ts
-		/** Cross-bundle registry key; `Symbol.for` so every module copy agrees. */
-		const HUB_KEY = Symbol.for("dsh-web.body-mutation-hub");
-		const INVALIDATION_ONLY = Symbol.for("dsh-web.body-mutation-invalidation");
-		function needsRecords(subscribers) {
-			for (const listener of subscribers) if (!listener[INVALIDATION_ONLY]) return true;
-			return false;
-		}
-		/**
-		* Subscribe to a coalesced DOM re-check without retaining mutation records.
-		* The marked wrapper also works with an older hub, which delivers records
-		* that it simply ignores until a page reload picks up the updated hub.
-		*/
-		function subscribeBodyInvalidations(subscriber) {
-			const listener = () => {
-				subscriber();
-			};
-			listener[INVALIDATION_ONLY] = true;
-			return subscribeBodyMutations(listener);
-		}
-		/**
-		* Subscribe to body-level childList mutations.
-		* @param subscriber - called at most once per animation frame with the records
-		*   collected since the previous flush; must be safe to run repeatedly.
-		* @returns the disposer removing this subscriber (and the observer when it was
-		*   the last one).
-		*/
-		function subscribeBodyMutations(subscriber) {
-			if (typeof globalThis === "undefined" || typeof document === "undefined") return () => {};
-			if (typeof MutationObserver !== "function") return () => {};
-			const registry = globalThis;
-			let hub = registry[HUB_KEY];
-			if (hub === void 0) {
-				const subscribers = /* @__PURE__ */ new Set();
-				const created = {
-					observer: void 0,
-					subscribers,
-					pending: [],
-					scheduled: false
-				};
-				const flush = () => {
-					created.frame = void 0;
-					created.scheduled = false;
-					const batch = created.pending;
-					created.pending = [];
-					for (const listener of [...subscribers]) {
-						if (!subscribers.has(listener)) continue;
-						try {
-							listener(batch);
-						} catch {}
-					}
-				};
-				const schedule = () => {
-					if (created.scheduled) return;
-					created.scheduled = true;
-					if (typeof requestAnimationFrame === "function") created.frame = requestAnimationFrame(flush);
-					else flush();
-				};
-				created.observer = new MutationObserver((records) => {
-					if (needsRecords(subscribers)) for (const record of records) created.pending.push(record);
-					schedule();
-				});
-				created.observer.observe(document.body ?? document.documentElement, {
-					childList: true,
-					subtree: true
-				});
-				registry[HUB_KEY] = created;
-				hub = created;
-			}
-			const active = hub;
-			active.subscribers.add(subscriber);
-			let subscribed = true;
-			return () => {
-				if (!subscribed) return;
-				subscribed = false;
-				active.subscribers.delete(subscriber);
-				if (!needsRecords(active.subscribers)) active.pending = [];
-				if (active.subscribers.size === 0 && registry[HUB_KEY] === active) {
-					active.observer.disconnect();
-					if (active.frame !== void 0 && typeof cancelAnimationFrame === "function") cancelAnimationFrame(active.frame);
-					active.frame = void 0;
-					active.pending = [];
-					active.scheduled = false;
-					delete registry[HUB_KEY];
-				}
-			};
-		}
-		//#endregion
-		//#region src/client/sidebar-entry-core.ts
-		/**
-		* Shared sidebar entry injection core.
-		*
-		* dsh's sidebar shell exposes no slot an external plugin can register into,
-		* so the entry row is injected between the shell's New Session button and the
-		* workspace browser. The injection self-heals: a MutationObserver watches the
-		* sidebar root and re-inserts the row whenever a React re-render displaces it
-		* (re-insertion happens in the same frame, before paint, so no flicker).
-		*
-		* The row is plain DOM (no React tree) so it can never disturb the shell's
-		* reconciliation; the view it toggles is a separate root owned by the caller.
-		*
-		* Packages receive this file as a generated copy via scripts/sync-shared.mjs;
-		* edit the shared source and re-run the sync instead of editing a copy.
-		*/
-		/** Find the sidebar shell root element, or undefined while not yet mounted. */
-		function sidebarRoot() {
-			const column = document.querySelector("[data-pane=\"sidebar\"], [class*=\"sidebarCol\"]");
-			if (column === null) return void 0;
-			return column.querySelector("[class*=\"logoRow\"]")?.parentElement ?? column.firstElementChild;
-		}
-		/** The New Session button: nested in the logo row on current shells, a direct child on legacy shells. */
-		function newSessionButton(root) {
-			const nested = root.querySelector("button[class*=\"newSession\"]");
-			if (nested !== null) return nested;
-			for (const child of root.children) if (child.tagName === "BUTTON") return child;
-		}
-		/** Build the entry row (detached; inserted once the shell is up). */
-		function createEntry(options) {
-			const actions = options.actions ?? [];
-			const composite = actions.length > 0;
-			const entry = document.createElement(composite ? "div" : "button");
-			if (!composite) entry.type = "button";
-			entry.setAttribute(options.rowAttribute, "");
-			if (options.plugin !== void 0) {
-				entry.setAttribute("data-dsh-plugin", options.plugin);
-				entry.setAttribute("data-dsh-part", "sidebar-entry");
-			}
-			entry.className = options.css["entry"] ?? "";
-			const labelSpan = document.createElement("span");
-			labelSpan.className = options.css["entryLabel"] ?? "";
-			const iconSpan = document.createElement("span");
-			iconSpan.className = options.css["entryIcon"] ?? "";
-			iconSpan.innerHTML = options.icon;
-			const main = composite ? document.createElement("button") : entry;
-			if (composite) {
-				main.type = "button";
-				main.className = options.css["entryMain"] ?? "";
-				main.append(iconSpan, labelSpan);
-				entry.append(main);
-			} else entry.append(iconSpan, labelSpan);
-			const actionButtons = [];
-			for (const action of actions) {
-				const button = document.createElement("button");
-				button.type = "button";
-				button.className = options.css["entryAction"] ?? "";
-				button.setAttribute("data-dsh-entry-action", action.id);
-				button.innerHTML = action.icon;
-				button.addEventListener("click", () => {
-					action.onClick(button);
-				});
-				entry.append(button);
-				actionButtons.push({
-					action,
-					button
-				});
-			}
-			let open = false;
-			const applyActions = () => {
-				for (const { action, button } of actionButtons) {
-					button.innerHTML = open || action.inactiveIcon === void 0 ? action.icon : action.inactiveIcon;
-					const text = action.label(open);
-					button.setAttribute("aria-label", text);
-					button.setAttribute("title", text);
-					if (action.inactiveIcon !== void 0) button.setAttribute("aria-expanded", String(open));
-				}
-			};
-			const applyLabel = () => {
-				main.setAttribute("aria-label", options.label());
-				if (options.tooltip !== void 0) main.setAttribute("title", options.tooltip());
-				labelSpan.textContent = options.label();
-				applyActions();
-			};
-			applyLabel();
-			main.addEventListener("click", options.onToggle);
-			if (composite) entry.addEventListener("click", (event) => {
-				if (event.target === entry) options.onToggle();
-			});
-			return {
-				entry,
-				applyLabel,
-				setOpen: (next) => {
-					open = next;
-					applyActions();
-				}
-			};
-		}
-		/** Re-insert the entry after the New Session row (before the browser region). */
-		function placeEntry(root, entry, options) {
-			const button = newSessionButton(root);
-			if (button === void 0) return false;
-			if (entry.parentElement !== root) {
-				const row = button.closest("[class*=\"logoRow\"]");
-				const base = row !== null && row.parentElement === root ? row : button;
-				const family = Array.from(root.children).filter((el) => el instanceof HTMLElement && el.matches(options.familySelectors.join(", ")));
-				const anchor = options.position === "before" ? family.length > 0 ? family[0] : base.nextElementSibling : family.length > 0 ? family[family.length - 1].nextElementSibling : base.nextElementSibling;
-				root.insertBefore(entry, anchor);
-			}
-			return true;
-		}
-		/**
-		* Mount the sidebar entry, waiting for the shell to render and self-healing
-		* on later React re-renders.
-		* @param options - the row's attribute/icon/copy/action/ordering configuration.
-		* @returns disposer removing the entry and its observers.
-		*/
-		function mountSidebarEntry$1(options) {
-			if (typeof document !== "undefined" && document.querySelector(options.rowSelector) !== null) return () => {};
-			const { entry, applyLabel, setOpen } = createEntry(options);
-			let root;
-			let placed = false;
-			let unsubscribeRefresh;
-			if (options.refresh !== void 0) try {
-				unsubscribeRefresh = options.refresh.subscribe(applyLabel);
-			} catch {}
-			const tryPlace = () => {
-				if (root !== void 0 && !root.isConnected) {
-					rootObserver.disconnect();
-					root = void 0;
-					placed = false;
-				}
-				if (placed) {
-					if (document.body.contains(entry)) return;
-					rootObserver.disconnect();
-					root = void 0;
-					placed = false;
-				}
-				root ??= sidebarRoot();
-				if (root === void 0) return;
-				placed = placeEntry(root, entry, options);
-				if (placed) rootObserver.observe(root, {
-					childList: true,
-					subtree: true
-				});
-			};
-			const unsubscribeBody = subscribeBodyInvalidations(() => {
-				tryPlace();
-			});
-			const rootObserver = new MutationObserver(() => {
-				if (root === void 0 || !root.isConnected) {
-					placed = false;
-					tryPlace();
-					return;
-				}
-				if (!root.contains(entry)) placed = placeEntry(root, entry, options);
-			});
-			const unsubscribeActive = options.active === void 0 ? void 0 : (() => {
-				const syncActive = () => {
-					const open = options.active.isOpen();
-					if (open) entry.dataset.active = "true";
-					else delete entry.dataset.active;
-					setOpen(open);
-				};
-				const unsubscribe = options.active.subscribe(syncActive);
-				syncActive();
-				return unsubscribe;
-			})();
-			tryPlace();
-			return () => {
-				unsubscribeBody();
-				rootObserver.disconnect();
-				unsubscribeRefresh?.();
-				unsubscribeActive?.();
-				entry.remove();
-			};
-		}
-		//#endregion
-		//#region src/client/sidebar-entry.ts
-		/**
-		* Sidebar entry injection for the usage panel (issue #1592) — wiring over the
-		* shared core. Unlike the panel-takeover family (task board / SSH / skill
-		* center) this row does not participate in the family block, so it is placed
-		* directly under the New Session row and ordered after those entries. The row
-		* seats the panel's controls as trailing actions: a refresh command and a
-		* collapse chevron mirroring the open state, so the panel below renders only
-		* its content.
-		* @module @linxin666/dsh-usage/client/sidebar-entry
-		*/
-		/** Stable data attribute identifying the injected entry row. */
-		const ENTRY_SELECTOR = "[data-dsh-usage-entry]";
-		/** Inline gauge glyph normalized to the shell's 18px navigation glyph size. */
-		const ICON = "<svg viewBox=\"0 0 16 16\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M2.5 12.5a7 7 0 0 1 11 -4.3\"/><path d=\"M8 12.5V8.2l2.9-2.1\"/><circle cx=\"8\" cy=\"12.5\" r=\"1\"/></svg>";
-		/** Refresh glyph: a clockwise circular arrow, 14px like the sibling action icons. */
-		const REFRESH_ICON = "<svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M13.4 8a5.4 5.4 0 1 1-1.58-3.82\"/><path d=\"M13.4 2.6v2.7h-2.7\"/></svg>";
-		/** Disclosure chevrons: down while expanded, right while collapsed. */
-		const CHEVRON_OPEN_ICON = "<svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m4 6 4 4 4-4\"/></svg>";
-		const CHEVRON_CLOSED_ICON = "<svg viewBox=\"0 0 16 16\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m6 4 4 4-4 4\"/></svg>";
-		/** Refresh cooldown: one forced probe cycle per click, the icon spins meanwhile. */
-		const REFRESH_COOLDOWN_MS = 3e3;
-		/** Trailing actions seated at the row's right edge. */
-		function entryActions(handlers) {
-			return [{
-				id: "refresh",
-				icon: REFRESH_ICON,
-				label: () => t("usage.refresh"),
-				onClick: (button) => {
-					handlers.onRefresh();
-					button.disabled = true;
-					window.setTimeout(() => {
-						button.disabled = false;
-					}, REFRESH_COOLDOWN_MS);
-				}
-			}, {
-				id: "collapse",
-				icon: CHEVRON_OPEN_ICON,
-				inactiveIcon: CHEVRON_CLOSED_ICON,
-				label: (open) => t(open ? "usage.sidebar.toggle.collapse" : "usage.sidebar.toggle.expand"),
-				onClick: () => {
-					handlers.onToggle();
-				}
-			}];
-		}
-		/**
-		* Mount the usage sidebar entry.
-		* @param handlers - the panel's toggle/refresh callbacks and open-state face.
-		* @param locale - locale-change source; when given, re-applies the label on a
-		*   language switch (the plain-DOM row otherwise keeps the mount-time copy).
-		* @returns disposer removing the entry and its observers.
-		*/
-		function mountSidebarEntry(handlers, locale) {
-			return mountSidebarEntry$1({
-				rowAttribute: "data-dsh-usage-entry",
-				rowSelector: ENTRY_SELECTOR,
-				plugin: "usage",
-				icon: ICON,
-				css: usage_module_css_default,
-				label: () => t("usage.sidebar.entry.label"),
-				tooltip: () => t("usage.sidebar.entry.tooltip"),
-				refresh: locale === void 0 ? void 0 : { subscribe: (listener) => locale.subscribe(listener) },
-				onToggle: handlers.onToggle,
-				actions: entryActions(handlers),
-				position: "after",
-				familySelectors: [
-					"[data-dsh-taskboard-entry]",
-					"[data-dsh-ssh-entry]",
-					"[data-dsh-skill-explorer-entry]",
-					"[data-dsh-usage-entry]"
-				],
-				active: {
-					subscribe: handlers.subscribeOpen,
-					isOpen: handlers.isOpen
-				}
-			});
-		}
-		//#endregion
 		//#region src/core/adapters.ts
 		/** Parse a string/number into a finite number, else undefined. */
 		function toNum(value) {
@@ -1104,31 +749,6 @@ window.__ModuleLoader__.load({
 			};
 		}
 		//#endregion
-		//#region src/core/types.ts
-		/** A zeroed totals bucket. */
-		function emptyTotals() {
-			return {
-				inputTokens: 0,
-				outputTokens: 0,
-				cacheReadTokens: 0,
-				cacheWriteTokens: 0,
-				reasoningTokens: 0,
-				calls: 0,
-				cost: 0
-			};
-		}
-		/** Add `right` into `left` in place. */
-		function addTotals(left, right) {
-			left.inputTokens += right.inputTokens;
-			left.outputTokens += right.outputTokens;
-			left.cacheReadTokens += right.cacheReadTokens;
-			left.cacheWriteTokens += right.cacheWriteTokens;
-			left.reasoningTokens += right.reasoningTokens;
-			left.calls += right.calls;
-			left.cost += right.cost;
-			return left;
-		}
-		//#endregion
 		//#region src/core/ledger.ts
 		/** Total tokens of a bucket (billed input + output; reasoning is inside output). */
 		function totalTokens(totals) {
@@ -1291,7 +911,7 @@ window.__ModuleLoader__.load({
 				return "";
 			}
 		}
-		function formatClock(ms) {
+		function formatClock$1(ms) {
 			try {
 				return new Date(ms).toLocaleTimeString([], {
 					hour: "2-digit",
@@ -1382,7 +1002,7 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
-		function balanceLine(provider) {
+		function balanceLine$1(provider) {
 			if (provider.balance !== void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 				className: usage_module_css_default.providerBalance,
 				children: [
@@ -1418,7 +1038,7 @@ window.__ModuleLoader__.load({
 					})]
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					className: usage_module_css_default.providerTokens,
-					children: balanceLine(provider)
+					children: balanceLine$1(provider)
 				})]
 			});
 		}
@@ -1554,7 +1174,7 @@ window.__ModuleLoader__.load({
 								deepseekVisible && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: usage_module_css_default.muted,
 									"data-dsh-part": "peak-status",
-									children: t(deepseekPeriod.peak ? "usage.peak.on" : "usage.peak.off", { time: formatClock(deepseekPeriod.boundaryMs) })
+									children: t(deepseekPeriod.peak ? "usage.peak.on" : "usage.peak.off", { time: formatClock$1(deepseekPeriod.boundaryMs) })
 								}),
 								snapshot.usage.today.totals.calls === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: usage_module_css_default.muted,
@@ -1936,158 +1556,362 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
+		/**
+		* The compact settings row. Both controls write through the shared form the
+		* moment the user changes them, and the Host answers each write with a
+		* boolean: a refused (or transport-failed) write is surfaced as a failed save,
+		* because a value that did not land must never read as applied.
+		*/
 		function SettingsRow(props) {
 			const { settings, snapshot, value } = props;
 			const disabled = snapshot === void 0 || !snapshot.writable;
+			const [failure, setFailure] = (0, react.useState)(void 0);
+			const write = (field, next) => {
+				setFailure(void 0);
+				let answer;
+				try {
+					answer = settings.set(field, next);
+				} catch (error) {
+					setFailure(error instanceof Error ? error.message : String(error));
+					return;
+				}
+				Promise.resolve(answer).then((accepted) => {
+					if (!accepted) setFailure("");
+				}, (error) => {
+					setFailure(error instanceof Error ? error.message : String(error));
+				});
+			};
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: usage_module_css_default.card,
 				"data-dsh-part": "settings-row",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: usage_module_css_default.cardTitle,
-					children: t("usage.config.title")
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: usage_module_css_default.settingsGrid,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
-						className: usage_module_css_default.settingItem,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-							type: "checkbox",
-							checked: value.enabled ?? true,
-							disabled,
-							onChange: (event) => {
-								settings.set("enabled", event.target.checked);
-							}
-						}), t("usage.config.enabled")]
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
-						className: usage_module_css_default.settingItem,
-						children: [t("usage.config.pollIntervalSec"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-							type: "number",
-							min: 30,
-							max: 3600,
-							value: typeof value.pollIntervalSec === "number" ? value.pollIntervalSec : 60,
-							disabled,
-							onChange: (event) => {
-								const parsed = Number(event.target.value);
-								if (Number.isFinite(parsed) && parsed >= 30 && parsed <= 3600) settings.set("pollIntervalSec", Math.round(parsed));
-							}
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: usage_module_css_default.cardTitle,
+						children: t("usage.config.title")
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: usage_module_css_default.settingsGrid,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: usage_module_css_default.settingItem,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+								type: "checkbox",
+								checked: value.enabled ?? true,
+								disabled,
+								onChange: (event) => {
+									write("enabled", event.target.checked);
+								}
+							}), t("usage.config.enabled")]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: usage_module_css_default.settingItem,
+							children: [t("usage.config.pollIntervalSec"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+								type: "number",
+								min: 30,
+								max: 3600,
+								value: typeof value.pollIntervalSec === "number" ? value.pollIntervalSec : 60,
+								disabled,
+								onChange: (event) => {
+									const parsed = Number(event.target.value);
+									if (Number.isFinite(parsed) && parsed >= 30 && parsed <= 3600) write("pollIntervalSec", Math.round(parsed));
+								}
+							})]
 						})]
-					})]
-				})]
+					}),
+					failure !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: usage_module_css_default.errorLine,
+						role: "status",
+						children: [t("usage.config.saveFailed"), failure === "" ? "" : " - " + failure]
+					})
+				]
 			});
 		}
 		//#endregion
-		//#region src/client/UsageSidebarPanel.tsx
+		//#region src/client/body-mutations.ts
+		/** Cross-bundle registry key; `Symbol.for` so every module copy agrees. */
+		const HUB_KEY = Symbol.for("dsh-web.body-mutation-hub");
+		const INVALIDATION_ONLY = Symbol.for("dsh-web.body-mutation-invalidation");
+		function needsRecords(subscribers) {
+			for (const listener of subscribers) if (!listener[INVALIDATION_ONLY]) return true;
+			return false;
+		}
 		/**
-		* Sidebar usage panel (issue #1592): the usage body seated directly under the
-		* sidebar entry row. The row carries the panel's controls (refresh, collapse
-		* chevron), so this component renders only the content: expanded, plan
-		* providers show their quota windows and balance-only providers their
-		* remaining amount; collapsed, a one-line strip shows the current session
-		* provider's today usage (tokens, calls, and cost when priced) from the same
-		* /api/dsh-usage/overview document the settings section renders. The open
-		* state lives in the mount (persisted to localStorage) and arrives through
-		* the open face; polling runs at 10s expanded, 30s collapsed, and pauses
-		* while the page is hidden.
-		* @module @linxin666/dsh-usage/client/UsageSidebarPanel
+		* Subscribe to a coalesced DOM re-check without retaining mutation records.
+		* The marked wrapper also works with an older hub, which delivers records
+		* that it simply ignores until a page reload picks up the updated hub.
 		*/
-		/** Poll cadence while the panel is expanded and the page visible. */
-		const PANEL_POLL_MS = 1e4;
+		function subscribeBodyInvalidations(subscriber) {
+			const listener = () => {
+				subscriber();
+			};
+			listener[INVALIDATION_ONLY] = true;
+			return subscribeBodyMutations(listener);
+		}
 		/**
-		* Poll cadence of the collapsed strip: the current session's usage should
-		* stay visibly live, but a collapsed surface pays a relaxed cadence instead
-		* of the expanded one.
+		* Subscribe to body-level childList mutations.
+		* @param subscriber - called at most once per animation frame with the records
+		*   collected since the previous flush; must be safe to run repeatedly.
+		* @returns the disposer removing this subscriber (and the observer when it was
+		*   the last one).
 		*/
-		const COLLAPSED_POLL_MS = 3e4;
-		/** Bar tone, matching the settings section's thresholds. */
-		function tone(percent) {
-			if (percent >= 90) return usage_module_css_default.barLow;
-			if (percent >= 70) return usage_module_css_default.barWarn;
-			return usage_module_css_default.sidebarBarFill;
+		function subscribeBodyMutations(subscriber) {
+			if (typeof globalThis === "undefined" || typeof document === "undefined") return () => {};
+			if (typeof MutationObserver !== "function") return () => {};
+			const registry = globalThis;
+			let hub = registry[HUB_KEY];
+			if (hub === void 0) {
+				const subscribers = /* @__PURE__ */ new Set();
+				const created = {
+					observer: void 0,
+					subscribers,
+					pending: [],
+					scheduled: false
+				};
+				const flush = () => {
+					created.frame = void 0;
+					created.scheduled = false;
+					const batch = created.pending;
+					created.pending = [];
+					for (const listener of [...subscribers]) {
+						if (!subscribers.has(listener)) continue;
+						try {
+							listener(batch);
+						} catch {}
+					}
+				};
+				const schedule = () => {
+					if (created.scheduled) return;
+					created.scheduled = true;
+					if (typeof requestAnimationFrame === "function") created.frame = requestAnimationFrame(flush);
+					else flush();
+				};
+				created.observer = new MutationObserver((records) => {
+					if (needsRecords(subscribers)) for (const record of records) created.pending.push(record);
+					schedule();
+				});
+				created.observer.observe(document.body ?? document.documentElement, {
+					childList: true,
+					subtree: true
+				});
+				registry[HUB_KEY] = created;
+				hub = created;
+			}
+			const active = hub;
+			active.subscribers.add(subscriber);
+			let subscribed = true;
+			return () => {
+				if (!subscribed) return;
+				subscribed = false;
+				active.subscribers.delete(subscriber);
+				if (!needsRecords(active.subscribers)) active.pending = [];
+				if (active.subscribers.size === 0 && registry[HUB_KEY] === active) {
+					active.observer.disconnect();
+					if (active.frame !== void 0 && typeof cancelAnimationFrame === "function") cancelAnimationFrame(active.frame);
+					active.frame = void 0;
+					active.pending = [];
+					active.scheduled = false;
+					delete registry[HUB_KEY];
+				}
+			};
 		}
+		//#endregion
+		//#region src/client/UsageFootCard.tsx
 		/**
-		* The collapsed-strip facts for the current provider: display name plus
-		* today's adapter-family totals (tokens, calls, cost). The host serves them
-		* strip-ready inside `current`; an older host document is derived against
-		* here. Undefined on a day without usage — a strip about nothing is noise.
+		* Sidebar foot card: the compact usage glance seated below the shell sidebar's
+		* Settings row. It is deliberately a GLANCE, not the panel the 2026-09-18
+		* removal took out. Two states, persisted across reloads:
+		*
+		* - expanded (default): a price-first headline (today's estimated spend,
+		*   falling back to today's tokens when nothing priced was recorded), a
+		*   tokens/calls line, up to two configured-provider balances, and an
+		*   updated-at footer;
+		* - collapsed: a one-line strip with the gauge glyph, the spending
+		*   provider's name, the label and the headline value.
+		*
+		* The card body is one button that opens the settings panel on the usage
+		* section, so detail lives in exactly one place; the corner chevron toggles
+		* the collapse state (sibling buttons — buttons inside a button are invalid
+		* HTML).
+		*
+		* Data comes from the same shared store the settings section reads; the card
+		* runs its own relaxed poll loop (30 s, visible-tab only) because the sidebar
+		* foot is permanently mounted. The card disappears while the plugin is
+		* disabled (settings flag) or while the host serves no usage routes (a 404
+		* means the host half is off), matching the section's own gating.
+		* @module @linxin666/dsh-usage/client/UsageFootCard
 		*/
-		function collapsedSummary(snapshot) {
-			const provider = snapshot.current.provider;
-			if (provider === void 0) return void 0;
-			const name = snapshot.current.displayName ?? snapshot.providers.find((entry) => entry.provider === provider)?.displayName ?? provider;
-			if (snapshot.current.today !== void 0) {
-				const totals = snapshot.current.today;
-				return totals.calls > 0 && totalTokens(totals) > 0 ? {
-					name,
-					totals
-				} : void 0;
+		/** Poll cadence of the permanently seated card; the section's 10 s loop stays its own. */
+		const FOOT_CARD_POLL_MS = 3e4;
+		/** localStorage key holding the collapsed flag ('1' = collapsed strip). */
+		const FOOT_CARD_COLLAPSED_KEY = "dsh-usage.foot-card.collapsed";
+		/** At most this many provider balances render before a +N overflow marker. */
+		const BALANCE_CAP = 2;
+		/** Read the persisted collapsed flag (absent = expanded). */
+		function readFootCardCollapsed() {
+			try {
+				return window.localStorage.getItem(FOOT_CARD_COLLAPSED_KEY) === "1";
+			} catch {
+				return false;
 			}
-			const family = adapterFor(provider);
-			let merged = emptyTotals();
-			for (const row of snapshot.usage.today.providers) if (family === void 0 ? row.provider === provider : adapterFor(row.provider) === family) merged = addTotals(merged, row.totals);
-			return merged.calls > 0 && totalTokens(merged) > 0 ? {
-				name,
-				totals: merged
-			} : void 0;
-		}
-		/** A provider is worth listing when it is configured and carries a fact. */
-		function listable(provider) {
-			return provider.credential !== "none" && (provider.plan !== void 0 || provider.balance !== void 0);
-		}
-		/** One provider row: plan windows when present, otherwise the balance line. */
-		function ProviderBlock(props) {
-			const { provider } = props;
-			const windows = provider.plan?.windows ?? [];
-			if (windows.length > 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: usage_module_css_default.sidebarProvider,
-				"data-dsh-part": "sidebar-provider",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: usage_module_css_default.sidebarProviderHead,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: usage_module_css_default.sidebarProviderName,
-						children: provider.displayName
+		}
+		/** Persist the collapsed flag; storage failures keep the session state. */
+		function writeFootCardCollapsed(collapsed) {
+			try {
+				window.localStorage.setItem(FOOT_CARD_COLLAPSED_KEY, collapsed ? "1" : "0");
+			} catch {}
+		}
+		/** Inline gauge glyph, 14px beside the card title. */
+		function GaugeIcon() {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+				viewBox: "0 0 16 16",
+				width: "14",
+				height: "14",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.3",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				"aria-hidden": "true",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 12.5a7 7 0 0 1 11 -4.3" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 12.5V8.2l2.9-2.1" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "8",
+						cy: "12.5",
+						r: "1"
 					})
-				}), windows.map((window) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: usage_module_css_default.sidebarWindowRow,
-					"data-dsh-part": "sidebar-window",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: window.name ?? t(`usage.plan.windows.${window.key}`) }), window.percent !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: usage_module_css_default.sidebarBar,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: tone(window.percent),
-							style: { width: `${Math.min(100, Math.max(0, window.percent))}%` }
-						})
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [window.percent >= 10 ? Math.round(window.percent) : window.percent.toFixed(1), "%"] })] })]
-				}, window.key))]
+				]
 			});
-			if (provider.balance !== void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: usage_module_css_default.sidebarProvider,
-				"data-dsh-part": "sidebar-provider",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: usage_module_css_default.sidebarProviderHead,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: usage_module_css_default.sidebarProviderName,
-						children: provider.displayName
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: usage_module_css_default.sidebarBalance,
-						children: t("usage.sidebar.balanceLeft", { balance: `${provider.balance.currency} ${provider.balance.totalBalance}` })
-					})]
-				})
+		}
+		/** Disclosure chevrons: down collapses the expanded card, up expands the strip. */
+		function ChevronIcon(props) {
+			return props.collapsed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				viewBox: "0 0 16 16",
+				width: "12",
+				height: "12",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.4",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m4 10 4-4 4 4" })
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				viewBox: "0 0 16 16",
+				width: "12",
+				height: "12",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.4",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m4 6 4 4 4-4" })
 			});
-			return null;
+		}
+		/** A provider row worth showing a balance for: configured, with a probed balance. */
+		function balanceRow(provider) {
+			const supported = provider.balanceSupported === true || provider.balanceSupported === void 0 && provider.supported;
+			return provider.credential !== "none" && supported && provider.balance !== void 0;
+		}
+		/** Currency-symbol prefix for the priced balances (CNY/USD), else the ISO code. */
+		function formatBalance(balance) {
+			const currency = balance.currency.toUpperCase();
+			if (currency === "CNY") return "¥" + balance.totalBalance;
+			if (currency === "USD") return "$" + balance.totalBalance;
+			return currency + " " + balance.totalBalance;
+		}
+		function formatClock(ms) {
+			try {
+				return new Date(ms).toLocaleTimeString([], {
+					hour: "2-digit",
+					minute: "2-digit"
+				});
+			} catch {
+				return "";
+			}
 		}
 		/**
-		* Render the sidebar usage panel body.
-		* @param props - store, the poll callback, and the mount's open-state face.
-		* @returns the panel content, or null while collapsed.
+		* Display name of the provider owning today's priced spend: the day's highest
+		* cost row, else the current session route, resolved through the provider
+		* snapshot (an older host without the day rows falls back to the current
+		* route). Undefined when there is no route to name.
 		*/
-		function UsageSidebarPanel(props) {
-			const { store, poll, open: openState } = props;
+		function spendProvider(snapshot) {
+			let top;
+			for (const row of snapshot.usage.today.providers) {
+				if (row.totals.cost <= 0) continue;
+				if (top === void 0 || row.totals.cost > top.totals.cost) top = row;
+			}
+			const route = top?.provider ?? snapshot.current.provider;
+			if (route === void 0) return void 0;
+			return snapshot.providers.find((entry) => entry.provider === route)?.displayName ?? (route === snapshot.current.provider ? snapshot.current.displayName : void 0) ?? route;
+		}
+		/**
+		* The headline triple: today's priced spend, else today's tokens, else zero.
+		* tokenFallback tells the sub-line to keep only the call count instead of
+		* repeating the total the headline already shows; provider names the spender
+		* beside the collapsed cost headline.
+		*/
+		function headline(snapshot) {
+			const totals = snapshot.usage.today.totals;
+			if (totals.cost > 0) return {
+				label: t("usage.foot.cost"),
+				value: "¥" + totals.cost.toFixed(2),
+				tokenFallback: false,
+				provider: spendProvider(snapshot)
+			};
+			if (totals.calls > 0) return {
+				label: t("usage.today"),
+				value: formatTokens(totalTokens(totals)) + " tokens",
+				tokenFallback: true
+			};
+			return {
+				label: t("usage.foot.cost"),
+				value: "¥0.00",
+				tokenFallback: false
+			};
+		}
+		/** The tokens/calls sub-line under the headline; a quiet no-data line on an empty day. */
+		function usageLine(snapshot, tokenFallback) {
+			const totals = snapshot.usage.today.totals;
+			if (totals.calls === 0) return t("usage.foot.noData");
+			const calls = t("usage.calls", { n: totals.calls });
+			return tokenFallback ? calls : formatTokens(totalTokens(totals)) + " tokens · " + calls;
+		}
+		/** The balance line: up to BALANCE_CAP providers plus a +N overflow marker. */
+		function balanceLine(snapshot) {
+			const rows = snapshot.providers.filter(balanceRow);
+			if (rows.length === 0) return void 0;
+			return rows.slice(0, BALANCE_CAP).map((provider) => provider.displayName + " " + formatBalance(provider.balance)).join(" · ") + (rows.length > BALANCE_CAP ? " +" + String(rows.length - BALANCE_CAP) : "");
+		}
+		/** Card chrome classes for the current collapse state. */
+		function cardClass(collapsed) {
+			return collapsed ? usage_module_css_default.footCard + " " + usage_module_css_default.footCardCollapsed : usage_module_css_default.footCard;
+		}
+		/**
+		* Render the foot card content for the current store snapshot.
+		* @param props - store, poller, settings form and open callback from the mount.
+		* @returns the card, or null while disabled / host-off.
+		*/
+		function UsageFootCard(props) {
+			const { store, poll, onOpen, settings, locale } = props;
 			const ui = (0, react.useSyncExternalStore)(store.subscribe, store.getSnapshot);
-			const open = (0, react.useSyncExternalStore)(openState.subscribe, openState.isOpen);
+			const [, bump] = (0, react.useState)(0);
+			(0, react.useEffect)(() => settings.subscribe(() => bump((count) => count + 1)), [settings]);
+			(0, react.useEffect)(() => locale?.subscribe(() => bump((count) => count + 1)), [locale]);
+			const enabled = settings.getSnapshot().value?.enabled ?? true;
+			const [collapsed, setCollapsed] = (0, react.useState)(readFootCardCollapsed);
+			const toggleCollapsed = () => {
+				setCollapsed((current) => {
+					writeFootCardCollapsed(!current);
+					return !current;
+				});
+			};
 			(0, react.useEffect)(() => {
+				if (!enabled) return void 0;
 				poll();
-				const cadence = open ? PANEL_POLL_MS : COLLAPSED_POLL_MS;
 				let timer;
 				const start = () => {
-					if (timer === void 0 && document.visibilityState === "visible") timer = window.setInterval(poll, cadence);
+					if (timer === void 0 && document.visibilityState === "visible") timer = window.setInterval(poll, FOOT_CARD_POLL_MS);
 				};
 				const onVisibility = () => {
 					if (document.visibilityState === "visible") {
@@ -2104,128 +1928,194 @@ window.__ModuleLoader__.load({
 					if (timer !== void 0) window.clearInterval(timer);
 					document.removeEventListener("visibilitychange", onVisibility);
 				};
-			}, [poll, open]);
+			}, [poll, enabled]);
+			if (!enabled) return null;
 			const snapshot = ui.snapshot;
-			if (!open) {
-				const summary = snapshot === null ? void 0 : collapsedSummary(snapshot);
-				if (summary === void 0) return null;
+			if (snapshot === null && ui.status === "error" && /failed: 404/.test(ui.error ?? "")) return null;
+			const toggle = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: usage_module_css_default.footToggle,
+				"data-dsh-part": "foot-card-toggle",
+				"aria-label": t(collapsed ? "usage.foot.expand" : "usage.foot.collapse"),
+				title: t(collapsed ? "usage.foot.expand" : "usage.foot.collapse"),
+				onClick: toggleCollapsed,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronIcon, { collapsed })
+			});
+			if (snapshot === null) {
+				const quiet = ui.status === "error" ? t("usage.error", { error: ui.error ?? "" }) : t("usage.loading");
 				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: usage_module_css_default.sidebarSummary,
+					className: cardClass(collapsed),
 					"data-dsh-plugin": "usage",
-					"data-dsh-part": "sidebar-summary",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: usage_module_css_default.sidebarSummaryName,
-						children: summary.name
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-						className: usage_module_css_default.sidebarSummaryFacts,
-						children: [
-							t("usage.sidebar.todayUsage", { tokens: formatTokens(totalTokens(summary.totals)) }),
-							" · ",
-							t("usage.calls", { n: summary.totals.calls }),
-							summary.totals.cost > 0 ? ` · ¥${summary.totals.cost.toFixed(2)}` : ""
-						]
-					})]
+					"data-dsh-part": "foot-card",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: usage_module_css_default.footMain,
+						"data-dsh-part": "foot-card-main",
+						"aria-label": t("usage.foot.open"),
+						title: t("usage.foot.open"),
+						onClick: onOpen,
+						children: collapsed ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: usage_module_css_default.footStrip,
+							"data-dsh-part": "foot-card-strip",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GaugeIcon, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: usage_module_css_default.footStripValue,
+								children: "—"
+							})]
+						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: usage_module_css_default.footHead,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: usage_module_css_default.footTitle,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GaugeIcon, {}), t("usage.title")]
+							})
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: usage_module_css_default.footLine,
+							children: quiet
+						})] })
+					}), toggle]
 				});
 			}
-			const providers = snapshot === null ? [] : snapshot.providers.filter(listable);
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: usage_module_css_default.sidebarPanel,
+			const head = headline(snapshot);
+			const balances = balanceLine(snapshot);
+			if (collapsed) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: cardClass(true),
 				"data-dsh-plugin": "usage",
-				"data-dsh-part": "sidebar-panel",
-				children: ui.status === "error" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: usage_module_css_default.sidebarMuted,
-					children: t("usage.sidebar.error", { error: ui.error ?? "" })
-				}) : snapshot === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: usage_module_css_default.sidebarMuted,
-					children: t("usage.sidebar.loading")
-				}) : providers.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: usage_module_css_default.sidebarMuted,
-					children: t("usage.sidebar.empty")
-				}) : providers.map((provider) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProviderBlock, { provider }, provider.provider))
+				"data-dsh-part": "foot-card",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: usage_module_css_default.footMain,
+					"data-dsh-part": "foot-card-main",
+					"aria-label": t("usage.foot.open"),
+					title: t("usage.foot.open"),
+					onClick: onOpen,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: usage_module_css_default.footStrip,
+						"data-dsh-part": "foot-card-strip",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GaugeIcon, {}),
+							head.provider !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: usage_module_css_default.footStripProvider,
+								children: head.provider
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: usage_module_css_default.footStripLabel,
+								children: head.label
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: usage_module_css_default.footStripValue,
+								children: head.value
+							})
+						]
+					})
+				}), toggle]
+			});
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: cardClass(false),
+				"data-dsh-plugin": "usage",
+				"data-dsh-part": "foot-card",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: usage_module_css_default.footMain,
+					"data-dsh-part": "foot-card-main",
+					"aria-label": t("usage.foot.open"),
+					title: t("usage.foot.open"),
+					onClick: onOpen,
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: usage_module_css_default.footHead,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: usage_module_css_default.footTitle,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GaugeIcon, {}), head.label]
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: usage_module_css_default.footValue,
+								children: head.value
+							})]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: usage_module_css_default.footLine,
+							"data-dsh-part": "foot-card-usage",
+							children: usageLine(snapshot, head.tokenFallback)
+						}),
+						balances !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: usage_module_css_default.footLine,
+							"data-dsh-part": "foot-card-balances",
+							children: balances
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: usage_module_css_default.footMeta,
+							children: t("usage.updated", { time: formatClock(snapshot.updatedAt) })
+						})
+					]
+				}), toggle]
 			});
 		}
-		//#endregion
-		//#region src/client/sidebar-panel-mount.tsx
+		/** The shell sidebar's foot area (footer actions + the Settings row), when mounted. */
+		function footArea() {
+			return document.querySelector("[data-pane=\"sidebar\"], [class*=\"sidebarCol\"]")?.querySelector("[class*=\"footArea\"]") ?? void 0;
+		}
 		/**
-		* Sidebar usage panel mounting (issue #1592).
-		*
-		* The panel is a plain DOM row inserted into the sidebar right below the
-		* usage entry row, carrying its own React root. Placement self-heals with the
-		* same page-wide body-mutation hub the entry row uses; the entry row stays the
-		* anchor, so the sidebar order never depends on this module's timing.
-		*
-		* The mount owns the panel's single open state: initialized from localStorage,
-		* flipped by the entry row's toggle controls, and mirrored to the React body
-		* through the subscribe/isOpen face (the same face the entry row's chevron
-		* and highlight read).
-		* @module @linxin666/dsh-usage/client/sidebar-panel-mount
+		* Open the settings panel on the usage section. The shell owns the panel's
+		* open state and exposes no service for it, so the card replays the user's
+		* own path: activate the sidebar Settings trigger, then pick the nav row
+		* carrying the section's (localized) label. Every step degrades silently —
+		* with the panel already open only the nav pick runs, and a missing row
+		* leaves the panel on its default section.
+		* @param label - the usage section's nav label in the active locale.
 		*/
-		/** localStorage key holding the collapsed flag ('1' = collapsed). */
-		const COLLAPSED_STORAGE_KEY = "dsh-usage.sidebar.collapsed";
-		/** Read the persisted collapsed flag (absent = expanded). */
-		function readCollapsed() {
-			try {
-				return window.localStorage.getItem(COLLAPSED_STORAGE_KEY) === "1";
-			} catch {
-				return false;
+		function openUsageSettings(label) {
+			/** Click the nav row carrying the usage label inside the open panel. */
+			const pick = (panel) => {
+				const wanted = label();
+				for (const row of panel.querySelectorAll("nav button")) if (row.textContent !== null && row.textContent.includes(wanted)) {
+					row.click();
+					return;
+				}
+			};
+			const open = document.querySelector("[role=\"dialog\"]");
+			if (open !== null) {
+				pick(open);
+				return;
 			}
-		}
-		/** Persist the collapsed flag; storage failures keep the session state. */
-		function writeCollapsed(collapsed) {
-			try {
-				window.localStorage.setItem(COLLAPSED_STORAGE_KEY, collapsed ? "1" : "0");
-			} catch {}
+			(document.querySelector("[data-pane=\"sidebar\"], [class*=\"sidebarCol\"]")?.querySelector("[class*=\"settingsArea\"] button"))?.click();
+			let tries = 0;
+			const attempt = () => {
+				const panel = document.querySelector("[role=\"dialog\"]");
+				if (panel !== null) {
+					pick(panel);
+					return;
+				}
+				tries += 1;
+				if (tries <= 20) window.setTimeout(attempt, 50);
+			};
+			window.setTimeout(attempt, 0);
 		}
 		/**
-		* Mount the sidebar usage panel below its entry row.
-		* @param props - the store and poll callback of the apply body.
-		* @returns the panel controller.
+		* Mount the sidebar foot card directly above the Settings row.
+		* @param props - the store/poll/settings/open inputs of the apply body.
+		* @returns disposer removing the container and its observers.
 		*/
-		function mountUsagePanel(props) {
+		function mountUsageFootCard(props) {
+			if (typeof document !== "undefined" && document.querySelector("[data-dsh-usage-foot-card]") !== null) return () => {};
 			const container = document.createElement("div");
-			container.setAttribute("data-dsh-usage-view", "");
-			const listeners = /* @__PURE__ */ new Set();
-			let open = !readCollapsed();
-			const emit = () => {
-				for (const listener of [...listeners]) listener();
-			};
-			const openState = {
-				subscribe: (listener) => {
-					listeners.add(listener);
-					return () => {
-						listeners.delete(listener);
-					};
-				},
-				isOpen: () => open
-			};
+			container.setAttribute("data-dsh-usage-foot-card", "");
 			const root = (0, react_dom_client.createRoot)(container);
-			root.render((0, react.createElement)(UsageSidebarPanel, {
-				store: props.store,
-				poll: props.poll,
-				open: openState
-			}));
-			/** Keep the panel as the row directly after the usage entry. */
+			root.render((0, react.createElement)(UsageFootCard, props));
+			/** Keep the container directly above the Settings seat inside the foot area. */
 			const place = () => {
-				const entry = document.querySelector(ENTRY_SELECTOR);
-				if (entry === null || entry.parentElement === null) return;
-				if (container.parentElement !== entry.parentElement || entry.nextElementSibling !== container) entry.parentElement.insertBefore(container, entry.nextElementSibling);
+				const foot = footArea();
+				if (foot === void 0) return;
+				const settings = foot.querySelector("[class*=\"settingsArea\"]");
+				if (settings !== null) {
+					if (container.nextElementSibling !== settings) foot.insertBefore(container, settings);
+					return;
+				}
+				if (foot.lastElementChild !== container) foot.append(container);
 			};
 			place();
 			const unsubscribeBody = subscribeBodyInvalidations(place);
-			return {
-				isOpen: () => open,
-				subscribe: openState.subscribe,
-				toggle: () => {
-					open = !open;
-					writeCollapsed(!open);
-					emit();
-				},
-				dispose: () => {
-					unsubscribeBody();
-					root.unmount();
-					container.remove();
-					listeners.clear();
-				}
+			return () => {
+				unsubscribeBody();
+				root.unmount();
+				container.remove();
 			};
 		}
 		//#endregion
@@ -2244,7 +2134,7 @@ window.__ModuleLoader__.load({
 			overview: () => usageFetch("/api/dsh-usage/overview", "GET"),
 			refresh: () => usageFetch("/api/dsh-usage/refresh", "POST")
 		};
-		/** Settings namespace the section edits (the host plugin registers it). */
+		/** Settings namespace the section edits (dsh-web-settings maps it onto this row's profile entry id). */
 		const USAGE_SETTINGS_NS = "dsh-usage";
 		/** First-level nav position: directly below the Workshop section (order 150). */
 		const SECTION_ORDER = 151;
@@ -2253,7 +2143,7 @@ window.__ModuleLoader__.load({
 			"slots",
 			"locale",
 			"connection",
-			"settingsScope",
+			"configForms",
 			"remote"
 		];
 		/**
@@ -2273,7 +2163,8 @@ window.__ModuleLoader__.load({
 					return () => {};
 				}
 			}, "dsh-usage: dictionaries");
-			const settingsScope = (ctx.get("webUiSettings") ?? ctx.settingsScope).bind({ namespace: USAGE_SETTINGS_NS });
+			const binder = ctx.get("webUiSettings");
+			const settingsForm = binder !== void 0 ? binder.bind({ namespace: USAGE_SETTINGS_NS }) : ctx.configForms.get(USAGE_SETTINGS_NS);
 			const store = createUsageStore().create();
 			let pollSeq = 0;
 			const poll = () => {
@@ -2302,28 +2193,22 @@ window.__ModuleLoader__.load({
 				store,
 				poll,
 				refresh,
-				settings: settingsScope
+				settings: settingsForm
 			});
-			const panel = mountUsagePanel({
+			const disposeFootCard = mountUsageFootCard({
 				store,
-				poll
-			});
-			const disposeEntry = mountSidebarEntry({
-				onToggle: () => {
-					panel.toggle();
-				},
-				onRefresh: () => {
-					refresh();
+				poll,
+				settings: settingsForm,
+				onOpen: () => {
+					openUsageSettings(() => t("usage.title"));
 				},
-				isOpen: () => panel.isOpen(),
-				subscribeOpen: (listener) => panel.subscribe(listener)
-			}, ctx.locale);
+				locale: ctx.locale
+			});
 			ctx.effect(() => () => {
 				try {
-					disposeEntry();
+					disposeFootCard();
 				} catch {}
-				panel.dispose();
-			}, "dsh-usage: sidebar panel");
+			}, "dsh-usage: sidebar foot card");
 			ctx.slots.inject("settings.section", () => {
 				try {
 					const unregister = ctx.slots.register({