:root {
  --border-color: #ff00ff;
  --border-width: 3px;
  --border-radius: 20px;
  --border-animation-speed: 2s;
}

.border-neon {
  border: var(--border-width) solid var(--border-color);
  border-radius: var(--border-radius);
  box-shadow: 0 0 10px var(--border-color), 0 0 20px var(--border-color), 0 0 30px var(--border-color);
  transition: box-shadow var(--border-animation-speed) ease-in-out;
}
.border-neon:hover {
  box-shadow: 0 0 20px var(--border-color), 0 0 40px var(--border-color), 0 0 60px var(--border-color);
}

.border-gradient {
  border: var(--border-width) solid;
  border-image: linear-gradient(45deg, #ff00ff, #00ffff, #ff9900, #ff00ff) 1;
  border-radius: var(--border-radius);
  animation: borderGradient var(--border-animation-speed) linear infinite;
}

@keyframes borderGradient {
  0% { border-image: linear-gradient(45deg, #ff00ff, #00ffff, #ff9900, #ff00ff) 1; }
  50% { border-image: linear-gradient(225deg, #ff00ff, #00ffff, #ff9900, #ff00ff) 1; }
  100% { border-image: linear-gradient(405deg, #ff00ff, #00ffff, #ff9900, #ff00ff) 1; }
}

.border-dotted-pulse {
  border: var(--border-width) dotted var(--border-color);
  border-radius: var(--border-radius);
  animation: pulseBorder var(--border-animation-speed) infinite alternate;
}

@keyframes pulseBorder {
  0% { box-shadow: 0 0 0 var(--border-color); }
  100% { box-shadow: 0 0 20px var(--border-color); }
}

.border-dashed {
  border: var(--border-width) dashed var(--border-color);
  border-radius: var(--border-radius);
  animation: dashMove var(--border-animation-speed) linear infinite;
}

@keyframes dashMove {
  to { border-spacing: 100%; }
}

.border-double-glow {
  border: var(--border-width) double var(--border-color);
  border-radius: var(--border-radius);
  box-shadow: 0 0 5px var(--border-color), 0 0 15px var(--border-color), 0 0 25px var(--border-color);
}

.border-inset-shadow {
  border: var(--border-width) solid transparent;
  border-radius: var(--border-radius);
  box-shadow: inset 0 0 10px var(--border-color);
}

.border-corner-rotate {
  position: relative;
  border-radius: var(--border-radius);
}

.border-corner-rotate::before,
.border-corner-rotate::after {
  content: '';
  position: absolute;
  width: 50%;
  height: 50%;
  border: var(--border-width) solid var(--border-color);
  border-radius: var(--border-radius);
  animation: rotateCorners var(--border-animation-speed) linear infinite;
}

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

.border-shadow-pulse {
  border: var(--border-width) solid var(--border-color);
  border-radius: var(--border-radius);
  animation: shadowPulse 3s infinite;
}

@keyframes shadowPulse {
  0%, 100% { box-shadow: 0 0 10px var(--border-color), 0 0 20px var(--border-color); }
  50% { box-shadow: 0 0 30px var(--border-color), 0 0 60px var(--border-color); }
}

.border-animated-corners {
  border: var(--border-width) solid transparent;
  border-radius: var(--border-radius);
  position: relative;
}

.border-animated-corners::before,
.border-animated-corners::after {
  content: '';
  position: absolute;
  width: 10px;
  height: 10px;
  background: var(--border-color);
  animation: blinkCorners 2s infinite;
}

@keyframes blinkCorners {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0; }
}

.border-rainbow {
  border: var(--border-width) solid;
  border-radius: var(--border-radius);
  border-image: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet) 1;
  animation: rainbowPulse 4s linear infinite;
}

@keyframes rainbowPulse {
  0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}