frontend/src/index.css

@import "tailwindcss";

@theme {
  --color-primary-50: #eff6ff;
  --color-primary-100: #dbeafe;
  --color-primary-200: #bfdbfe;
  --color-primary-300: #93c5fd;
  --color-primary-400: #60a5fa;
  --color-primary-500: #2563eb;
  --color-primary-600: #1e3a5f;
  --color-primary-700: #1a365d;
  --color-primary-800: #153050;
  --color-primary-900: #0f2440;

  --color-accent-400: #2dd4bf;
  --color-accent-500: #0d9488;
  --color-accent-600: #0b7c72;

  --color-medical-stroke: #dc2626;
  --color-medical-healthy: #16a34a;
  --color-medical-warning: #d97706;
  --color-medical-info: #2563eb;

  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
}

@layer base {
  body {
    @apply bg-gray-50 text-gray-800 antialiased;
    margin: 0;
  }
}

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

.page-enter {
  animation: fadeIn 0.3s ease-out;
}

::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}