/* Talpie TV Server local polish layer on top of the Smart Home SPA CSS stack. */
:root {
    --tv-ok: #15803d;
    --tv-warn: #b45309;
    --tv-danger: #b42318;
}

.tv-login-body .tsh-login-card { width: 100%; }
.tv-login-shell { width: min(100%, 410px); }
.tv-login-note-row {
    justify-content: space-between;
    gap: 10px;
    color: var(--text-3, #64748b);
    font-size: 11px;
}
.tv-login-note-row span:last-child { font-weight: 800; color: #17356c; }

.tsh-nav button.tsh-nav-item {
    width: 100%;
    appearance: none;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}
.tsh-nav button.tsh-nav-item.is-active { background: rgba(37,99,235,.20); }
.tsh-nav button.tsh-nav-item.is-disabled { opacity: .48; cursor: not-allowed; }
.tsh-brand-row { display: grid; gap: 3px; }
.tsh-brand-subtitle { padding-left: 43px; margin-top: -5px; }

.tv-section { display: none; gap: 14px; }
.tv-section.is-active { display: grid; }

.summary-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 10px;
}
.summary-card {
    display: grid;
    gap: 7px;
    min-height: 92px;
}
.summary-card span:first-child {
    color: var(--text-3, #64748b);
    font-size: 10.5px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.summary-card strong { font-size: 27px; color: #0f172a; line-height: 1; }
.summary-card small { color: var(--text-2, #475569); }

.tv-scope-card { display: grid; gap: 12px; }
.tv-check-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.tv-check-grid div {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 9px 10px;
    border: 1px solid var(--line-1, #d8e2ef);
    border-radius: var(--r-sm, 6px);
    background: #f8fafc;
    color: #17356c;
    font-weight: 800;
    font-size: 12px;
}
.tv-check-grid img { width: 14px; height: 14px; }

.smart-table-wrap { margin-top: 12px; }
.smart-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
}
.smart-table th,
.smart-table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--line-1, #d8e2ef);
    text-align: left;
    vertical-align: middle;
}
.smart-table th {
    background: #f3f7fc;
    color: #17356c;
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .07em;
    font-weight: 900;
    white-space: nowrap;
}
.smart-table td { color: #1e293b; }
.smart-table tbody tr:hover td { background: #f8fbff; }
.smart-table .row-actions { display: flex; gap: 6px; align-items: center; }

.tv-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 900;
    border: 1px solid var(--line-1, #d8e2ef);
    background: #eef2f7;
    color: #334155;
}
.tv-badge.pending { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.tv-badge.approved { background: #ecfdf5; border-color: #bbf7d0; color: #166534; }
.tv-badge.blocked { background: #fff5f5; border-color: #fecaca; color: #b42318; }
.tv-badge.yes { background: #ecfdf5; border-color: #bbf7d0; color: #166534; }
.tv-badge.no { background: #f8fafc; color: #64748b; }

.tsh-toast-root {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1200;
    display: grid;
    gap: 8px;
}
.tv-toast {
    padding: 10px 12px;
    border: 1px solid var(--line-1, #d8e2ef);
    border-radius: 7px;
    background: #fff;
    color: #17356c;
    box-shadow: var(--shadow-lg, 0 20px 50px rgba(15,23,42,.16));
    font-weight: 800;
    font-size: 12px;
    animation: tvToastIn .16s ease-out both;
}
.tv-toast.error { color: var(--tv-danger); border-color: #fecaca; background: #fff5f5; }
@keyframes tvToastIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1120px) {
    .summary-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tv-check-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .summary-card-grid, .tv-check-grid { grid-template-columns: 1fr; }
    .tsh-topbar-actions .tsh-top-button span { display: none; }
}

/* Iteration 2 Smart Home UI reuse: tabs, drawer, modal, preview and drag/drop-ready boards. */
.tsh-section-title .ah-btn { margin-left: auto; }
.btn-ico { width: 14px; height: 14px; object-fit: contain; }
.tsh-tab-panel[hidden] { display: none !important; }
.tsh-tab-strip img.btn-ico { opacity: .82; }
.tv-action-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.tv-action-row.end { justify-content: flex-end; }
.tv-modal-copy { margin: 0; color: var(--text-2, #475569); font-weight: 650; }
.tv-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.tv-form-grid.compact { grid-template-columns: 1.2fr .8fr; }
.tv-form-grid label { display: grid; gap: 5px; font-size: 11px; font-weight: 850; color: #17356c; text-transform: uppercase; letter-spacing: .05em; }
.tv-form-grid input,
.tv-form-grid select {
    min-height: 34px;
    border: 1px solid var(--line-1, #d8e2ef);
    border-radius: 7px;
    background: #fff;
    padding: 0 10px;
    color: #0f172a;
    font: inherit;
}
.tv-preview-grid { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(320px, 1.15fr); gap: 14px; align-items: start; }
.tv-video-card {
    border: 1px solid var(--line-1, #d8e2ef);
    border-radius: 10px;
    background: #0f172a;
    overflow: hidden;
    box-shadow: var(--shadow-xs, 0 1px 2px rgba(15,23,42,.06));
}
.tv-video-card video { width: 100%; aspect-ratio: 16 / 9; display: block; background: #020617; }
.tv-preview-url {
    padding: 9px 10px;
    color: #dbeafe;
    background: #111827;
    font: 11px/1.45 var(--tsh-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
    overflow-wrap: anywhere;
}
.tv-engine-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tv-drop-board { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tv-drop-column {
    min-height: 240px;
    border: 1px dashed #b8c7da;
    border-radius: 10px;
    background: #f8fafc;
    padding: 10px;
    display: grid;
    align-content: start;
    gap: 8px;
}
.tv-drop-column > span {
    color: #17356c;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .07em;
}
.tv-drop-column.ghost { place-items: center; text-align: center; color: var(--text-2, #475569); }
.tv-channel-chip.tsh-rel-node {
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas: "handle title" "handle meta";
    gap: 2px 8px;
    text-align: left;
    border: 1px solid var(--line-1, #d8e2ef);
    background: #fff;
    border-radius: 8px;
    padding: 8px 9px;
    cursor: grab;
    box-shadow: var(--shadow-xs, 0 1px 2px rgba(15,23,42,.06));
}
.tv-channel-chip strong { grid-area: title; color: #17356c; }
.tv-channel-chip small { grid-area: meta; color: var(--text-3, #64748b); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-drag-handle { grid-area: handle; color: #94a3b8; align-self: center; font-weight: 900; }
.tv-channel-chip.is-dragging { opacity: .54; cursor: grabbing; }
.tv-channel-chip.drag-over { border-color: var(--ah-blue, #2563eb); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.tv-drawer-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.tv-code-box {
    white-space: pre-wrap;
    overflow: auto;
    border: 1px solid var(--line-1, #d8e2ef);
    border-radius: 8px;
    background: #0f172a;
    color: #dbeafe;
    padding: 12px;
    font: 11.5px/1.5 var(--tsh-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
}
.tv-badge.active { background: #ecfdf5; border-color: #bbf7d0; color: #166534; }
.tv-badge.warming { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.tv-badge.error { background: #fff5f5; border-color: #fecaca; color: #b42318; }
.ah-btn.danger,
.tsh-top-button.danger {
    border-color: #fecaca;
    color: #b42318;
}
.ah-btn.danger:hover,
.tsh-top-button.danger:hover { background: #fff5f5; }

@media (max-width: 980px) {
    .tv-preview-grid,
    .tv-engine-grid,
    .tv-drop-board,
    .tv-drawer-summary { grid-template-columns: 1fr; }
    .tv-form-grid,
    .tv-form-grid.compact { grid-template-columns: 1fr; }
}

/* Iteration 2 hotfix 1: copied Smart Home overlay classes define display:grid/fixed.
   In this standalone shell we also use the HTML hidden attribute, so protect hidden
   modal/drawer backdrops from becoming invisible full-screen click blockers. */
.tsh-modal-backdrop[hidden],
.tsh-drawer-backdrop[hidden] {
    display: none !important;
    pointer-events: none !important;
    opacity: 0 !important;
}
.tsh-modal-backdrop:not(.open),
.tsh-drawer-backdrop:not(.open) {
    pointer-events: none;
}
.tsh-modal-backdrop.open,
.tsh-drawer-backdrop.open {
    pointer-events: auto;
}

/* Iter2 admin foundation: keep Smart Home primitives clickable/reusable. */
.tsh-user-card.as-button { width: 100%; border: 0; text-align: left; cursor: pointer; }
.tv-section { display: none; }
.tv-section.is-active { display: block; }
.ah-code.block { display: block; margin-top: 12px; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.tv-preview-panel { display: grid; gap: 14px; max-width: 760px; }
.tsh-command-list { display: grid; gap: 8px; }
.tsh-command-row { display: grid; gap: 3px; text-align: left; border: 1px solid var(--border, rgba(148,163,184,.25)); border-radius: 14px; padding: 12px 14px; background: var(--surface-raised, rgba(255,255,255,.05)); color: inherit; cursor: pointer; }
.tsh-command-row:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm, 0 8px 24px rgba(0,0,0,.12)); }
.tsh-command-row small { color: var(--muted, #64748b); }
.tsh-toast { position: fixed; right: 24px; bottom: 24px; z-index: 10000; background: var(--surface-raised, #fff); color: var(--text, #0f172a); border: 1px solid var(--border, rgba(148,163,184,.35)); border-radius: 14px; padding: 12px 16px; box-shadow: var(--shadow-lg, 0 20px 50px rgba(15,23,42,.24)); opacity: 0; transform: translateY(8px); transition: .18s ease; }
.tsh-toast.show { opacity: 1; transform: translateY(0); }
.tsh-toast.error { border-color: rgba(239,68,68,.5); }
.tsh-toast.success { border-color: rgba(34,197,94,.45); }
.smart-form-field input[type="password"] { font-family: inherit; }
.tsh-modal-backdrop:not(.open), .tsh-drawer-backdrop:not(.open) { pointer-events: none; }
.tsh-modal-backdrop.open, .tsh-drawer-backdrop.open { pointer-events: auto; }

/* Iter2 Hotfix 3 — TV shell polish matching Smart Home logo/command UX. */
.tv-admin-body .tsh-brand-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    min-height: 54px;
}
.tv-admin-body .tsh-brand {
    min-width: 0;
    align-items: center;
    gap: 9px;
}
.tv-admin-body .tsh-brand-text {
    min-width: 0;
    display: grid;
    gap: 1px;
}
.tv-admin-body .tsh-brand-text .tsh-brand-name,
.tv-admin-body .tsh-brand-text .tsh-brand-subtitle {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tv-admin-body .tsh-brand-text .tsh-brand-subtitle {
    padding-left: 0;
    margin-top: 0;
}
.tv-admin-body .tsh-command-backdrop { z-index: 1600; }
.tv-admin-body .tsh-command-card {
    border-radius: 14px;
    box-shadow: 0 28px 90px rgba(15,23,42,.28);
}
.tv-admin-body .tsh-command-list {
    gap: 3px;
}
.tv-admin-body .tsh-command-list button {
    min-height: 44px;
    border-radius: 9px;
}
.tv-admin-body .tsh-command-list button.is-active,
.tv-admin-body .tsh-command-list button:hover {
    background: var(--brand-weak, #eef4ff);
    box-shadow: inset 3px 0 0 var(--brand, #2563eb);
}
.smart-table-card.is-refreshing [data-st-body] {
    opacity: .58;
    transition: opacity 120ms ease;
}
.smart-row-enter {
    animation: smartRowEnter 180ms cubic-bezier(.16,1,.3,1) both;
}
.smart-row-updated {
    animation: smartRowUpdated 720ms ease both;
}
.smart-row-removing {
    opacity: 0;
    transform: translateX(10px);
    transition: opacity 160ms ease, transform 160ms ease;
}
@keyframes smartRowEnter {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes smartRowUpdated {
    0% { background: rgba(37,99,235,.12); }
    100% { background: transparent; }
}

/* Keep wide SmartTables contained inside the SPA content pane. */
.tsh-content,
.tv-section,
.tsh-card,
.tsh-tab-card,
.spa-card,
.smart-table-host,
.smart-table-card {
    min-width: 0;
    max-width: 100%;
}


/* Iter4 HF9: WebUI local HLS preview */
.tv-preview-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
}
.tv-preview-toolbar .smart-form-field {
  min-width: min(420px, 100%);
  flex: 1 1 320px;
}
.tv-preview-player-shell {
  margin-top: 14px;
  border: 1px solid var(--tsh-border, rgba(148, 163, 184, .28));
  border-radius: 18px;
  overflow: hidden;
  background: #05070b;
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.tv-preview-video {
  display: block;
  width: 100%;
  max-height: 62vh;
  aspect-ratio: 16 / 9;
  background: #000;
}
.tv-preview-hint {
  padding: 10px 14px;
  color: var(--tsh-muted, #94a3b8);
  font-size: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(15,23,42,.88);
}
.tv-preview-diagnostics {
  min-height: 72px;
  white-space: pre-wrap;
}

/* Iteration 5.3: professional EPG guide */
.tv-epg-guide-shell {
  display: grid;
  gap: 14px;
}
.tv-epg-guide-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--tsh-border, rgba(148, 163, 184, .25));
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(15, 23, 42, .04), rgba(37, 99, 235, .06));
}
.tv-epg-guide-toolbar strong { display: block; font-size: 15px; }
.tv-epg-guide-toolbar small { display: block; color: var(--tsh-muted, #64748b); margin-top: 2px; }
.tv-epg-guide {
  display: grid;
  gap: 10px;
  max-height: min(68vh, 760px);
  overflow: auto;
  padding: 4px 2px 10px;
}
.tv-epg-guide-row {
  display: grid;
  grid-template-columns: minmax(170px, 230px) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}
.tv-epg-guide-channel {
  position: sticky;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--tsh-border, rgba(148, 163, 184, .25));
  border-radius: 16px;
  background: var(--tsh-card, #fff);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}
.tv-epg-guide-channel img,
.tv-epg-guide-logo-fallback {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  object-fit: contain;
  background: rgba(15, 23, 42, .06);
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--brand, #2563eb);
}

.tv-epg-guide-channel-play {
  all: unset;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  border-radius: 13px;
}
.tv-epg-guide-channel-play:hover strong,
.tv-epg-guide-channel-play:focus-visible strong { color: var(--brand, #2563eb); }
.tv-epg-guide-channel-play:focus-visible {
  outline: 2px solid var(--brand, #2563eb);
  outline-offset: 3px;
}
.tv-epg-guide-channel-play.is-disabled { cursor: default; opacity: .65; }
.tv-epg-guide-channel strong { display: block; font-size: 13px; }
.tv-epg-guide-channel small { display: block; color: var(--tsh-muted, #64748b); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.tv-epg-guide-track {
  display: flex;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px 0 4px;
}
.tv-epg-programme {
  flex: 0 0 var(--w, 120px);
  min-width: 90px;
  padding: 10px 10px 9px;
  border: 1px solid rgba(148, 163, 184, .25);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(248, 250, 252, .96), rgba(241, 245, 249, .9));
  box-shadow: 0 10px 20px rgba(15, 23, 42, .06);
  overflow: hidden;
}
.tv-admin-body.dark .tv-epg-programme,
[data-theme="dark"] .tv-epg-programme {
  background: linear-gradient(180deg, rgba(30, 41, 59, .94), rgba(15, 23, 42, .92));
}
.tv-epg-programme.is-now {
  border-color: rgba(37, 99, 235, .55);
  box-shadow: inset 3px 0 0 var(--brand, #2563eb), 0 14px 28px rgba(37, 99, 235, .14);
}
.tv-epg-programme.is-scheduled {
  border-color: rgba(245, 158, 11, .72);
  background: linear-gradient(180deg, rgba(255, 247, 237, .98), rgba(254, 243, 199, .9));
  box-shadow: inset 3px 0 0 #f59e0b, 0 14px 28px rgba(245, 158, 11, .14);
}
.tv-admin-body.dark .tv-epg-programme.is-scheduled,
[data-theme="dark"] .tv-epg-programme.is-scheduled {
  background: linear-gradient(180deg, rgba(120, 53, 15, .42), rgba(15, 23, 42, .9));
}
.tv-epg-programme-time {
  color: var(--tsh-muted, #64748b);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  margin-bottom: 5px;
}
.tv-epg-programme strong {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.2;
}
.tv-epg-programme small {
  display: block;
  margin-top: 5px;
  color: var(--tsh-muted, #64748b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tv-epg-rec-pill {
  display: inline-flex;
  align-items: center;
  margin-top: 7px;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(245, 158, 11, .18);
  color: #b45309;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.tv-epg-guide-empty {
  color: var(--tsh-muted, #64748b);
  padding: 16px;
  border: 1px dashed var(--tsh-border, rgba(148, 163, 184, .28));
  border-radius: 14px;
}
@media (max-width: 760px) {
  .tv-epg-guide-row { grid-template-columns: 1fr; }
  .tv-epg-guide-channel { position: relative; }
}

/* Iteration 5.4 — professional WebUI player with channel rail. */
.tv-web-player-panel {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 14px;
    min-height: 560px;
}
.tv-web-player-sidebar,
.tv-web-player-main {
    min-width: 0;
    border: 1px solid var(--line-1, #dbe3ef);
    border-radius: 14px;
    background: var(--surface-1, #fff);
    box-shadow: 0 6px 20px rgba(15,23,42,.06);
}
.tv-web-player-sidebar { display: flex; flex-direction: column; overflow: hidden; }
.tv-web-player-sidebar-head { padding: 12px; border-bottom: 1px solid var(--line-1, #dbe3ef); display: grid; gap: 9px; }
.tv-web-player-sidebar-head strong { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; color: var(--text-2, #64748b); }
.tv-web-player-channel-list { overflow: auto; padding: 8px; display: grid; gap: 7px; max-height: 680px; scrollbar-width: thin; }
.tv-web-player-channel {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    width: 100%;
    text-align: left;
    border: 1px solid var(--line-1, #dbe3ef);
    border-radius: 11px;
    padding: 8px;
    background: #fff;
    color: var(--text-1, #172033);
    cursor: pointer;
}
.tv-web-player-channel:hover,
.tv-web-player-channel.is-active { border-color: var(--brand, #2563eb); background: var(--brand-weak, #eef4ff); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.tv-web-player-channel-no { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-align: center; font-weight: 800; color: var(--brand, #2563eb); }
.tv-web-player-channel-main { min-width: 0; }
.tv-web-player-channel-main strong,
.tv-web-player-channel-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-web-player-channel-main strong { font-size: 13px; }
.tv-web-player-channel-main small { font-size: 11px; color: var(--text-2, #64748b); margin-top: 2px; }
.tv-web-player-channel-tab,
.tv-web-player-rec { border-radius: 999px; padding: 3px 7px; font-size: 10px; font-weight: 800; letter-spacing: .05em; background: #f1f5f9; color: #475569; }
.tv-web-player-rec { background: #fee2e2; color: #b91c1c; }
.tv-web-player-main { padding: 12px; display: grid; gap: 10px; align-content: start; }
.tv-web-player-stat { margin-left: auto; color: var(--text-2, #64748b); font-size: 12px; align-self: center; }
@media (max-width: 1100px) { .tv-web-player-panel { grid-template-columns: 1fr; } .tv-web-player-channel-list { max-height: 320px; } }

/* Iteration 5.12 final hardening: professional single-scrollbar guide + player menu. */
.tv-epg-guide {
  display: block;
  max-height: min(72vh, 820px);
  overflow: auto;
  padding: 0 0 12px;
  border-radius: 18px;
  scrollbar-width: thin;
}
.tv-epg-guide-ruler {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 12px;
  align-items: center;
  min-width: 980px;
  padding: 10px 12px;
  border: 1px solid rgba(148, 163, 184, .25);
  border-radius: 16px;
  background: rgba(248, 250, 252, .96);
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 26px rgba(15, 23, 42, .08);
  font-size: 12px;
  color: var(--text-2, #64748b);
}
.tv-epg-guide-ruler strong { color: var(--text-1, #172033); text-transform: uppercase; letter-spacing: .08em; }
.tv-epg-guide-ruler em { font-style: normal; font-weight: 700; color: var(--brand, #2563eb); }
.tv-epg-guide-grid {
  display: grid;
  gap: 8px;
  min-width: 980px;
  padding-top: 10px;
}
.tv-epg-guide-row {
  grid-template-columns: 230px max-content;
  min-width: max-content;
}
.tv-epg-guide-track {
  overflow: visible;
  min-width: max-content;
}
.tv-epg-programme {
  appearance: none;
  text-align: left;
  cursor: pointer;
  color: var(--text-1, #172033);
}
.tv-epg-programme:hover,
.tv-epg-programme:focus-visible {
  outline: none;
  border-color: var(--brand, #2563eb);
  transform: translateY(-1px);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .14), 0 16px 30px rgba(15, 23, 42, .11);
}
.tv-epg-programme.is-recording {
  border-color: rgba(220, 38, 38, .82);
  background: linear-gradient(180deg, rgba(254, 226, 226, .98), rgba(252, 165, 165, .36));
  box-shadow: inset 3px 0 0 #dc2626, 0 14px 28px rgba(220, 38, 38, .16);
}
.tv-epg-rec-pill.recording { background: rgba(220, 38, 38, .16); color: #b91c1c; }
.tv-web-player-channel-tab[data-kind="CAMERA"], .tv-web-player-channel-tab.camera { background: #ecfeff; color: #0e7490; }
.tv-web-player-channel-tab[data-kind="RADIO"], .tv-web-player-channel-tab.radio { background: #f5f3ff; color: #6d28d9; }
@media (max-width: 760px) {
  .tv-epg-guide-ruler { grid-template-columns: 1fr; min-width: 760px; }
  .tv-epg-guide-row { grid-template-columns: 180px max-content; }
}

/* Iteration 5.16 — compact dark-red assignment controls and cleaner Web player list. */
.tsh-rel-grid.checkbox-mode {
  grid-template-columns: minmax(240px, .72fr) minmax(340px, 1.28fr);
  gap: 10px;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-column {
  padding: 8px;
  border-radius: 12px;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-column h4 {
  margin-bottom: 7px;
  font-size: 10.5px;
}
.tsh-rel-grid.checkbox-mode .smart-input {
  min-height: 34px;
  padding: 7px 9px;
  font-size: 12px;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-list {
  gap: 5px;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-node {
  min-height: 42px;
  padding: 6px 8px;
  border-radius: 9px;
  gap: 2px 7px;
  grid-template-columns: 22px minmax(0, 1fr);
}
.tsh-rel-grid.checkbox-mode .tsh-rel-node .btn-ico,
.tsh-rel-grid.checkbox-mode .tsh-rel-node img {
  width: 16px;
  height: 16px;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-node strong {
  font-size: 12px;
  line-height: 1.22;
}
.tsh-rel-grid.checkbox-mode .tsh-rel-node small {
  font-size: 10.5px;
  line-height: 1.2;
}
.tsh-rel-check-row {
  grid-template-columns: 20px 22px minmax(0, 1fr) !important;
}
.tsh-rel-check-row input[type="checkbox"],
.smart-form-check input[type="checkbox"],
.tsh-checkbox-row input[type="checkbox"],
.select-col input[type="checkbox"] {
  accent-color: var(--tsh-danger, #b91c1c) !important;
}
.tsh-rel-check-row input[type="checkbox"] {
  width: 15px !important;
  height: 15px !important;
  border-radius: 5px;
}
.tsh-rel-check-row.is-assigned {
  border-color: rgba(185, 28, 28, .32) !important;
  background: linear-gradient(180deg, rgba(254, 242, 242, .78), rgba(255, 255, 255, .96)) !important;
  box-shadow: inset 3px 0 0 rgba(185, 28, 28, .74);
}
.tsh-rel-grid.checkbox-mode .tsh-rel-node.is-active {
  border-color: rgba(185, 28, 28, .55) !important;
  background: rgba(254, 242, 242, .86) !important;
  box-shadow: 0 0 0 3px rgba(185, 28, 28, .12) !important;
}
.tv-web-player-sidebar .smart-native-hidden,
.tv-web-player-sidebar .smart-choice,
#previewChannel {
  display: none !important;
}

/* 0.5.20 MFA rollout/profile QR */
.tsh-mfa-step { display: grid; gap: 10px; padding: 14px; border: 1px solid rgba(148,163,184,.28); border-radius: 16px; background: rgba(15,23,42,.06); margin: 10px 0; }
.tsh-mfa-step strong { font-size: 15px; }
.tsh-mfa-step small { color: var(--text-2, #64748b); line-height: 1.35; }
.tsh-mfa-qr { width: 220px; height: 220px; max-width: 100%; border-radius: 14px; background: #fff; padding: 8px; box-shadow: 0 14px 35px rgba(15,23,42,.16); }
.tsh-mfa-secret { overflow-wrap: anywhere; white-space: normal; padding: 8px 10px; border-radius: 10px; }
.tsh-mfa-profile-panel { display: grid; gap: 14px; }
.tsh-mfa-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tsh-mfa-status-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; background: rgba(59,130,246,.12); color: var(--text-1, #0f172a); font-weight: 700; }
.tsh-checkbox-line { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--text-1,#0f172a); }
.tsh-checkbox-line small { color:var(--text-2,#64748b); width:100%; padding-left:26px; }
.tsh-mfa-trust { margin-top:8px; }
.tsh-mfa-trusted { margin-top:14px; padding:12px; border:1px solid rgba(148,163,184,.28); border-radius:14px; background:rgba(15,23,42,.04); }
.tsh-mini-list { display:grid; gap:8px; margin-top:8px; }
.tsh-mini-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 10px; border-radius:12px; background:rgba(255,255,255,.55); border:1px solid rgba(148,163,184,.22); }
.tsh-mini-row strong { display:block; font-size:13px; }
.tsh-mini-row small { display:block; max-width:680px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-2,#64748b); }
.ah-btn.small { padding:5px 9px; min-height:28px; font-size:12px; }

/* 0.5.28 — Web Player source tabs: TV / Radio / Camera / Recordings. */
.tv-web-player-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
.tv-web-player-tabs button {
  appearance: none;
  border: 1px solid var(--line-1, #dbe3ef);
  border-radius: 11px;
  background: var(--surface-1, #fff);
  color: var(--text-1, #172033);
  min-height: 36px;
  padding: 7px 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.tv-web-player-tabs button:hover,
.tv-web-player-tabs button.is-active {
  border-color: var(--brand, #2563eb);
  background: var(--brand-weak, #eef4ff);
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.tv-web-player-tabs button span {
  min-width: 20px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(148,163,184,.18);
  color: var(--text-2, #64748b);
  font-size: 10px;
}
.tv-web-player-channel-logo {
  width: 20px;
  height: 20px;
  object-fit: contain;
  vertical-align: -5px;
  margin-right: 4px;
  border-radius: 4px;
  background: rgba(255,255,255,.75);
}
.tv-web-player-channel-tab[data-kind="RECORDING"],
.tv-web-player-channel-tab.recording {
  background: #fef3c7;
  color: #92400e;
}
.tv-web-player-recording .tv-web-player-channel-no {
  color: #b45309;
}

/* 0.5.29 — Dashboard Android download card. */
.tv-download-card {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 12px 0;
}
.tv-download-main { display: flex; gap: 12px; align-items: center; min-width: 260px; }
.tv-download-main > img { width: 42px; height: 42px; object-fit: contain; }
.tv-download-main strong,
.tv-download-main span { display: block; }
.tv-download-main span { color: var(--text-2, #64748b); font-size: 13px; margin-top: 2px; }
.tv-download-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.tv-download-card > small { flex-basis: 100%; }
.ah-btn.disabled,
.ah-btn[aria-disabled="true"] { opacity: .55; pointer-events: none; filter: grayscale(.3); }

.tv-preview-debug[hidden] { display: none !important; }

/* Hotfix 0.5.35 — EPG guide inline scheduler state + channel search. */
.tv-epg-guide-ruler {
  grid-template-columns: 180px minmax(170px, 1fr) minmax(220px, 320px) auto;
}
.tv-epg-guide-search {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 6px 9px;
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 999px;
  background: rgba(255, 255, 255, .78);
}
.tv-epg-guide-search input {
  width: 100%;
  min-width: 120px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text-1, #172033);
  font: inherit;
}
.tv-epg-guide-search input::placeholder { color: var(--tsh-muted, #64748b); }
.tv-epg-programme.is-saving { opacity: .72; cursor: wait; transform: none; }
.tv-epg-programme:disabled { pointer-events: none; }
@media (max-width: 900px) {
  .tv-epg-guide-ruler { grid-template-columns: 1fr; min-width: 760px; }
  .tv-epg-guide-search { width: min(320px, 100%); }
}

/* Hotfix 0.5.36 — true guide time axis (-4h/+72h), now overlay and fixed debounce search. */
.tv-epg-guide {
  max-height: min(76vh, 860px);
  overflow: auto;
  scroll-behavior: smooth;
}
.tv-epg-guide-ruler {
  grid-template-columns: 180px minmax(260px, 1fr) minmax(280px, 420px) auto;
  min-width: var(--guide-total-width, 1210px);
}
.tv-epg-guide-search small {
  flex: 0 0 auto;
  color: var(--tsh-muted, #64748b);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.tv-epg-guide-grid {
  position: relative;
  min-width: var(--guide-total-width, 1210px);
  gap: 6px;
}
.tv-epg-guide-row {
  grid-template-columns: 230px var(--guide-track-width, 980px) !important;
  min-width: var(--guide-total-width, 1210px);
  gap: 0;
  align-items: stretch;
}
.tv-epg-guide-channel {
  z-index: 4;
  margin-right: 8px;
}
.tv-epg-guide-track {
  position: relative;
  display: block;
  width: var(--guide-track-width, 980px);
  min-width: var(--guide-track-width, 980px);
  height: 78px;
  overflow: visible;
  padding: 0;
  border-radius: 16px;
  background:
    repeating-linear-gradient(90deg, rgba(148, 163, 184, .18) 0 1px, transparent 1px 81px),
    linear-gradient(180deg, rgba(248, 250, 252, .70), rgba(241, 245, 249, .42));
  border: 1px solid rgba(148, 163, 184, .18);
}
.tv-admin-body.dark .tv-epg-guide-track,
[data-theme="dark"] .tv-epg-guide-track {
  background:
    repeating-linear-gradient(90deg, rgba(148, 163, 184, .16) 0 1px, transparent 1px 81px),
    linear-gradient(180deg, rgba(30, 41, 59, .62), rgba(15, 23, 42, .48));
}
.tv-epg-programme {
  position: absolute;
  left: var(--x, 0px);
  top: 7px;
  bottom: 7px;
  width: var(--w, 120px);
  min-width: 0;
  max-width: none;
  flex: none;
  padding: 8px 8px 7px;
  z-index: 2;
}
.tv-epg-programme strong,
.tv-epg-programme small,
.tv-epg-programme-time {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tv-epg-programme-time { display: block; white-space: nowrap; }
.tv-epg-programme strong { -webkit-line-clamp: 2; }
.tv-epg-programme[style*="--w:1px"],
.tv-epg-programme[style*="--w:2px"],
.tv-epg-programme[style*="--w:3px"],
.tv-epg-programme[style*="--w:4px"],
.tv-epg-programme[style*="--w:5px"] {
  padding-left: 2px;
  padding-right: 2px;
}
.tv-epg-timebar-row {
  position: sticky;
  top: 58px;
  z-index: 4;
}
.tv-epg-timebar-label {
  min-height: 42px;
  justify-content: center;
  color: var(--tsh-muted, #64748b);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.tv-epg-timebar {
  height: 42px;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}
.tv-admin-body.dark .tv-epg-timebar,
[data-theme="dark"] .tv-epg-timebar { background: rgba(15, 23, 42, .90); }
.tv-epg-time-tick {
  position: absolute;
  left: var(--x, 0px);
  top: 0;
  bottom: 0;
  width: 1px;
  pointer-events: none;
}
.tv-epg-time-tick i {
  position: absolute;
  top: 8px;
  bottom: 5px;
  width: 1px;
  background: rgba(148, 163, 184, .35);
}
.tv-epg-time-tick.is-major i,
.tv-epg-time-tick.is-day-start i { background: rgba(37, 99, 235, .45); }
.tv-epg-time-tick b {
  position: absolute;
  top: 4px;
  left: 6px;
  max-width: 120px;
  color: var(--text-2, #64748b);
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.tv-epg-time-tick.is-day-start b { color: var(--brand, #2563eb); }
.tv-epg-now-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--now-left, 230px);
  width: 2px;
  z-index: 6;
  background: linear-gradient(180deg, rgba(239, 68, 68, .15), rgba(239, 68, 68, .98), rgba(239, 68, 68, .15));
  box-shadow: 0 0 0 1px rgba(239, 68, 68, .16), 0 0 18px rgba(239, 68, 68, .32);
  pointer-events: none;
}
.tv-epg-now-line span {
  position: sticky;
  top: 105px;
  display: inline-flex;
  transform: translateX(7px);
  padding: 3px 7px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(239, 68, 68, .24);
}
.tv-epg-guide-row-empty {
  position: absolute;
  left: 12px;
  top: 12px;
  right: 12px;
  bottom: 12px;
  display: grid;
  place-items: center;
  padding: 0;
}
@media (max-width: 900px) {
  .tv-epg-guide-ruler { grid-template-columns: 1fr; min-width: var(--guide-total-width, 1210px); }
  .tv-epg-guide-search { width: min(420px, 100%); }
  .tv-epg-timebar-row { top: 124px; }
}

/* Hotfix 0.5.38 — guide real filtering: rows are hidden, non-matching programmes are dimmed. */
.tv-epg-guide-ruler {
  grid-template-columns: 180px minmax(260px, 1fr) minmax(520px, 760px) auto;
}
.tv-epg-guide-searches {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(240px, 1.15fr);
  gap: 8px;
  min-width: 0;
}
.tv-epg-guide-search {
  min-width: 0;
}
.tv-epg-guide-search input {
  min-width: 0;
}
.tv-epg-guide-track {
  background:
    repeating-linear-gradient(90deg, rgba(148, 163, 184, .18) 0 1px, transparent 1px var(--guide-hour-width, 243px)),
    linear-gradient(180deg, rgba(248, 250, 252, .70), rgba(241, 245, 249, .42));
}
.tv-admin-body.dark .tv-epg-guide-track,
[data-theme="dark"] .tv-epg-guide-track {
  background:
    repeating-linear-gradient(90deg, rgba(148, 163, 184, .16) 0 1px, transparent 1px var(--guide-hour-width, 243px)),
    linear-gradient(180deg, rgba(30, 41, 59, .62), rgba(15, 23, 42, .48));
}
.tv-epg-programme.is-filtered-out {
  opacity: .22;
  filter: grayscale(.75) saturate(.45);
  box-shadow: none !important;
  border-style: dashed;
  pointer-events: none;
}
.tv-epg-guide-row.is-guide-filter-hidden {
  display: none !important;
}
.tv-epg-guide-filter-empty {
  position: sticky;
  left: 12px;
  margin: 14px;
  min-height: 64px;
}
@media (max-width: 900px) {
  .tv-epg-guide-ruler { grid-template-columns: 1fr; }
  .tv-epg-guide-searches { grid-template-columns: 1fr; width: min(520px, 100%); }
  .tv-epg-guide-search { width: 100%; }
}

/* Hotfix 0.5.42 — Guide 24h window navigation + fixed filter toolbar. */
.tv-epg-guide {
  max-height: none;
  overflow: visible;
  display: grid;
  gap: 10px;
  padding-bottom: 0;
}
.tv-epg-guide-ruler {
  position: sticky;
  top: 0;
  z-index: 20;
  min-width: 0;
  width: 100%;
  grid-template-columns: minmax(180px, .8fr) auto minmax(420px, 1.7fr) auto;
  box-sizing: border-box;
}
.tv-epg-guide-ruler-main {
  min-width: 0;
}
.tv-epg-guide-ruler-main strong,
.tv-epg-guide-ruler-main span,
.tv-epg-guide-ruler-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tv-epg-guide-ruler-main small {
  margin-top: 2px;
  color: var(--tsh-muted, #64748b);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.tv-epg-guide-window-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: nowrap;
}
.tv-epg-guide-window-actions .ah-btn[disabled] {
  opacity: .45;
  pointer-events: none;
}
.tv-epg-guide-scroll {
  max-height: min(76vh, 860px);
  overflow: auto;
  padding-bottom: 12px;
  border-radius: 18px;
  scrollbar-width: thin;
  scroll-behavior: smooth;
}
.tv-epg-guide-scroll .tv-epg-guide-grid {
  padding-top: 0;
}
.tv-epg-guide-scroll .tv-epg-timebar-row {
  top: 0;
  z-index: 8;
}
.tv-epg-guide-scroll .tv-epg-now-line span {
  top: 48px;
}
@media (max-width: 1100px) {
  .tv-epg-guide-ruler {
    grid-template-columns: 1fr;
  }
  .tv-epg-guide-window-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .tv-epg-guide-searches {
    grid-template-columns: 1fr;
    width: min(520px, 100%);
  }
}

/* Iteration 6A/6B - Media Hub */
.tv-media-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}.tv-media-toolbar strong{display:block;font-size:1.05rem}.tv-media-toolbar small{display:block;color:var(--muted,#8ea0b8);margin-top:4px}.tv-media-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tv-media-actions .tsh-input{min-width:220px}.tv-media-grid{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:16px}.tv-media-side,.tv-media-main{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;min-width:0}.tv-media-side h3,.tv-media-main h3{margin:0 0 10px}.tv-media-list{display:flex;flex-direction:column;gap:6px;max-height:62vh;overflow:auto}.tv-media-filter{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:inherit;border-radius:12px;padding:8px 10px;text-align:left;cursor:pointer}.tv-media-filter:hover{background:rgba(255,255,255,.08)}.tv-media-filter small{color:var(--muted,#8ea0b8)}.tv-media-now{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(0,0,0,.18)}.tv-media-now small{color:var(--muted,#8ea0b8);margin-left:8px}#mediaAudio{display:block;width:100%;margin:0 0 12px}.tv-media-tracks{display:flex;flex-direction:column;gap:8px}.tv-media-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:14px;padding:9px}.tv-media-row strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tv-media-row small{display:block;color:var(--muted,#8ea0b8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tv-media-pill{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);border-radius:999px;padding:4px 8px;font-size:.78rem;color:var(--muted,#8ea0b8)}.tv-media-empty{color:var(--muted,#8ea0b8);padding:16px;border:1px dashed rgba(255,255,255,.12);border-radius:14px}.media-library-form{margin-bottom:16px}.media-library-form label{display:flex;flex-direction:column;gap:5px}.media-library-form .checkline{flex-direction:row;align-items:center;margin-top:22px}@media (max-width: 900px){.tv-media-grid{grid-template-columns:1fr}.tv-media-row{grid-template-columns:1fr}.tv-media-actions .tsh-input{min-width:0;width:100%}}

/* 0.5.52 audio spectrum + channel recovery */
.tv-preview-player-shell{position:relative;min-height:320px}
.tv-audio-spectrum{display:block;width:100%;height:220px;background:radial-gradient(circle at 50% 74%,rgba(46,181,255,.18),transparent 40%),radial-gradient(circle at 50% 94%,rgba(27,247,255,.10),transparent 28%),linear-gradient(180deg,#040816,#020307);border-radius:14px}
.tv-preview-spectrum{width:100%;height:auto;aspect-ratio:16/9;border-radius:0}
.tv-spectrum-shell{position:relative;overflow:hidden;border:1px solid rgba(94,214,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px rgba(0,0,0,.28);border-radius:16px;margin:0 0 12px;background:linear-gradient(180deg,#050914,#02040a)}
.tv-spectrum-shell.compact .tv-audio-spectrum{height:170px}
.tv-spectrum-label{position:absolute;top:12px;left:14px;padding:5px 9px;border-radius:999px;background:rgba(5,9,20,.74);border:1px solid rgba(94,214,255,.28);font-size:10px;letter-spacing:.14em;color:#8fe8ff}
.tv-preview-unavailable{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px;text-align:center;background:radial-gradient(circle at 50% 42%,rgba(73,110,190,.2),transparent 48%),rgba(3,6,13,.94)}
.tv-preview-unavailable[hidden]{display:none}.tv-preview-unavailable strong{font-size:1.25rem}.tv-preview-unavailable span{color:var(--tsh-muted,#94a3b8);max-width:520px}.tv-preview-unavailable .ah-btn{margin-top:6px}

/* 0.5.53 WebUI real-audio spectrum lifecycle */
.tv-audio-spectrum[hidden],
.tv-spectrum-shell[hidden],
#previewSpectrumShell[hidden],
#previewSpectrum[hidden],
#mediaSpectrumShell[hidden],
#mediaSpectrum[hidden]{display:none!important}
.tv-preview-spectrum-shell{width:100%;margin:0;border-radius:0;min-height:320px;aspect-ratio:16/9;background:radial-gradient(circle at 50% 72%,rgba(46,181,255,.18),transparent 42%),radial-gradient(circle at 50% 92%,rgba(27,247,255,.10),transparent 30%),linear-gradient(180deg,#040816,#020307)}
.tv-preview-spectrum-shell .tv-preview-spectrum{display:block;width:100%;height:100%;min-height:320px;aspect-ratio:auto}
.tv-preview-player-shell[data-media-kind="AUDIO"] .tv-preview-hint{position:absolute;left:14px;right:14px;bottom:12px;z-index:2;background:rgba(3,6,13,.72);border-radius:10px;padding:8px 10px}
.tv-preview-player-shell[data-media-kind="CAMERA"] #previewSpectrumShell,
.tv-preview-player-shell[data-media-kind="HLS"] #previewSpectrumShell,
.tv-preview-player-shell[data-media-kind="RECORDING"] #previewSpectrumShell,
.tv-preview-player-shell[data-media-kind="IDLE"] #previewSpectrumShell{display:none!important}
