/* ============================================================
 * perf.css —— 全站性能 / 动效加速层（最后加载，覆盖上面所有页面样式）
 * ------------------------------------------------------------
 *  目标：
 *    1. 去掉所有「等一下才动」的延迟（transition-delay / animation-delay）
 *    2. 过渡与一次性动画整体加速，点击立刻有反馈
 *    3. 循环动画（跑马灯 / 呼吸光）保留原来的节奏，避免眼睛难受
 *    4. 减少大面积模糊造成的滚动卡顿
 * ============================================================ */

/* 1) 过渡：统一 0.12s，取消延迟 */
*,
*::before,
*::after {
  transition-duration: .12s !important;
  transition-delay: 0s !important;
  animation-delay: 0s !important;
}

/* 2) 一次性出现动画（弹窗 / 提示 / 卡片入场）：压到 0.16s */
.toast,
.modal.show,
.modal-card,
.search-history,
.ripple,
.auth-wrap,
.block-card,
.vip-lock,
.share-box,
.share-qr,
.share-stat,
.short-card,
.m-card,
.res-card,
.cat-card,
.cat-circle,
.sr-chip,
.tbl tbody tr,
.card {
  animation-duration: .16s !important;
  animation-timing-function: ease-out !important;
}

/* 3) 骨架屏不再慢慢闪 */
.skeleton {
  animation-duration: .8s !important;
}

/* 4) 平滑滚动 → 瞬时，筛选 / 锚点不再「滑半天」 */
html,
body,
.flt-scroll,
.scroll-x {
  scroll-behavior: auto !important;
}

/* 5) 首屏图片不再淡入等待，直接显示 */
.m-cover img,
.res-pic img {
  transition: none !important;
}

/* 6) 触摸反馈立刻生效 */
.m-card:active,
.res-card:active,
.flt-chip:active,
.btn:active {
  transition-duration: .06s !important;
}

/* 7) 低性能设备：大面积毛玻璃直接降级，滚动更顺 */
@supports not (backdrop-filter: blur(1px)) {
  .topbar,
  .flt-box,
  .modal-card {
    background: var(--card, rgba(20, 24, 48, .96)) !important;
  }
}

/* 9) 会员角标只显示图标（不再带「黄金/钻石/超级会员」文字），做成小方标 */
.badge.vip {
  padding: 3px 6px !important;
  min-width: 21px;
  justify-content: center;
  gap: 0 !important;
  border-radius: 7px;
}
.badge.vip > i {
  font-size: .68rem;
  line-height: 1;
}

/* 11) 触屏设备：去掉 hover 位移 / 放大，点卡片不会「跳」一下 */
@media (hover: none) {
  .m-card:hover,
  .res-card:hover {
    transform: none !important;
    box-shadow: none !important;
  }
  .m-card:hover .m-cover img {
    transform: none !important;
  }
}

/* 12) 图片不可拖拽、不选中，长按不弹菜单 */
img {
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}

/* 13) 文字容器允许收缩，长标题不会把卡片撑破 */
.m-name,
.m-meta,
.m-info {
  min-width: 0;
}

