Level 2. The list a multi-outcome market is made of: a name, a probability and a pair of sides, once per candidate. 23 lists and 52 rows on 14 painted screens. Three faces, and one part that is in the markup twice and drawn zero times. Measured 2026-08-08 in a browser, at 390 and 1280.
A row per candidate with its own compact pair. 16 elements against 31.
The level and its reason stay on the molecules page. What needs the room here is that this component is the same three elements drawn three ways, and that the difference is not a modifier, it is what the row is FOR.
on a card, 42 rows: a market you are reading
in a bet panel's list, 10 rows: a market you are answering
| face | rows | the box | at 390 | at 1280 |
|---|---|---|---|---|
| bare | 0 in the painted tree | a hairline rule between rows, no ground | the grey layer, which the wireframes draw | |
| card | 42 | a chip ground inside a notice bevel at a 10 corner | 267x54 and 305x54 | 422x54 |
| list | 10 | the control ground inside a hairline, and cursor:pointer | 310x62 and 321x62 with a finger | 590x62 |
The card row is a reading and the list row is a control, and everything that differs follows from that. The card's probability is a large display figure with no box, because on a card it is the thing your eye lands on. The list row has a pointer cursor, a chosen state and a brass-tinted edge when chosen, because in a bet panel the row is the choice itself.
.opt-sel-tag is a small outlined word, "selected", in the
name of a chosen row. It has 2 placements in the painted tree and display:none on
both, measured at 390 and 1280 in both themes.
It is the grey tree's answer, and the painted tree answers differently. In the wireframes a chosen row cannot be said with a tint and a brass edge, because there is no brass, so the row says it in a word. The paint has colour, so the word is redundant and the file switches it off in one line rather than deleting markup the grey twin needs.
That makes it deliberate, unlike the trust strip. The same mechanism,
one display:none in a painted rule, is right here and is a hole on
trust bar, and the difference is whether the thing being hidden
has a replacement on the same screen. Here it does: the tint, the edge and the chosen YES all say
the same thing in the same row.
What it costs is a screen reader hearing nothing. The tint is not
announced, and the word that would have been is switched off. That is not this file's to fix
with a colour, and it is why .app-case .opt-list .opt-row should carry a state
attribute rather than a class alone. docs/backlog.md 61.
One query, at DESK, and it decides that the row has a SECOND LINE.
Below the rung .opt-row takes flex-wrap:wrap with an 8px row gap, the
card's rows go to a whole step of padding rather than a half one, and the outcome name takes
flex:1 1 auto;min-width:0 so a long name shrinks instead of pushing the percentage
off the first line. Read across all nine feed screens at 320, 330, 340, 360 and 390: it truncates
nothing.
The row decides that there is a second line and the pair decides what to do
with it, which is why the other half of this rule lives in yesno.css. Two files,
two questions. And it was a CLIP before it was a wrap: at 320 it was 32 clipped elements
over 8 feed screens, worst 28.9px, with no document scrolling anywhere, which is the reading this
page exists to record. A clip is not the absence of overflow, it is overflow with the evidence
removed.
A row that is read and a row that is answered are two faces of one component. The parts do not change, and the pointer, the chosen state and the weight of the figure all follow from which one it is.
Hiding a grey-layer part is allowed when the paint says the same thing another way. Otherwise it is a component switched off with no note.
What stood here until 2026-08-20 described a design that lived for three
days. A table said the card carries 4 rows at 640 and up and 2 rows plus
+2 more outcomes at 390, with before-and-after heights, a rung argument for 40rem
and a paragraph on what the link counts. All of it was true on 2026-08-17 and none of it
survived that same week. docs/backlog.md 188 took the full field back off the
desk and 189 deleted the link, both decided by the product owner on a screenshot: 68 links
removed across 33 documents in all three trees, the rules out of
components/options.css, and .opt-more off this component's class list.
docs/backlog.md 229.
Read from the rendered DOM at 1280 on 2026-08-20: 30 multi cards per tree and every one shows exactly two rows. No card grows with width and no link stands on any of them. The whole field is on the event, one tap away on the title, and the detail's Outcomes section is where it lives.
The reason both halves went is the same reason and it is worth keeping.
A card is where a person decides whether to LOOK. The question does that. Four rows on a desk is
a card asking to be weighed rather than opened, and a --text-muted caption counting
what is missing, in the same ink as the Volume line under it, was a fourth thing to
read on a surface being deliberately made smaller.
Two things the deleted design left behind, and each says which zero it
is. data-full stands on 30 cards per tree and is read by nothing: it carries the
market's outcome count, the number the detail head prints, and its reader was the link that was
removed on purpose. It is kept as a datum rather than swept. And the three complete markets,
Republicans 52 against Democrats 48, declare no data-full at all, which is the same
switch it always was: nothing hidden, nothing to declare.
Never say "chosen" in colour alone. The word that carried it in the grey tree is hidden in the painted one, and nothing announces the tint.
Never give the card row a pointer. The card is the link; a row inside it that looks clickable is two targets where a person expects one.
Never make a card the place a field is weighed. Two rows is a shortlist and the title is the route. The opposite of this line stood here until 2026-08-20, "never hide an outcome the width has room for", and it forbade what the product does at every width: docs/backlog.md 188 and 189 reverted the design it was written for three days after it landed.
Never draw the pair here. The YES and NO in every row belong to yes / no, and this file's only claim on them is that the outcome list is the surface they answer.
The level and its reason: the molecules
page. The stylesheet: components/options.css. The pair in every row:
yes / no. The card that holds 42 of the 52:
components/card.css. The open row: docs/backlog.md 61.