/* A television-first stage: the show fills the screen while controls remain reachable. */
.live:not(:has(.phase-playing)){padding:clamp(10px,2vh,24px) clamp(14px,2.5vw,48px) 10px}
.live:not(:has(.phase-playing)) .arena{width:100%;max-width:none}
.phase-intro .matchup-scene,.phase-title .game-title-scene,.phase-tutorial .tutorial-scene,.phase-ready .ready-scene,.phase-round-standings .round-standings-scene,.phase-final-board .final-board-scene{width:100%;max-width:none}
.phase-intro .matchup-scene{padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.matchup-scene .eyebrow{font-size:clamp(12px,1.3vw,22px)}
.matchup-game{font-size:clamp(17px,2.5vw,38px);margin-top:clamp(8px,2vh,24px)}
.matchup-scene .versus{width:min(96%,1500px);gap:clamp(12px,3vw,55px);margin:clamp(14px,3vh,34px) auto}
.matchup-scene .competitor{width:auto;flex:1 1 0;max-width:600px;min-width:0;padding:clamp(12px,3vh,32px);font-size:clamp(28px,5.4vw,94px);line-height:1;overflow-wrap:anywhere}
.matchup-scene .competitor .face{font-size:clamp(55px,15vh,150px);margin-bottom:clamp(4px,1vh,12px)}
.matchup-scene .competitor small{font-size:clamp(11px,1.1vw,18px)}
.matchup-scene .vs{font-size:clamp(55px,9vw,150px);flex:none}
.matchup-tag{font-size:clamp(11px,1.2vw,19px);margin-top:0}
.phase-title .game-title-scene{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 3%;}
.game-title-kicker{font-size:clamp(11px,1.15vw,20px)}
.game-title-icon{font-size:clamp(70px,17vh,185px);margin:clamp(8px,2vh,22px) auto}
.phase-title .game-title-scene h2.game-logo{font-size:clamp(52px,11vw,190px);line-height:.93;max-width:95%;margin:clamp(5px,1vh,14px) 0 clamp(12px,2vh,24px);overflow-wrap:anywhere}
.game-title-ribbon{font-size:clamp(11px,1.1vw,18px)}
.game-title-tagline{font-size:clamp(12px,1.5vw,24px);margin:clamp(8px,1.5vh,20px) auto 0}
.stage-players{display:flex;align-items:center;justify-content:center;gap:clamp(5px,1vw,16px);flex-wrap:wrap;max-width:100%;margin-top:clamp(12px,2.5vh,30px);font-weight:900}
.stage-players-label{font-size:clamp(10px,1vw,16px);letter-spacing:.12em;color:#975040}
.stage-player{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:42vw;padding:8px clamp(12px,1.5vw,26px);border-radius:10px;background:#d74f45;color:white;box-shadow:0 4px 0 #983c39;font-size:clamp(16px,2.1vw,34px);line-height:1.1}
.stage-player-1{background:#287d79;box-shadow:0 4px 0 #215a5a}.stage-player strong{overflow-wrap:anywhere}.stage-players-vs{font-size:clamp(14px,1.6vw,25px);color:#9a4e3e}
.tutorial-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:clamp(8px,1.5vh,20px)}
.tutorial-heading .tutorial-label{margin:0;flex:none;font-size:clamp(13px,1.4vw,22px)}.tutorial-heading .stage-players{margin:0;justify-content:flex-end}
.phase-tutorial .tutorial-layout{gap:clamp(15px,3vw,55px)}
.phase-tutorial .tutorial-copy h2{font-size:clamp(30px,4vw,70px)}
.phase-tutorial .tutorial-step p{font-size:clamp(16px,1.8vw,28px)}
.phase-ready .ready-scene{padding:0 3%}.ready-roster>div{font-size:clamp(22px,3.5vw,55px);padding:clamp(12px,2vh,25px) clamp(20px,3vw,45px)}
.phase-round-standings .round-standings-scene,.phase-final-board .final-board-scene{padding:0 clamp(4px,1vw,18px)}
.phase-round-standings .flow-scene h2,.phase-final-board .final-board-scene h2{font-size:clamp(40px,6.5vw,100px);margin:clamp(4px,1vh,12px) 0}
.flow-eyebrow,.finale-kicker{font-size:clamp(11px,1.1vw,18px)}
.flow-standings-grid,.final-board-grid{gap:clamp(5px,1vh,12px) clamp(8px,1vw,18px)}
.flow-standing,.final-board-row{padding:clamp(7px,1.25vh,16px) clamp(10px,1.5vw,25px);border-radius:12px;gap:clamp(8px,1vw,18px)}
.flow-standing>b,.final-board-rank{width:clamp(45px,5vw,85px);font-size:clamp(18px,2.2vw,34px)}
.flow-standing span,.final-board-row strong{font-size:clamp(17px,2.2vw,34px)}
.flow-standing strong,.final-board-score{font-size:clamp(20px,2.6vw,40px)}
.flow-standing strong small,.final-board-score small{font-size:clamp(10px,1vw,15px)}
.final-board-avatar{font-size:clamp(24px,3vw,42px)}
.flow-solo-heading{font-size:clamp(10px,1vw,16px);margin:clamp(7px,1.2vh,16px) 0 7px}
.flow-solo-cards{gap:8px}.flow-solo-cards div{padding:clamp(7px,1vh,14px)}.flow-solo-cards b,.flow-solo-cards span{font-size:clamp(11px,1.25vw,19px)}.flow-solo-cards small{font-size:clamp(10px,1vw,15px)}
@media(max-height:700px){.game-title-icon{font-size:clamp(45px,12vh,85px);margin:5px auto}.phase-title .game-title-scene h2.game-logo{font-size:clamp(46px,9vw,110px);margin:6px 0 10px}.stage-players{margin-top:10px}.stage-player{padding:5px 12px}.matchup-scene .competitor .face{font-size:clamp(45px,10vh,75px)}.matchup-scene .versus{margin:9px auto}.matchup-scene .competitor{padding:8px;font-size:clamp(25px,4.6vw,60px)}.phase-round-standings .flow-scene h2,.phase-final-board .final-board-scene h2{font-size:clamp(32px,5vw,62px)}.flow-standing,.final-board-row{padding:5px 9px}.flow-standing span,.final-board-row strong{font-size:clamp(14px,1.9vw,24px)}.flow-standing strong,.final-board-score{font-size:clamp(16px,2.2vw,28px)}}
@media(max-width:700px){.matchup-scene .versus{width:100%;gap:7px}.matchup-scene .competitor{font-size:clamp(20px,5vw,38px)}.matchup-scene .vs{font-size:clamp(36px,8vw,60px)}.stage-players-label{width:100%;text-align:center}.tutorial-heading .stage-players-label{display:none}.tutorial-heading .stage-player{font-size:12px;padding:5px 7px}.flow-standing span,.final-board-row strong{font-size:13px}.flow-standing>b,.final-board-rank{width:32px;font-size:14px}.flow-standing strong,.final-board-score{font-size:15px}.final-board-avatar{font-size:19px}.flow-solo-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

.phase-intro .matchup-scene{min-width:0}
.phase-playing .play-players{display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(100%,calc((100svh - 205px) * 15 / 7));flex:none}
.phase-playing .play-player{display:flex;align-items:center;gap:7px;min-width:0;padding:4px 12px;border-radius:8px;background:#d74f45;color:#fff;font-size:clamp(13px,2vw,24px);line-height:1.1;font-weight:900}
.phase-playing .play-player.side-1{background:#287d79}.phase-playing .play-player b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.phase-playing .play-player small{font-size:clamp(9px,.9vw,13px);white-space:nowrap;opacity:.9}.phase-playing .play-player.active-turn{outline:3px solid #e9b94d;outline-offset:1px}
.phase-playing #game-canvas{width:min(100%,calc((100svh - 205px) * 15 / 7));max-height:calc(100svh - 205px)}
@media(max-width:700px){.matchup-scene .competitor{min-width:0}.phase-playing .play-player{font-size:12px;padding:4px 6px}.phase-playing .play-player small{font-size:8px}}
/* Game-show cards and results keep the people and the game title in focus. */
.phase-title .game-title-scene{isolation:isolate}
.phase-title .game-title-scene:before{content:'';position:absolute;z-index:-1;width:min(54vh,38vw);aspect-ratio:1;border:3px solid #d8c9b866;border-radius:50%;background:radial-gradient(circle,#f9efdedd 0,#e3e9e480 58%,transparent 70%);top:4%;left:50%;transform:translateX(-50%);box-shadow:0 0 0 22px #e8e6dd44}
.phase-title .game-title-icon{position:relative;filter:drop-shadow(0 9px 6px #243b4940);animation:title-icon .7s .15s cubic-bezier(.16,1.4,.36,1) both}
.phase-title .game-title-ribbon{padding:9px 20px;box-shadow:4px 5px 0 #9a413a}
.phase-match-result .result-scene{max-width:none;width:100%;padding:0 clamp(10px,2vw,36px)}
.phase-match-result .result-scene h2{font-size:clamp(50px,7vw,112px);line-height:.98;text-transform:uppercase;overflow-wrap:anywhere}
.phase-match-result .result-cards{width:100%;max-width:1500px;margin:clamp(15px,3vh,35px) auto;gap:clamp(12px,2vw,30px);flex-wrap:nowrap}
.phase-match-result .result-card{min-width:0;max-width:none;flex:1 1 0;padding:clamp(14px,2.3vw,30px);border-radius:16px;box-shadow:0 10px 24px #07172550}
.phase-match-result .result-card.winner{border:3px solid #ffdc84;background:#355342}
.phase-match-result .result-avatar{font-size:clamp(40px,6vw,85px)}
.phase-match-result .result-card strong{font-size:clamp(22px,3.2vw,48px);line-height:1;overflow-wrap:anywhere}
.phase-match-result .result-card small{font-size:clamp(13px,1.3vw,21px)}
.phase-match-result .result-card>b{font-size:clamp(25px,3vw,46px)}
@media(max-height:700px){.phase-match-result .result-scene h2{font-size:clamp(38px,5vw,65px)}.phase-match-result .result-card{padding:12px}.phase-match-result .result-avatar{font-size:40px}}
@media(max-width:700px){.phase-match-result .result-cards{gap:8px}.phase-match-result .result-card{padding:8px;gap:6px}.phase-match-result .result-avatar{font-size:30px}.phase-match-result .result-card strong{font-size:17px}.phase-match-result .result-card small{font-size:11px}}
@media(max-height:800px){.phase-title .game-title-icon{max-height:13vh;margin:5px auto}.phase-title .game-title-scene h2.game-logo{margin:5px 0 10px}.phase-title .stage-players{margin-top:10px}}