InfinityPacer · Oct 9, 2026 · Oct 9, 2026 · Oct 9, 2026
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,11 @@
 
 ## [未发布]
 
+## [0.9.8] - 2026-10-09
+
+- 桌面 Tokens 摘要的环比、每次请求和输出改为同一行排列，与缓存命中率图例的排法一致。
+- 窄屏趋势图下方的峰值小时改为「10/09 04时」格式，并按内容分配列宽，时间与数值不再折成两行。
+
 ## [0.9.7] - 2026-10-07
 
 - 七天额度预估改为本周期已花金额加上剩余部分的推算，用得越多越接近实际，用满时等于已花金额。

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "meterleaf",
-  "version": "0.9.7",
+  "version": "0.9.8",
   "private": true,
   "type": "module",
   "license": "Apache-2.0",

diff --git a/src/web/App.tsx b/src/web/App.tsx
@@ -1680,7 +1680,6 @@ export function App() {
                                           month: "2-digit",
                                           day: "2-digit",
                                           hour: "2-digit",
-                                          minute: "2-digit",
                                           hour12: false,
                                         }
                                       : { month: "2-digit", day: "2-digit" },

diff --git a/src/web/components/UsageSummary.tsx b/src/web/components/UsageSummary.tsx
@@ -161,26 +161,29 @@ export function UsageSummary({
         <div>
           <dt>Tokens</dt>
           <dd>{compact(data.tokens)}</dd>
-          <small>
+          {/* 附注与命中率图例同一排法：一行内依次排列，放不下时整项换行。 */}
+          <small className="summary-notes">
             {data.change ? (
               <Change value={data.change.tokens} />
             ) : data.dailyTokens !== null ? (
-              `日均 ${compact(data.dailyTokens)}`
+              <span>
+                日均 <b>{compact(data.dailyTokens)}</b>
+              </span>
             ) : null}
-          </small>
-          {data.tokens !== null &&
-            data.requests !== null &&
-            data.requests > 0 && (
-              <small>
-                {data.tokensIncomplete ? "每次请求已知" : "每次请求"}{" "}
-                {compact(data.tokens / data.requests)}
-              </small>
+            {data.tokens !== null &&
+              data.requests !== null &&
+              data.requests > 0 && (
+                <span>
+                  {data.tokensIncomplete ? "每次请求已知" : "每次请求"}{" "}
+                  <b>{compact(data.tokens / data.requests)}</b>
+                </span>
+              )}
+            {data.composition.output !== null && (
+              <span title="模型生成内容的 Tokens 总量，不是缓存读取量">
+                输出 <b>{compact(data.composition.output)}</b>
+              </span>
             )}
-          {data.composition.output !== null && (
-            <small title="模型生成内容的 Tokens 总量，不是缓存读取量">
-              输出 {compact(data.composition.output)}
-            </small>
-          )}
+          </small>
         </div>
         <div>
           <dt>费用</dt>

diff --git a/src/web/styles.css b/src/web/styles.css
@@ -2173,6 +2173,20 @@ button[data-size="icon-sm"],
   color: var(--muted);
   font-variant-numeric: tabular-nums;
 }
+/* Tokens 格的附注沿用命中率图例的排法：同一行排列，数值用次一级灰度。 */
+.usage-summary dl > div > .summary-notes {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 2px 12px;
+}
+.summary-notes > span {
+  white-space: nowrap;
+}
+.summary-notes b {
+  color: var(--muted);
+  font-weight: inherit;
+  font-variant-numeric: tabular-nums;
+}
 .summary-change {
   display: inline-flex;
   align-items: center;
@@ -2205,6 +2219,13 @@ button[data-size="icon-sm"],
   font-weight: 500;
   font-variant-numeric: tabular-nums;
 }
+/* 窄屏按内容分配列宽，峰值的时间与数值留在一行；实在放不下时才换行。 */
+@media (max-width: 900px) {
+  .trend-insights {
+    grid-template-columns: repeat(3, auto);
+    justify-content: space-between;
+  }
+}
 .account-menu-positioner {
   z-index: 80;
 }