/* 完整演出、中文数值布局及内嵌调控面板。 */
#profile{background:none;border:0;padding:0}#profile>.profile-details{min-width:0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
#nickname{max-width:150px;font-size:12px;line-height:16px}
#player-id{margin:0;max-width:154px;overflow:hidden;text-overflow:ellipsis;line-height:12px}
#vip-badge{font-size:9px;line-height:12px;color:#efce77;letter-spacing:1px}
.score-box{display:grid;grid-template-rows:14px 34px;justify-items:center;align-content:center;padding:5px 11px;text-align:center;overflow:hidden}
.score-box>span{line-height:14px;letter-spacing:2px;max-width:100%}
.score-box strong{display:flex;align-items:center;justify-content:center;width:100%;height:34px;font-size:27px;line-height:34px;white-space:nowrap}
.score-box>i{right:7px;bottom:8px;font-size:9px}
.step-button,.play-button,.panel-button,.top-button,.nav-button{justify-content:center;align-items:center;text-align:center}
.play-button,.step-button,.panel-button{display:flex;line-height:1.2}
.nav-button{display:flex;flex-direction:column;gap:4px}
.control-slab{overflow:hidden}
.stake-label{text-align:center;left:62px!important;width:129px!important}
#stake-value{display:flex;align-items:center;justify-content:center;left:62px!important;width:129px!important;text-align:center;white-space:nowrap;line-height:1}
#message{text-align:center;display:flex;justify-content:center;align-items:center;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#stage.frenzy .scene-background{filter:contrast(1.35) brightness(.42) saturate(.6);transition:filter .8s}
#stage.frenzy .edge{box-shadow:0 0 19px #fbc553,0 0 35px #c8792355}
#intro-banner{top:330px;padding:16px 5px;border-top:1px solid #dcb45b77;border-bottom:1px solid #dcb45b77}
#intro-banner strong{font-size:43px;line-height:1.25;letter-spacing:5px}
#intro-banner.show{animation:matrix-title var(--intro-duration,2400ms) both}
@keyframes matrix-title{0%{opacity:0;transform:scale(1.2)}15%,67%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.97)}}
#taunt{text-align:center;line-height:1.45}
#big-win{top:435px;z-index:42}#big-win-label{line-height:1.35}#big-win-value{line-height:1.12}
.panel-tools{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.panel-tools .panel-button{margin:0;width:100%;min-height:42px}
.layout-editor{position:absolute!important;left:8px;bottom:12px;right:8px;z-index:90;background:#0c120bf5;border:1px solid #ba984d;border-radius:12px;padding:12px;max-height:326px;overflow:auto;color:#e4d2a3;font-size:11px;box-shadow:0 0 30px #000b;touch-action:pan-y}
.layout-editor header{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;font-size:15px}
.layout-editor button,.layout-editor select,.layout-editor input[type=number],.import-label{color:#f2d999;background:#222a1b;border:1px solid #796537;border-radius:5px;padding:7px;font:inherit}
.layout-editor select{width:72%;margin-left:10px}.layout-editor label{display:flex;align-items:center;justify-content:space-between;gap:7px}.layout-editor input[type=number]{width:80px}
#layout-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}#layout-fields>p{grid-column:1/-1;margin:0;line-height:1.5}#layout-fields input[type=range]{min-width:0;width:90px;accent-color:#d4af57}#layout-fields output{min-width:28px}
.layout-actions{display:flex;flex-wrap:wrap;gap:6px}.import-label{position:relative;cursor:pointer}.import-label input{position:absolute;inset:0;opacity:0;width:100%}#layout-status{margin:10px 0 0;font-size:10px;line-height:1.4}
.showcase-return{position:absolute!important;top:105px;left:115px;width:200px;height:40px;border:1px solid #d8b05f;border-radius:7px;background:#161d13ed;color:#ffe09b;z-index:85;font-size:13px}
.showcase-active #hole-buttons,.showcase-active #play,.showcase-active #auto,.showcase-active #settings,.showcase-active #rules,.showcase-active #history,.showcase-active #minus,.showcase-active #plus{pointer-events:none}
.showcase-active #message{color:#ffdd80}.reduced-motion #intro-banner.show{animation:none;opacity:1}
.profile-fields{display:grid;gap:12px}.profile-fields>div{padding:12px;border:1px solid #75643e;border-radius:7px;text-align:center}.profile-fields small{display:block;color:#bba774}.profile-fields strong{display:block;overflow-wrap:anywhere;margin-top:5px;line-height:1.5}
/* 双向布局；所有游戏按钮整体opacity固定为0.30。 */
button{opacity:.7!important}button:disabled{filter:grayscale(.8);cursor:default}
#profile{justify-content:flex-start;padding-left:0}
#title{display:flex;flex-direction:column;align-items:center;justify-content:center}
#title h1{font-size:29px;letter-spacing:1px;margin:7px 0 4px}
#title .title-eyebrow{font-size:8px;letter-spacing:1px;gap:4px}#title .title-eyebrow i{width:8px}
#title .title-line{letter-spacing:2px;gap:8px;font-size:8px}
#rules,#history,#settings,#auto{flex-direction:row;gap:7px;font-size:12px;line-height:1.2}
#rules .nav-glyph,#history .nav-glyph,#settings .nav-glyph,#auto .nav-glyph{font-size:20px;line-height:1}
#return,#support{flex-direction:row;gap:9px}#return small,#support small{font-size:12px;letter-spacing:0}
#footer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;line-height:1.2;text-align:center}
#auto{border-color:#bd9b4a;background:linear-gradient(#70592b,#292719);font-weight:700}
#auto.active{background:linear-gradient(#88672a,#51471f);border-color:#ffe399}
#stage[data-orientation=landscape] #modal{width:650px;max-height:394px}
#stage[data-orientation=landscape] #modal header{padding:12px 22px}
#stage[data-orientation=landscape] #modal h2{font-size:23px;margin-top:2px}
#stage[data-orientation=landscape] #modal-content{padding:12px 22px}
#stage[data-orientation=landscape] .rule-grid{grid-template-columns:repeat(4,1fr)}
#stage[data-orientation=landscape] #loading{padding-top:18px;justify-content:center;gap:7px}
#stage[data-orientation=landscape] #loading img{width:90px;height:90px}
#stage[data-orientation=landscape] #loading h2{margin:5px 0}#stage[data-orientation=landscape] #loading p{margin:4px 0}
#stage[data-orientation=landscape] #intro-banner{left:235px;top:145px;width:462px}
#stage[data-orientation=landscape] #big-win{left:235px;top:180px;width:462px}
#stage[data-orientation=landscape] .showcase-return{top:75px;left:18px;width:192px}
#stage[data-orientation=landscape] .layout-editor{left:220px;right:220px;max-height:330px}
#stage[data-orientation=landscape] #footer{font-size:8px;gap:2px}
#stage[data-orientation=landscape] #stake .stake-label{left:47px!important;width:98px!important;top:8px}
#stage[data-orientation=landscape] #stake-value{left:47px!important;width:98px!important;top:29px}
#stage[data-orientation=landscape] #pool .pool-top{flex-wrap:wrap;gap:4px;font-size:10px}
#stage[data-orientation=landscape] #pool-value{font-size:12px}
#stage[data-orientation=landscape] #pool .pool-top em{font-size:8px;padding:0 5px}
#stage[data-orientation=landscape] #message{font-size:10px}
#stage[data-orientation=landscape] #nickname{max-width:125px}
#stage[data-orientation=landscape] #title h1{font-size:28px}
/* The viewport owns the background and edge controls; gameplay keeps one uniform scale. */
#viewport{display:block;overflow:hidden}
#stage{position:absolute;overflow:visible;background:transparent;box-shadow:none;transform-origin:0 0}
#stage #background,#stage #loading,#stage #modal-overlay,#stage #error-overlay,#stage .scene-vignette{position:fixed}
#background{background-size:cover;background-position:center}
#stage #modal{width:min(394px,calc(var(--screen-width,430px) - 24px));max-height:calc(var(--screen-height,932px) - 24px)}
#stage[data-orientation=landscape] #modal{width:min(650px,calc(var(--screen-width,932px) - 24px))}
#stage .layout-editor,#stage[data-orientation=landscape] .layout-editor{left:calc(var(--screen-x,0px) + (var(--screen-width,430px) - min(490px,var(--screen-width,430px))) / 2 + 8px);right:auto;bottom:auto;top:calc(var(--screen-y,0px) + var(--screen-height,932px) - min(326px,calc(var(--screen-height,932px) - 24px)) - 12px);width:calc(min(490px,var(--screen-width,430px)) - 16px);max-height:min(326px,calc(var(--screen-height,932px) - 24px))}
#stage .showcase-return,#stage[data-orientation=landscape] .showcase-return{left:calc(var(--screen-x,0px) + (var(--screen-width,430px) - 200px) / 2);top:calc(var(--screen-y,0px) + 12px)}
.stake-label,#stake-value{position:absolute;margin:0}
.stake-label{top:10px;line-height:14px}#stake-value{top:27px;height:30px}
#message{white-space:normal;line-height:1.3}
