/* XtreamlyTV v0.7.0 webOS browsing UI.
 * Release-owned styling for the v0.7 remote-first shell and catalog surfaces. */

/* ---------- shell / top navigation ---------- */
.shell {
  --sidebar:0px !important;
  display:block !important;
  position:relative;
  width:1920px;
  height:1080px;
  overflow:hidden;
}

.sidebar {
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  right:0 !important;
  width:auto !important;
  height:112px !important;
  min-height:112px !important;
  padding:0 46px !important;
  box-sizing:border-box;
  display:flex !important;
  align-items:center;
  background:linear-gradient(180deg, rgba(5,11,14,.98), rgba(5,11,14,.90) 72%, rgba(5,11,14,0));
  border:0 !important;
  z-index:40;
}

.sidebar .logo {
  position:absolute;
  left:46px;
  top:23px;
  height:58px;
  display:flex;
  align-items:center;
  padding:0 !important;
  margin:0 !important;
  font-size:32px !important;
  opacity:.96;
}
.sidebar .logo img { width:50px !important; height:50px !important; }

.nav-list {
  width:100%;
  height:112px;
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  justify-content:center;
  padding:0 250px !important;
  margin:0 !important;
  box-sizing:border-box;
  overflow:visible !important;
}

.nav-item {
  position:relative;
  width:auto !important;
  min-width:126px;
  height:66px !important;
  margin:0 8px !important;
  padding:0 22px !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  border-radius:20px !important;
  border:1px solid transparent !important;
  background:transparent !important;
  color:var(--muted) !important;
  font-size:20px !important;
  font-weight:650;
  letter-spacing:.2px;
  opacity:.64;
  transform:scale(.92);
  transition:transform .15s ease, opacity .15s ease, color .15s ease, background .15s ease, border-color .15s ease !important;
}
.nav-item[data-view="home"] .nav-icon,
.nav-item[data-view="live"] .nav-icon,
.nav-item[data-view="movies"] .nav-icon,
.nav-item[data-view="series"] .nav-icon,
.nav-item[data-view="lists"] .nav-icon { display:none !important; }

.nav-item.active {
  min-width:156px;
  color:var(--text) !important;
  opacity:1;
  transform:scale(1.12);
  background:rgba(var(--panel-rgb),.42) !important;
  border-color:rgba(255,255,255,.08) !important;
}
.nav-item.active:after {
  content:"";
  position:absolute;
  left:30px;
  right:30px;
  bottom:5px;
  height:3px;
  border-radius:3px;
  background:var(--accent);
  box-shadow:0 0 14px var(--glow);
}
.nav-item:focus,
.nav-item.is-focused {
  color:var(--text) !important;
  opacity:1;
  transform:scale(1.08) !important;
  border-color:rgba(var(--accent-rgb),.72) !important;
  box-shadow:inset 0 0 0 2px rgba(var(--accent-rgb),.35),0 10px 28px rgba(0,0,0,.28) !important;
}

.nav-item[data-view="favorites"] { display:none !important; }
.nav-item[data-view="settings"] {
  position:static;
  right:auto;
  top:auto;
  width:auto !important;
  min-width:0 !important;
  height:72px !important;
  margin:0 !important;
  padding:0 25px !important;
  font-size:26px !important;
  opacity:1;
  transform:none;
  border-radius:18px !important;
}
.nav-item[data-view="settings"] .nav-icon {
  display:none !important;
  width:31px !important;
  height:31px !important;
  margin:0 !important;
}
.nav-item[data-view="settings"].active:after { display:none; }

.main {
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:112px !important;
  bottom:0 !important;
  width:auto !important;
  height:auto !important;
  padding:12px 52px 42px !important;
  box-sizing:border-box;
}
.topbar {
  position:absolute !important;
  top:-112px;
  right:118px;
  width:210px;
  height:112px;
  min-height:112px !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center;
  justify-content:flex-end;
  z-index:45;
  pointer-events:none;
}
.topbar h1,
.topbar .status-cluster { display:none !important; }
.topbar-clock { margin:0 !important; color:var(--muted) !important; font-size:18px; }
.view { height:100% !important; min-height:0; }

.menu-hint { bottom:28px !important; right:52px !important; }

/* ---------- shared browse layout ---------- */
.v07-library {
  display:grid;
  grid-template-columns:286px minmax(0,1fr);
  gap:28px;
  height:100%;
  min-height:0;
  overflow:hidden;
}

.v07-category-wheel.category-list {
  height:100%;
  min-height:0;
  padding:24px 18px !important;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(var(--panel-rgb),.58), rgba(var(--panel-rgb),.28));
  border:1px solid rgba(255,255,255,.055);
  box-sizing:border-box;
}
.v07-category-wheel .category-button {
  position:relative;
  min-height:56px;
  height:auto;
  margin:1px 0;
  padding:8px 18px;
  border:1px solid transparent;
  border-radius:17px;
  background:transparent;
  color:var(--muted);
  font-size:20px;
  opacity:.58;
  transform:scale(.94);
  transform-origin:left center;
  transition:transform .13s ease, opacity .13s ease, color .13s ease, background .13s ease, border-color .13s ease !important;
}
.v07-category-wheel .category-button.active {
  color:var(--text);
  opacity:1;
  transform:scale(1.035);
  border-color:rgba(var(--accent-rgb),.78);
  background:rgba(var(--accent-rgb),.10);
  box-shadow:inset 0 0 0 2px rgba(var(--accent-rgb),.17);
}
.v07-category-wheel .category-button:focus,
.v07-category-wheel .category-button.is-focused {
  color:var(--text);
  opacity:1;
  transform:scale(1.055) !important;
  border-color:rgba(var(--accent-rgb),.98);
  background:rgba(var(--accent-rgb),.15);
  box-shadow:inset 0 0 0 3px rgba(var(--accent-rgb),.38),0 10px 24px rgba(0,0,0,.28) !important;
}
.v07-category-wheel .category-button small { display:none !important; }

.v07-media-stage,
.v07-guide-stage {
  min-width:0;
  min-height:0;
  height:100%;
  display:flex;
  flex-direction:column;
}

.v07-browser-tools {
  flex:0 0 72px;
  min-height:72px;
  display:flex;
  align-items:center;
  padding:0 4px 8px 2px;
  box-sizing:border-box;
}
.v07-section-label {
  color:var(--muted);
  font-size:16px;
  font-weight:800;
  letter-spacing:2.2px;
  margin-right:auto;
}
.v07-search-wrap {
  position:relative;
  width:420px;
  height:58px;
}
.v07-search-icon {
  position:absolute;
  left:20px;
  top:13px;
  z-index:2;
  color:var(--muted);
  font-size:27px;
  line-height:28px;
  pointer-events:none;
}
.v07-search-wrap .search-box {
  width:100% !important;
  height:58px !important;
  min-width:0 !important;
  padding:0 24px 0 54px !important;
  border-radius:29px !important;
  font-size:19px !important;
  background:rgba(var(--panel-rgb),.64) !important;
  border:1px solid rgba(255,255,255,.075) !important;
  box-sizing:border-box;
}
.v07-search-wrap .search-box:focus {
  border-color:rgba(var(--accent-rgb),.94) !important;
  box-shadow:inset 0 0 0 2px rgba(var(--accent-rgb),.30),0 8px 22px rgba(0,0,0,.25) !important;
}
.v07-browser-tools .result-count {
  width:148px;
  min-width:148px !important;
  margin-left:18px;
  padding:0 !important;
  text-align:right;
  color:var(--muted);
  font-size:16px !important;
}

.v07-catalog-compat { display:none !important; }
.v07-library .catalog-status {
  position:absolute;
  z-index:20;
  pointer-events:none;
}
.v07-library .catalog-status .catalog-loading,
.v07-library .catalog-status .catalog-error {
  pointer-events:auto;
}

/* ---------- Movies / Series hero + poster rail ---------- */
.v07-media-hero {
  position:relative;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(var(--panel-rgb),.38);
  box-shadow:0 26px 70px rgba(0,0,0,.22);
}
.v07-hero-backdrop {
  position:absolute;
  inset:-24px;
  background-position:center;
  background-size:cover;
  opacity:.30;
  filter:blur(3px) saturate(.92);
  transform:scale(1.035);
  transition:opacity .22s ease, background-image .22s ease;
}
.v07-hero-scrim {
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(4,8,11,.96) 0%, rgba(4,8,11,.84) 38%, rgba(4,8,11,.42) 72%, rgba(4,8,11,.72) 100%),
    linear-gradient(0deg, rgba(4,8,11,.64), transparent 55%);
}
.v07-media-hero-inner {
  position:relative;
  z-index:2;
  height:100%;
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:34px;
  align-items:center;
  padding:30px 42px;
  box-sizing:border-box;
}
.v07-hero-poster {
  width:230px;
  height:330px;
  border-radius:22px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 46px rgba(0,0,0,.32);
}
.v07-hero-poster img {
  width:100%;
  height:100%;
  object-fit:contain;
  background:rgba(0,0,0,.28);
}
.v07-hero-poster span {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-size:54px;
  color:var(--muted);
  background:linear-gradient(145deg, rgba(var(--accent-rgb),.16), rgba(255,255,255,.035));
}
.v07-hero-copy {
  min-width:0;
  max-width:940px;
}
.v07-hero-kicker,
.v07-home-kicker {
  color:var(--accent);
  font-size:15px;
  font-weight:850;
  letter-spacing:2.4px;
  margin-bottom:10px;
}
.v07-hero-copy h2 {
  margin:0;
  color:var(--text);
  font-size:46px;
  line-height:1.06;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-meta-row {
  display:flex;
  align-items:center;
  min-height:38px;
  margin:12px 0 10px;
  overflow:hidden;
}
.v07-meta-chip {
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  margin-right:9px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.06);
  color:#d7e0e3;
  font-size:14px;
}
.v07-hero-copy p {
  max-width:900px;
  max-height:86px;
  margin:0 0 16px;
  overflow:hidden;
  color:#c0ccd0;
  font-size:18px;
  line-height:1.48;
}
.v07-hero-actions {
  display:flex;
  align-items:center;
  min-height:64px;
}
.v07-hero-actions > * + * { margin-left:12px; }
.v07-hero-actions .primary-button,
.v07-hero-actions .secondary-button {
  min-height:56px !important;
  height:56px;
  padding:0 24px !important;
  font-size:18px !important;
  border-radius:16px !important;
}

.v07-poster-rail-wrap {
  flex:0 0 284px;
  min-height:284px;
  padding:16px 4px 0;
  box-sizing:border-box;
  overflow:hidden;
}
.v07-poster-rail {
  height:268px;
  display:flex;
  align-items:flex-start;
  overflow:hidden;
  padding:8px 4px 8px;
  box-sizing:border-box;
}
.v07-poster-card {
  position:relative;
  flex:0 0 156px;
  width:156px !important;
  height:248px !important;
  min-width:156px;
  margin:0 10px 0 0;
  padding:0 !important;
  overflow:visible !important;
  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:19px !important;
  background:rgba(var(--panel-rgb),.46) !important;
  transform:scale(.94);
  opacity:.67;
  transition:transform .13s ease, opacity .13s ease, border-color .13s ease, box-shadow .13s ease !important;
}
.v07-poster-card.selected {
  opacity:.93;
  transform:scale(.985);
  border-color:rgba(var(--accent-rgb),.34) !important;
}
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  z-index:4;
  opacity:1;
  transform:scale(1.045) !important;
  border-color:rgba(var(--accent-rgb),.98) !important;
  box-shadow:inset 0 0 0 3px rgba(var(--accent-rgb),.42),0 14px 32px rgba(0,0,0,.38) !important;
}
.v07-poster-thumb {
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:212px;
  border-radius:18px 18px 12px 12px;
  overflow:hidden;
  background:rgba(255,255,255,.04);
}
.v07-poster-thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.v07-poster-fallback {
  position:absolute;
  inset:0;
  display:none;
  place-items:center;
  color:var(--muted);
  font-size:34px;
  background:linear-gradient(145deg, rgba(var(--accent-rgb),.14), rgba(255,255,255,.025));
}
.image-failed .v07-poster-fallback { display:grid; }
.v07-poster-title {
  position:absolute;
  left:10px;
  right:10px;
  bottom:8px;
  color:#dce4e7;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-favorite-mark,
.v07-poster-card .favorite-badge {
  position:absolute;
  z-index:5;
  right:8px;
  top:8px;
  min-width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0 !important;
  border-radius:15px;
  color:#fff;
  background:rgba(5,8,11,.78);
  border:1px solid rgba(255,255,255,.16);
  font-size:16px;
}

/* ---------- Live EPG ---------- */
.v07-guide-stage { overflow:hidden; }
.v07-guide {
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(var(--panel-rgb),.30);
  box-shadow:0 26px 70px rgba(0,0,0,.18);
}
.v07-guide-header {
  flex:0 0 64px;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  border-bottom:1px solid rgba(255,255,255,.075);
  background:rgba(0,0,0,.14);
}
.v07-station-header {
  display:flex;
  align-items:center;
  padding-left:22px;
  color:var(--muted);
  font-size:13px;
  font-weight:850;
  letter-spacing:1.8px;
  border-right:1px solid rgba(255,255,255,.07);
}
.v07-guide-time-area {
  position:relative;
  min-width:0;
}
.v07-guide-times {
  height:100%;
  display:grid;
  grid-template-columns:repeat(4,1fr);
}
.v07-guide-time {
  display:flex;
  align-items:center;
  padding-left:14px;
  color:#bac6ca;
  font-size:16px;
  border-right:1px solid rgba(255,255,255,.055);
}
.v07-now-line {
  position:absolute;
  top:0;
  bottom:-770px;
  width:2px;
  background:var(--accent);
  box-shadow:0 0 12px var(--glow);
  z-index:9;
  pointer-events:none;
}
.v07-guide-rows {
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}
.v07-guide-row {
  height:112px;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  border-bottom:1px solid rgba(255,255,255,.055);
}
.v07-guide-row:last-child { border-bottom:0; }
.v07-station {
  min-width:0;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  padding:0 16px !important;
  box-sizing:border-box;
  border:0 !important;
  border-right:1px solid rgba(255,255,255,.07) !important;
  border-radius:0 !important;
  background:rgba(255,255,255,.018) !important;
  text-align:left;
  color:var(--text);
  transform:none !important;
  transition:background .12s ease, box-shadow .12s ease !important;
}
.v07-station:focus,
.v07-station.is-focused {
  z-index:5;
  background:rgba(var(--accent-rgb),.12) !important;
  box-shadow:inset 0 0 0 4px rgba(var(--accent-rgb),.92) !important;
}
.v07-station-logo {
  flex:0 0 64px;
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:16px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.06);
}
.v07-station-logo img {
  width:54px;
  height:54px;
  object-fit:contain;
}
.v07-station-logo span {
  font-size:18px;
  font-weight:800;
  color:var(--muted);
}
.v07-station-copy {
  min-width:0;
  margin-left:14px;
}
.v07-station-copy strong {
  display:block;
  color:var(--text);
  font-size:17px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-station-copy span {
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:12px;
}
.v07-program-track {
  position:relative;
  min-width:0;
  height:100%;
  overflow:hidden;
  background-image:linear-gradient(90deg,
    transparent 0,
    transparent calc(25% - 1px),
    rgba(255,255,255,.055) 25%,
    transparent calc(25% + 1px),
    transparent calc(50% - 1px),
    rgba(255,255,255,.055) 50%,
    transparent calc(50% + 1px),
    transparent calc(75% - 1px),
    rgba(255,255,255,.055) 75%,
    transparent calc(75% + 1px));
}
.v07-program {
  position:absolute;
  top:10px;
  bottom:10px;
  min-width:54px;
  padding:13px 14px;
  box-sizing:border-box;
  overflow:hidden;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.075);
  background:rgba(255,255,255,.045);
}
.v07-program strong {
  display:block;
  color:#e5ecee;
  font-size:15px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-program span {
  display:block;
  margin-top:7px;
  color:var(--muted);
  font-size:11px;
  white-space:nowrap;
}
.v07-no-guide {
  height:100%;
  display:flex;
  align-items:center;
  padding-left:18px;
  color:rgba(255,255,255,.30);
  font-size:14px;
}
.v07-guide-loading {
  width:42%;
  height:58px;
  margin:27px 18px;
  border-radius:13px;
  background:linear-gradient(90deg, rgba(255,255,255,.025), rgba(255,255,255,.065), rgba(255,255,255,.025));
  opacity:.6;
}

/* ---------- Home ---------- */
.v07-home {
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 10px 70px 0;
  scroll-padding:18px 0 80px;
  box-sizing:border-box;
}
.v07-home::-webkit-scrollbar { display:none; }
.v07-home-hero {
  position:relative;
  height:424px;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(var(--panel-rgb),.40);
  box-shadow:0 26px 70px rgba(0,0,0,.20);
}
.v07-home-backdrop {
  position:absolute;
  inset:-20px;
  background-position:center;
  background-size:cover;
  opacity:.28;
  filter:blur(2px);
  transform:scale(1.03);
}
.v07-home-scrim {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(4,8,11,.95), rgba(4,8,11,.74) 52%, rgba(4,8,11,.34));
}
.v07-home-hero-inner {
  position:relative;
  z-index:2;
  height:100%;
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  align-items:center;
  gap:34px;
  padding:32px 48px;
  box-sizing:border-box;
}
.v07-home-poster-large {
  width:206px;
  height:300px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:24px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 48px rgba(0,0,0,.32);
}
.v07-home-poster-large img { width:100%; height:100%; object-fit:contain; }
.v07-home-poster-large span { font-size:48px; color:var(--muted); }
.v07-home-copy { max-width:880px; min-width:0; }
.v07-home-copy h2 {
  margin:0 0 14px;
  font-size:52px;
  line-height:1.04;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-home-copy p {
  max-width:820px;
  max-height:66px;
  margin:0 0 20px;
  overflow:hidden;
  color:#c0ccd0;
  font-size:19px;
  line-height:1.45;
}
.v07-home-copy .primary-button {
  min-height:58px !important;
  height:58px;
  padding:0 26px !important;
  font-size:19px !important;
  border-radius:17px !important;
}
.v07-home-row-section { margin-top:26px; }
.v07-home-row-section h3 {
  margin:0 0 12px 4px;
  font-size:24px;
  color:var(--text);
}
.v07-home-row {
  display:flex;
  align-items:flex-start;
  height:178px;
  padding:6px 4px 12px;
  overflow:hidden;
  box-sizing:border-box;
}
.v07-home-channel,
.v07-home-poster {
  position:relative;
  flex:0 0 210px;
  width:210px;
  height:154px;
  margin-right:14px;
  border:1px solid rgba(255,255,255,.065) !important;
  border-radius:20px !important;
  background:rgba(var(--panel-rgb),.45) !important;
  overflow:hidden;
  color:var(--text);
  transform:none !important;
}
.v07-home-channel {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:16px !important;
}
.v07-home-channel .v07-station-logo {
  width:72px;
  height:72px;
  flex-basis:72px;
}
.v07-home-channel > span {
  max-width:178px;
  margin-top:10px;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-home-poster {
  display:flex;
  align-items:center;
  padding:12px !important;
}
.v07-home-poster-art {
  position:relative;
  flex:0 0 84px;
  width:84px;
  height:126px;
  overflow:hidden;
  border-radius:12px;
  background:rgba(255,255,255,.04);
}
.v07-home-poster-art img { width:100%; height:100%; object-fit:cover; }
.v07-home-poster > span {
  min-width:0;
  margin-left:13px;
  font-size:15px;
  font-weight:700;
  line-height:1.35;
  text-align:left;
}
.v07-home-channel:focus,
.v07-home-poster:focus {
  border-color:rgba(var(--accent-rgb),.96) !important;
  box-shadow:inset 0 0 0 3px rgba(var(--accent-rgb),.42),0 12px 28px rgba(0,0,0,.32) !important;
}

.v07-empty {
  width:100%;
  min-height:160px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  font-size:16px;
}
.v07-empty strong { color:var(--text); font-size:24px; margin-bottom:8px; }
.v07-empty-hero { height:100%; }

.v07-favorite-settings { order:-100; }

/* Old Favorites remains available only as a management utility through Settings. */
.favorites-hub,
.favorite-manager,
.favorite-item-manager,
.favorite-editor { padding-top:8px; }

/* Keep motion short: enough spatial continuity to feel modern, never sluggish. */
@media (prefers-reduced-motion: reduce) {
  .nav-item,
  .v07-category-wheel .category-button,
  .v07-poster-card { transition:none !important; }
}


/* ========================================================================
   v0.7.0 TV feedback pass
   ======================================================================== */

/* Faster D-pad feedback. Keep motion perceptible, but never make focus wait. */
.nav-item,
.v07-poster-card,
.v07-station,
.v07-category-wheel .category-button {
  transition-duration:.07s !important;
  transition-timing-function:ease-out !important;
}

/* Larger integrated brand mark. */
.sidebar .logo {
  left:42px !important;
  top:15px !important;
  height:82px !important;
  font-size:35px !important;
}
.sidebar .logo img {
  width:70px !important;
  height:70px !important;
}
.sidebar .logo span {
  margin-left:-3px !important;
}

/* ---------- Price-Is-Right-style category wheel ---------- */
.v07-category-wheel.category-list {
  position:relative;
  padding:16px 14px 42px !important;
  overflow:hidden !important;
  background:
    linear-gradient(180deg, rgba(var(--panel-rgb),.62), rgba(var(--panel-rgb),.30)),
    radial-gradient(ellipse at center, rgba(var(--accent-rgb),.055), transparent 58%);
}
.v07-category-wheel.category-list:before,
.v07-category-wheel.category-list:after {
  content:"";
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  height:118px;
  pointer-events:none;
}
.v07-category-wheel.category-list:before {
  top:0;
  background:linear-gradient(180deg, rgba(5,10,13,.84), rgba(5,10,13,0));
}
.v07-category-wheel.category-list:after {
  bottom:30px;
  background:linear-gradient(0deg, rgba(5,10,13,.84), rgba(5,10,13,0));
}
.v07-wheel-viewport {
  position:relative;
  z-index:2;
  height:100%;
  display:grid;
  grid-template-rows:repeat(7,minmax(0,1fr));
  align-items:stretch;
  perspective:760px;
  overflow:hidden;
}
.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active {
  width:100% !important;
  min-height:0 !important;
  height:100% !important;
  margin:0 !important;
  padding:0 18px !important;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  border:1px solid transparent !important;
  border-radius:18px !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--muted) !important;
  font-size:20px !important;
  font-weight:650;
  opacity:.56;
  transform-origin:center center;
  white-space:nowrap;
  overflow:hidden;
}
.v07-wheel-slot[data-wheel-distance="1"] {
  opacity:.70;
  transform:scale(.94) rotateX(4deg) !important;
}
.v07-wheel-slot[data-wheel-distance="2"] {
  opacity:.42;
  transform:scale(.86) rotateX(8deg) !important;
}
.v07-wheel-slot[data-wheel-distance="3"] {
  opacity:.20;
  transform:scale(.78) rotateX(12deg) !important;
}
.v07-wheel-slot[data-wheel-offset="-1"],
.v07-wheel-slot[data-wheel-offset="-2"],
.v07-wheel-slot[data-wheel-offset="-3"] {
  transform-origin:center bottom;
}
.v07-wheel-slot[data-wheel-offset="1"],
.v07-wheel-slot[data-wheel-offset="2"],
.v07-wheel-slot[data-wheel-offset="3"] {
  transform-origin:center top;
}
.v07-wheel-slot .v07-wheel-label {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v07-wheel-slot.v07-wheel-active:not(.v07-wheel-center) .v07-wheel-label {
  color:#d5e1e4;
}
.v07-wheel-active-dot {
  flex:0 0 7px;
  width:7px;
  height:7px;
  margin-left:auto;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px var(--glow);
}
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  z-index:6;
  color:var(--text) !important;
  opacity:1 !important;
  transform:scale(1) !important;
  border-color:rgba(var(--accent-rgb),.98) !important;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.17), rgba(var(--accent-rgb),.075)) !important;
  box-shadow:
    inset 0 0 0 3px rgba(var(--accent-rgb),.42),
    0 12px 30px rgba(0,0,0,.28) !important;
  font-size:23px !important;
  font-weight:820;
}
.v07-wheel-slot.v07-wheel-center:before,
.v07-wheel-slot.v07-wheel-center:after {
  content:"";
  position:absolute;
  right:16px;
  width:12px;
  height:2px;
  border-radius:2px;
  background:rgba(var(--accent-rgb),.86);
}
.v07-wheel-slot.v07-wheel-center:before { top:12px; }
.v07-wheel-slot.v07-wheel-center:after { bottom:12px; }
.v07-wheel-hint {
  position:absolute;
  z-index:7;
  left:0;
  right:0;
  bottom:12px;
  text-align:center;
  color:rgba(255,255,255,.36);
  font-size:12px;
  letter-spacing:.5px;
  pointer-events:none;
}
.v07-wheel-empty {
  height:100%;
  display:grid;
  place-items:center;
  color:var(--muted);
  font-size:17px;
}
.v07-wheel-spin-down { animation:v07WheelDown .065s ease-out; }
.v07-wheel-spin-up { animation:v07WheelUp .065s ease-out; }
@keyframes v07WheelDown {
  from { transform:translateY(-13px); opacity:.90; }
  to { transform:translateY(0); opacity:1; }
}
@keyframes v07WheelUp {
  from { transform:translateY(13px); opacity:.90; }
  to { transform:translateY(0); opacity:1; }
}

