:root {
  color-scheme: dark;
  --bg: #05070a;
  --panel: #090d12;
  --panel-2: #0d1218;
  --panel-3: #121922;
  --line: #202c38;
  --line-soft: #17212b;
  --text: #f6f8fa;
  --muted: #8796a5;
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  --blue: #2997d6;
  --blue-soft: rgba(41, 151, 214, .12);
  --danger: #e65b45;
  --anime-primary: var(--orange);
  --anime-accent: var(--orange-2);
  --anime-glow: rgba(255, 192, 138, .18);
  --anime-bg: none;
  --radius: 8px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  background: #040609;
  color: var(--text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
}
body.is-home {
  background:
    linear-gradient(90deg, rgba(4,6,9,.36), rgba(4,6,9,.96) 22% 78%, rgba(4,6,9,.36)),
    var(--home-hero-bg, none) center top / cover fixed no-repeat,
    #040609;
}
body.is-home::after {
  content: "";
  position: fixed;
  inset: 68px 0 0;
  z-index: -1;
  pointer-events: none;
  opacity: .6;
  background:
    linear-gradient(90deg, rgba(4,6,9,.2), rgba(4,6,9,.98) 18% 82%, rgba(4,6,9,.2)),
    linear-gradient(180deg, transparent 35%, #040609 94%),
    var(--home-hero-bg, none) left top / max(350px, 25vw) 100% no-repeat,
    var(--home-hero-bg, none) right top / max(350px, 25vw) 100% no-repeat;
}
body.is-home .site-shell {
  width: 100%;
  border-right: 0;
  border-left: 0;
  background: rgba(7,11,16,.96);
}
body.home-intro .site-shell {
  animation: home-shell-intro .9s cubic-bezier(.18,.82,.2,1) both;
}
body.home-intro .home-page > section,
body.home-intro .sidebar,
body.home-intro .topbar {
  animation: home-content-intro .8s cubic-bezier(.18,.82,.2,1) both;
}
body.home-intro .home-page > section:nth-child(2) { animation-delay: .07s; }
body.home-intro .home-page > section:nth-child(3) { animation-delay: .12s; }
@keyframes home-shell-intro {
  from { opacity: 0; transform: translateY(18px) scale(.985); filter: blur(8px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes home-content-intro {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
html:not([data-theme="light"]) body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .25;
  background-image:
    linear-gradient(rgba(255,255,255,.013) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.01) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}
body.is-detail {
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  background:
    linear-gradient(90deg, rgba(3,6,9,.46) 0, rgba(3,6,9,.86) 20%, rgba(3,6,9,.98) 36% 64%, rgba(3,6,9,.86) 80%, rgba(3,6,9,.46) 100%),
    linear-gradient(145deg, color-mix(in srgb, var(--anime-secondary) 58%, transparent) 0 14%, transparent 36%),
    linear-gradient(215deg, color-mix(in srgb, var(--anime-primary) 42%, transparent) 0 12%, transparent 34%),
    linear-gradient(180deg, transparent 0 58%, rgba(3,6,9,.94) 94%),
    var(--anime-bg) center top / cover fixed no-repeat,
    var(--anime-dark, #05070a);
  background-attachment: fixed;
}
body.is-detail .logo-hub {
  background: var(--orange);
}
body.is-detail .site-shell {
  width: min(1180px, calc(100% - 96px));
  grid-template-columns: 168px minmax(0, 1fr);
  border-color: color-mix(in srgb, var(--anime-secondary) 48%, #17222d);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--anime-dark) 74%, #0b1117), rgba(7,11,16,.97) 260px),
    rgba(7,11,16,.96);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.4),
    -24px 0 70px color-mix(in srgb, var(--anime-primary) 22%, transparent),
    24px 0 70px color-mix(in srgb, var(--anime-accent) 18%, transparent),
    0 26px 80px rgba(0,0,0,.64);
}
body.is-detail .topbar {
  grid-template-columns: 168px minmax(260px, 520px) 1fr;
}
html:not([data-theme="light"]) body.is-detail::before {
  opacity: .34;
  background-image:
    linear-gradient(115deg, color-mix(in srgb, var(--anime-primary) 22%, transparent), transparent 24%),
    linear-gradient(245deg, color-mix(in srgb, var(--anime-accent) 18%, transparent), transparent 24%),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 42px 42px, 42px 42px;
  mask-image: linear-gradient(to bottom, black, rgba(0,0,0,.7) 60%, transparent);
}
html:not([data-theme="light"]) body.is-detail::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    var(--anime-bg) left top / max(360px, 27vw) 100% no-repeat,
    var(--anime-bg) right top / max(360px, 27vw) 100% no-repeat;
  filter: saturate(1.12) contrast(1.04) brightness(1.1);
}
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
[hidden] { display: none !important; }
*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-track { background: #080c11; }
*::-webkit-scrollbar-thumb { background: #2b3c4a; border-radius: 20px; }

.site-shell {
  position: relative;
  isolation: isolate;
  width: min(1480px, 100%);
  min-height: 100vh;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 178px minmax(0, 1fr);
  grid-template-rows: 68px 1fr;
  background: var(--panel);
  border-inline: 1px solid #17222d;
  box-shadow: 0 0 70px rgba(0,0,0,.45);
}
.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 178px minmax(260px, 560px) 1fr;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(9,13,18,.98), rgba(11,16,22,.96)),
    rgba(9,13,18,.96);
  backdrop-filter: blur(20px);
  box-shadow: 0 8px 30px rgba(0,0,0,.16);
}
html:not([data-theme="light"]) body.is-detail .topbar {
  border-bottom-color: rgba(255,192,138,.34);
  background:
    linear-gradient(90deg,
      rgba(38,22,8,.96),
      rgba(8,13,18,.97) 31% 69%,
      rgba(36,20,7,.96)),
    #091018;
  box-shadow: 0 10px 34px rgba(0,0,0,.32);
}
.logo {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  width: max-content;
  padding-left: 22px;
  color: white;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -1.1px;
  text-decoration: none;
}
.logo::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: -8px -12px;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(105deg, transparent 25%, rgba(255,255,255,.92) 48%, rgba(255,196,90,.5) 52%, transparent 72%);
  mix-blend-mode: screen;
  transform: translateX(-120%) skewX(-12deg);
  clip-path: inset(0 100% 0 0);
}
body.fox-moment .logo::after {
  animation: fox-logo-shine .78s .06s ease-out both;
}
.logo-anime,
.logo-hub {
  position: relative;
  z-index: 2;
}
.logo-hub {
  margin-left: 2px;
  padding: 1px 4px 2px;
  border-radius: 3px;
  background: var(--orange);
  color: #0a0a0a;
  transform-origin: center;
  transition:
    background .28s ease,
    border-radius .28s ease,
    box-shadow .28s ease,
    transform .28s ease;
}
.logo-tail {
  position: absolute;
  z-index: 1;
  left: 8px;
  right: auto;
  bottom: -9px;
  width: 32px;
  height: 24px;
  background: url("./fox-tail.png") center / contain no-repeat;
  filter: drop-shadow(0 3px 5px rgba(0,0,0,.36));
  opacity: 0;
  pointer-events: none;
  filter: blur(1px);
  transform: translate(7px, -2px) rotate(5deg) scale(.82);
  transform-origin: right top;
  transition:
    opacity .32s ease,
    filter .32s ease,
    transform .42s cubic-bezier(.22,.72,.25,1);
  transition-delay: 0s;
}
.logo:hover .logo-hub,
.logo:focus-visible .logo-hub {
  border-radius: 4px 4px 6px 6px;
  background: linear-gradient(145deg, #ffc08a 0%, #ffb27a 52%, #ff9d68 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.2),
    0 3px 10px rgba(255, 192, 138, .28);
  transform: translateY(0) scale(1.01);
}
.logo:hover .logo-tail,
.logo:focus-visible .logo-tail {
  opacity: 1;
  filter: drop-shadow(0 3px 5px rgba(0,0,0,.36)) blur(0);
  transform: translate(0, 0) rotate(-13deg) scale(1);
  transition-delay: .14s;
}
body.fox-moment .nav a.is-active,
body.fox-moment .nav a[data-nav="home"],
body.fox-moment .round-play {
  animation: fox-accent-pop .9s .12s ease-out both;
}
@keyframes fox-logo-shine {
  0% { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-120%) skewX(-12deg); }
  20% { opacity: .9; }
  70% { opacity: .7; clip-path: inset(0 0 0 0); }
  100% { opacity: 0; clip-path: inset(0 0 0 100%); transform: translateX(115%) skewX(-12deg); }
}
@keyframes fox-accent-pop {
  0%, 100% { filter: none; }
  35% { filter: brightness(1.18); }
}
@media (prefers-reduced-motion: reduce) {
  .logo-hub,
  .logo-tail {
    transition: none;
  }
  body.fox-moment .logo::after,
  body.fox-moment .nav a,
  body.fox-moment .round-play {
    animation: none;
  }
}
.top-search {
  height: 42px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  margin-left: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 11px;
  background: rgba(35,36,40,.92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 8px 22px rgba(0,0,0,.18);
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.top-search input {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  padding: 0 14px 0 2px;
  border: 0;
  outline: 0;
  background: transparent;
  color: white;
  font-size: 14px;
}
.top-search button, .icon-button {
  border: 0;
  background: transparent;
  color: #b6b7b7;
}
.top-search button {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  width: 42px;
  height: 42px;
  font-size: 0;
  color: #a9abb2;
}
.top-search button::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  margin: auto;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.top-search button::after {
  content: none;
}
.top-actions {
  position: relative;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-right: 18px;
}
.icon-button { width: 34px; height: 34px; }
.notification-button {
  position: relative;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(13,17,22,.74);
  color: var(--muted);
}
.notification-button:hover,
.notification-button.is-active {
  border-color: color-mix(in srgb, var(--orange) 58%, var(--line));
  color: var(--orange);
}
.notification-button b {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--orange);
  color: #111;
  font-size: 8px;
  font-weight: 900;
}
.notifications-popover {
  position: absolute;
  top: calc(100% + 12px);
  right: 70px;
  z-index: 30;
  width: min(340px, calc(100vw - 24px));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(9,12,16,.96);
  box-shadow: 0 22px 50px rgba(0,0,0,.42);
}
.notifications-popover header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}
.notifications-popover header button {
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
}
.notifications-list { display: grid; max-height: 360px; overflow-y: auto; }
.notifications-list > p {
  margin: 0;
  padding: 22px 14px;
  color: var(--muted);
  font-size: 10px;
}
.notification-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}
.notification-item img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
}
.notification-item strong { display: block; font-size: 10px; }
.notification-item p { margin: 3px 0 8px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.notification-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.notification-actions button {
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #14181e;
  color: #d8d8d6;
  font-size: 9px;
  font-weight: 800;
}
.notification-actions button:first-child {
  border-color: var(--orange);
  background: var(--orange);
  color: #111;
}
.theme-toggle {
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--panel-3);
  color: var(--orange);
  font-size: 17px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.theme-toggle:hover { transform: rotate(12deg) scale(1.05); }
html:not([data-theme="light"]) .theme-toggle:hover {
  border-color: rgba(41,151,214,.55);
}
html:not([data-theme="light"]) .poster-card:hover,
html:not([data-theme="light"]) .mini-card:hover,
html:not([data-theme="light"]) .favorite-card:hover {
  border-color: color-mix(in srgb, var(--orange) 58%, var(--line));
  box-shadow: 0 12px 30px rgba(0,0,0,.42);
}
html:not([data-theme="light"]) .tabs button:not(.is-active),
html:not([data-theme="light"]) .library-tabs button:not(.is-active) {
  color: #8296a8;
}
html:not([data-theme="light"]) .search-modal {
  background: rgba(2,5,8,.86);
}
html:not([data-theme="light"]) .round-play:hover,
html:not([data-theme="light"]) .accent-button:hover,
html:not([data-theme="light"]) .watch-button:hover {
  filter: brightness(1.1);
}
html:not([data-theme="light"]) .top-search:focus-within {
  border-color: rgba(255,192,138,.62);
  background: rgba(40,40,44,.98);
  box-shadow: 0 0 0 3px rgba(255,192,138,.08), 0 10px 28px rgba(0,0,0,.24);
}
html:not([data-theme="light"]) .watch-sidebar section {
  border-color: #22313e;
}
html:not([data-theme="light"]) .watch-sidebar section:hover,
html:not([data-theme="light"]) .settings-groups section:hover,
html:not([data-theme="light"]) .profile-summary:hover {
  border-color: #2c4050;
}
html:not([data-theme="light"]) .episode-card {
  box-shadow: inset 0 -26px 40px rgba(4,8,12,.34);
}
html:not([data-theme="light"]) .episode-card:hover {
  border-color: rgba(41,151,214,.6);
  transform: translateY(-1px);
}
html:not([data-theme="light"]) .episode-card.is-active {
  border-color: var(--orange);
  box-shadow: inset 0 -26px 40px rgba(4,8,12,.3);
}
html:not([data-theme="light"]) .player-head,
html:not([data-theme="light"]) .tabs,
html:not([data-theme="light"]) .sidebar-episodes__head {
  border-color: #1e2b36;
}
.profile-button {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 0;
  background: transparent;
  color: #d8d8d6;
}
.profile-avatar, .settings-avatar {
  display: block;
  overflow: hidden;
  border: 1px solid #9a541a;
  border-radius: 50%;
  background: #090d12;
  object-fit: cover;
}
.profile-avatar { width: 38px; height: 38px; }

.sidebar {
  position: sticky;
  top: 68px;
  grid-column: 1;
  grid-row: 2;
  height: calc(100vh - 68px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 0;
  background: transparent;
}
.nav { display: grid; gap: 3px; padding: 15px 11px; }
.nav a, .nav button {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  min-height: 39px;
  padding: 0 12px;
  border: 0;
  border-left: 2px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: #a2a4a4;
  text-align: left;
  text-decoration: none;
  font-size: 12px;
}
.nav a span, .nav button span { color: #d6d6d4; font-size: 15px; }
.nav a:hover,
.nav button:hover,
.nav a.is-active {
  border-left-color: transparent;
  background: rgba(255,255,255,.045);
  color: #fff;
}
.nav a:hover span,
.nav button:hover span,
.nav a.is-active span { color: #fff; }
.nav--footer { border-top: 0; }
.nav-mobile-settings { display: none !important; }

.home-page, .detail-page {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  padding: 18px;
}
.section-head, .page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.section-head h2 { margin: 0; font-size: 17px; }
.page-heading h1 { margin: 0; font-size: 28px; }
.eyebrow {
  margin: 0 0 5px;
  color: var(--orange);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .9px;
  text-transform: uppercase;
}
.link-button, .danger-link {
  border: 0;
  background: transparent;
  color: #a3a5a5;
  font-size: 12px;
}
.danger-link { color: var(--orange); }

.continue-card {
  position: relative;
  isolation: isolate;
  margin-bottom: 22px;
}
.continue-card .section-head { display: none; }
.watch-progress {
  position: relative;
  min-height: 292px;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(270px, 44%) minmax(0, 1fr) 52px;
  align-items: center;
  gap: 24px;
  padding: 28px 36px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    linear-gradient(90deg, #080d12 0%, rgba(8,13,18,.95) 32%, rgba(8,13,18,.38) 72%, #080d12 100%),
    var(--hero-bg, none) right center / 68% auto no-repeat,
    #0a1016;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 18px 45px rgba(0,0,0,.22);
}
.hero-carousel.watch-progress {
  min-height: clamp(390px, 46vw, 560px);
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 28px;
  padding: 54px 52px;
  border-radius: 0 0 18px 18px;
  background:
    linear-gradient(90deg, rgba(3,6,9,.96) 0%, rgba(3,6,9,.8) 38%, rgba(3,6,9,.18) 72%, rgba(3,6,9,.5) 100%),
    linear-gradient(180deg, rgba(3,6,9,.05) 35%, rgba(3,6,9,.92) 100%),
    var(--hero-bg, none) center / cover no-repeat,
    #080d12;
  box-shadow: 0 22px 60px rgba(0,0,0,.42);
  animation: hero-breathe 7s ease-in-out infinite alternate;
}
.hero-carousel__video-shell {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  opacity: 1;
  pointer-events: none;
}
.hero-carousel__video-shell iframe {
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: max(100%, 177.78vh);
  min-width: 112%;
  height: max(100%, 56.25vw);
  min-height: 112%;
  aspect-ratio: auto;
  border: 0;
  pointer-events: none;
  filter: brightness(1.13) saturate(1.12) contrast(1.03);
  transform: translate(-50%, -50%) scale(1.08);
}
.hero-carousel__video-shell video {
  position: absolute;
  z-index: 0;
  inset: 50% auto auto 50%;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  border: 0;
  object-fit: cover;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.hero-carousel.has-hero-video::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: none;
}
.hero-carousel.has-hero-video {
  animation: none;
  background: var(--hero-bg, none) center / cover no-repeat, #080d12;
}
.hero-carousel.has-hero-video > *:not(.hero-carousel__video-shell) {
  z-index: 2;
}
.hero-carousel .hero-carousel__copy {
  max-width: 570px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  text-shadow: 0 2px 9px rgba(0,0,0,.92);
}
.hero-carousel.watch-progress h3 {
  max-width: 620px;
  margin: 10px 0 10px;
  font-size: clamp(34px, 4vw, 54px);
  line-height: 1.02;
  letter-spacing: -1.6px;
  text-wrap: balance;
}
.hero-carousel__eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #b8bac1 !important;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero-carousel__eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 12px rgba(255,192,138,.58);
}
.hero-carousel__facts {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 14px;
  color: #c3c5ca;
  font-size: 12px;
  font-weight: 650;
}
.hero-carousel__score {
  color: #ffd7ad;
}
.hero-carousel__genre {
  padding: 4px 9px;
  border: 1px solid rgba(255,192,138,.22);
  border-radius: 6px;
  background: rgba(255,192,138,.12);
  color: #ffc08a;
}
.hero-carousel .hero-carousel__description {
  max-width: 500px;
  color: #c0c2c7;
  font-size: 13px;
  line-height: 1.55;
}
.hero-carousel .round-play {
  width: 154px;
  min-width: 154px;
  max-width: 154px;
  justify-self: end;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 25px;
  border-radius: 28px;
  background: #fff;
  color: #121722;
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
  box-shadow: 0 8px 28px rgba(0,0,0,.34);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.hero-carousel .round-play span { font-size: 15px; }
.hero-carousel .round-play:hover {
  background: var(--orange);
  transform: scale(1.08);
  box-shadow: 0 11px 34px rgba(0,0,0,.45);
}
@keyframes hero-breathe {
  from { background-size: auto, auto, 104% auto, auto; }
  to { background-size: auto, auto, 112% auto, auto; }
}
.watch-progress::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 2px;
  background: linear-gradient(90deg, var(--orange) 0 18%, transparent 18%);
}
html:not([data-theme="light"]) .watch-progress {
  border-color: rgba(255,128,0,.31);
  box-shadow: inset 0 1px 0 rgba(255,194,96,.06), 0 18px 45px rgba(0,0,0,.28);
}
.watch-progress > * { position: relative; z-index: 1; }
.watch-progress > .hero-carousel__video-shell {
  position: absolute;
  z-index: 0;
  inset: 0;
}
.hero-carousel > .hero-carousel__copy,
.hero-carousel > .round-play {
  min-width: 0;
}
.progress-cover { display: none; }
.watch-progress h3 { margin: 6px 0 9px; font-size: clamp(27px, 4vw, 42px); line-height: 1; }
.watch-progress p { margin: 0; color: #b8b9b8; line-height: 1.55; }
.hero-carousel__meta { color: #fff !important; font-weight: 700; font-size: 12px; }
.hero-carousel__description {
  max-width: 480px;
  margin-top: 13px !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 12px;
}
.progress-line { display: none; }
.round-play {
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 6px;
  background: var(--orange);
  color: #0a0a0a;
}

.poster-section {
  position: relative;
  isolation: isolate;
  margin-top: 24px;
}
.poster-grid, .results, .library-grid, .catalog-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}
.poster-grid--new {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.poster-card, .mini-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: linear-gradient(160deg, #111820, #0b1016 78%);
  color: #fff;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.poster-grid:not(.poster-grid--new) .poster-card,
.catalog-grid .poster-card,
.results .poster-card {
  aspect-ratio: 2 / 3;
  border-radius: 12px;
  background: #080b0f;
}
.poster-grid:not(.poster-grid--new) .poster-card::after,
.catalog-grid .poster-card::after,
.results .poster-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 42%, rgba(3,5,8,.38) 62%, rgba(3,5,8,.96) 100%);
  transition: background .25s ease;
}
.poster-grid:not(.poster-grid--new) .poster-card:hover::after,
.catalog-grid .poster-card:hover::after,
.results .poster-card:hover::after {
  background: linear-gradient(180deg, rgba(3,5,8,.08), rgba(3,5,8,.6) 54%, rgba(3,5,8,.98) 100%);
}
.poster-grid:not(.poster-grid--new) .poster-card > img,
.catalog-grid .poster-card > img,
.results .poster-card > img,
.poster-grid:not(.poster-grid--new) .poster-card > .poster-fallback,
.catalog-grid .poster-card > .poster-fallback,
.results .poster-card > .poster-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  transition: transform .35s ease, filter .35s ease;
}
.poster-grid:not(.poster-grid--new) .poster-card:hover > img,
.catalog-grid .poster-card:hover > img,
.results .poster-card:hover > img {
  transform: scale(1.09);
  filter: saturate(1.08);
}
.poster-grid:not(.poster-grid--new) .poster-card > strong,
.catalog-grid .poster-card > strong,
.results .poster-card > strong {
  position: absolute;
  right: 10px;
  bottom: 31px;
  left: 10px;
  z-index: 2;
  min-height: 0;
  margin: 0;
  padding: 0;
  font-size: 13px;
  text-shadow: 0 2px 9px rgba(0,0,0,.9);
}
.poster-grid:not(.poster-grid--new) .poster-card > small,
.catalog-grid .poster-card > small,
.results .poster-card > small {
  position: absolute;
  right: 10px;
  bottom: 11px;
  left: 10px;
  z-index: 2;
  padding: 0;
  overflow: hidden;
  color: #c8d1d9;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.poster-grid:not(.poster-grid--new) .poster-card .badge,
.catalog-grid .poster-card .badge,
.results .poster-card .badge {
  z-index: 4;
  border-radius: 7px;
  background: rgba(5,8,12,.66);
  backdrop-filter: blur(8px);
}
.poster-grid:not(.poster-grid--new) .poster-card,
.catalog-grid .poster-card {
  opacity: 0;
  animation: card-rise .42s ease forwards;
}
.poster-grid:not(.poster-grid--new) .poster-card:nth-child(2n),
.catalog-grid .poster-card:nth-child(2n) { animation-delay: .035s; }
.poster-grid:not(.poster-grid--new) .poster-card:nth-child(3n),
.catalog-grid .poster-card:nth-child(3n) { animation-delay: .07s; }
.poster-grid:not(.poster-grid--new) .poster-card:nth-child(4n),
.catalog-grid .poster-card:nth-child(4n) { animation-delay: .105s; }
@keyframes card-rise {
  from { opacity: 0; filter: blur(4px); }
  to { opacity: 1; filter: blur(0); }
}
.poster-card:hover, .mini-card:hover {
  transform: translateY(-3px);
  border-color: #5a3b18;
  box-shadow: 0 10px 25px rgba(0,0,0,.35);
}
.poster-card img, .poster-fallback {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 2.82;
  object-fit: cover;
  background: linear-gradient(145deg, #251d19, #5a3d2d);
}
.poster-fallback { display: grid; place-items: center; font-size: 34px; font-weight: 900; color: var(--orange); }
.poster-card strong, .poster-card small { display: block; padding-inline: 9px; }
.poster-card strong {
  min-height: 31px;
  margin-top: 8px;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.3;
}
.poster-card small { padding-bottom: 9px; color: var(--muted); font-size: 10px; }
.poster-card__overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 14px 11px 11px;
  background:
    linear-gradient(180deg, rgba(5,5,5,.12), rgba(5,5,5,.72) 38%, rgba(5,5,5,.97) 100%);
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.poster-card--catalog:hover .poster-card__overlay,
.poster-card--catalog:focus-within .poster-card__overlay {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.poster-card__overlay p {
  margin: 0 0 10px;
  overflow: hidden;
  color: #ddd;
  font-size: 9px;
  line-height: 1.48;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
}
.card-favorite {
  width: 100%;
  min-height: 32px;
  border: 1px solid #31363e;
  border-radius: 6px;
  background: #171b21;
  color: #f1f3f5;
  font-size: 9px;
  font-weight: 800;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.35);
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.card-favorite:hover,
.card-favorite.is-active {
  border-color: rgba(255,164,119,.72);
  background: #1f2228;
  color: var(--orange-2);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.22), 0 0 0 1px rgba(255,164,119,.12);
}
.card-favorite:disabled { opacity: .55; cursor: wait; }
.badge {
  position: absolute;
  top: 7px;
  left: 7px;
  padding: 3px 6px;
  border-radius: 3px;
  background: rgba(5,5,5,.82);
  color: #ddd;
  font-size: 9px;
  font-weight: 700;
}
#reloadCatalog { color: var(--orange); }
.continue-item {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #0d0e0e;
  color: white;
  transition: transform .18s ease, border-color .18s ease;
}
.continue-item:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--orange) 45%, var(--line));
}
.continue-item__cover {
  position: relative;
  height: 96px;
  overflow: hidden;
  background: #151616;
}
.continue-item__cover img,
.continue-item__cover .poster-fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: auto;
}
.continue-item__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 35%, rgba(0,0,0,.72));
}
.continue-item__cover > span {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  color: white;
  font-size: 18px;
  text-shadow: 0 2px 12px #000;
}
.continue-item__body { position: relative; padding: 8px 9px 10px; }
.continue-item__body strong {
  display: block;
  min-height: 30px;
  overflow: hidden;
  font-size: 11px;
  line-height: 1.35;
}
.continue-item__body small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.continue-item__progress {
  height: 3px;
  margin-top: 9px;
  overflow: hidden;
  border-radius: 10px;
  background: #292a2a;
}
.continue-item__progress span {
  display: block;
  width: var(--continue-progress, 0%);
  height: 100%;
  background: var(--orange);
}
.continue-item__body b {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 500;
}
.continue-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 24px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  text-align: center;
  font-size: 11px;
}
.poster-grid--new .poster-card {
  min-height: 116px;
  display: grid;
  grid-template-columns: 43% 1fr;
  align-items: end;
}
.poster-grid--new .poster-card img, .poster-grid--new .poster-fallback {
  grid-row: 1 / 4;
  height: 116px;
  aspect-ratio: auto;
}
.poster-grid--new .poster-card strong { align-self: end; }
.poster-grid--new .badge { left: calc(43% + 7px); }
.search-section:has(#searchResults:empty) { display: none; }

.catalog-section, .library-section, .settings-section { min-height: 72vh; }
.catalog-toolbar {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 9px;
  margin-bottom: 18px;
}
.catalog-toolbar label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
}
.catalog-toolbar select {
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  outline: 0;
  background: #101111;
  color: #ddd;
}
.view-switch { display: flex; gap: 5px; }
.view-switch button {
  width: 34px; height: 34px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #101111;
  color: #888;
}
.view-switch .is-active { color: var(--orange); border-color: #6a4634; }
.catalog-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.load-more-episodes {
  display: block;
  min-height: 38px;
  margin: 20px auto 0;
  padding: 0 18px;
  border: 1px solid #704c38;
  border-radius: 5px;
  background: rgba(255,192,138,.08);
  color: var(--orange);
}

.library-tabs { display: flex; gap: 26px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
.library-tabs button {
  padding: 0 0 11px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
}
.library-tabs button.is-active { border-color: var(--orange); color: white; }
.library-section #favoritesGrid {
  grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
  gap: 14px;
  align-items: start;
}
.favorite-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: linear-gradient(160deg, #111820, #0b1016);
  color: white;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.favorite-card:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--orange) 45%, var(--line));
  box-shadow: 0 12px 28px rgba(0,0,0,.38);
}
.favorite-card__cover {
  position: relative;
  overflow: hidden;
  aspect-ratio: 2 / 2.85;
  background: #151616;
}
.favorite-card__cover::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 32%;
  background: linear-gradient(transparent, rgba(5,5,5,.9));
  pointer-events: none;
}
.favorite-card__cover img,
.favorite-card__cover .poster-fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: auto;
}
.favorite-card__body { padding: 10px; }
.favorite-card__body strong {
  display: block;
  min-height: 32px;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.35;
}
.favorite-card__body p {
  min-height: 14px;
  margin: 5px 0 9px;
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.favorite-card__body > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.favorite-card__body span { color: var(--orange); font-size: 10px; font-weight: 800; }
.favorite-card__body small { color: var(--muted); font-size: 9px; }
.favorite-remove {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 2;
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  background: rgba(7,7,7,.82);
  color: #bbb;
  font-size: 17px;
  opacity: 0;
  transition: opacity .18s ease, color .18s ease, background .18s ease;
}
.favorite-card:hover .favorite-remove,
.favorite-remove:focus-visible { opacity: 1; }
.favorite-remove:hover { background: #7c251d; color: white; }
.mini-card {
  display: grid;
  grid-template-columns: 86px 1fr;
  gap: 10px;
  min-height: 118px;
  padding: 8px;
}
.mini-card img, .mini-card .poster-fallback { width: 86px; height: 100px; aspect-ratio: auto; border-radius: 4px; }
.mini-card span { color: var(--orange); font-size: 11px; }
.mini-card strong { display: block; margin: 9px 0 5px; font-size: 12px; }
.mini-card small { color: var(--muted); font-size: 10px; }
.history-list { display: grid; }
.history-card {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr) 44px;
  gap: 14px;
  align-items: center;
  min-height: 82px;
  padding: 8px 6px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(18,25,34,.46), transparent 72%);
  color: white;
}
.history-card__poster { width: 78px; height: 58px; overflow: hidden; border-radius: 4px; }
.history-card__poster img, .history-card__poster .poster-fallback { width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; }
.history-card__body { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(100px, .6fr) minmax(120px, .8fr); gap: 14px; align-items: center; }
.history-card__body > span { grid-column: 3; grid-row: 1; justify-self: end; color: var(--muted); font-size: 10px; }
.history-card__body strong { grid-column: 1; grid-row: 1; font-size: 12px; }
.history-card__body p { grid-column: 1; grid-row: 2; margin: 0; color: var(--muted); font-size: 10px; }
.history-card__meta { grid-column: 2; grid-row: 1 / 3; }
.history-card__meta b { display: block; color: #ddd; font-size: 10px; }
.history-card__meta small {
  display: block;
  height: 3px;
  margin-top: 8px;
  overflow: hidden;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--orange) 0 var(--history-progress, 0%), #272828 var(--history-progress, 0%));
  color: transparent;
}
.profile-summary {
  display: grid;
  grid-template-columns: 84px 1fr auto;
  gap: 15px;
  align-items: center;
  margin-bottom: 12px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel-2);
}
.settings-avatar { width: 84px; height: 84px; }
.profile-summary h2 { margin: 0 0 5px; font-size: 16px; }
.profile-summary p { margin: 0; color: var(--orange); font-size: 11px; }
.profile-summary__email {
  margin-bottom: 5px !important;
  color: #aeb8c2 !important;
  font-size: 13px !important;
}
.profile-summary.is-authenticated {
  grid-template-columns: 1fr;
  justify-items: center;
  padding: 24px;
  text-align: center;
}
.profile-summary.is-authenticated .settings-avatar {
  width: 104px;
  height: 104px;
}
.profile-summary.is-authenticated .profile-summary__identity {
  display: grid;
  justify-items: center;
}
.profile-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.profile-stats article {
  min-width: 0;
  padding: 13px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #10171f;
}
.profile-stats strong {
  display: block;
  margin-bottom: 5px;
  color: var(--orange);
  font-size: 20px;
  line-height: 1;
}
.profile-stats span {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.35;
  text-overflow: ellipsis;
}
.accent-button {
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid #5e3612;
  border-radius: 5px;
  background: rgba(255,192,138,.12);
  color: var(--orange);
}
.settings-groups { display: grid; gap: 12px; }
.settings-groups section { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); }
.settings-groups label, .settings-groups section > button {
  width: 100%;
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 14px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  background: linear-gradient(180deg, #111820, #0e151c);
  color: #d3d4d4;
  text-align: left;
  font-size: 12px;
}
.settings-groups section > *:last-child { border-bottom: 0; }
.settings-groups input { accent-color: var(--orange); }
.anime4k-gpu-setting select {
  max-width: 220px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 6px;
  background: #0a0f15;
  color: #f2f2f2;
  font-size: 12px;
  font-weight: 800;
}
.anime4k-gpu-hint {
  margin: 0;
  padding: 10px 14px 12px;
  border-bottom: 1px solid var(--line-soft);
  background: #0b1118;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}
.my-comments-section {
  margin-top: 18px;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(160deg, #111820, #0b1016);
}
.my-comments-section .section-head { margin-bottom: 4px; }
.my-comments-section .section-head h2 { font-size: 17px; }
.my-comments-section .section-head > span {
  min-width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(255,192,138,.12);
  color: var(--orange);
  font-size: 10px;
}
.my-comments-list { display: grid; }
.my-comment-card {
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}
.my-comment-card:last-child { border-bottom: 0; }
.my-comment-card > div,
.my-comment-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.my-comment-card > div span { color: var(--orange); font-size: 10px; font-weight: 800; }
.my-comment-card time { color: var(--muted); font-size: 8px; }
.my-comment-card p {
  margin: 8px 0;
  color: #d0d1d0;
  font-size: 11px;
  line-height: 1.5;
}
.my-comment-card footer span { color: var(--muted); font-size: 8px; }
.my-comment-card footer button {
  padding: 0;
  border: 0;
  background: transparent;
  color: #bbb;
  font-size: 9px;
}
.my-comment-card footer button:hover { color: var(--orange); }

.detail-page {
  position: relative;
  isolation: isolate;
  padding-top: 10px;
}
.anime-aura-canvas {
  position: fixed;
  z-index: 2;
  top: 68px;
  bottom: 0;
  left: var(--aura-shell-left, 0);
  right: auto;
  width: var(--aura-shell-width, 100vw) !important;
  height: calc(100vh - 68px);
  pointer-events: none;
  mix-blend-mode: screen;
  display: none;
  clip-path: inset(0);
  transform: none;
}
.detail-page::before,
.detail-page::after {
  display: none !important;
  content: none !important;
}
.detail-page::before {
  top: 68px;
  bottom: 0;
  left: var(--aura-shell-left, 0);
  right: auto;
  width: var(--aura-shell-width, 100vw);
  opacity: .9;
  background:
    radial-gradient(circle at 12% 38%, color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 64%, transparent), transparent 35%),
    radial-gradient(circle at 88% 64%, color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 54%, transparent), transparent 38%);
  filter: saturate(1.5);
  animation: none;
}
.detail-page::after {
  top: 68px;
  left: var(--aura-shell-left, 0);
  right: auto;
  width: var(--aura-shell-width, 100vw);
  height: 64vh;
  opacity: .75;
  background:
    conic-gradient(from 90deg at 50% 50%, transparent, color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 52%, transparent), transparent 36%, color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 48%, transparent), transparent 72%);
  filter: blur(48px) saturate(1.55);
  animation: none;
}
.watch-layout,
.detail-page > section,
.detail-page > div:not(.anime-aura-canvas) {
  position: relative;
  z-index: 3;
}
body.is-detail .topbar,
body.is-detail .sidebar {
  z-index: 5;
}
body[data-anime-aura="fire"] .detail-page::before {
  background:
    radial-gradient(circle at 10% 82%, rgba(255,45,8,.82), transparent 38%),
    radial-gradient(circle at 88% 18%, rgba(255,188,28,.66), transparent 34%),
    linear-gradient(125deg, rgba(255,33,0,.26), transparent 48%, rgba(255,139,0,.22));
}
body[data-anime-aura="shadow"] .detail-page::before {
  opacity: 1;
  background:
    radial-gradient(ellipse at 14% 55%, rgba(116,43,255,.9), transparent 40%),
    radial-gradient(ellipse at 84% 30%, rgba(19,142,255,.72), transparent 43%),
    linear-gradient(150deg, rgba(17,3,56,.94), transparent 62%);
  filter: blur(16px) saturate(1.45);
}
body[data-anime-aura="smoke"] .detail-page::before {
  opacity: .88;
  background:
    radial-gradient(ellipse at 8% 72%, rgba(219,196,170,.58), transparent 43%),
    radial-gradient(ellipse at 90% 25%, rgba(255,67,34,.55), transparent 38%),
    linear-gradient(135deg, rgba(109,91,75,.38), transparent 58%);
  filter: blur(26px) contrast(1.15);
}
body[data-anime-aura="leaves"] .detail-page::before {
  background:
    radial-gradient(circle at 13% 42%, rgba(255,166,7,.86), transparent 38%),
    radial-gradient(circle at 88% 72%, rgba(96,196,50,.58), transparent 39%),
    linear-gradient(125deg, rgba(255,111,0,.22), transparent 48%, rgba(30,145,255,.16));
}
body[data-anime-aura="comet"] .detail-page::before {
  opacity: 1;
  background:
    radial-gradient(circle at 78% 12%, rgba(80,205,255,.88), transparent 31%),
    radial-gradient(circle at 20% 82%, rgba(255,77,202,.72), transparent 39%),
    linear-gradient(160deg, rgba(19,21,101,.9), transparent 58%);
}
body[data-anime-aura="flash"] .detail-page::before {
  background:
    radial-gradient(circle at 13% 44%, rgba(255,228,20,.92), transparent 36%),
    radial-gradient(circle at 90% 58%, rgba(255,75,25,.68), transparent 35%);
}
html:not([data-theme="light"]) body.is-detail .player-card,
html:not([data-theme="light"]) body.is-detail .anime-hero,
html:not([data-theme="light"]) body.is-detail .watch-sidebar section,
html:not([data-theme="light"]) body.is-detail .episodes-section {
  backdrop-filter: none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 18px 46px rgba(0,0,0,.38);
}
html:not([data-theme="light"]) body.is-detail .player-card {
  animation: none;
}
@keyframes aura-orbit {
  0% { transform: translate3d(-4%, -2%, 0) scale(1); }
  100% { transform: translate3d(5%, 4%, 0) scale(1.12); }
}
@keyframes aura-sweep {
  to { transform: rotate(360deg) scale(1.12); }
}
@keyframes aura-card-pulse {
  from {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      0 20px 54px rgba(0,0,0,.42),
      0 0 28px color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 24%, transparent);
  }
  to {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      0 24px 62px rgba(0,0,0,.46),
      0 0 58px color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 48%, transparent),
      0 0 96px color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 24%, transparent);
  }
}
html:not([data-theme="light"]) body.is-detail .detail-page {
  background: transparent;
}
html:not([data-theme="light"]) body.is-detail .site-shell {
  background:
    radial-gradient(circle at 9% 42%, color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 78%, transparent), transparent 38%),
    radial-gradient(circle at 91% 62%, color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 68%, transparent), transparent 40%),
    linear-gradient(110deg,
      color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 30%, transparent),
      transparent 34% 66%,
      color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 26%, transparent)),
    linear-gradient(145deg,
      color-mix(in srgb, var(--aura-primary, var(--anime-primary)) 30%, #090d12),
      #080d12 45%,
      color-mix(in srgb, var(--aura-secondary, var(--anime-accent)) 28%, #080d12));
  background-attachment: scroll;
}
.watch-layout { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 12px; }
.player-card, .anime-hero, .watch-sidebar section, .episodes-section {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(155deg, rgba(18,25,34,.96), rgba(9,14,19,.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.022), 0 14px 35px rgba(0,0,0,.16);
}
.player-card {
  position: relative;
  overflow: hidden;
}
.watch-party-toggle {
  position: absolute;
  z-index: 24;
  top: 14px;
  right: 22px;
  left: auto;
  height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  background: rgba(7,11,16,.64);
  color: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
  backdrop-filter: blur(14px) saturate(1.25);
  transition: transform .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
}

.anime4k-stage > .watch-party-toggle,
.anime4k-stage:fullscreen > .watch-party-toggle {
  top: 18px !important;
  right: 22px !important;
  left: auto !important;
}
.watch-party-toggle:hover,
.watch-party-toggle[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--orange) 72%, #fff);
  background: color-mix(in srgb, var(--orange) 26%, rgba(7,11,16,.82));
  transform: translateY(-1px);
}
.player-card.is-party-open .watch-party-toggle {
  opacity: 0;
  pointer-events: none;
}
.player-card.is-kodik .watch-party-toggle,
.player-card.is-kodik .css-filter-control {
  display: none;
}
.watch-party-toggle__icon {
  width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  border: 2px solid currentColor;
  border-radius: 50%;
  font-size: 0;
}
.watch-party-toggle__icon::before,
.watch-party-toggle__icon::after {
  content: "";
  display: block;
  background: currentColor;
  border-radius: 50%;
}
.watch-party-toggle__icon::before { width: 5px; height: 5px; transform: translate(-3px, 1px); }
.watch-party-toggle__icon::after { width: 4px; height: 4px; transform: translate(4px, -4px); }
.watch-party-toggle__label { font-size: 11px; font-weight: 800; }
.watch-party-toggle__badge {
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--orange);
  color: #111;
  font-size: 9px;
  font-weight: 900;
}
.watch-party-panel {
  position: absolute;
  z-index: 23;
  top: 12px;
  right: 14px;
  bottom: 12px;
  left: auto;
  width: min(360px, calc(100% - 28px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: visible;
  border: 0;
  background: transparent;
  color: #fff;
  box-shadow: none;
  backdrop-filter: none;
  pointer-events: none;
}
.watch-party-panel[hidden] { display: none !important; }
@keyframes watch-party-in {
  from { opacity: 0; transform: translateX(18px); }
  to { opacity: 1; transform: translateX(0); }
}
.watch-party-panel__head {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 10px;
  border-bottom: 0;
  background: transparent;
  pointer-events: auto;
  text-shadow: 0 2px 8px rgba(0,0,0,.7);
}
.watch-party-panel__head div { min-width: 0; display: grid; gap: 2px; }
.watch-party-panel__head small {
  color: color-mix(in srgb, var(--orange) 78%, #fff);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .8px;
  text-transform: uppercase;
}
.watch-party-panel__head strong {
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.watch-party-panel__head button {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 50%;
  background: rgba(255,255,255,.1);
  color: #fff;
  font-size: 20px;
  cursor: pointer;
}
.watch-party-lobby {
  align-self: center;
  display: grid;
  gap: 13px;
  padding: 16px 0;
  text-align: center;
  pointer-events: auto;
}
.watch-party-lobby p {
  margin: 0;
  color: rgba(235,241,246,.76);
  font-size: 11px;
  line-height: 1.55;
}
.watch-party-lobby button {
  min-height: 40px;
  border: 1px solid #303640;
  border-radius: 999px;
  background: #171b21;
  color: #f5f6f8;
  font-size: 11px;
  font-weight: 900;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36);
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.watch-party-lobby button:hover,
.watch-party-room__bar button:hover,
.watch-party-form button:hover {
  border-color: rgba(255,164,119,.66);
  background: #20242b;
  color: var(--orange-2);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.1);
}
#watchPartyLobbyHint,
.watch-party-hint {
  min-height: 15px;
  margin: 0;
  color: rgba(235,241,246,.58);
  font-size: 9px;
}
.watch-party-room {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto 1fr auto auto;
  align-content: stretch;
  gap: 10px;
}
.watch-party-room[hidden] { display: none !important; }
.watch-party-room__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0;
  border-bottom: 0;
  pointer-events: auto;
  text-shadow: 0 2px 8px rgba(0,0,0,.7);
}
.watch-party-room__bar span { display: flex; align-items: center; gap: 6px; font-size: 10px; }
.watch-party-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #38df7b;
  box-shadow: 0 0 10px rgba(56,223,123,.75);
}
.watch-party-room__bar button {
  border: 1px solid #303640;
  border-radius: 999px;
  background: #171b21;
  color: #f5f6f8;
  padding: 0 16px;
  min-height: 38px;
  font-size: 9px;
  font-weight: 900;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36);
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.watch-party-room__bar button:hover,
.watch-party-room__bar button:focus-visible {
  border-color: rgba(255,164,119,.66);
  background: #20242b;
  color: var(--orange-2);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.1);
}
.watch-party-share-link {
  padding: 0;
  pointer-events: auto;
}
.watch-party-share-link input {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 12px;
  background: rgba(0,0,0,.32);
  color: rgba(255, 255, 255, .72);
  padding: 11px 12px;
  font: 800 10px/1.2 inherit;
  outline: none;
}
.watch-party-share-link input:focus {
  border-color: var(--orange);
  color: #fff;
}
.watch-party-friends {
  display: grid;
  gap: 8px;
  pointer-events: auto;
}
.watch-party-friends[hidden] { display: none !important; }
.watch-party-friends__list {
  display: grid;
  gap: 8px;
}
.watch-party-friends__list button {
  width: 100%;
  min-height: 48px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 5px 12px;
  border: 1px solid #303640;
  border-radius: 14px;
  background: #171b21;
  color: #fff;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}
.watch-party-friends__list button:hover {
  border-color: rgba(255,164,119,.58);
  background: #20242b;
  transform: translateY(-1px);
}
.watch-party-friends__list img,
.watch-party-friends__list .avatar {
  width: 38px;
  height: 38px;
  border-radius: 12px;
}
.watch-party-friends__list b {
  overflow: hidden;
  color: var(--orange);
  font-size: 10px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.watch-party-friend.is-invited .watch-party-friend__action {
  color: rgba(235,241,246,.62);
}
.watch-party-friends__list span,
.watch-party-friends__empty,
#watchPartyFriendsHint {
  color: rgba(235,241,246,.58);
  font-size: 10px;
}
.watch-party-messages {
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 4px 0;
  scrollbar-width: thin;
  pointer-events: auto;
}
.watch-party-empty {
  margin: auto;
  color: rgba(235,241,246,.48);
  font-size: 10px;
  text-align: center;
}
.watch-party-message {
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}
.watch-party-message img {
  width: 27px;
  height: 27px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  background: #111;
  object-fit: cover;
}
.watch-party-message__body {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  background: rgba(0,0,0,.22);
}
.watch-party-message__meta { display: flex; align-items: baseline; gap: 6px; }
.watch-party-message__meta b {
  overflow: hidden;
  color: #fff;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.watch-party-message__meta time { color: rgba(235,241,246,.42); font-size: 8px; }
.watch-party-message p {
  margin: 2px 0 0;
  color: rgba(249,251,253,.88);
  font-size: 10px;
  line-height: 1.38;
  overflow-wrap: anywhere;
}
.watch-party-form {
  display: grid;
  grid-template-columns: 1fr 34px;
  gap: 7px;
  padding: 0;
  border-top: 0;
  pointer-events: auto;
}
.watch-party-form input {
  min-width: 0;
  height: 35px;
  padding: 0 11px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  outline: 0;
  background: rgba(0,0,0,.34);
  color: #fff;
  font-size: 10px;
}
.watch-party-form input:focus { border-color: color-mix(in srgb, var(--orange) 65%, #fff); }
.watch-party-form button {
  width: 34px;
  height: 34px;
  border: 1px solid #303640;
  border-radius: 50%;
  background: #171b21;
  color: #f5f6f8;
  font-weight: 900;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36);
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.watch-party-form button:hover,
.watch-party-form button:focus-visible {
  border-color: rgba(255,164,119,.66);
  background: #20242b;
  color: var(--orange-2);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.1);
}
.watch-party-hint { padding: 0 12px 8px; }
html[data-theme="light"] .watch-party-toggle {
  border-color: rgba(16,35,51,.18);
  background: rgba(255,255,255,.72);
  color: #102333;
}
html[data-theme="light"] .watch-party-panel {
  border-color: transparent;
  background: transparent;
  color: #fff;
  box-shadow: none;
  backdrop-filter: none;
}
html[data-theme="light"] .watch-party-panel__head { background: transparent; border-color: transparent; }
html[data-theme="light"] .watch-party-panel__head strong,
html[data-theme="light"] .watch-party-panel__head button,
html[data-theme="light"] .watch-party-message__meta b { color: #fff; }
html[data-theme="light"] .watch-party-lobby p,
html[data-theme="light"] .watch-party-message p { color: rgba(249,251,253,.88); }
html[data-theme="light"] .watch-party-message__meta time,
html[data-theme="light"] #watchPartyLobbyHint,
html[data-theme="light"] .watch-party-hint,
html[data-theme="light"] .watch-party-empty { color: #667d8f; }
html[data-theme="light"] .watch-party-form input {
  border-color: #c7d7e3;
  background: rgba(255,255,255,.68);
  color: #102333;
}
html[data-theme="light"] .watch-party-share-link input {
  border-color: rgba(0,174,239,.22);
  background: rgba(255,255,255,.68);
  color: #29465b;
}
html:not([data-theme="light"]) body.is-detail .player-card,
html:not([data-theme="light"]) body.is-detail .anime-hero,
html:not([data-theme="light"]) body.is-detail .watch-sidebar section,
html:not([data-theme="light"]) body.is-detail .episodes-section {
  border-color: rgba(255,192,138,.26);
  background:
    linear-gradient(145deg,
      rgba(27,22,17,.98),
      #0a1016 46%,
      rgba(20,16,11,.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 14px 38px rgba(0,0,0,.26),
    0 0 24px color-mix(in srgb, var(--anime-primary) 8%, transparent);
}
html:not([data-theme="light"]) body.is-detail .player-card {
  border-top-color: rgba(255,192,138,.66);
}
html:not([data-theme="light"]) body.is-detail .watch-sidebar section:nth-child(odd) {
  border-top-color: rgba(255,173,61,.52);
}
html:not([data-theme="light"]) body.is-detail .watch-sidebar section:nth-child(even),
html:not([data-theme="light"]) body.is-detail .anime-hero {
  border-top-color: rgba(255,192,138,.46);
}
html:not([data-theme="light"]) body.is-detail .episodes-section {
  border-left: 3px solid rgba(255,192,138,.72);
}
html:not([data-theme="light"]) body.is-detail .player-card,
html:not([data-theme="light"]) body.is-detail .anime-hero,
html:not([data-theme="light"]) body.is-detail .watch-sidebar section,
html:not([data-theme="light"]) body.is-detail .episodes-section {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 16px 42px rgba(0,0,0,.34);
}
html:not([data-theme="light"]) body.is-detail .player-head,
html:not([data-theme="light"]) body.is-detail .watch-sidebar h3,
html:not([data-theme="light"]) body.is-detail .anime-hero h1 {
  color: #fff4e7;
  text-shadow: 0 0 18px rgba(255,192,138,.18);
}
iframe { display: block; width: 100%; aspect-ratio: 16 / 8.4; border: 0; background: #050505; }
body.is-home .home-page {
  overflow: visible;
}
body.is-home #continueCard {
  width: calc(100% + 214px);
  margin-top: -18px;
  margin-left: -196px;
}
body.is-home .hero-carousel.watch-progress {
  min-height: clamp(460px, 43vw, 610px);
  border-width: 0;
  border-radius: 0;
}
body.is-home .hero-carousel.watch-progress::after {
  display: none;
}
body.is-home .hero-carousel__copy {
  margin-left: 178px;
}
body.is-home .sidebar {
  z-index: 4;
  border-right: 0;
  background: transparent;
  backdrop-filter: none;
}
body.is-home .sidebar .nav a,
body.is-home .sidebar .nav button {
  border-color: transparent;
  background: transparent;
  text-shadow: 0 1px 8px rgba(0,0,0,.9);
}
body.is-home .sidebar .nav a:hover,
body.is-home .sidebar .nav button:hover,
body.is-home .sidebar .nav a.is-active,
body.is-home .sidebar .nav a[data-nav="home"] {
  background: rgba(6,10,14,.34);
  backdrop-filter: blur(5px);
  color: #fff;
}
body.is-home .sidebar .nav a.is-active span,
body.is-home .sidebar .nav a[data-nav="home"] span {
  color: #fff;
}
.player-card iframe[hidden] { display: none; }
.anime4k-stage { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.anime4k-stage[hidden] { display: none; }
.anime4k-stage video { position: absolute; width: 1px; height: 1px; opacity: .001; pointer-events: none; }
.anime4k-stage canvas { display: block; width: 100%; height: 100%; background: #000; object-fit: contain; }
.anime4k-stage.is-native canvas { display: none; }
.anime4k-stage.is-native video { position: static; display: block; width: 100%; height: 100%; opacity: 1; object-fit: contain; pointer-events: auto; }
.animehub-loader,
.animehub-center-play,
.animehub-tap-feedback {
  position: absolute;
  z-index: 12;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.animehub-loader {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 4px solid rgba(255,255,255,.2);
  border-top-color: var(--orange);
  border-right-color: color-mix(in srgb, var(--orange) 72%, #fff);
  box-shadow: 0 0 34px rgba(255,192,138,.38);
  animation: animehub-spin .8s linear infinite;
  opacity: 0;
  transition: opacity .18s ease;
}
.anime4k-stage.is-loading .animehub-loader { opacity: 1; }
@keyframes animehub-spin {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}
.animehub-center-play {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 18px;
  background: var(--orange);
  color: #050505;
  box-shadow: 0 18px 55px rgba(255,192,138,.45), inset 0 1px 0 rgba(255,255,255,.32);
  cursor: pointer;
  pointer-events: auto;
  transition: transform .18s ease, filter .18s ease, opacity .18s ease;
}
.animehub-center-play span {
  display: block;
  margin-left: 5px;
  font-size: 42px;
  line-height: 1;
  text-shadow: none;
}
.animehub-center-play:hover {
  transform: translate(-50%, -50%) scale(1.06);
  filter: brightness(1.08);
}
.animehub-center-play[hidden] { display: none; }
.animehub-tap-feedback {
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(0,0,0,.54);
  color: #fff;
  font-size: 38px;
  font-weight: 900;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.78);
  backdrop-filter: blur(10px);
}
.animehub-tap-feedback.is-visible {
  animation: animehub-feedback .58s ease;
}
@keyframes animehub-feedback {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.72); }
  18% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.22); }
}
.anime4k-controls {
  position: absolute;
  z-index: 8;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: 30px auto minmax(80px, 1fr) auto 30px 75px 30px;
  align-items: center;
  gap: 8px;
  padding: 28px 12px 9px;
  background: linear-gradient(transparent, rgba(0,0,0,.9));
  color: white;
  font-size: 9px;
}
.anime4k-stage:fullscreen .anime4k-controls,
.anime4k-stage:fullscreen .anime4k-controls__top {
  z-index: 50;
}
.anime4k-stage:fullscreen .watch-party-toggle,
.anime4k-stage:fullscreen .watch-party-panel {
  z-index: 60;
}
.anime4k-stage:fullscreen canvas,
.anime4k-stage:fullscreen video {
  width: 100vw;
  height: 100vh;
}
.anime4k-controls button { padding: 0; border: 0; background: transparent; color: white; }
.anime4k-controls input { width: 100%; accent-color: var(--orange); }
.anime4k-controls__top {
  position: absolute;
  right: 12px;
  bottom: 42px;
  left: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  pointer-events: none;
}
.player-translation,
.skip-opening,
.anime4k-toggle,
.anime4k-performance {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 6px;
  background: rgba(6,9,13,.74) !important;
  color: #fff;
  box-shadow: 0 7px 20px rgba(0,0,0,.24);
  backdrop-filter: blur(12px);
  pointer-events: auto;
}
.anime4k-toggle {
  cursor: pointer;
  user-select: none;
}
.anime4k-toggle input {
  appearance: none;
  width: 13px;
  height: 13px;
  margin: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 3px;
  background: rgba(0,0,0,.28);
  accent-color: var(--orange);
}
.anime4k-toggle input::after {
  content: "";
  width: 7px;
  height: 4px;
  border: solid #101010;
  border-width: 0 0 2px 2px;
  opacity: 0;
  transform: rotate(-45deg) translateY(-1px);
}
.anime4k-toggle input:checked {
  border-color: var(--orange);
  background: var(--orange);
}
.anime4k-toggle input:checked::after {
  opacity: 1;
}
.anime4k-toggle span {
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .3px;
}
.anime4k-toggle:has(input:checked) {
  border-color: color-mix(in srgb, var(--orange) 80%, #fff) !important;
  background: color-mix(in srgb, var(--orange) 34%, rgba(6,9,13,.82)) !important;
  box-shadow: 0 0 24px rgba(255,192,138,.22), 0 7px 20px rgba(0,0,0,.24);
}
.anime4k-toggle:has(input:disabled) {
  opacity: .45;
  cursor: not-allowed;
}
.player-translation span { color: rgba(255,255,255,.62); font-size: 8px; text-transform: uppercase; }
.player-translation select {
  max-width: 180px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-size: 9px;
}
.player-translation select option { background: #111820; color: #fff; }
.skip-opening {
  padding-inline: 12px !important;
  border-color: color-mix(in srgb, var(--orange) 68%, rgba(255,255,255,.2)) !important;
  font-size: 9px;
  font-weight: 800;
}
.skip-opening[hidden] { display: none !important; }
.anime4k-performance {
  min-height: 25px;
  min-width: 42px;
  justify-content: center;
  color: rgba(255,255,255,.82);
  font-size: 10px;
  font-weight: 900;
}
.anime4k-performance:empty { display: none; }
.player-head {
  display: grid;
  grid-template-columns: minmax(210px, .8fr) minmax(360px, 1.15fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 15px 12px;
}
.player-card.is-kodik .player-head {
  grid-template-columns: minmax(190px, 1fr) minmax(230px, auto);
}
.player-title {
  min-width: 0;
  display: flex;
  align-items: center;
}
.player-head h2 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.player-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.source-control, .enhancement-control {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 7px 5px 9px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--muted);
  font-size: 9px;
}
.player-head .enhancement-control,
.enhancement-control[hidden] { display: none !important; }
.source-control.is-disabled,
.enhancement-control.is-disabled { opacity: .45; pointer-events: none; }
.source-control select,
.enhancement-control select {
  border: 0;
  outline: 0;
  background: #151616;
  color: #f0f0ee;
  font-size: 10px;
}
.css-filter-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  min-width: 0;
  max-width: 100%;
  margin: 0 0 0 auto;
  color: var(--muted);
  font-size: 9px;
  overflow-x: auto;
  scrollbar-width: none;
}
.css-filter-control::-webkit-scrollbar { display: none; }
.css-filter-control button {
  min-height: 27px;
  flex: 0 0 auto;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #11171d;
  color: #98a3ad;
  font-size: 9px;
  transition: color .16s ease, border-color .16s ease, background .16s ease;
}
.css-filter-control button:hover {
  border-color: color-mix(in srgb, var(--orange) 48%, var(--line));
  background: #11171d;
  color: #fff;
}
.css-filter-control button.is-active {
  border-color: color-mix(in srgb, var(--orange) 48%, var(--line));
  background: #11171d;
  color: #fff;
}
@media (max-width: 980px) {
  .player-head {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .css-filter-control {
    justify-content: flex-start;
    margin: 0;
  }
  .player-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}
.player-status { margin: 7px 15px 12px; color: var(--muted); font-size: 10px; }
#playerStatus { display: none; }
.ghost-link {
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: #aaa;
  text-decoration: none;
  font-size: 10px;
}
.anime-hero {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 15px;
  margin-top: 12px;
  padding: 15px;
}
.anime-poster { overflow: hidden; border-radius: 5px; background: #171818; }
.anime-poster img, .anime-poster .poster-fallback { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.title-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.anime-info h1 { margin: 0; font-size: 21px; }
.title-line > strong { color: var(--orange); }
.subtitle { margin: 3px 0 9px; color: var(--muted); font-size: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 9px; }
.chips span { padding: 3px 6px; border-radius: 3px; background: #161717; color: #aaa; font-size: 9px; }
.chips #profileScoreChip { color: var(--orange); }
.description { max-width: 720px; margin: 0; color: #b8b9b9; font-size: 10px; line-height: 1.45; }
.meta-list { display: none; }
.anime-info > small { color: var(--muted); font-size: 9px; }
.poster-actions { display: flex; gap: 7px; margin-top: 11px; }
.poster-actions button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #121313;
  color: #bbb;
  font-size: 10px;
}
.poster-actions .watch-button { margin-left: auto; border-color: var(--orange); background: var(--orange); color: #111; font-weight: 800; }
.bookmark-button.is-active { border-color: #6e4218; color: var(--orange); }
.watch-sidebar { display: grid; align-content: start; gap: 12px; min-height: 0; }
.watch-sidebar section { padding: 12px; }
.watch-sidebar h3 { margin: 0 0 10px; font-size: 11px; }
.next-episode-card {
  width: 100%;
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #111212;
  color: white;
  text-align: left;
}
.next-episode-card > span { grid-row: 1 / 3; display: grid; place-items: center; color: var(--orange); }
.next-episode-card strong { font-size: 9px; }
.next-episode-card small { color: var(--muted); font-size: 8px; }
.sidebar-episodes {
  max-height: 560px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.sidebar-episodes__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.sidebar-episodes__head span { color: var(--muted); font-size: 9px; }
.season-switcher {
  position: relative;
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin-bottom: 9px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #111212;
}
.season-switcher > span {
  color: var(--muted);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .6px;
}
.season-switcher select {
  width: 100%;
  min-width: 0;
  height: 26px;
  padding: 0 24px 0 8px;
  border: 1px solid color-mix(in srgb, var(--orange) 35%, var(--line));
  border-radius: 4px;
  outline: 0;
  background: #171818;
  color: #f3f3f1;
  font-size: 10px;
  font-weight: 700;
}
.season-switcher small {
  grid-column: 1 / -1;
  overflow: hidden;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-episodes .episode-list {
  grid-auto-flow: row;
  grid-auto-columns: initial;
  grid-template-columns: 1fr;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 3px;
}
.sidebar-episodes .episode-card {
  min-height: 56px;
  height: 56px;
  flex: 0 0 auto;
  padding: 8px 8px 8px 42px;
  border-color: rgba(255,255,255,.08);
  border-radius: 7px;
  background:
    linear-gradient(90deg, rgba(5,5,5,.96), rgba(5,5,5,.78) 54%, rgba(5,5,5,.28)),
    var(--episode-image, var(--anime-bg)) right center / 62% auto no-repeat,
    #111212;
}
.sidebar-episodes .episode-card .episode-thumb {
  top: 50%;
  left: 8px;
  min-width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 6px;
  background: rgba(10,13,16,.82);
  color: #f5f5f2;
  font-size: 9px;
  box-shadow: none;
}
.sidebar-episodes .episode-card .play-dot {
  display: none;
}
.sidebar-episodes .episode-card strong {
  margin: 0;
  font-size: 10px;
  line-height: 1.2;
}
.sidebar-episodes .episode-card small {
  max-width: 105px;
  overflow: hidden;
  font-size: 7px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-episodes .episode-card:hover,
.sidebar-episodes .episode-card.is-active {
  border-color: color-mix(in srgb, var(--orange) 46%, rgba(255,255,255,.1));
  background:
    linear-gradient(90deg, rgba(5,5,5,.96), rgba(5,5,5,.72) 54%, rgba(5,5,5,.22)),
    var(--episode-image, var(--anime-bg)) right center / 62% auto no-repeat,
    #111212;
}
.sidebar-episodes .load-more-episodes {
  flex: 0 0 auto;
  width: 100%;
  margin-top: 10px;
}
.episodes-section { margin-top: 12px; padding: 14px; }
.watch-description-copy { margin: 14px 0 0; color: #b8b9b9; font-size: 11px; line-height: 1.6; }
.tabs { display: flex; gap: 25px; border-bottom: 1px solid var(--line); }
.tabs button, .season-pill {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 10px;
}
.tabs button { padding: 0 0 10px; border-bottom: 2px solid transparent; }
.tabs button.is-active { border-color: var(--orange); color: var(--orange); }
.tabs button span {
  display: inline-grid;
  place-items: center;
  min-width: 17px;
  height: 17px;
  margin-left: 4px;
  padding: 0 5px;
  border-radius: 10px;
  background: #1b1c1c;
  color: var(--muted);
  font-size: 8px;
}
.tabs button.is-active span { background: rgba(255,192,138,.14); color: var(--orange); }
.comments-panel { padding-top: 14px; }
.comment-form {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 11px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #101111;
}
.comment-form__avatar {
  width: 48px;
  height: 48px;
  border: 1px solid #9a541a;
  border-radius: 50%;
  background: #090d12;
  object-fit: cover;
}
.comment-form textarea {
  width: 100%;
  min-height: 86px;
  resize: vertical;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  outline: 0;
  background: #0b0c0c;
  color: white;
  line-height: 1.5;
}
.comment-form textarea:focus { border-color: color-mix(in srgb, var(--orange) 55%, var(--line)); }
.comment-form__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
}
.comment-form__footer span { color: var(--muted); font-size: 9px; }
.comment-form__footer button {
  min-height: 32px;
  padding: 0 13px;
  border: 0;
  border-radius: 5px;
  background: var(--orange);
  color: #111;
  font-size: 10px;
  font-weight: 900;
}
.comment-form__footer button:disabled { opacity: .55; cursor: wait; }
.comments-list { display: grid; margin-top: 12px; }
.comment-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 11px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--line);
}
.comment-card__avatar {
  width: 46px;
  height: 46px;
  border: 1px solid #9a541a;
  border-radius: 50%;
  background: #090d12;
  object-fit: cover;
}
.comment-card__content header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.comment-user-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  background: transparent;
  color: #f2f2ef;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}
.comment-user-trigger:hover { color: var(--orange); }
.comment-user-actions {
  display: inline-flex;
  gap: 5px;
  margin-left: auto;
  opacity: 0;
  transform: translateY(-1px);
  transition: opacity .15s ease, transform .15s ease;
}
.comment-card:hover .comment-user-actions { opacity: 1; transform: translateY(0); }
.comment-user-actions button {
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #14181e;
  color: var(--muted);
  font-size: 8px;
  font-weight: 900;
}
.comment-user-actions button:hover {
  border-color: var(--orange);
  color: var(--orange);
}
.comment-card__content header strong { font-size: 11px; }
.comment-card__content time { color: var(--muted); font-size: 8px; }
.comment-card__content > p {
  margin: 7px 0 10px;
  color: #d0d1d0;
  font-size: 11px;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.comment-reactions { display: flex; flex-wrap: wrap; gap: 5px; }
.comment-reactions button {
  min-width: 38px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #121313;
  color: #aaa;
}
.comment-reactions button:hover { border-color: color-mix(in srgb, var(--orange) 42%, var(--line)); }
.comment-reactions button.is-active {
  border-color: var(--orange);
  background: rgba(255,192,138,.12);
  color: var(--orange);
}
.comment-reactions button span { font-size: 12px; }
.comment-reactions button b { font-size: 8px; }
.comments-empty {
  margin: 0;
  padding: 28px 12px;
  color: var(--muted);
  text-align: center;
  font-size: 10px;
}
.user-profile-panel { max-width: 430px; }
.user-profile-card {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
.user-profile-avatar {
  width: 76px;
  height: 76px;
  border-radius: 22px;
}
.user-profile-card small {
  color: var(--orange);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 9px;
  font-weight: 900;
}
.user-profile-card h2 { margin: 4px 0; }
.user-profile-card p { margin: 0; color: var(--muted); }
.user-profile-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0;
}
.user-profile-stats span {
  padding: 10px 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  color: var(--muted);
  text-align: center;
  font-size: 8px;
}
.user-profile-stats b {
  display: block;
  color: #fff;
  font-size: 15px;
}
.user-profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.user-profile-actions button {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 9px;
  font-weight: 900;
}
.ghost-button {
  border: 1px solid var(--line);
  background: transparent;
  color: #d8d8d6;
}
html[data-theme="light"] .notifications-popover,
html[data-theme="light"] .notification-actions button,
html[data-theme="light"] .comment-user-actions button {
  background: #fff;
  color: #183246;
}
html[data-theme="light"] .notification-button {
  background: #f1f6fa;
  color: #ffc08a;
}
html[data-theme="light"] .user-profile-stats b,
html[data-theme="light"] .comment-user-trigger {
  color: #102333;
}
.season-row { display: flex; gap: 7px; margin: 13px 0; }
.season-pill { padding: 6px 9px; border-radius: 4px; background: #141515; }
.season-pill.is-active { color: var(--orange); background: rgba(255,192,138,.1); }
.episode-list { display: grid; grid-auto-flow: column; grid-auto-columns: 150px; gap: 8px; overflow-x: auto; padding-bottom: 7px; }
.episode-card {
  position: relative;
  min-height: 92px;
  display: grid;
  align-content: end;
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: linear-gradient(transparent, rgba(0,0,0,.9)), var(--episode-image, var(--anime-bg)) center / cover;
  color: white;
  text-align: left;
}
.episode-card.is-active { border-color: var(--orange); }
.episode-thumb { position: absolute; top: 5px; left: 5px; padding: 2px 5px; border-radius: 3px; background: var(--orange); color: #111; font-size: 8px; }
.play-dot { color: var(--orange); }
.episode-card strong { font-size: 9px; }
.episode-card small { color: #aaa; font-size: 8px; }

.search-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: start center;
  padding: 8vh 16px;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(16px);
}
.search-modal__panel {
  width: min(760px, 100%);
  max-height: 84vh;
  overflow: auto;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #0d0e0e;
}
.confirm-modal { z-index: 100; place-items: center; padding: 16px; }
.confirm-modal__panel {
  width: min(390px, 100%);
  overflow: visible;
  text-align: center;
}
.confirm-modal__panel h2 { margin: 5px 0 9px; font-size: 22px; }
.confirm-modal__panel > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.confirm-modal__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 20px; }
.confirm-modal__actions button {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-weight: 750;
}
.confirm-modal__cancel { background: #141515; color: #ddd; }
.confirm-modal__approve { border-color: var(--orange) !important; background: var(--orange); color: #111; }

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f8fc;
  --panel: #ffffff;
  --panel-2: #f7fafc;
  --panel-3: #edf4fa;
  --line: #c9d9e7;
  --line-soft: #dce7f0;
  --text: #102333;
  --muted: #607487;
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  --danger: #d84545;
  --anime-primary: #ffc08a;
  --anime-accent: #ffd7ad;
  --anime-glow: rgba(0, 174, 247, .24);
}
html[data-theme="light"] body {
  background: #eaf2f8;
  color: var(--text);
}
html[data-theme="light"] body.is-home { background: #eaf2f8; }
html[data-theme="light"] body.is-home::after { display: none; }
html[data-theme="light"] body.is-home .site-shell { background: #fff; }
html[data-theme="light"] body.is-detail {
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  background:
    linear-gradient(90deg,
      color-mix(in srgb, var(--anime-primary) 28%, rgba(239,247,253,.88)),
      rgba(246,250,253,.98) 22% 78%,
      color-mix(in srgb, var(--anime-accent) 25%, rgba(239,247,253,.9))),
    linear-gradient(180deg, rgba(255,255,255,.04) 0 38%, #edf4f9 92%),
    #eef5fa;
}
html[data-theme="light"] body.is-detail::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .96;
  background:
    linear-gradient(90deg,
      rgba(244,249,253,.08) 0,
      rgba(244,249,253,.82) 18%,
      rgba(244,249,253,.98) 28% 72%,
      rgba(244,249,253,.82) 82%,
      rgba(244,249,253,.08) 100%),
    linear-gradient(180deg, transparent 42%, rgba(238,245,250,.72) 88%, #eef5fa 100%),
    var(--anime-bg) left top / max(360px, 27vw) 100% no-repeat,
    var(--anime-bg) right top / max(360px, 27vw) 100% no-repeat;
  filter: saturate(1.2) contrast(1.05) brightness(1.08);
}
html[data-theme="light"] body.is-detail .site-shell {
  border-color: color-mix(in srgb, var(--anime-primary) 38%, #c9d9e7);
  background:
    radial-gradient(circle at 7% 38%,
      color-mix(in srgb, var(--anime-primary) 25%, transparent),
      transparent 32%),
    radial-gradient(circle at 94% 58%,
      color-mix(in srgb, var(--anime-accent) 23%, transparent),
      transparent 34%),
    linear-gradient(105deg,
      color-mix(in srgb, var(--anime-primary) 8%, rgba(249,252,255,.97)),
      rgba(249,252,255,.97) 31% 69%,
      color-mix(in srgb, var(--anime-accent) 8%, rgba(249,252,255,.97)));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.7),
    -24px 0 64px color-mix(in srgb, var(--anime-primary) 28%, transparent),
    24px 0 64px color-mix(in srgb, var(--anime-accent) 24%, transparent),
    0 26px 70px rgba(38,72,98,.24);
}
html[data-theme="light"] .site-shell { border-color: #c9d9e7; }
html[data-theme="light"] .topbar {
  border-color: var(--line);
  background: rgba(255,255,255,.94);
}
html[data-theme="light"] .sidebar {
  border-right-color: transparent;
  background: transparent;
}
html[data-theme="light"] .logo-anime { color: #102333; }
html[data-theme="light"] .logo-hub { color: white; }
html[data-theme="light"] .top-search,
html[data-theme="light"] .catalog-toolbar select,
html[data-theme="light"] .view-switch button,
html[data-theme="light"] .settings-groups label,
html[data-theme="light"] .settings-groups section > button,
html[data-theme="light"] .season-switcher,
html[data-theme="light"] .source-control,
html[data-theme="light"] .enhancement-control,
html[data-theme="light"] .source-control select,
html[data-theme="light"] .enhancement-control select {
  background: #f1f6fa;
  color: #183246;
}
html[data-theme="light"] .top-search input { color: #183246; }
html[data-theme="light"] .top-search button,
html[data-theme="light"] .icon-button { color: #ffc08a; }
html[data-theme="light"] .profile-button { color: #183246; }
html[data-theme="light"] .nav a,
html[data-theme="light"] .nav button { color: #52687a; }
html[data-theme="light"] .nav a span,
html[data-theme="light"] .nav button span { color: #52687a; }
html[data-theme="light"] .nav a:hover,
html[data-theme="light"] .nav button:hover,
html[data-theme="light"] .nav a.is-active {
  background: rgba(16,35,51,.07);
  color: #102333;
}
html[data-theme="light"] .nav a:hover span,
html[data-theme="light"] .nav button:hover span,
html[data-theme="light"] .nav a.is-active span {
  color: #102333;
}
html[data-theme="light"] .continue-card,
html[data-theme="light"] .poster-card,
html[data-theme="light"] .catalog-card,
html[data-theme="light"] .favorite-card,
html[data-theme="light"] .history-card,
html[data-theme="light"] .profile-summary,
html[data-theme="light"] .profile-stats,
html[data-theme="light"] .settings-groups section,
html[data-theme="light"] .my-comments-section,
html[data-theme="light"] .player-card,
html[data-theme="light"] .anime-hero,
html[data-theme="light"] .watch-sidebar section,
html[data-theme="light"] .episodes-section,
html[data-theme="light"] .search-modal__panel {
  background: #ffffff;
  border-color: var(--line);
  color: #102333;
}
html[data-theme="light"] body.is-detail .detail-page {
  background: transparent;
}
html[data-theme="light"] body.is-detail .detail-page::before {
  opacity: .36;
  filter: blur(24px) saturate(1.18);
  mix-blend-mode: multiply;
}
html[data-theme="light"] body.is-detail .detail-page::after {
  opacity: .2;
  filter: blur(54px) saturate(1.25);
  mix-blend-mode: multiply;
}
html[data-theme="light"] body.is-detail .player-card,
html[data-theme="light"] body.is-detail .anime-hero,
html[data-theme="light"] body.is-detail .watch-sidebar section,
html[data-theme="light"] body.is-detail .episodes-section {
  border-color: color-mix(in srgb, var(--anime-primary) 38%, #c8d8e5);
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--anime-primary) 6%, #fff),
      rgba(255,255,255,.97) 48%,
      color-mix(in srgb, var(--anime-accent) 7%, #fff));
  color: #102333;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 16px 38px rgba(35,72,101,.13),
    0 0 24px color-mix(in srgb, var(--anime-primary) 14%, transparent);
}
html[data-theme="light"] body.is-detail .player-card {
  border-top-color: color-mix(in srgb, var(--anime-primary) 76%, #fff);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 18px 42px rgba(35,72,101,.16),
    0 0 32px color-mix(in srgb, var(--anime-primary) 18%, transparent);
}
html[data-theme="light"] body.is-detail .watch-sidebar section:nth-child(odd) {
  border-top-color: color-mix(in srgb, var(--anime-accent) 68%, #fff);
}
html[data-theme="light"] body.is-detail .watch-sidebar section:nth-child(even),
html[data-theme="light"] body.is-detail .anime-hero {
  border-top-color: color-mix(in srgb, var(--anime-primary) 66%, #fff);
}
html[data-theme="light"] body.is-detail .episodes-section {
  border-left: 3px solid color-mix(in srgb, var(--anime-primary) 72%, #fff);
}
html[data-theme="light"] body.is-detail .player-head,
html[data-theme="light"] body.is-detail .watch-sidebar h3,
html[data-theme="light"] body.is-detail .anime-hero h1 {
  color: #102333;
  text-shadow: 0 0 18px color-mix(in srgb, var(--anime-primary) 20%, transparent);
}
html[data-theme="light"] .poster-card,
html[data-theme="light"] .favorite-card,
html[data-theme="light"] .catalog-card {
  box-shadow: 0 8px 22px rgba(31,73,105,.08);
}
html[data-theme="light"] .watch-progress {
  background:
    linear-gradient(90deg, #f8fbfd 0%, rgba(248,251,253,.96) 32%, rgba(248,251,253,.22) 72%, #f8fbfd 100%),
    var(--hero-bg, none) right center / 68% auto no-repeat,
    #f8fbfd;
}
html[data-theme="light"] .watch-progress p,
html[data-theme="light"] .description,
html[data-theme="light"] .watch-description-copy,
html[data-theme="light"] .comment-card__content > p { color: #435d70; }
html[data-theme="light"] .hero-carousel__meta { color: #102333 !important; }
html[data-theme="light"] .settings-groups label,
html[data-theme="light"] .settings-groups section > button { color: #263f52; }
html[data-theme="light"] .ghost-link,
html[data-theme="light"] .confirm-modal__cancel {
  background: #f1f6fa;
  color: #274255;
}
html[data-theme="light"] .google-button {
  border-color: #c5c9ce;
  background: #fff;
  color: #1f1f1f;
}
html[data-theme="light"] .google-button:hover {
  border-color: #aeb4bb;
  background: #f8faff;
}
html[data-theme="light"] .auth-divider::before,
html[data-theme="light"] .auth-divider::after { background: #d5e1eb; }
html[data-theme="light"] .auth-divider span { color: #738596; }
html[data-theme="light"] .search-modal {
  background: rgba(222,234,243,.78);
}
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select { color-scheme: light; }
html[data-theme="light"] *::-webkit-scrollbar-track { background: #edf4f9; }
html[data-theme="light"] *::-webkit-scrollbar-thumb { background: #abc2d4; }
.search-modal__head { display: flex; align-items: start; justify-content: space-between; gap: 12px; margin-bottom: 17px; }
.search-modal__head h2 { margin: 0; }
.search-close {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  background: #151a22;
  color: rgba(255,255,255,.82);
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.search-close:hover,
.search-close:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 42%, rgba(255,255,255,.14));
  background: #1c222b;
  color: var(--orange-2);
  outline: 0;
}
.search-modal__form { display: grid; grid-template-columns: 1fr 112px; gap: 10px; margin-bottom: 18px; }
.search-modal__form input, .auth-form input {
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 12px;
  outline: 0;
  background: #11161d;
  color: white;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.34);
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.search-modal__form input:focus,
.auth-form input:focus {
  border-color: color-mix(in srgb, var(--orange) 50%, rgba(255,255,255,.16));
  background: #151b23;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--orange) 12%, transparent), inset 0 -1px 0 rgba(0,0,0,.34);
}
.search-modal__form button, .auth-actions button {
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  background: #171b22;
  color: #f5f6f8;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36);
  font-weight: 900;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}
.search-modal__form button:hover,
.search-modal__form button:focus-visible,
.auth-actions button:hover,
.auth-actions button:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 52%, rgba(255,255,255,.14));
  background: #20252d;
  color: var(--orange-2);
  transform: translateY(-1px);
  outline: 0;
}
.modal-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.auth-panel { width: min(480px, 100%); }
.google-button {
  position: relative;
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 0 46px;
  border: 1px solid #747775;
  border-radius: 6px;
  background: #fff;
  color: #1f1f1f;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .1px;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.google-button:hover {
  border-color: #a8aaad;
  background: #f8faff;
  box-shadow: 0 2px 8px rgba(0,0,0,.24);
  transform: translateY(-1px);
}
.google-button:active {
  box-shadow: none;
  transform: translateY(0);
}
.google-button:focus-visible {
  outline: 3px solid rgba(66,133,244,.28);
  outline-offset: 2px;
}
.google-button__icon {
  position: absolute;
  left: 15px;
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
}
.google-button__icon svg { width: 20px; height: 20px; display: block; }
.auth-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  margin: 14px 0;
}
.auth-divider::before,
.auth-divider::after {
  content: "";
  height: 1px;
  background: var(--line);
}
.auth-divider span {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .8px;
}
.auth-form { display: grid; gap: 8px; }
.google-username-copy {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}
.auth-field-label {
  margin: 4px 0 -2px;
  color: #bbb;
  font-size: 10px;
  font-weight: 700;
}
.auth-form input[readonly] {
  cursor: default;
  opacity: .72;
}
.google-username-submit {
  min-height: 44px;
  margin-top: 8px;
  border: 0;
  border-radius: 6px;
  background: var(--orange);
  color: #111;
  font-weight: 850;
}
.google-username-submit:disabled {
  cursor: wait;
  opacity: .62;
}
.auth-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.auth-actions button { min-height: 42px; }
.bottom-nav { display: none; }

@media (max-width: 1100px) {
  .poster-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .poster-grid--new { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .site-shell { display: block; padding-bottom: 72px; }
  .topbar { grid-template-columns: auto 1fr auto; height: 60px; padding: 0 12px; }
  body.is-home .site-shell { width: 100%; }
  body.is-detail .site-shell { width: 100%; }
  body.is-detail .topbar { grid-template-columns: auto 1fr auto; }
  .logo { padding: 0; font-size: 19px; }
  .top-search { margin-left: 8px; }
  .profile-button span:last-child, .icon-button { display: none; }
  .theme-toggle { display: grid; width: 34px; height: 34px; }
  .top-actions { padding: 0; }
  .sidebar { display: none; }
  .anime-aura-canvas,
  .detail-page::before,
  .detail-page::after {
    left: 0;
    right: 0;
  }
  .anime-aura-canvas {
    width: 100% !important;
    transform: none;
  }
  .home-page, .detail-page { padding: 12px; }
  body.is-home #continueCard {
    width: calc(100% + 24px);
    margin-top: -12px;
    margin-left: -12px;
  }
  body.is-home .hero-carousel__copy {
    margin-left: 0;
  }
  .watch-progress { min-height: 250px; grid-template-columns: 1fr 44px; padding: 22px; background-position: center; background-size: cover; }
  .hero-carousel.watch-progress {
    min-height: 390px;
    grid-template-columns: 1fr 52px;
    padding: 30px 24px;
    border-radius: 0 0 14px 14px;
  }
  .hero-carousel.watch-progress h3 { font-size: clamp(32px, 8vw, 52px); }
  .poster-grid, .catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalog-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .watch-layout { grid-template-columns: 1fr; }
  .watch-party-panel { width: min(310px, calc(100% - 24px)); }
  .watch-sidebar { grid-template-columns: 1fr 1fr; }
  .library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bottom-nav {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 9px;
    z-index: 60;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(10,11,11,.96);
    backdrop-filter: blur(18px);
  }
  .bottom-nav a { display: grid; justify-items: center; gap: 3px; color: #999; text-decoration: none; font-size: 16px; }
  .bottom-nav a span { font-size: 8px; }
  .bottom-nav a.is-active { color: var(--orange); }
}
@media (max-width: 560px) {
  .top-search input { width: 100%; }
  .watch-progress { min-height: 280px; align-content: end; }
  .watch-party-panel {
    position: fixed;
    top: 60px;
    right: 12px;
    bottom: 72px;
    width: min(340px, 92vw);
    border-radius: 0;
  }
  .hero-carousel.watch-progress {
    min-height: 420px;
    grid-template-columns: 1fr;
    padding: 26px 20px;
  }
  .hero-carousel .round-play {
    min-width: 142px;
    width: max-content;
    height: 48px;
    padding: 0 21px;
  }
  .poster-grid, .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .poster-grid--new, .library-grid { grid-template-columns: 1fr; }
  .catalog-toolbar { grid-template-columns: 1fr 1fr; }
  .watch-sidebar { grid-template-columns: 1fr; }
  .profile-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .anime-hero { grid-template-columns: 72px minmax(0, 1fr); padding: 10px; }
  .poster-actions { flex-wrap: wrap; }
  .poster-actions .watch-button { margin-left: 0; }
  .history-card__body { grid-template-columns: 1fr; }
  .history-card__body > span, .history-card__body strong, .history-card__body p, .history-card__meta { grid-column: 1; grid-row: auto; justify-self: start; }
  .modal-results { grid-template-columns: 1fr; }
}

/* Yummy-like watch skin. Keeps AnimeHub features, but matches the denser player layout. */
body.is-detail .detail-page {
  padding-top: 22px;
}

body.is-detail .watch-layout {
  grid-template-columns: minmax(0, 1fr) minmax(230px, 260px);
  gap: 18px;
  align-items: start;
}

body.is-detail .watch-main {
  min-width: 0;
  display: grid;
  gap: 18px;
}

body.is-detail .player-card {
  order: 2;
  display: flex;
  flex-direction: column;
  border-color: rgba(255,255,255,.06);
  border-radius: 2px;
  background: #1b1b1d;
  box-shadow: 0 22px 58px rgba(0,0,0,.42);
}

body.is-detail .player-head {
  order: -3;
  min-height: 58px;
  grid-template-columns: minmax(160px, auto) minmax(260px, 1fr) auto;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: #202022;
}

body.is-detail .anime4k-stage,
body.is-detail .player-card iframe {
  order: -2;
}

body.is-detail .player-title h2 {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 18px;
  border-radius: 3px;
  background: #101011;
  color: #f3f3f4;
  font-size: 13px;
  font-weight: 900;
}

body.is-detail .css-filter-control {
  justify-content: center;
  gap: 7px;
  margin: 0;
}

body.is-detail .css-filter-control button,
body.is-detail .source-control,
body.is-detail .enhancement-control {
  min-height: 36px;
  border-color: rgba(255,255,255,.05);
  border-radius: 3px;
  background: #111112;
  color: #d7d7dc;
  box-shadow: none;
}

body.is-detail .css-filter-control button:hover,
body.is-detail .css-filter-control button.is-active {
  border-color: color-mix(in srgb, var(--orange) 66%, #fff);
  background: color-mix(in srgb, var(--orange) 28%, #111112);
  color: #fff;
}

body.is-detail .source-control select,
body.is-detail .enhancement-control select {
  background: transparent;
}

body.is-detail .player-card iframe,
body.is-detail .anime4k-stage {
  aspect-ratio: 16 / 9;
  background: #000;
}

body.is-detail .anime4k-controls {
  grid-template-columns: 56px 48px minmax(0, 1fr) 48px 34px 88px 38px;
  gap: 9px;
  padding: 42px 12px 12px;
  background: linear-gradient(transparent 0%, rgba(0,0,0,.22) 26%, rgba(0,0,0,.92) 100%);
  font-size: 12px;
}

body.is-detail .anime4k-controls__top {
  top: 12px;
  right: 12px;
  bottom: auto;
  left: 12px;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
}

body.is-detail .player-translation,
body.is-detail .skip-opening,
body.is-detail .anime4k-toggle,
body.is-detail .anime4k-performance {
  min-height: 34px;
  border-color: rgba(255,255,255,.08) !important;
  border-radius: 3px;
  background: rgba(12,12,13,.94) !important;
  box-shadow: none;
}

body.is-detail .player-translation span {
  color: rgba(255,255,255,.58);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

body.is-detail .player-translation select {
  max-width: 170px;
  font-size: 12px;
  font-weight: 800;
}

body.is-detail #videoPlay {
  width: 56px;
  height: 46px;
  border-radius: 3px;
  background: rgba(255,255,255,.08);
  font-size: 24px;
  font-weight: 900;
}

body.is-detail #videoCurrentTime,
body.is-detail #videoDuration {
  color: #f2f2f3;
  font-size: 11px;
  font-weight: 900;
  text-align: center;
}

body.is-detail .video-seek-wrap {
  position: relative;
  min-width: 0;
  display: grid;
  align-items: center;
}

body.is-detail #videoSeek,
body.is-detail #videoVolume {
  width: 100%;
  height: 16px;
  margin: 0;
  accent-color: color-mix(in srgb, var(--orange) 68%, #d43cff);
  cursor: pointer;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track,
body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--orange) 60%, #d43cff), color-mix(in srgb, var(--orange) 74%, #fff));
}

body.is-detail #videoSeek::-webkit-slider-thumb,
body.is-detail #videoVolume::-webkit-slider-thumb {
  width: 12px;
  height: 12px;
  margin-top: -2px;
}

body.is-detail .video-seek-tooltip {
  position: absolute;
  z-index: 12;
  bottom: 28px;
  left: 0;
  min-width: 48px;
  padding: 5px 7px;
  border-radius: 3px;
  background: rgba(16,16,18,.96);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(5px);
  transition: opacity .12s ease, transform .12s ease;
}

body.is-detail .video-seek-tooltip.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

body.is-detail #videoMute,
body.is-detail #videoFullscreen {
  width: 34px;
  height: 34px;
  border-radius: 3px;
  background: transparent;
  font-size: 17px;
}

body.is-detail #videoFullscreen {
  font-size: 20px;
}

@keyframes watch-party-in {
  from { opacity: 0; transform: translateX(104%); }
  to { opacity: 1; transform: translateX(0); }
}

body.is-detail .anime-hero {
  order: 1;
  grid-template-columns: minmax(190px, 250px) minmax(0, 1fr);
  gap: 26px;
  margin-top: 18px;
  padding: 26px;
  border-radius: 2px;
  background: rgba(27,27,29,.96);
}

body.is-detail .poster-column {
  display: grid;
  align-content: start;
  justify-items: center;
  gap: 10px;
}

body.is-detail .anime-poster {
  width: min(250px, 100%);
  border-radius: 2px;
}

body.is-detail .anime-info {
  align-content: start;
}

body.is-detail .anime-info h1 {
  font-size: 24px;
  color: #e6e6e8;
}

body.is-detail .subtitle {
  margin: 6px 0 16px;
  color: color-mix(in srgb, var(--orange) 68%, #cf3cff);
  font-size: 17px;
}

body.is-detail .chips {
  display: none;
}

body.is-detail .description {
  margin: 16px 0 0;
  color: #bababe;
  font-size: 15px;
  line-height: 1.72;
}

body.is-detail .meta-list {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 0;
  margin: 0 0 16px;
  border: 0;
}

body.is-detail .meta-list dt,
body.is-detail .meta-list dd {
  min-height: 38px;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0 12px;
  border-bottom: 4px solid #1b1b1d;
  background: #111112;
  font-size: 14px;
}

body.is-detail .meta-list dt {
  color: #99999f;
}

body.is-detail .meta-list dd {
  color: color-mix(in srgb, var(--orange) 70%, #cf3cff);
  font-weight: 700;
}

body.is-detail .poster-actions {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr);
  gap: 26px;
  margin-top: 22px;
}

body.is-detail .poster-actions .share-button {
  display: none;
}

body.is-detail .poster-actions button {
  min-height: 52px;
  border-radius: 2px;
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
}

body.is-detail .poster-actions .watch-button {
  order: -1;
  margin-left: 0;
  border-color: color-mix(in srgb, var(--orange) 60%, #cf3cff);
  background: linear-gradient(90deg, color-mix(in srgb, var(--orange) 64%, #cf3cff), color-mix(in srgb, #cf3cff 76%, var(--orange)));
  color: #fff;
  box-shadow: 0 14px 32px color-mix(in srgb, var(--orange) 28%, transparent);
}

body.is-detail .poster-actions .bookmark-button {
  border-color: #303640;
  background: #171b21;
  color: #f5f6f8;
}

body.is-detail .poster-actions .bookmark-button::before {
  content: "♥ ";
  color: color-mix(in srgb, var(--orange) 60%, #cf3cff);
}

body.is-detail .episode-control,
body.is-detail .quality-control {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 9px;
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 3px;
  background: #111112;
  color: #d7d7dc;
  font-size: 9px;
}

body.is-detail .episode-control span,
body.is-detail .quality-control span {
  color: rgba(255,255,255,.58);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

body.is-detail .episode-control select {
  min-width: 96px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

body.is-detail .episode-control option {
  background: #111112;
}

body.is-detail .quality-control strong {
  color: #fff;
  font-size: 12px;
}

body.is-detail .episode-control { order: 1; }
body.is-detail .player-translation { order: 2; }
body.is-detail .quality-control { order: 3; }
body.is-detail .anime4k-toggle { order: 4; }
body.is-detail .source-control { order: 5; }
body.is-detail .enhancement-control { order: 6; }
body.is-detail .player-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* Watch page corrections: restore the old compact anime description card. */
body.is-detail .player-card {
  order: 1;
}

body.is-detail .anime-hero {
  order: 2;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 18px;
  margin-top: 0;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--orange) 36%, rgba(255,255,255,.06));
  border-radius: 7px;
  background: linear-gradient(160deg, rgba(15,20,27,.98), rgba(8,12,17,.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 44px rgba(0,0,0,.34);
}

body.is-detail .anime-poster {
  width: 132px;
  border-radius: 5px;
}

body.is-detail .anime-info h1 {
  margin: 0;
  color: #f0f0f0;
  font-size: 24px;
  line-height: 1.15;
  text-shadow: none;
}

body.is-detail .subtitle {
  margin: 4px 0 10px;
  color: #a5adb5;
  font-size: 12px;
}

body.is-detail .chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

body.is-detail .chips span {
  padding: 5px 8px;
  border-radius: 4px;
  background: rgba(255,255,255,.045);
  color: #aeb5bc;
  font-size: 10px;
}

body.is-detail .chips #profileScoreChip {
  color: var(--orange);
}

body.is-detail .meta-list {
  display: none;
}

body.is-detail .description {
  margin: 0;
  color: #bdc3c8;
  font-size: 13px;
  line-height: 1.65;
}

body.is-detail .poster-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

body.is-detail .poster-actions .share-button {
  display: inline-flex;
}

body.is-detail .poster-actions button {
  min-height: 38px;
  padding: 0 16px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 900;
  text-transform: none;
}

body.is-detail .poster-actions .watch-button {
  order: 3;
  margin-left: auto;
  border-color: var(--orange);
  background: var(--orange);
  color: #0a0a0a;
  box-shadow: none;
}

body.is-detail .poster-actions .bookmark-button {
  border-color: #303640;
  background: #171b21;
  color: #f5f6f8;
}

body.is-detail .poster-actions .bookmark-button::before {
  content: none;
}

/* Player top controls: no noisy labels, only values like "1 серия", "AniDUB", "480p", "4K". */
body.is-detail .player-head {
  grid-template-columns: minmax(180px, auto) minmax(0, 1fr) auto;
  gap: 10px;
  padding: 10px 12px;
}

body.is-detail .player-actions {
  gap: 8px;
}

body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .quality-control,
body.is-detail .player-translation,
body.is-detail .anime4k-toggle {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 4px;
  background: rgba(12,12,13,.94) !important;
  color: #fff;
}

body.is-detail .episode-control span,
body.is-detail .source-control span,
body.is-detail .quality-control span,
body.is-detail .player-translation span {
  display: none;
}

body.is-detail .episode-control select,
body.is-detail .source-control select,
body.is-detail .player-translation select {
  min-width: auto;
  max-width: 160px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

body.is-detail .quality-control strong {
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

body.is-detail .anime4k-toggle span {
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

body.is-detail .css-filter-control {
  justify-content: flex-start;
  opacity: .72;
}

body.is-detail .css-filter-control button {
  min-height: 26px;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 9px;
}

@media (max-width: 760px) {
  body.is-detail .anime-hero {
    grid-template-columns: 92px minmax(0, 1fr);
    padding: 12px;
  }

  body.is-detail .anime-poster {
    width: 92px;
  }

  body.is-detail .poster-actions .watch-button {
    margin-left: 0;
  }
}

/* Final watch layout pass: Kodik-like player overlay and preserved lower description. */
body.is-detail .player-card {
  position: relative;
  overflow: hidden;
}

body.is-detail .player-head {
  position: absolute;
  z-index: 18;
  top: 12px;
  right: 62px;
  left: 12px;
  min-height: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: none;
}

body.is-detail .player-title,
body.is-detail .css-filter-control {
  display: none;
}

body.is-detail .player-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  max-width: calc(100% - 8px);
  pointer-events: auto;
}

body.is-detail .season-switcher,
body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .player-translation,
body.is-detail .quality-control,
body.is-detail .anime4k-toggle,
body.is-detail .player-next-control {
  width: auto;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0 14px;
  border: 0 !important;
  border-radius: 4px;
  background: rgba(5,5,6,.94) !important;
  color: #fff;
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
}

body.is-detail .season-switcher > span,
body.is-detail .season-switcher small,
body.is-detail .episode-control span,
body.is-detail .source-control span,
body.is-detail .player-translation span,
body.is-detail .quality-control span {
  display: none !important;
}

body.is-detail .season-switcher select,
body.is-detail .episode-control select,
body.is-detail .source-control select,
body.is-detail .player-translation select {
  width: auto;
  min-width: 0;
  max-width: 180px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
}

body.is-detail .season-switcher select {
  max-width: 118px;
}

body.is-detail .episode-control select {
  max-width: 130px;
}

body.is-detail .player-translation select {
  max-width: 190px;
}

body.is-detail .quality-control strong,
body.is-detail .anime4k-toggle span,
body.is-detail .player-next-control {
  color: #fff;
  font-size: 14px;
  font-weight: 900;
}

body.is-detail .player-next-control {
  cursor: pointer;
}

body.is-detail .anime4k-toggle input {
  width: 17px;
  height: 17px;
}

body.is-detail .player-actions .enhancement-control {
  display: none !important;
}

body.is-detail .poster-actions {
  display: flex;
  gap: 10px;
}

body.is-detail .poster-actions .share-button {
  display: none !important;
}

body.is-detail .poster-actions .watch-button {
  order: 1;
  margin-left: 0;
}

body.is-detail .poster-actions .bookmark-button {
  order: 2;
}

body.is-detail .episodes-section {
  display: block;
  margin-top: 18px;
  border: 1px solid color-mix(in srgb, var(--orange) 26%, rgba(255,255,255,.07));
  border-radius: 7px;
  background: linear-gradient(160deg, rgba(15,20,27,.98), rgba(8,12,17,.98));
}

@media (max-width: 900px) {
  body.is-detail .player-head {
    right: 12px;
  }

  body.is-detail .player-actions {
    overflow-x: auto;
    scrollbar-width: none;
  }

  body.is-detail .player-actions::-webkit-scrollbar {
    display: none;
  }
}

/* Player top bar cleanup: transparent header, inert quality/4K/sound hover. */
body.is-detail .player-head {
  position: absolute !important;
  z-index: 18 !important;
  top: 12px !important;
  left: 12px !important;
  right: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none;
}

body.is-detail .player-actions {
  pointer-events: auto;
  background: transparent !important;
}

body.is-detail .season-switcher,
body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .player-translation,
body.is-detail .player-next-control {
  background: rgba(7,8,10,.62) !important;
  backdrop-filter: none !important;
}

body.is-detail .quality-control,
body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-performance,
body.is-detail #videoMute {
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(7,8,10,.72) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail .quality-control:hover,
body.is-detail .anime4k-controls__top .anime4k-toggle:hover,
body.is-detail .anime4k-controls__top .anime4k-performance:hover,
body.is-detail #videoMute:hover {
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(7,8,10,.72) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

/* Kill the visible top player header completely. */
body.is-detail .player-head,
body.is-detail .player-head:hover,
html:not([data-theme="light"]) body.is-detail .player-head,
html[data-theme="light"] body.is-detail .player-head {
  position: absolute !important;
  z-index: 18 !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  width: auto !important;
  max-width: calc(100% - 112px) !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  backdrop-filter: none !important;
  pointer-events: none !important;
}

body.is-detail .player-head::before,
body.is-detail .player-head::after {
  display: none !important;
}

body.is-detail .player-actions {
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

body.is-detail .season-switcher,
body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .player-translation,
body.is-detail .player-next-control {
  border-color: rgba(255,255,255,.22) !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.75);
  backdrop-filter: none !important;
}

body.is-detail .season-switcher:hover,
body.is-detail .episode-control:hover,
body.is-detail .source-control:hover,
body.is-detail .player-translation:hover,
body.is-detail .player-next-control:hover {
  border-color: rgba(255,192,138,.9) !important;
  background: rgba(255,192,138,.88) !important;
  color: #111 !important;
  box-shadow: 0 0 16px rgba(255,192,138,.32) !important;
  text-shadow: none !important;
}

body.is-detail .player-actions select {
  color: inherit !important;
  text-shadow: inherit !important;
}

/* No hover effects for player overlay controls. */
body.is-detail .player-head .season-switcher,
body.is-detail .player-head .episode-control,
body.is-detail .player-head .source-control,
body.is-detail .player-head .player-translation,
body.is-detail .player-head .player-next-control,
body.is-detail .quality-control,
body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-performance,
body.is-detail #videoMute {
  border-color: rgba(255,255,255,.22) !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.75) !important;
}

body.is-detail .player-head .season-switcher:hover,
body.is-detail .player-head .episode-control:hover,
body.is-detail .player-head .source-control:hover,
body.is-detail .player-head .player-translation:hover,
body.is-detail .player-head .player-next-control:hover,
body.is-detail .quality-control:hover,
body.is-detail .anime4k-controls__top .anime4k-toggle:hover,
body.is-detail .anime4k-controls__top .anime4k-performance:hover,
body.is-detail #videoMute:hover {
  border-color: rgba(255,255,255,.22) !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.75) !important;
}

body.is-detail .player-head .season-switcher:hover select,
body.is-detail .player-head .episode-control:hover select,
body.is-detail .player-head .source-control:hover select,
body.is-detail .player-head .player-translation:hover select {
  color: #fff !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.75) !important;
}

/* Keep the info card above the player and keep Kodik clean. */
body.is-detail .anime-hero {
  order: 0;
}

body.is-detail .player-card {
  order: 1;
}

body.is-detail .player-head {
  top: 10px;
  right: 12px;
  left: 12px;
}

body.is-detail .player-actions {
  gap: 6px;
}

body.is-detail .season-switcher,
body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .player-translation,
body.is-detail .anime4k-toggle,
body.is-detail .player-next-control {
  min-height: 32px;
  padding: 0 10px;
  border-radius: 4px;
  font-size: 12px;
}

body.is-detail .season-switcher select,
body.is-detail .episode-control select,
body.is-detail .source-control select,
body.is-detail .player-translation select,
body.is-detail .player-next-control,
body.is-detail .anime4k-toggle span {
  font-size: 12px;
  line-height: 1;
}

body.is-detail .season-switcher select {
  max-width: 92px;
}

body.is-detail .episode-control select {
  max-width: 104px;
}

body.is-detail .player-translation select {
  max-width: 150px;
}

body.is-detail .source-control select {
  max-width: 108px;
}

body.is-detail .quality-control {
  display: inline-flex !important;
}

body.is-detail .anime4k-toggle {
  gap: 5px;
  padding-inline: 9px;
}

body.is-detail .anime4k-toggle input {
  width: 14px;
  height: 14px;
}

body.is-detail .player-head .quality-control,
body.is-detail .player-head .anime4k-toggle {
  display: none !important;
}

body.is-detail .anime4k-controls__top {
  top: auto;
  right: 82px;
  bottom: 46px;
  left: auto;
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  pointer-events: none;
}

body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-performance {
  min-height: 28px;
  padding: 0 9px;
  border: 0 !important;
  border-radius: 3px;
  background: rgba(5,5,6,.86) !important;
  color: #fff;
  pointer-events: auto;
}

body.is-detail .anime4k-controls__top .anime4k-toggle span {
  font-size: 12px;
}

body.is-detail #videoSeek,
body.is-detail #videoVolume {
  --seek-progress: 0%;
  --volume-progress: 100%;
  height: 10px;
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 0;
  background: linear-gradient(90deg, var(--orange) 0 var(--seek-progress), rgba(255,255,255,.22) var(--seek-progress) 100%);
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 0;
  background: linear-gradient(90deg, var(--orange) 0 var(--volume-progress), rgba(255,255,255,.22) var(--volume-progress) 100%);
}

body.is-detail #videoSeek::-webkit-slider-thumb,
body.is-detail #videoVolume::-webkit-slider-thumb {
  width: 0;
  height: 8px;
  margin-top: 0;
  border: 0;
  opacity: 0;
  -webkit-appearance: none;
}

body.is-detail #videoSeek::-moz-range-track,
body.is-detail #videoVolume::-moz-range-track {
  height: 8px;
  border: 0;
  border-radius: 0;
  background: rgba(255,255,255,.22);
}

body.is-detail #videoSeek::-moz-range-progress,
body.is-detail #videoVolume::-moz-range-progress {
  height: 8px;
  border-radius: 0;
  background: var(--orange);
}

body.is-detail #videoSeek::-moz-range-thumb,
body.is-detail #videoVolume::-moz-range-thumb {
  width: 0;
  height: 8px;
  border: 0;
  opacity: 0;
}

body.is-detail .watch-sidebar section {
  border-radius: 2px;
  background: rgba(18,18,19,.96);
}

@media (max-width: 1100px) {
  body.is-detail .watch-layout {
    grid-template-columns: 1fr;
  }

  body.is-detail .watch-sidebar {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  body.is-detail .player-head {
    grid-template-columns: 1fr;
  }

  body.is-detail .css-filter-control,
  body.is-detail .player-actions {
    justify-content: flex-start;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 42px minmax(0, 1fr) 42px 32px 58px 34px;
    gap: 6px;
    padding-inline: 8px;
  }

  body.is-detail #videoVolume {
    width: 58px;
  }

  body.is-detail .anime4k-controls__top {
    right: 54px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  body.is-detail .anime4k-controls__top::-webkit-scrollbar {
    display: none;
  }
}

/* Final watch-player cleanup: no opening skip, transparent chat, comments only. */
body.is-detail .skip-opening,
body.is-detail [data-watch-tab="description"],
body.is-detail #descriptionPanel {
  display: none !important;
}

body.is-detail .anime4k-controls__top {
  right: 18px !important;
  bottom: 48px !important;
  gap: 6px;
}

body.is-detail .episodes-section {
  padding: 18px;
  border-radius: 6px;
  background: rgba(10,11,12,.84);
  border: 1px solid color-mix(in srgb, var(--orange) 34%, var(--line));
  box-shadow: 0 14px 34px rgba(0,0,0,.22);
}

body.is-detail .episodes-section .tabs {
  margin: 0 0 14px;
  padding: 0 0 10px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

body.is-detail .episodes-section .tabs [data-watch-tab="comments"] {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 4px;
  background: rgba(255,192,138,.12);
  color: var(--orange);
  font-size: 12px;
  font-weight: 900;
}

body.is-detail .episodes-section .tabs [data-watch-tab="comments"] span {
  min-width: 22px;
  height: 20px;
  padding: 0 7px;
  border-radius: 3px;
  background: rgba(255,255,255,.1);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
}

body.is-detail #commentsPanel,
body.is-detail #commentsPanel[hidden] {
  display: block !important;
}

body.is-detail .comment-form {
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border-radius: 6px;
  background: rgba(0,0,0,.24);
  border: 1px solid rgba(255,255,255,.08);
}

body.is-detail .comment-form textarea {
  min-height: 92px;
  border-radius: 4px;
  background: rgba(0,0,0,.32);
  border-color: rgba(255,255,255,.1);
  color: #f6f7f8;
  font-size: 13px;
  line-height: 1.55;
}

body.is-detail .comment-form__footer {
  margin-top: 10px;
  gap: 10px;
}

body.is-detail .comment-form__footer button {
  min-height: 34px;
  padding: 0 14px;
  border-radius: 4px;
  background: var(--orange);
  color: #0d0d0e;
  font-size: 11px;
  font-weight: 900;
}

body.is-detail .comments-list {
  gap: 10px;
  margin-top: 12px;
}

body.is-detail .comment-card {
  gap: 12px;
  padding: 13px;
  border-radius: 6px;
  background: rgba(0,0,0,.2);
  border: 1px solid rgba(255,255,255,.07);
}

body.is-detail .comment-card:hover {
  background: rgba(0,0,0,.28);
  border-color: rgba(255,192,138,.28);
}

body.is-detail .comment-card__content > p {
  color: rgba(246,247,248,.82);
  font-size: 13px;
  line-height: 1.55;
}

body.is-detail .comment-reactions button {
  border-radius: 4px;
  background: rgba(255,255,255,.06);
}

@media (max-width: 760px) {
  body.is-detail .anime4k-controls__top {
    right: 12px !important;
    bottom: 44px !important;
  }
}

/* Final polish pass for player controls and comments. */
body.is-detail .season-switcher { order: 1; }
body.is-detail .player-next-control { order: 2; }
body.is-detail .episode-control { order: 3; }
body.is-detail .player-translation { order: 4; }
body.is-detail .source-control { order: 5; }

body.is-detail .season-switcher,
body.is-detail .episode-control,
body.is-detail .source-control,
body.is-detail .player-translation,
body.is-detail .quality-control,
body.is-detail .anime4k-toggle,
body.is-detail .player-next-control,
body.is-detail .anime4k-controls button,
body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-performance {
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease, opacity .16s ease;
}

body.is-detail .season-switcher:hover,
body.is-detail .episode-control:hover,
body.is-detail .source-control:hover,
body.is-detail .player-translation:hover,
body.is-detail .quality-control:hover,
body.is-detail .anime4k-toggle:hover,
body.is-detail .player-next-control:hover,
body.is-detail .anime4k-controls button:hover,
body.is-detail .anime4k-controls__top .anime4k-toggle:hover,
body.is-detail .anime4k-controls__top .anime4k-performance:hover {
  transform: translateY(-1px);
  background: rgba(22,22,24,.96) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,192,138,.22);
}

body.is-detail .player-next-control:hover {
  color: var(--orange);
}

body.is-detail .episodes-section {
  padding: 16px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-left-color: rgba(255,255,255,.08) !important;
  background: rgba(8,9,10,.78);
  box-shadow: 0 12px 30px rgba(0,0,0,.2);
}

body.is-detail .episodes-section::before,
body.is-detail .episodes-section::after {
  display: none !important;
}

body.is-detail .episodes-section .tabs {
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

body.is-detail .episodes-section .tabs [data-watch-tab="comments"] {
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 5px;
  background: rgba(255,255,255,.05);
  color: #f4f5f6;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}

body.is-detail .episodes-section .tabs [data-watch-tab="comments"]:hover {
  transform: translateY(-1px);
  border-color: rgba(255,192,138,.44);
  background: rgba(255,192,138,.11);
  color: var(--orange);
}

body.is-detail .comment-form {
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 11px;
  padding: 12px;
  border-radius: 6px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.075);
}

body.is-detail .comment-form:hover {
  border-color: rgba(255,255,255,.14);
}

body.is-detail .comment-form__avatar,
body.is-detail .comment-card__avatar {
  box-shadow: 0 0 0 1px rgba(255,255,255,.12);
}

body.is-detail .comment-form textarea {
  min-height: 82px;
  border-radius: 5px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

body.is-detail .comment-form textarea:hover {
  border-color: rgba(255,255,255,.16);
  background: rgba(0,0,0,.28);
}

body.is-detail .comment-form textarea:focus {
  border-color: rgba(255,192,138,.58);
  box-shadow: 0 0 0 3px rgba(255,192,138,.1);
}

body.is-detail .comment-form__footer button,
body.is-detail .comment-user-actions button,
body.is-detail .comment-reactions button {
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}

body.is-detail .comment-form__footer button {
  border: 1px solid rgba(255,192,138,.5);
  background: linear-gradient(180deg, color-mix(in srgb, var(--orange) 92%, #fff), var(--orange));
  box-shadow: 0 8px 18px rgba(255,192,138,.16);
}

body.is-detail .comment-form__footer button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(255,192,138,.24);
  filter: brightness(1.04);
}

body.is-detail .comment-card {
  gap: 11px;
  padding: 12px;
  border-radius: 6px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.065);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

body.is-detail .comment-card:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.14);
}

body.is-detail .comment-card__content header {
  gap: 7px;
}

body.is-detail .comment-card__content > p {
  margin-top: 7px;
  margin-bottom: 10px;
  color: rgba(246,247,248,.78);
}

body.is-detail .comment-reactions {
  gap: 6px;
}

body.is-detail .comment-reactions button {
  min-height: 27px;
  border-radius: 5px;
  background: rgba(255,255,255,.045);
  border-color: rgba(255,255,255,.08);
}

body.is-detail .comment-reactions button:hover,
body.is-detail .comment-user-actions button:hover {
  transform: translateY(-1px);
  border-color: rgba(255,192,138,.4);
  background: rgba(255,192,138,.1);
  color: var(--orange);
}

/* Neon player bars and transparent chat shell. */
body.is-detail #videoSeek,
body.is-detail #videoVolume {
  height: 12px;
  filter: drop-shadow(0 0 5px rgba(255,192,138,.24));
}

body.is-detail #videoSeek::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 0;
  background:
    linear-gradient(90deg, #ffc08a 0%, #ffd7ad 55%, #fff0df 100%) 0 0 / var(--seek-progress) 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.09));
  box-shadow: 0 0 10px rgba(255,192,138,.24), 0 0 16px rgba(255,177,61,.12);
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 0;
  background:
    linear-gradient(90deg, #ffc08a 0%, #ffd7ad 55%, #fff0df 100%) 0 0 / var(--volume-progress) 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.09));
  box-shadow: 0 0 10px rgba(255,192,138,.24), 0 0 16px rgba(255,177,61,.12);
}

body.is-detail #videoSeek::-moz-range-progress {
  background: linear-gradient(90deg, #ffc08a, #ffd7ad 58%, #fff0df);
  box-shadow: 0 0 10px rgba(255,192,138,.24), 0 0 16px rgba(255,177,61,.12);
}

body.is-detail #videoVolume::-moz-range-progress {
  background: linear-gradient(90deg, #ffc08a, #ffd7ad 58%, #fff0df);
  box-shadow: 0 0 10px rgba(255,192,138,.24), 0 0 16px rgba(255,177,61,.12);
}

body.is-detail #videoMute {
  position: relative;
  font-size: 0 !important;
}

body.is-detail #videoMute::before {
  content: "";
  width: 9px;
  height: 12px;
  border-radius: 2px;
  background: #f7fbff;
  clip-path: polygon(0 32%, 42% 32%, 100% 0, 100% 100%, 42% 68%, 0 68%);
}

body.is-detail #videoMute::after {
  content: "";
  width: 10px;
  height: 14px;
  border-right: 2px solid #f7fbff;
  border-radius: 50%;
  opacity: .86;
}

body.is-detail #videoFullscreen:hover {
  transform: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
}

/* Hide episode sidebar and let the player use the freed width. */
body.is-detail .watch-layout {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.is-detail .watch-sidebar {
  display: none !important;
}

body.is-detail .watch-main,
body.is-detail .player-card,
body.is-detail .anime-hero,
body.is-detail .episodes-section {
  width: 100%;
  max-width: none;
}

body.is-detail .anime4k-controls button:hover {
  background: transparent !important;
  box-shadow: none !important;
}

body.is-detail #videoMute {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: transparent !important;
  line-height: 1;
}

body.is-detail #videoMute::before,
body.is-detail #videoMute::after {
  display: block;
  flex: 0 0 auto;
}

body.is-detail #videoMute::before {
  width: 11px;
  height: 14px;
  background: #f7fbff;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.28));
}

body.is-detail #videoMute::after {
  width: 9px;
  height: 13px;
  border-right: 2px solid #f7fbff;
  border-radius: 50%;
  opacity: .92;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.22));
}

body.is-detail .anime4k-controls button {
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.is-detail #videoMute {
  position: relative;
  overflow: visible;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: 34px;
  height: 34px;
  color: transparent !important;
  font-size: 0 !important;
}

body.is-detail #videoMute::before {
  content: "";
  display: block;
  width: 12px;
  height: 15px;
  background: #fff;
  clip-path: polygon(0 34%, 42% 34%, 100% 2%, 100% 98%, 42% 66%, 0 66%);
  filter: drop-shadow(0 0 4px rgba(255,255,255,.34));
}

body.is-detail #videoMute::after {
  content: "";
  display: block;
  width: 10px;
  height: 16px;
  border-right: 2px solid #fff;
  border-radius: 50%;
  opacity: .95;
  filter: drop-shadow(0 0 4px rgba(255,255,255,.28));
}

body.is-detail #videoMute:hover {
  border-color: rgba(255,192,138,.88) !important;
  background: rgba(255,192,138,.12) !important;
  box-shadow: 0 0 14px rgba(255,192,138,.26) !important;
}

body.is-detail #videoFullscreen,
body.is-detail #videoFullscreen:hover {
  border-color: transparent !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

/* WATCH PAGE CLEAN RESET
   Scoped to the viewing page only. Keeps functions and layout, removes noisy visual layers. */
body.is-detail .detail-page {
  --watch-bg: rgba(7,8,10,.88);
  --watch-panel: rgba(12,13,15,.92);
  --watch-panel-soft: rgba(16,17,19,.76);
  --watch-line: rgba(255,255,255,.1);
  --watch-line-strong: rgba(255,255,255,.16);
  --watch-text: #f5f6f7;
  --watch-muted: rgba(245,246,247,.62);
  --watch-orange: #ffc08a;
  --watch-orange-soft: rgba(255,192,138,.14);
  --watch-orange-glow: rgba(255,192,138,.34);
}

body.is-detail .watch-layout {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
}

body.is-detail .watch-sidebar {
  display: none !important;
}

body.is-detail .watch-main,
body.is-detail .player-card,
body.is-detail .anime-hero,
body.is-detail .episodes-section {
  width: 100% !important;
  max-width: none !important;
}

body.is-detail .player-card,
body.is-detail .anime-hero,
body.is-detail .episodes-section {
  border: 1px solid var(--watch-line) !important;
  border-radius: 6px !important;
  background: var(--watch-bg) !important;
  box-shadow: none !important;
  overflow: hidden;
}

body.is-detail .player-card {
  padding: 0 !important;
}

body.is-detail .player-card iframe,
body.is-detail .anime4k-stage {
  width: 100% !important;
  border-radius: 0 !important;
  background: #000 !important;
}

body.is-detail .player-head {
  padding: 10px 12px !important;
  background: rgba(5,6,7,.96) !important;
  border-top: 1px solid var(--watch-line) !important;
}

body.is-detail .player-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  max-width: none !important;
  overflow: visible !important;
}

body.is-detail .season-switcher { order: 1 !important; }
body.is-detail .player-next-control { order: 2 !important; }
body.is-detail .episode-control { order: 3 !important; }
body.is-detail .player-translation { order: 4 !important; }
body.is-detail .source-control { order: 5 !important; }
body.is-detail .quality-control { order: 6 !important; }

body.is-detail .season-switcher select,
body.is-detail .episode-control select,
body.is-detail .source-control select,
body.is-detail .player-translation select {
  color: inherit !important;
  background: transparent !important;
  font-weight: 900 !important;
}

body.is-detail .anime4k-controls {
  padding: 8px 10px !important;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.84)) !important;
  gap: 8px !important;
}

body.is-detail .anime4k-controls button {
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail #videoPlay:hover,
body.is-detail #videoMute:hover {
  border-color: rgba(255,192,138,.85) !important;
  background: var(--watch-orange-soft) !important;
  box-shadow: 0 0 14px rgba(255,192,138,.22) !important;
}

body.is-detail #videoFullscreen,
body.is-detail #videoFullscreen:hover {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-detail .animehub-center-play,
body.is-detail .animehub-center-play:hover,
body.is-detail .animehub-center-play:focus-visible {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 86px !important;
  height: 86px !important;
  display: grid !important;
  place-items: center !important;
  border-color: transparent !important;
  border-radius: 16px !important;
  background: var(--watch-orange) !important;
  color: #111 !important;
  box-shadow: none !important;
  transform: translate(-50%, -50%) !important;
  filter: none !important;
}

body.is-detail .animehub-center-play span {
  display: block !important;
  margin-left: 5px !important;
  font-size: 40px !important;
  line-height: 1 !important;
}

body.is-detail #videoSeek,
body.is-detail #videoVolume {
  height: 12px !important;
  filter: none !important;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track,
body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 7px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track {
  background:
    linear-gradient(90deg, var(--watch-orange), #ffd7ad) 0 0 / var(--seek-progress) 100% no-repeat,
    rgba(255,255,255,.16) !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  background:
    linear-gradient(90deg, var(--watch-orange), #ffd7ad) 0 0 / var(--volume-progress) 100% no-repeat,
    rgba(255,255,255,.16) !important;
}

body.is-detail #videoSeek::-webkit-slider-thumb,
body.is-detail #videoVolume::-webkit-slider-thumb {
  width: 0 !important;
  height: 7px !important;
  opacity: 0 !important;
}

body.is-detail #videoMute {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  width: 34px !important;
  height: 34px !important;
  color: transparent !important;
  font-size: 0 !important;
}

body.is-detail #videoMute::before {
  content: "" !important;
  display: block !important;
  width: 12px !important;
  height: 15px !important;
  background: #fff !important;
  clip-path: polygon(0 34%, 42% 34%, 100% 2%, 100% 98%, 42% 66%, 0 66%) !important;
}

body.is-detail #videoMute::after {
  content: "" !important;
  display: block !important;
  width: 10px !important;
  height: 16px !important;
  border-right: 2px solid #fff !important;
  border-radius: 50% !important;
}

body.is-detail .anime-hero {
  padding: 16px !important;
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) !important;
  gap: 18px !important;
}

body.is-detail .anime-info h1 {
  color: var(--watch-text) !important;
}

body.is-detail .anime-info .description,
body.is-detail .comment-card__content > p {
  color: rgba(245,246,247,.78) !important;
}

body.is-detail .episodes-section {
  padding: 16px !important;
  margin-top: 14px !important;
}

body.is-detail [data-watch-tab="description"],
body.is-detail #descriptionPanel {
  display: none !important;
}

body.is-detail #commentsPanel,
body.is-detail #commentsPanel[hidden] {
  display: block !important;
}

body.is-detail .episodes-section .tabs {
  margin: 0 0 12px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid var(--watch-line) !important;
}

body.is-detail .comment-form,
body.is-detail .comment-card {
  border: 1px solid var(--watch-line) !important;
  border-radius: 6px !important;
  background: var(--watch-panel-soft) !important;
  box-shadow: none !important;
  transform: none !important;
}

body.is-detail .comment-form:hover,
body.is-detail .comment-card:hover,
body.is-detail .comment-form textarea:hover {
  border-color: rgba(255,192,138,.42) !important;
  background: var(--watch-panel-soft) !important;
  box-shadow: none !important;
}

body.is-detail .comment-form textarea {
  min-height: 88px !important;
  border: 1px solid var(--watch-line) !important;
  border-radius: 4px !important;
  background: rgba(0,0,0,.24) !important;
  color: var(--watch-text) !important;
  box-shadow: none !important;
}

body.is-detail .comment-form textarea:focus {
  border-color: rgba(255,192,138,.72) !important;
  box-shadow: 0 0 0 2px rgba(255,192,138,.12) !important;
}

@media (max-width: 760px) {
  body.is-detail .anime-hero {
    grid-template-columns: 96px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 12px !important;
  }

  body.is-detail .player-actions {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }

  body.is-detail .player-actions::-webkit-scrollbar {
    display: none;
  }
}

/* Absolute final override: quality, 4K and sound never react visually. */
body.is-detail .anime4k-controls__top .anime4k-performance,
body.is-detail .anime4k-controls__top .anime4k-performance:hover,
body.is-detail .anime4k-controls__top .anime4k-performance:focus,
body.is-detail .anime4k-controls__top .anime4k-performance:focus-visible,
body.is-detail .anime4k-controls__top .anime4k-performance:active,
body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-toggle:hover,
body.is-detail .anime4k-controls__top .anime4k-toggle:focus-within,
body.is-detail .anime4k-controls__top .anime4k-toggle:active,
body.is-detail .anime4k-controls__top .anime4k-toggle:has(input:checked),
body.is-detail .anime4k-controls__top .anime4k-toggle:has(input:checked):hover,
body.is-detail .anime4k-controls__top .anime4k-toggle:has(input:checked):focus-within,
body.is-detail #videoMute,
body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoMute:active {
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(7,8,10,.72) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  outline: 0 !important;
  text-shadow: none !important;
  transition: none !important;
}

body.is-detail .anime4k-controls__top .anime4k-toggle input,
body.is-detail .anime4k-controls__top .anime4k-toggle input:hover,
body.is-detail .anime4k-controls__top .anime4k-toggle input:focus,
body.is-detail .anime4k-controls__top .anime4k-toggle input:checked,
body.is-detail .anime4k-controls__top .anime4k-toggle input:checked:hover {
  border-color: rgba(255,255,255,.34) !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  accent-color: transparent !important;
}

body.is-detail .anime4k-controls__top .anime4k-toggle input::after,
body.is-detail .anime4k-controls__top .anime4k-toggle input:checked::after {
  background: transparent !important;
  transform: none !important;
}

/* Redesigned comments block: quiet graphite base, peach only on intent. */
body.is-detail .comments-panel {
  padding-top: 0 !important;
}

body.is-detail .comments-layout {
  display: grid !important;
  gap: 14px !important;
  padding: 16px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(28,32,39,.92), rgba(14,17,22,.96)) !important;
}

body.is-detail .comments-intro {
  display: grid !important;
  gap: 4px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

body.is-detail .comments-intro span {
  color: var(--orange-2) !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
}

body.is-detail .comments-intro strong {
  color: #f5f6f8 !important;
  font-size: clamp(22px, 2.6vw, 34px) !important;
  line-height: 1 !important;
}

body.is-detail .comments-intro small {
  color: rgba(255,255,255,.5) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body.is-detail .comment-form,
body.is-detail .comment-form:hover {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  background: #141820 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  transform: none !important;
}

body.is-detail .comment-form__avatar,
body.is-detail .comment-card__avatar {
  width: 44px !important;
  height: 44px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px !important;
  background: #0f1218 !important;
}

body.is-detail .comment-form textarea,
body.is-detail .comment-form textarea:hover {
  min-height: 96px !important;
  padding: 13px 14px !important;
  border: 1px solid #303640 !important;
  border-radius: 12px !important;
  background: #10141a !important;
  color: var(--watch-text) !important;
  box-shadow: none !important;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
}

body.is-detail .comment-form textarea:focus,
body.is-detail .comment-form textarea:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #121821 !important;
  box-shadow: 0 0 0 3px rgba(255,164,119,.1) !important;
}

body.is-detail .comment-form__footer {
  margin-top: 10px !important;
}

body.is-detail .comment-form__footer span {
  color: rgba(255,255,255,.48) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

body.is-detail .comment-form__footer button {
  border: 1px solid #303640 !important;
  background: #1a1f27 !important;
  color: #f5f6f8 !important;
  transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

body.is-detail .comment-form__footer button:hover {
  border-color: rgba(255,164,119,.78) !important;
  background: #222832 !important;
  color: var(--orange-2) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,164,119,.12) !important;
  transform: translateY(-1px) !important;
  filter: none !important;
}

body.is-detail .comments-list {
  gap: 10px !important;
  margin-top: 0 !important;
}

body.is-detail .comment-card,
body.is-detail .comment-card:hover {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  background: #12161d !important;
  box-shadow: none !important;
  transform: none !important;
  transition: border-color .16s ease, background .16s ease !important;
}

body.is-detail .comment-card:hover {
  border-color: rgba(255,164,119,.34) !important;
  background: #151a22 !important;
}

body.is-detail .comment-card__content header {
  padding-bottom: 6px !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
}

body.is-detail .comment-card__content > p {
  margin: 10px 0 12px !important;
  color: rgba(245,246,248,.82) !important;
  font-size: 13px !important;
}

body.is-detail .comment-reactions {
  gap: 7px !important;
}

body.is-detail .comment-reactions button,
body.is-detail .comment-user-actions button {
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: rgba(255,255,255,.66) !important;
  transition: border-color .16s ease, background .16s ease, color .16s ease !important;
}

body.is-detail .comment-reactions button:hover,
body.is-detail .comment-user-actions button:hover {
  border-color: rgba(255,164,119,.64) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
}

body.is-detail .comment-reactions button.is-active {
  border-color: rgba(255,164,119,.78) !important;
  background: #222832 !important;
  color: var(--orange-2) !important;
}

/* The center play button must obey JS visibility state. */
body.is-detail .animehub-center-play[hidden] {
  display: none !important;
  pointer-events: none !important;
}

/* Bottom player bar like Yummy: compact black rail, 4K replaces settings. */
body.is-detail .anime4k-controls {
  left: 12px !important;
  right: 12px !important;
  bottom: 10px !important;
  height: 42px !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 54px 58px minmax(120px, 1fr) 58px 34px 116px 60px 34px !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  pointer-events: none !important;
}

body.is-detail #videoPlay {
  width: 54px !important;
  height: 42px !important;
  border-radius: 4px !important;
  background: rgba(6,7,8,.94) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: 24px !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

body.is-detail #videoCurrentTime,
body.is-detail .video-seek-wrap,
body.is-detail #videoDuration,
body.is-detail #videoMute,
body.is-detail #videoVolume,
body.is-detail .anime4k-controls > .anime4k-toggle,
body.is-detail #videoFullscreen {
  pointer-events: auto !important;
}

body.is-detail #videoCurrentTime,
body.is-detail #videoDuration {
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(6,7,8,.94) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

body.is-detail .video-seek-wrap {
  height: 34px !important;
  padding: 0 8px !important;
  background: rgba(6,7,8,.94) !important;
}

body.is-detail #videoSeek,
body.is-detail #videoVolume {
  height: 8px !important;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track,
body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 7px !important;
  background:
    linear-gradient(90deg, var(--watch-orange), #ffd7ad) 0 0 / var(--seek-progress) 100% no-repeat,
    rgba(255,255,255,.16) !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  background:
    linear-gradient(90deg, var(--watch-orange), #ffd7ad) 0 0 / var(--volume-progress) 100% no-repeat,
    rgba(255,255,255,.16) !important;
}

body.is-detail #videoMute,
body.is-detail #videoFullscreen,
body.is-detail .anime4k-controls > .anime4k-toggle {
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 4px !important;
  background: rgba(6,7,8,.94) !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume {
  width: 116px !important;
  padding: 0 !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle {
  width: 60px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  color: #fff !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle span {
  font-size: 12px !important;
  font-weight: 900 !important;
  color: #fff !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle input {
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
}

body.is-detail #videoPlay:hover,
body.is-detail #videoMute:hover,
body.is-detail #videoFullscreen:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:focus-within,
body.is-detail .anime4k-controls > .anime4k-toggle:has(input:checked),
body.is-detail .anime4k-controls > .anime4k-toggle:has(input:checked):hover {
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(6,7,8,.94) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail .anime4k-controls__top .anime4k-performance {
  right: 0 !important;
}

/* Final bottom controls fit: 720 + 4K + volume stay in one Yummy-like row. */
body.is-detail .anime4k-controls {
  left: 12px !important;
  right: 12px !important;
  bottom: 10px !important;
  height: 42px !important;
  display: grid !important;
  grid-template-columns: 54px 58px minmax(90px, 1fr) 62px 42px 150px 52px 66px 42px !important;
  gap: 6px !important;
  align-items: center !important;
  padding: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
}

body.is-detail .anime4k-controls__top .anime4k-performance {
  display: none !important;
}

body.is-detail .anime4k-controls > .anime4k-performance {
  width: 52px !important;
  height: 34px !important;
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 4px !important;
  background: rgba(6,7,8,.94) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

body.is-detail #videoPlay,
body.is-detail #videoCurrentTime,
body.is-detail .video-seek-wrap,
body.is-detail #videoDuration,
body.is-detail #videoMute,
body.is-detail #videoVolume,
body.is-detail .anime4k-controls > .anime4k-performance,
body.is-detail .anime4k-controls > .anime4k-toggle,
body.is-detail #videoFullscreen {
  background: rgba(6,7,8,.94) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail #videoPlay {
  width: 54px !important;
  height: 42px !important;
}

body.is-detail .video-seek-wrap {
  min-width: 0 !important;
}

body.is-detail #videoMute {
  width: 42px !important;
  height: 34px !important;
}

body.is-detail #videoVolume {
  width: 150px !important;
  height: 34px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 4px !important;
  pointer-events: auto !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle {
  width: 66px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 9px !important;
  justify-content: center !important;
  gap: 5px !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle input {
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  flex: 0 0 14px !important;
  opacity: 0 !important;
  appearance: auto !important;
  accent-color: var(--watch-orange) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle:hover input,
body.is-detail .anime4k-controls > .anime4k-toggle:focus-within input,
body.is-detail .anime4k-controls > .anime4k-toggle:has(input:checked) input {
  opacity: 1 !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle input::after,
body.is-detail .anime4k-controls > .anime4k-toggle input:checked::after {
  content: none !important;
  display: none !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle span {
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

body.is-detail #videoFullscreen {
  width: 42px !important;
  height: 34px !important;
}

body.is-detail #videoPlay:hover,
body.is-detail #videoMute:hover,
body.is-detail #videoFullscreen:hover,
body.is-detail .anime4k-controls > .anime4k-performance:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:focus-within,
body.is-detail .anime4k-controls > .anime4k-toggle:has(input:checked),
body.is-detail .anime4k-controls > .anime4k-toggle:has(input:checked):hover {
  background: rgba(6,7,8,.94) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

@media (max-width: 760px) {
  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 48px minmax(70px, 1fr) 52px 36px 92px 44px 58px 36px !important;
    gap: 4px !important;
    left: 8px !important;
    right: 8px !important;
  }

  body.is-detail #videoVolume {
    width: 92px !important;
    padding-inline: 7px !important;
  }
}

/* Bottom controls final alignment: play, time, seek, duration, sound, volume, 720, 4K, fullscreen. */
body.is-detail .anime4k-controls {
  grid-template-columns: 54px 58px minmax(140px, 1fr) 62px 42px 106px 52px 58px 42px !important;
  gap: 5px !important;
}

body.is-detail #videoPlay { order: 1 !important; }
body.is-detail #videoCurrentTime { order: 2 !important; }
body.is-detail .video-seek-wrap { order: 3 !important; }
body.is-detail #videoDuration { order: 4 !important; }
body.is-detail #videoMute { order: 5 !important; }
body.is-detail #videoVolume { order: 6 !important; }
body.is-detail .anime4k-controls > .anime4k-performance { order: 7 !important; }
body.is-detail .anime4k-controls > .anime4k-toggle { order: 8 !important; }
body.is-detail #videoFullscreen { order: 9 !important; }

body.is-detail #videoMute {
  width: 42px !important;
  min-width: 42px !important;
}

body.is-detail #videoVolume {
  width: 106px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 7px !important;
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, var(--watch-orange), #ffd7ad) 0 0 / var(--volume-progress) 100% no-repeat,
    rgba(255,255,255,.18) !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-moz-range-track {
  height: 7px !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.18) !important;
}

body.is-detail #videoVolume::-moz-range-progress {
  height: 7px !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, var(--watch-orange), #ffd7ad) !important;
}

body.is-detail .anime4k-controls > .anime4k-performance {
  width: 52px !important;
  min-width: 52px !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle {
  width: 58px !important;
  min-width: 58px !important;
}

body.is-detail #videoFullscreen {
  width: 42px !important;
  min-width: 42px !important;
}

@media (max-width: 760px) {
  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 48px minmax(64px, 1fr) 52px 36px 76px 44px 54px 36px !important;
    gap: 4px !important;
  }

  body.is-detail #videoVolume {
    width: 76px !important;
  }
}

/* Kodik/Yummy-like segmented volume meter and cleaner sound icon. */
body.is-detail #videoMute::before {
  width: 11px !important;
  height: 13px !important;
  background: #fff !important;
  clip-path: polygon(0 36%, 38% 36%, 100% 8%, 100% 92%, 38% 64%, 0 64%) !important;
  filter: none !important;
}

body.is-detail #videoMute::after {
  width: 13px !important;
  height: 13px !important;
  border: 0 !important;
  border-right: 2px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: 4px 0 0 -2px #fff;
  opacity: .95 !important;
  filter: none !important;
}

body.is-detail #videoVolume {
  width: 116px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 16px !important;
  border-radius: 0 !important;
  background:
    repeating-linear-gradient(90deg, var(--watch-orange) 0 4px, transparent 4px 8px) 0 50% / var(--volume-progress) 16px no-repeat,
    repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 4px, transparent 4px 8px) 0 50% / 100% 16px no-repeat !important;
}

body.is-detail #videoVolume::-moz-range-track {
  height: 16px !important;
  border-radius: 0 !important;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 4px, transparent 4px 8px) !important;
}

body.is-detail #videoVolume::-moz-range-progress {
  height: 16px !important;
  border-radius: 0 !important;
  background: repeating-linear-gradient(90deg, var(--watch-orange) 0 4px, transparent 4px 8px) !important;
}

body.is-detail #videoVolume::-webkit-slider-thumb,
body.is-detail #videoVolume::-moz-range-thumb {
  width: 0 !important;
  height: 16px !important;
  opacity: 0 !important;
  border: 0 !important;
}

@media (max-width: 760px) {
  body.is-detail #videoVolume {
    width: 84px !important;
  }
}

/* Final fit polish: sound icon, 4K checkbox, comments focus, watch-party calm glass. */
body.is-detail .anime4k-controls {
  grid-template-columns: 54px 58px minmax(120px, 1fr) 62px 30px 104px 58px 66px 42px !important;
  gap: 7px !important;
}

body.is-detail #videoMute,
body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus,
body.is-detail #videoMute:active {
  width: 30px !important;
  min-width: 30px !important;
  height: 34px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

body.is-detail #videoMute::before {
  content: "" !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  background-color: #fff !important;
  background-image: none !important;
  clip-path: none !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5 6 9H3v6h3l5 4V5Z'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7'/%3E%3Cpath d='M18.5 5.5a9 9 0 0 1 0 13'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5 6 9H3v6h3l5 4V5Z'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7'/%3E%3Cpath d='M18.5 5.5a9 9 0 0 1 0 13'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

body.is-detail #videoMute::after {
  content: none !important;
  display: none !important;
}

body.is-detail #videoVolume {
  width: 104px !important;
  margin-right: 10px !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle {
  width: 66px !important;
  min-width: 66px !important;
  padding: 0 8px !important;
}

body.is-detail .anime4k-controls > .anime4k-toggle input,
body.is-detail .anime4k-controls > .anime4k-toggle input:hover,
body.is-detail .anime4k-controls > .anime4k-toggle input:focus,
body.is-detail .anime4k-controls > .anime4k-toggle input:checked,
body.is-detail .anime4k-controls > .anime4k-toggle input:checked:hover {
  opacity: 1 !important;
  appearance: auto !important;
  accent-color: var(--watch-orange) !important;
  background: transparent !important;
  border-color: rgba(255,255,255,.42) !important;
  box-shadow: none !important;
}

body.is-detail .comment-form textarea:focus,
body.is-detail .comment-form textarea:focus-visible,
body.is-detail .comment-form textarea:hover {
  border-color: rgba(255,164,119,.72) !important;
  box-shadow: 0 0 0 3px rgba(255,164,119,.1) !important;
  outline: 0 !important;
}

/* Keep native select popups dark in the player controls. */
body.is-detail .player-actions select,
body.is-detail .player-actions select:hover,
body.is-detail .player-actions select:focus,
body.is-detail .player-actions select:active {
  background-color: rgba(7,8,10,.94) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.22) !important;
  color-scheme: dark;
}

body.is-detail .player-actions select option,
body.is-detail .player-actions select optgroup {
  background-color: #090a0c !important;
  color: #fff !important;
}

body.is-detail .player-actions select option:checked,
body.is-detail .player-actions select option:hover {
  background-color: #22252a !important;
  color: #fff !important;
}

@media (max-width: 760px) {
  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 48px minmax(60px, 1fr) 52px 28px 62px 44px 62px 36px !important;
    gap: 4px !important;
  }

  body.is-detail #videoVolume {
    width: 62px !important;
    margin-right: 6px !important;
  }
}

/* Final detail polish: softer player chrome and clean header icons. */
.theme-toggle,
.notification-button {
  color: #fff;
}

html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .notification-button {
  color: #111820;
}

.theme-toggle,
.theme-toggle:hover,
.theme-toggle:focus,
.theme-toggle:active {
  font-size: 0 !important;
  transform: none !important;
}

.theme-toggle::before,
.notification-button::before {
  content: "";
  display: block;
  width: 19px;
  height: 19px;
  background: currentColor;
  transition: background .18s ease;
}

.theme-toggle::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12Zm0 4a1 1 0 0 1-1-1v-1.35a1 1 0 1 1 2 0V21a1 1 0 0 1-1 1Zm0-16.65a1 1 0 0 1-1-1V3a1 1 0 1 1 2 0v1.35a1 1 0 0 1-1 1ZM4.22 20.78a1 1 0 0 1-.7-1.71l.95-.96a1 1 0 0 1 1.42 1.42l-.96.95a1 1 0 0 1-.71.3Zm14.6-14.6a1 1 0 0 1-.7-1.71l.95-.96a1 1 0 1 1 1.42 1.42l-.96.95a1 1 0 0 1-.71.3ZM3 13a1 1 0 1 1 0-2h1.35a1 1 0 1 1 0 2H3Zm16.65 0a1 1 0 1 1 0-2H21a1 1 0 1 1 0 2h-1.35ZM4.47 5.89l-.96-.96a1 1 0 0 1 1.42-1.42l.95.96a1 1 0 1 1-1.41 1.42Zm14.6 14.6-.96-.96a1 1 0 0 1 1.42-1.42l.95.96a1 1 0 0 1-1.41 1.42Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12Zm0 4a1 1 0 0 1-1-1v-1.35a1 1 0 1 1 2 0V21a1 1 0 0 1-1 1Zm0-16.65a1 1 0 0 1-1-1V3a1 1 0 1 1 2 0v1.35a1 1 0 0 1-1 1ZM4.22 20.78a1 1 0 0 1-.7-1.71l.95-.96a1 1 0 0 1 1.42 1.42l-.96.95a1 1 0 0 1-.71.3Zm14.6-14.6a1 1 0 0 1-.7-1.71l.95-.96a1 1 0 1 1 1.42 1.42l-.96.95a1 1 0 0 1-.71.3ZM3 13a1 1 0 1 1 0-2h1.35a1 1 0 1 1 0 2H3Zm16.65 0a1 1 0 1 1 0-2H21a1 1 0 1 1 0 2h-1.35ZM4.47 5.89l-.96-.96a1 1 0 0 1 1.42-1.42l.95.96a1 1 0 1 1-1.41 1.42Zm14.6 14.6-.96-.96a1 1 0 0 1 1.42-1.42l.95.96a1 1 0 0 1-1.41 1.42Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

html[data-theme="light"] .theme-toggle::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M20.76 15.84a1 1 0 0 1 .2 1.05A9.7 9.7 0 0 1 12.01 23C6.49 23 2 18.51 2 12.99 2 8.63 4.8 4.77 8.95 3.43a1 1 0 0 1 1.25 1.28 8.02 8.02 0 0 0-.43 2.6 8.13 8.13 0 0 0 8.13 8.13c.58 0 1.15-.06 1.7-.18a1 1 0 0 1 1.16.58Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M20.76 15.84a1 1 0 0 1 .2 1.05A9.7 9.7 0 0 1 12.01 23C6.49 23 2 18.51 2 12.99 2 8.63 4.8 4.77 8.95 3.43a1 1 0 0 1 1.25 1.28 8.02 8.02 0 0 0-.43 2.6 8.13 8.13 0 0 0 8.13 8.13c.58 0 1.15-.06 1.7-.18a1 1 0 0 1 1.16.58Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.notification-button span {
  display: none !important;
}

.notification-button::before {
  width: 18px;
  height: 18px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E") center / contain no-repeat;
}

.theme-toggle:hover,
.theme-toggle:focus-visible,
.notification-button:hover,
.notification-button:focus-visible,
.notification-button.is-active {
  color: var(--anime-primary, var(--orange)) !important;
  border-color: color-mix(in srgb, var(--anime-primary, var(--orange)) 62%, var(--line)) !important;
}

.notification-button b {
  background: var(--anime-primary, var(--orange)) !important;
  color: #0a0a0a !important;
  box-shadow: 0 0 14px color-mix(in srgb, var(--anime-primary, var(--orange)) 42%, transparent) !important;
}

body.is-detail .profile-button,
body.is-detail .profile-button:hover,
body.is-detail .profile-button:focus,
body.is-detail .profile-button:active {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.is-detail .nav--footer button:hover,
body.is-detail .nav--footer button:focus,
body.is-detail .nav--footer button:active {
  border-left-color: transparent !important;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  transform: none !important;
  backdrop-filter: none !important;
}

body.is-detail .nav--footer button:hover span,
body.is-detail .nav--footer button:focus span,
body.is-detail .nav--footer button:active span {
  color: #d6d6d4 !important;
}

html[data-theme="light"] body.is-detail .nav--footer button:hover span,
html[data-theme="light"] body.is-detail .nav--footer button:focus span,
html[data-theme="light"] body.is-detail .nav--footer button:active span {
  color: #52687a !important;
}

body.is-detail .anime4k-controls {
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.34)) !important;
}

body.is-detail #videoPlay,
body.is-detail #videoCurrentTime,
body.is-detail #videoDuration,
body.is-detail .video-seek-wrap,
body.is-detail .anime4k-controls > .anime4k-performance,
body.is-detail .anime4k-controls > .anime4k-toggle,
body.is-detail #videoFullscreen {
  background-color: rgba(0,0,0,.30) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: none !important;
}

