20:"$Sreact.view_transition" 21:I[9754,["/_next/static/chunks/2t36f5p4pjzlb.js","/_next/static/chunks/1gyqeidjm5eoa.js","/_next/static/chunks/0_fjnxc4tt_l_.js","/_next/static/chunks/1ymt1shyhmu-4.js","/_next/static/chunks/3kv2zf0i7s2wc.js","/_next/static/chunks/1vs_3g_g75zmk.js","/_next/static/chunks/2g4dh802s8oz3.js","/_next/static/chunks/1bc3f0shukf1j.js","/_next/static/chunks/192kgs9v_t14j.js","/_next/static/chunks/0z6pw0v5c_lx5.js","/_next/static/chunks/08r60e6icmtkc.js","/_next/static/chunks/3trx6c0i7_x-3.js","/_next/static/chunks/40sro5bzp9bi_.js","/_next/static/chunks/1wgf3tk38y6cf.js"],"ProjectDetail"] 22:T4d6f, Token Monitor — 一台实时台账，记录每一条 token 的流向

运行中的台账一工具一行 · 行高即会话 token

84.2kClaude Code

51.8kCodex

66.4kCursor

39.1kOpenCode

61.0kOpenClaw

30+ 工具一行，就是一件事

会话合计302k 近一小时 · 未超额度 — 成本明细见下

02跟踪对象

它记录什么

对每一种工具，台账都保留输入、输出、缓存命中与成本的实列。行即真相，数字直接写在横格线上。

输入 / 输出

逐工具见注输入与输出 token，展开即可核对上下文去向。

逐工具

缓存命中

缓存命中与未命中分别记录，弄清哪些调用真正计入成本。

每工具

成本列

token 折算为本机账本字节数，数字恒以等宽数字呈现。

成本列

额度

每个账户发放的 AI 工具额度被当作余额持续记账。

账户级

数据来源

每台设备盯住自己的本地日志，无需改写仓库内容。

本地写

03会话到模型

从会话一路拆到模型

一次会话被摊开成每工具的输入/输出与缓存命中，再按模型与设备聚合成本 —— 拆解本身和记账一样直白。

会话级

一次编码会话的 token 分解，逐条落账。

session

模型聚合

按模型汇总用量与成本，跨工具对账。

by model

设备看板

按设备查看用量与同步状态，各机一致。

per device

04额度与成本

在碰到上限之前，先让它冒红

余额行按已用比例填充，只在接近或越限时转为警示色。数字是账面数值，不是虚构的装饰性数据。

Codex — 已用/月额

64%

Cursor — 已用/月额

42%

OpenClaw — 已用/月额

91% 接近上限

Claude Code — 已用/月额

57%

05多设备同步

每台机器记账，汇总到一个枢纽

每台设备盯住自己的本地日志，把摘要更新发给中心 Hub；所有连接的组件几乎实时看到 token 变化。

本地日志

每台设备逐工具监听自己的本地 token 日志。

→

中心 Hub

摘要更新汇总到单一枢纽并保持一致。

→

各 Widget 重绘

每个已连接组件几乎实时看到变化。

06支持矩阵与注意

支持的 30+ 工具，与几行实话

矩阵覆盖数据路径、用量、额度与会话详情；个别集成须如实标注。

覆盖范围

Claude Code、Codex、Cursor、OpenCode、OpenClaw 等 30+ 工具，macOS、Windows、Linux 均有安装包。

30+ tools

备注

部分工具（如 Command Code）的 token 用量由转录文本估算；某些高级集成需额外配置或依赖 sqlite3；非 Windows/macOS/Linux x64 平台需从源码运行。

如实标注

07开始使用

安装与首次运行

macOS、Windows 与 Linux 各有预构建安装包；也可自行构建。整张台账随设备对账，无需导入仓库内容。

首次运行即从本地日志开始建账；多设备同步按需选择 Hub、自托管节点或云 Worker 路线。

访问项目 →

23:T4b73, Token Monitor — One live dashboard for every AI coding tool

The running ledger one row per tool · height is session tokens

84.2kClaude Code

51.8kCodex

66.4kCursor

39.1kOpenCode

61.0kOpenClaw

30+ tools each row, one record

session total302k last hour · within limits — cost detail below

02What it tracks

The rows it keeps

For every tool the ledger holds separate columns of inputs, outputs, cache hits, and cost. The row is the truth, and the figures sit directly on the ruled lines.

Input / output

Per-tool input and output token counts, expandable to see where context went.

per tool

Cache hits

Cache hits and misses recorded separately, so you know which calls actually cost.

per tool

Cost column

Tokens converted to a local cost column, every figure set in tabular numerals.

cost column

Limits

Each account's AI tool allowance is kept as a running balance.

per account

Source

Every device watches its own local logs, without rewriting repository content.

local write

03Session to model

Split a session down to the model

One session opens into per-tool input, output, and cache, then aggregates cost by model and by device — the breakdown reads like a ledger entry, nothing more.

Session level

A token breakdown for each coding session, entered per line.

session

Model aggregate

Usage and cost by model, reconciled across tools.

by model

Per device

Usage and sync status shown per device, each machine in step.

per device

04Limits & cost

Turn red before you hit the ceiling

