@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes slideIn {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes slideOut {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* Enhanced smooth animations for popup */

@keyframes cosmicFade {
  0% { 
    background-color: rgba(0, 0, 0, 0);
    backdrop-filter: blur(0px);
  }
  25% {
    background-color: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
  }
  75% {
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
  }
  100% { 
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
  }
}

@keyframes dataStream {
  0% { 
    opacity: 0;
    transform: translateY(-300%) scaleY(0.8);
  }
  5% {
    opacity: 0.1;
    transform: translateY(-250%) scaleY(0.9);
  }
  30%, 70% {
    opacity: 0.8;
    transform: translateY(100%) scaleY(1.05);
  }
  95% {
    opacity: 0.1;
    transform: translateY(250%) scaleY(0.9);
  }
  100% {
    opacity: 0;
    transform: translateY(300%) scaleY(0.8);
  }
}

@keyframes hologramAppear {
  0% {
    opacity: 0;
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    transform: perspective(1200px) translateY(-100px) rotateX(40deg) scale(0.7);
    filter: brightness(3) saturate(2) hue-rotate(30deg);
  }
  10% {
    opacity: 0.2;
    clip-path: polygon(0 0, 100% 0, 100% 10%, 0 3%);
    filter: brightness(2.7) saturate(1.9) hue-rotate(27deg) contrast(1.2);
    transform: perspective(1200px) translateY(-80px) rotateX(35deg) scale(0.73) skewX(1.5deg);
  }
  20% {
    opacity: 0.4;
    clip-path: polygon(0 0, 100% 0, 100% 20%, 0 13%);
    filter: brightness(2.4) saturate(1.8) hue-rotate(23deg) contrast(1.15);
    transform: perspective(1200px) translateY(-60px) rotateX(28deg) scale(0.78) skewX(1deg);
  }
  30% {
    clip-path: polygon(0 0, 100% 0, 100% 35%, 0 25%);
    filter: brightness(2.1) saturate(1.7) hue-rotate(19deg) contrast(1.1);
    transform: perspective(1200px) translateY(-40px) rotateX(20deg) scale(0.83) skewX(0deg);
  }
  40% {
    clip-path: polygon(0 0, 100% 0, 100% 50%, 0 40%);
    filter: brightness(1.8) saturate(1.5) hue-rotate(15deg) contrast(1.05);
    transform: perspective(1200px) translateY(-30px) rotateX(15deg) scale(0.87) skewX(-0.5deg);
  }
  60% {
    clip-path: polygon(0 0, 100% 0, 100% 75%, 0 60%);
    opacity: 0.8;
    filter: brightness(1.5) saturate(1.3) hue-rotate(10deg) contrast(1.03);
    transform: perspective(1200px) translateY(-15px) rotateX(7deg) scale(0.93) skewX(0deg);
  }
  80% {
    clip-path: polygon(0 0, 100% 0, 100% 95%, 0 85%);
    filter: brightness(1.2) saturate(1.1) hue-rotate(5deg) contrast(1);
    transform: perspective(1200px) translateY(-5px) rotateX(3deg) scale(0.97) skewX(0deg);
  }
  100% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transform: perspective(1200px) translateY(0) rotateX(0) scale(1);
    filter: brightness(1) saturate(1) hue-rotate(0) contrast(1);
  }
}

@keyframes hologramDisappear {
  0% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transform: perspective(1200px) translateY(0) rotateX(0) scale(1);
  }
  20% {
    opacity: 0.9;
    clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 90%);
    transform: perspective(1200px) translateY(5px) rotateX(-3deg) scale(0.98);
  }
  40% {
    opacity: 0.7;
    clip-path: polygon(0 15%, 100% 5%, 100% 85%, 0 75%);
    transform: perspective(1200px) translateY(10px) rotateX(-8deg) scale(0.95);
  }
  70% {
    opacity: 0.4;
    clip-path: polygon(0 30%, 100% 20%, 100% 60%, 0 45%);
    transform: perspective(1200px) translateY(20px) rotateX(-15deg) scale(0.9);
  }
  100% {
    opacity: 0;
    clip-path: polygon(0 49%, 100% 49%, 100% 51%, 0 51%);
    transform: perspective(1200px) translateY(30px) rotateX(-20deg) scale(0.8);
  }
}

/* Apply these GPU-accelerated properties */
.popup-container {
  animation: cosmicFade 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
  will-change: backdrop-filter, background-color;
}

