@cassius0924/dsh-usage-dashboard 0.6.1 → 0.8.0

package/lib/client.js

@@ -26,6 +26,7 @@ __export(index_exports, {
   name: () => name
 });
 module.exports = __toCommonJS(index_exports);
+var import_react7 = require("react");
 
 // src/client/boundary.tsx
 var import_react = require("react");
@@ -317,7 +318,7 @@ var zh = {
   "delta.noBaseline": "\u65E0\u5BF9\u6BD4",
   "delta.flat": "\u6301\u5E73",
   "period.volume": "{tokens} tokens \xB7 {calls}",
-  "budget.unset": "\u8FD8\u6CA1\u8BBE\u7F6E\u6708\u5EA6\u9884\u7B97\uFF0C\u65E0\u6CD5\u63D0\u524D\u5224\u65AD\u662F\u5426\u4F1A\u8D85\u652F\u3002",
+  "budget.unset": "\u672A\u8BBE\u7F6E\u6708\u5EA6\u9884\u7B97\u3002",
   "budget.configure": "\u8BBE\u7F6E\u9884\u7B97",
   "budget.over": "\u5DF2\u8D85\u9884\u7B97 \xA5{amount}",
   "budget.forecastOver": "\u7167\u5F53\u524D\u901F\u5EA6\uFF0C\u9884\u8BA1\u8D85\u51FA \xA5{amount}",
@@ -340,7 +341,6 @@ var zh = {
   "pricing.unit": "\u5355\u4F4D\uFF1A{currency} / \u767E\u4E07 tokens\u3002",
   "pricing.splitNote": "\u9AD8\u5CF0\u65F6\u6BB5\u4E3A\u5317\u4EAC\u65F6\u95F4 {windows}\uFF08\u5468\u4E00\u81F3\u5468\u4E94\uFF09\uFF0C\u5176\u4F59\u4E3A\u95F2\u65F6\uFF08\u4EF7\u683C\u51CF\u534A\uFF09\uFF1B\u6BCF\u6761\u7528\u91CF\u6309\u53D1\u751F\u65F6\u523B\u751F\u6548\u7684\u5B98\u65B9\u4EF7\u683C\u4F30\u7B97\u3002",
   "pricing.visionNote": "\u56FE\u7247\u6309\u5C3A\u5BF8\u6298\u7B97 token\uFF0C\u4E0E\u6587\u672C\u4E00\u5E76\u8BA1\u8D39\u3002",
-  "pricing.modelNote": "deepseek-v4-flash\u3001deepseek-v4-flash-vision-exp \u662F\u65E7\u6A21\u578B\u540D\uFF0C\u73B0\u7531 deepseek-flash \u627F\u63A5\u5E76\u6309 Flash \u4EF7\u8BA1\u8D39\uFF1B2026-09-14 12:00 \u8D77 deepseek-v4-pro \u7684\u8BF7\u6C42\u4E5F\u4F1A\u8DEF\u7531\u5230 V4.1-Flash\uFF0C\u6309 Flash \u4EF7\u8BA1\u8D39\u3002",
   "pricing.unknown": "\u672A\u77E5\u6A21\u578B\u6309 deepseek-v4-pro \u8BA1\u4EF7\u3002",
   "coverage.noRange": "\u6682\u65E0\u6709\u6548\u7528\u91CF\u65F6\u95F4",
   "coverage.title": "\u7EDF\u8BA1\u8303\u56F4",
@@ -361,23 +361,19 @@ var zh = {
   "export.modelCsv": "\u9010\u6A21\u578B CSV",
   "export.fullJson": "\u5B8C\u6574 JSON",
   "export.jsonHint": "\u542B\u56FE\u8868\u4E0E\u6392\u884C",
-  "cache.empty": "\u8FD8\u6CA1\u6709 prompt token \u53EF\u7EDF\u8BA1\u7F13\u5B58\u547D\u4E2D\u3002",
+  "cache.empty": "\u6682\u65E0\u7F13\u5B58\u547D\u4E2D\u6570\u636E\u3002",
   "cache.rate": "\u7F13\u5B58\u547D\u4E2D\u7387",
   "cache.saved": "\u5DF2\u8282\u7701\u8D39\u7528\uFF08\u4F30\u7B97\uFF09",
   "cache.allMiss": "\u82E5\u5168\u90E8\u672A\u547D\u4E2D",
   "cache.aria": "\u7F13\u5B58\u547D\u4E2D {hit}%\uFF0C\u672A\u547D\u4E2D {miss}%",
   "cache.hitLegend": "\u7F13\u5B58\u547D\u4E2D {tokens}",
   "cache.missLegend": "\u672A\u547D\u4E2D {tokens}\uFF08\u6309\u672A\u547D\u4E2D\u4EF7\u8BA1\u8D39\uFF09",
-  "cache.lowHint": "\u547D\u4E2D\u7387\u504F\u4F4E\uFF1A\u9891\u7E41\u6539\u52A8 system prompt / \u5DE5\u5177\u5B9A\u4E49\u4F1A\u8BA9\u524D\u7F00\u7F13\u5B58\u5931\u6548\uFF0C\u628A\u7A33\u5B9A\u5185\u5BB9\u653E\u5728\u5BF9\u8BDD\u6700\u524D\u9762\u80FD\u63D0\u9AD8\u547D\u4E2D\u7387\u3002",
-  "cache.goodHint": "\u524D\u7F00\u7F13\u5B58\u628A\u91CD\u590D\u7684 prompt \u524D\u7F00\u6309\u547D\u4E2D\u4EF7\u8BA1\u8D39\uFF0C\u662F\u8FD9\u4EFD\u8D26\u5355\u4E0A\u6700\u5927\u7684\u7701\u94B1\u6760\u6746\u3002",
-  "peak.empty": "\u8FD8\u6CA1\u6709\u53EF\u6309\u65F6\u6BB5\u5F52\u7C7B\u7684\u7528\u91CF\u3002",
+  "peak.empty": "\u6682\u65E0\u7528\u91CF\u3002",
   "peak.aria": "\u9AD8\u5CF0\u65F6\u6BB5 {peak}%\uFF0C\u95F2\u65F6 {offPeak}%",
   "peak.peakLegend": "\u9AD8\u5CF0 {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.offPeakLegend": "\u95F2\u65F6 {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.shift": "\u82E5\u9AD8\u5CF0\u7528\u91CF\u90FD\u632A\u5230\u95F2\u65F6",
   "peak.saving": "\u53EF\u7701 \xA5{amount}",
-  "peak.schedule": "\u9AD8\u5CF0\u65F6\u6BB5\u4E3A\u5317\u4EAC\u65F6\u95F4 {windows}\uFF08\u5468\u4E00\u81F3\u5468\u4E94\uFF09\uFF0C\u95F2\u65F6\u4EF7\u683C\u51CF\u534A\u3002",
-  "peak.activeHint": "\u628A\u6279\u91CF\u3001\u53EF\u5EF6\u540E\u7684\u4EFB\u52A1\u653E\u5230\u95F2\u65F6\u8DD1\uFF0C\u540C\u6837\u7684 token \u53EA\u8981\u4E00\u534A\u7684\u94B1\u3002",
   "vision.empty": "{window}\u6CA1\u6709\u56FE\u7247\u8F93\u5165\u3002",
   "vision.title": "\u56FE\u7247 / \u591A\u6A21\u6001\u7528\u91CF",
   "vision.images": "\u56FE\u7247\u5F20\u6570",
@@ -385,7 +381,7 @@ var zh = {
   "vision.cost": "\u4F30\u7B97\u8D39\u7528",
   "vision.tokensShare": "\u5360\u8F93\u5165 {percent}%",
   "vision.costShare": "\u5360\u8D39\u7528 {percent}%",
-  "vision.note": "\u56FE\u7247\u6309\u5B98\u65B9\u6362\u7B97\u89C4\u5219\u4F30\u7B97\uFF1A\u5148\u6309\u6BD4\u4F8B\u7F29\u653E\uFF08\u4E0A\u9650 ~800\xD7800\u3001\u4E0B\u9650 384\xD7384\uFF09\uFF0Ctoken \u4E0E\u7F29\u653E\u540E\u9762\u79EF\u6210\u6B63\u6BD4\u3001\u6BCF\u5F20\u4E0A\u9650 384\uFF1B\u56FE\u7247\u5F52\u5C5E\u5230\u968F\u540E\u4E00\u6B21\u6A21\u578B\u8C03\u7528\uFF0C\u6309\u8BE5\u8C03\u7528\u7684\u65F6\u6BB5\u4E0E\u6A21\u578B\u5355\u4EF7\u4F30\u7B97\uFF0C\u5B9E\u9645\u4EE5\u63A5\u53E3\u8FD4\u56DE\u7684\u7528\u91CF\u4E3A\u51C6\u3002",
+  "vision.note": "\u6309\u5B98\u65B9\u89C4\u5219\u4F30\u7B97\uFF0C\u5B9E\u9645\u4EE5\u63A5\u53E3\u8FD4\u56DE\u7684\u7528\u91CF\u4E3A\u51C6\u3002",
   "vision.sessionsTitle": "\u56FE\u7247\u6700\u591A\u7684\u4F1A\u8BDD",
   "vision.sessionRow": "{images} \u5F20 \xB7 \xA5{cost}",
   "vision.dailyTitle": "{window} \xB7 \u6BCF\u5929\u56FE\u7247\u6570",
@@ -394,7 +390,7 @@ var zh = {
   "sessions.empty": "\u8FD8\u6CA1\u6709\u4EA7\u751F\u8D39\u7528\u7684\u4F1A\u8BDD\u3002",
   "sessions.detail": "{tokens} tokens \xB7 {calls} \xB7 {ago}",
   "sessions.share": "\u5360 {percent}%",
-  "sessions.more": "\u5171 {count} \u4E2A\u4F1A\u8BDD\u6709\u7528\u91CF\uFF0C\u4E0A\u9762\u662F\u6700\u8D35\u7684 {shown} \u4E2A\u3002",
+  "sessions.more": "\u5171 {count} \u4E2A\u4F1A\u8BDD\uFF0C\u663E\u793A\u6700\u8D35\u7684 {shown} \u4E2A\u3002",
   "sessions.fallbackTitle": "\u4F1A\u8BDD {id}",
   "models.empty": "\u8FD8\u6CA1\u6709\u53EF\u5F52\u7C7B\u7684\u6A21\u578B\u7528\u91CF\u3002",
   "models.shareAria": "{name} \u5360\u603B\u8D39\u7528 {percent}%",
@@ -421,9 +417,9 @@ var zh = {
   "chart.dimensionLabel": "\u5207\u6362\u56FE\u8868\u7EF4\u5EA6",
   "chart.daily": "\u9010\u5929",
   "chart.hourly": "\u9010\u5C0F\u65F6",
-  "chart.noWindowData": "{window}\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\uFF0C\u6362\u4E2A\u66F4\u957F\u5468\u671F\u770B\u770B\u3002",
-  "chart.heatmapTitle": "\u8FD1\u4E00\u5E74 \xB7 \u6BCF\u65E5\u7528\u91CF\u70ED\u529B\u56FE",
-  "chart.empty": "\u8FD8\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002\u5728 DSH \u91CC\u8DD1\u4E00\u8F6E\u5BF9\u8BDD\uFF0C\u8FD9\u91CC\u4F1A\u51FA\u73B0\u9010\u5929 / \u9010\u5C0F\u65F6\u7EDF\u8BA1\u4E0E\u8D39\u7528\u4F30\u7B97\u3002",
+  "chart.noWindowData": "{window}\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002",
+  "chart.heatmapTitle": "\u8FD1\u4E00\u5E74 \xB7 \u6BCF\u65E5",
+  "chart.empty": "\u8FD8\u6CA1\u6709\u7528\u91CF\u8BB0\u5F55\u3002",
   "chart.hourPoint": "{hour} \u70B9",
   "chart.tooltip": "{head} \xB7 {tokens} tokens \xB7 \xA5{cost} \xB7 {calls}",
   "chart.less": "\u5C11",
@@ -489,37 +485,39 @@ var zh = {
   "balance.overYear": "> 365 \u5929",
   "balance.noRunway": "\u8FD1 {days} \u5929\u6CA1\u6709\u7528\u91CF\uFF0C\u65E0\u6CD5\u4F30\u7B97",
   "balance.runwayTitle": "\u6309\u8FD1 {days} \u5929\u65E5\u5747 \xA5{cost} \u4F30\u7B97\uFF08\u542B\u65E0\u7528\u91CF\u7684\u65E5\u5B50\uFF1B\u4ECA\u5929\u5C1A\u672A\u8FC7\u5B8C\uFF09",
-  "balance.empty": "\u8BFB\u4E0D\u5230\u4F59\u989D\u3002\u8BF7\u786E\u8BA4\u8D26\u53F7\u5DF2\u767B\u5F55\uFF0C\u6216\u5728\u300C\u8BBE\u7F6E \u2192 \u6A21\u578B\u300D\u4E2D\u586B\u5199 DEEPSEEK_API_KEY\uFF0C\u7136\u540E\u70B9\u53F3\u4E0A\u89D2\u5237\u65B0\u3002",
-  "sessionUsage.title": "\u5F53\u524D\u4F1A\u8BDD\u6D88\u8017\uFF08\u8D39\u7528\u4E3A\u4F30\u7B97\uFF09",
-  "sessionUsage.cost": "\u672C\u4F1A\u8BDD\u8D39\u7528",
-  "sessionUsage.tokens": "\u672C\u4F1A\u8BDD tokens",
-  "sessionUsage.calls": "\u672C\u4F1A\u8BDD\u8C03\u7528",
+  "balance.empty": "\u8BFB\u4E0D\u5230\u4F59\u989D\uFF0C\u8BF7\u68C0\u67E5\u8D26\u53F7\u767B\u5F55\u6216 API Key \u540E\u5237\u65B0\u3002",
+  "sessionUsage.title": "\u5F53\u524D\u4F1A\u8BDD\u6D88\u8017",
+  "common.estimated": "\u8D39\u7528\u4E3A\u4F30\u7B97",
+  "sessionUsage.cost": "\u8D39\u7528",
+  "sessionUsage.tokens": "Tokens",
+  "sessionUsage.calls": "\u8C03\u7528\u6B21\u6570",
   "sessionUsage.range": "\u6D3B\u8DC3\u65F6\u95F4 {range}",
-  "sessionUsage.empty": "\u8FD9\u4E2A\u4F1A\u8BDD\u8FD8\u6CA1\u6709\u4EA7\u751F\u7528\u91CF\u3002\u53D1\u4E00\u6761\u6D88\u606F\u540E\uFF0C\u8FD9\u91CC\u4F1A\u663E\u793A\u8FD9\u4E2A\u4F1A\u8BDD\u4E13\u5C5E\u7684\u8D39\u7528\u4E0E\u6A21\u578B\u660E\u7EC6\u3002",
-  "overview.title": "\u6D88\u8017\u6982\u89C8\uFF08\u8D39\u7528\u4E3A\u4F30\u7B97\uFF09",
+  "sessionUsage.single": "{model} \xB7 \u8F93\u5165 {input} / \u8F93\u51FA {output} / \u7F13\u5B58 {cache}",
+  "sessionUsage.empty": "\u8FD9\u4E2A\u4F1A\u8BDD\u8FD8\u6CA1\u6709\u7528\u91CF\u3002",
+  "overview.title": "\u6D88\u8017\u6982\u89C8",
   "overview.today": "\u4ECA\u65E5",
   "overview.month": "\u672C\u6708",
   "overview.total": "\u7D2F\u8BA1",
   "overview.vsYesterday": "\u8F83\u6628\u65E5",
   "overview.vsLastMonth": "\u8F83\u4E0A\u6708\u540C\u671F",
   "overview.empty": "\u8FD8\u6CA1\u6709\u53EF\u7EDF\u8BA1\u7684\u6D88\u8017\u3002",
-  "usage.trendTitle": "\u7528\u91CF\u8D8B\u52BF\uFF08tokens\uFF09",
+  "usage.trendTitle": "\u7528\u91CF\u8D8B\u52BF",
   "usage.windowInput": "{window}\u8F93\u5165",
   "usage.modelCalls": "\u6A21\u578B\u8C03\u7528",
   "heatmap.title": "\u7528\u91CF\u70ED\u529B\u56FE",
   "peak.title": "\u9AD8\u5CF0 / \u95F2\u65F6\u5206\u5E03",
   "cache.title": "\u7F13\u5B58\u547D\u4E2D\u4E0E\u8282\u7701",
-  "models.title": "\u6A21\u578B\u6210\u672C\u6392\u884C \xB7 {window}",
-  "sessions.title": "\u4F1A\u8BDD\u6210\u672C\u6392\u884C \xB7 {window}",
+  "models.title": "\u6A21\u578B\u6210\u672C\u6392\u884C",
+  "sessions.title": "\u4F1A\u8BDD\u6210\u672C\u6392\u884C",
   "links.title": "\u5FEB\u6377\u5165\u53E3",
   "links.usage": "\u67E5\u770B\u989D\u5EA6 / \u7528\u91CF",
   "links.apiKey": "\u751F\u6210 API Key",
   "links.status": "\u670D\u52A1\u72B6\u6001",
   "settings.title": "\u8BBE\u7F6E",
   "settings.widget": "\u5728\u5176\u4ED6\u9875\u9762\u663E\u793A\u53F3\u4E0B\u89D2\u60AC\u6D6E\u989D\u5EA6\u7A97\u53E3",
-  "settings.widgetHint": "\u989D\u5EA6\u9875\u4F1A\u81EA\u52A8\u9690\u85CF\u6D6E\u7A97\uFF1B\u5176\u4ED6\u9875\u9762\u662F\u5426\u5C55\u793A\u7531\u4E0B\u65B9\u9009\u62E9\u51B3\u5B9A\u3002",
+  "settings.widgetHint": "\u989D\u5EA6\u9875\u81EA\u52A8\u9690\u85CF\uFF1B\u5176\u4ED6\u9875\u9762\u6309\u4E0B\u65B9\u9009\u62E9\u663E\u793A\u3002",
   "settings.widgetTabs": "\u5C55\u793A\u6D6E\u7A97\u7684\u9875\u9762",
-  "settings.widgetTabsHint": "\u9875\u9762\u5217\u8868\u6765\u81EA DSH \u7684\u5B9E\u65F6 Tab \u6CE8\u518C\u8868\uFF1B\u5176\u4ED6\u63D2\u4EF6\u65B0\u589E\u7684 Tab \u4E5F\u4F1A\u81EA\u52A8\u51FA\u73B0\u5728\u8FD9\u91CC\u3002",
+  "settings.widgetTabsHint": "\u5217\u8868\u4F1A\u968F\u5DF2\u5B89\u88C5\u7684\u9875\u9762\u81EA\u52A8\u66F4\u65B0\u3002",
   "settings.widgetTabsEmpty": "\u5F53\u524D\u6CA1\u6709\u53EF\u914D\u7F6E\u7684\u4F1A\u8BDD\u9875\u9762\u3002",
   "settings.lowBalance": "\u4F59\u989D\u9884\u8B66\u7EBF",
   "settings.lowBalanceOn": "\u4F59\u989D\u4F4E\u4E8E {amount} {currency} \u65F6\uFF0C\u8FD9\u91CC\u548C\u60AC\u6D6E\u7A97\u90FD\u4F1A\u8F6C\u4E3A\u8B66\u793A\u8272\u3002\u586B 0 \u5173\u95ED\u3002",
@@ -527,6 +525,18 @@ var zh = {
   "settings.monthlyBudget": "\u6708\u5EA6\u9884\u7B97",
   "settings.monthlyBudgetOn": "\u6309\u5317\u4EAC\u65F6\u95F4\u81EA\u7136\u6708\u8DDF\u8E2A {amount} CNY \u9884\u7B97\uFF0C\u5E76\u5728\u6D88\u8017\u6982\u89C8\u9884\u6D4B\u6708\u5E95\u82B1\u8D39\u3002\u586B 0 \u5173\u95ED\u3002",
   "settings.monthlyBudgetOff": "\u586B\u4E00\u4E2A\u5927\u4E8E 0 \u7684\u91D1\u989D\uFF0C\u6D88\u8017\u6982\u89C8\u4F1A\u663E\u793A\u8FDB\u5EA6\u4E0E\u6708\u5E95\u9884\u6D4B\u3002",
+  "settings.sidebarEntry": "\u4FA7\u8FB9\u680F\u989D\u5EA6\u5165\u53E3",
+  "settings.sidebarEntryHint": "\u5728\u4FA7\u8FB9\u680F\u9876\u90E8\u6216\u5E95\u90E8\u653E\u4E00\u4E2A\u300C\u989D\u5EA6\u300D\u5165\u53E3\uFF0C\u6253\u5F00\u8D26\u6237\u7EA7\u989D\u5EA6\u9875\u3002",
+  "settings.sidebarEntryOff": "\u5173\u95ED",
+  "settings.sidebarEntryTop": "\u9876\u90E8",
+  "settings.sidebarEntryBottom": "\u5E95\u90E8",
+  "settings.tabPosition": "\u300C\u989D\u5EA6\u300D\u6807\u7B7E\u4F4D\u7F6E",
+  "settings.tabPositionHint": "\u62D6\u52A8\u300C\u989D\u5EA6\u300D\u8C03\u6574\u6807\u7B7E\u4F4D\u7F6E\u3002",
+  "settings.tabDragAria": "\u62D6\u52A8\u300C\u989D\u5EA6\u300D\u8C03\u6574\u6807\u7B7E\u4F4D\u7F6E",
+  "settings.tabMoveEarlier": "\u524D\u79FB",
+  "settings.tabMoveLater": "\u540E\u79FB",
+  "panel.caption": "\u8D26\u6237\u7EA7 \xB7 \u8DE8\u5168\u90E8\u4F1A\u8BDD",
+  "panel.openAria": "\u6253\u5F00\u989D\u5EA6\u9875",
   "widget.updatedNow": "\u521A\u521A\u66F4\u65B0",
   "widget.stale": "{minutes} \u5206\u949F\u524D\u7684\u6570\u636E\uFF0C\u70B9 \u21BB \u66F4\u65B0",
   "widget.loading": "\u67E5\u8BE2\u4E2D\u2026",
@@ -576,7 +586,7 @@ var en = {
   "delta.noBaseline": "No baseline",
   "delta.flat": "No change",
   "period.volume": "{tokens} tokens \xB7 {calls}",
-  "budget.unset": "Set a monthly budget to see whether current spending is on track.",
+  "budget.unset": "No monthly budget set.",
   "budget.configure": "Set budget",
   "budget.over": "Over budget by \xA5{amount}",
   "budget.forecastOver": "At this pace, \xA5{amount} over by month-end",
@@ -599,7 +609,6 @@ var en = {
   "pricing.unit": "Unit: {currency} / million tokens. ",
   "pricing.splitNote": "Peak periods are {windows} Beijing time, Monday to Friday; off-peak rates are half price. Each record is estimated at the official rates in force when it was written. ",
   "pricing.visionNote": "Images are converted to tokens by size and charged together with text. ",
-  "pricing.modelNote": "deepseek-v4-flash and deepseek-v4-flash-vision-exp are legacy names, now served by deepseek-flash at Flash rates; from 2026-09-14 12:00 deepseek-v4-pro requests are routed to V4.1-Flash and billed at Flash rates. ",
   "pricing.unknown": "Unknown models use deepseek-v4-pro rates.",
   "coverage.noRange": "No valid usage timestamps",
   "coverage.title": "Coverage",
@@ -620,23 +629,19 @@ var en = {
   "export.modelCsv": "Model CSV",
   "export.fullJson": "Full JSON",
   "export.jsonHint": "Charts and rankings included",
-  "cache.empty": "No prompt tokens are available for cache analysis yet.",
+  "cache.empty": "No cache data yet.",
   "cache.rate": "Cache hit rate",
   "cache.saved": "Estimated savings",
   "cache.allMiss": "Cost with no hits",
   "cache.aria": "{hit}% cache hits, {miss}% misses",
   "cache.hitLegend": "Cache hits {tokens}",
   "cache.missLegend": "Misses {tokens} (charged at miss rate)",
-  "cache.lowHint": "Low hit rate: frequent changes to the system prompt or tool definitions invalidate prefix caching. Put stable content first to improve reuse.",
-  "cache.goodHint": "Prefix caching charges repeated prompt prefixes at the hit rate, making it the largest saving lever on this bill.",
-  "peak.empty": "No usage can be classified by pricing period yet.",
+  "peak.empty": "No usage yet.",
   "peak.aria": "{peak}% peak, {offPeak}% off-peak",
   "peak.peakLegend": "Peak {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.offPeakLegend": "Off-peak {share}% \xB7 {tokens} tokens \xB7 {calls}",
   "peak.shift": "If all peak usage moved off-peak",
   "peak.saving": "Save \xA5{amount}",
-  "peak.schedule": "Peak periods are {windows} Beijing time, Monday to Friday; off-peak rates are half price. ",
-  "peak.activeHint": "Run batch or delay-tolerant work off-peak to pay half as much for the same tokens.",
   "vision.empty": "No image input in {window}.",
   "vision.title": "Image / multimodal usage",
   "vision.images": "Images",
@@ -644,7 +649,7 @@ var en = {
   "vision.cost": "Estimated cost",
   "vision.tokensShare": "{percent}% of input",
   "vision.costShare": "{percent}% of cost",
-  "vision.note": "Images are estimated with the official rule: resized keeping aspect ratio (cap ~800\xD7800, floor 384\xD7384), tokens proportional to the resized area with a 384-token cap per image. Each image is attributed to the next model call and priced at that call's period and model rate; the provider usage numbers remain the source of truth.",
+  "vision.note": "Estimated with the official rule; provider usage numbers are the source of truth.",
   "vision.sessionsTitle": "Sessions with the most images",
   "vision.sessionRow": "{images} images \xB7 \xA5{cost}",
   "vision.dailyTitle": "{window} \xB7 images per day",
@@ -653,7 +658,7 @@ var en = {
   "sessions.empty": "No sessions have incurred cost yet.",
   "sessions.detail": "{tokens} tokens \xB7 {calls} \xB7 {ago}",
   "sessions.share": "{percent}% of total",
-  "sessions.more": "{count} sessions have usage; the {shown} most expensive are shown above.",
+  "sessions.more": "{count} sessions; showing the {shown} most expensive.",
   "sessions.fallbackTitle": "Session {id}",
   "models.empty": "No model usage can be classified yet.",
   "models.shareAria": "{name} accounts for {percent}% of total cost",
@@ -680,9 +685,9 @@ var en = {
   "chart.dimensionLabel": "Chart interval",
   "chart.daily": "Daily",
   "chart.hourly": "Hourly",
-  "chart.noWindowData": "No usage in {window}. Try a longer range.",
-  "chart.heatmapTitle": "Last year \xB7 daily usage heatmap",
-  "chart.empty": "No usage yet. Run a conversation in DSH to see daily and hourly totals with cost estimates.",
+  "chart.noWindowData": "No usage in {window}.",
+  "chart.heatmapTitle": "Last 12 months \xB7 daily",
+  "chart.empty": "No usage yet.",
   "chart.hourPoint": "{hour}:00",
   "chart.tooltip": "{head} \xB7 {tokens} tokens \xB7 \xA5{cost} \xB7 {calls}",
   "chart.less": "Less",
@@ -748,37 +753,39 @@ var en = {
   "balance.overYear": "> 365 days",
   "balance.noRunway": "No usage in the last {days} days, so runway cannot be estimated",
   "balance.runwayTitle": "Based on \xA5{cost} average daily spend over the last {days} days (including idle days; today is incomplete)",
-  "balance.empty": "Balance is unavailable. Sign in to your account or add DEEPSEEK_API_KEY under Settings \u2192 Models, then refresh.",
-  "sessionUsage.title": "Current session spend (estimated)",
-  "sessionUsage.cost": "This session",
-  "sessionUsage.tokens": "Session tokens",
-  "sessionUsage.calls": "Session calls",
+  "balance.empty": "Balance is unavailable. Check your sign-in or API key, then refresh.",
+  "sessionUsage.title": "Current session spend",
+  "common.estimated": "Estimated cost",
+  "sessionUsage.cost": "Cost",
+  "sessionUsage.tokens": "Tokens",
+  "sessionUsage.calls": "Calls",
   "sessionUsage.range": "Active {range}",
-  "sessionUsage.empty": "No usage in this session yet. Send a message and this session\u2019s own cost and model breakdown will show up here.",
-  "overview.title": "Spend overview (estimated)",
+  "sessionUsage.single": "{model} \xB7 input {input} / output {output} / cache {cache}",
+  "sessionUsage.empty": "No usage in this session yet.",
+  "overview.title": "Spend overview",
   "overview.today": "Today",
   "overview.month": "This month",
   "overview.total": "All time",
   "overview.vsYesterday": "vs yesterday",
   "overview.vsLastMonth": "vs same period last month",
   "overview.empty": "No spend to summarize yet.",
-  "usage.trendTitle": "Usage trend (tokens)",
+  "usage.trendTitle": "Usage trend",
   "usage.windowInput": "{window} input",
   "usage.modelCalls": "Model calls",
   "heatmap.title": "Usage heatmap",
   "peak.title": "Peak / off-peak distribution",
   "cache.title": "Cache hits and savings",
-  "models.title": "Model cost ranking \xB7 {window}",
-  "sessions.title": "Session cost ranking \xB7 {window}",
+  "models.title": "Model cost ranking",
+  "sessions.title": "Session cost ranking",
   "links.title": "Quick Links",
   "links.usage": "View balance / usage",
   "links.apiKey": "Create API key",
   "links.status": "Service status",
   "settings.title": "Settings",
   "settings.widget": "Show the floating balance widget on other views",
-  "settings.widgetHint": "The widget always hides on Usage; choose its other views below.",
+  "settings.widgetHint": "Hidden on Usage; shown on the views selected below.",
   "settings.widgetTabs": "Show widget on",
-  "settings.widgetTabsHint": "This live list comes from DSH\u2019s tab registry, including tabs added by other plugins.",
+  "settings.widgetTabsHint": "Updates automatically as views are installed.",
   "settings.widgetTabsEmpty": "There are no configurable conversation views right now.",
   "settings.lowBalance": "Balance warning",
   "settings.lowBalanceOn": "This page and the widget turn amber below {amount} {currency}. Enter 0 to disable.",
@@ -786,6 +793,18 @@ var en = {
   "settings.monthlyBudget": "Monthly budget",
   "settings.monthlyBudgetOn": "Track a {amount} CNY budget by Beijing calendar month and forecast month-end spend. Enter 0 to disable.",
   "settings.monthlyBudgetOff": "Enter an amount above 0 to show progress and a month-end forecast.",
+  "settings.sidebarEntry": "Sidebar Usage entry",
+  "settings.sidebarEntryHint": "Add a Usage entry at the top or bottom of the sidebar; it opens the account-wide Usage page.",
+  "settings.sidebarEntryOff": "Off",
+  "settings.sidebarEntryTop": "Top",
+  "settings.sidebarEntryBottom": "Bottom",
+  "settings.tabPosition": "Usage tab position",
+  "settings.tabPositionHint": "Drag Usage to change its tab position.",
+  "settings.tabDragAria": "Drag Usage to change its tab position",
+  "settings.tabMoveEarlier": "Move earlier",
+  "settings.tabMoveLater": "Move later",
+  "panel.caption": "Account-wide \xB7 across all sessions",
+  "panel.openAria": "Open Usage",
   "widget.updatedNow": "Updated just now",
   "widget.stale": "Data from {minutes}m ago; press \u21BB to update",
   "widget.loading": "Loading\u2026",
@@ -1349,6 +1368,27 @@ var quotaViewActiveStore = {
   }
 };
 
+// src/client/layout-prefs.ts
+var QUOTA_PANEL_ID = "quota";
+var isPlacement = (value) => value === "off" || value === "top" || value === "bottom";
+var sidebarEntryStore = createStore("layout.sidebarEntry", isPlacement, "off");
+var isTabIndex = (value) => typeof value === "number" && Number.isInteger(value) && value >= 0 && value <= 50;
+var quotaTabIndexStore = createStore("layout.tabIndex", isTabIndex, 2);
+function clampTabIndex(index, count) {
+  return Math.max(0, Math.min(index, Math.max(count, 0)));
+}
+function viewOrderForIndex(entries, index, selfId = "balance", fallback = 20) {
+  const others = entries.filter((entry) => entry.options.id !== selfId);
+  if (others.length === 0) return fallback;
+  const clamped = clampTabIndex(index, others.length);
+  const orderAt = (position) => others[position]?.options.order ?? 0;
+  if (clamped === 0) return orderAt(0) - 10;
+  if (clamped === others.length) return orderAt(others.length - 1) + 10;
+  const previous = orderAt(clamped - 1);
+  const next = orderAt(clamped);
+  return previous >= next ? previous + 0.5 : (previous + next) / 2;
+}
+
 // src/client/dashboard.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var COMPOSER_FALLBACK_PX = 126;
@@ -1426,7 +1466,7 @@ function Period(props) {
       previous !== void 0 && compare !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Delta, { current: period.cost, previous: previous.cost, label: compare })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-period-cost", children: [
-      "\xA5 ",
+      "\xA5",
       fmt(period.cost)
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-period-sub", children: t("period.volume", {
@@ -1451,9 +1491,9 @@ function BudgetMeter(props) {
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-budget-head", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-budget-title", children: t("budget.title") }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-budget-amount", children: [
-        "\xA5 ",
+        "\xA5",
         fmt(snapshot.spent),
-        " / \xA5 ",
+        " / \xA5",
         fmt(snapshot.budget)
       ] })
     ] }),
@@ -1514,7 +1554,6 @@ function PricingNote(props) {
         t("pricing.unit", { currency: pricing.currency }),
         t("pricing.splitNote", { windows: pricing.peakWindows.join(t("common.listSeparator")) }),
         t("pricing.visionNote"),
-        t("pricing.modelNote"),
         t("pricing.unknown")
       ] })
     ] })
@@ -1565,6 +1604,12 @@ function CoverageDiagnostics(props) {
     ] })
   ] });
 }
