/* ============================================================
   aurora.css —— 零依赖 Aurora 背景（方案 B：SVG 色带 + CSS，无 JS 无依赖）
   依赖 tokens.css，必须在其后加载；引用须带 ?v=（/assets/ 缓存 30 天）。

   配色配方：秋杏（暖调，2026-09-10 按《零依赖背景方案细节》§4.2 落定）。
   换配方只动下方 --au-a、--au-b、--au-c 三组共九个色值；换浓淡/速度/羽化只动 --au-* 参数。
   注意：linearGradient id 固定前缀 au-，同一页只允许挂一个实例，两实例会串色。

   对比度保护（§5）：色带最浓处会击穿正文 AA，须在文字块之下垫一层从 var(--bg)
   渐隐的底色。遮罩范围必须跟随文字块几何（各落点不同），故这层不在本组件里 ——
   由页面在文字容器上自做（见 landing.html 的 .lp-inner::before 毛边光晕）。
   ============================================================ */
:root{
  --au-op:.5;              /* 色带浓度：0.5 时单带对 --ink ≥5.3:1（§5 实算） */
  --au-blur:60px;          /* 羽化半径（仅 .aurora--static 兜底变体在用；主方案烘焙进 SVG） */
  --au-h:33%;              /* 单条高度占容器比例 */
  --au-t-a:14s; --au-t-b:18s; --au-t-c:22s;   /* 质数邻近、正反向交替 */
  /* —— 秋杏三带渐变 stop（band 内 <stop> 经类名取这里的色）—— */
  --au-a1:#d8b285; --au-a2:#e4c8a4; --au-a3:#cea173;   /* 杏 */
  --au-b1:#c4b493; --au-b2:#d4c6a9; --au-b3:#b7a67f;   /* 麦 */
  --au-c1:#c9a7a0; --au-c2:#dbc0ba; --au-c3:#be958e;   /* 藕 */
}

.aurora{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
        isolation:isolate;                 /* 关键：隔离 multiply，防与外层玻璃/底色串色 */
        background:var(--bg)}              /* 关键：组内垫不透明底色。隔离组里若没有这层，
                                              色带会乘在半透明的「彼此」上，叠出比 §5 公式
                                              更暗的中性灰，对比度保护层会算不准 */
.aurora__defs{position:absolute;width:0;height:0}

/* 羽化档位（§6）：默认用「次选档」——模糊经 auBlur filter 烘焙进 SVG 光栅
   （stdDeviation 46 + saturate 1.22，见页面内单例 filter），动画只动 transform，
   模糊纹理只算一次。不要改回 CSS filter:blur()（「备选档」）：实测软件渲染下
   每帧重算模糊，帧率掉到 11fps。 */
.aurora__band{position:absolute;left:-20%;width:140%;height:var(--au-h);
  opacity:var(--au-op);mix-blend-mode:multiply}
.aurora__band svg{width:100%;height:100%;display:block}
.aurora__band--a{top:26%}
.aurora__band--b{top:40%}
.aurora__band--c{top:48%}
.aurora__band stop{stop-color:var(--au-a1)}            /* 兜底，下面按类覆写 */
.aurora__band .au-a2{stop-color:var(--au-a2)}
.aurora__band .au-a3{stop-color:var(--au-a3)}
.aurora__band--b stop{stop-color:var(--au-b1)}
.aurora__band--b .au-b2{stop-color:var(--au-b2)}
.aurora__band--b .au-b3{stop-color:var(--au-b3)}
.aurora__band--c stop{stop-color:var(--au-c1)}
.aurora__band--c .au-c2{stop-color:var(--au-c2)}
.aurora__band--c .au-c3{stop-color:var(--au-c3)}

/* 文字保护层（§5 规则 2）：色带最浓处会击穿正文 AA，须在文字块之下垫一层
   从 var(--bg) 渐隐的底色。因为遮罩范围必须跟随文字块几何（各落点不同），
   这层不放在本组件里 —— 由页面在文字容器上自做（见 landing.html 的
   .lp-inner::before：var(--bg) 半透明毛边光晕，自对齐文字块）。 */

/* 上下淡出，让色带融入页面底色 */
.aurora::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--bg) 0%,transparent 26%,transparent 62%,var(--bg) 100%)}

/* 渐进增强：默认即静态色带，仅在系统未要求减弱动效时才动（与 ui.css 同一写法） */
@media (prefers-reduced-motion:no-preference){
  .aurora__band{will-change:transform}
  .aurora__band--a{animation:auDriftA var(--au-t-a) var(--ease-ui,cubic-bezier(.2,.6,.2,1)) infinite alternate}
  .aurora__band--b{animation:auDriftB var(--au-t-b) var(--ease-ui,cubic-bezier(.2,.6,.2,1)) infinite alternate-reverse}
  .aurora__band--c{animation:auDriftC var(--au-t-c) var(--ease-ui,cubic-bezier(.2,.6,.2,1)) infinite alternate}
}
@keyframes auDriftA{from{transform:translate3d(-3%,0,0)}to{transform:translate3d(3%,-1.5%,0) rotate(.6deg)}}
@keyframes auDriftB{from{transform:translate3d(2%,1%,0)}to{transform:translate3d(-4%,-1%,0) scaleY(1.06)}}
@keyframes auDriftC{from{transform:translate3d(-2%,1.5%,0) scaleY(1.04)}to{transform:translate3d(4%,0,0)}}

/* 移动端：第三带不参与绘制（等效模板层去掉节点），降浓度；
   羽化已烘焙进 SVG，无法按断点调，靠降层与降浓度控成本 */
@media (max-width:680px){
  .aurora__band{--au-op:.42}
  .aurora__band--c{display:none}
}

/* 极端兜底：不想要 SVG 时的静态三带变体（容器加 .aurora--static，
   内部 band 节点可整段省略） */
.aurora--static .aurora__band{display:none}
.aurora--static::before{content:"";position:absolute;inset:0;
  opacity:var(--au-op);filter:blur(var(--au-blur)) saturate(115%);
  background:
    linear-gradient(180deg,transparent 24%,var(--au-a2) 42%,transparent 62%),
    linear-gradient(97deg,transparent 30%,var(--au-b2) 48%,transparent 66%),
    linear-gradient(83deg,transparent 34%,var(--au-c2) 52%,transparent 70%)}
