/* 科技感背景 + 配色（参考 d:/chat4 的 SibyX welcome-bg）
   调色板与 SibyX 一致：青绿 --accent #2de2c4 / 蓝 --accent-2 #6c8cff / 深底 --bg #0b0f1a */
:root {
  --bg: #0b0f1a;
  --panel: #131a2b;
  --panel-2: #1a2340;
  --accent: #2de2c4;
  --accent-2: #6c8cff;
  --text: #e7ecf5;
  --muted: #8a97b3;
  --danger: #ff5d6c;
  --ok: #38d39f;
  --warn: #ffcc66;
  --border: rgba(108,140,255,.18);
}

* { box-sizing: border-box; }

html {
  margin: 0; min-height: 100%;
  /* 与 SibyX 同源的深空径向渐变（仅 html 设底色，body 透明以透出 .tech-bg）*/
  background: radial-gradient(1200px 600px at 80% -10%, #16213f 0%, var(--bg) 55%);
  background-attachment: fixed;
}
body { color: var(--text);
  font-family: "Segoe UI", system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; }

/* 固定全屏背景层：网格 + 双色光晕 + 节点连线（z-index:-1 置于内容之下，且不破坏 sticky 导航）*/
.tech-bg { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.wg-grid {
  position: absolute; inset: -2px;
  background-image:
    linear-gradient(rgba(45,226,196,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(45,226,196,.06) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(circle at 50% 38%, #000 22%, transparent 78%);
          mask-image: radial-gradient(circle at 50% 38%, #000 22%, transparent 78%);
}
.wg-glow { position: absolute; border-radius: 50%; filter: blur(64px); opacity: .5; }
.wg-glow-1 { width: 540px; height: 540px; left: -130px; top: -110px;
  background: radial-gradient(circle, rgba(45,226,196,.42), transparent 70%);
  animation: wgf 14s ease-in-out infinite alternate; }
.wg-glow-2 { width: 480px; height: 480px; right: -110px; bottom: -130px;
  background: radial-gradient(circle, rgba(108,140,255,.42), transparent 70%);
  animation: wgf 18s ease-in-out infinite alternate-reverse; }
@keyframes wgf { from { transform: translate(0,0) scale(1); } to { transform: translate(40px,30px) scale(1.15); } }
.wg-nodes { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .5; }
.wg-lines line { stroke: var(--accent); stroke-width: 1.2; opacity: .35;
  stroke-dasharray: 6 10; animation: wgdash 3.2s linear infinite; }
@keyframes wgdash { to { stroke-dashoffset: -32; } }
.wg-dots circle { fill: var(--accent-2); filter: drop-shadow(0 0 6px rgba(108,140,255,.8)); animation: wgpulse 3.4s ease-in-out infinite; }
.wg-dots circle:nth-child(2n) { fill: var(--accent); }
@keyframes wgpulse { 0%,100% { opacity: .55; } 50% { opacity: 1; } }