@import "tailwindcss";

@theme {
  --font-sans: "Inter", "PingFang SC", "Microsoft YaHei", sans-serif;
  --color-star-purple: #8b5cf6;
  --color-star-dark: #0f172a;
}

@layer base {
  html {
    scroll-behavior: smooth;
  }
  body {
    @apply bg-slate-950 text-slate-200 antialiased;
  }
}

.glass-card {
  @apply bg-white/5 backdrop-blur-md border border-white/10 rounded-2xl;
}

.gradient-text {
  @apply bg-clip-text text-transparent bg-gradient-to-r from-violet-400 to-emerald-400;
}

.movie-card-hover {
  @apply transition-all duration-300 hover:scale-105 hover:shadow-[0_0_20px_rgba(139,92,246,0.3)];
}

[data-page] {
  display: none;
}

[data-page].active {
  display: block;
}

.fade-in {
  animation: fadeIn 0.5s ease-out forwards;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}