/* ==========================================================================
   css/player.css — 播放器元素细节、状态、动画
   ========================================================================== */

/* ── 视频元素 ── */
.vid{background:#000;outline:none}
.vid::-webkit-media-controls{display:none !important}   /* 用自定义进度条，不用原生控件 */
.vid::-webkit-media-controls-enclosure{display:none !important}

/* ── 中央提示（点击播放 / 暂停中） ── */
.play-badge{transition:opacity .2s}
.center-hint.fade .play-badge{opacity:.35}

/* ── 加载中 ── */
.loading{gap:12px}
.loading::before{
  content:"";
  width:26px;height:26px;border-radius:50%;
  border:2px solid rgba(201,162,39,.25);
  border-top-color:var(--gold);
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── 片段切换动画（第二阶段接线时启用；此处预置） ── */
.stage.swipe-up{animation:swUp .26s ease}
.stage.swipe-down{animation:swDown .26s ease}
@keyframes swUp{
  0%{transform:translateY(14%);opacity:.4}
  100%{transform:translateY(0);opacity:1}
}
@keyframes swDown{
  0%{transform:translateY(-14%);opacity:.4}
  100%{transform:translateY(0);opacity:1}
}

/* ── 进度条已播部分 ── */
.bar{will-change:width}

/* ── 声音开启态的脉冲提示 ── */
.act.on .ico{animation:pulse .5s ease}
@keyframes pulse{
  0%{transform:scale(1)}
  50%{transform:scale(1.14)}
  100%{transform:scale(1)}
}

/* ── 错误态 ── */
.errbox{background:rgba(11,10,9,.92)}
.errmsg{font-size:13px;line-height:1.8;max-width:34em}

/* ── 减少动效偏好 ── */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}