.popup-content {
  will-change: transform, opacity, filter, clip-path;
  animation: hologramAppear 1.5s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
  backface-visibility: hidden;
  perspective: 1000px;
  transform-style: preserve-3d;
  transform: translateZ(0);
  z-index: 200; /* Increased z-index */
  background-color: rgba(20, 10, 30, 0.95); /* More opaque background */
  box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.7); /* Shadow to help separate from background */
  position: relative; /* Ensure z-index works correctly */
}

.popup-container.closing {
  animation: cosmicFade 0.8s cubic-bezier(0.55, 0.085, 0.68, 0.53) reverse forwards;
}

.popup-container.closing .popup-content {
  animation: hologramDisappear 0.8s cubic-bezier(0.55, 0.085, 0.68, 0.53) forwards;
}

/* Data stream enhancements */
.data-stream {
  position: absolute;
  width: 1px;
  background: linear-gradient(to bottom, 
    rgba(147, 112, 219, 0) 0%,
    rgba(147, 112, 219, 0.3) 15%, 
    rgba(147, 112, 219, 0.8) 50%, 
    rgba(147, 112, 219, 0.3) 85%, 
    rgba(147, 112, 219, 0) 100%
  );
  will-change: transform, opacity;
  transform: translateZ(0);
  z-index: 50; /* Lower z-index */
}

/* Cool animations for popup */
@keyframes cosmicFade {
  0% { 
    background-color: rgba(0, 0, 0, 0);
    backdrop-filter: blur(0px);
  }
  100% { 
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
  }
}

@keyframes spaceEntrance {
  0% {
    opacity: 0;
    transform: scale(0.4) translateY(100px) rotate(-2deg);
    box-shadow: 0 0 0 rgba(147, 112, 219, 0);
  }
  40% {
    opacity: 0.8;
    transform: scale(1.05) translateY(-20px) rotate(1deg);
  }
  70% {
    transform: scale(0.95) translateY(10px) rotate(0deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0) rotate(0deg);
    box-shadow: 0 0 30px rgba(147, 112, 219, 0.8);
  }
}

@keyframes borderPulse {
  0% { border-color: rgba(147, 112, 219, 0.6); }
  50% { border-color: rgba(147, 112, 219, 1); }
  100% { border-color: rgba(147, 112, 219, 0.6); }
}

@keyframes starTwinkle {
  0% { opacity: 0.05; }
  50% { opacity: 0.15; }
  100% { opacity: 0.05; }
}

/* Replace your current popup animations with these sci-fi hologram animations */

@keyframes hologramAppear {
  0% {
    opacity: 0;
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    transform: perspective(1200px) translateY(-100px) rotateX(40deg) scale(0.7);
    filter: brightness(3) saturate(2) hue-rotate(30deg);
  }
  15% {
    opacity: 0.3;
    clip-path: polygon(0 0, 100% 0, 100% 15%, 0 5%);
    filter: brightness(2.5) saturate(1.8) hue-rotate(25deg) contrast(1.2);
    transform: perspective(1200px) translateY(-70px) rotateX(30deg) scale(0.75) skewX(2deg);
  }
  30% {
    clip-path: polygon(0 0, 100% 0, 100% 30%, 0 20%);
    filter: brightness(2) saturate(1.6) hue-rotate(15deg) contrast(1.1);
    transform: perspective(1200px) translateY(-40px) rotateX(20deg) scale(0.85) skewX(-1deg);
  }
  50% {
    clip-path: polygon(0 0, 100% 0, 100% 60%, 0 40%);
    opacity: 0.7;
    filter: brightness(1.7) saturate(1.4) hue-rotate(10deg) contrast(1.05);
    transform: perspective(1200px) translateY(-20px) rotateX(10deg) scale(0.9) skewX(0.5deg);
  }
  75% {
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0 70%);
    filter: brightness(1.3) saturate(1.2) hue-rotate(5deg) contrast(1);
    transform: perspective(1200px) translateY(-10px) rotateX(5deg) scale(0.95) skewX(0deg);
  }
  100% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transform: perspective(1200px) translateY(0) rotateX(0) scale(1);
    filter: brightness(1) saturate(1) hue-rotate(0) contrast(1);
  }
}

@keyframes scanLines {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0 100px;
  }
}

@keyframes glitchEffect {
  0%, 100% { transform: translate(0); }
  20% { transform: translate(-2px, 2px); }
  40% { transform: translate(-2px, -2px); }
  60% { transform: translate(2px, 2px); }
  80% { transform: translate(2px, -2px); }
}

