/* ═══════════════════════════════════════════════════════════════
   DARKNET WEB PANEL — ANIMATIONS
   All @keyframes and animated element base styles
   ═══════════════════════════════════════════════════════════════ */

/* ─── Core Animations ─── */
@keyframes shimmer {
  0%   { background-position: -400% center; }
  100% { background-position:  400% center; }
}

@keyframes float {
  0%,100% { transform: translateY(0) rotate(-1deg); }
  50%      { transform: translateY(-14px) rotate(2deg); }
}

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

@keyframes spin {
  to { transform: rotate(360deg); }
}

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

@keyframes msgIn {
  from { opacity: 0; transform: translateX(-10px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes pulse {
  0%,100% { opacity: 1; }
  50%      { opacity: 0.45; }
}

@keyframes tailSwing {
  0%,100% { transform: rotate(-22deg); }
  50%      { transform: rotate(28deg); }
}

@keyframes eyeBlink {
  0%,85%,100% { transform: scaleY(1); }
  90%          { transform: scaleY(0.05); }
}

@keyframes catBounce {
  0%,100% { transform: translateY(0) scaleY(1); }
  40%      { transform: translateY(-22px) scaleY(1.04); }
  70%      { transform: translateY(-6px) scaleY(0.97); }
}

@keyframes catShadow {
  0%,100% { transform: scaleX(0.5); opacity: 0.3; }
  50%      { transform: scaleX(1.05); opacity: 0.12; }
}

@keyframes particle {
  0%   { opacity: 0.9; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-80px) translateX(var(--dx, 15px)) scale(0); }
}

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

@keyframes ripple {
  0%   { transform: scale(0); opacity: 0.7; }
  100% { transform: scale(3); opacity: 0; }
}

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

@keyframes connNew {
  0%   { opacity: 0; transform: translateX(-100%); }
  100% { opacity: 1; transform: translateX(0); }
}

@keyframes modalIn {
  from { opacity: 0; transform: scale(0.9) translateY(20px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes pinReveal {
  from { filter: blur(12px); opacity: 0.3; }
  to   { filter: blur(0); opacity: 1; }
}

@keyframes slideDown {
  from { opacity: 0; max-height: 0; transform: translateY(-8px); }
  to   { opacity: 1; max-height: 200px; transform: translateY(0); }
}

@keyframes delBtn {
  from { opacity: 0; transform: scale(0.8); }
  to   { opacity: 1; transform: scale(1); }
}

/* ─── Cyberpunk-Specific Animations ─── */
@keyframes neonPulse {
  0%, 100% {
    box-shadow:
      0 0 5px var(--gold),
      0 0 20px rgba(255,45,120,.4),
      0 0 40px rgba(255,45,120,.2),
      inset 0 0 10px rgba(255,45,120,.08);
  }
  50% {
    box-shadow:
      0 0 10px var(--gold),
      0 0 35px rgba(255,45,120,.6),
      0 0 70px rgba(255,45,120,.3),
      inset 0 0 20px rgba(255,45,120,.12);
  }
}

@keyframes neonTextPulse {
  0%, 100% { text-shadow: 0 0 8px rgba(255,45,120,.8), 0 0 20px rgba(255,45,120,.4); }
  50%       { text-shadow: 0 0 16px rgba(255,45,120,1), 0 0 40px rgba(255,45,120,.6); }
}

@keyframes scanLine {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}

@keyframes holoShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes glitchX {
  0%, 100% { clip-path: inset(0 0 98% 0); transform: translateX(0); }
  20%       { clip-path: inset(0 0 60% 0); transform: translateX(-4px); }
  40%       { clip-path: inset(30% 0 40% 0); transform: translateX(4px); }
  60%       { clip-path: inset(50% 0 20% 0); transform: translateX(-2px); }
  80%       { clip-path: inset(70% 0 5% 0); transform: translateX(2px); }
}

@keyframes sakuraFall {
  0%   { transform: translateY(-20px) rotate(0deg) translateX(0); opacity: 1; }
  25%  { transform: translateY(25vh) rotate(90deg) translateX(20px); }
  50%  { transform: translateY(50vh) rotate(180deg) translateX(-15px); }
  75%  { transform: translateY(75vh) rotate(270deg) translateX(10px); }
  100% { transform: translateY(105vh) rotate(360deg) translateX(-5px); opacity: 0; }
}

@keyframes orb {
  0%,100% { transform: scale(1) translateY(0); opacity: 0.6; }
  50%      { transform: scale(1.15) translateY(-10px); opacity: 0.9; }
}

@keyframes gridFlicker {
  0%, 98%, 100%  { opacity: 1; }
  99%             { opacity: 0.4; }
}

@keyframes borderFlow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

@keyframes holoPulse {
  0%, 100% {
    background-position: 0% 50%;
    filter: hue-rotate(0deg);
  }
  50% {
    background-position: 100% 50%;
    filter: hue-rotate(15deg);
  }
}

@keyframes waveIn {
  from { opacity: 0; transform: translateX(-20px) skewX(2deg); }
  to   { opacity: 1; transform: translateX(0) skewX(0); }
}

@keyframes statusBlink {
  0%, 100% { opacity: 1; box-shadow: 0 0 6px currentColor; }
  50%       { opacity: 0.5; box-shadow: 0 0 2px currentColor; }
}