.fly {
  position: fixed;
  width: 20px;
  height: 20px;
  z-index: 9999;
  cursor: pointer;
  pointer-events: auto;
  transition: transform 0.1s linear;
}

/* Health bar */
.fly-health-bar {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 16px;
  height: 3px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  overflow: hidden;
}

.fly-health-fill {
  height: 100%;
  width: 100%;
  background: #44ff44;
  transition: width 0.2s ease, background 0.3s ease;
}

/* Hungry fly animation */
.fly.hungry .fly-svg {
  animation: hungryPulse 0.5s ease-in-out infinite;
}

@keyframes hungryPulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

/* Mating indicator */
.fly.wants-mate::after {
  content: '♥';
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  color: #ff69b4;
  animation: heartFloat 1s ease-in-out infinite;
  pointer-events: none;
}

@keyframes heartFloat {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
    opacity: 0.8;
  }
  50% {
    transform: translateX(-50%) translateY(-3px);
    opacity: 1;
  }
}

/* Death animation */
.fly.dying {
  animation: flyDeath 0.5s ease-out forwards;
  pointer-events: none;
}

@keyframes flyDeath {
  0% {
    transform: rotate(var(--rotation, 0deg)) scale(1);
    opacity: 1;
  }
  50% {
    transform: rotate(var(--rotation, 0deg)) scale(1.2) rotate(180deg);
  }
  100% {
    transform: rotate(var(--rotation, 0deg)) scale(0) rotate(360deg);
    opacity: 0;
  }
}

.fly-svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.fly:hover {
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.5));
}

/* Subtle wing shimmer effect */
.fly-wing {
  animation: wingShimmer 0.15s infinite alternate;
}

.fly-wing-left {
  animation-delay: 0s;
}

.fly-wing-right {
  animation-delay: 0.075s;
}

@keyframes wingShimmer {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 0.5;
  }
}

/* Eye glow when staring */
.fly.staring .fly-eye {
  fill: #ff0000;
  filter: drop-shadow(0 0 2px #ff0000);
}

/* Leg animation handled by JS, but smooth transitions */
.fly-leg {
  transition: y2 0.05s linear;
}

/* Eaten letter styles */
.fly-eaten-letter {
  color: transparent;
  transition: color 0.2s ease;
}

.fly-eaten-letter-respawn {
  color: inherit;
  animation: letterRespawn 0.3s ease;
}

@keyframes letterRespawn {
  0% {
    color: transparent;
    transform: scale(0);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    color: inherit;
    transform: scale(1);
  }
}

/* Immortal fly - rainbow glow effect */
.fly.immortal {
  animation: immortalGlow 0.5s ease-in-out infinite;
}

.fly.immortal .fly-svg {
  filter: drop-shadow(0 0 8px #FFD700) drop-shadow(0 0 12px #FF69B4);
}

.fly.immortal::before {
  content: '';
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
  background: conic-gradient(
    #FF0000,
    #FF7F00,
    #FFFF00,
    #00FF00,
    #0000FF,
    #4B0082,
    #9400D3,
    #FF0000
  );
  border-radius: 50%;
  z-index: -1;
  opacity: 0.4;
  animation: rainbowSpin 1s linear infinite;
}

@keyframes immortalGlow {
  0%, 100% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(1.3);
  }
}

@keyframes rainbowSpin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Overstimulated fly - hyperactive after eating poop */
.fly.overstimulated {
  animation: overstimulatedShake 0.1s ease-in-out infinite;
}

.fly.overstimulated .fly-svg {
  filter: drop-shadow(0 0 6px #FF69B4) drop-shadow(0 0 10px #9400D3);
}

.fly.overstimulated .fly-eye {
  fill: #FF00FF !important;
  animation: crazyEyes 0.2s ease-in-out infinite;
}

@keyframes overstimulatedShake {
  0%, 100% {
    transform: rotate(var(--rotation, 0deg)) translate(0, 0);
  }
  25% {
    transform: rotate(var(--rotation, 0deg)) translate(-1px, 1px);
  }
  50% {
    transform: rotate(var(--rotation, 0deg)) translate(1px, -1px);
  }
  75% {
    transform: rotate(var(--rotation, 0deg)) translate(-1px, -1px);
  }
}

@keyframes crazyEyes {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.3);
  }
}

/* ==================== WASP STYLES ==================== */

.wasp {
  position: fixed;
  width: 24px;
  height: 24px;
  z-index: 10000; /* Above flies */
  pointer-events: none;
  transition: transform 0.1s linear;
}

.wasp-svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

/* Health bar for wasps */
.wasp-health-bar {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 3px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  overflow: hidden;
}

.wasp-health-fill {
  height: 100%;
  width: 100%;
  background: #ff8c00;
  transition: width 0.2s ease, background 0.3s ease;
}

/* Hunting wasp - aggressive appearance */
.wasp.hunting .wasp-svg {
  filter: drop-shadow(0 0 4px rgba(255, 0, 0, 0.5));
}

.wasp.hunting::after {
  content: '⚔';
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 10px;
  color: #ff0000;
  animation: huntPulse 0.5s ease-in-out infinite;
  pointer-events: none;
}

@keyframes huntPulse {
  0%, 100% {
    opacity: 0.6;
    transform: translateX(-50%) scale(1);
  }
  50% {
    opacity: 1;
    transform: translateX(-50%) scale(1.2);
  }
}

/* Relaxing wasp - calm appearance */
.wasp.relaxing .wasp-svg {
  filter: drop-shadow(0 0 3px rgba(255, 215, 0, 0.4));
  opacity: 0.85;
}

.wasp.relaxing::after {
  content: '💤';
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  animation: sleepFloat 1.5s ease-in-out infinite;
  pointer-events: none;
}

@keyframes sleepFloat {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
    opacity: 0.5;
  }
  50% {
    transform: translateX(-50%) translateY(-4px);
    opacity: 1;
  }
}

/* Wasp wing animation */
.wasp-wing {
  animation: waspWingBuzz 0.08s infinite alternate;
}

.wasp-wing-left {
  animation-delay: 0s;
}

.wasp-wing-right {
  animation-delay: 0.04s;
}

@keyframes waspWingBuzz {
  0% {
    opacity: 0.4;
  }
  100% {
    opacity: 0.6;
  }
}

/* Wasp death animation */
.wasp.dying {
  animation: waspDeath 0.5s ease-out forwards;
  pointer-events: none;
}

@keyframes waspDeath {
  0% {
    transform: rotate(var(--rotation, 0deg)) scale(1);
    opacity: 1;
  }
  30% {
    transform: rotate(var(--rotation, 0deg)) scale(1.1);
  }
  100% {
    transform: rotate(var(--rotation, 0deg)) scale(0) rotate(720deg);
    opacity: 0;
  }
}

/* Wasp leg animation handled by JS */
.wasp-leg {
  transition: y2 0.05s linear;
}