body.is-detail #videoCurrentTime,
body.is-detail #videoDuration,
body.is-detail .anime4k-controls > .anime4k-performance,
body.is-detail .anime4k-controls > .anime4k-toggle,
body.is-detail #videoFullscreen {
  background-color: rgba(0,0,0,.22) !important;
}

body.is-detail #videoPlay {
  background-color: rgba(0,0,0,.48) !important;
}

/* Header icon correction: cleaner theme glyph, calm bell hover. */
.theme-toggle::before {
  width: 20px !important;
  height: 20px !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2'/%3E%3Cpath d='M12 20v2'/%3E%3Cpath d='m4.93 4.93 1.41 1.41'/%3E%3Cpath d='m17.66 17.66 1.41 1.41'/%3E%3Cpath d='M2 12h2'/%3E%3Cpath d='M20 12h2'/%3E%3Cpath d='m6.34 17.66-1.41 1.41'/%3E%3Cpath d='m19.07 4.93-1.41 1.41'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2'/%3E%3Cpath d='M12 20v2'/%3E%3Cpath d='m4.93 4.93 1.41 1.41'/%3E%3Cpath d='m17.66 17.66 1.41 1.41'/%3E%3Cpath d='M2 12h2'/%3E%3Cpath d='M20 12h2'/%3E%3Cpath d='m6.34 17.66-1.41 1.41'/%3E%3Cpath d='m19.07 4.93-1.41 1.41'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

html[data-theme="light"] .theme-toggle::before {
  width: 19px !important;
  height: 19px !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a6 6 0 0 0 9 7.5A9 9 0 1 1 12 3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a6 6 0 0 0 9 7.5A9 9 0 1 1 12 3Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

.notification-button:hover,
.notification-button:focus-visible,
.notification-button.is-active {
  color: #a8b0b8 !important;
  border-color: rgba(168,176,184,.42) !important;
}

/* Anivox-inspired refresh: rounder typography, softer dark surface, pink accent. */
:root {
  --bg: #0b0b0d;
  --panel: #111113;
  --panel-2: #171719;
  --panel-3: #202024;
  --line: rgba(255,255,255,.09);
  --line-soft: rgba(255,255,255,.055);
  --text: #fbfbfb;
  --muted: #a7a7ad;
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  --blue: #8ad7ff;
  --anime-primary: var(--orange);
  --anime-accent: var(--orange-2);
  --anime-glow: rgba(255,192,138,.24);
  --radius: 22px;
}

body {
  background:
    linear-gradient(180deg, rgba(255,192,138,.035), transparent 260px),
    #0a0a0c;
  font-family: "Arial Rounded MT Bold", "Nunito", Inter, ui-rounded, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
}

html:not([data-theme="light"]) body::before {
  opacity: .52;
  background-image:
    radial-gradient(circle at 18% 18%, rgba(255,192,138,.34) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 24%, rgba(255,190,224,.26) 0 2px, transparent 3px),
    radial-gradient(circle at 48% 62%, rgba(255,192,138,.22) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 74%, rgba(255,190,224,.22) 0 2px, transparent 3px);
  background-size: 440px 420px, 520px 500px, 620px 580px, 720px 680px;
  mask-image: linear-gradient(to bottom, black, rgba(0,0,0,.72) 70%, transparent);
}

.site-shell,
body.is-home .site-shell,
body.is-detail .site-shell {
  width: 100%;
  max-width: none;
  border: 0;
  background: rgba(10,10,12,.96);
  box-shadow: none;
}

.topbar,
html:not([data-theme="light"]) body.is-detail .topbar {
  grid-template-columns: 188px minmax(280px, 560px) 1fr;
  height: 76px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(13,13,15,.88);
  backdrop-filter: blur(22px);
  box-shadow: none;
}

.logo {
  align-items: center;
  min-height: 52px;
  padding-left: 24px;
  font-size: 25px;
  font-weight: 1000;
  letter-spacing: 0;
}

.logo::before {
  content: "";
  width: 42px;
  height: 42px;
  margin-right: 10px;
  border-radius: 15px;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='black' d='M24 4c8.2 0 15.4 4.8 18.7 11.9l-4.4 4.4-4.8-9.8-7.5 5.1-7.5-5.1-4.8 9.8-4.4-4.4C12.6 8.8 15.8 4 24 4Zm0 11.6 9.8 6.6v7.5L24 39.8l-9.8-10.1v-7.5L24 15.6Zm-4 8.8v7.2l7-3.6-7-3.6Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='black' d='M24 4c8.2 0 15.4 4.8 18.7 11.9l-4.4 4.4-4.8-9.8-7.5 5.1-7.5-5.1-4.8 9.8-4.4-4.4C12.6 8.8 15.8 4 24 4Zm0 11.6 9.8 6.6v7.5L24 39.8l-9.8-10.1v-7.5L24 15.6Zm-4 8.8v7.2l7-3.6-7-3.6Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.logo-anime,
.logo-hub {
  color: #fff;
}

.logo-hub,
body.is-detail .logo-hub,
.logo:hover .logo-hub,
.logo:focus-visible .logo-hub {
  margin-left: 3px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--orange);
  box-shadow: none;
  transform: none;
}

.logo-tail,
.logo::after {
  display: none !important;
}

.top-search {
  height: 46px;
  grid-template-columns: 48px minmax(0, 1fr);
  margin-left: 10px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  box-shadow: none;
}

.top-search:hover,
.top-search:focus-within,
html:not([data-theme="light"]) .top-search:focus-within {
  background: rgba(255,255,255,.11);
  box-shadow: inset 0 0 0 2px rgba(255,192,138,.34);
}

.top-search input {
  padding-right: 18px;
  font-size: 15px;
  font-weight: 800;
}

.top-search button {
  width: 48px;
  height: 46px;
  color: #fff;
}

.top-actions {
  gap: 14px;
  padding-right: 28px;
}

.theme-toggle,
.notification-button {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  color: #fff;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  color: #0b0b0d !important;
  background: var(--orange) !important;
  border-color: transparent !important;
}

.notification-button:hover,
.notification-button:focus-visible,
.notification-button.is-active {
  color: #c9c9cf !important;
  background: rgba(255,255,255,.11) !important;
  border-color: transparent !important;
}

.profile-button {
  min-height: 46px;
  padding: 0 14px 0 4px;
  border-radius: 999px;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
}

.profile-button:hover {
  background: rgba(255,255,255,.075);
}

.profile-avatar {
  width: 42px;
  height: 42px;
  border: 0;
  background: linear-gradient(145deg, #ffb0df, #ffd7ad);
}

.sidebar {
  top: 76px;
  height: calc(100vh - 76px);
  padding: 16px 10px;
}

.nav {
  gap: 10px;
  padding: 0;
}

.nav a,
.nav button {
  min-height: 50px;
  grid-template-columns: 34px 1fr;
  padding: 0 16px;
  border: 0;
  border-radius: 18px;
  color: #a8a8ad;
  font-size: 14px;
  font-weight: 900;
}

.nav a span,
.nav button span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  font-size: 0;
  color: currentColor;
}

.nav a span::before,
.nav button span::before {
  content: "";
  width: 19px;
  height: 19px;
  background: currentColor;
}

.nav a:nth-child(1) span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 9-8 9 8'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav a:nth-child(2) span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M7 8h10M7 12h10M7 16h6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M7 8h10M7 12h10M7 16h6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav a:nth-child(3) span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 1 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 1 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav a:nth-child(4) span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7'/%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7'/%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav--footer a span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.2 2h-.4a2 2 0 0 0-2 2v.2a2 2 0 0 1-1 1.7l-.4.2a2 2 0 0 1-2 0l-.2-.1a2 2 0 0 0-2.7.7l-.2.4a2 2 0 0 0 .7 2.7l.2.1a2 2 0 0 1 1 1.7v.5a2 2 0 0 1-1 1.7l-.2.1a2 2 0 0 0-.7 2.7l.2.4a2 2 0 0 0 2.7.7l.2-.1a2 2 0 0 1 2 0l.4.2a2 2 0 0 1 1 1.7v.2a2 2 0 0 0 2 2h.4a2 2 0 0 0 2-2v-.2a2 2 0 0 1 1-1.7l.4-.2a2 2 0 0 1 2 0l.2.1a2 2 0 0 0 2.7-.7l.2-.4a2 2 0 0 0-.7-2.7l-.2-.1a2 2 0 0 1-1-1.7v-.5a2 2 0 0 1 1-1.7l.2-.1a2 2 0 0 0 .7-2.7l-.2-.4a2 2 0 0 0-2.7-.7l-.2.1a2 2 0 0 1-2 0l-.4-.2a2 2 0 0 1-1-1.7V4a2 2 0 0 0-2-2Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.2 2h-.4a2 2 0 0 0-2 2v.2a2 2 0 0 1-1 1.7l-.4.2a2 2 0 0 1-2 0l-.2-.1a2 2 0 0 0-2.7.7l-.2.4a2 2 0 0 0 .7 2.7l.2.1a2 2 0 0 1 1 1.7v.5a2 2 0 0 1-1 1.7l-.2.1a2 2 0 0 0-.7 2.7l.2.4a2 2 0 0 0 2.7.7l.2-.1a2 2 0 0 1 2 0l.4.2a2 2 0 0 1 1 1.7v.2a2 2 0 0 0 2 2h.4a2 2 0 0 0 2-2v-.2a2 2 0 0 1 1-1.7l.4-.2a2 2 0 0 1 2 0l.2.1a2 2 0 0 0 2.7-.7l.2-.4a2 2 0 0 0-.7-2.7l-.2-.1a2 2 0 0 1-1-1.7v-.5a2 2 0 0 1 1-1.7l.2-.1a2 2 0 0 0 .7-2.7l-.2-.4a2 2 0 0 0-2.7-.7l-.2.1a2 2 0 0 1-2 0l-.4-.2a2 2 0 0 1-1-1.7V4a2 2 0 0 0-2-2Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav--footer button span::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center / contain no-repeat;
}

.nav a:hover,
.nav button:hover,
.nav a.is-active,
body.is-home .sidebar .nav a:hover,
body.is-home .sidebar .nav button:hover,
body.is-home .sidebar .nav a.is-active,
body.is-home .sidebar .nav a[data-nav="home"] {
  background: rgba(255,192,138,.16);
  color: #fff;
  backdrop-filter: blur(10px);
}

.home-page,
.detail-page {
  padding: 22px clamp(18px, 3vw, 44px) 42px;
}

.section-head h2,
.page-heading h1,
.title-line h1,
.watch-progress h3 {
  font-weight: 1000;
  letter-spacing: 0;
}

.section-head h2 {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: clamp(24px, 2.3vw, 34px);
}

.section-head h2::before {
  content: "";
  width: 24px;
  height: 24px;
  border-radius: 9px;
  background: var(--orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2.5 14.9 8l6.1.8-4.4 4.3 1 6.1L12 16.3 6.4 19.2l1-6.1L3 8.8 9.1 8 12 2.5Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2.5 14.9 8l6.1.8-4.4 4.3 1 6.1L12 16.3 6.4 19.2l1-6.1L3 8.8 9.1 8 12 2.5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.watch-progress {
  min-height: min(620px, calc(100vh - 132px));
  grid-template-columns: minmax(280px, 42%) minmax(0, 1fr) 86px;
  align-items: end;
  padding: clamp(34px, 5vw, 70px);
  border: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(10,10,12,.96) 0 30%, rgba(10,10,12,.62) 56%, rgba(10,10,12,.94) 100%),
    var(--hero-bg, none) right center / auto 105% no-repeat,
    #101012;
  box-shadow: none;
}

.watch-progress::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .45;
  background:
    radial-gradient(circle at 17% 33%, rgba(255,192,138,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 66% 18%, rgba(255,204,229,.42) 0 2px, transparent 3px),
    radial-gradient(circle at 78% 72%, rgba(255,192,138,.38) 0 2px, transparent 3px);
  background-size: 360px 330px, 520px 480px, 440px 390px;
}

.watch-progress > * {
  position: relative;
  z-index: 1;
}

.progress-cover {
  border-radius: 22px;
  box-shadow: 0 22px 60px rgba(0,0,0,.44);
}

.watch-progress h3 {
  max-width: 620px;
  margin-bottom: 18px;
  color: #fff;
  font-size: clamp(42px, 7vw, 86px);
  line-height: .94;
}

.watch-progress p {
  color: #b9b9bf;
  font-size: 16px;
  font-weight: 700;
}

.watch-progress .progress-meta,
.chips,
.meta-chips {
  gap: 10px;
}

.watch-progress .progress-meta span,
.chips span,
.meta-chips span,
.age-chip {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.11);
  color: #fff;
  font-size: 13px;
  font-weight: 1000;
}

.watch-button,
.accent-button,
.round-play,
.google-login-button,
.auth-form button {
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--orange) !important;
  color: #101012 !important;
  font-weight: 1000 !important;
  box-shadow: none !important;
}

