/* BearPlayX reference-2 homepage. Graphics are user-supplied reference artwork, not generated placeholders. */
:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;color:#f2f7ff;background:#080f25}*{box-sizing:border-box}body.bpx-h2{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 73% 7%,#172b50 0,transparent 59%),#081123;color:#f5f8ff}
.bpx-h2-header{background:linear-gradient(180deg,#0a1230,#080e25);border-bottom:1px solid #20385c}.bpx-h2-head-inner{max-width:1510px;min-height:87px;margin:auto;padding:6px 28px;display:flex;align-items:center;gap:21px}.bpx-h2-brand{flex:none;display:flex;align-items:center;max-width:240px}.bpx-h2-brand img{display:block;width:230px;height:71px;object-fit:contain}.bpx-h2-catalog-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 24px;color:#f4f7ff;text-decoration:none;border:1px solid #2e76c1;border-radius:12px;background:linear-gradient(180deg,#0b3981,#0a2350);font-size:16px}.bpx-h2-catalog-btn svg{width:21px;height:21px}.bpx-h2-search{flex:1;min-width:110px;display:flex;align-items:center;gap:14px;min-height:52px;padding:5px 10px 5px 20px;border:2px solid #18c5ff;border-radius:13px;box-shadow:0 0 16px #009dff99,inset 0 0 9px #0075ff50;background:#081b47}.bpx-h2-search>svg{width:22px;height:22px;flex:none}.bpx-h2-search input{flex:1;min-width:0;outline:0;border:0;background:transparent;color:#fff;font:inherit;font-size:14px}.bpx-h2-search input::placeholder{color:#e1e8fa;opacity:1}.bpx-h2-search button{flex:none;background:#114a9b;color:#fff;border:0;border-radius:8px;padding:9px 14px;font:inherit;cursor:pointer}.bpx-h2-actions{display:flex;align-items:center;gap:20px;flex:none}.bpx-h2-action{display:flex;align-items:center;gap:8px;white-space:nowrap;color:#f6f7ff;text-decoration:none;font-size:15px}.bpx-h2-action svg{width:27px;height:27px}.bpx-h2-signin{min-height:52px;padding:0 18px;border:1px solid #715fd5;border-radius:12px}.bpx-h2-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.bpx-h2-hero{display:block;width:100%;margin:0 auto;overflow:hidden;text-decoration:none;background:#071d45}.bpx-h2-hero picture,.bpx-h2-hero img{display:block;width:100%;height:auto}.bpx-h2-hero img{aspect-ratio:1536/268;object-fit:cover;object-position:center}.bpx-h2-catalog{max-width:1510px;margin:0 auto;padding:13px 27px 0}.bpx-h2-catalog h1{margin:0 0 8px;font-size:34px;font-weight:900;letter-spacing:-.04em;line-height:1.28}.bpx-h2-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.bpx-h2-tile{position:relative;display:block;width:100%;aspect-ratio:1 / 1;min-width:0;overflow:hidden;border:1.5px solid var(--edge,#3679ff);border-radius:13px;appearance:none;padding:0;text-align:left;color:#fff;background:var(--bottom,#09203a);box-shadow:0 0 13px var(--glow,#246ed344);text-decoration:none;cursor:pointer;font:inherit;transition:transform .15s ease,box-shadow .15s ease}.bpx-h2-tile>img{display:block;position:absolute;inset:0 0 auto;width:100%;height:71%;object-fit:cover;object-position:center;background:#15274a}.bpx-h2-tile-copy{position:absolute;left:0;right:0;bottom:0;min-height:43%;display:flex;flex-direction:column;justify-content:end;gap:2px;padding:19px 15px 15px;background:linear-gradient(180deg,transparent 0%,var(--mid,#0b183cb0) 26%,var(--bottom,#071b35) 80%)}.bpx-h2-tile-copy strong{font-size:clamp(17px,1.5vw,23px);line-height:1.1;font-weight:850;letter-spacing:-.025em}.bpx-h2-tile-copy small{font-size:clamp(12px,1.15vw,17px);line-height:1.18;color:#f3f4fc}.bpx-h2-tile:hover,.bpx-h2-tile:focus-visible{transform:translateY(-2px);box-shadow:0 0 24px var(--glow,#246ed388);outline-offset:3px}.bpx-h2-tr{--edge:#f4416c;--glow:#ed2d6347;--bottom:#48071d;--mid:#4a0925ac}.bpx-h2-in{--edge:#ffb11a;--glow:#ffae2d60;--bottom:#502607;--mid:#503315ac}.bpx-h2-codes{--edge:#1b80ff;--glow:#2374ff61;--bottom:#061849;--mid:#102071b0}.bpx-h2-steam{--edge:#17bafd;--glow:#22c8ff52;--bottom:#062846;--mid:#003252b0}.bpx-h2-gift{--edge:#983af6;--glow:#a64af759;--bottom:#200a58;--mid:#290d64b0}.bpx-h2-xbox{--edge:#1ad36a;--glow:#22ed7b4f;--bottom:#062d1c;--mid:#0b432caf}.bpx-h2-balance{--edge:#2494ff;--glow:#277dff58;--bottom:#031853;--mid:#103071af}.bpx-h2-all{--edge:#9237f2;--glow:#923af35c;--bottom:#220c51;--mid:#371260af}.bpx-h2-note{max-width:1510px;padding:0 27px;margin:24px auto 45px;font-size:12px;color:#9daeca;line-height:1.5}.bpx-h2-dialog{width:min(370px,calc(100vw - 26px));background:#112340;border:1px solid #59bdfa;border-radius:18px;padding:22px;color:#f2f7ff}.bpx-h2-dialog::backdrop{background:#020815ba}.bpx-h2-dialog form{float:right}.bpx-h2-dialog form button{width:36px;height:36px;border:0;border-radius:50%;background:#24476c;color:#fff;font-size:24px;cursor:pointer}.bpx-h2-dialog h2{margin:5px 0 10px;font-size:22px}.bpx-h2-dialog p{color:#d3e3f6;line-height:1.5}.bpx-h2-dialog a{display:inline-flex;padding:10px 12px;background:#1460b6;border-radius:8px;color:#fff;text-decoration:none}
@media(max-width:1140px){.bpx-h2-head-inner{gap:13px;padding-inline:20px}.bpx-h2-brand img{width:194px}.bpx-h2-catalog-btn{padding:0 16px}.bpx-h2-actions{gap:12px}.bpx-h2-action span{display:none}.bpx-h2-signin{padding:0 12px}.bpx-h2-grid{gap:11px}}
@media(max-width:760px){.bpx-h2-head-inner{display:grid;grid-template-columns:minmax(0,1fr) auto auto;column-gap:10px;row-gap:5px;padding:8px 13px;min-height:116px}.bpx-h2-brand img{width:150px;height:52px}.bpx-h2-catalog-btn{display:none}.bpx-h2-search{grid-column:1/-1;grid-row:2;min-height:41px;border-radius:999px;padding:3px 11px;gap:9px}.bpx-h2-search button{display:none}.bpx-h2-search input{font-size:13px}.bpx-h2-search>svg{width:20px;height:20px}.bpx-h2-actions{grid-column:3;grid-row:1;gap:9px}.bpx-h2-action{width:43px;height:43px;border:1px solid #36c7ff;border-radius:12px;display:grid;place-items:center;box-shadow:0 0 8px #12b6f881}.bpx-h2-signin{padding:0}.bpx-h2-action svg{width:25px;height:25px}.bpx-h2-hero img{aspect-ratio:591/234}.bpx-h2-catalog{padding:8px 13px 0}.bpx-h2-catalog h1{font-size:28px;margin-bottom:10px}.bpx-h2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bpx-h2-tile{aspect-ratio:1 / 1;border-radius:12px}.bpx-h2-tile>img{height:68%}.bpx-h2-tile-copy{padding:14px 9px 11px;min-height:47%}.bpx-h2-tile-copy strong{font-size:clamp(14px,4.1vw,18px)}.bpx-h2-tile-copy small{font-size:clamp(11px,3vw,14px)}.bpx-h2-note{padding:0 13px;font-size:11px;margin-top:20px}}
@media(max-width:360px){.bpx-h2-brand img{width:136px}.bpx-h2-actions{gap:5px}.bpx-h2-action{width:39px;height:39px}.bpx-h2-grid{gap:8px}.bpx-h2-tile-copy{padding:12px 7px 9px}.bpx-h2-tile-copy strong{font-size:13px}.bpx-h2-tile-copy small{font-size:10.7px}}
@media(prefers-reduced-motion:reduce){.bpx-h2-tile{transition:none}.bpx-h2-tile:hover{transform:none}}

/* BRPLAYX_HOME_R3_20260929: approved eight square category tiles. */