:root{--u: 1px;--ink: #23262b;--red: #e5322b;--yellow: #f2bd1d;--blue: #2f6fd0;--green: #1fa45a;--cream: #fbf6ea;--font: "Nunito", "Arial Rounded MT Bold", "Varela Round", "Segoe UI Black", "Arial Black", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#17120d;font-family:var(--font);-webkit-font-smoothing:antialiased}#stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);overflow:hidden;background:#d9c7ad}#gl{position:absolute;inset:0;width:100%;height:100%;display:block}.ui{position:absolute;inset:0;pointer-events:none;color:var(--cream)}kbd{display:inline-block;font-family:var(--font);font-weight:900;font-size:.85em;padding:.12em .45em .18em;border-radius:.45em;background:var(--cream);color:var(--ink);box-shadow:inset 0 -.18em #0000002e,0 .12em #00000059;margin:0 .1em}.hud{position:absolute;inset:0;opacity:.001;transition:opacity .45s}.hud.show{opacity:1}.badge{position:absolute;font-weight:900;color:#fff;padding:calc(var(--u) * 10) calc(var(--u) * 26) calc(var(--u) * 14);border-radius:calc(var(--u) * 28);border:calc(var(--u) * 5) solid #fff;box-shadow:inset 0 calc(var(--u) * -9) 0 #0000002e,inset 0 calc(var(--u) * 7) 0 #ffffff47,0 calc(var(--u) * 7) 0 #00000047,0 calc(var(--u) * 14) calc(var(--u) * 24) #00000040;text-shadow:0 calc(var(--u) * 4) 0 rgba(0,0,0,.28);line-height:1;white-space:nowrap}.pos{left:calc(var(--u) * 40);top:calc(var(--u) * 36);background:var(--red);transform-origin:30% 50%}.pos .pos-num{font-size:calc(var(--u) * 96)}.pos .pos-suf{font-size:calc(var(--u) * 44);vertical-align:top;margin-left:calc(var(--u) * 2)}.pos .pos-of{font-size:calc(var(--u) * 36);opacity:.8;margin-left:calc(var(--u) * 8)}.pos.bump{animation:bump .45s cubic-bezier(.3,1.8,.5,1)}@keyframes bump{0%{transform:scale(1)}35%{transform:scale(1.22) rotate(-4deg)}to{transform:scale(1)}}.lap{left:50%;top:calc(var(--u) * 36);transform:translate(-50%);background:var(--blue)}.lap .lap-lbl{font-size:calc(var(--u) * 34);margin-right:calc(var(--u) * 12);letter-spacing:calc(var(--u) * 2)}.lap .lap-num{font-size:calc(var(--u) * 64)}.lap .lap-of{font-size:calc(var(--u) * 38);opacity:.85}.timer{right:calc(var(--u) * 40);top:calc(var(--u) * 36);background:var(--yellow);color:var(--ink);text-shadow:0 calc(var(--u) * 3) 0 rgba(255,255,255,.4)}.timer .time{font-size:calc(var(--u) * 54);font-variant-numeric:tabular-nums}.timer .clock{display:inline-block;width:calc(var(--u) * 40);height:calc(var(--u) * 40);border-radius:50%;border:calc(var(--u) * 6) solid var(--ink);margin-right:calc(var(--u) * 14);vertical-align:calc(var(--u) * -4);position:relative}.timer .clock:after{content:"";position:absolute;left:42%;top:12%;width:16%;height:42%;background:var(--ink);border-radius:4px}.boost{position:absolute;left:calc(var(--u) * 40);bottom:calc(var(--u) * 44);width:calc(var(--u) * 430)}.boost-lbl{font-weight:900;font-size:calc(var(--u) * 34);color:#fff;letter-spacing:calc(var(--u) * 3);text-shadow:0 calc(var(--u) * 4) 0 rgba(0,0,0,.35),0 0 calc(var(--u) * 10) rgba(0,0,0,.3);margin:0 0 calc(var(--u) * 8) calc(var(--u) * 10)}.boost-tube{position:relative;height:calc(var(--u) * 46);border-radius:calc(var(--u) * 26);border:calc(var(--u) * 5) solid #fff;background:#1e22288c;overflow:hidden;box-shadow:0 calc(var(--u) * 6) 0 #00000047,inset 0 calc(var(--u) * 5) calc(var(--u) * 6) #00000059}.boost-fill{position:absolute;inset:0;transform-origin:0 50%;background:repeating-linear-gradient(-45deg,#ffb21f 0 calc(var(--u) * 18),#ff8a1a calc(var(--u) * 18) calc(var(--u) * 36));border-radius:calc(var(--u) * 20);transition:transform .08s linear}.boost.active .boost-fill{background:repeating-linear-gradient(-45deg,#fff06a 0 calc(var(--u) * 18),#ffb21f calc(var(--u) * 18) calc(var(--u) * 36));animation:stripes .35s linear infinite;background-size:calc(var(--u) * 51) calc(var(--u) * 51)}.boost.active .boost-tube{box-shadow:0 calc(var(--u) * 6) 0 #00000047,0 0 calc(var(--u) * 24) #ffd650e6}.boost.full .boost-lbl:after{content:" READY!";color:#fff06a}@keyframes stripes{0%{background-position:0 0}to{background-position:calc(var(--u) * 51) 0}}.boost-shine{position:absolute;left:4%;right:4%;top:12%;height:24%;border-radius:99px;background:#fff6}.minimap{position:absolute;right:calc(var(--u) * 40);bottom:calc(var(--u) * 40);width:calc(var(--u) * 390);height:calc(var(--u) * 273);border-radius:calc(var(--u) * 26);border:calc(var(--u) * 6) solid #fff;overflow:hidden;background:#2c5ca6;box-shadow:0 calc(var(--u) * 7) 0 #00000047,0 calc(var(--u) * 16) calc(var(--u) * 28) #0000004d;transform:rotate(-1.5deg)}.minimap canvas{width:100%;height:100%;display:block}.minimap:after{content:"";position:absolute;inset:calc(var(--u) * 7);border:calc(var(--u) * 3) dashed rgba(255,255,255,.6);border-radius:calc(var(--u) * 18);pointer-events:none}.wrongway{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%) scale(.6);font-weight:900;font-size:calc(var(--u) * 70);color:#fff;background:var(--red);padding:calc(var(--u) * 10) calc(var(--u) * 34);border-radius:calc(var(--u) * 24);border:calc(var(--u) * 6) solid #fff;opacity:0;transition:all .25s}.wrongway.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.countdown,.banner{position:absolute;left:0;right:0;top:36%;text-align:center;opacity:.001;will-change:transform,opacity}.countdown span,.banner span{display:inline-block;font-weight:900;font-size:calc(var(--u) * 210);color:#fff;-webkit-text-stroke:calc(var(--u) * 12) var(--ink);paint-order:stroke fill;text-shadow:0 calc(var(--u) * 14) 0 rgba(0,0,0,.3)}.countdown.show{animation:count .8s cubic-bezier(.2,1.6,.4,1) forwards}.countdown.go span{color:var(--yellow)}@keyframes count{0%{opacity:.001;transform:scale(2.2)}25%{opacity:1;transform:scale(.9)}45%{transform:scale(1.05)}75%{opacity:1;transform:scale(1)}to{opacity:.001;transform:scale(.8)}}.banner span{font-size:calc(var(--u) * 150);color:var(--yellow)}.banner.show{animation:banner 2.4s cubic-bezier(.2,1.5,.4,1) forwards}@keyframes banner{0%{opacity:.001;transform:scale(.3) rotate(-8deg)}18%{opacity:1;transform:scale(1.1) rotate(2deg)}30%{transform:scale(1) rotate(0)}85%{opacity:1}to{opacity:.001;transform:scale(1.05)}}.title-screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .5s;text-align:center}.title-screen.show{opacity:1}.title-screen:not(.show){visibility:hidden;transition:opacity .5s,visibility 0s linear .5s}.title-screen:not(.show) *{animation-play-state:paused}.logo{display:flex;gap:calc(var(--u) * 10);margin-bottom:calc(var(--u) * 18)}.logo b{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--u) * 116);height:calc(var(--u) * 128);font-size:calc(var(--u) * 96);font-weight:900;color:#fff;background:var(--c);border-radius:calc(var(--u) * 22);border:calc(var(--u) * 6) solid #fff;transform:rotate(var(--r));box-shadow:inset 0 calc(var(--u) * -12) 0 #0003,inset 0 calc(var(--u) * 8) 0 #ffffff4d,0 calc(var(--u) * 10) 0 #0000004d,0 calc(var(--u) * 20) calc(var(--u) * 30) #0000004d;text-shadow:0 calc(var(--u) * 5) 0 rgba(0,0,0,.3);animation:float 3s ease-in-out infinite}.logo b:nth-child(odd){animation-delay:-1.5s}.logo .gap{width:calc(var(--u) * 34)}@keyframes float{0%,to{translate:0 0}50%{translate:0 calc(var(--u) * -10)}}.tagline{font-size:calc(var(--u) * 40);font-weight:900;color:#fff;-webkit-text-stroke:calc(var(--u) * 7) var(--ink);paint-order:stroke fill;margin-bottom:calc(var(--u) * 40)}.menu{display:flex;gap:calc(var(--u) * 30);margin-bottom:calc(var(--u) * 34)}.key-btn{font-size:calc(var(--u) * 40);font-weight:900;color:#fff;background:var(--green);border:calc(var(--u) * 6) solid #fff;border-radius:calc(var(--u) * 26);padding:calc(var(--u) * 16) calc(var(--u) * 34) calc(var(--u) * 22);box-shadow:inset 0 calc(var(--u) * -10) 0 #0003,0 calc(var(--u) * 9) 0 #0000004d;animation:pulse 1.6s ease-in-out infinite}.key-btn.alt{background:var(--blue);animation-delay:-.8s}.title-screen.show .key-btn{pointer-events:auto;cursor:pointer}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.controls{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--u) * 12) calc(var(--u) * 26);max-width:calc(var(--u) * 1300);font-size:calc(var(--u) * 26);font-weight:900;color:#fff;background:#23262bb8;border-radius:calc(var(--u) * 24);padding:calc(var(--u) * 16) calc(var(--u) * 30)}.results{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.9);min-width:calc(var(--u) * 760);background:var(--cream);color:var(--ink);border:calc(var(--u) * 8) solid #fff;border-radius:calc(var(--u) * 40);padding:calc(var(--u) * 30) calc(var(--u) * 50) calc(var(--u) * 36);box-shadow:inset 0 calc(var(--u) * -14) 0 #00000014,0 calc(var(--u) * 14) 0 #0000004d,0 calc(var(--u) * 30) calc(var(--u) * 60) #00000059;text-align:center;opacity:0;transition:all .4s cubic-bezier(.2,1.5,.4,1)}.results.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.res-title{font-size:calc(var(--u) * 92);font-weight:900;color:var(--red);-webkit-text-stroke:calc(var(--u) * 4) #fff;paint-order:stroke fill;line-height:1}.res-place{font-size:calc(var(--u) * 36);font-weight:900;margin:calc(var(--u) * 10) 0 calc(var(--u) * 20)}.res-table{width:100%;border-collapse:separate;border-spacing:0 calc(var(--u) * 8);font-size:calc(var(--u) * 34);font-weight:900}.res-table td{padding:calc(var(--u) * 8) calc(var(--u) * 18);background:#efe6d2;text-align:left}.res-table td:first-child{border-radius:calc(var(--u) * 18) 0 0 calc(var(--u) * 18);width:calc(var(--u) * 60);text-align:center}.res-table td:last-child{border-radius:0 calc(var(--u) * 18) calc(var(--u) * 18) 0;text-align:right;font-variant-numeric:tabular-nums}.res-table tr.me td{background:var(--yellow)}.res-table i{display:inline-block;width:calc(var(--u) * 26);height:calc(var(--u) * 26);border-radius:50%;border:calc(var(--u) * 4) solid #fff;margin-right:calc(var(--u) * 14);vertical-align:calc(var(--u) * -3);box-shadow:0 0 0 calc(var(--u) * 2) #0003}.res-keys{margin-top:calc(var(--u) * 22);font-size:calc(var(--u) * 28);font-weight:900}.hint{position:absolute;left:50%;bottom:calc(var(--u) * 46);transform:translate(-50%);font-size:calc(var(--u) * 24);font-weight:900;color:#fff;white-space:nowrap;background:#23262ba6;border-radius:calc(var(--u) * 20);padding:calc(var(--u) * 10) calc(var(--u) * 24);opacity:.001;transition:opacity .6s;will-change:opacity}.hint.show{opacity:1}.vertical .pos{left:calc(var(--u) * 44);top:calc(var(--u) * 150)}.vertical .lap{left:auto;right:calc(var(--u) * 44);top:calc(var(--u) * 150);transform:none}.vertical .timer{left:calc(var(--u) * 44);right:auto;top:calc(var(--u) * 300)}.vertical .minimap{right:calc(var(--u) * 44);bottom:auto;top:calc(var(--u) * 290);width:calc(var(--u) * 390);height:calc(var(--u) * 273)}.vertical .boost{left:50%;transform:translate(-50%);bottom:calc(var(--u) * 300);width:calc(var(--u) * 700)}.vertical .hint{bottom:calc(var(--u) * 210);white-space:normal;width:calc(var(--u) * 900);text-align:center}.vertical .logo{flex-wrap:wrap;justify-content:center;max-width:calc(var(--u) * 760);row-gap:calc(var(--u) * 20)}.vertical .logo .gap{width:100%;height:0}.vertical .menu{flex-direction:column}.vertical .controls{max-width:calc(var(--u) * 900)}.vertical .results{min-width:calc(var(--u) * 900)}.vertical .countdown,.vertical .banner{top:40%}.fps{position:absolute;left:8px;bottom:8px;color:#fff;font:700 13px/1 monospace;background:#00000080;padding:4px 6px;border-radius:4px;display:none}.fps.show{display:block}.key-btn.car{background:var(--red);animation-delay:-1.6s}.menu-skins{margin-top:calc(var(--u) * -14)}.menu-skins .key-btn{font-size:calc(var(--u) * 36);padding:calc(var(--u) * 10) calc(var(--u) * 44)}.results.show [data-key]{pointer-events:auto;cursor:pointer}html,body,#stage{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.touch-ui{display:none;position:absolute;inset:0;pointer-events:none}.touch.racing .touch-ui{display:block}.t-btn{position:absolute;border-radius:50%;border:calc(var(--u) * 6) solid #fff;color:#fff;font-family:var(--font);font-weight:900;font-size:calc(var(--u) * 42);padding:0;pointer-events:auto;touch-action:none;box-shadow:inset 0 calc(var(--u) * -10) 0 #0003,0 calc(var(--u) * 8) 0 #0000004d}.t-btn.down{transform:translateY(calc(var(--u) * 6)) scale(.96);filter:brightness(1.2)}.t-boost{right:calc(var(--u) * 50);bottom:calc(var(--u) * 260);width:calc(var(--u) * 240);height:calc(var(--u) * 240);background:#ff8a1a}.t-jump{right:calc(var(--u) * 320);bottom:calc(var(--u) * 60);width:calc(var(--u) * 220);height:calc(var(--u) * 220);background:var(--blue)}.t-reset{right:calc(var(--u) * 90);bottom:calc(var(--u) * 70);width:calc(var(--u) * 140);height:calc(var(--u) * 140);background:#23262bcc;font-size:calc(var(--u) * 80);line-height:1}.touch .hint,.touch .controls{display:none}.touch .boost{left:50%;transform:translate(-50%);bottom:calc(var(--u) * 26);width:calc(var(--u) * 480)}.touch .boost-lbl{display:none}.touch .minimap{bottom:auto;top:calc(var(--u) * 170);right:calc(var(--u) * 40);width:calc(var(--u) * 300);height:calc(var(--u) * 210)}.touch.vertical .boost{bottom:calc(var(--u) * 30);width:calc(var(--u) * 700)}.touch.vertical .minimap{top:calc(var(--u) * 300)}.touch.vertical .t-boost{bottom:calc(var(--u) * 330)}.touch.vertical .t-jump{bottom:calc(var(--u) * 110);right:calc(var(--u) * 290)}.touch.vertical .t-reset{bottom:calc(var(--u) * 130);right:calc(var(--u) * 70)}.garage{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s}.garage.show{opacity:1;visibility:visible}.gar-title{position:absolute;top:calc(var(--u) * 36);left:0;right:0;text-align:center;font-weight:900;font-size:calc(var(--u) * 84);color:#fff;letter-spacing:calc(var(--u) * 6);text-shadow:0 calc(var(--u) * 6) 0 rgba(0,0,0,.35)}.gar-panel{position:absolute;left:50%;bottom:calc(var(--u) * 30);transform:translate(-50%);width:calc(var(--u) * 1180);max-width:96%;padding:calc(var(--u) * 22) calc(var(--u) * 30);display:flex;flex-direction:column;gap:calc(var(--u) * 16);background:#1e2126d1;border:calc(var(--u) * 5) solid #fff;border-radius:calc(var(--u) * 32)}.gar-row{display:flex;gap:calc(var(--u) * 12);justify-content:center;flex-wrap:wrap}.garage.show button,.garage.show .gar-done{pointer-events:auto;cursor:pointer}.gar-kinds button,.gar-models button,.gar-done{font-family:var(--font);font-weight:900;font-size:calc(var(--u) * 34);color:var(--ink);background:var(--cream);border:calc(var(--u) * 4) solid transparent;border-radius:calc(var(--u) * 18);padding:calc(var(--u) * 8) calc(var(--u) * 30)}.gar-kinds button.on,.gar-models button.on{background:var(--yellow);border-color:#fff}.gar-colors button{width:calc(var(--u) * 70);height:calc(var(--u) * 70);padding:0;border-radius:calc(var(--u) * 18);border:calc(var(--u) * 5) solid rgba(255,255,255,.35)}.gar-colors button.on{border-color:#fff;transform:scale(1.14);box-shadow:0 0 0 calc(var(--u) * 4) var(--yellow)}.gar-foot{display:flex;align-items:center;justify-content:space-between;color:#fff;font-weight:800;font-size:calc(var(--u) * 26)}.gar-done{background:var(--green);color:#fff;padding:calc(var(--u) * 8) calc(var(--u) * 60);margin-left:auto}.touch .gar-help{display:none}.vertical .gar-panel{width:calc(var(--u) * 1020)}.vertical .gar-colors button{width:calc(var(--u) * 92);height:calc(var(--u) * 92)}.vertical .gar-title{top:calc(var(--u) * 200)}.sound-btn{position:absolute;right:calc(var(--u) * 30);top:calc(var(--u) * 30);padding:calc(var(--u) * 8) calc(var(--u) * 22);border-radius:calc(var(--u) * 20);background:#1e2126b8;color:#fff;font-weight:900;font-size:calc(var(--u) * 30)}.title-screen.show .sound-btn{pointer-events:auto;cursor:pointer}.touch .sound-btn kbd,.touch .key-btn kbd{display:none}.maps{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s}.maps.show{opacity:1;visibility:visible}.maps.show button,.maps.show .gar-done{pointer-events:auto;cursor:pointer}.maps-list button{font-family:var(--font);font-weight:900;font-size:calc(var(--u) * 34);color:var(--ink);background:var(--cream);border:calc(var(--u) * 4) solid transparent;border-radius:calc(var(--u) * 18);padding:calc(var(--u) * 10) calc(var(--u) * 28)}.maps-list button.on{background:var(--yellow);border-color:#fff}.key-btn.maps-btn{background:var(--blue);animation-delay:-2.2s}.maps .maps-back{background:var(--cream);color:var(--ink);margin-left:auto}.maps .maps-use{margin-left:calc(var(--u) * 14)}button.rnd,button.rnd.on{background:linear-gradient(100deg,#e5322b,#f08a24,#f2bd1d,#1fa45a,#2f6fd0,#8a3fd1)!important;color:#fff!important;text-shadow:0 calc(var(--u) * 3) 0 rgba(0,0,0,.4)}button.rnd.on{border-color:#fff!important;box-shadow:0 0 0 calc(var(--u) * 4) #fff}.menu:not(.menu-skins) .key-btn{font-size:calc(var(--u) * 62);padding:calc(var(--u) * 20) calc(var(--u) * 96)}.t-stick{position:absolute;left:calc(var(--u) * 30);bottom:calc(var(--u) * 30);width:calc(var(--u) * 470);height:calc(var(--u) * 470);pointer-events:auto;touch-action:none}.t-stick-base{position:absolute;inset:12%;border-radius:50%;background:#23262b80;border:calc(var(--u) * 6) solid rgba(255,255,255,.85)}.t-knob{position:absolute;left:32%;top:32%;width:36%;height:36%;border-radius:50%;background:radial-gradient(circle at 38% 32%,#ff7a70,var(--red) 62%,#b3201b);border:calc(var(--u) * 6) solid #fff;box-shadow:0 calc(var(--u) * 8) calc(var(--u) * 12) #00000059;transition:transform .14s ease-out}.t-knob.held{transition:none}.touch.vertical .t-stick{bottom:calc(var(--u) * 90)}.t-menu{top:calc(var(--u) * 30);right:calc(var(--u) * 30);width:calc(var(--u) * 104);height:calc(var(--u) * 104);background:#23262bcc;font-size:calc(var(--u) * 54);line-height:1}.touch .timer{right:calc(var(--u) * 160)}.touch.vertical .t-menu{top:calc(var(--u) * 30);right:calc(var(--u) * 44)}.touch.vertical .timer{right:auto}.ui{inset:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}.touch .menu:not(.menu-skins) .key-btn{font-size:calc(var(--u) * 92);padding:calc(var(--u) * 26) calc(var(--u) * 130)}.touch .menu-skins{margin-top:calc(var(--u) * -6);gap:calc(var(--u) * 40)}.touch .menu-skins .key-btn{font-size:calc(var(--u) * 66);padding:calc(var(--u) * 20) calc(var(--u) * 76)}.touch .sound-btn{font-size:calc(var(--u) * 44);padding:calc(var(--u) * 14) calc(var(--u) * 32)}.touch .gar-kinds button,.touch .gar-models button,.touch .maps-list button,.touch .gar-done{font-size:calc(var(--u) * 50);padding:calc(var(--u) * 16) calc(var(--u) * 40)}.touch .gar-colors button{width:calc(var(--u) * 104);height:calc(var(--u) * 104)}.touch .gar-panel{width:calc(var(--u) * 1500);padding:calc(var(--u) * 18) calc(var(--u) * 24);gap:calc(var(--u) * 14)}.touch.vertical .gar-panel{width:calc(var(--u) * 1040)}.touch .results [data-key]{font-size:calc(var(--u) * 46);padding:calc(var(--u) * 10);display:inline-block}
