
/* Shared program appearance */
.studio-visuals{position:absolute;inset:0;pointer-events:none;z-index:20;overflow:hidden}.studio-visuals>*{position:absolute}.sv-logo{width:9%;max-height:20%;object-fit:contain;top:4%;right:4%;filter:drop-shadow(0 2px 8px #00000060)}.sv-logo[data-position="top-left"]{left:4%;right:auto}.sv-logo[data-position="bottom-left"]{left:4%;right:auto;top:auto;bottom:4%}.sv-logo[data-position="bottom-right"]{top:auto;bottom:4%}.sv-banner{left:4%;right:4%;bottom:7%;padding:2%;background:var(--studio-brand);color:white;font-size:clamp(14px,2.5vw,44px);font-weight:700;border-radius:12px;white-space:pre-wrap}.sv-banner[data-font-size="small"]{font-size:clamp(10px,1.6vw,26px)}.sv-banner[data-font-size="large"]{font-size:clamp(18px,3.6vw,64px)}.sv-qr{right:3%;bottom:4%;background:white;color:#17132a;border-radius:12px;padding:1%;width:18%;display:grid;text-align:center;font-size:clamp(9px,1vw,20px)}.sv-qr img{width:100%;image-rendering:pixelated}.sv-countdown{inset:30% 10%;display:grid;place-content:center;text-align:center;background:#111322ed;color:white;font-size:clamp(22px,5vw,80px);border-radius:22px;white-space:pre-wrap}.sv-slide{inset:0;width:100%;height:100%;object-fit:contain;background:#101323}.sv-slide[data-layout="presentation"]{width:76%}.sv-clip{inset:0;width:100%;height:100%;object-fit:contain;background:#101323}.sv-logo,.sv-banner,.sv-qr,.sv-countdown{z-index:3}.sv-clip{z-index:4}.sv-slide{z-index:0}[data-fade="true"] .studio-visuals>*{animation:studioFade .3s ease}@keyframes studioFade{from{opacity:0}to{opacity:1}}
[data-names="false"] .name{display:none}[data-theme="bubble"] .name{border-radius:99px;background:var(--studio-brand)}[data-theme="block"] .name{left:0;bottom:0;border-radius:0;background:var(--studio-brand)}[data-theme="minimal"] .name{background:transparent;text-shadow:0 2px 5px #000}[data-theme="classic"] .name{border-left:4px solid var(--studio-brand)}[data-text-size="small"] .name{font-size:16px}[data-text-size="large"] .name{font-size:30px}[data-camera-shape="circle"] .tile:not(.screen){border-radius:50%}[data-camera-shape="square"] .tile:not(.screen){border-radius:0}[data-banner-edge="bottom"] .tile .name{bottom:12%;transition:bottom .2s ease}[data-banner-edge="bottom"][data-theme="block"] .name{bottom:9%}
/* Operator workspace */
.studio-body:has(.studio-command){grid-template-columns:minmax(0,1fr) 390px}.studio-command{display:flex;flex-direction:column;gap:12px;min-width:0}.studio-command .wk-program-preview{width:100%;aspect-ratio:16/9;height:auto;min-height:240px;position:relative;background:#111322;border:1px solid #dad6e5;border-radius:18px;overflow:hidden}.studio-command iframe{width:100%;height:100%;border:0}.studio-source-strip{display:flex!important;gap:12px!important;min-height:0!important;height:130px;overflow:auto;grid-template-columns:none!important}.studio-source-strip>.tile{flex:0 0 200px;min-height:110px;height:120px;font-size:14px}.studio-source-strip .avatar{width:40px;height:40px;font-size:18px}.studio-rail{display:flex;gap:5px;overflow-x:auto;padding:10px 0}.studio-rail button{white-space:nowrap;border:1px solid #e1dcec;border-radius:10px;background:white;padding:9px 12px;font:inherit;font-size:12px;color:#514766}.studio-rail button.active{background:#6235dd;color:white}.studio-layouts{display:flex;gap:8px;flex-wrap:wrap}.studio-layouts button{border:1px solid #dcd5e9;background:white;border-radius:10px;padding:8px;color:#514766;min-width:70px;cursor:pointer}.studio-layouts button[aria-pressed="true"]{border:2px solid #6235dd;color:#6235dd;background:#f4efff}.studio-layout-thumb{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;width:44px;height:25px;margin:0 auto 4px}.studio-layout-thumb i{background:currentColor;opacity:.6;border-radius:2px}.studio-stage-heading{display:flex;align-items:center;justify-content:space-between}.studio-stage-heading strong{font-size:13px;letter-spacing:.08em}.studio-deck-preview{width:100%;max-height:280px;object-fit:contain;background:#101323}.studio-deck-float{position:fixed;top:76px;right:24px;width:380px;min-width:260px;min-height:220px;max-width:96vw;max-height:90vh;background:#171b25;color:#eef1f8;border:1px solid #414756;border-radius:12px;box-shadow:0 20px 60px #0007;z-index:400;display:flex;flex-direction:column;overflow:hidden}.studio-deck-float-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:#20242f;border-bottom:1px solid #414756;cursor:move;touch-action:none;user-select:none}.studio-deck-float-head strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.studio-deck-float-head .x{background:transparent;color:#aeb8cb;font-size:20px;flex-shrink:0}.studio-deck-float-body{padding:12px;overflow:auto;flex:1;min-height:0;display:flex;flex-direction:column;gap:10px}.studio-deck-float-body .studio-deck-preview{max-height:none;flex:1;min-height:0;border-radius:6px}.studio-deck-float-grip{position:absolute;right:2px;bottom:2px;width:16px;height:16px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 50%,#5a6274 50%);border-radius:0 0 4px 0}.studio-tool-panel[hidden]{display:none}.studio-tool-panel{display:flex;flex-direction:column;gap:14px}.studio-tool-panel h3{margin:8px 0}.studio-tool-panel input,.studio-tool-panel select,.studio-tool-panel textarea{max-width:100%}.studio-tool-panel textarea{min-height:100px}.studio-private-feed{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow:auto}.studio-private-feed article{background:#f5f2fa;padding:10px;border-radius:10px;white-space:pre-wrap}.studio-private-feed article.mention{border-left:3px solid #6235dd}.studio-custom-canvas{aspect-ratio:16/9;background:#16192b;position:relative;overflow:hidden;touch-action:none}.studio-slot{position:absolute;border:2px solid #c0a8ff;background:#6235dd88;color:white;display:grid;place-content:center;cursor:move}.studio-demo-program{position:absolute;inset:0;display:grid;place-items:center;color:#eee;background:#111322}.studio-demo-program>span{font-size:13px}.studio-main-actions{display:flex;gap:10px;flex-wrap:wrap}.studio-broadcast-status{font-size:12px;color:#8a6387}.studio-source-actions{display:flex;gap:5px;flex-wrap:wrap}.studio-source-actions button{font-size:12px}.studio-panel:has(.studio-rail) .panel-content{padding:12px}.studio-panel:has(.studio-rail) .chat-form{display:none}
@media(max-width:1000px){.studio-body:has(.studio-command){grid-template-columns:1fr}.studio-command .wk-program-preview{min-height:200px}.studio-panel:has(.studio-rail){width:100%;max-height:none}.studio-source-strip{height:120px}}

.studio .stage:has(.studio-command){overflow-y:auto;display:block}.studio-command .wk-program-preview{height:clamp(210px,37vh,430px);aspect-ratio:auto;min-height:210px}.studio-layouts{flex-wrap:nowrap;overflow:auto}.studio-layouts button{min-width:58px;padding:6px;font-size:11px}.studio-layout-thumb{width:34px;height:22px}.studio-rail{flex-wrap:wrap;overflow:visible;position:sticky;top:-12px;background:#111a2b;z-index:25;padding:10px 0}.studio-rail button{padding:7px 9px}.studio-tool-panel input[type=color]{min-height:40px;padding:3px}.studio-private-feed article{color:#271f38}.studio-main-actions .btn{font-size:12px;padding:8px 12px}.studio-source-strip{margin-top:10px}.studio-command .wk-program-preview .studio-demo-program{border-radius:0}@media(max-width:700px){.studio .stage:has(.studio-command){overflow:visible}.studio-command .wk-program-preview{height:220px}.studio-layouts{flex-wrap:wrap}.studio-rail{position:static}}

.studio-demo-tiles{position:absolute;inset:5%;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.studio-demo-tiles .tile{min-height:0;background:#242035;position:relative;display:grid;place-items:center;border-radius:16px;overflow:hidden}.studio-demo-tiles .initial{font-size:64px;color:#c3afff}.studio-demo-tiles video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.studio-demo-tiles .name{position:absolute;bottom:5%;left:4%;padding:8px 14px;background:#111827;color:white;border-left:4px solid var(--studio-brand);font-size:16px}.studio-demo-label{position:absolute;bottom:2%;left:4%;font-size:10px;color:#b0a8c3}.studio-legacy[hidden]{display:none!important}.studio-legacy details[hidden]{display:none!important}

.studio-visuals>*{transition:opacity .25s ease}.sv-logo[data-variant="horizontal"]{width:22%}.sv-logo[data-variant="vertical"]{width:12%}#program:has(.sv-slide[data-layout="presentation"]) #tiles{grid-template-columns:1fr!important;grid-template-rows:repeat(auto-fit,minmax(0,1fr))!important}#program:has(.sv-slide[data-layout="presentation"]) #tiles .tile:first-child{grid-column:auto;grid-row:auto}

.sv-intermission{inset:0;background:linear-gradient(135deg,#1a1038,#6235dd);color:white;display:flex;flex-direction:column;gap:24px;align-items:center;justify-content:center;z-index:5;text-align:center;padding:8%;font-size:clamp(22px,4vw,64px)}.sv-intermission img{width:15%;max-height:25%;object-fit:contain}.sv-intermission strong{line-height:1.2}

.studio-demo-tiles{isolation:isolate}

/* Shared stage geometry and scrolling banners. */
.studio-arranged{isolation:isolate}.studio-arranged>.tile{min-height:0!important;margin:0;border-radius:0}
.studio-visuals{z-index:auto}.studio-arranged{z-index:1}#overlays,#caption,#featured{z-index:2}.studio-bg-layer{position:absolute;inset:0;z-index:0;background-size:cover;transition:opacity .6s ease}
.sv-slide[data-layout=presentation],.sv-slide[data-layout=spotlight]{left:26%;top:2%;width:72%;height:96%;background:transparent}
.sv-banner[data-position=top]{bottom:auto;top:5%}.sv-banner[data-ticker=true]{left:0;right:0;bottom:0;border-radius:0;padding:1.2% 0;white-space:nowrap;overflow:hidden}.sv-banner[data-ticker=true][data-position=top]{top:0;bottom:auto}.sv-banner[data-ticker=true]>span{display:inline-block;min-width:100%;padding-left:100%;animation:studioTicker 22s linear infinite}.sv-banner[data-speed=slow]>span{animation-duration:34s}.sv-banner[data-speed=fast]>span{animation-duration:13s}@keyframes studioTicker{from{transform:translateX(0)}to{transform:translateX(-100%)}}

#program,.studio-demo-program{container-type:size}.studio-visuals .sv-banner{font-size:2.7cqw}.studio-demo-tiles .name{font-size:1.8cqw}.studio-visuals .sv-countdown{font-size:5cqw}

/* Empty camera slots are shown only in the moderator preview, never in Egress output. */
.studio-preview-slots{position:absolute;inset:0;pointer-events:none;z-index:1}.studio-preview-slot{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px dashed #a69dbdb3;border-radius:4px;background:#4c426726;color:#ded8ec;text-align:center;padding:5px;overflow:hidden}.studio-preview-slot strong{font:600 clamp(10px,1.1vw,16px) system-ui,sans-serif}.studio-preview-slot span{font:400 clamp(9px,.9vw,12px)/1.4 system-ui,sans-serif;max-width:95%}

.studio-composition-active>.studio-arranged,.studio-composition-active>#tiles{isolation:auto!important;z-index:auto!important}.studio-composition-media{display:contents}.studio-composition-media-item{position:absolute;pointer-events:none;opacity:1;transition:left .35s ease,top .35s ease,width .35s ease,height .35s ease,opacity .35s ease}iframe.studio-composition-media-item{pointer-events:auto;background:#000;border-radius:4px}.studio-layer-banner{display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:var(--studio-brand,#6235dd);color:#fff;font-weight:700;font-size:clamp(12px,2.2cqw,40px);padding:0 3%;border-radius:8px;white-space:pre-wrap}.studio-layer-banner[data-ticker="true"]{white-space:nowrap;padding:0;border-radius:0}.studio-layer-banner[data-ticker="true"]>span{display:inline-block;min-width:100%;padding-left:100%;animation:studioTicker 22s linear infinite}.studio-layer-banner[data-speed="slow"]>span{animation-duration:34s}.studio-layer-banner[data-speed="fast"]>span{animation-duration:13s}.studio-layer-banner[data-font-size="small"]{font-size:clamp(9px,1.4cqw,24px)}.studio-layer-banner[data-font-size="large"]{font-size:clamp(16px,3.2cqw,64px)}.studio-composition-active .studio-visuals{z-index:60}.studio-composition-active>#overlays,.studio-composition-active>.studio-demo-overlays{z-index:50}.studio-composition-active .composition-missing{background:#292535;color:#cdc6dd;border:1px dashed #8d809f;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;font-size:clamp(10px,1.2vw,18px)}.composition-missing small{font-size:.7em}

.studio-demo-program .name:empty,#program .name:empty{display:none}

/* Destinos visuales, con nombres accesibles y estado independiente. */
.studio-social-logo{width:30px;height:32px;flex:0 0 30px}.studio-social-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.studio-social-picker button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:72px;padding:8px 3px;border:1px solid var(--st-line);border-radius:10px;background:var(--st-surface);color:var(--st-text);cursor:pointer;font:inherit;font-size:10px}.studio-social-picker button:hover{border-color:#875aff;background:var(--st-soft)}.studio-social-picker button:focus-visible,.studio-destination-card:has(input:focus-visible){outline:3px solid #976eff;outline-offset:2px}.studio-destination-list{display:grid;gap:8px}.studio-destination-card{position:relative;display:flex!important;flex-direction:row!important;align-items:center;gap:10px!important;padding:12px!important;min-height:64px;border:1px solid var(--st-line);border-radius:12px;cursor:pointer;background:var(--st-surface)}.studio-destination-card>span:first-of-type{display:grid;gap:3px;flex:1;min-width:0}.studio-destination-card strong{font-size:12px;overflow-wrap:anywhere}.studio-destination-card small{font-size:10px;color:var(--st-muted)}.studio-destination-card input{position:absolute;width:1px!important;height:1px;opacity:0}.studio-destination-tick{border:1px solid var(--st-line);width:21px;height:21px;display:grid;place-items:center;color:transparent;border-radius:6px;flex-shrink:0}.studio-destination-card:has(input:checked){border-color:#7545ef;background:var(--st-soft)}.studio-destination-card input:checked+.studio-destination-tick{color:white;background:#6235dd;border-color:#6235dd}.studio-destination-card:has(input:disabled){opacity:.6;cursor:default}
.studio-destination-card:has(>label){padding:0!important}
.studio-destination-card:has(>label)>label{display:flex!important;flex-direction:row!important;align-items:center;gap:10px!important;padding:12px!important;flex:1;min-width:0;cursor:pointer}
.studio-destination-remove{flex-shrink:0;width:30px;height:30px;margin-right:10px;display:grid;place-items:center;border:1px solid var(--st-line);border-radius:8px;background:var(--st-surface);color:var(--st-muted);cursor:pointer}
.studio-destination-remove .icon{width:15px;height:15px}
.studio-destination-remove:hover,.studio-destination-remove:focus-visible{background:var(--st-danger-bg,#ffedf1);color:var(--st-danger,#b52241);border-color:var(--st-danger,#b52241)}.studio-output-checks{border:1px solid #e7c48b;border-radius:10px;padding:10px}.studio-output-checks summary,.studio-output-help summary{cursor:pointer;font-size:12px;font-weight:600}.studio-output-checks ul{margin-bottom:0}.studio-broadcast-panel .notice{padding:10px 12px}.studio-broadcast-panel h4{margin:6px 0}.studio-broadcast-panel .notice p{margin:4px 0 0}