+function CardTitle(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("h2", { className: `dq-card-title${props.srOnly === true ? " dq-sr-only" : ""}`, children: [
+    props.children,
+    props.caption !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-card-caption", children: props.caption })
+  ] });
+}
 function Stat(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: props.label }),
@@ -1673,14 +1718,22 @@ function SessionUsageCard(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-balance-grid", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("sessionUsage.cost"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat-value", children: [
-        "\xA5 ",
+        "\xA5",
         fmt(data.cost)
       ] }) }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("sessionUsage.tokens"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-value", children: fmtCompact(data.total, locale) }) }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("sessionUsage.calls"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-value", children: fmtInt(data.calls) }) })
     ] }),
-    range !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-session-sub", children: t("sessionUsage.range", { range }) }),
-    data.models.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-rank", children: data.models.map((m, index) => {
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-session-meta", children: [
+      range !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-session-sub", children: t("sessionUsage.range", { range }) }),
+      data.models.length === 1 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-session-sub", children: t("sessionUsage.single", {
+        model: data.models[0].model !== "" ? data.models[0].model : t("common.unknownModel"),
+        input: fmtCompact(data.models[0].input, locale),
+        output: fmtCompact(data.models[0].output, locale),
+        cache: fmtCompact(data.models[0].cache, locale)
+      }) })
+    ] }),
+    data.models.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-rank", children: data.models.map((m, index) => {
       const key = m.provider !== "" ? `${m.provider}/${m.model}` : m.model !== "" ? m.model : `model-${index}`;
       const name2 = m.model !== "" ? m.model : t("common.unknownModel");
       const color = MODEL_COLORS[index % MODEL_COLORS.length];
