/* PersianPod: صفحه‌ی «گوش بده». کارت‌ها و ردیف‌ها از pp-dir.css می‌آیند. */
.pl-stage{margin:6px 0 10px;padding:16px;border:1px solid var(--line);border-radius:24px;background:var(--card);box-shadow:0 10px 30px var(--glow-soft);scroll-margin-top:84px}
.pl-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.pl-head img,.pl-head i{flex:none;width:68px;height:68px;border-radius:16px;object-fit:cover;display:grid;place-items:center;background:var(--line);color:var(--acc);font-style:normal;font-size:1.8rem;font-weight:800}
.pl-head h2{margin:0;font-size:clamp(1.1rem,2.6vw,1.4rem)}
.pl-head small{display:block;color:var(--mut)}
.pl-stage iframe{display:block;width:100%;border:0;border-radius:14px;background:var(--bg)}
.pl-stage .e-castbox,.pl-stage .e-other{height:420px}
.pl-stage .e-spotify{height:352px}
.pl-stage .e-youtube{aspect-ratio:16/9;height:auto}
.pl-sub{margin:16px 0 8px;font-size:1rem}
.pl-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pl-links a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;font-size:.9rem;
  transition:box-shadow .2s ease}
.pl-links a:hover{box-shadow:0 6px 18px var(--glow-soft)}
.pl-links a:focus-visible{outline:3px solid #08cb00;outline-offset:2px}

/* کارت‌های پلیر (دکمه‌اند، نه لینک) */
.pl-card{font:inherit;text-align:start;cursor:pointer;width:100%}
.pl-card[aria-current=true]{border-color:#08cb00;box-shadow:0 10px 28px var(--glow-soft)}
.pl-play{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:0 12px;min-height:30px;border-radius:999px;background:#08cb00;color:#0b0e0c;font-size:.8rem;font-weight:800}
.pl-play svg{width:14px;height:14px;fill:currentColor}
.pl-card[aria-current=true] .pl-play{background:transparent;color:var(--acc);border:1px solid #08cb00}
.pl-row .pd-card{width:auto}
@media(max-width:799px){.pl-stage{padding:12px;border-radius:20px}.pl-stage .e-castbox,.pl-stage .e-other{height:380px}}


/* ساعت زنده‌ی صفحه‌ی «گوش بده»: نقطه از راست (نیمه‌شب) به چپ می‌رود؛ بخش گذشته‌ی روز سبز و بخش باقی‌مانده کم‌رنگ است */
.pl-clock { --p: .5; position: relative; width: min(340px, 100%); margin: 14px auto 4px; padding: 0 38px; box-sizing: border-box; direction: ltr; }
.pl-clock-bubble {
  position: relative; display: block; width: max-content; margin: 0 0 12px; padding: 4px 14px; left: calc((1 - var(--p)) * 100%); transform: translateX(-50%);
  border-radius: 999px; background: var(--card, #14181b); color: var(--ink, #eef2f0); border: 1px solid rgba(8, 203, 0, .55);
  font-size: .88rem; font-weight: 800; line-height: 1.7; font-variant-numeric: tabular-nums; letter-spacing: .02em;
  box-shadow: 0 0 14px var(--glow-soft, rgba(8, 203, 0, .3));
}
.pl-clock-track { position: relative; display: block; height: 18px; }
.pl-clock-past, .pl-clock-rest { position: absolute; top: 50%; height: 5px; margin-top: -2.5px; border-radius: 999px; }
/* گذشته‌ی روز: از راست تا نقطه، سبز */
.pl-clock-past { right: 0; width: calc(var(--p) * 100%); background: linear-gradient(to left, #0a7a05, #08cb00 55%, #00ff9c); box-shadow: 0 0 10px var(--glow-soft, rgba(8, 203, 0, .3)); }
/* باقی‌مانده‌ی روز: از نقطه تا چپ، کم‌رنگ */
.pl-clock-rest { left: 0; width: calc((1 - var(--p)) * 100%); background: var(--line, rgba(255, 255, 255, .16)); }
.pl-clock-thumb {
  position: absolute; top: 50%; left: calc((1 - var(--p)) * 100%); width: 18px; height: 18px; margin: -9px 0 0 -9px; box-sizing: border-box;
  border-radius: 50%; border: 3px solid var(--card, #14181b); background: #08cb00; box-shadow: 0 0 0 1px #08cb00, 0 4px 12px var(--glow-soft, rgba(8, 203, 0, .3));
}
@media (prefers-reduced-motion: no-preference) { .pl-clock-bubble, .pl-clock-thumb, .pl-clock-past, .pl-clock-rest { transition: left .6s ease, width .6s ease; } }

/* پلیر بالای صفحه‌ی «گوش بده»: جمع‌وجورتر؛ چند قسمت اول دیده می‌شود و بقیه با اسکرول داخل خود فهرست (بدون بلند شدن کل باکس) */
.pl-stage .pl-head{margin-bottom:8px}
.pl-stage .pp-poster-note{margin:0 0 10px}
.pl-stage .pp-eplist{margin-top:10px;max-height:188px}
.pl-stage .pl-links{margin-top:10px}
@media(max-width:799px){
  .pl-stage{padding:12px 12px 10px}
  .pl-stage .pl-head{gap:10px;margin-bottom:6px}
  .pl-stage .pl-head img,.pl-stage .pl-head i{width:52px;height:52px;border-radius:13px;font-size:1.4rem}
  .pl-stage .pp-poster-note{font-size:.82rem;line-height:1.8;margin-bottom:8px}
  .pl-stage .pp-eplist{max-height:150px}
  .pl-stage .pp-eplist button{padding:6px 10px;font-size:.84rem;line-height:1.7}
}
