/* ============================================================
   A股量化分析 —— 全站氛围背景（所有页面共用，独立于 boot.css）
   「鎏金暗夜 · GILT TERMINAL」v5
   层次: 暖炭黑底 → 鎏金折线山峦(极缓流动) → 暖金绸带
       → 金/朱砂/青玉三色光晕球 → 透视数据地平线 → 金幕扫描
       → 星点+上升数据粒子 → 噪点质感 → 四周压暗
   性能: 仅 transform/opacity 动效; 移动端降模糊降透明度
   注意: bootSpin/bootSpinRev/bootHalo/bootDot 是 boot.css 启动动画
         依赖的 keyframes, 修改背景时必须保留
   ============================================================ */

/* 保留移动端橡皮筋/下拉刷新,仅优化 iOS 惯性滚动体验 */
html { height: 100%; -webkit-overflow-scrolling: touch; }

/* 20260911h: 按需求"加回动态背景 + 全站统一" —— 首页恢复科技感背景层,
   与 /advisor /admin /quality /paper /short* 等页面保持一致(极光流转 + 折线 + 粒子 + 扫描 + 暗角)。
   原先那条 `body.lp-body #techbg { display: none; }` 已移除。若要再次只在首页关闭该层,
   在此处追加 `body.lp-body #techbg { display: none; }` 即可。 */

#techbg {
  position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
  background:
    radial-gradient(70% 42% at 50% -12%, rgba(217, 164, 65, 0.10), transparent 68%),
    radial-gradient(50% 42% at -8% 104%, rgba(229, 72, 77, 0.05), transparent 62%),
    radial-gradient(48% 42% at 108% 102%, rgba(47, 191, 143, 0.04), transparent 64%),
    linear-gradient(178deg, #0e0d0a 0%, #100e0c 36%, #0a0908 76%, #050404 100%);
}

/* ---------- 鎏金折线山峦: 全屏量化折线纹理, 极缓横向流动(策略曲线意象) ---------- */
#techbg::before {
  content: ""; position: absolute; inset: -14% -420px;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='420' height='300'><g fill='none' stroke-width='1.3'><polyline points='0,232 30,214 60,222 90,178 120,196 150,150 180,168 210,124 240,146 270,102 300,128 330,86 360,116 390,74 420,98' stroke='%23d9a441' opacity='0.9'/><polyline points='0,268 40,252 80,262 120,224 160,244 200,204 240,226 280,182 320,208 360,164 420,192' stroke='%23a3762a' opacity='0.55'/><polyline points='0,150 46,168 92,140 138,162 184,120 230,148 276,108 322,138 368,96 420,126' stroke='%232fbf8f' opacity='0.38'/></g><g fill='%23f2c46a'><circle cx='150' cy='150' r='1.6' opacity='0.8'/><circle cx='270' cy='102' r='1.6' opacity='0.8'/><circle cx='390' cy='74' r='1.6' opacity='0.8'/></g></svg>");
  background-repeat: repeat;
  opacity: 0.08;
  -webkit-mask-image: linear-gradient(180deg, transparent 2%, #000 22%, #000 78%, transparent 98%);
          mask-image: linear-gradient(180deg, transparent 2%, #000 22%, #000 78%, transparent 98%);
  animation: tbCandleDrift 140s linear infinite;
  will-change: transform;
}
@keyframes tbCandleDrift { to { transform: translateX(-420px); } }

/* ---------- 暖金绸带: 上空缓慢摇曳的弥散光幕(金→朱砂双色谱) ---------- */
#techbg::after {
  content: ""; position: absolute; left: -28%; right: -28%; top: -18%; height: 64%;
  background: linear-gradient(102deg,
    transparent 8%,
    rgba(242, 196, 106, 0.065) 28%,
    rgba(217, 164, 65, 0.10) 48%,
    rgba(229, 122, 77, 0.055) 66%,
    rgba(47, 191, 143, 0.035) 82%,
    transparent 94%);
  filter: blur(46px);
  animation: tbRibbon 30s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes tbRibbon {
  0%   { transform: translateX(-2.6vw) rotate(-1.2deg) scale(1.03); }
  100% { transform: translateX(2.6vw) rotate(1.0deg) scale(1.08); }
}

/* ---------- 三色光晕球: 鎏金 / 朱砂 / 青玉, 大尺度缓慢漂移 ---------- */
.tb-aurora { position: absolute; border-radius: 50%; filter: blur(66px); opacity: 0.55; will-change: transform; }
.tb-a {
  width: 62vw; height: 62vw; left: -20vw; top: -24vw;
  background: radial-gradient(circle at 34% 34%, rgba(217, 164, 65, 0.24), rgba(163, 118, 42, 0.09) 56%, transparent 76%);
  animation: tbDrift 42s ease-in-out infinite;
}
.tb-b {
  width: 54vw; height: 54vw; right: -22vw; top: 2vh;
  background: radial-gradient(circle at 62% 42%, rgba(229, 72, 77, 0.16), rgba(163, 90, 42, 0.06) 55%, transparent 75%);
  animation: tbDrift 50s ease-in-out infinite reverse;
}
.tb-c {
  width: 46vw; height: 46vw; left: 26vw; bottom: -22vw;
  background: radial-gradient(circle at 50% 42%, rgba(47, 191, 143, 0.10), rgba(217, 164, 65, 0.05) 52%, transparent 74%);
  animation: tbDrift 58s ease-in-out infinite;
}
@keyframes tbDrift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(4.5vw, -3vw) scale(1.13); }
}