@keyframes hologramDisappear {
  0% {
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transform: perspective(1200px) translateY(0) rotateX(0);
    filter: brightness(1) saturate(1);
  }
  30% {
    opacity: 0.8;
    clip-path: polygon(0 20%, 100% 0, 100% 100%, 0 80%);
    filter: brightness(1.3) saturate(1.2) hue-rotate(5deg);
  }
  60% {
    opacity: 0.5;
    clip-path: polygon(0 40%, 100% 30%, 100% 70%, 0 60%);
    filter: brightness(1.5) saturate(1.3) hue-rotate(10deg);
  }
  100% {
    opacity: 0;
    clip-path: polygon(0 49%, 100% 49%, 100% 51%, 0 51%);
    transform: perspective(1200px) translateY(50px) rotateX(-30deg);
    filter: brightness(2) saturate(1.5) hue-rotate(20deg);
  }
}

@keyframes hologramBackground {
  0% {
    background-color: rgba(0, 0, 0, 0);
    backdrop-filter: blur(0px);
  }
  100% {
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
  }
}

/* Enhanced sci-fi hologram animations with advanced effects */

/* Add these new keyframes */
@keyframes dataStream {
  0%, 100% {
    opacity: 0;
    transform: translateY(-300%);
  }
  30%, 70% {
    opacity: 0.8;
    transform: translateY(300%);
  }
}

@keyframes edgeGlow {
  0% {
    box-shadow: 0 0 5px 2px rgba(147, 112, 219, 0.7), 
                inset 0 0 5px 1px rgba(147, 112, 219, 0.7);
  }
  50% {
    box-shadow: 0 0 15px 5px rgba(147, 112, 219, 0.9), 
                inset 0 0 10px 2px rgba(147, 112, 219, 0.9);
  }
  100% {
    box-shadow: 0 0 5px 2px rgba(147, 112, 219, 0.7), 
                inset 0 0 5px 1px rgba(147, 112, 219, 0.7);
  }
}

@keyframes binaryRain {
  0% { background-position: 0 0; }
  100% { background-position: 0 1000px; }
}

@keyframes quantum3DRotate {
  0% {
    transform: perspective(1200px) rotateY(0deg) rotateX(0deg);
  }
  25% {
    transform: perspective(1200px) rotateY(2deg) rotateX(-1deg);
  }
  50% {
    transform: perspective(1200px) rotateY(0deg) rotateX(1deg);
  }
  75% {
    transform: perspective(1200px) rotateY(-2deg) rotateX(0deg);
  }
  100% {
    transform: perspective(1200px) rotateY(0deg) rotateX(0deg);
  }
}

/* Update existing elements */
.popup-container {
  animation: hologramBackground 0.8s forwards;
  position: fixed;
  overflow: hidden;
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
}

.popup-content {
  position: relative;
  animation: 
    hologramAppear 1.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards,
    edgeGlow 4s ease-in-out infinite 1.5s,
    quantum3DRotate 15s ease-in-out infinite 1.5s;
  overflow: hidden;
  border: 1px solid rgba(147, 112, 219, 0.7);
  background-color: rgba(20, 10, 30, 0.9);
  transform-style: preserve-3d; /* Enable 3D transforms */
  will-change: transform, opacity, filter, clip-path;
  backface-visibility: hidden;
  transform: translateZ(0);
  z-index: 200; /* Increased z-index */
  background-color: rgba(20, 10, 30, 0.95); /* More opaque background */
  box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.7); /* Shadow to help separate from background */
  position: relative; /* Ensure z-index works correctly */
}

.popup-content::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(transparent 50%, rgba(147, 112, 219, 0.15) 50%);
  background-size: 100% 4px;
  pointer-events: none;
  z-index: 10;
  animation: scanLines 2s linear infinite;
}

/* Add data stream lines */
.popup-content::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: 
    linear-gradient(90deg, 
      transparent 0%, 
      rgba(147, 112, 219, 0.1) 45%, 
      rgba(147, 112, 219, 0.3) 50%,
      rgba(147, 112, 219, 0.1) 55%, 
      transparent 100%),
    linear-gradient(transparent 30%, rgba(255, 255, 255, 0.05) 30%, transparent 30.5%),
    linear-gradient(transparent 60%, rgba(255, 255, 255, 0.05) 60%, transparent 60.5%),
    linear-gradient(transparent 90%, rgba(255, 255, 255, 0.05) 90%, transparent 90.5%);
  opacity: 0.7;
  pointer-events: none;
  z-index: 11;
  animation: glitchEffect 8s infinite;
}

/* Add vertical binary code-like rain effect */
.popup-container::after {
  content: "01";
  font-family: monospace;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 12px;
  letter-spacing: 20px;
  line-height: 12px;
  background-size: 100px 100%;
  color: rgba(147, 112, 219, 0.15);
  pointer-events: none;
  white-space: pre;
  overflow: hidden;
  animation: binaryRain 30s linear infinite;
}

