/* Hallmark: redesign; brand: GRIMCAT; scope: storefront and account; navigation: horizontal. */
/* Critique: remove the displaced rail, repetitive framing and unreadable animated ground. */
/* Existing PHP flows retained; catalog density takes precedence over full-screen marketing sections. */
:root{
  --metal-font-ui:"Segoe UI",system-ui,sans-serif;
  --metal-canvas:#0c0d10;
  --metal-panel:#15171c;
  --metal-ink:#eef0f4;
  --metal-muted:#a0a5b1;
  --metal-tone-05:#ffffff16;
  --metal-brand:#df4553;
  --metal-tone-07:#b73543;
  --metal-tone-08:#cbd6ed;
  --metal-tone-09:#42454c66;
  --metal-tone-10:#202329;
  --metal-tone-11:#0d0e11;
  --metal-tone-12:#090a0e90;
  --metal-tone-13:#0c0d10ba;
  --metal-tone-14:#0c0d1070;
  --metal-tone-15:#aab0bb;
  --metal-tone-16:#12151bb3;
  --metal-tone-17:#ffffff17;
  --metal-tone-18:#fff;
  --metal-tone-19:#ffffff38;
  --metal-tone-20:#f2f3f6;
  --metal-tone-21:#cdd2dc;
  --metal-tone-22:#16181d;
  --metal-tone-23:#e1e5ed;
  --metal-tone-24:#fff8;
  --metal-tone-25:#0002;
  --metal-tone-26:#ffffff14;
  --metal-tone-27:#ffffff05;
  --metal-tone-28:#ffffff22;
  --metal-tone-29:#dde1e9;
  --metal-tone-30:#ffffff08;
  --metal-tone-31:#ffffff0c;
  --metal-tone-32:#ffffff45;
  --metal-tone-33:#0d0f14c9;
  --metal-tone-34:#ffffff28;
  --metal-tone-35:#edf0f5;
  --metal-tone-36:#a8b6d0;
  --metal-tone-37:#a8b6d012;
  --metal-tone-38:#171a21;
  --metal-tone-39:#d0d4de;
  --metal-tone-40:#7f8796;
  --metal-tone-41:#20242bba;
  --metal-tone-42:#15171de8;
  --metal-tone-43:#ffffff1c;
  --metal-tone-44:#ffffff06;
  --metal-tone-45:#00000014;
  --metal-tone-46:#c8cfdd;
  --metal-tone-47:#eceff5;
  --metal-tone-48:#a2a8b5;
  --metal-tone-49:#adb5c3;
  --metal-tone-50:#27262c;
  --metal-tone-51:#6b616d;
  --metal-tone-52:#f2eaf0;
  --metal-tone-53:#a94a55;
  --metal-tone-54:#371d24;
  --metal-tone-55:#90deba;
  --metal-tone-56:#ffffff21;
  --metal-tone-57:#ffffff09;
  --metal-tone-58:#0a0c1033;
  --metal-tone-59:#919bab;
  --metal-tone-60:#ffffff20;
  --metal-tone-61:#101218;
  --metal-tone-62:#a6afbd;
  --metal-tone-63:#e8ebf2;
  --metal-tone-64:#181b23;
  --metal-tone-65:#10131999;
  --metal-tone-66:#ffffff1e;
  --metal-tone-67:#161a20c9;
  --metal-tone-68:#a9b7ce;
  --metal-tone-69:#2c3039b3;
  --metal-tone-70:#11151cf5;
  --metal-tone-71:#aab3c3;
  --metal-tone-72:#f2f5fa;
  --metal-tone-73:#a3b3cf4d;
  --metal-tone-74:#c3d1eb;
  --metal-tone-75:#eef2f9;
  --metal-tone-76:#a8b2c2;
  --metal-tone-77:#13171e;
  --metal-tone-78:#ffffff12;
  --metal-tone-79:#252c37b0;
  --metal-tone-80:#14171de8;
  --metal-tone-81:#ffffff24;
  --metal-tone-82:#eef3fb;
  --metal-tone-83:#d8e0ee;
  --metal-tone-84:#181d26de;
  --metal-tone-85:#ffffff25;
  --metal-tone-86:#0005;
  --metal-tone-87:#0d0f13e8;
  --metal-tone-88:#9da4b0;
  --metal-tone-89:#ffffff18;
  --metal-tone-90:#ffffff03;
  --metal-tone-91:#bfc5ce;
  --metal-tone-92:#363c46;
  --metal-tone-93:#171a20;
  --metal-tone-94:#2a303a;
  --metal-tone-95:#c2ccdc;
  --metal-tone-96:#8e97a6;
  --metal-tone-97:#c4cbd7;
  --metal-tone-98:#0c0d1099;
  --metal-tone-99:#0c0d1033;
  --metal-tone-100:#0c0d1000;
  --metal-tone-101:#69727e;
  --metal-tone-102:#171b22;
  --metal-tone-103:#090b10;
  --metal-tone-104:#858b95;
  --metal-tone-105:#191c22f5;
  --metal-tone-106:#121419fa;
  --metal-tone-107:#ffffff04;
  --metal-tone-108:#f0f2f6;
  --metal-tone-109:#a6aebb;
  --metal-tone-110:#a6afbc;
  --metal-tone-111:#11141ad9;
  --metal-tone-112:#ffffff35;
  --metal-tone-113:#14171d;
  --metal-tone-114:#e2e6ed;
  --metal-tone-115:#0000000c;
  --metal-tone-116:#363d48;
  --metal-tone-117:#e2e6ee;
  --metal-tone-118:#939dab;
  --metal-tone-119:#14171df5;
  --metal-tone-120:#ffffff1a;
  --metal-tone-121:#11141a;
  --metal-tone-122:#a1a9b6;
  --metal-tone-123:#ffffff0f;
  --metal-tone-124:#a8b1c0;
  --metal-tone-125:#a2abba;
  --metal-tone-126:#0d0f14;
  --metal-tone-127:#0004;
  --metal-tone-128:#9ba8bd;
  --metal-tone-129:#14171be6;
  --metal-tone-130:#11141bf2;
  --metal-tone-131:#a3acbb;
  --metal-tone-132:#edf0f6;
  --metal-tone-133:#14171bf2;
  --metal-tone-134:#15181ef5;
  --metal-tone-135:#0f1218;
  --metal-tone-136:#14171df2;
  --metal-tone-137:#b0b8c5;
  --metal-tone-138:#11141be6;
  --metal-tone-139:#0b0d11;
  --metal-tone-140:#8f98a8;
  --metal-tone-141:#7e8898;
  --metal-tone-142:#ccd4e1;
  --metal-tone-143:#dc4654;
}
html,body{overflow-x:clip}
h1,h2,h3{overflow-wrap:break-word;min-width:0}
.metal-ui{--bg:var(--metal-canvas);--panel:var(--metal-panel);--text:var(--metal-ink);--muted:var(--metal-muted);--border:var(--metal-tone-05);--red:var(--metal-brand);--deep:var(--metal-tone-07);background:var(--metal-canvas);color:var(--text);font-family:var(--metal-font-ui);color-scheme:dark;isolation:isolate}
.metal-ui *{box-sizing:border-box}
.metal-ui a,.metal-ui button,.metal-ui input,.metal-ui select{ -webkit-tap-highlight-color:transparent }
.metal-ui :focus-visible{outline:2px solid var(--metal-tone-08);outline-offset:4px}
.metal-background{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 95% 8%,var(--metal-tone-09),transparent 45%),linear-gradient(115deg,var(--metal-canvas) 35%,var(--metal-tone-10) 69%,var(--metal-tone-11) 90%)}
.metal-background::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--metal-tone-12),var(--metal-tone-13) 28%,var(--metal-tone-14)),linear-gradient(0deg,var(--metal-canvas) 0%,transparent 85%)}
.metal-background canvas{width:100%;height:100%;display:block;opacity:0;transition:opacity .5s}
.metal-background canvas.is-ready{opacity:.72}
.metal-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:9px 12px;min-height:36px;color:var(--metal-tone-15);font-family:inherit;font-size:11px;font-weight:500;line-height:1.4;background:var(--metal-tone-16);border:1px solid var(--metal-tone-17);border-radius:9px;cursor:pointer;box-shadow:none}
.metal-toggle[hidden]{display:none}.metal-toggle:hover{color:var(--metal-tone-18);border-color:var(--metal-tone-19)}
.metal-toggle[aria-pressed="false"] svg{opacity:.45}
.metal-ui:not(.storefront-shell)>.metal-toggle{position:fixed;right:18px;bottom:14px;z-index:25}
.metal-ui .button,.metal-ui button.primary{border-radius:10px;box-shadow:none;min-height:44px;font-weight:600;letter-spacing:0;transition:background .18s,border-color .18s,box-shadow .18s}
.metal-ui .button:not(.secondary):not(.quiet):not(.danger):not(:disabled),.metal-ui .primary:not(:disabled){background:linear-gradient(175deg,var(--metal-tone-20),var(--metal-tone-21));color:var(--metal-tone-22);border:1px solid var(--metal-tone-23);box-shadow:inset 0 1px var(--metal-tone-24),0 3px 12px var(--metal-tone-25)}
.metal-ui .button:not(.secondary):not(.quiet):not(.danger):not(:disabled):hover,.metal-ui .primary:not(:disabled):hover{background:var(--metal-tone-18);border-color:var(--metal-tone-18);color:var(--metal-canvas);box-shadow:0 3px 20px var(--metal-tone-26);transform:none;filter:none}
.metal-ui .button.secondary:not(:disabled),.metal-ui button.secondary:not(:disabled){background:var(--metal-tone-27);border:1px solid var(--metal-tone-28);color:var(--metal-tone-29);box-shadow:inset 0 1px var(--metal-tone-30)}
.metal-ui .button.secondary:not(:disabled):hover,.metal-ui button.secondary:not(:disabled):hover{background:var(--metal-tone-31);border-color:var(--metal-tone-32);box-shadow:none;transform:none;filter:none}
.metal-ui button:disabled,.metal-ui .button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.metal-ui input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),.metal-ui textarea,.metal-ui select{background:var(--metal-tone-33);border:1px solid var(--metal-tone-34);border-radius:10px;color:var(--metal-tone-35);padding:13px 15px;min-height:48px;box-shadow:inset 0 1px 3px var(--metal-tone-25)}
.metal-ui input:focus-visible,.metal-ui textarea:focus-visible,.metal-ui select:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.metal-ui select option{background:var(--metal-tone-38);color:var(--metal-tone-35)}
.metal-ui label{color:var(--metal-tone-39)}.metal-ui input::placeholder{color:var(--metal-tone-40)}
.metal-ui .card,.metal-ui .metrics>article,.metal-ui .credit-pack,.metal-ui .purchase-order,.metal-ui .rs-wallet{background:linear-gradient(135deg,var(--metal-tone-41),var(--metal-tone-42));border:1px solid var(--metal-tone-43);border-radius:16px;box-shadow:inset 0 1px var(--metal-tone-44),0 14px 38px var(--metal-tone-45)}
.metal-ui .text-link,.metal-ui .back-link{color:var(--metal-tone-46)}.metal-ui .text-link:hover,.metal-ui .back-link:hover{color:var(--metal-tone-18)}
.metal-ui h1,.metal-ui h2,.metal-ui h3{color:var(--metal-tone-47)}.metal-ui .eyebrow{letter-spacing:0;font-size:13px;font-weight:600;color:var(--metal-tone-48)}
.metal-ui .red{color:var(--metal-tone-49)}.metal-ui .notice{background:var(--metal-tone-50);border-color:var(--metal-tone-51);color:var(--metal-tone-52)}.metal-ui .notice.error{border-color:var(--metal-tone-53);background:var(--metal-tone-54)}
.metal-ui .status.available,.metal-ui .badge.good{color:var(--metal-tone-55)}.metal-ui .status.available i{background:var(--metal-tone-55);box-shadow:none}

