@font-face{font-family:Geist;src:url('/assets/geist-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}*{box-sizing:border-box}body{margin:0;background:#fafafa;color:#171717;font:15px Geist,Arial,sans-serif}header{background:#080808;color:white;display:flex;align-items:center;gap:12px;padding:12px 20px}header img{width:23px;height:38px;object-fit:contain}header span{font-size:18px}main{max-width:1040px;margin:auto;padding:20px}.title{display:flex;align-items:baseline;gap:12px;justify-content:space-between}h1{font-size:30px;margin:6px 0 15px}h2{font-size:20px;margin:0 0 10px}p{line-height:1.5}.prototype{background:#fff2be;border-radius:7px;padding:12px;font-size:13px}.card{background:white;border:1px solid #dedede;border-radius:9px;padding:20px;margin:16px 0}button,a{font:inherit}button{min-height:44px;padding:10px 14px;background:white;color:#171717;border:1px solid #dedede;border-radius:7px;font-weight:600;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a16800;outline-offset:3px}.yellow{background:#ffce00;border-color:#ffce00}.dark{background:#171717;color:#ffce00;border-color:#171717}.code{font-size:38px;font-weight:700;letter-spacing:5px;margin:20px 0;font-variant-numeric:tabular-nums}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px}.camera{background:#080808;color:white;border-radius:9px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;min-height:230px}.camera p{max-width:360px;color:#ccc;font-size:13px}.camera-icon{font-size:32px}.score-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.score-heading button{border:0;padding:6px;font-size:13px}.teams{display:flex;gap:8px}.team{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.team>strong{font-size:34px;font-variant-numeric:tabular-nums}.team>span{font-size:13px}.serve{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-left:5px;vertical-align:middle}.primary{width:100%;margin-bottom:8px;min-height:54px;font-size:18px}.actions{display:flex;gap:8px}.actions>*{flex:1;min-width:0}.sets{display:flex;overflow:auto;gap:6px;padding-top:8px}.set{white-space:nowrap;font-size:12px;padding:5px 8px}.selected{background:#fff2be}.tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}.muted{color:#666;font-size:13px}#message{white-space:pre-wrap}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:13px Geist,sans-serif}dialog{border:1px solid #dedede;border-radius:9px;max-width:430px;width:calc(100% - 32px);max-height:90vh;padding:20px}dialog::backdrop{background:#0008}label{display:flex;flex-direction:column;gap:5px;margin:10px 0}input,select{font:inherit;border:1px solid #bbb;border-radius:6px;min-height:44px;padding:8px;width:100%}form>button{margin:4px 4px 0 0}[hidden]{display:none!important}@media(max-width:680px){main{padding:16px}.workspace{grid-template-columns:1fr}.title{align-items:start}h1{font-size:24px}.title>span{font-size:12px;padding-top:10px}.camera{min-height:170px;padding:18px}.camera h2{font-size:17px}.camera p{margin:6px 0}.prototype{font-size:12px}.team{min-height:110px}.team>strong{font-size:38px}.tools{gap:6px}}

.team-name{display:flex!important;align-items:center;justify-content:center;gap:5px;width:100%;min-width:0}.name-text{min-width:0;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.team-name .serve{flex:none;margin-left:0}

#code-form { display:grid; gap:.75rem; max-width:28rem; }
#join-code { display:block; width:100%; font:inherit; padding:.7rem; margin-top:.35rem; }
#host-code { font-variant-numeric:tabular-nums; letter-spacing:.1em; }
.open-app { display:inline-block; padding:.7rem; font-weight:650; }
#host-invite a { display:block; margin: .75rem 0; }
.camera:has(#preview-canvas:not([hidden])) { padding:0; min-height:auto; }
#preview-canvas { width:min(100%,calc(65vh * var(--preview-aspect, 1.7778))); height:auto; max-width:100%; touch-action:none; display:block; }
#guide-control,#host label { flex-direction:row; align-items:center; }
input[type=checkbox] { width:1.15rem; height:1.15rem; min-height:0; }
.controls { min-width:0; }
.score-panel { border:1px solid #d9d9d9; border-radius:12px; background:#fff; padding:12px; display:grid; gap:8px; }
.score-panel h2 { font-size:17px; margin:0; }
.team-row { min-width:0; }
.name-row { display:grid; grid-template-columns:minmax(0,8.5rem) max-content; justify-content:space-between; gap:16px; align-items:center; }
.name-field { display:flex; align-items:center; justify-content:space-between; gap:6px; width:100%; padding:6px 8px; min-width:0; background:#fbfbfb; border-color:#adadad; text-align:left; }
.name-field>span:first-child { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.pencil { font-size:15px; flex:none; }
.serve-control { justify-self:start; min-width:60px; padding:4px; border:0; font-size:12px; }
.serve-control[aria-pressed=true] { font-weight:750; }
.video-column { min-width:0; }
.move-options { display:flex; gap:12px; flex-wrap:wrap; }
.move-options label { flex-direction:row; align-items:center; font-size:12px; min-height:44px; margin:0; cursor:pointer; }
.points-bar { display:grid; grid-template-columns:44px 1fr 44px; align-items:center; border-radius:7px; text-align:center; }
.points-bar strong { font-size:25px; font-variant-numeric:tabular-nums; }
.points-bar button { border:none; padding:0; border-radius:inherit; background:transparent; color:inherit; font-size:22px; }
.points-bar.dark,.rally-actions .dark { color:white; }
#sets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
#sets button { padding:4px; font-size:12px; background:#f1f1f1; border:0; }
#sets button[aria-pressed=true] { background:#171717; color:white; }
.rally-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.rally-actions button { width:100%; padding:5px; }
#record { margin-top:8px; }
#record-reason:empty { display:none; }
.extra-actions { display:flex; gap:6px; margin:8px 0; flex-wrap:wrap; }
summary { cursor:pointer; min-height:44px; padding:10px 2px; }
@media(min-width:681px) { .workspace { grid-template-columns:minmax(0,1fr) minmax(250px,300px);align-items:start; } }
#box-settings { display:flex; flex-wrap:wrap; gap:10px; margin:8px 0; border:1px solid #ddd; border-radius:8px; }
#box-settings label { flex:1; margin:0; }

#camera { position:relative; }
#web-commentary-preview { position:absolute; right:3%; top:5%; width:24%; aspect-ratio:4/3; object-fit:cover; border:2px solid white; border-radius:6px; background:#171717; pointer-events:none; transform:scaleX(-1); }
#web-commentary-toggle { width:100%; }
#web-commentary-toggle[aria-pressed=true] { border-color:#171717; }
#web-commentary-hint { margin:.4rem 0; }
#web-commentary-hint:empty { display:none; }
#web-commentary-copy { align-self:center; color:#171717; font-weight:650; padding:.6rem; }