/* StreamPanel module "video": live video channels, player, video nodes. Everything is prefixed .vd / .vdp / .vdw */

/* ---------- sub navigation ---------- */
.vd-nav{display:flex;gap:4px;margin:0 0 18px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-panel);overflow-x:auto;scrollbar-width:none}
.vd-nav::-webkit-scrollbar{display:none}
.vd-nav a{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:var(--r-ctl);color:var(--mut);font:500 13.5px Rubik,Heebo,sans-serif;white-space:nowrap;flex:none}
.vd-nav a:hover{color:var(--ink);background:var(--surface2)}
.vd-nav a.on{background:var(--sig-soft);color:var(--sig);font-weight:600}
.vd-nav .svgi{width:16px;height:16px}

/* ---------- layout ---------- */
.vd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start;margin-bottom:20px}
.vd-grid-wide{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.vd-grid-1{grid-template-columns:minmax(0,1fr)}
.vd-stack{display:flex;flex-direction:column;gap:20px;min-width:0}
.vd-hd{margin-bottom:14px}
.vd-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.vd-inline input[type=number]{max-width:130px}
.vd-row-end{display:flex;gap:8px;justify-content:flex-end;align-items:center;margin-top:12px;flex-wrap:wrap}
.vd-savebar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-panel)}
.vd-ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;display:block}
.vd-bad{color:var(--bad)!important}
.vd-hint-box{display:flex;gap:9px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:var(--r-ctl);background:var(--surface2);border:1px solid var(--line2);color:var(--mut);font-size:12.5px;line-height:1.5}
.vd-hint-box .svgi{flex:none;margin-top:2px}
.vd-code{width:100%;font-size:12px;line-height:1.5;padding:10px 12px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface2);color:var(--ink2);resize:vertical;white-space:pre-wrap;word-break:break-all;margin:0}
.btn-danger-lt{color:var(--bad)!important}
.btn-danger-lt:hover{border-color:var(--bad)!important}
.opt.is-dis{opacity:.55;cursor:not-allowed}
.vd-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.vd-opts .opt{margin:0}