.storefront-shell .auth-page{max-width:1180px;display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.25fr);column-gap:60px;align-items:start;padding-top:52px;min-height:720px}
.auth-identity{grid-column:1;grid-row:1/6;align-self:stretch;min-height:600px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:26px;border-radius:18px;border:1px solid var(--metal-tone-56);background:linear-gradient(145deg,var(--metal-tone-57),var(--metal-tone-58));box-shadow:inset 0 1px var(--metal-tone-57)}
.auth-identity img{width:112px;height:112px}.auth-identity strong{font-size:21px;font-weight:500;letter-spacing:.4px}
.auth-page>.eyebrow,.auth-page>h1,.auth-page>.notice,.auth-page>.auth-card{grid-column:2}.auth-page>.eyebrow{margin-top:26px}
.storefront-shell .auth-page>h1{font-size:35px;margin:12px 0 30px;letter-spacing:-1.3px;line-height:1.15}
.storefront-shell .auth-page .auth-card{padding:0;background:none;border:0;box-shadow:none;margin:0}.auth-page .auth-card h2{font-size:20px;font-weight:500;margin:27px 0 22px}.auth-page .auth-card p{font-size:12px;line-height:1.7;color:var(--metal-tone-59)}
.auth-page .auth-tabs{display:flex;gap:6px;padding:5px;border:1px solid var(--metal-tone-60);border-radius:12px;background:var(--metal-tone-61);overflow:hidden}
.auth-page .auth-tabs a{flex:1;text-align:center;padding:11px 8px;background:transparent;border:1px solid transparent;border-radius:8px;font-size:13px;color:var(--metal-tone-62)}
.auth-page .auth-tabs a.active{background:var(--metal-tone-63);border-color:var(--metal-tone-24);color:var(--metal-tone-64)}.auth-page .auth-card input{font-size:15px;min-height:52px}.auth-page .auth-card .button.full{margin-top:12px;min-height:49px}
/* Detail pages: media and description on the left, plans on the right. */
.storefront-shell .detail-heading{margin:26px 0 32px;align-items:end}.storefront-shell .detail-heading h1{margin:9px 0 17px}.storefront-shell .product-heading-actions{display:flex;gap:20px;align-items:center}.storefront-shell .product-help-links{font-size:12px}
.product-stage{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.85fr);gap:28px;align-items:start}
.product-media-column{min-width:0}.product-media-column .product-about{margin-top:24px}.product-media-column .product-about h2{font-size:22px}
.product-plan-column{min-width:0;position:sticky;top:24px}.product-plan-column .purchase-card{padding:26px;margin:0}.product-plan-column .purchase-card h2{font-size:24px;letter-spacing:-.5px}
.product-stage .detail-art{height:370px;border-radius:17px}.product-stage .video-player{border-radius:17px;overflow:hidden}
.product-stage .purchase-plan{flex-wrap:wrap;background:var(--metal-tone-65);border-color:var(--metal-tone-66);padding:18px;border-radius:12px}.product-stage .purchase-plan form{flex-basis:100%}.product-stage .purchase-plan .button{width:100%}
.product-stage .payment-tile{height:35px;max-width:66px;font-size:14px;border-radius:5px}.product-stage .payment-grid{gap:7px}
.product-reference-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.85fr);gap:28px;margin-top:28px;align-items:start}
.product-reference-grid .product-functions{width:auto;position:static;background:none;border:0;padding:0}.product-reference-grid .product-functions h2{font-size:21px;font-weight:500;margin-top:0}
.product-reference-grid .product-feature-group{background:var(--metal-tone-67);border:1px solid var(--metal-tone-43);border-radius:12px;overflow:hidden;margin-bottom:12px}
.product-reference-grid .product-help-grid{display:grid;grid-template-columns:1fr;gap:20px;align-content:start}.product-reference-grid .product-help-card{padding:24px;margin:0}.product-reference-grid .product-help-card h2{font-size:19px}
.metal-ui .feature-list li::marker,.metal-ui .steps li::marker{color:var(--metal-tone-68)}

