/* One program grid for all layouts. Camera visibility remains host controlled. */
#theater.studio-layout[data-program-layout]:not(.is-focused){display:block!important;overflow:visible;padding:0!important}
#theater.studio-layout[data-program-layout]:not(.is-focused)>.stages{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:auto auto auto!important;gap:12px!important;height:auto!important;min-height:0!important;width:auto!important;margin:0 24px 16px!important;position:relative;align-items:stretch}
#theater.studio-layout[data-program-layout]:not(.is-focused) .stage{width:100%!important;height:auto!important;min-height:0!important;max-width:none!important;max-height:none!important;aspect-ratio:16/9;margin:0!important;align-self:center;justify-self:center;overflow:hidden}
#theater.studio-layout[data-program-layout]:not(.is-focused) .stage-a{grid-column:2/4!important;grid-row:1!important;max-width:420px!important}
#theater.studio-layout[data-program-layout]:not(.is-focused) .stage-b{grid-column:1/3!important;grid-row:2!important}
#theater.studio-layout[data-program-layout]:not(.is-focused) .stage-c{grid-column:3/5!important;grid-row:2!important}
#theater.studio-layout[data-program-layout]:not(.is-focused) .program-all-overlay{display:contents!important}
#theater.studio-layout[data-program-layout]:not(.is-focused) .host-support{position:relative!important;inset:auto!important;grid-column:1!important;grid-row:1!important;display:flex!important;flex-direction:column;gap:8px;min-width:0;pointer-events:auto;align-self:start}
#theater.studio-layout[data-program-layout]:not(.is-focused) .host-support>:is(.support-goal,.support-ranking){position:relative!important;inset:auto!important;transform:none!important;width:100%!important;max-width:none!important;min-width:0!important;min-height:0!important;margin:0!important;padding:8px!important;box-sizing:border-box}
#theater.studio-layout[data-program-layout]:not(.is-focused) .support-rank-item{display:flex!important;min-width:0}
#theater.studio-layout[data-program-layout]:not(.is-focused) .support-rank-item b{min-width:0;overflow:hidden;text-overflow:ellipsis}
#theater.studio-layout[data-program-layout]:not(.is-focused) .support-rank-item em{flex-shrink:0}
#theater.studio-layout[data-program-layout]:not(.is-focused) #screen-chat{display:flex;position:relative!important;inset:auto!important;transform:none!important;grid-column:4!important;grid-row:1!important;align-self:stretch;width:100%!important;max-width:none!important;height:clamp(140px,17vw,236px);max-height:236px!important;min-height:0;padding:0;font-size:12px;overflow:hidden}
#theater.studio-layout[data-program-layout]:not(.is-focused) #studio-conversation{position:relative;grid-column:1/-1!important;grid-row:3!important;min-height:0!important;height:auto!important;max-height:none!important;overflow:visible;background:#fff;border:1px solid #e3e6ec;border-radius:10px}
#theater.studio-layout[data-program-layout]:not(.is-focused) #studio-conversation .chat-body{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;padding:7px;gap:8px;min-height:0;overflow:visible}
#theater.studio-layout[data-program-layout]:not(.is-focused) #mobile-chat-menu{display:block!important;grid-column:1;grid-row:1;margin:0;min-height:38px}
#theater.studio-layout[data-program-layout]:not(.is-focused) #chat-form{display:flex!important;grid-column:2;grid-row:1;padding:0;margin:0;min-width:0}
#theater.studio-layout[data-program-layout]:not(.is-focused) #chat-input{min-width:0;width:100%;height:38px;font-size:16px}
#theater.studio-layout[data-program-layout]:not(.is-focused) #chat-send{height:38px;min-height:0}
#theater.studio-layout[data-program-layout]:not(.is-focused) #studio-conversation :is(.chat-heading,.chat-pinned,.chat-host-controls,.chat-scroll-area,.heart-toolbar,.heart-pending,.heart-speech-status){display:none!important}
#theater.studio-layout[data-program-layout]:not(.is-focused) #chat-notice{grid-column:1/-1;margin:0;font-size:11px}
#theater.studio-layout[data-program-layout]:not(.is-focused) #chat-notice:empty{display:none}
/* The menu expands above the persistent composer; moderation and gifts stay available. */
#theater.studio-layout.mobile-chat-expanded[data-program-layout]:not(.is-focused) #studio-conversation .chat-scroll-area{display:block!important;position:absolute;bottom:146px;right:0;width:min(440px,100%);height:min(260px,35dvh);z-index:30;background:#fff;border:1px solid #dde0e6;border-radius:12px 12px 0 0;padding:10px;box-sizing:border-box;overflow:auto;box-shadow:0 -6px 24px #0001}
#theater.studio-layout.mobile-chat-expanded[data-program-layout]:not(.is-focused) #studio-conversation .heart-toolbar{display:flex!important;position:absolute;bottom:54px;right:0;width:min(440px,100%);height:44px;z-index:30;background:#fff;border:1px solid #dde0e6;overflow-x:auto;box-sizing:border-box}
#theater.studio-layout.mobile-chat-expanded[data-program-layout]:not(.is-focused) #studio-conversation .chat-host-controls:not([hidden]){display:flex!important;position:absolute;bottom:98px;right:0;width:min(440px,100%);height:48px;z-index:30;background:#fff;padding:5px;box-sizing:border-box}
#theater.studio-layout.mobile-chat-expanded[data-program-layout]:not(.is-focused) #studio-conversation .chat-pinned:not([hidden]){display:block!important;position:absolute;bottom:calc(146px + min(260px,35dvh));right:0;width:min(440px,100%);z-index:31;background:#f5f2fa;box-sizing:border-box}
/* A single selected feed and the B/C pair use the same information rails. */
#theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused)>.stages{grid-template-rows:auto auto!important}
#theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) .stage[data-program-visible=true]{grid-column:2/4!important;grid-row:1!important;max-width:none!important}
#theater.studio-layout[data-program-layout=BC]:not(.is-focused) .stage.stage-b[data-program-visible=true]{grid-column:2!important}
#theater.studio-layout[data-program-layout=BC]:not(.is-focused) .stage.stage-c[data-program-visible=true]{grid-column:3!important}
#theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) #studio-conversation{grid-row:2!important}
/* Sharing takes its own full-width area; participant cards never collapse into a rail. */
#theater.studio-layout.has-sharing[data-program-layout]:not(.is-focused)>#shared-stage:not([hidden]){display:flex!important;flex-direction:column;min-width:0;min-height:0;margin:0 24px 12px}
#theater.studio-layout.has-sharing[data-program-layout]:not(.is-focused) #shared-mount{height:clamp(220px,35vw,440px);min-height:0;position:relative;overflow:hidden;aspect-ratio:auto}
#theater.studio-layout.has-sharing[data-program-layout]:not(.is-focused) #shared-mount :is(video,canvas,img){position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
/* Immersive landscape also works when the browser disallows native fullscreen. */
.compact-production-menu{display:none}
body.studio-landscape{overflow:hidden!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused){position:fixed!important;inset:var(--live-top,0px) 0 auto!important;width:100%!important;height:var(--live-height,100dvh)!important;max-width:none!important;max-height:none!important;z-index:1000;box-sizing:border-box;border-radius:0;display:flex!important;flex-direction:column;gap:4px;overflow:hidden;padding:4px max(6px,env(safe-area-inset-right)) 4px max(6px,env(safe-area-inset-left))!important;background:#fff}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>.stages{flex:1 1 0;min-height:0!important;margin:0!important;width:100%!important;grid-template-rows:minmax(0,1fr) minmax(0,1fr) auto!important;gap:5px!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .stage{height:100%!important;aspect-ratio:auto;max-width:none!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .video-mount video{object-fit:contain!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) #screen-chat{height:100%;max-height:100%!important;font-size:11px;align-self:stretch}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .host-support{max-height:100%;overflow:auto;gap:4px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>.theater-heading{height:30px!important;min-height:30px!important;margin:0!important;display:flex!important;padding:0 6px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>.theater-heading button{min-height:26px;padding:3px 12px;font-size:11px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>:is(.sharing-controls,.program-switcher){flex:none;max-height:42px;overflow:auto;margin:0!important;padding:3px!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .program-switcher>b{display:none}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>.theater-controls{flex:none;min-height:30px!important;padding:2px!important;gap:4px;flex-wrap:nowrap!important;overflow:visible}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .theater-controls button{min-height:28px!important;padding:4px 7px!important;font-size:10px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .studio-tools{position:relative!important;inset:auto!important;flex:0 0 auto!important;margin:0!important;width:auto!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .tools-drawer{max-height:70dvh;bottom:35px;z-index:40}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>#publisher-entry-hint:empty{display:none}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not([data-program-layout=all]):not(.is-focused)>.stages{grid-template-rows:minmax(0,1fr) auto!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused)>#shared-stage:not([hidden]){flex:0 1 38%;min-height:60px;margin:0!important;overflow:hidden}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused) #shared-mount{height:auto;flex:1;min-height:0}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .shared-heading{height:24px;min-height:24px;padding:2px 6px;font-size:10px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .shared-heading button{padding:2px 6px;min-height:20px;font-size:10px}
@media(max-width:600px) and (orientation:portrait){
 #theater.studio-layout[data-program-layout]:not(.is-focused)>.stages{margin:0 10px 10px!important;gap:8px!important;grid-template-rows:auto auto auto auto!important}
 #theater.studio-layout[data-program-layout]:not(.is-focused) .stage-a{grid-column:1/5!important;width:78%!important}
 #theater.studio-layout[data-program-layout]:not(.is-focused) .host-support{grid-row:3!important;grid-column:1/3!important}
 #theater.studio-layout[data-program-layout]:not(.is-focused) #screen-chat{grid-row:3!important;grid-column:3/5!important;height:160px;max-height:160px!important;font-size:10px}
 #theater.studio-layout[data-program-layout]:not(.is-focused) #studio-conversation{grid-row:4!important}
 #theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused)>.stages{grid-template-rows:auto auto auto!important}
 #theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) .stage[data-program-visible=true]{grid-column:1/5!important;width:100%!important}
 #theater.studio-layout[data-program-layout=BC]:not(.is-focused) .stage.stage-b[data-program-visible=true]{grid-column:1/3!important}
 #theater.studio-layout[data-program-layout=BC]:not(.is-focused) .stage.stage-c[data-program-visible=true]{grid-column:3/5!important}
 #theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) .host-support,#theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) #screen-chat{grid-row:2!important}
 #theater.studio-layout[data-program-layout]:not([data-program-layout=all]):not(.is-focused) #studio-conversation{grid-row:3!important}
}
/* Compact controls float above the program instead of taking away video height. */
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .compact-production-menu{display:block;margin-left:6px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>:is(.sharing-controls,.program-switcher){display:none!important}
#theater.studio-layout.production-menu-open:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>:is(.sharing-controls,.program-switcher):not([hidden]){display:flex!important;position:absolute;top:36px;left:8px;right:8px;max-height:90px;background:#fff;z-index:50;border:1px solid #ddd;box-shadow:0 5px 18px #0002}
#theater.studio-layout.production-menu-open:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>.sharing-controls:not([hidden]){top:90px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:30px minmax(0,1fr) 32px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused)>.theater-heading{grid-column:1/-1;grid-row:1}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused)>#shared-stage:not([hidden]){grid-column:1;grid-row:2;height:100%;min-height:0}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused)>.stages{grid-column:2;grid-row:2;height:100%!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape).has-sharing[data-program-layout]:not(.is-focused)>.theater-controls{grid-column:1/-1;grid-row:3}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) #studio-conversation .chat-body{padding:3px;gap:4px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) :is(#chat-input,#chat-send,#mobile-chat-menu){height:30px!important;min-height:30px!important}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .studio-speaking-indicator{font-size:8px;padding:2px 4px;max-width:calc(100% - 10px)}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused) .nameplate{font-size:10px;padding:15px 7px 23px}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>#message:empty{display:none}
#theater.studio-layout:is(.is-immersive,.mobile-landscape)[data-program-layout]:not(.is-focused)>#message:not(:empty){position:absolute;bottom:75px;left:10px;right:10px;background:#fff;z-index:60;margin:0;padding:6px;font-size:11px}
#theater.studio-layout.mobile-landscape[data-program-layout]:not(.is-focused):not(.production-menu-open) .theater-controls>:is(#recording-open,#support-settings-open,#broadcast-sound,#support-audio-open,#visibility-open){display:none}
#theater.studio-layout.mobile-landscape[data-program-layout]:not(.is-focused):not(.production-menu-open) #background-open{display:none}
#theater.studio-layout.mobile-landscape.production-menu-open[data-program-layout]:not(.is-focused)>.theater-controls{position:absolute;bottom:38px;left:6px;right:6px;z-index:40;flex-wrap:wrap!important;background:#fff;border:1px solid #ddd;min-height:40px!important}
#theater.studio-layout.mobile-landscape.mobile-chat-typing[data-program-layout]:not(.is-focused){grid-template-rows:0 minmax(0,1fr) 0}
#theater.studio-layout.mobile-landscape.mobile-chat-typing[data-program-layout]:not(.is-focused)>.theater-heading,#theater.studio-layout.mobile-landscape.mobile-chat-typing[data-program-layout]:not(.is-focused)>.theater-controls{display:none!important}