:root{color-scheme:dark;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;height:100vh;overflow:hidden;background:radial-gradient(1200px 800px at 50% -10%,#16203a,#05060f 60%);color:#cfe0f0}#stage{display:grid;grid-template-columns:25% 50% 25%;height:100vh;width:100vw}#game-col{position:relative;height:100vh;min-width:0}#game{display:block;width:100%;height:100%;box-shadow:0 0 60px #5ad1ff26,0 10px 40px #0009;background:#05060f}#cam{position:relative;width:100%;margin-bottom:12px;border-radius:8px;overflow:hidden;border:1px solid rgba(127,209,255,.4);background:#000}#video{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;transform:scaleX(-1)}#cam-label{font-size:10px;letter-spacing:.1em;text-align:center;padding:2px;color:#7fd1ff;text-transform:uppercase}#ui{height:100vh;overflow-y:auto;padding:20px}#recordings{display:flex;flex-direction:column;height:100vh;overflow:hidden;padding:20px}.rec-head{font:700 11px/1 ui-monospace,Menlo,monospace;letter-spacing:.12em;color:#7fd1ff;margin-bottom:10px}.upload-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:#cfe0f0;cursor:pointer}.upload-toggle input{width:16px;height:16px;accent-color:#7fd1ff;cursor:pointer}.rec-quota{margin:6px 0 12px;font-size:11px;color:#7f93a8;min-height:1.3em}#recordingsList{display:flex;flex-direction:column;gap:8px;flex:0 1 auto;overflow-y:auto;min-height:0}#leaderboard{flex:none;margin-top:14px;padding:10px;background:#0c1424;border:1px solid rgba(127,209,255,.18);border-radius:8px}.lb-head{font:700 11px/1 ui-monospace,Menlo,monospace;letter-spacing:.12em;color:#7fd1ff;margin-bottom:8px}#leaderboardList{list-style:none;margin:0;padding:0}.lb-row{display:grid;grid-template-columns:22px 1fr auto;gap:8px;font:12px/1.8 ui-monospace,Menlo,monospace;color:#cfe0f0}.lb-rank{color:#7f93a8}.lb-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-score{font-variant-numeric:tabular-nums}.lb-empty{font:12px/1.6 system-ui,sans-serif;color:#7f93a8;list-style:none}.lb-you{margin:8px 0 0;font-size:11px;color:#8dff9e;min-height:1.3em}.rec-empty{font-size:12px;color:#7f93a8;margin:0}.rec-item{padding:8px 10px;background:#0c1424;border:1px solid rgba(127,209,255,.18);border-radius:8px}.rec-name{font-size:12px;color:#cfe0f0;line-height:1.3;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rec-status{font:10px/1 ui-monospace,Menlo,monospace;letter-spacing:.06em;color:#7f93a8;margin-bottom:6px}.rec-status.uploaded{color:#8dff9e}.rec-actions{display:flex;flex-wrap:wrap;gap:4px}.rec-actions button{flex:1 1 auto;padding:4px 8px;font:11px/1 system-ui,sans-serif;border:1px solid rgba(127,209,255,.3);border-radius:6px;background:#7fd1ff14;color:#cfe0f0;cursor:pointer}.rec-actions button:hover{background:#7fd1ff2e}.rec-actions button.rec-del{border-color:#ff787866;color:#ffb0b0}.rec-actions button.rec-del:hover{background:#ff787829}.rec-actions button.rec-up{border-color:#8dff9e66;color:#8dff9e}.rec-actions button.rec-up:hover{background:#8dff9e29}#record-select{margin-bottom:12px}.record-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:#cfe0f0;cursor:pointer}.record-toggle input{width:16px;height:16px;accent-color:#ff5a5a;cursor:pointer}#recordStatus{margin:6px 0 0;font-size:11px;color:#7f93a8;min-height:1.3em}.rec-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#03060fd1}.rec-modal-box{display:flex;flex-direction:column;gap:10px;max-width:min(90vw,900px);padding:16px;background:#0c1424;border:1px solid rgba(127,209,255,.28);border-radius:12px}.rec-modal-box video{max-width:100%;max-height:70vh;border-radius:8px;background:#000}.rec-modal-cap{font-size:12px;color:#9fb6c9}.rec-modal-close{align-self:flex-end;padding:8px 16px;border:0;border-radius:8px;background:linear-gradient(180deg,#5ad1ff,#2f9bd6);color:#042033;font:700 13px system-ui,sans-serif;cursor:pointer}#account{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;min-height:28px;font-size:12px;color:#9fb6c9}#account-user{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#logoutBtn{flex:none;padding:6px 12px;border:1px solid rgba(127,209,255,.3);border-radius:7px;background:#7fd1ff14;color:#cfe0f0;font:inherit;font-size:12px;cursor:pointer}#logoutBtn:hover{background:#7fd1ff29}#adminBtn{flex:none;padding:6px 12px;border:1px solid rgba(141,255,158,.4);border-radius:7px;background:#8dff9e1a;color:#8dff9e;font-size:12px;text-decoration:none}#adminBtn:hover{background:#8dff9e2e}#lobbyBtn{flex:none;padding:6px 10px;border:1px solid rgba(127,209,255,.3);border-radius:7px;background:#7fd1ff14;color:#cfe0f0;font-size:12px;text-decoration:none}#lobbyBtn:hover{background:#7fd1ff29}#camera-select{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}#camera-select label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#7f93a8}#cameraSel{width:100%;padding:8px 10px;border-radius:8px;border:1px solid rgba(127,209,255,.28);background:#0c1424;color:#cfe0f0;font:inherit;font-size:13px;cursor:pointer}#cameraSel:focus{outline:none;border-color:#7fd1ff}#cameraSel:disabled{opacity:.55;cursor:default}#startBtn{width:100%;padding:14px;font-size:18px;font-weight:700;letter-spacing:.06em;border:0;border-radius:10px;background:linear-gradient(180deg,#5ad1ff,#2f9bd6);color:#042033;cursor:pointer}#startBtn:disabled{filter:grayscale(.6) brightness(.7);cursor:not-allowed}#status{font-size:13px;line-height:1.5;color:#9fb6c9;min-height:2.5em}#help{font-size:13px;color:#9fb6c9}#help ul{padding-left:18px}#help li{margin:6px 0}#punchPanel{margin:14px 0;padding:10px;background:#0c1424;border:1px solid rgba(141,255,158,.18);border-radius:8px}.pp-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}.pp-title{font:700 11px/1 ui-monospace,Menlo,monospace;letter-spacing:.12em;color:#8dff9e}.pp-mult{font:700 12px/1 ui-monospace,Menlo,monospace;color:#ffe14d}#punchGraph{display:block;width:100%;height:80px;border-radius:4px;background:#070d18}.pp-stats{display:flex;justify-content:space-between;margin-top:6px;font:11px/1 ui-monospace,Menlo,monospace;color:#7f93a8}