/* ---------- 透视数据地平线: 底部光晕 + 向观者流动的发光网格(鎏金) ---------- */
/* 20260911e: 按需求移除网格 —— 网格整体隐藏, 折线/绸带/光晕/粒子动态全部保留 */
.tb-grid {
  display: none;
  position: absolute; left: -32%; right: -32%; bottom: -9%; height: 50%;
  background: radial-gradient(88% 130% at 50% 116%, rgba(217, 164, 65, 0.11), transparent 64%);
  transform: perspective(520px) rotateX(62deg);
  transform-origin: 50% 100%;
  opacity: 0.9;
}
/* 地平线光晕 */
.tb-grid::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 34%;
  background: linear-gradient(180deg, rgba(242, 196, 106, 0.13), transparent 100%);
}
/* 网格线: 从地平线淡入, 向观者流动 */
.tb-grid::before {
  content: ""; position: absolute; left: 0; right: 0; top: -120px; bottom: 0;
  background:
    repeating-linear-gradient(90deg, rgba(217, 180, 100, 0.10) 0 1px, transparent 1px 78px),
    repeating-linear-gradient(0deg, rgba(217, 164, 65, 0.10) 0 1px, transparent 1px 58px);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 100%);
  animation: tbFloor 5.2s linear infinite;
  will-change: transform;
}
@keyframes tbFloor { to { transform: translateY(58px); } }

/* ---------- 金幕扫描: 自上而下的柔和光带 ---------- */
.tb-scan {
  position: absolute; left: 0; right: 0; top: -260px; height: 260px;
  background: linear-gradient(180deg, transparent, rgba(242, 196, 106, 0.045), transparent);
  animation: tbScan 15s linear infinite;
  will-change: transform;
}
@keyframes tbScan { to { transform: translateY(145vh); } }

/* ---------- 星点 + 上升数据粒子 ---------- */
.tb-particles { position: absolute; inset: 0; }
.tb-particles::before {
  content: ""; position: absolute; left: 0; top: 0; width: 2px; height: 2px; border-radius: 50%;
  background: transparent;
  box-shadow:
    6vw 12vh 0 0 rgba(242, 220, 170, 0.34), 15vw 6vh 0 0 rgba(242, 220, 170, 0.18),
    24vw 18vh 0 0 rgba(242, 220, 170, 0.28), 33vw 9vh 0 0 rgba(242, 220, 170, 0.15),
    42vw 22vh 0 0 rgba(242, 220, 170, 0.24), 51vw 5vh 0 0 rgba(242, 220, 170, 0.16),
    60vw 15vh 0 0 rgba(242, 220, 170, 0.28), 69vw 8vh 0 0 rgba(242, 220, 170, 0.20),
    78vw 19vh 0 0 rgba(242, 220, 170, 0.30), 87vw 11vh 0 0 rgba(242, 220, 170, 0.18),
    94vw 24vh 0 0 rgba(242, 220, 170, 0.24), 11vw 32vh 0 0 rgba(242, 220, 170, 0.18),
    29vw 38vh 0 0 rgba(242, 220, 170, 0.22), 47vw 34vh 0 0 rgba(242, 220, 170, 0.14),
    65vw 40vh 0 0 rgba(242, 220, 170, 0.20), 83vw 36vh 0 0 rgba(242, 220, 170, 0.24),
    19vw 52vh 0 0 rgba(242, 220, 170, 0.16), 38vw 58vh 0 0 rgba(242, 220, 170, 0.20),
    57vw 54vh 0 0 rgba(242, 220, 170, 0.14), 76vw 60vh 0 0 rgba(242, 220, 170, 0.18);
  animation: tbStarfield 11s ease-in-out infinite alternate;
}
@keyframes tbStarfield { from { opacity: 0.5; } to { opacity: 1; } }
.tb-particles i {
  position: absolute; bottom: -6px; width: 3px; height: 3px; border-radius: 50%;
  background: rgba(242, 210, 140, 0.95);
  box-shadow: 0 0 8px 2px rgba(217, 164, 65, 0.50);
  opacity: 0;
  animation: tbRise 16s linear infinite;
  will-change: transform, opacity;
}
@keyframes tbRise {
  0%   { transform: translateY(0) scale(0.7); opacity: 0; }
  8%   { opacity: 0.9; }
  80%  { opacity: 0.4; }
  100% { transform: translateY(-96vh) scale(1.15); opacity: 0; }
}
.tb-particles i:nth-child(1) { left: 6%;  animation-duration: 17s;   animation-delay: 0s; }
.tb-particles i:nth-child(2) { left: 16%; animation-duration: 13.5s; animation-delay: 2.4s; width: 2px; height: 2px; }
.tb-particles i:nth-child(3) { left: 27%; animation-duration: 19s;   animation-delay: 5.2s; }
.tb-particles i:nth-child(4) { left: 38%; animation-duration: 14.5s; animation-delay: 1.4s; width: 2px; height: 2px; }
.tb-particles i:nth-child(5) { left: 51%; animation-duration: 18s;   animation-delay: 7.6s; }
.tb-particles i:nth-child(6) { left: 63%; animation-duration: 13s;   animation-delay: 3.8s; width: 2px; height: 2px; }
.tb-particles i:nth-child(7) { left: 76%; animation-duration: 20s;   animation-delay: 6.4s; }
.tb-particles i:nth-child(8) { left: 89%; animation-duration: 15.5s; animation-delay: 0.9s; width: 2px; height: 2px; }

