frontend/src/index.css

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

@layer base {
  body {
    @apply bg-background text-text-primary antialiased selection:bg-accent-blue/30;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
  }
}

@layer components {
  .glass {
    @apply bg-surface/50 backdrop-blur-xl border border-white/10;
  }
  
  .glass-card {
    @apply glass rounded-3xl p-6 shadow-2xl transition-all duration-300 hover:border-white/20;
  }

  .accent-button {
    @apply bg-accent-gradient text-white font-medium px-6 py-2 rounded-2xl shadow-glow hover:opacity-90 transition-all active:scale-95;
  }

  .text-gradient {
    @apply bg-accent-gradient bg-clip-text text-transparent;
  }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  @apply bg-background;
}

::-webkit-scrollbar-thumb {
  @apply bg-white/10 rounded-full hover:bg-white/20 transition-colors;
}

/* Ambient Glow Effects */
.ambient-glow {
  position: absolute;
  width: 40vw;
  height: 40vw;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  filter: blur(100px);
  pointer-events: none;
  z-index: 0;
}