:root{--accent:#ffc43b;--ink:#edf5ff;--surface:#10243a;--background:#081421;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:var(--ink);background:var(--background);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 0%,var(--surface),var(--background) 70%)}button,select{font:inherit}button{cursor:pointer;border:1px solid #ffffff35;border-radius:12px;color:var(--ink);background:#ffffff0d;padding:10px 16px;min-height:44px;touch-action:manipulation}button:hover{background:#ffffff20}button:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#app{width:min(1160px,96vw);padding:16px 0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}.brand{font-size:16px;font-weight:700;letter-spacing:.1em}.topbar nav{display:flex;gap:8px}.topbar button{font-size:14px}.stage{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;border:1px solid #ffffff35;box-shadow:0 24px 80px #0007;background:var(--surface)}#game{width:100%;height:100%;display:block;touch-action:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:auto;padding:24px;background:linear-gradient(90deg,#071421dd,#07142163 55%,#0714210d)}.menu{justify-content:flex-start;padding:36px}.menu-card{max-width:600px}.eyebrow{font-size:13px;letter-spacing:.2em;font-weight:700;color:var(--accent)}h1{font-size:clamp(30px,4.6vw,56px);letter-spacing:.015em;line-height:1.2;margin:15px 0}h2{font-size:clamp(22px,3vw,32px);line-height:1.4;margin:12px 0}p{line-height:1.65;margin:10px 0}.intro{color:#f4f7fa;font-size:16px;max-width:490px}.settings{display:flex;gap:12px;margin:20px 0 8px}.settings label{display:grid;gap:6px;font-size:14px;color:#dce5ed}.settings select{padding:10px 34px 10px 12px;border-radius:10px;border:1px solid #ffffff55;background:var(--surface);color:var(--ink);min-height:44px;font-size:16px}.mode-hint{font-size:14px;color:#e1e6eb;min-height:24px}.primary{background:var(--accent);color:#22291e;font-weight:800;border-color:transparent;box-shadow:0 4px 0 #0003;padding:12px 28px}.primary:hover{background:var(--accent);filter:brightness(1.08)}.keyboard-hint,.touch-hint{font-size:13px;margin-top:18px;color:#e0e7ec}.touch-hint{display:none}.panel{padding:28px;background:var(--surface);border:1px solid #ffffff35;border-radius:18px;max-width:760px;text-align:center;box-shadow:0 20px 60px #0006}.panel>button{margin:8px}.secondary{background:transparent}.hud{position:absolute;top:15px;left:16px;right:16px;display:flex;gap:8px;align-items:flex-start;pointer-events:none}.hud-item{background:#07121acc;border:1px solid #ffffff30;backdrop-filter:blur(8px);padding:8px 14px;border-radius:10px;min-width:78px;display:grid;gap:2px}.hud-item span{font-size:12px;color:#d9e1e7}.hud-item strong{font-size:24px;font-variant-numeric:tabular-nums}.personal{margin-left:auto}.helper-status{font-size:13px;color:#fff8cf;background:#13281dd9;border-radius:8px;padding:8px}.toast{position:absolute;top:100px;left:50%;transform:translateX(-50%);background:#102030df;border-radius:20px;color:#fff;padding:8px 16px;pointer-events:none;opacity:0;transition:opacity .15s;white-space:nowrap;font-size:14px}.toast.visible{opacity:1}.touch-controls{position:absolute;bottom:12px;left:18px;right:18px;display:none;align-items:flex-end;justify-content:space-between;pointer-events:none}.touch-controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;background:#172b3ce8;border:2px solid #ffffff80;border-radius:16px;min-width:78px;min-height:58px;font-weight:700;color:#fff;box-shadow:0 4px 0 #0004}.touch-controls .jump{background:var(--accent);color:#17231e;min-width:90px}.touch-controls button.pressed{transform:translateY(3px);filter:brightness(1.2);box-shadow:none}.right-controls{display:flex;align-items:flex-end;gap:14px}.right-controls small{display:block;font-size:12px;height:16px}.result-panel{display:grid;grid-template-columns:180px 1fr;text-align:left;gap:20px}.result-art{align-self:center}.result-art canvas{width:100%;height:auto}.result-actions{display:flex;gap:10px}.stats{display:flex;gap:20px;margin:16px 0;font-size:14px}.stats strong{display:block;font-size:26px;color:var(--accent)}.record{color:var(--accent);font-size:14px;min-height:20px}#blessing{font-size:15px;color:#cddccd}footer{display:flex;justify-content:space-between;gap:12px;padding-top:14px;color:#9cb0bd;font-size:12px}progress{accent-color:var(--accent);width:260px;height:10px}.rotate{position:fixed;inset:0;z-index:100;background:var(--background);padding:28px;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}.rotate-icon{font-size:90px;color:var(--accent)}dialog{border:1px solid #ffffff44;border-radius:18px;background:var(--surface);color:var(--ink);max-width:min(440px,90vw);text-align:center;padding:24px}dialog::backdrop{background:#000a}.dialog-close{float:right;font-size:13px}dialog h2{clear:both;font-size:22px}#qr svg{width:min(260px,65vw);height:auto;background:white;border:12px solid white;border-radius:8px}#shareUrl{font-size:13px;overflow-wrap:anywhere;user-select:all}
@media(pointer:coarse){.touch-controls{display:flex}.keyboard-hint{display:none}.touch-hint{display:block}}
@media(max-height:600px) and (orientation:landscape){#app{width:min(calc((100svh - 58px)*16/9),calc(100vw - 36px));padding:0}.topbar{margin-bottom:6px;gap:6px;height:40px}.topbar button{min-height:34px;padding:5px 10px;font-size:12px}.brand{font-size:14px}.stage{border-radius:12px}footer{display:none}.menu{padding:16px 24px}.eyebrow{font-size:12px}h1{font-size:30px;margin:8px 0}.intro{font-size:14px;margin:5px 0}.settings{margin:9px 0 4px;gap:10px}.settings label{display:flex;align-items:center;gap:6px;font-size:12px}.settings select{font-size:14px;min-height:36px;padding:5px 24px 5px 8px}.mode-hint{font-size:12px;margin:5px 0;min-height:18px}.primary{padding:9px 20px;min-height:40px}.keyboard-hint,.touch-hint{font-size:12px;margin-top:9px}.hud{top:8px;left:10px;right:10px;gap:6px}.hud-item{padding:4px 10px;min-width:60px}.hud-item strong{font-size:19px}.hud-item span{font-size:12px}.helper-status{font-size:12px;padding:5px}.toast{top:62px;font-size:12px}.panel{padding:16px;max-width:94%}.result-panel{grid-template-columns:120px 1fr;gap:14px}.result-panel h2{font-size:22px;margin:6px 0}.result-panel p{font-size:13px;margin:6px 0}.stats{margin:8px 0;gap:15px}.stats strong{font-size:22px}.record{min-height:0}.touch-controls{bottom:7px;left:12px;right:12px}.touch-controls button{min-height:49px;min-width:72px;font-size:14px}.touch-controls .jump{min-width:80px}.overlay{padding:12px}}
@media(max-width:500px){.brand{font-size:14px}.topbar button{font-size:12px;padding:6px 10px}.topbar nav{gap:4px}#storageNote{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.touch-controls button>span{font:700 32px/1 system-ui}.touch-controls svg{width:30px;height:30px;display:block;margin:auto}.touch-controls button{ -webkit-touch-callout:none }.touch-controls button>*{pointer-events:none}
/* Mobile shell uses the visible viewport, including the portrait-WebView fallback.
   The simulation stays 960x540; controls live outside the running lane. */
body.mobile-game{overflow:hidden;overscroll-behavior:none;min-height:0;height:100dvh;text-size-adjust:100%;-webkit-text-size-adjust:100%}
.mobile-game #app{position:fixed;left:var(--view-x,0px);top:var(--view-y,0px);width:var(--play-w);height:var(--play-h);padding:8px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transform-origin:0 0}
.mobile-game.turned #app{transform:translateX(var(--play-h)) rotate(90deg)}
.mobile-game .topbar{width:100%;height:28px;min-height:28px;margin:0;gap:8px}.mobile-game .brand{font-size:13px;letter-spacing:0}.mobile-game .topbar button{font-size:12px;min-height:28px;padding:3px 10px}.mobile-game #shareButton,.mobile-game footer{display:none}
.mobile-game .stage{flex:none;width:min(calc(var(--play-w) - 144px),calc((var(--play-h) - 52px)*16/9));aspect-ratio:16/9;overflow:visible;border-radius:8px;box-shadow:none}
.mobile-game #game{border-radius:8px}.mobile-game .overlay{border-radius:8px;padding:10px;overscroll-behavior:contain}.mobile-game .menu{padding:12px 18px;align-items:flex-start}.mobile-game .menu-card{width:100%;max-width:none}.mobile-game .eyebrow,.mobile-game .intro,.mobile-game .keyboard-hint,.mobile-game .touch-hint{display:none}
.mobile-game h1{font-size:clamp(20px,calc(var(--play-h)*.065),30px);margin:0 0 6px}.mobile-game .settings{margin:6px 0;gap:12px}.mobile-game .settings label{font-size:14px;display:flex;align-items:center;gap:6px}.mobile-game .settings select{min-height:36px;padding:4px 22px 4px 8px;font-size:14px}.mobile-game .mode-hint{font-size:12px;line-height:1.4;margin:5px 0;min-height:0}.mobile-game .primary{min-height:40px;padding:6px 18px;font-size:16px}
.mobile-game .hud{top:6px;left:6px;right:6px;gap:5px;flex-wrap:wrap}.mobile-game .hud-item{display:flex;align-items:center;gap:5px;min-width:0;padding:3px 6px;border-radius:6px}.mobile-game .hud-item span{font-size:12px}.mobile-game .hud-item strong{font-size:15px}.mobile-game .personal{margin-left:auto}.mobile-game .helper-status{font-size:12px;padding:3px 6px}.mobile-game .toast{top:52px;font-size:12px;max-width:95%;white-space:normal;text-align:center}
.mobile-game .touch-controls{inset:0 -64px;display:flex;align-items:flex-end;bottom:6px}.mobile-game .right-controls{flex-direction:column;gap:12px}.mobile-game .touch-controls button,.mobile-game .touch-controls .jump{width:54px;height:54px;min-width:54px;min-height:54px;padding:4px;border-radius:16px;font-size:28px}.mobile-game .touch-controls #abilityButton{height:64px}.mobile-game .right-controls small{font-size:12px;line-height:14px;height:14px}
.mobile-game .result-panel{grid-template-columns:72px 1fr;padding:10px;gap:8px;max-width:100%}.mobile-game .result-panel h2{font-size:18px;margin:3px 0}.mobile-game .result-panel p{font-size:12px;line-height:1.4;margin:4px 0}.mobile-game .stats{margin:4px 0;font-size:12px}.mobile-game .stats strong{font-size:18px}.mobile-game .result-actions{gap:6px}.mobile-game .panel>button{margin:4px}.mobile-game .panel{padding:12px}.mobile-game .panel h2{font-size:18px}.mobile-game .rotate{padding:20px}.mobile-game .rotate p{font-size:14px}.mobile-game .rotate-icon{font-size:60px}