/* Reference-matched dimensions at 1536 × 1024. */
body{font-family:Arial,Helvetica,sans-serif;font-weight:400;background:#030e13}.skip-link,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-link:focus{width:auto;height:auto;margin:0;clip-path:none;z-index:100;background:#d0ff00;color:#000;padding:10px}.sidebar{padding:20px 22px}.logo{display:block;height:22px;line-height:22px}.logo img{display:block}.collapse{position:absolute;right:15px;top:12px;background:transparent;border:0;color:#bdcfda;padding:0 6px;min-height:34px;font-size:26px}.sidebar nav{margin-top:29px;gap:0}.sidebar nav a{height:43px;min-height:43px;padding:0 6px;gap:16px;font-size:14px}.nav-icon{flex:0 0 27px;object-fit:contain}.sidebar nav a.active{background:transparent;color:inherit}.sidebar .nav-label{margin:22px 4px 7px;letter-spacing:.5px}.sidebar .nav-label+nav{margin:0}.sidebar nav[aria-label="Your games"]{border-top:1px solid #142630;padding-top:10px;margin-top:10px}.sidebar .lime{margin-top:19px;padding:10px 0;font-size:14px}.sidebar small{margin-top:16px}.topbar{height:60px;gap:29px;padding:8px 26px 8px 28px}.topbar .lime{display:flex;align-items:center;justify-content:center;width:77px;height:37px;border-radius:13px}.topbar .profile{border:0;background:none;padding:0;min-height:40px;width:40px;flex:0 0 40px}.search-wrap input{height:37px;min-height:37px;font-size:13px;font-weight:400}.search-wrap input::placeholder{color:#b4c6da}.search-wrap{max-width:605px}.hero{height:354px}.home-hero>.hero-art{left:auto;right:0;width:62.2%;object-fit:fill}.home-hero.alternate-slide>.hero-art{width:100%;object-fit:cover}.hero-shade{background:linear-gradient(90deg,#020b11 0%,#020b11 24%,#020b1177 39%,transparent 55%)}.hero-content{padding:32px 42px;max-width:710px}.hero h1{font-size:48px;line-height:1.02;margin:12px 0 8px;letter-spacing:-1px;font-weight:800}.hero p{font-size:15px;line-height:1.55;margin:0 0 18px;max-width:540px}.hero .actions button{background:linear-gradient(#24323e,#111b26);border-radius:16px;font-size:14px;padding:10px 21px}.hero .actions a{font-size:14px;padding:11px 30px;border-radius:14px}.benefits{gap:26px;font-size:12px;margin-top:19px}.benefits>span{position:relative;min-width:135px;padding-left:39px;line-height:1.4}.benefits b{position:absolute;left:4px;top:0;font-size:29px;line-height:1.1;text-shadow:0 0 12px #529dff}.benefits strong{display:block;font-size:12px}.benefits small{display:block;color:#aebfd0;font-size:11px}.hero-controls{inset:auto 0 0;display:flex;justify-content:center;gap:2px;height:27px;align-items:center}.hero-controls button[data-slide]{width:14px;min-height:24px;height:24px;border:0;background:transparent;color:#98a3ae;padding:0;font-size:20px}.hero-controls button[data-slide].selected{color:white}.hero-controls button[data-step]{position:absolute;bottom:140px;width:33px;height:33px;min-height:33px;border:0;font-size:28px;background:#233345aa;line-height:1}.hero-controls button[data-step="-1"]{left:4px}.hero-controls button[data-step="1"]{right:4px}.hero-controls #pause{position:absolute;width:1px;height:1px;min-height:1px;clip-path:inset(50%);overflow:hidden}.hero-controls #pause:focus-visible{clip-path:none;width:40px;height:32px;right:45px;bottom:7px}.content{padding:11px 28px 24px 29px}.section-title{margin-bottom:0}.section-title h2{font-size:20px}.section-sub{line-height:1.3;margin:0 0 8px}.featured{grid-template-columns:1fr 1.11fr 1fr;gap:14px}.featured .card{height:185px;position:relative}.featured .card img{height:148px;object-fit:fill}.featured .card-body{padding:0 13px;position:absolute;bottom:10px;left:0;right:0}.featured .card h3{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.featured .pill{font-size:10px;background:#13212be0;padding:4px 12px}.card-arrow{position:absolute;right:10px;bottom:0;width:33px;height:33px;border:1px solid #65788599;border-radius:50%;background:#26313ea8;display:grid;place-items:center;font-size:27px;line-height:1}.featured .card{background:linear-gradient(0deg,#02090d,#12212a)}.section{margin-top:17px}.popular{margin-top:9px;gap:12px}.popular .card img{height:auto;aspect-ratio:2.14;width:100%;object-fit:cover}.popular .card-body{padding:6px 8px}.popular .card h3{font-size:14px;margin-bottom:4px}.popular .pill{font-size:10px;padding:3px 9px}.popular .card{height:154px}.promo{height:113px;margin-top:22px;padding:18px 28px;background:linear-gradient(90deg,#0c1d2bea,#0b1c2870),url('/assets/promo-art.webp') center/cover}.promo h2{font-size:19px}.promo p{line-height:1.6;max-width:430px}.promo .benefits{margin:0;gap:10px;flex:1;justify-content:center}.promo .benefits>span{min-width:110px;padding-left:15px;font-size:12px}.promo .outline{font-size:14px;white-space:nowrap;min-width:148px;text-align:center;padding:9px 17px}.game-hero{height:325px}.game-hero>.hero-art{object-fit:fill}.game-hero .hero-content{width:40%;max-width:535px;bottom:0;left:0;padding:10px 26px 14px;background:linear-gradient(90deg,#06121bef 65%,#06121b00);height:89px}.game-hero .hero-content:has(.game-subline){height:105px}.game-hero .game-tagline{font-size:20px;font-weight:700;line-height:1.3;margin:0 0 15px;white-space:nowrap}.game-hero .game-subline{font-size:15px;line-height:1.2;margin:-13px 0 12px}.game-hero .pill{font-size:12px;padding:4px 12px;background:#172630}.detail-grid{padding:14px 18px 14px 26px;grid-template-columns:minmax(0,698fr) minmax(0,296fr) minmax(0,244fr);gap:16px}.panel{border:0;background:linear-gradient(110deg,#101f28,#0d1921)}.media-panel{padding:8px;height:417px}.player{height:311px;aspect-ratio:auto;border:1px solid #243543}.player>img{height:270px;object-fit:fill}.play-overlay{background:none;padding:0;place-content:start center;padding-top:116px}.play-circle{height:82px;width:82px;font-size:37px;margin-bottom:8px;background:#020b0ce8}.play-overlay strong{font-size:18px;line-height:23px;background:#070d15bd}.player-label{height:41px;display:flex;align-items:center;gap:24px;background:#030708;padding:8px 12px;font-size:11px}.player-label b{color:#d0ff00;font-size:23px;line-height:1}.player-label span{white-space:nowrap}.expand-player{position:absolute;right:7px;bottom:0;padding:0;border:0;background:transparent;font-size:25px;width:30px;min-height:41px}.gallery{margin-top:10px;grid-template-columns:110fr 134fr 134fr 132fr 130fr;gap:9px}.gallery button{height:74px;border-width:1px}.gallery img{object-fit:fill}.gallery span{font-size:24px}.info{padding:11px 15px;height:417px}.info h2{font-size:26px;line-height:1.4;margin:0}.info>p{margin:0 0 8px;line-height:1.4}.info .rating{margin:5px 0 13px;font-size:14px;color:#b2c4d4}.rating b{font-size:24px;color:#d0ff00;vertical-align:-2px;margin-right:6px}.rating strong{color:#d0ff00}.info .actions{gap:12px;flex-wrap:nowrap}.info .actions button{font-size:11px;padding:8px 10px;min-height:39px;background:transparent;white-space:nowrap}.facts{grid-template-columns:112px 1fr;gap:12px;margin:19px 0 23px;font-size:11px;line-height:1.5}.info .pill{font-size:10px;padding:4px 10px}.recommend h2{font-size:16px}.recommend .panel{padding:12px 14px}.recommend .mini{margin:9px 0;gap:11px;font-size:12px}.mini>div{min-width:0}.mini .pills{gap:4px;flex-wrap:nowrap;margin-top:4px}.mini .pill{font-size:9px;padding:3px 7px;white-space:nowrap}.recommend .mini img{flex:0 0 80px}.details{margin-top:-7px}.tabs{gap:1px;height:36px}.tabs button{font-size:13px;min-height:36px;padding:5px 15px}.tab-content{padding:18px 8px;grid-template-columns:2.5fr 1fr;gap:25px}.tab-content h2{font-size:23px}.tab-content p{font-size:13px;line-height:1.75}.tab-content strong{font-size:13px}.features{margin-top:6px;font-size:11px;line-height:1.3}.unavailable{display:grid;place-content:center;text-align:center;width:100%;height:100%;padding:20px;background:#08131a}.collapsed .sidebar{width:70px;padding-left:12px;padding-right:12px}.collapsed .sidebar .logo,.collapsed .sidebar .nav-label,.collapsed .sidebar small,.collapsed .sidebar>.lime{display:none}.collapsed .sidebar nav a{font-size:0;gap:0;padding:0 9px}.collapsed main,.collapsed .topbar{margin-left:70px}.collapsed .collapse{right:18px}.collapsed .sidebar nav:first-of-type{margin-top:46px}
@media(max-width:1200px){.sidebar{width:190px}.topbar,main{margin-left:190px}.sidebar nav a{gap:10px}.detail-grid{grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr)}.media-panel,.info{height:auto;min-height:385px}.player{height:auto;aspect-ratio:2.19}.player>img{height:100%;object-fit:cover}.play-overlay{padding-top:12%}.player-label{height:35px;font-size:10px;gap:12px}.gallery button{height:60px}.recommend{grid-column:1/3;grid-row:3}.details{grid-column:1/3;grid-row:2}.featured .pill{padding:3px 7px;font-size:9px}.featured .card-arrow{display:none}.promo{height:auto}.promo .benefits{display:none}.home-hero .hero-content{padding-left:30px}.hero h1{font-size:42px}.facts{grid-template-columns:96px 1fr}.popular{grid-template-columns:repeat(3,1fr)}.popular .card{height:auto}.topbar{gap:18px}.game-hero .game-tagline{font-size:18px}.game-hero .hero-content{width:53%}}
@media(max-width:900px){.topbar,main,.collapsed main,.collapsed .topbar{margin-left:0}.sidebar{width:224px}.collapsed .sidebar{width:224px}.topbar{padding:8px 14px;gap:10px}.hero h1{font-size:39px}.hero-content{max-width:620px}.sidebar .collapse{display:none}.featured .card{height:160px}.featured .card img{height:125px}.featured .card-body{padding:0 8px}.game-hero{height:280px}.game-hero>.hero-art{object-fit:cover;object-position:center}.detail-grid{padding:14px}.mini .pills{flex-wrap:wrap}.info .actions{gap:6px}.info .actions button{padding:6px}.facts{grid-template-columns:87px 1fr;font-size:11px}.game-hero .hero-content{width:65%}}
@media(max-width:600px){.sidebar nav a{gap:16px}.topbar .lime{width:60px;height:37px}.hero{height:400px}.home-hero>.hero-art{width:100%;height:240px;object-fit:cover!important;object-position:center!important}.hero-shade{background:linear-gradient(0deg,#030c13 8%,#030c13de 48%,#030c1300 100%)}.home-hero .hero-content{padding:100px 20px 20px}.hero h1{font-size:34px;max-width:335px}.hero p{font-size:13px;line-height:1.5;margin-bottom:16px}.hero .actions{gap:8px}.hero .actions a,.hero .actions button{padding:10px 16px;font-size:12px}.benefits{gap:5px}.benefits>span{min-width:0;flex:1;padding-left:24px}.benefits b{font-size:22px;left:0}.benefits strong{font-size:10px}.benefits small{font-size:10px}.hero-controls button[data-step]{bottom:170px}.content{padding:14px}.featured{grid-template-columns:1fr;gap:12px}.featured .card{height:180px}.featured .card img{height:148px}.featured .card-body{padding:0 12px}.featured .pill{font-size:10px;padding:4px 10px}.featured .card-arrow{display:grid}.popular{grid-template-columns:repeat(2,1fr);gap:10px}.popular .card h3{font-size:13px}.popular .pill{font-size:9px;padding:3px 6px}.popular .card-body{padding:6px}.section-title h2{font-size:18px}.section-sub{font-size:12px}.promo{padding:18px;height:auto}.promo p{font-size:12px}.promo .outline{font-size:13px}.game-hero{height:255px}.game-hero>.hero-art{object-fit:cover;object-position:43% center!important}.game-hero .hero-content{width:100%;max-width:none;background:linear-gradient(0deg,#06121b,#06121bcc,transparent);padding:14px 20px;height:90px}.game-hero .hero-content:has(.game-subline){height:110px}.game-hero .game-tagline{font-size:16px;margin-bottom:12px;white-space:normal}.game-hero .game-subline{font-size:12px;margin:-9px 0 12px}.game-hero .pill{font-size:10px;padding:4px 10px}.detail-grid{grid-template-columns:1fr;gap:14px}.media-panel{min-height:0;height:auto}.player{aspect-ratio:1.95}.play-overlay{padding-top:12%}.play-circle{width:62px;height:62px;font-size:28px;margin-bottom:5px}.play-overlay strong{font-size:14px}.player-label{font-size:9px;gap:10px;padding:6px;height:32px}.player-label b{font-size:16px}.expand-player{font-size:20px;right:0;width:22px;min-height:32px}.gallery{gap:6px;margin-top:8px}.gallery button{height:49px;min-height:44px}.info{min-height:0;height:auto;padding:15px}.info .actions button{font-size:12px;padding:8px 14px;min-height:44px}.facts{grid-template-columns:115px 1fr;font-size:12px;gap:12px;margin:18px 0}.info .pill{font-size:11px}.details{grid-column:1;grid-row:3;margin:0}.recommend{grid-column:1;grid-row:4;display:grid;grid-template-columns:1fr}.tabs{height:44px}.tabs button{min-height:44px;padding:8px 12px;font-size:12px}.tab-content{grid-template-columns:1fr;padding:15px 4px;gap:15px}.tab-content p{font-size:14px}.features{font-size:12px}.mini .pills{flex-wrap:nowrap}.mini .pill{font-size:10px}.recommend .mini{font-size:13px}.recommend .mini img{height:58px;width:90px;flex-basis:90px}.recommend .panel+.panel{margin-top:0}}

@media(min-width:901px){.home-hero .hero-shade{background:linear-gradient(90deg,#020b11 0%,#020b11 33%,#020b1177 45%,transparent 58%)}.home-hero h1{font-size:48px;font-weight:700;letter-spacing:-1.5px;transform:scaleX(.93);transform-origin:left center;width:108%}.section-title h2{line-height:1.2}.section-title{min-height:24px}.sidebar .nav-label{margin-top:17px}.facts dd{white-space:nowrap;font-size:11px}.facts{gap:12px;margin-top:18px;margin-bottom:21px}.rating{line-height:1.2!important}.info .rating{margin-bottom:10px}.info .actions button{font-size:12px;padding:8px 10px}.promo{background:linear-gradient(90deg,#0c1d2be8,#0b1c2870),url('/assets/promo-clean.webp') center/cover}}

.player{container-type:inline-size}.play-overlay{padding:0;display:block}.play-circle{position:absolute;left:50%;top:calc((100% - 41px)*.433);transform:translateX(-50%);width:12.1%;height:auto;aspect-ratio:1;font-size:5.4cqw;margin:0}.play-overlay strong{position:absolute;left:50%;top:calc((100% - 41px)*.785);transform:translateX(-50%);font-size:2.65cqw;line-height:1.3;white-space:nowrap;padding:0 2px}.player>img{height:calc(100% - 41px);object-fit:fill}@media(max-width:1200px){.play-circle{top:calc((100% - 35px)*.433)}.play-overlay strong{top:calc((100% - 35px)*.785)}.player>img{height:calc(100% - 35px)}}@media(max-width:600px){.play-circle{top:calc((100% - 32px)*.433)}.play-overlay strong{top:calc((100% - 32px)*.785)}.player>img{height:calc(100% - 32px)}.game-hero .hero-content{background:#051019f7}.game-hero>.hero-art{height:calc(100% - 80px);object-fit:cover;object-position:center top!important}.game-hero:has(.game-subline)>.hero-art{height:calc(100% - 100px)}}

@media(min-width:601px){.game-hero .hero-content{background:linear-gradient(90deg,#06121b 0%,#06121b 85%,#06121b00 100%)}}

.home-hero .hero-controls:before{content:"";position:absolute;bottom:0;left:calc(50% - 43px);width:86px;height:25px;background:#10202cc9;border-radius:20px;z-index:-1}

body[data-game="supercharged"] .gallery img{object-fit:cover}.player .image-open img{object-fit:contain}
/* Fill the Supercharged image holder while clipping to its rounded boundary. */
body[data-game="supercharged"] .player .image-open{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;line-height:0;background:transparent}
body[data-game="supercharged"] .player .image-open img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center}

body[data-game="supercharged"] .gallery{grid-template-columns:repeat(5,minmax(0,1fr))}

.vimeo-preview{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;background:#08131b}.player .vimeo-preview img,.dialog-video .vimeo-preview img{display:block;width:100%;height:100%;max-height:none;object-fit:cover}.vimeo-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:76px;height:76px;border:2px solid #d0ff00;border-radius:50%;background:#06121bdd;color:#d0ff00;font-size:32px}.vimeo-caption{position:absolute;bottom:0;left:0;right:0;padding:12px;background:#03101cdd;color:white;text-align:center;font-weight:700}.dialog-video{position:relative}.vimeo-preview:hover .vimeo-play{background:#d0ff00;color:#06121b}

.player .vimeo-embedded{display:block;width:100%;height:100%;border:0}

body[data-game="colosseum"] .player .image-open{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;line-height:0;background:transparent}body[data-game="colosseum"] .player .image-open img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center}body[data-game="colosseum"] .gallery img{object-fit:cover}

.home-hero:not(.alternate-slide) h1 span{white-space:nowrap}
@media(max-width:400px){.home-hero:not(.alternate-slide) h1{font-size:clamp(24px,8.5vw,34px)}}

/* Match the other homepage banners without stretching the artwork. */
.home-hero.colosseum-slide>.hero-art{width:100%;height:100%;top:0;object-fit:cover;object-position:center}
@media(max-width:600px){.home-hero.colosseum-slide>.hero-art{height:240px;object-position:65% center!important}}

.home-hero.deathmetal-slide>.hero-art{width:100%;height:100%;top:0;object-fit:cover;object-position:center 38%}
@media(max-width:600px){.home-hero.deathmetal-slide>.hero-art{height:240px;object-position:60% center!important}}

.home-hero.supercharged-slide>.hero-art{width:100%;height:100%;top:0;object-fit:cover;object-position:center 55%}
@media(max-width:600px){.home-hero.supercharged-slide>.hero-art{height:240px;object-position:72% center!important}}

.home-hero:not(.alternate-slide)>.hero-art{width:100%;height:100%;top:0;object-fit:cover;object-position:center 55%}
@media(max-width:600px){.home-hero:not(.alternate-slide)>.hero-art{height:240px;object-position:67% center!important}}

/* Remove the fade only from the first homepage slide. */
.home-hero:not(.alternate-slide) .hero-shade{display:none;background:none}

/* Restore the Colosseum dark gradient at half opacity. */
.home-hero.colosseum-slide .hero-shade{display:block;background:linear-gradient(90deg,#020b11 0%,#020b11 24%,#020b1177 39%,transparent 55%);opacity:.5}

/* Restore the Supercharged dark gradient at half opacity. */
.home-hero.supercharged-slide .hero-shade{display:block;background:linear-gradient(90deg,#020b11 0%,#020b11 24%,#020b1177 39%,transparent 55%);opacity:.5}

/* Restore the Death Metal dark gradient at half opacity. */
.home-hero.deathmetal-slide .hero-shade{display:block;background:linear-gradient(90deg,#020b11 0%,#020b11 24%,#020b1177 39%,transparent 55%);opacity:.5}

/* Fade the complete hero scene out before the next slide fades in. */
.home-hero>.hero-art,.home-hero>.hero-shade,.home-hero>.hero-content{transition:opacity .45s ease-in-out}
.home-hero.banner-fading>.hero-art,.home-hero.banner-fading>.hero-shade,.home-hero.banner-fading>.hero-content{opacity:0!important;transition-duration:.24s}
.home-hero>.hero-art-outgoing{position:absolute;display:block;max-width:none;opacity:1;pointer-events:none;transition:opacity .7s cubic-bezier(.4,0,.2,1);will-change:opacity}
.home-hero>.hero-art-outgoing.is-leaving{opacity:0}
@media(prefers-reduced-motion:reduce){.home-hero>.hero-art,.home-hero>.hero-shade,.home-hero>.hero-content{transition:none}}

/* Keep every Featured Games image in one proportional, responsive frame. */
#featured .featured{grid-template-columns:repeat(3,minmax(0,1fr))}
#featured .featured .card{height:auto;min-width:0}
#featured .featured .card>img{display:block;width:100%;height:auto!important;aspect-ratio:5/2;object-fit:contain!important;object-position:center;background:#071219}
@media(max-width:600px){#featured .featured{grid-template-columns:1fr}}
#featured .featured .card-body{position:relative;inset:auto;min-height:78px;padding:11px 12px 12px}
#featured .featured .card h3{position:static;width:auto;height:auto;overflow:visible;clip-path:none;margin:0 0 8px;font-size:clamp(1rem,1.25vw,1.15rem);font-weight:700;line-height:1.2;letter-spacing:.01em;white-space:normal}
#featured .featured .pills{padding-right:38px}
#featured .featured .card-arrow{right:12px;bottom:12px}

/* Keep the sidebar scrollable without showing a scrollbar. */
.sidebar{scrollbar-width:none;-ms-overflow-style:none}
.sidebar::-webkit-scrollbar{display:none;width:0;height:0}

/* Keep both Vimeo gallery videos and still images in one undistorted 16:9 frame. */
body:is([data-game="colosseum"],[data-game="supercharged"]) .media-panel,body:is([data-game="colosseum"],[data-game="supercharged"]) .info{height:auto}
body:is([data-game="colosseum"],[data-game="supercharged"]) .player{height:auto;aspect-ratio:16/9}
body:is([data-game="colosseum"],[data-game="supercharged"]) .player>img,body:is([data-game="colosseum"],[data-game="supercharged"]) .player>.image-open>img{width:100%;height:100%;object-fit:cover}
body:is([data-game="colosseum"],[data-game="supercharged"]) .player>.vimeo-embedded{display:block;width:100%;height:100%}


/* Death Metal uses exactly five evenly sized picture thumbnails. */
body[data-game="death-metal"] .gallery{grid-template-columns:repeat(5,minmax(0,1fr))}
body[data-game="death-metal"] .gallery img{object-fit:cover}

/* Fill Death Metal's media layout at every viewport without stretching. */
body[data-game="death-metal"] .media-panel,body[data-game="death-metal"] .info{height:auto;min-height:0}
body[data-game="death-metal"] .player{width:100%;height:auto;aspect-ratio:16/9}
body[data-game="death-metal"] .player>.image-open{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;line-height:0;background:transparent}
body[data-game="death-metal"] .player>img,body[data-game="death-metal"] .player>.image-open>img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center}
body[data-game="death-metal"] .player>.vimeo-embedded{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
body[data-game="death-metal"] .gallery button{width:100%;min-width:0;height:auto;aspect-ratio:16/9;padding:0}
body[data-game="death-metal"] .gallery img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

/* Vimeo-style play badges belong only to the two video thumbnails. */
body[data-game] .gallery .thumbnail-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:38px;max-width:70%;height:26px;padding:0;border-radius:6px;background:#ecf024;color:#000;pointer-events:none}
body[data-game] .gallery .thumbnail-play::before{content:"";width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid #000;margin-left:2px}

/* Display complete game banners at their original proportions at every width. */
body[data-game] .game-hero{height:auto;aspect-ratio:auto;line-height:0}
body[data-game] .game-hero>.hero-art{position:static;display:block;inset:auto;width:100%;height:auto;object-fit:contain;object-position:center!important}

/* Match the shared carousel frame; retain image proportions and all HTML information. */
.home-hero.deathmetal-slide>.hero-art{width:100%;height:100%;top:0;object-fit:contain;object-position:right center!important}
.home-hero.deathmetal-slide .hero-shade{display:none;background:none}
.home-hero.deathmetal-slide .hero-content{position:relative;inset:auto;max-width:600px;padding:32px 42px;background:transparent}
.home-hero.deathmetal-slide .benefits{display:flex;max-width:500px}
@media(max-width:1200px){.home-hero.deathmetal-slide .hero-content{padding-left:30px}}
@media(max-width:600px){
 .home-hero.deathmetal-slide>.hero-art{height:240px;object-fit:contain!important;object-position:right top!important}
 .home-hero.deathmetal-slide .hero-content{padding:150px 20px 28px}
 .home-hero.deathmetal-slide h1{margin:8px 0;font-size:32px}
 .home-hero.deathmetal-slide .hero-description{margin-bottom:12px}
 .home-hero.deathmetal-slide .benefits{margin-top:14px}
}

/* The extended scene fills the shared banner frame without distorting the artwork. */
.home-hero.deathmetal-slide>.hero-art{height:100%;top:0;transform:none;object-fit:cover;object-position:right center!important;clip-path:none}
@media(max-width:600px){.home-hero.deathmetal-slide>.hero-art{height:240px;object-fit:cover!important;object-position:60% top!important}}

/* Give the reframed character a small top inset without stretching the artwork. */
#featured .featured .card[href="/games/death-metal"]>img{padding-top:1.2%;object-fit:cover!important;object-position:center top;background:#090706}

/* High-resolution panorama shared by desktop and mobile promo layouts. */
.promo#about{background-color:#0b1c28;background-image:linear-gradient(90deg,rgba(5,18,29,.88) 0%,rgba(5,18,29,.69) 43%,rgba(5,18,29,.42) 100%),url("/assets/promo-city-hq.webp");background-position:center,center 50%;background-size:cover;background-repeat:no-repeat}

/* Mobile/tablet hero: artwork above a separate, readable black content area. */
@media (max-width:1024px){
 .home-hero.home-hero{--hero-image-height:clamp(200px,42vw,360px);height:auto;background:#030e13}
 .home-hero.home-hero>.hero-art{position:relative;inset:auto;display:block;width:100%;height:var(--hero-image-height);object-fit:cover!important;transform:none}
 .home-hero.home-hero>.hero-shade{display:none}
 .home-hero.home-hero>.hero-content{position:relative;inset:auto;width:100%;max-width:none;padding:22px 20px 16px;background:#030e13}
 .home-hero.home-hero h1{width:auto;max-width:none;margin:10px 0;transform:none;font-size:clamp(26px,5vw,42px);line-height:1.1;letter-spacing:-.7px;overflow-wrap:anywhere}
 .home-hero.home-hero h1 span{white-space:normal}
 .home-hero.home-hero .eyebrow{font-size:12px;letter-spacing:1.5px}
 .home-hero.home-hero .hero-description{max-width:640px;font-size:16px;line-height:1.5;margin:0 0 18px}
 .home-hero.home-hero .hero-description br{display:none}
 .home-hero.home-hero .actions{display:flex;gap:10px;flex-wrap:wrap}
 .home-hero.home-hero .actions a,.home-hero.home-hero .actions button{justify-content:center;min-height:44px;padding:11px 18px;font-size:14px}
 .home-hero.home-hero .benefits{display:flex;max-width:560px;gap:12px;margin-top:22px;flex-wrap:wrap}
 .home-hero.home-hero .benefits>span{min-width:0;flex:1 1 100px;padding-left:26px}
 .home-hero.home-hero .benefits b{left:0;font-size:24px}
 .home-hero.home-hero .benefits strong,.home-hero.home-hero .benefits small{font-size:12px}
 .home-hero.home-hero .hero-controls{position:static;height:40px;padding-bottom:10px}
 .home-hero.home-hero .hero-controls button[data-step]{top:calc(var(--hero-image-height)/2 - 22px);bottom:auto;width:44px;height:44px;min-height:44px}
 body[data-game] .gallery .thumbnail-play{width:28px;height:20px;border-radius:4px}
 body[data-game] .gallery .thumbnail-play::before{border-top-width:4px;border-bottom-width:4px;border-left-width:7px}
 body[data-game] .play-circle{width:40px;height:40px;font-size:18px}
}
/* All mobile game galleries retain five items, arranged as three plus two. */
@media (max-width:600px){
 body[data-game] .gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 body[data-game] .gallery button{width:100%;min-width:0;height:auto;min-height:44px;aspect-ratio:16/9;padding:0}
 body[data-game] .gallery img{display:block;width:100%;height:100%;object-fit:cover}
}

.coming-preview{position:relative;overflow:hidden;border-radius:14px;isolation:isolate}.coming-preview img{display:block;width:100%;height:280px;object-fit:cover;filter:blur(4px) brightness(.72);transform:scale(1.15)}.coming-preview strong{position:absolute;inset:0;display:grid;place-items:center;color:#ecf024;font-size:clamp(28px,7vw,48px);font-weight:900;text-transform:uppercase;text-align:center;padding:20px}

/* Upcoming games retain their card layout with an obscured artwork reveal. */
.upcoming-art{position:relative;overflow:hidden;isolation:isolate;background:#07111b}
.upcoming-art img{filter:blur(3px) brightness(.78);transform:scale(1.16);pointer-events:none}
.upcoming-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#04101810,#04101855);z-index:1}
.upcoming-label{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);display:block;white-space:nowrap;padding:8px 11px;border:1px solid #ecf02466;border-radius:6px;background:#071116db;color:#ecf024;font-size:14px;font-weight:800;line-height:1.2;letter-spacing:.65px;text-transform:uppercase;box-shadow:0 4px 18px #0005}
.card:hover .upcoming-art img,.card:focus-visible .upcoming-art img{filter:blur(3px) brightness(.78)}

.topbar .lime{width:auto;height:auto;min-height:44px;padding:12px 24px;flex-shrink:0;white-space:nowrap;line-height:1.2;border-radius:12px;font-size:14px;font-weight:800;background:#ecf024;color:#080e12;border:1px solid #f1f65a;box-shadow:0 3px 14px #ecf02418;transition:background .15s,box-shadow .15s}.topbar .lime:hover{background:#f5f86a;box-shadow:0 4px 18px #ecf02430}.topbar .lime:focus-visible{outline:2px solid white;outline-offset:3px}.topbar .search-wrap{flex:1;max-width:none}@media(max-width:600px){.topbar .lime{padding:12px 16px;min-height:44px;font-size:14px}}
/* Keep every lime action legible, including linked buttons. */
a.lime,button.lime,a.lime:hover,button.lime:hover,a.lime:focus-visible,button.lime:focus-visible{color:#000!important}.topbar .profile-nav{display:inline-flex;white-space:nowrap;font-size:14px;padding:10px 4px}@media(max-width:600px){.topbar{gap:10px}.topbar .profile-nav{font-size:13px}.topbar .search-wrap{min-width:0}}

/* Temporarily pause category navigation while retaining its layout. */
.sidebar nav[aria-label="Game categories"] a[aria-disabled="true"]{opacity:.45;cursor:not-allowed;color:#9cabba}.sidebar nav[aria-label="Game categories"] a[aria-disabled="true"]:hover{background:transparent;color:#9cabba}