/* Circuito Studio · Schermi (pannello-onda.js, vSchermi): testata compatta, una barra sola, tre grandezze.
   Grande = schede grandi con anteprima dal vivo; Media = 4–6 per riga, anteprime piccole; Piccola = elenco con
   miniatura ferma, 15–20 TV in una schermata. Semaforo: verde in onda, giallo da fare, rosso spento, grigio vuoto. */
.io-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.io-tit{display:flex;align-items:baseline;gap:12px;min-width:0;flex-wrap:wrap}
.io-tit h1{font:700 26px/1.1 var(--f-head);letter-spacing:-.03em;margin:0}
.io-sub{color:var(--muted);font-size:14px}
.io-head .btn{height:38px}
.io-barra{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 4px;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.io-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.io-barra .io-chip{padding:5px 11px;font-size:13px;border-color:transparent;background:var(--sunk)}
.io-barra .io-chip[aria-pressed="true"]{border-color:var(--fg2);background:var(--surface)}
.io-barra .pn-quota-riga{margin:0;font-size:12.5px}
.io-sel{display:inline-flex;align-items:center;gap:6px;border-radius:10px;background:var(--sunk);padding:0 4px 0 10px;height:34px;color:var(--fg2)}
.io-sel-ic svg{width:15px;height:15px;display:block}
.io-sel select{border:0;background-color:transparent;height:32px;font-size:13px;font-weight:600;padding:0 26px 0 2px;max-width:220px;color:var(--fg)}
.io-taglie button{padding:5px 9px}
.io-taglie svg{width:16px;height:16px}
.io-grande .sch-punto:first-of-type{margin-top:14px}
/* Media */
.io-griglia.io-mg{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:14px}
.io-tv.io-m .io-info{padding:9px 11px 11px;gap:5px}
.io-tv.io-m .io-nome{font-size:14px}
.io-tv.io-m .io-ora{font-size:12.5px}
.io-tv.io-m .io-az{gap:6px}
.io-tv.io-m .io-az .btn{padding:4px 10px;min-height:30px;font-size:12.5px}
.io-tv.io-m .bx-pill{font-size:11.5px}
.io-sep{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin:10px 0 -2px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.io-sep:first-child{margin-top:0}
.io-sep b{font-weight:700;color:var(--fg2)}
.io-sep::after{content:"";flex:1;height:1px;background:var(--line);order:3}
.io-sep .lnk{order:4;text-transform:none;letter-spacing:0;font-size:12.5px}
/* Piccola */
.io-lista{padding:0;margin-top:10px;overflow:visible}
.io-r{display:grid;grid-template-columns:80px minmax(140px,1.2fr) minmax(0,2fr) 120px auto;gap:14px;align-items:center;padding:4px 12px 4px 6px;border-top:1px solid var(--line)}
.io-lista.con-punto .io-r{grid-template-columns:80px minmax(140px,1.1fr) minmax(90px,.7fr) minmax(0,2fr) 120px auto}
.io-lista>.io-r:first-child{border-top:0}
.io-r:hover{background:var(--sunk)}
.io-r.allarme{box-shadow:inset 3px 0 0 #dc2626}
.io-th{width:80px;aspect-ratio:16/9;border:0;padding:0;border-radius:8px;overflow:hidden;background:#0c0a09;cursor:pointer;position:relative;display:block}
.io-th>span{position:absolute;inset:0;display:block}
.io-th.v>span{left:50%;right:auto;width:30.4%;transform:translateX(-50%)}
.io-r-n{display:grid;gap:1px;min-width:0}.io-r-n small{color:var(--muted);font-size:12px}
.io-r-p{font-size:13px;color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.io-r-st{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;min-width:0;font-size:12.5px}
.io-r-st .bx-pill{margin:0}
.io-r-st [data-cs-tv]:empty,.io-r-st [data-or-tv]:empty{display:none}
.io-r-v{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.io-r-az{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.io-r-az .btn{min-height:30px;padding:4px 11px;font-size:12.5px}
.io-r-n .pn-nome{font-size:14px}
.io-st{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--fg2);white-space:nowrap}
.io-st i{width:8px;height:8px;border-radius:50%;background:#a8a29e}
.io-st.verde i{background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.15)}.io-st.verde{color:#15803d}
.io-st.giallo i{background:#e0a800}.io-st.giallo{color:#8a6100}
.io-st.rosso i{background:#dc2626}.io-st.rosso{color:#b42318}
.io-st.mini{font-weight:500;font-size:12px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .io-st.verde{color:#4ade80}:root:not([data-theme="light"]) .io-st.giallo{color:#f2c14e}:root:not([data-theme="light"]) .io-st.rosso{color:#f87171}}
:root[data-theme="dark"] .io-st.verde{color:#4ade80}:root[data-theme="dark"] .io-st.giallo{color:#f2c14e}:root[data-theme="dark"] .io-st.rosso{color:#f87171}
@media (max-width:1100px){
  .io-r,.io-lista.con-punto .io-r{grid-template-columns:80px minmax(0,1fr) auto}
  .io-r-p,.io-r-v{display:none}
  .io-r-st{grid-column:2/3;grid-row:2}
  .io-r-az{grid-column:3;grid-row:1/3}
}
@media (max-width:640px){
  .io-tit h1{font-size:23px}
  .io-sub{display:none}
  .io-head .btn{height:36px;padding:0 11px;font-size:13px}
  .io-barra{gap:6px}
  .io-taglie span{display:none}
  .io-griglia.io-mg{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .io-tv.io-m .io-az .btn{padding:3px 8px}
  .io-r,.io-lista.con-punto .io-r{grid-template-columns:76px minmax(0,1fr);gap:4px 10px;padding:8px 10px 8px 8px}
  .io-th{width:76px}
  .io-r-st{grid-column:2}
  .io-r-az{grid-column:1/-1;grid-row:auto;justify-content:flex-start}
  .io-r-az .btn.ghost{display:none}
}
/* meno spazio in cima: le TV salgono */
.st-wrap.io-grande,.st-wrap.io-media,.st-wrap.io-piccola{gap:12px}
.st-wrap.io-grande #msg-striscie:empty,.st-wrap.io-media #msg-striscie:empty,.st-wrap.io-piccola #msg-striscie:empty{display:none}
.st-wrap .io-barra{margin:0}
.io-lista,.io-griglia.io-mg{margin-top:0}
.io-tv.io-m .io-schermo.v .io-vuoto span,.io-tv.io-m .io-schermo .io-vuoto span{display:none}
.io-tv.io-m .io-schermo.v .io-vuoto b{font-size:11px}