:root{font-family:Arial,Helvetica,sans-serif;color:#fff4e4;background:#253e53;font-synthesis:none;--red:#ff493e;--cream:#fff4e4;--edge:max(22px,env(safe-area-inset-left));-webkit-tap-highlight-color:transparent;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;touch-action:none}button,a{touch-action:manipulation}button{font:inherit;color:inherit;border:0;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #9eefe7;outline-offset:5px}button:active{transform:scale(.97)}[hidden]{display:none!important}#game{display:block;position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none}#shade{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(180deg,rgba(17,29,45,.34),transparent 31%,transparent 50%,rgba(19,33,46,.78));transition:opacity .5s}body.playing #shade{background:linear-gradient(180deg,rgba(12,29,43,.47),transparent 27%,transparent 60%,rgba(15,29,39,.6))}.topbar{position:fixed;z-index:5;top:max(20px,env(safe-area-inset-top));left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:9px;align-items:center;text-decoration:none;color:var(--cream)}.brand svg{width:29px;height:38px;fill:currentColor;stroke:currentColor;stroke-width:1.8}.brand>span{font-size:13px;font-weight:900;letter-spacing:1.1px}.brand small{display:block;font-size:7.5px;letter-spacing:1.5px;margin-top:5px;font-weight:500}.top-actions{display:flex;gap:8px}.icon-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #fff4e430;background:#1e34472a;border-radius:50%;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.icon-button svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}#menu{position:fixed;top:0;right:0;bottom:0;left:0;padding:0 var(--edge);pointer-events:none;display:flex;flex-direction:column}.edition{margin-top:max(100px,calc(env(safe-area-inset-top) + 80px));font-size:7px;letter-spacing:1.55px;font-weight:700;display:flex;gap:7px;align-items:center}.live-dot{width:5px;height:5px;border-radius:50%;background:var(--red)}h1{position:relative;margin:16px 0 0 -4px;font-family:Impact,Arial Narrow,sans-serif;font-stretch:condensed;font-size:clamp(80px,23vw,125px);font-weight:900;line-height:.82;letter-spacing:-3px;max-width:490px;text-shadow:0 2px 35px #222b3612}h1 span{color:var(--red)}h1 i{font-family:Arial,sans-serif;color:var(--red);font-style:normal;font-weight:400;font-size:90px;position:absolute;left:230px;bottom:3px}.menu-bottom{margin-top:auto;padding-bottom:max(17px,env(safe-area-inset-bottom));width:100%;pointer-events:auto}.tagline{font-size:17px;font-weight:500;line-height:1.3;letter-spacing:-.35px;margin:0 0 21px}.tagline em{font-style:normal;color:#ffc9ad}.mode-switch{display:flex;margin-bottom:12px;border-top:1px solid #fff4e440;border-bottom:1px solid #fff4e440}.mode-switch button{position:relative;background:transparent;flex:1;text-align:left;padding:14px 0 13px;font-size:10px;font-weight:800;letter-spacing:1px;color:#fff4e488}.mode-switch button+button{padding-left:22px;border-left:1px solid #fff4e428}.mode-switch button span{display:block;font-size:7px;letter-spacing:1.7px;font-weight:400;margin-top:7px}.mode-switch button.selected{color:var(--cream)}.mode-switch button.selected:after{content:"";position:absolute;left:0;right:21px;bottom:-1px;height:2px;background:var(--red)}.mode-switch button+button.selected:after{left:22px;right:0}.primary{display:flex;align-items:center;justify-content:space-between;width:100%;height:60px;padding:0 23px;background:var(--red);color:#fff2df;font-weight:900;font-size:14px;letter-spacing:1.3px;border-radius:2px;box-shadow:0 8px 28px #ff493e16}.primary>span{font-size:30px;font-weight:400;line-height:1}.quick-guide{display:flex;justify-content:space-between;margin-top:17px;font-size:7px;letter-spacing:1.05px}.quick-guide b{color:#ff9682;font-size:8px;margin-right:6px}.credit{display:flex;justify-content:space-between;font-size:5.7px;letter-spacing:1px;color:#fff4e479;margin:23px 0 0}.credit span{letter-spacing:.5px}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.stats{position:absolute;top:max(96px,calc(env(safe-area-inset-top) + 76px));left:var(--edge);right:var(--edge);display:flex;justify-content:space-between}.speed{position:relative;display:flex;align-items:baseline;gap:6px}.speed>span{font-family:Impact,Arial Narrow,sans-serif;font-size:58px;font-weight:900;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums}.speed>small{font-size:8px;font-weight:700;letter-spacing:1px;opacity:.8}.speed-track{position:absolute;left:0;bottom:-9px;width:108px;height:2px;background:#ffffff35}.speed-track i{display:block;width:35%;height:100%;background:var(--red);transition:width .2s}.run-info{text-align:right;display:flex;flex-direction:column;gap:7px}.run-info>span{font-size:8px;letter-spacing:1.6px;color:#fff2e2bf}.run-info strong{font-size:23px;font-weight:500;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.run-info small{font-size:8px;letter-spacing:1px}.run-info #score{color:#b8f1e0;font-size:9px}.district{position:absolute;top:max(187px,calc(env(safe-area-inset-top) + 167px));left:var(--edge);display:flex;gap:6px;align-items:center;font-size:7px;letter-spacing:1.1px}.district i{width:4px;height:4px;background:var(--red);border-radius:100%}.district small{font-size:6px;opacity:.55;margin-left:7px;letter-spacing:.6px}#toast{position:absolute;top:31%;left:15px;right:15px;text-align:center;opacity:0;transform:translateY(10px);transition:.22s;text-shadow:0 2px 18px #142c3b}#toast.show{opacity:1;transform:translateY(0)}#toast strong{display:block;font-size:28px;font-style:italic;font-weight:900;letter-spacing:-1px}#toast span{display:block;font-size:8px;letter-spacing:2px;margin-top:7px;color:#b2ffed}#combo{position:absolute;right:var(--edge);top:230px;font-size:8px;letter-spacing:2px;color:#9bf4dc}#combo b{font-size:28px;letter-spacing:-1px;margin-left:4px}#tutorial{position:absolute;left:25px;right:25px;bottom:240px;text-align:center;transition:opacity .3s;text-shadow:0 2px 12px #152a3b}.hint-step{display:block;color:#ffc1a0;font-size:7px;letter-spacing:2px;margin-bottom:8px}#tutorial strong{display:block;font-size:13px;font-weight:600}#tutorial small{display:block;font-size:9px;opacity:.8;margin-top:7px;line-height:1.5}#swing-state{position:absolute;left:0;right:0;bottom:213px;display:flex;gap:7px;justify-content:center;align-items:center;font-size:7px;font-weight:700;letter-spacing:2px}#swing-state i{width:4px;height:4px;border-radius:50%;background:#ff9279}#swing-state.attached{color:#acffe9}#swing-state.attached i{background:#acffe9}#controls{position:absolute;bottom:max(47px,calc(env(safe-area-inset-bottom) + 32px));left:var(--edge);right:var(--edge);display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}.left-controls{display:flex;flex-direction:column;gap:13px}#steer{width:130px;height:56px;touch-action:none;pointer-events:auto;text-align:center;color:#fff4e49c;padding:8px 0}.steer-arrows{display:flex;justify-content:space-between;align-items:center;font-size:23px;line-height:1}.steer-arrows i{display:block;width:48px;height:3px;border-radius:3px;background:#fff4e438;position:relative}.steer-arrows i:after{content:"";position:absolute;width:15px;height:3px;left:calc(50% - 7px + var(--steer,0px));background:#fff4e4}#steer small{display:block;font-size:6px;letter-spacing:1.5px;margin-top:8px}#dive{width:89px;height:67px;margin-left:20px;background:#243a494f;border:1px solid #fff4e454;border-radius:35px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;touch-action:none;pointer-events:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#dive svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.7}#dive span{font-size:8px;letter-spacing:1.6px;font-weight:700}#dive.active{color:#ffb38b;border-color:#ffb38b;background:#b761392e}#swing{width:143px;height:143px;border-radius:50%;border:1px solid #ffb7a08c;outline:1px solid #fff4e425;outline-offset:7px;background:linear-gradient(135deg,#f85947d9,#d62c32e8);box-shadow:0 5px 45px #c542351d,inset 0 0 25px #ffc5a226;display:flex;flex-direction:column;align-items:center;justify-content:center;touch-action:none;pointer-events:auto;transition:background .12s,transform .12s}#swing svg{width:40px;height:40px;margin-bottom:4px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round}#swing strong{font-size:12px;letter-spacing:2px;margin-top:2px}#swing small{font-size:5.5px;letter-spacing:1.2px;margin-top:7px;opacity:.7}#swing.active{transform:scale(.93);background:linear-gradient(135deg,#ffb08fe8,#ee6543f0);box-shadow:0 0 44px #ff8c5735}#swing.active svg{transform:rotate(-8deg)}.bottom-caption{position:absolute;bottom:max(17px,env(safe-area-inset-bottom));left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;font-size:6px;letter-spacing:1.3px;color:#fff4e484}.modal{position:fixed;z-index:10;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:25px;background:#162c42a8;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);overflow:auto;touch-action:pan-y}.modal-card{width:100%;max-width:350px;padding:25px 0}.eyebrow{font-size:8px;letter-spacing:2px;color:#ffac8f}h2{font-family:Impact,Arial Narrow,sans-serif;font-size:77px;line-height:.85;letter-spacing:-2px;margin:24px 0;color:var(--cream)}.modal-card p{font-size:13px;line-height:1.6;color:#fff4e4b5}.modal-card .keyboard{font-size:10px;color:#fff4e470;margin-bottom:25px}.secondary{margin-top:11px;height:49px;width:100%;background:#fff4e40b;border:1px solid #fff4e435;font-size:10px;font-weight:700;letter-spacing:1px}.text-button{display:block;margin:10px auto 0;padding:18px;background:transparent;font-size:8px;letter-spacing:1.5px;color:#fff4e494}#result-score{font-size:42px;letter-spacing:-2px;color:#aaf5dc;margin:20px 0}#result-score small{font-size:10px;letter-spacing:1px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:25px 0 35px}.result-grid span{display:block;font-size:7px;letter-spacing:1.3px;opacity:.5}.result-grid strong{display:block;font-size:23px;margin-top:8px;font-weight:500}.result-grid strong small{font-size:10px}#flash{position:fixed;z-index:7;top:0;right:0;bottom:0;left:0;pointer-events:none;box-shadow:inset 0 0 100px #9dffdf00;transition:box-shadow .2s}#flash.active{box-shadow:inset 0 0 90px #acffdb55}#speed-lines{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;background:repeating-conic-gradient(from 15deg at 50% 43%,transparent 0deg 9.8deg,#fff2dc42 10deg 10.07deg,transparent 10.3deg 30deg);-webkit-mask-image:radial-gradient(ellipse at 50% 43%,transparent 35%,#000 95%);mask-image:radial-gradient(ellipse at 50% 43%,transparent 35%,#000 95%)}@media (min-width:700px){:root{--edge:40px}#menu{max-width:480px;padding-left:40px}.edition{margin-top:130px}h1{font-size:116px}.menu-bottom{padding-bottom:30px}.stats{right:40px}#controls{left:40px;right:40px}#steer{width:160px}.credit{font-size:6px}#tutorial{bottom:225px}.district{font-size:9px}.district small{font-size:7px}}@media (max-height:720px){.edition{margin-top:85px}h1{font-size:88px;margin-top:14px}.tagline{font-size:15px;margin-bottom:12px}.menu-bottom{padding-bottom:14px}.mode-switch button{padding-top:10px;padding-bottom:10px}.primary{height:53px}.quick-guide{margin-top:12px}.credit{margin-top:15px}#swing{width:121px;height:121px}#controls{bottom:38px}#swing-state{bottom:180px}#tutorial{bottom:207px}.stats{top:86px}.district{top:170px}#combo{top:205px}}@media (max-width:350px){:root{--edge:18px}h1{font-size:77px}h1 i{left:190px;font-size:75px}.edition{font-size:5.7px}.credit{font-size:4.8px}.quick-guide{font-size:6px}#swing{width:116px;height:116px}#steer{width:120px}#tutorial strong{font-size:11px}.district small{font-size:5px}}@media (orientation:landscape) and (max-height:550px){.edition{display:none}h1{font-size:65px;margin-top:90px}h1 i{font-size:60px;left:177px}#menu{max-width:none}.menu-bottom{position:absolute;right:28px;bottom:13px;width:270px}.tagline{display:none}.credit{margin-top:10px}#swing{width:105px;height:105px}#tutorial{bottom:90px;left:170px;right:170px}#swing-state{bottom:56px}.district{display:none}.stats{top:82px}.speed>span{font-size:39px}.modal-card{max-width:600px}h2{font-size:46px}.modal-card .keyboard{margin-bottom:10px}.modal-card{padding:8px 0}.modal-card p{font-size:11px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}#speed-lines{display:none!important}}#steer{height:92px;padding:0;width:124px}.joystick-base{display:block;position:relative;width:70px;height:70px;border-radius:50%;border:1px solid #fff4e446;background:#243a493f;margin:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.joystick-base:before,.joystick-base:after{content:"";position:absolute;background:#fff4e428;left:50%;top:9px;width:1px;height:50px}.joystick-base:after{transform:rotate(90deg)}.joystick-base i{position:absolute;left:calc(50% - 12px + var(--steer,0px));top:calc(50% - 12px + var(--move,0px));width:24px;height:24px;border-radius:50%;background:#fff0dbb3;box-shadow:0 1px 12px #152d3a66}.left-controls{gap:10px}#tutorial{bottom:251px}#swing-state{bottom:215px}#combo{left:var(--edge);right:auto;top:220px}#map-button{position:absolute;right:var(--edge);top:203px;width:96px;padding:0;border:1px solid #fff4e442;border-radius:9px;overflow:hidden;background:#172f40;pointer-events:auto;box-shadow:0 4px 20px #10263230}#minimap{display:block;width:96px;height:96px}#heading{display:block;padding:5px;font-size:7px;letter-spacing:1.2px;color:#fff4e4bd;background:#172f40}#toast{top:37%}#waypoint{position:absolute;left:var(--edge);top:209px;font-size:7px;letter-spacing:.7px;color:#aaf5dc;max-width:220px;text-shadow:0 2px 4px #203743}.map-title{font-size:45px;margin:18px 0}#city-map{display:block;width:100%;aspect-ratio:1;border-radius:8px;border:1px solid #fff4e433}.map-hint{font-size:10px!important;margin:12px 0!important}#destinations{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0 18px}.destination{background:#fff4e40c;border:1px solid #fff4e42a;padding:10px 7px;font-size:7px;letter-spacing:.35px;text-align:left;min-height:44px}#map-panel .modal-card{max-width:330px}@media (max-height:720px){#steer{height:76px}.joystick-base{width:56px;height:56px}.joystick-base:before,.joystick-base:after{top:7px;height:40px}#swing-state{bottom:188px}#tutorial{bottom:215px}#map-button{top:181px;width:76px}#minimap{width:76px;height:76px}#waypoint{top:185px;max-width:195px;font-size:6px}#combo{top:208px}#city-map{max-width:230px;margin:auto}#map-panel .modal-card{padding:5px 0}.map-title{font-size:34px;margin:12px 0}#destinations{gap:4px;margin-bottom:10px}.destination{padding:7px;min-height:44px}}@media (orientation:landscape) and (max-height:550px){#map-button{top:170px;right:20px;width:67px}#minimap{width:67px;height:67px}#waypoint{top:145px}#tutorial{bottom:80px}#swing-state{bottom:52px}#city-map{max-width:160px}#map-panel .modal-card{max-width:480px}#map-panel #destinations{grid-template-columns:repeat(3,1fr)}#map-panel .map-title{font-size:25px;margin:5px 0}#map-panel .primary{height:36px}}