/* Administration shares the same controls and surfaces. */
.metal-ui.workspace{background:transparent}.metal-ui.workspace>aside{background:linear-gradient(155deg,var(--metal-tone-69),var(--metal-tone-70));backdrop-filter:blur(16px);border-color:var(--metal-tone-60)}
.metal-ui.workspace>aside nav a{border-radius:10px;color:var(--metal-tone-71)}.metal-ui.workspace>aside nav a.active{background:var(--metal-tone-57);color:var(--metal-tone-72);border:1px solid var(--metal-tone-73);box-shadow:inset 2px 0 var(--metal-tone-74)}
.metal-ui.workspace>main>header{border-color:var(--metal-tone-60)}.metal-ui.workspace .metrics>article>strong{font-weight:500;color:var(--metal-tone-75)}.metal-ui.workspace th{color:var(--metal-tone-76);background:var(--metal-tone-77)}.metal-ui.workspace td{border-color:var(--metal-tone-78)}
.metal-ui.workspace .rs-hero{background:linear-gradient(130deg,var(--metal-tone-79),var(--metal-tone-80));border-color:var(--metal-tone-81)}.metal-ui.workspace .rs-tabs{border-color:var(--metal-tone-60)}.metal-ui.workspace .rs-tabs a.active{color:var(--metal-tone-82);border-color:var(--metal-tone-83)}
.metal-ui.login-page{background:transparent}.metal-ui.login-page .login-card{background:var(--metal-tone-84);backdrop-filter:blur(14px);border:1px solid var(--metal-tone-85);border-radius:20px;box-shadow:0 30px 90px var(--metal-tone-86)}

