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

:root {
  color-scheme: dark;
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-bg: rgba(15, 23, 42, 0.6);
}

body {
  @apply bg-slate-950 text-slate-100 antialiased;
  background-image: 
    radial-gradient(circle at 15% 50%, rgba(56, 189, 248, 0.08), transparent 25%),
    radial-gradient(circle at 85% 30%, rgba(139, 92, 246, 0.15), transparent 25%);
  min-height: 100vh;
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }
  
  .glass-panel {
    @apply bg-slate-900/60 backdrop-blur-xl border border-white/10 shadow-xl;
  }
  
  .glass-header {
    @apply bg-slate-950/80 backdrop-blur-md border-b border-white/5 sticky top-0 z-50;
  }
  
  .text-gradient {
    @apply bg-clip-text text-transparent bg-gradient-to-r from-blue-400 via-violet-400 to-fuchsia-400;
  }
}