/* OnAir Studio — studio.onairtv.site (site.css üzərində) */

/* ================= giriş / qeydiyyat ================= */
.auth-body{background:#fff}
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);min-height:100vh;min-height:100dvh}
.auth__brand{position:relative;display:flex;flex-direction:column;gap:40px;padding:40px clamp(24px,5vw,72px);color:#fff;overflow:hidden;
  background:radial-gradient(ellipse 70% 55% at 20% 0%,rgba(225,10,30,.38),transparent 70%),radial-gradient(ellipse 60% 50% at 100% 100%,rgba(225,10,30,.18),transparent 70%),linear-gradient(180deg,#14161d,#0a0b0f)}
.auth__brand::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse at 30% 30%,#000,transparent 75%);pointer-events:none}
.auth__logo{position:relative;z-index:1;width:150px;padding:10px 14px;border-radius:14px;background:#fff}
.auth__copy{position:relative;z-index:1;display:grid;gap:22px;margin:auto 0;max-width:560px}
.auth__pill{display:inline-flex;align-items:center;gap:10px;justify-self:start;padding:7px 14px;border-radius:99px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:700 13px/1 var(--display);letter-spacing:.04em}
.auth__copy h1{font:900 clamp(32px,4.4vw,56px)/1.04 var(--display);letter-spacing:-.03em}
.auth__copy h1 em{font-style:normal;color:#ff4a5a}
.auth__copy>p{color:#b9bfcc;font-size:17px;line-height:1.6}
.auth__steps{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:12px}
.auth__steps li{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.auth__steps b{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--red);font:900 15px/1 var(--display);box-shadow:0 8px 20px -8px rgba(225,10,30,.9)}
.auth__steps span{display:grid;gap:2px;color:#9ba1ae;font-size:14px}
.auth__steps strong{color:#fff;font-weight:700}
.auth__foot{position:relative;z-index:1;color:#6c7280;font-size:13px}
.auth__foot a{color:#aab0bd}
.auth__panel{display:grid;place-items:center;padding:40px 24px;background:linear-gradient(180deg,#fff,#f6f6f8)}
.auth__card{width:100%;max-width:470px;display:grid;gap:22px}
.auth__tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:14px;background:#eef0f3}
.auth__tabs button{height:42px;border-radius:11px;font:700 14px/1 var(--display);color:var(--mute);transition:all .25s var(--ease)}
.auth__tabs button[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:var(--shadow)}
.auth__form{display:grid;gap:14px}
.auth__form[hidden]{display:none}
.auth__form h2{font:800 26px/1.15 var(--display);margin-bottom:4px}
.auth__form label{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--ink-2)}
.auth__form label small{font-weight:500;color:var(--mute)}
.auth__form input{height:48px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:15px;transition:border-color .2s,box-shadow .2s;outline:none;width:100%}
.auth__form input:focus{border-color:var(--red);box-shadow:0 0 0 4px rgba(225,10,30,.1)}
.auth__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth__err{min-height:1px;color:var(--red);font-size:13.5px;font-weight:600}
.auth__err:empty{display:none}
.auth__alt{text-align:center;color:var(--mute);font-size:14px}
.auth__alt a{color:var(--red);font-weight:700}
.auth__plans{margin:0;padding:0;border:0;display:grid;gap:8px}
.auth__plans legend{padding:0;margin-bottom:6px;font-size:13px;font-weight:600;color:var(--ink-2)}
.pk{display:grid;gap:8px}
.pk__i{position:relative;cursor:pointer}
.pk__i input{position:absolute;opacity:0;pointer-events:none}
.pk__c{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;transition:all .2s var(--ease)}
.pk__c b{font:800 15px/1.2 var(--display)}
.pk__c em{grid-row:span 2;align-self:center;font:900 20px/1 var(--display);font-style:normal;color:var(--ink)}
.pk__c em small{font:600 12px/1 var(--font);color:var(--mute)}
.pk__c>small{font-size:12.5px;color:var(--mute)}
.pk__i input:checked+.pk__c{border-color:var(--red);box-shadow:0 0 0 3px rgba(225,10,30,.12);background:#fff8f8}
.pk__i input:checked+.pk__c em{color:var(--red)}
.pk__i input:focus-visible+.pk__c{outline:2px solid var(--red);outline-offset:2px}
.btn.is-busy{opacity:.7;pointer-events:none}
@media (max-width:900px){
  .auth{grid-template-columns:1fr}
  .auth__brand{gap:24px;padding:24px 16px}
  .auth__steps{display:none}
  .auth__copy h1{font-size:32px}
  .auth__copy>p{font-size:15px}
  .auth__foot{display:none}
  .auth__panel{padding:24px 16px 40px}
  .auth__row{grid-template-columns:1fr}
}

/* ================= studio app ================= */
.app-body{background:#07080b;overflow:hidden}
.boot{position:fixed;inset:0;display:grid;place-content:center;justify-items:center;gap:22px;background:#07080b}
.boot img{width:180px;filter:brightness(0) invert(1);opacity:.9}
.boot[hidden]{display:none}
.studio.app{position:fixed;inset:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;border-radius:0;transform:none;box-shadow:none;-webkit-user-select:auto;user-select:auto}
.studio.app[hidden]{display:none}
.app-logo{align-self:center;display:grid;place-items:center;width:30px;height:30px;margin-right:4px;border-radius:8px;background:#fff}
.app-logo img{width:21px}
.st-tab__ic--ch{background:linear-gradient(135deg,#ff4a5a,#c20818);box-shadow:0 4px 12px -4px rgba(225,10,30,.8)}
.st-tab__ic--api{background:linear-gradient(135deg,#3ec7ff,#1272d6);box-shadow:0 4px 12px -4px rgba(40,150,255,.8)}
.st-tab__ic--srv{background:linear-gradient(135deg,#3ee08a,#13995a);box-shadow:0 4px 12px -4px rgba(31,183,90,.8)}
.st-tabs{overflow-x:auto;scrollbar-width:none}
.st-tabs::-webkit-scrollbar{display:none}
.st-tab{flex:none}
.app-ch{align-self:center;display:flex;align-items:center;gap:8px;height:30px;padding:0 4px 0 10px;border-radius:8px;background:#1f222b;box-shadow:0 0 0 1px var(--bd) inset;font:800 9.5px/1 var(--display);letter-spacing:.12em;color:var(--mu);text-transform:uppercase}
.app-ch select{max-width:180px;height:24px;padding:0 6px;border:0;border-radius:6px;background:#0a0b0e;color:#fff;font:600 12px/1 var(--font);letter-spacing:0;text-transform:none;outline:none}
.app-user{position:relative;align-self:center}
.app-user__btn{display:flex;align-items:center;gap:8px;height:30px;padding:0 10px 0 3px;border-radius:99px;background:#1f222b;box-shadow:0 0 0 1px var(--bd) inset;font-size:12px;font-weight:600;color:#dfe2e8!important}
.app-user__btn b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--red);font:800 11px/1 var(--display);color:#fff}
.app-user__btn span{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-user__menu{position:absolute;right:0;top:calc(100% + 8px);z-index:50;display:grid;gap:2px;min-width:230px;padding:8px;border-radius:12px;background:rgba(30,33,42,.97);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(255,255,255,.1) inset,0 24px 50px -12px rgba(0,0,0,.8)}
.app-user__menu[hidden]{display:none}
.app-user__menu p{display:grid;gap:3px;padding:6px 8px 10px;margin-bottom:4px;border-bottom:1px solid var(--bd)}
.app-user__menu p b{font-size:12.5px;color:#fff;overflow:hidden;text-overflow:ellipsis}
.app-user__menu p small{font-size:11px;color:var(--mu)}
.app-user__menu button,.app-user__menu a{display:flex;align-items:center;gap:8px;width:100%;height:34px;padding:0 8px;border-radius:7px;font-size:12.5px;font-weight:600;color:#dfe2e8!important;text-align:left}
.app-user__menu button:hover,.app-user__menu a:hover{background:#2a2e39}
.app-user__menu svg{width:15px;height:15px}
.app-user__menu a[hidden]{display:none}
.st-url{flex:0 1 520px}

.app-views{min-height:0;overflow:hidden}
.app-views .sv{overflow:auto;min-height:0;height:100%;scrollbar-color:#2a2e39 transparent}
.app-views .sv:not(.is-on){display:none}
.app-pad{padding:16px;display:grid;gap:14px;align-content:start;max-width:1500px;margin:0 auto;width:100%}
.app-h{display:grid;gap:6px;padding:6px 2px}
.app-h h2{font:800 clamp(20px,2.4vw,28px)/1.15 var(--display);color:#fff}
.app-h p:not(.st-lbl){color:var(--mu);font-size:13.5px;max-width:720px}
.app-h--row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.app-h--row .lab-send{padding:0 18px}
.st-lbl small{font-weight:600;letter-spacing:.02em;text-transform:none;color:#5c6270}

/* monitor + giriş */
.app-mons{grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr)}
.app-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.app-off{position:absolute;inset:0;z-index:3;display:grid;place-content:center;justify-items:center;gap:6px;padding:16px;text-align:center;background:radial-gradient(ellipse at 50% 40%,#1b1e27,#07080b)}
.app-off b{font:800 15px/1.2 var(--display);color:#fff}
.app-off small{font-size:12px;color:var(--mu);max-width:300px}
.app-off[hidden]{display:none}
.app-dsk .dsk-logo{background:transparent;padding:0;max-height:12%;width:auto;max-width:17%}
.st-tag--src{background:#2a2e39;color:#aab0bd}
.st-tag--src.is-live{background:var(--red);color:#fff}
.st-tag--src.is-auto{background:var(--amb);color:#1d1304}
.app-ingest{align-content:start}
.ing{display:grid;gap:8px}
.ing__r{display:grid;gap:4px}
.ing__r>span{font:800 9px/1 var(--display);letter-spacing:.14em;color:var(--mu)}
.ing__v{display:flex;align-items:center;gap:6px;min-width:0;padding:4px 4px 4px 10px;border-radius:8px;background:#08090c;box-shadow:0 0 0 1px var(--bd) inset}
.ing__v code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 11.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#dfe2e8}
.ing__v code.is-secret{filter:blur(4px);user-select:none}
.ing__v button{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:6px;background:#1f222b;color:#aab0bd!important}
.ing__v button:hover{background:#2a2e39;color:#fff!important}
.ing__v svg{width:13px;height:13px}
.ing__acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ing__acts .lab-sec,.lab-sec{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px}
.lab-sec svg{width:14px;height:14px}
.app-wait{display:grid;gap:8px;padding:14px;border-radius:10px;background:#08090c;font-size:12.5px;color:var(--mu)}
.app-wait b{color:#fff}

/* kanal plitələri */
.app-inputs{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.app-in-t{position:relative;display:grid;place-content:center;justify-items:center;gap:4px;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:linear-gradient(135deg,#1c1f28,#0d0e12);color:#6b7180;font:800 11px/1 var(--display);letter-spacing:.08em}
.app-in-t img{max-width:60%;max-height:50%;object-fit:contain}
.app-in-t i{position:absolute;left:5px;top:5px;padding:3px 5px;border-radius:3px;background:#2a2e39;color:#aab0bd;font:800 8px/1 var(--display);letter-spacing:.1em;font-style:normal}
.app-in-t i.is-live{background:var(--red);color:#fff}
.app-in-t i.is-auto{background:var(--amb);color:#1d1304}
.app-in-t u{position:absolute;right:5px;top:5px;padding:3px 5px;border-radius:3px;background:rgba(0,0,0,.6);color:#fff;font:700 8.5px/1 var(--display);text-decoration:none}
.st-in--add .app-in-t{border:1px dashed #343846;background:transparent;color:#8f95a3}
.st-in--add svg{width:20px;height:20px}

/* idarə */
.app-deck{grid-template-columns:minmax(260px,auto) minmax(0,1fr) auto}
.app-gfx{gap:7px}
.app-in{width:100%;height:34px;padding:0 10px;border:0;border-radius:8px;background:#08090c;box-shadow:0 0 0 1px var(--bd) inset;color:#e8eaf0;font:500 12.5px/1 var(--font);outline:none;transition:box-shadow .2s}
.app-in:focus{box-shadow:0 0 0 1px rgba(255,42,61,.7) inset,0 0 0 3px rgba(225,10,30,.15)}
select.app-in{padding-right:4px}
.app-in::placeholder{color:#555b68}
.app-take{align-items:stretch}
.app-take .st-take__btns{grid-template-rows:1fr 1fr}
.app-take .st-big{width:118px;min-height:62px}
.st-big--auto[aria-pressed="false"]{background:linear-gradient(180deg,#3a3e4a,#2a2d36);color:#aab0bd!important;box-shadow:0 4px 0 #15171d}

/* çıxışlar */
.st-out{grid-template-columns:28px minmax(0,1fr) auto 30px}
.st-out small em.is-err{color:#ffb020!important}
.app-out{position:relative}
.app-out__del{position:absolute;right:-4px;top:-4px;display:none;place-items:center;width:20px;height:20px;border-radius:50%;background:#2a2e39;color:#aab0bd!important;box-shadow:0 0 0 2px var(--pn)}
.app-out:hover .app-out__del{display:grid}
.app-out__del svg{width:11px;height:11px}
.app-plus{display:flex;align-items:center;justify-content:center;gap:7px;height:36px;border-radius:9px;border:1px dashed #343846;color:#8f95a3!important;font-size:12px;font-weight:600;transition:all .2s}
.app-plus:hover{border-color:#ff5a68;color:#fff!important}
.app-plus svg{width:14px;height:14px}
.app-plus[hidden],.app-add[hidden]{display:none}
.app-add{display:grid;gap:7px}
.app-add__b{display:grid;grid-template-columns:1fr auto;gap:8px}
.app-add__b .lab-sec{padding:0 14px}
#spark{display:block;width:100%;height:54px;border-radius:8px;background:#08090c}
.st-ok.is-bad{color:#ffb020}
.st-ok.is-bad i{background:var(--amb);box-shadow:0 0 0 3px rgba(255,176,32,.2)}
.st-ok.is-off{color:var(--mu)}
.st-ok.is-off i{background:#4a4f5c;box-shadow:none}
.app-small{font-size:11.5px;line-height:1.5;color:var(--mu)}
.app-small code{font:500 11px/1 ui-monospace,Menlo,monospace;color:#c3c8d2}
.app-code{margin:0;padding:10px 12px;border-radius:8px;background:#08090c;box-shadow:0 0 0 1px var(--bd) inset;color:#dfe2e8;font:500 11.5px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-all;max-height:320px;overflow:auto;-webkit-user-select:text;user-select:text}
.app-code--json{max-height:520px;color:#9fe0b8}
.app-code .k{color:#ff8892}

/* kanallar */
.app-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.app-card{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;padding:12px;border-radius:12px;background:var(--pn);box-shadow:0 0 0 1px var(--bd) inset}
.app-card .app-in-t{aspect-ratio:16/9}
.app-card__b{display:grid;gap:6px;align-content:start;min-width:0}
.app-card__b b{font:800 15px/1.2 var(--display);color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-card__b small{font-size:12px;color:var(--mu)}
.app-card__b code{font:500 11px/1 ui-monospace,Menlo,monospace;color:#8f95a3}
.app-card__a{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}
.app-card__a button{height:30px;padding:0 10px;font-size:11.5px}
.app-form{gap:10px}
.app-form[hidden]{display:none}
.app-form label{display:grid;gap:5px;font-size:11px;font-weight:600;color:var(--mu)}
.app-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.app-grid3{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:10px}
.app-toggles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.app-err{color:#ff5a68;font-size:12.5px;font-weight:600}
.app-err:empty{display:none}
.app-danger{color:#ff8892!important}
.app-row{display:grid;grid-template-columns:1fr auto;gap:8px}

/* lab */
.app-lab{grid-template-columns:minmax(280px,360px) minmax(0,1fr);align-items:start}
.lab-drop{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:14px;border-radius:10px;border:1px dashed #3a3e4a;background:#08090c;cursor:pointer;transition:border-color .2s,background .2s}
.lab-drop:hover,.lab-drop.is-over{border-color:#9b86ff;background:rgba(124,92,255,.07)}
.lab-drop b{font-size:12.5px;color:#fff}
.lab-drop small{font-size:11px;color:var(--mu)}
.app-up{display:grid;gap:5px;padding:9px 10px;border-radius:9px;background:#191c24;font-size:11.5px;color:#c3c8d2}
.app-up i{display:block;height:4px;border-radius:4px;background:#08090c;overflow:hidden}
.app-up i s{display:block;height:100%;width:0;background:linear-gradient(90deg,#8a6bff,#5232e0);transition:width .2s}
.app-up.is-err{color:#ff8892}
.app-media{list-style:none;margin:0;padding:0;display:grid;gap:6px;max-height:60vh;overflow:auto}
.app-media button{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 8px;border-radius:9px;background:#191c24;text-align:left;transition:background .2s,box-shadow .2s}
.app-media button:hover{background:#1f232d}
.app-media button.is-on{box-shadow:0 0 0 1.5px #9b86ff inset;background:#1f1d2c}
.app-media svg{width:34px;height:34px;padding:9px;border-radius:7px;background:rgba(124,92,255,.16);color:#b09cff}
.app-media b{display:block;font-size:12px;font-weight:600;color:#e8eaf0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-media small{font-size:10.5px;color:var(--mu)}
.app-media em{font:600 10.5px/1 ui-monospace,Menlo,monospace;color:#8f95a3;font-style:normal}
.app-empty{padding:18px;border-radius:10px;background:#08090c;text-align:center;color:var(--mu);font-size:12.5px}
.app-title{font:800 16px/1.25 var(--display);color:#fff;word-break:break-word}
.app-stats3{grid-template-columns:repeat(3,minmax(0,1fr))}
.lab-player .lab-screen{cursor:default}

/* cədvəl */
.app-sched{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:12px;align-items:start}
.app-epg{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.app-epg li{display:grid;grid-template-columns:96px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 10px 10px 12px;border-radius:9px;background:#191c24;border-left:3px solid #3a3e4a}
.app-epg li[data-k="live"]{border-left-color:var(--red)}
.app-epg li[data-k="ad"]{border-left-color:var(--amb)}
.app-epg li[data-k="vod"]{border-left-color:#8a6bff}
.app-epg li.is-now{background:#24161a;box-shadow:0 0 0 1px rgba(225,10,30,.45) inset}
.app-epg li.is-past{opacity:.5}
.app-epg time{font:700 12px/1.3 ui-monospace,Menlo,monospace;color:#ffd166}
.app-epg b{display:block;font-size:13px;font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-epg small{font-size:11px;color:var(--mu)}
.app-epg em{font:800 9px/1 var(--display);letter-spacing:.1em;padding:4px 6px;border-radius:4px;background:#2a2e39;color:#aab0bd;font-style:normal}
.app-epg li.is-now em{background:var(--red);color:#fff}
.app-epg .del{display:grid;place-items:center;width:28px;height:28px;border-radius:7px;color:#8f95a3!important}
.app-epg .del:hover{background:#2a2e39;color:#ff8892!important}
.app-epg .del svg{width:14px;height:14px}
#sch-media-l[hidden]{display:none}

/* api */
.app-api{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:12px;align-items:start}
.app-api__col{display:grid;gap:12px;min-width:0}
.app-inline{display:grid;grid-template-columns:1fr auto;gap:8px}
.app-inline .lab-send{height:34px;padding:0 16px}
.app-newkey{display:grid;gap:8px;padding:10px;border-radius:9px;background:rgba(31,183,90,.08);box-shadow:0 0 0 1px rgba(31,183,90,.4) inset;font-size:12px;color:#9fe0b8}
.app-newkey[hidden]{display:none}
.app-keys{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.app-keys li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;background:#191c24}
.app-keys b{font-size:12.5px;color:#fff}
.app-keys small{display:block;font:500 10.5px/1.4 ui-monospace,Menlo,monospace;color:var(--mu)}

/* server */
.app-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.app-steps li{position:relative;display:grid;gap:4px;padding:12px 14px;border-radius:12px;background:var(--pn);box-shadow:0 0 0 1px var(--bd) inset;font-size:12px;color:var(--mu)}
.app-steps b{display:flex;align-items:center;gap:8px;font:800 12.5px/1.2 var(--display);color:#aab0bd}
.app-steps b i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#2a2e39;font:800 10px/1 var(--display);font-style:normal;color:#fff}
.app-steps li.is-done b{color:#fff}
.app-steps li.is-done b i{background:var(--grn)}
.app-steps li.is-run{box-shadow:0 0 0 1.5px var(--amb) inset}
.app-steps li.is-run b i{background:var(--amb);color:#1d1304;animation:pulse 1.4s ease-in-out infinite}
.app-steps li.is-err{box-shadow:0 0 0 1.5px var(--red) inset}
.app-steps li.is-err b i{background:var(--red)}
.app-srv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.app-log-p{grid-row:span 2}
.app-dl{display:grid;gap:6px;margin:0}
.app-dl div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:10px;padding:7px 10px;border-radius:8px;background:#191c24;font-size:12px}
.app-dl dt{color:var(--mu)}
.app-dl dd{margin:0;color:#fff;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-bars{display:grid;gap:10px}
.app-bar{display:grid;gap:5px;font-size:11.5px;color:var(--mu)}
.app-bar span{display:flex;justify-content:space-between}
.app-bar b{color:#fff;font-variant-numeric:tabular-nums}
.app-bar i{display:block;height:6px;border-radius:6px;background:#08090c;overflow:hidden}
.app-bar i s{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--grn),#7fe0a8);transition:width .6s var(--ease)}
.app-bar.is-hi i s{background:linear-gradient(90deg,var(--amb),var(--red-2))}
.app-log{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:560px;overflow:auto}
.app-log li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px;padding:7px 8px;border-radius:7px;background:#191c24;font-size:11.5px;color:#c3c8d2}
.app-log time{font:600 10.5px/1.4 ui-monospace,Menlo,monospace;color:var(--mu)}
.app-log li[data-t="error"],.app-log li[data-t="security"]{color:#ffb4ba}

/* paketlər (app daxilində) */
.app-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.app-plan{display:grid;gap:12px;align-content:start;padding:18px;border-radius:14px;background:var(--pn);box-shadow:0 0 0 1px var(--bd) inset;transition:transform .3s var(--ease),box-shadow .3s}
.app-plan:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(255,42,61,.5) inset,0 20px 40px -20px rgba(225,10,30,.6)}
.app-plan h3{font:800 18px/1 var(--display);color:#fff}
.app-plan p{font:900 32px/1 var(--display);color:#fff}
.app-plan p small{font:600 12px/1 var(--font);color:var(--mu)}
.app-plan ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:12.5px;color:#aab0bd}
.app-plan li{display:flex;gap:8px;align-items:center}
.app-plan li svg{width:14px;height:14px;color:var(--grn)}
.app-note{padding:12px 14px;border-radius:10px;background:rgba(255,176,32,.08);box-shadow:0 0 0 1px rgba(255,176,32,.35) inset;color:#ffd38a;font-size:13px}
.app-note[hidden]{display:none}

.st-status{flex:none}
.st-dot.is-off{background:#4a4f5c;box-shadow:none}

/* responsive */
@media (max-width:1320px){
  .st-tab:not(.is-on) .st-tab__t,.st-tab:not(.is-on) .st-tab__b{display:none}
  .st-tab:not(.is-on){padding:0 10px}
  #live-chip{display:none}
}
@media (max-width:1180px){
  .st-body{grid-template-columns:minmax(0,1fr)}
  .app-srv{grid-template-columns:1fr 1fr}
  .app-log-p{grid-row:auto}
}
@media (max-width:900px){
  .app-mons{grid-template-columns:1fr}
  .app-deck{grid-template-columns:1fr}
  .app-take .st-take__btns{grid-template-columns:1fr 1fr;grid-template-rows:auto;width:100%}
  .app-take .st-big{width:auto}
  .app-lab,.app-sched,.app-api{grid-template-columns:1fr}
  .app-steps{grid-template-columns:1fr 1fr}
  .app-srv{grid-template-columns:1fr}
  .st-url{display:none}
  .app-user__btn span{display:none}
  .app-ch span{display:none}
}
@media (max-width:560px){
  .st-strip,.st-tool{overflow:hidden;min-width:0}
  .st-strip{padding:0 8px;gap:6px}
  .st-tab__ic{width:20px;height:20px}
  .app-logo,.st-tab .st-tab__t,.st-tab .st-tab__b{display:none}
  .st-tab,.st-tab:not(.is-on){padding:0 8px}
  .app-ch{padding-left:4px}
  #tally{padding:0 8px;letter-spacing:.08em}
  .app-pad,.st-body{padding:10px}
  .app-grid2,.app-grid3,.app-toggles{grid-template-columns:1fr}
  .st-tool .st-nav,.st-clock{display:none}
  .app-card{grid-template-columns:90px minmax(0,1fr)}
  .app-epg li{grid-template-columns:70px minmax(0,1fr) auto}
  .app-epg li em{display:none}
  .st-status span:not(:first-child):not(:nth-child(2)){display:none}
  .app-ch select{max-width:110px}
}

/* ===== canlı pult (demo ilə eyni quruluş, real siqnal) ===== */
.st-screen video,.st-in__scr video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.st-screen video{object-fit:contain}
.app-slot{position:absolute;inset:0;z-index:1;display:block}
.app-slot[hidden]{display:none}
.app-bars{position:absolute;inset:0;background:linear-gradient(90deg,#c0c0c0 0 14.28%,#c0c000 0 28.57%,#00c0c0 0 42.85%,#00c000 0 57.14%,#c000c0 0 71.42%,#c00000 0 85.71%,#0000c0 0)}
.app-bars::after{content:"";position:absolute;left:0;right:0;bottom:0;height:24%;background:linear-gradient(90deg,#00214c 0 17.8%,#fff 0 35.7%,#32006a 0 53.5%,#131313 0 71.4%,#090909 0 76%,#131313 0 80.5%,#1d1d1d 0 85.7%,#131313 0)}
.app-slate{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 40%,#1b1e27,#07080b)}
.app-slate img{max-width:46%;max-height:40%;object-fit:contain}
.app-slate b{font:800 clamp(10px,2.4vw,22px)/1.1 var(--display);color:#fff;text-align:center;padding:0 8px}
.app-vt,.app-nosig{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:4px;padding:6px;text-align:center;background:repeating-linear-gradient(135deg,#0b0c10 0 10px,#0f1116 10px 20px)}
.app-vt svg{width:20px;height:20px;color:var(--amb)}
.app-vt b{font-size:11px;font-weight:600;color:#c3c8d2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-nosig b{font:800 10px/1 var(--display);letter-spacing:.14em;color:#6f7584}
.app-nosig small{font:700 9px/1 ui-monospace,Menlo,monospace;color:#4b505c}
.st-mon .app-slot .app-vt b{font-size:14px}
.st-mon .app-nosig b{font-size:13px}
.st-in.app-tile{cursor:pointer;user-select:none}
.app-in__set{position:absolute;right:8px;top:8px;z-index:3;display:grid;place-items:center;width:24px;height:24px;border-radius:6px;background:rgba(10,11,15,.72);color:#c3c8d2!important;opacity:0;transition:opacity .2s}
.app-in__set svg{width:13px;height:13px}
.st-in:hover .app-in__set,.st-in:focus-within .app-in__set,.app-in__set:focus-visible{opacity:1}
@media (hover:none){.app-in__set{opacity:1}}
.app-keysel{appearance:none;background:transparent;border:0;color:#fff;font:inherit;font-weight:700;cursor:pointer;padding:0 2px;text-decoration:underline dotted;text-underline-offset:3px}
.app-keysel option{background:#14161c}
.st-lbl .app-gfx-edit{margin-left:6px;vertical-align:middle}
button.st-afv{cursor:pointer;border:0}
button.st-afv.is-off{background:#262a35;color:#767c8b}
.app-mix{grid-template-columns:repeat(4,minmax(0,1fr))}
.app-mix .st-ch{grid-template-rows:96px auto auto}
.app-mix .st-ch b{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:8.5px}
.app-sj-th{display:grid!important;place-items:center;background:repeating-linear-gradient(135deg,#0b0c10 0 10px,#11131a 10px 20px)!important}
.app-sj-th svg{width:22px;height:22px;color:#646a79}
.sj.is-live .app-sj-th svg{color:#fff}
.st-stories__list .app-empty{flex:1;padding:16px;font-size:12.5px;color:var(--mu)}
#sv-studio.is-direct .st-deck,#sv-studio.is-direct .st-stories,#sv-studio.is-direct .st-mon--pvw,#sv-studio.is-direct .st-panel:has(#mix){display:none}
#sv-studio.is-direct .st-mons{grid-template-columns:minmax(0,1fr)}
.st-inputs .app-direct{grid-column:1/-1}
.ing__v code.is-secret,.ing__v code[data-s]{cursor:pointer}

/* dialoqlar */
.app-dlg{width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:0;border-radius:14px;background:#12141a;color:#e8eaf0;box-shadow:0 0 0 1px var(--bd),0 30px 80px rgba(0,0,0,.6)}
.app-dlg::backdrop{background:rgba(5,6,9,.7);backdrop-filter:blur(3px)}
.app-dlg__in{display:grid;gap:12px;padding:16px}
.app-dlg__in header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.app-dlg__in header b{font:800 15px/1.2 var(--display)}
.app-dlg__in label{display:grid;gap:5px}
.app-dlg__in label>span{font:800 9px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--mu)}
.app-dlg__in [hidden]{display:none!important}
.app-dlg__row{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px}
.app-dlg__in footer{display:flex;justify-content:flex-end;gap:8px}
.app-x{width:30px;height:30px;border-radius:8px;background:#1f222b;color:#c3c8d2!important;font-size:18px;line-height:1}
.app-ing{display:grid;gap:10px}
.app-guest{display:flex;gap:8px}
.app-guest .app-in{flex:1;min-width:0}
textarea.app-in{resize:vertical;min-height:70px;font:inherit}
@media (max-width:560px){.app-dlg__row{grid-template-columns:1fr}.app-mix .st-ch{grid-template-rows:80px auto auto}}
.st-in .app-nosig b{font-size:8.5px;letter-spacing:.08em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:760px){.st-in .app-nosig b{display:none}.st-in .app-nosig small{font-size:10px;color:#6f7584}.app-dlg__in footer .lab-send{min-width:150px}}
.app-dlg__in footer .lab-send{min-width:150px;justify-content:center}