/* Shared 400 px controls. Portrait phones fill the width and adapt cinema height. */
html,body{position:fixed;inset:0;width:100%;height:100%;min-width:0;min-height:0;margin:0;padding:0;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
#app{position:fixed;inset:0;width:100%;height:100%;min-height:0;padding:0;display:block;overflow:hidden}
.safe-viewport-probe{position:fixed;top:0;left:0;height:100svh;width:0;box-sizing:border-box;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);visibility:hidden;pointer-events:none}
.desktop-mark,.desktop-side{display:none}
.game-viewport{position:absolute;inset:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.game-design{position:absolute;left:0;top:0;width:400px;height:var(--game-height,704px);transform-origin:0 0;visibility:hidden}
.game-design[data-fitted=true]{visibility:visible}
.game-design .cabinet{position:relative;width:400px;height:var(--game-height,704px);min-height:0;max-height:none;display:grid;grid-template-rows:40px var(--stage-height,225px) 439px;gap:0;border:0;border-radius:5px;overflow:hidden;padding:0;margin:0}
.game-design .topbar{width:400px;height:40px;min-height:0;padding:0 10px;gap:4px}
.game-design .brand{font-size:18px;line-height:1;letter-spacing:.2px}
.game-design .brand-glyph{width:22px;height:22px;font-size:22px;margin-right:6px}
.game-design .top-actions{gap:3px}
.game-design .top-actions .icon-button{width:32px;height:34px;padding:6px}
.game-design .top-actions .icon-button svg{width:19px;height:19px}
.game-design .stage{width:400px;height:var(--stage-height,225px);min-height:0;flex:none;aspect-ratio:auto}
.game-design .hero-video{object-fit:contain;object-position:center}
.game-design .hero-art{width:100%;height:100%;inset:0;object-position:center;object-fit:contain}
.game-design .play-area{width:400px;height:439px;padding:0;display:grid;grid-template-rows:32px 28px 235px 144px;gap:0;min-height:0}
.game-design .fever-meter{height:32px;min-height:0;margin:0;padding:4px 16px 3px}
.game-design .fever-meter-heading{font-size:11px;line-height:15px;white-space:nowrap}
.game-design .fever-meter-heading strong{font-size:14px;line-height:15px}
.game-design .fever-meter-heading b{font-size:13px}
.game-design .fever-track{height:3px;margin:5px 0 0}
.game-design .fever-caption{display:none}
.game-design .reel-frame{width:400px;height:235px;min-height:0;max-height:235px;margin:0;padding:0;aspect-ratio:auto}
.game-design .reels{inset:28px 32px;gap:2px;aspect-ratio:auto}
.game-design .reels{grid-template-columns:repeat(var(--reel-columns,5),minmax(0,1fr))}
.game-design .reel-column{grid-template-rows:repeat(var(--reel-rows,3),minmax(0,1fr));min-height:0}
.game-design .payline-overlay{inset:28px 32px}
.game-design .symbol-tag{font-size:9px}
.game-design .machine-console{position:relative;display:block;width:400px;height:144px;min-height:0;margin:0;padding:0;gap:0;isolation:isolate}
.game-design .machine-console:before{inset:4px 0;background-size:100% 100%;}
.game-design .console-screen{position:absolute;left:30px;top:25px;width:340px;height:22px;min-height:0;margin:0;display:block}
.game-design .machine-console .wallet{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:340px;height:22px;margin:0;padding:0}
.game-design .machine-console .wallet>div{display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0;height:22px}
.game-design .machine-console .wallet>div+div{padding-left:10px;border-left:1px solid #99999955}
.game-design .machine-console .wallet span{font:500 10px/1.1 'Noto Sans TC',sans-serif;letter-spacing:0;flex:0 0 auto;white-space:nowrap}
.game-design .machine-console .wallet strong{font-family:'Barlow Condensed',sans-serif;font-size:clamp(12px,calc(168px / var(--digits,7)),24px);font-weight:800;line-height:1;letter-spacing:0;white-space:nowrap;min-width:0;text-align:right}
.game-design .machine-console .credit-add{width:24px;height:24px;min-height:0;padding:4px;border-radius:5px;flex:0 0 24px}
.game-design .credit-add svg{width:17px;height:17px}
.game-design .machine-console .controls{position:absolute;left:26px;top:56px;width:348px;height:60px;min-height:0;display:grid;grid-template-columns:74px 168px 74px;gap:16px;align-items:stretch;padding:0;margin:0}
.game-design .machine-console .bet-control{width:74px;height:60px;min-height:0;max-height:60px;gap:3px;padding:2px 0;background:transparent;border:0;box-shadow:none}
.game-design .machine-console .bet-control>span{font:500 11px/1 'Noto Sans TC',sans-serif;letter-spacing:0}
.game-design .machine-console .bet-control>strong{font:800 25px/1 'Barlow Condensed',sans-serif}
.game-design .machine-console .bet-adjust-mark{display:flex;justify-content:center;gap:14px}
.game-design .bet-adjust-mark svg{width:13px;height:13px}
.game-design .spin-well{width:168px;height:60px}
.game-design .machine-console .spin-button{width:168px;height:60px;min-height:0;padding:0;background-size:contain!important}
.game-design .machine-console .spin-button>span{font:900 36px/1 'Barlow Condensed',sans-serif;letter-spacing:1px}
.game-design .console-modes{grid-template-rows:28px 28px;gap:4px}
.game-design .console-modes .turbo-button,.game-design .console-modes .mode-button{width:74px;height:28px;min-height:0;padding:2px;gap:3px;font:800 12px/1 'Barlow Condensed',sans-serif;letter-spacing:0;flex-direction:row;white-space:nowrap}
.game-design .console-modes .turbo-button svg{width:18px;height:18px}
.game-design .console-modes .mode-button svg{width:17px;height:17px}
.game-design .win-overlay{inset:auto 36px 31px;height:42px;padding:5px;gap:6px}
.game-design .win-overlay b{font-size:36px;line-height:1}
.game-design .combo-callout,.game-design .combo-callout.fever-announcement{inset:28px 32px;padding:8px 10px}
.game-design .combo-callout>strong,.game-design .combo-callout:not(.fever-announcement)>strong{font-size:23px;line-height:1.3}
.game-design .combo-callout>span{font-size:9px;line-height:1.2;letter-spacing:1px}
.game-design .combo-callout>b{font-size:30px;line-height:1.25}
.game-design .combo-callout>small{font-size:11px;line-height:1.3;margin-top:6px}
.game-design .browser-clearance{display:none}
/* The page is locked. Long rules/settings scroll only within the top-layer dialog. */
dialog{position:fixed;inset:auto;left:var(--dialog-left,10px);top:var(--dialog-top,10px);width:380px;max-width:none;min-width:0;max-height:var(--dialog-height,700px);margin:0;padding:18px;transform:scale(var(--dialog-scale,1));transform-origin:0 0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:none;touch-action:pan-y;-webkit-overflow-scrolling:touch}
dialog .dialog-heading{position:sticky;top:-18px;z-index:2;padding-top:4px;background:#1b1b1b}
dialog input,dialog select{font-size:16px}
dialog input[type=range]{touch-action:none}
dialog .icon-button{width:36px;height:38px}


.game-design .spin-button.skip-ready{opacity:1;cursor:pointer;filter:brightness(1.12)}
.game-design .cabinet.presentation-skippable .reel-frame{cursor:pointer}
.game-design .win-overlay.visible{transition:none}
.game-design .combo-callout.visible{transition-duration:80ms}
.game-design .cabinet.presentation-skippable{cursor:pointer}
/* Only rolling cells get blur and compositor movement; settled cells stay sharp. */
.game-design .moving .symbol-art{filter:blur(2px);opacity:.8;animation:reel-roll .1s linear infinite;will-change:transform}
.game-design .moving .symbol-cell{overflow:hidden}
@keyframes reel-roll{from{transform:translateY(-28%) scaleY(1.3)}to{transform:translateY(28%) scaleY(1.3)}}
.game-design .gentle-motion .moving .symbol-art{filter:none;transform:none;will-change:auto}
@media(prefers-reduced-motion:reduce){.game-design .moving .symbol-art{animation:none;filter:none;transform:none;will-change:auto}}
.game-design .symbol-cell{contain:layout style}
.game-design .winning .symbol-art{animation:none}
.game-design .fever-active .reel-frame:after{animation:none}
.game-design .machine-console.auto-running:after{animation:none}
.game-design .fever-intro .reel-frame:after{animation:fever-border 1.2s ease-in-out 1}
.game-design .visual-paused *,.game-design .visual-paused:before,.game-design .visual-paused:after{animation-play-state:paused!important}
.game-design .auto-control-row{display:grid;grid-template-columns:42px 28px;gap:4px}
.game-design .console-modes .auto-control-row .mode-button{width:42px;font-size:11px;padding:1px;letter-spacing:0}
.game-design .settings-button{display:grid;place-items:center;width:28px;height:28px;padding:4px;background:#2d2d2d;border:1px solid #808080;border-radius:5px;color:#f3f3f3}
.game-design .settings-button svg{width:18px;height:18px}
.settings-dialog{padding:14px;overflow:hidden;height:min(620px,var(--dialog-height,620px))}
.settings-dialog[open]{display:flex;flex-direction:column;gap:0}
.settings-dialog .dialog-heading{position:static;flex-shrink:0;min-height:36px;margin:0 0 10px;padding:0}
.settings-dialog .dialog-heading h2{font-size:22px}
.settings-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 10px;flex-shrink:0}
.settings-tabs button{height:36px;min-width:0;padding:0 6px;white-space:nowrap;background:#292929;border:1px solid #636363;color:#c4c4c4;border-radius:5px;font:600 14px/1 'Noto Sans TC',sans-serif}
.settings-tabs button[aria-selected=true]{color:#fafafa;background:#444444;border-color:#cfcfcf}
.settings-panel{display:flex;flex:1;min-height:0}
.settings-panel[hidden]{display:none!important}
.settings-panel form{display:flex;flex-direction:column;flex:1;min-height:0;margin:0}
.settings-scroll{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:0 3px 12px}
.settings-footer{flex-shrink:0;padding-top:10px;border-top:1px solid #5c5c5c}
.settings-footer .primary-dialog-button{height:42px;margin:0}
.settings-panel .track-title{margin:8px 0 12px;padding:10px}
.settings-panel .volume-field{margin:12px 0}
.settings-panel .check-row{margin:10px 0}
.settings-panel .setting-hint{font-size:12px;line-height:1.5}
/* AUTO fits one page; keep overflow recovery available when the keyboard opens. */
.settings-dialog:has(#auto-panel:not([hidden]),#audio-panel:not([hidden])){height:min(540px,var(--dialog-height,540px))}
.auto-settings-body{padding:0 2px 4px}
.auto-settings-body .auto-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px;margin:0}
.auto-fields label{min-width:0;line-height:20px}
.auto-fields select,.auto-fields input[type=number]{height:44px;margin-top:5px;min-width:0}
.auto-settings-body .setting-hint{margin:12px 0;line-height:1.45}
.auto-stop-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.auto-stop-options .check-row{min-width:0;min-height:68px;margin:0;padding:10px 8px;gap:8px;border:1px solid #626262;border-radius:5px;background:#292929;font-size:13px;line-height:1.4}
.auto-stop-options .check-row input{flex:0 0 20px;margin:0}
.auto-stop-options .check-row:has(input:checked){border-color:#cfcfcf;background:#444444;color:#fafafa}
.auto-settings-body .form-error{font-size:12px;margin:8px 0 0}
.audio-settings-body{padding:0 2px 4px}
.audio-channel{margin-bottom:8px;padding:7px 10px 2px;background:#292929;border:1px solid #626262;border-radius:5px}
.audio-channel-heading{display:grid;grid-template-columns:minmax(0,1fr) 40px;align-items:center;gap:8px}
.audio-channel .check-row{min-width:0;margin:0;padding:0;min-height:24px;gap:8px;font-size:14px;line-height:20px}
.audio-channel .check-row input{flex:0 0 20px;margin:0}
.audio-channel output{color:#d9d9d9;text-align:right;font-size:14px;font-variant-numeric:tabular-nums}
.audio-channel input[type=range]{display:block;width:100%;height:30px;margin:0;accent-color:#c7c7c7}
.audio-track{display:flex;flex-wrap:wrap;gap:2px 8px;margin:0 0 5px;color:#efefef;font-size:12px;line-height:17px}
.audio-track small{color:#acacac;font-size:11px}
.audio-settings-body .setting-hint{margin:8px 0 0;font-size:12px;line-height:17px}

/* One permanent glyph layout for idle, rolling, and settled balances. */
.game-design .machine-console .wallet #credits{position:relative;display:inline-flex;align-items:center;font:800 24px/28px 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums;height:28px;flex-shrink:0}
.game-design .machine-console .wallet #credits .credit-value{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.game-design .machine-console .wallet #credits .credit-reels{display:inline-flex;align-items:center;pointer-events:none}
.game-design .machine-console .wallet #credits .credit-reels,
.game-design .machine-console .wallet #credits .credit-reels *{font:800 24px/28px 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums;letter-spacing:0;color:inherit;-webkit-text-size-adjust:none;text-size-adjust:none}
#credits .credit-digit{display:block;flex:0 0 1ch;width:1ch;height:28px;overflow:hidden}
#credits .credit-strip{display:block;text-align:center}
#credits.credit-rolling .credit-strip{will-change:transform}
#credits .credit-strip b{display:block;height:28px}
#credits .credit-separator{display:block;flex:none;height:28px}
.game-design .machine-console .wallet #credits.credit-rolling .credit-reels,
.game-design .machine-console .wallet #credits.credit-rolling .credit-reels *{color:#fdfdfd;-webkit-text-fill-color:#fdfdfd;text-shadow:0 0 2px #ffffff,0 0 6px #eaeaea,0 0 11px #dfdfdf}
#credits.credit-rolling .credit-reels{background:radial-gradient(ellipse,#e2e2e22b,transparent 75%);box-shadow:0 0 9px #dedede2b;border-radius:3px}
.game-design .console-modes #auto[aria-pressed=true]{color:#f1f1f1;border-color:#e0e0e0;background:linear-gradient(#727272,#434343);box-shadow:inset 0 0 15px #e3e3e355,0 0 8px #b9b9b944}
.game-design .machine-console .spin-button>span{font-size:32px;white-space:nowrap}

.game-design .fever-track>i{transition:width .16s ease-out}

.game-design .fever-meter-heading{gap:0}
.game-design .fever-meter-heading b{font-size:11px;letter-spacing:1px;margin-left:5px}
.game-design .fever-meter-heading strong{font-size:12px}
.reactor-preview{padding:10px 12px;border:1px solid #808080;color:#dedede;background:#222222;font-weight:700;border-radius:5px}
.reactor-tier-list{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:9px 0}
.reactor-tier-list>div{padding:7px 3px;text-align:center;border:1px solid #686868;background:#272727;border-radius:4px}
.reactor-tier-list span{display:block;font:12px 'Barlow Condensed',sans-serif;color:#d0d0d0}
.reactor-tier-list b{font:800 22px 'Barlow Condensed',sans-serif;color:#efefef}
.reactor-tier-list small{display:block;font-size:12px;white-space:nowrap;color:#ececec}
.reactor-probabilities{width:100%;font-size:12px;font-variant-numeric:tabular-nums}
.reactor-probabilities th,.reactor-probabilities td{padding:7px 3px;text-align:center}
.reactor-rules{border:1px solid #757575;padding:12px;border-radius:5px;margin:14px 0;background:#282828}
.game-design .critical-strip{display:flex;align-items:center;gap:7px;width:400px;height:28px;padding:2px 16px;background:linear-gradient(#222222,#161616);border-bottom:1px solid #636363;box-sizing:border-box}
.critical-strip>span{flex:0 0 46px;font:600 10px/1.1 'Noto Sans TC',sans-serif;color:#cccccc;letter-spacing:0}
.critical-bar{position:relative;display:grid;grid-template-columns:repeat(var(--segment-count),1fr);flex:1;min-width:0;height:20px}
.critical-bar>span{position:relative;display:grid;place-items:center;color:#6f6f6f;background:#1c1c1c;border:1px solid #3d3d3d;font:700 13px/18px 'Barlow Condensed',sans-serif;--factor-color:#ebebeb}
.critical-bar>span[data-factor="2"]{--factor-color:#c9c9c9}.critical-bar>span[data-factor="3"]{--factor-color:#aeaeae}.critical-bar>span[data-factor="4"]{--factor-color:#bababa}.critical-bar>span[data-factor="5"]{--factor-color:#e0e0e0}
.critical-bar>span.available{color:var(--factor-color);border-color:var(--factor-color);background:#3f3f3f;box-shadow:inset 0 0 8px #cfcfcf26}
.critical-bar>span.available:not([data-factor="1"]){background:#353535}
.critical-bar>span.selected.available{color:#fcfcfc;text-shadow:0 0 4px var(--factor-color);box-shadow:inset 0 0 10px #e5e5e555}
/* Alternate only the two available cells; no pointer and no perpetual idle work. */
.critical-bar>span:after{content:'';position:absolute;inset:0;border:1px solid #f7f7f7;background:#f4f4f455;box-shadow:0 0 7px var(--factor-color);opacity:0;pointer-events:none}
.critical-bar[data-phase=rolling]>.available:after{animation:critical-lamp .36s steps(1,end) infinite;will-change:opacity}
.critical-bar[data-phase=rolling]>.available:not([data-factor="1"]):after{animation-delay:-.18s}
.critical-bar[data-phase=landed]>.selected{animation:critical-lock .3s ease-out 1}
.critical-bar[data-phase=landed]>.selected:after{opacity:.45}
.critical-bar[data-phase=landed]>.available:not(.selected){color:#8d8d8d;background:#222222;box-shadow:none;border-color:#535353}
@keyframes critical-lamp{0%,100%{opacity:1}50%{opacity:0}}
@keyframes critical-lock{from{background:#f7f7f7;color:#313131}to{background:#3f3f3f;color:#fcfcfc}}
@media(prefers-reduced-motion:reduce){.critical-bar[data-phase=rolling]>.available:after,.critical-bar[data-phase=landed]>.selected{animation:none;will-change:auto}}
.game-design #bet.insufficient-credit,#bet-preview.insufficient-credit{color:#969696!important;-webkit-text-fill-color:#969696;text-shadow:0 0 8px #6a6a6a4d}
.game-design .bet-control.insufficient-bet{border-color:#8a8a8a}
.credit-warning-balance{padding:12px;background:#212121;border:1px solid #808080;color:#c1c1c1;font-variant-numeric:tabular-nums}
.credit-warning-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center}
.credit-warning-actions button{margin:0;min-height:48px;font-size:16px}
/* Content bounds belong to the reusable layout, independent of theme artwork. */
.game-design .machine-console .wallet>div{min-width:0;overflow:hidden}
.game-design .machine-console .wallet #credits{flex:1 1 0;min-width:0;height:22px;justify-content:flex-end;overflow:visible}
.game-design .machine-console .wallet #credits .credit-reels{position:absolute;right:0;transform-origin:right center;white-space:nowrap}
.game-design .machine-console .wallet #win{display:block;flex:1 1 0;min-width:0;max-width:100%;height:22px;line-height:22px;white-space:nowrap}
.game-design .machine-console .wallet>div>span{max-width:48%;overflow-wrap:anywhere;white-space:normal;line-height:1.1}
.game-design .machine-console #bet{display:block;width:100%;max-width:100%;white-space:nowrap;text-align:center;line-height:1}
.game-design #overlay-amount{display:block;width:100%;max-width:100%;white-space:nowrap;text-align:center;line-height:1}
.game-design .win-overlay{min-width:0;overflow:hidden;justify-content:center}
.game-design .combo-callout>*{max-width:100%;overflow-wrap:anywhere}
.game-design .spin-button>span{max-width:94%;overflow:hidden}
dialog h2,dialog h3,dialog p,dialog label,dialog button,dialog strong,dialog b{min-width:0;max-width:100%;overflow-wrap:anywhere}
dialog .dialog-heading>div{min-width:0}dialog .dialog-heading .icon-button{flex-shrink:0}
