/* SPECTER layer: wireframe dog draw-on, pulse, breath, parallax host. */
.specter-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.wire-path {
  fill: none;
  stroke: #b8c8c6;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
  opacity: .08;
}

.wire-pulse {
  fill: none;
  stroke: #dfe9e7;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
  opacity: 0;
}

/* wide soft glow echo under the pulse, JS drives both */
.wire-glow {
  fill: none;
  stroke: #dfe9e7;
  stroke-width: 4;
  vector-effect: non-scaling-stroke;
  opacity: 0;
}

/* Draw-on: JS sets stroke-dasharray/offset to the measured total length,
   then animates offset to 0. While drawing the stroke is brighter, then
   settles to the resting look. */
.specter-svg.is-drawing .wire-path {
  stroke: #dfe9e7;
  stroke-opacity: .55;
}

.specter-svg.is-settling .wire-path {
  transition: stroke 900ms ease-out, stroke-opacity 900ms ease-out;
}

@keyframes specter-breath {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.008); }
  100% { transform: scale(1); }
}

.specter-svg.is-breathing .specter-g {
  transform-origin: 50% 100%;
  animation: specter-breath 7s ease-in-out infinite;
}

.specter-g {
  transform-origin: 50% 100%;
  will-change: transform;
}

.wire-path, .wire-pulse, .wire-glow { will-change: stroke-dashoffset, opacity; }

/* Reduced motion: static resting frame, nothing animates. */
@media (prefers-reduced-motion: reduce) {
  .specter-svg.is-drawing .wire-path,
  .specter-svg .wire-path {
    stroke: #b8c8c6;
    stroke-opacity: 1;
    opacity: .08;
    stroke-dasharray: none;
    stroke-dashoffset: 0;
  }
  .specter-svg .wire-pulse,
  .specter-svg .wire-glow { opacity: 0; }
  .specter-svg.is-breathing .specter-g { animation: none; }
  .specter-g { transform: none; }
}