diff --git a/AGENTS.md b/AGENTS.md
index eb25da2..28d33ba 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -436,8 +436,29 @@
 - 后端 `/api/account/model-overview` 仍保留 `priceModel` 和 `usesDefaultPrice` 字段，真实计费与未知模型沿用 `gpt-5.4` 的规则不变。
 - 记录见 `docs/ai/context/20260613-144235-account-model-overview-remove-pricing-column_CN.md`。
 
+## 2026-06-13 Shop B 级模块化重构设计
+
+- 用户确认采用 B 级重构：中等力度拆分 Shop 前端模块和后端纯逻辑，不做一次性 C 级路由 / SQL / 迁移深拆。
+- 当前本地运行网页会映射到公网；实现阶段不能在当前公网实例目录直接改业务代码，必须使用独立 worktree。
+- 开发验收实例使用独立端口，例如 `4174`，并使用独立 SQLite，例如 `data/dev/shop-refactor.sqlite`。
+- 开发实例必须禁用 usage 自动导入，避免写入真实账务库或读取 CLIProxyAPI usage 日志。
+- 后端优先抽 `shop-money`、价格版本回放、收银统计和模型总览纯逻辑；`server.js` 暂保留路由、SQL statement 和事务边界。
+- 前端保留 `/shop/shop.js` 作为入口，页面逻辑拆到 `shop/js/*`，并保持 `window.YuiShop` 对外初始化函数兼容。
+- 设计见 `docs/ai/context/20260613-144411-shop-modular-refactor-design_CN.md`；实施计划见 `docs/ai/context/20260613-144411-shop-modular-refactor-plan_CN.md`。
+
 ## 2026-06-13 Account 模型总览删除来源提示
 
 - `/shop/account/` 模型总览前端不再展示「价格表回退 / 实时模型，更新时间 ...」提示。
 - 后端 `/api/account/model-overview` 仍保留 `source` 和 `checkedAt` 字段，模型端点探测与价格表回退逻辑不变。
 - 记录见 `docs/ai/context/20260613-144458-account-model-overview-remove-source-hint_CN.md`。
+
+## 2026-06-13 Shop B 级模块化重构实施
+
+- Shop B 级模块化重构已在隔离 worktree `codex/shop-modular-refactor-20260613` 中实施，不影响当前公网映射实例。
+- 后端金额、历史价格回放、收银统计、周消费和模型总览纯逻辑已拆入 `lib/shop-money.js`、`lib/shop-pricing.js`、`lib/shop-billing-summary.js`、`lib/shop-model-overview.js`。
+- `server.js` 暂保留路由、SQL statement 和事务边界；后续不要把已抽出的纯逻辑再合回 `server.js`。
+- Shop 前端已拆为 `shop/js/core.js`、`charts.js`、`auth.js`、`account.js`、`admin.js`、`legacy-redirects.js`；`shop/shop.js` 只做入口和 `window.YuiShop` 兼容层。
+- 所有 Shop HTML 只直接加载 `/shop/shop.js` 入口，入口脚本会动态加载 `shop/js/*` 模块；后续新增 Shop 页面不要重复硬编码模块列表。
+- `test/shop-frontend.test.js` 承接前端 VM、HTML、CSS 静态断言；`test/shop-flow.test.js` 保留后端集成流程和数据库行为测试。
+- 独立验收实例使用 `http://127.0.0.1:4174` 和 `data/dev/shop-refactor.sqlite`，usage 自动导入关闭；后续涉及公网映射时继续使用独立 worktree、独立端口、独立 SQLite。
+- 实施记录见 `docs/ai/context/20260613-152130-shop-modular-refactor-implementation_CN.md`。
diff --git a/docs/ai/context/20260613-144411-shop-modular-refactor-design_CN.md b/docs/ai/context/20260613-144411-shop-modular-refactor-design_CN.md
new file mode 100644
index 0000000..67516c6
--- /dev/null
+++ b/docs/ai/context/20260613-144411-shop-modular-refactor-design_CN.md
@@ -0,0 +1,112 @@
+# Shop B 级模块化重构设计
+
+## 背景
+
+用户希望检查个人主页项目中的冗余，重点是 `/shop/` 页面和后端逻辑，并选择 B 级重构：中等力度拆分，不做一次性大迁移。
+
+当前本地运行的网页会映射到公网。如果直接在当前工作区修改静态文件，运行中的 Express 静态服务可能在不重启的情况下读到半成品 `shop/shop.js` 或 HTML。因此实现阶段必须使用独立 worktree 和独立开发服务，不在当前公网实例所在目录改业务代码。
+
+## 调查结果
+
+- `server.js` 约 3891 行，混合数据库迁移、SQL statement、认证、CSRF、余额、扣费、usage 导入、Admin 接口、内部接口和 Shop 页面守卫。
+- `shop/shop.js` 约 1672 行，混合通用格式化、请求封装、图表渲染、Auth、Account、Admin、旧页面跳转等逻辑。
+- `test/shop-flow.test.js` 约 4357 行，既包含后端集成测试，也包含大量前端 VM 和 HTML 静态断言。
+- `renderCustomerSpendingBars` 和 `renderAccountWeeklySpendingChart` 重复实现三段堆叠柱。
+- `nanosToBalanceCents`、`nonNegativeInteger`、历史价格版本回放分散在 `server.js`、`lib/shop-pricing.js`、`lib/shop-usage-reconcile.js` 和测试中。
+- 多个 Shop HTML 页面重复 head、字体、主题预初始化、header 和 `shop/shop.js` 引用。
+- 基线验证：`npm test` 在当前工作区通过，142 个测试全部通过。
+
+## 目标
+
+- 降低 Shop 前后端核心文件体积和职责混杂程度。
+- 保持所有外部 API 路径、请求体、响应体和页面 DOM id 兼容。
+- 保持账务、扣费、余额、CSRF、安全响应头、内部 API key 状态接口行为不变。
+- 开发验证使用独立端口和独立 SQLite，避免影响当前公网映射实例。
+- 不在本阶段做 C 级深拆：不把全部 SQL statement、所有路由和数据库迁移一次性搬离 `server.js`。
+
+## 方案取舍
+
+推荐方案 B：
+
+- 后端先抽纯函数和低耦合逻辑：
+  - `lib/shop-money.js`：金额、nanos、cents、CNY 和整数归一。
+  - `lib/shop-pricing.js`：当前价格、模型价格、历史 `price_version` 回放。
+  - `lib/shop-billing-summary.js`：收银构成、用户消费排行、周消费统计。
+  - `lib/shop-model-overview.js`：模型列表解析、模型价格展示 DTO。
+- 前端保留一个入口 `shop/shop.js`，把页面和渲染逻辑拆到 `shop/js/`：
+  - `shop/js/core.js`
+  - `shop/js/charts.js`
+  - `shop/js/auth.js`
+  - `shop/js/account.js`
+  - `shop/js/admin.js`
+  - `shop/js/legacy-redirects.js`
+- 浏览器仍只需要加载 `/shop/shop.js`；入口脚本负责加载子模块并按路径初始化页面，避免每个 Shop HTML 都追加多段重复 `<script>`。
+- 测试拆分一部分前端 VM / HTML 断言到独立测试文件，避免继续膨胀 `test/shop-flow.test.js`。
+
+不选方案 A：只抽少量纯函数风险最低，但无法实质解决 `shop/shop.js` 和图表重复。
+
+不选方案 C：直接拆路由、SQL、迁移和仓储层收益更大，但账务和安全边界牵动太广，当前更适合先用 B 级重构建立模块边界。
+
+## 开发隔离
+
+实现阶段必须先创建独立 worktree，例如：
+
+```bash
+git worktree add .worktrees/shop-modular-refactor-20260613 -b codex/shop-modular-refactor-20260613
+```
+
+开发服务使用独立端口和独立数据库，例如：
+
+```bash
+PORT=4174 node -e "const path=require('node:path'); const { createShopApp }=require('./server'); const { app, usageImporter }=createShopApp({ dbPath: path.join(process.cwd(), 'data/dev/shop-refactor.sqlite'), usageAutoImportEnabled: false, usageAutoImportStartTimer: false }); const server=app.listen(4174, '127.0.0.1', () => console.log('dev shop http://127.0.0.1:4174')); process.on('SIGINT', () => { usageImporter.stop(); server.close(() => process.exit(0)); });"
+```
+
+约束：
+
+- 不使用当前 `data/shop.sqlite`。
+- 不开启 usage 自动导入定时器。
+- 不在当前公网实例目录改业务代码。
+- 本地验收地址固定为 `http://127.0.0.1:4174`，除非端口已占用。
+
+## 模块边界
+
+### 后端
+
+- `server.js` 保留 Express app 组装、路由注册、SQL statement 所在闭包和数据库事务。
+- 金额转换、价格回放、收银统计、模型总览 DTO 必须从 `lib/` 导入。
+- 账务事实字段继续使用 nanos；旧 cents 字段只做兼容展示。
+- 历史价格回放不能丢失：
+  - `deepseek-v4-pro-rmb-20260424`
+  - `deepseek-v4-pro-rmb-20260612-cache-hit-10x`
+  - `deepseek-v4-pro-rmb-20260612-output-20rmb`
+  - `gpt-5.4-rmb-20260613`
+  - `gpt-5.5-rmb-20260613`
+- 未知 `price_version` 回退当前默认 `gpt-5.4` 价格。
+
+### 前端
+
+- `shop/js/core.js` 只提供基础工具：手机号、密码强度、日期、金额、数字、HTML escape、cookie、`requestJson`、DOM ready。
+- `shop/js/charts.js` 只负责收银饼图和堆叠柱，Account 周消费和 Admin 用户消费排行共用一个堆叠柱函数。
+- `shop/js/auth.js` 只负责登录、注册、重置密码、重置码输入归一。
+- `shop/js/account.js` 只负责账户页、兑换、余额、充值、模型总览、扣费流水、周消费。
+- `shop/js/admin.js` 只负责 Admin 业务办理、余额、充值审核、邀请码、usage 监控、日志导入。
+- `shop/js/legacy-redirects.js` 只负责旧页面跳转。
+- `shop/shop.js` 只负责加载模块、按路径分发初始化、对外兼容 `window.YuiShop`。
+
+## 测试策略
+
+- TDD 顺序：先写失败测试，再拆模块。
+- 纯函数优先单元测试，减少只靠大集成测试兜底。
+- 每次后端抽取后跑对应 `lib/*.test.js` 和相关 `test/shop-flow.test.js --test-name-pattern`。
+- 前端拆分后用 VM 加载所有 `shop/js/*.js` 和 `shop/shop.js`，确保 `window.YuiShop` 对外 API 不变。
+- 最终验证：
+  - `npm test`
+  - `npm run build:css`
+  - 独立端口 `http://127.0.0.1:4174` 浏览器检查登录页、账户页、Admin 页关键区域。
+
+## 风险与控制
+
+- 风险：动态加载前端模块导致页面初始化时序变化。控制：入口脚本暴露 `window.YuiShopReady`，测试等待该 Promise，页面初始化只在模块加载完成后执行。
+- 风险：价格回放迁移导致历史 Admin 收银构成变化。控制：新增单元测试覆盖旧 DeepSeek 和 GPT 价格版本。
+- 风险：开发实例写入生产库。控制：开发命令显式传入 `data/dev/shop-refactor.sqlite`，并禁用 usage 自动导入。
+- 风险：当前工作区已有未提交改动。控制：实现阶段使用独立 worktree；当前目录只记录设计和计划。
diff --git a/docs/ai/context/20260613-144411-shop-modular-refactor-plan_CN.md b/docs/ai/context/20260613-144411-shop-modular-refactor-plan_CN.md
new file mode 100644
index 0000000..8b3ef53
--- /dev/null
+++ b/docs/ai/context/20260613-144411-shop-modular-refactor-plan_CN.md
@@ -0,0 +1,779 @@
+# Shop B 级模块化重构 Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** 将 Shop 前后端从胖文件拆成中等粒度模块，并使用独立端口和独立数据库验证，不影响当前公网映射实例。
+
+**Architecture:** 后端只先抽纯函数和低耦合服务，`server.js` 保留路由、SQL statement 和事务边界。前端保留 `/shop/shop.js` 作为入口，新增 `shop/js/*` 全局模块，由入口加载并按页面路径初始化。测试先锁住金额、价格、收银统计、模型总览和前端入口兼容性，再执行拆分。
+
+**Tech Stack:** Node.js、Express、better-sqlite3、原生浏览器脚本、node:test、Tailwind CSS。
+
+---
+
+## 文件结构
+
+- Create: `lib/shop-money.js`
+  - 金额与整数工具：`nonNegativeInteger`、`parsePositiveCnyToCents`、`centsToCny`、`centsToNanos`、`signedCentsToNanos`、`nanosToCny`、`nanosToBalanceCents`。
+- Modify: `lib/shop-pricing.js`
+  - 继续提供当前模型价格，新增 `priceForVersion(version)`，统一历史价格回放。
+- Create: `lib/shop-billing-summary.js`
+  - 提供 `buildBillingSummary(chargeRows, ranges, options)`、`buildWeeklySpending(chargeRows, now)`。
+- Create: `lib/shop-model-overview.js`
+  - 提供 `normalizeModelList(body)`、`modelPriceOverview(modelId, available)`、`pricingFallbackModelOverview()`。
+- Modify: `server.js`
+  - 从新模块导入纯函数；删除本地重复金额、价格回放、收银统计、模型 DTO 函数。
+- Modify: `lib/shop-usage-reconcile.js`
+  - 复用 `lib/shop-money.js`。
+- Create: `shop/js/core.js`
+  - 提供 `window.YuiShopCore`。
+- Create: `shop/js/charts.js`
+  - 提供 `window.YuiShopCharts`。
+- Create: `shop/js/auth.js`
+  - 提供 `window.YuiShopAuth`。
+- Create: `shop/js/account.js`
+  - 提供 `window.YuiShopAccount`。
+- Create: `shop/js/admin.js`
+  - 提供 `window.YuiShopAdmin`。
+- Create: `shop/js/legacy-redirects.js`
+  - 提供 `window.YuiShopLegacyRedirects`。
+- Modify: `shop/shop.js`
+  - 入口脚本：加载模块、暴露 `window.YuiShopReady` 和兼容的 `window.YuiShop`。
+- Modify: `test/shop-flow.test.js`
+  - 保留后端集成测试，更新前端脚本加载 helper。
+- Create: `test/shop-frontend.test.js`
+  - 承接前端 VM 和静态 HTML 结构测试。
+- Create: `lib/shop-money.test.js`
+  - 金额工具单元测试。
+- Create: `lib/shop-billing-summary.test.js`
+  - 收银与周消费纯函数测试。
+- Create: `lib/shop-model-overview.test.js`
+  - 模型总览纯函数测试。
+- Modify: `AGENTS.md`
+  - 记录 B 级重构边界、开发隔离要求和不能共用生产库。
+
+---
+
+### Task 0: 隔离工作区与基线
+
+**Files:**
+- No code changes in current public-mapped workspace.
+- Worktree target: `/Users/wujianxiang/CodeSpace/yui.web/.worktrees/shop-modular-refactor-20260613`
+
+- [ ] **Step 1: 确认当前目录不是 linked worktree**
+
+Run:
+
+```bash
+GIT_DIR=$(cd "$(git rev-parse --git-dir)" && pwd -P)
+GIT_COMMON=$(cd "$(git rev-parse --git-common-dir)" && pwd -P)
+printf '%s\n%s\n' "$GIT_DIR" "$GIT_COMMON"
+git rev-parse --show-superproject-working-tree 2>/dev/null || true
+```
+
+Expected: `GIT_DIR` 与 `GIT_COMMON` 相同，且不是 submodule。
+
+- [ ] **Step 2: 创建隔离 worktree**
+
+Run:
+
+```bash
+git worktree add .worktrees/shop-modular-refactor-20260613 -b codex/shop-modular-refactor-20260613
+cd .worktrees/shop-modular-refactor-20260613
+```
+
+Expected: 创建并进入新分支 `codex/shop-modular-refactor-20260613`。
+
+- [ ] **Step 3: 安装依赖并跑基线**
+
+Run:
+
+```bash
+npm install
+npm test
+```
+
+Expected: `npm test` 通过，测试数不少于当前基线 142。
+
+---
+
+### Task 1: 抽出金额与历史价格回放
+
+**Files:**
+- Create: `lib/shop-money.js`
+- Create: `lib/shop-money.test.js`
+- Modify: `lib/shop-pricing.js`
+- Modify: `lib/shop-pricing.test.js`
+- Modify: `lib/shop-usage-reconcile.js`
+- Modify: `server.js`
+
+- [ ] **Step 1: 写失败测试**
+
+Add `lib/shop-money.test.js`:
+
+```javascript
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const {
+    centsToCny,
+    centsToNanos,
+    nanosToBalanceCents,
+    nanosToCny,
+    nonNegativeInteger,
+    parsePositiveCnyToCents,
+    signedCentsToNanos
+} = require('./shop-money');
+
+test('金额工具统一处理 cents、nanos 和人民币展示', () => {
+    assert.equal(nonNegativeInteger('12.9'), 12);
+    assert.equal(nonNegativeInteger(-1), 0);
+    assert.equal(parsePositiveCnyToCents('12.34'), 1234);
+    assert.equal(centsToCny(1234), 12.34);
+    assert.equal(centsToNanos(123), 1230000000);
+    assert.equal(signedCentsToNanos(-123), -1230000000);
+    assert.equal(nanosToCny(1500000000), 1.5);
+    assert.equal(nanosToBalanceCents(19999999), 1);
+    assert.equal(nanosToBalanceCents(-19999999), -2);
+});
+```
+
+Extend `lib/shop-pricing.test.js`:
+
+```javascript
+test('历史价格版本由 pricing 模块统一回放', () => {
+    const { priceForVersion } = require('./shop-pricing');
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260424').cacheHitInputNanosPerToken, 25);
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260612-cache-hit-10x').outputNanosPerToken, 6000);
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260612-output-20rmb').outputNanosPerToken, 20000);
+    assert.equal(priceForVersion('gpt-5.4-rmb-20260613').cacheMissInputNanosPerToken, 2500);
+    assert.equal(priceForVersion('gpt-5.5-rmb-20260613').outputNanosPerToken, 30000);
+    assert.equal(priceForVersion('unknown-version').model, 'gpt-5.4');
+});
+```
+
+- [ ] **Step 2: 验证测试失败**
+
+Run:
+
+```bash
+node --test lib/shop-money.test.js lib/shop-pricing.test.js
+```
+
+Expected: `Cannot find module './shop-money'` 或 `priceForVersion is not a function`。
+
+- [ ] **Step 3: 实现最小模块**
+
+Create `lib/shop-money.js` with exported functions copied from existing semantics in `server.js` and `lib/shop-usage-reconcile.js`.
+
+Modify `lib/shop-pricing.js`:
+
+```javascript
+function priceForVersion(version) {
+    if (version === 'deepseek-v4-pro-rmb-20260424') {
+        return {
+            model: 'deepseek-v4-pro',
+            version,
+            cacheHitInputNanosPerToken: 25,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 6000
+        };
+    }
+    if (version === 'deepseek-v4-pro-rmb-20260612-cache-hit-10x') {
+        return {
+            model: 'deepseek-v4-pro',
+            version,
+            cacheHitInputNanosPerToken: 250,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 6000
+        };
+    }
+    if (version === 'deepseek-v4-pro-rmb-20260612-output-20rmb') {
+        return {
+            model: 'deepseek-v4-pro',
+            version,
+            cacheHitInputNanosPerToken: 250,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 20000
+        };
+    }
+    return Object.values(gptModelRmbPrices).find((price) => price.version === version) || currentDefaultRmbPrice;
+}
+```
+
+Then replace local duplicate imports in `server.js` and `lib/shop-usage-reconcile.js`.
+
+- [ ] **Step 4: 验证通过**
+
+Run:
+
+```bash
+node --test lib/shop-money.test.js lib/shop-pricing.test.js test/shop-usage-reconcile.test.js
+```
+
+Expected: all pass.
+
+---
+
+### Task 2: 抽出收银统计和周消费
+
+**Files:**
+- Create: `lib/shop-billing-summary.js`
+- Create: `lib/shop-billing-summary.test.js`
+- Modify: `server.js`
+
+- [ ] **Step 1: 写失败测试**
+
+Create `lib/shop-billing-summary.test.js`:
+
+```javascript
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const { buildBillingSummary, buildWeeklySpending } = require('./shop-billing-summary');
+
+test('收银统计按 price_version 拆分今日和本月构成', () => {
+    const rows = [
+        {
+            phone: '13800138001',
+            status: 'charged',
+            created_at: '2026-06-13T10:00:00+08:00',
+            charge_nanos: 17750000000,
+            cache_hit_input_tokens: 1000000,
+            cache_miss_input_tokens: 1000000,
+            output_tokens: 1000000,
+            price_version: 'gpt-5.4-rmb-20260613'
+        },
+        {
+            phone: '13800138002',
+            status: 'charged',
+            created_at: '2026-06-12T10:00:00+08:00',
+            charge_nanos: 6025000000,
+            cache_hit_input_tokens: 1000000,
+            cache_miss_input_tokens: 1000000,
+            output_tokens: 1000000,
+            price_version: 'deepseek-v4-pro-rmb-20260424'
+        }
+    ];
+    const summary = buildBillingSummary(rows, {
+        todayStart: new Date('2026-06-13T00:00:00+08:00'),
+        monthStart: new Date('2026-06-01T00:00:00+08:00')
+    });
+    assert.equal(summary.todayChargeNanos, 17750000000);
+    assert.equal(summary.monthChargeNanos, 23775000000);
+    assert.equal(summary.todayRevenueParts.find((part) => part.key === 'output').chargeNanos, 15000000000);
+    assert.equal(summary.monthRevenueParts.find((part) => part.key === 'cache_hit_input').chargeNanos, 275000000);
+    assert.equal(summary.customerSpendingRankings.month[0].phone, '13800138001');
+});
+
+test('周消费统计按中国周一到周日生成 7 天桶', () => {
+    const weekly = buildWeeklySpending([
+        {
+            status: 'charged',
+            created_at: '2026-06-10T10:00:00+08:00',
+            charge_nanos: 15000000000,
+            cache_hit_input_tokens: 0,
+            cache_miss_input_tokens: 0,
+            output_tokens: 1000000,
+            price_version: 'gpt-5.4-rmb-20260613'
+        }
+    ], new Date('2026-06-13T12:00:00+08:00'));
+    const current = weekly.weeks[weekly.currentWeekStart];
+    assert.equal(current.days.length, 7);
+    assert.equal(current.days.some((day) => day.chargeNanos === 15000000000), true);
+});
+```
+
+- [ ] **Step 2: 验证测试失败**
+
+Run:
+
+```bash
+node --test lib/shop-billing-summary.test.js
+```
+
+Expected: `Cannot find module './shop-billing-summary'`。
+
+- [ ] **Step 3: 实现模块并替换 server.js 内部重复函数**
+
+Move these pure functions from `server.js` to `lib/shop-billing-summary.js`:
+
+- `emptyBillingStats`
+- `emptyCustomerSpending`
+- `addCustomerSpending`
+- `addBillingStats`
+- `revenueParts`
+- `chinaDateKeyToDayStart`
+- `chinaDateLabel`
+- `addSpendingPartCharges`
+- `emptyDailySpending`
+- `publicDailySpending`
+- `createWeeklySpendingBucket`
+- `publicWeeklySpendingBucket`
+- `buildWeeklySpending`
+- `customerSpendingParts`
+- `customerSpendingRanking`
+- `billingStatsToPublic`
+- `buildBillingSummary`
+
+Import in `server.js`:
+
+```javascript
+const { buildBillingSummary, buildWeeklySpending } = require('./lib/shop-billing-summary');
+```
+
+Keep `startOfChinaDay` and `startOfChinaMonth` in `server.js` for request ranges.
+
+- [ ] **Step 4: 验证后端收银相关行为**
+
+Run:
+
+```bash
+node --test lib/shop-billing-summary.test.js test/shop-flow.test.js --test-name-pattern "usage summary|收银构成|用户消费排行|周扣费"
+```
+
+Expected: all pass.
+
+---
+
+### Task 3: 抽出模型总览纯逻辑
+
+**Files:**
+- Create: `lib/shop-model-overview.js`
+- Create: `lib/shop-model-overview.test.js`
+- Modify: `server.js`
+
+- [ ] **Step 1: 写失败测试**
+
+Create `lib/shop-model-overview.test.js`:
+
+```javascript
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const {
+    modelPriceOverview,
+    normalizeModelList,
+    pricingFallbackModelOverview
+} = require('./shop-model-overview');
+
+test('模型列表支持 OpenAI data 和通用 models 结构并去重', () => {
+    assert.deepEqual(normalizeModelList({
+        data: [{ id: 'gpt-5.4' }, { model: 'gpt-5.4' }, { name: 'gpt-5.5' }]
+    }), ['gpt-5.4', 'gpt-5.5']);
+});
+
+test('模型价格展示未知模型沿用 gpt-5.4', () => {
+    const overview = modelPriceOverview('gpt-5.4-mini', true);
+    assert.equal(overview.available, true);
+    assert.equal(overview.priceModel, 'gpt-5.4');
+    assert.equal(overview.usesDefaultPrice, true);
+    assert.equal(overview.cacheMissInputCnyPerMillion, 2.5);
+});
+
+test('价格表 fallback 至少包含 gpt-5.4 和 gpt-5.5', () => {
+    const ids = pricingFallbackModelOverview().map((model) => model.id);
+    assert.deepEqual(ids, ['gpt-5.4', 'gpt-5.5']);
+});
+```
+
+- [ ] **Step 2: 验证测试失败**
+
+Run:
+
+```bash
+node --test lib/shop-model-overview.test.js
+```
+
+Expected: `Cannot find module './shop-model-overview'`。
+
+- [ ] **Step 3: 实现并替换 server.js 内部函数**
+
+Move from `server.js`:
+
+- `cnyPerMillionTokens`
+- `modelPriceOverview`
+- `pricingFallbackModelOverview`
+- `normalizeModelList`
+
+Keep `fetchModelIds` and `accountModelOverview` in `server.js`, because they depend on app options and order SQL.
+
+- [ ] **Step 4: 验证模型总览接口**
+
+Run:
+
+```bash
+node --test lib/shop-model-overview.test.js test/shop-flow.test.js --test-name-pattern "模型总览"
+```
+
+Expected: all pass.
+
+---
+
+### Task 4: 抽出前端 core 和 charts
+
+**Files:**
+- Create: `shop/js/core.js`
+- Create: `shop/js/charts.js`
+- Modify: `shop/shop.js`
+- Modify: `test/shop-flow.test.js`
+- Create: `test/shop-frontend.test.js`
+
+- [ ] **Step 1: 写失败测试**
+
+Create a helper in `test/shop-frontend.test.js`:
+
+```javascript
+const assert = require('node:assert/strict');
+const fs = require('node:fs');
+const path = require('node:path');
+const test = require('node:test');
+const vm = require('node:vm');
+
+function loadShopScripts(sandbox) {
+    for (const file of [
+        'shop/js/core.js',
+        'shop/js/charts.js',
+        'shop/js/auth.js',
+        'shop/js/account.js',
+        'shop/js/admin.js',
+        'shop/js/legacy-redirects.js',
+        'shop/shop.js'
+    ]) {
+        vm.runInNewContext(fs.readFileSync(path.join(__dirname, '..', file), 'utf8'), sandbox, { filename: file });
+    }
+}
+
+test('前端图表模块复用同一个堆叠柱渲染入口', () => {
+    const sandbox = { window: {}, document: { readyState: 'loading', addEventListener() {} }, Intl, URL };
+    sandbox.window.document = sandbox.document;
+    vm.runInNewContext(fs.readFileSync(path.join(__dirname, '..', 'shop/js/core.js'), 'utf8'), sandbox);
+    vm.runInNewContext(fs.readFileSync(path.join(__dirname, '..', 'shop/js/charts.js'), 'utf8'), sandbox);
+    assert.equal(typeof sandbox.window.YuiShopCharts.renderStackedChargeBars, 'function');
+    const html = sandbox.window.YuiShopCharts.renderStackedChargeBars({
+        items: [{ label: '6/13', chargeNanos: 15000000000, parts: [{ key: 'output', label: '输出 token', chargeNanos: 15000000000 }] }],
+        emptyText: '暂无记录'
+    });
+    assert.match(html, /admin-revenue-bar-stack/);
+    assert.match(html, /输出 token/);
+});
+```
+
+- [ ] **Step 2: 验证测试失败**
+
+Run:
+
+```bash
+node --test test/shop-frontend.test.js --test-name-pattern "堆叠柱"
+```
+
+Expected: `ENOENT` for `shop/js/core.js` or missing `renderStackedChargeBars`。
+
+- [ ] **Step 3: 实现 core 和 charts**
+
+Move these functions from `shop/shop.js` to `shop/js/core.js`:
+
+- `isPhone`
+- `bindPhoneInput`
+- `isStrongPassword`
+- `formatDate`
+- `formatPrice`
+- `formatCents`
+- `formatNanos`
+- `formatNumber`
+- `formatCompactNumber`
+- `escapeHtml`
+- `readCookie`
+- `requestJson`
+- `runWhenDomReady`
+
+Move chart functions to `shop/js/charts.js` and extract shared:
+
+- `renderStackedChargeBars`
+- `renderRevenuePieChart`
+- `renderCustomerSpendingBars`
+- `renderAccountWeeklySpendingChart`
+- `renderAdminRevenueCharts`
+- `renderBars`
+
+Expose globals:
+
+```javascript
+window.YuiShopCore = {
+    bindPhoneInput,
+    escapeHtml,
+    formatCents,
+    formatCompactNumber,
+    formatDate,
+    formatNanos,
+    formatNumber,
+    formatPrice,
+    isPhone,
+    isStrongPassword,
+    readCookie,
+    requestJson,
+    runWhenDomReady
+};
+window.YuiShopCharts = { renderStackedChargeBars, renderAdminRevenueCharts, renderAccountWeeklySpendingChart, renderBars };
+```
+
+- [ ] **Step 4: 验证前端图表测试**
+
+Run:
+
+```bash
+node --test test/shop-frontend.test.js --test-name-pattern "堆叠柱"
+```
+
+Expected: pass.
+
+---
+
+### Task 5: 拆 Auth、Account、Admin 和入口
+
+**Files:**
+- Create: `shop/js/auth.js`
+- Create: `shop/js/account.js`
+- Create: `shop/js/admin.js`
+- Create: `shop/js/legacy-redirects.js`
+- Modify: `shop/shop.js`
+- Modify: `test/shop-flow.test.js`
+- Modify: `test/shop-frontend.test.js`
+
+- [ ] **Step 1: 写失败测试**
+
+Add to `test/shop-frontend.test.js`:
+
+```javascript
+test('Shop 入口加载页面模块后仍暴露兼容的 YuiShop 初始化函数', async () => {
+    const elements = new Map();
+    const sandbox = {
+        window: { location: { pathname: '/shop/login/', replace() {} } },
+        document: {
+            cookie: '',
+            readyState: 'complete',
+            createElement: () => ({ set src(value) { this._src = value; }, get src() { return this._src; }, onload: null, onerror: null }),
+            head: { appendChild(node) { node.onload?.(); } },
+            querySelectorAll: () => [],
+            getElementById: (id) => elements.get(id) || null,
+            addEventListener() {}
+        },
+        fetch: async () => ({ ok: true, json: async () => ({}) }),
+        Intl,
+        URL
+    };
+    sandbox.window.document = sandbox.document;
+    loadShopScripts(sandbox);
+    await sandbox.window.YuiShopReady;
+    assert.equal(typeof sandbox.window.YuiShop.initLoginPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initAccountPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initAdminPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initOrderPage, 'function');
+});
+```
+
+- [ ] **Step 2: 验证测试失败**
+
+Run:
+
+```bash
+node --test test/shop-frontend.test.js --test-name-pattern "入口加载页面模块"
+```
+
+Expected: missing module files or missing `YuiShopReady`。
+
+- [ ] **Step 3: 拆页面模块**
+
+Move from `shop/shop.js`:
+
+- Auth to `shop/js/auth.js`:
+  - `normalizeResetCodeInput`
+  - `initResetPasswordPage`
+  - `initLoginPage`
+  - `initRegisterPage`
+- Account to `shop/js/account.js`:
+  - `statusText`
+  - `statusClass`
+  - `billingStatusText`
+  - `topupStatusText`
+  - `ledgerEntryText`
+  - `chargeStatusText`
+  - `renderOrderCard`
+  - `bindCopy`
+  - `renderBillingUsageCards`
+  - `renderBalanceCards`
+  - `formatModelPrice`
+  - `renderAccountModelOverview`
+  - `renderTopups`
+  - `renderCharges`
+  - `renderLedger`
+  - `initRedeemPage`
+  - `initKeyPage`
+  - `initQueryPage`
+  - `initAccountPage`
+  - `initAccountLinks`
+- Admin to `shop/js/admin.js`:
+  - `renderAdminBalanceSummary`
+  - `renderAdminTopups`
+  - `renderAdminBalanceTable`
+  - `renderInviteConsoleSummary`
+  - `renderAdminInviteTable`
+  - `renderAdminApiKeyPoolTable`
+  - `renderAdminRecentCharges`
+  - `usageStatusText`
+  - `usageGroupText`
+  - `renderUsageSummary`
+  - `renderUsageItems`
+  - `initAdminUsagePage`
+  - `initCollapsibleSections`
+  - `initAdminPasswordResetPage`
+  - `initAdminAccountBalancesPage`
+  - `initAdminTopupPage`
+  - `initAdminInvitePage`
+  - `initAdminPage`
+- Legacy to `shop/js/legacy-redirects.js`:
+  - order/pay/result/content redirects.
+
+Thin `shop/shop.js` responsibilities:
+
+```javascript
+(function() {
+    const moduleSources = [
+        '/shop/js/core.js',
+        '/shop/js/charts.js',
+        '/shop/js/auth.js',
+        '/shop/js/account.js',
+        '/shop/js/admin.js',
+        '/shop/js/legacy-redirects.js'
+    ];
+    // load modules once, then build pageInitializers from window.YuiShop* globals.
+})();
+```
+
+Preserve public API names currently exposed on `window.YuiShop`.
+
+- [ ] **Step 4: 更新前端 VM helper**
+
+In `test/shop-flow.test.js`, replace helpers that only load `shop/shop.js` with a helper that loads all module files in order.
+
+Keep existing assertions:
+
+- `requestJson` 自动加 CSRF。
+- Account 页加载模型总览。
+- Account 兑换调用登录态接口且不提交手机号。
+- 栏目折叠按钮可初始化。
+
+- [ ] **Step 5: 验证前端测试**
+
+Run:
+
+```bash
+node --test test/shop-frontend.test.js test/shop-flow.test.js --test-name-pattern "requestJson|Account 前端|Shop 外部脚本|入口加载页面模块|堆叠柱"
+```
+
+Expected: all pass.
+
+---
+
+### Task 6: 拆分测试文件，控制 shop-flow 继续膨胀
+
+**Files:**
+- Modify: `test/shop-flow.test.js`
+- Modify: `test/shop-frontend.test.js`
+
+- [ ] **Step 1: 移动纯前端和静态 HTML 测试**
+
+Move tests whose bodies only read `shop/*.html`、`shop/shop.js` 或 VM 执行前端脚本 into `test/shop-frontend.test.js`。
+
+Keep in `test/shop-flow.test.js` tests that start Express server or inspect SQLite behavior.
+
+- [ ] **Step 2: 验证测试文件拆分没有丢用例**
+
+Run:
+
+```bash
+npm test
+```
+
+Expected: all pass, test count not lower than before this task.
+
+---
+
+### Task 7: 独立端口开发验收
+
+**Files:**
+- No code changes.
+
+- [ ] **Step 1: 构建 CSS**
+
+Run:
+
+```bash
+npm run build:css
+```
+
+Expected: exit 0.
+
+- [ ] **Step 2: 启动独立开发实例**
+
+Run from isolated worktree:
+
+```bash
+PORT=4174 node -e "const path=require('node:path'); const { createShopApp }=require('./server'); const { app, usageImporter }=createShopApp({ dbPath: path.join(process.cwd(), 'data/dev/shop-refactor.sqlite'), usageAutoImportEnabled: false, usageAutoImportStartTimer: false }); const server=app.listen(4174, '127.0.0.1', () => console.log('dev shop http://127.0.0.1:4174')); process.on('SIGINT', () => { usageImporter.stop(); server.close(() => process.exit(0)); });"
+```
+
+Expected: console prints `dev shop http://127.0.0.1:4174`。
+
+- [ ] **Step 3: 浏览器检查**
+
+Open `http://127.0.0.1:4174/shop/login/` in the in-app Browser.
+
+Check:
+
+- 登录页未空白。
+- 注册页和重置密码页加载。
+- 未登录访问 `/shop/account/` 跳到 `/shop/login/`。
+- Admin 页面未登录跳登录。
+- 浏览器 console 无模块加载错误。
+
+- [ ] **Step 4: 停止开发实例**
+
+Send `Ctrl-C` to the server session.
+
+Expected: process exits and no background session remains.
+
+---
+
+### Task 8: 文档和最终验证
+
+**Files:**
+- Create: `docs/ai/context/YYYYMMDD-HHMMSS-shop-modular-refactor-implementation_CN.md`
+- Modify: `AGENTS.md`
+
+- [ ] **Step 1: 写实施记录**
+
+Document:
+
+- 实际拆出的文件。
+- 开发实例端口和数据库路径。
+- 未改变的外部 API。
+- 测试命令和结果。
+- 如果有未完成拆分，说明原因和后续边界。
+
+- [ ] **Step 2: 更新 AGENTS.md 项目记忆**
+
+Append concise memory:
+
+- Shop 前端已拆为 `shop/js/*`，`shop/shop.js` 只做入口。
+- 后端金额、价格回放、收银统计、模型总览纯逻辑已进入 `lib/*`。
+- 后续 Shop 开发涉及公网映射时必须使用独立 worktree、独立端口、独立 SQLite。
+
+- [ ] **Step 3: 最终验证**
+
+Run:
+
+```bash
+npm test
+npm run build:css
+```
+
+Expected: both exit 0.
diff --git a/docs/ai/context/20260613-152130-shop-modular-refactor-implementation_CN.md b/docs/ai/context/20260613-152130-shop-modular-refactor-implementation_CN.md
new file mode 100644
index 0000000..972e39f
--- /dev/null
+++ b/docs/ai/context/20260613-152130-shop-modular-refactor-implementation_CN.md
@@ -0,0 +1,76 @@
+# Shop B 级模块化重构实施记录
+
+## 背景
+
+用户确认采用 B 级重构，目标是减少个人主页 Shop 页面和后端逻辑的冗余，同时不影响当前映射到公网的本地实例。
+
+本次实施在隔离 worktree 中完成：
+
+- worktree：`/Users/wujianxiang/CodeSpace/yui.web/.worktrees/shop-modular-refactor-20260613`
+- 分支：`codex/shop-modular-refactor-20260613`
+- 开发端口：`http://127.0.0.1:4174`
+- 开发数据库：`data/dev/shop-refactor.sqlite`
+- usage 自动导入：关闭
+
+## 后端拆分
+
+- 新增 `lib/shop-money.js`，统一 cents、nanos、CNY 和非负整数处理。
+- `lib/shop-usage-reconcile.js` 复用 `shop-money`，避免补账脚本和服务端金额逻辑分叉。
+- `lib/shop-pricing.js` 新增 `priceForVersion(version)`，统一历史价格版本回放。
+- 新增 `lib/shop-billing-summary.js`，承接 Admin 收银构成、用户消费排行和 Account 周消费统计。
+- 新增 `lib/shop-model-overview.js`，承接模型列表归一化和模型价格总览 DTO。
+- `server.js` 保留 Express 组装、路由、SQL statement 和事务边界，不在本次做 C 级路由 / 仓储层深拆。
+
+## 前端拆分
+
+- 新增 `shop/js/core.js`：手机号、密码强度、格式化、cookie、`requestJson`、DOM ready 等通用工具。
+- 新增 `shop/js/charts.js`：收银饼图、三段堆叠柱、Account 周消费图和 Admin 收银图表。
+- 新增 `shop/js/auth.js`：登录、注册、重置密码和重置码输入归一。
+- 新增 `shop/js/account.js`：Account、兑换、余额、充值、模型总览、扣费流水。
+- 新增 `shop/js/admin.js`：Admin 业务办理、用户余额、充值审核、邀请码、usage 监控、日志导入。
+- 新增 `shop/js/legacy-redirects.js`：旧购买 / 支付 / 结果 / 内容页面跳转。
+- `shop/shop.js` 缩减为入口和兼容层，继续暴露 `window.YuiShopReady` 与 `window.YuiShop`。
+- 所有引用 `/shop/shop.js` 的 Shop HTML 只直接加载入口脚本；入口脚本负责按顺序动态加载 `shop/js/*` 模块，避免每个页面重复硬编码模块列表。
+
+## 测试拆分
+
+- 新增 `lib/shop-money.test.js`、`lib/shop-billing-summary.test.js`、`lib/shop-model-overview.test.js`。
+- 新增 `test/shop-frontend.test.js`，承接前端 VM、HTML、CSS 静态断言。
+- `test/shop-flow.test.js` 保留服务端集成流程和数据库行为测试；30 个纯前端 / 静态断言已迁入 `test/shop-frontend.test.js`。
+
+## 浏览器验收
+
+独立实例使用以下命令启动：
+
+```bash
+ADMIN_TOKEN=<DEV_ADMIN_TOKEN> INTERNAL_TOKEN=<DEV_INTERNAL_TOKEN> PORT=4174 node -e "const path=require('node:path'); const { createShopApp }=require('./server'); const { app, usageImporter }=createShopApp({ dbPath: path.join(process.cwd(), 'data/dev/shop-refactor.sqlite'), usageAutoImportEnabled: false, usageAutoImportStartTimer: false }); const server=app.listen(4174, '127.0.0.1', () => console.log('dev shop http://127.0.0.1:4174')); process.on('SIGINT', () => { usageImporter.stop(); server.close(() => process.exit(0)); });"
+```
+
+浏览器检查结果：
+
+- `/shop/login/` 加载正常，Shop 模块脚本 200 返回，控制台无 error / warning。
+- 登录页手机号输入会裁剪为数字，使用有效手机号和错误密码提交后显示“手机号或密码错误。”。
+- `/shop/register/` 手机号输入会裁剪为数字，弱密码由 JS 显示校验提示。
+- `/shop/reset-password/` 手机号输入会裁剪为数字，重置码输入会归一为大写无空格，弱密码由 JS 显示校验提示。
+- 未登录访问 `/shop/account/` 和 `/shop/admin/` 都跳转到 `/shop/login/`。
+
+前一轮浏览器“消息为空”的原因是测试输入了无效手机号，浏览器原生 `pattern` / `minlength` 校验拦截了提交，submit handler 没有触发；不是模块脚本未执行。
+
+## 追加清理
+
+继续复查时发现：`shop/shop.js` 已具备动态模块加载能力，但 12 个 Shop HTML 仍重复硬编码 6 个 `shop/js/*` 模块脚本。已删除这些重复标签，只保留各页原有 `/shop/shop.js` 入口脚本，并新增测试确认入口脚本会自动加载模块。
+
+## 验证结果
+
+- `node --test test/shop-frontend.test.js test/shop-flow.test.js`：128 个测试通过。
+- `npm test`：155 个测试通过。
+- `npm run build:css`：退出码 0，仅有 Browserslist 过期提示。
+
+测试输出中的 `sendFile` 404 stack 来自既有“公网静态服务不能下载 SQLite 数据库或 AI 上下文”安全测试，测试本身通过。
+
+## 后续边界
+
+- 后续 Shop 前端改动优先进入 `shop/js/*` 对应模块，不要把页面逻辑重新堆回 `shop/shop.js`。
+- 后续新增 Shop 页面只引用 `/shop/shop.js` 入口，不要再在 HTML 里重复写 `shop/js/*` 模块列表。
+- 后续后端金额、价格回放、收银统计和模型总览纯逻辑优先进入 `lib/*`，`server.js` 只保留路由和事务边界。
+- 涉及当前公网映射实例时，继续使用独立 worktree、独立端口和独立 SQLite；不要直接在公网实例目录里做半成品修改。
diff --git a/lib/shop-billing-summary.js b/lib/shop-billing-summary.js
new file mode 100644
index 0000000..b2df7b5
--- /dev/null
+++ b/lib/shop-billing-summary.js
@@ -0,0 +1,362 @@
+const {
+    currentDefaultRmbPrice,
+    priceForVersion
+} = require('./shop-pricing');
+const {
+    nanosToCny,
+    nonNegativeInteger
+} = require('./shop-money');
+
+const chinaOffsetMs = 8 * 60 * 60 * 1000;
+
+function emptyBillingStats() {
+    return {
+        todayChargeNanos: 0,
+        monthChargeNanos: 0,
+        todayCacheHitInputTokens: 0,
+        todayCacheMissInputTokens: 0,
+        todayOutputTokens: 0,
+        todayCacheHitInputChargeNanos: 0,
+        todayCacheMissInputChargeNanos: 0,
+        todayOutputChargeNanos: 0,
+        cacheHitInputTokens: 0,
+        cacheMissInputTokens: 0,
+        outputTokens: 0,
+        cacheHitInputChargeNanos: 0,
+        cacheMissInputChargeNanos: 0,
+        outputChargeNanos: 0,
+        todayCustomerSpendingByPhone: new Map(),
+        monthCustomerSpendingByPhone: new Map()
+    };
+}
+
+function emptyCustomerSpending() {
+    return {
+        chargeNanos: 0,
+        cacheHitInputChargeNanos: 0,
+        cacheMissInputChargeNanos: 0,
+        outputChargeNanos: 0
+    };
+}
+
+function addCustomerSpending(target, phone, charges) {
+    const normalizedPhone = String(phone || '').trim();
+    if (!normalizedPhone) return;
+    const current = target.get(normalizedPhone) || emptyCustomerSpending();
+    target.set(normalizedPhone, {
+        chargeNanos: current.chargeNanos + nonNegativeInteger(charges.chargeNanos),
+        cacheHitInputChargeNanos: current.cacheHitInputChargeNanos + nonNegativeInteger(charges.cacheHitInputChargeNanos),
+        cacheMissInputChargeNanos: current.cacheMissInputChargeNanos + nonNegativeInteger(charges.cacheMissInputChargeNanos),
+        outputChargeNanos: current.outputChargeNanos + nonNegativeInteger(charges.outputChargeNanos)
+    });
+}
+
+function addBillingStats(stats, row, ranges) {
+    if (row.status !== 'charged') return;
+    const createdAt = new Date(row.created_at);
+    if (!Number.isFinite(createdAt.getTime())) return;
+    const chargeNanos = nonNegativeInteger(row.charge_nanos);
+    const cacheHitInputTokens = nonNegativeInteger(row.cache_hit_input_tokens);
+    const cacheMissInputTokens = nonNegativeInteger(row.cache_miss_input_tokens);
+    const outputTokens = nonNegativeInteger(row.output_tokens);
+    const price = priceForVersion(row.price_version);
+    const cacheHitInputChargeNanos = cacheHitInputTokens * price.cacheHitInputNanosPerToken;
+    const cacheMissInputChargeNanos = cacheMissInputTokens * price.cacheMissInputNanosPerToken;
+    const outputChargeNanos = outputTokens * price.outputNanosPerToken;
+    if (createdAt >= ranges.todayStart) {
+        stats.todayChargeNanos += chargeNanos;
+        stats.todayCacheHitInputTokens += cacheHitInputTokens;
+        stats.todayCacheMissInputTokens += cacheMissInputTokens;
+        stats.todayOutputTokens += outputTokens;
+        stats.todayCacheHitInputChargeNanos += cacheHitInputChargeNanos;
+        stats.todayCacheMissInputChargeNanos += cacheMissInputChargeNanos;
+        stats.todayOutputChargeNanos += outputChargeNanos;
+        addCustomerSpending(stats.todayCustomerSpendingByPhone, row.phone, {
+            chargeNanos,
+            cacheHitInputChargeNanos,
+            cacheMissInputChargeNanos,
+            outputChargeNanos
+        });
+    }
+    if (createdAt >= ranges.monthStart) {
+        stats.monthChargeNanos += chargeNanos;
+        stats.cacheHitInputTokens += cacheHitInputTokens;
+        stats.cacheMissInputTokens += cacheMissInputTokens;
+        stats.outputTokens += outputTokens;
+        stats.cacheHitInputChargeNanos += cacheHitInputChargeNanos;
+        stats.cacheMissInputChargeNanos += cacheMissInputChargeNanos;
+        stats.outputChargeNanos += outputChargeNanos;
+        addCustomerSpending(stats.monthCustomerSpendingByPhone, row.phone, {
+            chargeNanos,
+            cacheHitInputChargeNanos,
+            cacheMissInputChargeNanos,
+            outputChargeNanos
+        });
+    }
+}
+
+function revenueParts(cacheHitInputTokens, cacheHitInputChargeNanos, cacheMissInputTokens, cacheMissInputChargeNanos, outputTokens, outputChargeNanos) {
+    const parts = [
+        {
+            key: 'cache_hit_input',
+            label: '缓存命中输入',
+            tokens: nonNegativeInteger(cacheHitInputTokens),
+            chargeNanos: nonNegativeInteger(cacheHitInputChargeNanos)
+        },
+        {
+            key: 'cache_miss_input',
+            label: '缓存未命中输入',
+            tokens: nonNegativeInteger(cacheMissInputTokens),
+            chargeNanos: nonNegativeInteger(cacheMissInputChargeNanos)
+        },
+        {
+            key: 'output',
+            label: '输出 token',
+            tokens: nonNegativeInteger(outputTokens),
+            chargeNanos: nonNegativeInteger(outputChargeNanos)
+        }
+    ];
+    return parts.map((part) => ({
+        ...part,
+        chargeAmount: nanosToCny(part.chargeNanos)
+    }));
+}
+
+function chinaParts(date) {
+    const value = new Date(date);
+    const shifted = new Date(value.getTime() + chinaOffsetMs);
+    return {
+        year: shifted.getUTCFullYear(),
+        month: shifted.getUTCMonth() + 1,
+        day: shifted.getUTCDate()
+    };
+}
+
+function pad2(value) {
+    return String(value).padStart(2, '0');
+}
+
+function chinaDateKey(date) {
+    const parts = chinaParts(date);
+    return `${parts.year}-${pad2(parts.month)}-${pad2(parts.day)}`;
+}
+
+function startOfChinaDay(date) {
+    const parts = chinaParts(date);
+    return new Date(Date.UTC(parts.year, parts.month - 1, parts.day) - chinaOffsetMs);
+}
+
+function startOfChinaWeek(date) {
+    const dayStart = startOfChinaDay(date);
+    const chinaDay = new Date(dayStart.getTime() + chinaOffsetMs).getUTCDay();
+    const mondayOffset = chinaDay === 0 ? 6 : chinaDay - 1;
+    return new Date(dayStart.getTime() - mondayOffset * 24 * 60 * 60 * 1000);
+}
+
+function chinaDateKeyToDayStart(dateKey) {
+    const [year, month, day] = String(dateKey || '').split('-').map(Number);
+    return new Date(Date.UTC(year, month - 1, day) - chinaOffsetMs);
+}
+
+function chinaDateLabel(dateKey) {
+    const [, month, day] = String(dateKey || '').split('-').map(Number);
+    return `${month}/${day}`;
+}
+
+function addSpendingPartCharges(target, row) {
+    const cacheHitInputTokens = nonNegativeInteger(row.cache_hit_input_tokens);
+    const cacheMissInputTokens = nonNegativeInteger(row.cache_miss_input_tokens);
+    const outputTokens = nonNegativeInteger(row.output_tokens);
+    const price = priceForVersion(row.price_version);
+    target.chargeNanos += nonNegativeInteger(row.charge_nanos);
+    target.cacheHitInputTokens += cacheHitInputTokens;
+    target.cacheMissInputTokens += cacheMissInputTokens;
+    target.outputTokens += outputTokens;
+    target.cacheHitInputChargeNanos += cacheHitInputTokens * price.cacheHitInputNanosPerToken;
+    target.cacheMissInputChargeNanos += cacheMissInputTokens * price.cacheMissInputNanosPerToken;
+    target.outputChargeNanos += outputTokens * price.outputNanosPerToken;
+}
+
+function emptyDailySpending(dateKey) {
+    return {
+        date: dateKey,
+        label: chinaDateLabel(dateKey),
+        chargeNanos: 0,
+        cacheHitInputTokens: 0,
+        cacheMissInputTokens: 0,
+        outputTokens: 0,
+        cacheHitInputChargeNanos: 0,
+        cacheMissInputChargeNanos: 0,
+        outputChargeNanos: 0
+    };
+}
+
+function publicDailySpending(day) {
+    return {
+        date: day.date,
+        label: day.label,
+        chargeNanos: nonNegativeInteger(day.chargeNanos),
+        chargeAmount: nanosToCny(day.chargeNanos),
+        parts: revenueParts(
+            day.cacheHitInputTokens,
+            day.cacheHitInputChargeNanos,
+            day.cacheMissInputTokens,
+            day.cacheMissInputChargeNanos,
+            day.outputTokens,
+            day.outputChargeNanos
+        )
+    };
+}
+
+function createWeeklySpendingBucket(weekStartKey) {
+    const weekStart = chinaDateKeyToDayStart(weekStartKey);
+    const dayMap = new Map();
+    const days = Array.from({ length: 7 }, (_, index) => {
+        const dateKey = chinaDateKey(new Date(weekStart.getTime() + index * 24 * 60 * 60 * 1000));
+        const day = emptyDailySpending(dateKey);
+        dayMap.set(dateKey, day);
+        return day;
+    });
+    return {
+        weekStart: weekStartKey,
+        weekEnd: days[6]?.date || weekStartKey,
+        dayMap,
+        days
+    };
+}
+
+function publicWeeklySpendingBucket(week) {
+    const days = week.days.map(publicDailySpending);
+    const totalChargeNanos = days.reduce((sum, day) => sum + nonNegativeInteger(day.chargeNanos), 0);
+    return {
+        weekStart: week.weekStart,
+        weekEnd: week.weekEnd,
+        label: `${chinaDateLabel(week.weekStart)}-${chinaDateLabel(week.weekEnd)}`,
+        totalChargeNanos,
+        totalChargeAmount: nanosToCny(totalChargeNanos),
+        days
+    };
+}
+
+function buildWeeklySpending(chargeRows, now) {
+    const currentWeekStart = chinaDateKey(startOfChinaWeek(now));
+    const weeksByStart = new Map();
+    const ensureWeek = (weekStartKey) => {
+        if (!weeksByStart.has(weekStartKey)) {
+            weeksByStart.set(weekStartKey, createWeeklySpendingBucket(weekStartKey));
+        }
+        return weeksByStart.get(weekStartKey);
+    };
+    ensureWeek(currentWeekStart);
+
+    for (const row of chargeRows) {
+        if (row.status !== 'charged') continue;
+        const createdAt = new Date(row.created_at);
+        if (!Number.isFinite(createdAt.getTime())) continue;
+        const weekStartKey = chinaDateKey(startOfChinaWeek(createdAt));
+        const dayKey = chinaDateKey(createdAt);
+        const week = ensureWeek(weekStartKey);
+        const day = week.dayMap.get(dayKey);
+        if (!day) continue;
+        addSpendingPartCharges(day, row);
+    }
+
+    const weekStarts = Array.from(weeksByStart.keys()).sort();
+    const weeks = {};
+    for (const weekStart of weekStarts) {
+        weeks[weekStart] = publicWeeklySpendingBucket(weeksByStart.get(weekStart));
+    }
+    return {
+        currentWeekStart,
+        weekStarts,
+        weeks
+    };
+}
+
+function customerSpendingParts(spending) {
+    return [
+        {
+            key: 'cache_hit_input',
+            label: '缓存命中输入',
+            chargeNanos: nonNegativeInteger(spending.cacheHitInputChargeNanos)
+        },
+        {
+            key: 'cache_miss_input',
+            label: '缓存未命中输入',
+            chargeNanos: nonNegativeInteger(spending.cacheMissInputChargeNanos)
+        },
+        {
+            key: 'output',
+            label: '输出 token',
+            chargeNanos: nonNegativeInteger(spending.outputChargeNanos)
+        }
+    ].map((part) => ({
+        ...part,
+        chargeAmount: nanosToCny(part.chargeNanos)
+    }));
+}
+
+function customerSpendingRanking(spendingByPhone) {
+    return Array.from(spendingByPhone.entries())
+        .map(([phone, spending]) => ({
+            phone,
+            chargeNanos: nonNegativeInteger(spending.chargeNanos),
+            chargeAmount: nanosToCny(spending.chargeNanos),
+            parts: customerSpendingParts(spending)
+        }))
+        .sort((left, right) => {
+            if (right.chargeNanos !== left.chargeNanos) return right.chargeNanos - left.chargeNanos;
+            return left.phone.localeCompare(right.phone);
+        });
+}
+
+function billingStatsToPublic(stats, chargeRows, options = {}) {
+    const publicChargeRecord = options.publicChargeRecord || ((row) => row);
+    return {
+        priceVersion: currentDefaultRmbPrice.version,
+        todayChargeNanos: stats.todayChargeNanos,
+        todayChargeAmount: nanosToCny(stats.todayChargeNanos),
+        monthChargeNanos: stats.monthChargeNanos,
+        monthChargeAmount: nanosToCny(stats.monthChargeNanos),
+        todayCacheHitInputTokens: stats.todayCacheHitInputTokens,
+        todayCacheMissInputTokens: stats.todayCacheMissInputTokens,
+        todayOutputTokens: stats.todayOutputTokens,
+        cacheHitInputTokens: stats.cacheHitInputTokens,
+        cacheMissInputTokens: stats.cacheMissInputTokens,
+        outputTokens: stats.outputTokens,
+        todayRevenueParts: revenueParts(
+            stats.todayCacheHitInputTokens,
+            stats.todayCacheHitInputChargeNanos,
+            stats.todayCacheMissInputTokens,
+            stats.todayCacheMissInputChargeNanos,
+            stats.todayOutputTokens,
+            stats.todayOutputChargeNanos
+        ),
+        monthRevenueParts: revenueParts(
+            stats.cacheHitInputTokens,
+            stats.cacheHitInputChargeNanos,
+            stats.cacheMissInputTokens,
+            stats.cacheMissInputChargeNanos,
+            stats.outputTokens,
+            stats.outputChargeNanos
+        ),
+        customerSpendingRankings: {
+            today: customerSpendingRanking(stats.todayCustomerSpendingByPhone),
+            month: customerSpendingRanking(stats.monthCustomerSpendingByPhone)
+        },
+        recentCharges: chargeRows.slice(0, 10).map(publicChargeRecord)
+    };
+}
+
+function buildBillingSummary(chargeRows, ranges, options = {}) {
+    const stats = emptyBillingStats();
+    for (const row of chargeRows) {
+        addBillingStats(stats, row, ranges);
+    }
+    return billingStatsToPublic(stats, chargeRows, options);
+}
+
+module.exports = {
+    buildBillingSummary,
+    buildWeeklySpending
+};
diff --git a/lib/shop-billing-summary.test.js b/lib/shop-billing-summary.test.js
new file mode 100644
index 0000000..53fedb3
--- /dev/null
+++ b/lib/shop-billing-summary.test.js
@@ -0,0 +1,79 @@
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const { buildBillingSummary, buildWeeklySpending } = require('./shop-billing-summary');
+
+test('收银统计按 price_version 拆分今日和本月构成', () => {
+    const rows = [
+        {
+            id: 'charge-gpt',
+            phone: '13800138001',
+            status: 'charged',
+            created_at: '2026-06-13T10:00:00+08:00',
+            charge_nanos: 17750000000,
+            cache_hit_input_tokens: 1000000,
+            cache_miss_input_tokens: 1000000,
+            output_tokens: 1000000,
+            price_version: 'gpt-5.4-rmb-20260613'
+        },
+        {
+            id: 'charge-old',
+            phone: '13800138002',
+            status: 'charged',
+            created_at: '2026-06-12T10:00:00+08:00',
+            charge_nanos: 6025000000,
+            cache_hit_input_tokens: 1000000,
+            cache_miss_input_tokens: 1000000,
+            output_tokens: 1000000,
+            price_version: 'deepseek-v4-pro-rmb-20260424'
+        },
+        {
+            id: 'charge-failed',
+            phone: '13800138003',
+            status: 'failed_no_charge',
+            created_at: '2026-06-13T11:00:00+08:00',
+            charge_nanos: 999,
+            cache_hit_input_tokens: 999,
+            cache_miss_input_tokens: 999,
+            output_tokens: 999,
+            price_version: 'gpt-5.5-rmb-20260613'
+        }
+    ];
+
+    const summary = buildBillingSummary(rows, {
+        todayStart: new Date('2026-06-13T00:00:00+08:00'),
+        monthStart: new Date('2026-06-01T00:00:00+08:00')
+    }, {
+        publicChargeRecord: (row) => ({ id: row.id, phone: row.phone })
+    });
+
+    assert.equal(summary.todayChargeNanos, 17750000000);
+    assert.equal(summary.monthChargeNanos, 23775000000);
+    assert.equal(summary.todayRevenueParts.find((part) => part.key === 'output').chargeNanos, 15000000000);
+    assert.equal(summary.monthRevenueParts.find((part) => part.key === 'cache_hit_input').chargeNanos, 275000000);
+    assert.equal(summary.customerSpendingRankings.month[0].phone, '13800138001');
+    assert.deepEqual(summary.recentCharges.slice(0, 2), [
+        { id: 'charge-gpt', phone: '13800138001' },
+        { id: 'charge-old', phone: '13800138002' }
+    ]);
+});
+
+test('周消费统计按中国周一到周日生成 7 天桶', () => {
+    const weekly = buildWeeklySpending([
+        {
+            status: 'charged',
+            created_at: '2026-06-10T10:00:00+08:00',
+            charge_nanos: 15000000000,
+            cache_hit_input_tokens: 0,
+            cache_miss_input_tokens: 0,
+            output_tokens: 1000000,
+            price_version: 'gpt-5.4-rmb-20260613'
+        }
+    ], new Date('2026-06-13T12:00:00+08:00'));
+
+    const current = weekly.weeks[weekly.currentWeekStart];
+    assert.equal(weekly.currentWeekStart, '2026-06-08');
+    assert.equal(current.weekEnd, '2026-06-14');
+    assert.equal(current.days.length, 7);
+    assert.equal(current.days.some((day) => day.date === '2026-06-10' && day.chargeNanos === 15000000000), true);
+});
diff --git a/lib/shop-model-overview.js b/lib/shop-model-overview.js
new file mode 100644
index 0000000..1a7679b
--- /dev/null
+++ b/lib/shop-model-overview.js
@@ -0,0 +1,53 @@
+const {
+    gptModelRmbPrices,
+    priceForModel
+} = require('./shop-pricing');
+const { nanosPerYuan } = require('./shop-money');
+
+function cnyPerMillionTokens(nanosPerToken) {
+    return Number(nanosPerToken || 0) * 1000000 / nanosPerYuan;
+}
+
+function modelPriceOverview(modelId, available) {
+    const id = String(modelId || '').trim();
+    const normalizedId = id.toLowerCase();
+    const price = priceForModel(normalizedId);
+    return {
+        id,
+        available: Boolean(available),
+        priceModel: price.model,
+        usesDefaultPrice: normalizedId !== price.model,
+        priceVersion: price.version,
+        cacheHitInputCnyPerMillion: cnyPerMillionTokens(price.cacheHitInputNanosPerToken),
+        cacheMissInputCnyPerMillion: cnyPerMillionTokens(price.cacheMissInputNanosPerToken),
+        outputCnyPerMillion: cnyPerMillionTokens(price.outputNanosPerToken)
+    };
+}
+
+function pricingFallbackModelOverview() {
+    return Object.keys(gptModelRmbPrices).map((model) => modelPriceOverview(model, false));
+}
+
+function normalizeModelList(body = {}) {
+    const source = Array.isArray(body.data)
+        ? body.data
+        : Array.isArray(body.models)
+            ? body.models
+            : [];
+    const seen = new Set();
+    const models = [];
+    for (const item of source) {
+        const id = String(item?.id || item?.model || item?.name || '').trim();
+        if (!id || seen.has(id)) continue;
+        seen.add(id);
+        models.push(id);
+    }
+    return models;
+}
+
+module.exports = {
+    cnyPerMillionTokens,
+    modelPriceOverview,
+    normalizeModelList,
+    pricingFallbackModelOverview
+};
diff --git a/lib/shop-model-overview.test.js b/lib/shop-model-overview.test.js
new file mode 100644
index 0000000..e1c6c3c
--- /dev/null
+++ b/lib/shop-model-overview.test.js
@@ -0,0 +1,56 @@
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const {
+    modelPriceOverview,
+    normalizeModelList,
+    pricingFallbackModelOverview
+} = require('./shop-model-overview');
+
+test('模型列表归一化支持 data/models 并按 id 去重', () => {
+    assert.deepEqual(normalizeModelList({
+        data: [
+            { id: 'gpt-5.4' },
+            { model: 'gpt-5.4-mini' },
+            { name: 'gpt-5.4' },
+            { id: '' },
+            {}
+        ]
+    }), ['gpt-5.4', 'gpt-5.4-mini']);
+
+    assert.deepEqual(normalizeModelList({
+        models: [
+            { name: 'gpt-5.5' },
+            { id: 'gpt-5.5-mini' }
+        ]
+    }), ['gpt-5.5', 'gpt-5.5-mini']);
+});
+
+test('模型价格总览保留真实模型 id 并用归一化 id 匹配价格', () => {
+    assert.deepEqual(modelPriceOverview('GPT-5.5', true), {
+        id: 'GPT-5.5',
+        available: true,
+        priceModel: 'gpt-5.5',
+        usesDefaultPrice: false,
+        priceVersion: 'gpt-5.5-rmb-20260613',
+        cacheHitInputCnyPerMillion: 0.5,
+        cacheMissInputCnyPerMillion: 5,
+        outputCnyPerMillion: 30
+    });
+
+    const unknown = modelPriceOverview('gpt-5.4-mini', true);
+    assert.equal(unknown.id, 'gpt-5.4-mini');
+    assert.equal(unknown.available, true);
+    assert.equal(unknown.priceModel, 'gpt-5.4');
+    assert.equal(unknown.usesDefaultPrice, true);
+    assert.equal(unknown.priceVersion, 'gpt-5.4-rmb-20260613');
+    assert.equal(unknown.cacheMissInputCnyPerMillion, 2.5);
+});
+
+test('价格表 fallback 返回所有已知 GPT 模型且标记为不可用', () => {
+    const models = pricingFallbackModelOverview();
+
+    assert.deepEqual(models.map((model) => model.id), ['gpt-5.4', 'gpt-5.5']);
+    assert.deepEqual(models.map((model) => model.available), [false, false]);
+    assert.equal(models[0].usesDefaultPrice, false);
+});
diff --git a/lib/shop-money.js b/lib/shop-money.js
new file mode 100644
index 0000000..6f1c847
--- /dev/null
+++ b/lib/shop-money.js
@@ -0,0 +1,69 @@
+const nanosPerYuan = 1000000000;
+const nanosPerCent = 10000000;
+
+function nonNegativeInteger(value) {
+    const number = Number(value);
+    if (!Number.isFinite(number) || number < 0) return 0;
+    return Math.floor(number);
+}
+
+function parsePositiveCnyToCents(value) {
+    const text = String(value ?? '').trim();
+    if (!/^\d+(?:\.\d{1,2})?$/.test(text)) {
+        const error = new Error('金额必须是大于 0 的人民币数字，最多保留两位小数。');
+        error.status = 400;
+        error.code = 'INVALID_AMOUNT';
+        throw error;
+    }
+    const [yuanPart, centPart = ''] = text.split('.');
+    const cents = Number(yuanPart) * 100 + Number(centPart.padEnd(2, '0'));
+    if (!Number.isSafeInteger(cents) || cents <= 0) {
+        const error = new Error('金额必须大于 0。');
+        error.status = 400;
+        error.code = 'INVALID_AMOUNT';
+        throw error;
+    }
+    return cents;
+}
+
+function centsToCny(cents) {
+    return Number(cents || 0) / 100;
+}
+
+function centsToNanos(cents) {
+    return nonNegativeInteger(cents) * nanosPerCent;
+}
+
+function signedCentsToNanos(cents) {
+    const value = Number(cents || 0);
+    if (!Number.isSafeInteger(value)) return 0;
+    return value * nanosPerCent;
+}
+
+function nanosToCny(nanos) {
+    return Number(nanos || 0) / nanosPerYuan;
+}
+
+function nanosToBalanceCents(nanos) {
+    const value = Number(nanos || 0);
+    if (value >= 0) return Math.floor(value / nanosPerCent);
+    return -Math.ceil(Math.abs(value) / nanosPerCent);
+}
+
+function chargeNanosToCents(nanos) {
+    const value = nonNegativeInteger(nanos);
+    return value <= 0 ? 0 : Math.ceil(value / nanosPerCent);
+}
+
+module.exports = {
+    centsToCny,
+    centsToNanos,
+    chargeNanosToCents,
+    nanosPerCent,
+    nanosPerYuan,
+    nanosToBalanceCents,
+    nanosToCny,
+    nonNegativeInteger,
+    parsePositiveCnyToCents,
+    signedCentsToNanos
+};
diff --git a/lib/shop-money.test.js b/lib/shop-money.test.js
new file mode 100644
index 0000000..525bfd5
--- /dev/null
+++ b/lib/shop-money.test.js
@@ -0,0 +1,29 @@
+const assert = require('node:assert/strict');
+const test = require('node:test');
+
+const {
+    centsToCny,
+    centsToNanos,
+    nanosToBalanceCents,
+    nanosToCny,
+    nonNegativeInteger,
+    parsePositiveCnyToCents,
+    signedCentsToNanos
+} = require('./shop-money');
+
+test('金额工具统一处理 cents、nanos 和人民币展示', () => {
+    assert.equal(nonNegativeInteger('12.9'), 12);
+    assert.equal(nonNegativeInteger(-1), 0);
+    assert.equal(parsePositiveCnyToCents('12.34'), 1234);
+    assert.equal(centsToCny(1234), 12.34);
+    assert.equal(centsToNanos(123), 1230000000);
+    assert.equal(signedCentsToNanos(-123), -1230000000);
+    assert.equal(nanosToCny(1500000000), 1.5);
+    assert.equal(nanosToBalanceCents(19999999), 1);
+    assert.equal(nanosToBalanceCents(-19999999), -2);
+});
+
+test('人民币金额解析拒绝非正数和超过两位小数', () => {
+    assert.throws(() => parsePositiveCnyToCents('0'), /金额必须大于 0/);
+    assert.throws(() => parsePositiveCnyToCents('1.234'), /金额必须是大于 0 的人民币数字/);
+});
diff --git a/lib/shop-pricing.js b/lib/shop-pricing.js
index 66dda13..42d4118 100644
--- a/lib/shop-pricing.js
+++ b/lib/shop-pricing.js
@@ -1,4 +1,7 @@
-const nanosPerCent = 10000000;
+const {
+    chargeNanosToCents,
+    nonNegativeInteger
+} = require('./shop-money');
 
 const defaultGptModel = 'gpt-5.4';
 
@@ -23,17 +26,6 @@ const currentDefaultRmbPrice = gptModelRmbPrices[defaultGptModel];
 // 兼容旧导入名，实际当前默认价格已切到 GPT 5.4。
 const deepseekProRmbPrice = currentDefaultRmbPrice;
 
-function nonNegativeInteger(value) {
-    const number = Number(value);
-    if (!Number.isFinite(number) || number < 0) return 0;
-    return Math.floor(number);
-}
-
-function chargeNanosToCents(nanos) {
-    const value = nonNegativeInteger(nanos);
-    return value <= 0 ? 0 : Math.ceil(value / nanosPerCent);
-}
-
 function deriveInputTokenBreakdown(tokens = {}) {
     let inputTokens = nonNegativeInteger(tokens.inputTokens ?? tokens.input_tokens);
     let cachedTokens = nonNegativeInteger(tokens.cachedTokens ?? tokens.cached_tokens);
@@ -61,6 +53,38 @@ function priceForModel(model) {
     return gptModelRmbPrices[normalizedModel] || gptModelRmbPrices[defaultGptModel];
 }
 
+function priceForVersion(version) {
+    const normalizedVersion = String(version || '').trim();
+    if (normalizedVersion === 'deepseek-v4-pro-rmb-20260424') {
+        return {
+            model: 'deepseek-v4-pro',
+            version: normalizedVersion,
+            cacheHitInputNanosPerToken: 25,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 6000
+        };
+    }
+    if (normalizedVersion === 'deepseek-v4-pro-rmb-20260612-cache-hit-10x') {
+        return {
+            model: 'deepseek-v4-pro',
+            version: normalizedVersion,
+            cacheHitInputNanosPerToken: 250,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 6000
+        };
+    }
+    if (normalizedVersion === 'deepseek-v4-pro-rmb-20260612-output-20rmb') {
+        return {
+            model: 'deepseek-v4-pro',
+            version: normalizedVersion,
+            cacheHitInputNanosPerToken: 250,
+            cacheMissInputNanosPerToken: 3000,
+            outputNanosPerToken: 20000
+        };
+    }
+    return Object.values(gptModelRmbPrices).find((price) => price.version === normalizedVersion) || currentDefaultRmbPrice;
+}
+
 function priceUsageTokens(event = {}) {
     if (event.failed) {
         return {
@@ -93,5 +117,6 @@ module.exports = {
     deriveInputTokenBreakdown,
     gptModelRmbPrices,
     priceForModel,
+    priceForVersion,
     priceUsageTokens
 };
diff --git a/lib/shop-pricing.test.js b/lib/shop-pricing.test.js
index fc7b8d3..f3b56d9 100644
--- a/lib/shop-pricing.test.js
+++ b/lib/shop-pricing.test.js
@@ -4,6 +4,7 @@ const test = require('node:test');
 const {
     chargeNanosToCents,
     deriveInputTokenBreakdown,
+    priceForVersion,
     priceUsageTokens
 } = require('./shop-pricing');
 
@@ -89,3 +90,12 @@ test('nanos 转 cents 对正数向上取整，对 0 保持 0', () => {
     assert.equal(chargeNanosToCents(10000000), 1);
     assert.equal(chargeNanosToCents(10000001), 2);
 });
+
+test('历史价格版本由 pricing 模块统一回放', () => {
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260424').cacheHitInputNanosPerToken, 25);
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260612-cache-hit-10x').outputNanosPerToken, 6000);
+    assert.equal(priceForVersion('deepseek-v4-pro-rmb-20260612-output-20rmb').outputNanosPerToken, 20000);
+    assert.equal(priceForVersion('gpt-5.4-rmb-20260613').cacheMissInputNanosPerToken, 2500);
+    assert.equal(priceForVersion('gpt-5.5-rmb-20260613').outputNanosPerToken, 30000);
+    assert.equal(priceForVersion('unknown-version').model, 'gpt-5.4');
+});
diff --git a/lib/shop-usage-reconcile.js b/lib/shop-usage-reconcile.js
index a6d9664..d775056 100644
--- a/lib/shop-usage-reconcile.js
+++ b/lib/shop-usage-reconcile.js
@@ -1,16 +1,9 @@
 const crypto = require('node:crypto');
 
 const { appendShopChargeAuditLog } = require('./shop-charge-audit-log');
+const { nanosToBalanceCents } = require('./shop-money');
 const { deriveInputTokenBreakdown, priceUsageTokens } = require('./shop-pricing');
 
-const nanosPerCent = 10000000;
-
-function nanosToBalanceCents(nanos) {
-    const value = Number(nanos || 0);
-    if (value >= 0) return Math.floor(value / nanosPerCent);
-    return -Math.ceil(Math.abs(value) / nanosPerCent);
-}
-
 function reconcileRecordId(prefix, requestId) {
     return `${prefix}${crypto.createHash('sha256').update(String(requestId || '')).digest('hex').slice(0, 24)}`;
 }
diff --git a/server.js b/server.js
index aa71476..32d0bee 100644
--- a/server.js
+++ b/server.js
@@ -14,12 +14,24 @@ const {
 } = require('./lib/shop-api-key-crypto');
 const {
     chargeNanosToCents,
-    currentDefaultRmbPrice,
     deriveInputTokenBreakdown,
-    gptModelRmbPrices,
-    priceForModel,
     priceUsageTokens
 } = require('./lib/shop-pricing');
+const { buildBillingSummary, buildWeeklySpending } = require('./lib/shop-billing-summary');
+const {
+    modelPriceOverview,
+    normalizeModelList,
+    pricingFallbackModelOverview
+} = require('./lib/shop-model-overview');
+const {
+    centsToCny,
+    centsToNanos,
+    nanosToBalanceCents,
+    nanosToCny,
+    nonNegativeInteger,
+    parsePositiveCnyToCents,
+    signedCentsToNanos
+} = require('./lib/shop-money');
 const { appendShopChargeAuditLog } = require('./lib/shop-charge-audit-log');
 
 const durationDays = 31;
@@ -39,8 +51,6 @@ const authPhoneFailureBuckets = new Map();
 const chinaOffsetMs = 8 * 60 * 60 * 1000;
 const defaultAdminAccountPhone = '15951875192';
 const defaultCreditLimitCents = 1000;
-const nanosPerYuan = 1000000000;
-const nanosPerCent = 10000000;
 const supportedPaymentMethods = new Set(['alipay', 'wechat']);
 
 function assertStrongSecret(name, value, { required = true, production = false } = {}) {
@@ -196,55 +206,6 @@ function safeEqual(a, b) {
     return crypto.timingSafeEqual(left, right);
 }
 
-function nonNegativeInteger(value) {
-    const number = Number(value);
-    if (!Number.isFinite(number) || number < 0) return 0;
-    return Math.floor(number);
-}
-
-function parsePositiveCnyToCents(value) {
-    const text = String(value ?? '').trim();
-    if (!/^\d+(?:\.\d{1,2})?$/.test(text)) {
-        const error = new Error('金额必须是大于 0 的人民币数字，最多保留两位小数。');
-        error.status = 400;
-        error.code = 'INVALID_AMOUNT';
-        throw error;
-    }
-    const [yuanPart, centPart = ''] = text.split('.');
-    const cents = Number(yuanPart) * 100 + Number(centPart.padEnd(2, '0'));
-    if (!Number.isSafeInteger(cents) || cents <= 0) {
-        const error = new Error('金额必须大于 0。');
-        error.status = 400;
-        error.code = 'INVALID_AMOUNT';
-        throw error;
-    }
-    return cents;
-}
-
-function centsToCny(cents) {
-    return Number(cents || 0) / 100;
-}
-
-function centsToNanos(cents) {
-    return nonNegativeInteger(cents) * nanosPerCent;
-}
-
-function signedCentsToNanos(cents) {
-    const value = Number(cents || 0);
-    if (!Number.isSafeInteger(value)) return 0;
-    return value * nanosPerCent;
-}
-
-function nanosToCny(nanos) {
-    return Number(nanos || 0) / nanosPerYuan;
-}
-
-function nanosToBalanceCents(nanos) {
-    const value = Number(nanos || 0);
-    if (value >= 0) return Math.floor(value / nanosPerCent);
-    return -Math.ceil(Math.abs(value) / nanosPerCent);
-}
-
 function normalizePaymentMethod(value) {
     const method = String(value || '').trim().toLowerCase();
     if (!supportedPaymentMethods.has(method)) {
@@ -836,47 +797,6 @@ function createShopApp(options = {}) {
         };
     }
 
-    function cnyPerMillionTokens(nanosPerToken) {
-        return Number(nanosPerToken || 0) * 1000000 / nanosPerYuan;
-    }
-
-    function modelPriceOverview(modelId, available) {
-        const id = String(modelId || '').trim();
-        const normalizedId = id.toLowerCase();
-        const price = priceForModel(normalizedId);
-        return {
-            id,
-            available: Boolean(available),
-            priceModel: price.model,
-            usesDefaultPrice: normalizedId !== price.model,
-            priceVersion: price.version,
-            cacheHitInputCnyPerMillion: cnyPerMillionTokens(price.cacheHitInputNanosPerToken),
-            cacheMissInputCnyPerMillion: cnyPerMillionTokens(price.cacheMissInputNanosPerToken),
-            outputCnyPerMillion: cnyPerMillionTokens(price.outputNanosPerToken)
-        };
-    }
-
-    function pricingFallbackModelOverview() {
-        return Object.keys(gptModelRmbPrices).map((model) => modelPriceOverview(model, false));
-    }
-
-    function normalizeModelList(body = {}) {
-        const source = Array.isArray(body.data)
-            ? body.data
-            : Array.isArray(body.models)
-                ? body.models
-                : [];
-        const seen = new Set();
-        const models = [];
-        for (const item of source) {
-            const id = String(item?.id || item?.model || item?.name || '').trim();
-            if (!id || seen.has(id)) continue;
-            seen.add(id);
-            models.push(id);
-        }
-        return models;
-    }
-
     async function fetchModelIds(apiKey) {
         if (!apiKey || typeof modelListFetch !== 'function') return [];
         const response = await modelListFetch(`${modelListBaseUrl}/models`, {
@@ -2481,352 +2401,6 @@ ORDER BY ak.created_at DESC, ak.api_key_preview ASC
         };
     }
 
-    function emptyBillingStats() {
-        return {
-            todayChargeNanos: 0,
-            monthChargeNanos: 0,
-            todayCacheHitInputTokens: 0,
-            todayCacheMissInputTokens: 0,
-            todayOutputTokens: 0,
-            todayCacheHitInputChargeNanos: 0,
-            todayCacheMissInputChargeNanos: 0,
-            todayOutputChargeNanos: 0,
-            cacheHitInputTokens: 0,
-            cacheMissInputTokens: 0,
-            outputTokens: 0,
-            cacheHitInputChargeNanos: 0,
-            cacheMissInputChargeNanos: 0,
-            outputChargeNanos: 0,
-            todayCustomerSpendingByPhone: new Map(),
-            monthCustomerSpendingByPhone: new Map()
-        };
-    }
-
-    function billingPriceForVersion(version) {
-        if (version === 'deepseek-v4-pro-rmb-20260424') {
-            return {
-                cacheHitInputNanosPerToken: 25,
-                cacheMissInputNanosPerToken: 3000,
-                outputNanosPerToken: 6000
-            };
-        }
-        if (version === 'deepseek-v4-pro-rmb-20260612-cache-hit-10x') {
-            return {
-                cacheHitInputNanosPerToken: 250,
-                cacheMissInputNanosPerToken: 3000,
-                outputNanosPerToken: 6000
-            };
-        }
-        if (version === 'deepseek-v4-pro-rmb-20260612-output-20rmb') {
-            return {
-                cacheHitInputNanosPerToken: 250,
-                cacheMissInputNanosPerToken: 3000,
-                outputNanosPerToken: 20000
-            };
-        }
-        if (version === gptModelRmbPrices['gpt-5.4'].version) {
-            return gptModelRmbPrices['gpt-5.4'];
-        }
-        if (version === gptModelRmbPrices['gpt-5.5'].version) {
-            return gptModelRmbPrices['gpt-5.5'];
-        }
-        return currentDefaultRmbPrice;
-    }
-
-    function emptyCustomerSpending() {
-        return {
-            chargeNanos: 0,
-            cacheHitInputChargeNanos: 0,
-            cacheMissInputChargeNanos: 0,
-            outputChargeNanos: 0
-        };
-    }
-
-    function addCustomerSpending(target, phone, charges) {
-        const normalizedPhone = String(phone || '').trim();
-        if (!normalizedPhone) return;
-        const current = target.get(normalizedPhone) || emptyCustomerSpending();
-        target.set(normalizedPhone, {
-            chargeNanos: current.chargeNanos + nonNegativeInteger(charges.chargeNanos),
-            cacheHitInputChargeNanos: current.cacheHitInputChargeNanos + nonNegativeInteger(charges.cacheHitInputChargeNanos),
-            cacheMissInputChargeNanos: current.cacheMissInputChargeNanos + nonNegativeInteger(charges.cacheMissInputChargeNanos),
-            outputChargeNanos: current.outputChargeNanos + nonNegativeInteger(charges.outputChargeNanos)
-        });
-    }
-
-    function addBillingStats(stats, row, ranges) {
-        if (row.status !== 'charged') return;
-        const createdAt = new Date(row.created_at);
-        if (!Number.isFinite(createdAt.getTime())) return;
-        const chargeNanos = nonNegativeInteger(row.charge_nanos);
-        const cacheHitInputTokens = nonNegativeInteger(row.cache_hit_input_tokens);
-        const cacheMissInputTokens = nonNegativeInteger(row.cache_miss_input_tokens);
-        const outputTokens = nonNegativeInteger(row.output_tokens);
-        const price = billingPriceForVersion(row.price_version);
-        const cacheHitInputChargeNanos = cacheHitInputTokens * price.cacheHitInputNanosPerToken;
-        const cacheMissInputChargeNanos = cacheMissInputTokens * price.cacheMissInputNanosPerToken;
-        const outputChargeNanos = outputTokens * price.outputNanosPerToken;
-        if (createdAt >= ranges.todayStart) {
-            stats.todayChargeNanos += chargeNanos;
-            stats.todayCacheHitInputTokens += cacheHitInputTokens;
-            stats.todayCacheMissInputTokens += cacheMissInputTokens;
-            stats.todayOutputTokens += outputTokens;
-            stats.todayCacheHitInputChargeNanos += cacheHitInputChargeNanos;
-            stats.todayCacheMissInputChargeNanos += cacheMissInputChargeNanos;
-            stats.todayOutputChargeNanos += outputChargeNanos;
-            addCustomerSpending(stats.todayCustomerSpendingByPhone, row.phone, {
-                chargeNanos,
-                cacheHitInputChargeNanos,
-                cacheMissInputChargeNanos,
-                outputChargeNanos
-            });
-        }
-        if (createdAt >= ranges.monthStart) {
-            stats.monthChargeNanos += chargeNanos;
-            stats.cacheHitInputTokens += cacheHitInputTokens;
-            stats.cacheMissInputTokens += cacheMissInputTokens;
-            stats.outputTokens += outputTokens;
-            stats.cacheHitInputChargeNanos += cacheHitInputChargeNanos;
-            stats.cacheMissInputChargeNanos += cacheMissInputChargeNanos;
-            stats.outputChargeNanos += outputChargeNanos;
-            addCustomerSpending(stats.monthCustomerSpendingByPhone, row.phone, {
-                chargeNanos,
-                cacheHitInputChargeNanos,
-                cacheMissInputChargeNanos,
-                outputChargeNanos
-            });
-        }
-    }
-
-    function revenueParts(cacheHitInputTokens, cacheHitInputChargeNanos, cacheMissInputTokens, cacheMissInputChargeNanos, outputTokens, outputChargeNanos) {
-        const parts = [
-            {
-                key: 'cache_hit_input',
-                label: '缓存命中输入',
-                tokens: nonNegativeInteger(cacheHitInputTokens),
-                chargeNanos: nonNegativeInteger(cacheHitInputChargeNanos)
-            },
-            {
-                key: 'cache_miss_input',
-                label: '缓存未命中输入',
-                tokens: nonNegativeInteger(cacheMissInputTokens),
-                chargeNanos: nonNegativeInteger(cacheMissInputChargeNanos)
-            },
-            {
-                key: 'output',
-                label: '输出 token',
-                tokens: nonNegativeInteger(outputTokens),
-                chargeNanos: nonNegativeInteger(outputChargeNanos)
-            }
-        ];
-        return parts.map((part) => ({
-            ...part,
-            chargeAmount: nanosToCny(part.chargeNanos)
-        }));
-    }
-
-    function chinaDateKeyToDayStart(dateKey) {
-        const [year, month, day] = String(dateKey || '').split('-').map(Number);
-        return new Date(Date.UTC(year, month - 1, day) - chinaOffsetMs);
-    }
-
-    function chinaDateLabel(dateKey) {
-        const [, month, day] = String(dateKey || '').split('-').map(Number);
-        return `${month}/${day}`;
-    }
-
-    function addSpendingPartCharges(target, row) {
-        const cacheHitInputTokens = nonNegativeInteger(row.cache_hit_input_tokens);
-        const cacheMissInputTokens = nonNegativeInteger(row.cache_miss_input_tokens);
-        const outputTokens = nonNegativeInteger(row.output_tokens);
-        const price = billingPriceForVersion(row.price_version);
-        target.chargeNanos += nonNegativeInteger(row.charge_nanos);
-        target.cacheHitInputTokens += cacheHitInputTokens;
-        target.cacheMissInputTokens += cacheMissInputTokens;
-        target.outputTokens += outputTokens;
-        target.cacheHitInputChargeNanos += cacheHitInputTokens * price.cacheHitInputNanosPerToken;
-        target.cacheMissInputChargeNanos += cacheMissInputTokens * price.cacheMissInputNanosPerToken;
-        target.outputChargeNanos += outputTokens * price.outputNanosPerToken;
-    }
-
-    function emptyDailySpending(dateKey) {
-        return {
-            date: dateKey,
-            label: chinaDateLabel(dateKey),
-            chargeNanos: 0,
-            cacheHitInputTokens: 0,
-            cacheMissInputTokens: 0,
-            outputTokens: 0,
-            cacheHitInputChargeNanos: 0,
-            cacheMissInputChargeNanos: 0,
-            outputChargeNanos: 0
-        };
-    }
-
-    function publicDailySpending(day) {
-        return {
-            date: day.date,
-            label: day.label,
-            chargeNanos: nonNegativeInteger(day.chargeNanos),
-            chargeAmount: nanosToCny(day.chargeNanos),
-            parts: revenueParts(
-                day.cacheHitInputTokens,
-                day.cacheHitInputChargeNanos,
-                day.cacheMissInputTokens,
-                day.cacheMissInputChargeNanos,
-                day.outputTokens,
-                day.outputChargeNanos
-            )
-        };
-    }
-
-    function createWeeklySpendingBucket(weekStartKey) {
-        const weekStart = chinaDateKeyToDayStart(weekStartKey);
-        const dayMap = new Map();
-        const days = Array.from({ length: 7 }, (_, index) => {
-            const dateKey = chinaDateKey(new Date(weekStart.getTime() + index * 24 * 60 * 60 * 1000));
-            const day = emptyDailySpending(dateKey);
-            dayMap.set(dateKey, day);
-            return day;
-        });
-        return {
-            weekStart: weekStartKey,
-            weekEnd: days[6]?.date || weekStartKey,
-            dayMap,
-            days
-        };
-    }
-
-    function publicWeeklySpendingBucket(week) {
-        const days = week.days.map(publicDailySpending);
-        const totalChargeNanos = days.reduce((sum, day) => sum + nonNegativeInteger(day.chargeNanos), 0);
-        return {
-            weekStart: week.weekStart,
-            weekEnd: week.weekEnd,
-            label: `${chinaDateLabel(week.weekStart)}-${chinaDateLabel(week.weekEnd)}`,
-            totalChargeNanos,
-            totalChargeAmount: nanosToCny(totalChargeNanos),
-            days
-        };
-    }
-
-    function buildWeeklySpending(chargeRows, now) {
-        const currentWeekStart = chinaDateKey(startOfChinaWeek(now));
-        const weeksByStart = new Map();
-        const ensureWeek = (weekStartKey) => {
-            if (!weeksByStart.has(weekStartKey)) {
-                weeksByStart.set(weekStartKey, createWeeklySpendingBucket(weekStartKey));
-            }
-            return weeksByStart.get(weekStartKey);
-        };
-        ensureWeek(currentWeekStart);
-
-        for (const row of chargeRows) {
-            if (row.status !== 'charged') continue;
-            const createdAt = new Date(row.created_at);
-            if (!Number.isFinite(createdAt.getTime())) continue;
-            const weekStartKey = chinaDateKey(startOfChinaWeek(createdAt));
-            const dayKey = chinaDateKey(createdAt);
-            const week = ensureWeek(weekStartKey);
-            const day = week.dayMap.get(dayKey);
-            if (!day) continue;
-            addSpendingPartCharges(day, row);
-        }
-
-        const weekStarts = Array.from(weeksByStart.keys()).sort();
-        const weeks = {};
-        for (const weekStart of weekStarts) {
-            weeks[weekStart] = publicWeeklySpendingBucket(weeksByStart.get(weekStart));
-        }
-        return {
-            currentWeekStart,
-            weekStarts,
-            weeks
-        };
-    }
-
-    function customerSpendingParts(spending) {
-        return [
-            {
-                key: 'cache_hit_input',
-                label: '缓存命中输入',
-                chargeNanos: nonNegativeInteger(spending.cacheHitInputChargeNanos)
-            },
-            {
-                key: 'cache_miss_input',
-                label: '缓存未命中输入',
-                chargeNanos: nonNegativeInteger(spending.cacheMissInputChargeNanos)
-            },
-            {
-                key: 'output',
-                label: '输出 token',
-                chargeNanos: nonNegativeInteger(spending.outputChargeNanos)
-            }
-        ].map((part) => ({
-            ...part,
-            chargeAmount: nanosToCny(part.chargeNanos)
-        }));
-    }
-
-    function customerSpendingRanking(spendingByPhone) {
-        return Array.from(spendingByPhone.entries())
-            .map(([phone, spending]) => ({
-                phone,
-                chargeNanos: nonNegativeInteger(spending.chargeNanos),
-                chargeAmount: nanosToCny(spending.chargeNanos),
-                parts: customerSpendingParts(spending)
-            }))
-            .sort((left, right) => {
-                if (right.chargeNanos !== left.chargeNanos) return right.chargeNanos - left.chargeNanos;
-                return left.phone.localeCompare(right.phone);
-            });
-    }
-
-    function billingStatsToPublic(stats, chargeRows) {
-        return {
-            priceVersion: currentDefaultRmbPrice.version,
-            todayChargeNanos: stats.todayChargeNanos,
-            todayChargeAmount: nanosToCny(stats.todayChargeNanos),
-            monthChargeNanos: stats.monthChargeNanos,
-            monthChargeAmount: nanosToCny(stats.monthChargeNanos),
-            todayCacheHitInputTokens: stats.todayCacheHitInputTokens,
-            todayCacheMissInputTokens: stats.todayCacheMissInputTokens,
-            todayOutputTokens: stats.todayOutputTokens,
-            cacheHitInputTokens: stats.cacheHitInputTokens,
-            cacheMissInputTokens: stats.cacheMissInputTokens,
-            outputTokens: stats.outputTokens,
-            todayRevenueParts: revenueParts(
-                stats.todayCacheHitInputTokens,
-                stats.todayCacheHitInputChargeNanos,
-                stats.todayCacheMissInputTokens,
-                stats.todayCacheMissInputChargeNanos,
-                stats.todayOutputTokens,
-                stats.todayOutputChargeNanos
-            ),
-            monthRevenueParts: revenueParts(
-                stats.cacheHitInputTokens,
-                stats.cacheHitInputChargeNanos,
-                stats.cacheMissInputTokens,
-                stats.cacheMissInputChargeNanos,
-                stats.outputTokens,
-                stats.outputChargeNanos
-            ),
-            customerSpendingRankings: {
-                today: customerSpendingRanking(stats.todayCustomerSpendingByPhone),
-                month: customerSpendingRanking(stats.monthCustomerSpendingByPhone)
-            },
-            recentCharges: chargeRows.slice(0, 10).map(publicApiChargeRecord)
-        };
-    }
-
-    function buildBillingSummary(chargeRows, ranges) {
-        const stats = emptyBillingStats();
-        for (const row of chargeRows) {
-            addBillingStats(stats, row, ranges);
-        }
-        return billingStatsToPublic(stats, chargeRows);
-    }
-
     function addUsageStats(stats, row, ranges) {
         const requestedAt = new Date(row.requested_at);
         const isToday = requestedAt >= ranges.todayStart;
@@ -3070,7 +2644,7 @@ ORDER BY ak.created_at DESC, ak.api_key_preview ASC
             byApiKey.get(row.api_key_hash).requests += 1;
         }
         const chargeRows = listApiChargeRecordsForBillingByPhone.all(phone);
-        const billing = buildBillingSummary(chargeRows, ranges);
+        const billing = buildBillingSummary(chargeRows, ranges, { publicChargeRecord: publicApiChargeRecord });
         billing.weeklySpending = buildWeeklySpending(chargeRows, now);
 
         return {
@@ -3193,7 +2767,7 @@ ORDER BY ak.created_at DESC, ak.api_key_preview ASC
             billing: buildBillingSummary(listApiChargeRecordsForShopBilling.all(), {
                 todayStart: startOfChinaDay(now),
                 monthStart: startOfChinaMonth(now)
-            }),
+            }, { publicChargeRecord: publicApiChargeRecord }),
             items: filteredItems
         };
     }
diff --git a/shop/js/account.js b/shop/js/account.js
new file mode 100644
index 0000000..517b44f
--- /dev/null
+++ b/shop/js/account.js
@@ -0,0 +1,579 @@
+// Shop 用户账户、兑换、充值、模型价格和扣费流水页面逻辑。
+(function() {
+    const {
+        escapeHtml,
+        formatCents,
+        formatDate,
+        formatNanos,
+        formatNumber,
+        formatPrice,
+        initCollapsibleSections,
+        requestJson
+    } = window.YuiShopCore;
+    const { renderAccountWeeklySpendingChart } = window.YuiShopCharts;
+
+function statusText(status) {
+    return status === 'active' ? '使用中' : '已失效';
+}
+
+function statusClass(status) {
+    return status === 'active'
+        ? 'bg-background-soft dark:bg-dark-surface text-primary dark:text-dark-text'
+        : 'bg-gray-100 dark:bg-dark-surface text-text-muted dark:text-dark-text-muted';
+}
+
+function billingStatusText(status) {
+    const map = {
+        available: '可用',
+        empty: '余额为 0',
+        debt: '欠费'
+    };
+    return map[status] || status || '-';
+}
+
+function topupStatusText(status) {
+    const map = {
+        pending: '待确认',
+        approved: '已入账',
+        rejected: '已拒绝',
+        cancelled: '已取消'
+    };
+    return map[status] || status || '-';
+}
+
+function ledgerEntryText(type) {
+    const map = {
+        topup_approved: '充值入账',
+        api_charge: 'API 扣费',
+        admin_adjustment: '管理员调整',
+        refund: '退款'
+    };
+    return map[type] || type || '-';
+}
+
+function chargeStatusText(status) {
+    const map = {
+        charged: '已扣费',
+        failed_no_charge: '失败未扣费',
+        unpriced_no_charge: '未计价',
+        adjusted: '已调整'
+    };
+    return map[status] || status || '-';
+}
+
+function renderOrderCard(order, options = {}) {
+    const key = options.showFullKey ? order.apiKey : order.apiKeyPreview;
+    const copyButton = options.showFullKey
+        ? '<button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text" type="button" data-copy-key>复制 API key</button>'
+        : options.revealKey
+            ? '<button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text" type="button" data-reveal-api-key>复制完整 API key</button>'
+        : '';
+
+    if (options.compactAccountOrder) {
+        return `
+            <article class="border border-border-subtle dark:border-dark-border rounded-lg bg-white dark:bg-dark-card p-5 md:p-6" data-order-id="${escapeHtml(order.id)}">
+                <div class="rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
+                    <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">API key</p>
+                    <code class="mt-2 block break-all text-sm text-primary dark:text-dark-text" data-api-key>${escapeHtml(key || '-')}</code>
+                </div>
+                <dl class="mt-5 text-sm">
+                    <div>
+                        <dt class="text-text-muted dark:text-dark-text-muted">兑换时间</dt>
+                        <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.redeemedAt))}</dd>
+                    </div>
+                </dl>
+                ${copyButton ? `<div class="mt-5">${copyButton}</div>` : ''}
+            </article>
+        `;
+    }
+
+    return `
+        <article class="border border-border-subtle dark:border-dark-border rounded-lg bg-white dark:bg-dark-card p-5 md:p-6" data-order-id="${escapeHtml(order.id)}">
+            <div class="flex flex-col md:flex-row md:items-start md:justify-between gap-5">
+                <div>
+                    <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">${escapeHtml(order.id)}</p>
+                    <h2 class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(order.productName)}</h2>
+                    <p class="mt-2 text-sm text-text-muted dark:text-dark-text-muted">API key 已绑定到账户，按实际使用量计费。</p>
+                </div>
+                <span class="w-fit rounded-full border border-border-subtle dark:border-dark-border px-3 py-1 text-xs ${statusClass(order.status)}">${escapeHtml(statusText(order.status))}</span>
+            </div>
+            <div class="mt-5 rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
+                <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">API key</p>
+                <code class="mt-2 block break-all text-sm text-primary dark:text-dark-text" data-api-key>${escapeHtml(key || '-')}</code>
+            </div>
+            <dl class="mt-5 grid gap-3 text-sm md:grid-cols-2">
+                <div>
+                    <dt class="text-text-muted dark:text-dark-text-muted">手机号</dt>
+                    <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(order.phone)}</dd>
+                </div>
+                <div>
+                    <dt class="text-text-muted dark:text-dark-text-muted">金额</dt>
+                    <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatPrice(order.amount))}</dd>
+                </div>
+                <div>
+                    <dt class="text-text-muted dark:text-dark-text-muted">兑换时间</dt>
+                    <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.redeemedAt))}</dd>
+                </div>
+                <div>
+                    <dt class="text-text-muted dark:text-dark-text-muted">失效时间</dt>
+                    <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.expiresAt))}</dd>
+                </div>
+            </dl>
+            ${copyButton ? `<div class="mt-5">${copyButton}</div>` : ''}
+        </article>
+    `;
+}
+
+function bindCopy(root) {
+    const button = root.querySelector('[data-copy-key]');
+    const revealButton = root.querySelector('[data-reveal-api-key]');
+    const key = root.querySelector('[data-api-key]')?.textContent || '';
+    if (!button && !revealButton) return;
+
+    if (button && key) button.addEventListener('click', async () => {
+        await navigator.clipboard.writeText(key);
+        button.textContent = '已复制';
+        setTimeout(() => {
+            button.textContent = '复制 API key';
+        }, 1400);
+    });
+
+    if (revealButton) revealButton.addEventListener('click', async () => {
+        const orderId = root.getAttribute('data-order-id') || '';
+        if (!orderId) return;
+        revealButton.textContent = '正在复制...';
+        try {
+            const data = await requestJson(`/api/account/orders/${encodeURIComponent(orderId)}/reveal-api-key`, {
+                method: 'POST',
+                body: '{}'
+            });
+            await navigator.clipboard.writeText(data.apiKey || '');
+            revealButton.textContent = '已复制';
+        } catch (error) {
+            revealButton.textContent = error.message || '复制失败';
+        }
+        setTimeout(() => {
+            revealButton.textContent = '复制完整 API key';
+        }, 1400);
+    });
+}
+
+function renderBillingUsageCards(billing = {}, options = {}) {
+    const adminRevenue = options.mode === 'adminRevenue';
+    const cards = [
+        [adminRevenue ? '今日收银' : '今日消费', formatNanos(billing.todayChargeNanos), adminRevenue ? '今天收银多少钱' : '今日已扣费'],
+        [adminRevenue ? '本月收银' : '本月消费', formatNanos(billing.monthChargeNanos), adminRevenue ? '本月一共收了多少钱' : '本月已扣费'],
+        ['缓存命中输入', formatNumber(billing.cacheHitInputTokens), '本月 token'],
+        ['缓存未命中输入', formatNumber(billing.cacheMissInputTokens), '本月 token'],
+        ['输出 token', formatNumber(billing.outputTokens), '本月 token']
+    ];
+    return cards.map(([label, value, hint]) => `
+        <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
+            <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
+            <p class="mt-2 text-xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
+            <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
+        </article>
+    `).join('');
+}
+
+function renderBalanceCards(balance = {}) {
+    const cards = [
+        ['当前余额', balance.balanceNanos === undefined ? formatCents(balance.balanceCents) : formatNanos(balance.balanceNanos), billingStatusText(balance.status)],
+        ['欠费金额', balance.debtNanos === undefined ? formatCents(balance.debtCents) : formatNanos(balance.debtNanos), balance.debtCents > 0 ? '需补缴' : '无欠费'],
+        ['待确认充值', balance.pendingTopupNanos === undefined ? formatCents(balance.pendingTopupCents) : formatNanos(balance.pendingTopupNanos), '确认后入账'],
+        ['欠费上限', balance.creditLimitNanos === undefined ? formatCents(balance.creditLimitCents) : formatNanos(balance.creditLimitNanos), balance.creditExceeded ? '已超过' : '默认上限']
+    ];
+    return cards.map(([label, value, hint]) => `
+        <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
+            <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
+            <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
+            <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
+        </article>
+    `).join('');
+}
+
+function formatModelPrice(value) {
+    return `¥${Number(value || 0).toFixed(2)}`;
+}
+
+function renderAccountModelOverview(data = {}) {
+    const models = Array.isArray(data.models) ? data.models : [];
+    if (!models.length) {
+        return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无模型价格。</p>';
+    }
+    return `
+        <table class="min-w-full text-sm">
+            <thead class="text-left text-xs uppercase tracking-[0.14em] text-text-muted dark:text-dark-text-muted">
+                <tr>
+                    <th class="py-2 pr-4">模型</th>
+                    <th class="py-2 pr-4">状态</th>
+                    <th class="py-2 pr-4">缓存命中输入 / 1M</th>
+                    <th class="py-2 pr-4">未命中输入 / 1M</th>
+                    <th class="py-2 pr-4">输出 / 1M</th>
+                </tr>
+            </thead>
+            <tbody>
+                ${models.map((model) => `
+                    <tr class="border-t border-border-subtle dark:border-dark-border">
+                        <td class="py-3 pr-4 font-mono text-primary dark:text-dark-text">${escapeHtml(model.id || '-')}</td>
+                        <td class="py-3 pr-4">${escapeHtml(model.available ? '可用' : '价格表')}</td>
+                        <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.cacheHitInputCnyPerMillion))}</td>
+                        <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.cacheMissInputCnyPerMillion))}</td>
+                        <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.outputCnyPerMillion))}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderTopups(topups = []) {
+    if (!topups.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无充值申请。</p>';
+    return `
+        <div class="space-y-3">
+            ${topups.map((topup) => `
+                <article class="rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
+                    <div class="flex items-start justify-between gap-3">
+                        <div>
+                            <p class="font-medium text-primary dark:text-dark-text">${escapeHtml(formatCents(topup.requestedAmountCents))}</p>
+                            <p class="mt-1 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(topup.paymentMethod === 'wechat' ? '微信' : '支付宝')} · ${escapeHtml(formatDate(topup.createdAt))}</p>
+                        </div>
+                        <span class="rounded-full border border-border-subtle dark:border-dark-border px-3 py-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(topupStatusText(topup.status))}</span>
+                    </div>
+                    ${topup.adminNote ? `<p class="mt-2 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(topup.adminNote)}</p>` : ''}
+                </article>
+            `).join('')}
+        </div>
+    `;
+}
+
+function renderCharges(charges = [], options = {}) {
+    if (!charges.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无 API 扣费记录。</p>';
+    const phoneHeader = options.showPhone ? '<th class="py-2 pr-3">用户</th>' : '';
+    return `
+        <table class="min-w-full text-sm">
+            <thead class="text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr><th class="py-2 pr-3">时间</th>${phoneHeader}<th class="py-2 pr-3">模型</th><th class="py-2 pr-3">命中输入</th><th class="py-2 pr-3">未命中输入</th><th class="py-2 pr-3">输出</th><th class="py-2 pr-3">Reasoning</th><th class="py-2 pr-3">费用</th><th class="py-2 pr-3">扣后余额</th><th class="py-2">状态</th></tr>
+            </thead>
+            <tbody>
+                ${charges.map((charge) => `
+                    <tr class="border-t border-border-subtle dark:border-dark-border">
+                        <td class="py-2 pr-3">${escapeHtml(formatDate(charge.createdAt))}</td>
+                        ${options.showPhone ? `<td class="py-2 pr-3">${escapeHtml(charge.phone || '-')}</td>` : ''}
+                        <td class="py-2 pr-3">${escapeHtml(charge.model)}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.cacheHitInputTokens))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.cacheMissInputTokens))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.outputTokens))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.reasoningTokens))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(charge.chargeNanos === undefined ? formatCents(charge.chargeCents) : formatNanos(charge.chargeNanos))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(charge.balanceAfterNanos === undefined ? formatCents(charge.balanceAfterCents) : formatNanos(charge.balanceAfterNanos))}</td>
+                        <td class="py-2">${escapeHtml(chargeStatusText(charge.status))}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderLedger(entries = []) {
+    if (!entries.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无账户流水。</p>';
+    return `
+        <table class="min-w-full text-sm">
+            <thead class="text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr><th class="py-2 pr-3">时间</th><th class="py-2 pr-3">类型</th><th class="py-2 pr-3">金额</th><th class="py-2 pr-3">余额</th><th class="py-2">备注</th></tr>
+            </thead>
+            <tbody>
+                ${entries.map((entry) => `
+                    <tr class="border-t border-border-subtle dark:border-dark-border">
+                        <td class="py-2 pr-3">${escapeHtml(formatDate(entry.createdAt))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(ledgerEntryText(entry.entryType))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatCents(entry.amountCents))}</td>
+                        <td class="py-2 pr-3">${escapeHtml(formatCents(entry.balanceAfterCents))}</td>
+                        <td class="py-2">${escapeHtml(entry.memo || '-')}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function initRedeemPage() {
+    const form = document.getElementById('redeemForm');
+    const accountPhone = document.getElementById('redeemAccountPhone');
+    const codeInput = document.getElementById('inviteCodeInput');
+    const message = document.getElementById('redeemMessage');
+    if (!form || !accountPhone || !codeInput || !message) return;
+
+    requestJson('/api/account/me')
+        .then((data) => {
+            accountPhone.textContent = data.user?.phone || '-';
+        })
+        .catch(() => {
+            window.location.replace('/shop/login/');
+        });
+
+    codeInput.addEventListener('input', () => {
+        codeInput.value = normalizeInviteCode(codeInput.value);
+    });
+
+    form.addEventListener('submit', async (event) => {
+        event.preventDefault();
+        const code = normalizeInviteCode(codeInput.value);
+        if (!code) {
+            message.textContent = '请输入邀请码。';
+            codeInput.focus();
+            return;
+        }
+
+        message.textContent = '正在兑换...';
+        try {
+            await requestJson('/api/account/invites/redeem', {
+                method: 'POST',
+                body: JSON.stringify({ code })
+            });
+            window.location.href = '/shop/account/';
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+function normalizeInviteCode(value) {
+    return String(value || '').trim().toUpperCase().replace(/[^A-Z0-9-]/g, '').slice(0, 18);
+}
+
+async function initKeyPage() {
+    const root = document.getElementById('keyResult');
+    const empty = document.getElementById('emptyKey');
+    if (!root) return;
+    root.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取当前兑换结果...</p>';
+
+    try {
+        const data = await requestJson('/api/orders/current');
+        root.classList.remove('hidden');
+        if (empty) empty.classList.add('hidden');
+        root.innerHTML = renderOrderCard(data.order, { showFullKey: true });
+        bindCopy(root);
+    } catch (error) {
+        if (empty) empty.classList.remove('hidden');
+        root.classList.add('hidden');
+    }
+}
+
+function initQueryPage() {
+    window.location.replace('/shop/account/');
+}
+
+async function initAccountPage() {
+    initCollapsibleSections(document);
+
+    const phoneRoot = document.getElementById('accountPhone');
+    const ordersRoot = document.getElementById('accountOrders');
+    const message = document.getElementById('accountMessage');
+    const logoutButton = document.getElementById('logoutButton');
+    const billingUsageCards = document.getElementById('accountBillingUsageCards');
+    const accountWeeklySpendingChart = document.getElementById('accountWeeklySpendingChart');
+    const usageFreshness = document.getElementById('usageFreshness');
+    const usageMessage = document.getElementById('accountUsageMessage');
+    const modelOverviewRoot = document.getElementById('accountModelOverview');
+    const balanceCards = document.getElementById('accountBalanceCards');
+    const billingMessage = document.getElementById('accountBillingMessage');
+    const topupForm = document.getElementById('topupForm');
+    const topupAmount = document.getElementById('topupAmount');
+    const topupPaymentMethod = document.getElementById('topupPaymentMethod');
+    const topupPaymentTime = document.getElementById('topupPaymentTime');
+    const topupPaymentNote = document.getElementById('topupPaymentNote');
+    const topupMessage = document.getElementById('topupMessage');
+    const accountTopups = document.getElementById('accountTopups');
+    const accountCharges = document.getElementById('accountCharges');
+    const accountLedger = document.getElementById('accountLedger');
+    const alipayQrImage = document.getElementById('alipayQrImage');
+    const wechatQrImage = document.getElementById('wechatQrImage');
+    const paymentReference = document.getElementById('paymentReference');
+    const accountRedeemForm = document.getElementById('accountRedeemForm');
+    const accountInviteCodeInput = document.getElementById('accountInviteCodeInput');
+    const accountRedeemMessage = document.getElementById('accountRedeemMessage');
+    let accountWeeklySpending = null;
+    let selectedAccountWeekStart = '';
+    if (!phoneRoot || !ordersRoot || !message || !logoutButton) return;
+
+    ordersRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取账户信息...</p>';
+    try {
+        const data = await requestJson('/api/account/me');
+        phoneRoot.textContent = data.user.phone;
+        const orders = data.orders || [];
+        if (!orders.length) {
+            ordersRoot.innerHTML = `
+                <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-8 text-center">
+                    <h2 class="font-display text-3xl text-primary dark:text-dark-text">暂无 API key</h2>
+                    <p class="mt-3 text-text-muted dark:text-dark-text-muted">输入管理员提供的邀请码后，API key 会绑定到当前账号。</p>
+                </section>
+            `;
+        } else {
+            ordersRoot.innerHTML = `<div class="grid gap-5">${orders.map((order) => renderOrderCard(order, { revealKey: true, compactAccountOrder: true })).join('')}</div>`;
+            ordersRoot.querySelectorAll('article').forEach(bindCopy);
+        }
+        message.textContent = '';
+    } catch (error) {
+        window.location.replace('/shop/login/');
+    }
+
+    async function refreshModelOverview() {
+        if (!modelOverviewRoot) return;
+        modelOverviewRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取模型...</p>';
+        try {
+            const data = await requestJson('/api/account/model-overview');
+            modelOverviewRoot.innerHTML = renderAccountModelOverview(data);
+        } catch (error) {
+            modelOverviewRoot.innerHTML = `<p class="text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(error.message)}</p>`;
+        }
+    }
+
+    async function refreshBilling() {
+        if (billingMessage) billingMessage.textContent = '正在读取账务信息...';
+        const [balanceData, topupData, chargeData, ledgerData] = await Promise.all([
+            requestJson('/api/account/balance'),
+            requestJson('/api/account/topups'),
+            requestJson('/api/account/api-charges'),
+            requestJson('/api/account/ledger')
+        ]);
+        if (balanceCards) balanceCards.innerHTML = renderBalanceCards(balanceData.balance || {});
+        if (accountTopups) accountTopups.innerHTML = renderTopups(topupData.topups || []);
+        if (accountCharges) accountCharges.innerHTML = renderCharges(chargeData.charges || []);
+        if (accountLedger) accountLedger.innerHTML = renderLedger(ledgerData.entries || []);
+        if (alipayQrImage) alipayQrImage.src = balanceData.payment?.alipayQrUrl || '';
+        if (wechatQrImage) wechatQrImage.src = balanceData.payment?.wechatQrUrl || '';
+        if (paymentReference) paymentReference.textContent = balanceData.payment?.paymentReference || '-';
+        if (billingMessage) billingMessage.textContent = '';
+    }
+
+    await refreshModelOverview();
+
+    try {
+        await refreshBilling();
+    } catch (error) {
+        if (billingMessage) billingMessage.textContent = error.message;
+    }
+
+    if (topupForm && topupAmount && topupPaymentMethod && topupMessage) {
+        topupForm.addEventListener('submit', async (event) => {
+            event.preventDefault();
+            topupMessage.textContent = '正在提交充值申请...';
+            try {
+                await requestJson('/api/account/topups', {
+                    method: 'POST',
+                    body: JSON.stringify({
+                        amount: topupAmount.value,
+                        paymentMethod: topupPaymentMethod.value,
+                        paymentTime: topupPaymentTime?.value || '',
+                        paymentNote: topupPaymentNote?.value || ''
+                    })
+                });
+                topupForm.reset();
+                topupMessage.textContent = '充值申请已提交，管理员确认后会入账。';
+                await refreshBilling();
+            } catch (error) {
+                topupMessage.textContent = error.message;
+            }
+        });
+    }
+
+    if (accountRedeemForm && accountInviteCodeInput && accountRedeemMessage) {
+        accountInviteCodeInput.addEventListener('input', () => {
+            accountInviteCodeInput.value = normalizeInviteCode(accountInviteCodeInput.value);
+        });
+        accountRedeemForm.addEventListener('submit', async (event) => {
+            event.preventDefault();
+            const code = normalizeInviteCode(accountInviteCodeInput.value);
+            if (!code) {
+                accountRedeemMessage.textContent = '请输入邀请码。';
+                accountInviteCodeInput.focus();
+                return;
+            }
+            accountRedeemMessage.textContent = '正在兑换...';
+            try {
+                await requestJson('/api/account/invites/redeem', {
+                    method: 'POST',
+                    body: JSON.stringify({ code })
+                });
+                accountInviteCodeInput.value = '';
+                accountRedeemMessage.textContent = '兑换成功，API key 已绑定到当前账号。';
+                window.location.reload();
+            } catch (error) {
+                accountRedeemMessage.textContent = error.message;
+            }
+        });
+    }
+
+    if (accountWeeklySpendingChart) {
+        accountWeeklySpendingChart.addEventListener('click', (event) => {
+            const button = event.target.closest('[data-account-week-offset]');
+            if (!button || !accountWeeklySpending) return;
+            const weekStarts = Array.isArray(accountWeeklySpending.weekStarts) ? accountWeeklySpending.weekStarts : [];
+            const currentIndex = weekStarts.indexOf(selectedAccountWeekStart);
+            const offset = Number(button.getAttribute('data-account-week-offset') || 0);
+            const nextWeekStart = weekStarts[currentIndex + offset];
+            if (!nextWeekStart) return;
+            selectedAccountWeekStart = nextWeekStart;
+            accountWeeklySpendingChart.innerHTML = renderAccountWeeklySpendingChart(accountWeeklySpending, selectedAccountWeekStart);
+        });
+    }
+
+    try {
+        const usage = await requestJson('/api/account/usage-summary');
+        if (billingUsageCards) billingUsageCards.innerHTML = renderBillingUsageCards(usage.billing || {});
+        accountWeeklySpending = usage.billing?.weeklySpending || {};
+        selectedAccountWeekStart = accountWeeklySpending.currentWeekStart || accountWeeklySpending.weekStarts?.[accountWeeklySpending.weekStarts.length - 1] || '';
+        if (accountWeeklySpendingChart) accountWeeklySpendingChart.innerHTML = renderAccountWeeklySpendingChart(accountWeeklySpending, selectedAccountWeekStart);
+        if (usageFreshness) {
+            usageFreshness.textContent = `生成时间 ${formatDate(usage.generatedAt)}，用量统计可能最多延迟 1 小时。`;
+        }
+        if (usageMessage) usageMessage.textContent = '';
+    } catch (error) {
+        if (usageMessage) usageMessage.textContent = error.message;
+    }
+
+    logoutButton.addEventListener('click', async () => {
+        message.textContent = '正在退出...';
+        try {
+            await requestJson('/api/auth/logout', { method: 'POST' });
+            window.location.href = '/shop/login/';
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+async function initAccountLinks() {
+    const links = Array.from(document.querySelectorAll('[data-account-link]'));
+    if (!links.length) return;
+    for (const link of links) {
+        link.href = '/shop/login/';
+        link.textContent = '登录';
+    }
+}
+
+    window.YuiShopAccount = {
+        statusText,
+        statusClass,
+        billingStatusText,
+        topupStatusText,
+        ledgerEntryText,
+        chargeStatusText,
+        renderOrderCard,
+        bindCopy,
+        renderBillingUsageCards,
+        renderBalanceCards,
+        formatModelPrice,
+        renderAccountModelOverview,
+        renderTopups,
+        renderCharges,
+        renderLedger,
+        initRedeemPage,
+        normalizeInviteCode,
+        initKeyPage,
+        initQueryPage,
+        initAccountPage,
+        initAccountLinks
+    };
+})();
diff --git a/shop/js/admin.js b/shop/js/admin.js
new file mode 100644
index 0000000..537b4cf
--- /dev/null
+++ b/shop/js/admin.js
@@ -0,0 +1,612 @@
+// Shop 管理员业务办理、用量监控和账户余额页面逻辑。
+(function() {
+    const {
+        bindPhoneInput,
+        escapeHtml,
+        formatCents,
+        formatDate,
+        formatNanos,
+        formatNumber,
+        isPhone,
+        initCollapsibleSections,
+        requestJson
+    } = window.YuiShopCore;
+    const { renderAdminRevenueCharts } = window.YuiShopCharts;
+    const { renderBillingUsageCards, renderCharges } = window.YuiShopAccount;
+
+function renderAdminBalanceSummary(summary = {}) {
+    const cards = [
+        ['用户数', formatNumber(summary.userCount || 0), 'Shop 账号'],
+        ['总余额', summary.totalBalanceNanos === undefined ? formatCents(summary.totalBalanceCents) : formatNanos(summary.totalBalanceNanos), '账户当前余额合计'],
+        ['欠费用户', formatNumber(summary.debtUserCount || 0), summary.debtNanos === undefined ? formatCents(summary.debtCents) : formatNanos(summary.debtNanos)],
+        ['待确认充值', summary.pendingTopupNanos === undefined ? formatCents(summary.pendingTopupCents) : formatNanos(summary.pendingTopupNanos), '用户已提交待审核']
+    ];
+    return cards.map(([label, value, hint]) => `
+        <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
+            <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
+            <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
+            <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
+        </article>
+    `).join('');
+}
+
+function renderAdminTopups(topups = []) {
+    if (!topups.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无充值申请。</div>';
+    }
+    return `
+        <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
+            <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr>
+                    <th class="px-4 py-3">用户</th>
+                    <th class="px-4 py-3">金额</th>
+                    <th class="px-4 py-3">方式</th>
+                    <th class="px-4 py-3">备注</th>
+                    <th class="px-4 py-3">状态</th>
+                    <th class="px-4 py-3">操作</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
+                ${topups.map((topup) => `
+                    <tr data-topup-id="${escapeHtml(topup.id)}">
+                        <td class="px-4 py-3">${escapeHtml(topup.phone)}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatCents(topup.requestedAmountCents))}</td>
+                        <td class="px-4 py-3">${escapeHtml(topup.paymentMethod === 'wechat' ? '微信' : '支付宝')}</td>
+                        <td class="px-4 py-3">${escapeHtml(topup.paymentNote || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(topupStatusText(topup.status))}</td>
+                        <td class="px-4 py-3">
+                            ${topup.status === 'pending' ? `
+                                <div class="flex flex-col gap-2 min-w-40">
+                                    <input class="h-9 rounded-md border-border-subtle dark:border-dark-border bg-white dark:bg-dark-bg text-primary dark:text-dark-text focus:border-primary focus:ring-primary" data-confirmed-amount value="${escapeHtml(String(topup.requestedAmount || ''))}" inputmode="decimal"/>
+                                    <input class="h-9 rounded-md border-border-subtle dark:border-dark-border bg-white dark:bg-dark-bg text-primary dark:text-dark-text focus:border-primary focus:ring-primary" data-admin-note placeholder="管理员备注"/>
+                                    <div class="flex gap-2">
+                                        <button class="btn-primary px-3 py-2 text-xs" type="button" data-approve-topup>确认</button>
+                                        <button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text px-3 py-2 text-xs" type="button" data-reject-topup>拒绝</button>
+                                    </div>
+                                </div>
+                            ` : '-'}
+                        </td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderAdminBalanceTable(items = []) {
+    if (!items.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无用户余额记录。</div>';
+    }
+    return `
+        <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
+            <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr>
+                    <th class="px-4 py-3">用户</th>
+                    <th class="px-4 py-3">状态</th>
+                    <th class="px-4 py-3">余额</th>
+                    <th class="px-4 py-3">欠费</th>
+                    <th class="px-4 py-3">待确认充值</th>
+                    <th class="px-4 py-3">托管 key</th>
+                    <th class="px-4 py-3">更新</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
+                ${items.map((item) => `
+                    <tr>
+                        <td class="px-4 py-3">${escapeHtml(item.phone || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(billingStatusText(item.status))}</td>
+                        <td class="px-4 py-3">${escapeHtml(item.balanceNanos === undefined ? formatCents(item.balanceCents) : formatNanos(item.balanceNanos))}</td>
+                        <td class="px-4 py-3">${escapeHtml(item.debtNanos === undefined ? formatCents(item.debtCents) : formatNanos(item.debtNanos))}</td>
+                        <td class="px-4 py-3">${escapeHtml(item.pendingTopupNanos === undefined ? formatCents(item.pendingTopupCents) : formatNanos(item.pendingTopupNanos))}</td>
+                        <td class="px-4 py-3">${escapeHtml(`${formatNumber(item.managedApiKeyCount || 0)} 个（已用 ${formatNumber(item.usedApiKeyCount || 0)}）`)}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(item.updatedAt))}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderInviteConsoleSummary(summary = {}) {
+    const cards = [
+        ['未使用邀请码', summary.unusedInvites || 0],
+        ['已兑换邀请码', summary.redeemedInvites || 0],
+        ['未使用 API key', summary.unusedApiKeys || 0],
+        ['已使用 API key', summary.usedApiKeys || 0],
+        ['已禁用 API key', summary.disabledApiKeys || 0]
+    ];
+    return cards.map(([label, value]) => `
+        <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
+            <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
+            <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(formatNumber(value))}</p>
+        </article>
+    `).join('');
+}
+
+function renderAdminInviteTable(invites = []) {
+    if (!invites.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无邀请码。</div>';
+    }
+    return `
+        <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
+            <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr><th class="px-4 py-3">邀请码</th><th class="px-4 py-3">状态</th><th class="px-4 py-3">用户</th><th class="px-4 py-3">订单</th><th class="px-4 py-3">创建</th><th class="px-4 py-3">兑换</th></tr>
+            </thead>
+            <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
+                ${invites.map((invite) => `
+                    <tr>
+                        <td class="px-4 py-3 font-mono">${escapeHtml(invite.code)}</td>
+                        <td class="px-4 py-3">${escapeHtml(invite.status === 'redeemed' ? '已兑换' : '未使用')}</td>
+                        <td class="px-4 py-3">${escapeHtml(invite.phone || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(invite.orderId || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(invite.createdAt))}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(invite.redeemedAt))}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderAdminApiKeyPoolTable(apiKeyPool = []) {
+    if (!apiKeyPool.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无 API key 池记录。</div>';
+    }
+    return `
+        <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
+            <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr><th class="px-4 py-3">API key</th><th class="px-4 py-3">状态</th><th class="px-4 py-3">订单</th><th class="px-4 py-3">创建</th><th class="px-4 py-3">使用</th></tr>
+            </thead>
+            <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
+                ${apiKeyPool.map((apiKey) => `
+                    <tr>
+                        <td class="px-4 py-3 font-mono">${escapeHtml(apiKey.apiKeyPreview || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(usageStatusText(apiKey.status))}</td>
+                        <td class="px-4 py-3">${escapeHtml(apiKey.orderId || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(apiKey.createdAt))}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(apiKey.usedAt))}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function renderAdminRecentCharges(charges = []) {
+    if (!charges.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无最近扣费记录。</div>';
+    }
+    return renderCharges(charges, { showPhone: true });
+}
+
+function usageStatusText(status) {
+    const map = {
+        active: '使用中',
+        expired: '已过期',
+        unused: '未使用',
+        disabled: '已禁用',
+        local: '本地',
+        unmanaged: '未托管',
+        used: '已使用'
+    };
+    return map[status] || status || '-';
+}
+
+function usageGroupText(group) {
+    const map = {
+        shop: 'Shop',
+        local: 'Local',
+        unmanaged: '未托管'
+    };
+    return map[group] || group || '-';
+}
+
+function renderUsageSummary(summary) {
+    const cards = [
+        ['今日 token', summary.today_tokens],
+        ['本月 token', summary.month_tokens],
+        ['总 token', summary.total_tokens],
+        ['失败请求', summary.failed_requests]
+    ];
+    return cards.map(([label, value]) => `
+        <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
+            <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
+            <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(formatNumber(value))}</p>
+        </article>
+    `).join('');
+}
+
+function renderUsageItems(items) {
+    if (!items.length) {
+        return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无用量记录。</div>';
+    }
+    return `
+        <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
+            <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
+                <tr>
+                    <th class="px-4 py-3">分组</th>
+                    <th class="px-4 py-3">手机号</th>
+                    <th class="px-4 py-3">API key</th>
+                    <th class="px-4 py-3">状态</th>
+                    <th class="px-4 py-3">今日</th>
+                    <th class="px-4 py-3">本月</th>
+                    <th class="px-4 py-3">总计</th>
+                    <th class="px-4 py-3">请求</th>
+                    <th class="px-4 py-3">最近</th>
+                    <th class="px-4 py-3">模型</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
+                ${items.map((item) => `
+                    <tr>
+                        <td class="px-4 py-3">${escapeHtml(usageGroupText(item.group))}</td>
+                        <td class="px-4 py-3">${escapeHtml(item.phone || '-')}</td>
+                        <td class="px-4 py-3 font-mono">${escapeHtml(item.api_key_preview || '-')}</td>
+                        <td class="px-4 py-3">${escapeHtml(usageStatusText(item.status))}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatNumber(item.today_tokens))}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatNumber(item.month_tokens))}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatNumber(item.total_tokens))}</td>
+                        <td class="px-4 py-3">${escapeHtml(`${item.success_requests || 0}/${item.failed_requests || 0}/${item.total_requests || 0}`)}</td>
+                        <td class="px-4 py-3">${escapeHtml(formatDate(item.last_seen_at))}</td>
+                        <td class="px-4 py-3">${escapeHtml((item.models || []).map((model) => `${model.model}:${formatNumber(model.total_tokens)}`).join(' / ') || '-')}</td>
+                    </tr>
+                `).join('')}
+            </tbody>
+        </table>
+    `;
+}
+
+function initAdminUsagePage() {
+    const refreshButton = document.getElementById('usageRefreshButton');
+    const searchInput = document.getElementById('usageSearchInput');
+    const groupFilter = document.getElementById('usageGroupFilter');
+    const statusFilter = document.getElementById('usageStatusFilter');
+    const summaryRoot = document.getElementById('usageSummaryCards');
+    const billingRoot = document.getElementById('adminBillingUsageCards');
+    const revenueChartsRoot = document.getElementById('adminRevenueCharts');
+    const tableRoot = document.getElementById('usageTable');
+    const recentChargesRoot = document.getElementById('adminRecentCharges');
+    const message = document.getElementById('usageMessage');
+    const importForm = document.getElementById('usageImportForm');
+    const importMonth = document.getElementById('usageImportMonth');
+    const importMessage = document.getElementById('usageImportMessage');
+    const usageImportStatus = document.getElementById('usageImportStatus');
+    if (!refreshButton || !summaryRoot || !tableRoot || !message) return;
+    let latestBilling = {};
+    let revenueRankingPeriod = 'month';
+
+    function renderRevenueCharts() {
+        if (!revenueChartsRoot) return;
+        revenueChartsRoot.innerHTML = renderAdminRevenueCharts(latestBilling, revenueRankingPeriod);
+    }
+
+    async function fetchUsageImportStatus() {
+        if (!usageImportStatus) return;
+        try {
+            const status = await requestJson('/api/admin/usage-import-status');
+            usageImportStatus.innerHTML = `
+                <p>自动导入：${status.enabled ? '已开启' : '未开启'}</p>
+                <p class="mt-1">最近月份：${escapeHtml(status.lastMonth || '-')}，导入 ${escapeHtml(formatNumber(status.lastInserted || 0))}，跳过 ${escapeHtml(formatNumber(status.lastSkipped || 0))}，失败 ${escapeHtml(formatNumber(status.lastFailedLines || 0))}</p>
+                <p class="mt-1">最近运行：${escapeHtml(formatDate(status.lastRunAt))}</p>
+                ${status.lastError ? `<p class="mt-1 text-red-600">${escapeHtml(status.lastError)}</p>` : ''}
+            `;
+        } catch (error) {
+            usageImportStatus.textContent = error.message;
+        }
+    }
+
+    async function fetchUsage() {
+        const params = new URLSearchParams({
+            q: searchInput?.value || '',
+            group: groupFilter?.value || 'all',
+            status: statusFilter?.value || 'all'
+        });
+        message.textContent = '正在刷新...';
+        try {
+            const data = await requestJson(`/api/admin/usage-summary?${params.toString()}`);
+            summaryRoot.innerHTML = renderUsageSummary(data.summary || {});
+            latestBilling = data.billing || {};
+            if (billingRoot) billingRoot.innerHTML = renderBillingUsageCards(latestBilling, { mode: 'adminRevenue' });
+            renderRevenueCharts();
+            tableRoot.innerHTML = renderUsageItems(data.items || []);
+            if (recentChargesRoot) recentChargesRoot.innerHTML = renderAdminRecentCharges(data.billing?.recentCharges || []);
+            message.textContent = `共 ${(data.items || []).length} 条。`;
+        } catch (error) {
+            message.textContent = error.message;
+        } finally {
+            await fetchUsageImportStatus();
+        }
+    }
+
+    if (revenueChartsRoot) {
+        revenueChartsRoot.addEventListener('click', (event) => {
+            const button = event.target.closest('[data-revenue-ranking-period]');
+            if (!button) return;
+            revenueRankingPeriod = button.getAttribute('data-revenue-ranking-period') === 'today' ? 'today' : 'month';
+            renderRevenueCharts();
+        });
+    }
+
+    refreshButton.addEventListener('click', fetchUsage);
+    [searchInput, groupFilter, statusFilter].forEach((element) => {
+        if (!element) return;
+        element.addEventListener('change', fetchUsage);
+    });
+
+    if (importForm && importMonth && importMessage) {
+        importForm.addEventListener('submit', async (event) => {
+            event.preventDefault();
+            const month = importMonth.value;
+            importMessage.textContent = '正在导入...';
+            try {
+                const result = await requestJson('/api/admin/usage-imports', {
+                    method: 'POST',
+                    body: JSON.stringify({ month })
+                });
+                importMessage.textContent = `导入 ${result.inserted}，跳过 ${result.skipped}，失败 ${result.failed_lines}。`;
+                await fetchUsage();
+            } catch (error) {
+                importMessage.textContent = error.message;
+            }
+        });
+    }
+}
+
+function initAdminPasswordResetPage() {
+    const form = document.getElementById('passwordResetCodeForm');
+    const phoneInput = document.getElementById('passwordResetPhone');
+    const message = document.getElementById('passwordResetCodeMessage');
+    const result = document.getElementById('passwordResetCodeResult');
+    if (!form || !phoneInput || !message || !result) return;
+
+    bindPhoneInput(phoneInput);
+
+    form.addEventListener('submit', async (event) => {
+        event.preventDefault();
+        const phone = phoneInput.value.trim();
+        if (!isPhone(phone)) {
+            message.textContent = '请输入有效的中国大陆手机号。';
+            phoneInput.focus();
+            return;
+        }
+        message.textContent = '正在生成...';
+        result.classList.add('hidden');
+        result.innerHTML = '';
+        try {
+            const data = await requestJson('/api/admin/password-reset-codes', {
+                method: 'POST',
+                body: JSON.stringify({ phone })
+            });
+            message.textContent = '重置码已生成，只会显示这一次。';
+            result.classList.remove('hidden');
+            result.innerHTML = `
+                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Reset code</p>
+                <code class="mt-2 block break-all text-lg font-medium text-primary dark:text-dark-text">${escapeHtml(data.code)}</code>
+                <p class="mt-3 text-sm text-text-muted dark:text-dark-text-muted">手机号：${escapeHtml(data.phone)}，有效期至 ${escapeHtml(formatDate(data.expiresAt))}。</p>
+            `;
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+function initAdminAccountBalancesPage() {
+    const searchInput = document.getElementById('adminBalanceSearchInput');
+    const statusFilter = document.getElementById('adminBalanceStatusFilter');
+    const summaryRoot = document.getElementById('adminBalanceSummary');
+    const tableRoot = document.getElementById('adminBalanceTable');
+    const message = document.getElementById('adminBalanceMessage');
+    if (!summaryRoot || !tableRoot || !message) return null;
+
+    async function fetchAccountBalances() {
+        const params = new URLSearchParams({
+            q: searchInput?.value || '',
+            status: statusFilter?.value || 'all'
+        });
+        message.textContent = '正在刷新余额...';
+        try {
+            const data = await requestJson(`/api/admin/account-balances?${params.toString()}`);
+            summaryRoot.innerHTML = renderAdminBalanceSummary(data.summary || {});
+            tableRoot.innerHTML = renderAdminBalanceTable(data.items || []);
+            message.textContent = `共 ${(data.items || []).length} 个账号。`;
+        } catch (error) {
+            summaryRoot.innerHTML = '';
+            tableRoot.innerHTML = '';
+            message.textContent = error.message;
+        }
+    }
+
+    searchInput?.addEventListener('input', fetchAccountBalances);
+    statusFilter?.addEventListener('change', fetchAccountBalances);
+    fetchAccountBalances();
+    return fetchAccountBalances;
+}
+
+function initAdminTopupPage(options = {}) {
+    const statusFilter = document.getElementById('adminTopupStatusFilter');
+    const tableRoot = document.getElementById('adminTopupTable');
+    const message = document.getElementById('adminTopupMessage');
+    if (!statusFilter || !tableRoot || !message) return null;
+
+    async function fetchTopups() {
+        message.textContent = '正在刷新...';
+        try {
+            const data = await requestJson(`/api/admin/topups?status=${encodeURIComponent(statusFilter.value)}`);
+            tableRoot.innerHTML = renderAdminTopups(data.topups || []);
+            message.textContent = `共 ${(data.topups || []).length} 条。`;
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    }
+
+    tableRoot.addEventListener('click', async (event) => {
+        const approveButton = event.target.closest('[data-approve-topup]');
+        const rejectButton = event.target.closest('[data-reject-topup]');
+        if (!approveButton && !rejectButton) return;
+        const row = event.target.closest('[data-topup-id]');
+        const id = row?.getAttribute('data-topup-id');
+        if (!id) return;
+        const adminNote = row.querySelector('[data-admin-note]')?.value || '';
+        const confirmedAmount = row.querySelector('[data-confirmed-amount]')?.value || '';
+        message.textContent = approveButton ? '正在确认入账...' : '正在拒绝申请...';
+        try {
+            if (approveButton) {
+                await requestJson(`/api/admin/topups/${encodeURIComponent(id)}/approve`, {
+                    method: 'POST',
+                    body: JSON.stringify({ confirmedAmount, adminNote })
+                });
+            } else {
+                await requestJson(`/api/admin/topups/${encodeURIComponent(id)}/reject`, {
+                    method: 'POST',
+                    body: JSON.stringify({ adminNote })
+                });
+            }
+            await fetchTopups();
+            await options.onBalanceChanged?.();
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+
+    statusFilter.addEventListener('change', fetchTopups);
+    fetchTopups();
+    return fetchTopups;
+}
+
+function initAdminInvitePage() {
+    const createForm = document.getElementById('adminInviteCreateForm');
+    const inviteCount = document.getElementById('adminInviteCount');
+    const createMessage = document.getElementById('adminInviteCreateMessage');
+    const createResult = document.getElementById('adminInviteCreateResult');
+    const importForm = document.getElementById('adminApiKeyImportForm');
+    const apiKeysText = document.getElementById('adminApiKeysText');
+    const importMessage = document.getElementById('adminApiKeyImportMessage');
+    const summaryRoot = document.getElementById('adminInviteConsoleSummary');
+    const inviteTable = document.getElementById('adminInviteTable');
+    const apiKeyPoolTable = document.getElementById('adminApiKeyPoolTable');
+    if (!summaryRoot || !inviteTable || !apiKeyPoolTable) return null;
+
+    async function refreshInviteConsole() {
+        summaryRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在刷新兑换码状态...</p>';
+        try {
+            const data = await requestJson('/api/admin/invite-console');
+            summaryRoot.innerHTML = renderInviteConsoleSummary(data.summary || {});
+            inviteTable.innerHTML = renderAdminInviteTable(data.invites || []);
+            apiKeyPoolTable.innerHTML = renderAdminApiKeyPoolTable(data.apiKeyPool || []);
+        } catch (error) {
+            summaryRoot.innerHTML = '';
+            inviteTable.innerHTML = `<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(error.message)}</div>`;
+            apiKeyPoolTable.innerHTML = '';
+        }
+    }
+
+    if (createForm && inviteCount && createMessage && createResult) {
+        createForm.addEventListener('submit', async (event) => {
+            event.preventDefault();
+            createMessage.textContent = '正在生成...';
+            createResult.innerHTML = '';
+            try {
+                const data = await requestJson('/api/admin/session-invites', {
+                    method: 'POST',
+                    body: JSON.stringify({ count: inviteCount.value })
+                });
+                createMessage.textContent = `已生成 ${(data.invites || []).length} 个邀请码。`;
+                createResult.innerHTML = (data.invites || []).map((invite) => `
+                    <code class="block break-all rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface px-3 py-2 text-sm text-primary dark:text-dark-text">${escapeHtml(invite.code)}</code>
+                `).join('');
+                await refreshInviteConsole();
+            } catch (error) {
+                createMessage.textContent = error.message;
+            }
+        });
+    }
+
+    if (importForm && apiKeysText && importMessage) {
+        importForm.addEventListener('submit', async (event) => {
+            event.preventDefault();
+            const text = apiKeysText.value.trim();
+            if (!text) {
+                importMessage.textContent = '请输入 API key。';
+                apiKeysText.focus();
+                return;
+            }
+            importMessage.textContent = '正在导入...';
+            try {
+                const data = await requestJson('/api/admin/session-api-keys', {
+                    method: 'POST',
+                    body: JSON.stringify({ apiKeysText: text })
+                });
+                apiKeysText.value = '';
+                importMessage.textContent = `已导入 ${(data.apiKeys || []).length} 个 API key。`;
+                await refreshInviteConsole();
+            } catch (error) {
+                importMessage.textContent = error.message;
+            }
+        });
+    }
+
+    refreshInviteConsole();
+    return refreshInviteConsole;
+}
+
+function initAdminPage() {
+    initCollapsibleSections(document);
+
+    const refreshAdminInvites = initAdminInvitePage();
+    initAdminUsagePage();
+    initAdminPasswordResetPage();
+    const refreshAdminBalances = initAdminAccountBalancesPage();
+    const refreshAdminTopups = initAdminTopupPage({ onBalanceChanged: refreshAdminBalances });
+    const businessRefreshButton = document.getElementById('adminBusinessRefreshButton');
+    const refreshAdminBusiness = async () => {
+        businessRefreshButton?.setAttribute('aria-busy', 'true');
+        try {
+            await Promise.all([
+                refreshAdminInvites?.(),
+                refreshAdminTopups?.(),
+                refreshAdminBalances?.()
+            ].filter(Boolean));
+        } finally {
+            businessRefreshButton?.removeAttribute('aria-busy');
+        }
+    };
+    if (businessRefreshButton) {
+        businessRefreshButton.addEventListener('click', refreshAdminBusiness);
+    }
+    const refreshButton = document.getElementById('usageRefreshButton');
+    if (refreshButton) {
+        refreshButton.click();
+    }
+    const logoutButton = document.getElementById('logoutButton');
+    if (logoutButton) {
+        logoutButton.addEventListener('click', async () => {
+            try {
+                await requestJson('/api/auth/logout', { method: 'POST' });
+            } finally {
+                window.location.href = '/shop/login/';
+            }
+        });
+    }
+}
+
+    window.YuiShopAdmin = {
+        renderAdminBalanceSummary,
+        renderAdminTopups,
+        renderAdminBalanceTable,
+        renderInviteConsoleSummary,
+        renderAdminInviteTable,
+        renderAdminApiKeyPoolTable,
+        renderAdminRecentCharges,
+        usageStatusText,
+        usageGroupText,
+        renderUsageSummary,
+        renderUsageItems,
+        initAdminUsagePage,
+        initCollapsibleSections,
+        initAdminPasswordResetPage,
+        initAdminAccountBalancesPage,
+        initAdminTopupPage,
+        initAdminInvitePage,
+        initAdminPage
+    };
+})();
diff --git a/shop/js/auth.js b/shop/js/auth.js
new file mode 100644
index 0000000..348ee34
--- /dev/null
+++ b/shop/js/auth.js
@@ -0,0 +1,156 @@
+// Shop 登录、注册和密码重置页面逻辑。
+(function() {
+    const {
+        bindPhoneInput,
+        isPhone,
+        isStrongPassword,
+        requestJson
+    } = window.YuiShopCore;
+
+function normalizeResetCodeInput(input) {
+    if (!input) return;
+    input.addEventListener('input', () => {
+        input.value = input.value.toUpperCase().replace(/[^A-Z0-9-]/g, '').slice(0, 18);
+    });
+}
+
+function initResetPasswordPage() {
+    const resetForm = document.getElementById('passwordResetForm');
+    const phoneInput = document.getElementById('resetPhone');
+    const codeInput = document.getElementById('resetPasswordCode');
+    const passwordInput = document.getElementById('resetNewPassword');
+    const confirmInput = document.getElementById('resetConfirmPassword');
+    const message = document.getElementById('passwordResetMessage');
+    if (!resetForm || !phoneInput || !codeInput || !passwordInput || !confirmInput || !message) return;
+
+    bindPhoneInput(phoneInput);
+    normalizeResetCodeInput(codeInput);
+
+    resetForm.addEventListener('submit', async (event) => {
+        event.preventDefault();
+        const phone = phoneInput.value.trim();
+        const code = codeInput.value.trim();
+        const password = passwordInput.value;
+        const confirmPassword = confirmInput.value;
+        if (!isPhone(phone)) {
+            message.textContent = '请输入有效的中国大陆手机号。';
+            phoneInput.focus();
+            return;
+        }
+        if (!code) {
+            message.textContent = '请输入重置码。';
+            codeInput.focus();
+            return;
+        }
+        if (!isStrongPassword(password)) {
+            message.textContent = '密码至少 8 位，并包含英文大写字母、小写字母和数字。';
+            passwordInput.focus();
+            return;
+        }
+        if (password !== confirmPassword) {
+            message.textContent = '两次输入的密码不一致。';
+            confirmInput.focus();
+            return;
+        }
+
+        message.textContent = '正在重置密码...';
+        try {
+            const data = await requestJson('/api/auth/password-reset', {
+                method: 'POST',
+                body: JSON.stringify({ phone, code, password, confirmPassword })
+            });
+            window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+function initLoginPage() {
+    const form = document.getElementById('loginForm');
+    const phoneInput = document.getElementById('loginPhone');
+    const passwordInput = document.getElementById('loginPassword');
+    const message = document.getElementById('loginMessage');
+    if (!form || !phoneInput || !passwordInput || !message) return;
+
+    bindPhoneInput(phoneInput);
+
+    form.addEventListener('submit', async (event) => {
+        event.preventDefault();
+        const phone = phoneInput.value.trim();
+        const password = passwordInput.value;
+        if (!isPhone(phone)) {
+            message.textContent = '请输入有效的中国大陆手机号。';
+            phoneInput.focus();
+            return;
+        }
+        if (!password) {
+            message.textContent = '请输入密码。';
+            passwordInput.focus();
+            return;
+        }
+
+        message.textContent = '正在登录...';
+        try {
+            const data = await requestJson('/api/auth/login', {
+                method: 'POST',
+                body: JSON.stringify({ phone, password })
+            });
+            window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+function initRegisterPage() {
+    const form = document.getElementById('registerForm');
+    const phoneInput = document.getElementById('registerPhone');
+    const passwordInput = document.getElementById('registerPassword');
+    const confirmInput = document.getElementById('registerConfirmPassword');
+    const message = document.getElementById('registerMessage');
+    if (!form || !phoneInput || !passwordInput || !confirmInput || !message) return;
+
+    bindPhoneInput(phoneInput);
+
+    form.addEventListener('submit', async (event) => {
+        event.preventDefault();
+        const phone = phoneInput.value.trim();
+        const password = passwordInput.value;
+        const confirmPassword = confirmInput.value;
+        if (!isPhone(phone)) {
+            message.textContent = '请输入有效的中国大陆手机号。';
+            phoneInput.focus();
+            return;
+        }
+        if (!isStrongPassword(password)) {
+            message.textContent = '密码至少 8 位，并包含英文大写字母、小写字母和数字。';
+            passwordInput.focus();
+            return;
+        }
+        if (password !== confirmPassword) {
+            message.textContent = '两次输入的密码不一致。';
+            confirmInput.focus();
+            return;
+        }
+
+        message.textContent = '正在注册...';
+        try {
+            const data = await requestJson('/api/auth/register', {
+                method: 'POST',
+                body: JSON.stringify({ phone, password, confirmPassword })
+            });
+            window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
+        } catch (error) {
+            message.textContent = error.message;
+        }
+    });
+}
+
+    window.YuiShopAuth = {
+        normalizeResetCodeInput,
+        initResetPasswordPage,
+        initLoginPage,
+        initRegisterPage
+    };
+})();
diff --git a/shop/js/charts.js b/shop/js/charts.js
new file mode 100644
index 0000000..0e61ad1
--- /dev/null
+++ b/shop/js/charts.js
@@ -0,0 +1,251 @@
+// Shop 前端图表渲染，集中维护收银饼图和金额堆叠柱。
+(function() {
+    const {
+        escapeHtml,
+        formatCompactNumber,
+        formatNanos,
+        formatNumber
+    } = window.YuiShopCore;
+
+    const partClassNames = {
+        cache_hit_input: 'admin-revenue-bar-segment-hit',
+        cache_miss_input: 'admin-revenue-bar-segment-miss',
+        output: 'admin-revenue-bar-segment-output'
+    };
+
+    const partLabels = [
+        ['cache_hit_input', '缓存命中输入'],
+        ['cache_miss_input', '缓存未命中输入'],
+        ['output', '输出 token']
+    ];
+
+    function normalizeChargeParts(rawParts = [], fallbackTotalNanos = 0) {
+        const normalizedParts = partLabels.map(([key, label]) => {
+            const part = rawParts.find((candidate) => candidate.key === key) || { chargeNanos: 0 };
+            return { key, label, chargeNanos: Number(part.chargeNanos || 0) };
+        });
+        const partChargeTotal = normalizedParts.reduce((sum, part) => sum + Number(part.chargeNanos || 0), 0);
+        if (partChargeTotal > 0 || Number(fallbackTotalNanos || 0) <= 0) return normalizedParts;
+        return [
+            { key: 'cache_hit_input', label: '旧格式总金额', chargeNanos: Number(fallbackTotalNanos || 0) },
+            { key: 'cache_miss_input', label: '缓存未命中输入', chargeNanos: 0 },
+            { key: 'output', label: '输出 token', chargeNanos: 0 }
+        ];
+    }
+
+    function renderStackedChargeBars(options = {}) {
+        const items = Array.isArray(options.items) ? options.items : [];
+        const emptyText = options.emptyText || '暂无记录。';
+        const maxBarHeightPx = Number(options.maxBarHeightPx || 140);
+        const maxCharge = Math.max(...items.map((item) => Number(item.chargeNanos || 0)), 1);
+        if (!items.length) {
+            return `<div class="grid h-48 flex-1 place-items-center text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(emptyText)}</div>`;
+        }
+        return items.map((item) => {
+            const chargeNanos = Number(item.chargeNanos || 0);
+            const barHeightPx = chargeNanos > 0
+                ? Math.max(8, Math.round((chargeNanos / maxCharge) * maxBarHeightPx))
+                : 8;
+            const parts = normalizeChargeParts(Array.isArray(item.parts) ? item.parts : [], chargeNanos);
+            const segments = parts.map((part) => {
+                const partChargeNanos = Number(part.chargeNanos || 0);
+                const segmentHeightPx = partChargeNanos > 0
+                    ? Math.max(2, Math.round((partChargeNanos / maxCharge) * maxBarHeightPx))
+                    : 0;
+                return `
+                    <div class="admin-revenue-bar-segment ${partClassNames[part.key]}" style="height:${segmentHeightPx}px" title="${escapeHtml(part.label)}：${escapeHtml(formatNanos(partChargeNanos))}"></div>
+                `;
+            }).join('');
+            return `
+                <div class="admin-revenue-bar-item">
+                    <span class="text-xs font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(chargeNanos))}</span>
+                    <div class="admin-revenue-bar admin-revenue-bar-stack" style="height:${barHeightPx}px">${segments}</div>
+                    <span class="admin-revenue-phone-label">${escapeHtml(item.label || '-')}</span>
+                </div>
+            `;
+        }).join('');
+    }
+
+    function renderChargePartsLegend() {
+        return partLabels.map(([key, label]) => `
+            <span class="inline-flex items-center gap-2">
+                <span class="admin-revenue-legend-dot ${partClassNames[key]}"></span>
+                <span>${escapeHtml(label)}</span>
+            </span>
+        `).join('');
+    }
+
+    function renderRevenuePieChart(title, parts = [], totalNanos = 0) {
+        const colors = ['#111827', '#6b7280', '#d1d5db'];
+        const total = Number(totalNanos || 0);
+        const segmentTotal = parts.reduce((sum, part) => sum + Number(part.chargeNanos || 0), 0);
+        let cursor = 0;
+        const segments = segmentTotal > 0
+            ? parts.map((part, index) => {
+                const value = Number(part.chargeNanos || 0);
+                const start = cursor;
+                const end = cursor + (value / segmentTotal) * 100;
+                cursor = end;
+                return `${colors[index % colors.length]} ${start.toFixed(2)}% ${end.toFixed(2)}%`;
+            }).join(', ')
+            : '#e5e7eb 0% 100%';
+        const legend = parts.map((part, index) => `
+            <li class="flex items-center justify-between gap-3 text-sm">
+                <span class="flex min-w-0 items-center gap-2">
+                    <span class="admin-revenue-legend-dot" style="background:${colors[index % colors.length]}"></span>
+                    <span class="truncate">${escapeHtml(part.label)}</span>
+                </span>
+                <span class="shrink-0 font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(part.chargeNanos))}</span>
+            </li>
+            <li class="-mt-2 mb-1 ml-5 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(formatNumber(part.tokens))} tokens</li>
+        `).join('');
+        return `
+            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
+                <div class="flex flex-col gap-5 sm:flex-row sm:items-center">
+                    <div class="admin-revenue-pie" style="width:9rem;height:9rem;display:grid;place-items:center;flex-shrink:0;border-radius:9999px;background:conic-gradient(${segments})">
+                        <div class="admin-revenue-pie-inner" style="width:5rem;height:5rem;display:grid;place-items:center;border-radius:9999px">
+                            <span class="text-sm font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(total))}</span>
+                        </div>
+                    </div>
+                    <div class="min-w-0 flex-1">
+                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(title)}</p>
+                        <ul class="mt-4 space-y-2">${legend || '<li class="text-sm text-text-muted dark:text-dark-text-muted">暂无收银记录。</li>'}</ul>
+                    </div>
+                </div>
+            </article>
+        `;
+    }
+
+    function renderCustomerSpendingBars(rankings = {}, period = 'month') {
+        const items = Array.isArray(rankings[period]) ? rankings[period] : [];
+        const bars = renderStackedChargeBars({
+            items: items.slice(0, 12).map((item) => ({
+                label: item.phone || '-',
+                chargeNanos: item.chargeNanos,
+                parts: item.parts
+            })),
+            emptyText: '暂无 Shop 用户消费记录。'
+        });
+        return `
+            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
+                <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+                    <div>
+                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Ranking</p>
+                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">Shop 用户消费排行</h3>
+                    </div>
+                    <div class="inline-flex w-fit rounded-md border border-border-subtle dark:border-dark-border p-1 text-sm">
+                        <button class="${period === 'today' ? 'bg-primary text-white dark:bg-dark-text dark:text-dark-bg' : 'text-text-muted dark:text-dark-text-muted'} rounded px-3 py-1" type="button" data-revenue-ranking-period="today">今日</button>
+                        <button class="${period === 'month' ? 'bg-primary text-white dark:bg-dark-text dark:text-dark-bg' : 'text-text-muted dark:text-dark-text-muted'} rounded px-3 py-1" type="button" data-revenue-ranking-period="month">本月</button>
+                    </div>
+                </div>
+                <div class="admin-revenue-ranking-legend mt-4">${renderChargePartsLegend()}</div>
+                <div class="mt-5 overflow-x-auto pb-8">
+                    <div class="admin-revenue-bars" style="display:flex;align-items:flex-end;gap:1rem;min-width:34rem;height:14rem;padding:1rem 1rem 0;border-left:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5">
+                        ${bars}
+                    </div>
+                </div>
+            </article>
+        `;
+    }
+
+    function renderAccountWeeklySpendingChart(weeklySpending = {}, selectedWeekStart = '') {
+        const weeks = weeklySpending.weeks || {};
+        const weekStarts = Array.isArray(weeklySpending.weekStarts)
+            ? weeklySpending.weekStarts.filter((weekStart) => weeks[weekStart])
+            : Object.keys(weeks).sort();
+        const effectiveWeekStart = weekStarts.includes(selectedWeekStart)
+            ? selectedWeekStart
+            : (weeklySpending.currentWeekStart && weeks[weeklySpending.currentWeekStart]
+                ? weeklySpending.currentWeekStart
+                : weekStarts[weekStarts.length - 1]);
+        const selectedIndex = weekStarts.indexOf(effectiveWeekStart);
+        const selectedWeek = weeks[effectiveWeekStart] || { days: [] };
+        const days = Array.isArray(selectedWeek.days) ? selectedWeek.days : [];
+        const bars = renderStackedChargeBars({
+            items: days.map((day) => ({
+                label: day.label || '',
+                chargeNanos: day.chargeNanos,
+                parts: day.parts
+            })),
+            emptyText: '暂无扣费记录。'
+        });
+        const canPrev = selectedIndex > 0;
+        const canNext = selectedIndex >= 0 && selectedIndex < weekStarts.length - 1;
+        const buttonClass = 'inline-flex h-9 w-9 items-center justify-center rounded-md border border-border-subtle dark:border-dark-border text-primary dark:text-dark-text disabled:cursor-not-allowed disabled:opacity-40';
+        return `
+            <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
+                <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+                    <div>
+                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Weekly billing</p>
+                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">每周消费</h3>
+                        <p class="mt-1 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(selectedWeek.label || '本周')}，合计 ${escapeHtml(formatNanos(selectedWeek.totalChargeNanos))}</p>
+                    </div>
+                    <div class="flex items-center gap-2">
+                        <button class="${buttonClass}" type="button" data-account-week-offset="-1" ${canPrev ? '' : 'disabled'} aria-label="上一周">
+                            <span class="material-symbols-outlined text-base" aria-hidden="true">chevron_left</span>
+                        </button>
+                        <button class="${buttonClass}" type="button" data-account-week-offset="1" ${canNext ? '' : 'disabled'} aria-label="下一周">
+                            <span class="material-symbols-outlined text-base" aria-hidden="true">chevron_right</span>
+                        </button>
+                    </div>
+                </div>
+                <div class="admin-revenue-ranking-legend mt-4">${renderChargePartsLegend()}</div>
+                <div class="mt-5 overflow-x-auto pb-8">
+                    <div class="admin-revenue-bars" style="display:flex;align-items:flex-end;gap:1rem;min-width:34rem;height:14rem;padding:1rem 1rem 0;border-left:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5">
+                        ${bars}
+                    </div>
+                </div>
+            </section>
+        `;
+    }
+
+    function renderAdminRevenueCharts(billing = {}, rankingPeriod = 'month') {
+        return `
+            <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-5">
+                <div class="flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between">
+                    <div>
+                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Revenue</p>
+                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">收银分析</h3>
+                    </div>
+                    <p class="text-sm text-text-muted dark:text-dark-text-muted">只统计 Shop 用户已消费金额，不包含 Local。</p>
+                </div>
+                <div class="mt-5 grid gap-4 lg:grid-cols-2">
+                    ${renderRevenuePieChart('今日收银构成', billing.todayRevenueParts || [], billing.todayChargeNanos)}
+                    ${renderRevenuePieChart('本月收银构成', billing.monthRevenueParts || [], billing.monthChargeNanos)}
+                </div>
+                <div class="mt-4">
+                    ${renderCustomerSpendingBars(billing.customerSpendingRankings || {}, rankingPeriod)}
+                </div>
+            </section>
+        `;
+    }
+
+    function renderBars(items, labelFormatter = (item) => item.bucket) {
+        if (!items.length) {
+            return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无用量记录，用量统计可能最多延迟 1 小时。</p>';
+        }
+        const maxValue = Math.max(...items.map((item) => Number(item.totalTokens || 0)), 1);
+        return `
+            <div class="flex h-48 items-end gap-2">
+                ${items.map((item) => {
+                    const height = Math.max(4, Math.round((Number(item.totalTokens || 0) / maxValue) * 100));
+                    return `
+                        <div class="flex min-w-0 flex-1 flex-col items-center gap-2">
+                            <div class="w-full rounded-t bg-primary dark:bg-dark-text" style="height:${height}%"></div>
+                            <span class="max-w-full truncate text-[10px] text-text-muted dark:text-dark-text-muted" title="${escapeHtml(`${labelFormatter(item)} ${formatCompactNumber(item.totalTokens)} tokens`)}">${escapeHtml(labelFormatter(item))}</span>
+                        </div>
+                    `;
+                }).join('')}
+            </div>
+        `;
+    }
+
+    window.YuiShopCharts = {
+        renderAdminRevenueCharts,
+        renderAccountWeeklySpendingChart,
+        renderBars,
+        renderCustomerSpendingBars,
+        renderRevenuePieChart,
+        renderStackedChargeBars
+    };
+})();
diff --git a/shop/js/core.js b/shop/js/core.js
new file mode 100644
index 0000000..fe4059e
--- /dev/null
+++ b/shop/js/core.js
@@ -0,0 +1,143 @@
+// Shop 前端基础工具，供 Auth、Account、Admin 与图表模块共享。
+(function() {
+    function isPhone(value) {
+        return /^1[3-9]\d{9}$/.test(String(value || '').trim());
+    }
+
+    function bindPhoneInput(input) {
+        if (!input) return;
+        input.addEventListener('input', () => {
+            input.value = input.value.replace(/\D/g, '').slice(0, 11);
+        });
+    }
+
+    function isStrongPassword(value) {
+        const password = String(value || '');
+        return password.length >= 8 && /[a-z]/.test(password) && /[A-Z]/.test(password) && /\d/.test(password);
+    }
+
+    function formatDate(value) {
+        if (!value) return '-';
+        return new Intl.DateTimeFormat('zh-CN', {
+            year: 'numeric',
+            month: '2-digit',
+            day: '2-digit',
+            hour: '2-digit',
+            minute: '2-digit'
+        }).format(new Date(value));
+    }
+
+    function formatPrice(amount) {
+        return `¥${Number(amount).toFixed(2)}`;
+    }
+
+    function formatCents(cents) {
+        return `¥${(Number(cents || 0) / 100).toFixed(2)}`;
+    }
+
+    function formatNanos(nanos) {
+        const amount = Number(nanos || 0) / 1000000000;
+        if (amount === 0) return '¥0.00';
+        return `¥${Math.abs(amount) >= 1 ? amount.toFixed(2) : amount.toFixed(6)}`;
+    }
+
+    function formatNumber(value) {
+        return Number(value || 0).toLocaleString('zh-CN');
+    }
+
+    function formatCompactNumber(value) {
+        const number = Number(value || 0);
+        if (number >= 1000000) return `${(number / 1000000).toFixed(1)}M`;
+        if (number >= 1000) return `${(number / 1000).toFixed(1)}K`;
+        return number.toLocaleString('zh-CN');
+    }
+
+    function escapeHtml(value) {
+        return String(value || '')
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;')
+            .replace(/"/g, '&quot;')
+            .replace(/'/g, '&#39;');
+    }
+
+    function readCookie(name) {
+        return document.cookie
+            .split(';')
+            .map((part) => part.trim())
+            .find((part) => part.startsWith(`${name}=`))
+            ?.slice(name.length + 1) || '';
+    }
+
+    async function requestJson(url, options = {}) {
+        const { headers: optionHeaders, ...fetchOptions } = options;
+        const method = String(fetchOptions.method || 'GET').toUpperCase();
+        const headers = { 'Content-Type': 'application/json', ...(optionHeaders || {}) };
+        if (method !== 'GET' && !headers['x-csrf-token']) {
+            const csrfToken = readCookie('yui_shop_csrf');
+            if (csrfToken) {
+                headers['x-csrf-token'] = decodeURIComponent(csrfToken);
+            }
+        }
+        const response = await fetch(url, {
+            ...fetchOptions,
+            headers,
+            credentials: 'same-origin'
+        });
+        const data = await response.json().catch(() => ({}));
+        if (!response.ok) {
+            const error = new Error(data.message || '请求失败');
+            error.code = data.code || 'REQUEST_FAILED';
+            error.status = response.status;
+            throw error;
+        }
+        return data;
+    }
+
+    function runWhenDomReady(fn) {
+        if (document.readyState === 'loading') {
+            document.addEventListener('DOMContentLoaded', fn, { once: true });
+            return;
+        }
+        fn();
+    }
+
+    function initCollapsibleSections(root = document) {
+        const sections = Array.from(root.querySelectorAll('[data-collapsible-section]'));
+        sections.forEach((section) => {
+            const toggle = section.querySelector('[data-collapsible-toggle]');
+            const content = section.querySelector('[data-collapsible-content]');
+            if (!toggle || !content) return;
+
+            let open = section.dataset.collapsibleDefault !== 'closed';
+            const render = () => {
+                toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
+                toggle.textContent = open ? '收起' : '展开';
+                content.hidden = !open;
+            };
+
+            toggle.addEventListener('click', () => {
+                open = !open;
+                render();
+            });
+            render();
+        });
+    }
+
+    window.YuiShopCore = {
+        bindPhoneInput,
+        escapeHtml,
+        formatCents,
+        formatCompactNumber,
+        formatDate,
+        formatNanos,
+        formatNumber,
+        formatPrice,
+        isPhone,
+        isStrongPassword,
+        initCollapsibleSections,
+        readCookie,
+        requestJson,
+        runWhenDomReady
+    };
+})();
diff --git a/shop/js/legacy-redirects.js b/shop/js/legacy-redirects.js
new file mode 100644
index 0000000..a38d035
--- /dev/null
+++ b/shop/js/legacy-redirects.js
@@ -0,0 +1,13 @@
+// Shop 旧购买和支付页面统一跳转到账户页。
+(function() {
+    function redirectToAccount() {
+        window.location.replace('/shop/account/');
+    }
+
+    window.YuiShopLegacyRedirects = {
+        initOrderPage: redirectToAccount,
+        initPayPage: redirectToAccount,
+        initResultPage: redirectToAccount,
+        initContentPage: redirectToAccount
+    };
+})();
diff --git a/shop/shop.js b/shop/shop.js
index 02de899..c715323 100644
--- a/shop/shop.js
+++ b/shop/shop.js
@@ -1,1633 +1,43 @@
-// 用户通过私下付款获得邀请码，网站负责兑换 API key、展示用量与账务记录。
+// Shop 前端入口，只负责加载页面模块、按路径初始化，并保留旧的 window.YuiShop API。
 (function() {
-    function isPhone(value) {
-        return /^1[3-9]\d{9}$/.test(String(value || '').trim());
-    }
-
-    function bindPhoneInput(input) {
-        if (!input) return;
-        input.addEventListener('input', () => {
-            input.value = input.value.replace(/\D/g, '').slice(0, 11);
-        });
-    }
-
-    function isStrongPassword(value) {
-        const password = String(value || '');
-        return password.length >= 8 && /[a-z]/.test(password) && /[A-Z]/.test(password) && /\d/.test(password);
-    }
-
-    function formatDate(value) {
-        if (!value) return '-';
-        return new Intl.DateTimeFormat('zh-CN', {
-            year: 'numeric',
-            month: '2-digit',
-            day: '2-digit',
-            hour: '2-digit',
-            minute: '2-digit'
-        }).format(new Date(value));
-    }
-
-    function formatPrice(amount) {
-        return `¥${Number(amount).toFixed(2)}`;
-    }
-
-    function formatCents(cents) {
-        return `¥${(Number(cents || 0) / 100).toFixed(2)}`;
-    }
-
-    function formatNanos(nanos) {
-        const amount = Number(nanos || 0) / 1000000000;
-        if (amount === 0) return '¥0.00';
-        return `¥${Math.abs(amount) >= 1 ? amount.toFixed(2) : amount.toFixed(6)}`;
-    }
-
-    function formatNumber(value) {
-        return Number(value || 0).toLocaleString('zh-CN');
-    }
-
-    function formatCompactNumber(value) {
-        const number = Number(value || 0);
-        if (number >= 1000000) return `${(number / 1000000).toFixed(1)}M`;
-        if (number >= 1000) return `${(number / 1000).toFixed(1)}K`;
-        return number.toLocaleString('zh-CN');
-    }
-
-    function statusText(status) {
-        return status === 'active' ? '使用中' : '已失效';
-    }
-
-    function statusClass(status) {
-        return status === 'active'
-            ? 'bg-background-soft dark:bg-dark-surface text-primary dark:text-dark-text'
-            : 'bg-gray-100 dark:bg-dark-surface text-text-muted dark:text-dark-text-muted';
-    }
-
-    function billingStatusText(status) {
-        const map = {
-            available: '可用',
-            empty: '余额为 0',
-            debt: '欠费'
-        };
-        return map[status] || status || '-';
-    }
-
-    function topupStatusText(status) {
-        const map = {
-            pending: '待确认',
-            approved: '已入账',
-            rejected: '已拒绝',
-            cancelled: '已取消'
-        };
-        return map[status] || status || '-';
-    }
-
-    function ledgerEntryText(type) {
-        const map = {
-            topup_approved: '充值入账',
-            api_charge: 'API 扣费',
-            admin_adjustment: '管理员调整',
-            refund: '退款'
-        };
-        return map[type] || type || '-';
-    }
-
-    function chargeStatusText(status) {
-        const map = {
-            charged: '已扣费',
-            failed_no_charge: '失败未扣费',
-            unpriced_no_charge: '未计价',
-            adjusted: '已调整'
-        };
-        return map[status] || status || '-';
-    }
-
-    function escapeHtml(value) {
-        return String(value || '')
-            .replace(/&/g, '&amp;')
-            .replace(/</g, '&lt;')
-            .replace(/>/g, '&gt;')
-            .replace(/"/g, '&quot;')
-            .replace(/'/g, '&#39;');
-    }
-
-    function readCookie(name) {
-        return document.cookie
-            .split(';')
-            .map((part) => part.trim())
-            .find((part) => part.startsWith(`${name}=`))
-            ?.slice(name.length + 1) || '';
-    }
-
-    async function requestJson(url, options = {}) {
-        const { headers: optionHeaders, ...fetchOptions } = options;
-        const method = String(fetchOptions.method || 'GET').toUpperCase();
-        const headers = { 'Content-Type': 'application/json', ...(optionHeaders || {}) };
-        if (method !== 'GET' && !headers['x-csrf-token']) {
-            const csrfToken = readCookie('yui_shop_csrf');
-            if (csrfToken) {
-                headers['x-csrf-token'] = decodeURIComponent(csrfToken);
-            }
-        }
-        const response = await fetch(url, {
-            ...fetchOptions,
-            headers,
-            credentials: 'same-origin'
-        });
-        const data = await response.json().catch(() => ({}));
-        if (!response.ok) {
-            const error = new Error(data.message || '请求失败');
-            error.code = data.code || 'REQUEST_FAILED';
-            error.status = response.status;
-            throw error;
-        }
-        return data;
-    }
-
-    function renderOrderCard(order, options = {}) {
-        const key = options.showFullKey ? order.apiKey : order.apiKeyPreview;
-        const copyButton = options.showFullKey
-            ? '<button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text" type="button" data-copy-key>复制 API key</button>'
-            : options.revealKey
-                ? '<button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text" type="button" data-reveal-api-key>复制完整 API key</button>'
-            : '';
-
-        if (options.compactAccountOrder) {
-            return `
-                <article class="border border-border-subtle dark:border-dark-border rounded-lg bg-white dark:bg-dark-card p-5 md:p-6" data-order-id="${escapeHtml(order.id)}">
-                    <div class="rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
-                        <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">API key</p>
-                        <code class="mt-2 block break-all text-sm text-primary dark:text-dark-text" data-api-key>${escapeHtml(key || '-')}</code>
-                    </div>
-                    <dl class="mt-5 text-sm">
-                        <div>
-                            <dt class="text-text-muted dark:text-dark-text-muted">兑换时间</dt>
-                            <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.redeemedAt))}</dd>
-                        </div>
-                    </dl>
-                    ${copyButton ? `<div class="mt-5">${copyButton}</div>` : ''}
-                </article>
-            `;
-        }
-
-        return `
-            <article class="border border-border-subtle dark:border-dark-border rounded-lg bg-white dark:bg-dark-card p-5 md:p-6" data-order-id="${escapeHtml(order.id)}">
-                <div class="flex flex-col md:flex-row md:items-start md:justify-between gap-5">
-                    <div>
-                        <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">${escapeHtml(order.id)}</p>
-                        <h2 class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(order.productName)}</h2>
-                        <p class="mt-2 text-sm text-text-muted dark:text-dark-text-muted">API key 已绑定到账户，按实际使用量计费。</p>
-                    </div>
-                    <span class="w-fit rounded-full border border-border-subtle dark:border-dark-border px-3 py-1 text-xs ${statusClass(order.status)}">${escapeHtml(statusText(order.status))}</span>
-                </div>
-                <div class="mt-5 rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
-                    <p class="text-xs uppercase tracking-[0.2em] text-text-muted dark:text-dark-text-muted">API key</p>
-                    <code class="mt-2 block break-all text-sm text-primary dark:text-dark-text" data-api-key>${escapeHtml(key || '-')}</code>
-                </div>
-                <dl class="mt-5 grid gap-3 text-sm md:grid-cols-2">
-                    <div>
-                        <dt class="text-text-muted dark:text-dark-text-muted">手机号</dt>
-                        <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(order.phone)}</dd>
-                    </div>
-                    <div>
-                        <dt class="text-text-muted dark:text-dark-text-muted">金额</dt>
-                        <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatPrice(order.amount))}</dd>
-                    </div>
-                    <div>
-                        <dt class="text-text-muted dark:text-dark-text-muted">兑换时间</dt>
-                        <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.redeemedAt))}</dd>
-                    </div>
-                    <div>
-                        <dt class="text-text-muted dark:text-dark-text-muted">失效时间</dt>
-                        <dd class="mt-1 font-medium text-primary dark:text-dark-text">${escapeHtml(formatDate(order.expiresAt))}</dd>
-                    </div>
-                </dl>
-                ${copyButton ? `<div class="mt-5">${copyButton}</div>` : ''}
-            </article>
-        `;
-    }
-
-    function bindCopy(root) {
-        const button = root.querySelector('[data-copy-key]');
-        const revealButton = root.querySelector('[data-reveal-api-key]');
-        const key = root.querySelector('[data-api-key]')?.textContent || '';
-        if (!button && !revealButton) return;
-
-        if (button && key) button.addEventListener('click', async () => {
-            await navigator.clipboard.writeText(key);
-            button.textContent = '已复制';
-            setTimeout(() => {
-                button.textContent = '复制 API key';
-            }, 1400);
-        });
-
-        if (revealButton) revealButton.addEventListener('click', async () => {
-            const orderId = root.getAttribute('data-order-id') || '';
-            if (!orderId) return;
-            revealButton.textContent = '正在复制...';
-            try {
-                const data = await requestJson(`/api/account/orders/${encodeURIComponent(orderId)}/reveal-api-key`, {
-                    method: 'POST',
-                    body: '{}'
-                });
-                await navigator.clipboard.writeText(data.apiKey || '');
-                revealButton.textContent = '已复制';
-            } catch (error) {
-                revealButton.textContent = error.message || '复制失败';
-            }
-            setTimeout(() => {
-                revealButton.textContent = '复制完整 API key';
-            }, 1400);
-        });
-    }
-
-    function renderBillingUsageCards(billing = {}, options = {}) {
-        const adminRevenue = options.mode === 'adminRevenue';
-        const cards = [
-            [adminRevenue ? '今日收银' : '今日消费', formatNanos(billing.todayChargeNanos), adminRevenue ? '今天收银多少钱' : '今日已扣费'],
-            [adminRevenue ? '本月收银' : '本月消费', formatNanos(billing.monthChargeNanos), adminRevenue ? '本月一共收了多少钱' : '本月已扣费'],
-            ['缓存命中输入', formatNumber(billing.cacheHitInputTokens), '本月 token'],
-            ['缓存未命中输入', formatNumber(billing.cacheMissInputTokens), '本月 token'],
-            ['输出 token', formatNumber(billing.outputTokens), '本月 token']
-        ];
-        return cards.map(([label, value, hint]) => `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
-                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
-                <p class="mt-2 text-xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
-                <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
-            </article>
-        `).join('');
-    }
-
-    function renderRevenuePieChart(title, parts = [], totalNanos = 0) {
-        const colors = ['#111827', '#6b7280', '#d1d5db'];
-        const total = Number(totalNanos || 0);
-        const segmentTotal = parts.reduce((sum, part) => sum + Number(part.chargeNanos || 0), 0);
-        let cursor = 0;
-        const segments = segmentTotal > 0
-            ? parts.map((part, index) => {
-                const value = Number(part.chargeNanos || 0);
-                const start = cursor;
-                const end = cursor + (value / segmentTotal) * 100;
-                cursor = end;
-                return `${colors[index % colors.length]} ${start.toFixed(2)}% ${end.toFixed(2)}%`;
-            }).join(', ')
-            : '#e5e7eb 0% 100%';
-        const legend = parts.map((part, index) => `
-            <li class="flex items-center justify-between gap-3 text-sm">
-                <span class="flex min-w-0 items-center gap-2">
-                    <span class="admin-revenue-legend-dot" style="background:${colors[index % colors.length]}"></span>
-                    <span class="truncate">${escapeHtml(part.label)}</span>
-                </span>
-                <span class="shrink-0 font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(part.chargeNanos))}</span>
-            </li>
-            <li class="-mt-2 mb-1 ml-5 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(formatNumber(part.tokens))} tokens</li>
-        `).join('');
-        return `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
-                <div class="flex flex-col gap-5 sm:flex-row sm:items-center">
-                    <div class="admin-revenue-pie" style="width:9rem;height:9rem;display:grid;place-items:center;flex-shrink:0;border-radius:9999px;background:conic-gradient(${segments})">
-                        <div class="admin-revenue-pie-inner" style="width:5rem;height:5rem;display:grid;place-items:center;border-radius:9999px">
-                            <span class="text-sm font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(total))}</span>
-                        </div>
-                    </div>
-                    <div class="min-w-0 flex-1">
-                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(title)}</p>
-                        <ul class="mt-4 space-y-2">${legend || '<li class="text-sm text-text-muted dark:text-dark-text-muted">暂无收银记录。</li>'}</ul>
-                    </div>
-                </div>
-            </article>
-        `;
-    }
-
-    function renderCustomerSpendingBars(rankings = {}, period = 'month') {
-        const partClassNames = {
-            cache_hit_input: 'admin-revenue-bar-segment-hit',
-            cache_miss_input: 'admin-revenue-bar-segment-miss',
-            output: 'admin-revenue-bar-segment-output'
-        };
-        const partLabels = [
-            ['cache_hit_input', '缓存命中输入'],
-            ['cache_miss_input', '缓存未命中输入'],
-            ['output', '输出 token']
-        ];
-        const items = Array.isArray(rankings[period]) ? rankings[period] : [];
-        const maxCharge = Math.max(...items.map((item) => Number(item.chargeNanos || 0)), 1);
-        const maxBarHeightPx = 140;
-        const bars = items.length ? items.slice(0, 12).map((item) => {
-            const barHeightPx = Math.max(8, Math.round((Number(item.chargeNanos || 0) / maxCharge) * maxBarHeightPx));
-            const rawParts = Array.isArray(item.parts) ? item.parts : [];
-            const normalizedParts = partLabels.map(([key, label]) => {
-                const part = rawParts.find((candidate) => candidate.key === key) || { chargeNanos: 0 };
-                return { key, label, chargeNanos: Number(part.chargeNanos || 0) };
-            });
-            const partChargeTotal = normalizedParts.reduce((sum, part) => sum + Number(part.chargeNanos || 0), 0);
-            const legacyTotalPart = [
-                { key: 'cache_hit_input', label: '旧格式总金额', chargeNanos: Number(item.chargeNanos || 0) },
-                { key: 'cache_miss_input', label: '缓存未命中输入', chargeNanos: 0 },
-                { key: 'output', label: '输出 token', chargeNanos: 0 }
-            ];
-            const effectiveParts = partChargeTotal > 0 ? normalizedParts : legacyTotalPart;
-            const segments = effectiveParts.map((part) => {
-                const chargeNanos = Number(part.chargeNanos || 0);
-                const segmentHeightPx = chargeNanos > 0
-                    ? Math.max(2, Math.round((chargeNanos / maxCharge) * maxBarHeightPx))
-                    : 0;
-                return `
-                    <div class="admin-revenue-bar-segment ${partClassNames[part.key]}" style="height:${segmentHeightPx}px" title="${escapeHtml(part.label)}：${escapeHtml(formatNanos(chargeNanos))}"></div>
-                `;
-            }).join('');
-            return `
-                <div class="admin-revenue-bar-item">
-                    <span class="text-xs font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(item.chargeNanos))}</span>
-                    <div class="admin-revenue-bar admin-revenue-bar-stack" style="height:${barHeightPx}px">${segments}</div>
-                    <span class="admin-revenue-phone-label">${escapeHtml(item.phone || '-')}</span>
-                </div>
-            `;
-        }).join('') : '<div class="grid h-48 flex-1 place-items-center text-sm text-text-muted dark:text-dark-text-muted">暂无 Shop 用户消费记录。</div>';
-        const legend = partLabels.map(([key, label]) => `
-            <span class="inline-flex items-center gap-2">
-                <span class="admin-revenue-legend-dot ${partClassNames[key]}"></span>
-                <span>${escapeHtml(label)}</span>
-            </span>
-        `).join('');
-        return `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
-                <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-                    <div>
-                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Ranking</p>
-                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">Shop 用户消费排行</h3>
-                    </div>
-                    <div class="inline-flex w-fit rounded-md border border-border-subtle dark:border-dark-border p-1 text-sm">
-                        <button class="${period === 'today' ? 'bg-primary text-white dark:bg-dark-text dark:text-dark-bg' : 'text-text-muted dark:text-dark-text-muted'} rounded px-3 py-1" type="button" data-revenue-ranking-period="today">今日</button>
-                        <button class="${period === 'month' ? 'bg-primary text-white dark:bg-dark-text dark:text-dark-bg' : 'text-text-muted dark:text-dark-text-muted'} rounded px-3 py-1" type="button" data-revenue-ranking-period="month">本月</button>
-                    </div>
-                </div>
-                <div class="admin-revenue-ranking-legend mt-4">${legend}</div>
-                <div class="mt-5 overflow-x-auto pb-8">
-                    <div class="admin-revenue-bars" style="display:flex;align-items:flex-end;gap:1rem;min-width:34rem;height:14rem;padding:1rem 1rem 0;border-left:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5">
-                        ${bars}
-                    </div>
-                </div>
-            </article>
-        `;
-    }
-
-    function renderAccountWeeklySpendingChart(weeklySpending = {}, selectedWeekStart = '') {
-        const partClassNames = {
-            cache_hit_input: 'admin-revenue-bar-segment-hit',
-            cache_miss_input: 'admin-revenue-bar-segment-miss',
-            output: 'admin-revenue-bar-segment-output'
-        };
-        const partLabels = [
-            ['cache_hit_input', '缓存命中输入'],
-            ['cache_miss_input', '缓存未命中输入'],
-            ['output', '输出 token']
-        ];
-        const weeks = weeklySpending.weeks || {};
-        const weekStarts = Array.isArray(weeklySpending.weekStarts)
-            ? weeklySpending.weekStarts.filter((weekStart) => weeks[weekStart])
-            : Object.keys(weeks).sort();
-        const effectiveWeekStart = weekStarts.includes(selectedWeekStart)
-            ? selectedWeekStart
-            : (weeklySpending.currentWeekStart && weeks[weeklySpending.currentWeekStart]
-                ? weeklySpending.currentWeekStart
-                : weekStarts[weekStarts.length - 1]);
-        const selectedIndex = weekStarts.indexOf(effectiveWeekStart);
-        const selectedWeek = weeks[effectiveWeekStart] || { days: [] };
-        const days = Array.isArray(selectedWeek.days) ? selectedWeek.days : [];
-        const maxCharge = Math.max(...days.map((day) => Number(day.chargeNanos || 0)), 1);
-        const maxBarHeightPx = 140;
-        const bars = days.length ? days.map((day) => {
-            const dayCharge = Number(day.chargeNanos || 0);
-            const barHeightPx = dayCharge > 0 ? Math.max(8, Math.round((dayCharge / maxCharge) * maxBarHeightPx)) : 8;
-            const rawParts = Array.isArray(day.parts) ? day.parts : [];
-            const normalizedParts = partLabels.map(([key, label]) => {
-                const part = rawParts.find((candidate) => candidate.key === key) || { chargeNanos: 0 };
-                return { key, label, chargeNanos: Number(part.chargeNanos || 0) };
-            });
-            const segments = normalizedParts.map((part) => {
-                const chargeNanos = Number(part.chargeNanos || 0);
-                const segmentHeightPx = chargeNanos > 0
-                    ? Math.max(2, Math.round((chargeNanos / maxCharge) * maxBarHeightPx))
-                    : 0;
-                return `
-                    <div class="admin-revenue-bar-segment ${partClassNames[part.key]}" style="height:${segmentHeightPx}px" title="${escapeHtml(part.label)}：${escapeHtml(formatNanos(chargeNanos))}"></div>
-                `;
-            }).join('');
-            return `
-                <div class="admin-revenue-bar-item">
-                    <span class="text-xs font-medium text-primary dark:text-dark-text">${escapeHtml(formatNanos(day.chargeNanos))}</span>
-                    <div class="admin-revenue-bar admin-revenue-bar-stack" style="height:${barHeightPx}px">${segments}</div>
-                    <span class="admin-revenue-phone-label">${escapeHtml(day.label || '')}</span>
-                </div>
-            `;
-        }).join('') : '<div class="grid h-48 flex-1 place-items-center text-sm text-text-muted dark:text-dark-text-muted">暂无扣费记录。</div>';
-        const legend = partLabels.map(([key, label]) => `
-            <span class="inline-flex items-center gap-2">
-                <span class="admin-revenue-legend-dot ${partClassNames[key]}"></span>
-                <span>${escapeHtml(label)}</span>
-            </span>
-        `).join('');
-        const canPrev = selectedIndex > 0;
-        const canNext = selectedIndex >= 0 && selectedIndex < weekStarts.length - 1;
-        const buttonClass = 'inline-flex h-9 w-9 items-center justify-center rounded-md border border-border-subtle dark:border-dark-border text-primary dark:text-dark-text disabled:cursor-not-allowed disabled:opacity-40';
-        return `
-            <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-5">
-                <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-                    <div>
-                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Weekly billing</p>
-                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">每周消费</h3>
-                        <p class="mt-1 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(selectedWeek.label || '本周')}，合计 ${escapeHtml(formatNanos(selectedWeek.totalChargeNanos))}</p>
-                    </div>
-                    <div class="flex items-center gap-2">
-                        <button class="${buttonClass}" type="button" data-account-week-offset="-1" ${canPrev ? '' : 'disabled'} aria-label="上一周">
-                            <span class="material-symbols-outlined text-base" aria-hidden="true">chevron_left</span>
-                        </button>
-                        <button class="${buttonClass}" type="button" data-account-week-offset="1" ${canNext ? '' : 'disabled'} aria-label="下一周">
-                            <span class="material-symbols-outlined text-base" aria-hidden="true">chevron_right</span>
-                        </button>
-                    </div>
-                </div>
-                <div class="admin-revenue-ranking-legend mt-4">${legend}</div>
-                <div class="mt-5 overflow-x-auto pb-8">
-                    <div class="admin-revenue-bars" style="display:flex;align-items:flex-end;gap:1rem;min-width:34rem;height:14rem;padding:1rem 1rem 0;border-left:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5">
-                        ${bars}
-                    </div>
-                </div>
-            </section>
-        `;
-    }
-
-    function renderAdminRevenueCharts(billing = {}, rankingPeriod = 'month') {
-        return `
-            <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-5">
-                <div class="flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between">
-                    <div>
-                        <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Revenue</p>
-                        <h3 class="mt-2 font-display text-2xl text-primary dark:text-dark-text">收银分析</h3>
-                    </div>
-                    <p class="text-sm text-text-muted dark:text-dark-text-muted">只统计 Shop 用户已消费金额，不包含 Local。</p>
-                </div>
-                <div class="mt-5 grid gap-4 lg:grid-cols-2">
-                    ${renderRevenuePieChart('今日收银构成', billing.todayRevenueParts || [], billing.todayChargeNanos)}
-                    ${renderRevenuePieChart('本月收银构成', billing.monthRevenueParts || [], billing.monthChargeNanos)}
-                </div>
-                <div class="mt-4">
-                    ${renderCustomerSpendingBars(billing.customerSpendingRankings || {}, rankingPeriod)}
-                </div>
-            </section>
-        `;
-    }
-
-    function renderBars(items, labelFormatter = (item) => item.bucket) {
-        if (!items.length) {
-            return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无用量记录，用量统计可能最多延迟 1 小时。</p>';
-        }
-        const maxValue = Math.max(...items.map((item) => Number(item.totalTokens || 0)), 1);
-        return `
-            <div class="flex h-48 items-end gap-2">
-                ${items.map((item) => {
-                    const height = Math.max(4, Math.round((Number(item.totalTokens || 0) / maxValue) * 100));
-                    return `
-                        <div class="flex min-w-0 flex-1 flex-col items-center gap-2">
-                            <div class="w-full rounded-t bg-primary dark:bg-dark-text" style="height:${height}%"></div>
-                            <span class="max-w-full truncate text-[10px] text-text-muted dark:text-dark-text-muted" title="${escapeHtml(`${labelFormatter(item)} ${formatCompactNumber(item.totalTokens)} tokens`)}">${escapeHtml(labelFormatter(item))}</span>
-                        </div>
-                    `;
-                }).join('')}
-            </div>
-        `;
-    }
-
-    function renderBalanceCards(balance = {}) {
-        const cards = [
-            ['当前余额', balance.balanceNanos === undefined ? formatCents(balance.balanceCents) : formatNanos(balance.balanceNanos), billingStatusText(balance.status)],
-            ['欠费金额', balance.debtNanos === undefined ? formatCents(balance.debtCents) : formatNanos(balance.debtNanos), balance.debtCents > 0 ? '需补缴' : '无欠费'],
-            ['待确认充值', balance.pendingTopupNanos === undefined ? formatCents(balance.pendingTopupCents) : formatNanos(balance.pendingTopupNanos), '确认后入账'],
-            ['欠费上限', balance.creditLimitNanos === undefined ? formatCents(balance.creditLimitCents) : formatNanos(balance.creditLimitNanos), balance.creditExceeded ? '已超过' : '默认上限']
-        ];
-        return cards.map(([label, value, hint]) => `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
-                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
-                <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
-                <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
-            </article>
-        `).join('');
-    }
-
-    function formatModelPrice(value) {
-        return `¥${Number(value || 0).toFixed(2)}`;
-    }
-
-    function renderAccountModelOverview(data = {}) {
-        const models = Array.isArray(data.models) ? data.models : [];
-        if (!models.length) {
-            return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无模型价格。</p>';
-        }
-        return `
-            <table class="min-w-full text-sm">
-                <thead class="text-left text-xs uppercase tracking-[0.14em] text-text-muted dark:text-dark-text-muted">
-                    <tr>
-                        <th class="py-2 pr-4">模型</th>
-                        <th class="py-2 pr-4">状态</th>
-                        <th class="py-2 pr-4">缓存命中输入 / 1M</th>
-                        <th class="py-2 pr-4">未命中输入 / 1M</th>
-                        <th class="py-2 pr-4">输出 / 1M</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    ${models.map((model) => `
-                        <tr class="border-t border-border-subtle dark:border-dark-border">
-                            <td class="py-3 pr-4 font-mono text-primary dark:text-dark-text">${escapeHtml(model.id || '-')}</td>
-                            <td class="py-3 pr-4">${escapeHtml(model.available ? '可用' : '价格表')}</td>
-                            <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.cacheHitInputCnyPerMillion))}</td>
-                            <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.cacheMissInputCnyPerMillion))}</td>
-                            <td class="py-3 pr-4 whitespace-nowrap">${escapeHtml(formatModelPrice(model.outputCnyPerMillion))}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderAdminBalanceSummary(summary = {}) {
-        const cards = [
-            ['用户数', formatNumber(summary.userCount || 0), 'Shop 账号'],
-            ['总余额', summary.totalBalanceNanos === undefined ? formatCents(summary.totalBalanceCents) : formatNanos(summary.totalBalanceNanos), '账户当前余额合计'],
-            ['欠费用户', formatNumber(summary.debtUserCount || 0), summary.debtNanos === undefined ? formatCents(summary.debtCents) : formatNanos(summary.debtNanos)],
-            ['待确认充值', summary.pendingTopupNanos === undefined ? formatCents(summary.pendingTopupCents) : formatNanos(summary.pendingTopupNanos), '用户已提交待审核']
-        ];
-        return cards.map(([label, value, hint]) => `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
-                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
-                <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(value)}</p>
-                <p class="mt-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(hint)}</p>
-            </article>
-        `).join('');
-    }
-
-    function renderTopups(topups = []) {
-        if (!topups.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无充值申请。</p>';
-        return `
-            <div class="space-y-3">
-                ${topups.map((topup) => `
-                    <article class="rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface p-4">
-                        <div class="flex items-start justify-between gap-3">
-                            <div>
-                                <p class="font-medium text-primary dark:text-dark-text">${escapeHtml(formatCents(topup.requestedAmountCents))}</p>
-                                <p class="mt-1 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(topup.paymentMethod === 'wechat' ? '微信' : '支付宝')} · ${escapeHtml(formatDate(topup.createdAt))}</p>
-                            </div>
-                            <span class="rounded-full border border-border-subtle dark:border-dark-border px-3 py-1 text-xs text-text-muted dark:text-dark-text-muted">${escapeHtml(topupStatusText(topup.status))}</span>
-                        </div>
-                        ${topup.adminNote ? `<p class="mt-2 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(topup.adminNote)}</p>` : ''}
-                    </article>
-                `).join('')}
-            </div>
-        `;
-    }
-
-    function renderAdminTopups(topups = []) {
-        if (!topups.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无充值申请。</div>';
-        }
-        return `
-            <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
-                <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr>
-                        <th class="px-4 py-3">用户</th>
-                        <th class="px-4 py-3">金额</th>
-                        <th class="px-4 py-3">方式</th>
-                        <th class="px-4 py-3">备注</th>
-                        <th class="px-4 py-3">状态</th>
-                        <th class="px-4 py-3">操作</th>
-                    </tr>
-                </thead>
-                <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
-                    ${topups.map((topup) => `
-                        <tr data-topup-id="${escapeHtml(topup.id)}">
-                            <td class="px-4 py-3">${escapeHtml(topup.phone)}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatCents(topup.requestedAmountCents))}</td>
-                            <td class="px-4 py-3">${escapeHtml(topup.paymentMethod === 'wechat' ? '微信' : '支付宝')}</td>
-                            <td class="px-4 py-3">${escapeHtml(topup.paymentNote || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(topupStatusText(topup.status))}</td>
-                            <td class="px-4 py-3">
-                                ${topup.status === 'pending' ? `
-                                    <div class="flex flex-col gap-2 min-w-40">
-                                        <input class="h-9 rounded-md border-border-subtle dark:border-dark-border bg-white dark:bg-dark-bg text-primary dark:text-dark-text focus:border-primary focus:ring-primary" data-confirmed-amount value="${escapeHtml(String(topup.requestedAmount || ''))}" inputmode="decimal"/>
-                                        <input class="h-9 rounded-md border-border-subtle dark:border-dark-border bg-white dark:bg-dark-bg text-primary dark:text-dark-text focus:border-primary focus:ring-primary" data-admin-note placeholder="管理员备注"/>
-                                        <div class="flex gap-2">
-                                            <button class="btn-primary px-3 py-2 text-xs" type="button" data-approve-topup>确认</button>
-                                            <button class="btn-secondary dark:bg-dark-card dark:border-dark-border dark:text-dark-text px-3 py-2 text-xs" type="button" data-reject-topup>拒绝</button>
-                                        </div>
-                                    </div>
-                                ` : '-'}
-                            </td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderAdminBalanceTable(items = []) {
-        if (!items.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无用户余额记录。</div>';
-        }
-        return `
-            <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
-                <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr>
-                        <th class="px-4 py-3">用户</th>
-                        <th class="px-4 py-3">状态</th>
-                        <th class="px-4 py-3">余额</th>
-                        <th class="px-4 py-3">欠费</th>
-                        <th class="px-4 py-3">待确认充值</th>
-                        <th class="px-4 py-3">托管 key</th>
-                        <th class="px-4 py-3">更新</th>
-                    </tr>
-                </thead>
-                <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
-                    ${items.map((item) => `
-                        <tr>
-                            <td class="px-4 py-3">${escapeHtml(item.phone || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(billingStatusText(item.status))}</td>
-                            <td class="px-4 py-3">${escapeHtml(item.balanceNanos === undefined ? formatCents(item.balanceCents) : formatNanos(item.balanceNanos))}</td>
-                            <td class="px-4 py-3">${escapeHtml(item.debtNanos === undefined ? formatCents(item.debtCents) : formatNanos(item.debtNanos))}</td>
-                            <td class="px-4 py-3">${escapeHtml(item.pendingTopupNanos === undefined ? formatCents(item.pendingTopupCents) : formatNanos(item.pendingTopupNanos))}</td>
-                            <td class="px-4 py-3">${escapeHtml(`${formatNumber(item.managedApiKeyCount || 0)} 个（已用 ${formatNumber(item.usedApiKeyCount || 0)}）`)}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(item.updatedAt))}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderInviteConsoleSummary(summary = {}) {
-        const cards = [
-            ['未使用邀请码', summary.unusedInvites || 0],
-            ['已兑换邀请码', summary.redeemedInvites || 0],
-            ['未使用 API key', summary.unusedApiKeys || 0],
-            ['已使用 API key', summary.usedApiKeys || 0],
-            ['已禁用 API key', summary.disabledApiKeys || 0]
-        ];
-        return cards.map(([label, value]) => `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
-                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
-                <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(formatNumber(value))}</p>
-            </article>
-        `).join('');
-    }
-
-    function renderAdminInviteTable(invites = []) {
-        if (!invites.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无邀请码。</div>';
-        }
-        return `
-            <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
-                <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr><th class="px-4 py-3">邀请码</th><th class="px-4 py-3">状态</th><th class="px-4 py-3">用户</th><th class="px-4 py-3">订单</th><th class="px-4 py-3">创建</th><th class="px-4 py-3">兑换</th></tr>
-                </thead>
-                <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
-                    ${invites.map((invite) => `
-                        <tr>
-                            <td class="px-4 py-3 font-mono">${escapeHtml(invite.code)}</td>
-                            <td class="px-4 py-3">${escapeHtml(invite.status === 'redeemed' ? '已兑换' : '未使用')}</td>
-                            <td class="px-4 py-3">${escapeHtml(invite.phone || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(invite.orderId || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(invite.createdAt))}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(invite.redeemedAt))}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderAdminApiKeyPoolTable(apiKeyPool = []) {
-        if (!apiKeyPool.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无 API key 池记录。</div>';
-        }
-        return `
-            <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
-                <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr><th class="px-4 py-3">API key</th><th class="px-4 py-3">状态</th><th class="px-4 py-3">订单</th><th class="px-4 py-3">创建</th><th class="px-4 py-3">使用</th></tr>
-                </thead>
-                <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
-                    ${apiKeyPool.map((apiKey) => `
-                        <tr>
-                            <td class="px-4 py-3 font-mono">${escapeHtml(apiKey.apiKeyPreview || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(usageStatusText(apiKey.status))}</td>
-                            <td class="px-4 py-3">${escapeHtml(apiKey.orderId || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(apiKey.createdAt))}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(apiKey.usedAt))}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderCharges(charges = [], options = {}) {
-        if (!charges.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无 API 扣费记录。</p>';
-        const phoneHeader = options.showPhone ? '<th class="py-2 pr-3">用户</th>' : '';
-        return `
-            <table class="min-w-full text-sm">
-                <thead class="text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr><th class="py-2 pr-3">时间</th>${phoneHeader}<th class="py-2 pr-3">模型</th><th class="py-2 pr-3">命中输入</th><th class="py-2 pr-3">未命中输入</th><th class="py-2 pr-3">输出</th><th class="py-2 pr-3">Reasoning</th><th class="py-2 pr-3">费用</th><th class="py-2 pr-3">扣后余额</th><th class="py-2">状态</th></tr>
-                </thead>
-                <tbody>
-                    ${charges.map((charge) => `
-                        <tr class="border-t border-border-subtle dark:border-dark-border">
-                            <td class="py-2 pr-3">${escapeHtml(formatDate(charge.createdAt))}</td>
-                            ${options.showPhone ? `<td class="py-2 pr-3">${escapeHtml(charge.phone || '-')}</td>` : ''}
-                            <td class="py-2 pr-3">${escapeHtml(charge.model)}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.cacheHitInputTokens))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.cacheMissInputTokens))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.outputTokens))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatNumber(charge.reasoningTokens))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(charge.chargeNanos === undefined ? formatCents(charge.chargeCents) : formatNanos(charge.chargeNanos))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(charge.balanceAfterNanos === undefined ? formatCents(charge.balanceAfterCents) : formatNanos(charge.balanceAfterNanos))}</td>
-                            <td class="py-2">${escapeHtml(chargeStatusText(charge.status))}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function renderAdminRecentCharges(charges = []) {
-        if (!charges.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无最近扣费记录。</div>';
-        }
-        return renderCharges(charges, { showPhone: true });
-    }
-
-    function renderLedger(entries = []) {
-        if (!entries.length) return '<p class="text-sm text-text-muted dark:text-dark-text-muted">暂无账户流水。</p>';
-        return `
-            <table class="min-w-full text-sm">
-                <thead class="text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr><th class="py-2 pr-3">时间</th><th class="py-2 pr-3">类型</th><th class="py-2 pr-3">金额</th><th class="py-2 pr-3">余额</th><th class="py-2">备注</th></tr>
-                </thead>
-                <tbody>
-                    ${entries.map((entry) => `
-                        <tr class="border-t border-border-subtle dark:border-dark-border">
-                            <td class="py-2 pr-3">${escapeHtml(formatDate(entry.createdAt))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(ledgerEntryText(entry.entryType))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatCents(entry.amountCents))}</td>
-                            <td class="py-2 pr-3">${escapeHtml(formatCents(entry.balanceAfterCents))}</td>
-                            <td class="py-2">${escapeHtml(entry.memo || '-')}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function usageStatusText(status) {
-        const map = {
-            active: '使用中',
-            expired: '已过期',
-            unused: '未使用',
-            disabled: '已禁用',
-            local: '本地',
-            unmanaged: '未托管',
-            used: '已使用'
-        };
-        return map[status] || status || '-';
-    }
-
-    function usageGroupText(group) {
-        const map = {
-            shop: 'Shop',
-            local: 'Local',
-            unmanaged: '未托管'
-        };
-        return map[group] || group || '-';
-    }
-
-    function renderUsageSummary(summary) {
-        const cards = [
-            ['今日 token', summary.today_tokens],
-            ['本月 token', summary.month_tokens],
-            ['总 token', summary.total_tokens],
-            ['失败请求', summary.failed_requests]
-        ];
-        return cards.map(([label, value]) => `
-            <article class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-4">
-                <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">${escapeHtml(label)}</p>
-                <p class="mt-2 text-2xl font-display text-primary dark:text-dark-text">${escapeHtml(formatNumber(value))}</p>
-            </article>
-        `).join('');
-    }
-
-    function renderUsageItems(items) {
-        if (!items.length) {
-            return '<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">暂无用量记录。</div>';
-        }
-        return `
-            <table class="min-w-full divide-y divide-border-subtle dark:divide-dark-border text-sm">
-                <thead class="bg-background-soft dark:bg-dark-surface text-left text-xs uppercase tracking-[0.16em] text-text-muted dark:text-dark-text-muted">
-                    <tr>
-                        <th class="px-4 py-3">分组</th>
-                        <th class="px-4 py-3">手机号</th>
-                        <th class="px-4 py-3">API key</th>
-                        <th class="px-4 py-3">状态</th>
-                        <th class="px-4 py-3">今日</th>
-                        <th class="px-4 py-3">本月</th>
-                        <th class="px-4 py-3">总计</th>
-                        <th class="px-4 py-3">请求</th>
-                        <th class="px-4 py-3">最近</th>
-                        <th class="px-4 py-3">模型</th>
-                    </tr>
-                </thead>
-                <tbody class="divide-y divide-border-subtle dark:divide-dark-border bg-white dark:bg-dark-card">
-                    ${items.map((item) => `
-                        <tr>
-                            <td class="px-4 py-3">${escapeHtml(usageGroupText(item.group))}</td>
-                            <td class="px-4 py-3">${escapeHtml(item.phone || '-')}</td>
-                            <td class="px-4 py-3 font-mono">${escapeHtml(item.api_key_preview || '-')}</td>
-                            <td class="px-4 py-3">${escapeHtml(usageStatusText(item.status))}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatNumber(item.today_tokens))}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatNumber(item.month_tokens))}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatNumber(item.total_tokens))}</td>
-                            <td class="px-4 py-3">${escapeHtml(`${item.success_requests || 0}/${item.failed_requests || 0}/${item.total_requests || 0}`)}</td>
-                            <td class="px-4 py-3">${escapeHtml(formatDate(item.last_seen_at))}</td>
-                            <td class="px-4 py-3">${escapeHtml((item.models || []).map((model) => `${model.model}:${formatNumber(model.total_tokens)}`).join(' / ') || '-')}</td>
-                        </tr>
-                    `).join('')}
-                </tbody>
-            </table>
-        `;
-    }
-
-    function initAdminUsagePage() {
-        const refreshButton = document.getElementById('usageRefreshButton');
-        const searchInput = document.getElementById('usageSearchInput');
-        const groupFilter = document.getElementById('usageGroupFilter');
-        const statusFilter = document.getElementById('usageStatusFilter');
-        const summaryRoot = document.getElementById('usageSummaryCards');
-        const billingRoot = document.getElementById('adminBillingUsageCards');
-        const revenueChartsRoot = document.getElementById('adminRevenueCharts');
-        const tableRoot = document.getElementById('usageTable');
-        const recentChargesRoot = document.getElementById('adminRecentCharges');
-        const message = document.getElementById('usageMessage');
-        const importForm = document.getElementById('usageImportForm');
-        const importMonth = document.getElementById('usageImportMonth');
-        const importMessage = document.getElementById('usageImportMessage');
-        const usageImportStatus = document.getElementById('usageImportStatus');
-        if (!refreshButton || !summaryRoot || !tableRoot || !message) return;
-        let latestBilling = {};
-        let revenueRankingPeriod = 'month';
-
-        function renderRevenueCharts() {
-            if (!revenueChartsRoot) return;
-            revenueChartsRoot.innerHTML = renderAdminRevenueCharts(latestBilling, revenueRankingPeriod);
-        }
-
-        async function fetchUsageImportStatus() {
-            if (!usageImportStatus) return;
-            try {
-                const status = await requestJson('/api/admin/usage-import-status');
-                usageImportStatus.innerHTML = `
-                    <p>自动导入：${status.enabled ? '已开启' : '未开启'}</p>
-                    <p class="mt-1">最近月份：${escapeHtml(status.lastMonth || '-')}，导入 ${escapeHtml(formatNumber(status.lastInserted || 0))}，跳过 ${escapeHtml(formatNumber(status.lastSkipped || 0))}，失败 ${escapeHtml(formatNumber(status.lastFailedLines || 0))}</p>
-                    <p class="mt-1">最近运行：${escapeHtml(formatDate(status.lastRunAt))}</p>
-                    ${status.lastError ? `<p class="mt-1 text-red-600">${escapeHtml(status.lastError)}</p>` : ''}
-                `;
-            } catch (error) {
-                usageImportStatus.textContent = error.message;
-            }
-        }
-
-        async function fetchUsage() {
-            const params = new URLSearchParams({
-                q: searchInput?.value || '',
-                group: groupFilter?.value || 'all',
-                status: statusFilter?.value || 'all'
-            });
-            message.textContent = '正在刷新...';
-            try {
-                const data = await requestJson(`/api/admin/usage-summary?${params.toString()}`);
-                summaryRoot.innerHTML = renderUsageSummary(data.summary || {});
-                latestBilling = data.billing || {};
-                if (billingRoot) billingRoot.innerHTML = renderBillingUsageCards(latestBilling, { mode: 'adminRevenue' });
-                renderRevenueCharts();
-                tableRoot.innerHTML = renderUsageItems(data.items || []);
-                if (recentChargesRoot) recentChargesRoot.innerHTML = renderAdminRecentCharges(data.billing?.recentCharges || []);
-                message.textContent = `共 ${(data.items || []).length} 条。`;
-            } catch (error) {
-                message.textContent = error.message;
-            } finally {
-                await fetchUsageImportStatus();
-            }
-        }
-
-        if (revenueChartsRoot) {
-            revenueChartsRoot.addEventListener('click', (event) => {
-                const button = event.target.closest('[data-revenue-ranking-period]');
-                if (!button) return;
-                revenueRankingPeriod = button.getAttribute('data-revenue-ranking-period') === 'today' ? 'today' : 'month';
-                renderRevenueCharts();
-            });
-        }
-
-        refreshButton.addEventListener('click', fetchUsage);
-        [searchInput, groupFilter, statusFilter].forEach((element) => {
-            if (!element) return;
-            element.addEventListener('change', fetchUsage);
-        });
-
-        if (importForm && importMonth && importMessage) {
-            importForm.addEventListener('submit', async (event) => {
-                event.preventDefault();
-                const month = importMonth.value;
-                importMessage.textContent = '正在导入...';
-                try {
-                    const result = await requestJson('/api/admin/usage-imports', {
-                        method: 'POST',
-                        body: JSON.stringify({ month })
-                    });
-                    importMessage.textContent = `导入 ${result.inserted}，跳过 ${result.skipped}，失败 ${result.failed_lines}。`;
-                    await fetchUsage();
-                } catch (error) {
-                    importMessage.textContent = error.message;
-                }
-            });
-        }
-    }
-
-    function initRedeemPage() {
-        const form = document.getElementById('redeemForm');
-        const accountPhone = document.getElementById('redeemAccountPhone');
-        const codeInput = document.getElementById('inviteCodeInput');
-        const message = document.getElementById('redeemMessage');
-        if (!form || !accountPhone || !codeInput || !message) return;
-
-        requestJson('/api/account/me')
-            .then((data) => {
-                accountPhone.textContent = data.user?.phone || '-';
-            })
-            .catch(() => {
-                window.location.replace('/shop/login/');
-            });
-
-        codeInput.addEventListener('input', () => {
-            codeInput.value = normalizeInviteCode(codeInput.value);
-        });
-
-        form.addEventListener('submit', async (event) => {
-            event.preventDefault();
-            const code = normalizeInviteCode(codeInput.value);
-            if (!code) {
-                message.textContent = '请输入邀请码。';
-                codeInput.focus();
-                return;
-            }
-
-            message.textContent = '正在兑换...';
-            try {
-                await requestJson('/api/account/invites/redeem', {
-                    method: 'POST',
-                    body: JSON.stringify({ code })
-                });
-                window.location.href = '/shop/account/';
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-    }
-
-    function normalizeInviteCode(value) {
-        return String(value || '').trim().toUpperCase().replace(/[^A-Z0-9-]/g, '').slice(0, 18);
-    }
-
-    async function initKeyPage() {
-        const root = document.getElementById('keyResult');
-        const empty = document.getElementById('emptyKey');
-        if (!root) return;
-        root.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取当前兑换结果...</p>';
-
-        try {
-            const data = await requestJson('/api/orders/current');
-            root.classList.remove('hidden');
-            if (empty) empty.classList.add('hidden');
-            root.innerHTML = renderOrderCard(data.order, { showFullKey: true });
-            bindCopy(root);
-        } catch (error) {
-            if (empty) empty.classList.remove('hidden');
-            root.classList.add('hidden');
-        }
-    }
-
-    function initQueryPage() {
-        window.location.replace('/shop/account/');
-    }
-
-    function normalizeResetCodeInput(input) {
-        if (!input) return;
-        input.addEventListener('input', () => {
-            input.value = input.value.toUpperCase().replace(/[^A-Z0-9-]/g, '').slice(0, 18);
-        });
-    }
-
-    function initResetPasswordPage() {
-        const resetForm = document.getElementById('passwordResetForm');
-        const phoneInput = document.getElementById('resetPhone');
-        const codeInput = document.getElementById('resetPasswordCode');
-        const passwordInput = document.getElementById('resetNewPassword');
-        const confirmInput = document.getElementById('resetConfirmPassword');
-        const message = document.getElementById('passwordResetMessage');
-        if (!resetForm || !phoneInput || !codeInput || !passwordInput || !confirmInput || !message) return;
-
-        bindPhoneInput(phoneInput);
-        normalizeResetCodeInput(codeInput);
-
-        resetForm.addEventListener('submit', async (event) => {
-            event.preventDefault();
-            const phone = phoneInput.value.trim();
-            const code = codeInput.value.trim();
-            const password = passwordInput.value;
-            const confirmPassword = confirmInput.value;
-            if (!isPhone(phone)) {
-                message.textContent = '请输入有效的中国大陆手机号。';
-                phoneInput.focus();
-                return;
-            }
-            if (!code) {
-                message.textContent = '请输入重置码。';
-                codeInput.focus();
-                return;
-            }
-            if (!isStrongPassword(password)) {
-                message.textContent = '密码至少 8 位，并包含英文大写字母、小写字母和数字。';
-                passwordInput.focus();
-                return;
-            }
-            if (password !== confirmPassword) {
-                message.textContent = '两次输入的密码不一致。';
-                confirmInput.focus();
-                return;
-            }
-
-            message.textContent = '正在重置密码...';
-            try {
-                const data = await requestJson('/api/auth/password-reset', {
-                    method: 'POST',
-                    body: JSON.stringify({ phone, code, password, confirmPassword })
-                });
-                window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-    }
-
-    function initLoginPage() {
-        const form = document.getElementById('loginForm');
-        const phoneInput = document.getElementById('loginPhone');
-        const passwordInput = document.getElementById('loginPassword');
-        const message = document.getElementById('loginMessage');
-        if (!form || !phoneInput || !passwordInput || !message) return;
-
-        bindPhoneInput(phoneInput);
-
-        form.addEventListener('submit', async (event) => {
-            event.preventDefault();
-            const phone = phoneInput.value.trim();
-            const password = passwordInput.value;
-            if (!isPhone(phone)) {
-                message.textContent = '请输入有效的中国大陆手机号。';
-                phoneInput.focus();
-                return;
-            }
-            if (!password) {
-                message.textContent = '请输入密码。';
-                passwordInput.focus();
-                return;
-            }
-
-            message.textContent = '正在登录...';
-            try {
-                const data = await requestJson('/api/auth/login', {
-                    method: 'POST',
-                    body: JSON.stringify({ phone, password })
-                });
-                window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-    }
-
-    function initRegisterPage() {
-        const form = document.getElementById('registerForm');
-        const phoneInput = document.getElementById('registerPhone');
-        const passwordInput = document.getElementById('registerPassword');
-        const confirmInput = document.getElementById('registerConfirmPassword');
-        const message = document.getElementById('registerMessage');
-        if (!form || !phoneInput || !passwordInput || !confirmInput || !message) return;
-
-        bindPhoneInput(phoneInput);
-
-        form.addEventListener('submit', async (event) => {
-            event.preventDefault();
-            const phone = phoneInput.value.trim();
-            const password = passwordInput.value;
-            const confirmPassword = confirmInput.value;
-            if (!isPhone(phone)) {
-                message.textContent = '请输入有效的中国大陆手机号。';
-                phoneInput.focus();
-                return;
-            }
-            if (!isStrongPassword(password)) {
-                message.textContent = '密码至少 8 位，并包含英文大写字母、小写字母和数字。';
-                passwordInput.focus();
-                return;
-            }
-            if (password !== confirmPassword) {
-                message.textContent = '两次输入的密码不一致。';
-                confirmInput.focus();
-                return;
-            }
-
-            message.textContent = '正在注册...';
-            try {
-                const data = await requestJson('/api/auth/register', {
-                    method: 'POST',
-                    body: JSON.stringify({ phone, password, confirmPassword })
-                });
-                window.location.href = data.user?.isAdmin ? '/shop/admin/' : '/shop/account/';
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-    }
-
-    function initCollapsibleSections(root = document) {
-        const sections = Array.from(root.querySelectorAll('[data-collapsible-section]'));
-        sections.forEach((section) => {
-            const toggle = section.querySelector('[data-collapsible-toggle]');
-            const content = section.querySelector('[data-collapsible-content]');
-            if (!toggle || !content) return;
-
-            let open = section.dataset.collapsibleDefault !== 'closed';
-            const render = () => {
-                toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
-                toggle.textContent = open ? '收起' : '展开';
-                content.hidden = !open;
-            };
-
-            toggle.addEventListener('click', () => {
-                open = !open;
-                render();
-            });
-            render();
-        });
-    }
-
-    async function initAccountPage() {
-        initCollapsibleSections(document);
-
-        const phoneRoot = document.getElementById('accountPhone');
-        const ordersRoot = document.getElementById('accountOrders');
-        const message = document.getElementById('accountMessage');
-        const logoutButton = document.getElementById('logoutButton');
-        const billingUsageCards = document.getElementById('accountBillingUsageCards');
-        const accountWeeklySpendingChart = document.getElementById('accountWeeklySpendingChart');
-        const usageFreshness = document.getElementById('usageFreshness');
-        const usageMessage = document.getElementById('accountUsageMessage');
-        const modelOverviewRoot = document.getElementById('accountModelOverview');
-        const balanceCards = document.getElementById('accountBalanceCards');
-        const billingMessage = document.getElementById('accountBillingMessage');
-        const topupForm = document.getElementById('topupForm');
-        const topupAmount = document.getElementById('topupAmount');
-        const topupPaymentMethod = document.getElementById('topupPaymentMethod');
-        const topupPaymentTime = document.getElementById('topupPaymentTime');
-        const topupPaymentNote = document.getElementById('topupPaymentNote');
-        const topupMessage = document.getElementById('topupMessage');
-        const accountTopups = document.getElementById('accountTopups');
-        const accountCharges = document.getElementById('accountCharges');
-        const accountLedger = document.getElementById('accountLedger');
-        const alipayQrImage = document.getElementById('alipayQrImage');
-        const wechatQrImage = document.getElementById('wechatQrImage');
-        const paymentReference = document.getElementById('paymentReference');
-        const accountRedeemForm = document.getElementById('accountRedeemForm');
-        const accountInviteCodeInput = document.getElementById('accountInviteCodeInput');
-        const accountRedeemMessage = document.getElementById('accountRedeemMessage');
-        let accountWeeklySpending = null;
-        let selectedAccountWeekStart = '';
-        if (!phoneRoot || !ordersRoot || !message || !logoutButton) return;
-
-        ordersRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取账户信息...</p>';
-        try {
-            const data = await requestJson('/api/account/me');
-            phoneRoot.textContent = data.user.phone;
-            const orders = data.orders || [];
-            if (!orders.length) {
-                ordersRoot.innerHTML = `
-                    <section class="rounded-lg border border-border-subtle dark:border-dark-border bg-white dark:bg-dark-card p-8 text-center">
-                        <h2 class="font-display text-3xl text-primary dark:text-dark-text">暂无 API key</h2>
-                        <p class="mt-3 text-text-muted dark:text-dark-text-muted">输入管理员提供的邀请码后，API key 会绑定到当前账号。</p>
-                    </section>
-                `;
-            } else {
-                ordersRoot.innerHTML = `<div class="grid gap-5">${orders.map((order) => renderOrderCard(order, { revealKey: true, compactAccountOrder: true })).join('')}</div>`;
-                ordersRoot.querySelectorAll('article').forEach(bindCopy);
-            }
-            message.textContent = '';
-        } catch (error) {
-            window.location.replace('/shop/login/');
-        }
-
-        async function refreshModelOverview() {
-            if (!modelOverviewRoot) return;
-            modelOverviewRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在读取模型...</p>';
-            try {
-                const data = await requestJson('/api/account/model-overview');
-                modelOverviewRoot.innerHTML = renderAccountModelOverview(data);
-            } catch (error) {
-                modelOverviewRoot.innerHTML = `<p class="text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(error.message)}</p>`;
-            }
-        }
-
-        async function refreshBilling() {
-            if (billingMessage) billingMessage.textContent = '正在读取账务信息...';
-            const [balanceData, topupData, chargeData, ledgerData] = await Promise.all([
-                requestJson('/api/account/balance'),
-                requestJson('/api/account/topups'),
-                requestJson('/api/account/api-charges'),
-                requestJson('/api/account/ledger')
-            ]);
-            if (balanceCards) balanceCards.innerHTML = renderBalanceCards(balanceData.balance || {});
-            if (accountTopups) accountTopups.innerHTML = renderTopups(topupData.topups || []);
-            if (accountCharges) accountCharges.innerHTML = renderCharges(chargeData.charges || []);
-            if (accountLedger) accountLedger.innerHTML = renderLedger(ledgerData.entries || []);
-            if (alipayQrImage) alipayQrImage.src = balanceData.payment?.alipayQrUrl || '';
-            if (wechatQrImage) wechatQrImage.src = balanceData.payment?.wechatQrUrl || '';
-            if (paymentReference) paymentReference.textContent = balanceData.payment?.paymentReference || '-';
-            if (billingMessage) billingMessage.textContent = '';
-        }
-
-        await refreshModelOverview();
-
-        try {
-            await refreshBilling();
-        } catch (error) {
-            if (billingMessage) billingMessage.textContent = error.message;
-        }
-
-        if (topupForm && topupAmount && topupPaymentMethod && topupMessage) {
-            topupForm.addEventListener('submit', async (event) => {
-                event.preventDefault();
-                topupMessage.textContent = '正在提交充值申请...';
-                try {
-                    await requestJson('/api/account/topups', {
-                        method: 'POST',
-                        body: JSON.stringify({
-                            amount: topupAmount.value,
-                            paymentMethod: topupPaymentMethod.value,
-                            paymentTime: topupPaymentTime?.value || '',
-                            paymentNote: topupPaymentNote?.value || ''
-                        })
-                    });
-                    topupForm.reset();
-                    topupMessage.textContent = '充值申请已提交，管理员确认后会入账。';
-                    await refreshBilling();
-                } catch (error) {
-                    topupMessage.textContent = error.message;
-                }
-            });
-        }
-
-        if (accountRedeemForm && accountInviteCodeInput && accountRedeemMessage) {
-            accountInviteCodeInput.addEventListener('input', () => {
-                accountInviteCodeInput.value = normalizeInviteCode(accountInviteCodeInput.value);
-            });
-            accountRedeemForm.addEventListener('submit', async (event) => {
-                event.preventDefault();
-                const code = normalizeInviteCode(accountInviteCodeInput.value);
-                if (!code) {
-                    accountRedeemMessage.textContent = '请输入邀请码。';
-                    accountInviteCodeInput.focus();
-                    return;
-                }
-                accountRedeemMessage.textContent = '正在兑换...';
-                try {
-                    await requestJson('/api/account/invites/redeem', {
-                        method: 'POST',
-                        body: JSON.stringify({ code })
-                    });
-                    accountInviteCodeInput.value = '';
-                    accountRedeemMessage.textContent = '兑换成功，API key 已绑定到当前账号。';
-                    window.location.reload();
-                } catch (error) {
-                    accountRedeemMessage.textContent = error.message;
-                }
-            });
-        }
-
-        if (accountWeeklySpendingChart) {
-            accountWeeklySpendingChart.addEventListener('click', (event) => {
-                const button = event.target.closest('[data-account-week-offset]');
-                if (!button || !accountWeeklySpending) return;
-                const weekStarts = Array.isArray(accountWeeklySpending.weekStarts) ? accountWeeklySpending.weekStarts : [];
-                const currentIndex = weekStarts.indexOf(selectedAccountWeekStart);
-                const offset = Number(button.getAttribute('data-account-week-offset') || 0);
-                const nextWeekStart = weekStarts[currentIndex + offset];
-                if (!nextWeekStart) return;
-                selectedAccountWeekStart = nextWeekStart;
-                accountWeeklySpendingChart.innerHTML = renderAccountWeeklySpendingChart(accountWeeklySpending, selectedAccountWeekStart);
-            });
-        }
-
-        try {
-            const usage = await requestJson('/api/account/usage-summary');
-            if (billingUsageCards) billingUsageCards.innerHTML = renderBillingUsageCards(usage.billing || {});
-            accountWeeklySpending = usage.billing?.weeklySpending || {};
-            selectedAccountWeekStart = accountWeeklySpending.currentWeekStart || accountWeeklySpending.weekStarts?.[accountWeeklySpending.weekStarts.length - 1] || '';
-            if (accountWeeklySpendingChart) accountWeeklySpendingChart.innerHTML = renderAccountWeeklySpendingChart(accountWeeklySpending, selectedAccountWeekStart);
-            if (usageFreshness) {
-                usageFreshness.textContent = `生成时间 ${formatDate(usage.generatedAt)}，用量统计可能最多延迟 1 小时。`;
-            }
-            if (usageMessage) usageMessage.textContent = '';
-        } catch (error) {
-            if (usageMessage) usageMessage.textContent = error.message;
-        }
-
-        logoutButton.addEventListener('click', async () => {
-            message.textContent = '正在退出...';
-            try {
-                await requestJson('/api/auth/logout', { method: 'POST' });
-                window.location.href = '/shop/login/';
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-    }
-
-    async function initAccountLinks() {
-        const links = Array.from(document.querySelectorAll('[data-account-link]'));
-        if (!links.length) return;
-        for (const link of links) {
-            link.href = '/shop/login/';
-            link.textContent = '登录';
-        }
-    }
-
-    function initAdminPasswordResetPage() {
-        const form = document.getElementById('passwordResetCodeForm');
-        const phoneInput = document.getElementById('passwordResetPhone');
-        const message = document.getElementById('passwordResetCodeMessage');
-        const result = document.getElementById('passwordResetCodeResult');
-        if (!form || !phoneInput || !message || !result) return;
-
-        bindPhoneInput(phoneInput);
-
-        form.addEventListener('submit', async (event) => {
-            event.preventDefault();
-            const phone = phoneInput.value.trim();
-            if (!isPhone(phone)) {
-                message.textContent = '请输入有效的中国大陆手机号。';
-                phoneInput.focus();
-                return;
-            }
-            message.textContent = '正在生成...';
-            result.classList.add('hidden');
-            result.innerHTML = '';
-            try {
-                const data = await requestJson('/api/admin/password-reset-codes', {
-                    method: 'POST',
-                    body: JSON.stringify({ phone })
-                });
-                message.textContent = '重置码已生成，只会显示这一次。';
-                result.classList.remove('hidden');
-                result.innerHTML = `
-                    <p class="text-xs uppercase tracking-[0.18em] text-text-muted dark:text-dark-text-muted">Reset code</p>
-                    <code class="mt-2 block break-all text-lg font-medium text-primary dark:text-dark-text">${escapeHtml(data.code)}</code>
-                    <p class="mt-3 text-sm text-text-muted dark:text-dark-text-muted">手机号：${escapeHtml(data.phone)}，有效期至 ${escapeHtml(formatDate(data.expiresAt))}。</p>
-                `;
-            } catch (error) {
-                message.textContent = error.message;
-            }
+    const moduleSources = [
+        '/shop/js/core.js',
+        '/shop/js/charts.js',
+        '/shop/js/auth.js',
+        '/shop/js/account.js',
+        '/shop/js/admin.js',
+        '/shop/js/legacy-redirects.js'
+    ];
+
+    function modulesReady() {
+        return Boolean(
+            window.YuiShopCore &&
+            window.YuiShopCharts &&
+            window.YuiShopAuth &&
+            window.YuiShopAccount &&
+            window.YuiShopAdmin &&
+            window.YuiShopLegacyRedirects
+        );
+    }
+
+    function loadScript(src) {
+        return new Promise((resolve, reject) => {
+            const script = document.createElement('script');
+            script.src = src;
+            script.defer = true;
+            script.onload = resolve;
+            script.onerror = () => reject(new Error(`加载 Shop 模块失败：${src}`));
+            document.head.appendChild(script);
         });
     }
 
-    function initAdminAccountBalancesPage() {
-        const searchInput = document.getElementById('adminBalanceSearchInput');
-        const statusFilter = document.getElementById('adminBalanceStatusFilter');
-        const summaryRoot = document.getElementById('adminBalanceSummary');
-        const tableRoot = document.getElementById('adminBalanceTable');
-        const message = document.getElementById('adminBalanceMessage');
-        if (!summaryRoot || !tableRoot || !message) return null;
-
-        async function fetchAccountBalances() {
-            const params = new URLSearchParams({
-                q: searchInput?.value || '',
-                status: statusFilter?.value || 'all'
-            });
-            message.textContent = '正在刷新余额...';
-            try {
-                const data = await requestJson(`/api/admin/account-balances?${params.toString()}`);
-                summaryRoot.innerHTML = renderAdminBalanceSummary(data.summary || {});
-                tableRoot.innerHTML = renderAdminBalanceTable(data.items || []);
-                message.textContent = `共 ${(data.items || []).length} 个账号。`;
-            } catch (error) {
-                summaryRoot.innerHTML = '';
-                tableRoot.innerHTML = '';
-                message.textContent = error.message;
-            }
+    async function ensureModules() {
+        if (modulesReady()) return;
+        for (const src of moduleSources) {
+            await loadScript(src);
         }
-
-        searchInput?.addEventListener('input', fetchAccountBalances);
-        statusFilter?.addEventListener('change', fetchAccountBalances);
-        fetchAccountBalances();
-        return fetchAccountBalances;
     }
 
-    function initAdminTopupPage(options = {}) {
-        const statusFilter = document.getElementById('adminTopupStatusFilter');
-        const tableRoot = document.getElementById('adminTopupTable');
-        const message = document.getElementById('adminTopupMessage');
-        if (!statusFilter || !tableRoot || !message) return null;
-
-        async function fetchTopups() {
-            message.textContent = '正在刷新...';
-            try {
-                const data = await requestJson(`/api/admin/topups?status=${encodeURIComponent(statusFilter.value)}`);
-                tableRoot.innerHTML = renderAdminTopups(data.topups || []);
-                message.textContent = `共 ${(data.topups || []).length} 条。`;
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        }
-
-        tableRoot.addEventListener('click', async (event) => {
-            const approveButton = event.target.closest('[data-approve-topup]');
-            const rejectButton = event.target.closest('[data-reject-topup]');
-            if (!approveButton && !rejectButton) return;
-            const row = event.target.closest('[data-topup-id]');
-            const id = row?.getAttribute('data-topup-id');
-            if (!id) return;
-            const adminNote = row.querySelector('[data-admin-note]')?.value || '';
-            const confirmedAmount = row.querySelector('[data-confirmed-amount]')?.value || '';
-            message.textContent = approveButton ? '正在确认入账...' : '正在拒绝申请...';
-            try {
-                if (approveButton) {
-                    await requestJson(`/api/admin/topups/${encodeURIComponent(id)}/approve`, {
-                        method: 'POST',
-                        body: JSON.stringify({ confirmedAmount, adminNote })
-                    });
-                } else {
-                    await requestJson(`/api/admin/topups/${encodeURIComponent(id)}/reject`, {
-                        method: 'POST',
-                        body: JSON.stringify({ adminNote })
-                    });
-                }
-                await fetchTopups();
-                await options.onBalanceChanged?.();
-            } catch (error) {
-                message.textContent = error.message;
-            }
-        });
-
-        statusFilter.addEventListener('change', fetchTopups);
-        fetchTopups();
-        return fetchTopups;
-    }
-
-    function initAdminInvitePage() {
-        const createForm = document.getElementById('adminInviteCreateForm');
-        const inviteCount = document.getElementById('adminInviteCount');
-        const createMessage = document.getElementById('adminInviteCreateMessage');
-        const createResult = document.getElementById('adminInviteCreateResult');
-        const importForm = document.getElementById('adminApiKeyImportForm');
-        const apiKeysText = document.getElementById('adminApiKeysText');
-        const importMessage = document.getElementById('adminApiKeyImportMessage');
-        const summaryRoot = document.getElementById('adminInviteConsoleSummary');
-        const inviteTable = document.getElementById('adminInviteTable');
-        const apiKeyPoolTable = document.getElementById('adminApiKeyPoolTable');
-        if (!summaryRoot || !inviteTable || !apiKeyPoolTable) return null;
-
-        async function refreshInviteConsole() {
-            summaryRoot.innerHTML = '<p class="text-sm text-text-muted dark:text-dark-text-muted">正在刷新兑换码状态...</p>';
-            try {
-                const data = await requestJson('/api/admin/invite-console');
-                summaryRoot.innerHTML = renderInviteConsoleSummary(data.summary || {});
-                inviteTable.innerHTML = renderAdminInviteTable(data.invites || []);
-                apiKeyPoolTable.innerHTML = renderAdminApiKeyPoolTable(data.apiKeyPool || []);
-            } catch (error) {
-                summaryRoot.innerHTML = '';
-                inviteTable.innerHTML = `<div class="p-5 text-sm text-text-muted dark:text-dark-text-muted">${escapeHtml(error.message)}</div>`;
-                apiKeyPoolTable.innerHTML = '';
-            }
-        }
-
-        if (createForm && inviteCount && createMessage && createResult) {
-            createForm.addEventListener('submit', async (event) => {
-                event.preventDefault();
-                createMessage.textContent = '正在生成...';
-                createResult.innerHTML = '';
-                try {
-                    const data = await requestJson('/api/admin/session-invites', {
-                        method: 'POST',
-                        body: JSON.stringify({ count: inviteCount.value })
-                    });
-                    createMessage.textContent = `已生成 ${(data.invites || []).length} 个邀请码。`;
-                    createResult.innerHTML = (data.invites || []).map((invite) => `
-                        <code class="block break-all rounded-md border border-border-subtle dark:border-dark-border bg-background-soft dark:bg-dark-surface px-3 py-2 text-sm text-primary dark:text-dark-text">${escapeHtml(invite.code)}</code>
-                    `).join('');
-                    await refreshInviteConsole();
-                } catch (error) {
-                    createMessage.textContent = error.message;
-                }
-            });
-        }
-
-        if (importForm && apiKeysText && importMessage) {
-            importForm.addEventListener('submit', async (event) => {
-                event.preventDefault();
-                const text = apiKeysText.value.trim();
-                if (!text) {
-                    importMessage.textContent = '请输入 API key。';
-                    apiKeysText.focus();
-                    return;
-                }
-                importMessage.textContent = '正在导入...';
-                try {
-                    const data = await requestJson('/api/admin/session-api-keys', {
-                        method: 'POST',
-                        body: JSON.stringify({ apiKeysText: text })
-                    });
-                    apiKeysText.value = '';
-                    importMessage.textContent = `已导入 ${(data.apiKeys || []).length} 个 API key。`;
-                    await refreshInviteConsole();
-                } catch (error) {
-                    importMessage.textContent = error.message;
-                }
-            });
-        }
-
-        refreshInviteConsole();
-        return refreshInviteConsole;
-    }
-
-    function initAdminPage() {
-        initCollapsibleSections(document);
-
-        const refreshAdminInvites = initAdminInvitePage();
-        initAdminUsagePage();
-        initAdminPasswordResetPage();
-        const refreshAdminBalances = initAdminAccountBalancesPage();
-        const refreshAdminTopups = initAdminTopupPage({ onBalanceChanged: refreshAdminBalances });
-        const businessRefreshButton = document.getElementById('adminBusinessRefreshButton');
-        const refreshAdminBusiness = async () => {
-            businessRefreshButton?.setAttribute('aria-busy', 'true');
-            try {
-                await Promise.all([
-                    refreshAdminInvites?.(),
-                    refreshAdminTopups?.(),
-                    refreshAdminBalances?.()
-                ].filter(Boolean));
-            } finally {
-                businessRefreshButton?.removeAttribute('aria-busy');
-            }
-        };
-        if (businessRefreshButton) {
-            businessRefreshButton.addEventListener('click', refreshAdminBusiness);
-        }
-        const refreshButton = document.getElementById('usageRefreshButton');
-        if (refreshButton) {
-            refreshButton.click();
-        }
-        const logoutButton = document.getElementById('logoutButton');
-        if (logoutButton) {
-            logoutButton.addEventListener('click', async () => {
-                try {
-                    await requestJson('/api/auth/logout', { method: 'POST' });
-                } finally {
-                    window.location.href = '/shop/login/';
-                }
-            });
-        }
-    }
-
-    const pageInitializers = {
-        '/shop/redeem/': initRedeemPage,
-        '/shop/key/': initKeyPage,
-        '/shop/query/': initQueryPage,
-        '/shop/admin/': initAdminPage,
-        '/shop/login/': initLoginPage,
-        '/shop/register/': initRegisterPage,
-        '/shop/reset-password/': initResetPasswordPage,
-        '/shop/account/': initAccountPage,
-        '/shop/order/': () => { window.location.replace('/shop/account/'); },
-        '/shop/pay/': () => { window.location.replace('/shop/account/'); },
-        '/shop/result/': () => { window.location.replace('/shop/account/'); },
-        '/shop/content/': () => { window.location.replace('/shop/account/'); }
-    };
-
     function normalizeShopPath(pathname) {
         const value = String(pathname || '').trim();
         if (!value) return '';
@@ -1635,34 +45,56 @@
         return path.endsWith('/') ? path : `${path}/`;
     }
 
-    function initCurrentShopPage() {
-        const initializer = pageInitializers[normalizeShopPath(window.location?.pathname)];
-        if (initializer) initializer();
-    }
+    function buildShopApi() {
+        const auth = window.YuiShopAuth;
+        const account = window.YuiShopAccount;
+        const admin = window.YuiShopAdmin;
+        const legacy = window.YuiShopLegacyRedirects;
+        const pageInitializers = {
+            '/shop/redeem/': account.initRedeemPage,
+            '/shop/key/': account.initKeyPage,
+            '/shop/query/': account.initQueryPage,
+            '/shop/admin/': admin.initAdminPage,
+            '/shop/login/': auth.initLoginPage,
+            '/shop/register/': auth.initRegisterPage,
+            '/shop/reset-password/': auth.initResetPasswordPage,
+            '/shop/account/': account.initAccountPage,
+            '/shop/order/': legacy.initOrderPage,
+            '/shop/pay/': legacy.initPayPage,
+            '/shop/result/': legacy.initResultPage,
+            '/shop/content/': legacy.initContentPage
+        };
 
-    function runWhenDomReady(fn) {
-        if (document.readyState === 'loading') {
-            document.addEventListener('DOMContentLoaded', fn, { once: true });
-            return;
-        }
-        fn();
+        function initCurrentShopPage() {
+            const initializer = pageInitializers[normalizeShopPath(window.location?.pathname)];
+            if (initializer) initializer();
+        }
+
+        window.YuiShop = {
+            initRedeemPage: account.initRedeemPage,
+            initKeyPage: account.initKeyPage,
+            initQueryPage: account.initQueryPage,
+            initAdminPage: admin.initAdminPage,
+            initAdminInvitePage: admin.initAdminInvitePage,
+            initLoginPage: auth.initLoginPage,
+            initRegisterPage: auth.initRegisterPage,
+            initResetPasswordPage: auth.initResetPasswordPage,
+            initAccountPage: account.initAccountPage,
+            initAccountLinks: account.initAccountLinks,
+            initOrderPage: pageInitializers['/shop/order/'],
+            initPayPage: pageInitializers['/shop/pay/'],
+            initResultPage: pageInitializers['/shop/result/'],
+            initContentPage: pageInitializers['/shop/content/']
+        };
+
+        window.YuiShopCore.runWhenDomReady(initCurrentShopPage);
+        return window.YuiShop;
     }
 
-    window.YuiShop = {
-        initRedeemPage,
-        initKeyPage,
-        initQueryPage,
-        initAdminPage,
-        initAdminInvitePage,
-        initLoginPage,
-        initRegisterPage,
-        initResetPasswordPage,
-        initAccountPage,
-        initAccountLinks,
-        initOrderPage: pageInitializers['/shop/order/'],
-        initPayPage: pageInitializers['/shop/pay/'],
-        initResultPage: pageInitializers['/shop/result/'],
-        initContentPage: pageInitializers['/shop/content/']
-    };
-    runWhenDomReady(initCurrentShopPage);
+    window.YuiShopReady = ensureModules().then(buildShopApi).catch((error) => {
+        if (window.console && typeof window.console.error === 'function') {
+            window.console.error(error);
+        }
+        throw error;
+    });
 })();
diff --git a/test/shop-flow.test.js b/test/shop-flow.test.js
index d1cdc26..1e2be4c 100644
--- a/test/shop-flow.test.js
+++ b/test/shop-flow.test.js
@@ -12,6 +12,29 @@ const { priceUsageTokens } = require('../lib/shop-pricing');
 
 const nanosPerYuan = 1000000000;
 const nanosPerCent = 10000000;
+const shopFrontendScriptFiles = [
+    'shop/js/core.js',
+    'shop/js/charts.js',
+    'shop/js/auth.js',
+    'shop/js/account.js',
+    'shop/js/admin.js',
+    'shop/js/legacy-redirects.js',
+    'shop/shop.js'
+];
+
+function readShopFrontendScript(file) {
+    return fs.readFileSync(path.join(__dirname, '..', file), 'utf8');
+}
+
+function readShopFrontendSource() {
+    return shopFrontendScriptFiles.map(readShopFrontendScript).join('\n');
+}
+
+function loadShopFrontendScripts(sandbox) {
+    for (const file of shopFrontendScriptFiles) {
+        vm.runInNewContext(readShopFrontendScript(file), sandbox, { filename: file });
+    }
+}
 
 function nanosToCnyForTest(nanos) {
     return Number(nanos || 0) / nanosPerYuan;
@@ -230,11 +253,6 @@ function rawHttpJsonRequest(url, options = {}) {
 }
 
 function loadShopRequestJsonForTest(fetchImpl, cookie = '') {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    const instrumented = script.replace(
-        '    window.YuiShop = {',
-        '    window.__requestJsonForTest = requestJson;\n    window.YuiShop = {'
-    );
     const sandbox = {
         document: { cookie },
         fetch: fetchImpl,
@@ -243,8 +261,8 @@ function loadShopRequestJsonForTest(fetchImpl, cookie = '') {
         URL
     };
     sandbox.window.document = sandbox.document;
-    vm.runInNewContext(instrumented, sandbox);
-    return sandbox.window.__requestJsonForTest;
+    vm.runInNewContext(readShopFrontendScript('shop/js/core.js'), sandbox, { filename: 'shop/js/core.js' });
+    return sandbox.window.YuiShopCore.requestJson;
 }
 
 test('requestJson 保留自定义 headers 并自动添加 CSRF token', async () => {
@@ -271,7 +289,7 @@ test('requestJson 保留自定义 headers 并自动添加 CSRF token', async ()
 });
 
 test('Shop 外部脚本会在 CSP 禁止 inline script 时自动初始化 Account 页二维码', async () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
+    const script = readShopFrontendSource();
     const elements = new Map();
     const createElement = () => ({
         innerHTML: '',
@@ -354,7 +372,8 @@ test('Shop 外部脚本会在 CSP 禁止 inline script 时自动初始化 Accoun
     };
     sandbox.window.document = sandbox.document;
 
-    vm.runInNewContext(script, sandbox);
+    loadShopFrontendScripts(sandbox);
+    await sandbox.window.YuiShopReady;
     await new Promise((resolve) => setImmediate(resolve));
 
     assert.ok(requests.includes('/api/account/me'));
@@ -364,7 +383,7 @@ test('Shop 外部脚本会在 CSP 禁止 inline script 时自动初始化 Accoun
 });
 
 test('Account 前端读取模型总览并渲染人民币价格表', async () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
+    const script = readShopFrontendSource();
     const elements = new Map();
     const createElement = () => ({
         innerHTML: '',
@@ -471,7 +490,8 @@ test('Account 前端读取模型总览并渲染人民币价格表', async () =>
     };
     sandbox.window.document = sandbox.document;
 
-    vm.runInNewContext(script, sandbox);
+    loadShopFrontendScripts(sandbox);
+    await sandbox.window.YuiShopReady;
     await sandbox.window.YuiShop.initAccountPage();
 
     assert.ok(requests.includes('/api/account/model-overview'));
@@ -495,7 +515,7 @@ test('Account 页提供登录态邀请码兑换表单且不再引导到独立手
 });
 
 test('Account 前端兑换调用登录态接口并且不提交手机号', async () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
+    const script = readShopFrontendSource();
     const elements = new Map();
     const createElement = () => {
         const listeners = new Map();
@@ -586,7 +606,8 @@ test('Account 前端兑换调用登录态接口并且不提交手机号', async
     };
     sandbox.window.document = sandbox.document;
 
-    vm.runInNewContext(script, sandbox);
+    loadShopFrontendScripts(sandbox);
+    await sandbox.window.YuiShopReady;
     await sandbox.window.YuiShop.initAccountPage();
     elements.get('accountInviteCodeInput').value = 'yui-abc-def';
     elements.get('accountRedeemForm').dispatchEvent({ type: 'submit' });
@@ -598,7 +619,7 @@ test('Account 前端兑换调用登录态接口并且不提交手机号', async
 });
 
 test('Shop 外部脚本会绑定 Account 和 Admin 页栏目折叠按钮', async () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
+    const script = readShopFrontendSource();
 
     for (const pathname of ['/shop/account/', '/shop/admin/']) {
         const content = {
@@ -642,7 +663,8 @@ test('Shop 外部脚本会绑定 Account 和 Admin 页栏目折叠按钮', async
         };
         sandbox.window.document = sandbox.document;
 
-        vm.runInNewContext(script, sandbox);
+        loadShopFrontendScripts(sandbox);
+        await sandbox.window.YuiShopReady;
 
         assert.equal(button.attributes['aria-expanded'], 'true', pathname);
         assert.equal(content.hidden, false, pathname);
@@ -3193,462 +3215,6 @@ test('API key 具有唯一性，重复导入会被拒绝', async () => {
     });
 });
 
-test('兑换页不再要求输入手机号，只绑定当前登录账号', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/redeem/index.html'), 'utf8');
-
-    assert.doesNotMatch(html, /id="phoneInput"/);
-    assert.match(html, /id="redeemAccountPhone"/);
-    assert.match(html, /id="inviteCodeInput"/);
-    assert.match(html, /会绑定到当前登录账号/);
-});
-
-test('兑换页展示按量计费 API key 文案并移除固定价格和手机号语义', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/redeem/index.html'), 'utf8');
-
-    assert.match(html, /私下付款后，你会收到一个邀请码。输入邀请码后，系统会生成 API key。/);
-    assert.match(html, /<h2 class="mt-2 text-2xl font-display">codex api key<\/h2>/);
-    assert.doesNotMatch(html, /Codex 月额度/);
-    assert.doesNotMatch(html, /Codex 每月额度/);
-    assert.doesNotMatch(html, /31 天/);
-    assert.doesNotMatch(html, /¥30\.00/);
-});
-
-test('兑换页前端调用登录态兑换接口', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(script, /requestJson\('\/api\/account\/me'\)/);
-    assert.match(script, /redeemAccountPhone/);
-    assert.match(script, /api\/account\/invites\/redeem/);
-    assert.doesNotMatch(script, /api\/invites\/redeem',\s*\{/);
-});
-
-test('商店首页提供使用方法入口，公开说明页只使用占位 API key', () => {
-    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
-    const guide = fs.readFileSync(path.join(__dirname, '..', 'shop/guide/index.html'), 'utf8');
-
-    assert.match(home, /href="\/shop\/guide\/"[^>]*>使用方法<\/a>/);
-    assert.match(home, /bg-gray-100/);
-    assert.match(guide, /Codex 配置使用方法/);
-    assert.match(guide, /https:\/\/api\.aaccx\.pw\/v1/);
-    assert.match(guide, /OPENAI_API_KEY/);
-    assert.match(guide, /Authorization: Bearer/);
-    assert.match(guide, /不要使用 x-api-key/);
-    assert.match(guide, /sk-xx/);
-    assert.doesNotMatch(guide, /data-ui-ready','true/);
-    assert.doesNotMatch(guide, /sk-dummy/);
-    assert.doesNotMatch(guide, /环境变量文件/);
-    assert.doesNotMatch(guide, /sk-[a-f0-9]{32}/);
-});
-
-test('Shop 首页按量计费文案和按钮布局不再暴露手机号查询入口', () => {
-    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
-
-    assert.match(home, /Codex[\s\S]*按量计费/);
-    assert.match(home, /按实际 token 记录/);
-    assert.match(home, /登录账户/);
-    assert.match(home, /兑换 API key/);
-    assert.match(home, /使用方法/);
-    assert.match(home, /私下开通/);
-    assert.match(home, /按量记录/);
-    assert.doesNotMatch(home, /href="\/shop\/query\/"/);
-    assert.doesNotMatch(home, /手机号查询/);
-    assert.doesNotMatch(home, /手机号和邀请码/);
-    assert.doesNotMatch(home, /每月 30 元人民币/);
-    assert.doesNotMatch(home, /额度兑换/);
-    assert.doesNotMatch(home, /31 天有效/);
-});
-
-test('手机号查询页只作为 Account 跳转兜底，不再渲染查询表单', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/query/index.html'), 'utf8');
-    assert.match(html, /正在进入账户页/);
-    assert.doesNotMatch(html, /id="queryForm"/);
-    assert.doesNotMatch(html, /id="queryPhone"/);
-    assert.doesNotMatch(html, /过期订单会显示为已失效/);
-});
-
-test('API key 结果页只展示订单，不再渲染使用方法', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    assert.match(script, /api\/orders\/current/);
-    assert.doesNotMatch(script, /yui-shop-latest-order/);
-    assert.doesNotMatch(script, /Codex CLI 使用公网 API 配置说明/);
-    assert.doesNotMatch(script, /Codex 配置使用方法/);
-    assert.doesNotMatch(script, /renderUsageGuide/);
-});
-
-test('旧购买支付页面不再展示购买、支付、31 天和演示交付语义', () => {
-    const files = [
-        'shop/key/index.html',
-        'shop/order/index.html',
-        'shop/pay/index.html',
-        'shop/result/index.html',
-        'shop/content/index.html'
-    ];
-    const combined = files.map((file) => fs.readFileSync(path.join(__dirname, '..', file), 'utf8')).join('\n');
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.doesNotMatch(combined, /31 天/);
-    assert.doesNotMatch(combined, /重新购买/);
-    assert.doesNotMatch(combined, /¥199\.00/);
-    assert.doesNotMatch(combined, /Yui Personal Digital Pack/);
-    assert.doesNotMatch(combined, /生成订单并支付/);
-    assert.doesNotMatch(combined, /选择支付方式/);
-    assert.doesNotMatch(combined, /等待支付确认/);
-    assert.doesNotMatch(combined, /演示支付成功/);
-    assert.doesNotMatch(combined, /购买内容/);
-    assert.doesNotMatch(combined, /交付文件/);
-    assert.doesNotMatch(combined, /去购买/);
-    assert.doesNotMatch(combined, /id="orderForm"/);
-    assert.doesNotMatch(combined, /id="phoneInput"/);
-    assert.doesNotMatch(combined, /data-pay-method/);
-    assert.doesNotMatch(combined, /id="qrBox"/);
-    assert.doesNotMatch(combined, /id="paymentAction"/);
-    assert.doesNotMatch(combined, /id="orderSummary"/);
-    assert.doesNotMatch(combined, /id="paidContent"/);
-    assert.doesNotMatch(combined, /id="contentGuard"/);
-
-    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/key/index.html'), 'utf8'), /API key 已激活/);
-    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/order/index.html'), 'utf8'), /url=\/shop\/account\//);
-    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/pay/index.html'), 'utf8'), /url=\/shop\/account\//);
-    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/result/index.html'), 'utf8'), /url=\/shop\/account\//);
-    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/content/index.html'), 'utf8'), /url=\/shop\/account\//);
-
-    assert.match(script, /'\/shop\/order\/': \(\) => \{ window\.location\.replace\('\/shop\/account\/'\); \}/);
-    assert.match(script, /'\/shop\/pay\/': \(\) => \{ window\.location\.replace\('\/shop\/account\/'\); \}/);
-    assert.match(script, /'\/shop\/result\/': \(\) => \{ window\.location\.replace\('\/shop\/account\/'\); \}/);
-    assert.match(script, /'\/shop\/content\/': \(\) => \{ window\.location\.replace\('\/shop\/account\/'\); \}/);
-});
-
-test('后台页面使用管理员 session，不渲染管理员 token 输入', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(html, /管理员控制台/);
-    assert.match(html, /管理员账号/);
-    assert.match(html, /shop\.js\?v=20260612-admin-revenue-fallback/);
-    assert.doesNotMatch(html, /管理员口令/);
-    assert.doesNotMatch(html, /解锁用量监控/);
-    assert.doesNotMatch(html, /id="adminAccessForm"/);
-    assert.doesNotMatch(html, /id="adminTokenInput"/);
-    assert.doesNotMatch(html, /id="adminInviteForm"/);
-    assert.doesNotMatch(html, /id="inviteCountInput"/);
-    assert.doesNotMatch(html, /id="adminResult"/);
-    assert.doesNotMatch(script, /invite\.apiKey/);
-    assert.doesNotMatch(script, /api\/admin\/invites/);
-    assert.doesNotMatch(script, /x-admin-token/);
-});
-
-test('Admin 页面把业务办理合并成一个栏目', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-
-    assert.match(html, /id="adminBusinessSection"/);
-    assert.match(html, /业务办理/);
-    assert.match(html, /id="adminBusinessRefreshButton"/);
-    assert.match(html, /id="adminInviteCreateForm"/);
-    assert.match(html, /id="adminApiKeyImportForm"/);
-    assert.match(html, /id="passwordResetCodeForm"/);
-    assert.match(html, /id="adminTopupStatusFilter"/);
-    assert.match(html, /id="adminTopupTable"/);
-    assert.match(html, /id="adminInviteConsoleSummary"/);
-    assert.match(html, /id="adminAccountBalancesPanel"/);
-    assert.match(html, /id="adminBalanceSearchInput"/);
-    assert.match(html, /id="adminBalanceStatusFilter"/);
-    assert.match(html, /id="adminBalanceSummary"/);
-    assert.match(html, /id="adminBalanceTable"/);
-    assert.match(html, /id="adminBalanceMessage"/);
-    assert.match(html, /id="adminInviteTable"/);
-    assert.match(html, /id="adminApiKeyPoolTable"/);
-    const topupIndex = html.indexOf('id="adminTopupTable"');
-    const balanceIndex = html.indexOf('id="adminAccountBalancesPanel"');
-    const inviteIndex = html.indexOf('id="adminInviteTable"');
-    assert.ok(topupIndex > -1 && balanceIndex > -1 && inviteIndex > -1);
-    assert.ok(topupIndex < balanceIndex);
-    assert.ok(balanceIndex < inviteIndex);
-    assert.doesNotMatch(html, /id="adminInviteSection"/);
-    assert.doesNotMatch(html, /id="adminPasswordResetSection"/);
-    assert.doesNotMatch(html, /id="adminTopupSection"/);
-});
-
-test('Admin 前端兑换码管理不使用 x-admin-token', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(script, /api\/admin\/invite-console/);
-    assert.match(script, /api\/admin\/session-invites/);
-    assert.match(script, /api\/admin\/session-api-keys/);
-    assert.match(script, /function initAdminInvitePage/);
-    assert.match(script, /adminBusinessRefreshButton/);
-    assert.match(script, /refreshAdminBusiness/);
-    assert.match(script, /function renderAdminBalanceSummary/);
-    assert.match(script, /function renderAdminBalanceTable/);
-    assert.match(script, /function initAdminAccountBalancesPage/);
-    assert.match(script, /api\/admin\/account-balances/);
-    assert.match(script, /refreshAdminBalances/);
-    assert.match(script, /onBalanceChanged/);
-    assert.match(script, /用户余额/);
-    assert.match(script, /欠费用户/);
-    assert.match(script, /待确认充值/);
-    assert.doesNotMatch(script, /x-admin-token/);
-});
-
-test('后台页面包含 usage 监控和 JSONL 导入控件', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(html, /id="adminBusinessSection"/);
-    assert.match(html, /id="adminUsageSection"/);
-    assert.match(html, /id="adminUsageImportSection"/);
-    assert.match(html, /id="usageRefreshButton"/);
-    assert.match(html, /id="usageGroupFilter"/);
-    assert.match(html, /<option value="local">Local<\/option>/);
-    assert.match(html, /id="usageImportForm"/);
-    assert.match(html, /CLIProxyAPI\/logs\/usage/);
-    assert.match(html, /usage-events-YYYY-MM\.jsonl/);
-    assert.match(html, /id="adminBillingUsageCards"/);
-    assert.match(html, /id="adminRevenueCharts"/);
-    assert.match(html, /id="adminRecentCharges"/);
-    assert.match(script, /function initAdminUsagePage/);
-    assert.match(script, /function renderBillingUsageCards/);
-    assert.match(script, /function renderAdminRevenueCharts/);
-    assert.match(script, /function renderRevenuePieChart/);
-    assert.match(script, /function renderCustomerSpendingBars/);
-    assert.match(script, /function renderAdminRecentCharges/);
-    assert.match(script, /api\/admin\/usage-summary/);
-    assert.match(script, /api\/admin\/usage-imports/);
-    assert.match(script, /今日收银/);
-    assert.match(script, /本月收银/);
-    assert.match(script, /收银分析/);
-    assert.match(script, /Shop 用户消费排行/);
-    assert.match(script, /data-revenue-ranking-period="today"/);
-    assert.match(script, /data-revenue-ranking-period="month"/);
-    assert.match(script, /今天收银多少钱/);
-    assert.match(script, /本月一共收了多少钱/);
-    assert.match(script, /今日消费/);
-    const usageSection = html.match(/<section id="adminUsageSection"[\s\S]*?<section id="adminUsageImportSection"/)?.[0] || '';
-    assert.doesNotMatch(usageSection, /adminAccountBalancesPanel/);
-    assert.doesNotMatch(usageSection, /用户余额/);
-    assert.doesNotMatch(html, /完整 API key/);
-    assert.equal((html.match(/data-collapsible-section/g) || []).length, 3);
-    assert.equal((html.match(/data-collapsible-toggle/g) || []).length, 3);
-    assert.equal((html.match(/data-collapsible-content/g) || []).length, 3);
-    assert.match(html, /id="adminBusinessSection"[\s\S]*?data-collapsible-default="open"/);
-    assert.match(html, /id="adminUsageSection"[\s\S]*?data-collapsible-default="open"/);
-    assert.match(html, /id="adminUsageImportSection"[\s\S]*?data-collapsible-default="open"/);
-});
-
-test('Admin 收银图表关键几何样式存在于构建 CSS 中', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    const siteCss = fs.readFileSync(path.join(__dirname, '..', 'styles/site.css'), 'utf8');
-
-    assert.match(script, /admin-revenue-pie/);
-    assert.match(script, /admin-revenue-pie-inner/);
-    assert.match(script, /admin-revenue-bars/);
-    assert.match(script, /admin-revenue-bar/);
-    assert.match(script, /admin-revenue-bar-stack/);
-    assert.match(script, /admin-revenue-bar-segment/);
-    assert.match(script, /admin-revenue-bar-segment-hit/);
-    assert.match(script, /admin-revenue-bar-segment-miss/);
-    assert.match(script, /admin-revenue-bar-segment-output/);
-    assert.match(script, /admin-revenue-ranking-legend/);
-    assert.match(script, /barHeightPx/);
-    assert.match(script, /admin-revenue-bar admin-revenue-bar-stack" style="height:\$\{barHeightPx\}px/);
-    assert.doesNotMatch(script, /admin-revenue-bar" style="height:\$\{height\}%/);
-    assert.match(siteCss, /\.admin-revenue-pie\{/);
-    assert.match(siteCss, /width:9rem/);
-    assert.match(siteCss, /height:9rem/);
-    assert.match(siteCss, /\.admin-revenue-bars\{/);
-    assert.match(siteCss, /\.admin-revenue-bar-stack\{/);
-    assert.match(siteCss, /\.admin-revenue-bar-segment-miss\{/);
-    assert.match(siteCss, /box-shadow:inset 0 0 0 1px rgba\(34,34,34,\.35\)/);
-    assert.match(siteCss, /height:14rem/);
-}
-);
-
-test('Admin 收银排行兼容旧排行数据缺少 parts 时不渲染白色空柱', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(script, /legacyTotalPart/);
-    assert.match(script, /partChargeTotal/);
-    assert.match(script, /旧格式总金额/);
-    assert.match(script, /chargeNanos: Number\(item\.chargeNanos \|\| 0\)/);
-});
-
-test('Admin 日志导入栏目展示自动导入状态容器', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-    assert.match(html, /id="usageImportStatus"/);
-});
-
-test('Admin 前端读取 usage 自动导入状态接口', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    assert.match(script, /api\/admin\/usage-import-status/);
-});
-
-test('Account 页面包含预充值余额、充值申请和扣费流水容器', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
-
-    assert.match(html, /id="accountModelOverview"/);
-    assert.match(html, /id="accountBalanceCards"/);
-    assert.match(html, /id="accountBillingUsageCards"/);
-    assert.doesNotMatch(html, /id="accountTokenBreakdown"/);
-    assert.doesNotMatch(html, /id="accountUsageCards"/);
-    assert.doesNotMatch(html, /id="paymentReference"/);
-    assert.doesNotMatch(html, /付款备注：/);
-    assert.match(html, /id="topupPaymentNote"[^>]+placeholder="备注可填写微信号"/);
-    assert.doesNotMatch(html, /id="accountHourlyChart"/);
-    assert.doesNotMatch(html, /id="accountDailyChart"/);
-    assert.doesNotMatch(html, /最近 24 小时/);
-    assert.doesNotMatch(html, /本月每日/);
-    assert.match(html, /id="topupForm"/);
-    assert.match(html, /id="topupAmount"/);
-    assert.match(html, /id="accountTopups"/);
-    assert.match(html, /id="accountWeeklySpendingChart"/);
-    assert.match(html, /id="accountCharges"/);
-    assert.match(html, /id="accountLedger"/);
-    assert.match(html, /id="accountGuideSection"/);
-    assert.match(html, /Codex 配置使用方法/);
-    assert.match(html, /https:\/\/api\.aaccx\.pw\/v1/);
-    assert.match(html, /OPENAI_API_KEY/);
-    assert.match(html, /Authorization: Bearer/);
-    assert.match(html, /不要使用 x-api-key/);
-
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    assert.doesNotMatch(script, /renderTokenBreakdown/);
-    assert.doesNotMatch(script, /\['Input', month\.inputTokens\]/);
-    assert.doesNotMatch(script, /\['Output', month\.outputTokens\]/);
-    assert.doesNotMatch(script, /\['Reasoning', month\.reasoningTokens\]/);
-    assert.doesNotMatch(script, /\['Cached', month\.cachedTokens\]/);
-    assert.match(html, /sk-xx/);
-    assert.equal((html.match(/data-collapsible-section/g) || []).length, 5);
-    assert.equal((html.match(/data-collapsible-toggle/g) || []).length, 5);
-    assert.equal((html.match(/data-collapsible-content/g) || []).length, 5);
-    assert.match(html, /id="accountGuideSection"[\s\S]*?data-collapsible-default="closed"/);
-
-    const modelOverviewIndex = html.indexOf('id="accountModelOverview"');
-    const balanceCardsIndex = html.indexOf('id="accountBalanceCards"');
-    assert.ok(modelOverviewIndex >= 0);
-    assert.ok(balanceCardsIndex > modelOverviewIndex);
-});
-
-test('Account 前端渲染周消费柱状图并提供上一周下一周切换', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    const accountChartScript = script.slice(
-        script.indexOf('function renderAccountWeeklySpendingChart'),
-        script.indexOf('function renderAdminRevenueCharts')
-    );
-
-    assert.match(script, /function renderAccountWeeklySpendingChart/);
-    assert.match(script, /data-account-week-offset="-1"/);
-    assert.match(script, /data-account-week-offset="1"/);
-    assert.match(accountChartScript, /admin-revenue-bar-segment-hit/);
-    assert.match(accountChartScript, /admin-revenue-bar-segment-miss/);
-    assert.match(accountChartScript, /admin-revenue-bar-segment-output/);
-    assert.match(accountChartScript, /admin-revenue-bar admin-revenue-bar-stack/);
-    assert.match(accountChartScript, /admin-revenue-ranking-legend/);
-    assert.doesNotMatch(accountChartScript, /account-revenue-bar/);
-    assert.match(script, /accountWeeklySpendingChart\.innerHTML = renderAccountWeeklySpendingChart/);
-});
-
-test('Account 用量卡片不展示无效 token 总览和内部价格版本名', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.doesNotMatch(script, /function renderAccountUsageCards/);
-    assert.doesNotMatch(script, /billing\.priceVersion/);
-    assert.match(script, /本月已扣费/);
-});
-
-test('Account 页把余额和 API key 前置，并默认收起说明和流水', () => {
-    const accountHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
-
-    const billingIndex = accountHtml.indexOf('id="accountBillingSection"');
-    const keysIndex = accountHtml.indexOf('id="accountKeysSection"');
-    const guideIndex = accountHtml.indexOf('id="accountGuideSection"');
-    const usageIndex = accountHtml.indexOf('id="accountUsageSection"');
-    const historyIndex = accountHtml.indexOf('id="accountBillingHistorySection"');
-
-    assert.ok(billingIndex >= 0);
-    assert.ok(keysIndex > billingIndex);
-    assert.ok(guideIndex > keysIndex);
-    assert.ok(usageIndex > guideIndex);
-    assert.ok(historyIndex > usageIndex);
-
-    assert.match(accountHtml, /id="accountBillingSection"[^>]*data-collapsible-default="open"/);
-    assert.match(accountHtml, /id="accountKeysSection"[^>]*data-collapsible-default="open"/);
-    assert.match(accountHtml, /id="accountGuideSection"[^>]*data-collapsible-default="closed"/);
-    assert.match(accountHtml, /id="accountUsageSection"[^>]*data-collapsible-default="open"/);
-    assert.match(accountHtml, /id="accountBillingHistorySection"[^>]*data-collapsible-default="closed"/);
-});
-
-test('Account API key 卡片只展示 key、兑换时间和复制按钮', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    const compactBranch = script.match(/if \(options\.compactAccountOrder\) \{([\s\S]*?)\n\s{8}\}/)?.[1] || '';
-
-    assert.match(script, /renderOrderCard\(order, \{ revealKey: true, compactAccountOrder: true \}\)/);
-    assert.match(compactBranch, /API key/);
-    assert.match(compactBranch, /兑换时间/);
-    assert.match(compactBranch, /copyButton/);
-    assert.doesNotMatch(compactBranch, /金额/);
-    assert.doesNotMatch(compactBranch, /手机号/);
-    assert.doesNotMatch(compactBranch, /失效时间/);
-    assert.doesNotMatch(compactBranch, /31 天/);
-    assert.doesNotMatch(compactBranch, /productName/);
-    assert.doesNotMatch(compactBranch, /statusText/);
-});
-
-test('Admin 业务办理栏目包含充值审核容器', () => {
-    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-    const businessSection = html.match(/<section id="adminBusinessSection"[\s\S]*?<\/section>\s*<section id="adminUsageSection"/)?.[0] || '';
-
-    assert.match(businessSection, /充值审核/);
-    assert.match(businessSection, /id="adminTopupStatusFilter"/);
-    assert.match(businessSection, /id="adminTopupTable"/);
-    assert.match(businessSection, /id="adminTopupMessage"/);
-});
-
-test('管理员页和独立重置密码页包含密码重置入口，登录页只保留跳转链接', () => {
-    const adminHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
-    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
-    const resetHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/reset-password/index.html'), 'utf8');
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-
-    assert.match(adminHtml, /id="adminBusinessSection"/);
-    assert.match(adminHtml, /id="passwordResetCodeForm"/);
-    assert.match(adminHtml, /id="passwordResetPhone"/);
-    assert.match(adminHtml, /id="passwordResetCodeResult"/);
-    assert.doesNotMatch(adminHtml, /id="adminPasswordResetSection"/);
-
-    assert.match(loginHtml, /href="\/shop\/reset-password\/"/);
-    assert.doesNotMatch(loginHtml, /id="showPasswordResetButton"/);
-    assert.doesNotMatch(loginHtml, /id="passwordResetForm"/);
-    assert.doesNotMatch(loginHtml, /id="resetPasswordCode"/);
-    assert.doesNotMatch(loginHtml, /id="resetNewPassword"/);
-    assert.doesNotMatch(loginHtml, /id="resetConfirmPassword"/);
-
-    assert.match(resetHtml, /<title>重置密码<\/title>/);
-    assert.match(resetHtml, /class="shop-auth-main[^"]*"/);
-    assert.match(resetHtml, /class="shop-auth-background-figure"/);
-    assert.match(resetHtml, /id="passwordResetForm"/);
-    assert.match(resetHtml, /id="resetPhone"/);
-    assert.match(resetHtml, /id="resetPasswordCode"/);
-    assert.match(resetHtml, /id="resetNewPassword"/);
-    assert.match(resetHtml, /id="resetConfirmPassword"/);
-    assert.match(resetHtml, /href="\/shop\/login\/"/);
-
-    assert.match(script, /function initResetPasswordPage/);
-    assert.match(script, /'\/shop\/reset-password\/': initResetPasswordPage/);
-    assert.doesNotMatch(script, /function initPasswordResetForm/);
-    assert.doesNotMatch(script, /initPasswordResetForm\(\)/);
-    assert.match(script, /initResetPasswordPage/);
-    assert.match(script, /function initAdminPasswordResetPage/);
-});
-
-test('重置密码页使用紧凑 Auth 表单，避免桌面首屏溢出', () => {
-    const resetHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/reset-password/index.html'), 'utf8');
-
-    assert.match(resetHtml, /class="shop-auth-panel[^"]*md:p-10/);
-    assert.match(resetHtml, /id="passwordResetForm" class="space-y-4"/);
-    assert.equal((resetHtml.match(/h-11 rounded-md/g) || []).length, 4);
-    assert.doesNotMatch(resetHtml, /id="passwordResetForm" class="space-y-5"/);
-    assert.doesNotMatch(resetHtml, /class="shop-auth-panel[^"]*md:p-16/);
-});
-
 test('重置密码页允许未登录访问，账户页仍要求登录', async () => {
     await withServer(async ({ baseUrl }) => {
         const resetPage = await fetch(`${baseUrl}/shop/reset-password/`, { redirect: 'manual' });
@@ -3661,66 +3227,6 @@ test('重置密码页允许未登录访问，账户页仍要求登录', async ()
     });
 });
 
-test('注册页使用登录页同款 Auth 外壳并移除左侧说明区块', () => {
-    const registerHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/register/index.html'), 'utf8');
-
-    assert.match(registerHtml, /<title>注册<\/title>/);
-    assert.match(registerHtml, /class="shop-auth-main[^"]*"/);
-    assert.match(registerHtml, /class="shop-auth-background-figure"/);
-    assert.match(registerHtml, /src="\/shop\/assets\/login\/yui-login-bg\.png"/);
-    assert.match(registerHtml, /class="shop-auth-content[^"]*"/);
-    assert.match(registerHtml, /class="shop-auth-panel[^"]*"/);
-    assert.match(registerHtml, /id="registerForm"/);
-    assert.match(registerHtml, /id="registerPhone"/);
-    assert.match(registerHtml, /id="registerPassword"/);
-    assert.match(registerHtml, /id="registerConfirmPassword"/);
-    assert.match(registerHtml, /href="\/shop\/login\/"/);
-    assert.doesNotMatch(registerHtml, /Create account/);
-    assert.doesNotMatch(registerHtml, /手机号会作为你的账户身份/);
-    assert.doesNotMatch(registerHtml, /历史兑换过的手机号/);
-    assert.doesNotMatch(registerHtml, /grid lg:grid-cols-\[0\.9fr_1\.1fr\]/);
-});
-
-test('登录页移除左侧标题并保留轻量登录入口', () => {
-    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
-
-    assert.doesNotMatch(loginHtml, /这里是登录页面/);
-    assert.match(loginHtml, /<title>登录<\/title>/);
-    assert.doesNotMatch(loginHtml, /<h1[\s\S]*?<\/h1>/);
-    assert.doesNotMatch(loginHtml, /登录 Shop/);
-    assert.doesNotMatch(loginHtml, /登录 悠一 的小店/);
-    assert.doesNotMatch(loginHtml, /使用手机号和密码进入个人中心/);
-    assert.doesNotMatch(loginHtml, /管理员账号登录后进入控制台/);
-});
-
-test('Auth 外壳样式由 Tailwind 输入文件统一维护，登录页使用中途版人物背景', () => {
-    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
-    const tailwindCss = fs.readFileSync(path.join(__dirname, '..', 'styles/tailwind.css'), 'utf8');
-    const siteCss = fs.readFileSync(path.join(__dirname, '..', 'styles/site.css'), 'utf8');
-    const assetPath = path.join(__dirname, '..', 'shop/assets/login/yui-login-bg.png');
-    const png = fs.readFileSync(assetPath);
-
-    assert.match(loginHtml, /class="shop-auth-main[^"]*"/);
-    assert.match(loginHtml, /class="shop-auth-background-figure"/);
-    assert.match(loginHtml, /class="shop-auth-content[^"]*"/);
-    assert.match(loginHtml, /class="shop-auth-panel[^"]*"/);
-    assert.match(loginHtml, /src="\/shop\/assets\/login\/yui-login-bg\.png"/);
-    assert.doesNotMatch(loginHtml, /\.login-main/);
-    assert.doesNotMatch(loginHtml, /\.login-background-figure/);
-    assert.doesNotMatch(loginHtml, /\.login-content/);
-    assert.doesNotMatch(loginHtml, /\.login-panel/);
-
-    assert.match(tailwindCss, /\.shop-auth-background-figure/);
-    assert.match(tailwindCss, /left:\s*clamp\(-380px,\s*-22vw,\s*-260px\)/);
-    assert.match(tailwindCss, /bottom:\s*0/);
-    assert.match(tailwindCss, /width:\s*min\(86vw,\s*1120px\)/);
-    assert.match(tailwindCss, /opacity:\s*0\.42/);
-    assert.match(siteCss, /\.shop-auth-background-figure/);
-
-    assert.equal(png.subarray(0, 8).toString('hex'), '89504e470d0a1a0a');
-    assert.equal(png[25], 6);
-});
-
 test('内部 API key 状态接口必须使用请求头 token', async () => {
     await withServer(async ({ baseUrl }) => {
         const missing = await jsonFetch(`${baseUrl}/api/internal/api-keys/status?apiKey=sk-any`);
@@ -4381,38 +3887,3 @@ test('无效过期时间的账号 session 会被拒绝', async () => {
         assert.equal(result.body.code, 'ACCOUNT_LOGIN_REQUIRED');
     });
 });
-
-test('Shop 首页顶部不显示账号入口且正文只保留固定登录入口', () => {
-    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
-    const login = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
-    const register = fs.readFileSync(path.join(__dirname, '..', 'shop/register/index.html'), 'utf8');
-    const account = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
-    const script = fs.readFileSync(path.join(__dirname, '..', 'shop/shop.js'), 'utf8');
-    const header = home.match(/<header[\s\S]*?<\/header>/)?.[0] || '';
-    const accountLinkCount = (home.match(/data-account-link/g) || []).length;
-
-    assert.match(home, /href="\/shop\/login\/"/);
-    assert.equal(accountLinkCount, 0);
-    assert.doesNotMatch(header, /data-account-link/);
-    assert.match(home, /<main[\s\S]*href="\/shop\/login\/"[\s\S]*>登录账户<\/a>/);
-    assert.doesNotMatch(home, /管理控制台/);
-    assert.match(login, /id="loginForm"/);
-    assert.match(login, /id="loginForm"/);
-    assert.doesNotMatch(login, /这里是登录页面/);
-    assert.match(register, /id="registerForm"/);
-    assert.match(register, /至少 8 位/);
-    assert.match(account, /id="logoutButton"/);
-    assert.doesNotMatch(account, /window\.YuiShop\.initAccountPage/);
-    assert.match(script, /'\/shop\/account\/': initAccountPage/);
-});
-
-
-test('公共顶部导航支持 Shop 的中英日翻译', () => {
-    const script = fs.readFileSync(path.join(__dirname, '..', 'js/lang.js'), 'utf8');
-
-    assert.match(script, /shop:\s*'商店'/);
-    assert.match(script, /shop:\s*'Shop'/);
-    assert.match(script, /shop:\s*'ショップ'/);
-    assert.match(script, /href\.includes\('\/shop'\)[\s\S]*data\.nav\.shop/);
-    assert.match(script, /path === '\/shop' \|\| path\.startsWith\('\/shop\/'\)[\s\S]*return null/);
-});
diff --git a/test/shop-frontend.test.js b/test/shop-frontend.test.js
new file mode 100644
index 0000000..92d5dd2
--- /dev/null
+++ b/test/shop-frontend.test.js
@@ -0,0 +1,752 @@
+const assert = require('node:assert/strict');
+const fs = require('node:fs');
+const path = require('node:path');
+const test = require('node:test');
+const vm = require('node:vm');
+
+const shopModuleScripts = [
+    '/shop/js/core.js',
+    '/shop/js/charts.js',
+    '/shop/js/auth.js',
+    '/shop/js/account.js',
+    '/shop/js/admin.js',
+    '/shop/js/legacy-redirects.js'
+];
+
+function readScript(relativePath) {
+    return fs.readFileSync(path.join(__dirname, '..', relativePath), 'utf8');
+}
+
+function readShopFrontendSource() {
+    return [
+        'shop/js/core.js',
+        'shop/js/charts.js',
+        'shop/js/auth.js',
+        'shop/js/account.js',
+        'shop/js/admin.js',
+        'shop/js/legacy-redirects.js',
+        'shop/shop.js'
+    ].map(readScript).join('\n');
+}
+
+function loadShopScripts(sandbox) {
+    for (const file of [
+        'shop/js/core.js',
+        'shop/js/charts.js',
+        'shop/js/auth.js',
+        'shop/js/account.js',
+        'shop/js/admin.js',
+        'shop/js/legacy-redirects.js',
+        'shop/shop.js'
+    ]) {
+        vm.runInNewContext(readScript(file), sandbox, { filename: file });
+    }
+}
+
+test('前端图表模块复用同一个堆叠柱渲染入口', () => {
+    const sandbox = {
+        window: {},
+        document: {
+            cookie: '',
+            readyState: 'loading',
+            addEventListener() {}
+        },
+        Intl,
+        URL
+    };
+    sandbox.window.document = sandbox.document;
+
+    vm.runInNewContext(readScript('shop/js/core.js'), sandbox, { filename: 'shop/js/core.js' });
+    vm.runInNewContext(readScript('shop/js/charts.js'), sandbox, { filename: 'shop/js/charts.js' });
+
+    assert.equal(typeof sandbox.window.YuiShopCharts.renderStackedChargeBars, 'function');
+    const html = sandbox.window.YuiShopCharts.renderStackedChargeBars({
+        items: [
+            {
+                label: '6/13',
+                chargeNanos: 15000000000,
+                parts: [
+                    { key: 'output', label: '输出 token', chargeNanos: 15000000000 }
+                ]
+            }
+        ],
+        emptyText: '暂无记录'
+    });
+    assert.match(html, /admin-revenue-bar-stack/);
+    assert.match(html, /输出 token/);
+});
+
+test('Shop 入口加载页面模块后仍暴露兼容的 YuiShop 初始化函数', async () => {
+    const elements = new Map();
+    const sandbox = {
+        window: {
+            location: { pathname: '/shop/login/', replace() {} }
+        },
+        document: {
+            cookie: '',
+            readyState: 'complete',
+            createElement: () => ({
+                set src(value) { this._src = value; },
+                get src() { return this._src; },
+                onload: null,
+                onerror: null
+            }),
+            head: {
+                appendChild(node) {
+                    node.onload?.();
+                }
+            },
+            querySelectorAll: () => [],
+            getElementById: (id) => elements.get(id) || null,
+            addEventListener() {}
+        },
+        fetch: async () => ({ ok: true, json: async () => ({}) }),
+        Intl,
+        URL
+    };
+    sandbox.window.document = sandbox.document;
+
+    loadShopScripts(sandbox);
+    await sandbox.window.YuiShopReady;
+
+    assert.equal(typeof sandbox.window.YuiShop.initLoginPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initAccountPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initAdminPage, 'function');
+    assert.equal(typeof sandbox.window.YuiShop.initOrderPage, 'function');
+});
+
+test('Shop 入口脚本会自动加载前端模块', async () => {
+    const loaded = [];
+    const elements = new Map();
+    const sandbox = {
+        window: {
+            location: { pathname: '/shop/login/', replace() {} }
+        },
+        document: {
+            cookie: '',
+            readyState: 'complete',
+            createElement: () => ({
+                set src(value) { this._src = value; },
+                get src() { return this._src; },
+                defer: false,
+                onload: null,
+                onerror: null
+            }),
+            head: {
+                appendChild(node) {
+                    const pathname = new URL(node.src, 'http://localhost').pathname.slice(1);
+                    loaded.push(pathname);
+                    vm.runInNewContext(readScript(pathname), sandbox, { filename: pathname });
+                    node.onload?.();
+                }
+            },
+            querySelectorAll: () => [],
+            getElementById: (id) => elements.get(id) || null,
+            addEventListener() {}
+        },
+        fetch: async () => ({ ok: true, json: async () => ({}) }),
+        Intl,
+        URL,
+        console
+    };
+    sandbox.window.document = sandbox.document;
+
+    vm.runInNewContext(readScript('shop/shop.js'), sandbox, { filename: 'shop/shop.js' });
+    await sandbox.window.YuiShopReady;
+
+    assert.deepEqual(loaded, [
+        'shop/js/core.js',
+        'shop/js/charts.js',
+        'shop/js/auth.js',
+        'shop/js/account.js',
+        'shop/js/admin.js',
+        'shop/js/legacy-redirects.js'
+    ]);
+    assert.equal(typeof sandbox.window.YuiShop.initLoginPage, 'function');
+});
+
+test('Shop HTML 只直接加载入口脚本，不重复硬编码前端模块', () => {
+    const shopDir = path.join(__dirname, '..', 'shop');
+    const htmlFiles = fs.readdirSync(shopDir, { recursive: true })
+        .filter((file) => file.endsWith('.html'))
+        .map((file) => path.join('shop', file));
+
+    const pagesWithEntry = htmlFiles.filter((file) => readScript(file).includes('/shop/shop.js'));
+    assert.ok(pagesWithEntry.length > 0);
+
+    for (const file of pagesWithEntry) {
+        const html = readScript(file);
+        for (const moduleSrc of shopModuleScripts) {
+            assert.equal(html.includes(moduleSrc), false, `${file} 不应直接加载 ${moduleSrc}`);
+        }
+    }
+});
+
+test('Account 页提供登录态邀请码兑换表单且不再引导到独立手机号兑换页', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
+
+    assert.match(html, /id="accountRedeemForm"/);
+    assert.match(html, /id="accountInviteCodeInput"/);
+    assert.match(html, /id="accountRedeemMessage"/);
+    assert.doesNotMatch(html, /href="\/shop\/redeem\/"/);
+});
+
+test('兑换页不再要求输入手机号，只绑定当前登录账号', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/redeem/index.html'), 'utf8');
+
+    assert.doesNotMatch(html, /id="phoneInput"/);
+    assert.match(html, /id="redeemAccountPhone"/);
+    assert.match(html, /id="inviteCodeInput"/);
+    assert.match(html, /会绑定到当前登录账号/);
+});
+
+test('兑换页展示按量计费 API key 文案并移除固定价格和手机号语义', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/redeem/index.html'), 'utf8');
+
+    assert.match(html, /私下付款后，你会收到一个邀请码。输入邀请码后，系统会生成 API key。/);
+    assert.match(html, /<h2 class="mt-2 text-2xl font-display">codex api key<\/h2>/);
+    assert.doesNotMatch(html, /Codex 月额度/);
+    assert.doesNotMatch(html, /Codex 每月额度/);
+    assert.doesNotMatch(html, /31 天/);
+    assert.doesNotMatch(html, /¥30\.00/);
+});
+
+test('兑换页前端调用登录态兑换接口', () => {
+    const script = readShopFrontendSource();
+
+    assert.match(script, /requestJson\('\/api\/account\/me'\)/);
+    assert.match(script, /redeemAccountPhone/);
+    assert.match(script, /api\/account\/invites\/redeem/);
+    assert.doesNotMatch(script, /api\/invites\/redeem',\s*\{/);
+});
+
+test('商店首页提供使用方法入口，公开说明页只使用占位 API key', () => {
+    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
+    const guide = fs.readFileSync(path.join(__dirname, '..', 'shop/guide/index.html'), 'utf8');
+
+    assert.match(home, /href="\/shop\/guide\/"[^>]*>使用方法<\/a>/);
+    assert.match(home, /bg-gray-100/);
+    assert.match(guide, /Codex 配置使用方法/);
+    assert.match(guide, /https:\/\/api\.aaccx\.pw\/v1/);
+    assert.match(guide, /OPENAI_API_KEY/);
+    assert.match(guide, /Authorization: Bearer/);
+    assert.match(guide, /不要使用 x-api-key/);
+    assert.match(guide, /sk-xx/);
+    assert.doesNotMatch(guide, /data-ui-ready','true/);
+    assert.doesNotMatch(guide, /sk-dummy/);
+    assert.doesNotMatch(guide, /环境变量文件/);
+    assert.doesNotMatch(guide, /sk-[a-f0-9]{32}/);
+});
+
+test('Shop 首页按量计费文案和按钮布局不再暴露手机号查询入口', () => {
+    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
+
+    assert.match(home, /Codex[\s\S]*按量计费/);
+    assert.match(home, /按实际 token 记录/);
+    assert.match(home, /登录账户/);
+    assert.match(home, /兑换 API key/);
+    assert.match(home, /使用方法/);
+    assert.match(home, /私下开通/);
+    assert.match(home, /按量记录/);
+    assert.doesNotMatch(home, /href="\/shop\/query\/"/);
+    assert.doesNotMatch(home, /手机号查询/);
+    assert.doesNotMatch(home, /手机号和邀请码/);
+    assert.doesNotMatch(home, /每月 30 元人民币/);
+    assert.doesNotMatch(home, /额度兑换/);
+    assert.doesNotMatch(home, /31 天有效/);
+});
+
+test('手机号查询页只作为 Account 跳转兜底，不再渲染查询表单', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/query/index.html'), 'utf8');
+    assert.match(html, /正在进入账户页/);
+    assert.doesNotMatch(html, /id="queryForm"/);
+    assert.doesNotMatch(html, /id="queryPhone"/);
+    assert.doesNotMatch(html, /过期订单会显示为已失效/);
+});
+
+test('API key 结果页只展示订单，不再渲染使用方法', () => {
+    const script = readShopFrontendSource();
+    assert.match(script, /api\/orders\/current/);
+    assert.doesNotMatch(script, /yui-shop-latest-order/);
+    assert.doesNotMatch(script, /Codex CLI 使用公网 API 配置说明/);
+    assert.doesNotMatch(script, /Codex 配置使用方法/);
+    assert.doesNotMatch(script, /renderUsageGuide/);
+});
+
+test('旧购买支付页面不再展示购买、支付、31 天和演示交付语义', () => {
+    const files = [
+        'shop/key/index.html',
+        'shop/order/index.html',
+        'shop/pay/index.html',
+        'shop/result/index.html',
+        'shop/content/index.html'
+    ];
+    const combined = files.map((file) => fs.readFileSync(path.join(__dirname, '..', file), 'utf8')).join('\n');
+    const script = readShopFrontendSource();
+
+    assert.doesNotMatch(combined, /31 天/);
+    assert.doesNotMatch(combined, /重新购买/);
+    assert.doesNotMatch(combined, /¥199\.00/);
+    assert.doesNotMatch(combined, /Yui Personal Digital Pack/);
+    assert.doesNotMatch(combined, /生成订单并支付/);
+    assert.doesNotMatch(combined, /选择支付方式/);
+    assert.doesNotMatch(combined, /等待支付确认/);
+    assert.doesNotMatch(combined, /演示支付成功/);
+    assert.doesNotMatch(combined, /购买内容/);
+    assert.doesNotMatch(combined, /交付文件/);
+    assert.doesNotMatch(combined, /去购买/);
+    assert.doesNotMatch(combined, /id="orderForm"/);
+    assert.doesNotMatch(combined, /id="phoneInput"/);
+    assert.doesNotMatch(combined, /data-pay-method/);
+    assert.doesNotMatch(combined, /id="qrBox"/);
+    assert.doesNotMatch(combined, /id="paymentAction"/);
+    assert.doesNotMatch(combined, /id="orderSummary"/);
+    assert.doesNotMatch(combined, /id="paidContent"/);
+    assert.doesNotMatch(combined, /id="contentGuard"/);
+
+    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/key/index.html'), 'utf8'), /API key 已激活/);
+    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/order/index.html'), 'utf8'), /url=\/shop\/account\//);
+    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/pay/index.html'), 'utf8'), /url=\/shop\/account\//);
+    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/result/index.html'), 'utf8'), /url=\/shop\/account\//);
+    assert.match(fs.readFileSync(path.join(__dirname, '..', 'shop/content/index.html'), 'utf8'), /url=\/shop\/account\//);
+
+    assert.match(script, /function redirectToAccount\(\)/);
+    assert.match(script, /window\.location\.replace\('\/shop\/account\/'\)/);
+    assert.match(script, /'\/shop\/order\/': legacy\.initOrderPage/);
+    assert.match(script, /'\/shop\/pay\/': legacy\.initPayPage/);
+    assert.match(script, /'\/shop\/result\/': legacy\.initResultPage/);
+    assert.match(script, /'\/shop\/content\/': legacy\.initContentPage/);
+});
+
+test('后台页面使用管理员 session，不渲染管理员 token 输入', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+    const script = readShopFrontendSource();
+
+    assert.match(html, /管理员控制台/);
+    assert.match(html, /管理员账号/);
+    assert.match(html, /shop\.js\?v=20260612-admin-revenue-fallback/);
+    assert.doesNotMatch(html, /管理员口令/);
+    assert.doesNotMatch(html, /解锁用量监控/);
+    assert.doesNotMatch(html, /id="adminAccessForm"/);
+    assert.doesNotMatch(html, /id="adminTokenInput"/);
+    assert.doesNotMatch(html, /id="adminInviteForm"/);
+    assert.doesNotMatch(html, /id="inviteCountInput"/);
+    assert.doesNotMatch(html, /id="adminResult"/);
+    assert.doesNotMatch(script, /invite\.apiKey/);
+    assert.doesNotMatch(script, /api\/admin\/invites/);
+    assert.doesNotMatch(script, /x-admin-token/);
+});
+
+test('Admin 页面把业务办理合并成一个栏目', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+
+    assert.match(html, /id="adminBusinessSection"/);
+    assert.match(html, /业务办理/);
+    assert.match(html, /id="adminBusinessRefreshButton"/);
+    assert.match(html, /id="adminInviteCreateForm"/);
+    assert.match(html, /id="adminApiKeyImportForm"/);
+    assert.match(html, /id="passwordResetCodeForm"/);
+    assert.match(html, /id="adminTopupStatusFilter"/);
+    assert.match(html, /id="adminTopupTable"/);
+    assert.match(html, /id="adminInviteConsoleSummary"/);
+    assert.match(html, /id="adminAccountBalancesPanel"/);
+    assert.match(html, /id="adminBalanceSearchInput"/);
+    assert.match(html, /id="adminBalanceStatusFilter"/);
+    assert.match(html, /id="adminBalanceSummary"/);
+    assert.match(html, /id="adminBalanceTable"/);
+    assert.match(html, /id="adminBalanceMessage"/);
+    assert.match(html, /id="adminInviteTable"/);
+    assert.match(html, /id="adminApiKeyPoolTable"/);
+    const topupIndex = html.indexOf('id="adminTopupTable"');
+    const balanceIndex = html.indexOf('id="adminAccountBalancesPanel"');
+    const inviteIndex = html.indexOf('id="adminInviteTable"');
+    assert.ok(topupIndex > -1 && balanceIndex > -1 && inviteIndex > -1);
+    assert.ok(topupIndex < balanceIndex);
+    assert.ok(balanceIndex < inviteIndex);
+    assert.doesNotMatch(html, /id="adminInviteSection"/);
+    assert.doesNotMatch(html, /id="adminPasswordResetSection"/);
+    assert.doesNotMatch(html, /id="adminTopupSection"/);
+});
+
+test('Admin 前端兑换码管理不使用 x-admin-token', () => {
+    const script = readShopFrontendSource();
+
+    assert.match(script, /api\/admin\/invite-console/);
+    assert.match(script, /api\/admin\/session-invites/);
+    assert.match(script, /api\/admin\/session-api-keys/);
+    assert.match(script, /function initAdminInvitePage/);
+    assert.match(script, /adminBusinessRefreshButton/);
+    assert.match(script, /refreshAdminBusiness/);
+    assert.match(script, /function renderAdminBalanceSummary/);
+    assert.match(script, /function renderAdminBalanceTable/);
+    assert.match(script, /function initAdminAccountBalancesPage/);
+    assert.match(script, /api\/admin\/account-balances/);
+    assert.match(script, /refreshAdminBalances/);
+    assert.match(script, /onBalanceChanged/);
+    assert.match(script, /用户余额/);
+    assert.match(script, /欠费用户/);
+    assert.match(script, /待确认充值/);
+    assert.doesNotMatch(script, /x-admin-token/);
+});
+
+test('后台页面包含 usage 监控和 JSONL 导入控件', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+    const script = readShopFrontendSource();
+
+    assert.match(html, /id="adminBusinessSection"/);
+    assert.match(html, /id="adminUsageSection"/);
+    assert.match(html, /id="adminUsageImportSection"/);
+    assert.match(html, /id="usageRefreshButton"/);
+    assert.match(html, /id="usageGroupFilter"/);
+    assert.match(html, /<option value="local">Local<\/option>/);
+    assert.match(html, /id="usageImportForm"/);
+    assert.match(html, /CLIProxyAPI\/logs\/usage/);
+    assert.match(html, /usage-events-YYYY-MM\.jsonl/);
+    assert.match(html, /id="adminBillingUsageCards"/);
+    assert.match(html, /id="adminRevenueCharts"/);
+    assert.match(html, /id="adminRecentCharges"/);
+    assert.match(script, /function initAdminUsagePage/);
+    assert.match(script, /function renderBillingUsageCards/);
+    assert.match(script, /function renderAdminRevenueCharts/);
+    assert.match(script, /function renderRevenuePieChart/);
+    assert.match(script, /function renderCustomerSpendingBars/);
+    assert.match(script, /function renderAdminRecentCharges/);
+    assert.match(script, /api\/admin\/usage-summary/);
+    assert.match(script, /api\/admin\/usage-imports/);
+    assert.match(script, /今日收银/);
+    assert.match(script, /本月收银/);
+    assert.match(script, /收银分析/);
+    assert.match(script, /Shop 用户消费排行/);
+    assert.match(script, /data-revenue-ranking-period="today"/);
+    assert.match(script, /data-revenue-ranking-period="month"/);
+    assert.match(script, /今天收银多少钱/);
+    assert.match(script, /本月一共收了多少钱/);
+    assert.match(script, /今日消费/);
+    const usageSection = html.match(/<section id="adminUsageSection"[\s\S]*?<section id="adminUsageImportSection"/)?.[0] || '';
+    assert.doesNotMatch(usageSection, /adminAccountBalancesPanel/);
+    assert.doesNotMatch(usageSection, /用户余额/);
+    assert.doesNotMatch(html, /完整 API key/);
+    assert.equal((html.match(/data-collapsible-section/g) || []).length, 3);
+    assert.equal((html.match(/data-collapsible-toggle/g) || []).length, 3);
+    assert.equal((html.match(/data-collapsible-content/g) || []).length, 3);
+    assert.match(html, /id="adminBusinessSection"[\s\S]*?data-collapsible-default="open"/);
+    assert.match(html, /id="adminUsageSection"[\s\S]*?data-collapsible-default="open"/);
+    assert.match(html, /id="adminUsageImportSection"[\s\S]*?data-collapsible-default="open"/);
+});
+
+test('Admin 收银图表关键几何样式存在于构建 CSS 中', () => {
+    const script = readShopFrontendSource();
+    const siteCss = fs.readFileSync(path.join(__dirname, '..', 'styles/site.css'), 'utf8');
+
+    assert.match(script, /admin-revenue-pie/);
+    assert.match(script, /admin-revenue-pie-inner/);
+    assert.match(script, /admin-revenue-bars/);
+    assert.match(script, /admin-revenue-bar/);
+    assert.match(script, /admin-revenue-bar-stack/);
+    assert.match(script, /admin-revenue-bar-segment/);
+    assert.match(script, /admin-revenue-bar-segment-hit/);
+    assert.match(script, /admin-revenue-bar-segment-miss/);
+    assert.match(script, /admin-revenue-bar-segment-output/);
+    assert.match(script, /admin-revenue-ranking-legend/);
+    assert.match(script, /barHeightPx/);
+    assert.match(script, /admin-revenue-bar admin-revenue-bar-stack" style="height:\$\{barHeightPx\}px/);
+    assert.doesNotMatch(script, /admin-revenue-bar" style="height:\$\{height\}%/);
+    assert.match(siteCss, /\.admin-revenue-pie\{/);
+    assert.match(siteCss, /width:9rem/);
+    assert.match(siteCss, /height:9rem/);
+    assert.match(siteCss, /\.admin-revenue-bars\{/);
+    assert.match(siteCss, /\.admin-revenue-bar-stack\{/);
+    assert.match(siteCss, /\.admin-revenue-bar-segment-miss\{/);
+    assert.match(siteCss, /box-shadow:inset 0 0 0 1px rgba\(34,34,34,\.35\)/);
+    assert.match(siteCss, /height:14rem/);
+}
+);
+
+test('Admin 收银排行兼容旧排行数据缺少 parts 时不渲染白色空柱', () => {
+    const script = readShopFrontendSource();
+
+    assert.match(script, /function normalizeChargeParts/);
+    assert.match(script, /partChargeTotal/);
+    assert.match(script, /旧格式总金额/);
+    assert.match(script, /chargeNanos: Number\(fallbackTotalNanos \|\| 0\)/);
+});
+
+test('Admin 日志导入栏目展示自动导入状态容器', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+    assert.match(html, /id="usageImportStatus"/);
+});
+
+test('Admin 前端读取 usage 自动导入状态接口', () => {
+    const script = readShopFrontendSource();
+    assert.match(script, /api\/admin\/usage-import-status/);
+});
+
+test('Account 页面包含预充值余额、充值申请和扣费流水容器', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
+
+    assert.match(html, /id="accountModelOverview"/);
+    assert.match(html, /id="accountBalanceCards"/);
+    assert.match(html, /id="accountBillingUsageCards"/);
+    assert.doesNotMatch(html, /id="accountTokenBreakdown"/);
+    assert.doesNotMatch(html, /id="accountUsageCards"/);
+    assert.doesNotMatch(html, /id="paymentReference"/);
+    assert.doesNotMatch(html, /付款备注：/);
+    assert.match(html, /id="topupPaymentNote"[^>]+placeholder="备注可填写微信号"/);
+    assert.doesNotMatch(html, /id="accountHourlyChart"/);
+    assert.doesNotMatch(html, /id="accountDailyChart"/);
+    assert.doesNotMatch(html, /最近 24 小时/);
+    assert.doesNotMatch(html, /本月每日/);
+    assert.match(html, /id="topupForm"/);
+    assert.match(html, /id="topupAmount"/);
+    assert.match(html, /id="accountTopups"/);
+    assert.match(html, /id="accountWeeklySpendingChart"/);
+    assert.match(html, /id="accountCharges"/);
+    assert.match(html, /id="accountLedger"/);
+    assert.match(html, /id="accountGuideSection"/);
+    assert.match(html, /Codex 配置使用方法/);
+    assert.match(html, /https:\/\/api\.aaccx\.pw\/v1/);
+    assert.match(html, /OPENAI_API_KEY/);
+    assert.match(html, /Authorization: Bearer/);
+    assert.match(html, /不要使用 x-api-key/);
+
+    const script = readShopFrontendSource();
+    assert.doesNotMatch(script, /renderTokenBreakdown/);
+    assert.doesNotMatch(script, /\['Input', month\.inputTokens\]/);
+    assert.doesNotMatch(script, /\['Output', month\.outputTokens\]/);
+    assert.doesNotMatch(script, /\['Reasoning', month\.reasoningTokens\]/);
+    assert.doesNotMatch(script, /\['Cached', month\.cachedTokens\]/);
+    assert.match(html, /sk-xx/);
+    assert.equal((html.match(/data-collapsible-section/g) || []).length, 5);
+    assert.equal((html.match(/data-collapsible-toggle/g) || []).length, 5);
+    assert.equal((html.match(/data-collapsible-content/g) || []).length, 5);
+    assert.match(html, /id="accountGuideSection"[\s\S]*?data-collapsible-default="closed"/);
+
+    const modelOverviewIndex = html.indexOf('id="accountModelOverview"');
+    const balanceCardsIndex = html.indexOf('id="accountBalanceCards"');
+    assert.ok(modelOverviewIndex >= 0);
+    assert.ok(balanceCardsIndex > modelOverviewIndex);
+});
+
+test('Account 前端渲染周消费柱状图并提供上一周下一周切换', () => {
+    const script = readShopFrontendSource();
+    const accountChartScript = script.slice(
+        script.indexOf('function renderAccountWeeklySpendingChart'),
+        script.indexOf('function renderAdminRevenueCharts')
+    );
+
+    assert.match(script, /function renderAccountWeeklySpendingChart/);
+    assert.match(script, /data-account-week-offset="-1"/);
+    assert.match(script, /data-account-week-offset="1"/);
+    assert.match(script, /admin-revenue-bar-segment-hit/);
+    assert.match(script, /admin-revenue-bar-segment-miss/);
+    assert.match(script, /admin-revenue-bar-segment-output/);
+    assert.match(script, /admin-revenue-bar admin-revenue-bar-stack/);
+    assert.match(accountChartScript, /admin-revenue-ranking-legend/);
+    assert.match(accountChartScript, /renderStackedChargeBars/);
+    assert.doesNotMatch(accountChartScript, /account-revenue-bar/);
+    assert.match(script, /accountWeeklySpendingChart\.innerHTML = renderAccountWeeklySpendingChart/);
+});
+
+test('Account 用量卡片不展示无效 token 总览和内部价格版本名', () => {
+    const script = readShopFrontendSource();
+
+    assert.doesNotMatch(script, /function renderAccountUsageCards/);
+    assert.doesNotMatch(script, /billing\.priceVersion/);
+    assert.match(script, /本月已扣费/);
+});
+
+test('Account 页把余额和 API key 前置，并默认收起说明和流水', () => {
+    const accountHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
+
+    const billingIndex = accountHtml.indexOf('id="accountBillingSection"');
+    const keysIndex = accountHtml.indexOf('id="accountKeysSection"');
+    const guideIndex = accountHtml.indexOf('id="accountGuideSection"');
+    const usageIndex = accountHtml.indexOf('id="accountUsageSection"');
+    const historyIndex = accountHtml.indexOf('id="accountBillingHistorySection"');
+
+    assert.ok(billingIndex >= 0);
+    assert.ok(keysIndex > billingIndex);
+    assert.ok(guideIndex > keysIndex);
+    assert.ok(usageIndex > guideIndex);
+    assert.ok(historyIndex > usageIndex);
+
+    assert.match(accountHtml, /id="accountBillingSection"[^>]*data-collapsible-default="open"/);
+    assert.match(accountHtml, /id="accountKeysSection"[^>]*data-collapsible-default="open"/);
+    assert.match(accountHtml, /id="accountGuideSection"[^>]*data-collapsible-default="closed"/);
+    assert.match(accountHtml, /id="accountUsageSection"[^>]*data-collapsible-default="open"/);
+    assert.match(accountHtml, /id="accountBillingHistorySection"[^>]*data-collapsible-default="closed"/);
+});
+
+test('Account API key 卡片只展示 key、兑换时间和复制按钮', () => {
+    const script = readShopFrontendSource();
+    const compactBranch = script.slice(
+        script.indexOf('if (options.compactAccountOrder)'),
+        script.indexOf('\n    }\n\n    return `', script.indexOf('if (options.compactAccountOrder)'))
+    );
+
+    assert.match(script, /renderOrderCard\(order, \{ revealKey: true, compactAccountOrder: true \}\)/);
+    assert.match(compactBranch, /API key/);
+    assert.match(compactBranch, /兑换时间/);
+    assert.match(compactBranch, /copyButton/);
+    assert.doesNotMatch(compactBranch, /金额/);
+    assert.doesNotMatch(compactBranch, /手机号/);
+    assert.doesNotMatch(compactBranch, /失效时间/);
+    assert.doesNotMatch(compactBranch, /31 天/);
+    assert.doesNotMatch(compactBranch, /productName/);
+    assert.doesNotMatch(compactBranch, /statusText/);
+});
+
+test('Admin 业务办理栏目包含充值审核容器', () => {
+    const html = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+    const businessSection = html.match(/<section id="adminBusinessSection"[\s\S]*?<\/section>\s*<section id="adminUsageSection"/)?.[0] || '';
+
+    assert.match(businessSection, /充值审核/);
+    assert.match(businessSection, /id="adminTopupStatusFilter"/);
+    assert.match(businessSection, /id="adminTopupTable"/);
+    assert.match(businessSection, /id="adminTopupMessage"/);
+});
+
+test('管理员页和独立重置密码页包含密码重置入口，登录页只保留跳转链接', () => {
+    const adminHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/admin/index.html'), 'utf8');
+    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
+    const resetHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/reset-password/index.html'), 'utf8');
+    const script = readShopFrontendSource();
+
+    assert.match(adminHtml, /id="adminBusinessSection"/);
+    assert.match(adminHtml, /id="passwordResetCodeForm"/);
+    assert.match(adminHtml, /id="passwordResetPhone"/);
+    assert.match(adminHtml, /id="passwordResetCodeResult"/);
+    assert.doesNotMatch(adminHtml, /id="adminPasswordResetSection"/);
+
+    assert.match(loginHtml, /href="\/shop\/reset-password\/"/);
+    assert.doesNotMatch(loginHtml, /id="showPasswordResetButton"/);
+    assert.doesNotMatch(loginHtml, /id="passwordResetForm"/);
+    assert.doesNotMatch(loginHtml, /id="resetPasswordCode"/);
+    assert.doesNotMatch(loginHtml, /id="resetNewPassword"/);
+    assert.doesNotMatch(loginHtml, /id="resetConfirmPassword"/);
+
+    assert.match(resetHtml, /<title>重置密码<\/title>/);
+    assert.match(resetHtml, /class="shop-auth-main[^"]*"/);
+    assert.match(resetHtml, /class="shop-auth-background-figure"/);
+    assert.match(resetHtml, /id="passwordResetForm"/);
+    assert.match(resetHtml, /id="resetPhone"/);
+    assert.match(resetHtml, /id="resetPasswordCode"/);
+    assert.match(resetHtml, /id="resetNewPassword"/);
+    assert.match(resetHtml, /id="resetConfirmPassword"/);
+    assert.match(resetHtml, /href="\/shop\/login\/"/);
+
+    assert.match(script, /function initResetPasswordPage/);
+    assert.match(script, /'\/shop\/reset-password\/': auth\.initResetPasswordPage/);
+    assert.doesNotMatch(script, /function initPasswordResetForm/);
+    assert.doesNotMatch(script, /initPasswordResetForm\(\)/);
+    assert.match(script, /initResetPasswordPage/);
+    assert.match(script, /function initAdminPasswordResetPage/);
+});
+
+test('重置密码页使用紧凑 Auth 表单，避免桌面首屏溢出', () => {
+    const resetHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/reset-password/index.html'), 'utf8');
+
+    assert.match(resetHtml, /class="shop-auth-panel[^"]*md:p-10/);
+    assert.match(resetHtml, /id="passwordResetForm" class="space-y-4"/);
+    assert.equal((resetHtml.match(/h-11 rounded-md/g) || []).length, 4);
+    assert.doesNotMatch(resetHtml, /id="passwordResetForm" class="space-y-5"/);
+    assert.doesNotMatch(resetHtml, /class="shop-auth-panel[^"]*md:p-16/);
+});
+
+test('注册页使用登录页同款 Auth 外壳并移除左侧说明区块', () => {
+    const registerHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/register/index.html'), 'utf8');
+
+    assert.match(registerHtml, /<title>注册<\/title>/);
+    assert.match(registerHtml, /class="shop-auth-main[^"]*"/);
+    assert.match(registerHtml, /class="shop-auth-background-figure"/);
+    assert.match(registerHtml, /src="\/shop\/assets\/login\/yui-login-bg\.png"/);
+    assert.match(registerHtml, /class="shop-auth-content[^"]*"/);
+    assert.match(registerHtml, /class="shop-auth-panel[^"]*"/);
+    assert.match(registerHtml, /id="registerForm"/);
+    assert.match(registerHtml, /id="registerPhone"/);
+    assert.match(registerHtml, /id="registerPassword"/);
+    assert.match(registerHtml, /id="registerConfirmPassword"/);
+    assert.match(registerHtml, /href="\/shop\/login\/"/);
+    assert.doesNotMatch(registerHtml, /Create account/);
+    assert.doesNotMatch(registerHtml, /手机号会作为你的账户身份/);
+    assert.doesNotMatch(registerHtml, /历史兑换过的手机号/);
+    assert.doesNotMatch(registerHtml, /grid lg:grid-cols-\[0\.9fr_1\.1fr\]/);
+});
+
+test('登录页移除左侧标题并保留轻量登录入口', () => {
+    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
+
+    assert.doesNotMatch(loginHtml, /这里是登录页面/);
+    assert.match(loginHtml, /<title>登录<\/title>/);
+    assert.doesNotMatch(loginHtml, /<h1[\s\S]*?<\/h1>/);
+    assert.doesNotMatch(loginHtml, /登录 Shop/);
+    assert.doesNotMatch(loginHtml, /登录 悠一 的小店/);
+    assert.doesNotMatch(loginHtml, /使用手机号和密码进入个人中心/);
+    assert.doesNotMatch(loginHtml, /管理员账号登录后进入控制台/);
+});
+
+test('Auth 外壳样式由 Tailwind 输入文件统一维护，登录页使用中途版人物背景', () => {
+    const loginHtml = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
+    const tailwindCss = fs.readFileSync(path.join(__dirname, '..', 'styles/tailwind.css'), 'utf8');
+    const siteCss = fs.readFileSync(path.join(__dirname, '..', 'styles/site.css'), 'utf8');
+    const assetPath = path.join(__dirname, '..', 'shop/assets/login/yui-login-bg.png');
+    const png = fs.readFileSync(assetPath);
+
+    assert.match(loginHtml, /class="shop-auth-main[^"]*"/);
+    assert.match(loginHtml, /class="shop-auth-background-figure"/);
+    assert.match(loginHtml, /class="shop-auth-content[^"]*"/);
+    assert.match(loginHtml, /class="shop-auth-panel[^"]*"/);
+    assert.match(loginHtml, /src="\/shop\/assets\/login\/yui-login-bg\.png"/);
+    assert.doesNotMatch(loginHtml, /\.login-main/);
+    assert.doesNotMatch(loginHtml, /\.login-background-figure/);
+    assert.doesNotMatch(loginHtml, /\.login-content/);
+    assert.doesNotMatch(loginHtml, /\.login-panel/);
+
+    assert.match(tailwindCss, /\.shop-auth-background-figure/);
+    assert.match(tailwindCss, /left:\s*clamp\(-380px,\s*-22vw,\s*-260px\)/);
+    assert.match(tailwindCss, /bottom:\s*0/);
+    assert.match(tailwindCss, /width:\s*min\(86vw,\s*1120px\)/);
+    assert.match(tailwindCss, /opacity:\s*0\.42/);
+    assert.match(siteCss, /\.shop-auth-background-figure/);
+
+    assert.equal(png.subarray(0, 8).toString('hex'), '89504e470d0a1a0a');
+    assert.equal(png[25], 6);
+});
+
+test('Shop 首页顶部不显示账号入口且正文只保留固定登录入口', () => {
+    const home = fs.readFileSync(path.join(__dirname, '..', 'shop/index.html'), 'utf8');
+    const login = fs.readFileSync(path.join(__dirname, '..', 'shop/login/index.html'), 'utf8');
+    const register = fs.readFileSync(path.join(__dirname, '..', 'shop/register/index.html'), 'utf8');
+    const account = fs.readFileSync(path.join(__dirname, '..', 'shop/account/index.html'), 'utf8');
+    const script = readShopFrontendSource();
+    const header = home.match(/<header[\s\S]*?<\/header>/)?.[0] || '';
+    const accountLinkCount = (home.match(/data-account-link/g) || []).length;
+
+    assert.match(home, /href="\/shop\/login\/"/);
+    assert.equal(accountLinkCount, 0);
+    assert.doesNotMatch(header, /data-account-link/);
+    assert.match(home, /<main[\s\S]*href="\/shop\/login\/"[\s\S]*>登录账户<\/a>/);
+    assert.doesNotMatch(home, /管理控制台/);
+    assert.match(login, /id="loginForm"/);
+    assert.match(login, /id="loginForm"/);
+    assert.doesNotMatch(login, /这里是登录页面/);
+    assert.match(register, /id="registerForm"/);
+    assert.match(register, /至少 8 位/);
+    assert.match(account, /id="logoutButton"/);
+    assert.doesNotMatch(account, /window\.YuiShop\.initAccountPage/);
+    assert.match(script, /'\/shop\/account\/': account\.initAccountPage/);
+});
+
+test('公共顶部导航支持 Shop 的中英日翻译', () => {
+    const script = fs.readFileSync(path.join(__dirname, '..', 'js/lang.js'), 'utf8');
+
+    assert.match(script, /shop:\s*'商店'/);
+    assert.match(script, /shop:\s*'Shop'/);
+    assert.match(script, /shop:\s*'ショップ'/);
+    assert.match(script, /href\.includes\('\/shop'\)[\s\S]*data\.nav\.shop/);
+    assert.match(script, /path === '\/shop' \|\| path\.startsWith\('\/shop\/'\)[\s\S]*return null/);
+});
+
+module.exports = {
+    loadShopScripts
+};