:root{--slot-safe-top:env(safe-area-inset-top,0px);--slot-safe-right:env(safe-area-inset-right,0px);--slot-safe-bottom:env(safe-area-inset-bottom,0px);--slot-safe-left:env(safe-area-inset-left,0px)}
html[data-slot-orientation] body{background:#031722}
html[data-slot-orientation] body::before{display:none}
html[data-slot-orientation] #gameShell{position:fixed;left:var(--slot-cabinet-center-x,50%);top:var(--slot-cabinet-center-y,50%);width:var(--slot-cabinet-width);height:var(--slot-cabinet-height);max-width:none;max-height:none;transform:translate(-50%,-50%);overflow:clip}
#portraitNativeScene,#portraitGameViewport{display:contents}
#portraitSky,#portraitReelJoin,.portraitLowerCabinet,.portraitControlIcon,.portraitControlWords,.portraitSpinFace,#portraitTurboButton{display:none}
html[data-slot-orientation="portrait"] #gameShell{aspect-ratio:1000/1806;background:#0f8bbb;box-shadow:none}
html[data-slot-orientation="portrait"] #portraitSky{display:block;position:absolute;inset:0 0 auto;height:12.735327%;z-index:0;background:url('../assets/art/mobile/portrait-header-base-v4.webp') center/cover no-repeat,#0d82b0}
html[data-slot-orientation="portrait"] #portraitSky::after{content:'';position:absolute;inset:0;background:url('../assets/art/mobile/portrait-header-bonus-v4.webp') center/cover no-repeat,#091d4f;opacity:0;transition:opacity 1s}
html[data-slot-orientation="portrait"] .is-bonus #portraitSky::after{opacity:1}
html[data-slot-orientation="portrait"] :is(#portraitNativeScene,#portraitGameViewport){display:block;position:absolute;left:0;top:8.305648%;width:100%;height:44.190304%;overflow:hidden}
html[data-slot-orientation="portrait"] #portraitNativeScene{z-index:1}
/* Extend only the animation surface upward; its native y0 and bottom stay fixed. */
html[data-slot-orientation="portrait"] #portraitGameViewport{top:1.064827%;height:51.431127%;z-index:3}
html[data-slot-orientation="portrait"] #portraitNativeScene :is(.cabinetScene,.balconyArchitecture){position:absolute;inset:auto;left:-42.307692%;top:4.819277%;width:160.769231%;height:113.373494%;object-fit:fill}
html[data-slot-orientation="portrait"] .titleSignRepair{display:none!important}
html[data-slot-orientation="portrait"] #gameCanvas{position:absolute;inset:0;width:100%;height:100%}
html[data-slot-orientation="portrait"] .titleSignRig{left:38.5%;top:-.75%;width:23%;height:auto;aspect-ratio:512/448;clip-path:none;z-index:4;filter:drop-shadow(0 2px 3px #123b4790)}
html[data-slot-orientation="portrait"] .portraitLowerCabinet{display:block;position:absolute;left:0;top:50.153333%;width:100%;height:49.841168%;pointer-events:none;z-index:4}
html[data-slot-orientation="portrait"] .portraitLowerArt{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:fill;transition:opacity .8s ease}
html[data-slot-orientation="portrait"] .portraitLowerArt--bonus{opacity:0}
html[data-slot-orientation="portrait"] .is-bonus .portraitLowerArt--bonus{opacity:1}
html[data-slot-orientation="portrait"] .portraitLowerCabinet--front{z-index:6;clip-path:inset(59.5% 0 0)}
html[data-slot-orientation="portrait"] .is-scene-covered .portraitLowerArt,html[data-slot-orientation="portrait"] .is-scene-covered #portraitSky::after{transition:none!important}
html[data-slot-orientation="portrait"] .babeHotspot{top:var(--portrait-babe-y,12.181%);width:19.615385%;height:10.861436%}
html[data-slot-orientation="portrait"] .babeHotspot--green{left:12.211538%}
html[data-slot-orientation="portrait"] .babeHotspot--blue{left:40.192308%}
html[data-slot-orientation="portrait"] .babeHotspot--red{left:68.173077%}
html[data-slot-orientation="portrait"] .nightclubLights{z-index:2;top:8%;height:43%;overflow:hidden}
html[data-slot-orientation="portrait"] #gameShell .cabinetMeter{z-index:9;top:52.20%;height:3.66%;display:flex;align-items:center;justify-content:space-between;gap:1cqw;padding:0 1.5cqw;font-size:4.4cqw;line-height:1;letter-spacing:0;white-space:nowrap;transition:none;text-shadow:0 1px 2px #001b2e;color:#fff7d4}
html[data-slot-orientation="portrait"] #gameShell .cabinetMeter::before{content:attr(data-portrait-label);flex:0 0 auto;font-size:max(7px,2.05cqw);color:#b8f5f9;letter-spacing:.04em;font-weight:900}
html[data-slot-orientation="portrait"] #gameShell .balanceMeter{left:13.90%;width:32.5%}
html[data-slot-orientation="portrait"] #gameShell .winMeter{left:53.65%;width:32.5%}
html[data-slot-orientation="portrait"] #gameShell .betMeter{left:36.5%;width:26.8%;top:81.00%;height:4.1%;font-size:4.25cqw;padding-inline:1cqw}
html[data-slot-orientation="portrait"] #gameShell .betMeter::before{white-space:normal;max-width:8cqw;line-height:1.12;font-size:1.95cqw}
html[data-slot-orientation="portrait"] .controls{z-index:10}
html[data-slot-orientation="portrait"] .hotspot{display:grid;place-items:center;min-width:0;min-height:0;height:auto;aspect-ratio:1;color:#fffbe2;filter:none!important;transition:none;transform:translate(-50%,-50%)}
html[data-slot-orientation="portrait"] #gameShell .hotspot{--control-art-offset-x:0%;--stop-normal-offset-x:0%;--stop-normal-offset-y:0%}
html[data-slot-orientation="portrait"] .hotspot :is(.controlStateArt,.stopControlArt,.autospinIcon){display:none!important}
html[data-slot-orientation="portrait"] .hotspot:disabled{opacity:.65}
html[data-slot-orientation="portrait"] .portraitControlIcon{display:block;position:relative;width:63%;height:63%;fill:none;stroke:currentColor;stroke-width:8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 1px #00334088);pointer-events:none}
html[data-slot-orientation="portrait"] .hotspot:not(:disabled):hover .portraitControlIcon{filter:drop-shadow(0 0 3px #fffac4);color:white}
html[data-slot-orientation="portrait"] .hotspot:not(:disabled):active .portraitControlIcon{opacity:.8}
html[data-slot-orientation="portrait"] .menuButton{left:24.88%;top:90.337%;width:14.3%}
html[data-slot-orientation="portrait"] .spinButton{left:50.0%;top:90.25%;width:20.4%}
html[data-slot-orientation="portrait"] .autoplayButton{left:75.05%;top:90.337%;width:14.3%}
html[data-slot-orientation="portrait"] .spinAutoplayCount{left:49.8046875%;top:50.58634375%;width:26.7578125%;height:25.390625%;z-index:4;font-size:3cqw;line-height:1}
html[data-slot-orientation="portrait"] .spinAutoplayCount.is-large{font-size:2.55cqw}
html[data-slot-orientation="portrait"] .betDownButton{left:29.074%;top:83.13%;width:10.2%;min-width:44px;min-height:44px}
html[data-slot-orientation="portrait"] .betUpButton{left:70.85%;top:83.15%;width:10.2%;min-width:40px;min-height:40px}
html[data-slot-orientation="portrait"] :is(.betDownButton,.betUpButton) .portraitControlIcon{width:55%;height:55%}
html[data-slot-orientation="portrait"] .maxBetButton{left:84.7%;top:83.15%;width:15.1%;height:5.25%;min-height:44px;aspect-ratio:auto;border-radius:16%}
html[data-slot-orientation="portrait"] .portraitControlWords{display:block;font-size:2.8cqw;line-height:1;white-space:nowrap;font-weight:1000;text-shadow:0 2px 2px #004c72;pointer-events:none}
html[data-slot-orientation="portrait"] #portraitTurboButton{display:flex;align-items:center;justify-content:center;gap:0;left:15.2%;top:83.15%;width:15.1%;height:5.25%;min-height:44px;aspect-ratio:auto;border-radius:16%;color:#65430b}
html[data-slot-orientation="portrait"] .portraitTurboButton .portraitControlIcon{width:33%;height:67%;stroke:none;filter:drop-shadow(0 1px 0 #ffffb0)}
html[data-slot-orientation="portrait"] .portraitBoltFill{fill:currentColor;stroke:none}
html[data-slot-orientation="portrait"] .portraitTurboCaption{font-size:2.9cqw;font-weight:1000;line-height:1}
html[data-slot-orientation="portrait"] #portraitTurboButton[aria-pressed="true"]{color:#492000}
html[data-slot-orientation="portrait"] :is(.wheelFeature[data-state="idle"],.wheelFeature[data-state="wheel-entry-arming"],.wheelFeature[data-state="wheel-entry-closing"],.wheelFeature.is-returning){z-index:5;pointer-events:none}
html[data-slot-orientation="portrait"] :is(.wheelFeature[data-state="idle"],.wheelFeature[data-state="wheel-entry-arming"],.wheelFeature[data-state="wheel-entry-closing"],.wheelFeature.is-returning) .wheelStage{left:12%;top:58.6%;width:76%;clip-path:inset(0 0 44% 0);transform:none;filter:drop-shadow(0 2px 4px #123a3a66);transition:none}
html[data-slot-orientation="portrait"] #bonusHud{left:8%;top:61%;width:84%;height:13%;aspect-ratio:auto;filter:none}
html[data-slot-orientation="portrait"] .loadingScreen{background:linear-gradient(#022a45bb,#001a32ee),url('../assets/art/mobile/portrait-lagoon-base-v1.webp') center/cover}
html[data-slot-orientation="portrait"] .loadingCard{width:84%;max-width:none;padding:8cqw 5cqw;gap:3cqw}
html[data-slot-orientation="portrait"] .loadingLogo{font-size:9cqw}
html[data-slot-orientation="portrait"] .loadingCard p{font-size:3.1cqw;letter-spacing:.09em}
html[data-slot-orientation="portrait"] .loadingPercent{font-size:5cqw}
html[data-slot-orientation="portrait"] .loadingSun{width:50cqw;height:50cqw;max-width:none;max-height:none}
html[data-slot-orientation="portrait"] .toast{font-size:3.2cqw;max-width:90%;bottom:22%;padding:.7em 1em}
@media(prefers-reduced-motion:reduce){.portraitLowerArt,#portraitSky::after{transition:none!important}}

/* Original landscape artwork, fitted inside the portrait's painted bezels.
   The Spin crop is a CSS window into cabana-base, with its original lettering. */
html[data-slot-orientation="portrait"] .portraitSpinFace{display:block;position:absolute;left:50%;top:50.24%;transform:translate(-50%,-50%);width:72.3%;height:72.3%;border-radius:50%;background-image:url('../assets/art/cabana-base.png');background-size:1078.7096774193549% 607.0967741935484%;background-position:49.76928147659855% 95.67430025445293%;pointer-events:none}
html[data-slot-orientation="portrait"] .spinButton.is-stop .portraitSpinFace{visibility:hidden}
html[data-slot-orientation="portrait"] .spinButton .stopControlArt--normal{display:block!important;width:100%;height:100%;top:50.684%;transition:none}
html[data-slot-orientation="portrait"] .autoplayButton .autospinIcon{display:block!important;width:100%;height:100%;object-fit:contain}
html[data-slot-orientation="portrait"] :is(.spinButton,.autoplayButton):not(:disabled):hover :is(.portraitSpinFace,.autospinIcon,.stopControlArt--normal){filter:brightness(1.08)}
html[data-slot-orientation="portrait"] :is(.spinButton,.autoplayButton):not(:disabled):active :is(.portraitSpinFace,.autospinIcon,.stopControlArt--normal){filter:brightness(.92)}

/* Blend the source sky above its untouched thatched roof into the portrait canopy. */
html[data-slot-orientation="portrait"] #portraitNativeScene :is(.cabinetScene,.balconyArchitecture){mask-image:linear-gradient(to bottom,transparent 4.144527%,#000 4.357067%,#000);-webkit-mask-image:linear-gradient(to bottom,transparent 4.144527%,#000 4.357067%,#000)}

/* One illustrated lintel joins the native reel aperture to the meter fascia. */
html[data-slot-orientation="portrait"] #portraitReelJoin{display:block;position:absolute;left:0;top:50.153333%;width:100%;height:2.05%;object-fit:fill;z-index:7;pointer-events:none}
html[data-slot-orientation="portrait"] .is-bonus #portraitReelJoin{filter:brightness(.87) saturate(.92)}

/* The transient electrical layer follows the painted face, not the larger
   touch target. No transforms or opacity changes touch the actual button. */
#turboToggle{position:relative}
.turboElectricFx{position:absolute;left:50%;top:50%;width:calc(100% - 8px);height:calc(100% - 8px);transform:translate(-50%,-50%);z-index:0;pointer-events:none;overflow:visible;border-radius:inherit;color:#fff7cc}
.turboElectricFx svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.turboElectricFx[data-motion="electric"]{filter:drop-shadow(0 0 2px #ffcc4599)}
.turboFxBloom{filter:blur(5px)}
.turboElectricFx[data-motion="reduced"] .turboFxBloom{filter:none}
html[data-slot-orientation="portrait"] #portraitTurboButton .turboElectricFx{width:96%;height:auto;aspect-ratio:8/3;border-radius:8px}

#turboToggle > i,#turboToggle > span,html[data-slot-orientation="portrait"] #portraitTurboButton > .portraitControlIcon,html[data-slot-orientation="portrait"] #portraitTurboButton > .portraitTurboCaption{position:relative;z-index:1}
