/* One responsive cast surface, shared by the standalone page and private stage. */
html:has(body.debate-cast-stage),body.debate-cast-stage{margin:0;width:100%;height:100%;overflow:hidden;background:#fff;color:#17200c;font-family:Arial,Helvetica,sans-serif}
body.debate-cast-stage *{box-sizing:border-box}
body.debate-cast-stage #app{width:100%;height:100%;margin:0;padding:0}
body.debate-cast-stage #app .debate-cast{--tv-gap:clamp(6px,1.5vh,16px);--caption-height:clamp(64px,16vh,174px);display:grid;grid-template-rows:max-content minmax(0,1fr) clamp(56px,8vh,86px);gap:clamp(12px,3vh,32px);padding:clamp(10px,3vh,32px) clamp(10px,4vw,76px) clamp(26px,3vh,34px)!important;overflow:hidden}
body.debate-cast-stage #app .debate-cast .debate-topic{position:relative;inset:auto;max-width:none;width:100%;margin:0;text-align:center;font-size:clamp(20px,2.75vw,54px);line-height:1.13;font-weight:700;overflow-wrap:anywhere}
body.debate-cast-stage #app .debate-cast .debate-stage{height:100%;width:100%;min-height:0;align-items:stretch;gap:clamp(12px,4vw,76px)}
body.debate-cast-stage #app .debate-cast .debate-side{display:grid;grid-template-rows:max-content minmax(0,1fr);gap:var(--tv-gap);min-height:0}
body.debate-cast-stage #app .debate-cast .debate-side-label{margin:0;line-height:1.2;font-size:clamp(22px,2.6vw,50px);font-weight:700;letter-spacing:.02em;text-align:center}
body.debate-cast-stage #app .debate-cast .debate-avatar{container-type:size;height:100%;padding:0;min-height:0}
body.debate-cast-stage #app .debate-cast .head-slot{display:grid;grid-template-rows:var(--caption-height) minmax(0,1fr);gap:var(--tv-gap);align-items:start;justify-items:center;height:100%;width:100%;max-width:none;min-height:0;padding:0;margin:0}
body.debate-cast-stage #app .debate-cast .head-drift{--head-diameter:max(0px,min(100cqw,calc(100cqh - var(--caption-height) - var(--tv-gap)),58vh));width:var(--head-diameter)!important;height:var(--head-diameter)!important;max-width:100%;margin:0;animation:none}
body.debate-cast-stage #app .debate-cast .speech-bubble{position:relative;inset:auto;align-self:end;width:100%;max-width:none;min-height:50px;max-height:none;margin:0;padding:clamp(10px,1.5vw,18px) clamp(10px,1.5vw,22px);border:2px solid var(--debate-accent);border-radius:clamp(10px,1vw,18px);color:#17200c;background:var(--debate-wash);font:600 clamp(14px,1.65vw,34px)/1.24 Arial,Helvetica,sans-serif;text-align:left;overflow-wrap:anywhere;box-shadow:0 3px 10px #0001}
body.debate-cast-stage #app .debate-cast .speech-bubble[hidden]{display:block!important;visibility:hidden}
body.debate-cast-stage #app .debate-cast .speech-bubble::before{content:'';position:absolute;bottom:-7px;left:calc(50% - 6px);width:12px;height:12px;background:var(--debate-wash);border-right:2px solid var(--debate-accent);border-bottom:2px solid var(--debate-accent);transform:rotate(45deg)}
body.debate-cast-stage #app .debate-cast .debate-countdown{right:12px;bottom:8px;font-size:clamp(12px,1vw,16px);line-height:1;opacity:.55}
body.debate-cast-stage #app .debate-cast .debate-enable{font:600 clamp(16px,1.5vw,20px)/1.3 Arial,Helvetica,sans-serif;min-height:48px;max-width:90vw;border:0;border-radius:0;padding:12px 20px;background:#fff;text-decoration:underline;color:#17200c;cursor:pointer}
body.debate-cast-stage #app .debate-cast .debate-enable[hidden]{display:none}
@media(max-height:500px){body.debate-cast-stage #app .debate-cast{--caption-height:64px;--tv-gap:6px;gap:10px;padding:10px 3vw 26px!important}body.debate-cast-stage #app .debate-cast .debate-topic{font-size:clamp(18px,2.5vw,26px)}body.debate-cast-stage #app .debate-cast .debate-side-label{font-size:22px}body.debate-cast-stage #app .debate-cast .speech-bubble{font-size:14px;padding:8px 10px}}
@media(max-width:600px) and (orientation:portrait){
 body.debate-cast-stage #app .debate-cast{--caption-height:64px;--tv-gap:6px;gap:10px;padding:10px 4vw 26px!important}
 body.debate-cast-stage #app .debate-cast .debate-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:12px}
 body.debate-cast-stage #app .debate-cast .debate-topic{font-size:20px}
 body.debate-cast-stage #app .debate-cast .debate-side-label{font-size:22px}
 body.debate-cast-stage #app .debate-cast .speech-bubble{font-size:16px;padding:8px 10px;min-height:42px}
}

body.debate-cast-stage #app .debate-cast .debate-result{display:flex;position:relative;inset:auto;align-items:center;justify-content:center;align-self:stretch;width:100%;min-width:0;margin:0;padding:8px 12px;border:0;border-radius:0;background:transparent;color:#17200c;font:700 clamp(20px,2.6vw,48px)/1.2 Arial,Helvetica,sans-serif;text-align:center;overflow-wrap:anywhere;transform:none}
body.debate-cast-stage #app .debate-cast .debate-result[hidden]{display:flex!important;visibility:hidden}
body.debate-cast-stage #app .debate-cast .debate-result.is-winner{animation:debate-winner-attention 1.1s ease-in-out 3}
body.debate-cast-stage #app .debate-cast.debate-motion-paused .debate-result{animation-play-state:paused}
@keyframes debate-winner-attention{0%,100%{opacity:1;scale:1}50%{opacity:.7;scale:1.025}}
@media(prefers-reduced-motion:reduce){body.debate-cast-stage #app .debate-cast .debate-result.is-winner{animation:none}}

body.debate-cast-stage #app .debate-cast .debate-judging-panel{display:block;position:absolute;left:50%;top:50%;width:clamp(160px,25vmin,240px);height:auto;margin:0;padding:8px;border:0;border-radius:0;background:#fff;box-shadow:none;transform:translate(-50%,-50%);z-index:10;text-align:center}
body.debate-cast-stage #app .debate-cast .debate-judging-panel[hidden]{display:none!important}
body.debate-cast-stage #app .debate-cast .debate-choose-winner{display:grid;gap:8px;margin:0;padding:0;color:#17200c;font:700 clamp(16px,1.4vw,24px)/1.2 Arial,Helvetica,sans-serif;text-decoration:none}
body.debate-cast-stage #app .debate-cast .debate-choose-winner img{display:block;width:100%;height:auto;margin:0;padding:0;aspect-ratio:1}

/* Motion communicates waiting and the result without introducing another card. */
body.debate-cast-stage #app .debate-cast .debate-winner .debate-side-label::after{content:none}
body.debate-cast-stage #app .debate-cast .debate-winner .head-drift{filter:none}
body.debate-cast-stage #app .debate-cast[data-phase="judging"] .head-drift{animation:tv-wait-bob 2.1s ease-in-out infinite}
body.debate-cast-stage #app .debate-cast[data-phase="judging"] .debate-right .head-drift{animation-delay:-1s}
body.debate-cast-stage #app .debate-cast[data-phase="judging"] .debate-result::before{content:'';width:1em;height:1em;flex:0 0 1em;margin-right:.5em;border:3px solid #d9ddd3;border-top-color:#17200c;border-radius:50%;animation:tv-judge-spin .9s linear infinite}
body.debate-cast-stage #app .debate-cast[data-phase="acceptance"] .debate-winner .head-drift,
body.debate-cast-stage #app .debate-cast[data-phase="countdown"] .debate-winner .head-drift{animation:tv-winning-head 1.8s ease-in-out infinite}
body.debate-cast-stage #app .debate-cast :focus{outline:none!important}
body.debate-cast-stage #app .debate-cast.debate-motion-paused *,body.debate-cast-stage #app .debate-cast.debate-motion-paused *::before{animation-play-state:paused!important}
.debate-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:12}
.debate-confetti i{position:absolute;top:-20px;left:var(--x);width:9px;height:15px;background:var(--color);opacity:0;animation:tv-confetti 2.8s var(--delay) ease-in both}
@keyframes tv-wait-bob{0%,100%{translate:0 0;rotate:-1deg}50%{translate:0 -7px;rotate:1deg}}
@keyframes tv-judge-spin{to{transform:rotate(360deg)}}
@keyframes tv-winning-head{0%,100%{scale:1.07}50%{scale:1.12}}
@keyframes tv-confetti{0%{opacity:1;transform:translate(0,0) rotate(0)}85%{opacity:1}100%{opacity:0;transform:translate(var(--drift),105vh) rotate(var(--turn))}}
@media(max-width:600px){@keyframes tv-winning-head{0%,100%{scale:1.03}50%{scale:1.07}}}
@media(prefers-reduced-motion:reduce){body.debate-cast-stage #app .debate-cast .head-drift,body.debate-cast-stage #app .debate-cast .debate-result::before{animation:none!important}.debate-confetti{display:none}}

/* Standalone TV has one keyboard-owned transport, revealed only on demand. */
body.debate-cast-stage #app .debate-cast :is(.debate-enable,.debate-judging-panel,.debate-status,.debate-countdown){display:none!important}
body.wwmud-tv #app .debate-cast .speech-bubble{overflow:clip;max-block-size:var(--caption-height)}
body.wwmud-tv #app .debate-cast{block-size:100dvh;max-block-size:100dvh;overflow:clip}