.watch-button:hover,
.accent-button:hover,
.round-play:hover,
.google-login-button:hover,
.auth-form button:hover {
  filter: brightness(1.04) !important;
  transform: translateY(-1px);
}

.bookmark-button,
.share-button,
.link-button,
.danger-link {
  border-radius: 999px;
  font-weight: 1000;
}

.poster-section {
  margin-top: 32px;
}

.poster-row,
.poster-grid,
.favorites-grid,
.history-grid {
  gap: 20px;
}

.poster-card,
.mini-card,
.favorite-card,
.history-card,
.continue-item,
.catalog-card {
  border: 0 !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  transition: transform .2s ease, background .2s ease, filter .2s ease !important;
}

.poster-card:hover,
.mini-card:hover,
.favorite-card:hover,
.history-card:hover,
.continue-item:hover,
.catalog-card:hover {
  border-color: transparent !important;
  background: rgba(255,255,255,.085) !important;
  transform: translateY(-4px);
  filter: saturate(1.05);
}

.poster-card img,
.mini-card img,
.favorite-card__cover img,
.history-card__poster img,
.continue-item__cover img {
  border-radius: 22px;
}

.poster-card h3,
.mini-card h3,
.favorite-card h3,
.history-card h3,
.continue-item h3 {
  color: #fff;
  font-weight: 1000;
  line-height: 1.05;
}

