*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;background-color:#2a2a2a;font-family:Fredoka,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none;display:flex;justify-content:center;align-items:center;height:100vh}#game-container{position:relative;box-shadow:0 0 50px #00000080;overflow:hidden;background-color:#a5e5ff}#ui-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:flex;flex-direction:column;justify-content:flex-end;padding:1.25em;box-sizing:border-box;z-index:5}.hud-row{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:.5em}.score-pill{background:#ffffff4d;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:.6em 1.25em;border-radius:2em;color:#1e3a8a;font-size:1.5em;font-weight:800;box-shadow:0 .25em .375em #0000001a;border:.15em solid rgba(255,255,255,.5)}.timer-pill{background:#ef444433;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:.6em 1.25em;border-radius:2em;color:#b91c1c;font-size:1.5em;font-weight:800;border:.15em solid rgba(255,255,255,.5)}#overlay-screen{position:absolute;top:0;left:0;width:100%;height:100%;background:#a5e5ffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:auto;z-index:10;transition:opacity .3s}#countdown-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:8em;color:#fff;font-weight:800;text-shadow:.08em .08em 0 #3B82F6;pointer-events:none;z-index:8;display:none;animation:popIn .5s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn{0%{transform:translate(-50%,-50%) scale(0);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}.btn{background:#ff5e78;color:#fff;padding:.6em 1.8em;font-size:1.8em;border-radius:2em;border:none;cursor:pointer;box-shadow:0 .3em #d43f59,0 .5em .5em #00000026;transition:transform .1s,box-shadow .1s;font-family:Fredoka,sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-top:1em}.btn:active{transform:translateY(.3em);box-shadow:0 0 #d43f59}.title-text{font-size:8em;color:#3b82f6;font-weight:900;margin:0 0 .1em;text-shadow:.06em .06em 0 white;text-align:center;line-height:.85;width:100%;padding:0 .2em;box-sizing:border-box;word-spacing:100vw}.subtitle{font-size:1.5em;color:#1e40af;margin-bottom:2em;text-align:center;max-width:80%;font-weight:600}.final-label{font-size:1.5em;color:#1e3a8a;font-weight:800;margin:0;letter-spacing:.05em}.final-score-val{font-size:8em;color:#fff;font-weight:900;filter:drop-shadow(0 .1em .1em rgba(0,0,0,.1));-webkit-text-stroke:.18em #3B82F6;paint-order:stroke fill;margin:0;line-height:1}.highscore-container{margin-top:.5em;font-size:1.2em;color:#1e40af;font-weight:700;background:#ffffff80;padding:.5em 1em;border-radius:1em}.hidden{display:none!important}.text-center{text-align:center}canvas{display:block}.menu-buttons{display:flex;flex-direction:column;gap:.8em;align-items:center}.btn-secondary{background:#6b7280;box-shadow:0 .3em #4b5563,0 .5em .5em #00000026}.btn-secondary:active{box-shadow:0 0 #4b5563}.name-input-container{display:flex;flex-direction:column;align-items:center;gap:.5em}.name-input,.code-input{font-family:Fredoka,sans-serif;font-size:1.5em;padding:.5em 1em;border:.15em solid rgba(59,130,246,.5);border-radius:1em;background:#fffc;color:#1e3a8a;text-align:center;outline:none;width:200px}.code-input{font-size:3em;font-weight:800;letter-spacing:.2em;width:400px;text-transform:uppercase}.code-input:focus,.name-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .2em #3b82f64d}.room-code{font-size:6em;font-weight:900;color:#3b82f6;letter-spacing:.15em;text-shadow:.05em .05em 0 white;margin:.1em 0}.qr-container{background:#fff;padding:.5em;border-radius:1em;box-shadow:0 .25em .5em #0000001a}.players-list{display:flex;flex-wrap:wrap;gap:.8em;justify-content:center;max-width:400px;margin:1em 0}.player-item{display:flex;align-items:center;gap:.5em;background:#ffffff80;padding:.5em 1em;border-radius:2em;border:.15em solid transparent}.player-item.local{border-color:#3b82f6;background:#3b82f633}.player-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.player-avatar.small{width:24px;height:24px}.avatar-face{width:20px;height:20px;border-radius:50%;margin-bottom:-2px}.player-avatar.small .avatar-face{width:16px;height:16px}.player-name{font-size:1em;font-weight:600;color:#1e3a8a}.waiting-text{color:#6b7280;font-style:italic;margin:0}.leaderboard{display:flex;flex-direction:column;gap:.5em;width:100%;max-width:350px;margin:1em 0}.leaderboard-row{display:flex;align-items:center;gap:.8em;background:#ffffff80;padding:.6em 1em;border-radius:1em}.leaderboard-row.local{background:#3b82f633;border:.15em solid #3B82F6}.leaderboard-row .rank{font-size:1.5em;font-weight:800;width:40px;text-align:center}.leaderboard-row .player-name{flex:1}.leaderboard-row .score{font-size:1.5em;font-weight:800;color:#3b82f6}.loading-spinner{width:60px;height:60px;border:6px solid rgba(59,130,246,.2);border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}