/* Global Styles */
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Voice Chat Blob Animations */

/* 1. Idle / Listening - Slow, fluid morphing */
@keyframes blob-idle {
  0% {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    transform: scale(1);
  }

  50% {
    border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
    transform: scale(1.05);
  }

  100% {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    transform: scale(1);
  }
}

/* 2. Speaking - Rapid, energetic morphing */
@keyframes blob-speaking {
  0% {
    border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%;
    transform: scale(1);
  }

  25% {
    border-radius: 60% 40% 60% 40% / 40% 60% 40% 60%;
    transform: scale(1.15);
  }

  50% {
    border-radius: 40% 60% 40% 60% / 60% 40% 60% 40%;
    transform: scale(1.1);
  }

  75% {
    border-radius: 60% 40% 60% 40% / 40% 60% 40% 60%;
    transform: scale(1.2);
  }

  100% {
    border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%;
    transform: scale(1);
  }
}

/* 3. Connecting / Thinking - Rotating fluid */
@keyframes blob-thinking {
  0% {
    transform: rotate(0deg) scale(0.8);
    border-radius: 40% 60% 50% 50% / 50% 50% 60% 40%;
  }

  50% {
    transform: rotate(180deg) scale(0.9);
    border-radius: 60% 40% 50% 50% / 50% 50% 40% 60%;
  }

  100% {
    transform: rotate(360deg) scale(0.8);
    border-radius: 40% 60% 50% 50% / 50% 50% 60% 40%;
  }
}

/* Animation Utilities */
.animate-blob-idle {
  animation: blob-idle 8s ease-in-out infinite;
}

.animate-blob-speaking {
  animation: blob-speaking 2s ease-in-out infinite;
}

.animate-blob-thinking {
  animation: blob-thinking 4s linear infinite;
}

/* Transition Utilities */
.transition-colors-slow {
  transition: background-color 1s ease, box-shadow 1s ease;
}

.transition-shape {
  transition: border-radius 0.5s ease-in-out, transform 0.5s ease-in-out;
}