/* Boxed In Studios hub */
.studios-hub{min-height:100svh;position:relative;overflow:hidden;padding:170px max(24px,5vw) 90px;background:radial-gradient(circle at 15% 20%,rgba(198,156,66,.14),transparent 26%),radial-gradient(circle at 88% 65%,rgba(54,95,73,.16),transparent 32%),linear-gradient(180deg,#020403,#070a08 68%,#050706);color:#fff}.studios-hub:before{content:"";position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,#000,transparent 78%)}.studios-hub-copy{position:relative;z-index:2;max-width:840px;margin-bottom:42px}.studios-hub-copy h1{font-size:clamp(68px,9.3vw,150px);line-height:.78;letter-spacing:-.075em;margin:18px 0 30px}.studios-hub-copy h1 em{display:block;font-family:Georgia,serif;font-weight:400;color:#d1ad5b;font-size:.65em;letter-spacing:-.05em;margin-top:.18em}.studios-hub-copy>p:not(.eyebrow){max-width:660px;line-height:1.72;color:rgba(255,255,255,.56);font-size:13px}.studios-profile-chip{margin-top:25px;width:max-content;max-width:100%;display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.025);backdrop-filter:blur(10px)}.profile-signal{width:8px;height:8px;border-radius:50%;background:#d7b45e;box-shadow:0 0 18px #d7b45e}.studios-profile-chip small{display:block;color:rgba(255,255,255,.38);font-size:7px;letter-spacing:.17em}.studios-profile-chip strong{display:block;margin-top:2px;font-size:11px}.studios-profile-chip b{padding-left:10px;border-left:1px solid rgba(255,255,255,.12);font-size:7px;letter-spacing:.15em;color:#bda25f}.studios-portal-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1460px}.studio-portal{min-height:330px;position:relative;overflow:hidden;padding:18px 20px 20px;border:1px solid rgba(255,255,255,.09);background:#0a0d0b;color:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .28s,border-color .28s,box-shadow .28s}.studio-portal:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,var(--portal-glow,rgba(205,168,82,.17)),transparent 36%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 60%);transition:transform .5s}.studio-portal:hover{transform:translateY(-7px);border-color:rgba(220,184,96,.5);box-shadow:0 28px 55px rgba(0,0,0,.35)}.studio-portal:hover:before{transform:scale(1.08)}.portal-number{position:absolute;right:14px;top:11px;color:rgba(255,255,255,.18);font-size:42px;font-weight:900;letter-spacing:-.08em}.portal-art{position:absolute;left:50%;top:28px;width:150px;height:150px;transform:translateX(-50%);border-radius:50%;border:1px solid rgba(225,191,104,.18);display:grid;place-items:center;background:radial-gradient(circle,rgba(218,177,82,.13),transparent 67%);box-shadow:inset 0 0 45px rgba(0,0,0,.45)}.portal-art:before,.portal-art:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.07)}.portal-art:before{inset:13px}.portal-art:after{inset:31px}.portal-art i{position:absolute;inset:48%;border-radius:50%;box-shadow:0 0 55px 25px var(--portal-glow,rgba(210,171,78,.17))}.portal-art b{position:relative;z-index:2;font-size:28px;color:#e5c16d;letter-spacing:-.06em}.studio-portal>small,.studio-portal>strong,.studio-portal>p,.studio-portal>em{position:relative;z-index:2}.studio-portal>small{font-size:7px;letter-spacing:.19em;color:#a98c4e}.studio-portal>strong{font-size:28px;letter-spacing:-.04em;margin:5px 0 6px}.studio-portal>p{margin:0;max-width:330px;color:rgba(255,255,255,.48);font-size:10px;line-height:1.5}.studio-portal>em{margin-top:14px;font-style:normal;font-size:8px;letter-spacing:.17em;color:#e6c979}.portal-run{--portal-glow:rgba(64,143,91,.25)}.portal-heist{--portal-glow:rgba(111,90,141,.22)}.portal-moon{--portal-glow:rgba(89,120,180,.25)}.portal-flight{--portal-glow:rgba(192,137,76,.22)}.portal-race{--portal-glow:rgba(176,112,61,.24)}.portal-leap{--portal-glow:rgba(216,179,94,.25)}.studios-achievement-rail{position:relative;z-index:2;max-width:1460px;margin-top:12px;display:grid;grid-template-columns:1fr 1fr 1fr 1.4fr;border:1px solid rgba(255,255,255,.08);background:rgba(7,9,8,.78)}.studios-achievement-rail>div,.studios-achievement-rail>a{min-height:84px;padding:15px 17px;border-right:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;justify-content:center}.studios-achievement-rail small{font-size:7px;letter-spacing:.16em;color:#8d7950}.studios-achievement-rail strong{font-size:20px;margin:3px 0}.studios-achievement-rail span{font-size:7px;letter-spacing:.12em;color:rgba(255,255,255,.35)}.studios-achievement-rail>a{border-right:0;color:#f0d78f;text-decoration:none;flex-direction:row;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.studios-achievement-rail>a span{font-size:18px;color:#f0d78f}.studios-hub-orbit{position:absolute;border-radius:50%;border:1px solid rgba(215,178,86,.07);pointer-events:none}.orbit-one{width:620px;height:620px;right:-170px;top:-140px}.orbit-two{width:900px;height:900px;left:-580px;bottom:-600px}
@media(max-width:1000px){.studios-portal-grid{grid-template-columns:repeat(2,1fr)}.studios-achievement-rail{grid-template-columns:1fr 1fr}.studios-achievement-rail>*{border-bottom:1px solid rgba(255,255,255,.07)}}
@media(max-width:650px){.studios-hub{padding:142px 16px 72px}.studios-hub-copy h1{font-size:clamp(66px,20vw,96px)}.studios-portal-grid{grid-template-columns:1fr}.studio-portal{min-height:300px}.studios-achievement-rail{grid-template-columns:1fr}.studios-achievement-rail>div,.studios-achievement-rail>a{border-right:0}.studios-profile-chip{width:100%}.portal-art{width:135px;height:135px}}


/* 2026-09-05 — Boxed In Studios image-first game portal refresh */
.studios-portal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.studio-portal{min-height:0;padding:0 0 22px;border:1px solid rgba(255,255,255,.11);border-radius:22px;background:linear-gradient(180deg,#0b0e0c,#070907);box-shadow:0 24px 55px rgba(0,0,0,.28);justify-content:flex-start;isolation:isolate}
.studio-portal:before{display:none}
.studio-portal:hover{transform:translateY(-6px) scale(1.005);border-color:rgba(226,190,96,.55);box-shadow:0 30px 70px rgba(0,0,0,.48),0 0 0 1px rgba(224,187,92,.08) inset}
.portal-number{z-index:8;right:18px;top:13px;font-size:34px;color:rgba(255,255,255,.55);text-shadow:0 2px 16px rgba(0,0,0,.7)}
.portal-preview{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#020403;border-radius:21px 21px 0 0;border-bottom:1px solid rgba(255,255,255,.09);box-shadow:inset 0 -35px 55px rgba(0,0,0,.22)}
.portal-preview:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 48%,rgba(2,4,3,.16) 74%,rgba(2,4,3,.62));box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.portal-preview iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none;background:#050706;transform:scale(1.012);transform-origin:center;filter:none}
.portal-preview-tag{position:absolute;z-index:5;left:14px;top:13px;padding:7px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(2,5,3,.68);backdrop-filter:blur(8px);color:#fff;font-size:7px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;box-shadow:0 8px 25px rgba(0,0,0,.25)}
.portal-preview-tag:before{content:"";display:inline-block;width:5px;height:5px;margin-right:6px;border-radius:50%;background:#e6bd61;box-shadow:0 0 12px #e6bd61;vertical-align:1px}
.portal-preview-action{position:absolute;z-index:6;right:14px;bottom:13px;width:41px;height:41px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(240,206,116,.66);background:rgba(6,9,7,.78);backdrop-filter:blur(8px);color:#f4d98b;font-size:15px;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.studio-portal>small,.studio-portal>strong,.studio-portal>p,.studio-portal>em{margin-left:22px;margin-right:22px}
.studio-portal>small{margin-top:21px;font-size:8px;color:#d0ab57;font-weight:850;letter-spacing:.18em}
.studio-portal>strong{font-size:clamp(30px,3.1vw,46px);line-height:.95;margin-top:8px;margin-bottom:9px;letter-spacing:-.055em}
.studio-portal>p{max-width:470px;font-size:11px;line-height:1.58;color:rgba(255,255,255,.57)}
.studio-portal>em{margin-top:17px;display:flex;align-items:center;gap:7px;font-size:8px;font-weight:850;color:#f1d485}
.studio-portal>em span{font-size:13px;transition:transform .22s ease}.studio-portal:hover>em span{transform:translateX(4px)}
.portal-run .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(57,130,85,.09)}
.portal-heist .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(105,75,142,.09)}
.portal-moon .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(65,104,179,.1)}
.portal-flight .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(184,128,69,.1)}
.portal-race .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(190,111,56,.11)}
.portal-leap .portal-preview{box-shadow:inset 0 -35px 55px rgba(0,0,0,.2),0 0 35px rgba(216,179,94,.12)}
@media(max-width:900px){.studios-portal-grid{grid-template-columns:1fr}.studio-portal>strong{font-size:38px}}
@media(max-width:650px){.studios-portal-grid{gap:20px}.studio-portal{border-radius:18px;padding-bottom:21px}.portal-preview{border-radius:17px 17px 0 0;aspect-ratio:1.56}.portal-number{font-size:31px;right:14px;top:12px}.portal-preview-tag{left:11px;top:10px;font-size:6.5px}.portal-preview-action{right:11px;bottom:10px;width:37px;height:37px}.studio-portal>small,.studio-portal>strong,.studio-portal>p,.studio-portal>em{margin-left:19px;margin-right:19px}.studio-portal>small{margin-top:18px}.studio-portal>strong{font-size:36px}.studio-portal>p{font-size:11px}.studio-portal:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.studio-portal,.studio-portal>em span{transition:none}}

/* 2026-09-06 performance pass: only the centered Studios card runs a live game. */
.portal-preview::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 70% 28%,rgba(224,184,86,.13),transparent 35%),linear-gradient(135deg,#111713,#050706 62%,#10140f);opacity:1;transition:opacity .22s ease}
.studio-portal.preview-live .portal-preview::before{opacity:0}
.portal-preview iframe{z-index:1;opacity:0;transition:opacity .2s ease}
.studio-portal.preview-live .portal-preview iframe{opacity:1}
.portal-preview-tag,.portal-preview-action{position:absolute}
@media(max-width:700px){.portal-preview iframe{filter:none}.portal-preview-tag,.portal-preview-action{backdrop-filter:none}}

/* 2026-09-07 performance stabilization: isolate each live game surface so repaint work stays inside its card. */
.portal-preview{contain:layout paint style;isolation:isolate}
.portal-preview iframe{will-change:auto;backface-visibility:hidden}
.studio-portal{contain:layout paint style}

/* 2026-09-07 Studios scroll-performance architecture */
.studios-only-page,.studios-only-main{background:#020403}
.studios-only-main{min-height:100vh}
.studios-only-page .studios-hub{overflow:clip;contain:layout paint style}
.studios-only-page .studio-portal{contain:layout paint style;transform:translateZ(0)}
.studios-only-page .portal-preview{contain:strict;isolation:isolate;background:#050706}
.studios-only-page .portal-preview iframe{contain:strict;will-change:auto}
/* Blur over seven moving iframe surfaces is very expensive; opaque glass preserves the look. */
.studios-only-page .portal-preview-tag,.studios-only-page .portal-preview-action,.studios-only-page .studios-profile-chip{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.studios-only-page .portal-preview-tag{background:rgba(2,5,3,.90)!important}
.studios-only-page .portal-preview-action{background:rgba(6,9,7,.94)!important}
.studios-only-page .studios-profile-chip{background:rgba(10,13,11,.94)!important}
/* While the user is actively scrolling, keep the cards compositor-simple. */
html.studios-scrolling .studio-portal{transition:none!important;box-shadow:0 14px 34px rgba(0,0,0,.24)!important}
html.studios-scrolling .portal-preview:after{box-shadow:none!important}
html.studios-scrolling .studio-portal:hover{transform:none!important}
@media(max-width:900px){.studios-only-page .studios-hub{padding-top:132px}}
.studios-only-page .main-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(8,9,7,.94)!important}
.studios-only-page .studio-portal{transform:none}
.studios-only-page .studio-portal:hover{transform:translateY(-4px)}
.studios-only-page .portal-preview iframe{transform:none!important}
.studios-only-page,.studios-only-page body,.studios-only-page .studios-hub{touch-action:pan-y pinch-zoom}


/* Live previews remain visually live without allowing seven game engines to run at once. */
.portal-preview iframe{content-visibility:auto;contain:strict;}
.studios-scrolling .portal-preview iframe{visibility:hidden;}
@media (prefers-reduced-motion: reduce){.portal-preview iframe{visibility:hidden;}}