/* ---------------- Tunefind song cards ---------------- */

.tf-songs{display:grid;gap:14px}

/* Tighter meta list spacing in fullstory */
.pmovie .pmovie__list{grid-gap:4px;row-gap:4px;min-height:0;align-content:start}
.pmovie .pmovie__list li{margin:0;line-height:1.35;padding:0}

.tf-show{
  /* IMPORTANT: In Anixart, `.lt-is-active` is DARK theme (see common.css). */
  --tf-surface: var(--ui-bg, #fff);
  --tf-surface-2: var(--ui-bg-darker, #f5f5f5);
  --tf-surface-3: rgba(0,0,0,.18);
  --tf-stroke: var(--bdc, rgba(0,0,0,.10));
  --tf-text: var(--tt, #444);
  --tf-muted: var(--tts, #6a6a6a);
  --tf-accent: var(--accent, #ff2d55);
  --tf-accent2: var(--accent2, #ff4d6f);
  --tf-radius:18px;
  --tf-shadow: 0 14px 40px rgba(0,0,0,.12);
  --tf-topnav-a: rgba(255,255,255,.98);
  --tf-topnav-b: rgba(255,255,255,.78);
  --tf-on-surface-border: rgba(0,0,0,.14);

  background: var(--tf-surface);
  color: var(--tf-text);
  border-radius: var(--tf-radius);
  padding: 16px;
}

.tf-json-root{
  min-height: clamp(360px, 60vh, 900px);
}

.lt-is-active .tf-show{
  --tf-surface: var(--ui-bg-darkest, #0a0c13);
  --tf-surface-2: rgba(255,255,255,.04);
  --tf-surface-3: rgba(0,0,0,.18);
  --tf-stroke: rgba(255,255,255,.10);
  --tf-text: var(--tt, #e9edf5);
  --tf-muted: var(--tts, #a9b2c3);
  --tf-shadow: 0 14px 40px rgba(0,0,0,.45);
  --tf-topnav-a: rgba(11,13,18,.98);
  --tf-topnav-b: rgba(11,13,18,.78);
  --tf-on-surface-border: rgba(255,255,255,.14);
}

.tf-seasons2{display:block}

/* Seasons/Episodes UI — copied from series-seasons-sync-stable2-clean.html (scoped) */
.tf-show .topnav{
  position:static;margin:10px -16px 14px;padding:12px 16px 12px;
  background:linear-gradient(180deg, var(--tf-topnav-a), var(--tf-topnav-b));
  backdrop-filter: blur(10px) saturate(130%);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.tf-show .navrow{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.tf-show .season-cluster{
  display:flex;gap:10px;align-items:center;flex-wrap:nowrap;
  overflow:hidden;max-width:100%;
}
.tf-show .iconbtn{
  width:40px;height:40px;display:grid;place-items:center;border-radius:14px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:var(--tf-text);
  cursor:pointer;line-height:0;
}
.tf-show .iconbtn:hover{background:rgba(255,255,255,.08)}
.tf-show .iconbtn:active{transform:translateY(1px)}
.tf-show .iconbtn .ico{width:18px;height:18px;fill:currentColor;display:block;opacity:.95}
.tf-show .season-current{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);
  min-width:0;flex:1 1 auto;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  position:relative;
}
.tf-show .season-current::-webkit-scrollbar{display:none}
.tf-show .season-chip{
  display:inline-flex;align-items:center;justify-content:center;
  padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);font-size:12px;font-weight:900;white-space:nowrap;flex:0 0 auto;
}
.tf-show .season-chip.muted{color:rgba(233,237,245,.72)}
.tf-show .season-chip.active{
  background:var(--tf-accent);
  color:#0b0d12;border-color:transparent;box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.tf-show .season-chip[data-tf-season-prev-chip], .tf-show .season-chip[data-tf-season-next-chip]{cursor:pointer}
.tf-show .season-chip[data-tf-season-prev-chip]:hover, .tf-show .season-chip[data-tf-season-next-chip]:hover{
  background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);
}
.tf-show .season-open, .tf-show .btn{
  padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);color:var(--tf-text);font-size:12px;display:inline-flex;
  align-items:center;gap:8px;cursor:pointer;
}
.tf-show .season-open:hover, .tf-show .btn:hover{background:rgba(255,255,255,.08)}
.tf-show .season-open .ico, .tf-show .btn .ico{width:16px;height:16px;fill:currentColor;display:block;opacity:.95}
.tf-show .actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tf-show .season{
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--tf-radius);
  overflow:hidden;
  box-shadow:var(--tf-shadow);
  background:radial-gradient(900px 420px at 20% 0%, rgba(255,45,85,.14), transparent 60%),
             linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.22));
}
.tf-show .season-head{
  padding:16px 16px 12px;display:flex;gap:12px;align-items:flex-start;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.tf-show .season-title{min-width:0}
.tf-show .season-title .kicker{color:var(--tf-muted);font-size:13px}
.tf-show .season-title .name{font-size:18px;font-weight:850;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-show .season-stats{color:var(--tf-muted);font-size:12px;white-space:nowrap}
.tf-show .episodes{padding:8px}
.tf-show details.ep{border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.03);margin:10px 0}
.tf-show details.ep summary{list-style:none;cursor:pointer;padding:12px 14px;display:flex;align-items:center;justify-content:flex-start;gap:12px}
.tf-show details.ep summary::-webkit-details-marker{display:none}
.tf-show .ep-left{min-width:0;flex:1 1 auto}
.tf-show .ep-title{font-size:14px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-show .ep-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.tf-show .ep-meta{margin-left:0;font-size:12px;color:var(--tf-muted);display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.tf-show .badge{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.18)}
.pmovie__text .page_hh{font-size:14px !important;text-align:left;text-justify:auto}
.pmovie__text.full-text h2.page_hh{font-size:14px !important}
.tf-show .chev{width:10px;height:10px;border-right:2px solid rgba(255,255,255,.5);border-bottom:2px solid rgba(255,255,255,.5);transform:rotate(45deg);transition:transform .15s ease;flex-shrink:0}
.tf-show details.ep[open] .chev{transform:rotate(-135deg)}
.tf-show .ep-body{border-top:1px solid rgba(255,255,255,.08);padding:10px 10px 12px}

@media (max-width:760px){
  .tf-json-root{min-height: clamp(280px, 50vh, 720px);}
  .tf-show .season-cluster{
    flex-wrap:nowrap;
    overflow-x:hidden;
    gap:8px;
  }
  .tf-show .season-current{
    min-width:auto !important;
    overflow-x:auto;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
  }
  .tf-show .season-chip{flex:0 0 auto;}
}

.tf-season-card.active{background:linear-gradient(180deg,var(--accent2,#ff4d6f),var(--accent,#ff2d55));color:#0b0d12;border-color:transparent}
.tf-season-card__num{font-weight:950;font-size:14px}
.tf-season-card__meta{margin-top:6px;font-size:12px;opacity:.75}

@media (max-width:760px){
  .tf-season-current{width:100%}
}

.tf-song{
  position:relative;
  border:1px solid var(--bdc,rgba(255,255,255,.12));
  border-radius:18px;
  overflow:hidden;
  background:
    radial-gradient(900px 420px at 20% 0%, rgba(255,45,85,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.12));
}

.tf-song__head{padding:16px 16px 10px;min-width:0}
.tf-song__artist{font-size:13px;color:var(--tt-2,var(--muted,#a9b2c3));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-song__title{font-size:16px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.tf-song__scene{padding:6px 16px 16px;font-size:14px;line-height:1.55;color:var(--tt,var(--text,#e9edf5))}

.tf-song__controls{
  padding:14px 16px 16px;
  border-top:1px solid rgba(255,255,255,.07);
  background:transparent;
}

.tf-song__row{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}

.tf-song__play{
  width:44px;height:44px;border-radius:999px;border:none;
  background:var(--accent,#ff2d55);
  color:#0b0d12;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  box-shadow:0 12px 22px rgba(0,0,0,.25);
}
.tf-song__play:hover{background:var(--accent2,#ff4d6f)}
.tf-song__play .fal{font-size:18px;line-height:1;display:block}
/* Font Awesome play triangle is visually left-weighted; nudge a bit to center */
.tf-song__play [data-tf-ico-play]{transform:translateX(1px)}

.tf-song__progress{display:flex;flex-direction:column;gap:8px;min-width:0}
.tf-song__progress{align-self:center}
.tf-song__progress input[type=range]{width:100%;height:10px;accent-color:var(--accent,#ff2d55);margin:0;display:block}
.tf-song__time{display:flex;justify-content:space-between;font-size:12px;color:var(--tt-2,var(--muted,#a9b2c3))}

.tf-song__right{display:flex;align-items:center;gap:10px}
.tf-song__mute{
  width:36px;height:36px;border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  display:grid;place-items:center;
  cursor:pointer;line-height:0;color:var(--tt,#fff);
}
.tf-song__mute:hover{background:rgba(255,255,255,.1)}
.tf-song__mute .fal{font-size:16px}
.tf-song__volume input[type=range]{width:120px;accent-color:var(--accent,#ff2d55)}

.tf-song__audio-hidden{position:absolute;left:-9999px}

/* Services — top right */
.tf-song__links{
  position:absolute;
  top:12px;
  right:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* Store buttons (theme-aware container, brand SVG inside) */
.tf-store{
  --tf-brand:var(--accent,#6a5cff);
  --tf-icon: none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:12px;
  background:var(--ui-bg-darker,#111);
  border:1px solid var(--bdc,rgba(255,255,255,.12));
  transition:background-color .15s ease,border-color .15s ease,transform .15s ease,box-shadow .15s ease;
}

/* Prefer the provided SVG files (same visual size for all) */
.tf-store::before{
  content:"";
  width:18px;
  height:18px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;
  background-image:var(--tf-icon);
  display:block;
}

/* Hide legacy inline SVG if it exists (older imported posts) */
.tf-store svg{display:none}

.tf-store:hover{border-color:var(--tf-brand);transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.tf-store:active{transform:translateY(0);box-shadow:none}
.tf-store:focus-visible{outline:2px solid var(--tf-brand);outline-offset:2px}

.tf-store--youtube{--tf-brand:#ff0033;--tf-icon:url("../images/tunefind/youtube.svg")}
.tf-store--spotify{--tf-brand:#1db954;--tf-icon:url("../images/tunefind/spotify.svg")}
.tf-store--apple{--tf-brand:#fa243c;--tf-icon:url("../images/tunefind/apple-music.svg")}
.tf-store--yandex{--tf-brand:#ffca28;--tf-icon:url("../images/tunefind/yandex-music.svg")}

/* Optional: make hover slightly branded without killing theme */
.tf-store:hover{background:color-mix(in srgb, var(--ui-bg-darker,#111) 65%, var(--tf-brand) 35%)}
.lt-is-active .tf-store:hover{background:color-mix(in srgb, var(--ui-bg-darker,#f5f5f5) 65%, var(--tf-brand) 35%)}

/* Fallback for browsers without color-mix */
@supports not (background: color-mix(in srgb, #000 50%, #fff 50%)){
  .tf-store:hover{background:var(--ui-bg-darker,#111)}
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:720px){
  .tf-song__row{grid-template-columns:auto 1fr}
  .tf-song__right{grid-column:1/-1;justify-content:space-between}
  .tf-song__links{position:static;padding:0 16px 8px}
}

/* ---------------- Sticky player ---------------- */
.tf-sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  padding:8px 10px 10px;
  background:linear-gradient(180deg, rgba(255,255,255,.0), rgba(255,255,255,.6) 30%, rgba(255,255,255,.92));
  backdrop-filter:saturate(130%) blur(10px);
}
.lt-is-active .tf-sticky{
  background:linear-gradient(180deg, rgba(11,13,18,.0), rgba(11,13,18,.75) 30%, rgba(11,13,18,.95));
}
.tf-sticky--hidden{display:none !important}
.tf-player{
  max-width:100%;margin:0 auto;border-radius:16px;overflow:hidden;
  border:1px solid rgba(0,0,0,.10);
  background:radial-gradient(900px 420px at 20% 0%, rgba(255,45,85,.12), transparent 60%),
             linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75));
  box-shadow:0 18px 50px rgba(0,0,0,.2);
  color:var(--tt, #444);
}
.lt-is-active .tf-player{
  border-color:rgba(255,255,255,.12);
  background:radial-gradient(900px 420px at 20% 0%, rgba(255,45,85,.18), transparent 60%),
             linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.35));
  box-shadow:0 18px 50px rgba(0,0,0,.55);
  color:var(--tt, #e9edf5);
}
.tf-player__head{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:6px 10px;padding-right:48px}
.tf-player__now{min-width:0}
.tf-player__kicker{font-size:11px;color:var(--tts, #6a6a6a)}
.tf-player__title{font-size:13px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.tf-player__artist{font-size:11px;color:rgba(120,120,120,.85);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.lt-is-active .tf-player__artist{color:rgba(215,221,236,.85)}
.tf-player__close{
  position:absolute;right:12px;top:8px;
  width:26px;height:26px;border-radius:9px;border:1px solid rgba(0,0,0,.12);
  background:rgba(0,0,0,.04);color:currentColor;display:grid;place-items:center;cursor:pointer;line-height:0;
  z-index:2;
}
.lt-is-active .tf-player__close{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.05)}
.tf-player__close:hover{background:rgba(0,0,0,.08)}
.lt-is-active .tf-player__close:hover{background:rgba(255,255,255,.10)}
.tf-player__ico{width:14px;height:14px;fill:currentColor;display:block}
.tf-player__controls{padding:6px 64px 8px 10px;border-top:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.02)}
.lt-is-active .tf-player__controls{border-top-color:rgba(255,255,255,.08);background:transparent}
.tf-player__row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}
.tf-player__play{
  width:34px;height:34px;border-radius:999px;border:none;background:var(--accent, #ff2d55);color:#0b0d12;
  display:grid;place-items:center;cursor:pointer;line-height:0;box-shadow:0 12px 22px rgba(0,0,0,.35);
}
.tf-player__play:hover{background:var(--accent2, #ff4d6f)}
.tf-player__progress{display:flex;flex-direction:column;justify-content:center;gap:6px;align-self:center}
.tf-player__progress input[type=range]{width:100%;height:10px;accent-color:var(--accent, #ff2d55)}
.tf-player__time{display:flex;justify-content:space-between;font-size:11px;color:var(--tts, #6a6a6a)}
.tf-player__right{display:flex;align-items:center;gap:8px;margin-right:48px}
.tf-player__mute{
  width:34px;height:34px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:rgba(0,0,0,.04);
  color:currentColor;display:grid;place-items:center;cursor:pointer;line-height:0;
}
.lt-is-active .tf-player__mute{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.05)}
.tf-player__mute:hover{background:rgba(0,0,0,.08)}
.lt-is-active .tf-player__mute:hover{background:rgba(255,255,255,.10)}
.tf-player__volume input[type=range]{width:96px;accent-color:var(--accent, #ff2d55)}

@media (max-width:760px){
  .tf-player__row{grid-template-columns:auto 1fr}
  .tf-player__right{grid-column:1/-1;justify-content:space-between}
  .tf-player__volume input[type=range]{width:160px}
}

@media (min-width:900px){
  .tf-player{display:flex;align-items:center;gap:8px;position:relative}
  .tf-player__head{flex:0 0 220px;padding:6px 10px}
  .tf-player__controls{flex:1;border-top:0;padding:6px 10px}
}

@media (max-width:899px){
  .tf-player{position:relative}
}

@media (max-width:899px){
  .tf-player{display:block}
}
.tf-rating-icon {
  display: inline-block;
  vertical-align: middle;
  width: 17px;
  height: 17px;
  margin-right: 4px;
}

.item__rating--songs {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  width: auto;
  padding: 4px 6px;
  font-size: 10px;
  line-height: 1;
  border-radius: 6px;
}
.tf-show__seo {
    margin-top: 16px;
}