/* Public shell: horizontal navigation and a centered reading area. */
.storefront-shell { padding:0; font-size:15px; line-height:1.6 }
.storefront-shell .container { width:100%; max-width:1240px; margin-inline:auto; padding-inline:32px }
.storefront-shell .site-header { position:sticky; inset:0 0 auto; z-index:40; width:100%; height:auto; border:0; border-bottom:1px solid var(--metal-tone-78); border-radius:0; background:var(--metal-tone-87); backdrop-filter:blur(20px); box-shadow:none }
.storefront-shell .site-header .nav { display:flex; flex-direction:row; align-items:center; gap:30px; min-height:84px; padding-block:15px }
.storefront-shell .site-header .brand { display:flex; align-items:center; gap:10px; flex:none; padding:0; margin:0; font-size:17px; font-weight:700; letter-spacing:.5px; line-height:1; grid-area:auto }
.storefront-shell .site-header .brand img { width:34px; height:38px }
.storefront-shell .nav-links { display:flex; flex-direction:row; align-items:center; justify-content:center; gap:4px; flex:1; min-width:0; width:auto; margin:0; grid-area:auto }
.storefront-shell .nav-links>a,.storefront-shell .nav-links>a:first-child { display:flex; align-items:center; justify-content:center; gap:8px; flex:none; width:auto; min-height:40px; padding:9px 13px; border:1px solid transparent; border-radius:8px; background:none; box-shadow:none; color:var(--metal-tone-88); font-size:13px; font-weight:500; white-space:nowrap }
.storefront-shell .nav-links>a:hover { color:var(--metal-tone-18); background:var(--metal-tone-44) }
.storefront-shell .nav-links>a[aria-current="page"] { background:var(--metal-tone-30); color:var(--metal-tone-18); border-color:var(--metal-tone-89); box-shadow:none }
.storefront-shell .nav-links svg { display:none }
.storefront-shell .site-header .nav-links>a { display:flex!important }
.storefront-shell .nav-links .nav-account { margin:0; padding:9px 13px }
.storefront-shell .nav-account-name { max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.storefront-shell .nav-footer { display:flex; gap:8px; align-items:center; flex:none; margin:0; padding:0; border:0 }
.nav-panel { display:contents }
.nav-toggle { display:none }
.storefront-shell .language-picker { position:relative; margin:0; font-size:11px }
.storefront-shell .language-picker>summary { min-height:36px; padding:7px 9px; border:1px solid var(--metal-tone-89); border-radius:8px; background:var(--metal-tone-90); color:var(--metal-tone-91) }
.storefront-shell .language-options { top:calc(100% + 12px); bottom:auto; left:auto; right:0; width:190px; border-color:var(--metal-tone-92); background:var(--metal-tone-93) }
.storefront-shell .language-options a[aria-current="true"] { background:var(--metal-tone-94); box-shadow:inset 2px 0 var(--metal-tone-95) }
.storefront-shell .metal-toggle { display:inline-flex; width:36px; height:36px; min-height:36px; padding:9px; border-radius:8px; background:var(--metal-tone-90) }
.storefront-shell .metal-toggle[hidden] { display:none }
.storefront-shell .metal-toggle span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
.metal-toggle[aria-pressed="false"] svg { opacity:1 }
.metal-play-icon { display:none }
.metal-toggle[aria-pressed="false"] .metal-play-icon { display:block }
.metal-toggle[aria-pressed="false"] .metal-pause-icon { display:none }
.storefront-shell .inner-page { padding-top:48px; padding-bottom:64px }
.storefront-shell .inner-page h1 { font-size:clamp(32px,4vw,46px); letter-spacing:-1.7px; font-weight:600; line-height:1.15 }
.storefront-shell h2 { font-weight:600; letter-spacing:-.6px }
.storefront-shell .eyebrow { color:var(--metal-tone-96); letter-spacing:0; font-size:13px; text-transform:lowercase }
.storefront-shell .eyebrow::first-letter { text-transform:uppercase }
.storefront-shell .inner-page>.eyebrow { display:none }
.storefront-shell .text-link,.storefront-shell .back-link { color:var(--metal-tone-97) }
.storefront-shell .text-link:hover { color:var(--metal-tone-18) }
.storefront-shell [id] { scroll-margin-top:110px }

/* Chrome stays in the margins; solid surfaces protect content contrast. */
.metal-background { inset:0; z-index:-1; background:var(--metal-canvas) }
.metal-background canvas { position:absolute; inset:0; width:100%; height:100%; opacity:0 }
.metal-background canvas.is-ready { opacity:.35 }
.metal-background::after { background:radial-gradient(ellipse at 50% 35%,var(--metal-tone-98) 0%,var(--metal-tone-99) 65%),linear-gradient(0deg,var(--metal-canvas) 2%,var(--metal-tone-100) 90%) }
.metal-background::before { content:""; position:absolute; inset:-25%; opacity:.28; background:repeating-conic-gradient(from 35deg at 35% 60%,var(--metal-canvas) 0deg,var(--metal-tone-101) 22deg,var(--metal-tone-102) 37deg,var(--metal-tone-103) 58deg,var(--metal-tone-104) 75deg,var(--metal-canvas) 90deg); filter:blur(32px); transform:rotate(-8deg) scale(1.1); animation:metal-drift 22s ease-in-out infinite alternate; animation-play-state:paused }
.metal-background[data-renderer="webgl"]::before { display:none }
.metal-background[data-renderer="css"][data-motion="running"]::before { animation-play-state:running }
@keyframes metal-drift { to { transform:rotate(12deg) scale(1.3) translate3d(4%,-3%,0) } }
.metal-ui .card,.metal-ui .credit-pack,.metal-ui .purchase-order { background:linear-gradient(140deg,var(--metal-tone-105),var(--metal-tone-106)); border-color:var(--metal-tone-05); box-shadow:inset 0 1px var(--metal-tone-107); border-radius:14px }

/* Catalog: one horizontal game selector, then a clean grid of products. */
.store-intro { display:block; padding-top:58px; padding-bottom:38px; min-height:0; max-width:1240px }
.store-intro h1 { margin:12px 0 16px; font-size:clamp(36px,4.4vw,54px); line-height:1.1; letter-spacing:-2px; font-weight:600; color:var(--metal-tone-108); background:none }
.store-intro p { max-width:700px; margin:0; line-height:1.75; font-size:15px; color:var(--metal-tone-109) }
.store-intro .eyebrow { font-size:10px }
.storefront-shell .catalog-section { padding-top:0; padding-bottom:56px; max-width:1240px }
.catalog-workspace { display:block }
.catalog-filter { position:static; margin-bottom:30px }
.catalog-filter>h2 { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
.storefront-shell .game-category-nav { display:flex; flex-direction:row; flex-wrap:wrap; gap:8px; overflow:visible; border:0; padding:0; margin:0 }
.storefront-shell .game-category-nav a { display:flex; align-items:center; gap:14px; padding:11px 17px; border:1px solid var(--metal-tone-05); border-radius:9px; color:var(--metal-tone-110); background:var(--metal-tone-111); font-size:13px; font-weight:500 }
.storefront-shell .game-category-nav a:hover { color:var(--metal-tone-18); border-color:var(--metal-tone-112) }
.storefront-shell .game-category-nav a[aria-selected="true"] { color:var(--metal-tone-113); background:var(--metal-tone-114); border-color:var(--metal-tone-114); box-shadow:none }
.storefront-shell .game-category-nav a::after { display:none }
.storefront-shell .category-count { background:var(--metal-tone-30); border:0; padding:2px 6px; border-radius:4px; color:inherit; font-size:10px }
.storefront-shell .game-category-nav a[aria-selected="true"] .category-count { background:var(--metal-tone-115); color:var(--metal-tone-116) }
.storefront-shell .game-section-heading { display:flex; align-items:baseline; justify-content:space-between; border:0; padding:0; margin:0 0 16px }
.storefront-shell .game-section-heading>p { font-size:19px; font-weight:600; color:var(--metal-tone-117); margin:0 }
.storefront-shell .game-section-heading>span { font-size:12px; color:var(--metal-tone-118) }
.storefront-shell .product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px }
.storefront-shell .catalog-section .product-card { background:var(--metal-tone-119); border:1px solid var(--metal-tone-120); border-radius:14px; overflow:hidden; box-shadow:0 12px 30px var(--metal-tone-25); transition:border-color .2s }
.storefront-shell .catalog-section .product-card:hover { transform:none; border-color:var(--metal-tone-19) }
.storefront-shell .catalog-section .product-art { height:auto; aspect-ratio:2.15; border:0; background:var(--metal-tone-121); overflow:hidden }
.storefront-shell .catalog-section .product-art::after { background:linear-gradient(0deg,var(--metal-tone-113),transparent 45%) }
.storefront-shell .catalog-section .product-body { padding:7px 26px 24px }
.storefront-shell .catalog-section .product-body h3 { margin:12px 0 10px; min-height:0; font-size:24px; line-height:1.25; letter-spacing:-.65px; font-weight:600 }
.storefront-shell .catalog-section .product-body>p { font-size:14px; color:var(--metal-tone-122); line-height:1.65; min-height:0; margin:0 }
.storefront-shell .catalog-card-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:20px; margin-top:22px; border-top:1px solid var(--metal-tone-123) }
.storefront-shell .catalog-card-footer .button.full { width:auto; min-width:165px; padding-inline:20px; font-size:13px }
.storefront-shell .catalog-video-link { display:inline-flex; align-items:center; gap:8px; padding:0; font-size:12px; color:var(--metal-tone-124); text-decoration:none }
.storefront-shell .catalog-video-link:hover { color:var(--metal-tone-18) }
.storefront-shell .catalog-video-link svg { width:14px; height:14px }
.desktop-section { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:56px; align-items:center; padding:48px 0; border-top:1px solid var(--metal-tone-26) }
.desktop-section h2 { margin:14px 0; font-size:34px; line-height:1.15; letter-spacing:-1px }
.desktop-section p { color:var(--metal-tone-125); font-size:14px; line-height:1.8 }
.desktop-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:24px }
.desktop-actions a { font-size:13px }
.desktop-section figure { margin:0; padding:6px; border-radius:14px; border:1px solid var(--metal-tone-43); background:var(--metal-tone-126); box-shadow:0 20px 50px var(--metal-tone-127) }
.desktop-section img { display:block; width:100%; height:auto; border-radius:9px }
.home-community-link { font-size:12px; color:var(--metal-tone-128) }
.home-community-pending { margin-top:20px }
.storefront-shell .account-callout { padding:28px 32px; margin:16px 0 40px; border:1px solid var(--metal-tone-05); border-radius:14px; background:var(--metal-tone-129) }
.storefront-shell .account-callout h2 { font-size:24px; margin:8px 0 }

