:root{--color-text-primary: rgba(255, 255, 255, .87);--color-text-secondary: #eee;--color-text-panel: #f0f0f0;--color-text-white: #ffffff;--color-text-link: #ffa600;--color-text-link-hover: #ffa600;--color-text-player: #64b5f6;--color-text-system: #fff59d;--color-text-positive: #81c784;--color-text-negative: #e57373;--color-bg-general: rgba(26, 26, 26, .5);--color-bg-primary: #242424;--color-bg-overlay: #000;--color-bg-panel: rgba(0, 0, 0, .5);--color-bg-panel-light: rgba(255, 255, 255, .1);--color-bg-scrollbar-track: rgba(0, 0, 0, .3);--color-bg-hud-indicator: rgba(0, 0, 0, .3);--color-bg-progress-bar: rgba(255, 255, 255, .2);--color-accent-primary: #ffa600;--color-accent-scrollbar-thumb: #ff5722b3;--color-indicator-health: #e57373;--color-indicator-boost: var(--color-accent-primary);--font-family-main: Poppins, Avenir, Helvetica, Arial, sans-serif;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-bold: 600;--font-size-base: 1em;--font-size-xs: .6rem;--font-size-sm: .8rem;--font-size-md: 1rem;--font-size-md-sm: 1.2rem;--font-size-lg: 1.6rem;--font-size-xl: 2rem;--font-size-xxl: 2.8em;--line-height-base: 1.5;--line-height-heading: 1.1;--spacing-xxxs: .1rem;--spacing-xxs: .2rem;--spacing-xs: .6em;--spacing-sm: .8rem;--spacing-md: 1rem;--spacing-lg: 1.2em;--spacing-xl: 1.5rem;--spacing-xxl: 2rem;--spacing-xxxl: 3rem;--spacing-leaderboard-padding-right: 10px;--spacing-scrollbar-width: 8px;--spacing-scrollbar-border: 2px;--border-radius-sm: 4px;--border-radius-md: 8px;--border-radius-lg: 16px;--border-color-table: rgba(255, 255, 255, .15);--border-color-button: transparent;--blur-sm: 6px;--blur-md: 8px;--blur-lg: 12px;--blur-xl: 20px;--transition-duration: .2s;--transition-timing-function: ease-in-out;--transition-button: background-color var(--transition-duration), transform var(--transition-duration), box-shadow var(--transition-duration);--transition-bg-layer: opacity var(--transition-duration) ease-in-out;--transition-overlay: opacity var(--transition-duration) ease-in-out, visibility var(--transition-duration) ease-in-out;--z-index-background: -1;--z-index-default: 1;--z-index-sticky: 1;--z-index-panel: 2;--z-index-overlay: 10;--scrollbar-width: thin}:root{font-family:var(--font-family-main);line-height:var(--line-height-base);font-weight:var(--font-weight-normal);color-scheme:light dark;color:var(--color-text-primary);background-color:var(--color-bg-primary);font-synthesis:none;text-rendering:optimizeLegibility}a{font-weight:var(--font-weight-medium);color:var(--color-text-link);text-decoration:inherit}a:hover{color:var(--color-text-link-hover)}body{margin:0;overflow:hidden}h1{font-size:var(--font-size-xxl);line-height:var(--line-height-heading)}#app{margin:0}button{border-radius:var(--border-radius-md);border:1px solid var(--border-color-button);padding:var(--spacing-xs) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);font-family:inherit;background-color:var(--color-bg-general);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm));cursor:pointer;transition:var(--transition-button);outline:none}button:hover,button:focus,button:focus-visible{color:var(--color-accent-primary);background-color:var(--color-bg-panel)}.hidden{visibility:hidden}.disabled{opacity:.5;pointer-events:none}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:var(--color-text-link-hover)}button{background-color:#f9f9f9}}.overlay-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:var(--color-bg-overlay);opacity:1;visibility:visible;transition:var(--transition-overlay);z-index:var(--z-index-overlay)}.invisible{opacity:0;visibility:hidden}#background-container,#main-menu-container,#leaderboard-container,#customize-container,#settings-container,#solo-practice-container{z-index:var(--z-index-panel)}#background-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:var(--z-index-background)}.themed-container{background-color:var(--color-bg-general);-webkit-backdrop-filter:blur(var(--blur-md));backdrop-filter:blur(var(--blur-md));border-radius:var(--border-radius-md);padding:var(--spacing-sm)}.bg-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-image:url(/assets/images/main-menu.png);background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:var(--transition-bg-layer)}.bg-layer.visible{opacity:1}.panel-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80%;max-width:1024px;background:var(--color-bg-panel);-webkit-backdrop-filter:blur(var(--blur-lg));backdrop-filter:blur(var(--blur-lg));padding:var(--spacing-xxl);border-radius:var(--border-radius-md);color:var(--color-text-panel);box-shadow:0 4px 15px #0000004d;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl)}.panel-header{font-size:var(--font-size-xl);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-md);color:var(--color-text-white);width:100%;text-align:center}.panel-button-container{width:100%;display:flex;justify-content:center;margin-top:var(--spacing-md)}.panel-button{font-size:var(--font-size-md-sm);font-weight:var(--font-weight-normal)}.hidden{display:none}#main-menu-container{position:absolute;top:0;left:0;width:100%;height:100%}.main-menu-button-container{position:absolute;bottom:15%;left:5%;min-width:20%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-md)}.main-menu-button{font-size:var(--font-size-lg);font-weight:var(--font-weight-normal);width:100%}.solo-practice-container{position:absolute;inset:0;padding:var(--spacing-md)}.flex1{flex:1}.centerTxt{text-align:center}.leaderboard-list-container{width:100%;max-height:60vh;overflow-y:auto;padding-right:var(--spacing-leaderboard-padding-right);scrollbar-width:var(--scrollbar-width);scrollbar-color:var(--color-accent-scrollbar-thumb) var(--color-bg-scrollbar-track)}.leaderboard-list-container::-webkit-scrollbar{width:var(--spacing-scrollbar-width)}.leaderboard-list-container::-webkit-scrollbar-track{background:var(--color-bg-scrollbar-track);border-radius:var(--border-radius-sm)}.leaderboard-list-container::-webkit-scrollbar-thumb{background-color:var(--color-accent-scrollbar-thumb);border-radius:var(--border-radius-sm);border:var(--spacing-scrollbar-border) solid transparent;background-clip:content-box}.leaderboard-table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--font-size-sm)}.leaderboard-table th,.leaderboard-table td{padding:var(--spacing-md) var(--spacing-sm);border-bottom:1px solid var(--border-color-table);vertical-align:middle}.leaderboard-table th{font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--color-text-white);background-color:var(--color-bg-panel-light);-webkit-backdrop-filter:blur(var(--blur-xl));backdrop-filter:blur(var(--blur-xl));position:sticky;top:0;z-index:var(--z-index-sticky)}.leaderboard-table tbody tr:hover{background-color:var(--color-bg-panel-light);cursor:pointer;color:var(--color-accent-primary)}.leaderboard-table th:nth-child(1),.leaderboard-table td:nth-child(1){text-align:center;width:5%}.leaderboard-table th:nth-child(3),.leaderboard-table td:nth-child(3){text-align:right}.leaderboard-table th:nth-child(4),.leaderboard-table td:nth-child(4){text-align:center}.leaderboard-table th:nth-child(5),.leaderboard-table td:nth-child(5){text-align:right;width:15%}.multiplayer-container{position:absolute;inset:0;padding:var(--spacing-md) var(--spacing-xxxl)}.room-container{position:absolute;top:var(--spacing-md);right:var(--spacing-xxxl);width:20%;display:flex;flex-direction:column;gap:var(--spacing-sm)}.room-header-container{display:flex;justify-content:space-evenly;gap:var(--spacing-sm)}.messages-container{overflow:hidden;display:flex;flex-direction:column;background-color:var(--color-bg-general);-webkit-backdrop-filter:blur(var(--blur-md));backdrop-filter:blur(var(--blur-md));border-radius:var(--border-radius-md);padding:var(--spacing-sm)}.message-row{font-size:var(--font-size-base);padding:var(--spacing-xxs);color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:1}@keyframes fade-slide-in-right{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}.message-enter{animation:fade-slide-in-right .3s ease-out forwards}.text-player-name{color:var(--color-text-player);font-weight:700}.text-system-event{color:var(--color-text-system);font-style:italic}.text-action-positive{color:var(--color-text-positive)}.text-action-negative{color:var(--color-text-negative)}.icon-skull{margin-right:4px}.vehicle-hud-container{position:absolute;bottom:var(--spacing-md);right:var(--spacing-xxxl);width:20%;display:flex;flex-direction:column;gap:var(--spacing-md)}.hud-indicator{position:relative;display:flex;align-items:center;gap:var(--spacing-sm);background-color:var(--color-bg-hud-indicator);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm));padding:var(--spacing-xs) var(--spacing-xl) var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-md);color:var(--color-text-primary);overflow:hidden}.small-hud-indicator{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:var(--spacing-sm);background-color:var(--color-bg-hud-indicator);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm));padding:var(--spacing-xxxs) var(--spacing-xl) var(--spacing-xxxs) var(--spacing-sm);border-radius:var(--border-radius-md);color:var(--color-text-primary);width:fit-content;align-self:flex-end;overflow:hidden}.small-hud-indicator .progress-ring{width:34px;height:34px}.small-hud-indicator .progress-ring-background{stroke:var(--color-bg-progress-bar)}.circle-hud{padding:var(--spacing-xs) var(--spacing-xl) var(--spacing-xs) var(--spacing-lg)}.hud-key-container{position:absolute;bottom:0;right:0;background-color:var(--color-text-primary);color:#000;border-top-left-radius:var(--border-radius-md);padding:0 var(--spacing-xxs);font-size:var(--font-size-xs);min-width:30px;text-align:center}.hud-remaining-rocket{font-size:var(--font-size-xl)}.hud-total-rocket{font-size:var(--font-size-sm)}.hud-icon{font-size:var(--font-size-lg);width:40px;text-align:center}.progress-bar-container{flex-grow:1;height:10px;background-color:var(--color-bg-progress-bar);border-radius:var(--border-radius-sm);overflow:hidden}.progress-bar-fill{height:100%;width:0%;transition:width .3s ease-out;border-radius:var(--border-radius-sm)}.progress-bar-fill.health{background-color:var(--color-indicator-health);width:100%}.progress-bar-fill.boost{background-color:var(--color-indicator-boost);width:100%}.hud-value{font-size:var(--font-size-base);font-weight:700;min-width:40px;text-align:right}#notification-area{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:10px;width:320px}.notification{padding:12px 18px;border-radius:10px;color:#fff;font-family:Arial,sans-serif;font-size:18px;box-shadow:0 5px 15px #0003;opacity:0;transform:translate(100%);animation:slideInHold .5s forwards;margin-bottom:10px;display:flex;align-items:center;background-color:#00000080;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.notification:not(.notification-persistent){animation:slideInHold .5s forwards,fadeOutNotification .5s forwards var(--notification-duration, 3s)}.notification-emoji{font-size:2em;margin-right:12px;line-height:1}.notification-message{flex-grow:1}.notification-info{background-color:#2f80edb3}.notification-success{background-color:#27ae60b3}.notification-warn{background-color:#f2994ab3}.notification-error{background-color:#eb5757b3}.notification-gamepad{background-color:#a04aa8b3}@keyframes slideInHold{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes fadeOutNotification{to{opacity:0;transform:translateY(-20px)}}