/* Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: linear-gradient(180deg, #0F0F0F 0%, #1C1C1C 100%);
  min-height: 100vh;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Glassmorphism */
.glass {
  background: rgba(28, 28, 28, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Glow Effects */
.glow-mint {
  box-shadow: 0 0 30px rgba(159, 255, 203, 0.3);
}

.glow-coral {
  box-shadow: 0 0 30px rgba(255, 155, 155, 0.3);
}

.glow-lilac {
  box-shadow: 0 0 30px rgba(196, 159, 255, 0.3);
}

.glow-blue {
  box-shadow: 0 0 30px rgba(111, 184, 255, 0.3);
}

/* Animations */
@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
}

@keyframes pulse-slow {
  0%, 100% {
    opacity: 0.3;
    transform: scale(1);
  }
  50% {
    opacity: 0.5;
    transform: scale(1.1);
  }
}

@keyframes pulse-slower {
  0%, 100% {
    opacity: 0.3;
    transform: scale(1.1);
  }
  50% {
    opacity: 0.5;
    transform: scale(1);
  }
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

.animate-pulse-slow {
  animation: pulse-slow 8s ease-in-out infinite;
}

.animate-pulse-slower {
  animation: pulse-slower 10s ease-in-out infinite;
}

/* Smooth transitions */
.transition-all {
  transition: all 0.3s ease;
}

/* Image loading state */
img {
  max-width: 100%;
  height: auto;
}

img[loading="lazy"] {
  opacity: 0;
  transition: opacity 0.3s;
}

img[loading="lazy"].loaded {
  opacity: 1;
}

/* Fade in animation for notifications */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 0.3s ease-out;
}