/* Account tabs use the same horizontal rhythm as the public navigation. */
.storefront-shell .member-page { display:block; max-width:1240px }
.member-workspace { display:block }
.member-content { min-width:0 }
.member-workspace>.member-menu { display:flex; flex-wrap:wrap; gap:4px; position:static; padding:6px; margin:0 0 28px; border:1px solid var(--metal-tone-78); border-radius:10px; background:var(--metal-tone-130) }
.member-workspace>.member-menu a { flex:none; padding:10px 18px; font-family:inherit; font-size:13px; font-weight:500; color:var(--metal-tone-131); border:1px solid transparent; border-radius:6px; background:none }
.member-workspace>.member-menu a[aria-current="page"] { color:var(--metal-tone-132); background:var(--metal-tone-30); border-color:var(--metal-tone-78); box-shadow:none }
.member-page .member-toolbar { border-color:var(--metal-tone-05); border-radius:12px; background:var(--metal-tone-133) }
.member-page .member-panel { background:var(--metal-tone-134); border:1px solid var(--metal-tone-05); border-radius:14px; padding:26px; box-shadow:none }
.member-page .member-access { margin:24px 0 }
.member-page #licenses { display:grid; gap:12px; margin-top:20px }
.member-page .license { margin:0; padding:20px; border:1px solid var(--metal-tone-78); border-radius:10px; background:var(--metal-tone-135) }
.member-page .countdown { font-size:21px; font-weight:500; letter-spacing:-.4px; font-variant-numeric:tabular-nums }
.member-page .credit-balance { margin:0; padding:26px }
.member-page .credit-balance strong { font-weight:600; letter-spacing:-.6px }

/* Wallet: prices remain grouped; opaque cards isolate them from the metal. */
.storefront-shell .credits-page { display:block }
.credits-workspace { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr); gap:32px; align-items:start }
.credits-workspace>.credits-packs { position:sticky; top:110px; margin:0 }
.credits-page .credits-section-head { display:block; min-height:100px; margin-bottom:20px }
.credits-page .credits-section-head>p { margin:10px 0 0; text-align:left; max-width:500px; font-size:13px; line-height:1.7 }
.credits-page .credits-section-head h2 { margin-top:8px; font-size:26px }
.credits-page .credit-grid { grid-template-columns:1fr; gap:18px }
.credits-page .credit-game { background:var(--metal-tone-136); border:1px solid var(--metal-tone-05); border-radius:14px; overflow:hidden }
.credits-page .credit-game-head,.credits-page .credit-product-head { background:none; border-color:var(--metal-tone-78) }
.credits-page .credit-product { background:none; border-color:var(--metal-tone-78) }
.credits-page .credit-plan { background:none; border:0; border-left:1px solid var(--metal-tone-78); border-radius:0 }
.credits-page .credit-pack { padding:24px }
.credits-page .credit-pack h3 { font-size:15px; letter-spacing:0 }
.credits-page .credit-pack-footer { border-color:var(--metal-tone-78) }
.credits-page .credit-how { border-color:var(--metal-tone-05); background:var(--metal-tone-129); border-radius:12px }

/* Details, help, status and download share the same surface density. */
.product-plan-column { top:110px }
.product-stage .purchase-card { background:var(--metal-tone-134); border-color:var(--metal-tone-05); border-radius:14px }
.product-reference-grid.without-features { display:block }
.without-features>.product-functions { display:none }
.without-features .product-help-grid { grid-template-columns:1fr 1fr; gap:24px }
.product-stage .purchase-methods { flex-basis:100%; width:100% }
.storefront-shell .status-page .loader-status-card { background:var(--metal-tone-134); border-color:var(--metal-tone-05); border-radius:14px }
.storefront-shell .status-page .loader-status-item { background:var(--metal-tone-135); border-color:var(--metal-tone-78); border-radius:9px }
.storefront-shell .status-product-list { background:var(--metal-tone-134); border-color:var(--metal-tone-05); border-radius:12px }
.storefront-shell .status-product { border-color:var(--metal-tone-78) }
.storefront-shell .status-category-heading h2 { font-size:28px }
.storefront-shell .help-heading { margin-bottom:40px }
.storefront-shell .help-layout { gap:44px }
.storefront-shell .help-step { padding-block:32px; border-color:var(--metal-tone-05) }
.storefront-shell .help-index { top:110px; border-color:var(--metal-tone-05) }
.storefront-shell .help-guide p,.storefront-shell .help-guide li { color:var(--metal-tone-137) }
.storefront-shell .download-store { padding-top:48px; padding-bottom:48px }
.storefront-shell .download-store h1 { font-size:clamp(34px,4vw,48px); font-weight:600; letter-spacing:-1.5px }
.storefront-shell .download-store-grid { display:grid; grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr); gap:40px; align-items:center }
.storefront-shell .download-product { grid-column:1; grid-row:1; padding:28px; background:var(--metal-tone-134); border:1px solid var(--metal-tone-05); border-radius:14px }
.storefront-shell .download-showcase { grid-column:2; grid-row:1; margin:0; padding:0; border:0; background:none; box-shadow:none }
.storefront-shell .download-screenshot { padding:0; background:none; border-radius:10px; overflow:hidden; border:0; box-shadow:none; line-height:0 }
.storefront-shell .download-screenshot img { display:block; width:100%; max-width:100%; height:auto; margin:0; padding:0; border:0; border-radius:0; clip-path:none; object-fit:contain }
.storefront-shell .download-showcase-bar { display:none }
.storefront-shell .download-install { border-color:var(--metal-tone-05); border-radius:12px; background:var(--metal-tone-138) }
.storefront-shell .site-footer { background:var(--metal-tone-139); border-top:1px solid var(--metal-tone-78); margin-top:40px; padding-top:40px }
.storefront-shell .footer-columns { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:28px }
.storefront-shell .footer-columns p { max-width:210px; color:var(--metal-tone-140); line-height:1.8 }
.storefront-shell .footer-columns a:not(.brand),.storefront-shell .footer-columns h3 { font-size:13px }
.storefront-shell .footer-bottom { color:var(--metal-tone-141); border-color:var(--metal-tone-78) }
.metal-ui.not-found-body { background:transparent }
.metal-ui .not-found-number { color:var(--metal-tone-142); text-shadow:none }
.metal-ui .not-found-period { color:var(--metal-tone-143) }

