*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0d0908;color:#ffedc9;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button{font:inherit;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #fff2ba;outline-offset:5px}button:disabled{opacity:.5;cursor:default}[hidden]{display:none!important}#game{position:absolute;width:100vw;height:56.25vw;max-width:177.7778vh;max-height:100vh;top:50%;left:50%;transform:translate(-50%,-50%);overflow:hidden;background:radial-gradient(ellipse at 50% 48%,#0000 24%,#13090575 84%),#160e0a url('./assets/arcade-background-v1.png') center/cover no-repeat}#scene{position:absolute;inset:0}#scene canvas{width:100%;height:100%;display:block}.topbar{position:absolute;inset:0;pointer-events:none}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#ebbf7d}h1{font-size:26px;letter-spacing:4px;margin:6px 0 0;color:#ffdf96}.scoreboard{position:absolute;right:4.1%;top:13%;width:185px;border:2px solid #e5a84e;border-radius:23px 23px 32px 32px;padding:20px 18px 13px;background:linear-gradient(145deg,#6b3c13f5,#201005f5 70%);box-shadow:inset 0 0 0 3px #301b0a,0 6px 24px #0008;pointer-events:auto}.scoreboard:before{content:'';position:absolute;left:60px;right:60px;top:-14px;height:20px;border:3px solid #d9a252;border-radius:14px 14px 0 0;box-shadow:inset 0 0 4px #f5da9e}.stat{position:relative;white-space:nowrap}.stat-label{font-size:15px;font-weight:700;letter-spacing:1px;color:#e5c49d;display:block}.stat strong{font-size:57px;font-family:Georgia,serif;line-height:1.12;color:#ffe19a;text-shadow:0 2px 6px #0009}.stat .unit{font-size:13px;color:#c5a37d;margin-left:6px}.reward-stat{border-top:1px solid #e5b56944;margin-top:8px;padding-top:8px;display:flex;align-items:baseline;gap:7px}.reward-stat .stat-label{font-size:11px;display:inline}.reward-stat strong{font-size:21px;color:#e5ca96}.reward-stat .unit{font-size:10px;margin-left:0}.stat-divider{display:none}.controls{position:absolute;inset:0;pointer-events:none}.key-hint{position:absolute;left:4.4%;bottom:8%;display:flex;flex-direction:column;gap:9px;font-size:11px;letter-spacing:.3px;color:#d1bca0}.key-hint span{display:flex;align-items:center;gap:5px}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:23px;height:20px;padding:0 5px;border:1px solid #e5c18c55;border-radius:4px;font-family:inherit;font-size:10px;color:#ffe5b7;background:#1a100c99}.drop-controls{position:absolute;right:3.5%;bottom:15%;pointer-events:auto}.drop-button{display:flex;align-items:center;gap:12px;justify-content:center;border:2px solid #f3c66f;border-radius:15px;min-width:200px;height:72px;padding:0 18px;background:linear-gradient(#ce3823,#8a140e);color:#ffecb6;box-shadow:inset 0 0 0 3px #831609,0 5px 0 #4b1609,0 9px 25px #0009;text-shadow:0 2px #791609;text-align:left}.drop-button>span:nth-child(2){font-size:20px;font-weight:700;letter-spacing:2px}.drop-sub{display:block;font-size:10px;letter-spacing:.4px;color:#f4cda0;margin-top:5px;font-weight:400}.coin-icon{font-size:28px}.button-key{font-size:22px}.drop-button:hover{filter:brightness(1.1)}.drop-button:active,.drop-button.pressed{transform:translateY(3px);box-shadow:inset 0 0 0 3px #831609,0 2px 0 #4b1609,0 5px 18px #0008}.fullscreen{position:absolute;right:6.1%;bottom:6.5%;border:0;background:#120a0770;border-radius:18px;padding:8px 14px;color:#dfbf91;font-size:20px;display:flex;align-items:center;gap:8px;pointer-events:auto}.fullscreen span{font-size:11px}.toast{position:absolute;right:3%;top:57%;width:220px;text-align:center;border:1px solid #edb75988;background:#2c1609ed;border-radius:12px;padding:13px 10px;font-size:15px;font-weight:600;color:#ffe3a1;line-height:1.7;opacity:0;transform:translateY(6px);transition:opacity .15s,transform .15s;pointer-events:none;box-shadow:0 5px 16px #0006}.toast.visible{opacity:1;transform:translateY(0)}.reward-stat.flash strong{color:#fff9dd;text-shadow:0 0 18px #ffc94b}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#100906d9;z-index:5;backdrop-filter:blur(7px)}.menu-card{width:370px;text-align:center;padding:35px;border:2px solid #bc873c;border-radius:18px;background:linear-gradient(145deg,#522d18,#201109);box-shadow:0 25px 80px #0008}.menu-card h2{font-size:29px;letter-spacing:4px;margin:20px 0 13px}.menu-card p{font-size:14px;line-height:1.8;color:#cfb18e;margin:0 0 27px}.menu-actions{display:flex;flex-direction:column;gap:11px}.menu-actions button{border:1px solid #c3914d99;background:#2b160c;color:#ffe5b7;border-radius:8px;padding:13px;font-size:16px}.menu-actions button:focus{outline:2px solid #f5cc7e;background:#b9772f;color:#211208;outline-offset:3px}.menu-hint{display:block;font-size:10px;color:#bd9b73;margin-top:25px}.loading,.error{position:absolute;inset:0;background:#1c110b;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:8;color:#f3cb7d}.loading-coin{font-size:46px;animation:spin 1s ease-in-out infinite}.loading p{font-size:16px;letter-spacing:3px}.error p{max-width:75%;line-height:1.8;word-break:break-word}.error button{padding:12px 24px;border:0;border-radius:8px;background:#e2bd72}.error h2{font-size:24px}#diagnostics{position:absolute;bottom:1%;left:1%;max-height:96%;overflow:hidden;z-index:10;padding:8px;background:#130b08e8;color:#f4cd8d;font-size:10px;line-height:1.4;pointer-events:none}@keyframes spin{50%{transform:scaleX(.15)}}@media(prefers-reduced-motion:reduce){.loading-coin{animation:none}.toast{transition:none}}