.poster-card small,
.mini-card small,
.favorite-card small,
.history-card small,
.continue-item small {
  color: #a8a8ad;
  font-weight: 800;
}

body.is-detail {
  --orange: #ffc08a;
  --orange-2: #ffd7ad;
  --watch-orange: #ffc08a;
  background:
    linear-gradient(90deg, rgba(10,10,12,.62), rgba(10,10,12,.95) 22% 78%, rgba(10,10,12,.62)),
    linear-gradient(180deg, rgba(255,192,138,.055), transparent 260px),
    var(--anime-bg) center top / cover fixed no-repeat,
    #0a0a0c;
}

html:not([data-theme="light"]) body.is-detail::after {
  opacity: .78;
  filter: saturate(1.03) contrast(1.02) brightness(.86);
}

.watch-layout {
  gap: 22px;
}

.anime-hero,
.episodes-section,
.sidebar-episodes,
.player-card,
.notifications-popover,
.search-modal__panel {
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 26px !important;
  background: rgba(15,15,18,.72) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

.player-card {
  overflow: hidden;
}

.anime-poster {
  border: 0 !important;
  border-radius: 24px !important;
  box-shadow: 0 18px 54px rgba(0,0,0,.42) !important;
}

.title-line h1,
.profile-summary h2,
.auth-panel h2 {
  color: #fff;
  font-size: clamp(30px, 3.2vw, 48px);
  font-weight: 1000;
  line-height: 1.02;
}

.description,
.watch-description-copy,
.meta-list,
.subtitle {
  color: #b7b7bd !important;
  font-weight: 700;
}

.tabs,
.player-head,
.sidebar-episodes__head {
  border-color: rgba(255,255,255,.07) !important;
}

.tabs button {
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  color: #aaaab0;
  font-weight: 1000;
}

.tabs button.is-active {
  background: rgba(255,192,138,.18);
  color: #fff;
}

.episode-card {
  border: 0 !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.055) !important;
}

