/* ================================================================
   v5.23 首屏字标特效
   ------------------------------------------------------------
   字标是点阵「流」进去的终点，所以特效顺着「能量汇聚」这条线做：
     · 全息扫光：一条青白光带循环扫过字标（screen 混合，像全息投影）
     · 入场显影线：入场时一道 1px 蓝线从中心向两侧拉开，字标随之显影
       （和 v5.21 的区块接缝光带同一套视觉语言）
     · 指针感应：指针靠近 → 扫光变亮、字标向指针微移，两侧点阵跟着激荡
   v5.23 调整：
     · 去掉扫光触发涟漪 / 指针触发涟漪（用户反馈太花）
     · 去掉字标周围的模糊蒙版（v4 原生 .v4-hero__halo 椭圆辉光 +
       v5.22 加的 .v5-logofx__glow 外发光），字标恢复锐利
     · 扫光位置交回 CSS keyframes —— JS 每帧写 transform 是为了给涟漪
       卡触发点，涟漪没了就不必再逐帧驱动，顺带把帧耗时拉回基线
   降级：prefers-reduced-motion / ?perf=1 / 页脚「减少动效」时全部停用。
   ================================================================ */

.v5-logofx {
  position: absolute;
  z-index: 5;
  transform: translate(-50%, -50%);
  pointer-events: none;
  --v5-logofx-heat: 0;
}

/* 扫光与显影线裁在字标盒子里 */
.v5-logofx__clip {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

/* ---------------- 全息扫光 ----------------
   位置交给 CSS keyframes 跑（合成器线程，不占主线程）。
   一轮 6.5s：前 2.3s 从左扫到右，之后停 4.2s 再重来。
   两端都完全在字标盒外，所以回到起点时的瞬间跳变看不见。 */
.v5-logofx__sweep {
  position: absolute;
  top: -34%;
  bottom: -34%;
  left: 0;
  width: 52%;
  background: linear-gradient(100deg,
    transparent 0%,
    rgba(118, 196, 255, .26) 28%,
    rgba(232, 249, 255, 1) 50%,
    rgba(118, 196, 255, .26) 72%,
    transparent 100%);
  mix-blend-mode: screen;
  transform: translateX(-330%);
  opacity: calc(.42 + .58 * var(--v5-logofx-heat));
  will-change: transform;
}
.js-motion .v5-logofx__sweep {
  animation: v5-logofx-sweep 6.5s linear infinite;
}
@keyframes v5-logofx-sweep {
  0%      { transform: translateX(-330%); }
  35.38%  { transform: translateX(320%); }
  100%    { transform: translateX(320%); }
}

/* ---------------- 入场显影线 ---------------- */
.v5-logofx__line {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 4%,
    rgba(150, 215, 255, .22) 24%,
    rgba(232, 248, 255, .95) 50%,
    rgba(150, 215, 255, .22) 76%,
    transparent 96%);
  transform: translate(-50%, -50%) scaleX(0);
  opacity: 0;
}
.js-motion .v5-logofx__line {
  animation: v5-logofx-line 1.7s .16s var(--v5-ease) both;
}
@keyframes v5-logofx-line {
  0%   { transform: translate(-50%, -50%) scaleX(0); opacity: 0; }
  14%  { opacity: .95; }
  38%  { transform: translate(-50%, -50%) scaleX(1); opacity: .95; }
  72%  { transform: translate(-50%, -50%) scaleX(1); opacity: .35; }
  100% { transform: translate(-50%, -50%) scaleX(1); opacity: 0; }
}

/* ================================================================
   降级
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
  .v5-logofx { display: none; }
}
html.perf .v5-logofx,
html.loops-paused .v5-logofx {
  display: none;
}