/* ---------- 噪点质感: 细腻胶片颗粒, 消除渐变色带 ---------- */
.tb-lines {
  position: absolute; inset: 0; opacity: 0.045;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
}

/* ---------- 四周压暗, 聚焦内容 ---------- */
.tb-vignette {
  position: absolute; inset: 0;
  background: radial-gradient(122% 96% at 50% 10%, transparent 54%, rgba(4, 3, 2, 0.60) 100%);
}

/* ---------- 移动端: 降 GPU 开销 ---------- */
@media (max-width: 480px) {
  #techbg::before { opacity: 0.055; animation-duration: 190s; }
  #techbg::after { filter: blur(28px); opacity: 0.8; }
  .tb-aurora { filter: blur(44px); opacity: 0.40; }
  .tb-lines { opacity: 0.035; }
  .tb-particles i { box-shadow: 0 0 5px 1px rgba(217, 164, 65, 0.38); }
}

/* ---------- 无障碍: 减少动态效果 ---------- */
@media (prefers-reduced-motion: reduce) {
  #techbg::before, #techbg::after, .tb-aurora, .tb-grid::before, .tb-scan,
  .tb-particles i, .tb-particles::before {
    animation: none !important; transition: none !important;
  }
}

/* ============================================================
   HUD 标识 —— 常驻左上角悬浮的高级徽记(非圆形)
   设计语汇：仿生"金锭棱镜" —— 六边形切面框架 + 逆向菱形轨道 + 晶体核心
   鎏金单色渐变，克制而统一, 与全站鎏金暗夜同语
   v20260910: 左上角徽记与统一顶栏(.aq-top)位置冲突, 按需求整体隐藏;
   后续样式全部保留, 删掉下面这行 display:none 即可恢复
   ============================================================ */
