@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

html { scroll-behavior: smooth; }
body { background-color: #0F172A; font-family: 'Inter', sans-serif; }
.font-display { font-family: 'Space Grotesk', sans-serif; }

::selection { background: rgba(59,130,246,0.35); }
:focus-visible { outline: 2px solid #60a5fa; outline-offset: 3px; border-radius: 6px; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0F172A; }
::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 10px; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.reveal-in { opacity: 1; transform: translateY(0); }
.reveal-hero { animation: fadeSlideIn .7s ease both; }

@keyframes fadeSlideIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pulseSlow { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
.animate-pulse-slow { animation: pulseSlow 6s ease-in-out infinite; }

@keyframes toastIn { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }
.toast-in { animation: toastIn .25s ease both; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-hero, .animate-pulse-slow, .toast-in { animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; }
}

/* Admin panel table helpers */
.admin-card { background: rgba(30,41,59,.5); border: 1px solid rgba(51,65,85,.6); border-radius: 16px; }