:root{
  --podcast-bg:#f3f9ff;
  --podcast-surface:#ffffff;
  --podcast-surface-soft:rgba(255,255,255,.92);
  --podcast-border:rgba(148,163,184,.24);
  --podcast-copy:#10233e;
  --podcast-muted:#5f7694;
}

body.podcast-page{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.12), transparent 30%),
    radial-gradient(circle at top right, rgba(14,165,233,.1), transparent 32%),
    linear-gradient(180deg, #f6fbff 0%, #eef6ff 52%, #edf5ff 100%);
  color:var(--podcast-copy);
}

.podcast-shell{
  width:min(1180px, calc(100% - 32px));
  margin:0 auto;
  padding:32px 0 56px;
}

.podcast-topbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.podcast-backlink{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  text-decoration:none;
  color:#173456;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(148,163,184,.24);
  box-shadow:0 10px 26px rgba(59,130,246,.08);
}

.podcast-hero{
  position:relative;
  overflow:hidden;
  margin-top:24px;
  padding:30px;
  border-radius:32px;
  border:1px solid rgba(125,211,252,.3);
  background:
    radial-gradient(circle at top right, rgba(56,189,248,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(233,245,255,.96));
  box-shadow:0 28px 60px rgba(59,130,246,.12);
}

.podcast-hero::after{
  content:"";
  position:absolute;
  inset:auto -30px -46px auto;
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(56,189,248,.32) 0%, rgba(56,189,248,0) 68%);
  pointer-events:none;
}

.podcast-hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(280px, .8fr);
  gap:24px;
  align-items:start;
}

.podcast-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#0f4c81;
  background:rgba(14,165,233,.1);
  border:1px solid rgba(125,211,252,.24);
}

.podcast-title{
  margin:16px 0 0;
  font-size:clamp(32px, 5vw, 52px);
  line-height:1.04;
  font-weight:900;
  letter-spacing:-.04em;
}

.podcast-subtitle{
  margin:16px 0 0;
  max-width:720px;
  font-size:17px;
  line-height:1.7;
  color:var(--podcast-muted);
}

.podcast-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

.podcast-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  padding:0 18px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
  text-decoration:none;
  font-weight:800;
  cursor:pointer;
}

.podcast-btn.primary{
  color:#082f49;
  background:linear-gradient(135deg, #e0f2fe, #7dd3fc);
  box-shadow:0 14px 28px rgba(14,165,233,.22);
}

.podcast-btn.secondary{
  color:#173456;
  background:rgba(255,255,255,.92);
}

.podcast-hero-stats{
  display:grid;
  gap:12px;
}

.podcast-stat-card{
  padding:18px 18px 16px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.2);
  background:rgba(255,255,255,.88);
}

.podcast-stat-label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7dd3fc;
}

.podcast-stat-value{
  margin-top:10px;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.04em;
}

.podcast-stat-copy{
  margin-top:8px;
  color:var(--podcast-muted);
  line-height:1.55;
}

.podcast-main-grid{
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(300px, .85fr);
  gap:24px;
  margin-top:24px;
}

.podcast-panel{
  padding:24px;
  border-radius:28px;
  border:1px solid var(--podcast-border);
  background:var(--podcast-surface-soft);
  box-shadow:0 18px 40px rgba(59,130,246,.08);
}

.podcast-panel-title{
  margin:0;
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7dd3fc;
}

.podcast-section-intro{
  margin:14px 0 0;
  max-width:900px;
  color:var(--podcast-muted);
  line-height:1.72;
}

.podcast-player-card{
  margin-top:16px;
  padding:22px;
  border-radius:24px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(231,244,255,.98)),
    #fff;
  border:1px solid rgba(148,163,184,.2);
}

.podcast-episode-topline{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.podcast-episode-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(14,165,233,.1);
  color:#0f4c81;
  font-size:12px;
  font-weight:800;
  border:1px solid rgba(125,211,252,.24);
}

.podcast-player-title{
  margin:14px 0 0;
  font-size:30px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-.03em;
}

.podcast-player-meta{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  color:var(--podcast-muted);
}

.podcast-player-description{
  margin:16px 0 0;
  color:#2d4d71;
  line-height:1.7;
}

.podcast-player-shell{
  position:relative;
  margin-top:18px;
  padding:18px;
  border-radius:24px;
  background:
    radial-gradient(circle at left center, rgba(34,197,94,.08), transparent 32%),
    linear-gradient(135deg, rgba(245,250,255,.98), rgba(235,246,255,.94));
  border:1px solid rgba(148,163,184,.2);
}

.podcast-wave{
  display:flex;
  align-items:flex-end;
  gap:7px;
  height:40px;
}

