/* ============================================================
   OctoLab 品牌光效 · 全站共用(纯静态无构建,各页 <link> 引入)
   用法:
   1. <head> 内引入:
      <link rel="stylesheet" href="/site-assets/brand-fx.css">
   2. 页脚静态余韵:在 <footer> 前放
      <div class="nebula-echo" aria-hidden="true"></div>
   3. 动效星云(目前仅首页 Hero,新页面可复用):
      SVG 结构见 index.html 的 .octo-stage(模糊旋臂 + 星尘 + 星点),
      动画类 .nb-spin / .nb-spin-rev / .nb-core / .nb-star / .nb-wisp
      由本文件统一提供;转速用 --spinT、核心亮度用 --bo 调节。
   ============================================================ */

/* ---------- 静态余韵:纯渐变,零动画,零性能负担 ---------- */
.nebula-echo{
  height:200px;margin-bottom:-30px;pointer-events:none;
  background:
    radial-gradient(560px 210px at 70% 62%,rgba(46,110,232,.09),transparent 70%),
    radial-gradient(460px 190px at 30% 58%,rgba(16,160,147,.06),transparent 70%),
    radial-gradient(340px 160px at 52% 74%,rgba(124,211,255,.045),transparent 70%);
}
@media(max-width:880px){
  .nebula-echo{height:130px}
}

/* ---------- 动效星云动画(首页 Hero;复用时直接加类) ---------- */
@keyframes nbSpin{to{transform:rotate(-360deg)}}
@keyframes nbSpinR{to{transform:rotate(360deg)}}
@keyframes nbBreathe{0%,100%{opacity:calc(var(--bo,1)*.5);transform:scale(.96)}50%{opacity:calc(var(--bo,1)*.85);transform:scale(1.06)}}
@keyframes nbTwinkle{0%,100%{opacity:.12}50%{opacity:.85}}
.nb-spin{transform-origin:300px 300px;animation:nbSpin var(--spinT,120s) linear infinite}
.nb-spin-rev{transform-origin:300px 300px;animation:nbSpinR var(--spinT,150s) linear infinite}
.nb-wisp{mix-blend-mode:screen}
.nb-core{transform-origin:300px 300px;animation:nbBreathe 7s ease-in-out infinite}
.nb-star{animation:nbTwinkle 4.5s ease-in-out infinite}

/* 减弱动态偏好:星云静止,保留静态观感 */
@media (prefers-reduced-motion:reduce){
  .nb-spin,.nb-spin-rev,.nb-core,.nb-star{animation:none}
}

/* ---------- 跨文档 View Transition(全站页面互跳时内容淡入、导航恒定) ----------
   两侧页面都引入本文件即生效;不支持的浏览器自动降级为普通跳转 */
@view-transition{navigation:auto}
nav{view-transition-name:site-nav}
@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
