*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;background:#070207;color:#fff;font-family:Inter,"Segoe UI",Arial,sans-serif}
button{font:inherit}.hidden{display:none!important}
#fx{position:fixed;inset:0;width:100%;height:100%;z-index:100;pointer-events:none}
.top{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:10px 13px;background:rgba(7,2,7,.76);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06)}
.brand{font-weight:1000;background:linear-gradient(#fff5c2,#dfb24d);-webkit-background-clip:text;color:transparent}
.wallet{font-size:11px;color:#9e91a1}.wallet b{color:#62e9aa}

.lobby{min-height:100vh;padding:12px 0 28px;background:radial-gradient(circle at 50% 8%,#42112e,#0b0309 60%,#050205)}
.viewport{overflow-x:auto;width:100%;padding:0 10px;scrollbar-width:none}.viewport::-webkit-scrollbar{display:none}
.showroom{width:min(1500px,calc(100vw - 20px));min-width:1120px;aspect-ratio:1672/941;margin:auto;position:relative;border-radius:23px;overflow:hidden;box-shadow:0 28px 90px rgba(0,0,0,.6)}
.room{position:absolute;inset:-1%;width:102%;height:102%;object-fit:cover;animation:breathe 11s ease-in-out infinite alternate}
@keyframes breathe{to{transform:scale(1.025);filter:brightness(1.04) saturate(1.06)}}
.zone{position:absolute;top:25%;height:52%;border:0;background:transparent;cursor:pointer;border-radius:14px;transition:.22s;transform-origin:center bottom}
.zone:hover,.zone:focus-visible{transform:translateY(-9px) scale(1.035);filter:brightness(1.1)}
.zone:before{content:"";position:absolute;inset:-7%;border-radius:18px;background:radial-gradient(ellipse,var(--glow),transparent 66%);filter:blur(10px);opacity:.15;transition:.22s}
.zone:hover:before{opacity:.75}
.zone span{position:absolute;left:50%;bottom:-11%;transform:translateX(-50%);white-space:nowrap;padding:6px 9px;border-radius:999px;background:rgba(8,2,8,.9);border:1px solid var(--accent);font-size:10px;font-weight:900;opacity:0;transition:.2s}
.zone:hover span{opacity:1}

.game{min-height:100vh;background:radial-gradient(circle at 50% 12%,rgba(92,25,70,.3),transparent 38%),#050205}
.gamebar{position:sticky;top:0;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:rgba(5,2,6,.82);backdrop-filter:blur(16px)}
.back,.sound{border:1px solid rgba(255,255,255,.09);background:#120b14;color:#fff;border-radius:11px;padding:9px 12px;font-weight:900;cursor:pointer}
.gname{font-weight:1000;color:var(--accent);text-align:center}
.livebar{width:min(720px,calc(100% - 14px));margin:7px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;align-items:center;padding:8px 10px;border-radius:13px;background:rgba(10,5,11,.82);border:1px solid rgba(255,255,255,.06)}
.livebar .stat{font-size:9px;color:#8f8393;text-align:center}.livebar b{display:block;margin-top:2px;font-size:16px;color:#fff}.livebar .credits b{color:#65e9aa}.livebar .gain b{color:var(--accent)}

.machine-stage{width:min(720px,100%);margin:0 auto 20px;padding:0 6px}
.artbox{position:relative;width:100%;aspect-ratio:1122/1402;overflow:hidden;border-radius:18px;box-shadow:0 28px 80px rgba(0,0,0,.56);background:#12070f}
.art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reel-overlay{position:absolute;left:var(--left);top:var(--top);width:var(--rw);height:var(--rh);display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:2px;background:#160c14;overflow:hidden;box-shadow:0 0 0 2px rgba(255,220,130,.38)}
.reel{position:relative;height:100%;overflow:hidden;background:#160c14}
.strip{position:absolute;left:0;right:0;top:0;will-change:transform,filter}
.reel.spinning .strip{filter:blur(3px) saturate(1.08)}
.tile{width:100%;padding:1px;background:#1a1017}
.tile img{width:100%;height:100%;object-fit:fill;display:block;border-radius:2px}
.tile.win img{outline:3px solid #ffe35d;box-shadow:0 0 16px var(--accent);filter:brightness(1.15);animation:pulse .48s ease-in-out infinite alternate}
@keyframes pulse{to{transform:scale(.96)}}
.line-svg{position:absolute;left:var(--left);top:var(--top);width:var(--rw);height:var(--rh);z-index:10;pointer-events:none;overflow:visible}
.payline{fill:none;stroke:#ffe65e;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;opacity:0;filter:drop-shadow(0 0 5px #ffcb38)}
.payline.on{animation:line 1.4s ease forwards}
@keyframes line{0%{opacity:0}18%,72%{opacity:.95}100%{opacity:.12}}

.native-meter{
 position:absolute;z-index:18;display:flex;align-items:center;justify-content:center;
 pointer-events:none;overflow:hidden;background:transparent!important;border:0!important;
}
.native-meter b{
 width:100%;text-align:center;white-space:nowrap;
 font-family:"Arial Narrow","Roboto Condensed",Arial,sans-serif;
 font-weight:900;font-size:clamp(8px,2.0vw,24px);line-height:1;
 letter-spacing:.01em;text-shadow:0 0 4px currentColor,0 1px 2px #000;
}
.native-credits b{color:#f1f1f1}
.native-bet b{color:#f3f3f3}
.native-win b{color:#ffd84d}
@media(max-width:720px){.native-meter b{font-size:clamp(7px,2.8vw,17px)}}

.spin-hot{position:absolute;right:1.8%;top:63%;width:18%;height:17%;border:0;background:transparent;border-radius:50%;cursor:pointer;z-index:20}
.spin-hot:active{background:rgba(100,255,120,.08)}
.controls{width:min(720px,calc(100% - 14px));margin:0 auto 28px;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.bet{border:1px solid rgba(255,255,255,.09);background:#171019;color:#fff;border-radius:10px;padding:10px 13px;font-weight:900;cursor:pointer}
.bet.on{background:linear-gradient(#fff0aa,#d6aa44);color:#221503;border-color:#ffe17d}
.auto{border:1px solid #4bd46a;background:#123e1e;color:#d9ffe0;border-radius:999px;padding:11px 16px;font-weight:900;cursor:pointer}
.auto.on{background:#1e7534}
.message{width:min(720px,calc(100% - 14px));margin:-16px auto 30px;text-align:center;color:#a395a6;font-weight:900;min-height:22px}



.bottom-console{
 width:min(720px,calc(100% - 16px));
 margin:10px auto 6px;
 padding:12px;
 border-radius:22px;
 border:1px solid color-mix(in srgb,var(--accent) 42%,rgba(255,255,255,.08));
 background:
   linear-gradient(180deg,rgba(42,14,37,.68),rgba(10,5,11,.62)),
   radial-gradient(circle at 50% 0,var(--glow),transparent 70%);
 backdrop-filter:blur(16px);
 box-shadow:
   inset 0 1px 0 rgba(255,255,255,.05),
   0 12px 28px rgba(0,0,0,.25),
   0 0 22px var(--glow);
}
.console-stats{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:7px;
}
.console-stat{
 padding:10px 7px;
 border-radius:14px;
 text-align:center;
 background:rgba(8,4,9,.36);
 border:1px solid rgba(255,255,255,.055);
}
.console-stat span{
 display:block;
 font-size:8px;
 letter-spacing:.12em;
 color:#9e91a2;
 font-weight:900;
}
.console-stat b{
 display:block;
 margin-top:3px;
 font-size:17px;
 color:#fff4c2;
 text-shadow:0 0 8px rgba(255,220,110,.18);
}
.console-stat:first-child b{color:#62e9aa}
.console-stat:nth-child(3) b{color:var(--accent)}

.console-actions{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:7px;
 margin-top:8px;
}
.console-actions button{
 min-height:43px;
 border-radius:13px;
 border:1px solid rgba(255,255,255,.08);
 background:linear-gradient(180deg,rgba(56,28,62,.88),rgba(20,10,23,.92));
 color:#fff;
 font-weight:1000;
 cursor:pointer;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.console-actions button:active{
 transform:translateY(2px);
}
.console-actions #bottomMax{
 color:#2a1600;
 background:linear-gradient(#fff2a6,#d7aa43 62%,#8b570f);
 border-color:#f7d572;
}
.console-actions #bottomAuto.on{
 background:linear-gradient(#63e577,#1e8735);
 border-color:#93f2a0;
 color:#071b0b;
 box-shadow:0 0 18px rgba(67,220,92,.23);
}
@media(max-width:720px){
 .bottom-console{
   width:calc(100% - 12px);
   margin:8px auto 4px;
   padding:10px;
   border-radius:20px;
 }
 .console-stat{padding:8px 5px}
 .console-stat b{font-size:15px}
 .console-actions button{min-height:42px}
}

.float-nav{
 position:fixed;left:0;right:0;top:0;z-index:85;pointer-events:none;
 padding-top:max(8px, env(safe-area-inset-top));
}
.fab{
 pointer-events:auto;position:absolute;top:8px;width:46px;height:46px;border-radius:16px;
 border:1px solid rgba(255,255,255,.10);background:rgba(12,5,13,.42);backdrop-filter:blur(10px);
 color:#fff;font-size:22px;font-weight:900;cursor:pointer;box-shadow:0 10px 25px rgba(0,0,0,.22)
}
.fab-left{left:10px}.fab-right{right:10px}
.machine-stage{
 width:min(760px,100%);margin:0 auto;padding:calc(max(62px, env(safe-area-inset-top) + 54px)) 6px 6px;
}
.message{
 width:min(720px,calc(100% - 16px));margin:6px auto 20px;text-align:center;color:#b8a7ba;
 font-weight:900;min-height:24px;text-shadow:0 1px 2px #000
}
.hot{
 position:absolute;z-index:22;border:0;background:transparent;cursor:pointer;border-radius:16px;
}
.hot:active,.spin-hot:active{background:rgba(255,255,255,.07)}
.hot-minus{left:34.3%;top:72.9%;width:7.4%;height:4.3%}
.hot-plus{left:47.0%;top:72.9%;width:7.4%;height:4.3%}
.hot-max{left:70.2%;top:71.6%;width:10.0%;height:5.2%}
.hot-auto{left:80.7%;top:71.6%;width:9.0%;height:5.2%}
.hot-auto.on{background:rgba(54,210,88,.22);box-shadow:0 0 18px rgba(54,210,88,.32) inset,0 0 18px rgba(54,210,88,.25)}
.spin-hot{right:1.8%;top:63%;width:18%;height:17%;border-radius:50%}

.gamebar,.livebar,.controls{display:none!important}

@media(max-width:720px){
 .fab{top:6px;width:42px;height:42px;border-radius:14px}
 .fab-left{left:8px}.fab-right{right:8px}
 .machine-stage{padding:calc(max(56px, env(safe-area-inset-top) + 48px)) 0 2px}
 .message{margin:4px auto 14px}
 .hot-minus{left:34.1%;top:72.8%;width:7.7%;height:4.5%}
 .hot-plus{left:46.9%;top:72.8%;width:7.7%;height:4.5%}
 .hot-max{left:70.1%;top:71.5%;width:10.3%;height:5.5%}
 .hot-auto{left:80.8%;top:71.5%;width:9.1%;height:5.5%}
 .spin-hot{right:1.6%;top:63.1%;width:18.6%;height:17.2%}
}


.game{
 position:relative;
 min-height:100dvh;
 overflow-x:hidden;
 background:#12040f;
 isolation:isolate;
}
.game-backdrop{
 position:fixed;
 inset:-7%;
 z-index:-3;
 width:114%;
 height:114%;
 object-fit:cover;
 object-position:center;
 filter:blur(34px) brightness(.34) saturate(1.28);
 transform:scale(1.06);
 opacity:.96;
 pointer-events:none;
}
.game-shade{
 position:fixed;
 inset:0;
 z-index:-2;
 pointer-events:none;
 background:
   radial-gradient(ellipse at 50% 42%,rgba(0,0,0,.02) 0 30%,rgba(5,1,5,.28) 68%,rgba(4,1,4,.52) 100%),
   linear-gradient(180deg,rgba(7,2,8,.06),rgba(7,2,8,.16));
}
.machine-stage{
 width:min(760px,100%);
 min-height:calc(100dvh - 8px);
 margin:0 auto;
 padding:calc(max(62px, env(safe-area-inset-top) + 54px)) 6px 12px;
 display:flex;
 flex-direction:column;
 justify-content:flex-start;
}
.artbox{
 flex:0 0 auto;
}
.message{
 width:min(720px,calc(100% - 16px));
 margin:-4px auto 16px;
 padding:8px 12px;
 text-align:center;
 color:#d4c5d4;
 font-weight:900;
 min-height:24px;
 text-shadow:0 2px 7px rgba(0,0,0,.9);
 background:transparent!important;
}
@media(max-width:720px){
 .game{min-height:100dvh}
 .machine-stage{
   width:100%;
   min-height:100dvh;
   padding:calc(max(54px, env(safe-area-inset-top) + 46px)) 0 6px;
 }
 .artbox{border-radius:0}
 .message{
   margin:-2px auto 10px;
   font-size:14px;
 }
}

.big{position:fixed;inset:0;z-index:120;display:none;place-items:center;background:radial-gradient(circle,rgba(255,194,54,.16),rgba(3,1,4,.8));pointer-events:none}
.big.show{display:grid}.bigcard{text-align:center;padding:30px 40px;border-radius:24px;background:#210a16;border:1px solid #d7ad52;box-shadow:0 0 80px rgba(255,191,50,.3)}
.bigcard strong{display:block;font-size:clamp(48px,11vw,95px);line-height:.85;background:linear-gradient(#fff8d4,#ffd05a,#92590d);-webkit-background-clip:text;color:transparent}
.bigcard span{display:block;margin-top:12px;color:#69f1a3;font-size:20px;font-weight:1000}
@media(max-width:720px){.showroom{min-width:1180px;width:1180px;border-radius:0}.machine-stage{padding:0}.artbox{border-radius:0}.livebar{margin-top:6px}}

/* One cabinet and one coordinate system, including the working console. */
.game{height:100svh;min-height:0;overflow:hidden;background:#231009}
.machine-stage{width:100%;max-width:850px;height:100%;min-height:0;padding:0;margin:auto;display:block}
.artbox{height:100%;width:100%;aspect-ratio:auto;border-radius:0;box-shadow:none;container-type:inline-size}
.art{object-fit:fill}
.game-backdrop,.game-shade{display:none}
.cabinet-console{position:absolute;left:2%;width:96%;z-index:24;padding:1% 2%;display:flex;flex-direction:column;justify-content:center;gap:5%;background:linear-gradient(100deg,#472811,#100b09 20%,#332113 65%,#130c08);border:2px solid #c49649;border-radius:6px;box-shadow:inset 0 2px 2px #ffdf8a,inset 0 -3px 3px #86551d,0 2px 3px #160a02}
.meter-row{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:3%;height:44%}
.meter-row>div{display:flex;flex-direction:column;justify-content:center;text-align:center;background:#100d09;border:1px solid #7d572c;border-radius:3px;overflow:hidden}
.meter-row span{font-size:clamp(8px,2.2cqw,13px);color:#e1c688;line-height:1.2}
.meter-row b{font-size:clamp(13px,3.6cqw,25px);color:#fff0c5;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1.2}
.button-row{height:43%;display:grid;grid-template-columns:.65fr .65fr 1fr 1fr 1.6fr;gap:3%}
.button-row button{padding:0;position:static;width:auto;height:100%;color:#fff4d5;font-size:clamp(11px,3cqw,20px);font-weight:800;border:1px solid #ceab67;border-radius:5px;background:linear-gradient(#68533b,#21170e 50%,#4c3118);box-shadow:inset 0 1px 1px #fff6c2,0 2px 2px #080503;touch-action:manipulation}
.button-row #spinHot{background:linear-gradient(#86d66a,#206c27 50%,#134119);border:2px solid #eac969;border-radius:30px}
.button-row #autoHot.on{background:#8b351c}
.button-row button:active{filter:brightness(1.5)}
button:disabled{opacity:.65}
.message{position:absolute;bottom:1%;left:10%;width:80%;margin:0;padding:4px;font-size:12px;min-height:0;color:#fff1cd}
.fab{width:36px;height:36px;border-radius:50%;font-size:18px}
@media(min-aspect-ratio:1/1){.machine-stage{width:min(80vh,100%)}.game{background:radial-gradient(ellipse,#5b321a,#170b07)}}
.progression{position:absolute;bottom:5%;left:24%;width:52%;text-align:center;color:#fff0c5;text-shadow:0 1px 3px #000;font-size:12px;pointer-events:none}.progression progress{display:block;width:100%;height:7px;margin:5px 0;accent-color:#e5b755}.progression small{font-size:10px}.progression span{font-weight:800}
.rescue{margin:10px 14px;color:#ddc38e;font-size:14px;max-width:520px}.rescue summary{cursor:pointer;width:fit-content}.rescue p{margin:10px 0;line-height:1.5;color:#d9ced3}.rescue button{padding:12px 16px;border:1px solid #cfa854;border-radius:9px;color:#fff3ca;background:linear-gradient(#63461f,#2d1b0c);font-weight:700;cursor:pointer}.rescue #rescueStatus{margin-top:8px;color:#8be5af}
.bonus-list{padding-left:20px;line-height:1.7;color:#eee0c6}

.free-tile{background:radial-gradient(ellipse,#242462,#070812)}.free-tile img{object-fit:contain}
.progression{bottom:6.7%;left:25%;width:50%;font-size:12px;line-height:1.2}.progression progress{height:5px;margin:4px 0 0}
.message{bottom:1%;left:3%;width:94%;max-height:4.8%;overflow:hidden;font-size:12px;line-height:1.2;padding:3px 7px;border-radius:6px;text-shadow:0 1px 3px #000;background:rgba(15,8,4,.75)!important}
.free-bonus{position:fixed;inset:0;z-index:170;display:grid;place-items:center;background:rgba(4,3,12,.88);padding:20px;backdrop-filter:blur(5px)}
.free-bonus-card{width:min(410px,100%);text-align:center;padding:22px 18px;border:2px solid #d7ab52;border-radius:22px;background:radial-gradient(ellipse at 50% 10%,#18368a,#090b20 70%);box-shadow:0 0 45px #3358d555,inset 0 0 25px #e3b76522;color:#fff1c5}
.free-bonus-card img{width:min(45vw,180px);height:min(45vw,180px);object-fit:contain;filter:drop-shadow(0 0 16px #406fff)}
.free-bonus-card h2{font-size:16px;letter-spacing:.08em;margin:10px 0}.free-bonus-card strong{display:block;font-size:clamp(24px,7vw,34px);color:#ffe093}.free-bonus-card p{font-size:14px;line-height:1.5;margin:14px 0;color:#dbe5ff}.free-bonus-card button{width:100%;min-height:48px;font-size:17px;font-weight:800;color:#2d1d06;background:linear-gradient(#fff0ac,#cf9b36);border:1px solid #ffda7c;border-radius:12px;cursor:pointer}