.podcast-wave span{
  width:8px;
  border-radius:999px;
  background:linear-gradient(180deg, #7dd3fc, #2563eb);
  animation:podcast-wave 1.8s ease-in-out infinite;
}

.podcast-wave span:nth-child(2){ animation-delay:.1s; }
.podcast-wave span:nth-child(3){ animation-delay:.22s; }
.podcast-wave span:nth-child(4){ animation-delay:.35s; }
.podcast-wave span:nth-child(5){ animation-delay:.48s; }
.podcast-wave span:nth-child(6){ animation-delay:.62s; }

@keyframes podcast-wave{
  0%,100%{ height:12px; opacity:.48; }
  50%{ height:40px; opacity:1; }
}

.podcast-player{
  width:100%;
  margin-top:16px;
  border-radius:18px;
  background:#eaf4ff;
}

.podcast-progress-track{
  position:relative;
  margin-top:16px;
  height:10px;
  border-radius:999px;
  background:rgba(148,163,184,.12);
  overflow:hidden;
}

.podcast-progress-track > span{
  position:absolute;
  inset:0 auto 0 0;
  width:6%;
  border-radius:inherit;
  background:linear-gradient(90deg, #38bdf8, #22c55e);
}

.podcast-progress-meta{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--podcast-muted);
}

.podcast-toast{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:80;
  width:min(360px, calc(100% - 24px));
  padding:18px 18px 16px;
  border-radius:20px;
  border:1px solid rgba(125,211,252,.24);
  background:rgba(255,255,255,.96);
  box-shadow:0 22px 44px rgba(59,130,246,.18);
}

.podcast-toast.hidden{
  display:none;
}

.podcast-toast-title{
  font-weight:900;
  font-size:16px;
}

.podcast-toast-copy{
  margin-top:8px;
  color:var(--podcast-muted);
  line-height:1.55;
}

.podcast-queue{
  display:grid;
  gap:14px;
  margin-top:16px;
}

.podcast-queue-card{
  display:block;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(255,255,255,.94);
  color:inherit;
  cursor:pointer;
  text-decoration:none;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.podcast-queue-card:hover,
.podcast-queue-card.active{
  transform:translateY(-2px);
  border-color:rgba(96,165,250,.34);
  background:rgba(241,248,255,.98);
}

.podcast-card-media{
  position:relative;
  overflow:hidden;
  min-height:168px;
  margin-bottom:16px;
  border-radius:20px;
  background:rgba(226,232,240,.9);
}

.podcast-card-image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.podcast-card-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(15,23,42,.04), rgba(15,23,42,.36));
  pointer-events:none;
}

.podcast-card-overlay-badge{
  position:absolute;
  left:12px;
  bottom:12px;
  z-index:1;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(15,23,42,.72);
  border:1px solid rgba(255,255,255,.14);
  color:#f8fbff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.podcast-queue-media{
  min-height:128px;
}

.podcast-queue-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.podcast-queue-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#315984;
}

.podcast-queue-title{
  margin:12px 0 0;
  font-size:20px;
  font-weight:900;
  line-height:1.28;
}

.podcast-queue-copy{
  margin:10px 0 0;
  color:var(--podcast-muted);
  line-height:1.6;
}

.podcast-queue-footer{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  color:#45698f;
}

.podcast-side-note{
  margin-top:18px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(241,248,255,.95);
  line-height:1.65;
  color:var(--podcast-muted);
}

.podcast-source-panel{
  margin-top:24px;
}

.podcast-catalog-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}

.podcast-catalog-card{
  display:block;
  padding:20px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--podcast-from) 14%, rgba(255,255,255,.98)), rgba(255,255,255,.98)),
    #fff;
  box-shadow:0 18px 38px rgba(59,130,246,.08);
  color:inherit;
  text-decoration:none;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.podcast-catalog-card:hover{
  transform:translateY(-3px);
  border-color:rgba(56,189,248,.34);
  box-shadow:0 22px 40px rgba(59,130,246,.12);
}

.podcast-catalog-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.podcast-catalog-title{
  margin:14px 0 0;
  font-size:23px;
  line-height:1.22;
  font-weight:900;
  letter-spacing:-.03em;
}

.podcast-catalog-focus{
  margin-top:10px;
  color:#24517f;
  font-size:13px;
  font-weight:800;
}

.podcast-catalog-description{
  margin:12px 0 0;
  color:var(--podcast-muted);
  line-height:1.62;
}

.podcast-catalog-footer{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
  color:#45698f;
}

.podcast-catalog-open{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-top:18px;
  padding:0 16px;
  border-radius:14px;
  border:1px solid rgba(56,189,248,.22);
  background:linear-gradient(135deg, #eff8ff, #d7f0ff);
  color:#0f4c81;
  font-weight:900;
}

.podcast-source-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}

.podcast-source-card{
  padding:20px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--source-from) 16%, rgba(255,255,255,.98)), rgba(255,255,255,.98)),
    #fff;
  box-shadow:0 18px 38px rgba(59,130,246,.08);
}

.podcast-source-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.podcast-source-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(15,118,110,.08);
  color:#11426a;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.podcast-source-name{
  margin:14px 0 0;
  font-size:24px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:-.03em;
}

.podcast-source-focus{
  margin-top:10px;
  color:#24517f;
  font-size:13px;
  font-weight:800;
}