.episode-card:hover,
.episode-card.is-active {
  background: rgba(255,192,138,.16) !important;
  border-color: transparent !important;
  transform: translateY(-1px);
}

.player-actions select,
.player-actions button,
.player-actions label,
.season-switcher,
.load-more-episodes {
  border-radius: 14px !important;
  font-weight: 1000 !important;
}

.comment-card,
.comment-form,
.my-comment-card {
  border-color: rgba(255,255,255,.07) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.045) !important;
}

html[data-theme="light"] body {
  background: #f8f7fb;
}

html[data-theme="light"] .site-shell,
html[data-theme="light"] body.is-home .site-shell,
html[data-theme="light"] body.is-detail .site-shell {
  background: rgba(248,247,251,.96);
}

html[data-theme="light"] .topbar {
  background: rgba(255,255,255,.86);
}

html[data-theme="light"] .logo-anime {
  color: #17171a;
}

html[data-theme="light"] .top-search,
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .notification-button {
  background: rgba(20,20,24,.07);
}

html[data-theme="light"] .watch-progress,
html[data-theme="light"] .anime-hero,
html[data-theme="light"] .episodes-section,
html[data-theme="light"] .sidebar-episodes,
html[data-theme="light"] .player-card {
  background-color: rgba(255,255,255,.82) !important;
}

@media (max-width: 980px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    grid-template-columns: 160px minmax(180px, 1fr) auto;
  }

  .watch-progress {
    grid-template-columns: 1fr;
    min-height: 520px;
  }

  .watch-progress h3 {
    font-size: clamp(38px, 12vw, 64px);
  }
}

/* Specificity lock for the refreshed watch page. */
body.is-detail .anime-hero,
body.is-detail .episodes-section,
body.is-detail .sidebar-episodes,
body.is-detail .player-card {
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 26px !important;
  background: rgba(15,15,18,.72) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

html[data-theme="light"] body.is-detail .anime-hero,
html[data-theme="light"] body.is-detail .episodes-section,
html[data-theme="light"] body.is-detail .sidebar-episodes,
html[data-theme="light"] body.is-detail .player-card {
  background: rgba(255,255,255,.82) !important;
}

/* Restore AnimeHub wordmark after the Anivox-like pass. */
.logo {
  min-height: auto !important;
  padding-left: 22px !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: -1.1px !important;
}

.logo::before {
  content: none !important;
  display: none !important;
}

.logo-anime {
  color: #fff !important;
}

.logo-hub,
body.is-detail .logo-hub,
.logo:hover .logo-hub,
.logo:focus-visible .logo-hub {
  margin-left: 2px !important;
  padding: 1px 4px 2px !important;
  border-radius: 3px !important;
  background: var(--orange) !important;
  color: #0a0a0a !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="light"] .logo-anime {
  color: #17171a !important;
}

.logo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding-left: 0 !important;
}

.logo-mark {
  display: block;
  width: 38px;
  height: 38px;
  object-fit: contain;
  flex: 0 0 auto;
}

.logo-anime {
  margin-left: 0 !important;
}

/* Home should use the full viewport width without losing the left navigation. */
body.is-home .site-shell {
  grid-template-columns: 214px minmax(0, 1fr) !important;
}

body.is-home .sidebar {
  display: flex !important;
}

body.is-home .home-page {
  grid-column: 2 !important;
  width: 100% !important;
  padding-inline: 0 24px !important;
}

body.is-home .poster-section,
body.is-home .catalog-section,
body.is-home .library-section,
body.is-home .settings-section {
  width: min(1520px, calc(100% - 48px));
  margin-inline: auto;
}

body.is-home .continue-card {
  margin-inline: 0 !important;
}

/* Real AnimeHub quality controls: source HLS quality + upscale target. */
body.is-detail .anime4k-controls {
  grid-template-columns: 54px 58px minmax(80px, 1fr) 62px 30px 88px 58px 54px 76px 58px 42px !important;
  gap: 6px !important;
}

body.is-detail #videoPlay { order: 1 !important; }
body.is-detail #videoCurrentTime { order: 2 !important; }
body.is-detail .video-seek-wrap { order: 3 !important; }
body.is-detail #videoDuration { order: 4 !important; }
body.is-detail #videoMute { order: 5 !important; }
body.is-detail #videoVolume { order: 6 !important; }
body.is-detail #hlsQualitySelect { order: 7 !important; }
body.is-detail .anime4k-controls > .anime4k-performance { order: 8 !important; }
body.is-detail #upscaleQualitySelect { order: 9 !important; }
body.is-detail .anime4k-controls > .anime4k-toggle { order: 10 !important; }
body.is-detail #videoFullscreen { order: 11 !important; }

body.is-detail #hlsQualitySelect,
body.is-detail #upscaleQualitySelect {
  min-width: 0 !important;
  height: 34px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 4px !important;
  background: rgba(0,0,0,.22) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  outline: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  pointer-events: auto !important;
  color-scheme: dark;
}

body.is-detail #hlsQualitySelect {
  width: 58px !important;
}

body.is-detail #upscaleQualitySelect {
  width: 76px !important;
}

body.is-detail #hlsQualitySelect:hover,
body.is-detail #hlsQualitySelect:focus,
body.is-detail #upscaleQualitySelect:hover,
body.is-detail #upscaleQualitySelect:focus {
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.22) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail #hlsQualitySelect option,
body.is-detail #upscaleQualitySelect option {
  background: #090a0c !important;
  color: #fff !important;
}

body.is-detail #videoVolume {
  width: 88px !important;
  margin-right: 2px !important;
}

body.is-detail .anime4k-controls > .anime4k-performance {
  width: 54px !important;
  min-width: 54px !important;
}

@media (max-width: 980px) {
  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 48px minmax(48px, 1fr) 52px 28px 54px 52px 46px 64px 54px 36px !important;
    gap: 4px !important;
  }

  body.is-detail #videoVolume {
    width: 54px !important;
  }

  body.is-detail #hlsQualitySelect {
    width: 52px !important;
  }

  body.is-detail #upscaleQualitySelect {
    width: 64px !important;
  }
}

/* Unified quality picker: source HLS quality and upscale live in the old 720p slot. */
body.is-detail .anime4k-controls {
  grid-template-columns: 54px 58px minmax(110px, 1fr) 62px 30px 104px 70px 42px !important;
  gap: 7px !important;
}

body.is-detail #videoPlay { order: 1 !important; }
body.is-detail #videoCurrentTime { order: 2 !important; }
body.is-detail .video-seek-wrap { order: 3 !important; }
body.is-detail #videoDuration { order: 4 !important; }
body.is-detail #videoMute { order: 5 !important; }
body.is-detail #videoVolume { order: 6 !important; }
body.is-detail #hlsQualitySelect { order: 7 !important; }
body.is-detail #videoFullscreen { order: 8 !important; }

body.is-detail #hlsQualitySelect.unified-quality-select {
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
  appearance: auto !important;
  text-align: center;
}

body.is-detail #upscaleQualitySelect,
body.is-detail .anime4k-controls > .anime4k-toggle {
  display: none !important;
}

@media (max-width: 760px) {
  body.is-detail .anime4k-controls {
    grid-template-columns: 46px 48px minmax(58px, 1fr) 52px 28px 64px 64px 36px !important;
    gap: 4px !important;
  }

  body.is-detail #hlsQualitySelect.unified-quality-select {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
  }
}

/* Home hero stays full-width while the left navigation floats transparently above it. */
body.is-home .home-page {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  padding-inline: 0 !important;
  overflow: visible !important;
}

body.is-home #continueCard,
body.is-home .continue-card {
  width: 100% !important;
  margin: 0 !important;
}

body.is-home .hero-carousel.watch-progress {
  border-radius: 0 !important;
}

body.is-home .hero-carousel__copy {
  margin-left: clamp(238px, 20vw, 330px) !important;
}

