/* ==========================================================================
   ANORAK / OASIS SPECIAL ANIMATIONS & EFFECTS
   ========================================================================== */

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 12px var(--key-crystal-glow);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 24px var(--key-crystal-glow), 0 0 35px rgba(56, 189, 248, 0.5);
    transform: scale(1.08);
  }
}

@keyframes pulseRecording {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(40px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes floatMage {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

.floating {
  animation: floatMage 4s ease-in-out infinite;
}

.holo-scanline {
  position: relative;
  overflow: hidden;
}

.holo-scanline::after {
  content: " ";
  display: block;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 242, 254, 0.05) 50%);
  background-size: 100% 4px;
  z-index: 2;
  pointer-events: none;
  opacity: 0.6;
}