# Direction 3, Glass: notes

*W-design-pass2-d3-glass, Opus 5.5, 2026-09-27 08:51 to 09:10 Beirut. Brief: `briefs/W-design-pass2-d3.md` over `briefs/W-design-pass2-SHARED.md`. Files: `situation.html`, `now.html`, `shots/`, `scripts/shots.cjs`, `scripts/verify.cjs`, `scripts/palette_cvd.py`, `palette-cvd.txt`, `verify.txt`, `shots.txt`. Everything below is my design judgement (grade C) unless it cites a run we saved (grade A, our computation).*

**Look first:** `shots/situation-desktop.jpg`, then `shots/situation-desktop-1657.jpg` (same page with the moment at 16:57Z), then `shots/situation-phone.jpg`, then the two Now shots.

## (a) The direction, and what it keeps from A

A situation page you would leave open: one centred 880 px reading column, the state word at 40 px, one sentence, three soft number pills, then a large ice-blue hero chart of money in with price drawn over it and a round-handled scrubber under it that moves one moment line through every chart below. Almost everything else is behind one tap.

Kept from A: the dark ground, ice blue `#72C3E6` as the only accent, A's orange `#C8742E` for weakening, crimson only filled or large, pale chalk for you. Also the state word first, the caption voice for provenance ("tape · 12 s"), and position for category and glyph for direction. Kept the order too: state and sentence, since you looked, waiting for, charts, evidence, about this data.

## (b) What changes, mapped to Thomas's points

| Thomas said | What Glass does |
|---|---|
| Still too terminal-like; courier font not smooth | No monospace anywhere except the address. One humanist-geometric sans (Manrope), rounded 14 px cards lifted by a 1 px top highlight instead of hairline boxes, pill-shaped controls. |
| Too much text, internal information | No ids, rule names, "illus." tags or schema words on the visible layer (grep in section (i)). The since-you-looked list is 5 short lines; the "why this state" checklist, every refusal, every clock and the illustrative list sit in drawers. |
| Hierarchy does not make sense | Four levels by size only: state word 40, hero numbers 32, body 16 to 20, captions 12.5. One full-strength accent per view, the state word. |
| Overwhelming | Density is traded for calm on purpose: one column, generous space, 6 collapsed drawers. Nothing is dropped: A's hero 876, the 260 recurring, +87%, market cap, liquidity, why-this-state, data notes and the address are all on the page, some one tap down. |
| Wireframes v1 charts were more indicative; money in, money out looked better | The money chart is back as its own large chart (S6 form): bars per interval with the zero line, and the negative side reserved for money out (empty and hatched, "money out · not read yet", never invented bars). |
| Clock chart too complex; want stacked charts with one slider | Four separate charts on one x axis (16:27Z to now), one moment line through all of them, one scrubber, readouts at the right of every chart. |
| Visual pleasure, a smooth interface | Soft area gradients on the bars, a blue glow behind the hero (meaning-free), a glowing Fomo marker, 120 ms eases on the handle and readouts. Nothing loops or pulses. |
| Collapsed text you can peek at | Evidence as chevron cards with a one-line summary on the closed card ("939 in · 260 recurring"), so a closed drawer still says something. |

**Chart order, argued.** Hero (money in, price over it, money out below zero), then attention, holders, you. Price is merged into the hero on a second scale as the brief asks, rather than being its own chart. Money out is the hero's negative side, not a separate empty chart, because a 100 px chart of nothing is exactly the "empty space instead of information" failure. Attention sits directly under the hero, ahead of holders, so the lag bracket reads against the money it measures.

**Since you looked: a card, not a rail.** A right rail would break the single reading column, which is the whole character of Glass, and at 1280 it would push the charts to 600 px. The card sits between the hero and the charts, so a reader dragging the scrubber sees the lines dim a few centimetres above it. Waiting for shares the card as a second column on desktop and a single line on the phone.

## (c) Type

**Manrope** (Google Fonts, SIL OFL; loaded by link, fallback `ui-sans-serif, system-ui, Segoe UI, Roboto`). It is geometric enough to feel consumer-grade and soft, its tabular figures are real (`font-variant-numeric: tabular-nums` is set on the root, so every readout keeps its width while the slider moves), and its 700 weight carries a 40 px state word without shouting. Rejected: Plus Jakarta Sans (too wide for three pills on a 390 phone), DM Sans (thin figures at 12.5 px). The address uses the system mono, with no web font.

| Role | Desktop | Phone |
|---|---|---|
| State word | 40 px / 700 | 32 px |
| Hero numbers (pills) | 32 px / 700 | 24 px (see (h)) |
| Sentence | 20 px / 500 | 17 px |
| Body, list lines, drawer rows | 15 to 16 px | 14.5 to 15 px |
| Chart readouts | 18 to 22 px / 700 | 16 to 17 px |
| Captions | 12.5 px / 500, ink 56% | 11.5 to 12.5 px |

## (d) Palette and CVD

Ground `#0A0E13`, surface `#131A22`, raised `#1A232D` (pills, sparkline wells), ink `#E8EEF3`; captions ink 56%, unknown ink 50% plus hatch. Hues unchanged from A. Run: `python3 scripts/palette_cvd.py > palette-cvd.txt` (grade A, our computation, imports the T7 maths).

```
evidence+  vs weakening   46.8   46.1   46.7   58.4     (normal / protan / deutan / tritan)
evidence+  vs safety      60.1   33.8   34.5   68.5
evidence+  vs user        39.0   37.3   40.7   34.8
evidence+  vs neutral     16.4   12.7   14.1   20.2
weakening  vs safety      34.4   33.5   16.2   10.5
weakening  vs user        33.9   28.3   23.2   30.7
safety     vs user        57.7   47.9   28.6   39.7
worst pair, any vision type: dE 10.5 (weakening vs safety, tritan)
contrast on surface: ink 14.98, caption 5.48, unknown 4.63, ice 8.90, orange 5.00, safety 3.80, chalk 13.34
```

