:root{--bg-1:#06231c;--bg-2:#0b3a2e;--jade:#12a37b;--gold-1:#fff1b8;--gold-2:#f5c84c;--gold-3:#c98a14;--red:#c8202b;--ink:#fdf6e3;--muted:#fdf6e39e;--panel:#00000052;--panel-line:#f5c84c59;--font-num:"Outfit", system-ui, sans-serif;--font-ui:"Outfit", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", "Noto Sans Thai", system-ui, sans-serif;--font-serif:"Noto Serif TC", "Songti TC", serif}*{box-sizing:border-box}html,body{background:var(--bg-1);height:100%;color:var(--ink);font-family:var(--font-ui);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}body{background:radial-gradient(120% 70% at 50% 0%, #12a37b59, transparent 60%), radial-gradient(80% 50% at 50% 110%, #f5c84c2e, transparent 70%), repeating-linear-gradient(45deg, #ffffff06 0 2px, transparent 2px 22px), linear-gradient(180deg, var(--bg-2), var(--bg-1));transition:background .6s}body.free-mode{--bg-1:#2a0608;--bg-2:#5a0e13;background:radial-gradient(120% 70% at 50% 0%, #f5c84c59, transparent 60%), radial-gradient(80% 50% at 50% 110%, #ff5a3c40, transparent 70%), repeating-linear-gradient(45deg, #ffffff08 0 2px, transparent 2px 22px), linear-gradient(180deg, var(--bg-2), var(--bg-1))}button{font:inherit;color:inherit;cursor:pointer}#app{height:100%}.stage{max-width:520px;height:100%;padding:max(10px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));flex-direction:column;gap:8px;margin:0 auto;display:flex}.top{flex-direction:column;align-items:center;gap:2px;display:flex}.brand{justify-content:space-between;align-items:center;width:100%;display:flex}.brand-mark{font-family:var(--font-num);letter-spacing:.06em;color:var(--ink);background:#00000073;border:1px solid #ffffff1f;border-radius:999px;padding:3px 10px;font-size:13px;font-weight:900}.brand-mark b{color:var(--gold-2)}.demo-badge{letter-spacing:.08em;border:1px solid var(--panel-line);color:var(--gold-1);background:#0000004d;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:700}.title{flex-direction:column;align-items:center;margin:0;line-height:1;display:flex}.title-main{font-family:var(--font-serif);letter-spacing:.08em;background:linear-gradient(180deg, var(--gold-1) 10%, var(--gold-2) 55%, var(--gold-3));color:#0000;filter:drop-shadow(0 2px #0000008c);-webkit-background-clip:text;background-clip:text;font-size:clamp(26px,8vw,38px);font-weight:900}.latin-title .title-main{font-family:var(--font-num);letter-spacing:.02em;white-space:nowrap;font-size:clamp(24px,7vw,32px)}.title-sub{letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin-top:4px;font-size:11px}.ladder-row{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;display:grid}.ladder-spacer{min-width:0}.buy-btn{color:#fff3d6;background:linear-gradient(160deg,#e2343a,#8e0f15);border:1px solid #ffb627;border-radius:12px;justify-self:start;align-items:center;gap:6px;padding:5px 10px 5px 7px;transition:transform .1s,opacity .2s;display:inline-flex;box-shadow:0 0 14px #ff6e2873,inset 0 1px #ffffff40}.buy-btn[hidden]{display:none}.buy-btn:disabled{opacity:.4;cursor:default}.buy-btn:not(:disabled):active{transform:scale(.95)}.buy-icon svg{color:#ffd76a;width:18px;height:18px;display:block}.buy-text{text-align:left;line-height:1.05;display:grid}.buy-text b{font-family:var(--font-num);letter-spacing:.06em;font-size:14px;font-weight:900}.buy-text small{opacity:.85;white-space:nowrap;font-size:9px}.ladder{justify-content:center;gap:6px;display:flex}.rung{text-align:center;min-width:46px;font-family:var(--font-num);color:var(--muted);background:#00000080;border:1px solid #ffffff1a;border-radius:10px;padding:4px 10px;font-size:15px;font-weight:800;transition:all .2s}.rung.active{color:#3a1d00;background:linear-gradient(180deg, var(--gold-1), var(--gold-2) 60%, var(--gold-3));border-color:var(--gold-1);box-shadow:0 0 16px #f5c84c99}.fs-banner{color:var(--gold-1);justify-content:center;align-items:baseline;gap:10px;font-weight:800;display:flex}.fs-banner[hidden]{display:none}.fs-label{font-family:var(--font-serif);font-size:18px}.fs-count{font-family:var(--font-num);color:var(--ink);font-size:15px}.board-frame{border:2px solid var(--panel-line);background:linear-gradient(#00000073,#00000040),radial-gradient(circle at 50% 30%,#12a37b40,#0000 70%);border-radius:18px;flex:1;justify-content:center;align-items:center;min-height:0;padding:12px;display:flex;box-shadow:inset 0 0 0 1px #0009,inset 0 0 40px #00000080,0 8px 30px #0006}.board-window{margin:-6px -4px;padding:6px 4px;overflow:hidden}.reels{align-items:center;gap:var(--gap);height:calc(var(--cell-h) * 5);display:flex}.reel{width:var(--cell-w);height:calc(var(--rows) * var(--cell-h));position:relative}.tile{left:0;top:calc(var(--row) * var(--cell-h));width:var(--cell-w);height:var(--cell-h);perspective:400px;padding:2px;transition:opacity .2s,filter .2s;position:absolute}.tile svg{filter:drop-shadow(0 2px 2px #0006);width:100%;height:100%;display:block}.tile.dim{opacity:.35;filter:saturate(.4)}.tile.win svg{animation:.9s ease-in-out infinite glow}.tile.to-wild svg{filter:drop-shadow(0 0 10px #ffe08a)}@keyframes glow{0%,to{filter:drop-shadow(0 0 4px #ffdc78e6);transform:scale(1)}50%{filter:drop-shadow(0 0 14px #ffdc78);transform:scale(1.06)}}.win-bar{justify-items:center;gap:2px;min-height:74px;display:grid}.win-label{letter-spacing:.2em;color:var(--muted);font-size:12px}.win-amount{font-family:var(--font-num);color:var(--gold-2);text-shadow:0 0 18px #f5c84c59;font-variant-numeric:tabular-nums;font-size:30px;font-weight:900;line-height:1}.win-lines{font-family:var(--font-num);color:var(--ink);flex-wrap:wrap;justify-content:center;gap:4px 12px;min-height:22px;font-size:12px;display:flex}.win-line{align-items:center;gap:5px;display:inline-flex}.mini{width:16px;height:21px;display:inline-block}.mini svg{width:100%;height:100%;display:block}.controls{gap:10px;display:grid}.meters{grid-template-columns:1fr 1fr;gap:8px;display:grid}.meter{background:var(--panel);border:1px solid #ffffff14;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:6px 8px;display:flex}.meter span{color:var(--muted);letter-spacing:.1em;font-size:11px}.meter b{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:17px}.bet-meter{flex-direction:row;justify-content:space-between}.bet-meter>div{flex-direction:column;align-items:center;display:flex}.buttons{justify-content:space-between;align-items:center;padding:0 4px;display:flex}.icon-btn,.round-btn{background:var(--panel);border:1px solid #ffffff24;border-radius:50%;place-items:center;width:46px;height:46px;transition:background .15s,transform .1s;display:grid}.icon-btn svg{fill:currentColor;width:22px;height:22px}.icon-btn svg[fill=none]{fill:none}.icon-btn:active,.round-btn:active{transform:scale(.92)}.icon-btn.on{color:#3a1d00;background:var(--gold-2)}.icon-btn.off{opacity:.5}.round-btn.small{width:32px;height:32px;font-size:20px;font-weight:700;line-height:1}.round-btn:disabled{opacity:.3;cursor:default}.spin-btn{border:3px solid var(--gold-1);color:#3a1d00;background:radial-gradient(circle at 35% 30%, var(--gold-1), var(--gold-2) 45%, var(--gold-3));border-radius:50%;place-items:center;width:86px;height:86px;transition:transform .1s;display:grid;position:relative;box-shadow:0 0 0 5px #00000059,0 6px 24px #f5c84c73}.spin-btn:active{transform:scale(.94)}.spin-icon svg{width:44px;height:44px;display:block}.spin-btn.spinning .spin-icon{animation:.6s linear infinite rotate}.spin-btn.auto-on{box-shadow:0 0 0 5px #12a37bb3,0 6px 24px #f5c84c73}.spin-count{min-width:26px;font-family:var(--font-num);background:var(--jade);color:#fff;border-radius:999px;padding:2px 6px;font-size:12px;font-weight:800;position:absolute;bottom:-4px;right:-4px}.spin-count:empty{display:none}@keyframes rotate{to{transform:rotate(360deg)}}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:10;background:#000000b8;place-items:center;padding:16px;animation:.25s ease-out fade-in;display:grid;position:fixed;inset:0}.overlay[hidden]{display:none}@keyframes fade-in{0%{opacity:0}}.overlay-card{text-align:center;width:min(440px,100%);max-height:100%;position:relative}.overlay-card.feature{border:2px solid var(--gold-2);background:radial-gradient(circle at 50% 0,#f5c84c59,#5a0e13f2 70%);border-radius:22px;padding:34px 20px;animation:.45s cubic-bezier(.2,1.4,.4,1) pop;box-shadow:0 0 60px #f5c84c66}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.fs-title{font-family:var(--font-serif);color:var(--gold-1);margin-bottom:14px;font-size:34px;font-weight:900}.fs-sub{color:var(--ink);font-size:16px}.fs-big{font-family:var(--font-num);background:linear-gradient(180deg, var(--gold-1), var(--gold-2) 55%, var(--gold-3));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:84px;font-weight:900;line-height:1.05}.fs-big.money{margin:8px 0;font-size:52px}.tap{color:var(--muted);margin-top:22px;font-size:13px;animation:1.2s ease-in-out infinite blink}@keyframes blink{50%{opacity:.35}}.overlay-card.big-win{padding:40px 0}.big-label{font-family:var(--font-serif), var(--font-num);letter-spacing:.04em;background:linear-gradient(180deg, #fff, var(--gold-1) 30%, var(--gold-2) 60%, var(--gold-3));color:#0000;filter:drop-shadow(0 4px #6b3a00)drop-shadow(0 0 30px #f5c84c99);-webkit-background-clip:text;background-clip:text;font-size:clamp(44px,14vw,72px);font-weight:900;animation:.6s cubic-bezier(.2,1.5,.4,1) pop;position:relative}.big-amount{font-family:var(--font-num);color:#fff;text-shadow:0 0 20px #f5c84ccc;font-variant-numeric:tabular-nums;font-size:clamp(36px,11vw,56px);font-weight:900;position:relative}.coins{pointer-events:none;position:fixed;inset:0;overflow:hidden}.coin{top:-40px;left:var(--x);width:calc(28px * var(--s));height:calc(28px * var(--s));animation:coin-fall 2.4s linear var(--d) infinite;background:radial-gradient(circle at 35% 30%,#fff6cf,#f3c242 55%,#b9780f);border-radius:50%;position:absolute;box-shadow:inset 0 0 0 3px #7a4a0580}@keyframes coin-fall{to{transform:translateY(110vh)rotateY(720deg)}}.overlay-card.dialog{border:1px solid var(--panel-line);background:linear-gradient(#0f4536,#082a21);border-radius:18px;padding:24px 20px;animation:.3s ease-out pop}.dialog-title{font-family:var(--font-serif);color:var(--gold-1);margin-bottom:12px;font-size:22px;font-weight:900}.overlay-card.dialog p{color:var(--ink);margin:0 0 18px;line-height:1.6}.primary-btn{color:#3a1d00;background:linear-gradient(180deg, var(--gold-1), var(--gold-2) 60%, var(--gold-3));border:0;border-radius:999px;min-width:140px;padding:12px 20px;font-weight:800}.auto-options{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.auto-options .primary-btn{min-width:0;font-family:var(--font-num);font-size:18px}.rules-dialog{text-align:left;-webkit-user-select:text;user-select:text}.rules-dialog .dialog-title{text-align:center}.rules-dialog .note{color:var(--muted);margin:0;font-size:12px}.facts{grid-template-columns:repeat(2,1fr);gap:8px;margin:0;display:grid}.facts div{background:var(--panel);border-radius:10px;padding:8px 10px}.facts dt{color:var(--muted);font-size:11px}.facts dd{font-family:var(--font-num);color:var(--gold-2);margin:2px 0 0;font-size:18px;font-weight:800}.pay-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.pay-row{background:var(--panel);border-radius:10px;align-items:center;gap:10px;margin-bottom:8px;padding:8px;display:flex}.pay-grid .pay-row{margin:0}.pay-row .mini{flex:none;width:40px;height:52px}.pay-row ul{font-family:var(--font-num);margin:0;padding:0;font-size:13px;list-style:none}.pay-row ul b{color:var(--gold-2);width:24px;display:inline-block}.pay-row p{font-size:13px;margin:0!important}.toast{border:1px solid var(--panel-line);max-width:calc(100% - 32px);color:var(--gold-1);z-index:20;text-align:center;background:#000000d9;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:700;position:fixed;bottom:140px;left:50%;transform:translate(-50%)}.toast[hidden]{display:none}@media (height>=860px){.win-amount{font-size:36px}}.dialog-actions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.dialog-actions .primary-btn{min-width:0}.ghost-btn{border:1px solid var(--panel-line);background:0 0;border-radius:999px;padding:12px 20px;font-weight:700}.overlay-card.buy-dialog{background:radial-gradient(circle at 50% 0,#ff962859,#5a0e13f5 65%);border-color:#ffb627}.buy-phoenix,.fs-phoenix{width:240px;margin:-100px auto 2px;-webkit-mask-image:linear-gradient(#000 55%,#0000 88%);mask-image:linear-gradient(#000 55%,#0000 88%)}.fs-phoenix{width:280px;margin:-124px auto 0}.buy-cost{font-family:var(--font-num);color:var(--gold-1);margin-bottom:6px;font-size:34px;font-weight:900}.auto-options{grid-template-columns:repeat(3,1fr)}.auto-options .primary-btn:last-child{grid-column:span 2}.rules{gap:10px;display:grid;position:relative}.rules-close{border:1px solid var(--panel-line);background:#0000004d;border-radius:50%;width:36px;height:36px;font-size:14px;position:absolute;top:-10px;right:-6px}.rules .dialog-title{margin-bottom:0}.page-title{text-align:center;color:var(--gold-2);letter-spacing:.04em;font-size:13px}.pages{height:clamp(290px,52dvh,420px);overflow:hidden}.page{align-content:start;gap:10px;animation:.25s ease-out page-in;display:grid}.page[hidden]{display:none}@keyframes page-in{0%{opacity:0;transform:translate(14px)}}.rule-list{gap:8px;margin:0;padding-left:18px;font-size:13.5px;line-height:1.55;display:grid}.pay-row.wide{margin:0}.ladder-demo{font-family:var(--font-num);flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;font-weight:800;display:flex}.ladder-label{min-width:72px;font-family:var(--font-ui);color:var(--muted);font-weight:600}.chip{background:var(--panel);color:var(--gold-2);border-radius:8px;padding:3px 9px}.ladder-demo.free .chip{color:#ffb08a}.arrow{color:var(--muted);font-weight:400}.pager{grid-template-columns:auto 1fr auto;align-items:center;gap:8px;display:grid}.pg-btn{border:1px solid var(--panel-line);white-space:nowrap;background:#00000040;border-radius:999px;padding:9px 14px;font-size:13px;font-weight:700}.dots{justify-content:center;gap:6px;display:flex}.dot{background:#ffffff40;border:0;border-radius:50%;width:8px;height:8px;padding:0}.dot.on{background:var(--gold-2);border-radius:4px;width:20px}.phx-art{aspect-ratio:3/2;--beat:3.6s;position:relative}.phx-art:before{content:"";filter:blur(12px);animation:phx-glow var(--beat) ease-in-out infinite;background:radial-gradient(closest-side,#ffaa3c73,#ff5a1e1f 60%,#0000);border-radius:50%;position:absolute;inset:12% 20% 18%}.phx-layer{-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.phx-l{transform-origin:46% 34%;animation:phx-wing-l var(--beat) ease-in-out infinite;-webkit-mask-image:linear-gradient(90deg,#000 41%,#0000 47%);mask-image:linear-gradient(90deg,#000 41%,#0000 47%)}.phx-r{transform-origin:54% 34%;animation:phx-wing-r var(--beat) ease-in-out infinite;-webkit-mask-image:linear-gradient(90deg,#0000 53%,#000 59%);mask-image:linear-gradient(90deg,#0000 53%,#000 59%)}.phx-c{transform-origin:50% 40%;animation:phx-breathe var(--beat) ease-in-out infinite;-webkit-mask-image:linear-gradient(90deg,#0000 40%,#000 46% 54%,#0000 60%);mask-image:linear-gradient(90deg,#0000 40%,#000 46% 54%,#0000 60%)}.phx-art.fast,.excited .phx-art{--beat:1.1s}@keyframes phx-wing-l{0%,to{transform:rotate(-2.5deg)}50%{transform:rotate(4.5deg)scaleY(.96)}}@keyframes phx-wing-r{0%,to{transform:rotate(2.5deg)}50%{transform:rotate(-4.5deg)scaleY(.96)}}@keyframes phx-breathe{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(1.2%)scale(1.01)}}@keyframes phx-glow{0%,to{opacity:.6}50%{opacity:1}}.stage{container-type:inline-size}.top{padding-top:24cqw;position:relative}.top>:not(.hero-phx){z-index:1;position:relative}.hero-phx{pointer-events:none;width:104cqw;animation:6s ease-in-out infinite hero-float;position:absolute;top:-2cqw;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(#000 50%,#0000 78%);mask-image:linear-gradient(#000 50%,#0000 78%)}.hero-phx.excited{filter:brightness(1.25)drop-shadow(0 0 18px #ff8c28b3)}@keyframes hero-float{0%,to{transform:translate(-50%)translateY(0)}50%{transform:translate(-50%)translateY(-1.5cqw)}}.brand{top:0;left:0;right:0;position:absolute!important}.brand-mark,.title-main,.title-sub{text-shadow:0 2px 10px #000000bf}.title-main{filter:drop-shadow(0 2px #000000b3)drop-shadow(0 0 14px #000000d9)}@media (height<=720px) and (orientation:portrait){.top{padding-top:15cqw}.hero-phx{width:78cqw;top:-1cqw}}.embers{pointer-events:none;z-index:12;width:100%;height:100%;position:fixed;inset:0}.phoenix-flyover{z-index:11;pointer-events:none;position:fixed;inset:0;overflow:hidden}.phoenix-flyover .flash{opacity:0;background:radial-gradient(circle at 50% 40%,#ffd278e6,#ff5a1e8c 45%,#780a0a33 80%);position:absolute;inset:0}.phoenix-flyover .flyer{filter:drop-shadow(0 0 28px #ff9628d9);width:min(96vw,680px);position:absolute;top:0;left:50%}.reel.anticipate:after{content:"";pointer-events:none;border:2px solid #ffb627;border-radius:10px;animation:.5s ease-in-out infinite alternate anticipate;position:absolute;inset:-3px;box-shadow:0 0 14px 2px #ff781ed9,inset 0 0 18px #ff8c2899}@keyframes anticipate{0%{opacity:.55}to{opacity:1}}.bw-phoenix{width:min(560px,96vw);margin:-60px auto -110px;animation:.7s cubic-bezier(.2,1.4,.4,1) pop;position:relative;-webkit-mask-image:linear-gradient(#000 50%,#0000 82%);mask-image:linear-gradient(#000 50%,#0000 82%)}@media (orientation:landscape) and (height<=560px){.stage{max-width:980px;padding:max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));grid-template:"board top""board ladder""board fs""board win"minmax(0,1fr)"board controls"/minmax(0,1fr) 280px;gap:6px 16px;display:grid}.top{grid-area:top}.ladder-row{grid-area:ladder;grid-template-columns:auto 1fr}.ladder-spacer{display:none}.ladder{gap:6px}.stage{container-type:normal}.top{padding-top:74px}.hero-phx{width:250px;animation:none;top:-6px;transform:translate(-50%)}.fs-banner{grid-area:fs}.board-frame{grid-area:board;padding:8px}.win-bar{grid-area:win;align-content:center;min-height:0}.controls{grid-area:controls;gap:8px}.title-main{font-size:24px}.title-sub{display:none}.rung{flex:1;min-width:0;padding:3px 6px;font-size:13px}.win-amount{font-size:24px}.meter b{font-size:15px}.spin-btn{width:64px;height:64px}.spin-icon svg{width:32px;height:32px}.icon-btn{width:38px;height:38px}.icon-btn svg{width:18px;height:18px}}@media (prefers-reduced-motion:reduce){.coin,.tile.win svg,.tap{animation:none}}