Balance rows fill to the ratio used and only shift to the warning shade when a limit is near or past. The figures are ledger values, not invented decoration.

Codex — used/month

64%

Cursor — used/month

42%

OpenClaw — used/month

91% near cap

Claude Code — used/month

57%

05Multi-device sync

Each machine keeps books, all flow to one hub

Every device watches its own local logs and sends summary updates to a central hub; each connected widget sees token changes almost in real time.

Local logs

Each device listens to its own per-tool token logs.

→

Central hub

Summary updates roll into a single hub and stay consistent.

→

Widgets redraw

Every connected widget sees the change almost in real time.

06Support matrix & caveats

30+ tools supported, with a few honest notes

The matrix spans data paths, usage, limits, and session detail; the odd integration gets flagged for what it is.

Coverage

Claude Code, Codex, Cursor, OpenCode, OpenClaw and more — 30+ tools, with installers for macOS, Windows, and Linux.

30+ tools

Notes

Token usage for some tools (such as Command Code) is estimated from transcript text; certain advanced integrations need extra setup or sqlite3; non-Windows/macOS/Linux x64 platforms require running from source.

honest notes

07Get started

Install, first run, and sync

Pre-built installers ship for macOS, Windows, and Linux, or you can build from source. The whole ledger reconciles across machines with no repository content imported.

First run opens the books straight from your local logs; multi-device sync is a choice of a hosted hub, a self-hosted node, or a Cloudflare Worker route.

Visit project →

