ATLAS V3.1 · D6 · REFERENCE-GRADE KIT
One kit. Five sections. Every rule inline.
The single component vocabulary shared across Floor, Bookings, Door, Closeout, Outcomes and Promoter surfaces. Each sample below is live and carries its usage rule as caption text — treat that caption as the component's acceptance spec. Dark-only, red-free, hub colors semantic. Money renders from integer cents; take-rate is a ⚑ placeholder.
A
Status system
DOCUMENTED FIRSTThe ratified, red-free answer to "what color is this state?". Booking lifecycle chips plus the three-weight amber alarm ladder. This is the most load-bearing decision in the system — everything else defers to it.
Lifecycle status chips160ms color-only · position never moves
Held
Confirmed
Seated
Good
Closed
Cancelled
SpecHELD = dashed MID chip + pulsing hollow dot (awaiting deposit). CONFIRMED = cyan. SEATED / GOOD = mint #34D399. CLOSED = gray. CANCELLED = gray with line-through. State changes animate color only over 160ms — the chip never changes position or size.
Amber alarm ladder — three weightsoutline -> tinted fill -> solid
△Attention
⊘Failed
⚑Blocking
SpecEscalate by weight, never by hue. W1 outline (attention) -> W2 tinted fill rgba(251,191,36,.12) (failed) -> W3 solid amber, dark text (blocking — max one per view). Negative money is amber and parenthesised.
NeverRed is never used — not for errors, declines, or destructive actions. Alarm severity is carried entirely by amber weight. This is the rule the whole system is built to protect.
Token referencesemantic -> hex
held · mid
confirmed
seated · good
closed · cxl
alarm · amber
UseThese five are the only status colors. Hub wayfinding colors (E) are separate and never stand in for status.
B
Primitives
Interactive controls and labels. Buttons carry live hover and press. Destructive paths are amber, never red — consistent with A.
Buttons120ms ease-out · press translateY(1px)
SpecPrimary = solid cyan, one per context. Secondary = glass + hairline. Ghost = text only. Destructive is amber-outline, never red — it reads as caution, not danger. Big variant (16px/500, full-width) for NIGHT density targets >=48px (host stand, door).
Text inputSURFACE-2 · focus -> cyan border
SpecFilled on SURFACE-2 #111524 with a chrome hairline; label is a mono kicker above. On focus the border goes cyan (matching the focus-visible ring). Placeholder is LO.
Mono kicker / labeluppercase · .16-.28em · · delimiter
FLOOR · LIVE · NIGHT 1
DEPOSIT · COUNTS TOWARD MINIMUM
SpecMenlo, uppercase, tracked .16-.28em. Segments joined with a middle-dot · flanked by double spaces — never a slash. Smaller labels track wider.
Attribution chip2px hub-color left rule + mono label
Promoter · Mara K.venue-link · mkt
Guest · directwalk-in · guest
Ops · host standmanual seat · ops
Spec2px hub-colored left rule + mono label naming the source path. Hub color is semantic: Marketing amber, Guest mint, Ops violet (E). Attribution is wayfinding, not status.
C
Data display
Flat SURFACE-1, no backdrop-filter — anything past ~8 data points drops the glass. All money renders from integer cents; take-rate stays a ⚑ placeholder (venue reporting only, never marketing UI).
Ledger rowflat · money = Menlo from cents
| Date | Guest · table | State | Tab | Take ⚑ |
|---|---|---|---|---|
| 07-21 | Beaulieu · T-09 | Closed | $1,500.00 | ⚑ |
| 07-21 | Okonkwo · T-14 | Seated | $842.50 | ⚑ |
| 07-21 | Vance · T-03 | Cancelled | ($300.00) | — |
SpecGuest name HI/regular, meta mono/LO, numbers right-aligned Menlo. $1,500.00 is rendered from 150000 cents. Negative amounts are amber and parenthesised. Cancelled rows strike the guest cell. Take column is a ⚑ placeholder — never a live rate in operator UI.
Split-pay dotsfilled mint · hollow gray · amber
DEP
3 LOCKED · 1 PENDING · 1 FAILED
SpecFilled mint = share locked. Hollow gray (pulsing) = pending. Amber = failed. A leading DEP badge marks the deposit share. Failed shares escalate to the D blocking banner.
Stat callout2px left rule · Light display
$18,420
Total tab · tonight
92%
Show-up rate
⚑
Take · rate placeholder
SpecBig Light-weight value over a mono kicker, 2px left rule. Rule color is semantic: cyan (neutral headline), mint (good), amber (attention or ⚑ placeholder). Money is Menlo from cents.
Metric barscategorical = fixed 7-slot PC palette
SpecSingle-series bars use ELECTRIC #60A5FA. Categorical bars use the fixed 7-slot PC palette in locked order (taste · identity · crews · venues · bookings · revenue · marketing) — the order never changes so a color always means the same pillar.
D
Containers
Glass is reserved for chrome — KPI heroes, modals, headers. Empty states and the blocking banner set the tone when something is missing or wrong.
Glass KPI cardglass fill .05-.08 · blur 12px · chrome only
Bookings tonight
24
Total tab
$18,420
Take
⚑
⚑RATE PLACEHOLDER
Post-visit sent
18
SpecGlass (rgba(255,255,255,.05-.08) fill, .12 hairline, 12px blur) — permitted only for chrome heroes. The take card shows ⚑ + "RATE PLACEHOLDER", never a computed rate. Money from cents.
Empty statedashed border · night-one default
○
No arrivals yet
NIGHT 1 · ALL TABLES AVAILABLE
SpecDashed chrome border, hollow glyph, plain-language line, mono status subline. Used for night-one and zero-data panels; money zeroes read as $0.00, never blank.
Modal shellscrim + glass · 200ms panel
MINT A LINK · STEP 1 OF 2
Attribute this link
Pick the promoter and an optional campaign. The minted venue-link carries this attribution through checkout.
Surface behind scrim
SpecDimmed blurred scrim over a glass panel; panel rises 8px->0 over 200ms. Kicker · title · body · right-aligned actions (ghost cancel + primary confirm). Esc and scrim-click close.
Blocking bannersolid amber · dark text · max one per view
SpecThe heaviest amber weight (A W3): solid amber ground, dark text. Reserved for a hard block a human must clear — max one per view. Still amber, still never red. Dark-text buttons invert inside.