/* Match the Good Food hero palette; retain the homepage layout and glass CTA. */
.heroBanner.arcadeLaunch{
      background:
        radial-gradient(
          520px 270px at 90% 8%,
          rgba(255,111,145,.20),
          transparent 58%
        ),
        radial-gradient(
          500px 280px at 6% 16%,
          rgba(255,174,93,.17),
          transparent 58%
        ),
        radial-gradient(
          430px 240px at 52% 100%,
          rgba(124,77,255,.15),
          transparent 62%
        ),
        linear-gradient(
          180deg,
          rgba(255,255,255,.065),
          rgba(255,255,255,.025)
        ),
        rgba(14,10,18,.74);
      box-shadow:
        0 22px 70px rgba(0,0,0,.42),
        0 0 46px rgba(255,111,145,.11),
        0 0 42px rgba(255,174,93,.08),
        0 0 38px rgba(124,77,255,.09),
        inset 0 0 0 1px rgba(255,255,255,.035);
    }
.heroBanner.arcadeLaunch::before{
      background:
        radial-gradient(
          440px 230px at 76% 92%,
          rgba(255,111,145,.20),
          transparent 62%
        ),
        radial-gradient(
          370px 220px at 4% 24%,
          rgba(255,174,93,.16),
          transparent 64%
        ),
        radial-gradient(
          350px 220px at 55% 70%,
          rgba(124,77,255,.13),
          transparent 62%
        );
    }
.arcadeLaunch .heroHeadline .gradientText{
      background:
        linear-gradient(
          90deg,
          #FFB45B,
          #FF708F 46%,
          #B16CFF
        );
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
      filter:
        drop-shadow(0 0 16px rgba(255,112,143,.20));
    }

.arcadeLaunch{min-width:0;content-visibility:visible}
.arcadeLaunch + .heroBanner{margin-top:0}
.arcadeLaunch .heroText,.arcadeShowcase{min-width:0}
.arcadeLaunch .heroHeadline{line-height:1.2}
.arcadeLaunch .heroCopy{margin-bottom:12px}
.arcadeLaunchGenres{display:flex;flex-wrap:wrap;gap:6px 0;list-style:none;margin:0;padding:0;font-size:12px;line-height:1.7;color:rgba(255,212,194,.82)}
.arcadeLaunchGenres li{display:flex;align-items:center;white-space:nowrap}
.arcadeLaunchGenres li:not(:last-child)::after{content:"·";padding:0 7px;color:rgba(255,255,255,.28)}
.arcadeLaunchCta{white-space:nowrap}
.arcadeShowcase{position:relative;overflow:hidden;padding:2px}
.arcadeShelf{display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 0 5px;outline-offset:-2px;border-radius:22px 0 0 0}
.arcadeShelf::-webkit-scrollbar{display:none}
.arcadePoster{flex:0 0 86%;min-width:0;scroll-snap-align:start;scroll-snap-stop:normal;margin:0}
.arcadePosterVisual{position:relative;overflow:hidden;aspect-ratio:4/3;border:1px solid rgba(255,160,146,.36);border-radius:22px;background:#21171e;isolation:isolate}
.arcadePosterVisual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,12,32,.14),transparent 38%,rgba(14,12,32,.08));pointer-events:none}
.arcadePosterVisual img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.arcadePosterType{position:absolute;bottom:12px;left:12px;z-index:2;background:rgba(33,21,29,.72);border:1px solid rgba(255,255,255,.24);padding:5px 9px;border-radius:999px;font-size:10px;line-height:14px;color:rgba(255,255,255,.94);letter-spacing:1px}
.arcadePoster h3{margin:13px 0 5px;color:#fff;font-size:17px;line-height:1.4;font-weight:800;letter-spacing:.2px}
.arcadePosterKeywords{font-size:11px;color:rgba(255,191,177,.9);letter-spacing:.5px;margin:0 0 4px;line-height:1.6}
.arcadePosterDescription{font-size:12px;color:rgba(255,255,255,.62);margin:0;line-height:1.75}
.arcadeShelfButtons{position:absolute;bottom:12px;right:12px;z-index:3;display:inline-grid;grid-template-columns:32px 32px;align-items:center;height:26px;border:1px solid rgba(255,235,224,.22);border-radius:999px;background:linear-gradient(140deg,rgba(255,210,188,.07),rgba(255,255,255,.02)),rgba(26,17,26,.28);box-shadow:0 2px 8px rgba(10,5,14,.14),inset 0 1px rgba(255,237,225,.08);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto}
.arcadeShelfButtons button{position:relative;display:grid;place-items:center;width:32px;height:24px;padding:0;border:0;border-radius:999px;background:transparent;color:rgba(255,244,236,.98);cursor:pointer;touch-action:manipulation;transition:background .2s,color .2s,transform .2s}
/* Extend touch height without making the visible arrows or capsule larger. */
.arcadeShelfButtons button::before{content:"";position:absolute;inset:-10px 0}
.arcadeShelfButtons{transition:opacity .12s ease}
.arcadeLaunch.isReady .arcadePoster:not(.isActive) .arcadeShelfButtons{opacity:0;pointer-events:none}
.arcadeShelfButtons button:disabled{opacity:.26;cursor:default}
.arcadeShelfButtons button:active:not(:disabled){transform:scale(.9);background:rgba(255,187,157,.15)}
.arcadeShelfButtons svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.arcadeArtLoading{display:none;position:absolute;inset:0;place-items:center;background:radial-gradient(ellipse at center,#382333,#21171e);z-index:1}
.arcadeArtLoading i{width:24px;height:24px;border:2px solid rgba(255,155,164,.2);border-top-color:#ffaeab;border-radius:50%;box-shadow:0 0 14px rgba(255,112,143,.18);animation:arcadeOpeningSpin .9s linear infinite}
.arcadeLaunch.isReady .arcadePosterVisual:not(.isLoaded):not(.isMissing) .arcadeArtLoading{display:grid}
.arcadePosterVisual.isMissing::before{content:"NEXPOKE PLAY";position:absolute;inset:0;display:grid;place-items:center;font-size:11px;letter-spacing:2px;color:#f1ccd7}
.arcadePosterVisual.isMissing img{visibility:hidden}
.arcadeLaunch :is(a,button,[tabindex]):focus-visible{outline:2px solid #ffbaa7;outline-offset:3px}
.arcadeLaunch .arcadeShelf:focus-visible{outline-offset:-2px}
@keyframes arcadeOpeningSpin{to{transform:rotate(360deg)}}
@media(hover:hover){.arcadePoster:hover img{transform:scale(1.035)}.arcadeShelfButtons button:hover:not(:disabled){background:rgba(255,199,173,.13);color:#fff}}
@media(max-width:759px){
  .arcadeLaunch .heroHeadline{font-size:clamp(32px,9.4vw,44px)}
  .arcadeLaunch .heroCopy{font-size:14px;line-height:1.72}
  .arcadeLaunchGenres{font-size:11px}
  .arcadeShelf{gap:12px}
  .arcadePoster{flex-basis:88%}
  .arcadePoster h3{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.arcadeLaunch *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}