@import "tailwindcss";
@source "./**/*.{js,jsx,ts,tsx}";

@theme {
  --color-brand-bg: #F8FAFC;
  --color-brand-card: #FFFFFF;
  --color-brand-accent: #3B82F6;
  --color-brand-accent-hover: #1D4ED8;
  --color-brand-textMain: #0F172A;
  --color-brand-textMuted: #64748B;
  --color-brand-border: #E2E8F0;
}

.dark {
  --color-brand-bg: #0B0F19;
  --color-brand-card: #151D30;
  --color-brand-accent: #3B82F6;
  --color-brand-accent-hover: #2563EB;
  --color-brand-textMain: #F3F4F6;
  --color-brand-textMuted: #9CA3AF;
  --color-brand-border: #1E293B;
}

body {
  margin: 0;
  background-color: var(--color-brand-bg);
  color: var(--color-brand-textMain);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  overflow: hidden;
  transition: background-color 0.3s ease, color 0.3s ease;
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: var(--color-brand-bg);
}

::-webkit-scrollbar-thumb {
  background: var(--color-brand-border);
  border-radius: 4px;
}