*,:before,:after{box-sizing:border-box}html,body{background:var(--va-role-background);min-height:100%;color:var(--va-role-text);font-family:var(--va-font-display);-webkit-font-smoothing:antialiased;margin:0;padding:0}body{overflow-x:hidden}#app{min-height:100vh;padding:var(--va-space-md);background:radial-gradient(90% 60% at 50% 0%, var(--va-surface-panel) 0%, transparent 70%), linear-gradient(var(--va-bg-deep), var(--va-ink))}@media (max-width:420px){#app{padding:var(--va-space-md) 16px}}h1,h2,h3{margin:0;line-height:1.15}p{margin:0}.va-button{appearance:none;border:2px solid var(--va-surface-panel-border);border-radius:var(--va-radius-sm);background:var(--va-surface-panel);color:var(--va-role-text);letter-spacing:.04em;cursor:pointer;touch-action:manipulation;padding:10px 16px;font-family:inherit;font-size:15px;font-weight:700;transition:transform 60ms,box-shadow .12s,border-color .12s}.va-button:hover{border-color:var(--va-role-accent)}.va-button:active{transform:translateY(1px)}.va-button:focus-visible{outline:2px solid var(--va-role-accent-alt);outline-offset:2px}.va-button-accent{border-color:var(--va-role-accent);color:var(--va-ink);background:linear-gradient(var(--va-orange), var(--va-pink));box-shadow:0 0 14px var(--va-surface-panel-strong)}.va-button-ghost{color:var(--va-role-text-dim);background:0 0;padding:7px 11px;font-size:13px;font-weight:600}.va-button-ghost:hover{color:var(--va-role-text)}.va-panel{border:2px solid var(--va-surface-panel-border);border-radius:var(--va-radius-md);background:var(--va-surface-panel);padding:var(--va-space-md)}.va-panel-title{text-transform:uppercase;letter-spacing:.12em;color:var(--va-role-accent);margin-bottom:var(--va-space-sm);font-size:13px}.va-empty{color:var(--va-role-text-faint);font-size:14px}.va-lobby{max-width:1080px;margin:0 auto}.va-lobby-header{text-align:center;margin-bottom:var(--va-space-lg)}.va-lobby-title{letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(var(--va-orange), var(--va-pink));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:30px}.va-lobby-sub{color:var(--va-role-text-dim);margin-top:var(--va-space-xs);font-size:14px}.va-lobby-grid{gap:var(--va-space-md);grid-template-columns:1fr;display:grid}@media (min-width:760px){.va-lobby-grid{gap:var(--va-space-lg);grid-template-columns:repeat(3,1fr)}.va-lobby-title{font-size:44px}}.va-lobby-footer{margin-top:var(--va-space-lg);text-align:center}.va-lobby-note{color:var(--va-role-text-faint);font-size:12px}.va-card{gap:var(--va-space-sm);padding:var(--va-space-md);border:2px solid var(--va-surface-panel-border);border-radius:var(--va-radius-lg);background:var(--va-surface-panel);flex-direction:column;display:flex}.va-card-live{border-color:var(--va-role-accent);box-shadow:0 0 18px var(--va-surface-panel-strong)}.va-card-locked{opacity:.72}.va-card-art{flex-direction:column;align-items:stretch;display:flex}.va-card-marquee{text-align:center;letter-spacing:.14em;text-transform:uppercase;color:var(--va-ink);background:linear-gradient(var(--va-orange), var(--va-pink));border-radius:var(--va-radius-sm) var(--va-radius-sm) 0 0;padding:5px;font-size:12px;font-weight:700}.va-card-screen{border:3px solid var(--va-role-cabinet);background:repeating-linear-gradient(90deg, var(--va-surface-grid) 0 1px, transparent 1px 14px), linear-gradient(var(--va-ink), var(--va-bg-panel));height:108px}.va-card-screen-locked{filter:grayscale()}.va-card-base{background:var(--va-role-cabinet);border-radius:0 0 var(--va-radius-sm) var(--va-radius-sm);height:10px}.va-card-title{letter-spacing:.03em;font-size:19px}.va-card-blurb{color:var(--va-role-text-dim);min-height:2.6em;font-size:13px}.va-card-rows{flex-direction:column;gap:2px;display:flex}.va-card-row{align-items:baseline;gap:var(--va-space-sm);border-top:1px solid var(--va-surface-panel-border);padding:3px 0;font-size:13px;display:flex}.va-card-label{text-transform:uppercase;letter-spacing:.1em;color:var(--va-role-text-faint);flex:0 0 48px;font-size:11px}.va-card-value{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-family:var(--va-font-mono);color:var(--va-role-text);flex:auto;overflow:hidden}.va-card-empty{color:var(--va-role-text-faint)}.va-card-soon{text-align:center;letter-spacing:.16em;text-transform:uppercase;color:var(--va-role-text-faint);padding:10px;font-size:12px}.va-cabinet{gap:var(--va-space-md);flex-direction:column;max-width:920px;margin:0 auto;display:flex;position:relative}.va-cabinet-top{align-items:center;gap:var(--va-space-sm);flex-wrap:wrap;display:flex}.va-spacer{flex:auto}.va-cabinet-title{letter-spacing:.14em;text-transform:uppercase;color:var(--va-role-accent);font-size:15px;font-weight:700}.va-cabinet-body{gap:var(--va-space-md);flex-direction:column;align-items:center;display:flex}@media (min-width:760px){.va-cabinet-body{flex-direction:row;justify-content:center;align-items:flex-start}}.va-stage{flex:none}.va-screen{border:4px solid var(--va-role-cabinet);border-radius:var(--va-radius-sm);background:var(--va-ink);box-shadow:0 0 24px var(--va-surface-panel-strong);touch-action:none;padding:6px;display:inline-block;position:relative}.va-playfield{image-rendering:pixelated;display:block}.va-crt .va-screen:after{content:"";pointer-events:none;background:repeating-linear-gradient(var(--va-surface-scanline) 0 1px, transparent 1px 3px), radial-gradient(120% 100% at 50% 50%, transparent 55%, var(--va-surface-scanline) 100%);position:absolute;inset:6px}.va-hud{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;max-width:420px;display:grid}@media (min-width:760px){.va-hud{gap:var(--va-space-sm);grid-template-columns:1fr;width:160px;max-width:none}}.va-stat{border:2px solid var(--va-surface-panel-border);border-radius:var(--va-radius-sm);background:var(--va-surface-panel);flex-direction:column;gap:0;min-width:0;padding:3px 7px;display:flex}@media (min-width:760px){.va-stat{gap:1px;padding:7px 10px}}.va-stat-label{text-transform:uppercase;letter-spacing:.12em;color:var(--va-role-text-faint);font-size:10px}.va-stat-value{font-family:var(--va-font-mono);color:var(--va-role-accent);font-size:19px}.va-marquee{justify-content:space-between;align-items:center;gap:var(--va-space-sm);border:2px solid var(--va-role-accent-alt);border-radius:var(--va-radius-sm);background:var(--va-surface-panel);grid-column:1/-1;padding:3px 8px;display:flex}@media (min-width:760px){.va-marquee{padding:7px 10px}}.va-marquee-label{text-transform:uppercase;letter-spacing:.12em;color:var(--va-role-accent-alt);font-size:10px}.va-marquee-canvas{image-rendering:pixelated;display:block}.va-pad{gap:var(--va-space-sm);grid-template-columns:repeat(3,1fr);width:100%;max-width:420px;margin:0 auto;display:grid}@media (min-width:761px) and (pointer:fine){.va-pad{display:none}}.va-pad-button{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;min-height:64px;padding:0;font-size:22px}.va-pad-button[data-input=hardDrop]{letter-spacing:.1em;grid-column:2/4;font-size:16px}.va-overlay{z-index:2;padding:var(--va-space-md);background:var(--va-surface-scrim);justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow-y:auto}.va-hidden{display:none}.va-overlay-card{gap:var(--va-space-sm);text-align:center;width:100%;max-width:420px;padding:var(--va-space-md);border:3px solid var(--va-role-cabinet);border-radius:var(--va-radius-sm);background:var(--va-surface-panel);flex-direction:column;display:flex}.va-overlay-title{text-transform:uppercase;letter-spacing:.08em;color:var(--va-role-accent);font-size:28px}.va-overlay-line{color:var(--va-role-text-dim);font-size:15px}.va-overlay-actions{gap:var(--va-space-sm);margin-top:var(--va-space-xs);flex-direction:column;display:flex}.va-board-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.va-board-row{align-items:baseline;gap:var(--va-space-sm);border-radius:var(--va-radius-sm);padding:4px 6px;font-size:13px;display:flex}.va-board-row-you{background:var(--va-surface-panel-strong)}.va-board-place{font-family:var(--va-font-mono);color:var(--va-role-accent);text-align:right;flex:0 0 22px}.va-board-name{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}.va-board-score{font-family:var(--va-font-mono);color:var(--va-role-text)}.va-board-pending{text-transform:uppercase;letter-spacing:.1em;color:var(--va-role-highlight);font-size:10px}@media (prefers-reduced-motion:reduce){.va-button{transition:none}}
