:root{color-scheme:dark;--bg:#141b18;--panel:#1e2822;--line:#3b473a;--lime:#c9f174;--cream:#f1e9cd;--muted:#a2ad98;--amber:#e5a64e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream);font-family:ui-monospace,"PingFang SC","Microsoft YaHei",monospace}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--lime);outline-offset:4px}a{color:inherit;text-decoration:none}header{max-width:1280px;margin:auto;padding:24px 36px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.brand{display:flex;gap:10px;align-items:center;color:var(--cream);font-weight:800;font-size:19px;letter-spacing:2px}.brand span{display:grid;place-items:center;background:var(--lime);color:#24331e;width:34px;height:34px;border-radius:7px;font-size:22px}.brand small{font-size:10px;color:var(--muted);margin-left:8px}main{max-width:1280px;margin:auto;padding:0 36px}.title{display:flex;justify-content:space-between;align-items:flex-end;padding:35px 0 26px}.eyebrow{color:var(--amber);font-size:11px;letter-spacing:3px;margin:0}.title h1{font-size:44px;margin:10px 0;letter-spacing:3px}.title h1 span{color:var(--lime);margin-left:8px}.subtitle{font-size:12px;color:var(--muted);margin:0}.round-tag{font-size:10px;line-height:1.9;letter-spacing:2px;text-align:right;color:var(--muted)}.round-tag b{color:var(--amber);font-size:11px}.arena{border:1px solid #5a5a41;background:#1b241f;border-radius:8px;overflow:hidden;box-shadow:0 16px 60px #0003}.scoreboard{height:82px;display:grid;grid-template-columns:1fr 100px 1fr;align-items:center;padding:0 28px;border-bottom:1px solid #636148;background:#222b22}.scoreboard small{display:block;font-size:10px;letter-spacing:2px;color:#aeb79c;margin-bottom:5px}.scoreboard strong{font-size:28px;letter-spacing:2px;color:var(--cream);font-variant-numeric:tabular-nums}.scoreboard .timer{text-align:center}.scoreboard .timer strong{font-size:34px;color:var(--amber)}.scoreboard .target{text-align:right}.scoreboard i{font-size:16px;font-style:normal;color:var(--muted)}.viewport{position:relative;background:#263126}canvas{width:100%;height:auto;aspect-ratio:16/9;display:block;image-rendering:pixelated;outline:0}.round-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#111b1680;backdrop-filter:blur(2px);z-index:2}.round-overlay[hidden],.countdown[hidden]{display:none}.overlay-card{width:min(520px,90%);text-align:center;background:#1c281fee;border:1px solid #7a8761;padding:30px;border-radius:4px;box-shadow:7px 7px 0 #10191080}.overlay-card>p:first-child{font-size:11px;letter-spacing:3px;color:var(--amber);margin:0 0 14px}.overlay-card h2{font-size:32px;margin:0 0 16px}.overlay-card p{font-size:12px;line-height:1.9;color:#c2cbb5}.primary{display:flex;justify-content:space-between;align-items:center;gap:40px;background:var(--lime);border:0;border-bottom:4px solid #809f42;color:#24311a;padding:13px 20px;font-weight:800;margin:22px auto 0;min-width:200px}.primary:active{transform:translateY(2px);border-bottom-width:2px}.primary:disabled{opacity:.5;cursor:wait}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:100px;font-weight:900;color:var(--cream);text-shadow:5px 5px 0 #14251c;pointer-events:none}.stage-bottom{position:absolute;bottom:15px;left:24px;right:24px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#d9ddbd;pointer-events:none;text-shadow:1px 2px #17231c}.bottom-panel{display:flex;gap:22px;align-items:center;padding:17px 24px;border-top:1px solid var(--line)}.health-label{font-size:10px;letter-spacing:1px;width:190px}.health-label>span{float:right;color:var(--lime)}.health-track,.progress-track{height:6px;background:#3d4738;margin-top:8px}.health-track>div{height:100%;background:var(--lime);width:100%;transition:width .1s}.progress-label{flex:1;font-size:10px;color:var(--muted)}.progress-track>div{background:var(--amber);height:100%;width:0}.bottom-panel button,.touch button{color:var(--cream);background:#29372b;border:1px solid #52604a;padding:9px 12px;border-radius:3px;font-size:11px;white-space:nowrap}.bottom-panel button:disabled{opacity:.35}.bottom-panel button:hover,.touch button:hover{border-color:var(--lime)}.controls{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.control-note>span{font-size:9px;color:var(--amber);letter-spacing:2px}.control-note p{font-size:10px;color:var(--muted);line-height:2;margin:6px 0}kbd{font:10px ui-monospace,monospace;border:1px solid #46513f;padding:3px 5px;border-radius:3px;margin:0 2px;color:var(--cream)}.touch{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.touch button{user-select:none;-webkit-user-select:none;touch-action:none}.touch button:active,.touch button.held{background:var(--lime);color:#23321c}.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;padding:28px 0}.tips b{font-size:11px;color:var(--amber);letter-spacing:2px}.tips h3{font-size:13px;font-weight:500;margin:10px 0}.tips p{font-size:11px;color:var(--muted);line-height:1.9;margin:0}footer{border-top:1px solid var(--line);padding:20px 0 30px;font-size:10px;color:#85927e;display:flex;justify-content:space-between;gap:12px}@media(max-width:900px){header{padding:18px 20px}main{padding:0 20px}.title h1{font-size:34px}.controls{display:block}.touch{justify-content:flex-start;margin-top:12px}.round-tag{display:none}.bottom-panel{gap:12px;padding:14px}.health-label{width:140px}.tips{gap:16px}}@media(max-width:560px){main{padding:0 10px}header{padding:14px}.brand{font-size:15px}.title{padding:24px 0 18px}.title h1{font-size:28px}.subtitle{font-size:10px}.scoreboard{height:70px;padding:0 12px;grid-template-columns:1fr 70px 1fr}.scoreboard small{font-size:8px;letter-spacing:1px}.scoreboard strong{font-size:21px}.scoreboard .timer strong{font-size:29px}.overlay-card{padding:16px}.overlay-card h2{font-size:23px;margin-bottom:7px}.overlay-card p{font-size:10px;margin:5px 0}.overlay-card>p:first-child{margin-bottom:8px}.primary{padding:9px 15px;margin-top:12px}.stage-bottom{font-size:7px;bottom:8px;left:10px;right:10px}.bottom-panel{flex-wrap:wrap;gap:12px}.health-label{width:44%}.progress-label{min-width:40%}.bottom-panel button{flex:1}.tips{grid-template-columns:1fr;padding:22px 0;gap:20px}.touch button{flex:1;padding:12px 6px}.countdown{font-size:60px}footer{font-size:9px;flex-direction:column}}
:is(.viewport)>canvas{width:min(100%,calc(177.778dvh - 266.667px));margin-inline:auto}
:is(.energy-label){width:145px;font-size:10px;color:#c9dfac;flex-shrink:0}.energy-track{height:6px;background:#3b4837;margin-top:8px}.energy-track>div{height:100%;width:0;background:#a8d988}.bottom-panel #super{border-color:#536b40;color:#93a782}.bottom-panel #super.ready{background:#d2f18b;color:#25351c;border-color:#e7f5b1;font-weight:800;box-shadow:0 0 12px #b7dd6333}.bottom-panel #super:disabled{opacity:.45;cursor:default}@media(max-width:900px){.bottom-panel{flex-wrap:wrap}.energy-label{width:130px;flex:1}.bottom-panel .health-label{width:140px}.bottom-panel .progress-label{min-width:120px}}
.secondary{display:block;margin:12px auto 0;border:1px solid #6d8052;background:transparent;color:#d2e8ac;padding:8px 12px;font-size:11px}.secondary:disabled{opacity:.4;cursor:wait}
.mobile-pad{display:none;position:absolute;inset:0;z-index:3;pointer-events:none}.mobile-pad button{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border:1px solid #e6f2ce66;background:#1a2a2480;color:#f3f8e8;box-shadow:inset 0 1px 0 #ffffff18,0 2px 8px #0003;backdrop-filter:blur(3px);font:bold 19px sans-serif;padding:0;display:grid;place-content:center}.mobile-pad button.held{background:#c9f174b8;color:#23321b;border-color:#e4ffad;transform:scale(.94)}.direction-pad{position:absolute;bottom:17px;left:max(14px,env(safe-area-inset-left));width:144px;height:130px;display:grid;grid-template-columns:repeat(3,43px);grid-template-rows:repeat(3,40px);gap:2px}.direction-pad button{border-radius:11px}.pad-up{grid-area:1/2}.pad-left{grid-area:2/1}.pad-right{grid-area:2/3}.pad-down{grid-area:3/2}.pad-center{grid-area:2/2;display:grid;place-items:center;color:#d8eebd88;font-size:22px}.direction-pad .pad-run{position:absolute;left:145px;bottom:0;width:43px;height:43px;border-radius:50%;font-size:13px}.action-pad{position:absolute;bottom:18px;right:max(14px,env(safe-area-inset-right));width:198px;display:grid;grid-template-columns:repeat(3,54px);gap:8px;align-items:end;justify-content:end}.action-pad button{width:54px;height:54px;border-radius:50%}.action-pad .mobile-super{grid-column:1/4;justify-self:end;width:83px;height:42px;border-radius:24px;font-size:14px;color:#d6e9a9;background:#40562b88;display:flex;gap:4px;align-items:center;justify-content:center}.mobile-super span{font-size:8px}.mobile-super:disabled{opacity:.5}.mobile-super.ready{border-color:#e4ff98;background:#b9e963b8;color:#213419;box-shadow:0 0 15px #d2fc7255}.action-pad .mobile-kick,.action-pad .mobile-punch{width:62px;height:62px;border-color:#e8d79999;background:#65542a80}.mobile-punch{grid-column:3}.mobile-kick{grid-column:2}.round-overlay,.countdown{z-index:5}.mobile-pad.disabled{opacity:.25;pointer-events:none}.mobile-pad.disabled button{pointer-events:none}
@media(pointer:coarse),(max-width:900px){.mobile-pad{display:block}.controls .touch{display:none}.stage-bottom{top:9px;bottom:auto;font-size:9px;pointer-events:none}.bottom-panel{position:relative;z-index:4}.viewport{touch-action:none;overscroll-behavior:contain}.mobile-pad button:focus-visible{outline:2px solid #d4f78c;outline-offset:1px}}
@media(max-width:560px) and (orientation:portrait){.viewport{min-height:360px;background:#283328}.viewport canvas{width:100%;height:auto;display:block}.direction-pad{bottom:10px;transform:scale(.86);transform-origin:left bottom}.action-pad{bottom:12px;transform:scale(.85);transform-origin:right bottom}.stage-bottom{font-size:8px}.title:after{content:'横屏游玩视野更宽 · 双指移动＋连击';font-size:10px;color:#c9d6b7;display:block;margin-top:10px}.title{flex-wrap:wrap}.round-overlay{padding:8px}}
@media(orientation:landscape) and (max-height:560px) and (pointer:coarse){body>header,.title,.controls,.tips,footer{display:none}main{padding:0}.arena{border-radius:0;border:0}.scoreboard{height:42px;padding:0 max(18px,env(safe-area-inset-left))}.scoreboard strong{font-size:20px}.scoreboard small{font-size:7px}.scoreboard .timer strong{font-size:24px}.viewport{height:calc(100dvh - 42px);min-height:0}.viewport canvas{width:100%;height:100%;object-fit:contain}.bottom-panel{display:none}.mobile-pad .direction-pad{bottom:max(12px,env(safe-area-inset-bottom))}.mobile-pad .action-pad{bottom:max(12px,env(safe-area-inset-bottom))}.stage-bottom{left:180px;right:220px;font-size:8px}.viewport:focus-within{outline:none}}
@keyframes super-ready-pulse{0%,100%{transform:scale(1);box-shadow:0 0 0 2px #d7ff9588,0 0 14px #c8f76b88;background:#d6f68c;color:#203710}50%{transform:scale(1.09);box-shadow:0 0 0 7px #d7ff9522,0 0 30px #dbff9bcc;background:#fbffd8;color:#233b13}}.action-pad .mobile-super.ready{animation:super-ready-pulse .85s ease-in-out infinite;width:104px;opacity:1;font-size:17px;border:2px solid #f3ffd3}.mobile-super.ready span{font-size:10px;font-weight:800}.mobile-pad .mobile-pause{position:absolute;top:8px;right:12px;width:34px;height:28px;border-radius:8px;font-size:15px}.viewport>.mobile-pad{isolation:isolate}@media(prefers-reduced-motion:reduce){.action-pad .mobile-super.ready{animation:none;outline:3px solid #efffb3;outline-offset:3px}}
@media(orientation:landscape) and (max-height:560px) and (max-width:900px){body>header,.title,.controls,.tips,footer{display:none}main{padding:0}.arena{border-radius:0;border:0}.scoreboard{height:42px;padding:0 18px}.scoreboard strong{font-size:20px}.scoreboard small{font-size:7px}.scoreboard .timer strong{font-size:24px}.viewport{height:calc(100dvh - 42px);min-height:0}.viewport>canvas{width:100%;height:100%;object-fit:contain;aspect-ratio:auto}.bottom-panel{display:none}.stage-bottom{left:190px;right:220px;font-size:8px}}
.arena,.arena *{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.arena{overscroll-behavior:contain;-webkit-tap-highlight-color:transparent}
.direction-pad{width:184px;height:174px;grid-template-columns:repeat(3,60px);grid-template-rows:repeat(3,56px);gap:2px;border-radius:50%;background:#14231a38;pointer-events:auto;touch-action:none}.direction-pad button{font-size:25px;border-radius:16px}.direction-pad .pad-run{left:190px;width:48px;height:48px;font-size:12px}.direction-pad .pad-center{font-size:28px;pointer-events:none}.direction-pad.running{box-shadow:0 0 0 2px #c9f17466,0 0 18px #b0e26944}.direction-pad.running .pad-center{font-size:0}.direction-pad.running .pad-center:after{content:'跑';font-size:18px;color:#d5fb97}.direction-pad:after{content:'双击方向 · 按住跑';position:absolute;bottom:-13px;left:16px;font-size:9px;color:#e7f2cc99;pointer-events:none}.action-pad{display:block;width:232px;height:212px}.action-pad button{position:absolute;width:70px;height:70px;font-size:22px}.action-pad .mobile-punch{left:24px;top:0;width:70px;height:70px}.action-pad .mobile-kick{left:112px;top:40px;width:70px;height:70px}.action-pad [data-hold=jump]{left:152px;top:128px;width:72px;height:72px;border-color:#b1d9a2aa;background:#34533b99}.action-pad [data-hold=guard]{left:55px;top:146px;width:58px;height:58px;font-size:18px}.action-pad .mobile-super{left:0;top:87px;width:102px;height:42px}.action-pad .mobile-super.ready{width:108px}.mobile-pad.disabled .direction-pad{pointer-events:none}
@media(max-width:560px) and (orientation:portrait){.direction-pad{transform:scale(.84);bottom:14px;left:8px}.direction-pad .pad-run{display:none}.action-pad{transform:scale(.77);right:6px;bottom:14px}.viewport{min-height:410px}.stage-bottom{font-size:8px}}
.action-pad{width:202px;height:202px}.action-pad .mobile-punch{left:72px;top:67px;width:76px;height:76px;border:2px solid #f3dba0cc;background:#76602aa8;font-size:25px}.action-pad .mobile-kick{left:10px;top:23px;width:64px;height:64px}.action-pad [data-hold=jump]{left:112px;top:143px;width:62px;height:62px}.action-pad [data-hold=guard]{left:10px;top:123px;width:56px;height:56px}.action-pad .mobile-super{left:90px;top:8px;width:105px;height:40px}.action-pad .mobile-super.ready{width:108px}