body.is-home .sidebar {
  z-index: 8 !important;
  border-right: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-home .sidebar::before,
body.is-home .sidebar::after {
  display: none !important;
}

body.is-home .sidebar .nav a,
body.is-home .sidebar .nav button {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-home .sidebar .nav a:hover,
body.is-home .sidebar .nav button:hover,
body.is-home .sidebar .nav a.is-active,
body.is-home .sidebar .nav a[data-nav="home"] {
  background: rgba(6,10,14,.34) !important;
  color: #fff !important;
  box-shadow: none !important;
  backdrop-filter: blur(5px) !important;
}

@media (max-width: 980px) {
  body.is-home .home-page {
    grid-column: auto !important;
    padding-inline: 12px !important;
  }

  body.is-home #continueCard,
  body.is-home .continue-card {
    width: calc(100% + 24px) !important;
    margin-left: -12px !important;
  }

  body.is-home .hero-carousel__copy {
    margin-left: 0 !important;
  }
}

/* Keep video playback cheap: no glass blur or filters on the moving player layer. */
body.is-detail .player-card,
body.is-detail .anime4k-stage {
  backdrop-filter: none !important;
}

body.is-detail .anime4k-stage {
  contain: paint !important;
  transform: translateZ(0);
}

body.is-detail .anime4k-stage video,
body.is-detail .anime4k-stage canvas {
  filter: none !important;
  backface-visibility: hidden;
}

/* Variant 3 fallback: cheap native-video enhancer when WebGPU Anime4K-lite is unavailable. */
body.is-detail .anime4k-stage.is-native.is-css-enhance video {
  filter: contrast(1.1) saturate(1.16) brightness(1.02) !important;
}

body.is-detail .anime4k-stage.is-native.is-css-enhance[data-upscale="1440"] video {
  filter: contrast(1.16) saturate(1.22) brightness(1.025) !important;
}

body.is-detail .anime4k-stage.is-native.is-css-enhance[data-upscale="2160"] video {
  filter: contrast(1.22) saturate(1.28) brightness(1.03) !important;
}

/* Logo spacing and softer graphite surfaces. */
:root {
  --bg: #101317;
  --panel: #15191f;
  --panel-2: #1a2027;
  --panel-3: #202832;
}

body {
  background:
    linear-gradient(180deg, rgba(255,192,138,.028), transparent 260px),
    #111418 !important;
}

.site-shell,
body.is-home .site-shell,
body.is-detail .site-shell {
  background: rgba(19,23,29,.96) !important;
}

.topbar,
html:not([data-theme="light"]) body.is-detail .topbar {
  background: rgba(22,26,32,.9) !important;
  border-bottom-color: rgba(255,255,255,.09) !important;
}

.logo {
  padding-left: 18px !important;
}

body.is-home .sidebar {
  background: rgba(17,20,25,.18) !important;
}

.top-search,
.theme-toggle,
.notification-button {
  background: rgba(255,255,255,.09) !important;
}

.anime-hero,
.episodes-section,
.sidebar-episodes,
.player-card,
.notifications-popover,
.search-modal__panel,
body.is-detail .anime-hero,
body.is-detail .episodes-section,
body.is-detail .sidebar-episodes,
body.is-detail .player-card {
  background: rgba(24,29,36,.78) !important;
}

.poster-card,
.mini-card,
.favorite-card,
.history-card,
.continue-item,
.catalog-card,
.comment-card,
.comment-form,
.my-comment-card {
  background: rgba(255,255,255,.07) !important;
}

html[data-theme="light"] body {
  background: #f0f2f5 !important;
}

html[data-theme="light"] .site-shell,
html[data-theme="light"] body.is-home .site-shell,
html[data-theme="light"] body.is-detail .site-shell {
  background: rgba(242,244,247,.96) !important;
}

html[data-theme="light"] .topbar {
  background: rgba(235,238,242,.92) !important;
}

/* Tighter wordmark and search placement. */
.topbar,
html:not([data-theme="light"]) body.is-detail .topbar {
  grid-template-columns: 206px minmax(280px, 560px) 1fr !important;
}

.logo {
  gap: 5px !important;
}

.logo-hub,
body.is-detail .logo-hub,
.logo:hover .logo-hub,
.logo:focus-visible .logo-hub {
  margin-left: -1px !important;
}

.top-search {
  margin-left: 14px !important;
}

@media (max-width: 980px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    grid-template-columns: 176px minmax(180px, 1fr) auto !important;
  }
}

/* Transparent home sidebar with peach navigation states. */
body.is-home .sidebar {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-home .sidebar .nav a,
body.is-home .sidebar .nav button {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-home .sidebar .nav a:hover,
body.is-home .sidebar .nav button:hover,
body.is-home .sidebar .nav a.is-active,
body.is-home .sidebar .nav a[data-nav="home"] {
  background: rgba(255,192,138,.16) !important;
  color: #fff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-home .sidebar .nav a:hover span,
body.is-home .sidebar .nav button:hover span,
body.is-home .sidebar .nav a.is-active span,
body.is-home .sidebar .nav a[data-nav="home"] span {
  color: #fff !important;
}

/* Neutral action buttons with a soft peach hover accent. */
.watch-button,
.accent-button,
.round-play,
.link-button,
.danger-link,
.ghost-button,
.google-button,
.google-login-button,
.google-username-submit,
.auth-actions button,
.auth-form button,
.confirm-modal__cancel,
.confirm-modal__approve,
.load-more-episodes,
.poster-actions .bookmark-button,
.poster-actions .watch-button,
#accountAction,
#settingsLogin,
#settingsLogout {
  min-height: 48px !important;
  padding: 0 24px !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  font-weight: 1000 !important;
  text-decoration: none !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translateZ(0) scale(1) !important;
  transition:
    transform .18s ease,
    background-color .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;
}

.watch-button:hover,
.watch-button:focus-visible,
.accent-button:hover,
.accent-button:focus-visible,
.round-play:hover,
.round-play:focus-visible,
.link-button:hover,
.link-button:focus-visible,
.danger-link:hover,
.danger-link:focus-visible,
.ghost-button:hover,
.ghost-button:focus-visible,
.google-button:hover,
.google-button:focus-visible,
.google-login-button:hover,
.google-login-button:focus-visible,
.google-username-submit:hover,
.google-username-submit:focus-visible,
.auth-actions button:hover,
.auth-actions button:focus-visible,
.auth-form button:hover,
.auth-form button:focus-visible,
.confirm-modal__cancel:hover,
.confirm-modal__cancel:focus-visible,
.confirm-modal__approve:hover,
.confirm-modal__approve:focus-visible,
.load-more-episodes:hover,
.load-more-episodes:focus-visible,
.poster-actions .bookmark-button:hover,
.poster-actions .bookmark-button:focus-visible,
.poster-actions .watch-button:hover,
.poster-actions .watch-button:focus-visible,
#accountAction:hover,
#accountAction:focus-visible,
#settingsLogin:hover,
#settingsLogin:focus-visible,
#settingsLogout:hover,
#settingsLogout:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateZ(0) translateY(-1px) !important;
  filter: none !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,164,119,.12) !important;
}

.watch-button *,
.accent-button *,
.round-play *,
.link-button *,
.danger-link *,
.ghost-button *,
.google-button *,
.google-login-button *,
.auth-actions button *,
.auth-form button *,
.load-more-episodes *,
#accountAction *,
#settingsLogin *,
#settingsLogout * {
  color: inherit !important;
}

/* Player controls stay graphite; peach appears only on hover. */
body.is-detail #videoPlay,
body.is-detail #videoMute,
body.is-detail #videoFullscreen {
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translateZ(0) scale(1) !important;
  transition:
    transform .18s ease,
    background-color .18s ease,
    color .18s ease !important;
}

body.is-detail #videoPlay:hover,
body.is-detail #videoPlay:focus-visible,
body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.12) !important;
  filter: none !important;
  transform: translateZ(0) translateY(-1px) !important;
}

body.is-detail .skip-opening,
body.is-detail .player-next-control,
body.is-detail #playerNextEpisode {
  min-height: 48px !important;
  padding: 0 24px !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  font-weight: 1000 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translateZ(0) scale(1) !important;
  transition:
    transform .18s ease,
    background-color .18s ease,
    color .18s ease !important;
}

body.is-detail .skip-opening:hover,
body.is-detail .skip-opening:focus-visible,
body.is-detail .player-next-control:hover,
body.is-detail .player-next-control:focus-visible,
body.is-detail #playerNextEpisode:hover,
body.is-detail #playerNextEpisode:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,164,119,.12) !important;
  filter: none !important;
  transform: translateZ(0) translateY(-1px) !important;
}

/* Compact video controls stay neutral; peach appears only as a hover accent. */
body.is-detail #videoMute,
body.is-detail #videoFullscreen {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border: 1px solid #303640 !important;
  border-radius: 4px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: none !important;
  filter: none !important;
}

body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateY(-1px) !important;
  filter: none !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.12) !important;
}

body.is-detail .player-next-control,
body.is-detail #playerNextEpisode,
body.is-detail .skip-opening {
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid #303640 !important;
  border-radius: 4px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  font-weight: 900 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: none !important;
  filter: none !important;
  text-shadow: none !important;
}

body.is-detail .player-next-control:hover,
body.is-detail .player-next-control:focus-visible,
body.is-detail #playerNextEpisode:hover,
body.is-detail #playerNextEpisode:focus-visible,
body.is-detail .skip-opening:hover,
body.is-detail .skip-opening:focus-visible {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateY(-1px) !important;
  filter: none !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.12) !important;
}

body.is-detail .animehub-center-play,
body.is-detail .animehub-center-play:hover,
body.is-detail .animehub-center-play:focus-visible {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 92px !important;
  height: 92px !important;
  min-width: 92px !important;
  min-height: 92px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.34), inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translate(-50%, -50%) !important;
  filter: none !important;
}

body.is-detail .animehub-center-play:hover,
body.is-detail .animehub-center-play:focus-visible {
  border-color: #424a55 !important;
  background: #20242b !important;
  color: #f5f6f8 !important;
}

body.is-detail .animehub-center-play span {
  width: 0 !important;
  height: 0 !important;
  display: block !important;
  margin: 0 0 0 3px !important;
  border-top: 19px solid transparent !important;
  border-bottom: 19px solid transparent !important;
  border-left: 28px solid currentColor !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Watch-page pills outside the video player. */
body.is-detail .tabs button,
body.is-detail [data-watch-tab="description"],
body.is-detail .episodes-section .tabs [data-watch-tab="comments"],
body.is-detail .season-pill {
  min-height: 44px !important;
  padding: 0 20px !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  font-weight: 1000 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translateZ(0) scale(1) !important;
  transition:
    transform .18s ease,
    background-color .18s ease,
    color .18s ease !important;
}

body.is-detail .tabs button:hover,
body.is-detail .tabs button:focus-visible,
body.is-detail [data-watch-tab="description"]:hover,
body.is-detail [data-watch-tab="description"]:focus-visible,
body.is-detail .episodes-section .tabs [data-watch-tab="comments"]:hover,
body.is-detail .episodes-section .tabs [data-watch-tab="comments"]:focus-visible,
body.is-detail .season-pill:hover,
body.is-detail .season-pill:focus-visible,
body.is-detail .season-pill.is-active:hover {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateZ(0) translateY(-1px) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.12) !important;
  filter: none !important;
}

body.is-detail .tabs button.is-active,
body.is-detail [data-watch-tab="description"].is-active,
body.is-detail .episodes-section .tabs [data-watch-tab="comments"].is-active,
body.is-detail .season-pill.is-active {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateZ(0) scale(1) !important;
  box-shadow: 0 0 0 1px rgba(255,164,119,.12) !important;
  filter: none !important;
}

body.is-detail .tabs button *,
body.is-detail [data-watch-tab="description"] *,
body.is-detail .episodes-section .tabs [data-watch-tab="comments"] *,
body.is-detail .season-pill * {
  color: inherit !important;
}

/* Remove shadow slabs from in-player controls; keep play/pause as the single big button. */
body.is-detail .anime4k-controls,
body.is-detail .anime4k-controls__top {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.is-detail #videoCurrentTime,
body.is-detail #videoDuration,
body.is-detail .video-seek-wrap,
body.is-detail #videoVolume,
body.is-detail #videoMute,
body.is-detail #videoFullscreen,
body.is-detail #hlsQualitySelect,
body.is-detail #upscaleQualitySelect,
body.is-detail .anime4k-controls > .anime4k-performance,
body.is-detail .anime4k-controls > .anime4k-toggle,
body.is-detail .anime4k-controls__top .anime4k-performance,
body.is-detail .anime4k-controls__top .anime4k-toggle,
body.is-detail .player-head .episode-control,
body.is-detail .player-head .source-control,
body.is-detail .player-head .player-translation,
body.is-detail .player-head .enhancement-control,
body.is-detail .player-head .quality-control,
body.is-detail .player-head .season-switcher,
body.is-detail .player-head .player-next-control,
body.is-detail #playerNextEpisode,
body.is-detail .skip-opening,
body.is-detail .player-actions select,
body.is-detail .player-actions button,
body.is-detail .player-actions label {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible,
body.is-detail #hlsQualitySelect:hover,
body.is-detail #hlsQualitySelect:focus,
body.is-detail #upscaleQualitySelect:hover,
body.is-detail #upscaleQualitySelect:focus,
body.is-detail .anime4k-controls > .anime4k-performance:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:hover,
body.is-detail .anime4k-controls > .anime4k-toggle:focus-within,
body.is-detail .player-head .episode-control:hover,
body.is-detail .player-head .source-control:hover,
body.is-detail .player-head .player-translation:hover,
body.is-detail .player-head .enhancement-control:hover,
body.is-detail .player-head .season-switcher:hover,
body.is-detail .player-head .player-next-control:hover,
body.is-detail .player-head .player-next-control:focus-visible,
body.is-detail #playerNextEpisode:hover,
body.is-detail #playerNextEpisode:focus-visible,
body.is-detail .skip-opening:hover,
body.is-detail .skip-opening:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

/* Final settings cleanup: compact profile surface, no stacked old card effects. */
.settings-section {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 10px 0 48px !important;
}

.settings-heading { margin-bottom: 18px !important; }
.settings-heading h1 {
  margin: 0 !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  line-height: 1.05 !important;
}

.settings-section .profile-summary {
  grid-template-columns: 76px minmax(0, 1fr) auto !important;
  gap: 18px !important;
  align-items: center !important;
  margin-bottom: 18px !important;
  padding: 18px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  box-shadow: none !important;
  text-align: left !important;
}

.settings-section .profile-summary.is-authenticated {
  grid-template-columns: 92px minmax(0, 1fr) auto !important;
  justify-items: stretch !important;
  text-align: left !important;
}

.settings-section .settings-avatar,
.settings-section .profile-summary.is-authenticated .settings-avatar {
  width: 76px !important;
  height: 76px !important;
  border-radius: 22px !important;
}

.settings-section .profile-summary.is-authenticated .settings-avatar {
  width: 92px !important;
  height: 92px !important;
}

.settings-section .profile-summary__identity { min-width: 0 !important; }
.settings-section .profile-summary h2 {
  overflow: hidden !important;
  margin: 0 0 6px !important;
  color: #fff !important;
  font-size: 24px !important;
  line-height: 1.05 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.settings-section .profile-summary p {
  margin: 0 !important;
  color: rgba(255,255,255,.62) !important;
  font-size: 13px !important;
}

.settings-section .profile-summary__email {
  margin-bottom: 5px !important;
  color: var(--orange) !important;
}

.settings-section .profile-stats {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 18px !important;
}

.settings-section .profile-stats article {
  min-height: 92px !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.04) !important;
  box-shadow: none !important;
}

.settings-section .profile-stats strong {
  margin: 0 !important;
  color: var(--orange) !important;
  font-size: 26px !important;
  line-height: 1 !important;
}

.settings-section .profile-stats span {
  overflow: visible !important;
  color: rgba(255,255,255,.58) !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  text-overflow: clip !important;
}

.settings-section .settings-groups {
  display: grid !important;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr) !important;
  gap: 16px !important;
}

.settings-section .settings-card,
.settings-section .settings-groups section {
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

.settings-section .settings-group-title {
  display: grid !important;
  gap: 4px !important;
  padding: 16px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  background: rgba(255,255,255,.03) !important;
}

.settings-section .settings-group-title span {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
}

.settings-section .settings-group-title small {
  color: rgba(255,255,255,.48) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.settings-section .settings-groups label,
.settings-section .settings-groups section > button {
  min-height: 58px !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.065) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.84) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  transform: none !important;
}

.settings-section .settings-groups label:hover,
.settings-section .settings-groups section > button:hover {
  background: rgba(255,192,138,.08) !important;
  color: #fff !important;
  transform: none !important;
}

.settings-section .settings-groups section > *:last-child { border-bottom: 0 !important; }
.settings-section .anime4k-gpu-setting {
  position: relative !important;
  align-items: center !important;
  gap: 14px !important;
}

.settings-section .anime4k-gpu-setting::after {
  content: "" !important;
  position: absolute !important;
  right: 18px !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 2px solid rgba(255,255,255,.7) !important;
  border-bottom: 2px solid rgba(255,255,255,.7) !important;
  transform: rotate(45deg) translateY(-2px) !important;
  pointer-events: none !important;
}

.settings-section .anime4k-gpu-setting select {
  width: min(390px, 54vw) !important;
  max-width: 100% !important;
  min-height: 46px !important;
  padding: 0 42px 0 16px !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 12px !important;
  appearance: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
    #121821 !important;
  color: #f5f6f8 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease !important;
}

.settings-section .anime4k-gpu-setting select:hover,
.settings-section .anime4k-gpu-setting select:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 52%, rgba(255,255,255,.14)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
    #151b24 !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--orange) 14%, transparent), inset 0 -1px 0 rgba(0,0,0,.36) !important;
  outline: 0 !important;
}

.settings-section .anime4k-gpu-setting select option,
.settings-section .anime4k-gpu-setting select optgroup {
  background: #151b24 !important;
  color: #f5f6f8 !important;
}

.settings-section .anime4k-gpu-hint {
  margin: 0 !important;
  padding: 13px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.065) !important;
  background: color-mix(in srgb, var(--orange) 8%, #171b22) !important;
  color: rgba(255,255,255,.64) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.settings-section #accountAction,
.settings-section #settingsLogin,
.settings-section #settingsLogout {
  min-height: 58px !important;
  justify-content: space-between !important;
  padding: 0 18px !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: none !important;
}

.settings-section #accountAction:hover,
.settings-section #accountAction:focus-visible,
.settings-section #settingsLogin:hover,
.settings-section #settingsLogin:focus-visible,
.settings-section #settingsLogout:hover,
.settings-section #settingsLogout:focus-visible {
  background: rgba(255,192,138,.12) !important;
  color: #fff !important;
  transform: none !important;
}

.settings-section .settings-friends-card {
  min-height: 420px !important;
}

.settings-section .settings-friends-list {
  max-height: 498px !important;
  overflow-y: auto !important;
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 14px !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,164,119,.36) transparent;
}

.settings-section .settings-friends-list::-webkit-scrollbar {
  width: 7px;
}

.settings-section .settings-friends-list::-webkit-scrollbar-track {
  background: transparent;
}

.settings-section .settings-friends-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255,164,119,.34);
}

.settings-section .settings-friend {
  min-height: 64px !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  background: #141820 !important;
}

.settings-section .settings-friend img {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  object-fit: cover !important;
  background: #0f1218 !important;
}

.settings-section .settings-friend div {
  min-width: 0 !important;
  display: grid !important;
  gap: 3px !important;
}

.settings-section .settings-friend strong,
.settings-section .settings-friend span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.settings-section .settings-friend strong {
  color: #f5f6f8 !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
}

.settings-section .settings-friend span {
  color: rgba(255,255,255,.5) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.settings-section .settings-friend button {
  min-height: 34px !important;
  padding: 0 12px !important;
  border: 1px solid #303640 !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.settings-section .settings-friend button:hover {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
}

.settings-section .settings-friends-empty {
  margin: 0 !important;
  padding: 28px 12px !important;
  color: rgba(255,255,255,.52) !important;
  text-align: center !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.settings-section .my-comments-section {
  margin-top: 18px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

@media (max-width: 900px) {
  .settings-section .profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .settings-section .settings-groups {
    grid-template-columns: 1fr !important;
  }

  .settings-section .profile-summary,
  .settings-section .profile-summary.is-authenticated {
    grid-template-columns: 72px minmax(0, 1fr) !important;
  }

  .settings-section #settingsLogin {
    grid-column: 1 / -1 !important;
  }
}

/* Keep volume as a real slim range, not a filled rectangle. */
body.is-detail #videoVolume {
  width: 116px !important;
  min-width: 88px !important;
  max-width: 132px !important;
  height: 16px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 8px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(90deg, #ffc08a 0 var(--volume-progress), rgba(255,255,255,.28) var(--volume-progress) 100%) !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-webkit-slider-thumb {
  width: 12px !important;
  height: 12px !important;
  margin-top: -2px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-moz-range-track {
  height: 8px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.28) !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-moz-range-progress {
  height: 8px !important;
  border-radius: 999px !important;
  background: #ffc08a !important;
}

body.is-detail #videoVolume::-moz-range-thumb {
  width: 12px !important;
  height: 12px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Restore stable bottom timeline/time layout and the segmented volume meter. */
body.is-detail .anime4k-controls {
  grid-template-columns: 54px 58px minmax(120px, 1fr) 62px 30px 104px 58px 66px 42px !important;
  gap: 7px !important;
}

body.is-detail #videoCurrentTime,
body.is-detail #videoDuration {
  width: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.55) !important;
}

body.is-detail #videoDuration {
  width: 62px !important;
  min-width: 62px !important;
  max-width: 62px !important;
}

body.is-detail .video-seek-wrap {
  min-width: 0 !important;
  height: 34px !important;
  display: grid !important;
  align-items: center !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume {
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.is-detail #videoVolume::-webkit-slider-runnable-track {
  height: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    repeating-linear-gradient(90deg, var(--watch-orange) 0 4px, transparent 4px 8px) 0 50% / var(--volume-progress) 16px no-repeat,
    repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 4px, transparent 4px 8px) 0 50% / 100% 16px no-repeat !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-webkit-slider-thumb {
  width: 0 !important;
  height: 16px !important;
  margin-top: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  opacity: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
}

body.is-detail #videoVolume::-moz-range-track {
  height: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.24) 0 4px, transparent 4px 8px) !important;
  box-shadow: none !important;
}

body.is-detail #videoVolume::-moz-range-progress {
  height: 16px !important;
  border-radius: 0 !important;
  background: repeating-linear-gradient(90deg, var(--watch-orange) 0 4px, transparent 4px 8px) !important;
}

body.is-detail #videoVolume::-moz-range-thumb {
  width: 0 !important;
  height: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  opacity: 0 !important;
  box-shadow: none !important;
}

/* Restore seek bar: transparent input, peach only up to the actual progress. */
body.is-detail #videoSeek {
  --seek-progress: 0%;
  width: 100% !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body.is-detail #videoSeek::-webkit-slider-runnable-track {
  height: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, var(--watch-orange) 0 var(--seek-progress), rgba(255,255,255,.28) var(--seek-progress) 100%) !important;
  box-shadow: none !important;
}

body.is-detail #videoSeek::-webkit-slider-thumb {
  width: 0 !important;
  height: 8px !important;
  margin-top: 0 !important;
  border: 0 !important;
  background: transparent !important;
  opacity: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
}

body.is-detail #videoSeek::-moz-range-track {
  height: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.28) !important;
  box-shadow: none !important;
}

body.is-detail #videoSeek::-moz-range-progress {
  height: 8px !important;
  border-radius: 0 !important;
  background: var(--watch-orange) !important;
}

body.is-detail #videoSeek::-moz-range-thumb {
  width: 0 !important;
  height: 8px !important;
  border: 0 !important;
  background: transparent !important;
  opacity: 0 !important;
  box-shadow: none !important;
}

/* Keep the player header transparent and hoverless after global peach hover rules. */
body.is-detail .player-head,
body.is-detail .player-head:hover,
body.is-detail .player-actions,
body.is-detail .player-head .season-switcher,
body.is-detail .player-head .episode-control,
body.is-detail .player-head .source-control,
body.is-detail .player-head .player-translation,
body.is-detail .player-head .enhancement-control,
body.is-detail .player-head .quality-control,
body.is-detail .player-head .player-next-control,
body.is-detail #playerNextEpisode,
body.is-detail .player-actions select,
body.is-detail .player-actions button,
body.is-detail .player-actions label,
body.is-detail .player-head .season-switcher:hover,
body.is-detail .player-head .season-switcher:focus-within,
body.is-detail .player-head .episode-control:hover,
body.is-detail .player-head .episode-control:focus-within,
body.is-detail .player-head .source-control:hover,
body.is-detail .player-head .source-control:focus-within,
body.is-detail .player-head .player-translation:hover,
body.is-detail .player-head .player-translation:focus-within,
body.is-detail .player-head .enhancement-control:hover,
body.is-detail .player-head .enhancement-control:focus-within,
body.is-detail .player-head .quality-control:hover,
body.is-detail .player-head .quality-control:focus-within,
body.is-detail .player-head .player-next-control:hover,
body.is-detail .player-head .player-next-control:focus-visible,
body.is-detail #playerNextEpisode:hover,
body.is-detail #playerNextEpisode:focus-visible,
body.is-detail .player-actions select:hover,
body.is-detail .player-actions select:focus,
body.is-detail .player-actions button:hover,
body.is-detail .player-actions button:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

/* Home cards: match the screenshot's narrower six-card poster field. */
:root {
  --orange: #f4c49a;
  --orange-2: #ffe0bd;
  --watch-orange: #f4c49a;
  --anime-primary: var(--orange);
  --anime-accent: var(--orange-2);
  --anime-glow: rgba(244, 196, 154, .2);
}

body,
body.is-home,
body.is-detail {
  --orange: #f4c49a;
  --orange-2: #ffe0bd;
  --watch-orange: #f4c49a;
  --watch-orange-soft: rgba(244,196,154,.14);
  --watch-orange-glow: rgba(244,196,154,.34);
  --anime-primary: var(--orange);
  --anime-accent: var(--orange-2);
}

body.is-home .poster-section {
  width: min(1480px, calc(100% - 420px)) !important;
}

body.is-home .poster-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

body.is-home .poster-grid:not(.poster-grid--new) .poster-card {
  border-radius: 18px !important;
}

.logo-hub,
body.is-detail .logo-hub,
.round-play,
.watch-button,
.accent-button,
.confirm-modal__approve,
.episode-thumb,
.google-username-form button,
.notification-action {
  background: var(--orange) !important;
}

.watch-party-room__bar button,
.watch-party-form button,
.watch-party-friends__list button,
#watchPartyCreate {
  border-color: #303640 !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
}

.watch-party-room__bar button:hover,
.watch-party-room__bar button:focus-visible,
.watch-party-form button:hover,
.watch-party-form button:focus-visible,
.watch-party-friends__list button:hover,
.watch-party-friends__list button:focus-visible,
#watchPartyCreate:hover,
#watchPartyCreate:focus-visible {
  border-color: rgba(255,164,119,.66) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.1) !important;
}

.history-card {
  grid-template-columns: 78px minmax(0, 1fr) !important;
  padding-right: 18px !important;
}

.history-card .round-play {
  display: none !important;
}

#clearHistory {
  min-height: 40px !important;
  padding: 0 16px !important;
  border-color: rgba(255,255,255,.1) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
    #151a22 !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: none !important;
}

#clearHistory::before {
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  display: inline-block !important;
  margin-right: 9px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.34) !important;
  box-shadow: 10px 0 0 rgba(255,255,255,.24) !important;
  vertical-align: 1px !important;
}

#clearHistory:hover,
#clearHistory:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 48%, rgba(255,255,255,.14)) !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--orange) 14%, rgba(255,255,255,.055)), rgba(255,255,255,.03)),
    #1b2028 !important;
  color: var(--orange-2) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.2), 0 0 0 3px color-mix(in srgb, var(--orange) 10%, transparent), inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transform: translateY(-1px) !important;
}

#clearHistory:hover::before,
#clearHistory:focus-visible::before {
  background: var(--orange) !important;
  box-shadow: 10px 0 0 color-mix(in srgb, var(--orange) 55%, transparent) !important;
}

.poster-card:hover,
.mini-card:hover,
.continue-item:hover,
.favorite-card:hover,
.history-card:hover,
.catalog-card:hover {
  border-color: color-mix(in srgb, var(--orange) 52%, var(--line)) !important;
}

.card-favorite:hover,
.card-favorite.is-active,
.tabs button.is-active,
.season-pill.is-active,
.episode-card.is-active,
.comment-reactions button.is-active {
  border-color: var(--orange) !important;
  color: var(--orange) !important;
}

.card-favorite:hover,
.card-favorite.is-active {
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.24), 0 0 0 1px rgba(255,164,119,.12) !important;
}

@media (max-width: 1320px) {
  body.is-home .poster-section {
    width: min(100%, calc(100% - 56px)) !important;
  }

  body.is-home .poster-grid {
    gap: 16px !important;
  }
}

@media (max-width: 980px) {
  body.is-home .poster-section {
    width: 100% !important;
  }
}

/* Absolute final home overrides. */
body.is-home .hero-carousel.watch-progress {
  height: clamp(560px, 54vw, 720px) !important;
  min-height: clamp(560px, 54vw, 720px) !important;
  display: flex !important;
  align-items: center !important;
  padding-top: clamp(86px, 8vw, 128px) !important;
  padding-bottom: clamp(86px, 8vw, 128px) !important;
}

body.is-home .poster-section .section-head {
  justify-content: flex-start !important;
}

body.is-home .poster-section .link-button {
  display: none !important;
}

body.is-home .poster-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 22px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 2px 0 14px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255,164,119,.42) transparent !important;
}

body.is-home .poster-grid .poster-card {
  flex: 0 0 calc((100% - 110px) / 6) !important;
  min-width: 0 !important;
  scroll-snap-align: start !important;
}

body.is-home .poster-grid::-webkit-scrollbar {
  height: 8px !important;
}

body.is-home .poster-grid::-webkit-scrollbar-track {
  background: rgba(255,255,255,.04) !important;
  border-radius: 999px !important;
}

body.is-home .poster-grid::-webkit-scrollbar-thumb {
  background: rgba(255,164,119,.38) !important;
  border-radius: 999px !important;
}

body.is-home .poster-card__play {
  display: none !important;
}

@media (max-width: 1320px) {
  body.is-home .poster-grid {
    gap: 16px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: calc((100% - 80px) / 6) !important;
  }
}

@media (max-width: 980px) {
  body.is-home .hero-carousel.watch-progress {
    height: 520px !important;
    min-height: 520px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: min(210px, 42vw) !important;
  }
}

/* Must stay last: fixes the home banner and horizontal strips after legacy overrides. */
body.is-home .hero-carousel.watch-progress {
  height: clamp(560px, 54vw, 720px) !important;
  min-height: clamp(560px, 54vw, 720px) !important;
  display: flex !important;
  align-items: center !important;
  padding-top: clamp(86px, 8vw, 128px) !important;
  padding-bottom: clamp(86px, 8vw, 128px) !important;
}

body.is-home .poster-section .section-head {
  justify-content: flex-start !important;
}

body.is-home .poster-section .link-button {
  display: none !important;
}

body.is-home .poster-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 22px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 2px 0 14px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255,164,119,.42) transparent !important;
}

body.is-home .poster-grid .poster-card {
  flex: 0 0 calc((100% - 110px) / 6) !important;
  min-width: 0 !important;
  scroll-snap-align: start !important;
}

body.is-home .poster-grid::-webkit-scrollbar {
  height: 8px !important;
}

body.is-home .poster-grid::-webkit-scrollbar-track {
  background: rgba(255,255,255,.04) !important;
  border-radius: 999px !important;
}

body.is-home .poster-grid::-webkit-scrollbar-thumb {
  background: rgba(255,164,119,.38) !important;
  border-radius: 999px !important;
}

body.is-home .poster-card__play {
  display: none !important;
}

@media (max-width: 1320px) {
  body.is-home .poster-grid {
    gap: 16px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: calc((100% - 80px) / 6) !important;
  }
}

@media (max-width: 980px) {
  body.is-home .hero-carousel.watch-progress {
    height: 520px !important;
    min-height: 520px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: min(210px, 42vw) !important;
  }
}

/* Final home overrides: no section buttons, tall banner, reliable horizontal strips. */
body.is-home .hero-carousel.watch-progress {
  height: clamp(560px, 54vw, 720px) !important;
  min-height: clamp(560px, 54vw, 720px) !important;
  align-items: flex-end !important;
  padding-top: clamp(86px, 8vw, 128px) !important;
  padding-bottom: clamp(86px, 8vw, 128px) !important;
}

body.is-home .poster-section .section-head {
  justify-content: flex-start !important;
}

body.is-home .poster-section .link-button {
  display: none !important;
}

body.is-home .poster-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 22px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  padding: 2px 0 14px !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,164,119,.42) transparent;
}

body.is-home .poster-grid .poster-card {
  flex: 0 0 calc((100% - 110px) / 6) !important;
  min-width: 0 !important;
  scroll-snap-align: start;
}

body.is-home .poster-grid::-webkit-scrollbar {
  height: 8px;
}

body.is-home .poster-grid::-webkit-scrollbar-track {
  background: rgba(255,255,255,.04);
  border-radius: 999px;
}

body.is-home .poster-grid::-webkit-scrollbar-thumb {
  background: rgba(255,164,119,.38);
  border-radius: 999px;
}

@media (max-width: 1320px) {
  body.is-home .poster-grid {
    gap: 16px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: calc((100% - 80px) / 6) !important;
  }
}

@media (max-width: 980px) {
  body.is-home .hero-carousel.watch-progress {
    height: 520px !important;
    min-height: 520px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: min(210px, 42vw) !important;
  }
}

/* Requested follow-up: taller hero, horizontal rows, quieter card hover. */
body.is-home .hero-carousel.watch-progress {
  min-height: clamp(390px, 46vw, 560px) !important;
  align-items: flex-end !important;
  padding-block: clamp(62px, 7vw, 96px) !important;
}

body.is-home .poster-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 22px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 2px;
  padding: 2px 2px 12px !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,164,119,.42) transparent;
}

body.is-home .poster-grid::-webkit-scrollbar {
  height: 7px;
}

body.is-home .poster-grid::-webkit-scrollbar-track {
  background: transparent;
}

body.is-home .poster-grid::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255,164,119,.34);
}

body.is-home .poster-grid .poster-card {
  flex: 0 0 calc((100% - 110px) / 6) !important;
  scroll-snap-align: start;
}

