/* ===== admin-overrides.css =====
   Non-responsive admin layout overrides and version-specific additions.
   For @media responsive rules see buttons.css and mobile.css.
*/
body:not(.tv-body) .modern-screen-emergency-modal .screen-emergency-modal-actions {
  flex: 0 0 auto !important;
  overflow: visible !important;
  min-height: 0 !important;
  max-height: none !important;
}

body:not(.tv-body) .modal:has(.screen-upsert-form) {
  overflow: hidden !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url {
  flex: 0 0 auto !important;
  min-height: auto !important;
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: hidden !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url code,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url code {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url .btn,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url .btn {
  flex: 0 0 auto !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-form {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
body:not(.tv-body) .screen-upsert-form .screen-upsert-actions {
  flex: 0 0 auto !important;
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: visible !important;
  min-height: 0 !important;
  max-height: none !important;
}
body:not(.tv-body) .screen-upsert-form .screen-upsert-actions .btn {
  overflow: visible !important;
}

body:not(.tv-body) .modern-screen-emergency-modal .screen-emergency-modal-layout,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-form {
  scrollbar-width: thin;
  scrollbar-color: rgba(44,92,113,.32) transparent;
}
body:not(.tv-body) .modern-screen-emergency-modal .screen-emergency-modal-layout::-webkit-scrollbar,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-form::-webkit-scrollbar {
  width: 8px;
}
body:not(.tv-body) .modern-screen-emergency-modal .screen-emergency-modal-layout::-webkit-scrollbar-thumb,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-form::-webkit-scrollbar-thumb {
  background: rgba(44,92,113,.32);
  border-radius: 999px;
}


html:has(body:not(.tv-body) #appView:not(.hidden)) {
  height: 100%;
  overflow: hidden !important;
}
body:not(.tv-body):has(#appView:not(.hidden)) {
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
}
body:not(.tv-body) #appView.app-shell:not(.hidden) {
  height: 100vh !important;
  min-height: 0 !important;
  max-height: 100vh !important;
  overflow: hidden !important;
}
body:not(.tv-body) #appView.app-shell:not(.hidden) .main-area {
  height: 100vh !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
body:not(.tv-body) #appView.app-shell:not(.hidden) .sidebar {
  flex: 0 0 auto !important;
}

/* Login screen may still scroll on very small screens. */
body:not(.tv-body):has(#loginView:not(.hidden)) {
  overflow: auto !important;
  height: auto !important;
  min-height: 100vh !important;
}
html:has(body:not(.tv-body) #loginView:not(.hidden)) {
  overflow: auto !important;
}


body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-intro {
  flex: 0 0 auto !important;
  min-height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: visible !important;
  padding: 11px 12px !important;
  margin: 12px 16px 8px !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-intro > span,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-intro > div {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-intro > div {
  flex: 1 1 auto;
  min-width: 0;
}


body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url,
body:not(.tv-body) .modal:has(.screen-upsert-form) > .edit-screen-url {
  flex: 0 0 auto !important;
  overflow: visible !important;
  padding: 9px 11px !important;
}
body:not(.tv-body) .modal:has(.screen-upsert-form) > .screen-upsert-form {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Playlist page popup workflow and delete modal polish */
body:not(.tv-body) .playlist-workspace {
  grid-template-columns: 286px minmax(0, 1fr);
}

body:not(.tv-body) .playlist-list-card .section-title {
  margin-bottom: 10px;
}

body:not(.tv-body) .playlist-select-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px;
  border-radius: 15px;
}

body:not(.tv-body) .playlist-select-card:hover {
  transform: translateY(-1px);
  background: rgba(232,241,244,.86) !important;
}

body:not(.tv-body) .playlist-card-main {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 4px;
  margin: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  text-align: left;
  cursor: pointer;
  min-width: 0;
}

body:not(.tv-body) .playlist-card-main > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: rgba(44,92,113,.10);
  color: var(--primary-dark);
}

body:not(.tv-body) .playlist-select-card.active .playlist-card-main > span {
  background: var(--primary-dark);
  color: #fff;
}

body:not(.tv-body) .playlist-card-main b,
body:not(.tv-body) .playlist-card-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.tv-body) .playlist-card-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

body:not(.tv-body) .btn.tiny {
  min-height: 30px;
  width: 30px;
  padding: 0;
  border-radius: 10px;
  justify-content: center;
}

body:not(.tv-body) .btn.tiny .icon {
  width: 14px;
  height: 14px;
}

body:not(.tv-body) .playlist-editor {
  gap: 12px;
}

body:not(.tv-body) .playlist-selected-summary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  background: linear-gradient(135deg, #ffffff, #f7fbfc);
  border: 1px solid rgba(44,92,113,.14);
}

body:not(.tv-body) .playlist-selected-copy .section-title {
  margin-bottom: 5px;
}

body:not(.tv-body) .playlist-selected-copy h2 {
  margin: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.tv-body) .playlist-selected-copy p {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

body:not(.tv-body) .playlist-selected-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
  max-width: 430px;
}

body:not(.tv-body) .playlist-selected-actions .btn {
  min-height: 34px;
}

body:not(.tv-body) .btn.soft-danger {
  background: rgba(254, 242, 242, .96);
  color: #991b1b;
  border-color: rgba(239, 68, 68, .26);
}

body:not(.tv-body) .btn.soft-danger:hover {
  background: #fee2e2;
}

body:not(.tv-body) .playlist-details-popup,
body:not(.tv-body) .playlist-delete-modal {
  display: grid;
  gap: 13px;
  padding: 14px;
}

body:not(.tv-body) .playlist-popup-intro,
body:not(.tv-body) .playlist-delete-warning {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(232,241,244,.95), rgba(255,255,255,.96));
  border: 1px solid rgba(44,92,113,.14);
}

body:not(.tv-body) .playlist-popup-intro > span,
body:not(.tv-body) .playlist-delete-warning > span {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(44,92,113,.12);
  color: var(--primary-dark);
}

body:not(.tv-body) .playlist-delete-warning {
  background: linear-gradient(135deg, #fff1f2, #fff7ed);
  border-color: rgba(239,68,68,.22);
}

body:not(.tv-body) .playlist-delete-warning > span {
  color: #b91c1c;
  background: rgba(239,68,68,.12);
}

body:not(.tv-body) .playlist-popup-intro b,
body:not(.tv-body) .playlist-delete-warning b {
  display: block;
  color: var(--text);
  font-size: 14px;
  font-weight: 650;
}

body:not(.tv-body) .playlist-popup-intro small,
body:not(.tv-body) .playlist-delete-warning small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
  line-height: 1.45;
}

body:not(.tv-body) .playlist-details-form {
  display: grid;
  gap: 10px;
}

body:not(.tv-body) .playlist-popup-actions,
body:not(.tv-body) .playlist-delete-actions {
  margin-top: 2px;
  justify-content: flex-end;
}

body:not(.tv-body) .playlist-delete-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body:not(.tv-body) .playlist-delete-facts span {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

body:not(.tv-body) .playlist-delete-screen-list {
  padding: 11px 12px;
  border-radius: 13px;
  background: #fff7ed;
  border: 1px solid rgba(245,158,11,.28);
}

body:not(.tv-body) .playlist-delete-screen-list.safe {
  background: rgba(232,241,244,.65);
  border-color: rgba(44,92,113,.12);
}

body:not(.tv-body) .playlist-delete-screen-list b {
  display: block;
  font-size: 12px;
  font-weight: 650;
  color: var(--text);
}

body:not(.tv-body) .playlist-delete-screen-list p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

body:not(.tv-body) .modal:has(.playlist-details-popup),
body:not(.tv-body) .modal:has(.playlist-delete-modal) {
  width: min(620px, calc(100vw - 30px));
}

body:not(.tv-body) .modal:has(.playlist-details-popup) > .playlist-details-popup,
body:not(.tv-body) .modal:has(.playlist-delete-modal) > .playlist-delete-modal {
  overflow-y: auto;
}

body.modal-open { overflow: hidden; }
.modal-backdrop { overflow-y: auto; }
.modal { outline: none; }
.modal-small { width: min(520px, calc(100vw - 28px)); }
.modal-medium { width: min(760px, calc(100vw - 28px)); }
.modal-large { width: min(1040px, calc(100vw - 28px)); }
.modal-wide { width: min(1220px, calc(100vw - 28px)); }
.modal-sticky-actions,
.modal .modal-sticky-actions {
  position: sticky;
  bottom: 0;
  z-index: 4;
  margin: 8px -20px -20px;
  padding: 14px 20px 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.86), #fff 42%);
  border-top: 1px solid rgba(15,23,42,.09);
  backdrop-filter: blur(10px);
}

.action-centre-card { margin: 0 0 15px; border-color: rgba(44,92,113,.16); background: linear-gradient(180deg,#fff,#f8fbfc); }
.action-centre-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:12px; }
.action-centre-head > div { display:grid; grid-template-columns:42px minmax(0,1fr); gap:2px 10px; align-items:center; }
.action-centre-head > div > span { grid-row:1 / 3; width:42px; height:42px; border-radius:15px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#2C5C71,#3E7890); box-shadow:0 12px 26px rgba(44,92,113,.22); }
.action-centre-head h2 { margin:0; color:#0f172a; font-size:19px; letter-spacing:-.015em; }
.action-centre-head p { margin:2px 0 0; color:#64748b; font-size:13px; }
.action-centre-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.action-centre-item { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px; border-radius:16px; border:1px solid rgba(15,23,42,.08); background:#fff; box-shadow:0 10px 22px rgba(15,23,42,.045); }
.action-centre-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:13px; background:#eff6ff; color:#2563eb; }
.action-centre-item b { display:block; color:#0f172a; font-size:13px; }
.action-centre-item small { display:block; margin-top:2px; color:#64748b; line-height:1.35; }
.action-centre-item.warning { border-color:#fde68a; background:#fffbeb; }
.action-centre-item.warning .action-centre-icon { background:#fef3c7; color:#b45309; }
.action-centre-item.danger { border-color:#fecaca; background:#fff1f2; }
.action-centre-item.danger .action-centre-icon { background:#fee2e2; color:#dc2626; }
.action-centre-item.ok { border-color:#bbf7d0; background:#f0fdf4; }
.action-centre-item.ok .action-centre-icon { background:#dcfce7; color:#16a34a; }
.action-centre-item.info .action-centre-icon { background:#e0f2fe; color:#0284c7; }

.screens-toolbar.upgraded { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:start; padding:14px; border:1px solid rgba(44,92,113,.14); border-radius:20px; background:linear-gradient(135deg,#ffffff,#f8fbfc); box-shadow:0 10px 24px rgba(15,23,42,.04); }
.screens-search-panel { display:grid; grid-template-columns:minmax(240px,1fr) minmax(165px,.34fr) minmax(175px,.36fr); gap:10px; }
.screens-search-wrap { min-width:0; }
.screens-view-toggle { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
.screens-toolbar.upgraded .screens-tip { grid-column:1 / -1; margin:0; }
.screen-filter-summary { margin:12px 2px -4px; color:#64748b; font-size:12px; font-weight:600; letter-spacing:.02em; }
.screen-cards-grid.compact-view { grid-template-columns:1fr; }
.screen-cards-grid.compact-view .screen-card { display:grid; grid-template-columns:minmax(230px,.8fr) minmax(260px,1.15fr) auto; align-items:center; gap:12px; }
.screen-cards-grid.compact-view .screen-card-url { grid-column:1 / 3; }
.screen-cards-grid.compact-view .screen-card-info-grid { grid-column:1 / 3; grid-template-columns:repeat(3,minmax(0,1fr)); }
.screen-cards-grid.compact-view .screen-card-action-row { grid-column:3; grid-row:1 / 4; align-self:stretch; justify-content:flex-end; align-content:center; }
.screen-card-action-row.simplified { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.screen-action-menu { position:relative; display:inline-flex; }
.screen-action-dropdown { display:none; position:absolute; right:0; top:calc(100% + 7px); min-width:220px; z-index:20; padding:7px; border-radius:14px; border:1px solid rgba(15,23,42,.12); background:#fff; box-shadow:0 18px 38px rgba(15,23,42,.18); }
.screen-action-menu.open .screen-action-dropdown { display:grid; gap:4px; }
.screen-action-dropdown button { width:100%; border:0; background:transparent; border-radius:10px; padding:9px 10px; display:flex; align-items:center; gap:8px; color:#334155; font-weight:600; cursor:pointer; text-align:left; }
.screen-action-dropdown button:hover { background:#f1f5f9; color:#0f172a; }
.screen-action-dropdown button.danger { color:#dc2626; }
.screen-action-dropdown button.danger:hover { background:#fff1f2; }
.warning-text { border-color:#fde68a !important; background:#fffbeb !important; }
.warning-text .icon, .warning-text b { color:#b45309 !important; }

.screen-wizard-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:0 20px 3px; }
.screen-wizard-step-btn { border:1px solid rgba(15,23,42,.10); background:#fff; border-radius:16px; padding:10px; display:flex; gap:10px; align-items:center; cursor:pointer; text-align:left; transition:.18s ease; }
.screen-wizard-step-btn:hover { transform:translateY(-1px); box-shadow:0 10px 20px rgba(15,23,42,.07); }
.screen-wizard-step-btn b { width:30px; height:30px; border-radius:11px; display:grid; place-items:center; color:#2C5C71; background:#E8F1F4; flex:0 0 auto; }
.screen-wizard-step-btn span { display:grid; gap:1px; font-weight:600; color:#0f172a; font-size:13px; }
.screen-wizard-step-btn small { color:#64748b; font-size:11px; font-weight:700; }
.screen-wizard-step-btn.active { border-color:rgba(44,92,113,.30); background:linear-gradient(135deg,#f8fbfc,#eef6f8); box-shadow:0 14px 24px rgba(44,92,113,.10); }
.screen-wizard-step-btn.active b { color:#fff; background:linear-gradient(135deg,#2C5C71,#3E7890); }
.screen-wizard-form .wizard-step { display:none; }
.screen-wizard-form .wizard-step.active { display:block; animation:screenWizardIn .18s ease both; }
@keyframes screenWizardIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
.screen-review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.screen-review-card { padding:13px; border-radius:16px; background:#f8fafc; border:1px solid rgba(15,23,42,.08); min-width:0; }
.screen-review-card b { display:flex; align-items:center; gap:8px; color:#21485A; margin-bottom:6px; }
.screen-review-card small { display:block; color:#64748b; line-height:1.45; }
.screen-review-card code { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:8px; border-radius:10px; background:#fff; border:1px solid rgba(15,23,42,.08); color:#0f172a; }
.setting-toggle.inline { margin:0; }

.android-tv-control-modal { display:grid; gap:14px; }
.android-tv-panel { display:grid; gap:14px; }
.dashboard-android-tv-actions { flex-wrap:wrap; gap:8px; }

.asset-usage-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(44,92,113,.16);background:#f8fbfc;color:#21485A;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:600;cursor:pointer;max-width:100%;}
.asset-usage-pill:hover{background:#eef6f8;border-color:rgba(44,92,113,.28)}
.asset-used{box-shadow:0 1px 0 rgba(16,185,129,.08)}
.asset-unused{outline:1px dashed rgba(245,158,11,.25);outline-offset:-4px}
.asset-unused .asset-usage-pill{background:#fff7ed;color:#92400e;border-color:rgba(245,158,11,.24)}
.asset-usage-modal,.url-edit-modal,.playlist-preview-modal{display:flex;flex-direction:column;gap:14px;min-width:min(640px,calc(100vw - 44px));}
.asset-usage-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:16px;background:#f8fbfc;border:1px solid rgba(44,92,113,.12)}
.usage-list{display:grid;gap:8px;max-height:48vh;overflow:auto;padding-right:3px}.usage-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(15,23,42,.08);background:#fff;border-radius:13px;padding:10px 12px}.usage-item b{color:#0f172a}.usage-item small{color:#64748b}.usage-empty{padding:18px;border-radius:16px;background:#fff7ed;border:1px solid rgba(245,158,11,.22);color:#92400e;font-weight:600}.url-preview-box{border:1px solid rgba(44,92,113,.14);background:#f8fbfc;border-radius:14px;padding:10px 12px;word-break:break-word;color:#21485A;font-size:12px}
.playlist-timeline-card{margin:14px 0;border:1px solid rgba(44,92,113,.13);background:linear-gradient(180deg,#fff,#f8fbfc);border-radius:20px;padding:14px;box-shadow:0 10px 30px rgba(15,23,42,.04)}
.playlist-timeline-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px}.playlist-timeline-head b{display:block;color:#0f172a}.playlist-timeline-head small{color:#64748b}.timeline-meta{display:flex;flex-wrap:wrap;gap:7px}.timeline-meta span,.timeline-hint{border:1px solid rgba(44,92,113,.13);background:#f8fbfc;border-radius:999px;padding:5px 9px;color:#21485A;font-size:11px;font-weight:600}.playlist-timeline-bar{display:flex;width:100%;height:38px;border-radius:999px;overflow:hidden;background:#eef6f8;border:1px solid rgba(44,92,113,.12)}.timeline-segment{display:grid;place-items:center;min-width:42px;padding:0 6px;background:linear-gradient(135deg,rgba(44,92,113,.86),rgba(44,92,113,.56));color:#fff;font-size:11px;font-weight:600;white-space:nowrap;border-right:1px solid rgba(255,255,255,.35)}.timeline-segment:nth-child(2n){background:linear-gradient(135deg,rgba(15,118,110,.82),rgba(15,118,110,.52))}.timeline-empty{width:100%;box-sizing:border-box;padding:18px;border-radius:16px;background:#f8fbfc;border:1px dashed rgba(44,92,113,.2);color:#64748b;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;font-weight:700;min-height:72px}.timeline-empty .icon{width:18px;height:18px;flex:0 0 auto;color:#2C5C71}.playlist-preview-summary{display:grid;gap:12px}.playlist-preview-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.playlist-preview-facts span{padding:10px;border:1px solid rgba(44,92,113,.12);border-radius:14px;background:#f8fbfc}.playlist-preview-facts b{display:block;color:#21485A}.assigned-tv-strip{display:flex;gap:6px;flex-wrap:wrap}.assigned-tv-strip span{border-radius:999px;background:#eef6f8;color:#21485A;font-weight:600;font-size:11px;padding:5px 9px}.playlist-preview-list{display:grid;gap:8px;max-height:50vh;overflow:auto}.playlist-preview-item{display:grid;grid-template-columns:auto 52px 1fr auto;gap:10px;align-items:center;padding:9px;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:#fff}.preview-index{font-weight:600;color:#21485A}.preview-thumb{width:52px;height:36px;border-radius:9px;object-fit:cover;background:#eef2f7;display:grid;place-items:center;color:#64748b}.preview-copy b{display:block;color:#0f172a}.preview-copy small{color:#64748b}
.emergency-template-card{margin-bottom:16px}.emergency-template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.emergency-template-chip{display:flex;align-items:flex-start;gap:10px;text-align:left;border:1px solid rgba(44,92,113,.14);background:#fff;border-radius:16px;padding:12px;cursor:pointer;transition:.15s ease}.emergency-template-chip:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(15,23,42,.08);border-color:rgba(44,92,113,.28)}.emergency-template-chip b{display:block;color:#0f172a}.emergency-template-chip small{color:#64748b}.test-emergency-row{display:grid;grid-template-columns:minmax(180px,1fr) auto;gap:10px;align-items:end;margin-top:12px;padding:12px;border:1px solid rgba(44,92,113,.12);border-radius:16px;background:#f8fbfc}.danger-confirm-box{border:1px solid rgba(220,38,38,.22);background:#fff1f2;color:#991b1b;border-radius:16px;padding:14px;font-weight:600}.danger-confirm-box small{display:block;margin-top:5px;color:#7f1d1d;font-weight:600}
.ticker-speed-row{display:grid;grid-template-columns:1fr 96px;gap:10px;align-items:center}.ticker-speed-row input[type=range]{accent-color:#2C5C71}.ticker-schedule-row{margin-top:14px;border:1px solid rgba(44,92,113,.12);background:#f8fbfc;border-radius:16px;padding:12px}.ticker-schedule-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.ticker-days-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.ticker-day-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(44,92,113,.16);background:#fff;border-radius:999px;padding:6px 9px;color:#21485A;font-size:12px;font-weight:600}.ticker-day-chip input{accent-color:#2C5C71}.ticker-preview-scroll{display:inline-flex;align-items:center;gap:.35em;white-space:nowrap;padding-left:100%;animation:tickerScroll var(--ticker-speed,32s) linear infinite}.ticker-preview-scroll p,.ticker-preview-scroll div{display:inline;margin:0}
.settings-dirty-flag{display:none;align-items:center;gap:7px;border:1px solid rgba(245,158,11,.24);background:#fff7ed;color:#92400e;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:600}.settings-page.is-dirty .settings-dirty-flag{display:inline-flex}.settings-panel-save{margin-top:14px;display:flex;justify-content:flex-end;gap:8px;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.72),#fff);padding:10px 0 0;border-top:1px solid rgba(15,23,42,.06)}

body:not(.tv-body) {
  --admin-compact-gap: 10px;
  --admin-control-height: 38px;
  --admin-card-pad: 14px;
  --admin-button-border: #cbd5e1;
}

/* Buttons: white buttons must be visible on every page */
body:not(.tv-body) .btn,
body:not(.tv-body) button.btn,
body:not(.tv-body) a.btn {
  min-height: var(--admin-control-height);
  border: 1.5px solid var(--admin-button-border) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  color: #0f172a !important;
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(15,23,42,.06);
}
body:not(.tv-body) .btn:hover,
body:not(.tv-body) button.btn:hover,
body:not(.tv-body) a.btn:hover {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%) !important;
  border-color: #94a3b8 !important;
  color: #0b1220 !important;
}
body:not(.tv-body) .btn.primary,
body:not(.tv-body) button.btn.primary,
body:not(.tv-body) a.btn.primary {
  color: #ffffff !important;
  border-color: #21485A !important;
  background: linear-gradient(135deg, #21485A, #2C5C71) !important;
  box-shadow: 0 8px 18px rgba(44,92,113,.22);
}
body:not(.tv-body) .btn.primary.soft {
  color: #21485A !important;
  background: #E8F1F4 !important;
  border-color: #A9C7D2 !important;
}
body:not(.tv-body) .btn.danger,
body:not(.tv-body) button.btn.danger {
  color: #ffffff !important;
  border-color: #dc2626 !important;
  background: linear-gradient(135deg, #dc2626, #ef4444) !important;
}
body:not(.tv-body) .btn.warning,
body:not(.tv-body) button.btn.warning {
  color: #ffffff !important;
  border-color: #d97706 !important;
  background: linear-gradient(135deg, #d97706, #f59e0b) !important;
}
body:not(.tv-body) .btn.ghost {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
body:not(.tv-body) .quick-action-grid .btn,
body:not(.tv-body) .dashboard-actions .btn,
body:not(.tv-body) .hero-actions .btn,
body:not(.tv-body) .settings-actions .btn {
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #0f172a !important;
}
body:not(.tv-body) .quick-action-grid .btn.primary,
body:not(.tv-body) .dashboard-actions .btn.primary,
body:not(.tv-body) .hero-actions .btn.primary,
body:not(.tv-body) .settings-actions .btn.primary {
  color: #fff !important;
  background: linear-gradient(135deg, #21485A, #2C5C71) !important;
  border-color: #21485A !important;
}

/* Login page readability */
#loginView .login-brand-tagline,
#loginView .login-brand-feature,
#loginView .login-brand-content p,
#loginView .login-brand-content small {
  color: rgba(255,255,255,.88) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.28);
}
#loginView #loginTitle,
#loginView .login-kicker,
#loginView .login-subtitle,
#loginView .login-security-note,
#loginView .login-security-note p {
  color: #0f172a !important;
}
#loginView .login-subtitle { color: #334155 !important; }

/* Unified inputs: same height, clear borders, aligned labels */
body:not(.tv-body) .form-row { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
body:not(.tv-body) .form-row label { min-height: 18px; line-height: 1.25; color: #334155; font-weight: 600 !important; }
body:not(.tv-body) .input,
body:not(.tv-body) .select,
body:not(.tv-body) select.select,
body:not(.tv-body) select.input,
body:not(.tv-body) input.input {
  min-height: var(--admin-control-height) !important;
  height: var(--admin-control-height) !important;
  padding: 8px 11px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #0f172a !important;
  line-height: 1.25 !important;
  box-shadow: inset 0 1px 1px rgba(15,23,42,.02);
}
body:not(.tv-body) textarea.textarea,
body:not(.tv-body) .textarea {
  min-height: 78px !important;
  height: auto !important;
  padding: 9px 11px !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 12px !important;
}
body:not(.tv-body) .grid,
body:not(.tv-body) .grid-2,
body:not(.tv-body) .grid-3,
body:not(.tv-body) .screen-upsert-grid,
body:not(.tv-body) .screen-upsert-grid.two {
  align-items: start !important;
  gap: var(--admin-compact-gap) !important;
}
body:not(.tv-body) .screen-upsert-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body:not(.tv-body) .screen-upsert-grid.two .form-row { width: 100%; }
body:not(.tv-body) .screen-upsert-grid.two .select { width: 100%; }

/* Compact admin layout: reduce big empty spaces without making it cramped */
body:not(.tv-body) .main { padding: 12px 14px 24px !important; }
body:not(.tv-body) .topbar { margin-bottom: 12px !important; padding: 10px 12px !important; }
body:not(.tv-body) .card,
body:not(.tv-body) .settings-hero,
body:not(.tv-body) .screens-hero,
body:not(.tv-body) .media-hero,
body:not(.tv-body) .playlist-hero,
body:not(.tv-body) .emergency-hero,
body:not(.tv-body) .ticker-hero {
  padding: var(--admin-card-pad) !important;
  border-radius: 18px !important;
}
body:not(.tv-body) .section-title { margin-bottom: 8px !important; gap: 8px !important; }
body:not(.tv-body) .section-title h2 { font-size: 17px !important; line-height: 1.2 !important; }
body:not(.tv-body) .help,
body:not(.tv-body) .field-help,
body:not(.tv-body) .field-hint { font-size: 12px !important; line-height: 1.4 !important; }
body:not(.tv-body) .settings-layout,
body:not(.tv-body) .emergency-grid,
body:not(.tv-body) .playlist-workspace,
body:not(.tv-body) .ticker-layout { gap: 12px !important; }

/* Settings: compact sections and a working visible section save footer */
body:not(.tv-body) .settings-category-grid { gap: 8px !important; }
body:not(.tv-body) .settings-category-card { padding: 10px !important; border-radius: 14px !important; min-height: 58px !important; }
body:not(.tv-body) .settings-category-icon { width: 34px !important; height: 34px !important; border-radius: 12px !important; }
body:not(.tv-body) .settings-panel-head {
  padding: 11px 12px !important;
  border-radius: 16px 16px 0 0 !important;
}
body:not(.tv-body) .settings-panel-head > div:first-child { grid-template-columns: 34px minmax(0,1fr) !important; column-gap: 9px !important; }
body:not(.tv-body) .settings-panel-head > div:first-child > span { width: 34px !important; height: 34px !important; border-radius: 12px !important; }
body:not(.tv-body) .settings-panel-head h3 { font-size: 16px !important; }
body:not(.tv-body) .settings-panel-head p { font-size: 12px !important; margin-top: 2px !important; }
body:not(.tv-body) .settings-form-card,
body:not(.tv-body) .settings-panel > .settings-option-grid {
  padding: 12px !important;
  border-radius: 0 0 16px 16px !important;
  box-shadow: 0 5px 16px rgba(15,23,42,.04) !important;
}
body:not(.tv-body) .settings-panel-save {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 20 !important;
  margin-top: 10px !important;
  padding: 9px 0 0 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.65), #fff 42%) !important;
  align-items: center !important;
}
body:not(.tv-body) .settings-panel-save .help { margin-right: auto; }

/* TV Screens: More menu must appear above card frame */
body:not(.tv-body) .screen-cards-grid,
body:not(.tv-body) #screenCardsGrid,
body:not(.tv-body) .screen-card,
body:not(.tv-body) .screen-card-action-row { overflow: visible !important; }
body:not(.tv-body) .screen-card { position: relative; z-index: 1; }
body:not(.tv-body) .screen-card:has(.screen-action-menu.open) { z-index: 80; }
body:not(.tv-body) .screen-action-menu { position: relative; z-index: 90; }
body:not(.tv-body) .screen-action-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 9999 !important;
  min-width: 218px;
  max-width: min(280px, calc(100vw - 32px));
  background: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(15,23,42,.20);
  padding: 6px;
  display: none;
}
body:not(.tv-body) .screen-action-menu.open .screen-action-dropdown { display: grid !important; }
body:not(.tv-body) .screen-action-dropdown button {
  min-height: 36px;
  padding: 8px 10px;
  border: 0;
  background: transparent;
  border-radius: 10px;
  display: flex;
  gap: 8px;
  align-items: center;
  color: #0f172a;
  font-weight: 600;
  text-align: left;
}
body:not(.tv-body) .screen-action-dropdown button:hover { background: #f1f5f9; }
body:not(.tv-body) .screen-action-dropdown button.danger { color: #b91c1c; }
body:not(.tv-body) .screen-card-action-row.simplified { align-items: center; }

/* Playlist timeline alignment */
body:not(.tv-body) .playlist-timeline-card { padding: 12px !important; }
body:not(.tv-body) .playlist-timeline-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center !important;
  gap: 10px !important;
}
body:not(.tv-body) .playlist-timeline-head > div:first-child { min-width: 0; }
body:not(.tv-body) .playlist-timeline-head b { display: flex !important; align-items: center; gap: 7px; line-height: 1.2; }
body:not(.tv-body) .playlist-timeline-head small { display: block; margin-top: 2px; line-height: 1.25; }
body:not(.tv-body) .timeline-meta { justify-content: flex-end; align-items: center; }
body:not(.tv-body) .playlist-timeline-bar { height: 34px !important; }
body:not(.tv-body) .timeline-segment { min-width: 38px; font-size: 10.5px; }

/* Emergency templates: selected template is visible */
body:not(.tv-body) .emergency-template-chip.active,
body:not(.tv-body) .emergency-template-chip[aria-pressed="true"] {
  border-color: #2C5C71 !important;
  background: #E8F1F4 !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.12), 0 12px 26px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .emergency-template-chip.active b { color: #21485A !important; }
body:not(.tv-body) .emergency-template-chip.active::after {
  content: "Selected";
  margin-left: auto;
  align-self: center;
  border-radius: 999px;
  background: #2C5C71;
  color: #fff;
  padding: 3px 7px;
  font-size: 10px;
  font-weight: 600;
}

/* Bottom ticker: keep rolling speed and schedule controls inside the frame */
body:not(.tv-body) .ticker-layout,
body:not(.tv-body) .ticker-control-grid,
body:not(.tv-body) .ticker-custom-grid { min-width: 0; }
body:not(.tv-body) .ticker-speed-row,
body:not(.tv-body) .ticker-height-row,
body:not(.tv-body) .ticker-schedule-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .height-control-card,
body:not(.tv-body) .ticker-height-card {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 92px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px !important;
}
body:not(.tv-body) .height-control-card input[type="range"] { min-width: 0 !important; width: 100% !important; }
body:not(.tv-body) .height-number-wrap { min-width: 0 !important; }
body:not(.tv-body) .height-number-wrap .mini-number { width: 62px !important; min-width: 0 !important; }
body:not(.tv-body) .ticker-schedule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
body:not(.tv-body) .ticker-days-row { gap: 6px !important; }
body:not(.tv-body) .ticker-day-chip { padding: 5px 8px !important; }

/* Better delete/confirmation modal */
body:not(.tv-body) .confirm-dialog { display: grid; gap: 12px; }
body:not(.tv-body) .confirm-dialog-body { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 12px; align-items: start; }
body:not(.tv-body) .confirm-dialog-icon { width: 44px; height: 44px; border-radius: 15px; display: grid; place-items: center; background: #fef2f2; color: #dc2626; }
body:not(.tv-body) .confirm-dialog-icon.warning { background: #fffbeb; color: #d97706; }
body:not(.tv-body) .confirm-dialog-icon.primary { background: #E8F1F4; color: #21485A; }
body:not(.tv-body) .confirm-dialog-title { margin: 0; font-size: 18px; line-height: 1.2; color: #0f172a; }
body:not(.tv-body) .confirm-dialog-message { margin: 5px 0 0; color: #475569; line-height: 1.45; }
body:not(.tv-body) .confirm-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 10px; border-top: 1px solid #e2e8f0; }

body:not(.tv-body) .compact-page-hero {
  padding: 14px 16px !important;
  min-height: auto !important;
}
body:not(.tv-body) .compact-page-hero h2 { margin: 2px 0 4px !important; }
body:not(.tv-body) .compact-page-hero p { max-width: 760px; font-size: 12.5px !important; }

/* Emergency template selected badge must never push text outside frame */
body:not(.tv-body) .emergency-template-grid {
  grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .emergency-template-chip {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 10px !important;
  padding-right: 72px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}
body:not(.tv-body) .emergency-template-chip .icon {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .emergency-template-chip b,
body:not(.tv-body) .emergency-template-chip small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.15 !important;
}
body:not(.tv-body) .emergency-template-chip b { font-size: 12px !important; }
body:not(.tv-body) .emergency-template-chip small { font-size: 10.5px !important; }
body:not(.tv-body) .emergency-template-chip.active::after,
body:not(.tv-body) .emergency-template-chip[aria-pressed="true"]::after {
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-left: 0 !important;
  max-width: 58px !important;
  box-sizing: border-box !important;
  padding: 3px 7px !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* Bottom ticker page: compact three-column layout with preview on right */
body:not(.tv-body) .compact-ticker-form {
  max-width: none !important;
  padding: 12px !important;
  gap: 12px !important;
}
body:not(.tv-body) .compact-ticker-head {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 230px) !important;
  gap: 10px !important;
}
body:not(.tv-body) .compact-toggle-card {
  min-height: 58px !important;
  padding: 10px !important;
}
body:not(.tv-body) .compact-save-hint {
  min-width: 0 !important;
  padding: 9px 11px !important;
  border-radius: 14px !important;
}
body:not(.tv-body) .ticker-main-layout {
  display: grid !important;
  grid-template-columns: minmax(360px, 1.15fr) minmax(300px, .85fr) minmax(300px, .9fr) !important;
  gap: 12px !important;
  align-items: start !important;
}
body:not(.tv-body) .ticker-compose-column { display: grid !important; gap: 12px !important; min-width: 0 !important; }
body:not(.tv-body) .compact-ticker-panel {
  border-radius: 16px !important;
  padding: 11px !important;
  gap: 9px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .compact-ticker-panel .ticker-panel-head > span {
  width: 32px !important;
  height: 32px !important;
  border-radius: 11px !important;
}
body:not(.tv-body) .compact-ticker-panel .ticker-panel-head b { font-size: 13px !important; }
body:not(.tv-body) .compact-ticker-panel .ticker-panel-head small { font-size: 10.5px !important; }
body:not(.tv-body) .compact-editor-shell { border-radius: 13px !important; }
body:not(.tv-body) .compact-toolbar { padding: 5px !important; gap: 4px !important; }
body:not(.tv-body) .compact-toolbar button { min-height: 26px !important; padding: 4px 7px !important; font-size: 10.5px !important; }
body:not(.tv-body) .compact-ticker-editor {
  min-height: 130px !important;
  max-height: 190px !important;
  padding: 10px 11px !important;
  font-size: 13px !important;
}
body:not(.tv-body) .compact-controls-stack { gap: 8px !important; }
body:not(.tv-body) .compact-controls-stack .form-row { margin: 0 !important; gap: 5px !important; }
body:not(.tv-body) .compact-controls-stack label { font-size: 11.5px !important; }
body:not(.tv-body) .compact-mode-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}
body:not(.tv-body) .compact-mode-cards .ticker-mode-card {
  min-height: 54px !important;
  padding: 8px !important;
  border-radius: 12px !important;
}
body:not(.tv-body) .compact-mode-cards .ticker-mode-card small { display: none !important; }
body:not(.tv-body) .compact-slider-card {
  grid-template-columns: minmax(0, 1fr) 82px !important;
  padding: 7px !important;
  gap: 8px !important;
}
body:not(.tv-body) .compact-slider-card .mini-number { width: 50px !important; height: 32px !important; }
body:not(.tv-body) .compact-schedule-grid { gap: 7px !important; }
body:not(.tv-body) .compact-days-row { gap: 5px !important; }
body:not(.tv-body) .compact-days-row .ticker-day-chip { font-size: 10px !important; padding: 4px 7px !important; }
body:not(.tv-body) .compact-colour-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .ticker-preview-side {
  position: sticky !important;
  top: 76px !important;
  min-height: 320px !important;
  align-content: start !important;
}
body:not(.tv-body) .ticker-preview-tv-frame {
  min-height: 228px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #0f172a, #1e293b) !important;
  border: 8px solid #111827 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 14px 28px rgba(15,23,42,.12) !important;
  display: flex !important;
  align-items: flex-end !important;
  overflow: hidden !important;
}
body:not(.tv-body) .ticker-preview-side .ticker-preview-line {
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}
body:not(.tv-body) .ticker-preview-note {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}
body:not(.tv-body) .compact-ticker-actions { justify-content: flex-start !important; gap: 7px !important; }

/* System Settings: remove bottom save footer completely */
body:not(.tv-body) .settings-panel-save { display: none !important; }
body:not(.tv-body) .settings-page { gap: 10px !important; width: 100% !important; }
body:not(.tv-body) .settings-layout { gap: 10px !important; grid-template-columns: 280px minmax(0,1fr) !important; }
body:not(.tv-body) .settings-actions .btn { min-height: 34px !important; }
body:not(.tv-body) .settings-form-card,
body:not(.tv-body) .settings-panel > .settings-option-grid { padding: 10px !important; }
body:not(.tv-body) .setting-toggle { padding: 9px !important; min-height: 58px !important; }

/* Users page compact and better aligned */
body:not(.tv-body) .users-page { gap: 10px !important; width: 100% !important; }
body:not(.tv-body) .users-hero { padding: 14px 16px !important; }
body:not(.tv-body) .user-stats-grid { gap: 8px !important; }
body:not(.tv-body) .users-layout {
  grid-template-columns: minmax(255px, 320px) minmax(0, 1fr) !important;
  gap: 10px !important;
}
body:not(.tv-body) .create-user-card,
body:not(.tv-body) .users-list-card { padding: 12px !important; }
body:not(.tv-body) .create-user-form { gap: 6px !important; }
body:not(.tv-body) .create-user-form .form-row { margin: 0 !important; }
body:not(.tv-body) .welcome-email-toggle { padding: 8px !important; margin: 4px 0 !important; }
body:not(.tv-body) .role-choice-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 6px !important; margin: 4px 0 8px !important; }
body:not(.tv-body) .role-choice { padding: 8px !important; border-radius: 12px !important; }
body:not(.tv-body) .role-choice small { display: none !important; }
body:not(.tv-body) .users-toolbar { gap: 8px !important; margin-bottom: 8px !important; }
body:not(.tv-body) .user-permission-summary { display: none !important; }
body:not(.tv-body) .user-card-grid { grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)) !important; gap: 8px !important; }
body:not(.tv-body) .user-card { padding: 10px !important; gap: 7px !important; border-radius: 15px !important; }
body:not(.tv-body) .user-card-top { grid-template-columns: 36px minmax(0,1fr) auto !important; gap: 7px !important; }
body:not(.tv-body) .user-avatar { width: 36px !important; height: 36px !important; border-radius: 11px !important; font-size: 13px !important; }
body:not(.tv-body) .access-line { padding: 7px !important; gap: 6px !important; }
body:not(.tv-body) .access-line small { display: none !important; }
body:not(.tv-body) .user-meta { gap: 3px !important; }
body:not(.tv-body) .user-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 5px !important; }
body:not(.tv-body) .user-actions .btn { min-height: 30px !important; padding: 4px 6px !important; font-size: 10.5px !important; }

/* Media Library asset cards: organised, fitted, and consistent */
body:not(.tv-body) .asset-grid.enhanced-assets,
body:not(.tv-body) .enhanced-assets.thumb-small,
body:not(.tv-body) .enhanced-assets.thumb-medium,
body:not(.tv-body) .enhanced-assets.thumb-large {
  gap: 10px !important;
}
body:not(.tv-body) .enhanced-assets.thumb-small { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important; }
body:not(.tv-body) .enhanced-assets.thumb-medium { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; }
body:not(.tv-body) .enhanced-assets.thumb-large { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; }
body:not(.tv-body) .enhanced-asset-card {
  min-height: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background: #fff !important;
}
body:not(.tv-body) .asset-card-topbar {
  position: absolute;
  z-index: 6;
  top: 7px;
  left: 7px;
  right: 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  pointer-events: none;
}
body:not(.tv-body) .asset-card-topbar > * { pointer-events: auto; }
body:not(.tv-body) .compact-select-check,
body:not(.tv-body) .asset-card-topbar .asset-usage-pill {
  position: static !important;
  max-width: 48%;
  min-height: 25px !important;
  padding: 4px 7px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.14);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.tv-body) .compact-asset-preview { height: 132px !important; min-height: 132px !important; }
body:not(.tv-body) .thumb-small .compact-asset-preview { height: 110px !important; min-height: 110px !important; }
body:not(.tv-body) .thumb-large .compact-asset-preview { height: 160px !important; min-height: 160px !important; }
body:not(.tv-body) .compact-asset-info {
  padding: 9px !important;
  gap: 6px !important;
}
body:not(.tv-body) .asset-title-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 6px;
  align-items: center;
}
body:not(.tv-body) .asset-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid rgba(44,92,113,.14);
  background: #f1f5f9;
  border-radius: 999px;
  padding: 3px 6px;
  font-size: 9.5px;
  font-weight: 600;
  color: #21485A;
  white-space: nowrap;
}
body:not(.tv-body) .asset-type-badge .icon { width: 11px; height: 11px; }
body:not(.tv-body) .asset-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  color: #64748b;
  font-size: 10.5px;
  font-weight: 700;
}
body:not(.tv-body) .asset-detail-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .compact-asset-source {
  min-height: auto !important;
  max-height: 30px !important;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
body:not(.tv-body) .compact-asset-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px !important;
  max-height: 26px;
  overflow: hidden;
}
body:not(.tv-body) .compact-asset-tags .asset-tag { font-size: 9.5px !important; padding: 2px 6px !important; }
body:not(.tv-body) .compact-asset-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 5px !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .compact-asset-actions .btn {
  min-height: 30px !important;
  padding: 4px 6px !important;
  font-size: 10.5px !important;
  border-radius: 9px !important;
}
body:not(.tv-body) .compact-asset-actions .btn:first-child { grid-column: span 1; }

body:not(.tv-body) .media-hero .hero-actions { align-items: center !important; }
body:not(.tv-body) .media-panel-collapsed { display: none !important; }
body:not(.tv-body) .upload-panel-title {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}
body:not(.tv-body) .upload-panel-title h2 { min-width: 0 !important; margin: 0 !important; }
body:not(.tv-body) .upload-panel-title .icon-only { width: 34px !important; height: 34px !important; padding: 0 !important; justify-content: center !important; }

/* TV Screens: show More menu in the centre of its screen card */
body:not(.tv-body) .screen-card { position: relative !important; overflow: visible !important; }
body:not(.tv-body) .screen-card:has(.screen-action-menu.open) { z-index: 120 !important; }
body:not(.tv-body) .screen-action-menu { position: static !important; }
body:not(.tv-body) .screen-action-dropdown {
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  min-width: min(250px, calc(100% - 26px)) !important;
  max-width: calc(100% - 26px) !important;
  border: 1.5px solid #b7c9d3 !important;
  box-shadow: 0 20px 55px rgba(15,23,42,.24) !important;
}
body:not(.tv-body) .screen-action-dropdown::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  z-index: -1;
  backdrop-filter: blur(2px);
}

/* Emergency templates: no Selected text; active state uses border/background only, with all card text readable */
body:not(.tv-body) .emergency-template-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important; }
body:not(.tv-body) .emergency-template-chip {
  padding: 10px 11px !important;
  padding-right: 11px !important;
  min-height: 58px !important;
  overflow: visible !important;
  align-items: start !important;
}
body:not(.tv-body) .emergency-template-chip.active::after,
body:not(.tv-body) .emergency-template-chip[aria-pressed="true"]::after { content: none !important; display: none !important; }
body:not(.tv-body) .emergency-template-chip b,
body:not(.tv-body) .emergency-template-chip small {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  display: block !important;
  line-height: 1.22 !important;
}
body:not(.tv-body) .emergency-template-chip small { margin-top: 2px !important; }

/* Bottom ticker: make height/speed number controls fully visible inside the frame */
body:not(.tv-body) .compact-slider-card,
body:not(.tv-body) .height-control-card,
body:not(.tv-body) .ticker-height-card {
  grid-template-columns: minmax(0, 1fr) minmax(112px, 122px) !important;
  gap: 10px !important;
  overflow: visible !important;
  align-items: center !important;
}
body:not(.tv-body) .height-number-wrap {
  min-width: 112px !important;
  width: 100% !important;
  max-width: 122px !important;
  box-sizing: border-box !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 6px 8px !important;
  overflow: visible !important;
}
body:not(.tv-body) .height-number-wrap .mini-number,
body:not(.tv-body) input.mini-number {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
  appearance: textfield;
  -moz-appearance: textfield;
}
body:not(.tv-body) input.mini-number::-webkit-outer-spin-button,
body:not(.tv-body) input.mini-number::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
body:not(.tv-body) .height-number-wrap span { flex: 0 0 auto !important; min-width: 24px !important; text-align: right !important; }

body:not(.tv-body) .search-wrap { position: relative; }
body:not(.tv-body) .search-wrap .icon {
  left: 14px !important;
  width: 16px !important;
  height: 16px !important;
  z-index: 2;
}
body:not(.tv-body) .search-wrap .input,
body:not(.tv-body) .search-wrap input.input {
  padding-left: 44px !important;
  padding-right: 12px !important;
}

.playlist-timeline-bar.is-empty {
  height: auto;
  min-height: 86px;
  padding: 10px;
  overflow: visible;
  align-items: center;
  justify-content: center;
}
.playlist-timeline-bar.is-empty .timeline-empty {
  width: 100%;
  margin: 0;
}


.playlist-preview-head h2 { display:flex; align-items:center; gap:10px; }
.playlist-preview-modal.modern-playlist-preview {
  gap: 16px;
  min-width: min(760px, calc(100vw - 42px));
}
.playlist-preview-hero {
  border: 1px solid rgba(44,92,113,.12);
  border-radius: 20px;
  padding: 14px 16px;
  background: linear-gradient(135deg, #f8fbfc 0%, #eef6f8 100%);
}
.preview-kicker {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(44,92,113,.12);
  color:#21485A;
  font-size:11px;
  font-weight:600;
}
.playlist-preview-summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:flex-start;
}
.playlist-preview-summary b {
  display:block;
  font-size:18px;
  line-height:1.15;
  color:#0f172a;
}
.playlist-preview-summary small {
  display:block;
  margin-top:4px;
  color:#64748b;
  line-height:1.45;
}
.playlist-preview-facts {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}
.playlist-preview-facts span {
  display:grid;
  gap:4px;
  padding:12px 14px;
  border:1px solid rgba(44,92,113,.12);
  border-radius:16px;
  background:#fff;
}
.playlist-preview-facts strong {
  font-size:18px;
  line-height:1;
  color:#21485A;
}
.playlist-preview-facts small {
  color:#64748b;
  font-size:11px;
  font-weight:700;
}
.playlist-preview-assignment {
  display:grid;
  gap:10px;
  padding:14px 16px;
  border:1px solid rgba(44,92,113,.12);
  border-radius:18px;
  background:#fff;
}
.playlist-preview-assignment.warning {
  background:#fff8f1;
  border-color:rgba(245,158,11,.22);
}
.playlist-preview-assignment-head { display:grid; gap:3px; }
.playlist-preview-assignment-head b { color:#0f172a; }
.playlist-preview-assignment-head small { color:#64748b; }
.assigned-tv-strip {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.assigned-tv-strip span {
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  background:#eef6f8;
  color:#21485A;
  font-weight:600;
  font-size:11px;
  padding:7px 11px;
}
.assigned-tv-strip .empty-chip {
  background:#fff;
  border:1px dashed rgba(245,158,11,.34);
  color:#92400e;
}
.playlist-preview-list-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.playlist-preview-list-head b { display:block; color:#0f172a; }
.playlist-preview-list-head small { color:#64748b; }
.playlist-preview-sequence-badge {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 11px;
  border-radius:999px;
  background:#f8fbfc;
  border:1px solid rgba(44,92,113,.12);
  color:#21485A;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
}
.playlist-preview-list {
  display:grid;
  gap:10px;
  max-height:52vh;
  overflow:auto;
  padding-right:3px;
}
.playlist-preview-item {
  display:grid;
  grid-template-columns: auto 58px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  background:linear-gradient(180deg,#ffffff,#fbfdff);
  box-shadow:0 8px 20px rgba(15,23,42,.04);
}
.preview-index {
  width:32px;
  height:32px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#eef6f8;
  color:#21485A;
  font-weight:600;
}
.preview-thumb {
  width:58px;
  height:42px;
  border-radius:12px;
  overflow:hidden;
  background:#eef2f7;
  display:grid;
  place-items:center;
  color:#64748b;
}
.preview-thumb img,
.preview-thumb video,
.preview-thumb iframe {
  width:100%;
  height:100%;
  object-fit:cover;
  border:0;
}
.preview-copy { min-width:0; display:grid; gap:3px; }
.preview-copy b {
  display:block;
  color:#0f172a;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.preview-copy small,
.preview-copy em {
  display:block;
  color:#64748b;
  font-size:11px;
  line-height:1.45;
}
.preview-copy em {
  font-style:normal;
}
.preview-meta {
  display:grid;
  gap:7px;
  justify-items:end;
}
.preview-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:#f8fbfc;
  border:1px solid rgba(44,92,113,.12);
  color:#21485A;
  font-size:10.5px;
  font-weight:600;
  white-space:nowrap;
}
.preview-pill.ok {
  background:#ecfdf5;
  border-color:rgba(16,185,129,.16);
  color:#047857;
}
.preview-pill.warning {
  background:#fff7ed;
  border-color:rgba(245,158,11,.16);
  color:#b45309;
}
.playlist-preview-actions .btn {
  min-width: 148px;
  justify-content:center;
}

body:not(.tv-body) .playlist-timeline-card {
  overflow: hidden;
}
body:not(.tv-body) .playlist-timeline-head {
  align-items: center;
  margin-bottom: 12px;
}
body:not(.tv-body) .playlist-timeline-bar:not(.is-empty) {
  height: auto !important;
  min-height: 72px;
  padding: 10px;
  gap: 8px;
  align-items: stretch;
  justify-content: flex-start;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 20px;
  background: linear-gradient(135deg, #eef6f8 0%, #f8fbfc 100%);
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}
body:not(.tv-body) .playlist-timeline-bar:not(.is-empty)::-webkit-scrollbar {
  height: 7px;
}
body:not(.tv-body) .playlist-timeline-bar:not(.is-empty)::-webkit-scrollbar-thumb {
  background: rgba(44,92,113,.28);
  border-radius: 999px;
}
body:not(.tv-body) .timeline-segment {
  flex: 0 0 max(var(--seg-width), 68px);
  width: max(var(--seg-width), 68px);
  max-width: 240px;
  min-width: 68px;
  min-height: 54px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  align-items: center;
  gap: 2px 8px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 16px;
  color: #fff;
  text-align: left;
  box-shadow: 0 10px 24px rgba(44,92,113,.13);
  scroll-snap-align: start;
  overflow: hidden;
}
body:not(.tv-body) .timeline-segment b {
  grid-row: 1 / 3;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.20);
  color: #fff;
  font-size: 12px;
  line-height: 1;
}
body:not(.tv-body) .timeline-segment span {
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.1;
  white-space: nowrap;
}
body:not(.tv-body) .timeline-segment em {
  color: rgba(255,255,255,.88);
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
body:not(.tv-body) .timeline-segment.compact {
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  padding: 8px 7px;
}
body:not(.tv-body) .timeline-segment.compact b {
  grid-row: auto;
  width: 24px;
  height: 24px;
}
body:not(.tv-body) .timeline-segment.compact em {
  display: none;
}
body:not(.tv-body) .timeline-segment.compact span {
  font-size: 10px;
}
body:not(.tv-body) .timeline-segment.disabled {
  opacity: .48;
  filter: grayscale(.25);
}
body:not(.tv-body) .timeline-segment.type-image { background: linear-gradient(135deg, #2C5C71, #3b7c92); }
body:not(.tv-body) .timeline-segment.type-video { background: linear-gradient(135deg, #0f766e, #14b8a6); }
body:not(.tv-body) .timeline-segment.type-pdf { background: linear-gradient(135deg, #7c3aed, #a855f7); }
body:not(.tv-body) .timeline-segment.type-url { background: linear-gradient(135deg, #b45309, #f59e0b); }
body:not(.tv-body) .timeline-hint {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  line-height: 1.35;
  white-space: normal;
}

.modal:has(.modern-playlist-preview) {
  max-width: min(860px, calc(100vw - 28px));
}
.playlist-preview-head {
  padding-bottom: 8px;
}
.playlist-preview-head h2 {
  font-size: 18px;
  letter-spacing: -.02em;
}
.playlist-preview-modal.modern-playlist-preview {
  gap: 10px !important;
  min-width: min(690px, calc(100vw - 42px)) !important;
  max-width: 780px;
}
.playlist-preview-hero {
  padding: 10px 12px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #f8fbfc 0%, #ffffff 100%) !important;
}
.preview-kicker {
  margin-bottom: 7px !important;
  padding: 5px 9px !important;
  font-size: 10.5px !important;
}
.playlist-preview-summary {
  gap: 8px !important;
  align-items: center !important;
}
.playlist-preview-summary b {
  font-size: 15px !important;
}
.playlist-preview-summary small {
  margin-top: 2px !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}
.playlist-preview-summary .badge {
  padding: 5px 9px;
  font-size: 10.5px;
  white-space: nowrap;
}
.playlist-preview-facts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
.playlist-preview-facts span {
  padding: 8px 10px !important;
  border-radius: 13px !important;
  gap: 2px !important;
}
.playlist-preview-facts strong {
  font-size: 15px !important;
}
.playlist-preview-facts small {
  font-size: 10.5px !important;
}
.playlist-preview-assignment {
  padding: 9px 11px !important;
  border-radius: 14px !important;
  gap: 7px !important;
}
.playlist-preview-assignment-head b {
  font-size: 12px;
}
.playlist-preview-assignment-head small {
  font-size: 11px;
  line-height: 1.3;
}
.assigned-tv-strip {
  gap: 6px !important;
}
.assigned-tv-strip span {
  padding: 5px 9px !important;
  font-size: 10.5px !important;
}
.playlist-preview-list-head {
  gap: 8px !important;
  align-items: center !important;
}
.playlist-preview-list-head b {
  font-size: 13px;
}
.playlist-preview-list-head small {
  font-size: 11px;
}
.playlist-preview-sequence-badge {
  padding: 5px 9px !important;
  font-size: 10.5px !important;
}
.playlist-preview-list {
  gap: 7px !important;
  max-height: min(320px, 42vh) !important;
  padding-right: 2px !important;
}
.playlist-preview-item {
  grid-template-columns: 28px 48px minmax(0, 1fr) auto !important;
  gap: 9px !important;
  padding: 8px 10px !important;
  border-radius: 13px !important;
  box-shadow: 0 4px 14px rgba(15,23,42,.035) !important;
}
.preview-index {
  width: 26px !important;
  height: 26px !important;
  font-size: 11px !important;
}
.preview-thumb {
  width: 48px !important;
  height: 34px !important;
  border-radius: 9px !important;
}
.preview-copy {
  gap: 1px !important;
}
.preview-copy b {
  font-size: 12.5px !important;
}
.preview-copy small,
.preview-copy em {
  font-size: 10.5px !important;
  line-height: 1.25 !important;
}
.preview-meta {
  gap: 5px !important;
}
.preview-pill {
  padding: 4px 7px !important;
  font-size: 9.8px !important;
  gap: 4px !important;
}
.preview-pill .icon {
  width: 12px;
  height: 12px;
}
.playlist-preview-actions {
  padding-top: 8px !important;
  margin-top: 0 !important;
}
.playlist-preview-actions .btn {
  min-height: 36px !important;
  min-width: 126px !important;
  padding: 8px 12px !important;
}


body:not(.tv-body).modal-open {
  overflow: hidden !important;
}

body:not(.tv-body) .modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(10px, 2vw, 24px) !important;
  overflow: auto !important;
  background: rgba(2, 6, 23, .66) !important;
}

body:not(.tv-body) .modal {
  display: flex !important;
  flex-direction: column !important;
  width: min(760px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: min(92vh, 900px) !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  border: 1px solid rgba(148, 163, 184, .34) !important;
  background: #fff !important;
  box-shadow: 0 34px 90px rgba(15, 23, 42, .34) !important;
}

body:not(.tv-body) .modal.modal-small { width: min(540px, calc(100vw - 24px)) !important; }
body:not(.tv-body) .modal.modal-medium { width: min(780px, calc(100vw - 24px)) !important; }
body:not(.tv-body) .modal.modal-large { width: min(1040px, calc(100vw - 24px)) !important; }
body:not(.tv-body) .modal.modal-wide { width: min(1240px, calc(100vw - 24px)) !important; }
body:not(.tv-body) .modal.modal-smart-slide,
body:not(.tv-body) .modal.modal-dashboard-slide,
body:not(.tv-body) .modal.modal-pair-tv,
body:not(.tv-body) .modal.modal-emergency-override {
  width: min(1240px, calc(100vw - 24px)) !important;
}
body:not(.tv-body) .modal.modal-screen-upsert,
body:not(.tv-body) .modal.modal-android-control,
body:not(.tv-body) .modal.modal-health,
body:not(.tv-body) .modal.modal-playlist-preview {
  width: min(1040px, calc(100vw - 24px)) !important;
}

body:not(.tv-body) .modal > .modal-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-height: 62px !important;
  margin: 0 !important;
  padding: 15px 18px !important;
  border-bottom: 1px solid #e5edf2 !important;
  background: linear-gradient(180deg, #ffffff, #f8fbfc) !important;
  color: #0f172a !important;
  position: relative !important;
  z-index: 20 !important;
}

body:not(.tv-body) .modal > .modal-head > div,
body:not(.tv-body) .modal-title-stack {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
}

body:not(.tv-body) .modal > .modal-head h2 {
  min-width: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  font-size: clamp(17px, 1.8vw, 22px) !important;
  line-height: 1.18 !important;
  letter-spacing: -.015em !important;
  color: inherit !important;
  overflow-wrap: anywhere !important;
}

body:not(.tv-body) .modal > .modal-head p,
body:not(.tv-body) .modal > .modal-head small {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

body:not(.tv-body) .modal .close-btn {
  flex: 0 0 auto !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
}
body:not(.tv-body) .modal .close-btn .icon {
  width: 17px !important;
  height: 17px !important;
}

body:not(.tv-body) .modal > :not(.modal-head) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 16px 18px !important;
  box-sizing: border-box !important;
  overscroll-behavior: contain !important;
}

body:not(.tv-body) .modal > form,
body:not(.tv-body) .modal > .modal-form,
body:not(.tv-body) .modal .url-edit-modal,
body:not(.tv-body) .modal .android-tv-volume-modal,
body:not(.tv-body) .modal .android-tv-schedule-modal,
body:not(.tv-body) .modal .screen-upsert-form,
body:not(.tv-body) .modal .pair-form-card,
body:not(.tv-body) .modal .smart-slide-form,
body:not(.tv-body) .modal .qr-slide-form,
body:not(.tv-body) .modal .dashboard-slide-form,
body:not(.tv-body) .modal .modern-screen-emergency-modal {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-height: 0 !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal .modal-action-bar,
body:not(.tv-body) .modal .modal-sticky-actions,
body:not(.tv-body) .modal .sticky-actions,
body:not(.tv-body) .modal form > .btn-row:last-child,
body:not(.tv-body) .modal > .btn-row:last-child {
  flex: 0 0 auto !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 22 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 12px 0 -16px !important;
  padding: 12px 0 16px !important;
  border-top: 1px solid #e5edf2 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.78), #ffffff 42%) !important;
  box-shadow: 0 -12px 26px rgba(15,23,42,.06) !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn,
body:not(.tv-body) .modal .modal-sticky-actions .btn,
body:not(.tv-body) .modal .sticky-actions .btn,
body:not(.tv-body) .modal form > .btn-row:last-child .btn,
body:not(.tv-body) .modal > .btn-row:last-child .btn {
  min-height: 40px !important;
  white-space: nowrap !important;
  justify-content: center !important;
}

body:not(.tv-body) .modal .btn-row-normalized {
  min-width: 0 !important;
}

body:not(.tv-body) .modal .grid,
body:not(.tv-body) .modal .form-grid,
body:not(.tv-body) .modal .grid-2,
body:not(.tv-body) .modal .screen-upsert-grid,
body:not(.tv-body) .modal .pair-success-grid,
body:not(.tv-body) .modal .android-tv-schedule-grid,
body:not(.tv-body) .modal .screen-health-grid,
body:not(.tv-body) .modal .playlist-preview-grid,
body:not(.tv-body) .modal .smart-template-grid,
body:not(.tv-body) .modal .smart-badge-style-grid {
  min-width: 0 !important;
}

body:not(.tv-body) .modal .form-row,
body:not(.tv-body) .modal label,
body:not(.tv-body) .modal .input,
body:not(.tv-body) .modal .select,
body:not(.tv-body) .modal .textarea,
body:not(.tv-body) .modal .btn,
body:not(.tv-body) .modal textarea,
body:not(.tv-body) .modal input,
body:not(.tv-body) .modal select,
body:not(.tv-body) .modal .setting-toggle,
body:not(.tv-body) .modal .switch-card {
  min-width: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .input,
body:not(.tv-body) .modal .select,
body:not(.tv-body) .modal .textarea {
  width: 100% !important;
}

body:not(.tv-body) .modal .modal-text-safe,
body:not(.tv-body) .modal code,
body:not(.tv-body) .modal pre,
body:not(.tv-body) .modal .copy-secret-box,
body:not(.tv-body) .modal .url-preview-box,
body:not(.tv-body) .modal .pair-final-url,
body:not(.tv-body) .modal .edit-screen-url {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-media-safe,
body:not(.tv-body) .modal img,
body:not(.tv-body) .modal video,
body:not(.tv-body) .modal iframe {
  max-width: 100% !important;
}

/* Popup card/content arrangement */
body:not(.tv-body) .modal :where(.screen-upsert-section, .pair-form-section, .pair-setup-card, .pair-active-list, .pair-success-hero, .pair-final-url, .playlist-details-popup, .playlist-delete-modal, .asset-usage-summary, .usage-list, .url-preview-box, .qr-card, .qr-detail, .simple-preview-summary-card, .simple-preview-tv-card, .simple-preview-sequence-card, .android-tv-volume-card, .android-tv-schedule-device, .android-tv-schedule-summary, .copy-secret-box, .import-preview-box, .confirm-dialog-body) {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  border-radius: 18px !important;
}

body:not(.tv-body) .modal .confirm-dialog {
  display: grid !important;
  gap: 14px !important;
  padding: 0 !important;
  overflow: visible !important;
}
body:not(.tv-body) .modal .confirm-dialog-body {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  gap: 13px !important;
  align-items: flex-start !important;
  padding: 15px !important;
  background: #f8fbfc !important;
  border: 1px solid #e5edf2 !important;
}
body:not(.tv-body) .modal .confirm-dialog-message {
  margin: 5px 0 0 !important;
  color: #475569 !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
}
body:not(.tv-body) .modal .confirm-dialog-actions {
  margin-bottom: 0 !important;
}

body:not(.tv-body) .modal .playlist-details-popup,
body:not(.tv-body) .modal .playlist-delete-modal,
body:not(.tv-body) .modal .asset-usage-modal,
body:not(.tv-body) .modal .playlist-quality-modal,
body:not(.tv-body) .modal .pair-success-modal,
body:not(.tv-body) .modal .qr-modal {
  display: grid !important;
  gap: 14px !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal .pair-wizard-shell {
  display: grid !important;
  grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr) !important;
  gap: 16px !important;
  align-items: start !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
body:not(.tv-body) .modal .pair-setup-panel,
body:not(.tv-body) .modal .pair-form-card {
  min-width: 0 !important;
}
body:not(.tv-body) .modal .pair-setup-card {
  grid-template-columns: 44px minmax(0, 1fr) auto !important;
}
body:not(.tv-body) .modal .pair-session-card {
  grid-template-columns: auto minmax(0, 1fr) !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal .screen-upsert-intro,
body:not(.tv-body) .modal .edit-screen-url {
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body:not(.tv-body) .modal .screen-upsert-form {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 !important;
}
body:not(.tv-body) .modal .screen-upsert-section {
  padding: 13px !important;
}

body:not(.tv-body) .modal .screen-live-preview-modal {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  min-height: 0 !important;
}
body:not(.tv-body) .modal .screen-live-preview-frame {
  flex: 1 1 auto !important;
  min-height: 360px !important;
  width: 100% !important;
  border-radius: 18px !important;
  overflow: hidden !important;
}

body:not(.tv-body) .modal .android-tv-control-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal .android-tv-control,
body:not(.tv-body) .modal .screen-health-panel {
  min-width: 0 !important;
  overflow-x: hidden !important;
}

body:not(.tv-body) .modal .smart-form-layout,
body:not(.tv-body) .modal .advanced-smart-designer-layout,
body:not(.tv-body) .modal .dashboard-slide-layout,
body:not(.tv-body) .modal .qr-slide-layout,
body:not(.tv-body) .modal .screen-emergency-modal-layout {
  min-width: 0 !important;
  overflow-x: hidden !important;
}

/* Admin page cards: keep titles/content/buttons aligned and stop long text from pushing layouts out. */
body:not(.tv-body) :where(.card, .screen-card, .dashboard-tv-card, .asset-card, .enhanced-asset-card, .playlist-select-card, .playlist-selected-summary-card, .playlist-timeline-card, .add-media-card, .individual-tv-card, .user-card, .offline-cache-card, .setting-card, .status-card, .health-table-card) {
  min-width: 0 !important;
  box-sizing: border-box !important;
}
body:not(.tv-body) :where(.card, .screen-card, .dashboard-tv-card, .asset-card, .playlist-select-card, .individual-tv-card, .user-card, .offline-cache-card) :where(h2, h3, b, p, small, span, code, em) {
  min-width: 0;
  overflow-wrap: anywhere;
}
body:not(.tv-body) :where(.screen-card-action-row, .dashboard-tv-actions, .asset-actions, .asset-card-actions, .playlist-selected-actions, .playlist-card-actions, .individual-tv-actions, .user-card-actions, .default-media-actions, .settings-actions, .page-actions, .toolbar-actions) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body:not(.tv-body) :where(.screen-card-action-row, .dashboard-tv-actions, .asset-actions, .asset-card-actions, .playlist-selected-actions, .playlist-card-actions, .individual-tv-actions, .user-card-actions, .default-media-actions, .settings-actions, .page-actions, .toolbar-actions) .btn {
  min-width: 0 !important;
  max-width: 100% !important;
}

@media (max-width: 980px) {
  body:not(.tv-body) .modal.modal-wide,
  body:not(.tv-body) .modal.modal-large,
  body:not(.tv-body) .modal.modal-smart-slide,
  body:not(.tv-body) .modal.modal-dashboard-slide,
  body:not(.tv-body) .modal.modal-pair-tv,
  body:not(.tv-body) .modal.modal-emergency-override,
  body:not(.tv-body) .modal.modal-screen-upsert,
  body:not(.tv-body) .modal.modal-android-control,
  body:not(.tv-body) .modal.modal-health,
  body:not(.tv-body) .modal.modal-playlist-preview {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
  }
  body:not(.tv-body) .modal .pair-wizard-shell {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal .screen-live-preview-frame {
    min-height: 280px !important;
  }
}

@media (max-width: 680px) {
  body:not(.tv-body) .modal-backdrop {
    align-items: stretch !important;
    padding: 8px !important;
  }
  body:not(.tv-body) .modal,
  body:not(.tv-body) .modal.modal-small,
  body:not(.tv-body) .modal.modal-medium,
  body:not(.tv-body) .modal.modal-large,
  body:not(.tv-body) .modal.modal-wide {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px !important;
  }
  body:not(.tv-body) .modal > .modal-head {
    padding: 12px 14px !important;
    min-height: 56px !important;
  }
  body:not(.tv-body) .modal > :not(.modal-head) {
    padding: 14px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar,
  body:not(.tv-body) .modal .modal-sticky-actions,
  body:not(.tv-body) .modal .sticky-actions,
  body:not(.tv-body) .modal form > .btn-row:last-child,
  body:not(.tv-body) .modal > .btn-row:last-child {
    justify-content: stretch !important;
    margin-bottom: -14px !important;
    padding-bottom: 14px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar .btn,
  body:not(.tv-body) .modal .modal-sticky-actions .btn,
  body:not(.tv-body) .modal .sticky-actions .btn,
  body:not(.tv-body) .modal form > .btn-row:last-child .btn,
  body:not(.tv-body) .modal > .btn-row:last-child .btn {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
  body:not(.tv-body) .modal .confirm-dialog-body {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal .pair-setup-card,
  body:not(.tv-body) .modal .pair-session-card {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal .screen-live-preview-frame {
    min-height: 220px !important;
  }
}


body:not(.tv-body) .modal-backdrop {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px !important;
  overflow: hidden !important;
}

body:not(.tv-body) .modal,
body:not(.tv-body) .modal.modal-small,
body:not(.tv-body) .modal.modal-medium,
body:not(.tv-body) .modal.modal-large,
body:not(.tv-body) .modal.modal-wide {
  display: flex !important;
  flex-direction: column !important;
  width: min(760px, calc(100vw - 28px)) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100vh - 28px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border-radius: 24px !important;
}

body:not(.tv-body) .modal.modal-small { width: min(520px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-large { width: min(1040px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-wide { width: min(1220px, calc(100vw - 28px)) !important; }

body:not(.tv-body) .modal > .modal-head,
body:not(.tv-body) .modal > .android-tv-modal-head,
body:not(.tv-body) .modal > .android-tv-schedule-head,
body:not(.tv-body) .modal > .screen-upsert-head,
body:not(.tv-body) .modal > .pair-modal-head,
body:not(.tv-body) .modal > .screen-preview-modal-head {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 15px 18px !important;
  border-radius: 24px 24px 0 0 !important;
  border-bottom: 1px solid #e5edf2 !important;
  background: linear-gradient(180deg, #ffffff, #f8fbfc) !important;
  position: relative !important;
  z-index: 30 !important;
}

body:not(.tv-body) .modal > :not(.modal-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-upsert-head):not(.pair-modal-head):not(.screen-preview-modal-head) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 16px 18px !important;
  box-sizing: border-box !important;
  overscroll-behavior: contain !important;
}

body:not(.tv-body) .modal .modal-flow-fixed {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 16px 18px 18px !important;
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
  scroll-padding-bottom: 24px !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(44,92,113,.35) transparent;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane::-webkit-scrollbar { width: 8px; }
body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane::-webkit-scrollbar-thumb {
  background: rgba(44,92,113,.32);
  border-radius: 999px;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar,
body:not(.tv-body) .modal .modal-action-bar,
body:not(.tv-body) .modal .modal-sticky-actions,
body:not(.tv-body) .modal .sticky-actions,
body:not(.tv-body) .modal .pair-submit-row,
body:not(.tv-body) .modal .smart-designer-actions,
body:not(.tv-body) .modal .btn-row-normalized.modal-action-bar {
  flex: 0 0 auto !important;
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: 40 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 13px 18px 16px !important;
  border-top: 1px solid #e5edf2 !important;
  background: #ffffff !important;
  box-shadow: 0 -10px 24px rgba(15,23,42,.07) !important;
  backdrop-filter: none !important;
  border-radius: 0 0 24px 24px !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn,
body:not(.tv-body) .modal .modal-sticky-actions .btn,
body:not(.tv-body) .modal .sticky-actions .btn,
body:not(.tv-body) .modal .pair-submit-row .btn,
body:not(.tv-body) .modal .smart-designer-actions .btn,
body:not(.tv-body) .modal .btn-row-normalized.modal-action-bar .btn {
  min-height: 40px !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

body:not(.tv-body) .modal .modal-action-bar .hint {
  margin-right: auto !important;
  min-width: 220px !important;
  flex: 1 1 260px !important;
}


body:not(.tv-body) .modal.modal-pair-tv,
body:not(.tv-body) .modal:has(.pair-wizard-shell) {
  width: min(1180px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 28px) !important;
}
body:not(.tv-body) .modal.modal-pair-tv > .pair-wizard-shell,
body:not(.tv-body) .modal:has(.pair-wizard-shell) > .pair-wizard-shell {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: minmax(290px, .82fr) minmax(420px, 1.18fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
  padding: 16px 18px 0 !important;
}
body:not(.tv-body) .modal.modal-pair-tv .pair-setup-panel,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-setup-panel {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-bottom: 18px !important;
}
body:not(.tv-body) .modal.modal-pair-tv .pair-form-card,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card {
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  background: transparent !important;
}
body:not(.tv-body) .modal.modal-pair-tv .pair-form-card > .modal-scroll-pane,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card > .modal-scroll-pane {
  padding: 0 0 14px !important;
  gap: 13px !important;
}
body:not(.tv-body) .modal.modal-pair-tv .pair-submit-row,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-submit-row {
  margin: 0 -18px 0 0 !important;
  padding: 13px 18px 16px !important;
  border-radius: 0 0 24px 0 !important;
}

/* Keep Screen Create/Edit form action row at the bottom and content above it. */
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane {
  padding: 16px 18px 18px !important;
}
body:not(.tv-body) .modal.modal-screen-upsert .edit-screen-url,
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro {
  flex: 0 0 auto !important;
  overflow: visible !important;
}

/* TV Health Monitor: practical width and contained content. */
body:not(.tv-body) .modal.modal-health,
body:not(.tv-body) .modal:has(.screen-health-modal) {
  width: min(860px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 28px) !important;
}
body:not(.tv-body) .modal.modal-health .screen-health-modal,
body:not(.tv-body) .modal:has(.screen-health-modal) .screen-health-modal {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 0 !important;
}

@media (max-width: 980px) {
  body:not(.tv-body) .modal.modal-pair-tv > .pair-wizard-shell,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) > .pair-wizard-shell {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
    padding-bottom: 0 !important;
  }
  body:not(.tv-body) .modal.modal-pair-tv .pair-setup-panel,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-setup-panel {
    overflow: visible !important;
    padding-bottom: 0 !important;
  }
  body:not(.tv-body) .modal.modal-pair-tv .pair-form-card,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card {
    min-height: 520px !important;
  }
  body:not(.tv-body) .modal.modal-pair-tv .pair-submit-row,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-submit-row {
    margin: 0 -18px !important;
    border-radius: 0 0 24px 24px !important;
  }
}

@media (max-width: 680px) {
  body:not(.tv-body) .modal-backdrop { padding: 8px !important; }
  body:not(.tv-body) .modal,
  body:not(.tv-body) .modal.modal-small,
  body:not(.tv-body) .modal.modal-medium,
  body:not(.tv-body) .modal.modal-large,
  body:not(.tv-body) .modal.modal-wide {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px !important;
  }
  body:not(.tv-body) .modal > .modal-head,
  body:not(.tv-body) .modal > .android-tv-modal-head,
  body:not(.tv-body) .modal > .android-tv-schedule-head,
  body:not(.tv-body) .modal > .screen-upsert-head,
  body:not(.tv-body) .modal > .pair-modal-head,
  body:not(.tv-body) .modal > .screen-preview-modal-head {
    padding: 12px 14px !important;
    border-radius: 20px 20px 0 0 !important;
  }
  body:not(.tv-body) .modal > :not(.modal-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-upsert-head):not(.pair-modal-head):not(.screen-preview-modal-head),
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
    padding: 14px !important;
  }
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar,
  body:not(.tv-body) .modal .modal-action-bar,
  body:not(.tv-body) .modal .modal-sticky-actions,
  body:not(.tv-body) .modal .sticky-actions,
  body:not(.tv-body) .modal .pair-submit-row,
  body:not(.tv-body) .modal .smart-designer-actions,
  body:not(.tv-body) .modal .btn-row-normalized.modal-action-bar {
    justify-content: stretch !important;
    padding: 12px 14px 14px !important;
    border-radius: 0 0 20px 20px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar .btn,
  body:not(.tv-body) .modal .modal-sticky-actions .btn,
  body:not(.tv-body) .modal .sticky-actions .btn,
  body:not(.tv-body) .modal .pair-submit-row .btn,
  body:not(.tv-body) .modal .smart-designer-actions .btn,
  body:not(.tv-body) .modal .btn-row-normalized.modal-action-bar .btn {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
}


body:not(.tv-body) .modal > form.modal-flow-fixed,
body:not(.tv-body) .modal > .modal-flow-fixed,
body:not(.tv-body) .modal .modal-flow-fixed {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  gap: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal > form.modal-flow-fixed,
body:not(.tv-body) .modal > .modal-flow-fixed {
  flex: 1 1 auto !important;
  width: 100% !important;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 16px 18px 18px !important;
  margin: 0 !important;
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
  box-sizing: border-box !important;
  scroll-padding-bottom: 24px !important;
  overscroll-behavior: contain !important;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar,
body:not(.tv-body) .modal > .modal-action-bar,
body:not(.tv-body) .modal .modal-action-bar {
  flex: 0 0 auto !important;
  position: relative !important;
  inset: auto !important;
  z-index: 45 !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 13px 18px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  border-top: 1px solid #e5edf2 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), #fff 42%) !important;
  box-shadow: 0 -12px 26px rgba(15,23,42,.07) !important;
  border-radius: 0 0 24px 24px !important;
  backdrop-filter: blur(10px) !important;
}

body:not(.tv-body) .modal .modal-action-bar .hint,
body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar .hint {
  flex: 1 1 280px !important;
  min-width: 180px !important;
  margin: 0 auto 0 0 !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn,
body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar .btn {
  flex: 0 0 auto !important;
  min-height: 40px !important;
  white-space: nowrap !important;
  justify-content: center !important;
}

/* Special two-column Pair New Android TV modal: left and right panels scroll independently, right footer stays attached. */
body:not(.tv-body) .modal.modal-pair-tv,
body:not(.tv-body) .modal:has(.pair-wizard-shell) {
  width: min(1180px, calc(100vw - 28px)) !important;
  max-height: calc(100vh - 28px) !important;
}

body:not(.tv-body) .modal.modal-pair-tv > .pair-wizard-shell,
body:not(.tv-body) .modal:has(.pair-wizard-shell) > .pair-wizard-shell {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 16px 18px 0 !important;
  display: grid !important;
  grid-template-columns: minmax(290px, .85fr) minmax(420px, 1.15fr) !important;
  gap: 18px !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal.modal-pair-tv .pair-setup-panel,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-setup-panel {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-bottom: 16px !important;
}

body:not(.tv-body) .modal.modal-pair-tv .pair-form-card.modal-flow-fixed,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card.modal-flow-fixed {
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #e2eaf0 !important;
  border-radius: 20px 20px 0 0 !important;
}

body:not(.tv-body) .modal.modal-pair-tv .pair-form-card > .modal-scroll-pane,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card > .modal-scroll-pane {
  padding: 0 0 14px !important;
  gap: 13px !important;
  background: #fff !important;
}

body:not(.tv-body) .modal.modal-pair-tv .pair-submit-row.modal-action-bar,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-submit-row.modal-action-bar {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 0 20px 20px !important;
}

/* Smart/QR/Dashboard slide designers: action footer spans the full modal width. */
body:not(.tv-body) .modal.modal-smart-slide > form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-qr-slide > form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-dashboard-slide > form.modal-flow-fixed {
  background: #fff !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-designer-actions.modal-action-bar,
body:not(.tv-body) .modal.modal-qr-slide .modal-action-bar,
body:not(.tv-body) .modal.modal-dashboard-slide .modal-action-bar {
  width: 100% !important;
  border-radius: 0 0 24px 24px !important;
}

/* Emergency template cards: put icon, title and subtitle in stable grid positions. */
body:not(.tv-body) .emergency-template-card .section-title h2 {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body:not(.tv-body) .emergency-template-grid {
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)) !important;
  gap: 10px !important;
}

body:not(.tv-body) .emergency-template-chip {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 10px !important;
  row-gap: 3px !important;
  align-items: start !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 76px !important;
  padding: 12px 13px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-align: left !important;
}

body:not(.tv-body) .emergency-template-chip > .icon,
body:not(.tv-body) .emergency-template-chip > svg {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  width: 18px !important;
  height: 18px !important;
  margin-top: 1px !important;
  align-self: start !important;
}

body:not(.tv-body) .emergency-template-chip > b {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
}

body:not(.tv-body) .emergency-template-chip > small {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-width: 0 !important;
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.28 !important;
}

body:not(.tv-body) .emergency-template-chip.active::after,
body:not(.tv-body) .emergency-template-chip[aria-pressed="true"]::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 980px) {
  body:not(.tv-body) .modal.modal-pair-tv > .pair-wizard-shell,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) > .pair-wizard-shell {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
    padding: 14px 14px 0 !important;
  }
  body:not(.tv-body) .modal.modal-pair-tv .pair-setup-panel,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-setup-panel {
    overflow: visible !important;
  }
  body:not(.tv-body) .modal.modal-pair-tv .pair-form-card.modal-flow-fixed,
  body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-form-card.modal-flow-fixed {
    min-height: 520px !important;
  }
}

@media (max-width: 680px) {
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
    padding: 14px !important;
  }
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar,
  body:not(.tv-body) .modal > .modal-action-bar,
  body:not(.tv-body) .modal .modal-action-bar {
    justify-content: stretch !important;
    padding: 12px 14px 14px !important;
    border-radius: 0 0 20px 20px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar .btn,
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-action-bar .btn {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
  body:not(.tv-body) .emergency-template-grid {
    grid-template-columns: 1fr !important;
  }
}


body:not(.tv-body).modal-open {
  overflow: hidden !important;
}

body:not(.tv-body) .modal-backdrop {
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal {
  display: flex !important;
  flex-direction: column !important;
  max-height: min(92vh, calc(100vh - 34px)) !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal > .modal-head,
body:not(.tv-body) .modal > .pair-modal-head,
body:not(.tv-body) .modal > .screen-upsert-head,
body:not(.tv-body) .modal > .android-tv-modal-head,
body:not(.tv-body) .modal > .android-tv-schedule-head,
body:not(.tv-body) .modal > .screen-preview-modal-head {
  flex: 0 0 auto !important;
  border-radius: 24px 24px 0 0 !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal > :not(.modal-head):not(.pair-modal-head):not(.screen-upsert-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-preview-modal-head):not(.modal-action-bar):not(.modal-flow-fixed):not(.modal-actions):not(.health-modal-actions):not(.pair-wizard-shell) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: clamp(16px, 2vw, 24px) clamp(18px, 2.4vw, 28px) 24px !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-flow-fixed {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 18px !important;
  margin: 0 !important;
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
  box-sizing: border-box !important;
  overscroll-behavior: contain !important;
  scroll-padding-bottom: 28px !important;
}

body:not(.tv-body) .modal .btn-row.modal-action-bar,
body:not(.tv-body) .modal .modal-action-bar,
body:not(.tv-body) .modal .modal-sticky-actions.modal-action-bar,
body:not(.tv-body) .modal .sticky-actions.modal-action-bar,
body:not(.tv-body) .modal .smart-designer-actions.modal-action-bar,
body:not(.tv-body) .modal .simple-preview-actions.modal-action-bar,
body:not(.tv-body) .modal .playlist-delete-actions.modal-action-bar,
body:not(.tv-body) .modal .pair-submit-row.modal-action-bar,
body:not(.tv-body) .modal [data-modal-action-row="true"] {
  flex: 0 0 auto !important;
  align-self: stretch !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  inset: auto !important;
  z-index: 60 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 14px 18px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  border-top: 1px solid rgba(203, 213, 225, .8) !important;
  background:
    linear-gradient(180deg, rgba(248, 251, 252, .86), #ffffff 42%) !important;
  box-shadow: 0 -14px 28px rgba(15, 23, 42, .08) !important;
  border-radius: 0 0 24px 24px !important;
  backdrop-filter: blur(12px) !important;
}

body:not(.tv-body) .modal .modal-action-bar::before,
body:not(.tv-body) .modal [data-modal-action-row="true"]::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: -12px !important;
  height: 12px !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.92)) !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn {
  flex: 0 0 auto !important;
  min-width: 112px !important;
  min-height: 42px !important;
  padding-inline: 16px !important;
  justify-content: center !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn.primary,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.primary,
body:not(.tv-body) .modal .modal-action-bar .btn.danger,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.danger {
  min-width: 148px !important;
}

body:not(.tv-body) .modal .modal-action-bar .hint,
body:not(.tv-body) .modal [data-modal-action-row="true"] .hint,
body:not(.tv-body) .modal .modal-action-bar .modal-action-note,
body:not(.tv-body) .modal [data-modal-action-row="true"] .modal-action-note {
  flex: 1 1 260px !important;
  margin: 0 auto 0 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* Smart/QR/Dashboard slide designers: make the preview/content area scroll,
   while the Create/Save/Cancel footer fills the whole modal bottom. */
body:not(.tv-body) .modal.modal-smart-slide,
body:not(.tv-body) .modal.modal-qr-slide,
body:not(.tv-body) .modal.modal-dashboard-slide {
  width: min(1180px, calc(100vw - 36px)) !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-slide-form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-qr-slide .qr-slide-form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-dashboard-slide .dashboard-slide-form.modal-flow-fixed {
  background: #fff !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-slide-form > .modal-scroll-pane,
body:not(.tv-body) .modal.modal-qr-slide .qr-slide-form > .modal-scroll-pane,
body:not(.tv-body) .modal.modal-dashboard-slide .dashboard-slide-form > .modal-scroll-pane {
  padding: 18px !important;
  display: block !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-form-layout,
body:not(.tv-body) .modal.modal-qr-slide .smart-form-layout,
body:not(.tv-body) .modal.modal-dashboard-slide .smart-form-layout {
  min-height: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-designer-actions.modal-action-bar,
body:not(.tv-body) .modal.modal-qr-slide .modal-action-bar,
body:not(.tv-body) .modal.modal-dashboard-slide .modal-action-bar {
  border-radius: 0 0 24px 24px !important;
}


body:not(.tv-body) .modal.modal-playlist-preview .playlist-preview-modal,
body:not(.tv-body) .modal .playlist-quality-modal,
body:not(.tv-body) .modal .playlist-delete-modal {
  min-height: 0 !important;
  overflow: hidden !important;
}

body:not(.tv-body) .modal .playlist-quality-modal.modal-flow-fixed > .modal-scroll-pane,
body:not(.tv-body) .modal .playlist-delete-modal.modal-flow-fixed > .modal-scroll-pane,
body:not(.tv-body) .modal.modal-playlist-preview .playlist-preview-modal.modal-flow-fixed > .modal-scroll-pane {
  padding: 18px !important;
}

body:not(.tv-body) .modal .playlist-delete-actions.modal-action-bar .btn.danger {
  order: 2 !important;
}

body:not(.tv-body) .modal .playlist-delete-actions.modal-action-bar .btn.ghost {
  order: 1 !important;
}

/* Pair TV footer: attach to the right panel, never float with side gaps. */
body:not(.tv-body) .modal.modal-pair-tv .pair-submit-row.modal-action-bar,
body:not(.tv-body) .modal:has(.pair-wizard-shell) .pair-submit-row.modal-action-bar {
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 0 20px 20px !important;
}

@media (max-width: 760px) {
  body:not(.tv-body) .modal-backdrop {
    padding: 8px !important;
  }
  body:not(.tv-body) .modal {
    width: min(100%, calc(100vw - 16px)) !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px !important;
  }
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
    padding: 14px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar,
  body:not(.tv-body) .modal [data-modal-action-row="true"] {
    justify-content: stretch !important;
    padding: 12px 14px 14px !important;
    border-radius: 0 0 20px 20px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar .btn,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn,
  body:not(.tv-body) .modal .modal-action-bar .btn.primary,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.primary,
  body:not(.tv-body) .modal .modal-action-bar .btn.danger,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.danger {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}


body:not(.tv-body).modal-open {
  overflow: hidden !important;
}

body:not(.tv-body) .modal-backdrop {
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(12px, 2vw, 24px) !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal {
  display: flex !important;
  flex-direction: column !important;
  width: min(780px, calc(100vw - 28px)) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: calc(100dvh - 34px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal.modal-small { width: min(540px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-medium { width: min(780px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-large { width: min(1040px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-wide { width: min(1220px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-health { width: min(860px, calc(100vw - 28px)) !important; }
body:not(.tv-body) .modal.modal-smart-slide,
body:not(.tv-body) .modal.modal-qr-slide,
body:not(.tv-body) .modal.modal-dashboard-slide,
body:not(.tv-body) .modal.modal-pair-tv {
  width: min(1180px, calc(100vw - 28px)) !important;
}

body:not(.tv-body) .modal > .modal-head,
body:not(.tv-body) .modal > .pair-modal-head,
body:not(.tv-body) .modal > .screen-upsert-head,
body:not(.tv-body) .modal > .android-tv-modal-head,
body:not(.tv-body) .modal > .android-tv-schedule-head,
body:not(.tv-body) .modal > .screen-preview-modal-head {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 30 !important;
}

body:not(.tv-body) .modal > :not(.modal-head):not(.pair-modal-head):not(.screen-upsert-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-preview-modal-head):not(.modal-action-bar):not(.modal-flow-fixed):not(.modal-actions):not(.health-modal-actions):not(.pair-wizard-shell) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: clamp(16px, 2vw, 24px) clamp(18px, 2.4vw, 28px) 24px !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-flow-fixed {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: clamp(16px, 2vw, 24px) clamp(18px, 2.4vw, 28px) 24px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}

body:not(.tv-body) .modal .modal-action-bar,
body:not(.tv-body) .modal .btn-row.modal-action-bar,
body:not(.tv-body) .modal .sticky-actions.modal-action-bar,
body:not(.tv-body) .modal .modal-sticky-actions.modal-action-bar,
body:not(.tv-body) .modal .smart-designer-actions.modal-action-bar,
body:not(.tv-body) .modal .simple-preview-actions.modal-action-bar,
body:not(.tv-body) .modal .playlist-delete-actions.modal-action-bar,
body:not(.tv-body) .modal .pair-submit-row.modal-action-bar,
body:not(.tv-body) .modal [data-modal-action-row="true"] {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  align-self: stretch !important;
  position: relative !important;
  inset: auto !important;
  margin: 0 !important;
  padding: 16px clamp(24px, 3vw, 34px) 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px 12px !important;
  box-sizing: border-box !important;
  border-top: 1px solid rgba(203, 213, 225, .86) !important;
  border-radius: 0 0 24px 24px !important;
  background: linear-gradient(180deg, rgba(248, 251, 252, .92), #ffffff 42%) !important;
  box-shadow: 0 -16px 30px rgba(15, 23, 42, .075) !important;
  backdrop-filter: blur(12px) !important;
  z-index: 50 !important;
}

body:not(.tv-body) .modal .modal-action-bar::before,
body:not(.tv-body) .modal [data-modal-action-row="true"]::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: -10px !important;
  height: 10px !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.96)) !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn {
  flex: 0 0 auto !important;
  min-width: 118px !important;
  min-height: 42px !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

body:not(.tv-body) .modal .modal-action-bar .btn.primary,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.primary,
body:not(.tv-body) .modal .modal-action-bar .btn.danger,
body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.danger {
  min-width: 158px !important;
}

body:not(.tv-body) .modal .modal-action-bar .hint,
body:not(.tv-body) .modal [data-modal-action-row="true"] .hint,
body:not(.tv-body) .modal .modal-action-bar .modal-action-note,
body:not(.tv-body) .modal [data-modal-action-row="true"] .modal-action-note {
  flex: 1 1 280px !important;
  margin: 0 auto 0 0 !important;
  min-width: 0 !important;
}


body:not(.tv-body) .modal.modal-smart-slide .smart-designer-scroll-fields,
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields,
body:not(.tv-body) .modal.modal-smart-slide .smart-form-fields,
body:not(.tv-body) .modal.modal-qr-slide .smart-form-fields,
body:not(.tv-body) .modal.modal-dashboard-slide .smart-form-fields {
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-form-layout,
body:not(.tv-body) .modal.modal-qr-slide .smart-form-layout,
body:not(.tv-body) .modal.modal-dashboard-slide .smart-form-layout {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel {
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Playlist detail/delete popups: keep action buttons away from the modal frame. */
body:not(.tv-body) .modal .playlist-popup-actions.modal-action-bar,
body:not(.tv-body) .modal .playlist-delete-actions.modal-action-bar,
body:not(.tv-body) .modal .simple-preview-actions.modal-action-bar {
  padding-left: clamp(24px, 3vw, 34px) !important;
  padding-right: clamp(24px, 3vw, 34px) !important;
}

@media (max-width: 760px) {
  body:not(.tv-body) .modal-backdrop {
    padding: 8px !important;
  }
  body:not(.tv-body) .modal {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 20px !important;
  }
  body:not(.tv-body) .modal .modal-flow-fixed > .modal-scroll-pane {
    padding: 14px 14px 18px !important;
    scrollbar-gutter: auto !important;
  }
  body:not(.tv-body) .modal .modal-action-bar,
  body:not(.tv-body) .modal [data-modal-action-row="true"] {
    justify-content: stretch !important;
    padding: 12px 14px 14px !important;
    border-radius: 0 0 20px 20px !important;
  }
  body:not(.tv-body) .modal .modal-action-bar .btn,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn,
  body:not(.tv-body) .modal .modal-action-bar .btn.primary,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.primary,
  body:not(.tv-body) .modal .modal-action-bar .btn.danger,
  body:not(.tv-body) .modal [data-modal-action-row="true"] .btn.danger {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}


body:not(.tv-body) .help-nav-card .help-nav-link {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  border-radius: 10px;
  padding: 8px 10px;
  color: var(--text-2);
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
body:not(.tv-body) .help-nav-card .help-nav-link:hover,
body:not(.tv-body) .help-nav-card .help-nav-link:focus-visible,
body:not(.tv-body) .help-nav-card .help-nav-link.active {
  background: rgba(44,92,113,.08);
  color: var(--primary-dark);
  outline: none;
}
body:not(.tv-body) .help-section {
  scroll-margin-top: 92px;
}
body:not(.tv-body) .nav-btn .icon,
body:not(.tv-body) .nav-btn-inner .icon {
  width: 20px !important;
  height: 20px !important;
}
body:not(.tv-body) .btn,
body:not(.tv-body) button.btn,
body:not(.tv-body) a.btn,
body:not(.tv-body) .rich-editor-toolbar button,
body:not(.tv-body) .full-toolbar button {
  font-weight: 600 !important;
}
body:not(.tv-body) .btn b,
body:not(.tv-body) button.btn b,
body:not(.tv-body) a.btn b {
  font-weight: 600 !important;
}

/* Staff permission selector */
body:not(.tv-body) .staff-permission-panel {
  border: 1px solid rgba(44,92,113,.16);
  background: #f8fbfc;
  border-radius: 16px;
  padding: 10px;
  margin: 6px 0 12px;
}
body:not(.tv-body) .staff-permission-head {
  display: grid;
  gap: 4px;
  margin-bottom: 8px;
}
body:not(.tv-body) .staff-permission-head b {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--text);
  font-size: 13px;
}
body:not(.tv-body) .staff-permission-head .icon { width: 17px; height: 17px; color: var(--primary-dark); }
body:not(.tv-body) .staff-permission-head small { color: var(--muted); font-size: 11px; line-height: 1.35; }
body:not(.tv-body) .permission-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
body:not(.tv-body) .permission-choice {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 14px;
  padding: 9px;
  cursor: pointer;
  transition: all var(--transition);
}
body:not(.tv-body) .permission-choice:hover { border-color: rgba(44,92,113,.28); background: #eef6f8; }
body:not(.tv-body) .permission-choice input { accent-color: var(--primary); margin-top: 3px; }
body:not(.tv-body) .permission-choice span { display: grid; gap: 3px; min-width: 0; }
body:not(.tv-body) .permission-choice .icon { width: 18px; height: 18px; color: var(--primary-dark); }
body:not(.tv-body) .permission-choice b { font-size: 12px; color: var(--text); }
body:not(.tv-body) .permission-choice small { font-size: 11px; color: var(--muted); line-height: 1.3; }
body:not(.tv-body) .permission-modal-form .permission-choice-grid { grid-template-columns: 1fr; }
body:not(.tv-body) .limited-operator-hero .dashboard-hero-actions { justify-content: flex-start; }
body:not(.tv-body) .limited-user-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) {
  body:not(.tv-body) .permission-choice-grid,
  body:not(.tv-body) .limited-user-quick-actions { grid-template-columns: 1fr; }
}


body:not(.tv-body) .modal.modal-health,
body:not(.tv-body) .modal.modal-medium.modal-health,
body:not(.tv-body) .modal:has(.health-modal-body) {
  width: min(860px, calc(100vw - 24px)) !important;
  max-height: min(90vh, 820px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 26px !important;
  border: 1px solid rgba(44, 92, 113, .10) !important;
  background: #ffffff !important;
  box-shadow: 0 32px 64px rgba(15, 23, 42, .22), 0 0 0 1px rgba(44, 92, 113, .10) !important;
}

body:not(.tv-body) .modal.modal-health {
  --health-primary: #2C5C71;
  --health-primary-dark: #21485A;
  --health-primary-light: #3E7890;
  --health-primary-soft: #E8F1F4;
  --health-primary-soft-2: #D6E5EA;
  --health-primary-border: #A9C7D2;
  --health-border: rgba(44, 92, 113, .13);
  --health-border-strong: rgba(44, 92, 113, .22);
  --health-text: #0f172a;
  --health-muted: #475569;
  --health-faint: #94a3b8;
  --health-surface: #ffffff;
  --health-surface-2: #f8fafc;
  --health-online: #16a34a;
  --health-online-bg: #f0fdf4;
  --health-online-border: #bbf7d0;
  --health-offline: #c2410c;
  --health-offline-bg: #fff7ed;
  --health-offline-border: #fed7aa;
  --health-warning: #b45309;
  --health-warning-bg: #fffbeb;
  --health-warning-border: #fde68a;
}

body:not(.tv-body) .modal.modal-health > .health-modal-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: initial !important;
  gap: 14px !important;
  min-height: 0 !important;
  padding: 18px 22px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--health-border) !important;
  border-radius: 0 !important;
  background: linear-gradient(135deg, #f0f6f8 0%, #e4eef2 100%) !important;
}

body:not(.tv-body) .modal.modal-health .modal-head-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  background: var(--health-primary-dark) !important;
  color: #ffffff !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-health .modal-head-icon .icon { width: 22px !important; height: 22px !important; }

body:not(.tv-body) .modal.modal-health .modal-head-info {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .modal-head-info h2 {
  display: block !important;
  margin: 0 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--health-primary-dark) !important;
  line-height: 1.2 !important;
}
body:not(.tv-body) .modal.modal-health .modal-head-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 3px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .modal-head-meta span:not(.status-badge) {
  font-size: 12px !important;
  color: var(--health-muted) !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .modal.modal-health .modal-head-meta .sep { color: var(--health-faint) !important; }

body:not(.tv-body) .modal.modal-health .close-btn {
  flex: 0 0 auto !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid var(--health-border-strong) !important;
  background: rgba(255, 255, 255, .7) !important;
  color: var(--health-muted) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 20px !important;
  line-height: 1 !important;
}
body:not(.tv-body) .modal.modal-health .close-btn:hover {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  color: #dc2626 !important;
}

body:not(.tv-body) .modal.modal-health .health-modal-body,
body:not(.tv-body) .modal.modal-health .screen-health-modal.health-modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 20px 22px 22px !important;
  margin: 0 !important;
  background: #ffffff !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--health-primary-border) transparent !important;
}
body:not(.tv-body) .modal.modal-health .health-modal-body::-webkit-scrollbar { width: 5px !important; }
body:not(.tv-body) .modal.modal-health .health-modal-body::-webkit-scrollbar-track { background: transparent !important; }
body:not(.tv-body) .modal.modal-health .health-modal-body::-webkit-scrollbar-thumb { background: var(--health-primary-border) !important; border-radius: 999px !important; }

body:not(.tv-body) .modal.modal-health .screen-identity {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border: 1px solid var(--health-primary-border) !important;
  border-radius: 14px !important;
  background: var(--health-primary-soft) !important;
}
body:not(.tv-body) .modal.modal-health .screen-identity-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .screen-identity-avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  background: var(--health-primary-dark) !important;
  color: #ffffff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .modal.modal-health .screen-identity b {
  display: block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--health-primary-dark) !important;
  line-height: 1.25 !important;
}
body:not(.tv-body) .modal.modal-health .screen-identity small {
  display: block !important;
  margin-top: 1px !important;
  font-size: 11.5px !important;
  color: var(--health-muted) !important;
  line-height: 1.35 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  max-width: 560px !important;
}
body:not(.tv-body) .modal.modal-health .screen-identity-actions {
  display: flex !important;
  gap: 7px !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-health .section-head {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 10px !important;
}
body:not(.tv-body) .modal.modal-health .section-head-icon,
body:not(.tv-body) .modal.modal-health .health-panel-header-icon,
body:not(.tv-body) .modal.modal-health .android-tv-mini-header-icon {
  display: grid !important;
  place-items: center !important;
  color: var(--health-primary-dark) !important;
  background: var(--health-primary-soft-2) !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .modal.modal-health .section-head-icon { width: 26px !important; height: 26px !important; border-radius: 8px !important; }
body:not(.tv-body) .modal.modal-health .section-head-icon .icon { width: 14px !important; height: 14px !important; }
body:not(.tv-body) .modal.modal-health .section-head b {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  color: var(--health-primary-dark) !important;
}
body:not(.tv-body) .modal.modal-health .section-head small {
  margin-left: auto !important;
  font-size: 11px !important;
  color: var(--health-muted) !important;
}

body:not(.tv-body) .modal.modal-health .health-panel,
body:not(.tv-body) .modal.modal-health .screen-health-panel.health-panel {
  display: block !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--health-border) !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  opacity: 1 !important;
}
body:not(.tv-body) .modal.modal-health .health-panel.status-online { border-color: var(--health-online-border) !important; }
body:not(.tv-body) .modal.modal-health .health-panel.status-offline { border-color: var(--health-offline-border) !important; }
body:not(.tv-body) .modal.modal-health .health-panel.status-disabled { border-color: var(--health-warning-border) !important; }

body:not(.tv-body) .modal.modal-health .health-panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 13px 16px 12px !important;
  border-bottom: 1px solid var(--health-border) !important;
  background: var(--health-surface-2) !important;
}
body:not(.tv-body) .modal.modal-health .health-panel.status-online .health-panel-header { background: var(--health-online-bg) !important; border-bottom-color: var(--health-online-border) !important; }
body:not(.tv-body) .modal.modal-health .health-panel.status-offline .health-panel-header { background: var(--health-offline-bg) !important; border-bottom-color: var(--health-offline-border) !important; }
body:not(.tv-body) .modal.modal-health .health-panel.status-disabled .health-panel-header { background: var(--health-warning-bg) !important; border-bottom-color: var(--health-warning-border) !important; }
body:not(.tv-body) .modal.modal-health .health-panel-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .health-panel-header-icon { width: 34px !important; height: 34px !important; border-radius: 11px !important; }
body:not(.tv-body) .modal.modal-health .health-panel-header-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .modal.modal-health .health-panel-header b,
body:not(.tv-body) .modal.modal-health .android-tv-mini-header b {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--health-text) !important;
  line-height: 1.25 !important;
}
body:not(.tv-body) .modal.modal-health .health-panel-header small,
body:not(.tv-body) .modal.modal-health .android-tv-mini-header small {
  display: block !important;
  margin-top: 1px !important;
  font-size: 11px !important;
  color: var(--health-muted) !important;
  line-height: 1.35 !important;
}

body:not(.tv-body) .modal.modal-health .health-grid,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1px !important;
  background: var(--health-border) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
body:not(.tv-body) .modal.modal-health .health-cell,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  min-height: 0 !important;
  padding: 14px 14px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .health-cell:hover,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span:hover { background: var(--health-primary-soft) !important; }
body:not(.tv-body) .modal.modal-health .health-cell-label,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span b {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  color: var(--health-muted) !important;
  line-height: 1.25 !important;
}
body:not(.tv-body) .modal.modal-health .health-cell-label .icon,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span .icon {
  width: 12px !important;
  height: 12px !important;
  color: var(--health-primary-light) !important;
  flex: 0 0 auto !important;
  grid-row: auto !important;
}
body:not(.tv-body) .modal.modal-health .health-cell-value,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span em {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  white-space: normal !important;
  text-overflow: clip !important;
  word-break: break-word !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  color: var(--health-text) !important;
  line-height: 1.3 !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .health-cell-value.muted,
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span em:empty {
  color: var(--health-faint) !important;
  font-weight: 500 !important;
  font-style: italic !important;
}

body:not(.tv-body) .modal.modal-health .android-tv-mini {
  border: 1px solid var(--health-border) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-health .android-tv-mini-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 12px 16px 11px !important;
  border-bottom: 1px solid var(--health-border) !important;
  background: var(--health-surface-2) !important;
}
body:not(.tv-body) .modal.modal-health .android-tv-mini-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-health .android-tv-mini-header-icon { width: 32px !important; height: 32px !important; border-radius: 10px !important; }
body:not(.tv-body) .modal.modal-health .android-tv-mini-header-icon .icon { width: 16px !important; height: 16px !important; }
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span { padding: 11px 13px !important; }
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span b { font-size: 9.5px !important; }
body:not(.tv-body) .modal.modal-health .android-tv-mini-grid span em { font-size: 11.5px !important; }

body:not(.tv-body) .modal.modal-health .health-error,
body:not(.tv-body) .modal.modal-health .dashboard-tv-health-error {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-top: 1px solid #fecaca !important;
  border-radius: 0 !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}
body:not(.tv-body) .modal.modal-health .health-error .icon,
body:not(.tv-body) .modal.modal-health .dashboard-tv-health-error .icon {
  width: 16px !important;
  height: 16px !important;
  margin-top: 1px !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-health .status-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: .03em !important;
  text-transform: none !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .modal.modal-health .status-badge .dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .modal.modal-health .badge-online { background: var(--health-online-bg) !important; color: var(--health-online) !important; border: 1px solid var(--health-online-border) !important; }
body:not(.tv-body) .modal.modal-health .badge-online .dot { background: #22c55e !important; box-shadow: 0 0 0 2px rgba(34,197,94,.25) !important; }
body:not(.tv-body) .modal.modal-health .badge-offline { background: var(--health-offline-bg) !important; color: var(--health-offline) !important; border: 1px solid var(--health-offline-border) !important; }
body:not(.tv-body) .modal.modal-health .badge-offline .dot { background: var(--health-offline) !important; }
body:not(.tv-body) .modal.modal-health .badge-disabled { background: var(--health-warning-bg) !important; color: var(--health-warning) !important; border: 1px solid var(--health-warning-border) !important; }
body:not(.tv-body) .modal.modal-health .badge-disabled .dot { background: #f59e0b !important; }

body:not(.tv-body) .modal.modal-health .health-modal-actions,
body:not(.tv-body) .modal.modal-health > .modal-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 22px 18px !important;
  margin: 0 !important;
  border-top: 1px solid var(--health-border) !important;
  background: var(--health-surface-2) !important;
}
body:not(.tv-body) .modal.modal-health .health-modal-actions .spacer { flex: 1 1 auto !important; }
body:not(.tv-body) .modal.modal-health .btn,
body:not(.tv-body) .modal.modal-health button.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 0 !important;
  padding: 7px 14px !important;
  border-radius: 10px !important;
  border: 1px solid var(--health-border-strong) !important;
  background: #ffffff !important;
  color: var(--health-text) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
body:not(.tv-body) .modal.modal-health .btn .icon { width: 14px !important; height: 14px !important; }
body:not(.tv-body) .modal.modal-health .btn:hover { background: var(--health-primary-soft) !important; border-color: var(--health-primary-border) !important; }
body:not(.tv-body) .modal.modal-health .btn-sm,
body:not(.tv-body) .modal.modal-health .btn.small { padding: 5px 10px !important; font-size: 11px !important; border-radius: 8px !important; }
body:not(.tv-body) .modal.modal-health .btn-sm .icon,
body:not(.tv-body) .modal.modal-health .btn.small .icon { width: 12px !important; height: 12px !important; }
body:not(.tv-body) .modal.modal-health .btn-primary,
body:not(.tv-body) .modal.modal-health .btn.primary {
  background: linear-gradient(135deg, var(--health-primary-dark), var(--health-primary-light)) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px rgba(44, 92, 113, .28) !important;
}
body:not(.tv-body) .modal.modal-health .btn-primary:hover,
body:not(.tv-body) .modal.modal-health .btn.primary:hover {
  filter: brightness(1.05) !important;
  box-shadow: 0 6px 20px rgba(44, 92, 113, .38) !important;
}
body:not(.tv-body) .modal.modal-health .btn-ghost,
body:not(.tv-body) .modal.modal-health .btn.ghost {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--health-muted) !important;
}
body:not(.tv-body) .modal.modal-health .btn-ghost:hover,
body:not(.tv-body) .modal.modal-health .btn.ghost:hover {
  background: var(--health-primary-soft) !important;
  border-color: var(--health-primary-border) !important;
  color: var(--health-primary-dark) !important;
}
body:not(.tv-body) .modal.modal-health .btn.is-loading { opacity: .7 !important; pointer-events: none !important; }

@media (max-width: 760px) {
  body:not(.tv-body) .modal.modal-health,
  body:not(.tv-body) .modal.modal-medium.modal-health,
  body:not(.tv-body) .modal:has(.health-modal-body) {
    width: min(94vw, calc(100vw - 16px)) !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px !important;
  }
  body:not(.tv-body) .modal.modal-health > .health-modal-head { padding: 14px 16px 12px !important; }
  body:not(.tv-body) .modal.modal-health .health-modal-body { padding: 14px 16px 16px !important; }
  body:not(.tv-body) .modal.modal-health .screen-identity { align-items: flex-start !important; flex-direction: column !important; }
  body:not(.tv-body) .modal.modal-health .screen-identity small { max-width: 100% !important; white-space: normal !important; }
  body:not(.tv-body) .modal.modal-health .screen-identity-actions { width: 100% !important; }
  body:not(.tv-body) .modal.modal-health .screen-identity-actions .btn { flex: 1 1 0 !important; }
  body:not(.tv-body) .modal.modal-health .health-grid,
  body:not(.tv-body) .modal.modal-health .android-tv-mini-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .modal.modal-health .health-modal-actions { padding: 12px 16px 16px !important; flex-wrap: wrap !important; }
  body:not(.tv-body) .modal.modal-health .health-modal-actions .spacer { display: none !important; }
  body:not(.tv-body) .modal.modal-health .health-modal-actions .btn { flex: 1 1 120px !important; }
}

@media (max-width: 480px) {
  body:not(.tv-body) .modal.modal-health .health-grid,
  body:not(.tv-body) .modal.modal-health .android-tv-mini-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .modal.modal-health .modal-head-meta { flex-wrap: wrap !important; }
}


body:not(.tv-body) .modal.modal-health > .screen-health-modal.health-modal-body:not(.modal-head):not(.pair-modal-head):not(.screen-upsert-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-preview-modal-head):not(.modal-action-bar):not(.modal-flow-fixed):not(.modal-actions):not(.health-modal-actions):not(.pair-wizard-shell) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 20px 22px 22px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-health > .modal-actions.health-modal-actions:not(.modal-head):not(.pair-modal-head):not(.screen-upsert-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-preview-modal-head):not(.modal-action-bar):not(.modal-flow-fixed):not(.pair-wizard-shell) {
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: auto !important;
  max-width: 100% !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 22px 18px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border-top: 1px solid var(--health-border, rgba(44,92,113,.13)) !important;
  background: var(--health-surface-2, #f8fafc) !important;
  border-radius: 0 0 26px 26px !important;
}

body:not(.tv-body) .modal.modal-health > .modal-actions.health-modal-actions .spacer {
  flex: 1 1 auto !important;
}


body:not(.tv-body) .modal > :not(.modal-head):not(.pair-modal-head):not(.screen-upsert-head):not(.android-tv-modal-head):not(.android-tv-schedule-head):not(.screen-preview-modal-head):not(.modal-action-bar):not(.modal-flow-fixed):not(.modal-actions):not(.health-modal-actions):not(.pair-wizard-shell):not(.screen-health-modal) {
  padding: clamp(16px, 2vw, 24px) clamp(18px, 2.4vw, 28px) 24px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}


body:not(.tv-body) .modal.modal-wide.modal-smart-slide,
body:not(.tv-body) .modal.modal-smart-slide {
  width: min(1200px, calc(100vw - 24px)) !important;
  height: min(90dvh, 860px) !important;
  max-height: min(90dvh, 860px) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid rgba(44,92,113,.10) !important;
  box-shadow: 0 40px 80px rgba(15,23,42,.26), 0 0 0 1px rgba(44,92,113,.08) !important;
}

body:not(.tv-body) .modal.modal-smart-slide > .modal-head.smart-slide-ui-head {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  min-height: 75px !important;
  padding: 16px 22px 14px !important;
  margin: 0 !important;
  border-radius: 24px 24px 0 0 !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
  background: linear-gradient(135deg, #f0f6f8, #e4eef2) !important;
  color: #0f172a !important;
  box-shadow: none !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-head-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 6px 16px rgba(44,92,113,.28) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-head-icon .icon {
  width: 22px !important;
  height: 22px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-head-copy {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-head-copy h2 {
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-head-copy p {
  margin: 0 !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide > .modal-head .close-btn {
  margin-left: auto !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(44,92,113,.22) !important;
  background: rgba(255,255,255,.72) !important;
  color: #475569 !important;
  font-size: 20px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide > .modal-head .close-btn:hover {
  background: #fee2e2 !important;
  color: #dc2626 !important;
  border-color: #fca5a5 !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-smart-slide > form.smart-slide-ui-form {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #ffffff !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-ui-form > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-layout,
body:not(.tv-body) .modal.modal-smart-slide .smart-form-layout {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(440px, .92fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields,
body:not(.tv-body) .modal.modal-smart-slide .smart-designer-scroll-fields,
body:not(.tv-body) .modal.modal-smart-slide .smart-form-fields {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 18px 16px 18px 20px !important;
  border-right: 1px solid rgba(44,92,113,.12) !important;
  background: #ffffff !important;
  display: grid !important;
  grid-auto-rows: max-content !important;
  gap: 12px !important;
  align-content: start !important;
  scrollbar-width: thin !important;
  scrollbar-color: #A9C7D2 transparent !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields::-webkit-scrollbar,
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel::-webkit-scrollbar,
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor::-webkit-scrollbar {
  width: 5px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields::-webkit-scrollbar-track,
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel::-webkit-scrollbar-track,
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor::-webkit-scrollbar-track {
  background: transparent !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields::-webkit-scrollbar-thumb,
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel::-webkit-scrollbar-thumb,
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor::-webkit-scrollbar-thumb {
  background: #A9C7D2 !important;
  border-radius: 99px !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section {
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  gap: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section:focus-within {
  box-shadow: 0 0 0 2px rgba(44,92,113,.16) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head,
body:not(.tv-body) .modal.modal-smart-slide .smart-section-title.smart-ui-section-head {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 12px 14px 11px !important;
  margin: 0 !important;
  background: linear-gradient(180deg, #fafcfd, #f3f8fa) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head > span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 4px 10px rgba(44,92,113,.20) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head > span .icon {
  width: 16px !important;
  height: 16px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head div {
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head b {
  display: block !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head small {
  display: block !important;
  margin-top: 1px !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section > :not(.smart-ui-section-head):not(input[type="hidden"]) {
  margin-left: 14px !important;
  margin-right: 14px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section > .smart-ui-section-head + :not(input[type="hidden"]) {
  margin-top: 14px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section > :not(.smart-ui-section-head):not(input[type="hidden"]) + :not(input[type="hidden"]) {
  margin-top: 12px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section > :last-child:not(.smart-ui-section-head) {
  margin-bottom: 14px !important;
}

body:not(.tv-body) .modal.modal-smart-slide .form-row {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .form-row label,
body:not(.tv-body) .modal.modal-smart-slide label:not(.btn):not(.switch-card):not(.smart-color-chip-field):not(.smart-editor-colour-btn) {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .input,
body:not(.tv-body) .modal.modal-smart-slide select.input,
body:not(.tv-body) .modal.modal-smart-slide input.input {
  width: 100% !important;
  min-height: 38px !important;
  padding: 7px 11px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(44,92,113,.18) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-family: inherit !important;
  font-weight: 500 !important;
  box-shadow: none !important;
  outline: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .input:focus {
  border-color: #2C5C71 !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.16) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-big-title-input {
  min-height: 44px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-help-tip {
  display: inline-grid !important;
  place-items: center !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 99px !important;
  background: #D6E5EA !important;
  color: #21485A !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  cursor: help !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-template-grid,
body:not(.tv-body) .modal.modal-smart-slide .smart-image-primary-grid,
body:not(.tv-body) .modal.modal-smart-slide .smart-qr-fields,
body:not(.tv-body) .modal.modal-smart-slide .smart-badge-style-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .grid.grid-3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 10px !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-badge-style-card,
body:not(.tv-body) .modal.modal-smart-slide .smart-title-style-card,
body:not(.tv-body) .modal.modal-smart-slide .smart-upload-status,
body:not(.tv-body) .modal.modal-smart-slide .smart-custom-slide-name-row {
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 13px !important;
  background: #f8fafc !important;
  padding: 12px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-section-mini-title {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 0 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-section-mini-title .icon {
  width: 13px !important;
  height: 13px !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-section-mini-title small {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-style-grid-clean,
body:not(.tv-body) .modal.modal-smart-slide .smart-title-style-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-colour-grid,
body:not(.tv-body) .modal.modal-smart-slide .smart-colour-grid-ui {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 8px !important;
  margin-bottom: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-color-chip-field {
  height: 44px !important;
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 0 10px 0 8px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(44,92,113,.22) !important;
  background: #ffffff !important;
  cursor: pointer !important;
  box-shadow: none !important;
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-color-chip-field:hover {
  border-color: #2C5C71 !important;
  background: #E8F1F4 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-color-chip-field span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  line-height: 1.2 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-color-chip-field input[type="color"],
body:not(.tv-body) .modal.modal-smart-slide .smart-editor-colour-btn input[type="color"] {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  border-radius: 50% !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-rich-editor-shell {
  border: 1px solid rgba(44,92,113,.22) !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 2px !important;
  padding: 7px 8px !important;
  background: linear-gradient(180deg, #f8fafc, #eef6f8) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button,
body:not(.tv-body) .modal.modal-smart-slide .smart-editor-colour-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 0 !important;
  padding: 4px 7px !important;
  border-radius: 7px !important;
  border: 0 !important;
  background: transparent !important;
  color: #475569 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button:hover,
body:not(.tv-body) .modal.modal-smart-slide .smart-editor-colour-btn:hover {
  background: #E8F1F4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .toolbar-divider {
  width: 1px !important;
  min-height: 22px !important;
  background: rgba(44,92,113,.22) !important;
  margin: 2px 3px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor {
  min-height: 100px !important;
  max-height: 180px !important;
  padding: 11px 12px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  outline: none !important;
  overflow-y: auto !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-image-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-upload-btn {
  border: 1.5px dashed #A9C7D2 !important;
  background: rgba(44,92,113,.04) !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-upload-btn:hover {
  background: #E8F1F4 !important;
  border-color: #2C5C71 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-upload-status {
  color: #94a3b8 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

body:not(.tv-body) .modal.modal-smart-slide .switch-card {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-height: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 13px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
body:not(.tv-body) .modal.modal-smart-slide .switch-card .switch-label b {
  display: block !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}
body:not(.tv-body) .modal.modal-smart-slide .switch-card .switch-label small {
  display: block !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-qr-fields {
  opacity: .4 !important;
  pointer-events: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-qr-panel.qr-enabled .smart-qr-fields {
  opacity: 1 !important;
  pointer-events: auto !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-quick-date-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-quick-date-row .btn,
body:not(.tv-body) .modal.modal-smart-slide .btn.small {
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 5px 10px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-preview-panel,
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel {
  position: static !important;
  align-self: stretch !important;
  min-height: 0 !important;
  max-width: none !important;
  width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-auto-rows: max-content !important;
  gap: 10px !important;
  padding: 16px 18px !important;
  background: #f8fafc !important;
  box-sizing: border-box !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-toolbar {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-toolbar span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-toolbar span .icon {
  width: 15px !important;
  height: 15px !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-toolbar small {
  font-size: 10.5px !important;
  font-weight: 500 !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-actions {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  gap: 6px !important;
  justify-content: flex-end !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-slide-admin-preview,
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-canvas-wrap {
  grid-column: 1 / -1 !important;
  aspect-ratio: 16 / 9 !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #e8edf0, #d4dce0) !important;
  padding: 12px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-admin-slide.smart-render-canvas {
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(15,23,42,.28) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-preview-help {
  grid-column: 1 / -1 !important;
  padding: 8px 11px !important;
  border-radius: 11px !important;
  background: rgba(44,92,113,.08) !important;
  color: #536878 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

body:not(.tv-body) .modal.modal-smart-slide .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 38px !important;
  padding: 8px 16px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(44,92,113,.22) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn .icon {
  width: 15px !important;
  height: 15px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn:hover {
  background: #E8F1F4 !important;
  border-color: #A9C7D2 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn.primary {
  color: #ffffff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 5px 16px rgba(44,92,113,.28) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn.primary:hover {
  filter: brightness(1.06) !important;
  box-shadow: 0 8px 22px rgba(44,92,113,.38) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn.ghost {
  background: transparent !important;
  border-color: transparent !important;
  color: #475569 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .btn.ghost:hover {
  background: #E8F1F4 !important;
  border-color: #A9C7D2 !important;
  color: #21485A !important;
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer,
body:not(.tv-body) .modal.modal-smart-slide .smart-designer-actions.modal-action-bar.smart-ui-footer {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  width: 100% !important;
  padding: 14px 22px 16px !important;
  margin: 0 !important;
  border-top: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 0 0 24px 24px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer::before {
  display: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer .spacer {
  flex: 1 1 auto !important;
  min-width: 12px !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer .btn {
  min-width: 0 !important;
  min-height: 38px !important;
}

@media (max-width: 980px) {
  body:not(.tv-body) .modal.modal-smart-slide {
    height: auto !important;
    max-height: calc(100dvh - 16px) !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-ui-layout,
  body:not(.tv-body) .modal.modal-smart-slide .smart-form-layout {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-ui-fields,
  body:not(.tv-body) .modal.modal-smart-slide .smart-form-fields {
    height: auto !important;
    overflow: visible !important;
    border-right: 0 !important;
    padding: 14px 16px !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel {
    border-top: 1px solid rgba(44,92,113,.12) !important;
    overflow: visible !important;
  }
}
@media (max-width: 640px) {
  body:not(.tv-body) .modal.modal-smart-slide .smart-template-grid,
  body:not(.tv-body) .modal.modal-smart-slide .smart-image-primary-grid,
  body:not(.tv-body) .modal.modal-smart-slide .smart-qr-fields,
  body:not(.tv-body) .modal.modal-smart-slide .smart-badge-style-grid,
  body:not(.tv-body) .modal.modal-smart-slide .grid.grid-3,
  body:not(.tv-body) .modal.modal-smart-slide .smart-style-grid-clean,
  body:not(.tv-body) .modal.modal-smart-slide .smart-title-style-grid,
  body:not(.tv-body) .modal.modal-smart-slide .smart-colour-grid,
  body:not(.tv-body) .modal.modal-smart-slide .smart-colour-grid-ui {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-preview-panel {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-preview-actions {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-content: flex-start !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer {
    padding: 12px 14px 14px !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer .spacer {
    display: none !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-ui-footer .btn {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
}

body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head {
  cursor: pointer !important;
  user-select: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section-head::after {
  content: "⌄" !important;
  width: 20px !important;
  height: 20px !important;
  display: grid !important;
  place-items: center !important;
  margin-left: auto !important;
  color: #94a3b8 !important;
  font-size: 18px !important;
  line-height: 1 !important;
  transition: transform .2s ease !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section.open .smart-ui-section-head::after {
  transform: rotate(180deg) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-ui-section:not(.open) > :not(.smart-ui-section-head) {
  display: none !important;
}


body:not(.tv-body) .modal.modal-smart-slide .smart-rich-editor-shell {
  border: 1px solid rgba(44,92,113,.18) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.9), 0 10px 24px rgba(15,23,42,.04) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar {
  display: flex !important;
  align-items: center !important;
  align-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  row-gap: 8px !important;
  padding: 10px 12px !important;
  min-height: 54px !important;
  background: linear-gradient(180deg, #f8fbfc 0%, #eef6f8 100%) !important;
  border-bottom: 1px solid rgba(44,92,113,.14) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-toolbar-group {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .toolbar-divider {
  flex: 0 0 1px !important;
  align-self: stretch !important;
  width: 1px !important;
  min-height: 26px !important;
  margin: 3px 2px !important;
  background: rgba(44,92,113,.18) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 10px !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #42546a !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button .icon,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn .icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button:hover,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn:hover {
  background: #E8F1F4 !important;
  border-color: #A9C7D2 !important;
  color: #21485A !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn {
  padding-right: 7px !important;
  background: rgba(255,255,255,.7) !important;
  border-color: rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn input[type="color"] {
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  padding: 0 !important;
  margin-left: 2px !important;
  border-radius: 999px !important;
  border: 2px solid #ffffff !important;
  background: transparent !important;
  box-shadow: 0 0 0 1px rgba(44,92,113,.22), 0 3px 8px rgba(15,23,42,.12) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button.smart-colour-swatch,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour] {
  position: relative !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  border: 2px solid #ffffff !important;
  background: var(--smart-quick-colour, #ffffff) !important;
  box-shadow: 0 0 0 1px rgba(44,92,113,.22), 0 4px 10px rgba(15,23,42,.13) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button.smart-colour-swatch > span,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour] > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button.smart-colour-swatch:hover,
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 0 0 2px rgba(44,92,113,.18), 0 8px 14px rgba(15,23,42,.18) !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour="#ffffff"] { --smart-quick-colour: #ffffff !important; }
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour="#fbbf24"] { --smart-quick-colour: #fbbf24 !important; }
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour="#60a5fa"] { --smart-quick-colour: #60a5fa !important; }
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour="#22c55e"] { --smart-quick-colour: #22c55e !important; }
body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button[data-smart-colour="#ef4444"] { --smart-quick-colour: #ef4444 !important; }
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor {
  min-height: 150px !important;
  padding: 18px 18px !important;
  color: #0f172a !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  background: #ffffff !important;
}
body:not(.tv-body) .modal.modal-smart-slide .smart-message-rich-editor:empty::before {
  content: attr(data-placeholder) !important;
  color: #94a3b8 !important;
  font-weight: 600 !important;
  pointer-events: none !important;
}

/* Admin-wide modern colour inputs. Native picker popup is controlled by the browser/OS; these rules modernise every in-page colour picker trigger. */
body:not(.tv-body) input[type="color"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  inline-size: 38px !important;
  block-size: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  padding: 4px !important;
  border: 1px solid rgba(44,92,113,.20) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 4px 12px rgba(15,23,42,.08) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  vertical-align: middle !important;
}
body:not(.tv-body) input[type="color"]:hover {
  border-color: #A9C7D2 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 6px 16px rgba(44,92,113,.14) !important;
}
body:not(.tv-body) input[type="color"]:focus,
body:not(.tv-body) input[type="color"]:focus-visible {
  outline: none !important;
  border-color: #2C5C71 !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.16), 0 6px 16px rgba(44,92,113,.16) !important;
}
body:not(.tv-body) input[type="color"]::-webkit-color-swatch-wrapper { padding: 0 !important; }
body:not(.tv-body) input[type="color"]::-webkit-color-swatch {
  border: 0 !important;
  border-radius: 9px !important;
}
body:not(.tv-body) input[type="color"]::-moz-color-swatch {
  border: 0 !important;
  border-radius: 9px !important;
}
body:not(.tv-body) .smart-color-chip-field input[type="color"],
body:not(.tv-body) .smart-editor-colour-btn input[type="color"],
body:not(.tv-body) .modern-color-picker {
  inline-size: 26px !important;
  block-size: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  border: 2px solid #ffffff !important;
  background: transparent !important;
  box-shadow: 0 0 0 1px rgba(44,92,113,.22), 0 4px 10px rgba(15,23,42,.13) !important;
}
body:not(.tv-body) .modern-color-picker {
  inline-size: 46px !important;
  block-size: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  padding: 3px !important;
}
@media (max-width: 760px) {
  body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar {
    padding: 9px !important;
    gap: 6px !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar button,
  body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .smart-editor-colour-btn {
    height: 32px !important;
    min-height: 32px !important;
    font-size: 11.5px !important;
    padding-inline: 8px !important;
  }
  body:not(.tv-body) .modal.modal-smart-slide .smart-rich-toolbar .toolbar-divider {
    display: none !important;
  }
}


body:not(.tv-body) .modal.modal-qr-slide,
body:not(.tv-body) .modal.modal-dashboard-slide {
  width: min(1180px, calc(100vw - 28px)) !important;
  max-height: min(92dvh, 860px) !important;
  border-radius: 26px !important;
  background: #ffffff !important;
  box-shadow: 0 34px 80px rgba(15, 23, 42, .28), 0 0 0 1px rgba(44,92,113,.10) !important;
}

body:not(.tv-body) .modal.modal-qr-slide > .qd-head,
body:not(.tv-body) .modal.modal-dashboard-slide > .qd-head {
  min-height: 74px !important;
  padding: 16px 22px 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-radius: 26px 26px 0 0 !important;
  border-bottom: 1px solid rgba(44,92,113,.14) !important;
  background: linear-gradient(135deg, #f0f6f8 0%, #e4eef2 100%) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head-icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 8px 20px rgba(44,92,113,.28) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head-icon .icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-icon .icon {
  width: 22px !important;
  height: 22px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head-text,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-text {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head-text h2,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-text h2 {
  margin: 0 !important;
  color: #21485A !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
  line-height: 1.18 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head-text p,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-text p {
  margin: 3px 0 0 !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head .close-btn,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head .close-btn {
  width: 36px !important;
  height: 36px !important;
  border-radius: 12px !important;
  margin-left: auto !important;
  border: 1px solid rgba(44,92,113,.20) !important;
  background: rgba(255,255,255,.76) !important;
  color: #334155 !important;
  box-shadow: none !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-head .close-btn:hover,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-head .close-btn:hover {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  color: #dc2626 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-modal-form.modal-flow-fixed,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-modal-form.modal-flow-fixed {
  background: #fff !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-modal-form > .modal-scroll-pane,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-modal-form > .modal-scroll-pane {
  padding: 0 !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-modal-body,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-modal-body {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.02fr) minmax(390px, .98fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
  min-height: 0 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-fields-panel,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-fields-panel {
  min-width: 0 !important;
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
  padding: 18px 16px 20px 22px !important;
  border-right: 1px solid rgba(44,92,113,.12) !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-panel,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-panel {
  min-width: 0 !important;
  padding: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  background: #f8fafc !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section {
  overflow: hidden !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.045) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section:focus-within,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section:focus-within {
  box-shadow: 0 0 0 3px rgba(44,92,113,.13), 0 10px 26px rgba(15,23,42,.05) !important;
  border-color: rgba(44,92,113,.28) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-head,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-head {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
  background: linear-gradient(180deg, #fbfdfe, #f1f7f9) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
  flex: 0 0 auto !important;
  display: grid !important;
  place-items: center !important;
  color: #21485A !important;
  background: #D6E5EA !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-icon .icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-icon .icon {
  width: 16px !important;
  height: 16px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-head b,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-head b {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #21485A !important;
  letter-spacing: -.01em !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-head small,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-head small {
  display: block !important;
  margin-top: 2px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  line-height: 1.3 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-section-body,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-section-body {
  display: grid !important;
  gap: 12px !important;
  padding: 14px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-row,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-row {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-row label,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-row label {
  margin: 0 !important;
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-input,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  padding: 8px 12px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(44,92,113,.18) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 550 !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color .14s ease, box-shadow .14s ease !important;
}

body:not(.tv-body) .modal.modal-qr-slide textarea.qd-input,
body:not(.tv-body) .modal.modal-dashboard-slide textarea.qd-input {
  min-height: 104px !important;
  resize: vertical !important;
  line-height: 1.5 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-title-input,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-title-input {
  min-height: 46px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-input:focus,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-input:focus {
  border-color: #2C5C71 !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.16) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-input-with-icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-input-with-icon {
  position: relative !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-input-with-icon > .icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-input-with-icon > .icon {
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 15px !important;
  height: 15px !important;
  color: #3E7890 !important;
  pointer-events: none !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-input-with-icon .qd-input,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-input-with-icon .qd-input {
  padding-left: 36px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-help,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-help {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-grid-3,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-grid-3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-grid,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip {
  min-width: 0 !important;
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(44,92,113,.16) !important;
  background: #f8fafc !important;
  cursor: pointer !important;
  transition: background .14s ease, border-color .14s ease, transform .12s ease !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip:hover,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip:hover {
  transform: translateY(-1px) !important;
  background: #E8F1F4 !important;
  border-color: #A9C7D2 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip input[type="color"],
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip input[type="color"] {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
  padding: 0 !important;
  border: 3px solid #ffffff !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: 0 0 0 1px rgba(44,92,113,.24), 0 8px 16px rgba(15,23,42,.10) !important;
  cursor: pointer !important;
  overflow: hidden !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip input[type="color"]::-webkit-color-swatch-wrapper,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip input[type="color"]::-webkit-color-swatch-wrapper { padding: 0 !important; }
body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip input[type="color"]::-webkit-color-swatch,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip input[type="color"]::-webkit-color-swatch { border: 0 !important; border-radius: 999px !important; }

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip span,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip span {
  min-width: 0 !important;
  display: grid !important;
  gap: 1px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip b,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip b {
  color: #1f3341 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-colour-chip small,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-chip small {
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-switch {
  align-items: center !important;
  gap: 11px !important;
  padding: 11px 12px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-switch input {
  width: 38px !important;
  height: 22px !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-switch span {
  display: grid !important;
  gap: 1px !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-switch b {
  color: #0f172a !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-switch small {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-topbar,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-topbar b,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-topbar b {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #21485A !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-topbar .icon,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-topbar .icon {
  width: 15px !important;
  height: 15px !important;
  color: #2C5C71 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-topbar small,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-topbar small {
  display: block !important;
  margin-top: 2px !important;
  color: #64748b !important;
  font-size: 11px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-pill,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-pill {
  border-radius: 999px !important;
  padding: 5px 10px !important;
  border: 1px solid #A9C7D2 !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-stage,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-stage {
  width: 100% !important;
  min-height: 430px !important;
  flex: 1 1 auto !important;
  border-radius: 20px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.70) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-tip,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-tip {
  padding: 10px 12px !important;
  border-radius: 13px !important;
  background: rgba(44,92,113,.08) !important;
  color: #536878 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.42 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-tip b,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-tip b { color: #21485A !important; }

body:not(.tv-body) .modal.modal-qr-slide .qd-qr-preview-card {
  max-width: 430px !important;
  min-height: 390px !important;
  padding: 26px !important;
  border-radius: 28px !important;
  display: grid !important;
  align-content: center !important;
  gap: 14px !important;
  text-align: center !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-badge {
  justify-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--qr-accent, #2C5C71) 12%, #ffffff) !important;
  color: var(--qr-accent, #2C5C71) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-preview-badge .icon {
  width: 14px !important;
  height: 14px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-qr-preview-card h3 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: clamp(22px, 2.5vw, 32px) !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
  line-height: 1.08 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-qr-preview-card p {
  margin: 0 !important;
  color: #334155 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.42 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-qr-preview-image {
  width: 190px !important;
  height: 190px !important;
  border-radius: 24px !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-qr-preview-card small {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-dashboard-preview-card {
  width: min(100%, 560px) !important;
  min-height: 380px !important;
  border-radius: 24px !important;
  padding: 16px !important;
  background: radial-gradient(circle at 88% 8%, rgba(62,120,144,.26), transparent 30%), #0f172a !important;
  display: grid !important;
  gap: 12px !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-dashboard-preview-screen {
  min-height: 305px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: #e2e8f0 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-browser-bar {
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 12px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid rgba(15,23,42,.10) !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-browser-bar i {
  width: 9px !important;
  height: 9px !important;
  flex: 0 0 auto !important;
  border-radius: 999px !important;
  background: #cbd5e1 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-browser-bar span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-dashboard-canvas {
  min-height: 270px !important;
  padding: 22px !important;
  display: grid !important;
  gap: 12px !important;
  align-content: start !important;
  background:
    linear-gradient(90deg, rgba(44,92,113,.12), transparent),
    #f8fafc !important;
  transform-origin: top left !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-dashboard-canvas strong {
  color: #0f172a !important;
  font-size: 22px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-dashboard-canvas span {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-fake-dashboard-canvas div {
  min-height: 42px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, rgba(44,92,113,.14), rgba(148,163,184,.14)) !important;
  border: 1px solid rgba(15,23,42,.08) !important;
}

body:not(.tv-body) .modal.modal-dashboard-slide .qd-dashboard-preview-card p {
  margin: 0 !important;
  color: #cbd5e1 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-footer,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-footer {
  padding: 14px 22px 16px !important;
  gap: 10px !important;
  border-top: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 0 0 26px 26px !important;
  background: #f8fafc !important;
  box-shadow: 0 -12px 24px rgba(15,23,42,.055) !important;
}

body:not(.tv-body) .modal.modal-qr-slide .qd-footer .modal-action-note,
body:not(.tv-body) .modal.modal-dashboard-slide .qd-footer .modal-action-note {
  color: #64748b !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

@media (max-width: 980px) {
  body:not(.tv-body) .modal.modal-qr-slide,
  body:not(.tv-body) .modal.modal-dashboard-slide {
    width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 22px !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide > .qd-head,
  body:not(.tv-body) .modal.modal-dashboard-slide > .qd-head {
    border-radius: 22px 22px 0 0 !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-modal-body,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-modal-body {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-fields-panel,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-fields-panel {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(44,92,113,.12) !important;
    padding: 16px !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-preview-panel,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-panel {
    padding: 16px !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-preview-stage,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-stage {
    min-height: 360px !important;
  }
}

@media (max-width: 680px) {
  body:not(.tv-body) .modal.modal-qr-slide .qd-head-text p,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-head-text p {
    display: none !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-colour-grid,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-colour-grid,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-grid-3 {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-preview-topbar,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-preview-topbar {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
  body:not(.tv-body) .modal.modal-qr-slide .qd-footer,
  body:not(.tv-body) .modal.modal-dashboard-slide .qd-footer {
    padding: 12px 14px 14px !important;
  }
}


body:not(.tv-body) .modal.modal-screen-upsert {
  width: min(920px, calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
  border-radius: 26px !important;
  background: #ffffff !important;
  box-shadow: 0 36px 78px rgba(15, 23, 42, .28), 0 0 0 1px rgba(44, 92, 113, .10) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert > .screen-upsert-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-height: 76px !important;
  padding: 16px 22px 15px !important;
  border-radius: 26px 26px 0 0 !important;
  border-bottom: 1px solid rgba(44, 92, 113, .14) !important;
  background: linear-gradient(135deg, #f0f6f8 0%, #e5eef2 100%) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-title {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-head-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 15px !important;
  display: grid !important;
  place-items: center !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 8px 18px rgba(44, 92, 113, .28) !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-head-icon .icon {
  width: 22px !important;
  height: 22px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-title h2 {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
  color: #21485A !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-title p {
  margin: 3px 0 0 !important;
  max-width: 660px !important;
  color: #475569 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .close-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(44, 92, 113, .18) !important;
  background: rgba(255,255,255,.72) !important;
  color: #475569 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .close-btn:hover {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  color: #dc2626 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert > .edit-screen-url {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 12px 22px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(44, 92, 113, .10) !important;
  border-radius: 0 !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}

body:not(.tv-body) .modal.modal-screen-upsert > .edit-screen-url span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

body:not(.tv-body) .modal.modal-screen-upsert > .edit-screen-url code {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  padding: 8px 11px !important;
  border-radius: 11px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-size: 12px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert > .screen-upsert-form.modal-flow-fixed {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 18px 22px 20px !important;
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
  scrollbar-width: thin !important;
  scrollbar-color: #A9C7D2 transparent !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane::-webkit-scrollbar {
  width: 6px !important;
}
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane::-webkit-scrollbar-track {
  background: transparent !important;
}
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane::-webkit-scrollbar-thumb {
  background: #A9C7D2 !important;
  border-radius: 99px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro {
  margin: 0 !important;
  padding: 13px 15px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  border-radius: 18px !important;
  border: 1px solid #A9C7D2 !important;
  background: linear-gradient(135deg, #E8F1F4 0%, #f8fbfc 100%) !important;
  box-shadow: 0 8px 20px rgba(44, 92, 113, .07) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro > span {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: #21485A !important;
  box-shadow: 0 7px 16px rgba(44, 92, 113, .22) !important;
  flex: 0 0 auto !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro .icon {
  width: 19px !important;
  height: 19px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro b {
  display: block !important;
  color: #21485A !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-intro small {
  display: block !important;
  margin-top: 3px !important;
  color: #475569 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-steps {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  padding: 0 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn {
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 10px !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #ffffff !important;
  color: #334155 !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .035) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn:hover {
  transform: translateY(-1px) !important;
  border-color: #A9C7D2 !important;
  background: #f8fbfc !important;
  box-shadow: 0 12px 22px rgba(15, 23, 42, .07) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn b {
  width: 32px !important;
  height: 32px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  color: #21485A !important;
  background: #E8F1F4 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn span {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
  color: #0f172a !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn small {
  display: block !important;
  color: #64748b !important;
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn.active {
  border-color: #A9C7D2 !important;
  background: linear-gradient(135deg, #f0f6f8, #e8f1f4) !important;
  box-shadow: 0 12px 24px rgba(44, 92, 113, .12) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-step-btn.active b {
  color: #ffffff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-section {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #ffffff !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .045) !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-section-title {
  margin: 0 !important;
  padding: 13px 15px 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  border-bottom: 1px solid rgba(44, 92, 113, .12) !important;
  background: linear-gradient(180deg, #fbfdfe, #f3f8fa) !important;
  color: #21485A !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .065em !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-section-title .icon {
  width: 16px !important;
  height: 16px !important;
  color: #2C5C71 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-grid,
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-grid.two,
body:not(.tv-body) .modal.modal-screen-upsert .screen-review-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 14px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .form-row {
  display: grid !important;
  gap: 6px !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .form-row label {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin: 0 !important;
  color: #475569 !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .055em !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .required-dot {
  color: #dc2626 !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .input,
body:not(.tv-body) .modal.modal-screen-upsert .select,
body:not(.tv-body) .modal.modal-screen-upsert .textarea {
  width: 100% !important;
  min-height: 40px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(44, 92, 113, .18) !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: border-color .14s ease, box-shadow .14s ease, background .14s ease !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .input:focus,
body:not(.tv-body) .modal.modal-screen-upsert .select:focus,
body:not(.tv-body) .modal.modal-screen-upsert .textarea:focus {
  border-color: #2C5C71 !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(44, 92, 113, .16) !important;
  outline: none !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .field-help,
body:not(.tv-body) .modal.modal-screen-upsert .form-row small {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-review-card {
  margin: 0 !important;
  padding: 13px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44, 92, 113, .13) !important;
  background: #f8fafc !important;
  min-width: 0 !important;
  box-shadow: none !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-review-card b {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 0 7px !important;
  color: #21485A !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-review-card code {
  display: block !important;
  width: 100% !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #ffffff !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .setting-toggle.inline {
  margin: 0 !important;
  padding: 10px 11px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(44, 92, 113, .13) !important;
  background: #ffffff !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 14px 22px 16px !important;
  border-radius: 0 0 26px 26px !important;
  border-top: 1px solid rgba(44, 92, 113, .12) !important;
  background: #f8fafc !important;
  box-shadow: 0 -12px 24px rgba(15, 23, 42, .055) !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 9px !important;
  flex-wrap: wrap !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .btn {
  min-height: 40px !important;
  min-width: 112px !important;
  justify-content: center !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  border-radius: 11px !important;
}

body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .btn.primary,
body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .wizard-submit {
  min-width: 142px !important;
}

@media (max-width: 860px) {
  body:not(.tv-body) .modal.modal-screen-upsert {
    width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 22px !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert > .screen-upsert-head {
    border-radius: 22px 22px 0 0 !important;
    padding: 14px 16px 13px !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-title p {
    display: none !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert > .edit-screen-url {
    grid-template-columns: 1fr !important;
    padding: 12px 16px !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-form > .modal-scroll-pane {
    padding: 14px 16px 16px !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-grid,
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-grid.two,
  body:not(.tv-body) .modal.modal-screen-upsert .screen-review-grid {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar {
    padding: 12px 16px 14px !important;
    border-radius: 0 0 22px 22px !important;
  }
}

@media (max-width: 560px) {
  body:not(.tv-body) .modal.modal-screen-upsert .screen-wizard-steps {
    grid-template-columns: 1fr !important;
  }
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .btn,
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .btn.primary,
  body:not(.tv-body) .modal.modal-screen-upsert .screen-upsert-actions.modal-action-bar .wizard-submit {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}


body:not(.tv-body) .cleanup-modern-page {
  --cleanup-primary: #2C5C71;
  --cleanup-primary-dark: #21485A;
  --cleanup-primary-light: #3E7890;
  --cleanup-soft: #E8F1F4;
  --cleanup-soft-2: #D6E5EA;
  --cleanup-border: rgba(44, 92, 113, .14);
  --cleanup-border-strong: rgba(44, 92, 113, .24);
  --cleanup-text: #0f172a;
  --cleanup-muted: #64748b;
  display: grid !important;
  gap: 14px !important;
  padding: 0 !important;
}

body:not(.tv-body) .cleanup-modern-page .card,
body:not(.tv-body) .cleanup-modern-page .cleanup-modern-hero,
body:not(.tv-body) .cleanup-modern-page .cleanup-health-shell,
body:not(.tv-body) .cleanup-modern-page .cleanup-review-card {
  border: 1px solid var(--cleanup-border) !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .06) !important;
  overflow: hidden !important;
}

body:not(.tv-body) .cleanup-modern-hero {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 330px) !important;
  gap: 16px !important;
  align-items: stretch !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 12% 15%, rgba(44, 92, 113, .13), transparent 34%),
    linear-gradient(135deg, #f8fbfc 0%, #e9f2f5 100%) !important;
}
body:not(.tv-body) .cleanup-modern-hero::after {
  content: '';
  position: absolute;
  inset: auto -120px -160px auto;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: rgba(44, 92, 113, .08);
  pointer-events: none;
}
body:not(.tv-body) .cleanup-hero-copy {
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
}
body:not(.tv-body) .cleanup-kicker,
body:not(.tv-body) .cleanup-hero-badges span,
body:not(.tv-body) .cleanup-status-pill,
body:not(.tv-body) .cleanup-count-pill,
body:not(.tv-body) .cleanup-usage-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1 !important;
}
body:not(.tv-body) .cleanup-kicker {
  width: max-content !important;
  max-width: 100% !important;
  padding: 6px 11px !important;
  border: 1px solid rgba(169, 199, 210, .75) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .72) !important;
  color: var(--cleanup-primary-dark) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
}
body:not(.tv-body) .cleanup-kicker .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .cleanup-hero-copy h2 {
  margin: 0 !important;
  color: var(--cleanup-primary-dark) !important;
  font-size: clamp(22px, 3vw, 34px) !important;
  line-height: 1.06 !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}
body:not(.tv-body) .cleanup-hero-copy p {
  max-width: 760px !important;
  margin: 0 !important;
  color: #475569 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
}
body:not(.tv-body) .cleanup-hero-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 4px !important;
}
body:not(.tv-body) .cleanup-hero-badges span {
  padding: 7px 10px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .76) !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .cleanup-hero-badges .icon { width: 13px !important; height: 13px !important; color: var(--cleanup-primary) !important; }

body:not(.tv-body) .cleanup-score-card {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  min-height: 180px !important;
  padding: 16px !important;
  border: 1px solid rgba(44, 92, 113, .13) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .72) !important;
  backdrop-filter: blur(8px) !important;
  box-shadow: 0 14px 32px rgba(15, 23, 42, .08) !important;
}
body:not(.tv-body) .cleanup-score-ring {
  width: 94px !important;
  height: 94px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  background:
    radial-gradient(circle at center, #fff 56%, transparent 57%),
    conic-gradient(var(--cleanup-primary) var(--score, 0%), #dbe7eb 0) !important;
  box-shadow: inset 0 0 0 1px rgba(44, 92, 113, .08), 0 12px 24px rgba(44, 92, 113, .13) !important;
}
body:not(.tv-body) .cleanup-score-ring strong {
  color: var(--cleanup-primary-dark) !important;
  font-size: 25px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-score-ring span {
  margin-top: -24px !important;
  color: #94a3b8 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-score-card > b {
  color: var(--cleanup-primary-dark) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-score-card > small {
  color: var(--cleanup-muted) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-hero-actions {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin-top: 4px !important;
}
body:not(.tv-body) .cleanup-hero-actions .btn {
  min-height: 36px !important;
  justify-content: center !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body:not(.tv-body) .cleanup-metric-grid,
body:not(.tv-body) .cleanup-health-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .cleanup-metric-card {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .045) !important;
}
body:not(.tv-body) .cleanup-metric-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--cleanup-primary-dark) !important;
  background: var(--cleanup-soft-2) !important;
}
body:not(.tv-body) .cleanup-metric-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .cleanup-metric-card strong {
  display: block !important;
  color: #0f172a !important;
  font-size: 18px !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-metric-card b {
  display: block !important;
  margin-top: 2px !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .045em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-metric-card small {
  display: block !important;
  margin-top: 2px !important;
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-metric-card.success .cleanup-metric-icon { background: #dcfce7 !important; color: #15803d !important; }
body:not(.tv-body) .cleanup-metric-card.warning .cleanup-metric-icon { background: #fef3c7 !important; color: #b45309 !important; }
body:not(.tv-body) .cleanup-metric-card.danger .cleanup-metric-icon { background: #fee2e2 !important; color: #b91c1c !important; }

body:not(.tv-body) .cleanup-health-shell {
  display: grid !important;
  gap: 12px !important;
  padding: 15px !important;
}
body:not(.tv-body) .cleanup-health-shell.success { border-color: rgba(34, 197, 94, .24) !important; }
body:not(.tv-body) .cleanup-health-shell.warning { border-color: rgba(245, 158, 11, .32) !important; }
body:not(.tv-body) .cleanup-health-shell.danger { border-color: rgba(239, 68, 68, .32) !important; }
body:not(.tv-body) .cleanup-section-head,
body:not(.tv-body) .cleanup-panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
body:not(.tv-body) .cleanup-section-title {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .cleanup-section-title.compact {
  gap: 9px !important;
}
body:not(.tv-body) .cleanup-section-icon {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  border-radius: 15px !important;
  display: grid !important;
  place-items: center !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--cleanup-primary-dark), var(--cleanup-primary-light)) !important;
  box-shadow: 0 8px 18px rgba(44, 92, 113, .18) !important;
}
body:not(.tv-body) .cleanup-section-icon.warning { background: linear-gradient(135deg, #b45309, #f59e0b) !important; }
body:not(.tv-body) .cleanup-section-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .cleanup-section-title h2 {
  margin: 0 !important;
  color: var(--cleanup-primary-dark) !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-section-title p {
  margin: 2px 0 0 !important;
  color: #64748b !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
}
body:not(.tv-body) .cleanup-status-pill,
body:not(.tv-body) .cleanup-count-pill {
  flex: 0 0 auto !important;
  padding: 7px 10px !important;
  border-radius: 999px !important;
  border: 1px solid var(--cleanup-border) !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .cleanup-status-pill .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .cleanup-status-pill.success { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #15803d !important; }
body:not(.tv-body) .cleanup-status-pill.warning { background: #fffbeb !important; border-color: #fde68a !important; color: #b45309 !important; }
body:not(.tv-body) .cleanup-status-pill.danger { background: #fef2f2 !important; border-color: #fecaca !important; color: #b91c1c !important; }

body:not(.tv-body) .cleanup-issue-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .cleanup-issue-item {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 9px !important;
  align-items: center !important;
  padding: 9px 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(245, 158, 11, .28) !important;
  background: #fffbeb !important;
}
body:not(.tv-body) .cleanup-issue-item.danger { border-color: rgba(239, 68, 68, .26) !important; background: #fef2f2 !important; }
body:not(.tv-body) .cleanup-issue-item > span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  color: #b45309 !important;
  background: rgba(245, 158, 11, .16) !important;
}
body:not(.tv-body) .cleanup-issue-item.danger > span { color: #b91c1c !important; background: rgba(239, 68, 68, .14) !important; }
body:not(.tv-body) .cleanup-issue-item .icon { width: 15px !important; height: 15px !important; }
body:not(.tv-body) .cleanup-issue-item b,
body:not(.tv-body) .cleanup-issue-item small {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-issue-item b { color: #0f172a !important; font-size: 12.2px !important; font-weight: 600 !important; }
body:not(.tv-body) .cleanup-issue-item small { color: #64748b !important; font-size: 11px !important; margin-top: 2px !important; }
body:not(.tv-body) .cleanup-empty-success,
body:not(.tv-body) .cleanup-empty-card {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 70px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
  border: 1px dashed rgba(34, 197, 94, .34) !important;
  background: #f0fdf4 !important;
  color: #15803d !important;
}
body:not(.tv-body) .cleanup-empty-card {
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  min-height: 170px !important;
  background: #f8fafc !important;
  border-color: rgba(44, 92, 113, .14) !important;
  color: #64748b !important;
}
body:not(.tv-body) .cleanup-empty-success .icon,
body:not(.tv-body) .cleanup-empty-card .icon { width: 18px !important; height: 18px !important; flex: 0 0 auto !important; }
body:not(.tv-body) .cleanup-empty-success b,
body:not(.tv-body) .cleanup-empty-card b { display: block !important; color: inherit !important; font-size: 12.5px !important; font-weight: 600 !important; }
body:not(.tv-body) .cleanup-empty-success small,
body:not(.tv-body) .cleanup-empty-card small { display: block !important; margin-top: 2px !important; color: #64748b !important; font-size: 11px !important; }

body:not(.tv-body) .cleanup-review-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
body:not(.tv-body) .cleanup-review-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 370px !important;
  padding: 0 !important;
}
body:not(.tv-body) .cleanup-review-card .cleanup-panel-head {
  padding: 14px 15px 12px !important;
  border-bottom: 1px solid rgba(44, 92, 113, .12) !important;
  background: linear-gradient(180deg, #fbfdfe, #f3f8fa) !important;
}
body:not(.tv-body) .cleanup-panel-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
body:not(.tv-body) .cleanup-panel-actions .btn {
  min-height: 34px !important;
  border-radius: 11px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .cleanup-scroll-list {
  display: grid !important;
  gap: 9px !important;
  align-content: start !important;
  padding: 12px !important;
  max-height: 430px !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: #A9C7D2 transparent !important;
}
body:not(.tv-body) .cleanup-scroll-list::-webkit-scrollbar { width: 5px !important; }
body:not(.tv-body) .cleanup-scroll-list::-webkit-scrollbar-thumb { background: #A9C7D2 !important; border-radius: 999px !important; }
body:not(.tv-body) .cleanup-modern-row,
body:not(.tv-body) .cleanup-modern-page .cleanup-asset-row {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .045) !important;
}
body:not(.tv-body) .cleanup-thumb {
  width: 54px !important;
  height: 44px !important;
  border-radius: 13px !important;
  overflow: hidden !important;
  background: #edf4f6 !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: inset 0 0 0 1px rgba(44, 92, 113, .08) !important;
}
body:not(.tv-body) .cleanup-thumb img,
body:not(.tv-body) .cleanup-thumb video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body:not(.tv-body) .cleanup-thumb .icon { width: 18px !important; height: 18px !important; color: var(--cleanup-primary) !important; }
body:not(.tv-body) .cleanup-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
}
body:not(.tv-body) .cleanup-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .cleanup-title-row b {
  min-width: 0 !important;
  color: #0f172a !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-type-badge {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  background: #eef6f8 !important;
  color: var(--cleanup-primary-dark) !important;
  border: 1px solid rgba(169, 199, 210, .6) !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .cleanup-type-badge .icon { width: 11px !important; height: 11px !important; }
body:not(.tv-body) .cleanup-copy small {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-usage-chip {
  width: max-content !important;
  max-width: 100% !important;
  padding: 4px 7px !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(44, 92, 113, .11) !important;
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-usage-chip.unused { background: #fffbeb !important; border-color: #fde68a !important; color: #b45309 !important; }
body:not(.tv-body) .cleanup-usage-chip.used { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #15803d !important; }
body:not(.tv-body) .cleanup-usage-chip .icon { width: 11px !important; height: 11px !important; flex: 0 0 auto !important; }
body:not(.tv-body) .cleanup-modern-page .cleanup-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(72px, 1fr)) !important;
  gap: 6px !important;
  min-width: 158px !important;
  align-self: stretch !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}
body:not(.tv-body) .cleanup-modern-page .cleanup-actions .btn,
body:not(.tv-body) .cleanup-modern-page .cleanup-action-btn {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 7px 9px !important;
  border-radius: 11px !important;
  font-size: 11.5px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
}
body:not(.tv-body) .cleanup-modern-page .cleanup-actions .icon { width: 13px !important; height: 13px !important; flex: 0 0 auto !important; }
body:not(.tv-body) .cleanup-dup-group {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44, 92, 113, .13) !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}
body:not(.tv-body) .cleanup-dup-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 0 2px !important;
}
body:not(.tv-body) .cleanup-dup-head b {
  min-width: 0 !important;
  color: var(--cleanup-primary-dark) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .cleanup-dup-head small {
  flex: 0 0 auto !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

@media (max-width: 1180px) {
  body:not(.tv-body) .cleanup-modern-hero { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .cleanup-score-card { justify-items: start !important; grid-template-columns: 104px minmax(0, 1fr) !important; min-height: 0 !important; }
  body:not(.tv-body) .cleanup-score-card > b,
  body:not(.tv-body) .cleanup-score-card > small { justify-self: start !important; }
  body:not(.tv-body) .cleanup-hero-actions { grid-column: 1 / -1 !important; max-width: 360px !important; }
  body:not(.tv-body) .cleanup-metric-grid,
  body:not(.tv-body) .cleanup-health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 980px) {
  body:not(.tv-body) .cleanup-review-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .cleanup-issue-list { grid-template-columns: 1fr !important; }
}
@media (max-width: 720px) {
  body:not(.tv-body) .cleanup-modern-hero { padding: 14px !important; border-radius: 20px !important; }
  body:not(.tv-body) .cleanup-score-card { grid-template-columns: 1fr !important; justify-items: center !important; }
  body:not(.tv-body) .cleanup-hero-actions { max-width: none !important; grid-template-columns: 1fr !important; }
  body:not(.tv-body) .cleanup-metric-grid,
  body:not(.tv-body) .cleanup-health-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .cleanup-section-head,
  body:not(.tv-body) .cleanup-panel-head { align-items: flex-start !important; flex-direction: column !important; }
  body:not(.tv-body) .cleanup-panel-actions { width: 100% !important; justify-content: stretch !important; }
  body:not(.tv-body) .cleanup-panel-actions .btn { flex: 1 1 160px !important; }
  body:not(.tv-body) .cleanup-modern-row,
  body:not(.tv-body) .cleanup-modern-page .cleanup-asset-row { grid-template-columns: 48px minmax(0, 1fr) !important; align-items: start !important; }
  body:not(.tv-body) .cleanup-thumb { width: 48px !important; height: 40px !important; }
  body:not(.tv-body) .cleanup-modern-page .cleanup-actions { grid-column: 1 / -1 !important; min-width: 0 !important; width: 100% !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
  body:not(.tv-body) .cleanup-modern-page .cleanup-actions { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .cleanup-title-row { flex-wrap: wrap !important; }
}


body:not(.tv-body) .analytics-modern-page {
  --analytics-primary: #2C5C71;
  --analytics-primary-dark: #21485A;
  --analytics-primary-light: #3E7890;
  --analytics-soft: #E8F1F4;
  --analytics-soft-2: #D6E5EA;
  --analytics-border: rgba(44, 92, 113, .14);
  --analytics-border-strong: rgba(44, 92, 113, .24);
  --analytics-text: #0f172a;
  --analytics-muted: #64748b;
  display: grid !important;
  gap: 14px !important;
  padding: 0 !important;
}

body:not(.tv-body) .analytics-modern-page .card,
body:not(.tv-body) .analytics-modern-hero,
body:not(.tv-body) .analytics-filter-card,
body:not(.tv-body) .analytics-table-card-ui,
body:not(.tv-body) .analytics-insight-card,
body:not(.tv-body) .analytics-metric-card {
  border: 1px solid var(--analytics-border) !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .06) !important;
  overflow: hidden !important;
}

body:not(.tv-body) .analytics-modern-hero {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px) !important;
  gap: 16px !important;
  align-items: stretch !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 12% 15%, rgba(44,92,113,.13), transparent 34%),
    linear-gradient(135deg, #f8fbfc 0%, #e9f2f5 100%) !important;
}
body:not(.tv-body) .analytics-modern-hero::after {
  content: '';
  position: absolute;
  inset: auto -110px -150px auto;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: rgba(44,92,113,.08);
  pointer-events: none;
}
body:not(.tv-body) .analytics-modern-copy {
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
}
body:not(.tv-body) .analytics-kicker,
body:not(.tv-body) .analytics-hero-badges span,
body:not(.tv-body) .analytics-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1 !important;
}
body:not(.tv-body) .analytics-kicker {
  width: max-content !important;
  max-width: 100% !important;
  padding: 6px 11px !important;
  border: 1px solid rgba(169,199,210,.75) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.72) !important;
  color: var(--analytics-primary-dark) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
}
body:not(.tv-body) .analytics-kicker .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .analytics-modern-copy h2 {
  margin: 0 !important;
  color: var(--analytics-primary-dark) !important;
  font-size: clamp(22px, 3vw, 34px) !important;
  line-height: 1.06 !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}
body:not(.tv-body) .analytics-modern-copy p {
  max-width: 780px !important;
  margin: 0 !important;
  color: #475569 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
}
body:not(.tv-body) .analytics-hero-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 4px !important;
}
body:not(.tv-body) .analytics-hero-badges span {
  padding: 7px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.76) !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .analytics-hero-badges .icon { width: 13px !important; height: 13px !important; color: var(--analytics-primary) !important; }

body:not(.tv-body) .analytics-live-card {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 14px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.74) !important;
  backdrop-filter: blur(8px) !important;
  box-shadow: 0 14px 32px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .analytics-live-head {
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) !important;
  gap: 10px !important;
  align-items: center !important;
}
body:not(.tv-body) .analytics-live-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 15px !important;
  display: grid !important;
  place-items: center !important;
  background: #fef3c7 !important;
  color: #b45309 !important;
}
body:not(.tv-body) .analytics-live-icon.online { background: #dcfce7 !important; color: #15803d !important; }
body:not(.tv-body) .analytics-live-icon .icon { width: 19px !important; height: 19px !important; }
body:not(.tv-body) .analytics-live-head b {
  display: block !important;
  color: var(--analytics-primary-dark) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}
body:not(.tv-body) .analytics-live-head small {
  display: block !important;
  color: var(--analytics-muted) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .analytics-live-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .analytics-live-grid div {
  padding: 10px !important;
  border: 1px solid rgba(44,92,113,.11) !important;
  border-radius: 15px !important;
  background: rgba(248,250,252,.86) !important;
}
body:not(.tv-body) .analytics-live-grid strong {
  display: block !important;
  color: #0f172a !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}
body:not(.tv-body) .analytics-live-grid span {
  display: block !important;
  margin-top: 4px !important;
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .045em !important;
}
body:not(.tv-body) .analytics-hero-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 7px !important;
  margin-top: 2px !important;
  justify-content: stretch !important;
}
body:not(.tv-body) .analytics-hero-actions .btn {
  min-height: 36px !important;
  padding: 7px 10px !important;
  justify-content: center !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .analytics-hero-actions .btn .icon { width: 14px !important; height: 14px !important; }

body:not(.tv-body) .analytics-metric-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .analytics-metric-card {
  display: grid !important;
  grid-template-columns: 40px minmax(0,1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 12px !important;
}
body:not(.tv-body) .analytics-metric-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: var(--analytics-soft-2) !important;
  color: var(--analytics-primary-dark) !important;
}
body:not(.tv-body) .analytics-metric-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .analytics-metric-card.success .analytics-metric-icon { background: #dcfce7 !important; color: #15803d !important; }
body:not(.tv-body) .analytics-metric-card.warning .analytics-metric-icon { background: #fef3c7 !important; color: #b45309 !important; }
body:not(.tv-body) .analytics-metric-card.info .analytics-metric-icon { background: #dbeafe !important; color: #1d4ed8 !important; }
body:not(.tv-body) .analytics-metric-card strong {
  display: block !important;
  color: #0f172a !important;
  font-size: 18px !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .analytics-metric-card b {
  display: block !important;
  margin-top: 2px !important;
  color: #334155 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .045em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .analytics-metric-card small {
  display: block !important;
  margin-top: 2px !important;
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body:not(.tv-body) .analytics-modern-insights {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .analytics-modern-insights .analytics-insight-card {
  display: grid !important;
  grid-template-columns: 40px minmax(0,1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 12px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .analytics-modern-insights .analytics-insight-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg,#eef6f8,#ffffff) !important;
  color: var(--analytics-primary-dark) !important;
}
body:not(.tv-body) .analytics-modern-insights .analytics-insight-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .analytics-modern-insights .analytics-insight-card span {
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .055em !important;
}
body:not(.tv-body) .analytics-modern-insights .analytics-insight-card b {
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-modern-insights .analytics-insight-card small {
  color: #64748b !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}

body:not(.tv-body) .analytics-workspace {
  display: grid !important;
  grid-template-columns: minmax(230px, 270px) minmax(0,1fr) !important;
  gap: 12px !important;
  align-items: start !important;
}
body:not(.tv-body) .analytics-filter-card {
  position: sticky !important;
  top: 82px !important;
  display: grid !important;
  gap: 12px !important;
  padding: 14px !important;
}
body:not(.tv-body) .analytics-filter-head {
  display: grid !important;
  grid-template-columns: 38px minmax(0,1fr) !important;
  gap: 9px !important;
  align-items: center !important;
}
body:not(.tv-body) .analytics-filter-head > span {
  width: 38px !important;
  height: 38px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: var(--analytics-soft-2) !important;
  color: var(--analytics-primary-dark) !important;
}
body:not(.tv-body) .analytics-filter-head .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .analytics-filter-head b {
  display: block !important;
  color: var(--analytics-primary-dark) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-filter-head small {
  display: block !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-quick-actions {
  display: grid !important;
  gap: 7px !important;
}
body:not(.tv-body) .analytics-quick-actions button {
  min-height: 36px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-align: left !important;
  transition: background .15s ease, border-color .15s ease, transform .12s ease !important;
}
body:not(.tv-body) .analytics-quick-actions button:hover {
  background: var(--analytics-soft) !important;
  border-color: var(--analytics-primary-border, #A9C7D2) !important;
  transform: translateY(-1px) !important;
}
body:not(.tv-body) .analytics-quick-actions .icon { width: 14px !important; height: 14px !important; color: var(--analytics-primary) !important; }
body:not(.tv-body) .analytics-mini-note,
body:not(.tv-body) .analytics-tip-card {
  display: grid !important;
  gap: 5px !important;
  padding: 10px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #f8fafc !important;
  color: #475569 !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 650 !important;
}
body:not(.tv-body) .analytics-mini-note.ok { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #166534 !important; }
body:not(.tv-body) .analytics-mini-note.warn { background: #fffbeb !important; border-color: #fde68a !important; color: #92400e !important; }
body:not(.tv-body) .analytics-mini-note .icon { width: 14px !important; height: 14px !important; vertical-align: -2px !important; }
body:not(.tv-body) .analytics-tip-card b {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--analytics-primary-dark) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-tip-card small {
  color: #64748b !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
}

body:not(.tv-body) .analytics-table-card-ui {
  display: grid !important;
  gap: 12px !important;
  padding: 14px !important;
}
body:not(.tv-body) .analytics-table-card-ui .analytics-table-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
body:not(.tv-body) .analytics-table-card-ui .section-title {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
}
body:not(.tv-body) .analytics-table-card-ui .section-title span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: var(--analytics-soft-2) !important;
  color: var(--analytics-primary-dark) !important;
}
body:not(.tv-body) .analytics-table-card-ui .section-title .icon { width: 17px !important; height: 17px !important; }
body:not(.tv-body) .analytics-table-card-ui .section-title h2 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
}
body:not(.tv-body) .analytics-table-meta {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-controls-ui {
  display: grid !important;
  grid-template-columns: minmax(230px, 1.3fr) minmax(130px,.55fr) minmax(145px,.65fr) minmax(145px,.65fr) auto !important;
  gap: 8px !important;
  align-items: end !important;
}
body:not(.tv-body) .analytics-controls-ui .analytics-control {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .analytics-controls-ui .analytics-control > span:not(.icon) {
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .analytics-controls-ui .input {
  min-height: 36px !important;
  border-radius: 12px !important;
  border-color: rgba(44,92,113,.16) !important;
  background: #fff !important;
  font-size: 12.5px !important;
}
body:not(.tv-body) .analytics-controls-ui .search-wrap {
  min-height: 36px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(44,92,113,.16) !important;
  border-radius: 12px !important;
  background: #fff !important;
}
body:not(.tv-body) .analytics-controls-ui .search-wrap .input {
  border: 0 !important;
  min-height: 34px !important;
  padding: 0 !important;
  box-shadow: none !important;
}
body:not(.tv-body) .analytics-controls-ui .search-wrap .icon { width: 15px !important; height: 15px !important; color: #64748b !important; }
body:not(.tv-body) .analytics-reset-btn {
  min-height: 36px !important;
  padding: 7px 12px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .analytics-note {
  min-height: 40px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 11px !important;
  border-radius: 14px !important;
  font-size: 12.5px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-note .icon { width: 16px !important; height: 16px !important; flex: 0 0 auto !important; }
body:not(.tv-body) .analytics-table-wrap-ui {
  display: grid !important;
  gap: 8px !important;
  overflow: auto !important;
  padding-bottom: 2px !important;
  scrollbar-width: thin !important;
  scrollbar-color: #A9C7D2 transparent !important;
}
body:not(.tv-body) .analytics-table-wrap-ui::-webkit-scrollbar { height: 6px !important; width: 6px !important; }
body:not(.tv-body) .analytics-table-wrap-ui::-webkit-scrollbar-thumb { background: #A9C7D2 !important; border-radius: 999px !important; }
body:not(.tv-body) .analytics-list-ui {
  display: grid !important;
  gap: 8px !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row,
body:not(.tv-body) .analytics-row-head-ui {
  display: grid !important;
  grid-template-columns: minmax(220px, 1.45fr) minmax(130px,.78fr) minmax(86px,.48fr) minmax(135px,.72fr) minmax(135px,.72fr) minmax(145px,.82fr) !important;
  gap: 9px !important;
  align-items: center !important;
  min-width: 900px !important;
}
body:not(.tv-body) .analytics-row-head-ui {
  padding: 0 11px 2px !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #64748b !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row {
  padding: 10px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 17px !important;
  background: #fff !important;
  box-shadow: 0 7px 18px rgba(15,23,42,.045) !important;
  transition: border-color .15s ease, transform .12s ease, box-shadow .15s ease !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(44,92,113,.28) !important;
  box-shadow: 0 12px 24px rgba(15,23,42,.07) !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row.live {
  border-color: rgba(22,163,74,.26) !important;
  background: linear-gradient(90deg, #f0fdf4 0%, #fff 26%) !important;
}
body:not(.tv-body) .analytics-media-cell-ui {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .analytics-media-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: #eef6f8 !important;
  color: var(--analytics-primary-dark) !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .analytics-media-icon .icon { width: 19px !important; height: 19px !important; }
body:not(.tv-body) .analytics-row.analytics-modern-row > div {
  min-width: 0 !important;
  display: grid !important;
  gap: 3px !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row span:not(.analytics-media-icon),
body:not(.tv-body) .analytics-row.analytics-modern-row .analytics-stat-cell > span,
body:not(.tv-body) .analytics-row.analytics-modern-row .analytics-status-cell > span {
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row b {
  color: #0f172a !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .analytics-row.analytics-modern-row small {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(.tv-body) .analytics-status-pill {
  width: max-content !important;
  max-width: 100% !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .analytics-status-pill.live { background: #dcfce7 !important; color: #166534 !important; }
body:not(.tv-body) .analytics-status-pill.shown { background: #e0f2fe !important; color: #075985 !important; }
body:not(.tv-body) .analytics-status-pill.never { background: #f1f5f9 !important; color: #64748b !important; }
body:not(.tv-body) .analytics-bar {
  width: 100% !important;
  height: 7px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #e2e8f0 !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .analytics-bar i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, var(--analytics-primary-dark), var(--analytics-primary-light)) !important;
  min-width: 4px !important;
}
body:not(.tv-body) .analytics-empty-ui {
  min-width: 0 !important;
  border-radius: 18px !important;
  border: 1px dashed rgba(44,92,113,.2) !important;
  background: #f8fafc !important;
}

@media (max-width: 1180px) {
  body:not(.tv-body) .analytics-modern-hero { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .analytics-live-card { max-width: none !important; }
  body:not(.tv-body) .analytics-metric-grid,
  body:not(.tv-body) .analytics-modern-insights { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body:not(.tv-body) .analytics-workspace { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .analytics-filter-card { position: static !important; }
  body:not(.tv-body) .analytics-quick-actions { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
}
@media (max-width: 920px) {
  body:not(.tv-body) .analytics-controls-ui { grid-template-columns: 1fr 1fr !important; }
  body:not(.tv-body) .analytics-reset-btn { grid-column: 1 / -1 !important; }
  body:not(.tv-body) .analytics-quick-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 760px) {
  body:not(.tv-body) .analytics-modern-hero { padding: 14px !important; border-radius: 20px !important; }
  body:not(.tv-body) .analytics-hero-actions,
  body:not(.tv-body) .analytics-live-grid,
  body:not(.tv-body) .analytics-metric-grid,
  body:not(.tv-body) .analytics-modern-insights,
  body:not(.tv-body) .analytics-controls-ui,
  body:not(.tv-body) .analytics-quick-actions { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .analytics-row.analytics-modern-row { min-width: 0 !important; grid-template-columns: 1fr !important; align-items: start !important; }
  body:not(.tv-body) .analytics-row-head-ui { display: none !important; }
}


body:not(.tv-body) .emx-page {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 1680px !important;
  margin: 0 auto !important;
}
body:not(.tv-body) .emx-hero {
  position: relative !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px) !important;
  gap: 14px !important;
  align-items: stretch !important;
  padding: 16px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(600px 260px at 8% 0%, rgba(44,92,113,.14), transparent 62%),
    linear-gradient(135deg, #ffffff 0%, #f0f7fa 100%) !important;
  box-shadow: 0 18px 48px rgba(15,23,42,.07) !important;
}
body:not(.tv-body) .emx-hero::after {
  content: "";
  position: absolute;
  inset: auto -80px -140px auto;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(44,92,113,.08);
  pointer-events: none;
}
body:not(.tv-body) .emx-hero.is-active {
  background:
    radial-gradient(620px 280px at 8% 0%, rgba(220,38,38,.12), transparent 62%),
    linear-gradient(135deg, #fffafa 0%, #fff7ed 50%, #f8fbfc 100%) !important;
  border-color: rgba(220,38,38,.18) !important;
}
body:not(.tv-body) .emx-hero-left { min-width: 0 !important; position: relative !important; z-index: 1 !important; }
body:not(.tv-body) .emx-kicker,
body:not(.tv-body) .modal-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #2C5C71 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .emx-kicker .icon { width: 15px !important; height: 15px !important; }
body:not(.tv-body) .emx-hero h2 {
  margin: 6px 0 4px !important;
  color: #0f172a !important;
  font-size: clamp(24px, 2.2vw, 34px) !important;
  font-weight: 600 !important;
  line-height: 1.06 !important;
  letter-spacing: -.015em !important;
}
body:not(.tv-body) .emx-hero p {
  max-width: 850px !important;
  color: #526273 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}
body:not(.tv-body) .emx-hero-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 12px !important;
}
body:not(.tv-body) .emx-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 28px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  border: 1px solid #d6e5ea !important;
  background: #fff !important;
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
}
body:not(.tv-body) .emx-pill .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .emx-pill.on { background: #fff7ed !important; border-color: #fed7aa !important; color: #c2410c !important; }
body:not(.tv-body) .emx-pill.off { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #15803d !important; }
body:not(.tv-body) .emx-pill.severity-danger { background: #fef2f2 !important; border-color: #fecaca !important; color: #b91c1c !important; }
body:not(.tv-body) .emx-pill.severity-warning { background: #fffbeb !important; border-color: #fde68a !important; color: #b45309 !important; }
body:not(.tv-body) .emx-pill.severity-info { background: #eff6ff !important; border-color: #bfdbfe !important; color: #1d4ed8 !important; }
body:not(.tv-body) .emx-hero-panel {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
  padding: 14px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}
body:not(.tv-body) .emx-live-ring {
  width: 48px !important;
  height: 48px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  background: #e8f1f4 !important;
  color: #2C5C71 !important;
  border: 1px solid #c8dce3 !important;
}
body:not(.tv-body) .emx-live-ring.on { background: #fef2f2 !important; border-color: #fecaca !important; color: #dc2626 !important; box-shadow: 0 0 0 6px rgba(220,38,38,.07) !important; }
body:not(.tv-body) .emx-live-ring .icon { width: 23px !important; height: 23px !important; }
body:not(.tv-body) .emx-hero-panel b { font-size: 15px !important; color: #0f172a !important; }
body:not(.tv-body) .emx-hero-panel small { font-size: 12px !important; line-height: 1.35 !important; color: #64748b !important; }
body:not(.tv-body) .emx-hero-actions { display: flex !important; flex-wrap: wrap !important; gap: 7px !important; margin-top: 2px !important; }

body:not(.tv-body) .emx-status-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .emx-status-tile {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 12px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 10px 30px rgba(15,23,42,.045) !important;
}
body:not(.tv-body) .emx-status-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: #e8f1f4 !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .emx-status-icon .icon { width: 19px !important; height: 19px !important; }
body:not(.tv-body) .emx-status-tile small,
body:not(.tv-body) .emx-summary-list span {
  display: block !important;
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .emx-status-tile b {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #0f172a !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .emx-status-tile em {
  display: block !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-style: normal !important;
  margin-top: 1px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .emx-status-tile.active .emx-status-icon { background: #fff7ed !important; color: #c2410c !important; }
body:not(.tv-body) .emx-status-tile.warning .emx-status-icon { background: #fffbeb !important; color: #b45309 !important; }
body:not(.tv-body) .emx-status-tile.info .emx-status-icon { background: #eff6ff !important; color: #1d4ed8 !important; }

body:not(.tv-body) .emx-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 420px) !important;
  gap: 12px !important;
  align-items: start !important;
}
body:not(.tv-body) .emx-main-stack,
body:not(.tv-body) .emx-preview-stack {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .emx-preview-stack {
  position: sticky !important;
  top: 12px !important;
}
body:not(.tv-body) .emx-card,
body:not(.tv-body) .emx-preview-card {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 14px 36px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .emx-card-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 13px 14px !important;
  border-bottom: 1px solid rgba(44,92,113,.10) !important;
  background: linear-gradient(180deg, #fbfdfe 0%, #f4f9fb 100%) !important;
}
body:not(.tv-body) .emx-card-head-split { align-items: flex-start !important; }
body:not(.tv-body) .emx-card-title {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .emx-card-title > span {
  width: 36px !important;
  height: 36px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  background: #2C5C71 !important;
  color: #fff !important;
}
body:not(.tv-body) .emx-card-title > span .icon { width: 17px !important; height: 17px !important; }
body:not(.tv-body) .emx-card-title h2 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
}
body:not(.tv-body) .emx-card-title p {
  margin: 2px 0 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .emx-card-badge,
body:not(.tv-body) .emx-mini-priority {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  padding: 5px 9px !important;
  background: #e8f1f4 !important;
  color: #2C5C71 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border: 1px solid #d6e5ea !important;
}
body:not(.tv-body) .emx-mini-priority .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .emx-template-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  padding: 12px !important;
}
body:not(.tv-body) .emx-template-grid .emergency-template-chip {
  min-height: 76px !important;
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-template-grid .emergency-template-chip .icon {
  width: 32px !important;
  height: 32px !important;
  padding: 7px !important;
  border-radius: 12px !important;
  background: #eef6f8 !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .emergency-template-chip.danger .icon { background: #fef2f2 !important; color: #dc2626 !important; }
body:not(.tv-body) .emergency-template-chip.warning .icon { background: #fffbeb !important; color: #b45309 !important; }
body:not(.tv-body) .emergency-template-chip.info .icon { background: #eff6ff !important; color: #1d4ed8 !important; }
body:not(.tv-body) .emx-template-grid .emergency-template-chip b,
body:not(.tv-body) .emx-template-grid .emergency-template-chip small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .emx-form {
  padding: 12px !important;
  display: grid !important;
  gap: 12px !important;
}
body:not(.tv-body) .emx-compose-top {
  display: grid !important;
  grid-template-columns: minmax(270px, .9fr) minmax(0, 1.1fr) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
body:not(.tv-body) .emx-master-switch,
body:not(.tv-body) .emx-section-block,
body:not(.tv-body) .emx-modal-section {
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 18px !important;
  background: #fbfdfe !important;
  padding: 12px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-master-switch {
  min-height: 82px !important;
  align-items: center !important;
}
body:not(.tv-body) .emx-master-switch .switch-label b { font-size: 13px !important; color: #0f172a !important; }
body:not(.tv-body) .emx-master-switch .switch-label small { font-size: 11.5px !important; color: #64748b !important; }
body:not(.tv-body) .emx-section-block,
body:not(.tv-body) .emx-modal-section {
  display: grid !important;
  gap: 10px !important;
}
body:not(.tv-body) .emx-section-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .emx-section-label .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .emx-title-input {
  min-height: 42px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .emx-rich-shell {
  border-radius: 16px !important;
  border: 1px solid #d6e5ea !important;
  overflow: hidden !important;
  background: #fff !important;
}
body:not(.tv-body) .emx-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 7px !important;
  min-height: auto !important;
  border-bottom: 1px solid rgba(44,92,113,.10) !important;
  background: linear-gradient(180deg, #f8fafc 0%, #eef6f8 100%) !important;
}
body:not(.tv-body) .emx-toolbar button {
  min-height: 30px !important;
  height: 30px !important;
  padding: 5px 8px !important;
  border-radius: 9px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
body:not(.tv-body) .emx-toolbar button .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .emx-toolbar .toolbar-divider {
  width: 1px !important;
  height: 22px !important;
  margin: 0 2px !important;
  background: rgba(44,92,113,.18) !important;
}
body:not(.tv-body) .emx-rich-body {
  min-height: 112px !important;
  max-height: 210px !important;
  padding: 12px !important;
  line-height: 1.45 !important;
  font-size: 13px !important;
  background: #fff !important;
  overflow: auto !important;
}
body:not(.tv-body) .emx-rich-body:empty::before { content: attr(data-placeholder); color: #94a3b8; }
body:not(.tv-body) .emx-severity-picker {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .emx-severity-picker .severity-option {
  min-height: 82px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  display: grid !important;
  grid-template-columns: 26px minmax(0,1fr) !important;
  align-content: center !important;
  column-gap: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-severity-picker .severity-option .icon { width: 22px !important; height: 22px !important; grid-row: span 2 !important; }
body:not(.tv-body) .emx-severity-picker .severity-option b { font-size: 13px !important; color: #0f172a !important; }
body:not(.tv-body) .emx-severity-picker .severity-option small { font-size: 11px !important; line-height: 1.25 !important; color: #64748b !important; }
body:not(.tv-body) .emx-screen-target-picker {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 8px !important;
  max-height: 220px !important;
  overflow: auto !important;
  padding: 2px !important;
}
body:not(.tv-body) .emx-target-check {
  min-height: 58px !important;
  padding: 9px !important;
  border-radius: 14px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  background: #fff !important;
}
body:not(.tv-body) .emx-target-check > span {
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .emx-target-check .icon {
  width: 26px !important;
  height: 26px !important;
  padding: 6px !important;
  border-radius: 9px !important;
  background: #e8f1f4 !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .emx-target-check b,
body:not(.tv-body) .emx-target-check small { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
body:not(.tv-body) .emx-target-check small { grid-column: 2 !important; color: #64748b !important; font-size: 10.5px !important; }
body:not(.tv-body) .emx-auto-clear-row {
  border-style: solid !important;
  border-color: #d6e5ea !important;
  background: #fff !important;
  border-radius: 15px !important;
  padding: 10px !important;
}
body:not(.tv-body) .emx-style-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .emx-style-panel {
  padding: 11px !important;
  border-radius: 16px !important;
  background: #fff !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-style-panel h3 {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #21485A !important;
  margin: 0 0 9px !important;
}
body:not(.tv-body) .emx-style-panel h3 .icon { width: 15px !important; height: 15px !important; }
body:not(.tv-body) .range-row {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) 44px !important;
  gap: 9px !important;
  align-items: center !important;
}
body:not(.tv-body) .range-row span { font-size: 11px !important; color: #64748b !important; font-weight: 600 !important; }
body:not(.tv-body) .range-row output { font-size: 11px !important; color: #21485A !important; font-weight: 600 !important; text-align: right !important; }
body:not(.tv-body) input[type="range"] { accent-color: #2C5C71 !important; }
body:not(.tv-body) .format-icon-row { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 9px !important; }
body:not(.tv-body) .format-icon-toggle {
  width: 34px !important;
  height: 34px !important;
  border-radius: 11px !important;
  border: 1px solid #d6e5ea !important;
  background: #f8fafc !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
}
body:not(.tv-body) .format-icon-toggle input { display: none !important; }
body:not(.tv-body) .format-icon-toggle span,
body:not(.tv-body) .format-icon-toggle .icon { display: grid !important; place-items: center !important; width: 16px !important; height: 16px !important; color: #64748b !important; }
body:not(.tv-body) .format-icon-toggle:has(input:checked) {
  background: #2C5C71 !important;
  border-color: #2C5C71 !important;
  color: #fff !important;
}
body:not(.tv-body) .format-icon-toggle:has(input:checked) span,
body:not(.tv-body) .format-icon-toggle:has(input:checked) .icon { color: #fff !important; }
body:not(.tv-body) .emx-test-row {
  display: grid !important;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 260px) auto !important;
  gap: 9px !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 10px !important;
  border-radius: 16px !important;
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
}
body:not(.tv-body) .emx-test-row > div:first-child b { display: flex !important; align-items: center !important; gap: 6px !important; font-size: 13px !important; color: #9a3412 !important; }
body:not(.tv-body) .emx-test-row > div:first-child small { display: block !important; margin-top: 2px !important; font-size: 11px !important; color: #b45309 !important; }
body:not(.tv-body) .emx-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #f8fafc, #eef6f8) !important;
  border: 1px solid rgba(44,92,113,.10) !important;
}
body:not(.tv-body) .emx-preview-card { padding: 12px !important; }
body:not(.tv-body) .emx-preview-head {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  align-items: center !important;
  margin-bottom: 10px !important;
}
body:not(.tv-body) .emx-preview-head b {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 14px !important;
  color: #0f172a !important;
}
body:not(.tv-body) .emx-preview-head b .icon { width: 15px !important; height: 15px !important; color: #2C5C71 !important; }
body:not(.tv-body) .emx-preview-head small { display: block !important; color: #64748b !important; font-size: 11px !important; margin-top: 2px !important; }
body:not(.tv-body) .emx-preview-severity-pill,
body:not(.tv-body) .emergency-preview-severity {
  border-radius: 999px !important;
  padding: 4px 9px !important;
  background: #e8f1f4 !important;
  color: #21485A !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
}
body:not(.tv-body) .emx-preview,
body:not(.tv-body) .screen-emergency-preview.emx-preview {
  min-height: 240px !important;
  border-radius: 18px !important;
  padding: 12px !important;
  background: linear-gradient(135deg, #0f172a, #24384a) !important;
  overflow: hidden !important;
}
body:not(.tv-body) .emx-tv-preview-card {
  width: 100% !important;
  min-height: 216px !important;
  display: grid !important;
  align-content: center !important;
  gap: 10px !important;
  border-radius: 15px !important;
  padding: 18px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-tv-preview-card h1 {
  margin: 0 !important;
  color: #fff !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}
body:not(.tv-body) .emx-tv-preview-card .tv-emergency-message {
  color: rgba(255,255,255,.88) !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}
body:not(.tv-body) .emx-priority-note {
  margin-top: 10px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  border-radius: 14px !important;
  padding: 9px 10px !important;
  background: #e8f1f4 !important;
  color: #40566a !important;
  border: 1px solid #d6e5ea !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .emx-priority-note .icon { width: 15px !important; height: 15px !important; color: #2C5C71 !important; flex: 0 0 auto !important; }
body:not(.tv-body) .emx-live-summary { padding: 12px !important; }
body:not(.tv-body) .emx-live-summary .emx-card-title { margin-bottom: 11px !important; }
body:not(.tv-body) .emx-summary-list {
  display: grid !important;
  gap: 7px !important;
}
body:not(.tv-body) .emx-summary-list > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(44,92,113,.10) !important;
}
body:not(.tv-body) .emx-summary-list b { color: #0f172a !important; font-size: 12px !important; text-align: right !important; }
body:not(.tv-body) .emx-individual-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 10px !important;
  padding: 12px !important;
}
body:not(.tv-body) .emx-tv-card {
  display: grid !important;
  gap: 8px !important;
  padding: 11px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 17px !important;
  background: #fff !important;
  box-shadow: none !important;
}
body:not(.tv-body) .emx-tv-card.active { border-color: rgba(220,38,38,.24) !important; background: #fffafa !important; }
body:not(.tv-body) .emx-tv-card.global-active { border-color: rgba(180,83,9,.25) !important; background: #fffbeb !important; }
body:not(.tv-body) .emx-tv-card-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
body:not(.tv-body) .emx-tv-identity {
  display: flex !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .emx-tv-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  background: #e8f1f4 !important;
  color: #2C5C71 !important;
}
body:not(.tv-body) .emx-tv-icon .icon { width: 16px !important; height: 16px !important; }
body:not(.tv-body) .emx-tv-identity b { display: block !important; color: #0f172a !important; font-size: 13px !important; line-height: 1.2 !important; }
body:not(.tv-body) .emx-tv-identity small { display: block !important; color: #64748b !important; font-size: 10.5px !important; margin-top: 2px !important; }
body:not(.tv-body) .emx-tv-status {
  white-space: nowrap !important;
  border-radius: 999px !important;
  padding: 4px 7px !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .emx-tv-card.active .emx-tv-status { background: #fef2f2 !important; color: #b91c1c !important; }
body:not(.tv-body) .emx-tv-card.global-active .emx-tv-status { background: #fff7ed !important; color: #b45309 !important; }
body:not(.tv-body) .emx-tv-card p {
  margin: 0 !important;
  min-height: 34px !important;
  color: #475569 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .emx-tv-card-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(44,92,113,.10) !important;
}
body:not(.tv-body) .emx-tv-priority { color: #64748b !important; font-size: 10.5px !important; font-weight: 600 !important; }
body:not(.tv-body) .emx-tv-actions { display: flex !important; gap: 6px !important; }
body:not(.tv-body) .emx-tv-actions .btn.small { min-height: 30px !important; padding: 5px 8px !important; border-radius: 9px !important; font-size: 11px !important; }

/* Individual TV emergency popup */
body:not(.tv-body) .modal.modal-emergency-override,
body:not(.tv-body) .modal:has(.emx-screen-modal) {
  width: min(1060px, calc(100vw - 26px)) !important;
  max-height: min(92vh, 820px) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 24px !important;
}
body:not(.tv-body) .emx-modal-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 15px 18px !important;
  background: linear-gradient(135deg, #f8fbfc 0%, #eaf3f6 100%) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .emx-modal-head-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(44,92,113,.22) !important;
}
body:not(.tv-body) .emx-modal-head-icon .icon { width: 21px !important; height: 21px !important; }
body:not(.tv-body) .emx-modal-title-stack { flex: 1 1 auto !important; min-width: 0 !important; }
body:not(.tv-body) .emx-modal-title-stack h2 {
  margin: 1px 0 0 !important;
  color: #0f172a !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}
body:not(.tv-body) .emx-modal-title-stack p { margin: 2px 0 0 !important; color: #64748b !important; font-size: 11.5px !important; }
body:not(.tv-body) .emx-modal-state {
  border-radius: 999px !important;
  padding: 5px 9px !important;
  background: #f0fdf4 !important;
  color: #15803d !important;
  border: 1px solid #bbf7d0 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .emx-modal-state.active { background: #fef2f2 !important; color: #b91c1c !important; border-color: #fecaca !important; }
body:not(.tv-body) .emx-screen-modal {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: #fff !important;
}
body:not(.tv-body) .emx-screen-modal .modal-scroll-pane {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 12px 14px !important;
  display: grid !important;
  gap: 10px !important;
}
body:not(.tv-body) .emx-screen-note {
  display: grid !important;
  grid-template-columns: 34px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid #d6e5ea !important;
  border-radius: 16px !important;
  background: #e8f1f4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .emx-screen-note > span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: #2C5C71 !important;
  color: #fff !important;
}
body:not(.tv-body) .emx-screen-note .icon { width: 16px !important; height: 16px !important; }
body:not(.tv-body) .emx-screen-note b { display: block !important; color: #21485A !important; font-size: 13px !important; }
body:not(.tv-body) .emx-screen-note small { display: block !important; color: #536878 !important; font-size: 11.5px !important; line-height: 1.35 !important; }
body:not(.tv-body) .emx-screen-modal-layout {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 380px) !important;
  gap: 12px !important;
  overflow: visible !important;
}
body:not(.tv-body) .emx-screen-modal-main {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .emx-screen-preview-panel {
  min-width: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 18px !important;
  background: #f8fafc !important;
  align-self: start !important;
  position: sticky !important;
  top: 0 !important;
}
body:not(.tv-body) .emx-preview-headline {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #21485A !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
}
body:not(.tv-body) .emx-preview-headline .icon { width: 14px !important; height: 14px !important; }
body:not(.tv-body) .emx-screen-modal-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 12px 16px 14px !important;
  border-top: 1px solid rgba(44,92,113,.12) !important;
  background: linear-gradient(180deg, #f8fafc, #eef6f8) !important;
}
body:not(.tv-body) .emx-screen-modal-actions .btn { min-height: 38px !important; }

@media (max-width: 1280px) {
  body:not(.tv-body) .emx-workspace { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .emx-preview-stack { position: static !important; }
  body:not(.tv-body) .emx-preview-card { order: -1 !important; }
  body:not(.tv-body) .emx-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 980px) {
  body:not(.tv-body) .emx-hero { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .emx-compose-top,
  body:not(.tv-body) .emx-screen-modal-layout { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .emx-screen-preview-panel { position: static !important; }
  body:not(.tv-body) .emx-template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .emx-test-row { grid-template-columns: 1fr !important; }
}
@media (max-width: 680px) {
  body:not(.tv-body) .emx-status-grid,
  body:not(.tv-body) .emx-template-grid,
  body:not(.tv-body) .emx-style-grid,
  body:not(.tv-body) .emx-severity-picker { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .emx-hero,
  body:not(.tv-body) .emx-card-head { padding: 12px !important; }
  body:not(.tv-body) .emx-card-head { align-items: flex-start !important; flex-direction: column !important; }
  body:not(.tv-body) .emx-actions,
  body:not(.tv-body) .emx-screen-modal-actions { justify-content: stretch !important; flex-direction: column-reverse !important; }
  body:not(.tv-body) .emx-actions .btn,
  body:not(.tv-body) .emx-screen-modal-actions .btn { width: 100% !important; justify-content: center !important; }
}


body:not(.tv-body) .users-ui-page {
  display: grid !important;
  gap: 11px !important;
  width: 100% !important;
}
body:not(.tv-body) .users-ui-hero.card {
  position: relative !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 16px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  background:
    radial-gradient(circle at 91% 16%, rgba(44,92,113,.17), transparent 32%),
    radial-gradient(circle at 5% 0%, rgba(62,120,144,.13), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(232,241,244,.94)) !important;
  box-shadow: 0 18px 48px rgba(15,23,42,.08) !important;
  border-radius: 22px !important;
}
body:not(.tv-body) .users-ui-hero::after {
  content: '';
  position: absolute;
  right: 18px;
  top: -34px;
  width: 130px;
  height: 130px;
  border-radius: 999px;
  border: 1px solid rgba(44,92,113,.13);
  background: rgba(255,255,255,.22);
  pointer-events: none;
}
body:not(.tv-body) .users-ui-hero-main {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
body:not(.tv-body) .users-ui-hero-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 17px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 13px 28px rgba(44,92,113,.24) !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .users-ui-hero-icon .icon { width: 25px !important; height: 25px !important; }
body:not(.tv-body) .users-ui-hero-copy { min-width: 0 !important; display: grid !important; gap: 5px !important; }
body:not(.tv-body) .users-ui-hero-copy h2 {
  margin: 0 !important;
  color: #0f172a !important;
  font-size: clamp(19px, 2vw, 27px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.02em !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .users-ui-hero-copy p {
  max-width: 820px !important;
  margin: 0 !important;
  color: #536878 !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .users-ui-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .users-ui-pills span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  background: rgba(255,255,255,.72) !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .users-ui-pills .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .users-ui-hero-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  position: relative !important;
  z-index: 1 !important;
}
body:not(.tv-body) .users-ui-hero-actions .btn { min-height: 36px !important; border-radius: 11px !important; white-space: nowrap !important; }

body:not(.tv-body) .users-ui-status-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 9px !important;
}
body:not(.tv-body) .users-ui-stat {
  display: grid !important;
  grid-template-columns: 38px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 66px !important;
  padding: 10px 12px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.045) !important;
}
body:not(.tv-body) .users-ui-stat.success { border-color: rgba(16,185,129,.18) !important; background: linear-gradient(135deg, #fff, #ecfdf5) !important; }
body:not(.tv-body) .users-ui-stat.warning { border-color: rgba(245,158,11,.22) !important; background: linear-gradient(135deg, #fff, #fffbeb) !important; }
body:not(.tv-body) .users-ui-stat-icon {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 13px !important;
  color: #21485A !important;
  background: #E8F1F4 !important;
}
body:not(.tv-body) .users-ui-stat.success .users-ui-stat-icon { color: #047857 !important; background: #d1fae5 !important; }
body:not(.tv-body) .users-ui-stat.warning .users-ui-stat-icon { color: #b45309 !important; background: #fef3c7 !important; }
body:not(.tv-body) .users-ui-stat-icon .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .users-ui-stat b { display: block !important; font-size: 22px !important; line-height: 1 !important; letter-spacing: -.015em !important; color: #0f172a !important; }
body:not(.tv-body) .users-ui-stat small { display: block !important; margin-top: 3px !important; color: #64748b !important; font-size: 11px !important; font-weight: 600 !important; }

body:not(.tv-body) .users-ui-layout {
  display: grid !important;
  grid-template-columns: minmax(292px, 336px) minmax(0,1fr) !important;
  gap: 11px !important;
  align-items: start !important;
}
body:not(.tv-body) .users-ui-create-card.card,
body:not(.tv-body) .users-ui-list-card.card {
  padding: 0 !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 16px 40px rgba(15,23,42,.065) !important;
}
body:not(.tv-body) .users-ui-create-card { position: sticky !important; top: 76px !important; }
body:not(.tv-body) .users-ui-card-head,
body:not(.tv-body) .users-ui-list-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
  background: linear-gradient(180deg, #f8fafc, #eef6f8) !important;
}
body:not(.tv-body) .users-ui-card-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .users-ui-card-title > span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 9px 20px rgba(44,92,113,.18) !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .users-ui-card-title > span .icon { width: 17px !important; height: 17px !important; }
body:not(.tv-body) .users-ui-card-title b { display: block !important; font-size: 13.5px !important; color: #0f172a !important; font-weight: 600 !important; letter-spacing: -.02em !important; }
body:not(.tv-body) .users-ui-card-title small { display: block !important; margin-top: 1px !important; color: #64748b !important; font-size: 11px !important; font-weight: 700 !important; }

body:not(.tv-body) .users-ui-form { padding: 12px !important; gap: 10px !important; }
body:not(.tv-body) .users-ui-form-section {
  display: grid !important;
  gap: 7px !important;
  padding: 10px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 16px !important;
  background: #f8fafc !important;
}
body:not(.tv-body) .users-ui-section-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .users-ui-section-label .icon { width: 14px !important; height: 14px !important; }
body:not(.tv-body) .users-ui-form .form-row { margin: 0 !important; gap: 4px !important; }
body:not(.tv-body) .users-ui-form .form-row label {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: .055em !important;
  color: #536878 !important;
}
body:not(.tv-body) .users-ui-form .input,
body:not(.tv-body) .users-ui-list-tools .input {
  min-height: 36px !important;
  border-radius: 11px !important;
  border-color: rgba(44,92,113,.16) !important;
  background: #fff !important;
  font-size: 12.5px !important;
}
body:not(.tv-body) .users-ui-form .input:focus,
body:not(.tv-body) .users-ui-list-tools .input:focus {
  border-color: #2C5C71 !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.14) !important;
}
body:not(.tv-body) .users-ui-mail-toggle {
  margin: 0 !important;
  min-height: 0 !important;
  padding: 10px !important;
  border-radius: 16px !important;
  background: #fff !important;
  border: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .users-ui-mail-toggle span { gap: 4px !important; }
body:not(.tv-body) .users-ui-mail-toggle b { font-size: 12px !important; }
body:not(.tv-body) .users-ui-mail-toggle small { display: block !important; color: #64748b !important; font-size: 10.7px !important; line-height: 1.35 !important; }
body:not(.tv-body) .users-ui-role-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 7px !important; margin: 0 !important; }
body:not(.tv-body) .users-ui-role-choice {
  position: relative !important;
  padding: 9px !important;
  gap: 7px !important;
  min-height: 62px !important;
  border-radius: 14px !important;
  background: #fff !important;
  border: 1px solid rgba(44,92,113,.14) !important;
}
body:not(.tv-body) .users-ui-role-choice:has(input:checked) {
  border-color: #2C5C71 !important;
  background: #E8F1F4 !important;
  box-shadow: inset 0 0 0 1px rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .users-ui-role-choice input { margin-top: 2px !important; }
body:not(.tv-body) .users-ui-role-choice span { gap: 2px !important; }
body:not(.tv-body) .users-ui-role-choice b { font-size: 12px !important; }
body:not(.tv-body) .users-ui-role-choice small { display: block !important; font-size: 10.5px !important; line-height: 1.3 !important; color: #64748b !important; }
body:not(.tv-body) .users-ui-permission-panel {
  margin: 0 !important;
  padding: 10px !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  border: 1px solid rgba(44,92,113,.13) !important;
}
body:not(.tv-body) .users-ui-permission-head { margin-bottom: 8px !important; }
body:not(.tv-body) .users-ui-permission-head b { font-size: 12.5px !important; }
body:not(.tv-body) .users-ui-permission-head small { font-size: 10.7px !important; }
body:not(.tv-body) .users-ui-submit { min-height: 38px !important; border-radius: 12px !important; }
body:not(.tv-body) .users-ui-permission-panel .permission-choice-grid { grid-template-columns: 1fr !important; gap: 6px !important; }
body:not(.tv-body) .users-ui-permission-panel .permission-choice {
  padding: 8px !important;
  border-radius: 12px !important;
  min-height: 48px !important;
}
body:not(.tv-body) .users-ui-permission-panel .permission-choice .icon { width: 16px !important; height: 16px !important; }
body:not(.tv-body) .users-ui-permission-panel .permission-choice b { font-size: 11.5px !important; }
body:not(.tv-body) .users-ui-permission-panel .permission-choice small { font-size: 10.2px !important; line-height: 1.25 !important; }
body:not(.tv-body) .permission-choice:has(input:checked) {
  border-color: rgba(44,92,113,.32) !important;
  background: #E8F1F4 !important;
}

body:not(.tv-body) .users-ui-list-card { min-width: 0 !important; }
body:not(.tv-body) .users-ui-list-head { align-items: center !important; flex-wrap: wrap !important; }
body:not(.tv-body) .users-ui-list-tools {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) 118px 118px !important;
  gap: 7px !important;
  align-items: center !important;
  flex: 1 1 540px !important;
  min-width: 0 !important;
  max-width: 720px !important;
}
body:not(.tv-body) .users-ui-search {
  min-width: 0 !important;
  width: 100% !important;
  background: #fff !important;
  border-radius: 12px !important;
}
body:not(.tv-body) .users-ui-filter { padding-right: 26px !important; }
body:not(.tv-body) .users-ui-access-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid rgba(44,92,113,.10) !important;
  background: #fff !important;
}
body:not(.tv-body) .users-ui-access-strip div {
  display: grid !important;
  grid-template-columns: 18px auto minmax(0,1fr) !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 8px 9px !important;
  border: 1px solid rgba(44,92,113,.11) !important;
  border-radius: 13px !important;
  background: #f8fafc !important;
}
body:not(.tv-body) .users-ui-access-strip .icon { width: 16px !important; height: 16px !important; color: #21485A !important; }
body:not(.tv-body) .users-ui-access-strip b { color: #0f172a !important; font-size: 11.5px !important; white-space: nowrap !important; }
body:not(.tv-body) .users-ui-access-strip span { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: #64748b !important; font-size: 10.8px !important; font-weight: 700 !important; }

body:not(.tv-body) .users-ui-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important;
  gap: 9px !important;
  padding: 12px !important;
}
body:not(.tv-body) .ux-user-card {
  position: relative !important;
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 11px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 9px 22px rgba(15,23,42,.045) !important;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}
body:not(.tv-body) .ux-user-card:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(44,92,113,.24) !important;
  box-shadow: 0 16px 32px rgba(15,23,42,.075) !important;
}
body:not(.tv-body) .ux-user-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 14px;
  right: 14px;
  height: 3px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, #2C5C71, #A9C7D2);
}
body:not(.tv-body) .ux-user-card.role-admin::before { background: linear-gradient(90deg, #10b981, #a7f3d0); }
body:not(.tv-body) .ux-user-card.is-disabled { opacity: .68 !important; filter: saturate(.76) !important; }
body:not(.tv-body) .ux-user-card-top {
  display: grid !important;
  grid-template-columns: 40px minmax(0,1fr) auto !important;
  gap: 9px !important;
  align-items: center !important;
}
body:not(.tv-body) .ux-user-avatar {
  width: 40px !important;
  height: 40px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: 0 10px 18px rgba(44,92,113,.18) !important;
}
body:not(.tv-body) .ux-user-card.role-admin .ux-user-avatar { background: linear-gradient(135deg, #047857, #10b981) !important; }
body:not(.tv-body) .ux-user-title { min-width: 0 !important; }
body:not(.tv-body) .ux-user-title b {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
}
body:not(.tv-body) .ux-user-title span {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .ux-user-badges {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 4px !important;
}
body:not(.tv-body) .ux-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 108px !important;
  padding: 4px 7px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #f1f5f9 !important;
  color: #21485A !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .ux-pill .icon { width: 11px !important; height: 11px !important; }
body:not(.tv-body) .ux-pill.role-admin { background: #ecfdf5 !important; color: #047857 !important; border-color: #bbf7d0 !important; }
body:not(.tv-body) .ux-pill.role-staff { background: #fffbeb !important; color: #b45309 !important; border-color: #fde68a !important; }
body:not(.tv-body) .ux-pill.active { background: #ecfdf5 !important; color: #047857 !important; border-color: #bbf7d0 !important; }
body:not(.tv-body) .ux-pill.disabled { background: #f1f5f9 !important; color: #64748b !important; border-color: #cbd5e1 !important; }
body:not(.tv-body) .ux-user-access {
  display: grid !important;
  grid-template-columns: 30px minmax(0,1fr) !important;
  gap: 8px !important;
  align-items: center !important;
  min-height: 54px !important;
  padding: 9px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #f8fafc !important;
}
body:not(.tv-body) .ux-user-access > span {
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .ux-user-access > span .icon { width: 15px !important; height: 15px !important; }
body:not(.tv-body) .ux-user-access.admin { background: #ecfdf5 !important; border-color: #bbf7d0 !important; }
body:not(.tv-body) .ux-user-access.admin > span { background: #d1fae5 !important; color: #047857 !important; }
body:not(.tv-body) .ux-user-access.warning { background: #fffbeb !important; border-color: #fde68a !important; }
body:not(.tv-body) .ux-user-access.warning > span { background: #fef3c7 !important; color: #b45309 !important; }
body:not(.tv-body) .ux-user-access b { display: block !important; font-size: 11.7px !important; color: #0f172a !important; }
body:not(.tv-body) .ux-user-access small {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  color: #64748b !important;
  font-size: 10.6px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .ux-user-meta {
  display: grid !important;
  gap: 4px !important;
  color: #64748b !important;
  font-size: 10.7px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .ux-user-meta span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .ux-user-meta .icon { width: 12px !important; height: 12px !important; }
body:not(.tv-body) .ux-user-meta .self { color: #047857 !important; }
body:not(.tv-body) .ux-user-meta .muted { color: #94a3b8 !important; }
body:not(.tv-body) .ux-user-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 5px !important;
}
body:not(.tv-body) .ux-user-actions .btn {
  min-height: 30px !important;
  justify-content: center !important;
  padding: 5px 7px !important;
  border-radius: 9px !important;
  font-size: 10.5px !important;
  line-height: 1 !important;
}
/* Delete button always spans full width for clear destructive separation */
body:not(.tv-body) .ux-user-actions .ux-delete-btn { grid-column: span 2 !important; }
/* Admin users: Password + Role on top row, Enable/Disable fills row, Delete full-width */
body:not(.tv-body) .ux-user-actions.is-admin-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
/* Staff users: Password + Access on first row, Role + Enable on second, Delete full-width */
body:not(.tv-body) .ux-user-actions.is-staff-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
body:not(.tv-body) .users-ui-empty { grid-column: 1 / -1 !important; padding: 34px 16px !important; border-radius: 18px !important; }

/* Users page popups */
body:not(.tv-body) .ux-user-modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  background: linear-gradient(135deg, #f0f6f8, #e4eef2) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .ux-user-modal-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .ux-user-modal-title > span {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  flex: 0 0 auto !important;
}
body:not(.tv-body) .ux-user-modal-title .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .ux-user-modal-title h2 { margin: 0 !important; font-size: 16px !important; color: #21485A !important; }
body:not(.tv-body) .ux-user-modal-title p { margin: 2px 0 0 !important; color: #64748b !important; font-size: 11.5px !important; font-weight: 650 !important; }
body:not(.tv-body) .ux-user-password-modal,
body:not(.tv-body) .ux-permission-modal-form {
  padding: 14px 16px 16px !important;
  gap: 11px !important;
}
body:not(.tv-body) .ux-user-modal-note {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  background: #f8fafc !important;
  color: #536878 !important;
  font-size: 11.8px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
body:not(.tv-body) .ux-user-modal-note .icon { width: 16px !important; height: 16px !important; color: #21485A !important; flex: 0 0 auto !important; margin-top: 1px !important; }
body:not(.tv-body) .ux-user-modal-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding-top: 2px !important;
}
body:not(.tv-body) .ux-user-modal-actions .btn { min-height: 36px !important; border-radius: 10px !important; }
body:not(.tv-body) .ux-permission-modal-form .permission-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .ux-permission-modal-form .permission-choice {
  min-height: 66px !important;
  padding: 10px !important;
  border-radius: 14px !important;
}

@media (max-width: 1220px) {
  body:not(.tv-body) .users-ui-layout { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .users-ui-create-card { position: static !important; }
}
@media (max-width: 980px) {
  body:not(.tv-body) .users-ui-hero.card { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .users-ui-hero-actions { justify-content: flex-start !important; flex-wrap: wrap !important; }
  body:not(.tv-body) .users-ui-status-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body:not(.tv-body) .users-ui-access-strip { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .users-ui-list-tools { grid-template-columns: 1fr !important; max-width: none !important; }
  body:not(.tv-body) .ux-permission-modal-form .permission-choice-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  body:not(.tv-body) .users-ui-hero-main { align-items: flex-start !important; }
  body:not(.tv-body) .users-ui-hero-icon { width: 44px !important; height: 44px !important; border-radius: 14px !important; }
  body:not(.tv-body) .users-ui-status-grid,
  body:not(.tv-body) .users-ui-role-grid,
  body:not(.tv-body) .users-ui-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .users-ui-card-head,
  body:not(.tv-body) .users-ui-list-head { align-items: flex-start !important; flex-direction: column !important; }
  body:not(.tv-body) .users-ui-hero-actions .btn,
  body:not(.tv-body) .ux-user-modal-actions .btn { width: 100% !important; justify-content: center !important; }
  body:not(.tv-body) .ux-user-modal-actions { flex-direction: column-reverse !important; }
  body:not(.tv-body) .ux-user-card-top { grid-template-columns: 38px minmax(0,1fr) !important; }
  body:not(.tv-body) .ux-user-badges { grid-column: 1 / -1 !important; flex-direction: row !important; align-items: center !important; }
}


body:not(.tv-body) .assets-ui-page {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
}
body:not(.tv-body) .assets-ui-hero.card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  background:
    radial-gradient(circle at 8% 12%, rgba(62,120,144,.17), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #f2f7f9 100%) !important;
  box-shadow: 0 14px 34px rgba(15,23,42,.07) !important;
}
body:not(.tv-body) .assets-ui-hero-main {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .assets-ui-hero-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 17px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(44,92,113,.26) !important;
}
body:not(.tv-body) .assets-ui-hero-icon .icon { width: 25px !important; height: 25px !important; }
body:not(.tv-body) .assets-ui-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #E8F1F4 !important;
  border: 1px solid #D6E5EA !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}
body:not(.tv-body) .assets-ui-eyebrow .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .assets-ui-hero h2 {
  margin: 7px 0 3px !important;
  color: #0f172a !important;
  font-size: clamp(20px, 2vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.015em !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-hero p {
  margin: 0 !important;
  max-width: 760px !important;
  color: #536878 !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}
body:not(.tv-body) .assets-ui-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  max-width: 520px !important;
}
body:not(.tv-body) .assets-ui-hero-actions .btn {
  min-height: 34px !important;
  padding: 7px 11px !important;
  border-radius: 10px !important;
  font-size: 11.5px !important;
}

body:not(.tv-body) .assets-ui-status-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
}
body:not(.tv-body) .assets-ui-metric {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 78px !important;
  padding: 11px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .assets-ui-metric > span {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .assets-ui-metric.success > span { background: #dcfce7 !important; color: #15803d !important; }
body:not(.tv-body) .assets-ui-metric.warning > span { background: #fef3c7 !important; color: #b45309 !important; }
body:not(.tv-body) .assets-ui-metric.info > span { background: #dbeafe !important; color: #1d4ed8 !important; }
body:not(.tv-body) .assets-ui-metric.muted > span { background: #f1f5f9 !important; color: #64748b !important; }
body:not(.tv-body) .assets-ui-metric .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .assets-ui-metric b {
  display: block !important;
  color: #0f172a !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .assets-ui-metric small,
body:not(.tv-body) .assets-ui-metric em {
  display: block !important;
  color: #64748b !important;
  font-size: 10.8px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}
body:not(.tv-body) .assets-ui-metric em { color: #94a3b8 !important; font-weight: 650 !important; margin-top: 2px !important; }

body:not(.tv-body) .assets-ui-quick-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 9px !important;
}
body:not(.tv-body) .assets-ui-tool-card {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 10px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #fff, #f8fafc) !important;
  color: #0f172a !important;
  cursor: pointer !important;
  text-align: left !important;
  box-shadow: 0 7px 20px rgba(15,23,42,.045) !important;
  transition: transform .12s, border-color .12s, box-shadow .12s, background .12s !important;
}
body:not(.tv-body) .assets-ui-tool-card:hover {
  transform: translateY(-1px) !important;
  border-color: #A9C7D2 !important;
  background: #E8F1F4 !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .assets-ui-tool-card > span {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .assets-ui-tool-card .icon { width: 17px !important; height: 17px !important; }
body:not(.tv-body) .assets-ui-tool-card b {
  display: block !important;
  color: #0f172a !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}
body:not(.tv-body) .assets-ui-tool-card small {
  display: block !important;
  margin-top: 2px !important;
  color: #64748b !important;
  font-size: 10.7px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

body:not(.tv-body) .assets-ui-panel-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .assets-ui-panel.card {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .assets-ui-panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 12px 14px !important;
  background: linear-gradient(180deg, #f8fbfc, #eef6f8) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .assets-ui-panel-head > div {
  display: grid !important;
  grid-template-columns: 36px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .assets-ui-panel-head > div > span {
  width: 36px !important;
  height: 36px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  color: #fff !important;
}
body:not(.tv-body) .assets-ui-panel-head .icon { width: 17px !important; height: 17px !important; }
body:not(.tv-body) .assets-ui-panel-head b { display: block !important; color: #21485A !important; font-size: 13px !important; font-weight: 600 !important; }
body:not(.tv-body) .assets-ui-panel-head small { display: block !important; color: #64748b !important; font-size: 11px !important; font-weight: 700 !important; }
body:not(.tv-body) .assets-ui-form { display: grid !important; gap: 10px !important; padding: 13px 14px 14px !important; }
body:not(.tv-body) .assets-ui-form-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
body:not(.tv-body) .assets-ui-drop-zone {
  display: grid !important;
  place-items: center !important;
  gap: 5px !important;
  min-height: 118px !important;
  padding: 14px !important;
  border: 1.5px dashed #A9C7D2 !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(232,241,244,.7), rgba(255,255,255,.72)) !important;
  color: #21485A !important;
  cursor: pointer !important;
  text-align: center !important;
}
body:not(.tv-body) .assets-ui-drop-zone:hover,
body:not(.tv-body) .assets-ui-drop-zone.drag-over,
body:not(.tv-body) .assets-ui-drop-zone:focus-visible {
  background: #E8F1F4 !important;
  border-color: #2C5C71 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.13) !important;
}
body:not(.tv-body) .assets-ui-drop-zone .icon { width: 26px !important; height: 26px !important; }
body:not(.tv-body) .assets-ui-drop-zone b { font-size: 13px !important; font-weight: 600 !important; }
body:not(.tv-body) .assets-ui-drop-zone span { max-width: 480px !important; color: #64748b !important; font-size: 11.5px !important; font-weight: 700 !important; line-height: 1.35 !important; }
body:not(.tv-body) .assets-ui-form-actions { display: flex !important; align-items: center !important; gap: 10px !important; justify-content: space-between !important; }
body:not(.tv-body) .assets-ui-form-actions small { color: #64748b !important; font-size: 11px !important; font-weight: 700 !important; }

body:not(.tv-body) .assets-ui-library.card {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  box-shadow: 0 12px 32px rgba(15,23,42,.06) !important;
}
body:not(.tv-body) .assets-ui-library-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 13px 15px !important;
  background: linear-gradient(135deg, #f8fbfc, #eef6f8) !important;
  border-bottom: 1px solid rgba(44,92,113,.12) !important;
}
body:not(.tv-body) .assets-ui-library-title {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .assets-ui-library-title > span {
  width: 40px !important;
  height: 40px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
}
body:not(.tv-body) .assets-ui-library-title .icon { width: 19px !important; height: 19px !important; }
body:not(.tv-body) .assets-ui-library-title h2 { margin: 0 !important; font-size: 16px !important; color: #21485A !important; font-weight: 600 !important; }
body:not(.tv-body) .assets-ui-library-title p { margin: 2px 0 0 !important; color: #64748b !important; font-size: 11.5px !important; font-weight: 700 !important; }
body:not(.tv-body) .assets-ui-bulk-actions { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 6px !important; flex-wrap: wrap !important; }
body:not(.tv-body) .assets-ui-bulk-actions .btn { min-height: 30px !important; padding: 5px 9px !important; font-size: 10.8px !important; border-radius: 9px !important; }

body:not(.tv-body) .assets-ui-filter-shell {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.45fr) repeat(4, minmax(130px, .62fr)) !important;
  gap: 8px !important;
  padding: 12px 15px 10px !important;
  border-bottom: 1px solid rgba(44,92,113,.08) !important;
  background: #fff !important;
}
body:not(.tv-body) .assets-ui-search-box {
  position: relative !important;
  min-width: 0 !important;
}
body:not(.tv-body) .assets-ui-search-box .icon {
  position: absolute !important;
  left: 11px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 15px !important;
  height: 15px !important;
  color: #64748b !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
body:not(.tv-body) .assets-ui-search-box .input { padding-left: 34px !important; width: 100% !important; }
body:not(.tv-body) .assets-ui-filter-shell .select,
body:not(.tv-body) .assets-ui-filter-shell .input { height: 36px !important; min-height: 36px !important; border-radius: 11px !important; font-size: 11.5px !important; }

body:not(.tv-body) .assets-ui-type-strip {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  padding: 0 15px 10px !important;
  background: #fff !important;
}
body:not(.tv-body) .assets-ui-type-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(44,92,113,.11) !important;
  background: #f8fafc !important;
  color: #536878 !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-type-pill b { color: #21485A !important; font-weight: 600 !important; }
body:not(.tv-body) .assets-ui-type-pill .icon { width: 12px !important; height: 12px !important; }
body:not(.tv-body) .assets-ui-note {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 15px 12px !important;
  padding: 9px 11px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #f8fafc !important;
  color: #536878 !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-note .icon { width: 14px !important; height: 14px !important; color: #21485A !important; }

body:not(.tv-body) .asset-grid.assets-ui-grid,
body:not(.tv-body) .assets-ui-grid.thumb-small,
body:not(.tv-body) .assets-ui-grid.thumb-medium,
body:not(.tv-body) .assets-ui-grid.thumb-large {
  display: grid !important;
  gap: 10px !important;
  padding: 0 15px 15px !important;
}
body:not(.tv-body) .assets-ui-grid.thumb-small { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; }
body:not(.tv-body) .assets-ui-grid.thumb-medium { grid-template-columns: repeat(auto-fill, minmax(225px, 1fr)) !important; }
body:not(.tv-body) .assets-ui-grid.thumb-large { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important; }
body:not(.tv-body) .assets-ui-card.enhanced-asset-card {
  min-height: 0 !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.055) !important;
  transition: transform .12s, box-shadow .12s, border-color .12s !important;
}
body:not(.tv-body) .assets-ui-card.enhanced-asset-card:hover {
  transform: translateY(-2px) !important;
  border-color: #A9C7D2 !important;
  box-shadow: 0 16px 36px rgba(15,23,42,.11) !important;
}
body:not(.tv-body) .assets-ui-card.enhanced-asset-card.selected {
  outline: 2px solid #2C5C71 !important;
  box-shadow: 0 0 0 4px rgba(44,92,113,.13), 0 16px 36px rgba(15,23,42,.11) !important;
}
body:not(.tv-body) .assets-ui-card-topbar {
  top: 8px !important;
  left: 8px !important;
  right: 8px !important;
  gap: 6px !important;
}
body:not(.tv-body) .assets-ui-check,
body:not(.tv-body) .assets-ui-usage {
  min-height: 26px !important;
  max-width: 54% !important;
  border-radius: 999px !important;
  padding: 4px 7px !important;
  backdrop-filter: blur(8px) !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.13) !important;
  color: #21485A !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-check input { width: 13px !important; height: 13px !important; accent-color: #2C5C71 !important; }
body:not(.tv-body) .assets-ui-usage.used { background: rgba(236,253,245,.94) !important; color: #047857 !important; }
body:not(.tv-body) .assets-ui-usage.unused { background: rgba(255,251,235,.94) !important; color: #b45309 !important; }
body:not(.tv-body) .assets-ui-usage .icon { width: 12px !important; height: 12px !important; }
body:not(.tv-body) .assets-ui-preview {
  height: 130px !important;
  min-height: 130px !important;
  border-bottom: 1px solid rgba(44,92,113,.09) !important;
  background: linear-gradient(135deg, #e8eef1, #f8fafc) !important;
}
body:not(.tv-body) .thumb-small .assets-ui-preview { height: 112px !important; min-height: 112px !important; }
body:not(.tv-body) .thumb-large .assets-ui-preview { height: 170px !important; min-height: 170px !important; }
body:not(.tv-body) .assets-ui-info { padding: 10px !important; gap: 7px !important; }
body:not(.tv-body) .assets-ui-title-row { grid-template-columns: minmax(0,1fr) auto !important; gap: 7px !important; align-items: center !important; }
body:not(.tv-body) .assets-ui-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .assets-ui-type-badge {
  min-height: 22px !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #E8F1F4 !important;
  color: #21485A !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-type-badge .icon { width: 11px !important; height: 11px !important; }
body:not(.tv-body) .assets-ui-meta-row { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; }
body:not(.tv-body) .assets-ui-meta-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 100% !important;
  padding: 3px 6px !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(44,92,113,.08) !important;
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .assets-ui-meta-pill .icon { width: 10.5px !important; height: 10.5px !important; }
body:not(.tv-body) .assets-ui-meta-pill.ok { background: #ecfdf5 !important; color: #047857 !important; border-color: #bbf7d0 !important; }
body:not(.tv-body) .assets-ui-meta-pill.danger { background: #fef2f2 !important; color: #b91c1c !important; border-color: #fecaca !important; }
body:not(.tv-body) .assets-ui-source {
  color: #64748b !important;
  font-size: 11px !important;
  line-height: 1.32 !important;
  font-weight: 650 !important;
  max-height: 30px !important;
  min-height: 15px !important;
}
body:not(.tv-body) .assets-ui-tags { min-height: 23px !important; align-content: start !important; }
body:not(.tv-body) .assets-ui-tags .asset-tag {
  border-radius: 999px !important;
  padding: 3px 7px !important;
  background: #f1f5f9 !important;
  color: #536878 !important;
  font-size: 9.6px !important;
  font-weight: 600 !important;
  border: 1px solid rgba(44,92,113,.08) !important;
}
body:not(.tv-body) .assets-ui-tags .asset-tag.muted { color: #94a3b8 !important; font-weight: 700 !important; }
body:not(.tv-body) .assets-ui-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .assets-ui-actions .btn {
  min-height: 29px !important;
  padding: 4px 6px !important;
  justify-content: center !important;
  border-radius: 9px !important;
  font-size: 10.3px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .assets-ui-actions .btn .icon { width: 11px !important; height: 11px !important; }
body:not(.tv-body) .assets-ui-actions .btn.danger { grid-column: span 2 !important; }
body:not(.tv-body) .assets-ui-empty {
  grid-column: 1 / -1 !important;
  min-height: 230px !important;
  border: 1.5px dashed #A9C7D2 !important;
  border-radius: 18px !important;
  background: #f8fafc !important;
}
body:not(.tv-body) .assets-ui-empty .btn { margin-top: 8px !important; }

@media (max-width: 1240px) {
  body:not(.tv-body) .assets-ui-hero.card { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .assets-ui-hero-actions { justify-content: flex-start !important; max-width: none !important; }
  body:not(.tv-body) .assets-ui-quick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .assets-ui-filter-shell { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .assets-ui-search-box { grid-column: 1 / -1 !important; }
}
@media (max-width: 900px) {
  body:not(.tv-body) .assets-ui-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .assets-ui-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body:not(.tv-body) .assets-ui-panel-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .assets-ui-library-head { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .assets-ui-bulk-actions { justify-content: flex-start !important; }
  body:not(.tv-body) .assets-ui-filter-shell { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  body:not(.tv-body) .assets-ui-hero-main { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .assets-ui-hero-icon { width: 44px !important; height: 44px !important; }
  body:not(.tv-body) .assets-ui-status-grid,
  body:not(.tv-body) .assets-ui-quick-grid,
  body:not(.tv-body) .assets-ui-filter-shell,
  body:not(.tv-body) .assets-ui-form-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .assets-ui-hero-actions .btn,
  body:not(.tv-body) .assets-ui-bulk-actions .btn,
  body:not(.tv-body) .assets-ui-form-actions .btn { width: 100% !important; justify-content: center !important; }
  body:not(.tv-body) .assets-ui-form-actions { align-items: stretch !important; flex-direction: column !important; }
  body:not(.tv-body) .asset-grid.assets-ui-grid { grid-template-columns: 1fr !important; }
}


body:not(.tv-body) .assets-ui-panel-head .assets-ui-panel-hide {
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(44,92,113,.16) !important;
  background: rgba(255,255,255,.78) !important;
  color: #536878 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  box-shadow: 0 5px 12px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .assets-ui-panel-head .assets-ui-panel-hide .icon {
  width: 13px !important;
  height: 13px !important;
  color: currentColor !important;
  stroke: currentColor !important;
}
body:not(.tv-body) .assets-ui-panel-head .assets-ui-panel-hide:hover {
  background: #fff1f2 !important;
  border-color: #fecdd3 !important;
  color: #be123c !important;
}
body:not(.tv-body) .assets-ui-panel-head .assets-ui-panel-hide:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.16) !important;
}

body:not(.tv-body) .assets-ui-page .btn.primary:not(.soft),
body:not(.tv-body) .assets-ui-page button.btn.primary:not(.soft),
body:not(.tv-body) .assets-ui-page a.btn.primary:not(.soft) {
  color: #ffffff !important;
}
body:not(.tv-body) .assets-ui-page .btn.primary:not(.soft) .icon,
body:not(.tv-body) .assets-ui-page .btn.primary:not(.soft) svg.icon,
body:not(.tv-body) .assets-ui-form-actions .btn.primary:not(.soft) .icon,
body:not(.tv-body) .assets-ui-hero-actions .btn.primary:not(.soft) .icon,
body:not(.tv-body) .assets-ui-empty .btn.primary:not(.soft) .icon {
  color: #ffffff !important;
  stroke: #ffffff !important;
}
body:not(.tv-body) .assets-ui-page .btn.primary.soft .icon,
body:not(.tv-body) .assets-ui-page .btn.primary.soft svg.icon {
  color: #21485A !important;
  stroke: currentColor !important;
}

body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium {
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
  gap: 11px !important;
  align-items: start !important;
}
body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium .assets-ui-preview {
  height: 122px !important;
  min-height: 122px !important;
}
body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium .assets-ui-card {
  border-radius: 16px !important;
}
body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium .assets-ui-usage {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium .assets-ui-actions {
  gap: 6px !important;
}
body:not(.tv-body) .asset-grid.enhanced-assets.assets-ui-grid.thumb-medium .assets-ui-actions .btn {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}


body:not(.tv-body) [data-tip]::before,
body:not(.tv-body) [data-tip]::after {
  display: none !important;
  content: none !important;
}
body:not(.tv-body) .admin-floating-tooltip {
  position: fixed !important;
  z-index: 2147483000 !important;
  max-width: min(280px, calc(100vw - 24px)) !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, .96) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: center !important;
  letter-spacing: 0 !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, .26) !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(4px) scale(.98) !important;
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease !important;
  white-space: normal !important;
}
body:not(.tv-body) .admin-floating-tooltip.show {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
}
body:not(.tv-body) .admin-floating-tooltip::after {
  content: "" !important;
  position: absolute !important;
  left: var(--tooltip-anchor-x, 50%) !important;
  width: 10px !important;
  height: 10px !important;
  background: rgba(15, 23, 42, .96) !important;
  transform: translateX(-50%) rotate(45deg) !important;
  pointer-events: none !important;
}
body:not(.tv-body) .admin-floating-tooltip.place-top::after {
  bottom: -5px !important;
}
body:not(.tv-body) .admin-floating-tooltip.place-bottom::after {
  top: -5px !important;
}
body:not(.tv-body) #mediaUploadPanel,
body:not(.tv-body) #mediaLinkPanel,
body:not(.tv-body) .assets-ui-panel-grid,
body:not(.tv-body) .assets-ui-page {
  overflow: visible !important;
}


body:not(.tv-body) .playlists-ui-page {
  display: grid;
  gap: 12px;
  width: 100%;
  min-width: 0;
}
body:not(.tv-body) .playlists-ui-hero {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.08fr) minmax(360px, .92fr) auto;
  align-items: stretch;
  gap: 14px;
  padding: 16px !important;
  overflow: visible !important;
  background:
    radial-gradient(circle at 4% 0%, rgba(44,92,113,.16), transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f3f8fa 56%,#e8f1f4 100%) !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  box-shadow: 0 18px 42px rgba(15,23,42,.07) !important;
}
body:not(.tv-body) .playlists-ui-hero-copy h2 {
  margin: 3px 0 4px !important;
  font-size: clamp(22px, 2.2vw, 31px) !important;
  line-height: 1.05 !important;
  color: #143746 !important;
  letter-spacing: -.01em;
}
body:not(.tv-body) .playlists-ui-hero-copy p {
  margin: 0 !important;
  max-width: 680px;
  color: #526777 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
body:not(.tv-body) .playlists-ui-hero-stats {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 8px;
  min-width: 0;
}
body:not(.tv-body) .playlists-ui-stat {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr);
  grid-template-rows: auto auto;
  gap: 1px 8px;
  align-items: center;
  min-height: 64px;
  padding: 9px 10px;
  border-radius: 16px;
  border: 1px solid rgba(44,92,113,.13);
  background: rgba(255,255,255,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 24px rgba(15,23,42,.045);
}
body:not(.tv-body) .playlists-ui-stat > span {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg,#21485A,#3E7890);
  box-shadow: 0 8px 18px rgba(44,92,113,.22);
}
body:not(.tv-body) .playlists-ui-stat.ok > span { background: linear-gradient(135deg,#047857,#16a34a); }
body:not(.tv-body) .playlists-ui-stat.warning > span { background: linear-gradient(135deg,#b45309,#f59e0b); }
body:not(.tv-body) .playlists-ui-stat b {
  font-size: 20px;
  line-height: 1;
  font-weight: 600;
  color: #0f172a;
}
body:not(.tv-body) .playlists-ui-stat small {
  color: #64748b;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 600;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-hero-actions {
  align-self: stretch;
  justify-content: center;
  display: flex !important;
  flex-direction: column;
  gap: 7px;
  min-width: 160px;
}
body:not(.tv-body) .playlists-ui-hero-actions .btn {
  width: 100%;
  justify-content: center;
  min-height: 35px;
}
body:not(.tv-body) .playlists-ui-active-strip {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: stretch;
}
body:not(.tv-body) .playlists-ui-active-card {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 18px;
  border: 1px solid rgba(44,92,113,.13);
  background: linear-gradient(135deg,#fff,#f8fbfc);
  box-shadow: 0 8px 22px rgba(15,23,42,.045);
  min-width: 0;
}
body:not(.tv-body) .playlists-ui-active-card > span {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  background: #21485A;
}
body:not(.tv-body) .playlists-ui-active-card b {
  display: block;
  font-size: 14px;
  color: #143746;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-active-card small {
  color: #64748b;
  font-size: 11.5px;
}
body:not(.tv-body) .playlists-ui-workspace {
  display: grid !important;
  grid-template-columns: minmax(250px, 300px) minmax(0,1fr);
  align-items: start;
  gap: 12px !important;
  min-width: 0;
}
body:not(.tv-body) .playlists-ui-sidebar {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 10px;
  padding: 12px !important;
  max-height: calc(100vh - 112px);
  overflow: visible !important;
}
body:not(.tv-body) .playlists-ui-sidebar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
body:not(.tv-body) .playlists-ui-sidebar-head .section-title { margin: 0 !important; }
body:not(.tv-body) .playlists-ui-sidebar-search {
  display: grid;
  grid-template-columns: 16px minmax(0,1fr);
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(44,92,113,.13);
  border-radius: 12px;
  background: #f8fbfc;
}
body:not(.tv-body) .playlists-ui-sidebar-search .input {
  min-height: 32px !important;
  height: 32px !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}
body:not(.tv-body) .playlists-ui-card-list {
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 220px);
  overflow-y: auto;
  padding-right: 3px;
}
body:not(.tv-body) .playlists-ui-card-list::-webkit-scrollbar,
body:not(.tv-body) .playlists-ui-picker::-webkit-scrollbar,
body:not(.tv-body) .playlists-ui-items-list::-webkit-scrollbar { width: 5px; height: 5px; }
body:not(.tv-body) .playlists-ui-card-list::-webkit-scrollbar-thumb,
body:not(.tv-body) .playlists-ui-picker::-webkit-scrollbar-thumb,
body:not(.tv-body) .playlists-ui-items-list::-webkit-scrollbar-thumb { background: rgba(44,92,113,.24); border-radius: 99px; }
body:not(.tv-body) .playlists-ui-select-card {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 6px;
  min-height: 74px;
  padding: 8px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 7px 18px rgba(15,23,42,.035) !important;
  overflow: visible !important;
}
body:not(.tv-body) .playlists-ui-select-card.active {
  border-color: rgba(44,92,113,.44) !important;
  background: linear-gradient(135deg,#f8fbfc,#e8f1f4) !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.10), 0 12px 28px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .playlists-ui-select-card.dirty::after {
  content: "Draft";
  position: absolute;
  top: -7px;
  right: 10px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .05em;
  color: #92400e;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
body:not(.tv-body) .playlists-ui-card-main {
  display: grid !important;
  grid-template-columns: 36px minmax(0,1fr) !important;
  gap: 9px !important;
  align-items: center !important;
  min-width: 0;
  text-align: left;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  cursor: pointer;
}
body:not(.tv-body) .playlists-ui-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: #21485A;
  background: #E8F1F4;
}
body:not(.tv-body) .playlists-ui-select-card.active .playlists-ui-card-icon {
  background: linear-gradient(135deg,#21485A,#3E7890);
  color: #fff;
}
body:not(.tv-body) .playlists-ui-card-copy { min-width: 0; display: grid; gap: 2px; }
body:not(.tv-body) .playlists-ui-card-copy b {
  font-size: 12.8px;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-card-copy small,
body:not(.tv-body) .playlists-ui-card-copy em {
  display: block;
  font-style: normal;
  font-size: 10.5px;
  line-height: 1.22;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-card-actions {
  display: flex !important;
  flex-direction: column;
  gap: 5px !important;
  margin: 0 !important;
}
body:not(.tv-body) .playlists-ui-card-actions .btn {
  width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 9px !important;
}
body:not(.tv-body) .playlists-ui-select-card.hidden { display: none !important; }
body:not(.tv-body) .playlists-ui-editor { display: grid; gap: 12px; min-width: 0; }
body:not(.tv-body) .playlists-ui-selected-card {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px !important;
  background: linear-gradient(135deg,#ffffff,#f8fbfc) !important;
}
body:not(.tv-body) .playlists-ui-selected-left {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 11px;
  min-width: 0;
}
body:not(.tv-body) .playlists-ui-selected-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg,#21485A,#3E7890);
  box-shadow: 0 12px 24px rgba(44,92,113,.24);
}
body:not(.tv-body) .playlists-ui-selected-card .section-title { margin: 0 0 3px !important; }
body:not(.tv-body) .playlists-ui-selected-card .section-title h2 {
  font-size: 17px !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-selected-card p {
  margin: 0 0 6px !important;
  color: #536878 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .playlists-ui-summary-row {
  display: flex !important;
  flex-wrap: wrap;
  gap: 5px !important;
  margin: 0 0 6px !important;
}
body:not(.tv-body) .playlists-ui-summary-row span,
body:not(.tv-body) .playlists-ui-assigned-row em {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(44,92,113,.12);
  background: #f8fbfc;
  color: #21485A;
  font-size: 10.5px;
  font-weight: 600;
  font-style: normal;
}
body:not(.tv-body) .playlists-ui-summary-row .is-warning { background: #fffbeb; color: #92400e; border-color: #fde68a; }
body:not(.tv-body) .playlists-ui-summary-row .is-ok { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }
body:not(.tv-body) .playlists-ui-assigned-row { display: flex; flex-wrap: wrap; gap: 5px; }
body:not(.tv-body) .playlists-ui-assigned-row em.warning { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
body:not(.tv-body) .playlists-ui-selected-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(120px,1fr));
  gap: 7px !important;
  min-width: 290px;
  margin: 0 !important;
}
body:not(.tv-body) .playlists-ui-selected-actions .btn {
  min-height: 32px !important;
  height: 32px !important;
  padding: 6px 10px !important;
  justify-content: center;
  font-size: 11.5px !important;
}
body:not(.tv-body) .playlists-ui-timeline-card,
body:not(.tv-body) .playlists-ui-add-card,
body:not(.tv-body) .playlists-ui-items-card {
  padding: 12px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.04) !important;
}
body:not(.tv-body) .playlists-ui-timeline-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: start !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
}
body:not(.tv-body) .playlists-ui-timeline-head .section-title { margin: 0 !important; }
body:not(.tv-body) .playlists-ui-timeline-head small { color: #64748b; font-size: 11px; }
body:not(.tv-body) .playlists-ui-timeline-bar {
  display: flex !important;
  height: 42px !important;
  gap: 3px;
  padding: 4px;
  border-radius: 16px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  background: #eef6f8 !important;
  border: 1px solid rgba(44,92,113,.14) !important;
}
body:not(.tv-body) .playlists-ui-timeline-bar:not(.is-empty) .timeline-segment {
  flex: 0 0 var(--seg-width, 10%);
  min-width: 52px !important;
  height: 32px;
  border: 0 !important;
  border-radius: 12px;
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
  gap: 3px 6px;
  padding: 4px 7px !important;
  color: #fff !important;
  text-align: left;
  background: linear-gradient(135deg,#21485A,#3E7890) !important;
}
body:not(.tv-body) .playlists-ui-timeline-bar .timeline-segment:nth-child(2n) { background: linear-gradient(135deg,#0f766e,#14b8a6) !important; }
body:not(.tv-body) .playlists-ui-timeline-bar .timeline-segment.disabled { opacity: .55; filter: grayscale(.2); }
body:not(.tv-body) .playlists-ui-timeline-bar .timeline-segment b { grid-row: 1 / span 2; font-size: 10px; }
body:not(.tv-body) .playlists-ui-timeline-bar .timeline-segment span { font-size: 10px; font-weight: 600; }
body:not(.tv-body) .playlists-ui-timeline-bar .timeline-segment em { font-style: normal; font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .9; }
body:not(.tv-body) .playlists-ui-timeline-hint { margin-top: 8px; }
body:not(.tv-body) .playlists-ui-panel-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
body:not(.tv-body) .playlists-ui-panel-head .section-title { margin: 0 0 2px !important; }
body:not(.tv-body) .playlists-ui-panel-head p { margin: 0; color: #64748b; font-size: 12px; }
body:not(.tv-body) .playlists-ui-picker-stats {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px !important;
  margin: 0 0 9px !important;
}
body:not(.tv-body) .playlists-ui-picker-stats .picker-filter-chip {
  min-height: 30px !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  background: #f8fbfc !important;
  color: #21485A !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .playlists-ui-picker-stats .picker-filter-chip.active {
  background: #21485A !important;
  color: #fff !important;
  border-color: #21485A !important;
  box-shadow: 0 8px 18px rgba(44,92,113,.18);
}
body:not(.tv-body) .playlists-ui-picker-controls {
  display: grid !important;
  grid-template-columns: minmax(260px,1fr) minmax(170px,220px) minmax(230px,.8fr);
  align-items: center;
  gap: 8px !important;
  margin-bottom: 10px;
}
body:not(.tv-body) .playlists-ui-picker-controls .search-wrap,
body:not(.tv-body) .playlists-ui-picker-controls .select,
body:not(.tv-body) .playlists-ui-picker-controls .inline-tip {
  min-height: 34px !important;
  border-radius: 12px !important;
}
body:not(.tv-body) .playlists-ui-picker-controls .inline-tip {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid rgba(44,92,113,.12);
  background: #f8fbfc;
  color: #536878;
  font-size: 11px;
  font-weight: 600;
}
body:not(.tv-body) .playlists-ui-picker {
  display: grid !important;
  grid-template-columns: repeat(auto-fill,minmax(210px,1fr));
  gap: 8px !important;
  max-height: 260px;
  overflow-y: auto;
  padding: 2px 3px 3px 0;
}
body:not(.tv-body) .playlists-ui-picker-card {
  display: grid !important;
  grid-template-columns: 58px minmax(0,1fr) 28px !important;
  align-items: center;
  gap: 8px !important;
  min-height: 70px;
  padding: 8px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: linear-gradient(135deg,#fff,#f8fbfc) !important;
  color: #0f172a !important;
  text-align: left;
  box-shadow: 0 6px 16px rgba(15,23,42,.035) !important;
}
body:not(.tv-body) .playlists-ui-picker-card:hover {
  border-color: rgba(44,92,113,.36) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .playlists-ui-picker-thumb {
  width: 58px !important;
  height: 44px !important;
  border-radius: 12px !important;
  overflow: hidden;
  background: #eef6f8;
}
body:not(.tv-body) .playlists-ui-picker-thumb :where(img,video,iframe) { width: 100%; height: 100%; object-fit: cover; }
body:not(.tv-body) .playlists-ui-picker-copy { min-width: 0; }
body:not(.tv-body) .playlists-ui-picker-copy b {
  display: block;
  font-size: 12px;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-picker-copy small {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #64748b;
  font-size: 10.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.tv-body) .playlists-ui-add-icon {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  background: #21485A;
}
body:not(.tv-body) .playlists-ui-order-toolbar {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 0 !important;
  margin-bottom: 10px;
}
body:not(.tv-body) .playlists-ui-order-toolbar .section-title { margin: 0 !important; }
body:not(.tv-body) .playlists-ui-order-actions {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px !important;
}
body:not(.tv-body) .playlists-ui-order-actions .btn { min-height: 30px !important; height: 30px !important; font-size: 11px !important; padding: 5px 9px !important; }
body:not(.tv-body) .playlists-ui-items-list {
  display: grid;
  gap: 8px;
  max-height: 520px;
  overflow-y: auto;
  padding-right: 3px;
}
body:not(.tv-body) .playlists-ui-item {
  display: grid !important;
  grid-template-columns: 48px 76px minmax(220px,1fr) 112px auto;
  gap: 10px;
  align-items: center;
  padding: 9px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 7px 18px rgba(15,23,42,.035);
  transition: border-color .14s, box-shadow .14s, transform .12s;
}
body:not(.tv-body) .playlists-ui-item:hover {
  border-color: rgba(44,92,113,.30) !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.07);
}
body:not(.tv-body) .playlists-ui-item.selected {
  border-color: rgba(44,92,113,.46) !important;
  box-shadow: 0 0 0 3px rgba(44,92,113,.10);
}
body:not(.tv-body) .playlists-ui-item.disabled { opacity: .62; background: #f8fafc !important; }
body:not(.tv-body) .playlists-ui-item.dragging { opacity: .5; transform: scale(.99); }
body:not(.tv-body) .playlists-ui-item.drag-over { border-color: #2C5C71 !important; box-shadow: 0 0 0 3px rgba(44,92,113,.12); }
body:not(.tv-body) .playlists-ui-drag {
  display: grid !important;
  grid-template-columns: 18px 16px;
  grid-template-rows: 16px 18px;
  place-items: center;
  gap: 2px;
  color: #64748b;
  cursor: grab;
  font-weight: 600;
  border-radius: 12px;
  background: #f8fbfc;
  border: 1px solid rgba(44,92,113,.10);
  min-height: 48px;
  margin: 0 !important;
}
body:not(.tv-body) .playlists-ui-drag input { width: 14px; height: 14px; }
body:not(.tv-body) .playlists-ui-drag span { grid-column: 1 / -1; font-size: 10px; color: #21485A; }
body:not(.tv-body) .playlists-ui-item-thumb {
  width: 76px !important;
  height: 52px !important;
  border-radius: 13px !important;
  overflow: hidden;
  background: #eef6f8;
}
body:not(.tv-body) .playlists-ui-item-thumb :where(img,video,iframe) { width: 100%; height: 100%; object-fit: cover; }
body:not(.tv-body) .playlists-ui-item-main { min-width: 0; }
body:not(.tv-body) .playlists-ui-item-main .item-name {
  font-size: 13px !important;
  font-weight: 600;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-item-main .item-type,
body:not(.tv-body) .playlists-ui-item-main .item-schedule {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #64748b;
  font-size: 10.5px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.tv-body) .playlists-ui-duration-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
body:not(.tv-body) .playlists-ui-duration-pills .pill-btn {
  min-height: 23px;
  padding: 3px 7px;
  border-radius: 999px;
  border: 1px solid rgba(44,92,113,.13);
  background: #f8fbfc;
  color: #21485A;
  font-size: 10px;
  font-weight: 600;
}
body:not(.tv-body) .playlists-ui-duration-pills .pill-btn:hover { background: #E8F1F4; }
body:not(.tv-body) .playlists-ui-duration-control {
  display: grid;
  gap: 4px;
  padding: 7px;
  border-radius: 13px;
  background: #f8fbfc;
  border: 1px solid rgba(44,92,113,.10);
}
body:not(.tv-body) .playlists-ui-duration-control label {
  color: #64748b;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
}
body:not(.tv-body) .playlists-ui-duration-control > div {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 5px;
  align-items: center;
}
body:not(.tv-body) .playlists-ui-duration-control .duration-input {
  height: 28px !important;
  min-height: 28px !important;
  padding: 4px 6px !important;
  text-align: center;
  font-weight: 600;
}
body:not(.tv-body) .playlists-ui-duration-control span { font-size: 10px; color: #64748b; font-weight: 600; }
body:not(.tv-body) .playlists-ui-item-actions {
  display: grid !important;
  grid-template-columns: repeat(5, 30px);
  gap: 5px;
}
body:not(.tv-body) .playlists-ui-item-actions .btn {
  width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 10px !important;
}
body:not(.tv-body) .playlists-ui-details-popup {
  padding: 14px;
  display: grid;
  gap: 12px;
}
body:not(.tv-body) .playlists-ui-popup-intro {
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg,#f8fbfc,#e8f1f4) !important;
  border: 1px solid rgba(44,92,113,.13) !important;
}
body:not(.tv-body) .playlists-ui-details-form { gap: 11px !important; }
body:not(.tv-body) .playlists-ui-details-form .form-row {
  padding: 10px;
  border-radius: 14px;
  background: #f8fbfc;
  border: 1px solid rgba(44,92,113,.10);
}
body:not(.tv-body) .playlists-ui-empty,
body:not(.tv-body) .playlists-ui-items-empty,
body:not(.tv-body) .playlists-ui-picker-empty {
  min-height: 180px;
  justify-content: center;
  align-items: center;
  text-align: center;
}
@media (max-width: 1180px) {
  body:not(.tv-body) .playlists-ui-hero { grid-template-columns: 1fr; }
  body:not(.tv-body) .playlists-ui-hero-actions { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; }
  body:not(.tv-body) .playlists-ui-hero-actions .btn { width: auto; }
  body:not(.tv-body) .playlists-ui-workspace { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .playlists-ui-sidebar { position: static; max-height: none; }
  body:not(.tv-body) .playlists-ui-card-list { max-height: 240px; }
  body:not(.tv-body) .playlists-ui-item { grid-template-columns: 48px 70px minmax(0,1fr); }
  body:not(.tv-body) .playlists-ui-duration-control,
  body:not(.tv-body) .playlists-ui-item-actions { grid-column: 3; }
  body:not(.tv-body) .playlists-ui-item-actions { grid-template-columns: repeat(5, 30px); justify-content: start; }
}
@media (max-width: 860px) {
  body:not(.tv-body) .playlists-ui-hero-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body:not(.tv-body) .playlists-ui-active-strip,
  body:not(.tv-body) .playlists-ui-selected-card,
  body:not(.tv-body) .playlists-ui-timeline-head,
  body:not(.tv-body) .playlists-ui-panel-head,
  body:not(.tv-body) .playlists-ui-order-toolbar,
  body:not(.tv-body) .playlists-ui-picker-controls { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .playlists-ui-selected-actions { min-width: 0; grid-template-columns: repeat(2,minmax(0,1fr)); }
  body:not(.tv-body) .playlists-ui-active-strip > .btn { width: 100%; justify-content: center; }
}
@media (max-width: 620px) {
  body:not(.tv-body) .playlists-ui-hero-stats,
  body:not(.tv-body) .playlists-ui-selected-left,
  body:not(.tv-body) .playlists-ui-selected-actions { grid-template-columns: 1fr; }
  body:not(.tv-body) .playlists-ui-item { grid-template-columns: 42px minmax(0,1fr); }
  body:not(.tv-body) .playlists-ui-item-thumb { grid-column: 1; grid-row: 2; width: 42px !important; height: 34px !important; }
  body:not(.tv-body) .playlists-ui-item-main { grid-column: 2; grid-row: 1 / span 2; }
  body:not(.tv-body) .playlists-ui-duration-control,
  body:not(.tv-body) .playlists-ui-item-actions { grid-column: 1 / -1; }
  body:not(.tv-body) .playlists-ui-picker { grid-template-columns: 1fr; }
}


body:not(.tv-body) .screens-ui-page,
body:not(.tv-body) .health-ui-page,
body:not(.tv-body) .offline-ui-page {
  display: grid !important;
  gap: 14px !important;
  width: 100% !important;
  color: #0f172a !important;
}

body:not(.tv-body) .screens-ui-hero.card,
body:not(.tv-body) .health-ui-hero.card,
body:not(.tv-body) .offline-ui-hero.card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 18px !important;
  align-items: stretch !important;
  padding: 18px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 4% 20%, rgba(44, 92, 113, .13), transparent 31%),
    linear-gradient(135deg, #ffffff 0%, #f3f8fa 58%, #e8f1f4 100%) !important;
  box-shadow: 0 18px 45px rgba(15, 23, 42, .08) !important;
  overflow: hidden !important;
  position: relative !important;
}
body:not(.tv-body) .screens-ui-hero.card::after,
body:not(.tv-body) .health-ui-hero.card::after,
body:not(.tv-body) .offline-ui-hero.card::after {
  content: "" !important;
  position: absolute !important;
  right: -70px !important;
  top: -90px !important;
  width: 250px !important;
  height: 250px !important;
  border-radius: 999px !important;
  background: rgba(44, 92, 113, .08) !important;
  pointer-events: none !important;
}
body:not(.tv-body) .screens-ui-hero-main,
body:not(.tv-body) .health-ui-hero-main,
body:not(.tv-body) .offline-ui-hero-main {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
body:not(.tv-body) .screens-ui-hero-icon,
body:not(.tv-body) .health-ui-hero-icon,
body:not(.tv-body) .offline-ui-hero-icon {
  width: 54px !important;
  height: 54px !important;
  border-radius: 18px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  box-shadow: 0 14px 28px rgba(44, 92, 113, .24) !important;
  flex-shrink: 0 !important;
}
body:not(.tv-body) .screens-ui-hero-icon .icon,
body:not(.tv-body) .health-ui-hero-icon .icon,
body:not(.tv-body) .offline-ui-hero-icon .icon { width: 26px !important; height: 26px !important; }
body:not(.tv-body) .screens-ui-eyebrow,
body:not(.tv-body) .health-ui-eyebrow,
body:not(.tv-body) .offline-ui-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 9px !important;
  border-radius: 99px !important;
  background: rgba(44, 92, 113, .10) !important;
  color: #21485A !important;
  font-size: 10.8px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}
body:not(.tv-body) .screens-ui-eyebrow .icon,
body:not(.tv-body) .health-ui-eyebrow .icon,
body:not(.tv-body) .offline-ui-eyebrow .icon { width: 13px !important; height: 13px !important; }
body:not(.tv-body) .screens-ui-hero h2,
body:not(.tv-body) .health-ui-hero h2,
body:not(.tv-body) .offline-ui-hero h2 {
  margin: 7px 0 3px !important;
  color: #21485A !important;
  font-size: 22px !important;
  line-height: 1.1 !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .screens-ui-hero p,
body:not(.tv-body) .health-ui-hero p,
body:not(.tv-body) .offline-ui-hero p {
  max-width: 720px !important;
  margin: 0 !important;
  color: #475569 !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}
body:not(.tv-body) .screens-ui-progress,
body:not(.tv-body) .health-ui-livebar,
body:not(.tv-body) .offline-ui-progress {
  margin-top: 10px !important;
  display: grid !important;
  gap: 6px !important;
  max-width: 420px !important;
}
body:not(.tv-body) .screens-ui-progress span,
body:not(.tv-body) .health-ui-livebar span,
body:not(.tv-body) .offline-ui-progress span {
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .screens-ui-progress b,
body:not(.tv-body) .health-ui-livebar b,
body:not(.tv-body) .offline-ui-progress b { color: #21485A !important; }
body:not(.tv-body) .screens-ui-progress div,
body:not(.tv-body) .health-ui-livebar div,
body:not(.tv-body) .offline-ui-progress div {
  height: 7px !important;
  border-radius: 99px !important;
  overflow: hidden !important;
  background: rgba(44, 92, 113, .12) !important;
}
body:not(.tv-body) .screens-ui-progress i,
body:not(.tv-body) .health-ui-livebar i,
body:not(.tv-body) .offline-ui-progress i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #16a34a, #2C5C71) !important;
}
body:not(.tv-body) .screens-ui-hero-actions,
body:not(.tv-body) .health-ui-actions,
body:not(.tv-body) .offline-ui-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  align-content: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  max-width: 360px !important;
  position: relative !important;
  z-index: 1 !important;
}
body:not(.tv-body) .screens-ui-hero-actions .btn,
body:not(.tv-body) .health-ui-actions .btn,
body:not(.tv-body) .offline-ui-actions .btn {
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-radius: 11px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .screens-ui-metrics,
body:not(.tv-body) .health-ui-metrics,
body:not(.tv-body) .offline-ui-metrics {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .screens-ui-metric,
body:not(.tv-body) .offline-ui-metric,
body:not(.tv-body) .health-ui-metrics .metric-card,
body:not(.tv-body) .health-ui-metrics .metric {
  min-height: 78px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: #fff !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  box-shadow: 0 10px 25px rgba(15, 23, 42, .045) !important;
}
body:not(.tv-body) .screens-ui-metric > span,
body:not(.tv-body) .offline-ui-metric > span,
body:not(.tv-body) .health-ui-metrics .metric-card > span,
body:not(.tv-body) .health-ui-metrics .metric > span {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  color: #21485A !important;
  background: #E8F1F4 !important;
  flex-shrink: 0 !important;
}
body:not(.tv-body) .screens-ui-metric.online > span,
body:not(.tv-body) .offline-ui-metric.ready > span { background: #dcfce7 !important; color: #15803d !important; }
body:not(.tv-body) .screens-ui-metric.offline > span,
body:not(.tv-body) .offline-ui-metric.attention > span { background: #fee2e2 !important; color: #b91c1c !important; }
body:not(.tv-body) .screens-ui-metric.warning > span,
body:not(.tv-body) .offline-ui-metric.almost > span,
body:not(.tv-body) .offline-ui-metric.partial > span { background: #fef3c7 !important; color: #b45309 !important; }
body:not(.tv-body) .screens-ui-metric.android > span { background: #dbeafe !important; color: #1d4ed8 !important; }
body:not(.tv-body) .screens-ui-metric.disabled > span { background: #f1f5f9 !important; color: #64748b !important; }
body:not(.tv-body) .screens-ui-metric .icon,
body:not(.tv-body) .offline-ui-metric .icon { width: 18px !important; height: 18px !important; }
body:not(.tv-body) .screens-ui-metric b,
body:not(.tv-body) .offline-ui-metric b,
body:not(.tv-body) .health-ui-metrics b {
  display: block !important;
  color: #0f172a !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}
body:not(.tv-body) .screens-ui-metric small,
body:not(.tv-body) .offline-ui-metric small,
body:not(.tv-body) .health-ui-metrics small {
  display: block !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
}
body:not(.tv-body) .screens-ui-metric em,
body:not(.tv-body) .offline-ui-metric em,
body:not(.tv-body) .health-ui-metrics em {
  display: block !important;
  color: #94a3b8 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  margin-top: 2px !important;
}

/* TV Screens page controls/cards */
body:not(.tv-body) .screens-ui-toolbox.card,
body:not(.tv-body) .health-ui-diagnostics.card,
body:not(.tv-body) .health-ui-board.card,
body:not(.tv-body) .offline-ui-toolbar.card {
  padding: 14px !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 10px 25px rgba(15, 23, 42, .045) !important;
}
body:not(.tv-body) .screens-ui-toolbox-head,
body:not(.tv-body) .health-ui-board-head,
body:not(.tv-body) .offline-ui-toolbar-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}
body:not(.tv-body) .screens-ui-toolbox-head b,
body:not(.tv-body) .health-ui-board-head b,
body:not(.tv-body) .offline-ui-toolbar-head b,
body:not(.tv-body) .health-ui-diagnostics-main b {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #21485A !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .screens-ui-toolbox-head small,
body:not(.tv-body) .health-ui-board-head small,
body:not(.tv-body) .offline-ui-toolbar-head small,
body:not(.tv-body) .health-ui-diagnostics-main small {
  display: block !important;
  margin-top: 2px !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .screens-ui-filter-grid,
body:not(.tv-body) .offline-ui-filter-grid {
  display: grid !important;
  grid-template-columns: minmax(280px, 1fr) minmax(160px, .35fr) minmax(180px, .35fr) auto !important;
  gap: 8px !important;
  align-items: center !important;
}
body:not(.tv-body) .screens-ui-filter-grid .input,
body:not(.tv-body) .screens-ui-filter-grid .select,
body:not(.tv-body) .offline-ui-filter-grid .input,
body:not(.tv-body) .offline-ui-filter-grid .select,
body:not(.tv-body) .health-search-wrap .input {
  min-height: 36px !important;
  height: 36px !important;
  border-radius: 11px !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
}
body:not(.tv-body) .screens-ui-note,
body:not(.tv-body) .offline-ui-note {
  margin-top: 10px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .screens-ui-filter-summary {
  margin: -2px 0 0 !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .screens-ui-grid {
  margin-top: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)) !important;
  gap: 12px !important;
}
body:not(.tv-body) .screens-ui-grid.compact-view { grid-template-columns: 1fr !important; }
body:not(.tv-body) .screens-ui-card.screen-card {
  padding: 0 !important;
  border-radius: 18px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #fff !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .055) !important;
  overflow: visible !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}
body:not(.tv-body) .screens-ui-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(44, 92, 113, .28) !important;
  box-shadow: 0 18px 38px rgba(15, 23, 42, .085) !important;
}
body:not(.tv-body) .screens-ui-card-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 13px 14px !important;
  border-bottom: 1px solid rgba(44, 92, 113, .10) !important;
  background: linear-gradient(180deg, #fbfdfe, #f4f9fb) !important;
  border-radius: 18px 18px 0 0 !important;
}
body:not(.tv-body) .screens-ui-tv-title,
body:not(.tv-body) .offline-ui-tv-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body:not(.tv-body) .screens-ui-avatar,
body:not(.tv-body) .offline-ui-avatar {
  width: 36px !important;
  height: 36px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  background: #21485A !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  flex-shrink: 0 !important;
}
body:not(.tv-body) .screens-ui-tv-title b,
body:not(.tv-body) .offline-ui-tv-title h3 {
  margin: 0 !important;
  display: block !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .screens-ui-tv-title small,
body:not(.tv-body) .offline-ui-tv-title p {
  margin: 2px 0 0 !important;
  display: block !important;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .screens-ui-status,
body:not(.tv-body) .health-ui-state,
body:not(.tv-body) .offline-ui-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 9px !important;
  border-radius: 99px !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  border: 1px solid #e2e8f0 !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .screens-ui-status i,
body:not(.tv-body) .offline-ui-status i { width: 7px !important; height: 7px !important; border-radius: 999px !important; background: currentColor !important; }
body:not(.tv-body) .screens-ui-status.online,
body:not(.tv-body) .health-ui-state.online { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #15803d !important; }
body:not(.tv-body) .screens-ui-status.offline,
body:not(.tv-body) .health-ui-state.offline { background: #fff7ed !important; border-color: #fed7aa !important; color: #c2410c !important; }
body:not(.tv-body) .screens-ui-status.disabled,
body:not(.tv-body) .health-ui-state.disabled { background: #f8fafc !important; border-color: #e2e8f0 !important; color: #64748b !important; }
body:not(.tv-body) .screens-ui-url {
  margin: 12px 14px 0 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 10px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  background: #f8fafc !important;
}
body:not(.tv-body) .screens-ui-url > span { color: #21485A !important; }
body:not(.tv-body) .screens-ui-url code {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #334155 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: transparent !important;
  padding: 0 !important;
}
body:not(.tv-body) .screens-ui-facts {
  padding: 12px 14px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body:not(.tv-body) .screens-ui-facts > div,
body:not(.tv-body) .offline-ui-facts > span {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  padding: 9px !important;
  border-radius: 12px !important;
  background: #fbfdfe !important;
  border: 1px solid rgba(44, 92, 113, .10) !important;
  min-width: 0 !important;
}
body:not(.tv-body) .screens-ui-facts .icon,
body:not(.tv-body) .offline-ui-facts .icon { width: 14px !important; height: 14px !important; color: #3E7890 !important; flex-shrink: 0 !important; margin-top: 1px !important; }
body:not(.tv-body) .screens-ui-facts small,
body:not(.tv-body) .offline-ui-facts b {
  display: block !important;
  font-size: 9.6px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
}
body:not(.tv-body) .screens-ui-facts b,
body:not(.tv-body) .offline-ui-facts em {
  display: block !important;
  margin-top: 2px !important;
  color: #0f172a !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body:not(.tv-body) .screens-ui-alert,
body:not(.tv-body) .health-ui-error,
body:not(.tv-body) .offline-ui-warning {
  margin: 0 14px 12px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 7px !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
  color: #9a3412 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .screens-ui-actions {
  display: flex !important;
  gap: 7px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  padding: 12px 14px 14px !important;
  border-top: 1px solid rgba(44, 92, 113, .10) !important;
  background: #fbfdfe !important;
  border-radius: 0 0 18px 18px !important;
}
body:not(.tv-body) .screens-ui-actions .btn,
body:not(.tv-body) .health-ui-row-actions .btn { min-height: 30px !important; padding: 6px 10px !important; font-size: 11px !important; font-weight: 600 !important; border-radius: 9px !important; }
body:not(.tv-body) .screens-ui-more { margin-left: auto !important; position: relative !important; }
body:not(.tv-body) .screens-ui-more .screen-action-dropdown { right: 0 !important; z-index: 50 !important; }
body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-card { display: grid !important; grid-template-columns: 1.15fr 1fr auto !important; align-items: stretch !important; }
body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-card-head { border-radius: 18px 0 0 18px !important; border-bottom: none !important; border-right: 1px solid rgba(44,92,113,.10) !important; }
body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-url { display: none !important; }
body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-facts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; padding: 10px !important; }
body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-actions { border-top: none !important; border-left: 1px solid rgba(44,92,113,.10) !important; border-radius: 0 18px 18px 0 !important; align-content: center !important; min-width: 270px !important; }

/* Health Centre */
body:not(.tv-body) .health-ui-diagnostics {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
body:not(.tv-body) .health-ui-diagnostics-main { display: flex !important; align-items: center !important; gap: 10px !important; min-width: 0 !important; }
body:not(.tv-body) .health-ui-diagnostics-main > span {
  width: 38px !important; height: 38px !important; border-radius: 13px !important; display: grid !important; place-items: center !important; background: #E8F1F4 !important; color: #21485A !important; flex-shrink: 0 !important;
}
body:not(.tv-body) .health-ui-diagnostic-pills { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; justify-content: flex-end !important; }
body:not(.tv-body) .health-ui-diagnostic-pills span {
  display: inline-flex !important; align-items: center !important; gap: 5px !important; padding: 6px 9px !important; border: 1px solid rgba(44,92,113,.14) !important; border-radius: 99px !important; background: #f8fafc !important; color: #475569 !important; font-size: 10.5px !important; font-weight: 600 !important;
}
body:not(.tv-body) .health-ui-board-head { margin-bottom: 10px !important; }
body:not(.tv-body) .health-search-wrap { width: min(420px, 100%) !important; }
body:not(.tv-body) .health-ui-table { display: grid !important; gap: 10px !important; }
body:not(.tv-body) .health-ui-row.health-row {
  display: grid !important;
  grid-template-columns: minmax(220px, .9fr) minmax(0, 1.6fr) auto !important;
  gap: 10px !important;
  align-items: stretch !important;
  padding: 11px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.04) !important;
}
body:not(.tv-body) .health-ui-row-main { display: flex !important; align-items: center !important; gap: 10px !important; min-width: 0 !important; }
body:not(.tv-body) .health-ui-status-dot { width: 10px !important; height: 10px !important; border-radius: 999px !important; background: #f97316 !important; box-shadow: 0 0 0 4px rgba(249,115,22,.13) !important; flex-shrink: 0 !important; }
body:not(.tv-body) .health-ui-row.online .health-ui-status-dot { background: #22c55e !important; box-shadow: 0 0 0 4px rgba(34,197,94,.16) !important; }
body:not(.tv-body) .health-ui-row.disabled .health-ui-status-dot { background: #94a3b8 !important; box-shadow: 0 0 0 4px rgba(148,163,184,.16) !important; }
body:not(.tv-body) .health-ui-row-main b { display:block !important; color:#0f172a !important; font-size:12.5px !important; font-weight:600 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
body:not(.tv-body) .health-ui-row-main small { color:#64748b !important; font-size:10.8px !important; font-weight:700 !important; }
body:not(.tv-body) .health-ui-row-grid { display:grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap:7px !important; }
body:not(.tv-body) .health-ui-row-grid > div { padding:8px 9px !important; border-radius:12px !important; background:#f8fafc !important; border:1px solid rgba(44,92,113,.10) !important; min-width:0 !important; }
body:not(.tv-body) .health-ui-row-grid span { display:flex !important; align-items:center !important; gap:5px !important; color:#64748b !important; font-size:9.5px !important; font-weight:600 !important; text-transform:uppercase !important; letter-spacing:.05em !important; }
body:not(.tv-body) .health-ui-row-grid span .icon { width:12px !important; height:12px !important; color:#3E7890 !important; }
body:not(.tv-body) .health-ui-row-grid b { display:block !important; color:#0f172a !important; font-size:11px !important; font-weight:600 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; margin-top:3px !important; }
body:not(.tv-body) .health-ui-row-grid small { display:block !important; color:#94a3b8 !important; font-size:10px !important; font-weight:700 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; margin-top:1px !important; }
body:not(.tv-body) .health-ui-row-actions { display:flex !important; flex-wrap:wrap !important; align-items:center !important; justify-content:flex-end !important; gap:6px !important; min-width:230px !important; }
body:not(.tv-body) .health-ui-error { grid-column: 1 / -1 !important; margin: 0 !important; }

/* Offline Package */
body:not(.tv-body) .offline-ui-filter-grid { grid-template-columns: minmax(280px, 1fr) minmax(210px, .35fr) auto !important; }
body:not(.tv-body) .offline-ui-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)) !important; gap: 12px !important; }
body:not(.tv-body) .offline-ui-card.offline-cache-card {
  padding: 0 !important;
  border-radius: 18px !important;
  border: 1px solid rgba(44, 92, 113, .14) !important;
  background: #fff !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .055) !important;
  overflow: hidden !important;
}
body:not(.tv-body) .offline-ui-card.ready { border-color: rgba(22,163,74,.22) !important; }
body:not(.tv-body) .offline-ui-card.attention { border-color: rgba(185,28,28,.20) !important; }
body:not(.tv-body) .offline-ui-card-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 13px 14px !important;
  background: linear-gradient(180deg, #fbfdfe, #f4f9fb) !important;
  border-bottom: 1px solid rgba(44,92,113,.10) !important;
}
body:not(.tv-body) .offline-ui-status.ready { background:#f0fdf4 !important; color:#15803d !important; border-color:#bbf7d0 !important; }
body:not(.tv-body) .offline-ui-status.almost,
body:not(.tv-body) .offline-ui-status.partial { background:#fffbeb !important; color:#b45309 !important; border-color:#fde68a !important; }
body:not(.tv-body) .offline-ui-status.attention { background:#fef2f2 !important; color:#b91c1c !important; border-color:#fecaca !important; }
body:not(.tv-body) .offline-ui-status.unknown,
body:not(.tv-body) .offline-ui-status.disabled { background:#f8fafc !important; color:#64748b !important; border-color:#e2e8f0 !important; }
body:not(.tv-body) .offline-ui-body { display:grid !important; grid-template-columns:auto minmax(0,1fr) !important; align-items:center !important; gap:12px !important; padding:14px !important; }
body:not(.tv-body) .offline-ui-ring.offline-cache-ring { width:78px !important; height:78px !important; flex-shrink:0 !important; }
body:not(.tv-body) .offline-ui-progress-copy { display:grid !important; gap:5px !important; min-width:0 !important; }
body:not(.tv-body) .offline-ui-progress-copy b { color:#0f172a !important; font-size:13px !important; font-weight:600 !important; }
body:not(.tv-body) .offline-ui-progress-copy small { color:#64748b !important; font-size:11px !important; font-weight:700 !important; line-height:1.35 !important; }
body:not(.tv-body) .offline-ui-bar.offline-cache-bar { height:8px !important; border-radius:999px !important; background:#e2e8f0 !important; overflow:hidden !important; }
body:not(.tv-body) .offline-ui-bar.offline-cache-bar i { display:block !important; height:100% !important; border-radius:inherit !important; background:linear-gradient(90deg, #16a34a, #2C5C71) !important; }
body:not(.tv-body) .offline-ui-facts { display:grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap:8px !important; padding:0 14px 14px !important; }
body:not(.tv-body) .offline-ui-missing { margin: 0 14px 14px !important; padding: 11px !important; border-radius: 14px !important; border: 1px solid rgba(44,92,113,.12) !important; background: #fbfdfe !important; }
body:not(.tv-body) .offline-ui-missing .offline-cache-subhead { margin-bottom: 8px !important; }
body:not(.tv-body) .offline-ui-missing ul { margin: 0 !important; padding: 0 !important; display: grid !important; gap: 6px !important; list-style: none !important; }
body:not(.tv-body) .offline-ui-missing li { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:8px !important; padding:6px 8px !important; border-radius:10px !important; background:#fff !important; border:1px solid rgba(44,92,113,.08) !important; }
body:not(.tv-body) .offline-ui-missing li span { display:flex !important; align-items:center !important; gap:6px !important; min-width:0 !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; color:#334155 !important; font-size:11px !important; font-weight:600 !important; }
body:not(.tv-body) .offline-ui-missing li em { color:#94a3b8 !important; font-size:10px !important; font-weight:600 !important; font-style:normal !important; }
body:not(.tv-body) .offline-ui-external { margin: 0 14px 14px !important; padding: 10px !important; border-radius: 13px !important; background: #f8fafc !important; border: 1px dashed rgba(44,92,113,.22) !important; }
body:not(.tv-body) .offline-ui-external b { display:flex !important; align-items:center !important; gap:6px !important; color:#21485A !important; font-size:11.5px !important; font-weight:600 !important; }
body:not(.tv-body) .offline-ui-external p { margin:4px 0 0 !important; color:#64748b !important; font-size:11px !important; font-weight:700 !important; line-height:1.35 !important; }

@media (max-width: 1180px) {
  body:not(.tv-body) .screens-ui-hero.card,
  body:not(.tv-body) .health-ui-hero.card,
  body:not(.tv-body) .offline-ui-hero.card { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .screens-ui-hero-actions,
  body:not(.tv-body) .health-ui-actions,
  body:not(.tv-body) .offline-ui-actions { justify-content:flex-start !important; max-width:none !important; }
  body:not(.tv-body) .health-ui-row.health-row { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .health-ui-row-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body:not(.tv-body) .health-ui-row-actions { justify-content:flex-start !important; min-width:0 !important; }
  body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-card { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-card-head { border-radius:18px 18px 0 0 !important; border-right:none !important; border-bottom:1px solid rgba(44,92,113,.10) !important; }
  body:not(.tv-body) .screens-ui-grid.compact-view .screens-ui-actions { border-left:none !important; border-top:1px solid rgba(44,92,113,.10) !important; border-radius:0 0 18px 18px !important; }
}
@media (max-width: 760px) {
  body:not(.tv-body) .screens-ui-filter-grid,
  body:not(.tv-body) .offline-ui-filter-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .screens-ui-toolbox-head,
  body:not(.tv-body) .health-ui-board-head,
  body:not(.tv-body) .offline-ui-toolbar-head,
  body:not(.tv-body) .health-ui-diagnostics { flex-direction: column !important; align-items: stretch !important; }
  body:not(.tv-body) .screens-ui-grid,
  body:not(.tv-body) .offline-ui-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .screens-ui-facts,
  body:not(.tv-body) .offline-ui-facts,
  body:not(.tv-body) .health-ui-row-grid { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .screens-ui-hero-main,
  body:not(.tv-body) .health-ui-hero-main,
  body:not(.tv-body) .offline-ui-hero-main { align-items:flex-start !important; }
}
body:not(.tv-body) .health-ui-metrics .dash-ui-metric-card {
  min-height: 78px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: #fff !important;
  border: 1px solid rgba(44, 92, 113, .12) !important;
  box-shadow: 0 10px 25px rgba(15, 23, 42, .045) !important;
}
body:not(.tv-body) .health-ui-metrics .dash-ui-metric-card .dash-ui-metric-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  color: #21485A !important;
  background: #E8F1F4 !important;
}
body:not(.tv-body) .health-ui-metrics .dash-ui-metric-card .dash-ui-metric-copy span {
  display: block !important;
  color: #21485A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
body:not(.tv-body) .health-ui-metrics .dash-ui-metric-card .dash-ui-metric-copy b {
  display: block !important;
  color: #0f172a !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  margin: 2px 0 !important;
}
body:not(.tv-body) .health-ui-metrics .dash-ui-metric-card .dash-ui-metric-copy small {
  display: block !important;
  color: #94a3b8 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}


body:not(.tv-body) .screens-ui-card,
body:not(.tv-body) .screens-ui-actions,
body:not(.tv-body) .screens-ui-more {
  overflow: visible !important;
}
body:not(.tv-body) .screens-ui-card:has(.screens-ui-more.open) {
  z-index: 220 !important;
}
body:not(.tv-body) .screens-ui-more {
  position: relative !important;
  z-index: 230 !important;
  isolation: isolate !important;
}
body:not(.tv-body) .screens-ui-more .screen-action-dropdown {
  position: absolute !important;
  left: auto !important;
  right: 0 !important;
  top: calc(100% + 8px) !important;
  bottom: auto !important;
  transform: none !important;
  width: 264px !important;
  min-width: 264px !important;
  max-width: min(264px, calc(100vw - 28px)) !important;
  box-sizing: border-box !important;
  z-index: 99999 !important;
  padding: 7px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(44, 92, 113, .20) !important;
  background: #ffffff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .24), 0 0 0 1px rgba(255, 255, 255, .8) inset !important;
  overflow: visible !important;
}
body:not(.tv-body) .screens-ui-more .screen-action-dropdown::before {
  content: none !important;
}
body:not(.tv-body) .screens-ui-more.open .screen-action-dropdown {
  display: grid !important;
  gap: 4px !important;
}
body:not(.tv-body) .screens-ui-more .screen-action-dropdown button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  justify-content: flex-start !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}
body:not(.tv-body) .screens-ui-more .screen-action-dropdown button .icon,
body:not(.tv-body) .screens-ui-more .screen-action-dropdown button svg {
  flex: 0 0 auto !important;
}
@media (max-width: 720px) {
  body:not(.tv-body) .screens-ui-more .screen-action-dropdown {
    right: auto !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: min(264px, calc(100vw - 32px)) !important;
    min-width: min(264px, calc(100vw - 32px)) !important;
  }
}


body:not(.tv-body) .settings-ui-page {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 auto;
}
body:not(.tv-body) .settings-ui-hero {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 470px);
  gap: 14px !important;
  padding: 16px !important;
  overflow: hidden;
  border: 1px solid rgba(44,92,113,.16) !important;
  background:
    radial-gradient(circle at 12% 16%, rgba(44,92,113,.16), transparent 31%),
    radial-gradient(circle at 82% 8%, rgba(169,199,210,.28), transparent 30%),
    linear-gradient(135deg, #ffffff 0%, #f4f9fb 100%) !important;
  box-shadow: 0 18px 46px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .settings-ui-hero::after {
  content: '';
  position: absolute;
  inset: auto 18px -30px auto;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: rgba(44,92,113,.08);
  pointer-events: none;
}
body:not(.tv-body) .settings-ui-hero-main,
body:not(.tv-body) .settings-ui-action-panel {
  position: relative;
  z-index: 1;
}
body:not(.tv-body) .settings-ui-hero-main {
  display: grid;
  align-content: center;
  gap: 12px;
  min-width: 0;
}
body:not(.tv-body) .settings-ui-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  border: 1px solid rgba(44,92,113,.18);
  background: rgba(255,255,255,.78);
  color: #21485A;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
body:not(.tv-body) .settings-ui-kicker .icon { width: 13px; height: 13px; }
body:not(.tv-body) .settings-ui-title-row {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 13px;
  align-items: center;
}
body:not(.tv-body) .settings-ui-hero-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #21485A, #3E7890);
  box-shadow: 0 10px 24px rgba(44,92,113,.26);
}
body:not(.tv-body) .settings-ui-hero-icon .icon { width: 23px; height: 23px; stroke-width: 2.1; }
body:not(.tv-body) .settings-ui-hero h2 {
  margin: 0 !important;
  color: #102435 !important;
  font-size: clamp(23px, 2.2vw, 32px) !important;
  line-height: 1.05 !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-hero p {
  margin: 4px 0 0 !important;
  max-width: 780px;
  color: #536878 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
}
body:not(.tv-body) .settings-ui-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
body:not(.tv-body) .settings-ui-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid #dbe6ec;
  background: rgba(255,255,255,.78);
  color: #334155;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}
body:not(.tv-body) .settings-ui-status-pill .icon { width: 13px; height: 13px; }
body:not(.tv-body) .settings-ui-status-pill.ok { background: #f0fdf4; color: #166534; border-color: #bbf7d0; }
body:not(.tv-body) .settings-ui-status-pill.warning { background: #fffbeb; color: #92400e; border-color: #fde68a; }
body:not(.tv-body) .settings-ui-status-pill.muted { background: #f8fafc; color: #64748b; }
body:not(.tv-body) .settings-ui-action-panel {
  display: grid;
  gap: 9px;
  align-content: center;
  align-self: stretch;
  padding: 12px;
  border: 1px solid rgba(44,92,113,.13);
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.74), 0 14px 34px rgba(15,23,42,.06);
  backdrop-filter: blur(10px);
}
body:not(.tv-body) .settings-ui-primary-actions,
body:not(.tv-body) .settings-ui-backup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}
body:not(.tv-body) .settings-ui-primary-actions .btn {
  flex: 1 1 145px;
  justify-content: center;
}
body:not(.tv-body) .settings-ui-backup-actions .btn {
  min-height: 32px !important;
  height: 32px !important;
  padding: 6px 10px !important;
  font-size: 11.5px !important;
  border-radius: 10px !important;
  justify-content: center;
}
body:not(.tv-body) .settings-ui-action-panel .settings-dirty-flag {
  justify-content: center;
  min-height: 30px;
  border-radius: 999px;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
body:not(.tv-body) .settings-ui-metric-card {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid rgba(44,92,113,.12);
  border-radius: 17px;
  background: linear-gradient(180deg, #fff, #f8fbfc);
  box-shadow: 0 8px 24px rgba(15,23,42,.045);
}
body:not(.tv-body) .settings-ui-metric-card > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  background: #E8F1F4;
  color: #21485A;
}
body:not(.tv-body) .settings-ui-metric-card .icon { width: 17px; height: 17px; }
body:not(.tv-body) .settings-ui-metric-card div { min-width: 0; display: grid; gap: 1px; }
body:not(.tv-body) .settings-ui-metric-card b {
  color: #0f172a;
  font-size: 17px;
  line-height: 1;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-metric-card small {
  color: #334155;
  font-size: 11.5px;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-metric-card em {
  color: #64748b;
  font-size: 10.5px;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.tv-body) .settings-ui-layout {
  display: grid !important;
  grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
}
body:not(.tv-body) .settings-ui-layout .settings-category-grid {
  position: sticky;
  top: 82px;
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid rgba(44,92,113,.12);
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff, #f8fbfc);
  box-shadow: 0 12px 30px rgba(15,23,42,.05);
  max-height: calc(100vh - 105px);
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #A9C7D2 transparent;
}
body:not(.tv-body) .settings-ui-layout .settings-category-card {
  position: relative;
  display: grid !important;
  grid-template-columns: 38px minmax(0,1fr) 18px !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100%;
  min-height: 62px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(44,92,113,.10) !important;
  background: #fff !important;
  color: #0f172a !important;
  text-align: left !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}
body:not(.tv-body) .settings-ui-layout .settings-category-card:hover {
  transform: translateY(-1px);
  border-color: rgba(44,92,113,.24) !important;
  background: #f8fbfc !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .settings-ui-layout .settings-category-card.active {
  border-color: rgba(44,92,113,.38) !important;
  background: linear-gradient(135deg, #E8F1F4, #ffffff) !important;
  box-shadow: inset 4px 0 0 #2C5C71, 0 12px 24px rgba(44,92,113,.10) !important;
}
body:not(.tv-body) .settings-ui-layout .settings-category-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  display: grid;
  place-items: center;
  color: #21485A;
  background: #E8F1F4;
  flex: 0 0 auto;
}
body:not(.tv-body) .settings-ui-layout .settings-category-card.active .settings-category-icon {
  color: #fff;
  background: linear-gradient(135deg, #21485A, #3E7890);
}
body:not(.tv-body) .settings-ui-layout .settings-category-icon .icon { width: 18px; height: 18px; }
body:not(.tv-body) .settings-ui-layout .settings-category-copy { min-width: 0; }
body:not(.tv-body) .settings-ui-layout .settings-category-copy b {
  display: block;
  color: #0f172a;
  font-size: 12.5px;
  line-height: 1.2;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-category-copy small {
  display: block;
  color: #64748b;
  font-size: 10.5px;
  line-height: 1.25;
  margin-top: 2px;
  font-weight: 500 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-category-arrow {
  color: #94a3b8;
  display: grid;
  place-items: center;
}
body:not(.tv-body) .settings-ui-layout .settings-category-card.active .settings-category-arrow { color: #2C5C71; }
body:not(.tv-body) .settings-ui-layout .settings-category-arrow .icon { width: 15px; height: 15px; }
body:not(.tv-body) .settings-ui-layout .settings-panel-stack {
  min-width: 0;
  display: grid !important;
  gap: 10px !important;
}
body:not(.tv-body) .settings-ui-layout .settings-panel {
  display: none !important;
  overflow: hidden;
  border: 1px solid rgba(44,92,113,.12);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(15,23,42,.06);
}
body:not(.tv-body) .settings-ui-layout .settings-panel.active { display: grid !important; }
body:not(.tv-body) .settings-ui-layout .settings-panel-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px !important;
  border-radius: 22px 22px 0 0 !important;
  border-bottom: 1px solid rgba(44,92,113,.12);
  background: linear-gradient(135deg, #f8fbfc, #eef6f8) !important;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-head > div:first-child {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 11px !important;
  align-items: center;
  min-width: 0;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-head > div:first-child > span {
  width: 42px !important;
  height: 42px !important;
  border-radius: 15px !important;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #21485A, #3E7890) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(44,92,113,.22);
}
body:not(.tv-body) .settings-ui-layout .settings-panel-head > div:first-child > span .icon {
  width: 20px;
  height: 20px;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-head h3 {
  margin: 0 !important;
  color: #102435 !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-head p {
  color: #536878 !important;
  margin: 3px 0 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-badge {
  flex: 0 0 auto;
  border: 1px solid rgba(44,92,113,.16);
  background: #fff;
  color: #21485A;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
body:not(.tv-body) .settings-ui-layout .settings-form-card,
body:not(.tv-body) .settings-ui-layout .settings-panel > .settings-option-grid {
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 0 !important;
  border-width: 0 0 1px 0 !important;
  border-color: rgba(44,92,113,.10) !important;
  box-shadow: none !important;
  background: #fff !important;
}
body:not(.tv-body) .settings-ui-layout .settings-form-card:last-child,
body:not(.tv-body) .settings-ui-layout .settings-panel > .settings-option-grid:last-child {
  border-bottom: 0 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-option-grid.advanced-setting-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 9px !important;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle {
  min-height: 66px !important;
  align-items: center;
  padding: 10px 11px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(44,92,113,.13) !important;
  background: linear-gradient(180deg, #fff, #f8fbfc) !important;
  box-shadow: none !important;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(44,92,113,.25) !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.055) !important;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle input[type="checkbox"] {
  width: 36px;
  height: 21px;
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex: 0 0 auto;
  border: 0 !important;
  border-radius: 999px;
  background: #cbd5e1;
  box-shadow: inset 0 1px 3px rgba(15,23,42,.20);
  cursor: pointer;
  transition: background .18s ease;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle input[type="checkbox"]::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 3px;
  width: 15px;
  height: 15px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(15,23,42,.22);
  transition: transform .18s ease;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle input[type="checkbox"]:checked { background: #2C5C71; }
body:not(.tv-body) .settings-ui-layout .setting-toggle input[type="checkbox"]:checked::after { transform: translateX(15px); }
body:not(.tv-body) .settings-ui-layout .setting-toggle span:not(.icon) { min-width: 0; }
body:not(.tv-body) .settings-ui-layout .setting-toggle b {
  display: block;
  color: #0f172a;
  font-size: 12.5px;
  line-height: 1.2;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle small {
  display: block;
  color: #64748b;
  font-size: 10.8px;
  line-height: 1.28;
  margin-top: 2px;
}
body:not(.tv-body) .settings-ui-layout .setting-toggle .icon,
body:not(.tv-body) .settings-ui-layout .settings-panel-mini-title > span .icon,
body:not(.tv-body) .settings-ui-layout .section-title span .icon {
  width: 16px;
  height: 16px;
  color: #2C5C71;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-mini-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-mini-title > span {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #21485A;
  background: #E8F1F4;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-mini-title b {
  color: #0f172a;
  font-size: 13px;
  font-weight: 700 !important;
}
body:not(.tv-body) .settings-ui-layout .settings-panel-mini-title small { color: #64748b; font-size: 11px; }
body:not(.tv-body) .settings-ui-layout .logo-upload-zone {
  display: grid;
  place-items: center;
  gap: 6px;
  min-height: 118px;
  border: 1.5px dashed #A9C7D2 !important;
  border-radius: 18px;
  background: linear-gradient(135deg, #f8fbfc, #eef6f8) !important;
  color: #21485A;
  text-align: center;
  cursor: pointer;
}
body:not(.tv-body) .settings-ui-layout .logo-upload-zone:hover {
  border-color: #2C5C71 !important;
  background: #E8F1F4 !important;
}
body:not(.tv-body) .settings-ui-layout .logo-upload-zone .icon { width: 24px; height: 24px; }
body:not(.tv-body) .settings-ui-layout .logo-upload-zone b { font-size: 13px; font-weight: 700 !important; }
body:not(.tv-body) .settings-ui-layout .logo-upload-zone span { max-width: 460px; color: #64748b; font-size: 11.5px; line-height: 1.4; }
body:not(.tv-body) .settings-ui-layout .logo-upload-actions,
body:not(.tv-body) .settings-ui-layout .smtp-test-row,
body:not(.tv-body) .settings-ui-layout .backup-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}
body:not(.tv-body) .settings-ui-layout .inline-tip,
body:not(.tv-body) .settings-ui-layout .smtp-relay-note,
body:not(.tv-body) .settings-ui-layout .webhook-settings-block,
body:not(.tv-body) .settings-ui-layout .factory-alert-api-box,
body:not(.tv-body) .settings-ui-layout .copy-secret-box {
  border: 1px solid rgba(44,92,113,.13) !important;
  border-radius: 16px !important;
  background: #f8fbfc !important;
}
body:not(.tv-body) .settings-ui-layout .smtp-relay-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 12px;
  margin: 10px 0;
}
body:not(.tv-body) .settings-ui-layout .smtp-relay-note > span {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #E8F1F4;
  color: #21485A;
  flex: 0 0 auto;
}
body:not(.tv-body) .settings-ui-layout .smtp-relay-note b { color: #102435; font-weight: 700 !important; }
body:not(.tv-body) .settings-ui-layout .smtp-relay-note p { margin: 2px 0 0; color: #64748b; font-size: 12px; line-height: 1.4; }
body:not(.tv-body) .settings-ui-layout .webhook-settings-block {
  display: grid;
  gap: 10px;
  padding: 12px;
  margin-top: 12px;
}
body:not(.tv-body) .settings-ui-layout .input-with-suffix {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border: 1.5px solid #cbd5e1;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
body:not(.tv-body) .settings-ui-layout .input-with-suffix .input {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body:not(.tv-body) .settings-ui-layout .input-with-suffix span {
  padding: 0 10px;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
body:not(.tv-body) .settings-ui-layout .config-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
}
body:not(.tv-body) .settings-ui-layout .config-row {
  min-width: 0;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(44,92,113,.11);
  background: #f8fbfc;
}
body:not(.tv-body) .settings-ui-layout .config-row span {
  display: block;
  color: #64748b;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}
body:not(.tv-body) .settings-ui-layout .config-row b {
  display: block;
  color: #0f172a;
  font-size: 12.5px;
  margin-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.tv-body) .settings-ui-layout .config-row small { display: block; margin-top: 3px; color: #64748b; line-height: 1.3; }
body:not(.tv-body) .settings-ui-layout .default-designer-card { background: #fff !important; }
body:not(.tv-body) .settings-ui-layout .default-designer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .86fr);
  gap: 12px;
}
body:not(.tv-body) .settings-ui-layout .default-designer-controls,
body:not(.tv-body) .settings-ui-layout .default-preview-panel {
  border: 1px solid rgba(44,92,113,.12);
  border-radius: 18px;
  background: #f8fbfc;
  padding: 12px;
  min-width: 0;
}
body:not(.tv-body) .settings-ui-layout .preview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
body:not(.tv-body) .settings-ui-layout .default-broadcast-preview {
  border-radius: 16px !important;
  border: 8px solid #111827 !important;
  box-shadow: 0 16px 34px rgba(15,23,42,.16) !important;
  overflow: hidden !important;
}
body:not(.tv-body) .settings-ui-layout input[type="color"] {
  width: 40px !important;
  min-width: 40px !important;
  height: 36px !important;
  padding: 3px !important;
  border-radius: 12px !important;
  border: 1.5px solid #cbd5e1 !important;
  background: #fff !important;
  cursor: pointer;
}
body:not(.tv-body) .settings-ui-layout .btn.primary .icon,
body:not(.tv-body) .settings-ui-action-panel .btn.primary .icon {
  color: #fff !important;
  stroke: #fff !important;
}
@media (max-width: 1180px) {
  body:not(.tv-body) .settings-ui-hero { grid-template-columns: 1fr; }
  body:not(.tv-body) .settings-ui-primary-actions,
  body:not(.tv-body) .settings-ui-backup-actions { justify-content: flex-start; }
  body:not(.tv-body) .settings-ui-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  body:not(.tv-body) .settings-ui-layout { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .settings-ui-layout .settings-category-grid {
    position: static;
    grid-template-columns: repeat(2, minmax(0,1fr));
    max-height: none;
  }
  body:not(.tv-body) .settings-ui-layout .default-designer-layout { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  body:not(.tv-body) .settings-ui-hero { padding: 12px !important; }
  body:not(.tv-body) .settings-ui-title-row { grid-template-columns: 1fr; }
  body:not(.tv-body) .settings-ui-metrics { grid-template-columns: 1fr; }
  body:not(.tv-body) .settings-ui-layout .settings-category-grid { grid-template-columns: 1fr; }
  body:not(.tv-body) .settings-ui-primary-actions .btn,
  body:not(.tv-body) .settings-ui-backup-actions .btn { flex: 1 1 100%; }
  body:not(.tv-body) .settings-ui-layout .settings-panel-head { align-items: flex-start; flex-direction: column; }
}


body:not(.tv-body) .help-ui-page {
  display: grid;
  gap: 14px;
  width: 100%;
  --help-primary: #2C5C71;
  --help-primary-dark: #21485A;
  --help-primary-light: #3E7890;
  --help-soft: #E8F1F4;
  --help-soft-2: #D6E5EA;
  --help-border: rgba(44,92,113,.14);
  --help-border-strong: rgba(44,92,113,.24);
  --help-text: #0f172a;
  --help-muted: #475569;
  --help-faint: #94a3b8;
}
body:not(.tv-body) .help-ui-hero.card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
  gap: 18px;
  align-items: stretch;
  padding: clamp(18px, 2.5vw, 26px) !important;
  border: 1px solid rgba(44,92,113,.20) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(62,120,144,.38), transparent 32%),
    radial-gradient(circle at 85% 15%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(135deg, #102331 0%, #21485A 44%, #2C5C71 100%) !important;
  color: #fff !important;
  box-shadow: 0 24px 55px rgba(15,23,42,.16) !important;
}
body:not(.tv-body) .help-ui-hero::after {
  content: '';
  position: absolute;
  inset: auto -70px -95px auto;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  pointer-events: none;
}
body:not(.tv-body) .help-ui-hero-copy { position: relative; z-index: 1; display: grid; align-content: center; gap: 10px; }
body:not(.tv-body) .help-ui-hero .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #d8f5fb !important;
  border: 1px solid rgba(255,255,255,.16);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body:not(.tv-body) .help-ui-hero .eyebrow .icon { width: 15px; height: 15px; }
body:not(.tv-body) .help-ui-hero h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(24px, 3.1vw, 38px) !important;
  font-weight: 600 !important;
  letter-spacing: -.02em;
  line-height: 1.04;
}
body:not(.tv-body) .help-ui-hero p {
  margin: 0 !important;
  max-width: 850px;
  color: rgba(232,241,244,.90) !important;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 500;
}
body:not(.tv-body) .help-ui-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
body:not(.tv-body) .help-ui-action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 12px;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background .16s ease, transform .16s ease, border-color .16s ease;
}
body:not(.tv-body) .help-ui-action:hover { background: rgba(255,255,255,.20); border-color: rgba(255,255,255,.32); transform: translateY(-1px); }
body:not(.tv-body) .help-ui-action .icon { width: 15px; height: 15px; }
body:not(.tv-body) .help-ui-live-panel {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.17);
  backdrop-filter: blur(8px);
}
body:not(.tv-body) .help-ui-live-head {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #fff;
  font-size: 13px;
}
body:not(.tv-body) .help-ui-live-head span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(255,255,255,.14);
}
body:not(.tv-body) .help-ui-live-head .icon { width: 16px; height: 16px; }
body:not(.tv-body) .help-ui-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
body:not(.tv-body) .help-ui-metric {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.14);
  min-width: 0;
}
body:not(.tv-body) .help-ui-metric .icon { width: 18px; height: 18px; color: #ccecf4; flex: 0 0 auto; }
body:not(.tv-body) .help-ui-metric span { display: grid; min-width: 0; }
body:not(.tv-body) .help-ui-metric b { color: #fff; font-size: 18px; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body:not(.tv-body) .help-ui-metric small { color: rgba(232,241,244,.78); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-top: 3px; }
body:not(.tv-body) .help-ui-role {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px;
  border-radius: 16px;
  background: rgba(255,255,255,.90);
  color: #123143;
  border: 1px solid rgba(255,255,255,.5);
}
body:not(.tv-body) .help-ui-role .icon { width: 18px; height: 18px; color: var(--help-primary-dark); flex: 0 0 auto; margin-top: 1px; }
body:not(.tv-body) .help-ui-role.admin .icon { color: #c2410c; }
body:not(.tv-body) .help-ui-role b { display: block; font-size: 12px; }
body:not(.tv-body) .help-ui-role small { display: block; color: #536878; font-size: 11px; line-height: 1.35; margin-top: 2px; }
body:not(.tv-body) .help-ui-toolbar.card {
  position: sticky;
  top: 72px;
  z-index: 18;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px !important;
  border-radius: 18px !important;
  border: 1px solid var(--help-border) !important;
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 30px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .help-ui-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(44,92,113,.18);
  border-radius: 13px;
  background: #f8fbfc;
}
body:not(.tv-body) .help-ui-search .icon { width: 16px; height: 16px; color: var(--help-primary); flex: 0 0 auto; }
body:not(.tv-body) .help-ui-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--help-text);
  font-size: 13px;
  font-weight: 600;
}
body:not(.tv-body) .help-ui-search input::placeholder { color: #78909c; font-weight: 600; }
body:not(.tv-body) .help-ui-chip-row { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
body:not(.tv-body) .help-ui-chip-row button {
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(44,92,113,.16);
  background: var(--help-soft);
  color: var(--help-primary-dark);
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
}
body:not(.tv-body) .help-ui-chip-row button:hover { background: var(--help-soft-2); border-color: var(--help-primary-border, #A9C7D2); }
body:not(.tv-body) .help-ui-layout { grid-template-columns: 292px minmax(0, 1fr) !important; gap: 14px !important; align-items: start; margin-top: 0 !important; }
body:not(.tv-body) .help-ui-nav.card {
  position: sticky;
  top: 138px;
  max-height: calc(100dvh - 158px);
  overflow-y: auto;
  display: grid;
  gap: 4px;
  padding: 12px !important;
  border-radius: 20px !important;
  border: 1px solid var(--help-border) !important;
  background: #fff !important;
  scrollbar-width: thin;
  scrollbar-color: #A9C7D2 transparent;
}
body:not(.tv-body) .help-ui-nav::-webkit-scrollbar { width: 5px; }
body:not(.tv-body) .help-ui-nav::-webkit-scrollbar-thumb { background: #A9C7D2; border-radius: 99px; }
body:not(.tv-body) .help-ui-nav > b {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 8px !important;
  padding: 0 4px 8px;
  border-bottom: 1px solid var(--help-border);
  color: var(--help-text) !important;
  font-size: 13px;
}
body:not(.tv-body) .help-ui-nav > b .icon { width: 17px !important; height: 17px !important; color: var(--help-primary-dark) !important; }
body:not(.tv-body) .help-ui-nav .help-nav-link {
  position: relative;
  display: flex !important;
  width: 100% !important;
  align-items: center;
  min-height: 34px;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  padding: 8px 10px 8px 12px !important;
  background: transparent !important;
  color: var(--help-muted) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  text-align: left;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
body:not(.tv-body) .help-ui-nav .help-nav-link::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #cbd5e1;
  margin-right: 9px;
  flex: 0 0 auto;
}
body:not(.tv-body) .help-ui-nav .help-nav-link:hover,
body:not(.tv-body) .help-ui-nav .help-nav-link:focus-visible,
body:not(.tv-body) .help-ui-nav .help-nav-link.active {
  background: var(--help-soft) !important;
  border-color: rgba(44,92,113,.16) !important;
  color: var(--help-primary-dark) !important;
  outline: none;
  transform: translateX(1px);
}
body:not(.tv-body) .help-ui-nav .help-nav-link:hover::before,
body:not(.tv-body) .help-ui-nav .help-nav-link.active::before { background: var(--help-primary); }
body:not(.tv-body) .help-ui-nav .help-nav-link.muted-by-search { opacity: .34; }
body:not(.tv-body) .help-ui-main { display: grid; gap: 14px; min-width: 0; }
body:not(.tv-body) .help-ui-section.card {
  padding: 15px !important;
  border-radius: 22px !important;
  border: 1px solid var(--help-border) !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdfe 100%) !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.05) !important;
  scroll-margin-top: 150px !important;
}
body:not(.tv-body) .help-ui-section.help-hidden-by-search {
  display: none !important;
}
body:not(.tv-body) .help-nav-link.muted-by-search {
  opacity: 0.35 !important;
  transition: opacity 0.18s ease !important;
}
body:not(.tv-body) .help-ui-section-title {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 0 0 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(44,92,113,.11);
}
body:not(.tv-body) .help-ui-section-title > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--help-primary-dark), var(--help-primary-light));
  color: #fff;
  flex: 0 0 auto;
  box-shadow: 0 8px 18px rgba(44,92,113,.18);
}
body:not(.tv-body) .help-ui-section-title .icon { width: 18px; height: 18px; }
body:not(.tv-body) .help-ui-section-title h2 {
  margin: 0 !important;
  color: var(--help-primary-dark) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em;
}
body:not(.tv-body) .help-ui-section-title p {
  margin: 3px 0 0 !important;
  color: var(--help-muted) !important;
  font-size: 12.5px;
  line-height: 1.45;
  font-weight: 500;
}
body:not(.tv-body) .help-ui-card-grid,
body:not(.tv-body) .help-card-grid.help-ui-card-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .help-ui-card-grid .help-card,
body:not(.tv-body) .help-card-grid.help-ui-card-grid .help-card {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-areas: "icon title" "icon text";
  gap: 3px 10px !important;
  min-height: 118px;
  padding: 12px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44,92,113,.12) !important;
  background: #fff !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.04) !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
body:not(.tv-body) .help-ui-card-grid .help-card:hover {
  transform: translateY(-2px);
  border-color: rgba(44,92,113,.24) !important;
  background: #fbfdfe !important;
  box-shadow: 0 12px 24px rgba(15,23,42,.08) !important;
}
body:not(.tv-body) .help-ui-card-grid .help-card > .icon {
  grid-area: icon;
  width: 18px !important;
  height: 18px !important;
  padding: 8px !important;
  box-sizing: content-box !important;
  border-radius: 13px !important;
  color: var(--help-primary-dark) !important;
  background: var(--help-soft) !important;
}
body:not(.tv-body) .help-ui-card-grid .help-card h3 {
  grid-area: title;
  margin: 1px 0 0 !important;
  color: var(--help-text) !important;
  font-size: 12.5px !important;
  line-height: 1.25;
  font-weight: 600 !important;
  letter-spacing: -.015em;
}
body:not(.tv-body) .help-ui-card-grid .help-card p {
  grid-area: text;
  margin: 0 !important;
  color: var(--help-muted) !important;
  font-size: 11.5px !important;
  line-height: 1.47 !important;
  font-weight: 500;
}
body:not(.tv-body) .help-ui-flow.help-flow-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px !important;
  margin: 0 !important;
}
body:not(.tv-body) .help-ui-flow .help-step {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 12px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  background: #fff !important;
}
body:not(.tv-body) .help-ui-flow .help-step > b {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 12px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, var(--help-primary-dark), var(--help-primary-light)) !important;
  color: #fff !important;
  font-size: 12px !important;
  box-shadow: none !important;
}
body:not(.tv-body) .help-ui-flow .help-step strong { color: var(--help-text); font-size: 12.5px; }
body:not(.tv-body) .help-ui-flow .help-step small { color: var(--help-muted); font-size: 11.5px; line-height: 1.48; }
body:not(.tv-body) .help-ui-do-dont {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
body:not(.tv-body) .help-ui-do-dont > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 4px 9px;
  align-items: start;
  padding: 12px;
  border-radius: 17px;
  background: var(--help-soft);
  border: 1px solid rgba(44,92,113,.16);
}
body:not(.tv-body) .help-ui-do-dont .icon { grid-row: span 2; width: 18px; height: 18px; color: var(--help-primary-dark); margin-top: 1px; }
body:not(.tv-body) .help-ui-do-dont b { color: var(--help-primary-dark); font-size: 12.5px; }
body:not(.tv-body) .help-ui-do-dont p { margin: 0; color: var(--help-muted); font-size: 11.5px; line-height: 1.45; }
body:not(.tv-body) .help-ui-section .help-tip-grid { margin-top: 12px !important; gap: 9px !important; }
body:not(.tv-body) .help-ui-section .help-tip {
  border-radius: 15px !important;
  border: 1px solid rgba(44,92,113,.14) !important;
  background: #f8fbfc !important;
  padding: 11px 12px !important;
}
body:not(.tv-body) .help-ui-section .help-tip b { font-size: 12px !important; color: var(--help-primary-dark) !important; }
body:not(.tv-body) .help-ui-section .help-tip span { font-size: 11.5px !important; color: var(--help-muted) !important; }
body:not(.tv-body) .help-ui-section .help-note {
  margin-top: 12px;
  border-radius: 15px !important;
  padding: 11px 12px !important;
  font-size: 12px !important;
  line-height: 1.5;
  font-weight: 600;
}
body:not(.tv-body) .help-ui-trouble-list.help-trouble-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)) !important;
  gap: 10px !important;
}
body:not(.tv-body) .help-ui-trouble-list .help-trouble {
  padding: 12px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(180,83,9,.18) !important;
  background: linear-gradient(180deg, #fffaf0, #ffffff) !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.035);
}
body:not(.tv-body) .help-ui-trouble-list .help-trouble b {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  color: #7c2d12 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.3;
}
body:not(.tv-body) .help-ui-trouble-list .help-trouble b .icon { width: 16px !important; height: 16px !important; color: #b45309 !important; margin-top: 1px; }
body:not(.tv-body) .help-ui-trouble-list .help-trouble p {
  margin: 7px 0 0 24px !important;
  color: #78350f !important;
  font-size: 11.5px !important;
  line-height: 1.48 !important;
}
@media (max-width: 1100px) {
  body:not(.tv-body) .help-ui-hero.card { grid-template-columns: 1fr; }
  body:not(.tv-body) .help-ui-toolbar.card { grid-template-columns: 1fr; top: 60px; }
  body:not(.tv-body) .help-ui-chip-row { justify-content: flex-start; }
  body:not(.tv-body) .help-ui-layout { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .help-ui-nav.card { position: static; max-height: none; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
  body:not(.tv-body) .help-ui-nav > b { grid-column: 1 / -1; }
  body:not(.tv-body) .help-ui-section.card { scroll-margin-top: 128px !important; }
}
@media (max-width: 680px) {
  body:not(.tv-body) .help-ui-hero.card { padding: 16px !important; border-radius: 22px !important; }
  body:not(.tv-body) .help-ui-hero-actions,
  body:not(.tv-body) .help-ui-chip-row { flex-direction: column; align-items: stretch; }
  body:not(.tv-body) .help-ui-action,
  body:not(.tv-body) .help-ui-chip-row button { width: 100%; justify-content: center; }
  body:not(.tv-body) .help-ui-stat-grid,
  body:not(.tv-body) .help-ui-do-dont { grid-template-columns: 1fr; }
  body:not(.tv-body) .help-ui-flow.help-flow-list,
  body:not(.tv-body) .help-ui-card-grid,
  body:not(.tv-body) .help-card-grid.help-ui-card-grid,
  body:not(.tv-body) .help-ui-trouble-list.help-trouble-list { grid-template-columns: 1fr !important; }
  body:not(.tv-body) .help-ui-section-title { align-items: flex-start; }
  body:not(.tv-body) .help-ui-section-title h2 { font-size: 16px !important; }
}
