@font-face{font-family:Barlow Condensed;src:url('assets/BarlowCondensed-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Barlow;src:url('assets/Barlow-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url('assets/Barlow-SemiBold.ttf') format('truetype');font-weight:600 800;font-display:swap}
:root{--ink:#16333f;--paper:#f3eee4;--orange:#ed793e;--orange-dark:#ae471d;--muted:#c9d5d4;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--paper);font-family:Barlow,sans-serif}button{font:inherit;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;color:inherit}button:disabled{cursor:wait;opacity:.72}[hidden]{display:none!important}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #fff3aa;outline-offset:4px}svg{width:22px;height:22px;flex-shrink:0}h1,h2,strong{margin:0}h1,h2,.wordmark,.distance>strong,.result-distance>strong{font-family:Barlow Condensed,sans-serif;font-weight:700}p{line-height:1.5;margin:0}#game{position:relative;width:100%;height:100%;min-height:280px;isolation:isolate}#scene{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}.menu-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,32,40,.94),rgba(16,37,44,.72) 30%,rgba(18,40,48,.05) 68%),linear-gradient(0deg,rgba(14,34,41,.6),transparent 22%);pointer-events:none;transition:opacity .3s}.is-running .menu-shade,.is-paused .menu-shade{opacity:0}.is-over .menu-shade{background:rgba(11,29,36,.68)}.topbar{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:calc(26px + var(--safe-top)) 36px 15px;gap:15px;z-index:4;pointer-events:none}.topbar button{pointer-events:auto}.wordmark{display:flex;align-items:center;gap:9px;font-size:25px;letter-spacing:.035em;background:none;padding:0;text-shadow:0 2px 8px #14323f99}.wordmark svg{width:30px;height:32px;color:var(--orange)}.wordmark b{color:var(--orange);font-weight:700}.tools{display:flex;gap:9px}.icon-btn{width:44px;height:44px;display:grid;place-items:center;background:#17333ee8;border-radius:50%;color:var(--paper)}.icon-btn svg{width:20px;height:20px}.welcome{position:absolute;left:7.5%;top:50%;transform:translateY(-48%);width:430px;max-width:42%;z-index:2}.welcome h1{font-size:clamp(66px,7.2vw,96px);line-height:.89;letter-spacing:-.025em}.welcome h1 span{color:var(--orange)}.welcome>p{font-size:17px;line-height:1.5;color:#d8e0dc;margin-top:24px;max-width:330px}.primary{min-height:58px;padding:16px 24px;background:var(--orange);color:#172e36;font-weight:700;font-size:17px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:5px;width:100%;transition:background .15s,transform .15s}.welcome .primary{margin-top:31px;max-width:325px}.primary svg{width:25px;height:25px}.loading-track{height:3px;background:#dce6df33;max-width:325px;margin-top:6px;overflow:hidden}.loading-track i{display:block;height:100%;width:100%;background:var(--orange);transform:scaleX(.05);transform-origin:left;transition:transform .2s}.best-line{display:flex;align-items:center;gap:8px;margin-top:18px;font-size:12px;color:#d8e0dc;flex-wrap:wrap}.best-line svg{height:17px;width:17px}.best-line strong{color:white;font-weight:600;margin-left:5px}.offline-note{font-size:10px;color:#b1c4c8;margin-left:3px}.control-guide{display:flex;gap:16px;flex-wrap:wrap;color:#c0d1d3;font-size:11px;margin-top:29px}.control-guide span{display:flex;align-items:center;gap:6px}kbd{font:600 12px Barlow;min-width:22px;display:inline-block;text-align:center;color:#e9efea;background:#58717b55;border-radius:3px;padding:3px 5px}.welcome .swipe-guide{display:none;font-size:12px;color:#c0d1d3;margin-top:24px}.menu-footer{position:absolute;bottom:calc(25px + var(--safe-bottom));left:36px;right:36px;display:flex;justify-content:space-between;align-items:center;color:#cad6d5;font-size:10px;letter-spacing:.07em;z-index:3}.menu-footer>span{display:flex;align-items:center;gap:9px}.menu-footer i{display:block;width:4px;height:4px;background:var(--orange);border-radius:50%}.menu-footer button{background:none;padding:10px 0;font-size:11px;color:#d0dedc;letter-spacing:0}
.hud{position:absolute;inset:0;pointer-events:none;text-shadow:0 2px 8px #18374499}.distance{position:absolute;left:50%;top:calc(22px + var(--safe-top));transform:translateX(-50%);text-align:center;white-space:nowrap}.distance{background:#17333ef2;padding:9px 17px 10px;border-radius:5px;text-shadow:none}.distance>strong{font-size:51px;line-height:1;font-variant-numeric:tabular-nums}.distance>span{font-size:17px;margin-left:5px}.distance small{display:block;font-size:11px;margin-top:4px;color:#f3f4e9;font-weight:600}.coin-count{position:absolute;right:36px;top:calc(100px + var(--safe-top));display:flex;align-items:center;gap:9px;background:#193943ed;padding:9px 15px;border-radius:5px;min-width:81px;color:#f1c667;text-shadow:none}.coin-count strong{font-size:20px;font-variant-numeric:tabular-nums}.coin-count svg{width:22px;height:22px}.best-pace{position:absolute;left:36px;top:calc(102px + var(--safe-top));display:flex;align-items:center;gap:6px;color:#f3f3e9;font-weight:600;font-size:11px;background:#193943dd;border-radius:4px;padding:8px 10px;text-shadow:none}.best-pace svg{width:16px;height:16px}.powers{position:absolute;right:36px;top:calc(157px + var(--safe-top));display:grid;gap:8px}.power{display:flex;gap:9px;align-items:center;width:166px;padding:10px 13px;background:#193943f0;border-radius:5px;text-shadow:none}.power>svg{color:#f2c774;width:23px;height:23px}.power>div{flex:1}.power strong{font-size:10px;font-weight:600;display:block;margin-bottom:6px}.power i{display:block;height:3px;background:#607680}.power b{display:block;height:100%;background:#f2c774;transform-origin:left}.tutorial{position:absolute;bottom:calc(35px + var(--safe-bottom));left:50%;transform:translateX(-50%);background:#193943e8;border-radius:5px;padding:11px 18px;font-size:12px;color:#e6ebe5;text-align:center;white-space:nowrap;text-shadow:none}.tutorial:empty{display:none}.touch-controls{display:none;position:absolute;left:22px;right:22px;bottom:calc(24px + var(--safe-bottom));justify-content:space-between;pointer-events:none;z-index:3}.touch-controls>div{display:flex;gap:9px}.touch-controls button{pointer-events:auto;display:grid;place-items:center;width:60px;height:56px;border-radius:9px;background:#193943db;color:#eef4ed;touch-action:none;transition:background .12s,transform .12s}.touch-controls svg{width:26px;height:26px}.touch-controls button.pressed{background:var(--orange);color:var(--ink);transform:scale(.92)}
.result{position:absolute;left:50%;top:50%;transform:translate(-50%,-47%);width:390px;max-width:calc(100% - 40px);max-height:calc(100% - 125px - var(--safe-top));overflow:auto;padding:22px 6px 10px;text-align:center;z-index:3}.result-mark{display:block;color:var(--orange);margin-bottom:8px}.result-mark svg{width:27px;height:27px}.result h1{font-size:43px;line-height:1}.result>p{font-size:12px;color:#cfdddc;margin-top:12px}.result-distance{display:flex;align-items:baseline;justify-content:center;gap:10px;margin:18px 0}.result-distance>strong{font-size:75px;line-height:1;font-variant-numeric:tabular-nums}.result-distance>span{font-size:15px;color:#c9d7d6}.result-stats{display:grid;gap:10px;padding:16px 0;border-top:1px solid #7c969b66;border-bottom:1px solid #7c969b66}.result-stats>div{display:flex;justify-content:space-between;font-size:13px}.result-stats strong{font-weight:600;color:#fff6df}.result-stats span{color:#baced1}.result .primary{margin-top:23px}.result #resultNote{font-size:11px;min-height:17px}.text-btn{padding:14px;background:none;font-size:12px;color:#d3dfde}.scrim{position:absolute;inset:0;z-index:10;background:#0d2832cf;display:grid;place-items:center;padding:20px}.dialog{position:relative;background:var(--paper);color:var(--ink);border-radius:12px;width:420px;max-width:100%;max-height:90dvh;overflow:auto;padding:32px;box-shadow:0 20px 60px #0b202955}.dialog>.icon-btn{position:absolute;right:15px;top:15px;width:34px;height:34px;background:#e0e2d9;color:var(--ink)}.dialog h2{font-size:36px;line-height:1.05;margin:6px 28px 22px 0}.dialog p{font-size:14px;margin:14px 0;color:#3c5660}.dialog .primary{font-size:15px;min-height:50px;margin-top:21px}.dialog .text-btn{color:#365463;display:block;width:100%;padding-bottom:0}.howto{display:grid;gap:18px;margin:20px 0}.howto>div{display:flex;align-items:center;gap:15px}.howto svg{width:27px;height:27px;color:#b64d20}.howto strong{display:block;font-size:14px;margin-bottom:3px}.howto span{font-size:12px;color:#45606a}.quality-row{border-top:1px solid #b9c4bf;padding-top:18px;margin-top:20px;display:flex;align-items:center;justify-content:space-between;font-size:13px}.quality-row select{font:600 13px Barlow;padding:9px;border:1px solid #a8b8b3;background:white;color:var(--ink);border-radius:4px}.dialog a{color:#90411f}.dialog .credits{font-size:12px}.toast{position:absolute;left:50%;bottom:calc(105px + var(--safe-bottom));transform:translateX(-50%);max-width:85%;width:max-content;padding:12px 18px;background:#f3d19b;color:var(--ink);font-size:13px;font-weight:600;border-radius:5px;z-index:15;text-align:center;pointer-events:none;box-shadow:0 5px 22px #09253144}.hit-flash{position:absolute;inset:0;pointer-events:none;background:#d48047;opacity:0;z-index:2;transition:opacity .5s}.hit-flash.active{opacity:.3}.error{position:absolute;inset:0;background:var(--ink);z-index:30;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:30px;text-align:center;gap:22px}.error h1{font-size:42px}.error p{max-width:390px;font-size:15px;color:#d2dedd}.error .primary{max-width:280px}
@media(hover:hover) and (pointer:fine){.primary:hover{background:#ff9252;transform:translateY(-1px)}.icon-btn:hover{background:#365660}.text-btn:hover,.menu-footer button:hover{color:var(--orange)}.touch-controls button:hover{background:#365660}}
@media(pointer:coarse){.touch-controls{display:flex}.control-guide{display:none}.welcome .swipe-guide{display:block}.tutorial{bottom:calc(95px + var(--safe-bottom))}}
@media(max-width:700px){.topbar{padding:calc(18px + var(--safe-top)) 19px 10px}.wordmark{font-size:20px;gap:6px}.wordmark svg{width:23px;height:27px}.tools{gap:7px}.icon-btn{width:37px;height:37px}.icon-btn svg{width:18px;height:18px}.welcome{left:25px;right:25px;top:auto;bottom:calc(80px + var(--safe-bottom));transform:none;width:auto;max-width:none}.welcome h1{font-size:72px;line-height:.88}.welcome h1 br{display:none}.welcome h1 span{display:block}.welcome>p{font-size:14px;margin-top:18px;max-width:260px}.welcome .primary{margin-top:24px;max-width:none;min-height:55px;font-size:16px}.welcome .loading-track{max-width:none}.best-line{font-size:11px;gap:6px;margin-top:14px}.offline-note{font-size:9px}.control-guide{display:none}.welcome .swipe-guide{display:block;font-size:11px;margin-top:17px}.menu-shade{background:linear-gradient(0deg,#102c37f7,rgba(17,46,57,.85) 35%,rgba(15,44,54,.08) 79%)}.menu-footer{left:25px;right:25px;bottom:calc(20px + var(--safe-bottom));font-size:9px}.menu-footer button{font-size:10px}.is-running .wordmark span,.is-paused .wordmark span{display:none}.distance{top:calc(12px + var(--safe-top));padding:7px 13px 8px}.distance>strong{font-size:42px}.distance>span{font-size:14px}.distance small{font-size:9px;margin-top:2px}.is-running .tools #helpBtn,.is-paused .tools #helpBtn{display:none}.coin-count{right:19px;top:calc(98px + var(--safe-top));padding:7px 10px;gap:7px;min-width:65px}.coin-count strong{font-size:17px}.coin-count svg{width:18px;height:18px}.best-pace{left:19px;top:calc(99px + var(--safe-top));font-size:9px;padding:7px 8px;gap:5px}.best-pace svg{width:13px;height:13px}.powers{right:19px;top:calc(143px + var(--safe-top));gap:7px}.power{width:135px;padding:9px;gap:8px}.power>svg{width:20px;height:20px}.power strong{font-size:9px}.touch-controls{display:flex;left:17px;right:17px;bottom:calc(25px + var(--safe-bottom))}.touch-controls>div{gap:7px}.touch-controls button{width:53px;height:53px}.tutorial{bottom:calc(95px + var(--safe-bottom));font-size:11px;max-width:90%;white-space:normal;width:max-content;padding:9px 12px}.result{max-height:calc(100% - 105px - var(--safe-top));top:52%;max-width:calc(100% - 52px);padding-top:10px}.result h1{font-size:37px}.result-distance>strong{font-size:66px}.result>p{font-size:11px}.result-stats>div{font-size:12px}.dialog{padding:27px}.dialog h2{font-size:31px}.toast{font-size:12px;bottom:calc(102px + var(--safe-bottom))}}
@media(max-height:700px) and (orientation:portrait){.welcome{bottom:calc(65px + var(--safe-bottom))}.welcome h1{font-size:59px}.welcome>p{font-size:12px;margin-top:14px}.welcome .primary{margin-top:19px;min-height:49px}.welcome .swipe-guide{margin-top:12px}.result-mark{display:none}.result h1{font-size:32px}.result-distance{margin:13px 0}.result-distance>strong{font-size:54px}.result-stats{gap:8px;padding:12px 0}.result .primary{min-height:49px;margin-top:14px}.result>p{margin-top:9px}.result #resultNote{font-size:10px}.result .text-btn{padding:10px}.menu-footer{bottom:calc(13px + var(--safe-bottom))}}
@media(orientation:landscape) and (max-height:550px){.topbar{padding:calc(13px + var(--safe-top)) 24px 8px}.wordmark{font-size:20px}.welcome{left:7%;top:50%;bottom:auto;transform:translateY(-41%);width:300px;max-width:43%}.welcome h1{font-size:56px;line-height:.9}.welcome h1 br{display:none}.welcome h1 span{display:inline}.welcome>p{font-size:12px;line-height:1.4;margin-top:12px}.welcome .primary{min-height:45px;padding:11px 17px;font-size:14px;margin-top:17px}.best-line{font-size:10px;margin-top:11px}.offline-note{display:none}.control-guide,.welcome .swipe-guide{display:none}.menu-footer{bottom:9px;left:24px;right:24px;font-size:8px}.menu-shade{background:linear-gradient(90deg,#102c37ed,rgba(17,46,57,.75) 30%,transparent 72%)}.distance{top:11px}.distance>strong{font-size:36px}.coin-count{top:64px;right:24px}.best-pace{top:66px;left:24px}.powers{top:112px;right:24px}.tutorial{bottom:20px}.touch-controls{bottom:17px}.touch-controls button{width:49px;height:46px}.result{width:490px;max-width:75%;top:56%;max-height:calc(100% - 83px);padding:8px 5px;display:grid;grid-template-columns:1fr 1fr;column-gap:22px;align-items:center}.result-mark{display:none}.result h1{font-size:33px;grid-column:1/-1}.result>p{grid-column:1/-1;margin-top:6px;font-size:10px}.result-distance{margin:10px 0}.result-distance>strong{font-size:57px}.result-distance>span{font-size:12px}.result-stats{padding:8px 0;gap:6px}.result-stats>div{font-size:10px}.result #resultNote{margin-top:0;font-size:9px;min-height:0}.result .primary{min-height:42px;margin-top:10px;font-size:13px;padding:11px 17px}.result .text-btn{margin-top:10px;padding:10px;font-size:11px}.result #againBtn{grid-column:1}.result #backBtn{grid-column:2}.toast{bottom:74px}.dialog{padding:24px;max-height:92dvh}.dialog h2{font-size:28px;margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}