/* Video Playlist */

.playlist-root,
#video-playlist,
#embed-player {
  position: relative;
  width: 100%;
  overflow: hidden;
  color: var(--pl-text);
  font-family: var(--playlist-font);
  background: var(--cooldrama-theme-panel-bg);
  transition: background-color 0.35s ease;
}

.embed-wrapper,
.playlist-container {
  background: var(--cooldrama-theme-panel-bg);
  border: 0;
  border-radius: 0;
  transition: background-color 0.35s ease;
}

.embed-wrapper {
  border-color: transparent;
}

.playlist-container.col-x2 {
  display: grid;
  grid-template-columns: 2fr 1fr;
}

.embed-container {
  position: relative;
  height: 0;
  padding-top: 56.25%;
  overflow: hidden;
  background: #000;
}

.embed-container iframe,
.embed-container .embed-responsive,
.video-advertise {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-container .embed-responsive.invisible,
.video-advertise.invisible {
  display: none;
}

.embed-container .embed-responsive.not-visible {
  visibility: hidden;
  opacity: 0;
}

/* Legacy class compatibility (scoped to playlist root only). */
:is(.playlist-root, #video-playlist, #embed-player) div:has(.layout-horizontal) .playlist-container {
  border: 0;
  border-radius: 0;
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-poster {
  position: absolute;
  inset: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background: #000;
  cursor: pointer;
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-poster.uc {
  cursor: auto;
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-poster::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  z-index: 5;
  height: 30%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000);
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-poster .cs-cover {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: -webkit-optimize-contrast;
  filter: brightness(0.5) saturate(1.3);
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-play-icon .play-circle {
  width: 5rem;
  height: 5rem;
  color: var(--white-color);
  transition: transform 0.2s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .cs-play-icon:hover .play-circle {
  transform: scale(1.1);
}

:is(.playlist-root, #video-playlist, #embed-player) .playlist-wrapper {
  display: flex;
  flex-direction: column;
  background: var(--wp--preset--color--surface-color);
  transition: background-color 0.35s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .banner-container {
  padding: 1rem;
  border-top: 1px solid var(--border-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .layout-horizontal .banner-container {
  border-top: 0;
}

:is(.playlist-root, #video-playlist, #embed-player) .banner-container img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 0.375rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .episode-container {
  height: auto;
  max-height: 8.25rem;
  padding: 1rem;
  overflow-y: auto;
  border-top: 1px solid var(--border-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .layout-horizontal .episode-container {
  max-height: 100%;
}

:is(.playlist-root, #video-playlist, #embed-player) .layout-horizontal:not(:has(.banner-container)) .episode-container {
  border-top: 0;
}

:is(.playlist-root, #video-playlist, #embed-player) .episode-container::-webkit-scrollbar {
  width: 0.25rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .episode-container::-webkit-scrollbar-track {
  background: var(--primary-dark-color);
  border-radius: 0.625rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .episode-container::-webkit-scrollbar-thumb {
  background: var(--playlist-color);
  border-radius: 0.625rem;
}

.playlist-card {
  background: var(--cooldrama-theme-panel-bg);
  border: 0;
  border-radius: 0.25rem;
  overflow: hidden;
  box-shadow: none;
  color: var(--pl-text);
  transition: background-color 0.35s ease;
}

.playlist-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--pl-border);
  background: var(--pl-surface-soft);
  color: var(--pl-text);
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.playlist-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

.playlist-status {
  font-size: 12px;
  color: var(--pl-muted);
}

.playlist-status[data-status="ok"] {
  color: var(--playlist-color);
}

.playlist-status[data-status="error"] {
  color: var(--pl-danger);
}

.playlist-body {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 0;
  background: var(--cooldrama-theme-panel-bg);
  color: var(--pl-text);
  transition: background-color 0.35s ease;
}

.playlist-player-pane,
.video-container {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--cooldrama-theme-panel-bg);
  border-right: 1px solid var(--pl-border);
  overflow: hidden;
  color: var(--pl-text);
  transition: background-color 0.35s ease, border-color 0.35s ease;
}

.playlist-player-pane.has-poster .playlist-video {
  background: transparent;
}

.playlist-player-pane.has-poster .playlist-jwplayer {
  background: transparent;
}

.playlist-poster {
  position: relative;
  display: none;
  overflow: hidden;
}

.playlist-fallback-overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1rem, 2vw, 1.5rem);
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.52) 48%, rgba(0, 0, 0, 0.76) 100%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.playlist-fallback-overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

.playlist-fallback-copy {
  display: grid;
  gap: 0.2rem;
  width: min(100%, 30rem);
  color: var(--white-color);
  justify-items: center;
  text-align: center;
}

.playlist-fallback-copy [hidden] {
  display: none !important;
}

.playlist-fallback-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 2rem;
  padding: 0.38rem 0.8rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 143, 0, 0.18);
  color: #ffb85c;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  box-shadow: 0 0.875rem 2rem rgba(0, 0, 0, 0.24);
}

.playlist-fallback-title {
  margin: 0;
  font-size: clamp(1.4rem, 2vw, 2.2rem);
  font-weight: 700;
  line-height: 1.1;
  color: var(--white-color);
  text-wrap: balance;
}

.playlist-fallback-message,
.playlist-fallback-detail {
  margin: 0;
  max-width: 34rem;
  color: rgba(255, 255, 255, 0.94);
}

.playlist-fallback-message {
  font-size: clamp(1.05rem, 1.35vw, 1.4rem);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.015em;
  text-shadow: 0 0.2rem 0.75rem rgba(0, 0, 0, 0.45);
}

.playlist-fallback-detail {
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.78);
}

.playlist-root.is-player-fallback .playlist-poster {
  background-position: center center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-color: #000 !important;
}

.playlist-root.is-player-fallback .playlist-big-play {
  display: none !important;
}

.playlist-big-play {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: none;
  align-items: center;
  justify-content: center;
  width: 5rem;
  height: 5rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--white-color);
  transform: translate(-50%, -50%);
  cursor: pointer;
  transition: transform 0.2s ease, color 0.2s ease;
}

.playlist-big-play svg {
  width: 100%;
  height: 100%;
  display: block;
}

.playlist-big-play:hover {
  transform: translate(-50%, -50%) scale(1.08);
  color: var(--playlist-color);
}

.playlist-jwplayer,
.playlist-video,
.playlist-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  border: 0;
  transition: background-color 0.35s ease;
}

.playlist-jwplayer {
  position: relative;
  overflow: hidden;
}

.video-container iframe,
.playlist-player-pane iframe,
.playlist-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.backdrop-container,
.playlist-poster {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.playlist-video {
  object-fit: contain;
}

.backdrop-container > .post-backdrop,
.playlist-poster > .post-backdrop {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.3);
}

.loader-circle-container,
.video-loading {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: none;
  align-items: center;
  justify-content: center;
  margin-block-start: 0;
  background: transparent;
  pointer-events: none;
  z-index: 7;
}

.loader-circle-container.is-playlist-loading,
.video-loading.is-playlist-loading {
  background: rgba(16, 19, 26, 0.88);
  background: color-mix(in srgb, var(--cooldrama-theme-panel-bg, #10131a) 88%, transparent);
  pointer-events: auto;
}

.loader-circle-container.is-video-loading,
.video-loading.is-video-loading {
  background: transparent;
  pointer-events: none;
}

.loader-circle-container.is-video-loading.has-poster-mask,
.video-loading.is-video-loading.has-poster-mask {
  background: linear-gradient(
    180deg,
    rgba(16, 19, 26, 0.18) 0%,
    rgba(16, 19, 26, 0.32) 45%,
    rgba(16, 19, 26, 0.48) 100%
  );
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--cooldrama-theme-panel-bg, #10131a) 18%, transparent) 0%,
      color-mix(in srgb, var(--cooldrama-theme-panel-bg, #10131a) 32%, transparent) 45%,
      color-mix(in srgb, var(--cooldrama-theme-panel-bg, #10131a) 48%, transparent) 100%
    );
  pointer-events: auto;
}

.loader-circle-container .playlist-loader-circle,
.video-loading .playlist-loader-circle {
  width: clamp(3.5rem, 7vw, 4.375rem);
  height: clamp(3.5rem, 7vw, 4.375rem);
  min-width: clamp(3.5rem, 7vw, 4.375rem);
  min-height: clamp(3.5rem, 7vw, 4.375rem);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
  border-style: solid;
  border-width: clamp(0.5rem, 1vw, 0.625rem);
  border-color: rgba(255, 255, 255, 0.5);
  border-color: color-mix(in srgb, var(--cooldrama-theme-panel-text, #ffffff) 48%, transparent);
  border-top-color: var(--playlist-color);
  border-radius: var(--wp--preset--border-radius--full, 999px);
  animation: circle-spinner 1s linear infinite;
}

.loader-circle-container .playlist-loader-circle .jw-svg-icon-buffer,
.video-loading .playlist-loader-circle .jw-svg-icon-buffer {
  display: none;
  pointer-events: none;
}

.loader-circle-container .playlist-loader-circle .jw-svg-icon-buffer path,
.video-loading .playlist-loader-circle .jw-svg-icon-buffer path {
  display: none !important;
}

@keyframes circle-spinner {
  to {
    transform: rotate(360deg);
  }
}

.colorful-spinner-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2.5rem 0;
}

.colorful-spinner {
  width: 2rem;
  height: 2rem;
  color: var(--wp--preset--color--accent-color, var(--playlist-color));
  animation: rotate-outer 1.4s linear infinite;
}

.colorful-spinner svg {
  animation: color-anim 1.4s infinite;
}

.colorful-spinner circle {
  stroke-width: 3.6;
  stroke-dasharray: 5rem, 12.5rem;
  stroke-dashoffset: 0;
  stroke: currentColor;
  animation: rotate-inner 1.4s ease-in-out infinite;
}

@keyframes rotate-outer {
  0% {
    transform-origin: 50% 50%;
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotate-inner {
  0% {
    stroke-dasharray: 1px, 12.5rem;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 6.25rem, 12.5rem;
    stroke-dashoffset: -15px;
  }

  100% {
    stroke-dasharray: 6.25rem, 12.5rem;
    stroke-dashoffset: -125px;
  }
}

@keyframes color-anim {
  0% {
    color: #4285f4;
  }

  25% {
    color: #ea4335;
  }

  50% {
    color: #f9bb2d;
  }

  75% {
    color: #34a853;
  }
}

:is(.playlist-root, #video-playlist, #embed-player) .jwplayer {
  width: 100% !important;
  height: 100% !important;
  background: #000;
}

.playlist-btn {
  height: 2.5rem;
  border: 0;
  background: var(--cooldrama-theme-panel-bg);
  color: var(--cooldrama-theme-panel-text);
  padding: 0 0.875rem;
  border-radius: 0.25rem;
  cursor: pointer;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: capitalize;
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
  transition: all 0.35s ease;
}

.playlist-btn:hover {
  color: var(--playlist-color);
}

.playlist-list-pane,
.episode-tab-section {
  background: var(--cooldrama-theme-panel-bg);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 0;
  height: 100%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

.playlist-server-switch,
.episode-tab-navigation,
.switch-server-container {
  display: none;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  padding: 0.75rem;
  border-top: 1px solid var(--pl-border);
}

.playlist-server-switch .playlist-server-btn,
.switch-server {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-width: 7.75rem;
  color: var(--playlist-color);
}

.playlist-server-switch .playlist-server-btn svg,
.switch-server svg {
  width: 1rem;
  height: 1rem;
  transition: transform 0.35s cubic-bezier(0.2, 0.9, 0.2, 1);
}

.playlist-server-switch .playlist-server-btn:hover,
.switch-server:hover {
  color: var(--playlist-color);
}

.playlist-server-switch .playlist-server-btn:hover .icon-arrow-left,
.switch-server:hover .icon-arrow-left {
  transform: translateX(-0.25rem);
}

.playlist-server-switch .playlist-server-btn:hover .icon-arrow-right,
.switch-server:hover .icon-arrow-right {
  transform: translateX(0.25rem);
}

.playlist-server-switch .playlist-server-text {
  line-height: 1;
}

.playlist-server-switch .playlist-server-btn.active {
  color: var(--playlist-color);
}

.playlist-list-title {
  margin: 0;
  padding: 12px 14px 2px;
  font-size: 30px;
  font-weight: 700;
  color: var(--pl-text);
}

  .playlist-post-title.wp-block-post-title,
.playlist-list-pane > .playlist-post-title {
  margin: 0;
  padding: 1.45rem 1rem 1.2rem;
  font-family: Roboto, "Helvetica Neue", sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.22;
  color: var(--pl-text);
  border-bottom: 0;
  word-break: break-word;
}



.playlist-list-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 0.95rem;
  row-gap: 0.2rem;
  margin: 0;
  padding: 0.625rem 1rem 0.25rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--pl-muted);
  border-bottom: 0;
  word-break: break-word;
}

.playlist-list-meta-item {
  display: inline-block;
  color: var(--pl-text);
}

.playlist-list-meta-separator {
  display: inline-block;
  color: var(--pl-muted);
  opacity: 0.85;
}

.playlist-list-meta:empty {
  display: none;
}
  .playlist-list-total {
  display: block;
  margin: 0;
  padding: 0.75rem 1rem;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--pl-text);
  border-bottom: 1px solid var(--pl-border);
  background: transparent;
  word-break: break-word;
}

.playlist-list-pane .playlist-context-top {
  display: block;
  min-width: 0;
  max-width: 100%;
  padding: 0.625rem 0.5rem;
  color: var(--pl-text);
  border: 0;
  border-bottom: 0;
  max-height: min(38vh, 320px);
  overflow: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.playlist-list-pane .playlist-context-top > * {
  margin: 0;
}

.playlist-list-pane .playlist-context-top > :not(.playlist-context-item):not(details) {
  display: none !important;
}

.playlist-list-pane .playlist-context-top > .playlist-context-item:not(:first-child),
.playlist-list-pane .playlist-context-top > details:not(:first-child) {
  display: none !important;
}

.playlist-list-pane .playlist-context-top .playlist-context-item {
  margin: 0;
  min-width: 0;
  max-width: 100%;
  background: var(--pl-surface-soft);
  border-radius: 0.3rem;
  border: 0;
  box-shadow: none;
  overflow: hidden;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.playlist-list-pane .playlist-context-top .playlist-context-item:not([open]) {
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

.playlist-list-pane .playlist-context-top .playlist-context-item[open] {
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

.playlist-list-pane .playlist-context-top .playlist-context-summary {
  padding: 0.95rem 1rem;
  min-width: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  border: 0;
}

.playlist-list-pane .playlist-context-top .playlist-context-item[open] .playlist-context-summary {
  border-bottom: 0;
}

.playlist-list-pane .playlist-context-top .playlist-context-summary .expansion-panel-dsc-question,
.playlist-list-pane .playlist-context-top .playlist-context-summary .cooldrama-fqa-question,
.playlist-list-pane .playlist-context-top .playlist-context-summary .playlist-context-question {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.playlist-list-pane .playlist-context-top .playlist-context-icon {
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 0;
}

.playlist-list-pane .playlist-context-top .playlist-context-icon .material-icons {
  font-size: 1.25rem;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer {
  padding: 0.95rem 1rem 1rem;
  min-width: 0;
  max-width: 100%;
  border: 0;
  border-top: 0;
  font-size: 0.95rem;
  color: var(--pl-text);
  line-height: 1.6;
  overflow-x: hidden;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer :is(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 0.375rem;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--pl-text);
}

.playlist-list-pane .playlist-context-top .playlist-context-answer p {
  margin: 0;
  font-size: 0.95rem;
  color: var(--pl-text);
  line-height: 1.65;
  overflow-wrap: anywhere;
  word-break: break-word;
  max-height: min(28vh, 14rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-right: 0.25rem;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer p + p {
  margin-top: 0.75rem;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer a {
  color: var(--playlist-color);
  text-decoration: none;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer :is(code, pre, span, strong, em) {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer pre {
  white-space: pre-wrap;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer * {
  max-width: 100%;
  box-sizing: border-box;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer :is(img, video, iframe, table, svg, canvas) {
  max-width: 100%;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer table {
  display: block;
  overflow-x: auto;
}

.playlist-list-pane .playlist-context-top .playlist-context-answer a:hover {
  text-decoration: underline;
}

.playlist-list {
  margin: 0;
  padding: 0.35rem 1rem 1rem;
  list-style: none;
  flex: 0 1 auto;
  min-height: 0;
  max-height: none;
  overflow: auto;
}

@media (max-width: 640px) {
  .playlist-list-meta {
    padding: 0.5rem 0.75rem 0.2rem;
    font-size: 0.75rem;
    line-height: 1.2;
    column-gap: 0.95rem;
    row-gap: 0.15rem;
  }
  .playlist-list-total {
    padding: 0.625rem 0.75rem;
    font-size: 0.75rem;
    line-height: 1.2;
  }
  .playlist-post-title.wp-block-post-title,
  .playlist-list-pane > .playlist-post-title {
    padding: 1.1rem 0.85rem 0.9rem;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.25;
  }
  .playlist-server-switch,
  .episode-tab-navigation,
  .switch-server-container {
    padding: 0.625rem;
  }

  .playlist-list-pane .playlist-context-top {
    padding: 0 0.35rem !important;
    max-height: min(32vh, 220px);
  }

  .playlist-list-pane .playlist-context-top .playlist-context-summary {
    padding: 0.8rem 0.85rem;
    font-size: 0.9rem;
  }

  .playlist-list-pane .playlist-context-top .playlist-context-icon {
    width: auto;
    height: auto;
  }

  .playlist-list-pane .playlist-context-top .playlist-context-icon .material-icons {
    font-size: 1.2rem;
  }

  .playlist-list-pane .playlist-context-top .playlist-context-answer {
    padding: 0.8rem 0.85rem 0.9rem;
  }

  .playlist-list-pane .playlist-context-top .playlist-context-answer :is(h1, h2, h3, h4, h5, h6) {
    font-size: 0.95rem;
  }

  .playlist-list-pane .playlist-context-top .playlist-context-answer p {
    font-size: 0.875rem;
    max-height: min(24vh, 10rem);
  }
}

.playlist-list::-webkit-scrollbar {
  width: 0.25rem;
}

.playlist-list::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 0.625rem;
}

.playlist-list::-webkit-scrollbar-thumb {
  background: var(--playlist-color);
  border-radius: 0.625rem;
}

.playlist-item {
  border: 0;
  display: flex;
}

.episode-list {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: center;
  gap: 0.5rem;
}

.layout-horizontal .episode-list {
  justify-content: center;
}

.episode-list .episode-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border: 0;
  padding: 0.625rem;
  overflow: hidden;
  font-family: var(--playlist-font);
  font-size: 1rem;
  font-weight: 500;
  background: transparent;
  border: 1px solid var(--pl-surface-border);
  color: var(--pl-text);
  text-align: center;
  cursor: pointer;
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  border-radius: 0.25rem;
  min-height: 42px;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.episode-list .episode-item::before {
  content: attr(data-episode-number);
}

.episode-list .episode-item.active {
  background: transparent;
  border-color: var(--pl-surface-border-hover);
  color: var(--cooldrama-theme-panel-text);
  transform: translateY(-1px);
}

.episode-list .episode-item:hover {
  background: var(--pl-surface-soft-hover);
  border-color: var(--pl-surface-border-hover);
  color: var(--playlist-color);
  transform: translateY(-1px);
}

.episode-list .episode-item:focus-visible {
  background: var(--pl-surface-soft-hover);
  border-color: var(--cooldrama-focus-ring);
  color: var(--cooldrama-theme-soft-active-text);
  transform: translateY(-1px);
}

@media (min-width: 62rem) {
  html.cooldrama-remote-nav-active .site-header .cooldrama-header-nav .wp-block-navigation-item__content,
  html.cooldrama-remote-nav-active .site-header .cooldrama-search-nav-trigger,
  html.cooldrama-remote-nav-active .site-header .cooldrama-theme-menu-toggle,
  html.cooldrama-remote-nav-active .site-header .cooldrama-auth-nav-item > a,
  html.cooldrama-remote-nav-active .cooldrama-header-nav .cooldrama-theme-option,
  html.cooldrama-remote-nav-active .episode-list .episode-item,
  html.cooldrama-remote-nav-active .embla__prev,
  html.cooldrama-remote-nav-active .embla__next {
    min-height: 2.75rem;
  }

  html.cooldrama-remote-nav-active .episode-list {
    gap: 0.65rem;
  }
}

div[data-cc-icon="true"] .episode-list .episode-item.has-cc::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.has-cc::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0.125rem;
  z-index: 5;
  width: 0.875rem;
  height: 0.875rem;
  -webkit-mask: var(--icon-cc-episode);
  mask: var(--icon-cc-episode);
  background: var(--pl-text);
  opacity: 0.85;
}

div[data-cc-icon="true"] .episode-list .episode-item.uc::after,
div[data-cc-icon="true"] .episode-list .episode-item.uc[data-animation-icon="true"]::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.uc::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.uc[data-animation-icon="true"]::after,
.episode-list .episode-item.uc::after,
.episode-list .episode-item.uc[data-animation-icon="true"]::after {
  content: "";
  position: absolute;
  top: 0.125rem;
  right: 0.125rem;
  z-index: 5;
  width: 0.75rem;
  height: 0.75rem;
  -webkit-mask: var(--icon-clock);
  mask: var(--icon-clock);
  background: var(--pl-text);
  opacity: 0.85;
}

div[data-cc-icon="true"] .episode-list .episode-item.uc[data-animation-icon="true"]::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.uc[data-animation-icon="true"]::after,
.episode-list .episode-item.uc[data-animation-icon="true"]::after {
  -webkit-mask: var(--icon-clock-animation);
  mask: var(--icon-clock-animation);
}

div[data-cc-icon="true"] .episode-list .episode-item.has-cc.active::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.has-cc.active::after,
div[data-cc-icon="true"] .episode-list .episode-item.has-cc:hover::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.has-cc:hover::after {
  background: var(--cooldrama-theme-soft-active-text);
  opacity: 0.96;
}

div[data-cc-icon="true"] .episode-list .episode-item.uc.active::after,
div[data-has-server-cc-icon="true"] .episode-list .episode-item.uc.active::after,
.episode-list .episode-item.uc.active::after {
  -webkit-mask: var(--icon-clock-animation);
  mask: var(--icon-clock-animation);
  background: var(--cooldrama-theme-soft-active-text);
  opacity: 0.96;
}

.playlist-empty {
  grid-column: 1 / -1;
  padding: 14px 2px;
  color: var(--pl-muted);
  font-size: 14px;
}

@media (max-width: 980px) {
  .playlist-body {
    grid-template-columns: 1fr;
  }

  .playlist-player-pane {
    border-right: 0;
    border-bottom: 1px solid var(--pl-border);
  }

  .playlist-list-pane,
  .episode-tab-section {
    overflow: hidden;
  }

  .playlist-list {
    flex: 1 1 auto;
    max-height: 300px;
    padding: 0.25rem 0.75rem 0.85rem;
  }

  .episode-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .playlist-fallback-overlay {
    padding: 0.95rem;
  }

  .playlist-fallback-copy {
    gap: 0.35rem;
    width: 100%;
    max-width: 16rem;
  }

  .playlist-fallback-status {
    min-height: 1.75rem;
    padding: 0.3rem 0.68rem;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
  }

  .playlist-fallback-title {
    font-size: 1.08rem;
    line-height: 1.18;
  }

  .playlist-fallback-message {
    font-size: 0.98rem;
  }

  .playlist-fallback-detail {
    font-size: 0.78rem;
    line-height: 1.45;
  }
}

@media (max-width: 640px) {
  .episode-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.jwplayer.jw-skin-cs.jw-state-buffering .jw-display-icon-display .jw-icon .jw-svg-icon-buffer,
.loader-circle .jw-svg-icon-buffer {
  animation: jw-buffer-spin 0.9s linear infinite !important;
  transform-origin: 50% 50%;
  will-change: transform;
}

@keyframes jw-buffer-spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.jw-progress,
.lds-ellipsis div {
  background: var(--jw-progress-color) !important;
}
.jw-buffer {
  background-color: var(--jw-buffer-color) !important;
}
.jwplayer.jw-skin-cs .jw-time-tip {
  word-break: normal;
}
.jwplayer.jw-skin-cs .jw-settings-content-item {
  font-family: var(--wp--preset--font-family--primary-font);
}
.jwplayer.jw-skin-cs .jw-text-track-display,
.jwplayer.jw-skin-cs .jw-text-track-display .jw-reset,
.jwplayer.jw-skin-cs .jw-text-track-display .jw-text-track-cue {
  font-family: var(--jw-caption-font-family);
  font-weight: 600;
  background-color: transparent;
  text-shadow:
    -1px -1px 0 rgb(0, 0, 0),
    0 -1px 0 rgb(0, 0, 0),
    1px -1px 0 rgb(0, 0, 0),
    1px 0 0 rgb(0, 0, 0),
    1px 1px 0 rgb(0, 0, 0),
    0 1px 0 rgb(0, 0, 0),
    -1px 1px 0 rgb(0, 0, 0),
    -1px 0 0 rgb(0, 0, 0) !important;
}
.jwplayer.jw-skin-cs .jw-icon-rewind.invisible,
.jwplayer.jw-skin-cs .jw-icon-forward.invisible,
.jwplayer.jw-skin-cs .jw-icon-pip,
.jwplayer.jw-skin-cs.jw-breakpoint-1 .jw-controlbar .jw-button-container > .jw-icon-forward,
.jwplayer.jw-skin-cs.jw-flag-small-player .jw-controlbar .jw-button-container > .jw-icon-forward,
.jwplayer.jw-skin-cs.jw-flag-live .jw-icon-forward {
  display: none !important;
}

.jwplayer.jw-skin-cs .playlist-jw-forward-bar {
  display: inline-flex !important;
}

.jwplayer.jw-skin-cs .playlist-jw-forward-display {
  display: none !important;
}
.jwplayer.jw-skin-cs.jw-flag-live .jw-display-icon-next {
  visibility: hidden;
}
.jwplayer.jw-skin-cs.jw-breakpoint-1 .jw-display .jw-svg-icon-rewind,
.jwplayer.jw-skin-cs.jw-breakpoint-1 .jw-display .jw-svg-icon-forward {
  width: 2.5rem;
  height: 2.5rem;
  line-height: 2.5rem;
}
.jw-svg-icon-buffer path {
  display: none !important;
}
.jwplayer.jw-skin-cs .jw-svg-icon-buffer path,
.jwplayer.jw-skin-cs .jw-svg-icon-play path,
.jwplayer.jw-skin-cs .jw-svg-icon-rewind path,
.jwplayer.jw-skin-cs .jw-svg-icon-forward path,
.jwplayer.jw-skin-cs .jw-svg-icon-volume-0 path,
.jwplayer.jw-skin-cs .jw-svg-icon-volume-50 path,
.jwplayer.jw-skin-cs .jw-svg-icon-volume-100 path,
.jwplayer.jw-skin-cs .jw-svg-icon-cc-on path,
.jwplayer.jw-skin-cs .jw-svg-icon-cc-off path,
.jwplayer.jw-skin-cs .jw-svg-icon-settings path,
.jwplayer.jw-skin-cs .jw-svg-icon-fullscreen-on path,
.jwplayer.jw-skin-cs .jw-svg-icon-fullscreen-off path,
.jwplayer.jw-skin-cs .jw-svg-icon-quality-100 path,
.jwplayer.jw-skin-cs .jw-svg-icon-audio-tracks path {
  display: none;
}
.jwplayer.jw-skin-cs .jw-svg-icon-buffer {
  background-image: var(
    --jw-buffer-icon-image,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z' opacity='0.5'/%3E%3Cpath fill='%23fff' d='M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z'/%3E%3C/svg%3E")
  );
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  width: 4.75rem !important;
  height: 4.75rem !important;
}

/* Keep custom overlay loader SVG paths visible despite global hide rules. */
.loader-circle .jw-svg-icon-buffer path {
  display: block !important;
}
.jwplayer.jw-skin-cs.jw-state-idle .jw-display-icon-display,
.jwplayer.jw-skin-cs.jw-state-paused .jw-display-icon-display,
.jwplayer.jw-skin-cs.jw-state-complete .jw-display-icon-display {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.jwplayer.jw-skin-cs.jw-state-idle .jw-display-icon-container,
.jwplayer.jw-skin-cs.jw-state-paused .jw-display-icon-container,
.jwplayer.jw-skin-cs.jw-state-complete .jw-display-icon-container {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.jwplayer.jw-skin-cs.jw-state-playing .jw-display-icon-display,
.jwplayer.jw-skin-cs.jw-state-buffering .jw-display-icon-display {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.jwplayer.jw-skin-cs.jw-state-playing .jw-display-icon-container,
.jwplayer.jw-skin-cs.jw-state-buffering .jw-display-icon-container {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.jwplayer.jw-skin-cs.jw-state-idle .jw-icon-display .jw-svg-icon-play,
.jwplayer.jw-skin-cs.jw-state-paused .jw-icon-display .jw-svg-icon-play,
.jwplayer.jw-skin-cs.jw-state-complete .jw-icon-display .jw-svg-icon-play {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10' clip-rule='evenodd' opacity='0.35'/%3E%3Cpath fill='%23fff' d='m15.414 13.059l-4.72 2.787C9.934 16.294 9 15.71 9 14.786V9.214c0-.924.934-1.507 1.694-1.059l4.72 2.787c.781.462.781 1.656 0 2.118'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
  transition: transform 0.2s ease;
}
.jwplayer.jw-skin-cs.jw-state-idle .jw-icon-display:hover .jw-svg-icon-play,
.jwplayer.jw-skin-cs.jw-state-paused .jw-icon-display:hover .jw-svg-icon-play,
.jwplayer.jw-skin-cs.jw-state-complete .jw-icon-display:hover .jw-svg-icon-play {
  transform: scale(1.1);
}
.jwplayer.jw-skin-cs .jw-svg-icon-play {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36'%3E%3Cpath fill='%23fff' d='M32.16 16.08L8.94 4.47A2.07 2.07 0 0 0 6 6.32v23.21a2.06 2.06 0 0 0 3 1.85l23.16-11.61a2.07 2.07 0 0 0 0-3.7Z' class='clr-i-solid clr-i-solid-path-1'/%3E%3Cpath fill='none' d='M0 0h36v36H0z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs:not(.jw-state-idle) .jw-icon-display:hover .jw-svg-icon-play,
.jwplayer.jw-skin-cs:not(.jw-state-idle) .jw-icon-display:focus .jw-svg-icon-play,
.jwplayer.jw-skin-cs .jw-icon-playback:hover .jw-svg-icon-play,
.jwplayer.jw-skin-cs .jw-icon-playback:focus .jw-svg-icon-play {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-rewind {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M11.99 5V2.21c0-.45-.54-.67-.85-.35L7.35 5.65c-.2.2-.2.51 0 .71l3.79 3.79a.5.5 0 0 0 .85-.35V7c3.73 0 6.68 3.42 5.86 7.29c-.47 2.27-2.31 4.1-4.57 4.57c-3.57.75-6.75-1.7-7.23-5.01a.984.984 0 0 0-.98-.85c-.6 0-1.08.53-1 1.13c.62 4.39 4.8 7.64 9.53 6.72c3.12-.61 5.63-3.12 6.24-6.24c.99-5.13-2.9-9.61-7.85-9.61m-1.1 11h-.85v-3.26l-1.01.31v-.69l1.77-.63h.09zm4.28-1.76c0 .32-.03.6-.1.82s-.17.42-.29.57s-.28.26-.45.33s-.37.1-.59.1s-.41-.03-.59-.1s-.33-.18-.46-.33s-.23-.34-.3-.57s-.11-.5-.11-.82v-.74c0-.32.03-.6.1-.82s.17-.42.29-.57s.28-.26.45-.33s.37-.1.59-.1s.41.03.59.1s.33.18.46.33s.23.34.3.57s.11.5.11.82zm-.85-.86c0-.19-.01-.35-.04-.48s-.07-.23-.12-.31s-.11-.14-.19-.17s-.16-.05-.25-.05s-.18.02-.25.05s-.14.09-.19.17s-.09.18-.12.31s-.04.29-.04.48v.97c0 .19.01.35.04.48s.07.24.12.32s.11.14.19.17s.16.05.25.05s.18-.02.25-.05s.14-.09.19-.17s.09-.19.11-.32s.04-.29.04-.48v-.97z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-rewind:hover .jw-svg-icon-rewind,
.jwplayer.jw-skin-cs .jw-icon-rewind:focus .jw-svg-icon-rewind {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-forward {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M18.92 13c-.5 0-.91.37-.98.86a6.006 6.006 0 0 1-7.42 4.96c-2.25-.54-3.91-2.27-4.39-4.53A6.014 6.014 0 0 1 12 7v2.79c0 .45.54.67.85.35l3.79-3.79c.2-.2.2-.51 0-.71l-3.79-3.79a.5.5 0 0 0-.85.36V5c-4.94 0-8.84 4.48-7.84 9.6c.6 3.11 2.9 5.5 5.99 6.19c4.83 1.08 9.15-2.2 9.77-6.67c.09-.59-.4-1.12-1-1.12m-8.02 3v-4.27h-.09l-1.77.63v.69l1.01-.31V16zm3.42-4.22c-.18-.07-.37-.1-.59-.1s-.41.03-.59.1s-.33.18-.45.33s-.23.34-.29.57s-.1.5-.1.82v.74c0 .32.04.6.11.82s.17.42.3.57s.28.26.46.33s.37.1.59.1s.41-.03.59-.1s.33-.18.45-.33s.22-.34.29-.57s.1-.5.1-.82v-.74c0-.32-.04-.6-.11-.82s-.17-.42-.3-.57s-.29-.26-.46-.33m.01 2.57c0 .19-.01.35-.04.48s-.06.24-.11.32s-.11.14-.19.17s-.16.05-.25.05s-.18-.02-.25-.05s-.14-.09-.19-.17s-.09-.19-.12-.32s-.04-.29-.04-.48v-.97c0-.19.01-.35.04-.48s.06-.23.12-.31s.11-.14.19-.17s.16-.05.25-.05s.18.02.25.05s.14.09.19.17s.09.18.12.31s.04.29.04.48v.97z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-display:hover .jw-svg-icon-forward,
.jwplayer.jw-skin-cs .jw-icon-display:focus .jw-svg-icon-forward,
.jwplayer.jw-skin-cs .jw-icon-forward:hover .jw-svg-icon-forward,
.jwplayer.jw-skin-cs .jw-icon-forward:focus .jw-svg-icon-forward {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-volume-0 {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M1.5 11h3l2.586 2.586a1.414 1.414 0 0 0 2.414-1V3.414a1.414 1.414 0 0 0-2.414-1L4.5 5h-3A1.5 1.5 0 0 0 0 6.5v3A1.5 1.5 0 0 0 1.5 11m10.78-5.28a.75.75 0 1 0-1.06 1.06L12.44 8l-1.22 1.22a.75.75 0 1 0 1.06 1.06l1.22-1.22l1.22 1.22a.75.75 0 1 0 1.06-1.06L14.56 8l1.22-1.22a.75.75 0 0 0-1.06-1.06L13.5 6.94z' clip-rule='evenodd'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-volume:hover .jw-svg-icon-volume-0,
.jwplayer.jw-skin-cs .jw-icon-volume:focus .jw-svg-icon-volume-0 {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-volume-50 {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M1.5 11h3l2.586 2.586a1.414 1.414 0 0 0 2.414-1V3.414a1.414 1.414 0 0 0-2.414-1L4.5 5h-3A1.5 1.5 0 0 0 0 6.5v3A1.5 1.5 0 0 0 1.5 11m10.525-.032c-.247.333-.727.33-1.02.037c-.293-.292-.284-.764-.06-1.112A3.5 3.5 0 0 0 11.5 8c0-.697-.204-1.346-.555-1.892c-.224-.348-.233-.82.06-1.113s.773-.296 1.02.038C12.638 5.863 13 6.889 13 8a4.98 4.98 0 0 1-.975 2.968' clip-rule='evenodd'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-volume:hover .jw-svg-icon-volume-50,
.jwplayer.jw-skin-cs .jw-icon-volume:focus .jw-svg-icon-volume-50 {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-volume-100 {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg clip-path='url(%23SVGFd4lJeyK)'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M1.5 11h3l2.586 2.586a1.414 1.414 0 0 0 2.414-1V3.414a1.414 1.414 0 0 0-2.414-1L4.5 5h-3A1.5 1.5 0 0 0 0 6.5v3A1.5 1.5 0 0 0 1.5 11m12.662 2.103c-.265.319-.743.317-1.036.024c-.292-.293-.288-.766-.031-1.09A6.47 6.47 0 0 0 14.5 8a6.47 6.47 0 0 0-1.405-4.036c-.257-.325-.261-.797.032-1.09c.292-.293.77-.295 1.035.024A7.97 7.97 0 0 1 16 8c0 1.94-.69 3.718-1.838 5.103m-2.138-2.135c-.246.333-.726.33-1.019.037c-.293-.292-.284-.764-.06-1.112A3.5 3.5 0 0 0 11.5 8c0-.697-.204-1.346-.555-1.892c-.224-.348-.233-.82.06-1.113s.773-.296 1.02.038C12.638 5.863 13 6.889 13 8a4.98 4.98 0 0 1-.976 2.968' clip-rule='evenodd'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='SVGFd4lJeyK'%3E%3Cpath fill='%23fff' d='M0 0h16v16H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/g%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-volume:hover .jw-svg-icon-volume-100,
.jwplayer.jw-skin-cs .jw-icon-volume:focus .jw-svg-icon-volume-100 {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-cc-on {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2m-9 6H8v4h3v2H8c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3zm7 0h-3v4h3v2h-3c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-cc:hover .jw-svg-icon-cc-on,
.jwplayer.jw-skin-cs .jw-icon-cc:focus .jw-svg-icon-cc-on {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-cc-off {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6 10v4c0 1.103.897 2 2 2h3v-2H8v-4h3V8H8c-1.103 0-2 .897-2 2m7 0v4c0 1.103.897 2 2 2h3v-2h-3v-4h3V8h-3c-1.103 0-2 .897-2 2'/%3E%3Cpath fill='%23fff' d='M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2M4 18V6h16l.002 12z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-cc:hover .jw-svg-icon-cc-off,
.jwplayer.jw-skin-cs .jw-icon-cc:focus .jw-svg-icon-cc-off,
.jwplayer.jw-skin-cs .jw-settings-captions:hover .jw-svg-icon-cc-off,
.jwplayer.jw-skin-cs .jw-settings-captions:focus .jw-svg-icon-cc-off {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-settings {
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 15.5A3.5 3.5 0 0 1 8.5 12A3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5a3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97s-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1s.03.65.07.97l-2.11 1.66c-.19.15-.25.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-settings:hover .jw-svg-icon-settings,
.jwplayer.jw-skin-cs .jw-icon-settings:focus .jw-svg-icon-settings {
  background: var(--wp--preset--color--accent-color);
}

.jwplayer.jw-skin-cs .jw-reset-text.jw-tooltip.jw-tooltip-settings {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.jwplayer.jw-skin-cs .jw-svg-icon-fullscreen-on {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23fff' d='M18.5 5.5H16a1.5 1.5 0 0 1 0-3h3A2.5 2.5 0 0 1 21.5 5v3a1.5 1.5 0 0 1-3 0zM8 5.5H5.5V8a1.5 1.5 0 1 1-3 0V5A2.5 2.5 0 0 1 5 2.5h3a1.5 1.5 0 1 1 0 3m0 13H5.5V16a1.5 1.5 0 0 0-3 0v3A2.5 2.5 0 0 0 5 21.5h3a1.5 1.5 0 0 0 0-3m8 0h2.5V16a1.5 1.5 0 0 1 3 0v3a2.5 2.5 0 0 1-2.5 2.5h-3a1.5 1.5 0 0 1 0-3'/%3E%3C/g%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-fullscreen:hover .jw-svg-icon-fullscreen-on,
.jwplayer.jw-skin-cs .jw-icon-fullscreen:focus .jw-svg-icon-fullscreen-on {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-fullscreen-off {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23fff' d='M17.5 6.5H20a1.5 1.5 0 0 1 0 3h-3A2.5 2.5 0 0 1 14.5 7V4a1.5 1.5 0 0 1 3 0zM4 6.5h2.5V4a1.5 1.5 0 1 1 3 0v3A2.5 2.5 0 0 1 7 9.5H4a1.5 1.5 0 1 1 0-3m0 11h2.5V20a1.5 1.5 0 0 0 3 0v-3A2.5 2.5 0 0 0 7 14.5H4a1.5 1.5 0 0 0 0 3m16 0h-2.5V20a1.5 1.5 0 0 1-3 0v-3a2.5 2.5 0 0 1 2.5-2.5h3a1.5 1.5 0 0 1 0 3'/%3E%3C/g%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-icon-fullscreen:hover .jw-svg-icon-fullscreen-off,
.jwplayer.jw-skin-cs .jw-icon-fullscreen:focus .jw-svg-icon-fullscreen-off {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-quality-100 {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M13.354 8.75H4a.75.75 0 0 1 0-1.5h9.354a2.751 2.751 0 0 1 5.293 0H20a.75.75 0 0 1 0 1.5h-1.354a2.751 2.751 0 0 1-5.292 0M14.75 8a1.25 1.25 0 1 1 2.5 0a1.25 1.25 0 0 1-2.5 0m-4.103 8.75H20a.75.75 0 0 0 0-1.5h-9.353a2.751 2.751 0 0 0-5.293 0H4a.75.75 0 0 0 0 1.5h1.354a2.751 2.751 0 0 0 5.292 0M6.75 16a1.25 1.25 0 1 1 2.5 0a1.25 1.25 0 0 1-2.5 0' clip-rule='evenodd'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-settings-quality:hover .jw-svg-icon-quality-100,
.jwplayer.jw-skin-cs .jw-settings-quality:focus .jw-svg-icon-quality-100 {
  background: var(--wp--preset--color--accent-color);
}
.jwplayer.jw-skin-cs .jw-svg-icon-audio-tracks {
  mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 256 256'%3E%3Cpath fill='%23fff' d='M49.3 201.4v5.2C27.6 206.7 10 189 10 167.3c0-5.8 1.3-11.2 3.4-16.2C11.2 143.8 10 136 10 128c0-43.4 35.2-78.7 78.7-78.7 43.4 0 78.6 35.2 78.6 78.7 0 8.1-1.2 15.8-3.4 23.2 2.2 4.9 3.4 10.4 3.4 16.2 0 21.7-17.6 39.3-39.3 39.3V128c9.8 0 18.7 3.5 25.6 9.4.4-3.1.7-6.2.7-9.4 0-36.2-29.4-65.6-65.5-65.6S23.1 91.8 23.1 128c0 3.2.2 6.3.6 9.4 6.9-5.9 15.8-9.4 25.6-9.4zM154.2 49.3v26.2H246V49.3zm26.3 39.4v26.2H246V88.7zm13.1 39.3v26.2H246V128z'/%3E%3C/svg%3E")
    no-repeat center / contain;
  background: currentColor;
}
.jwplayer.jw-skin-cs .jw-settings-audioTracks:hover .jw-svg-icon-audio-tracks,
.jwplayer.jw-skin-cs .jw-settings-audioTracks:focus .jw-svg-icon-audio-tracks {
  background: var(--wp--preset--color--accent-color);
}

.jw-slider-horizontal.jw-chapter-slider-time .jw-slider-container .jw-timesegment-resetter {
  height: 2px !important;
  background: linear-gradient(to right, transparent 75%, var(--jw-icon-color) 10%);
  background-size: 6px 10px, 100% 10px;
  transform: none !important;
}
.jw-slider-horizontal.jw-chapter-slider-time .jw-slider-container .jw-timesegment-background {
  background-color: rgb(0 0 0 / 0%) !important;
}
#jw-cs-playlist .jw-slider-time .jw-buffer {
  background-color: var(--jw-buffer-color) !important;
}

/* Imported JW loading/control theme patch */
.jwplayer.jw-state-playing:hover .jw-controls {
  opacity: 1 !important;
  visibility: visible !important;
}

.jwplayer .jw-controls {
  transition: opacity 120ms ease;
}

.jw-icon.jw-icon-inline.jw-button-color.jw-reset.jw-icon-pip {
  display: none !important;
}

.jw-logo {
  width: 100px !important;
  height: 41px !important;
}

.jw-text-track-cue.jw-reset {
  font-family: var(--jw-caption-font-family, "Inter", "Battambang", sans-serif) !important;
  font-weight: 700 !important;
  font-style: normal !important;
}

.jw-button-color {
  color: var(--jw-icon-color) !important;
}

.jw-knob {
  width: 7px !important;
  height: 7px !important;
}

.jw-flag-dragging .jw-slider-time .jw-knob,
.jw-icon-volume:active .jw-slider-volume .jw-knob,
.jw-slider-time:active .jw-knob,
.jw-slider-time:focus .jw-knob {
  box-shadow: 0 0 0 6px var(--jw-knob-shadow-color) !important;
}

.jw-volume-tip {
  padding: 16px 0;
  max-width: 50px;
  margin: 0 auto;
}

.jw-settings-menu {
  background: var(--jw-menu-bg) !important;
  border-radius: 5px;
}

.jw-settings-content-item {
  font-size: 15px !important;
}

.jw-button-color.jw-toggle.jw-off:active:not(.jw-icon-cast),
.jw-button-color.jw-toggle.jw-off:focus:not(.jw-icon-cast),
.jw-button-color.jw-toggle.jw-off:hover:not(.jw-icon-cast),
.jw-button-color:active:not(.jw-icon-cast),
.jw-button-color:focus:not(.jw-icon-cast),
.jw-button-color:hover:not(.jw-icon-cast),
.jw-button-color[aria-expanded="true"]:not(.jw-icon-cast),
.jw-settings-content-item.jw-settings-item-active,
.jw-settings-menu .jw-icon.jw-button-color[aria-checked="true"] .jw-svg-icon {
  fill: var(--jw-icon-active-color) !important;
  color: var(--jw-icon-active-color) !important;
  background-color: transparent !important;
}

.jw-progress,
.lds-ellipsis div {
  background: var(--jw-progress-color) !important;
  background-image: none !important;
}

.jw-horizontal-volume-container .jw-buffer,
.jw-slider-time .jw-buffer {
  background-color: rgba(255, 255, 255, 0.2) !important;
}

.jw-rightclick {
  display: none !important;
}

/* Unified JW palette controls: change only these vars in :root. */
.jwplayer .jw-button-color,
.jwplayer .jw-icon.jw-button-color .jw-svg-icon,
.jwplayer .jw-icon-inline.jw-button-color .jw-svg-icon {
  color: var(--jw-icon-color) !important;
}

.jwplayer .jw-button-color.jw-toggle.jw-off:active:not(.jw-icon-cast),
.jwplayer .jw-button-color.jw-toggle.jw-off:focus:not(.jw-icon-cast),
.jwplayer .jw-button-color.jw-toggle.jw-off:hover:not(.jw-icon-cast),
.jwplayer .jw-button-color:active:not(.jw-icon-cast),
.jwplayer .jw-button-color:focus:not(.jw-icon-cast),
.jwplayer .jw-button-color:hover:not(.jw-icon-cast),
.jwplayer .jw-button-color[aria-expanded="true"]:not(.jw-icon-cast),
.jwplayer .jw-settings-content-item.jw-settings-item-active {
  color: var(--jw-icon-active-color) !important;
}

.jwplayer .jw-button-color.jw-toggle:not(.jw-icon-cast) {
  color: var(--jw-icon-color) !important;
  fill: var(--jw-icon-color) !important;
}

/* Legacy container compatibility block (scoped) */
:is(.playlist-root, #video-playlist, #embed-player) .toggle-upcoming {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.25rem;
  background: rgba(255, 255, 255, 0.24);
  cursor: pointer;
  outline: 0;
  border: 0;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
  border-radius: 0.25rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .toggle-upcoming svg {
  width: 1.25rem;
  height: 1.25rem;
  color: var(--white-color);
  transition: all 0.17s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .toggle-upcoming:hover svg {
  color: var(--playlist-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .upcoming-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  place-content: center;
  gap: 1.5rem;
  padding: 1rem;
  -webkit-user-select: none;
  user-select: none;
  -webkit-backdrop-filter: blur(0.25rem);
  backdrop-filter: blur(0.25rem);
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .upcoming-overlay.invisible {
  visibility: hidden;
  opacity: 0;
}

:is(.playlist-root, #video-playlist, #embed-player) .upcoming-episode {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-family: var(--playlist-font);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--white-color);
  text-align: center;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 1);
}

:is(.playlist-root, #video-playlist, #embed-player) .upcoming-episode .episode-title {
  letter-spacing: 0.125rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .upcoming-episode .episode-status {
  letter-spacing: 0.25rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .countdown-episode {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: 1.5rem 0 0;
  font-family: var(--playlist-font);
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--playlist-color);
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 1);
  border-top: 1px solid var(--border-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .countdown-episode.expired {
  color: #34a853;
  line-height: 1.6;
}

:is(.playlist-root, #video-playlist, #embed-player) .countdown-episode .time-segment {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .countdown-timer,
:is(.playlist-root, #video-playlist, #embed-player) .skip-ad {
  position: absolute;
  bottom: 20%;
  right: 2rem;
  z-index: 1;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0.75rem;
  font-family: var(--playlist-font);
  font-size: 0.875rem;
  font-weight: 400;
  background: rgba(0, 0, 0, 0.65);
  color: var(--white-color);
  -webkit-user-select: none;
  user-select: none;
  border-radius: 0.25rem;
  transition: all 0.17s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .skip-ad {
  cursor: pointer;
  border: 0;
  outline: none;
}

:is(.playlist-root, #video-playlist, #embed-player) .countdown-timer.show,
:is(.playlist-root, #video-playlist, #embed-player) .skip-ad.show {
  display: flex;
}

:is(.playlist-root, #video-playlist, #embed-player) .skip-ad .next-ad {
  margin: 0 -0.25rem 0 -0.125rem;
}

:is(.playlist-root, #video-playlist, #embed-player) .skip-ad:hover {
  color: var(--playlist-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .click-ad {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -webkit-tap-highlight-color: transparent;
}

:is(.playlist-root, #video-playlist, #embed-player) .loader-ad {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

:is(.playlist-root, #video-playlist, #embed-player) .loader-ad.invisible {
  display: none;
}

:is(.playlist-root, #video-playlist, #embed-player) .loader-ad svg {
  width: 1.5rem;
  height: 1.5rem;
  color: var(--playlist-color);
  animation: rotate 2s linear infinite;
}

:is(.playlist-root, #video-playlist, #embed-player) .loader-ad circle {
  animation: dash 1.5s ease-in-out infinite;
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}

:is(.playlist-root, #video-playlist, #embed-player) .loading-overlay {
  position: absolute;
  inset: 0;
  z-index: 5;
  width: 100%;
  height: 100%;
  background: #000;
}

:is(.playlist-root, #video-playlist, #embed-player) .loading-overlay.invisible {
  display: none;
}

:is(.playlist-root, #video-playlist, #embed-player) .control-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 1.5rem;
  border-top: 1px solid var(--border-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .control-container .scroll-up,
:is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-previous,
:is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-counter,
:is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-next,
:is(.playlist-root, #video-playlist, #embed-player) .control-container .scroll-down {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  line-height: 2.5rem;
  padding: 0 0.75rem;
  overflow: hidden;
  font-family: var(--playlist-font);
  font-size: 0.875rem;
  font-weight: 700;
  background: var(--pl-surface-soft);
  border: 1px solid var(--pl-surface-border);
  color: var(--pl-text);
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: none;
  border-radius: 0.25rem;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .control-container button {
  outline: none;
  border: 0;
  transition: all 0.35s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .control-container button:hover {
  background: var(--pl-surface-soft-hover);
  border-color: var(--pl-surface-border-hover);
  color: var(--playlist-color);
}

:is(.playlist-root, #video-playlist, #embed-player) .switch-server {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 1.5rem 0;
}

:is(.playlist-root, #video-playlist, #embed-player) .switch-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.75rem 2rem;
  font-family: var(--playlist-font);
  font-size: 1rem;
  font-weight: 600;
  background: var(--playlist-color);
  color: var(--white-color);
  text-align: center;
  cursor: pointer;
  border: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
  transition: all 0.65s ease;
}

:is(.playlist-root, #video-playlist, #embed-player) .switch-btn:hover {
  background: var(--primary-dark-color);
}

@media (max-width: 30rem) {
  :is(.playlist-root, #video-playlist, #embed-player) .toggle-upcoming {
    top: 0.75rem;
    right: 0.75rem;
  }

  :is(.playlist-root, #video-playlist, #embed-player) .countdown-episode {
    gap: 1rem;
    padding: 0;
    font-size: 0.875rem;
    border-top: 0;
  }
}

.jw-collector-panel,
.jw-collector-panel * {
  box-sizing: border-box;
}

.jw-collector-panel {
  position: fixed;
  right: 12px;
  bottom: 12px;
  z-index: 2147483640;
  width: min(460px, calc(100vw - 24px));
  max-height: min(75vh, 760px);
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 10px;
  background: rgba(7, 10, 17, 0.9);
  backdrop-filter: blur(8px);
  color: #e8ecf3;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
}

.jw-collector-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.jw-collector-title {
  font-size: 12px;
  letter-spacing: 0.2px;
  opacity: 0.95;
}

.jw-collector-controls {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.jw-collector-btn {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.06);
  color: #f1f4fa;
  font-size: 11px;
  line-height: 1;
  padding: 7px 9px;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.06s ease;
}

.jw-collector-btn:hover {
  background: rgba(64, 136, 255, 0.22);
  border-color: rgba(102, 166, 255, 0.65);
}

.jw-collector-btn:active {
  transform: translateY(1px);
}

.jw-collector-btn:focus-visible {
  outline: 2px solid #6ea8ff;
  outline-offset: 1px;
}

.jw-collector-meta {
  font-size: 11px;
  line-height: 1.4;
  color: #c4d0e4;
  border-top: 1px dashed rgba(255, 255, 255, 0.14);
  border-bottom: 1px dashed rgba(255, 255, 255, 0.14);
  padding: 6px 0;
  overflow-wrap: anywhere;
}

.jw-collector-meta code {
  color: #99c7ff;
  font-size: 11px;
}

.jw-collector-json {
  margin: 0;
  padding: 10px;
  min-height: 180px;
  max-height: min(55vh, 560px);
  overflow: auto;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.35);
  color: #d9e4f7;
  font-size: 11px;
  line-height: 1.45;
  white-space: pre;
  tab-size: 2;
}

.jw-collector-json::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.jw-collector-json::-webkit-scrollbar-thumb {
  background: rgba(121, 154, 210, 0.5);
  border-radius: 99px;
}

.jw-collector-json::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.06);
}

@media (max-width: 640px) {
  .jw-collector-panel {
    right: 8px;
    bottom: 8px;
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
    border-radius: 8px;
    padding: 8px;
  }

  .jw-collector-title {
    font-size: 11px;
  }

  .jw-collector-btn {
    font-size: 10px;
    padding: 6px 8px;
  }

  .jw-collector-json {
    min-height: 140px;
    max-height: 48vh;
    font-size: 10px;
  }
}

/* WordPress single template compatibility */
.cooldrama-player-main {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: var(--wp--preset--color--surface-color);
  transition: background-color 0.35s ease;
}

.cooldrama-player-main.alignfull {
  width: auto;
  max-width: none;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: hidden;
}

.site-main > .cooldrama-player-main.alignfull {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cooldrama-player-main .wp-block-post-content {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.cooldrama-player-root {
  display: block;
  width: 100%;
  margin: 0;
}

.cooldrama-player-main.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.cooldrama-player-main .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.cooldrama-player-main [data-post-id][data-server-index] {
  display: block;
  width: 100%;
  margin: 0;
}

/* Tighten player-to-footer spacing on single template */
.single .cooldrama-player-main + .site-footer {
  margin-block-start: 0 !important;
}

.single .site-main,
body.single.wp-theme-cooldrama,
body.single.wp-theme-cooldrama .wp-site-blocks {
  background: var(--cooldrama-theme-page-bg);
  overflow-x: hidden;
}

.single .cooldrama-player-main {
  margin-block-end: 0 !important;
}

.single .cooldrama-player-main .wp-block-post-content {
  padding-bottom: 0 !important;
}

.single .cooldrama-player-main .wp-block-post-content > *:last-child {
  margin-block-end: 0 !important;
}

.single .cooldrama-single-description {
  margin: 0;
  background: var(--pl-surface-soft);
  border-radius: 0;
  border-bottom: 1px solid var(--pl-surface-border);
  box-shadow: none;
  color: var(--pl-text);
}

.single .cooldrama-single-description-summary {
  padding: 0.95rem 1rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
}

.single .cooldrama-single-description-icon {
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 0;
}

.single .cooldrama-single-description-icon .material-icons {
  font-size: 1.25rem;
}

.single .cooldrama-single-description-answer {
  padding: 0.95rem 1rem 1rem;
  border-top: 1px solid var(--pl-surface-border);
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--pl-text);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.single .cooldrama-single-description-answer > :first-child {
  margin-top: 0;
}

.single .cooldrama-single-description-answer > :last-child {
  margin-bottom: 0;
}

.single .cooldrama-single-description-answer a {
  color: var(--playlist-color);
}

.single .site-footer,
.single footer.site-footer {
  background: var(--cooldrama-theme-panel-bg) !important;
  padding: 0 !important;
}

.single .site-footer > .wp-block-group.alignfull,
.single footer.site-footer > .wp-block-group.alignfull,
.single .cooldrama-player-main + .site-footer > .wp-block-group.alignfull,
.single .cooldrama-player-main + footer.site-footer > .wp-block-group.alignfull {
  background: var(--cooldrama-theme-panel-bg);
  box-shadow: none;
  margin: 0;
}

.single .cooldrama-player-main + .site-footer,
.single .cooldrama-player-main + footer.site-footer {
  background: var(--cooldrama-theme-panel-bg) !important;
}

.single .site-footer > .wp-block-group.alignfull.has-background,
.single footer.site-footer > .wp-block-group.alignfull.has-background,
.single .cooldrama-player-main + .site-footer > .wp-block-group.alignfull.has-background,
.single .cooldrama-player-main + footer.site-footer > .wp-block-group.alignfull.has-background {
  width: 100%;
  max-width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
}

.single .playlist-card,
.single .embed-wrapper,
.single .playlist-container,
.single .playlist-root,
.single #video-playlist,
.single #embed-player {
  border-radius: 0;
}

.single .playlist-card,
.single .embed-wrapper,
.single .playlist-container,
.single .playlist-head,
.single .playlist-body,
.single .playlist-player-pane,
.single .video-container,
.single .playlist-list-pane,
.single .episode-tab-section,
.single .playlist-server-switch,
.single .episode-tab-navigation,
.single .switch-server-container,
.single .playlist-post-title.wp-block-post-title,
.single .playlist-list-pane > .playlist-post-title,
.single .playlist-list-total,
.single .playlist-list-pane .playlist-context-top,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container .scroll-up,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-previous,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-counter,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container .cs-next,
.single :is(.playlist-root, #video-playlist, #embed-player) .control-container .scroll-down,
.single :is(.playlist-root, #video-playlist, #embed-player) .switch-btn,
.single .episode-list .episode-item {
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

.single .playlist-body {
  align-items: start;
}

.single .playlist-list-pane,
.single .episode-tab-section {
  align-self: start;
  height: auto;
  min-height: auto;
  overflow-y: visible;
}

@media (min-width: 981px) {
  .single .cooldrama-player-main {
    min-height: calc(100svh - 5rem - var(--wp-admin--admin-bar--height, 0px));
  }

  .single .playlist-card,
  .single .playlist-body {
    min-height: inherit;
  }

  .single .playlist-body {
    grid-template-columns: minmax(0, 1.45fr) minmax(22rem, 0.85fr);
    align-items: stretch;
  }

  .single .playlist-player-pane,
  .single .video-container {
    min-height: calc(100svh - 5rem - var(--wp-admin--admin-bar--height, 0px));
    aspect-ratio: auto;
  }

  .single .playlist-list-pane,
  .single .episode-tab-section {
    align-self: stretch;
    min-height: calc(100svh - 5rem - var(--wp-admin--admin-bar--height, 0px));
    max-height: calc(100svh - 5rem - var(--wp-admin--admin-bar--height, 0px));
    overflow-y: auto;
  }

  .single .playlist-list {
    max-height: none;
  }

  .single .playlist-root.is-player-fallback .playlist-player-pane,
  .single .playlist-root.is-player-fallback .video-container {
    min-height: calc(100svh - 5rem - var(--wp-admin--admin-bar--height, 0px));
    aspect-ratio: auto;
    align-self: stretch;
    background: #000;
  }

  .single .playlist-root.is-player-fallback .playlist-poster {
    background-size: contain !important;
    background-position: center center !important;
  }
}

@media (max-width: 980px) {
  .single .cooldrama-player-main,
  .single .playlist-card,
  .single .playlist-body,
  .single .playlist-player-pane,
  .single .video-container,
  .single .playlist-list-pane,
  .single .episode-tab-section {
    min-height: 0;
    max-height: none;
  }

  .single .playlist-player-pane,
  .single .video-container {
    aspect-ratio: 16 / 9;
  }

  .single .playlist-list-pane,
  .single .episode-tab-section {
    overflow-y: visible;
  }

  .single .playlist-list-pane .playlist-context-top {
    padding: 0 0.35rem !important;
    max-height: none;
    overflow: visible;
    border-bottom: 0;
  }

  .single .playlist-list-pane .playlist-context-top .playlist-context-item {
    border-radius: 0;
    border: 0;
    border-bottom: 0;
  }

  .single .playlist-list-pane .playlist-context-top .playlist-context-answer {
    overflow: visible;
  }

  .single .playlist-list-pane .playlist-context-top .playlist-context-answer p {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  .single .cooldrama-single-description-summary {
    padding: 0.8rem 0.85rem;
    font-size: 0.9rem;
  }

  .single .cooldrama-single-description-answer {
    padding: 0.8rem 0.85rem 0.9rem;
    font-size: 0.875rem;
  }
}

.single .episode-list .episode-item {
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12) !important;
}

/* Keep player/footer flow natural on single page */
body.single.wp-theme-cooldrama .wp-site-blocks {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

body.single.wp-theme-cooldrama .site-main {
  flex: 1 0 auto;
}

body.single.wp-theme-cooldrama .cooldrama-player-main {
  flex: 0 0 auto;
}

body.single.wp-theme-cooldrama .site-footer,
body.single.wp-theme-cooldrama footer.site-footer {
  margin-top: auto;
  flex: 0 0 auto;
}

@media (max-width: 980px) {
  body.single.wp-theme-cooldrama .wp-site-blocks {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
  }

  body.single.wp-theme-cooldrama .site-main {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    min-height: 0;
  }

  body.single.wp-theme-cooldrama .cooldrama-player-main {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    min-height: 0;
    min-height: calc(100dvh - var(--cooldrama-header-height, 3.5rem) - 2.5rem - env(safe-area-inset-bottom, 0px));
  }

  body.single.wp-theme-cooldrama .site-footer,
  body.single.wp-theme-cooldrama footer.site-footer {
    margin-top: auto;
    flex: 0 0 auto;
  }

  body.single.wp-theme-cooldrama .cooldrama-player-main .wp-block-post-content,
  body.single.wp-theme-cooldrama .cooldrama-single-player-content,
  body.single.wp-theme-cooldrama .cooldrama-player-root {
    display: flex;
    flex: 1 0 auto;
    flex-direction: column;
    min-height: 0;
  }

  .single .site-footer > .wp-block-group.alignfull,
  .single footer.site-footer > .wp-block-group.alignfull,
  .single .cooldrama-player-main + .site-footer > .wp-block-group.alignfull,
  .single .cooldrama-player-main + footer.site-footer > .wp-block-group.alignfull {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 0;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .single .site-footer > .wp-block-group.alignfull.has-background,
  .single footer.site-footer > .wp-block-group.alignfull.has-background,
  .single .cooldrama-player-main + .site-footer > .wp-block-group.alignfull.has-background,
  .single .cooldrama-player-main + footer.site-footer > .wp-block-group.alignfull.has-background {
    margin: 0;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .single .footer-copyright {
    padding: 0.55rem 0;
  }
}

/* Force episode grid inside player root (prevents theme overrides). */
.playlist-root ul.playlist-list.episode-list,
.playlist-root .playlist-list.episode-list.episode-tab-panel.active,
.playlist-root .playlist-list {
  display: flex !important;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: center;
  gap: 0.5rem;
}

.playlist-root .playlist-list .playlist-item {
  display: block;
  flex: 0 0 calc((100% - 4rem) / 9);
  max-width: calc((100% - 4rem) / 9);
  min-width: 4rem;
}

.playlist-root .playlist-list .playlist-item .playlist-item-btn,
.playlist-root .playlist-list .playlist-item .episode-item {
  width: 100%;
}

@media (max-width: 980px) {
  .playlist-root ul.playlist-list.episode-list,
  .playlist-root .playlist-list.episode-list.episode-tab-panel.active,
  .playlist-root .playlist-list {
    justify-content: center;
  }

  .playlist-root .playlist-list .playlist-item {
    flex-basis: calc((100% - 1.5rem) / 4);
    max-width: calc((100% - 1.5rem) / 4);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .playlist-root .playlist-list .playlist-item {
    flex-basis: calc((100% - 4.5rem) / 10);
    max-width: calc((100% - 4.5rem) / 10);
    min-width: 3.5rem;
  }
}

@media (max-width: 640px) {
  .playlist-root .playlist-list .playlist-item {
    flex-basis: calc((100% - 2rem) / 5);
    max-width: calc((100% - 2rem) / 5);
    min-width: 3.5rem;
  }
}