.home-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}
.home-heading h1{margin:0;font-size:32px}.home-heading>a{font-size:15px;white-space:nowrap}
.panorama{position:relative;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:#241736;box-shadow:var(--shadow)}
.panorama-stage{position:relative;width:100%;height:400px}
.panorama-slide{position:absolute;inset:0;overflow:hidden;color:#fff;text-decoration:none;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .65s ease,visibility .65s}
.panorama-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:1}
.panorama-slide:focus-visible{outline:3px solid var(--gold);outline-offset:-5px}
.panorama-wallpaper,.panorama-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.panorama-video{opacity:0;transition:opacity 1.2s ease-in-out;pointer-events:none}.is-previewing .panorama-video{opacity:1}
.panorama-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#170d2ded,transparent 80%);pointer-events:none}
.panorama-copy{position:absolute;z-index:2;bottom:60px;left:64px;right:64px;pointer-events:none}
.panorama-copy h2{font:clamp(42px,6vw,68px)/.95 Quest,system-ui;color:#fff;letter-spacing:0;margin:8px 0 12px;text-shadow:0 2px 10px #170d2d60}
.panorama-copy p{color:#f0e9fb;font-size:15px;margin:0;max-width:460px}.panorama-copy .eyebrow{color:#f2d382;font-size:14px}


.panorama .panorama-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:52px;min-height:64px;padding:0;border:0;border-radius:0;background:transparent;color:#fff;font:60px/1 system-ui;box-shadow:none;transition:none;text-shadow:0 1px 5px #170d2d80}
.panorama-arrow[data-prev]{left:12px}.panorama-arrow[data-next]{right:12px}
.panorama .panorama-arrow:is(:hover,:active){background:transparent;color:#fff;border:0;transform:translateY(-50%);box-shadow:none;transition:none}
.panorama-dots{position:absolute;z-index:3;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:0}
.panorama-dots button{display:grid;place-items:center;width:40px;min-height:40px;padding:0;border:0;background:transparent;box-shadow:none;border-radius:50%}
.panorama-dots button::after{content:'';width:8px;height:8px;border-radius:50%;background:#ffffff80;box-shadow:0 0 0 1px #21152d66;transition:background .2s,transform .2s}
.panorama-dots button[aria-pressed=true]::after{background:#f2d382;transform:scale(1.4)}
.panorama .panorama-dots button:hover{background:transparent}.panorama-dots button:hover::after{background:#fff}.panorama button:focus-visible{outline:2px solid #f2d382;outline-offset:0}
.create-panorama{background:radial-gradient(ellipse at 70% 35%,#8561b5,#4e3272 58%,#2c1b43)}
.create-panorama::before{content:'';position:absolute;width:60%;aspect-ratio:1;border:1px solid #f0cc7933;border-radius:50%;right:0;top:-50%}



.home-links{display:flex;justify-content:flex-end;gap:24px;padding:24px 4px 0}.home-links a{font-size:15px}
.games-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.game-tile{display:block;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--surface);color:var(--text);text-decoration:none;box-shadow:var(--shadow);transition:transform .2s,border-color .2s}

.game-tile-art{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#241736}
.game-tile-copy{padding:22px 24px}.game-tile-copy h2{margin:0 0 6px;font-size:25px;color:var(--text)}.game-tile-copy p{margin:0;color:var(--muted);font-size:14px}.game-tile-copy .badge{margin-bottom:12px}
.game-placeholder{display:grid;place-items:center;background:radial-gradient(ellipse at center,#745798,#2b1a42);position:relative;overflow:hidden}
.game-placeholder svg{width:38%;height:70%;color:#eccb7f;filter:drop-shadow(0 12px 18px #1b102c55)}
.game-placeholder.memory{background:radial-gradient(ellipse at center,#9b77bb,#4b326a)}
@media(max-width:760px){.home-heading h1{font-size:27px}.panorama-stage{height:380px}.panorama-copy{left:52px;right:40px;bottom:60px}.panorama-copy h2{font-size:46px}.panorama-copy p{font-size:15px;max-width:290px}.panorama-copy .eyebrow{font-size:14px}.panorama-wallpaper{object-position:60% center}.panorama .panorama-arrow{width:40px;min-height:56px;font-size:52px}.panorama-arrow[data-prev]{left:8px}.panorama-arrow[data-next]{right:8px}.create-panorama .panorama-copy h2{font-size:39px}.games-grid{grid-template-columns:1fr;gap:20px}.game-tile-copy{padding:18px 20px}.home-links{justify-content:space-between;gap:12px}}
@media(prefers-reduced-motion:reduce){.panorama-slide,.panorama-video,.panorama-dots button::after,.game-tile{transition:none}.game-tile[href]:hover{transform:none}}

/* Give moving footage a little more room without changing the page layout. */
.panorama{transition:transform .2s ease;transform-origin:center;isolation:isolate}
.game-tile-media{position:relative;overflow:hidden;aspect-ratio:16/9;background:#241736}
.game-tile-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease-in-out;pointer-events:none}
.game-tile.is-previewing .game-tile-video{opacity:1}
.create-panorama::before{display:none}
.create-panorama{background:#342246}
.create-panorama .panorama-wallpaper{object-fit:contain;object-position:right center;width:65%;left:auto;right:2%}
.create-panorama::after{background:linear-gradient(90deg,#251737ed 5%,#25173788 42%,transparent 75%)}
.create-panorama .panorama-copy{max-width:45%;bottom:90px}
@media(hover:hover) and (pointer:fine){.panorama:hover{transform:scale(1.025);z-index:2}.game-tile[href]:hover{transform:scale(1.035);position:relative;z-index:2}}
@media(max-width:760px){.create-panorama .panorama-wallpaper{width:100%;height:76%;top:-8%;right:0;object-position:center}.create-panorama::after{background:linear-gradient(0deg,#251737 0%,#251737c4 25%,transparent 66%)}.create-panorama .panorama-copy{max-width:none;bottom:60px}}
@media(prefers-reduced-motion:reduce){.panorama,.game-tile-video{transition:none}.panorama:hover,.game-tile[href]:hover{transform:none}}
