Component set · 14 components

Chrome around the cards

Everything that isn't a card. One accent — gold — carries interaction and emphasis throughout. Green and red appear only as match outcome, never as decoration, and never alone: each outcome state also carries a glyph or a shape difference.

Logo wordmark

Three pips for three chances. The pips double as a rounds-remaining meter in the header.

stacked · default
stacked · gold
horizontal · small · 1 chance spent

Primary button

One per screen. Gold fill, ink label.

default
hover
pressed
disabled
small

Ghost button

Secondary actions — decline, cancel, view rules.

default
hover
pressed
disabled

Player chip

Identity plus rating. The active variant marks whose pick the table is waiting on.

KO You ELO 1482
default
MR m_rustaveli ELO 1519
active · to pick

Streak badge

Armed is the state that costs the house money — the next win pays the streak bonus, so it is the loudest thing on the screen after the cards.

Streak 0 cold
Streak 3 building
Streak 5 · bonus armed armed · next win pays +10%

Score pill

Leading and trailing carry ✓ / ✗ alongside the colour shift.

You0 0Opp
level · 0–0
You1 0Opp
leading · 1–0
You1 2Opp
trailing · 1–2
You1 1Opp
1–1 · swap window opens

Round indicator

Won segments are round with a ✓; lost segments are squared with a ✗. Shape carries the result as well as hue.

1 2 3
round 1 live
2 3
won R1
3
1–1 · decider
2–0 · round 3 not played

Opponent thinking

Shown while the opponent's pick timer runs. Animation stops under reduced-motion.

Opponent is choosing thinking
Opponent locked in locked in

Timer pill

Mono figures, tabular so the digit doesn't jitter as it counts down.

5s full
3s running
2s warning
1s final second

The warning threshold needs its own number

The brief asks for a warning under 5 seconds, but the pick timer is 5 seconds long — so a 5-second threshold means the pill is red and pulsing for the entire turn, every turn, and the warning stops meaning anything. These specimens warn at 2s. That threshold wants to be a config value of its own rather than being pinned to the timer length; alternatively lengthen the pick timer, which also changes how much thinking the mechanic rewards.

Stakes display

Figures are the engine's: 10 a side, pot 20, 5% rake, 2% swap fee.

Your bet 10.00 Pot 20.00 To winner 19.00
match stakes
Swap fee 0.20 Charged on use
swap modal stakes

VS divider

Separates the two player chips on match-found and result screens.

VS
default

Mode tile

Stake-bearing choices, so the number sits in the head where it can't be missed.

default
selected
disabled · not yet open

Result badge

Word, glyph, badge shape and hue — four signals, so the outcome never rests on colour.

You win win · circular badge
You lose loss · cut-corner badge

ELO delta card

Arrow and sign both carry direction before colour does.

Rating 1506 ▲ +24
gain
Rating 1464 ▼ −18
loss