/* Vasteroids embed (Highlights Dark > Iframe). Splash strips style tags and most inline CSS from the embed field, so all sizing lives here. The game is a fixed 960x540 buffer that only scales down. Keyboard handling (Space focuses the game instead of scrolling) is a GTM Custom HTML tag, container GTM-TFXVB6BM, via Splash Analytics > Tracking Pixels. */
/* Desktop and tablet: the game sits inside the arcade cabinet artwork. The screen cutout in the PNG (2175x2084) is x 322-1851, y 596-1442, so the iframe is positioned by those percentages and scales with the cabinet. The cutout is 1.81:1 and the game is 16:9, so the cutout's navy fill shows as a thin bezel above and below. */
.vx-cab { position: relative; width: 100%; max-width: 1180px; margin: 0 auto; }
.vx-cab-img { display: block; width: 100%; height: auto; }
.vx-cab .vx-wrap { position: absolute; left: 14.8%; top: 28.6%; width: 70.3%; height: 40.6%; display: flex; align-items: center; justify-content: center; }
.vx-cab .vx-frame { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 100%; border: 0; background: #021022; }
/* Phones AND tablets: no cabinet, the game goes full width. Splash flags devices with classes on #splash-container (is-responsive-phone / is-responsive-tablet); the media query is a fallback for narrow desktop windows. */
#splash-container.is-responsive-phone .vx-cab, #splash-container.is-responsive-tablet .vx-cab { max-width: none; }
#splash-container.is-responsive-phone .vx-cab-img, #splash-container.is-responsive-tablet .vx-cab-img { display: none !important; }
#splash-container.is-responsive-phone .vx-cab .vx-wrap, #splash-container.is-responsive-tablet .vx-cab .vx-wrap { position: static; width: 100%; height: auto; display: block; }
#splash-container.is-responsive-phone .vx-cab .vx-frame, #splash-container.is-responsive-tablet .vx-cab .vx-frame { border-radius: 12px; background: #0e142c; }
@media (max-width: 760px) {
  .vx-cab { max-width: none; }
  .vx-cab-img { display: none !important; }
  .vx-cab .vx-wrap { position: static; width: 100%; height: auto; display: block; }
  .vx-cab .vx-frame { border-radius: 12px; background: #0e142c; }
}

/* ===== Booth section (Cover Block Dark Hub) ===== */
/* Mac mini: the image lives in the block's Right Background slot (g-18268843). Splash's default is a 4:3 box with background-size cover, which crops a 3000x1681 image and ignores the alignment settings. This makes the box match the image's own aspect (16:9), shows the whole image, and centers it vertically against the text. */
#g-18268843 { width: 50% !important; padding: 0 0 28% !important; background-size: contain !important; background-position: center center !important; top: 50% !important; bottom: auto !important; transform: translateY(-50%); right: 0 !important; }
/* Tournament schedule card (g-221580118): glowing rounded outline, cyan heading, white body, left aligned. */
#g-221580118 { display: block !important; width: fit-content !important; margin-left: 0 !important; margin-right: auto !important; /* parent column is text-align:center, so an inline-block card drifts right; block + fit-content pins it to the text's left edge */ max-width: 100%; margin-top: 28px !important; padding: 22px 28px !important; text-align: left !important; border: 2px solid rgba(31,217,254,0.85) !important; border-radius: 18px !important; background: rgba(2,16,34,0.55) !important; box-shadow: 0 0 22px rgba(31,217,254,0.35), inset 0 0 18px rgba(31,217,254,0.08) !important; }
#g-221580118, #g-221580118 p, #g-221580118 div { color: #ffffff !important; font-weight: 400 !important; font-size: 16px !important; line-height: 1.7 !important; text-align: left !important; }
#g-221580118 strong { color: #1fd9fe !important; font-weight: 700 !important; font-size: 17px !important; letter-spacing: 0.2px; }
/* ===== Also at SC26 cards (More Section Dark) ===== */
/* Also-at-SC26 cards (g-328978313 / g-903164931 / g-755264188) use the images uploaded in the editor; no CSS overrides. */
/* Booth section on phones. Splash flags phones with #splash-container.is-responsive-phone (not a media query), and its own phone rules use that selector with !important, so these must match that specificity. */
#g-221580118 .body { float: none !important; }
/* Tablets (#splash-container.is-responsive-tablet): the text column spans the full width, so the Mac mini stacks below the schedule card instead of floating over the copy. */
/* Old single-event hero (g-7198289) was hidden on desktop and phone only; hide it on tablet too. */
#splash-container.is-responsive-tablet #g-549867739 #g-7198289 { display: none !important; }
#splash-container.is-responsive-tablet #g-549867739 #g-47592140 { display: flex !important; flex-direction: column !important; }
#splash-container.is-responsive-tablet #g-47592140 #g-18268843 { order: 3; position: relative !important; width: 100% !important; padding: 0 0 46% !important; top: auto !important; bottom: auto !important; transform: none; margin: 0 !important; background-size: contain !important; background-position: center center !important; }
#splash-container.is-responsive-phone #g-549867739 #g-47592140 { display: flex !important; flex-direction: column !important; }
#splash-container.is-responsive-phone #g-47592140 #g-18268843 { /* 3 ids: must outrank the per-element phone rule Splash injects after Main CSS */ order: 3; position: relative !important; width: 100% !important; padding: 0 0 56% !important; top: auto !important; bottom: auto !important; transform: none; margin: 8px 0 0 !important; background-size: contain !important; background-position: center center !important; }
#splash-container.is-responsive-phone #g-47592140 #g-221580118 { display: block !important; width: 100% !important; }
/* ===== Nav buttons (Join the Community / Play now): size to their text, never wrap ===== */
#g-725538360, #g-786669624 { width: auto !important; max-width: none !important; }
#g-725538360 .button-link, #g-786669624 .button-link { white-space: nowrap !important; word-break: normal !important; overflow-wrap: normal !important; }
#g-725538360 { margin-right: 12px !important; }
/* ===== Cabinet section: side padding shrinks as the window narrows so the game gets bigger (full 112px at ~1500px+, 20px min) ===== */
#g-989074830 { padding-left: clamp(20px, calc((100vw - 1100px) / 3.5), 112px) !important; padding-right: clamp(20px, calc((100vw - 1100px) / 3.5), 112px) !important; }