/* ---------- centered category-scoped search ---------- */
.v07-browser-tools {
  position:relative;
  flex:0 0 72px;
  min-height:72px;
}
.v07-tool-left {
  position:absolute;
  left:2px;
  top:8px;
  bottom:8px;
  width:310px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.v07-section-label { margin:0 !important; }
.v07-catalog-activity {
  min-height:20px;
  margin-top:3px;
  display:flex;
  align-items:center;
  color:rgba(255,255,255,.52);
  font-size:12px;
  opacity:0;
  white-space:nowrap;
}
.v07-catalog-activity.active { opacity:1; }
.v07-activity-spinner {
  width:12px;
  height:12px;
  margin-right:7px;
  border:2px solid rgba(255,255,255,.18);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:v07ActivitySpin .55s linear infinite;
}
@keyframes v07ActivitySpin { to { transform:rotate(360deg); } }

.v07-search-wrap {
  position:absolute !important;
  left:50%;
  top:6px;
  width:470px !important;
  height:58px;
  transform:translateX(-50%);
}
.v07-search-icon {
  left:19px !important;
  top:16px !important;
  width:25px;
  height:25px;
  color:var(--muted);
  font-size:0 !important;
  line-height:0 !important;
}
.v07-search-svg {
  display:block;
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.v07-search-wrap .search-box {
  padding-left:55px !important;
}
.v07-browser-tools .result-count {
  position:absolute;
  right:4px;
  top:0;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin:0 !important;
}
.v07-library .catalog-status:empty { display:none !important; }
.v07-library .catalog-status .catalog-loading { display:none !important; }

/* ---------- Movies / Series: slightly smaller hero, much larger posters ---------- */
.v07-media-hero {
  flex:0 0 430px !important;
  min-height:430px !important;
  border-radius:28px;
}
.v07-media-hero-inner {
  grid-template-columns:200px minmax(0,1fr) !important;
  gap:28px !important;
  padding:24px 36px !important;
}
.v07-hero-poster {
  width:190px !important;
  height:276px !important;
  border-radius:19px;
}
.v07-hero-copy h2 { font-size:42px !important; }
.v07-hero-copy p {
  max-height:68px !important;
  margin-bottom:12px !important;
  font-size:17px !important;
}
.v07-meta-row {
  min-height:32px !important;
  margin:9px 0 8px !important;
}
.v07-hero-actions { min-height:54px !important; }
.v07-hero-actions .primary-button,
.v07-hero-actions .secondary-button {
  min-height:50px !important;
  height:50px !important;
  font-size:17px !important;
}

.v07-poster-rail-wrap {
  flex:1 1 auto !important;
  min-height:350px !important;
  padding-top:12px !important;
}
.v07-poster-rail {
  height:100% !important;
  padding:10px 4px 8px !important;
}
.v07-poster-card {
  flex:0 0 190px !important;
  width:190px !important;
  min-width:190px !important;
  height:318px !important;
  margin-right:12px !important;
  border-radius:20px !important;
  transform:none !important;
  opacity:.76 !important;
}
.v07-poster-card.selected { opacity:.95 !important; }
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  opacity:1 !important;
  transform:scale(1.018) !important;
}
.v07-poster-thumb {
  height:278px !important;
  border-radius:19px 19px 13px 13px !important;
}
.v07-poster-title {
  left:12px;
  right:12px;
  bottom:9px;
  font-size:14px;
}

/* ---------- Live TV readability + five-row guide ---------- */
.v07-guide {
  position:relative;
}
.v07-guide-header {
  position:relative;
  z-index:4;
  flex:0 0 66px !important;
  grid-template-columns:260px minmax(0,1fr);
  border-bottom:1px solid rgba(255,255,255,.09) !important;
  background:rgba(4,9,12,.38) !important;
  box-shadow:none !important;
}
.v07-station-header {
  padding-left:22px;
  border-right:0 !important;
  color:#c5d1d5;
  font-size:14px !important;
  letter-spacing:1.7px;
  text-shadow:none !important;
  -webkit-font-smoothing:antialiased;
}
.v07-guide-time-area {
  overflow:hidden;
}
.v07-guide-times {
  background:transparent !important;
}
.v07-guide-time {
  padding-left:16px !important;
  border:0 !important;
  color:#d1dadd !important;
  font-size:17px !important;
  font-weight:700;
  text-shadow:none !important;
  -webkit-font-smoothing:antialiased;
}
.v07-guide-rows {
  flex:1 1 auto;
  min-height:0;
  display:grid !important;
  grid-template-rows:repeat(5,minmax(0,1fr));
  overflow:hidden;
}
.v07-guide-row {
  height:auto !important;
  min-height:0 !important;
  grid-template-columns:260px minmax(0,1fr);
}
.v07-station {
  padding:0 18px !important;
  transition-duration:.055s !important;
}
.v07-station-logo {
  flex:0 0 74px !important;
  width:74px !important;
  height:74px !important;
  border-radius:18px !important;
}
.v07-station-logo img {
  width:64px !important;
  height:64px !important;
}
.v07-station-logo span { font-size:20px !important; }
.v07-station-copy { margin-left:16px !important; }
.v07-station-copy strong {
  font-size:20px !important;
  line-height:1.2;
}
.v07-station-copy span {
  margin-top:7px !important;
  font-size:14px !important;
}
.v07-program {
  top:9px !important;
  bottom:9px !important;
  padding:15px 16px !important;
  border-radius:15px !important;
}
.v07-program strong {
  font-size:18px !important;
  line-height:1.22 !important;
}
.v07-program span {
  margin-top:7px !important;
  font-size:13px !important;
}
.v07-no-guide {
  padding-left:18px;
  font-size:16px !important;
}
.v07-guide-loading {
  height:66px !important;
  margin:calc((100% - 66px) / 2) 18px !important;
}
.v07-now-line {
  position:absolute !important;
  top:66px !important;
  bottom:0 !important;
  width:3px !important;
  background:var(--accent) !important;
  box-shadow:0 0 11px var(--glow),0 0 2px rgba(255,255,255,.65) !important;
  z-index:12 !important;
  pointer-events:none;
}

/* A little extra readability on the actual living-room panel. */
.v07-guide,
.v07-media-hero,
.v07-category-wheel {
  -webkit-font-smoothing:antialiased;
}

@media (prefers-reduced-motion: reduce) {
  .v07-wheel-spin-down,
  .v07-wheel-spin-up,
  .v07-activity-spinner { animation:none !important; }
}


/* ========================================================================
   v0.7.0 TV readability / webOS rendering pass
   ======================================================================== */

/* The supplied XtreamlyTV asset is a horizontal wordmark, not a square icon.
   Give it horizontal room instead of compressing it into a 70x70 box. */
.sidebar .logo {
  left:42px !important;
  top:12px !important;
  width:260px !important;
  height:88px !important;
  max-width:none !important;
}
.sidebar .logo img {
  width:235px !important;
  height:76px !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:left center !important;
}
.sidebar .logo span {
  font-size:36px !important;
}

/* Main destinations need to read clearly from couch distance. */
.nav-item {
  min-width:152px !important;
  height:72px !important;
  padding:0 25px !important;
  font-size:26px !important;
  line-height:1 !important;
  font-weight:700 !important;
}
.nav-item.active {
  min-width:182px !important;
  font-size:28px !important;
  font-weight:820 !important;
}
.nav-item[data-view="settings"] {
  min-width:0 !important;
  width:auto !important;
  height:72px !important;
  font-size:26px !important;
}

/* ---------- webOS-safe fixed-center circular category wheel ----------
   r2 used CSS Grid + percentage child heights. On the target LG webOS engine
   those heights collapse/overlap. r3 positions each of the seven visible
   slots explicitly around the fixed center point. No Grid sizing is involved.
*/
.v07-category-wheel.category-list {
  position:relative !important;
  padding:0 !important;
  overflow:hidden !important;
}
.v07-wheel-viewport {
  position:absolute !important;
  z-index:2 !important;
  left:12px !important;
  right:12px !important;
  top:16px !important;
  bottom:44px !important;
  height:auto !important;
  display:block !important;
  overflow:hidden !important;
  perspective:none !important;
}
.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active {
  position:absolute !important;
  top:50% !important;
  left:10px !important;
  right:10px !important;
  width:auto !important;
  min-width:0 !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  margin:-36px 0 0 !important;
  padding:0 18px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  transform-origin:center center !important;
  border-radius:18px !important;
  transition:transform .055s ease-out, opacity .055s ease-out,
             border-color .055s ease-out, background .055s ease-out !important;
}
.v07-wheel-slot[data-wheel-offset="-3"] {
  left:34px !important; right:34px !important;
  opacity:.19 !important;
  transform:translateY(-246px) scale(.80) !important;
}
.v07-wheel-slot[data-wheel-offset="-2"] {
  left:24px !important; right:24px !important;
  opacity:.38 !important;
  transform:translateY(-164px) scale(.86) !important;
}
.v07-wheel-slot[data-wheel-offset="-1"] {
  left:14px !important; right:14px !important;
  opacity:.68 !important;
  transform:translateY(-82px) scale(.93) !important;
}
.v07-wheel-slot[data-wheel-offset="0"],
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  left:4px !important; right:4px !important;
  opacity:1 !important;
  transform:translateY(0) scale(1) !important;
  color:var(--text) !important;
  border-color:rgba(var(--accent-rgb),.98) !important;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.19), rgba(var(--accent-rgb),.075)) !important;
  box-shadow:inset 0 0 0 3px rgba(var(--accent-rgb),.42),0 10px 26px rgba(0,0,0,.24) !important;
  font-size:23px !important;
  font-weight:820 !important;
}
.v07-wheel-slot[data-wheel-offset="1"] {
  left:14px !important; right:14px !important;
  opacity:.68 !important;
  transform:translateY(82px) scale(.93) !important;
}
.v07-wheel-slot[data-wheel-offset="2"] {
  left:24px !important; right:24px !important;
  opacity:.38 !important;
  transform:translateY(164px) scale(.86) !important;
}
.v07-wheel-slot[data-wheel-offset="3"] {
  left:34px !important; right:34px !important;
  opacity:.19 !important;
  transform:translateY(246px) scale(.80) !important;
}
.v07-wheel-slot .v07-wheel-label {
  display:block !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  line-height:1.12 !important;
}
.v07-wheel-slot.v07-wheel-center:before,
.v07-wheel-slot.v07-wheel-center:after {
  display:none !important;
}
.v07-wheel-hint {
  bottom:14px !important;
  font-size:13px !important;
}

/* ---------- Live EPG header readability ----------
   Make the channel/timeline strip a real vertically-centered header row.
*/
.v07-guide-header {
  flex:0 0 80px !important;
  min-height:80px !important;
  height:80px !important;
  align-items:stretch !important;
}
.v07-station-header {
  height:80px !important;
  display:flex !important;
  align-items:center !important;
  padding:0 24px !important;
  box-sizing:border-box !important;
  color:#d9e2e5 !important;
  font-size:20px !important;
  font-weight:820 !important;
  line-height:1 !important;
  letter-spacing:1.8px !important;
}
.v07-guide-time-area,
.v07-guide-times {
  height:80px !important;
  min-height:80px !important;
}
.v07-guide-times {
  display:grid !important;
  align-items:stretch !important;
}
.v07-guide-time {
  height:80px !important;
  min-height:80px !important;
  display:flex !important;
  align-items:center !important;
  padding:0 22px !important;
  box-sizing:border-box !important;
  color:#e0e7e9 !important;
  font-size:20px !important;
  font-weight:760 !important;
  line-height:1 !important;
}

/* ---------- Movies / Series ----------
   Keep the r2 hero box dimensions, enlarge everything inside it.
*/
.v07-media-hero {
  flex:0 0 430px !important;
  min-height:430px !important;
  height:430px !important;
}
.v07-media-hero-inner {
  grid-template-columns:238px minmax(0,1fr) !important;
  gap:32px !important;
  padding:20px 38px !important;
}
.v07-hero-poster {
  width:220px !important;
  height:320px !important;
  border-radius:20px !important;
}
.v07-hero-kicker {
  font-size:17px !important;
  letter-spacing:2.5px !important;
  margin-bottom:8px !important;
}
.v07-hero-copy h2 {
  font-size:50px !important;
  line-height:1.03 !important;
}
.v07-meta-row {
  min-height:38px !important;
  margin:10px 0 9px !important;
}
.v07-meta-chip {
  min-height:31px !important;
  padding:0 13px !important;
  font-size:16px !important;
}
.v07-hero-copy p {
  max-height:88px !important;
  margin-bottom:14px !important;
  font-size:20px !important;
  line-height:1.42 !important;
}
.v07-hero-actions {
  min-height:58px !important;
}
.v07-hero-actions .primary-button,
.v07-hero-actions .secondary-button {
  min-height:56px !important;
  height:56px !important;
  padding:0 24px !important;
  font-size:19px !important;
}
.v07-hero-actions .primary-button {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.v07-action-icon {
  flex:0 0 23px;
  width:23px;
  height:23px;
  margin-right:10px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.v07-action-icon-play path {
  fill:currentColor;
  stroke:currentColor;
}


/* ========================================================================
   v0.7.0 category-wheel visual treatment refinement
   ======================================================================== */

/* Head-on wheel presentation:
   - all seven visible rows keep the same usable width
   - labels are centered instead of left-aligned
   - no pseudo-perspective narrowing
   - top/bottom fade spans the full category field
*/
.v07-category-wheel.category-list {
  position:relative !important;
  overflow:hidden !important;
}
.v07-category-wheel.category-list:before,
.v07-category-wheel.category-list:after {
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  height:96px !important;
  z-index:6 !important;
  pointer-events:none !important;
}
.v07-category-wheel.category-list:before {
  top:0 !important;
  background:linear-gradient(180deg, rgba(6,11,14,.96) 0%, rgba(6,11,14,.82) 35%, rgba(6,11,14,0) 100%) !important;
}
.v07-category-wheel.category-list:after {
  bottom:0 !important;
  background:linear-gradient(0deg, rgba(6,11,14,.96) 0%, rgba(6,11,14,.82) 35%, rgba(6,11,14,0) 100%) !important;
}

.v07-wheel-viewport {
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:40px !important;
  overflow:hidden !important;
}

.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active {
  left:14px !important;
  right:14px !important;
  width:auto !important;
  min-width:0 !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  margin:-36px 0 0 !important;
  padding:0 16px !important;
  justify-content:center !important;
  text-align:center !important;
  border-radius:19px !important;
  line-height:1 !important;
}

.v07-wheel-slot[data-wheel-offset="-3"] {
  opacity:.16 !important;
  transform:translateY(-228px) scale(.84) !important;
}
.v07-wheel-slot[data-wheel-offset="-2"] {
  opacity:.31 !important;
  transform:translateY(-152px) scale(.90) !important;
}
.v07-wheel-slot[data-wheel-offset="-1"] {
  opacity:.58 !important;
  transform:translateY(-76px) scale(.96) !important;
}
.v07-wheel-slot[data-wheel-offset="0"],
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  left:14px !important;
  right:14px !important;
  opacity:1 !important;
  transform:translateY(0) scale(1) !important;
  justify-content:center !important;
  text-align:center !important;
}
.v07-wheel-slot[data-wheel-offset="1"] {
  opacity:.58 !important;
  transform:translateY(76px) scale(.96) !important;
}
.v07-wheel-slot[data-wheel-offset="2"] {
  opacity:.31 !important;
  transform:translateY(152px) scale(.90) !important;
}
.v07-wheel-slot[data-wheel-offset="3"] {
  opacity:.16 !important;
  transform:translateY(228px) scale(.84) !important;
}

.v07-wheel-slot .v07-wheel-label {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  display:block !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.12 !important;
}

.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  padding:0 6px !important;
}

.v07-wheel-slot .v07-wheel-active-dot,
.v07-wheel-slot.v07-wheel-center .v07-wheel-active-dot {
  display:none !important;
}

.v07-wheel-hint {
  left:0 !important;
  right:0 !important;
  bottom:14px !important;
  text-align:center !important;
  letter-spacing:.2px !important;
}


/* ========================================================================
   v0.7.0 layout polish pass
   ======================================================================== */