#hud {
  display: none;   /* ← 顶栏改造后不再需要角落徽记 */
  position: fixed;
  top: calc(env(safe-area-inset-top) + 14px);
  left: calc(env(safe-area-inset-left) + 14px);
  width: 96px; height: 96px;
  z-index: 2147483001;          /* 高于启动画面(#boot)与普通内容 */
  pointer-events: none;
  filter: drop-shadow(0 2px 22px rgba(217, 164, 65, 0.30));
  animation: hudFloat 7s ease-in-out infinite;   /* 悬浮上下微动 */
}
/* 六边形棱镜框架 —— 用负空间镂空出锐利渐变描边(非圆形主体轮廓) */
#hud .bc-seg {
  position: absolute; inset: 0;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background: linear-gradient(135deg, rgba(242,214,150,0.85), rgba(163,118,42,0.24) 48%, rgba(242,196,106,0.62));
}
#hud .bc-seg::after {
  content: ""; position: absolute; inset: 1.5px;
  clip-path: polygon(50% 2%, 97.5% 26.5%, 97.5% 73.5%, 50% 98%, 2.5% 73.5%, 2.5% 26.5%);
  background: #12100c;
}
/* 顺时针旋转的锐角菱形轨道 —— 打断圆形感，强化切面 */
#hud .bc-ticks {
  position: absolute; inset: 15px;
  border: 1px solid rgba(242, 196, 106, 0.55);
  background: linear-gradient(135deg, rgba(242, 196, 106, 0.06), transparent 62%);
  transform: rotate(45deg);
  box-shadow: inset 0 0 10px rgba(217, 164, 65, 0.14);
  animation: bootSpin 11s linear infinite;
}
/* 逆向旋转的内层菱形轨道 —— 增加景深与层次感 */
#hud .bc-orbit {
  position: absolute; inset: 21px;
  border: 1px solid rgba(242, 196, 106, 0.32);
  transform: rotate(45deg);
  box-shadow: inset 0 0 8px rgba(217, 164, 65, 0.10);
  animation: bootSpinRev 7.5s linear infinite;
}
/* 顶点高亮节点 —— 沿菱形轨道巡航的锐利光点 */
#hud .bc-orbit::before {
  content: ""; position: absolute; top: -2px; left: 50%; width: 6px; height: 6px;
  margin-left: -3px; transform: rotate(45deg); background: #fbeecb;
  box-shadow: 0 0 10px 3px rgba(242, 196, 106, 0.85);
}
#hud .bc-orbit::after {
  content: ""; position: absolute; bottom: -2px; left: 50%; width: 6px; height: 6px;
  margin-left: -3px; transform: rotate(45deg); background: rgba(242, 196, 106, 0.55);
  box-shadow: 0 0 8px 2px rgba(217, 164, 65, 0.5);
}
/* 内层六边形轮廓 —— 定义晶体边界，增加精密仪表的层级 */
#hud .bc-portal {
  position: absolute; inset: 27px;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background: linear-gradient(135deg, rgba(242,214,150,0.28), rgba(242,214,150,0.03) 55%, rgba(242,214,150,0.20));
  opacity: 0.75;
}
/* 中心晶体核心 —— 菱形切面 + 高光 */
#hud .bc-halo {
  position: absolute; inset: 31px;
  transform: rotate(45deg);
  border-radius: 4px;
  background:
    linear-gradient(135deg, rgba(251, 238, 203, 0.30), transparent 42%),
    linear-gradient(135deg, rgba(217, 164, 65, 0.44), rgba(140, 96, 22, 0.24));
  border: 1px solid rgba(242, 196, 106, 0.50);
  box-shadow: 0 0 18px rgba(217, 164, 65, 0.40), inset 0 0 12px rgba(217, 164, 65, 0.35);
  animation: bootHalo 4.6s ease-in-out infinite;
}
/* 中心呼吸光核 */
#hud .bc-dot {
  position: absolute; left: 50%; top: 50%; width: 9px; height: 9px;
  margin: -4.5px 0 0 -4.5px; transform: rotate(45deg);
  background: radial-gradient(circle, #fffdf5, rgba(242, 214, 150, 0.90) 52%, rgba(217, 164, 65, 0.00) 76%);
  box-shadow: 0 0 12px 4px rgba(217, 164, 65, 0.60);
  animation: bootDot 2.4s ease-in-out infinite;
}
/* HUD 悬浮:上下 + 轻微左右漂移,更有"悬浮"感(7s 循环) */
@keyframes hudFloat {
  0%, 100% { transform: translate(0, 0); }
  25%      { transform: translate(2px, 4px); }
  50%      { transform: translate(0, 7px); }
  75%      { transform: translate(-2px, 3px); }
}
@keyframes bootSpin { from { transform: rotate(45deg); } to { transform: rotate(405deg); } }
@keyframes bootSpinRev { from { transform: rotate(45deg); } to { transform: rotate(-315deg); } }
@keyframes bootHalo { 0%, 100% { transform: rotate(45deg) scale(0.9); opacity: 0.6; } 50% { transform: rotate(45deg) scale(1.08); opacity: 0.95; } }
@keyframes bootDot { 0%, 100% { transform: rotate(45deg) scale(0.72); opacity: 0.7; } 50% { transform: rotate(45deg) scale(1.18); opacity: 1; } }

/* HUD：移动端缩小 + 降开销 */
@media (max-width: 480px) {
  #hud {
    top: calc(env(safe-area-inset-top) + 10px);
    left: calc(env(safe-area-inset-left) + 10px);
    width: 80px; height: 80px; opacity: 0.92;
    filter: drop-shadow(0 2px 14px rgba(217, 164, 65, 0.24));  /* 移动端减淡阴影,省 GPU 且不糊 */
  }
}
/* HUD：减少动态效果 */
@media (prefers-reduced-motion: reduce) {
  #hud, #hud .bc-seg, #hud .bc-ticks, #hud .bc-orbit,
  #hud .bc-orbit::before, #hud .bc-orbit::after,
  #hud .bc-portal, #hud .bc-halo, #hud .bc-dot { animation: none !important; }
}
