Level 3, a shell, and the smallest file in the system: 12 lines and 8 declarations, one class name, one
declaration that paints anything. It stands on 105 painted screens, more than any
other organism, and there is almost nothing left in it. That is the point of this page.
105 placements8 declarations1 class1 role read
The shell, with a screen in it
feed.css declares ONE class and the shell is all it is: a column, a gutter and a maximum. That is why the count under it is 630 and the component is one rule: what fills the shell belongs to the card, the plate, the rail and the head, and the shell decides only where the column stops. It had no specimen at all until 2026-08-09, which for a container is the worst case of the lot: a container with nothing in it is invisible.
Yonder turns the events you follow into a real stake. Pick an event, read the odds in plain language, and back YES or NO. You see the current odds, a one-line why, and how the event resolves before you put in a cent. The minimum bet is one dollar, and you can browse and build your bet before you connect a wallet.
Why the odds move
The odds are a live price set by what people bet, not a fixed quote. When more money backs YES, YES costs more and NO costs less. Your payout depends on the odds at the moment you bet, not only on the outcome, so reading an event early and being right is worth more.
Common questions
Do I need crypto to start?
No. You can browse events and build a bet with no wallet. You add funds by card or crypto only when you confirm.
What is the smallest bet?
One dollar. The default is five.
How does an event resolve?
Each event states its resolution rule up front. The team resolves it against the real-world outcome, and you can see the record of resolved events.
Yonder turns the events you follow into a real stake. Pick an event, read the odds in plain language, and back YES or NO. You see the current odds, a one-line why, and how the event resolves before you put in a cent. The minimum bet is one dollar, and you can browse and build your bet before you connect a wallet.
Why the odds move
The odds are a live price set by what people bet, not a fixed quote. When more money backs YES, YES costs more and NO costs less. Your payout depends on the odds at the moment you bet, not only on the outcome, so reading an event early and being right is worth more.
Common questions
Do I need crypto to start?
No. You can browse events and build a bet with no wallet. You add funds by card or crypto only when you confirm.
What is the smallest bet?
One dollar. The default is five.
How does an event resolve?
Each event states its resolution rule up front. The team resolves it against the real-world outcome, and you can see the record of resolved events.
The odds bars in the cell are written by hand and are written by a machine in the product. A page script reads .prob-line .prob, builds the bar, hides the line and inserts it before .yesno, skipping any card that holds .options because one bar cannot say three probabilities. A stand does not run the product's scripts, so it writes what the browser renders, exactly as the card's own page does. 18 of them here.
Every card in the cell links the event it is about, and 112 hrefs on this
page are the screens' own, re-rooted to ../ui-visual/. A feed whose cards go
nowhere is not a feed, so href="#" was the wrong answer here more than anywhere: the
href is the datum that says which event the card is. Verbatim, 70 of them resolved 200 to
ui-kit/event-detail.html, the stand's own component page, which is worse than
the 42 that resolved to nothing, because a mis-target looks like it worked. The name after the
prefix is untouched, and the prefix names the folder the screens are in.
What an emptied shell looks like when it has been emptied correctly
Every browse screen's main element is <main class="feed">,
and this file declares one thing about it. Everything a person can see on a browse screen comes
from somewhere else, and this page is the list of where.
The last row is the whole component. A shell that has given up everything
it does not own ends as one declaration, and the honest thing to do is say so on its page rather
than pad it.
Measured, and the numbers are about the screens rather than the file
screen kind
at 390
at 1280
a full feed
379x6006
1049x3084
a category feed
379x3643
1049x2151
an empty or error screen
379x0
1049x0
Zero on the empty and error screens, and that is correct: there the
main element holds nothing, and what a person sees is a state
block standing in its place. It is the third component in this kit whose zeros had to be
checked before they could be reported, after
the skeleton marks and
the tab panels.
Why it is still a file
Three components in this system are now down to a handful of declarations:
this one, load more at two rules and
quick amounts at four. Each of them is kept for a different reason,
and each reason is written on its page, because a file with nothing in it is a file somebody
will delete without reading what it was for.
This one is kept because the class is the name of a place. Every browse
screen's main element carries it, the class map needs an owner for it, and a screen tree of 105
files agreeing on one name for one element is worth a line of CSS. The day the name goes, the
file goes with it and not before.
The rule
A shell owns nothing it can hand to a pattern, a page frame or a
component. What is left is the honest size of it.
A file may be one declaration. It may not be one declaration with no
reason written down.
The anti-rule
Never let a shell grow a part.The chart's grid line lived
here once, and the arithmetic read the chart as containing the feed.
Never delete an empty file without reading its page.Three
files in this system are nearly empty and all three are kept for reasons that are not obvious
from the CSS.
Where the rest of it is
The level and its reason: the organisms page.
The stylesheet: components/feed.css, 11 declarations. Everything else a browse screen is
made of: the table in section 1.