/* Category wheel:
   - fill the full menu height more convincingly
   - reduce dead space at top/bottom
   - keep a centered, straight-on look
   - shrink long active labels before they overflow the focus box
*/
.v07-category-wheel.category-list {
  padding:0 !important;
}
.v07-category-wheel.category-list:before,
.v07-category-wheel.category-list:after {
  height:74px !important;
}
.v07-wheel-viewport {
  top:6px !important;
  bottom:24px !important;
}
.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active {
  left:10px !important;
  right:10px !important;
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
  margin:-38px 0 0 !important;
  padding:0 12px !important;
}
.v07-wheel-slot[data-wheel-offset="-3"] {
  opacity:.16 !important;
  transform:translateY(-252px) scale(.84) !important;
}
.v07-wheel-slot[data-wheel-offset="-2"] {
  opacity:.31 !important;
  transform:translateY(-168px) scale(.90) !important;
}
.v07-wheel-slot[data-wheel-offset="-1"] {
  opacity:.58 !important;
  transform:translateY(-84px) scale(.96) !important;
}
.v07-wheel-slot[data-wheel-offset="0"],
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  left:10px !important;
  right:10px !important;
  transform:translateY(0) scale(1) !important;
}
.v07-wheel-slot[data-wheel-offset="1"] {
  opacity:.58 !important;
  transform:translateY(84px) scale(.96) !important;
}
.v07-wheel-slot[data-wheel-offset="2"] {
  opacity:.31 !important;
  transform:translateY(168px) scale(.90) !important;
}
.v07-wheel-slot[data-wheel-offset="3"] {
  opacity:.16 !important;
  transform:translateY(252px) scale(.84) !important;
}
.v07-wheel-slot .v07-wheel-label {
  width:100% !important;
  display:block !important;
  text-align:center !important;
  line-height:1.1 !important;
  font-size:22px !important;
  font-weight:760 !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long {
  font-size:19px !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong {
  font-size:17px !important;
  letter-spacing:-.1px !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  font-size:23px !important;
  font-weight:820 !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long {
  font-size:20px !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong {
  font-size:18px !important;
}
.v07-wheel-hint {
  bottom:8px !important;
}

/* EPG shell:
   remove the bottom-left radius so the last-row station focus ring is not cut.
*/
.v07-guide-stage {
  overflow:visible !important;
}
.v07-guide {
  border-radius:28px 28px 28px 0 !important;
  overflow:hidden !important;
}

/* Favorite hotkey hint:
   move it out of the browse surfaces so it never overlaps content.
*/
.menu-hint {
  top:126px !important;
  right:54px !important;
  bottom:auto !important;
  left:auto !important;
  z-index:70 !important;
  transform:none !important;
}

/* Search:
   visually center it beneath the top main menu rather than the content column.
   JS computes the exact horizontal center from the nav list.
*/
.v07-search-wrap {
  top:8px !important;
  width:500px !important;
}
.v07-search-wrap .search-box {
  text-align:left !important;
}

/* Settings:
   replace odd glyph rendering with an inline SVG gear.
*/
.nav-item[data-view="settings"] {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.nav-item[data-view="settings"] .nav-icon {
  display:none !important;
  place-items:center !important;
  width:34px !important;
  height:34px !important;
  font-size:0 !important;
}
.nav-item[data-view="settings"] .nav-icon svg,
.v07-settings-svg {
  width:34px !important;
  height:34px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}


/* ========================================================================
   v0.7.0 wheel stretch + tool layout + 6-card rail pass
   ======================================================================== */
.v07-category-wheel.category-list {
  padding:0 !important;
  overflow:hidden !important;
}
.v07-category-wheel.category-list:before,
.v07-category-wheel.category-list:after {
  height:52px !important;
}
.v07-wheel-viewport {
  top:0 !important;
  bottom:0 !important;
  left:0 !important;
  right:0 !important;
}
.v07-wheel-spin-down,
.v07-wheel-spin-up {
  animation:none !important;
}
.v07-wheel-viewport,
.v07-wheel-slot {
  pointer-events:none !important;
}
.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active {
  left:8px !important;
  right:8px !important;
  height:82px !important;
  min-height:82px !important;
  max-height:82px !important;
  margin:-41px 0 0 !important;
  padding:0 14px !important;
  border-radius:20px !important;
}
.v07-wheel-slot[data-wheel-offset="-3"] { opacity:.16 !important; transform:translateY(-294px) scale(.84) !important; }
.v07-wheel-slot[data-wheel-offset="-2"] { opacity:.31 !important; transform:translateY(-196px) scale(.90) !important; }
.v07-wheel-slot[data-wheel-offset="-1"] { opacity:.58 !important; transform:translateY(-98px) scale(.96) !important; }
.v07-wheel-slot[data-wheel-offset="0"],
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  left:8px !important;
  right:8px !important;
  transform:translateY(0) scale(1) !important;
}
.v07-wheel-slot[data-wheel-offset="1"] { opacity:.58 !important; transform:translateY(98px) scale(.96) !important; }
.v07-wheel-slot[data-wheel-offset="2"] { opacity:.31 !important; transform:translateY(196px) scale(.90) !important; }
.v07-wheel-slot[data-wheel-offset="3"] { opacity:.16 !important; transform:translateY(294px) scale(.84) !important; }
.v07-wheel-slot .v07-wheel-label { font-size:22px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long { font-size:19px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong { font-size:17px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label { font-size:23px !important; font-weight:820 !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long { font-size:20px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong { font-size:18px !important; }
.v07-wheel-hint { bottom:10px !important; }
.v07-section-label { display:none !important; }
.v07-browser-tools {
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:20px !important;
  flex:0 0 76px !important;
  min-height:76px !important;
  padding:0 0 10px 2px !important;
}
.v07-search-wrap {
  position:relative !important;
  order:1 !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  width:458px !important;
  flex:0 0 458px !important;
}
.v07-browser-tools .result-count {
  position:relative !important;
  order:2 !important;
  right:auto !important;
  top:auto !important;
  height:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin:0 !important;
  min-width:148px !important;
  max-width:220px !important;
  white-space:nowrap !important;
}
.v07-tool-left {
  position:relative !important;
  order:3 !important;
  left:auto !important;
  top:auto !important;
  bottom:auto !important;
  width:auto !important;
  min-width:230px !important;
  max-width:280px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin-left:8px !important;
}
.v07-catalog-activity {
  min-height:22px !important;
  margin:0 !important;
  font-size:13px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.menu-hint {
  top:126px !important;
  right:40px !important;
  left:auto !important;
  bottom:auto !important;
  z-index:70 !important;
}
.v07-poster-rail-wrap {
  flex:0 0 336px !important;
  min-height:336px !important;
  padding:18px 0 0 !important;
  overflow:hidden !important;
}
.v07-poster-rail {
  height:320px !important;
  padding:8px 0 10px !important;
  overflow:hidden !important;
}
.v07-poster-card {
  flex:0 0 184px !important;
  width:184px !important;
  min-width:184px !important;
  height:298px !important;
  margin:0 14px 0 0 !important;
}
.v07-poster-thumb { height:256px !important; }
.v07-poster-title {
  left:12px !important;
  right:12px !important;
  bottom:9px !important;
  font-size:14px !important;
}
.v07-favorite-mark,
.v07-poster-card .favorite-badge { right:10px !important; top:10px !important; }


/* ========================================================================
   v0.7.0 focus routing + category wheel + poster rail tuning
   ======================================================================== */
.v07-category-wheel.category-list {
  padding:0 !important;
  overflow:hidden !important;
}
.v07-category-wheel.category-list:before,
.v07-category-wheel.category-list:after {
  height:26px !important;
}
.v07-wheel-viewport {
  inset:0 !important;
}
.v07-wheel-slot.category-button,
.v07-wheel-slot.category-button.active,
.v07-wheel-slot.v07-wheel-center,
.v07-wheel-slot.v07-wheel-center.active,
.v07-wheel-slot.v07-wheel-center:focus,
.v07-wheel-slot.v07-wheel-center.is-focused {
  left:8px !important;
  right:8px !important;
  width:calc(100% - 16px) !important;
  min-width:calc(100% - 16px) !important;
  box-sizing:border-box !important;
  justify-content:center !important;
  text-align:center !important;
  height:84px !important;
  min-height:84px !important;
  max-height:84px !important;
  margin:-42px 0 0 !important;
}
.v07-wheel-slot[data-wheel-offset="-3"] { opacity:.14 !important; transform:translateY(-318px) scale(.83) !important; }
.v07-wheel-slot[data-wheel-offset="-2"] { opacity:.30 !important; transform:translateY(-212px) scale(.90) !important; }
.v07-wheel-slot[data-wheel-offset="-1"] { opacity:.58 !important; transform:translateY(-106px) scale(.96) !important; }
.v07-wheel-slot[data-wheel-offset="0"] { transform:translateY(0) scale(1) !important; }
.v07-wheel-slot[data-wheel-offset="1"] { opacity:.58 !important; transform:translateY(106px) scale(.96) !important; }
.v07-wheel-slot[data-wheel-offset="2"] { opacity:.30 !important; transform:translateY(212px) scale(.90) !important; }
.v07-wheel-slot[data-wheel-offset="3"] { opacity:.14 !important; transform:translateY(318px) scale(.83) !important; }
.v07-wheel-slot .v07-wheel-label {
  width:100% !important;
  text-align:center !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long { font-size:18px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong { font-size:16px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label { font-size:22px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long { font-size:19px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong { font-size:17px !important; }
.v07-wheel-hint { bottom:6px !important; }

.v07-poster-rail-wrap {
  flex:0 0 374px !important;
  min-height:374px !important;
  padding:14px 0 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  height:354px !important;
  padding:8px 0 8px !important;
  overflow:visible !important;
}
.v07-poster-card {
  flex:0 0 168px !important;
  width:168px !important;
  min-width:168px !important;
  height:324px !important;
  margin:0 12px 0 0 !important;
  overflow:visible !important;
  z-index:1 !important;
}
.v07-poster-thumb { height:282px !important; }
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  z-index:26 !important;
  outline:3px solid rgba(var(--accent-rgb),.95) !important;
  outline-offset:0 !important;
  box-shadow:0 0 0 4px rgba(var(--accent-rgb),.22), 0 16px 34px rgba(0,0,0,.40) !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:20px;
  border:2px solid rgba(255,255,255,.22);
  pointer-events:none;
  z-index:30;
}
.v07-poster-title {
  font-size:13px !important;
  z-index:2 !important;
}


/* ========================================================================
   v0.7.0 search spacing + home up-nav tune + 8-card rail polish
   ======================================================================== */
.v07-browser-tools {
  gap:28px !important;
}
.v07-search-wrap {
  width:420px !important;
  flex:0 0 420px !important;
}
.v07-browser-tools .result-count {
  margin-left:6px !important;
  min-width:168px !important;
}

.v07-poster-rail-wrap {
  flex:0 0 392px !important;
  min-height:392px !important;
  padding:12px 0 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  height:372px !important;
  padding:6px 0 10px !important;
  overflow:visible !important;
}
.v07-poster-card {
  flex:0 0 148px !important;
  width:148px !important;
  min-width:148px !important;
  height:326px !important;
  margin:0 9px 0 0 !important;
  overflow:visible !important;
  border-radius:22px !important;
}
.v07-poster-thumb {
  height:282px !important;
  border-radius:18px 18px 0 0 !important;
}
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  z-index:26 !important;
  outline:none !important;
  border-radius:22px !important;
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.96), 0 0 0 7px rgba(var(--accent-rgb),.16), 0 18px 36px rgba(0,0,0,.42) !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  inset:0 !important;
  border-radius:22px !important;
  border:2px solid rgba(255,255,255,.18) !important;
}
.v07-poster-title {
  left:10px !important;
  right:10px !important;
  bottom:8px !important;
  font-size:13px !important;
}


/* ========================================================================
   v0.7.0 back-key flow + search spacing + larger poster cards
   ======================================================================== */
.v07-browser-tools {
  gap:44px !important;
}
.v07-search-wrap {
  width:392px !important;
  flex:0 0 392px !important;
}
.v07-browser-tools .result-count {
  margin-left:18px !important;
  padding-left:10px !important;
  min-width:184px !important;
}

.v07-poster-rail-wrap {
  flex:0 0 418px !important;
  min-height:418px !important;
  padding:10px 0 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  height:398px !important;
  padding:4px 0 12px !important;
  overflow:visible !important;
}
.v07-poster-card {
  flex:0 0 160px !important;
  width:160px !important;
  min-width:160px !important;
  height:348px !important;
  margin:0 10px 0 0 !important;
  overflow:visible !important;
  border-radius:22px !important;
}
.v07-poster-thumb {
  height:304px !important;
  border-radius:18px 18px 0 0 !important;
}
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  z-index:28 !important;
  border-radius:22px !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  inset:0 !important;
  border-radius:22px !important;
}
.v07-poster-title {
  left:10px !important;
  right:10px !important;
  bottom:10px !important;
  font-size:13px !important;
}


/* ========================================================================
   v0.7.0 larger Movies/Series cards + stable favorite focus
   ======================================================================== */
.v07-browser-tools {
  gap:56px !important;
}
.v07-search-wrap {
  width:404px !important;
  flex:0 0 404px !important;
}
.v07-browser-tools .result-count {
  margin-left:24px !important;
  padding-left:14px !important;
  min-width:196px !important;
}

.v07-poster-rail-wrap {
  flex:0 0 452px !important;
  min-height:452px !important;
  padding:8px 0 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  height:430px !important;
  padding:2px 0 14px !important;
  overflow:visible !important;
  align-items:flex-start !important;
}
.v07-poster-card {
  flex:0 0 176px !important;
  width:176px !important;
  min-width:176px !important;
  height:382px !important;
  margin:0 12px 0 0 !important;
  border-radius:22px !important;
  overflow:visible !important;
  transform:none !important;
  opacity:1 !important;
}
.v07-poster-thumb {
  height:332px !important;
  border-radius:18px 18px 0 0 !important;
}
.v07-poster-card.selected {
  transform:none !important;
  opacity:1 !important;
}
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  z-index:28 !important;
  transform:none !important;
  opacity:1 !important;
  border-radius:22px !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  inset:0 !important;
  border-radius:22px !important;
}
.v07-poster-title {
  left:10px !important;
  right:10px !important;
  bottom:10px !important;
  font-size:13px !important;
  line-height:1.2 !important;
}


/* ========================================================================
   v0.7.0 poster rail fully fills space + titleless cards
   ======================================================================== */
.v07-media-hero {
  flex:0 0 372px !important;
  min-height:372px !important;
  height:372px !important;
}
.v07-media-hero-inner {
  grid-template-columns:206px minmax(0,1fr) !important;
  gap:26px !important;
  padding:18px 30px !important;
}
.v07-hero-poster {
  width:188px !important;
  height:282px !important;
  border-radius:18px !important;
}
.v07-hero-copy h2 {
  font-size:40px !important;
  line-height:1.04 !important;
}
.v07-hero-copy p {
  max-height:74px !important;
  margin:0 0 14px !important;
  font-size:17px !important;
  line-height:1.42 !important;
}
.v07-browser-tools {
  gap:68px !important;
}
.v07-search-wrap {
  width:404px !important;
  flex:0 0 404px !important;
}
.v07-browser-tools .result-count {
  margin-left:28px !important;
  padding-left:16px !important;
  min-width:208px !important;
}
.v07-poster-rail-wrap {
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  padding:16px 0 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  width:100% !important;
  height:458px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
  grid-auto-rows:1fr !important;
  gap:16px !important;
  align-items:stretch !important;
  justify-items:stretch !important;
  overflow:visible !important;
}
.v07-poster-card {
  position:relative !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:22px !important;
  overflow:visible !important;
  transform:none !important;
  opacity:1 !important;
}
.v07-poster-thumb {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  border-radius:22px !important;
  overflow:hidden !important;
}
.v07-poster-thumb img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.v07-poster-title {
  display:none !important;
}
.v07-poster-card.selected,
.v07-poster-card:focus,
.v07-poster-card.is-focused {
  transform:none !important;
  opacity:1 !important;
  z-index:28 !important;
  border-radius:22px !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  inset:0 !important;
  border-radius:22px !important;
}
.v07-poster-card .v07-favorite-mark,
.v07-poster-card .favorite-badge {
  right:10px !important;
  top:10px !important;
}


/* ========================================================================
   v0.7.0 epg readability + text-only hero + poster focus polish
   ======================================================================== */
.v07-guide-stage,
.v07-guide,
.v07-guide-rows,
.v07-guide-row,
.v07-program-track {
  overflow:visible !important;
}
.v07-program {
  padding:18px 18px !important;
  border-radius:16px !important;
}
.v07-program strong {
  font-size:20px !important;
  line-height:1.24 !important;
}
.v07-program span {
  margin-top:8px !important;
  font-size:15px !important;
  line-height:1.25 !important;
}
.v07-no-guide {
  font-size:17px !important;
}

.v07-media-hero {
  flex:0 0 356px !important;
  min-height:356px !important;
  height:356px !important;
}
.v07-hero-backdrop {
  inset:-18px !important;
  opacity:.42 !important;
  filter:blur(2px) saturate(.98) !important;
  transform:scale(1.045) !important;
}
.v07-hero-scrim {
  background:
    linear-gradient(90deg, rgba(4,8,11,.92) 0%, rgba(4,8,11,.82) 34%, rgba(4,8,11,.50) 72%, rgba(4,8,11,.74) 100%),
    linear-gradient(0deg, rgba(4,8,11,.60), rgba(4,8,11,.18) 52%, rgba(4,8,11,.42) 100%) !important;
}
.v07-media-hero-inner,
.v07-media-hero-inner--textonly {
  grid-template-columns:minmax(0,1fr) !important;
  gap:0 !important;
  padding:26px 34px !important;
  align-items:center !important;
}
.v07-hero-poster {
  display:none !important;
}
.v07-hero-copy {
  max-width:1120px !important;
}
.v07-hero-kicker {
  font-size:16px !important;
  margin-bottom:12px !important;
}
.v07-hero-copy h2 {
  font-size:44px !important;
  line-height:1.08 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
.v07-meta-row {
  min-height:42px !important;
  margin:16px 0 14px !important;
}
.v07-meta-chip {
  min-height:30px !important;
  font-size:15px !important;
}
.v07-hero-copy p {
  max-width:980px !important;
  max-height:96px !important;
  margin:0 0 18px !important;
  font-size:19px !important;
  line-height:1.5 !important;
}
.v07-hero-actions .primary-button,
.v07-hero-actions .secondary-button {
  min-height:50px !important;
  font-size:18px !important;
}

.v07-poster-rail-wrap {
  padding:18px 8px 6px 0 !important;
  overflow:visible !important;
}
.v07-poster-rail {
  height:466px !important;
  gap:16px !important;
  padding:2px 8px 4px 2px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
.v07-poster-card,
.v07-poster-thumb,
.v07-poster-card.selected,
.v07-poster-card:focus,
.v07-poster-card.is-focused,
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  border-radius:24px !important;
}
.v07-poster-card:focus::after,
.v07-poster-card.is-focused::after {
  inset:-1px !important;
}


/* ========================================================================
   v0.7.0 stable EPG scroll + split hero + larger category labels
   ======================================================================== */
.v07-guide { overflow:hidden !important; }
.v07-guide-rows {
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  contain:layout paint !important;
}
.v07-guide-row {
  flex:1 1 0 !important;
  height:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.v07-program-track {
  min-width:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.v07-station {
  height:100% !important;
  min-height:0 !important;
  transform:none !important;
}

.v07-media-hero {
  flex:0 0 356px !important;
  min-height:356px !important;
  height:356px !important;
}
.v07-media-hero-inner,
.v07-media-hero-inner--split {
  display:grid !important;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr) !important;
  gap:42px !important;
  align-items:stretch !important;
  padding:30px 38px !important;
  box-sizing:border-box !important;
}
.v07-hero-primary {
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
.v07-hero-primary h2 {
  margin:0 !important;
  color:var(--text) !important;
  font-size:45px !important;
  line-height:1.06 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
}
.v07-hero-primary .v07-meta-row {
  min-height:42px !important;
  margin:18px 0 24px !important;
}
.v07-hero-primary .v07-hero-actions {
  margin-top:auto !important;
  padding-top:8px !important;
}
.v07-hero-description {
  min-width:0 !important;
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  padding:18px 0 18px 30px !important;
  box-sizing:border-box !important;
  border-left:1px solid rgba(255,255,255,.08) !important;
}
.v07-hero-description p {
  width:100% !important;
  max-width:none !important;
  max-height:270px !important;
  margin:0 !important;
  color:#cbd5d8 !important;
  font-size:20px !important;
  line-height:1.5 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:9 !important;
}
.v07-hero-kicker { display:none !important; }

.v07-wheel-slot .v07-wheel-label {
  font-size:24px !important;
  line-height:1.12 !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long { font-size:21px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong { font-size:19px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  font-size:27px !important;
  font-weight:840 !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long { font-size:23px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong { font-size:20px !important; }


/* ========================================================================
   v0.7.0 single-click wheel activation + readability pass
   ======================================================================== */
.v07-wheel-hint {
  display:none !important;
}
.v07-wheel-slot .v07-wheel-label {
  font-size:26px !important;
  line-height:1.1 !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long { font-size:23px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong { font-size:21px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  font-size:30px !important;
  font-weight:850 !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long { font-size:26px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong { font-size:23px !important; }

.v07-program strong {
  font-size:22px !important;
  line-height:1.24 !important;
}
.v07-program span {
  margin-top:9px !important;
  font-size:17px !important;
  line-height:1.28 !important;
}
.v07-no-guide {
  font-size:18px !important;
}

.v07-hero-primary .v07-meta-row {
  min-height:46px !important;
  margin:18px 0 22px !important;
}
.v07-meta-chip {
  min-height:34px !important;
  padding:0 14px !important;
  font-size:17px !important;
}
.v07-hero-description p {
  font-size:22px !important;
  line-height:1.55 !important;
}
.v07-hero-actions .primary-button,
.v07-hero-actions .secondary-button {
  min-height:58px !important;
  height:58px !important;
  padding:0 26px !important;
  font-size:20px !important;
}
.v07-action-icon {
  flex:0 0 24px;
  width:24px;
  height:24px;
  margin-right:11px;
}

/* ========================================================================
   v0.7.0 category wheel font revert
   ======================================================================== */
.v07-wheel-slot .v07-wheel-label {
  font-size:24px !important;
  line-height:1.12 !important;
}
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-long { font-size:21px !important; }
.v07-wheel-slot .v07-wheel-label.v07-wheel-label-xlong { font-size:19px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  font-size:27px !important;
  font-weight:840 !important;
}
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long { font-size:23px !important; }
.v07-wheel-slot.v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
.v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong { font-size:20px !important; }


/* ========================================================================
   v0.7.0 provider retention + top-nav search + favorites sort
   ======================================================================== */
.v07-search-nav {
  width:60px !important;
  min-width:60px !important;
  height:60px !important;
  padding:0 !important;
  margin-left:14px !important;
  border-radius:18px !important;
  font-size:0 !important;
  transform:none !important;
}
.v07-search-nav .nav-icon {
  display:grid !important;
  place-items:center !important;
  width:31px !important;
  height:31px !important;
  margin:0 !important;
}
.v07-search-nav .v07-search-svg {
  width:29px !important;
  height:29px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.9 !important;
  stroke-linecap:round !important;
}
.v07-search-nav.has-query:after {
  content:"";
  position:absolute;
  width:8px;
  height:8px;
  right:8px;
  top:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px var(--glow);
}

.v07-browser-tools {
  justify-content:flex-start !important;
  gap:28px !important;
}
.v07-browser-tools .result-count {
  order:1 !important;
  margin:0 !important;
  padding:0 !important;
  min-width:180px !important;
  max-width:260px !important;
}
.v07-browser-tools .v07-tool-left {
  order:2 !important;
  margin:0 !important;
  min-width:240px !important;
}
.v07-browser-tools > .v07-search-wrap {
  display:none !important;
}

.v07-search-overlay {
  position:absolute;
  z-index:500;
  inset:112px 0 0 0;
  background:rgba(2,6,9,.52);
}
.v07-search-popover {
  position:absolute;
  top:24px;
  left:50%;
  transform:translateX(-50%);
  width:720px;
  padding:26px;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:rgba(10,17,21,.97);
  box-shadow:0 28px 72px rgba(0,0,0,.48), inset 0 0 0 1px rgba(var(--accent-rgb),.08);
}
.v07-search-popover-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:20px;
}
.v07-search-popover-head > div {
  display:flex;
  flex-direction:column;
  gap:6px;
}
.v07-search-popover-head strong {
  font-size:27px;
}
.v07-search-popover-head span,
.v07-search-scope {
  color:var(--muted);
  font-size:16px;
}
.v07-search-close {
  width:48px;
  height:48px;
  border-radius:15px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:var(--text);
  font-size:30px;
}
.v07-search-input-wrap {
  position:relative;
  width:100%;
}
.v07-search-input-wrap .v07-search-icon {
  position:absolute;
  left:19px;
  top:50%;
  transform:translateY(-50%);
  width:27px;
  height:27px;
  pointer-events:none;
}
.v07-search-input-wrap .v07-search-svg {
  width:27px;
  height:27px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
}
.v07-search-input-wrap .search-box {
  width:100% !important;
  height:66px !important;
  padding:0 22px 0 58px !important;
  box-sizing:border-box;
  border-radius:20px !important;
  font-size:22px !important;
}
.v07-search-scope {
  margin-top:14px;
}

.v07-favorite-sort-option {
  min-width:280px;
  height:64px;
  padding:0 18px;
  margin-right:14px;
  display:flex;
  align-items:center;
  gap:13px;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  background:rgba(255,255,255,.04);
}
.v07-favorite-sort-option input {
  width:24px;
  height:24px;
  accent-color:var(--accent);
}
.v07-favorite-sort-option span {
  display:flex;
  flex-direction:column;
  gap:3px;
}
.v07-favorite-sort-option strong {
  font-size:18px;
}
.v07-favorite-sort-option small {
  color:var(--muted);
  font-size:13px;
}
#reorderFavoriteItems[disabled] {
  opacity:.38 !important;
}


/* ========================================================================
   v0.7.0 viewport-fixed search dialog
   ======================================================================== */
.v07-search-overlay {
  position:fixed !important;
  z-index:10000 !important;
  inset:0 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:132px 48px 40px !important;
  box-sizing:border-box !important;
  background:rgba(2,6,9,.62) !important;
}
.v07-search-popover {
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
  width:720px !important;
  max-width:calc(100vw - 96px) !important;
  min-height:0 !important;
  margin:0 !important;
  padding:24px 26px 22px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  border-radius:26px !important;
  background:rgba(10,17,21,.985) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 26px 68px rgba(0,0,0,.56), inset 0 0 0 1px rgba(var(--accent-rgb),.10) !important;
}
.v07-search-popover-head {
  min-height:54px !important;
  margin:0 0 18px !important;
}
.v07-search-input-wrap {
  position:relative !important;
  width:100% !important;
  height:62px !important;
  min-height:62px !important;
  margin:0 !important;
}
.v07-search-input-wrap .search-box {
  display:block !important;
  position:relative !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:62px !important;
  min-height:62px !important;
  margin:0 !important;
  padding:0 22px 0 58px !important;
  box-sizing:border-box !important;
  border-radius:18px !important;
  font-size:21px !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.v07-search-input-wrap .search-box:focus {
  transform:none !important;
}
.v07-search-scope {
  margin:12px 2px 0 !important;
  font-size:15px !important;
}


/* ========================================================================
   v0.7.0 webOS keyboard-safe search viewport anchoring
   ======================================================================== */
.v07-search-overlay {
  position:absolute !important;
  z-index:10000 !important;
  top:0;
  left:0;
  right:auto !important;
  bottom:auto !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:28px 48px 24px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  background:rgba(2,6,9,.68) !important;
}
.v07-search-popover {
  position:relative !important;
  flex:0 0 auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
  width:760px !important;
  max-width:calc(100% - 32px) !important;
  margin:0 auto !important;
  padding:24px 28px 22px !important;
  overflow:visible !important;
}
.v07-search-popover-head {
  min-height:50px !important;
  margin-bottom:16px !important;
}
.v07-search-input-wrap {
  height:64px !important;
  min-height:64px !important;
}
.v07-search-input-wrap .search-box {
  height:64px !important;
  min-height:64px !important;
  font-size:22px !important;
}

/* ========================================================================
   v0.7.0 immersive Movies / Series artwork treatment
   Full-bleed fanart, soft fades, lightweight poster focus, and art-first hero.
   ======================================================================== */
.catalog-movies .v07-media-stage,
.catalog-series .v07-media-stage {
  position:relative !important;
  isolation:isolate !important;
  overflow:visible !important;
}
.catalog-movies .v07-media-stage > :not(.v07-media-backdrop),
.catalog-series .v07-media-stage > :not(.v07-media-backdrop) {
  position:relative;
  z-index:2;
}

/* The provider backdrop becomes part of the page rather than a bounded hero. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  position:absolute;
  z-index:0;
  top:-12px;
  right:-4px;
  bottom:-30px;
  left:-76px;
  overflow:hidden;
  pointer-events:none;
  background:var(--bg);
}
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  position:absolute;
  z-index:0;
  top:-5%;
  right:-2%;
  bottom:-2%;
  left:15%;
  background-position:68% 28%;
  background-repeat:no-repeat;
  background-size:cover;
  opacity:0;
  transform:scale(1.025);
  filter:saturate(.94) contrast(1.035) brightness(.91);
  transition:opacity .24s ease-out !important;
  will-change:opacity;
}
.catalog-movies .v07-media-backdrop-layer.is-visible,
.catalog-series .v07-media-backdrop-layer.is-visible {
  opacity:.94;
}
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  position:absolute;
  z-index:1;
  inset:0;
  background:
    linear-gradient(90deg,
      var(--bg) 0%,
      rgba(4,8,11,.98) 15%,
      rgba(4,8,11,.90) 31%,
      rgba(4,8,11,.58) 47%,
      rgba(4,8,11,.18) 68%,
      rgba(4,8,11,.08) 100%),
    linear-gradient(0deg,
      var(--bg) 0%,
      rgba(4,8,11,.94) 12%,
      rgba(4,8,11,.56) 27%,
      rgba(4,8,11,.08) 52%,
      rgba(4,8,11,.14) 100%),
    linear-gradient(180deg,
      rgba(4,8,11,.72) 0%,
      rgba(4,8,11,.18) 17%,
      rgba(4,8,11,0) 38%);
}

/* Soften the category column on media pages; it fades into the artwork field. */
.catalog-movies .v07-category-wheel.category-list,
.catalog-series .v07-category-wheel.category-list {
  border:0 !important;
  border-radius:0 !important;
  background:linear-gradient(90deg,
    rgba(var(--panel-rgb),.42) 0%,
    rgba(var(--panel-rgb),.19) 64%,
    rgba(var(--panel-rgb),0) 100%) !important;
  box-shadow:none !important;
}
.catalog-movies .v07-wheel-slot[data-wheel-offset="0"],
.catalog-movies .v07-wheel-slot.v07-wheel-center,
.catalog-series .v07-wheel-slot[data-wheel-offset="0"],
.catalog-series .v07-wheel-slot.v07-wheel-center {
  border-color:rgba(var(--accent-rgb),.34) !important;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.14), rgba(var(--accent-rgb),.025)) !important;
  box-shadow:none !important;
}
.catalog-movies .v07-wheel-slot.v07-wheel-center:focus,
.catalog-movies .v07-wheel-slot.v07-wheel-center.is-focused,
.catalog-series .v07-wheel-slot.v07-wheel-center:focus,
.catalog-series .v07-wheel-slot.v07-wheel-center.is-focused {
  border-color:rgba(var(--accent-rgb),.82) !important;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.20), rgba(var(--accent-rgb),.045)) !important;
  box-shadow:inset 4px 0 0 rgba(var(--accent-rgb),.92) !important;
}

/* Compact tools float over the art instead of defining another row/panel. */
.catalog-movies .v07-browser-tools,
.catalog-series .v07-browser-tools {
  flex:0 0 54px !important;
  min-height:54px !important;
  height:54px !important;
  padding:0 4px 2px 2px !important;
  background:transparent !important;
}
.catalog-movies .v07-browser-tools .result-count,
.catalog-series .v07-browser-tools .result-count {
  top:0 !important;
  height:50px !important;
  color:rgba(226,235,238,.62) !important;
  font-size:15px !important;
  text-shadow:0 2px 12px rgba(0,0,0,.72);
}

/* Hero is now typography floating over the backdrop, not a card. */
.catalog-movies .v07-media-hero,
.catalog-series .v07-media-hero {
  flex:0 0 430px !important;
  min-height:430px !important;
  height:430px !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.catalog-movies .v07-media-hero-inner,
.catalog-movies .v07-media-hero-inner--immersive,
.catalog-series .v07-media-hero-inner,
.catalog-series .v07-media-hero-inner--immersive {
  width:100% !important;
  height:100% !important;
  display:flex !important;
  align-items:flex-end !important;
  padding:46px 32px 30px 30px !important;
  box-sizing:border-box !important;
}
.catalog-movies .v07-hero-primary,
.catalog-series .v07-hero-primary {
  width:58% !important;
  max-width:820px !important;
  min-width:0 !important;
  display:block !important;
  padding:0 !important;
  text-shadow:0 2px 20px rgba(0,0,0,.74);
}
.catalog-movies .v07-hero-primary h2,
.catalog-series .v07-hero-primary h2 {
  max-width:800px !important;
  margin:0 !important;
  color:#f4f7f8 !important;
  font-size:50px !important;
  line-height:1.02 !important;
  font-weight:900 !important;
  letter-spacing:-1.2px !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
}
.catalog-movies .v07-meta-row,
.catalog-series .v07-meta-row,
.catalog-movies .v07-hero-primary .v07-meta-row,
.catalog-series .v07-hero-primary .v07-meta-row {
  min-height:28px !important;
  height:auto !important;
  margin:14px 0 12px !important;
  display:flex !important;
  align-items:center !important;
  overflow:visible !important;
}
.catalog-movies .v07-meta-chip,
.catalog-series .v07-meta-chip {
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:rgba(235,241,243,.84) !important;
  font-size:16px !important;
  font-weight:760 !important;
  line-height:1.25 !important;
  text-shadow:0 2px 12px rgba(0,0,0,.70);
}
.catalog-movies .v07-meta-chip + .v07-meta-chip:before,
.catalog-series .v07-meta-chip + .v07-meta-chip:before {
  content:'\2022';
  margin:0 10px;
  color:rgba(235,241,243,.42);
}
.catalog-movies .v07-hero-description,
.catalog-series .v07-hero-description {
  width:100% !important;
  max-width:780px !important;
  height:auto !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
.catalog-movies .v07-hero-description p,
.catalog-series .v07-hero-description p {
  width:100% !important;
  max-width:780px !important;
  max-height:91px !important;
  margin:0 !important;
  color:rgba(226,234,237,.83) !important;
  font-size:19px !important;
  line-height:1.48 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  text-shadow:0 2px 16px rgba(0,0,0,.80);
}
.catalog-movies .v07-hero-actions,
.catalog-series .v07-hero-actions,
.catalog-movies .v07-hero-primary .v07-hero-actions,
.catalog-series .v07-hero-primary .v07-hero-actions {
  min-height:56px !important;
  height:56px !important;
  margin:20px 0 0 !important;
  padding:0 !important;
}
.catalog-movies .v07-hero-actions .primary-button,
.catalog-movies .v07-hero-actions .secondary-button,
.catalog-series .v07-hero-actions .primary-button,
.catalog-series .v07-hero-actions .secondary-button {
  min-height:54px !important;
  height:54px !important;
  padding:0 23px !important;
  border-radius:14px !important;
  font-size:18px !important;
  text-shadow:none !important;
  transition:transform .12s ease-out, box-shadow .12s ease-out, background .12s ease-out !important;
}
.catalog-movies .v07-hero-actions .secondary-button,
.catalog-series .v07-hero-actions .secondary-button {
  border:1px solid rgba(255,255,255,.08) !important;
  background:rgba(15,22,27,.54) !important;
  -webkit-backdrop-filter:blur(7px);
  backdrop-filter:blur(7px);
}
.catalog-movies .v07-hero-actions .primary-button:focus,
.catalog-movies .v07-hero-actions .secondary-button:focus,
.catalog-series .v07-hero-actions .primary-button:focus,
.catalog-series .v07-hero-actions .secondary-button:focus {
  transform:translateY(-2px) scale(1.025) !important;
  box-shadow:0 10px 30px rgba(0,0,0,.34), 0 0 0 2px rgba(var(--accent-rgb),.52) !important;
}

/* Keep the successful six-wide rail, but let the artwork itself be the card. */
.catalog-movies .v07-poster-rail-wrap,
.catalog-series .v07-poster-rail-wrap {
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  padding:8px 0 8px !important;
  overflow:visible !important;
}
.catalog-movies .v07-poster-rail,
.catalog-series .v07-poster-rail {
  width:calc(100% - 12px) !important;
  height:100% !important;
  min-height:360px !important;
  margin:0 6px !important;
  padding:8px 0 7px !important;
  display:grid !important;
  grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
  grid-auto-rows:1fr !important;
  gap:18px !important;
  align-items:stretch !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card {
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:18px !important;
  background:transparent !important;
  opacity:.73 !important;
  filter:saturate(.78) brightness(.82) !important;
  transform:translateY(0) scale(1) !important;
  transform-origin:center bottom !important;
  box-shadow:none !important;
  transition:transform .13s ease-out, opacity .13s ease-out, filter .13s ease-out, box-shadow .13s ease-out !important;
}
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected {
  opacity:.91 !important;
  filter:saturate(.96) brightness(.95) !important;
  transform:none !important;
  box-shadow:none !important;
}
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  z-index:30 !important;
  opacity:1 !important;
  filter:saturate(1.04) brightness(1.03) !important;
  transform:translateY(-5px) scale(1.045) !important;
  border:0 !important;
  box-shadow:0 18px 42px rgba(0,0,0,.48), 0 0 0 2px rgba(var(--accent-rgb),.72) !important;
}
.catalog-movies .v07-poster-card:focus::after,
.catalog-movies .v07-poster-card.is-focused::after,
.catalog-series .v07-poster-card:focus::after,
.catalog-series .v07-poster-card.is-focused::after {
  display:none !important;
  content:none !important;
}
.catalog-movies .v07-poster-thumb,
.catalog-series .v07-poster-thumb {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.025) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
.catalog-movies .v07-poster-thumb img,
.catalog-series .v07-poster-thumb img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  transform:scale(1.002);
}
.catalog-movies .v07-poster-card .v07-favorite-mark,
.catalog-series .v07-poster-card .v07-favorite-mark {
  top:9px !important;
  right:9px !important;
  opacity:.92 !important;
  text-shadow:0 2px 9px rgba(0,0,0,.88);
}

@media (prefers-reduced-motion: reduce) {
  .catalog-movies .v07-media-backdrop-layer,
  .catalog-series .v07-media-backdrop-layer,
  .catalog-movies .v07-poster-card,
  .catalog-series .v07-poster-card {
    transition:none !important;
  }
}

/* ========================================================================
   v0.7.0 Movies / Series immersive media refinement r2
   Full-stage fanart with edge fades, full-fidelity posters, stable backdrop
   swaps, and inline Movie detail metadata.
   ======================================================================== */

/* Fanart now covers the complete media stage. The image itself has no hard
   inset edge; layered scrims fade it into the app at all four boundaries. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  top:-20px !important;
  right:-2px !important;
  bottom:-18px !important;
  left:-18px !important;
  overflow:hidden !important;
  background:var(--bg) !important;
}
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  top:-4% !important;
  right:-3% !important;
  bottom:-4% !important;
  left:-3% !important;
  background-position:center 30% !important;
  background-size:cover !important;
  opacity:0 !important;
  transform:scale(1.015) !important;
  filter:saturate(.98) contrast(1.02) brightness(.94) !important;
  transition:opacity .22s ease-out !important;
  will-change:opacity !important;
}
.catalog-movies .v07-media-backdrop-layer.is-front,
.catalog-series .v07-media-backdrop-layer.is-front {
  z-index:1 !important;
}
.catalog-movies .v07-media-backdrop-layer.is-visible,
.catalog-series .v07-media-backdrop-layer.is-visible {
  opacity:1 !important;
}
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  z-index:2 !important;
  background:
    linear-gradient(90deg,
      var(--bg) 0%,
      rgba(4,8,11,.96) 9%,
      rgba(4,8,11,.82) 23%,
      rgba(4,8,11,.50) 38%,
      rgba(4,8,11,.18) 57%,
      rgba(4,8,11,.04) 76%,
      rgba(4,8,11,.12) 100%),
    linear-gradient(270deg,
      rgba(4,8,11,.70) 0%,
      rgba(4,8,11,.24) 4%,
      rgba(4,8,11,0) 11%),
    linear-gradient(0deg,
      var(--bg) 0%,
      rgba(4,8,11,.96) 6%,
      rgba(4,8,11,.68) 15%,
      rgba(4,8,11,.24) 27%,
      rgba(4,8,11,0) 43%),
    linear-gradient(180deg,
      rgba(4,8,11,.92) 0%,
      rgba(4,8,11,.55) 6%,
      rgba(4,8,11,.18) 15%,
      rgba(4,8,11,0) 28%) !important;
}

/* Posters stay at full artwork fidelity. Focus is communicated by movement,
   scale, and a restrained edge/shadow instead of dimming everything else. */
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card,
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected,
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  opacity:1 !important;
  filter:none !important;
}
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card {
  transition:transform .12s ease-out, box-shadow .12s ease-out !important;
}
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected {
  transform:translateY(0) scale(1) !important;
}
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  transform:translateY(-5px) scale(1.045) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.46), 0 0 0 2px rgba(var(--accent-rgb),.70) !important;
}

/* Movies no longer need a separate detail screen from the browse rail. Reserve
   a little more hero height and expose the rich get_vod_info facts inline. */
.catalog-movies .v07-media-hero {
  flex-basis:468px !important;
  min-height:468px !important;
  height:468px !important;
}
.catalog-movies .v07-media-hero-inner,
.catalog-movies .v07-media-hero-inner--immersive {
  padding-bottom:24px !important;
}
.catalog-movies .v07-hero-primary {
  width:64% !important;
  max-width:900px !important;
}
.catalog-movies .v07-hero-primary h2 {
  max-width:880px !important;
}
.catalog-movies .v07-hero-description,
.catalog-movies .v07-hero-description p {
  max-width:850px !important;
}
.catalog-movies .v07-hero-description p {
  max-height:82px !important;
  font-size:18px !important;
  line-height:1.42 !important;
  -webkit-line-clamp:3 !important;
}
.catalog-movies .v07-movie-facts {
  width:100% !important;
  max-width:870px !important;
  min-height:78px !important;
  margin:13px 0 0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  grid-auto-rows:minmax(18px,auto) !important;
  column-gap:24px !important;
  row-gap:5px !important;
  align-content:start !important;
}
.catalog-movies .v07-movie-fact {
  min-width:0 !important;
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important;
  font-size:14px !important;
  line-height:1.25 !important;
  text-shadow:0 2px 12px rgba(0,0,0,.78);
}
.catalog-movies .v07-movie-fact--wide {
  grid-column:1 / -1 !important;
}
.catalog-movies .v07-movie-fact > span {
  flex:0 0 auto !important;
  color:rgba(196,210,216,.56) !important;
  font-size:11px !important;
  font-weight:850 !important;
  letter-spacing:.7px !important;
  text-transform:uppercase !important;
}
.catalog-movies .v07-movie-fact > strong {
  min-width:0 !important;
  color:rgba(235,241,243,.86) !important;
  font-weight:650 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.catalog-movies .v07-hero-actions {
  margin-top:14px !important;
}

@media (prefers-reduced-motion: reduce) {
  .catalog-movies .v07-media-backdrop-layer,
  .catalog-series .v07-media-backdrop-layer {
    transition:none !important;
  }
}


/* ========================================================================
   v0.7.0 Movies / Series immersive media refinement r4
   Supersedes r3. Natural edge fade + stable overlap-preserving poster rail.
   ======================================================================== */

/* Ambient fanart: lower overall intensity and deliberately fade every edge
   back to the application background. This is an overlay treatment, not a
   hard-edged image panel. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  top:-28px !important;
  right:-18px !important;
  bottom:-34px !important;
  left:-24px !important;
  overflow:hidden !important;
  background:var(--bg) !important;
}
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  top:-6% !important;
  right:-5% !important;
  bottom:-6% !important;
  left:-5% !important;
  background-position:center 32% !important;
  background-size:cover !important;
  filter:saturate(.91) contrast(1.01) brightness(.78) !important;
  transform:scale(1.035) !important;
  transition:opacity .20s ease-out !important;
}
.catalog-movies .v07-media-backdrop-layer.is-visible,
.catalog-series .v07-media-backdrop-layer.is-visible {
  opacity:.80 !important;
}
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  z-index:3 !important;
  background:
    linear-gradient(90deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.97) 12%,
      rgba(4,8,11,.84) 27%,
      rgba(4,8,11,.58) 43%,
      rgba(4,8,11,.28) 60%,
      rgba(4,8,11,.10) 76%,
      rgba(4,8,11,.20) 100%),
    linear-gradient(270deg,
      rgba(4,8,11,.82) 0%,
      rgba(4,8,11,.44) 5%,
      rgba(4,8,11,.12) 11%,
      rgba(4,8,11,0) 18%),
    linear-gradient(0deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.96) 8%,
      rgba(4,8,11,.72) 18%,
      rgba(4,8,11,.36) 31%,
      rgba(4,8,11,.10) 45%,
      rgba(4,8,11,0) 60%),
    linear-gradient(180deg,
      rgba(4,8,11,.94) 0%,
      rgba(4,8,11,.64) 7%,
      rgba(4,8,11,.26) 17%,
      rgba(4,8,11,.06) 29%,
      rgba(4,8,11,0) 42%) !important;
}
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::after {
  content:'';
  position:absolute;
  z-index:2;
  inset:-2px;
  pointer-events:none;
  box-shadow:inset 0 0 115px 52px rgba(4,8,11,.62);
}

/* Rail: keep images fully opaque and avoid giving every card its own forced
   compositor layer. Only the newly-entering edge poster is created when the
   six-card window advances. */
.catalog-movies .v07-poster-rail-wrap,
.catalog-series .v07-poster-rail-wrap {
  overflow:visible !important;
}
.catalog-movies .v07-poster-rail,
.catalog-series .v07-poster-rail {
  contain:none !important;
  transform:none !important;
}
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card,
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected,
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  opacity:1 !important;
  filter:none !important;
  backface-visibility:visible !important;
  will-change:auto !important;
}
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card {
  transform:none !important;
  transition:transform .10s ease-out, box-shadow .10s ease-out !important;
}
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected {
  transform:none !important;
  box-shadow:none !important;
}
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  transform:translateY(-4px) scale(1.022) !important;
  box-shadow:0 16px 34px rgba(0,0,0,.42), 0 0 0 2px rgba(var(--accent-rgb),.70) !important;
}
.catalog-movies .v07-poster-thumb,
.catalog-series .v07-poster-thumb,
.catalog-movies .v07-poster-thumb img,
.catalog-series .v07-poster-thumb img {
  transform:none !important;
  transition:none !important;
  backface-visibility:visible !important;
}



/* ========================================================================
   v0.7.0 Movies / Series immersive media refinement r5
   Single-layer backdrop rendering for webOS compositor stability, plus a
   true overscanned/faded ambient canvas with no visible media-stage border.
   ======================================================================== */

/* Keep all interactive content on an unequivocally higher paint plane. */
.catalog-movies .v07-media-stage,
.catalog-series .v07-media-stage {
  isolation:isolate !important;
}
.catalog-movies .v07-media-stage > :not(.v07-media-backdrop),
.catalog-series .v07-media-stage > :not(.v07-media-backdrop) {
  position:relative !important;
  z-index:10 !important;
}
.catalog-movies .v07-poster-rail-wrap,
.catalog-series .v07-poster-rail-wrap {
  position:relative !important;
  z-index:20 !important;
}

/* The ambient canvas deliberately overscans far to the left, above and below
   the media stage. The left overscan carries the artwork underneath the
   translucent category area so there is no rectangular "start of backdrop".
   The library itself remains the outer clip boundary. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  z-index:-1 !important;
  top:-82px !important;
  right:-54px !important;
  bottom:-58px !important;
  left:-338px !important;
  overflow:hidden !important;
  background:var(--bg) !important;
  pointer-events:none !important;
}

/* r5 intentionally uses ONE non-animated background layer. No opacity
   transition, transform, filter, blur or will-change: all of those can create
   a promoted full-screen surface on older LG webOS Chromium builds. */
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  position:absolute !important;
  inset:-2% !important;
  z-index:0 !important;
  background-position:center 30% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  opacity:0 !important;
  transform:none !important;
  filter:none !important;
  transition:none !important;
  will-change:auto !important;
}
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="b"],
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="b"] {
  display:none !important;
}
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.70 !important;
}

/* Darkening is done entirely with static overlays, not CSS filters on the
   image. This keeps white metadata readable even when fanart is mostly white.
   Each edge reaches the actual app background gradually rather than ending at
   a visible rectangle. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  position:absolute !important;
  z-index:2 !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(90deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.98) 8%,
      rgba(4,8,11,.90) 18%,
      rgba(4,8,11,.70) 31%,
      rgba(4,8,11,.43) 45%,
      rgba(4,8,11,.23) 59%,
      rgba(4,8,11,.13) 73%,
      rgba(4,8,11,.18) 100%),
    linear-gradient(270deg,
      rgba(4,8,11,.78) 0%,
      rgba(4,8,11,.50) 4%,
      rgba(4,8,11,.24) 9%,
      rgba(4,8,11,.08) 15%,
      rgba(4,8,11,0) 22%),
    linear-gradient(0deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.98) 7%,
      rgba(4,8,11,.86) 15%,
      rgba(4,8,11,.58) 25%,
      rgba(4,8,11,.30) 36%,
      rgba(4,8,11,.10) 49%,
      rgba(4,8,11,0) 63%),
    linear-gradient(180deg,
      rgba(4,8,11,.96) 0%,
      rgba(4,8,11,.78) 6%,
      rgba(4,8,11,.47) 14%,
      rgba(4,8,11,.20) 23%,
      rgba(4,8,11,.06) 33%,
      rgba(4,8,11,0) 44%),
    linear-gradient(rgba(4,8,11,.14), rgba(4,8,11,.14)) !important;
}
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::after {
  content:'' !important;
  position:absolute !important;
  z-index:3 !important;
  inset:0 !important;
  pointer-events:none !important;
  box-shadow:none !important;
  background:
    radial-gradient(ellipse at center,
      rgba(4,8,11,0) 48%,
      rgba(4,8,11,.10) 65%,
      rgba(4,8,11,.35) 82%,
      rgba(4,8,11,.72) 100%) !important;
}

/* Rail stability: retain r4's overlap-preserving DOM behavior, but make the
   focus treatment paint-only. Scaling a large image grid can also trigger
   unnecessary layer promotion on webOS, so focus no longer transforms cards. */
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card,
.catalog-movies .v07-poster-card.selected,
.catalog-series .v07-poster-card.selected,
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
  transition:box-shadow .08s linear !important;
  will-change:auto !important;
}
.catalog-movies .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card:focus,
.catalog-series .v07-poster-card.is-focused {
  z-index:30 !important;
  box-shadow:0 14px 30px rgba(0,0,0,.44), 0 0 0 3px rgba(var(--accent-rgb),.88) !important;
}
.catalog-movies .v07-poster-thumb,
.catalog-series .v07-poster-thumb,
.catalog-movies .v07-poster-thumb img,
.catalog-series .v07-poster-thumb img {
  transform:none !important;
  filter:none !important;
  transition:none !important;
  will-change:auto !important;
}



/* ========================================================================
   v0.7.0 Movies / Series immersive media refinement r6
   Constrain fanart to the main content canvas and fade it naturally before
   the poster rail. r5 compositor/rail stability behavior is intentionally
   untouched.
   ======================================================================== */

/* r6: the backdrop belongs only to the right-hand media canvas. It must not
   bleed underneath the category wheel. It also ends above the poster rail,
   where its bottom gradient reaches the application background. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  z-index:-1 !important;
  left:0 !important;
  right:0 !important;
  bottom:auto !important;
  top:-10px !important;
  overflow:hidden !important;
  background:var(--bg) !important;
  pointer-events:none !important;
}
.catalog-movies .v07-media-backdrop {
  height:548px !important;
}
.catalog-series .v07-media-backdrop {
  height:510px !important;
}

/* Keep the image static for the webOS flicker fix. A small overscan only
   inside the media canvas prevents the source bitmap's own edge from ever
   becoming visible while preserving the category column boundary. */
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  position:absolute !important;
  top:-3% !important;
  right:-2% !important;
  bottom:-3% !important;
  left:-2% !important;
  z-index:0 !important;
  background-position:center 28% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  opacity:0 !important;
  transform:none !important;
  filter:none !important;
  transition:none !important;
  will-change:auto !important;
}
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.72 !important;
}

/* Four independent directional fades make the backdrop read as ambient art
   instead of a rectangular image. The bottom becomes fully opaque before the
   poster rail so poster artwork always sits on the normal dark app canvas. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  position:absolute !important;
  z-index:2 !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    /* left edge: category wheel -> hero art */
    linear-gradient(90deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.93) 4%,
      rgba(4,8,11,.67) 10%,
      rgba(4,8,11,.35) 17%,
      rgba(4,8,11,.14) 25%,
      rgba(4,8,11,0) 36%),
    /* right edge */
    linear-gradient(270deg,
      rgba(4,8,11,.96) 0%,
      rgba(4,8,11,.68) 3%,
      rgba(4,8,11,.34) 7%,
      rgba(4,8,11,.10) 12%,
      rgba(4,8,11,0) 18%),
    /* top edge beneath navigation */
    linear-gradient(180deg,
      rgba(4,8,11,.98) 0%,
      rgba(4,8,11,.76) 5%,
      rgba(4,8,11,.39) 11%,
      rgba(4,8,11,.13) 18%,
      rgba(4,8,11,0) 27%),
    /* bottom edge: finish the fade before the poster rail */
    linear-gradient(0deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,1) 8%,
      rgba(4,8,11,.95) 16%,
      rgba(4,8,11,.74) 26%,
      rgba(4,8,11,.42) 38%,
      rgba(4,8,11,.16) 51%,
      rgba(4,8,11,0) 65%),
    /* global readability tint */
    linear-gradient(rgba(4,8,11,.18), rgba(4,8,11,.18)) !important;
}

/* Broad, subtle perimeter vignette. This is deliberately static; no filters,
   masks, opacity animations, or promoted compositor layers are introduced. */
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::after {
  content:'' !important;
  position:absolute !important;
  z-index:3 !important;
  inset:0 !important;
  pointer-events:none !important;
  box-shadow:none !important;
  background:
    radial-gradient(ellipse 84% 80% at 57% 43%,
      rgba(4,8,11,0) 44%,
      rgba(4,8,11,.05) 61%,
      rgba(4,8,11,.15) 75%,
      rgba(4,8,11,.34) 88%,
      rgba(4,8,11,.58) 100%) !important;
}

/* The rail is always rendered on the normal app background, never on fanart. */
.catalog-movies .v07-poster-rail-wrap,
.catalog-series .v07-poster-rail-wrap {
  background:var(--bg) !important;
}

/* ========================================================================
   v0.7.0 media redesign r7
   Stronger hero vignette and transparent no-art fallback.
   - backdrop fades are visibly stronger so bright art reads as ambient hero art
   - overlay is attached to the visible artwork layer itself
   - when no artwork is available, the hero falls back to the normal app background
   ======================================================================== */

/* Do not paint a dedicated hero box when no backdrop art is present. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  background:transparent !important;
}

/* Retire the r6 container-level scrim/vignette and move the treatment onto
   the visible art layer so absent art simply reveals the app background. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim,
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::after {
  display:none !important;
}

.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  background-color:transparent !important;
}

/* Slightly more opacity on real art so the new vignette still leaves the
   poster visible while keeping metadata readable. */
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.64 !important;
}

/* Strong, modern edge fading + soft readability tint applied only when a real
   visible layer is active. This keeps the hero ambient while avoiding a dark
   rectangle for items without provider fanart. */
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible::after,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible::after {
  content:'' !important;
  position:absolute !important;
  inset:-1px !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:
    /* left fade into category wheel boundary */
    linear-gradient(90deg,
      rgba(4,8,11,.96) 0%,
      rgba(4,8,11,.84) 6%,
      rgba(4,8,11,.60) 13%,
      rgba(4,8,11,.30) 21%,
      rgba(4,8,11,.10) 28%,
      rgba(4,8,11,0) 36%),
    /* right edge fade */
    linear-gradient(270deg,
      rgba(4,8,11,.96) 0%,
      rgba(4,8,11,.74) 5%,
      rgba(4,8,11,.42) 12%,
      rgba(4,8,11,.14) 19%,
      rgba(4,8,11,0) 27%),
    /* top fade beneath navigation */
    linear-gradient(180deg,
      rgba(4,8,11,.98) 0%,
      rgba(4,8,11,.82) 7%,
      rgba(4,8,11,.52) 15%,
      rgba(4,8,11,.22) 24%,
      rgba(4,8,11,0) 34%),
    /* bottom fade that completes before the poster rail */
    linear-gradient(0deg,
      rgba(4,8,11,1) 0%,
      rgba(4,8,11,.98) 8%,
      rgba(4,8,11,.88) 18%,
      rgba(4,8,11,.62) 30%,
      rgba(4,8,11,.28) 43%,
      rgba(4,8,11,.08) 54%,
      rgba(4,8,11,0) 64%),
    /* broad perimeter vignette */
    radial-gradient(ellipse 90% 82% at 58% 44%,
      rgba(4,8,11,0) 42%,
      rgba(4,8,11,.06) 60%,
      rgba(4,8,11,.16) 72%,
      rgba(4,8,11,.32) 86%,
      rgba(4,8,11,.56) 100%),
    /* global readability tint */
    linear-gradient(rgba(4,8,11,.24), rgba(4,8,11,.24)) !important;
}

/* ========================================================================
   v0.7.0 media redesign r8
   True alpha-edge vignette for Movies / Series hero artwork.

   Previous revisions darkened the perimeter but left the fanart bitmap fully
   opaque up to its rectangular bounds. r8 masks the artwork itself so the
   image becomes transparent into the app background at every hero edge.
   ======================================================================== */

/* The hero backdrop container remains transparent. The horizontal alpha mask
   is applied to the complete art canvas. Keeping this mask static preserves
   the flicker-free single-layer behavior introduced in r5. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  background:transparent !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.18) 2%,
    rgba(0,0,0,.52) 6%,
    rgba(0,0,0,.86) 11%,
    #000 17%,
    #000 84%,
    rgba(0,0,0,.90) 89%,
    rgba(0,0,0,.58) 94%,
    rgba(0,0,0,.20) 98%,
    transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.18) 2%,
    rgba(0,0,0,.52) 6%,
    rgba(0,0,0,.86) 11%,
    #000 17%,
    #000 84%,
    rgba(0,0,0,.90) 89%,
    rgba(0,0,0,.58) 94%,
    rgba(0,0,0,.20) 98%,
    transparent 100%) !important;
}

/* Remove all old overlay-style vignette elements. The visible fade now comes
   from real alpha transparency instead of painting a dark rectangle on top. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim,
.catalog-movies .v07-media-backdrop::before,
.catalog-series .v07-media-backdrop::before,
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::after,
.catalog-movies .v07-media-backdrop-layer::before,
.catalog-series .v07-media-backdrop-layer::before,
.catalog-movies .v07-media-backdrop-layer::after,
.catalog-series .v07-media-backdrop-layer::after {
  display:none !important;
  content:none !important;
}

/* The vertical mask fades the actual image through the top edge and reaches
   full transparency before the poster rail. Nested with the horizontal mask
   above, this produces a true four-edge vignette without mask-composite. */
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  background-color:rgba(4,8,11,.14) !important;
  background-blend-mode:multiply !important;
  -webkit-mask-image:linear-gradient(180deg,
    transparent 0%,
    rgba(0,0,0,.25) 3%,
    rgba(0,0,0,.62) 8%,
    rgba(0,0,0,.90) 14%,
    #000 20%,
    #000 66%,
    rgba(0,0,0,.90) 72%,
    rgba(0,0,0,.62) 79%,
    rgba(0,0,0,.30) 86%,
    rgba(0,0,0,.08) 92%,
    transparent 100%) !important;
  mask-image:linear-gradient(180deg,
    transparent 0%,
    rgba(0,0,0,.25) 3%,
    rgba(0,0,0,.62) 8%,
    rgba(0,0,0,.90) 14%,
    #000 20%,
    #000 66%,
    rgba(0,0,0,.90) 72%,
    rgba(0,0,0,.62) 79%,
    rgba(0,0,0,.30) 86%,
    rgba(0,0,0,.08) 92%,
    transparent 100%) !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  will-change:auto !important;
}

/* Bright fanart remains intentionally subdued behind white hero copy. */
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.62 !important;
}