Safety stays below 4.5:1 as text, so it only appears as a filled chip (Now list) or a large word; weakening versus safety under tritanopia is why the safety chip also carries a square glyph. No green versus red anywhere; money out, when it exists, is below the line and orange (Now list, LUMEN and MARLIN).

## (e) The slider

- One `role="slider"` handle (28 px circle, 48 px hit area) on a rail under the hero chart, ticks every 10 min (every 20 on the phone), and one moment line drawn over the whole chart card. Labels and readouts sit on the surface colour, so the line passes behind text instead of through it.
- Pointer: press and drag anywhere on any chart, or on the rail. Touch: a tap or a horizontal drag moves it; vertical swipes still scroll the page (`touch-action: pan-y`). Keys: arrows 1 min, PageUp/PageDown 10 min, Home 16:27Z, End now. `window.setMoment('16:57Z')` or `setMoment(30)` for scripts.
- At each moment: the state word and its "since" line (Developing until 16:32Z, then Money first), the sentence (three versions: before 16:32Z, before 17:08Z, after), the three pills, both hero readouts, attention "by HH:MMZ", the lag pill ("money ahead by 30 min, and counting"), holders top-20 and top-1, and You. Values are always the last read at or before the moment, captioned "read 16:57Z" when the read is at the moment and "as of 16:57Z" between reads; never interpolated. Bars not complete at the moment, reads after it, and the Fomo marker before 17:08Z drop to 30% opacity; since-you-looked lines after the moment dim. The moment prints once at 26 px under the scrubber with "30 min before now" and a "Back to now" button.
- Motion: handle, fill and line ease 120 ms; changed readouts cross-fade 120 ms; nothing else moves. `prefers-reduced-motion: reduce` sets both to none, and the slider still works (below).

## (f) Illustrative values (look real on the page, listed here and in the About this data drawer)

Last look at 16:57Z and every since-you-looked age; market cap $2.66M (assumes 1B supply) and liquidity $84K; the 6-minute span without a new price, 16:44–16:50Z; the ages "12 s", "4 min", "19 min", "25 s", "40 s" and the 5-minute Telegram cadence; the "2" data notes count. On the Now page: the three chain weather pills, every since-you-looked count and every row except SPRING and AGRIPPA, whose sentences and money-in bars come from T5 numbers (AGRIPPA bars are 142 over minutes 0 to 30 and 928 over 30 to 60, from 142 → 1,070). LUMEN, MARLIN, KESTREL and OBOL, including their sparklines, are illustrative.

## (g) How Glass goes wrong, and the guard

Wrong: the generic 2024 crypto app. A big glowing number with no source, gradients that stand for "up", green versus red, soft empty cards where information used to be, and a pretty chart whose smooth area pretends there were observations between four reads. Guards in this build: every number carries a caption or sits in a chart whose caption covers it; area fills only fill bars (per interval) and the holders line joins reads with dotted segments, with hollow points at the reads; the glow is behind the chart and not tied to any value; only ice blue and orange carry meaning; the phone shows the state word, the sentence and the whole hero chart above the fold (`verify.txt`: chart 641 to 841 px of 844); the Now phone card holds six elements (state, token, sentence, sparkline, count, age; the waiting-for line shows on desktop only); and every A item is present, tucked or not (table in (b)).

## (h) What I did not do

- Phone pill numbers are 24 px, not the brief's 28: three pills with "$0.00266" do not fit 358 px at 28 without clipping (seen in the first render). The desktop pills are 32 px as briefed.
- On the phone, the since-you-looked lines drop their per-line captions for one caption under the heading ("tape and Fomo · 12 s to 19 min"), and "Why Money first" moves from the hero into the evidence drawers, to get the whole hero chart above the fold. Both are on the desktop page in place.
- No safety chart: SPRING has no safety event, so safety is one line under the charts, as the shared brief says.
- No user test, no real-device touch test (touch verified in Playwright only). No light theme. The Now cards link only SPRING to this page.

## (i) Verification (run 09:02 to 09:05)

- `NODE_PATH=/home/botbox/node_modules node scripts/shots.cjs` (output `shots.txt`): all five shots written; scrollWidth 1280 and 390, no element past the viewport on any page; Manrope loaded on every page; sizes 209, 132, 195, 126, 96 KB.
- `scripts/verify.cjs` (output `verify.txt`): mouse drag on the holders chart to 16:30Z gives Developing, "not read" everywhere, 5 lines dimmed; keys End then PageDown ×3 give 16:57Z, Money first, $0.00168, 861, 0.57, 5 dimmed; the same with `reducedMotion: 'reduce'` (handle transition 0 s vs 0.12 s); phone tap mid-rail gives 16:59Z with the 16:57Z reads, "as of".
- Moment shot `situation-desktop-1657.jpg`: state Money first, price $0.00168 "read 16:57Z", wallets in 861, top-20 0.57, lag "money ahead by 30 min", all five since-you-looked lines dimmed (all are after 16:57Z). Matches the brief.
- Greps over both HTML files: U+2014 zero; banned words (smart money, alpha, edge, buy, sell, bullish, score, AI confidence) zero; `ev-`, `rel-`, `R4a`, `provisional`, `illus`, `fixture`, `T5`, `schema`, `derived`, `provider`, `contract` zero, in markup and code alike. The only related word is "Illustrative values on this page", the heading inside the About this data drawer.
- Nothing after 17:27Z: the page uses only T5 reads to minute 60 and says it is frozen at 17:27Z.

Status: DONE