*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#052c3d;color:white;font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;background-image:radial-gradient(ellipse at 50% 30%,#126f7d,#031e31 80%)}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}button:disabled{opacity:.6;cursor:wait}a{color:inherit;text-decoration:none}[hidden]{display:none!important}#arena{height:100svh;width:100%;max-width:600px;position:relative;margin:auto;isolation:isolate;overflow:hidden;background:#37becd;box-shadow:0 0 130px #00152280;touch-action:none;user-select:none}#world{display:block;width:100%;height:100%;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(#002f4c6b,transparent 20%,transparent 65%,#002a4b33)}header{position:absolute;z-index:5;top:0;left:0;right:0;padding:calc(18px + env(safe-area-inset-top)) 23px 14px;display:flex;align-items:center;gap:13px}.brand{display:flex;align-items:center;gap:8px}.brand>b{font-size:32px;line-height:1;color:#d7ff61}.brand>span{font-size:14px;font-weight:800;letter-spacing:1px;line-height:1.2}.brand small{display:block;font-size:7px;letter-spacing:2px;margin-top:4px}.chapter{margin-left:auto;font-size:9px;letter-spacing:1px;color:#deffffb0}.round{border:1px solid #ffffff50;border-radius:50%;width:34px;height:34px;color:white;background:#05456780;backdrop-filter:blur(8px);font-size:19px}#hud{position:absolute;z-index:4;top:calc(82px + env(safe-area-inset-top));left:21px;right:21px;display:flex;align-items:center;gap:12px}.meter{background:#06374dcf;backdrop-filter:blur(15px);border:1px solid #74e7f280;border-radius:17px;padding:10px 17px;min-width:111px;box-shadow:0 4px 15px #043b571f}.meter>span{font-size:9px;display:block;letter-spacing:2px;color:#c1f5f1}.meter strong{font-size:34px;line-height:1.1;letter-spacing:-1px;color:#dcff62;font-variant-numeric:tabular-nums}.distance{margin-left:auto;width:105px;text-align:right;text-shadow:0 2px 7px #004768}.distance b{font-size:28px;font-variant-numeric:tabular-nums}.distance span{font-size:10px;margin-left:5px}.bar{height:4px;border-radius:3px;background:#ffffff45;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:#d8ff64;width:0}#stage-label{position:absolute;z-index:2;top:calc(174px + env(safe-area-inset-top));left:0;right:0;font-size:11px;font-weight:700;letter-spacing:2px;text-align:center;text-shadow:0 2px 8px #00586c}#feedback{position:absolute;z-index:7;left:0;right:0;top:32%;text-align:center;font-size:42px;letter-spacing:-2px;font-weight:1000;font-style:italic;text-shadow:0 3px 0 #074766,0 0 25px #03648c99;color:#efffb6;pointer-events:none;opacity:0;transform:scale(.8);transition:transform .15s,opacity .15s}#feedback.show{opacity:1;transform:scale(1)}#feedback small{display:block;font-size:12px;font-style:normal;letter-spacing:1px;color:white;margin-top:3px}#combo{position:absolute;left:22px;top:46%;z-index:2;display:flex;align-items:center;gap:7px;text-shadow:0 3px 3px #005177}#combo b{font-size:42px;color:#e1ff6b;font-style:italic}#combo span{font-size:9px;line-height:1.5;letter-spacing:1px}#instruction{position:absolute;z-index:2;bottom:7%;width:100%;text-align:center;font-size:13px;text-shadow:0 2px 4px #003650;letter-spacing:2px}.screen{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column}.intro{text-align:center;padding:calc(110px + env(safe-area-inset-top)) 16px 0}.eyebrow{font-size:9px;font-weight:700;letter-spacing:3px;color:#c3f6f3}.intro h1{font-size:clamp(43px,10.5vw,66px);letter-spacing:-3px;line-height:1.06;margin:15px 0 12px;font-weight:1000;transform:skew(-7deg) rotate(-4deg);text-shadow:0 5px 0 #066f85,0 8px 18px #02495b50}.intro h1>span{display:block;color:#ddff76;font-size:1.24em}.subtitle{display:flex;align-items:center;justify-content:center;gap:13px;font-size:13px;letter-spacing:7px;font-weight:800}.subtitle span{height:1px;width:30px;background:#ddfff2a0}.intro p{font-size:11px;letter-spacing:.5px;color:#e7ffff;margin-top:16px}.start-block{margin:auto 26px calc(49px + env(safe-area-inset-bottom));z-index:3}.guide{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:18px;text-shadow:0 2px 8px #00475a}.guide>b{font-size:35px}.guide span{font-size:13px;font-weight:750}.guide small{display:block;font-size:10px;font-weight:400;margin-top:4px;color:#dbf8f4}.primary,.secondary,.booking{display:block;width:100%;border:0;border-radius:14px;text-align:center;padding:17px 13px;font-size:15px;font-weight:800;transition:transform .12s}.primary{background:linear-gradient(110deg,#e6ff8a,#b6ee46);color:#173b39;box-shadow:0 5px 0 #4d9b51,0 12px 30px #002b4c40}.primary:active{transform:translateY(3px);box-shadow:0 2px 0 #4d9b51}.below{display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:10px;color:#e1fcf3}.below button,.text-button{border:0;background:transparent;color:inherit;font-size:11px;padding:5px 0}.below b{color:#dbff78}.centered{align-items:center;justify-content:center;padding:22px}.glass{background:#002c4c89;backdrop-filter:blur(12px)}.card{background:linear-gradient(155deg,#0b5570f5,#07374ff7);border:1px solid #9ce8ed60;box-shadow:0 25px 65px #00233866;border-radius:27px;text-align:center;padding:28px 25px;width:100%;max-width:390px;max-height:calc(100svh - 60px);overflow-y:auto;touch-action:pan-y}.card h2{font-size:29px;letter-spacing:-1px;margin:13px 0}.card>p{font-size:12px;line-height:1.65;color:#abd9df}.secondary{background:#ffffff0b;border:1px solid #8ec4d14f;color:white;margin-top:14px;font-size:13px;box-shadow:none}.booking{font-size:12px;color:#dfff92;border-top:1px solid #70b4be44;border-radius:0;margin-top:19px;padding:16px 0 0}.booking span{margin-left:12px}.disclaimer{display:block;font-size:9px;color:#93b7c3;line-height:1.6;margin-top:13px}.text-button{margin-top:12px;color:#b2d2d9}.stats{display:flex;justify-content:space-around;margin:18px 0}.stats span{font-size:10px;color:#a8d4da}.stats b{display:block;font-size:23px;color:#eafff2;margin-top:6px}#score{font-size:70px;line-height:1.05;font-weight:1000;letter-spacing:-3px;color:#deff77;text-shadow:0 0 30px #c8ff5120}#count{font-size:150px;line-height:1.2;font-weight:1000;font-style:italic;color:#e2ff84;text-shadow:0 6px 0 #07596e}#countdown>span{font-size:14px;font-weight:700;letter-spacing:2px}#countdown{background:#024b5c18;pointer-events:none}ul{padding:0;list-style:none;text-align:left;margin:18px 0 24px}li{margin-bottom:16px}li b{display:block;color:#e1ff8b;font-size:13px;margin-bottom:5px}li span{font-size:11px;line-height:1.7;color:#c2dfe3}.card .primary{margin-top:20px}textarea{width:100%;background:#092c43;color:#ddffef;border:1px solid #75c8cd50;border-radius:10px;padding:12px;font:11px/1.7 monospace;user-select:text}footer{position:absolute;z-index:3;bottom:calc(15px + env(safe-area-inset-bottom));left:23px;right:23px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#b5edf0b0}#toast{position:absolute;z-index:20;bottom:8%;left:8%;right:8%;padding:14px;background:#031e35ee;border:1px solid #77c6d750;border-radius:13px;color:#fff;text-align:center;font-size:12px;line-height:1.6}.active header .chapter{visibility:hidden}.active header{opacity:.8}.active #footer{display:none}#arena.result #hud{opacity:.2}@media(min-width:800px){#arena{border-left:1px solid #b4fff320;border-right:1px solid #b4fff320}.start-block{margin-left:70px;margin-right:70px}.intro{padding-top:110px}.intro h1{font-size:62px}}@media(max-height:730px){.intro{padding-top:85px}.intro h1{font-size:42px;margin:10px 0}.intro p{margin-top:10px}.start-block{margin-bottom:40px}.guide{margin-bottom:12px}.primary{padding:14px 12px}.card{padding:20px}#score{font-size:55px}.card h2{font-size:25px;margin:10px 0}.stats{margin:12px 0}.card .primary{margin-top:14px}.secondary{margin-top:10px;padding:13px}.booking{margin-top:12px}.disclaimer{font-size:8px}.intro .eyebrow{font-size:8px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.meter>small{display:block;font-size:9px;color:#b2e2df;margin-top:5px;font-weight:500;letter-spacing:.5px}

.reward-banner{position:absolute;z-index:5;top:calc(66px + env(safe-area-inset-top));left:14px;right:14px;text-align:center;padding:9px 5px;background:#e1ff8cee;color:#124b4b;border:1px solid #ffffffa0;border-radius:10px;font-size:clamp(10px,2.8vw,13px);font-weight:800;box-shadow:0 3px 15px #00547320;pointer-events:none}#hud{top:calc(115px + env(safe-area-inset-top))}#stage-label{top:calc(211px + env(safe-area-inset-top))}.intro{padding-top:calc(130px + env(safe-area-inset-top))}@media(max-height:730px){.intro{padding-top:115px}.intro h1{font-size:36px}}

.brand .official-logo{display:block;width:118px;height:54px;object-fit:contain;background:white;border-radius:8px;padding:2px}.chapter{font-size:10px}header{align-items:center}