/* No provider backdrop: no background, no overlay, no synthetic hero panel. */
.catalog-movies .v07-media-backdrop:not(.has-art),
.catalog-series .v07-media-backdrop:not(.has-art),
.catalog-movies .v07-media-backdrop:not(.has-art) .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop:not(.has-art) .v07-media-backdrop-layer {
  background:transparent !important;
  background-image:none !important;
  opacity:0 !important;
}

/* ========================================================================
   v0.7.0 media redesign r9
   Surface cleanup: transparent poster rail, simplified app ambience, and a
   borderless/backgroundless category wheel shared by Live TV / Movies / Series.
   ======================================================================== */

/* Keep the lower ambient hue, but remove the accent glow in the upper-right
   corner so the app canvas does not fight the hero artwork's alpha fade. */
#app {
  background:
    radial-gradient(circle at 42% 92%, rgba(var(--accent-rgb),.09), transparent 34%),
    linear-gradient(135deg, var(--bg) 0%, var(--bg-2) 56%, var(--bg-3) 100%) !important;
}

/* The poster rail is content, not a separate black panel. Let the shared app
   canvas show through behind and around every poster. */
.catalog-movies .v07-poster-rail-wrap,
.catalog-series .v07-poster-rail-wrap,
.catalog-movies .v07-poster-rail,
.catalog-series .v07-poster-rail {
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
}
.catalog-movies .v07-poster-rail-wrap::before,
.catalog-movies .v07-poster-rail-wrap::after,
.catalog-series .v07-poster-rail-wrap::before,
.catalog-series .v07-poster-rail-wrap::after,
.catalog-movies .v07-poster-rail::before,
.catalog-movies .v07-poster-rail::after,
.catalog-series .v07-poster-rail::before,
.catalog-series .v07-poster-rail::after {
  display:none !important;
  content:none !important;
}

