:root{--cream:#fff3d4;--cyan:#6dfff0;--coral:#ff7168;--pink:#ff59a6;--ink:#122e36;--gold:#ffe49b;font-family:'Avenir Next','Trebuchet MS',sans-serif;color:var(--cream);font-weight:650;color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-width:320px;background:#163843}button,select,input{font:inherit}button,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.46}button:focus-visible,select:focus-visible,input:focus-visible,input:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}button:active:not(:disabled){transform:translateY(2px)}svg{display:block}button,select{-webkit-tap-highlight-color:transparent}#svg-assets{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}.sr{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
.backdrop{position:fixed;inset:0;z-index:-2;overflow:hidden;background:#ea9b83}.backdrop:before,.backdrop:after{content:'';position:absolute;inset:-2%;background:center/cover no-repeat;transition:opacity 1.2s,transform 1.5s}.backdrop:before{background-image:url('assets/neon-boulevard-v9.webp');animation:city-breathe 28s ease-in-out infinite alternate}.backdrop:after{background-image:url('assets/neon-boulevard-v9.webp');opacity:0;transform:scale(1.1)}.bonus-active .backdrop:after{opacity:1;transform:scale(1)}.stage-glow{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#0c272bca,transparent 40%),linear-gradient(90deg,#17273333,transparent 35%,#1e263033)}.ocean-shimmer{position:absolute;inset:58% 0 0;z-index:2;background:linear-gradient(115deg,transparent 35%,#f4de9e17 45%,transparent 55%);animation:reflection 12s ease-in-out infinite;pointer-events:none}.floating-dust{position:absolute;inset:0;z-index:2;background-image:radial-gradient(circle,#ffe6bdcc 1px,transparent 2px),radial-gradient(circle,#affffd99 1px,transparent 2px);background-size:233px 181px,347px 279px;opacity:.35;animation:drift 22s linear infinite;pointer-events:none}
.game{height:100svh;min-height:720px;max-width:1440px;margin:auto;padding:25px 48px 15px;display:flex;flex-direction:column;gap:13px;position:relative}.topbar{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-shrink:0;min-height:95px}.brand{line-height:.8;transform:skew(-7deg);position:relative;filter:drop-shadow(0 5px 5px #14303940)}.brand span{display:block;font-family:Impact,'Arial Narrow',sans-serif;font-size:23px;letter-spacing:5.5px;color:#fff9df;text-shadow:0 2px #28575e}.brand strong{display:block;font-family:Impact,'Arial Narrow',sans-serif;font-size:69px;letter-spacing:5px;color:#ff786e;-webkit-text-stroke:1px #ffecbb;text-shadow:0 4px #c23756,0 7px #583348}.brand small{display:block;transform:skew(7deg);font-size:7px;letter-spacing:2px;margin-top:12px;color:#fff5d7}.episode{margin-right:auto;align-self:center;padding-left:24px;border-left:1px solid #fff2cb70;text-shadow:0 1px 8px #163533}.episode span{display:block;font-size:9px;letter-spacing:2px;margin-bottom:8px}.episode b{font-size:15px;letter-spacing:3px}.top-actions{display:flex;gap:9px;align-items:center}.icon-button{display:grid;place-items:center;width:42px;height:42px;border:1px solid #f7e2b477;border-radius:12px;background:#153c41c9;color:var(--cream);box-shadow:0 3px 0 #0d303844;font-size:26px}.icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-button:hover{background:#266369}.balance{display:flex;align-items:center;gap:18px;border:1px solid #f6e4b4;background:linear-gradient(120deg,#ffefd0,#ffdbb1);padding:10px 13px 10px 20px;border-radius:13px;color:#29404a;box-shadow:0 4px 0 #85545333}.balance small{font-size:8px;letter-spacing:1.6px;display:block;margin-bottom:3px}.balance strong{font-size:25px;line-height:1.1;font-variant-numeric:tabular-nums}.wallet-add{width:32px;height:32px;background:#20484c;color:#fff0d5;border:0;border-radius:9px;font-size:23px}.arena{display:grid;grid-template-columns:minmax(0,1fr)220px;gap:26px;flex:1;min-height:0;align-items:stretch}.cabinet{display:flex;flex-direction:column;min-height:0;position:relative;animation:arrival .65s ease-out both}.marquee{height:29px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;color:#fff8e9;flex-shrink:0;text-shadow:0 2px 3px #1c3739;font-size:9px;letter-spacing:1.2px}.marquee:before{content:'COASTLINE CASCADES';font-size:8px;letter-spacing:2px;color:#ffedca}.reel-lamps{display:flex;gap:5px}.reel-lamps i{width:5px;height:5px;border-radius:50%;background:#13464c;box-shadow:0 0 0 1px #81c5b77a}.reel-lamps i.landed{background:var(--cyan);box-shadow:0 0 7px #aaffdf}.board-shell{position:relative;flex:1;min-height:0;border:6px solid #e5bd87;border-radius:18px;background:#183e47;box-shadow:0 0 0 1px #ffe7b3,0 0 0 4px #6b444777,inset 0 0 0 2px #61dbc8,0 15px 32px #07242c66;overflow:hidden}.board-shell:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:9;border-radius:11px;border:1px solid #bfffed99;box-shadow:inset 0 0 25px #12363b45}.board{position:absolute;inset:5px;border-radius:9px;overflow:hidden;background:linear-gradient(90deg,#bafdf60c 1px,transparent 1px),linear-gradient(#a6fff010 1px,transparent 1px),radial-gradient(ellipse at 50% 0,#1b737a,#103845 80%);background-size:calc(100% / 6) 20%,calc(100% / 6) 20%,100% 100%;box-shadow:inset 0 4px 16px #061d34aa;isolation:isolate}.tile{position:absolute;width:calc(100% / 6);height:20%;display:grid;place-items:center;transition:top .3s cubic-bezier(.2,.8,.25,1),opacity .15s}.tile svg{position:absolute;left:6%;top:6%;width:88%;height:88%;overflow:visible;filter:drop-shadow(0 5px 3px #051b2840)}.tile .sun-number{position:absolute;font-size:clamp(15px,2vw,26px);font-weight:950;text-shadow:0 2px 4px #001e2c;color:#e9fff9}.tile .bonus-label{position:absolute;bottom:6%;font-size:9px;font-weight:950;letter-spacing:1px;background:#fff1ac;color:#254547;padding:1px 5px;border-radius:3px;box-shadow:0 2px 5px #061c3366}.tile.winning{z-index:3;background:radial-gradient(ellipse,#ffeca74d,transparent 75%)}.tile.winning:after{content:'';position:absolute;inset:3%;border:2px solid var(--group-color,var(--gold));border-radius:10px;box-shadow:0 0 18px var(--group-color,var(--gold)),inset 0 0 20px #ffffff20;animation:prize-outline .6s ease-out}.board.evaluating .tile:not(.winning){opacity:.28}.tile.winning svg{animation:symbol-hop .5s ease-out both}.tile[data-symbol='6'].winning svg{animation:car-rev .48s ease-out both}.tile[data-symbol='5'].winning svg{animation:boat-rock .5s ease-in-out both}.tile[data-symbol='3'].winning svg{animation:flamingo-nod .5s ease-out both}.tile[data-symbol='1'].winning svg{animation:tape-bop .5s ease-out both}.tile[data-symbol='4'].winning svg{animation:pendant-swing .5s ease-out both}.tile[data-symbol='2'].winning svg{animation:watch-glint .5s ease-out both}.tile[data-symbol='0'].winning svg{animation:glasses-tilt .5s ease-out both}.tile.removing{animation:match-break .17s ease-in forwards}.tile.added{animation:new-symbol .27s cubic-bezier(.15,.8,.2,1) both}.position-mark{position:absolute;right:4%;top:4%;font-size:10px;min-width:17px;height:17px;display:grid;place-items:center;background:var(--group-color);color:#1a3640;border-radius:4px;z-index:5}.tile.scatter-glow svg{filter:drop-shadow(0 0 14px #ffdb82);animation:key-turn .8s ease-in-out infinite alternate}.tile.multiplier-hit svg{animation:turbo-hit .5s ease-out}
.rolling-reel{position:absolute;top:0;bottom:0;width:calc(100% / 6);overflow:hidden;contain:layout paint;box-shadow:inset -1px 0 #a3f9ff16}.reel-strip{position:absolute;top:0;left:0;width:100%;will-change:transform,filter}.reel-strip .reel-symbol{left:0!important;width:100%;transition:none}.rolling-reel:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(#052d46a3,transparent 22%,transparent 78%,#052d4699);opacity:1;transition:opacity .15s}.rolling-reel:before{content:'';position:absolute;z-index:2;inset:-45% 35%;pointer-events:none;border-radius:50%;background:repeating-linear-gradient(transparent 0 13%,#d9ffdf33 14%,transparent 19%);filter:blur(6px);animation:reel-speed-lines .24s linear infinite}.rolling-reel.reel-stopped:after{opacity:0}.rolling-reel.reel-stopped:before{display:none}.board-shell:has(.reel-running){box-shadow:0 0 0 1px #ffe7b3,0 0 0 4px #6b444777,inset 0 0 0 2px #61dbc8,0 0 34px #85fbd94d}.fx-layer{position:absolute;inset:5px;z-index:8;overflow:hidden;pointer-events:none;border-radius:9px}.column-stop{position:absolute;top:0;width:calc(100% / 6);height:100%;background:linear-gradient(90deg,transparent,#d4ffe54d,transparent);border-inline:1px solid #baffef55;animation:column-land .3s ease-out both}.cell-spark{position:absolute;width:5px;height:5px;border-radius:2px;background:var(--spark-color);box-shadow:0 0 6px var(--spark-color);animation:cell-burst .43s ease-out forwards}.multiplier-flight{position:absolute;z-index:30;padding:5px 10px;border:1px solid #deffe8;background:#096c75;border-radius:20px;color:#c5ffee;font-weight:950;box-shadow:0 0 17px #42f5e8;animation:collect-flight .48s cubic-bezier(.3,.05,.5,1) forwards;pointer-events:none}.combo-panel{display:flex;gap:7px;align-items:center;min-height:43px;margin-top:8px;padding:5px 8px 5px 12px;border:1px solid #c3e8d442;border-radius:9px;background:#153c42eb;color:#e3f8e9}.combo-panel #combo-content{display:flex;gap:8px;align-items:center;flex:1;min-width:0;font-size:10px}.combo-panel #combo-content>b{font-size:22px;font-family:Impact,sans-serif;color:#ffe3a5}.combo-panel button{min-height:30px;background:#f2e3bd;color:#2d464a;border:0;border-radius:5px;font-size:8px;font-weight:950;letter-spacing:.7px;padding:6px 10px}.combo-panel #combo-next{background:#8cf5d9}.match-chip{display:flex;align-items:center;gap:4px;padding:2px 6px;border:1px solid var(--group-color);border-radius:5px;white-space:nowrap;color:var(--group-color);animation:arrival .18s ease-out}.match-chip svg{width:26px;height:26px}.match-chip strong{font-size:10px}.match-chip>span{font-size:10px;color:var(--cream)}.cabinet-foot{display:flex;justify-content:space-between;gap:8px;padding:8px 10px 0;min-height:27px;color:#fff5d5;text-shadow:0 1px 4px #062f30;font-size:9px}.round-counter{white-space:nowrap;color:#c2e5d8;font-size:8px;letter-spacing:1px}
.feature-rail{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;min-height:0;gap:10px;padding:22px 0 27px}.rail-heading{font:27px/1 Impact,'Arial Narrow',sans-serif;letter-spacing:2px;color:#fff4da;text-shadow:0 3px #8e4156,0 5px 20px #18323888}.rail-heading span{display:block;font:7px 'Avenir Next',sans-serif;letter-spacing:1.4px;margin-top:8px;color:#fff1d7}.hero-car{height:99px;position:relative;isolation:isolate}.hero-car>span{position:absolute;top:0;left:0;font-size:7px;letter-spacing:2px;color:#fff2dd}.hero-car svg{width:100%;height:120px;position:absolute;top:-1px;filter:drop-shadow(0 10px 10px #1d233d70);animation:car-idle 5s ease-in-out infinite}.hero-car i{position:absolute;bottom:0;left:5%;right:5%;height:12px;background:#48f8d970;filter:blur(12px);z-index:-1}.bonus-sign{display:grid;grid-template-columns:72px 1fr;grid-template-rows:18px 37px 25px;align-items:center;column-gap:9px;padding:12px 14px;border:1px solid #ffdfb0;border-radius:13px;background:linear-gradient(120deg,#fbc99c,#ef916f);color:#582f3d;box-shadow:0 5px 0 #663d4233;position:relative;overflow:hidden}.bonus-medal{grid-column:1;grid-row:1/4;width:72px;height:72px}.bonus-medal svg{width:100%;height:100%}.bonus-sign small{font-size:7px;letter-spacing:1px;grid-column:2}.bonus-sign>strong{font:40px/.9 Impact,sans-serif;grid-column:2}.bonus-sign>b{font-size:8px;letter-spacing:.7px;line-height:1.25;grid-column:2}.bonus-sign:after{content:'';position:absolute;inset:0;pointer-events:none;transform:translateX(-130%) skew(-15deg);background:linear-gradient(90deg,transparent,#fff7d95c,transparent);animation:chrome-sweep 8s ease-in-out infinite}.sun-meter{position:relative;height:99px;flex-shrink:0;text-align:center}.sun-meter>svg{width:93px;height:93px;margin:auto}.sun-meter>strong{position:absolute;left:0;right:0;top:27px;font-size:25px;font-weight:950;color:#eaffed;text-shadow:0 2px 3px #093f50}.sun-meter small{position:absolute;left:0;right:0;bottom:0;font-size:7px;letter-spacing:1.1px;text-shadow:0 1px 4px #0e313e}.turbo-ring{position:absolute;width:77px;height:77px;top:8px;left:calc(50% - 38.5px);border:1px dashed #91ffde66;border-radius:50%;animation:turn 20s linear infinite;pointer-events:none}.sun-meter.pop .turbo-ring{animation:turn .5s ease-out}.sun-meter.pop{animation:meter-pop .4s ease-out}.round-total{display:flex;flex-direction:column;gap:5px;border-top:1px solid #ffefbe99;padding:13px 0 0;color:#fff1d7;text-shadow:0 2px 6px #163e48}.round-total small{font-size:8px;letter-spacing:1.3px}.round-total strong{font-size:34px;line-height:1.1;font-variant-numeric:tabular-nums}.round-total>span{font-size:11px;color:#e7ded2}.round-total.gain strong{color:#aaffdf}.round-total.win-pulse{animation:meter-pop .55s ease-out}
.controls{display:grid;grid-template-columns:210px minmax(150px,280px)230px;align-items:center;justify-content:center;gap:30px;padding:15px 25px;border:1px solid #e7d4ad77;border-radius:14px;background:linear-gradient(120deg,#183e41f5,#183e49f5);box-shadow:0 9px 30px #142e3955;flex-shrink:0}.stake label{font-size:8px;letter-spacing:1.5px;display:block;margin-bottom:7px;color:#b8d7cd}.stake-input{display:grid;grid-template-columns:36px 1fr 36px;gap:6px}.stake-input button,.stake-input input{height:39px;border:1px solid #b9d7be55;border-radius:7px;background:#254c50;color:#fff0cf;text-align:center}.stake-input button{font-size:22px}.stake-input input{min-width:0;width:100%;font-size:19px;font-weight:850;background:#132f39}.spin{position:relative;isolation:isolate;overflow:hidden;min-height:68px;border:2px solid #ffe3b4;border-radius:12px;background:linear-gradient(#ffb591,#ff7f78 45%,#ed586a);box-shadow:inset 0 2px #fff1cd80,0 5px 0 #873d4b,0 0 25px #ed8e7040;color:#432c3a;display:flex;align-items:center;justify-content:center;gap:12px;font-size:22px;letter-spacing:1px;font-weight:950}.spin:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 10%,#fff8dd77 50%,transparent 80%);transform:translateX(-150%);transition:transform .65s}.spin:hover:not(:disabled):after{transform:translateX(150%)}.spin svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.spin.busy{opacity:1;color:#71414b;background:linear-gradient(#ffbb97,#ef8a83)}.spin.busy svg{animation:turn .75s linear infinite}.tap-burst{animation:tap-response .16s ease-out}.secondary{display:flex;flex-direction:column;gap:6px}.buy-ticket{display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #e4dfb3;border-radius:9px;min-height:48px;background:linear-gradient(#efe3b8,#d8c38d);color:#30454b;font-size:11px;font-weight:950;letter-spacing:.5px}.buy-ticket svg{height:38px;width:38px}.buy-ticket small{font-size:8px;display:block;margin-top:3px;letter-spacing:1px;color:#4d665d}.secondary-button:not(.buy-ticket){border:0;color:#bad6cd;background:none;font-size:8px;letter-spacing:1px;padding:5px}.feature-strip{display:flex;gap:20px;justify-content:center;align-items:center;font-size:8px;letter-spacing:1.4px;color:#e9dec8;height:22px;flex-shrink:0}.feature-strip i{width:3px;height:3px;border-radius:50%;background:#b9ead5}.feature-strip button{font:inherit;color:#a7f7de;background:none;border:0;padding:3px}.feature-strip b{font-size:15px;margin-left:7px}.fineprint{display:flex;align-items:center;justify-content:center;gap:15px;font-size:8px;letter-spacing:.3px;color:#abc7be;flex-shrink:0}.mode-banner{position:absolute;top:117px;left:50%;transform:translateX(-50%);background:#fff0ce;color:#4f4b3e;border-radius:5px;padding:5px 10px;z-index:12;font-size:8px;letter-spacing:.3px;white-space:nowrap;box-shadow:0 3px 15px #10312f40}
.board-message{position:absolute;inset:0;z-index:15;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse,#15585bef,#183245ed);backdrop-filter:blur(6px);padding:15px;animation:overlay-in .28s ease-out}.board-message>*{position:relative;z-index:2}.board-message:before{content:'';position:absolute;inset:-90%;background:repeating-conic-gradient(#ffdeb720 0deg 7deg,transparent 7deg 25deg);animation:turn 28s linear infinite;mask-image:radial-gradient(circle,transparent 0%,black 17%,transparent 50%)}.board-message small{font-size:16px;letter-spacing:4px;color:#f7d4a5}.board-message strong{font:clamp(45px,8vw,105px)/1.2 Impact,sans-serif;color:#fff0c6;text-shadow:0 3px #ea8b6e,0 7px #6c4044;letter-spacing:1px}.board-message span{font-size:12px;color:#bce8da;letter-spacing:1px;margin-top:9px}.board-message.bonus-intro{background:linear-gradient(#13384588,#172642ee),url('assets/neon-boulevard-v9.webp') center/cover}.board-message.bonus-intro strong{font-size:clamp(36px,6vw,80px);color:#ffa58c}.board-message.bonus-intro .bonus-car{position:absolute;width:60%;height:50%;bottom:0;right:-5%;opacity:.3;animation:bonus-car-in 1s cubic-bezier(.1,.7,.2,1) both;z-index:0}.win-continue{margin-top:20px;padding:11px 23px;border:1px solid #f8deb0;border-radius:7px;background:#efe0b7;color:#294e4f;font-size:10px;font-weight:950;letter-spacing:2px}.win-float{position:absolute;z-index:10;top:43%;left:50%;transform:translate(-50%,-50%);padding:6px 16px;border:1px solid #fff8d4;background:#eaca88;color:#21434b;border-radius:8px;font-size:24px;font-weight:950;box-shadow:0 6px 20px #05384460;pointer-events:none;animation:float-up .9s ease-out both}.confetti{position:absolute;z-index:16;top:25%;left:var(--left);width:7px;height:11px;background:var(--color);animation:confetti 1.3s ease-out forwards;pointer-events:none}.bonus-active .board{background-image:linear-gradient(90deg,#bafdf60c 1px,transparent 1px),linear-gradient(#a6fff010 1px,transparent 1px),radial-gradient(ellipse at 50% 0,#513858,#202d50 85%)}.bonus-active .board-shell{border-color:#f0b2bd;box-shadow:0 0 0 1px #f8dfba,inset 0 0 0 2px #64dfed,0 0 35px #f67fb63d}.bonus-active .bonus-sign{background:linear-gradient(125deg,#f2acb4,#cf78ba)}.bonus-active .hero-car svg{animation:car-rev 1.8s ease-in-out infinite}.bonus-active .turbo-ring{border-color:#fda8d3}.scene-transition{position:fixed;inset:0;pointer-events:none;z-index:60;visibility:hidden;overflow:hidden}.scene-transition span{position:absolute;width:140%;height:40%;left:-20%;background:linear-gradient(90deg,#ffe7b9,#ff897d);transform:translateX(-120%) skew(-18deg)}.scene-transition span:nth-child(2){top:33%;background:#76e3d2}.scene-transition span:nth-child(3){top:66%;background:#e597bb}.scene-transition.active{visibility:visible}.scene-transition.active span{animation:scene-wipe .85s cubic-bezier(.7,0,.2,1) both}.scene-transition.active span:nth-child(2){animation-delay:.065s}.scene-transition.active span:nth-child(3){animation-delay:.13s}
dialog{width:min(660px,calc(100% - 28px));max-height:calc(100svh - 28px);overflow:auto;border:1px solid #f4d8a7;border-radius:17px;background:#f4e9d0;color:#263f48;padding:26px;box-shadow:0 22px 80px #071e3d99;color-scheme:light}dialog::backdrop{background:#0b283cc4;backdrop-filter:blur(6px)}dialog h2{font:30px Impact,sans-serif;letter-spacing:1.4px;margin:0;color:#344e55}dialog h3{margin-top:24px}dialog p,dialog li{font-size:13px;line-height:1.55}dialog li{margin:9px 0}dialog ol{padding-left:20px}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.dialog-top .icon-button{flex-shrink:0;background:#28575c}.rules-cards{display:flex;gap:9px;margin:18px 0}.rules-cards>div{flex:1;background:#e4d6b7;border:1px solid #baa97f;padding:12px 8px;border-radius:8px;text-align:center}.rules-cards b{display:block;font:25px Impact,sans-serif;color:#8e4a55;margin-bottom:6px}.rules-cards span{font-size:9px}.rule-options{border-top:1px solid #bbb593;padding-top:13px;display:grid;gap:10px;font-size:12px}.rule-options label{display:flex;align-items:center;gap:8px;min-height:44px}.rule-options input{width:20px;height:20px}table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}td,th{border-bottom:1px solid #c9c3a3;padding:7px;text-align:center}td:first-child{text-align:left;display:flex;gap:7px;align-items:center}td svg{width:33px;height:33px}th{font-size:10px}.purchase-dialog{text-align:center;max-width:450px;padding:30px}.dialog-close{position:absolute;right:13px;top:10px;border:0;background:none;font-size:28px;color:#3f6868}.eyebrow{font-size:9px;letter-spacing:2px;color:#7b6654}.ticket-art{width:100px;height:100px;margin:10px auto}.ticket-art svg{width:100%;height:100%}.dialog-subtitle{font-size:14px!important}.purchase-facts{text-align:left;background:#e2d8bd;border-radius:10px;padding:6px 14px;margin:18px 0}.purchase-facts>div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #c4b693;font-size:12px}.purchase-facts>div:last-child{border-bottom:0}.purchase-facts b{font-size:16px}.purchase-facts div:nth-child(2) b{color:#a6525d;font-size:23px}.primary-action{display:block;min-height:47px;width:100%;background:linear-gradient(#ffaf8a,#e77979);border:1px solid #d0756b;border-radius:8px;color:#443747;font-weight:950;font-size:13px;letter-spacing:1px;box-shadow:0 4px #d3b49c;margin:12px 0}.text-action{border:0;background:none;color:#366c6e;text-decoration:underline;font-size:11px;padding:12px;min-height:42px}.error{color:#a62449;font-size:12px}.wallet-hero{width:76px;height:76px;border:1px solid #fff3c2;border-radius:50%;display:grid;place-items:center;margin:17px auto;background:#d5c59f}.wallet-hero svg{width:36px;height:36px;fill:none;stroke:#375d63;stroke-width:1.5}.credit-options{display:flex;gap:9px;margin-top:20px}.credit-options button{flex:1;min-height:48px;border:1px solid #afac8d;background:#d6dfb7;border-radius:8px;color:#294a50;font-weight:950}.sound-dialog{max-width:420px}.sound-dialog>label{display:block;font-size:14px;margin:20px 0}.sound-dialog output{float:right;font-weight:800}.sound-dialog input{display:block;width:100%;margin-top:12px;accent-color:#31867e;height:26px}
@keyframes arrival{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes city-breathe{from{transform:scale(1)}to{transform:scale(1.035)}}@keyframes reflection{0%,100%{transform:translateX(-15%);opacity:.2}50%{transform:translateX(15%);opacity:.7}}@keyframes drift{to{transform:translateY(-36px)}}@keyframes turn{to{transform:rotate(360deg)}}@keyframes car-idle{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-4px) rotate(0)}}@keyframes symbol-hop{0%{transform:scale(1)}40%{transform:scale(1.13) translateY(-3px)}100%{transform:scale(1)}}@keyframes car-rev{0%,100%{transform:translateX(0)}25%{transform:translateX(-7%) rotate(-4deg)}65%{transform:translateX(8%) rotate(2deg)}}@keyframes boat-rock{0%,100%{transform:rotate(0)}30%{transform:rotate(-8deg) translateY(-4%)}65%{transform:rotate(5deg)}}@keyframes flamingo-nod{0%,100%{transform:rotate(0)}35%{transform:rotate(10deg) scale(1.1)}70%{transform:rotate(-5deg)}}@keyframes tape-bop{0%,100%{transform:scale(1)}35%{transform:scale(1.15) rotate(-7deg)}65%{transform:scale(.98) rotate(5deg)}}@keyframes pendant-swing{0%,100%{transform:rotate(0)}30%{transform:rotate(-12deg)}65%{transform:rotate(9deg)}}@keyframes watch-glint{0%,100%{transform:scale(1);filter:brightness(1)}45%{transform:scale(1.12);filter:brightness(1.3)}}@keyframes glasses-tilt{0%,100%{transform:rotate(0)}40%{transform:rotate(-10deg) scale(1.12)}}@keyframes key-turn{from{transform:rotate(-8deg)}to{transform:rotate(7deg) scale(1.06)}}@keyframes turbo-hit{50%{transform:rotate(25deg) scale(1.13)}}@keyframes new-symbol{from{transform:translateY(-170%);opacity:.2}75%{transform:translateY(8%);opacity:1}to{transform:translateY(0);opacity:1}}@keyframes match-break{40%{transform:scale(1.1);opacity:1}to{transform:scale(.35);opacity:0}}@keyframes column-land{from{opacity:.85}to{opacity:0}}@keyframes reel-speed-lines{from{transform:translateY(-13%)}to{transform:translateY(13%)}}@keyframes cell-burst{from{transform:translate(-50%,-50%);opacity:1}to{transform:translate(var(--sx),var(--sy)) rotate(150deg);opacity:0}}@keyframes collect-flight{to{transform:translate(var(--dx),var(--dy)) scale(.5);opacity:.25}}@keyframes meter-pop{50%{transform:scale(1.1)}}@keyframes tap-response{50%{transform:scale(.965)}}@keyframes chrome-sweep{0%,75%{transform:translateX(-150%) skew(-15deg)}100%{transform:translateX(150%) skew(-15deg)}}@keyframes overlay-in{from{opacity:0;transform:scale(1.07)}to{opacity:1;transform:scale(1)}}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-20%) scale(.8)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-140%) scale(.95)}}@keyframes confetti{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--dx),240px) rotate(390deg)}}@keyframes scene-wipe{0%{transform:translateX(-120%) skew(-18deg)}50%{transform:translateX(0) skew(-18deg)}100%{transform:translateX(120%) skew(-18deg)}}@keyframes bonus-car-in{from{transform:translateX(130%) rotate(-8deg)}to{transform:translateX(0) rotate(-8deg)}}@keyframes prize-outline{from{opacity:.4;transform:scale(.94)}50%{opacity:1;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}
@media(min-width:1500px){.game{max-width:1500px;padding-inline:55px}.arena{grid-template-columns:minmax(0,1fr)240px;gap:35px}.feature-rail{gap:17px}.hero-car{height:135px}.hero-car svg{height:155px}}
@media(max-width:1050px){.game{padding:18px 25px 12px;gap:10px}.arena{grid-template-columns:minmax(0,1fr)175px;gap:18px}.controls{grid-template-columns:180px minmax(170px,250px)190px;gap:20px}.episode{display:none}.rail-heading{font-size:22px}.rail-heading span{font-size:6px}.bonus-sign{grid-template-columns:53px 1fr;padding:10px;gap:6px}.bonus-medal{width:53px;height:63px}.hero-car svg{height:105px}.hero-car{height:85px}.marquee:before{display:none}.round-total strong{font-size:29px}.mode-banner{top:111px}}
@media(max-width:700px){.game{height:100svh;min-height:740px;padding:12px 12px 10px;gap:8px}.topbar{min-height:77px;gap:8px}.brand span{font-size:13px;letter-spacing:2.5px}.brand strong{font-size:43px;letter-spacing:2px;text-shadow:0 2px #c23756,0 4px #583348}.brand small{font-size:5px;letter-spacing:.5px;margin-top:8px}.top-actions{gap:5px}.icon-button{width:33px;height:35px;border-radius:9px}.icon-button svg{width:18px;height:18px}#audio-settings{display:none}.balance{gap:8px;padding:8px 8px 8px 11px;border-radius:10px}.balance small{font-size:6px;letter-spacing:.8px}.balance strong{font-size:18px}.wallet-add{width:26px;height:29px;font-size:20px}.arena{display:flex;flex-direction:column;gap:9px}.cabinet{flex:1;min-height:300px}.marquee{height:24px;font-size:7px;letter-spacing:.65px;padding-inline:7px}.reel-lamps{gap:4px}.reel-lamps i{width:4px;height:4px}.board-shell{border-width:4px;border-radius:12px;box-shadow:0 0 0 1px #ffe7b3,0 3px 0 3px #6b44475e,0 10px 30px #082c4155}.board{inset:4px}.tile svg{left:3%;top:3%;width:94%;height:94%}.tile .sun-number{font-size:17px}.tile .bonus-label{font-size:5px;letter-spacing:.2px;padding:1px 3px}.tile.winning:after{border-radius:6px;box-shadow:0 0 9px var(--group-color)}.position-mark{font-size:8px;min-width:14px;height:14px}.combo-panel{min-height:38px;margin-top:6px;padding:4px 5px;gap:4px;border-radius:7px}.combo-panel #combo-content{font-size:8px;gap:5px}.combo-panel #combo-content>b{font-size:20px}.combo-panel button{font-size:6px;padding:4px 6px;letter-spacing:.2px;min-height:29px}.match-chip{gap:3px;padding:1px 3px}.match-chip svg{width:20px;height:22px}.match-chip strong,.match-chip>span{font-size:8px}.cabinet-foot{padding:6px 3px 0;font-size:7px;min-height:22px;gap:3px}.round-counter{font-size:6px;letter-spacing:0}.feature-rail{display:grid;grid-template-columns:1fr 74px 1fr;gap:9px;align-items:center;flex-shrink:0;height:81px;padding:0}.rail-heading,.hero-car{display:none}.bonus-sign{padding:7px;grid-template-columns:39px 1fr;grid-template-rows:12px 23px 19px;gap:2px 4px;border-radius:9px;box-shadow:none;height:72px}.bonus-medal{width:39px;height:53px}.bonus-sign>strong{font-size:26px}.bonus-sign small{font-size:5px;letter-spacing:.15px}.bonus-sign>b{font-size:6px;letter-spacing:0}.sun-meter{height:77px}.sun-meter>svg{height:70px;width:70px}.sun-meter>strong{top:21px;font-size:18px}.sun-meter small{font-size:5px;letter-spacing:0}.turbo-ring{width:58px;height:58px;left:calc(50% - 29px);top:6px}.round-total{gap:4px;padding:8px 0 5px;min-width:0}.round-total small{font-size:5px;letter-spacing:.5px}.round-total strong{font-size:24px}.round-total>span{font-size:8px}.controls{grid-template-columns:142px minmax(0,1fr);gap:12px;padding:12px;border-radius:11px}.stake label{font-size:6px;margin-bottom:6px;letter-spacing:1px}.stake-input{grid-template-columns:30px 1fr 30px;gap:3px}.stake-input button,.stake-input input{height:37px}.stake-input input{font-size:16px}.spin{min-height:58px;font-size:17px;gap:8px;border-radius:9px}.spin svg{width:24px;height:24px}.secondary{grid-column:1/-1;display:grid;grid-template-columns:1fr 95px;gap:13px;align-items:center}.buy-ticket{min-height:42px;font-size:10px;gap:7px}.buy-ticket svg{width:31px;height:31px}.buy-ticket small{font-size:7px}.secondary-button:not(.buy-ticket){font-size:7px;line-height:1.5;min-height:38px}.feature-strip{gap:9px;letter-spacing:.3px;font-size:6px;height:19px}.feature-strip>span:nth-of-type(2),.feature-strip>i:nth-of-type(2){display:none}.feature-strip b{font-size:12px;margin-left:1px}.fineprint{font-size:6px;gap:10px;letter-spacing:0;min-height:12px}.mode-banner{top:94px;font-size:6px;max-width:88%;padding:4px 6px;white-space:normal;text-align:center}.board-message small{font-size:10px;letter-spacing:1.5px}.board-message strong{font-size:51px}.board-message span{font-size:9px;letter-spacing:.5px}.board-message.bonus-intro strong{font-size:38px}.win-continue{margin-top:15px;font-size:8px;padding:9px 15px}.win-float{font-size:19px;padding:5px 12px}.fx-layer{inset:4px}.sound-dialog{padding:20px}.top-actions #info{width:31px}.purchase-dialog{padding:24px}.purchase-facts>div{font-size:11px}.rules-cards{gap:5px}.rules-cards>div{padding:9px 4px}.rules-cards span{font-size:8px}td,th{padding:6px 3px}td:first-child{gap:3px}td svg{width:25px;height:25px}}
@media(max-width:360px){.game{padding-inline:8px}.brand span{font-size:11px}.brand strong{font-size:36px}.balance{padding:7px;gap:5px}.balance strong{font-size:15px}.top-actions{gap:4px}.icon-button{width:30px}.controls{grid-template-columns:129px minmax(0,1fr);padding:10px;gap:10px}.feature-strip{gap:7px}.combo-panel #combo-content{font-size:7px}.match-chip strong,.match-chip>span{font-size:7px}.match-chip svg{width:17px}.feature-rail{gap:6px;grid-template-columns:1fr 65px 1fr}}
.no-motion *,.no-motion *:before,.no-motion *:after{animation:none!important;transition:none!important}.no-motion .scene-transition,.no-motion .floating-dust,.no-motion .cell-spark,.no-motion .column-stop,.no-motion .multiplier-flight{display:none}.no-motion .tile.removing{opacity:0}.no-motion .tile.added{transform:none;opacity:1}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.scene-transition,.floating-dust{display:none}}
/* Keep cells visually substantial at laptop heights. */
@media(min-width:701px){.game{max-width:1220px;min-height:680px;padding:16px 30px 10px;gap:8px}.topbar{min-height:78px}.brand strong{font-size:57px}.brand span{font-size:19px;letter-spacing:4px}.brand small{margin-top:10px}.arena{max-width:1020px;width:100%;margin-inline:auto;grid-template-columns:minmax(0,1fr)210px;gap:27px}.cabinet{height:100%;width:auto;max-width:100%;aspect-ratio:1.45;justify-self:end}.controls{padding:10px 24px;grid-template-columns:190px minmax(190px,270px)210px;gap:27px;max-width:1020px;width:100%;margin-inline:auto}.spin{min-height:62px}.feature-strip{height:18px}.mode-banner{top:92px}.feature-rail{padding:18px 0 23px;gap:8px}.bonus-sign{flex-shrink:0;min-height:102px}.hero-car{min-height:58px;height:80px;flex-shrink:1}.hero-car svg{height:105px;top:-14px}.rail-heading{font-size:24px}.sun-meter{height:86px}.sun-meter>svg{width:80px;height:80px}.sun-meter>strong{top:24px;font-size:22px}.turbo-ring{width:68px;height:68px;left:calc(50% - 34px);top:6px}.round-total{padding-top:8px}.round-total strong{font-size:30px}}
@media(min-width:701px) and (max-height:760px){.hero-car{display:none}.feature-rail{justify-content:space-between}.board-shell{border-width:5px}}

@media(max-width:700px){#audio-settings{display:grid}.top-actions{gap:4px}.balance{gap:5px;padding-left:8px}.balance strong{font-size:16px}.top-actions .icon-button{width:30px}.brand strong{font-size:39px}}

/* AFTER HOURS — original coastal crime-film art direction, v2. */
:root{--cyan:#66fff7;--pink:#ff43aa;--coral:#ff6d92;--gold:#ffdb87;--cream:#fff9e6}
.backdrop:before{background-image:url('assets/neon-boulevard-v9.webp');animation:city-breathe 32s ease-in-out infinite alternate}.backdrop:after{background-image:none;background-position:70% center}.stage-glow{background:linear-gradient(0deg,#101632bb,transparent 50%),linear-gradient(90deg,#05133125,transparent 32%,#13153930)}
.brand{filter:drop-shadow(-3px 5px 0 #081e45)}.brand strong{color:#ff6c9c;-webkit-text-stroke:1px #fff4c6;text-shadow:0 3px #ac285d,0 6px #173862,0 0 22px #fe36976e}.brand small{letter-spacing:1px}.episode b{font-size:11px;letter-spacing:1.5px;color:#7ffff0}.episode span{color:#fff8e3}.balance{background:linear-gradient(130deg,#101a38ee,#243c58ee);color:#fff7da;border-color:#80fff4;box-shadow:0 0 18px #16fbe129,inset 0 1px #efffff33}.balance small{color:#94dcd9}.wallet-add{background:#f77eb0;color:#222b46}.icon-button{background:#14263fea;border-color:#f07bad88;border-radius:7px}.icon-button:hover{background:#485279}
.police-reflections{position:fixed;inset:0;pointer-events:none;z-index:3;overflow:hidden;mix-blend-mode:screen}.police-reflections i{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 100% 74%,#ff224357,transparent 43%);animation:police-red 5s ease-in-out infinite}.police-reflections i+ i{background:radial-gradient(ellipse at 0 72%,#246bff55,transparent 43%);animation:police-blue 5s ease-in-out infinite}.bonus-active .police-reflections i{animation-duration:3.6s}.searchlight{position:fixed;right:3%;top:6%;width:70vw;height:90vh;z-index:-1;transform-origin:95% 0;pointer-events:none;background:linear-gradient(130deg,transparent 46%,#c5fff215 48%,#9cdbff03 62%,transparent 67%);clip-path:polygon(97% 0,17% 100%,76% 100%);animation:searchlight-pan 12s ease-in-out infinite alternate;mix-blend-mode:screen}
.city-sign{position:absolute;left:3px;top:27%;width:133px;transform:rotate(-6deg);text-align:center;pointer-events:none;filter:drop-shadow(0 4px 5px #001b35);z-index:0}.city-sign>span{font-size:7px;letter-spacing:3px;color:#b1ffee}.city-sign b{display:block;font:42px/.98 Impact,'Arial Narrow',sans-serif;letter-spacing:2px;color:#ffbbf0;-webkit-text-stroke:1px #ffe2f4;text-shadow:0 0 7px #ff38a4,0 0 20px #ff38a4,2px 3px #a23486}.city-sign em{display:block;margin-top:14px;font:italic 26px Georgia,serif;color:#9ffff3;text-shadow:0 0 8px #1beacb;transform:rotate(-6deg)}.city-sign>i{display:block;font-style:normal;font-size:6px;letter-spacing:2px;margin-top:14px;color:#ffeea8}.radio-sticker{position:absolute;left:14px;bottom:30%;transform:rotate(-6deg);width:106px;padding:9px 8px;border:1px solid #ffd5de70;background:#211c426e;box-shadow:3px 4px 0 #090d2f55;backdrop-filter:blur(5px)}.radio-sticker>span{font-size:8px;letter-spacing:2px;color:#75ffe8}.radio-sticker b{display:block;font:17px Impact,sans-serif;letter-spacing:1px}.equalizer{height:13px;display:flex;gap:4px;margin-top:7px}.equalizer i{width:6px;background:#ff88c6;transform-origin:bottom;animation:eq-dance .8s ease-in-out infinite alternate}.equalizer i:nth-child(2n){animation-delay:-.4s;background:#7bffed}.equalizer i:nth-child(3n){animation-delay:-.7s}.arena,.controls{position:relative;z-index:4}.topbar{z-index:5}.cabinet{aspect-ratio:1.45}.board-shell{border:5px solid #c2dcd7;border-radius:14px;box-shadow:-3px 0 0 #67fbe3,3px 0 0 #ff51ae,-7px 0 22px #0bd7e85c,7px 0 25px #f124ba50,0 16px 28px #09132baa}.board-shell:before{border:1px solid #a9fffe80;box-shadow:inset 0 0 18px #36196260}.board{background-image:linear-gradient(90deg,#e6caff0c 1px,transparent 1px),linear-gradient(#a6fff00c 1px,transparent 1px),radial-gradient(ellipse at 45% 0,#24435e,#181f3e 80%)}.board-shell:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:10;background:linear-gradient(115deg,transparent 38%,#b2ffed0c 45%,transparent 53%);transform:translateX(-150%);animation:glass-pass 11s ease-in-out infinite}.tile svg{filter:drop-shadow(0 5px 3px #00052466) saturate(1.2);left:3%;top:3%;width:94%;height:94%}.tile[data-symbol='7'] svg{filter:drop-shadow(0 0 8px #fce29266)}.tile.winning:after{border-radius:5px}.combo-panel{background:#111d3aed;border-color:#b2d4e25c;border-radius:5px}.combo-panel button{background:#70f5dc;color:#142b39;border-radius:3px}.cabinet-foot{color:#fff5e5;text-shadow:0 2px 3px #10182d}.marquee{font-size:8px;letter-spacing:1px}.marquee:before{content:'AFTER HOURS / VOL. 01';color:#8effe3;font-size:7px}.reel-lamps i.landed{background:#ff8bcd;box-shadow:0 0 7px #ff3eb4}
.feature-rail{gap:10px!important;padding-top:12px!important;padding-bottom:14px!important;justify-content:flex-start!important}.rail-heading{font:italic 37px/.92 Impact,sans-serif;letter-spacing:1px;transform:rotate(-3deg);color:#fffbe9;text-shadow:3px 4px #ee399b,0 0 16px #611a7144}.rail-heading>span{display:block;font:7px 'Trebuchet MS',sans-serif;letter-spacing:2px;color:#80ffe9;margin:0 0 8px}.rail-heading>em{display:block;font:italic 10px Georgia,serif;color:#ffdbbc;letter-spacing:0;text-shadow:0 1px #203857;margin-top:10px}.getaway-poster{height:122px;min-height:70px;flex:1;position:relative;overflow:hidden;background:linear-gradient(0deg,#13142a77,transparent 65%),url('assets/getaway-v9.webp') 80% center/cover;border:1px solid #ebb0b8;clip-path:polygon(3% 0,100% 4%,97% 100%,0 96%);filter:drop-shadow(3px 5px 0 #0e16274d);padding:9px}.getaway-poster>span{font-size:5px;letter-spacing:1px}.getaway-poster>b{position:absolute;bottom:10px;left:8px;font:italic 20px/.9 Impact,sans-serif;text-shadow:2px 2px #d14079}.poster-siren{position:absolute;inset:70% 0 0;background:linear-gradient(90deg,#fc1c7640,transparent,#196aff50);animation:neon-breathe 3.5s ease-in-out infinite}.bonus-sign{min-height:78px!important;grid-template-columns:56px 1fr!important;grid-template-rows:12px 30px 18px!important;padding:8px 10px!important;gap:2px 6px!important;background:linear-gradient(120deg,#fa73ad,#fdc396)!important;border:1px solid #ffcfdf;border-radius:7px;color:#282640;box-shadow:0 0 17px #ff5abb36}.bonus-medal{width:55px!important;height:62px!important}.bonus-sign>strong{font-size:32px!important}.bonus-sign>small{font-size:6px!important;letter-spacing:1px}.bonus-sign>b{font-size:7px!important}.sun-meter{height:70px!important;flex-shrink:0}.sun-meter>svg{width:65px!important;height:65px!important}.sun-meter>strong{top:19px!important;font-size:20px!important}.turbo-ring{top:5px!important;width:57px!important;height:57px!important;left:calc(50% - 28.5px)!important;border-color:#8affe5}.sun-meter small{font-size:6px}.round-total{margin-top:auto;border-top:1px solid #f4acd480;padding-top:9px}.round-total strong{text-shadow:0 0 18px #fa70ce44}.round-total small{font-size:7px}.round-total>span{font-size:10px}
.controls{background:linear-gradient(110deg,#14213bf5,#2d1e45f5);border-color:#95f0e88c;border-radius:10px;box-shadow:0 0 20px #00f2d912,0 8px 25px #000c3280}.spin{background:linear-gradient(#ffbdc6,#ff69a1 48%,#ed3686);border-color:#ffd4ee;color:#331c3a;border-radius:8px;box-shadow:inset 0 2px #fff1f090,0 5px 0 #7b2860,0 0 25px #fc3d983d}.spin.busy{background:linear-gradient(#df98cf,#bb648f);color:#3f2c49}.buy-ticket{background:linear-gradient(130deg,#baffec,#58d7d7);border-color:#c3fff5;border-radius:6px;color:#173147}.buy-ticket small{color:#25455e}.stake-input button,.stake-input select{background:#1b2948;border-color:#547b8f;color:#fff5df}.secondary-button:not(.buy-ticket){color:#bbd9e5}.feature-strip{font-size:7px;letter-spacing:.8px;height:16px!important}.radio-line{display:flex;align-items:center;justify-content:center;gap:9px;font-size:8px;letter-spacing:.5px;min-height:18px;position:relative;z-index:4}.radio-line>i{width:5px;height:5px;border-radius:50%;background:#85ffe7;box-shadow:0 0 6px #46ffcf}.radio-line>span{color:#78ffdb;font-weight:900}.radio-line>b{font-weight:500;color:#e2e3ec}.radio-line>em{font-size:7px;color:#ffa9c7}.fineprint{color:#dbdedf;font-size:7px}.mode-banner{top:96px;background:#0f2239e8;color:#8effe3;border:1px solid #70f9e590;font-size:7px}
.pursuit-hud{display:none;align-items:center;gap:8px;height:24px;flex-shrink:0;background:#101d38d9;border:1px solid #fc69b1a0;padding:4px 8px;border-radius:5px;margin-bottom:4px;font-size:7px;letter-spacing:1px;color:#8ffff3}.bonus-active .pursuit-hud{display:flex}.pursuit-hud>span{white-space:nowrap}.pursuit-hud>span>i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#ff83bc;margin-right:5px;box-shadow:0 0 7px #ff499b}.pursuit-hud>b{white-space:nowrap;color:#fff0d4}.pursuit-road{position:relative;flex:1;height:9px;border-bottom:1px dashed #b4bdea66;margin-inline:8px;--progress:0}.pursuit-road:after{content:'◈';position:absolute;right:-8px;top:-3px;font-size:12px;color:#fff4c6}.pursuit-road>i{position:absolute;left:calc(12% + var(--progress)*68%);top:2px;width:12px;height:5px;border-radius:2px;background:#ff83c6;box-shadow:-5px 0 10px #f051b880;transition:left .8s ease}.pursuit-road>.pursuer{left:calc(1% + var(--progress)*58%);width:10px;background:linear-gradient(90deg,#448dff 45%,#ff3b85 55%);box-shadow:0 0 8px #7966ff}.bonus-active .board-shell{border-color:#d0b6e1;box-shadow:-3px 0 #54dbff,3px 0 #ff3993,-8px 0 25px #2682ff5e,8px 0 25px #ff23735c}.bonus-active .board{background-image:linear-gradient(90deg,#e6caff0c 1px,transparent 1px),linear-gradient(#a6fff00c 1px,transparent 1px),radial-gradient(ellipse at 45% 0,#40375f,#152342 85%)}
.getaway-cinematic{position:fixed;inset:0;z-index:70;overflow:hidden;display:flex;align-items:center;background:#162944;isolation:isolate;color:#fff5dd}.getaway-cinematic:before{content:'';position:absolute;inset:-2%;z-index:-2;background:url('assets/getaway-v9.webp') 70% center/cover;animation:cinematic-push 5.5s ease-out both}.getaway-cinematic:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a233beb,transparent 78%),linear-gradient(0deg,#09203eaa,transparent 55%)}.cinematic-copy{margin-left:max(6vw,25px);max-width:570px;width:52%;animation:title-enter .65s cubic-bezier(.16,.8,.2,1) both}.episode-tag{font-size:10px;letter-spacing:3px;color:#86ffed;border-bottom:2px solid #ff5eae;padding-bottom:13px}.cinematic-copy p{font:italic 19px Georgia,serif;color:#ffc3c3;margin-top:33px}.cinematic-copy h2{font:italic clamp(74px,12vw,168px)/.8 Impact,'Arial Narrow',sans-serif;letter-spacing:-2px;margin:30px 0;color:#fff4d5;text-shadow:5px 6px #ed3d93,8px 10px #263b70;transform:rotate(-5deg)}.cinematic-copy h2 span{display:block;color:#ffa1c8}.cinematic-copy>b{display:block;font-size:12px;letter-spacing:2px;color:#8cffee;margin-top:45px}.cinematic-copy button{margin-top:28px;padding:17px 24px;min-width:240px;border:1px solid #baffed;background:#70f9d9;color:#152941;font-size:12px;letter-spacing:1.5px;font-weight:950;box-shadow:4px 5px #1c718e;transform:skew(-5deg)}.cinematic-copy button>span{font-size:22px;margin-left:22px}.cinematic-copy small{display:block;margin-top:22px;font-size:8px;line-height:1.5;color:#c3d7df}.cinematic-sweep{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,#80e6ff17 45%,transparent 51%);animation:glass-pass 6s ease-in-out infinite}.cinematic-police{position:absolute;inset:auto 0 0;height:35%;z-index:-1;mix-blend-mode:screen}.cinematic-police i{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 100%,#ff196b77,transparent 70%);animation:police-red 3s ease-in-out infinite}.cinematic-police i+ i{background:radial-gradient(ellipse at 85% 100%,#1c62ff99,transparent 70%);animation:police-blue 3s ease-in-out infinite}.getaway-ticket{width:calc(100% + 60px);height:135px;margin:15px -30px;background:linear-gradient(90deg,#0a244977,transparent),url('assets/getaway-v9.webp') 70% 44%/cover;display:flex;align-items:center;padding-left:28px}.getaway-ticket>b{font:italic 40px Impact,sans-serif;color:#fff7df;text-shadow:3px 4px #e44594;transform:rotate(-6deg)}
@keyframes police-red{0%,15%,60%,100%{opacity:0}28%,38%{opacity:.7}}@keyframes police-blue{0%,42%,88%,100%{opacity:0}56%,67%{opacity:.7}}@keyframes searchlight-pan{from{transform:rotate(-15deg);opacity:.3}to{transform:rotate(17deg);opacity:.85}}@keyframes glass-pass{0%,65%{transform:translateX(-100%)}100%{transform:translateX(120%)}}@keyframes eq-dance{from{transform:scaleY(.2)}to{transform:scaleY(1)}}@keyframes neon-breathe{0%,100%{opacity:.3}50%{opacity:.9}}@keyframes cinematic-push{from{transform:scale(1.1) translateX(1%)}to{transform:scale(1) translateX(0)}}@keyframes title-enter{from{opacity:0;transform:translateX(-60px) rotate(-3deg)}to{opacity:1;transform:translateX(0) rotate(0)}}
@media(min-width:701px){.game{gap:6px}.arena{max-width:1020px}.cabinet{aspect-ratio:1.45}.radio-line{height:18px}.controls{min-height:91px}.feature-rail{max-height:100%;overflow:hidden}}
@media(max-width:1150px){.city-sign,.radio-sticker{display:none}}
@media(max-width:700px){.game{min-height:785px;gap:6px}.backdrop:before{background-position:32% center}.backdrop:after{background-position:75% center}.brand strong{font-size:39px}.episode{display:none}.balance strong{font-size:16px}.arena{gap:7px}.feature-rail{height:81px;padding:0!important;gap:7px!important;grid-template-columns:1fr 68px 1fr}.getaway-poster{display:none}.rail-heading{display:none}.bonus-sign{min-height:71px!important;height:71px!important;grid-template-columns:39px 1fr!important;padding:7px!important;grid-template-rows:10px 24px 16px!important;gap:2px 4px!important}.bonus-medal{width:39px!important;height:53px!important}.bonus-sign>strong{font-size:27px!important}.bonus-sign>small{font-size:5px!important;letter-spacing:0}.bonus-sign>b{font-size:6px!important}.round-total{margin:0}.round-total small{font-size:5px}.round-total strong{font-size:25px}.round-total>span{font-size:8px}.radio-line{font-size:7px;gap:6px;min-height:16px}.radio-line>em{display:none}.radio-line>b{max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mode-banner{top:92px;max-width:80%;font-size:5px;padding:3px 5px}.marquee{font-size:6px;letter-spacing:.2px}.pursuit-hud{height:23px;font-size:6px;letter-spacing:.2px}.pursuit-hud>span{font-size:5px}.bonus-active .mode-banner{top:85px}.feature-strip{font-size:5px!important;gap:7px}.fineprint{font-size:5px}.cinematic-copy{width:90%;margin-left:23px;align-self:flex-end;margin-bottom:7vh}.getaway-cinematic:before{background-position:72% 25%;inset:0;background-size:auto 100%}.getaway-cinematic:after{background:linear-gradient(0deg,#0a233bf2 0%,#0a233b8a 45%,transparent 90%)}.episode-tag{font-size:7px;letter-spacing:1px}.cinematic-copy p{font-size:14px;margin-top:24px}.cinematic-copy h2{font-size:90px;margin:22px 0;line-height:.8}.cinematic-copy>b{margin-top:28px;font-size:9px;letter-spacing:1px}.cinematic-copy button{margin-top:22px;min-width:220px;padding:12px 18px}.cinematic-copy small{font-size:7px;margin-top:18px}.board-shell{border-width:4px}.controls{gap:9px;padding:11px}.searchlight{width:110vw;right:-10%}.getaway-ticket{width:calc(100% + 48px);margin-inline:-24px}.tile svg{width:98%;height:98%;left:1%;top:1%}}
@media(max-width:360px){.brand strong{font-size:35px}.game{min-height:755px}.radio-line>b{max-width:195px}.balance strong{font-size:15px}.top-actions{gap:3px}.controls{grid-template-columns:129px minmax(0,1fr)}.spin{font-size:15px;gap:5px}.cinematic-copy h2{font-size:76px}.cinematic-copy> b{font-size:8px}}
.no-motion .police-reflections,.no-motion .searchlight,.no-motion .cinematic-police,.no-motion .cinematic-sweep{display:none}.no-motion .getaway-cinematic:before{animation:none}.no-motion .equalizer i{animation:none;transform:scaleY(.6)}
@media(prefers-reduced-motion:reduce){.police-reflections,.searchlight,.cinematic-police,.cinematic-sweep{display:none}}

.driveby{position:fixed;bottom:2%;left:-260px;width:240px;height:120px;pointer-events:none;z-index:3;opacity:0}.driveby svg{position:absolute;width:240px;height:200px;top:-45px;filter:drop-shadow(-18px 8px 9px #ff168d99)}.driveby>i{position:absolute;bottom:26px;width:140px;height:9px;right:60%;background:linear-gradient(90deg,transparent,#ff43bf);filter:blur(5px)}.bonus-active .driveby{animation:driveby 12s ease-in infinite}@keyframes driveby{0%,65%{transform:translateX(0);opacity:0}66%{opacity:1}90%{opacity:1}100%{transform:translateX(calc(100vw + 520px));opacity:0}}.bonus-active .board-shell:before{background:linear-gradient(90deg,#176bff0c,transparent 25%,transparent 75%,#ff368510);animation:neon-breathe 3.6s ease-in-out infinite}.no-motion .driveby{display:none}@media(prefers-reduced-motion:reduce){.driveby{display:none}}
@media(min-width:701px){.mode-banner{top:82px}.bonus-active .mode-banner{top:82px}}

/* The ordinary game stays on the same empty boulevard. Bonus character art is loaded by bonus windows. */
.bonus-active .backdrop:after{background-image:url('assets/neon-boulevard-v9.webp')}
.getaway-poster{background-image:linear-gradient(0deg,#13142a77,transparent 65%),url('assets/neon-boulevard-v9.webp')}

/* V3: readable settlement, clipped drums, illuminated controls. */
.drum-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;contain:strict}.board.reel-running{box-shadow:inset 0 12px 18px #04082188,inset 0 -12px 18px #04082188}.board-shell:has(.reel-running){border-color:#cafef4;box-shadow:-3px 0 #83ffef,3px 0 #ff5bbb,0 0 35px #729dff57}.tile svg{filter:drop-shadow(0 4px 3px #00072480) saturate(1.28) contrast(1.04)}.tile.winning svg{filter:drop-shadow(0 0 8px #ffffc677) saturate(1.35)}
button{transition:transform .12s,box-shadow .18s,filter .18s}button:hover:not(:disabled){filter:brightness(1.10)}button:active:not(:disabled){transform:translateY(2px) scale(.98)}.icon-button:hover:not(:disabled){box-shadow:0 0 13px #79ffe352}.spin{border:2px solid #ffddf4;overflow:hidden;box-shadow:inset 0 2px 3px #fff7fcaa,inset 0 -4px 8px #a9186544,0 5px 0 #722657,0 0 24px #ff5cad55}.spin:not(:disabled){animation:spin-glow 4s ease-in-out infinite}.spin:before{content:'';position:absolute;inset:3px;border:1px solid #fff0fc77;border-radius:5px;pointer-events:none}.spin:after{animation:button-shine 6s ease-in-out infinite}.spin>svg{padding:3px;border:1px solid #54234b77;border-radius:50%;width:34px;height:34px;transition:transform .4s cubic-bezier(.2,.8,.3,1)}.spin:hover:not(:disabled)>svg{transform:rotate(70deg)}.spin.busy>svg{animation:turn .6s linear infinite}.buy-ticket{box-shadow:inset 0 2px #eaffff77,0 3px #215967,0 0 15px #39fada22}.buy-ticket:hover:not(:disabled){box-shadow:inset 0 2px #eaffff99,0 3px #215967,0 0 22px #39fada66}.stake-top{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:7px}.stake-top label{margin:0;letter-spacing:.5px;font-size:7px}.stake-top button{color:#9ffff0;background:#182a46;border:1px solid #74c7c666;padding:4px 5px;font-size:6px;border-radius:4px;white-space:nowrap;min-height:23px}.stake-top button[aria-pressed=true]{background:#8fffe7;color:#182a46}.round-tools{display:flex;justify-content:center;gap:10px}.round-tools button{min-height:25px}.round-tools button+button{border-left:1px solid #83c4d744!important;padding-left:14px!important}.receipt-line{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;min-height:22px;padding:3px 10px;border:1px solid #95bed25c;border-radius:5px;background:#15233fe8;color:#f0e9ea;font-size:8px;position:relative;z-index:4}.receipt-line b{color:#ffe0a4}.receipt-line i{font-style:normal;font-size:7px;color:#8cffeb}.receipt-line.credited b{color:#8cffeb}.preview-mode .balance{border-color:#ffd08b;box-shadow:0 0 15px #ffb8553b}.preview-mode .balance small{font-size:0}.preview-mode .balance small:after{content:'ДЕМО · БЕЗ ЗАЧИСЛЕНИЯ';font-size:6px;letter-spacing:.5px;color:#ffdd9b}.preview-mode #round-label{color:#ffdda6}.preview-mode #net{color:#ffdfa6}.preview-mode .mode-banner{background:#ffd691;color:#262a44;font-weight:900;border-color:#fff3bd}.preview-mode .round-total{border-top-color:#ffb669}.history-wrap{overflow:auto}.history-wrap th{font-size:10px;white-space:nowrap}.history-wrap td:first-child{display:table-cell;font-size:10px}#view-receipt{padding:12px;background:#dce7d0;border:1px solid #a7c4ad;border-radius:7px;font-weight:800}.sun-meter.pop{animation:turbo-charge .52s ease-out}.sun-meter.pop .turbo-ring{box-shadow:0 0 30px #67ffe3,inset 0 0 14px #71efff}.tile.multiplier-hit:before{content:'';position:absolute;inset:5%;border:2px solid #8efff2;border-radius:50%;animation:turbo-ripple .55s ease-out both}.tile[data-symbol='7'] .bonus-label{box-shadow:0 0 8px #ffdc8b77}.combo-panel .match-chip{background:#11193588}.fast-mode .tile{transition-duration:.18s}.fast-mode .tile.added{animation-duration:.19s}
@keyframes button-shine{0%,72%{transform:translateX(-150%)}92%,100%{transform:translateX(150%)}}@keyframes spin-glow{0%,100%{box-shadow:inset 0 2px 3px #fff7fcaa,0 5px #722657,0 0 20px #ff5cad40}50%{box-shadow:inset 0 2px 3px #fff7fcaa,0 5px #722657,0 0 30px #ff5cad70}}@keyframes turbo-charge{0%,100%{transform:scale(1)}35%{transform:scale(1.12)}70%{transform:scale(.98)}}@keyframes turbo-ripple{from{transform:scale(.7);opacity:.9}to{transform:scale(1.4);opacity:0}}
@media(max-width:700px){.stake-top{flex-direction:column;align-items:flex-start;gap:3px;margin-bottom:4px}.stake-top label{font-size:5px}.stake-top button{font-size:5px;min-height:19px;padding:2px 4px}.controls{align-items:end}.spin{min-height:66px}.spin>svg{width:28px;height:28px}.round-tools{flex-direction:column;gap:0;align-items:stretch}.round-tools button{min-height:22px!important;font-size:6px!important;padding:3px!important}.round-tools button+button{border-left:0!important;border-top:1px solid #83c4d744!important;padding-left:3px!important}.receipt-line{font-size:6px;gap:5px;min-height:18px}.receipt-line>span{display:none}.receipt-line>i{font-size:6px}.feature-strip{gap:5px!important;letter-spacing:0!important}.feature-strip>span{display:none}.feature-strip>i{display:none}.feature-strip button{font-size:7px!important}.preview-mode .balance small:after{font-size:5px;letter-spacing:0}.mode-banner{max-width:85%}.history-wrap td,.history-wrap th{font-size:9px}}
.no-motion .spin,.no-motion .spin:after{animation:none!important}@media(prefers-reduced-motion:reduce){.spin,.spin:after{animation:none!important}}
#bonus-kind{width:100%;padding:12px 8px;border:1px solid #619e9a;border-radius:7px;background:#d5f0dc;color:#173649;font-size:12px;font-weight:800}.bonus-picker{display:block;text-align:left;font-size:8px;letter-spacing:1px;margin-bottom:7px}.super-active .board-shell{border-color:#ffe499;box-shadow:-3px 0 #7ffff0,3px 0 #ffc364,0 0 30px #ffa43d60}.super-active .cinematic-copy h2{font-size:clamp(52px,8vw,110px);color:#fff1ac}.super-active .cinematic-copy h2 span{color:#ffc26b}.getaway-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.95}.getaway-cinematic:has(.getaway-video.playing):before{opacity:0}.no-motion .getaway-video{display:none}@media(prefers-reduced-motion:reduce){.getaway-video{display:none}}@media(max-width:700px){.super-active .cinematic-copy h2{font-size:62px}.super-active .cinematic-copy h2 span{font-size:51px}}
/* Illustrated rules: actual game symbols, exact accounting, accessible text. */
#rules{max-width:800px;width:calc(100% - 28px)}.visual-guide{margin-top:22px;color:#163747}.guide-kicker{font-size:9px;letter-spacing:2px;font-weight:900;color:#467b7c;margin:28px 0 10px}.visual-guide h3{font-size:24px;line-height:1.15;margin:0 0 18px;color:#153a48}.guide-match{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center}.guide-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:9px;border:2px solid #68cfce;border-radius:12px;background:linear-gradient(140deg,#182e52,#332749);box-shadow:0 5px 0 #336d75}.guide-cell{position:relative;aspect-ratio:1;background:#fff1;border:1px solid #ffffff09;border-radius:5px}.guide-cell svg{width:100%;height:100%;opacity:.6}.guide-cell.lit{background:#68ffe529;border-color:#7cffd6;box-shadow:0 0 7px #7affd533}.guide-cell.lit svg{opacity:1;filter:drop-shadow(0 0 3px #ffefb4aa)}.guide-cell i{position:absolute;bottom:-1px;right:-1px;font:700 9px/14px sans-serif;width:14px;text-align:center;border-radius:4px 0 4px 0;background:#85ffe1;color:#143748}.guide-match-copy>svg{width:65px;height:65px;display:block;filter:drop-shadow(0 3px 3px #133f5044)}.guide-match-copy>strong{display:block;font-size:22px}.guide-match-copy>b{color:#177c75;font-size:17px}.guide-match-copy p{font-size:12px;line-height:1.5;max-width:230px}.guide-flow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:26px;padding:14px 8px;background:#e5e4d4;border-radius:10px}.guide-flow>div{flex:1;text-align:center}.guide-flow>i{font:22px sans-serif;color:#1c8e8b}.flow-pic{position:relative;display:flex;align-items:center;justify-content:center;width:72px;height:62px;margin:0 auto 8px;background:linear-gradient(135deg,#233955,#3c3555);border-radius:10px}.flow-pic svg{width:65px;height:65px}.flow-pic>b{position:absolute;bottom:0;right:0;padding:2px 5px;background:#81fce0;color:#163d4c;border-radius:4px;font-size:14px}.guide-flow strong,.guide-flow small{display:block}.guide-flow strong{font-size:12px}.guide-flow small{font-size:9px;line-height:1.5;margin-top:3px}.cascade-pic{flex-direction:column;gap:2px}.cascade-pic em{font:18px sans-serif;letter-spacing:7px;color:#ffb7d7}.cascade-pic>b{position:static;background:transparent;color:#95ffe6;font-size:12px;letter-spacing:7px;padding:0}.guide-equation{display:flex;gap:8px;justify-content:space-between;align-items:center;padding:16px 8px}.guide-equation>span{font-size:10px;text-align:center;flex:1}.guide-equation b{display:block;font-size:28px;color:#1a5361}.guide-equation i{font-style:normal;font-size:22px;color:#709091}.guide-equation .equation-result{background:#c4e7d6;border-radius:9px;padding:6px}.guide-wallet{display:flex;align-items:center;gap:14px;border:1px solid #85b9a9;background:#d5ebd8;padding:14px;border-radius:9px}.guide-wallet svg{width:40px;fill:none;stroke:#277468;stroke-width:2}.guide-wallet span{font-size:12px}.guide-wallet b{font-size:16px}.guide-wallet small{display:block;font-size:10px;margin-top:4px;color:#377967}.guide-bonuses{display:grid;grid-template-columns:1fr 1fr;gap:14px}.guide-bonus{overflow:hidden;border:1px solid #849fa1;border-radius:10px;background:#e4e9dd}.guide-bonus-art{height:145px;position:relative;background:linear-gradient(90deg,#172740ab,#192c3922),url('assets/getaway-v9.webp') 65% 43%/cover;color:#ffeed2;padding:14px}.guide-bonus-art>span{font:italic 21px Impact,sans-serif;text-shadow:2px 2px #cb4690}.guide-bonus-art>b{position:absolute;bottom:12px;left:14px;font:italic 54px/.9 Impact,sans-serif;text-shadow:2px 3px #273d64}.guide-bonus-art small{display:block;font:700 8px sans-serif;letter-spacing:2px;margin-top:4px}.super .guide-bonus-art{background-image:linear-gradient(90deg,#392c34c7,#202c390a),url('assets/neon-boulevard-v9.webp');color:#ffe098;background-position:70% center}.guide-bonus-copy{padding:12px}.guide-bonus-copy p{display:grid;grid-template-columns:42px 1fr;column-gap:5px;margin:0 0 8px;font-size:11px}.guide-bonus-copy svg{width:42px;height:42px;grid-row:span 2}.guide-bonus-copy p>b{align-self:end}.guide-bonus-copy p>span{font-size:10px}.guide-bonus-copy>strong{font-size:11px;display:block}.guide-bonus-copy>small{font-size:10px;display:block;margin:6px 0 12px}.guide-bonus-copy button{font-size:9px;letter-spacing:.4px;width:100%;min-height:38px;border:1px solid #49847f;border-radius:5px;background:#bde9d5;color:#174654;font-weight:900}.super .guide-bonus-copy button{background:#f3dba4;border-color:#a39368}.guide-caution{font-size:10px!important;line-height:1.6;padding:10px 0}.guide-credit{display:grid;grid-template-columns:1fr 1fr;gap:12px}.guide-credit>div{padding:13px;background:#d2e7dd;border:1px solid #93bfb0;border-radius:8px}.guide-credit>div+div{background:#efe1c5;border-color:#c9b388}.guide-credit span,.guide-credit b,.guide-credit small{display:block}.guide-credit span{font-size:9px;letter-spacing:1px}.guide-credit b{font-size:12px;margin:8px 0}.guide-credit small{font-size:9px}.full-rules{margin-top:22px;border-top:1px solid #a1b7af;padding-top:14px}.full-rules summary{cursor:pointer;font-size:13px;font-weight:900;padding:8px 0}.full-rules ol{padding-left:20px}.full-rules li{margin-bottom:8px}.visual-guide svg{flex-shrink:0}.getaway-video{z-index:-2}
@media(max-width:520px){#rules{padding:20px 16px}.visual-guide h3{font-size:20px}.guide-match{grid-template-columns:1fr;gap:15px}.guide-match-copy{display:grid;grid-template-columns:60px 1fr;column-gap:10px}.guide-match-copy>svg{grid-row:span 2;width:55px;height:55px}.guide-match-copy>strong{font-size:18px;align-self:end}.guide-match-copy>b{font-size:15px}.guide-match-copy p{grid-column:span 2;max-width:none;margin:8px 0 0}.guide-cell i{font-size:10px}.guide-bonuses{gap:10px}.guide-bonus-art{height:128px;padding:10px}.guide-bonus-art>span{font-size:16px}.guide-bonus-copy{padding:8px}.guide-bonus-copy p{grid-template-columns:1fr}.guide-bonus-copy svg{width:40px;height:40px;grid-row:auto}.guide-bonus-copy>strong{font-size:10px;min-height:24px}.guide-bonus-copy>small{min-height:26px;font-size:9px}.guide-bonus-copy button{font-size:8px;padding:5px}.guide-wallet b{display:block;font-size:15px}.guide-equation{gap:3px}.guide-equation b{font-size:25px}.guide-flow{gap:3px}.guide-flow small{font-size:8px}.guide-credit{grid-template-columns:1fr}.guide-kicker{font-size:8px}.guide-credit b{font-size:13px}}
.super-ticket .getaway-ticket{background-image:linear-gradient(90deg,#38233e66,transparent),url('assets/neon-boulevard-v9.webp');background-position:70% center}.super-ticket .getaway-ticket>b{font-size:31px;color:#ffeab2}.super-ticket #buy-title{color:#805739}.super-ticket #bonus-kind{background:#eee0b8;border-color:#b49f64}
@media(max-width:700px){.getaway-video{object-position:76% center}.cinematic-copy{max-width:calc(100% - 46px)}.cinematic-copy h2{transform-origin:left center}}
.economy-picture{width:100%;height:auto;display:block;border-radius:8px;margin:12px 0}
@media(max-width:520px){.super .guide-bonus-art>span{font-size:12px;display:block}.guide-bonus-copy>small{line-height:1.5}}

/* AFTER HOURS v4: one visual hierarchy, readable controls, calmer idle state. */
:root{--v4-panel:#17293eea;--v4-line:#8adbd565}.spin:not(:disabled),.spin:after{animation:none}.spin{background:linear-gradient(165deg,#ffbbbf,#ff7ba4 58%,#ee5a92);box-shadow:inset 0 2px #fff3e7aa,0 4px #86385d,0 8px 18px #0c152c44;color:#3a2643;letter-spacing:.8px}.spin:not(:disabled):hover{box-shadow:inset 0 2px #fff3e7aa,0 4px #86385d,0 0 22px #ff9ebc44}.spin.busy>svg{animation:turn .65s linear infinite}.spin:before{border-color:#fff1dc88}.spin:after{display:none}.spin.busy{background:linear-gradient(#bf839f,#926f91);color:#f9e1eb}.spin.tap-burst{animation:tap-response .17s ease-out}.board{background:linear-gradient(90deg,#95ccd90a 1px,transparent 1px),linear-gradient(#95ccd90b 1px,transparent 1px),radial-gradient(ellipse at 50% 0,#31465e,#1b2b46 100%);background-size:calc(100% / 6) 20%,calc(100% / 6) 20%,100% 100%}.board-shell{box-shadow:0 0 0 1px #e2d3da,0 0 0 3px #15294088,0 8px 28px #12203966;border-color:#85cac7}.board-shell:before{box-shadow:inset 0 0 12px #111e3655}.tile svg{filter:drop-shadow(0 4px 3px #0813247a) saturate(1.04);width:96%;height:96%;left:2%;top:2%}.tile.winning svg{filter:drop-shadow(0 0 7px #fff4bf66)}.tile[data-symbol='3'].winning svg{animation:watch-glint .48s ease-out}.tile[data-symbol='4'].winning svg{animation:symbol-hop .48s ease-out}.tile[data-symbol='1'].winning svg{animation:glasses-tilt .48s ease-out}.tile[data-symbol='0'].winning svg{animation:tape-bop .48s ease-out}.tile .sun-number{background:#112b39dd;border:1px solid #92fff580;padding:2px 5px;border-radius:20px;font-size:clamp(17px,2.2vw,29px)}.tile .bonus-label{background:#ffdc86;letter-spacing:.3px}.top-actions .balance{background:linear-gradient(145deg,#203a54f2,#162840f2);border-color:#a8ece0a6}.balance strong{font-variant-numeric:tabular-nums;color:#ffefd5;letter-spacing:.1px}.balance small{color:#aad9de}.controls{background:linear-gradient(120deg,#17304cee,#282d4bee);border-color:#90c9d27d;box-shadow:0 5px 20px #0a1b3744}.buy-ticket{background:linear-gradient(145deg,#b8eddb,#83c8be);box-shadow:inset 0 1px #edfff0,0 3px #346772;color:#1a4050}.buy-ticket:hover:not(:disabled){box-shadow:inset 0 1px #edfff0,0 3px #346772,0 0 15px #9ffff333}.marquee{font-size:10px;letter-spacing:.4px}.combo-panel{background:#152b43ed;border-color:#7ca0b977}.combo-panel button{font-size:10px;letter-spacing:0;min-height:34px}.cabinet-foot{font-size:10px;line-height:1.4}.round-counter{font-size:9px}.round-total small{font-size:9px;letter-spacing:.3px;line-height:1.25}.round-total>span{font-size:11px}.receipt-line{font-size:10px;min-height:30px;border-color:#88afa644;background:#152b40eb}.receipt-line>i{font-size:9px}.stake-top label{font-size:9px}.stake-top button{font-size:8px;min-height:27px;padding:5px 7px}.secondary-button:not(.buy-ticket){font-size:10px}.round-tools button{min-height:32px!important;font-size:10px!important}.fineprint{font-size:8px;letter-spacing:0}.city-sign,.radio-sticker{opacity:.6}.feature-strip{font-size:9px;height:22px!important;letter-spacing:.3px}.feature-strip button{font-size:9px!important}.quiet-city .police-reflections,.quiet-city .searchlight,.quiet-city .floating-dust,.quiet-city .ocean-shimmer,.quiet-city .driveby,.quiet-city .cinematic-police{display:none}.quiet-city .backdrop:before,.quiet-city .backdrop:after,.quiet-city .equalizer i,.quiet-city .poster-siren,.quiet-city .board-shell:before{animation:none!important}.mode-banner{font-size:9px;max-width:90%;background:#f5d9a6;color:#173349;white-space:normal}.preview-mode .balance small:after{font-size:8px}.preview-mode #round-label{font-size:8px}.preview-mode #net{font-size:10px}
#sound-dialog{width:min(490px,calc(100% - 24px));padding:25px}#sound-dialog>label{font-size:13px}#sound-dialog input[type=range]{accent-color:#19877f}.settings-toggles{margin-top:16px;border-top:1px solid #96a89e}.settings-toggles>label{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:12px 0;border-bottom:1px solid #c3c5b7;margin:0!important}.settings-toggles b,.settings-toggles small{display:block}.settings-toggles b{font-size:13px}.settings-toggles small{font-size:11px;line-height:1.4;margin-top:3px;color:#5b7174}.settings-toggles input{appearance:none;position:relative;width:42px;height:25px;border-radius:20px;background:#a8b7b3;border:1px solid #8b9e99;flex:0 0 42px;cursor:pointer;margin:0}.settings-toggles input:before{content:'';position:absolute;width:17px;height:17px;background:#fffbef;top:3px;left:3px;border-radius:50%;box-shadow:0 2px 3px #234a4933;transition:transform .14s}.settings-toggles input:checked{background:#247f78}.settings-toggles input:checked:before{transform:translateX(17px)}.settings-links{display:grid;gap:8px;margin-top:16px}.settings-links button{min-height:43px;border:1px solid #72998e;background:#d8e6d9;color:#244c56;font-size:11px;font-weight:850;border-radius:7px}.settings-links button+button{background:transparent}.sound-dialog>p{font-size:12px}
#buy-dialog{width:min(680px,calc(100% - 24px));padding:26px}.purchase-dialog .getaway-ticket{display:none}.purchase-dialog h2{margin:14px 0}.bonus-picker,#bonus-kind{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;padding:0;border:0}.bonus-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 16px}.bonus-choices>button{padding:0 0 12px;text-align:left;border:2px solid #869e98;border-radius:9px;background:#dce4d8;color:#274753;overflow:hidden;box-shadow:none}.bonus-choices>button[aria-pressed=true]{border-color:#19857a;background:#c9e7d5;box-shadow:0 0 0 2px #19857a25}.bonus-choices>button[data-bonus-choice=super][aria-pressed=true]{border-color:#aa784a;background:#efe0b9;box-shadow:0 0 0 2px #ba915733}.choice-art{height:135px;display:block;position:relative;background:linear-gradient(90deg,#172b4799,transparent),url('assets/getaway-v9.webp') 70% 45%/cover;padding:12px;color:#fff2dc}.choice-art b{font:italic 24px Impact,sans-serif;text-shadow:2px 3px #be497c;white-space:nowrap}.choice-art em{position:absolute;bottom:10px;left:12px;font:italic 58px/.9 Impact,sans-serif;text-shadow:2px 3px #283e60}.bonus-choices>button[data-bonus-choice=super] .choice-art{background-image:linear-gradient(90deg,#3c29458c,transparent),url('assets/neon-boulevard-v9.webp');background-position:76% center;color:#ffeab0}.bonus-choices strong,.bonus-choices small{display:block;margin:10px 12px 0;font-size:12px}.bonus-choices small{font-size:10px;margin-top:4px}.dialog-subtitle{font-size:12px;margin:8px 0}.purchase-facts{margin:14px 0}.purchase-facts>div{padding:10px 0}.purchase-note{font-size:11px;line-height:1.5}.cancel-buy{background:transparent;border:1px solid #94aaa0;min-height:40px;color:#33525a;border-radius:7px;width:100%;margin-top:9px;font-size:11px}.text-action{min-height:40px;font-size:11px}#confirm-buy{min-height:47px;font-size:13px}.super-ticket #buy-title{color:#734c31}.cinematic-copy button{min-height:44px}.getaway-cinematic .cinematic-copy small{font-size:10px}.radio-line{font-size:10px}.bonus-sign small{font-size:8px;letter-spacing:.3px}.bonus-sign>b{font-size:10px;letter-spacing:0}.sun-meter small{font-size:8px;letter-spacing:0}.pursuit-hud{height:29px;font-size:10px}.pursuit-hud>span{font-size:9px}
@media(min-width:701px){.game{min-height:650px;padding:12px 24px 9px;gap:7px}.topbar{min-height:74px}.arena{gap:22px}.cabinet{aspect-ratio:auto;width:100%}.controls{min-height:92px;grid-template-columns:190px minmax(200px,1fr)220px;gap:22px}.feature-rail{gap:8px!important}.round-total strong{font-size:33px}.brand small{font-size:8px}.round-tools{gap:8px}.feature-strip{height:20px!important}.feature-strip>span{font-size:8px}.radio-sticker{display:none}.getaway-poster{flex:0 1 88px}.city-sign{display:none}.feature-rail .bonus-sign{min-height:96px}.rail-heading{font-size:30px}.rail-heading>span{font-size:8px}.balance small{font-size:9px}.balance strong{font-size:25px}}
@media(max-width:700px){.game{height:100svh;min-height:670px;padding:10px;gap:7px}.topbar{min-height:66px;gap:8px}.brand span{font-size:12px;letter-spacing:2px}.brand strong{font-size:37px}.brand small{font-size:6px;letter-spacing:0;max-width:100px;line-height:1.4;margin-top:6px}.top-actions{gap:5px}#info{display:none}.top-actions .icon-button{width:38px;height:42px;border-radius:10px}.top-actions #audio-settings{display:grid}.balance{padding:8px!important;gap:6px;min-width:128px}.balance small{font-size:8px;letter-spacing:0}.balance strong{font-size:20px}.wallet-add{width:28px;height:33px}.marquee{font-size:9px;min-height:23px;height:23px;padding:0 3px}.marquee:before{display:none}.board-shell{border-width:3px}.cabinet{min-height:250px}.board{inset:3px}.tile svg{width:99%;height:99%;left:.5%;top:.5%}.tile .bonus-label{font-size:8px;padding:1px 3px}.tile .sun-number{font-size:18px;padding:1px 4px}.position-mark{font-size:9px;width:15px;height:15px}.combo-panel{min-height:36px;padding:4px 6px;margin-top:5px;gap:6px}.combo-panel #combo-content{font-size:10px;gap:5px}.combo-panel #combo-content>b{font-size:21px}.combo-panel button{font-size:9px;min-height:30px;padding:5px 7px}.match-chip{gap:3px}.match-chip svg{width:24px;height:25px}.match-chip strong,.match-chip>span{font-size:9px}.cabinet-foot{font-size:8px;min-height:24px;padding-top:5px}.round-counter{font-size:8px}.feature-rail{height:76px;grid-template-columns:1fr 66px 1fr;gap:7px!important}.bonus-sign{height:72px!important;min-height:72px!important;padding:6px!important;grid-template-columns:30px 1fr!important;grid-template-rows:13px 23px 19px!important;gap:0 4px!important}.bonus-medal{width:30px!important;height:44px!important}.bonus-sign>small{font-size:7px!important;line-height:1.2}.bonus-sign>strong{font-size:25px!important}.bonus-sign>b{font-size:8px!important;line-height:1.1}.sun-meter{height:72px}.sun-meter>svg{width:65px;height:65px}.sun-meter>strong{top:21px;font-size:18px}.sun-meter small{font-size:7px;line-height:1.15}.round-total small{font-size:7px;line-height:1.25}.round-total strong{font-size:26px}.round-total>span{font-size:10px}.controls{grid-template-columns:145px minmax(0,1fr);gap:9px;padding:9px;min-height:137px}.stake-top{gap:4px;margin-bottom:4px}.stake-top label{font-size:8px;letter-spacing:0}.stake-top button{font-size:8px;padding:3px 6px;min-height:24px}.stake-input{grid-template-columns:31px minmax(0,1fr)31px;gap:3px}.stake-input button,.stake-input select{height:38px}.stake-input select{font-size:17px;padding-inline:0}.spin{min-height:70px;font-size:19px;gap:6px}.spin>svg{width:28px;height:28px}.secondary{grid-template-columns:1fr 83px;gap:8px}.buy-ticket{min-height:46px;font-size:11px;gap:6px}.buy-ticket small{font-size:9px}.buy-ticket svg{height:34px;width:34px}.round-tools{gap:2px}.round-tools button{font-size:9px!important;min-height:25px!important;padding:3px!important}.receipt-line{min-height:23px;font-size:9px;gap:7px}.receipt-line>i{font-size:8px}.feature-strip{height:22px!important;min-height:22px}.feature-strip>span,.feature-strip>i{display:none}.feature-strip button{font-size:9px!important;min-height:26px}.fineprint{font-size:7px;gap:8px;min-height:12px}.radio-line{font-size:9px;min-height:23px}.mode-banner{top:77px;font-size:8px;max-width:88%;padding:5px 8px}.bonus-active .mode-banner{top:77px}.preview-mode .balance small:after{font-size:6px;letter-spacing:0}.preview-mode .round-total small{font-size:7px}.preview-mode #net{font-size:8px}.pursuit-hud{height:25px;font-size:9px}.pursuit-hud>span{font-size:8px}.purchase-dialog#buy-dialog{padding:22px 18px}.bonus-choices{gap:8px;margin:14px 0}.choice-art{height:100px;padding:9px}.choice-art b{font-size:17px}.bonus-choices [data-bonus-choice=super] .choice-art b{font-size:14px}.choice-art em{font-size:45px;bottom:8px;left:9px}.bonus-choices strong{font-size:10px;margin:9px 8px 0;min-height:26px}.bonus-choices small{font-size:9px;margin:4px 8px 0;min-height:25px}.purchase-facts>div{font-size:12px;padding:8px 0}.dialog-subtitle{font-size:11px}.purchase-note{font-size:10px}.dialog-error{font-size:11px}.getaway-cinematic .cinematic-copy small{font-size:9px}.feature-rail .getaway-poster,.city-sign,.radio-sticker{display:none}}
@media(max-width:370px){.game{padding:8px;gap:6px}.brand strong{font-size:31px}.brand span{font-size:10px}.brand small{font-size:5px;max-width:83px}.top-actions .icon-button{width:32px;height:38px}.top-actions{gap:4px}.balance{min-width:119px;padding:7px!important}.balance strong{font-size:18px}.balance small{font-size:7px}.controls{grid-template-columns:130px minmax(0,1fr);gap:8px;padding:8px}.spin{font-size:16px}.spin>svg{width:25px;height:25px}.stake-top button{font-size:7px}.bonus-sign>small{font-size:6px!important}.bonus-sign>b{font-size:7px!important}.round-total strong{font-size:23px}.feature-strip button{font-size:8px!important}.fineprint{font-size:6px}.choice-art b{font-size:15px}.bonus-choices [data-bonus-choice=super] .choice-art b{font-size:12px}}
@media(max-height:760px) and (max-width:700px){.game{min-height:640px;gap:5px}.brand strong{font-size:31px}.topbar{min-height:57px}.feature-strip{display:none}.fineprint{font-size:6px}.cabinet{min-height:235px}.controls{min-height:123px;gap:6px;padding:7px}.spin{min-height:62px}.secondary .buy-ticket{min-height:42px}.feature-rail{height:70px}.bonus-sign{height:66px!important;min-height:66px!important}.sun-meter{height:66px}.receipt-line{min-height:22px}.stake-input button,.stake-input select{height:34px}.stake-top button{min-height:21px}}
@media(min-width:701px){.arena{width:min(100%,calc((100svh - 300px)*1.2 + 232px));max-width:1020px;grid-template-columns:minmax(0,1fr)210px;gap:22px}.controls{max-width:min(1020px,calc((100svh - 300px)*1.2 + 232px));grid-template-columns:170px minmax(180px,1fr)190px;gap:16px;padding-inline:16px}.stake-top{gap:5px}.stake-top label{font-size:8px}.stake-top button{font-size:7px}.cabinet{aspect-ratio:auto}.spin{font-size:20px}.buy-ticket{font-size:11px}.getaway-poster{flex:0 1 90px}.receipt-line{max-width:1020px;margin-inline:auto}}

/* COASTLINE HEAT v5 — coastal neon, warm chrome, a clear and tactile cabinet.
   This file is the final presentation layer. It does not change game outcomes. */

:root {
  --cream: #fff1d8;
  --cyan: #94e9dd;
  --coral: #ff9b89;
  --gold: #f4d69a;
  --pink: #ee839f;
  --ink: #082630;
  --finish-panel: #102c38;
  --finish-panel-deep: #071d28;
  --finish-line: #b7e3dc38;
  --finish-muted: #a6c4c6;
  --finish-display: Impact, 'Arial Narrow', sans-serif;
  --finish-body: 'Avenir Next', 'Trebuchet MS', sans-serif;
  font-family: var(--finish-body);
  font-weight: 600;
  color: var(--cream);
  background: #091e2a;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}

html { height: 100%; background: #091e2a; }
body { height: 100%; overflow: hidden; background: transparent; }
button, select, input { font-family: var(--finish-body); }
button { transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .14s ease; }
button:hover:not(:disabled) { filter: none; }
button:disabled { opacity: .44; }
button:focus-visible, select:focus-visible, input:focus-visible, summary:focus-visible,
a:focus-visible { outline: 3px solid #c4fff2; outline-offset: 4px; }
button:active:not(:disabled) { transform: translateY(1px); }

/* The city remains saturated; quiet foreground surfaces give it room to breathe. */
.backdrop { background: #1a3446; }
.backdrop:before { animation: none; background-position: center 49%; }
.backdrop:after { background-position: 69% center; }
.stage-glow {
  background: linear-gradient(180deg, #06192524 0%, transparent 25%, #06131e16 54%, #06131eb5 100%),
    linear-gradient(90deg, #06233020, transparent 28%, transparent 74%, #0623302e);
}
.floating-dust { opacity: .14; }
.ocean-shimmer { opacity: .5; }
.police-reflections { z-index: 1; opacity: .5; }
.police-reflections i, .bonus-active .police-reflections i { animation-duration: 8s; }
.searchlight { opacity: .45; }
.city-sign, .radio-sticker, .driveby { display: none; }

.game {
  --stage-width: min(1040px, calc((100svh - 240px) * 1.45 + 238px));
  width: 100%; max-width: 1440px; height: 100svh; min-height: 0;
  margin: 0 auto; padding: 17px 28px 10px; gap: 7px;
  isolation: isolate;
}
.topbar { min-height: 68px; gap: 22px; width: 100%; max-width: 1240px; margin: 0 auto; }
.brand { transform: skew(-8deg); filter: drop-shadow(0 3px 0 #153e4de0); }
.brand span {
  font: 20px/.9 var(--finish-display); letter-spacing: 4.2px;
  color: #fff6dc; text-shadow: 0 1px #173c47;
}
.brand strong {
  font: 59px/.88 var(--finish-display); letter-spacing: 3.7px;
  color: #ffab98; -webkit-text-stroke: 1px #ffecd1;
  text-shadow: 0 3px #b35762, 0 6px #102e3f;
}
.brand small {
  margin-top: 9px; color: #fff5dd; font-size: 7px;
  line-height: 1.2; font-weight: 800; letter-spacing: 1.05px;
}
.episode { padding-left: 20px; border-left-color: #e0fbef60; text-shadow: 0 2px 5px #082431; }
.episode span { font-size: 9px; letter-spacing: 1.9px; color: #fff4da; margin-bottom: 9px; }
.episode b { color: #a4f5e7; font-size: 10px; letter-spacing: 2px; font-weight: 800; }
.top-actions { gap: 8px; }
.icon-button {
  width: 42px; height: 42px; border-radius: 11px;
  background: #112d3be8; color: #dcf2e9; border: 1px solid #caeee14f;
  box-shadow: inset 0 1px #f0fff00d, 0 3px 12px #04142125;
}
.icon-button svg { width: 19px; height: 19px; stroke-width: 1.6; }
.icon-button:hover:not(:disabled) { background: #234854; border-color: #a4e0d6; box-shadow: inset 0 1px #efffef1f; }
.icon-button[aria-pressed=true] { color: #b3ffee; border-color: #8cdece; background: #234951; }
.top-actions .balance {
  min-width: 181px; padding: 10px 11px 10px 17px; gap: 16px; border-radius: 12px;
  background: linear-gradient(135deg, #1b3c47f5, #0e2635f7); border: 1px solid #b6e0d888;
  box-shadow: inset 0 1px #edfff026, 0 4px 15px #0318213d; color: var(--cream);
}
.balance small { font-size: 8px; letter-spacing: 1.45px; color: #b1d9d5; margin-bottom: 4px; }
.balance strong { font-size: 25px; font-weight: 800; line-height: 1; letter-spacing: -.55px; color: #fff5df; }
.wallet-add { width: 30px; height: 33px; border-radius: 7px; border: 1px solid #ffe6d8b0; background: #efaa98; color: #18343f; font-size: 22px; }
.wallet-add:hover:not(:disabled) { background: #ffd3b9; box-shadow: 0 2px 9px #ffba9426; }

/* Cabinet — a generous playing field with a precise chrome surround. */
.arena {
  width: var(--stage-width); max-width: 1040px; margin: 0 auto;
  grid-template-columns: minmax(0, 1fr) 210px; gap: 22px; flex: 1; min-height: 0;
}
.cabinet { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; animation: finish-arrive .6s ease-out both; }
.marquee { height: 25px; min-height: 25px; padding: 0 10px; font-size: 9px; font-weight: 800; letter-spacing: .7px; color: #fff4df; }
.marquee:before { content: 'COASTLINE / VOL. 01'; font-size: 7px; color: #d4f3e7; letter-spacing: 1.6px; }
.reel-lamps { gap: 5px; }
.reel-lamps i { width: 4px; height: 4px; background: #8bd6cd3b; box-shadow: 0 0 0 1px #c7ede346; transition: background .2s ease; }
.reel-lamps i.landed { background: #aef4dc; box-shadow: 0 0 5px #aaf9dd44; }
.board-shell {
  border: 5px solid #9cded5; border-radius: 17px; background: #153d47;
  box-shadow: 0 0 0 1px #fff1db, 0 0 0 3px #23716f, 0 0 0 5px #0c242b8c,
    -5px 0 19px #5ce8d624, 5px 0 19px #ff799327, 0 18px 38px #06142273, inset 0 1px #effffba6;
  transition: border-color .35s ease, box-shadow .35s ease;
}
.board-shell:before { inset: 0; border-radius: 10px; border: 1px solid #aeffed43; box-shadow: inset 0 8px 20px #00141c2e, inset 0 -2px #a7efd712; }
.board-shell:after {
  inset: 0; background: linear-gradient(118deg, #e7ffec08, transparent 27%, transparent 76%, #c0ece208);
  transform: none; animation: none; mix-blend-mode: screen;
}
.board {
  inset: 5px; border-radius: 8px;
  background: linear-gradient(90deg, #bfffea08 1px, transparent 1px),
    linear-gradient(#bfffea07 1px, transparent 1px),
    radial-gradient(ellipse at 48% -20%, #34646c, #163d4b 42%, #102d3e 86%);
  background-size: calc(100% / 6) 20%, calc(100% / 6) 20%, 100% 100%;
  box-shadow: inset 0 6px 17px #0017218c, inset 0 -3px 10px #020c1826;
}
.tile svg { width: 96%; height: 96%; left: 2%; top: 2%; filter: drop-shadow(0 5px 3px #01162380) saturate(1.15) brightness(1.07); transform-origin: 50% 62%; }
.tile { will-change: top; }
.tile.winning { z-index: 3; background: radial-gradient(ellipse, #b2fff722, transparent 72%); }
.board.evaluating .tile:not(.winning) { opacity: .42; }
.tile.winning:after {
  inset: 4%; border: 1.5px solid var(--group-color, #b5f8e2); border-radius: 9px;
  box-shadow: inset 0 0 15px #ddfff614, 0 0 12px #baffed1a; animation: finish-match-outline .55s ease-out both;
}
.tile.winning svg { filter: drop-shadow(0 5px 4px #001c33) drop-shadow(0 0 4px #edfff448); animation: finish-object-lift .6s ease-out both; }
.tile[data-symbol='0'].winning svg { animation: finish-tape .65s ease-out both; }
.tile[data-symbol='1'].winning svg { animation: finish-lighter .65s ease-out both; }
.tile[data-symbol='2'].winning svg { animation: finish-watch .72s ease-out both; }
.tile[data-symbol='3'].winning svg { animation: finish-gem .78s ease-out both; }
.tile[data-symbol='4'].winning svg { animation: finish-diamond .7s ease-out both; }
.tile[data-symbol='5'].winning svg { animation: finish-boat .85s ease-out both; }
.tile[data-symbol='6'].winning svg { animation: finish-car .68s cubic-bezier(.2,.65,.35,1) both; }
.tile:is([data-symbol='2'],[data-symbol='3'],[data-symbol='4']).winning:before {
  content: ''; position: absolute; z-index: 4; width: 18%; height: 51%; left: 30%; top: 20%;
  background: linear-gradient(100deg, transparent, #fff8cd91, transparent);
  border-radius: 70%; filter: blur(1px); transform: rotate(28deg); pointer-events: none;
  animation: finish-jewel-shine .7s ease-out both;
}
.tile[data-symbol='7'] svg { filter: drop-shadow(0 4px 3px #041a27aa); }
.tile .bonus-label {
  bottom: 6%; padding: 2px 6px 1px; font-size: 8px; letter-spacing: 1px; font-weight: 900;
  background: #f9e2aa; color: #1e4046; border: 1px solid #fff0c7; border-radius: 3px;
  box-shadow: 0 2px 3px #08253366;
}
.tile .sun-number {
  font-size: clamp(17px, 2.1vw, 29px); line-height: 1.1; padding: 3px 6px;
  border: 1px solid #ddffecba; border-radius: 20px; background: #103e48ed;
  color: #f5ffed; box-shadow: 0 2px 6px #00252a66; text-shadow: none;
}
.position-mark { top: 5%; right: 5%; min-width: 17px; height: 17px; font-size: 9px; font-weight: 900; border-radius: 50%; box-shadow: 0 2px 5px #06162066; }
.board-shell:has(.reel-running) {
  border-color: #c9e7db; box-shadow: 0 0 0 1px #f7ecd6, 0 0 0 3px #316163, 0 18px 38px #06142273;
}
.column-stop { opacity: .5; }
.cascade-flash { animation: finish-cascade .65s ease-out; }

.combo-panel {
  min-height: 42px; margin-top: 8px; padding: 5px 6px 5px 12px; gap: 7px;
  background: linear-gradient(100deg, #0c2835f5, #163846ed); border: 1px solid #c0ead748;
  border-radius: 8px; box-shadow: inset 0 1px #c7ffea0a; color: #cde4df;
}
.combo-panel #combo-content { font-size: 10px; gap: 8px; font-weight: 600; }
.combo-panel #combo-content>b { color: #f1dba6; font: 24px/1 var(--finish-display); letter-spacing: .5px; }
.combo-panel button {
  min-height: 30px; padding: 6px 11px; font-size: 9px; font-weight: 800; letter-spacing: .35px;
  border: 1px solid #bdeee164; background: #234850; color: #d9f4e9; border-radius: 5px;
}
.combo-panel button:hover:not(:disabled) { background: #315d62; border-color: #a4e3d1; }
.combo-panel #combo-next { background: #b2e8d4; color: #153641; border-color: #e2ffed; }
.combo-panel .match-chip { padding: 3px 6px; background: #0a2331cc; border-color: color-mix(in srgb, var(--group-color) 58%, transparent); border-radius: 5px; }
.match-chip strong, .match-chip>span { font-size: 10px; font-variant-numeric: tabular-nums; }
.match-chip>span { color: #fff0d8; }
.cabinet-foot { min-height: 23px; padding: 6px 8px 0; color: #e7efe4; font-size: 9px; line-height: 1.4; font-weight: 700; text-shadow: 0 1px 4px #05212bf0; }
.round-counter { font-size: 8px; letter-spacing: .7px; color: #b9d5d0; }

/* A compact episode card and a real dashboard, not a second competing hero. */
.feature-rail { gap: 10px !important; padding: 26px 0 0 !important; justify-content: flex-start !important; }
.rail-heading { transform: none; font: italic 36px/.88 var(--finish-display); color: #fff2db; letter-spacing: 1px; text-shadow: 2px 3px #88505f; }
.rail-heading>span { margin: 0 0 9px; font: 800 8px/1 var(--finish-body); color: #b6eadd; letter-spacing: 2px; text-shadow: none; }
.rail-heading>em { font: italic 11px/1.2 Georgia, serif; color: #ffe1c6; margin-top: 8px; text-shadow: 0 1px 3px #0c2d3b; }
.getaway-poster {
  min-height: 60px; height: 88px; flex: 1 1 88px; max-height: 130px; border-radius: 9px; clip-path: none;
  border: 1px solid #f8d3b780; background: linear-gradient(90deg, #05243499, transparent 74%), url('assets/getaway-v9.webp');
  background-size: 100% 100%, auto 190%; background-position: center, 83% 100%;
  filter: none; box-shadow: inset 0 0 0 3px #c8ecdc0a, 0 5px 12px #04192833; padding: 10px;
}
.getaway-poster>span { font-size: 5px; font-weight: 700; letter-spacing: 1.2px; color: #e3ffe9; }
.getaway-poster>b { left: 10px; bottom: 10px; font-size: 23px; line-height: .88; letter-spacing: .3px; color: #fff4dc; text-shadow: 1px 2px #ba6982; }
.poster-siren { opacity: .4; animation-duration: 7s; }
.feature-rail .bonus-sign {
  min-height: 86px !important; height: 86px; padding: 10px 12px !important;
  grid-template-columns: 51px 1fr !important; grid-template-rows: 13px 28px 18px !important; gap: 2px 9px !important;
  border: 1px solid #f4d5b8; border-radius: 9px; background: linear-gradient(135deg, #f4cdab, #e5a590) !important;
  color: #173c44; box-shadow: inset 0 1px #fff3d79c, 0 4px 12px #0519242e;
}
.bonus-sign:after { display: none; }
.bonus-medal { width: 51px !important; height: 61px !important; filter: drop-shadow(0 3px 2px #34514c33); }
.bonus-sign>small { font-size: 7px !important; font-weight: 850; letter-spacing: .7px; }
.bonus-sign>strong { font: 35px/.86 var(--finish-display) !important; }
.bonus-sign>b { font-size: 8px !important; line-height: 1.08; font-weight: 800; letter-spacing: .3px; }
.sun-meter {
  display: grid; grid-template-columns: 69px 1fr; grid-template-rows: 1fr 1fr;
  height: 64px !important; min-height: 64px; padding: 0; text-align: left;
  border: 1px solid var(--finish-line); border-radius: 9px; background: #0b2936ed;
}
.sun-meter>svg { grid-column: 1; grid-row: 1/3; width: 62px; height: 62px; margin: -1px 0 0 3px; opacity: .88; }
.sun-meter>strong { position: static; grid-column: 2; align-self: end; font-size: 25px; line-height: 1; color: #dffdec; text-shadow: none; }
.sun-meter small { position: static; grid-column: 2; align-self: start; font-size: 7px; line-height: 1.3; margin-top: 5px; letter-spacing: .7px; color: #a4cbc8; text-shadow: none; }
.turbo-ring { width: 50px; height: 50px; left: 9px; top: 6px; border-color: #a5ebd226; animation: none; }
.sun-meter.pop { animation: finish-meter .6s ease-out; }
.sun-meter.pop .turbo-ring { box-shadow: 0 0 18px #a1f9da40; animation: none; }
.round-total {
  min-height: 70px; margin-top: auto; padding: 12px 12px 10px; gap: 5px;
  background: linear-gradient(120deg, #12313eed, #09232eed); border: 1px solid #cfeddf4d;
  border-radius: 9px; box-shadow: inset 0 1px #f0ffed0d; color: #f2eee0; text-shadow: none;
}
.round-total small { font-size: 8px; line-height: 1.35; font-weight: 700; color: #bdd9d3; letter-spacing: .55px; }
.round-total strong { font-size: 31px; font-weight: 800; line-height: 1; letter-spacing: -.6px; color: #fff1d7; }
.round-total>span { font-size: 10px; color: #b2cfce; }
.round-total.gain { border-color: #90d5bc88; background: linear-gradient(125deg, #204b47ef, #102f38f2); }
.round-total.gain strong, .round-total[data-outcome=gain] strong { color: #c9ffe4; }
.round-total:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) { animation: none; box-shadow: inset 0 1px #f0ffed0d; }
.round-total.win-pulse { animation: finish-meter .7s ease-out; }

/* The coral button is the one primary action. Every state stays recognisable. */
.controls {
  width: var(--stage-width); max-width: 1040px; min-height: 88px; margin: 0 auto; padding: 11px 15px;
  grid-template-columns: 177px minmax(170px, 1fr) 206px; gap: 17px;
  border: 1px solid #b7ddd17d; border-radius: 14px;
  background: linear-gradient(130deg, #174451f7, #132e43f7 62%, #174b50f5);
  box-shadow: inset 0 1px #e6ffef12, 0 9px 28px #0318214d;
}
.stake-top { min-height: 20px; margin-bottom: 7px; gap: 5px; align-items: center; }
.stake-top label { color: #d0e5dd; font-size: 8px; line-height: 1.35; font-weight: 700; letter-spacing: .4px; }
.stake-top button { min-height: 24px; padding: 4px 6px; border: 1px solid #b9ecdc38; background: #0c2734; color: #addbd1; font-size: 7px; font-weight: 700; border-radius: 4px; }
.stake-top button[aria-pressed=true] { background: #accfbd; color: #122e3b; border-color: #d1f7db; }
.stake-input { grid-template-columns: 33px 1fr 33px; gap: 5px; }
.stake-input button, .stake-input select {
  height: 38px; border: 1px solid #bedcc246; border-radius: 6px; background: #183541; color: #fff1d6;
  box-shadow: inset 0 1px #d8ffdc09; font-variant-numeric: tabular-nums;
}
.stake-input button { font-size: 22px; font-weight: 500; }
.stake-input button:hover:not(:disabled) { background: #2b5259; border-color: #aee6cb; }
.stake-input select { font-size: 19px; font-weight: 800; background: #0b2733; padding: 0 4px; }
.spin {
  min-height: 62px; padding: 10px 16px; gap: 12px; border-radius: 10px; border: 1px solid #ffdfc9;
  background: linear-gradient(160deg, #ffc8a0 0%, #ff9a84 42%, #f77787 100%);
  box-shadow: inset 0 2px #fff6de99, inset 0 -2px #c55e672b, 0 4px 0 #8a4d50, 0 7px 15px #03192344;
  color: #173440; font-size: 22px; font-weight: 900; letter-spacing: 1px;
  transform: none; animation: none !important;
}
.spin:before { inset: 4px; border: 1px solid #ffefd385; border-radius: 6px; }
.spin:after { display: block; inset: 0; z-index: -1; background: linear-gradient(115deg, transparent 15%, #fff5d749, transparent 75%); transform: translateX(-140%); animation: none; transition: transform .7s ease; }
.spin:not(:disabled):hover {
  background: linear-gradient(160deg, #ffdbb0, #ffac8c 52%, #ff8d87);
  box-shadow: inset 0 2px #fff6debd, 0 4px #8a4d50, 0 9px 22px #08182166;
  transform: translateY(-1px);
}
.spin:not(:disabled):hover:after { transform: translateX(140%); }
.spin:not(:disabled):active, .spin.tap-burst:not(.busy) {
  transform: translateY(3px); background: linear-gradient(160deg, #f1ad94, #ed9688);
  box-shadow: inset 0 2px 6px #99534e29, 0 1px #805056;
}
.spin>svg { width: 32px; height: 32px; padding: 2px; border: 1px solid #1e475c50; border-radius: 50%; stroke-width: 1.8; transition: transform .4s ease; }
.spin:not(:disabled):hover>svg { transform: rotate(45deg); }
.spin.busy, .spin[aria-busy=true] {
  opacity: 1; background: linear-gradient(135deg, #54717a, #355564); border-color: #d1ece095; color: #e0f2e7;
  box-shadow: inset 0 1px #ecffea3b, 0 3px #0b2531; transform: none;
}
.spin.busy:before { border-color: #d5ece632; }
.spin.busy:after { display: none; }
.spin.busy>svg { animation: turn 1.15s linear infinite; border-color: #deffe459; }
.spin:disabled:not(.busy) { background: linear-gradient(145deg, #849499, #627c83); color: #1a3944; border-color: #bbd5d0; box-shadow: 0 3px #1d3c46; opacity: .8; }
.primary-action, .credit-options button { position: relative; isolation: isolate; overflow: hidden; }
.control-ripple { position: absolute; left: var(--tap-x, 50%); top: var(--tap-y, 50%); z-index: 3; width: 22px; height: 22px; margin: -11px; border-radius: 50%; pointer-events: none; background: #fff8dc66; animation: finish-control-ripple .5s ease-out both; }
.secondary { gap: 5px; }
.buy-ticket {
  min-height: 43px; padding: 5px 10px; gap: 7px; border-radius: 7px; border: 1px solid #b4e0d3;
  background: linear-gradient(140deg, #adf4d9, #75d4c4); box-shadow: inset 0 1px #f0ffe29e, 0 2px #416c66;
  color: #13383f; font-size: 10px; font-weight: 850; letter-spacing: .5px;
}
.buy-ticket:hover:not(:disabled) { background: linear-gradient(140deg, #c8ffe4, #8ce9cf); box-shadow: inset 0 1px #f0ffe2, 0 2px #416c66; }
.buy-ticket svg { width: 31px; height: 31px; }
.buy-ticket small { font-size: 8px; letter-spacing: .45px; color: #365952; font-weight: 750; margin-top: 3px; }
.round-tools { gap: 8px; }
.round-tools button { min-height: 24px !important; padding: 3px 7px !important; color: #c4dfd6; font-size: 9px !important; font-weight: 700; letter-spacing: .6px; }
.round-tools button+button { border-color: #a1cebc32 !important; padding-left: 13px !important; }
.round-tools button:hover:not(:disabled) { color: #fff1d8; background: #c0f0ce0b; border-radius: 4px; }
.receipt-line {
  width: var(--stage-width); max-width: 1040px; min-height: 28px; margin: 0 auto; padding: 5px 12px; gap: 10px;
  background: #0b2635e8; border: 1px solid #a9d3c332; border-radius: 6px;
  color: #ccdfda; font-size: 9px; font-weight: 600; box-shadow: none;
}
.receipt-line b { font-size: 9px; font-weight: 850; letter-spacing: .3px; color: #f0debb; }
.receipt-line>i { margin-left: auto; font-size: 8px; font-weight: 800; color: #b3e9d6; letter-spacing: .7px; }
.receipt-line.credited { border-color: #80c7ad66; }
.receipt-line.credited b { color: #c0f5d9; }
.receipt-line:hover { background: #173d49; border-color: #a5d7c5; }
.radio-line { min-height: 26px; height: 26px; font-size: 9px; gap: 9px; }
.radio-line>span { font-size: 8px; letter-spacing: 1.3px; color: #bdeed7; }
.radio-line>i { width: 4px; height: 4px; box-shadow: none; background: #a8e9cf; }
.radio-line>b { font-size: 10px; font-weight: 500; color: #f0ebdf; }
.radio-line>em { color: #f2c3a8; font-size: 8px; }
.feature-strip { min-height: 18px; height: 18px !important; gap: 17px; font-size: 8px; letter-spacing: .6px; color: #d1ddcf; }
.feature-strip>span { font-size: 7px; }
.feature-strip>i { background: #b5d6c6; }
.feature-strip button { min-height: 22px; font-size: 8px !important; color: #bcf0dc; font-weight: 750; letter-spacing: .2px; }
.feature-strip button:hover { color: #fff0d7; }
.fineprint { min-height: 10px; font-size: 7px; letter-spacing: .15px; color: #b7c9c2; gap: 13px; }
.mode-banner { top: 91px; max-width: 88%; padding: 5px 10px; border: 1px solid #fff0cc; border-radius: 5px; background: #eed6a8; color: #173643; font-size: 8px; font-weight: 800; box-shadow: 0 3px 14px #06263188; }
.preview-mode .round-total { border-color: #e7c29477; }
.preview-mode .balance small:after { font-size: 7px; letter-spacing: .25px; color: #f4d6a9; }
.preview-mode #round-label { color: #e2cfa9; }
.preview-mode #net { color: #d5c8b1; }

/* Paid matches have a short, local ceremony. Neutral outcomes remain quiet. */
.board-message {
  padding: 25px; gap: 0; background: radial-gradient(ellipse at 50% 40%, #27554ef4, #081f2aF5 76%);
  backdrop-filter: blur(8px); animation: finish-arrive .35s ease-out both;
}
.board-message:before {
  inset: 10%; border: 1px solid #eccd964d; border-radius: 50%; background: none;
  box-shadow: 0 0 0 22px #dfbb6908, 0 0 0 44px #dfbb6905; mask-image: none; animation: none;
}
.board-message:after { content: ''; position: absolute; inset: 15px; border: 1px solid #d8e5c621; border-radius: 8px; pointer-events: none; }
.board-message small { font-size: 10px; letter-spacing: 3px; font-weight: 800; color: #c1e2d2; }
.board-message strong { font: clamp(45px, 7vw, 96px)/1.16 var(--finish-display); color: #fff0c8; text-shadow: 0 3px #ba946855, 0 10px 30px #081b20b3; letter-spacing: 1px; margin: 5px 0; }
.board-message span { font-size: 11px; line-height: 1.5; color: #b9e7d3; letter-spacing: .6px; }
.board-message[data-kind=info]:before { display: none; }
.board-message[data-kind=info] { background: #102f3ef2; }
.board-message .result-medallion { width: 70px; height: 70px; margin-bottom: 10px; }
.board-message .result-medallion svg { width: 100%; height: 100%; filter: drop-shadow(0 3px 9px #d8e5a321); }
.win-continue { min-height: 40px; padding: 10px 22px; margin-top: 20px; border-radius: 6px; border: 1px solid #d4edcf; background: #c7e4cc; color: #163b42; font-size: 9px; font-weight: 900; letter-spacing: 1.25px; }
.win-continue:hover { background: #e0efd9; }
.win-float { padding: 7px 16px; border: 1px solid #e5f5d8; background: #c4e4d0; color: #173841; border-radius: 7px; font-size: 25px; box-shadow: 0 5px 20px #00161f66; }
.confetti { border-radius: 1px; opacity: .85; }

/* Dialogs share the same adult, nocturnal material palette as the cabinet. */
dialog {
  width: min(700px, calc(100% - 28px)); max-height: calc(100svh - 28px);
  padding: 28px; border: 1px solid #b8d8cb80; border-radius: 18px;
  background: radial-gradient(ellipse at 20% 0, #2c586155, transparent 48%), linear-gradient(145deg, #163641, #0c2532 75%);
  color: #e4eade; color-scheme: dark; box-shadow: inset 0 1px #eaffdf20, 0 30px 110px #000f1bba;
  scrollbar-width: thin; scrollbar-color: #769b91 #0e2935; overscroll-behavior: contain;
}
dialog[open] { animation: finish-dialog-in .25s cubic-bezier(.2,.8,.3,1) both; }
dialog::backdrop { background: #02141bcc; backdrop-filter: blur(8px) saturate(.7); }
dialog h2 { font: 32px/1 var(--finish-display); letter-spacing: 1.4px; color: #fff1d4; }
dialog h3 { color: #f0e5c8; font-size: 17px; line-height: 1.25; font-weight: 800; }
dialog p, dialog li { font-size: 12px; line-height: 1.65; color: #bed4cd; }
dialog p b, dialog li b { color: #ecf3e4; }
.dialog-top { align-items: center; gap: 16px; padding-bottom: 8px; }
.dialog-top .icon-button, .dialog-close {
  width: 36px; height: 36px; min-width: 36px; display: grid; place-items: center; padding: 0;
  border: 1px solid #bfdfd23d; border-radius: 8px; background: #12333f; color: #e5ecdb;
  font-size: 24px; line-height: 1; font-weight: 500; box-shadow: none;
}
.dialog-close { right: 15px; top: 15px; z-index: 5; }
.dialog-close:hover, .dialog-top .icon-button:hover { color: #fff5dc; background: #31505a; border-color: #b8dace; }
.eyebrow { color: #a8d2c6; font-size: 8px; font-weight: 750; letter-spacing: 2.2px; }
.dialog-subtitle { color: #bfd4cb; font-size: 12px !important; line-height: 1.6; }
.primary-action {
  min-height: 47px; padding: 12px 15px; border: 1px solid #ffdcc0; border-radius: 8px;
  background: linear-gradient(145deg, #ffc6a3, #f79387); color: #17333f;
  font-size: 12px; line-height: 1.3; font-weight: 900; letter-spacing: .9px;
  box-shadow: inset 0 1px #fff6df7c, 0 3px #815252; margin: 14px 0 10px;
}
.primary-action:hover:not(:disabled) { background: linear-gradient(145deg, #ffdbaf, #ffab8e); box-shadow: inset 0 1px #fff7e3, 0 3px #815252, 0 5px 16px #0217214d; }
.primary-action:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 1px #815252; }
.primary-action:disabled { background: #78918e; border-color: #a9c3b9; color: #17343e; box-shadow: none; opacity: .58; }
.cancel-buy { min-height: 41px; margin-top: 8px; border-radius: 7px; border: 1px solid #abc6b83b; background: transparent; color: #bfdacf; font-size: 10px; font-weight: 750; letter-spacing: .7px; }
.cancel-buy:hover { background: #e5ffe909; border-color: #b5d7c57d; }
.text-action { min-height: 40px; padding: 10px 12px; color: #a6d8c7; font-size: 11px; font-weight: 600; text-underline-offset: 4px; text-decoration-color: #a6d8c744; }
.text-action:hover { color: #fff0d4; }
.dialog-error { color: #ffc0a9 !important; font-size: 11px !important; line-height: 1.5; margin: 4px 0 0; }
.dialog-error:empty { display: none; }

#buy-dialog { width: min(690px, calc(100% - 28px)); max-width: 690px; padding: 27px; }
.purchase-dialog h2 { margin: 15px 0 8px; font-size: 36px; letter-spacing: 1.4px; color: #fff1d4; }
#buy-dialog>.eyebrow { display: block; padding-right: 31px; text-align: left; }
#buy-dialog h2, #buy-dialog>.dialog-subtitle { text-align: left; }
.super-ticket #buy-title { color: #f2d5a2; }
.bonus-choices { margin: 19px 0 16px; gap: 13px; }
.bonus-choices>button {
  position: relative; padding: 0 0 13px; border: 1px solid #8fbaab5c; border-radius: 11px;
  background: #0b2632; color: #e8efdf; box-shadow: inset 0 0 0 1px #b6dcc708;
}
.bonus-choices>button:hover { border-color: #b7e0cba1; background: #163b43; transform: translateY(-2px); }
.bonus-choices>button[aria-pressed=true] {
  border: 1px solid #b2e2cb; background: #20483f; box-shadow: 0 0 0 2px #a1dcc420, inset 0 -1px #c2f4d621;
}
.bonus-choices>button[data-bonus-choice=super][aria-pressed=true] { background: #3a3b32; border-color: #e4c796; box-shadow: 0 0 0 2px #e9c8981f; }
.bonus-choices>button:after {
  content: ''; position: absolute; top: 11px; right: 11px; width: 18px; height: 18px;
  border: 1px solid #f2efd79c; border-radius: 50%; background: #122f34bd; box-shadow: 0 1px 5px #0017264d;
}
.bonus-choices>button[aria-pressed=true]:after { content: '✓'; display: grid; place-items: center; font-size: 12px; font-weight: 900; background: #c8eed4; color: #183b40; border-color: #edffe4; }
.choice-art { height: 149px; padding: 15px; background-image: linear-gradient(90deg, #08243378, transparent 78%), linear-gradient(0deg, #07252d70, transparent 62%), url('assets/neon-boulevard-v9.webp'); background-size: 100% 100%, 100% 100%, auto 190%; background-position: center, center, 100% 100%; color: #fff2d9; }
.choice-art b { font: italic 28px/.95 var(--finish-display); text-shadow: 2px 3px #9c4d66; letter-spacing: .4px; }
.choice-art em { bottom: 13px; left: 15px; font: italic 64px/.88 var(--finish-display); color: #fff0d2; text-shadow: 2px 3px #27464a; }
.bonus-choices>button[data-bonus-choice=super] .choice-art { background-image: linear-gradient(90deg, #28262678, transparent 80%), linear-gradient(0deg, #0c233961, transparent 62%), url('assets/getaway-v9.webp'); background-size: 100% 100%, 100% 100%, auto 185%; background-position: center, center, 84% 100%; }
.bonus-choices>button[data-bonus-choice=super] .choice-art b { font-size: 23px; color: #ffe3ac; text-shadow: 2px 3px #714e51; }
.bonus-choices>button[data-bonus-choice=super] .choice-art em { color: #ffe1a6; }
.bonus-choices strong { font-size: 12px; font-weight: 800; margin: 12px 13px 0; color: #f2eddb; }
.bonus-choices small { font-size: 10px; line-height: 1.4; margin: 5px 13px 0; color: #b7d2c6; }
.purchase-facts { display: grid; grid-template-columns: 1fr 1fr 1.1fr; background: #07232ea6; border: 1px solid #b8d8c626; border-radius: 9px; padding: 14px 0; margin: 16px 0 12px; }
.purchase-facts>div { flex-direction: column; justify-content: center; align-items: flex-start; gap: 6px; padding: 0 14px; border: 0; border-right: 1px solid #a7ceba21; font-size: 10px; line-height: 1.4; color: #aac8bd; }
.purchase-facts>div:last-child { border-right: 0; }
.purchase-facts b { font-size: 21px; font-weight: 800; line-height: 1.15; color: #edf0dc; font-variant-numeric: tabular-nums; letter-spacing: -.25px; }
.purchase-facts div:nth-child(2) b { font-size: 25px; color: #ffceb1; }
.purchase-facts #buy-after { font-size: 20px; }
.purchase-note { text-align: left; color: #b6c5b9; font-size: 10px !important; line-height: 1.6; margin: 12px 0 14px; }
#confirm-buy { min-height: 48px; font-size: 12px; }

#wallet-dialog { max-width: 460px; padding: 30px; }
#wallet-dialog h2 { font-size: 30px; }
#wallet-dialog>.eyebrow { display: block; margin-top: 4px; }
.wallet-hero { width: 84px; height: 84px; margin: 21px auto; border: 1px solid #b7dec78c; border-radius: 22px; transform: rotate(-7deg); background: linear-gradient(135deg, #5b908671, #14343f); box-shadow: inset 0 1px #e8ffe833, 5px 7px 0 #071f2b55; }
.wallet-hero svg { width: 37px; height: 37px; stroke: #e1f6db; transform: rotate(7deg); stroke-width: 1.4; }
.credit-options { gap: 9px; margin-top: 23px; }
.credit-options button { min-height: 58px; padding: 10px 3px; border: 1px solid #c0dec081; border-radius: 8px; background: linear-gradient(145deg, #b4d5bd, #92bca9); color: #193b3f; font-size: 15px; font-weight: 850; box-shadow: inset 0 1px #f1ffe44d, 0 3px #315951; }
.credit-options button:hover { background: #d2e7c8; border-color: #e1f8d3; }
#wallet-dialog>p:not(.dialog-subtitle) { margin: 21px 0 4px; font-size: 11px; color: #adc6bc; }

#sound-dialog { width: min(500px, calc(100% - 28px)); max-width: 500px; padding: 27px; }
#sound-dialog>p { margin: 8px 0 24px; font-size: 12px; color: #bdd1c7; }
#sound-dialog>label { margin: 19px 0; font-size: 12px; color: #e6ebd8; font-weight: 700; }
#sound-dialog output { color: #c7e6ce; font-size: 12px; font-variant-numeric: tabular-nums; }
#sound-dialog input[type=range] { appearance: none; height: 5px; margin: 16px 0 20px; background: #48736a; border-radius: 20px; cursor: pointer; accent-color: #cbefcf; }
#sound-dialog input[type=range]::-webkit-slider-thumb { appearance: none; width: 20px; height: 20px; border: 1px solid #fff2cc; border-radius: 50%; background: #d3eac9; box-shadow: 0 2px 8px #041a2b66; }
#sound-dialog input[type=range]::-moz-range-thumb { width: 18px; height: 18px; border: 1px solid #fff2cc; border-radius: 50%; background: #d3eac9; box-shadow: 0 2px 8px #041a2b66; }
.settings-toggles { margin-top: 27px; border-top: 1px solid #b2cfbb32; }
.settings-toggles>label { min-height: 62px; padding: 12px 0; border-bottom: 1px solid #b2cfbb26; gap: 15px; }
.settings-toggles b { font-size: 12px; line-height: 1.35; font-weight: 750; color: #e4ebd9; }
.settings-toggles small { margin-top: 4px; font-size: 10px; line-height: 1.45; color: #acc8bb; }
.settings-toggles input { display: block; margin: 0; width: 43px; height: 25px; flex-basis: 43px; border: 1px solid #a6c6b566; background: #234553; }
.settings-toggles input:before { background: #d4dfd0; width: 17px; height: 17px; top: 3px; left: 3px; box-shadow: 0 2px 3px #031f2a33; }
.settings-toggles input:checked { background: #aed8be; border-color: #daf3cf; }
.settings-toggles input:checked:before { transform: translateX(18px); background: #1d4a4b; }
.settings-links { margin-top: 21px; grid-template-columns: 1fr 1fr; gap: 9px; }
.settings-links button, .settings-links button+button { min-height: 42px; padding: 8px; border: 1px solid #c0ddc346; border-radius: 6px; background: #183b45; color: #cce7cf; font-size: 9px; line-height: 1.4; letter-spacing: .4px; }
.settings-links button:hover { background: #315851; border-color: #bcd9bc8c; }

/* Illustrated rules use the actual original symbol art and the same material system. */
#rules { width: min(820px, calc(100% - 28px)); max-width: 820px; padding: 28px; }
.rules-lead { margin: 7px 0 14px; color: #c1d9cb; }
.visual-guide { color: #d6e7d7; margin-top: 23px; }
.guide-kicker { margin: 28px 0 12px; color: #9cd6bf; font-size: 8px; font-weight: 800; letter-spacing: 2px; }
.visual-guide h3 { margin: 0 0 20px; color: #fff0d4; font-size: 27px; line-height: 1.16; letter-spacing: -.3px; }
.guide-match { gap: 24px; }
.guide-grid { gap: 4px; padding: 9px; background: radial-gradient(ellipse at top, #284f57, #102d3c); border: 3px solid #9fcabd; border-radius: 11px; box-shadow: 0 3px #0a202b; }
.guide-cell { background: #d2ffe70a; border-color: #d6ffed0a; border-radius: 5px; }
.guide-cell svg { opacity: .5; }
.guide-cell.lit { background: #acdcb51e; border-color: #b8efce; box-shadow: inset 0 0 10px #bbffdc12; }
.guide-cell.lit svg { opacity: 1; filter: drop-shadow(0 2px 3px #07253399); }
.guide-cell i { border-radius: 4px 0 3px 0; background: #d0ecd0; color: #183d42; font-family: var(--finish-body); }
.guide-match-copy>strong { font-size: 23px; font-weight: 850; color: #f6ecd5; }
.guide-match-copy>b { color: #afd9bc; font-size: 18px; }
.guide-match-copy p { color: #b9d0c2; font-size: 11px; line-height: 1.6; }
.guide-flow { margin-top: 26px; padding: 17px 12px; background: #092430a3; border: 1px solid #add0b526; border-radius: 10px; }
.guide-flow>i { color: #9ad8bd; font-size: 22px; }
.guide-flow strong { color: #e7edda; font-size: 12px; }
.guide-flow small { color: #abc8b8; font-size: 9px; }
.flow-pic { background: #183e47; border: 1px solid #a9d4b428; border-radius: 9px; }
.flow-pic>b { background: #c4e6c8; color: #173b40; }
.cascade-pic em { color: #f1baa2; }
.cascade-pic>b { background: transparent; color: #bedcc2; }
.guide-equation { padding: 21px 4px; gap: 9px; }
.guide-equation>span { color: #b9d5c3; font-size: 10px; }
.guide-equation b { color: #edf0d8; font-size: 30px; font-weight: 800; }
.guide-equation i { color: #77a997; font-size: 23px; }
.guide-equation .equation-result { padding: 9px 3px; border: 1px solid #afd2b55c; background: #315248; border-radius: 8px; }
.guide-wallet { background: #163c3e; border-color: #a8cdb45c; border-radius: 9px; padding: 16px; }
.guide-wallet svg { stroke: #bce2c2; }
.guide-wallet span { color: #d4e4cc; }
.guide-wallet b { color: #e6efd8; }
.guide-wallet small { color: #a9cbb6; }
.guide-bonuses { gap: 14px; }
.guide-bonus { background: #102f39; border-color: #a4c7ae50; border-radius: 10px; }
.guide-bonus-art { height: 147px; background-image: linear-gradient(90deg, #08232e90, transparent), url('assets/neon-boulevard-v9.webp'); background-size: 100% 100%, auto 190%; background-position: center, 100% 100%; }
.guide-bonus-art>span { font-size: 23px; color: #fff0d3; text-shadow: 2px 2px #a15c6d; }
.guide-bonus-art>b { color: #fff0d3; text-shadow: 2px 3px #233d47; }
.super .guide-bonus-art>span, .super .guide-bonus-art>b { color: #f8d99f; }
.super .guide-bonus-art { background-image: linear-gradient(90deg, #30293180, transparent), url('assets/getaway-v9.webp'); background-size: 100% 100%, auto 185%; background-position: center, 84% 100%; }
.guide-bonus-copy { padding: 14px; }
.guide-bonus-copy p { color: #c8dbca; font-size: 11px; line-height: 1.5; }
.guide-bonus-copy p>b { color: #e1e9d5; }
.guide-bonus-copy p>span { color: #a7c6b5; }
.guide-bonus-copy>strong { font-size: 11px; line-height: 1.5; color: #d3e5cc; }
.guide-bonus-copy>small { color: #9ec0ad; font-size: 10px; }
.guide-bonus-copy button { min-height: 39px; border: 1px solid #b1d4b35c; background: #275247; color: #d6edcf; border-radius: 5px; font-size: 9px; }
.super .guide-bonus-copy button { color: #ecdfbe; background: #454b3d; border-color: #d5bf8561; }
.guide-bonus-copy button:hover { background: #3c6957; }
.guide-caution { color: #aac1ae; font-size: 10px !important; }
.guide-credit>div { padding: 16px; border-color: #b3cfa638; background: #173e3e; border-radius: 8px; }
.guide-credit>div+div { background: #393d33; border-color: #d4c79838; }
.guide-credit span { color: #accbb0; font-size: 8px; letter-spacing: 1.1px; }
.guide-credit b { color: #e6edcf; font-size: 12px; }
.guide-credit small { color: #b4c7ae; font-size: 9px; line-height: 1.5; }
.full-rules { border-top-color: #b7d3b833; margin-top: 24px; padding-top: 14px; }
.full-rules summary { color: #e1ead2; font-size: 13px; min-height: 44px; line-height: 1.5; }
.full-rules p, .full-rules li { color: #b9cdbc; }
.full-rules .primary-action { margin: 20px 0; }
.rule-options { border-top-color: #b9cdae35; margin-top: 22px; padding-top: 12px; font-size: 11px; color: #b9c9b3; }
.rule-options input { accent-color: #a6d4b3; width: 18px; height: 18px; }
.rule-options>span { font-size: 10px; color: #a3bba5; line-height: 1.5; }
.economy-picture { border: 1px solid #b3c5ad40; border-radius: 10px; background: #102e39; }
dialog table { color: #d6e1ca; font-size: 12px; border-spacing: 0; font-variant-numeric: tabular-nums; }
dialog th { font-size: 9px; letter-spacing: .5px; font-weight: 800; color: #9cc4af; background: #0a26319c; }
dialog td, dialog th { padding: 11px 9px; border-bottom: 1px solid #a7c3a626; }
dialog tbody tr:nth-child(even) { background: #9bd8b404; }
dialog td:first-child { color: #d8e4cd; font-weight: 700; }
dialog td svg { width: 38px; height: 38px; }

#history-dialog { width: min(680px, calc(100% - 28px)); }
#history-dialog h2 { font-size: 30px; }
#history-dialog>p { font-size: 11px; color: #b2c9bb; }
#view-receipt { padding: 17px; margin: 18px 0 12px; border: 1px solid #a7cfb54f; border-radius: 9px; background: linear-gradient(120deg, #24504180, #12323d); font-weight: 750; color: #e1edd2 !important; line-height: 1.6; font-size: 13px !important; }
.history-wrap { border: 1px solid #9ec2a433; border-radius: 9px; margin-top: 20px; }
.history-wrap th { padding: 13px 8px; font-size: 9px; letter-spacing: .3px; }
.history-wrap td { padding: 12px 8px; font-size: 12px; color: #e0e7ce; }
.history-wrap td:first-child { display: table-cell; font-size: 11px; font-weight: 600; color: #afd2b9; }
.history-wrap tr:last-child td { border-bottom: 0; }
#history-empty { padding: 16px 0; text-align: center; color: #bcd0b9; }

/* A bonus closeout is honest about cost and net result. Only profit is celebrated. */
#bonus-result {
  width: min(490px, calc(100% - 28px)); max-width: 490px; padding: 30px; text-align: center;
  background: radial-gradient(ellipse at 50% 0, #497f6b33, transparent 48%), linear-gradient(145deg, #173d47, #0b2633 80%);
}
.result-visual { position: relative; width: 100px; height: 100px; margin: 0 auto 18px; display: grid; place-items: center; }
.result-visual>svg { width: 86px; height: 86px; position: relative; z-index: 1; filter: saturate(.6); opacity: .84; }
.result-orbit { position: absolute; inset: 5px; border: 1px solid #b4d2b34d; border-radius: 50%; box-shadow: 0 0 0 8px #adc7a607; }
#bonus-result .eyebrow { display: block; margin: 0 0 12px; font-size: 8px; letter-spacing: 2px; }
#bonus-result h2 { font-size: 33px; line-height: 1.08; color: #eef0d6; }
#result-amount { display: block; margin: 17px 0 8px; font-size: clamp(39px, 8vw, 58px); font-weight: 850; line-height: 1; color: #ebeed8; letter-spacing: -1.7px; font-variant-numeric: tabular-nums; }
#result-caption { color: #b6cdbb; font-size: 12px; line-height: 1.6; margin: 12px auto 19px; max-width: 340px; }
.result-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 15px 0; margin: 21px 0; border: 1px solid #b1cda52d; background: #071f2ca6; border-radius: 9px; }
.result-facts>div { display: flex; flex-direction: column; gap: 7px; padding: 0 10px; min-width: 0; border-right: 1px solid #b7cfb121; }
.result-facts>div:last-child { border-right: 0; }
.result-facts span, .result-facts small { font-size: 9px; line-height: 1.3; color: #a8c3ab; }
.result-facts b, .result-facts strong { font-size: 17px; line-height: 1.1; color: #e6ecd3; font-variant-numeric: tabular-nums; font-weight: 800; }
.result-note { margin: 16px 0 0; color: #9dbba5; font-size: 10px !important; line-height: 1.5; }
#bonus-result[data-outcome=gain] { border-color: #d9ddac9e; background: radial-gradient(ellipse at 50% 12%, #5e845f5e, transparent 57%), linear-gradient(145deg, #1d4b46, #0b2833 80%); }
#bonus-result[data-outcome=gain] .result-visual>svg { opacity: 1; filter: saturate(1.04) drop-shadow(0 0 15px #d8de9f3b); animation: finish-result-object .9s ease-out both; }
#bonus-result[data-outcome=gain] .result-orbit { border-color: #e7dc9c88; box-shadow: 0 0 0 9px #cfdf9c09, 0 0 0 18px #cfdf9c04; }
#bonus-result[data-outcome=gain] #result-amount { color: #f9e7ac; text-shadow: 0 3px #bc906529, 0 0 30px #e3d69b18; }
#bonus-result[data-outcome=gain] #result-kicker { color: #cae7b1; }
#bonus-result:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) .result-visual>svg,
#bonus-result:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) .result-orbit { animation: none; }
#bonus-result[data-outcome=preview] .result-orbit { border-style: dashed; border-color: #d8c29578; }

/* The same original city art supplies the episode title sequence. */
.pursuit-hud { height: 27px; min-height: 27px; margin-bottom: 5px; padding: 4px 9px; border: 1px solid #b9ded054; border-radius: 6px; background: #102e3cef; font-size: 9px; color: #b3e1cd; letter-spacing: .7px; }
.pursuit-hud>span { font-size: 8px; }
.pursuit-hud>span>i { width: 4px; height: 4px; background: #eab7a1; box-shadow: none; }
.pursuit-hud>b { font-size: 10px; letter-spacing: .6px; color: #fff0d5; }
.pursuit-road { border-bottom-color: #accfbd55; }
.pursuit-road>.runner { background: #efb9a0; box-shadow: -4px 0 10px #f3b67c28; }
.pursuit-road>.pursuer { background: linear-gradient(90deg, #8baed8 45%, #dc7f8e 55%); box-shadow: none; }
.pursuit-road:after { color: #e1d1ad; }
[data-pursuit-phase=arrival] .pursuit-hud { border-color: #dbd19b79; }
.bonus-active .board { background-image: linear-gradient(90deg, #dfdcff08 1px, transparent 1px), linear-gradient(#dfdcff07 1px, transparent 1px), radial-gradient(ellipse at 48% -20%, #4c6570, #233c53 48%, #173047); }
.bonus-active .board-shell { border-color: #bfd5d0; box-shadow: 0 0 0 1px #f4d8c6, 0 0 0 3px #4d515b, 0 18px 35px #07152688; }
.super-active .board-shell { border-color: #d9c79d; box-shadow: 0 0 0 1px #f2e8c9, 0 0 0 3px #5a6155, 0 18px 35px #07152688; }
.bonus-active .feature-rail .bonus-sign { background: linear-gradient(135deg, #f0bea6, #d99aaa) !important; }
.super-active .feature-rail .bonus-sign { background: linear-gradient(135deg, #f3dbab, #cfb783) !important; }
.getaway-cinematic { background: #0a2532; color: #fff0d5; }
.getaway-cinematic:after { background: linear-gradient(90deg, #071e2cE8, #0b253461 55%, transparent), linear-gradient(0deg, #051d2acc, transparent 70%); }
.getaway-video { filter: saturate(1.02); }
.cinematic-copy { width: 51%; max-width: 580px; margin-left: max(6.4vw, 28px); animation: finish-title-in .8s cubic-bezier(.16,.75,.2,1) both; }
.episode-tag { font-size: 9px; letter-spacing: 2.4px; color: #d1ead3; font-weight: 800; }
.cinematic-copy p { font: italic 19px/1.45 Georgia, serif; color: #f5d0b4; margin: 27px 0 24px; }
.cinematic-copy h2 { font: italic clamp(74px, 10.8vw, 155px)/.82 var(--finish-display); letter-spacing: -1px; transform: rotate(-4deg); color: #fff0d3; text-shadow: 3px 4px #b56776, 6px 8px #123345; margin: 25px 0 30px; }
.cinematic-copy h2 span { color: #f6ad99; }
.cinematic-copy>b { margin-top: 38px; font-size: 10px; line-height: 1.6; letter-spacing: 2px; color: #c2e8cf; }
.cinematic-copy button { margin-top: 27px; min-width: 240px; min-height: 48px; padding: 14px 21px; border: 1px solid #fff0cd; border-radius: 6px; background: linear-gradient(145deg, #f6d3ad, #edb298); color: #123441; font-size: 11px; font-weight: 900; letter-spacing: 1.1px; box-shadow: 0 4px #986559; transform: none; }
.cinematic-copy button:hover { background: #ffe1b6; transform: translateY(-1px); }
.cinematic-copy button>span { font-size: 19px; margin-left: 30px; }
.getaway-cinematic .cinematic-copy small { margin-top: 19px; max-width: 360px; color: #b7d1c6; font-size: 9px; line-height: 1.6; }
.cinematic-sweep { opacity: .35; animation-duration: 11s; }
.cinematic-police { opacity: .45; }
.cinematic-police i { animation-duration: 7s; }
.cinematic-chapter { position: absolute; right: 6.5%; top: 8%; display: flex; align-items: center; gap: 13px; padding: 12px 17px; border-top: 1px solid #e7e2bc80; border-bottom: 1px solid #e7e2bc3d; background: #0c263238; backdrop-filter: blur(7px); }
.cinematic-chapter-number { font: 39px/1 var(--finish-display); color: #ffe1b7; }
.cinematic-chapter-copy { max-width: 150px; font-size: 10px; line-height: 1.55; font-weight: 750; text-transform: uppercase; letter-spacing: 1.8px; color: #f0efd4; }
.cinematic-timeline { position: absolute; right: 6.5%; bottom: 8%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; width: min(34vw, 420px); }
.cinematic-beat { position: relative; padding: 14px 0 0; border-top: 2px solid #cbe0c947; color: #c6d5c18c; font-size: 8px; line-height: 1.5; letter-spacing: 1px; text-transform: uppercase; transition: color .5s ease, border-color .5s ease; }
.cinematic-beat[data-active=true] { border-top-color: #f7d5aa; color: #f3edd1; }
.cinematic-beat:before { content: ''; position: absolute; top: -2px; left: 0; width: 100%; height: 2px; background: #f9d7ae; transform: scaleX(var(--beat-progress, 0)); transform-origin: left; }
.cinematic-beat[data-complete=true] { color: #cce2c8; border-top-color: #cce2c87d; }
.cinematic-skip, #skip-getaway {
  position: absolute; right: 6.5%; bottom: 18%; min-height: 38px; padding: 9px 13px;
  border: 1px solid #d7e2c747; border-radius: 5px; background: #102e3b91; color: #e2e9cc;
  font-size: 9px; letter-spacing: .7px; font-weight: 700; box-shadow: none; backdrop-filter: blur(5px);
}
.cinematic-skip:hover { background: #294751e0; border-color: #e2e8c896; }
.getaway-cinematic[data-phase=arrival] .cinematic-chapter { border-top-color: #c7efd1; }

/* Motion stays local and below rapid-flash frequencies. */
@keyframes finish-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes finish-dialog-in { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes finish-title-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes finish-match-outline { from { opacity: .25; transform: scale(.95); } to { opacity: 1; transform: scale(1); } }
@keyframes finish-object-lift { 0%,100% { transform: translateY(0) scale(1); } 45% { transform: translateY(-4px) scale(1.045); } }
@keyframes finish-tape { 0%,100% { transform: rotate(0) scale(1); } 35% { transform: rotate(-5deg) scale(1.07); } 70% { transform: rotate(2deg) scale(1.02); } }
@keyframes finish-lighter { 0%,100% { transform: translateY(0) rotate(0); } 38% { transform: translateY(-5px) rotate(6deg); } 72% { transform: translateY(-1px) rotate(-2deg); } }
@keyframes finish-watch { 0%,100% { transform: rotate(0) scale(1); } 42% { transform: rotate(-7deg) scale(1.09); } 78% { transform: rotate(2deg) scale(1.02); } }
@keyframes finish-gem { 0%,100% { transform: rotateY(0) rotate(0); } 40% { transform: rotateY(24deg) rotate(4deg) scale(1.08); } 75% { transform: rotateY(-7deg) rotate(-1deg) scale(1.03); } }
@keyframes finish-diamond { 0%,100% { transform: translateY(0) scale(1); } 43% { transform: translateY(-4px) rotate(-4deg) scale(1.08); } 78% { transform: translateY(-1px) rotate(1deg) scale(1.02); } }
@keyframes finish-boat { 0%,100% { transform: rotate(0) translateY(0); } 28% { transform: rotate(-5deg) translateY(-3px); } 63% { transform: rotate(3deg) translateY(1px); } 83% { transform: rotate(-1deg) translateY(-1px); } }
@keyframes finish-car { 0%,100% { transform: translateX(0) rotate(0); } 20% { transform: translateX(-3px) rotate(-2deg); } 52% { transform: translateX(4px) rotate(2deg) scale(1.035); } 80% { transform: translateX(1px) rotate(0); } }
@keyframes finish-jewel-shine { 0% { opacity: 0; transform: translateX(-10px) rotate(28deg); } 40% { opacity: .75; } 100% { opacity: 0; transform: translateX(26px) rotate(28deg); } }
@keyframes finish-cascade { 0%,100% { filter: none; } 45% { filter: brightness(1.09); } }
@keyframes finish-meter { 0%,100% { transform: scale(1); } 42% { transform: scale(1.045); } 75% { transform: scale(.995); } }
@keyframes finish-result-object { from { transform: translateY(12px) rotate(-9deg) scale(.88); opacity: 0; } to { transform: translateY(0) rotate(0) scale(1); opacity: 1; } }
@keyframes finish-control-ripple { from { opacity: .55; transform: scale(.3); } to { opacity: 0; transform: scale(15); } }

/* Compact laptops. */
@media (min-width: 701px) and (max-height: 760px) {
  .game { padding-top: 12px; padding-bottom: 8px; gap: 6px; }
  .topbar { min-height: 66px; }
  .feature-rail { gap: 8px !important; padding-top: 25px !important; }
  .getaway-poster { flex-basis: 76px; max-height: 88px; }
  .feature-rail .bonus-sign { min-height: 82px !important; height: 82px; }
  .rail-heading { font-size: 33px; }
  .rail-heading>span { font-size: 7px; margin-bottom: 7px; }
  .rail-heading>em { font-size: 10px; margin-top: 7px; }
  .round-total { min-height: 73px; padding: 10px 11px; }
  .controls { min-height: 84px; padding-block: 9px; }
  .spin { min-height: 61px; }
  .fineprint { font-size: 7px; }
}
@media (min-width: 701px) and (max-width: 1050px) {
  .game { padding-inline: 20px; }
  .arena, .controls, .receipt-line { width: min(100%, var(--stage-width)); }
  .arena { grid-template-columns: minmax(0,1fr) 190px; gap: 18px; }
  .episode { display: none; }
  .controls { grid-template-columns: 170px minmax(150px,1fr) 190px; gap: 13px; padding-inline: 13px; }
  .spin { font-size: 20px; gap: 8px; }
  .rail-heading { font-size: 32px; }
  .marquee:before { display: none; }
}

/* Portrait phones: the cabinet, dashboard and controls fit a single viewport. */
@media (max-width: 700px) {
  .game { --stage-width: 100%; max-width: 540px; height: 100svh; min-height: 0; padding: max(9px, env(safe-area-inset-top)) 11px max(8px, env(safe-area-inset-bottom)); gap: 6px; }
  .backdrop:before { background-position: 35% center; }
  .stage-glow { background: linear-gradient(180deg, #051b252e, #061c2330 34%, #071f29ac 89%); }
  .topbar { min-height: 64px; gap: 9px; }
  .brand span { font-size: 13px; letter-spacing: 2.25px; }
  .brand strong { font-size: 39px; letter-spacing: 2px; text-shadow: 0 2px #ae6670, 0 4px #163641; }
  .brand small { max-width: 104px; font-size: 5.5px; letter-spacing: .3px; margin-top: 7px; line-height: 1.35; }
  .episode { display: none; }
  .top-actions { gap: 5px; }
  .top-actions .icon-button { width: 35px; height: 40px; border-radius: 9px; }
  .top-actions .icon-button svg { width: 18px; height: 18px; }
  .top-actions #info { display: none; }
  .top-actions #audio-settings { display: grid; }
  .top-actions .balance { min-width: 127px; gap: 7px; padding: 8px !important; border-radius: 9px; }
  .balance small { font-size: 6.5px; letter-spacing: .7px; margin-bottom: 5px; }
  .balance strong { font-size: 20px; letter-spacing: -.55px; }
  .wallet-add { width: 26px; height: 32px; border-radius: 6px; font-size: 20px; }
  .arena { display: flex; flex-direction: column; width: 100%; gap: 7px; flex: 1; min-height: 0; }
  .cabinet { min-height: 0; height: auto; flex: 1; }
  .marquee { height: 24px; min-height: 24px; padding: 0 4px; font-size: 8px; letter-spacing: .2px; }
  .marquee:before { display: none; }
  .board-shell { border-width: 3px; border-radius: 12px; box-shadow: 0 0 0 1px #e8e5c6, 0 0 0 2px #20434d, 0 12px 25px #06142260; }
  .board-shell:before { border-radius: 7px; }
  .board { inset: 3px; border-radius: 6px; }
  .tile svg { width: 99%; height: 99%; left: .5%; top: .5%; }
  .tile.winning:after { inset: 3%; border-radius: 6px; border-width: 1px; }
  .tile .bonus-label { bottom: 5%; font-size: 7px; padding: 1px 3px; letter-spacing: .5px; }
  .tile .sun-number { font-size: 18px; padding: 2px 4px; }
  .position-mark { min-width: 14px; height: 14px; top: 4%; right: 4%; font-size: 8px; }
  .combo-panel { min-height: 38px; margin-top: 6px; padding: 4px 5px 4px 8px; gap: 5px; border-radius: 7px; }
  .combo-panel #combo-content { gap: 5px; font-size: 9px; font-weight: 600; }
  .combo-panel #combo-content>b { font-size: 23px; }
  .combo-panel button { min-height: 29px; padding: 5px 7px; font-size: 8px; letter-spacing: 0; }
  .combo-panel .match-chip { gap: 3px; padding: 2px 4px; }
  .match-chip svg { width: 23px; height: 23px; }
  .match-chip strong, .match-chip>span { font-size: 9px; }
  .cabinet-foot { min-height: 23px; padding: 6px 2px 0; font-size: 7.5px; gap: 5px; line-height: 1.4; }
  .round-counter { font-size: 7px; letter-spacing: .25px; }
  .feature-rail { display: grid; grid-template-columns: 1.04fr 66px 1fr; height: 80px; min-height: 80px; gap: 7px !important; padding: 0 !important; align-items: stretch; }
  .rail-heading, .feature-rail .getaway-poster { display: none; }
  .feature-rail .bonus-sign {
    height: 80px !important; min-height: 80px !important; padding: 6px !important;
    grid-template-columns: 29px 1fr !important; grid-template-rows: 15px 25px 20px !important; gap: 0 4px !important;
    border-radius: 8px; box-shadow: inset 0 1px #fff5db66;
  }
  .bonus-medal { width: 29px !important; height: 48px !important; }
  .bonus-sign>small { font-size: 6px !important; letter-spacing: .1px; line-height: 1.25; }
  .bonus-sign>strong { font-size: 28px !important; }
  .bonus-sign>b { font-size: 7px !important; line-height: 1.13; letter-spacing: .1px; }
  .sun-meter { display: block; position: relative; height: 80px !important; min-height: 80px; padding: 0; border-radius: 8px; text-align: center; }
  .sun-meter>svg { width: 58px; height: 58px; margin: 0 auto; opacity: .72; }
  .sun-meter>strong { position: absolute; left: 0; right: 0; top: 20px; font-size: 19px; text-shadow: 0 2px 4px #07262c; }
  .sun-meter small { position: absolute; left: 4px; right: 4px; bottom: 8px; font-size: 6.5px; line-height: 1.2; letter-spacing: .1px; margin: 0; }
  .turbo-ring { width: 48px; height: 48px; left: calc(50% - 24px); top: 5px; }
  .round-total { min-height: 80px; height: 80px; margin: 0; padding: 8px; gap: 6px; border-radius: 8px; justify-content: center; }
  .round-total small { font-size: 6.5px; line-height: 1.3; letter-spacing: .2px; }
  .round-total strong { font-size: 26px; letter-spacing: -.6px; }
  .round-total>span { font-size: 9px; line-height: 1.2; }
  .controls { width: 100%; min-height: 130px; padding: 9px; grid-template-columns: 140px minmax(0,1fr); grid-template-rows: auto auto; gap: 8px 10px; border-radius: 11px; align-items: center; }
  .stake-top { flex-direction: column; align-items: flex-start; gap: 4px; min-height: 0; margin-bottom: 5px; }
  .stake-top label { font-size: 7px; letter-spacing: .45px; line-height: 1.2; }
  .stake-top button { min-height: 22px; padding: 3px 5px; font-size: 7px; letter-spacing: 0; }
  .stake-input { grid-template-columns: 30px 1fr 30px; gap: 4px; }
  .stake-input button, .stake-input select { height: 36px; border-radius: 5px; }
  .stake-input select { font-size: 18px; padding: 0; }
  .stake-input button { font-size: 21px; }
  .spin { min-height: 74px; padding: 8px; gap: 7px; font-size: 19px; letter-spacing: .25px; border-radius: 8px; }
  .spin:before { inset: 3px; border-radius: 5px; }
  .spin>svg { width: 28px; height: 28px; }
  .secondary { grid-column: 1/-1; grid-template-columns: 1fr 85px; gap: 10px; align-items: center; }
  .buy-ticket { min-height: 43px; padding: 4px 8px; gap: 7px; font-size: 10px; border-radius: 6px; }
  .buy-ticket svg { width: 30px; height: 30px; }
  .buy-ticket small { font-size: 8px; letter-spacing: .2px; }
  .round-tools { flex-direction: column; gap: 0; }
  .round-tools button { min-height: 23px !important; font-size: 8px !important; padding: 4px !important; letter-spacing: .4px; }
  .round-tools button+button { border-left: 0 !important; border-top: 1px solid #adcaba26 !important; padding-left: 4px !important; }
  .receipt-line { width: 100%; min-height: 26px; padding: 5px 9px; font-size: 8px; gap: 6px; }
  .receipt-line b { font-size: 8px; letter-spacing: .1px; }
  .receipt-line>span { display: none; }
  .receipt-line>i { font-size: 7px; letter-spacing: .5px; }
  .radio-line { min-height: 25px; height: 25px; font-size: 8px; gap: 7px; }
  .radio-line>b { max-width: 220px; font-size: 9px; }
  .radio-line>span { font-size: 7px; }
  .radio-line>em { display: none; }
  .feature-strip { min-height: 22px; height: 22px !important; gap: 0; }
  .feature-strip>span, .feature-strip>i { display: none; }
  .feature-strip button { min-height: 25px; font-size: 8px !important; letter-spacing: .35px; padding: 4px; }
  .fineprint { min-height: 10px; font-size: 6px; gap: 9px; letter-spacing: 0; }
  .mode-banner, .bonus-active .mode-banner { top: 75px; padding: 4px 7px; font-size: 7px; border-radius: 4px; }
  .preview-mode .balance small:after { font-size: 5.6px; letter-spacing: 0; }
  .preview-mode .round-total small { font-size: 6px; }
  .preview-mode #net { font-size: 7px; }
  .pursuit-hud { height: 24px; min-height: 24px; padding: 3px 6px; font-size: 8px; letter-spacing: .2px; }
  .pursuit-hud>span { font-size: 7px; }
  .pursuit-hud>b { font-size: 8px; }
  .board-message { padding: 20px 15px; }
  .board-message strong { font-size: 54px; }
  .board-message .result-medallion { width: 57px; height: 57px; margin-bottom: 8px; }
  .board-message small { font-size: 9px; letter-spacing: 2px; }
  .board-message span { font-size: 9px; line-height: 1.5; letter-spacing: .2px; }
  .win-continue { min-height: 38px; margin-top: 17px; font-size: 9px; padding: 9px 17px; }
  .win-float { font-size: 21px; padding: 5px 13px; }
  dialog, #sound-dialog, #rules { padding: 23px 19px; border-radius: 14px; width: calc(100% - 22px); max-height: calc(100svh - 22px); }
  dialog h2 { font-size: 28px; }
  dialog p, dialog li { font-size: 11px; line-height: 1.65; }
  .dialog-top { gap: 10px; }
  .dialog-top .icon-button, .dialog-close { width: 35px; height: 35px; min-width: 35px; border-radius: 7px; }
  .dialog-close { top: 12px; right: 12px; }
  .eyebrow { font-size: 7px; letter-spacing: 1.5px; }
  .purchase-dialog#buy-dialog { width: calc(100% - 22px); padding: 23px 17px 19px; }
  #buy-dialog>.eyebrow { min-height: 18px; font-size: 6.5px; padding-right: 30px; }
  .purchase-dialog h2 { font-size: 31px; margin: 12px 0; }
  .bonus-choices { margin: 17px 0 14px; gap: 9px; }
  .bonus-choices>button { padding-bottom: 12px; border-radius: 8px; }
  .bonus-choices>button:after { top: 8px; right: 8px; width: 16px; height: 16px; font-size: 10px; }
  .choice-art { height: 120px; padding: 12px 9px; }
  .choice-art b { display: block; max-width: calc(100% - 15px); font-size: 21px; line-height: .94; white-space: normal; }
  .choice-art em { bottom: 10px; left: 10px; font-size: 49px; }
  .bonus-choices>button[data-bonus-choice=super] .choice-art b { font-size: 17px; max-width: calc(100% - 16px); }
  .bonus-choices strong { font-size: 10px; line-height: 1.4; min-height: 28px; margin: 11px 9px 0; }
  .bonus-choices small { font-size: 9px; line-height: 1.4; min-height: 25px; margin: 4px 9px 0; }
  .dialog-subtitle { font-size: 11px !important; }
  .purchase-facts { grid-template-columns: 1fr; padding: 4px 12px; margin: 13px 0 11px; }
  .purchase-facts>div { flex-direction: row; justify-content: space-between; align-items: center; gap: 15px; padding: 11px 0; border: 0; border-bottom: 1px solid #b9cda522; font-size: 10px; }
  .purchase-facts>div:last-child { border-bottom: 0; }
  .purchase-facts b, .purchase-facts #buy-after { font-size: 17px; text-align: right; }
  .purchase-facts div:nth-child(2) b { font-size: 21px; }
  .purchase-note { font-size: 9px !important; line-height: 1.6; margin-block: 12px; }
  #confirm-buy { min-height: 46px; font-size: 11px; }
  .cancel-buy { min-height: 39px; }
  .text-action { font-size: 10px; }
  #wallet-dialog { padding: 27px 20px; }
  #wallet-dialog h2 { font-size: 27px; }
  .credit-options { gap: 7px; }
  .credit-options button { min-height: 53px; font-size: 14px; }
  .settings-toggles>label { min-height: 61px; padding: 11px 0; }
  .settings-toggles b { font-size: 12px; }
  .settings-toggles small { font-size: 10px; }
  .settings-links button, .settings-links button+button { font-size: 8px; }
  .visual-guide h3 { font-size: 24px; }
  .guide-match { grid-template-columns: 1fr; gap: 17px; }
  .guide-match-copy { display: grid; grid-template-columns: 60px 1fr; column-gap: 10px; }
  .guide-match-copy>svg { grid-row: span 2; width: 55px; height: 55px; }
  .guide-match-copy>strong { align-self: end; font-size: 20px; }
  .guide-match-copy>b { font-size: 16px; }
  .guide-match-copy p { grid-column: span 2; max-width: none; margin: 9px 0 0; font-size: 11px; }
  .guide-flow { padding: 15px 6px; gap: 3px; }
  .guide-flow strong { font-size: 10px; }
  .guide-flow small { font-size: 8px; }
  .flow-pic { width: 64px; height: 58px; }
  .flow-pic svg { width: 58px; height: 58px; }
  .guide-equation { padding: 19px 0; gap: 4px; }
  .guide-equation>span { font-size: 8px; }
  .guide-equation b { font-size: 25px; }
  .guide-equation i { font-size: 20px; }
  .guide-wallet { padding: 13px; gap: 10px; }
  .guide-wallet span { font-size: 10px; }
  .guide-wallet b { display: block; font-size: 15px; }
  .guide-wallet small { font-size: 9px; }
  .guide-bonuses { gap: 9px; }
  .guide-bonus-art { height: 130px; padding: 11px; }
  .guide-bonus-art>span { font-size: 18px; }
  .super .guide-bonus-art>span { display: block; max-width: 98px; font-size: 15px; }
  .guide-bonus-art>b { left: 11px; bottom: 11px; font-size: 48px; }
  .guide-bonus-copy { padding: 10px 8px; }
  .guide-bonus-copy p { grid-template-columns: 1fr; font-size: 10px; }
  .guide-bonus-copy p>svg { width: 38px; height: 38px; grid-row: auto; }
  .guide-bonus-copy p>span { font-size: 9px; }
  .guide-bonus-copy>strong { font-size: 10px; line-height: 1.4; min-height: 40px; }
  .guide-bonus-copy>small { font-size: 9px; min-height: 29px; }
  .guide-bonus-copy button { min-height: 38px; padding: 7px 3px; font-size: 7px; letter-spacing: .1px; }
  .guide-credit { grid-template-columns: 1fr; gap: 9px; }
  .guide-credit>div { padding: 14px; }
  .guide-kicker { font-size: 7px; letter-spacing: 1.6px; }
  #history-dialog h2 { font-size: 25px; }
  #view-receipt { font-size: 12px !important; padding: 14px; }
  .history-wrap th { font-size: 7px; padding: 10px 4px; letter-spacing: 0; }
  .history-wrap td, .history-wrap td:first-child { font-size: 10px; padding: 11px 4px; }
  dialog td, dialog th { padding: 9px 5px; font-size: 10px; }
  dialog td svg { width: 29px; height: 29px; }
  #bonus-result { padding: 25px 21px; }
  .result-visual { width: 90px; height: 90px; margin-bottom: 16px; }
  .result-visual>svg { width: 79px; height: 79px; }
  #bonus-result h2 { font-size: 29px; }
  #result-amount { font-size: 45px; margin-top: 17px; }
  #result-caption { font-size: 11px; }
  .result-facts { margin: 19px 0; }
  .result-facts>div { padding-inline: 6px; gap: 8px; }
  .result-facts span, .result-facts small { font-size: 8px; }
  .result-facts b, .result-facts strong { font-size: 15px; }
  .getaway-cinematic:after { background: linear-gradient(0deg, #061f2af7 0%, #082531a6 41%, #08253112 87%); }
  .cinematic-copy { width: 90%; max-width: calc(100% - 44px); margin: 0 22px 116px; align-self: flex-end; }
  .episode-tag { font-size: 7px; letter-spacing: 1.65px; }
  .cinematic-copy p { font-size: 15px; line-height: 1.4; margin: 19px 0; }
  .cinematic-copy h2 { font-size: clamp(77px, 22vw, 112px); margin: 20px 0 27px; line-height: .83; }
  .super-active .cinematic-copy h2 { font-size: 68px; }
  .super-active .cinematic-copy h2 span { font-size: 59px; }
  .cinematic-copy>b { margin-top: 23px; font-size: 8px; line-height: 1.6; letter-spacing: 1.05px; }
  .cinematic-copy button { min-width: 224px; min-height: 46px; padding: 12px 18px; margin-top: 20px; font-size: 10px; letter-spacing: .9px; }
  .getaway-cinematic .cinematic-copy small { font-size: 8px; line-height: 1.5; max-width: 280px; margin-top: 15px; }
  .cinematic-chapter { top: max(25px, env(safe-area-inset-top)); right: 22px; gap: 10px; padding: 10px 12px; }
  .cinematic-chapter-number { font-size: 31px; }
  .cinematic-chapter-copy { max-width: 110px; font-size: 8px; letter-spacing: 1.2px; }
  .cinematic-timeline { left: 22px; right: 22px; bottom: max(28px, env(safe-area-inset-bottom)); width: auto; gap: 10px; }
  .cinematic-beat { font-size: 7px; letter-spacing: .6px; padding-top: 11px; }
  .cinematic-skip, #skip-getaway { right: 22px; bottom: 77px; min-height: 32px; padding: 7px 10px; font-size: 8px; }
}

@media (max-width: 370px) {
  .game { padding-inline: 8px; gap: 5px; }
  .brand span { font-size: 11px; letter-spacing: 1.9px; }
  .brand strong { font-size: 34px; letter-spacing: 1.5px; }
  .brand small { max-width: 89px; font-size: 5px; letter-spacing: .1px; }
  .topbar { gap: 6px; min-height: 60px; }
  .top-actions { gap: 4px; }
  .top-actions .icon-button { width: 30px; height: 37px; border-radius: 7px; }
  .top-actions .balance { min-width: 112px; gap: 5px; padding: 7px !important; }
  .balance small { font-size: 5.8px; letter-spacing: .3px; }
  .balance strong { font-size: 18px; }
  .wallet-add { width: 23px; height: 29px; font-size: 19px; }
  .controls { grid-template-columns: 128px minmax(0,1fr); gap: 7px 8px; padding: 8px; }
  .stake-top button { font-size: 6.5px; padding-inline: 4px; }
  .spin { font-size: 16px; gap: 5px; padding-inline: 6px; }
  .spin>svg { width: 25px; height: 25px; }
  .secondary { grid-template-columns: 1fr 76px; gap: 8px; }
  .buy-ticket { font-size: 9px; gap: 5px; }
  .buy-ticket small { font-size: 7px; }
  .feature-rail { grid-template-columns: 1fr 60px 1fr; gap: 6px !important; }
  .feature-rail .bonus-sign { grid-template-columns: 24px 1fr !important; padding: 5px !important; }
  .bonus-medal { width: 24px !important; }
  .bonus-sign>small { font-size: 5.4px !important; }
  .bonus-sign>b { font-size: 6px !important; }
  .round-total { padding: 7px 6px; }
  .round-total small { font-size: 5.7px; }
  .round-total strong { font-size: 23px; }
  .round-total>span { font-size: 8px; }
  .combo-panel #combo-content { font-size: 8px; gap: 4px; }
  .combo-panel button { padding-inline: 5px; font-size: 7px; }
  .match-chip svg { width: 19px; height: 21px; }
  .match-chip strong, .match-chip>span { font-size: 8px; }
  .cabinet-foot { font-size: 6.6px; }
  .round-counter { font-size: 6px; }
  .fineprint { font-size: 5.4px; gap: 6px; }
  .feature-strip button { font-size: 7px !important; }
  .choice-art b { font-size: 18px; }
  .bonus-choices>button[data-bonus-choice=super] .choice-art b { font-size: 15px; }
  .bonus-choices strong { font-size: 9px; }
  .bonus-choices small { font-size: 8px; }
  .settings-links { grid-template-columns: 1fr; }
  .result-facts b, .result-facts strong { font-size: 13px; }
}

@media (max-width: 700px) and (max-height: 760px) {
  .game { min-height: 0; padding-top: max(7px, env(safe-area-inset-top)); padding-bottom: max(6px, env(safe-area-inset-bottom)); gap: 5px; }
  .topbar { min-height: 59px; }
  .brand strong { font-size: 35px; }
  .brand span { font-size: 12px; }
  .feature-strip { display: none; }
  .feature-rail { height: 69px; min-height: 69px; }
  .feature-rail .bonus-sign { height: 69px !important; min-height: 69px !important; grid-template-rows: 12px 25px 17px !important; }
  .sun-meter { height: 69px !important; min-height: 69px; }
  .sun-meter>svg { width: 54px; height: 54px; margin-top: -2px; }
  .sun-meter>strong { top: 16px; font-size: 18px; }
  .sun-meter small { bottom: 6px; font-size: 6px; }
  .round-total { height: 69px; min-height: 69px; gap: 4px; padding-block: 7px; }
  .round-total strong { font-size: 24px; }
  .controls { min-height: 123px; gap: 6px 8px; padding: 7px; }
  .spin { min-height: 68px; }
  .stake-input button, .stake-input select { height: 34px; }
  .buy-ticket { min-height: 41px; }
  .radio-line, .receipt-line { min-height: 23px; height: 23px; }
  .mode-banner, .bonus-active .mode-banner { top: 69px; }
  .cinematic-copy { margin-bottom: 105px; }
  .cinematic-copy p { margin-block: 15px; }
  .cinematic-copy h2 { font-size: 78px; margin: 18px 0 22px; }
  .cinematic-copy>b { margin-top: 18px; }
}

@media (max-width: 700px) and (max-height: 650px) {
  .game { padding-block: 6px; gap: 4px; }
  .topbar { min-height: 49px; }
  .brand strong { font-size: 29px; }
  .brand span { font-size: 10px; }
  .brand small { margin-top: 5px; font-size: 4.7px; }
  .top-actions .icon-button { height: 35px; }
  .top-actions .balance { padding-block: 6px !important; }
  .balance strong { font-size: 18px; }
  .balance small { margin-bottom: 3px; }
  .marquee { height: 20px; min-height: 20px; font-size: 7px; }
  .cabinet-foot { min-height: 19px; padding-top: 4px; font-size: 6.7px; }
  .combo-panel { min-height: 32px; margin-top: 5px; padding-block: 2px; }
  .combo-panel button { min-height: 26px; }
  .combo-panel #combo-content>b { font-size: 21px; }
  .feature-rail { height: 58px; min-height: 58px; gap: 5px !important; }
  .feature-rail .bonus-sign { height: 58px !important; min-height: 58px !important; grid-template-rows: 10px 20px 14px !important; padding-block: 5px !important; }
  .bonus-sign>strong { font-size: 24px !important; }
  .bonus-sign>small { font-size: 5px !important; }
  .bonus-sign>b { font-size: 5.5px !important; }
  .bonus-medal { height: 40px !important; }
  .sun-meter { height: 58px !important; min-height: 58px; }
  .sun-meter>svg { width: 45px; height: 45px; margin-top: -1px; }
  .sun-meter>strong { top: 12px; font-size: 16px; }
  .sun-meter small { bottom: 5px; font-size: 5px; }
  .turbo-ring { width: 38px; height: 38px; left: calc(50% - 19px); top: 4px; }
  .round-total { height: 58px; min-height: 58px; gap: 3px; padding-block: 5px; }
  .round-total small { font-size: 5.4px; }
  .round-total strong { font-size: 21px; }
  .round-total>span { font-size: 7px; }
  .controls { min-height: 111px; gap: 5px 8px; padding: 6px; }
  .stake-top { gap: 3px; margin-bottom: 4px; }
  .stake-top label { font-size: 6px; }
  .stake-top button { min-height: 19px; font-size: 6px; padding-block: 2px; }
  .stake-input button, .stake-input select { height: 30px; }
  .spin { min-height: 60px; }
  .buy-ticket { min-height: 36px; }
  .buy-ticket svg { width: 27px; height: 27px; }
  .round-tools button { min-height: 19px !important; font-size: 7px !important; padding-block: 2px !important; }
  .radio-line { display: none; }
  .receipt-line { min-height: 21px; height: 21px; padding-block: 3px; }
  .fineprint { min-height: 9px; font-size: 5px; }
  .mode-banner, .bonus-active .mode-banner { top: 57px; font-size: 6px; }
  .cinematic-copy { margin-bottom: 91px; }
  .cinematic-copy p { font-size: 12px; margin-block: 13px; }
  .cinematic-copy h2 { font-size: 67px; }
  .cinematic-copy>b { font-size: 7px; }
  .cinematic-copy button { margin-top: 14px; min-height: 40px; padding-block: 10px; }
  .getaway-cinematic .cinematic-copy small { font-size: 7px; margin-top: 11px; }
  .cinematic-chapter { top: 18px; padding: 7px 10px; }
  .cinematic-chapter-number { font-size: 25px; }
  .cinematic-chapter-copy { font-size: 7px; }
  .cinematic-timeline { bottom: 18px; }
  .cinematic-skip, #skip-getaway { bottom: 61px; min-height: 28px; }
}

@media (min-width: 701px) and (max-height: 560px) {
  .game { padding: 7px 18px; gap: 4px; --stage-width: min(850px, 100%); }
  .topbar { min-height: 49px; }
  .brand span { font-size: 13px; }
  .brand strong { font-size: 37px; }
  .brand small { font-size: 5px; margin-top: 6px; }
  .top-actions .balance { padding-block: 7px; }
  .balance strong { font-size: 21px; }
  .arena { grid-template-columns: minmax(0,1fr) 175px; gap: 15px; }
  .feature-rail { padding-top: 20px !important; gap: 7px !important; }
  .rail-heading, .getaway-poster { display: none; }
  .feature-rail .bonus-sign { min-height: 75px !important; height: 75px; }
  .marquee { height: 20px; min-height: 20px; font-size: 8px; }
  .combo-panel { min-height: 34px; margin-top: 5px; padding-block: 2px; }
  .combo-panel button { min-height: 28px; }
  .cabinet-foot { min-height: 19px; padding-top: 4px; font-size: 8px; }
  .controls { min-height: 72px; padding: 6px 12px; }
  .spin { min-height: 55px; }
  .stake-top { margin-bottom: 4px; }
  .stake-input button, .stake-input select { height: 31px; }
  .buy-ticket { min-height: 38px; }
  .radio-line, .receipt-line { min-height: 23px; height: 23px; }
  .feature-strip { display: none; }
  .fineprint { min-height: 8px; font-size: 6px; }
  .cinematic-copy p { margin: 14px 0; font-size: 15px; }
  .cinematic-copy h2 { font-size: 77px; margin: 20px 0; }
  .cinematic-copy>b { margin-top: 23px; font-size: 8px; }
  .cinematic-copy button { margin-top: 18px; min-height: 42px; padding-block: 11px; }
  .getaway-cinematic .cinematic-copy small { margin-top: 14px; font-size: 8px; }
}

/* Preference overrides are deliberately last. */
.quiet-city .police-reflections, .quiet-city .searchlight, .quiet-city .floating-dust,
.quiet-city .ocean-shimmer, .quiet-city .poster-siren { display: none; }
.quiet-city .backdrop:before, .quiet-city .backdrop:after { animation: none !important; }
.no-motion *, .no-motion *:before, .no-motion *:after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.no-motion .tile.removing { opacity: 0; }
.no-motion .tile.added { transform: none; opacity: 1; }
.no-motion .tile.winning:before, .no-motion .scene-transition, .no-motion .cinematic-sweep,
.no-motion .cinematic-police, .no-motion .police-reflections, .no-motion .confetti,
.no-motion .cell-spark, .no-motion .column-stop, .no-motion .multiplier-flight, .no-motion .control-ripple { display: none; }
.getaway-cinematic[data-reduced-motion=true] *, .getaway-cinematic[data-reduced-motion=true]:before { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .tile.removing { opacity: 0; }
  .tile.added { transform: none; opacity: 1; }
  .tile.winning:before, .scene-transition, .cinematic-sweep, .cinematic-police,
  .police-reflections, .confetti, .cell-spark, .column-stop, .multiplier-flight, .control-ripple { display: none; }
}

/* Sound audition belongs to settings; it never places a demo wager. */
.audio-preview-panel { margin: 20px 0 16px; padding: 14px; border: 1px solid #94e9dd40; border-radius: 10px; background: #08263075; }
.audio-preview-panel h3 { margin: 0 0 6px; font-size: 10px; letter-spacing: 1.4px; color: #bdf7e9; }
.audio-preview-panel p { margin: 0 0 12px; font-size: 10px; line-height: 1.45; color: #accac8; }
.audio-preview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.audio-preview-grid button { min-height: 41px; border-radius: 7px; padding: 9px; border: 1px solid #98e7d775; background: #254d58; color: #f5ecd9; font-size: 11px; font-weight: 800; }
.audio-preview-grid button:hover:not(:disabled) { background: #346974; border-color: #b5ffee; }
.audio-preview-grid button[aria-pressed=true] { background: #b0ecda; color: #0a303a; }
.audio-preview-panel #audio-preview-status:empty { display: none; }
.audio-preview-panel #audio-preview-status { margin: 10px 0 0; }

/* GETAWAY / EPILOGUE — original coastal crime key art, v7.
   Final layer, scoped to the bonus result. Outcome and wallet values stay in JS. */

#bonus-result {
  --result-paper: #fff5d6;
  --result-lilac: #e5c8ff;
  --result-ink: #1e1b38;
  --result-coral: #ff6885;
  --result-art: url('assets/getaway-result-v9.webp'), url('assets/getaway-v9.webp');
  display: none;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  grid-template-rows: auto auto auto auto auto auto auto;
  grid-auto-rows: min-content;
  align-content: start;
  column-gap: 0;
  width: min(980px, calc(100% - 40px));
  max-width: 980px;
  height: fit-content;
  min-height: 548px;
  max-height: calc(100svh - 36px);
  margin: auto;
  padding: 42px 37px 30px 0;
  overflow-x: hidden;
  overflow-y: auto;
  isolation: isolate;
  border: 2px solid #aaffdd;
  border-radius: 3px;
  background: radial-gradient(ellipse at 96% 6%, #6249657a, transparent 58%),
    linear-gradient(155deg, #272438 33%, #1d203b 68%, #322744);
  color: var(--result-paper);
  box-shadow: 9px 11px 0 #11162e9c, 0 28px 110px #020d24c7;
  text-align: left;
  scrollbar-color: #b58fa9 #28243b;
  scrollbar-width: thin;
  overscroll-behavior: contain;
}

#bonus-result[open] {
  display: grid;
  animation: result-poster-arrive .24s ease-out both;
}

#bonus-result::backdrop {
  background: linear-gradient(125deg, #172143ba, #2a1c43b8);
  backdrop-filter: blur(7px) saturate(.88);
}

/* Thin printed edges and one diagonal seam: a film poster, not a settings card. */
#bonus-result:before {
  content: '';
  position: absolute;
  inset: 7px;
  z-index: 4;
  pointer-events: none;
  border: 1px solid #fff2d537;
  border-radius: 0;
  background: linear-gradient(105deg, transparent 55%, #f8d1ff06 75%, transparent);
}

#bonus-result:after {
  content: '';
  position: absolute;
  z-index: 1;
  width: 3px;
  top: -20px;
  bottom: -20px;
  left: calc(52.4% - 27px);
  transform: rotate(3deg);
  background: linear-gradient(transparent, #f6c2db7d 20%, #cfb7e69c 72%, transparent);
  box-shadow: 4px 0 #f5c7e312;
  pointer-events: none;
}

#bonus-result > :not(.result-visual) {
  grid-column: 2;
  z-index: 2;
  position: relative;
  min-width: 0;
  margin-left: 23px;
}

/* The original key art is deliberately the largest object in the scene. */
#bonus-result .result-visual {
  display: block;
  position: absolute;
  z-index: 0;
  inset: 0 auto 0 0;
  width: 100%;
  height: 100%;
  min-height: 548px;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background-color: #28344d;
  background-image: var(--result-art);
  background-size: cover, cover;
  background-position: center 35%, 75% center;
  background-repeat: no-repeat;
  clip-path: none;
}

#bonus-result .result-visual:before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, transparent 0%, transparent 31%, #251b3659 46%, #241936d6 62%, #251b3bec 100%),
    linear-gradient(180deg, transparent 48%, #211a3821 68%, #141c39a8 100%);
  pointer-events: none;
}

#bonus-result .result-visual:after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
  background: linear-gradient(110deg, transparent 25%, #faefff1f 46%, transparent 63%);
  transform: translateX(-120%);
  pointer-events: none;
}

#bonus-result .result-visual > svg,
#bonus-result .result-orbit {
  display: none;
  animation: none;
}

#bonus-result .result-art-title {
  position: absolute;
  left: 29px;
  width: 43%;
  right: auto;
  bottom: 29px;
  z-index: 3;
  transform: rotate(-4deg);
  transform-origin: left bottom;
  color: var(--result-paper);
  text-shadow: 0 3px 8px #0d163c;
}

#bonus-result .result-art-title span {
  display: block;
  margin: 0 0 7px 4px;
  font: 800 10px/1.2 var(--finish-body, 'Avenir Next', sans-serif);
  letter-spacing: 3.1px;
  color: #f5d9e8;
}

#bonus-result .result-art-title b {
  display: block;
  font: 84px/.9 var(--finish-display, Impact, sans-serif);
  letter-spacing: -1px;
  color: #fff0d0;
  -webkit-text-stroke: .4px #fff2cd;
  text-shadow: 2px 3px #714966, 5px 6px #151d36;
  transform: skewX(-8deg);
  transform-origin: left bottom;
}

#bonus-result .result-art-title em {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 15px 0 0 4px;
  padding: 6px 10px;
  border-top: 1px solid #eab0e5a8;
  border-bottom: 1px solid #eab0e558;
  font: 750 8px/1.3 var(--finish-body, 'Avenir Next', sans-serif);
  letter-spacing: 1.8px;
  color: #e4d7f0;
  background: #2f23465e;
}
#bonus-result[data-mode=super] .result-art-title b { font-size: 70px; }

/* Status and accounting stay part of the image hierarchy, not three little cards. */
#bonus-result #result-kicker {
  display: block;
  align-self: start;
  width: fit-content;
  max-width: calc(100% - 23px);
  margin-top: 0;
  margin-bottom: 21px;
  padding: 7px 11px;
  border: 1px solid #eccdea9c;
  border-radius: 0;
  background: #583f6280;
  color: #f4dff8;
  font: 800 9px/1.3 var(--finish-body, 'Avenir Next', sans-serif);
  letter-spacing: 1.1px;
  transform: rotate(-2deg);
  box-shadow: 3px 3px #0b1b336e;
}

#bonus-result #result-title {
  align-self: start;
  margin-top: 0;
  margin-bottom: 23px;
  color: #f7e8cf;
  font: 43px/.97 var(--finish-display, Impact, sans-serif);
  letter-spacing: .5px;
  text-wrap: balance;
  text-shadow: 2px 3px #5a425d;
  transform: skewX(-4deg);
  transform-origin: left center;
}

#bonus-result #result-caption {
  margin-top: 0;
  margin-bottom: 9px;
  max-width: 100%;
  font: 800 9px/1.55 var(--finish-body, 'Avenir Next', sans-serif);
  letter-spacing: 1.7px;
  color: #c6eddd;
}

#bonus-result #result-amount {
  display: block;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
  padding: 0 0 5px;
  color: #fff0c6;
  font: 96px/.98 var(--finish-display, Impact, sans-serif);
  font-variant-numeric: tabular-nums;
  letter-spacing: -1.8px;
  white-space: nowrap;
  text-shadow: 2px 3px #b77d926b, 4px 6px #0c19399c;
  transform: skewX(-4deg);
  transform-origin: left center;
}

/* Outrank later currency wrapping; JS fits the final number before the counter. */
#bonus-result #result-amount[data-final-amount] {
  white-space: nowrap;
  overflow-wrap: normal;
  animation: none;
}
#bonus-result .result-facts :is(#result-cost, #result-returned, #result-net)[data-final-amount] {
  display: block;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow-wrap: normal;
}

#bonus-result .result-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 0;
  margin-bottom: 24px;
  padding: 15px 0;
  border: 0;
  border-top: 1px solid #dcc7d450;
  border-bottom: 1px solid #dcc7d435;
  border-radius: 0;
  background: transparent;
  color: #f0dccd;
}

#bonus-result .result-facts > div {
  padding: 0 11px;
  gap: 8px;
  text-align: left;
  border-right: 1px solid #dcc7d42d;
}

#bonus-result .result-facts > div:first-child { padding-left: 0; }
#bonus-result .result-facts > div:last-child { padding-right: 0; border-right: 0; }
#bonus-result .result-facts span { color: #c8ddd8; font-size: 8px; font-weight: 650; line-height: 1.35; letter-spacing: .4px; }
#bonus-result .result-facts b { color: #f3e3cd; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.15; letter-spacing: -.35px; }

#bonus-result #result-continue {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  width: calc(100% - 23px);
  min-height: 56px;
  margin-top: 0;
  margin-bottom: 18px;
  padding: 13px 18px;
  border: 1px solid #fff5db;
  border-radius: 1px;
  background: linear-gradient(110deg, #c2ffe0, #68eec4 31%, #fff0c3 32%, #ffd59f);
  color: #28213f;
  box-shadow: 5px 5px #c7306d, inset 0 0 0 2px #fffbd44a;
  font: 900 11px/1.4 var(--finish-body, 'Avenir Next', sans-serif);
  letter-spacing: 1.1px;
  text-align: left;
  transform: skewX(-4deg);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

#bonus-result #result-continue > span:not(.control-ripple) { font-size: 26px; line-height: 1; font-weight: 500; color: #4c3658; }
#bonus-result #result-continue:hover { transform: skewX(-4deg) translateY(-2px); background: linear-gradient(110deg, #e5ffdf, #88fdd0 31%, #fff7d6 32%, #ffe2b3); box-shadow: 5px 7px #df3778; }
#bonus-result #result-continue:active { transform: skewX(-4deg) translate(3px, 3px); box-shadow: 2px 2px #9a6696; }
#bonus-result #result-continue:focus-visible { outline: 3px solid #f0c7ff; outline-offset: 7px; }

#bonus-result #result-note {
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  font: 550 10px/1.6 var(--finish-body, 'Avenir Next', sans-serif);
  color: #c0d0d0;
  letter-spacing: .05px;
}

#bonus-result #result-close {
  position: absolute;
  z-index: 10;
  top: 14px;
  right: 15px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  margin: 0;
  padding: 0;
  border: 1px solid #eadbe780;
  border-radius: 1px;
  background: #211f3b9e;
  color: #f7e6d7;
  box-shadow: 2px 2px #13203970;
  font: 500 23px/1 var(--finish-body, 'Avenir Next', sans-serif);
}
#bonus-result #result-close:hover { background: #674b69; border-color: #f7e4db; transform: translateY(-1px); }
#bonus-result #result-close:focus-visible { outline: 3px solid #f0c7ff; outline-offset: 4px; }

/* Preview is explicit, with one truthful statement instead of three zero values. */
#bonus-result[data-outcome=preview] { background: radial-gradient(ellipse at 95% 10%, #8a547f43, transparent 62%), linear-gradient(155deg, #30243e 33%, #25213e 68%, #3d294a); }
#bonus-result[data-outcome=preview] #result-kicker { color: #fff0cf; border-color: #f2d2a999; background: #7b574449; }
#bonus-result[data-outcome=preview] #result-title { color: #f7dfec; }
#bonus-result[data-outcome=preview] #result-caption { color: #f0c49b; font-size: 9px; letter-spacing: 1.15px; }
#bonus-result[data-outcome=preview] #result-amount { color: #e8ccfa; text-shadow: 2px 3px #a266aa66, 4px 6px #0e14346e; }
#bonus-result[data-outcome=preview] .result-facts { display: none; }
#bonus-result[data-outcome=preview] #result-note {
  grid-row: 5;
  margin-top: 0;
  margin-bottom: 29px;
  padding: 13px 0 13px 13px;
  border-left: 3px solid #dba8d9;
  background: linear-gradient(90deg, #c399d312, transparent 85%);
  color: #e0cadd;
  font-size: 11px;
  line-height: 1.6;
}
#bonus-result[data-outcome=preview] #result-continue { grid-row: 6; align-self: end; }

/* A paid profit has a short highlight. Neutral and losing results keep calm typography. */
#bonus-result[data-outcome=gain] {
  border-color: #ffe5b7;
  background: radial-gradient(ellipse at 92% 4%, #925a6c42, transparent 62%), linear-gradient(155deg, #302439, #24213d 64%, #3c2949);
}
#bonus-result[data-outcome=gain] #result-kicker { color: #bcffdd; border-color: #79f5c5; background: #0c5d4eab; }
#bonus-result[data-outcome=gain] #result-amount { color: #fff3c5; text-shadow: 2px 3px #c14f7579, 4px 6px #19173899; }
#bonus-result[data-outcome=gain] #result-net { color: #9cffcb; }
#bonus-result[data-outcome=loss] #result-net { color: #ffb39e; }
#bonus-result[data-outcome=loss] #result-kicker { color: #ffe0c8; border-color: #da929e99; background: #60374b9c; }
#bonus-result[data-outcome=even] #result-net { color: #fff0c8; }
#bonus-result[data-outcome=gain][open] .result-visual:after { animation: result-film-sweep 1.35s .2s ease-out both; }
#bonus-result[data-outcome=gain][open]:before { border-top-color:#72ffe0;border-right-color:#ffe5a4;border-bottom-color:#ff9786;animation:result-neon-finish 1600ms ease-out both; }
#bonus-result:is([data-outcome=loss],[data-outcome=even]) #result-amount { color: #ece2d7; text-shadow: 2px 3px #634a6673; }
#bonus-result:is([data-outcome=loss],[data-outcome=even]) #result-title { text-shadow: 2px 3px #443149; }
#bonus-result:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) .result-visual:after { animation: none; display: none; }
#bonus-result:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) #result-amount { animation: none; }

#bonus-result[open] #result-kicker { animation: result-type-arrive .45s .12s ease-out both; }
#bonus-result[open] #result-title { animation: result-title-arrive .5s .17s ease-out both; }
#bonus-result[open] #result-continue { animation: result-button-arrive .5s .25s ease-out both; }

@keyframes result-poster-arrive {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes result-type-arrive {
  from { opacity: 0; transform: rotate(-2deg) translateX(12px); }
  to { opacity: 1; transform: rotate(-2deg) translateX(0); }
}
@keyframes result-title-arrive {
  from { opacity: 0; transform: skewX(-4deg) translateY(10px); }
  to { opacity: 1; transform: skewX(-4deg) translateY(0); }
}
@keyframes result-button-arrive {
  from { opacity: 0; transform: skewX(-4deg) translateY(8px); }
  to { opacity: 1; transform: skewX(-4deg) translateY(0); }
}
@keyframes result-film-sweep {
  0% { opacity: 0; transform: translateX(-110%); }
  35% { opacity: .75; }
  100% { opacity: 0; transform: translateX(110%); }
}
@keyframes result-neon-finish{0%{opacity:.15;box-shadow:inset 0 0 0 0 #ffe5a400}40%{opacity:1;box-shadow:inset 0 0 24px #bc8cff24}100%{opacity:.8;box-shadow:inset 0 0 0 0 #ffe5a400}}

@media (min-width: 701px) and (max-height: 650px) {
  #bonus-result { min-height: 478px; padding-top: 27px; padding-bottom: 24px; width: min(940px, calc(100% - 34px)); max-height: calc(100svh - 26px); }
  #bonus-result .result-visual { min-height: 478px; }
  #bonus-result #result-kicker { margin-bottom: 17px; }
  #bonus-result #result-title { font-size: 39px; margin-bottom: 18px; }
  #bonus-result #result-amount { font-size: 84px; margin-bottom: 18px; }
  #bonus-result .result-facts { padding-block: 12px; margin-bottom: 20px; }
  #bonus-result #result-continue { min-height: 51px; margin-bottom: 14px; }
  #bonus-result .result-art-title b { font-size: 77px; }
}

@media (min-width: 701px) and (max-width: 900px) {
  #bonus-result { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding-right: 27px; }
  #bonus-result .result-visual { width: 100%; background-position: 38% 35%, 75% center; }
  #bonus-result:after { left: calc(50% - 23px); }
  #bonus-result > :not(.result-visual) { margin-left: 17px; }
  #bonus-result #result-title { font-size: 37px; }
  #bonus-result #result-amount { font-size: 82px; }
  #bonus-result #result-kicker { font-size: 8px; letter-spacing: .8px; max-width: calc(100% - 17px); }
  #bonus-result #result-continue { width: calc(100% - 17px); font-size: 10px; }
  #bonus-result .result-art-title { left: 24px; right: auto; width: 43%; }
  #bonus-result .result-art-title b { font-size: 67px; }
  #bonus-result .result-art-title span { font-size: 8px; letter-spacing: 2.4px; }
  #bonus-result .result-art-title em { font-size: 7px; letter-spacing: 1.2px; }
}

/* Phones use a full-width comic panel over a compact, readable score sheet. */
@media (max-width: 700px) {
  #bonus-result {
    display: none;
    width: min(460px, calc(100% - 20px));
    max-width: 460px;
    min-height: 0;
    max-height: calc(100svh - 24px);
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    padding: 0 22px 19px;
    border: 2px solid #f3d7c8;
    border-radius: 2px;
    box-shadow: 5px 7px #15132e7a, 0 20px 70px #0b1234b8;
    background: radial-gradient(ellipse at 100% 33%, #74507945, transparent 66%), linear-gradient(155deg, #272438, #28213e 76%, #3a2846);
  }
  #bonus-result[open] { display: grid; }
  #bonus-result:before { inset: 5px; border-color: #fff1da29; }
  #bonus-result:after { display: none; }
  #bonus-result > :not(.result-visual) { grid-column: 1; margin-left: 0; }
  #bonus-result .result-visual {
    position: relative;
    grid-column: 1;
    grid-row: 1;
    z-index: 0;
    inset: auto;
    width: calc(100% + 44px);
    height: clamp(190px, 53vw, 220px);
    min-height: 0;
    margin: 0 -22px 13px;
    border-bottom: 2px solid #e9bfd8;
    background-size: cover, cover;
    background-position: 34% 48%, 75% 54%;
    clip-path: polygon(0 0, 100% 0, 100% 91%, 0 100%);
  }
  #bonus-result .result-visual:before { background: linear-gradient(180deg, #15244403, transparent 28%, #291c3338 66%, #242039e6); }
  #bonus-result .result-art-title { left: 21px; right: 20px; width: auto; bottom: 26px; }
  #bonus-result .result-art-title span { font-size: 8px; margin-left: 3px; margin-bottom: 6px; letter-spacing: 2.4px; }
  #bonus-result .result-art-title b { font-size: 65px; line-height: .9; letter-spacing: -.4px; text-shadow: 2px 3px #885271, 4px 5px #16213d; }
  #bonus-result[data-mode=super] .result-art-title b { font-size: clamp(42px, 12vw, 54px); white-space: nowrap; }
  #bonus-result .result-art-title em { display: none; }
  #bonus-result #result-kicker {
    position: absolute;
    top: 17px;
    right: 53px;
    max-width: calc(100% - 86px);
    margin: 0;
    padding: 6px 8px;
    font-size: 8px;
    letter-spacing: .4px;
    background: #36293bc2;
    backdrop-filter: blur(4px);
  }
  #bonus-result #result-title { grid-row: 3; font-size: 32px; line-height: .99; margin-bottom: 12px; letter-spacing: .35px; text-wrap: balance; }
  #bonus-result #result-caption { grid-row: 4; font-size: 9px; line-height: 1.5; margin-bottom: 5px; letter-spacing: 1px; }
  #bonus-result #result-amount { grid-row: 5; font-size: clamp(65px, 19vw, 81px); line-height: 1; letter-spacing: -1.2px; margin-bottom: 12px; padding-bottom: 0; }
  #bonus-result .result-facts { grid-row: 6; margin-bottom: 20px; padding-block: 12px; }
  #bonus-result .result-facts > div { padding-inline: 9px; gap: 7px; }
  #bonus-result .result-facts > div:first-child { padding-left: 0; }
  #bonus-result .result-facts > div:last-child { padding-right: 0; }
  #bonus-result .result-facts span { font-size: 7px; letter-spacing: .2px; }
  #bonus-result .result-facts b { font-size: 16px; letter-spacing: -.3px; }
  #bonus-result #result-continue { grid-row: 7; width: 100%; min-height: 50px; padding: 11px 15px; margin-bottom: 16px; font-size: 10px; letter-spacing: .65px; }
  #bonus-result #result-continue > span:not(.control-ripple) { font-size: 23px; }
  #bonus-result #result-note { grid-row: 8; font-size: 11px; line-height: 1.55; }
  #bonus-result[data-outcome=preview] #result-caption { font-size: 9px; letter-spacing: .65px; }
  #bonus-result[data-outcome=preview] #result-note { grid-row: 6; margin-bottom: 17px; padding: 8px 0 8px 12px; font-size: 12px; line-height: 1.55; }
  #bonus-result[data-outcome=preview] #result-continue { grid-row: 7; margin-bottom: 4px; }
}

@media (max-width: 370px) {
  #bonus-result { width: calc(100% - 16px); max-height: calc(100svh - 18px); padding: 0 18px 19px; }
  #bonus-result .result-visual { width: calc(100% + 36px); height: 190px; margin-inline: -18px; margin-bottom: 13px; }
  #bonus-result .result-art-title { left: 18px; bottom: 22px; }
  #bonus-result .result-art-title b { font-size: 58px; }
  #bonus-result .result-art-title span { font-size: 7px; letter-spacing: 2px; }
  #bonus-result #result-kicker { font-size: 7px; padding: 6px 8px; margin: 0; letter-spacing: .55px; }
  #bonus-result #result-title { font-size: 29px; margin-bottom: 12px; }
  #bonus-result #result-caption { font-size: 9px; letter-spacing: .65px; }
  #bonus-result #result-amount { font-size: 65px; margin-bottom: 12px; }
  #bonus-result .result-facts b { font-size: 14px; }
  #bonus-result .result-facts span { font-size: 6.8px; }
  #bonus-result #result-continue { font-size: 9px; min-height: 48px; padding-inline: 13px; }
  #bonus-result[data-outcome=preview] #result-caption { font-size: 9px; }
}

@media (max-width: 700px) and (max-height: 650px) {
  #bonus-result .result-visual { height: 178px; }
  #bonus-result .result-art-title b { font-size: 58px; }
  #bonus-result #result-title { font-size: 29px; }
  #bonus-result #result-amount { font-size: 65px; }
}

.no-motion #bonus-result,
.no-motion #bonus-result *,
.no-motion #bonus-result:before,
.no-motion #bonus-result:after,
.no-motion #bonus-result .result-visual:before,
.no-motion #bonus-result .result-visual:after {
  animation: none !important;
  transition: none !important;
}
.no-motion #bonus-result .result-visual:after { display: none; }
@media (prefers-reduced-motion: reduce) {
  #bonus-result, #bonus-result *, #bonus-result:before, #bonus-result:after,
  #bonus-result .result-visual:before, #bonus-result .result-visual:after {
    animation: none !important;
    transition: none !important;
  }
  #bonus-result .result-visual:after { display: none; }
}

/* Long real catalog payouts remain readable at phone widths. */
@media (max-width:700px){
 #bonus-result[data-large-amount=true] #result-amount{font-size:clamp(56px,16vw,76px)}
 #bonus-result:not([data-outcome=preview]) .result-facts{display:flex;flex-direction:column;gap:7px;padding-block:11px;margin-bottom:16px}
 #bonus-result .result-facts>div{flex-direction:row;justify-content:space-between;align-items:baseline;padding:0;border:0;gap:12px}
 #bonus-result .result-facts span{font-size:10px;letter-spacing:.1px}
 #bonus-result .result-facts b{font-size:15px;white-space:nowrap}
 #bonus-result #result-close{top:10px;right:10px;width:44px;height:44px}
 #bonus-result #result-kicker{right:62px;max-width:calc(100% - 92px)}
}

/* HEATLANE — a night-jeweller vitrine, warm chrome and luminous coastal colour.
   Surround and service windows only; the city art and reel geometry stay intact. */

:root {
  --surround-paper: #fff0d5;
  --surround-muted: #c2dedc;
  --surround-lilac: #e7b4ff;
  --surround-coral: #ff6887;
  --surround-ink: #102e40;
  --surround-line: #e7cfe949;
  --surround-display: Impact, 'Arial Narrow', sans-serif;
}

/* Header hardware: warm chrome balance, jewel-toned switches. */
.top-actions .icon-button {
  border: 1px solid #efd9e68c;
  border-radius: 7px;
  color: #ffeed8;
  background: linear-gradient(145deg, #64536bdd, #302844ed 74%);
  box-shadow: inset 0 1px #fff4f12b, 0 3px 0 #262038, 0 5px 13px #1b173939;
}
.top-actions .icon-button:hover:not(:disabled) {
  border-color: #f6e4fa;
  color: #fff6e1;
  background: linear-gradient(145deg, #856986, #443255);
  box-shadow: inset 0 1px #fff4f14d, 0 3px #262038, 0 6px 17px #1a133e4d;
  transform: translateY(-1px);
}
.top-actions .icon-button:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 1px 5px #171d3733, 0 1px #262038; }
.top-actions .icon-button[aria-pressed=true] { background: linear-gradient(150deg, #e7cbeb, #bc9bcf); border-color: #fff1f0; color: #342846; }
.top-actions .balance {
  border: 1px solid #fff0d9;
  border-radius: 8px;
  background: linear-gradient(155deg, #fff0d9 0%, #ead7d5 58%, #d7c1d5 100%);
  box-shadow: inset 0 1px #fffbed, inset 0 -2px #9370872b, 0 3px 0 #785e73, 0 6px 18px #14193642;
  color: #332c44;
}
.balance small { color: #685268; font-size: 8px; font-weight: 850; letter-spacing: 1.2px; }
.balance strong { color: #302c42; text-shadow: 0 1px #fff5e78c; font-weight: 850; }
.wallet-add {
  color: #34223f;
  background: linear-gradient(145deg, #ffb9b6, #ee90a0);
  border: 1px solid #ffe8dc;
  border-radius: 5px;
  box-shadow: 0 2px #a76781, inset 0 1px #fff0dc80;
}
.wallet-add:hover:not(:disabled) { color: #251d34; background: #ffd1be; box-shadow: 0 2px #a76781, inset 0 1px #fff8db; transform: translateY(-1px); }
.wallet-add:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }
.preview-mode .balance { border-color: #ffe6b5; box-shadow: inset 0 1px #fffbed, 0 3px #8f738c, 0 6px 18px #14193642; }
.preview-mode .balance small:after { color: #795274; }

/* A tactile console, with one confident coral spin action. */
.controls {
  border-color: #e4c8e394;
  border-radius: 9px;
  background: linear-gradient(125deg, #413650f5, #2d2945f5 53%, #3e2c4df5);
  box-shadow: inset 0 1px #ffe9ef24, inset 0 -1px #b69cc02e, 0 7px 22px #1b153b4d;
}
.stake-top label { color: #e0cddd; font-weight: 750; }
.stake-top button {
  border-color: #ddbfde61;
  border-radius: 3px;
  background: #27233ce0;
  color: #d4bddf;
  box-shadow: inset 0 1px #e4d5ee0a;
}
.stake-top button:hover:not(:disabled) { background: #4b3759; border-color: #e1c0f0a1; color: #fff0d6; }
.stake-top button[aria-pressed=true] { background: #d8bce8; border-color: #fbe3ec; color: #39283f; }
.stake-input button, .stake-input select {
  border-color: #d9bdd777;
  border-radius: 5px;
  background: linear-gradient(#54435e, #372d49);
  color: #fff0d4;
  box-shadow: inset 0 1px #f3e1e422, 0 2px #242038;
}
.stake-input select { background: #251f39; color: #f7e8cd; font-weight: 850; }
.stake-input button:hover:not(:disabled) { background: linear-gradient(#79607c, #54405f); border-color: #f7dbed; }
.stake-input button:active:not(:disabled) { background: #30243f; box-shadow: inset 0 2px 4px #17152b70; transform: translateY(1px); }
.spin {
  border: 1px solid #ffeed7;
  border-radius: 7px;
  background: linear-gradient(160deg, #ffd0b4 0%, #ff9c98 46%, #ed7f9a 100%);
  color: #3b2343;
  box-shadow: inset 0 2px #fff2ddac, inset 0 -2px #c253752c, 0 4px #964e79, 0 8px 21px #19163359;
  letter-spacing: 1px;
  text-shadow: 0 1px #ffdfbe44;
}
.spin:before { inset: 4px; border-radius: 3px; border: 1px solid #ffecd59c; }
.spin:after { background: linear-gradient(112deg, transparent 18%, #fff7d948, transparent 76%); }
.spin > svg { border-color: #75466a75; color: #493052; background: #ffe6d522; }
.spin:not(:disabled):hover {
  background: linear-gradient(160deg, #ffdfbe, #ffafa3 49%, #fa90a7);
  box-shadow: inset 0 2px #fff7dfd1, 0 4px #964e79, 0 9px 26px #35184363;
  color: #30213b;
  transform: translateY(-1px);
}
.spin:not(:disabled):active, .spin.tap-burst:not(.busy) {
  transform: translateY(3px);
  background: linear-gradient(160deg, #f1aaa2, #e18a9b);
  box-shadow: inset 0 2px 6px #96516b36, 0 1px #864366;
}
.spin.busy, .spin[aria-busy=true] {
  background: linear-gradient(140deg, #85708b, #584b71);
  color: #f5e4ec;
  border-color: #e9d3e9;
  box-shadow: inset 0 1px #f1e5f348, 0 3px #2f2548;
  text-shadow: none;
}
.spin.busy > svg { background: transparent; color: #f5e4ec; border-color: #ead4ec70; }
.spin.busy:before { border-color: #edd8ee3b; }
.spin:disabled:not(.busy) { background: linear-gradient(145deg, #ac99aa, #88758d); border-color: #dcc7d9; color: #443247; box-shadow: 0 3px #443149; opacity: .78; }
.buy-ticket {
  background: linear-gradient(145deg, #f2d9e9, #d8b5eb 48%, #bda6db);
  border-color: #f5e4f5;
  border-radius: 5px;
  color: #382845;
  box-shadow: inset 0 1px #fff5efab, 0 2px #76618d;
}
.buy-ticket small { color: #644f74; font-weight: 800; }
.buy-ticket:hover:not(:disabled) { background: linear-gradient(145deg, #ffeded, #e8cef7 55%, #cfb9eb); box-shadow: inset 0 1px #fff8e8, 0 2px #76618d; transform: translateY(-1px); }
.buy-ticket:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 1px 4px #76577c30; }
.round-tools button { color: #d8c4dc; }
.round-tools button + button { border-color: #d7b9d746 !important; }
.round-tools button:hover:not(:disabled) { color: #fff0d3; background: #e8c9e313; }
.combo-panel {
  border-color: #7edcca70;
  border-radius: 6px;
  background: linear-gradient(100deg, #123b48f2, #253448f2 65%, #40283fed);
  color: #e1f3e8;
  box-shadow: inset 0 1px #dcffe526;
}
.combo-panel #combo-content > b { color: #ffdfac; }
.combo-panel button { border-color: #bcfbe59e; border-radius: 3px; background: #236f77; color: #fff5d9; box-shadow: inset 0 1px #ecfff132; }
.combo-panel button:hover:not(:disabled) { background: #2d9091; border-color: #eeffdb; }
.combo-panel #combo-next { background: #a1fdd8; color: #143c47; border-color: #efffdf; }
.combo-panel .match-chip { background: #1d203acc; }
.receipt-line { color: #dbcee0; background: #29243de8; border-color: #d9bed24d; border-radius: 4px; }
.receipt-line b { color: #f2dbbc; }
.receipt-line > i { color: #d9bef2; }
.receipt-line:hover { background: #443255; border-color: #e7c7ec9c; }
.receipt-line.credited { border-color: #dfbad294; }
.receipt-line.credited b { color: #f2d8f0; }
.radio-line > span { color: #e1c6f7; }
.radio-line > i { background: #d3b4ec; }
.feature-strip button { color: #eed1f4; }
.feature-strip button:hover { color: #ffe7b5; }
.getaway-poster {
  background-image: linear-gradient(90deg, #25233f85, transparent 79%), url('assets/neon-boulevard-v9.webp');
  background-size: 100% 100%, auto 195%;
  background-position: center, 100% 100%;
  background-repeat: no-repeat;
}
.turbo-ring { display: none; }
.sun-meter { border-color: #51f8c99c; background: radial-gradient(ellipse at 10% 40%, #07857661, transparent 70%), linear-gradient(135deg, #123e48f2, #102e40f7); border-radius: 7px; box-shadow: inset 0 1px #b9ffdd61, inset 0 -2px #051f35aa; }
.sun-meter > strong { color: #ecffd6; text-shadow: 0 2px #09394c; font-variant-numeric: tabular-nums; }
.sun-meter small { color: #b1e7d4; }
.round-total { border-color: #95cdbc8f; border-radius: 7px; background: linear-gradient(135deg, #173e4df5, #182d40f5); box-shadow: inset 0 1px #e4ffed33, inset 0 -2px #071e3299; }
.round-total small { color: #c0dfd9; }
.round-total strong { color: #fff3d4; font-variant-numeric: tabular-nums; }
.round-total > span { color: #c1d4d6; }
.round-total.gain, .round-total[data-outcome=gain] { border-color: #78ffd5; background: radial-gradient(ellipse at 10% 0, #23d79d42, transparent 78%), linear-gradient(135deg, #105847f2, #123f45f5); }
.round-total.gain strong, .round-total[data-outcome=gain] strong { color: #c4ffdc; }
.round-total[data-outcome=loss] { border-color: #d78e989c; background: linear-gradient(135deg, #423140f5, #1b2d41f5); }
.round-total[data-outcome=loss] > span { color: #ffc0ad; }
.round-total[data-outcome=even] { border-color: #ded3b587; }
.feature-rail .bonus-sign {
  isolation: isolate;
  border: 1px solid #bcffef;
  border-right-color: #ff77a9;
  border-bottom-color: #ec87b4;
  border-radius: 6px 19px 6px 19px;
  background: radial-gradient(ellipse at 24% 40%, #0addc43d, transparent 55%), radial-gradient(ellipse at 115% 0, #ff287e57, transparent 63%), linear-gradient(135deg, #103e51, #192746 66%, #432246) !important;
  color: #fff1d3;
  box-shadow: inset 0 1px #e5fff790, inset 0 -3px #061e3799, 0 3px #071f35, 0 5px #44e5c32e, 0 0 21px #12d7c317;
}
.feature-rail .bonus-sign::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 4px;
  border: 1px solid #abffee24;
  border-radius: 3px 15px 3px 15px;
  background: linear-gradient(125deg, #b4fff012, transparent 32%, transparent 69%, #ff6aa21a);
  pointer-events: none;
}
.feature-rail .bonus-sign > small { color: #a9ffe1; text-shadow: 0 1px #0a2940; }
.feature-rail .bonus-sign > strong { color: #fff5d9; text-shadow: 0 2px #ed367c, 0 4px #071e33; }
.feature-rail .bonus-sign > b { color: #ffe5c8; text-shadow: 0 1px #07223c; }
.feature-rail .bonus-medal { filter: drop-shadow(0 3px 2px #031b34a8) drop-shadow(0 0 10px #53ffda4f); transform: rotate(-4deg); }
.bonus-active .feature-rail .bonus-sign { border-color: #86ffe0; background: radial-gradient(ellipse at 24% 40%, #22ffbf59, transparent 57%), linear-gradient(125deg, #075d62, #0e3b50 65%, #5a2456) !important; }
.super-active .feature-rail .bonus-sign { border-color: #ffe7a1; background: radial-gradient(ellipse at 24% 40%, #f7af3659, transparent 57%), linear-gradient(125deg, #73512b, #3c3347 60%, #6c2856) !important; }

/* Fill the existing desktop rail; phone and short-screen card heights stay intact. */
@media (min-width: 701px) and (min-height: 651px) {
  .feature-rail .bonus-sign { min-height: 136px !important; height: 136px; padding: 15px 12px !important; grid-template-columns: 79px minmax(0, 1fr) !important; grid-template-rows: 19px 46px 25px !important; gap: 4px 8px !important; }
  .feature-rail .bonus-medal { width: 85px !important; height: 100px !important; margin-left: -4px; }
  .feature-rail .bonus-sign > small { font-size: 7px !important; letter-spacing: .2px; }
  .feature-rail .bonus-sign > strong { font-size: 49px !important; }
  .feature-rail .bonus-sign > b { font-size: 8px !important; line-height: 1.25; letter-spacing: .1px; }
}

/* Five service windows belong to the same world; the result poster is separate. */
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) {
  height: fit-content;
  border: 1px solid #aae7d4b8;
  border-radius: 9px;
  background: radial-gradient(ellipse at 93% 0, #e72f7c36, transparent 45%),
    radial-gradient(ellipse at 0 0, #15bcae35, transparent 52%),
    linear-gradient(145deg, #123c49, #172b40 70%, #33253f);
  color: #f2eedc;
  box-shadow: inset 0 1px #ffedf138, 0 0 0 4px #32233c2b, 0 28px 95px #0c102ccc;
  scrollbar-color: #ad8fb5 #2c263f;
}
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules)::backdrop {
  background: #1d1b36ae;
  backdrop-filter: blur(6px) saturate(.94);
}
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) h2 {
  font-family: var(--surround-display);
  color: #fff0d5;
  letter-spacing: 1.1px;
  text-shadow: 1px 2px #9b627b6e;
}
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) h3 { color: #f2deeb; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) p,
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) li { color: #c8dcd8; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) p b,
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) li b { color: #f5e7df; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) :is(.dialog-close, .dialog-top .icon-button) {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border: 1px solid #e7cde379;
  border-radius: 5px;
  background: linear-gradient(145deg, #695570, #443250);
  color: #fff0dc;
  box-shadow: inset 0 1px #f9e5f023, 0 2px #241f36;
  font-size: 25px;
}
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) :is(.dialog-close, .dialog-top .icon-button):hover { background: #8c6488; border-color: #f8d7ef; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .eyebrow { color: #ddbddf; letter-spacing: 1.7px; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .primary-action {
  background: linear-gradient(145deg, #ffdebd, #f5b4b0 60%, #e8a6be);
  border: 1px solid #fff0d6;
  border-radius: 5px;
  color: #402b48;
  box-shadow: inset 0 1px #fff7e0a1, 0 3px #a46b8b;
  letter-spacing: .8px;
  font-weight: 900;
}
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .primary-action:hover:not(:disabled) { background: linear-gradient(145deg, #ffeccd, #ffc4bb 63%, #f1b5cf); box-shadow: inset 0 1px #fff9e8, 0 3px #a46b8b; transform: translateY(-1px); }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .primary-action:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 1px #a46b8b; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .primary-action:disabled { background: #ad8f9e; color: #473345; border-color: #d7bccb; box-shadow: none; opacity: .55; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .text-action { color: #dec1ec; text-decoration-color: #caa8dc70; text-underline-offset: 4px; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .text-action:hover { color: #ffe8c3; }
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) .dialog-subtitle { color: #d7c3da; }

/* Bonus selection is a pair of episode covers, with an unambiguous selected state. */
#buy-dialog { padding-top: 29px; }
#buy-dialog > .eyebrow { color: #d9b4da; font-size: 8px; }
#buy-dialog h2 { font-size: 38px; }
#buy-dialog .bonus-choices { gap: 14px; }
#buy-dialog .bonus-choices > button {
  border: 1px solid #bb9cc67a;
  border-radius: 6px;
  background: #2b253e;
  color: #f5e8e3;
  box-shadow: 0 3px #201c32;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
#buy-dialog .bonus-choices > button:hover { border-color: #eed5f3; background: #44314e; box-shadow: 0 5px #201c32; transform: translateY(-2px); }
#buy-dialog .bonus-choices > button[aria-pressed=true] { border-color: #f5d3eb; background: #61415f; box-shadow: 0 0 0 2px #efc0e02c, 0 4px #261d34; }
#buy-dialog .bonus-choices > button[data-bonus-choice=super][aria-pressed=true] { border-color: #f5dab5; background: #634558; box-shadow: 0 0 0 2px #f5dab51f, 0 4px #261d34; }
#buy-dialog .bonus-choices > button:active { transform: translateY(1px); box-shadow: 0 1px #261d34; }
#buy-dialog .bonus-choices > button:after { border-color: #ffe3d6ba; background: #3c2a45c7; }
#buy-dialog .bonus-choices > button[aria-pressed=true]:after { border-color: #fff0dd; background: #ffe1c1; color: #55324e; }
#buy-dialog .choice-art { height: 158px; border-bottom: 1px solid #ffe3ee24; }
#buy-dialog .choice-art b { color: #fff0d2; text-shadow: 2px 3px #943d77; letter-spacing: .2px; }
#buy-dialog .choice-art em { color: #fff0d5; text-shadow: 2px 3px #7b405d, 4px 5px #211f38; }
#buy-dialog [data-bonus-choice=super] .choice-art {
  background-image: linear-gradient(90deg, #35233b93, transparent 85%), linear-gradient(0deg, #3a204961, transparent 60%), url('assets/getaway-result-v9.webp');
  background-size: 100% 100%, 100% 100%, cover;
  background-position: center, center, 35% 27%;
}
#buy-dialog [data-bonus-choice=super] .choice-art b { color: #f3d4f3; text-shadow: 2px 3px #624064; }
#buy-dialog [data-bonus-choice=super] .choice-art em { color: #ffe3b6; }
#buy-dialog .bonus-choices strong { color: #f6e7e1; font-size: 12px; }
#buy-dialog .bonus-choices small { color: #d1b9d3; font-size: 10px; }
#buy-dialog .purchase-facts { background: #211f35b0; border-color: #e3c8dc35; border-radius: 5px; }
#buy-dialog .purchase-facts > div { border-color: #dbbed535; color: #c7b2cc; }
#buy-dialog .purchase-facts b { color: #f5e6da; }
#buy-dialog .purchase-facts div:nth-child(2) b { color: #ffd9b7; }
#buy-dialog .purchase-note { color: #c8b8ca; font-size: 11px !important; line-height: 1.55; }
#buy-dialog .cancel-buy { border-color: #d3b7d352; border-radius: 4px; color: #dac5de; background: #38264035; }
#buy-dialog .cancel-buy:hover { background: #59415e; border-color: #ddc0e096; }
#buy-dialog .dialog-error { color: #ffb9ad !important; }
#buy-dialog #buy-topup {
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 13px 0 9px;
  padding: 11px 14px;
  border: 1px solid #ecd3eea6;
  border-radius: 4px;
  background: linear-gradient(145deg, #dcc2ed, #b99ad4);
  color: #3c2949;
  box-shadow: inset 0 1px #fff0f075, 0 2px #765185;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.4;
  letter-spacing: .4px;
}
#buy-dialog #buy-topup:hover:not(:disabled) { background: linear-gradient(145deg, #f0ddf9, #cbb0e0); border-color: #fff0f4; transform: translateY(-1px); }
#buy-dialog #buy-topup:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }

/* Credits are clearly virtual, with three tactile denomination buttons. */
#wallet-dialog { background: radial-gradient(ellipse at 50% -10%, #b9819866, transparent 51%), linear-gradient(145deg, #47314f, #2a263e 75%); }
#wallet-dialog .wallet-hero { border-radius: 13px; border-color: #ffe8d498; background: linear-gradient(145deg, #ebc7d3, #b89ac9); box-shadow: inset 0 1px #fff0de, 5px 6px #38233f; transform: rotate(-7deg); }
#wallet-dialog .wallet-hero svg { stroke: #523851; }
#wallet-dialog h2 { font-size: 33px; }
#wallet-dialog .credit-options { gap: 10px; }
#wallet-dialog .credit-options button {
  min-height: 59px;
  border-color: #ffebdb;
  border-radius: 5px;
  background: linear-gradient(145deg, #f8e3ca, #e3c3d5 64%, #ceb3d3);
  color: #412e4b;
  box-shadow: inset 0 1px #fff5e1, 0 3px #8d6284;
  font-size: 16px;
  letter-spacing: -.25px;
}
#wallet-dialog .credit-options button:hover { background: linear-gradient(145deg, #fff1d5, #f0d2e3); border-color: #fff4dd; transform: translateY(-2px); }
#wallet-dialog .credit-options button:active { transform: translateY(2px); box-shadow: 0 1px #8d6284; }
#wallet-dialog > p:not(.dialog-subtitle) { color: #cbb6cf; }

/* Sound settings: compact, legible channels and a dedicated audition panel. */
#sound-dialog { width: min(600px, calc(100% - 28px)); max-width: 600px; padding: 27px; }
#sound-dialog[open] { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 22px; row-gap: 0; align-content: start; }
#sound-dialog > .dialog-top,
#sound-dialog > p,
#sound-dialog .sound-pack-field,
#sound-dialog .audio-preview-panel,
#sound-dialog .settings-toggles,
#sound-dialog .settings-links,
#sound-dialog > .primary-action { grid-column: 1 / -1; }
#sound-dialog .dialog-top { margin-bottom: 2px; }
#sound-dialog h2 { font-size: 35px; }
#sound-dialog > p { margin: 7px 0 14px; font-size: 12px; color: #ccb9d4; }
#sound-dialog > label { color: #f1e0e6; font-size: 12px; font-weight: 750; margin: 15px 0 10px; }
#sound-dialog output { color: #e5bfe6; font-size: 12px; }
#sound-dialog input[type=range] { height: 5px; background: #796486; accent-color: #efc9d6; margin: 18px 0 18px; }
#sound-dialog input[type=range]::-webkit-slider-thumb { width: 21px; height: 21px; border-color: #ffe6d2; background: linear-gradient(#ffe4c8, #d6b4d2); box-shadow: 0 2px 7px #1a143b85; }
#sound-dialog input[type=range]::-moz-range-thumb { width: 19px; height: 19px; border-color: #ffe6d2; background: #efd1d0; box-shadow: 0 2px 7px #1a143b85; }
#sound-dialog .sound-pack-field {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 9px;
  margin: 7px 0 15px;
  padding: 14px 15px;
  border: 1px solid #dfbfdf5e;
  border-left: 3px solid #d5addd;
  border-radius: 4px;
  background: linear-gradient(120deg, #7150773b, #2d243e47);
  color: #f0dbe7;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: .35px;
}
#sound-dialog .sound-pack-field small { font-size: 10px; font-weight: 500; line-height: 1.5; color: #cbb0d0; letter-spacing: 0; }
#sound-dialog #sound-pack {
  display: block;
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 9px 31px 9px 12px;
  border: 1px solid #e6c9e5a6;
  border-radius: 4px;
  background: linear-gradient(125deg, #65506f, #453151);
  color: #fff0dc;
  box-shadow: inset 0 1px #f6e3ed21, 0 2px #281f39;
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  text-overflow: ellipsis;
  color-scheme: dark;
}
#sound-dialog #sound-pack option { background: #342540; color: #ffeed9; }
#sound-dialog .audio-preview-panel { margin: 11px 0 17px; padding: 15px; border: 1px solid #e0bed14f; border-radius: 5px; background: #201f355c; }
#sound-dialog .audio-preview-panel h3 { margin: 0 0 6px; color: #f0d9eb; font-size: 10px; letter-spacing: 1.3px; }
#sound-dialog .audio-preview-panel p { color: #bfa9c9; font-size: 10px; line-height: 1.5; margin-bottom: 12px; }
#sound-dialog .audio-preview-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
#sound-dialog .audio-preview-grid button,
#sound-dialog :is(#preview-click, #sound-preview-click) {
  min-height: 43px;
  padding: 9px 7px;
  border: 1px solid #cfafd276;
  border-radius: 4px;
  background: linear-gradient(145deg, #665073, #473351);
  color: #f8e9e4;
  box-shadow: inset 0 1px #f5dbef19, 0 2px #251e34;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: .1px;
}
#sound-dialog .audio-preview-grid button:hover:not(:disabled),
#sound-dialog :is(#preview-click, #sound-preview-click):hover:not(:disabled) { background: linear-gradient(145deg, #8f6f94, #644368); border-color: #f2cbe8; transform: translateY(-1px); }
#sound-dialog .audio-preview-grid button:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }
#sound-dialog .audio-preview-grid button[aria-pressed=true] { background: linear-gradient(145deg, #f3d3d8, #ccaadd); border-color: #ffe6e5; color: #45304e; box-shadow: inset 0 1px #fff0de5e, 0 2px #73517f; }
#sound-dialog .audio-preview-grid [data-audio-preview=click] { border-color: #e2bac5a1; color: #f7d5c9; }
#sound-dialog #audio-preview-status { color: #edc7e7; margin: 12px 0 0; min-height: 0; }
#sound-dialog .settings-toggles { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin-top: 4px; border-top: 1px solid #d8bbd341; }
#sound-dialog .settings-toggles > label { min-height: 79px; border-bottom-color: #d2b5cf30; gap: 12px; }
#sound-dialog .settings-toggles b { color: #f0dfe4; font-size: 12px; line-height: 1.3; }
#sound-dialog .settings-toggles small { color: #bfa6c6; font-size: 10px; line-height: 1.4; margin-top: 5px; }
#sound-dialog .settings-toggles input { width: 39px; flex-basis: 39px; height: 24px; border-color: #ba99c480; background: #4a385d; }
#sound-dialog .settings-toggles input:before { width: 16px; height: 16px; left: 3px; top: 3px; background: #ddc8de; box-shadow: 0 2px 4px #2119314d; }
#sound-dialog .settings-toggles input:checked { background: #dcadd0; border-color: #f3d3e2; }
#sound-dialog .settings-toggles input:checked:before { background: #493052; transform: translateX(15px); }
#sound-dialog .settings-links { margin-top: 19px; gap: 10px; }
#sound-dialog .settings-links button { min-height: 43px; border-radius: 4px; border-color: #dfbdd468; background: #4b3657; color: #e6cde4; font-size: 9px; }
#sound-dialog .settings-links button:hover { background: #71517a; border-color: #ecc6e6a3; color: #fff0df; }
#sound-dialog > .primary-action { margin: 19px 0 2px; min-height: 44px; }
#history-dialog > .primary-action { margin-bottom: 2px; min-height: 44px; }

/* Rules and receipts carry the same warm print colour and lilac hierarchy. */
#rules .rules-lead { color: #d4bfd7; }
#rules .visual-guide { color: #e6d1df; }
#rules .visual-guide h3 { color: #fff0d5; }
#rules .guide-kicker { color: #d5ade6; }
#rules .guide-grid { background: radial-gradient(ellipse at top, #554362, #26263f); border-color: #dac2d9; box-shadow: 0 3px #33233e; }
#rules .guide-cell { background: #ecd8f10a; border-color: #f0d1ed16; }
#rules .guide-cell.lit { background: #ebabc028; border-color: #ffc8d5; box-shadow: inset 0 0 8px #ffbed00f; }
#rules .guide-cell i { background: #ffd2d2; color: #4b2c4c; }
#rules .guide-match-copy > strong { color: #f7e3d6; }
#rules .guide-match-copy > b { color: #eac2e8; }
#rules .guide-match-copy p { color: #c9b7d0; }
#rules .guide-flow { background: #24213a8a; border-color: #d1abd037; border-radius: 5px; }
#rules .guide-flow > i { color: #d9b2e2; }
#rules .guide-flow strong { color: #f0dee6; }
#rules .guide-flow small { color: #c4acd0; }
#rules .flow-pic { background: #4a3759; border-color: #d4b0d338; border-radius: 6px; }
#rules .flow-pic > b { background: #ecc8dd; color: #4a304e; }
#rules .cascade-pic > b { background: transparent; color: #eac6ec; }
#rules .cascade-pic em { color: #ffb9b7; }
#rules .guide-equation > span { color: #cdb3d1; }
#rules .guide-equation b { color: #ffe7ce; }
#rules .guide-equation i { color: #b18dc2; }
#rules .guide-equation .equation-result { border-color: #e0b9cf70; border-radius: 5px; background: #654258; }
#rules .guide-wallet { background: #4d354f; border-color: #d6b0cf77; border-radius: 5px; }
#rules .guide-wallet svg { stroke: #edc7df; }
#rules .guide-wallet span, #rules .guide-wallet b { color: #f4e2dc; }
#rules .guide-wallet small { color: #d2b4ce; }
#rules .guide-bonus { background: #34263f; border-color: #d0a4c35e; border-radius: 6px; }
#rules .guide-bonus-copy p { color: #d8bfd5; }
#rules .guide-bonus-copy p > b, #rules .guide-bonus-copy > strong { color: #eeddde; }
#rules .guide-bonus-copy p > span, #rules .guide-bonus-copy > small { color: #c6a8c8; }
#rules .guide-bonus-copy button { border-color: #e0b8d882; border-radius: 3px; background: #75537b; color: #f4e1e8; }
#rules .super .guide-bonus-copy button { border-color: #ecd0bc80; background: #835967; color: #ffe3ce; }
#rules .guide-bonus-copy button:hover { background: #926794; }
#rules .guide-caution { color: #c9b2c8; }
#rules .guide-credit > div { background: #46334d; border-color: #d3b0ce4f; border-radius: 5px; }
#rules .guide-credit > div + div { background: #554054; border-color: #d4b7c44a; }
#rules .guide-credit span { color: #d9b4d7; }
#rules .guide-credit b { color: #f1e0de; }
#rules .guide-credit small { color: #c7afc8; }
#rules .full-rules { border-color: #d3b0ce3a; }
#rules .full-rules summary { color: #eed5e5; }
#rules .full-rules p, #rules .full-rules li { color: #cbb7cf; }
#rules .rule-options { border-color: #d3b0ce3a; color: #dac1d6; }
#rules .rule-options input { accent-color: #d7acd8; }
#rules .rule-options > span { color: #bfa4c5; }
:is(#rules, #history-dialog) table { color: #e9d8e1; }
:is(#rules, #history-dialog) th { color: #d1afd6; background: #261f37b0; }
:is(#rules, #history-dialog) :is(th, td) { border-bottom-color: #c9a7c831; }
:is(#rules, #history-dialog) td:first-child { color: #e7cce1; }
:is(#rules, #history-dialog) tbody tr:nth-child(even) { background: #ecc6e807; }
#history-dialog > p { color: #c9b3cf; }
#history-dialog #view-receipt { border-color: #dab8cd67; border-radius: 5px; background: linear-gradient(120deg, #7f4f6942, #49304f72); color: #f3d9db !important; }
#history-dialog .history-wrap { border-color: #d0acce46; border-radius: 5px; }
#history-dialog .history-wrap td { color: #f1dfdf; }
#history-dialog .history-wrap td:first-child { color: #d1b1d4; }
#history-dialog #history-empty { color: #d0b5d1; }

/* Clear focus and inactive states do not rely on the background image. */
.top-actions :is(button, select):focus-visible,
.controls :is(button, select):focus-visible,
.combo-panel button:focus-visible,
.receipt-line:focus-visible,
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) :is(button, select, input, summary, a):focus-visible {
  outline: 3px solid #ffd9ed;
  outline-offset: 4px;
}
.top-actions button:disabled,
.controls button:disabled:not(.spin),
:is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) button:disabled { cursor: default; filter: saturate(.5); transform: none; }

/* The game keeps its tested geometry; only service-window layout adapts here. */
@media (max-width: 700px) {
  .top-actions .balance { border-radius: 6px; }
  .top-actions .icon-button { border-radius: 5px; }
  .balance small { font-size: 6.5px; letter-spacing: .5px; }
  .preview-mode .balance small:after { font-size: 5.5px; color: #795274; }
  .controls { border-radius: 7px; }
  .spin { border-radius: 6px; letter-spacing: .5px; }
  .spin:before { border-radius: 3px; }
  .buy-ticket { border-radius: 4px; }
  .combo-panel { border-radius: 5px; }
  .combo-panel button { border-radius: 3px; }
  .round-total, .sun-meter, .feature-rail .bonus-sign { border-radius: 5px; }
  :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) { border-radius: 7px; }
  :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) :is(.dialog-close, .dialog-top .icon-button) { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  #buy-dialog { padding-top: 24px; }
  #buy-dialog h2 { font-size: 33px; }
  #buy-dialog .bonus-choices { gap: 10px; }
  #buy-dialog .choice-art { height: 128px; }
  #buy-dialog .bonus-choices strong { font-size: 10px; }
  #buy-dialog .bonus-choices small { font-size: 9px; }
  #buy-dialog .purchase-facts > div { font-size: 11px; }
  #buy-dialog .purchase-note { font-size: 10px !important; line-height: 1.55; }
  #wallet-dialog h2 { font-size: 29px; }
  #wallet-dialog .credit-options { gap: 7px; }
  #wallet-dialog .credit-options button { min-height: 55px; font-size: 14px; }
  #sound-dialog { padding: 22px 18px; width: calc(100% - 22px); }
  #sound-dialog[open] { column-gap: 16px; }
  #sound-dialog h2 { font-size: 31px; }
  #sound-dialog > p { font-size: 11px; line-height: 1.55; margin-bottom: 12px; }
  #sound-dialog > label { font-size: 11px; margin-top: 12px; }
  #sound-dialog output { font-size: 11px; }
  #sound-dialog .sound-pack-field { padding: 12px; margin-block: 7px 13px; font-size: 11px; }
  #sound-dialog #sound-pack { height: 43px; font-size: 11px; }
  #sound-dialog .audio-preview-panel { padding: 12px; margin-block: 9px 15px; }
  #sound-dialog .audio-preview-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  #sound-dialog .audio-preview-grid button { min-height: 43px; padding: 8px 6px; font-size: 10px; }
  #sound-dialog .settings-toggles { grid-template-columns: 1fr; gap: 0; }
  #sound-dialog .settings-toggles > label { min-height: 63px; gap: 15px; padding-block: 12px; }
  #sound-dialog .settings-toggles b { font-size: 12px; }
  #sound-dialog .settings-toggles small { font-size: 10px; }
  #sound-dialog .settings-links { margin-top: 16px; gap: 9px; }
  #sound-dialog .settings-links button { font-size: 8px; min-height: 42px; }
  #rules .guide-flow strong { font-size: 10px; }
  #rules .guide-credit b { font-size: 12px; }
  #history-dialog #view-receipt { font-size: 12px !important; }
  #history-dialog .history-wrap th { font-size: 8px; }
  #history-dialog .history-wrap td { font-size: 10px; }
}

@media (max-width: 370px) {
  .balance small { font-size: 5.8px; letter-spacing: .25px; }
  #buy-dialog h2 { font-size: 30px; }
  #buy-dialog .bonus-choices { gap: 8px; }
  #buy-dialog .choice-art { height: 116px; }
  #buy-dialog .bonus-choices strong { font-size: 9px; }
  #buy-dialog .bonus-choices small { font-size: 8px; }
  #wallet-dialog h2 { font-size: 26px; }
  #wallet-dialog .credit-options button { min-height: 53px; font-size: 13px; }
  #sound-dialog[open] { column-gap: 14px; }
  #sound-dialog .audio-preview-grid button { font-size: 9px; }
  #sound-dialog .settings-links { grid-template-columns: 1fr; }
}

/* Existing preference overrides remain authoritative, including zero motion. */
.no-motion .top-actions *, .no-motion .controls *, .no-motion .combo-panel *,
.no-motion :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules),
.no-motion :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) * {
  animation: none !important;
  transition: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .top-actions *, .controls *, .combo-panel *,
  :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules),
  :is(#buy-dialog, #wallet-dialog, #sound-dialog, #history-dialog, #rules) * {
    animation: none !important;
    transition: none !important;
  }
}
/* The NITRO value belongs in a separate badge; the collectible and its lettering stay visible. */
.sun-meter>strong{left:auto;right:10px;top:12px;transform:none;border:1px solid #b6ffe9;border-radius:8px;padding:3px 6px;background:#143d4ded;line-height:1.05;box-shadow:0 2px #081e38;min-width:0}
@media(max-width:700px){.sun-meter>strong{right:3px;top:4px;padding:2px 4px;border-radius:6px;font-size:18px}.sun-meter>svg{left:50%;transform:translateX(-50%);top:1px}}
/* Mobile multiplier collectible stays inside its own card, including short phones. */
@media(max-width:700px){.sun-meter>svg{left:0!important;right:auto!important;top:1px!important;width:100%!important;height:calc(100% - 12px)!important;transform:none!important}.sun-meter>strong{left:auto!important;right:3px!important;top:4px!important;transform:none!important;font-size:16px}}

/* Original crystal annulus selected by the user. The glass center and label
   stay fixed; spin-wheel.mjs accelerates and settles only the outer artwork. */

#spin.spin {
  --wheel-size: 88px;
  --hub-size: 46px;
  --action-paper: #fff8dd;
  width: min(100%, 158px);
  max-width: 158px;
  min-width: 0;
  height: 100px;
  min-height: 100px;
  padding: 0 5px 1px;
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  justify-self: center;
  align-self: center;
  gap: 0;
  overflow: visible;
  border: 0;
  border-radius: 50% 50% 18px 18px;
  background: transparent;
  color: var(--action-paper);
  box-shadow: none;
  text-shadow: none;
  opacity: 1;
  filter: none;
  transform: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: transform 140ms ease;
}
#spin.spin::before,
#spin.spin::after,
#spin.spin:not(:disabled):hover::after {
  content: none;
  display: none;
  animation: none;
  transition: none;
  transform: none;
}

#spin.spin .spin-wheel {
  position: absolute;
  top: 0;
  left: calc(50% - var(--wheel-size) / 2);
  display: grid;
  place-items: center;
  width: var(--wheel-size);
  height: var(--wheel-size);
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: 0 5px 18px #04142d66;
  pointer-events: none;
  transition: box-shadow 150ms ease;
}
#spin.spin .spin-wheel::before {
  content: '';
  position: absolute;
  inset: 2px;
  border: 0;
  border-radius: 50%;
  background: conic-gradient(#00ffd744, #f325a63d, #00d8ff52, #cb5aff33, #00ffd744);
  box-shadow: 0 0 20px #09f5d52b, 0 0 25px #df23ca24;
  opacity: .8;
  pointer-events: none;
}
#spin.spin .spin-rim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 3px 1px #8c4e305c);
  transform: rotate(0);
  animation: none;
  transition: none;
}
#spin.spin .spin-wheel::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(110deg, transparent 35%, #fffde800 42%, #fffbdedb 49%, #a2ffe888 55%, transparent 63%);
  mask-image: radial-gradient(closest-side, transparent 0 61%, black 64% 92%, transparent 97%);
  pointer-events: none;
  opacity: 0;
}
#spin.spin .spin-hub {
  position: relative;
  top: -2px;
  display: grid;
  place-items: center;
  width: var(--hub-size);
  height: var(--hub-size);
  padding: 0;
  overflow: hidden;
  border: 2px solid #ffe7a5;
  border-radius: 50%;
  background: radial-gradient(ellipse at 28% 11%, #e8ffed, #86ffdd 18%, transparent 51%), linear-gradient(150deg, #31f5d2, #03c8ca 49%, #087eac 79%, #26519a);
  box-shadow: inset 0 2px 1px #f0fff7, inset 0 -4px 4px #084d82a6, inset 0 0 0 2px #94ffe57d, 0 0 0 2px #674936, 0 3px 0 2px #a86c34, 0 5px 8px #03283b80;
  transition: transform 100ms ease, box-shadow 100ms ease;
}
#spin.spin .spin-hub::before {
  content: '';
  position: absolute;
  inset: 3px 5px 52%;
  border-radius: 50% 50% 42% 42%;
  background: linear-gradient(180deg, #ffffffb8, #dbfff826 72%, transparent);
  transform: rotate(-12deg);
  pointer-events: none;
}
#spin.spin .spin-hub::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 18%, #fff8ccca, #a4ffda4d 47%, transparent 75%);
  opacity: 0;
  pointer-events: none;
}
#spin.spin .spin-hub > svg {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 34px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fffbd5;
  fill: none;
  stroke: none;
  stroke-width: 0;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 2px 0 #70421c) drop-shadow(0 0 3px #ffde8280);
  box-shadow: none;
  transform: none;
  animation: none;
  transition: none;
}
#spin.spin .spin-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 1px 7px;
  border: 1px solid #fff3b8;
  border-radius: 12px 12px 18px 18px / 8px 8px 15px 15px;
  background: linear-gradient(110deg,#25ead7 0 4%,transparent 4% 96%,#ff4a91 96%),linear-gradient(160deg,#1e5370,#142f49 54%,#351d48);
  box-shadow: inset 0 1px #92ffe8, inset 0 -2px #ff4a915c, -2px 0 #39e3d5, 2px 0 #ff4a91, 0 3px #ce527f, 0 5px #0b1e36;
  transition: background 150ms ease, box-shadow 150ms ease;
}
#spin.spin #spin-label {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: #fff2c2;
  font-family: var(--finish-display, Impact, 'Arial Narrow', sans-serif);
  font-size: 22px;
  font-weight: 900;
  font-style: italic;
  line-height: 1;
  letter-spacing: 1px;
  text-align: center;
  text-shadow: 1px 1px #105d6a, 2px 2px #ea4b7c;
  white-space: nowrap;
}
#spin.spin #spin-hint {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: #b9fff1;
  font-family: var(--finish-body, 'Trebuchet MS', sans-serif);
  font-size: 7px;
  font-weight: 850;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: .4px;
  text-align: center;
  text-shadow: none;
  white-space: normal;
}
#spin.spin #spin-hint:empty { display: none; }
/* An original neon roadside plaque: twin speed cuts, raised italic letters,
   mint left edge and pink right edge. Geometry stays within the old plate. */
#spin.spin .spin-copy::before, #spin.spin .spin-copy::after { content:'';position:absolute;top:7px;width:12px;height:14px;pointer-events:none;background:repeating-linear-gradient(-32deg,transparent 0 4px,#86fff0 4px 6px,transparent 6px 8px);opacity:.85; }
#spin.spin .spin-copy::before { left:8px; }
#spin.spin .spin-copy::after { right:8px;background:repeating-linear-gradient(-32deg,transparent 0 4px,#ff78b4 4px 6px,transparent 6px 8px); }
#spin.spin.tap-burst .spin-copy::before, #spin.spin.tap-burst .spin-copy::after { animation:arcade-plaque-trail 350ms ease-out both; }
@keyframes arcade-plaque-trail { 0% { opacity:.3;transform:translateX(-2px); } 45% { opacity:1; } 100% { opacity:.85;transform:none; } }


#spin.spin:not(:disabled):hover {
  border: 0;
  background: transparent;
  color: var(--action-paper);
  box-shadow: none;
  filter: none;
  transform: translateY(-1px);
}
#spin.spin:not(:disabled):hover .spin-wheel { box-shadow: 0 0 20px #16e6d740, 0 0 28px #fb288930; }
#spin.spin:not(:disabled):hover .spin-copy { background: linear-gradient(110deg,#6dffe2 0 4%,transparent 4% 96%,#ff6baa 96%),linear-gradient(160deg,#226984,#183b56 54%,#492455); }
#spin.spin:not(:disabled):active {
  background: transparent;
  box-shadow: none;
  transform: translateY(3px);
}
#spin.spin:not(:disabled):active .spin-hub::after { opacity: .85; }
#spin.spin:not(:disabled):active .spin-hub { transform: translateY(2px) scale(.97); box-shadow: inset 0 3px 6px #085d795c, inset 0 0 0 2px #adffdd89, 0 0 0 2px #a86c34; }
#spin.spin:not(:disabled):active .spin-copy { box-shadow: inset 0 2px 5px #c37a3440, 0 1px #a55b38, 0 2px #172c42; }
#spin.spin.tap-burst .spin-hub::after { animation: arcade-press-light 300ms ease-out both; }
#spin.spin.tap-burst .spin-hub { animation: arcade-hub-press 260ms ease-out both; }
#spin.spin.ring-settled .spin-hub::after { animation: arcade-press-light 360ms ease-out both; }
#spin.spin.ring-settled .spin-wheel::after { animation: arcade-facet-glint 360ms ease-out both; }
#spin.spin:focus-visible { outline: 3px solid #91ffe0; outline-offset: 6px; }

/* A sculpted ignition bolt: press, charge and one glint at reel stop.
   No idle animation, and no association with a winning outcome. */
#spin.spin .spin-bolt { transform-origin: 50% 55%; }
#spin.spin.tap-burst .spin-bolt { animation: arcade-bolt-ignite 430ms cubic-bezier(.2,.7,.3,1) both; }
#spin.spin.ring-running .spin-hub::after { opacity: .3; }
#spin.spin.ring-settled .spin-bolt { animation: arcade-bolt-settle 360ms ease-out both; }
@keyframes arcade-bolt-ignite { 0% { transform: translateY(2px) scale(.8) rotate(-10deg); } 42% { transform: translateY(-1px) scale(1.12) rotate(4deg); } 100% { transform: none; } }
@keyframes arcade-bolt-settle { 0%, 100% { filter: drop-shadow(0 2px #70421c); } 40% { filter: drop-shadow(0 0 6px #fff4b6); } }

/* Disabled remains readable; the active round uses the same saturated wheel. */
#spin.spin:disabled {
  border: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  filter: none;
  transform: none;
  cursor: default;
}
#spin.spin:disabled .spin-wheel { filter: saturate(.48); }
#spin.spin:disabled .spin-copy { background:linear-gradient(160deg,#314550,#283142); border-color:#9caca3; box-shadow:inset 0 1px #e4f7ec36,0 3px #243144; }
#spin.spin:disabled #spin-label { color: #d1d7cf; }
#spin.spin:disabled #spin-hint { color: #aec4bf; }
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) {
  border: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  filter: none;
  transform: none;
  cursor: progress;
}
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) .spin-wheel { filter: none; }
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) .spin-rim { animation: none; }
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) .spin-copy { background:linear-gradient(110deg,#4bf0dd 0 4%,transparent 4% 96%,#ff619d 96%),linear-gradient(160deg,#254c70,#162d4c 54%,#44214d);border-color:#fff3b8;box-shadow:inset 0 1px #92ffe8,0 3px #ce527f,0 5px #0b1e36; }
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) #spin-label { color: #fff2c2; }
#spin.spin:is(.busy, .loading, [aria-busy=true], [data-state=loading]) #spin-hint { color: #b9fff1; }
#spin.spin:is([data-state=bonus-waiting], [data-state=bonus-ready], [data-state=bonus-trigger]) .spin-wheel { filter: none; }
#spin.spin:is([data-state=bonus-waiting], [data-state=bonus-ready], [data-state=bonus-trigger]) .spin-rim { animation: none; }
#spin.spin:is([data-state=bonus-waiting], [data-state=bonus-ready], [data-state=bonus-trigger]) .spin-copy { background:linear-gradient(110deg,#5dffe2 0 4%,transparent 4% 96%,#ff60b0 96%),linear-gradient(150deg,#174e5d,#153344 49%,#40234b);border-color:#fff4bd;box-shadow:inset 0 1px #b6ffed,0 3px #cc4c86,0 5px #0b1e36; }
#spin.spin:is([data-state=bonus-waiting], [data-state=bonus-ready], [data-state=bonus-trigger]) #spin-label { color: #fff2c2; }
#spin.spin:is([data-state=bonus-waiting], [data-state=bonus-ready], [data-state=bonus-trigger]) #spin-hint { color: #b9fff1; }
@keyframes arcade-press-light { 0% { opacity: 0; } 25% { opacity: .95; } 100% { opacity: 0; } }
@keyframes arcade-hub-press { 0% { transform: translateY(2px) scale(.95); } 75% { transform: translateY(-.5px) scale(1.025); } 100% { transform: none; } }
@keyframes arcade-facet-glint { 0% { opacity: 0; transform: rotate(-55deg); } 35% { opacity: .8; } 100% { opacity: 0; transform: rotate(55deg); } }

@media (max-width: 700px) {
  #spin.spin {
    --wheel-size: 78px;
    --hub-size: 42px;
    width: 100%;
    max-width: 148px;
    height: 92px;
    min-height: 92px;
    padding: 0 2px 1px;
  }
  #spin.spin .spin-hub { top: -3px; padding: 0; border-width: 1.5px; }
  #spin.spin .spin-hub > svg { width: 25px; height: 30px; }
  #spin.spin .spin-copy { min-height: 32px; padding: 1px 4px; border-radius: 10px 10px 15px 15px / 7px 7px 12px 12px; }
  #spin.spin #spin-label { font-size: 20px; letter-spacing: .65px; }
  #spin.spin #spin-hint { margin-top: 0; font-size: 6.5px; letter-spacing: .1px; }
}
@media (max-width: 370px) {
  #spin.spin { padding-inline: 1px; }
  #spin.spin .spin-copy { padding-inline: 3px; }
  #spin.spin #spin-label { font-size: 18px; letter-spacing: .35px; }
  #spin.spin #spin-hint { font-size: 6px; letter-spacing: 0; }
}

.no-motion #spin.spin,
.no-motion #spin.spin *,
.no-motion #spin.spin *::before,
.no-motion #spin.spin *::after { animation: none !important; transition: none !important; }
.no-motion #spin.spin,
.no-motion #spin.spin .spin-rim { transform: none !important; }
@media (prefers-reduced-motion: reduce) {
  #spin.spin, #spin.spin *, #spin.spin *::before, #spin.spin *::after { animation: none !important; transition: none !important; }
  #spin.spin, #spin.spin .spin-rim { transform: none !important; }
}

/* Keep the primary plaque bright on desktop hover and Safari's sticky touch
   hover, including the running and bonus-wait states. Disabled stays explicit. */
#spin.spin .spin-copy,
#spin.spin:not(:disabled):hover .spin-copy,
#spin.spin:not(:disabled):active .spin-copy,
#spin.spin:is(.busy,.loading,[aria-busy=true],[data-state=loading],[data-state=bonus-waiting],[data-state=bonus-ready],[data-state=bonus-trigger]) .spin-copy {
 background:linear-gradient(112deg,#6af5d6 0 6%,transparent 6% 94%,#ff659e 94%),linear-gradient(170deg,#fffbd8,#ffe07d 65%,#ffba5e);
 border-color:#fff9dc;
 box-shadow:inset 0 2px #fffdeb,inset 0 -2px #eea84c80,0 3px #b45563,0 5px #0b253c;
}
#spin.spin #spin-label,
#spin.spin:not(:disabled):hover #spin-label,
#spin.spin:is(.busy,.loading,[aria-busy=true],[data-state=bonus-waiting],[data-state=bonus-ready],[data-state=bonus-trigger]) #spin-label {color:#113d50;text-shadow:0 1px #fff7d2,1px 2px #ee8765}
#spin.spin #spin-hint,
#spin.spin:not(:disabled):hover #spin-hint,
#spin.spin:is(.busy,.loading,[aria-busy=true],[data-state=bonus-waiting],[data-state=bonus-ready],[data-state=bonus-trigger]) #spin-hint {color:#3c5154}
#spin.spin .spin-copy::before,#spin.spin .spin-copy::after{content:none}
#spin.spin.tap-burst .spin-wheel::after{animation:arcade-facet-ignite 430ms ease-out both}
@keyframes arcade-facet-ignite{0%{opacity:0;transform:rotate(-60deg)}25%{opacity:.9}75%{opacity:.5}100%{opacity:0;transform:rotate(115deg)}}
#spin.spin.tap-burst .spin-copy{animation:arcade-plaque-press 230ms ease-out both}
@keyframes arcade-plaque-press{0%,100%{translate:0 0}40%{translate:0 2px}}

/* HEATLANE — enamel switches, a cream instrument face and a hot-pink BONUS plaque.
   The established control grid and touch targets remain authoritative. */

.controls {
  position: relative;
  border: 1px solid transparent;
  border-radius: 16px;
  background:
    radial-gradient(ellipse at 0 0, #12c6a649, transparent 43%) padding-box,
    radial-gradient(ellipse at 100% 110%, #ff26792e, transparent 47%) padding-box,
    linear-gradient(125deg, #125854fa, #15394ff5 49%, #642744f0) padding-box,
    linear-gradient(115deg, #bdffe8, #18bfa4 29%, #fff3d8 60%, #ff659b) border-box;
  box-shadow: inset 0 1px #e0fff869, inset 0 -3px #061a2c9c, 0 4px #0a2338d9, 0 9px 24px #051c3666;
}
.controls::before {
  content: '';
  position: absolute;
  inset: 3px 13px auto;
  height: 1px;
  background: linear-gradient(90deg, #a8ffea99, transparent 31%, #ffe2d7aa 70%, transparent);
  pointer-events: none;
}
.controls .stake-top label { color: #d5fff0; text-shadow: 0 1px #072336; letter-spacing: .75px; }
.controls #speed {
  position: relative;
  border: 1px solid #bcffe1a1;
  border-radius: 5px;
  background: linear-gradient(160deg, #138e82, #0b4d61);
  color: #e8ffec;
  box-shadow: inset 0 1px #d4ffe42b, 0 2px #0a2f42;
  font-weight: 850;
  text-shadow: 0 1px #103544;
}
.controls #speed:hover:not(:disabled) { border-color: #efffdb; background: linear-gradient(160deg, #458a7e, #205d68); }
.controls #speed[aria-pressed=true] { background: linear-gradient(160deg, #d3ffd3, #89efc7); color: #123b45; text-shadow: none; border-color: #fff5d0; box-shadow: inset 0 1px #fffdea, 0 2px #4b8c7f; }
.controls .stake-input { gap: 5px; }
.controls .stake-input :is(button,input) {
  border: 1px solid #f5f0d9;
  border-radius: 7px;
  color: #19384b;
  background: linear-gradient(165deg, #f5ffdd, #bcffe4 41%, #62cfc2 44%, #bcf5dc 79%, #f2ffe6);
  box-shadow: inset 0 1px #fffce6, inset 0 -1px #3a71854f, 0 3px #255163, 0 4px #a3dcda38;
  text-shadow: 0 1px #ffffff6b;
}
.controls .stake-input button { font-size: 24px; font-weight: 700; }
.controls .stake-input input { background: linear-gradient(165deg, #fffce6, #ffeac0); color: #172e40; border-color: #fff5d7; box-shadow: inset 0 2px 4px #94634933, 0 2px #567277; font-weight: 900; font-variant-numeric: tabular-nums; }
.controls .stake-input button:hover:not(:disabled) { background: linear-gradient(165deg, #fffde4, #d4ffe8 49%, #b0e8d9 50%, #f2fff0); border-color: #fffada; transform: translateY(-1px); }
.controls .stake-input button:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 2px 4px #31627440, 0 1px #285266; }

:is(.controls,.feature-rail) .buy-ticket {
  position: relative;
  isolation: isolate;
  overflow: visible;
  min-height: 44px;
  border: 1px solid #ffdaba;
  border-radius: 5px 14px 5px 14px;
  background: radial-gradient(ellipse at 0 50%, #ff694f8a, transparent 48%), linear-gradient(115deg, #f5196a 0%, #d30761 46%, #b00c57 100%);
  color: #fff8df;
  box-shadow: inset 0 1px #fff0c9aa, inset 0 -2px #69113680, 0 3px #681746, 0 5px #ff89ae40, 0 5px 17px #ff2b761c;
  text-shadow: 0 1px 1px #731b44;
  font-weight: 950;
  letter-spacing: .55px;
}
:is(.controls,.feature-rail) .buy-ticket::before {
  content: '';
  position: absolute;
  inset: 3px;
  border: 1px solid #ffd7c440;
  border-top-color: #fff2d483;
  border-radius: 2px 11px 2px 11px;
  background: linear-gradient(115deg, #ffffff0f, transparent 50%);
  pointer-events: none;
  z-index: -1;
}
:is(.controls,.feature-rail) .buy-ticket > svg { pointer-events:none; filter: drop-shadow(0 2px 1px #501043) drop-shadow(0 0 5px #7ffff547); transform: rotate(-5deg) scale(1.12); }
:is(.controls,.feature-rail) .buy-ticket small { color: #fff0d0; font-weight: 800; letter-spacing: .35px; }
:is(.controls,.feature-rail) .buy-ticket:hover:not(:disabled) { background: radial-gradient(ellipse at 0 50%, #ff956399, transparent 48%), linear-gradient(115deg, #ff266c, #e91268 50%, #c5106b); border-color: #fff3d3; box-shadow: inset 0 1px #fff8d5, 0 4px #731544, 0 7px 18px #ff367a36; transform: translateY(-1px); filter: none; }
:is(.controls,.feature-rail) .buy-ticket:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 2px 4px #63082f77, 0 1px #671642; }
.controls .round-tools { gap: 6px; }
.controls .round-tools button {
  border: 1px solid #c4d8f280 !important;
  border-radius: 5px;
  background: linear-gradient(155deg, #3c7c8d, #184153);
  color: #eaf8ee;
  box-shadow: inset 0 1px #e6f1ff35, 0 2px #1c2846;
  letter-spacing: .5px;
}
.controls .round-tools button + button { border: 1px solid #e4cde580 !important; padding-left: 7px !important; background: linear-gradient(155deg, #735071, #3e2c50); color: #fff0e7; }
.controls .round-tools button:hover:not(:disabled) { color: #fffbd8; border-color: #fff0d0 !important; background: linear-gradient(155deg, #827eac, #514c7b); transform: translateY(-1px); }
.controls .round-tools button:active:not(:disabled) { transform: translateY(1px); box-shadow: inset 0 1px 3px #13203c60; }
.controls :is(#speed,.stake-input button,.stake-input input,.buy-ticket,.round-tools button):disabled {
  opacity: .66;
  filter: saturate(.7);
  cursor: default;
  transform: none;
}

/* The same two materials in the header: cool chrome switches, warm wallet. */
.top-actions .icon-button {
  border: 1px solid #d9fbeac9;
  border-radius: 9px;
  background: linear-gradient(155deg, #80d6c9 0%, #24918f 35%, #12516a 38%, #28657a);
  color: #f8ffde;
  box-shadow: inset 0 2px #ebfff391, inset 0 -1px #09394e80, 0 3px #0b2942, 0 4px #60d7c970;
}
.top-actions .icon-button:hover:not(:disabled) { background: linear-gradient(155deg, #baffdc, #3ebfa5 36%, #14708a 39%, #258597); border-color: #fff9d5; color: #fffbdc; }
.top-actions .icon-button[aria-pressed=true] { background: linear-gradient(145deg, #dffff0, #9ae1d6 47%, #73b6bb 49%, #d3fbe3); color: #1e4259; border-color: #fff6d0; }
.top-actions .balance {
  border: 1px solid #fff9d9;
  border-radius: 11px;
  background: linear-gradient(165deg, #ffffec, #fff4cf 43%, #efd29b 46%, #ffebc4 68%, #fff4d8);
  box-shadow: inset 0 2px #fffef0, inset 0 -2px #b986554a, 0 3px #605161, 0 5px #ffdfad8c, 0 8px 20px #071f354d;
}
.top-actions .balance small { color: #59435a; }
.top-actions .balance strong { color: #142e42; text-shadow: 0 1px #fffce5; font-variant-numeric: tabular-nums; }
.top-actions .wallet-add {
  border: 1px solid #fff2d9;
  border-radius: 7px;
  background: linear-gradient(160deg, #ffb685, #ff6682 43%, #db235e 47%, #f34576);
  color: #fff8dd;
  box-shadow: inset 0 2px #ffecd4b3, 0 3px #9b2357;
  text-shadow: 0 1px #98234e;
}
.top-actions .wallet-add:hover:not(:disabled) { background: linear-gradient(160deg, #ffd299, #ff8290 43%, #f0356f 47%, #ff6487); color: #fffbe5; }
.controls :is(button,select,input):focus-visible, .top-actions button:focus-visible { outline: 3px solid #c4ffed; outline-offset: 4px; }
.receipt-line { border-color: #caeee48c; background: linear-gradient(105deg, #24465adf, #302b49e8 52%, #59405bdd); box-shadow: inset 0 1px #e4f5e819; }
.receipt-line b { color: #ffe6bd; }
.receipt-line > i { color: #e6d5ff; }

@media (min-width: 701px) {
  .top-actions .icon-button { min-width: 44px; min-height: 44px; }
}
@media (max-width: 700px) {
  .topbar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; align-items: center; }
  .topbar .brand { min-width: 0; }
  .topbar .brand span { font-size: 11px; letter-spacing: 1.7px; }
  .topbar .brand strong { font-size: 34px; letter-spacing: 1px; }
  .topbar .brand small { font-size: 5px; letter-spacing: 0; max-width: 84px; }
  .top-actions { gap: 4px; }
  .top-actions .icon-button { width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: 0 0 44px; }
  .top-actions .balance { width: 146px; min-width: 0; gap: 5px; padding: 5px !important; }
  .top-actions .balance > div { min-width: 0; flex: 1; }
  .top-actions .balance strong { font-size: 18px; letter-spacing: -.65px; white-space: nowrap; }
  .top-actions .balance small { font-size: 6px; letter-spacing: .35px; }
  .top-actions .wallet-add { width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: 0 0 44px; font-size: 25px; }
  .controls { border-radius: 13px; }
  /* A full-width amount display above three 44px switches keeps long stakes
     readable without adding another control row to the rest of the console. */
  .controls .stake { position: relative; display: grid; grid-template-columns: 44px minmax(44px,1fr) 44px; grid-template-rows: 44px 44px; gap: 4px; min-width: 0; }
  .controls .stake-top, .controls .stake-input { display: contents; }
  .controls .stake-top label { position: absolute; z-index: 1; top: 4px; left: 7px; right: 7px; margin: 0; color: #43616a; font-size: 6.5px; letter-spacing: .2px; line-height: 1.4; text-shadow: none; white-space: nowrap; }
  .controls .stake-top label .stake-currency { color: #275461; }
  .controls #speed { grid-column: 2; grid-row: 2; width: 100%; min-width: 44px; height: 44px; min-height: 44px; max-width: none; padding: 3px 1px; font-size: 6px; line-height: 1.45; letter-spacing: 0; white-space: normal; }
  .controls .stake-input :is(button,input) { height: 44px; min-height: 44px; min-width: 0; border-radius: 6px; }
  .controls .stake-input button { grid-row: 2; min-width: 44px; font-size: 23px; }
  .controls #minus { grid-column: 1; }
  .controls #plus { grid-column: 3; }
  .controls .stake-input input { grid-column: 1 / -1; grid-row: 1; width: 100%; min-width: 0; padding: 12px 7px 1px; font-size: 16px; line-height: 1.2; letter-spacing: 0; appearance: none; -webkit-appearance: none; text-align: center; cursor: text; }
  .combo-panel button { min-height: 44px; min-width: 44px; }
  .controls .buy-ticket { border-radius: 7px; }
  .controls .secondary { grid-template-columns: minmax(0,1fr) 92px; gap: 8px; }
  .controls .round-tools { display: grid; grid-template-columns: 44px 44px; gap: 4px; }
  .controls .round-tools button { width: 44px; min-width: 44px; min-height: 44px !important; padding: 4px 1px !important; font-size: 7px !important; letter-spacing: 0; line-height: 1.35; }
  .controls .round-tools button + button { padding-left: 1px !important; }
  .top-actions .icon-button { border-radius: 7px; }
  .top-actions .balance { border-radius: 9px; }
}
@media (max-width: 370px) {
  .topbar { gap: 4px; }
  .topbar .brand span { font-size: 9px; letter-spacing: 1.2px; }
  .topbar .brand strong { font-size: 27px; letter-spacing: .7px; }
  .topbar .brand small { font-size: 4.5px; max-width: 66px; margin-top: 5px; line-height: 1.2; }
  .top-actions { gap: 3px; }
  .top-actions .balance { width: 132px; gap: 4px; }
  .top-actions .balance strong { font-size: 15px; letter-spacing: -.65px; }
  .top-actions .balance small { font-size: 5.2px; letter-spacing: .1px; }
  .controls { grid-template-columns: 140px minmax(0,1fr); column-gap: 6px; }
  .controls .secondary { gap: 6px; }
  .controls .buy-ticket { gap: 3px; padding-inline: 5px; font-size: 9px; letter-spacing: .1px; }
  .controls .buy-ticket > svg { width: 27px; height: 27px; }
  .controls .buy-ticket small { font-size: 7.5px; }
  .controls .stake-top label { letter-spacing: .35px; }
}
.no-motion .controls *, .no-motion .top-actions * { transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  .controls *, .top-actions * { transition: none !important; }
}

/* The bonus route occupies the existing marquee row; it must never steal
   height from the 6×5 field. Cabinet/board dimensions are untouched. */
.game .cabinet > .pursuit-hud { position:absolute; top:0; left:0; right:0; height:25px; min-height:25px; margin:0; z-index:2; }
.bonus-active .cabinet > .marquee { visibility:hidden; }
@media(max-width:700px) { .game .cabinet > .pursuit-hud { height:24px; min-height:24px; } }

/* A larger bonus target inside the same console height budget. */
@media(min-width:1051px) { .controls { grid-template-columns:177px minmax(170px,1fr)244px; } }
@media(min-width:701px) {
  .controls .buy-ticket { min-height:48px; font-size:13px; padding:3px 10px; gap:10px; }
  .controls .buy-ticket > svg { width:41px; height:41px; flex:0 0 41px; }
  .controls .buy-ticket small { font-size:10px; margin-top:3px; }
}
@media(max-width:700px) {
  .controls .buy-ticket { min-height:44px; font-size:11px; }
  .controls .buy-ticket > svg { width:29px; height:29px; flex-basis:29px; }
}
@media(max-width:370px) {
  .controls .buy-ticket { font-size:9px; padding-inline:3px; gap:2px; }
  .controls .buy-ticket > svg { width:24px; height:24px; flex-basis:24px; }
}

/* The collectible rises above its plaque while the touch target, console row
   and the playing field retain their established dimensions. */
.controls #bonus-preview { overflow:visible; padding-left:72px; }
.controls #bonus-preview > svg { position:absolute;left:2px;bottom:1px;width:68px;height:68px;max-width:none;margin:0;transform:rotate(-7deg);z-index:1; }
.controls #bonus-preview > span { position:relative;z-index:2;min-width:0;text-align:center; }
@media(max-width:700px) {
  .controls #bonus-preview { padding-left:44px; }
  .controls #bonus-preview > svg { width:43px;height:52px;left:0;bottom:1px; }
}
@media(max-width:370px) {
  .controls #bonus-preview { padding-left:35px;padding-right:3px; }
  .controls #bonus-preview > svg { width:35px;height:47px;left:0;bottom:1px; }
  #spin.spin .spin-copy::before, #spin.spin .spin-copy::after { width:8px; }
}

/* A short landscape viewport scrolls the full cabinet instead of flattening
   five symbol rows to a thin strip. Portrait geometry is unchanged. */
@media(max-height:560px) and (orientation:landscape){
  .game{min-height:620px;}
}

@media(max-width:700px) and (max-height:650px){
  .game{min-height:650px;}
}

/* Desktop uses the original BUY node in the instrument rail. Its former
   footer slot becomes a quiet single row of tools; phone geometry is intact. */
.feature-rail #bonus-preview:disabled { opacity:.66; filter:saturate(.7); cursor:default; transform:none; }
.feature-rail #bonus-preview:focus-visible { outline:3px solid #c4ffed; outline-offset:4px; }
@media(min-width:701px) {
  /* The rotated collectible extends ~28px above its 58px plaque. Reserve
     that footprint plus its glow before flex auto margins center the BUY
     target; the rail's own gap supplies breathing room on both sides. */
  .feature-rail .sun-meter:has(+ #bonus-preview) { margin-bottom:32px; }
  .feature-rail #bonus-preview {
    flex:0 0 auto; width:100%; min-width:0; min-height:58px;
    margin-block:auto; padding:7px 8px 7px 66px; gap:0;
    font-size:12px; line-height:1.2; letter-spacing:.25px;
  }
  .feature-rail #bonus-preview > svg {
    position:absolute; left:-4px; bottom:2px; width:72px; height:80px;
    max-width:none; margin:0; transform:rotate(-7deg); z-index:1;
  }
  .feature-rail #bonus-preview > span { position:relative; z-index:2; min-width:0; text-align:center; overflow-wrap:anywhere; }
  .feature-rail #bonus-preview small { font-size:9px; line-height:1.3; margin-top:5px; letter-spacing:.2px; }
  .feature-rail #bonus-preview + .round-total { margin-top:8px; }
  .controls {
    grid-template-columns:177px minmax(144px,1fr)168px;
    min-height:100px; padding:6px 14px; gap:16px;
    border-radius:12px;
  }
  .controls .secondary { display:flex; flex-direction:row; min-width:0; align-items:center; justify-content:center; gap:0; }
  .controls .round-tools { display:grid; grid-template-columns:repeat(3,minmax(44px,1fr)); gap:4px; width:100%; }
  .controls .round-tools button { min-width:0; min-height:44px !important; padding:4px 3px !important; font-size:8px !important; letter-spacing:0; line-height:1.25; white-space:normal; overflow-wrap:anywhere; }
  .controls .round-tools button + button { padding-left:3px !important; }
  .controls #spin.spin {
    --wheel-size:76px; --hub-size:42px;
    width:min(100%,144px); max-width:144px; height:88px; min-height:88px;
    padding:0 4px 1px;
  }
  .controls #spin.spin .spin-copy { min-height:32px; padding:1px 6px; }
  .controls #spin.spin #spin-label { font-size:20px; letter-spacing:.65px; }
  .controls #spin.spin #spin-hint { font-size:7px; line-height:1.2; letter-spacing:.1px; }
  .controls #spin.spin .spin-copy::before, .controls #spin.spin .spin-copy::after { width:9px; }
}
@media(min-width:701px) and (max-width:1050px) {
  .controls { grid-template-columns:170px minmax(144px,1fr)156px; gap:10px; padding-inline:10px; }
  .feature-rail .sun-meter:has(+ #bonus-preview) { margin-bottom:28px; }
  .feature-rail #bonus-preview { padding-left:60px; padding-right:5px; font-size:11px; letter-spacing:0; }
  .feature-rail #bonus-preview > svg { width:66px; height:76px; left:-3px; }
}
.no-motion .feature-rail #bonus-preview { transition:none !important; }
@media(prefers-reduced-motion:reduce) { .feature-rail #bonus-preview { transition:none !important; } }
/* v25: the original wallet travels into the wager console; no duplicate state. */
.game :is(.episode,.marquee,.radio-line,.feature-strip,.fineprint,.cabinet-foot){display:none!important}
.controls .stake{display:grid;grid-template-columns:1fr;gap:4px;min-width:0}
.controls .stake>.balance{display:flex;box-sizing:border-box;align-items:center;justify-content:space-between;height:44px;min-height:44px;min-width:0;width:100%;padding:2px 5px;gap:4px;border:1px solid #fff2cc;border-radius:7px;background:linear-gradient(160deg,#fffce5,#ffe4ad);color:#153b4b;box-shadow:inset 0 1px #fff9ed,0 2px #726073}
.controls .balance>div{display:flex;align-items:center;gap:4px;min-width:0;flex:1}
.controls .balance small{font-size:6px;letter-spacing:0}
.controls .balance small>span{display:none}
.controls .balance #balance{font-size:14px;letter-spacing:-.45px;color:#17364b;white-space:nowrap}
.controls .balance .wallet-add{width:44px;height:44px;min-width:44px;min-height:44px;flex:0 0 44px;font-size:23px;padding:0}
.controls .balance .currency-picker-toggle{width:52px;min-width:0;margin:0;padding:0}
.controls .stake-top{display:none}
.controls .stake-input{display:grid;grid-template-columns:44px minmax(0,1fr)44px;gap:3px}
.controls .stake-input :is(button,input){height:44px;min-height:44px;min-width:0;width:100%;box-sizing:border-box;padding:0 3px;font-size:17px}
#sound-dialog>#speed{display:block;width:100%;min-height:44px;margin:12px 0;padding:8px;border:1px solid #b4fce4;border-radius:7px;background:#184a59;color:#fff2d3;font-weight:800}
@media(max-width:700px){
 .game .top-actions #info{display:grid!important;width:44px!important;min-width:44px;height:44px}
 .game .controls .stake{grid-template-columns:minmax(0,1fr);grid-template-rows:44px 44px;height:92px;gap:4px}
 .game .controls .stake>.balance{grid-column:1;grid-row:1}
 .game .controls .stake-input{display:grid;grid-column:1;grid-row:2}
 .game .controls .stake-input :is(#minus,#bet,#plus){grid-row:1}
 .game .controls #minus{grid-column:1}.game .controls #bet{grid-column:2}.game .controls #plus{grid-column:3}
 .game .controls .balance>div{flex-direction:column;gap:0;align-items:flex-start}
 .game .controls .balance #balance{font-size:14px}
}
/* Readable one-line wallet metadata: picker badge may be compact; its menu is full. */
.controls .balance>div{display:flex;flex-direction:row!important;align-items:center!important;gap:4px;min-width:0}
.controls .balance small{display:flex;flex:none;min-width:0}
.controls .balance .currency-picker-toggle{width:28px;min-width:28px;height:44px;min-height:44px;margin:0;padding:0}
.controls .balance .currency-picker-badge{display:grid;grid-template-columns:12px 4px;gap:3px;padding:0}
.controls .balance .currency-picker-code{display:none}
.controls .balance #balance{font-size:13px;letter-spacing:-.45px;min-width:0;line-height:1.1}
@media(min-width:701px){
 .game .controls{grid-template-columns:340px minmax(112px,144px)minmax(132px,1fr)144px;column-gap:10px}
 .game .controls .stake{display:flex;align-items:center;gap:4px}
 .game .controls .stake>.balance{flex:0 0 190px;width:190px}
 .game .controls .stake-input{flex:1;min-width:0}
 .game .controls .secondary{display:contents}
 .game .controls .round-tools{grid-column:3;grid-row:1;display:flex;flex-direction:row;width:100%}
 .game .controls .round-tools button{flex:1;min-width:44px;min-height:44px!important}
 .game .controls #bonus-preview{grid-column:4;grid-row:1;position:relative;align-self:center;min-height:44px;width:100%;padding-left:4px}
 .game .controls #bonus-preview>svg{display:none}
 .game .controls .balance .currency-picker-toggle{width:44px;min-width:44px}
 .game .controls .balance .currency-picker-badge{grid-template-columns:12px 20px 4px;gap:3px}
 .game .controls .balance .currency-picker-code{display:block}
 .game .controls .balance #balance{font-size:15px}
}
@media(min-width:701px){
 body:not(.frame-compact) .game .controls{grid-template-columns:340px minmax(112px,144px)minmax(132px,1fr)190px;column-gap:10px}
 body:not(.frame-compact) .game .controls #bonus-preview{width:190px;min-height:48px;padding-left:54px;padding-right:5px;font-size:12px}
 body:not(.frame-compact) .game .controls #bonus-preview>svg{display:block!important;position:absolute;left:2px;bottom:1px;width:50px;height:56px;max-width:none;transform:rotate(-5deg)}
}
/* Final portrait wallet: reserve actual width for the complete amount. */
@media(max-width:700px){
 body:not(.frame-compact) .game .controls{grid-template-columns:160px minmax(0,1fr);column-gap:8px}
 body:not(.frame-compact) .game .controls .balance{padding:2px 4px;gap:3px}
 body:not(.frame-compact) .game .controls .balance>div{gap:3px;flex:1;min-width:0}
 body:not(.frame-compact) .game .controls .balance small{flex:0 0 28px;width:28px}
 body:not(.frame-compact) .game .controls .balance #balance{font:700 12px/1.1 Arial,sans-serif;letter-spacing:-.55px;flex:1 1 auto;min-width:0;overflow:visible;text-overflow:clip}
 body:not(.frame-compact) .game .controls .balance .currency-picker-toggle{width:28px;min-width:28px}
}
/* Match explanation belongs in Game Info; leave the real field unobstructed. */
.game .combo-panel{display:none!important}
.game :is(#round-total,#live-spin-amount,#live-total-amount){white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;min-width:0;max-width:100%;text-overflow:clip}
.game .round-total{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)auto;align-items:center;gap:3px;box-sizing:border-box}
.game .round-total>#round-label{grid-column:1;grid-row:1;position:static;display:block;line-height:1.15;max-width:100%;margin:0}
.game .round-total>#round-total{grid-column:1;grid-row:2;position:static;display:block;width:100%;line-height:1.05;margin:0}
.game .round-total>#net{grid-column:1;grid-row:3;position:static;display:block;line-height:1.15;margin:0;max-width:100%}
.game .round-total.live-meter-active>:is(#round-label,#round-total,#net){display:none!important}
.game .round-total.live-meter-active>#live-win{grid-column:1;grid-row:1 / -1;position:static;inset:auto;display:flex;width:100%;height:100%;gap:2px;min-width:0;justify-content:center}
.game #live-win .live-win-total{display:flex;flex-direction:column;align-items:stretch;gap:1px}
.game #live-win .live-win-current{display:grid;grid-template-columns:minmax(0,35%) minmax(0,65%);align-items:baseline;gap:0}
.game #live-win #live-spin-label{line-height:1.15;overflow-wrap:anywhere;min-width:0}
.game #live-win #live-spin-amount{width:100%;min-width:0;text-align:right}
.game #live-win #live-total-amount{width:100%;min-width:0}
.game #live-win-note{display:block;position:static;line-height:1.15;max-width:100%;margin:0}
/* Main action strip: AUTO only; the original history/replay actions live in settings. */
#sound-dialog .settings-links :is(#history,#replay){width:100%;min-height:44px;margin:6px 0;padding:10px;border:1px solid #a8e8d5;border-radius:8px;background:#184858;color:#fff3d4;font-size:12px;text-align:center}
#sound-dialog .settings-links :is(#history,#replay)[hidden],#sound-dialog #settings-history{display:none!important}
.game .controls .round-tools{display:flex!important;flex-direction:row!important;width:44px;justify-content:center;gap:4px}
.game .controls .round-tools>button{flex:0 0 44px;min-width:44px;max-width:44px;min-height:44px!important}
.game .controls.bonus-controls-active .round-tools{width:92px}
.game .controls.bonus-controls-active .round-tools :is(#bonus-auto,#bonus-finish){flex:0 0 44px;width:44px;min-width:44px;max-width:44px}
@media(min-width:701px){
 body:not(.frame-compact) .game .controls{grid-template-columns:340px minmax(144px,1fr)44px 190px;column-gap:10px}
 body:not(.frame-compact) .game .controls.bonus-controls-active{grid-template-columns:340px minmax(144px,1fr)92px 190px}
 body:not(.frame-compact) .game .controls #spin.spin{width:min(100%,200px);max-width:200px;justify-self:center}
}
@media(max-width:700px){body:not(.frame-compact) .game .controls .secondary{grid-template-columns:minmax(0,1fr)44px}body:not(.frame-compact) .game .controls.bonus-controls-active .secondary{grid-template-columns:minmax(0,1fr)92px}}

/* COASTLINE HEAT v9.4 — finite autoplay and a player-paced bonus episode.
   Controllers own every state. This layer only presents their controls. */

.language-control { display: block; flex: 0 0 52px; width: 52px; margin: 0; }
#language {
  display: block;
  width: 52px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0 5px;
  border: 1px solid #d6ffe4;
  border-radius: 8px;
  background: linear-gradient(150deg, #617f90, #2c4965 49%, #203750 51%, #3d6379);
  color: #f2ffe7;
  box-shadow: inset 0 1px #e2fff45c, 0 3px #132e48;
  font: 850 10px/1 var(--finish-body);
  cursor: pointer;
}
#language option { background: #20374f; color: #fff4df; }
.controls .round-tools { gap: 4px; }
.controls .round-tools #autoplay {
  min-width: 44px;
  min-height: 44px !important;
  border-color: #abfff0 !important;
  background: linear-gradient(150deg, #c3ffe1, #60d9c6 46%, #36a9ae 48%, #94ead5);
  color: #133e50;
  box-shadow: inset 0 1px #f2ffe2b3, 0 2px #26677b;
  text-shadow: 0 1px #dfffe74a;
  font-weight: 900;
}
.controls .round-tools #autoplay:hover:not(:disabled) { background: linear-gradient(150deg, #e1ffdd, #8aefce 46%, #54bebc 48%, #b4f6df); }
.controls .round-tools #autoplay[aria-pressed=true],
.controls .round-tools #autoplay[data-active=true] { color: #fff6db; background: linear-gradient(155deg, #fb906e, #c93658); border-color: #ffe6c1 !important; box-shadow: inset 0 1px #ffecd175, 0 2px #74364f; }

#autoplay-dialog {
  width: min(484px, calc(100% - 28px));
  height: fit-content;
  max-height: calc(100svh - 28px);
  padding: 27px;
  margin: auto;
  overflow-y: auto;
  overflow-x: hidden;
  border: 1px solid #e9decb;
  border-radius: 14px;
  background: radial-gradient(ellipse at 0 0, #28787563, transparent 55%), linear-gradient(145deg, #263b51, #27273f 72%, #4b2c48);
  box-shadow: inset 0 1px #efffe83b, 0 0 0 4px #a9ffe915, 0 22px 75px #071023c9;
  color: #f9efdd;
  scrollbar-color: #91cfc6 #26354b;
}
#autoplay-dialog::backdrop { background: #111d34b8; backdrop-filter: blur(6px); }
#autoplay-dialog .dialog-top { gap: 13px; align-items: flex-start; }
#autoplay-dialog .dialog-top > div { min-width: 0; }
#autoplay-dialog .eyebrow { display: block; font-size: 8px; letter-spacing: 1.5px; color: #a5f4dc; margin-bottom: 8px; }
#autoplay-dialog h2 { margin: 0; color: #fff0d2; font: italic clamp(25px, 5vw, 36px)/1.05 var(--finish-display); letter-spacing: .5px; overflow-wrap: anywhere; text-shadow: 1px 2px #8b5268; }
#autoplay-dialog .dialog-top .icon-button { width: 44px; height: 44px; min-width: 44px; min-height: 44px; border: 1px solid #c5dfdf9e; border-radius: 8px; background: linear-gradient(145deg, #617a91, #334764); color: #fff0d7; font-size: 27px; box-shadow: inset 0 1px #e2fff344, 0 2px #122b44; }
#autoplay-dialog .autoplay-intro { color: #d0dce1; margin: 18px 0 20px; font-size: 12px; line-height: 1.65; }
.autoplay-fields { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; margin-block: 16px; }
.autoplay-fields > label, .autoplay-stake { min-width: 0; padding: 13px; border: 1px solid #beded349; border-radius: 8px; background: #0f293b65; }
.autoplay-fields > label > span, .autoplay-stake > span, .autoplay-loss-field > span:first-child { display: block; font-size: 8px; font-weight: 850; line-height: 1.45; letter-spacing: .6px; color: #d2e8e2; }
#autoplay-count { width: 100%; height: 47px; min-height: 44px; padding: 6px 11px; margin-top: 8px; border: 1px solid #fff0d0; border-radius: 6px; background: linear-gradient(155deg, #f7ffe6, #b6ecdf); color: #163e50; font: 850 23px/1.2 var(--finish-body); }
.autoplay-stake output { display: block; margin-top: 10px; font: 850 25px/1.25 var(--finish-body); color: #ffdfb4; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.autoplay-stake > small { display: block; color: #c1d7db; font-size: 9px; line-height: 1.4; margin-top: 3px; }
.autoplay-loss-field { display: block; margin-top: 20px; }
.autoplay-loss-input { display: flex; align-items: center; gap: 11px; margin-top: 9px; padding-right: 12px; border: 1px solid #d5d8d1a6; border-radius: 7px; background: #102c40; }
#autoplay-loss { display: block; width: 100%; min-width: 0; min-height: 44px; padding: 9px 12px; border: 0; border-radius: 6px; background: transparent; color: #fff0d2; font: 850 20px/1.2 var(--finish-body); }
.autoplay-loss-input > small { color: #b7d9d6; font-size: 9px; flex-shrink: 0; }
#autoplay-loss-help { margin: 8px 0 18px; color: #b5cbd2; font-size: 10px; line-height: 1.5; }
.autoplay-options { border-top: 1px solid #c3ded637; border-bottom: 1px solid #c3ded637; }
.autoplay-options > label { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 54px; padding: 5px 0; cursor: pointer; }
.autoplay-options > label + label { border-top: 1px solid #c3ded61c; }
.autoplay-options span { font-size: 10px; line-height: 1.5; font-weight: 800; color: #e1eee5; letter-spacing: .3px; }
.autoplay-options input { width: 22px; height: 22px; flex: 0 0 22px; accent-color: #92ecd2; cursor: pointer; }
#autoplay-dialog .autoplay-note { font-size: 10px; line-height: 1.6; color: #c9c9d5; margin: 16px 0 18px; }
#autoplay-start { width: 100%; min-height: 48px; border: 1px solid #fff1d0; border-radius: 7px; background: linear-gradient(145deg, #ffd4a9, #ff9a9a 49%, #e87595); color: #442942; box-shadow: inset 0 2px #fff3d577, 0 3px #895071; font-size: 12px; font-weight: 900; letter-spacing: .5px; }
#autoplay-start:hover:not(:disabled) { background: linear-gradient(145deg, #ffe8bd, #ffb9a7 49%, #ef91aa); transform: translateY(-1px); }
#autoplay-start:disabled { opacity: .5; cursor: default; }
#autoplay-dialog .text-action { display: block; width: 100%; min-height: 44px; margin-top: 8px; font-size: 9px; font-weight: 800; letter-spacing: .7px; color: #d1eae0; }

/* Bonus tools replace two existing round-tools slots. No extra console row. */
#bonus-control { display: contents; }
#bonus-control[hidden] { display: none !important; }
.controls.bonus-controls-active .round-tools > :is(#autoplay,#replay) { display: none !important; }
.controls.bonus-controls-active .round-tools #bonus-auto { order: 0; }
.controls.bonus-controls-active .round-tools #bonus-finish { order: 1; }
.controls.bonus-controls-active .round-tools #history { order: 2; }
.controls .round-tools :is(#bonus-auto,#bonus-finish) {
  min-width: 0;
  min-height: 44px !important;
  max-width: 100%;
  padding: 4px 3px !important;
  font-size: 8px;
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
.controls .round-tools #bonus-auto[aria-pressed=true] { background: linear-gradient(150deg, #d4ffe1, #7bd9c7); color: #1a4253; border-color: #ffffdc !important; }
.controls .round-tools #bonus-finish { display: flex; align-items: center; justify-content: center; background: #192e469c; color: #ffd2b3; border-color: #b0c7d35c !important; }
.controls .round-tools #bonus-finish svg { width: 24px; height: 24px; flex: 0 0 24px; fill: currentColor; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }
#bonus-control button:disabled { cursor: default; }
#language:focus-visible, #autoplay-dialog :is(button,input,select):focus-visible, #bonus-control button:focus-visible { outline: 3px solid #bdffeb; outline-offset: 3px; }

@media (max-width: 700px) {
  .language-control { width: 44px; flex-basis: 44px; }
  #language { width: 44px; padding-inline: 3px; font-size: 9px; border-radius: 7px; }
  .topbar .brand strong { font-size: 29px; }
  .topbar .brand span { font-size: 9px; letter-spacing: 1.3px; }
  .topbar .brand small { font-size: 4.5px; max-width: 69px; }
  .controls .secondary { grid-template-columns: minmax(0,1fr) 140px; gap: 6px; }
  .controls .round-tools { grid-template-columns: repeat(3,44px); gap: 4px; }
  .controls .round-tools button { min-width: 0; padding: 4px 2px !important; font-size: 7px; line-height: 1.25; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; }
  .controls .round-tools #autoplay { width: 44px; min-height: 44px; padding: 4px 1px !important; white-space: normal; overflow-wrap: anywhere; }
  .controls .buy-ticket { gap: 4px; padding-inline: 5px; font-size: 11px; letter-spacing: 0; }
  .controls .buy-ticket > svg { width: 29px; height: 29px; flex: 0 0 29px; }
  .controls .buy-ticket small { font-size: 7.5px; letter-spacing: 0; }
  #autoplay-dialog { width: calc(100% - 22px); max-height: calc(100svh - 22px); padding: 20px 18px 15px; border-radius: 11px; }
  #autoplay-dialog .autoplay-intro { margin-block: 14px 17px; font-size: 11px; }
  .autoplay-fields { gap: 9px; margin-block: 13px; }
  .autoplay-fields > label, .autoplay-stake { padding: 11px; }
  .autoplay-loss-field { margin-top: 16px; }
}
@media (max-width: 370px) {
  .topbar .brand span { font-size: 6.8px; letter-spacing: .9px; }
  .topbar .brand strong { font-size: 21px; letter-spacing: .3px; }
  .topbar .brand small { font-size: 4px; max-width: 45px; }
  .top-actions .balance { width: 114px; gap: 3px; padding: 4px !important; }
  .top-actions .balance strong { font-size: 13px; letter-spacing: -.55px; }
  .top-actions .balance small { font-size: 4.5px; letter-spacing: 0; }
  .controls .buy-ticket > svg { width: 24px; height: 24px; flex-basis: 24px; }
  .controls .buy-ticket { font-size: 9px; gap: 2px; }
  .controls .buy-ticket small { font-size: 7px; }
  #autoplay-dialog { padding: 18px 14px 12px; }
  #autoplay-dialog h2 { font-size: 25px; }
  .autoplay-fields > label > span, .autoplay-stake > span { font-size: 7px; }
}
.no-motion #bonus-control *, .no-motion #autoplay-dialog *, .no-motion #language { transition: none !important; animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  #bonus-control *, #autoplay-dialog *, #language { transition: none !important; animation: none !important; }
}

/* COASTLINE HEAT v9.6 — a language badge with an unclipped, keyboard-ready menu. */
.language-control.language-picker-ready { position: relative; }
.language-control.language-picker-ready > #language {
  position: absolute;
  width: 1px; min-width: 0; height: 1px; min-height: 0;
  padding: 0; margin: -1px; border: 0;
  overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%);
  white-space: nowrap;
}
.language-picker-toggle {
  display: grid; grid-template-columns: 18px 13px 5px; align-items: center; justify-content: center;
  gap: 2px; width: 100%; min-width: 0; height: 44px; min-height: 44px;
  padding: 5px; border: 1px solid #c9ffed; border-radius: 9px;
  background: linear-gradient(155deg,#759ca3,#3e687d 38%,#214159 40%,#31566a);
  color: #fff5dc; box-shadow: inset 0 1px #ebfff773,0 3px #162d45,0 4px #9acbca66;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.language-picker-toggle:hover:not(:disabled),.language-picker-toggle[aria-expanded="true"] {
  border-color: #fff0ce;
  background: linear-gradient(155deg,#a2d1c8,#628f99 38%,#365d76 40%,#4c7985);
}
.language-picker-toggle[aria-expanded="true"] { box-shadow: inset 0 1px #f6ffe982,0 3px #25324e,0 0 0 2px #f6a99252; }
.language-picker-toggle:active:not(:disabled) { transform: translateY(1px); }
.language-picker-flag,.language-picker-item-flag { font-family: 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif; font-weight: 400; line-height: 1; }
.language-picker-flag { font-size: 18px; width: 18px; }
.language-picker-code { font: 850 10px/1 var(--finish-body,'Trebuchet MS',sans-serif); letter-spacing: -.2px; }
.language-picker-chevron { width: 5px; height: 5px; border: solid #d4f6e9; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg) translateY(-1px); }
.language-picker-toggle[aria-expanded="true"] .language-picker-chevron { transform: rotate(225deg) translate(-1px,-1px); }
.language-picker-toggle:focus-visible,.language-picker-item:focus-visible { outline: 3px solid #c4ffed; outline-offset: 3px; }
.language-picker-menu {
  position: fixed; z-index: 1000; box-sizing: border-box;
  width: min(272px,calc(100vw - 20px)); max-height: min(480px,calc(100svh - 20px));
  display: grid; gap: 3px; padding: 9px;
  overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
  border: 1px solid #b7e3dca3; border-radius: 14px;
  background: radial-gradient(ellipse at 0 0,#368a8466,transparent 68%),linear-gradient(145deg,#183749,#22283e 72%,#413047);
  color: #fff2dc; box-shadow: inset 0 1px #eeffea33,0 0 0 3px #081e2d55,0 18px 46px #07121fc9;
  scrollbar-width: thin; scrollbar-color: #80cdbd #203449;
}
.language-picker-menu[hidden] { display: none !important; }
.language-picker-item {
  display: grid; grid-template-columns: 27px minmax(0,1fr) 24px 17px; align-items: center;
  column-gap: 10px; width: 100%; min-width: 0; min-height: 41px;
  margin: 0; padding: 8px 10px; border: 1px solid transparent; border-radius: 8px;
  background: transparent; color: #f8eedc; text-align: left;
  font: 650 14px/1.2 var(--finish-body,'Trebuchet MS',sans-serif);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.language-picker-item:hover,.language-picker-item:focus-visible { background: #b1e6da14; border-color: #afdcca5c; }
.language-picker-item[aria-checked="true"] {
  background: linear-gradient(105deg,#d4f6df,#9bd9cf); color: #183c4c;
  border-color: #e5ffe7; box-shadow: inset 0 1px #fffced8c,0 2px #102c4055;
}
.language-picker-item-flag { width: 27px; font-size: 23px; }
.language-picker-name { white-space: nowrap; }
.language-picker-item-code { color: #b8ccce; font-size: 10px; font-weight: 800; letter-spacing: .4px; text-align: right; }
.language-picker-item[aria-checked="true"] .language-picker-item-code { color: #386679; }
.language-picker-check { visibility: hidden; color: #8d4b55; font-size: 15px; font-weight: 900; text-align: right; }
.language-picker-item[aria-checked="true"] .language-picker-check { visibility: visible; }
@media(max-width:700px) {
  .language-picker-toggle { grid-template-columns: 16px 12px 4px; gap: 2px; padding: 3px; border-radius: 7px; }
  .language-picker-flag { width: 16px; font-size: 16px; }
  .language-picker-code { font-size: 9px; }
  .language-picker-chevron { width: 4px; height: 4px; }
  .language-picker-item { min-height: 44px; }
}
@media(forced-colors:active) {
  .language-picker-toggle,.language-picker-menu,.language-picker-item[aria-checked="true"] { border-color: ButtonText; }
  .language-picker-item[aria-checked="true"] { outline: 1px solid Highlight; outline-offset: -3px; }
  .language-picker-chevron { border-color: ButtonText; }
}

/* COASTLINE HEAT v9.4 — live totals occupy the existing side-meter card.
   Absolute placement and hidden original children never add cabinet or board rows. */

.round-total.live-meter-active { position: relative; }
.round-total.live-meter-active > :is(#round-label,#round-total,#net) { visibility: hidden; }
#live-win {
  --payout-cream: #fff5d5;
  --payout-cyan: #a0ffd3;
  position: absolute;
  inset: 7px 10px 6px;
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 2px;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  container-type: inline-size;
  color: var(--payout-cream);
  font-variant-numeric: tabular-nums lining-nums;
}
.round-total.live-meter-active > #live-win { display: flex; }
#live-win[hidden] { display: none !important; }
#live-win > :is(.live-win-current,.live-win-total) { min-width: 0; }
#live-win .live-win-total { order: 0; display: flex; flex-direction: column; gap: 1px; }
#live-win .live-win-current { order: 1; display: flex; align-items: baseline; justify-content: space-between; gap: 5px; }
#live-win :is(#live-spin-label,#live-total-label) {
  min-width: 0;
  margin: 0;
  color: #c7e8e0;
  font: 800 7px/1.15 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: .1px;
  overflow-wrap: anywhere;
}
#live-win #live-total-label { display: block; color: #d7eddb; font-size: 8px; }
#live-win :is(#live-spin-amount,#live-total-amount) {
  display: block;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  font-family: var(--finish-body, 'Trebuchet MS', sans-serif);
  font-weight: 900;
  font-style: normal;
  line-height: 1.05;
  white-space: nowrap;
  transform-origin: left center;
}
#live-win #live-total-amount {
  color: var(--payout-cream);
  font-size: clamp(21px, 15cqi, 30px);
  letter-spacing: -.65px;
  text-shadow: 0 1px #3a203d9c;
}
#live-win #live-spin-amount { flex: 0 0 auto; color: var(--payout-cyan); font-size: 12px; letter-spacing: -.2px; }
#live-win-note {
  order: 2;
  display: block;
  min-width: 0;
  margin: 0;
  color: #c4dcda;
  font: 600 7px/1.15 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
#live-win[data-has-win=false] :is(#live-spin-amount,#live-total-amount) { color: #d4e0da; text-shadow: none; }
#live-win[data-has-win=true] strong.pulse { animation: payout-number-pop 360ms cubic-bezier(.2,.8,.25,1) both; }
#live-win[data-mode=preview] #live-win-note { color: #e1cfe7; }

/* A compact payout ticket reports money returned, without implying net profit. */
#win-floats { position: absolute; inset: 0; z-index: 12; pointer-events: none; container-type: inline-size; }
#win-floats :is(.win-cascade,.win-spin) {
  --badge-ink: #123747;
  position: absolute;
  top: 45%;
  left: 50%;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: max-content;
  max-width: calc(100% - 34px);
  min-width: 146px;
  padding: 10px 23px 11px;
  border: 1px solid #fff8db;
  border-left: 6px solid #2af3bf;
  border-right: 4px solid #fa3e83;
  border-radius: 3px 15px 3px 15px;
  background: linear-gradient(165deg, #fffdeb 0%, #fff2cd 47%, #ffe4ae 100%);
  color: var(--badge-ink);
  box-shadow: inset 0 1px #ffffff, inset 0 -1px #bb886733, 0 3px #163747, 0 7px 16px #031d355c;
  text-align: center;
  font-weight: 900;
  transform: translate(-50%,-50%);
  opacity: 1;
  pointer-events: none;
  animation: payout-badge-in 260ms cubic-bezier(.16,.8,.28,1) both;
}
#win-floats :is(.win-cascade,.win-spin)::before {
  content: '';
  position: absolute;
  left: 12px;
  right: 12px;
  top: 4px;
  height: 1px;
  background: linear-gradient(90deg, #0dbca176, transparent 32%, #f6388166);
  pointer-events: none;
}
#win-floats :is(.win-cascade,.win-spin) > small {
  display: block;
  max-width: 100%;
  color: #35505b;
  font: 850 8px/1.25 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: .9px;
  overflow-wrap: anywhere;
}
#win-floats :is(.win-cascade,.win-spin) > strong {
  display: block;
  max-width: 100%;
  color: var(--badge-ink);
  font: 900 clamp(28px, 7.8cqi, 43px)/1 var(--finish-display, Impact, 'Arial Narrow', sans-serif);
  letter-spacing: -.2px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums lining-nums;
  text-shadow: 0 1px #fffceb;
}
#win-floats .win-cascade > strong::before { content: '+'; }
#win-floats :is(.win-cascade,.win-spin) > span {
  display: block;
  max-width: 100%;
  color: #4b5360;
  font: 750 8px/1.3 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: .2px;
  overflow-wrap: anywhere;
}
#win-floats :is(.win-cascade,.win-spin) > span:empty,
#win-floats .win-spin > span { display: none; }
#win-floats .win-spin { top: 46%; }
/* A high payout alone is not confirmed profit; both tiers use the same receipt. */
#win-floats :is(.win-cascade,.win-spin)[data-tier=large] { border-top-color: #fff7d4; }
#win-floats :is(.win-cascade,.win-spin)::after { display: none; animation: none; }

@keyframes payout-number-pop {
  0% { transform: scale(.98); }
  40% { transform: scale(1.055); }
  100% { transform: scale(1); }
}
@keyframes payout-badge-in {
  from { opacity: 0; transform: translate(-50%,calc(-50% + 8px)) scale(.91); }
  to { opacity: 1; transform: translate(-50%,-50%) scale(1); }
}

.board-message[data-kind=win]{inset:auto;left:50%;top:50%;width:max-content;min-width:min(420px,84%);max-width:84%;height:auto;box-sizing:border-box;transform:translate(-50%,-50%);padding:24px 32px;container-type:inline-size;border:2px solid #ffe6a8bf;border-left-color:#56ffe0bf;border-right-color:#ff91bcbf;border-radius:6px 32px 6px 32px;background:radial-gradient(ellipse at 80% 25%,#d8429851,transparent 68%),linear-gradient(125deg,#123e50f7,#343553f7 53%,#61314ff7);box-shadow:0 7px #061e37aa,inset 0 0 0 5px #fff0c509;backdrop-filter:none;animation:win-plate-arrive 320ms cubic-bezier(.2,.8,.2,1) both}
.board-message[data-kind=win]:before{inset:8px;border-radius:2px 25px 2px 25px;border:1px solid #ffe5c349;box-shadow:none;animation:win-plate-reflect 1200ms ease-out both;background:linear-gradient(115deg,transparent 25%,#fff0d328 48%,transparent 70%);pointer-events:none}
.board-message[data-kind=win]:after{inset:13px;border:0;border-top:2px solid #72ffe06b;border-bottom:2px solid #ff97867d;border-radius:0;pointer-events:none}
.board-message[data-kind=win] strong{font-size:clamp(44px,22cqi,84px);background:linear-gradient(#ffffdc 25%,#ffe9b0 58%,#ffd293);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(2px 2px #071d32);text-shadow:none;letter-spacing:-1px}
.board-message[data-kind=win][data-large-amount=true] strong{font-size:clamp(30px,11cqi,58px)}
.board-message[data-kind=win] .result-medallion{width:60px;height:60px;margin-bottom:7px}
.board-message[data-kind=win] small{color:#ffd9c1;letter-spacing:2px}
.board-message[data-kind=win] .win-continue{min-height:44px;margin-top:14px;padding:9px 22px;border:1px solid #fff0bd;border-radius:3px 15px 3px 15px;background:linear-gradient(112deg,#72ffe0 0 22%,#ffb298 23%,#ff786d);color:#17374b;font-weight:900;box-shadow:0 3px #63394e}
@keyframes win-plate-reflect{0%{opacity:0}35%{opacity:.9}100%{opacity:.35}}
@keyframes win-plate-arrive{0%{opacity:0;transform:translate(-50%,calc(-50% + 10px)) scale(.97)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.fast-mode #win-floats :is(.win-cascade,.win-spin){animation-duration:180ms}
@media(max-width:700px){.board-message[data-kind=win]{padding:14px 18px;border-radius:4px 24px 4px 24px}.board-message[data-kind=win] .result-medallion{width:38px;height:38px;margin-bottom:4px}.board-message[data-kind=win] strong{font-size:clamp(38px,22cqi,60px);line-height:1.1}.board-message[data-kind=win] small{font-size:8px;letter-spacing:.7px}.board-message[data-kind=win] span{font-size:8px}.board-message[data-kind=win] .win-continue{margin-top:9px;font-size:10px}}
.no-motion .board-message[data-kind=win]:before{animation:none!important;background:none}
@media(prefers-reduced-motion:reduce){.board-message[data-kind=win]:before{animation:none!important;background:none}}

@media (max-width: 700px) {
  #live-win { inset: 5px 7px; gap: 2px; }
  #live-win .live-win-current { gap: 3px; }
  #live-win :is(#live-spin-label,#live-total-label) { font-size: 6.5px; line-height: 1.1; letter-spacing: 0; }
  #live-win #live-total-amount { font-size: clamp(16px, 17cqi, 21px); letter-spacing: -.55px; }
  #live-win #live-spin-amount { font-size: 10px; line-height: 1.1; letter-spacing: -.15px; }
  #live-win-note { font-size: 6px; line-height: 1.15; }
  #win-floats :is(.win-cascade,.win-spin) { min-width: 124px; max-width: calc(100% - 26px); padding: 8px 15px 9px; gap: 3px; border-radius: 3px 12px 3px 12px; border-left-width: 5px; border-right-width: 3px; }
  #win-floats :is(.win-cascade,.win-spin) > small { font-size: 7px; letter-spacing: .55px; }
  #win-floats :is(.win-cascade,.win-spin) > span { font-size: 7px; }
}
@media (max-width: 370px) {
  #live-win { inset-inline: 5px; }
  #live-win #live-total-amount { font-size: 16px; letter-spacing: -.6px; }
  #live-win #live-spin-amount { font-size: 9px; }
}
@media (max-width: 700px) and (max-height: 650px) {
  #live-win { inset-block: 3px; gap: 0; }
  #live-win .live-win-total { gap: 0; }
  #live-win :is(#live-spin-label,#live-total-label) { font-size: 6px; line-height: 1.05; }
  #live-win #live-total-amount { font-size: 16px; line-height: 1; }
  #live-win #live-spin-amount { font-size: 9px; line-height: 1.05; }
  #live-win-note { line-height: 1.05; }
}

.no-motion #live-win strong.pulse,
.no-motion #win-floats :is(.win-cascade,.win-spin) { animation: none !important; transition: none !important; }
.no-motion #live-win strong.pulse { transform: none; }
.no-motion #win-floats :is(.win-cascade,.win-spin) { opacity: 1; transform: translate(-50%,-50%); }
.no-motion #win-floats :is(.win-cascade,.win-spin)::after { display: none; }
@media (prefers-reduced-motion: reduce) {
  #live-win strong.pulse, #win-floats :is(.win-cascade,.win-spin) { animation: none !important; transition: none !important; }
  #live-win strong.pulse { transform: none; }
  #win-floats :is(.win-cascade,.win-spin) { opacity: 1; transform: translate(-50%,-50%); }
  #win-floats :is(.win-cascade,.win-spin)::after { display: none; }
}

/* Keep the existing side meter readable at the model's largest payout. */
.round-total[data-large-amount=true] > #round-total { font-size: 26px; }
@media (max-width:700px) { .round-total[data-large-amount=true] > #round-total { font-size: clamp(15px, 5vw, 20px); } }

.sun-meter[data-charge]:not([data-charge=""])::after{content:attr(data-charge);position:absolute;left:50%;bottom:14px;transform:translateX(-50%);white-space:nowrap;max-width:100%;padding:3px 5px;border:1px solid #8cffe5;border-radius:5px;background:#063d4deb;color:#baffdf;font:900 11px/1.1 system-ui;box-shadow:0 0 12px #66efc53b;pointer-events:none}
@media(max-width:700px){.sun-meter[data-charge]:not([data-charge=""])::after{bottom:9px;font-size:7px;padding:2px 3px}}

/* Cash styling follows each counter's numeric value, including a zero current
   spin beside a positive bonus total. It never relies on the currency symbol. */
#live-win :is(#live-spin-amount,#live-total-amount),.round-total>#round-total{color:var(--cash-neutral,#d7e2df);text-shadow:0 1px #091e32;font-variant-numeric:tabular-nums lining-nums}
#live-win #live-total-amount[data-display-amount]:not([data-display-amount="0"]){color:var(--cash-gold,#fff0bf);text-shadow:var(--cash-gold-gloss,0 1px #051e2f,0 0 9px #76efce45)}
#live-win #live-spin-amount[data-display-amount]:not([data-display-amount="0"]){color:var(--cash-mint,#beffe5);text-shadow:var(--cash-mint-gloss,0 1px #051e2f,0 0 8px #65edbb48)}
.round-total>#round-total[data-total]:not([data-total="0"]){color:var(--cash-gold,#fff0bf);text-shadow:var(--cash-gold-gloss,0 1px #051e2f,0 0 9px #76efce45)}
.round-total:is([data-outcome=loss],[data-outcome=even],[data-outcome=pending],[data-outcome=preview])>#net{color:var(--cash-neutral,#d7e2df);text-shadow:none}
.round-total[data-outcome=gain]>#net{color:var(--cash-mint,#beffe5);text-shadow:var(--cash-mint-gloss,0 1px #051e2f,0 0 8px #65edbb48)}
#live-win #live-total-amount,.round-total[data-large-amount=true]>#round-total{max-width:100%;white-space:normal;overflow-wrap:anywhere}
#live-win #live-spin-amount{flex:0 1 auto;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;text-align:right}
@media(max-width:700px){
 #live-win #live-total-amount{font-size:clamp(14px,14cqi,20px);line-height:1.08;letter-spacing:-.45px}
 .round-total[data-large-amount=true]>#round-total{font-size:clamp(13px,4.3vw,18px);line-height:1.08}
}
@media(forced-colors:active){#live-win :is(#live-spin-amount,#live-total-amount),.round-total>#round-total,.round-total>#net{color:CanvasText!important;text-shadow:none!important}}

/* HEAT RADIO — illuminated dashboard tuner. The powered-off face stays still. */
.sound-dialog > .heat-radio { grid-column: 1 / -1; min-width: 0; width: 100%; }
.heat-radio {
  border: 1px solid #a9ffe1;
  border-right-color: #ff92a9;
  border-radius: 7px 22px 7px 22px;
  padding: 14px;
  margin: 16px 0 18px;
  background: radial-gradient(ellipse at 5% 0, #14af993d, transparent 58%), linear-gradient(125deg, #13394b, #20263f 69%, #43243e);
  box-shadow: inset 0 1px #ecffdf75, inset 0 -3px #061c2d91, 0 5px #081d30, 0 9px 24px #05182b4d;
  color: #fff3d3;
}
.radio-face {
  position: relative;
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 85px;
  padding: 12px 17px;
  border: 1px solid #65d6b76b;
  border-radius: 4px 13px 4px 13px;
  background: radial-gradient(ellipse at 8% 10%, #037c6352, transparent 74%), linear-gradient(105deg, #092f3a, #091e32);
  box-shadow: inset 0 2px 7px #02192ac7, inset 0 -1px #c8ffe32b;
}
.radio-face::after {
  content: '';
  position: absolute;
  inset: auto 12px 5px;
  height: 2px;
  background: repeating-linear-gradient(90deg, #b1e6c852 0 1px, transparent 1px 7px);
  pointer-events: none;
}
.radio-face > div:first-child { display: grid; gap: 5px; min-width: 110px; }
.radio-face span { font-size: 9px; font-weight: 850; letter-spacing: 3px; color: #b5ffdd; }
.radio-face b { font: italic 46px/.95 Impact, sans-serif; letter-spacing: 2px; color: #bcffd3; text-shadow: 0 0 13px #50fca647, 0 2px #002b33; font-variant-numeric: tabular-nums; }
.radio-face small { font-size: 9px; font-weight: 750; letter-spacing: 2px; color: #ffd395; }
.radio-face > svg { flex-shrink: 0; margin-left: auto; width: 60px; height: 60px; fill: none; stroke: #ffb37a; stroke-width: 2; opacity: 1; filter: drop-shadow(0 0 4px #ff5d7d38); }
.radio-face > svg .radio-dial-ticks { stroke: #92f4d4; stroke-width: 1.5; }
.radio-face > svg .radio-dial-needle { stroke: #ff6686; stroke-width: 3; }
.radio-bars { display: flex; align-items: center; justify-content: center; height: 45px; gap: 4px; flex: 1; }
.radio-bars i { width: 5px; height: 6px; border-radius: 1px; background: #548b8b; transform-origin: center; }
.heat-radio[data-on=true] .radio-bars i { height: 25px; background: linear-gradient(#ff987d 0 24%, #e9ffbc 24% 32%, #52edb1 33%); animation: radio-meter 1.2s ease-in-out infinite alternate; }
.radio-bars i:nth-child(2n) { animation-delay: -.4s !important; }
.radio-bars i:nth-child(3n) { animation-delay: -.8s !important; }
.radio-controls { display: grid; grid-template-columns: minmax(0,1fr) 180px; align-items: end; gap: 12px; margin-top: 14px; }
.radio-controls > label { display: grid; gap: 7px; margin: 0 !important; color: #d2f5df; font-size: 11px; font-weight: 750; }
.radio-controls select { min-width: 0; width: 100%; height: 43px; padding: 0 9px; border-radius: 5px; border: 1px solid #bce6dc90; background: #103448; color: #fff0d1; font-size: 11px; color-scheme: dark; }
.radio-controls button { min-height: 43px; padding: 8px 10px; border: 1px solid #fce3b5; border-radius: 4px 12px 4px 12px; background: linear-gradient(115deg, #b2ffe1, #55dcba 40%, #2ab2af); color: #103b46; font-size: 11px; font-weight: 900; box-shadow: inset 0 1px #fffadcc9, 0 3px #126674; }
.radio-controls button:hover { filter: brightness(1.07); }
.radio-controls button:active { transform: translateY(2px); box-shadow: inset 0 1px #fffadca0, 0 1px #126674; }
.heat-radio[data-on=true] #radio-toggle { background: linear-gradient(120deg, #732c50, #482742); color: #ffdbbd; border-color: #fc9b9d; box-shadow: inset 0 1px #ffdbbc3b, 0 3px #2b1d36; }
.heat-radio > p { font-size: 10px !important; line-height: 1.5; margin: 12px 0 0 !important; color: #badbd0; }

/* Existing city accents stay opt-in and retain their established timing. */
.city-beacons { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.city-beacons i { position: absolute; width: 12vw; height: 16vh; left: 0; top: 20%; border-radius: 50%; background: radial-gradient(ellipse,#ee63b622,transparent 70%); animation: city-sign-glint 7s ease-in-out infinite; }
.city-beacons i:nth-child(2) { left: auto; right: 2%; top: 37%; background: radial-gradient(ellipse,#55dfe726,transparent 70%); animation-delay: -3s; }
.city-beacons i:nth-child(3) { left: 22%; top: 75%; background: radial-gradient(ellipse,#ffd17916,transparent 70%); animation-delay: -5s; }
.quiet-city .city-beacons, .no-motion .city-beacons { display: none; }
@keyframes radio-meter { 0% { transform: scaleY(.24); } 45% { transform: scaleY(.9); } 100% { transform: scaleY(.42); } }
@keyframes city-sign-glint { 0%,10%,40%,100% { opacity: .25; } 18%,28%,68% { opacity: 1; } 23%,72% { opacity: .5; } }
@media (max-width: 480px) {
  .heat-radio { padding: 11px; }
  .radio-face { gap: 12px; padding: 11px; }
  .radio-face > svg { width: 42px; height: 42px; }
  .radio-face b { font-size: 40px; }
  .radio-controls { grid-template-columns: minmax(0,1fr); gap: 11px; }
  .radio-controls button { width: 100%; }
  .radio-bars { gap: 3px; }
  .radio-bars i { width: 4px; }
}
@media (prefers-reduced-motion: reduce) { .radio-bars i, .city-beacons i { animation: none !important; } }
.no-motion .radio-bars i { animation: none !important; }

/* Original transparent receiver: no panel behind the collectible. */
.radio-face > img.radio-dial{flex-shrink:0;margin-left:auto;width:100px;height:92px;object-fit:contain;filter:drop-shadow(0 5px 5px #010e20a0);background:none;border:0}
@media(max-width:420px){.radio-face>img.radio-dial{width:76px;height:78px}.radio-bars{gap:3px}.radio-bars i{width:3px}}

/* Explicit two-station audition: the same single music bus, no competing player. */
.sound-dialog > .sound-pack-field[hidden], .radio-controls > label[hidden] { display:none; }
.radio-controls { grid-template-columns:1fr; }
.radio-presets { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.heat-radio .radio-presets button { min-height:52px;border-color:#ffe7ae;background:linear-gradient(140deg,#ffd07a,#ff7e8c);color:#173344;box-shadow:inset 0 1px #fff7da,0 3px #92395b; }
.heat-radio .radio-presets button:last-child { background:linear-gradient(140deg,#91fede,#47d7d3);box-shadow:inset 0 1px #e5fff6,0 3px #125f7a; }
.heat-radio .radio-presets button[aria-pressed=true] { position:relative; color:#102e41; text-shadow:none; border-color:#fff6cf; outline:2px solid #fff7d6;outline-offset:3px; }
.heat-radio .radio-presets button:last-child[aria-pressed=true] { background:linear-gradient(140deg,#b9ffe5,#64ece1);color:#102e41; }
.heat-radio .radio-presets button:first-child[aria-pressed=true] { background:linear-gradient(140deg,#ffebad,#ffaf94);color:#302346; }
.heat-radio .radio-presets button[aria-pressed=true]::after { content:'✓';position:absolute;right:8px;top:5px;font-size:10px;color:#123b46; }

.radio-presets span { display:inline-block;margin-right:5px;font-size:16px; }
@media(max-width:370px){.radio-presets{gap:7px}.radio-presets button{font-size:9px;padding:7px}.radio-presets span{font-size:13px;margin-right:2px}}

/* Keep the receiver and tuner inside the narrowest portrait dialog. */
@media(max-width:370px){
  .radio-face{gap:6px;padding:10px 8px;}
  .radio-face>div:first-child{min-width:0;flex:1;}
  .radio-face span{font-size:7px;letter-spacing:1.8px;}
  .radio-face b{font-size:34px;letter-spacing:1px;}
  .radio-face>img.radio-dial{width:56px;height:64px;}
  .radio-bars{flex:0 0 31px;gap:2px;}
  .radio-bars i{width:2px;}
}

/* Settled-symbol roles. No layout changes, idle animation or synthetic outcome hints. */
.tile.symbol-motion-ready{--sm-color:#b5ccc9;--sm-rim:#b7dad72c;--sm-bed:#b7dad703;isolation:isolate}
.tile.symbol-motion-ready[data-symbol-tier="2"]{--sm-color:#c5d3d9;--sm-rim:#c5d3d937}
.tile.symbol-motion-ready[data-symbol-tier="3"]{--sm-color:#e5d2a3;--sm-rim:#e5d2a349}
.tile.symbol-motion-ready[data-symbol-tier="4"]{--sm-color:#d5b3fa;--sm-rim:#d5b3fa78;--sm-bed:#c490f10b}
.tile.symbol-motion-ready[data-symbol-tier="5"]{--sm-color:#b1f3fa;--sm-rim:#b1f3fa91;--sm-bed:#75dfec0e}
.tile.symbol-motion-ready[data-symbol-tier="6"]{--sm-color:#ffe2a1;--sm-rim:#ffe2a1b5;--sm-bed:#ffdd9311}
.tile.symbol-motion-ready[data-symbol-tier="7"]{--sm-color:#ffb18b;--sm-rim:#ffb18bda;--sm-bed:#ff8d6c16}
/* The surface is invisible at rest; it only carries a confirmed finite win pass. */
.tile.symbol-motion-ready>.sm-role-surface{position:absolute;inset:5%;z-index:0;pointer-events:none;border:1px solid transparent;border-radius:7px;background:none;box-shadow:none;opacity:1}
.tile.symbol-motion-ready[data-symbol-role="scatter"]{--sm-color:#ffda92;--sm-rim:#ff9d70;--sm-bed:#ff996523}
.tile.symbol-motion-ready[data-symbol-role="scatter"]>.sm-role-surface{inset:3%;border-radius:8px}
.tile.symbol-motion-ready[data-symbol-role="multiplier"]{--sm-color:#89fff1;--sm-rim:#89fff1;--sm-bed:#5afcdf1b}
.tile.symbol-motion-ready[data-symbol-role="multiplier"]>.sm-role-surface{inset:3%;border-radius:8px}
.tile.symbol-motion-ready>svg.sm-art{z-index:1;animation:none!important;transition:none;transform-origin:50% 62%}
.tile.symbol-motion-ready.winning>svg.sm-art{animation:none!important;filter:drop-shadow(0 3px 3px #001a3277) saturate(1.12) brightness(1.06)}
.tile.symbol-motion-ready.winning:before,.tile.symbol-motion-ready.multiplier-hit:before{content:none!important;animation:none!important}
.tile.symbol-motion-ready.winning:after{animation:none!important;z-index:3;box-shadow:none;border-color:var(--group-color,var(--sm-color))}
.tile.symbol-motion-ready.scatter-glow{animation:none!important}
.tile.symbol-motion-ready>.sm-role-label{position:absolute;z-index:4;top:5%;left:50%;transform:translateX(-50%);border:1px solid #c8fff4;background:#76e7d5;color:#0c3647;border-radius:3px;padding:1px 4px;font-size:clamp(6px,.65vw,9px);font-weight:950;line-height:1.2;letter-spacing:.6px;pointer-events:none;white-space:nowrap}
.tile.symbol-motion-ready[data-symbol-role="scatter"]>.sm-role-label{top:auto;bottom:5%;background:#ffb982;color:#402d3a;border-color:#fff1c9}
.tile.symbol-motion-ready .bonus-label{z-index:4;bottom:4%;min-width:62%;text-align:center;padding:2px 4px;border:1px solid #fff1c9;border-radius:3px;background:linear-gradient(#ffe4b5,#ffa677);color:#3a2635;font-size:clamp(8px,.85vw,12px);font-weight:950;letter-spacing:.6px;line-height:1.1;box-shadow:0 2px #a0524555;text-shadow:none}
.tile.symbol-motion-ready .sun-number{z-index:4;border-color:#bbffef;background:#103b49ed;color:#fff5d8;box-shadow:0 2px #061b2799;font-weight:950}
.tile.symbol-motion-ready .position-mark{z-index:5}
.tile.symbol-motion-ready>svg.sm-fx{position:absolute;left:2%;top:2%;width:96%;height:96%;z-index:2;overflow:hidden;pointer-events:none;filter:none!important;animation:none!important;transform:none!important;contain:paint}
.tile.symbol-motion-ready>svg.sm-fx [data-part="reel"]{transform-box:view-box;transform-origin:0 0}
.tile.symbol-motion-ready.sm-win-active>.sm-role-surface,.tile.symbol-motion-ready.sm-static-hit>.sm-role-surface{border-color:var(--sm-color);background:linear-gradient(145deg,var(--sm-bed),transparent 40%,var(--sm-bed))}
.no-motion .tile.symbol-motion-ready>svg.sm-fx{display:none}
@media(max-width:700px){
 .tile.symbol-motion-ready>svg.sm-fx{left:.5%;top:.5%;width:99%;height:99%}
 .tile.symbol-motion-ready>.sm-role-surface{border-radius:5px}
 .tile.symbol-motion-ready[data-symbol-role="scatter"]>.sm-role-surface,.tile.symbol-motion-ready[data-symbol-role="multiplier"]>.sm-role-surface{border-width:1.5px;border-radius:6px}
 .tile.symbol-motion-ready .bonus-label{font-size:8px;letter-spacing:.3px;padding:1px 3px}
 .tile.symbol-motion-ready>.sm-role-label{font-size:6px;letter-spacing:.3px;padding:1px 3px}
}
@media(prefers-reduced-motion:reduce){.tile.symbol-motion-ready>svg.sm-fx{display:none}}

/* Confirmed wins: a lock, a chrome pass, then still corners. No idle loops. */
.board.evaluating .tile:not(.winning){opacity:.84;filter:saturate(.88)}
.tile.symbol-motion-ready.winning{background:radial-gradient(ellipse,var(--sm-bed),transparent 78%)}
.tile.symbol-motion-ready.winning:after{
 content:'';inset:4%;border:0;border-radius:5px;pointer-events:none;
 background:linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) left top/18% 2px,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) left top/2px 18%,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) right top/18% 2px,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) right top/2px 18%,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) left bottom/18% 2px,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) left bottom/2px 18%,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) right bottom/18% 2px,
 linear-gradient(var(--group-color,var(--sm-color)),var(--group-color,var(--sm-color))) right bottom/2px 18%;
 background-repeat:no-repeat;filter:drop-shadow(0 0 3px var(--group-color,var(--sm-color)));
 animation:chrome-win-lock 760ms cubic-bezier(.2,.75,.25,1) both!important;
}
.tile.symbol-motion-ready.sm-win-active>.sm-role-surface{overflow:hidden;box-shadow:inset 0 0 12px #fff0d51c}
.tile.symbol-motion-ready.sm-win-active>.sm-role-surface:before{
 content:'';position:absolute;inset:0;border:0;border-radius:inherit;
 background:linear-gradient(115deg,transparent 35%,#fff5df90 48%,#9bffe87d 52%,transparent 65%);
 transform:translateX(-110%);animation:chrome-symbol-pass 760ms ease-out both;
}
.tile.symbol-motion-ready>svg.sm-fx [data-part="flame"]{transform-box:fill-box;transform-origin:center bottom}
.tile.symbol-motion-ready>svg.sm-fx [data-part="exhaust"]{transform-box:fill-box;transform-origin:left center}
.tile.symbol-motion-ready.winning .position-mark{background:#fff2d3;color:#133b49;border:1px solid var(--group-color);box-shadow:0 2px #091c2a}
.column-stop{opacity:1;background:linear-gradient(90deg,#72ffe000,#72ffe031 4%,transparent 24%,transparent 75%,#ffb0a031 96%,#ffb0a000);border-top:2px solid #c3ffea77;border-bottom:2px solid #ffb4a166;animation:chrome-drum-lock 300ms ease-out both;box-shadow:none}
@keyframes chrome-win-lock{0%{opacity:0;transform:scale(.91)}20%{opacity:1;transform:scale(1.025)}65%{opacity:.95;transform:scale(1)}100%{opacity:.72;transform:scale(1)}}
@keyframes chrome-symbol-pass{0%,12%{opacity:0;transform:translateX(-110%)}35%{opacity:.5}85%,100%{opacity:0;transform:translateX(110%)}}
@keyframes chrome-drum-lock{0%{opacity:0;transform:translateY(-3px)}25%{opacity:.7;transform:translateY(1px)}100%{opacity:0;transform:translateY(0)}}
.fast-mode .tile.symbol-motion-ready.winning:after,.fast-mode .tile.symbol-motion-ready.sm-win-active>.sm-role-surface:before{animation-duration:260ms!important}
.no-motion .tile.symbol-motion-ready.winning:after{animation:none!important;opacity:.85;transform:none;filter:none}
.no-motion .tile.symbol-motion-ready.sm-win-active>.sm-role-surface:before{display:none}
@media(prefers-reduced-motion:reduce){.tile.symbol-motion-ready.winning:after{animation:none!important;opacity:.85;transform:none;filter:none}.tile.symbol-motion-ready.sm-win-active>.sm-role-surface:before{display:none}}

/* The art carries value hierarchy at rest; all settled symbols stay free of frames. */
.tile.symbol-motion-ready.sm-win-active>.sm-role-surface{border-color:var(--sm-color)}
.tile.removing{animation:chrome-paid-clear 180ms ease-in both;transition:none}
.fast-mode .tile.removing{animation-duration:90ms}
@keyframes chrome-paid-clear{0%{opacity:1;clip-path:inset(0);transform:translateY(0)}35%{opacity:1;clip-path:inset(12% 0);transform:translateY(-2px)}100%{opacity:0;clip-path:inset(49% 0);transform:translateY(-5px)}}
.no-motion .tile.removing{animation:none!important;clip-path:none;transform:none;opacity:0}
@media(prefers-reduced-motion:reduce){.tile.removing{animation:none!important;clip-path:none;transform:none;opacity:0}}

/* v9.14: the diamond contains its own BONUS plaque; do not cover it with a second label. */
.tile.symbol-motion-ready[data-symbol-role="scatter"] .bonus-label,.tile.symbol-motion-ready[data-symbol-role="scatter"]>.sm-role-label{display:none}
.tile.symbol-motion-ready[data-symbol-role="scatter"]{--sm-color:#79ffec;--sm-rim:#fc73d2;--sm-bed:#ff36ac21}
.tile.symbol-motion-ready[data-symbol-role="scatter"]>.sm-role-surface{inset:3%;border-radius:8px}
.tile.symbol-motion-ready>svg.sm-fx [data-part="star"]{transform-box:fill-box;transform-origin:center}

/* NITRO lettering is part of the collectible. The numeric multiplier has its own corner badge. */
.tile.symbol-motion-ready[data-symbol-role="multiplier"]>.sm-role-label{display:none}
.tile.symbol-motion-ready .sun-number{left:auto;right:2%;top:5%;bottom:auto;transform:none;min-width:31%;width:auto;height:auto;padding:3px 5px;border-radius:9px;font-size:clamp(12px,2vw,24px);line-height:1;border:1.5px solid #dafff5;background:linear-gradient(135deg,#104959f5,#26344ff5);box-shadow:0 2px 0 #051c2a,0 0 7px #7affdf44;text-shadow:0 1px 1px #061629}
@media(max-width:700px){.tile.symbol-motion-ready .sun-number{padding:2px 3px;font-size:clamp(11px,3vw,18px);border-radius:6px}}

/* One landing settle per stopped board and optional finite art inspection. */
.tile.symbol-motion-ready.sm-landing:not(.winning):not(.sm-inspect-active)>svg.sm-art{animation:sm-art-land 240ms cubic-bezier(.2,.7,.3,1) calc(var(--col,0)*18ms) both!important}
@keyframes sm-art-land{0%{translate:0 -2px;scale:.98}55%{translate:0 1px;scale:1.008}100%{translate:0 0;scale:1}}
.tile.symbol-motion-ready.sm-inspect-active>.sm-role-surface{background:none;border-color:transparent;box-shadow:none}
.tile.symbol-motion-ready.sm-inspect-active>svg.sm-fx{opacity:.75}
.board.reel-running .tile.symbol-motion-ready.sm-landing>svg.sm-art,.no-motion .tile.symbol-motion-ready.sm-landing>svg.sm-art{animation:none!important}
@media(prefers-reduced-motion:reduce){.tile.symbol-motion-ready.sm-landing>svg.sm-art{animation:none!important}}

/* Authored lid hinge and watch pivot align to the atlas crop; no moving cell. */
.tile.symbol-motion-ready>svg.sm-fx [data-part="lid"]{transform-box:view-box;transform-origin:145px 195px}
.tile.symbol-motion-ready>svg.sm-fx [data-part="minute-hand"]{transform-box:view-box;transform-origin:0 0}

/* Authored source-space pivots. Cutout and replacement use the same crop. */
.tile.symbol-motion-ready>svg.sm-fx [data-part="second-hand"]{transform-box:view-box;transform-origin:0 0}
.tile.symbol-motion-ready>svg.sm-fx :is([data-part="diamond"],[data-part="diamond-light"]){transform-box:view-box;transform-origin:256px 180px}
.tile.symbol-motion-ready>svg.sm-fx [data-part="valve"]{transform-box:view-box;transform-origin:335px 29px}
.tile.symbol-motion-ready>svg.sm-fx [data-part="beam"]{transform-box:view-box;transform-origin:176px 205px}
.tile.symbol-motion-ready>svg.sm-fx [data-part="exhaust"]{transform-box:view-box;transform-origin:427px 85px}
/* Source composites replace original artwork, including inspection previews. */
.tile.symbol-motion-ready.sm-inspect-active>svg.sm-fx.sm-source-composite{opacity:1}

/* GTA / GRAND TURBO ARCADE — an original single-line demo wordmark.
   Mint G and coral TA share an illuminated chrome cut, never a stacked lockup. */
.topbar .brand.brand-gta {
  --wordmark-size: 76px;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: end;
  column-gap: 1px;
  width: 176px;
  max-width: 100%;
  min-width: 0;
  line-height: 1;
  transform: skew(-10deg);
  transform-origin: left center;
  filter: drop-shadow(0 3px 0 #092538) drop-shadow(0 0 11px #2ef3ce23);
  container-type: inline-size;
}
.topbar .brand.brand-gta > :is(span, strong) {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  font-family: Impact, 'Arial Narrow', sans-serif;
  font-size: min(var(--wordmark-size), 44cqi);
  font-style: normal;
  font-weight: 400;
  line-height: .82;
  letter-spacing: 1.1px;
  white-space: nowrap;
}
.topbar .brand.brand-gta > span {
  grid-column: 1;
  grid-row: 1;
  color: #19ffd0;
  -webkit-text-stroke: .55px #edfff0;
  text-shadow: none;
  filter: drop-shadow(0 2px 0 #007e80);
}
.topbar .brand.brand-gta > strong {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  width: fit-content;
  color: #ff5178;
  -webkit-text-stroke: .65px #fff5d2;
  text-shadow: none;
  filter: drop-shadow(0 2px 0 #bd1255);
}
.topbar .brand.brand-gta > strong::after { content: none; }
.topbar .brand.brand-gta > small {
  grid-column: 1 / -1;
  grid-row: 2;
  display: block;
  max-width: 100%;
  margin: 9px 0 0;
  padding-top: 6px;
  background: linear-gradient(90deg, #64ffcf 0 31%, #fff2cd 31% 34%, #ff5185 34% 94%, transparent 94%) top left / 100% 2px no-repeat;
  font: 850 7px/1.3 'Avenir Next', 'Trebuchet MS', sans-serif;
  letter-spacing: .46px;
  color: #fff4d8;
  transform: skew(10deg);
  transform-origin: left center;
  text-shadow: 0 1px 3px #102d3e;
}
@supports (-webkit-background-clip: text) {
  .topbar .brand.brand-gta > span {
    background: linear-gradient(180deg, #defff1 0%, #35ffd3 10%, #00f1bd 43%, #009fae 46%, #00d6bc 58%, #26ffd0 95%, #a5ffe4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .topbar .brand.brand-gta > strong {
    background: linear-gradient(180deg, #fff2d0 0%, #ffb67e 10%, #ff784f 43%, #ff295f 46%, #f41478 78%, #ff6986 96%, #ffbe9b 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
.marquee::before { content: 'GTA / GRAND TURBO ARCADE'; color: #a8ffe0; }
.marquee { border-bottom-color: #55f7ca55; }

/* A quieter permanent frame leaves the bright event choreography in charge. */
.marquee>span:first-child,.feature-strip>span:first-child,.feature-strip>span:first-child+i{display:none}
.feature-rail .getaway-poster,.rail-heading>span,.rail-heading>em{display:none}
.feature-rail .rail-heading{font-size:27px;line-height:1.1;letter-spacing:1.5px;margin-bottom:4px;color:#fff4d4;text-shadow:1px 2px #ec3679,2px 4px #082c40}
.feature-rail{padding-top:20px!important}
@media(max-width:700px){.feature-rail{padding-top:0!important}}
.reel-lamps i.landed { background: #93ffe5; box-shadow: 0 0 5px #61e9d53d; }
.pursuit-hud {
  color: #b7f1e1;
  border-color: #91e3d36b;
  background: linear-gradient(110deg, #204a53ee, #254760ee);
}
.pursuit-hud > span > i { background: #ffae88; box-shadow: none; }
.pursuit-hud > b { color: #fff0ce; font-variant-numeric: tabular-nums; }
[data-pursuit-phase=arrival] .pursuit-hud { border-color: #ffc795a6; }

@media (max-width: 700px) {
  .topbar .brand.brand-gta { --wordmark-size: 49px; width: 115px; column-gap: 0; }
  .topbar .brand.brand-gta > :is(span, strong) { letter-spacing: .7px; -webkit-text-stroke-width: .4px; }
  .topbar .brand.brand-gta > span { text-shadow: none; filter: drop-shadow(0 1px 0 #007e80); }
  .topbar .brand.brand-gta > strong { text-shadow: none; filter: drop-shadow(0 1.5px 0 #b81254); }
  .topbar .brand.brand-gta > small { margin-top: 6px; padding-top: 5px; font-size: 6px; letter-spacing: .12px; line-height: 1.3; }
}
@media (max-width: 370px) {
  .topbar .brand.brand-gta { --wordmark-size: 40px; width: 90px; }
  .topbar .brand.brand-gta > :is(span, strong) { letter-spacing: .35px; -webkit-text-stroke-width: .3px; }
  .topbar .brand.brand-gta > small { margin-top: 5px; padding-top: 4px; font-size: 5.7px; letter-spacing: .1px; line-height: 1.25; }
}
@media (min-width: 701px) and (max-height: 560px) {
  .topbar .brand.brand-gta { --wordmark-size: 56px; width: 160px; }
  .topbar .brand.brand-gta > small { margin-top: 6px; padding-top: 4px; font-size: 6px; letter-spacing: .25px; }
}
@media (max-width: 700px) and (max-height: 650px) {
  .topbar .brand.brand-gta { --wordmark-size: 37px; }
  .topbar .brand.brand-gta > small { margin-top: 4px; padding-top: 4px; font-size: 5.5px; }
}
@media (forced-colors: active) {
  .topbar .brand.brand-gta > :is(span, strong) { background: none; -webkit-text-fill-color: CanvasText; -webkit-text-stroke: 0; text-shadow: none; }
  .topbar .brand.brand-gta > small { color: CanvasText; background: none; text-shadow: none; border-top: 1px solid CanvasText; }
}

/* Award reveal stays on the real board. Four actual cards light up first. */
.board.bonus-triggering .tile:not(.bonus-trigger-card){opacity:.76;filter:saturate(.86);transition:opacity .35s ease,filter .35s ease}
.board.bonus-triggering .bonus-trigger-card{z-index:8;isolation:isolate;border-color:#fff1ad;background:radial-gradient(ellipse,#ffe5a431,transparent 76%);box-shadow:inset 0 0 18px #ffd0683b}
.board.bonus-triggering .bonus-trigger-card:after{content:'';position:absolute;inset:3%;border:2px solid #ffe5a4;border-left-color:#ffb398;border-right-color:#c7ffe5;border-radius:7px;pointer-events:none;box-shadow:inset 0 0 0 3px #fff1cd0b,0 0 10px #ffe5a449;animation:bonus-card-charge 1000ms calc(var(--trigger-order)*100ms) both}
@keyframes bonus-card-charge{0%{opacity:0;transform:scale(.94)}15%{opacity:1;transform:scale(1.025)}45%{opacity:1;transform:scale(1)}100%{opacity:.85;transform:scale(1)}}
.natural-bonus{position:absolute;inset:0;z-index:25;display:grid;place-content:center;text-align:center;padding:14px;box-sizing:border-box;pointer-events:auto;border-radius:inherit;overflow:hidden;background:linear-gradient(180deg,#041d3200 0,#041d3230 28%,#061a3650 100%);color:#fff5d7;outline:0}
.natural-bonus[hidden]{display:none}
.natural-bonus:before{content:'';position:absolute;width:560px;height:320px;max-width:95%;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;background:radial-gradient(ellipse,#ffe5a425,transparent 68%);opacity:0;animation:bonus-award-halo 1600ms 600ms ease-out both}
.natural-bonus-panel{position:relative;z-index:2;width:min(460px,75vw);box-sizing:border-box;padding:21px 28px 19px;border:2px solid #ffe5a5;border-radius:7px 29px 7px 29px;background:linear-gradient(115deg,#153b4df5 0,#263851f5 48%,#753955f5 100%);box-shadow:0 0 0 4px #0b253bc9,0 9px 0 #081d3299,0 0 38px #ff9f8533,inset 0 1px 0 #fff5cb77;transform:translateY(6px);opacity:0;animation:bonus-award-panel 750ms 1050ms cubic-bezier(.2,.8,.2,1) both}
.natural-bonus-panel:before{content:none}
.natural-bonus-panel:after{content:'';position:absolute;left:15%;right:15%;top:-2px;height:2px;pointer-events:none;background:linear-gradient(90deg,#72ffe0,#ffe5a4 48%,#ff786d);box-shadow:0 0 12px #ffe5a4aa}
.natural-bonus-top{display:flex;justify-content:center;gap:9px;align-items:center;font:900 11px/1.25 system-ui;letter-spacing:2px;color:#91f5da}
.natural-bonus-top svg{width:38px;height:38px;filter:drop-shadow(0 2px 4px #0009)}
.natural-bonus-top b{padding:4px 9px;border:1px solid #fddb9a;border-radius:7px;color:#ffe8ac;font-size:15px;letter-spacing:0;background:#152439}
.natural-bonus h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.natural-bonus-award{display:flex;align-items:center;justify-content:center;gap:14px;margin:19px 0 20px}
.natural-bonus-award strong{position:relative;font-family:Impact,'Arial Narrow',sans-serif;font-size:83px;line-height:.95;letter-spacing:-2px;color:#fff0ba;text-shadow:2px 3px #aa6b77,4px 5px #162a46;animation:bonus-ten-focus 650ms 1350ms ease-out both}
.natural-bonus-award strong:after{content:'';position:absolute;inset:-8px -19px;border:1px solid #ffe5a444;border-left-color:#72ffe0;border-right-color:#ff9786;border-radius:50%;transform:rotate(-18deg);pointer-events:none;animation:bonus-award-arc 650ms 1550ms ease-out both}
.natural-bonus-award span{max-width:150px;text-align:left;font:950 16px/1.15 system-ui;letter-spacing:1px;color:#fff2da}
.natural-bonus .primary-action{width:100%;min-height:54px;margin:0;display:flex;justify-content:center;gap:14px;align-items:center;font-size:17px;font-weight:950;letter-spacing:1px;background:linear-gradient(112deg,#90f5dc 0,#47bebd 25%,#ffc290 26%,#fa859b 66%,#e75186 100%);color:#123443;border:2px solid #fff0b6;border-radius:14px;box-shadow:0 5px 0 #733753,inset 0 1px 0 #fff9;cursor:pointer}
.natural-bonus .primary-action:disabled{opacity:.4;cursor:default;box-shadow:none}
.natural-bonus .primary-action:focus-visible{outline:3px solid #fff;outline-offset:5px}
.natural-bonus .primary-action:not(:disabled):hover{filter:brightness(1.12);transform:translateY(-1px)}
.natural-bonus .primary-action:not(:disabled):active{transform:translateY(3px);box-shadow:0 1px 0 #733753}
.natural-bonus p{margin:12px 0 0;font:650 10px/1.35 system-ui;letter-spacing:.35px;color:#bfddd5}
.natural-bonus[data-phase=collecting] p{visibility:hidden}
@keyframes bonus-award-panel{0%{opacity:0;transform:translateY(24px) scale(.94)}70%{opacity:1;transform:translateY(-2px) scale(1.015)}100%{opacity:1;transform:translateY(0) scale(1)}}
.bonus-award-stamp{position:absolute;z-index:1;left:var(--stamp-x);top:var(--stamp-y);width:22px;height:22px;border:2px solid #ffe5a4;border-radius:3px;background:linear-gradient(135deg,#72ffe0,#ffe5a4 50%,#ff9786);box-shadow:0 0 13px #ffe5a483;pointer-events:none;opacity:0;transform:translate(-50%,-50%) rotate(-20deg);animation:bonus-stamp-flight 600ms var(--stamp-delay) cubic-bezier(.4,0,.2,1) both}
.bonus-award-stamp:before{content:'';position:absolute;inset:4px;border:1px solid #133d4b88;border-radius:1px}
@keyframes bonus-ten-focus{0%{opacity:0;transform:translateY(7px) scale(.94)}40%{opacity:1;transform:translateY(0) scale(1.03)}100%{opacity:1;transform:none}}
@keyframes bonus-award-arc{0%{opacity:0;transform:rotate(-40deg) scale(.92)}45%{opacity:.85}100%{opacity:.6;transform:rotate(-18deg) scale(1)}}
@keyframes bonus-award-halo{0%{opacity:0}50%{opacity:.75}100%{opacity:.25}}
.natural-bonus[data-reduced=true]:before{animation:none;background:none}
.natural-bonus[data-reduced=true] .natural-bonus-panel{animation:none;opacity:1;transform:none}
.natural-bonus[data-reduced=true] .natural-bonus-award strong,.natural-bonus[data-reduced=true] .natural-bonus-award strong:after{animation:none;opacity:1;transform:none}
.no-motion .board.bonus-triggering .bonus-trigger-card:after{animation:none;opacity:.7}
@media(max-width:700px){.natural-bonus{padding:9px}.natural-bonus-panel{width:min(270px,80vw);padding:11px 16px 13px;border-radius:18px;box-shadow:0 0 0 3px #0b253bcc,0 8px 0 #081d3280,0 0 40px #ffbf4a33}.natural-bonus-top{font-size:8px;letter-spacing:1.1px;gap:6px}.natural-bonus-top svg{width:27px;height:27px}.natural-bonus-top b{font-size:12px;padding:3px 6px}.natural-bonus h2{font-size:28px;margin:5px 0 2px}.natural-bonus-award{gap:11px;margin:4px 0 10px}.natural-bonus-award strong{font-size:65px}.natural-bonus-award span{font-size:12px;max-width:116px}.natural-bonus .primary-action{min-height:45px;font-size:12px;border-radius:10px;letter-spacing:.7px}.natural-bonus p{font-size:8px;margin-top:8px}}
@media(prefers-reduced-motion:reduce){.natural-bonus:before,.natural-bonus-panel,.natural-bonus-award strong,.natural-bonus-award strong:after,.board.bonus-triggering .bonus-trigger-card:after{animation:none}.natural-bonus-panel{opacity:1;transform:none}.bonus-award-stamp{display:none}}

/* A real diamond travels from every awarded board position. The originals stay visible. */
.bonus-award-stamp{width:42px;height:42px;border:0;border-radius:0;background:url('assets/bonus-diamond-v9.14.webp') center/contain no-repeat;box-shadow:none;filter:drop-shadow(0 0 5px #72ffe0b0)}
.bonus-award-stamp:before{content:none}
.natural-bonus-panel{border-color:#9ffff1;background:linear-gradient(115deg,#084f5df8,#283257f7 48%,#7c1c64f7);box-shadow:0 0 0 4px #091a3be3,0 9px 0 #06162e99,0 0 32px #ff39b14d,inset 0 1px 0 #fff7cfaa}
.natural-bonus-top svg{width:68px;height:68px;filter:drop-shadow(0 0 8px #ff37aa66)}
.natural-bonus-top{color:#a1fff0}
.natural-bonus-award{margin-top:10px}
.natural-bonus-award strong{color:#fff9ca;text-shadow:2px 3px #f24899,4px 5px #082f4f}
@media(max-width:700px){.natural-bonus-top svg{width:40px;height:40px}.natural-bonus-award{margin-top:3px}.bonus-award-stamp{width:28px;height:28px}}

@media(min-width:701px){
 .natural-bonus-panel{padding:13px 22px 12px}
 .natural-bonus-top svg{width:46px;height:46px}
 .natural-bonus-top{font-size:10px;letter-spacing:1.4px}
 .natural-bonus-award{margin:8px 0 12px}
 .natural-bonus-award strong{font-size:62px}
 .natural-bonus-award span{font-size:14px}
 .natural-bonus .primary-action{min-height:46px;font-size:15px}
 .natural-bonus p{margin-top:8px;font-size:9px}
}
/* Finite collection choreography: authentic diamonds, light paths and a coastal prism. */
.bonus-prism-art{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.bonus-award-prism{position:absolute;left:50%;top:13%;width:144px;height:144px;transform:translate(-50%,-50%);opacity:0;animation:bonus-prism-reveal 850ms 850ms ease-out both}
.bonus-award-prism:before{content:'';position:absolute;inset:17% 10% 14%;clip-path:polygon(24% 0,76% 0,100% 35%,50% 100%,0 35%);background:linear-gradient(130deg,#91fff179,#ff67bb48 60%,#ffe8ad7a),url('assets/neon-boulevard-v9.webp') center/cover;transform:rotate(-7deg);opacity:.85}
.bonus-award-prism:after{content:'';position:absolute;inset:13%;clip-path:polygon(24% 0,76% 0,100% 35%,50% 100%,0 35%);background:linear-gradient(120deg,transparent 30%,#fffbe7a6 48%,transparent 65%);animation:bonus-prism-reflection 700ms 1350ms ease-out both}
.bonus-award-prism>svg{position:absolute;width:100%;height:100%;opacity:.88;filter:drop-shadow(0 3px 2px #062c46aa)}
.bonus-collection-roads{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bonus-collection-road{fill:none;stroke:#adffe8;stroke-width:1.3;stroke-linecap:round;stroke-dasharray:7 5;opacity:0;animation:bonus-road-collect 950ms var(--road-delay) ease-out both}
.bonus-award-stamp{background:none!important;filter:drop-shadow(0 2px 2px #09233988);width:42px;height:42px}
.bonus-award-stamp>svg{display:block;width:100%;height:100%}
@keyframes bonus-road-collect{0%{opacity:0;stroke-dashoffset:30}25%{opacity:.65}75%{opacity:.35}100%{opacity:0;stroke-dashoffset:0}}
@keyframes bonus-prism-reveal{0%{opacity:0;transform:translate(-50%,-40%) scale(.72) rotate(-12deg)}65%{opacity:1;transform:translate(-50%,-50%) scale(1.07) rotate(3deg)}100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}}
@keyframes bonus-prism-reflection{0%{opacity:0;transform:translateX(-35%)}40%{opacity:.8}100%{opacity:0;transform:translateX(35%)}}
.natural-bonus-panel{border-radius:5px 25px 5px 25px;border-color:#c4ffec;background:linear-gradient(115deg,#084454f5,#293653f5 52%,#682455f5)}
.natural-bonus-award strong{font-size:74px;letter-spacing:-1px}
.natural-bonus-award span{font-size:14px;letter-spacing:1.4px;color:#e2fff0}
.natural-bonus .primary-action{border-radius:4px 14px 4px 14px;letter-spacing:1.1px}
.natural-bonus[data-reduced=true] .bonus-award-prism{animation:none;opacity:.65;transform:translate(-50%,-50%)}
.natural-bonus[data-reduced=true] .bonus-award-prism:after{display:none}
@media(max-width:700px){.bonus-award-prism{width:96px;height:96px;top:15%}.bonus-award-stamp{width:30px;height:30px}.natural-bonus-award strong{font-size:62px}.natural-bonus-award span{font-size:11px;letter-spacing:.7px}}
body.frame-compact .bonus-award-prism{width:60px;height:60px;top:20%;opacity:.45}
@media(prefers-reduced-motion:reduce){.bonus-award-prism{animation:none;opacity:.65;transform:translate(-50%,-50%)}.bonus-award-prism:after,.bonus-collection-roads{display:none}}
.bonus-award-stamp{left:50%;top:35%;will-change:transform,opacity}
@keyframes bonus-stamp-flight{0%{opacity:0;transform:translate(calc(-50% + var(--stamp-offset-x,0px)),calc(-50% + var(--stamp-offset-y,0px))) rotate(-12deg) scale(.65)}18%{opacity:1}85%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) rotate(10deg) scale(.35)}}

/* Compact presentation preference: the existing balance area keeps its height. */
.balance>div{min-width:0}.balance small{display:flex;align-items:center;gap:6px;white-space:nowrap}.currency-control{display:inline-flex;flex:none}.currency-control select{appearance:auto;width:60px;min-height:24px;padding:1px 2px;border:1px solid #72c7bc85;border-radius:5px;background:#163746;color:#fff0cf;font:700 10px/1.2 Arial,sans-serif;letter-spacing:0;cursor:pointer}.currency-control select:focus-visible{outline:2px solid #a6f5e8;outline-offset:2px}.currency-control select:disabled{opacity:.65;cursor:default}.stake-currency{display:inline!important;margin-left:4px;font:700 9px/1 Arial,sans-serif!important;letter-spacing:0;color:#c4fae7;white-space:nowrap}.demo-denomination{font-size:11px;line-height:1.5}.wallet-reset-action{width:100%;margin:14px 0 8px;min-height:44px}.currency-unit{white-space:nowrap}@media(max-width:480px){.balance small{gap:4px}.currency-control select{width:57px;min-height:22px;font-size:9px}.stake-currency{font-size:8px!important}.balance strong{font-size:clamp(17px,4.5vw,22px)}}
/* Keep the currency selector and the amount outside the 44px top-up target. */
@media(max-width:700px){
 .top-actions .balance small{gap:3px;letter-spacing:0}
 .top-actions .balance small>span{font-size:0}
 .top-actions .balance small>span:after{content:'DEMO';font:700 6px/1 Arial,sans-serif;letter-spacing:.15px}
 .top-actions .balance .currency-control select{width:47px;min-height:22px;font-size:8px}
 .top-actions .balance strong{font-size:clamp(13px,3.7vw,16px);letter-spacing:-.5px}
}
@media(max-width:370px){
 .top-actions #sound{display:none}
 .top-actions .balance{flex:0 0 132px;width:132px}
 .top-actions .balance strong{font-size:13px}
}

/* A compact metal badge with a full 44px target; its menu escapes cabinet clipping. */
.currency-control.currency-picker-ready{position:relative;align-items:center;height:24px;max-width:70px}
.currency-control.currency-picker-ready>#currency{position:absolute;width:1px!important;min-width:0;height:1px!important;min-height:0!important;padding:0;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.currency-control .currency-picker-toggle{display:flex;align-items:center;justify-content:center;flex:none;width:66px;min-width:0;height:44px;min-height:44px;margin:-10px 0;padding:10px 0;border:0;border-radius:8px;background:transparent;color:#fff5dc;box-shadow:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.currency-picker-badge{display:grid;grid-template-columns:12px 23px 5px;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;width:100%;height:24px;border:1px solid #c9ffed;border-radius:6px;background:linear-gradient(155deg,#759ca3,#3e687d 38%,#214159 40%,#31566a);box-shadow:inset 0 1px #ebfff773,0 2px #162d45,0 3px #9acbca66}
.currency-picker-toggle:hover:not(:disabled) .currency-picker-badge,.currency-picker-toggle[aria-expanded=true] .currency-picker-badge{border-color:#fff0ce;background:linear-gradient(155deg,#a2d1c8,#628f99 38%,#365d76 40%,#4c7985)}
.currency-picker-toggle[aria-expanded=true] .currency-picker-badge{box-shadow:inset 0 1px #f6ffe982,0 2px #25324e,0 0 0 2px #f6a99252}
.currency-picker-toggle:disabled{opacity:.6;cursor:default}
.currency-picker-symbol{font:800 14px/1 Arial,sans-serif;text-align:center;color:#bcf3e5}.currency-picker-code{font:850 10px/1 var(--finish-body,'Trebuchet MS',sans-serif);letter-spacing:0}
.currency-picker-chevron{width:5px;height:5px;border:solid #d4f6e9;border-width:0 1.5px 1.5px 0;transform:rotate(45deg) translateY(-1px)}.currency-picker-toggle[aria-expanded=true] .currency-picker-chevron{transform:rotate(225deg) translate(-1px,-1px)}
.currency-picker-toggle:focus-visible{outline:0}.currency-picker-toggle:focus-visible .currency-picker-badge,.currency-picker-item:focus-visible{outline:3px solid #c4ffed;outline-offset:3px}
.currency-picker-menu{position:fixed;z-index:1000;box-sizing:border-box;width:min(272px,calc(100vw - 20px));max-height:min(340px,calc(100svh - 20px));display:grid;gap:3px;padding:9px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;border:1px solid #b7e3dca3;border-radius:14px;background:radial-gradient(ellipse at 0 0,#368a8466,transparent 68%),linear-gradient(145deg,#183749,#22283e 72%,#413047);color:#fff2dc;box-shadow:inset 0 1px #eeffea33,0 0 0 3px #081e2d55,0 18px 46px #07121fc9;scrollbar-width:thin;scrollbar-color:#80cdbd #203449}
.currency-picker-menu[hidden]{display:none!important}
.currency-picker-item{display:grid;grid-template-columns:26px minmax(0,1fr) 32px 15px;align-items:center;column-gap:8px;width:100%;min-width:0;min-height:52px;margin:0;padding:8px;border:1px solid transparent;border-radius:8px;background:transparent;color:#f8eedc;text-align:left;font:650 13px/1.2 var(--finish-body,'Trebuchet MS',sans-serif);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.currency-picker-item:hover:not(:disabled),.currency-picker-item:focus-visible{background:#b1e6da14;border-color:#afdcca5c}.currency-picker-item[aria-checked=true]{background:linear-gradient(105deg,#d4f6df,#9bd9cf);color:#183c4c;border-color:#e5ffe7;box-shadow:inset 0 1px #fffced8c,0 2px #102c4055}
.currency-picker-item-flag{width:26px;font:400 23px/1 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif}.currency-picker-names{display:grid;gap:3px;min-width:0}.currency-picker-name{font-size:13px;font-weight:750;line-height:1.2;overflow-wrap:anywhere}.currency-picker-native{font-size:10px;font-weight:500;line-height:1.2;color:#b8ccce}.currency-picker-item[aria-checked=true] .currency-picker-native{color:#386679}.currency-picker-codes{display:grid;gap:4px;justify-items:center}.currency-picker-item-symbol{font:800 17px/1 Arial,sans-serif;color:#bcf3e5}.currency-picker-item-code{color:#b8ccce;font-size:9px;font-weight:800;letter-spacing:.4px}.currency-picker-item[aria-checked=true] .currency-picker-item-symbol,.currency-picker-item[aria-checked=true] .currency-picker-item-code{color:#386679}.currency-picker-check{visibility:hidden;color:#8d4b55;font-size:15px;font-weight:900;text-align:right}.currency-picker-item[aria-checked=true] .currency-picker-check{visibility:visible}
@media(max-width:700px){.currency-control .currency-picker-toggle{width:56px}.currency-picker-badge{grid-template-columns:10px 20px 4px;gap:3px}.currency-picker-code{font-size:9px}.currency-picker-symbol{font-size:12px}.currency-picker-chevron{width:4px;height:4px}}
@media(forced-colors:active){.currency-picker-badge,.currency-picker-menu,.currency-picker-item[aria-checked=true]{border-color:ButtonText}.currency-picker-item[aria-checked=true]{outline:1px solid Highlight;outline-offset:-3px}.currency-picker-chevron{border-color:ButtonText}}

/* GTA cash finish: denomination-neutral, solid readable glyphs, no idle animation. */
:root{--cash-neutral:#d7e2df;--cash-mint:#beffe5;--cash-gold:#fff0bf;--cash-mint-gloss:0 1px 1px #051e2f,0 -1px #fff2bd30,0 0 9px #65edbb48;--cash-gold-gloss:0 1px 1px #051e2f,0 -1px #ffffeb50,0 0 11px #76efce45}
.top-actions .balance #balance{font-variant-numeric:tabular-nums lining-nums;color:#48635f;text-shadow:0 1px #fff8df60}
.top-actions .balance #balance[data-display-amount]:not([data-display-amount="0"]){color:#103e43;text-shadow:0 1px #fff9dc99,0 0 8px #54c9af38}
#bonus-result :is(#result-amount,#result-returned,#result-net){color:var(--cash-neutral);background:none;-webkit-text-fill-color:currentColor;text-shadow:0 1px #091e32;filter:none;font-variant-numeric:tabular-nums lining-nums}
#bonus-result #result-amount[data-display-amount]:not([data-display-amount="0"]){color:var(--cash-gold);text-shadow:var(--cash-gold-gloss)}
#bonus-result:not([data-outcome=preview]):has(#result-amount[data-display-amount]:not([data-display-amount="0"])) #result-returned{color:var(--cash-mint);text-shadow:var(--cash-mint-gloss)}
#bonus-result[data-outcome=gain] #result-net{color:var(--cash-mint);text-shadow:var(--cash-mint-gloss)}
/* Full numbers remain visible; exceptionally long values can occupy another line. */
#bonus-result #result-amount{max-width:100%;min-width:0;overflow-wrap:anywhere;white-space:normal}
#bonus-result .result-facts :is(#result-returned,#result-net){min-width:0;max-width:100%;overflow-wrap:anywhere;white-space:normal}
@media(max-width:700px){
 #bonus-result[data-large-amount=true] #result-amount{font-size:clamp(20px,6.4vw,34px);line-height:1.15;letter-spacing:-.45px}
 #bonus-result[data-large-amount=true] .result-facts :is(#result-returned,#result-net){font-size:clamp(12px,3.8vw,15px);line-height:1.25}
}
@media(forced-colors:active){.top-actions .balance #balance,#bonus-result :is(#result-amount,#result-returned,#result-net){color:CanvasText!important;text-shadow:none!important;-webkit-text-fill-color:CanvasText}}

#bonus-result:is([data-outcome=loss],[data-outcome=even],[data-outcome=preview]) #result-net{color:var(--cash-neutral);text-shadow:none}
#bonus-result #result-amount:is([data-display-amount="0"],:not([data-display-amount])){color:var(--cash-neutral);text-shadow:0 1px #091e32;animation:none!important}

/* GTA — vivid bonus tickets and one coherent award over the coastal film.
   This last stylesheet only paints/reflows the two existing bonus windows. */

/* A wide price line keeps the currency attached even at large demo stakes. */
#buy-dialog.purchase-dialog {
  width: min(716px, calc(100% - 28px));
  max-width: 716px;
  max-height: calc(100svh - 28px);
  padding: 24px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #fff0c2;
  border-radius: 8px 28px 8px 28px;
  background: radial-gradient(ellipse at 0 0, #04dfa567, transparent 58%), radial-gradient(ellipse at 100% 0, #ff23796b, transparent 59%), linear-gradient(135deg, #095064, #12384f 56%, #642345);
  color: #fff5df;
  box-shadow: inset 0 2px #e7ffe975, 0 0 0 4px #2af8c32b, 0 22px 80px #021529b3;
  scrollbar-width: thin;
  scrollbar-color: #51f0bc #16394f;
}
#buy-dialog::backdrop { background: #041c35a8; backdrop-filter: blur(4px); }
#buy-dialog > .eyebrow { color: #c4ffe5; min-height: 18px; padding-right: 48px; font-size: 8px; font-weight: 850; letter-spacing: 2px; }
#buy-dialog #buy-title { margin: 9px 48px 15px 0; color: #fff5d6; font-size: 36px; line-height: 1.05; letter-spacing: 1px; text-shadow: 0 2px #06536a; overflow-wrap: anywhere; }
#buy-dialog.super-ticket #buy-title { color: #ffe59b; text-shadow: 0 2px #963865; }
#buy-dialog.purchase-dialog .dialog-close { top: 15px; right: 15px; border-color: #ffe9c9; background: linear-gradient(145deg, #ff5e87, #c90d62); color: #fff8e0; box-shadow: inset 0 1px #fff1d480, 0 2px #7a1f51; }
#buy-dialog.purchase-dialog .dialog-close:hover { background: #f52e77; border-color: #fff8da; }
#buy-dialog .bonus-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 12px; }
#buy-dialog .bonus-choices > button {
  min-width: 0;
  padding: 0 0 11px;
  border: 2px solid #55dbc59e;
  border-radius: 6px 18px 6px 18px;
  background: #075e68;
  color: #fff7dc;
  box-shadow: inset 0 1px #c0ffe52e, 0 3px #082c43;
  transition: transform 140ms ease, border-color 140ms ease, background 140ms ease;
}
#buy-dialog .bonus-choices > button[data-bonus-choice=super] { background: #852c5c; border-color: #ff8caf9e; }
#buy-dialog .bonus-choices > button:hover { border-color: #fff6c7; background: #087b76; box-shadow: 0 4px #082c43; transform: translateY(-1px); }
#buy-dialog .bonus-choices > button[data-bonus-choice=super]:hover { background: #a9356c; }
#buy-dialog .bonus-choices > button[aria-pressed=true] { border-color: #d5ffe7; background: linear-gradient(135deg, #99ffd8, #1fe2b1); box-shadow: 0 0 0 2px #1bffd253, 0 4px #06576a; }
#buy-dialog .bonus-choices > button[data-bonus-choice=super][aria-pressed=true] { border-color: #fff2b8; background: linear-gradient(135deg, #fff0b1, #ffbf4f); box-shadow: 0 0 0 2px #ffc85359, 0 4px #a45839; }
#buy-dialog .bonus-choices > button:active { transform: translateY(2px); }
#buy-dialog .bonus-choices > button::after { z-index: 3; top: 8px; right: 8px; width: 22px; height: 22px; border: 1px solid #ffefbf; background: #0a394dd9; box-shadow: 0 2px #05283e5c; }
#buy-dialog .bonus-choices > button[aria-pressed=true]::after { border-color: #fff5d0; background: #ff337d; color: #fff9dc; font-size: 14px; }
#buy-dialog .choice-art {
  position: relative;
  isolation: isolate;
  height: 118px;
  padding: 13px;
  overflow: hidden;
  border-bottom: 1px solid #baffdf87;
  background-image: linear-gradient(90deg, #073b50aa, #008ba033), url('assets/neon-boulevard-v9.webp');
  background-size: cover;
  background-position: center, 70% 58%;
}
#buy-dialog [data-bonus-choice=super] .choice-art { border-bottom-color: #ffe394a3; background-image: linear-gradient(90deg, #762052a6, #fc285a19), url('assets/getaway-result-v9.webp'); background-size: cover; background-position: center, 42% 35%; }
#buy-dialog .choice-art::after { content: ''; position: absolute; z-index: -1; width: 54%; height: 122px; right: 4px; bottom: -15px; background: url('assets/bonus-diamond-v9.14.webp') center / contain no-repeat; filter: drop-shadow(0 4px 2px #06233e70); pointer-events: none; }
#buy-dialog [data-bonus-choice=super] .choice-art::after { right: 3px; bottom: -9px; width: 57%; background-image: url('assets/nitro-v9.14.webp'); }
#buy-dialog .choice-art b { display: block; position: relative; max-width: calc(100% - 26px); color: #e3ffec; font: italic 26px/.96 var(--finish-display, Impact, sans-serif); letter-spacing: .2px; white-space: normal; text-shadow: 0 2px #046875, 0 3px 6px #092437b3; }
#buy-dialog .bonus-choices > button[data-bonus-choice=super] .choice-art b { max-width: calc(100% - 27px); font-size: 23px; color: #fff0ad; text-shadow: 0 2px #943260, 0 3px 6px #432242b3; }
#buy-dialog .choice-art em { left: 13px; bottom: 10px; color: #baffdc; font: italic 57px/.85 var(--finish-display, Impact, sans-serif); text-shadow: 0 3px #067887, 0 5px 5px #082a4673; }
#buy-dialog [data-bonus-choice=super] .choice-art em { color: #ffe995; text-shadow: 0 3px #ad5533, 0 5px 5px #43234573; }
#buy-dialog .bonus-choices strong { min-height: 0; margin: 10px 12px 0; color: #fff8dc; font-size: 12px; line-height: 1.35; font-weight: 900; }
#buy-dialog .bonus-choices small { min-height: 0; margin: 4px 12px 0; color: #d9fff0; font-size: 10px; line-height: 1.4; }
#buy-dialog .bonus-choices [data-bonus-choice=super] small { color: #ffe5d9; }
#buy-dialog .bonus-choices [aria-pressed=true] strong { color: #123f4b; }
#buy-dialog .bonus-choices [aria-pressed=true] small { color: #22564f; }
#buy-dialog .bonus-choices [data-bonus-choice=super][aria-pressed=true] strong { color: #593627; }
#buy-dialog .bonus-choices [data-bonus-choice=super][aria-pressed=true] small { color: #684b29; }
#buy-dialog #buy-mode-rules { margin: 10px 0 12px; color: #d4ffe7; font-size: 11px !important; line-height: 1.45; }
#buy-dialog .purchase-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 12px 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #fff0c5;
  border-radius: 5px 15px 5px 15px;
  background: linear-gradient(135deg, #fff9e2, #ffe9ba);
  box-shadow: inset 0 1px #fffde8, 0 3px #7652496b;
}
#buy-dialog .purchase-facts > div { min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 5px; padding: 10px 15px; border: 0; color: #51605e; font-size: 10px; line-height: 1.3; }
#buy-dialog .purchase-facts > div:first-child { border-right: 1px solid #b69b6d55; }
#buy-dialog .purchase-facts > div:nth-child(2) { grid-column: 1 / -1; grid-row: 1; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 16px; padding: 12px 15px; border-bottom: 1px solid #c199504f; background: linear-gradient(110deg, #fff0bc, #ffd16a); color: #674629; font-weight: 850; }
#buy-dialog .purchase-facts b { display: block; min-width: 0; max-width: 100%; color: #153e4b; font-family: Arial, sans-serif; font-size: 20px; font-weight: 800; line-height: 1.2; letter-spacing: -.35px; font-variant-numeric: tabular-nums; white-space: nowrap; word-break: normal; }
#buy-dialog .purchase-facts div:nth-child(2) b { color: #753d2b; font-size: 29px; letter-spacing: -.6px; }
#buy-dialog .purchase-facts #buy-after { font-size: 20px; }
#buy-dialog .purchase-note { margin: 12px 0; color: #f7ead7; font-size: 10px !important; line-height: 1.55; text-align: left; }
#buy-dialog #confirm-buy { display: block; width: 100%; min-height: 52px; margin: 13px 0 10px; padding: 13px 16px; border: 1px solid #fff0c1; border-radius: 5px 16px 5px 16px; background: linear-gradient(150deg, #ff9164, #fc2c72 41%, #da0b66 47%, #f42982); color: #fff8df; box-shadow: inset 0 2px #ffead29e, inset 0 -2px #9c175166, 0 4px #89194e; font-size: 13px; line-height: 1.35; font-weight: 950; letter-spacing: .6px; text-shadow: 0 1px #8d2353; text-wrap: balance; }
#buy-dialog #confirm-buy:hover:not(:disabled) { background: linear-gradient(150deg, #ffa972, #ff4080 41%, #e51372 47%, #ff388b); box-shadow: inset 0 2px #fff0dbaa, 0 4px #89194e; transform: translateY(-1px); }
#buy-dialog #confirm-buy:active:not(:disabled) { transform: translateY(2px); box-shadow: inset 0 2px 4px #75174066, 0 1px #89194e; }
#buy-dialog #confirm-buy:disabled { background: #8b596d; color: #fff1db; border-color: #dab2a9; text-shadow: none; box-shadow: none; opacity: .7; filter: none; }
#buy-dialog #buy-topup { background: linear-gradient(135deg, #a9ffe0, #37e2bd); color: #144956; border-color: #e4ffe7; box-shadow: inset 0 1px #fffce0, 0 2px #14737b; }
#buy-dialog #buy-topup:hover:not(:disabled) { background: #afffe0; border-color: #fffbd8; }
#buy-dialog #buy-topup[hidden] { display: none; }
#buy-dialog .cancel-buy { display: block; width: 100%; min-height: 44px; margin: 8px 0 0; padding: 10px 13px; border-color: #b2ffe3a1; border-radius: 5px; background: #075d6659; color: #edffea; font-size: 10px; line-height: 1.4; }
#buy-dialog .cancel-buy:hover { background: #0b7c7e; border-color: #e4ffe6; }
#buy-dialog #preview-bonus { display: block; width: 100%; min-height: 44px; margin: 5px 0 0; padding: 10px 8px; color: #ffe0aa; font-size: 10px; line-height: 1.45; text-decoration-color: #ffd48180; }
#buy-dialog #preview-bonus:hover { color: #fff7ce; }
#buy-dialog #buy-error { color: #ffdecb !important; }
#buy-dialog :is(button, select):focus-visible { outline: 3px solid #fff4a3; outline-offset: 4px; }

/* The film stays visible; only the actual award gets a solid, readable face. */
#getaway-cinematic {
  display: grid;
  place-items: center;
  padding: 69px 30px 84px;
  overflow: hidden;
  box-sizing: border-box;
  background: #083549;
  color: #fff4d7;
}
#getaway-cinematic[hidden] { display: none; }
#getaway-cinematic::before { inset: 0; background: url('assets/neon-boulevard-v9.webp') center / cover; opacity: 1; animation: none; }
#getaway-cinematic:has(.getaway-video.playing)::before { opacity: 0; }
#getaway-cinematic::after { background: radial-gradient(ellipse at 50% 38%, #062b4852, transparent 67%), linear-gradient(180deg, #0624415c, transparent 24%, transparent 70%, #061b39b5); }
#getaway-cinematic .getaway-video { object-position: center; filter: none; opacity: 1; }
#getaway-cinematic .cinematic-sweep,
#getaway-cinematic .cinematic-police { display: none; }
#getaway-cinematic .cinematic-copy {
  position: relative;
  isolation: isolate;
  align-self: center;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
  width: min(590px, 100%);
  max-width: 100%;
  max-height: calc(100svh - 153px);
  margin: 0;
  padding: 9px 8px 10px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  animation: cinematic-award-in 360ms cubic-bezier(.18,.8,.25,1) both;
  scrollbar-width: thin;
  scrollbar-color: #72efc2 #15374a;
  text-align: center;
}
#getaway-cinematic .cinematic-copy::before,
#getaway-cinematic .cinematic-copy::after { content: none; display: none; }
#getaway-cinematic .cinematic-copy > * { position: relative; min-width: 0; max-width: 100%; }
#getaway-cinematic .episode-tag { grid-row: 1; display: block; justify-self: center; width: fit-content; margin: 0; padding: 5px 11px; border: 1px solid #a0ffdf7d; border-radius: 4px; background: #083c51db; color: #adffe0; font: 850 8px/1.4 var(--finish-body, 'Trebuchet MS', sans-serif); letter-spacing: 1.8px; }
#getaway-cinematic #getaway-title { grid-row: 2; margin: 2px 0 0; color: #59ffce; font: italic clamp(42px, 5vw, 66px)/1.05 var(--finish-display, Impact, sans-serif); letter-spacing: .8px; text-shadow: 0 3px #07556c, 0 5px 14px #08203ed9; filter: none; transform: none; overflow-wrap: anywhere; }
#getaway-cinematic #getaway-title > span { display: inline; color: #ff6a99; font-size: inherit; text-shadow: 0 3px #9f2057, 0 5px 14px #08203ed9; }
.super-active #getaway-cinematic #getaway-title { font-size: clamp(36px, 4.4vw, 58px); color: #ffe391; }
.super-active #getaway-cinematic #getaway-title > span { margin-left: .18em; font-size: inherit; color: #ff7199; }
#getaway-cinematic .cinematic-copy p { grid-row: 3; display: block; margin: 0 0 6px; color: #fff2d2; font: 700 12px/1.4 var(--finish-body, 'Trebuchet MS', sans-serif); letter-spacing: .2px; text-shadow: 0 1px 3px #042643, 0 2px 8px #041c34; }
#getaway-cinematic #cinematic-caption {
  grid-row: 4;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 170px;
  margin: 0;
  padding: 22px 24px 22px 205px;
  box-sizing: border-box;
  border: 2px solid #ffedaf;
  border-radius: 7px 28px 7px 28px;
  background: radial-gradient(ellipse at 0 10%, #ffffff8c, transparent 53%), linear-gradient(120deg, #92ffda, #3becbe 56%, #a8ffda);
  color: #123f4e;
  box-shadow: inset 0 2px #fff8d6b3, inset 0 -3px #087e842b, 0 5px #075467, 0 8px #ffe2ab6e, 0 16px 32px #04224080;
  font: 900 22px/1.38 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: .3px;
  text-align: left;
  text-wrap: balance;
  overflow-wrap: anywhere;
  text-shadow: 0 1px #e6ffe575;
}
#getaway-cinematic #cinematic-caption::before { content: ''; position: absolute; left: 2px; top: -17px; width: 184px; height: 190px; background: url('assets/bonus-diamond-v9.14.webp') center / contain no-repeat; filter: drop-shadow(0 5px 3px #07597442); pointer-events: none; }
#getaway-cinematic #cinematic-caption::after { content: ''; position: absolute; left: 109px; bottom: 0; width: 88px; height: 87px; background: url('assets/nitro-v9.14.webp') center / contain no-repeat; filter: drop-shadow(0 3px 2px #0759744d); transform: rotate(6deg); pointer-events: none; }
.super-active #getaway-cinematic #cinematic-caption { background: radial-gradient(ellipse at 0 10%, #fffde3c2, transparent 53%), linear-gradient(120deg, #ffe590, #ffc055 58%, #ffe5a6); border-color: #fff0b0; color: #603c2a; box-shadow: inset 0 2px #fff8d6b3, inset 0 -3px #ad67322e, 0 5px #94513d, 0 8px #ff86b466, 0 16px 32px #04224080; text-shadow: 0 1px #fff5c775; }
#getaway-cinematic #start-getaway {
  grid-row: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 20px;
  width: min(360px, 94%);
  min-width: 0;
  min-height: 52px;
  margin: 12px 0 0;
  padding: 12px 17px;
  border: 1px solid #fff0bd;
  border-radius: 5px 16px 5px 16px;
  background: linear-gradient(150deg, #ff9c65, #ff3376 37%, #d50d66 44%, #f32680);
  color: #fff8df;
  box-shadow: inset 0 2px #fff1ceb0, inset 0 -2px #8d15476b, 0 4px #851b4c, 0 6px #ffc4ba61;
  font: 950 13px/1.35 var(--finish-body, 'Trebuchet MS', sans-serif);
  letter-spacing: .7px;
  text-shadow: 0 1px #8b1b49;
  transform: none;
  transition: transform 140ms ease, box-shadow 140ms ease;
}
#getaway-cinematic #start-getaway:hover { background: linear-gradient(150deg, #ffb270, #ff4784 37%, #e21a71 44%, #ff3789); transform: translateY(-1px); filter: none; }
#getaway-cinematic #start-getaway:active { transform: translateY(2px); box-shadow: inset 0 2px #77123e55, 0 1px #851b4c; }
#getaway-cinematic #start-getaway > span { flex: 0 0 auto; font-size: 24px; margin: 0; color: #fff2be; }
#getaway-cinematic .cinematic-copy small { grid-row: 6; display: block; justify-self: center; width: fit-content; max-width: 100%; margin: 5px 0 0; padding: 5px 9px; border-radius: 4px; background: #08354dcb; color: #edfff0; font: 650 9px/1.5 var(--finish-body, 'Trebuchet MS', sans-serif); }
#getaway-cinematic .cinematic-chapter { top: max(16px, env(safe-area-inset-top)); right: max(30px, env(safe-area-inset-right)); gap: 10px; padding: 7px 11px; border: 1px solid #9effdca3; border-radius: 4px 12px 4px 12px; background: #073e52db; box-shadow: inset 0 1px #e6ffec4d; backdrop-filter: none; }
#getaway-cinematic .cinematic-chapter-number { font-size: 25px; color: #62ffd0; }
#getaway-cinematic .cinematic-chapter-copy { max-width: 170px; color: #fff3cf; font-size: 8px; letter-spacing: .9px; }
#getaway-cinematic .cinematic-timeline { left: 30px; right: auto; bottom: max(23px, env(safe-area-inset-bottom)); width: min(420px, 48vw); gap: 14px; }
#getaway-cinematic .cinematic-beat { color: #e6fff0; border-top-color: #a2f6d780; font-size: 8px; font-weight: 850; padding-top: 9px; text-shadow: 0 1px 3px #052843; }
#getaway-cinematic .cinematic-beat::before { background: #40ffbf; }
#getaway-cinematic .cinematic-beat[data-active=true] { border-top-color: #ffd46c; color: #fff0b4; }
#getaway-cinematic .cinematic-beat[data-complete=true] { color: #82ffcf; border-top-color: #38e9b9c4; }
#getaway-cinematic #skip-getaway { right: 30px; bottom: max(20px, env(safe-area-inset-bottom)); min-height: 44px; padding: 10px 14px; border: 1px solid #cbffe79e; border-radius: 5px; background: #0a4659e8; color: #fff4d5; font-size: 10px; font-weight: 850; letter-spacing: .6px; backdrop-filter: none; }
#getaway-cinematic #skip-getaway:hover { background: #0f7680; border-color: #f2ffdc; }
#getaway-cinematic :is(#start-getaway,#skip-getaway):focus-visible { outline: 3px solid #fff4a1; outline-offset: 5px; }
@keyframes cinematic-award-in { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }

@media (max-width: 700px) {
  #buy-dialog.purchase-dialog { width: calc(100% - 20px); max-height: calc(100svh - 20px); padding: 19px 15px 13px; border-radius: 6px 22px 6px 22px; }
  #buy-dialog > .eyebrow { font-size: 7px; letter-spacing: 1.2px; }
  #buy-dialog #buy-title { margin-top: 8px; margin-bottom: 13px; font-size: 30px; }
  #buy-dialog.purchase-dialog .dialog-close { top: 10px; right: 10px; }
  #buy-dialog .bonus-choices { gap: 9px; }
  #buy-dialog .choice-art { height: 105px; padding: 11px 9px; }
  #buy-dialog .choice-art b { font-size: 21px; }
  #buy-dialog .bonus-choices > button[data-bonus-choice=super] .choice-art b { font-size: 17px; }
  #buy-dialog .choice-art em { left: 9px; bottom: 9px; font-size: 49px; }
  #buy-dialog .choice-art::after { right: -5px; bottom: -13px; width: 62%; height: 99px; }
  #buy-dialog [data-bonus-choice=super] .choice-art::after { right: -4px; bottom: -9px; width: 62%; }
  #buy-dialog .bonus-choices > button::after { width: 19px; height: 19px; top: 6px; right: 6px; }
  #buy-dialog .bonus-choices strong { margin: 9px 9px 0; font-size: 10px; line-height: 1.4; }
  #buy-dialog .bonus-choices small { margin: 4px 9px 0; font-size: 9px; line-height: 1.4; }
  #buy-dialog #buy-mode-rules { font-size: 10px !important; }
  #buy-dialog .purchase-facts { grid-template-columns: minmax(0, 1fr); }
  #buy-dialog .purchase-facts > div { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 10px; padding: 9px 12px; font-size: 10px; }
  #buy-dialog .purchase-facts > div:first-child { border: 0; border-bottom: 1px solid #b69b6d44; }
  #buy-dialog .purchase-facts > div:nth-child(2) { padding: 10px 12px; }
  #buy-dialog .purchase-facts b, #buy-dialog .purchase-facts #buy-after { font-size: 17px; text-align: right; }
  #buy-dialog .purchase-facts div:nth-child(2) b { font-size: 26px; }
  #buy-dialog .purchase-note { font-size: 10px !important; line-height: 1.5; }
  #buy-dialog #confirm-buy { min-height: 51px; font-size: 12px; padding-inline: 10px; letter-spacing: .3px; }
  #buy-dialog #preview-bonus { font-size: 9px; }

  #getaway-cinematic { padding: 74px 12px 108px; }
  #getaway-cinematic .cinematic-copy { width: 100%; max-width: 440px; max-height: calc(100svh - 182px); gap: 8px; padding: 7px 5px 9px; }
  #getaway-cinematic .episode-tag { font-size: 7px; letter-spacing: 1.15px; }
  #getaway-cinematic #getaway-title { font-size: clamp(39px, 11.5vw, 59px); }
  .super-active #getaway-cinematic #getaway-title { font-size: clamp(30px, 8.7vw, 44px); letter-spacing: .2px; }
  #getaway-cinematic .cinematic-copy p { margin-bottom: 5px; font-size: 10px; }
  #getaway-cinematic #cinematic-caption { min-height: 142px; padding: 17px 13px 17px 132px; border-radius: 5px 22px 5px 22px; font-size: 16px; line-height: 1.45; letter-spacing: 0; }
  #getaway-cinematic #cinematic-caption::before { left: -7px; top: -2px; width: 132px; height: 143px; }
  #getaway-cinematic #cinematic-caption::after { left: 67px; bottom: 0; width: 64px; height: 65px; }
  #getaway-cinematic #start-getaway { width: 94%; min-height: 49px; margin-top: 11px; padding: 11px 14px; font-size: 11px; gap: 14px; }
  #getaway-cinematic .cinematic-copy small { margin-top: 4px; font-size: 8px; }
  #getaway-cinematic .cinematic-chapter { left: 17px; right: 17px; top: max(13px, env(safe-area-inset-top)); justify-content: space-between; padding: 7px 10px; }
  #getaway-cinematic .cinematic-chapter-number { font-size: 23px; }
  #getaway-cinematic .cinematic-chapter-copy { max-width: 175px; font-size: 8px; text-align: right; }
  #getaway-cinematic .cinematic-timeline { left: 20px; right: 20px; bottom: max(16px, env(safe-area-inset-bottom)); width: auto; gap: 12px; }
  #getaway-cinematic .cinematic-beat { font-size: 7px; padding-top: 8px; }
  #getaway-cinematic #skip-getaway { right: 20px; bottom: 52px; min-height: 44px; padding: 9px 12px; font-size: 9px; }
}
@media (max-width: 370px) {
  #buy-dialog.purchase-dialog { padding-inline: 12px; }
  #buy-dialog #buy-title { font-size: 27px; }
  #buy-dialog .bonus-choices { gap: 8px; }
  #buy-dialog .choice-art { height: 101px; padding-inline: 8px; }
  #buy-dialog .choice-art b { font-size: 19px; }
  #buy-dialog .bonus-choices > button[data-bonus-choice=super] .choice-art b { font-size: 16px; }
  #buy-dialog .choice-art::after { right: -7px; width: 59%; }
  #buy-dialog .bonus-choices strong { font-size: 9px; }
  #buy-dialog .bonus-choices small { font-size: 8.5px; }
  #buy-dialog .purchase-facts div:nth-child(2) b { font-size: 24px; }
  #getaway-cinematic { padding-inline: 8px; }
  #getaway-cinematic .cinematic-copy { padding-inline: 4px; }
  #getaway-cinematic #cinematic-caption { padding-left: 111px; padding-right: 10px; font-size: 14px; min-height: 132px; }
  #getaway-cinematic #cinematic-caption::before { left: -7px; top: 0; width: 114px; height: 127px; }
  #getaway-cinematic #cinematic-caption::after { left: 57px; width: 53px; height: 56px; }
}
/* Low landscape viewports keep the real action beside, rather than below, the award. */
@media (max-height: 560px) and (min-width: 501px) {
  #getaway-cinematic { padding: 58px 20px 66px; }
  #getaway-cinematic .cinematic-copy { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; width: min(820px, 100%); max-width: 100%; max-height: calc(100svh - 124px); gap: 5px 18px; padding: 8px; }
  #getaway-cinematic .episode-tag { grid-column: 1; grid-row: 1; font-size: 7px; padding-block: 4px; }
  #getaway-cinematic #getaway-title { grid-column: 1; grid-row: 2; font-size: 43px; margin: 0; }
  .super-active #getaway-cinematic #getaway-title { font-size: 31px; }
  #getaway-cinematic .cinematic-copy p { grid-column: 1; grid-row: 3; font-size: 9px; margin: 0; }
  #getaway-cinematic #cinematic-caption { grid-column: 2; grid-row: 1 / 6; min-height: 158px; padding: 15px 13px 15px 125px; font-size: 17px; }
  #getaway-cinematic #cinematic-caption::before { left: -5px; top: 2px; width: 124px; height: 146px; }
  #getaway-cinematic #cinematic-caption::after { left: 64px; bottom: 3px; width: 61px; height: 64px; }
  #getaway-cinematic #start-getaway { grid-column: 1; grid-row: 4; width: 100%; min-height: 44px; margin-top: 4px; padding: 9px 12px; font-size: 10px; }
  #getaway-cinematic .cinematic-copy small { grid-column: 1; grid-row: 5; margin: 1px 0 0; padding: 3px 5px; font-size: 7px; }
  #getaway-cinematic .cinematic-chapter { left: auto; right: 20px; top: 9px; padding: 5px 10px; }
  #getaway-cinematic .cinematic-chapter-number { font-size: 21px; }
  #getaway-cinematic .cinematic-chapter-copy { max-width: 210px; font-size: 7px; }
  #getaway-cinematic .cinematic-timeline { left: 24px; right: auto; bottom: 14px; width: 45%; }
  #getaway-cinematic #skip-getaway { right: 20px; bottom: 10px; min-height: 44px; font-size: 9px; }
}
.no-motion #getaway-cinematic *,
#getaway-cinematic[data-reduced-motion=true] *,
.no-motion #getaway-cinematic::before,
.no-motion #buy-dialog * { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  #getaway-cinematic *, #getaway-cinematic::before, #buy-dialog * { animation: none !important; transition: none !important; }
}

/* Short iframe / popout: reclaim decoration before changing the real 6×5 board.
   Explicit sizing, not overflow clipping, keeps the whole cabinet in view. */
body.frame-compact { margin:0; min-height:0; height:var(--frame-height,100dvh); }
body.frame-compact .game { box-sizing:border-box; width:100%; max-width:100%; height:var(--frame-height,100dvh); min-height:0!important; margin:0; padding:6px 8px; gap:6px; }
body.frame-compact :is(.city-sign,.radio-sticker,.episode,.feature-strip,.fineprint,.receipt-line,.getaway-poster,.rail-heading,.bonus-sign,.combo-panel,.marquee,.cabinet-foot) { display:none!important; }
body.frame-compact .topbar { min-height:44px; height:44px; flex:0 0 44px; display:flex; justify-content:space-between; gap:4px; }
body.frame-compact .brand { width:48px; min-width:48px; }
body.frame-compact .brand :is(small,span) { display:none; }
body.frame-compact .brand strong { font-size:25px; }
body.frame-compact .top-actions { gap:3px; min-width:0; }
body.frame-compact .top-actions .icon-button { width:32px; height:44px; min-width:32px; min-height:44px; flex-basis:32px; }
body.frame-compact .top-actions #audio-settings { display:grid; }
body.frame-compact .top-actions .balance { width:112px; height:44px; box-sizing:border-box; padding:3px!important; gap:3px; }
body.frame-compact .top-actions .balance strong { font-size:13px; letter-spacing:-.5px; }
body.frame-compact .top-actions .balance small { font-size:5px; gap:2px; }
body.frame-compact .top-actions .wallet-add { width:28px; min-width:28px; flex-basis:28px; height:38px; min-height:38px; }
body.frame-compact .language-control { display:none; }
body.frame-compact .arena { display:flex; width:100%; max-width:none; flex:1 1 0; min-height:0; gap:0; justify-content:center; align-items:center; margin:0; position:relative; }
body.frame-compact .cabinet { flex:none; width:min(100%,calc((var(--frame-height,100dvh) - 184px)*1.2)); height:100%; max-height:calc((var(--frame-width,100vw) - 16px)/1.2); min-height:0!important; aspect-ratio:auto; padding:0; margin:0; }
body.frame-compact .board-shell { width:100%; height:100%; box-sizing:border-box; min-height:0; border-width:3px; border-radius:10px; }
body.frame-compact .board { inset:3px; }
body.frame-compact .feature-rail { display:contents; }
body.frame-compact :is(.sun-meter,.round-total) { display:none!important; }
body.frame-compact .controls { box-sizing:border-box; height:110px; min-height:110px; max-width:none; width:100%; flex:0 0 110px; margin:0; padding:5px 6px; gap:5px 8px; grid-template-columns:minmax(0,1fr) 96px; grid-template-rows:44px 44px; align-content:center; }
body.frame-compact .controls .stake { display:grid; grid-template-columns:36px minmax(0,1fr) 36px; grid-template-rows:44px; height:44px; gap:3px; }
body.frame-compact .controls :is(.stake-top,.stake-input) { display:contents; }
body.frame-compact .controls .stake-top label { display:none; }
body.frame-compact .controls #speed { display:none; }
body.frame-compact .controls :is(#minus,#bet,#plus) { grid-row:1; height:44px; min-height:44px; min-width:0; width:100%; padding:0 3px; font-size:18px; }
body.frame-compact .controls #minus { grid-column:1; }
body.frame-compact .controls #bet { grid-column:2; }
body.frame-compact .controls #plus { grid-column:3; }
body.frame-compact .controls #spin { grid-column:2; grid-row:1; position:relative; margin:0; padding:0; width:96px; min-width:0; height:44px; min-height:44px; transform:none; }
body.frame-compact .spin-wheel { display:none; }
body.frame-compact .spin-copy { min-height:40px; box-sizing:border-box; padding:2px; }
body.frame-compact #spin-label { font-size:12px; }
body.frame-compact #spin-hint { font-size:6px; }
body.frame-compact .controls .secondary { display:contents; }
body.frame-compact .controls .round-tools { grid-column:1; grid-row:2; display:flex; flex-direction:row!important; width:100%; gap:3px; height:44px; }
body.frame-compact .controls .bonus-tools:not([hidden]){display:contents!important}
/* Taller phone popouts have a spare shelf between the fixed-size field and footer. */
body.frame-compact.frame-wheel #bonus-preview{bottom:118px;left:8px;right:8px;width:calc(var(--frame-width,100vw) - 16px);font-size:14px;padding-left:48px!important}
body.frame-compact.frame-wheel #bonus-preview>svg{display:block!important;position:absolute;left:8px;top:2px;width:40px;height:40px;transform:none;margin:0}
body.frame-compact.frame-wheel #bonus-preview small{font-size:10px}
body.frame-compact.frame-wheel .controls #spin.spin{grid-row:1 / span 2;--wheel-size:72px;--hub-size:39px;height:92px;min-height:92px;padding:0}
body.frame-compact.frame-wheel .controls #spin.spin .spin-wheel{display:grid!important}
body.frame-compact.frame-wheel .controls #spin.spin .spin-copy{min-height:28px;padding:1px 2px}
body.frame-compact .controls .round-tools button { flex:1 1 0; width:0; min-width:0; height:44px; min-height:44px!important; padding:2px!important; font-size:7px!important; }
body.frame-compact #bonus-preview { position:absolute!important; bottom:17px; right:15px; box-sizing:border-box; width:96px; height:44px; min-height:44px; margin:0; padding:3px!important; font-size:9px; gap:2px; }
body.frame-compact #bonus-preview > svg { display:none; }
body.frame-compact #bonus-preview small { font-size:7px; }
body.frame-compact .pursuit-hud { top:0!important; height:18px!important; min-height:18px!important; font-size:7px; background:#103344dd; }
body.frame-compact dialog { max-height:calc(var(--frame-height,100dvh) - 16px); box-sizing:border-box; overflow:auto; }
body.frame-compact .natural-bonus { padding:4px; }
body.frame-compact .natural-bonus-panel { padding:5px 10px; max-width:90%; }
body.frame-compact .natural-bonus-top { display:none; }
body.frame-compact .natural-bonus h2 { font-size:18px; margin:0; }
body.frame-compact .natural-bonus-award { margin:2px 0; gap:6px; }
body.frame-compact .natural-bonus-award strong { font-size:36px; }
body.frame-compact .natural-bonus-award span { font-size:9px; }
body.frame-compact .natural-bonus .primary-action { min-height:38px; font-size:10px; margin:3px 0; }
body.frame-compact .natural-bonus p { display:none; }
body.frame-compact .board-message[data-kind=win] { padding:5px 9px; }
body.frame-compact .board-message[data-kind=win] .result-medallion { display:none; }
body.frame-compact .board-message[data-kind=win] strong { font-size:clamp(24px,13cqi,40px); }
body.frame-compact .board-message[data-kind=win] .win-continue { margin-top:4px; min-height:36px; padding:4px 10px; }
@media(prefers-reduced-motion:reduce) { body.frame-compact .game { animation:none; } }
/* Live round values remain visible above the field even in a 320px popout. */
body.frame-compact .arena { padding-top:20px; box-sizing:border-box; }
body.frame-compact .cabinet { width:min(100%,calc((var(--frame-height,100dvh) - 204px)*1.2)); }
body.frame-compact .sun-meter { display:block!important; position:absolute; inset:0 auto auto 8px; width:auto; height:18px; margin:0; padding:0; }
body.frame-compact .sun-meter :is(svg,.turbo-ring,small) { display:none; }
body.frame-compact .sun-meter > strong { position:static; display:block; font-size:14px; line-height:18px; }
body.frame-compact .round-total { display:flex!important; position:absolute; inset:0 8px auto auto; height:18px; padding:0; margin:0; flex-direction:row; gap:5px; align-items:center; border:0; background:none; box-shadow:none; }
body.frame-compact .round-total > small { font-size:6px; }
body.frame-compact .round-total > #round-total { font-size:13px; line-height:18px; }
body.frame-compact .round-total > #net { font-size:6px; }
body.frame-compact .round-total #live-win { position:fixed; bottom:132px; right:12px; z-index:10; width:130px; }
/* Reserve the same footer slot regardless of console-layout's button parent. */
body.frame-compact .radio-line { display:none!important; }
body.frame-compact #bonus-preview { position:fixed!important; bottom:17px; right:15px; z-index:12; }
body.frame-compact .brand { width:28px; min-width:28px; }
body.frame-compact .top-actions .icon-button { width:44px; min-width:44px; flex-basis:44px; }
body.frame-compact .top-actions .wallet-add { width:44px; min-width:44px; flex-basis:44px; height:44px; min-height:44px; }
body.frame-compact .top-actions .balance { width:120px; }
body.frame-compact .controls .stake { grid-template-columns:44px minmax(0,1fr) 44px; }
body.frame-compact .controls #spin.spin { width:96px; max-width:96px; height:44px; min-height:44px; padding:0; }
body.frame-compact .controls #spin.spin .spin-wheel { display:none!important; }
body.frame-compact .controls #spin.spin #spin-label { font-size:12px; letter-spacing:0; }
body.frame-compact .controls #spin.spin #spin-hint { font-size:6px; letter-spacing:0; }

body.social-mode :is(.currency-control,.language-control){display:none!important}
#session-time{position:absolute;right:7px;bottom:3px;font:700 7px/1 monospace;letter-spacing:.3px;color:#345966}
/* Only decorative layers caused viewport overflow; gameplay overlays remain. */
body.frame-compact :is(.scene-transition,.searchlight,.driveby) { display:none!important; }
body.frame-compact .top-actions :is(#sound,#info,#audio-settings) { display:grid!important; width:44px!important; height:44px!important; min-width:44px; min-height:44px; }
body.frame-compact .sun-meter { height:18px!important; min-height:0!important; max-height:18px; border:0!important; background:none!important; box-shadow:none!important; }
body.frame-compact .round-total { height:18px!important; min-height:0!important; max-height:18px; border:0!important; background:none!important; box-shadow:none!important; }
body.frame-compact .sun-meter > svg { display:none!important; }
body.frame-compact .controls .round-tools :is(#autoplay,#replay,#history,#bonus-auto,#bonus-finish):not([hidden]) { flex:1 1 44px!important; min-width:44px!important; width:auto!important; }
body.frame-compact .cabinet { max-height:calc((var(--frame-width,100vw) - 16px)/1.11); }
@media(min-width:701px) {
  body.frame-compact .controls { height:56px; min-height:56px; flex-basis:56px; grid-template-columns:210px 112px minmax(150px,1fr) 96px; grid-template-rows:44px; gap:8px; }
  body.frame-compact .controls .stake { grid-column:1; grid-row:1; }
  body.frame-compact .controls #spin.spin { grid-column:2; width:112px; max-width:112px; }
  body.frame-compact .controls .round-tools { grid-column:3; grid-row:1; }
  body.frame-compact #bonus-preview { bottom:12px; }
  body.frame-compact .cabinet { width:min(100%,calc((var(--frame-height,100dvh) - 144px)*2)); height:100%; max-height:none; }
}
/* Defeat wordmark / wallet minimums that otherwise expand mobile layout viewport. */
body.frame-compact .game .topbar { width:100%; min-width:0; max-width:100%; box-sizing:border-box; }
body.frame-compact .game .topbar .brand.brand-gta { --wordmark-size:22px; width:44px!important; min-width:44px!important; max-width:44px; flex:0 0 44px; white-space:nowrap; }
body.frame-compact .game .topbar .brand.brand-gta > span { display:inline; font-size:22px; letter-spacing:0; }
body.frame-compact .game .topbar .brand.brand-gta > strong { font-size:22px; letter-spacing:0; }
body.frame-compact .game .topbar .brand.brand-gta > small { display:none; }
body.frame-compact .game .top-actions { min-width:0!important; max-width:calc(100% - 48px); width:auto; flex:0 1 auto; gap:3px; }
body.frame-compact .game .top-actions .balance { box-sizing:border-box; width:108px!important; min-width:0!important; max-width:108px!important; flex:0 0 108px; padding:2px!important; gap:2px; }
body.frame-compact .game .top-actions .balance > div { min-width:0!important; flex:1 1 0; }
body.frame-compact .game .top-actions .balance #balance { font-size:11px; letter-spacing:-.6px; }
body.frame-compact .game .top-actions .balance small > span { display:none; }
body.frame-compact .game .top-actions .balance .currency-picker-toggle { width:54px; min-width:0; margin:0; padding:0; }
body.frame-compact .game .top-actions .balance .wallet-add { flex:0 0 44px; width:44px; min-width:44px; padding:0; }

/* Phone action hierarchy: one broad, legible SPIN target, with the selected
   crystal ring joined to its warm nameplate. No extra row or board resizing. */
@media(max-width:700px) {
  body:not(.frame-compact) .controls #spin.spin {
    --wheel-size:86px; --hub-size:47px;
    width:min(100%,220px); max-width:220px; height:92px; min-height:92px;
    padding:0 3px 1px;
  }
  body:not(.frame-compact) .controls #spin.spin .spin-wheel { top:-7px; }
  body:not(.frame-compact) .controls #spin.spin .spin-hub > svg { width:29px; height:34px; }
  body .controls #spin.spin .spin-copy {
    box-sizing:border-box; min-height:36px;
    border:1px solid #fff9dc;
    border-radius:12px 12px 18px 18px;
    background:linear-gradient(112deg,#6af5d6 0 6%,transparent 6% 94%,#ff659e 94%),linear-gradient(170deg,#fffbd8,#ffe07d 65%,#ffba5e);
    box-shadow:inset 0 2px #fffdeb,inset 0 -2px #eea84c80,0 3px #b45563,0 5px #0b253c;
    padding:2px 12px 3px;
  }
  body .controls #spin.spin #spin-label {
    color:#113d50; font-size:24px; letter-spacing:.75px;
    text-shadow:0 1px #fff7d2,1px 2px #ee8765;
  }
  body .controls #spin.spin #spin-hint { color:#3c5154; font-size:7px; font-weight:900; letter-spacing:.2px; }
  body .controls #spin.spin .spin-copy::before,
  body .controls #spin.spin .spin-copy::after { content:none; }
  body .controls #spin.spin:disabled:not(.busy):not([aria-busy=true]) .spin-copy {
    background:linear-gradient(160deg,#526473,#354956); border-color:#879c9c;
    box-shadow:inset 0 1px #adc4c333,0 3px #172a3e;
  }
  body .controls #spin.spin:disabled:not(.busy):not([aria-busy=true]) #spin-label { color:#cbdad4; text-shadow:none; }
  body .controls #spin.spin:disabled:not(.busy):not([aria-busy=true]) #spin-hint { color:#aabdb9; }
  body:not(.frame-compact) .controls #bonus-preview { padding-left:52px; }
  body:not(.frame-compact) .controls #bonus-preview > svg {
    left:4px; bottom:0; width:44px; height:46px;
    transform:rotate(-5deg); filter:drop-shadow(0 2px 1px #501043);
  }
  body.frame-compact .controls #spin.spin .spin-copy { width:100%; min-height:44px; padding:2px; }
  body.frame-compact .controls #spin.spin #spin-label { font-size:16px; letter-spacing:.25px; }
  body.frame-compact .controls #spin.spin #spin-hint { font-size:6px; }
  body.frame-compact.frame-wheel .controls #spin.spin .spin-copy { min-height:30px; padding:1px; }
  body.frame-compact.frame-wheel .controls #spin.spin #spin-label { font-size:17px; }
  body.frame-compact.frame-wheel #bonus-preview { font-size:11px; }
  body.frame-compact.frame-wheel #bonus-preview > svg { width:44px; height:44px; top:0; left:3px; }

  /* Only while a canvas spin is alive: remove full-screen blend passes and
     park ambient animations. The illustrated city and gameplay stay visible. */
  body:is(.reels-active,.engine-frame:has(.board.evaluating,.board.bonus-triggering,.round-total.live-meter-active)) :is(.police-reflections,.searchlight,.floating-dust,.ocean-shimmer,.driveby) { visibility:hidden; }
  body:is(.reels-active,.engine-frame:has(.board.evaluating,.board.bonus-triggering,.round-total.live-meter-active)) :is(.police-reflections,.searchlight,.floating-dust,.ocean-shimmer,.driveby,.city-beacons,.equalizer) *,
  body:is(.reels-active,.engine-frame:has(.board.evaluating,.board.bonus-triggering,.round-total.live-meter-active)) :is(.police-reflections,.searchlight,.floating-dust,.ocean-shimmer,.driveby,.city-beacons,.equalizer) { animation-play-state:paused!important; }
  body.reels-active .board-shell:has(.reel-running) { box-shadow:0 0 0 1px #d5fff3,0 4px 12px #0b263c66; }
  body.reels-active .drum-canvas { isolation:isolate; }
}
@media(max-width:370px) {
  body:not(.frame-compact) .controls #spin.spin { --wheel-size:78px; --hub-size:43px; }
  body:not(.frame-compact) .controls #spin.spin #spin-label { font-size:21px; letter-spacing:.35px; }
}
/* Portrait hierarchy stays invariant: BUY is the third row below SPIN.
   Reuse the former 110px footer + 46px bonus shelf budget inside one console. */
@media(max-width:700px){
  body.frame-compact.frame-wheel .controls { height:156px; min-height:156px; flex-basis:156px; grid-template-rows:44px 44px 44px; row-gap:4px; padding:5px 6px; }
  body.frame-compact.frame-wheel .controls .stake { grid-column:1; grid-row:1; }
  body.frame-compact.frame-wheel .controls .round-tools { grid-column:1; grid-row:2; }
  body.frame-compact.frame-wheel .controls #spin.spin { grid-column:2; grid-row:1 / span 2; height:92px; min-height:92px; }
  body.frame-compact.frame-wheel .controls #bonus-preview { position:relative!important; grid-column:1 / -1; grid-row:3; left:auto; right:auto; bottom:auto; width:100%; height:44px; min-height:44px; align-self:stretch; padding-left:48px!important; }
  body.frame-compact.frame-wheel .controls #bonus-preview > svg { display:block!important; left:3px; top:0; width:44px; height:44px; }
}
/* v25 wallet/bet stack uses the same 92px slot beside the ring. */
body.frame-compact .controls .stake>.balance{grid-column:1 / -1;grid-row:1;width:100%;min-width:0;height:44px;padding:1px 3px}
body.frame-compact .controls .balance #balance{font-size:13px}
body.frame-compact.frame-wheel .controls .stake{grid-column:1;grid-row:1 / span 2;grid-template-columns:1fr;grid-template-rows:44px 44px;height:92px;gap:4px}
body.frame-compact.frame-wheel .controls .stake-input{display:grid;grid-column:1;grid-row:2;grid-template-columns:44px minmax(0,1fr)44px;gap:3px}
body.frame-compact.frame-wheel .controls :is(#minus,#bet,#plus){grid-row:1}
body.frame-compact.frame-wheel .controls .round-tools{grid-column:1 / -1;grid-row:3;width:calc(100% - 116px);z-index:2}
body.frame-compact.frame-wheel .controls #bonus-preview{grid-column:1 / -1;grid-row:3;justify-self:end;width:108px;padding-left:3px!important}
body.frame-compact.frame-wheel .controls #bonus-preview>svg{display:none!important}
body.frame-compact:not(.frame-wheel) .controls .stake{grid-template-columns:1fr;grid-template-rows:44px 44px;grid-row:1 / span 2;height:92px;gap:4px}
body.frame-compact:not(.frame-wheel) .controls .stake-input{display:grid;grid-column:1;grid-row:2;grid-template-columns:44px minmax(0,1fr)44px;gap:3px}
body.frame-compact:not(.frame-wheel) .controls .round-tools{grid-column:2;grid-row:2}
body.frame-compact:not(.frame-wheel) .controls .round-tools button{min-width:28px!important;font-size:5px!important}
body.frame-compact .language-control{display:inline-flex!important}
body.frame-compact .top-actions{max-width:calc(100% - 48px)}
body.frame-compact .game .top-actions .language-picker-toggle{width:44px;min-width:44px;padding:0}
@media(max-width:700px){
 body.frame-compact.frame-landscape .controls{height:100px;min-height:100px;flex-basis:100px;grid-template-columns:minmax(132px,1fr)76px minmax(132px,1fr);grid-template-rows:44px 44px;gap:4px;padding:4px}
 body.frame-compact.frame-landscape .controls .stake{grid-column:1;grid-row:1 / span 2;height:92px}
 body.frame-compact.frame-landscape .controls #spin.spin{grid-column:2;grid-row:1;width:76px;max-width:76px;height:44px;min-height:44px}
 body.frame-compact.frame-landscape .controls .round-tools{grid-column:3;grid-row:2;width:100%}
 body.frame-compact.frame-landscape .controls .round-tools button{min-width:40px!important}
 body.frame-compact.frame-landscape #bonus-preview{position:relative!important;grid-column:2;grid-row:2;bottom:auto;right:auto;width:76px;padding:2px!important}
 body.frame-compact.frame-landscape .cabinet{width:min(100%,calc((var(--frame-height,100dvh) - 188px)*2));height:100%;max-height:none}
}
@media(min-width:701px){
 body.frame-compact .controls{grid-template-columns:280px 112px minmax(132px,1fr)96px;gap:6px}
 body.frame-compact .controls .stake{display:flex!important;grid-column:1;grid-row:1;height:44px!important;gap:4px}
 body.frame-compact .controls .stake>.balance{width:140px;flex:0 0 140px}
 body.frame-compact .controls .stake-input{display:grid!important;grid-template-columns:44px minmax(0,1fr)44px;flex:1;min-width:0}
 body.frame-compact .controls .round-tools{grid-column:3;grid-row:1;width:100%}
}
@media(max-width:700px){
 body.frame-compact:not(.frame-landscape):not(.frame-wheel) .controls{height:156px;min-height:156px;flex-basis:156px;grid-template-rows:44px 44px 44px;row-gap:4px}
 body.frame-compact:not(.frame-landscape):not(.frame-wheel) .controls .round-tools{grid-column:1;grid-row:3}
 body.frame-compact:not(.frame-landscape):not(.frame-wheel) .controls .round-tools button{min-width:44px!important;font-size:7px!important}
 body.frame-compact:not(.frame-landscape):not(.frame-wheel) #bonus-preview{position:relative!important;grid-column:2;grid-row:3;bottom:auto;right:auto;left:auto;width:96px}
 body.frame-compact:not(.frame-landscape):not(.frame-wheel) .cabinet{width:min(100%,calc((var(--frame-height,100dvh) - 250px)*1.2))}
}
/* Short wide consoles must not create an implicit second grid row. */
@media(min-width:701px){
 body.frame-compact .controls{box-sizing:border-box;height:56px!important;min-height:56px!important;max-height:56px;grid-template-rows:44px;align-items:center;align-content:center}
 body.frame-compact .controls .stake{grid-column:1!important;grid-row:1!important;align-self:center;height:44px!important;min-height:0!important}
 body.frame-compact .controls .stake-input{height:44px;min-height:0;grid-column:auto!important;grid-row:auto!important}
 body.frame-compact .controls .stake>.balance{height:44px;min-height:0;align-self:center}
 body.frame-compact .controls .round-tools{grid-row:1!important;align-self:center}
}
/* Popout S: a real field beside the console, rather than a 25px strip above it. */
body.frame-compact.frame-popout .game{display:grid;grid-template-columns:minmax(140px,1fr)188px;grid-template-rows:44px minmax(0,1fr);gap:6px;padding:6px 8px}
body.frame-compact.frame-popout .topbar{grid-column:1 / -1;grid-row:1;width:100%}
body.frame-compact.frame-popout .arena{grid-column:1;grid-row:2;align-items:stretch;justify-content:center;min-width:0;width:100%;height:100%;padding-top:20px}
body.frame-compact.frame-popout .cabinet{width:100%;height:100%;max-height:none;min-width:0}
body.frame-compact.frame-popout .controls{grid-column:2;grid-row:2;box-sizing:border-box;width:188px;height:100%;min-height:0;max-height:none;flex:none;padding:4px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:28px 32px 44px 32px;gap:3px;align-content:center;align-items:stretch}
body.frame-compact.frame-popout .controls .stake{display:contents!important;height:auto!important}
body.frame-compact.frame-popout .controls .stake>.balance{grid-column:1 / -1;grid-row:1;height:28px;min-height:28px;display:flex;padding:0 3px}
body.frame-compact.frame-popout .controls .balance>div{display:flex;flex-direction:row;align-items:center;gap:3px}
body.frame-compact.frame-popout .controls .balance #balance{font-size:12px}
body.frame-compact.frame-popout .controls .balance .wallet-add{height:28px;min-height:28px;width:28px;min-width:28px;flex-basis:28px;font-size:18px}
body.frame-compact.frame-popout .controls .balance .currency-picker-toggle{height:28px;min-height:28px;width:46px}
body.frame-compact.frame-popout .controls .stake-input{display:grid;grid-column:1 / -1;grid-row:2;grid-template-columns:32px minmax(0,1fr)32px;height:32px}
body.frame-compact.frame-popout .controls :is(#bet,#plus,#minus){height:32px;min-height:32px;font-size:15px}
body.frame-compact.frame-popout .controls #spin.spin{grid-column:1;grid-row:3;box-sizing:border-box;width:100%;max-width:none;height:44px;min-height:44px}
body.frame-compact.frame-popout #bonus-preview{position:relative!important;grid-column:2;grid-row:3;left:auto;right:auto;bottom:auto;width:100%;height:44px;min-height:44px;font-size:8px;padding:2px!important}
body.frame-compact.frame-popout .controls .round-tools{grid-column:1 / -1;grid-row:4;width:100%;height:32px;display:flex;align-items:stretch}
body.frame-compact.frame-popout .controls .round-tools button{height:32px;min-height:32px!important;min-width:44px!important;font-size:7px!important}
/* Wide frame keeps all actions in its one real footer row, including BUY. */
@media(min-width:701px){
 body.frame-compact .game .controls{grid-template-columns:340px 112px minmax(132px,1fr)96px;gap:6px;padding:5px 6px}
 body.frame-compact .game .controls .stake{grid-column:1!important;grid-row:1!important;display:flex!important;width:340px;height:44px!important}
 body.frame-compact .game .controls .stake>.balance{width:190px;flex:0 0 190px;height:44px}
 body.frame-compact .game .controls .stake-input{grid-row:auto!important;grid-column:auto!important;flex:1}
 body.frame-compact .game .controls #spin.spin{grid-column:2;grid-row:1;width:112px;height:44px;min-height:44px}
 body.frame-compact .game .controls .round-tools{grid-column:3!important;grid-row:1!important;width:100%}
 body.frame-compact .game .controls #bonus-preview{position:relative!important;grid-column:4;grid-row:1;left:auto;right:auto;bottom:auto;width:96px;height:44px;min-height:44px}
 body.frame-compact .game .controls .balance #balance{font-size:15px}
}
body.frame-compact:not(.frame-popout) .game .controls .balance>div{flex-direction:row!important;align-items:center!important;gap:3px}
body.frame-compact:not(.frame-popout) .game .controls .balance .currency-picker-toggle{height:44px;min-height:44px;width:28px;min-width:28px;padding:0}
body.frame-compact:not(.frame-popout) .game .controls .balance #balance{font-size:13px}
@media(min-width:701px){body.frame-compact .game .controls .balance .currency-picker-toggle{width:44px;min-width:44px}}
@media(min-width:701px){
 body.frame-compact .game .controls #spin.spin{--wheel-size:44px;--hub-size:26px}
 body.frame-compact .game .controls #spin.spin .spin-wheel{display:grid!important;left:0;top:0;width:44px;height:44px}
 body.frame-compact .game .controls #spin.spin .spin-copy{width:68px;margin-left:44px;min-height:44px;padding:1px}
 body.frame-compact .game .controls #spin.spin #spin-label{font-size:12px;letter-spacing:0}
 body.frame-compact .game .controls #spin.spin #spin-hint{font-size:5px;letter-spacing:0}
}
/* Compact HUD stays a single row; live cards occupy their reserved floating slot. */
body.frame-compact .game .round-total{display:flex!important;flex-direction:row;align-items:center;gap:5px}
body.frame-compact .game .round-total>#round-total{width:auto;flex:0 1 auto;min-width:0}
body.frame-compact .game .round-total>#net{flex:0 0 auto;white-space:nowrap}
body.frame-compact .game .round-total.live-meter-active>#live-win{position:fixed;inset:auto 12px 170px auto;width:130px;height:auto;min-height:56px;padding:5px 7px;border:1px solid #7ce7cb;background:#143749f5;border-radius:7px}
body.frame-compact .game .round-total{max-width:calc(100% - 66px)}
body.frame-compact .game .round-total>#round-label{max-width:66px;min-width:0}
body.frame-compact.frame-popout .game .round-total.live-meter-active>#live-win{inset:56px auto auto 12px;width:148px;min-height:52px}
body.frame-compact .game .controls .round-tools{width:44px;justify-self:start}
body.frame-compact .game .controls .round-tools>#autoplay{flex:0 0 44px!important;width:44px!important;min-width:44px!important;max-width:44px}
body.frame-compact .game .controls.bonus-controls-active .round-tools{width:92px}
body.frame-compact .game .controls.bonus-controls-active .round-tools :is(#bonus-auto,#bonus-finish){flex:0 0 44px!important;width:44px!important;min-width:44px!important;max-width:44px}
@media(min-width:701px){
 body.frame-compact .game .controls{grid-template-columns:340px minmax(112px,1fr)44px 96px;gap:6px}
 body.frame-compact .game .controls.bonus-controls-active{grid-template-columns:340px minmax(112px,1fr)92px 96px}
 body.frame-compact .game .controls #spin.spin{width:min(100%,220px);max-width:220px;justify-self:center}
 body.frame-compact .game .controls #spin.spin .spin-copy{width:calc(100% - 44px)}
}

/* A connection or configuration notice remains readable even when cabinet captions are parked. */
body.engine-frame .engine-notice{position:absolute;left:8px;right:8px;bottom:8px;z-index:35;margin:0;padding:10px 12px;border:1px solid #fff2c7;border-radius:10px;background:#123746f2;color:#fff0ca;box-shadow:0 4px 18px #071827b3;font:700 12px/1.45 system-ui;white-space:normal;text-align:center;pointer-events:none}
body.engine-frame .engine-notice[hidden]{display:none!important}
body.engine-frame.frame-popout .engine-notice{font-size:10px;padding:5px;inset:4px;display:grid;align-content:center}
/* Engine phone HUD: keep the field size, join it to the bottom console and
   reserve a real 26px caption/amount band away from header controls. */
@media(max-width:700px){
 body.engine-frame.frame-compact:not(.frame-landscape) .game .arena{flex:0 0 auto;height:calc(min((var(--frame-width,100vw) - 16px)/1.11,var(--frame-height,100dvh) - 250px) + 26px);padding-top:26px;margin-top:auto;justify-content:center}
 body.engine-frame.frame-compact:not(.frame-landscape) .game .cabinet{width:min(100%,calc((var(--frame-height,100dvh) - 250px)*1.11));height:100%;max-height:calc((var(--frame-width,100vw) - 16px)/1.11)}
 body.engine-frame.frame-compact .game .mode-banner{position:absolute;left:60px;right:auto;top:10px;bottom:auto;width:clamp(58px,calc(var(--frame-width,100vw) - 256px),112px);max-width:none;min-height:30px;margin:0;padding:3px;transform:none;font:800 6px/1.3 system-ui;letter-spacing:0;white-space:normal;text-align:center;box-sizing:border-box;z-index:3}
 body.engine-frame:not(.frame-compact) .game .mode-banner{position:static;align-self:center;flex:0 0 auto;width:auto;max-width:100%;min-height:18px;margin:0;padding:3px 8px;transform:none;font:800 7px/1.3 system-ui;white-space:normal;text-align:center}
}
body.frame-compact .game .round-total>#round-total{font-size:13px!important;line-height:16px!important;white-space:nowrap!important;letter-spacing:-.3px}
body.frame-compact .game .round-total>#round-label{font-size:6px!important;line-height:8px!important;max-width:66px}
body.frame-compact .game .round-total>#net{font-size:6px!important;line-height:8px!important;max-width:66px}
body.frame-compact .game .round-total{height:22px!important;max-height:22px;min-height:0!important;top:0;gap:5px;align-items:center}
body.frame-compact .game .sun-meter{height:22px!important;max-height:22px;min-height:0!important;top:0}
body.frame-compact .game .sun-meter>strong{font-size:14px;line-height:22px}
@media(min-width:701px){body.engine-frame.frame-compact .game .mode-banner{position:absolute;left:70px;right:auto;top:12px;bottom:auto;width:210px;max-width:none;min-height:24px;margin:0;padding:4px 8px;transform:none;font:800 8px/1.3 system-ui;letter-spacing:.1px;white-space:normal;text-align:center;box-sizing:border-box;z-index:3}}

/* Only confirmed cells react; finite shards stay inside the existing board layer. */
.cascade-clear-burst{position:absolute;inset:0;overflow:hidden;pointer-events:none;contain:layout paint style;z-index:12}
.cascade-clear-shard{position:absolute;left:var(--cascade-x);top:var(--cascade-y);width:4px;height:8px;border-radius:1px;background:var(--cascade-colour);border:1px solid #fff3d799;box-shadow:0 0 5px var(--cascade-colour);clip-path:polygon(0 10%,85% 0,100% 70%,15% 100%);opacity:0;transform:translate(-50%,-50%) scale(.65);animation:cascade-shard-flight calc(var(--cascade-duration) - 20ms) cubic-bezier(.14,.75,.22,1) var(--cascade-delay) both;will-change:transform,opacity}
.tile.cascade-clear-hit:after{content:'';position:absolute;inset:10%;border:2px solid #baffdf;border-radius:13%;box-shadow:inset 0 0 8px #c0ffe766,0 0 12px #ffe4a280;pointer-events:none;animation:cascade-clear-outline 150ms ease-out both;z-index:6}
.tile.cascade-clear-hit>svg{animation:cascade-art-clear 150ms cubic-bezier(.2,.65,.3,1) both}
.tile.cascade-clear-fast:after,.tile.cascade-clear-fast>svg{animation-duration:75ms}
.tile.symbol-motion-ready.cascade-clear-hit:after{animation:cascade-clear-outline 150ms ease-out both!important;background:none;border:2px solid #baffdf;inset:10%}
.tile.symbol-motion-ready.cascade-clear-hit>svg.sm-art{animation:cascade-art-clear 150ms cubic-bezier(.2,.65,.3,1) both!important}
.tile.symbol-motion-ready.cascade-clear-fast:after,.tile.symbol-motion-ready.cascade-clear-fast>svg.sm-art{animation-duration:75ms!important}
.tile.cascade-clear-hit.removing{animation:none!important;clip-path:none;transform:none;opacity:1}
@keyframes cascade-clear-outline{0%{opacity:0;transform:scale(.84)}22%{opacity:.85}100%{opacity:0;transform:scale(1.08)}}
@keyframes cascade-art-clear{0%{opacity:1}32%{opacity:.94}100%{opacity:0}}
@keyframes cascade-shard-flight{0%{opacity:0;transform:translate(-50%,-50%) scale(.65) rotate(0)}14%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--cascade-dx)),calc(-50% + var(--cascade-dy))) scale(.15) rotate(var(--cascade-turn))}}
.no-motion .cascade-clear-burst,.no-motion .tile.cascade-clear-hit:after{display:none}
.no-motion .tile.cascade-clear-hit>svg{animation:none}
@media(prefers-reduced-motion:reduce){.cascade-clear-burst,.tile.cascade-clear-hit:after{display:none}.tile.cascade-clear-hit>svg{animation:none}}

/* Original collectible flight and finite payout decorations; no idle GPU layers. */
.nitro-transfer{position:absolute;z-index:25;width:58px;height:70px;pointer-events:none;transform-origin:center;contain:layout style}
.nitro-transfer>svg{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 2px #092b38)}
.nitro-transfer>b{position:absolute;right:-2px;top:1px;border:1px solid #dbfff1;border-radius:6px;padding:2px 4px;background:#0b4c58;color:#fff2b8;font:900 15px/1 sans-serif}
.nitro-transfer:before{content:'';position:absolute;left:10%;right:10%;bottom:0;height:45%;background:linear-gradient(0deg,transparent,#ffb63f66,#81fff1cc);clip-path:polygon(10% 100%,26% 10%,75% 0,90% 90%,50% 65%)}
.payout-money{position:absolute;z-index:0;pointer-events:none;width:19px;height:19px;backface-visibility:hidden}
.payout-coin{border:2px solid #fff0a9;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fffadd,#ffdf63 45%,#e49d2a 68%,#ffe386 76%,#ac6119);box-shadow:inset 0 0 0 2px #c98224,0 2px #97561a}
.payout-coin:after{content:'✦';position:absolute;inset:1px;text-align:center;color:#b17422;font:900 12px/13px sans-serif;text-shadow:0 1px #fff3a8}
.payout-note{width:33px;height:18px;border:1px solid #adffe1;border-radius:2px;background:linear-gradient(145deg,#aaffd4,#30cba8);box-shadow:inset 0 0 0 3px #167e7255}
.payout-note:after{content:'';position:absolute;inset:4px 12px;border:1px solid #176b6b;border-radius:50%;background:#c7ffe1}
#win-floats :is(.win-cascade,.win-spin).payout-folding{animation:none;will-change:transform,opacity}
#board-message[data-kind=win]{border-color:#ffe2a3;background:radial-gradient(ellipse at 50% 0,#ffca5452,transparent 68%),linear-gradient(135deg,#104c52f5,#302343f5);box-shadow:inset 0 1px #fff1b0,0 5px #081e33}
#board-message[data-kind=win]>strong{color:#fff0ac;text-shadow:0 2px #d7822d,0 4px #723145}
@media(max-width:700px){.nitro-transfer{width:40px;height:49px}.nitro-transfer>b{font-size:11px;padding:1px 3px}.payout-money{width:14px;height:14px}.payout-coin:after{font-size:8px;line-height:8px}.payout-note{width:26px;height:14px}.payout-note:after{inset:3px 9px}}
.no-motion :is(.nitro-transfer,.payout-money){display:none!important}
@media(prefers-reduced-motion:reduce){.nitro-transfer,.payout-money{display:none!important}}