/* Warm Cinematic: orange #70B8A5, deep brown #121717, charcoal #121717.
   Legacy token names remain stable for existing components and saved themes. */
:root {
  --uno-background: #121717;
  --uno-surface: #121717;
  --uno-cyan: #70B8A5;
  --uno-blue: #70B8A5;
  --uno-highlight: #70B8A5;
  --uno-white: #F2F4F1;
  --uno-ink: #171514;
  --uno-muted: #B8C2BD;
  --uno-gradient: linear-gradient(135deg, #70B8A5, #70B8A5 50%, #70B8A5);
  --bg: var(--uno-background);
  --bg-soft: var(--uno-surface);
  --text: var(--uno-white);
  --text-white: var(--uno-white);
  --muted: var(--uno-muted);
  --text-muted: var(--uno-muted);
}
html, html[data-theme] {
  --accent: var(--uno-cyan);
  --accent-glow: rgba(112, 184, 165, .34);
  --yellow: var(--uno-cyan);
  --yellow-soft: rgba(112, 184, 165, .16);
  --yellow-accent: var(--uno-cyan);
  --yellow-glow: rgba(112, 184, 165, .7);
  --yellow-glow-subtle: rgba(112, 184, 165, .28);
  --cyan: var(--uno-cyan);
  --blue: var(--uno-blue);
  --teal: var(--uno-highlight);
  --card-border-active: var(--uno-cyan);
  --surface: rgba(18, 23, 23, .78);
  --surface-strong: rgba(18, 23, 23, .96);
  --surface-hover: rgba(112, 184, 165, .15);
  --panel: rgba(18, 23, 23, .78);
  --panel-strong: rgba(18, 23, 23, .96);
  --teal-glass-top: rgba(18, 23, 23, .6);
  --teal-glass-bottom: rgba(112, 184, 165, .23);
  --glass-border: rgba(112, 184, 165, .25);
}
html, body { background-color: var(--uno-background); }
.uno-logo { display: block; width: 104px; height: auto; flex: 0 0 auto; object-fit: contain; }
.brand-logo .uno-logo { width: clamp(170px, 18vw, 270px); }
.splash-brand .uno-logo { width: clamp(180px, 23vw, 310px); }
.setup-brand .uno-logo { width: clamp(110px, 12vw, 154px); }
.admin-wordmark .uno-logo, .login-wordmark .uno-logo { width: 136px; }
.playbox-logo { align-items: center; }
.playbox-logo .uno-logo { width: 90px; max-height: 60px; }
.brand-logo { top: clamp(65px, 14vh, 150px); }
/* Blur only the photographic backdrop; controls and text stay sharp. */
.bg-room-layer,
body.home-ui-ready .bg-room-layer {
  background-image: linear-gradient(125deg, rgba(112, 184, 165,.1), rgba(18, 23, 23,.56)), url('../images/bg-room.jpg');
  filter: blur(6px);
  transform: scale(1.08);
  animation: none;
  pointer-events: none;
}
.vignette-layer {
  background: linear-gradient(180deg, rgba(18, 23, 23,.25), transparent 42%, rgba(18, 23, 23,.66)),
    linear-gradient(90deg, rgba(18, 23, 23,.35), transparent 45%, rgba(18, 23, 23,.45));
}
.dashboard-header { background: linear-gradient(180deg, rgba(18, 23, 23,.45), transparent); }
.carousel-container { top: 58%; }
.card-glass-surface {
  background: linear-gradient(165deg, rgba(18, 23, 23,.62) 5%, rgba(18, 23, 23,.32) 48%, rgba(112, 184, 165,.25));
  border-color: rgba(112, 184, 165,.23);
}
.iptv-card.active .card-glass-surface {
  border-color: rgba(112, 184, 165,.75);
  background: linear-gradient(155deg, rgba(18, 23, 23,.8), rgba(112, 184, 165,.36));
  box-shadow: 0 24px 48px rgba(0, 0, 0,.42), inset 0 1px 1px rgba(242, 244, 241,.28);
}
.card-title { font-weight: 500; }
.stat-count { font-weight: 400; }
.pill-tab { background: var(--uno-gradient); }
.fluted-stripes { opacity: .35; }
.splash-loader::after { background: var(--uno-gradient); }
.icon-circle-btn, .user-avatar-btn { border-color: rgba(112, 184, 165,.24); }
:where(a, button, [tabindex="0"]):focus-visible { outline-color: var(--uno-cyan); }
@media (max-width: 820px) {
  .brand-logo { top: auto; }
  .brand-logo .uno-logo { width: 125px; }
  .playbox-logo .uno-logo { width: 72px; max-height: 48px; }
  .carousel-container { top: auto; }
}
@media (max-height: 500px) and (min-width: 701px) {
  .brand-logo { top: 16px; }
  .brand-logo .uno-logo { width: 130px; }
  .carousel-container { top: 58%; }
}
@media (prefers-reduced-motion: reduce) {
  .iptv-card, .icon-circle-btn { transition: none; }
}

.setup-app { background: radial-gradient(ellipse at 15% 30%, rgba(112, 184, 165,.08), transparent 45%), radial-gradient(ellipse at 90% 65%, rgba(112, 184, 165,.1), transparent 40%), var(--uno-background); }

/* The header uses the same artwork as the active profile picker. */
.uno-profile-avatar { padding: 5px !important; overflow: hidden; border: 2px solid rgba(112, 184, 165,.23) !important; border-radius: 50%; background: #121717 !important; }
.uno-profile-avatar::before, .uno-profile-avatar::after { display: none !important; }
.uno-profile-avatar .uno-avatar-art { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 0; border-radius: 50%; overflow: hidden; box-shadow: none; pointer-events: none; }
.uno-profile-avatar .uno-avatar-art svg { display: block; width: 100%; height: 100%; }
.uno-profile-avatar:hover, .uno-profile-avatar:focus-visible { border-color: #70B8A5 !important; }
.profile-face.blue { background: linear-gradient(135deg, #70B8A5, #23312E); }
.profile-face.yellow { background: linear-gradient(135deg, #70B8A5, #23312E); }
.profile-face.red { background: linear-gradient(135deg, #ef5261, #a71638); }
.profile-face.teal { background: linear-gradient(135deg, #70B8A5, #121717); }
.profile-face.green { background: linear-gradient(135deg, #2ecc71, #196f3d); }
.profile-face.purple { background: linear-gradient(135deg, #B8C2BD, #23312E); }
.profile-face.pink { background: linear-gradient(135deg, #ff75ad, #a72d68); }
.profile-face.orange { background: linear-gradient(135deg, #70B8A5, #23312E); }
.profile-face.cyan { background: linear-gradient(135deg, #70B8A5, #23312E); }
.profile-face.slate { background: linear-gradient(135deg, #23312E, #121717); }
.profile-face.gold { background: linear-gradient(135deg, #70B8A5, #121717); }
.profile-face.ruby { background: linear-gradient(135deg, #e94162, #83152f); }

/* Shared header controls across home, libraries, and both settings shells. */
html body .uno-header-control {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px !important;
  height: 50px !important;
  min-width: 50px;
  flex: 0 0 50px;
  padding: 0;
  border-radius: 50%;
  color: #F2F4F1;
  border: 1px solid rgba(112, 184, 165,.22);
  background: #121717;
  box-shadow: inset 0 1px rgba(242, 244, 241,.05);
  vertical-align: middle;
}
html body .uno-header-control:not(.uno-profile-avatar)::before { display: none; }
html body .uno-header-control > svg { display: block !important; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
html body .uno-header-control.uno-profile-avatar { padding: 5px !important; border: 2px solid rgba(112, 184, 165,.3) !important; }
.uno-profile-avatar .uno-avatar-art svg { stroke: none; }
html body .uno-header-control:hover,
html body .uno-header-control:focus-visible { border-color: #70B8A5; box-shadow: 0 0 16px rgba(112, 184, 165,.2); }
html body .uno-header-control:focus-visible { outline: 2px solid #70B8A5; outline-offset: 3px; }
@media (max-width: 700px) {
  html body .uno-header-control { width: 42px !important; height: 42px !important; min-width: 42px; flex-basis: 42px; }
  html body .uno-header-control > svg { width: 21px; height: 21px; }
  html body .uno-header-control.uno-profile-avatar { padding: 4px !important; }
}

/* Connected main-navigation segments, matching the Uno menu reference. */
html body .nav-capsule {
  box-sizing: border-box;
  min-width: 0;
  gap: 12px;
  padding: 8px 12px;
  height: 68px;
  border: 1px solid rgba(112, 184, 165,.22);
  border-radius: 40px;
  background: linear-gradient(110deg,rgba(18, 23, 23,.78),rgba(18, 23, 23,.86));
  box-shadow: inset 0 1px rgba(242, 244, 241,.035);
}
html body .nav-capsule .home-control { width: 48px; height: 48px; border: 1px solid rgba(112, 184, 165,.16); background: #121717; box-shadow: none; }
html body .nav-capsule .playbox-logo { display: flex; align-items: center; padding: 0 14px 0 18px; border-left: 1px solid rgba(112, 184, 165,.25); }
html body .nav-capsule .uno-logo { width: 90px; height: 58px; max-height: 58px; object-fit: contain; }
html body .nav-capsule .library-tabs { display: flex; height: 50px; min-width: 0; flex: 1 1 0; padding: 0; gap: 0; border-radius: 30px; border: 1px solid rgba(112, 184, 165,.24); background: rgba(18, 23, 23,.65); overflow: hidden; box-shadow: inset 0 1px rgba(242, 244, 241,.04); }
html body .nav-capsule .library-tab { height: 100%; padding: 0 12px; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #B8C2BD; font-size: clamp(13px,1.1vw,19px); text-decoration: none; }
html body .nav-capsule .library-tab::before { display: none; }
html body .nav-capsule .library-tab + .library-tab::after { content: ''; position: absolute; inset-inline-start: 0; top: 30%; height: 40%; width: 1px; background: rgba(112, 184, 165,.14); }
html body .nav-capsule .library-tab:hover { background: rgba(112, 184, 165,.09); color: #F2F4F1; }
html body .nav-capsule .library-tab[aria-current="page"],
html body[data-library="movies"] .nav-capsule .movies-tab,
html body[data-library="series"] .nav-capsule .series-tab,
html body[data-library="livetv"] .nav-capsule .tv-tab {
  color: #F2F4F1;
  background: linear-gradient(120deg,#23312E,#121717);
  box-shadow: inset 0 0 0 1px #70B8A5;
}
html body .nav-capsule .library-tab:first-child { border-radius: 28px 0 0 28px; }
html body .nav-capsule .library-tab:last-child { border-radius: 0 28px 28px 0; }
html body .nav-capsule .library-tab:focus-visible { outline: 2px solid #70B8A5; outline-offset: -4px; }
/* Let the capsule shrink before the account controls, never past the viewport. */
@media (min-width: 901px) {
  html body .library-header, html body .livetv-header {
    left: clamp(20px, 3vw, 58px); right: clamp(20px, 3vw, 58px);
    top: clamp(18px, 3vh, 32px); width: auto; padding: 0;
    display: flex; align-items: center; gap: 20px;
  }
  html body .nav-capsule { position: relative; inset: auto; width: auto; max-width: 740px; flex: 1 1 740px; }
  html body .library-header .header-right, html body .livetv-header .header-right {
    position: static; display: flex; flex: 0 0 auto; gap: 10px; margin: 0;
  }
  html body .today-label { font-size: clamp(14px, 1.05vw, 20px); }
  html.playbox-embedded .live-search-inline.playbox-shell-search-host { top: calc(clamp(18px, 3vh, 32px) + 80px); }
  html.playbox-embedded .playbox-shell-search-host.active .live-search-field { width: min(480px, calc(100vw - 48px)); }
}
@media (min-width: 901px) and (max-width: 1300px) {
  html body .today-label { display: none; }
}
@media (max-width: 900px) {
  html body .nav-capsule {
    position: fixed; top: auto; left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom)); width: auto; max-width: none;
    height: 62px; flex: none; gap: 8px; padding: 7px; pointer-events: auto;
    background: #121717; box-shadow: 0 8px 28px rgba(0, 0, 0,.45);
  }
  html body .nav-capsule .home-control { width: 44px; height: 44px; flex: 0 0 44px; }
  html body .nav-capsule .playbox-logo { padding: 0 7px; }
  html body .nav-capsule .uno-logo { width: 58px; height: 40px; }
  html body .nav-capsule .library-tabs { height: 46px; }
  html body .nav-capsule .library-tab { font-size: 13px; padding: 0 6px; }
  html body .library-header .header-right { position: fixed; top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); margin: 0; }
  html body .today-label { display: none; }
  html body .library-main { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
}
@media (min-width: 601px) and (max-width: 900px) {
  html body .livetv-body { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
}
@media (max-width: 430px) {
  html body .nav-capsule { gap: 6px; }
  html body .nav-capsule .playbox-logo { display: none; }
  html body .nav-capsule .library-tab { font-size: 13px; padding: 0 4px; }
}

/* Consistent back-button feedback in the shell and standalone settings. */
html body :is(.app-settings-back, .back-pill) {
  color: #F2F4F1;
  border: 1px solid rgba(112, 184, 165,.3);
  background: #121717;
  box-shadow: inset 0 1px rgba(242, 244, 241,.05);
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
html body :is(.app-settings-back, .back-pill):hover,
html body :is(.app-settings-back, .back-pill):focus-visible {
  color: #F2F4F1;
  border-color: #70B8A5;
  background: #121717;
  box-shadow: 0 0 16px rgba(112, 184, 165,.25);
  transform: none;
}
html body :is(.app-settings-back, .back-pill):focus-visible {
  outline: 2px solid #70B8A5;
  outline-offset: 3px;
}
html body :is(.app-settings-back, .back-pill):active {
  color: #121717;
  border-color: #70B8A5;
  background: #70B8A5;
  box-shadow: none;
  transform: none;
}

/* Wide search panel shared by the catalogue and Live TV. */
:root { --uno-search-top: max(128px, 20vh); }
html body .search-overlay { padding: var(--uno-search-top) 12px 24px; }
html body .search-panel {
  box-sizing: border-box; width: 100%; max-height: calc(100dvh - var(--uno-search-top) - 24px);
  padding: 20px; border-radius: 22px; background: #121717;
  border: 1px solid rgba(184, 194, 189,.32); overflow-y: auto;
}
html body .search-field-wrap { min-height: 44px; gap: 16px; }
html body .search-field-wrap .search-input { font-size: clamp(18px, 1.8vw, 26px); }
html body .search-close {
  min-width: 64px; min-height: 44px; padding: 0 8px; color: #70B8A5;
  font-size: 16px; border-radius: 8px; flex-shrink: 0;
}
html body .search-status { margin: 10px 0 0; color: #B8C2BD; font-size: 14px; }
html body .search-results:empty { display: none; }
html body .search-results:not(:empty) { margin-top: 18px; }
html body .search-close:hover, html body .search-close-btn:hover { background: rgba(112, 184, 165,.12); }
html body .search-close:focus-visible, html body .search-close-btn:focus-visible {
  outline: 2px solid #70B8A5; outline-offset: 2px;
}
html.playbox-embedded body .live-search-inline.playbox-shell-search-host.active .live-search-field,
html body .live-search-inline.active .live-search-field {
  position: fixed; box-sizing: border-box; top: var(--uno-search-top); left: 12px; right: 12px;
  width: auto; height: 112px; padding: 20px; transform: none; border-radius: 22px;
  border: 1px solid rgba(184, 194, 189,.32); background: #121717;
  box-shadow: 0 20px 50px rgba(0, 0, 0,.4);
}
html body .live-search-inline.active .search-input {
  height: 44px; padding: 0 80px 0 38px; font-size: clamp(18px, 1.8vw, 26px);
}
html body .live-search-inline.active .search-icon-inside { left: 20px; top: 42px; width: 24px; height: 24px; }
html body .live-search-inline.active .search-close-btn {
  top: 42px; right: 16px; width: 64px; height: 44px; border: 0; border-radius: 8px;
  color: #70B8A5; background: transparent; font-size: 16px; font-weight: 700;
}
.uno-live-search-status { margin: 10px 0 0; color: #B8C2BD; font-size: 14px; }
@media (min-width: 901px) {
  html.playbox-embedded .live-search-inline.playbox-shell-search-host.active {
    top: 0; left: 0; width: 100%; height: 0; transform: none;
  }
}
@media (max-width: 900px) {
  :root { --uno-search-top: calc(76px + env(safe-area-inset-top)); }
  html body .search-panel { max-height: calc(100dvh - var(--uno-search-top) - 96px - env(safe-area-inset-bottom)); padding: 16px; }
}

/* Live playback has a neutral loading/error background, never sample artwork. */
html body .hero-tiger-img { display: none; }
html body .hero-tiger-video { object-fit: contain; object-position: center; }

/* Remove browsing chrome from playback, including fixed mobile descendants.
   Display is intentional: child visibility/entrance animations can defeat fades. */
html body.player-app-shell.content-player-open .app-shell-header,
html body.player-open .library-header,
html body.player-open .livetv-header {
  display: none !important;
}

/* Start the scrollports below the menu, rather than scrolling away a top pad. */
@media (min-width: 901px) {
  html body .livetv-body { --uno-list-top: calc(clamp(18px, 3vh, 32px) + 84px); }
  html body .livetv-body .category-col,
  html body .livetv-body .channels-col {
    box-sizing: border-box;
    margin-top: var(--uno-list-top);
    height: calc(100% - var(--uno-list-top));
    min-height: 0;
    padding-top: 12px;
    scroll-padding-top: 12px;
    overflow-y: auto;
    overflow-x: hidden;
    contain: paint;
  }
  html.playbox-embedded body.uno-search-open .livetv-body {
    --uno-list-top: calc(var(--uno-search-top) + 124px);
  }
}

.series-language-filter { display: flex; align-items: center; gap: 12px; margin: 12px 0 20px; color: #B8C2BD; }
.series-language-filter[hidden] { display: none; }
.series-language-filter select { min-height: 44px; max-width: 100%; padding: 8px 14px; border: 1px solid #70B8A5; border-radius: 10px; background: #121717; color: #F2F4F1; font: inherit; }
.series-language-filter select:focus-visible { outline: 2px solid #70B8A5; outline-offset: 3px; }

/* Keep the series Back control inside the clipped detail shell. */
html body .series-detail-back {
  left: max(8px, env(safe-area-inset-left));
  box-sizing: border-box;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 50%;
  color: #F2F4F1;
  background: #121717;
  border: 1px solid rgba(112, 184, 165,.3);
  transition: background .15s ease, border-color .15s ease;
}
html body .series-detail-back:hover,
html body .series-detail-back:focus-visible {
  transform: none;
  background: #121717;
  border-color: #70B8A5;
  box-shadow: none;
}
html body .series-detail-back:focus-visible { outline: 2px solid #70B8A5; outline-offset: 3px; }
html body .series-detail-back:active { transform: none; color: #121717; background: #70B8A5; }
@media (max-width: 600px) {
  html body .series-detail-back { left: max(12px, env(safe-area-inset-left)); }
}

.uno-player-channels { position: absolute; z-index: 100; top: 16px; bottom: 16px; right: 16px; width: min(380px, calc(100% - 32px)); display: flex; flex-direction: column; padding: 16px; box-sizing: border-box; border: 1px solid #70B8A5; border-radius: 18px; background: #121717; color: #F2F4F1; box-shadow: 0 12px 40px #0009; }
.uno-player-channels[hidden] { display: none; }
.uno-player-channels header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.uno-player-channels small { display: block; color: #B8C2BD; margin-top: 5px; }
.uno-player-channels button { min-height: 44px; padding: 12px; border: 1px solid #70B8A540; border-radius: 10px; color: #F2F4F1; background: #121717; text-align: start; font: inherit; cursor: pointer; }
.uno-player-channel-items { display: flex; flex-direction: column; gap: 8px; min-height: 0; overflow-y: auto; padding: 5px; }
.uno-player-channel-items button { flex-shrink: 0; }
.uno-player-channels button[aria-current="true"] { background: #121717; border-color: #70B8A5; }
.uno-player-channels button:hover, .uno-player-channels button:focus-visible { outline: 2px solid #70B8A5; outline-offset: 1px; }

html:has(body.uno-home-shelves-enabled), body.uno-home-shelves-enabled { height: auto; overflow-y: auto !important; }
body.uno-home-shelves-enabled .tv-dashboard { position: relative; height: 100dvh; min-height: 560px; }
#unoHomeShelves { position: relative; padding: 28px clamp(16px,4vw,68px) 60px; background: #121717; color: #F2F4F1; }
#unoHomeShelves section + section { margin-top: 32px; }
#unoHomeShelves h2 { margin-bottom: 16px; font-size: 25px; }
.uno-home-row { display: flex; gap: 18px; overflow-x: auto; padding: 6px; }
.uno-home-row p { color: #B8C2BD; }
.uno-home-poster { flex: 0 0 clamp(145px,14vw,210px); color: #F2F4F1; text-decoration: none; border-radius: 12px; }
.uno-home-art { position: relative; display: grid; place-items: center; aspect-ratio: 2/3; background: #121717; border-radius: 12px; overflow: hidden; font-size: 45px; }
.uno-home-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.uno-home-poster strong,.uno-home-poster small { display: block; margin-top: 8px; }
.uno-home-poster small { color: #B8C2BD; font-size: 12px; }
.uno-home-poster:focus-visible { outline: 3px solid #70B8A5; outline-offset: 3px; }
@media(max-width:820px) { body.uno-home-shelves-enabled .tv-dashboard { height: auto; min-height: 100dvh; } }

/* Warm accents for the default smile and home utility controls. */
html body .profile-face.blue { background: linear-gradient(135deg, #70B8A5, #23312E); }
html body .timeshift-btn { background: rgba(18, 23, 23,.9); border-color: rgba(112, 184, 165,.3); }
html body .timeshift-btn:hover, html body .timeshift-btn:focus-visible { background: #121717; border-color: #70B8A5; }

html body #timeshiftBtn { background: rgba(18, 23, 23,.9); border-color: rgba(112, 184, 165,.3); }

/* Quiet home surfaces on both TV and mobile; the logo remains expressive. */
html body .tv-dashboard .card-glass-surface {
  background: rgba(18, 23, 23, .94);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(242, 244, 241, .18);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}
html body .tv-dashboard .iptv-card.active .card-glass-surface {
  background: rgba(18, 23, 23, .97);
  border-color: #70B8A5;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .22);
}
html body .tv-dashboard .card-glass-surface::before,
html body .tv-dashboard .card-glass-surface::after,
html body .tv-dashboard .fluted-stripes { display: none; }
html body .tv-dashboard .pill-tab-glow { top: -3px; height: 4px; width: 64px; }
html body .tv-dashboard .pill-tab {
  background: #70B8A5;
  box-shadow: none;
  animation: none;
}
html body .tv-dashboard .custom-card-icon { filter: none; animation: none; }
html body .tv-dashboard .iptv-card { box-shadow: none !important; }
html body .tv-dashboard .iptv-card.active { transform: translateY(-5px); }
html body .tv-dashboard .iptv-card.active.is-pressed { transform: translateY(-1px); }
html body .tv-dashboard .iptv-card:focus-visible {
  outline: 2px solid #70B8A5;
  outline-offset: 5px;
}
html body .tv-dashboard .uno-header-control,
html body .tv-dashboard .icon-circle-btn,
html body .tv-dashboard #timeshiftBtn {
  background: #121717;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html body .tv-dashboard .uno-header-control:hover,
html body .tv-dashboard .uno-header-control:focus-visible,
html body .tv-dashboard #timeshiftBtn:hover,
html body .tv-dashboard #timeshiftBtn:focus-visible {
  background: #121717;
  box-shadow: none;
}

/* Restrained editorial layout: artwork carries colour, orange signals actions. */
:root {
  --uno-background: #121717;
  --uno-surface: #121717;
  --uno-cyan: #70B8A5;
  --uno-highlight: #70B8A5;
  --uno-white: #F2F4F1;
  --uno-muted: #B8C2BD;
}
html, html[data-theme] {
  --surface: #121717;
  --surface-strong: #232321;
  --panel: #121717;
  --panel-strong: #232321;
}
html body .nav-capsule { background: #121717; border: 0; box-shadow: none; backdrop-filter: none; }
html body .nav-capsule .library-tabs { border: 0; background: transparent; box-shadow: none; }
html body .nav-capsule .library-tab { border-radius: 0; }
html body .nav-capsule .library-tab::before { display: none; }
html body .nav-capsule .library-tab[aria-current="page"],
html body .nav-capsule .library-tab.active {
  background: transparent;
  color: #F2F4F1;
  border: 0;
  box-shadow: inset 0 -3px #70B8A5;
}
html body .nav-capsule .library-tab:focus-visible { outline: 2px solid #F2F4F1; outline-offset: -4px; }
body[data-library] .feature-hero,
body[data-library] .library-main::before { background: #121717; }
body[data-library] .feature-hero::before { display: none; }
body[data-library] .latest-toolbar {
  position: relative;
  top: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  padding: 24px 0;
  background: #121717;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}
body[data-library] .latest-toolbar::before { display: none; }
body[data-library] .section-title-wrap { display: flex; align-items: baseline; flex-wrap: wrap; gap: 16px; }
body[data-library] #toolbarTitle { font-size: clamp(28px, 2.7vw, 40px); font-weight: 600; }
body[data-library] .filter-bar { width: 100%; min-width: 0; justify-content: flex-start; gap: 14px; }
body[data-library] .filter-chips { flex: 1; min-width: 0; overflow-x: auto; justify-content: flex-start; scroll-padding-inline: 6px; }
body[data-library] .filter-summary { display: none; }
body[data-library] .filter-chip { min-height: 44px; font-size: clamp(15px, 1.2vw, 20px); background: #121717; border-color: transparent; }
body[data-library] .filter-chip.active { background: rgba(112,184,165,.18); color: #F2F4F1; border-color: #70B8A5; box-shadow: none; }
body[data-library] .media-shelf { margin-bottom: 36px; }
body[data-library] .shelf-title { font-size: clamp(22px, 2vw, 30px); font-weight: 500; }
body[data-library] .media-card,
body[data-library] .media-card.active,
body[data-library] .media-card:hover { transform: none !important; filter: none; box-shadow: none; }
body[data-library] .media-card .poster {
  border: 1px solid rgba(242, 244, 241,.12);
  border-radius: 10px;
  background: #121717;
  box-shadow: none;
  transform: none !important;
  filter: none;
}
body[data-library] .media-card .poster::before,
body[data-library] .media-card .poster::after,
body[data-library] .media-card .poster-copy,
body[data-library] .series-label,
body[data-library] .series-count-badge,
body[data-library] .rank-number { display: none; }
body[data-library] .media-card .card-play { opacity: 0; }
body[data-library] .media-card:focus-visible { outline: none; }
body[data-library] .media-card:focus-visible .poster {
  outline: 3px solid #F2F4F1;
  outline-offset: 3px;
  transform: scale(1.015) !important;
}
body[data-library] .media-card:hover .poster { border-color: #8d8377; }
body[data-library] .media-title { display: block; margin: 12px 0 4px; font-size: clamp(16px, 1.4vw, 22px); color: #F2F4F1; }
body[data-library] .media-subtitle { display: block; font-size: clamp(14px, 1.05vw, 18px); line-height: 1.5; color: #B8C2BD; }
body[data-library] .landscape-shelf .poster { aspect-ratio: 16 / 9; height: auto; }
body[data-library] .progress-fill { background: #70B8A5; box-shadow: none; }
html body .channel-card { background: #121717; border: 1px solid transparent; box-shadow: none; transform: none; }
html body .channel-card::before, html body .channel-card::after { display: none; }
html body .channel-card.active { background: #292724; border-color: #71675c; box-shadow: none; transform: none; }
html body .channel-card:focus-visible { outline: 3px solid #F2F4F1; outline-offset: -3px; }
@media(max-width:820px) {
  body[data-library] .latest-toolbar { padding: 18px 0; gap: 14px; }
  body[data-library] .filter-bar { flex-wrap: wrap; gap: 10px; }
  body[data-library] .filter-chips { flex: 1 1 100%; }
}
html body[data-library="movies"] .nav-capsule .movies-tab,
html body[data-library="series"] .nav-capsule .series-tab,
html body[data-library="livetv"] .nav-capsule .tv-tab {
  background: transparent; color: #F2F4F1; box-shadow: inset 0 -3px #70B8A5;
}
html body .nav-capsule .library-tab::after { display: none; }
body[data-library] .media-card .poster-source-image { filter: none; opacity: 1; }