:root{--bg-deep:#1a1410;--bg-warm:#2c2118;--accent:#e8a54b;--accent-hot:#ff6b4a;--cream:#f5e6d0;--ink:#1f1610;--panel:#1c140ed1;--ok:#7dce82;--danger:#ff7a6e;color:var(--cream);background:var(--bg-deep);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;padding:0}html,body,#root{touch-action:none;overscroll-behavior:none;background:radial-gradient(at top,#3a2a1c 0%,#15100c 70%);width:100%;height:100%;overflow:hidden}@supports (height:100dvh){html,body,#root{height:100dvh}}button{cursor:pointer;border:none;outline:none;font-family:inherit}.display-font{font-family:ZCOOL KuaiLe,Noto Sans SC,sans-serif}.overlay{pointer-events:none;z-index:10;position:absolute;inset:0}.overlay.interactive{pointer-events:auto}.hud{pointer-events:none;z-index:20;position:absolute;inset:0}.hud-top{flex-wrap:wrap;justify-content:space-between;gap:12px;padding:14px 16px;display:flex}.panel{background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #f5e6d01f;border-radius:14px;padding:10px 14px;box-shadow:0 8px 28px #00000059}.score-title{opacity:.7;letter-spacing:.08em;font-size:12px}.score-value{color:var(--accent);font-size:28px;font-weight:700;line-height:1.1}.combo{color:var(--accent-hot);min-height:1.2em;font-size:14px;font-weight:600}.timer{font-variant-numeric:tabular-nums;font-size:22px;font-weight:700}.missions{min-width:180px;max-width:260px}.missions h3{color:var(--accent);margin-bottom:6px;font-size:13px}.missions li{align-items:flex-start;gap:8px;padding:4px 0;font-size:13px;list-style:none;display:flex}.missions li.done{opacity:.55;text-decoration:line-through}.check{width:16px;color:var(--ok);flex:0 0 16px}.hint{opacity:.75;background:var(--panel);white-space:nowrap;border-radius:999px;padding:8px 14px;font-size:13px;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.crosshair{border:2px solid #ffffff8c;border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute;top:48%;left:50%}.menu,.result{z-index:30;pointer-events:auto;background:radial-gradient(at 30% 20%,#e8a54b40,#0000 50%),radial-gradient(at 70% 80%,#ff6b4a2e,#0000 45%),linear-gradient(160deg,#2a1c12 0%,#120e0b 100%);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.menu-card,.result-card{text-align:center;background:#16100ce0;border:1px solid #f5e6d024;border-radius:22px;width:min(440px,100%);padding:28px 26px;box-shadow:0 20px 60px #00000073}.menu-card-wide{width:min(560px,100%);max-height:min(92vh,820px);overflow:auto}.howto{text-align:left;background:#ffffff0a;border-radius:14px;margin-bottom:14px;padding:12px 14px;font-size:13px;line-height:1.45}.howto h3{color:var(--accent);margin-bottom:8px;font-size:14px}.howto ol{margin:0;padding-left:1.2em}.howto li{margin-bottom:6px}.howto strong{color:var(--cream)}.score-panel{position:relative;overflow:visible}.score-flash{color:var(--ok);pointer-events:none;font-size:18px;font-weight:700;animation:.9s forwards float-up;position:absolute;top:8px;right:10px}@keyframes float-up{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-18px)}}.hud-actions{justify-content:center;gap:6px;margin-top:6px;display:flex}.btn.tiny{min-width:0;margin-top:0;padding:6px 10px;font-size:12px}.tip-banner{pointer-events:auto;z-index:30;background:#16100ce6;border:1px solid #e8a54b73;border-radius:14px;flex-wrap:wrap;align-items:center;gap:8px;width:min(520px,100% - 24px);padding:12px 14px;font-size:13px;line-height:1.45;display:flex;position:absolute;top:22%;left:50%;transform:translate(-50%)}.tip-banner button{background:var(--accent);color:#1a120c;border-radius:999px;margin-left:auto;padding:6px 12px;font-size:12px;font-weight:700}.help-panel{pointer-events:auto;z-index:30;background:#16100ceb;border:1px solid #f5e6d024;border-radius:14px;width:min(340px,100% - 32px);padding:12px 14px;font-size:13px;line-height:1.45;position:absolute;bottom:70px;left:16px}.help-panel h3{color:var(--accent);margin-bottom:8px;font-size:14px}.help-panel ul{margin:0;padding-left:1.1em}.help-panel li{margin-bottom:6px}.menu-card h1,.result-card h1{color:var(--cream);margin-bottom:8px;font-size:clamp(2rem,6vw,2.8rem)}.tagline{opacity:.75;margin-bottom:22px;line-height:1.5}.features{text-align:left;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px;display:grid}.features div{background:#ffffff0a;border-radius:12px;padding:10px;font-size:13px}.features strong{color:var(--accent);margin-bottom:2px;display:block}.btn{color:#1a120c;background:linear-gradient(135deg,#e8a54b,#ff6b4a);border-radius:999px;justify-content:center;align-items:center;gap:8px;min-width:180px;padding:14px 22px;font-size:16px;font-weight:700;transition:transform .15s,filter .15s;display:inline-flex;box-shadow:0 8px 24px #e8a54b59}.btn:hover{filter:brightness(1.05);transform:translateY(-1px)}.btn:active{transform:translateY(1px)}.btn.ghost{color:var(--cream);box-shadow:none;background:0 0;border:1px solid #f5e6d040;margin-top:10px}.quality-row{justify-content:center;gap:8px;margin:16px 0 8px;display:flex}.quality-row button{color:var(--cream);background:#ffffff0f;border:1px solid #0000;border-radius:999px;padding:6px 12px;font-size:12px}.quality-row button.active{border-color:var(--accent);color:var(--accent)}.stats{grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0;display:grid}.stats div{background:#ffffff0a;border-radius:12px;padding:12px 8px}.stats .n{color:var(--accent);font-size:22px;font-weight:700}.stats .l{opacity:.7;font-size:12px}.perfect{color:var(--ok);margin-bottom:8px;font-weight:700}.touch-root{z-index:25;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:absolute;inset:0}.joystick-base{left:max(20px, env(safe-area-inset-left));bottom:max(24px, env(safe-area-inset-bottom));pointer-events:auto;touch-action:none;z-index:2;background:#140e0a66;border:2px solid #f5e6d038;border-radius:50%;width:148px;height:148px;position:absolute}.joystick-knob{pointer-events:none;background:#e8a54bcc;border:2px solid #fff6;border-radius:50%;width:64px;height:64px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.joy-label{opacity:.7;pointer-events:none;font-size:11px;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.touch-buttons{right:max(18px, env(safe-area-inset-right));bottom:max(28px, env(safe-area-inset-bottom));pointer-events:auto;z-index:2;flex-direction:column;gap:16px;display:flex;position:absolute}.touch-btn{width:84px;height:84px;color:var(--cream);touch-action:none;-webkit-user-select:none;user-select:none;background:#140e0a80;border:2px solid #f5e6d047;border-radius:50%;font-size:14px;font-weight:700}.touch-btn:active,.touch-btn.active{background:#e8a54b99}.look-pad{pointer-events:auto;touch-action:none;z-index:1;width:58%;height:72%;position:absolute;top:0;right:0}@media (width>=768px) and (pointer:coarse){.joystick-base{width:168px;height:168px}.touch-btn{width:92px;height:92px;font-size:15px}}