@font-face{font-family:"Noto Sans SC";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/noto-sans-sc-700.woff2") format("woff2")}
:root{color-scheme:dark;font-family:"Noto Sans SC",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#12050c;touch-action:manipulation}
body{display:grid;place-items:center}
button{font:inherit}
.game-shell{position:relative;width:min(100vw,56.25vh);height:min(100vh,177.7778vw);overflow:hidden;background:#220911;isolation:isolate;user-select:none;-webkit-user-select:none}
.scene-background,.board-frame,.effects-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.scene-background{z-index:0}
.board-frame{z-index:11}
.effects-canvas{z-index:45}
.stage-header{position:absolute;z-index:12;left:13.89%;top:7.6%;width:72.22%;height:9%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff8d5;text-shadow:0 3px 2px #5a1209,0 0 14px #ff9c00;pointer-events:none}
.stage-name{font-size:clamp(15px,4.8vw,32px);font-weight:900;letter-spacing:.12em}
.progress-row{width:82%;display:flex;align-items:center;gap:3%;font-size:clamp(10px,2.7vw,19px);font-weight:800}
.progress-track{height:clamp(7px,1.8vw,13px);flex:1;border:2px solid #ffd66d;border-radius:999px;background:#210d20;box-shadow:inset 0 0 7px #000,0 0 8px #ffb400;overflow:hidden}
.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ff3d9a,#ffdc45,#60f7ff);box-shadow:0 0 10px #fff;transition:width .25s ease}
.board{position:absolute;z-index:10;overflow:hidden;pointer-events:none}
.symbol{position:absolute;display:grid;place-items:center;will-change:transform,opacity,filter;transform-origin:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.symbol img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px rgba(0,0,0,.35))}
.symbol.scatter img{filter:drop-shadow(0 0 8px #fff) drop-shadow(0 0 15px #ff7c00);animation:scatter-pulse .62s ease-in-out infinite alternate}
.wall-blocks{position:absolute;z-index:14;pointer-events:none}
.cookie-block{position:absolute;border:2px solid #6b2a09;border-radius:9px;background:radial-gradient(circle at 33% 32%,#ffe09a 0 8%,transparent 9%),radial-gradient(circle at 72% 66%,#8c451c 0 6%,transparent 7%),linear-gradient(145deg,#ffd27c,#b85a1c 72%);box-shadow:inset 0 0 7px #fff0a7,0 2px 4px rgba(0,0,0,.75);transition:opacity .22s,transform .22s;transform-origin:center}
.cookie-block.cleared{opacity:0;transform:scale(.15) rotate(20deg)}
.hud-box,.image-button{position:absolute;left:calc(var(--x) / 1080 * 100%);top:calc(var(--y) / 1920 * 100%);width:calc(var(--w) / 1080 * 100%);height:calc(var(--h) / 1920 * 100%)}
.hud-box{z-index:20;display:grid;place-items:center;color:#fff6d2;text-shadow:0 2px 2px #000,0 0 7px #ff7500;font-weight:800;font-size:clamp(8px,2.25vw,16px);white-space:nowrap}
.hud-box img{position:absolute;inset:0;width:100%;height:100%}
.hud-box span{position:relative;z-index:1}.hud-box b{color:#fff;font-variant-numeric:tabular-nums}
.image-button{z-index:30;padding:0;border:0;background:none;cursor:pointer;touch-action:manipulation}
.image-button img{width:100%;height:100%;object-fit:fill;display:block;pointer-events:none}
.image-button:active:not(:disabled){transform:scale(.94);filter:brightness(1.22)}
.image-button:disabled{filter:grayscale(.8) brightness(.55);cursor:not-allowed}
.image-button.active{filter:drop-shadow(0 0 9px #fff) drop-shadow(0 0 13px #54f9ff)}
.main-action{z-index:40}
.image-button em{position:absolute;right:-3%;top:-10%;min-width:22%;height:30%;border-radius:999px;background:#351226;border:1px solid #ffd45c;color:#fff;font-style:normal;font-size:clamp(6px,1.8vw,12px);line-height:1.4}
.free-only{display:none}.free-mode .free-only{display:grid}.free-mode .normal-only{display:none!important}
.hidden{display:none!important}
.toast{position:absolute;z-index:70;left:50%;top:50%;width:76%;padding:2.4% 4%;border:1px solid #ffd46b;border-radius:12px;background:rgba(22,5,22,.92);color:#fff;display:grid;place-items:center;text-align:center;font-size:clamp(11px,3vw,20px);font-weight:700;opacity:0;transform:translate(-50%,-50%) translateY(20px);pointer-events:none;transition:opacity 1.2s,transform 1.2s}
.toast.show{opacity:1;transform:translate(-50%,-50%) translateY(0)}
.banner{position:absolute;z-index:60;left:5%;top:43%;width:90%;display:grid;place-items:center;text-align:center;color:#fff6b1;font-weight:1000;font-size:clamp(24px,8vw,58px);letter-spacing:.06em;text-shadow:0 4px 1px #6e143e,0 0 8px #fff,0 0 20px #ff4bb0;opacity:0;transform:scale(.5);pointer-events:none}
.banner.show{opacity:1;transform:scale(1)}
.scatter-feature{position:absolute;z-index:68;inset:0;display:none;place-items:center;pointer-events:none;background:radial-gradient(circle,rgba(255,224,55,.38),rgba(30,4,24,.86) 62%)}
.scatter-feature.show,.scatter-feature.corner{display:grid}
.scatter-rays{position:absolute;z-index:0;left:-35%;top:-10%;width:170%;aspect-ratio:1;border-radius:50%;opacity:0;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.78) 0 .35deg,transparent .5deg 7deg);-webkit-mask-image:radial-gradient(circle,transparent 0 15%,#000 27% 70%,transparent 78%);mask-image:radial-gradient(circle,transparent 0 15%,#000 27% 70%,transparent 78%);animation:scatter-rays-spin 12s linear infinite}
.scatter-feature.show .scatter-rays{opacity:.86}
.scatter-orb{position:absolute;z-index:1;left:50%;top:50%;width:62%;aspect-ratio:1;container-type:inline-size;transform:translate(-50%,-50%) scale(.35);transform-origin:center;display:grid;place-items:center}
.scatter-orb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 18px #fff) drop-shadow(0 0 45px #ffcc25)}
.scatter-orb b{position:relative;z-index:1;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;font-size:93vw;font-size:150cqw;font-weight:200;line-height:.82;text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 3px 2px #7b165b,0 0 8px #fff,0 0 18px #ff4eb8}
.scatter-feature.corner{background:transparent}.scatter-feature.corner .scatter-rays{display:none}.scatter-feature.corner .scatter-orb{left:87%;top:15%;width:20%;transform:translate(-50%,-50%) scale(1)}
.scatter-feature.corner .scatter-orb b{font-size:12vw;font-size:60cqw}
.dialog-layer,.loading-layer{position:absolute;z-index:90;inset:0;display:grid;place-items:center;background:rgba(9,2,11,.78);backdrop-filter:blur(4px)}
.dialog-card{position:relative;width:84%;max-height:76%;overflow:auto;padding:8% 6% 7%;border:2px solid #ffd66b;border-radius:22px;background:linear-gradient(160deg,#401139,#180b22);box-shadow:0 0 32px rgba(255,91,186,.65);color:#fff}
.dialog-card h2{margin:0 0 5%;text-align:center;color:#ffe87b;font-size:clamp(20px,5vw,34px)}
.dialog-body{font-size:clamp(11px,2.7vw,18px);line-height:1.7}.dialog-body h3{color:#ffda6c;margin:1em 0 .2em}.dialog-body p{margin:.5em 0}.dialog-body table{width:100%;border-collapse:collapse}.dialog-body td,.dialog-body th{padding:.35em;border-bottom:1px solid rgba(255,255,255,.18);text-align:center}
.pay-stage{margin:5% 0;padding:4%;border:1px solid rgba(255,218,108,.55);border-radius:14px;background:rgba(14,5,26,.5)}
.pay-stage h3{margin:0 0 3%;text-align:center}.pay-symbols{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}
.pay-symbol{margin:0;min-width:0;text-align:center}.pay-symbol img{display:block;width:100%;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 0 5px rgba(255,255,255,.55))}
.pay-symbol figcaption{min-height:2.5em;font-size:.72em;line-height:1.2;color:#fff3c4}.icon-odds{display:flex;flex-wrap:wrap;justify-content:center;gap:3px;margin-top:3px}.icon-odds span{padding:2px 4px;border-radius:6px;background:linear-gradient(180deg,#72286d,#32143f);color:#ffe97f;font-size:.66em}.icon-odds b{color:#fff}
.special-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:3%;margin-top:5%}.special-rules figure{margin:0;text-align:center}.special-rules img{width:100%;aspect-ratio:1;object-fit:contain}.special-rules figcaption{font-size:.72em;line-height:1.3;color:#fff1b5}
.dialog-close{position:absolute;right:3%;top:2%;border:0;background:transparent;color:#fff;font-size:clamp(26px,8vw,52px);line-height:1;cursor:pointer}
.loading-layer{z-index:100;color:#fff;font-weight:800;text-align:center;pointer-events:none;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}.loading-orb{display:none}
@keyframes loading-spin{to{transform:rotate(360deg)}}
@keyframes scatter-pulse{from{transform:scale(.94)}to{transform:scale(1.06)}}
@keyframes scatter-rays-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.loading-orb{animation-duration:2s}}

/* 参考原游戏：姜饼墙大盘面 + 紧凑街机控制区 */
.board-frame{display:none}
.game-shell::before{content:"";position:absolute;z-index:7;left:0;top:0;width:100%;height:12%;pointer-events:none;background:radial-gradient(ellipse at 3% 4%,#fff8e2 0 3.2%,#edc894 3.4% 5.1%,transparent 5.4%),radial-gradient(ellipse at 97% 3%,#fff8e2 0 3.5%,#edc894 3.7% 5.4%,transparent 5.7%),radial-gradient(circle at 8% 2%,#ee4251 0 2.2%,transparent 2.4%),radial-gradient(circle at 92% 2%,#ee4251 0 2.2%,transparent 2.4%)}
.stage-header{left:4%;top:.7%;width:92%;height:9.8%;transform:rotate(-.55deg);border:5px solid #e3a24c;border-radius:7px;background:linear-gradient(175deg,#403b3c 0,#232123 52%,#111 100%);box-shadow:inset 0 0 0 2px #78411d,0 5px 0 #71340f,0 9px 12px rgba(0,0,0,.65);text-shadow:0 3px 1px #090909;z-index:24}
.stage-name{font-family:"Noto Sans SC","Kaiti SC","STKaiti","PingFang SC",sans-serif;font-size:clamp(23px,6.4vw,44px);font-weight:900;letter-spacing:.12em;color:#fff9e9;transform:translateY(4%)}
.progress-row{position:absolute;left:2%;top:16%;width:27%;height:68%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5%;padding:1.2%;color:#ffe33f;font-size:clamp(14px,4.2vw,29px);font-weight:1000;text-align:center;text-shadow:0 3px 1px #000}
.progress-track{width:88%;height:18%;flex:none;border:1px solid #f3c052;background:#42180d;box-shadow:inset 0 1px 4px #160602}.progress-track i{background:linear-gradient(90deg,#ffbc21,#fff45c);box-shadow:0 0 5px #fff}
.board{overflow:visible;border:12px solid transparent;border-radius:5px;background:linear-gradient(#3f0907,#2d0505) padding-box,repeating-linear-gradient(90deg,#f6d38b 0 30px,#fff3c2 30px 34px,#9f4b1c 34px 39px,#d98a38 39px 69px,#fff3c2 69px 73px,#814018 73px 78px) border-box;box-shadow:0 0 0 3px #6f3218,0 5px 14px rgba(0,0,0,.72),inset 0 0 42px rgba(0,0,0,.68)}
.board::before,.board::after{content:"";position:absolute;z-index:0;top:-11px;bottom:-11px;width:46px;border:2px solid #fff0c0;background:repeating-linear-gradient(to bottom,#e2a153 0 34px,#fff0bf 34px 38px,#91461f 38px 43px,#cf7e36 43px 77px,#fff0bf 77px 81px,#7c3918 81px 86px);box-shadow:inset 0 0 8px #fff1a5,0 2px 5px #3e1409}
.board::before{left:-48px;border-radius:0 8px 8px 0}.board::after{right:-48px;border-radius:8px 0 0 8px}
.free-mode .board{background-color:#235e36;background-image:radial-gradient(circle at 14% 16%,rgba(255,255,255,.8) 0 1.2%,transparent 1.5%),radial-gradient(circle at 72% 28%,rgba(255,255,255,.6) 0 1.5%,transparent 1.9%),radial-gradient(circle at 42% 66%,rgba(255,255,255,.72) 0 1%,transparent 1.4%),linear-gradient(155deg,rgba(255,255,255,.08),rgba(0,0,0,.28));background-size:19% 22%,27% 31%,23% 26%,100% 100%;transition:background-color .22s ease}
.free-mode[data-free-theme="blue"] .board{background-color:#276c92}.free-mode[data-free-theme="yellow"] .board{background-color:#99951d}.free-mode[data-free-theme="purple"] .board{background-color:#70229a}.free-mode[data-free-theme="red"] .board{background-color:#9d2d25}
.symbol{z-index:2}.symbol img{filter:drop-shadow(0 5px 2px rgba(0,0,0,.52))}
.cookie-block{border:3px solid #fff0c5;border-radius:7px;background:radial-gradient(circle at 32% 30%,#75401e 0 5%,transparent 6%),radial-gradient(circle at 68% 66%,#75401e 0 5%,transparent 6%),linear-gradient(150deg,#efb45e,#b86627 72%);box-shadow:inset 0 0 6px #fff1a8,0 2px 2px #4d1d0b}
.hud::before{content:"";position:absolute;z-index:8;left:0;top:76.9%;width:100%;height:23.1%;pointer-events:none;background:radial-gradient(circle at 24px 17px,#713618 0 3px,transparent 4px),radial-gradient(circle at 61px 36px,#713618 0 3px,transparent 4px),repeating-linear-gradient(to right,transparent 0 74px,#fff0c0 74px 78px,#793615 78px 83px),repeating-linear-gradient(to bottom,#cb7932 0 43px,#fff0c0 43px 47px,#793615 47px 52px);background-size:83px 52px,83px 52px,83px 52px,100% 52px;box-shadow:inset 0 6px 0 #fff0c0,inset 0 10px 0 #793615}
.hud-box{font-size:clamp(12px,3.5vw,24px);font-weight:1000;text-shadow:0 3px 1px #000;color:#ffe533;border:3px solid #e6a23d;border-radius:5px;background:linear-gradient(#4b160d,#1b0707);box-shadow:inset 0 0 0 2px #7e3d22,inset 0 3px 7px rgba(255,183,78,.25),0 4px 5px rgba(0,0,0,.65)}
.hud-box img{display:none}.hud-box b{margin-left:.2em;color:#fff6c5;text-shadow:0 3px 1px #000}.hud-box .trophy-icon{display:inline-block;width:1.45em;height:1.45em;margin-right:.15em;vertical-align:-.35em;filter:drop-shadow(0 2px 1px #000) drop-shadow(0 0 3px #ffcb39)}
#balanceHud{left:1.5%;top:78.3%;width:31.5%;height:4.8%}
#winHud{left:34.25%;top:78.3%;width:31.5%;height:4.8%}
#winHud span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-left:12%;padding-right:3%;box-sizing:border-box}
#winHud .trophy-icon{position:absolute;left:3%;top:50%;width:15%;height:72%;margin:0;transform:translateY(-50%);object-fit:contain;vertical-align:middle}
#totalWinHud{left:67%;top:78.3%;width:31.5%;height:4.8%}
#betHud{left:36%;top:89.25%;width:25%;height:4.7%}
#multiplierBox{left:1.5%;top:83.6%;width:31.5%;height:4.1%}#freeSpinsBox{left:1.5%;top:88.1%;width:31.5%;height:4.1%}
.image-button{border:3px solid #fff0a8;border-radius:9px;overflow:visible;background:linear-gradient(180deg,#6c4b36 0,#3a211d 52%,#1c0d0b 100%);box-shadow:inset 0 4px 5px rgba(255,255,255,.35),inset 0 -6px 7px rgba(0,0,0,.48),0 0 0 3px #8c351e,0 6px 0 #46170e,0 9px 8px rgba(0,0,0,.68);color:#ffe43b;transition:transform .08s,filter .08s,box-shadow .08s}
.image-button img{display:none}
.image-button::after{display:grid;place-items:center;width:100%;height:100%;font-weight:1000;font-size:clamp(18px,5.2vw,36px);line-height:1;color:#ffe43b;-webkit-text-stroke:.45px #6d3100;text-shadow:0 3px 1px #000,0 0 5px rgba(255,224,58,.5)}
.image-button:active:not(:disabled){transform:translateY(5px) scale(.985);filter:brightness(1.18);box-shadow:inset 0 3px 5px rgba(255,255,255,.25),inset 0 -3px 5px rgba(0,0,0,.45),0 0 0 3px #8c351e,0 2px 0 #46170e,0 4px 4px rgba(0,0,0,.6)}
#betUpButton{left:43%;top:83.2%;width:11%;height:5.2%;background:linear-gradient(#64c94b,#168c38 56%,#075320)}#betUpButton::after{content:"＋"}
#betDownButton{left:43%;top:94.4%;width:11%;height:5%;background:linear-gradient(#e85442,#a11620 56%,#5d0711)}#betDownButton::after{content:"－"}
#startButton,#stopButton{left:66%;top:83.8%;width:31%;height:6.11%;background:linear-gradient(#ffd549 0,#ff9c15 46%,#e74713 100%);box-shadow:inset 0 4px 6px rgba(255,255,255,.5),inset 0 -7px 7px rgba(153,24,0,.4),0 0 0 3px #b42619,0 6px 0 #68160c,0 10px 9px #000}#startButton::after{content:"确定"}#stopButton::after{content:"停止"}
#autoButton{left:66%;top:91.41%;width:31%;height:6.11%;background:linear-gradient(#ef5eff 0,#a52bc8 48%,#59119a 100%);box-shadow:inset 0 4px 6px rgba(255,255,255,.45),inset 0 -7px 7px rgba(53,0,91,.45),0 0 0 3px #7e238f,0 6px 0 #3e0c55,0 10px 9px #000}#autoButton::after{content:"托管"}
#menuButton{left:1.5%;top:84.0%;width:14.5%;height:4.4%;background:linear-gradient(#a179bf,#5e3b78)}#menuButton::after{content:"菜单"}
#helpButton{left:17%;top:84.0%;width:14.5%;height:4.4%;background:linear-gradient(#6aa5e6,#2d5ba6)}#helpButton::after{content:"赔率"}
#sfxButton{left:1.5%;top:89.45%;width:14.5%;height:4.4%;background:linear-gradient(#5bd2e8,#197f99)}#sfxButton::after{content:"音效"}
#musicButton{left:17%;top:89.45%;width:14.5%;height:4.4%;background:linear-gradient(#db65e9,#7b219b)}#musicButton::after{content:"音乐"}
#lobbyButton{left:1.5%;top:94.9%;width:14.5%;height:4.4%;background:linear-gradient(#b4845e,#6b4028)}#lobbyButton::after{content:"大厅"}
#supportButton{left:17%;top:94.9%;width:14.5%;height:4.4%;background:linear-gradient(#55cbb0,#177964)}#supportButton::after{content:"客服"}
#menuButton::after,#helpButton::after,#sfxButton::after,#musicButton::after,#lobbyButton::after,#supportButton::after{font-size:clamp(11px,3.2vw,22px)}
.image-button em{right:1%;top:-8%;border:0;background:transparent;color:#fff8a6;text-shadow:0 2px 1px #000}
/* Keep the approved frame; isolate free counters from the lower-left buttons. */
.free-mode #startButton:not(.hidden),.free-mode #autoButton{display:block!important}
.free-mode #multiplierBox{left:55%;top:12%;width:18%;height:4.1%}
.free-mode #freeSpinsBox{display:none}
.free-mode #betHud{opacity:.75}
.scatter-rays{animation-duration:32s}
.hud-box span{max-width:100%;text-align:center}
.symbol.winning{filter:brightness(1.35) drop-shadow(0 0 12px #fff2a5)}
#winHud span{padding-left:19%;padding-right:3%}
.match-examples{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.match-example{margin:0;text-align:center}
.match-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}
.match-grid img{width:100%;aspect-ratio:1;object-fit:contain;border:1px solid transparent}
.match-grid .matched{border-color:#ffe43b;background:#62430c;border-radius:5px}
.match-example figcaption{font-size:.9em;margin-top:6px}
@supports(height:100dvh){.game-shell{width:min(100vw,56.25dvh);height:min(100dvh,177.7778vw)}}