:root{--bg:#080b10;--panel:#11161e;--panel2:#171d27;--line:#252c37;--text:#eef2f7;--muted:#8c96a6;--red:#ff3b45;--green:#39d98a;--blue:#55a6ff;--amber:#f2b84b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:"DM Sans",sans-serif;font-size:14px}.topbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 22px;gap:42px;background:#0c1016}.brand{display:flex;align-items:center;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:.5px}.brand-mark{width:31px;height:31px;border:2px solid var(--amber);border-radius:7px;display:grid;place-items:center;margin-right:9px;color:var(--amber)}.brand b{color:var(--amber)}.brand small{color:#66717f;font-size:9px;letter-spacing:2px;margin:15px 0 0 -50px}.service{display:flex;align-items:center;gap:10px;margin:auto}.service small,.profile small{display:block;color:var(--muted);font-size:10px}.service strong{font-size:13px}.pulse-dot,.green-dot,.red-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.red-dot{background:var(--red);box-shadow:0 0 10px var(--red)}.top-actions{display:flex;gap:10px}.icon-btn,.profile{background:#151a22;border:1px solid var(--line);color:white;border-radius:8px;height:40px}.icon-btn{width:40px}.profile{display:flex;align-items:center;gap:9px;padding:0 10px}.profile>span:first-child{background:#343c49;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:10px}.profile i{color:var(--muted)}button{font:inherit;cursor:pointer}.workspace{display:grid;grid-template-columns:minmax(700px,1fr) 318px;max-width:1540px;margin:auto}.production{padding:18px 20px}.sidebar{padding:18px 18px 18px 0;display:flex;flex-direction:column;gap:14px}.monitor-grid{display:grid;grid-template-columns:1fr 58px 1fr;align-items:center}.monitor{background:var(--panel);border:1px solid var(--line);border-radius:9px;overflow:hidden}.monitor-head{height:39px;display:flex;justify-content:space-between;align-items:center;padding:0 12px;font-size:11px;font-weight:700;letter-spacing:1px}.monitor-head small{color:var(--muted);letter-spacing:0}.program-monitor{border-color:#68292f}.program-monitor .monitor-head{background:#281116;color:#ff6970}.video-frame{position:relative;aspect-ratio:16/9;overflow:hidden;background:#161a23}.stage{position:relative;overflow:hidden;background:linear-gradient(145deg,#1d2636,#0e131b 65%);height:100%}.stage:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,rgba(255,255,255,.035) 50%,transparent 52%),linear-gradient(rgba(255,255,255,.02),transparent);background-size:90px 100%,100% 100%}.stage-light{position:absolute;width:70%;height:120%;left:15%;top:-60%;background:radial-gradient(ellipse,rgba(242,184,75,.25),transparent 63%)}.cross{position:absolute;left:50%;top:19%;transform:translateX(-50%);color:#e8b95e;font-size:34px;text-shadow:0 0 30px #f5bd52}.pulpit{position:absolute;width:19%;height:33%;background:linear-gradient(90deg,#7a4d27,#c28a4b,#6a3e1f);left:41%;bottom:2%;clip-path:polygon(12% 0,88% 0,100% 100%,0 100%)}.speaker{position:absolute;width:9%;height:30%;border-radius:50% 50% 25% 25%;background:#22252a;left:46%;bottom:29%}.people{position:absolute;display:flex;gap:4%;bottom:8%;left:18%;width:64%;align-items:end}.people i{width:16%;height:42px;background:#323b49;border-radius:50% 50% 10% 10%}.people i:nth-child(2n){height:51px;background:#5d463c}.audience,.band{position:absolute;left:15%;right:15%;bottom:0;height:42%;background:repeating-linear-gradient(90deg,#242b37 0 20px,#111722 20px 34px);clip-path:polygon(8% 30%,18% 0,28% 24%,40% 2%,52% 27%,65% 0,78% 28%,89% 4%,100% 34%,100% 100%,0 100%,0 35%)}.band{background:repeating-linear-gradient(90deg,#563c29 0 18px,#1d2430 18px 35px);height:48%}.live-bug{position:absolute;right:12px;top:12px;background:var(--red);font-weight:800;font-size:9px;padding:4px 7px;border-radius:4px}.church-logo{position:absolute;left:12px;top:12px;font-family:Manrope;font-weight:800;color:#e7bd68}.church-logo small{display:block;font-size:5px;letter-spacing:1.2px;color:white}.camera-label{position:absolute;right:8px;bottom:7px;background:rgba(5,8,12,.72);padding:4px 7px;border-radius:3px;font-size:8px}.lower-third{position:absolute;left:0;bottom:20px;padding:8px 18px 8px 22px;background:linear-gradient(90deg,rgba(8,10,15,.96),rgba(8,10,15,.75),transparent);width:70%;border-left:3px solid var(--amber)}.lower-third small{font-size:7px;color:var(--amber);letter-spacing:1.3px}.lower-third strong{font-family:Manrope;display:block;font-size:14px}.lower-third span{font-size:8px;color:#c2c9d2}.take-btn{height:88px;background:#1a2029;border:1px solid #303846;color:#d5dbe4;margin:0 6px;border-radius:7px;font-size:9px;font-weight:700}.take-btn span{display:block;font-size:24px;color:var(--red)}.take-btn kbd{display:block;margin:5px auto 0;background:#2a313d;color:#7d8797;font-size:7px;width:35px;padding:2px;border-radius:2px}.sources-head{display:flex;justify-content:space-between;align-items:center;margin:18px 0 10px}.sources-head h2{font-size:14px;margin:0;display:inline}.sources-head span{font-size:10px;color:var(--green);margin-left:8px}.add-btn{border:1px solid #3b4554;background:#171d26;color:#dfe6ef;padding:8px 12px;border-radius:6px;font-size:11px}.source-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.source{padding:5px 5px 8px;text-align:left;background:#11161e;border:1px solid var(--line);border-radius:7px;color:var(--text);position:relative}.source.active-program{border-color:var(--red);box-shadow:inset 0 -2px var(--red)}.source.active-preview{border-color:var(--green);box-shadow:inset 0 -2px var(--green)}.thumb{aspect-ratio:16/9;height:auto;border-radius:4px}.thumb b{position:absolute;top:5px;left:5px;background:#080b0fbb;padding:3px 6px;border-radius:3px;font-size:9px}.thumb em{position:absolute;bottom:4px;right:4px;font-style:normal;background:var(--red);padding:2px 5px;border-radius:3px;font-size:7px}.active-preview .thumb em{background:var(--green);color:#04170e}.source>strong{display:block;margin:7px 4px 1px;font-size:11px}.source>span{margin-left:4px;color:var(--muted);font-size:8px}.source>span i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--green)}.bottom-panels{display:grid;grid-template-columns:.68fr 1.32fr;gap:12px;margin-top:14px}.panel,.stream-card{background:var(--panel);border:1px solid var(--line);border-radius:9px}.panel{padding:12px}.panel-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.panel-title h3{font-size:12px;margin:0}.panel-title button{border:0;background:none;color:var(--muted)}.scene-list{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.scene{height:53px;background:#181e27;color:#b5bdc9;border:1px solid #272f3b;border-radius:5px;font-size:8px}.scene span{display:block;font-size:16px}.scene.active{border-color:var(--amber);color:var(--amber)}.audio-ok{font-size:8px;color:var(--green)}.channel{display:grid;grid-template-columns:25px 110px 1fr 40px 82px;align-items:center;gap:7px;margin-top:8px}.mute{width:25px;height:25px;border-radius:5px;border:0;background:#29333f}.mute.active{background:#1e513f}.channel strong{font-size:9px;display:block}.channel small{font-size:7px;color:var(--muted)}.channel>b{font-size:8px;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--amber)}.meter{display:flex;gap:2px}.meter i{height:6px;flex:1;background:var(--green);border-radius:1px}.meter i:nth-last-child(-n+2){background:#e3b64e}.meter i:last-child{background:#e34e52}.meter.low i:nth-child(n+3){background:#28313d}.stream-card{padding:13px}.status-row{display:flex;justify-content:space-between;font-size:9px;font-weight:700;letter-spacing:.6px;padding-bottom:10px;border-bottom:1px solid var(--line)}.status-row b{font-size:11px;color:#ff6a70}.dest{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;margin-top:11px}.dest>span{width:27px;height:27px;border-radius:5px;display:grid;place-items:center;color:white;font-weight:bold}.youtube{background:#e62732}.facebook{background:#1877f2;font-family:Arial;font-size:18px}.dest strong{font-size:10px;display:block}.dest small{font-size:8px;color:var(--muted)}.connected{font-size:8px;color:var(--green);font-style:normal}.stats{display:grid;grid-template-columns:repeat(3,1fr);margin:13px 0;background:#171d26;border-radius:6px;padding:8px 0}.stats div{text-align:center;border-right:1px solid var(--line)}.stats div:last-child{border:0}.stats strong,.stats small{display:block}.stats strong{font-size:13px}.stats small{font-size:7px;color:var(--muted)}.end-btn{width:100%;height:34px;border:1px solid #6b3034;background:#26171b;color:#ff6269;border-radius:6px;font-size:9px}.overlay label{display:flex;justify-content:space-between;font-size:9px;margin:12px 0 6px;color:#bdc5d0}.toggle{width:25px;height:14px;border-radius:10px;background:#343d4a;position:relative}.toggle:after{content:"";position:absolute;width:10px;height:10px;background:white;border-radius:50%;left:2px;top:2px}.toggle.on{background:#286d51}.toggle.on:after{left:13px}.verse{background:#1a2029;border-radius:6px;padding:9px;border-left:2px solid var(--amber)}.verse small{color:var(--amber);font-size:7px}.verse p{font-family:Georgia,serif;font-style:italic;font-size:9px;line-height:1.35}.verse button{width:100%;background:#232b36;border:0;color:#b3bdc9;font-size:8px;padding:6px;border-radius:4px}.speaker-card{display:grid;grid-template-columns:28px 1fr 18px;align-items:center;gap:7px;background:#1a2029;padding:7px;border-radius:6px}.speaker-card>div{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#3d4655;font-size:8px}.speaker-card strong,.speaker-card small{display:block;font-size:9px}.speaker-card small{color:var(--muted);font-size:7px}.speaker-card button{background:none;border:0;color:var(--muted)}.quick>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:6px}.quick button{background:#181e27;color:#aeb7c4;border:1px solid var(--line);border-radius:5px;font-size:8px;padding:9px 3px}.quick button span{color:var(--amber);margin-right:4px}.modal{position:fixed;inset:0;background:#05070bbd;display:none;place-items:center;z-index:20}.modal.open{display:grid}.modal-card{width:min(420px,90vw);background:#141a23;border:1px solid #303a48;border-radius:12px;padding:28px;text-align:center;position:relative;box-shadow:0 25px 80px #000}.modal-close{position:absolute;right:13px;top:10px;background:none;border:0;color:#9ba5b2;font-size:23px}.qr{font-size:26px;color:var(--amber)}.modal h2{margin:8px 0}.modal p{color:var(--muted);font-size:12px}.fake-qr{margin:18px auto;width:140px;height:140px;background:repeating-conic-gradient(#111 0 25%,#fff 0 50%) 0/18px 18px;border:9px solid white;display:grid;place-items:center}.fake-qr span{background:white;color:#111;padding:6px;font-size:9px;font-weight:800}.modal label{display:block;text-align:left;font-size:9px;color:var(--muted)}.copy-row{display:flex;margin-top:5px}.copy-row input{flex:1;background:#0d1118;border:1px solid #313a47;border-radius:5px 0 0 5px;color:white;padding:9px;font-size:10px}.copy-row button{background:var(--amber);border:0;border-radius:0 5px 5px 0;font-size:10px;font-weight:bold}.modal-card>small{color:#667180;font-size:8px;display:block;margin-top:10px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;background:#e9edf3;color:#10141b;padding:10px 16px;border-radius:6px;font-weight:600;font-size:11px;transition:.25s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:1050px){.workspace{grid-template-columns:1fr}.sidebar{padding:0 20px 20px;display:grid;grid-template-columns:repeat(3,1fr)}.topbar{gap:15px}.service{display:none}}@media(max-width:760px){.monitor-grid{grid-template-columns:1fr}.take-btn{height:42px;margin:7px}.source-grid{grid-template-columns:1fr 1fr}.bottom-panels,.sidebar{grid-template-columns:1fr}.topbar{padding:0 10px}.profile>span:nth-child(2),.brand small{display:none}.production{padding:12px}.channel{grid-template-columns:25px 90px 1fr}.channel>b,.channel input{display:none}}

/* Local church identity in the studio header. */
.topbar .brand { flex-shrink:0; }
.topbar .brand-mark { flex-shrink:0; }
.topbar .service { min-width:0; }
@media(max-width:760px){.topbar .brand{font-size:12px;max-width:190px}.topbar .brand>span:last-child{line-height:1.3}}