/* ===== 3D chest ===== */
.chest{--d:calc(var(--s)*.68);position:relative;width:calc(var(--s)*1.5);height:calc(var(--s)*1.3);perspective:calc(var(--s)*7);display:grid;place-items:center;flex:none}
.ch-3d{position:relative;width:0;height:0;transform-style:preserve-3d;transform:translateY(calc(var(--s)*.16)) rotateX(-18deg) rotateY(-30deg);animation:ch-sway 6s ease-in-out infinite}
.ch-base,.ch-lid{position:absolute;left:0;top:0;transform-style:preserve-3d}
.ch-lid{transform:translateY(calc(var(--s)*-.36));transform-origin:0 calc(var(--s)*.11) calc(var(--s)*-.36);transition:transform .7s cubic-bezier(.3,1.5,.5,1)}
.chest{--trim:#d9a640;--trim2:#fff0b8}.chest.trim-silver{--trim:#9fb0c4;--trim2:#f2f7ff}.chest.trim-bronze{--trim:#a8693a;--trim2:#f2c9a0}.chest.trim-black{--trim:#1b1f27;--trim2:#596273}
.chest .f{position:absolute;left:0;top:0;display:grid;place-items:center;--band:var(--trim);box-shadow:inset 0 0 0 calc(var(--s)*.028) var(--trim),inset 0 0 0 calc(var(--s)*.04) #0003}
.ch-base .front,.ch-base .back{width:var(--s);height:calc(var(--s)*.5);margin:calc(var(--s)*-.25) 0 0 calc(var(--s)*-.5)}
.ch-base .front{transform:translateZ(calc(var(--s)*.34))}.ch-base .back{transform:rotateY(180deg) translateZ(calc(var(--s)*.34))}
.ch-base .left,.ch-base .right{width:var(--d);height:calc(var(--s)*.5);margin:calc(var(--s)*-.25) 0 0 calc(var(--s)*-.34)}
.ch-base .left{transform:rotateY(-90deg) translateZ(calc(var(--s)*.5))}.ch-base .right{transform:rotateY(90deg) translateZ(calc(var(--s)*.5))}
.ch-base .bottom,.ch-base .inside{width:var(--s);height:var(--d);margin:calc(var(--s)*-.34) 0 0 calc(var(--s)*-.5)}
.ch-base .bottom{transform:rotateX(-90deg) translateZ(calc(var(--s)*.25))}.ch-base .inside{transform:rotateX(90deg) translateZ(calc(var(--s)*.22))}
.ch-lid .front,.ch-lid .back{width:calc(var(--s)*1.04);height:calc(var(--s)*.22);margin:calc(var(--s)*-.11) 0 0 calc(var(--s)*-.52)}
.ch-lid .front{transform:translateZ(calc(var(--s)*.36))}.ch-lid .back{transform:rotateY(180deg) translateZ(calc(var(--s)*.36))}
.ch-lid .left,.ch-lid .right{width:calc(var(--s)*.72);height:calc(var(--s)*.22);margin:calc(var(--s)*-.11) 0 0 calc(var(--s)*-.36)}
.ch-lid .left{transform:rotateY(-90deg) translateZ(calc(var(--s)*.52))}.ch-lid .right{transform:rotateY(90deg) translateZ(calc(var(--s)*.52))}
.ch-lid .top,.ch-lid .under{width:calc(var(--s)*1.04);height:calc(var(--s)*.72);margin:calc(var(--s)*-.36) 0 0 calc(var(--s)*-.52)}
.ch-lid .top{transform:rotateX(90deg) translateZ(calc(var(--s)*.11))}.ch-lid .under{transform:rotateX(-90deg) translateZ(calc(var(--s)*.11))}
.ch-base .front{background:linear-gradient(90deg,transparent 11%,var(--band) 11% 17%,transparent 17% 83%,var(--band) 83% 89%,transparent 89%),linear-gradient(hsl(var(--h) var(--sa) 54%),hsl(var(--h) var(--sa) 34%))}
.ch-base .left,.ch-base .right{background:linear-gradient(90deg,transparent 14%,var(--band) 14% 22%,transparent 22%),linear-gradient(hsl(var(--h) var(--sa) 36%),hsl(var(--h) var(--sa) 22%))}
.ch-base .back,.ch-base .bottom{background:hsl(var(--h) 55% 22%)}
.ch-base .inside{background:radial-gradient(circle,#fff7cf,hsl(var(--h) 95% 66%) 35%,hsl(var(--h) 60% 18%) 75%)}
.ch-lid .front{background:linear-gradient(90deg,transparent 10%,var(--band) 10% 16%,transparent 16% 84%,var(--band) 84% 90%,transparent 90%),linear-gradient(hsl(var(--h) var(--sa) 62%),hsl(var(--h) var(--sa) 44%))}
.ch-lid .left,.ch-lid .right{background:linear-gradient(hsl(var(--h) var(--sa) 44%),hsl(var(--h) var(--sa) 30%))}
.ch-lid .top{background:linear-gradient(90deg,transparent 10%,var(--band) 10% 16%,transparent 16% 84%,var(--band) 84% 90%,transparent 90%),linear-gradient(160deg,hsl(var(--h) var(--sa) 70%),hsl(var(--h) var(--sa) 48%))}
.ch-lid .back{background:hsl(var(--h) 55% 26%)}.ch-lid .under{background:radial-gradient(circle,hsl(var(--h) 90% 70%),hsl(var(--h) 55% 24%))}
.ch-emblem{width:calc(var(--s)*.32);height:calc(var(--s)*.32);border-radius:50%;background:radial-gradient(hsl(var(--h) 40% 22%),hsl(var(--h) 40% 12%));box-shadow:inset 0 0 0 calc(var(--s)*.022) var(--trim),0 0 0 calc(var(--s)*.012) #0005;display:grid;place-items:center}
.ch-emblem svg{width:78%;height:78%;filter:drop-shadow(0 0 5px hsl(var(--h) 90% 60% / .7))}
.ch-plate{width:34%;height:22%;border-radius:4px;background:linear-gradient(var(--trim2),var(--trim));box-shadow:0 1px 0 #0004}
.ch-new{position:absolute;top:4%;left:4%;z-index:3;font:800 calc(var(--s)*.11)/1 Golos,sans-serif;letter-spacing:.5px;padding:3px 6px;border-radius:5px;background:#2f8cf0;color:#fff;box-shadow:0 3px 8px #0006}
.ch-lock{position:absolute;bottom:-1px;width:calc(var(--s)*.12);height:calc(var(--s)*.15);border-radius:3px 3px 5px 5px;background:linear-gradient(var(--trim2),var(--trim))}
.ch-glow{position:absolute;width:120%;height:90%;border-radius:50%;background:radial-gradient(hsl(var(--h) 90% 60% / .5),transparent 65%);filter:blur(8px);transition:transform .6s,opacity .6s}
.ch-shadow{position:absolute;bottom:4%;width:85%;height:10%;border-radius:50%;background:#000a;filter:blur(8px)}
.ch-buba{position:absolute;z-index:2;width:calc(var(--s)*.58);left:50%;top:calc(var(--s)*-.06);transform:translateX(-22%) rotate(7deg);filter:drop-shadow(0 6px 8px #0007);animation:bob 3s ease-in-out infinite}
.chest.bouncy .ch-lid{animation:lid-peek 3s ease-in-out infinite}
.chest.shake{animation:ch-shake .12s linear infinite}
.chest.open .ch-lid{transform:translateY(calc(var(--s)*-.36)) rotateX(112deg)}
.chest.open .ch-glow{transform:scale(1.6);opacity:1;background:radial-gradient(#fff6c0,hsl(var(--h) 95% 62% / .7) 30%,transparent 65%)}
.chest.open .ch-buba{animation:none;transform:translate(-22%,-30%) rotate(-6deg) scale(1.05);transition:transform .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes ch-sway{0%,100%{transform:translateY(calc(var(--s)*.16)) rotateX(-18deg) rotateY(-36deg)}50%{transform:translateY(calc(var(--s)*.1)) rotateX(-16deg) rotateY(-22deg)}}
@keyframes lid-peek{0%,62%,100%{transform:translateY(calc(var(--s)*-.36))}74%{transform:translateY(calc(var(--s)*-.36)) rotateX(38deg)}84%{transform:translateY(calc(var(--s)*-.36)) rotateX(-4deg)}}
@keyframes ch-shake{25%{transform:translate(-2px,1px) rotate(-1.5deg)}75%{transform:translate(2px,-1px) rotate(1.5deg)}}

/* ===== games home ===== */
.games-home{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
.promos{scroll-snap-type:x mandatory;gap:10px}
.promo{position:relative;flex:none;width:86%;height:150px;border-radius:var(--r-lg);overflow:hidden;isolation:isolate;scroll-snap-align:start;box-shadow:inset 0 0 0 1px #ffffff26}
.promo-buba{background:radial-gradient(circle at 80% 40%,#8fdcff,#3aa7ff 30%,transparent 60%),linear-gradient(115deg,#0a4fa8,#1c84e6 60%,#4cbcff)}
.promo-up{background:radial-gradient(circle at 78% 45%,#ffd36b88,transparent 50%),linear-gradient(115deg,#5b2a8f,#a03c8a 55%,#f0786a)}
.promo-copy{position:absolute;left:16px;top:14px;z-index:3}
.promo h2{font:800 22px/1 Unbounded,sans-serif;letter-spacing:-.5px;text-shadow:0 3px 12px #0005}
.promo p{font-size:12px;opacity:.88;margin-top:6px}
.promo-btn{display:inline-flex;align-items:center;gap:2px;margin-top:12px;height:32px;padding:0 10px 0 14px;border-radius:12px;background:#ffffff2e;font-weight:700;font-size:13px;backdrop-filter:blur(6px)}.promo-btn svg{width:16px;height:16px}
.promo-chest{position:absolute;right:62px;bottom:-12px;z-index:1}
.promo p{max-width:150px}
.promo-mascot{position:absolute;right:-14px;bottom:-22px;width:118px;height:auto;z-index:2;animation:wave 4s ease-in-out infinite;transform-origin:50% 90%;filter:drop-shadow(0 8px 12px #0a2f5c66)}
.promo-items{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:4px}
.promo-items b{font-size:20px;opacity:.8}.promo-items .big{animation:bob 3s ease-in-out infinite;filter:drop-shadow(0 0 16px #ffd36b88)}
.topup-row{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:var(--r);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);text-align:left}
.topup-row span:nth-child(2){flex:1;display:grid}.topup-row small{color:var(--muted);font-size:12px}.topup-row>svg{width:20px;height:20px;color:var(--muted)}
.tr-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#3ea6ff1f}.tr-ic .coin{width:26px;height:26px}
.games-title{font:800 26px/1 Unbounded,sans-serif;letter-spacing:-.5px;margin-top:4px}
.gtiles{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"cases mines" "rocket mines" "upgrade upgrade";grid-auto-rows:168px;gap:10px}
.gt{position:relative;border-radius:22px;overflow:hidden;isolation:isolate;box-shadow:inset 0 0 0 1px #ffffff1c,0 8px 20px #0003;transition:transform .15s}
.gt:active{transform:scale(.97)}
.gt-copy{position:absolute;z-index:4;left:12px;right:10px;bottom:11px}
.gt-copy b{display:block;font:800 21px/1 Unbounded,sans-serif;letter-spacing:-.5px;text-shadow:0 3px 12px #000a}
.gt-copy small{display:block;margin-top:4px;font-size:11px;font-weight:600;opacity:.8}
.gt::after{content:"";position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(transparent,#0000006b);z-index:3;pointer-events:none}
.gt-tag,.gt-new{position:absolute;z-index:4;top:9px;left:10px;display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:10px;background:#0000004d;backdrop-filter:blur(6px)}
.gt-new{left:auto;right:12px;top:12px;color:#ffe39a;background:#ffd36b26;transform:rotate(6deg)}
.gt-cases{grid-area:cases;background:radial-gradient(circle at 50% 35%,#2fd0c2 0,#127e8c 45%,#0b3d52 100%)}
.gt-cases .gt-art{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%)}
.sp{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 10px 3px #fffa;animation:twinkle 3s ease-in-out infinite}.s1{left:8%;top:18%}.s2{right:4%;top:6%;animation-delay:1s}.s3{right:10%;bottom:28%;animation-delay:2s}
.gt-mines{grid-area:mines;background:linear-gradient(170deg,#1d2a40,#141c2b)}
.mines-board{position:absolute;inset:12px 10px 62px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(6,1fr);gap:6px}
.mc{border-radius:10px;background:#263752;box-shadow:inset 0 -3px #0003;display:grid;place-items:center}
.mc svg{width:60%;height:60%}
.mc.g,.mc.b{animation:cell-reveal 6s var(--d) ease-in-out infinite}
.mc.g svg,.mc.b .bomb{animation:cell-icon 6s var(--d) ease-in-out infinite}
.mc .bomb{width:42%;aspect-ratio:1;border-radius:50%;background:#0f1520;box-shadow:3px -3px 0 -1px #ffb03a}
.mc.b{--rv:#4a2230;--rb:#ff5f6d}
@keyframes cell-reveal{0%,12%,88%,100%{background:#263752;box-shadow:inset 0 -3px #0003}22%,78%{background:var(--rv,#1f4a4a);box-shadow:0 0 0 2px var(--rb,#3ee6a0),0 0 14px var(--rb,#3ee6a0)}}
@keyframes cell-icon{0%,12%,88%,100%{opacity:0;transform:scale(.4)}22%,78%{opacity:1;transform:scale(1)}}
.gt-rocket{grid-area:rocket;background:radial-gradient(circle at 70% 20%,#1f6d8c,transparent 60%),linear-gradient(160deg,#123a3b,#0e2a33)}
.gt-pattern{position:absolute;inset:-40px;background-image:radial-gradient(#ffffff22 1.5px,transparent 2px);background-size:22px 22px;animation:drift 6s linear infinite}
@keyframes drift{to{transform:translate(-22px,22px)}}
.rk-fly{position:absolute;left:30%;top:16%;animation:rk-fly 3s ease-in-out infinite}.rk-fly svg{transform:rotate(42deg)}
.rk-fire{position:absolute;left:4px;bottom:0;width:22px;height:22px;border-radius:50%;background:radial-gradient(#fff6c0,#5dff9c 45%,transparent 70%);animation:flame .18s infinite alternate}
.rk-trail{position:absolute;left:-10%;top:58%;width:70%;height:6px;border-radius:3px;background:linear-gradient(90deg,transparent,#5dff9c88);transform:rotate(-38deg);filter:blur(1px);animation:rk-trail 3s ease-in-out infinite}
.rk-mult{position:absolute;z-index:4;right:12px;top:12px;font:800 17px Unbounded,sans-serif;color:#7dffb5;text-shadow:0 0 12px #3ee6a088;font-variant-numeric:tabular-nums}
.gt-rocket.boom .rk-mult{color:var(--bad);text-shadow:0 0 12px #ff5f6d88}.gt-rocket.boom .rk-fly{animation:none;opacity:0;transition:opacity .2s}
@keyframes rk-fly{0%,100%{transform:translate(0,6px)}50%{transform:translate(10px,-6px)}}
@keyframes rk-trail{50%{opacity:.5;transform:rotate(-38deg) translateX(8px)}}
@keyframes flame{to{transform:scale(1.3);opacity:.7}}
.gt-upgrade{grid-area:upgrade;background:linear-gradient(110deg,#2c1748,#4a1f5c 50%,#2a1640)}
.gt-rays{position:absolute;left:50%;top:50%;width:520px;height:520px;margin:-260px 0 0 -260px;background:repeating-conic-gradient(#ffffff0d 0 8deg,transparent 8deg 18deg);animation:spin 30s linear infinite}
.up-mini{position:absolute;right:16px;top:50%;transform:translateY(-58%);display:flex;align-items:center;gap:8px;z-index:2}
.up-mini .to{animation:bob 3s ease-in-out infinite;filter:drop-shadow(0 0 14px #6cc6ff88)}
.up-mini-ring{position:relative;width:78px;height:78px}.up-mini-ring svg{width:100%;height:100%}
.up-mini-ring .arc{stroke-dasharray:90 252;animation:arc 6s ease-in-out infinite}
.up-mini-ring .needle{position:absolute;left:50%;top:7px;width:3px;height:32px;margin-left:-1.5px;border-radius:2px;background:#fff;transform-origin:50% 100%;animation:needle 6s cubic-bezier(.3,.7,.3,1) infinite}
@keyframes needle{0%{transform:rotate(0)}60%,100%{transform:rotate(1150deg)}}
@keyframes arc{50%{stroke-dasharray:130 252}}
.offscreen,.offscreen *{animation-play-state:paused!important}
@keyframes wave{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-5px)}}
@keyframes twinkle{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1)}}
.feed-title{font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;margin-bottom:8px}
.live-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);animation:twinkle 2s infinite}
.feed-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}.feed-row::-webkit-scrollbar{display:none}
.feed-chip{flex:none;width:58px;height:58px;border-radius:16px;background:var(--card);display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--line)}
.feed-chip.mult{align-content:center;gap:0}.feed-chip.mult b{font-size:13px;color:var(--ok)}.feed-chip.mult small{font-size:9px;color:var(--muted)}

/* ===== cases ===== */
.cat-title{font:800 19px/1.1 Unbounded,sans-serif;letter-spacing:-.4px;margin:4px 0 10px}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.case-card{border-radius:22px;overflow:hidden;background:radial-gradient(circle at 50% 30%,hsl(var(--h) 60% 34%),hsl(var(--h) 45% 16%) 70%);box-shadow:inset 0 0 0 1px hsl(var(--h) 60% 60% / .25);transition:transform .15s}
.case-card:active{transform:scale(.97)}
.cc-stage{height:104px;display:grid;place-items:center}
.cc-foot{padding:8px 9px 10px;background:#0b111a66;display:grid;gap:6px;justify-items:start}
.cc-foot b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.cc-price{display:inline-flex;align-items:center;gap:4px;font-weight:800;font-size:13px;padding:4px 9px;border-radius:10px;background:hsl(var(--h) 80% 60% / .22);color:hsl(var(--h) 90% 82%)}
.case-hero{display:flex;align-items:center;gap:6px;padding:6px 10px 6px 0;border-radius:var(--r-lg);background:radial-gradient(circle at 25% 50%,hsl(var(--h) 55% 30%),transparent 60%)}
.case-hero h1{font:800 26px/1.05 Unbounded,sans-serif;letter-spacing:-.6px;margin-top:4px}
.cat-label{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:hsl(var(--h) 90% 72%)}
.label-sm{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.count-seg{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.count-seg button{height:46px;border-radius:14px;background:var(--card);font-weight:800;font-size:17px;box-shadow:inset 0 0 0 1px var(--line)}
.count-seg button.on{background:hsl(var(--h) 80% 60%);color:#fff;box-shadow:0 6px 16px hsl(var(--h) 80% 50% / .35)}
.btn-gold{background:linear-gradient(180deg,hsl(var(--h,205) 85% 66%),hsl(var(--h,205) 72% 46%));color:#fff;box-shadow:0 8px 20px hsl(var(--h,205) 80% 45% / .35);text-shadow:0 1px 2px #0004}
.drop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.drop{position:relative;display:grid;gap:2px;padding:8px 8px 10px;border-radius:16px;background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--rc) 22%,var(--card)),var(--card) 70%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rc) 35%,transparent)}
.drop-art{display:grid;place-items:center;padding:4px 0}.drop-art svg{width:72%;height:auto;filter:drop-shadow(0 6px 8px #0006)}
.drop b{font-size:12px;line-height:1.2}.drop small{display:flex;align-items:center;gap:3px;font-size:11.5px;color:var(--muted);font-weight:700}
.odds-text{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px}.odds-text li{display:flex;justify-content:space-between;border-bottom:1px dashed var(--line);padding-bottom:3px}
.reel-wrap{position:relative;padding:8px 0;border-radius:var(--r);background:#ffffff0a;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.reel-pointer{position:absolute;z-index:2;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(hsl(var(--h,205) 90% 70%),transparent 40% 60%,hsl(var(--h,205) 90% 70%))}
.reel-pointer::before,.reel-pointer::after{content:"";position:absolute;left:50%;transform:translateX(-50%);border:7px solid transparent}
.reel-pointer::before{top:0;border-top:9px solid hsl(var(--h,205) 90% 70%)}.reel-pointer::after{bottom:0;border-bottom:9px solid hsl(var(--h,205) 90% 70%)}
.reel{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
.reel-track{display:flex;gap:8px;padding:0 8px;will-change:transform}
.reel-cell{flex:none;width:84px;height:88px;border-radius:14px;display:grid;place-items:center;background:var(--card2);box-shadow:inset 0 -3px 0 var(--rc)}
.op-reels.n3 .reel-cell,.op-reels.n4 .reel-cell,.op-reels.n5 .reel-cell{width:62px;height:58px}
.opening{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:calc(var(--top) + 20px) 16px calc(var(--bottom) + 80px);opacity:0;transition:opacity .25s}
.opening.in{opacity:1}.opening.out{opacity:0}
.op-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 38%,hsl(var(--h) 60% 22%),#0b1018 70%)}
.op-chest{position:relative;transition:transform .6s,opacity .6s}
.opening.reels .op-chest{transform:translateY(-10px) scale(.62);opacity:.35;margin:-40px 0}
.op-burst{position:absolute;left:50%;top:40%;width:10px;height:10px;border-radius:50%;opacity:0}
.op-chest .chest.open~.op-burst{animation:burst 1s ease-out forwards}
@keyframes burst{0%{opacity:1;box-shadow:0 0 0 0 #fff8}100%{opacity:0;box-shadow:0 0 0 160px #fff0}}
.op-reels{display:none;width:100%;max-width:440px;gap:8px;flex-direction:column}
.opening.reels .op-reels{display:flex;animation:prize-in .4s}
.op-copy{text-align:center}.op-copy small{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:hsl(var(--h) 90% 72%)}
.op-copy h2{font:800 26px/1.15 Unbounded,sans-serif;letter-spacing:-.6px;margin:6px 0 4px}.op-copy p{color:var(--muted);font-size:14px}
.op-skip{position:absolute;bottom:calc(var(--bottom) + 26px);height:38px;padding:0 16px;border-radius:20px;background:#ffffff12;color:var(--muted);font-size:13px;font-weight:600;box-shadow:inset 0 0 0 1px var(--line2)}
.prize{position:relative;display:grid;justify-items:center;gap:8px;padding:10px 0}
.prize svg{position:relative;animation:prize-in .6s cubic-bezier(.2,1.4,.4,1)}
.prize-glow{position:absolute;top:0;width:220px;height:220px;border-radius:50%;background:radial-gradient(var(--rc),transparent 65%);opacity:.45;animation:spin 8s linear infinite}
.prize h3{font-size:22px}
.prize-multi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pm{display:grid;justify-items:center;gap:2px;padding:8px;border-radius:14px;background:var(--card);box-shadow:inset 0 -3px 0 var(--rc);text-align:center;animation:prize-in .5s backwards}
.pm:nth-child(2){animation-delay:.08s}.pm:nth-child(3){animation-delay:.16s}.pm:nth-child(4){animation-delay:.24s}.pm:nth-child(5){animation-delay:.32s}
.pm b{font-size:12px}.pm small{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--muted)}
@keyframes prize-in{from{transform:scale(.3) rotate(-20deg);opacity:0}}
@media (max-width:370px){.gtiles{grid-auto-rows:150px}.gt-copy b{font-size:18px}.promo h2{font-size:19px}.drop-grid{grid-template-columns:repeat(2,1fr)}.feed-row{margin:0 -12px;padding:0 12px}}
@media (prefers-reduced-motion:reduce){.chest *,.gt *{animation:none!important}}

/* case surface patterns (overlay on visible faces) */
.chest .front::before,.chest .left::before,.chest .right::before,.chest .top::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;mix-blend-mode:overlay}
.pat-dots .f::before{background:radial-gradient(#fff 18%,transparent 20%) 0 0/calc(var(--s)*.1) calc(var(--s)*.1)}
.pat-stripes .f::before{background:repeating-linear-gradient(135deg,#fff 0 calc(var(--s)*.03),transparent 0 calc(var(--s)*.08));opacity:.4}
.pat-camo .f::before{background:radial-gradient(circle at 20% 30%,#0008 0 14%,transparent 15%),radial-gradient(circle at 70% 60%,#fff6 0 16%,transparent 17%),radial-gradient(circle at 40% 80%,#0007 0 12%,transparent 13%),radial-gradient(circle at 85% 20%,#0006 0 10%,transparent 11%);opacity:.7}
.pat-carbon .f::before{background:repeating-linear-gradient(45deg,#0005 0 3px,transparent 3px 6px),repeating-linear-gradient(-45deg,#fff2 0 3px,transparent 3px 6px);opacity:.8}
.pat-waves .f::before{background:radial-gradient(circle at 50% 100%,transparent 40%,#fff6 42% 48%,transparent 50%) 0 0/calc(var(--s)*.16) calc(var(--s)*.1)}
.pat-plaid .f::before{background:repeating-linear-gradient(90deg,#0004 0 calc(var(--s)*.04),transparent 0 calc(var(--s)*.12)),repeating-linear-gradient(0deg,#fff3 0 calc(var(--s)*.04),transparent 0 calc(var(--s)*.12))}
.pat-galaxy .f::before{background:radial-gradient(#fff 1px,transparent 1.5px) 0 0/9px 9px,radial-gradient(#fff 1px,transparent 1.5px) 4px 5px/13px 13px,radial-gradient(circle at 30% 40%,#ff7af855,transparent 40%);opacity:.9;mix-blend-mode:screen}
.pat-rhombus .f::before{background:linear-gradient(135deg,#fff5 25%,transparent 25%) -6px 0/12px 12px,linear-gradient(225deg,#fff5 25%,transparent 25%) -6px 0/12px 12px,linear-gradient(315deg,#fff5 25%,transparent 25%) 0 0/12px 12px,linear-gradient(45deg,#fff5 25%,transparent 25%) 0 0/12px 12px;opacity:.45}
.pat-scales .f::before{background:radial-gradient(circle at 50% 0,transparent 55%,#fff5 57% 62%,transparent 64%) 0 0/12px 9px}
.pat-sunburst .f::before{background:repeating-conic-gradient(from 0deg at 50% 50%,#ffd27a33 0 8deg,transparent 8deg 16deg);opacity:.9;mix-blend-mode:screen}