/*!
 * PhotoFX Layered Engine v5
 */
.pfx5-root {
  --pfx5-radius: 0px;
  position: absolute !important;
  inset: 0 !important;
  z-index: 50 !important;
  overflow: hidden !important;
  border-radius: var(--pfx5-radius);
  pointer-events: none !important;
}

.pfx5-layer,
.pfx5-light,
.pfx5-texture,
.pfx5-scan,
.pfx5-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.pfx5-layer {
  opacity: var(--pfx5-opacity);
  mix-blend-mode: var(--pfx5-blend);
  filter: blur(var(--pfx5-blur));
}

.pfx5-light { z-index: 1; }
.pfx5-texture { z-index: 2; }
.pfx5-scan { z-index: 3; }
.pfx5-particles { z-index: 4; overflow: hidden; }

.pfx5-image {
  filter: var(--pfx5-filter) !important;
  transform-origin: center;
  will-change: transform, filter;
}

.pfx5-motion-breathe { animation: pfx5Breathe calc(5s / var(--pfx5-speed)) ease-in-out infinite alternate !important; }
.pfx5-motion-zoom-in { animation: pfx5Zoom calc(7s / var(--pfx5-speed)) ease-in-out infinite alternate !important; }
.pfx5-motion-float { animation: pfx5Float calc(5s / var(--pfx5-speed)) ease-in-out infinite !important; }
.pfx5-motion-drift-left { animation: pfx5DriftLeft calc(8s / var(--pfx5-speed)) ease-in-out infinite alternate !important; }
.pfx5-motion-drift-right { animation: pfx5DriftRight calc(8s / var(--pfx5-speed)) ease-in-out infinite alternate !important; }
.pfx5-motion-tilt { animation: pfx5Tilt calc(6s / var(--pfx5-speed)) ease-in-out infinite alternate !important; }
.pfx5-motion-parallax {
  transform: perspective(1000px) rotateX(var(--pfx5-rx,0deg)) rotateY(var(--pfx5-ry,0deg)) scale(var(--pfx5-scale,1.02)) !important;
  transition: transform .12s ease-out !important;
}

@keyframes pfx5Breathe { from{transform:scale(1.02)} to{transform:scale(1.06)} }
@keyframes pfx5Zoom { from{transform:scale(1.02)} to{transform:scale(1.12)} }
@keyframes pfx5Float { 50%{transform:scale(1.03) translateY(-10px)} }
@keyframes pfx5DriftLeft { from{transform:scale(1.08) translateX(2%)} to{transform:scale(1.08) translateX(-2%)} }
@keyframes pfx5DriftRight { from{transform:scale(1.08) translateX(-2%)} to{transform:scale(1.08) translateX(2%)} }
@keyframes pfx5Tilt { from{transform:perspective(1000px) scale(1.03) rotateY(-2deg)} to{transform:perspective(1000px) scale(1.03) rotateY(2deg)} }

/* Glass family */
.pfx5-layer[data-effect="glass-reflection"] .pfx5-light {
  width: 38%;
  left: -55%;
  right: auto;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.05),
    rgba(var(--pfx5-rgb),.48),
    rgba(255,255,255,.28),
    transparent
  );
  transform: skewX(-16deg);
  animation: pfx5GlassMove calc(4.8s / var(--pfx5-layer-speed)) ease-in-out infinite;
}

.pfx5-layer[data-effect="window-reflection"] .pfx5-light {
  inset: -8%;
  background:
    linear-gradient(115deg, rgba(var(--pfx5-rgb),.22) 0 12%, transparent 12% 24%, rgba(255,255,255,.16) 24% 32%, transparent 32% 100%),
    linear-gradient(20deg, transparent 0 55%, rgba(var(--pfx5-secondary-rgb),.18) 55% 65%, transparent 65%);
  animation: pfx5Window calc(7s / var(--pfx5-layer-speed)) ease-in-out infinite alternate;
}

