:root{--accent:#ffcf4a;--accent2:#ff4d2e;--bg1:#2a0508;--bg2:#5c0a10;--glow:#ff9d2e;
  --gold:linear-gradient(180deg,#fff7c2 0%,#ffd84a 22%,#c98208 52%,#ffd447 78%,#8a5200 100%);
  --goldh:linear-gradient(135deg,#fff6c0,#c98a0a 30%,#fff1a0 50%,#8a5200 72%,#ffe27a)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#0c0103;color:#fff;font-family:"Trebuchet MS","Segoe UI",system-ui,sans-serif;overscroll-behavior:none;user-select:none;-webkit-user-select:none}
body{background:radial-gradient(120% 70% at 50% 30%,var(--bg2),var(--bg1) 60%,#050001);background-attachment:fixed;overflow-x:hidden}
body::before{content:"";position:fixed;inset:-50%;background:conic-gradient(from 0deg,transparent 0 20deg,rgba(255,210,90,.05) 20deg 30deg,transparent 30deg 60deg,rgba(255,210,90,.05) 60deg 70deg,transparent 70deg 110deg,rgba(255,210,90,.05) 110deg 120deg,transparent 120deg);animation:spinbg 60s linear infinite;pointer-events:none}
body.theme-pharaoh::after,body.theme-dragon::after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(60% 35% at 50% 100%,color-mix(in srgb,var(--glow) 35%,transparent),transparent)}
@keyframes spinbg{to{transform:rotate(360deg)}}
#bg,#fx,#stars{position:fixed;inset:0;pointer-events:none}#stars{z-index:65}#bg{z-index:0}#fx{z-index:60}
#app{position:relative;z-index:1;max-width:520px;margin:0 auto;min-height:100%;padding:env(safe-area-inset-top) 10px calc(env(safe-area-inset-bottom) + 10px)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
/* top bar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 2px 6px}
.brand{font-family:Georgia,serif;font-weight:900;font-size:22px;letter-spacing:2px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #4a1a00) drop-shadow(0 0 10px rgba(255,190,60,.5))}
.brand span{color:transparent}
.balpill{display:flex;align-items:center;gap:6px;padding:5px 14px 5px 6px;border-radius:30px;background:linear-gradient(#1a0a00,#000) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 0 16px rgba(255,200,80,.25),inset 0 2px 8px rgba(0,0,0,.8)}
.balpill i{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6c0,#ffd23f 45%,#a85f00);box-shadow:0 0 8px #ffcf4a}
.balpill b{font-size:18px;color:#ffe9a0;text-shadow:0 0 8px rgba(255,200,80,.7);min-width:60px;text-align:right;font-variant-numeric:tabular-nums}
.balpill small{font-size:9px;opacity:.7;letter-spacing:1px}
.balpill.bump{animation:bump .4s}
@keyframes bump{50%{transform:scale(1.12);box-shadow:0 0 30px #ffcf4a}}
.iconbtn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:22px;background:linear-gradient(#3a1a08,#100400) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 3px 0 #000}
.iconbtn:active{transform:translateY(2px)}
/* lobby */
.lobby-hero{text-align:center;margin:10px 0 14px}
.lobby-hero h1{margin:0;font-family:Georgia,serif;font-size:26px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #3a1000)}
.lobby-hero p{margin:4px 0 0;opacity:.6;font-size:13px}
.machines{display:grid;gap:14px}
.mcard{position:relative;display:flex;align-items:center;gap:10px;min-height:150px;padding:12px;border-radius:20px;overflow:hidden;
  background:radial-gradient(100% 120% at 20% 50%,var(--b),var(--c)) padding-box,var(--goldh) border-box;border:3px solid transparent;
  box-shadow:0 10px 30px rgba(0,0,0,.6),0 0 20px color-mix(in srgb,var(--g) 40%,transparent),inset 0 0 30px rgba(0,0,0,.6);transition:transform .2s}
.mcard:active{transform:scale(.97)}
.mcard::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.25) 50%,transparent 60%);transform:translateX(-100%);animation:sweep 3.5s infinite}
@keyframes sweep{60%,100%{transform:translateX(100%)}}
.mart{position:relative;width:130px;height:120px;flex:none}
.mart img{position:absolute;width:84px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.6))}
.mart .m0{left:22px;top:14px;width:94px;z-index:2;animation:float 3s ease-in-out infinite}
.mart .m1{left:-8px;top:40px;transform:rotate(-12deg)}
.mart .m2{left:64px;top:46px;transform:rotate(12deg);animation:float 3s 1.5s ease-in-out infinite}
@keyframes float{50%{translate:0 -6px}}
.minfo{flex:1;min-width:0}
.minfo h2{margin:0;font-family:Georgia,serif;font-size:22px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #000)}
.minfo p{margin:4px 0 8px;font-size:12px;opacity:.8}
.mjp{display:inline-flex;gap:6px;align-items:center;font-weight:900;color:#fff2b0;font-size:15px;padding:3px 10px;border-radius:10px;background:rgba(0,0,0,.45);border:1px solid rgba(255,210,90,.5)}
.mjp span{font-size:10px;color:#ff6b5a;letter-spacing:1px}
.playbtn{position:absolute;right:12px;bottom:12px;padding:8px 18px;border-radius:20px;font-weight:900;color:#3a1500;background:var(--gold);box-shadow:0 3px 0 #6a3a00,0 0 16px rgba(255,200,80,.6);animation:pulse 1.6s infinite}
.hot{position:absolute;right:-26px;top:10px;transform:rotate(40deg);background:linear-gradient(#ff4d2e,#a30010);padding:3px 30px;font-size:11px;font-weight:900;letter-spacing:2px}
.mcard.soon{min-height:70px;opacity:.5;--b:#222;--c:#111;--g:transparent;justify-content:center;text-align:center}
.mcard.soon::after{display:none}
.emptybal{margin:16px 0;text-align:center;padding:12px;border-radius:14px;background:rgba(0,0,0,.4);border:1px dashed rgba(255,210,90,.5)}
@keyframes pulse{50%{transform:scale(1.06)}}
/* game */
.game{display:flex;flex-direction:column;min-height:calc(100vh - 20px);min-height:calc(100dvh - 20px)}
.jackpots{display:grid;grid-template-columns:1.3fr 1.1fr 1fr 1fr;gap:5px;margin:4px 0}
.jp{position:relative;text-align:center;padding:4px 2px 5px;border-radius:10px;overflow:hidden;border:2px solid transparent;box-shadow:0 0 12px rgba(0,0,0,.6),inset 0 0 10px rgba(0,0,0,.5)}
.jp span{display:block;font-size:10px;font-weight:900;letter-spacing:2px}
.jp b{font-size:14px;font-variant-numeric:tabular-nums;text-shadow:0 1px 0 #000,0 0 8px currentColor}
.jp-grand{background:linear-gradient(#a3000a,#3a0003) padding-box,var(--goldh) border-box;color:#ffe27a}
.jp-major{background:linear-gradient(#6a1aa8,#200038) padding-box,var(--goldh) border-box;color:#f0c8ff}
.jp-minor{background:linear-gradient(#0d5ab0,#00183a) padding-box,var(--goldh) border-box;color:#bfe3ff}
.jp-mini{background:linear-gradient(#138a3a,#002a10) padding-box,var(--goldh) border-box;color:#c8ffd8}
.jp::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.35) 50%,transparent 60%);animation:sweep 4s infinite}
.jp-grand b{font-size:16px;animation:glowtxt 1.5s infinite}
@keyframes glowtxt{50%{text-shadow:0 0 16px #ffcf4a,0 0 4px #fff}}
.logo{text-align:center;margin:2px 0 0}
.logo-t{display:inline-block;font-family:Georgia,serif;font-weight:900;font-size:30px;letter-spacing:1px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 #3a1000) drop-shadow(0 0 14px color-mix(in srgb,var(--glow) 70%,transparent));animation:logo 3s ease-in-out infinite}
@keyframes logo{50%{transform:scale(1.03)}}
.fsbar{display:none;justify-content:center;align-items:center;gap:14px;font-weight:900;color:#fff2b0;margin:2px 0}
.fsbar b{font-size:20px;color:#fff}
body.freespins .fsbar{display:flex}
body.freespins .logo{display:none}
.multbadge{font-size:26px;font-family:Georgia,serif;padding:0 14px;border-radius:14px;background:linear-gradient(#ff4d2e,#7a0008) padding-box,var(--goldh) border-box;border:3px solid transparent;box-shadow:0 0 20px #ff4d2e}
.multbadge.pop{animation:mpop .6s}
@keyframes mpop{0%{transform:scale(2.2);filter:brightness(2)}100%{transform:scale(1)}}
/* frame */
.frame{position:relative;margin:6px 0;padding:9px;border-radius:22px;
  background:linear-gradient(160deg,#fff4b8,#d8950e 18%,#fff0a0 32%,#8a5200 52%,#ffd85a 70%,#7a4300 88%,#ffe680);
  box-shadow:0 0 0 2px #3a1800,0 0 30px color-mix(in srgb,var(--glow) 60%,transparent),0 18px 40px rgba(0,0,0,.8),inset 0 2px 2px #fff}
body.freespins .frame{animation:fsglow 1.5s infinite}
@keyframes fsglow{50%{box-shadow:0 0 0 2px #3a1800,0 0 60px var(--accent2),0 18px 40px rgba(0,0,0,.8)}}
.jewel{position:absolute;z-index:5;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ff5a6e 25%,#b0001a 60%,#3a0008);box-shadow:0 0 10px #ff2a4a,0 0 0 3px #ffd85a,0 0 0 5px #6a3a00}
body.theme-pharaoh .jewel{background:radial-gradient(circle at 35% 30%,#fff,#5ff0ff 25%,#0b7aa8 60%,#022a3a);box-shadow:0 0 10px #46e3ff,0 0 0 3px #ffd85a,0 0 0 5px #6a3a00}
.jewel.tl{left:-6px;top:-6px}.jewel.tr{right:-6px;top:-6px}.jewel.bl{left:-6px;bottom:-6px}.jewel.br{right:-6px;bottom:-6px}
.reels{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;aspect-ratio:5/3.05;padding:4px;border-radius:14px;
  background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--bg2) 80%,#000),#070001);box-shadow:inset 0 0 20px #000,inset 0 0 0 2px rgba(0,0,0,.8)}
.reel{position:relative;overflow:hidden;border-radius:8px;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.05) 50%,rgba(0,0,0,.35))}
.reel::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(0,0,0,.55),transparent 18%,transparent 82%,rgba(0,0,0,.55))}
.reel.tease{box-shadow:0 0 0 2px #fff6a0,0 0 25px var(--accent),inset 0 0 30px var(--accent);animation:tease .3s infinite alternate}
@keyframes tease{to{box-shadow:0 0 0 2px #fff,0 0 40px var(--accent2),inset 0 0 40px var(--accent2)}}
.strip{position:absolute;left:0;right:0;top:0;will-change:transform}
.strip.blur{filter:blur(2.5px) brightness(1.1)}
.cell{position:relative;height:calc((100cqh)/3);display:grid;place-items:center}
.reel{container-type:size}
.cell img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 4px 4px rgba(0,0,0,.6))}
.cv{position:absolute;left:50%;top:52%;translate:-50% -50%;font-weight:900;font-size:clamp(11px,4.2cqw,20px);color:#fff;white-space:nowrap;
  text-shadow:0 0 2px #000,0 2px 0 #5a1a00,0 0 8px #ffcf4a;font-family:Georgia,serif;pointer-events:none}
.reel .cv{font-size:clamp(10px,17cqw,18px)}
.cv.jpv{color:#ffe27a;font-size:clamp(9px,14cqw,15px);letter-spacing:.5px;text-shadow:0 0 2px #000,0 2px 0 #000,0 0 10px #ff4d2e}
.cell.landed img{animation:land .6s}
@keyframes land{30%{transform:scale(1.25);filter:brightness(1.6) drop-shadow(0 0 14px #fff6a0)}}
.cell.win img{animation:winpulse .9s ease-in-out infinite;filter:drop-shadow(0 0 10px var(--accent)) drop-shadow(0 0 4px #fff)}
.cell.win{background:radial-gradient(circle,color-mix(in srgb,var(--accent) 35%,transparent),transparent 70%);overflow:hidden}
.cell.win::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.65) 50%,transparent 65%);animation:sweep 1.2s infinite}
.cell.dim img{filter:brightness(.35) saturate(.5)}
@keyframes winpulse{50%{transform:scale(1.12) rotate(-2deg)}}
.lines{position:absolute;inset:4px;width:calc(100% - 8px);height:calc(100% - 8px);pointer-events:none;overflow:visible}
.lines polyline{fill:none;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px currentColor) drop-shadow(0 0 2px #000);vector-effect:non-scaling-stroke;animation:dash 1s ease-out}
@keyframes dash{from{stroke-dasharray:0 2000}to{stroke-dasharray:2000 0}}
/* hold & win */
.hw{position:absolute;inset:0;display:none;border-radius:14px;background:radial-gradient(circle,#2a0a40,#07000f);padding:4px;z-index:3}
body.theme-pharaoh .hw{background:radial-gradient(circle,#0b3a5a,#010a14)}
.hw.show{display:block;animation:fadein .4s}
.hwgrid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(3,1fr);gap:4px;height:100%}
.hwc{position:relative;border-radius:8px;display:grid;place-items:center;container-type:size;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,210,90,.25),inset 0 0 12px rgba(0,0,0,.8)}
.hwc img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 0 8px #ffcf4a)}
.hwc .cv{font-size:clamp(10px,20cqw,18px)}
.hwc.coin{background:radial-gradient(circle,rgba(255,200,60,.35),transparent 70%)}
.hwc.fresh{animation:coinin .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes coinin{from{transform:scale(2.4) translateY(-30px);opacity:0;filter:brightness(3)}}
.hwc.spinning::before{content:"";position:absolute;inset:10%;border-radius:50%;background:conic-gradient(var(--accent),transparent,var(--accent2),transparent,var(--accent));animation:spinbg .4s linear infinite;opacity:.5}
.hwc.collect{animation:collect .4s}
@keyframes collect{50%{transform:scale(1.25);filter:brightness(2)}}
.respins{position:absolute;left:50%;bottom:-38px;translate:-50% 0;display:flex;align-items:center;gap:8px;padding:4px 14px;border-radius:20px;background:#000c;border:2px solid #ffcf4a;font-weight:900;font-size:12px;letter-spacing:2px;white-space:nowrap}
.respins i{width:16px;height:16px;border-radius:50%;background:#333;box-shadow:inset 0 2px 3px #000}
.respins i.on{background:radial-gradient(circle at 35% 30%,#fff,#ffd23f 40%,#c27a00);box-shadow:0 0 10px #ffcf4a}
body.holdwin .winbar{margin-top:40px}
/* win bar */
.winbar{text-align:center;min-height:58px;margin:4px 0}
.winlabel{font-size:12px;letter-spacing:2px;font-weight:900;color:color-mix(in srgb,var(--accent) 80%,#fff);opacity:.9}
.winamt{font-family:Georgia,serif;font-size:34px;font-weight:900;line-height:1.1;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #3a1000) drop-shadow(0 0 10px rgba(255,200,80,.6));font-variant-numeric:tabular-nums}
/* controls */
.controls{margin-top:auto;padding:10px;border-radius:20px;background:linear-gradient(#1c0a06e6,#070100f0) padding-box,linear-gradient(#ffe27a,#6a3a00) border-box;border:2px solid transparent;box-shadow:0 -6px 30px rgba(0,0,0,.6)}
.ctl-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ctl-row.main{margin-top:8px;justify-content:space-around}
.pill{padding:9px 12px;border-radius:14px;font-weight:900;font-size:12px;letter-spacing:1px;background:linear-gradient(#4a2a10,#1a0800) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 3px 0 #000;color:#ffe9a0;transition:transform .1s;display:inline-block;text-align:center}
.pill:active,.round:active{transform:translateY(2px) scale(.96);box-shadow:0 1px 0 #000}
.pill.gold{background:var(--gold);color:#3a1500;box-shadow:0 3px 0 #6a3a00,0 0 14px rgba(255,200,80,.5)}
.betbox{display:flex;align-items:center;gap:6px}
.betval{text-align:center;min-width:76px;padding:4px 8px;border-radius:12px;background:#000;box-shadow:inset 0 2px 6px #000,0 0 0 1px rgba(255,210,90,.4)}
.betval small{display:block;font-size:9px;opacity:.6;letter-spacing:1px}
.betval b{font-size:18px;color:#ffe9a0}
.round{border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 40% 30%,#6a3a18,#1a0800) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 3px 0 #000,inset 0 2px 4px rgba(255,255,255,.2);font-weight:900;color:#ffe9a0}
.round.sm{width:36px;height:36px;font-size:22px}
.round.side{width:62px;height:62px;font-size:22px;line-height:1}
.round.side small{font-size:9px;letter-spacing:1px;display:block}
.round.on{background:radial-gradient(circle at 40% 30%,#ff8a5a,#a3000a) padding-box,var(--goldh) border-box;box-shadow:0 0 18px var(--accent2),0 3px 0 #000;color:#fff}
.spinbtn{position:relative;width:104px;height:104px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 40% 28%,#fff6c0,#ffcf3a 25%,#d07a00 55%,#7a3a00 85%);box-shadow:0 6px 0 #4a2000,0 0 30px color-mix(in srgb,var(--glow) 80%,transparent),inset 0 -6px 12px rgba(0,0,0,.4),inset 0 4px 8px rgba(255,255,255,.7);
  animation:breathe 2s ease-in-out infinite;transition:transform .1s}
.spinbtn:active{transform:translateY(4px) scale(.95);box-shadow:0 2px 0 #4a2000,0 0 40px var(--glow)}
.spinbtn .ring{position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from 0deg,#ffe27a,#ff4d2e,#ffe27a,#c77dff,#ffe27a);-webkit-mask:radial-gradient(circle,transparent 60%,#000 61%);mask:radial-gradient(circle,transparent 60%,#000 61%);animation:spinbg 4s linear infinite;opacity:.9}
.spinbtn .ico{font-size:44px;font-weight:900;color:#4a1a00;text-shadow:0 1px 0 #fff6c0;line-height:1;margin-top:-8px}
.spinbtn .lbl{position:absolute;bottom:16px;font-size:12px;font-weight:900;letter-spacing:2px;color:#4a1a00}
.spinbtn.spinning .ico{animation:spinbg .5s linear infinite}
.spinbtn.spinning .ring{animation-duration:.6s}
@keyframes breathe{50%{box-shadow:0 6px 0 #4a2000,0 0 50px var(--glow),inset 0 -6px 12px rgba(0,0,0,.4),inset 0 4px 8px rgba(255,255,255,.7)}}
/* overlays */
.overlay{position:fixed;inset:0;z-index:50;display:none;place-items:center;background:radial-gradient(circle,rgba(0,0,0,.55),rgba(0,0,0,.88))}
.overlay.show{display:grid;animation:fadein .3s}
@keyframes fadein{from{opacity:0}}
.rays{position:absolute;width:160vmax;height:160vmax;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--accent) 30%,transparent) 0 8deg,transparent 8deg 20deg);-webkit-mask:radial-gradient(circle,#000 10%,transparent 55%);mask:radial-gradient(circle,#000 10%,transparent 55%);animation:spinbg 14s linear infinite}
.bw,.bn,.jpw{position:relative;text-align:center;padding:20px}
.bwt,.bnt{font-family:Georgia,serif;font-weight:900;font-size:58px;line-height:1;letter-spacing:2px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 24px var(--accent));animation:zoomin .6s cubic-bezier(.2,1.6,.4,1),logo 1s ease-in-out infinite .6s}
.bigwin.mega .bwt{font-size:64px;filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 30px #ff4d2e)}
.bigwin.epic .bwt{font-size:68px;filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 34px #c77dff)}
.bwa{margin-top:14px;font-family:Georgia,serif;font-size:50px;font-weight:900;color:#fff;text-shadow:0 0 20px var(--accent),0 4px 0 #3a1000;font-variant-numeric:tabular-nums}
.tap{margin-top:16px;font-size:11px;opacity:.5;letter-spacing:2px}
.bns{margin:16px 0 20px;font-size:18px;line-height:1.5;color:#fff2b0;text-shadow:0 2px 0 #000}
.bns b{font-size:30px;color:#fff}
.banner.fs .bnt{font-size:50px}
.banner.hwb .bnt{font-size:52px;filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 24px #c77dff)}
@keyframes zoomin{from{transform:scale(3);opacity:0}}
.jpcrown{font-size:60px;color:#ffe27a;text-shadow:0 0 20px #ffcf4a;animation:float 1.2s infinite}
.jpl{font-family:Georgia,serif;font-weight:900;font-size:70px;line-height:1;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 30px #ff4d2e);animation:zoomin .7s cubic-bezier(.2,1.6,.4,1)}
.jpt{font-size:26px;font-weight:900;letter-spacing:10px;color:#fff;text-shadow:0 0 14px #ff4d2e}
.jpa{margin-top:12px;font-size:48px;font-family:Georgia,serif;font-weight:900;color:#fff;text-shadow:0 0 20px #ffcf4a,0 4px 0 #3a1000}
.jackpot.jp-major .jpl{filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 30px #c77dff)}
.jackpot.jp-minor .jpl{filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 30px #4dd2ff)}
.jackpot.jp-mini .jpl{filter:drop-shadow(0 4px 0 #3a1000) drop-shadow(0 0 30px #7dff6a)}
.panel{position:relative;width:min(92vw,480px);max-height:86vh;padding:18px;border-radius:20px;text-align:center;background:linear-gradient(#2a0e06,#0a0200) padding-box,var(--goldh) border-box;border:3px solid transparent;box-shadow:0 0 40px rgba(0,0,0,.8)}
.panel.scroll{overflow:auto}
.panel h2{margin:0 0 10px;font-family:Georgia,serif;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.autos{display:flex;gap:8px;justify-content:center;margin:10px 0 16px}
.small{font-size:11px;opacity:.7}
.ptgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pt{display:flex;align-items:center;gap:6px;padding:6px;border-radius:10px;background:rgba(0,0,0,.4);text-align:left;font-size:12px}
.pt img{width:50px;height:50px}
.pt span{display:block}.pt span b{color:var(--accent)}
.pt.wide{margin-top:6px}
body.shake #app{animation:shake .6s}
@keyframes shake{10%,50%,90%{transform:translate(-6px,3px)}30%,70%{transform:translate(6px,-3px)}}
#toast{position:fixed;left:50%;bottom:30px;translate:-50% 0;z-index:70;padding:10px 18px;border-radius:20px;background:#000d;border:1px solid #ffcf4a;opacity:0;transition:.3s;pointer-events:none;font-size:14px}
#toast.show{opacity:1;bottom:50px}
/* vault */
.vault{padding:14px 0}
.vhead{font-family:Georgia,serif;font-size:24px;font-weight:900;text-align:center;margin:8px 0 14px;color:#ffe27a}
.vhead small{display:block;font-size:11px;opacity:.6;letter-spacing:2px}
.vcard{padding:16px;margin-bottom:12px;border-radius:18px;background:linear-gradient(#1c0a06f0,#070100f0) padding-box,var(--goldh) border-box;border:2px solid transparent}
.vcard h2,.vcard h3{margin:0 0 8px;color:#ffe27a}.vcard p{font-size:13px;opacity:.8}
.vcard input{width:100%;padding:12px;margin:6px 0;border-radius:12px;border:1px solid #6a4a20;background:#000;color:#fff;font-size:18px;letter-spacing:4px;text-align:center}
.vcard .pill{margin-top:6px}
.verr{color:#ff7a6a;font-size:13px;min-height:18px;margin-top:6px}
.vbal{text-align:center}.vbal small{letter-spacing:2px;opacity:.6}.vbal b{display:block;font-size:42px;font-family:Georgia,serif;color:#ffe27a;text-shadow:0 0 14px rgba(255,200,80,.5)}
.vstats{display:flex;justify-content:space-around;font-size:12px;opacity:.85;margin:6px 0 10px}
.vquick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.vcustom{display:flex;gap:6px;align-items:center;margin-top:8px}.vcustom input{flex:1;letter-spacing:1px}
.vtable{max-height:46vh;overflow:auto;border-radius:10px}
.vtable table{width:100%;border-collapse:collapse;font-size:11.5px}
.vtable th{position:sticky;top:0;background:#3a1a08;color:#ffe27a;padding:6px 4px;text-align:left}
.vtable td{padding:5px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
.vtable tr.credit td{color:#ffe27a;background:rgba(255,200,60,.08)}
.vfoot{display:flex;gap:8px;justify-content:center}
@media (min-width:700px){#app{max-width:560px}.logo-t{font-size:36px}}
@media (max-height:700px){.spinbtn{width:84px;height:84px}.round.side{width:52px;height:52px}.logo-t{font-size:24px}}
/* layout refinements */
.reels{aspect-ratio:5/3.7}
.cell img{width:100%;height:96%}
.logo-t{font-size:34px}
.winbar{flex:1;display:flex;flex-direction:column;justify-content:center}
.winamt{font-size:40px}
.jackpots{margin:6px 0 8px}
.bwt,.bnt{font-size:clamp(38px,13vw,60px)!important;white-space:nowrap}
.jpl{font-size:clamp(44px,16vw,72px)}
.hwc .cv{font-size:clamp(12px,24cqw,24px);top:50%;background:rgba(40,0,0,.55);padding:1px 6px;border-radius:8px}
.reel .cv{font-size:clamp(11px,20cqw,20px);background:rgba(40,0,0,.55);padding:0 5px;border-radius:7px}
.hwc .cv.jpv{font-size:clamp(10px,17cqw,16px)}

/* ===== Round 3: Big Boss Fortune (raster art + host character) ===== */
body.theme-bigboss{background:#12041f var(--themebg) center top/cover no-repeat fixed}
body.theme-bigboss::after{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(18,4,31,.25),rgba(18,4,31,.55) 45%,rgba(10,2,18,.9));z-index:0}
body.theme-bigboss #app{position:relative;z-index:1}
.stage{position:relative;height:118px;display:flex;align-items:center;justify-content:flex-start;margin:0 0 -6px}
.biglogo{height:104px;width:auto;max-width:66%;margin-left:4px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.6));animation:logoPulse 3s ease-in-out infinite}
@keyframes logoPulse{50%{transform:scale(1.03);filter:drop-shadow(0 0 14px rgba(255,200,80,.55))}}
.host{position:absolute;right:2px;bottom:-14px;height:142px;z-index:3;transform-origin:50% 100%;animation:bob 2.4s ease-in-out infinite;pointer-events:none}
.host img{height:100%;width:auto;filter:drop-shadow(0 6px 8px rgba(0,0,0,.55))}
@keyframes bob{50%{transform:translateY(-5px) rotate(-1.5deg)}}
.host.cheer{animation:hop .5s ease-in-out infinite alternate}
@keyframes hop{to{transform:translateY(-12px) scale(1.04)}}
.host.wow{animation:wow .35s ease-out 3}
@keyframes wow{50%{transform:scale(1.12) rotate(3deg)}}
.bubble{position:absolute;right:88%;top:4px;white-space:nowrap;background:#fff;color:#3a0f52;font:900 14px/1 system-ui,sans-serif;padding:8px 11px;border-radius:14px;border:2px solid #ffd45a;box-shadow:0 4px 12px rgba(0,0,0,.4);opacity:0;transform:scale(.4);transform-origin:100% 100%;transition:.25s cubic-bezier(.3,1.6,.5,1)}
.bubble::after{content:"";position:absolute;right:-9px;bottom:8px;border:7px solid transparent;border-left-color:#fff}
.bubble.show{opacity:1;transform:scale(1)}
body.theme-bigboss.freespins .logo,body.theme-bigboss .logo{display:none}
body.theme-bigboss.freespins .biglogo{display:none}
body.theme-bigboss .fsbar{margin-top:-108px;height:96px;align-items:center;justify-content:flex-start;padding-left:12px;gap:14px;position:relative;z-index:2;max-width:68%}
/* ornate frame */
body.theme-bigboss .frame{padding:11px;border-radius:24px;background:
 linear-gradient(#1a0628,#1a0628) padding-box,
 linear-gradient(135deg,#fff3b0,#e0a22a 18%,#7a4a06 32%,#ffe17a 50%,#8a5508 68%,#ffd45a 84%,#fff3b0) border-box;
 border:5px solid transparent;box-shadow:0 0 0 2px #3a1500,0 0 28px rgba(255,180,46,.45),inset 0 0 22px rgba(0,0,0,.8)}
body.theme-bigboss .frame::before{content:"";position:absolute;inset:3px;border-radius:19px;border:1.5px solid rgba(255,220,120,.55);pointer-events:none}
body.theme-bigboss .jewel{background:radial-gradient(circle at 35% 30%,#fff,#ff6f9a 25%,#b0003a 60%,#3a0012);box-shadow:0 0 12px #ff3d6e,0 0 0 3px #ffd85a,0 0 0 5px #6a3a00}
body.theme-bigboss .reels{background:radial-gradient(120% 90% at 50% 40%,#3b1259,#13041f)}
body.theme-bigboss .reel+.reel{box-shadow:inset 1px 0 0 rgba(255,212,90,.18)}
body.theme-bigboss .cell img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(0,0,0,.55))}
/* win juice: scale + shine sweep */
.cell.win{position:relative;overflow:hidden}
.cell.win img{animation:winpop .9s ease-in-out infinite}
@keyframes winpop{50%{transform:scale(1.13);filter:drop-shadow(0 0 10px #ffe17a) brightness(1.18)}}
.cell.win::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);transform:translateX(-100%);animation:shine 1.4s ease-in-out infinite;pointer-events:none}
@keyframes shine{60%,100%{transform:translateX(100%)}}
.lines polyline{filter:drop-shadow(0 0 4px currentColor) drop-shadow(0 0 8px rgba(255,230,120,.9));stroke-dasharray:14 6;animation:dash .6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.strip.blur img{filter:blur(2.5px) brightness(1.1)}
/* big win + jackpot art */
.bwimg{width:min(92vw,420px);height:auto;display:block;margin:0 auto -6px;filter:drop-shadow(0 8px 20px rgba(0,0,0,.6))}
.bwimg.pop,.bwimg{animation:bannerPop .7s cubic-bezier(.3,1.7,.5,1)}
@keyframes bannerPop{from{transform:scale(.2) rotate(-6deg);opacity:0}}
.overlay.bigwin .bwimg ~ .bwt{display:none}
.bwhost{display:block;height:min(36vh,300px);margin:6px auto 0;animation:hop .45s ease-in-out infinite alternate;filter:drop-shadow(0 10px 18px rgba(0,0,0,.6))}
.jpimg{width:min(90vw,400px);display:block;margin:0 auto;animation:bannerPop .8s cubic-bezier(.3,1.7,.5,1)}
.jpw.art .jpimg ~ .jpl,.jpw.art .jpimg ~ .jpt{display:none}
.jphost{display:block;height:min(32vh,270px);margin:4px auto 0;animation:hop .5s ease-in-out infinite alternate}
.jpbub{display:inline-block;margin-top:-10px;background:#fff;color:#7a0030;font:900 20px system-ui,sans-serif;padding:8px 16px;border-radius:18px;border:3px solid #ffd45a;animation:bannerPop .6s .4s both cubic-bezier(.3,1.7,.5,1)}
/* lobby flagship */
.mcard.flagship{position:relative;height:250px;overflow:hidden;border:3px solid #ffd45a;box-shadow:0 0 0 2px #5a2a00,0 0 30px rgba(255,190,60,.55)}
.mcard.flagship .fbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:brightness(.75)}
.mcard.flagship::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,4,30,.85),rgba(20,4,30,.2) 60%,transparent),linear-gradient(0deg,rgba(20,4,30,.9),transparent 45%);z-index:1}
.mcard.flagship .flogo{position:absolute;left:8px;top:8px;width:58%;z-index:2;filter:drop-shadow(0 4px 8px #000)}
.mcard.flagship .fhost{position:absolute;right:-4px;bottom:-6px;height:96%;z-index:2;animation:bob 2.4s ease-in-out infinite;filter:drop-shadow(0 6px 10px #000)}
.mcard.flagship .fsyms{position:absolute;left:10px;top:118px;display:flex;gap:4px;z-index:2}
.mcard.flagship .fsyms img{width:46px;height:46px;filter:drop-shadow(0 3px 4px #000)}
.mcard.flagship .mart{display:none}
.mcard.flagship .minfo{position:absolute;left:12px;bottom:10px;z-index:3;max-width:60%}
.mcard.flagship .minfo h2{display:none}
.mcard.flagship .playbtn,.mcard.flagship .hot{z-index:3}
.mcard.flagship .playbtn{left:12px;right:auto;bottom:12px}
.mcard.flagship .minfo{bottom:54px}
.mcard.flagship .mjp{display:none}

/* ===== Stampede Fortune: tall portrait cabinet with jackpot wheel ===== */
body.theme-stampede{background:#1a0702 var(--themebg) center top/cover no-repeat fixed}
body.theme-stampede::after{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(26,7,2,.1),rgba(26,7,2,.45) 40%,rgba(12,3,1,.92) 75%)}
.game.ways .topbar{padding:6px 2px 2px}
.wheelbox{position:relative;width:min(70vw,250px);aspect-ratio:1;margin:0 auto -4px;filter:drop-shadow(0 8px 18px rgba(0,0,0,.7))}
.wsvg{width:100%;height:100%;overflow:visible}
.wl{fill:#fff3c4;font-weight:900;font-family:system-ui,sans-serif;paint-order:stroke;stroke:#3a0a00;stroke-width:2.2px}
.wl.jp{fill:#fff}
.whub{font:900 11px system-ui,sans-serif;fill:#5a2a00}
.bulb{fill:#fff6c0;filter:drop-shadow(0 0 3px #ffd45a)}
.bulb.b0{animation:chase .5s steps(1) infinite}.bulb.b1{animation:chase .5s steps(1) infinite .25s}
@keyframes chase{50%{fill:#7a3a00;filter:none}}
body.wheelon .bulb.b0,body.wheelon .bulb.b1{animation-duration:.16s}
.wptr{position:absolute;left:50%;top:-10px;width:30px;height:38px;margin-left:-15px;background:linear-gradient(#fff3b0,#e0a22a 50%,#7a4a06);clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 3px 3px #000);transform-origin:50% 0}
.wptr.flick{animation:flick .12s}
@keyframes flick{50%{transform:rotate(-14deg)}}
.wheelbox.landed .wsvg{animation:wglow .4s 3}
@keyframes wglow{50%{filter:drop-shadow(0 0 26px #ffe17a) brightness(1.25)}}
.wjps{position:absolute;inset:auto -54px 6px -54px;display:flex;justify-content:space-between;pointer-events:none}
.wjps .jp{width:64px;padding:2px 0 3px;font-size:10px}
.wjps .jp b{font-size:11px}
.wjps .jp:nth-child(1){position:absolute;left:0;top:-200px}.wjps .jp:nth-child(2){position:absolute;right:0;top:-200px}
.wjps .jp:nth-child(3){position:absolute;left:0;top:-40px}.wjps .jp:nth-child(4){position:absolute;right:0;top:-40px}
.wlogo{display:block;height:64px;margin:-6px auto -6px;position:relative;z-index:2;filter:drop-shadow(0 4px 8px #000)}
.game.ways .frame{padding:8px;background:linear-gradient(#2a0a02,#2a0a02) padding-box,linear-gradient(135deg,#fff3b0,#e0a22a 20%,#6a3a06 40%,#ffd45a 60%,#7a4a06 80%,#fff3b0) border-box;border:4px solid transparent}
.reels.r4{aspect-ratio:5/4.1;background:radial-gradient(120% 90% at 50% 30%,#4a1a06,#160502)}
.reels.r4 .cell{height:calc(100cqh/4)}
.reels.r4 .cell img{width:90%;height:90%;object-fit:contain}
.cell .wm{position:absolute;right:2px;bottom:2px;font:900 15px system-ui;color:#fff;background:linear-gradient(#ff5a1a,#a30010);border:2px solid #ffd45a;border-radius:10px;padding:0 5px;animation:bannerPop .5s}
.game.ways .winbar{min-height:44px}
.game.ways .controls{padding:6px 10px}
.game.ways .spinbtn{width:86px;height:86px}
.game.ways .round.side{width:54px;height:54px}
body.theme-stampede.freespins .wlogo{display:none}
body.theme-stampede .fsbar{margin:-4px auto 2px}
/* stampede run */
.stampede{position:fixed;inset:0;pointer-events:none;z-index:60;overflow:hidden;display:none}
.stampede.go{display:block}
.stampede img{position:absolute;left:0;top:var(--y);height:calc(150px * var(--s));transform:translateX(-120%);animation:run 1.7s cubic-bezier(.3,.1,.6,1) var(--d) forwards;filter:drop-shadow(0 10px 8px rgba(0,0,0,.6))}
@keyframes run{0%{transform:translateX(-110%) translateY(0)}25%{transform:translateX(15vw) translateY(-8px)}50%{transform:translateX(45vw) translateY(0)}75%{transform:translateX(75vw) translateY(-8px)}100%{transform:translateX(120vw)}}
.stampede .dust{position:absolute;left:0;right:0;bottom:-10%;height:60%;background:radial-gradient(60% 50% at 50% 100%,rgba(190,120,60,.75),transparent);animation:dust 2.2s ease-out forwards}
@keyframes dust{0%{opacity:0;transform:translateX(-60%)}40%{opacity:1}100%{opacity:0;transform:translateX(30%)}}
/* lobby card */
.mcard.stampedecard{height:190px;border:3px solid #ff9a2e;box-shadow:0 0 0 2px #4a1a00,0 0 26px rgba(255,140,40,.5)}
.mcard.stampedecard .fbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.mcard.stampedecard .slogo{position:absolute;left:6px;top:4px;width:62%;z-index:2;filter:drop-shadow(0 4px 8px #000)}
.mcard.stampedecard .srun{position:absolute;right:-20px;bottom:4px;width:48%;z-index:2;animation:bob 1s ease-in-out infinite}
.mcard.stampedecard .minfo{position:absolute;left:12px;bottom:52px;z-index:3;max-width:55%;font-size:12px}
.mcard.stampedecard .playbtn{left:12px;right:auto}

/* ===== Regular 5x3 machines: landscape cabinet + rotate hint ===== */
.rotatehint{display:none}
@media (orientation:portrait) and (max-width:700px){
  .game.slot5x3 .rotatehint{display:flex;position:fixed;inset:0;z-index:200;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(8,2,14,.94);color:#ffe17a;text-align:center;font-size:22px}
  .rotatehint .phone{font-size:64px;animation:rot 2s ease-in-out infinite}
  .rotatehint small{color:#ccb;font-size:14px}
  @keyframes rot{30%,70%{transform:rotate(-90deg)}}
}
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  #app{max-width:none;padding:0 max(env(safe-area-inset-left),8px) 4px max(env(safe-area-inset-right),8px)}
  .game.slot5x3{display:grid;min-height:100dvh;height:100dvh;grid-template-columns:minmax(150px,20%) 1fr minmax(150px,19%);grid-template-rows:auto 1fr auto;
    grid-template-areas:"top top top" "side reels ctl" "side win ctl";column-gap:10px}
  .game.slot5x3 .topbar{grid-area:top;padding:4px 2px 2px}
  .game.slot5x3 .jackpots{grid-area:side;align-self:end;grid-template-columns:1fr 1fr;margin:0 0 6px}
  .game.slot5x3 .stage,.game.slot5x3 .logo{grid-area:side;align-self:start;height:auto;flex-direction:column;margin:0}
  .game.slot5x3 .logo-t{font-size:20px}
  .game.slot5x3 .biglogo{max-width:100%;height:auto;width:100%;margin:0}
  .game.slot5x3 .host{position:relative;right:auto;bottom:auto;height:118px;align-self:center;margin-top:-6px}
  .game.slot5x3 .bubble{right:auto;left:70%;top:0;transform-origin:0 100%}
  .game.slot5x3 .bubble::after{right:auto;left:-9px;border-left-color:transparent;border-right-color:#fff}
  .game.slot5x3 .fsbar{grid-area:side;align-self:center;margin:0!important;max-width:none!important;height:auto!important;flex-direction:column;padding:6px!important}
  .game.slot5x3 .frame{grid-area:reels;margin:0;align-self:center;justify-self:center;height:100%;max-height:calc(100dvh - 92px);aspect-ratio:5/3.2;width:auto;max-width:100%;display:flex}
  .game.slot5x3 .reels{flex:1;aspect-ratio:auto;height:100%}
  .game.slot5x3 .winbar{grid-area:win;min-height:34px;margin:2px 0}
  .game.slot5x3 .winbar .winamt{font-size:22px}
  .game.slot5x3 .controls{grid-area:ctl;margin:0 0 4px;display:flex;flex-direction:column;justify-content:space-between;padding:8px 6px}
  .game.slot5x3 .ctl-row{flex-direction:column;gap:6px}
  .game.slot5x3 .ctl-row.main{flex-direction:row;flex-wrap:wrap;justify-content:center}
  .game.slot5x3 .ctl-row.main .spinbtn{order:-1;width:92px;height:92px;flex-basis:100%;max-width:92px;margin:0 auto}
  .game.slot5x3 .round.side{width:48px;height:48px}
  .game.slot5x3 .betbox{width:100%;justify-content:space-between}
  .game.slot5x3 .ctl-row .pill{width:100%;padding:5px}
  .game.slot5x3 .ctl-row:first-child{display:grid;grid-template-columns:1fr 1fr;gap:5px}
  .game.slot5x3 .ctl-row:first-child .betbox{grid-column:1/3;order:-1}
  .game.slot5x3 .hw{border-radius:12px}
  body.holdwin .game.slot5x3 .winbar{margin-top:2px}
}
.mcard.flagship .minfo,.mcard.stampedecard .minfo{display:none}
.wheelbox{width:min(58vw,224px)}
.wjps{inset:auto -70px 6px -70px}
.game.ways{min-height:auto}
.game.ways .controls{margin-top:4px}
.reels.r4{aspect-ratio:5/3.9}
body.theme-bigboss::after{background:radial-gradient(70% 60% at 50% 50%,rgba(18,4,31,.55),rgba(18,4,31,.2) 80%)}
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  body.theme-bigboss{background-size:cover;background-position:center}
  .game.slot5x3 .host{height:150px}
  .game.slot5x3 .biglogo{width:92%}
  .overlay.bigwin .bw{display:grid;grid-template-columns:auto auto;grid-template-areas:"img host" "amt host" "tap host";align-items:center;column-gap:10px}
  .overlay.bigwin .bwimg{grid-area:img;width:min(52vw,440px)}
  .overlay.bigwin .bwa{grid-area:amt}
  .overlay.bigwin .tap{grid-area:tap}
  .overlay.bigwin .bwhost{grid-area:host;height:78vh;margin:0}
  .jpw.art{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:8px}
  .jpw .jpimg{width:min(46vw,380px)}
  .jpw .jphost{grid-row:1/6;grid-column:2;height:78vh}
  .jpw .jpbub{grid-column:1}
}
/* v4 spin animation layer */
.frame::after{content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;border:3px dotted rgba(255,246,170,.0);z-index:4}
body.reelspin .frame::after{border-color:#fff6aa;filter:drop-shadow(0 0 4px #ffd45a);animation:marquee .22s steps(1) infinite}
@keyframes marquee{50%{border-color:#ff4d8d;filter:drop-shadow(0 0 5px #ff4d8d)}}
.frame.flash{animation:fflash .35s ease-out}
@keyframes fflash{0%{box-shadow:0 0 0 2px #fff,0 0 40px #fff6c0,inset 0 0 30px rgba(255,255,255,.5)}100%{box-shadow:none}}
body.freespins .frame.flash{animation:fflash .35s ease-out,fsglow 1.5s infinite}
body.reelspin .spinbtn{animation:btnpulse .45s ease-in-out infinite alternate}
@keyframes btnpulse{to{transform:scale(1.08);filter:brightness(1.3) drop-shadow(0 0 14px var(--accent))}}
.host.hhop{animation:hhop .5s ease-out,bob 2.4s ease-in-out .5s infinite}
@keyframes hhop{0%,100%{transform:translateY(0)}40%{transform:translateY(-16px) scale(1.04,.97)}}
.host.hpoint{animation:hpoint .6s ease-out,bob 2.4s ease-in-out .6s infinite}
@keyframes hpoint{0%,100%{transform:rotate(0)}35%{transform:rotate(-7deg) scale(1.05)}70%{transform:rotate(3deg)}}
.reel{position:relative}
.reel.tease{animation:tease .25s infinite alternate}
.reel.tease::after{content:"";position:absolute;inset:-4px;border-radius:10px;pointer-events:none;z-index:5;
  background:linear-gradient(0deg,rgba(255,90,0,.55),rgba(255,200,0,.15) 40%,transparent 70%);mix-blend-mode:screen;animation:fire .18s infinite alternate}
.reel.tease::before{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;background:
  linear-gradient(100deg,transparent 46%,#e8f6ff 48%,transparent 50%) 0 0/100% 40% no-repeat,
  linear-gradient(80deg,transparent 47%,#bfe6ff 49%,transparent 51%) 0 60%/100% 45% no-repeat;opacity:0;animation:bolt .9s infinite}
@keyframes fire{to{opacity:.6;transform:scaleY(1.06)}}
@keyframes bolt{0%,60%,100%{opacity:0}62%,70%{opacity:1}66%{opacity:.2}}
.cell.win img{animation:wpop .6s cubic-bezier(.3,1.6,.5,1) both}
@keyframes wpop{0%{transform:scale(1)}50%{transform:scale(1.22)}100%{transform:scale(1.08)}}
.cell.win::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.75) 50%,transparent 65%) -150% 0/250% 100% no-repeat;animation:sweep 1.2s ease-in-out 2}
@keyframes sweep{to{background-position:150% 0}}
.cell{position:relative}
body.reelspin .bulb.b0,body.reelspin .bulb.b1{animation-duration:.1s}
body.reelspin .bulb{fill:#fff;filter:drop-shadow(0 0 5px #ff6a2a)}
body.reelspin .wheelwrap svg,body.reelspin .wheel{filter:brightness(1.12) saturate(1.2)}
#music.off{opacity:.5}
/* Big Boss: ROCK watermark on reel frame */
body.theme-bigboss .frame .rockmark{position:absolute;width:30px;height:30px;right:6px;bottom:3px;opacity:.55;z-index:5;pointer-events:none;filter:drop-shadow(0 1px 1px #000)}

/* v5 animated host: real frames, so no CSS bob */
.host{animation:none}
.host canvas.sprite{height:100%;width:auto;display:block;filter:drop-shadow(0 6px 8px rgba(0,0,0,.55))}
canvas.bwhost,canvas.jphost{width:auto;animation:none}
/* v6: Big Boss landscape — host is the star: full-height side column, overlapping the frame; jackpots in a row under the reels */
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  body.theme-bigboss .game.slot5x3{grid-template-columns:minmax(170px,22%) 1fr minmax(150px,19%);grid-template-rows:auto 1fr auto auto;
    grid-template-areas:"top top top" "side reels ctl" "side jp ctl" "side win ctl"}
  body.theme-bigboss .game.slot5x3 .jackpots{grid-area:jp;align-self:center;grid-template-columns:repeat(4,1fr);margin:3px 0 0;gap:4px}
  body.theme-bigboss .game.slot5x3 .jackpots .jp{padding:1px 2px 2px;font-size:11px;line-height:1.15}
  body.theme-bigboss .game.slot5x3 .stage{grid-row:2/5;grid-column:1;position:relative;height:100%;align-self:stretch;z-index:8;overflow:visible}
  body.theme-bigboss .game.slot5x3 .biglogo{position:absolute;top:-4px;left:0;width:82%;z-index:2}
  body.theme-bigboss .game.slot5x3 .host{position:absolute;left:4%;right:auto;bottom:-6px;top:auto;height:calc(100dvh - 58px);margin:0 -40px 0 0;z-index:1}
  body.theme-bigboss .game.slot5x3 .host canvas.sprite{filter:drop-shadow(0 0 18px rgba(255,200,90,.35)) drop-shadow(0 8px 10px rgba(0,0,0,.6))}
  body.theme-bigboss .game.slot5x3 .bubble{left:62%;top:22%}
  body.theme-bigboss .game.slot5x3 .frame{max-height:calc(100dvh - 120px)}
}
/* v5.1: Boss Mode / free-spins label sits top-left clear of the host (landscape 5x3) */
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  body.theme-bigboss .game.slot5x3 .fsbar{position:absolute!important;left:max(8px,env(safe-area-inset-left));top:calc(58px + env(safe-area-inset-top));z-index:6;flex-direction:row;gap:6px;background:rgba(20,0,30,.8);border:1px solid #ffd45a;border-radius:12px;padding:2px 8px!important;font-size:12px;transform:scale(.85);transform-origin:0 0}
}
/* v5.1 iOS fit: no double-tap zoom / rubber-band, notch-safe */
html,body{touch-action:manipulation;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}
html{height:100dvh}body{min-height:100dvh}
#app{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}

/* v5.1: jackpot text stays above the coin shower (coins fall behind the overlay) */
body:has(#ov.show.jackpot) #fx{z-index:0}
/* v5.1 perf: no animated filters during spins (blur/drop-shadow repaint every frame); transform/opacity only */
.strip{will-change:transform}
.strip.blur,.strip.blur img{filter:none}
.strip.blur img{opacity:.82;transform:scaleY(1.18)}
body.reelspin .frame::after{filter:none}
body.reelspin .bulb{filter:none}
body.reelspin .wheelwrap svg,body.reelspin .wheel{filter:none}
/* v5.1: Stampede (ways) landscape cabinet on phones + iPads — wheel left, reels centre, controls right; nothing cropped */
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  body.theme-stampede #app{max-width:none}
  .game.ways{display:grid;height:100dvh;min-height:100dvh;grid-template-columns:minmax(150px,24%) 1fr minmax(140px,18%);grid-template-rows:auto 1fr auto;
    grid-template-areas:"top top top" "side reels ctl" "side win ctl";column-gap:10px}
  .game.ways .topbar{grid-area:top;padding:4px 2px 2px}
  .game.ways .wheelbox{grid-area:side;align-self:center;justify-self:center;width:min(100%,calc(100dvh - 150px));margin:0}
  .game.ways .wjps{position:static;display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:6px}
  .game.ways .wjps .jp{position:static;transform:none;font-size:10px;padding:2px 4px}
  .game.ways .wlogo{grid-area:side;align-self:start;justify-self:center;width:70%;max-height:44px;object-fit:contain;margin:0;position:relative;z-index:2}
  .game.ways .fsbar{grid-area:side;align-self:end;flex-direction:column;margin:0!important}
  .game.ways .frame{grid-area:reels;margin:0;align-self:center;justify-self:center;height:auto;aspect-ratio:5/4;width:min(100%,calc((100dvh - 90px) * 1.25));display:flex;min-width:0}
  .game.ways .reels{flex:1;aspect-ratio:auto;height:100%}
  .game.ways .winbar{grid-area:win;min-height:30px;margin:2px 0}
  .game.ways .controls{grid-area:ctl;margin:0 0 4px;display:flex;flex-direction:column;justify-content:space-between;padding:8px 6px}
  .game.ways .ctl-row{flex-direction:column;gap:6px}
  .game.ways .ctl-row.main{flex-direction:row;flex-wrap:wrap;justify-content:center}
  .game.ways .ctl-row.main .spinbtn{order:-1;width:88px;height:88px;flex-basis:100%;max-width:88px;margin:0 auto}
  .game.ways .round.side{width:46px;height:46px}
  .game.ways .betbox{width:100%;justify-content:space-between}
  .game.ways .ctl-row .pill{width:100%;padding:5px}
  .game.ways .ctl-row:first-child{display:grid;grid-template-columns:1fr 1fr;gap:5px}
  .game.ways .ctl-row:first-child .betbox{grid-column:1/3;order:-1}
}
/* v5.1 iPad: portrait uses the wider tablet column; landscape 5x3 + ways get a roomier column so reels aren't tiny */
@media (min-width:740px) and (orientation:portrait){#app{max-width:min(92vw,820px)}.wheelbox{width:min(46vw,360px)}}

/* v5.1 iPad landscape cabinet: scale up controls + side art for the bigger screen */
@media (orientation:landscape) and (min-width:960px) and (min-height:521px){
  .game.slot5x3,.game.ways{grid-template-columns:minmax(220px,22%) 1fr minmax(200px,18%)}
  .game.slot5x3 .ctl-row.main .spinbtn,.game.ways .ctl-row.main .spinbtn{width:120px;height:120px;max-width:120px}
  .game.slot5x3 .round.side,.game.ways .round.side{width:62px;height:62px}
  .game.ways .wheelbox{width:min(100%,300px)}
  .game.slot5x3 .frame,body.theme-bigboss .game.slot5x3 .frame{height:auto;max-height:none;width:min(100%,calc((100dvh - 170px) * 1.5625));min-width:0}
  body.theme-bigboss .game.slot5x3 .host{height:min(62dvh,calc(100dvh - 220px));left:1%}
  body.theme-bigboss .game.slot5x3 .biglogo{max-width:80%}
}
/* v5.1 phones landscape: reels column can shrink (minmax(0,1fr)); frame sized by width so the control column never gets pushed off-screen */
@media (orientation:landscape) and (max-height:520px){
  .game.slot5x3{grid-template-columns:minmax(130px,20%) minmax(0,1fr) minmax(132px,19%)}
  body.theme-bigboss .game.slot5x3{grid-template-columns:minmax(140px,22%) minmax(0,1fr) minmax(132px,19%)}
  .game.slot5x3 .frame,body.theme-bigboss .game.slot5x3 .frame{height:auto;max-height:none;width:min(100%,calc((100dvh - 120px) * 1.5625));min-width:0}
  .game.ways{grid-template-columns:minmax(130px,24%) minmax(0,1fr) minmax(132px,18%)}
}
@media (orientation:landscape) and (max-height:520px){
  .game.slot5x3 .betbox,.game.ways .betbox{gap:3px;min-width:0;box-sizing:border-box}
  .game.slot5x3 .betbox .round.sm,.game.ways .betbox .round.sm{width:30px;height:30px;min-width:30px;font-size:16px;flex:0 0 30px}
  .game.slot5x3 .betbox>div,.game.ways .betbox>div{min-width:0;flex:1 1 auto}
}
@media (orientation:landscape) and (max-height:520px){.game.slot5x3 .ctl-row .pill,.game.ways .ctl-row .pill{font-size:12px;padding:4px 3px;min-width:0}}
/* v5.2 polish */
.lbl-s{display:none}
@media (orientation:landscape) and (max-height:520px){
  .game .ctl-row .pill .lbl-l{display:none}.game .ctl-row .pill .lbl-s{display:inline}
  .game .ctl-row .pill{white-space:nowrap;overflow:hidden;text-overflow:clip}
}
/* host lives in his own side panel in landscape: never over the reels */
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  body.theme-bigboss .game.slot5x3 .stage{overflow:hidden}
  body.theme-bigboss .game.slot5x3 .host{left:0;right:0;margin:0 auto;width:max-content;max-width:100%;bottom:0;height:min(calc(100dvh - 110px),calc(22vw * 1.3))}
  body.theme-bigboss .game.slot5x3 .host canvas.sprite{height:100%;width:auto;max-width:100%;object-fit:contain}
  body.theme-bigboss .game.slot5x3 .bubble{left:auto;right:2px;top:30%;max-width:90%;font-size:12px}
  body.theme-bigboss .game.slot5x3 .bubble::after{display:none}
}
/* iPad portrait: host is the star beside the logo; tighter vertical rhythm */
@media (min-width:740px) and (orientation:portrait){
  body.theme-bigboss .game{min-height:auto}
  body.theme-bigboss .stage{height:min(30vh,300px);margin:0 0 -10px}
  body.theme-bigboss .biglogo{max-width:42%;height:auto;align-self:center}
  body.theme-bigboss .host{height:calc(100% + 20px);right:6%;bottom:-8px}
  body.theme-bigboss .bubble{font-size:18px}
  body.theme-bigboss .winbar{margin:6px 0}
  body.theme-bigboss .controls{margin-top:6px}
}
@media (orientation:landscape) and (max-height:520px){
  body.theme-bigboss .game.slot5x3{grid-template-columns:minmax(150px,27%) minmax(0,1fr) minmax(126px,18%)}
  body.theme-bigboss .game.slot5x3 .host{height:min(calc(100dvh - 96px),calc(27vw * 1.3))}
  .game .ctl-row .pill{font-size:11px;letter-spacing:0}
}
@media (min-width:740px) and (orientation:portrait){
  #app{max-width:min(90vw,740px)}
  body.theme-bigboss .stage{height:19vh}
  body.theme-bigboss .host{height:calc(19vh + 30px)}
}
@media (orientation:landscape) and (max-height:520px){
  body.theme-bigboss .game.slot5x3 .host{height:min(calc(100dvh - 96px),calc(24vw * 1.33))}
  body.theme-bigboss .game.slot5x3 .bubble{top:-4%;right:-2px;font-size:11px;padding:3px 7px}
  .game .ctl-row .pill{font-size:10px;padding:4px 2px!important}
}
@media (min-width:740px) and (orientation:portrait){
  body.theme-bigboss .stage{height:23vh}
  body.theme-bigboss .host{height:calc(23vh + 34px)}
}
@media (min-width:740px) and (orientation:portrait) and (max-height:1100px){
  body.theme-bigboss .stage{height:17vh}
  body.theme-bigboss .host{height:calc(17vh + 30px)}
}
@media (min-width:740px) and (orientation:portrait) and (max-height:1100px){
  body.theme-bigboss .stage{height:14vh}
  body.theme-bigboss .host{height:calc(14vh + 30px)}
  body.theme-bigboss .biglogo{height:13vh}
}
/* v6: host cameo on the other machines (he's the star of the casino) */
.game.ways .host.cameo{position:absolute;z-index:6;left:6px;top:40vh;height:min(11vh,110px);width:auto;pointer-events:none}
.game.ways .host.cameo canvas,.game.ways .host.cameo img{height:100%;width:auto;display:block}
.game.ways .host.cameo .bubble{position:absolute;left:80%;top:0;white-space:nowrap;font-size:11px;width:auto;min-width:0;padding:2px 8px;border-radius:10px;background:#fff;color:#222}
.game.ways .host.cameo .bubble{display:none!important}
@media (orientation:landscape){.game.ways .host.cameo{left:auto;right:calc(min(200px,20vw)/2 - 4vh);top:37vh;height:min(22vh,140px)}}
/* ===== v6 premium lobby ===== */
body.lobby6 .topbar{gap:10px}
.lvl{flex:1;max-width:260px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center}
.lvn{grid-row:1/3;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:900 16px Georgia,serif;color:#3a1000;background:radial-gradient(circle at 35% 30%,#fff6c8,#ffcf4a 45%,#b8740c);box-shadow:0 0 0 2px #5a2a00,0 0 12px rgba(255,200,80,.6)}
.xpb{height:9px;border-radius:6px;background:#2a0a10;box-shadow:inset 0 1px 3px #000,0 0 0 1px #6a3a10;overflow:hidden}
.xpb i{display:block;height:100%;min-width:4%;background:linear-gradient(90deg,#ff8a00,#ffe27a,#ff8a00);background-size:200% 100%;animation:xpflow 2.5s linear infinite;border-radius:6px}
@keyframes xpflow{to{background-position:-200% 0}}
.lvl small{font-size:10px;opacity:.7;letter-spacing:.5px}
.greet{display:flex;align-items:center;gap:12px;margin:8px 0 14px;padding:8px 12px;border-radius:18px;background:linear-gradient(90deg,rgba(90,20,60,.55),rgba(30,6,20,.35));box-shadow:inset 0 0 0 1px rgba(255,210,100,.25)}
.ghost{height:96px;flex:none}
.ghost canvas,.ghost img{height:100%;width:auto;display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.gtext{flex:1;min-width:0}
.gbub{display:inline-block;background:#fff;color:#2a0a10;font-weight:800;font-size:15px;padding:7px 14px;border-radius:16px 16px 16px 4px;box-shadow:0 3px 10px rgba(0,0,0,.4);animation:gpop .6s cubic-bezier(.2,1.6,.4,1) both}
@keyframes gpop{from{transform:scale(.3);opacity:0}}
.gtext p{margin:6px 0 0;font-size:12px;opacity:.65}
.dailybtn{flex:none;border:0;border-radius:16px;padding:10px 14px;color:#3a1000;font-family:inherit;background:linear-gradient(#ffe9a0,#ffb52e 55%,#c86a00);box-shadow:0 0 0 2px #5a2a00,0 4px 0 #6a3000;display:grid;text-align:center;opacity:.6}
.dailybtn b{font:900 14px Georgia,serif}.dailybtn small{font-size:10px;font-weight:800}
.dailybtn.ready{opacity:1;animation:dpulse 1.4s ease-in-out infinite}
@keyframes dpulse{50%{box-shadow:0 0 0 2px #5a2a00,0 4px 0 #6a3000,0 0 26px #ffcf4a}}
.pgrid{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:700px){.pgrid{grid-template-columns:1fr 1fr}}
.pcard{position:relative;display:block;height:200px;border-radius:22px;overflow:hidden;text-decoration:none;color:#fff;border:3px solid #ffd45a;box-shadow:0 0 0 2px #5a2a00,0 8px 24px rgba(0,0,0,.5),0 0 24px rgba(255,190,60,.35);animation:cardin .6s cubic-bezier(.2,1.3,.4,1) var(--d) both}
@keyframes cardin{from{transform:translateY(24px) scale(.94);opacity:0}}
.pcard:active{transform:scale(.97)}
.pcard.flag{grid-column:1/-1;height:230px}
.pbg{position:absolute;inset:-6%;width:112%;height:112%;object-fit:cover;filter:brightness(.8);animation:kenburns 14s ease-in-out infinite alternate}
@keyframes kenburns{to{transform:scale(1.08) translate(-2%,-1%)}}
.pshade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,2,10,.92),transparent 55%),linear-gradient(90deg,rgba(14,2,10,.5),transparent 60%)}
.psweep{position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.28) 50%,transparent 60%);transform:translateX(-100%);animation:sweep 4s infinite;animation-delay:var(--d)}
.plogo{position:absolute;left:10px;top:8px;width:min(52%,260px);filter:drop-shadow(0 4px 8px #000);animation:lfloat 3s ease-in-out infinite}
@keyframes lfloat{50%{transform:translateY(-4px)}}
.psyms{position:absolute;right:10px;top:16px;display:flex;gap:4px}
.psyms img{width:58px;height:58px;filter:drop-shadow(0 3px 6px #000);animation:sbob 2.2s ease-in-out infinite;animation-delay:calc(var(--k)*.25s)}
@keyframes sbob{50%{transform:translateY(-7px) rotate(-4deg)}}
.pcard.flag .psyms{right:auto;left:14px;top:auto;bottom:60px}
.phost{position:absolute;right:0;bottom:-6px;height:100%;filter:drop-shadow(0 6px 10px #000);animation:bob 2.4s ease-in-out infinite}
.prun{position:absolute;right:-6px;bottom:0;height:78%;filter:drop-shadow(0 6px 10px #000);animation:sbob 1.8s ease-in-out infinite}
.pfoot{position:absolute;left:12px;right:12px;bottom:10px;display:flex;align-items:center;gap:10px}
.pjp{display:grid;font:900 18px Georgia,serif;color:#ffe27a;text-shadow:0 2px 0 #3a1000;line-height:1}.pjp small{font:800 10px system-ui;letter-spacing:2px;color:#fff;opacity:.8}
.pplay{margin-left:auto;padding:8px 22px;border-radius:14px;font-weight:900;color:#3a1000;background:linear-gradient(#ffe9a0,#ffb52e 55%,#c86a00);box-shadow:0 0 0 2px #5a2a00,0 3px 0 #6a3000}
.pcard.flag .pplay{margin-left:0}.pcard.flag .pfoot{right:42%}
.ptag{position:absolute;right:10px;top:8px;font-size:10px;font-weight:900;letter-spacing:1px;padding:3px 8px;border-radius:8px;background:#c8102e;box-shadow:0 0 10px #ff4d2e}
.pcard:not(.flag) .ptag{top:auto;bottom:56px}
.dwov{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:rgba(8,0,6,.88)}
.dwbox{text-align:center}
.dwbox h2{margin:0 0 10px;font:900 30px Georgia,serif;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #3a1000)}
.dwwrap{position:relative;width:min(78vmin,340px);aspect-ratio:1;margin:0 auto}
.dwheel{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 8px #ffcf4a,0 0 0 11px #6a3000,0 0 40px rgba(255,200,80,.6)}
.dwheel span{position:absolute;left:50%;top:50%;transform:rotate(var(--r)) translateY(-37%) ;transform-origin:0 0;font:900 clamp(12px,4vmin,17px) Georgia,serif;color:#fff;text-shadow:0 2px 2px #000;white-space:nowrap;translate:-50% 0;width:0;display:flex;justify-content:center}
.dwheel span{transform:rotate(var(--r)) translateY(calc(min(78vmin,340px) * -.36))}
.dwptr{position:absolute;left:50%;top:-18px;z-index:2;width:0;height:0;margin-left:-14px;border:14px solid transparent;border-top:30px solid #fff;filter:drop-shadow(0 2px 3px #000)}
.dwspin{position:absolute;left:50%;top:50%;width:26%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:0;font:900 18px Georgia,serif;color:#3a1000;background:radial-gradient(circle at 35% 30%,#fff6c8,#ffcf4a 45%,#b8740c);box-shadow:0 0 0 4px #6a3000,0 0 20px #ffcf4a;z-index:2}
.dwbox p{margin:16px 0 0;opacity:.8}
.dwwon{font:900 28px Georgia,serif;color:#ffe27a;text-shadow:0 0 16px #ffcf4a}
@media (orientation:landscape) and (max-height:500px){.pcard,.pcard.flag{height:170px}.ghost{height:70px}.greet{margin:4px 0 10px}}
@media (max-width:520px){body.lobby6 .brand{font-size:17px;line-height:1.1}.lvl small{display:none}.lvl{max-width:110px}}
@media (min-width:700px){.pcard.flag .psyms{left:auto;right:30%;top:20px;bottom:auto}.pcard.flag .plogo{width:min(40%,300px)}}
/* v6.1: card logos always fully visible, above the art */
.plogo{z-index:3;max-width:calc(100% - 20px);max-height:58%;object-fit:contain;object-position:left top}
.pcard .prun{z-index:1;right:-10%;height:70%}
.pcard:not(.flag) .plogo{width:min(48%,240px)}
.pfoot,.ptag{z-index:4}
@media (max-width:520px){.lvl{max-width:none;flex:0 1 96px;grid-template-columns:auto minmax(46px,1fr)}.xpb{min-width:46px}}
/* v6.1 big win: counting number re-rasters each frame -> small single shadow; banner image on its own layer */
.overlay.bigwin .bwa{text-shadow:0 3px 0 #3a1000}
.overlay.bigwin .bwimg,.overlay.bigwin .bwhost{will-change:transform}
@media (max-width:400px){body.lobby6 .balpill small{display:none}body.lobby6 .brand{font-size:14px}.lvl{flex:0 1 80px}.greet{gap:8px;padding:6px 8px}.ghost{height:72px}.gbub{font-size:12px;padding:5px 10px}.gtext p{display:none}.dailybtn{padding:8px 10px}.dailybtn b{font-size:12px}.pcard .phost{height:80%}}
/* ===== v6.2 premium admin vault ===== */
body.vaultpage{background:radial-gradient(120% 60% at 50% 0,#4a0f2a,#14030c 60%,#0c0103)}
.vault{max-width:560px;margin:0 auto;padding:max(10px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom))}
.vhead{display:grid;justify-items:center;gap:2px;margin:6px 0 12px}
.vhead img{width:74px;height:74px;filter:drop-shadow(0 0 16px rgba(255,190,60,.55));animation:lfloat 3s ease-in-out infinite}
.vhead span{font:900 28px Georgia,serif;letter-spacing:3px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #3a1000)}
.vcard.vprem,.vcard{box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,220,120,.08)}
.vbal b{font-size:clamp(36px,11vw,48px)}
.vcr{display:inline-block;margin-top:2px;font-size:10px;letter-spacing:2px;padding:2px 8px;border-radius:8px;background:rgba(255,210,90,.12);color:#ffe27a}
.vlvl{display:flex;align-items:center;gap:10px;margin:12px 0 8px;padding:8px 10px;border-radius:14px;background:rgba(0,0,0,.35)}
.vlvl>div{flex:1;min-width:0}.vlvl small{display:block;margin-top:5px;font-size:11px;opacity:.75}
.vstats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:8px 0 12px;opacity:1}
.vstats span{display:grid;text-align:center;font-size:10px;letter-spacing:.5px;opacity:.85;padding:6px 2px;border-radius:10px;background:rgba(255,255,255,.04)}
.vstats b{font:900 14px Georgia,serif;color:#ffe27a;margin-top:2px}
.vquick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.vquick .pill{padding:10px 0;font-size:13px}
.vcustom{display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center}.vcustom input{margin:6px 0 0}
.vcard h3{display:flex;align-items:baseline;justify-content:space-between;font-family:Georgia,serif}.vcard h3 small{font:11px system-ui;opacity:.6}
.vlist{list-style:none;margin:0;padding:0;max-height:52vh;overflow:auto;-webkit-overflow-scrolling:touch}
.vrow{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid rgba(255,210,120,.1)}
.vrow i{font-style:normal;font-size:20px;width:30px;text-align:center}
.vrt{flex:1;min-width:0;display:grid}.vrt b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vrt small{font-size:11px;opacity:.6}
.vra{display:grid;text-align:right}.vra b{font:900 15px Georgia,serif}.vra small{font-size:10px;opacity:.55}
.vra .pos{color:#7dff8a}.vra .neg{color:#ff7a7a}
.vbon{color:#ffd45a;font-weight:900}.vrow.hasbonus{background:linear-gradient(90deg,rgba(255,200,60,.1),transparent)}
.vrow.daily{background:linear-gradient(90deg,rgba(120,80,255,.12),transparent)}
.vempty{padding:16px;text-align:center;opacity:.6}
.vfoot{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.vfoot .pill{text-align:center}

/* ===== v7: accounts, hourly bonus, welcome gift ===== */
.hourly{flex:none;border:0;border-radius:14px;padding:5px 10px;display:grid;justify-items:center;line-height:1.05;font-family:inherit;color:#ffe9a0;background:linear-gradient(#3a1a08,#1a0703);box-shadow:inset 0 0 0 1.5px #b8860b,0 2px 8px rgba(0,0,0,.5);cursor:pointer}
.hourly b{font:900 10px Georgia,serif;letter-spacing:1px;opacity:.85}.hourly small{font:800 13px ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums}
.hourly.ready{color:#3a1000;background:linear-gradient(#fff2b8,#ffbf3a 55%,#d07400);box-shadow:0 0 0 2px #5a2a00,0 0 18px rgba(255,200,60,.8);animation:dpulse 1.2s ease-in-out infinite}
.hourly.ready small{font:900 11px Georgia,serif}
.flycoin{position:fixed;left:0;top:0;width:28px;height:28px;z-index:9999;pointer-events:none;filter:drop-shadow(0 0 6px rgba(255,210,80,.9))}
.giftstrip{display:flex;align-items:center;gap:10px;margin:-4px 0 12px;padding:9px 12px;border-radius:16px;text-decoration:none;color:#fff;background:linear-gradient(90deg,#7a1020,#3a0610);box-shadow:inset 0 0 0 1.5px #e8b040,0 4px 14px rgba(0,0,0,.4);animation:gpop .6s both}
.giftstrip i{font-style:normal;font-size:24px}.giftstrip span{flex:1;font-size:13px}.giftstrip b{color:#ffe27a}
.giftstrip em{font:900 13px Georgia,serif;font-style:normal;color:#3a1000;background:linear-gradient(#ffe9a0,#ffb52e);padding:6px 12px;border-radius:12px}
.acctbar{display:flex;justify-content:space-between;align-items:center;margin:-6px 4px 10px;font-size:12px;opacity:.75}
.acctbar button{border:0;background:none;color:#ffd77a;font:inherit;text-decoration:underline;cursor:pointer}
.hfs .hfsn{font:900 84px/1 Georgia,serif;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 #3a1000)}
.hfsb{display:flex;gap:10px;justify-content:center;margin-top:12px}.hfsb .pill{text-decoration:none}
body.authpage{background:radial-gradient(ellipse at 50% 20%,#5a1030 0%,#22040f 55%,#0a0105 100%) fixed}
.auth{min-height:100dvh;max-width:460px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:max(16px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));position:relative}
.auth .asnow{position:absolute;top:2%;right:-30px;width:170px;opacity:.16;animation:aspin 40s linear infinite;pointer-events:none}
@keyframes aspin{to{transform:rotate(360deg)}}
.abrand{font:900 40px/1 Georgia,serif;letter-spacing:3px;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 #3a1000) drop-shadow(0 0 22px rgba(255,190,60,.45));text-align:center}
.abrand span{display:block;font-size:.62em;letter-spacing:10px}
.asub{font-size:10px;letter-spacing:3px;color:#ffd77a;opacity:.75}
.ahost{display:flex;align-items:flex-end;gap:6px;margin:4px 0}.ahost canvas,.ahost img{height:150px;width:auto}.ahost .gbub{margin-bottom:40px;max-width:190px;font-size:14px}
.acard{width:100%;padding:16px;border-radius:22px;background:linear-gradient(#1c0a06f2,#070100f2) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 16px 40px rgba(0,0,0,.6)}
.atabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;padding:4px;border-radius:14px;background:#000a}
.atabs button{border:0;border-radius:11px;padding:9px;font:900 13px Georgia,serif;letter-spacing:1px;color:#ffd77a;background:none;cursor:pointer}
.atabs button.on{color:#3a1000;background:linear-gradient(#ffe9a0,#ffb52e 60%,#c86a00)}
.acard input{width:100%;box-sizing:border-box;padding:13px 14px;margin:5px 0;border-radius:13px;border:1px solid #6a4a20;background:#000;color:#fff;font-size:16px}
.acard input:focus{outline:none;border-color:#ffcc55;box-shadow:0 0 0 3px rgba(255,200,80,.25)}
.abtn{width:100%;margin-top:8px;padding:13px;font-size:16px}
.agift{display:flex;gap:10px;align-items:center;margin-top:12px;padding:10px 12px;border-radius:14px;background:linear-gradient(90deg,#5a1020,#2a0610);box-shadow:inset 0 0 0 1px #c8903a;font-size:13px}
.agift i{font-style:normal;font-size:28px}.agift b{color:#ffe27a}
.afine{margin:10px 0 0;text-align:center;font-size:11px;opacity:.6}
.welov{position:fixed;inset:0;z-index:900;display:grid;place-items:center;background:radial-gradient(circle,#4a0c22ee,#0a0105f5);animation:gpop .4s both;overflow:hidden}
.welov .rays{position:absolute;inset:-50%;background:repeating-conic-gradient(rgba(255,210,100,.12) 0 10deg,transparent 10deg 20deg);animation:aspin 30s linear infinite}
.welbox{position:relative;text-align:center;padding:20px;max-width:360px}
.welbox .asnow{position:absolute;top:-10px;left:50%;width:120px;margin-left:-60px;opacity:.25;animation:aspin 20s linear infinite}
.welbox h2{position:relative;margin:0;font:900 30px/1.05 Georgia,serif;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 #3a1000)}
.welhost canvas{height:170px;width:auto}
.welgift{display:grid;margin:-6px 0 8px}.welgift small{font-size:11px;letter-spacing:3px;color:#ffd77a}
.welgift b{font:900 54px/1 Georgia,serif;color:#fff3c0;text-shadow:0 0 24px #ffb000,0 3px 0 #7a3a00;font-variant-numeric:tabular-nums}.welgift span{font-size:11px;letter-spacing:2px;opacity:.7}
.welfs{display:inline-block;padding:10px 18px;border-radius:16px;background:linear-gradient(#7a1020,#3a0610);box-shadow:inset 0 0 0 1.5px #e8b040;font:900 18px Georgia,serif;color:#ffe27a}.welfs small{font:600 11px system-ui;color:#fff;opacity:.75}
.vwho{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.vwho b{font:900 20px Georgia,serif;color:#ffe27a}
.vuser{cursor:pointer}.vuser:active{background:rgba(255,210,100,.08)}
@media (max-width:400px){.hourly{padding:4px 7px}.hourly b{font-size:8px}.hourly small{font-size:11px}.abrand{font-size:34px}.ahost canvas{height:120px}}
/* ---------- v7.1: illustrated backgrounds, desktop control panel, top-up ---------- */
body.lobby6{background:#14051f var(--lobbybg) center top/cover no-repeat fixed}
body.lobby6::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(10,2,20,.35),rgba(10,2,20,.7))}
.emptybal{display:block;width:100%;color:#ffe9a8;font:700 15px/1.3 "Trebuchet MS",sans-serif;cursor:pointer}
.tuov .dwbox{max-width:360px;text-align:center}
.tusub{margin:6px 0 12px;color:#f3e3c0;font-size:14px}
.tucd{display:inline-flex;flex-direction:column;padding:10px 22px;border-radius:16px;background:rgba(0,0,0,.45);border:1px solid rgba(255,210,90,.5);margin-bottom:12px}
.tucd small{font-size:11px;letter-spacing:2px;color:#ffd35a}.tucd b{font:900 34px/1.1 Georgia,serif;color:#fff;font-variant-numeric:tabular-nums}
.tuov .hfsb{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.tuov .pill[disabled]{opacity:.55;filter:grayscale(.4)}
.tunote{margin:12px 0 0;font-size:11px;opacity:.7}
/* desktop: the right control panel hugs its content and sits centred, no dead space under MAX BET */
@media (orientation:landscape) and (min-width:1001px) and (min-height:521px){
  .game.slot5x3 .controls,.game.ways .controls{align-self:center;justify-content:center;gap:18px;height:auto;max-height:100%;padding:14px 10px}
  .game.slot5x3 .controls>*,.game.ways .controls>*{flex:0 0 auto}
}
@media (orientation:landscape) and (min-width:1001px) and (min-height:521px){
  .game.ways .host.cameo{right:auto;left:calc(min(22vw,330px)/2 - 6vh);top:auto;bottom:3vh;height:min(24vh,240px)}
}
/* ================= v7.1 crystal-ball SPIN ================= */
.cball{--B:108px;position:relative;width:var(--B);height:var(--B);flex:0 0 var(--B);padding:0;border:0;background:none;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;isolation:isolate;z-index:2}
.cball>span,.cball .cb-ball>*{position:absolute;pointer-events:none}
.cb-ring{left:-33%;top:-30%;width:166%;height:166%;background:url(../assets/img/cb/ring.webp) center/contain no-repeat;z-index:3;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6))}
.cb-ball{inset:0;border-radius:50%;overflow:hidden;z-index:2;transform:translateZ(0);transition:transform .18s cubic-bezier(.3,1.6,.5,1);background:#12002a;box-shadow:0 0 0 1px rgba(255,220,140,.4)}
.cb-core{inset:-2%;background:url(../assets/img/cb/core.webp) center/cover;border-radius:50%;animation:spinbg 36s linear infinite;will-change:transform}
.cb-core2{inset:-6%;opacity:.42;animation:cbrev 52s linear infinite}
@keyframes cbrev{to{transform:rotate(-360deg) scale(1.08)}}
.cb-shell{inset:0;background:url(../assets/img/cb/shell.webp) center/cover;border-radius:50%;z-index:4}
.cb-flare{inset:0;border-radius:50%;z-index:5;opacity:0;background:radial-gradient(circle at 50% 45%,rgba(255,240,200,.85),rgba(255,190,90,.35) 35%,transparent 70%);transition:opacity .2s}
.cb-sp{left:var(--x);top:var(--y);width:7%;height:7%;border-radius:50%;z-index:2;background:radial-gradient(circle,#fff 0,#ffe7a0 30%,rgba(255,200,90,0) 70%);opacity:0;animation:cbsp var(--t) ease-in-out var(--d) infinite}
@keyframes cbsp{0%{opacity:0;transform:translate(0,0) scale(.3)}30%{opacity:1;transform:translate(-10%,-60%) scale(1)}70%{opacity:.7;transform:translate(20%,-140%) scale(.8)}100%{opacity:0;transform:translate(0,-220%) scale(.3)}}
.cb-flk{left:21%;top:13%;width:58%;height:58%;z-index:3;animation:cbfloat 3.6s ease-in-out infinite}
.cb-flake{position:absolute;inset:0;background:url(../assets/img/snow_512.webp) center/contain no-repeat;filter:drop-shadow(0 0 6px rgba(255,210,110,.9));animation:spinbg 24s linear infinite;will-change:transform}
@keyframes cbfloat{50%{transform:translateY(-6%) scale(1.03)}}
.cb-lbl{left:0;right:0;bottom:17%;z-index:3;text-align:center;font:900 calc(var(--B)*.15)/1 Georgia,serif;letter-spacing:.08em;color:#fff3c4;text-shadow:0 0 6px #ffb52e,0 0 14px #b44dff,0 2px 0 #5a2a00}
.cb-aura{inset:-14%;border-radius:50%;z-index:0;background:radial-gradient(circle,rgba(190,110,255,.75) 30%,rgba(255,190,70,.35) 55%,transparent 70%);animation:cbaura 2.6s ease-in-out infinite}
@keyframes cbaura{0%,100%{opacity:.55;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}
.cb-pulse{inset:-4%;border-radius:50%;z-index:1;border:3px solid rgba(255,215,120,.9);box-shadow:0 0 18px #c77dff;opacity:0}
.cball.spinning .cb-pulse{animation:cbpulse .9s ease-out infinite}.cball.spinning .cb-pulse.p2{animation-delay:.45s}
@keyframes cbpulse{from{opacity:.9;transform:scale(.95)}to{opacity:0;transform:scale(1.55)}}
.cball.spinning .cb-aura{animation-duration:.7s}
.cball.spinning .cb-flare{opacity:.35}
.cball:hover .cb-flare{opacity:.3}
.cball:active .cb-ball{transform:scale(1.07,.9)}.cball:active .cb-flare{opacity:.8}.cball:active .cb-ring{transform:scale(.97)}
.cb-ring{transition:transform .18s}
.cb-bolt{right:-6%;top:-6%;z-index:4;font-size:calc(var(--B)*.2);opacity:0;transform:scale(.4);transition:transform .25s cubic-bezier(.3,1.6,.5,1),opacity .2s;filter:drop-shadow(0 0 6px #ffd23f)}
.cball.turbo .cb-bolt{opacity:1;transform:none}
.cball.turbo .cb-core{animation-duration:20s}
.cb-badge{left:-8%;top:-6%;z-index:4;min-width:30%;padding:2px 6px;border-radius:12px;font:900 calc(var(--B)*.12)/1.2 "Trebuchet MS",sans-serif;color:#3a1000;background:linear-gradient(#fff3b0,#ffc531);box-shadow:0 0 10px #ffc531;opacity:0;transform:scale(.4);transition:transform .25s,opacity .2s}
.cball.auto .cb-badge{opacity:1;transform:none}
body.fxlow .cb-sp,body.fxlow .cb-core2{display:none}
/* the panel: the ball dominates, the rest tucks around it */
.ctl-row.main{align-items:center}
.ctl-row.main .cball{margin:14px 22px}
@media (max-height:700px){.cball{--B:92px}}
.game.ways .cball{--B:96px}
/* phone landscape + iPad/desktop landscape: column panel — bet on top, the ball, turbo/auto tucked at its lower corners */
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  .game.slot5x3 .ctl-row.main,.game.ways .ctl-row.main{position:relative;display:flex;justify-content:center;padding:0;margin:0 auto;flex-wrap:nowrap}
  .game.slot5x3 .ctl-row.main .cball,.game.ways .ctl-row.main .cball{--B:min(18vh,110px,calc(var(--pw,150px)*.62));order:0;margin:calc(var(--B)*.3) 0 calc(var(--B)*.34)}
  .game.slot5x3 .ctl-row.main .round.side,.game.ways .ctl-row.main .round.side{position:absolute;bottom:0;width:40px;height:40px;font-size:16px;z-index:4}
  .game.slot5x3 .ctl-row.main #turbo,.game.ways .ctl-row.main #turbo{left:0}
  .game.slot5x3 .ctl-row.main #auto,.game.ways .ctl-row.main #auto{right:0}
  .game.slot5x3 .round.side small,.game.ways .round.side small{font-size:7px}
  .game.slot5x3 .controls,.game.ways .controls{justify-content:center;gap:6px}
}
@media (orientation:landscape) and (min-width:960px) and (min-height:521px){
  .game.slot5x3 .ctl-row.main .cball,.game.ways .ctl-row.main .cball{--B:min(20vh,150px)}
  .game.slot5x3 .ctl-row.main .round.side,.game.ways .ctl-row.main .round.side{width:54px;height:54px;font-size:20px}
  .game.slot5x3 .round.side small,.game.ways .round.side small{font-size:8px}
}
/* iPad portrait: bigger ball */
@media (min-width:740px) and (orientation:portrait){.cball,.game.ways .cball{--B:150px}.ctl-row.main .cball{margin:22px 40px}}
.acard input[hidden]{display:none}
/* ================= v7.1 layout pass: the ball dominates ================= */
.ctl-row.main .cball{margin:calc(var(--B)*.3) calc(var(--B)*.36)}
@media (orientation:portrait){.cball{--B:min(30vw,128px)}.game.ways .cball{--B:min(28vw,118px)}}
@media (orientation:landscape) and (max-height:520px), (orientation:landscape) and (min-width:960px){
  /* column: ball on its own line, turbo + auto as a tidy pair right under it */
  .game.slot5x3 .ctl-row.main,.game.ways .ctl-row.main{flex-wrap:wrap;gap:0 10px;width:100%}
  .game.slot5x3 .ctl-row.main .cball,.game.ways .ctl-row.main .cball{--B:min(25vh,104px);margin:calc(var(--B)*.3) calc(50% - var(--B)/2) calc(var(--B)*.33)}
  .game.slot5x3 .ctl-row.main .round.side,.game.ways .ctl-row.main .round.side{position:relative;left:auto!important;right:auto!important;bottom:auto;order:2;width:46px;height:38px;border-radius:19px;font-size:15px}
}
@media (orientation:landscape) and (min-width:960px) and (min-height:521px){
  .game.slot5x3 .ctl-row.main .cball,.game.ways .ctl-row.main .cball{--B:min(19vh,172px)}
  .game.slot5x3 .ctl-row.main .round.side,.game.ways .ctl-row.main .round.side{width:64px;height:48px;border-radius:24px;font-size:19px}
}
@media (min-width:740px) and (orientation:portrait){.cball,.game.ways .cball{--B:170px}}
/* ================= v7.1 motion ================= */
/* reel stop: overshoot bounce + a sparkle flash along the reel (transform/opacity only) */
.reel.land{animation:rland .34s cubic-bezier(.3,1.7,.5,1)}
@keyframes rland{0%{transform:translateY(-3.5%)}60%{transform:translateY(1.2%)}100%{transform:none}}
.reel.land::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;background:linear-gradient(180deg,transparent,rgba(255,240,190,.35) 50%,transparent);opacity:0;animation:rlandf .45s ease-out}
@keyframes rlandf{0%{opacity:.9;transform:scaleY(.2)}100%{opacity:0;transform:scaleY(1.1)}}
/* idle shine sweep across every symbol, staggered per cell */
.reels .cell[data-i]::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.32) 50%,transparent 60%);transform:translateX(-120%);animation:idleshine 6s ease-in-out var(--sd,0s) infinite}
@keyframes idleshine{0%,80%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.reels .cell{overflow:hidden}
/* glowing WILD / pulsing scatter: a glow layer animates opacity + scale, the art stays still */
.cell.is-wild::after,.cell.is-scat::after{content:"";position:absolute;inset:6%;z-index:0;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,225,120,.75),rgba(255,170,40,.25) 45%,transparent 70%);animation:wglow 1.8s ease-in-out infinite}
.cell.is-scat::after{background:radial-gradient(circle,rgba(200,140,255,.7),rgba(120,60,255,.22) 45%,transparent 70%);animation-duration:2.4s}
.cell.is-wild img,.cell.is-scat img{position:relative;z-index:1}
@keyframes wglow{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.08)}}
.cell.win.is-wild::after,.cell.win.is-scat::after{animation:wglow .6s ease-in-out infinite}
/* jackpot bar shimmer */
.jackpots .jp::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-110%);animation:jpshim 5s ease-in-out infinite}
.jackpots .jp:nth-child(2)::after{animation-delay:.6s}.jackpots .jp:nth-child(3)::after{animation-delay:1.2s}.jackpots .jp:nth-child(4)::after{animation-delay:1.8s}
@keyframes jpshim{0%,70%{transform:translateX(-110%)}100%{transform:translateX(110%)}}
/* lobby cards: pointer tilt + layered parallax, plus a gentle idle float */
.pcard{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease-out;will-change:transform}
.pcard.tilt{transition:transform .06s linear}
.pcard .plogo,.pcard .phost,.pcard .psyms,.pcard .prun{transition:transform .25s ease-out}
.pcard.tilt .plogo{transform:translate(calc(var(--ry)*-0.9),calc(var(--rx)*0.9)) scale(1.04)}
.pcard.tilt .phost,.pcard.tilt .prun{transform:translate(calc(var(--ry)*-1.6),calc(var(--rx)*1.2))}
.pcard.tilt .pbg{transform:translate(calc(var(--ry)*.6),calc(var(--rx)*-.5)) scale(1.06)}
.pcard .pbg{transition:transform .25s ease-out}
/* big-win flash */
.fxflash{position:fixed;inset:0;z-index:70;pointer-events:none;background:radial-gradient(circle at 50% 45%,#fff 0,rgba(255,230,150,.85) 30%,rgba(255,170,60,0) 75%);opacity:0}
/* balance pill pop when coins arrive */
.balpill.bump{animation:balbump .35s cubic-bezier(.3,1.7,.5,1)}
@keyframes balbump{40%{transform:scale(1.12)}}
/* low-power: keep the essentials, drop the always-on layers */
body.fxlow .reels .cell[data-i]::before,body.fxlow .jackpots .jp::after{display:none}
body.fxlow .cell.is-wild::after,body.fxlow .cell.is-scat::after{animation:none;opacity:.6}
@media (prefers-reduced-motion:reduce){.reels .cell[data-i]::before,.jackpots .jp::after,.cell.is-wild::after,.cell.is-scat::after{animation:none}.pcard{transform:none!important}}
.acctbar .vaultbtn{display:inline-block;margin-right:8px;padding:4px 12px;border-radius:14px;font:900 12px/1.4 "Trebuchet MS",sans-serif;letter-spacing:1px;text-decoration:none;color:#3a1000;background:linear-gradient(#fff3b0,#ffc531);box-shadow:0 0 8px rgba(255,197,49,.6)}
input,textarea,select{user-select:text;-webkit-user-select:text}

/* v7.1 vault PIN (ported from 0702d hotfix, polished) */
input,textarea,select{-webkit-touch-callout:default}
.vcard .pinin{-webkit-text-security:disc;text-security:disc;font-size:24px;letter-spacing:.35em;text-align:center}
.vcard .pinin.pinact{border-color:#ffcf4a;box-shadow:0 0 0 2px #ffcf4a55}
.pinpad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px auto;max-width:300px}
.pinpad button{font-family:inherit;font-weight:800;font-size:28px;line-height:1;min-height:58px;padding:0;border-radius:16px;border:1px solid #8a6328;background:radial-gradient(120% 90% at 50% 15%,#5a3a16,#1c0d03 70%);color:#ffe6a0;text-shadow:0 1px 0 #000,0 0 10px #ffcf4a66;box-shadow:inset 0 1px 0 #ffe6a033,0 3px 0 #0008;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:transform .08s,background .15s}
.pinpad button:active{transform:translateY(2px) scale(.96);background:radial-gradient(120% 90% at 50% 15%,#8a5a1e,#2a1406 70%);box-shadow:inset 0 1px 0 #ffe6a055,0 1px 0 #0008}
.pinpad .pk-del,.pinpad .pk-ok{font-size:24px;color:#ffcf4a}
.pinpad .pk-ok{background:radial-gradient(120% 90% at 50% 15%,#c99a2e,#5a3a0c 70%);color:#1c0d03;text-shadow:none}
.vcard .pinin::placeholder{letter-spacing:.04em;font-size:17px}
.vcard .pinin{padding-top:10px;padding-bottom:10px}
.pinpad{gap:8px;margin:10px auto}.pinpad button{min-height:50px}
@media (max-height:700px){.pinpad button{min-height:44px;font-size:26px}}
/* v7.1 guest mode */
.playfree{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:4px;width:min(92vw,420px);margin:6px auto 14px;padding:16px 18px 13px;border:2px solid #fff3b0;border-radius:22px;cursor:pointer;color:#2a1000;background:linear-gradient(180deg,#fff1a8 0%,#ffcf4a 35%,#f29a12 75%,#c46a00 100%);box-shadow:0 0 0 3px #7a3c00,0 0 28px #ffcf4acc,0 8px 0 #6a3000,0 14px 30px #000a;font-family:inherit;-webkit-tap-highlight-color:transparent;animation:pfpulse 1.6s ease-in-out infinite;z-index:2}
.playfree b{font:900 clamp(28px,8vw,40px)/1 Georgia,serif;letter-spacing:.06em;text-shadow:0 2px 0 #fff6,0 -1px 0 #0003}
.playfree small{font-weight:800;font-size:12px;letter-spacing:.18em;color:#5a2600}
.playfree .pfshine{position:absolute;inset:-40% auto -40% -30%;width:30%;background:linear-gradient(90deg,transparent,#fffe,transparent);transform:skewX(-20deg);animation:pfshine 2.4s ease-in-out infinite;pointer-events:none}
.playfree:active{transform:translateY(4px);box-shadow:0 0 0 3px #7a3c00,0 0 20px #ffcf4a99,0 3px 0 #6a3000}
@keyframes pfpulse{0%,100%{box-shadow:0 0 0 3px #7a3c00,0 0 18px #ffcf4a99,0 8px 0 #6a3000,0 14px 30px #000a}50%{box-shadow:0 0 0 3px #7a3c00,0 0 42px #ffe27aff,0 8px 0 #6a3000,0 14px 30px #000a}}
@keyframes pfshine{0%{left:-40%}60%,100%{left:130%}}
.guestbar{position:fixed;left:50%;bottom:max(6px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:900;display:flex;align-items:center;gap:8px;max-width:calc(100vw - 12px);padding:5px 6px 5px 12px;border-radius:999px;background:#140700e6;border:1px solid #ffcf4a99;box-shadow:0 4px 18px #000a;color:#ffe6a0;font-size:12.5px;line-height:1.2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.guestbar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guestbar .pill{padding:6px 12px;font-size:12px;white-space:nowrap}
.guestbar .gblog{background:none;border:0;color:#ffcf4a;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;padding:4px 6px;white-space:nowrap}
@media (max-width:520px){.guestbar{font-size:11px}.guestbar .gblog{display:none}}
.guesttag{align-self:center;padding:6px 10px;border-radius:999px;border:1px solid #ffcf4a88;color:#ffcf4a;font-weight:800;font-size:11px;letter-spacing:.12em;white-space:nowrap}
body.hasguest.lobby #app{padding-bottom:52px}
@media (prefers-reduced-motion:reduce){.playfree,.playfree .pfshine{animation:none}}
/* v7.1 explosive wins */
body.fxpulse #reels,body.fxpulse .reels{animation:fxpulse .65s cubic-bezier(.2,1.6,.4,1)}
@keyframes fxpulse{0%{transform:scale(1)}30%{transform:scale(1.045)}100%{transform:scale(1)}}
body.fxwild .reels{box-shadow:0 0 0 3px #ffd45a,0 0 40px #ff6ad5aa,0 0 80px #7fd8ff66;animation:wildglow 1.2s ease-in-out infinite}
@keyframes wildglow{0%,100%{box-shadow:0 0 0 3px #ffd45a,0 0 30px #ff6ad599,0 0 60px #7fd8ff55}50%{box-shadow:0 0 0 3px #fff3b0,0 0 56px #ffd45acc,0 0 110px #ff6ad577}}
body.fxlow.fxwild .reels{animation:none}
@media (prefers-reduced-motion:reduce){body.fxpulse .reels,body.fxwild .reels{animation:none}}
/* v7.1 crystal ball, final: perfectly concentric layers (rim, glass, glow, logo), one symmetric polished gold rim, shadow straight down */
.cball .cb-ring{inset:-11%;left:-11%;top:-11%;width:auto;height:auto;border-radius:50%;z-index:1;background:
  radial-gradient(circle at 50% 50%,transparent 63%,rgba(0,0,0,.35) 64.5%,transparent 66%),
  conic-gradient(from 0deg,#fff4c2,#d9a336 12.5%,#fff0b0 25%,#b8801f 37.5%,#fff4c2 50%,#d9a336 62.5%,#fff0b0 75%,#b8801f 87.5%,#fff4c2);
  box-shadow:0 7px 14px rgba(0,0,0,.55),inset 0 0 0 1.5px #7a4f0c,inset 0 0 0 3px rgba(255,246,200,.55);filter:none}
.cball .cb-ring::after{content:"";position:absolute;inset:7.5%;border-radius:50%;box-shadow:0 0 0 2px #6b420a,0 0 0 3.5px rgba(255,240,190,.8),inset 0 0 10px rgba(0,0,0,.6)}
.cball .cb-ball{inset:0;z-index:2;box-shadow:inset 0 -6px 14px rgba(0,0,0,.45),inset 0 6px 12px rgba(255,255,255,.12)}
.cball .cb-aura{inset:-24%;background:radial-gradient(circle at 50% 50%,rgba(255,210,110,.5) 42%,rgba(190,110,255,.28) 56%,transparent 70%)}
.cball .cb-flk{left:30%;top:30%;width:40%;height:40%;animation:cbbreath 3.6s ease-in-out infinite}
@keyframes cbbreath{50%{transform:scale(1.05)}}
.cball .cb-flake{filter:drop-shadow(0 0 4px rgba(255,230,150,.95)) drop-shadow(0 0 10px rgba(255,180,60,.7))}
.cball .cb-lbl{bottom:auto;top:72%;font:900 calc(var(--B)*.15)/1 "Arial Black","Trebuchet MS",Arial,sans-serif;letter-spacing:.06em;color:#fffbe6;
  -webkit-text-stroke:calc(var(--B)*.012) #3a1a00;paint-order:stroke fill;text-shadow:0 0 calc(var(--B)*.05) #ffd45a,0 0 calc(var(--B)*.11) #ffb52e,0 1px 0 #3a1a00}
.cball .cb-shell{opacity:.9}
.cball .cb-core2{animation:cbrev 18s linear infinite;opacity:.5}
.cball:active .cb-ring{transform:scale(.97)}
/* v7.1 free-spins counter in the ball + DISCO mode */
.cball .cb-fs,.cball .cb-fsm,.cball .cb-plus,.cball .cb-disco{opacity:0;pointer-events:none}
.cball .cb-fs{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:opacity .25s}
.cball .cb-fs::before{content:"";position:absolute;inset:20%;border-radius:50%;background:radial-gradient(circle,rgba(10,0,25,.78) 0,rgba(10,0,25,.55) 55%,transparent 75%);z-index:-1}
.cball .cb-fsn{font:900 calc(var(--B)*.36)/.9 "Arial Black","Trebuchet MS",Arial,sans-serif;color:#fffbe6;-webkit-text-stroke:calc(var(--B)*.014) #2a0e00;paint-order:stroke fill;text-shadow:0 0 calc(var(--B)*.06) #ffd45a,0 0 calc(var(--B)*.14) #ff9d2e}
.cball .cb-fsn.pop{animation:fsnpop .45s cubic-bezier(.2,1.8,.4,1)}
@keyframes fsnpop{0%{transform:scale(1.55)}100%{transform:scale(1)}}
.cball .cb-fs small{font:800 calc(var(--B)*.075)/1.05 "Trebuchet MS",Arial,sans-serif;letter-spacing:.06em;text-align:center;color:#ffe9a8;text-shadow:0 1px 2px #000,0 0 6px #000}
.cball .cb-fsm{position:absolute;left:50%;top:-14%;transform:translateX(-50%);z-index:7;font:900 calc(var(--B)*.13)/1 "Arial Black",Arial,sans-serif;font-style:normal;white-space:nowrap;padding:3px 9px;border-radius:999px;color:#2a0e00;background:linear-gradient(#fff3b0,#ffc531);box-shadow:0 0 12px #ffc531;transition:opacity .25s}
.cball .cb-plus{position:absolute;left:50%;top:30%;z-index:8;font:900 calc(var(--B)*.3)/1 "Arial Black",Arial,sans-serif;color:#fff;text-shadow:0 0 10px #ffd45a,0 0 22px #ff6ad5;transform:translate(-50%,0)}
.cball .cb-plus.go{animation:fsplus 1.4s ease-out}
@keyframes fsplus{0%{opacity:0;transform:translate(-50%,10%) scale(.4)}20%{opacity:1;transform:translate(-50%,-30%) scale(1.3)}100%{opacity:0;transform:translate(-50%,-160%) scale(1)}}
.cball.fsmode .cb-fs{opacity:1}.cball.fsmode .cb-fsm:not([hidden]){opacity:1}
.cball.fsmode .cb-lbl{opacity:0}.cball.fsmode .cb-flk{opacity:.22}
/* disco: rotating mirror-tile facets (background scroll = GPU-cheap rotation illusion), glints, rainbow cycle, beat pulse */
.cball .cb-disco{position:absolute;inset:0;border-radius:50%;z-index:4;mix-blend-mode:screen;transition:opacity .3s;
  background:radial-gradient(circle at 50% 50%,transparent 40%,rgba(0,0,0,.5) 100%),
  repeating-linear-gradient(90deg,rgba(255,255,255,.0) 0 9%,rgba(255,255,255,.85) 9% 11%),
  repeating-linear-gradient(0deg,rgba(255,255,255,.0) 0 9%,rgba(255,255,255,.85) 9% 11%),
  linear-gradient(90deg,#ff3b3baa,#ffd21faa,#3bff5aaa,#1fd2ffaa,#8a3bffaa,#ff1fb6aa,#ff3b3baa);
  background-size:100% 100%,40% 100%,100% 22%,200% 100%;animation:discospin 2.4s linear infinite}
@keyframes discospin{to{background-position:0 0,40% 0,0 0,200% 0}}
.cball.disco .cb-disco{opacity:1}
.cball.disco .cb-core{animation:spinbg 6s linear infinite,discohue 3s linear infinite}
.cball.disco .cb-ball{animation:discobeat var(--beat,.45s) ease-out infinite}
@keyframes discohue{to{filter:hue-rotate(360deg)}}
@keyframes discobeat{0%{transform:scale(1.05)}60%{transform:scale(1)}}
.cball.disco .cb-sp{animation-duration:.9s}
.cball.disco .cb-aura{background:conic-gradient(#ff3b3b88,#ffd21f88,#3bff5a88,#1fd2ff88,#8a3bff88,#ff1fb688,#ff3b3b88);-webkit-mask:radial-gradient(circle,transparent 46%,#000 52%,transparent 70%);mask:radial-gradient(circle,transparent 46%,#000 52%,transparent 70%);animation:spinbg 2s linear infinite}
.cball.disco .cb-fs,.cball.disco .cb-fsm,.cball.disco .cb-lbl{filter:none}
body.fxlow .cball.disco .cb-ball{animation:discobeat var(--beat,.45s) ease-out infinite}
@media (prefers-reduced-motion:reduce){.cball.disco .cb-disco,.cball.disco .cb-ball,.cball.disco .cb-aura{animation:none}}
/* v7.1 (13:11): big centred flake (70%, slow 8s rotation) with big SPIN on top at dead centre */
.cball .cb-flk{left:15%;top:15%;width:70%;height:70%;animation:cbflkrot 8s linear infinite;will-change:transform}
.cball .cb-flk .cb-flake{animation:none}
@keyframes cbflkrot{to{transform:rotate(360deg)}}
.cball.flkfast .cb-flk{animation:cbflkfast .8s cubic-bezier(.15,.7,.3,1)}
@keyframes cbflkfast{from{transform:rotate(0)}to{transform:rotate(1080deg)}}
.cball .cb-lbl{top:50%;transform:translateY(-50%);font:900 calc(var(--B)*.25)/1 "Arial Black","Trebuchet MS",Arial,sans-serif;letter-spacing:.04em;color:#fffbe6;
 -webkit-text-stroke:calc(var(--B)*.018) #1a0800;paint-order:stroke fill;text-shadow:0 0 calc(var(--B)*.05) #000,0 0 calc(var(--B)*.08) #ffd45a,0 0 calc(var(--B)*.16) #ff9d2e;z-index:5}
.cball.fsmode .cb-flk{opacity:.18}
@media (prefers-reduced-motion:reduce){.cball .cb-flk{animation:none}}
/* v7.1 (13:12): logo and SPIN TAKE TURNS — flake 2 s, SPIN 3 s, 0.4 s zoom-crossfade, loop (5 s) */
.cball .cb-flk .cb-flake{animation:cbturnflk 5s ease-in-out infinite;transform-origin:50% 50%}
.cball .cb-lbl{font-size:calc(var(--B)*.21);animation:cbturnlbl 5s ease-in-out infinite}
@keyframes cbturnflk{0%,36%{opacity:1;transform:scale(1)}44%,92%{opacity:0;transform:scale(.55)}100%{opacity:1;transform:scale(1)}}
@keyframes cbturnlbl{0%,36%{opacity:0;transform:translateY(-50%) scale(1.4)}44%,92%{opacity:1;transform:translateY(-50%) scale(1)}100%{opacity:0;transform:translateY(-50%) scale(1.4)}}
.cball.fsmode .cb-flk,.cball.fsmode .cb-lbl{opacity:0!important;animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.cball .cb-flk .cb-flake{animation:none}.cball .cb-lbl{animation:none;opacity:0}}
/* tuned: 4.5 s loop — logo ~1.5 s, SPIN ~3 s, 0.4 s zoom-crossfades */
.cball .cb-flk .cb-flake{animation:cbturnflk2 4.5s ease-in-out infinite}
.cball .cb-lbl{animation:cbturnlbl2 4.5s ease-in-out infinite}
@keyframes cbturnflk2{0%,29%{opacity:1;transform:scale(1)}38%,91%{opacity:0;transform:scale(.55)}100%{opacity:1;transform:scale(1)}}
@keyframes cbturnlbl2{0%,29%{opacity:0;transform:translateY(-50%) scale(1.4)}38%,91%{opacity:1;transform:translateY(-50%) scale(1)}100%{opacity:0;transform:translateY(-50%) scale(1.4)}}
.dailybtn[hidden],#guestbar[hidden]{display:none!important}
body.fxrest *,body.fxrest *::before,body.fxrest *::after{animation-play-state:paused!important}
/* v7.2 Android/narrow-phone fixes */
@media (max-width:440px){
  .topbar{gap:6px}.topbar>*{min-width:0}
  body.lobby6 .brand{font-size:13px;letter-spacing:1px;flex:0 0 auto}
  .lvl{flex:0 0 auto;max-width:none;grid-template-columns:auto}.lvl .xpb,.lvl small{display:none}
  .hourly{padding:4px 8px}.hourly b{font-size:9px}
  .balpill{flex:0 1 auto;min-width:0;padding-right:10px}.balpill b{font-size:17px}.balpill small{display:none}
}
html,body{overflow-x:hidden}
@media (pointer:coarse){.ctl-row button{position:relative}.ctl-row button::after{content:"";position:absolute;inset:-7px}}
@media (orientation:landscape) and (max-height:500px){
  .vault .vhead{display:flex;flex-direction:row;gap:10px;align-items:center;justify-content:center;margin:4px 0}
  .vault .vhead img{height:40px;width:auto}.vault .vhead span{font-size:22px}.vault .vhead small{display:none}
  .vault h2,.vault h3{margin:4px 0;font-size:18px}
  .pinpad{grid-template-columns:repeat(6,1fr);max-width:520px;gap:6px;margin:8px auto}.pinpad button{min-height:44px;font-size:26px}
}
/* v7.2 heat: cut CSS animation load while reels spin (only reel strips + ball spin feedback keep running) */
.cball .cb-disco{animation:none}.cball.disco .cb-disco{animation:discospin 2.4s linear infinite}
body.reelspin :is(.cell,.jp,.biglogo,.frame,.host,.cb-aura,.cb-flk,.cb-flake,.cb-lbl,[class*="theme-"]),
body.reelspin :is(.cell,.jp,.biglogo,.frame,.host)::before,body.reelspin :is(.cell,.jp,.biglogo,.frame,.host)::after{animation-play-state:paused!important}
body.fxlow .cell{animation:none!important}

/* v7.1.4: balance + back button always visible — header sticks to the top when the machine is taller than the window (e.g. 800x750 desktop Safari) */
.game .topbar{position:sticky;top:0;z-index:40;background:linear-gradient(180deg,rgba(10,3,20,.92),rgba(10,3,20,.72) 70%,rgba(10,3,20,0));padding-top:max(env(safe-area-inset-top),6px)}
.wns .wnsbox h2{color:#ff8a8a}
/* v7.2.1 full-screen button + iPhone tip */
.fsbtn{color:#ffd76a;flex:0 0 auto}.fsbtn svg{display:block;filter:drop-shadow(0 1px 0 #000)}.fsbtn.on{color:#fff3c4}
.lobby .topbar .fsbtn,.topbar .balpill+.fsbtn{margin-left:8px}
.fstip{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9999;max-width:92vw;padding:10px 38px 10px 14px;border-radius:14px;font:600 14px/1.3 system-ui,sans-serif;color:#fff3c4;background:linear-gradient(#3a1a08,#100400) padding-box,var(--goldh) border-box;border:2px solid transparent;box-shadow:0 4px 12px rgba(0,0,0,.6)}
.fstip b{color:#ffd76a}.fstip button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:0;color:#ffd76a;font-size:16px}
