/* ===== WOW motion v2: stable scroll + visible neon depth ===== */
/* Не меняет карточки/иконки/тексты. Только движение, свет и pull-down визуал. */

html,
body,
.app,
.screen,
.cyber-screen,
.cyber-shell {
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
}

html,
body,
.app,
.screen,
.cyber-screen,
.cyber-shell {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  overscroll-behavior-x: none !important;
}

:root {
  --pv-wow-scroll: 0;
  --pv-wow-pull: 0;
}

/* Живой фон при обычном скролле */
.pv-v-bg {
  transform:
    translate3d(0, calc(var(--pv-wow-scroll) * -0.022px), 0)
    scale(calc(1 + var(--pv-wow-scroll) * .000035));
  transform-origin: 18% 48%;
  transition:
    transform 520ms cubic-bezier(.16,.84,.22,1),
    filter 520ms cubic-bezier(.16,.84,.22,1) !important;
}

.pv-v-glow {
  transform:
    translate(-50%, -50%)
    scale(calc(1 + var(--pv-wow-scroll) * .00018));
}

.pv-v-tube::before {
  animation:
    pvVTubeFlicker 2200ms linear both,
    pvWowTubeAlive 6200ms ease-in-out 2400ms infinite !important;
}

.pv-v-glow {
  animation:
    pvVGlowFlicker 2200ms linear both,
    pvWowGlowAlive 7200ms ease-in-out 2400ms infinite !important;
}

.pv-v-bloom {
  animation:
    pvVBloomBoot 2200ms linear both,
    pvWowBloomAlive 6800ms ease-in-out 2400ms infinite !important;
}

/* Дополнительная световая линза поверх нового V-фона */
.pv-v-bg::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 47%,
      rgba(122,235,255, calc(var(--pv-wow-pull) * .010)),
      rgba(42,160,255, calc(var(--pv-wow-pull) * .004)) 28%,
      transparent 58%),
    linear-gradient(180deg,
      rgba(255,255,255, calc(var(--pv-wow-pull) * .002)),
      transparent 42%);
  opacity: 1;
  mix-blend-mode: screen;
}

/* Pull-down сверху: заметный вау-отклик, но жест не блокируется */
body.pv-wow-pulling .app {
  transform:
    translate3d(0, calc(var(--pv-wow-pull) * .20px), 0)
    scale(calc(1 - var(--pv-wow-pull) * .00062));
  transform-origin: 50% 0%;
  transition: none !important;
}

body.pv-wow-pulling .pv-v-bg {
  transform:
    translate3d(0, calc(var(--pv-wow-pull) * .34px), 0)
    scale(calc(1 + var(--pv-wow-pull) * .00165));
  transform-origin: 18% 48%;
  filter:
    brightness(calc(1.06 + var(--pv-wow-pull) * .010))
    saturate(calc(1.12 + var(--pv-wow-pull) * .007)) !important;
  transition: none !important;
}

body.pv-wow-pulling .pv-v-tube::before {
  filter: brightness(calc(1.05 + var(--pv-wow-pull) * .018));
}

body.pv-wow-pulling .cyber-shell {
  transform: translate3d(0, calc(var(--pv-wow-pull) * .045px), 0);
  transition: none !important;
}

body:not(.pv-wow-pulling) .app,
body:not(.pv-wow-pulling) .cyber-shell {
  transition: transform 480ms cubic-bezier(.16,.84,.22,1) !important;
}

@keyframes pvWowTubeAlive {
  0%, 100% {
    opacity: .88;
    filter: brightness(1.04);
  }
  18% {
    opacity: .95;
    filter: brightness(1.22);
  }
  21% {
    opacity: .78;
    filter: brightness(.92);
  }
  24% {
    opacity: .96;
    filter: brightness(1.28);
  }
  52% {
    opacity: .86;
    filter: brightness(1.02);
  }
  67% {
    opacity: .98;
    filter: brightness(1.18);
  }
  69% {
    opacity: .82;
    filter: brightness(.96);
  }
  72% {
    opacity: .94;
    filter: brightness(1.16);
  }
}

@keyframes pvWowGlowAlive {
  0%, 100% {
    opacity: .72;
  }
  35% {
    opacity: .92;
  }
  38% {
    opacity: .64;
  }
  42% {
    opacity: .88;
  }
  70% {
    opacity: .78;
  }
}

@keyframes pvWowBloomAlive {
  0%, 100% {
    opacity: .66;
  }
  45% {
    opacity: .88;
  }
  48% {
    opacity: .58;
  }
  52% {
    opacity: .82;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pv-v-bg,
  .pv-v-glow,
  .pv-v-bloom,
  .pv-v-tube::before,
  body.pv-wow-pulling .app,
  body.pv-wow-pulling .cyber-shell {
    animation: none !important;
    transform: none !important;
    filter: none !important;
  }
}