/* 站级播客：右侧浮动竖轨的第三颗钮（回到顶部 / 数字台账 / 播客）、
   从钮心扩散的苹果播客式播放面板、可最小化的迷你条。
   只新增 .sidepod / .pod-* / .po-* 类，styles.css 里的旧钮规则一行不动。
   颜色只用 :root 的六族令牌，透明度一律 rgb(var(--x-rgb)/α)。 */

/* ---------- 竖轨第三颗钮：沿用两颗旧钮的胶囊造型 ---------- */
.siderail .sidepod{display:flex;flex-direction:column;align-items:center;gap:.34rem;
  padding:.62rem .48rem .55rem;font:inherit;cursor:var(--cur-hand);
  border-radius:99px;border:1px solid rgb(var(--ink2-rgb)/.2);
  background:rgb(var(--paperhi-rgb)/.92);backdrop-filter:blur(10px);color:var(--tx2);
  box-shadow:0 10px 26px rgb(var(--ink-rgb)/.2);
  transition:background var(--dur-standard),color var(--dur-standard),border-color var(--dur-standard)}
.siderail .sidepod .ar{display:block;font-style:normal;font-size:1.05rem;line-height:1;color:var(--gold-d);
  transition:var(--dur-quick)}
.siderail .sidepod .ar svg{display:block;width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.siderail .sidepod .lb{writing-mode:vertical-rl;font-size:.74rem;letter-spacing:.2em}
.siderail .sidepod:hover,.siderail .sidepod:focus-visible{background:var(--gold);border-color:var(--gold);
  color:var(--ink2)}
.siderail .sidepod:hover .ar,.siderail .sidepod:focus-visible .ar{color:var(--ink2)}
.siderail .sidepod[data-st=pause] .ar{color:var(--cinnabar)}
.siderail .sidepod[data-st=pause]:hover .ar,.siderail .sidepod[data-st=pause]:focus-visible .ar{color:var(--ink2)}
@media (max-width:640px){
  .siderail .sidepod{padding:.5rem .38rem .45rem}
  .siderail .sidepod .lb{font-size:.72rem;letter-spacing:.14em}
}

/* ---------- 全屏面板：从钮心扩散的圆 + 虚化封面 + 居中卡片 ---------- */
.podcast-overlay{position:fixed;inset:0;z-index:90;overflow:hidden}
.po-veil{position:absolute;inset:0;background:rgb(var(--ink-rgb)/.58);opacity:0;
  backdrop-filter:blur(3px);transition:opacity .38s ease;pointer-events:none}
.po-veil.show{opacity:1}
.po-circle{position:absolute;border-radius:50%;background:var(--paper-hi);pointer-events:none;
  overflow:hidden;transform:scale(0);transition:transform .55s cubic-bezier(.32,.72,0,1)}
.po-circle.expand{transform:scale(1)}
.po-bg{position:absolute;inset:-18%;background-position:center;background-size:cover;
  filter:blur(54px) saturate(1.18);transform:scale(1.12);opacity:.6}
.po-frame{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:clamp(.7rem,3vw,2rem);opacity:0;transform:scale(.72);
  transition:opacity .3s ease .16s,transform .46s cubic-bezier(.2,.8,.2,1) .16s;
  pointer-events:none}
.po-frame.in{opacity:1;transform:none;pointer-events:auto}
.po-card{position:relative;width:min(24.5rem,100%);max-height:calc(100vh - 2rem);
  max-height:calc(100dvh - 2rem);overflow:auto;overscroll-behavior:contain;
  padding:1.15rem 1.45rem 1.25rem;text-align:center;
  border:1px solid rgb(var(--gold-rgb)/.26);border-radius:20px;
  background:rgb(var(--paperhi-rgb)/.95);backdrop-filter:blur(20px) saturate(1.08);
  box-shadow:0 34px 90px rgb(var(--ink-rgb)/.46),0 2px 8px rgb(var(--ink-rgb)/.2)}
.po-grab{position:absolute;top:.42rem;left:50%;width:2.5rem;height:3px;margin-left:-1.25rem;
  border-radius:99px;background:rgb(var(--tx-rgb)/.16)}
.po-top{display:flex;align-items:center;gap:.4rem;margin:.05rem 0 .55rem;min-height:1.7rem}
.po-min{display:inline-flex;align-items:center;gap:.18rem;padding:.2rem .1rem;font:inherit;font-size:.66rem;
  border:0;background:transparent;color:var(--tx2);cursor:var(--cur-hand)}
.po-min svg{width:.9rem;height:.9rem;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.po-min:hover{color:var(--cinnabar)}
.po-live{margin-inline:auto;font-family:var(--sans);font-size:.6rem;letter-spacing:.26em;color:var(--gold-d)}
.po-x{display:grid;place-items:center;width:1.75rem;height:1.75rem;padding:0;border:0;border-radius:50%;
  background:transparent;color:var(--tx2);font-size:1.15rem;line-height:1;cursor:var(--cur-hand)}
.po-x:hover{background:rgb(var(--cinn-rgb)/.09);color:var(--cinnabar)}
.po-cover{display:block;width:min(17rem,78%);height:auto;aspect-ratio:1;margin:.1rem auto 0;
  border-radius:14px;object-fit:cover;background:var(--paper2);
  box-shadow:0 18px 44px rgb(var(--ink-rgb)/.22),0 2px 6px rgb(var(--ink-rgb)/.12)}
.po-kicker{margin:1.05rem 0 .16rem;font-family:var(--sans);font-size:.62rem;letter-spacing:.24em;
  color:var(--gold-d)}
.po-title{margin:0;font-size:1.16rem;line-height:1.45;font-weight:700;letter-spacing:.01em;color:var(--tx)}
.po-show{margin:.34rem 0 0;font-family:var(--sans);font-size:.68rem;color:var(--tx2);letter-spacing:.02em}
.po-show span{margin:0 .3rem;color:rgb(var(--gold-rgb)/.6)}
.po-seekwrap{margin:1.15rem 0 0}
.po-seek{width:100%;height:1.3rem;margin:0;-webkit-appearance:none;appearance:none;background:transparent;
  cursor:var(--cur-hand)}
.po-seek::-webkit-slider-runnable-track{height:.2rem;border-radius:99px;
  background:linear-gradient(90deg,var(--gold) 0 var(--pct,0%),rgb(var(--tx-rgb)/.13) var(--pct,0%) 100%)}
.po-seek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:.7rem;height:.7rem;
  margin-top:-.25rem;border-radius:50%;background:var(--paper-hi);border:1px solid var(--gold-d);
  box-shadow:0 1px 3px rgb(var(--ink-rgb)/.2)}
.po-seek::-moz-range-track{height:.2rem;border-radius:99px;background:rgb(var(--tx-rgb)/.13)}
.po-seek::-moz-range-progress{height:.2rem;border-radius:99px;background:var(--gold)}
.po-seek::-moz-range-thumb{width:.64rem;height:.64rem;border-radius:50%;
  background:var(--paper-hi);border:1px solid var(--gold-d)}
.po-seek:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.po-times{display:flex;justify-content:space-between;margin-top:.05rem;font-family:var(--sans);
  font-size:.64rem;color:var(--tx2);font-variant-numeric:tabular-nums;letter-spacing:.03em}
.po-ctl{display:flex;align-items:center;justify-content:center;gap:1.6rem;margin:.45rem 0 .05rem}
.po-skip{display:grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:50%;
  background:transparent;color:var(--tx);cursor:var(--cur-hand);transition:background-color var(--dur-immediate)}
.po-skip:hover{background:rgb(var(--tx-rgb)/.07)}
.po-skip svg{width:1.8rem;height:1.8rem}
.po-skip text{font-family:var(--sans);font-size:6.6px;font-weight:600}
.po-play{display:grid;place-items:center;width:3.85rem;height:3.85rem;padding:0;border:0;border-radius:50%;
  background:var(--ink);color:var(--paper-hi);cursor:var(--cur-hand);
  box-shadow:0 8px 20px rgb(var(--ink-rgb)/.24);
  transition:transform 120ms,background-color var(--dur-immediate)}
.po-play:hover{transform:scale(1.035)}
.po-play svg{width:1.5rem;height:1.5rem}
.po-play[data-st=play] .i-pause,.po-play[data-st=pause] .i-play{display:none}
.po-tools{display:flex;align-items:center;justify-content:center;gap:.45rem;flex-wrap:wrap;margin:.8rem 0 0}
.po-chip{display:inline-flex;align-items:center;gap:.3rem;font:inherit;font-size:.68rem;
  padding:.3rem .7rem;border:1px solid var(--line);border-radius:99px;background:transparent;
  color:var(--tx2);cursor:var(--cur-hand);text-decoration:none;
  transition:border-color var(--dur-immediate),background-color var(--dur-immediate),color var(--dur-immediate)}
.po-chip:hover{border-color:rgb(var(--gold-rgb)/.6);background:rgb(var(--gold-rgb)/.1);color:var(--gold-d)}
.po-chip svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.po-chip b{font-weight:600;color:var(--gold-d)}
.po-note{margin:1.05rem 0 0;padding-top:.7rem;border-top:1px dashed var(--line);
  font-size:.64rem;line-height:1.8;color:var(--tx2);text-align:left}
.po-note a{color:var(--gold-d)}
.po-err{margin:.6rem 0 0;font-size:.68rem;color:var(--cinnabar-d)}

/* ---------- 迷你条：最小化后停在左下；z 低于账表抽屉，账表一开就让位 ---------- */
.pod-mini{position:fixed;z-index:65;left:clamp(.7rem,1.8vw,1.6rem);bottom:clamp(4.2rem,11vh,6.5rem);
  width:min(21.5rem,calc(100vw - 1.4rem));display:none;align-items:center;gap:.5rem;
  padding:.5rem .55rem .62rem;border:1px solid var(--line);border-radius:14px;
  background:rgb(var(--paperhi-rgb)/.96);box-shadow:0 14px 36px rgb(var(--ink-rgb)/.22);
  backdrop-filter:blur(12px)}
body.pod-mini-on .pod-mini{display:flex}
body.app-mode .pod-mini{z-index:54;left:calc(15.5rem + 1rem);bottom:5.4rem;
  width:min(21rem,calc(100vw - 18rem))}
.pd-open{display:flex;align-items:center;gap:.55rem;flex:1 1 auto;min-width:0;padding:0;
  border:0;background:transparent;color:inherit;text-align:left;cursor:var(--cur-hand)}
.pd-cover{flex:0 0 2.45rem;width:2.45rem;height:2.45rem;border-radius:7px;object-fit:cover;background:var(--paper2)}
.pd-t{min-width:0}
.pd-t b{display:block;font-size:.74rem;font-weight:600;color:var(--tx);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pd-t span{display:block;margin-top:.1rem;font-family:var(--sans);font-size:.62rem;color:var(--tx2);
  font-variant-numeric:tabular-nums}
.pd-play{display:grid;place-items:center;flex:0 0 auto;width:2.1rem;height:2.1rem;padding:0;border:0;
  border-radius:50%;background:var(--ink);color:var(--paper-hi);cursor:var(--cur-hand)}
.pd-play svg{width:1rem;height:1rem}
.pd-play[data-st=play] .i-pause,.pd-play[data-st=pause] .i-play{display:none}
.pd-x{display:grid;place-items:center;flex:0 0 auto;width:1.5rem;height:1.5rem;padding:0;border:0;
  background:transparent;color:var(--tx2);cursor:var(--cur-hand)}
.pd-x:hover{color:var(--cinnabar)}
.pd-x svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.pd-bar{position:absolute;left:.55rem;right:.55rem;bottom:.24rem;height:2px;border-radius:2px;
  overflow:hidden;background:rgb(var(--tx-rgb)/.12)}
.pd-bar b{display:block;width:0;height:100%;border-radius:2px;background:var(--gold)}

@media (max-width:640px){
  .pod-mini{left:.7rem;right:.7rem;bottom:4.6rem;width:auto}
  body.app-mode .pod-mini{bottom:6.2rem;width:auto}
  .po-card{padding:1.05rem 1.05rem 1.1rem;border-radius:16px}
  .po-cover{width:min(14.5rem,74%)}
  .po-kicker{letter-spacing:.18em}
}
@media (max-height:700px){
  .po-cover{width:min(11.5rem,54%)}
  .po-kicker{margin-top:.7rem}
  .po-seekwrap{margin-top:.8rem}
  .po-note{margin-top:.7rem;padding-top:.5rem}
}
@media (prefers-reduced-motion:reduce){
  .po-circle,.po-frame,.po-veil{transition-duration:.01ms!important;transition-delay:0s!important}
}
