/* Theme and shared controls for the homepage and individual game page. */
:root { --ink:#101747; --muted:#7a88a5; --blue:#365aff; --purple:#934cff; --line:#e9edf7; --shadow:0 8px 24px #53699b0a; --gradient:linear-gradient(120deg,#12c9f6,#3654ff 58%,#ae55ff); font-family:Inter,"Segoe UI",Arial,sans-serif; color:var(--ink); background:#f8fbff; font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(ellipse at 5% 30%,#edf6ff8a,transparent 40%),radial-gradient(ellipse at 90% 70%,#f3efff80,transparent 35%),#f8fbff; font-size:14px; line-height:1.5; }
button,input { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; border:0; color:inherit; }
button:disabled { cursor:default; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid #82bdff; outline-offset:4px; }
img { max-width:100%; display:block; }
[hidden] { display:none!important; }
.icon { height:20px; width:20px; flex:none; vertical-align:middle; }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body.modal-open { overflow:hidden; }
.skip-link { position:fixed; top:-60px; left:20px; padding:12px 20px; background:var(--blue); color:white; z-index:50; border-radius:8px; }
.skip-link:focus { top:12px; }
.icon-button { display:inline-flex; align-items:center; justify-content:center; background:transparent; min-width:38px; height:38px; border-radius:50%; transition:background .2s; }
.icon-button:hover { background:#edf2ff; }
.button { display:inline-flex; gap:9px; align-items:center; justify-content:center; border-radius:10px; padding:11px 24px; min-height:40px; font-size:12px; font-weight:750; transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:linear-gradient(118deg,#43a0ff,#3b4dff 55%,#b364f6); color:white; box-shadow:0 4px 14px #3f56ff22; }
.button-primary .icon { width:16px; height:16px; fill:currentColor; }
.eyebrow { font-size:10px; letter-spacing:1.5px; font-weight:750; }

/* Sticky navigation and search. */
.site-header { position:sticky; top:0; z-index:20; background:#ffffffed; border-bottom:1px solid #e9edf9; backdrop-filter:blur(16px); }
.header-inner { max-width:1500px; margin:auto; padding:0 48px; min-height:82px; display:flex; align-items:center; gap:26px; }
.brand { font-size:29px; letter-spacing:-1.25px; font-weight:850; white-space:nowrap; line-height:1; }
.brand span { letter-spacing:-1.1px; }
.primary-nav { display:flex; gap:29px; margin-left:25px; align-self:stretch; align-items:center; white-space:nowrap; }
.primary-nav a { height:100%; display:flex; align-items:center; font-size:13px; font-weight:600; position:relative; transition:color .2s; }
.primary-nav a:hover,.primary-nav a.active { color:var(--blue); }
.primary-nav a.active:after { content:""; height:2px; position:absolute; bottom:16px; left:0; right:0; background:#5875ff; border-radius:2px; }
.search-bar { display:flex; align-items:center; gap:12px; background:#f0f4fb; border:1px solid #e4ebf7; border-radius:28px; padding:10px 15px; flex:1; min-width:180px; margin:0 0 0 auto; }
.search-bar .icon { width:17px; height:17px; }
.search-bar input { min-width:0; width:100%; border:0; outline:0; background:none; font-size:12px; color:var(--ink); }
.search-bar input::placeholder { color:#7e8ca9; }
.search-bar kbd { font:12px inherit; color:#8c9ab5; border:1px solid #dae2f0; border-radius:4px; padding:0 5px; }
.header-favorites { position:relative; padding:0; }
.header-favorites .icon { height:24px; width:24px; stroke-width:2; }
.header-favorites.selected { color:var(--blue); background:#edf2ff; }
.favorite-count { position:absolute; top:0; right:-2px; min-width:16px; height:16px; padding:0 4px; background:var(--purple); border:2px solid white; border-radius:10px; color:white; font-size:9px; line-height:12px; }
.header-note { display:flex; align-items:center; gap:10px; white-space:nowrap; }
.profile-mark { width:36px; height:36px; border-radius:50%; background:var(--gradient); display:grid; place-items:center; color:white; box-shadow:0 4px 12px #516eff25; }
.profile-mark .icon { width:22px; }
.header-note strong { font-size:12px; display:block; }
.header-note small { font-size:10px; color:var(--muted); display:block; }
.page-shell { max-width:1500px; padding:18px 48px 0; margin:auto; }

/* Featured game carousel. */
.hero { height:300px; border-radius:16px; position:relative; overflow:hidden; background:linear-gradient(125deg,#154779,#66c9ef); box-shadow:0 10px 35px #4b8bb712; }
.hero-art { position:absolute; height:100%; width:100%; object-fit:cover; object-position:center 52%; animation:hero-reveal .4s ease; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,#06264fea 0%,#11416bd4 24%,#18517c55 47%,transparent 70%); }
.hero-copy { position:relative; z-index:2; color:white; padding:25px 62px; max-width:565px; }
.hero-copy h1 { margin:3px 0 0; font-size:60px; letter-spacing:-2px; font-weight:850; line-height:1.1; text-shadow:0 2px 12px #09295b20; }
.hero-copy h2 { font-size:17px; font-weight:750; margin:8px 0 4px; letter-spacing:-.15px; }
.hero-copy p { font-size:12px; line-height:1.6; max-width:335px; color:#e5efff; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hero-actions { display:flex; gap:12px; margin-top:15px; }
.hero .button-primary { border:1px solid #ffffff5c; box-shadow:inset 0 1px 3px #ffffff4a,0 4px 12px #132e6426; min-width:152px; }
.hero-save { background:#edf6ff; color:#1a3361; min-width:101px; border:1px solid #ffffff80; }
.hero-save .icon { color:#fd5397; width:19px; }
.hero-save.saved .icon { fill:#fd5397; }
.hero-meta { display:flex; gap:19px; margin-top:14px; font-size:10px; font-weight:550; color:#e0edff; white-space:nowrap; }
.hero-meta span { display:flex; align-items:center; gap:6px; }
.hero-meta .icon { width:14px; height:14px; }
.hero-arrow { position:absolute; top:50%; transform:translateY(-50%); height:30px; width:30px; background:#e5f3ffac; border-radius:50%; color:#285383; display:grid; place-items:center; z-index:3; transition:background .2s; }
.hero-arrow:hover { background:white; }
.hero-prev { left:10px; }
.hero-next { right:10px; }
.hero-arrow .icon { width:17px; height:17px; }
.hero-pagination { position:absolute; bottom:12px; left:50%; display:flex; gap:8px; z-index:3; }
.hero-dot { width:6px; height:6px; border-radius:50%; background:#ffffff60; padding:0; position:relative; }
.hero-dot:before { content:""; position:absolute; inset:-5px; }
.hero-dot.active { background:white; }
.hero-message { position:absolute; right:70px; top:35px; color:white; font-size:20px; text-align:center; transform:rotate(-10deg); text-shadow:0 2px 15px #1469b33d; line-height:1.8; letter-spacing:1px; }
.hero-message span,.hero-message strong { display:block; }
.hero-message strong { font-size:25px; }
.hero-message-line { width:90px; height:2px; background:#ffffffaa; margin:12px auto; transform:rotate(-8deg); }
.hero-loading { padding:30px 62px; color:white; }
.hero-loading h1 { font-size:42px; line-height:1.2; margin:16px 0; }
.hero-loading p { color:#d4eaff; }

/* Category filters and compact promotion. */
.discovery-bar { display:flex; align-items:center; gap:22px; margin:20px 0 18px; scroll-margin-top:96px; }
.category-list { display:flex; align-items:center; justify-content:space-between; gap:9px; flex:1; min-width:0; }
.category-chip { display:inline-flex; align-items:center; justify-content:center; gap:9px; white-space:nowrap; background:white; border-radius:25px; min-height:39px; padding:8px 18px; font-size:11px; font-weight:650; box-shadow:var(--shadow); transition:transform .2s,background .2s,color .2s; }
.category-chip:hover { transform:translateY(-2px); background:#eef2ff; }
.category-chip.selected { background:var(--gradient); color:white; box-shadow:0 6px 18px #5868ff22; }
.category-icon { display:flex; color:#1788ee; }
.category-icon .icon { width:20px; height:20px; }
.category-icon[data-color=Action] { color:#ff594f; }
.category-icon[data-color=Racing] { color:#00a4a4; }
.category-icon[data-color=Sports] { color:#243357; }
.category-icon[data-color=Puzzle] { color:#a74be6; }
.category-icon[data-color="2 Player"] { color:#3677ff; }
.category-icon[data-color=Arcade] { color:#02afa8; }
.category-icon[data-color="New Games"] { color:#ffb530; }
.category-chip.selected .category-icon { color:white; }
.mini-promo { display:flex; gap:12px; align-items:center; text-align:left; background:linear-gradient(105deg,#fceaff,#eeeaff); border-radius:13px; padding:9px 16px; min-height:47px; flex:0 0 270px; font-size:10px; transition:transform .2s; }
.mini-promo:hover { transform:translateY(-2px); }
.mini-promo strong,.mini-promo small { display:block; }
.mini-promo strong { font-weight:750; }
.mini-promo small { color:#8774b8; font-size:10px; }
.mini-promo>span:last-child { color:#9250f1; margin-left:auto; }
.gift-icon { color:#aa4aff; }
.gift-icon .icon { width:26px; height:26px; }

/* Reusable section headings and game cards. */
.catalog-status { font-size:12px; color:var(--muted); margin:0 0 16px; }
.catalog-status:empty { display:none; }
#games { scroll-margin-top:105px; outline:0; }
.game-section { margin-bottom:24px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:12px; min-height:27px; }
.section-heading-copy { display:flex; align-items:center; gap:10px; min-width:0; }
.section-heading h2 { font-size:21px; font-weight:800; letter-spacing:-.65px; line-height:1.3; margin:0; white-space:nowrap; }
.section-icon { display:flex; color:#5581ff; }
.section-icon .icon { width:23px; height:23px; }
.flame-icon .icon { fill:#ffc054; stroke:#ff683f; }
.new-icon { color:#3179ff; }
.clock-icon { color:#148cff; }
.section-subtitle { font-size:11px; color:var(--muted); margin-left:2px; }
.view-all { display:flex; align-items:center; gap:9px; font-size:11px; font-weight:550; color:#4160ff; background:transparent; padding:4px 0; white-space:nowrap; }
.view-all:hover { text-decoration:underline; }
.view-all .icon { width:16px; height:16px; }
.game-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:15px; }
.game-card { background:white; border-radius:12px; overflow:hidden; box-shadow:0 8px 20px #8299c210; transition:transform .22s,box-shadow .22s; min-width:0; }
.game-card:hover { transform:translateY(-4px); box-shadow:0 14px 28px #586aa51d; }
.card-art { position:relative; aspect-ratio:2.12; background:#eaf0f9; overflow:hidden; }
.card-cover { display:block; height:100%; width:100%; padding:0; background:none; }
.card-cover img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.game-card:hover .card-cover img { transform:scale(1.045); }
.card-cover:focus-visible { outline-offset:-4px; }
.card-play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:#0f20453d; opacity:0; transition:opacity .2s; color:white; }
.card-play .icon { width:32px; height:32px; fill:#ffffffd9; }
.card-cover:not(:disabled):hover .card-play,.card-cover:focus-visible .card-play { opacity:1; }
.favorite-button { position:absolute; right:7px; top:7px; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; color:white; background:#14284935; filter:drop-shadow(0 1px 1px #143b7570); transition:transform .2s,background .2s; }
.favorite-button .icon { width:20px; height:20px; stroke-width:2.4; }
.favorite-button:hover { transform:scale(1.12); background:#1b26476b; }
.favorite-button.saved .icon { color:#ff66a1; fill:#ff66a1; stroke:white; }
.card-info { position:absolute; bottom:6px; right:7px; display:grid; place-items:center; background:#1e305051; color:white; border-radius:50%; width:21px; height:21px; opacity:0; transition:opacity .2s; }
.game-card:hover .card-info,.card-info:focus-visible { opacity:1; }
.card-info .icon { width:15px; height:15px; }
.card-body { padding:8px 11px 9px; }
.game-name { display:block; background:none; padding:0; font-size:12px; line-height:1.4; font-weight:750; text-align:left; max-width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.game-name:hover { color:var(--blue); }
.game-category { color:var(--muted); font-size:10px; display:flex; gap:5px; align-items:center; margin-top:2px; }
.game-category .icon { height:11px; width:11px; stroke-width:1.7; }
.card-meta { display:flex; justify-content:space-between; gap:4px; margin-top:5px; font-size:10px; color:#7a89a6; white-space:nowrap; }
.card-meta>span { display:flex; align-items:center; gap:4px; }
.card-meta .icon { width:12px; height:12px; }
.game-status { color:#7482a2; }
.popular-status .icon { color:#ffae14; fill:#ffae14; stroke:#ffae14; }

/* Recent games, empty states and promotional card. */
.recent-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:18px; }
.recent-games { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; min-width:0; }
.horizontal-card { display:flex; min-height:89px; }
.horizontal-card .card-art { width:43%; aspect-ratio:auto; flex:none; }
.horizontal-card .card-body { padding:8px; flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center; }
.horizontal-card .game-name { font-size:10px; }
.horizontal-card .game-category { font-size:9px; }
.horizontal-card .card-meta { margin-top:auto; padding-top:12px; flex-direction:column; font-size:9px; gap:4px; }
.horizontal-card .favorite-button { width:20px; height:20px; top:4px; right:4px; }
.horizontal-card .favorite-button .icon { width:16px; height:16px; }
.recent-empty { grid-column:1/-1; display:flex; align-items:center; gap:17px; background:white; border:1px dashed #dce6f6; border-radius:14px; padding:17px 23px; min-height:100px; }
.recent-empty>.icon { height:33px; width:33px; color:#5093ff; padding:4px; border-radius:50%; background:#eff6ff; }
.recent-empty strong { font-size:13px; font-weight:650; }
.recent-empty p { font-size:11px; color:var(--muted); margin:4px 0 0; }
.text-button { margin-left:auto; display:flex; align-items:center; gap:8px; background:transparent; color:var(--blue); font-size:11px; white-space:nowrap; }
.text-button .icon { width:15px; }
.promo-card { position:relative; display:flex; align-items:center; gap:12px; border-radius:14px; background:linear-gradient(120deg,#e8e8ff,#f0eaff); padding:13px 18px; overflow:hidden; min-height:100px; }
.promo-gamepad { color:#4168ff; z-index:1; }
.promo-gamepad .icon { width:35px; height:35px; stroke-width:2.3; }
.promo-card>div { position:relative; z-index:1; }
.promo-card h3 { font-size:16px; letter-spacing:-.35px; line-height:1.1; margin:0; }
.promo-card p { font-size:9px; color:#777fa3; margin:4px 0 6px; }
.button-small { font-size:9px; padding:5px 14px; min-height:25px; border-radius:20px; gap:7px; }
.button-small .icon { width:12px; height:12px; fill:none; }
.promo-card>img { position:absolute; right:-30px; top:-15px; width:135px; height:135px; object-fit:cover; border-radius:50%; opacity:.45; mask-image:linear-gradient(90deg,transparent,#000); }
.empty-state { text-align:center; padding:45px 20px; background:white; border:1px solid var(--line); border-radius:16px; margin:10px 0 24px; }
.empty-state>.icon { height:35px; width:35px; color:#6983ff; }
.empty-state h3 { margin:12px 0 5px; font-size:20px; }
.empty-state p { color:var(--muted); font-size:13px; margin:0 0 18px; }
.site-footer { display:flex; align-items:center; gap:20px; padding:24px 0; border-top:1px solid #e5eaf4; font-size:11px; color:#8a95b0; }
.brand-small { font-size:18px; color:var(--ink); }
.footer-detail { margin-left:auto; }

/* Accessible game player and descriptions. */
dialog { border:0; border-radius:18px; padding:0; color:var(--ink); background:white; box-shadow:0 25px 100px #0a163b60; }
dialog::backdrop { background:#08182e9c; backdrop-filter:blur(7px); }
.player-dialog { width:min(var(--game-width,1000px),calc(100vw - 40px)); max-width:calc(100vw - 40px); max-height:calc(100dvh - 40px); }
.player-toolbar { display:flex; justify-content:space-between; align-items:center; padding:13px 18px; border-bottom:1px solid var(--line); gap:12px; }
.player-toolbar .eyebrow { font-size:8px; color:var(--muted); }
.player-toolbar h2 { font-size:17px; margin:1px 0; }
.player-tools { display:flex; gap:6px; }
.player-tools .icon { width:19px; height:19px; }
#player-frame { height:min(var(--game-height,650px),calc(100dvh - 122px)); background:#e8eff6; overflow:auto; }
#player-frame iframe { height:100%; width:100%; border:0; display:block; }
.player-dialog:fullscreen { max-height:100dvh; max-width:100vw; width:100vw; border-radius:0; }
.player-dialog:fullscreen #player-frame { height:calc(100dvh - 72px); }
.details-dialog { width:580px; max-width:calc(100vw - 36px); max-height:calc(100dvh - 40px); }
.details-close { position:absolute; top:10px; right:10px; background:#ffffffea; z-index:2; }
.details-art { height:200px; width:100%; object-fit:cover; }
.details-copy { padding:25px 30px 30px; }
.details-copy .eyebrow { color:var(--blue); font-size:9px; }
.details-copy h2 { font-size:28px; margin:8px 0 12px; letter-spacing:-.7px; }
.details-copy p { font-size:13px; color:#6c7a97; white-space:pre-line; line-height:1.8; margin:0 0 20px; }
.details-copy .unavailable-note { font-size:12px; background:#f5f7ff; padding:10px 14px; border-radius:8px; margin:0; }
@keyframes hero-reveal { from { opacity:.6; } to { opacity:1; } }

/* Tablet and mobile layouts. */
@media(min-width:1600px) {
  .header-inner,.page-shell { max-width:1540px; } .hero { height:330px; } .hero-copy { padding-top:36px; } .hero-copy h1 { font-size:67px; } .hero-actions,.hero-meta { margin-top:22px; } .card-art { aspect-ratio:2; } .section-heading h2 { font-size:23px; } .card-body { padding:10px 13px; } .game-name { font-size:13px; } .game-category,.card-meta { font-size:11px; } .game-section { margin-bottom:27px; }
}
@media(max-width:1350px) {
  .header-inner { gap:18px; padding:0 32px; } .primary-nav { gap:22px; margin-left:8px; } .header-note { display:none; } .page-shell { padding-left:32px; padding-right:32px; } .category-chip { padding:8px 14px; gap:7px; } .mini-promo { flex-basis:240px; padding:9px 12px; } .discovery-bar { gap:15px; } .recent-layout { grid-template-columns:minmax(0,1fr) 305px; } .hero-copy { padding-left:55px; } .card-meta { font-size:9px; gap:3px; }
}
@media(max-width:1150px) {
  .category-list { gap:8px; overflow:auto; justify-content:flex-start; padding:4px 0; scrollbar-width:none; } .category-list::-webkit-scrollbar { display:none; } .category-chip { padding:8px 16px; } .mini-promo { flex-basis:250px; } .primary-nav { gap:18px; } .primary-nav a { font-size:12px; } .brand { font-size:26px; } .header-inner { gap:16px; } .game-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .hero-copy h1 { font-size:55px; } .hero-message { right:45px; font-size:16px; } .hero-message strong { font-size:22px; } .recent-games { grid-template-columns:repeat(2,minmax(0,1fr)); } .recent-layout { grid-template-columns:minmax(0,1fr) 310px; } .section-subtitle { font-size:10px; } .card-meta { font-size:10px; }
}
@media(max-width:900px) {
  .header-inner { flex-wrap:wrap; min-height:104px; gap:0 18px; padding:14px 24px 0; } .brand { margin-right:auto; } .search-bar { flex:0 1 360px; margin-left:0; } .primary-nav { order:4; margin:9px 0 0; flex-basis:100%; justify-content:center; height:34px; gap:35px; } .primary-nav a { font-size:12px; } .primary-nav a.active:after { bottom:0; } .page-shell { padding:16px 24px 0; } .hero-copy { padding-left:43px; max-width:480px; } .hero-copy h1 { font-size:49px; } .hero-copy h2 { font-size:15px; } .hero-copy p { max-width:315px; } .hero-meta { gap:12px; font-size:9px; } .hero-message,.mini-promo { display:none; } .discovery-bar { margin:15px 0; } .category-list { gap:10px; } .section-heading h2 { font-size:20px; } .game-grid { gap:12px; } .recent-layout { grid-template-columns:minmax(0,1fr) 260px; gap:12px; } .promo-card { padding:13px; } .promo-gamepad { display:none; } .recent-empty { padding:16px; gap:12px; } .recent-empty .text-button,.section-subtitle { display:none; } .site-footer { font-size:10px; gap:12px; } .footer-detail { display:none; } .card-meta { font-size:9px; } .card-body { padding:8px 9px; } .game-name { font-size:11px; }
}
@media(max-width:650px) {
  html { scroll-padding-top:120px; } .header-inner { padding:13px 18px 12px; gap:10px; min-height:108px; } .brand { font-size:25px; } .header-favorites { order:2; } .search-bar { order:3; flex-basis:100%; max-width:none; padding:9px 13px; min-height:38px; } .search-bar input { font-size:12px; } .primary-nav { display:none; } .page-shell { padding:14px 16px 0; } .hero { height:306px; border-radius:15px; } .hero-art { object-position:62% center; } .hero-shade { background:linear-gradient(90deg,#082b57f0,#14446bb5 65%,#12364f20); } .hero-copy { padding:27px 32px; max-width:100%; } .hero-copy .eyebrow { font-size:9px; } .hero-copy h1 { font-size:42px; letter-spacing:-1.6px; margin-top:8px; } .hero-copy h2 { font-size:13px; margin-top:10px; max-width:265px; } .hero-copy p { font-size:11px; max-width:260px; line-height:1.65; margin-top:5px; } .hero-actions { margin-top:18px; gap:9px; } .hero .button-primary { min-width:130px; } .button { font-size:11px; padding:10px 17px; min-height:38px; } .hero-save { min-width:86px; } .hero-meta { gap:12px; margin-top:19px; flex-wrap:wrap; max-width:270px; font-size:8px; } .hero-meta span { gap:4px; } .hero-meta .icon { width:12px; height:12px; } .hero-arrow { height:25px; width:25px; } .hero-prev { left:5px; } .hero-next { right:5px; } .hero-pagination { bottom:10px; left:calc(50% - 18px); } .category-chip { font-size:10px; min-height:36px; padding:7px 14px; } .category-chip .icon { height:17px; width:17px; } .discovery-bar { margin:13px -1px 17px; } .game-section { margin-bottom:24px; } .section-heading { gap:8px; margin-bottom:10px; } .section-heading-copy { gap:7px; } .section-heading h2 { font-size:19px; letter-spacing:-.5px; } .section-icon .icon { height:21px; width:21px; } .view-all { font-size:10px; gap:5px; } .view-all .icon { height:13px; width:13px; } .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px 11px; } .card-art { aspect-ratio:1.75; } .card-body { padding:9px 10px 10px; } .game-name { font-size:12px; } .game-category { font-size:10px; } .card-meta { font-size:9px; margin-top:6px; } .game-card { border-radius:11px; } .card-info { opacity:1; } .favorite-button { width:25px; height:25px; } .recent-layout { grid-template-columns:1fr; } .recent-games { grid-template-columns:repeat(2,minmax(0,1fr)); } .recent-empty { min-height:98px; gap:14px; } .recent-empty strong { font-size:12px; } .recent-empty p { font-size:11px; } .promo-card { padding:18px 24px; gap:18px; } .promo-gamepad { display:block; } .promo-card h3 { font-size:20px; } .promo-card p { font-size:11px; } .button-small { font-size:10px; min-height:28px; padding:5px 16px; } .promo-card>img { width:180px; height:180px; right:0; top:-10px; } .site-footer { flex-wrap:wrap; justify-content:space-between; padding:22px 0; } .site-footer .brand { font-size:18px; margin:0; } .details-copy { padding:20px; } .details-art { height:160px; } .details-copy h2 { font-size:24px; } .player-dialog { width:calc(100vw - 16px); max-width:calc(100vw - 16px); max-height:calc(100dvh - 16px); } .player-toolbar { padding:10px 12px; } .player-toolbar h2 { font-size:14px; } .player-tools { gap:0; } .player-tools .icon-button { min-width:32px; height:32px; } .empty-state { padding:35px 15px; } .empty-state h3 { font-size:18px; } .results-section .view-all { font-size:9px; } .results-section .section-heading h2 { font-size:18px; } .hero-loading { padding:30px; } .hero-loading h1 { font-size:35px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; } .game-card:hover,.button:hover,.category-chip:hover { transform:none; }
}