*{font-family:Arial,sans-serif;font-weight:400;font-style:normal}*,*:focus{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;outline:none;-webkit-tap-highlight-color:transparent;-webkit-user-drag:none}::selection{background:transparent}::-moz-selection{background:transparent}#info{position:absolute;top:10px;width:100%;text-align:center;z-index:100;display:block}body{margin:0;overflow:hidden;text-align:center;font-size:12px;color:#444;display:flex;justify-content:center;align-items:center;height:100vh;background-color:#1a1a1a}body,html{overflow:hidden}#scene-container{position:absolute;width:100%;height:100%;background-color:#1a1a1a}@property --a{syntax: "<angle>"; inherits: false; initial-value: 90deg;}@property --l{syntax: "<percentage>"; inherits: false; initial-value: 10%;}.start-game-btn{--a: 45deg;color:#fff;border:none;border-radius:15px;font-weight:700;text-transform:uppercase;font-size:18px;padding:15px 26px;box-shadow:0 4px 8px #0000004d;transition:background .3s ease,transform .2s ease,box-shadow .3s ease;background:linear-gradient(var(--a),#983ab4,#2ba9c1);animation:a 2.4s ease-in infinite normal}@keyframes a{0%{--a: 45deg}to{--a: 405deg}}@keyframes readya{0%{--a: inherit;transform:inherit}to{--a: 45deg;transform:scale(1)}}@keyframes animateGradient{0%{background-position:0% 0%}50%{background-position:50% 50%}to{background-position:0% 0%}}@-moz-keyframes pulser{0%{transform:none}33%{transform:none}66%{transform:none}to{transform:scale(1.04)}}@-webkit-keyframes pulser{0%{transform:none}33%{transform:none}66%{transform:none}to{transform:scale(1.04)}}@keyframes pulser{0%{transform:none}33%{transform:none}66%{transform:none}to{transform:scale(1.05)}}@keyframes screen-animator{0%{opacity:0}to{opacity:.75}}.start-game-btn:hover{cursor:not-allowed}.ready{padding:15px 30px;font-size:18px;white-space:nowrap;transform:scale(1);box-shadow:0 4px 8px #0000004d;animation-name:none}.ready:hover{cursor:pointer;animation-name:none;box-shadow:0 6px 12px #0006;transform:scale(1.05)}.ready:active{transform:scale(.95);box-shadow:0 2px 4px #0000004d}.start-game-btn:disabled{background:#555;color:#aaa;cursor:not-allowed;box-shadow:none}@media (max-width: 768px){.start-game-btn{font-size:16px;padding:12px 25px}}.start-game-btn:focus{outline:none}#goal-screen{z-index:51}#goal-txt{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);z-index:51;margin:0;display:none;font-size:3rem;font-weight:700;color:#fff}.goal-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-family:Arial,sans-serif;font-size:2.5rem;font-weight:700;text-align:center;padding:20px 40px;border-radius:10px;z-index:100;opacity:0;visibility:hidden;transition:opacity .5s ease,transform .5s ease;text-shadow:0 2px 5px rgba(0,0,0,.5)}.goal-text.glow{text-shadow:0 0 10px red,0 0 20px orange,0 0 30px yellow;text-shadow:0 0 10px lightblue,0 0 20px blue,0 0 30px darkblue;text-shadow:0 0 10px lime,0 0 20px green,0 0 30px darkgreen;text-shadow:0 0 10px violet,0 0 20px purple,0 0 30px indigo;text-shadow:0 0 10px gold,0 0 20px orange,0 0 30px goldenrod;text-shadow:0 0 10px cyan,0 0 20px teal,0 0 30px darkcyan;text-shadow:0 0 10px red,0 0 15px orange,0 0 20px yellow,0 0 25px green,0 0 30px blue,0 0 35px violet;text-shadow:0 0 10px pink,0 0 20px coral,0 0 30px orange;text-shadow:0 0 10px white,0 0 20px lightblue,0 0 30px skyblue;text-shadow:0 0 10px magenta,0 0 20px blueviolet,0 0 30px midnightblue}.goal-text.visible{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1.1)}#ui-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:50}#scoreboard{position:absolute;top:10px;left:50%;transform:translate(-50%);font-size:24px;font-family:Arial,sans-serif;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.7);background:#0000001a;padding:2px 10px;border-radius:9px}.dot{height:25px;width:25px;background-color:#bbb;border-radius:50%;display:inline-block}#timer{position:absolute;top:51px;left:50%;transform:translate(-50%);font-size:20px;font-family:Arial,sans-serif;color:#ff0;text-shadow:2px 2px 4px rgba(0,0,0,.7)}.buttons{white-space:nowrap;background-color:#1a2125;border-bottom-left-radius:5px;display:flex;flex-direction:row;box-sizing:border-box;height:35px;padding:4px 6px;position:absolute;top:0;right:0}/*!*#25252A*!*//*!*tr:nth-child(2) {*!*//*!*    background-color: #25252A;*!*/#results-modal{display:none}#modal-overlay,#win-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:101;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:none}#win-modal-content{animation:modalFadeIn .5s ease-in-out}#modal-content,#win-modal-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80%;max-width:600px;border-radius:8px;color:#f0f0f0;box-shadow:0 4px 10px #000000bf;padding:22px 20px 26px;background:#1a1a1ac2}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}#results-container,#win-results-container{display:flex;justify-content:space-between;gap:20px;font-family:Verdana,Arial,Helvetica,sans-serif;font-family:Times,Times New Roman,Georgia,serif;font-family:Lucida Console,Courier,monospace;font-family:cursive;font-family:fantasy;font-family:emoji;font-family:math;font-family:fangsong;font-family:Arial,sans-serif}#results-container div,#win-results-container div{flex:1;text-align:center}h2{font-size:20px;margin-bottom:11px}#red-team h2{color:#f71fa5;color:#8f28fa;color:#8d37f1;color:#841ff6;color:#fa288f;color:#ed117d;color:#ed1164;font-size:19px}#win-red-team h2{color:#ed1164;font-size:19px}#win-blue-team h2,#blue-team h2{color:#11b0ed;font-size:19px}table{width:100%;border-collapse:collapse;margin-top:10px}table th,table td{border-bottom:1px solid rgba(255,255,255,.2);padding:10px;text-align:left;color:#f0f0f0;font-size:17px}table th:nth-child(2n),table td:nth-child(2n){text-align:center}button#close-modal{margin-top:20px;padding:10px 20px;color:#f0f0f0;border:1px solid rgba(255,255,255,.2);background:#333333e6;border-radius:4px;font-size:16px;cursor:pointer;display:block;margin-left:auto;margin-right:auto}button#close-modal:hover{background:#555555e6}#red-team,#blue-team,#win-red-team,#win-blue-team{flex:1;text-align:center}#red-team-table,#win-red-team-table,#blue-team-table{width:100%;margin-top:10px;border-collapse:collapse;text-align:left}@media (max-width: 600px){#results-container,#win-results-container{flex-direction:column}#results-container div,#win-results-container div{margin-bottom:20px}}/*!* Team Headings *!*//*!* Table Styles *!*//*!* Close Button *!*//*!* Responsive Design *!*/#sound-toggle{position:fixed;top:10px;right:10px;z-index:102}#sound-button{background-color:#0003;border:none;color:#fff;font-size:20px;padding:10px;border-radius:50%;cursor:pointer;outline:none;transition:background-color .3s ease}#sound-button:hover{background-color:#00000080}#sound-button:active{transform:scale(.9)}#music-toggle{position:fixed;top:68px;right:10px;z-index:100}#music-button{background-color:#0009;border:none;color:#fff;font-size:20px;padding:10px;border-radius:50%;cursor:pointer;outline:none;transition:background-color .3s ease}#music-button:hover{background-color:#000c}#music-button:active{transform:scale(.9)}#server-status{text-shadow:.6px .6px 0 #000,-.6px .6px 0 #000,.6px -.6px 0 #000,-.6px -.6px 0 #000,0px .6px 0 #000,0px -.6px 0 #000,-.6px 0px 0 #000,.6px 0px 0 #000,1.2px 1.2px 0 #000,-1.2px 1.2px 0 #000,1.2px -1.2px 0 #000,-1.2px -1.2px 0 #000,0px 1.2px 0 #000,0px -1.2px 0 #000,-1.2px 0px 0 #000,1.2px 0px 0 #000,.6px 1.2px 0 #000,-.6px 1.2px 0 #000,.6px -1.2px 0 #000,-.6px -1.2px 0 #000,1.2px .6px 0 #000,-1.2px .6px 0 #000,1.2px -.6px 0 #000,-1.2px -.6px 0 #000}#loading-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;font-family:Arial,sans-serif}#loading-text{margin-top:20px;color:#fff;font-size:20px;font-family:Arial,sans-serif}#loading-spinner{border:8px solid rgba(255,255,255,.3);border-top:8px solid #4caf50;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#chat-container{position:fixed;bottom:5px;left:50%;transform:translate(-50%);width:300px;max-height:163px;display:flex;flex-direction:column;background-color:#0000001a;border:1px solid #444;border-radius:8px;z-index:100;width:30%;resize:vertical}#chat-container:hover{background-color:#000000b3}#chat-box{flex:1;overflow-y:auto;padding:10px;color:#fff;font-size:14px;font-family:Arial,sans-serif;margin-top:3px}#chat-box::-webkit-scrollbar{width:8px}#chat-box::-webkit-scrollbar-track{background:#ffffff1a;border-radius:4px}#chat-box::-webkit-scrollbar-thumb{background:#4caf50;border-radius:4px}#chat-box::-webkit-scrollbar-thumb:hover{background:#45a047}#chat-box{scrollbar-width:thin;scrollbar-color:#4caf50 rgba(255,255,255,.1)}#chat-box{overflow-x:hidden}#chat-box p{margin:5px 0;text-align:left;overflow-wrap:break-word;opacity:.75}#chat-container:hover #chat-box>p{opacity:1}#chat-input{border:none;padding:10px;font-size:14px;background-color:#0000001a;color:#fff;border-top:1px solid rgba(255,255,255,.2);border-radius:0 0 8px 8px;outline:none}#chat-input:hover{background-color:#000000b3}#chat-input:focus{background-color:#000c;border-top:1px solid #4caf50;color:#fff}#chat-box:not(:hover){scrollbar-color:rgba(255,255,255,0) rgba(0,0,0,0)!important}.chatbox-view-contents>.log{position:relative;flex-grow:1;overflow:hidden;overflow-y:scroll;display:flex;flex-direction:column-reverse;line-height:1.3}.thin-scrollbar,.subtle-thin-scrollbar{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) rgba(0,0,0,.2)}.drag{position:absolute;top:0;left:10px;right:10px;border-radius:2.5px;cursor:n-resize;height:5px}.drag:before{content:"";position:absolute;top:0;left:calc(50% - 10px);width:20px;bottom:0;border-radius:10px;background-color:#fff3}.drag:after{content:"";position:absolute;top:-5px;left:0;right:0;bottom:-5px}#chat-resizer{height:10px;cursor:ns-resize;background-color:#fff3;border-top:1px solid rgba(255,255,255,.2)}.screen{position:fixed;top:0;left:0;width:100%;height:100%;flex-direction:column;justify-content:center;color:#fff;z-index:100;align-items:center;height:100vh;display:none;font-family:Arial,sans-serif;text-align:center}/*!* Back button styles *!*/.corner-button{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:8px;padding:10px 15px;font-size:14px;background:#fffc;color:#000;border:none;border-radius:5px;cursor:pointer;z-index:1000;transition:background .3s}.corner-button:hover{background:#c8c8c8e6}.corner-button.right{left:auto;right:10px}.corner-button svg{fill:#000;transition:fill .3s}.corner-button:hover svg{fill:#fff;transform:scale(1.1)}.corner-button{opacity:0;animation:fadeIn .5s forwards}#exit-button{position:absolute;top:10px;left:10px;width:40px;height:40px;background:#0003;color:#fff;border:none;border-radius:18%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000;transition:background .3s;font-size:14px}#exit-button:active{transform:scale(.9)}#exit-button svg{width:24px;height:24px;fill:#fff;transition:fill .3s,transform .2s}#exit-button:hover{background:#fff3}#exit-button:hover svg{transform:scale(1.1)}@media (max-width: 768px){.exit-button{width:32px;height:32px}.exit-button svg{width:20px;height:20px}}@keyframes fadeIn{to{opacity:1}}#in-game-ui{display:none}.disconnect-overlay,.busy-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.disconnect-content,.busy-content{color:#fff;padding:20px 40px;text-align:center;border-radius:10px;box-shadow:0 4px 10px #0000004d;background:#333c}.reconnect-button,.quit-button,.busy-reconnect-button{margin:10px;padding:10px 20px;border:none;border-radius:5px;font-size:16px;cursor:pointer;transition:background-color .2s}.quit-button{background:#f44336;color:#fff}.quit-button:hover{background:#e53935}.hidden{display:none}.reconnect-button,.busy-reconnect-button{margin-bottom:11px}#disconnect-screen,#busy-screen{font-family:Arial,sans-serif;font-weight:700}#disconnect-text,#busy-text,.result-player-text{font-weight:700}#match-result-info{font-size:22px;font-weight:700;text-align:center;margin-top:7px;display:block;margin-bottom:3px}#continue-btn{margin-top:27px;margin-bottom:3px}.connecting{cursor:default;animation:a 2.4s ease-in infinite normal!important;transform:scale(1)}.connecting.start-btn{cursor:default}#reconnect-button,#busy-reconnect-button{--a: 45deg;background:linear-gradient(var(--a),#983ab4,#2ba9c1)!important;animation-name:none}.connecting.start-btn:hover,.connecting.start-btn:active{cursor:default;transform:scale(1);box-shadow:0 4px 8px #0000004d}/*!*!*!*!* Card Selection Container *!*!*!*!*//*!*!*!*.card-selection {*!*!*!*//*!*!*!*  gap: 20px;*!*!*!*//*!*!*!*  flex-wrap: wrap;*!*!*!*//*!*!*!*  max-width: 800px;*!*!*!*//*!*!*!*  margin: 0 auto;*!*!*!*//*!*!*!*!* Individual Card *!*!*!*!*//*!*!*!*.card {*!*!*!*//*!*!*!*  background: linear-gradient(145deg, #1e3c72, #2a5298); !* Blue gradient *!*!*!*!*//*!*!*!*  color: white;*!*!*!*//*!*!*!*  text-align: center;*!*!*!*//*!*!*!*  border-radius: 12px;*!*!*!*//*!*!*!*  padding: 20px;*!*!*!*//*!*!*!*  cursor: pointer;*!*!*!*//*!*!*!*  transition: transform 0.3s ease, box-shadow 0.3s ease;*!*!*!*//*!*!*!*  width: 200px;*!*!*!*//*!*!*!*  height: 150px;*!*!*!*//*!*!*!*  display: flex;*!*!*!*//*!*!*!*  flex-direction: column;*!*!*!*//*!*!*!*  justify-content: center;*!*!*!*//*!*!*!*  align-items: center;*!*!*!*//*!*!*!*!* Hover and Active States *!*!*!*!*//*!*!*!*.card:hover {*!*!*!*//*!*!*!*  transform: translateY(-10px);*!*!*!*//*!*!*!*  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);*!*!*!*//*!*!*!*.card:active {*!*!*!*//*!*!*!*  transform: translateY(-5px);*!*!*!*//*!*!*!*  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);*!*!*!*//*!*!*!*!* Headings *!*!*!*!*//*!*!*!*.card h3 {*!*!*!*//*!*!*!*  font-size: 20px;*!*!*!*//*!*!*!*  margin-bottom: 10px;*!*!*!*//*!*!*!*  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);*!*!*!*//*!*!*!*!* Paragraph *!*!*!*!*//*!*!*!*.card p {*!*!*!*//*!*!*!*  font-size: 14px;*!*!*!*//*!*!*!*  opacity: 0.8;*!*!*!*//*!*!*!*!* Active Card *!*!*!*!*//*!*!*!*.card.active {*!*!*!*//*!*!*!*  border: 2px solid #f39c12; !* Highlight color for active selection *!*!*!*!*//*!*!*!*  transform: translateY(-10px) scale(1.05);*!*!*!*//*!*!*!*  box-shadow: 0 12px 25px rgba(243, 156, 18, 0.5); !* Gold shadow for active *!*!*!*!*//*!*!*!*}*!*!*!*//*!*!*!* Start Screen *!*!*!*//*!*!*.start-screen {*!*!*//*!*!*  height: 100vh;*!*!*//*!*!*  background: linear-gradient(145deg, #1e3c72, #2a5298); !* Blue gradient *!*!*!*//*!*!*  font-family: Arial, sans-serif;*!*!*//*!*!*.start-screen h1 {*!*!*//*!*!*  font-size: 36px;*!*!*//*!*!*  margin-bottom: 10px;*!*!*//*!*!*.start-screen p {*!*!*//*!*!*  font-size: 18px;*!*!*//*!*!*!* Mode Selector *!*!*!*//*!*!*.mode-selector {*!*!*//*!*!*  gap: 20px;*!*!*//*!*!*  flex-wrap: wrap;*!*!*//*!*!*  margin-bottom: 20px;*!*!*//*!*!*.card {*!*!*//*!*!*  background: linear-gradient(145deg, #3c3c3c, #505050); !* Dark gradient *!*!*!*//*!*!*  text-align: center;*!*!*//*!*!*  border-radius: 12px;*!*!*//*!*!*  padding: 20px;*!*!*//*!*!*  transition: transform 0.3s ease, box-shadow 0.3s ease;*!*!*//*!*!*  width: 200px;*!*!*//*!*!*  height: 150px;*!*!*//*!*!*  display: flex;*!*!*//*!*!*  flex-direction: column;*!*!*//*!*!*  justify-content: center;*!*!*//*!*!*  align-items: center;*!*!*//*!*!*    background-image: url("public/assets/start-screen/grass-mode.jpg") ;*!*!*//*!*!*     !*background-repeat: no-repeat, no-repeat;*!*!*!*//*!*!*   !*background-position: right, left;*!*!*!*//*!*!*     background-repeat:no-repeat;*!*!*//*!*!*   background-size:contain;*!*!*//*!*!*   !*height:200px;width:1200px;*!*!*!*//*!*!*.card:hover {*!*!*//*!*!*  transform: translateY(-10px);*!*!*//*!*!*  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4);*!*!*//*!*!*.card:active {*!*!*//*!*!*  transform: translateY(-5px);*!*!*//*!*!*  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);*!*!*//*!*!*.card.active {*!*!*//*!*!*  border: 2px solid #f39c12; !* Highlight active card *!*!*!*//*!*!*  transform: translateY(-10px) scale(1.05);*!*!*//*!*!*  box-shadow: 0 12px 25px rgba(243, 156, 18, 0.5); !* Gold shadow *!*!*!*//*!*!*!* Start Button *!*!*!*//*!*!*#start-game-button {*!*!*//*!*!*  padding: 10px 20px;*!*!*//*!*!*  font-size: 16px;*!*!*//*!*!*  background-color: #f39c12;*!*!*//*!*!*  color: white;*!*!*//*!*!*  border: none;*!*!*//*!*!*  border-radius: 8px;*!*!*//*!*!*  cursor: not-allowed; !* Default state *!*!*!*//*!*!*  transition: background-color 0.3s ease, transform 0.3s ease;*!*!*//*!*!*#start-game-button.enabled {*!*!*//*!*!*  cursor: pointer;*!*!*//*!*!*  background-color: #e67e22;*!*!*//*!*!*#start-game-button:hover.enabled {*!*!*//*!*!*  background-color: #d35400;*!*!*//*!*!*  transform: translateY(-3px);*!*!*//*!*!*}*!*!*//*!*!* Mode Selector Container *!*!*//*!*.mode-selector {*!*//*!*  justify-content: center;*!*//*!*  gap: 20px;*!*//*!*  margin: 20px;*!*//*!*!* Mode Card *!*!*//*!*.mode-card {*!*//*!*  display: flex;*!*//*!*  flex-direction: column;*!*//*!*  align-items: center;*!*//*!*  background: #1e1e1e;*!*//*!*  border: 2px solid #333;*!*//*!*  border-radius: 10px;*!*//*!*  overflow: hidden;*!*//*!*  cursor: pointer;*!*//*!*  transition: transform 0.3s ease, box-shadow 0.3s ease;*!*//*!*  width: 200px;*!*//*!*  height: 250px;*!*//*!*  text-align: center;*!*//*!*!* Card Hover and Active State *!*!*//*!*.mode-card:hover {*!*//*!*  transform: scale(1.05);*!*//*!*  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);*!*//*!*.mode-card.selected {*!*//*!*  border-color: #3498db; !* Highlight selected card *!*!*//*!*  box-shadow: 0 0 15px #3498db;*!*//*!*!* Card Image *!*!*//*!*.mode-card img {*!*//*!*  width: 100%;*!*//*!*  height: 70%;*!*//*!*  object-fit: cover;*!*//*!*!* Card Title *!*!*//*!*.mode-card h3 {*!*//*!*  margin: 10px 0;*!*//*!*  font-size: 18px;*!*//*!*  color: white;*!*//*!*  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);*!*//*!*}*!*//*!* Mode Selector Container *!*//*!* Card Hover and Active State *!*//*!* Card Image *!*//*!* Card Title *!*/.start-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#1e1e1e;color:#fff;height:100vh;padding:20px;font-family:Arial,sans-serif}#title-text{font-weight:700;font-size:24px;margin-bottom:30px;margin-top:8px;text-shadow:.6px .6px 0 #0000001a,-.6px .6px 0 #0000001a,.6px -.6px 0 #0000001a,-.6px -.6px 0 #0000001a,0px .6px 0 #0000001a,0px -.6px 0 #0000001a,-.6px 0px 0 #0000001a,.6px 0px 0 #0000001a,1.2px 1.2px 0 #0000001a,-1.2px 1.2px 0 #0000001a,1.2px -1.2px 0 #0000001a,-1.2px -1.2px 0 #0000001a,0px 1.2px 0 #0000001a,0px -1.2px 0 #0000001a,-1.2px 0px 0 #0000001a,1.2px 0px 0 #0000001a,.6px 1.2px 0 #0000001a,-.6px 1.2px 0 #0000001a,.6px -1.2px 0 #0000001a,-.6px -1.2px 0 #0000001a,1.2px .6px 0 #0000001a,-1.2px .6px 0 #0000001a,1.2px -.6px 0 #0000001a,-1.2px -.6px 0 #0000001a,0 2px 5px rgba(0,0,0,.5)}.subtitle{font-size:18px;margin-bottom:30px;color:#aaa}.mode-selector{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:30px}.mode-card{border:1px solid rgba(0,0,0,.4);border-radius:10px;overflow:hidden;cursor:pointer;text-align:center;position:relative;width:274px;height:192px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.mode-card img{width:100%;height:100%;object-fit:cover;pointer-events:none!important}.mode-card h3{font-size:18px;margin:10px 0 5px;color:#fff;text-shadow:.4px .4px 0 #000,-.4px .4px 0 #000,.4px -.4px 0 #000,-.4px -.4px 0 #000,0px .4px 0 #000,0px -.4px 0 #000,-.4px 0px 0 #000,.4px 0px 0 #000,.8px .8px 0 #000,-.8px .8px 0 #000,.8px -.8px 0 #000,-.8px -.8px 0 #000,0px .8px 0 #000,0px -.8px 0 #000,-.8px 0px 0 #000,.8px 0px 0 #000,.4px .8px 0 #000,-.4px .8px 0 #000,.4px -.8px 0 #000,-.4px -.8px 0 #000,.8px .4px 0 #000,-.8px .4px 0 #000,.8px -.4px 0 #000,-.8px -.4px 0 #000}.mode-card p{font-size:14px;color:#aaa;padding:0 10px 10px}.mode-card:hover{transform:scale(1.05);box-shadow:0 8px 15px #0006}.mode-card.selected{border-color:#3498db;box-shadow:0 0 15px #3498db}.mode-card:focus-within{outline:none;border-color:#3498db}@media (max-width: 768px){.mode-card{width:180px;height:240px}#classic-mode-text{font-size:18px}.mode-card p{font-size:12px}}/*!* Container for Mode Selector *!*//*!* Mode Card *!*//*!* Text Overlay Container *!*/.mode-card .overlay{position:absolute;bottom:0;left:0;width:100%;padding:60px 10px 10px;color:#fff;text-align:center;box-sizing:border-box;text-shadow:0 2px 3px rgba(0,0,0,.3);background:linear-gradient(to top,rgba(0,0,0,.85),transparent)}/*!* Title *!*/.mode-card .overlay h3{font-size:19px;margin:0;text-transform:uppercase;letter-spacing:1px;font-weight:700}/*!* Description *!*/.mode-card .overlay p{font-size:14px;margin:5px 0 0;line-height:1.5}/*!* Start Button *!*/.start-btn{color:#fff;border:none;border-radius:15px;padding:15px 30px;font-size:18px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:background .3s ease,transform .2s ease,box-shadow .3s ease;box-shadow:0 4px 8px #0000004d;background:linear-gradient(45deg,#983ab4,#2ba9c1)}.start-btn:hover{box-shadow:0 6px 12px #0006;transform:scale(1.05)}.start-btn:active{transform:scale(.95);box-shadow:0 2px 4px #0000004d}.start-btn:disabled{cursor:not-allowed;box-shadow:none}.center-align{display:flex;justify-content:center;margin-top:2px;margin-bottom:12px}@media (max-width: 768px){.start-btn{font-size:16px;padding:12px 25px}}.start-btn:focus{outline:none}#result-red-team-text,#result-blue-team-text{white-space:nowrap}#nickname-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin-bottom:23px}#nickname-input{width:252px;padding:12px 15px;font-size:16px;border-radius:11px;outline:none;transition:border-color .3s,box-shadow .3s;border:2px solid rgba(0,0,0,.375)}#nickname-input:focus{border-color:#218838;box-shadow:0 0 8px #218838cc}/*!* Button hover effects *!*//*!* Button active effect *!*/.player-message{border-radius:5px}.server-message{text-shadow:0 2px 5px rgba(0,0,0,.5);color:#8fbc8f;color:#85c988;color:#98fb98;color:#73d273}.red-player{color:#ed1164;font-weight:700}.blue-player{color:#00f}.system-info{color:#fff}#stamina-bar-container{position:absolute;bottom:14px;left:10%;width:150px;height:15px;background-color:#444;border:2px solid #000;border-radius:10px;overflow:hidden;z-index:50}#stamina-bar{height:100%;width:100%;background-color:#28a745;transition:width .1s linear}.low{color:green}.high{color:red}#changeServerBtn{color:#fff;padding:10px 15px;border:none;cursor:pointer;z-index:104;position:absolute;bottom:10px;left:10px;background:#0003;border-radius:8px}#changeServerBtn:hover{background-color:#0006}#changeServerBtn:active{transform:scale(.9)}.server-modal{z-index:104;display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#0000004d;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.server-modal-content{color:#fff;border-radius:10px;text-align:center;box-shadow:0 4px 10px #000000bf;background:#1a1a1acc;font-family:Arial,sans-serif;padding:20px 15px 20px 20px}.ping.green{color:green}.ping.orange{color:orange}.ping.red{color:red}.server-modal-content{width:80%;max-width:560px;text-align:center}.server-grid-container{z-index:104;display:flex;flex-direction:column;max-height:71vh;overflow-y:auto;margin-top:10px;overflow-x:hidden}.server-grid-header{display:grid;grid-template-columns:2fr 1fr 1fr;padding:10px;border-bottom:1px solid rgba(255,255,255,.2);font-weight:700;font-family:Arial,sans-serif;font-size:17px;text-align:left;margin-right:6px}.server-grid-body{display:grid;overflow-y:scroll;text-align:left;overflow-x:hidden}.server-row{font-size:17px;display:grid;grid-template-columns:2fr 1fr 1fr;padding:10px;cursor:pointer;transition:background .3s;border-bottom:1px solid rgba(255,255,255,.2);color:#f0f0f0}.server-row:hover{background:#444;background:#ffffff1a}.server-grid-body:not(:hover)::-webkit-scrollbar-thumb{background:#fff0!important}.server-grid-body::-webkit-scrollbar{width:5px}.server-grid-body::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.server-row.selected{background-color:#27ae604d;color:#fff}@media (max-width: 600px){.modal-content{width:95%;max-width:400px;padding:15px}.server-grid-header,.server-row{grid-template-columns:1.5fr 1fr 1fr;font-size:.9rem}#changeServerBtn{font-size:.9rem;padding:8px 16px}#selectedServer{font-size:.9rem}}.server-row span:first-of-type{overflow:hidden;white-space:nowrap;margin-right:12px}.server-row span:nth-child(2){margin-right:11px}@media (min-width: 2600px){#exit-button{width:64px;height:64px}#exit-button svg{width:40px;height:40px}#sound-button{font-size:33px}#scoreboard{font-size:38px}#timer{font-size:33px;top:70px}#chat-container{max-height:217px}#chat-box,#chat-input{font-size:24px}#reconnect-button{font-size:28px}#disconnect-text{font-size:29px}.start-btn,.start-game-btn{font-size:27px}#nickname-input{font-size:26px}#title-text{font-size:48px}.mode-card{width:422px;height:294px}.mode-card .overlay h3{font-size:29px}.mode-card .overlay p{font-size:24px}#nickname-input{width:320px}#result-blue-team-text,#result-red-team-text,#win-result-red-team-text,#win-result-blue-team-text{font-size:25px!important;margin-bottom:18px}#result-player-text,#result-goal-text,table th,table td{font-size:27px}#match-result-info{font-size:32px}#serverModal span{font-size:27px}.server-modal-content{max-width:675px}#changeServerBtn{bottom:12px;font-size:33px;padding:12px 18px 18px 13px;border-radius:17px}.cf-flex{scale:1.5;margin-top:30px}}@media (max-height: 686px){#title-text{margin-top:3.1%;margin-bottom:24px}.mode-selector{margin-bottom:29px}}@media (max-width: 600px){#continue-btn{margin-top:10px}}@media (min-width: 2000px){#title-text{font-size:34px;margin-bottom:40px}}#home-screen[x-state=connecting]>#spawn-input.captcha>#captcha-container{flex:2 2 100%;max-width:100%;box-sizing:border-box;border:none;display:block;width:100%}#home-screen[x-state=connecting]>#spawn-input{flex:0 0;width:28rem}.cf-flex{display:block;flex-flow:row}#cf-container{margin-bottom:40px}/*!* Server Table *!*//*!* Highlight selected row *!*//*!* Leaderboard styling *!*//*!* Flex styling for list *!*//*!* Each list item *!*//*!* Responsive typography *!*//*!* Media query for smaller screens *!*/#leaderboard{display:none;position:absolute;top:1%;right:.8%;background:#00000059;padding:.3rem .7rem .6rem .6rem;border-radius:8px;color:#fff;max-width:90%}#trophy{font-size:1.2rem}.pos{padding-right:.42rem!important;text-align:center!important}.score{text-align:center!important}.grid-item.player{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:151px}#scoreGrid{display:grid;grid-template-columns:auto 1fr auto;align-items:center}.grid-item{font-size:.9rem;padding:.3rem;text-align:left;text-shadow:.4px .4px 0 #0000001a,-.4px .4px 0 #0000001a,.4px -.4px 0 #0000001a,-.4px -.4px 0 #0000001a,0px .4px 0 #0000001a,0px -.4px 0 #0000001a,-.4px 0px 0 #0000001a,.4px 0px 0 #0000001a,.8px .8px 0 #0000001a,-.8px .8px 0 #0000001a,.8px -.8px 0 #0000001a,-.8px -.8px 0 #0000001a,0px .8px 0 #0000001a,0px -.8px 0 #0000001a,-.8px 0px 0 #0000001a,.8px 0px 0 #0000001a,.4px .8px 0 #0000001a,-.4px .8px 0 #0000001a,.4px -.8px 0 #0000001a,-.4px -.8px 0 #0000001a,.8px .4px 0 #0000001a,-.8px .4px 0 #0000001a,.8px -.4px 0 #0000001a,-.8px -.4px 0 #0000001a,0 2px 5px rgba(0,0,0,.5)}#leaderboard-title{font-size:1.2rem;margin-top:4px;margin-bottom:7px;text-shadow:.4px .4px 0 #000,-.4px .4px 0 #000,.4px -.4px 0 #000,-.4px -.4px 0 #000,0px .4px 0 #000,0px -.4px 0 #000,-.4px 0px 0 #000,.4px 0px 0 #000,.8px .8px 0 #000,-.8px .8px 0 #000,.8px -.8px 0 #000,-.8px -.8px 0 #000,0px .8px 0 #000,0px -.8px 0 #000,-.8px 0px 0 #000,.8px 0px 0 #000,.4px .8px 0 #000,-.4px .8px 0 #000,.4px -.8px 0 #000,-.4px -.8px 0 #000,.8px .4px 0 #000,-.8px .4px 0 #000,.8px -.4px 0 #000,-.8px -.4px 0 #000}@media (max-width: 600px){#leaderboard{top:2%;right:2%;padding:.5rem}#leaderboard h1{font-size:1.2rem}.grid-item{font-size:.9rem;padding:.2rem}}@media (min-width: 1900px){.grid-item.player{max-width:250px}}@media (min-width: 2450px){#changeServerBtn{font-size:26px}.grid-item{font-size:1.9rem;padding:.2rem}.grid-item.player{max-width:450px}#leaderboard-title,#trophy{font-size:2rem}#leaderboard{padding:.6rem 1.5rem 1.5rem}.pos{padding-right:1.7rem!important}.score{padding-left:18px!important}}