A second medium widget (~360×170pt) that stacks BOTH usage windows in one tile — a row for the 5-hour limit and a row for the 7-day limit, each a complete mini burn-down. It is a separate choice in the widget gallery alongside the single-window widget. Same engine, contrast rules, and rendering modes as the single widget; this doc covers what's specific to the combined layout.
Header spans the top; the body is two equal rows split by a hairline. Each row is a
100px label column + a flexible mini-chart column.
"5h & 7d limits" caption on the right.5H tag + pace word, hero number, reset line. Chart column: mini burn-down with usage bars (5 hourly slots).The two rows deliberately show different hero metrics, matched to how each window is used:
How much of the 5-hour window is still left (e.g. 35% left). Short window, so the raw headroom is what matters in the moment. Colored by pace.
How far above/below a consistent burn across the week (e.g. 7% over pace). Long horizon, so staying on track matters more than the exact number left.
Both are widget settings and can be overridden per window (metric5 / metric7 ∈ remaining / used / pace). The defaults above ship out of the box.
macOS renders the widget in full color on the desktop and desaturates it to a monochrome vibrant material when an app is foregrounded. Both must be legible. The canonical render set:
1.4px, 2.5/3). A reference, recedes.0.5/3.5); turns red on over-pace — the one allowed color cue in monochrome.Each row's accent (its line, hero number, pace word, now dot, and usage bars) is driven by that row's pace:
margin > +4%)
On pace (±4%)
Over pace (margin < −4%)
The brand dot beside the LLM name is the only brand-colored element (Claude clay / Codex teal / Gemini indigo — placeholders, swap for official tokens). Everything else is pace-driven. In monochrome mode the dot desaturates with the rest.
A subtle per-period consumption histogram sits behind each chart — always on. It shows where the budget actually went, period by period, without adding a number to read.
| Aspect | Spec |
|---|---|
| Slots | 5 for the 5-hour row (one per hour), 7 for the 7-day row (one per day). Slots span the full window width edge to edge. |
| Height — scaling | Relative to ideal. The ideal per-period burn (100/n %) maps to a fixed reference height (≈46% of the plot). A period that burned the steady-pace amount reaches that line; less is shorter, more is taller. |
| Overage shading | The portion of a bar above the ideal reference is drawn as a separate, brighter segment (≈2× the base opacity) — an at-a-glance signal of which periods ran hot. |
| Completed period | Full-slot-width bar, base opacity ~0.17 (overage ~0.34). |
| Current period | Narrower bar ending at "now" (in-progress cue), slightly lower opacity (~0.13 / 0.26). |
| Future periods | Faint full-height placeholder slot (opacity ~0.045) — shows the remaining structure, no value. |
| Color | Neutral ink — white in dark mode, black in light mode — at the opacities above. Never the pace hue (keeps it background). |
Alt scaling considered & rejected: normalizing bars to the largest period shows relative shape but loses the pace meaning. Ship the relative-to-ideal + overage version.
To fit two reset lines without collision, the word "resets" is replaced by a refresh glyph, followed by the relative countdown and a compact absolute time:
| Full | Compact | Rule |
|---|---|---|
4:30 PM | 4:30p | AM/PM → a/p |
5:00 PM | 5p | drop :00 on the hour |
Sun 9:00 AM | Sun 9a | keep weekday prefix for 7-day |
Rendered as: ↻ 2h 06m · 4:30p (countdown bold, absolute time dimmed). The freed space widens both charts.
| Quantity | Definition |
|---|---|
idealNow | 100 × (1 − tNow) — budget you should have left at the current position through the window. |
margin | actual − idealNow. Drives pace color + the 7-day hero number. |
slope / projection | Recent burn rate extended to 0%. Dotted; if it reaches 0 before reset the row is running dry early. |
| per-period consumed | remaining(t0) − remaining(min(t1, now)) via linear interpolation of the series — feeds the usage bars. |
| Element | Size / weight | Notes |
|---|---|---|
| Hero number (per row) | 27px / 660 | tabular-nums, pace color; pace mode prefixes a small arrow |
| Row tag (5H / 7D) | 9.5px / 800, 1px tracking | sub color |
| Pace word | 10px / 640 | pace color |
| Reset line | 9.5px | refresh glyph + bold countdown + dimmed compact time |
| LLM name | 14px / 680 | with brand dot |
| Mini chart | 216 × 50 per row | ideal + actual + projection + now + usage bars |
| Container | 360 × 170, radius 24 | 12/15/11 padding |
Colors authored in OKLCH so luminance is tunable independent of hue — required to hit contrast targets across the four mode combinations. Shares the burn-down engine with the single-window widget.