.feedback-review{position:absolute;left:2%;top:3%;display:flex;flex-direction:column;gap:8px;z-index:11}.feedback-review button{padding:9px 12px;border:1px solid #e7bc71;background:#26170ee8;color:#ffe2ac;border-radius:7px;font-size:12px}

/* UI 使用 1280×720 设计坐标，与 16:9 场景同比缩放，1080p/4K 保持相同占比。 */
#hud{position:absolute;left:0;top:0;width:1280px;height:720px;transform-origin:0 0}
.utility-controls{position:absolute;right:3.8%;top:37.5%;width:206px;display:flex;flex-direction:column;align-items:center;gap:10px}
.audio-switches{display:flex;gap:8px;width:100%}
.audio-toggle,.pause-button{position:static;width:auto;height:44px;border:1px solid #d5a560;border-radius:10px;background:#27180dee;color:#ffe4aa;box-shadow:inset 0 0 0 2px #65411c55;font-size:16px;font-weight:600;white-space:nowrap}
.audio-toggle{flex:1;padding:0 9px}.audio-toggle>span:first-child{font-size:20px}.toggle-state{font-size:13px;color:#ffd368;margin-left:3px}.audio-toggle.is-off{color:#b4a18a;border-color:#77634b}.is-off .toggle-state{color:#a99278}
.pause-button{min-width:94px;height:36px;font-size:15px;padding:0 16px}
button:focus{outline:3px solid #fff0ad;outline-offset:4px}
.spin-status{position:absolute;right:3%;top:51.5%;width:226px;text-align:center;padding:11px 9px;border:1px solid #bf8a3d;border-radius:9px;color:#ffe8b3;background:#29170eeb;font-size:15px;font-weight:600;line-height:1.5}
.toast{top:61%;font-size:16px}.drop-sub{font-size:12px}.key-hint{font-size:13px}.menu-hint{font-size:12px}.menu-actions button{font-size:18px}.fullscreen span{font-size:13px}

/* 加载层直接铺满真实 16:9 游戏容器，缩放在 WebGL 初始化之前即正确。 */
#game[aria-busy="true"] #hud{visibility:hidden}
.loading{background:#160e0a70}.loading p{font-size:clamp(16px,1.25vw,30px)}

.audio-toggle.is-waiting .toggle-state{color:#e3c58f;font-size:12px}