/* One clean category-wheel language across Live TV, Movies, and Series.
   Remove all container chrome and top/bottom shading so the labels float on
   the same application canvas as the rest of the page. */
.v07-category-wheel.category-list {
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.v07-category-wheel.category-list::before,
.v07-category-wheel.category-list::after {
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
}

/* Remove the pill/panel treatment from every wheel slot, including the active
   center category. Focus is communicated through brighter typography instead
   of another rectangular surface. */
.v07-category-wheel .v07-wheel-slot.category-button,
.v07-category-wheel .v07-wheel-slot.category-button.active,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  background:transparent !important;
  background-image:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
.v07-category-wheel .v07-wheel-slot::before,
.v07-category-wheel .v07-wheel-slot::after {
  display:none !important;
  content:none !important;
}

.v07-category-wheel .v07-wheel-slot.v07-wheel-center .v07-wheel-label,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label {
  color:rgba(242,248,250,.96) !important;
  text-shadow:0 2px 12px rgba(0,0,0,.52) !important;
}
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus .v07-wheel-label,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused .v07-wheel-label {
  color:var(--accent) !important;
  text-shadow:0 0 14px rgba(var(--accent-rgb),.34), 0 2px 12px rgba(0,0,0,.62) !important;
}



/* ========================================================================
   v0.7.0 media polish r10
   Text-only top navigation, universal bottom-right favorite hint, and a
   compact Live TV guide header with the channel count in the first cell.
   ======================================================================== */

/* Primary top menu: text + active underline only. Remove the subtle pill /
   button surface and all focus chrome from Home, Live TV, Movies, and Series. */
.nav-item[data-view="home"],
.nav-item[data-view="live"],
.nav-item[data-view="movies"],
.nav-item[data-view="series"],
.nav-item[data-view="home"].active,
.nav-item[data-view="live"].active,
.nav-item[data-view="movies"].active,
.nav-item[data-view="series"].active,
.nav-item[data-view="home"]:focus,
.nav-item[data-view="live"]:focus,
.nav-item[data-view="movies"]:focus,
.nav-item[data-view="series"]:focus,
.nav-item[data-view="home"].is-focused,
.nav-item[data-view="live"].is-focused,
.nav-item[data-view="movies"].is-focused,
.nav-item[data-view="series"].is-focused {
  background:transparent !important;
  background-image:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
}
.nav-item[data-view="home"].active,
.nav-item[data-view="live"].active,
.nav-item[data-view="movies"].active,
.nav-item[data-view="series"].active {
  transform:scale(1) !important;
}
.nav-item[data-view="home"]:focus,
.nav-item[data-view="live"]:focus,
.nav-item[data-view="movies"]:focus,
.nav-item[data-view="series"]:focus,
.nav-item[data-view="home"].is-focused,
.nav-item[data-view="live"].is-focused,
.nav-item[data-view="movies"].is-focused,
.nav-item[data-view="series"].is-focused {
  transform:scale(1) !important;
  color:var(--text) !important;
}

/* Favorite hotkey hint lives in the shell's existing bottom safe area. Its
   compact 34px height remains below the main content's 42px bottom padding,
   so it does not cover the EPG or poster rail. */
.menu-hint {
  position:absolute !important;
  top:auto !important;
  left:auto !important;
  right:18px !important;
  bottom:4px !important;
  z-index:90 !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 10px !important;
  box-sizing:border-box !important;
  font-size:12px !important;
  transform:translateY(4px) !important;
}
.menu-hint.visible { transform:none !important; }
.menu-hint .menu-key {
  min-width:34px !important;
  height:20px !important;
  padding:0 6px !important;
  font-size:10px !important;
}
.menu-hint > * + * { margin-left:9px !important; }

/* Live TV no longer burns a standalone row on the channel count. The count
   occupies the existing first EPG header cell where CHANNEL used to be. */
.catalog-live .v07-guide-stage {
  padding-top:0 !important;
}
.catalog-live .v07-guide-header {
  margin-top:0 !important;
}
.catalog-live .v07-station-header {
  letter-spacing:1.2px !important;
  white-space:nowrap !important;
}



/* ========================================================================
   v0.7.0 Series detail redesign r11
   Reuses the browse-series artwork/metadata, preserves the true alpha-vignette
   language, and flattens seasons/episodes into the same modern visual system.
   ======================================================================== */

.v07-series-detail-page {
  padding:0 8px 92px 0 !important;
  background:transparent !important;
}

.v07-series-detail-hero {
  position:relative !important;
  min-height:430px !important;
  height:430px !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Two nested masks mirror the working r8 Movies/Series browse vignette. */
.v07-series-detail-backdrop {
  position:absolute !important;
  inset:-8px -8px -8px 0 !important;
  z-index:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
  background:transparent !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.26) 3%, rgba(0,0,0,.65) 8%, #000 15%,
    #000 86%, rgba(0,0,0,.72) 93%, rgba(0,0,0,.28) 98%, transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.26) 3%, rgba(0,0,0,.65) 8%, #000 15%,
    #000 86%, rgba(0,0,0,.72) 93%, rgba(0,0,0,.28) 98%, transparent 100%) !important;
}
.v07-series-detail-backdrop-art {
  position:absolute !important;
  inset:-4% -2% -5% -2% !important;
  background-position:center 28% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-color:rgba(4,8,11,.16) !important;
  background-blend-mode:multiply !important;
  opacity:.62 !important;
  transform:none !important;
  filter:none !important;
  transition:none !important;
  -webkit-mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.34) 4%, rgba(0,0,0,.76) 10%, #000 18%,
    #000 65%, rgba(0,0,0,.88) 72%, rgba(0,0,0,.56) 80%, rgba(0,0,0,.20) 90%, transparent 100%) !important;
  mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.34) 4%, rgba(0,0,0,.76) 10%, #000 18%,
    #000 65%, rgba(0,0,0,.88) 72%, rgba(0,0,0,.56) 80%, rgba(0,0,0,.20) 90%, transparent 100%) !important;
}

.v07-series-detail-summary {
  position:relative !important;
  z-index:2 !important;
  min-height:430px !important;
  display:grid !important;
  grid-template-columns:205px minmax(0,820px) !important;
  gap:34px !important;
  align-items:center !important;
  padding:38px 42px 28px 38px !important;
  box-sizing:border-box !important;
}
.v07-series-detail-poster {
  position:relative !important;
  width:205px !important;
  height:306px !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.025) !important;
  box-shadow:0 20px 48px rgba(0,0,0,.36) !important;
}
.v07-series-detail-poster img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.v07-series-detail-copy {
  min-width:0 !important;
  text-shadow:0 2px 18px rgba(0,0,0,.72) !important;
}
.v07-series-detail-copy h2 {
  max-width:820px !important;
  margin:0 !important;
  color:#f4f7f8 !important;
  font-size:48px !important;
  line-height:1.04 !important;
  font-weight:900 !important;
  letter-spacing:-1px !important;
}
.v07-series-detail-copy .v07-meta-row {
  margin:14px 0 13px !important;
}
.v07-series-detail-copy .v07-meta-chip {
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:rgba(235,241,243,.86) !important;
  font-size:16px !important;
  font-weight:760 !important;
}
.v07-series-detail-copy .v07-meta-chip + .v07-meta-chip::before {
  content:'\2022';
  margin:0 10px;
  color:rgba(235,241,243,.42);
}
.v07-series-detail-plot {
  max-width:820px !important;
  max-height:88px !important;
  margin:0 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  color:rgba(226,234,237,.86) !important;
  font-size:18px !important;
  line-height:1.48 !important;
}
.v07-series-detail-actions {
  display:flex !important;
  gap:12px !important;
  margin-top:20px !important;
}
.v07-series-detail-actions .secondary-button {
  min-height:52px !important;
  height:52px !important;
  padding:0 22px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:14px !important;
  background:rgba(11,18,23,.50) !important;
  font-size:17px !important;
}
.v07-series-detail-actions .secondary-button:focus {
  border-color:rgba(var(--accent-rgb),.72) !important;
  box-shadow:0 0 0 2px rgba(var(--accent-rgb),.28),0 10px 28px rgba(0,0,0,.30) !important;
}

.v07-series-episodes {
  padding:12px 4px 72px !important;
  background:transparent !important;
}
.v07-series-season-row {
  min-height:54px !important;
  margin:0 0 18px !important;
  padding:0 10px !important;
  display:flex !important;
  gap:24px !important;
  align-items:center !important;
  overflow:hidden !important;
}
.v07-series-season-button {
  position:relative !important;
  min-width:0 !important;
  width:auto !important;
  height:50px !important;
  padding:0 5px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:rgba(209,222,227,.60) !important;
  font-size:18px !important;
  font-weight:700 !important;
}
.v07-series-season-button.active {
  color:#f1f6f8 !important;
  background:transparent !important;
}
.v07-series-season-button.active::after {
  content:'' !important;
  position:absolute !important;
  left:5px !important;
  right:5px !important;
  bottom:2px !important;
  height:3px !important;
  border-radius:3px !important;
  background:var(--accent) !important;
  box-shadow:0 0 12px var(--glow) !important;
}
.v07-series-season-button:focus {
  color:var(--accent) !important;
  outline:none !important;
  box-shadow:none !important;
}

.v07-series-episode-grid {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 18px !important;
  padding:0 8px !important;
}
.v07-series-episode-card {
  min-height:132px !important;
  display:grid !important;
  grid-template-columns:210px minmax(0,1fr) 34px !important;
  gap:18px !important;
  align-items:center !important;
  padding:0 15px 0 0 !important;
  overflow:hidden !important;
  border:1px solid transparent !important;
  border-radius:18px !important;
  background:rgba(var(--panel-rgb),.18) !important;
  box-shadow:none !important;
  text-align:left !important;
  transition:background .10s ease-out,border-color .10s ease-out,box-shadow .10s ease-out !important;
}
.v07-series-episode-card:focus,
.v07-series-episode-card.is-focused {
  border-color:rgba(var(--accent-rgb),.64) !important;
  background:rgba(var(--panel-rgb),.32) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.26) !important;
}
.v07-series-episode-art {
  position:relative !important;
  width:210px !important;
  height:132px !important;
  overflow:hidden !important;
  border-radius:17px 0 0 17px !important;
  background:rgba(var(--panel-rgb),.42) !important;
}
.v07-series-episode-art img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.v07-series-episode-number {
  position:absolute !important;
  left:10px !important;
  bottom:9px !important;
  min-width:34px !important;
  height:30px !important;
  padding:0 8px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:9px !important;
  background:rgba(3,8,11,.78) !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:900 !important;
}
.v07-series-episode-art.image-failed .v07-series-episode-number {
  left:50% !important;
  bottom:50% !important;
  transform:translate(-50%,50%) !important;
  background:rgba(var(--accent-rgb),.14) !important;
  color:var(--accent) !important;
}
.v07-series-episode-copy {
  min-width:0 !important;
}
.v07-series-episode-meta {
  margin-bottom:5px !important;
  color:rgba(181,201,209,.58) !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.6px !important;
  text-transform:uppercase !important;
}
.v07-series-episode-meta span {
  margin:0 7px !important;
  opacity:.55 !important;
}
.v07-series-episode-card strong {
  display:block !important;
  color:#eef5f7 !important;
  font-size:18px !important;
  line-height:1.22 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.v07-series-episode-card p {
  max-width:none !important;
  margin:7px 0 0 !important;
  color:rgba(190,206,212,.66) !important;
  font-size:14px !important;
  line-height:1.32 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.v07-series-episode-card .episode-play {
  color:var(--accent) !important;
  font-size:20px !important;
  opacity:.75 !important;
}
.v07-series-episode-card:focus .episode-play {
  opacity:1 !important;
}
.v07-series-episode-card .episode-progress {
  left:210px !important;
  right:0 !important;
  bottom:0 !important;
  height:4px !important;
  background:rgba(255,255,255,.06) !important;
}
.v07-series-detail-loading {
  min-height:150px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  color:var(--muted) !important;
  font-size:17px !important;
}


/* ========================================================================
   v0.7.0 Series detail + media responsiveness r12
   ======================================================================== */

/* Series detail artwork now occupies the complete hero canvas. Keep the same
   two-axis alpha-vignette language used by the browse hero, but establish an
   explicit stacking context so the artwork cannot fall behind the page. */
.v07-series-detail-hero {
  width:100% !important;
  max-width:none !important;
  isolation:isolate !important;
  background:transparent !important;
}
.v07-series-detail-backdrop {
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:1 !important;
  display:block !important;
  opacity:1 !important;
  background:transparent !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.20) 2%, rgba(0,0,0,.58) 6%, rgba(0,0,0,.90) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.90) 89%, rgba(0,0,0,.58) 94%, rgba(0,0,0,.20) 98%, transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.20) 2%, rgba(0,0,0,.58) 6%, rgba(0,0,0,.90) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.90) 89%, rgba(0,0,0,.58) 94%, rgba(0,0,0,.20) 98%, transparent 100%) !important;
}
.v07-series-detail-backdrop-art {
  inset:-4% -3% -5% -3% !important;
  z-index:0 !important;
  display:block !important;
  opacity:.66 !important;
  background-position:center 26% !important;
  background-size:cover !important;
  background-color:rgba(4,8,11,.16) !important;
  background-blend-mode:multiply !important;
  -webkit-mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.28) 3%, rgba(0,0,0,.68) 8%, rgba(0,0,0,.94) 14%, #000 20%,
    #000 64%, rgba(0,0,0,.90) 71%, rgba(0,0,0,.60) 80%, rgba(0,0,0,.22) 90%, transparent 100%) !important;
  mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.28) 3%, rgba(0,0,0,.68) 8%, rgba(0,0,0,.94) 14%, #000 20%,
    #000 64%, rgba(0,0,0,.90) 71%, rgba(0,0,0,.60) 80%, rgba(0,0,0,.22) 90%, transparent 100%) !important;
}
.v07-series-detail-summary {
  z-index:2 !important;
}
.v07-series-detail-hero:not(.has-art) .v07-series-detail-backdrop {
  display:none !important;
}

/* Give episode content breathing room instead of pinning the still image and
   text directly to the card edges. */
.v07-series-episode-card {
  min-height:156px !important;
  grid-template-columns:204px minmax(0,1fr) 34px !important;
  gap:18px !important;
  padding:12px 14px 12px 12px !important;
  box-sizing:border-box !important;
}
.v07-series-episode-art {
  width:204px !important;
  height:132px !important;
  border-radius:14px !important;
}
.v07-series-episode-copy {
  padding:4px 4px 4px 0 !important;
}
.v07-series-episode-card .episode-progress {
  left:226px !important;
  right:14px !important;
  bottom:8px !important;
  border-radius:4px !important;
  overflow:hidden !important;
}

/* Poster focus should be instantaneous and paint-only. Combined with the r12
   synchronous focus handoff this removes the one-frame left/right bounce when
   the six-card rail window advances. */
.catalog-movies .v07-poster-card,
.catalog-series .v07-poster-card,
.catalog-movies .v07-poster-card:focus,
.catalog-series .v07-poster-card:focus,
.catalog-movies .v07-poster-card.is-focused,
.catalog-series .v07-poster-card.is-focused {
  transition:none !important;
  transform:none !important;
}



/* ========================================================================
   v0.7.0 Series detail correctness r13
   Use the exact browse backdrop as a real cached image and restore explicit
   directional navigation from episodes back through seasons to the hero.
   ======================================================================== */

.v07-series-detail-hero {
  position:relative !important;
  width:100% !important;
  min-width:100% !important;
  overflow:hidden !important;
  isolation:isolate !important;
  background:transparent !important;
}

/* The already-resolved browse fanart is rendered as an actual img rather than
   a CSS background. This is more reliable on older webOS Chromium and allows
   the decoded/browser-cached image to be reused immediately. */
.v07-series-detail-backdrop {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:0 !important;
  display:block !important;
  overflow:hidden !important;
  pointer-events:none !important;
  background:transparent !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.18) 2%, rgba(0,0,0,.52) 6%, rgba(0,0,0,.86) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.90) 89%, rgba(0,0,0,.58) 94%, rgba(0,0,0,.20) 98%, transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.18) 2%, rgba(0,0,0,.52) 6%, rgba(0,0,0,.86) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.90) 89%, rgba(0,0,0,.58) 94%, rgba(0,0,0,.20) 98%, transparent 100%) !important;
}
.v07-series-detail-backdrop-art {
  position:absolute !important;
  top:-4% !important;
  left:-2% !important;
  width:104% !important;
  height:109% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center 28% !important;
  opacity:.62 !important;
  background:none !important;
  transform:none !important;
  filter:none !important;
  transition:none !important;
  -webkit-mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.25) 3%, rgba(0,0,0,.62) 8%, rgba(0,0,0,.90) 14%, #000 20%,
    #000 66%, rgba(0,0,0,.90) 72%, rgba(0,0,0,.62) 79%, rgba(0,0,0,.30) 86%, rgba(0,0,0,.08) 92%, transparent 100%) !important;
  mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.25) 3%, rgba(0,0,0,.62) 8%, rgba(0,0,0,.90) 14%, #000 20%,
    #000 66%, rgba(0,0,0,.90) 72%, rgba(0,0,0,.62) 79%, rgba(0,0,0,.30) 86%, rgba(0,0,0,.08) 92%, transparent 100%) !important;
}
/* Readability tint without introducing a hard rectangular backdrop. */
.v07-series-detail-backdrop::after {
  content:'' !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,
    rgba(4,8,11,.34) 0%, rgba(4,8,11,.18) 32%, rgba(4,8,11,.08) 58%, rgba(4,8,11,.12) 100%) !important;
}
.v07-series-detail-backdrop.image-failed,
.v07-series-detail-hero:not(.has-art) .v07-series-detail-backdrop {
  display:none !important;
}
.v07-series-detail-summary {
  position:relative !important;
  z-index:2 !important;
}

/* ========================================================================
   v0.7.0 layout polish r14
   Fully transparent category wheel + reclaimed horizontal browse space.
   Applies uniformly to Live TV, Movies, and Series.
   ======================================================================== */

/* Reclaim some of the large left gutter and give the content canvas more
   horizontal room. The wheel is narrower while preserving the existing
   seven-slot typography and navigation behavior. */
.v07-library {
  position:relative !important;
  left:-24px !important;
  width:calc(100% + 24px) !important;
  grid-template-columns:252px minmax(0,1fr) !important;
  gap:16px !important;
}

/* Remove every possible wheel surface. Older rules in both app.css and the
   earlier v0.7 passes styled category-list/viewport independently, so clear
   all of them explicitly rather than relying on one container override. */
.v07-category-wheel,
.v07-category-wheel.category-list,
.v07-library > .v07-category-wheel,
.v07-wheel-viewport {
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

.v07-category-wheel.category-list {
  margin:0 !important;
  padding:0 !important;
}

.v07-category-wheel::before,
.v07-category-wheel::after,
.v07-category-wheel.category-list::before,
.v07-category-wheel.category-list::after,
.v07-wheel-viewport::before,
.v07-wheel-viewport::after,
.v07-library::before,
.v07-library::after {
  display:none !important;
  content:none !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Let labels use the full narrower column. Focus remains typography-only;
   no selected/focused rectangle or surface is allowed to reappear. */
.v07-category-wheel .v07-wheel-slot.category-button,
.v07-category-wheel .v07-wheel-slot.category-button.active,
.v07-category-wheel .v07-wheel-slot,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  left:0 !important;
  right:0 !important;
  width:100% !important;
  min-width:100% !important;
  padding-left:4px !important;
  padding-right:4px !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

/* ========================================================================
   v0.7.0 layout polish r15
   Remove category-wheel clipping introduced by the narrower r14 layout.
   ======================================================================== */

/* Keep most of the reclaimed r14 space, but restore a small physical-screen
   safe gutter so long centered labels do not extend beyond the viewport. */
.v07-library {
  left:-8px !important;
  width:calc(100% + 8px) !important;
  grid-template-columns:252px minmax(0,1fr) !important;
  gap:16px !important;
  overflow:visible !important;
}

/* Earlier v0.7 wheel passes set overflow:hidden on the wheel. That becomes
   visible as a hard vertical clipping edge once the column is narrowed.
   Explicitly remove clipping at every wheel layer. */
.v07-category-wheel,
.v07-category-wheel.category-list,
.v07-library > .v07-category-wheel,
.v07-wheel-viewport {
  overflow:visible !important;
  clip:auto !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}

/* Give labels a few pixels of breathing room without bringing back a panel.
   The text may use the safe gutter to the left, but remains centered relative
   to the category column. */
.v07-category-wheel .v07-wheel-slot.category-button,
.v07-category-wheel .v07-wheel-slot.category-button.active,
.v07-category-wheel .v07-wheel-slot,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  left:-8px !important;
  right:-8px !important;
  width:calc(100% + 16px) !important;
  min-width:calc(100% + 16px) !important;
  padding-left:8px !important;
  padding-right:8px !important;
  overflow:visible !important;
}

.v07-category-wheel .v07-wheel-label {
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  max-width:none !important;
}



/* ========================================================================
   v0.7.0 layout polish r16
   Pull the shared category wheel closer to the physical screen edge and
   eliminate the Movies/Series media-column seam without putting artwork
   underneath the wheel.
   ======================================================================== */

/* The main browse grid now begins about 16px from the app's physical left
   edge rather than ~44px. This applies uniformly to Live TV, Movies, Series. */
.v07-library {
  left:-36px !important;
  width:calc(100% + 36px) !important;
  grid-template-columns:260px minmax(0,1fr) !important;
  gap:10px !important;
  overflow:visible !important;
}

/* Keep the full wheel usable inside the new narrower gutter. Do not extend
   slot boxes beyond their column; long labels can still paint visibly. */
.v07-category-wheel,
.v07-category-wheel.category-list,
.v07-library > .v07-category-wheel,
.v07-wheel-viewport {
  overflow:visible !important;
  clip:auto !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}
.v07-category-wheel .v07-wheel-slot.category-button,
.v07-category-wheel .v07-wheel-slot.category-button.active,
.v07-category-wheel .v07-wheel-slot,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  left:0 !important;
  right:0 !important;
  width:100% !important;
  min-width:100% !important;
  padding-left:2px !important;
  padding-right:2px !important;
  overflow:visible !important;
}
.v07-category-wheel .v07-wheel-label {
  max-width:none !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}