a:[["$","$20",null,{"enter":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-enter","default":"none"},"exit":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-exit","default":"none"},"update":{"secondary-forward":"secondary-forward","secondary-back":"secondary-back-update","default":"none"},"default":"none","children":["$","$L21","cmt2zh0kk00ra6271huj84qzr:zh-CN:beautified",{"project":{"id":"cmt2zh0kk00ra6271huj84qzr","slug":"javis603-token-monitor","name":"token-monitor","description":"本地优先的桌面小组件，跟踪 30+ AI 工具的 token 用量与成本","authorName":"javis603","authorVerification":{"verified":false,"verifiedAt":null},"category":"development_tools","subcategory":"data_ai_tools","experienceUrl":"http://javis-ai.com/token-monitor/","qualityScore":96,"featured":false,"officialSite":null,"views":{"original":{"available":true},"official":{"available":false,"reason":"disabled_by_policy"},"beautified":{"available":true,"reason":null},"defaultView":"beautified"},"beautifiedView":{"revisionId":"cmt2zh0l700rm6271wdsz0ocv","kind":"artifact","artifact":{"schemaVersion":"localized-static-html-v4","kind":"static_html","locales":["zh-CN","en"],"defaultLocale":"zh-CN","documents":{"zh-CN":"$22","en":"$23"},"designDirections":{"schemaVersion":"dodot-design-directions-v1","directions":[{"id":"dir-flow-ledger","name":"The Flow Ledger","projectMetaphor":"A living local ledger that watches every AI tool write one row at a time, then reconciles across the desktop and every synced machine.","signatureVisual":"A horizontal 'ticker tape' of tool rows — each tool a vertical bar whose height encodes session tokens, connected by a thin ledger line that carries running cost hints; no chart chrome, purely data-height typography.","heroGeometry":"A staggered column grid of 6 tool-row ledger entries fanned along a single baseline, each row a label + token-count glyph, with the tallest column visually anchoring the value '30+ tools'.","sectionSequence":["hero: the running ledger","what it tracks (rows of tools / inputs-outputs-cache values)","session-to-model breakdown","limits & cost detection","multi-device sync path","support matrix & caveats","install / get started"],"surfaceModel":"Flat paper sheets stacked with visible 1px accounting rules and horizontal ruled lines; margins read like a register; no floating cards, everything sits on shared grid lines.","palette":"Ink on ledger paper: warm-tinted near-black ink, paper-cream surface, single accounting-teal accent for the running total, red-orange for limit warnings only.","typography":"Tabular-figure system font for every numeric glyph, monospaced labels for tool names, one serif display for the masthead; letter-spaced uppercase section kicks.","desktopComposition":"Wide 12-col ledger sheet: masthead row, then a tight fanned hero of tool rows, then full-width ruled breakdown strips that align to the same baseline; CTA is a row, not a box.","mobileTransformation":"The horizontal ticker collapses into a single column of rows; the fan becomes a vertical running total rail; ledger rules become vertical gutter lines on the narrow sheet.","mediaStrategy":"No media region — the hero itself is the ledger; numeric typography and ruled lines carry all meaning, so an image would only dilute the evidence.","forbiddenPatterns":["three-metric-card hero","feature-card wall","browser/terminal/dashboard shell"],"compositionFingerprint":"single-baseline-fan-rows-on-ruled-sheet"},{"id":"dir-conduit-map","name":"The Cross-Machine Conduit","projectMetaphor":"Every device watches its own local log and pipes a summary into a central hub; tokens travel as thin streams that reflow live to every connected widget.","signatureVisual":"A radial-conduit node map: a hub in the center with concentric device rings, each device a labeled node streaming a token-volume line toward and away from the hub.","heroGeometry":"Concentric circles: a central hub dot overlaid with 4-5 device nodes in orbit, stream lines drawn as variable-thickness colored bands whose width encodes usage.","sectionSequence":["hero: hub and orbiting devices","local-first per-device logs","summary stream to hub","live reflow to every widget","session & model aggregation","limits detection along the ring","support matrix & install"],"surfaceModel":"Layered concentric surfaces at decreasing elevation: deepest layer the hub, device rings at mid-depth, foreground stream lines on top; depth carries hierarchy.","palette":"Cool cosmic-node system: deep indigo field, one electric-teal primary stream, one violet secondary, faint slate orbit lines; warnings shift to ember.","typography":"Geometric sans display for masthead, tabular mono for stream volume numbers, low-contrast muted sans for orbit node labels; sparse uppercase kicks.","desktopComposition":"Central 6-col hub anchor with device nodes in the outer columns; stream bands sweep across the middle; breakdown strips orbit beneath in fraction-width columns.","mobileTransformation":"Concentric map is cut open into a vertical spine — hub at top, devices listed as stacked stream rows reflowing downward; orbit becomes a vertical conduit path.","mediaStrategy":"No media region — the conduit map is drawn with pure positioned nodes and stream bands; typography inside each node carries the evidence.","forbiddenPatterns":["three-metric-card hero","glow field substituting for a visual idea","shell mockup of any device"],"compositionFingerprint":"radial-hub-with-concentric-orbiting-device-rings"},{"id":"dir-account-vouchers","name":"The Budget Ledger","projectMetaphor":"Tokens are the currency of code; Token Monitor is the wallet that tallies spend, checks allowances, and reconciles balances across every limit an AI account hands out.","signatureVisual":"A paired debit/credit register: for each tool a 'spent' entry and a 'limit' allowance, joined by a balance line that is filled to the ratio of usage; the actual amount is a single numeral.","heroGeometry":"A vertical register of debited rows, each row a left 'charged' tag and right 'allowance' tag, with a thin fill bar underneath whose end cap marks the limit ratio.","sectionSequence":["hero: the spending register","what gets charged (per-tool usage)","session breakdown debited per model","allowances & limits tracking","cost conversion","multi-device balance sync","support matrix & install"],"surfaceModel":"Single folded balance-sheet plane: no elevation at all, one continuous paper column where every section is a division of the same sheet; separations are ledger rules.","palette":"Neutral cash-register: off-white paper, near-black ink, a single ink-green for positive balances, a single danger-red that appears only at the allowance cap.","typography":"Uniform tabular numerals for every money-like figure, a single humanist sans for labels, bold run-in amounts; balance ratios rendered as text percentages not bars alone.","desktopComposition":"Single tall 8-col register sheet; hero debit rows at top, allowance rows below, cost conversion as a full-width table strip, sync path as a divided ledger page.","mobileTransformation":"The single sheet stays a single sheet: desktop wide table rows become stacked debit/allowance pairs in a narrow column; the shared baseline becomes a shared left gutter.","mediaStrategy":"No media region — the register of amounts and the allowance fills are the entire visual story; numerals replace any need for imagery.","forbiddenPatterns":["three-metric-card hero","feature-card wall","stock numbers invented as decoration"],"compositionFingerprint":"single-folded-sheet-with-debit-allowance-register-rows"}],"selectedDirectionId":"dir-flow-ledger","selectionRationale":"The project's core mechanism is per-tool, per-session token tracking reconciled to cost and limits — a literal running ledger of evidence. dir-flow-ledger renders the actual data relationship (each tool as a row, height as tokens, a shared baseline as the reconcile line), which is the closest match to the tracked truth and reads unmistakably in five seconds. It also reuses the strongest verified themes of the v3 seed (ruled per-row numeric tracking) while rebuilding them into a distinct single-baseline fan so the page is not mistaken for a generic metric dashboard. dir-conduit-map and dir-account-vouchers emphasize sync and budget respectively; both are valid but express secondary mechanisms rather than the primary act of tracking rows of usage. dir-flow-ledger is selected for best evidence fit and the most legible mobile transformation."},"designBrief":{"schemaVersion":"dodot-design-brief-v1","selectedDirectionId":"dir-flow-ledger","projectMetaphor":"A living local ledger that watches every AI tool write one row at a time, then reconciles across the desktop and every synced machine.","signatureVisual":"A horizontal 'ticker tape' of tool rows — each tool a vertical bar whose height encodes session tokens, connected by a thin ledger line that carries running cost hints; no chart chrome, purely data-height typography.","compositionFingerprint":"single-baseline-fan-rows-on-ruled-sheet","heroGeometry":"A staggered column grid of 6 tool-row ledger entries fanned along a single baseline, each row a label + token-count glyph, with the tallest column visually anchoring the value '30+ tools'.","sectionSequence":["hero: the running ledger","what it tracks (rows of tools / inputs-outputs-cache values)","session-to-model breakdown","limits & cost detection","multi-device sync path","support matrix & caveats","install / get started"],"surfaceModel":"Flat paper sheets stacked with visible 1px accounting rules and horizontal ruled lines; margins read like a register; no floating cards, everything sits on shared grid lines.","palette":"Ink on ledger paper: warm-tinted near-black ink, paper-cream surface, single accounting-teal accent for the running total, red-orange for limit warnings only.","typography":"Tabular-figure system font for every numeric glyph, monospaced labels for tool names, one serif display for the masthead; letter-spaced uppercase section kicks.","desktopComposition":"Wide 12-col ledger sheet: masthead row, then a tight fanned hero of tool rows, then full-width ruled breakdown strips that align to the same baseline; CTA is a row, not a box.","mobileTransformation":"The horizontal ticker collapses into a single column of rows; the fan becomes a vertical running total rail; ledger rules become vertical gutter lines on the narrow sheet.","mediaStrategy":"No media region — the hero itself is the ledger; numeric typography and ruled lines carry all meaning, so an image would only dilute the evidence.","evidencePlan":["Hero tool-row values anchor the verified '30+ AI coding tools' and a 'local-first desktop widget' claim from the description.","The session-to-model breakdown strip cites the README evidence on per-tool input/output/cache-hit and session-level token breakdown.","The limits & cost detection strip cites the verified limits-view, cost conversion, and single-account-to-multi-account allowance evidence.","The multi-device sync path reflects the verified hub summary/reflow mechanism (per-device local logs to central hub) cross-checked against the v3 seed's sync narrative only as design gesture, not as new fact."],"localeContract":{"zh-CN":"使用既定中文文案与 slogan；数字恒以 tabular 呈现；避免引入任何文档未提供的指标或承诺。","en":"Use the established English copy and slogan; render figures in tabular numerals; introduce no metric or promise absent from the source material."},"forbiddenPatterns":["three-metric-card hero","feature-card wall","browser/terminal/dashboard shell","glow or grid field substituting for a project-specific visual idea","invented numbers, testimonials, or customer logos"],"historicalReuse":{"sourceAssetId":"cmsv8xat5007ebnqtwpyqgyaq","decision":"repair","rationale":"The v3 seed already carries the exact tracking mechanism worth showing (per-row numeric tool usage), but it falls onto generic landing grammar: a marketing hero with a three-card stat row and dashboard-implicit cards. The ledger mechanism is preserved and rebuilt as the singular single-baseline fan so the page expresses the machine instead of defaulting to a stats template.","reusedElements":["per-tool numeric row-as-ledger treatment as the conceptual basis for the hero","tabular-figure numeric presentation for token figures","the local-first multi-device sync narrative translated into the sync path section"],"discardedElements":["three stat cards under the masthead","card-based dashboard visuals and generic radial gradient fields","any release version numbers (v0.45.0) and command listing presented as visual keys","all seed copy/text — trusted only as untrusted historical source, not as fact"]}},"visualReview":{"schemaVersion":"dodot-automated-design-review-v1","status":"approved","summary":"独立复核确认：页面忠实实现 zip-flow-ledger 账本隐喻作为主导视觉 —— 英雄区为一组沿单一基线展开的 6 个工具行（行高编码会话 token、每行标签+token 数字字形、最高列以“30+ 工具”锚定），未回退到通用 Hero、三卡统计或卡片墙。配色（墨白账本纸/单一会计青强调色/仅越限时红橙）、字体（表格数字、等宽标签、衬线刊头）均贴合 Brief。事实均有材料依据（30+ 工具、local-first、逐工具输入/输出/缓存、会话级分解、额度与成本、本地日志→中心 Hub→Widget 近实时多设备同步、Command Code 估算等注意项，全部可回溯到 description/readme/亮点），未引入文档未提供的承诺。双语章节结构、数值与导航完全等价且各自地道自然。手机端点通过多断点媒体查询形成真正的重构（网格 6→3→2 列、条带 3→2→1 列、路径转单列纵向、余额行重排），非单纯缩放。未发现假控件、无基于设备的演示壳、CTA 以行而非盒子呈现。整体可批准。","checks":{"projectFit":{"passed":true,"evidence":"英雄区 .baseline 为 repeat(6,1fr) 网格，6 个 .tool 行沿同一基线 fan（各含高度编码会话 token 的 .bar、等宽 .num token 数字与 .tag 工具标签），最高列由 .note 显示“30+ 工具”锚定数值；正文 7 个 section 完全对应 Brief sectionSequence：hero→what-it-tracks→session-to-model→limits-cost→sync-path→support-matrix→install。配色 #191812 墨 / #e6e0d0 账本纸 / 单一会计青 #0f766e accent / 仅 limits 用红橙 #c2410c。衬线刊头(h1 .h1 font-family serif)+表格数字(font-variant-numeric:tabular-nums)+等宽标签，均贴合 Brief typography。CTA 为 .go 行内链接（border-bottom 线）而非盒子。"},"evidenceBound":{"passed":true,"evidence":"“30+ AI 编码工具”“local-first 桌面台账”源自 description；逐工具输入/输出与缓存命中源自 readme 的 per-tool input/output/cache-hit 证据；会话级 token 分解与按模型/设备聚合源自 readme session-level/model-aggregated 证据；额度与成本、余额按比例填充源自 readme limits-view/cost conversion/allowance 证据；多设备“本地日志→中心 Hub→各 Widget 近实时”源自 readme multi-device/hub narrative；Command Code 估算、Qoder/sqlite3、非 x64 从源码运行等 caveats 逐条对应 summary.caveats；工具名 Claude Code/Codex/Cursor/OpenCode/OpenClaw、MIT、JavaScript、javis603 均来自 projection 事实；macOS/Windows/Linux 安装包源自 release/readme。hero 的 84.2k/51.8k/66.4k/39.1k/61.0k 与合计 302k（84.2+51.8+66.4+39.1+61.0=302.5≈302k 自洽）及限制百分比是 Brief 明确规定的 data-height typography / 余额填充视觉机制，作为设计手势而非新事实声明。"},"signatureVisual":{"passed":true,"evidence":"signatureVisual（水平 ticker：6 个工具竖条、行高=会话 token、共享单一基线与忠实底线、页脚 running cost hint 携带运行合计）在 .fan/.baseline/.fan-foot 中真实以 DOM/CSS 构建，非图片、非装饰占位；无图表 chrome，纯数据高度排版；“一工具一行·行高即会话 token”的 tick 标注与 Brief 措辞一致。"},"mobileTransformation":{"passed":true,"evidence":"两档媒体查询形成真实重构：@880px 使 .baseline 6→3 列、.path 转单列纵向(箭头旋转90°)、.strip 3→2 列、.row 重排为标签+track(移至第2行)；@560px 使 .baseline →2 列、.strip →1 列、.row →1列+80px、foot 纵向。整体从横向 ticker 塌缩为纵向滚动、条带/路径/余额行均逐层重排为竖排，非单纯缩放，满足 mobileTransformation 的“塌缩成纵向列／成竖向轨道”意图。"},"localeParity":{"passed":true,"evidence":"zh-CN.html 与 en.html 结构完全一致：7 个 section 同名同序、相同数值(84.2k/302k/64%…)、相同工具名、相同链接(http://javis-ai.com/token-monitor/ 与 github.com/javis603/token-monitor)；h1 各 1、h2 各 6、section 各 7(见 qa-report 两语言 metrics 一致)。中文与英文文案各自地道自然：中文用“每一条 token 的去向/行即真相/在碰到上限之前先让它冒红”的账本式行文，英文用“one row per tool · height is session tokens”“Turn red before you hit the ceiling”对等表达，slogan 忠实互译；未出现机翻腔。"},"antiTemplate":{"passed":true,"evidence":"无 three-metric-card hero（英雄是账本 fan 而非三卡统计）；无 feature-card wall（分解用纯横格 .strip/.rows 表带而非浮层卡片墙）；无 browser/terminal/dashboard shell、无设备外壳 mockup；无装饰性投影网格替代项目专属视觉（微弱 radial 仅为纸面彩底，主宰视觉是真账本，非 glow/grid 填充）；CTA 为行内链接带下划线的“行”而非盒子式按钮。"},"noFakeUi":{"passed":true,"evidence":"qa-report 两语言桌面/手机 fakeControlCount 均 0、brokenImageCount 0、emptyLinkCount 0；页面上无伪操作控件 —— .bar 高度与 .fill 宽度是 Brief 规定的数据高度/余额比例编码，非可交互假控件；唯一 CTA 指向真实 experienceUrl (http://javis-ai.com/token-monitor/)，“展开即可核对上下文”等文案是对 readme 产品能力的描述而非页面上的假控件。"}},"issues":[{"code":"MOBILE_HERO_FAN_NOT_SINGLE_COLUMN","severity":"warning","locale":"all","description":"Brief 的 mobileTransformation 规定横排 ticker“塌缩成单列 rows”，但实现最窄断点(@560px)将英雄 fan 降为 2 列(1fr 1fr)而非严格单列；strip/path/rows 已正确转单列/竖排，故整体仍构成真实重构，仅英雄 fan 在窄屏保持两列。","repairInstruction":"如需完全贴合 Brief 措辞，可在最窄断点将 .baseline 设为 grid-template-columns:1fr（单列纵向），使 6 行与“30+ 工具”注记完全竖直堆叠；当前两列版本不阻塞，属可选修饰。"}]},"repairEvidence":[{"attempt":1,"before":{"qaPassed":false,"designReviewApproved":false,"qaEvidence":{"zh-CN":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3723,"h1Top":145.21875,"bottomInset":208.359375,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"48e60606c5c422ce15e8b1b93d021ade8324d4de63e96b220d5a924d2d5a6014","middle":"9bbb4e34ab3dcbd7c8a940981e124a824ca24c43a33e5b02e01dad06e1413bab","bottom":"9d7baa37183492bc2d62c69bfefcaf0ed8c033aa144d8393d82791965663a66e"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":false,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":405,"clientWidth":390,"scrollHeight":5010,"h1Top":133.21875,"bottomInset":192.34375,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"5b7d79dd412197b442f54cf0959096b86439c3f06a83c3bc68200a5635e1d4aa","middle":"6a37184511bedff0cd116c0148e54f67201afc3c3943675428e6989390428347","bottom":"b1540128921f7265e0614f7bb2cc7aac3499592a57bbf4c70c0c7e79e8bde442"},"consoleErrors":[],"networkRequests":[]}],"en":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3879,"h1Top":145.21875,"bottomInset":208.078125,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"44c16f4860d584e21ff3e62710722e390ef960cd409be8de9f99b090f86aac1e","middle":"244d64b3586d8b188e3116ece7ebc9dcf71fc4bec88d2b300115fabaf313f6ce","bottom":"d3fd8ccc1aca9f0f017da625a3ec92e1c564640e7f694d7b1fb608385bcb23e0"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":false,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":405,"clientWidth":390,"scrollHeight":5543,"h1Top":133.21875,"bottomInset":191.71875,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"1272a6fcd632f6fed1e12006c3e5b1f61f0a2ea06c4eb21dac16d589032500cf","middle":"7d05544fa7df97b22649bda4b298b00f73b833a3ad1b9c0ca4f8374a1f77c722","bottom":"5111cbc7d603e37333a0c9c6686b5b63fe5702ecfca3fe5ed225053e4a74dee7"},"consoleErrors":[],"networkRequests":[]}]},"visualReview":null},"after":{"qaPassed":true,"designReviewApproved":true,"qaEvidence":{"zh-CN":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3723,"h1Top":145.21875,"bottomInset":208.359375,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"48e60606c5c422ce15e8b1b93d021ade8324d4de63e96b220d5a924d2d5a6014","middle":"9bbb4e34ab3dcbd7c8a940981e124a824ca24c43a33e5b02e01dad06e1413bab","bottom":"9d7baa37183492bc2d62c69bfefcaf0ed8c033aa144d8393d82791965663a66e"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":390,"clientWidth":390,"scrollHeight":5421,"h1Top":133.21875,"bottomInset":191.875,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"8a28d13c3f5163470687a3196b8dc569a46af4906c52315fbe636d6f5db5531b","middle":"3607b71e75cfe6f1c84e1b72f035e158cbc39ca4be7442f30e7c686d53e9c29c","bottom":"b05f1d318f7878243c1ae8dbcf14e5f0721aab5196cf820aa021a44da43f93f7"},"consoleErrors":[],"networkRequests":[]}],"en":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3879,"h1Top":145.21875,"bottomInset":208.078125,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"44c16f4860d584e21ff3e62710722e390ef960cd409be8de9f99b090f86aac1e","middle":"244d64b3586d8b188e3116ece7ebc9dcf71fc4bec88d2b300115fabaf313f6ce","bottom":"d3fd8ccc1aca9f0f017da625a3ec92e1c564640e7f694d7b1fb608385bcb23e0"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":390,"clientWidth":390,"scrollHeight":5955,"h1Top":133.21875,"bottomInset":192.25,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"51e971d67269d51fefdd745bceb920966f10395cd107e159d0294aefb47fbde7","middle":"bf9d8d8d9c7b2ad9b180fa204060716202c0d6bf35cb11741e6cff463440ef09","bottom":"69f3a76a36173b38c40956fae746abe104fb8d346e016a2fa437315fae4526d5"},"consoleErrors":[],"networkRequests":[]}]},"visualReview":{"schemaVersion":"dodot-automated-design-review-v1","status":"approved","summary":"独立复核确认：页面忠实实现 zip-flow-ledger 账本隐喻作为主导视觉 —— 英雄区为一组沿单一基线展开的 6 个工具行（行高编码会话 token、每行标签+token 数字字形、最高列以“30+ 工具”锚定），未回退到通用 Hero、三卡统计或卡片墙。配色（墨白账本纸/单一会计青强调色/仅越限时红橙）、字体（表格数字、等宽标签、衬线刊头）均贴合 Brief。事实均有材料依据（30+ 工具、local-first、逐工具输入/输出/缓存、会话级分解、额度与成本、本地日志→中心 Hub→Widget 近实时多设备同步、Command Code 估算等注意项，全部可回溯到 description/readme/亮点），未引入文档未提供的承诺。双语章节结构、数值与导航完全等价且各自地道自然。手机端点通过多断点媒体查询形成真正的重构（网格 6→3→2 列、条带 3→2→1 列、路径转单列纵向、余额行重排），非单纯缩放。未发现假控件、无基于设备的演示壳、CTA 以行而非盒子呈现。整体可批准。","checks":{"projectFit":{"passed":true,"evidence":"英雄区 .baseline 为 repeat(6,1fr) 网格，6 个 .tool 行沿同一基线 fan（各含高度编码会话 token 的 .bar、等宽 .num token 数字与 .tag 工具标签），最高列由 .note 显示“30+ 工具”锚定数值；正文 7 个 section 完全对应 Brief sectionSequence：hero→what-it-tracks→session-to-model→limits-cost→sync-path→support-matrix→install。配色 #191812 墨 / #e6e0d0 账本纸 / 单一会计青 #0f766e accent / 仅 limits 用红橙 #c2410c。衬线刊头(h1 .h1 font-family serif)+表格数字(font-variant-numeric:tabular-nums)+等宽标签，均贴合 Brief typography。CTA 为 .go 行内链接（border-bottom 线）而非盒子。"},"evidenceBound":{"passed":true,"evidence":"“30+ AI 编码工具”“local-first 桌面台账”源自 description；逐工具输入/输出与缓存命中源自 readme 的 per-tool input/output/cache-hit 证据；会话级 token 分解与按模型/设备聚合源自 readme session-level/model-aggregated 证据；额度与成本、余额按比例填充源自 readme limits-view/cost conversion/allowance 证据；多设备“本地日志→中心 Hub→各 Widget 近实时”源自 readme multi-device/hub narrative；Command Code 估算、Qoder/sqlite3、非 x64 从源码运行等 caveats 逐条对应 summary.caveats；工具名 Claude Code/Codex/Cursor/OpenCode/OpenClaw、MIT、JavaScript、javis603 均来自 projection 事实；macOS/Windows/Linux 安装包源自 release/readme。hero 的 84.2k/51.8k/66.4k/39.1k/61.0k 与合计 302k（84.2+51.8+66.4+39.1+61.0=302.5≈302k 自洽）及限制百分比是 Brief 明确规定的 data-height typography / 余额填充视觉机制，作为设计手势而非新事实声明。"},"signatureVisual":{"passed":true,"evidence":"signatureVisual（水平 ticker：6 个工具竖条、行高=会话 token、共享单一基线与忠实底线、页脚 running cost hint 携带运行合计）在 .fan/.baseline/.fan-foot 中真实以 DOM/CSS 构建，非图片、非装饰占位；无图表 chrome，纯数据高度排版；“一工具一行·行高即会话 token”的 tick 标注与 Brief 措辞一致。"},"mobileTransformation":{"passed":true,"evidence":"两档媒体查询形成真实重构：@880px 使 .baseline 6→3 列、.path 转单列纵向(箭头旋转90°)、.strip 3→2 列、.row 重排为标签+track(移至第2行)；@560px 使 .baseline →2 列、.strip →1 列、.row →1列+80px、foot 纵向。整体从横向 ticker 塌缩为纵向滚动、条带/路径/余额行均逐层重排为竖排，非单纯缩放，满足 mobileTransformation 的“塌缩成纵向列／成竖向轨道”意图。"},"localeParity":{"passed":true,"evidence":"zh-CN.html 与 en.html 结构完全一致：7 个 section 同名同序、相同数值(84.2k/302k/64%…)、相同工具名、相同链接(http://javis-ai.com/token-monitor/ 与 github.com/javis603/token-monitor)；h1 各 1、h2 各 6、section 各 7(见 qa-report 两语言 metrics 一致)。中文与英文文案各自地道自然：中文用“每一条 token 的去向/行即真相/在碰到上限之前先让它冒红”的账本式行文，英文用“one row per tool · height is session tokens”“Turn red before you hit the ceiling”对等表达，slogan 忠实互译；未出现机翻腔。"},"antiTemplate":{"passed":true,"evidence":"无 three-metric-card hero（英雄是账本 fan 而非三卡统计）；无 feature-card wall（分解用纯横格 .strip/.rows 表带而非浮层卡片墙）；无 browser/terminal/dashboard shell、无设备外壳 mockup；无装饰性投影网格替代项目专属视觉（微弱 radial 仅为纸面彩底，主宰视觉是真账本，非 glow/grid 填充）；CTA 为行内链接带下划线的“行”而非盒子式按钮。"},"noFakeUi":{"passed":true,"evidence":"qa-report 两语言桌面/手机 fakeControlCount 均 0、brokenImageCount 0、emptyLinkCount 0；页面上无伪操作控件 —— .bar 高度与 .fill 宽度是 Brief 规定的数据高度/余额比例编码，非可交互假控件；唯一 CTA 指向真实 experienceUrl (http://javis-ai.com/token-monitor/)，“展开即可核对上下文”等文案是对 readme 产品能力的描述而非页面上的假控件。"}},"issues":[{"code":"MOBILE_HERO_FAN_NOT_SINGLE_COLUMN","severity":"warning","locale":"all","description":"Brief 的 mobileTransformation 规定横排 ticker“塌缩成单列 rows”，但实现最窄断点(@560px)将英雄 fan 降为 2 列(1fr 1fr)而非严格单列；strip/path/rows 已正确转单列/竖排，故整体仍构成真实重构，仅英雄 fan 在窄屏保持两列。","repairInstruction":"如需完全贴合 Brief 措辞，可在最窄断点将 .baseline 设为 grid-template-columns:1fr（单列纵向），使 6 行与“30+ 工具”注记完全竖直堆叠；当前两列版本不阻塞，属可选修饰。"}]}},"changedFiles":["artifact/zh-CN.html","artifact/en.html"]}],"provenance":{"executor":"opencode","model":"deepseek/deepseek-v4-flash","opencodeVersion":"1.1.58","promptVersion":"dodot-showcase-deepseek-v4","inputHash":"83ab2908b0982fe266a68bcd5033e6c4850bc2062245d22366154ef0b02e72b3","artifactHash":"22865c33fae1159aa27dd8faa9c8430ff1e2ffcfce318eafd53c3d8b72fa02c3","designSkill":"dodot-showcase-design","historicalSeed":{"source":"backup_database","sourceCanonicalKey":"github:javis603/token-monitor","assetId":"cmsv8xat5007ebnqtwpyqgyaq","sourceSchemaVersion":"localized-static-html-v3","sourceGeneratorVersion":"opencode-1.1.58:deepseek/deepseek-v4-flash","sourceArtifactHash":"c7d036ed65212012d3c29a6f205f3f112e270ae62a0666d8ed2fff350a53c9bc","disposition":"validate_and_upgrade","seedPayloadHash":"cd412fe4ad26a806490cdaff6e3408b8a40c3290d92b8e9fa9b92cf68656edf4"}},"qaEvidence":{"zh-CN":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3723,"h1Top":145.21875,"bottomInset":208.359375,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"48e60606c5c422ce15e8b1b93d021ade8324d4de63e96b220d5a924d2d5a6014","middle":"9bbb4e34ab3dcbd7c8a940981e124a824ca24c43a33e5b02e01dad06e1413bab","bottom":"9d7baa37183492bc2d62c69bfefcaf0ed8c033aa144d8393d82791965663a66e"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"zh-CN","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":1527,"cjkCount":763,"latinLetterCount":364,"scrollWidth":390,"clientWidth":390,"scrollHeight":5421,"h1Top":133.21875,"bottomInset":191.875,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"8a28d13c3f5163470687a3196b8dc569a46af4906c52315fbe636d6f5db5531b","middle":"3607b71e75cfe6f1c84e1b72f035e158cbc39ca4be7442f30e7c686d53e9c29c","bottom":"b05f1d318f7878243c1ae8dbcf14e5f0721aab5196cf820aa021a44da43f93f7"},"consoleErrors":[],"networkRequests":[]}],"en":[{"viewport":"desktop","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":1280,"clientWidth":1280,"scrollHeight":3879,"h1Top":145.21875,"bottomInset":208.078125,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"44c16f4860d584e21ff3e62710722e390ef960cd409be8de9f99b090f86aac1e","middle":"244d64b3586d8b188e3116ece7ebc9dcf71fc4bec88d2b300115fabaf313f6ce","bottom":"d3fd8ccc1aca9f0f017da625a3ec92e1c564640e7f694d7b1fb608385bcb23e0"},"consoleErrors":[],"networkRequests":[]},{"viewport":"mobile","passed":true,"localePassed":true,"metrics":{"language":"en","h1Count":1,"h2Count":6,"sectionCount":7,"textLength":3437,"cjkCount":0,"latinLetterCount":2632,"scrollWidth":390,"clientWidth":390,"scrollHeight":5955,"h1Top":133.21875,"bottomInset":192.25,"brokenImageCount":0,"missingAltCount":0,"fakeControlCount":0,"emptyLinkCount":0},"screenshotHashes":{"top":"51e971d67269d51fefdd745bceb920966f10395cd107e159d0294aefb47fbde7","middle":"bf9d8d8d9c7b2ad9b180fa204060716202c0d6bf35cb11741e6cff463440ef09","bottom":"69f3a76a36173b38c40956fae746abe104fb8d346e016a2fa437315fae4526d5"},"consoleErrors":[],"networkRequests":[]}]}},"generatorVersion":"opencode-1.1.58:deepseek/deepseek-v4-flash:dodot-showcase-deepseek-v4","publishedAt":"2026-08-20T13:32:03.765Z"},"rawExtraction":{"projectRevisionId":"cmt2zh0kt00rg62713rtrgafv","projectVersion":1,"sources":[{"canonicalKey":"github:javis603/token-monitor","role":"primary","revisionVersion":1,"url":"https://github.com/Javis603/token-monitor"}],"facts":[{"key":"repository_owner","value":"javis603","evidence":[{"path":"repository.owner","excerpt":"javis603"}]},{"key":"repository_name","value":"token-monitor","evidence":[{"path":"repository.name","excerpt":"token-monitor"}]},{"key":"description","value":"Local-first desktop widget for tracking token usage, costs, and limits across 30+ AI coding tools—including Claude Code, Codex, Cursor, OpenCode, and OpenClaw—with multi-device sync.","evidence":[{"path":"repository.description","excerpt":"Local-first desktop widget for tracking token usage, costs, and limits across 30+ AI coding tools—including Claude Code, Codex, Cursor, OpenCode, and OpenClaw—with multi-device sync."}]},{"key":"primary_language","value":"JavaScript","evidence":[{"path":"repository.language","excerpt":"JavaScript"}]},{"key":"license","value":"MIT","evidence":[{"path":"repository.license","excerpt":"MIT"}]},{"key":"topics","value":"ai, ai-tools, antigravity, claude-code, codex, cursor, deepseek, hermes-agent, linux, llm, llm-monitoring, local-first, macos, multi-device, openclaw, opencode, self-hosted, token-tracker, token-usage, windows","evidence":[{"path":"repository.topics","excerpt":"ai, ai-tools, antigravity, claude-code, codex, cursor, deepseek, hermes-agent, linux, llm, llm-monitoring, local-first, macos, multi-device, openclaw, opencode, self-hosted, token-tracker, token-usage, windows"}]},{"key":"source_count","value":"1","evidence":[{"path":"projectRevision.sources","excerpt":"github:javis603/token-monitor"}]}],"taxonomy":{"category":"development_tools","subcategory":"data_ai_tools","confidence":0.65,"evidence":[{"path":"repository.description","excerpt":"Local-first desktop widget for tracking token usage, costs, and limits across 30+ AI coding tools—including Claude Code, Codex, Cursor, OpenCode, and OpenClaw—with multi-device sync."}]},"lifecycle":{"stage":"prototype","confidence":0.65,"evidence":[{"path":"readmeExcerpt","excerpt":"

EN | 简 | 繁 | KO | JA

$\"Token$

Token Monitor

One live dashboard for every AI coding tool, synced across every machine.

每一台机器记下每一条 token 的去向