@@ -1692,7 +1745,7 @@ function SessionUsageCard(props) {
             name2
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-rank-cost", children: [
-            "\xA5 ",
+            "\xA5",
             fmt(m.cost),
             /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-rank-share", children: [
               (share * 100).toFixed(1),
@@ -1740,14 +1793,14 @@ function CacheCard(props) {
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("cache.saved") }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat-value", children: [
-          "\xA5 ",
+          "\xA5",
           fmt(totals.cacheSavings)
         ] })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("cache.allMiss") }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat-value dq-muted-value", children: [
-          "\xA5 ",
+          "\xA5",
           fmt(wouldHaveCost)
         ] })
       ] })
@@ -1762,8 +1815,7 @@ function CacheCard(props) {
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-legend-swatch dq-legend-swatch--miss" }),
         t("cache.missLegend", { tokens: fmtCompact(totals.input, locale) })
       ] })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-cache-foot", children: low ? t("cache.lowHint") : t("cache.goodHint") })
+    ] })
   ] });
 }
 function VisionCard(props) {
@@ -1786,7 +1838,7 @@ function VisionCard(props) {
         tokensShare > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-vision-share", children: t("vision.tokensShare", { percent: tokensShare.toFixed(1) }) })
       ] }) }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("vision.cost"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat-value", children: [
-        "\xA5 ",
+        "\xA5",
         fmt(vision.cost),
         costShare > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-vision-share", children: t("vision.costShare", { percent: costShare.toFixed(1) }) })
       ] }) })
@@ -1841,15 +1893,11 @@ function PeakCard(props) {
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-peak-figures", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("peak.shift") }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat-value", children: [
-        "\xA5 ",
+        "\xA5",
         fmt(split.offPeakEraCost),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-peak-delta dq-peak-delta--save", children: t("peak.saving", { amount: fmt(shiftSaving) }) })
       ] })