/* Movies/Series: avoid beginning the masked backdrop on the exact same
   vertical pixel as the media column. The backdrop canvas extends 64px left,
   but its mask is fully transparent through that overscan. The visible art
   therefore still begins only inside the main content area, just with a soft
   alpha ramp instead of a compositor/element edge. */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  left:-64px !important;
  right:0 !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    transparent 4%,
    rgba(0,0,0,.16) 7%,
    rgba(0,0,0,.48) 11%,
    rgba(0,0,0,.80) 16%,
    #000 22%,
    #000 84%,
    rgba(0,0,0,.88) 89%,
    rgba(0,0,0,.54) 94%,
    rgba(0,0,0,.18) 98%,
    transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%,
    transparent 4%,
    rgba(0,0,0,.16) 7%,
    rgba(0,0,0,.48) 11%,
    rgba(0,0,0,.80) 16%,
    #000 22%,
    #000 84%,
    rgba(0,0,0,.88) 89%,
    rgba(0,0,0,.54) 94%,
    rgba(0,0,0,.18) 98%,
    transparent 100%) !important;
}



/* ========================================================================
   v0.7.0 layout polish r17
   Give the category wheel a larger real paint box without moving the main
   Live/Movies/Series content to the right. The visual label origin moves a
   little closer to the physical screen edge while the hidden clipping edge
   is moved safely off-screen.
   ======================================================================== */

/* Widen the wheel's actual grid track by 50px, then shift the full library
   left by the same 50px. The main content therefore begins on essentially
   the exact same x-coordinate as r16. */
.v07-library {
  left:-86px !important;
  width:calc(100% + 86px) !important;
  grid-template-columns:310px minmax(0,1fr) !important;
  gap:10px !important;
  overflow:visible !important;
}

/* The expanded wheel starts partly outside the viewport, but its visible
   labels are inset back onto the screen. This moves the wheel/container clip
   boundary away from the text instead of relying on painting outside a
   narrow transformed element. */
.v07-category-wheel,
.v07-category-wheel.category-list,
.v07-library > .v07-category-wheel {
  position:relative !important;
  z-index:20 !important;
  width:310px !important;
  min-width:310px !important;
  max-width:310px !important;
  overflow:visible !important;
  clip:auto !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}
.v07-wheel-viewport {
  left:0 !important;
  right:0 !important;
  width:310px !important;
  overflow:visible !important;
  clip:auto !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}

/* Keep the text itself about 8px from the physical screen edge. Because the
   containing paint box begins ~34px off-screen, its internal left clipping
   boundary can no longer slice the visible label glyphs. */
.v07-category-wheel .v07-wheel-slot.category-button,
.v07-category-wheel .v07-wheel-slot.category-button.active,
.v07-category-wheel .v07-wheel-slot,
.v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  left:42px !important;
  right:0 !important;
  width:268px !important;
  min-width:268px !important;
  max-width:268px !important;
  padding-left:0 !important;
  padding-right:4px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
.v07-category-wheel .v07-wheel-label {
  display:block !important;
  width:auto !important;
  max-width:264px !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
}

/* Keep the media/EPG paint plane below the wheel. This is especially
   important for Movies/Series where the alpha-vignetted backdrop deliberately
   overscans its own media boundary. */
.v07-media-stage,
.v07-guide-stage {
  position:relative !important;
  z-index:1 !important;
}

/* ========================================================================
   v0.7.0 layout polish r20
   Root-cause fix for category-wheel clipping.

   app.css gives #view overflow:hidden and #view starts after the .main left
   padding. That creates the fixed internal clipping plane seen on the TV.
   Let #view paint into the main safe-area padding while .main itself remains
   the actual screen-level clipping boundary.
   ======================================================================== */

/* Keep the application constrained to the television canvas. */
.main {
  overflow:hidden !important;
}

/* Critical fix: the v0.7 browse wheel is intentionally shifted into the
   main left safe-area padding. Do not clip it at #view's content boundary. */
.view {
  overflow:visible !important;
}

/* Reassert the stable pre-r18 wheel paint geometry. The wheel may paint into
   the main padding, but never beyond the .main television canvas. */
.v07-library,
.v07-category-wheel,
.v07-category-wheel.category-list,
.v07-wheel-viewport,
.v07-category-wheel .v07-wheel-slot,
.v07-category-wheel .v07-wheel-label {
  clip:auto !important;
  clip-path:none !important;
  -webkit-clip-path:none !important;
}



/* ========================================================================
   v0.7.0 layout polish r21
   Adaptive category-wheel typography. Keep the now-correct r20 geometry and
   measure real rendered label width so long provider names remain one-line
   without pushing into the main content canvas.
   ======================================================================== */

/* Normalize the old character-count classes. r21's JS measures the actual
   rendered width after each seven-slot wheel paint and assigns only the amount
   of reduction that the individual label needs. */
#categoryList .v07-wheel-label,
#categoryList .v07-wheel-label.v07-wheel-label-long,
#categoryList .v07-wheel-label.v07-wheel-label-xlong {
  display:block !important;
  width:100% !important;
  max-width:254px !important;
  min-width:0 !important;
  margin:0 auto !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  text-align:center !important;
  font-size:24px !important;
  line-height:1.08 !important;
  letter-spacing:0 !important;
}

#categoryList .v07-wheel-center .v07-wheel-label,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label,
#categoryList .v07-wheel-center .v07-wheel-label.v07-wheel-label-long,
#categoryList .v07-wheel-center .v07-wheel-label.v07-wheel-label-xlong,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-long,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-label-xlong {
  font-size:27px !important;
  font-weight:840 !important;
}

/* Progressive reductions. These deliberately override the old long/xlong
   character-count rules because the renderer has already measured the text. */
#categoryList .v07-wheel-label.v07-wheel-fit-1 {
  font-size:21px !important;
  letter-spacing:-.15px !important;
}
#categoryList .v07-wheel-center .v07-wheel-label.v07-wheel-fit-1,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-fit-1 {
  font-size:23px !important;
}

#categoryList .v07-wheel-label.v07-wheel-fit-2 {
  font-size:19px !important;
  letter-spacing:-.25px !important;
}
#categoryList .v07-wheel-center .v07-wheel-label.v07-wheel-fit-2,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-fit-2 {
  font-size:20px !important;
}

#categoryList .v07-wheel-label.v07-wheel-fit-3 {
  font-size:17px !important;
  letter-spacing:-.35px !important;
}
#categoryList .v07-wheel-center .v07-wheel-label.v07-wheel-fit-3,
#categoryList .v07-wheel-slot[data-wheel-offset="0"] .v07-wheel-label.v07-wheel-fit-3 {
  font-size:18px !important;
}

/* Only truly pathological provider names reach this fallback. The full label
   remains available through the button's aria-label/title semantics. */
#categoryList .v07-wheel-label.v07-wheel-fit-ellipsis {
  text-overflow:ellipsis !important;
}


/* ========================================================================
   v0.7.0 Home redesign r22
   Bring Home in line with the immersive Movies / Series visual language.
   ======================================================================== */

.v07-home {
  height:100% !important;
  padding:0 8px 88px 0 !important;
  background:transparent !important;
  scroll-padding:24px 0 94px !important;
}

/* Last Played hero: artwork is part of the canvas, never a bordered panel. */
.v07-home-hero {
  position:relative !important;
  height:430px !important;
  min-height:430px !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  isolation:isolate !important;
}
.v07-home-backdrop {
  position:absolute !important;
  z-index:0 !important;
  top:-5% !important;
  right:-2% !important;
  bottom:-8% !important;
  left:21% !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  opacity:0 !important;
  filter:none !important;
  transform:none !important;
  transition:none !important;
  pointer-events:none !important;
  -webkit-mask-image:radial-gradient(ellipse 90% 92% at 66% 45%, #000 40%, rgba(0,0,0,.96) 52%, rgba(0,0,0,.65) 70%, rgba(0,0,0,.20) 88%, transparent 100%) !important;
  mask-image:radial-gradient(ellipse 90% 92% at 66% 45%, #000 40%, rgba(0,0,0,.96) 52%, rgba(0,0,0,.65) 70%, rgba(0,0,0,.20) 88%, transparent 100%) !important;
}
.v07-home-backdrop.has-art {
  opacity:.64 !important;
}
.v07-home-scrim {
  position:absolute !important;
  z-index:1 !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(90deg, rgba(4,8,11,.97) 0%, rgba(4,8,11,.86) 25%, rgba(4,8,11,.48) 48%, rgba(4,8,11,.14) 72%, rgba(4,8,11,.18) 100%),
    linear-gradient(0deg, rgba(4,8,11,1) 0%, rgba(4,8,11,.82) 12%, rgba(4,8,11,.28) 30%, rgba(4,8,11,0) 52%),
    linear-gradient(180deg, rgba(4,8,11,.78) 0%, rgba(4,8,11,.18) 18%, rgba(4,8,11,0) 36%) !important;
}
.v07-home-hero-inner {
  position:relative !important;
  z-index:2 !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns:218px minmax(0,820px) !important;
  align-items:center !important;
  gap:34px !important;
  padding:26px 34px 28px 24px !important;
  box-sizing:border-box !important;
}
#v07HomeHeroArt {
  width:218px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.v07-home-hero-art {
  position:relative !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  background:rgba(8,14,20,.24) !important;
  box-shadow:0 20px 48px rgba(0,0,0,.32) !important;
}
.v07-home-hero-art--poster {
  width:204px !important;
  height:306px !important;
  border-radius:18px !important;
}
.v07-home-hero-poster,
.v07-home-hero-poster img {
  width:100% !important;
  height:100% !important;
}
.v07-home-hero-poster {
  position:relative !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.025) !important;
}
.v07-home-hero-poster img { object-fit:cover !important; }
.v07-home-hero-art--live {
  width:184px !important;
  height:184px !important;
  border-radius:30px !important;
  background:rgba(8,14,20,.46) !important;
}
.v07-home-hero-art--live .v07-station-logo {
  width:146px !important;
  height:146px !important;
  flex-basis:146px !important;
  border-radius:24px !important;
}
.v07-home-hero-art--live .v07-station-logo img {
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
.v07-home-hero-art--empty {
  width:184px !important;
  height:184px !important;
  border-radius:30px !important;
  color:var(--muted) !important;
  font-size:48px !important;
}
.v07-home-copy {
  max-width:820px !important;
  min-width:0 !important;
  text-shadow:0 2px 18px rgba(0,0,0,.76) !important;
}
.v07-home-kicker {
  margin:0 0 10px !important;
  color:var(--accent) !important;
  font-size:13px !important;
  font-weight:900 !important;
  letter-spacing:1.2px !important;
}
.v07-home-copy h2 {
  max-width:820px !important;
  margin:0 !important;
  color:#f5f8f9 !important;
  font-size:48px !important;
  line-height:1.04 !important;
  font-weight:900 !important;
  letter-spacing:-.8px !important;
  white-space:normal !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
}
.v07-home-meta {
  min-height:24px !important;
  height:auto !important;
  margin:13px 0 11px !important;
  display:flex !important;
  align-items:center !important;
}
.v07-home-meta .v07-meta-chip {
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:rgba(236,242,244,.84) !important;
  font-size:15px !important;
}
.v07-home-meta .v07-meta-chip + .v07-meta-chip::before {
  content:'\2022' !important;
  margin:0 9px !important;
  color:rgba(235,241,243,.42) !important;
}
.v07-home-copy p {
  max-width:790px !important;
  max-height:82px !important;
  margin:0 0 20px !important;
  color:rgba(226,234,237,.86) !important;
  font-size:18px !important;
  line-height:1.46 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
}
.v07-home-copy .primary-button {
  min-height:54px !important;
  height:54px !important;
  padding:0 24px !important;
  border-radius:14px !important;
  font-size:18px !important;
  text-shadow:none !important;
}

/* Home rails: media cards use the same tall poster proportions and visual
   treatment as the dedicated Movies / Series rail instead of landscape tiles. */
.v07-home-row-section {
  margin-top:24px !important;
}
.v07-home-row-section h3 {
  margin:0 0 12px 4px !important;
  color:rgba(241,246,248,.92) !important;
  font-size:22px !important;
  font-weight:780 !important;
}
.v07-home-row {
  padding:5px 4px 10px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
.v07-home-row--poster {
  height:340px !important;
  display:flex !important;
  align-items:stretch !important;
  gap:18px !important;
}
.v07-home-poster {
  position:relative !important;
  flex:0 0 210px !important;
  width:210px !important;
  height:315px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:18px !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
  transition:none !important;
}
.v07-home-poster-art {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.025) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
.v07-home-poster-art img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.v07-home-poster > span { display:none !important; }
.v07-home-poster:focus {
  z-index:4 !important;
  border:0 !important;
  box-shadow:0 18px 36px rgba(0,0,0,.42), 0 0 0 2px rgba(var(--accent-rgb),.76) !important;
}

.v07-home-row--live {
  height:170px !important;
  display:flex !important;
  align-items:stretch !important;
  gap:16px !important;
}
.v07-home-channel {
  flex:0 0 246px !important;
  width:246px !important;
  height:148px !important;
  margin:0 !important;
  padding:14px 16px !important;
  border:0 !important;
  border-radius:18px !important;
  background:rgba(var(--panel-rgb),.30) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.045) !important;
}
.v07-home-channel .v07-station-logo {
  width:78px !important;
  height:78px !important;
  flex-basis:78px !important;
}
.v07-home-channel > span {
  max-width:214px !important;
  margin-top:9px !important;
  color:rgba(236,242,244,.90) !important;
  font-size:14px !important;
}
.v07-home-channel:focus {
  border:0 !important;
  box-shadow:inset 0 0 0 2px rgba(var(--accent-rgb),.72), 0 14px 30px rgba(0,0,0,.32) !important;
}



/* ========================================================================
   v0.7.0 Home refinement r23
   Match the proven Series-detail alpha vignette and make Home focus-follow
   scrolling reliable as rows extend beyond the visible television viewport.
   ======================================================================== */

.v07-home {
  position:relative !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  scroll-behavior:auto !important;
  scroll-padding-top:26px !important;
  scroll-padding-bottom:64px !important;
}

/* Same two-axis alpha-mask strategy used successfully by Series Detail.
   The wrapper handles left/right transparency; the actual decoded image
   handles top/bottom transparency. This makes the hero art fade into the
   Home canvas instead of reading as a rectangular banner. */
.v07-home-backdrop {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  z-index:0 !important;
  display:none !important;
  overflow:hidden !important;
  pointer-events:none !important;
  background:transparent !important;
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
  transition:none !important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.14) 2%, rgba(0,0,0,.46) 6%, rgba(0,0,0,.82) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.88) 89%, rgba(0,0,0,.54) 94%, rgba(0,0,0,.18) 98%, transparent 100%) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%, rgba(0,0,0,.14) 2%, rgba(0,0,0,.46) 6%, rgba(0,0,0,.82) 11%, #000 17%,
    #000 84%, rgba(0,0,0,.88) 89%, rgba(0,0,0,.54) 94%, rgba(0,0,0,.18) 98%, transparent 100%) !important;
}
.v07-home-backdrop.has-art {
  display:block !important;
}
.v07-home-backdrop-art {
  position:absolute !important;
  top:-4% !important;
  left:-2% !important;
  width:104% !important;
  height:109% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center 34% !important;
  opacity:.58 !important;
  background:none !important;
  filter:none !important;
  transform:none !important;
  transition:none !important;
  -webkit-mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.22) 3%, rgba(0,0,0,.58) 8%, rgba(0,0,0,.88) 14%, #000 20%,
    #000 62%, rgba(0,0,0,.88) 69%, rgba(0,0,0,.58) 77%, rgba(0,0,0,.27) 85%, rgba(0,0,0,.07) 92%, transparent 100%) !important;
  mask-image:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.22) 3%, rgba(0,0,0,.58) 8%, rgba(0,0,0,.88) 14%, #000 20%,
    #000 62%, rgba(0,0,0,.88) 69%, rgba(0,0,0,.58) 77%, rgba(0,0,0,.27) 85%, rgba(0,0,0,.07) 92%, transparent 100%) !important;
}

/* Readability tint only; edge transparency comes from the masks above. */
.v07-home-scrim {
  background:linear-gradient(90deg,
    rgba(4,8,11,.48) 0%, rgba(4,8,11,.28) 28%, rgba(4,8,11,.10) 57%, rgba(4,8,11,.10) 100%) !important;
}

/* Give the final populated row enough real scroll extent that a focused
   poster can always be brought completely above the television's bottom edge. */
.v07-home-row-section:last-child {
  padding-bottom:44px !important;
}



/* ========================================================================
   v0.7.0 Home polish r24
   Larger typography, transparent Live TV tiles, tighter hero spacing, and
   row-aware focus scrolling. Existing r23 alpha-vignette remains unchanged.
   ======================================================================== */

/* Tighter Home composition: the r22 hero reserved more vertical space than
   its visible content needed. This keeps the cinematic hero but brings the
   first populated rail up into the composition. */
