@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply bg-[#020202] text-white overflow-hidden;
    font-feature-settings: "ss01", "ss02", "cv01", "cv02", "tracking-tight";
    -webkit-font-smoothing: antialiased;
  }

  .custom-scrollbar::-webkit-scrollbar {
    width: 6px;
  }
  .custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
  }
  .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 20px;
  }
  .custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(139, 92, 246, 0.4);
  }
}

@layer utilities {
  .animate-spin-slow {
    animation: spin 16s linear infinite;
  }
}

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

@keyframes blob {
  0% { transform: translate(0px, 0px) scale(1); }
  33% { transform: translate(60px, -80px) scale(1.3); }
  66% { transform: translate(-50px, 50px) scale(0.8); }
  100% { transform: translate(0px, 0px) scale(1); }
}

.animate-blob {
  animation: blob 15s infinite alternate cubic-bezier(0.45, 0, 0.55, 1);
}

.glass-morphism {
  @apply bg-white/5 backdrop-blur-3xl border border-white/10 shadow-2xl;
}