/* HUNTER — LightRays 首页首屏光束 */
/* canvas 由 assets/lightrays.js 动态插入 .slide-aurora 内部:
   模糊光斑之上、压暗渐层(:after)之下,所以正文可读性不受影响
   position:absolute 是必须的 —— 静态元素会被 .blob 盖住 */

/* 首页首屏不再挂旧的蓝色极光底(那套 navy 渐变 + 三个蓝/青/紫光斑在别处还有用,
   只是首页不用了)。必须在这里静态去掉,不能靠脚本 create() 时再挂
   .lightrays-base-hidden:脚本要等 HTML 解析完才跑,那之前浏览器已经先 paint 了
   一屏蓝色(实测禁用 JS 时首屏是 rgb(30,43,62),b-r=+32,一眼就是蓝的)。
   ⚠ 特异性:主题那条是 `.slide-aurora[data-astro-cid]` = (0,2,0),
   光斑是 `.slide-aurora[data-astro-cid] .blob[data-astro-cid]` = (0,4,0),
   所以下面都补上作用域属性,别只靠加载顺序。
   ⚠ 这等于把首页的 base 固定成 hide:以后要回极光底,得连这里一起改。 */
.hero-slider .slide--aurora .slide-aurora[data-astro-cid-5auvlcfn] {
  background: none;
}

.hero-slider .slide--aurora .slide-aurora .blob[data-astro-cid-5auvlcfn] {
  display: none;
}

.lightrays-canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 900ms ease;
}

.lightrays-canvas.is-ready {
  opacity: 1;
}

/* 首屏那层 :after 是压暗"上半屏"的(原本给极光用),而光束正好从顶部来,
   不减弱的话光束会被压掉大半 —— 有 canvas 时才覆盖。 */
.slide-aurora.lightrays-on[data-astro-cid-5auvlcfn]:after,
.slide-aurora.lightrays-on:after {
  background: linear-gradient(#0a101a4d 0%, #0a101a26 45%, #0a101a00 72%);
}

/* base=hide:去掉极光底,光束直接落在纯黑上 */
.slide-aurora.lightrays-base-hidden[data-astro-cid-5auvlcfn],
.slide-aurora.lightrays-base-hidden {
  background: none;
}

.slide-aurora.lightrays-base-hidden .blob {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .lightrays-canvas {
    transition: none;
  }
}