@media(max-width:1080px) {
  .storefront-shell .site-header .nav { display:grid; grid-template-columns:1fr auto; gap:12px; padding-block:14px }
  .storefront-shell .site-header .brand { grid-column:1; grid-row:1 }
  .storefront-shell .nav-footer { grid-column:2; grid-row:1 }
  .storefront-shell .nav-links { grid-column:1/-1; grid-row:2; justify-content:flex-start; overflow-x:auto; scrollbar-width:thin; width:100%; padding-bottom:2px }
  .storefront-shell .nav-links>a,.storefront-shell .nav-links>a:first-child { padding:8px 14px; min-height:36px }
  .storefront-shell [id] { scroll-margin-top:155px }
  .product-plan-column,.credits-workspace>.credits-packs,.storefront-shell .help-index { top:155px }
  .credits-workspace { grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:22px }
  .desktop-section { gap:30px }
}
@media(max-width:860px) {
  .credits-workspace,.product-stage,.product-reference-grid { display:block }
  .credits-workspace>.credits-packs,.product-plan-column { position:static; margin-top:32px }
  .credits-page .credit-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .credits-page .credits-section-head { min-height:0 }
  .product-reference-grid .product-help-grid { grid-template-columns:1fr 1fr; gap:16px }
  .storefront-shell .download-store-grid { grid-template-columns:1fr; gap:28px }
  .storefront-shell .download-product { grid-column:1; grid-row:2 }
  .storefront-shell .download-showcase { grid-column:1; grid-row:1 }
  .storefront-shell .auth-page { column-gap:32px; grid-template-columns:200px minmax(0,1fr); min-height:0 }
  .auth-identity img { width:86px; height:86px }
}
@media(max-width:640px) {
  .storefront-shell .container { padding-inline:20px }
  .storefront-shell .site-header .nav { padding-block:11px; gap:10px }
  .storefront-shell .site-header .brand { font-size:15px }
  .storefront-shell .site-header .brand img { width:28px; height:31px }
  .storefront-shell .nav-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; overflow:visible; padding:0 }
  .storefront-shell .nav-links>a,.storefront-shell .nav-links>a:first-child { padding:8px 11px; font-size:12px }
  .storefront-shell .inner-page,.storefront-shell .download-store { padding-top:30px; padding-bottom:36px }
  .store-intro { padding-top:36px; padding-bottom:26px }
  .store-intro h1 { font-size:38px; letter-spacing:-1.4px }
  .store-intro p { font-size:14px }
  .storefront-shell .game-category-nav { flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin }
  .storefront-shell .game-category-nav a { flex:none; padding:10px 14px }
  .storefront-shell .product-grid { grid-template-columns:1fr; gap:20px }
  .storefront-shell .catalog-section .product-body { padding:8px 20px 22px }
  .storefront-shell .catalog-section .product-body h3 { font-size:22px }
  .storefront-shell .catalog-card-footer { gap:14px }
  .storefront-shell .catalog-card-footer .button.full { min-width:145px; padding-inline:14px }
  .storefront-shell .catalog-video-link { font-size:11px }
  .desktop-section { grid-template-columns:1fr; gap:28px; padding-block:32px }
  .desktop-section h2 { font-size:30px }
  .storefront-shell .account-callout { padding:24px; gap:20px; align-items:stretch }
  .storefront-shell .auth-page { display:block; min-height:0; max-width:540px }
  .auth-identity { display:none }
  .storefront-shell .auth-page>h1 { font-size:32px }
  .member-workspace>.member-menu { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin }
  .member-workspace>.member-menu a { padding:10px 12px; white-space:nowrap }
  .member-page .member-panel,.member-page .credit-balance { padding:20px }
  .member-page .license { padding:17px }
  .member-page .countdown { font-size:19px }
  .credits-page .credit-grid { grid-template-columns:1fr }
  .product-reference-grid .product-help-grid { grid-template-columns:1fr }
  .product-stage .detail-art { height:260px }
  .storefront-shell .help-layout { display:block }
  .storefront-shell .help-index { position:static; margin-bottom:28px }
  .storefront-shell .footer-columns { grid-template-columns:1fr 1fr; gap:26px }
  .storefront-shell .footer-columns>div:first-child,.storefront-shell .footer-columns .footer-community { grid-column:auto }
}
@media(prefers-reduced-motion:reduce) {
  .metal-ui a,.metal-ui button,.metal-ui input,.metal-background canvas { transition:none!important }
}
@media print { .metal-background,.metal-toggle,.site-header { display:none!important } }

/* A game-led storefront: one cover per game, an edition list, then the application. */
:root {
  --store-ground:#0c0e11;
  --discord-brand:#5865f2;
  --store-surface:#15181e;
  --store-ink:#f2f3f6;
  --store-muted:#a3acba;
  --store-line:#ffffff1a;
  --store-clear:#0c0e1100;
  --store-shade:#0c0e11eb;
  --store-soft-shade:#0c0e1138;
  --store-hover:#ffffff05;
}
.storefront-shell .store-intro { padding-top:42px; padding-bottom:24px; display:flex; justify-content:space-between; align-items:center; gap:32px }
.storefront-shell .store-intro>div { display:flex; justify-content:space-between; align-items:baseline; gap:28px; width:100% }
.storefront-shell .store-intro h1 { font-size:30px; letter-spacing:-.9px; margin:0; flex:none }
.storefront-shell .store-intro p { font-size:13px; text-align:right; max-width:560px; color:var(--store-muted) }
.storefront-shell .catalog-filter { margin-bottom:24px }
.storefront-shell .game-category-nav { gap:28px; border-bottom:1px solid var(--store-line); border-radius:0 }
.storefront-shell .game-category-nav a { position:relative; padding:14px 0; border:0; border-bottom:2px solid transparent; border-radius:0; background:none; font-size:14px; gap:8px }
.storefront-shell .game-category-nav a[aria-selected="true"] { background:none; color:var(--store-ink); border-color:var(--red) }
.storefront-shell .game-category-nav a[aria-selected="true"] .category-count,.storefront-shell .category-count { color:var(--store-muted); background:none; border:0; padding:0; font-size:11px }
.game-feature { position:relative; display:flex; align-items:flex-end; min-height:370px; overflow:hidden; background:var(--store-surface); border-radius:8px }
.game-feature-art { position:absolute; inset:0; overflow:hidden; z-index:0; isolation:isolate }
.game-feature-art .product-cover { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 40%; opacity:1; filter:none; transform:none }
.game-feature-art::after { content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(90deg,var(--store-shade),var(--store-soft-shade) 52%,var(--store-clear)),linear-gradient(0deg,var(--store-shade),var(--store-clear) 80%); pointer-events:none }
.game-feature-copy { position:relative; z-index:1; padding:36px 40px; max-width:85% }
.game-feature-copy h2 { margin:0; font-size:clamp(42px,5.2vw,72px); font-weight:600; line-height:1.04; letter-spacing:-2px; color:var(--store-ink); text-shadow:none }
.game-feature-copy p { margin:16px 0 0; color:var(--store-muted); font-size:14px }
.game-editions { margin-top:12px }
.game-edition { display:grid; grid-template-columns:minmax(0,1fr) 110px auto; align-items:center; gap:30px; padding:26px 20px; border-bottom:1px solid var(--store-line); border-radius:8px; background:none; transition:background .18s ease }
.game-edition:focus-within { background:var(--store-hover) }
@media(hover:hover) { .game-edition:hover { background:var(--store-hover) } }
.edition-identity { min-width:0 }
.edition-identity h3 { margin:0 0 7px; font-size:21px; font-weight:600; letter-spacing:-.4px; line-height:1.3 }
.edition-identity h3 a:hover { color:var(--store-ink); text-decoration:underline; text-underline-offset:5px }
.edition-identity p { margin:0; font-size:13px; line-height:1.7; color:var(--store-muted); max-width:520px }
.edition-actions { display:flex; align-items:center; gap:22px }
.edition-actions .button { min-height:43px; padding:10px 22px; font-size:13px; white-space:nowrap }
.game-edition .status { font-size:12px; white-space:nowrap }
.storefront-shell .catalog-section { padding-bottom:40px }
.storefront-shell .desktop-section { display:block; padding-top:42px; border:0 }
.storefront-shell .desktop-section>div { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:32px; margin-bottom:30px }
.storefront-shell .desktop-section .platform-note { grid-column:1; font-size:13px; margin:0; color:var(--store-muted) }
.storefront-shell .desktop-section h2 { grid-column:1; margin:8px 0 10px; font-size:32px }
.storefront-shell .desktop-section>div>p:not(.platform-note) { grid-column:1; margin:0; max-width:600px }
.storefront-shell .desktop-actions { grid-column:2; grid-row:1/4; align-self:center; margin:0 }
.storefront-shell .desktop-section .home-community-pending,.storefront-shell .desktop-section>div>p:has(.home-community-link) { grid-column:1/-1; margin-top:18px }
.storefront-shell .desktop-section figure { width:100%; max-width:920px; margin:0 auto; padding:0; border:0; border-radius:0; background:none; box-shadow:none }
.storefront-shell .desktop-section img { border-radius:8px; border:0; margin:0; max-width:100% }
.storefront-shell .account-callout { background:none; border:0; border-top:1px solid var(--store-line); border-radius:0; padding:28px 0; margin-bottom:0 }
.storefront-shell .site-footer { margin-top:0 }

