:root{color-scheme:dark;--lime:#b3f337;--dim:#849180}body{margin:0;background:#090d0a;color:#edf2e9;font-family:system-ui,sans-serif}.case-header{display:flex;gap:28px;align-items:center;padding:22px 5vw;border-bottom:1px solid #253025;background:#0c120de8}.case-header a{color:#c0c9bd;text-decoration:none;font-size:13px}.case-brand{font-size:22px!important;font-weight:900;letter-spacing:1px}.case-brand span,.case-header .selected{color:var(--lime)}.case-header nav{display:flex;gap:24px;flex:1}.case-main{max-width:1240px;margin:auto;padding:45px 24px 70px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:3px;color:var(--lime)}.case-heading,.case-topline,.contents-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.case-heading h1{font-size:40px;letter-spacing:-1px;margin:7px 0 9px}.case-heading p,.case-topline p,.case-note{color:var(--dim);font-size:13px}.case-list{display:flex;gap:12px;overflow-x:auto;padding:12px 0 24px}.case-choice{flex:0 0 200px;border:1px solid #2e392a;background:#141b12;border-radius:10px;padding:14px;cursor:pointer;text-align:left;color:#eef3e8}.case-choice.active{border-color:var(--lime);background:#1c2913;box-shadow:0 0 18px #aff52d0d}.case-choice img{height:78px;width:100%;object-fit:contain;margin-bottom:8px}.case-choice strong{display:block}.case-choice small{color:#b5c39d;display:block;margin-top:8px}.case-topline{margin:14px 0 20px}.case-topline h2{font-size:27px;margin:7px 0}.balance{font-size:13px;color:#c6d9b0}.case-stage{height:355px;background:radial-gradient(ellipse at 50% 65%,#33451d50,transparent 65%),linear-gradient(160deg,#141e14,#0b100c);border:1px solid #35422d;border-radius:12px;position:relative;overflow:hidden;display:grid;place-items:center}.crate-area{display:grid;place-items:center;gap:20px;width:100%;height:100%}.crate-area img{height:230px;max-width:80%;object-fit:contain;filter:drop-shadow(0 18px 35px #0008)}.crate-symbol{font-size:76px;color:#b7d673;text-shadow:0 0 35px #a4e82b30}.crate-symbol small{display:block;font-size:12px;text-align:center;letter-spacing:5px}.roulette{width:100%;position:relative;height:202px;overflow:hidden}.roulette::before,.roulette::after{content:'';position:absolute;top:0;bottom:0;width:12%;z-index:2;pointer-events:none}.roulette::before{left:0;background:linear-gradient(90deg,#111910,transparent)}.roulette::after{right:0;background:linear-gradient(-90deg,#111910,transparent)}.reel{display:flex;gap:8px;width:max-content;will-change:transform;padding-top:12px}.roll-card{width:164px;height:170px;flex:0 0 164px;box-sizing:border-box;padding:16px 10px 10px;border-bottom:4px solid var(--grade);background:linear-gradient(180deg,#293429,#141a16);display:flex;flex-direction:column;justify-content:center}.roll-card>img{width:100%;height:103px;object-fit:contain;filter:drop-shadow(0 8px 10px #0007)}.roll-card strong{font-size:12px;margin-top:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roulette-line{position:absolute;left:50%;top:0;bottom:0;width:2px;background:#e3efb9;box-shadow:0 0 12px #dbf98c90;z-index:5}.roulette-pointer{position:absolute;top:0;left:calc(50% - 7px);border-left:8px solid transparent;border-right:8px solid transparent;border-top:12px solid #e3efb9;z-index:6}.case-controls{display:flex;justify-content:center;align-items:center;gap:24px;padding:25px 0 0}.payment{display:flex;gap:8px}.payment button,.quiet{border:1px solid #38452f;background:#131b13;color:#d3ddcd;border-radius:6px;padding:10px 14px;cursor:pointer}.payment button.active{border-color:var(--lime);color:var(--lime);background:#1d2d12}.open-case{padding:14px 34px;background:var(--lime);color:#132000;border:0;border-radius:6px;font-weight:850;cursor:pointer;min-width:200px}.open-case:disabled,button:disabled{opacity:.45;cursor:default}.case-note{text-align:center;margin:16px 0 38px;font-size:12px}.contents-heading{margin:26px 0 15px}.contents-heading h2{font-size:19px;margin:0}.contents-heading span{font-size:12px;color:var(--dim)}.reward-pool{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:12px}.pool-card{background:#111a12;border:1px solid #293426;border-bottom:3px solid var(--grade);border-radius:6px;padding:15px}.pool-card>img{height:90px;width:100%;object-fit:contain}.pool-card strong{font-size:12px;display:block;margin-top:14px}.pool-card small{display:block;margin-top:7px;color:#9ba992;font-size:11px}.case-result{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;background:radial-gradient(ellipse at center,var(--glow),transparent 72%)}.case-result>img{height:176px;max-width:80%;object-fit:contain;filter:drop-shadow(0 12px 18px #0008)}.case-result h2{color:var(--grade);font-size:25px;margin:8px 0}.case-result small{letter-spacing:3px;font-size:10px;color:#b5c4aa}.case-result p{margin:0;padding:0 20px;color:#c6d0bd;font-size:12px}.case-result.secret h2{color:#18171b;-webkit-text-stroke:.7px #c6c3ce;text-shadow:0 0 5px #a3a0ad}.case-result a{color:#b5ef69;font-size:12px}.case-history{margin-top:40px;border-top:1px solid #283126}.history-row{display:flex;gap:16px;align-items:center;border-bottom:1px solid #222c22;padding:14px 0}.history-row>img{width:54px;height:48px;object-fit:contain}.history-row span{flex:1}.history-row strong{font-size:13px}.history-row small{display:block;font-size:11px;color:var(--dim);margin-top:5px}#status{font-size:13px;color:#cbd9b9;min-height:20px} [hidden]{display:none!important}@media(max-width:650px){.case-main{padding:25px 14px}.case-header{gap:14px;padding:16px}.case-header nav{gap:12px}.case-header nav a:last-child{display:none}.case-controls{flex-direction:column;gap:14px}.case-heading h1{font-size:32px}.case-stage{height:310px}.case-topline{align-items:flex-start;flex-direction:column;gap:2px}.case-choice{flex-basis:165px}.case-result h2{font-size:20px}}

/* Full-viewport lab scene only on the case page, including the result phase. */
body{isolation:isolate}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(5,9,11,.66),rgba(5,9,11,.22) 48%,rgba(5,9,11,.74)),url('/assets/cases-3d/sector-lab.png?v=15.9.64') center center/cover no-repeat;opacity:0;transition:opacity .55s ease}
body.case-lab-active::before{opacity:1}
.case-lab-active .case-stage{background:rgba(5,9,11,.16);border-color:#b6a07138;box-shadow:0 18px 60px #0003}
.case-lab-active .case-heading p,.case-lab-active .case-topline p,.case-lab-active .case-note,.case-lab-active .balance{color:#d4d4ca;text-shadow:0 1px 4px #000}
.lab-return{text-align:center;margin-top:14px}
@media(prefers-reduced-motion:reduce){body::before{transition:none}}

/* Same renderer and artwork fitting as the shop, sized for each case surface. */
.pool-card>.case-cosmetic-preview{width:100%;height:180px;margin:0;background:transparent;border:0}
.roll-card>.case-cosmetic-preview{width:100%;height:103px;min-height:103px;margin:0;background:transparent;border:0}
.case-result>.case-cosmetic-preview{width:180px;height:176px;flex-shrink:0;margin:0;background:transparent;border:0}
.history-row>.case-cosmetic-preview{width:54px;height:70px;flex:0 0 54px;margin:0;background:transparent;border:0}
.case-cosmetic-preview .sz-preview-caption{display:none}
@media(prefers-reduced-motion:reduce){.case-cosmetic-preview *,.case-cosmetic-preview *::before,.case-cosmetic-preview *::after{animation:none!important}}

@media(max-width:650px){.case-header{flex-wrap:wrap}.case-header .logged-in-account{max-width:100%;box-sizing:border-box}}

/* Gold special tier: one mystery slot, followed by the actual awarded item. */
.gold-reward{border-color:#8d752a;background:radial-gradient(ellipse at 50% 35%,#9b701d50,transparent 72%),#17170e}
.gold-reward>img{filter:drop-shadow(0 0 12px #ffe07755)}
.gold-reward>strong{color:#ffe88b}
.roll-card.gold-hit{box-shadow:inset 0 0 35px #ffce4566,0 0 25px #ffdc6577}
.case-result.gold-result{isolation:isolate;box-shadow:inset 0 0 70px #e4b72b38;background:radial-gradient(ellipse at 50% 40%,#ffe47555 0%,#d9991929 35%,transparent 72%)}
.case-result.gold-result::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 32% 3% at 50% 58%,#ffedac88,transparent),radial-gradient(ellipse at 50% 40%,#ffd35a38,transparent 63%);animation:gold-reveal-light .9s ease-out both}
.case-result.gold-result>img{filter:drop-shadow(0 0 16px #ffd65c88) drop-shadow(0 12px 18px #0009)}
.case-result.gold-result h2{color:#ffe58d;text-shadow:0 0 20px #ffc93d66}.case-result.gold-result>small{color:#ffe58d}
@keyframes gold-reveal-light{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.case-result.gold-result::before{animation:none}}

/* Separate catalog and full-viewport opening room. */
.case-catalog-page #selectedCase{display:none!important}
.case-catalog-page .case-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;overflow:visible;padding:12px 0 30px}
.case-catalog-page .case-choice{display:block;text-decoration:none;transition:border-color .18s,background .18s;padding:22px}
.case-catalog-page .case-choice:hover{border-color:var(--lime);background:#1c2913}
.case-catalog-page .case-choice:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
.case-catalog-page .case-choice img{height:165px}.case-catalog-page .case-choice>span{display:block;margin-top:20px;color:var(--lime);font-size:12px}
.case-open-page{min-height:100vh;min-height:100dvh}
.case-open-toolbar{position:fixed;right:24px;top:18px;z-index:20;display:flex;gap:10px;align-items:center}
.case-open-toolbar .case-exit{color:#f1f3e9;background:#0c120edf;border-color:#7b856e}
.case-exit span{font-size:22px;vertical-align:middle;margin-left:12px}
.case-open-page .case-main{max-width:none;width:100%;box-sizing:border-box;min-height:100dvh;padding:80px clamp(16px,4vw,70px) 28px}
.case-open-page #status{margin:0;text-align:center;min-height:0}.case-open-page #status:not(:empty){margin:0 0 12px}
.case-open-page .case-topline{position:relative;justify-content:center;align-items:center;text-align:center;margin:0 0 10px;min-height:65px}
.case-open-page .case-topline h2{font-size:clamp(23px,3vw,36px);margin:3px 0}.case-open-page .case-topline p{margin:2px 0}
.case-open-page .balance{position:absolute;left:0;top:8px;font-size:12px}
.case-open-page .case-stage{height:clamp(270px,46dvh,610px);border:0;border-radius:0;background:transparent;box-shadow:none}
.case-open-page .crate-area .case-model-poster{width:min(780px,90vw);max-width:90%;height:100%}
.case-open-page .case-result{border-radius:16px}.case-open-page .case-result>img{height:clamp(140px,23dvh,290px)}
.case-open-page .case-result>.case-cosmetic-preview{height:clamp(145px,23dvh,270px);width:220px}
.case-open-page .case-controls{padding:14px 0 0}.case-open-page .case-note{margin:12px 0 18px}
.case-open-page .contents-heading{margin:15px 0 10px}.case-open-page .contents-heading h2{font-size:15px}
.case-open-page .reward-pool{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:150px;gap:10px;overflow-x:auto;padding:0 0 12px;scrollbar-color:#747c65 #151b14}
.case-open-page .pool-card{padding:12px}.case-open-page .pool-card>.case-cosmetic-preview{height:115px}
.case-open-page .pool-card>img{height:115px}.case-open-page .pool-card strong{margin-top:8px}
@media(max-width:650px){
 .case-catalog-page .case-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.case-catalog-page .case-choice{padding:12px}.case-catalog-page .case-choice img{height:110px}
 .case-open-toolbar{top:12px;right:12px;gap:6px}.case-open-toolbar button{padding:8px 10px;font-size:12px}
 .case-open-page .case-main{padding:78px 12px 20px}.case-open-page .case-topline{flex-direction:column;gap:5px;min-height:80px}.case-open-page .balance{position:static;font-size:11px}
 .case-open-page .case-stage{height:clamp(280px,43dvh,470px)}.case-open-page .case-controls{flex-direction:row;gap:10px;flex-wrap:wrap}.case-open-page .open-case{min-width:160px;padding:12px 20px}
 .case-open-page .reward-pool{grid-auto-columns:135px}.case-open-page .contents-heading span{font-size:10px}
}

.case-catalog-page::before{content:none;background:none}.case-catalog-page .case-choice{min-width:0;overflow-wrap:anywhere}