/* Enhanced starfield effect */
.popup-container::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: 
    radial-gradient(circle at center, rgba(255, 255, 255, 0.8) 1px, transparent 1px),
    radial-gradient(circle at center, rgba(147, 112, 219, 0.8) 1px, transparent 1px),
    radial-gradient(circle at center, rgba(75, 0, 130, 0.5) 1px, transparent 2px);
  background-size: 40px 40px, 70px 70px, 100px 100px;
  background-position: 0 0, 35px 35px, 60px 60px;
  pointer-events: none;
  opacity: 0.3;
  animation: starTwinkle 4s ease infinite;
}

/* Add random data stream elements */
.popup-container.active::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Generate 10 random data streams */
.data-stream {
  position: absolute;
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, rgba(147, 112, 219, 0), rgba(147, 112, 219, 0.8), rgba(147, 112, 219, 0));
  opacity: 0;
  top: 0;
  animation: dataStream 3s ease-in-out infinite;
}

.popup-container.closing {
  animation: hologramBackground 1s forwards reverse;
}

.popup-container.closing .popup-content {
  animation: hologramDisappear 1s forwards cubic-bezier(0.5, 0, 0.75, 0);
}

/* Add/update these animations for smoother data streams */

@keyframes dataStreamVertical {
  0% { 
    opacity: 0;
    transform: translateY(-100%) scaleY(0.8);
  }
  10% {
    opacity: var(--stream-opacity, 0.5);
  }
  90% {
    opacity: var(--stream-opacity, 0.5);
  }
  100% {
    opacity: 0;
    transform: translateY(100%) scaleY(0.8);
  }
}

@keyframes dataStreamHorizontal {
  0% {
    opacity: 0;
    transform: translateX(-5%) scaleX(0.9);
  }
  10% {
    opacity: var(--stream-opacity, 0.5);
    transform: translateX(0%) scaleX(1);
  }
  90% {
    opacity: var(--stream-opacity, 0.5);
    transform: translateX(calc(100% - 100px)) scaleX(1);
  }
  100% {
    opacity: 0;
    transform: translateX(100%) scaleX(0.9);
  }
}

/* Base data stream styles */
.data-stream {
  position: absolute;
  will-change: transform, opacity;
  transform: translateZ(0); /* Force GPU acceleration */
  pointer-events: none;
}

/* Vertical data streams */
.data-stream.vertical {
  width: 1px;
  background: linear-gradient(to bottom, 
    rgba(147, 112, 219, 0) 0%,
    rgba(147, 112, 219, 0.3) 15%, 
    rgba(147, 112, 219, 0.8) 50%, 
    rgba(147, 112, 219, 0.3) 85%, 
    rgba(147, 112, 219, 0) 100%
  );
  animation: dataStreamVertical var(--duration, 4s) var(--easing, cubic-bezier(0.25, 0.1, 0.25, 1)) infinite;
  --stream-opacity: 0.5;
  box-shadow: 0 0 4px rgba(147, 112, 219, 0.5);
}

/* Horizontal data streams */
.data-stream.horizontal {
  height: 1px;
  background: linear-gradient(to right, 
    rgba(147, 112, 219, 0) 0%,
    rgba(147, 112, 219, 0.3) 10%, 
    rgba(147, 112, 219, 0.8) 50%, 
    rgba(147, 112, 219, 0.3) 90%, 
    rgba(147, 112, 219, 0) 100%
  );
  animation: dataStreamHorizontal var(--duration, 8s) var(--easing, cubic-bezier(0.1, 0.7, 0.1, 1)) infinite;
  --stream-opacity: 0.5;
  box-shadow: 0 0 4px rgba(147, 112, 219, 0.5);
}

/* Optimize popup container for performance */
.popup-container {
  will-change: backdrop-filter, background-color;
  transform: translateZ(0);
}

/* Optimize popup content for smoother transitions */
.popup-content {
  will-change: transform, opacity, filter, clip-path;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transform: translateZ(0);
  transition: transform 0.3s ease;
  z-index: 200; /* Increased z-index */
  background-color: rgba(20, 10, 30, 0.95); /* More opaque background */
  box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.7); /* Shadow to help separate from background */
  position: relative; /* Ensure z-index works correctly */
}

/* Apply a subtle hover effect to the popup content */
.popup-content:hover {
  transform: translateZ(0) scale(1.01);
}