/* Compare plans by game first; add balance in the separate purchase area below. */
.storefront-shell .credits-intro { border-bottom:0; margin-bottom:32px; padding-bottom:0 }
.storefront-shell .credits-intro .eyebrow { display:none }
.credits-jump { display:flex; flex-wrap:wrap; gap:24px; margin:0 0 38px; padding:0 0 18px; border-bottom:1px solid var(--store-line) }
.credits-jump a { font-size:14px; color:var(--store-muted); text-underline-offset:6px }
.credits-jump a:hover { color:var(--store-ink); text-decoration:underline }
.storefront-shell .credits-workspace { display:flex; flex-direction:column; gap:64px }
.storefront-shell .credits-workspace>.credits-packs { position:static; width:100%; margin:0 }
.storefront-shell .credits-catalog { width:100%; padding-top:0 }
.storefront-shell .credits-section-head { min-height:0; margin-bottom:24px }
.storefront-shell .credits-section-head .eyebrow { display:none }
.storefront-shell .credits-page .credit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px }
.storefront-shell .credits-page .credit-pack { padding:30px; border-radius:10px; border:1px solid var(--store-line); box-shadow:none; background:var(--store-surface) }
.storefront-shell .credit-pack-amount strong { font-size:52px; font-weight:500; letter-spacing:-2px }
.storefront-shell .credit-pack-name { font-size:14px; color:var(--store-muted); font-weight:500 }
.storefront-shell .credits-page .credit-game { padding:0; margin:0 0 38px; background:none; border:0; border-radius:0; overflow:visible }
.storefront-shell .credits-page .credit-game:last-child { margin-bottom:0 }
.storefront-shell .credit-game-head { padding:0 0 18px; border-bottom:1px solid var(--store-line) }
.storefront-shell .credit-game-head h3 { font-size:25px; font-weight:500 }
.storefront-shell .credit-product { display:grid; grid-template-columns:minmax(180px,.5fr) minmax(0,1.5fr); gap:36px; padding:24px 0; border:0; border-bottom:1px solid var(--store-line); border-radius:0 }
.storefront-shell .credit-product-head { display:block; padding:0; border:0; background:none }
.storefront-shell .credit-product-head h3 { font-size:18px; line-height:1.3; margin-top:0 }
.storefront-shell .credit-product-head>a { display:inline-flex; align-items:center; gap:7px; margin-top:14px; color:var(--store-muted); font-size:12px }
.storefront-shell .credit-plan-table { width:100%; border-collapse:collapse; table-layout:fixed; margin:0; background:none; font-variant-numeric:tabular-nums }
.storefront-shell .credit-plan-table th,.storefront-shell .credit-plan-table td { padding:15px 16px; border:0; border-bottom:1px solid var(--store-line); background:none; text-align:left; font-size:14px; line-height:1.5; font-weight:400; overflow-wrap:break-word }
.storefront-shell .credit-plan-table thead th { padding-top:0; padding-bottom:12px; color:var(--store-muted); font-size:12px; letter-spacing:0; text-transform:none }
.storefront-shell .credit-plan-table th:first-child { width:52%; padding-left:0 }
.storefront-shell .credit-plan-table th:nth-child(2) { width:24% }
.storefront-shell .credit-plan-table td:last-child,.storefront-shell .credit-plan-table th:last-child { text-align:right; padding-right:0 }
.storefront-shell .credit-plan-table td:last-child { color:var(--store-ink); font-size:19px; font-weight:500 }
.storefront-shell .credit-plan-table td:nth-child(2) { color:var(--store-muted) }
.storefront-shell .credit-plan-table tbody tr:last-child>* { border-bottom:0 }
.storefront-shell .credits-packs { padding-top:32px; border-top:1px solid var(--store-line) }
.storefront-shell .credit-pack-purchase { gap:20px }
.storefront-shell .credit-how { background:none; padding:28px 0; border:0; border-top:1px solid var(--store-line); border-radius:0 }

