/* ==========================================================================
   Neon & Glow Effects (Dark Mode)
   ========================================================================== */
@keyframes neonPulse {
  0%, 100% {
    box-shadow: 0 0 10px rgba(255, 221, 85, 0.5), 0 0 20px rgba(255, 221, 85, 0.3), 0 0 30px rgba(255, 221, 85, 0.1);
  }
  50% {
    box-shadow: 0 0 15px rgba(255, 221, 85, 0.7), 0 0 30px rgba(255, 221, 85, 0.5), 0 0 45px rgba(255, 221, 85, 0.3);
  }
}
@keyframes neonGlow {
  0%, 100% {
    filter: drop-shadow(0 0 5px rgba(255, 221, 85, 0.5));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(255, 221, 85, 0.8));
  }
}
@keyframes neonFlicker {
  0%, 100% {
    box-shadow: 0 0 5px var(--neon-color, #FFDD55), 0 0 10px var(--neon-color, #FFDD55), 0 0 20px var(--neon-color, #FFDD55), 0 0 40px var(--neon-color, #FFDD55), 0 5px 15px rgba(var(--neon-color-rgb, 255, 221, 85), 0.5), 0 10px 25px rgba(var(--neon-color-rgb, 255, 221, 85), 0.3), 0 15px 35px rgba(var(--neon-color-rgb, 255, 221, 85), 0.1);
    opacity: 1;
  }
  20% {
    box-shadow: 0 0 3px var(--neon-color, #FFDD55), 0 0 8px var(--neon-color, #FFDD55), 0 0 15px var(--neon-color, #FFDD55), 0 0 30px var(--neon-color, #FFDD55), 0 4px 12px rgba(var(--neon-color-rgb, 255, 221, 85), 0.4), 0 8px 20px rgba(var(--neon-color-rgb, 255, 221, 85), 0.2), 0 12px 28px rgba(var(--neon-color-rgb, 255, 221, 85), 0.1);
    opacity: 0.85;
  }
  50% {
    box-shadow: 0 0 8px var(--neon-color, #FFDD55), 0 0 15px var(--neon-color, #FFDD55), 0 0 25px var(--neon-color, #FFDD55), 0 0 50px var(--neon-color, #FFDD55), 0 6px 18px rgba(var(--neon-color-rgb, 255, 221, 85), 0.6), 0 12px 30px rgba(var(--neon-color-rgb, 255, 221, 85), 0.4), 0 18px 40px rgba(var(--neon-color-rgb, 255, 221, 85), 0.2);
    opacity: 1;
  }
  70% {
    box-shadow: 0 0 6px var(--neon-color, #FFDD55), 0 0 12px var(--neon-color, #FFDD55), 0 0 22px var(--neon-color, #FFDD55), 0 0 45px var(--neon-color, #FFDD55), 0 5px 16px rgba(var(--neon-color-rgb, 255, 221, 85), 0.55), 0 10px 27px rgba(var(--neon-color-rgb, 255, 221, 85), 0.35), 0 15px 38px rgba(var(--neon-color-rgb, 255, 221, 85), 0.15);
    opacity: 0.95;
  }
}
/* ==========================================================================
   Star Field Animation (Dark Mode)
   ========================================================================== */
@keyframes starTwinkle {
  0%, 100% {
    opacity: 0.6;
    background-position: 0% 0%;
  }
  50% {
    opacity: 1;
    background-position: 100% 100%;
  }
}
@keyframes starFloat {
  0% {
    transform: translateY(100vh) scale(0);
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateY(-10vh) scale(1);
    opacity: 0;
  }
}
/* ==========================================================================
   Holographic & Advanced Effects
   ========================================================================== */
@keyframes lightRunner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes holographicFloat {
  0%, 100% {
    transform: translateY(0) translateZ(10px);
  }
  50% {
    transform: translateY(-5px) translateZ(20px);
  }
}
@keyframes holographicShimmer {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}
@keyframes scanlines {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes screenGlow {
  0% {
    filter: drop-shadow(0 0 40px rgba(15, 217, 187, 0.1)) drop-shadow(0 4px 15px rgba(15, 217, 187, 0.3)) drop-shadow(0 6px 20px rgba(235, 84, 137, 0.2)) drop-shadow(0 0 10px rgba(15, 217, 187, 0.4)) brightness(1) contrast(1);
  }
  50% {
    filter: drop-shadow(0 0 50px rgba(15, 217, 187, 0.15)) drop-shadow(0 6px 20px rgba(15, 217, 187, 0.4)) drop-shadow(0 8px 25px rgba(235, 84, 137, 0.3)) drop-shadow(0 0 15px rgba(15, 217, 187, 0.5)) brightness(1.02) contrast(1.02);
  }
  100% {
    filter: drop-shadow(0 0 45px rgba(15, 217, 187, 0.12)) drop-shadow(0 5px 18px rgba(15, 217, 187, 0.35)) drop-shadow(0 7px 22px rgba(235, 84, 137, 0.25)) drop-shadow(0 0 12px rgba(15, 217, 187, 0.45)) brightness(1.01) contrast(1.01);
  }
}
@keyframes borderFlicker {
  0%, 100% {
    border-color: rgba(15, 217, 187, 0.5);
    box-shadow: inset 0 0 10px rgba(15, 217, 187, 0.2), 0 0 15px rgba(15, 217, 187, 0.3);
  }
  25% {
    border-color: rgba(15, 217, 187, 0.8);
    box-shadow: inset 0 0 15px rgba(15, 217, 187, 0.3), 0 0 20px rgba(15, 217, 187, 0.4);
  }
  30% {
    border-color: rgba(235, 84, 137, 0.6);
    box-shadow: inset 0 0 10px rgba(235, 84, 137, 0.2), 0 0 15px rgba(235, 84, 137, 0.3);
  }
  50% {
    border-color: rgba(235, 141, 82, 0.7);
  }
}
/* ==========================================================================
   Audio & Waveform Effects
   ========================================================================== */
@keyframes waveGlow {
  0%, 100% {
    filter: drop-shadow(0 0 5px rgba(235, 84, 137, 0.3));
  }
  50% {
    filter: drop-shadow(0 0 15px rgba(235, 84, 137, 0.5));
  }
}
@keyframes shimmer {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}
/* ==========================================================================
   Component-Specific Decorative Animations
   ========================================================================== */
@keyframes commentPulse {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.6;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes marqueeVertical {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}
@keyframes slideRight {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(5px);
  }
}
@keyframes gradientShift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes starryNightSwirl {
  0% {
    transform: rotate(0deg) scale(1) translateX(0);
    filter: blur(2px);
  }
  25% {
    transform: rotate(90deg) scale(1.15) translateX(-3%);
    filter: blur(3px);
  }
  50% {
    transform: rotate(180deg) scale(1.1) translateX(2%);
    filter: blur(2px);
  }
  75% {
    transform: rotate(270deg) scale(1.05) translateX(-2%);
    filter: blur(3px);
  }
  100% {
    transform: rotate(360deg) scale(1) translateX(0);
    filter: blur(2px);
  }
}
@keyframes starryNightMist {
  0% {
    transform: translateX(0) translateY(0) scale(1);
    opacity: 0.8;
  }
  50% {
    transform: translateX(-5%) translateY(3%) scale(1.1);
    opacity: 1;
  }
  100% {
    transform: translateX(3%) translateY(-5%) scale(1);
    opacity: 0.8;
  }
}
@keyframes folderAppear {
  to {
    opacity: 1;
    transform: translateY(0) rotateX(0deg);
  }
}
@keyframes nodeAppear {
  from {
    opacity: 0;
    transform: translateZ(-50px) scale(0.8);
  }
  to {
    opacity: 1;
    transform: translateZ(0) scale(1);
  }
}
@keyframes lineGrow {
  from {
    transform: scaleY(0);
    transform-origin: top;
  }
  to {
    transform: scaleY(1);
  }
}
@keyframes drawCircle {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
@media (prefers-reduced-motion: reduce) {
  @keyframes neonPulse,
  @keyframes neonGlow,
  @keyframes neonFlicker,
  @keyframes lightRunner,
  @keyframes holographicFloat,
  @keyframes holographicShimmer,
  @keyframes scanlines,
  @keyframes screenGlow,
  @keyframes borderFlicker,
  @keyframes waveGlow,
  @keyframes shimmer,
  @keyframes commentPulse,
  @keyframes marqueeVertical,
  @keyframes slideRight,
  @keyframes gradientShift,
  @keyframes folderAppear,
  @keyframes nodeAppear,
  @keyframes lineGrow,
  @keyframes drawCircle,
  @keyframes dash {}
}
html[data-theme=dark] .v2-styles .audio-meter-loading {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transform: none;
  gap: 0;
  overflow: visible;
}
html[data-theme=dark] .v2-styles .audio-meter-loading .meter-bar {
  display: none;
}
html[data-theme=dark] .v2-styles .audio-meter-loading::before {
  content: "";
  position: absolute;
  width: 150%;
  height: 150%;
  top: -25%;
  left: -25%;
  background: radial-gradient(circle at 15% 20%, #FFFF00 0%, rgba(255, 255, 0, 0.8) 1.5%, rgba(255, 255, 0, 0.4) 4%, transparent 7%), radial-gradient(circle at 85% 15%, #FFE4A1 0%, rgba(255, 228, 161, 0.7) 2%, rgba(255, 228, 161, 0.35) 5%, transparent 9%), radial-gradient(circle at 70% 80%, #FFDD55 0%, rgba(255, 221, 85, 0.75) 1.8%, rgba(255, 221, 85, 0.4) 4.5%, transparent 8%), radial-gradient(circle at 30% 70%, #FFFF00 0%, rgba(255, 255, 0, 0.6) 2%, transparent 6%), radial-gradient(circle at 50% 40%, #FFE4A1 0%, rgba(255, 228, 161, 0.5) 2.5%, transparent 7%), radial-gradient(circle at 25% 45%, #D4AF37 0%, rgba(212, 175, 55, 0.6) 1.5%, transparent 5%), radial-gradient(circle at 75% 55%, #FFDD55 0%, rgba(255, 221, 85, 0.5) 2%, transparent 6%), radial-gradient(circle at 40% 85%, #FFFF00 0%, rgba(255, 255, 0, 0.55) 1.8%, transparent 5.5%), radial-gradient(circle at 60% 25%, #FFE4A1 0%, rgba(255, 228, 161, 0.5) 2.2%, transparent 6.5%);
  background-size: 80% 80%, 90% 90%, 85% 85%, 70% 70%, 75% 75%, 65% 65%, 95% 95%, 88% 88%, 82% 82%;
  animation: swirlLights 4s cubic-bezier(0.4, 0, 0.2, 1) infinite, starryFloat 3s ease-in-out infinite;
  filter: blur(0.5px);
  transform-origin: center;
}
html[data-theme=dark] .v2-styles .audio-meter-loading::after {
  content: "";
  position: absolute;
  width: 140%;
  height: 140%;
  top: -20%;
  left: -20%;
  background: radial-gradient(circle at 10% 50%, #FFFF00 0%, rgba(255, 255, 0, 0.9) 1%, rgba(255, 255, 0, 0.5) 3%, transparent 6%), radial-gradient(circle at 90% 40%, #FFE4A1 0%, rgba(255, 228, 161, 0.8) 1.5%, rgba(255, 228, 161, 0.4) 4%, transparent 7%), radial-gradient(circle at 50% 90%, #FFDD55 0%, rgba(255, 221, 85, 0.85) 1.2%, rgba(255, 221, 85, 0.45) 3.5%, transparent 6.5%), radial-gradient(circle at 35% 15%, #D4AF37 0%, rgba(212, 175, 55, 0.7) 1.8%, transparent 5%), radial-gradient(circle at 65% 65%, #FFFF00 0%, rgba(255, 255, 0, 0.65) 2%, transparent 5.5%), radial-gradient(circle at 20% 80%, #FFE4A1 0%, rgba(255, 228, 161, 0.6) 1.5%, transparent 4.5%), radial-gradient(circle at 80% 75%, #FFDD55 0%, rgba(255, 221, 85, 0.55) 1.8%, transparent 5%);
  background-size: 75% 75%, 85% 85%, 80% 80%, 70% 70%, 90% 90%, 78% 78%, 83% 83%;
  animation: swirlLightsReverse 5s cubic-bezier(0.4, 0, 0.2, 1) infinite, starryFloat 4s ease-in-out infinite reverse;
  transform-origin: center;
}

@keyframes starryFloat {
  0%, 100% {
    transform: translate(0, 0) scale(1) rotate(0deg);
  }
  33% {
    transform: translate(-5%, 3%) scale(1.05) rotate(5deg);
  }
  66% {
    transform: translate(3%, -5%) scale(0.95) rotate(-3deg);
  }
}
@keyframes paintFlow {
  0% {
    transform: rotate(-15deg) scale(1) translateX(0);
    filter: blur(8px);
  }
  50% {
    transform: rotate(10deg) scale(1.1) translateX(-5%);
    filter: blur(12px);
  }
  100% {
    transform: rotate(-20deg) scale(0.9) translateX(5%);
    filter: blur(6px);
  }
}
@keyframes swirlLights {
  0% {
    transform: rotate(0deg) scale(1) translate(0, 0);
  }
  25% {
    transform: rotate(90deg) scale(1.1) translate(-3%, 2%);
  }
  50% {
    transform: rotate(180deg) scale(1.05) translate(2%, -3%);
  }
  75% {
    transform: rotate(270deg) scale(0.95) translate(-2%, -2%);
  }
  100% {
    transform: rotate(360deg) scale(1) translate(0, 0);
  }
}
@keyframes swirlLightsReverse {
  0% {
    transform: rotate(0deg) scale(1) translate(0, 0);
  }
  25% {
    transform: rotate(-90deg) scale(0.95) translate(2%, -3%);
  }
  50% {
    transform: rotate(-180deg) scale(1.05) translate(-3%, 2%);
  }
  75% {
    transform: rotate(-270deg) scale(1.1) translate(2%, 2%);
  }
  100% {
    transform: rotate(-360deg) scale(1) translate(0, 0);
  }
}

/*# sourceMappingURL=animations-decorative.css.map */