body.is-home #popularGrid {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

.poster-card__play {
  display: none !important;
}

.link-button,
.danger-link {
  min-height: 36px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.045) !important;
  color: rgba(255,255,255,.76) !important;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease !important;
}

.link-button:hover,
.link-button:focus-visible,
.danger-link:hover,
.danger-link:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 42%, rgba(255,255,255,.14)) !important;
  background: color-mix(in srgb, var(--orange) 12%, rgba(255,255,255,.045)) !important;
  color: var(--orange-2) !important;
  transform: translateX(2px) !important;
}

@media (max-width: 1320px) {
  body.is-home .poster-grid {
    gap: 16px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: calc((100% - 80px) / 6) !important;
  }
}

@media (max-width: 980px) {
  body.is-home .poster-grid {
    gap: 16px !important;
  }

  body.is-home .poster-grid .poster-card {
    flex-basis: min(210px, 42vw) !important;
  }
}
/* Polished home composition: compact header, grouped hero copy, lighter cards. */
body,
body.is-home,
body.is-detail {
  --bg: #10141A;
  --panel: #171B22;
  --panel-2: #20252D;
  --panel-3: #20252D;
  --line: rgba(255,255,255,.08);
  --line-soft: rgba(255,255,255,.06);
  --muted: #9CA3AF;
  --orange: #FFA477;
  --orange-2: #FFD0AC;
  --watch-orange: #FFA477;
  --watch-orange-soft: rgba(255,164,119,.14);
  --watch-orange-glow: rgba(255,164,119,.34);
  --anime-primary: var(--orange);
  --anime-accent: var(--orange-2);
}

body,
.site-shell,
body.is-home .site-shell,
body.is-detail .site-shell {
  background: #10141A !important;
}

.topbar,
html:not([data-theme="light"]) body.is-detail .topbar {
  min-height: 72px !important;
  height: 72px !important;
  grid-template-columns: 184px minmax(320px, 500px) 1fr !important;
  gap: 18px !important;
  padding: 0 28px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(23,27,34,.94) !important;
}

.logo {
  padding-left: 0 !important;
}

.top-search {
  width: min(500px, 100%) !important;
  height: 48px !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  margin-left: 0 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)),
    #171b22 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

.top-search:hover,
.top-search:focus-within,
html:not([data-theme="light"]) .top-search:focus-within {
  border-color: color-mix(in srgb, var(--orange) 50%, rgba(255,255,255,.14)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.078), rgba(255,255,255,.035)),
    #1b2028 !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 0 0 3px color-mix(in srgb, var(--orange) 12%, transparent), inset 0 -1px 0 rgba(0,0,0,.36) !important;
}

.top-search input {
  height: 100% !important;
  padding: 0 18px 0 0 !important;
  color: #f4f5f7 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

.top-search input::placeholder {
  color: rgba(255,255,255,.45) !important;
}

.top-search button {
  width: 52px !important;
  height: 48px !important;
  color: rgba(255,255,255,.82) !important;
  transition: color .16s ease, transform .16s ease !important;
}

.top-search:hover button,
.top-search:focus-within button {
  color: var(--orange-2) !important;
  transform: scale(1.03) !important;
}

.top-actions {
  gap: 10px !important;
}

.theme-toggle,
.notification-button,
.profile-button .profile-avatar {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
}

.profile-button {
  min-height: 42px !important;
}

body.is-home #continueCard,
body.is-home .continue-card {
  margin-bottom: 54px !important;
}

body.is-home .hero-carousel.watch-progress {
  min-height: clamp(330px, 32vw, 450px) !important;
  display: flex !important;
  align-items: center !important;
  padding: 54px clamp(54px, 7vw, 118px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, rgba(16,20,26,.96) 0%, rgba(16,20,26,.84) 34%, rgba(16,20,26,.2) 68%, rgba(16,20,26,.58) 100%),
    var(--hero-bg, none) center / cover no-repeat,
    #10141A !important;
  box-shadow: none !important;
}

body.is-home .hero-carousel__copy {
  width: min(600px, 50vw) !important;
  max-width: 600px !important;
  margin-left: clamp(230px, 18vw, 300px) !important;
  align-self: center !important;
}

body.is-home .hero-carousel.watch-progress h3 {
  margin: 0 0 12px !important;
  font-size: clamp(40px, 4.5vw, 64px) !important;
  line-height: .96 !important;
}

body.is-home .hero-carousel__facts {
  margin-bottom: 12px !important;
  color: #d8dbe0 !important;
  font-size: 13px !important;
}

body.is-home .hero-carousel__score,
body.is-home .hero-carousel__genre {
  color: var(--orange-2) !important;
}

body.is-home .hero-carousel__genre {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.is-home .hero-carousel .hero-carousel__description {
  max-width: 560px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  color: #c7ccd4 !important;
  font-size: 14px !important;
}

.hero-carousel__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
}

.hero-carousel .round-play,
.hero-favorite {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.hero-carousel .round-play {
  border: 1px solid color-mix(in srgb, var(--orange) 78%, #fff) !important;
  background: var(--orange) !important;
  color: #171B22 !important;
}

.hero-favorite {
  border: 1px solid #303640 !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
}

.hero-favorite:hover,
.hero-favorite.is-active {
  border-color: rgba(255,164,119,.72) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,164,119,.12) !important;
}

body.is-home .poster-section {
  width: min(1480px, calc(100% - 420px)) !important;
  margin-top: 0 !important;
  margin-bottom: 58px !important;
}

body.is-home .poster-section + .poster-section {
  margin-top: 58px !important;
}

.section-head {
  margin-bottom: 22px !important;
}

.section-head h2 {
  font-size: clamp(30px, 3vw, 48px) !important;
  line-height: 1 !important;
}

.link-button,
.danger-link {
  min-height: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--orange-2) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

.link-button:hover,
.link-button:focus-visible {
  color: #fff !important;
  transform: none !important;
}

body.is-home .poster-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

body.is-home #popularGrid {
  overflow: visible !important;
}

.poster-grid:not(.poster-grid--new) .poster-card,
.catalog-grid .poster-card,
.results .poster-card {
  border-color: rgba(255,255,255,.08) !important;
  background: #171B22 !important;
}

.poster-grid:not(.poster-grid--new) .poster-card::after,
.catalog-grid .poster-card::after,
.results .poster-card::after {
  background: linear-gradient(180deg, rgba(3,5,8,0) 38%, rgba(3,5,8,.16) 62%, rgba(3,5,8,.82) 100%) !important;
}

.poster-grid:not(.poster-grid--new) .poster-card:hover::after,
.catalog-grid .poster-card:hover::after,
.results .poster-card:hover::after {
  background: linear-gradient(180deg, rgba(3,5,8,0) 35%, rgba(3,5,8,.18) 60%, rgba(3,5,8,.9) 100%) !important;
}

.poster-grid:not(.poster-grid--new) .poster-card:hover > img,
.catalog-grid .poster-card:hover > img,
.results .poster-card:hover > img {
  transform: scale(1.03) !important;
  filter: saturate(1.05) brightness(1.03) !important;
}

.poster-card:hover,
.mini-card:hover {
  transform: translateY(-2px) !important;
  border-color: var(--orange) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.34), 0 0 0 1px rgba(255,164,119,.2) !important;
}

.poster-grid:not(.poster-grid--new) .poster-card > strong,
.catalog-grid .poster-card > strong,
.results .poster-card > strong {
  bottom: 36px !important;
  font-size: 14px !important;
  line-height: 1.18 !important;
}

.poster-grid:not(.poster-grid--new) .poster-card > small,
.catalog-grid .poster-card > small,
.results .poster-card > small {
  bottom: 14px !important;
  color: color-mix(in srgb, var(--orange-2) 78%, #9CA3AF) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.poster-card__overlay {
  justify-content: flex-end !important;
  padding: 16px 12px 12px !important;
  background: linear-gradient(180deg, rgba(5,5,5,0), rgba(5,5,5,.2) 42%, rgba(5,5,5,.88) 100%) !important;
}

.poster-card__play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,164,119,.94);
  color: #171B22;
  font-size: 17px;
  font-weight: 900;
  transform: translate(-50%, -50%) scale(.92);
  box-shadow: 0 14px 34px rgba(0,0,0,.36);
}

.poster-card__overlay p {
  margin-bottom: 12px !important;
  color: rgba(255,255,255,.78) !important;
  font-size: 10px !important;
  -webkit-line-clamp: 4 !important;
}

.card-favorite {
  border-color: #303640 !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.36) !important;
}

@media (max-width: 1320px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    grid-template-columns: 184px minmax(280px, 460px) 1fr !important;
  }

  body.is-home .poster-section {
    width: min(100%, calc(100% - 56px)) !important;
  }
}

@media (max-width: 980px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 14px !important;
  }

  body.is-home .hero-carousel__copy {
    width: min(560px, 100%) !important;
    margin-left: 0 !important;
  }

  body.is-home .poster-section {
    width: 100% !important;
  }
}

/* Final interaction cleanup: solid peach hover, no neon/glass effects. */
button,
.watch-button,
.accent-button,
.round-play,
.bookmark-button,
.share-button,
.link-button,
.danger-link,
.ghost-button,
.notification-button,
.theme-toggle,
.profile-button,
.card-favorite,
.comment-reactions button,
.comment-user-actions button,
.watch-party-room__bar button,
.watch-party-form button,
.watch-party-friends__list button,
#watchPartyCreate,
#clearHistory {
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease !important;
}

.watch-button:hover,
.watch-button:focus-visible,
.accent-button:hover,
.accent-button:focus-visible,
.round-play:hover,
.round-play:focus-visible,
.watch-party-form button:hover,
.watch-party-form button:focus-visible,
#watchPartyCreate:hover,
#watchPartyCreate:focus-visible {
  border-color: var(--orange) !important;
  background: var(--orange) !important;
  color: #15171b !important;
  box-shadow: none !important;
  filter: none !important;
}

@media (max-width: 430px) {
  body.is-detail .title-line { order: 1 !important; }
  body.is-detail .subtitle { order: 2 !important; }
  body.is-detail .chips { order: 3 !important; }
  body.is-detail .meta-list { order: 4 !important; }
  body.is-detail .poster-actions { order: 5 !important; }
  body.is-detail .anime-info .description,
  body.is-detail .description { order: 6 !important; }
  body.is-detail .anime-info > small { order: 7 !important; }

  body.is-detail .watch-button {
    order: 1 !important;
    border-color: transparent !important;
    background: #ffa477 !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button {
    order: 2 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #f3f4f6 !important;
  }

  body.is-detail .share-button {
    order: 3 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #aeb4be !important;
  }

  body.is-detail .watch-button:hover,
  body.is-detail .watch-button:focus-visible {
    background: #ffd0ac !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button:hover,
  body.is-detail .bookmark-button:focus-visible,
  body.is-detail .share-button:hover,
  body.is-detail .share-button:focus-visible {
    border-color: rgba(255,164,119,.55) !important;
    background: #171b22 !important;
    color: #ffd0ac !important;
  }
}

/* Mobile watch-page composition inspired by YummyAnime sizing, without changing AnimeHub skin. */
@media (max-width: 430px) {
  .sidebar > .nav:not(.nav--footer) a,
  .sidebar > .nav:not(.nav--footer) button,
  body.is-home .sidebar > .nav:not(.nav--footer) a,
  body.is-home .sidebar > .nav:not(.nav--footer) button {
    background: transparent !important;
    color: #aeb4be !important;
    transform: none !important;
    transition: color .16s ease, background-color .16s ease !important;
  }

  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) button:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a[data-nav="home"] {
    background: rgba(255,255,255,.045) !important;
    color: #ffd0ac !important;
    transform: none !important;
    box-shadow: none !important;
  }

  .history-card {
    grid-template-columns: 70px minmax(0, 1fr) !important;
    min-height: 88px !important;
    padding: 9px 12px 9px 9px !important;
  }

  .history-card__poster,
  .history-card__body img,
  .history-card__body > img {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
  }

  .history-card__body {
    min-height: 64px !important;
    grid-template-rows: auto auto !important;
    align-content: center !important;
    gap: 8px !important;
  }

  .history-card__body strong,
  .history-card h3,
  .history-card strong {
    font-size: 13px !important;
    line-height: 1.2 !important;
    -webkit-line-clamp: 2 !important;
  }

  .history-card__meta {
    grid-column: 1 !important;
    grid-row: 2 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .history-card__meta b {
    display: none !important;
  }

  .history-card__meta small {
    display: block !important;
    width: 100% !important;
    height: 4px !important;
    margin-top: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #ffd0ac 0 var(--history-progress, 0%), rgba(255,255,255,.09) var(--history-progress, 0%)) !important;
    color: transparent !important;
  }

  body.is-detail .watch-main {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
  }

  body.is-detail .anime-hero {
    order: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    padding: 14px 18px 18px !important;
    gap: 0 !important;
    border-radius: 18px !important;
    text-align: center !important;
  }

  body.is-detail .poster-column {
    width: min(210px, 72vw) !important;
    max-width: min(210px, 72vw) !important;
    height: auto !important;
    margin: 0 auto 18px !important;
  }

  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback,
  body.is-detail .anime-poster {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 2 / 3 !important;
    height: auto !important;
    min-height: 0 !important;
    border-radius: 4px !important;
    object-fit: cover !important;
  }

  body.is-detail .anime-info {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: center !important;
  }

  body.is-detail .title-line {
    order: 1 !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.is-detail .anime-info h1,
  body.is-detail .title-line h1 {
    min-width: 0 !important;
    font-size: 26px !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    text-align: center !important;
    color: #e5e7eb !important;
    text-shadow: none !important;
    -webkit-line-clamp: 3 !important;
    overflow-wrap: normal !important;
  }

  body.is-detail .title-line strong {
    min-width: 42px !important;
    padding: 5px 7px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    line-height: 1 !important;
  }

  body.is-detail .subtitle {
    order: 2 !important;
    margin: 8px 0 18px !important;
    font-size: 19px !important;
    line-height: 1.25 !important;
    color: #ffd0ac !important;
    text-align: center !important;
  }

  body.is-detail .chips {
    order: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1px !important;
    margin: 0 0 12px !important;
    border-radius: 2px !important;
    overflow: hidden !important;
    background: rgba(255,255,255,.035) !important;
  }

  body.is-detail .chips span {
    min-height: 36px !important;
    padding: 0 10px !important;
    border-radius: 0 !important;
    background: rgba(0,0,0,.22) !important;
    color: #aeb4be !important;
    font-size: 12px !important;
    font-weight: 600 !important;
  }

  body.is-detail .meta-list {
    order: 4 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1px !important;
    margin: 0 0 16px !important;
    text-align: left !important;
  }

  body.is-detail .meta-list dt,
  body.is-detail .meta-list dd {
    min-height: 36px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    background: rgba(0,0,0,.20) !important;
    color: #aeb4be !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  body.is-detail .meta-list dt {
    color: #858b95 !important;
    padding-bottom: 0 !important;
  }

  body.is-detail .meta-list dd {
    color: #d1d5db !important;
    padding-top: 0 !important;
  }

  body.is-detail .anime-info .description,
  body.is-detail .description {
    order: 6 !important;
    margin: 4px 0 18px !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #b8bdc6 !important;
    text-align: left !important;
    -webkit-line-clamp: 9 !important;
  }

  body.is-detail .anime-info > small {
    order: 20 !important;
    margin-top: 8px !important;
    color: #858b95 !important;
    font-size: 11px !important;
    text-align: center !important;
  }

  body.is-detail .poster-actions {
    order: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 0 0 18px !important;
  }

  body.is-detail .poster-actions button,
  body.is-detail .watch-button,
  body.is-detail .bookmark-button,
  body.is-detail .share-button {
    width: 100% !important;
    min-height: 48px !important;
    height: 48px !important;
    border-radius: 3px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
  }

  body.is-detail .watch-button {
    order: 1 !important;
    border-color: transparent !important;
    background: #ffa477 !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button {
    order: 2 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #f3f4f6 !important;
  }

  body.is-detail .share-button {
    order: 3 !important;
    min-height: 40px !important;
    height: 40px !important;
    font-size: 11px !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #aeb4be !important;
  }

  body.is-detail .watch-button:hover,
  body.is-detail .watch-button:focus-visible {
    background: #ffd0ac !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button:hover,
  body.is-detail .bookmark-button:focus-visible,
  body.is-detail .share-button:hover,
  body.is-detail .share-button:focus-visible {
    border-color: rgba(255,164,119,.55) !important;
    background: #171b22 !important;
    color: #ffd0ac !important;
  }

  body.is-detail .player-card {
    order: 2 !important;
    margin-top: 0 !important;
    border-radius: 4px !important;
  }

  body.is-detail .player-card > .player-head,
  body.is-detail .player-head,
  body.is-detail .player-head:hover,
  html:not([data-theme="light"]) body.is-detail .player-card > .player-head,
  html[data-theme="light"] body.is-detail .player-card > .player-head {
    padding: 7px !important;
    background: #111318 !important;
  }

  body.is-detail .player-actions {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px !important;
    justify-content: stretch !important;
    align-items: stretch !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
  }

  body.is-detail .player-actions label {
    padding: 0 8px !important;
    overflow: hidden !important;
  }

  body.is-detail .player-actions label span {
    min-width: 0 !important;
    max-width: 52px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.is-detail .player-actions select {
    min-width: 0 !important;
    padding-right: 16px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.is-detail .animehub-center-play,
  body.is-detail .animehub-center-play:hover,
  body.is-detail .animehub-center-play:focus-visible {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-width: 1px !important;
  }

  body.is-detail .animehub-center-play span {
    margin-left: 3px !important;
    border-top-width: 8px !important;
    border-bottom-width: 8px !important;
    border-left-width: 13px !important;
    font-size: 0 !important;
  }

  body.is-detail .watch-party-toggle {
    top: 8px !important;
    right: 8px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 9px !important;
    border-radius: 999px !important;
    background: #171b22 !important;
    border-color: rgba(255,255,255,.16) !important;
  }

  body.is-detail .watch-party-panel {
    position: static !important;
    z-index: 150 !important;
    order: 2 !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: min(58vh, 380px) !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 0 0 4px 4px !important;
    border: 0 !important;
    border-top: 1px solid rgba(255,255,255,.1) !important;
    background: #11151b !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  body.is-detail .watch-party-panel[hidden] {
    display: none !important;
  }

  body.is-detail .player-card.is-party-open::after {
    content: none !important;
  }

  body.is-detail .player-card.is-party-open > .player-head {
    display: none !important;
  }

  body.is-detail .watch-party-panel__head {
    flex: 0 0 auto !important;
    padding: 12px 12px 10px !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
  }

  body.is-detail .watch-party-lobby,
  body.is-detail .watch-party-room {
    min-height: 0 !important;
  }

  body.is-detail .watch-party-room:not([hidden]) {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    max-height: min(58vh, 380px) !important;
  }

  body.is-detail .watch-party-messages {
    flex: 1 1 auto !important;
    min-height: 120px !important;
    padding: 10px 12px !important;
    overflow-y: auto !important;
  }

  body.is-detail .watch-party-form {
    flex: 0 0 auto !important;
    grid-template-columns: minmax(0, 1fr) 40px !important;
    gap: 8px !important;
    padding: 10px 12px 12px !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    background: #11151b !important;
  }

  body.is-detail .watch-party-form input {
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 12px !important;
  }

  body.is-detail .watch-party-form button {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 12px !important;
  }
}

@media (max-width: 430px) {
  body.is-detail .title-line { order: 1 !important; }
  body.is-detail .subtitle { order: 2 !important; }
  body.is-detail .chips { order: 3 !important; }
  body.is-detail .meta-list { order: 4 !important; }
  body.is-detail .poster-actions { order: 5 !important; }
  body.is-detail .anime-info .description,
  body.is-detail .description { order: 6 !important; }
  body.is-detail .anime-info > small { order: 7 !important; }

  body.is-detail .watch-button {
    order: 1 !important;
    border-color: transparent !important;
    background: #ffa477 !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button {
    order: 2 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #f3f4f6 !important;
  }

  body.is-detail .share-button {
    order: 3 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #aeb4be !important;
  }

  body.is-detail .watch-button:hover,
  body.is-detail .watch-button:focus-visible {
    background: #ffd0ac !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button:hover,
  body.is-detail .bookmark-button:focus-visible,
  body.is-detail .share-button:hover,
  body.is-detail .share-button:focus-visible {
    border-color: rgba(255,164,119,.55) !important;
    background: #171b22 !important;
    color: #ffd0ac !important;
  }
}

.bookmark-button:hover,
.bookmark-button:focus-visible,
.share-button:hover,
.share-button:focus-visible,
.link-button:hover,
.link-button:focus-visible,
.danger-link:hover,
.danger-link:focus-visible,
.ghost-button:hover,
.ghost-button:focus-visible,
.card-favorite:hover,
.card-favorite:focus-visible,
.comment-reactions button:hover,
.comment-reactions button:focus-visible,
.comment-user-actions button:hover,
.comment-user-actions button:focus-visible,
.watch-party-room__bar button:hover,
.watch-party-room__bar button:focus-visible,
.watch-party-friends__list button:hover,
.watch-party-friends__list button:focus-visible,
#clearHistory:hover,
#clearHistory:focus-visible {
  border-color: var(--orange) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  box-shadow: none !important;
  filter: none !important;
}

.notification-button:hover,
.notification-button:focus-visible,
.theme-toggle:hover,
.theme-toggle:focus-visible,
.profile-button:hover,
.profile-button:focus-visible,
.nav a:hover,
.nav a:focus-visible,
.nav button:hover,
.nav button:focus-visible {
  border-color: color-mix(in srgb, var(--orange) 55%, rgba(255,255,255,.14)) !important;
  background: #20242b !important;
  color: var(--orange-2) !important;
  box-shadow: none !important;
  filter: none !important;
}

body.is-home #popularGrid,
body.is-home #recommendationsGrid,
body.is-home #ongoingGrid,
body.is-home #moviesGrid {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.is-library .home-page {
  background: #10141a !important;
}

body.is-library .home-page .continue-card,
.home-page.library-mode .continue-card {
  display: none !important;
}

body.is-detail .detail-page {
  padding-top: 0 !important;
}

body.is-detail .watch-layout {
  display: grid !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  align-items: start !important;
}

body.is-detail .watch-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

body.is-detail .player-card {
  order: 2 !important;
  margin-top: 0 !important;
  border-top: 0 !important;
  border-radius: 0 0 14px 14px !important;
}

body.is-detail .anime-hero {
  order: 1 !important;
  margin-top: 0 !important;
  margin-bottom: 28px !important;
}

body.is-detail .episodes-section {
  order: 2 !important;
}

body.is-detail .anime4k-stage,
body.is-detail .player-card iframe {
  display: block !important;
  margin-top: 0 !important;
  border-top: 0 !important;
}

body.is-detail .anime4k-stage[hidden],
body.is-detail .player-card iframe[hidden] {
  display: none !important;
}

body.is-detail .anime4k-controls button,
body.is-detail #videoPlay,
body.is-detail #videoMute,
body.is-detail #videoFullscreen {
  border: 1px solid rgba(255,255,255,.12) !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: none !important;
  filter: none !important;
}

body.is-detail .anime4k-controls button:hover,
body.is-detail .anime4k-controls button:focus-visible,
body.is-detail #videoPlay:hover,
body.is-detail #videoPlay:focus-visible,
body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible {
  border-color: var(--orange) !important;
  background: var(--orange) !important;
  color: #15171b !important;
  box-shadow: none !important;
  filter: none !important;
}

body.is-detail #videoPlay {
  width: 36px !important;
  min-width: 36px !important;
  height: 34px !important;
  min-height: 34px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
  overflow: hidden !important;
}

body.is-detail #videoPlay::before {
  content: "" !important;
  width: 0 !important;
  height: 0 !important;
  display: block !important;
  margin-left: 3px !important;
  border-top: 7px solid transparent !important;
  border-bottom: 7px solid transparent !important;
  border-left: 11px solid currentColor !important;
}

body.is-detail #videoPlay.is-playing::before,
body.is-detail #videoPlay[data-playing="true"]::before {
  width: 10px !important;
  height: 14px !important;
  margin-left: 0 !important;
  border: 0 !important;
  background: linear-gradient(90deg, currentColor 0 4px, transparent 4px 6px, currentColor 6px 10px) !important;
}

body.is-detail .animehub-center-play,
body.is-detail .animehub-center-play:hover,
body.is-detail .animehub-center-play:focus-visible {
  width: 78px !important;
  height: 78px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 999px !important;
  background: #171b21 !important;
  color: #f5f6f8 !important;
  box-shadow: none !important;
  filter: none !important;
}

body.is-detail .animehub-center-play:hover,
body.is-detail .animehub-center-play:focus-visible {
  border-color: var(--orange) !important;
  background: var(--orange) !important;
  color: #15171b !important;
}

body.is-detail .animehub-center-play span {
  width: 0 !important;
  height: 0 !important;
  display: block !important;
  margin: 0 0 0 6px !important;
  border-top: 14px solid transparent !important;
  border-bottom: 14px solid transparent !important;
  border-left: 22px solid currentColor !important;
  color: inherit !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -999px !important;
  overflow: hidden !important;
}

/* Internal pages use a calmer, narrower working area; the home page stays cinematic. */
body.is-library .home-page {
  padding-inline: clamp(24px, 5vw, 96px) !important;
}

body.is-library .catalog-section,
body.is-library .library-section,
body.is-library .settings-section {
  width: min(1320px, calc(100% - clamp(148px, 8vw, 192px) - 24px)) !important;
  margin-left: clamp(148px, 8vw, 192px) !important;
  margin-right: auto !important;
}

body.is-detail .detail-page {
  padding-left: clamp(24px, 3vw, 56px) !important;
  padding-right: clamp(24px, 4.6vw, 88px) !important;
}

body.is-detail .watch-layout,
body.is-detail .anime-hero,
body.is-detail .episodes-section,
body.is-detail .comments-shell {
  width: min(1580px, 100%) !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

@media (max-width: 980px) {
  body.is-library .home-page,
  body.is-detail .detail-page {
    padding-inline: 12px !important;
  }

  body.is-library .catalog-section,
  body.is-library .library-section,
  body.is-library .settings-section,
  body.is-detail .watch-layout,
  body.is-detail .anime-hero,
  body.is-detail .episodes-section,
  body.is-detail .comments-shell {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

html[data-theme="light"] body,
html[data-theme="light"] body.is-home,
html[data-theme="light"] body.is-library,
html[data-theme="light"] body.is-detail {
  --bg: #f4f6f8 !important;
  --panel: #ffffff !important;
  --panel-2: #eef2f5 !important;
  --panel-3: #e6ebf0 !important;
  --line: rgba(17,24,39,.12) !important;
  --line-soft: rgba(17,24,39,.08) !important;
  --text: #111827 !important;
  --muted: #4b5563 !important;
  background: #f4f6f8 !important;
  color: #111827 !important;
}

html[data-theme="light"] .site-shell,
html[data-theme="light"] body.is-home .site-shell,
html[data-theme="light"] body.is-detail .site-shell {
  background: #f4f6f8 !important;
  color: #111827 !important;
}

html[data-theme="light"] .topbar {
  background: rgba(255,255,255,.96) !important;
  border-bottom-color: rgba(17,24,39,.12) !important;
}

html[data-theme="light"] .top-search,
html[data-theme="light"] .settings-card,
html[data-theme="light"] .settings-groups section,
html[data-theme="light"] .profile-summary,
html[data-theme="light"] .profile-stats article,
html[data-theme="light"] .catalog-toolbar select,
html[data-theme="light"] .history-card,
html[data-theme="light"] .favorite-card,
html[data-theme="light"] .catalog-card,
html[data-theme="light"] .comment-card,
html[data-theme="light"] .comment-form,
html[data-theme="light"] .my-comments-section,
html[data-theme="light"] .anime-hero,
html[data-theme="light"] .episodes-section,
html[data-theme="light"] .search-modal__panel {
  background: #ffffff !important;
  border-color: rgba(17,24,39,.12) !important;
  color: #111827 !important;
}

html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] strong,
html[data-theme="light"] label,
html[data-theme="light"] .page-heading,
html[data-theme="light"] .section-head,
html[data-theme="light"] .settings-group-title span,
html[data-theme="light"] .profile-summary h2,
html[data-theme="light"] .anime-info,
html[data-theme="light"] .anime-info h1,
html[data-theme="light"] .title-line h1,
html[data-theme="light"] .comment-card__content strong,
html[data-theme="light"] .my-comment-card strong,
html[data-theme="light"] .nav a.is-active span {
  color: #111827 !important;
  text-shadow: none !important;
}

html[data-theme="light"] p,
html[data-theme="light"] small,
html[data-theme="light"] span,
html[data-theme="light"] .subtitle,
html[data-theme="light"] .description,
html[data-theme="light"] .meta-list,
html[data-theme="light"] .player-status,
html[data-theme="light"] .settings-group-title small,
html[data-theme="light"] .profile-summary p,
html[data-theme="light"] .history-card__body p,
html[data-theme="light"] .history-card__body > span {
  color: #4b5563 !important;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background: #f8fafc !important;
  border-color: rgba(17,24,39,.14) !important;
  color: #111827 !important;
}

html[data-theme="light"] .top-search input,
html[data-theme="light"] .top-search button,
html[data-theme="light"] .nav a,
html[data-theme="light"] .nav button,
html[data-theme="light"] .nav a span,
html[data-theme="light"] .nav button span,
html[data-theme="light"] .icon-button,
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .notification-button,
html[data-theme="light"] .profile-button {
  color: #111827 !important;
}

html[data-theme="light"] .player-card,
html[data-theme="light"] .anime4k-stage {
  background: #000 !important;
}

html[data-theme="light"] .player-card .player-head,
html[data-theme="light"] .player-card .player-head *,
html[data-theme="light"] .anime4k-controls,
html[data-theme="light"] .anime4k-controls *,
html[data-theme="light"] .watch-party-toggle,
html[data-theme="light"] .watch-party-toggle * {
  color: #f5f6f8 !important;
}

/* Player fullscreen idle state. */
body.is-detail .anime4k-stage.is-controls-hidden {
  cursor: none !important;
}

body.is-detail .anime4k-stage:fullscreen.is-controls-hidden .anime4k-controls,
body.is-detail .anime4k-stage:fullscreen.is-controls-hidden .anime4k-controls__top,
body.is-detail .anime4k-stage:fullscreen.is-controls-hidden .watch-party-toggle,
body.is-detail .anime4k-stage:fullscreen.is-controls-hidden .watch-party-panel {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(8px) !important;
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important;
}

body.is-detail #videoMute,
body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}

body.is-detail #videoMute:hover,
body.is-detail #videoMute:focus-visible,
body.is-detail #videoFullscreen:hover,
body.is-detail #videoFullscreen:focus-visible {
  color: var(--orange-2) !important;
}

body.is-detail #videoFullscreen {
  margin-left: 8px !important;
}

