Wireframes v6. Cool near-black system with clean gradients: indigo→violet as the single UI gradient, blue/purple/lavender/cyan as the model-series palette, capsule gradient bars, and a Sankey cost-flow as the premium signature. Machined base kept: hairlines, mono digits, keycaps, scope labels.
v6.1 · 2026-07-10 · references: Dash0 AI-coding dashboard (series palette, card headers, Sankey), gradient-capsule chart, ambient glow · 30-day default period (7 bars never balloon again) · shiny orange CodeBurn brand mark · full period vocabulary: Today / 7D / 30D / Month / 6M / Custom
Design language
One gradient for the UI (indigo→violet: active rail, primary button, plan tracks, toggle). Data gets the series palette. Trouble is text color only — amber pace, red overage, mint savings.
Canvas#0B0D13 + ambient glow
Panel#12151F / head #161A27
UI gradient#5B8CFF → #8B7CF6
Opus#5B8CFF
Sonnet#8B7CF6
Haiku#B5A8FF
GPT / Codex#4DD8E6
Savings#3ECF8E
Pace#E8B93E
Overage#F26D6D
One UI gradientIndigo→violet marks what's interactive or active. It never colors data.
Series palette for dataEach model owns a hue everywhere — chart, legend, Sankey, table dot. Recognition over decoration.
Capsule barsHistory in muted slate capsules; the emphasized bar gets the blue→cyan gradient and a soft glow.
Card = header + bodyDash0-style header strip carries the title and controls, keeping bodies pure content.
Status is textAmber pace, red overage, mint savings. No dots, no pills, no gradient alarms.
01 · Overview
Ten-second triage. Big clean numbers, one glowing capsule chart, the damage list.
Overview
Last 30 days · All providers · 2 devices
Today7D30DMonth6MCustom
All providers
Today
$6.20
12 sessions
Month to date
$312.40
+24% vs June pace
Projected month
$968 est
$748 over plans
Waste found
$23.60 /wk
3 fixes ready
Daily spendbiggest driver: Opus 4.8 in codeburn, +61% — why ›
Notes. Capsule bars: slate history, gradient + glow on the peak, plain blue on second-highest — the eye finds Monday instantly. Session rows carry the model's series dot. Deltas: blue = neutral info, amber = pace, red = overage, mint = good.
02 · Spend
Stacked series by model, then the signature: cost flowing model → project as a Sankey. Every ribbon is a filterable claim.
Spend
Last 30 days · All providers
Today7D30DMonth6MCustom
All providers
ProjectsActivityToolsMCPSubagents
Daily spend by model
Opus 4.8Sonnet 5Haiku 4.5GPT-5.5 Codex
By project16 projects
01
codeburn124 sessions
$246.10›
02
agentseal-dash74 sessions
$141.30›
03
hermes-eval38 sessions
$77.85›
04
client-api est29 sessions · Cursor
$58.60›
05
dotfiles21 sessions
$34.20›
Cost flow · model → projectclick a ribbon to filter
⌘KCommand⌘EExport view⇥Switch lens
Notes. The Sankey is the premium signature — each ribbon inherits its model's hue and fades toward the project side; clicking one scopes every panel to that model × project pair. Stacked bars share the same series palette, so the legend teaches colors once for the whole app.
03 · Optimize
Waste, reverts, abandoned, fixes. Findings ranked by recoverable dollars, evidence in mono, savings in mint.
Twelve sessions went nowhere$39.20 across 12 abandoned sessions with no surviving edits — nearly all started without a stated goal.
no surviving edits vs git · 12 sessions › · full list under Abandoned
$5.80/wk
⌘CCopy fix→Open sessions
Notes. The old Yield analysis lives under Reverts and Abandoned (git-correlated, per codeburn yield). Segments carry their dollar totals so the tab row itself is a summary.
04 · Models
The pricing table with each model's series dot. Compare is a mode; unpriced rows carry their own fix.
Models
Last 30 days · All providers
By modelBy task
Compare…
Model
Calls
Input
Output
Cache read
Cost
Saved
Claude Opus 4.8
4,812
152.6M
9.64M
119.4M
$331.20
$86.40
GPT-5.5 Codex
2,704
86.9M
7.52M
45.1M
$137.90
$35.10
Claude Sonnet 5
3,318
77.7M
6.08M
63.3M
$108.63
$27.90
Claude Haiku 4.5
1,270
32.5M
2.84M
16.9M
$34.75
$5.85
my-proxy-model add alias ›
176
4.8M
0.4M
—
$0.00
—
⌘EExport tableSpaceSelect for comparefriendly names · raw IDs on hover
Notes. Series dots make the table, charts, and Sankey one continuous vocabulary. By-task nests category rows under each model (models --by-task); Compare… slides a sheet over the table for the selected rows.
05 · Plans
Vendor clocks, not analytics periods. The gradient track is UI; the warning is text.
Plans
Cycle Jun 15 – Jul 14 · day 26 of 30
Cycle: Jun 15 – Jul 14
Add plan…
Claude Max$200 / month · claude$186.20 · 93%
On pace to exceed in 4 days — projected $214 by Jul 14
Cursor Pro$20 / month · cursor$8.20 · 41%
On track
API usagecodex · pay as you go, no plan$31.02 this cycle
↵Edit planpresets: Claude Max/Pro · Cursor Pro · custom
Notes. One overage line per provider plan, mirroring the CLI. Past 100% the fill switches to the red gradient and the overage renders in dollars beside it.
06 · Settings — with Devices inside
Own rail, deep-linkable. Pairing is the only amber on screen; Approve is the view's single gradient button.
Settings
This device
Toruk's MacBook ProVisible on the local network as codeburn-mbp.local
Visibility: on
Discovered nearbylistening…
Mac Studiowants to pair · fingerprint 7F:2A:…:C4
Approve
Paired
toruk-minilast pull 2h ago · 34 sessions · $41.20 this month
Pull now
Combine usage from paired devicesscope captions gain “· 2 devices” when on
escBackpairing uses mutual TLS · approve-style, no PIN
Notes. No period chrome — configuration is timeless. Approve-style pairing mirrors the CLI: a human verifies the fingerprint, no PIN.
07 · States & trust
Missing tools, denied permissions, empty data are normal for local-first scanning. Text status only.
Empty / permission
Claude1,412 sessions
Codex688 sessions
Cursorpermission denied — grant Full Disk Access
Fix…
Devinnot installed
Loading
Scanning 30 providers…
First scan reads every session file; later scans are incremental via the daily cache.
Provenance
$31.02 est
Cursor reports messages without token counts; cost is estimated from message sizes and LiteLLM prices.
Inactive window: gradient rail and selection dim to slate.
Focus: indigo focus rings, never browser outlines.
Hover: row fills at 5% lavender; chart hover = column highlight + mono value popover; Sankey ribbons brighten on hover and filter on click.
Scrolling: native overlay scrollbars.
⌘K palette: filters, export, view jumps, session search.
Series rule: each model's hue is global — chart, Sankey, dots, legends. UI gradient never colors data.
Light theme: same ladder on paper (#FAFBFE, panels white, hairlines 6% indigo-black) — implementation deliverable, same tokens.
Export: ⌘E everywhere, scoped to current filters.
Motion (codex): bars rise on view entry, Sankey ribbons draw left→right, active rail glides — 120–180ms, no bounce.
Depth (codex): cards carry a 1px top-edge light and faint bottom occlusion; active controls get inner highlight + subtle bloom, centers stay dark; 1–2% canvas noise to kill flat Electron darkness.
Rendering (codex): charts locked to device pixel ratio, fixed bar geometry, legends exactly matching series colors — test at 1×/2×.
Numerals: aligned decimals, muted currency symbols, deltas enlarged only when meaningful.
Period control: all six options shown per product decision; codex's alternative (segmented Today·7D·30D·Month + “More ▾” holding 6M/Custom) is on file if the toolbar ever feels crowded.
Orange discipline (codex): the flame mark stays the single warm object — never data, progress, status, nav, or chart highlights.