body{margin:0;padding:0;overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#120338}canvas{display:block}#hud{position:absolute;top:20px;left:20px;color:#fff;background-color:#6a0dad99;padding:15px;border-radius:10px;font-size:16px;z-index:100;box-shadow:0 0 20px #6a0dadcc;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(147,112,219,.6);display:flex;flex-direction:column}#hud>div{margin-bottom:8px;font-weight:500}#health{color:#0fa}#kills{color:#1e90ff}#players{color:#fffb96}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ffffffe6;font-size:24px;z-index:100;pointer-events:none;width:16px;height:16px;border:2px solid rgba(147,112,219,.9);border-radius:50%;box-shadow:0 0 10px #1e90ffcc;animation:pulse 2s infinite}.fade-message{animation:fadeIn .3s,fadeOut .3s 1.7s}.player-name{font-family:Arial,sans-serif;font-weight:700;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none}#leaderboard{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;width:350px;max-height:75vh;overflow-y:auto;background-color:#0a0a14e6;border:1px solid #555;border-radius:8px;padding:20px;color:#e0e0e0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:0 5px 15px #0006}#leaderboard h2{margin-top:0;margin-bottom:15px;font-size:1.5em;text-align:center;color:#a0c4ff;border-bottom:1px solid #444;padding-bottom:10px}#leaderboard-list{list-style-type:none;padding-left:0;margin:0}#leaderboard-list li{padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;transition:background-color .2s ease-in-out;width:100%;box-sizing:border-box}#leaderboard-list li:before{content:counter(item) ".";counter-increment:item;margin-right:15px;font-weight:700;color:#888;min-width:20px;text-align:right}#leaderboard-list{counter-reset:item}#leaderboard-list li:last-child{border-bottom:none}#leaderboard-list li.local-player{font-weight:700;color:gold;background-color:#50500033;padding:5px 10px;margin:-5px -10px 5px;border-radius:4px}#leaderboard-list li span:last-of-type{font-weight:700;min-width:50px;text-align:right}#leaderboard-list li .lb-name{flex-grow:1;text-align:left;margin-right:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#leaderboard-list li .lb-kills,#leaderboard-list li .lb-score{min-width:60px;text-align:right;font-weight:700;flex-shrink:0}#leaderboard-list li .lb-kills{color:#ff8a8a;margin-right:15px}#kill-feed{position:absolute;top:20px;right:20px;min-width:150px;max-width:400px;padding:10px;color:#fff;background-color:#6a0dad99;border-radius:10px;font-size:14px;z-index:101;box-shadow:0 0 15px #6a0dadb3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(147,112,219,.6);display:flex;flex-direction:column;align-items:flex-end}.kill-feed-message{background-color:#00000080;color:#fff;padding:6px 12px;margin-bottom:5px;border-radius:4px;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;opacity:1;transition:opacity .5s ease-out}#damage-overlay-effect{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#f000;pointer-events:none;z-index:2000;opacity:0}#damage-overlay-effect.active{animation:damageFade .3s ease-out}@keyframes damageFade{0%{opacity:.4;background-color:#f006}to{opacity:0;background-color:#f000}}#health-bar-container{position:fixed;top:25px;left:50%;transform:translate(-50%);width:250px;height:18px;background-color:#323232b3;border:2px solid rgba(255,255,255,.8);border-radius:9px;z-index:99;overflow:hidden;box-shadow:0 2px 5px #0006}#health-bar-fill{height:100%;width:100%;background-color:#4caf50;border-radius:7px;transition:width .3s ease-out,background-color .3s ease-out}#kill-feed-message-template{display:none}.game-over-screen{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000d9;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000;font-size:24px}.game-over-screen h2{margin-bottom:20px}.game-over-screen p{margin-bottom:30px}.new-game-button{padding:15px 30px;font-size:20px;cursor:pointer;background-color:#4caf50;color:#fff;border:none;border-radius:5px;transition:background-color .3s ease}.new-game-button:hover{background-color:#45a049}.kill-confirmation-message{position:absolute;top:15%;left:50%;transform:translate(-50%);color:#4caf50;font-size:20px;font-weight:700;text-shadow:1px 1px 2px black;padding:8px 15px;background-color:#00000040;border-radius:5px;z-index:1001}.kill-feed-message{padding:5px 10px;margin-bottom:5px;background-color:#32323299;border-radius:4px;font-size:14px;opacity:1;transition:opacity .5s ease-out}.kill-feed-message.fade-out{opacity:0}.kill-feed-player-name{font-weight:700}.menu-button{margin-top:10px;border:none;border-radius:5px;cursor:pointer;transition:all .3s;color:#fff}@media (max-width: 600px){.menu-button{padding:8px 16px;font-size:.9rem}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#2c2c2c;padding:25px;border-radius:10px;box-shadow:0 5px 15px #00000080;text-align:center;width:90%;max-width:400px;border:1px solid #444}.modal-content p{font-size:1.1rem;color:#f0f0f0;margin-bottom:20px}.modal-buttons{display:flex;justify-content:space-around}.modal-buttons .menu-button{padding:10px 20px;font-size:1rem;min-width:100px}#custom-confirm-yes{background-color:#4caf50;color:#fff}#custom-confirm-yes:hover{background-color:#2a562c}#custom-confirm-no{background-color:#f44336;color:#fff}#custom-confirm-no:hover{background-color:#792c2c}@keyframes slideInFromRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutToLeft{0%{transform:translate(0);opacity:1}to{transform:translate(-100%);opacity:0}}@keyframes slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutToRight{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.1)}to{transform:translate(-50%,-50%) scale(1)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}.slide-in-right{animation:slideInFromRight .7s ease-out forwards}.slide-out-left{animation:slideOutToLeft .7s ease-in forwards}.slide-in-left{animation:slideInFromLeft .7s ease-out forwards}.slide-out-right{animation:slideOutToRight .7s ease-in forwards}.button-hover-scale:hover{transform:scale(1.05)}.button-hover-lift:hover{transform:translateY(-2px)}@media (max-width: 768px){#hud{font-size:14px;padding:10px}}@media (max-width: 768px){#game-menu h1{font-size:36px}#game-menu button{padding:12px 24px;font-size:16px}}#game-menu{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#000c;color:#fff;z-index:100;transform-origin:center center;perspective:800px;animation:slideInFromRight .7s ease-out forwards;overflow-y:auto;padding:20px;box-sizing:border-box}#game-menu.hide{animation:slideOutToLeft .7s ease-in forwards}#game-menu h1{font-size:2.2rem;margin-bottom:1rem;text-align:center;color:#f8f8f8;text-shadow:0 0 10px rgba(255,255,255,.5)}.menu-main-content-wrapper{display:flex;flex-direction:column;align-items:center;width:100%;max-width:550px;gap:15px}#player-setup{background-color:#282828cc;border-radius:10px;padding:20px;width:100%;box-sizing:border-box}body.mobile-controls-active #player-setup{padding:10px;margin-bottom:10px;width:95%;max-width:none;box-sizing:border-box}.form-group{margin-bottom:10px}.form-group label{display:block;margin-bottom:5px;font-size:.9rem;text-align:center;color:#f0f0f0}#player-name{width:100%;padding:10px;border-radius:5px;font-size:1rem;box-sizing:border-box;background-color:#ffffffe6;color:#333}#color-selection{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px;margin-top:10px}.color-option{aspect-ratio:1/1;background-color:#3c3c3cb3;border-radius:5px;cursor:pointer;transition:all .2s ease;display:flex;justify-content:center;align-items:center;padding:0}.color-option:hover{transform:scale(1.1)}.color-option.selected{box-shadow:0 0 15px #fffc;transform:scale(1.05)}.color-preview{width:100%;height:100%;border-radius:3px}.color-preview.blue{background-color:#3a7bd5}.color-preview.green{background-color:#4caf50}.color-preview.orange{background-color:#ff9800}.color-preview.red{background-color:#f44336}.color-preview.purple{background-color:#9c27b0}.color-preview.yellow{background-color:#ffeb3b}.color-preview.cyan{background-color:#00bcd4}.color-preview.brown{background-color:#795548}.color-preview.gray{background-color:#607d8b}.color-preview.pink{background-color:#e91e63}.color-preview.black{background-color:#000}.color-preview.white{background-color:#fff}#start-button{padding:10px 30px;font-size:1.1rem;margin-top:0;width:auto}#start-button:hover{background-color:#45a049}#start-button:disabled{background-color:#ccc;cursor:not-allowed}body:not(.mobile-controls-active) #game-menu .controls-info.start-controls{display:block!important;padding:20px;margin-top:20px;max-width:550px;width:100%;background-color:#282828cc;border-radius:10px;text-align:left;box-sizing:border-box}body:not(.mobile-controls-active) #game-menu h1{font-size:3.5rem;margin-bottom:2rem}body:not(.mobile-controls-active) #player-setup{padding:25px;margin-bottom:25px;max-width:550px;width:80%}body:not(.mobile-controls-active) .controls-info.start-controls{display:block!important;padding:20px;margin-bottom:25px;margin-top:20px;max-width:550px;width:80%;background-color:#282828cc;border-radius:10px;text-align:left}body:not(.mobile-controls-active) .start-controls h3{text-align:center;margin-bottom:10px}body:not(.mobile-controls-active) .start-controls ul{padding-left:20px}body:not(.mobile-controls-active) .start-controls li{margin-bottom:5px}body:not(.mobile-controls-active) .form-group label{font-size:1.2rem;margin-bottom:10px}body:not(.mobile-controls-active) #player-name{padding:12px;font-size:1.1rem}body:not(.mobile-controls-active) #color-selection{grid-template-columns:repeat(5,1fr);gap:12px;margin-top:12px}body:not(.mobile-controls-active) .color-option{border-radius:8px;padding:10px}body:not(.mobile-controls-active) #start-button{padding:15px 45px;font-size:1.3rem}@media (orientation: landscape) and (max-height: 500px){body.mobile-controls-active #game-menu{padding-top:0;padding-bottom:1px;justify-content:flex-start;overflow-y:hidden}body.mobile-controls-active #game-menu h1{font-size:3rem!important;margin-bottom:0!important;margin-top:0!important}body.mobile-controls-active #player-setup{padding:5px;margin-bottom:5px;width:100%;max-width:60%;box-sizing:border-box}body.mobile-controls-active .form-group{margin-bottom:3px}body.mobile-controls-active .form-group label{font-size:1rem;margin-bottom:1px}body.mobile-controls-active #player-name{padding:5px;font-size:.7rem}body.mobile-controls-active #color-selection{grid-template-columns:repeat(auto-fit,80px);gap:2px;margin-top:2px;padding:1px;justify-content:center}body.mobile-controls-active .color-option{width:50px;height:50px;padding:2px;border-radius:3px;aspect-ratio:unset}body.mobile-controls-active #start-button{padding:5px 10px!important;font-size:1.8rem!important;margin-top:3px!important;min-width:auto;width:auto}}body.mobile-controls-active div#game-menu div.controls-info.start-controls,body.mobile-controls-active .controls-info.start-controls{display:none!important}body.mobile-controls-active #game-menu{justify-content:space-around;padding-top:5vh;padding-bottom:5vh}body.mobile-controls-active #game-menu h1{font-size:3rem}body.mobile-controls-active .form-group label{font-size:1.1rem;margin-bottom:8px}body.mobile-controls-active #player-name{font-size:1.1rem;padding:12px}body.mobile-controls-active #color-selection{gap:8px;margin-top:15px;padding:5px}body.mobile-controls-active .color-option{border-radius:5px}body.mobile-controls-active #start-button{padding:18px 22px;font-size:1.4rem;width:85%;max-width:320px;margin-top:25px;box-sizing:border-box}@media screen and (max-width: 1024px) and (orientation: landscape){html,body{overflow:hidden;height:100%;font-size:16px}#game-menu{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100vw;height:100vh;padding:.1vh 2vw .1vh 2vw;box-sizing:border-box;overflow:hidden;min-height:0}#game-menu h1{font-size:clamp(1.1rem,2.5vh,1.4rem);margin-top:0;margin-bottom:0;flex-shrink:0;color:#fff;text-align:center}#game-menu .menu-main-content-wrapper{display:flex;flex-direction:row;align-items:stretch;justify-content:center;width:100%;max-width:96vw;gap:2vw;overflow:hidden;flex-grow:0;flex-shrink:0}body.mobile-controls-active #game-menu .menu-main-content-wrapper #player-setup{flex-grow:1;flex-shrink:1;flex-basis:70%;max-width:70%;min-width:0;display:flex;flex-direction:column;overflow:hidden;max-height:100%;padding:1vh 1vw .5vh 1vw;box-sizing:border-box;background-color:#282828b3;border-radius:1vh}#game-menu .menu-main-content-wrapper .player-setup .form-group{margin-bottom:.5vh;flex-shrink:0}#game-menu .menu-main-content-wrapper .player-setup .form-group label{font-size:clamp(.6rem,1.5vh,.8rem);margin-bottom:.3vh}#game-menu .menu-main-content-wrapper .player-setup #player-name{padding:.6vh 1vw;font-size:clamp(.7rem,1.8vh,.9rem);border-radius:.7vh}#game-menu .menu-main-content-wrapper .player-setup #color-selection{display:grid;grid-template-columns:repeat(6,1fr);gap:.4vw;width:100%;padding-top:.3vh;flex-grow:1;overflow-y:auto;min-height:0}#game-menu .menu-main-content-wrapper .player-setup .color-option{aspect-ratio:1/1;border-radius:.5vh;min-width:0}#game-menu .menu-main-content-wrapper .player-setup .color-option .color-preview{width:100%;height:100%;border-radius:inherit}#game-menu .menu-main-content-wrapper #start-button{flex-grow:0;flex-shrink:0;height:15vh;width:15vh;display:flex;justify-content:center;align-items:center;font-size:clamp(1.5rem,3vh,2rem);padding:0;align-self:center;background-color:#4caf50;color:#fff;border-radius:1vh;border:none;line-height:1}body.mobile-controls-active #game-menu .controls-info.start-controls{display:none!important}}#pause-menu{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000000b3;z-index:150;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transform-origin:center center;perspective:800px;animation:slideInFromLeft .7s ease-out forwards}#pause-menu.hide{animation:slideOutToRight .7s ease-in forwards}.pause-container{background-color:#1e1e1ee6;padding:30px 40px;border-radius:10px;width:90%;max-width:600px;text-align:center;box-shadow:0 5px 20px #00000080;flex-direction:column;align-items:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pause-container h2{font-size:2.5rem;margin-bottom:20px;color:#eee;text-shadow:0 0 8px rgba(255,255,255,.4);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:10px;width:100%}.player-info{margin-bottom:25px;width:100%}#player-name-display{font-size:1.5rem;color:#4caf50;font-weight:700;margin-bottom:15px}#player-stats{display:flex;justify-content:space-around;width:100%}#player-stats div{font-size:1.1rem;color:#ccc}#player-stats strong{color:#fff;margin-left:5px}.pause-buttons{display:flex;flex-direction:column;align-items:center;gap:15px;width:100%;max-width:300px;margin-left:auto;margin-right:auto;margin-bottom:20px}.pause-buttons button{padding:10px 20px;font-size:1.1rem;width:100%}#resume-button{background-color:#4caf50}#resume-button:hover{background-color:#2a562c}#settings-pause-button{background-color:#555}#settings-pause-button:hover{background-color:#515151}#exit-button{background-color:#f44336}#exit-button:hover{background-color:#792c2c}.controls-info{margin-top:20px;border-top:1px solid rgba(255,255,255,.2);padding-top:20px;width:100%;text-align:left}.controls-info h3{font-size:1.2rem;margin-bottom:10px;color:#ddd;text-align:center}.controls-info ul{list-style:none;padding:0;margin:0}.controls-info li{margin-bottom:8px;color:#bbb;font-size:.95rem}.controls-info strong{color:#eee;min-width:60px;display:inline-block}#mobile-controls,#mobile-pause-button.mobile-only{display:none}#mobile-controls{position:fixed;bottom:0;left:0;width:100%;height:auto;padding:20px;box-sizing:border-box;justify-content:space-between;align-items:flex-end;pointer-events:none;z-index:10}body.mobile-controls-active #mobile-controls{display:flex}.joystick{width:100px;height:100px;background-color:#80808080;border-radius:50%;position:relative;display:flex;justify-content:center;align-items:center;pointer-events:auto}.joystick-handle{width:50px;height:50px;background-color:#505050cc;border-radius:50%}.right-controls-cluster{display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto}.action-buttons{display:flex;flex-direction:row;gap:15px;pointer-events:auto}.action-button{width:60px;height:60px;border-radius:50%;border:2px solid rgba(255,255,255,.7);background-color:#50505099;color:#fff;font-size:20px;font-weight:700;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;pointer-events:auto}.action-button:active{background-color:#646464cc}body.mobile-controls-active .controls-info{display:none}body.mobile-controls-active #mobile-pause-button.mobile-only{display:block;width:60px;height:60px;background-color:#505050b3;border:2px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;font-size:28px;text-align:center;line-height:56px;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:20;pointer-events:auto}body.mobile-controls-active #mobile-pause-button.mobile-only:active{background-color:#646464e6}.left-controls-area{display:flex;flex-direction:column;align-items:center;gap:10px}#button-scoreboard{width:60px;height:60px;border-radius:50%;font-size:24px;display:flex;justify-content:center;align-items:center;background-color:#646464b3;color:#fff;border:2px solid rgba(255,255,255,.5)}.center-bottom-controls{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:15px;position:absolute;bottom:20px;left:50%;transform:translate(-50%);pointer-events:auto}.center-bottom-controls>button{width:50px;height:50px;background-color:#505050b3;border:2px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;font-size:24px;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;padding:0;line-height:1}.center-bottom-controls>button:active{background-color:#646464e6}