.pfx5-layer[data-effect="crystal-glass"] .pfx5-light {
  background:
    linear-gradient(135deg, rgba(255,255,255,.34), transparent 26%),
    linear-gradient(315deg, rgba(var(--pfx5-rgb),.2), transparent 38%),
    radial-gradient(circle at 70% 18%, rgba(var(--pfx5-secondary-rgb),.22), transparent 30%);
}

.pfx5-layer[data-effect="moving-shine"] .pfx5-light {
  width: 34%;
  left: -50%;
  right: auto;
  background: linear-gradient(90deg, transparent, rgba(var(--pfx5-rgb),.7), transparent);
  transform: skewX(-14deg);
  animation: pfx5GlassMove calc(3.8s / var(--pfx5-layer-speed)) ease-in-out infinite;
}

@keyframes pfx5GlassMove {
  0%,20% { transform: translateX(0) skewX(-16deg); opacity: 0; }
  45% { opacity: 1; }
  80%,100% { transform: translateX(430%) skewX(-16deg); opacity: 0; }
}
@keyframes pfx5Window { to { transform: translate3d(5%,-3%,0) scale(1.04); } }

/* Lighting */
.pfx5-layer[data-effect="glow"] .pfx5-light {
  background: radial-gradient(circle, rgba(var(--pfx5-rgb),.3), transparent 62%);
}
.pfx5-layer[data-effect="dual-glow"] .pfx5-light {
  background:
    radial-gradient(circle at 78% 20%, rgba(var(--pfx5-rgb),.42), transparent 28%),
    radial-gradient(circle at 15% 82%, rgba(var(--pfx5-secondary-rgb),.38), transparent 34%);
}
.pfx5-layer[data-effect="lens-flare"] .pfx5-light {
  background:
    radial-gradient(circle at 18% 72%, #fff 0 2px, rgba(var(--pfx5-rgb),.46) 3px 8px, transparent 23px),
    radial-gradient(circle at 42% 53%, rgba(var(--pfx5-secondary-rgb),.2), transparent 48px);
}
.pfx5-layer[data-effect="aurora"] .pfx5-light {
  inset:-25%;
  background:conic-gradient(transparent,rgba(var(--pfx5-rgb),.3),rgba(var(--pfx5-secondary-rgb),.35),transparent);
  filter:blur(20px);
  animation:pfx5Rotate calc(12s / var(--pfx5-layer-speed)) linear infinite;
}
.pfx5-layer[data-effect="smoke"] .pfx5-light {
  inset:-20%;
  background:
    radial-gradient(ellipse at 20% 90%,rgba(255,255,255,.22),transparent 35%),
    radial-gradient(ellipse at 80% 80%,rgba(var(--pfx5-rgb),.26),transparent 36%);
  filter:blur(18px);
  animation:pfx5Smoke calc(8s / var(--pfx5-layer-speed)) ease-in-out infinite alternate;
}
.pfx5-layer[data-effect="energy-ring"] .pfx5-light,
.pfx5-layer[data-effect="portal"] .pfx5-light {
  inset:8%;
  border-radius:50%;
  border:2px solid rgba(var(--pfx5-rgb),.62);
  box-shadow:0 0 40px rgba(var(--pfx5-rgb),.6);
  animation:pfx5Pulse calc(2.6s / var(--pfx5-layer-speed)) infinite;
}
.pfx5-layer[data-effect="portal"] .pfx5-light {
  inset:-8%;
  border-style:dashed;
  animation:pfx5Rotate calc(10s / var(--pfx5-layer-speed)) linear infinite;
}

/* Digital and texture */
.pfx5-layer:is([data-effect="scanlines"],[data-effect="crt"],[data-effect="vhs"],[data-effect="hologram"],[data-effect="matrix"]) .pfx5-scan {
  opacity:.58;
  background:repeating-linear-gradient(to bottom,transparent 0 3px,rgba(var(--pfx5-rgb),.2) 4px,transparent 5px);
  animation:pfx5Scan calc(2.8s / var(--pfx5-layer-speed)) linear infinite;
}
.pfx5-layer:is([data-effect="vhs"],[data-effect="crt"],[data-effect="digital-noise"],[data-effect="film-grain"]) .pfx5-texture {
  opacity:.52;
  background:repeating-radial-gradient(circle,#ffffff22 0 1px,transparent 1px 4px);
  background-size:9px 9px;
  animation:pfx5Noise .55s steps(2) infinite;
}
.pfx5-layer[data-effect="grid"] .pfx5-texture {
  opacity:.55;
  background:
    linear-gradient(rgba(var(--pfx5-rgb),.24) 1px,transparent 1px),
    linear-gradient(90deg,rgba(var(--pfx5-rgb),.24) 1px,transparent 1px);
  background-size:24px 24px;
}
.pfx5-layer[data-effect="vignette"] .pfx5-texture {
  opacity:.8;
  background:radial-gradient(circle,transparent 44%,rgba(0,0,0,.58) 115%);
}

/* Particles */
.pfx5-p {
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:var(--size);
  height:var(--size);
  opacity:0;
  animation-delay:var(--delay);
  animation-duration:calc(var(--duration) / var(--pfx5-layer-speed));
  animation-iteration-count:infinite;
}

.pfx5-p:not(.pfx5-rain):not(.pfx5-snow):not(.pfx5-bubble):not(.pfx5-confetti) {
  border-radius:50%;
  background:rgba(var(--pfx5-rgb),.96);
  box-shadow:0 0 10px rgba(var(--pfx5-rgb),.8);
  animation-name:pfx5Rise;
}

.pfx5-rain {
  width:1px;
  height:calc(var(--size) * 6);
  background:linear-gradient(transparent,rgba(var(--pfx5-rgb),.82));
  animation-name:pfx5Rain;
}
.pfx5-snow { border-radius:50%; background:#fff; animation-name:pfx5Snow; }
.pfx5-bubble { border-radius:50%; border:1px solid rgba(var(--pfx5-rgb),.6); animation-name:pfx5Bubble; }
.pfx5-confetti { background:rgba(var(--pfx5-rgb),.9); animation-name:pfx5Rain; }
.pfx5-bokeh { width:calc(var(--size) * 3); height:calc(var(--size) * 3); filter:blur(1px); opacity:.3; }

@keyframes pfx5Rise { 0%{transform:translateY(24px);opacity:0}20%{opacity:.9}100%{transform:translate(var(--drift),-95px);opacity:0} }
@keyframes pfx5Rain { 0%{transform:translateY(-60px);opacity:0}10%{opacity:.9}100%{transform:translate(-55px,600px);opacity:0} }
@keyframes pfx5Snow { 0%{transform:translateY(-45px);opacity:0}16%{opacity:.9}100%{transform:translate(var(--drift),520px);opacity:0} }
@keyframes pfx5Bubble { 0%{transform:translateY(70px);opacity:0}20%{opacity:.7}100%{transform:translate(var(--drift),-480px);opacity:0} }
@keyframes pfx5Rotate { to{transform:rotate(360deg)} }
@keyframes pfx5Smoke { to{transform:translate(20px,-35px)} }
@keyframes pfx5Pulse { 50%{transform:scale(1.05)} }
@keyframes pfx5Scan { to{background-position-y:120px} }
@keyframes pfx5Noise { 50%{transform:translate(2px,-1px)} }

.pfx5-root[data-frame="soft"] { box-shadow:inset 0 0 0 1px rgba(255,255,255,.15); }
.pfx5-root[data-frame="neon"] { box-shadow:inset 0 0 0 2px #8a5cff,0 0 18px #8a5cff88; }
.pfx5-root[data-frame="double"] { box-shadow:inset 0 0 0 2px #fff3,inset 0 0 0 7px #fff1; }
.pfx5-root[data-frame="gold"] { box-shadow:inset 0 0 0 2px #dba423; }
.pfx5-root[data-frame="glass"] { box-shadow:inset 0 0 0 1px rgba(255,255,255,.4),inset 0 0 35px rgba(255,255,255,.06); }
.pfx5-root[data-frame="minimal"] { box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }

.pfx5-paused,
.pfx5-paused * {
  animation-play-state:paused !important;
}