:root{color-scheme:dark;font-family:Arial,sans-serif;color:#f7f3e8;background:#070d19;--gold:#f7c34a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#1b304e,transparent 70%);min-height:100dvh}main{max-width:1500px;margin:auto;padding:30px}h1{font-size:clamp(26px,4vw,58px);margin:8px 0;letter-spacing:-2px}h2{margin:5px 0 20px}p{color:#aebed3}small,.eyebrow{color:var(--gold);font-weight:bold;letter-spacing:3px;font-size:11px;text-transform:uppercase}.toolbar,header{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:20px}.toolbar{flex-wrap:wrap}form,.card{background:#101c30;border:1px solid #2f4058;border-radius:14px;padding:22px;margin-bottom:16px}form{max-width:620px;display:grid;gap:14px}input,select,button{font:inherit;padding:13px;border:1px solid #40506a;border-radius:7px;background:#101a2b;color:inherit}button{cursor:pointer;font-weight:bold}button.primary{background:var(--gold);color:#101727;border-color:var(--gold)}button:disabled{opacity:.45;cursor:default}label{display:grid;gap:8px}a{color:#82cfff;overflow-wrap:anywhere}.links{display:grid;gap:12px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.panel{padding:15px;border:1px solid #34435c;background:#0b1526;border-radius:12px;min-width:0}.panel header{margin-bottom:6px}.score{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums}.meta{font-size:12px;color:#aebed3}.status{border:1px solid #41526c;border-radius:99px;padding:8px 13px;font-size:12px}.stage{position:relative;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(180deg,#112a40,#0b1c2b 60%,#112f31);border-radius:8px}.stage:before{content:'5TH QUARTER';position:absolute;top:25%;width:100%;text-align:center;font-size:30px;letter-spacing:6px;color:#ffffff0b;font-weight:900}.stage canvas{position:absolute;width:100%;height:100%}.pads{position:absolute;left:8%;right:8%;bottom:6%;height:23%;display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.pad{border:2px solid var(--lane);background:color-mix(in srgb,var(--lane) 16%,#07101e);color:var(--lane);touch-action:none;user-select:none;-webkit-user-select:none;font-size:clamp(10px,1.5vw,18px);box-shadow:0 5px 0 #020711;border-radius:12px}.pad.pressed,.pad:active{background:var(--lane);color:#07101e;transform:translateY(3px)}.judgment{position:absolute;top:8%;width:100%;text-align:center;color:#fff;font-size:18px;font-weight:bold;pointer-events:none}.focus .grid{grid-template-columns:1fr}.focus .panel{max-width:1350px}.focus .stage{max-height:65vh;aspect-ratio:16/9}.standings{display:flex;gap:18px;margin-top:18px;flex-wrap:wrap}.standing{padding:12px 20px;border-left:3px solid var(--gold);background:#122037}.phone main{padding:8px 20px;max-width:1100px}.phone header{margin:0 0 6px}.phone h1{font-size:24px;letter-spacing:0}.phone .stage{height:calc(100dvh - 75px);aspect-ratio:auto}.phone .pads{height:25%}.phone .pad{font-size:17px}.phone .score{font-size:24px}.rotate{display:none;position:fixed;inset:0;background:#08101f;z-index:10;align-items:center;justify-content:center;padding:36px;text-align:center;font-size:24px}#notice{position:fixed;bottom:8px;left:8px;right:8px;text-align:center;background:#482c16;color:#fff;padding:10px;z-index:20;border-radius:6px}#notice:empty{display:none}.countdown{font-size:30px;font-weight:bold;font-variant-numeric:tabular-nums}body.obs main{padding:20px}.obs .panel{margin:0}.credits{font-size:12px;color:#8b9bb1;margin-top:25px}.help{font-size:13px;line-height:1.5}ul{line-height:1.8}@media(orientation:portrait){.phone .rotate{display:flex}.grid{grid-template-columns:1fr}.phone .toolbar{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
.lane-0{--lane:#f7c34a}.lane-1{--lane:#4acfee}.lane-2{--lane:#f1f3fa}.lane-3{--lane:#fa5462}.pad:not(button){display:flex;align-items:center;justify-content:center}
.start-help{color:var(--gold);margin:-8px 0 20px;line-height:1.5}
.obs main{height:100dvh;overflow:hidden}.obs main>header{height:92px;margin-bottom:10px}.obs main>header h1{font-size:38px}.obs main>header p{margin:4px 0}.obs #live{height:calc(100dvh - 142px);display:flex;flex-direction:column}.obs #live>.toolbar{flex:none;margin-bottom:10px}.obs .grid{flex:1;min-height:0;grid-template-rows:repeat(2,minmax(0,1fr))}.obs .panel{display:flex;flex-direction:column;min-height:0}.obs .panel[hidden]{display:none}.obs .stage{flex:1;min-height:0;aspect-ratio:auto;margin-top:7px}.obs .standings{flex:none;margin-top:10px}.obs .credits{display:none}.obs.focus .grid{grid-template-rows:minmax(0,1fr)}.obs.focus .panel{max-width:none}.obs.focus .stage{max-height:none}
/* Broadcast field presentation. Stable pad geometry; motion follows real hits. */
.stage:before{display:none}.panel{border-top:3px solid #526b86;box-shadow:0 8px 25px #0005;transition:border-color 140ms}.panel[data-leading=true]{border-color:var(--gold)}.panel[data-combo=true] .stage{box-shadow:inset 0 0 20px #f7c34a25}.panel header strong{font-size:clamp(15px,1.4vw,25px);text-transform:uppercase}.panel .score{font-size:clamp(24px,2.6vw,46px);line-height:1}.meta{letter-spacing:.05em;margin:4px 0}.pads{gap:7px}.pad{background:linear-gradient(180deg,#102031da,#030b17ee);border-radius:7px;border-width:1px 1px 4px;text-shadow:0 0 14px var(--lane);font-weight:900;letter-spacing:.08em;box-shadow:0 4px 14px #0008,inset 0 1px #ffffff30}.judgment{top:9%;font-size:clamp(18px,2vw,38px);font-weight:900;font-style:italic;letter-spacing:.08em;text-shadow:0 2px 4px #000,0 0 18px #f7c34a}.score-pop{animation:score-hit 180ms ease-out}.standings{gap:0;background:#081426;border:1px solid #40516c;border-radius:8px;overflow:hidden}.standing{display:flex;align-items:center;gap:12px;padding:13px 18px;border-left:1px solid #40516c;flex:1;min-width:0;background:transparent}.standing b{color:var(--gold);font-size:24px}.standing span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800;text-transform:uppercase}.standing strong{margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}.standings-label{font-size:11px;letter-spacing:.12em;align-self:center;padding:16px;color:var(--gold)}.obs main{max-width:1920px;padding:24px 34px;background:radial-gradient(ellipse at 50% -30%,#24445e,#080f1c 75%)}.obs main>header{height:88px}.obs main>header h1{font-size:42px;font-weight:900;letter-spacing:-1.5px;margin:4px 0}.obs main>header p{display:none}.obs #live{height:calc(100dvh - 146px)}.obs .toolbar>strong{font-size:26px;letter-spacing:.08em}.obs .status{font-size:11px}.obs .countdown{color:var(--gold);font-size:32px}.obs .grid{gap:13px}.obs .panel{padding:10px 14px}.obs .stage{margin-top:4px}.obs .meta{font-size:11px}.obs .pads{bottom:6%;height:23%}.obs .standings{margin-top:5px;min-height:62px}.obs .standing strong{font-size:23px}.broadcast-moment{text-align:center;color:#becad8;letter-spacing:.16em;font-size:12px;font-weight:800;padding:10px 0 5px}.obs.focus .panel header strong{font-size:30px}.obs.focus .panel .score{font-size:48px}.phone main>header,.phone #live>.toolbar,.phone .standings{display:none}.phone .panel{padding:0;border:0;border-radius:0;box-shadow:none;background:none}.phone main{padding:5px max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));max-width:none}.phone .panel header{height:27px;margin:0}.phone .panel header strong{font-size:16px}.phone .panel .score{font-size:25px}.phone .meta{font-size:10px;margin:2px 0;height:13px}.phone .stage{height:calc(100dvh - 55px);border-radius:5px}.phone .judgment{font-size:22px}.phone #arm{position:fixed;top:28%;left:35%;right:35%;z-index:3}.phone #arm:disabled{display:none}.phone .grid{gap:0}.transparent,.camera-overlay{background:transparent!important}.camera-overlay main{background:transparent!important;padding:3vh 3vw;display:flex;flex-direction:column}.camera-overlay main>header{display:none}.camera-overlay #live{height:100%;justify-content:space-between}.camera-overlay #live>.toolbar{align-self:flex-end;max-width:68%;background:#071323f2;border:1px solid #f7c34a88;border-radius:8px;padding:18px 24px;gap:22px}.camera-overlay #live>.toolbar>strong:before{content:'5TH QUARTER LIVE';display:block;font-size:11px;color:var(--gold);margin-bottom:8px;letter-spacing:.15em}.camera-overlay .standings{margin:0;box-shadow:0 5px 25px #0006}.camera-overlay .credits{display:none}@keyframes score-hit{from{color:var(--gold);transform:scale(1.07)}to{color:#fff;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.score-pop{animation:none}.panel{transition:none}}
.phone .grid{grid-template-columns:minmax(0,1fr)}
.phone .switch-lobby{display:block;margin:18px 0 12px;width:100%;min-height:48px;color:#aebed3}
.room-row{display:flex;gap:8px;align-items:stretch}.room-open{flex:1;min-width:0;overflow-wrap:anywhere}.rooms .room-clear{flex:none;color:var(--gold);text-align:center}.rooms .room-toggle{background:transparent;border:0;padding:6px 0;color:#aebed3;font-size:12px}
/* Keep occupied broadcast panels horizontal for every supported roster size. */
.obs:not(.focus) .grid[data-players="1"]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.obs:not(.focus) .grid[data-players="2"]{grid-template-rows:minmax(0,1fr);align-items:center}
.obs:not(.focus) .grid[data-players="2"] .panel{max-height:100%;width:100%}
.obs:not(.focus) .grid[data-players="2"] .stage{aspect-ratio:16/9;flex:none}
.obs:not(.focus) .grid[data-players="3"] .panel:nth-child(3 of :not([hidden])){grid-column:1/-1;width:calc(50% - 6.5px);justify-self:center}
/* Native disc targets are painted on the field. Transparent touch zones stay
   larger than the rings for fast chords and near-edge thumb taps. */
.pads,.phone .pads,.obs .pads{left:8%;right:8%;bottom:6%;height:27%;gap:0}
.pad,.pad:not(button){position:relative;display:flex;align-items:flex-end;justify-content:center;padding:0 0 2%;border:0;border-radius:50%;background:transparent;box-shadow:none;font-weight:900;text-shadow:0 2px 5px #000,0 0 12px var(--lane);line-height:1.1}
.pad.pressed,.pad:active{background:transparent;color:#fff;transform:none;box-shadow:none}
.pad:focus-visible{outline:2px solid var(--lane);outline-offset:-4px}
.phone .pad{font-size:13px}
/* Holding and final use the same room and source links throughout a set. */
[hidden]{display:none!important}.holding{display:none}.phone.holding-room .holding:not([hidden]){display:block;margin:12px 0 0;padding:20px 24px;border-color:#f7c34a88;background:linear-gradient(120deg,#12283e,#081321)}
.phone.holding-room .grid,.phone.tournament-final .grid{display:none}.phone.holding-room .standings{display:flex;flex-wrap:wrap;margin-top:10px}.phone.holding-room .standings-label{width:100%;padding:10px 14px}.phone.holding-room .standing{flex:1 1 45%;padding:9px 14px;font-size:14px}.phone.holding-room .standing b{font-size:18px}.phone.holding-room #arm{position:static;margin:12px 0 0;padding:10px 18px}.phone.holding-room .holding h2{font-size:26px;margin:8px 0}.phone.holding-room .holding p{font-size:15px;margin:8px 0;line-height:1.4}
.champion{border:1px solid #f7c34ab3;border-radius:16px;padding:24px;text-align:center;background:radial-gradient(ellipse at 50% 0,#57431e88,#0a172a 72%);box-shadow:0 0 65px #f7c34a18;margin-top:16px;overflow-wrap:anywhere}.crown{color:var(--gold);font-size:72px;line-height:1}.winner-label{color:var(--gold);font-size:14px;font-weight:900;letter-spacing:.18em}.winner-name{font-size:clamp(32px,5vw,80px);font-weight:900;text-transform:uppercase;margin:12px 0}.winner-score{color:#dce7f3;font-size:18px;font-weight:bold;font-variant-numeric:tabular-nums}.obs.tournament-final .grid,.obs.tournament-final .broadcast-moment{display:none}.obs.tournament-final .champion{flex:1;display:flex;flex-direction:column;justify-content:center;gap:14px;margin:0 0 18px}.obs.tournament-final .crown{font-size:120px}.camera-overlay.tournament-final .champion{flex:none;align-self:center;min-width:50%;max-width:85%;padding:28px 48px;background:#081528f5}.camera-overlay.tournament-final .winner-name{font-size:56px}.camera-overlay.tournament-final #live{justify-content:space-between}.phone.tournament-final .champion{margin:8px 0 0;padding:12px}.phone.tournament-final .crown{font-size:42px}.phone.tournament-final .winner-name{font-size:30px;margin:6px 0}.phone.tournament-final .winner-score{font-size:13px}
@media(orientation:portrait){.phone.holding-room .rotate{display:none}.phone.holding-room .standing{flex-basis:100%}.phone.holding-room .champion{margin-top:24px}}
/* Public entrances use the same original, silent field footage and colors. */
.entrance{background:#07101e}.entrance main{position:relative;z-index:1;max-width:1120px;padding-top:7vh}.entrance-film{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;opacity:.24;pointer-events:none;z-index:0}.entrance:after{content:'';position:fixed;inset:0;background:linear-gradient(90deg,#061020eb,#06102080);z-index:0;pointer-events:none}.entrance h1{font-size:clamp(36px,6vw,76px);line-height:1;max-width:800px}.entrance .card,.entrance form{background:#0b1b2deb;border-color:#f7c34a75;backdrop-filter:blur(8px)}.entrance .welcome{max-width:640px;padding:28px}.welcome h2{font-size:clamp(28px,5vw,48px);margin:0}.entrance-link{display:block;padding:18px 20px;border:1px solid #f7c34a;border-radius:8px;font-size:18px;font-weight:900;text-decoration:none;color:var(--gold);background:#081524e8}.entrance-link:first-of-type{background:var(--gold);color:#07101e}.entrance .sign-in{max-width:620px}.sign-in form{padding:20px 0 0;margin:0;border:0;background:none;backdrop-filter:none}.rooms{display:grid;gap:12px;max-width:620px}.rooms button{text-align:left;font-variant-numeric:tabular-nums}@media(max-width:600px){.entrance main{padding:30px 18px}.entrance h1{letter-spacing:-1px}.entrance .card{padding:22px}.entrance .welcome h2{font-size:32px}}