Stage 06 · Concept, step 5
The visual language, standing up
Everything the brand decided, alive rather than described: the palette on the ground it lives on, the two families at the sizes the interface actually uses, the square corner drawn 1:1, the closed set of state chips, the four verdict actions, and the reference screen in the composition chosen at step 4. Every value on this page comes through a variable from design/kit/kit.css, so if a value is wrong here it is wrong in one place, and one edit moves it everywhere.
Where each value came from, with its origin line, is DESIGN-artifacts.md at the root. Why this brand and not the eight that were not taken is in the same file. Why dark is the ground, decided against the reading research, is in docs/decisions.md.
1. The reference screen
3.1 Case Queue in direction A, Ledger. The composition is the wireframe's own, chosen at step 4 against a recommendation for direction C. Drawn at a real 1440 and scaled to this column.
That is design/queue.html itself, running in this page, not a drawing of it. The stand used to hold a hand built replica of the screen, and the stage 06 audit found six components where the replica and the product had drifted apart: different chip family and size, different button geometry, different row density, different fleet row tracks, different bar heights, and a solid chip that was on the accent here and not on the real screen. A replica of a screen that exists is a second copy, so it was removed rather than corrected.
Nothing in the row wins on typography. Design principle 1 says every row is a decision and the verdict is the decision, but in direction A the verdict is set at the same size as the tenant and the description. Direction B spent a second line on solving it. Step 6 has to solve it inside one line, with weight, colour or position, or B's argument comes back as a finding rather than a preference.
2. Palette
Twelve values. Six are named roles on the plate, three are surfaces measured inside the console it drew, and three are the severity ramp, which is derived rather than sampled and says so. Taken as pixels and then checked against the plate's own stylesheet, which agreed at every role. Full sample points in DESIGN-artifacts.md, section 2.
#11110fThe board. Pixel of plate J, GROUND swatch#171714Panels inside the console. Pixel of plate J, detail pane#2a2418The row being ruled on. Pixel of plate J, active row#e9e4daNever pure white, which is a halation constraint rather than a taste#aaa397Secondary. Pixel of plate J, SECONDARY swatch#675f50Separators and panel edges. 2.997 against the ground, which is below 3:1 and allowed only because 1.4.11 covers controls, not dividers#d29c3fLatitude, the live state, where you are, and the row being decided with its primary action. Four jobs and no fifth#18140eText on the accent. Measured on plate J, the Accept button#b25d444.09 on the ground, so borders and icons only. May not carry small text#d9704fDerived from the failure hue. The plate drew no severity scale, so this is the one family that is derived rather than sampled#9d9182Warm neutral, almost no chroma#828e96Cool slate. The one cool value in a warm palette, and it is deliberate#7b7260The boundary of a control. The rule at 2.997 does not clear 3:1, and 1.4.11 asks for it on anything that identifies a control#232219The line between rows. Below every floor on purpose: it separates and never carries meaning. It lived in four files and no variable until the auditThe accent is spent, not applied, and the list was counted in a browser rather than asserted. On the finished screen it does four jobs: latitude, on the fleet and on the case; the live state; where you are in the navigation; and the row being decided together with its primary action. The stand said three, which was true of a poster and false of a screen, so the number is corrected here rather than defended. One thing was taken off the list on sight: the solid unrecorded chip had picked up the accent, and it is loud enough inverted, so spending the accent on it would have made the accent mean less everywhere else.
A2 was amended at step 5 and the amendment is written down rather than absorbed. Severity now reads as colour rather than as a count of bars, which means saturation is spent in two places instead of one. A2 changed from saturation is scarce to saturation is spent on two closed sets and nothing else. It is still countable: three things on the accent and three levels of severity, and a fourth use of colour anywhere is a defect. concept.md section 5 named this exact conflict before it happened and left the decision to the user, which is where it was made.
3. Type
Two families. Archivo carries display and body; IBM Plex Mono is reserved for anything counted, which is counts, chips, stage names, evidence lines and time. Chosen on a rendered comparison of four candidates each, not on the name drawn on the plate. The measurements are in DESIGN-artifacts.md, section 6.
Token replay after a new device enrolment
18 waiting across 12 of 40 tenants in your scope
Clerk proposes compromised identity. The token was replayed from a new device after an inbox rule was created. You rule on the case.
Found 9 signals across identity, mail and endpoint records. Not found: no password change, and no new device enrolment.
34 of 36 accepted, 30 days
6 sources queried over 24h
C-4417 · Larkfield Logistics · 9 signals
TENANT · ACTS ALONE UP TO · ACCEPTED
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
The absolute UI scale above is the working scale, not the poster scale from the plate. It is proved at 1440 and at 360 at step 6.
4. Geometry
Radius on the interface is zero. Measured on the plate rather than read off a caption: every radius the plate draws is on a physical object, and no chip, button, panel, row or stage box carries one. This overrules the 2px that references.md carried in from Axiom, and it meets attribute A1 more strictly than the reference did.
Depth comes from tone, never from blur. Attribute A4. Three grounds separate the whole console: the board, the panel, and the row being ruled on. There is no shadow and no blur anywhere in the interface, and the only shadows in the whole brand are on the physical objects of the plate.
5. Components
THE SOLID ONE IS THE SAME CHIP DEMANDING ATTENTION, NOT A SEVENTH STATE. NOTHING HERE IS GREEN, BECAUSE NOTHING HERE IS AN OUTCOME
ACCEPT COSTS TWO TAPS AND REJECT COSTS FOUR. THE FOURTH IS ENTER, NOT A CONFIRMATION STEP
High
Medium
Low
WARM TO COOL, NEVER TO GREEN. A LOW SEVERITY CASE IS NOT A RESOLVED ONE, AND GREEN WOULD SAY IT WAS
THE RAMP DESCENDS IN CHROMA, NOT IN BRIGHTNESS: ON A DARK GROUND ALL THREE HAVE TO CLEAR 4.5, SO LOUDNESS CANNOT CARRY IT
A COUNT FIRST, THE WINDOW NAMED, AND NO BARE PERCENTAGE ANYWHERE
6. Every attribute, and the element that carries it
An attribute with no element on the screen is a word. This table is what stage 07 checks against, and a row with nothing in its second column is a finding.
| Attribute | What carries it, on the screen above |
|---|---|
| A1 Precise, not soft | --radius-ui: 0 on every interface element, and a 1px rule rather than a shadow at every boundary |
| A2 Saturation is spent on two closed sets, and on nothing else amended | the accent does four jobs, counted in a browser: latitude, the live state, where you are, and the row being decided with its primary action. The severity ramp carries three levels. Both sets are closed and countable, and nothing outside them may take a saturated value |
| A3 Authority by restraint, not by emphasis | display at weight 500 rather than 700, and one primary action beside three plain ones |
| A4 Depth by tone, not by blur | three grounds, #11110f, #171714, #2a2418, and no shadow or blur anywhere in the interface |
| A5 Counted, not estimated | the mono family exists only for counted things, severity is a count of bars and a colour rather than a colour alone, and every count names its window |
7. Contrast
Computed on the values above rather than judged. WCAG 2.1 relative luminance.
| Pair | Ratio | Verdict |
|---|---|---|
| text on ground | 14.92 | AAA |
| text on surface | 14.18 | AAA |
| text on the selected row | 12.15 | AAA |
| accent on ground | 7.71 | AAA |
| accent ink on accent, the primary action | 7.48 | AAA |
| text dim on ground | 7.56 | AAA |
| accent on the selected row | 6.28 | AA |
| failure on ground | 4.09 | below AA for body text, borders and icons only |
| severity high on ground | 5.74 | AA, and 4.68 on the selected row, which is the worst case |
| severity medium on ground | 6.13 | AA, 4.99 on the selected row |
| severity low on ground | 5.63 | AA, 4.59 on the selected row |
| rule on ground | 2.997 | below 3:1. Separators only, never a control boundary |
| edge on the selected row, the worst case | 3.24 | clears 1.4.11 for a control boundary |
| hairline on ground | 1.18 | below every floor by design, and it never carries meaning |
The halation constraint holds by construction. Text on ground is 14.92, not the 21 of pure white on pure black. CLAUDE.md requires that, along with body text at weight 400 or above and open tracking on small monospace, and all three are visible on this page rather than promised.
8. Proved on two more screens
Roles are not named here. They only become visible after components have stood on real screens, which is stage 08, and inventing them now means renaming them twice and breaking the origin line on the first rename.
The language is proved on two more screens, and the proof is what they cost. A language is not one good screen. It is proved when a screen that shares little with the first still reads as the same product, and the honest measure of that is how much new CSS the second screen needed.
- Case queue, the reference. Nine variable assignments plus the short list of what the brand adds.
- Case file, the contrast. The queue compressed into a narrower column, so the same row stands at a different density, plus a whole prose surface: what Clerk filed, what happened, nine evidence lines with their sources, and the four verdict actions. One new rule, because the primary action inverts to the text colour by default and had to take the accent instead.
- Shift brief, the harder test. It shares almost nothing with the queue: no severity, no bars, no fleet rows, a different block system and a handover table. Zero new rules.
All three carried a zero structural diff against their grey originals at this stage, asserted byte for byte after every edit, so what changed here is provably the visual layer and nothing else. That is a reading taken at stage 06 and not a standing property: design/kit/checks/diverge.mjs re-took it after stage 12 and found the queue still at 0 tags gone and 0 arrived, the case file at 3 and 6, and the shift brief at 0 and 1. What moved is the stage 12 heading ruling and the disclosure heads, and the frozen grey cannot follow either. All three were checked in a browser at 1440 and at 360. Pairs are in design/concept/screens/.
What is still not here. No spacing scale, no semantic token names, no component anatomy, no light theme. Those are stages 07 and 08.