:root{font-family:Inter,Segoe UI,sans-serif;color:#e9edf5;background:#101116;color-scheme:dark;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;background:#292d38;border:1px solid #3b4050;color:#f6f8ff;padding:11px 18px;border-radius:8px;font-weight:600}button:hover{filter:brightness(1.18)}button:disabled{opacity:.4;cursor:not-allowed}.primary{background:#087fe9;border-color:#168ff8}.secondary{background:#20232d}.icon{background:transparent;border:0;font-size:20px}header{height:78px;border-bottom:1px solid #272b36;display:flex;align-items:center;padding:0 32px;gap:14px;background:#14161d}header img{width:44px;height:44px;border-radius:12px;object-fit:cover}header strong{font-size:21px;letter-spacing:-.6px}header strong span{color:#48abff}header small{font-size:10px;letter-spacing:2px;border-left:1px solid #383e4b;padding-left:20px;color:#919aaa}kbd{margin-left:auto;color:#a6afbf;background:#212530;border:1px solid #353c4b;border-radius:6px;padding:8px}.studio{max-width:1400px;margin:auto;padding:35px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:#42a6ff;font-weight:700}h1{font-size:32px;letter-spacing:-1px;margin:10px 0}h2{font-size:20px;margin:0 0 7px}h3{font-size:14px}.muted,.hint{color:#929cac;line-height:1.7}.hint{font-size:12px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:26px;margin-top:27px}.preview{aspect-ratio:16/9;background:radial-gradient(ellipse at 50% 90%,#10223a,#090b10 75%);border:1px solid #2c3444;border-radius:12px;position:relative;display:grid;place-items:center;overflow:hidden}.preview video{width:100%;height:100%;object-fit:contain;position:absolute}#empty{text-align:center;color:#78869c;position:relative}#empty b{font-size:48px;color:#2d8ddf}#empty h2{color:#d2deee;margin-top:12px}#empty p{font-size:12px}.sourceLine,.options,.actions{display:flex;align-items:center;gap:14px;margin-top:18px}.sourceLine{justify-content:space-between}.sourceLine span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.options{font-size:12px;color:#aab4c4;padding:16px 0;border-top:1px solid #242936;border-bottom:1px solid #242936;flex-wrap:wrap}.options label{display:flex;gap:7px;align-items:center}input{accent-color:#078af5}select{background:#232733;border:1px solid #3b4351;border-radius:4px;padding:4px}#status{font-size:12px;line-height:1.5;color:#90a3bc;min-height:32px}.panel{background:#181b23;border:1px solid #2b303c;border-radius:12px;padding:22px}.channel{display:flex;gap:13px;align-items:center}.channel img{width:50px;height:50px;object-fit:cover;border-radius:50%;border:2px solid #168bf5}.channel h2{font-size:18px}hr{border:0;border-top:1px solid #303542;margin:24px 0}.link{display:flex;gap:4px;margin:10px 0}.link input{width:100%;min-width:0;background:#0f1219;border:1px solid #303b4d;border-radius:6px;color:#b7cce7;padding:9px;font-size:11px}.link button{padding:7px;font-size:11px}.wide{width:100%;margin-top:6px}.badge,.recordBadge{position:absolute;top:14px;left:14px;background:#e7314d;padding:5px 9px;border-radius:4px;font-size:11px;font-weight:700}.recordBadge{left:auto;right:14px;background:#ad233c}[hidden]{display:none!important}dialog{color:#e9edf5;background:#24262f;border:1px solid #424651;border-radius:12px;box-shadow:0 20px 100px #0009;width:760px;max-width:94vw;padding:25px}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}.modalTop{display:flex;justify-content:space-between;align-items:flex-start}nav{display:flex;gap:8px;border-bottom:1px solid #444753;margin:10px 0 20px}nav button{background:transparent;border:0;border-radius:0;color:#a7b0bf;padding:13px}nav .active{color:#56b2ff;border-bottom:2px solid #2598ff}.sources{height:310px;overflow:auto;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:14px}.source{padding:7px;background:#191c24;text-align:left;min-width:0}.source img{width:100%;height:120px;object-fit:contain;background:#080a0e;border-radius:5px}.source span{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:7px}.source.selected{border:2px solid #1f9aff;background:#183654}footer{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid #40434d}footer span{font-size:11px;color:#99a3b1}#cropCanvas{width:100%;touch-action:none;cursor:crosshair;background:#000}body.theater .viewerAside,body.theater .rail{display:none}body.theater .viewerGrid{grid-template-columns:1fr}.viewerGrid{display:grid;grid-template-columns:180px minmax(0,1fr) 310px;min-height:calc(100vh - 78px)}.rail{padding:23px 16px;background:#171921;border-right:1px solid #292e3b}.rail small{color:#8c99ad;letter-spacing:1px}.rail .channel{margin-top:25px}.rail .channel img{width:34px;height:34px}.rail .channel h2{font-size:14px}.rail p{font-size:12px;color:#95a2b7}.viewerMain{padding:25px;min-width:0}.player{background:#05070b;position:relative;aspect-ratio:16/9;display:grid;place-items:center;border:1px solid #273144;border-radius:9px;overflow:hidden}.player video{width:100%;height:100%;object-fit:contain}.offline{position:absolute;text-align:center}.offline img{width:115px;height:115px;border-radius:20px}.offline p{color:#8e9eb5}.controls{display:flex;align-items:center;gap:8px;margin:12px 0 25px}.controls button{font-size:12px;padding:8px 11px}.controls span{margin-right:auto;color:#a5b3c6;font-size:12px}.viewerAside{border-left:1px solid #303642;background:#171a22;display:flex;flex-direction:column;max-height:calc(100vh - 78px);min-height:550px}.chatTitle{padding:20px;border-bottom:1px solid #333947;font-weight:600}.messages{flex:1;overflow:auto;padding:18px;font-size:13px;overflow-wrap:anywhere}.messages p{line-height:1.6;margin:0 0 12px}.messages b{color:#4baaff;margin-right:8px}.chatForm{padding:15px;display:grid;gap:10px}.chatForm input{background:#232936;border:1px solid #3b4455;color:white;border-radius:6px;padding:10px;min-width:0}.chatForm button{background:#087fe9}.liveText{color:#ff647a}.error{color:#ff8794!important}@media(max-width:1000px){.viewerGrid{grid-template-columns:minmax(0,1fr) 280px}.rail{display:none}.workspace{grid-template-columns:minmax(0,1fr) 250px}.actions{flex-wrap:wrap}header small{display:none}}@media(max-width:700px){.viewerGrid{display:block}.viewerAside{height:450px}.studio{padding:20px}.workspace{display:block}.panel{margin-top:20px}header{padding:0 15px}header strong{font-size:17px}kbd{font-size:10px}.sources{grid-template-columns:1fr}}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}.headerUser{margin-left:auto;display:flex;align-items:center;color:#9ccfff}.viewerGrid{grid-template-columns:180px minmax(0,1fr) 330px}.rail{display:block}.railNote{border-top:1px solid #2c3444;margin-top:45px;padding-top:22px;color:#5caeff}.railNote>span{font-size:30px}.streamHeading{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}#viewerCount{color:#91a3bd;font-size:12px}.player{background:radial-gradient(ellipse at 50% 20%,#0c3454,#080d17 70%)}.offline{padding-bottom:40px;width:100%}.offline img{width:100px;height:100px;box-shadow:0 0 65px #0079d733}.offline h2{font-size:27px;margin-top:18px}.offlinePill{display:table;margin:16px auto 0;font-size:10px;letter-spacing:2px;background:#222e40;color:#93a8c2;padding:5px 10px;border-radius:5px}.playerControls{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:8px;padding:14px;background:linear-gradient(transparent,#030811e8)}.playerControls button{font-size:11px;padding:7px 10px;background:#192434c9;border-color:#304156}.playerControls input{width:65px}.playerControls #state{margin-left:10px;margin-right:auto;font-size:11px;color:#a0b1ca}.channelDescription{display:flex;justify-content:space-between;align-items:center;margin-top:25px}.channelDescription h1{font-size:23px;margin:0 0 3px}.channelDescription .channel img{width:64px;height:64px}.tags{display:flex;gap:6px;margin-top:10px}.tags span{font-size:10px;background:#232b3a;color:#b0bed3;padding:4px 9px;border-radius:20px}.channelLabel{font-size:9px;color:#6993b8;letter-spacing:2px}.aboutChannel{margin-top:25px;border-top:1px solid #242d3b;padding-top:15px;color:#8d9eb6}.aboutChannel p{line-height:1.8;font-size:13px;max-width:700px}.chatTitle{display:flex;justify-content:space-between;align-items:center}.chatDot{color:#4b9fea;font-size:10px}.chatWelcome{color:#8c9cb1;background:#1e2633;padding:12px;border-radius:7px;font-size:12px}.chatForm textarea{resize:vertical;min-height:70px;max-height:140px;outline:none;background:#222b3b;border:1px solid #3e4a5f;border-radius:7px;padding:12px;font:inherit;color:#ecf4ff;width:100%}.chatForm textarea:focus{border-color:#299cfc;box-shadow:0 0 0 2px #1689e426}#chatIdentity{font-size:11px;color:#899ab2}#chatIdentity b{color:#5db6ff}.chatBottom{display:flex;align-items:center;justify-content:space-between;gap:10px}.chatBottom label{font-size:11px;color:#8e9db1}.chatBottom button{font-size:12px;padding:9px 13px}#chatStatus{font-size:10px}.welcome{width:420px;padding:35px;text-align:center;background:radial-gradient(ellipse at top,#142c46,#191e29 75%);border-color:#30425c}.welcomeLogo img{width:85px;height:85px;border-radius:20px;margin-bottom:23px}.welcome h2{font-size:25px;margin-top:12px}.welcome label{display:block;text-align:left;font-size:12px;margin:25px 0 7px;color:#b5c3d7}.welcome input{width:100%;border:1px solid #3b516f;background:#101923;padding:13px;border-radius:7px;color:white}.welcome button{margin-top:17px;padding:13px}.welcome .hint{font-size:10px;margin-top:20px}.messages .chatTime{font-size:10px;color:#64738b;margin-right:7px}body.theater .viewerMain{max-width:1500px;width:100%;margin:auto}.player:fullscreen{border:0;border-radius:0;aspect-ratio:auto;background:#000}.player:fullscreen .playerControls{padding:25px}.player:fullscreen video{object-fit:contain}@media(min-width:1001px){.viewerAside{height:calc(100vh - 78px);position:sticky;top:0}.viewerMain{padding:26px}}@media(max-width:1100px){.viewerGrid{grid-template-columns:minmax(0,1fr) 290px}.rail{display:none}.channelLabel{display:none}.playerControls input{display:none}.playerControls #state{font-size:10px;margin-left:0}}@media(max-width:700px){.viewerGrid{display:block}.viewerMain{padding:15px}.viewerAside{height:470px;max-height:none;min-height:0}.offline img{width:55px;height:55px}.offline h2{font-size:18px;margin-top:10px}.offline p{font-size:11px}.offlinePill{margin-top:7px;font-size:8px}.offline{padding-bottom:35px}.playerControls{padding:8px;gap:5px}.playerControls button{font-size:9px;padding:6px}.playerControls #state{display:none}.playerControls #mute{margin-right:auto}.channelDescription .muted{font-size:11px}header small{display:none}.headerUser{font-size:11px}.channelDescription .channel img{width:50px;height:50px}}
/* Responsive viewer and orientation-aware fullscreen. */
html{height:100%;-webkit-text-size-adjust:100%}body{min-width:0;overflow-x:hidden}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation}.brand,.headerUser,.channelDescription .channel,.channelDescription .channel>div{min-width:0}.headerUser{max-width:30%}#myName{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playerViewport{width:100%;height:100%;position:relative;display:grid;place-items:center;overflow:hidden;min-width:0;min-height:0}.player video{position:absolute;inset:0;object-fit:contain;min-width:0;min-height:0}.playerControls{z-index:4;transition:opacity .2s}.exitFullscreen{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));z-index:6;width:44px;height:44px;padding:0;background:#111d30cc;border-color:#5b6d84;border-radius:50%;font-size:22px}.playerNotice{position:absolute;z-index:5;top:20%;left:10%;right:10%;background:#111d30ec;color:#dcecff;padding:12px;border-radius:8px;text-align:center;font-size:12px;line-height:1.5;pointer-events:none}.player.fullscreen-active{width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;border:0;border-radius:0;background:#000}.player.immersive{position:fixed;inset:0;width:100vw;height:100dvh;height:var(--view-height,100dvh);z-index:1000}.player-expanded{overflow:hidden!important}.player.rotated-landscape .playerViewport{position:absolute;width:var(--fullscreen-height,100dvh);height:var(--fullscreen-width,100vw);left:50%;top:50%;transform:translate(-50%,-50%) rotate(90deg)}.player.fullscreen-active .playerControls{padding:18px max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));gap:12px}.player.fullscreen-active .playerControls button{min-height:44px;font-size:13px}.player.controls-hidden .playerControls,.player.controls-hidden .exitFullscreen{opacity:0;pointer-events:none}.player.fullscreen-active .offline{padding-bottom:65px}.player.fullscreen-active .offline img{width:75px;height:75px}.messages{min-height:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.welcome{max-height:calc(var(--view-height,100dvh) - 24px);overflow:auto}.welcome input,.chatForm textarea{font-size:16px}.welcome{box-sizing:border-box}.playerControls #mute{white-space:nowrap}
@media(max-width:700px){body{height:100dvh;height:var(--view-height,100dvh);overflow:hidden}header{height:60px;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));gap:8px}header .brand{gap:8px;flex:1}header img{width:34px;height:34px;flex:none}header strong{font-size:clamp(13px,3.7vw,17px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.4px}.headerUser{font-size:11px;gap:0;max-width:28%}.headerUser .icon{padding:6px;min-width:36px;min-height:40px}.viewerGrid{display:flex;flex-direction:column;min-height:0;height:calc(var(--view-height,100dvh) - 60px)}.viewerMain{padding:10px 10px 0;flex:none}.streamHeading{margin-bottom:8px}.streamHeading .eyebrow{font-size:8px;letter-spacing:1.7px}#viewerCount{font-size:10px}.player{aspect-ratio:16/9;width:100%;border-radius:8px}.playerControls{padding:6px;gap:5px;align-items:center}.playerControls button{font-size:11px;padding:7px 9px;min-height:38px;border-radius:6px}.playerControls #state,.playerControls #volume{display:none}.playerControls #mute{margin-right:auto}.playerControls #theater{font-size:0;padding:6px 10px}.playerControls #theater:after{content:'Teatro';font-size:11px}.offline{padding:0 10px 35px}.offline img{width:44px;height:44px;border-radius:12px}.offline h2{font-size:clamp(13px,4vw,18px);margin:7px 0 4px}.offline p{font-size:10px;margin:4px 0;line-height:1.4}.offlinePill{margin:6px auto 0;font-size:8px;padding:3px 7px;letter-spacing:1.5px}.offline button{padding:6px 10px;font-size:11px}.channelDescription{margin:10px 0 12px;gap:5px}.channelDescription .channel{gap:9px}.channelDescription .channel img{width:36px;height:36px;flex:none}.channelDescription h1{font-size:17px;margin:0}.channelDescription .muted{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:calc(100vw - 85px);font-size:10px}.tags,.aboutChannel{display:none}.viewerAside{flex:1;min-height:200px;height:auto;max-height:none;border-left:0;border-top:1px solid #303642;padding-bottom:env(safe-area-inset-bottom)}.chatTitle{padding:10px 14px;font-size:12px;min-height:36px}.messages{padding:12px 14px;font-size:13px;flex:1;min-height:35px}.chatWelcome{font-size:11px;padding:9px}.chatForm{padding:9px 12px;gap:7px;background:#171a22}.chatForm textarea{min-height:44px;max-height:84px;resize:none;padding:10px;line-height:1.35}.chatBottom button{min-height:38px;padding:8px 14px}.chatBottom label{display:flex;align-items:center;gap:5px;min-height:30px}#chatStatus{display:none}#chatIdentity{font-size:10px}.welcome{width:calc(100vw - 28px);max-width:420px;padding:25px 22px;margin:auto}.welcomeLogo img{width:60px;height:60px;margin-bottom:16px}.welcome h2{font-size:23px}.welcome .muted{font-size:13px}.welcome label{margin-top:18px}.welcome .hint{margin-bottom:0}.chat-typing .channelDescription,.chat-typing .streamHeading{display:none}.chat-typing .viewerMain{padding-top:6px}.chat-typing .player:not(.fullscreen-active){max-height:22dvh;aspect-ratio:auto;height:22dvh}.chat-typing .offline img,.chat-typing .offlinePill,.chat-typing .offline p{display:none}.chat-typing .offline h2{font-size:12px}.chat-typing .chatWelcome{display:none}body.theater .viewerMain{padding:0}body.theater .streamHeading,body.theater .channelDescription{display:none}body.theater .player{border-radius:0}.player.fullscreen-active .playerControls #theater{display:none}.player.fullscreen-active .offline img{width:55px;height:55px}.player.fullscreen-active .offline h2{font-size:20px}}
@media(max-width:360px){.playerControls button{font-size:10px;padding:6px}.playerControls #theater{display:none}.headerUser{max-width:23%}.offline img{width:34px;height:34px}.offline h2{font-size:13px}.offline p{font-size:9px}}
@media(max-height:600px) and (min-width:701px) and (max-width:1100px) and (orientation:landscape){body{height:100dvh;overflow:hidden}header{height:48px;padding:5px 15px}header img{width:30px;height:30px}.viewerGrid{height:calc(var(--view-height,100dvh) - 48px);min-height:0;grid-template-columns:minmax(0,1fr) 270px}.viewerMain{padding:7px;display:flex;min-height:0}.viewerMain .streamHeading,.channelDescription,.aboutChannel{display:none}.player{height:100%;aspect-ratio:auto}.viewerAside{height:100%;min-height:0;max-height:none}.chatTitle{padding:9px 12px}.chatForm{padding:8px;gap:5px}.chatForm textarea{min-height:42px;height:42px}.messages{padding:10px}#chatStatus{display:none}.welcome{padding:15px 25px;max-height:94dvh}.welcomeLogo img{width:40px;height:40px;margin-bottom:5px}.welcome h2{font-size:20px}.welcome .muted{margin:6px 0}.welcome label{margin-top:10px}.welcome input{padding:9px}.welcome button{padding:9px;margin-top:10px}.welcome .hint{margin-top:8px}.player.fullscreen-active .playerControls #theater{display:none}}
@media(max-height:600px) and (max-width:700px) and (orientation:portrait){.viewerAside{min-height:170px}.offline img{width:32px;height:32px}.offlinePill{display:none}.channelDescription{margin:6px 0}.channelDescription .channel img{width:28px;height:28px}.chatTitle{min-height:30px;padding:7px 12px}.chatWelcome{display:none}.chatForm{gap:4px}.welcome{padding:15px 20px}.welcomeLogo img{width:42px;height:42px;margin-bottom:9px}.welcome h2{font-size:20px}.welcome .muted{margin:6px 0}.welcome label{margin-top:12px}}
@media(max-width:700px){.chat-typing .viewerAside,.chat-typing .messages{min-height:0}.chat-typing .player:not(.fullscreen-active){height:calc(var(--view-height,100dvh) * .2);max-height:120px}}
@media(max-height:600px) and (min-width:480px) and (max-width:1100px) and (orientation:landscape){body{height:100dvh;overflow:hidden}header{height:48px;padding:5px 12px}header img{width:30px;height:30px}.viewerGrid{display:grid;height:calc(var(--view-height,100dvh) - 48px);min-height:0;grid-template-columns:minmax(0,1fr) min(38vw,270px)}.viewerMain{padding:6px;display:flex;min-height:0}.streamHeading,.channelDescription,.aboutChannel{display:none}.player{height:100%;aspect-ratio:auto}.viewerAside{height:100%;min-height:0;max-height:none;border-top:0;border-left:1px solid #303642}.chatTitle{padding:8px 10px;min-height:30px;font-size:11px}.chatForm{padding:6px;gap:4px}.chatForm textarea{min-height:38px;height:38px}.chatBottom button{min-height:32px;padding:6px 10px}.chatBottom label{font-size:10px}.messages{padding:8px;min-height:0}.chatWelcome{display:none}#chatStatus{display:none}.welcome{padding:15px 22px;max-height:94dvh}.welcomeLogo img{width:36px;height:36px;margin-bottom:3px}.welcome h2{font-size:19px;margin-top:7px}.welcome .eyebrow{font-size:8px}.welcome .muted{margin:5px 0;font-size:11px}.welcome label{margin-top:9px;font-size:11px}.welcome input{padding:8px}.welcome button{padding:8px;margin-top:9px}.welcome .hint{margin-top:8px;font-size:9px}.player.fullscreen-active .playerControls #theater{display:none}.chat-typing .player:not(.fullscreen-active){height:100%;max-height:none}}
@media(max-height:600px) and (min-width:480px) and (max-width:1100px) and (orientation:landscape){.viewerMain>.player{flex:1 1 auto;width:100%;min-width:0}}
@media(max-width:700px),(max-height:600px) and (max-width:1100px){#chatStatus{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}