.v07-home-hero {
  height:372px !important;
  min-height:372px !important;
}
.v07-home-hero-inner {
  grid-template-columns:200px minmax(0,850px) !important;
  gap:30px !important;
  padding:20px 34px 22px 20px !important;
}
#v07HomeHeroArt {
  width:200px !important;
}
.v07-home-hero-art--poster {
  width:188px !important;
  height:282px !important;
}
.v07-home-hero-art--live {
  width:170px !important;
  height:170px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.v07-home-hero-art--live .v07-station-logo {
  width:156px !important;
  height:156px !important;
  flex-basis:156px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.v07-home-hero-art--live .v07-station-logo img {
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

/* Slightly larger Home typography for television viewing distance. */
.v07-home-kicker {
  font-size:14px !important;
}
.v07-home-copy h2 {
  font-size:52px !important;
  line-height:1.03 !important;
}
.v07-home-meta .v07-meta-chip {
  font-size:16px !important;
}
.v07-home-copy p {
  max-height:88px !important;
  margin-bottom:17px !important;
  font-size:20px !important;
  line-height:1.42 !important;
}
.v07-home-copy .primary-button {
  min-height:56px !important;
  height:56px !important;
  font-size:19px !important;
}
.v07-home-row-section {
  margin-top:12px !important;
}
.v07-home-row-section + .v07-home-row-section {
  margin-top:22px !important;
}
.v07-home-row-section h3 {
  margin:0 0 13px 4px !important;
  font-size:26px !important;
  line-height:1.2 !important;
}

/* Live TV on Home is artwork-first: no artificial card or logo tile surfaces.
   The only rectangular treatment is the focus ring while the remote is on it. */
.v07-home-row--live {
  height:152px !important;
  align-items:flex-start !important;
  gap:12px !important;
}
.v07-home-channel {
  flex:0 0 204px !important;
  width:204px !important;
  height:132px !important;
  padding:8px 8px 9px !important;
  border:0 !important;
  border-radius:16px !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.v07-home-channel .v07-station-logo {
  width:86px !important;
  height:86px !important;
  flex-basis:86px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.v07-home-channel .v07-station-logo img {
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
.v07-home-channel > span {
  max-width:190px !important;
  margin-top:8px !important;
  color:rgba(239,245,247,.94) !important;
  font-size:16px !important;
  line-height:1.18 !important;
  font-weight:700 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.v07-home-channel:focus,
.v07-home-channel.is-focused {
  background:transparent !important;
  box-shadow:0 0 0 2px rgba(var(--accent-rgb),.82), 0 12px 28px rgba(0,0,0,.28) !important;
}

/* More breathing room below the final row so row-centering remains possible
   even when the last populated row owns focus. */
.v07-home {
  padding-bottom:150px !important;
  scroll-padding-top:52px !important;
  scroll-padding-bottom:110px !important;
}
.v07-home-row-section:last-child {
  padding-bottom:88px !important;
}



/* ========================================================================
   v0.7.0 Home static-hero + rail scrolling r25
   Hero remains fixed. Only content rails scroll. Explicit item margins keep
   spacing reliable on older webOS Chromium where flex-gap can be inconsistent.
   ======================================================================== */
/* Extend Home through the shared .main 42px bottom gutter so partially
   visible rails clip at the television edge. Keep focus clearance inside
   the rail scroller, where it can scroll away. */
.v07-home {
  display:flex !important;
  flex-direction:column !important;
  height:calc(100% + 42px) !important;
  max-height:calc(100% + 42px) !important;
  min-height:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}
.v07-home-hero {
  position:relative !important;
  flex:0 0 372px !important;
  height:372px !important;
  min-height:372px !important;
  max-height:372px !important;
  overflow:hidden !important;
  z-index:2 !important;
}
.v07-home-scroll {
  position:relative !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:8px 22px 110px 0 !important;
  box-sizing:border-box !important;
  scroll-behavior:auto !important;
  scrollbar-width:none !important;
  z-index:1 !important;
}
.v07-home-scroll::-webkit-scrollbar { display:none !important; }
.v07-home-scroll > .v07-home-row-section:first-child {
  margin-top:4px !important;
}
.v07-home-scroll > .v07-home-row-section + .v07-home-row-section {
  margin-top:24px !important;
}
.v07-home-scroll > .v07-home-row-section:last-child {
  padding-bottom:34px !important;
}
.v07-home-row--poster,
.v07-home-row--live {
  gap:0 !important;
}
.v07-home-row--poster .v07-home-poster + .v07-home-poster {
  margin-left:20px !important;
}
.v07-home-row--live .v07-home-channel + .v07-home-channel {
  margin-left:18px !important;
}
.v07-home-row {
  padding-left:5px !important;
  padding-right:8px !important;
}

/* === XtreamlyTV r30 nav-seamless-background START === */
/* Make the top navigation and upper content canvas one continuous dark field.
   There is deliberately no accent-colored ambience in the upper ~72% of the
   screen. Appearance color is reintroduced only near the lower edge. */
#app {
  background-color:var(--bg) !important;
  background-image:
    radial-gradient(ellipse 66% 26% at 50% 112%,
      rgba(var(--accent-rgb),.12) 0%,
      rgba(var(--accent-rgb),.065) 34%,
      rgba(var(--accent-rgb),.018) 60%,
      rgba(var(--accent-rgb),0) 80%),
    linear-gradient(180deg,
      var(--bg) 0%,
      var(--bg) 72%,
      var(--bg) 78%,
      var(--bg-2) 91%,
      var(--bg-3) 100%) !important;
}

/* Ensure the application chrome above the content uses the same base canvas
   color instead of allowing an older theme gradient to peek through. */
.main,
.view {
  background-color:transparent !important;
}
/* === XtreamlyTV r30 nav-seamless-background END === */

/* === XtreamlyTV r31 media-wheel-unification START === */
/* Movies/Series retained an early media-specific category-wheel gradient with
   higher specificity than the later shared transparent wheel rules. Override
   those media-only selectors explicitly so Live TV, Movies, and Series use
   exactly the same clean wheel surface treatment. */
.catalog-movies .v07-category-wheel,
.catalog-movies .v07-category-wheel.category-list,
.catalog-movies .v07-library > .v07-category-wheel,
.catalog-movies .v07-wheel-viewport,
.catalog-series .v07-category-wheel,
.catalog-series .v07-category-wheel.category-list,
.catalog-series .v07-library > .v07-category-wheel,
.catalog-series .v07-wheel-viewport {
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

/* Explicitly suppress every legacy top/bottom mask or decorative surface on
   media-page wheels. Live TV already reaches this visual state through the
   shared rules; these selectors simply give Movies/Series equal specificity. */
.catalog-movies .v07-category-wheel::before,
.catalog-movies .v07-category-wheel::after,
.catalog-movies .v07-category-wheel.category-list::before,
.catalog-movies .v07-category-wheel.category-list::after,
.catalog-movies .v07-wheel-viewport::before,
.catalog-movies .v07-wheel-viewport::after,
.catalog-series .v07-category-wheel::before,
.catalog-series .v07-category-wheel::after,
.catalog-series .v07-category-wheel.category-list::before,
.catalog-series .v07-category-wheel.category-list::after,
.catalog-series .v07-wheel-viewport::before,
.catalog-series .v07-wheel-viewport::after {
  display:none !important;
  content:none !important;
  background:none !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
}

/* The early immersive-media pass also gave Movies/Series a media-only active
   row gradient. Remove it so selection/focus is typography-only, matching the
   Live TV wheel. */
.catalog-movies .v07-category-wheel .v07-wheel-slot.category-button,
.catalog-movies .v07-category-wheel .v07-wheel-slot.category-button.active,
.catalog-movies .v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.catalog-movies .v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.catalog-movies .v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.catalog-movies .v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.catalog-movies .v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused,
.catalog-series .v07-category-wheel .v07-wheel-slot.category-button,
.catalog-series .v07-category-wheel .v07-wheel-slot.category-button.active,
.catalog-series .v07-category-wheel .v07-wheel-slot[data-wheel-offset="0"],
.catalog-series .v07-category-wheel .v07-wheel-slot.v07-wheel-center,
.catalog-series .v07-category-wheel .v07-wheel-slot.v07-wheel-center.active,
.catalog-series .v07-category-wheel .v07-wheel-slot.v07-wheel-center:focus,
.catalog-series .v07-category-wheel .v07-wheel-slot.v07-wheel-center.is-focused {
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
}
/* === XtreamlyTV r31 media-wheel-unification END === */

/* === XtreamlyTV r33 top-nav-focus START === */
/* r10 intentionally made the primary top nav text-only, but its per-view
   :focus selectors are more specific than the generic r32 rule. Match/exceed
   that specificity so transient focus uses the Appearance accent. */
.nav-list .nav-item[data-view="home"]:focus,
.nav-list .nav-item[data-view="live"]:focus,
.nav-list .nav-item[data-view="movies"]:focus,
.nav-list .nav-item[data-view="series"]:focus,
.nav-list .nav-item[data-view="home"].is-focused,
.nav-list .nav-item[data-view="live"].is-focused,
.nav-list .nav-item[data-view="movies"].is-focused,
.nav-list .nav-item[data-view="series"].is-focused {
  color:var(--accent) !important;
  opacity:1 !important;
  text-shadow:0 0 12px rgba(var(--accent-rgb),.28) !important;
}

/* Search and Settings are icon-only, but they should use the same transient
   Appearance-driven focus feedback as the text destinations. */
.nav-list .v07-search-nav:focus,
.nav-list .v07-search-nav.is-focused,
.nav-list .nav-item[data-view="settings"]:focus,
.nav-list .nav-item[data-view="settings"].is-focused {
  color:var(--accent) !important;
  opacity:1 !important;
}

/* Resting active destination stays white; the existing cyan/theme underline
   remains the persistent page-state indicator. */
.nav-list .nav-item[data-view="home"].active:not(:focus):not(.is-focused),
.nav-list .nav-item[data-view="live"].active:not(:focus):not(.is-focused),
.nav-list .nav-item[data-view="movies"].active:not(:focus):not(.is-focused),
.nav-list .nav-item[data-view="series"].active:not(:focus):not(.is-focused) {
  color:var(--text) !important;
  text-shadow:none !important;
}
/* === XtreamlyTV r33 top-nav-focus END === */

/* ========================================================================
   v0.7.0 EPG overlap hardening
   Provider short-EPG feeds can contain duplicate/overlapping events. The
   renderer de-conflicts those records; do not force a minimum visual width
   that can make very short neighboring events overlap again.
   ======================================================================== */
.v07-program {
  min-width:0 !important;
}

/* ========================================================================
   v0.7.0 webOS media hero + focus + artwork loading polish
   ======================================================================== */

/* Pin Movies / Series copy to the upper-left. Action controls are separately
   anchored at the lower-left so metadata length cannot move the buttons. */
.catalog-movies .v07-media-hero-inner,
.catalog-movies .v07-media-hero-inner--immersive,
.catalog-series .v07-media-hero-inner,
.catalog-series .v07-media-hero-inner--immersive {
  align-items:flex-start !important;
  padding:30px 32px 28px 30px !important;
}
.catalog-movies .v07-hero-primary,
.catalog-series .v07-hero-primary {
  position:relative !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  box-sizing:border-box !important;
}
.catalog-movies .v07-hero-primary h2,
.catalog-series .v07-hero-primary h2 {
  flex:0 0 auto !important;
  margin:0 !important;
}
.catalog-movies .v07-hero-primary .v07-meta-row,
.catalog-series .v07-hero-primary .v07-meta-row {
  flex:0 0 auto !important;
  margin:12px 0 12px !important;
}

/* Legacy webOS Chromium does not reliably implement flex gap. Keep rich movie
   fact labels visually separated from their values. */
.catalog-movies .v07-movie-fact {
  gap:0 !important;
}
.catalog-movies .v07-movie-fact > span {
  margin-right:10px !important;
}

.catalog-movies .v07-hero-primary .v07-hero-actions,
.catalog-series .v07-hero-primary .v07-hero-actions {
  flex:0 0 56px !important;
  margin-top:auto !important;
}

/* Encoding-independent metadata separators. */
.catalog-movies .v07-meta-chip + .v07-meta-chip::before,
.catalog-series .v07-meta-chip + .v07-meta-chip::before,
.v07-series-detail-copy .v07-meta-chip + .v07-meta-chip::before {
  content:'\2022' !important;
}

/* Match Android's high-contrast white focus treatment for action buttons. */
.primary-button:focus,
.primary-button.is-focused,
.secondary-button:focus,
.secondary-button.is-focused,
.danger-button:focus,
.danger-button.is-focused,
.catalog-movies .v07-hero-actions .primary-button:focus,
.catalog-movies .v07-hero-actions .secondary-button:focus,
.catalog-series .v07-hero-actions .primary-button:focus,
.catalog-series .v07-hero-actions .secondary-button:focus,
.v07-series-detail-actions .secondary-button:focus {
  border-color:rgba(255,255,255,.98) !important;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.98),
    0 10px 30px rgba(0,0,0,.40) !important;
}

/* Failed artwork becomes an intentional fallback rather than a blank tile. */
.v07-poster-thumb.image-failed > img {
  display:none !important;
}
.v07-poster-thumb.image-failed .v07-poster-fallback {
  display:grid !important;
}

/* Hero copy must never paint its own rectangular panel/mask. Readability
   comes from the hero artwork vignette, not a box behind the text. */
.catalog-movies .v07-hero-primary,
.catalog-series .v07-hero-primary,
.catalog-movies .v07-hero-description,
.catalog-series .v07-hero-description,
.catalog-movies .v07-movie-facts {
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  filter:none !important;
}
.catalog-movies .v07-hero-primary::before,
.catalog-movies .v07-hero-primary::after,
.catalog-series .v07-hero-primary::before,
.catalog-series .v07-hero-primary::after,
.catalog-movies .v07-hero-description::before,
.catalog-movies .v07-hero-description::after,
.catalog-series .v07-hero-description::before,
.catalog-series .v07-hero-description::after {
  content:none !important;
  display:none !important;
}


/* ========================================================================
   v0.7.0 webOS hero backdrop tint cleanup
   The actual fanart layer was still being painted with a semi-transparent
   dark background plus multiply blending. On bright artwork that composited
   region can read as a subtle rectangle behind the hero copy. Keep the true
   alpha vignette, but remove the rectangular tint layer entirely.
   ======================================================================== */
.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  background-color:transparent !important;
  background-blend-mode:normal !important;
}

/* ========================================================================
   v0.7.0 webOS media full-canvas hero + blocked category controls
   ======================================================================== */

/* The faint "rectangles" visible behind hero lines on bright fanart were not
   panel backgrounds: older LG Chromium was rasterizing the large inherited
   text-shadow into rectangular offscreen surfaces. Use the full-canvas scrim
   for contrast instead and keep all media hero typography shadow-free. */
.catalog-movies .v07-hero-primary,
.catalog-series .v07-hero-primary,
.catalog-movies .v07-hero-primary *,
.catalog-series .v07-hero-primary *,
.catalog-movies .v07-hero-description,
.catalog-series .v07-hero-description,
.catalog-movies .v07-hero-description *,
.catalog-series .v07-hero-description *,
.catalog-movies .v07-movie-facts,
.catalog-movies .v07-movie-facts * {
  text-shadow:none !important;
}

/* Match the Android media-page composition: one ambient backdrop spans the
   entire content canvas, including beneath the transparent category wheel and
   poster rail. Because this surface reaches the real screen edges, its static
   readability scrim cannot reveal a hero-sized rectangular boundary. */
.catalog-movies .v07-media-stage,
.catalog-series .v07-media-stage {
  position:relative !important;
  overflow:visible !important;
  isolation:isolate !important;
}

.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  position:absolute !important;
  z-index:0 !important;
  top:-12px !important;
  left:-286px !important;
  right:-52px !important;
  bottom:-42px !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden !important;
  background:transparent !important;
  pointer-events:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

.catalog-movies .v07-media-backdrop-layer,
.catalog-series .v07-media-backdrop-layer {
  position:absolute !important;
  inset:-2% !important;
  z-index:0 !important;
  background-position:center 30% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-color:transparent !important;
  background-blend-mode:normal !important;
  transform:none !important;
  filter:none !important;
  transition:none !important;
  will-change:auto !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.48 !important;
}
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="b"],
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="b"] {
  display:none !important;
}

/* Full-page readability treatment. This replaces all localized text masks and
   remains static for webOS compositor stability. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  display:block !important;
  position:absolute !important;
  z-index:1 !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(180deg,
      rgba(1,2,4,.96) 0%,
      rgba(1,2,4,.76) 8%,
      rgba(1,2,4,.40) 18%,
      rgba(1,2,4,.16) 29%,
      rgba(1,2,4,0) 40%),
    linear-gradient(90deg,
      rgba(1,2,4,.72) 0%,
      rgba(1,2,4,.58) 18%,
      rgba(1,2,4,.34) 38%,
      rgba(1,2,4,.14) 62%,
      rgba(1,2,4,.12) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.92) 0%,
      rgba(1,2,4,.74) 10%,
      rgba(1,2,4,.42) 21%,
      rgba(1,2,4,.16) 34%,
      rgba(1,2,4,0) 48%),
    linear-gradient(rgba(1,2,4,.12), rgba(1,2,4,.12)) !important;
}

.catalog-movies .v07-media-backdrop::before,
.catalog-movies .v07-media-backdrop::after,
.catalog-series .v07-media-backdrop::before,
.catalog-series .v07-media-backdrop::after,
.catalog-movies .v07-media-backdrop-layer::before,
.catalog-movies .v07-media-backdrop-layer::after,
.catalog-series .v07-media-backdrop-layer::before,
.catalog-series .v07-media-backdrop-layer::after {
  display:none !important;
  content:none !important;
}

/* Keep all browse content above the ambient fanart while allowing the wheel to
   float over it exactly like Android TV. */
.catalog-movies .v07-browser-tools,
.catalog-movies .v07-media-hero,
.catalog-movies .v07-poster-rail-wrap,
.catalog-movies .catalog-status,
.catalog-series .v07-browser-tools,
.catalog-series .v07-media-hero,
.catalog-series .v07-poster-rail-wrap,
.catalog-series .catalog-status {
  position:relative !important;
  z-index:2 !important;
}
.catalog-movies .v07-category-wheel,
.catalog-series .v07-category-wheel {
  position:relative !important;
  z-index:20 !important;
}

/* Settings: explicit provider-category visibility controls. */
.v07-blocked-categories {
  grid-column:1 / -1 !important;
}
.v07-blocked-categories > p {
  max-width:1120px;
}
.v07-blocked-group {
  margin-top:22px;
  padding:16px 18px 18px;
  border:1px solid rgba(var(--accent-rgb),.55);
  border-radius:18px;
  background:rgba(var(--panel-rgb),.72);
  color:var(--text);
}
.v07-blocked-group h4 {
  margin:0 0 12px;
  color:var(--accent);
  font-size:20px;
}
.v07-blocked-add {
  display:flex;
  align-items:center;
  gap:12px;
  max-width:1040px;
}
.v07-blocked-add select {
  flex:1 1 auto;
  min-width:0;
  height:54px;
}
.v07-blocked-add .secondary-button {
  flex:0 0 210px;
  height:54px;
}
.v07-blocked-list {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px 14px;
  max-width:1040px;
  margin-top:14px;
}
.v07-blocked-category-row {
  min-width:0;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:0 16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:13px;
  background:rgba(var(--panel-rgb),.30);
  color:var(--text);
  text-align:left;
}
.v07-blocked-category-row span {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.v07-blocked-category-row strong {
  flex:0 0 auto;
  color:var(--muted);
  font-size:14px;
}
.v07-blocked-add select:focus,
.v07-blocked-add .secondary-button:focus,
.v07-blocked-category-row:focus,
.v07-blocked-category-row.is-focused {
  border-color:var(--accent) !important;
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.55) !important;
  outline:0 !important;
}
.v07-blocked-empty {
  color:var(--muted);
  font-size:15px;
  padding:7px 2px;
}

/* ========================================================================
   v0.7.0 webOS pass: lower ambience + media-page readability + Series wheel
   ======================================================================== */

/* Keep the app truly dark for most of the canvas. Appearance-driven ambience
   now emerges only in the bottom ~18-20% rather than beginning near 72%. */
#app {
  background-color:var(--bg) !important;
  background-image:
    radial-gradient(ellipse 72% 20% at 50% 118%,
      rgba(var(--accent-rgb),.11) 0%,
      rgba(var(--accent-rgb),.055) 38%,
      rgba(var(--accent-rgb),.015) 64%,
      rgba(var(--accent-rgb),0) 82%),
    linear-gradient(180deg,
      var(--bg) 0%,
      var(--bg) 80%,
      var(--bg) 84%,
      var(--bg-2) 93%,
      var(--bg-3) 100%) !important;
}

/* The full-canvas Movies/Series artwork stays visible, but the mask itself is
   page-sized: heavy black directly beneath the top navigation, a broad left
   readability field for the category wheel + hero copy, and a bottom dissolve.
   There is no localized rectangle behind any text. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  display:block !important;
  position:absolute !important;
  z-index:1 !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(180deg,
      rgba(1,2,4,1) 0%,
      rgba(1,2,4,.96) 5%,
      rgba(1,2,4,.78) 13%,
      rgba(1,2,4,.46) 23%,
      rgba(1,2,4,.20) 33%,
      rgba(1,2,4,.06) 41%,
      rgba(1,2,4,0) 48%),
    linear-gradient(90deg,
      rgba(1,2,4,.90) 0%,
      rgba(1,2,4,.76) 16%,
      rgba(1,2,4,.56) 31%,
      rgba(1,2,4,.34) 45%,
      rgba(1,2,4,.17) 59%,
      rgba(1,2,4,.08) 74%,
      rgba(1,2,4,.05) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.90) 0%,
      rgba(1,2,4,.70) 10%,
      rgba(1,2,4,.40) 22%,
      rgba(1,2,4,.16) 34%,
      rgba(1,2,4,0) 48%),
    linear-gradient(rgba(1,2,4,.08), rgba(1,2,4,.08)) !important;
}

/* Slightly subdue the artwork underneath the wheel/copy while preserving the
   full-page Android-like presentation. */
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.44 !important;
}

/* Series was still able to trigger an older Chromium text-shadow/compositing
   surface around category labels. Make its wheel labels paint as plain glyphs,
   matching the clean Movies wheel. */
.catalog-series .v07-category-wheel .v07-wheel-label,
.catalog-series .v07-category-wheel .v07-wheel-label::before,
.catalog-series .v07-category-wheel .v07-wheel-label::after {
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}


/* ========================================================================
   v0.7.0 webOS media backdrop deep-fade refinement
   Extend artwork behind the navigation so there is no physical image edge at
   the menu boundary. Then keep that region black and dissolve into the artwork
   gradually. Artwork stays intentionally ambient rather than foreground.
   ======================================================================== */
.catalog-movies .v07-media-backdrop,
.catalog-series .v07-media-backdrop {
  top:-124px !important;
}

/* Substantially quieter than the previous .44 treatment. */
.catalog-movies .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible,
.catalog-series .v07-media-backdrop-layer[data-v07-backdrop-layer="a"].is-visible {
  opacity:.30 !important;
}

/* Because the backdrop now physically continues underneath the top nav, this
   is a true fade rather than a dark overlay starting at the image boundary. */
.catalog-movies .v07-media-backdrop-scrim,
.catalog-series .v07-media-backdrop-scrim {
  background:
    linear-gradient(180deg,
      rgba(1,2,4,1) 0%,
      rgba(1,2,4,1) 12%,
      rgba(1,2,4,.99) 18%,
      rgba(1,2,4,.94) 26%,
      rgba(1,2,4,.82) 36%,
      rgba(1,2,4,.62) 46%,
      rgba(1,2,4,.40) 56%,
      rgba(1,2,4,.20) 65%,
      rgba(1,2,4,.07) 72%,
      rgba(1,2,4,0) 78%),
    linear-gradient(90deg,
      rgba(1,2,4,.92) 0%,
      rgba(1,2,4,.80) 16%,
      rgba(1,2,4,.62) 31%,
      rgba(1,2,4,.42) 45%,
      rgba(1,2,4,.24) 59%,
      rgba(1,2,4,.12) 74%,
      rgba(1,2,4,.07) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.92) 0%,
      rgba(1,2,4,.72) 10%,
      rgba(1,2,4,.42) 22%,
      rgba(1,2,4,.18) 34%,
      rgba(1,2,4,0) 49%),
    linear-gradient(rgba(1,2,4,.10), rgba(1,2,4,.10)) !important;
}

/* ========================================================================
   v0.7.0 webOS ROOT-CANVAS media backdrop
   The prior backdrop lived inside .main. .main begins at top:112px and has
   overflow:hidden, which creates an unavoidable hard clipping edge exactly
   below the navigation. This root-level layer is outside that clipping plane.
   ======================================================================== */

/* Retire the old locally-clipped media backdrop. */
.catalog-movies #v07MediaBackdrop,
.catalog-series #v07MediaBackdrop {
  display:none !important;
}

/* #app background remains the base canvas. This artwork layer sits above it,
   while .main/sidebar/topbar are explicitly raised above the artwork. */
#v07RootMediaBackdrop {
  position:absolute !important;
  z-index:1 !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
  background:transparent !important;
}

#v07RootMediaBackdrop.is-active {
  opacity:1 !important;
}

#v07RootMediaBackdrop .v07-root-media-backdrop-layer {
  position:absolute !important;
  z-index:0 !important;
  top:-3% !important;
  right:-2% !important;
  bottom:-3% !important;
  left:0 !important;
  background-position:68% 25% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  opacity:0 !important;
  transform:scale(1.025) !important;
  filter:saturate(.88) contrast(1.02) brightness(.82) !important;
}

#v07RootMediaBackdrop .v07-root-media-backdrop-layer.is-visible {
  opacity:.27 !important;
}

/* This fade starts at the actual top of the television canvas, not at the
   content boundary. The navigation therefore sits inside a fully black region
   and the artwork only becomes perceptible well below it. */
#v07RootMediaBackdrop .v07-root-media-backdrop-scrim {
  position:absolute !important;
  z-index:1 !important;
  inset:0 !important;
  background:
    linear-gradient(180deg,
      rgba(1,2,4,1) 0%,
      rgba(1,2,4,1) 14%,
      rgba(1,2,4,.995) 18%,
      rgba(1,2,4,.97) 23%,
      rgba(1,2,4,.90) 29%,
      rgba(1,2,4,.78) 36%,
      rgba(1,2,4,.61) 44%,
      rgba(1,2,4,.43) 52%,
      rgba(1,2,4,.27) 60%,
      rgba(1,2,4,.14) 68%,
      rgba(1,2,4,.05) 75%,
      rgba(1,2,4,0) 82%),
    linear-gradient(90deg,
      rgba(1,2,4,.94) 0%,
      rgba(1,2,4,.84) 15%,
      rgba(1,2,4,.68) 29%,
      rgba(1,2,4,.49) 44%,
      rgba(1,2,4,.31) 58%,
      rgba(1,2,4,.17) 73%,
      rgba(1,2,4,.10) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.91) 0%,
      rgba(1,2,4,.70) 10%,
      rgba(1,2,4,.40) 22%,
      rgba(1,2,4,.16) 34%,
      rgba(1,2,4,0) 49%),
    linear-gradient(rgba(1,2,4,.08), rgba(1,2,4,.08)) !important;
}

/* Keep all interactive application chrome above the root artwork. */
.main {
  z-index:2 !important;
}
.sidebar {
  z-index:40 !important;
}
.topbar {
  z-index:45 !important;
}

/* ========================================================================
   v0.7.0 webOS unified cinematic backdrop refinement
   Use one root-canvas treatment for Home, Movies, Series and Series Detail.
   The goal mirrors Android: artwork is atmospheric, the nav lives in a deep
   black field, and the reveal into fanart is long enough that no seam exists.
   ======================================================================== */

/* Home and Series Detail now use the shared root-canvas artwork. Their old
   local backdrops are disabled so there is never a second compositing plane. */
#v07HomeBackdrop,
.v07-series-detail-backdrop {
  display:none !important;
}

/* Softer artwork than the prior 0.27 pass. */
#v07RootMediaBackdrop .v07-root-media-backdrop-layer.is-visible {
  opacity:.21 !important;
}

/* Home gets the quietest art because its rails occupy more vertical space. */
#v07RootMediaBackdrop[data-media-kind="home"] .v07-root-media-backdrop-layer.is-visible {
  opacity:.18 !important;
}

/* Series detail stays just slightly stronger so episode context is preserved. */
#v07RootMediaBackdrop[data-media-kind="series-detail"] .v07-root-media-backdrop-layer.is-visible {
  opacity:.20 !important;
}

/* Dedicated navigation veil. Unlike the old 112px sidebar gradient, this
   extends far into the page, so the menu and artwork share one continuous
   black-to-image transition. */
#v07RootMediaBackdrop::before {
  content:'' !important;
  position:absolute !important;
  z-index:3 !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  height:390px !important;
  pointer-events:none !important;
  background:linear-gradient(180deg,
    rgba(1,2,4,1) 0%,
    rgba(1,2,4,.999) 18%,
    rgba(1,2,4,.995) 30%,
    rgba(1,2,4,.985) 42%,
    rgba(1,2,4,.955) 54%,
    rgba(1,2,4,.88) 66%,
    rgba(1,2,4,.72) 77%,
    rgba(1,2,4,.48) 86%,
    rgba(1,2,4,.24) 93%,
    rgba(1,2,4,0) 100%) !important;
}

/* Long, low-contrast page mask. There is intentionally no abrupt point where
   the black menu "ends" and the artwork "starts". */
#v07RootMediaBackdrop .v07-root-media-backdrop-scrim {
  background:
    linear-gradient(180deg,
      rgba(1,2,4,.995) 0%,
      rgba(1,2,4,.992) 12%,
      rgba(1,2,4,.982) 20%,
      rgba(1,2,4,.955) 28%,
      rgba(1,2,4,.90) 36%,
      rgba(1,2,4,.81) 45%,
      rgba(1,2,4,.70) 54%,
      rgba(1,2,4,.57) 63%,
      rgba(1,2,4,.43) 72%,
      rgba(1,2,4,.30) 80%,
      rgba(1,2,4,.20) 87%,
      rgba(1,2,4,.13) 93%,
      rgba(1,2,4,.08) 100%),
    linear-gradient(90deg,
      rgba(1,2,4,.90) 0%,
      rgba(1,2,4,.80) 15%,
      rgba(1,2,4,.66) 29%,
      rgba(1,2,4,.48) 44%,
      rgba(1,2,4,.31) 59%,
      rgba(1,2,4,.18) 74%,
      rgba(1,2,4,.10) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.92) 0%,
      rgba(1,2,4,.74) 10%,
      rgba(1,2,4,.46) 22%,
      rgba(1,2,4,.22) 35%,
      rgba(1,2,4,.07) 49%,
      rgba(1,2,4,0) 60%),
    linear-gradient(rgba(1,2,4,.08), rgba(1,2,4,.08)) !important;
}

/* Home's Android-style treatment has a stronger lower dissolve so artwork
   disappears before it competes with the Continue Watching rails. */
#v07RootMediaBackdrop[data-media-kind="home"] .v07-root-media-backdrop-scrim {
  background:
    linear-gradient(180deg,
      rgba(1,2,4,.995) 0%,
      rgba(1,2,4,.99) 14%,
      rgba(1,2,4,.965) 25%,
      rgba(1,2,4,.90) 36%,
      rgba(1,2,4,.78) 48%,
      rgba(1,2,4,.61) 59%,
      rgba(1,2,4,.48) 68%,
      rgba(1,2,4,.44) 76%,
      rgba(1,2,4,.54) 84%,
      rgba(1,2,4,.72) 91%,
      rgba(1,2,4,.90) 100%),
    linear-gradient(90deg,
      rgba(1,2,4,.92) 0%,
      rgba(1,2,4,.81) 17%,
      rgba(1,2,4,.63) 34%,
      rgba(1,2,4,.40) 53%,
      rgba(1,2,4,.20) 72%,
      rgba(1,2,4,.10) 100%),
    linear-gradient(rgba(1,2,4,.07), rgba(1,2,4,.07)) !important;
}

/* Make the physical top navigation itself participate in the same continuous
   field instead of carrying the older 112px fade that could reveal its edge. */
.sidebar {
  background:linear-gradient(180deg,
    rgba(1,2,4,.995) 0%,
    rgba(1,2,4,.99) 58%,
    rgba(1,2,4,.965) 82%,
    rgba(1,2,4,.92) 100%) !important;
}

/* Home/Series Detail containers remain transparent over the shared artwork. */
.v07-home,
.v07-home-hero,
.v07-series-detail-page,
.v07-series-detail-hero {
  background:transparent !important;
  background-image:none !important;
}


/* ========================================================================
   v0.7.0 webOS Android-look backdrop alignment
   Bring the root-canvas treatment closer to the Android TV implementation:
   visible but subdued art, a shorter/softer black reveal from the top nav,
   and a stronger home-page bottom dissolve.
   ======================================================================== */

/* Slightly more visible than the prior too-dark pass, but still ambient. */
#v07RootMediaBackdrop .v07-root-media-backdrop-layer.is-visible {
  opacity:.29 !important;
}
#v07RootMediaBackdrop[data-media-kind="home"] .v07-root-media-backdrop-layer.is-visible {
  opacity:.29 !important;
}
#v07RootMediaBackdrop[data-media-kind="series-detail"] .v07-root-media-backdrop-layer.is-visible {
  opacity:.27 !important;
}

/* The older 390px veil pushed too much black into the frame. Shorten it and
   make the reveal more gradual so it feels like Android rather than a curtain. */