-    ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("p", { className: "dq-peak-foot", children: [
-      t("peak.schedule", { windows: pricing.peakWindows.join(t("common.listSeparator")) }),
-      t("peak.activeHint")
-    ] })
+    ] }) })
   ] });
 }
 function agoText(ms, t) {
@@ -1898,13 +1946,13 @@ function SessionRanking(props) {
         },
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("summary", { className: "dq-session-summary", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-session-chevron", "aria-hidden": "true", children: "\u25B8" }),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-session-chevron", "aria-hidden": "true" }),
             /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-session-summary-body", children: [
               /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-session-head", children: [
                 /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-session-title", title: `${s.title}
 ${s.id}`, children: s.title || t("sessions.fallbackTitle", { id: s.id }) }),
                 /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-session-cost", children: [
-                  "\xA5 ",
+                  "\xA5",
                   fmt(s.cost)
                 ] })
               ] }),
@@ -1943,7 +1991,7 @@ function ModelRanking(props) {
           modelNameOf(m, t)
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-rank-cost", children: [
-          "\xA5 ",
+          "\xA5",
           fmt(m.cost),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "dq-rank-share", children: [
             (share * 100).toFixed(1),
@@ -2100,6 +2148,11 @@ function BalanceDashboard(props) {
   const [selectedModels, setSelectedModels] = (0, import_react4.useState)([]);
   const [windowDays, setWindowDays] = (0, import_react4.useState)(usageWindowStore.get());
   const [chartMetric, setChartMetric] = (0, import_react4.useState)(chartMetricStore.get());
+  const [sidebarEntry, setSidebarEntry] = (0, import_react4.useState)(sidebarEntryStore.get());
+  (0, import_react4.useEffect)(() => sidebarEntryStore.subscribe(() => setSidebarEntry(sidebarEntryStore.get())), []);
+  const [tabDragging, setTabDragging] = (0, import_react4.useState)(false);
+  const [tabDropTarget, setTabDropTarget] = (0, import_react4.useState)(null);
+  const [retainedVision, setRetainedVision] = (0, import_react4.useState)(null);
   const [runwayHovering, setRunwayHovering] = (0, import_react4.useState)(false);
   const [runwayManuallyOpened, setRunwayManuallyOpened] = (0, import_react4.useState)(false);
   const [remainingHovering, setRemainingHovering] = (0, import_react4.useState)(false);
@@ -2272,6 +2325,71 @@ function BalanceDashboard(props) {
     setChartMetric(value);
     chartMetricStore.set(value);
   };
+  const changeSidebarEntry = (value) => {
+    setSidebarEntry(value);
+    sidebarEntryStore.set(value);
+  };
+  const balanceTabIndex = viewTabs.findIndex((tab) => tab.id === "balance");
+  const finalTabIndex = (target, after) => {
+    const gap = after ? target + 1 : target;
+    const dropped = balanceTabIndex >= 0 && gap > balanceTabIndex ? gap - 1 : gap;
+    return Math.max(0, Math.min(dropped, Math.max(viewTabs.length - 1, 0)));
+  };
+  const endTabDrag = () => {
+    setTabDragging(false);
+    setTabDropTarget(null);
+  };
+  const previewTabDropTarget = (index) => {
+    setTabDropTarget((prev) => prev === index ? prev : index);
+  };
+  const applyQuotaTabIndex = (index) => {
+    const next = Math.max(0, Math.min(index, Math.max(viewTabs.length - 1, 0)));
+    if (next === balanceTabIndex) return;
+    quotaTabIndexStore.set(next);
+    window.setTimeout(() => {
+      const chip = document.querySelector(".dq-tab-chip--current");
+      chip?.focus();
+    }, 80);
+  };
+  const dropQuotaTab = (target, after) => {
+    applyQuotaTabIndex(finalTabIndex(target, after));
+    endTabDrag();
+  };
+  const onQuotaTabDragStart = (event) => {
+    setTabDragging(true);
+    event.dataTransfer.effectAllowed = "move";
+    event.dataTransfer.setData("text/plain", "balance");
+  };
+  const onChipDragOver = (event, index) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    event.stopPropagation();
+    previewTabDropTarget(index);
+  };
+  const onChipDrop = (event, index) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    event.stopPropagation();
+    const rect = event.currentTarget.getBoundingClientRect();
+    dropQuotaTab(index, event.clientX > rect.left + rect.width / 2);
+  };
+  const onOrderDragOver = (event) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    if (event.target === event.currentTarget) previewTabDropTarget(viewTabs.length - 1);
+  };
+  const onOrderDrop = (event) => {
+    if (!tabDragging) return;
+    event.preventDefault();
+    if (event.target !== event.currentTarget) return;
+    applyQuotaTabIndex(viewTabs.length - 1);
+    endTabDrag();
+  };
+  const onQuotaTabKeyDown = (event) => {
+    if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+    event.preventDefault();
+    applyQuotaTabIndex(balanceTabIndex + (event.key === "ArrowLeft" ? -1 : 1));
+  };
   const primary = balance !== null && balance.balances.length > 0 ? balance.balances[0] : null;
   const recentDays = (usage?.daily ?? []).slice(-7);
   const avgDailyCost = recentDays.length > 0 ? recentDays.reduce((sum, d) => sum + d.cost, 0) / recentDays.length : 0;
@@ -2282,6 +2400,26 @@ function BalanceDashboard(props) {
   const runwayTitle = daysLeft === null ? t("balance.noRunway", { days: recentDays.length || 7 }) : t("balance.runwayTitle", { days: recentDays.length, cost: fmt(avgDailyCost) });
   const activeWindow = usage?.windows.find((window2) => window2.days === windowDays) ?? null;
   const activeWindowName = windowName(windowDays, t);
+  const visionStats = activeWindow?.vision;
+  const visionOpen = usage !== null && activeWindow !== null && visionStats !== void 0 && visionStats.images > 0 && Array.isArray(activeWindow.visionDaily) && Array.isArray(activeWindow.visionSessions);
+  const visionPayload = (window2, stats, label) => ({
+    vision: stats,
+    daily: window2.visionDaily,
+    sessions: window2.visionSessions,
+    windowLabel: label,
+    inputTokens: window2.totals.input,
+    costTotal: window2.totals.cost
+  });
+  const liveVision = visionOpen && activeWindow !== null && visionStats !== void 0 ? visionPayload(activeWindow, visionStats, activeWindowName) : null;
+  (0, import_react4.useEffect)(() => {
+    if (visionOpen && activeWindow !== null && visionStats !== void 0) {
+      setRetainedVision(visionPayload(activeWindow, visionStats, activeWindowName));
+      return;
+    }
+    const timer = window.setTimeout(() => setRetainedVision(null), 320);
+    return () => window.clearTimeout(timer);
+  }, [visionOpen, activeWindow, activeWindowName]);
+  const shownVision = visionOpen ? liveVision : retainedVision;
   const dailyBars = (activeWindow?.daily ?? []).map((d) => ({
     label: windowDays === 365 ? d.date.slice(5).replace("-", "/") : d.date.slice(8, 10),
     value: chartMetricValue(chartMetric, d),
@@ -2410,8 +2548,8 @@ function BalanceDashboard(props) {
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("a", { className: "dq-alert-link", href: "https://platform.deepseek.com/top_up", target: "_blank", rel: "noreferrer", children: t("alert.topUp") })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--primary", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("balance.title") }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--hero", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { srOnly: true, children: t("balance.title") }),
       primary !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-balance-grid", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("balance.remaining") }),
@@ -2427,14 +2565,14 @@ function BalanceDashboard(props) {
                   "summary",
                   {
                     title: t("balance.breakdownTitle"),
+                    "aria-label": `${fmt(primary.total)} ${primary.currency}`,
                     onClick: (e) => {
                       e.preventDefault();
                       setRemainingManuallyOpened((v) => !v);
                     },
                     children: [
                       fmt(primary.total),
-                      " ",
-                      primary.currency
+                      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-hero-unit", children: primary.currency })
                     ]
                   }
                 ),
@@ -2472,15 +2610,15 @@ function BalanceDashboard(props) {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("common.status"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `dq-stat-value${balance?.isAvailable === false ? " dq-stat-value--bad" : " dq-stat-value--ok"}`, children: balance?.isAvailable === false ? t("common.unavailable") : t("common.available") }) })
+        balance?.isAvailable === false && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Stat, { label: t("common.status"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-value dq-stat-value--bad", children: t("common.unavailable") }) })
       ] }) : loadingBalance ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(BalanceSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("balance.empty") })
     ] }),
     props.sessionId !== void 0 && props.sessionId !== "" && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--primary", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("sessionUsage.title") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: t("common.estimated"), children: t("sessionUsage.title") }),
       sessionUsage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SessionUsageCard, { data: sessionUsage }) : loadingSessionUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SessionUsageSkeleton, {}) : sessionUsageError !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty dq-empty--error", children: localizeApiError(sessionUsageError, t, "error.query") }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("sessionUsage.empty") })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--primary", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("overview.title") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: t("common.estimated"), children: t("overview.title") }),
       usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-period-grid", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Period, { label: t("overview.today"), period: usage.summary.today, previous: usage.summary.yesterday, compare: t("overview.vsYesterday") }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Period, { label: t("overview.month"), period: usage.summary.month, previous: usage.summary.lastMonthToDate, compare: t("overview.vsLastMonth") }),
@@ -2506,34 +2644,9 @@ function BalanceDashboard(props) {
       ),
       usage !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PricingNote, { pricing: usage.pricing })
     ] }),
-    usage !== null && activeWindow !== null && activeWindow.vision !== void 0 && Array.isArray(activeWindow.visionDaily) && Array.isArray(activeWindow.visionSessions) ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("vision.title") }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        VisionCard,
-        {
-          vision: activeWindow.vision,
-          daily: activeWindow.visionDaily,
-          sessions: activeWindow.visionSessions,
-          windowLabel: activeWindowName,
-          inputTokens: activeWindow.totals.input,
-          costTotal: activeWindow.totals.cost
-        }
-      )
-    ] }) : usage === null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("vision.title") }),
-      loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-usage-totals", children: [64, 88, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
-      ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("vision.empty", { window: activeWindowName }) })
-    ] }) : (
-      // Host serving a pre-vision payload (e.g. not restarted yet): hide the
-      // whole card instead of leaving a titled shell — it reappears as soon
-      // as the host half serves the new shape.
-      null
-    ),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card dq-card--primary", children: [
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card-head", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("usage.trendTitle") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("usage.trendTitle") }),
         usage !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card-actions", children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UsageWindowPicker, { value: windowDays, onChange: changeWindowDays }),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ExportMenu, { usage })
@@ -2585,7 +2698,7 @@ function BalanceDashboard(props) {
             GroupedBars,
             {
               series: grouped,
-              height: barMode === "daily" ? 120 : 100,
+              height: barMode === "daily" ? 160 : 140,
               labelEvery: barMode === "daily" ? dailyLabelEvery : 3,
               minWidth: barMode === "daily" ? dailyMinWidth : void 0
             }
@@ -2594,36 +2707,33 @@ function BalanceDashboard(props) {
             /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-legend-swatch", style: { background: s.color } }),
             s.name
           ] }, s.key)) })
-        ] }) : barMode === "daily" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: dailyBars, height: 120, labelEvery: dailyLabelEvery, minWidth: dailyMinWidth }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: hourlyBars, height: 100, labelEvery: 3 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CoverageDiagnostics, { coverage: usage.coverage })
-      ] }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UsageSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("heatmap.title") }),
-      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-chart-title", children: t("chart.heatmapTitle") }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Heatmap, { data: usage.heatmap })
-      ] }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(HeatmapSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("peak.title") }),
-      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PeakCard, { split: usage.peakSplit, pricing: usage.pricing }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-peak-track" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-peak-figures", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 120, h: 11 }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 96, h: 20 })
-        ] })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("peak.empty") })
+        ] }) : barMode === "daily" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: dailyBars, height: 160, labelEvery: dailyLabelEvery, minWidth: dailyMinWidth }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Bars, { data: hourlyBars, height: 140, labelEvery: 3 })
+      ] }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(UsageSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-vision-inline", "data-open": visionOpen ? "true" : "false", "aria-hidden": !visionOpen, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-vision-inline-body", children: shownVision !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-chart-title", children: [
+          t("vision.title"),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-chart-peak", children: shownVision.windowLabel })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          VisionCard,
+          {
+            vision: shownVision.vision,
+            daily: shownVision.daily,
+            sessions: shownVision.sessions,
+            windowLabel: shownVision.windowLabel,
+            inputTokens: shownVision.inputTokens,
+            costTotal: shownVision.costTotal
+          }
+        )
+      ] }) }) }),
+      usage !== null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CoverageDiagnostics, { coverage: usage.coverage })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("cache.title") }),
-      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CacheCard, { totals: usage.totals }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-cache-figures", children: [60, 96, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
-      ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("cache.empty") })
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: t("chart.heatmapTitle"), children: t("heatmap.title") }),
+      usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Heatmap, { data: usage.heatmap }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(HeatmapSkeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("chart.empty") })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("models.title", { window: activeWindowName }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: activeWindowName, children: t("models.title") }),
       activeWindow !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModelRanking, { models: modelList, totalCost: modelCostTotal, colorOf }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-rank", children: [0, 1].map((i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-rank-row", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 148, h: 13 }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-rank-track" }),
@@ -2631,15 +2741,34 @@ function BalanceDashboard(props) {
       ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("models.empty") })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("sessions.title", { window: activeWindowName }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { caption: activeWindowName, children: t("sessions.title") }),
       activeWindow !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SessionRanking, { sessions: activeWindow.sessions, count: activeWindow.sessionCount, totalCost: activeWindow.totals.cost }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-sessions", children: [0, 1, 2].map((i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-session", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 200, h: 13 }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-session-track" }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 250, h: 11 })
       ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("sessions.empty") })
     ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card-pair", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("peak.title") }),
+        usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PeakCard, { split: usage.peakSplit, pricing: usage.pricing }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-peak-track" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-peak-figures", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 120, h: 11 }),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 96, h: 20 })
+          ] })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("peak.empty") })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("cache.title") }),
+        usage !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CacheCard, { totals: usage.totals }) : loadingUsage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-cache-figures", children: [60, 96, 72].map((w, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w, h: 11 }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skel, { w: 72, h: 20 })
+        ] }, i)) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-empty", children: t("cache.empty") })
+      ] })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-card", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-card-title", children: t("settings.title") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CardTitle, { children: t("settings.title") }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-links-title", children: t("links.title") }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-links", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Link, { href: "https://platform.deepseek.com/usage", children: t("links.usage") }),
@@ -2705,9 +2834,67 @@ function BalanceDashboard(props) {
           ),
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { id: "dq-monthly-budget-hint", className: "dq-setting-hint", children: monthlyBudget > 0 ? t("settings.monthlyBudgetOn", { amount: fmt(monthlyBudget) }) : t("settings.monthlyBudgetOff") })
         ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { className: "dq-setting-label", htmlFor: "dq-sidebar-entry", children: t("settings.sidebarEntry") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+            "select",
+            {
+              id: "dq-sidebar-entry",
+              className: "dq-select",
+              value: sidebarEntry,
+              onChange: (e) => changeSidebarEntry(e.target.value),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "off", children: t("settings.sidebarEntryOff") }),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "top", children: t("settings.sidebarEntryTop") }),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("option", { value: "bottom", children: t("settings.sidebarEntryBottom") })
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-setting-hint", children: t("settings.sidebarEntryHint") })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-setting-label", id: "dq-tab-order-label", children: t("settings.tabPosition") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "div",
+            {
+              className: "dq-tab-order",
+              role: "group",
+              "aria-labelledby": "dq-tab-order-label",
+              "aria-describedby": "dq-tab-order-hint",
+              onDragOver: onOrderDragOver,
+              onDrop: onOrderDrop,
+              children: viewTabs.map((tab, index) => {
+                const current = tab.id === "balance";
+                const dropTarget = tabDragging && !current && tabDropTarget === index;
+                return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  "span",
+                  {
+                    className: `dq-tab-chip${current ? " dq-tab-chip--current" : ""}${current && tabDragging ? " dq-tab-chip--dragging" : ""}${dropTarget ? " dq-tab-chip--drop-target" : ""}`,
+                    draggable: current,
+                    tabIndex: current ? 0 : void 0,
+                    role: current ? "button" : void 0,
+                    "aria-label": current ? t("settings.tabDragAria") : void 0,
+                    onDragStart: current ? onQuotaTabDragStart : void 0,
+                    onDragEnd: current ? endTabDrag : void 0,
+                    onDragOver: (event) => onChipDragOver(event, index),
+                    onDrop: (event) => onChipDrop(event, index),
+                    onKeyDown: current ? onQuotaTabKeyDown : void 0,
+                    children: tab.label
+                  },
+                  tab.id
+                );
+              })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { id: "dq-tab-order-hint", className: "dq-setting-hint", children: t("settings.tabPositionHint") })
+        ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.6.1" })
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "dq-footer", children: "@cassius0924/dsh-usage-dashboard v0.8.0" })
   ] });
 }
 
@@ -2734,7 +2921,7 @@ function MessageCost({ sessionId, messageId }) {
   }, [messageId, sessionId]);
   const turn = data?.turns.find((candidate) => candidate.messageId === messageId);
   if (turn === void 0) return null;
-  const amount = `\xA5 ${fmtTurnCost(turn.cost)}`;
+  const amount = `\xA5${fmtTurnCost(turn.cost)}`;
   const tooltip = t("messageCost.tooltip");
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
     "span",
@@ -2753,7 +2940,7 @@ function MessageCost({ sessionId, messageId }) {
 
 // src/client/styles.ts
 var css = `
-.dsh-quota-root{position:absolute;right:16px;bottom:16px;z-index:2147483000;pointer-events:auto;opacity:1;visibility:visible;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:13px;line-height:1.45;color:var(--dsw-alias-label-primary,#1f2328);transition:left .28s cubic-bezier(.22,1,.36,1),top .28s cubic-bezier(.22,1,.36,1),opacity .16s ease-out,visibility 0s linear}
+.dsh-quota-root{-webkit-text-size-adjust:100%;text-size-adjust:100%;position:absolute;right:16px;bottom:16px;z-index:2147483000;pointer-events:auto;opacity:1;visibility:visible;font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif);font-size:13px;line-height:1.45;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-primary,#1f2328);--dq-text-success:#1a7f37;--dq-text-success:color-mix(in oklab,var(--dsw-alias-state-success-primary,#2da44e) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);--dq-text-warn:#9a6700;--dq-text-warn:color-mix(in oklab,var(--dsw-alias-state-warn-primary,#bf8700) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);transition:left .28s cubic-bezier(.22,1,.36,1),top .28s cubic-bezier(.22,1,.36,1),opacity .16s ease-out,visibility 0s linear}
 .dsh-quota-root.dsh-quota-root--hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease-out,visibility 0s linear .14s}
 .dsh-quota-root.dsh-quota-dragging{transition:none}
 .dsh-quota-card,.dsh-quota-card *{box-sizing:border-box}
@@ -2762,14 +2949,14 @@ var css = `
 .dsh-quota-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;min-width:0}
 .dsh-quota-title{font-weight:600;font-size:13px;color:var(--dsw-alias-label-primary,#1f2328);display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden}
 .dsh-quota-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.dsh-quota-grip{color:var(--dsw-alias-label-secondary,#59636e);opacity:.7;font-size:11px;letter-spacing:0;cursor:grab;flex:none}
+.dsh-quota-grip{color:var(--dsw-alias-label-secondary,#59636e);opacity:.7;font-size:12px;letter-spacing:0;cursor:grab;flex:none}
 .dsh-quota-dot{width:8px;height:8px;border-radius:50%;background:var(--dsw-alias-state-success-primary,#2da44e);flex:none}
 .dsh-quota-dot--error{background:var(--dsw-alias-state-error-primary,#cf222e)}
 .dsh-quota-dot--warn{background:var(--dsw-alias-state-warning-primary,#bf8700)}
-.dsh-quota-total--low{color:var(--dsw-alias-state-warning-primary,#9a6700)!important}
+.dsh-quota-total--low{color:var(--dq-text-warn)!important}
 .dsh-quota-dot--idle{background:var(--dsw-alias-label-secondary,#59636e);opacity:.6}
 .dsh-quota-collapsed-total-row{margin-top:6px}
-.dsh-quota-collapsed-total{font-weight:700;font-size:15px;color:var(--dsw-alias-state-business-primary,#0969da);font-variant-numeric:tabular-nums}
+.dsh-quota-collapsed-total{font-weight:700;font-size:13px;color:var(--dsw-alias-state-business-primary,#0969da);font-variant-numeric:tabular-nums}
 .dsh-quota-actions{display:flex;gap:2px;flex:none}
 .dsh-quota-btn{border:none;background:transparent;cursor:pointer;color:var(--dsw-alias-label-secondary,#59636e);padding:3px 7px;border-radius:6px;font-size:13px;line-height:1}
 .dsh-quota-btn:hover:not(:disabled){background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.06));color:var(--dsw-alias-label-primary,#1f2328)}
@@ -2777,19 +2964,19 @@ var css = `
 .dsh-quota-btn:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
 .dsh-quota-btn:disabled{opacity:.5;cursor:default}
 .dsh-quota-body{color:var(--dsw-alias-label-secondary,#59636e)}
-.dsh-quota-remaining-label{font-size:11px;color:var(--dsw-alias-label-tertiary,#59636e);margin-bottom:2px}
-.dsh-quota-total{font-size:24px;font-weight:700;color:var(--dsw-alias-label-primary,#1f2328);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
-.dsh-quota-currency{font-size:14px;font-weight:600;margin-left:3px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dsh-quota-remaining-label{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);margin-bottom:2px}
+.dsh-quota-total{font-size:18px;font-weight:700;color:var(--dsw-alias-label-primary,#1f2328);letter-spacing:-.02em;line-height:1.2;font-variant-numeric:tabular-nums}
+.dsh-quota-currency{font-size:13px;font-weight:500;margin-left:4px;color:var(--dsw-alias-label-secondary,#59636e)}
 .dsh-quota-row{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:12px}
 .dsh-quota-label{color:var(--dsw-alias-label-secondary,#59636e)}
 .dsh-quota-value{color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
 .dsh-quota-error{color:var(--dsw-alias-state-error-primary,#cf222e)}
-.dq-message-cost{position:relative;display:inline-flex;align-items:center;order:10;gap:10px;height:28px;color:var(--dsw-alias-label-tertiary,#59636e);font-size:12px;line-height:20px;font-variant-numeric:tabular-nums;white-space:nowrap;cursor:help}
+.dq-message-cost{-webkit-text-size-adjust:100%;text-size-adjust:100%;position:relative;display:inline-flex;align-items:center;order:10;gap:10px;height:28px;color:var(--dsw-alias-label-tertiary,#59636e);font-size:12px;line-height:20px;font-variant-numeric:tabular-nums;white-space:nowrap;cursor:help}
 .dq-message-cost-separator{cursor:default}
 .dq-message-cost-amount{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:currentColor;text-underline-offset:4px}
 .dq-message-cost:hover{color:var(--dsw-alias-label-secondary,#3f4852)}
 .dq-message-cost:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px;border-radius:4px}
-.dq-message-cost::after{content:attr(data-dq-tooltip);position:absolute;left:0;top:calc(100% + 6px);z-index:2147483001;width:max-content;max-width:min(240px,calc(100vw - 24px));padding:6px 9px;border-radius:8px;background:var(--dsw-alias-bg-inverse,#1f2328);color:var(--dsw-alias-label-inverse,#fff);box-shadow:0 6px 18px rgba(0,0,0,.22);font-size:12px;font-weight:400;line-height:1.45;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear .12s}
+.dq-message-cost::after{content:attr(data-dq-tooltip);position:absolute;left:0;top:calc(100% + 6px);z-index:2147483001;width:max-content;max-width:min(240px,calc(100vw - 24px));padding:6px 9px;border-radius:8px;background:var(--dsw-alias-tooltip-bg,#1f2328);color:var(--dsw-static-neutral-bluish-00,#fff);box-shadow:0 6px 18px rgba(0,0,0,.22);font-size:12px;font-weight:400;line-height:1.5;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear .12s}
 .dq-message-cost:hover::after,.dq-message-cost:focus-visible::after{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear}
 @media (hover:hover){
   [data-time-hover-root] .dq-message-cost{opacity:0;transition:opacity 80ms ease}
@@ -2803,13 +2990,16 @@ var css = `
    deliberately), but on narrower viewports the fixed 860px would overhang
    the input box \u2014 measured in dashboard.tsx as --dq-composer-w, capped at
    the reading-column width so wide viewports are unchanged. */
-.dq-balance{display:flex;flex-direction:column;gap:24px;padding:20px 24px 48px;max-width:min(860px,var(--dq-composer-w,860px));margin:0 auto;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:13px;line-height:1.5;color:var(--dsw-alias-label-primary,#1f2328)}
-@media (max-width:620px){.dq-balance{box-sizing:border-box;max-width:calc(100vw - 56px);padding:16px 16px calc(var(--dq-composer-h,126px) + 16px)}}
-.dq-card{background:var(--dsw-alias-bg-layer-1,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));border-radius:12px;padding:16px;min-width:0;max-width:100%}
-.dq-card-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-secondary,#59636e);margin:0 0 12px;letter-spacing:.02em}
-.dq-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
+.dq-balance{-webkit-text-size-adjust:100%;text-size-adjust:100%;box-sizing:border-box;width:100%;min-width:0;display:flex;flex-direction:column;gap:32px;padding:20px 24px 48px;max-width:min(860px,var(--dq-composer-w,860px));margin:0 auto;font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif);font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-primary,#1f2328);--dq-text-success:#1a7f37;--dq-text-success:color-mix(in oklab,var(--dsw-alias-state-success-primary,#2da44e) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);--dq-text-warn:#9a6700;--dq-text-warn:color-mix(in oklab,var(--dsw-alias-state-warn-primary,#bf8700) 52%,var(--dsw-alias-label-primary,#1f2328) 48%);}
+@media (max-width:620px){.dq-balance{max-width:100%;gap:24px;padding:16px 12px calc(var(--dq-composer-h,126px) + 16px)}.dq-card{padding:16px}.dq-card--hero{padding:0 16px}.dq-status-row{padding:0 16px}}
+/* \u8F6E\u6B21 55\uFF1A\u53EA\u6709\u4E3B\u5361\u7247\u5E26\u6846\u3002\u6B21\u7EA7\u5206\u6790\u4E0E\u8BBE\u7F6E\u662F\u65E0\u6846\u5C0F\u8282\uFF0C\u9760 32px \u6BB5\u8DDD\u548C 13px \u4E3B\u8272\u6807\u9898\u5206\u7EC4\uFF1B
+   \u5DE6\u53F3 20px \u5185\u8FB9\u8DDD\u8BA9\u5B83\u4EEC\u7684\u6587\u5B57\u8FB9\u4E0E\u4E3B\u5361\u7247\u5185\u6587\u5BF9\u9F50\uFF0C\u6574\u9875\u53EA\u6709\u4E00\u6761\u6587\u5B57\u5DE6\u8FB9\u7EBF\u3002 */
+.dq-card{box-sizing:border-box;min-width:0;max-width:100%;padding:20px;background:var(--dsw-alias-bg-layer-1,#ffffff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.10));border-radius:12px}
+.dq-card-title{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;font-size:15px;font-weight:600;line-height:1.4;color:var(--dsw-alias-label-primary,#1f2328);margin:0 0 16px;letter-spacing:0;text-wrap:balance}
+.dq-card-caption{font-size:12px;font-weight:400;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
 .dq-card-head .dq-card-title{margin:0}
-.dq-card-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
+.dq-card-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
 /* \u4E3B\u5361\u7247\uFF08\u4F59\u989D/\u5F53\u524D\u4F1A\u8BDD\u6D88\u8017/\u6D88\u8017\u6982\u89C8/\u7528\u91CF\u8D8B\u52BF\uFF0C\u8F6E\u6B21 45 \u65B0\u589E\u300C\u5F53\u524D\u4F1A\u8BDD\u6D88\u8017\u300D\uFF09\u89C6\u89C9\u6743\u91CD\u9AD8\u4E8E\u6B21\u7EA7\u5206\u6790
    \u5361\u7247\u4E0E\u5BFC\u822A\u7C7B\u5361\u7247\uFF1A\u53EA\u8C03\u6392\u7248\u5C5E\u6027\u2014\u2014\u5185\u8FB9\u8DDD\u3001\u6807\u9898\u5B57\u53F7\u5B57\u91CD\u4E0E\u53D6\u8272\u3001\u8FB9\u6846\u6DF1\u6D45\u2014\u2014\u4E0D\u5F15\u5165\u65B0\u914D\u8272\u4F53\u7CFB\u3002\u4E24\u6761\u89C4\u5219
    \u4E0E\u4E0A\u9762\u7684\u57FA\u7840\u89C4\u5219\u540C\u4E3A\u5355\u7C7B\u9009\u62E9\u5668\u4E14\u6E90\u7801\u987A\u5E8F\u66F4\u9760\u540E\uFF0C\u5929\u7136\u8986\u76D6\uFF0C\u4E0D\u9700\u8981 !important\u3002\u6B21\u7EA7\u5206\u6790\u5361\u7247\uFF08\u7528\u91CF
@@ -2818,8 +3008,18 @@ var css = `
    \u6253\u5F00\u8FD9\u4E2A\u300C\u989D\u5EA6\u300Dtab \u65F6\u4E0A\u4E0B\u6587\u6700\u76F4\u63A5\u76F8\u5173\u7684\u6570\u5B57\uFF08\u8FD9\u4E2A tab \u6302\u5728\u5177\u4F53\u4F1A\u8BDD\u5185\u90E8\uFF0C\u89C1 DESIGN_NOTES\u300C\u4FE1\u606F\u5C42\u7EA7\u300D\uFF09\uFF0C
    \u4E0D\u5C5E\u4E8E\u539F\u6709\u8D26\u6237\u5168\u5C40\u5C42\u7EA7 1-3 \u7684\u4EFB\u4F55\u4E00\u7EA7\uFF0C\u800C\u662F\u4E0E\u4E4B\u6B63\u4EA4\u7684\u53E6\u4E00\u4E2A\u7EF4\u5EA6\uFF0C\u4F46\u540C\u6837\u662F\u9996\u5C4F\u5FC5\u8BFB\uFF0C\u56E0\u6B64\u540C\u6837\u7ED9
    primary \u6743\u91CD\uFF0C\u4E0D\u65B0\u5F00\u7B2C\u4E09\u6863\u3002 */
-.dq-card--primary{padding:20px;border-color:var(--dsw-alias-border-l2,rgba(0,0,0,.12))}
-.dq-card--primary .dq-card-title{font-size:13px;font-weight:700;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-card--primary{padding:20px;border-color:var(--dsw-alias-border-l3,rgba(0,0,0,.12))}
+/* \u4F59\u989D\u662F\u6574\u9875\u552F\u4E00\u7684 hero\uFF1A\u4E0D\u5957\u6846\uFF0C32px \u6570\u5B57\u72EC\u5360\u4E00\u6863\uFF0C\u8BA9\u5B83\u5728\u906E\u4F4F\u6587\u5B57\u65F6\u4ECD\u662F\u7B2C\u4E00\u773C\u3002 */
+.dq-card--hero{padding:0 20px;background:transparent;border:0;border-radius:0}
+.dq-card-pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:24px;min-width:0}
+.dq-card--hero .dq-stat-label{font-size:13px;margin-bottom:2px}
+.dq-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
+.dq-card--hero .dq-balance-grid{align-items:stretch;gap:12px 48px}
+.dq-card--hero .dq-stat{display:flex;flex-direction:column;justify-content:space-between}
+/* hero \u6570\u5B57\u4E0D\u753B\u70B9\u72B6\u4E0B\u5212\u7EBF\uFF0840px \u4E0B\u592A\u91CD\uFF09\uFF1B\u53EF\u70B9\u6027\u9760\u60AC\u505C\u5E95\u8272\u548C title \u63D0\u793A\u3002 */
+.dq-card--hero details>summary{text-decoration:none;margin:-2px -6px;padding:2px 6px;border-radius:8px;transition:background .15s ease}
+.dq-card--hero details>summary:hover,.dq-card--hero details[open]>summary{background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.05))}
+@media (max-width:620px){.dq-card{padding:16px}.dq-card--hero{padding:0 16px}}
 .dq-window-switch{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:8px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.08))}
 .dq-window-btn{border:0;border-radius:6px;padding:4px 8px;background:transparent;color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;white-space:nowrap;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}
 .dq-window-btn:hover{color:var(--dsw-alias-label-primary,#1f2328)}
@@ -2834,7 +3034,7 @@ var css = `
 .dq-export-menu button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;border:0;border-radius:6px;padding:7px 8px;background:transparent;color:var(--dsw-alias-label-primary,#1f2328);font-size:12px;text-align:left;cursor:pointer}
 .dq-export-menu button:hover,.dq-export-menu button:focus-visible{background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.06))}
 .dq-export-menu button:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:-1px}
-.dq-export-menu small{font-size:10.5px;font-weight:400;color:var(--dsw-alias-label-tertiary,#59636e);white-space:nowrap}
+.dq-export-menu small{font-size:12px;font-weight:400;color:var(--dsw-alias-label-secondary,#59636e);white-space:nowrap}
 /* Small-text tier system (\u8F6E\u6B21 41 \u6536\u655B): two whole-pixel tiers replace what used to be four values
    (11/11.5/12/12.5px) spaced only 0.5px apart \u2014 a gap browsers subpixel-round away, so it read as one
    size with extra maintenance cost, not an actual visual hierarchy. 11px = "micro" chrome the user
@@ -2850,9 +3050,9 @@ var css = `
    it belongs in an already-established different tier (10px icon glyphs, 13px+ hero-adjacent text). */
 .dq-balance-grid{display:flex;flex-wrap:wrap;gap:12px 24px}
 .dq-stat{min-width:110px}
-.dq-stat-label{font-size:11px;color:var(--dsw-alias-label-tertiary,#59636e);margin-bottom:2px}
-.dq-stat-value{font-size:18px;font-weight:650;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
-.dq-stat-value--ok{color:var(--dsw-alias-state-success-primary,#2da44e)}
+.dq-stat-label{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);margin-bottom:4px}
+.dq-stat-value{font-size:18px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
+.dq-stat-value--ok{color:var(--dq-text-success)}
 .dq-stat-value--bad{color:var(--dsw-alias-state-error-primary,#cf222e)}
 /* \u8F6E\u6B21 43: .dq-runway is a controlled <details> (see dashboard.tsx) \u2014 hover/toggle state
    drives the real open attribute now, so .dq-runway-detail only needs to react to [open];
@@ -2862,120 +3062,124 @@ var css = `
 .dq-runway>summary{display:inline-block;list-style:none;border-radius:4px;cursor:pointer;text-decoration:underline dotted var(--dsw-alias-border-l2,rgba(0,0,0,.25));text-underline-offset:4px}
 .dq-runway>summary::-webkit-details-marker{display:none}
 .dq-runway>summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:3px}
-.dq-runway-detail{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:20;max-width:240px;padding:8px 10px;background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.15);white-space:normal;font-size:12px;font-weight:500;line-height:1.5;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-runway-detail{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:20;max-width:240px;padding:8px 10px;background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.15);white-space:normal;font-size:12px;font-weight:500;line-height:1.6;color:var(--dsw-alias-label-primary,#1f2328)}
 .dq-runway[open] .dq-runway-detail{display:block}
 /* hero number for the balance, matching .dq-period-cost; relies on cascade order (declared after
    .dq-stat-value, same specificity) to win over the .dq-stat-value it's paired with in JSX \u2014 keep it below */
 /* \u8F6E\u6B21 47: .dq-remaining is a controlled <details> too now (see dashboard.tsx), same reason as
    .dq-runway above \u2014 an unopened <details>'s non-summary children don't actually render in current
    Chromium regardless of author display value, so the old :hover{display:flex} branch was dead code. */
-.dq-remaining{position:relative;font-size:22px;font-weight:680;letter-spacing:-.01em;line-height:1.25}
+.dq-remaining{position:relative;font-size:32px;font-weight:700;letter-spacing:-.025em;line-height:1.1}
+.dq-hero-unit{font-size:13px;font-weight:500;letter-spacing:0;margin-left:4px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
 .dq-remaining>summary{display:inline-block;list-style:none;border-radius:4px;cursor:pointer;text-decoration:underline dotted var(--dsw-alias-border-l2,rgba(0,0,0,.25));text-underline-offset:4px}
 .dq-remaining>summary::-webkit-details-marker{display:none}
 .dq-remaining>summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:3px}
-.dq-remaining-breakdown{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:20;flex-direction:column;gap:4px;padding:8px 10px;background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.15);white-space:nowrap;font-size:12px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-remaining-breakdown{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:20;flex-direction:column;gap:4px;padding:8px 10px;background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.15);white-space:nowrap;font-size:12px;font-weight:500;line-height:1.5;color:var(--dsw-alias-label-primary,#1f2328)}
 .dq-remaining[open] .dq-remaining-breakdown{display:flex}
-.dq-remaining-granted{color:var(--dsw-alias-label-tertiary,#59636e);font-weight:400;font-size:11px}
+.dq-remaining-granted{color:var(--dsw-alias-label-secondary,#59636e);font-weight:400;font-size:12px}
 /* narrow screens: .dq-balance-grid wraps its 3 stats onto separate lines, so the absolutely-positioned
    .dq-remaining-breakdown/.dq-runway-detail popovers can float down over whichever stat now sits in the
    next row (e.g. "\u4F59\u989D\u660E\u7EC6" open covering "\u9884\u8BA1\u53EF\u7528"'s clickable summary) \u2014 force each stat onto its own
    full-width row and switch both popovers to normal in-flow layout so an open one pushes its own row
    taller instead of overlaying a sibling; desktop keeps the original hover-overlay behavior unchanged */
 @media (max-width:620px){
-  .dq-balance-grid .dq-stat{flex:1 1 100%}
+  .dq-card--hero .dq-balance-grid{gap:12px 32px}
+  .dq-card--primary .dq-balance-grid,.dq-session-expand .dq-balance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}
+  .dq-card--primary .dq-balance-grid .dq-stat,.dq-session-expand .dq-balance-grid .dq-stat{min-width:0}
   .dq-remaining-breakdown,.dq-runway-detail{position:static;margin-top:6px;box-shadow:none;max-width:none;white-space:normal}
 }
-.dq-period-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
-.dq-period{min-width:0;padding:4px 16px}
-.dq-period:first-child{padding-left:0}
-.dq-period:last-child{padding-right:0}
-.dq-period+.dq-period{border-left:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
-@media (max-width:620px){.dq-period-grid{grid-template-columns:1fr}.dq-period,.dq-period:first-child,.dq-period:last-child{padding:12px 0}.dq-period:first-child{padding-top:2px}.dq-period+.dq-period{border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));border-left:0}}
-.dq-period-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
-.dq-period-label{font-size:11px;color:var(--dsw-alias-label-tertiary,#59636e)}
-.dq-period-cost{font-size:22px;font-weight:680;letter-spacing:-.01em;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;line-height:1.25}
-.dq-period-sub{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);margin-top:2px;font-variant-numeric:tabular-nums;line-height:1.45}
-.dq-budget{margin-top:12px;padding-top:12px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
+.dq-period-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 32px}
+.dq-period{min-width:0}
+/* \u7A84\u5C4F\uFF1A\u4E09\u4E2A\u5468\u671F\u6539\u6210\u5217\u8868\u884C\u2014\u2014\u6807\u7B7E\u4E0E\u6DA8\u8DCC\u5728\u5DE6\u3001\u91D1\u989D\u53F3\u5BF9\u9F50\u3001\u660E\u7EC6\u5360\u7B2C\u4E8C\u884C\uFF0C\u4E09\u6BB5\u53EA\u5360\u7EA6 150px\u3002 */
+@media (max-width:620px){.dq-period-grid{grid-template-columns:1fr;gap:16px}.dq-period{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:center}.dq-period-head{margin:0}.dq-period-cost{grid-column:2;grid-row:1}.dq-period-sub{grid-column:1/-1;margin-top:2px}}
+.dq-period-head{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin-bottom:8px}
+.dq-period-label{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-period-cost{font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;line-height:1.2}
+.dq-period-sub{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);margin-top:4px;font-variant-numeric:tabular-nums;line-height:1.5}
+.dq-budget{margin-top:24px}
 .dq-budget--unset{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-budget-action{border:0;background:transparent;padding:3px 4px;border-radius:5px;color:var(--dsw-alias-state-business-primary,#0969da);font:inherit;font-weight:600;white-space:nowrap;cursor:pointer}
 .dq-budget-action:hover{text-decoration:underline;text-underline-offset:3px}
 .dq-budget-action:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
 .dq-budget-head,.dq-budget-meta{display:flex;align-items:center;justify-content:space-between;gap:12px}
-.dq-budget-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328)}
-.dq-budget-amount{font-size:12px;font-weight:650;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
+.dq-budget-title{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-budget-amount{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
 .dq-budget-track{height:8px;margin-top:8px;border-radius:999px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.12));overflow:hidden}
 .dq-budget-fill{width:100%;height:100%;border-radius:999px;background:var(--dsw-alias-state-success-primary,#2da44e);transform-origin:left center;transition:transform .35s cubic-bezier(.22,1,.36,1)}
 .dq-budget--risk .dq-budget-fill{background:var(--dsw-alias-state-warning-primary,#bf8700)}
 .dq-budget--over .dq-budget-fill{background:var(--dsw-alias-state-error-primary,#cf222e)}
 .dq-budget-meta{margin-top:6px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
-.dq-budget--risk .dq-budget-meta span:last-child{color:var(--dsw-alias-state-warning-primary,#9a6700);font-weight:600}
+.dq-budget--risk .dq-budget-meta span:last-child{color:var(--dq-text-warn);font-weight:600}
 .dq-budget--over .dq-budget-meta{color:var(--dsw-alias-state-error-primary,#cf222e);font-weight:600}
-@media (max-width:620px){.dq-budget-head,.dq-budget-meta,.dq-budget--unset{align-items:flex-start;flex-direction:column;gap:4px}}
-.dq-delta{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;padding:1px 6px;border-radius:999px;white-space:nowrap;cursor:help;font-variant-numeric:tabular-nums}
-.dq-delta--up{color:var(--dsw-alias-state-warning-primary,#9a6700);background:rgba(191,135,0,.14)}
-.dq-delta--down{color:var(--dsw-alias-state-success-primary,#1a7f37);background:rgba(45,164,78,.14)}
-.dq-delta--flat,.dq-delta--new{color:var(--dsw-alias-label-tertiary,#59636e);background:rgba(120,130,150,.14);font-weight:500}
+@media (max-width:620px){.dq-budget-head,.dq-budget-meta,.dq-budget--unset{align-items:flex-start;flex-direction:column;gap:4px}.dq-budget-action{margin-left:-4px}}
+.dq-delta{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;padding:1px 6px;border-radius:999px;white-space:nowrap;cursor:help;font-variant-numeric:tabular-nums}
+.dq-delta--up{color:var(--dq-text-warn);background:rgba(191,135,0,.14)}
+.dq-delta--down{color:var(--dq-text-success);background:rgba(45,164,78,.14)}
+.dq-delta--flat,.dq-delta--new{color:var(--dsw-alias-label-secondary,#59636e);background:rgba(120,130,150,.14);font-weight:500}
 .dq-delta-label{font-weight:400;opacity:.8}
-.dq-pricing{margin-top:12px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));padding-top:10px}
+.dq-pricing{margin-top:16px}
 .dq-pricing-summary{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);cursor:pointer;list-style:none;width:fit-content;border-radius:6px;padding:2px 4px;margin-left:-4px}
 .dq-pricing-summary::-webkit-details-marker{display:none}
-.dq-pricing-summary::before{content:"\u25B8";display:inline-block;font-size:10px;opacity:.7;transition:transform .15s ease}
+.dq-pricing-summary::before{content:"";display:inline-block;flex:none;width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s ease}
 .dq-pricing[open] .dq-pricing-summary::before{transform:rotate(90deg)}
 .dq-pricing-summary:hover{color:var(--dsw-alias-label-primary,#1f2328)}
 .dq-pricing-summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
-.dq-pricing-now{font-size:11px;font-weight:600;padding:1px 7px;border-radius:999px;color:var(--dsw-alias-label-tertiary,#59636e);background:rgba(120,130,150,.14)}
-.dq-pricing-now--peak{color:var(--dsw-alias-state-warning-primary,#9a6700);background:rgba(191,135,0,.14)}
-.dq-pricing-body{margin-top:10px;overflow-x:auto}
+.dq-pricing-now{font-size:12px;font-weight:600;padding:1px 7px;border-radius:999px;color:var(--dsw-alias-label-secondary,#59636e);background:rgba(120,130,150,.14)}
+.dq-pricing-now--peak{color:var(--dq-text-warn);background:rgba(191,135,0,.14)}
+.dq-pricing-body{margin-top:8px;overflow-x:auto}
 .dq-pricing-table{border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums;min-width:100%}
-.dq-pricing-table th{text-align:left;font-weight:500;color:var(--dsw-alias-label-tertiary,#59636e);padding:4px 12px 4px 0;white-space:nowrap;border-bottom:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
+.dq-pricing-table th{text-align:left;font-weight:500;color:var(--dsw-alias-label-secondary,#59636e);padding:4px 12px 4px 0;white-space:nowrap;border-bottom:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
 .dq-pricing-table td{padding:4px 12px 4px 0;color:var(--dsw-alias-label-primary,#1f2328);white-space:nowrap;vertical-align:top}
+.dq-pricing-table th:nth-child(n+3),.dq-pricing-table td:nth-child(n+3){text-align:right}
+.dq-pricing-table th:last-child,.dq-pricing-table td:last-child{padding-right:0}
+.dq-pricing-table tbody td:first-child{font-weight:500}
 .dq-pricing-table tbody tr+tr td{border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.05))}
-.dq-pricing-foot{margin:8px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e)}
-.dq-coverage{margin-top:16px;padding-top:12px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
-.dq-coverage-summary{display:flex;align-items:center;flex-wrap:wrap;gap:6px 9px;cursor:pointer;list-style:none;width:fit-content;max-width:100%;margin-left:-4px;padding:3px 4px;border-radius:6px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-pricing-foot{margin:8px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e);text-wrap:pretty}
+.dq-coverage{margin-top:24px}
+.dq-coverage-summary{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;cursor:pointer;list-style:none;width:fit-content;max-width:100%;margin-left:-4px;padding:3px 4px;border-radius:6px;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-coverage-summary::-webkit-details-marker{display:none}
-.dq-coverage-summary::before{content:"\u25B8";display:inline-block;font-size:10px;opacity:.7;transition:transform .15s ease}
+.dq-coverage-summary::before{content:"";display:inline-block;flex:none;width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s ease}
 .dq-coverage[open] .dq-coverage-summary::before{transform:rotate(90deg)}
 .dq-coverage-summary:hover{color:var(--dsw-alias-label-primary,#1f2328)}
 .dq-coverage-summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
-.dq-coverage-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328)}
-.dq-coverage-status{padding:1px 7px;border-radius:999px;background:rgba(45,164,78,.14);color:var(--dsw-alias-state-success-primary,#1a7f37);font-size:11px;font-weight:600}
-.dq-coverage--warn .dq-coverage-status{background:rgba(191,135,0,.14);color:var(--dsw-alias-state-warning-primary,#9a6700)}
+.dq-coverage-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-coverage-status{padding:1px 7px;border-radius:999px;background:rgba(45,164,78,.14);color:var(--dq-text-success);font-size:12px;font-weight:600}
+.dq-coverage--warn .dq-coverage-status{background:rgba(191,135,0,.14);color:var(--dq-text-warn)}
 .dq-coverage-brief{font-size:12px;font-variant-numeric:tabular-nums}
-.dq-coverage-body{margin-top:10px;padding:11px 12px;border-radius:10px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
-.dq-coverage-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 20px;margin:0}
+.dq-coverage-body{margin-top:8px;padding:12px;border-radius:10px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
+.dq-coverage-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;margin:0}
 .dq-coverage-metrics div{min-width:0}
-.dq-coverage-metrics dt{font-size:11px;color:var(--dsw-alias-label-tertiary,#59636e)}
-.dq-coverage-metrics dd{margin:3px 0 0;font-size:13px;font-weight:650;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
-.dq-coverage-range,.dq-coverage-note,.dq-coverage-warning{margin:9px 0 0;font-size:12px;line-height:1.55;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-coverage-metrics dt{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-coverage-metrics dd{margin:3px 0 0;font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
+.dq-coverage-range,.dq-coverage-note,.dq-coverage-warning{margin:8px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e);text-wrap:pretty}
 .dq-coverage-range{font-variant-numeric:tabular-nums}
-.dq-coverage-warning{padding:8px 10px;border-radius:8px;background:rgba(191,135,0,.10);color:var(--dsw-alias-state-warning-primary,#7a5200)}
+.dq-coverage-warning{padding:8px 10px;border-radius:8px;background:rgba(191,135,0,.10);color:var(--dq-text-warn)}
 @media (max-width:620px){.dq-coverage-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dq-coverage-brief{flex-basis:100%;margin-left:19px}}
 .dq-peak-track{height:8px;border-radius:999px;background:var(--dsw-alias-state-success-primary,#2da44e);opacity:.85;overflow:hidden}
 .dq-peak-fill{height:100%;border-radius:999px;background:var(--dsw-alias-state-warning-primary,#bf8700);transition:width .35s cubic-bezier(.22,1,.36,1)}
-.dq-peak-legend{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
+.dq-peak-legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
 .dq-peak-legend span{display:inline-flex;align-items:center;gap:6px}
 .dq-legend-swatch--peak{background:var(--dsw-alias-state-warning-primary,#bf8700)}
 .dq-legend-swatch--offpeak{background:var(--dsw-alias-state-success-primary,#2da44e);opacity:.85}
-.dq-peak-figures{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:14px}
-.dq-peak-delta{font-size:11px;font-weight:500;margin-left:8px;color:var(--dsw-alias-state-warning-primary,#9a6700)}
-.dq-peak-delta--save{color:var(--dsw-alias-state-success-primary,#1a7f37)}
-.dq-peak-foot{margin:10px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-peak-figures{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:16px}
+.dq-peak-delta{font-size:12px;font-weight:500;margin-left:8px;color:var(--dq-text-warn)}
+.dq-peak-delta--save{color:var(--dq-text-success)}
 .dq-cache-figures{display:flex;flex-wrap:wrap;gap:12px 32px;margin-bottom:12px}
-.dq-muted-value{color:var(--dsw-alias-label-secondary,#59636e)!important;font-weight:550}
-.dq-stat-value--warn{color:var(--dsw-alias-state-warning-primary,#9a6700)}
+@media (max-width:620px){.dq-cache-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}.dq-cache-figures .dq-stat{min-width:0}}
+.dq-muted-value{color:var(--dsw-alias-label-secondary,#59636e)!important;font-weight:500}
+.dq-stat-value--warn{color:var(--dq-text-warn)}
 .dq-cache-track{height:8px;border-radius:999px;background:var(--dsw-alias-state-warning-primary,#bf8700);overflow:hidden}
 .dq-cache-fill{height:100%;border-radius:999px;background:var(--dsw-alias-state-success-primary,#2da44e);transition:width .35s cubic-bezier(.22,1,.36,1)}
-.dq-cache-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
+.dq-cache-legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
 .dq-cache-legend span{display:inline-flex;align-items:center;gap:6px}
 .dq-legend-swatch--hit{background:var(--dsw-alias-state-success-primary,#2da44e)}
 .dq-legend-swatch--miss{background:var(--dsw-alias-state-warning-primary,#bf8700)}
-.dq-cache-foot{margin:10px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e)}
-.dq-sessions{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
-.dq-session{display:flex;flex-direction:column;gap:5px;min-width:0}
+.dq-cache-foot{margin:12px 0 0;font-size:12px;line-height:1.6;color:var(--dsw-alias-label-secondary,#59636e);text-wrap:pretty}
+.dq-sessions{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
+.dq-session{display:flex;flex-direction:column;gap:4px;min-width:0}
 .dq-session-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
-.dq-session-title{font-size:13px;font-weight:550;color:var(--dsw-alias-label-primary,#1f2328);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.dq-session-cost{font-size:14px;font-weight:650;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;flex:none}
+.dq-session-title{font-size:13px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.dq-session-cost{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;flex:none}
 .dq-session-track{height:6px;border-radius:999px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.12));overflow:hidden}
 .dq-session-fill{height:100%;border-radius:999px;background:var(--dsw-alias-state-business-primary,#4176e6);transition:width .35s cubic-bezier(.22,1,.36,1)}
 .dq-session-sub{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums;line-height:1.5}
@@ -2983,8 +3187,10 @@ var css = `
    to lean on, unlike the .dq-session usage above), so it needs its own
    explicit spacing rather than falling back to the browser's implicit <p>
    margin \u2014 this project always declares spacing explicitly. */
-p.dq-session-sub{margin:8px 0}
-.dq-session-foot{margin:12px 0 0;font-size:12px;color:var(--dsw-alias-label-tertiary,#59636e)}
+.dq-session-meta{margin:12px 0 0;display:flex;flex-direction:column;gap:2px}
+.dq-session-meta p.dq-session-sub{margin:0}
+.dq-session-meta+.dq-rank{margin-top:16px}
+.dq-session-foot{margin:12px 0 0;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
 /* \u8F6E\u6B21 46: each ranking row is now a <details> whose <summary> wraps the existing
    head/track/sub trio unchanged (in a flex-column body div) plus a leading chevron \u2014
    same disclosure grammar as .dq-pricing/.dq-coverage above (hidden native marker,
@@ -2997,60 +3203,63 @@ p.dq-session-sub{margin:8px 0}
 .dq-session-summary{display:flex;align-items:flex-start;gap:8px;border-radius:8px;padding:4px;margin:-4px}
 .dq-session-summary:hover{background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.05))}
 .dq-session-summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
-.dq-session-chevron{flex:none;width:12px;margin-top:4px;font-size:10px;line-height:1;color:var(--dsw-alias-label-tertiary,#59636e);transition:transform .15s ease}
+/* \u5C55\u5F00\u7BAD\u5934\uFF1A14px \u7EBF\u6761\u56FE\u6807\uFF08mask \u53D6 currentColor\uFF09\uFF0C\u66FF\u4EE3\u539F\u6765 10px \u7684\u300C\u25B8\u300D\u5B57\u7B26\u2014\u2014\u90A3\u4E2A\u5B57\u5F62\u592A\u5C0F\u3001\u592A\u6D45\uFF0C\u70B9\u51FB\u76EE\u6807\u4E5F\u96BE\u627E\u3002 */
+.dq-session-chevron{display:inline-block;flex:none;width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s ease;margin-top:3px;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-session-details[open] .dq-session-chevron{transform:rotate(90deg)}
-.dq-session-summary-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
+.dq-session-summary-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
 /* Expanded body reuses the same shaded-inset language as .dq-coverage-body (10px
    gap from the summary, 11px/12px padding, 10px radius, bg-layer-2) rather than
    inventing a new "nested panel" look. SessionUsageCard renders inside unchanged. */
-.dq-session-expand{margin-top:10px;padding:11px 12px;border-radius:10px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
-.dq-rank{display:flex;flex-direction:column;gap:14px}
-.dq-rank-row{display:flex;flex-direction:column;gap:5px;min-width:0}
+.dq-session-expand{margin-top:8px;padding:12px;border-radius:10px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
+.dq-rank{display:flex;flex-direction:column;gap:16px}
+.dq-rank-row{display:flex;flex-direction:column;gap:4px;min-width:0}
 .dq-rank-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
-.dq-rank-name{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:550;color:var(--dsw-alias-label-primary,#1f2328);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-.dq-rank-cost{display:inline-flex;align-items:baseline;gap:8px;font-size:14px;font-weight:650;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;flex:none}
-.dq-rank-share{font-size:11px;font-weight:500;color:var(--dsw-alias-label-tertiary,#59636e);min-width:30px;text-align:right}
+.dq-rank-name{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.dq-rank-cost{display:inline-flex;align-items:baseline;gap:8px;font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums;flex:none}
+.dq-rank-share{font-size:12px;font-weight:500;color:var(--dsw-alias-label-secondary,#59636e);min-width:30px;text-align:right}
 .dq-rank-track{height:6px;border-radius:999px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.12));overflow:hidden}
 .dq-rank-fill{height:100%;border-radius:999px;transition:width .35s cubic-bezier(.22,1,.36,1)}
 .dq-rank-sub{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums;line-height:1.5}
-.dq-alert{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:10px;font-size:12px;line-height:1.6;color:var(--dsw-alias-state-warning-primary,#7a5200);background:rgba(191,135,0,.12);border:1px solid rgba(191,135,0,.35)}
+.dq-alert{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:10px;font-size:12px;line-height:1.6;color:var(--dq-text-warn);background:rgba(191,135,0,.12);border:1px solid rgba(191,135,0,.35);text-wrap:pretty}
 .dq-alert-icon{flex:none;width:18px;height:18px;border-radius:50%;background:var(--dsw-alias-state-warning-primary,#bf8700);color:#fff;font-weight:700;font-size:12px;line-height:18px;text-align:center}
-.dq-alert strong{font-weight:650}
+.dq-alert strong{font-weight:600}
 .dq-alert-link{margin-left:8px;color:inherit;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
-.dq-setting{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
-.dq-setting-label{font-size:13px;color:var(--dsw-alias-label-primary,#1f2328);padding-top:6px;flex:none}
+.dq-setting{display:flex;align-items:flex-start;gap:16px;margin-top:24px}
+@media (max-width:620px){.dq-setting{flex-direction:column;gap:8px}.dq-setting-label{width:auto;padding-top:0}}
+.dq-setting-label{width:128px;font-size:13px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328);padding-top:6px;flex:none}
 .dq-setting-control{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
 .dq-setting-hint{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);line-height:1.5}
 /* Page footer: the package name + version, injected at build time from
    package.json (see build.mjs) so it can never drift from the release. */
-.dq-footer{margin:18px 0 0;font-size:12px;text-align:center;color:var(--dsw-alias-label-tertiary,#59636e)}
+.dq-footer{margin:16px 0 0;font-size:12px;text-align:center;color:var(--dsw-alias-label-tertiary,#59636e)}
 .dq-number{width:82px;padding:5px 8px;font-size:13px;border-radius:8px;border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.16));background:var(--dsw-alias-bg-layer-1,#fff);color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
 .dq-number:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px;border-color:transparent}
-.dq-links-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);margin:0 0 8px}
+.dq-links-title{font-size:13px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328);margin:0 0 12px}
 .dq-links{display:flex;flex-wrap:wrap;gap:8px}
-.dq-link{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.12));border-radius:8px;background:var(--dsw-alias-bg-layer-1,#fff);color:var(--dsw-alias-state-business-primary,#0969da);text-decoration:none;font-size:13px;font-weight:500;cursor:pointer}
-.dq-link:hover{border-color:var(--dsw-alias-state-business-primary,#0969da);background:var(--dsw-alias-interactive-bg-hover,rgba(0,0,0,.04))}
+.dq-link{display:inline-flex;align-items:center;gap:4px;padding:8px 12px;border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.12));border-radius:8px;background:var(--dsw-alias-bg-layer-1,#fff);color:var(--dsw-alias-label-primary,#1f2328);text-decoration:none;font-size:13px;font-weight:500;cursor:pointer}
+.dq-link::after{content:"\u2197";font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-link:hover{border-color:var(--dsw-alias-label-secondary,#59636e);background:var(--dsw-alias-interactive-bg-hover,rgba(0,0,0,.04))}
 /* .dq-toggle is the first settings control after the links row (\u8F6E\u6B21 39 merge) \u2014 its own
    border-top separates the "\u5FEB\u6377\u5165\u53E3" links (originally the standalone \u5B98\u65B9\u5E73\u53F0 card, renamed
    in \u8F6E\u6B21 39 fix-round-1 to read as part of \u8BBE\u7F6E's own navigation area) from \u8BBE\u7F6E controls
    inside the merged card, same 14px/14px/border-l1 recipe as .dq-setting so the two
    sub-sections read at equal weight. */
-.dq-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;margin-top:14px;padding-top:14px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
+.dq-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;font-weight:500;margin-top:24px}
 .dq-toggle input{width:16px;height:16px;accent-color:var(--dsw-alias-state-business-primary,#0969da);cursor:pointer}
-.dq-toggle-hint{margin:5px 0 0 26px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-secondary,#59636e)}
-.dq-widget-tabs{align-items:flex-start;flex-direction:column;gap:7px}
-.dq-widget-tab-list{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px}
-.dq-widget-tab{display:inline-flex;align-items:center;gap:7px;min-height:28px;color:var(--dsw-alias-label-primary,#1f2328);font-size:12px;cursor:pointer}
+.dq-toggle-hint{margin:4px 0 0 26px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-widget-tabs{align-items:flex-start;flex-direction:column;gap:8px}
+.dq-widget-tab-list{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px}
+.dq-widget-tab{display:inline-flex;align-items:center;gap:7px;min-height:28px;color:var(--dsw-alias-label-primary,#1f2328);font-size:12px;font-weight:500;cursor:pointer}
 .dq-widget-tab input{width:14px;height:14px;margin:0;accent-color:var(--dsw-alias-state-business-primary,#0969da);cursor:pointer;flex:none}
 .dq-toggle input:focus-visible,.dq-model-item input:focus-visible,.dq-widget-tab input:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
 .dq-link:focus-visible,.dq-model-btn:focus-visible,.dq-chart-switch-btn:focus-visible,.dq-export-btn:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
-.dq-usage-totals{display:flex;flex-wrap:wrap;gap:12px 24px;margin-bottom:16px}
+.dq-usage-totals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 24px;margin-bottom:20px}
 /* value itself (number+unit, e.g. "9999.9\u4E07") must never break across lines inside its own column \u2014
    nowrap+ellipsis is a defensive floor for all widths; the actual fix for the realistic 320px 2-col
    case is the font-size drop below, which keeps every measured stress value comfortably under the
    83px column width without ever hitting the ellipsis fallback (see round 38 PROGRESS entry) */
 .dq-usage-totals .dq-stat-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.dq-vision-share{display:inline-block;margin-left:6px;font-size:11px;font-weight:550;color:var(--dsw-alias-label-tertiary,#59636e)}
+.dq-vision-share{display:inline-block;margin-left:6px;font-size:12px;font-weight:500;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-vision-sessions{margin-top:12px;display:flex;flex-direction:column;gap:8px;min-width:0}
 /* The vision card's session rows reuse .dq-session-head, but \u2014 unlike the
    ranking card's rows \u2014 they sit directly under .dq-session with no
@@ -3061,13 +3270,13 @@ p.dq-session-sub{margin:8px 0}
 .dq-vision-sessions .dq-session-head{min-width:0}
 .dq-vision-sessions .dq-session-title{flex:1 1 auto;min-width:0}
 @media (max-width:620px){.dq-usage-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}.dq-usage-totals .dq-stat{min-width:0}.dq-usage-totals .dq-stat-value{font-size:13px}}
-.dq-chart-peak{margin-left:10px;font-size:11px;font-weight:400;color:var(--dsw-alias-label-tertiary,#59636e);font-variant-numeric:tabular-nums}
-.dq-chart-title{font-size:12px;font-weight:600;color:var(--dsw-alias-label-secondary,#59636e);margin:16px 0 8px}
+.dq-chart-peak{margin-left:8px;font-size:12px;font-weight:400;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
+.dq-chart-title{font-size:13px;font-weight:600;color:var(--dsw-alias-label-primary,#1f2328);margin:16px 0 8px}
 .dq-chart-title:first-of-type{margin-top:0}
-.dq-chart-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 8px}
+.dq-chart-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
 .dq-chart-block-head .dq-chart-title{margin:0}
 .dq-chart-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:none;flex-wrap:wrap}
-@media (max-width:620px){.dq-chart-block-head{align-items:flex-start;flex-direction:column}.dq-chart-controls{width:100%}}
+@media (max-width:620px){.dq-chart-block-head{align-items:flex-start;flex-direction:column}.dq-chart-controls{width:100%;justify-content:flex-start}}
 .dq-model-picker{position:relative}
 .dq-model-btn{border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.12));background:var(--dsw-alias-bg-layer-1,#fff);color:var(--dsw-alias-label-secondary,#59636e);border-radius:8px;padding:4px 10px;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
 .dq-model-btn:hover{border-color:var(--dsw-alias-state-business-primary,#0969da);color:var(--dsw-alias-state-business-primary,#0969da)}
@@ -3078,13 +3287,13 @@ p.dq-session-sub{margin:8px 0}
 .dq-model-item input{width:14px;height:14px;accent-color:var(--dsw-alias-state-business-primary,#0969da);cursor:pointer;flex:none}
 .dq-model-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .dq-model-item--all{border-bottom:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));padding-bottom:8px;margin-bottom:2px;border-radius:6px}
-.dq-model-tag{color:var(--dsw-alias-label-tertiary,#59636e);font-size:11px;flex:none}
+.dq-model-tag{color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;flex:none}
 .dq-bar-group{display:flex;flex-direction:column-reverse;width:100%}
 .dq-bar-group .dq-bar{flex:0 0 auto;width:100%;border-radius:0}
 .dq-bar-group .dq-bar:first-child{border-radius:0 0 2px 2px}
 .dq-bar-group .dq-bar:last-child{border-radius:2px 2px 0 0}
 .dq-bar-group .dq-bar:not(:last-child){box-shadow:inset 0 1px 0 rgba(0,0,0,.18)}
-.dq-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-legend-item{display:inline-flex;align-items:center;gap:6px}
 .dq-legend-swatch{width:10px;height:10px;border-radius:3px;flex:none}
 .dq-chart-switch{display:inline-flex;align-items:center;gap:2px;padding:2px;background:var(--dsw-alias-bg-layer-2,rgba(0,0,0,.06));border-radius:999px;flex:none}
@@ -3093,9 +3302,9 @@ p.dq-session-sub{margin:8px 0}
 .dq-chart-switch-btn--on{background:var(--dsw-alias-bg-overlay,#fff);color:var(--dsw-alias-label-primary,#1f2328);box-shadow:0 1px 3px rgba(0,0,0,.14)}
 .dq-chart-wrap{position:relative}
 .dq-bars-scroll{overflow-x:auto;overflow-y:hidden;padding-bottom:2px}
-.dq-tip{position:absolute;transform:translate(-50%,14px);z-index:40;pointer-events:none;background:var(--dsw-alias-bg-inverse,#1f2328);color:var(--dsw-alias-label-inverse,#fff);border-radius:8px;padding:7px 10px;font-size:12px;line-height:1.55;white-space:nowrap;box-shadow:0 6px 20px rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
+.dq-tip{position:absolute;transform:translate(-50%,14px);z-index:40;pointer-events:none;background:var(--dsw-alias-tooltip-bg,#1f2328);color:var(--dsw-static-neutral-bluish-00,#fff);border-radius:8px;padding:7px 10px;font-size:12px;line-height:1.5;white-space:nowrap;box-shadow:0 6px 20px rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
 .dq-tip--above{transform:translate(-50%,calc(-100% - 8px))}
-.dq-tip-head{font-weight:650;margin-bottom:2px}
+.dq-tip-head{font-weight:600;margin-bottom:2px}
 .dq-tip-row{opacity:.85}
 .dq-bars{display:flex;align-items:flex-end;gap:2px;width:100%}
 .dq-bar-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch}
@@ -3111,7 +3320,7 @@ p.dq-session-sub{margin:8px 0}
 .dq-heat-cell:not(.dq-heat-cell--pad):hover{outline:1.5px solid var(--dsw-alias-label-primary,#1f2328);outline-offset:1px}
 .dq-heat-cell:not(.dq-heat-cell--pad):focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px;position:relative;z-index:2}
 .dq-heat-cell--pinned{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px;position:relative;z-index:2}
-.dq-bar-label{font-size:9px;color:var(--dsw-alias-label-tertiary,#59636e);text-align:center;margin-top:3px;overflow:visible;white-space:nowrap}
+.dq-bar-label{font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);text-align:center;margin-top:4px;overflow:visible;white-space:nowrap}
 .dq-heat{display:flex;flex-direction:column;gap:8px;max-width:100%}
 .dq-heat-scroll{overflow-x:auto;padding-bottom:2px}
 .dq-heatmap{display:flex;gap:3px}
@@ -3119,16 +3328,16 @@ p.dq-session-sub{margin:8px 0}
 .dq-heat-cell{width:100%;aspect-ratio:1/1;border-radius:3px;flex:none}
 .dq-heat-cell--pad{background:transparent}
 .dq-heat-months{display:flex;gap:3px;margin-top:4px}
-.dq-heat-month{flex:1 1 0;min-width:6px;font-size:10px;line-height:14px;color:var(--dsw-alias-label-tertiary,#59636e);white-space:nowrap;overflow:visible}
+.dq-heat-month{flex:1 1 0;min-width:6px;font-size:12px;line-height:15px;color:var(--dsw-alias-label-secondary,#59636e);white-space:nowrap;overflow:visible}
 .dq-heat-key{width:12px;height:12px;border-radius:2px;flex:none}
-.dq-heat-scale{display:flex;align-items:center;gap:3px;font-size:10px;color:var(--dsw-alias-label-tertiary,#59636e);align-self:flex-end}
+.dq-heat-scale{display:flex;align-items:center;gap:3px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);align-self:flex-end}
 .dq-heat-scale>span:first-child{margin-right:2px}
 .dq-heat-scale>span:last-child{margin-left:2px}
 .dq-muted{color:var(--dsw-alias-label-secondary,#59636e)}
 .dq-error{color:var(--dsw-alias-state-error-primary,#cf222e)}
-.dq-warn{color:var(--dsw-alias-state-warning-primary,#9a6700)}
-.dq-crash{margin:10px 0 14px;padding:10px 12px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.10));border-radius:8px;font-size:12px;line-height:1.5;color:var(--dsw-alias-state-error-primary,#cf222e);white-space:pre-wrap;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
-.dq-empty{color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;line-height:1.6;padding:6px 0}
+.dq-warn{color:var(--dq-text-warn)}
+.dq-crash{margin:10px 0 14px;padding:10px 12px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.10));border-radius:8px;font-size:12px;line-height:1.6;color:var(--dsw-alias-state-error-primary,#cf222e);white-space:pre-wrap;word-break:break-word;font-family:var(--ds-font-family-code,ui-monospace,SFMono-Regular,Menlo,monospace)}
+.dq-empty{color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;line-height:1.6;padding:6px 0;text-wrap:pretty}
 /* Error-state modifier for a card body that has nothing else to show (mirrors the .dq-stat-value--ok/
    --bad/--warn pattern: same layout as .dq-empty, declared after it so this color wins at equal
    specificity). Used by the current-session card when its own fetch failed and there is no prior
@@ -3137,17 +3346,17 @@ p.dq-session-sub{margin:8px 0}
 .dq-empty--error{color:var(--dsw-alias-state-error-primary,#cf222e)}
 .dq-skel{background:linear-gradient(90deg,rgba(125,135,155,.10) 25%,rgba(125,135,155,.20) 37%,rgba(125,135,155,.10) 63%);background-size:400% 100%;border-radius:5px;animation:dq-shimmer 1.5s ease-in-out infinite}
 .dq-stat .dq-skel+.dq-skel{margin-top:6px}
-.dq-skel-bars{display:flex;align-items:flex-end;gap:2px;width:100%;height:120px;margin-top:10px}
+.dq-skel-bars{display:flex;align-items:flex-end;gap:2px;width:100%;height:160px;margin-top:12px}
 .dq-skel-bar{flex:1 1 0;min-width:0;border-radius:2px 2px 0 0}
 @keyframes dq-shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}
-.dq-status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:20px}
+.dq-status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:20px;padding:0 20px;margin-bottom:-12px}
 .dq-status-messages{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
-.dq-status-row .dq-warn,.dq-status-row .dq-error{font-size:12px;line-height:1.45}
+.dq-status-row .dq-warn,.dq-status-row .dq-error{font-size:12px;line-height:1.5}
 .dq-sync{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--dsw-alias-label-secondary,#59636e);font-variant-numeric:tabular-nums}
 .dq-sync-dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--dsw-alias-label-tertiary,#8c959f)}
 .dq-sync--fresh .dq-sync-dot{background:var(--dsw-alias-state-success-primary,#2da44e)}
 .dq-sync--syncing .dq-sync-dot{background:var(--dsw-alias-state-business-primary,#4176e6);animation:dq-sync-pulse 1.2s ease-in-out infinite}
-.dq-sync--fallback{color:var(--dsw-alias-state-warning-primary,#9a6700)}
+.dq-sync--fallback{color:var(--dq-text-warn)}
 .dq-sync--fallback .dq-sync-dot{background:var(--dsw-alias-state-warning-primary,#bf8700)}
 .dq-sync--error{color:var(--dsw-alias-state-error-primary,#cf222e)}
 .dq-sync--error .dq-sync-dot{background:var(--dsw-alias-state-error-primary,#cf222e)}
@@ -3159,6 +3368,77 @@ p.dq-session-sub{margin:8px 0}
 .dq-refresh-icon{display:inline-block;line-height:1}
 .dq-refresh-icon--spin{animation:dq-spin .9s linear infinite}
 @keyframes dq-spin{to{transform:rotate(360deg)}}
+/* ============================================================================
+   Host chrome: the \u300C\u989D\u5EA6\u300Dconversation view does not use the chat composer.
+   The attribute is set by index.tsx only when the dashboard is mounted inside
+   the conversation scrollport, so the account-wide panel never hides it.
+   '!important' because the composer's slot anchor is a "display:contents"
+   wrapper whose display we must beat regardless of host rule order.
+   ============================================================================ */
+html[data-dq-quota-view] [data-slot="conversation.composer"]{display:none!important}
+/* The narrow-viewport rule pads for the fixed composer; with it hidden there
+   is nothing to clear, so fall back to the page's own bottom breathing room. */
+html[data-dq-quota-view] .dq-balance{padding-bottom:48px}
+/* ============================================================================
+   Account-wide \u300C\u989D\u5EA6\u300Dpanel (the optional sidebar entry opens this main
+   keyed panel). The dashboard keeps its own width/padding; the panel only
+   supplies the page title row and the scrolling box the main column lacks.
+   ============================================================================ */
+/* Account-wide page frame: mirrors DSH's first-level pages (Plugins /
+   Scheduled tasks) \u2014 full-height scroll box, 28px top inset on the heading,
+   a 960px centred column, clamp(24px,4vw,48px) inline + 48px bottom insets and
+   a 20px/28px/500 page title, so the three sibling entries line up. */
+.dq-panel{box-sizing:border-box;height:100%;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 clamp(24px,4vw,48px) 48px;background:var(--dsw-alias-bg-base,#fff);color:var(--dsw-alias-label-primary,#1f2328);font-family:var(--dsw-font-family,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif);font-size:13px;line-height:1.5}
+.dq-panel-head{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;max-width:960px;margin:0 auto 32px;padding-top:28px}
+.dq-panel-title{margin:0;font-size:20px;font-weight:500;line-height:28px;color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-panel-caption{font-size:13px;line-height:20px;color:var(--dsw-alias-label-secondary,#59636e)}
+.dq-panel .dq-balance{box-sizing:border-box;width:100%;max-width:960px;padding:0}
+/* macOS hiddenInset titlebar: the frame's top clearance keeps the heading
+   below the window's top strip, matching the host's sibling pages. */
+[data-platform="darwin"] .dq-panel-head{padding-top:calc(28px + var(--dsh-frame-top-clearance,0px))}
+@media (max-width:620px){
+  .dq-panel-head{padding-top:24px;margin-bottom:24px}
+  .dq-panel .dq-balance{max-width:100%;padding:0}
+}
+/* Optional sidebar entry. Top placement joins the host's global-panel icon
+   row (only the glyph is ours); bottom placement renders a row beside
+   Settings, collapsing to a square rail button with the sidebar. */
+/* The glyph is an SVG matching the host's 16px stroke icons; color inherits
+   from the sidebar row so selected/hover states stay the host's business. */
+.dq-side-icon{flex:none;display:block}
+.dq-side-entry{display:flex;align-items:center;gap:8px;box-sizing:border-box;width:100%;border:0;border-radius:8px;padding:7px 8px;background:transparent;color:var(--dsw-alias-label-secondary,#59636e);font:inherit;font-size:13px;line-height:1.3;text-align:left;cursor:pointer}
+.dq-side-entry:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.10));color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-side-entry:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-side-entry[aria-pressed="true"]{color:var(--dsw-alias-label-primary,#1f2328)}
+.dq-side-entry--rail{justify-content:center;width:32px;height:32px;margin:0 auto;padding:0}
+.dq-side-entry-icon{flex:none;display:inline-flex;align-items:center;justify-content:center}
+.dq-side-entry-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+/* ============================================================================
+   Settings controls for the two layout preferences: a compact select and the
+   draggable tab-order strip.
+   ============================================================================ */
+.dq-select{font:inherit;font-size:13px;line-height:1.3;color:var(--dsw-alias-label-primary,#1f2328);background:var(--dsw-alias-bg-layer-1,#fff);border:1px solid var(--dsw-alias-border-l2,rgba(0,0,0,.16));border-radius:8px;padding:5px 8px;min-width:96px;cursor:pointer}
+.dq-select:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-tab-order{display:flex;flex-wrap:wrap;align-items:center;gap:6px;box-sizing:border-box;max-width:100%;min-height:32px;padding:4px;border:1px dashed var(--dsw-alias-border-l2,rgba(0,0,0,.16));border-radius:8px;background:var(--dsw-alias-bg-layer-2,rgba(120,130,150,.06))}
+.dq-tab-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08));border-radius:999px;background:var(--dsw-alias-bg-overlay,#fff);color:var(--dsw-alias-label-secondary,#59636e);font-size:12px;line-height:1.4;white-space:nowrap}
+.dq-tab-chip--current{cursor:grab;color:var(--dsw-alias-label-primary,#1f2328);border-color:var(--dsw-alias-state-business-primary,#0969da);font-weight:600;user-select:none;-webkit-user-select:none;touch-action:none}
+.dq-tab-chip--current:active{cursor:grabbing}
+.dq-tab-chip--current:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:1px}
+.dq-tab-chip--dragging{opacity:.55}
+.dq-tab-chip--drop-target{border-style:dashed;border-color:var(--dsw-alias-state-business-primary,#0969da)}
+/* ============================================================================
+   \u300C\u56FE\u7247 / \u591A\u6A21\u6001\u7528\u91CF\u300Dlives inside the usage-trend card. The grid-rows 0fr\u21921fr
+   trick animates the section's real height as a window range makes it appear
+   or disappear; opacity/translate make the change read as a reveal rather
+   than a reflow. The body keeps 14px of top room in both states (clipped by
+   the 0fr row when closed) so opening never jumps.
+   ============================================================================ */
+.dq-vision-inline{display:grid;grid-template-rows:0fr;margin-top:0;opacity:0;transform:translateY(-3px);overflow:hidden;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1),margin-top .32s cubic-bezier(.22,1,.36,1),opacity .2s ease,transform .32s cubic-bezier(.22,1,.36,1)}
+.dq-vision-inline[data-open="true"]{grid-template-rows:1fr;margin-top:24px;opacity:1;transform:none}
+.dq-vision-inline-body{min-height:0;overflow:hidden}
+.dq-vision-inline-body>.dq-chart-title{margin-top:0}
+.dq-vision-inline-body>.dq-chart-title{margin-top:0}
+
 @media (prefers-reduced-motion:reduce){
   .dsh-quota-root,.dsh-quota-root *,
   .dsh-quota-root *::before,.dsh-quota-root *::after,
@@ -3444,7 +3724,7 @@ function QuotaWidget(props) {
   const sessionCostRow = sessionUsage === null ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.sessionCostTitle"), children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.sessionCost") }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
-      "\xA5 ",
+      "\xA5",
       fmtTurnCost(sessionUsage.cost)
     ] })
   ] });
@@ -3470,7 +3750,7 @@ function QuotaWidget(props) {
         usage.data !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.todayCostTitle", { age: usageAgeText }), children: [
           /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.todayCost") }),
           /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
-            "\xA5 ",
+            "\xA5",
             fmt(usage.data.summary.today.cost)
           ] })
         ] }),
@@ -3580,12 +3860,14 @@ function conversationViewsSource(slots) {
 // src/client/index.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var name = "dsh-usage-dashboard";
-var inject = ["slots", "locale"];
+var inject = ["slots", "locale", "layout"];
+var openQuotaTab = null;
 function apply(ctx) {
   ctx.effect(() => ctx.locale.register(NS, { zh, en }), "dsh-usage-dashboard: browser dictionaries");
   const t = ctx.locale.bind(NS);
   const views = conversationViewsSource(ctx.slots);
   if (typeof document !== "undefined") {
+    document.querySelectorAll('style[data-plugin="dsh-usage-dashboard"]').forEach((node) => node.remove());
     const tag = document.createElement("style");
     tag.dataset.plugin = "dsh-usage-dashboard";
     tag.textContent = css;
@@ -3609,17 +3891,153 @@ function apply(ctx) {
     },
     ({ t: slotT, sessionId, messageId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MessageCost, { sessionId, messageId }) }) })
   ));
-  ctx.slots.inject("conversation.view", () => ctx.slots.register(
-    { name: "conversation.view", id: "balance", order: 20, locale: NS, label: () => t("nav.quota") },
-    // `conversation.view` is a session-scoped slot, so the host injects its
-    // standard session props (including `sessionId`) alongside `t` — this
-    // plugin only destructures the two fields it needs, per the existing
-    // "hand-write the minimal structural type" convention (see context.ts).
-    // `sessionId` is typed optional defensively even though the host is
-    // expected to always supply it: BalanceDashboard renders the current-
-    // session card only when it actually has one, never throws either way.
-    ({ t: slotT, sessionId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { sessionId, views }) }) })
-  ));
+  const QuotaView = ({ t: slotT, sessionId, openView }) => {
+    (0, import_react7.useEffect)(() => {
+      if (openView !== void 0) openQuotaTab = openView;
+    }, [openView]);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { sessionId, views }) }) });
+  };
+  ctx.effect(() => {
+    let disposeView = null;
+    const mount = () => {
+      disposeView?.();
+      disposeView = ctx.slots.inject("conversation.view", () => ctx.slots.register(
+        {
+          name: "conversation.view",
+          id: "balance",
+          order: viewOrderForIndex(ctx.slots.entries("conversation.view"), quotaTabIndexStore.get()),
+          locale: NS,
+          label: () => t("nav.quota")
+        },
+        // `conversation.view` is a session-scoped slot, so the host injects its
+        // standard session props (including `sessionId`) alongside `t`; only the
+        // fields this plugin needs are destructured, per the existing
+        // "hand-write the minimal structural type" convention (see context.ts).
+        // `sessionId` stays optional: BalanceDashboard renders the current-
+        // session card only when it actually has one, never throws either way.
+        QuotaView
+      ));
+    };
+    mount();
+    const unsubscribe = quotaTabIndexStore.subscribe(() => {
+      const restore = document !== void 0 && document.documentElement.hasAttribute("data-dq-quota-view");
+      disposeView?.();
+      disposeView = null;
+      mount();
+      if (restore) queueMicrotask(() => openQuotaTab?.("balance", "dsh-usage-dashboard:tab-order"));
+    });
+    return () => {
+      unsubscribe();
+      disposeView?.();
+    };
+  }, "dsh-usage-dashboard: quota tab registration");
+  const QuotaPanel = ({ t: slotT }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dq-panel", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "dq-panel-head", "data-window-drag": true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { className: "dq-panel-title", children: slotT("nav.quota") }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-panel-caption", children: slotT("panel.caption") })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { views }) }) })
+  ] });
+  const QuotaGlyph = ({ size, active }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    "svg",
+    {
+      className: "dq-side-icon",
+      "data-active": active === true ? "true" : "false",
+      width: size,
+      height: size,
+      viewBox: "0 0 16 16",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.1,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 3.3 8 8.7l4.5-5.4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M8 8.7V13.2" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 10.2h9" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3.5 12.1h9" })
+      ]
+    }
+  );
+  const QuotaFooterButton = ({ wide, t: slotT }) => {
+    const [active, setActive] = (0, import_react7.useState)(() => ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID);
+    (0, import_react7.useEffect)(() => {
+      const sync = () => {
+        setActive(ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID);
+      };
+      sync();
+      return ctx.layout.panelInfo.subscribe(sync);
+    }, []);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: `dq-side-entry${wide ? "" : " dq-side-entry--rail"}`,
+        title: slotT("panel.openAria"),
+        "aria-label": slotT("nav.quota"),
+        "aria-pressed": active,
+        onClick: () => {
+          ctx.layout.selectPanel(active ? null : QUOTA_PANEL_ID);
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-side-entry-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(QuotaGlyph, { size: 16 }) }),
+          wide && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "dq-side-entry-label", children: slotT("nav.quota") })
+        ]
+      }
+    );
+  };
+  ctx.effect(() => ctx.slots.inject("main", () => ctx.slots.register(
+    { name: "main", key: QUOTA_PANEL_ID, locale: NS },
+    QuotaPanel
+  )), "dsh-usage-dashboard: quota panel");
+  ctx.effect(() => {
+    let disposeEntry = null;
+    const sync = () => {
+      disposeEntry?.();
+      disposeEntry = null;
+      const placement = sidebarEntryStore.get();
+      if (placement === "top") {
+        disposeEntry = ctx.slots.inject("sidebar.panellist", () => ctx.slots.register(
+          { name: "sidebar.panellist", id: QUOTA_PANEL_ID, order: 1e3, label: () => t("nav.quota"), locale: NS },
+          QuotaGlyph
+        ));
+        return;
+      }
+      if (placement === "bottom") {
+        disposeEntry = ctx.slots.inject("sidebar.footer.action", () => ctx.slots.register(
+          { name: "sidebar.footer.action", id: "quota", order: 10, locale: NS },
+          QuotaFooterButton
+        ));
+        return;
+      }
+      if (ctx.layout.panelInfo.getSnapshot().activePanelId === QUOTA_PANEL_ID) ctx.layout.selectPanel(null);
+    };
+    sync();
+    const unsubscribe = sidebarEntryStore.subscribe(sync);
+    return () => {
+      unsubscribe();
+      disposeEntry?.();
+    };
+  }, "dsh-usage-dashboard: sidebar entry");
+  ctx.effect(() => {
+    let applied = false;
+    const sync = () => {
+      const root = document.querySelector(".dq-balance");
+      const should = quotaViewActiveStore.get() && root !== null && root.closest("[data-conversation-scroll]") !== null;
+      if (should === applied) return;
+      applied = should;
+      if (should) document.documentElement.setAttribute("data-dq-quota-view", "");
+      else document.documentElement.removeAttribute("data-dq-quota-view");
+    };
+    sync();
+    const unsubscribe = quotaViewActiveStore.subscribe(sync);
+    return () => {
+      unsubscribe();
+      if (applied) document.documentElement.removeAttribute("data-dq-quota-view");
+    };
+  }, "dsh-usage-dashboard: composer visibility");
 }
 return module.exports; } });
 //# sourceMappingURL=client.js.map