/* Download is a product stage with the action and requirements beneath it. */
.storefront-shell .download-store-grid { display:flex; flex-direction:column; gap:34px }
.storefront-shell .download-showcase { width:100%; max-width:920px; align-self:center; margin-inline:auto }
.storefront-shell .download-product { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.65fr); gap:22px 50px; width:100%; padding:28px 0 0; border:0; border-top:1px solid var(--store-line); border-radius:0; background:none }
.storefront-shell .download-product-head { display:none }
.storefront-shell .download-product-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0; align-self:center }
.storefront-shell .download-product-facts>div { display:block; padding:0; border:0 }
.storefront-shell .download-product-facts dt { margin-bottom:9px; color:var(--store-muted); font-size:12px }
.storefront-shell .download-product-facts dd { margin:0; font-size:14px; text-align:left }
.storefront-shell .download-product-cta { margin:0 }
.storefront-shell .download-register { grid-column:2; margin:0; padding:0; border:0; text-align:center }
.storefront-shell .download-install { background:none; border:0; border-top:1px solid var(--store-line); border-radius:0; padding-inline:0 }
.storefront-shell .download-overline { font-size:13px; letter-spacing:0; color:var(--store-muted); text-transform:none }
@media(max-width:1080px) {
  .game-edition { grid-template-columns:minmax(0,1fr) auto; gap:16px }
  .game-edition .status { justify-self:end }
  .edition-actions { grid-column:1/-1; justify-content:space-between; flex-direction:row-reverse }
  .game-feature { min-height:340px }
  .storefront-shell .desktop-section>div { display:block }
  .storefront-shell .desktop-actions { margin-top:22px }
}
@media(max-width:700px) {
  .storefront-shell .store-intro { padding-top:28px; padding-bottom:16px }
  .storefront-shell .store-intro>div { display:block }
  .storefront-shell .store-intro h1 { font-size:28px }
  .storefront-shell .store-intro p { text-align:left; font-size:12px; margin-top:10px }
  .storefront-shell .game-category-nav { flex-wrap:nowrap; gap:24px; overflow:auto; padding-bottom:0 }
  .storefront-shell .catalog-filter { margin-bottom:18px }
  .game-feature { min-height:300px }
  .game-feature-copy { padding:26px 24px; max-width:100% }
  .game-feature-copy h2 { font-size:44px; letter-spacing:-1.5px }
  .game-feature-copy p { margin-top:10px; font-size:12px }
  .game-feature-art .product-cover { object-position:60% center }
  .game-edition { padding:22px 0; gap:14px }
  .game-edition .status { align-self:start; padding-top:4px }
  .edition-identity h3 { font-size:19px }
  .edition-identity p { font-size:13px }
  .edition-actions { gap:14px }
  .edition-actions .button { min-width:140px }
  .storefront-shell .credits-page .credit-grid { grid-template-columns:1fr }
  .storefront-shell .credit-product { display:block; padding:24px 0 }
  .storefront-shell .credit-plan-table { margin-top:24px }
  .storefront-shell .credit-plan-table th,.storefront-shell .credit-plan-table td { padding-inline:8px; font-size:13px }
  .storefront-shell .credit-plan-table td:last-child { font-size:18px }
  .storefront-shell .credit-product-head { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:16px }
  .storefront-shell .credit-product-head>a { margin:0; flex:none }
  .storefront-shell .credit-pack-amount strong { font-size:44px }
  .storefront-shell .credits-workspace { gap:38px }
  .storefront-shell .credits-page .credit-pack { padding:24px }
  .storefront-shell .download-product { display:block }
  .storefront-shell .download-product-facts { gap:14px; margin-bottom:26px }
  .storefront-shell .download-product-facts dd { font-size:12px }
  .storefront-shell .download-register { display:block; margin-top:20px }
}

/* The community gets a clear entry in the header and its own destination. */
.storefront-shell .nav-discord { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--store-line); border-radius:8px; background:var(--store-surface); flex:none; transition:border-color .18s,background .18s }
.storefront-shell .nav-discord img { display:block; width:20px; height:15px }
.storefront-shell .nav-discord:hover { background:var(--discord-brand); border-color:var(--discord-brand) }
.community-banner { display:grid; grid-template-columns:72px minmax(0,1fr) auto; align-items:center; gap:26px; padding:30px 32px; margin:0 0 16px; border:1px solid var(--store-line); border-radius:12px; background:var(--store-surface) }
.discord-mark { display:flex; align-items:center; justify-content:center; width:72px; height:72px; border-radius:16px; background:var(--discord-brand) }
.discord-mark img { display:block; width:44px; height:33px }
.community-copy h2 { margin:0 0 8px; font-size:25px; font-weight:600; letter-spacing:-.6px }
.community-copy p { margin:0; max-width:550px; font-size:14px; line-height:1.7; color:var(--store-muted) }
.community-join { white-space:nowrap; font-size:13px }
.community-unavailable { margin:0; max-width:220px; color:var(--store-muted); font-size:12px; line-height:1.7 }
.storefront-shell .button:not(:disabled):active { transform:translateY(1px) }
@media(max-width:860px) {
  .community-banner { grid-template-columns:56px minmax(0,1fr); gap:18px; padding:26px }
  .discord-mark { width:56px; height:56px; border-radius:12px }
  .discord-mark img { width:34px; height:26px }
  .community-join,.community-unavailable { grid-column:1/-1; max-width:none }
}
@media(max-width:640px) {
  .community-banner { padding:22px; gap:16px }
  .community-copy h2 { font-size:21px }
  .community-copy p { font-size:13px }
  .community-join { width:100% }
}

/* Mobile navigation is an anchored disclosure, not a permanent wall of links. */
@media(max-width:760px) {
  .storefront-shell .site-header .nav.has-mobile-menu { position:relative; display:flex; justify-content:space-between; min-height:64px; padding-block:10px }
  .has-mobile-menu .nav-toggle:not([hidden]) { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:92px; min-height:44px; padding:10px 12px; border:1px solid var(--store-line); border-radius:8px; background:var(--store-surface); color:var(--store-ink); font:inherit; font-size:13px; cursor:pointer }
  .nav-toggle-lines { display:block; position:relative; width:18px; height:14px }
  .nav-toggle-lines::before,.nav-toggle-lines::after { content:""; position:absolute; inset:3px 0 auto; height:1px; background:currentColor; transition:transform .16s ease }
  .nav-toggle-lines::after { transform:translateY(7px) }
  .menu-open .nav-toggle-lines::before { transform:translateY(3.5px) rotate(45deg) }
  .menu-open .nav-toggle-lines::after { transform:translateY(3.5px) rotate(-45deg) }
  .has-mobile-menu .nav-panel { display:none; position:absolute; inset:calc(100% + 8px) 20px auto; max-height:calc(100dvh - 96px); overflow-y:auto; padding:12px; border:1px solid var(--store-line); border-radius:12px; background:var(--store-ground); box-shadow:0 16px 40px var(--metal-tone-25) }
  .has-mobile-menu.menu-open .nav-panel { display:block }
  .storefront-shell .has-mobile-menu .nav-links { display:flex; flex-direction:column; align-items:stretch; gap:4px; overflow:visible; padding:0 }
  .storefront-shell .has-mobile-menu .nav-links>a,.storefront-shell .has-mobile-menu .nav-links>a:first-child { justify-content:flex-start; width:100%; min-height:44px; padding:10px 14px; font-size:14px; gap:12px }
  .storefront-shell .has-mobile-menu .nav-links svg { display:block; width:18px; height:18px }
  .storefront-shell .has-mobile-menu .nav-account-name { max-width:100% }
  .storefront-shell .has-mobile-menu .nav-footer { display:flex; justify-content:space-between; gap:12px; margin-top:12px; padding:16px 4px 4px; border-top:1px solid var(--store-line) }
  .storefront-shell .has-mobile-menu .nav-footer>a,.storefront-shell .has-mobile-menu .nav-footer button,.storefront-shell .has-mobile-menu .language-picker>summary { min-height:44px; min-width:44px }
  .storefront-shell .has-mobile-menu .language-options { bottom:calc(100% + 8px); top:auto; right:0 }
  .storefront-shell [id] { scroll-margin-top:88px }
}
@media(prefers-reduced-motion:reduce) { .nav-toggle-lines::before,.nav-toggle-lines::after,.game-edition { transition:none } }