#v07RootMediaBackdrop::before {
  height:300px !important;
  background:linear-gradient(180deg,
    rgba(1,2,4,1) 0%,
    rgba(1,2,4,.998) 18%,
    rgba(1,2,4,.988) 34%,
    rgba(1,2,4,.95) 49%,
    rgba(1,2,4,.84) 64%,
    rgba(1,2,4,.60) 79%,
    rgba(1,2,4,.28) 91%,
    rgba(1,2,4,0) 100%) !important;
}

/* Shared Movies / Series / Series Detail mask. Dark up top, but with a long,
   subtle transition into the artwork. Left-side shaping improves hero-copy and
   wheel readability without turning the whole page muddy. */
#v07RootMediaBackdrop .v07-root-media-backdrop-scrim {
  --v07-shared-scrim:
    linear-gradient(180deg,
      rgba(1,2,4,.985) 0%,
      rgba(1,2,4,.965) 12%,
      rgba(1,2,4,.90) 24%,
      rgba(1,2,4,.78) 38%,
      rgba(1,2,4,.60) 52%,
      rgba(1,2,4,.42) 66%,
      rgba(1,2,4,.27) 79%,
      rgba(1,2,4,.17) 90%,
      rgba(1,2,4,.10) 100%),
    linear-gradient(90deg,
      rgba(1,2,4,.88) 0%,
      rgba(1,2,4,.78) 14%,
      rgba(1,2,4,.62) 28%,
      rgba(1,2,4,.44) 44%,
      rgba(1,2,4,.28) 60%,
      rgba(1,2,4,.16) 76%,
      rgba(1,2,4,.09) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.86) 0%,
      rgba(1,2,4,.62) 11%,
      rgba(1,2,4,.34) 24%,
      rgba(1,2,4,.14) 38%,
      rgba(1,2,4,0) 54%),
    linear-gradient(rgba(1,2,4,.06), rgba(1,2,4,.06));
  background:var(--v07-shared-scrim) !important;
}

/* Home uses exactly the same vignette as Movies and Series. */
#v07RootMediaBackdrop[data-media-kind="home"] .v07-root-media-backdrop-scrim {
  background:var(--v07-shared-scrim) !important;
}

/* Series detail needs the same visual family as Movies / Series browse pages. */
#v07RootMediaBackdrop[data-media-kind="series-detail"] .v07-root-media-backdrop-scrim {
  background:
    linear-gradient(180deg,
      rgba(1,2,4,.986) 0%,
      rgba(1,2,4,.968) 12%,
      rgba(1,2,4,.905) 25%,
      rgba(1,2,4,.79) 39%,
      rgba(1,2,4,.62) 53%,
      rgba(1,2,4,.45) 67%,
      rgba(1,2,4,.30) 80%,
      rgba(1,2,4,.18) 91%,
      rgba(1,2,4,.11) 100%),
    linear-gradient(90deg,
      rgba(1,2,4,.90) 0%,
      rgba(1,2,4,.79) 15%,
      rgba(1,2,4,.63) 30%,
      rgba(1,2,4,.45) 46%,
      rgba(1,2,4,.29) 61%,
      rgba(1,2,4,.17) 77%,
      rgba(1,2,4,.10) 100%),
    linear-gradient(0deg,
      rgba(1,2,4,.88) 0%,
      rgba(1,2,4,.64) 11%,
      rgba(1,2,4,.37) 24%,
      rgba(1,2,4,.16) 38%,
      rgba(1,2,4,0) 54%) !important;
}

/* Let the nav bar remain black, but avoid a secondary hard edge within it. */
.sidebar {
  background:linear-gradient(180deg,
    rgba(1,2,4,1) 0%,
    rgba(1,2,4,.995) 64%,
    rgba(1,2,4,.97) 100%) !important;
}

/* One full-canvas Home backdrop, with the shared opacity and vignette rules.
   Explicit edges also support TV browsers that do not implement inset. */
#v07RootMediaBackdrop[data-media-kind="home"] {
  display:block !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
}
#v07RootMediaBackdrop .v07-root-media-backdrop-scrim {
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
}
#v07HomeBackdrop {
  display:none !important;
}
#v07HomeBackdrop.has-art {
  display:none !important;
}
.v07-home-hero {
  background-image:none !important;
}
.v07-home-scrim {
  display:none !important;
}

/* Give provider channel names room without changing the category wheel. */
.v07-guide-header,
.v07-guide-row {
  grid-template-columns:400px minmax(0,1fr) !important;
}
.v07-station {
  padding:0 18px !important;
}
.v07-station-logo {
  flex-basis:88px !important;
  width:88px !important;
  height:88px !important;
  border-radius:21px !important;
}
.v07-station-logo img {
  width:78px !important;
  height:78px !important;
}
.v07-station-logo span {
  font-size:27px !important;
}
.v07-station-copy {
  margin-left:18px !important;
  overflow:hidden;
}
.v07-station-copy strong {
  position:relative;
  display:block !important;
  height:58px;
  max-height:58px;
  font-size:24px !important;
  line-height:29px !important;
  white-space:normal !important;
  overflow:hidden;
  text-overflow:clip;
}
.v07-station-copy strong > span {
  display:block;
  will-change:transform;
}
.v07-station-copy span {
  margin-top:6px !important;
  font-size:16px !important;
  line-height:18px !important;
}
.v07-station-copy strong.is-overflowing {
  animation:none;
}
.v07-station-copy strong.is-overflowing > span {
  animation:v07-channel-name-marquee var(--v07-marquee-duration, 4s) linear .7s infinite alternate;
}
@keyframes v07-channel-name-marquee {
  from { transform:translateY(0); }
  to { transform:translateY(calc(-1 * var(--v07-marquee-distance, 0px))); }
}

/* Main browse pages share a full-screen image and uniform readability tint. */
.v07-canvas-art .sidebar,
.v07-canvas-art .topbar {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.v07-canvas-art #v07RootMediaBackdrop::before {
  display:none !important;
}
.v07-canvas-art #v07RootMediaBackdrop .v07-root-media-backdrop-layer {
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
  background-position:center center !important;
  background-size:cover !important;
  transform:none !important;
  filter:saturate(.85) !important;
}
.v07-canvas-art #v07RootMediaBackdrop .v07-root-media-backdrop-layer.is-visible {
  opacity:1 !important;
}
.v07-canvas-art #v07RootMediaBackdrop .v07-root-media-backdrop-scrim {
  background:rgba(3,7,12,.66) !important;
}

body.zion-home-mode { margin:0; padding:0; }
body.zion-home-mode .main { top:0 !important; padding:0 !important; }
body.zion-home-mode .sidebar {
  top:0 !important; left:0 !important; right:0 !important; width:100% !important;
  height:64px !important; min-height:64px !important; overflow:hidden !important;
  display:flex !important; flex-direction:row !important; align-items:center !important; gap:16px !important;
  padding:0 28px !important; box-sizing:border-box !important;
  background:rgba(5,11,14,.75) !important;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
body.zion-home-mode .sidebar .logo { position:static !important; width:auto !important; height:auto !important; margin:0 !important; flex:0 0 auto !important; }
body.zion-home-mode .sidebar .logo span { display:none !important; }
body.zion-home-mode .sidebar .logo img,
body.zion-home-mode .logo .brand-mark { width:40px !important; height:40px !important; object-fit:cover; border-radius:10px; display:block; }
body.zion-home-mode .nav-list { position:static !important; width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; flex:1 1 auto !important; justify-content:flex-start !important; flex-wrap:nowrap !important; align-items:center !important; overflow:visible !important; }
body.zion-home-mode .nav-item,
body.zion-home-mode .nav-item[data-view="settings"],
body.zion-home-mode .nav-item[data-view="lists"] {
  position:static !important; top:auto !important; right:auto !important; left:auto !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:auto !important; min-width:0 !important; height:40px !important;
  margin:0 2px !important; padding:0 12px !important;
  font-size:18px !important; line-height:1 !important; transform:none !important;
  white-space:nowrap;
}
body.zion-home-mode .nav-item[data-view="settings"] .nav-icon { display:none !important; }
body.zion-home-mode .nav-item[data-view="favorites"] { display:none !important; }
body.zion-home-mode .topbar { display:none !important; }
body.zion-home-mode #view { height:100% !important; overflow:hidden !important; }
.zion-home { --zion-card-w:168px; --zion-card-h:252px; --zion-gap:16px; --zion-rank-col:92px; --zion-rank-size:112px; color:#f4f7fb; height:1080px; background:#050b0e; }
.zion-page { height:1080px; overflow-x:hidden; overflow-y:auto; scrollbar-width:none; }
.zion-page::-webkit-scrollbar, .zion-hrow::-webkit-scrollbar, .zion-pills::-webkit-scrollbar { display:none; width:0; height:0; }
.zion-home-facts { display:flex; align-items:center; gap:18px; margin:0 0 0 auto !important; flex:0 0 auto; opacity:1; height:40px; }
.zion-home-facts span, body.zion-home-mode .home-clock { display:flex; flex-direction:row; align-items:center; gap:6px; min-width:0; height:40px; line-height:1; white-space:nowrap; opacity:1; }
.zion-home-facts small { color:rgba(255,255,255,.82); font-size:15px; letter-spacing:0; text-transform:none; line-height:1; opacity:1; }
.zion-home-facts strong, body.zion-home-mode .home-clock { color:#fff; font-size:15px; font-weight:650; line-height:1; opacity:1; max-width:240px; overflow:hidden; text-overflow:ellipsis; }
.zion-refresh { width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.28); background:rgba(8,14,24,.72); color:#fff; display:grid; place-items:center; padding:0; line-height:0; opacity:1; }
.zion-refresh svg { width:18px; height:18px; display:block; }
.zion-refresh:disabled { opacity:.45; }
@media (prefers-reduced-motion: reduce) { .zion-refresh { transition:none; } }
.zion-refresh:focus { outline:3px solid rgba(var(--accent-rgb), .95); outline-offset:3px; }
.zion-refresh[aria-busy="true"] { opacity:.55; }
.zion-stage { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; height:620px; padding:72px 28px 0; box-sizing:border-box; }
.zion-stage.is-single { grid-template-columns:minmax(0,1fr); }
.zion-panel { position:relative; min-width:0; height:100%; overflow:hidden; border-radius:18px; background:#07101d; }
.zion-hero-layer { position:absolute; inset:0; opacity:0; transition:opacity .7s ease; }
.zion-hero-layer.is-visible { opacity:1; }
.zion-hero-layer img { width:100%; height:100%; object-fit:cover; object-position:center 20%; transform-origin:center center; }
.zion-hero-layer.is-visible img { animation:zion-drift 16s ease-in-out alternate infinite; }
.zion-hero-layer.is-poster img { object-fit:contain; object-position:center; background:#07101d; animation:none; }
.zion-hero-fallback { position:absolute; inset:0; display:none; place-items:center; font-size:72px; color:rgba(255,255,255,.8); }
.zion-hero-layer.is-empty .zion-hero-fallback { display:grid; }
.zion-hero-side { position:absolute; inset:0; background:linear-gradient(90deg, rgba(5,11,14,.72) 0%, rgba(5,11,14,.18) 46%, rgba(5,11,14,0) 72%); }
.zion-hero-bottom { position:absolute; left:0; right:0; bottom:0; height:220px; background:linear-gradient(180deg, rgba(5,11,14,0), rgba(5,11,14,.92)); }
.zion-hero-copy { position:absolute; left:0; right:0; bottom:22px; z-index:1; padding:0 28px; }
.zion-hero-kicker { margin:0 0 6px; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.86); }
.zion-hero-title { margin:0 0 8px; font-size:36px; line-height:1.05; }
.zion-hero-meta, .zion-hero-plot { margin:0 0 10px; color:rgba(255,255,255,.86); font-size:15px; }
.zion-hero-plot { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.zion-hero-actions { display:flex; gap:10px; }
.zion-hero-play, .zion-hero-info { min-width:148px; height:46px; border-radius:8px; border:0; font-size:16px; font-weight:700; }
.zion-hero-play { background:#f4f7fb; color:#111; }
.zion-hero-info { background:rgba(255,255,255,.18); color:#fff; }
.zion-hero-play:focus, .zion-hero-info:focus, .zion-pill:focus { outline:3px solid rgba(var(--accent-rgb), .98); outline-offset:3px; }
.zion-hero-dots { display:flex; gap:8px; margin-top:12px; }
.zion-hero-dots i { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.35); }
.zion-hero-dots i.is-on { background:#fff; }
.zion-pills { display:flex; gap:10px; overflow-x:auto; padding:18px 28px 8px; scrollbar-width:none; }
.zion-pill { flex:0 0 auto; height:40px; padding:0 16px; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff; font-size:15px; }
.zion-pill.is-selected { background:#f4f7fb; color:#111; }
.zion-section { margin:8px 0 4px; }
.zion-section-head { padding:8px 28px 0; }
.zion-section-head h2 { margin:0; font-size:26px; }
.zion-section-head p { margin:4px 0 0; color:rgba(255,255,255,.68); font-size:15px; }
.zion-hrow-wrap { position:relative; }
.zion-hrow-wrap:after { content:""; position:absolute; right:0; top:0; bottom:0; width:28px; background:linear-gradient(90deg, rgba(5,11,14,0), rgba(5,11,14,.45)); pointer-events:none; }
.zion-hrow { display:flex; gap:var(--zion-gap); overflow-x:auto; overflow-y:hidden; padding:28px 28px 36px; scroll-padding-inline:28px; scrollbar-width:none; }
.zion-hrow.is-ranked { padding:44px 40px 56px; scroll-padding-inline:40px; }
.zion-spacer { height:1px; }
.zion-home .zion-poster, .zion-home .poster-card.zion-poster { position:relative; flex:0 0 var(--zion-card-w) !important; width:var(--zion-card-w) !important; height:calc(var(--zion-card-h) + 78px) !important; margin:0 !important; padding:0 !important; border-radius:14px !important; background:transparent !important; transform:none !important; transition:transform .16s ease, box-shadow .16s ease; overflow:visible !important; }
.zion-home .zion-poster .poster-copy { height:auto !important; min-height:64px; padding:8px 4px 0 !important; overflow:visible !important; }
.zion-home .zion-poster .poster-copy strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.2; }
.zion-home .zion-poster .poster-copy span { display:block; margin-top:4px; line-height:1.35; white-space:nowrap; overflow:visible; }
.poster-copy .zion-rating, .zion-hero-meta .zion-rating, .v07-meta-row .zion-rating, .meta-chip.zion-rating { color: var(--zion-rating, #e6b325); font-weight: 650; }
.zion-home .zion-poster .poster-copy span.zion-rating { display: inline; }
.zion-home .zion-poster:focus, .zion-home .poster-card.zion-poster:focus { transform:scale(1.1) !important; outline:3px solid rgba(var(--accent-rgb), .98); outline-offset:4px; z-index:5; box-shadow:0 16px 36px rgba(0,0,0,.45); }
.zion-home .zion-poster .poster-art, .zion-home .zion-poster img { width:var(--zion-card-w); height:var(--zion-card-h); object-fit:cover; border-radius:14px; background:#101820; }
.zion-rank { position:relative; display:grid; grid-template-columns:var(--zion-rank-col) var(--zion-card-w); align-items:start; flex:0 0 auto; width:calc(var(--zion-rank-col) + var(--zion-card-w)); transition:transform .16s ease; }
.zion-rank-num { grid-column:1; grid-row:1; align-self:start; justify-self:stretch; display:flex; align-items:flex-end; justify-content:flex-end; width:var(--zion-rank-col); height:var(--zion-card-h); margin:0; padding:0 8px 10px 0; box-sizing:border-box; overflow:hidden; font-size:var(--zion-rank-size); font-weight:800; line-height:.8; font-variant-numeric:tabular-nums; letter-spacing:-0.04em; color:#070b10; -webkit-text-stroke:2px rgba(255,255,255,.88); pointer-events:none; }
.zion-rank .zion-poster { grid-column:2; grid-row:1; z-index:1; }
.zion-rank .zion-poster:focus { transform:none !important; }
.zion-rank:focus-within { transform:scale(1.06); z-index:5; }
.zion-rank.is-ten .zion-rank-num { font-size:calc(var(--zion-rank-size) * .72); letter-spacing:-0.06em; }
@media (max-height: 760px) {
  .zion-home, .zion-page { height:720px; }
  .zion-home { --zion-card-w:112px; --zion-card-h:168px; --zion-rank-col:64px; --zion-rank-size:76px; }
}
.zion-channel { display:flex; align-items:center; gap:12px; flex:0 0 280px; width:280px; min-height:92px; padding:10px 12px; border-radius:16px; border:1px solid rgba(255,255,255,.1); background:rgba(10,16,28,.78); color:inherit; text-align:left; }
.zion-channel img, .zion-channel-fallback { width:64px; height:64px; object-fit:contain; border-radius:12px; background:rgba(255,255,255,.06); }
.zion-channel-fallback { display:grid; place-items:center; font-size:22px; }
.zion-channel-copy { display:flex; flex-direction:column; min-width:0; }
.zion-channel-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zion-channel-copy em { color:#8fd18f; font-style:normal; font-size:13px; }
.zion-channel:focus { outline:3px solid rgba(var(--accent-rgb), .98); outline-offset:3px; transform:scale(1.08); z-index:5; }
.zion-note { padding:24px 28px; color:rgba(255,255,255,.75); }
@keyframes zion-drift { from { transform:scale(1) translate3d(0,0,0); } to { transform:scale(1.05) translate3d(-1.5%, -1%, 0); } }
@media (prefers-reduced-motion: reduce) {
  .zion-hero-layer, .zion-home .zion-poster, .zion-rank { transition:none; }
  .zion-hero-layer.is-visible img, .zion-home .zion-poster:focus, .zion-rank:focus-within, .zion-channel:focus { animation:none; transform:none !important; }
}
body.zion-shell .sidebar {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center !important;
  top:0 !important; left:0 !important; right:0 !important; width:100% !important;
  height:64px !important; min-height:64px !important;
  padding:0 28px !important; box-sizing:border-box !important;
  background:rgba(5,11,14,.75) !important;
  overflow:hidden !important;
}
body.zion-shell .sidebar .logo {
  position:static !important; left:auto !important; top:auto !important;
  width:auto !important; height:auto !important; max-width:100% !important;
  margin:0 !important; justify-self:start; min-width:0;
}
body.zion-shell .sidebar .logo span { display:none !important; }
body.zion-shell .sidebar .logo img,
body.zion-shell .logo .brand-mark {
  width:40px !important; height:40px !important; max-width:40px !important;
  object-fit:cover !important; border-radius:10px; display:block;
}
body.zion-shell .nav-list {
  position:static !important; left:auto !important; top:auto !important;
  width:auto !important; height:auto !important; max-width:100%;
  margin:0 !important; padding:0 !important;
  justify-self:center; justify-content:center !important;
  flex:0 0 auto !important; min-width:0; flex-wrap:nowrap !important;
}
body.zion-shell .nav-item,
body.zion-shell .nav-item[data-view="settings"],
body.zion-shell .nav-item[data-view="lists"],
body.zion-shell .v07-search-nav {
  position:static !important; top:auto !important; right:auto !important; left:auto !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:auto !important; min-width:0 !important; height:40px !important;
  margin:0 2px !important; padding:0 12px !important;
  font-size:18px !important; line-height:1 !important; transform:none !important;
  white-space:nowrap;
}
body.zion-shell .zion-home-facts { justify-self:end; margin:0 !important; min-width:0; max-width:100%; }
body.zion-shell .main { top:64px !important; }
body.zion-home-mode .main { top:0 !important; }
body.zion-shell .nav-item[data-view="favorites"] { display:none !important; }
body.zion-shell .nav-item[data-view="lists"] .nav-icon,
body.zion-shell .nav-item[data-view="settings"] .nav-icon { display:none !important; }
.settings-card .lang { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.settings-card .lang select, #localeSelect {
  width:auto; min-width:220px; max-width:320px; height:48px; margin:0;
  color-scheme:dark; background:#091833; color:#f4f8ff;
  border:1px solid rgba(46,200,255,.5); border-radius:14px; padding:0 14px; font-size:16px;
}
#localeSelect:focus { outline:3px solid rgba(var(--accent-rgb), .95); outline-offset:3px; }
.v07-canvas-art .sidebar {
  background:rgba(5,11,14,.75) !important;
}
.v07-canvas-art .sidebar .nav-item,
.v07-canvas-art .sidebar .zion-home-facts,
.v07-canvas-art .sidebar .zion-home-facts strong,
.v07-canvas-art .sidebar .zion-home-facts small,
.v07-canvas-art .sidebar .zion-refresh {
  opacity:1 !important;
}
#v07RootMediaBackdrop .v07-root-media-backdrop-layer {
  transition:opacity .28s ease;
}
/* Poster fallback uses the same sharp cover as a backdrop. A portrait
   poster is cropped, not blurred or dimmed. */
#v07RootMediaBackdrop[data-art="poster"] .v07-root-media-backdrop-layer {
  background-size:cover !important;
  background-position:center center !important;
  filter:saturate(.85) !important;
  transform:none !important;
}
@media (prefers-reduced-motion: reduce) {
  #v07RootMediaBackdrop .v07-root-media-backdrop-layer { transition:none !important; }
}

/* Shared movie and series detail sheet. The synopsis and long facts stay
   reachable on every access type; the poster and backdrop treatment above
   does not change per source. */
.catalog-movies .v07-hero-description,
.catalog-series .v07-hero-description {
  flex:0 1 auto !important;
  min-height:0 !important;
  max-height:168px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  display:block !important;
  -webkit-line-clamp:unset !important;
}
.catalog-movies .v07-hero-description p,
.catalog-series .v07-hero-description p,
.v07-series-detail-copy .v07-hero-description p {
  max-height:none !important;
  overflow:visible !important;
  display:block !important;
  -webkit-line-clamp:unset !important;
  -webkit-box-orient:unset !important;
}
.v07-series-detail-copy .v07-hero-description,
.v07-series-detail-copy .v07-series-detail-plot {
  max-width:820px !important;
  max-height:none !important;
  overflow:visible !important;
  display:block !important;
  -webkit-line-clamp:unset !important;
  -webkit-box-orient:unset !important;
}
.catalog-movies .v07-hero-description:focus,
.catalog-series .v07-hero-description:focus,
.v07-series-detail-copy .v07-hero-description:focus {
  outline:3px solid rgba(var(--accent-rgb), .98);
  outline-offset:3px;
}
.catalog-movies .v07-movie-facts,
.catalog-series .v07-movie-facts,
.v07-series-detail-copy .v07-movie-facts {
  width:100% !important;
  max-width:870px !important;
  max-height:148px !important;
  margin:13px 0 0 !important;
  overflow:auto !important;
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) !important;
  grid-auto-rows:minmax(18px, auto) !important;
  column-gap:24px !important;
  row-gap:5px !important;
  align-content:start !important;
}
.v07-series-detail-copy .v07-movie-facts { max-height:none !important; overflow:visible !important; }
.catalog-movies .v07-movie-fact,
.catalog-series .v07-movie-fact,
.v07-series-detail-copy .v07-movie-fact {
  min-width:0 !important;
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important;
  font-size:14px !important;
  line-height:1.25 !important;
}
.catalog-movies .v07-movie-fact--wide,
.catalog-series .v07-movie-fact--wide,
.v07-series-detail-copy .v07-movie-fact--wide { grid-column:1 / -1 !important; }
.catalog-movies .v07-movie-fact > span,
.catalog-series .v07-movie-fact > span,
.v07-series-detail-copy .v07-movie-fact > span {
  flex:0 0 auto !important;
  color:rgba(196,210,216,.56) !important;
  font-size:11px !important;
  font-weight:850 !important;
  letter-spacing:.7px !important;
  text-transform:uppercase !important;
}
.catalog-movies .v07-movie-fact > strong,
.catalog-series .v07-movie-fact > strong,
.v07-series-detail-copy .v07-movie-fact > strong {
  min-width:0 !important;
  color:rgba(235,241,243,.86) !important;
  font-weight:650 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:unset !important;
  overflow-wrap:anywhere !important;
}
@media (max-height: 760px) {
  .catalog-movies .v07-hero-description,
  .catalog-series .v07-hero-description { max-height:96px !important; }
  .catalog-movies .v07-movie-facts,
  .catalog-series .v07-movie-facts { max-height:88px !important; }
}
.catalog-movies .v07-meta-chip.zion-rating,
.catalog-series .v07-meta-chip.zion-rating,
.v07-series-detail-copy .v07-meta-chip.zion-rating,
.v07-meta-row .v07-meta-chip.zion-rating {
  color:#e6b325 !important;
}
.zion-hero-play {
  background:var(--accent);
  color:var(--accent-ink);
}
.zion-hero-play:hover { filter:brightness(1.06); }
.zion-hero-play:active { filter:brightness(.92); }
.zion-hero-play:disabled,
.zion-hero-play[disabled] { opacity:.45; }
.zion-hero-play:focus {
  outline:3px solid var(--text);
  outline-offset:3px;
}
.zion-pill.is-selected {
  background:var(--accent);
  color:var(--accent-ink);
  border-color:transparent;
}
.zion-pill:focus,
.zion-pill.is-selected:focus {
  outline:3px solid var(--text);
  outline-offset:3px;
}
#zionImportProgress {
  position:fixed;
  left:28px;
  bottom:24px;
  z-index:40;
  max-width:420px;
  padding:10px 14px;
  border-radius:12px;
  background:rgba(5,11,14,.82);
  color:#f4f7f8;
  font-size:14px;
  pointer-events:none;
}