/* Final mobile layout: double header, bottom navigation, no horizontal spill. */
@media (max-width: 820px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body {
    padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    background: #0b0f14 !important;
  }

  .site-shell,
  body.is-home .site-shell,
  body.is-library .site-shell,
  body.is-detail .site-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    display: block !important;
    overflow-x: clip !important;
    background: #0b0f14 !important;
  }

  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 90 !important;
    width: 100% !important;
    height: 118px !important;
    min-height: 118px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: 58px 52px !important;
    align-items: center !important;
    gap: 0 10px !important;
    padding: 8px 12px 10px !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    background: rgba(14,18,24,.96) !important;
    backdrop-filter: blur(18px) !important;
  }

  .logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    min-height: 46px !important;
    padding: 0 !important;
    font-size: 21px !important;
  }

  .logo::before {
    width: 36px !important;
    height: 36px !important;
    margin-right: 8px !important;
    border-radius: 12px !important;
  }

  .logo-mark {
    width: 36px !important;
    height: 36px !important;
  }

  .top-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  .notification-button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    border-radius: 999px !important;
  }

  .profile-button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
  }

  .profile-button span:not(#profileButtonName),
  .profile-button #profileButtonName,
  .profile-button span:last-child {
    display: none !important;
  }

  .profile-avatar {
    width: 34px !important;
    height: 34px !important;
  }

  .top-search {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    height: 48px !important;
    min-width: 0 !important;
    margin: 4px 0 0 !important;
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 16px !important;
    background: #171b22 !important;
    box-shadow: none !important;
  }

  .top-search button {
    width: 46px !important;
    height: 46px !important;
  }

  .top-search input {
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    padding: 0 14px 0 0 !important;
    font-size: 14px !important;
  }

  .sidebar,
  body.is-home .sidebar,
  body.is-library .sidebar,
  body.is-detail .sidebar {
    display: contents !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .sidebar > .nav:not(.nav--footer) {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 110 !important;
    height: 64px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 4px !important;
    padding: 6px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 22px !important;
    background: rgba(18,22,28,.96) !important;
    box-shadow: 0 14px 36px rgba(0,0,0,.42) !important;
    backdrop-filter: blur(18px) !important;
  }

  .sidebar > .nav:not(.nav--footer) a,
  .sidebar > .nav:not(.nav--footer) button {
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    display: grid !important;
    grid-template-rows: 24px 16px !important;
    place-items: center !important;
    gap: 2px !important;
    padding: 6px 2px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
    color: #9ca3af !important;
    font-size: 9px !important;
    line-height: 1 !important;
    text-align: center !important;
  }

  .sidebar > .nav:not(.nav--footer) a span,
  .sidebar > .nav:not(.nav--footer) button span {
    width: 24px !important;
    height: 24px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 18px !important;
    color: inherit !important;
  }

  .sidebar > .nav:not(.nav--footer) .nav-mobile-settings {
    display: grid !important;
  }

  .sidebar > .nav:not(.nav--footer) a span::before,
  .sidebar > .nav:not(.nav--footer) button span::before {
    display: none !important;
    content: none !important;
  }

  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  .sidebar > .nav:not(.nav--footer) a.is-active {
    background: #22262d !important;
    color: var(--orange-2) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .nav--footer {
    display: none !important;
  }

  .bottom-nav {
    display: none !important;
  }

  .home-page,
  body.is-home .home-page,
  body.is-library .home-page,
  .detail-page,
  body.is-detail .detail-page {
    width: 100% !important;
    max-width: 100% !important;
    padding: 14px 12px calc(86px + env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    overflow-x: clip !important;
  }

  .home-page.library-mode > .continue-card,
  .home-page.library-mode > .poster-section,
  .home-page.library-mode > .search-section {
    display: none !important;
  }

  .home-page.library-mode > .catalog-section:not([hidden]),
  .home-page.library-mode > .library-section:not([hidden]),
  .home-page.library-mode > .settings-section:not([hidden]) {
    display: block !important;
  }

  body.is-library .catalog-section,
  body.is-library .library-section,
  body.is-library .settings-section,
  body.is-detail .watch-layout,
  body.is-detail .anime-hero,
  body.is-detail .episodes-section,
  body.is-detail .comments-shell,
  .poster-section,
  .continue-card,
  .search-section {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .page-heading {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 8px 0 16px !important;
  }

  .page-heading h1 {
    font-size: clamp(28px, 9vw, 38px) !important;
    line-height: 1.05 !important;
  }

  .section-head {
    align-items: center !important;
    margin-bottom: 14px !important;
  }

  .section-head h2 {
    font-size: clamp(26px, 8vw, 34px) !important;
    line-height: 1.05 !important;
  }

  body.is-home #continueCard {
    width: calc(100% + 24px) !important;
    max-width: calc(100% + 24px) !important;
    margin: -14px -12px 24px !important;
    border-radius: 0 0 22px 22px !important;
  }

  .hero-carousel.watch-progress,
  .watch-progress {
    min-height: min(76vh, 520px) !important;
    grid-template-columns: 1fr !important;
    align-content: end !important;
    padding: 24px 18px !important;
    background-position: center !important;
  }

  .hero-carousel.watch-progress h3,
  .watch-progress h3 {
    max-width: 100% !important;
    font-size: clamp(34px, 11vw, 48px) !important;
    line-height: .98 !important;
  }

  body.is-home .poster-grid,
  #popularGrid,
  #recommendationsGrid,
  #ongoingGrid,
  #moviesGrid {
    width: calc(100% + 12px) !important;
    max-width: calc(100% + 12px) !important;
    margin-right: -12px !important;
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(150px, 42vw) !important;
    grid-template-columns: none !important;
    gap: 12px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 12px 10px 0 !important;
    scroll-snap-type: x proximity !important;
  }

  body.is-home .poster-grid .poster-card,
  #popularGrid .poster-card,
  #recommendationsGrid .poster-card,
  #ongoingGrid .poster-card,
  #moviesGrid .poster-card {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    aspect-ratio: 2 / 3 !important;
    scroll-snap-align: start !important;
  }

  .catalog-grid,
  .library-grid,
  .results {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .catalog-toolbar {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .catalog-toolbar label,
  .catalog-toolbar select {
    width: 100% !important;
    min-width: 0 !important;
  }

  .history-card,
  .history-card__body {
    width: 100% !important;
    max-width: 100% !important;
  }

  .history-card__body {
    grid-template-columns: 72px minmax(0, 1fr) 44px !important;
    gap: 12px !important;
    align-items: center !important;
  }

  .history-card__body img {
    width: 72px !important;
    height: 72px !important;
  }

  .history-card__body strong,
  .history-card__body p {
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
  }

  .settings-section .profile-summary,
  .settings-section .profile-summary.is-authenticated {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 16px !important;
  }

  .settings-section .profile-summary .accent-button {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  .settings-section .profile-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .settings-section .settings-groups {
    grid-template-columns: 1fr !important;
  }

  .settings-section .anime4k-gpu-setting {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 8px !important;
    padding-block: 12px !important;
  }

  .settings-section .anime4k-gpu-setting select {
    width: 100% !important;
  }

  body.is-detail .watch-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
  }

  body.is-detail .watch-main,
  body.is-detail .player-card,
  body.is-detail .anime-hero,
  body.is-detail .episodes-section,
  body.is-detail .comments-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.is-detail .anime-hero {
    grid-template-columns: 86px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }

  body.is-detail .anime-info h1,
  body.is-detail .title-line h1 {
    font-size: clamp(28px, 9vw, 40px) !important;
    line-height: 1.02 !important;
    overflow-wrap: anywhere !important;
  }

  body.is-detail .anime-info .description,
  body.is-detail .description {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 7 !important;
    overflow: hidden !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }

  body.is-detail .poster-column {
    max-width: 86px !important;
  }

  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback {
    width: 86px !important;
    border-radius: 14px !important;
  }

  body.is-detail .player-card {
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  body.is-detail .anime4k-stage,
  body.is-detail .player-card iframe {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    min-height: 0 !important;
  }

  body.is-detail .player-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  body.is-detail .player-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 34px 44px minmax(0, 1fr) 44px 34px 72px 58px 34px !important;
    gap: 6px !important;
    padding: 8px !important;
    align-items: center !important;
  }

  body.is-detail .anime4k-controls__top {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  body.is-detail .player-translation,
  body.is-detail #hlsTranslationSelect {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.is-detail #videoVolume {
    display: none !important;
  }

  body.is-detail #videoCurrentTime,
  body.is-detail #videoDuration {
    min-width: 0 !important;
    font-size: 10px !important;
  }

  body.is-detail .watch-party-toggle {
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    max-width: calc(100% - 20px) !important;
  }

  body.is-detail .watch-party-panel {
    position: fixed !important;
    inset: 128px 10px calc(82px + env(safe-area-inset-bottom, 0px)) 10px !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 18px !important;
  }

  .search-modal {
    padding: 12px !important;
    align-items: start !important;
  }

  .search-modal__panel {
    width: 100% !important;
    max-height: calc(100vh - 24px) !important;
    padding: 16px !important;
    border-radius: 18px !important;
  }

  .search-modal__form {
    grid-template-columns: 1fr !important;
  }

  .modal-results {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 430px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    height: 112px !important;
    min-height: 112px !important;
    grid-template-rows: 54px 50px !important;
    padding-inline: 10px !important;
  }

  .logo {
    font-size: 19px !important;
  }

  .notification-button,
  .profile-button {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
  }

  .profile-avatar {
    width: 31px !important;
    height: 31px !important;
  }

  .home-page,
  body.is-home .home-page,
  body.is-library .home-page,
  .detail-page,
  body.is-detail .detail-page {
    padding-inline: 10px !important;
  }

  body.is-home .poster-grid,
  #popularGrid,
  #recommendationsGrid,
  #ongoingGrid,
  #moviesGrid {
    grid-auto-columns: minmax(138px, 44vw) !important;
  }

  .catalog-grid,
  .library-grid,
  .results {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.is-detail .anime-hero {
    grid-template-columns: 74px minmax(0, 1fr) !important;
    padding: 12px !important;
  }

  body.is-detail .poster-column,
  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback {
    width: 74px !important;
    max-width: 74px !important;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 32px 38px minmax(0, 1fr) 38px 32px 56px 32px !important;
    gap: 5px !important;
  }

  body.is-detail .anime4k-controls > .anime4k-performance,
  body.is-detail #hlsQualitySelect {
    width: 56px !important;
    min-width: 56px !important;
    font-size: 11px !important;
  }

  body.is-detail .anime4k-controls > .anime4k-toggle {
    display: none !important;
  }
}

/* Mobile fit polish: icon-only nav, tighter search, compact watch and history. */
@media (max-width: 820px) {
  .top-search {
    width: calc(100% - 18px) !important;
    justify-self: center !important;
    height: 44px !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    border-radius: 14px !important;
  }

  .top-search button {
    width: 42px !important;
    height: 42px !important;
  }

  .top-search input {
    height: 42px !important;
    font-size: 13px !important;
    padding-right: 10px !important;
  }

  .sidebar > .nav:not(.nav--footer) {
    height: 58px !important;
    padding: 5px !important;
    border-radius: 20px !important;
  }

  .sidebar > .nav:not(.nav--footer) a,
  .sidebar > .nav:not(.nav--footer) button {
    height: 48px !important;
    min-height: 48px !important;
    display: grid !important;
    grid-template-rows: 1fr !important;
    place-items: center !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  .sidebar > .nav:not(.nav--footer) a {
    color: #9ca3af !important;
  }

  .sidebar > .nav:not(.nav--footer) a span,
  .sidebar > .nav:not(.nav--footer) button span {
    width: 34px !important;
    height: 34px !important;
    font-size: 21px !important;
    line-height: 1 !important;
  }

  .history-card__body {
    grid-template-columns: 66px minmax(0, 1fr) 38px !important;
    min-height: 78px !important;
    gap: 10px !important;
    padding: 10px !important;
  }

  .history-card__body img,
  .history-card__poster {
    width: 66px !important;
    height: 66px !important;
  }

  .history-card__body p,
  .history-card__meta,
  .history-card__body > span {
    display: none !important;
  }

  .history-card__body strong {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }

  .history-card .round-play,
  .history-card__body .round-play {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
  }

  body.is-detail .anime-hero {
    grid-template-columns: 70px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  body.is-detail .poster-column,
  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback {
    width: 70px !important;
    max-width: 70px !important;
  }

  body.is-detail .anime-info h1,
  body.is-detail .title-line h1 {
    font-size: clamp(25px, 8vw, 34px) !important;
  }

  body.is-detail .anime-info > small,
  body.is-detail .chips,
  body.is-detail .chips span {
    font-size: 10px !important;
  }

  body.is-detail .chips {
    gap: 6px !important;
    margin: 8px 0 !important;
  }

  body.is-detail .chips span {
    min-height: 28px !important;
    padding: 0 9px !important;
    border-radius: 7px !important;
  }

  body.is-detail .anime-info .description,
  body.is-detail .description {
    -webkit-line-clamp: 4 !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
    margin-top: 8px !important;
  }

  body.is-detail .poster-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }

  body.is-detail .poster-actions button,
  body.is-detail .watch-button,
  body.is-detail .bookmark-button {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  body.is-detail .player-card {
    border-radius: 14px !important;
  }

  body.is-detail .player-head {
    padding: 9px !important;
    gap: 8px !important;
  }

  body.is-detail .player-title h2,
  body.is-detail #currentEpisodeTitle {
    font-size: 15px !important;
  }

  body.is-detail .player-actions {
    gap: 6px !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    min-height: 36px !important;
    height: 36px !important;
    font-size: 11px !important;
    border-radius: 10px !important;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 30px 36px minmax(0, 1fr) 36px 30px 52px 30px !important;
    gap: 4px !important;
    padding: 6px !important;
  }

  body.is-detail .anime4k-controls button,
  body.is-detail #videoPlay,
  body.is-detail #videoMute,
  body.is-detail #videoFullscreen {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
  }

  body.is-detail #videoCurrentTime,
  body.is-detail #videoDuration {
    font-size: 9px !important;
  }

  body.is-detail .anime4k-controls > .anime4k-performance,
  body.is-detail #hlsQualitySelect {
    width: 52px !important;
    min-width: 52px !important;
    height: 30px !important;
    min-height: 30px !important;
    font-size: 10px !important;
    padding-inline: 5px !important;
  }

  body.is-detail .watch-party-toggle {
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 10px !important;
    gap: 5px !important;
    border-radius: 12px !important;
  }

  body.is-detail .watch-party-toggle__label {
    font-size: 10px !important;
  }

  body.is-detail .watch-party-panel {
    inset: 118px 8px calc(70px + env(safe-area-inset-bottom, 0px)) 8px !important;
    border-radius: 14px !important;
  }

  .watch-party-panel__head,
  .watch-party-lobby,
  .watch-party-room__bar,
  .watch-party-share-link,
  .watch-party-form,
  .watch-party-hint {
    padding-inline: 10px !important;
  }

  .watch-party-panel__head strong {
    font-size: 13px !important;
  }

  .watch-party-lobby p,
  .watch-party-message p {
    font-size: 11px !important;
    line-height: 1.38 !important;
  }

  .watch-party-room__bar {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }

  .watch-party-room__bar span {
    grid-column: 1 / -1 !important;
  }

  .watch-party-room__bar button,
  .watch-party-form button,
  #watchPartyCreate {
    min-height: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    font-size: 10px !important;
  }

  .watch-party-form {
    grid-template-columns: minmax(0, 1fr) 38px !important;
    gap: 6px !important;
  }

  .watch-party-form input {
    height: 38px !important;
    min-height: 38px !important;
    font-size: 12px !important;
    border-radius: 10px !important;
  }
}

@media (max-width: 430px) {
  .top-search {
    width: calc(100% - 22px) !important;
  }

  .sidebar > .nav:not(.nav--footer) {
    left: 12px !important;
    right: 12px !important;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 28px 34px minmax(0, 1fr) 34px 28px 48px 28px !important;
  }

  body.is-detail .anime4k-controls > .anime4k-performance,
  body.is-detail #hlsQualitySelect {
    width: 48px !important;
    min-width: 48px !important;
  }
}

/* Narrow phone cleanup, tuned for 330px responsive viewport. */
@media (max-width: 430px) {
  .topbar,
  html:not([data-theme="light"]) body.is-detail .topbar {
    height: 108px !important;
    min-height: 108px !important;
    grid-template-rows: 52px 44px !important;
    padding-top: 6px !important;
    padding-bottom: 8px !important;
  }

  .top-search {
    width: calc(100% - 28px) !important;
    height: 40px !important;
    margin-top: 0 !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
  }

  .top-search button {
    width: 40px !important;
    height: 38px !important;
  }

  .top-search input {
    height: 38px !important;
    font-size: 12px !important;
  }

  .sidebar > .nav:not(.nav--footer) {
    left: 14px !important;
    right: 14px !important;
    height: 54px !important;
    padding: 5px !important;
    gap: 2px !important;
    border-radius: 18px !important;
  }

  .sidebar > .nav:not(.nav--footer) a,
  .sidebar > .nav:not(.nav--footer) button,
  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a,
  body.is-home .sidebar > .nav:not(.nav--footer) button,
  body.is-home .sidebar > .nav:not(.nav--footer) a:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) button:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a[data-nav="home"] {
    height: 44px !important;
    min-height: 44px !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  .sidebar > .nav:not(.nav--footer) a.is-active,
  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  body.is-home .sidebar > .nav:not(.nav--footer) a:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) button:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a[data-nav="home"] {
    color: var(--orange-2) !important;
  }

  .sidebar > .nav:not(.nav--footer) a span,
  .sidebar > .nav:not(.nav--footer) button span {
    width: 30px !important;
    height: 30px !important;
    font-size: 19px !important;
  }

  .home-page,
  body.is-home .home-page,
  body.is-library .home-page,
  .detail-page,
  body.is-detail .detail-page {
    padding-top: 10px !important;
  }

  .history-list {
    display: grid !important;
    gap: 8px !important;
  }

  .history-card {
    grid-template-columns: 76px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 8px 12px 8px 8px !important;
    min-height: 76px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  .history-card__body {
    min-height: 76px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    align-items: center !important;
    padding: 0 !important;
  }

  .history-card__poster,
  .history-card__body img,
  .history-card__body > img {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 62px !important;
    min-width: 62px !important;
    height: 58px !important;
    border-radius: 14px !important;
    object-fit: cover !important;
  }

  .history-card__body strong,
  .history-card h3,
  .history-card strong {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    align-self: center !important;
    justify-self: stretch !important;
    text-align: left !important;
    font-size: 13px !important;
    line-height: 1.18 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }

  .history-card__body p,
  .history-card__meta,
  .history-card__body > span,
  .history-card small,
  .history-card .round-play {
    display: none !important;
  }

  body.is-detail .anime-hero {
    grid-template-columns: 62px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 10px !important;
    border-radius: 16px !important;
  }

  body.is-detail .poster-column,
  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback {
    width: 62px !important;
    max-width: 62px !important;
  }

  body.is-detail .anime-info h1,
  body.is-detail .title-line h1 {
    font-size: clamp(22px, 7.2vw, 26px) !important;
    line-height: 1.04 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
    overflow: hidden !important;
  }

  body.is-detail .anime-info > small {
    font-size: 9px !important;
    line-height: 1.25 !important;
  }

  body.is-detail .chips {
    gap: 5px !important;
    margin: 6px 0 !important;
  }

  body.is-detail .chips span {
    min-height: 24px !important;
    padding: 0 7px !important;
    font-size: 9px !important;
  }

  body.is-detail .anime-info .description,
  body.is-detail .description {
    -webkit-line-clamp: 3 !important;
    font-size: 11px !important;
    line-height: 1.36 !important;
    margin-top: 6px !important;
  }

  body.is-detail .poster-actions {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin-top: 10px !important;
    gap: 7px !important;
  }

  body.is-detail .poster-actions button,
  body.is-detail .watch-button,
  body.is-detail .bookmark-button {
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 8px !important;
    font-size: 10px !important;
  }

  body.is-detail .player-card {
    margin-top: 16px !important;
    margin-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  body.is-detail .player-card > .player-head,
  body.is-detail .player-head,
  body.is-detail .player-head:hover,
  html:not([data-theme="light"]) body.is-detail .player-card > .player-head,
  html[data-theme="light"] body.is-detail .player-card > .player-head {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 8px !important;
    margin: 0 !important;
    background: #0d1117 !important;
  }

  body.is-detail .anime4k-stage,
  body.is-detail .player-card iframe {
    order: 1 !important;
  }

  body.is-detail .player-title,
  body.is-detail .css-filter-control {
    display: none !important;
  }

  body.is-detail .player-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    height: 32px !important;
    min-height: 32px !important;
    font-size: 10px !important;
    border-radius: 9px !important;
  }

  body.is-detail .animehub-center-play,
  body.is-detail .animehub-center-play:hover,
  body.is-detail .animehub-center-play:focus-visible {
    width: 58px !important;
    height: 58px !important;
  }

  body.is-detail .animehub-center-play span {
    border-top-width: 11px !important;
    border-bottom-width: 11px !important;
    border-left-width: 17px !important;
    margin-left: 4px !important;
  }

  body.is-detail .anime4k-controls {
    grid-template-columns: 28px 32px minmax(54px, 1fr) 32px 28px 44px 28px !important;
    gap: 3px !important;
    padding: 5px !important;
    bottom: calc(86px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.is-detail .anime4k-controls > .anime4k-performance,
  body.is-detail #hlsQualitySelect {
    width: 44px !important;
    min-width: 44px !important;
    font-size: 9px !important;
    padding-inline: 3px !important;
  }

  body.is-detail #videoCurrentTime,
  body.is-detail #videoDuration {
    font-size: 8px !important;
  }

  body.is-detail .watch-party-toggle {
    height: 30px !important;
    min-height: 30px !important;
    top: 8px !important;
    right: 8px !important;
    padding: 0 8px !important;
  }

  body.is-detail .watch-party-toggle__label {
    font-size: 9px !important;
  }
}

/* Final narrow-phone watch polish: keep this after all earlier mobile overrides. */
@media (max-width: 430px) {
  .sidebar > .nav:not(.nav--footer) a,
  .sidebar > .nav:not(.nav--footer) button,
  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) button:hover,
  body.is-home .sidebar > .nav:not(.nav--footer) a.is-active,
  body.is-home .sidebar > .nav:not(.nav--footer) a[data-nav="home"] {
    height: 44px !important;
    min-height: 44px !important;
    background: transparent !important;
    color: #aeb4be !important;
    box-shadow: none !important;
    transform: none !important;
    backdrop-filter: none !important;
  }

  .sidebar > .nav:not(.nav--footer) a:hover,
  .sidebar > .nav:not(.nav--footer) a:focus-visible,
  .sidebar > .nav:not(.nav--footer) a.is-active {
    color: #ffd0ac !important;
  }

  .history-card {
    grid-template-columns: 70px minmax(0, 1fr) !important;
    min-height: 88px !important;
    padding: 9px 12px 9px 9px !important;
  }

  .history-card__poster,
  .history-card__body img,
  .history-card__body > img {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
  }

  .history-card__body {
    min-height: 64px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-content: center !important;
    gap: 8px !important;
    padding: 0 !important;
  }

  .history-card__meta {
    grid-column: 1 !important;
    grid-row: 2 !important;
    display: block !important;
    width: 100% !important;
  }

  .history-card__meta b {
    display: none !important;
  }

  .history-card__meta small {
    display: block !important;
    width: 100% !important;
    height: 4px !important;
    margin-top: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #ffd0ac 0 var(--history-progress, 0%), rgba(255,255,255,.09) var(--history-progress, 0%)) !important;
    color: transparent !important;
  }

  body.is-detail .watch-main {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
  }

  body.is-detail .anime-hero {
    order: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    padding: 14px 18px 18px !important;
    gap: 0 !important;
    text-align: center !important;
  }

  body.is-detail .poster-column {
    width: min(210px, 72vw) !important;
    max-width: min(210px, 72vw) !important;
    height: auto !important;
    margin: 0 auto 18px !important;
  }

  body.is-detail .poster-column img,
  body.is-detail .poster-column .poster-fallback,
  body.is-detail .anime-poster {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 2 / 3 !important;
    height: auto !important;
    min-height: 0 !important;
    border-radius: 4px !important;
    object-fit: cover !important;
  }

  body.is-detail .anime-info {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: center !important;
  }

  body.is-detail .title-line {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
  }

  body.is-detail .anime-info h1,
  body.is-detail .title-line h1 {
    font-size: 26px !important;
    line-height: 1.12 !important;
    font-weight: 800 !important;
    text-align: center !important;
    color: #e5e7eb !important;
    text-shadow: none !important;
    -webkit-line-clamp: 3 !important;
  }

  body.is-detail .title-line strong {
    min-width: 42px !important;
    padding: 5px 7px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    line-height: 1 !important;
  }

  body.is-detail .subtitle {
    margin: 8px 0 18px !important;
    font-size: 19px !important;
    line-height: 1.25 !important;
    color: #ffd0ac !important;
    text-align: center !important;
  }

  body.is-detail .chips {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1px !important;
    margin: 0 0 12px !important;
    overflow: hidden !important;
    background: rgba(255,255,255,.035) !important;
  }

  body.is-detail .chips span {
    min-height: 36px !important;
    padding: 0 10px !important;
    border-radius: 0 !important;
    background: rgba(0,0,0,.22) !important;
    color: #aeb4be !important;
    font-size: 12px !important;
    font-weight: 600 !important;
  }

  body.is-detail .meta-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1px !important;
    margin: 0 0 16px !important;
    text-align: left !important;
  }

  body.is-detail .meta-list dt,
  body.is-detail .meta-list dd {
    min-height: 32px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    background: rgba(0,0,0,.20) !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  body.is-detail .meta-list dt {
    color: #858b95 !important;
    padding-bottom: 0 !important;
  }

  body.is-detail .meta-list dd {
    color: #d1d5db !important;
    padding-top: 0 !important;
  }

  body.is-detail .anime-info .description,
  body.is-detail .description {
    order: 6 !important;
    margin: 4px 0 18px !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #b8bdc6 !important;
    text-align: left !important;
    -webkit-line-clamp: 9 !important;
  }

  body.is-detail .anime-info > small {
    order: 7 !important;
    margin-top: 8px !important;
    color: #858b95 !important;
    font-size: 11px !important;
    text-align: center !important;
  }

  body.is-detail .poster-actions {
    order: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 0 0 18px !important;
  }

  body.is-detail .poster-actions button,
  body.is-detail .watch-button,
  body.is-detail .bookmark-button,
  body.is-detail .share-button {
    width: 100% !important;
    min-height: 48px !important;
    height: 48px !important;
    border-radius: 3px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
  }

  body.is-detail .watch-button {
    order: 1 !important;
    border-color: transparent !important;
    background: #ffa477 !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button {
    order: 2 !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #f3f4f6 !important;
  }

  body.is-detail .share-button {
    order: 3 !important;
    min-height: 40px !important;
    height: 40px !important;
    font-size: 11px !important;
    border-color: rgba(255,255,255,.1) !important;
    background: #111318 !important;
    color: #aeb4be !important;
  }

  body.is-detail .watch-button:hover,
  body.is-detail .watch-button:focus-visible {
    background: #ffd0ac !important;
    color: #15110f !important;
  }

  body.is-detail .bookmark-button:hover,
  body.is-detail .bookmark-button:focus-visible,
  body.is-detail .share-button:hover,
  body.is-detail .share-button:focus-visible {
    border-color: rgba(255,164,119,.55) !important;
    background: #171b22 !important;
    color: #ffd0ac !important;
  }

  body.is-detail .player-card {
    order: 2 !important;
    margin-top: 0 !important;
    border-radius: 4px !important;
  }

  body.is-detail .player-card > .player-head,
  body.is-detail .player-head,
  body.is-detail .player-head:hover,
  html:not([data-theme="light"]) body.is-detail .player-card > .player-head,
  html[data-theme="light"] body.is-detail .player-card > .player-head {
    padding: 7px !important;
    background: #111318 !important;
  }

  body.is-detail .player-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 3px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
  }
}

/* Mobile party/player hard stop: keep after the final narrow-phone block. */
@media (max-width: 430px) {
  body.is-detail .player-card.is-party-open > .player-head,
  html:not([data-theme="light"]) body.is-detail .player-card.is-party-open > .player-head,
  html[data-theme="light"] body.is-detail .player-card.is-party-open > .player-head {
    display: none !important;
  }

  body.is-detail .player-card > .watch-party-panel,
  html:not([data-theme="light"]) body.is-detail .player-card > .watch-party-panel,
  html[data-theme="light"] body.is-detail .player-card > .watch-party-panel {
    position: static !important;
    inset: auto !important;
    order: 2 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: min(58vh, 380px) !important;
    margin: 0 !important;
    border-radius: 0 0 4px 4px !important;
    border: 0 !important;
    border-top: 1px solid rgba(255,255,255,.1) !important;
    background: #11151b !important;
    box-shadow: none !important;
  }

  body.is-detail .player-card > .watch-party-panel[hidden] {
    display: none !important;
  }

  body.is-detail .animehub-center-play,
  body.is-detail .animehub-center-play:hover,
  body.is-detail .animehub-center-play:focus-visible {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  body.is-detail .animehub-center-play span {
    margin-left: 3px !important;
    border-top-width: 8px !important;
    border-bottom-width: 8px !important;
    border-left-width: 13px !important;
  }

  body.is-detail .player-actions {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }

  body.is-detail .player-actions label,
  body.is-detail .player-actions button,
  body.is-detail .player-actions select {
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    font-size: 10px !important;
  }
}

/* Final mobile video controls: keep the actual player chrome compact and calm. */
@media (max-width: 430px) {
  body.is-detail .anime4k-stage .anime4k-controls,
  html:not([data-theme="light"]) body.is-detail .anime4k-stage .anime4k-controls,
  html[data-theme="light"] body.is-detail .anime4k-stage .anime4k-controls {
    left: 6px !important;
    right: 6px !important;
    bottom: 8px !important;
    width: auto !important;
    max-width: calc(100% - 12px) !important;
    height: 34px !important;
    min-height: 34px !important;
    display: grid !important;
    grid-template-columns: 24px 32px minmax(54px, 1fr) 24px 30px 30px !important;
    align-items: center !important;
    column-gap: 4px !important;
    row-gap: 0 !important;
    padding: 3px 6px !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 999px !important;
    background: rgba(8, 10, 14, .78) !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.34) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-sizing: border-box !important;
  }

  body.is-detail .anime4k-controls__top,
  body.is-detail #videoDuration,
  body.is-detail #videoVolume {
    display: none !important;
  }

  body.is-detail .anime4k-controls button,
  body.is-detail #videoPlay,
  body.is-detail #videoMute,
  body.is-detail #videoFullscreen {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #f5f6f8 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.is-detail .anime4k-controls button:hover,
  body.is-detail .anime4k-controls button:focus-visible,
  body.is-detail #videoPlay:hover,
  body.is-detail #videoPlay:focus-visible,
  body.is-detail #videoMute:hover,
  body.is-detail #videoMute:focus-visible,
  body.is-detail #videoFullscreen:hover,
  body.is-detail #videoFullscreen:focus-visible {
    background: #242832 !important;
    color: #ffd0ac !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.is-detail #videoPlay {
    font-size: 0 !important;
  }

  body.is-detail #videoPlay::before {
    content: "" !important;
    width: 0 !important;
    height: 0 !important;
    margin-left: 2px !important;
    border-top: 6px solid transparent !important;
    border-bottom: 6px solid transparent !important;
    border-left: 10px solid currentColor !important;
    background: transparent !important;
    clip-path: none !important;
    transform: translateY(1px) !important;
  }

  body.is-detail #videoPlay.is-playing::before,
  body.is-detail #videoPlay[data-playing="true"]::before {
    width: 8px !important;
    height: 11px !important;
    margin-left: 0 !important;
    border: 0 !important;
    background: linear-gradient(90deg, currentColor 0 32%, transparent 32% 68%, currentColor 68% 100%) !important;
    transform: translateY(1px) !important;
  }

  body.is-detail #videoCurrentTime {
    width: 32px !important;
    min-width: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #f5f6f8 !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
  }

  body.is-detail .video-seek-wrap {
    min-width: 0 !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.is-detail #videoSeek {
    width: 100% !important;
    min-width: 0 !important;
    height: 24px !important;
  }

  body.is-detail #videoSeek::-webkit-slider-runnable-track {
    height: 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #ffa477 var(--seek-progress, 0%), rgba(255,255,255,.22) var(--seek-progress, 0%)) !important;
  }

  body.is-detail #videoSeek::-webkit-slider-thumb {
    width: 10px !important;
    height: 10px !important;
    margin-top: -3px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #f5f6f8 !important;
    box-shadow: none !important;
  }

  body.is-detail #videoSeek::-moz-range-track,
  body.is-detail #videoSeek::-moz-range-progress {
    height: 4px !important;
    border-radius: 999px !important;
  }

  body.is-detail #videoSeek::-moz-range-thumb {
    width: 10px !important;
    height: 10px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #f5f6f8 !important;
  }

  body.is-detail #videoMute {
    font-size: 0 !important;
  }

  body.is-detail #videoMute::before {
    width: 16px !important;
    height: 16px !important;
    transform: translateY(1px) !important;
  }

  body.is-detail .anime4k-controls > .anime4k-performance,
  body.is-detail #hlsQualitySelect {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #f5f6f8 !important;
    box-shadow: none !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    line-height: 24px !important;
    text-align: center !important;
    text-align-last: center !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    transform: none !important;
  }

  body.is-detail #hlsQualitySelect:hover,
  body.is-detail #hlsQualitySelect:focus-visible {
    background: #242832 !important;
    color: #ffd0ac !important;
    transform: none !important;
  }

  body.is-detail #videoFullscreen {
    width: 24px !important;
    min-width: 24px !important;
    margin-left: 6px !important;
    font-size: 16px !important;
    line-height: 1 !important;
    padding-top: 2px !important;
  }

  body.is-detail .anime4k-stage > .watch-party-toggle,
  body.is-detail .anime4k-stage > .watch-party-toggle:hover,
  body.is-detail .anime4k-stage > .watch-party-toggle:focus-visible,
  body.is-detail .anime4k-stage > .watch-party-toggle[aria-expanded="true"] {
    top: 8px !important;
    right: 8px !important;
    left: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    padding: 0 8px !important;
    gap: 5px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 999px !important;
    background: rgba(8, 10, 14, .82) !important;
    color: #f5f6f8 !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.28) !important;
    transform: none !important;
  }

  body.is-detail .anime4k-stage > .watch-party-toggle:hover,
  body.is-detail .anime4k-stage > .watch-party-toggle:focus-visible,
  body.is-detail .anime4k-stage > .watch-party-toggle[aria-expanded="true"] {
    background: #242832 !important;
    color: #ffd0ac !important;
    border-color: rgba(255,208,172,.36) !important;
  }

  body.is-detail .watch-party-toggle__icon {
    width: 17px !important;
    height: 17px !important;
  }

  body.is-detail .watch-party-toggle__label {
    font-size: 10px !important;
    line-height: 1 !important;
  }

  body.is-detail .anime4k-stage:fullscreen > .watch-party-panel,
  html:not([data-theme="light"]) body.is-detail .anime4k-stage:fullscreen > .watch-party-panel,
  html[data-theme="light"] body.is-detail .anime4k-stage:fullscreen > .watch-party-panel {
    position: absolute !important;
    z-index: 60 !important;
    top: 46px !important;
    right: 8px !important;
    bottom: 50px !important;
    left: auto !important;
    width: clamp(178px, 34vw, 236px) !important;
    max-width: calc(100vw - 20px) !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 12px !important;
    background: rgba(13, 16, 22, .94) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.42) !important;
    overflow: hidden !important;
  }

  body.is-detail .anime4k-stage:fullscreen > .watch-party-panel[hidden] {
    display: none !important;
  }

  body.is-detail .anime4k-stage:fullscreen > .watch-party-panel .watch-party-panel__head {
    min-height: 48px !important;
    padding: 10px !important;
  }

  body.is-detail .anime4k-stage:fullscreen > .watch-party-panel .watch-party-panel__head strong {
    font-size: 12px !important;
  }

  body.is-detail .anime4k-stage:fullscreen > .watch-party-panel .watch-party-feed {
    min-height: 0 !important;
  }
}

/* Final notifications popover alignment. */
.top-actions .notifications-popover,
html:not([data-theme="light"]) .top-actions .notifications-popover,
html[data-theme="light"] .top-actions .notifications-popover {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 120 !important;
  width: min(320px, calc(100vw - 18px)) !important;
  max-width: calc(100vw - 18px) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 12px !important;
  background: #171b22 !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.36) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
}

.top-actions .notifications-popover[hidden] {
  display: none !important;
}

.top-actions .notifications-popover::before {
  content: "" !important;
  position: absolute !important;
  top: -6px !important;
  right: 102px !important;
  width: 10px !important;
  height: 10px !important;
  border-left: 1px solid rgba(255,255,255,.1) !important;
  border-top: 1px solid rgba(255,255,255,.1) !important;
  background: #171b22 !important;
  transform: rotate(45deg) !important;
}

@media (max-width: 520px) {
  .top-actions .notifications-popover,
  html:not([data-theme="light"]) .top-actions .notifications-popover,
  html[data-theme="light"] .top-actions .notifications-popover {
    position: fixed !important;
    top: 76px !important;
    right: 10px !important;
    left: 10px !important;
    width: auto !important;
    max-width: none !important;
  }

  .top-actions .notifications-popover::before {
    right: 74px !important;
  }
}