/* ---------- create ---------- */
.vd-create{display:flex;gap:28px;align-items:flex-start;padding:28px}
.vd-create-art .ic{width:76px;height:76px;border-radius:20px;display:grid;place-items:center}
.vd-create-art .svgi{width:34px;height:34px}
.vd-create-body{flex:1;min-width:0}
.vd-create-body h2{margin-bottom:4px}
.vd-ticks{list-style:none;padding:0;margin:16px 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.vd-ticks li{display:flex;gap:8px;align-items:flex-start;font-size:13.5px}
.vd-ticks .svgi{color:var(--ok);flex:none;margin-top:3px}
.vd-create-form{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.vd-create-form .field{margin:0;min-width:220px}

/* ---------- overview hero ---------- */
.vd-hero{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:20px;margin-bottom:20px;align-items:start}
.vd-screen{min-width:0}
.vd-now{display:flex;flex-direction:column;gap:14px}
.vd-now-top{display:flex;gap:8px;align-items:center;justify-content:space-between}
.vd-now-title{display:flex;flex-direction:column;gap:2px;min-width:0}
.vd-now-title b{font:600 17px/1.35 Rubik,Heebo,sans-serif;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vd-next{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--mut);padding-top:10px;border-top:1px solid var(--line2)}
.vd-next b{color:var(--ink)}
.vd-now-links{display:flex;gap:8px;flex-wrap:wrap}
.vd-err{font-size:12px;color:var(--bad);background:var(--bad-soft);border-radius:6px;padding:6px 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.vd-src{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:13px;font:600 12px Rubik,Heebo,sans-serif;white-space:nowrap;background:var(--surface2);color:var(--mut)}
.vd-src i{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.vd-src-live{background:var(--air);color:#fff}
.vd-src-live i{background:#fff;animation:vd-pulse 1.4s ease-in-out infinite}
.vd-src-on{background:var(--ok-soft);color:var(--ok)}
@keyframes vd-pulse{50%{opacity:.25}}
.vd-rec{display:inline-flex;align-items:center;gap:6px;font:700 11px Rubik,sans-serif;color:var(--air);letter-spacing:.5px}
.vd-rec i{width:9px;height:9px;border-radius:50%;background:var(--air);animation:vd-pulse 1.2s infinite}
@media (prefers-reduced-motion:reduce){.vd-src-live i,.vd-rec i{animation:none}}

.vd-kv{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vd-kv-3{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:4px}
.vd-kv-2{grid-template-columns:1fr 1fr;margin:12px 0}
.vd-kv>div{background:var(--surface2);border:1px solid var(--line2);border-radius:var(--r-ctl);padding:9px 11px;display:flex;flex-direction:column;gap:2px;min-width:0}
.vd-kv span{font-size:11.5px;color:var(--mut)}
.vd-kv b{font:600 16px Rubik,sans-serif;font-variant-numeric:tabular-nums;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- switches ---------- */
.vd-sw{position:relative;display:inline-block;width:42px;height:24px;border-radius:12px;border:0;background:var(--line);cursor:pointer;padding:0;transition:background .15s;vertical-align:middle;flex:none}
.vd-sw i{position:absolute;top:3px;inset-inline-start:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:inset-inline-start .15s}
.vd-sw.on{background:var(--ok)}
.vd-sw.on i{inset-inline-start:21px}
.vd-sw.sm{width:36px;height:20px}
.vd-sw.sm i{width:14px;height:14px}
.vd-sw.sm.on i{inset-inline-start:19px}
.vd-sw-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line2)}
.vd-sw-row>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.vd-sw-row b{font-size:13.5px;font-weight:600}
.vd-sw-label{cursor:pointer;margin-bottom:12px}
/* checkbox drawn as a switch */
.vd-swc{appearance:none;-webkit-appearance:none;position:relative;width:42px;height:24px;border-radius:12px;background:var(--line);cursor:pointer;flex:none;margin:0;transition:background .15s}
.vd-swc::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:inset-inline-start .15s}
.vd-swc:checked{background:var(--ok)}
.vd-swc:checked::after{inset-inline-start:21px}
.vd-swc:focus-visible,.vd-sw:focus-visible{outline:2px solid var(--sig);outline-offset:2px}

/* ---------- storage meter ---------- */
.vd-usage{margin-top:14px;display:flex;flex-direction:column;gap:6px}
.vd-usage-hd{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;font-weight:500}
.vd-meter{height:7px;border-radius:4px;background:var(--surface2);border:1px solid var(--line2);overflow:hidden;flex:1;min-width:40px}
.vd-meter b{display:block;height:100%;background:var(--sig);border-radius:4px}
.vd-usage .vd-meter{flex:none}
.vd-meter.is-warn b{background:var(--warn)}
.vd-meter.is-bad b{background:var(--bad)}

/* ---------- lists ---------- */
.vd-list{display:flex;flex-direction:column}
.vd-item{display:flex;align-items:center;gap:12px;padding:11px 8px;border-bottom:1px solid var(--line2);min-width:0}
.vd-item:last-child{border-bottom:0}
a.vd-item:hover,.vd-item:not(.vd-head):hover{background:var(--surface2)}
.vd-item.is-out{opacity:.55}
.vd-item.is-playing{background:linear-gradient(90deg,var(--ok-soft),transparent 70%)}
[dir=rtl] .vd-item.is-playing{background:linear-gradient(270deg,var(--ok-soft),transparent 70%)}
.vd-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.vd-main>*{align-self:flex-start}
.vd-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:13.5px;max-width:100%}
.vd-main .sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vd-n{width:22px;text-align:center;color:var(--mut);font-size:12px;flex:none}
.vd-thumb{position:relative;width:96px;aspect-ratio:16/9;border-radius:6px;background:var(--surface2);border:1px solid var(--line2);display:grid;place-items:center;color:var(--mut);overflow:hidden;flex:none;padding:0}
.vd-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vd-thumb-btn{cursor:pointer}
.vd-thumb-btn .svgi{position:relative;z-index:1;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
.vd-thumb-btn:disabled{cursor:default}
.vd-st{flex:none}
.vd-acts{display:flex;gap:6px;align-items:center;flex:none}
.vd-acts form{display:inline-flex;gap:6px;align-items:center}
.vd-acts .iconbtn{width:30px;height:30px}
.vd-acts .iconbtn:disabled{opacity:.35;cursor:default}
.vd-onair{color:var(--ok)}
.vd-head{font-size:12px;color:var(--mut);padding-top:0;border-bottom:1px solid var(--line)}
.vd-chrow{display:grid;grid-template-columns:minmax(160px,1.6fr) minmax(90px,.8fr) minmax(130px,1fr) 80px minmax(120px,1fr) 90px;gap:12px}
.vd-chrow>span{min-width:0}

/* ---------- quality ladder ---------- */
.vd-ladder{display:flex;flex-direction:column;border:1px solid var(--line2);border-radius:var(--r-ctl);overflow:hidden;margin-bottom:8px}
.vd-lrow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.9fr);gap:12px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line2)}
.vd-lrow:last-child{border-bottom:0}
.vd-lhead{background:var(--surface2);font-size:12px;color:var(--mut);padding:8px 12px}
.vd-lrow.is-locked{opacity:.55}
.vd-lname{margin:0;gap:8px;flex-wrap:wrap}
.vd-num{display:flex;gap:6px;align-items:center}
.vd-num input{min-width:0}
[data-vd-ladder].is-off .vd-lrow:not(.vd-lhead){opacity:.4;pointer-events:none}
.vd-caps{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:10px}
.vd-dvr{margin-top:12px}

/* ---------- uploads ---------- */
.vd-drop{padding:26px 16px}
.vd-drop .svgi{margin-bottom:6px}
.vd-upl{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.vd-upl:empty{display:none}
.vd-up{display:flex;flex-direction:column;gap:5px;padding:9px 11px;border:1px solid var(--line2);border-radius:var(--r-ctl);background:var(--surface2);font-size:12.5px}
.vd-up-hd{display:flex;justify-content:space-between;gap:10px}
.vd-up-hd b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.vd-up.is-err{color:var(--bad)}
.vd-up.is-done .vd-meter b{background:var(--ok)}

/* ---------- schedule ---------- */
.vd-days{display:flex;flex-wrap:wrap;gap:6px}
.vd-days label{cursor:pointer}
.vd-days input{position:absolute;opacity:0;pointer-events:none}
.vd-days span{display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:32px;padding:0 10px;border-radius:var(--r-ctl);border:1px solid var(--line);font-size:13px;color:var(--mut);background:var(--surface)}
.vd-days input:checked+span{background:var(--sig);border-color:var(--sig);color:#fff;font-weight:600}
.vd-days input:focus-visible+span{outline:2px solid var(--sig);outline-offset:2px}
input[type=date].vd-date{width:100%;height:38px;padding:0 11px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--input);color:var(--ink);font:400 14px Heebo,sans-serif}
.vd-when{width:110px;flex:none;display:flex;flex-direction:column;gap:2px}
.vd-when b{font-size:13.5px}
.vd-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.vd-timeline li{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line2);font-size:13px;flex-wrap:wrap}
.vd-timeline li:last-child{border-bottom:0}
.vd-timeline li>span:first-child{color:var(--mut);min-width:84px}
.vd-timeline li.is-now b{color:var(--sig)}

/* ---------- restream platforms ---------- */
.vd-pf{width:34px;height:34px;border-radius:9px;display:inline-grid;place-items:center;font:700 11px Rubik,sans-serif;color:#fff;flex:none;background:#64748B}
.vd-pf-youtube{background:#E62117}
.vd-pf-facebook{background:#1877F2}
.vd-pf-telegram{background:#2AABEE}
.vd-pf-twitch{background:#18181B;box-shadow:inset 0 -3px 0 #3B82F6}
.vd-pf-dailymotion{background:#0066DC}
.vd-pf-tiktok{background:#111;box-shadow:inset 2px 0 0 #25F4EE,inset -2px 0 0 #FE2C55}
.vd-pf-custom{background:#475569}
.vd-pfs{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.vd-pfopt{cursor:pointer}
.vd-pfopt input{position:absolute;opacity:0;pointer-events:none}
.vd-pfopt>span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border:1px solid var(--line);border-radius:var(--r-ctl);font-size:12px;text-align:center;color:var(--ink2);background:var(--surface)}
.vd-pfopt input:checked+span{border-color:var(--sig);background:var(--sig-soft);color:var(--sig);font-weight:600}
.vd-pfopt input:focus-visible+span{outline:2px solid var(--sig);outline-offset:2px}

/* ---------- admin ---------- */
.vd-admin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.vd-admin-grid .field{margin:0}
.vd-nodes{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.vd-node{display:flex;flex-direction:column;gap:14px;color:inherit}
.vd-node:hover{border-color:var(--sig)}
.vd-node-hd{display:flex;gap:10px;align-items:center}
.vd-node-hd>div{flex:1;min-width:0;display:flex;flex-direction:column}
.vd-node-hd .sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vd-node-hd .ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none}
.vd-bars{display:flex;flex-direction:column;gap:7px}
.vd-bars>div{display:flex;gap:10px;align-items:center;font-size:12px}
.vd-bars span{width:40px;color:var(--mut);flex:none}
.vd-bars em{font-style:normal;width:38px;text-align:end;font-variant-numeric:tabular-nums;flex:none}
.vd-node-ft{display:flex;gap:6px 14px;flex-wrap:wrap;font-size:12px;color:var(--mut);padding-top:10px;border-top:1px solid var(--line2)}
.vd-node-ft span{display:inline-flex;gap:5px;align-items:center}
.vd-filter input[type=text]{width:180px;height:32px}
.vd-filter select{width:auto;height:32px}
.vd-steps{margin:0;padding-inline-start:20px;display:flex;flex-direction:column;gap:10px;font-size:13.5px}
.vd-steps pre{margin-top:6px}
.vd-pkgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
.vd-geo .crow .n{width:44px;text-align:end}

/* ---------- VOD dialog ---------- */
.vd-dlg{border:0;border-radius:var(--r-panel);padding:0;background:#000;width:min(960px,94vw);box-shadow:var(--shadow-pop)}
.vd-dlg::backdrop{background:rgba(5,10,20,.7)}
.vd-dlg video{display:block;width:100%;max-height:78vh;background:#000}
.vd-dlg-hd{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;color:#fff;background:#0b1220}
.vd-dlg-hd .iconbtn{background:transparent;border-color:rgba(255,255,255,.2);color:#fff}

/* =====================================================================
   Player (.vdp) - used in the panel, the public page and the iframe
   ===================================================================== */
.vdp{position:relative;width:100%;aspect-ratio:16/9;background:#05080f;border-radius:var(--r-panel);overflow:hidden;color:#fff;user-select:none;-webkit-user-select:none;font:500 13px Heebo,Rubik,system-ui,sans-serif;direction:ltr}
.vdp video{position:absolute;inset:0;width:100%;height:100%;background:#000;object-fit:contain}
.vdp:fullscreen,.vdp:-webkit-full-screen{border-radius:0;aspect-ratio:auto}
.vdp-big{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:74px;height:74px;border-radius:50%;border:0;background:rgba(255,255,255,.14);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .15s,background .15s;z-index:3}
.vdp-big svg{width:34px;height:34px;margin-left:4px}
.vdp-big:hover{background:var(--air,#E0342B);transform:translate(-50%,-50%) scale(1.06)}
.vdp.is-playing .vdp-big,.vdp.is-loading .vdp-big{opacity:0;pointer-events:none}
.vdp-msg{position:absolute;inset:auto 0 50% 0;transform:translateY(64px);display:flex;gap:8px;justify-content:center;align-items:center;font-size:13px;color:rgba(255,255,255,.85);z-index:2;pointer-events:none;padding:0 12px;text-align:center}
.vdp-txt:empty{display:none}
.vdp-spin{display:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:vdp-rot .8s linear infinite}
.vdp.is-loading .vdp-spin{display:block}
.vdp.is-loading .vdp-msg{transform:none;inset:auto 0 calc(50% - 9px) 0}
@keyframes vdp-rot{to{transform:rotate(360deg)}}
.vdp.is-off::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(36,87,214,.18),transparent 65%),repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 2px,transparent 2px 4px);z-index:1}
.vdp-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:6px;padding:26px 10px 8px;background:linear-gradient(transparent,rgba(0,0,0,.78));z-index:4;opacity:0;transition:opacity .2s}
.vdp.is-started .vdp-bar{opacity:1}
.vdp.is-started.is-idle .vdp-bar{opacity:0}
.vdp.is-started.is-idle{cursor:none}
.vdp-b{width:34px;height:34px;border:0;background:transparent;color:#fff;border-radius:6px;cursor:pointer;display:grid;place-items:center;padding:0;flex:none}
.vdp-b:hover{background:rgba(255,255,255,.14)}
.vdp-b svg{width:20px;height:20px}
.vdp-mute.is-muted .vdp-w{display:none}
.vdp input[type=range]{-webkit-appearance:none;appearance:none;height:4px;border-radius:2px;background:rgba(255,255,255,.3);outline:none;cursor:pointer;margin:0;padding:0;border:0;width:auto}
.vdp input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:#fff;border:0}
.vdp input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#fff;border:0}
.vdp-vol{width:70px;flex:none}
.vdp-seek{flex:1;min-width:40px;background:linear-gradient(90deg,var(--air,#E0342B) var(--p,100%),rgba(255,255,255,.3) var(--p,100%))!important}
.vdp-seek[hidden]{display:none}
.vdp-sp{flex:1}
.vdp-seek:not([hidden])~.vdp-sp{display:none}
.vdp-live{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:12px;border:0;background:rgba(255,255,255,.14);color:#fff;font:700 11px Rubik,sans-serif;letter-spacing:.6px;cursor:pointer;flex:none}
.vdp-live i{width:7px;height:7px;border-radius:50%;background:#aaa}
.vdp-live.is-edge{background:var(--air,#E0342B)}
.vdp-live.is-edge i{background:#fff}
.vdp-time{font-size:12px;color:rgba(255,255,255,.85);font-variant-numeric:tabular-nums;flex:none;min-width:0}
.vdp-q{position:relative;flex:none}
.vdp-qb{width:auto;padding:0 6px;gap:4px;display:inline-flex;align-items:center}
.vdp-ql{font-size:11px;font-weight:700}
.vdp-q:not(.has-levels){display:none}
.vdp-qm{position:absolute;bottom:40px;right:0;min-width:120px;background:rgba(10,15,25,.96);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:5px;display:none;flex-direction:column}
.vdp-qm.open{display:flex}
.vdp-qm button{border:0;background:transparent;color:#fff;text-align:left;padding:7px 10px;border-radius:5px;font:500 12.5px Heebo,sans-serif;cursor:pointer;white-space:nowrap}
.vdp-qm button:hover,.vdp-qm button.on{background:rgba(255,255,255,.12)}
.vdp-qm button.on::after{content:" ✓"}
@media (max-width:560px){.vdp-vol{display:none}.vdp-bar{padding:20px 6px 6px;gap:2px}.vdp-b{width:32px;height:32px}.vdp-big{width:60px;height:60px}.vdp-time{display:none}}

/* ---------- public page ---------- */
body.vdw{background:#070b14;color:#e8eef7;min-height:100vh}
body.vdw-embed{background:#000;overflow:hidden}
.vdw-embed .vdp{border-radius:0;position:fixed;inset:0;width:100%;height:100%;aspect-ratio:auto}
.vdw-wrap{max-width:1180px;margin:0 auto;padding:24px 16px 40px}
.vdw-player .vdp{box-shadow:0 30px 80px rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.06)}
.vdw-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:20px 28px;margin-top:20px}
.vdw-title{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.vdw-title h1{font-size:22px;margin:0;color:#fff}
.vdw-viewers{display:inline-flex;align-items:center;gap:6px;color:#9fb0c8;font-size:13px}
.vdw-viewers b{color:#fff}
.vdw .vd-src{background:rgba(255,255,255,.08);color:#c9d4e3}
.vdw .vd-src-live{background:#E0342B;color:#fff}
.vdw .vd-src-on{background:rgba(44,196,111,.16);color:#2CC46F}
.vdw-nn{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.vdw-nn>div{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;min-width:0}
.vdw-nn span{font-size:12px;color:#8c9bb2}
.vdw-nn b{font:600 15px Rubik,Heebo,sans-serif;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vdw-today{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:14px 16px}
.vdw-today h2{font-size:14px;margin:0 0 8px;color:#fff}
.vdw-today ol{list-style:none;margin:0;padding:0}
.vdw-today li{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px}
.vdw-today li:last-child{border-bottom:0}
.vdw-today li span{color:#8c9bb2;min-width:92px}
.vdw-today li.is-now b{color:#7aa2ff}
.vdw-today em{font-style:normal;font-size:11px;font-weight:700;background:#E0342B;color:#fff;border-radius:4px;padding:1px 6px}
.vdw-gone{min-height:100vh;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;color:#8c9bb2;text-align:center;padding:20px}
.vdw-gone b{color:#fff;font:600 17px Rubik,Heebo,sans-serif}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .vd-hero{grid-template-columns:minmax(0,1fr)}
  .vd-admin-grid{grid-template-columns:1fr 1fr}
  .vd-chrow{grid-template-columns:minmax(150px,1.6fr) minmax(90px,1fr) minmax(120px,1fr) 70px}
  .vd-chrow>span:nth-child(5),.vd-chrow>span:nth-child(6){display:none}
}
@media (max-width:980px){
  .vd-grid,.vd-grid-wide{grid-template-columns:minmax(0,1fr)}
  .vdw-info{grid-template-columns:1fr}
  .vd-pfs{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .vd-create{flex-direction:column;padding:20px;gap:16px}
  .vd-ticks{grid-template-columns:1fr}
  .vd-opts{grid-template-columns:1fr}
  .vd-admin-grid{grid-template-columns:1fr}
  .vd-kv-3{grid-template-columns:1fr 1fr}
  .vd-kv-3>div:last-child{grid-column:1/-1}
  .vd-item{flex-wrap:wrap;gap:8px 10px;padding:12px 4px}
  .vd-item .vd-main{flex:1 1 calc(100% - 140px)}
  .vd-thumb{width:84px}
  .vd-n{display:none}
  .vd-acts{margin-inline-start:auto}
  .vd-slot .vd-when{width:auto;flex:1 1 100%;flex-direction:row;gap:8px;align-items:baseline}
  .vd-chrow{display:flex;flex-wrap:wrap}
  .vd-chrow.vd-head{display:none}
  .vd-chrow>span:not(.vd-main){font-size:12px}
  .vd-lrow{grid-template-columns:1fr 1fr;gap:8px}
  .vd-lrow .vd-lname{grid-column:1/-1}
  .vd-lhead{display:none}
  .vd-pfs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vdw-nn{grid-template-columns:1fr}
  .vdw-wrap{padding:0 0 30px}
  .vdw-player .vdp{border-radius:0;border:0}
  .vdw-info{padding:0 16px}
  .copyrow{flex-wrap:wrap}
  .copyrow .v{flex:1 1 100%;order:3;text-align:start}
  .vd-filter{width:100%}
  .vd-filter input[type=text]{flex:1;width:auto}
  .vd-nodes,.vd-pkgs{grid-template-columns:1fr}
}

/* =====================================================================================================================
   v0.8.0 - theme of the video pages (#212529 + blue) and the new pages (graphics, sources, studio, automation, clips,
   report, sharing, dashboard, public page with chat / schedule, widgets). Everything stays inside .vd-scope / .vdw / .vdx.
   ===================================================================================================================== */
.vd-scope,.vd-nav,.vdw,.vdx{--vd-ink:#212529;--vd-ink2:#343a40;--vd-blue:#2f7cf6;--vd-blue-soft:#e7f0ff;--vd-red:#e5383b;--vd-gray:#f1f3f5;
  --sig:#212529;--sig-soft:#e9ecef}
[data-theme="dark"] .vd-scope,[data-theme="dark"] .vd-nav,.dark .vd-scope,.dark .vd-nav,.theme-dark .vd-scope{--sig:#4dabf7;--sig-soft:rgba(77,171,247,.14);--vd-blue-soft:rgba(47,124,246,.16);--vd-gray:rgba(255,255,255,.05)}
.vd-nav a.on{background:var(--vd-ink);color:#fff}
[data-theme="dark"] .vd-nav a.on,.dark .vd-nav a.on{background:var(--vd-blue);color:#fff}
.vd-scope .btn:not(.lt):not(.btn-danger){background:var(--vd-ink);border-color:var(--vd-ink);color:#fff}
[data-theme="dark"] .vd-scope .btn:not(.lt):not(.btn-danger),.dark .vd-scope .btn:not(.lt):not(.btn-danger){background:var(--vd-blue);border-color:var(--vd-blue)}
.vd-scope .vd-swc:checked,.vd-scope .vd-sw.on{background:var(--vd-blue)}
.vd-scope .vd-meter b{background:var(--vd-ink)}
[data-theme="dark"] .vd-scope .vd-meter b,.dark .vd-scope .vd-meter b{background:var(--vd-blue)}
.vd-scope .link{color:var(--vd-blue)}
.vd-blue{color:var(--vd-blue)!important}
.vd-ok{color:var(--ok)}
.btn-danger{background:var(--vd-red);border-color:var(--vd-red);color:#fff}

.vd-pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:0 0 16px}
.vd-pagehead h1,.vd-pagehead h2{margin:0}
.vd-section-title{margin:28px 0 14px}
.vd-section-title h2{margin:0 0 2px}
.vd-tag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:12px;font:600 11.5px Rubik,Heebo,sans-serif;white-space:nowrap;background:var(--vd-gray);color:var(--mut);margin-inline-start:auto}
.vd-tag.ok{background:var(--ok-soft);color:var(--ok)}
.vd-tag.warn{background:#fff4e5;color:#b45309}
.vd-tag.violet{background:#ede9fe;color:#6d28d9;margin:0}
.vd-tag.live{background:var(--vd-red);color:#fff}
.vd-tag.live i{width:7px;height:7px;border-radius:50%;background:#fff;animation:vd-pulse 1.4s infinite}
.sec-hd .vd-tag{align-self:center}
.vd-opts-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.vd-grow{flex-wrap:nowrap}.vd-grow input{flex:1;min-width:0}
.vd-sticky{position:sticky;bottom:12px;z-index:5;margin-top:20px;box-shadow:0 8px 24px rgba(33,37,41,.12);justify-content:space-between}
.vd-more{margin:6px 0 12px;border:1px solid var(--line2);border-radius:var(--r-ctl);padding:8px 12px;background:var(--surface2)}
.vd-more summary{cursor:pointer;font-weight:600;font-size:13px;display:flex;gap:6px;align-items:center}
.vd-more[open] summary{margin-bottom:10px}
.vd-scope h4{margin:16px 0 8px;font-size:13.5px;display:flex;gap:6px;align-items:center}
.vd-scope .chk{display:flex;gap:8px;align-items:center;margin:6px 0;font-size:13.5px;cursor:pointer}

/* ---------- graphics ---------- */
.vd-frame{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#1b1f23;container-type:inline-size;margin-bottom:12px}
.vd-frame-bg{position:absolute;inset:0;background:radial-gradient(circle at 30% 35%,rgba(47,124,246,.35),transparent 42%),radial-gradient(circle at 75% 70%,rgba(77,171,247,.25),transparent 45%),linear-gradient(135deg,#1b1f23,#343a40)}
.vd-frame [data-f]{position:absolute;display:none}
.vd-frame [data-f].is-on{display:block}
.vd-frame .p-tl{top:3.5%;left:2.5%}.vd-frame .p-tr{top:3.5%;right:2.5%}.vd-frame .p-bl{bottom:3.5%;left:2.5%}.vd-frame .p-br{bottom:3.5%;right:2.5%}
.vd-frame.t-top .p-tl,.vd-frame.t-top .p-tr{top:10%}
.vd-frame.t-bottom .p-bl,.vd-frame.t-bottom .p-br{bottom:10%}
.vd-f-logo{height:auto;max-height:40%;object-fit:contain}
.vd-f-clock{background:rgba(33,37,41,.75);color:#fff;font:700 3.6cqw/1.2 Rubik,sans-serif;padding:.4cqw 1cqw;border-radius:.6cqw}
.vd-f-badge{background:var(--vd-red);color:#fff;font:700 3cqw/1.2 Rubik,sans-serif;padding:.4cqw 1cqw;border-radius:.4cqw;letter-spacing:.05em}
.vd-f-ticker{left:0;right:0;bottom:0;height:7.5%;color:#fff;font:600 3.4cqw/1 Rubik,sans-serif;align-items:center;overflow:hidden;white-space:nowrap}
.vd-f-ticker.is-on{display:flex}
.vd-f-ticker.is-top{top:0;bottom:auto}
.vd-f-ticker em{font-style:normal;background:var(--vd-red);padding:0 1.4cqw;height:100%;display:flex;align-items:center;position:relative;z-index:1;flex:none}
.vd-f-ticker em:empty{display:none}
.vd-f-ticker span{flex:1;overflow:hidden}
.vd-f-ticker i{display:inline-block;font-style:normal;padding-inline-start:100%;animation:vd-crawl var(--speed,20s) linear infinite}
[dir=rtl] .vd-f-ticker i{animation-name:vd-crawl-rtl}
@keyframes vd-crawl{to{transform:translateX(-100%)}}
@keyframes vd-crawl-rtl{to{transform:translateX(100%)}}
.vd-f-lower{bottom:6%;inset-inline-end:3%;width:46%;height:13%;background:#212529;color:#fff;padding:1.2cqw 2cqw;border-inline-end:.8cqw solid var(--vd-blue);border-radius:.4cqw}
.vd-frame.t-bottom .vd-f-lower{bottom:13.5%}
.vd-f-lower b{display:block;font:700 3.6cqw/1.2 Rubik,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vd-f-lower span{display:block;font:400 2.5cqw/1.3 Rubik,sans-serif;color:#ced4da;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-reduced-motion:reduce){.vd-f-ticker i{animation:none;padding:0}}
.vd-pos{display:grid;grid-template-columns:repeat(2,28px);grid-template-rows:repeat(2,18px);gap:4px;padding:5px;border-radius:8px;background:var(--surface2);border:1px solid var(--line2)}
.vd-pos label{cursor:pointer;position:relative}
.vd-pos input{position:absolute;opacity:0}
.vd-pos span{display:block;width:100%;height:100%;border-radius:4px;background:var(--line);transition:background .15s}
.vd-pos input:checked+span{background:var(--vd-blue)}
.vd-pos input:focus-visible+span{outline:2px solid var(--vd-blue);outline-offset:1px}
.vd-pos .vd-pos-tl{order:1}.vd-pos .vd-pos-tr{order:2}.vd-pos .vd-pos-bl{order:3}.vd-pos .vd-pos-br{order:4}
[dir=rtl] .vd-pos{direction:ltr}
.vd-gfx-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 12px;font-size:13px;color:var(--ink2)}
.vd-gfx-sub{padding:2px 0 8px;margin-bottom:6px}
.vd-asset{display:flex;gap:14px;align-items:center;margin:4px 0 14px}
.vd-asset-img{width:96px;height:64px;border-radius:10px;border:1px dashed var(--line2);background:repeating-conic-gradient(#f1f3f5 0 25%,#fff 0 50%) 0 0/14px 14px;display:grid;place-items:center;color:var(--mut);overflow:hidden;flex:none}
.vd-asset-img.wide{width:128px;height:72px}
.vd-asset-img img{max-width:100%;max-height:100%;object-fit:contain}
.vd-asset-act{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.vd-asset-act .hint{width:100%}
.vd-asset.is-busy{opacity:.5;pointer-events:none}
.vd-asset.is-err .vd-asset-img{border-color:var(--bad)}
input[type=range]{accent-color:var(--vd-blue);width:100%}
input[type=color]{width:100%;height:38px;border:1px solid var(--line2);border-radius:var(--r-ctl);padding:3px;background:var(--surface)}

/* ---------- sources ---------- */
.vd-prio{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.vd-prio li{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 8px;border-radius:10px;border:1px solid var(--line2);background:var(--surface2);font-size:12.5px;color:var(--ink2)}
.vd-prio li b{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:var(--line);font-size:11px}
.vd-prio li.on{border-color:var(--vd-ink);background:var(--vd-ink);color:#fff}
.vd-prio li.on b{background:var(--vd-blue);color:#fff}
.vd-prio li em{font-style:normal;font-size:11px;color:#74b3ff}
.vd-radio-art{margin-bottom:14px}
.vd-radio-card{position:relative;aspect-ratio:16/9;border-radius:14px;background:#212529 center/cover;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;overflow:hidden;container-type:inline-size;text-align:center;padding:0 6%}
.vd-radio-card img{max-height:26%;max-width:50%;object-fit:contain;margin-bottom:2%}
.vd-radio-card b{font:700 5.6cqw/1.2 Rubik,sans-serif}
.vd-radio-card span{font:400 3.6cqw/1.3 Rubik,sans-serif;color:#adb5bd}
.vd-radio-wave{position:absolute;inset-inline:10%;bottom:12%;height:18%;display:flex;align-items:center;gap:1.2%}
.vd-radio-wave u{flex:1;background:var(--vd-blue);border-radius:3px;opacity:.9;animation:vd-wave 1.2s ease-in-out infinite alternate}
.vd-radio-wave u:nth-child(3n){animation-delay:-.4s}.vd-radio-wave u:nth-child(3n+1){animation-delay:-.8s}
@keyframes vd-wave{to{transform:scaleY(.35)}}

/* ---------- studio ---------- */
.vd-studio-stage{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#16191c}
.vd-studio-stage video{width:100%;height:100%;object-fit:contain;background:#000}
.vd-studio-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#adb5bd;font-size:14px}
.vd-studio-badge{position:absolute;top:14px;inset-inline-start:14px;display:flex;gap:8px;align-items:center;padding:6px 12px;border-radius:9px;background:rgba(0,0,0,.65);color:#fff;font:600 13px Rubik,sans-serif}
.vd-studio-badge i{width:9px;height:9px;border-radius:50%;background:#adb5bd}
.vd-studio-badge.is-live{background:var(--vd-red)}.vd-studio-badge.is-live i{background:#fff;animation:vd-pulse 1.4s infinite}
.vd-studio-badge.is-wait i{background:#ffd43b}.vd-studio-badge.is-err{background:#7f1d1d}
.vd-studio-meter{position:absolute;bottom:0;left:0;right:0;height:4px;background:rgba(255,255,255,.08)}
.vd-studio-meter b{display:block;height:100%;width:0;background:linear-gradient(90deg,#2b9a66,#ffd43b,#e5383b);transition:width .08s}
.vd-studio-stats{min-height:18px;margin:4px 0 8px}

/* ---------- automation ---------- */
.vd-bo{flex-wrap:wrap;gap:8px 12px;font-size:13px}
.vd-bo-why{display:inline-flex;gap:6px;align-items:center;min-width:120px}
.vd-bo.is-now{background:#fff8e6}
.vd-bo .vd-tag{margin-inline-start:0}
.vd-bo-add{margin-top:14px;padding-top:12px;border-top:1px solid var(--line2)}
.vd-alog .vd-item{font-size:12.5px;gap:10px}
.vd-alog .vd-item>span:nth-child(2){flex:1}

/* ---------- clips ---------- */
.vd-seg-wrap{display:flex;flex-wrap:wrap;gap:6px}
.vd-seg-wrap label{cursor:pointer}
.vd-seg-wrap input{position:absolute;opacity:0}
.vd-seg-wrap span{display:inline-flex;height:34px;align-items:center;padding:0 14px;border-radius:9px;border:1px solid var(--line2);background:var(--surface);font-size:13px}
.vd-seg-wrap input:checked+span{background:var(--vd-ink);border-color:var(--vd-ink);color:#fff}
.vd-seg-wrap input:disabled+span{opacity:.4}
.vd-clips{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.vd-clip{border:1px solid var(--line2);border-radius:12px;overflow:hidden;background:var(--surface)}
.vd-clip-media{aspect-ratio:16/9;background:#16191c;display:grid;place-items:center}
.vd-clip.is-v .vd-clip-media{aspect-ratio:9/12}
.vd-clip-media video{width:100%;height:100%;object-fit:contain}
.vd-clip-body{padding:10px 12px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.vd-job{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:6px 10px;border-radius:8px;background:var(--surface2);margin-top:6px}
.vd-import{margin-top:14px;padding-top:12px;border-top:1px solid var(--line2)}

/* ---------- sharing ---------- */
.vd-codes{display:flex;flex-direction:column;max-height:320px;overflow:auto;border:1px solid var(--line2);border-radius:var(--r-ctl);margin:10px 0}
.vd-code-row{display:grid;grid-template-columns:110px 1fr auto auto auto;gap:10px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--line2);font-size:12.5px}
.vd-code-row:last-child{border-bottom:0}
.vd-code-row b{letter-spacing:.08em}
.vd-chat-mod{max-height:240px;overflow:auto;border:1px solid var(--line2);border-radius:var(--r-ctl);margin:10px 0}
.vd-chat-row{display:flex;gap:8px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--line2);font-size:12.5px}
.vd-chat-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vd-chat-row.is-hidden{opacity:.45;text-decoration:line-through}
.vd-poll{border:1px solid var(--line2);border-radius:var(--r-ctl);padding:10px 12px;margin-top:10px}
.vd-poll.is-open{border-color:var(--vd-blue)}
.vd-poll-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.vd-poll-opt{display:grid;grid-template-columns:minmax(80px,1fr) 2fr 34px;gap:10px;align-items:center;font-size:12.5px;margin:4px 0}
.vd-poll-opt .bar,.vd-geo .bar{height:8px;border-radius:8px;background:var(--line);overflow:hidden}
.vd-poll-opt .bar b,.vd-geo .bar b{display:block;height:100%;background:var(--vd-blue);border-radius:8px}
.vd-poll-opt em{font-style:normal;font-weight:700;text-align:end}
.vd-poll-form .vd-opts{gap:6px}

/* ---------- stats / report ---------- */
.vd-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));background:#212529;border-radius:16px;color:#fff;padding:18px 0;margin-bottom:20px}
.vd-strip>div{padding:0 20px;border-inline-start:1px solid rgba(255,255,255,.12)}
.vd-strip>div:first-child{border:0}
.vd-strip .lbl{color:#adb5bd;font-size:12.5px}
.vd-strip .val{font:800 26px/1.25 Rubik,sans-serif;margin-top:2px;font-variant-numeric:tabular-nums}
.vd-strip .dl{color:#adb5bd;font-size:11.5px}
.vd-strip .val.vd-blue{color:#74b3ff!important}
.vd-strip a{color:#74b3ff}
.vd-dbars{display:flex;align-items:flex-end;gap:4px;height:170px;border-bottom:1px solid var(--line2);direction:ltr;margin-top:10px}
.vd-dbar{flex:1;background:#212529;border-radius:4px 4px 0 0;min-height:2px}
.vd-dbar.is-today{background:var(--vd-blue)}
[data-theme="dark"] .vd-dbar,.dark .vd-dbar{background:#495057}
.vd-dbars-ax{display:flex;justify-content:space-between;font-size:11px;color:var(--mut);margin-top:4px}
.vd-legend{display:flex;gap:14px;font-size:12px;color:var(--ink2)}
.vd-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px}
.vd-legend i.d{background:#212529}.vd-legend i.b{background:var(--vd-blue)}
.vd-months{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;align-items:end;direction:ltr}
.vd-months>div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:var(--mut)}
.vd-mbar{height:120px;width:100%;display:flex;align-items:flex-end}
.vd-mbar b{display:block;width:100%;background:var(--vd-blue);border-radius:5px 5px 0 0}
.vd-months em{font-style:normal;font-weight:700;color:var(--ink)}
.vd-report-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid #212529}
.vd-report-hd h1{margin:0;font-size:24px}
.vd-report-brand{font-weight:700;color:var(--mut);font-size:12px}
.vd-report-table{width:100%;border-collapse:collapse;margin-top:16px;font-size:12.5px}
.vd-report-table th,.vd-report-table td{padding:6px 8px;border-bottom:1px solid var(--line2);text-align:start}
.vd-report-table th{color:var(--mut);font-weight:500}
@media print{
  .top,.st-head,header,nav,.vd-nav,.vd-noprint,.vd-savebar,footer,[class*="assist"]{display:none!important}
  body{background:#fff!important}
  .card{box-shadow:none!important;break-inside:avoid}
  .vd-strip{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .vd-dbar{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- admin dashboard / logs ---------- */
.vd-dash{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}
.vd-dash-k{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.vd-k{border-radius:16px;padding:18px 20px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.vd-k span{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--mut)}
.vd-k b{font:800 30px/1.2 Rubik,sans-serif;font-variant-numeric:tabular-nums}
.vd-k b small{font-size:15px;color:var(--mut);font-weight:500}
.vd-k em{font-style:normal;font-size:12px;color:var(--mut)}
.vd-k.dark{background:#212529;border-color:#212529;color:#fff}
.vd-k.dark span,.vd-k.dark em{color:#adb5bd}
.vd-k.dark b.vd-blue{color:#74b3ff!important}
.vd-spark svg{width:100%;height:220px;display:block}
.vd-spark .g{stroke:var(--line2);stroke-width:1}
.vd-spark text{fill:var(--mut);font:11px Rubik,sans-serif}
.vd-spark .a{fill:url(#none);fill:rgba(47,124,246,.16)}
.vd-spark .l{fill:none;stroke:var(--vd-blue);stroke-width:2.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.vd-spark .d{fill:#fff;stroke:var(--vd-blue);stroke-width:2.5}
.vd-map svg{width:100%;height:auto;display:block}
.vd-map path{fill:#e9ecef;stroke:#fff;stroke-width:.5}
.vd-map path.c1{fill:#a5c8ff}.vd-map path.c2{fill:#6ea6ff}.vd-map path.c3{fill:#3d86f8}.vd-map path.c4{fill:#1b5fd6}
.vd-map path:hover{stroke:#212529;stroke-width:1}
[data-theme="dark"] .vd-map path,.dark .vd-map path{fill:#343a40;stroke:#212529}
.vd-geo .crow{display:flex;gap:10px;align-items:center;padding:6px 0;font-size:13px}
.vd-geo .nm{min-width:110px}
.vd-geo .n{min-width:40px;text-align:end;font-weight:700}
.vd-rank{width:22px;height:22px;border-radius:6px;background:var(--surface2);display:grid;place-items:center;font-size:11px;color:var(--mut);flex:none}
.vd-log{background:#16191c;color:#dee2e6;border-radius:12px;padding:12px 14px;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-all;max-height:320px;overflow:auto;margin:8px 0 0}
.vd-log-big{max-height:70vh}
.vd-pkg-feats{display:grid;grid-template-columns:1fr 1fr;gap:2px 12px;margin:10px 0;padding:10px 12px;border:1px solid var(--line2);border-radius:var(--r-ctl)}
.vd-pkg-feats b{grid-column:1/-1;font-size:12.5px;margin-bottom:4px}

/* ---------- public page: gate, notes, schedule, chat ---------- */
.vdw-gate{max-width:380px;margin:12vh auto;padding:28px;border-radius:18px;background:#212529;color:#fff;display:flex;flex-direction:column;gap:12px;text-align:center}
.vdw-embed .vdw-gate{margin:0 auto;height:100vh;justify-content:center;border-radius:0;max-width:none}
.vdw-gate-ic{width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,.08);display:grid;place-items:center;margin:0 auto}
.vdw-gate h1{font-size:20px;margin:0}
.vdw-gate p{margin:0;color:#adb5bd;font-size:14px}
.vdw-gate input{height:44px;border-radius:10px;border:1px solid #495057;background:#16191c;color:#fff;padding:0 14px;font-size:16px;text-align:center;letter-spacing:.08em}
.vdw-gate .btn{height:44px;justify-content:center;background:var(--vd-blue);border-color:var(--vd-blue)}
.vdw-gate-err{color:#ff8787;font-size:13px}
.vdw-note{padding:10px 14px;border-radius:10px;background:#fff4e5;color:#7a4a00;font-size:13.5px;margin-bottom:10px}
.vdw-embed .vdw-note{position:absolute;top:10px;left:10px;right:10px;z-index:3}
.vdw-wrap.has-chat{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
.vdw-epg{margin-top:20px}
.vdw-epg h2{font-size:16px;margin:0 0 10px}
.vdw-epg-days{display:flex;gap:6px;overflow-x:auto;margin-bottom:10px;scrollbar-width:none}
.vdw-epg-days button{flex:none;display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:transparent;color:inherit;font:600 13px Rubik,sans-serif;cursor:pointer}
.vdw-epg-days button small{font-weight:400;opacity:.6;font-size:11px}
.vdw-epg-days button.on{background:var(--vd-blue);border-color:var(--vd-blue);color:#fff}
.vdw-epg ol{list-style:none;margin:0;padding:0}
.vdw-epg li{display:flex;gap:12px;align-items:center;padding:9px 4px;border-bottom:1px solid rgba(255,255,255,.08);font-size:14px}
.vdw-epg li span{min-width:92px;opacity:.7}
.vdw-epg li.is-now b{color:#74b3ff}
.vdw-epg li em{font-style:normal;font-size:11px;background:var(--vd-red);color:#fff;padding:1px 7px;border-radius:9px}
.vdw-chat{position:sticky;top:16px;display:flex;flex-direction:column;height:min(78vh,720px);border-radius:16px;background:#212529;color:#fff;overflow:hidden}
.vdw-chat-hd{display:flex;gap:8px;align-items:center;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.vdw-chat-hd .sub{margin-inline-start:auto;color:#adb5bd}
.vdw-chat-list{flex:1;overflow:auto;padding:8px 14px;display:flex;flex-direction:column;gap:6px}
.vdw-msg{font-size:13.5px;line-height:1.45;word-break:break-word}
.vdw-msg b{color:#74b3ff;margin-inline-end:6px}
.vdw-msg em{font-style:normal;font-size:10.5px;color:#868e96;margin-inline-start:6px}
.vdw-chat-form{padding:10px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:6px}
.vdw-chat-form input{height:38px;border-radius:9px;border:1px solid #495057;background:#16191c;color:#fff;padding:0 11px;font:inherit;width:100%}
.vdw-chat-send{display:flex;gap:6px}
.vdw-chat-send .btn{flex:none;width:42px;justify-content:center;padding:0;background:var(--vd-blue);border-color:var(--vd-blue)}
.vdw-poll{margin:10px 14px 0;padding:10px;border-radius:12px;background:rgba(47,124,246,.12);display:flex;flex-direction:column;gap:6px}
.vdw-poll>b{font-size:13.5px}
.vdw-popt{position:relative;display:flex;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:transparent;color:#fff;font:500 13px Rubik,sans-serif;cursor:pointer;overflow:hidden;text-align:start}
.vdw-popt i{position:absolute;inset-block:0;inset-inline-start:0;background:rgba(47,124,246,.35);z-index:0}
.vdw-popt span,.vdw-popt em{position:relative;z-index:1;font-style:normal}
.vdw-popt.on{border-color:var(--vd-blue)}
@media (max-width:980px){.vdw-wrap.has-chat{grid-template-columns:1fr}.vdw-chat{position:static;height:420px}.vd-dash-k{grid-template-columns:1fr 1fr}}

/* ---------- widgets (iframe on the client's site) ---------- */
.vdx{margin:0;font:14px/1.45 Rubik,Heebo,system-ui,sans-serif;background:transparent}
.vdx-card{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:14px;text-decoration:none;background:#fff;color:#212529;border:1px solid #e9ecef}
.vdx-dark .vdx-card{background:#212529;color:#fff;border-color:#343a40}
.vdx-hd{display:flex;justify-content:space-between;align-items:center;gap:10px}
.vdx-st{display:inline-flex;gap:6px;align-items:center;font-size:12px;font-weight:600;padding:3px 9px;border-radius:10px;background:#f1f3f5;color:#6c757d}
.vdx-st i{width:7px;height:7px;border-radius:50%;background:currentColor}
.vdx-live{background:#e5383b;color:#fff}.vdx-on{background:#e6f6ee;color:#2b9a66}
.vdx-now span{display:block;font-size:12px;opacity:.6}.vdx-now b{font-size:16px}
.vdx-next{font-size:12.5px;opacity:.8}
.vdx-list{list-style:none;margin:0;padding:0}
.vdx-list li{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid rgba(127,127,127,.15);font-size:13px}
.vdx-list li span{opacity:.6;min-width:44px}
.vdx-list li.is-now b{color:#2f7cf6}
.vdx-go{font-size:12.5px;color:#2f7cf6;font-weight:600}

/* the hidden attribute always wins over display rules of the module */
.vd-scope [hidden],.vdw [hidden]{display:none!important}
.vd-scope .field .hint+label,.vd-scope .field+.hint{margin-bottom:10px}

/* =====================================================================================================
   Video console v0.10 – a broadcast control room: grouped side menu, the program monitor (dark bay with a
   tally light: red = live encoder, blue = automatic programme, grey = off air), the signal path, encoder card.
   Colours: ink #212529, signal blue #2f7cf6, tally red #e5383b, standby amber #f08c00.
   ===================================================================================================== */
.vd-shell,.vd-scope{--vd-ink:#212529;--vd-blue:#2f7cf6;--vd-red:#e5383b;--vd-amber:#f08c00;--vd-green:#2b8a3e;
  --vd-bay:#212529;--vd-bay2:#2b3035;--vd-bay-line:rgba(255,255,255,.09);--vd-bay-mut:rgba(255,255,255,.62)}
[data-theme="dark"] .vd-shell,.dark .vd-shell{--vd-bay:#16191c;--vd-bay2:#1f2327}
.vd-shell{display:grid;grid-template-columns:236px minmax(0,1fr);gap:22px;align-items:start}
.vd-shell.no-side{display:block}
.vd-shell>.vd-page{min-width:0}

/* ---------- side menu ---------- */
.vd-side{position:sticky;top:14px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:10px;display:flex;flex-direction:column;gap:6px}
.vd-side-ch{display:flex;align-items:center;gap:10px;padding:8px 8px 12px;border-bottom:1px solid var(--line);margin-bottom:4px;color:var(--ink);text-decoration:none}
.vd-side-ch b{display:block;font:600 14.5px/1.25 Rubik,Heebo,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.vd-side-ch small{display:block;color:var(--mut);font-size:12px;text-align:start}
.vd-side-mark{width:36px;height:36px;border-radius:11px;background:var(--vd-ink);color:#fff;display:grid;place-items:center;flex:none}
.vd-side .vd-nav{display:block;margin:0;padding:0;background:none;border:0;border-radius:0;overflow:visible}
.vd-nav-grp{padding:6px 0 4px}
.vd-nav-grp+.vd-nav-grp{border-top:1px solid var(--line)}
.vd-nav-h{display:block;padding:6px 10px 4px;font:500 12px Rubik,Heebo,sans-serif;color:var(--mut)}
.vd-side .vd-nav a{display:flex;align-items:center;gap:10px;padding:8px 10px;margin:1px 0;border-radius:10px;color:var(--ink2,#343a40);font:500 14px Rubik,Heebo,sans-serif;text-decoration:none;transition:background .15s,color .15s}
.vd-side .vd-nav a .svgi,.vd-side .vd-nav a svg{width:17px;height:17px;flex:none;opacity:.75}
.vd-side .vd-nav a:hover{background:var(--surface2);color:var(--ink)}
.vd-side .vd-nav a.on{background:var(--vd-ink);color:#fff}
.vd-side .vd-nav a.on svg,.vd-side .vd-nav a.on .svgi{opacity:1}
.vd-side .vd-nav a:focus-visible,.vd-side-pub:focus-visible,.vd-quick a:focus-visible,.vd-out-links a:focus-visible{outline:2px solid var(--vd-blue);outline-offset:2px}
.vd-side-pub{display:flex;align-items:center;gap:8px;margin-top:4px;padding:9px 10px;border-radius:10px;background:var(--surface2);color:var(--ink);font:500 13.5px Rubik,Heebo,sans-serif;text-decoration:none}
.vd-side-pub:hover{color:var(--vd-blue)}
[data-theme="dark"] .vd-side .vd-nav a.on,.dark .vd-side .vd-nav a.on{background:var(--vd-blue)}
[data-theme="dark"] .vd-side-mark,.dark .vd-side-mark{background:var(--vd-blue)}

/* ---------- program monitor ---------- */
.vd-monitor{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);background:var(--vd-bay);color:#fff;border-radius:20px;padding:14px;gap:18px;margin-bottom:14px}
.vd-monitor-screen{position:relative;border-radius:13px;overflow:hidden;background:#000;box-shadow:0 0 0 3px #3a4046;transition:box-shadow .3s}
.vd-monitor.is-live .vd-monitor-screen{box-shadow:0 0 0 3px var(--vd-red),0 0 26px rgba(229,56,59,.35)}
.vd-monitor.is-auto .vd-monitor-screen{box-shadow:0 0 0 3px var(--vd-blue)}
.vd-monitor-screen .vdp{border-radius:0;margin:0}
.vd-tally{position:absolute;top:12px;inset-inline-start:12px;z-index:3;display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px;border-radius:14px;background:rgba(33,37,41,.86);color:#fff;font:600 12.5px Rubik,Heebo,sans-serif;pointer-events:none}
.vd-tally i{width:8px;height:8px;border-radius:50%;background:#868e96}
.vd-monitor.is-live .vd-tally{background:var(--vd-red)}
.vd-monitor.is-live .vd-tally i{background:#fff;animation:vd-blink 1.6s ease-in-out infinite}
.vd-monitor.is-auto .vd-tally{background:var(--vd-blue)}
.vd-monitor.is-auto .vd-tally i{background:#fff}
.vd-monitor-screen .vd-rec{position:absolute;top:12px;inset-inline-end:12px;z-index:3}
@keyframes vd-blink{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.vd-monitor.is-live .vd-tally i,.vd-enc.is-live .vd-enc-dot{animation:none}}
.vd-monitor-side{display:flex;flex-direction:column;gap:16px;padding:6px 4px 4px;min-width:0}
.vd-mon-now span{display:block;color:var(--vd-bay-mut);font-size:13px;margin-bottom:4px}
.vd-mon-now b{display:block;font:600 19px/1.3 Rubik,Heebo,sans-serif;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vd-audience{display:flex;align-items:flex-end;gap:12px;padding:14px 0;border-top:1px solid var(--vd-bay-line);border-bottom:1px solid var(--vd-bay-line)}
.vd-audience>b{font:700 54px/0.9 Rubik,Heebo,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.vd-audience span{font-size:14px;color:#fff;padding-bottom:3px}
.vd-audience small{display:block;color:var(--vd-bay-mut);font-size:12.5px;margin-top:3px}
.vd-audience small i{font-style:normal;font-variant-numeric:tabular-nums}
.vd-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin:0}
.vd-facts div:nth-child(3){grid-column:1/-1}
.vd-facts dt{color:var(--vd-bay-mut);font-size:12.5px;margin-bottom:3px}
.vd-facts dd{margin:0;font:500 14px Rubik,Heebo,sans-serif;font-variant-numeric:tabular-nums}
.vd-monitor .vd-err{background:rgba(229,56,59,.18);color:#ffc9c9;border-radius:8px;padding:6px 10px;font-size:12px}
.vd-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.vd-quick a{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:10px;background:var(--vd-bay2);color:#fff;font:500 13px Rubik,Heebo,sans-serif;text-decoration:none;border:1px solid var(--vd-bay-line)}
.vd-quick a:hover{background:#343a40}
.vd-quick svg,.vd-quick .svgi{width:16px;height:16px}

/* ---------- signal path ---------- */
.vd-chain{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0}
.vd-chain li{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:16px;border:1px solid var(--line2,#dee2e6);background:var(--surface);color:var(--mut);font:500 13px Rubik,Heebo,sans-serif;position:relative;margin-inline-end:22px}
.vd-chain li:not(:last-child):not(.vd-chain-help)::after{content:"";position:absolute;inset-inline-end:-23px;top:50%;width:22px;border-top:1px dashed var(--line2,#ced4da)}
.vd-chain li:nth-last-child(2)::after{display:none}
.vd-chain li svg,.vd-chain li .svgi{width:15px;height:15px}
.vd-chain li.on{background:var(--vd-blue);border-color:var(--vd-blue);color:#fff;font-weight:600}
.vd-chain li.on.hot{background:var(--vd-red);border-color:var(--vd-red)}
.vd-chain .vd-chain-help{border:0;background:none;padding:0;margin:0 auto 0 0;font-size:13px}
[dir="rtl"] .vd-chain .vd-chain-help{margin:0 0 0 auto}

/* ---------- two columns ---------- */
.vd-cols{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:start}
.vd-col{display:flex;flex-direction:column;gap:16px;min-width:0}
.vd-col>.card{margin:0}

/* ---------- encoder card ---------- */
.vd-enc{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-panel,16px);padding:16px 18px}
.vd-enc header{display:flex;gap:12px;align-items:flex-start}
.vd-enc h3{margin:0;font:600 15.5px/1.3 Rubik,Heebo,sans-serif}
.vd-enc header p{margin:3px 0 0;color:var(--mut);font-size:13px}
.vd-enc-dot{width:12px;height:12px;border-radius:50%;background:#adb5bd;margin-top:4px;flex:none;box-shadow:0 0 0 4px rgba(173,181,189,.2)}
.vd-enc.is-live{border-color:rgba(229,56,59,.45);background:linear-gradient(0deg,rgba(229,56,59,.05),rgba(229,56,59,.05)),var(--surface)}
.vd-enc.is-live .vd-enc-dot{background:var(--vd-red);box-shadow:0 0 0 4px rgba(229,56,59,.18);animation:vd-blink 1.6s ease-in-out infinite}
.vd-enc.is-live h3{color:var(--vd-red)}
.vd-enc.is-blocked{border-color:rgba(240,140,0,.5);background:linear-gradient(0deg,rgba(240,140,0,.07),rgba(240,140,0,.07)),var(--surface)}
.vd-enc.is-blocked .vd-enc-dot{background:var(--vd-amber);box-shadow:0 0 0 4px rgba(240,140,0,.2)}
.vd-enc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 0}
.vd-enc-grid div{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:9px 11px;min-width:0}
.vd-enc-grid dt{font-size:12px;color:var(--mut);margin-bottom:3px}
.vd-enc-grid dd{margin:0;font:600 14px Rubik,Heebo,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.vd-enc-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.vd-enc-act form{margin:0;display:inline-flex;gap:6px;align-items:center}
.vd-enc-ban select{height:32px;padding:0 8px;border-radius:8px;border:1px solid var(--line2,#dee2e6);background:var(--input,#fff);color:var(--ink);font-size:13px;width:auto}

/* ---------- broadcast details & keys ---------- */
.vd-keys .sec-hd{flex-wrap:wrap}
.vd-keys .vd-copyall{margin-inline-start:auto}
.vd-keylist{display:flex;flex-direction:column;gap:8px;margin:4px 0 12px}
.vd-keyrow{display:grid;grid-template-columns:118px minmax(0,1fr) auto auto;gap:6px;align-items:center}
.vd-keyrow .k{font-size:13px;color:var(--mut)}
.vd-keyrow code{display:block;background:var(--surface2);border:1px solid var(--line);border-radius:9px;padding:8px 10px;font:500 13px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;direction:ltr}
.vd-keyrow button{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--mut);display:grid;place-items:center;cursor:pointer;padding:0}
.vd-keyrow button:hover{color:var(--ink);border-color:var(--line2,#ced4da)}
.vd-keyrow button.on{background:var(--vd-ink);color:#fff;border-color:var(--vd-ink)}
.vd-keyrow button:focus-visible{outline:2px solid var(--vd-blue);outline-offset:1px}
.vd-keyrow>button:only-of-type{grid-column:4}
.vd-keys-foot{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin-top:12px}
.vd-keys-foot form{margin:0}
.vd-setkey summary{list-style:none;cursor:pointer}
.vd-setkey summary::-webkit-details-marker{display:none}
.vd-setkey[open]{flex-basis:100%}
.vd-setkey .vd-inline{margin-top:10px}
.vd-setkey input{flex:1;min-width:0}

/* ---------- outputs ---------- */
.vd-out-links{display:flex;flex-direction:column}
.vd-out-links a{display:flex;align-items:center;gap:10px;padding:10px 4px;border-top:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:14px}
.vd-out-links a:first-child{border-top:0}
.vd-out-links a:hover{color:var(--vd-blue)}
.vd-out-links svg,.vd-out-links .svgi{width:16px;height:16px;color:var(--mut)}

/* ---------- dark ---------- */
[data-theme="dark"] .vd-enc-grid div,.dark .vd-enc-grid div{background:rgba(255,255,255,.03)}
[data-theme="dark"] .vd-keyrow button.on,.dark .vd-keyrow button.on{background:var(--vd-blue);border-color:var(--vd-blue)}
[data-theme="dark"] .vd-monitor,.dark .vd-monitor{border:1px solid rgba(255,255,255,.06)}

/* ---------- small screens: the side menu becomes a strip ---------- */
@media (max-width:980px){
  .vd-shell{display:block}
  .vd-side{position:static;flex-direction:row;align-items:center;padding:6px;margin-bottom:14px;overflow-x:auto;scrollbar-width:none;border-radius:14px}
  .vd-side::-webkit-scrollbar{display:none}
  .vd-side-ch,.vd-nav-h{display:none}
  .vd-side .vd-nav{display:flex;gap:2px}
  .vd-nav-grp{display:contents}
  .vd-side .vd-nav a{white-space:nowrap;margin:0;flex:none}
  .vd-side-pub{margin:0;flex:none;white-space:nowrap}
  .vd-monitor{grid-template-columns:1fr}
  .vd-cols{grid-template-columns:1fr}
}
@media (max-width:560px){
  .vd-monitor{padding:10px;border-radius:16px}
  .vd-audience>b{font-size:44px}
  .vd-enc-grid{grid-template-columns:1fr 1fr}
  .vd-keyrow{grid-template-columns:minmax(0,1fr) auto auto}
  .vd-keyrow .k{grid-column:1/-1}
  .vd-keyrow>button:only-of-type{grid-column:3}
  .vd-chain li{margin-inline-end:14px}
  .vd-chain li:not(:last-child):not(.vd-chain-help)::after{inset-inline-end:-15px;width:14px}
}
@media print{.vd-side{display:none}.vd-shell{display:block}}

/* =====================================================================
   Video server updates v0.10.1 – like "Panel updates" of the radio panel
   ===================================================================== */
.vd-upd-help{display:flex;align-items:center;gap:10px;padding:12px 16px;margin-bottom:16px;border-radius:12px;background:var(--vd-blue-soft);color:var(--ink2);font-size:13px;line-height:1.5}
.vd-upd-help>svg{flex:none;color:var(--vd-blue)}
.vd-upd-top{align-items:stretch}
.vd-upd-ver{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 10px}
.vd-upd-ver>b{font:700 34px/1 Rubik,sans-serif;letter-spacing:-.02em;color:var(--ink)}
.vd-upd-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--mut)}
.vd-upd-meta b{color:var(--ink);font-weight:600}
.vd-upd-notes{margin:12px 0 0;padding:10px 12px 10px 12px;padding-inline-start:28px;border:1px solid var(--line2);border-radius:var(--r-ctl);background:var(--surface2);font-size:13px;line-height:1.6}
.vd-upd-checked{margin-top:12px}
.vd-warn-txt{color:var(--vd-amber)}
.vd-upd-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--vd-gray);color:var(--mut)}
.vd-upd-pill>i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.vd-upd-pill.ok{background:rgba(43,138,62,.12);color:var(--vd-green)}
.vd-upd-pill.new{background:var(--vd-blue-soft);color:var(--vd-blue)}
.vd-upd-pill.busy{background:rgba(240,140,0,.13);color:var(--vd-amber)}
.vd-upd-pill.busy>i{animation:vdUpdPulse 1.2s ease-in-out infinite}
.vd-upd-pill.bad{background:rgba(229,56,59,.12);color:var(--vd-red)}
@keyframes vdUpdPulse{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.vd-upd-pill.busy>i{animation:none}}
.vd-upd-opt{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid var(--line2);border-radius:var(--r-ctl);margin-bottom:8px;cursor:pointer}
.vd-upd-opt:has(input:checked){border-color:var(--vd-blue);background:var(--vd-blue-soft)}
.vd-upd-opt input{margin-top:3px;accent-color:var(--vd-blue)}
.vd-upd-opt span{display:flex;flex-direction:column;gap:2px}
.vd-upd-opt small{color:var(--mut);font-size:12.5px;line-height:1.45}
.vd-updrow{display:grid;grid-template-columns:minmax(160px,1.6fr) 100px minmax(150px,1.2fr) minmax(120px,auto);gap:12px;align-items:center}
.vd-updrow>span{min-width:0}
.vd-upd-act{display:flex;justify-content:flex-end}
.vd-upd-msg{display:block;margin-top:4px;font-size:12px}
.vd-histrow{display:grid;grid-template-columns:130px minmax(100px,1fr) minmax(110px,1fr) auto;gap:10px;align-items:center;font-size:13px}
.vd-upd-banner{display:flex;align-items:center;gap:10px;padding:11px 16px;margin-bottom:16px;border-radius:12px;background:var(--vd-ink);color:#fff;text-decoration:none;font-size:13.5px}
.vd-upd-banner>span{flex:1;min-width:0}
.vd-upd-banner>b,.vd-upd-banner>a{color:#fff;font-weight:600;white-space:nowrap}
.vd-upd-banner.is-inline{background:var(--vd-blue-soft);color:var(--ink);margin:10px 0}
.vd-upd-banner.is-inline>svg{color:var(--vd-blue);flex:none}
.vd-upd-banner.is-inline>a{color:var(--vd-blue)}
.vd-upd-banner.is-bad{background:rgba(229,56,59,.1)}
.vd-upd-banner.is-bad>svg{color:var(--vd-red)}
.vd-upd-dot{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--vd-blue);color:#fff;font-size:11px;font-weight:700}
.vd-upd-adv{padding:14px 18px}
.vd-upd-adv summary{cursor:pointer;font-weight:600}
.vd-upd-adv form{margin-top:12px}
@media (max-width:760px){
  .vd-updrow{grid-template-columns:1fr auto}
  .vd-updrow.vd-head{display:none}
  .vd-updrow>span[data-l]::before{content:attr(data-l) " ";color:var(--mut);font-size:11.5px;font-weight:400}
  .vd-upd-act{grid-column:1/-1;justify-content:flex-start}
  .vd-histrow{grid-template-columns:1fr auto}
  .vd-upd-ver>b{font-size:28px}
}
.vd-upd-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px;background:rgba(33,37,41,.55)}
.vd-upd-modal[hidden]{display:none}
.vd-upd-box{width:min(440px,100%);max-height:calc(100vh - 32px);overflow:auto;background:var(--card,#fff);color:var(--ink);border-radius:16px;padding:26px 24px 20px;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.vd-upd-box-ic{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--vd-blue-soft);color:var(--vd-blue)}
.vd-upd-box h3{margin:12px 0 4px;font-size:18px}
.vd-upd-box-v{font:700 30px/1.1 Rubik,sans-serif;letter-spacing:-.02em}
.vd-upd-box p{margin:8px 0 0;color:var(--mut);font-size:13.5px}
.vd-upd-box .vd-upd-notes{text-align:start}
.vd-upd-box-b{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap}
.vd-upd-box-b .btn{min-width:120px}

/* =====================================================================================================
   v0.12 frame: navy + bright blue like the rest of the panel. The panel already has a side menu, so the
   channel menu becomes a grouped tab bar under the channel title (all widths).
   ===================================================================================================== */
.vd-scope,.vd-nav,.vdw,.vdx,.vd-shell{--vd-ink:#0b1d4a;--vd-blue:#2563eb;--vd-blue-soft:#eaf1ff;--sig:#2563eb;--sig-soft:#eaf1ff;--vd-bay:#0b1d4a;--vd-bay2:#132a63}
[data-theme="dark"] .vd-scope,[data-theme="dark"] .vd-nav,[data-theme="dark"] .vd-shell{--sig:#60a5fa;--sig-soft:rgba(59,130,246,.16);--vd-blue-soft:rgba(59,130,246,.16);--vd-bay:#0b1428;--vd-bay2:#132042}
.vd-scope .btn:not(.lt):not(.btn-danger),[data-theme="dark"] .vd-scope .btn:not(.lt):not(.btn-danger){background:var(--blue);border-color:var(--blue);color:#fff}
.vd-nav a.on,[data-theme="dark"] .vd-nav a.on{background:var(--blue);color:#fff}
.vd-k.dark{background:linear-gradient(135deg,#0c2156,#06122f);border-color:transparent}
.vd-shell{display:block}
.vd-side{position:sticky;top:calc(var(--top-h,66px) + 8px);z-index:20;flex-direction:row;align-items:center;gap:8px;padding:6px;margin-bottom:18px;border-radius:16px;overflow-x:auto;scrollbar-width:thin;box-shadow:var(--shadow)}
.vd-side-ch{border-bottom:0;margin:0;padding:2px 12px 2px 4px;border-inline-end:1px solid var(--line);flex:none}
[dir="rtl"] .vd-side-ch{padding:2px 4px 2px 12px}
.vd-side-ch b{max-width:140px}
.vd-side-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.vd-side .vd-nav{display:flex;gap:2px;flex:0 0 auto}
.vd-side .vd-nav-grp{display:flex;gap:2px;align-items:center;padding:0}
.vd-side .vd-nav-grp+.vd-nav-grp{border-top:0;border-inline-start:1px solid var(--line);padding-inline-start:6px;margin-inline-start:4px}
.vd-side .vd-nav-h{display:none}
.vd-side .vd-nav a{white-space:nowrap;margin:0;padding:8px 11px;font-size:13.5px;flex:none}
.vd-side .vd-nav a.on,[data-theme="dark"] .vd-side .vd-nav a.on{background:var(--blue);color:#fff;box-shadow:0 6px 14px -8px rgba(var(--blue-rgb,37,99,235),.9)}
.vd-side-pub{margin:0;margin-inline-start:auto;flex:none;white-space:nowrap}
@media (max-width:1024px){.vd-side{top:calc(var(--top-h,66px) + 4px)}.vd-side-ch{display:none}}

/* ===================================================================================================== update progress window (v0.13.1) */
.upw .vd-upd-box{width:min(480px,100%)}
.upw-ic{position:relative;border-radius:50%!important;background:var(--blue-soft,#eaf1ff)!important;color:var(--blue,#2563eb)!important}
.upw-spin{position:absolute;inset:-6px;border-radius:50%;border:3px solid rgba(37,99,235,.15);border-top-color:var(--blue,#2563eb);animation:upwSpin .9s linear infinite}
.upw.is-ok .upw-spin,.upw.is-bad .upw-spin{display:none}
.upw.is-ok .upw-ic{background:var(--ok-soft,#e5f6ec)!important;color:var(--ok,#0f9d58)!important}
.upw.is-bad .upw-ic{background:var(--bad-soft,#fdecec)!important;color:var(--bad,#e5383b)!important}
.upw.is-bad .upw-steps li.on{color:var(--bad,#e5383b)}.upw.is-bad .upw-steps li.on i{background:var(--bad,#e5383b);box-shadow:0 0 0 4px rgba(229,56,59,.18)}
@keyframes upwSpin{to{transform:rotate(360deg)}}
.upw-name{font-weight:600;color:var(--ink2,#3d4a63)!important}
.upw-bar{height:10px;border-radius:99px;background:var(--surface2,#f5f8fc);border:1px solid var(--line,#e6ebf3);overflow:hidden;margin:16px 0 14px}
.upw-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue,#2563eb),#60a5fa);transition:width .6s ease;
  background-size:200% 100%;animation:upwFlow 1.6s linear infinite}
.upw.is-ok .upw-bar i{background:var(--ok,#0f9d58);animation:none}
.upw.is-bad .upw-bar i{background:var(--bad,#e5383b);animation:none}
@keyframes upwFlow{from{background-position:0 0}to{background-position:200% 0}}
.upw-steps{display:flex;justify-content:space-between;gap:6px;margin:0 0 14px;padding:0;list-style:none;font-size:12.5px;color:var(--mut,#6b7891)}
.upw-steps li{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}
.upw-steps li i{width:12px;height:12px;border-radius:50%;background:var(--line2,#d6deea);transition:background .3s}
.upw-steps li.on{color:var(--blue,#2563eb);font-weight:600}.upw-steps li.on i{background:var(--blue,#2563eb);box-shadow:0 0 0 4px rgba(37,99,235,.18)}
.upw-steps li.ok{color:var(--ok,#0f9d58)}.upw-steps li.ok i{background:var(--ok,#0f9d58)}
.upw-now{font-weight:600;font-size:15px;min-height:22px}
.upw-step{color:var(--mut,#6b7891);font-size:12.5px;min-height:18px;margin-top:2px}
.upw-note{font-size:12.5px!important;background:var(--surface2,#f5f8fc);border-radius:10px;padding:9px 12px;text-align:start}
.upw-ok{background:var(--ok-soft,#e5f6ec)!important;color:var(--ok,#0f9d58)!important}
@media (prefers-reduced-motion:reduce){.upw-spin,.upw-bar i{animation:none}}

.vd-mt{margin-top:16px}
.vdp-vw{position:absolute;top:10px;inset-inline-start:10px;z-index:3;display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:rgba(10,20,40,.62);color:#fff;font:600 12px/1.4 inherit;pointer-events:none;direction:ltr}
.vdp-vw svg{width:14px;height:14px}

/* ===================================================================================================== channel menu as tiles (v0.14.1) */
.vd-hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:10px;margin:0 0 20px}
.vd-tile{--tc:#2563eb;--tcs:#eaf1ff;display:flex;align-items:center;gap:12px;min-height:66px;padding:11px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);
  color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.vd-tile.t-teal{--tc:#0d9488;--tcs:#e0f5f2}.vd-tile.t-amber{--tc:#c2410c;--tcs:#fff1e6}.vd-tile.t-slate{--tc:#475569;--tcs:#eef2f7}
.vd-tile-ic{width:40px;height:40px;flex:none;border-radius:11px;display:grid;place-items:center;background:var(--tcs);color:var(--tc)}
.vd-tile-ic svg,.vd-tile-ic .svgi{width:20px;height:20px}
.vd-tile-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.vd-tile-tx b{font:600 14px/1.25 Rubik,Heebo,sans-serif}
.vd-tile-tx small{font-size:12px;line-height:1.35;color:var(--mut);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vd-tile:hover{border-color:var(--tc);box-shadow:0 8px 18px -14px rgba(11,29,74,.55)}
.vd-tile:focus-visible{outline:2px solid var(--blue,#2563eb);outline-offset:2px}
.vd-tile.on{background:linear-gradient(135deg,#0b1d4a,#16357f);border-color:transparent;color:#fff;box-shadow:0 10px 22px -14px rgba(11,29,74,.9)}
.vd-tile.on .vd-tile-ic{background:rgba(255,255,255,.14);color:#fff}
.vd-tile.on .vd-tile-tx small{color:rgba(255,255,255,.75)}
[data-theme="dark"] .vd-tile{--tcs:rgba(59,130,246,.16)}
[data-theme="dark"] .vd-tile.t-teal{--tc:#2dd4bf;--tcs:rgba(45,212,191,.14)}[data-theme="dark"] .vd-tile.t-amber{--tc:#fb923c;--tcs:rgba(251,146,60,.14)}
[data-theme="dark"] .vd-tile.t-slate{--tc:#94a3b8;--tcs:rgba(148,163,184,.14)}[data-theme="dark"] .vd-tile{--tc:#60a5fa}
[data-theme="dark"] .vd-tile.on{background:linear-gradient(135deg,#1d4ed8,#2563eb)}
@media (prefers-reduced-motion:no-preference){.vd-tile:hover{transform:translateY(-1px)}}
@media (max-width:640px){
  .vd-hub{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .vd-tile{flex-direction:column;justify-content:center;text-align:center;gap:6px;min-height:84px;padding:10px 6px}
  .vd-tile-tx small{display:none}
  .vd-tile-tx b{font-size:12.5px}
}
@media print{.vd-hub{display:none}}
/* v0.16: "no broadcast now" picture + pre-roll ad layer */
.vdp-offimg{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.vdp.is-off:not(.is-playing) .vdp-offimg{display:block}
.vdp.is-off .vdp-offimg~.vdp-msg .vdp-txt{background:rgba(10,20,40,.62);padding:4px 12px;border-radius:999px}
.vdp-ad{position:absolute;inset:0;z-index:6;background:#000}
.vdp.is-ad .vdp-bar,.vdp.is-ad .vdp-big,.vdp.is-ad .vdp-msg{display:none}
.vd-gfiles{max-height:260px;overflow:auto}