/* Shared animated node-graph backdrop. Injected by background.js on every page
   except index.html (which has its own inline copy). Sits behind page content. */
.site-backdrop {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.site-backdrop .sb-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
}
.site-backdrop .sb-glow-a {
  top: -12%; left: -6%;
  width: 52vw; height: 46vw;
  background: radial-gradient(circle, rgba(0, 227, 143, 0.16), transparent 60%);
  animation: sbGlowDriftA 26s ease-in-out infinite, sbBootGlow 3s ease-out 1;
}
.site-backdrop .sb-glow-b {
  bottom: -18%; right: -12%;
  width: 48vw; height: 48vw;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.09), transparent 62%);
  animation: sbGlowDriftB 32s ease-in-out infinite, sbBootGlow 3.4s ease-out 1;
}
.site-backdrop #bgGraph {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
}
.site-backdrop .sb-vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(130% 90% at 50% -5%, transparent 48%, rgba(0, 0, 0, 0.72) 100%);
}

@keyframes sbGlowDriftA {
  0% { transform: translate(0, 0); }
  25% { transform: translate(5%, 4%); }
  50% { transform: translate(8%, 8%); }
  75% { transform: translate(3%, 4%); }
  100% { transform: translate(0, 0); }
}
@keyframes sbGlowDriftB {
  0% { transform: translate(0, 0); }
  25% { transform: translate(-5%, -3%); }
  50% { transform: translate(-8%, -6%); }
  75% { transform: translate(-3%, -2%); }
  100% { transform: translate(0, 0); }
}
@keyframes sbBootGlow {
  0% { opacity: 0; }
  60% { opacity: 1; }
  100% { opacity: 0.9; }
}
@media (prefers-reduced-motion: reduce) {
  .site-backdrop .sb-glow { animation: none; }
}