/* 14) 尊重系统「减少动态效果」设置 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    transition-delay: 0s !important;
    animation-delay: 0s !important;
  }
}

/* 15) 布局减噪：统一淡边框，少一点分割线，页面更干净 */
.m-card,
.res-card,
.hs-card,
.dt-hero,
.flt-box,
.section-head {
  border-color: rgba(255, 255, 255, .07) !important;
}
.section-head {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.m-card,
.res-card {
  box-shadow: none !important;
}

/* =====================================================================
 * 16) 播放器页面整理：选集改成整齐网格，锁定按钮不再挤成一团
 * ===================================================================== */
body.play-page .pl-body{padding-bottom:16px}
body.play-page .section{margin-top:14px}
body.play-page .mv-info{padding:12px 13px;border-radius:15px}

body.play-page .ep-list{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(84px,1fr));
  gap:7px;
  max-height:268px;
  overflow-y:auto;
  overflow-x:hidden;
  scroll-snap-type:none;
  padding:4px 2px 8px;
}
body.play-page .ep-list::-webkit-scrollbar{width:4px}
body.play-page .ep-item{
  min-width:0 !important;
  padding:7px 5px !important;
  border-radius:10px !important;
  scroll-snap-align:none !important;
}
body.play-page .ep-item .ep-name{font-size:11px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.play-page .ep-item .ep-badge{font-size:8px;padding:1px 4px;top:-5px;right:-3px}

/* 未登录 / 会员不足：两个按钮等宽、居中、留白 */
body.play-page .play-lock{padding:22px 14px !important;border-radius:16px !important}
body.play-page .play-lock .lk-btns{
  display:flex !important;
  flex-wrap:wrap;
  justify-content:center;
  gap:9px;
  margin-top:14px;
  width:100%;
}
body.play-page .play-lock .lk-btns .btn{
  flex:1 1 118px;
  max-width:168px;
  min-height:38px;
  justify-content:center;
  border-radius:11px;
}
body.play-page .play-lock i{font-size:34px;display:block;margin-bottom:8px}
body.play-page .play-lock p{line-height:1.75}

/* =====================================================================
 * 17) 全站影片列表：光带自动扫过（手机也能看到）
 * ===================================================================== */
.m-card{position:relative;isolation:isolate}
.m-card::after{
  content:"";
  position:absolute;
  top:-10%;
  left:-70%;
  width:45%;
  height:120%;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 50%,rgba(255,255,255,0) 100%);
  transform:skewX(-18deg);
  pointer-events:none;
  opacity:0;
  z-index:2;
  animation:kinoAutoSweep 6.5s ease-in-out infinite;
}
/* 错开一点，不要整屏同时闪 */
.m-card:nth-child(3n+2)::after{animation-delay:1.2s}
.m-card:nth-child(3n)::after{animation-delay:2.4s}
.m-card:hover::after{animation:kinoSweep .8s ease-out}
@keyframes kinoAutoSweep{
  0%{left:-70%;opacity:0}
  4%{opacity:.9}
  18%{left:125%;opacity:0}
  100%{left:125%;opacity:0}
}
@keyframes kinoSweep{
  from{left:-70%;opacity:1}
  to{left:125%;opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .m-card::after{display:none !important}
}

/* =====================================================================
 * 18) 分类页：电影 / 资源 切换更明显
 * ===================================================================== */
#catPage .mv-tabs{
  display:flex !important;
  width:100%;
  gap:5px;
  padding:4px !important;
  border-radius:13px !important;
  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}
#catPage .mv-tab{
  flex:1 1 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:10px 8px !important;
  border-radius:10px !important;
  font-size:12.5px !important;
  font-weight:800;
  color:rgba(230,236,255,.72) !important;
  background:rgba(255,255,255,.04);
  border:1px solid transparent;
  transition:background .15s, color .15s, transform .12s;
}
#catPage .mv-tab i{font-size:14px !important}
#catPage .mv-tab.on{
  color:#fff !important;
  background:linear-gradient(135deg,var(--primary),var(--primary2)) !important;
  box-shadow:0 7px 18px rgba(91,140,255,.38) !important;
  border-color:rgba(255,255,255,.16);
}
#catPage .mv-tab:not(.on):active{background:rgba(255,255,255,.08)}

/* 资源卡片图标慢慢转，活着一点 */
.res-card .res-pic-icon{
  animation:kinoSpinSlow 7s linear infinite;
}
@keyframes kinoSpinSlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .res-card .res-pic-icon{animation:none}
}

/* =====================================================================
 * 19) 播放器锁定提示：按钮再小一号
 * ===================================================================== */
body.play-page .play-lock .lk-btns .btn{
  flex:0 1 auto;
  min-height:32px !important;
  padding:7px 14px !important;
  font-size:11.5px !important;
  border-radius:9px !important;
  max-width:none;
}
body.play-page .play-lock .lk-btns{gap:8px !important;margin-top:10px !important}
body.play-page .play-lock{padding:18px 12px !important}
body.play-page .play-lock i{font-size:28px !important}
body.play-page .play-lock p{font-size:11.5px !important;line-height:1.6 !important;margin:0 !important}


/* ============================================================
 * ★ 加载加速层
 *   · 逐项入场延迟清零（列表不再一项一项慢慢冒出来）
 *   · 图片解码异步，不阻塞首屏
 * ============================================================ */
.m-card, .res-card, .cat-card, .short-card, .hs-card, .tbl tbody tr,
.m-card:nth-child(n), .res-card:nth-child(n), .cat-card:nth-child(n){
  animation-delay: 0s !important;
  transition-delay: 0s !important;
}
img { decoding: async; }
