:root{font-family:Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow:hidden}canvas{width:100vw;height:100vh;display:block}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.touch-controls{position:fixed;bottom:0;left:0;width:100%;height:180px;pointer-events:none;z-index:100;display:block}.control-group{position:absolute;bottom:20px;display:flex;flex-direction:column;gap:15px}.control-group.left{left:20px;flex-direction:row;gap:20px}.control-group.right{right:20px;gap:20px}.control-button{width:80px;height:80px;border-radius:50%;background-color:#00000080;border:3px solid rgba(255,255,255,.7);display:flex;justify-content:center;align-items:center;pointer-events:auto;cursor:pointer;box-shadow:0 4px 8px #0000004d;transition:transform .1s,background-color .1s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.control-button:active{background-color:#000c;transform:scale(.95);border-color:#ffffffe6}.control-button svg{width:40px;height:40px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}@media (max-width: 480px){.touch-controls{height:160px}.control-group{bottom:15px}.control-group.left{left:15px;bottom:15px;gap:15px}.control-group.right{right:15px;gap:15px}.control-button{width:65px;height:65px;border-width:2px}.control-button svg{width:30px;height:30px}}@media (max-height: 480px) and (orientation: landscape){.touch-controls{height:120px}.control-group{bottom:10px}.control-group.left{left:10px;gap:10px}.control-group.right{right:10px;gap:10px}.control-button{width:55px;height:55px;border-width:2px}.control-button svg{width:25px;height:25px}}@media (min-width: 768px) and (max-width: 1024px){.control-group{bottom:30px}.control-group.left{left:30px}.control-group.right{right:30px}.control-button{width:90px;height:90px}.control-button svg{width:45px;height:45px}}@media (min-width: 768px){.control-group{bottom:40px}.control-group.left{left:40px}.control-group.right{right:40px}.control-button{width:100px;height:100px}.control-button svg{width:50px;height:50px}}.game-container{position:relative;width:100vw;height:100vh;overflow:hidden;font-family:Comic Sans MS,Chalkboard SE,sans-serif}.pause-overlay,.character-select-overlay,.track-select-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:100}.pause-menu,.character-select,.track-select{background-color:#191919e6;padding:2rem;border-radius:10px;display:flex;flex-direction:column;gap:1rem;text-align:center}.pause-menu h2,.character-select h2,.track-select h2{color:#fff;margin-bottom:1rem;font-size:2rem}.pause-menu button{padding:.8rem 1.5rem;font-size:1rem;background-color:#4a8fe7;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:all .2s}.pause-menu button:hover{background-color:#3a7fd7;transform:scale(1.05)}.character-select{min-width:400px}.character-options{display:flex;justify-content:center;gap:2rem;margin-top:1rem}.character-option{display:flex;flex-direction:column;align-items:center;padding:1rem;background-color:#00000080;border-radius:10px;cursor:pointer;transition:all .3s;width:200px}.character-option.selected{background-color:#4caf504d;box-shadow:0 0 20px #4caf5080;transform:scale(1.05)}.character-option:hover{background-color:#4caf5033;transform:scale(1.03)}.character-preview{width:180px;height:180px;border-radius:50%;margin-bottom:1rem;background-color:#0000004d;overflow:hidden;position:relative;box-shadow:0 0 15px #00000080}.character-preview-canvas{position:absolute;top:0;left:0;width:100%;height:100%}.character-option span{font-size:1.2rem;font-weight:700;color:#fff}.track-select{min-width:500px;max-width:800px}.track-options{display:flex;flex-wrap:wrap;justify-content:space-around;gap:1rem;padding:1rem 0}.track-option{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;border-radius:10px;cursor:pointer;transition:all .2s;width:150px}.track-option:hover{background-color:#ffffff1a;transform:scale(1.05)}.track-option.selected{background-color:#4a8fe74d;border:2px solid #4a8fe7}.track-image{width:120px;height:80px;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.2)}.track-color{position:absolute;width:70%;height:40%;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:20px}.track-option span{color:#fff;font-size:1.2rem;font-weight:700}.settings-menu{background-color:#000000d9;padding:2rem;border-radius:10px;display:flex;flex-direction:column;align-items:center;min-width:300px}.settings-menu h2{font-size:2rem;margin-bottom:1.5rem;color:#fff}.settings-menu button{margin-top:1.5rem}.setting-option{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:1rem;padding:.5rem;border-radius:5px;background-color:#ffffff1a}.setting-option label{color:#fff;font-size:1.2rem;margin-right:1rem}.setting-option input[type=checkbox]{width:20px;height:20px;cursor:pointer}.start-screen-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#74ebd5,#acb6e5);display:flex;justify-content:center;align-items:center;z-index:10}.start-screen{background-color:#ffffffe6;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0003;text-align:center;max-width:600px;transform:rotate(-2deg);border:5px dashed #ff6b6b;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-10px)}}.start-screen h1{color:#ff6b6b;font-size:3rem;margin-bottom:1rem;text-shadow:3px 3px 0 #ffe66d}.game-title{margin-bottom:1.5rem}.game-title h2{color:#4361ee;font-size:1.8rem;margin-bottom:.2rem;text-shadow:2px 2px 0 #B5DEFF}.game-title h1{color:#ff6b6b;font-size:4rem;margin:0;text-shadow:4px 4px 0 #ffe66d;letter-spacing:1px;transform:rotate(-2deg);line-height:1.2}.start-screen p{color:#333;font-size:1.2rem;margin-bottom:1.5rem}.welcome-preview{height:250px;width:100%;margin-bottom:1.5rem;border-radius:10px;overflow:hidden;box-shadow:0 5px 15px #0003;border:3px solid #ffe66d}.welcome-canvas{width:100%!important;height:100%!important}.start-screen button{background-color:#ff6b6b;color:#fff;border:none;padding:1rem 2rem;font-size:1.5rem;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:700;box-shadow:0 5px #e63946;position:relative;top:0}.start-screen button:hover{background-color:#ff8585;transform:scale(1.05)}.start-screen button:active{top:5px;box-shadow:0 0 #e63946}.keyboard-hint{color:#666;font-size:.9rem;margin-top:1rem;font-style:italic}.character-option:focus,.track-option:focus{outline:3px solid #4CAF50;box-shadow:0 0 10px #4caf50b3;background-color:#4caf5033}.pause-menu button:focus,.settings-menu button:focus,.start-screen button:focus{outline:3px solid #4CAF50;box-shadow:0 0 10px #4caf50b3}.countdown-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none;z-index:20}.countdown{font-size:8rem;font-weight:700;color:#fff;background-color:#00000080;border-radius:50%;width:200px;height:200px;display:flex;justify-content:center;align-items:center;animation:countdown-pulse .5s ease-in-out;text-shadow:0 0 20px rgba(255,255,255,.7);border:5px solid #4CAF50;box-shadow:0 0 30px #4caf5080;font-family:Trade Winds,cursive}.countdown:empty:before{content:"GO!";color:#4caf50;animation:go-animation .5s ease-in-out;font-size:7rem;text-shadow:0 0 25px #4CAF50;font-family:Trade Winds,cursive}@keyframes countdown-pulse{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes go-animation{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.5)}75%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.character-image{display:none}.character-select-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,#85ffbd,#fffb7d);display:flex;justify-content:center;align-items:center;z-index:10}.character-select{background-color:#ffffffe6;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0003;text-align:center;max-width:800px;border:5px solid #4CC9F0}.character-select h2{color:#4361ee;font-size:2.5rem;margin-bottom:1.5rem;text-shadow:2px 2px 0 #B5DEFF}.character-options{display:flex;justify-content:center;gap:2rem;margin-bottom:1.5rem}.character-option{background-color:#f8edeb;border-radius:15px;padding:1rem;cursor:pointer;transition:all .3s;width:200px;box-shadow:0 5px 15px #0000001a;position:relative}.character-option:hover{transform:translateY(-10px)}.character-option.selected{background-color:#fcd5ce;transform:translateY(-10px) scale(1.05);box-shadow:0 10px 25px #00000026;border:3px solid #FF8FA3}.character-preview{height:200px;width:100%;margin-bottom:1rem;border-radius:10px;overflow:hidden}.character-preview-canvas{width:100%!important;height:100%!important}.character-option span{display:block;font-size:1.5rem;font-weight:700;color:#333}.track-select-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#a9c9ff,#ffbbec);display:flex;justify-content:center;align-items:center;z-index:10}.track-select{background-color:#ffffffe6;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0003;text-align:center;max-width:800px;border:5px solid #7400B8}.track-select h2{color:#7400b8;font-size:2.5rem;margin-bottom:1.5rem;text-shadow:2px 2px 0 #E0AAFF}.track-options{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;margin-bottom:1.5rem}.track-option{background-color:#f8f9fa;border-radius:15px;padding:1rem;cursor:pointer;transition:all .3s;width:160px;box-shadow:0 5px 15px #0000001a}.track-option:hover{transform:translateY(-8px)}.track-option.selected{background-color:#e0aaff;transform:translateY(-8px) scale(1.05);box-shadow:0 10px 25px #00000026;border:3px solid #7400B8}.track-image{height:120px;width:100%;margin-bottom:1rem;border-radius:10px;overflow:hidden;display:flex;justify-content:center;align-items:center}.track-color{height:80%;width:80%;border-radius:8px}.track-option span{display:block;font-size:1.2rem;font-weight:700;color:#333}.pause-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:10}.pause-menu,.settings-menu{background-color:#fffffff2;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0000004d;text-align:center;max-width:400px;border:5px solid #2ec4b6;transform:rotate(1deg)}.pause-menu h2,.settings-menu h2{color:#2ec4b6;font-size:2.5rem;margin-bottom:1.5rem;text-shadow:2px 2px 0 #cbf3f0}.pause-menu button,.settings-menu button{background-color:#2ec4b6;color:#fff;border:none;padding:.8rem 1.5rem;font-size:1.2rem;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:700;margin:.5rem 0;width:200px;display:block;margin-left:auto;margin-right:auto;box-shadow:0 4px #1a8a80;position:relative;top:0}.pause-menu button:hover,.settings-menu button:hover{background-color:#3dd1c4;transform:scale(1.05)}.pause-menu button:active,.settings-menu button:active{top:4px;box-shadow:0 0 #1a8a80}.setting-option{display:flex;justify-content:space-between;align-items:center;background-color:#f0f0f0;padding:1rem;border-radius:10px;margin-bottom:1.5rem}.setting-option label{font-size:1.2rem;font-weight:700;color:#333}.setting-option input[type=checkbox]{transform:scale(1.5);margin-left:1rem}h1,h2,h3,.game-title h1,.game-title h2,.character-select h2,.track-select h2,.pause-menu h2,.settings-menu h2,.character-option span,.track-option span,button{font-family:Trade Winds,cursive;font-weight:400}.start-screen button,.pause-menu button,.settings-menu button{font-size:1.4rem;padding:.9rem 1.8rem;letter-spacing:1px}.character-option span,.track-option span{font-size:1.3rem;letter-spacing:1px}.character-select h2,.track-select h2,.pause-menu h2,.settings-menu h2{font-size:2.3rem;letter-spacing:1px;line-height:1.2}.car-color-select-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#6a11cb,#2575fc);display:flex;justify-content:center;align-items:center;z-index:10}.car-color-select{background-color:#ffffffe6;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0003;text-align:center;max-width:800px;border:5px solid #2575FC}.car-color-select h2{color:#6a11cb;font-size:2.5rem;margin-bottom:1.5rem;text-shadow:2px 2px 0 #D1C4E9}.car-preview{height:250px;width:100%;margin-bottom:1.5rem;border-radius:10px;overflow:hidden;box-shadow:0 5px 15px #0003;border:3px solid #ffe66d}.car-preview-canvas{width:100%!important;height:100%!important}.color-options{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:1.5rem}.color-option{width:120px;padding:.8rem;background-color:#f8f9fa;border-radius:10px;cursor:pointer;transition:all .3s;box-shadow:0 3px 10px #0000001a;display:flex;flex-direction:column;align-items:center}.color-option:hover{transform:translateY(-5px);box-shadow:0 5px 15px #00000026}.color-option.selected{transform:translateY(-5px) scale(1.05);box-shadow:0 8px 20px #0003;border:3px solid #2575FC}.color-swatch{width:60px;height:60px;border-radius:50%;margin-bottom:.5rem;border:2px solid #333;transition:all .3s}.color-option:hover .color-swatch{transform:scale(1.1)}.color-option.selected .color-swatch{transform:scale(1.1);border:3px solid white;box-shadow:0 0 0 2px #2575fc}.color-option span{font-size:.9rem;font-weight:700;color:#333}.car-color-select .select-button{background-color:#2575fc;color:#fff;border:none;padding:.8rem 2.5rem;font-size:1.4rem;letter-spacing:1px;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:400;margin:1.5rem auto 1rem;display:block;box-shadow:0 4px #1560d6;position:relative;top:0;font-family:Trade Winds,cursive}.car-color-select .select-button:hover{background-color:#2e80fd;transform:scale(1.05)}.car-color-select .select-button:active{top:4px;box-shadow:0 0 #1560d6}.car-color-select .select-button:focus{outline:3px solid #4CAF50;box-shadow:0 4px #1560d6,0 0 10px #4caf50b3}.track-icon-canvas{width:100%;height:100%;background-color:#2828281a;border-radius:8px;border:1px solid rgba(0,0,0,.2)}.track-options-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1.5rem;justify-content:center;margin:1.5rem 0}.track-image{width:140px;height:100px;border-radius:10px;overflow:hidden;display:flex;justify-content:center;align-items:center;border:1px solid rgba(255,255,255,.2)}.track-map-preview,.track-map-container,.track-select-content,.track-details,.continue-button{display:none}.track-map-canvas{position:absolute;top:20px;left:20px;z-index:50;pointer-events:none;transition:opacity .3s ease;border-radius:8px;overflow:hidden;width:200px;height:200px}.track-map-canvas.mobile{width:130px;height:130px;top:10px;left:10px}.track-map-canvas.mobile.landscape{width:100px;height:100px;top:10px;left:10px}.track-map-canvas.countdown-active{opacity:.35}.track-map-canvas.countdown-active.mobile{opacity:.45}.start-buttons{display:flex;justify-content:center;gap:1rem;margin-top:1rem}.start-button{background-color:#ff6b6b;color:#fff;border:none;padding:1rem 2rem;font-size:1.5rem;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:700;box-shadow:0 5px #e63946;position:relative;top:0}.start-button:hover{background-color:#ff8585;transform:scale(1.05)}.start-button:active{top:5px;box-shadow:0 0 #e63946}.settings-button{background-color:#4361ee;color:#fff;border:none;padding:1rem 2rem;font-size:1.5rem;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:700;box-shadow:0 5px #3a0ca3;position:relative;top:0}.settings-button:hover{background-color:#5e78ff;transform:scale(1.05)}.settings-button:active{top:5px;box-shadow:0 0 #3a0ca3}.pause-button{position:absolute;top:20px;right:20px;width:50px;height:50px;border-radius:50%;background-color:#0009;border:2px solid rgba(255,255,255,.3);display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:100;transition:all .2s ease;padding:0;box-shadow:0 4px 8px #0000004d}.pause-button:hover{background-color:#000c;transform:scale(1.1)}.pause-button:active{transform:scale(.95)}.pause-button svg{width:24px;height:24px}.settings-buttons{display:flex;gap:10px;margin-top:20px}.settings-menu button{background-color:#4361ee;color:#fff;border:none;padding:10px 20px;border-radius:25px;cursor:pointer;font-weight:700;transition:all .2s;margin-top:20px;box-shadow:0 4px #1560d6}.settings-menu button:hover{background-color:#5e78ff;transform:translateY(-2px)}.settings-menu button:active{transform:translateY(2px);box-shadow:0 2px #1560d6}@media (max-width: 480px){.game-container{position:relative}.pause-button{top:15px!important;right:15px!important;width:40px!important;height:40px!important}.pause-button{z-index:45}.track-map-canvas{z-index:50}.countdown-overlay{z-index:60}.touch-controls{z-index:70}.pause-overlay,.character-select-overlay,.track-select-overlay,.car-color-select-overlay{z-index:100}.start-screen{width:90%;max-width:100%;padding:1.5rem;margin:0 15px}.game-title h1{font-size:2.5rem}.game-title h2{font-size:1.4rem}.welcome-preview{height:180px}.start-buttons{flex-direction:column;gap:.8rem}.start-button,.settings-button{width:100%;padding:.8rem 1.5rem;font-size:1.2rem}.character-select{width:90%;min-width:auto;padding:1.5rem}.character-options{flex-direction:column;align-items:center;gap:1rem}.character-option{width:100%;max-width:220px}.character-preview{width:140px;height:140px}.car-color-select{width:90%;min-width:auto;padding:1.5rem}.car-preview{height:140px}.color-options{grid-template-columns:repeat(2,1fr);gap:.8rem}.color-option{padding:.5rem}.track-select{width:90%;min-width:auto;max-width:100%;padding:1.5rem}.track-options-grid{grid-template-columns:repeat(2,1fr);gap:.8rem}.track-option{padding:.5rem}.track-image{width:100%;height:80px}.track-option span{font-size:.9rem}.track-map-preview{width:100%;min-width:auto}.track-map-container{width:100%;height:200px}.pause-menu,.settings-menu{width:90%;padding:1.5rem}.settings-buttons{flex-direction:column;width:100%}.settings-menu button{width:100%;margin-top:.8rem}.control-button{width:70px;height:70px}.control-button svg{width:30px;height:30px}.control-group.left{left:10px;bottom:10px}.control-group.right{right:10px;bottom:10px}.keyboard-hint{display:none}}@media (min-width: 481px) and (max-width: 768px){.start-screen{width:90%;max-width:500px;padding:1.5rem}.character-select,.track-select,.car-color-select{width:90%;min-width:auto;max-width:500px}.character-options{gap:1rem}.character-preview{width:150px;height:150px}.track-select-content{flex-direction:column}.track-map-preview{margin-top:1rem}}@media (max-height: 500px) and (orientation: landscape){.start-screen{flex-direction:row;justify-content:space-between;align-items:center}.start-screen-content{width:50%;margin-right:1rem}.welcome-preview{width:45%;margin:0}.game-title{margin-bottom:.5rem}.game-title h1{font-size:2rem}.game-title h2{font-size:1.2rem}.start-screen-content{display:flex;flex-direction:column;width:50%}.start-buttons{flex-direction:row}.character-options,.color-options{flex-direction:row;flex-wrap:wrap;justify-content:center}.track-select{max-height:90vh;overflow-y:auto}.control-button{width:60px;height:60px}.control-group.left,.control-group.right{bottom:10px}}.start-screen-content{display:flex;flex-direction:column;justify-content:center}.start-screen{display:flex;flex-direction:column;align-items:center}@media (max-width: 480px){.touch-controls,.control-button{touch-action:none}}.device-info{background-color:#0000001a;border-radius:8px;padding:10px 15px;margin:15px 0;text-align:center}.device-info p{margin:5px 0;font-size:.9rem}.device-info p:first-child{font-weight:700;color:#7400b8}.info-text{font-style:italic;opacity:.8}*{margin:0;padding:0;box-sizing:border-box}body,html{width:100%;height:100%;overflow:hidden;font-family:Arial,sans-serif}#root{width:100%;height:100vh}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}