body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;position:fixed;touch-action:none}#root,body,html{margin:0;width:100%;height:100%}#root,html{padding:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#touch-controls{position:absolute;bottom:30px;left:0;right:0;z-index:1000;pointer-events:auto}#jump-button,#movement-pad{user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}@media (min-width:768px){#touch-controls{display:none!important}}*{box-sizing:border-box;margin:0;padding:0}#root,.App,body,html{width:100%;height:100%;margin:0;padding:0;overflow:hidden;background-color:#000}.App{text-align:center;width:100vw;height:100vh;overflow:hidden;position:relative}canvas{width:100%;height:100%;display:block;touch-action:none}.game-ui{position:absolute;bottom:20px;left:0;right:0;display:flex;justify-content:center;z-index:100;pointer-events:auto}.game-instructions{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#165a4ce6;padding:15px 30px;border-radius:8px;color:#fbff86;font-size:1.1em;text-align:center;z-index:1000;box-shadow:0 4px 6px #0000001a;transition:none;will-change:transform;backface-visibility:hidden}.mobile-controls{position:fixed!important;bottom:20px!important;left:0!important;width:100%!important;display:flex!important;justify-content:space-between!important;padding:0 20px!important;z-index:10000!important;pointer-events:none!important;visibility:visible!important;opacity:1!important}@media (min-width:768px){.mobile-controls{display:none}}.game-challenge{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#165a4ce6;padding:20px;border-radius:10px;text-align:center;z-index:1000;min-width:250px;box-shadow:0 4px 6px #0000001a;transition:none;will-change:transform;backface-visibility:hidden}.game-challenge p{margin:0 0 15px;color:#fbff86;font-size:1.2em;font-weight:700;text-shadow:0 2px 4px #0003}.join-match-button{background:#1ebc73;color:#165a4c;border:none;padding:10px 20px;border-radius:5px;font-size:1.1em;cursor:pointer;transition:all .2s ease;font-weight:700;text-transform:uppercase;letter-spacing:1px;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.join-match-button:hover{background:#fbff86;transform:translateY(-2px);box-shadow:0 4px 8px #0003}.join-match-button:active{transform:translateY(0);box-shadow:0 2px 4px #0003}.opponent-name{color:#1ebc73;font-weight:700;text-shadow:0 2px 4px #0003}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}.mobile-ui{font-size:1.2rem}.mobile-ui .game-instructions{padding:15px;background-color:#000000b3;border-radius:10px;max-width:90%;margin-top:20px}.mobile-ui .game-challenge{background-color:#000000b3;padding:20px;border-radius:15px;max-width:90%}.mobile-ui .join-match-button{padding:15px 30px;font-size:1.2rem;margin-top:15px}.mobile-card-instructions{background-color:#000000b3;color:#fff;padding:12px 20px;border-radius:10px;font-size:18px;font-weight:700;text-align:center;animation:fadeIn .5s ease-out;pointer-events:none;-webkit-user-select:none;user-select:none;white-space:nowrap}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#movement-pad{width:150px!important;height:150px!important;border-radius:75px!important;border:2px solid #ffffff80!important;position:relative!important;touch-action:none!important;display:block!important}#jump-button,#movement-pad{background-color:#ffffff4d!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}#jump-button{width:100px!important;height:100px!important;border-radius:50px!important;border:2px solid #ffffff80!important;display:flex!important;justify-content:center!important;align-items:center!important;color:#fff!important;font-size:18px!important;font-weight:700!important}#joystick-indicator{width:50px!important;height:50px!important;border-radius:25px!important;background-color:#fff9!important;position:absolute!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;transition:transform .1s ease-out!important;display:block!important;visibility:visible!important;opacity:1!important}@media (orientation:landscape){#movement-pad{width:120px!important;height:120px!important;border-radius:60px!important}#jump-button{width:80px!important;height:80px!important;border-radius:40px!important;font-size:14px!important}.mobile-controls{bottom:10px!important}}@media (max-width:768px){.game-ui{pointer-events:auto;z-index:1001;position:relative}.game-instructions{font-size:18px;padding:12px 20px;border-radius:10px}.game-challenge,.game-instructions{margin-bottom:180px;background-color:#000000b3;max-width:90%}.game-challenge{padding:15px;border-radius:15px}.join-match-button{padding:15px 30px;font-size:18px;margin-top:15px}}@media (orientation:landscape) and (max-width:896px){.mobile-controls{bottom:10px!important;display:flex!important;visibility:visible!important;opacity:1!important;z-index:10000!important}#movement-pad{width:120px!important;height:120px!important;display:block!important}#jump-button,#movement-pad{visibility:visible!important;opacity:1!important;pointer-events:auto!important}#jump-button{width:80px!important;height:80px!important;font-size:14px!important;display:flex!important}#joystick-indicator{display:block!important;visibility:visible!important;opacity:1!important}.game-challenge,.game-instructions{bottom:40px!important;margin-bottom:0!important}}.connection-status{position:fixed;top:10px;right:10px;padding:8px 12px;border-radius:4px;font-size:14px;font-weight:700;z-index:1000;transition:all .3s ease}.connection-status.connected{background-color:#008000b3;color:#fff}.connection-status.disconnected{background-color:#ff0000b3;color:#fff;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}.room-id-container{position:fixed;top:10px;left:10px;z-index:1000;display:flex;flex-direction:column;align-items:flex-start}.room-id-input{padding:8px 12px;border-radius:4px;border:2px solid #ffffff4d;background-color:#00000080;color:#fff;font-size:14px;outline:none;transition:all .3s ease}.room-id-input:focus{border-color:#fffc}.room-id-label{margin-top:4px;font-size:12px;color:#fffc}.player-name-tag{background-color:#0009;color:#fff;padding:4px 8px;border-radius:4px;font-size:14px;text-align:center;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;transition:all .3s ease}.player-name{margin-bottom:4px}.challenge-button{background-color:#e74c3c;color:#fff;border:none;border-radius:4px;padding:4px 8px;font-size:12px;cursor:pointer;transition:all .2s ease;pointer-events:auto}.challenge-button:hover{background-color:#c0392b}.challenge-notification{position:fixed;right:20px;background-color:#000c;color:#fff;padding:15px;border-radius:8px;z-index:1000;width:250px;box-shadow:0 4px 8px #0003;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}.challenge-notification p{margin:0 0 10px;font-size:16px}.challenge-notification button{padding:8px 12px;border:none;border-radius:4px;margin-right:8px;cursor:pointer;font-size:14px;transition:all .2s ease}.accept-challenge-button{background-color:#2ecc71;color:#fff}.accept-challenge-button:hover{background-color:#27ae60}.decline-challenge-button{background-color:#e74c3c;color:#fff}.decline-challenge-button:hover{background-color:#c0392b}@media (max-width:768px){.connection-status,.room-id-input{font-size:12px;padding:6px 10px}.challenge-notification{width:200px;padding:10px}.challenge-notification p{font-size:14px}.challenge-notification button{padding:6px 10px;font-size:12px}}.player-count{position:fixed;top:10px;left:10px;padding:8px 12px;border-radius:4px;background-color:#0009;font-size:14px;font-weight:700;z-index:1000;transition:all .3s ease;gap:8px}.player-count,.sync-button{color:#fff;display:flex;align-items:center}.sync-button{background:none;border:none;font-size:16px;cursor:pointer;padding:0;margin:0;width:24px;height:24px;justify-content:center;border-radius:50%;transition:all .2s ease}.sync-button:hover{background-color:#fff3;transform:rotate(180deg)}@media (max-width:768px){.player-count{font-size:12px;padding:6px 10px}.sync-button{font-size:14px;width:20px;height:20px}}