body{margin:0;padding:0;display:flex;flex-direction:column;align-items:center;background:#000;font-family:Courier New,monospace;color:#0f0;text-shadow:0 0 2px #00ff00}.game-container{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:90vh;height:90svh;padding:12px 16px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}#ui{display:flex;justify-content:space-between;flex-direction:row;align-items:end;width:100%;max-width:var(--court-width, 800px);margin:0}.high-score{margin-left:auto;display:flex;flex-direction:row;justify-content:center;align-items:center;height:100%}#score{font-size:50px;font-weight:700;display:block}.leaderboard-overlay{display:flex;justify-content:center;width:100%}.leaderboard{background:#000c;padding:15px 20px;border-radius:5px;border:1px solid #00ff00;box-shadow:0 0 10px #0f0;text-align:center;width:50%;margin-bottom:3rem}.leaderboard h3{margin:0 0 10px;font-size:18px;color:#0f0}#leaderboard-list{list-style:none;padding:0;margin:0;color:#0f0}#leaderboard-list li{padding:5px 0;border-bottom:1px solid rgba(0,255,0,.5)}.leaderboard-button{display:none;align-items:center;justify-content:center;margin-left:12px;padding:6px;background:#000;color:#0f0;border:1px solid #00ff00;border-radius:5px;box-shadow:0 0 5px #0f0;cursor:pointer}.leaderboard-close{display:none;margin:15px auto 0;padding:10px 20px;background:#0f0;color:#000;font-weight:700;border:none;border-radius:5px;cursor:pointer;box-shadow:0 0 5px #0f0}.usernamePopup{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;justify-content:center;align-items:center;z-index:1000;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.usernamePopup.hidden{visibility:hidden;opacity:0}.usernamePopup .popup-content{background:#000;border:2px solid #00ff00;box-shadow:0 0 20px #0f0;padding:20px;border-radius:10px;text-align:center;max-width:400px;width:90%}.usernamePopup input{width:90%;padding:10px;margin:10px 0;border:1px solid #00ff00;border-radius:5px;background:#000;color:#0f0;font-family:Courier New,monospace;font-size:16px;box-shadow:0 0 5px #0f0}.username-error{min-height:1.2em;margin:0 0 10px;font-size:14px;color:#ff5252;text-shadow:none}.usernamePopup button{padding:10px 20px;background:#0f0;color:#000;font-weight:700;border:none;border-radius:5px;cursor:pointer;box-shadow:0 0 5px #0f0;transition:background .3s ease-in-out}.usernamePopup button:hover{background:#090}.usernamePopup.visible{visibility:visible;opacity:1}canvas{display:block;flex-shrink:0;border:8px solid #00ff00;background:#000;position:relative;box-shadow:0 0 20px #0f0}@media(max-width:768px){.leaderboard{width:80vw}canvas{border-width:5px}}@media(max-height:500px){.game-container{height:100vh;height:100svh}#score{font-size:30px}}@media(pointer:coarse){html,body{height:100%;overflow:hidden;overscroll-behavior:none}.game-container{height:100vh;height:100svh}.leaderboard-button{display:flex}.leaderboard-close{display:block}.leaderboard-overlay{position:fixed;top:0;left:0;height:100%;align-items:center;z-index:500;background:#000000e6;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.leaderboard-overlay.visible{visibility:visible;opacity:1}.leaderboard{box-sizing:border-box;width:80vw;max-width:400px;max-height:80vh;max-height:80svh;overflow-y:auto;margin:0}}