/* Background-only integration of the supplied final package. */
:root{--bg-0:#000}
html{background:#000}
body{background:#000;isolation:isolate}
main{--card:rgba(16,16,16,.5)}
#pillars .event-grid{grid-auto-rows:1fr}
body::before,body::after{content:none;display:none}
.hs-bg,.hs-grid,.hs-glow,.hs-vignette,.hs-ripple,.cursor-glow{display:none}
.hero,.hero-stage{background:transparent}
.ev-img::after{content:none}
.sky-layer{
  position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  --star-density:12;            /* 每 10×10px 区域的星点期望值 */
}
/* 星点容器：JS 填充 span，纯 CSS 随机闪烁 */
.sky-stars{position:absolute;inset:-2%}
.sky-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sky-stars i{
  position:absolute;border-radius:50%;background:#fff;
  will-change:opacity;animation:skyTwinkle linear infinite;
}
/* 大星：带柔和光晕，亮度更高 */
.sky-stars i.b{box-shadow:0 0 4px 1px rgba(255,255,255,.55),0 0 10px 1px rgba(255,255,255,.18);background:#f4f6f9}
/* 中等星：微光晕 */
.sky-stars i.m{box-shadow:0 0 3px rgba(255,255,255,.4)}
/* 闪烁动画：随机起点、随机周期、慢速呼吸（DOM 备用，主力已迁 canvas） */
@keyframes skyTwinkle{
  0%  {opacity:var(--a,1)}
  38% {opacity:.14}
  62% {opacity:var(--a,1)}
  100%{opacity:var(--a,1)}
}
/* The bright head moves down-right; its expanding tail points back up-left. */
.sky-meteor{
  position:absolute;top:-1.5px;left:calc(0px - var(--len));height:3px;width:var(--len);
  transform-origin:100% 50%;border-radius:999px;
  pointer-events:none;opacity:0;will-change:transform,opacity;
  background:linear-gradient(90deg,transparent,rgba(214,229,255,.12) 25%,rgba(235,243,255,.65) 72%,#fff 100%);
  filter:drop-shadow(0 0 5px rgba(229,240,255,.65));
  animation:skyMeteor 3.6s cubic-bezier(.35,.08,.75,.85) 1 both;
}
/* 流星头部亮点 */
.sky-meteor::before{
  content:'';position:absolute;right:-3px;top:50%;width:7px;height:7px;border-radius:50%;
  background:#fff;transform:translateY(-50%);box-shadow:0 0 9px 2px rgba(255,255,255,.85),0 0 24px 4px rgba(209,227,255,.3);
}
/* Each meteor has one flight; JS removes it and schedules a fresh random path. */
@keyframes skyMeteor{
  0%{opacity:0;transform:translate3d(var(--start-x),var(--start-y),0) rotate(var(--angle)) scale(.22)}
  12%{opacity:.85}
  68%{opacity:1}
  100%{opacity:0;transform:translate3d(var(--end-x),var(--end-y),0) rotate(var(--angle)) scale(1.6)}
}

.sky-meteors{position:absolute;inset:0}
@media(prefers-reduced-motion:reduce){.sky-meteors{display:none}}