*{box-sizing:border-box}body{color:#fff;background:#101c25;place-items:center;min-height:100dvh;margin:0;font-family:system-ui,sans-serif;display:grid}main{width:min(100%,460px);padding:18px 16px}header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.brand{letter-spacing:-1px;font-size:22px;font-weight:900}.brand span{color:#b5f06b}.tag{color:#a0e5be;border:1px solid #3e6959;border-radius:20px;padding:5px 9px;font-size:11px}h1{color:#a9b9c4;margin:0 0 16px;font-size:13px;font-weight:500}.stats{gap:10px;margin-bottom:12px;display:flex}.stat{background:#1c2c37;border-radius:12px;flex:1;padding:10px 12px}.stat span{color:#a9b9c4;text-transform:uppercase;letter-spacing:.7px;font-size:10px}.stat strong{font-size:23px;display:block}.court-wrap{aspect-ratio:390/510;border-radius:18px;width:100%;position:relative;overflow:hidden}canvas{touch-action:none;background:#233949;width:100%;height:100%;display:block}#grab{pointer-events:none;width:44px;height:44px;position:absolute;transform:translate(-50%,-50%)}#message{text-align:center;min-height:48px;padding:12px 0 6px;font-size:13px;font-weight:650}button{color:#172519;cursor:pointer;background:#b5f06b;border:0;border-radius:12px;width:100%;padding:14px;font:700 15px system-ui}footer{text-align:center;color:#879ba9;margin-top:13px;font-size:11px;line-height:1.6}button:focus-visible{outline-offset:3px;outline:3px solid #fff}.modes{gap:8px;margin-bottom:12px;display:flex}.modes button{color:#b8c7d1;background:#233641;padding:9px;font-size:12px}.modes button[aria-pressed=true]{color:#172519;background:#b5f06b}.round-info{color:#c5d6df;justify-content:space-between;gap:8px;margin:10px 0;font-size:11px;display:flex}#clock{font-variant-numeric:tabular-nums;color:#b5f06b;white-space:nowrap}#cue{text-align:center;color:#b5f06b;pointer-events:none;background:#10212aec;border-radius:12px;padding:10px;font-size:24px;font-weight:900;position:absolute;top:6%;left:10%;right:10%}#cue small{color:#fff;margin-top:5px;font-size:13px;display:block}#loading{text-align:center;background:#172c37;place-items:center;padding:24px;display:grid;position:absolute;inset:0}#loading[hidden]{display:none}#power{background:#182931;border-radius:8px;width:60%;height:6px;position:absolute;bottom:14px;left:20%;overflow:hidden}#power span{background:#b5f06b;height:100%;display:block}#shots{white-space:nowrap;font-size:20px}#message{justify-content:center;align-items:center;height:64px;min-height:64px;padding:10px 6px;display:flex}canvas{cursor:pointer}canvas:focus-visible{outline-offset:-2px;outline:2px solid #b5f06b}footer a{color:#a9bbc5}.modes{flex-wrap:wrap}.modes button{flex:1;min-width:90px}.aim-control{color:#c6d4d5;padding:12px 0}.aim-control label{justify-content:space-between;font-size:13px;display:flex}.aim-control input{accent-color:#c5f078;width:100%}.aim-control small{color:#93a5af;margin-top:4px;font-size:11px;line-height:1.4;display:block}#multiplayer-panel{background:#21303a;border-radius:16px;margin-bottom:16px;padding:14px}#multiplayer-panel label{color:#b9c9d0;margin:8px 0;font-size:12px;display:block}#multiplayer-panel input,#multiplayer-panel select{box-sizing:border-box;color:#fff;width:100%;font:inherit;background:#14232c;border:1px solid #516570;border-radius:8px;margin-top:4px;padding:9px;display:block}#multiplayer-panel button{color:#17282d;background:#c5f078;border:0;border-radius:10px;padding:10px;font-weight:700}#multiplayer-panel button:disabled{opacity:.5}.lobby-actions{gap:8px;margin:10px 0;display:flex}.lobby-actions button{flex:1}#room-code{color:#c5f078;letter-spacing:2px;display:block}#players{padding-left:18px;font-size:13px;line-height:1.8}#network-status{color:#b9c9d0;margin-bottom:0;font-size:12px;line-height:1.4}[hidden]{display:none!important}.audio-controls{gap:8px;margin:8px 0 4px;display:flex}.audio-controls button{color:#bdcdd5;background:#233641;padding:8px;font-size:12px}.audio-controls button[aria-pressed=true]{color:#d5f39a;background:#34564e}#audio-status{color:#9bb3ba;text-align:center;margin:0 0 12px;font-size:10px}