/* Update these styles to prevent data streams from passing through the popup */

/* Make popup content more solid with higher z-index */
.popup-content {
  will-change: transform, opacity, filter, clip-path;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transform: translateZ(0);
  transition: transform 0.3s ease;
  z-index: 200; /* Increased z-index */
  background-color: rgba(20, 10, 30, 0.95); /* More opaque background */
  box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.7); /* Shadow to help separate from background */
  position: relative; /* Ensure z-index works correctly */
}

/* Ensure data streams have lower z-index */
.data-stream {
  position: absolute;
  will-change: transform, opacity;
  transform: translateZ(0);
  pointer-events: none;
  z-index: 50; /* Lower z-index */
}

/* Replace the choppy hologram animation with a smoother transition */

@keyframes smoothFadeIn {
  0% {
    opacity: 0;
    transform: scale(0.95) translateY(10px);
    box-shadow: 0 0 0 rgba(147, 112, 219, 0);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
    box-shadow: 0 0 30px rgba(147, 112, 219, 0.8), inset 0 0 15px rgba(147, 112, 219, 0.3);
  }
}

@keyframes smoothFadeOut {
  0% {
    opacity: 1;
    transform: scale(1) translateY(0);
    box-shadow: 0 0 30px rgba(147, 112, 219, 0.8), inset 0 0 15px rgba(147, 112, 219, 0.3);
  }
  100% {
    opacity: 0;
    transform: scale(0.95) translateY(10px);
    box-shadow: 0 0 0 rgba(147, 112, 219, 0);
  }
}

/* Apply smooth animation to popup content */
.popup-content {
  animation: none; /* Remove old animation */
  opacity: 0; /* Start invisible */
  transition: opacity 0.5s ease-out, transform 0.5s ease-out, box-shadow 0.5s ease-out;
}

/* When container is shown, animate the content */
.popup-container.active .popup-content {
  animation: smoothFadeIn 0.6s cubic-bezier(0.1, 0.9, 0.2, 1) forwards;
}

/* Smooth closing animation */
.popup-container.closing .popup-content {
  animation: smoothFadeOut 0.5s cubic-bezier(0.1, 0.9, 0.2, 1) forwards;
}

/* Also update the container background fade */
.popup-container {
  transition: background-color 0.6s ease, backdrop-filter 0.6s ease;
  background-color: rgba(0, 0, 0, 0);
  backdrop-filter: blur(0px);
}

.popup-container.active {
  background-color: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(5px);
}

/* Advanced sci-fi background animations */

/* Keyframes for particle effect */
@keyframes particleDrift {
  0% { transform: translate(0, 0); opacity: 0; }
  10% { opacity: 0.7; }
  90% { opacity: 0.7; }
  100% { transform: translate(var(--move-x, 100px), var(--move-y, 100px)); opacity: 0; }
}

@keyframes rotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.8; }
}

/* Main particle container that holds all the sci-fi elements */
.sci-fi-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 50;
  pointer-events: none;
}

/* Create grid overlay */
.grid-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: 
    linear-gradient(rgba(147, 112, 219, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(147, 112, 219, 0.1) 1px, transparent 1px);
  background-size: 40px 40px;
  opacity: 0.2;
  z-index: 51;
}

/* Tech circles that appear around the screen */
.tech-circle {
  position: absolute;
  border: 1px solid rgba(147, 112, 219, 0.4);
  border-radius: 50%;
  opacity: 0;
  animation: pulse 4s infinite;
}

/* Floating code elements */
.code-fragment {
  position: absolute;
  color: rgba(147, 112, 219, 0.6);
  font-family: monospace;
  font-size: 12px;
  opacity: 0;
  animation: particleDrift var(--drift-duration, 15s) var(--drift-timing, linear) infinite;
  text-shadow: 0 0 5px rgba(147, 112, 219, 0.8);
}

/* Digital circuit lines */
.circuit-line {
  position: absolute;
  background: linear-gradient(90deg, 
    rgba(147, 112, 219, 0) 0%,
    rgba(147, 112, 219, 0.5) 50%,
    rgba(147, 112, 219, 0) 100%
  );
  height: 1px;
  width: 100px;
  opacity: 0;
  animation: pulse 3s infinite;
  box-shadow: 0 0 10px rgba(147, 112, 219, 0.5);
}

/* Radar scan effect */
.radar-scan {
  position: absolute;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: conic-gradient(
    rgba(147, 112, 219, 0.2) 0%,
    rgba(147, 112, 219, 0) 20%
  );
  animation: rotate 6s linear infinite;
  opacity: 0.3;
  z-index: 52;
}