:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#loader{z-index:100;background:#101820;flex-direction:column;justify-content:center;align-items:center;gap:1.2rem;transition:opacity .45s,visibility .45s;display:flex;position:fixed;inset:0}#loader.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-spinner{border:3px solid #ffffff24;border-top-color:#7ee08a;border-radius:50%;width:36px;height:36px;animation:.9s linear infinite loader-spin}@keyframes loader-spin{to{transform:rotate(360deg)}}.auth-layout{width:min(960px,100vw - 1.5rem);max-width:100%;padding:max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));box-sizing:border-box;justify-content:center;align-items:center;gap:clamp(1rem,3vw,2rem);min-height:100vh;margin:0 auto;display:flex}@supports not (height:100dvh){.auth-layout{min-height:100vh}}.brand-logo{object-fit:contain;filter:drop-shadow(0 6px 18px #00000073);flex-shrink:0;height:auto;display:block}@media (orientation:portrait){.auth-layout{padding-top:max(1rem, env(safe-area-inset-top));padding-bottom:max(1rem, env(safe-area-inset-bottom));flex-direction:column;justify-content:center}.brand-logo{width:min(320px,72vw);max-width:72vw;margin:0 auto}.auth-layout .lobby-card{box-sizing:border-box;width:min(360px,100vw - 1.5rem);max-width:100%}}@media (orientation:landscape) and (max-width:960px){.auth-layout{flex-direction:row;gap:clamp(.75rem,2vw,1.5rem)}.brand-logo{width:min(260px,34vw);max-width:34vw;max-height:68vh}.auth-layout .lobby-card{flex-shrink:0;width:min(360px,46vw);max-width:46vw}}@media (min-width:768px) and (orientation:landscape){.brand-logo{width:min(420px,38vw)}}@media (display-mode:standalone){.auth-layout{padding-left:max(.75rem, env(safe-area-inset-left));padding-right:max(.75rem, env(safe-area-inset-right))}}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#101820;width:100%;height:100%;overflow:hidden}#app{position:fixed;inset:0}#app canvas{touch-action:none;display:block}#hud{z-index:5;position:fixed;top:.75rem;left:.75rem}#connection-status,#identity-control{display:none!important}#connection-status[data-status=connected]{color:#7ee08a;border-color:#7ee08a8c}#connection-status[data-status=error],#connection-status[data-status=disconnected]{color:#ef8a7c;border-color:#ef8a7c8c}#match-hud{z-index:5;pointer-events:none;font-variant-numeric:tabular-nums;flex-direction:column;align-items:center;gap:.18rem;display:flex;position:fixed;top:max(5rem,18vh);left:50%;transform:translate(-50%)}#match-score{display:none!important}#match-state{letter-spacing:.14em;color:#ffffffeb;text-shadow:0 2px 6px #000000d9,0 0 12px #00000073;font-size:.62rem;font-weight:700}#match-state[data-state=PLAYING]{display:none!important}#match-countdown{color:#f8fafc;text-shadow:0 2px 8px #000000e6,0 4px 18px #0009,0 0 22px #00000073;opacity:0;margin-top:2.8rem;font-size:4rem;font-weight:900;transition:opacity .12s ease-out,transform .12s ease-out;transform:scale(.9)}#match-countdown[data-visible=true]{opacity:1;transform:scale(1)}#private-lobby{z-index:10;pointer-events:auto;padding:max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));box-sizing:border-box;background:#080c10b8;justify-content:center;align-items:center;min-height:100vh;display:flex;position:fixed;inset:0;overflow:hidden auto}.lobby-card{background:#101820eb;border:1px solid #ffffff24;border-radius:12px;flex-direction:column;gap:.5rem;min-width:180px;padding:.7rem;display:flex}.lobby-card h2{letter-spacing:.12em;color:#ffffffe6;font-size:.7rem}.lobby-code{letter-spacing:.2em;color:#7ee08a;min-height:1.4rem;font-family:ui-monospace,monospace;font-size:1.2rem;font-weight:900}.lobby-join{gap:.3rem;display:flex}.lobby-join input{text-transform:uppercase;width:6rem}.lobby-status{color:#ffffffb3;min-height:.8rem;font-size:.62rem}#home-menu,#private-lobby,.auth-modal{z-index:10;pointer-events:auto;padding:max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));box-sizing:border-box;background:#080c10b8;justify-content:center;align-items:center;min-height:100vh;display:flex;position:fixed;inset:0;overflow:hidden auto}@supports not (height:100dvh){#home-menu,#private-lobby,.auth-modal{min-height:100vh}}#home-menu .lobby-card{gap:.6rem;min-width:220px}#home-menu button{letter-spacing:.08em;padding:.55rem .8rem;font-weight:800}.menu-placeholder-row{gap:.5rem;display:flex}.menu-placeholder-row button{opacity:.45;flex:1}#match-queue{z-index:10;pointer-events:auto;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#match-queue .lobby-card{gap:.6rem;min-width:220px}#match-queue #queue-status{letter-spacing:.1em;color:#f4d35e;font-size:.85rem;font-weight:800}#scoreboard{display:none!important}.shot-feedback{z-index:7;letter-spacing:.05em;opacity:0;pointer-events:none;font-size:2.4rem;font-weight:800;transition:opacity .18s ease-out,transform .18s ease-out;position:fixed;top:28%;left:50%;transform:translate(-50%,-50%)scale(.8)}.shot-feedback-visible{opacity:1;transform:translate(-50%,-50%)scale(1)}.shot-feedback-make{color:#7ee08a;text-shadow:0 0 16px #7ee08a99}.shot-feedback-swish{color:#7ee0ff;text-shadow:0 0 18px #7ee0ffa6}.shot-feedback-miss{color:#ef8a7c;text-shadow:0 0 16px #ef8a7c80}#joystick{left:max(1.25rem, env(safe-area-inset-left));bottom:max(1.25rem, env(safe-area-inset-bottom));z-index:6;position:fixed}#joystick-base{touch-action:none;-webkit-user-select:none;user-select:none;background:#10182073;border:2px solid #e8edf259;border-radius:50%;width:7.5rem;height:7.5rem;position:relative}#joystick-thumb{pointer-events:none;background:#e8edf2d9;border:2px solid #10182080;border-radius:50%;width:3.1rem;height:3.1rem;margin:-1.55rem 0 0 -1.55rem;position:absolute;top:50%;left:50%}#debug-hud{z-index:7;color:#9fe8a8;letter-spacing:.02em;pointer-events:none;background:#101820cc;border-radius:.4rem;padding:.35rem .6rem;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:.72rem;position:fixed;top:.75rem;right:.75rem}#action-zone{right:max(1.25rem, env(safe-area-inset-right));bottom:max(1.25rem, env(safe-area-inset-bottom));z-index:6;flex-direction:column;gap:.9rem;display:flex;position:fixed}.action-button{color:#e8edf28c;letter-spacing:.08em;touch-action:none;-webkit-user-select:none;user-select:none;background:#10182073;border:2px solid #e8edf266;border-radius:50%;width:4.6rem;height:4.6rem;font-size:.72rem;font-weight:700}.action-button:disabled{cursor:default}#rotate-hint{z-index:10;text-align:center;color:#e8edf2;background:#101820;justify-content:center;align-items:center;padding:1.5rem;font-size:1.05rem;display:none;position:fixed;inset:0}@media (orientation:portrait){#rotate-hint{display:flex}}#shot-meter{left:50%;bottom:max(1.25rem, env(safe-area-inset-bottom));z-index:6;background:#1018208c;border:2px solid #e8edf259;border-radius:999px;width:min(22rem,70vw);height:1.4rem;display:none;position:fixed;overflow:hidden;transform:translate(-50%)}.shot-meter-zone{position:absolute;top:0;bottom:0}.shot-meter-zone.good{background:#7ee08a47}.shot-meter-zone.perfect{background:#7ee08a99}.shot-meter-fill{background:linear-gradient(90deg,#e8edf28c,#7ee08ad9);width:0%;position:absolute;top:0;bottom:0;left:0}.shot-meter-marker{background:#e8edf2;width:.18rem;height:1.8rem;margin-left:-.09rem;position:absolute;top:-.2rem}.shot-meter-result{letter-spacing:.1em;color:#e8edf2;text-shadow:0 1px 2px #0009;opacity:0;justify-content:center;align-items:center;font-size:.7rem;font-weight:700;display:flex;position:absolute;inset:0}.shot-meter-result.perfect,.shot-meter-result.good,.shot-meter-result.early,.shot-meter-result.late{opacity:1}.shot-meter-result.perfect{color:#7ee08a}.shot-meter-result.good{color:#cfe8a8}.shot-meter-result.early,.shot-meter-result.late{color:#efc07c}#auth-panel{z-index:20;pointer-events:none;position:fixed;inset:0}.auth-modal{pointer-events:auto;background:#080c10b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.auth-modal.hidden,.auth-widget.hidden,.auth-stats-panel.hidden{display:none}.auth-card{gap:.55rem;min-width:260px}.auth-toggle{gap:.3rem;display:flex}.auth-toggle button{letter-spacing:.06em;opacity:.55;color:#e8edf2;background:#ffffff0f;border:1px solid #ffffff24;border-radius:8px;flex:1;padding:.4rem;font-weight:700}.auth-toggle button.active{opacity:1;border-color:#7ee08a}.auth-card input{color:#e8edf2;background:#080c1099;border:1px solid #ffffff2e;border-radius:8px;padding:.5rem .6rem;font-size:.85rem}.auth-submit{letter-spacing:.08em;color:#101820;background:#7ee08a;border:none;border-radius:8px;padding:.55rem;font-weight:800}.auth-guest{color:#e8edf2b3;background:0 0;border:none;padding:.2rem;font-size:.72rem;text-decoration:underline}.auth-error{color:#ef8a8a;min-height:.9rem;font-size:.68rem}.auth-widget{z-index:21;pointer-events:auto;flex-direction:column;align-items:flex-end;gap:.3rem;display:flex;position:fixed;top:.75rem;right:.75rem}.auth-widget-row{background:#101820d9;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:.3rem;padding:.35rem .5rem;display:flex}.auth-display{color:#e8edf2;text-overflow:ellipsis;white-space:nowrap;max-width:8rem;font-size:.72rem;font-weight:700;overflow:hidden}.auth-mini{letter-spacing:.04em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:999px;padding:.25rem .5rem;font-size:.68rem;font-weight:700}#auth-stats{margin-left:.5rem}.auth-stats-panel{background:#101820f2;border:1px solid #ffffff24;border-radius:12px;width:220px;padding:.6rem}.auth-stats-grid{text-align:center;grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.auth-stats-grid div{flex-direction:column;gap:.1rem;display:flex}.auth-stats-grid span{color:#7ee08a;font-size:1.1rem;font-weight:900}.auth-stats-grid label{letter-spacing:.05em;color:#e8edf2b3;text-transform:uppercase;font-size:.58rem}#home-menu .menu-ranked{color:#7ee08a;border-color:#7ee08a}#home-menu .menu-secondary{opacity:.8;letter-spacing:.08em;font-size:.7rem}#leaderboard-panel{z-index:20;pointer-events:auto;background:#080c10b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.leaderboard-card{gap:.5rem;min-width:280px;max-width:92vw;max-height:80vh;overflow:hidden}.leaderboard-list{flex-direction:column;gap:.25rem;max-height:50vh;display:flex;overflow-y:auto}.leaderboard-row{background:#ffffff0d;border-radius:8px;grid-template-columns:2.2rem 1fr auto auto;align-items:center;gap:.5rem;padding:.3rem .4rem;font-size:.78rem;display:grid}.lb-rank{color:#7ee08a;font-weight:900}.lb-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.lb-rating{color:#e8edf2;font-weight:700}.lb-record{color:#e8edf2b3;font-size:.68rem}.leaderboard-empty{color:#e8edf2b3;text-align:center;padding:.5rem;font-size:.75rem}.leaderboard-nav{justify-content:space-between;gap:.3rem;display:flex}.leaderboard-nav button{letter-spacing:.06em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;flex:1;padding:.45rem;font-weight:700}.leaderboard-nav button:disabled{opacity:.4}#customization-panel{z-index:20;pointer-events:auto;background:#080c10b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.customize-card{gap:.5rem;min-width:280px;max-width:92vw;max-height:85vh;overflow:hidden}#customize-preview{justify-content:center;display:flex}#customize-preview canvas{background:#ffffff0a;border-radius:10px}.customize-slots{flex-wrap:wrap;gap:.25rem;display:flex}.customize-slots button{letter-spacing:.05em;color:#e8edf2;background:#ffffff0f;border:1px solid #ffffff24;border-radius:8px;flex:1;min-width:3.2rem;padding:.4rem .3rem;font-size:.62rem;font-weight:700}.customize-slots button.active{color:#7ee08a;border-color:#7ee08a}.customize-items{flex-direction:column;gap:.3rem;max-height:34vh;display:flex;overflow-y:auto}.customize-item{color:#e8edf2;text-align:left;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;grid-template-columns:1.6rem 1fr auto;align-items:center;gap:.5rem;padding:.35rem .5rem;font-size:.78rem;display:grid}.customize-item.selected{border-color:#7ee08a}.customize-item.locked{opacity:.5}.customize-item .swatch{border:1px solid #ffffff40;border-radius:999px;width:1.2rem;height:1.2rem}.customize-item .item-lock{color:#e8edf2b3;font-size:.62rem}.customize-nav{gap:.3rem;display:flex}.customize-nav button{letter-spacing:.07em;border-radius:8px;flex:1;padding:.5rem;font-weight:800}#customize-equip{color:#101820;background:#7ee08a;border:none}#customize-close{color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24}#customize-equip:disabled{opacity:.4}.feedback-defense{color:#7fd4e8}#scoreboard.score-flash{animation:.4s ease-out score-flash-pulse}@keyframes score-flash-pulse{0%{transform:scale(1.35)}to{transform:scale(1)}}#tutorial-overlay{z-index:30;pointer-events:auto;background:#080c10c7;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.tutorial-card{gap:.6rem;min-width:260px;max-width:90vw}.tutorial-card p{color:#e8edf2e6;font-size:.85rem;line-height:1.4}.tutorial-nav{gap:.3rem;display:flex}.tutorial-nav button{letter-spacing:.07em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;flex:1;padding:.5rem;font-weight:800}.tutorial-nav button:last-child{color:#101820;background:#7ee08a;border:none}#settings-panel{z-index:20;pointer-events:auto;background:#080c10b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.settings-card{gap:.6rem;min-width:260px}.settings-row{color:#e8edf2e6;justify-content:space-between;align-items:center;gap:.6rem;font-size:.8rem;display:flex}.settings-row input[type=range]{flex:1;max-width:10rem}.settings-card>button{letter-spacing:.07em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;padding:.5rem;font-weight:800}#hud{top:calc(.75rem + env(safe-area-inset-top));left:calc(.75rem + env(safe-area-inset-left))}#auth-widget{top:calc(.75rem + env(safe-area-inset-top));right:calc(.75rem + env(safe-area-inset-right))}#action-zone{bottom:calc(.75rem + env(safe-area-inset-bottom))}#joystick{bottom:calc(1rem + env(safe-area-inset-bottom));left:calc(1rem + env(safe-area-inset-left))}#rotate-hint{padding-top:env(safe-area-inset-top)}@media (display-mode:standalone){.lobby-card{margin:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}}.connection-lost{z-index:25;color:#ef8a7c;letter-spacing:.1em;pointer-events:none;background:#101820eb;border:1px solid #ef8a7c99;border-radius:999px;padding:.6rem 1.2rem;font-size:.8rem;font-weight:800;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.connection-lost.hidden{display:none}.room-code{letter-spacing:.12em;color:#7ee08a;background:#101820d9;border:1px solid #7ee08a8c;border-radius:999px;margin-top:.35rem;padding:.3rem .7rem;font-size:.8rem;font-weight:800;display:inline-block}.room-code.hidden{display:none}.hud-pill{letter-spacing:.06em;color:#e8edf2;cursor:pointer;background:#101820bf;border:1px solid #ffffff2e;border-radius:999px;margin-right:.35rem;padding:.3rem .7rem;font-size:.75rem;font-weight:700;display:inline-block}.hud-dropdown{z-index:15;background:#101820f2;border:1px solid #ffffff29;border-radius:10px;flex-direction:column;gap:.3rem;min-width:10rem;padding:.4rem;display:flex;position:fixed;top:3.2rem;left:.75rem}.hud-dropdown.hidden{display:none}.hud-dropdown button{letter-spacing:.07em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;padding:.5rem;font-weight:800}.roster-dropdown{min-width:14rem}.roster-team{letter-spacing:.08em;color:#e8edf299;margin-top:.3rem;font-size:.62rem;font-weight:800}.roster-row{justify-content:space-between;gap:.5rem;padding:.2rem .1rem;font-size:.78rem;display:flex}.roster-points{color:#7ee08a;font-weight:800}.roster-reconnecting{color:#efc07c;font-size:.62rem}.roster-empty{color:#e8edf2b3;font-size:.72rem}.pause-overlay{z-index:30;pointer-events:auto;background:#080c10cc;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pause-overlay.hidden{display:none}.pause-card{gap:.6rem;min-width:260px}.pause-card p{color:#e8edf2e6;text-align:center;font-size:.8rem}.pause-card button{letter-spacing:.07em;color:#101820;background:#ef8a7c;border:none;border-radius:8px;padding:.55rem;font-weight:800}.player-left-toast{z-index:16;color:#efc07c;letter-spacing:.06em;pointer-events:none;background:#101820eb;border:1px solid #efc07c99;border-radius:999px;padding:.5rem 1rem;font-size:.78rem;font-weight:800;position:fixed;top:4.2rem;left:50%;transform:translate(-50%)}.player-left-toast.hidden{display:none}.match-result-overlay{z-index:30;pointer-events:auto;background:#080c10d1;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.match-result-overlay.hidden{display:none}.result-card{gap:.5rem;min-width:280px;max-width:92vw}.result-score{letter-spacing:.05em;color:#e8edf2;text-align:center;font-size:1rem;font-weight:900}.result-team{letter-spacing:.08em;color:#e8edf299;margin-top:.4rem;font-size:.62rem;font-weight:800}.result-row{justify-content:space-between;gap:.5rem;padding:.25rem .1rem;font-size:.8rem;display:flex}.result-points{color:#7ee08a;font-weight:800}.result-mvp{color:#efc07c;font-weight:900}.result-card>button{letter-spacing:.07em;color:#e8edf2;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;padding:.55rem;font-weight:800}.confetti-canvas{z-index:31;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}.score-celebration{z-index:32;pointer-events:none;justify-content:center;align-items:flex-start;padding-top:min(18vh,180px);display:flex;position:fixed;inset:0}.score-celebration-text{letter-spacing:.08em;text-shadow:0 0 18px #7ee08a99;font-size:3.2rem;font-weight:900;animation:.35s ease-out score-celebration-pop}.score-celebration-text.two-point{text-align:center;overflow-wrap:anywhere;color:#7ee08a;text-shadow:0 0 24px #7ee08acc;max-width:92vw;font-size:clamp(3.2rem,11vw,7rem);line-height:.9}.score-celebration-text.perfect-cue{color:#efc07c;text-shadow:0 0 16px #efc07cb3;font-size:2.6rem}.score-celebration-text.one-point{color:#e8edf2;font-size:2.2rem}@keyframes score-celebration-pop{0%{opacity:0;transform:scale(.4)}60%{opacity:1;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}