/* Reusable icon rails and portrait boxes. Steam: 2:3; Switch: 10:16. */
.game-marquee-shell { --marquee-control-width:clamp(50px,4.5vw,64px); position:relative; display:block; min-width:0; }
/* The rail mask reveals the actual page background under the transparent controls. */
.game-marquee { overflow:hidden; min-width:0; padding:8px 0; mask-image:linear-gradient(to right,transparent,#000 var(--marquee-control-width,56px),#000 calc(100% - var(--marquee-control-width,56px)),transparent); }
.game-marquee-track { display:flex; width:max-content; will-change:transform; }
.apple-edition .marquee-arrow { position:absolute; inset-block:0; left:0; z-index:3; width:var(--marquee-control-width); height:100%; min-height:0; display:grid; place-items:center; border:0; border-radius:0; background:transparent; color:#3d8be0; cursor:pointer; box-shadow:none; margin:0; padding:0; transition:color .18s; touch-action:manipulation; }
.apple-edition .marquee-next { left:auto; right:0; }
.apple-edition .marquee-arrow svg { width:29px; height:29px; fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 1px 3px #fff); transition:transform .18s; }
.apple-edition .marquee-arrow:hover { color:#0875e4; }
.apple-edition .marquee-arrow:hover svg { transform:scale(1.1); }
.apple-edition .marquee-arrow:active svg { transform:scale(.96); }
.game-marquee-set { display:flex; flex:none; align-items:flex-start; gap:18px; padding-right:18px; }
.apple-edition .intro-game { position:relative; margin:0; width:var(--game-icon-size,80px); flex:none; text-align:center; }
.apple-edition .intro-game-art { display:grid; place-items:center; width:100%; aspect-ratio:1; border-radius:23%; overflow:hidden; background:#fff; box-shadow:0 4px 14px #23466e10; text-decoration:none; }
.apple-edition .intro-game-art img { display:block; width:100%; height:100%; object-fit:cover; }
.apple-edition .intro-game-contain img { object-fit:cover; padding:0; }
.apple-edition .intro-game-fallback { color:#6394c3; background:linear-gradient(140deg,#e5f2ff,#fff9e2); padding:8px; font-size:15px; font-weight:650; }
.apple-edition .intro-game figcaption { position:absolute; inset:auto 0 0; z-index:1; margin:0; padding:20px 6px 7px; max-height:100%; font-size:10px; line-height:1.35; font-weight:550; color:#fff; background:linear-gradient(transparent,#081729d9 42%); border-radius:0 0 15px 15px; opacity:0; visibility:hidden; transform:translateY(5px); pointer-events:none; overflow:hidden; transition:opacity .18s ease,transform .18s ease,visibility .18s; }
.apple-edition .intro-game:hover figcaption,.apple-edition .intro-game:focus-within figcaption { opacity:1; visibility:visible; transform:translateY(0); }
.apple-edition .game-cover { --cover-ratio:2/3; width:auto; }
.apple-edition .game-cover .intro-game-art { height:var(--game-cover-height,180px); width:auto; aspect-ratio:var(--cover-ratio); border-radius:9px; background:#fff; box-shadow:0 5px 16px #263d5c1c; }
.apple-edition .game-cover[data-cover-format="switch"] { --cover-ratio:10/16; }
.apple-edition .game-cover .intro-game-art img { object-fit:cover; padding:0; }
.apple-edition .game-cover figcaption { border-radius:0 0 9px 9px; }
.apple-edition .game-cover .intro-game-fallback { max-width:calc(var(--game-cover-height,180px)*.667); }
@media(max-width:600px) { .game-marquee-shell { --marquee-control-width:48px; }.apple-edition .marquee-arrow svg { width:25px; height:25px; } }
@media print { .game-marquee-shell { display:block; }.marquee-arrow { display:none!important; }.game-marquee { overflow:visible; mask-image:none; }.game-marquee-track { transform:none!important; width:auto; }.game-marquee-set { flex-wrap:wrap; }.game-marquee-set[aria-hidden] { display:none; } }