Atom

Latitude mark

Two letters wide, and it carries the differentiator. 153 instances across 26 screens, every one of them in the latitude ladder in the case pane and on the fleet. yes 42 times and no 81, and the ratio down that column is the sentence the analyst reads before any of the words beside it.

CLAUDE.md names calibrated trust as the only surviving differentiator, and the fleet as the place it has to read at a glance. This is the component that glance is made of.

Anatomy

dark, shipped

yesInvestigate
yesContain a single endpoint
noDisable an accountabove latitude here

light, the pair

yesInvestigate
yesContain a single endpoint
noDisable an accountabove latitude here

The three readings above are the ROW's, not the mark's. The middle row is the ceiling, which takes a surface and weight 600; the last is out of latitude, which takes the whole row to secondary ink. The mark goes with each of them and declares none of them, exactly as key does inside a button.

Variants

None, and it is the second component in this system that reads no colour role at all. key is the other one, for the same reason.

Axis a reader looks forValuesWhy the cell is empty
yes and no–The content, not a class. A .mark--yes in green and a .mark--no in red is the obvious move and it is wrong twice over: the product spends no colour on a binary that is already two different words, and green would say a permission is good when what it reports is only what the agent has earned on this tenant
out of latitude–The row's, and it must stay there. lat .off dims the whole line, so the mark and its label recede together. A dimming that lived here would leave the label at full strength beside a faded no
the ceiling–The row's as well. The highest action the agent may take on this tenant gets a surface and weight 600, and the mark inherits both
size–11px, the floor of the scale, and the column is 20px. Both are fixed by the ladder being read as a column rather than as a list of sentences

When to use it

Only in the latitude ladder. It answers one question per row: may Clerk do this, on this tenant, right now. The ladder is the concrete element that carries the strategic dimension, so the component that renders its answer is not reusable decoration.

Where she meets it. Twice: on the case, when deciding whether the agent should have acted rather than asked, and on the fleet, where forty tenants' ladders are the resting state of the detail pane. Design principle 4 says tenant context is never more than a glance away, and this is the shortest possible form of that context.

Rule and anti-rule

Do

yesContain a single endpoint

Two letters, then the action, on one line, in a ladder where every row starts at the same place. What is scanned is the column, not the sentences.

Do not

yes

Not as a badge. A boundary around it would make it a thing that reports an outcome, which is state, and would break the column: the ladder is read down the left edge, and 40 boxes read as 40 objects rather than one answer repeated.

States

It has none, and it is not interactive. It is a reading of the record and there is nothing to press.

dark, shipped

yesInvestigate
yesContain a single endpoint
noDisable an accountabove latitude here

light, the pair

yesInvestigate
yesContain a single endpoint
noDisable an accountabove latitude here

What looks like a state is the ladder row changing under it, shown above rather than described: the middle row is the ceiling and the last is out of latitude. Both rules live in lat, which is a molecule and comes in the next round.

What it reads, and where it stands

No colour role, and this is the second row in the system that says that. Geometry only: --font-mono and --size-xs, plus the 20px column. The ink is inherited, so the component needs no pair in the light theme and gets one for free.

Copy this

<div class="lat"> <div><span class="mark">yes</span><span>Investigate</span></div> <div class="ceiling"><span class="mark">yes</span><span>Contain a single endpoint</span></div> <div class="off"><span class="mark">no</span><span>Disable an account</span><span class="why">above latitude here</span></div> </div>

Where it stands