@keyframes fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes grow {
  from { transform: scale(0.8); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

.animate-fade { animation: fade 0.6s ease-in-out; }
.animate-grow { animation: grow 0.8s ease-out; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #EEF1F6; }
::-webkit-scrollbar-thumb { background: #00C2D1; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #00a3b0; }

:root {
  --color-primary: #241B3A;
  --color-primary-dark: #1a1329;
  --color-accent: #00C2D1;
  --color-accent-hover: #00a3b0;
  --color-bg: #EEF1F6;
  --color-bg-alt: #E0E4EC;
  --color-text: #1B1E23;
  --color-text-muted: #4A5058;
  --color-border: #C5CAD4;
}