Set sail
Voyage actions ready
The home board’s signature: a perforated quest ticket — accent stub, state lamp (breathing only on a READY ticket), tear seam, notched corner. Accent rides --quest-c.
Live reference: tokens + components. Verify against docs/DESIGN.md.
Logo lockups (light ink · on dark)
Dark ink · on light surface
Ego mascot



Text helpers
MoTZ is Legendary · New Winner!
EgoEmptyState · pose × heading × description × action slot

Points at CTAs / onboarding.

Nothing found / empty search.

Quiet / pending / waiting.

Wallet / chain contexts.
EgoCelebration · success moment (gold glow ring + happy Ego)

Wallet linked!
Your Ronin account is connected. Welcome to the squad.
BrandedLoader · flame-leaf spin (sm · md · lg) + CoinLoader gif
EgoEmoji · 10 reaction faces, keyed by semantic alias
Motz Red
#FF2A55
Primary actions, logo, highlights
Winner Gold
#fbbf24
Currency, winning states, emphasis
Electric Purple
#7000ff
Secondary brand, gradients
Mavis Blue
#0e7de9
Info, links, accents
Void
#0F0518
Main background (purple-cast)
Text · warm stone scale (MAR-148)
#F5F5F4
--foreground
#A8A29E
--muted-foreground
#78716C
captions / disabled
Heading 1 · Fredoka Bold 36/48
The quick brown fox jumps over the lazy dog
Heading 2 · Fredoka Bold 30/36
The quick brown fox jumps over the lazy dog
Heading 3 · Fredoka SemiBold 24/32
The quick brown fox jumps over the lazy dog
Heading 4 · Fredoka Medium 20/28
The quick brown fox jumps over the lazy dog
Body Large · Inter Regular 18
The quick brown fox jumps over the lazy dog
Body Default · Inter Regular 16
The quick brown fox jumps over the lazy dog
Caption · Inter Regular 14
The quick brown fox jumps over the lazy dog
Overline · 12 UPPERCASE
The quick brown fox jumps over the lazy dog
Gradient (gold)
Legendary Item
Gradient (brand)
MoTZ Revolution
Glow (red)
New Winner!
glass-card utility
Frosted panel
Gradient fill + white-tinted border + soft shadow with an inset top highlight.
card-energy (hover)
Hover me
Lifts −4px & scales 1.01, with a tri-color top line + purple corner bloom.
animate-float

animate-pulse-dot
button hover lift
console-rail + animate-rail-sweep
dial-arc (hover)
console-scan (hover)
Hover: a gold scan line sweeps the panel.
stage-spotlight + animate-spot-breathe
The games stage’s slow gold house light.
sigil-grid (static)
energy-dial (voyages dock)
Voyage actions ready
The home board’s signature: a perforated quest ticket — accent stub, state lamp (breathing only on a READY ticket), tear seam, notched corner. Accent rides --quest-c.
feed-beat (guild pulse keyline)
A short pink charge travels the feed’s keyline every few seconds — invisible at rest, dead under reduced motion.
Status dot · leading pulse, color follows the badge (dot prop)
Default · calm data surface
Price
5,000 RON
USD
$8,240
Interactive · glass + lift/glow on hover (interactive prop)
Use for link cards (hub launchers, gallery tiles), never for static data surfaces.
The four surfaces · card · stat · row · hero (overlay = dialog/popover)
surface-stat
1,240
rounded-2xl · bg-white/[0.03] · p-4
Banner · one warning + one success recipe for an inline notice
CardEmptyBody · an empty card body fills its grid height, never stretches

Nothing here yet. The Ego pose is the sanctioned filler.
…and the empty card beside it fills that height instead of stranding one line at the top. The page-level block stays `EgoEmptyState`, which brings its own frame and must not be nested inside a Card.
Glass segmented · active = Motz Red
Underline · active = Winner Gold
The admin console's strongest confirmation: the operator must type the exact word CONFIRM AND supply a reason for the audit log before Confirm enables. Word, label and wrong-word copy mirror the Discord bot's deny modal verbatim, so an admin meets identical wording on both surfaces. Type a wrong word to see the inline hint.
Data table with header and rows
| Item | Value (USD) | Status |
|---|---|---|
| Ego #888 | $8,240 | Listed |
| Moki #442 | $3,100 | Draft |
| Ronaldo #101 | $1,450 | Unpriced |
Select dropdown with options
Pagination control · 3 pages
MoneyValue · the money renderer (Inter · tabular · semantic color)
Signed PNL
Plain / estimate
Token + ≈USD
Stat band · 4 glass panels (hero = Est. value) + loading
prices updated 4m ago
View switcher (red pill = where you are) + range tabs (gold = money period)
Provenance trail · the signature element (incl. recognition affordance)
Allocation bar · invested share by collection (tap a segment/legend)
Allocation by collection: Moki 57%, Ego Genesis 29%, Ronin Ronaldo 13%, Pixel Pups <1%.
Profit-over-time · PnlBarChart (12 weekly buckets, green/rose split)
Loading skeletons (ledger rows)
Every status badge on the assets dashboard explains itself on hover, keyboard focus, or tap. Hover (or tap) a chip to see its tooltip; the same plain-language description renders inline here as a living glossary.
Confidence chips
Source
Sold & sent
Wallet sync
Ledger notices
Pricing
Estimates