/*
 * G Vault — Neural Observatory Background
 * Background-only styles. Foreground app UI remains in style.css.
 */
#app {
  /* Palette values are inherited from design-tokens.css via #app[data-preset]. */
  --glow-a: var(--gv-preset-a);
  --glow-b: var(--gv-preset-b);
  --glow-x: 88%;
  --glow-y: 14%;
  --core-x: 84%;
  --core-y: 22%;
  --core-size: 760px;
  --core-rotate: -6deg;
  --brain-opacity: 0.65;
}

#app.has-neural-background::before,
#app.has-neural-background::after {
  content: none !important;
  display: none !important;
}

.neural-background {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: var(--gv-bg-atmosphere);
  contain: paint;
}

.neural-atmosphere {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 36rem 32rem at var(--glow-x) var(--glow-y),
      rgba(var(--glow-a), .14), transparent 70%),
    radial-gradient(ellipse 34rem 30rem at calc(100% - var(--glow-x)) calc(100% - var(--glow-y)),
      rgba(var(--glow-b), .10), transparent 72%),
    #05070c;
  transition: background 850ms ease, filter 450ms ease;
}
.neural-background:has(.neural-brain-construct.is-pulsing) .neural-atmosphere {
  filter: brightness(1.28);
}

.neural-grid {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(var(--glow-a), 0.22) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(circle 420px at var(--glow-x) var(--glow-y), #000 0%, transparent 80%);
  mask-image: radial-gradient(circle 420px at var(--glow-x) var(--glow-y), #000 0%, transparent 80%);
  transition: -webkit-mask-image 850ms ease, mask-image 850ms ease;
}

.neural-brain-construct {
  position: absolute;
  left: var(--core-x);
  top: var(--core-y);
  width: var(--core-size);
  height: var(--core-size);
  opacity: var(--brain-opacity);
  transform: translate(-50%, -50%) rotate(var(--core-rotate)) scale(var(--core-scale, 1));
  transform-origin: center;
  transition:
    left 950ms cubic-bezier(.2,.7,.2,1),
    top 950ms cubic-bezier(.2,.7,.2,1),
    width 900ms ease,
    height 900ms ease,
    transform 950ms cubic-bezier(.2,.7,.2,1),
    opacity 450ms ease;
}


/* Reference-lab effects: layered containment rings, conic radar fan and core pulse. */
.neural-core-halo {
  position: absolute;
  inset: 7.5%;
  border: 1.5px solid rgba(var(--glow-a), .30);
  border-radius: 50%;
  box-shadow:
    0 0 0 28px rgba(var(--glow-a), .055),
    0 0 0 58px rgba(var(--glow-b), .045),
    0 0 0 92px rgba(var(--glow-a), .025),
    inset 0 0 80px rgba(var(--glow-b), .10),
    0 0 24px rgba(var(--glow-a), .12);
  opacity: .95;
  pointer-events: none;
}

.neural-radar-sweep {
  position: absolute;
  inset: 9%;
  border-radius: 50%;
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(var(--glow-a), .025) 250deg,
    rgba(var(--glow-b), .22) 330deg,
    rgba(var(--glow-a), .48) 356deg,
    transparent 360deg
  );
  -webkit-mask-image: radial-gradient(circle, #000 0%, #000 70%, transparent 72%);
  mask-image: radial-gradient(circle, #000 0%, #000 70%, transparent 72%);
  opacity: .92;
  transform-origin: 50% 50%;
  animation: gvNeuralRadarSpin 24s linear infinite;
  pointer-events: none;
}

.neural-pulse-ring {
  position: absolute;
  inset: 20%;
  border: 2px solid rgba(var(--glow-a), .92);
  border-radius: 50%;
  box-shadow:
    0 0 18px rgba(var(--glow-a), .50),
    0 0 36px rgba(var(--glow-b), .35),
    inset 0 0 22px rgba(var(--glow-a), .20);
  opacity: 0;
  transform: scale(.45);
  pointer-events: none;
}

.neural-pulse-ring.is-pulsing {
  animation: gvNeuralCorePulse 1.15s cubic-bezier(.16,.8,.32,1) both;
}

.neural-brain-construct.is-pulsing .neural-core-svg {
  filter:
    drop-shadow(0 0 16px rgba(var(--glow-a), .42))
    drop-shadow(0 0 34px rgba(var(--glow-b), .28))
    drop-shadow(0 0 52px rgba(var(--glow-a), .16));
}

.neural-core-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 0 12px rgba(var(--glow-a), 0.16))
          drop-shadow(0 0 26px rgba(var(--glow-b), 0.10));
  transition: filter 850ms ease;
}

.neural-radar-ring-outer {
  fill: none;
  stroke: rgba(var(--glow-a), 0.24);
  stroke-width: 1.25;
  stroke-dasharray: 6 14 28 14;
  transform-origin: 400px 400px;
  animation: gvNeuralSpinSlow 64s linear infinite;
}
.neural-radar-ring-inner {
  fill: none;
  stroke: rgba(var(--glow-b), 0.22);
  stroke-width: 1;
  stroke-dasharray: 2 18;
  transform-origin: 400px 400px;
  animation: gvNeuralSpinReverse 48s linear infinite;
}
.neural-brain-shell {
  fill: rgba(var(--glow-a), 0.015);
  stroke: url(#brainNeonGrad);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.neural-brain-lobe {
  fill: none;
  stroke: url(#brainNeonGrad);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .85;
}
.neural-pcb-trace {
  fill: none;
  stroke: url(#brainNeonGrad);
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .72;
}
.neural-pcb-antenna {
  fill: none;
  stroke: url(#brainNeonGrad);
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .45;
}
.neural-pcb-pulse {
  fill: none;
  stroke: var(--gv-neutral-white);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-dasharray: 14 220;
  opacity: .88;
  filter: drop-shadow(0 0 3px rgba(var(--gv-neutral-white-rgb),.95))
          drop-shadow(0 0 8px rgba(var(--glow-a),.75))
          drop-shadow(0 0 13px rgba(var(--glow-b),.35));
  animation: gvNeuralFlowPacket 5.5s linear infinite;
}
.neural-pcb-pulse.delay-1 { animation-delay: -2s; animation-duration: 7.5s; }
.neural-pcb-pulse.delay-2 { animation-delay: -4.2s; animation-duration: 5.5s; }
.neural-data-packet {
  fill: none;
  stroke: rgb(var(--glow-a));
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 2 28 2 202;
  animation: gvNeuralFlowPacket 7s linear infinite;
}
.neural-solder-pad {
  fill: var(--gv-bg-atmosphere);
  stroke: url(#brainNeonGrad);
  stroke-width: 1.5;
  opacity: .85;
}
.neural-search-shockwave {
  fill: none;
  stroke: rgba(var(--glow-a), .75);
  stroke-width: 1.5;
  opacity: 0;
  transform-origin: 400px 400px;
}
.neural-search-shockwave.fire {
  animation: gvNeuralShockwaveExpand 1.1s ease-out;
}

@keyframes gvNeuralSpinSlow { to { transform: rotate(360deg); } }
@keyframes gvNeuralRadarSpin { to { transform: rotate(360deg); } }
@keyframes gvNeuralCorePulse {
  0% { transform: scale(.42); opacity: .82; }
  65% { opacity: .45; }
  100% { transform: scale(1.18); opacity: 0; }
}
@keyframes gvNeuralSpinReverse { to { transform: rotate(-360deg); } }
@keyframes gvNeuralFlowPacket { to { stroke-dashoffset: -234; } }
@keyframes gvNeuralShockwaveExpand {
  0% { transform: scale(.35); opacity: .65; }
  100% { transform: scale(1.15); opacity: 0; }
}

@media (max-width: 700px) {
  .neural-brain-construct {
    width: min(var(--core-size), 112vw);
    height: min(var(--core-size), 112vw);
  }
}

@media (prefers-reduced-motion: reduce) {
  .neural-radar-ring-outer,
  .neural-radar-ring-inner,
  .neural-radar-sweep,
  .neural-data-packet,
  .neural-pcb-pulse,
  .neural-search-shockwave.fire,
  .neural-pulse-ring.is-pulsing {
    animation: none !important;
  }

  .neural-atmosphere,
  .neural-grid,
  .neural-brain-construct,
  .neural-core-svg {
    transition: none !important;
  }
}