:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#000;color:#f7f7f7;--left:#ffba45;--right:#ffba45;--separator:#e6e6e6}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0}
.stage{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:clamp(12px,4vw,72px)}
#idle{margin:0;text-align:center;font-size:clamp(1.6rem,5.2vw,6rem);font-weight:800;line-height:1.15}
#game{width:min(100%,1960px);text-align:center}
.scoreboard{display:grid;grid-template-columns:minmax(0,1fr) clamp(21px,6.1vw,110px) minmax(0,1fr);grid-template-rows:auto auto auto;row-gap:clamp(15px,3.5vh,46px);align-items:center}
.left{grid-column:1;color:var(--left)}
.right{grid-column:3;color:var(--right)}
.team-name{grid-row:1;min-width:0;overflow-wrap:break-word;overflow-wrap:anywhere;margin:0;font-size:clamp(1.05rem,5.3vw,7rem);font-weight:900;line-height:1;letter-spacing:.005em;text-transform:uppercase;text-wrap:balance}
.team-name.long{font-size:clamp(.86rem,3.6vw,5rem)}
.team-name.extra-long{font-size:clamp(.8rem,2.75vw,4rem)}
.score,.colon{grid-row:2;display:block;width:100%;height:clamp(90px,43vh,620px);overflow:visible}
.score path{fill:currentColor}
.score .segment-off{opacity:.075}
.colon{grid-column:2;fill:var(--separator);max-width:56px;justify-self:center}
.sets{grid-row:3;grid-column:1/-1;display:grid;grid-template-columns:inherit;align-items:center;font-size:clamp(1.4rem,4.3vw,4.5rem);font-variant-numeric:tabular-nums;font-weight:900}
.sets-label{grid-column:2;color:#eee;font-size:clamp(.63rem,1.3vw,1.5rem);font-weight:800;white-space:nowrap}
#clock-line{margin-top:clamp(12px,3vh,36px);font-size:clamp(1.45rem,5.5vh,5.8rem);font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
#connection{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:clamp(.72rem,1.2vw,1rem);font-weight:700;color:#f4d499;margin:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:650px){.score,.colon{height:clamp(95px,29vw,195px)}.sets-label{font-size:.6rem}}
@media(max-height:420px) and (orientation:landscape){.stage{padding:12px 4vw}.team-name{font-size:clamp(1.1rem,4.2vw,2.75rem)}.team-name.long,.team-name.extra-long{font-size:clamp(.88rem,3vw,1.9rem)}.score,.colon{height:clamp(80px,39vh,175px)}.scoreboard{row-gap:10px}}
