/* ============ 全站动效 (09-02 新增, 跟随大乐透选号馆新基线) ============
   原则: 只用 transform/opacity (GPU 友好); 错峰用 --i 变量; 尊重 prefers-reduced-motion;
   各列表 JS 端自行 cap --i 到不等的上限 (本文件最大 30), 避免大列表尾项等太久;
   高频重渲染场景 (搜索击键) 由 JS 加 no-anim 开关抑制动画, 防闪烁。
   在 style.css 之后加载, 只补 delay/animation, 不覆盖已有 hover 过渡。 */

/* ---- 通用 keyframes ---- */
/* 淡入+上滑 (行/列表项) */
@keyframes riseIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* 卡片弹入 (带轻微过冲, 呼应大乐透 ballIn) */
@keyframes cardPop {
  0%   { opacity: 0; transform: translateY(14px) scale(0.96); }
  60%  { opacity: 1; transform: translateY(-3px) scale(1.015); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
/* 弹层卡片弹入 */
@keyframes modalIn {
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
/* 弹层遮罩淡入 */
@keyframes overlayIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ---- 主站列表: style.css 已有 fadeUp 的元素, 只补错峰 delay ---- */
.battle-item, .champion-item, .player-card {
  animation-delay: calc(var(--i, 0) * 0.035s);
}

/* ---- 强度榜行 / 左栏英雄列表 ---- */
.tier-table tbody tr {
  animation: riseIn 0.3s ease backwards;
  animation-delay: calc(var(--i, 0) * 0.015s);
}
.hero-item {
  animation: riseIn 0.3s ease backwards;
  animation-delay: calc(var(--i, 0) * 0.012s);
}
/* 主站左侧英雄搜索击键高频重渲: 抑制动画 (app.js 与 augments.js 同模式) */
.hero-list.no-anim .hero-item { animation: none; }

/* ---- 最近同队卡 ---- */
.mate-card {
  animation: cardPop 0.32s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
  animation-delay: calc(var(--i, 0) * 0.05s);
}

/* ---- build.html 详情页 ---- */
.hero-header { animation: riseIn 0.35s ease backwards; }
/* tab 切换 (main/build 共用 .tab-panel, display 恢复时动画自动重跑) */
.tab-panel { animation: riseIn 0.25s ease; }
.rune-page-card { animation: riseIn 0.25s ease backwards; }

/* ---- 弹层 (share modal 等) ---- */
.modal-overlay { animation: overlayIn 0.18s ease; }
.modal { animation: modalIn 0.22s cubic-bezier(0.34, 1.56, 0.64, 1); }

/* ---- 按压反馈 (按钮物理感, 呼应大乐透 btn:active) ---- */
.tab-btn:active, .theme-toggle:active, .btn-review:active, .btn-refresh:active,
.qa-card:active, .tier-pos:active, .seg:active, .btn-load-more:active,
.history-clear:active, .battle-filter:active, .btn-back:active, .aug-top:active {
  transform: scale(0.97);
}

/* ---- 尊重系统"减弱动效" ---- */
@media (prefers-reduced-motion: reduce) {
  html *, html *::before, html *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: -0.01ms !important;  /* 压缩 delay: 否则减弱动效用户整个 delay 期看到首帧(opacity:0) */
    transition-duration: 0.01ms !important;
  }
}