.podcast-source-description{
  margin:12px 0 0;
  color:var(--podcast-muted);
  line-height:1.65;
}

.podcast-source-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:16px;
  min-height:46px;
  padding:0 16px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.16);
  background:rgba(241,248,255,.96);
  color:#173456;
  text-decoration:none;
  font-weight:800;
}

.podcast-source-note{
  margin-top:18px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(248,251,255,.96);
  color:var(--podcast-muted);
  line-height:1.7;
}

.licensed-library-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}

.licensed-library-card{
  display:block;
  padding:20px;
  border-radius:24px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--licensed-from) 14%, rgba(255,255,255,.98)), rgba(255,255,255,.98)),
    #fff;
  box-shadow:0 18px 38px rgba(59,130,246,.08);
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.licensed-library-link{
  color:inherit;
  text-decoration:none;
}

.licensed-library-card:hover,
.licensed-library-card.active{
  transform:translateY(-3px);
  border-color:rgba(56,189,248,.34);
  box-shadow:0 22px 40px rgba(59,130,246,.12);
}

.licensed-card-media{
  min-height:172px;
}

.licensed-library-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.licensed-library-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(14,165,233,.09);
  color:#11426a;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.licensed-library-title{
  margin:14px 0 0;
  font-size:23px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:-.03em;
}

.licensed-library-focus{
  margin-top:10px;
  color:#24517f;
  font-size:13px;
  font-weight:800;
}

.licensed-library-description{
  margin:12px 0 0;
  color:var(--podcast-muted);
  line-height:1.62;
}

.licensed-library-actions{
  margin-top:16px;
}

.licensed-library-open,
.licensed-detail-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 16px;
  border-radius:14px;
  border:1px solid rgba(56,189,248,.22);
  background:linear-gradient(135deg, #eff8ff, #d7f0ff);
  color:#0f4c81;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
}

.licensed-audio-card{
  margin-top:18px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(125,211,252,.3);
  background:linear-gradient(135deg, rgba(239,248,255,.98), rgba(224,242,254,.94));
}

.licensed-audio-top{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.licensed-audio-kicker{
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#0f4c81;
}

.licensed-audio-status{
  margin-top:8px;
  font-size:15px;
  font-weight:800;
  color:#173456;
}

.licensed-audio-chip{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(148,163,184,.24);
  color:#24517f;
  font-size:12px;
  font-weight:900;
}

.licensed-audio-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

.licensed-audio-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 16px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.24);
  background:rgba(255,255,255,.92);
  color:#173456;
  font-weight:800;
  cursor:pointer;
}

.licensed-audio-note{
  margin-top:14px;
  color:var(--podcast-muted);
  line-height:1.65;
}

.licensed-detail{
  margin-top:18px;
  padding:22px;
  border-radius:28px;
  border:1px solid rgba(148,163,184,.14);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--detail-from) 12%, rgba(255,255,255,.99)), rgba(255,255,255,.99)),
    #fff;
  box-shadow:0 22px 42px rgba(59,130,246,.1);
}

.licensed-detail.hidden{
  display:none;
}

.licensed-detail-static{
  display:block;
}

.licensed-detail-top{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.licensed-detail-title{
  margin:14px 0 0;
  font-size:34px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.04em;
}

.licensed-detail-meta{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  color:#3a5f89;
}

.licensed-detail-description{
  margin-top:16px;
  color:#264567;
  line-height:1.7;
}

.licensed-detail-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top:18px;
}

.licensed-detail-section{
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(247,251,255,.98);
}

.licensed-detail-section h4{
  margin:0 0 12px;
  font-size:15px;
  font-weight:900;
  letter-spacing:.02em;
}

.licensed-detail-section p{
  margin:0 0 12px;
  color:var(--podcast-muted);
  line-height:1.68;
}

.licensed-detail-section ul{
  margin:0;
  padding-left:18px;
  color:#234261;
}

.licensed-detail-section li + li{
  margin-top:8px;
}

.licensed-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}

.licensed-detail-note{
  margin-top:18px;
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(148,163,184,.12);
  background:rgba(247,251,255,.98);
  color:var(--podcast-muted);
  line-height:1.7;
}

.podcast-related-block{
  margin-top:24px;
}

.podcast-related-title{
  margin:0 0 14px;
  font-size:20px;
  font-weight:900;
  color:#173456;
}

.hidden-panel{
  display:none !important;
}

@media (max-width: 980px){
  .podcast-hero-grid,
  .podcast-main-grid{
    grid-template-columns:1fr;
  }
  .podcast-catalog-grid,
  .podcast-source-grid{
    grid-template-columns:1fr;
  }
  .licensed-library-grid,
  .licensed-detail-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 640px){
  .podcast-shell{
    width:min(100% - 20px, 100%);
    padding:18px 0 34px;
  }
  .podcast-hero,
  .podcast-panel{
    padding:18px;
    border-radius:22px;
  }
  .podcast-player-card{
    padding:16px;
  }
  .podcast-player-title{
    font-size:24px;
  }
}
