@import "tailwindcss";

@theme {
  --color-bg-primary: #0b0d14;
  --color-bg-secondary: #111520;
  --color-bg-card: #181d2a;
  --color-bg-card-hover: #1f2638;
  --color-border: #252d3f;
  --color-border-light: #2e3750;
  --color-text-primary: #e8eaf0;
  --color-text-secondary: #8892a8;
  --color-text-muted: #5c6478;
  --color-accent: #4f8ff7;
  --color-accent-dim: #2a4a80;
  --color-success: #34d399;
  --color-success-dim: #0d3d2e;
  --color-danger: #f87171;
  --color-danger-dim: #3d1515;
  --color-warning: #fbbf24;
  --color-warning-dim: #3d2e0a;
}

html {
  /* Scales with viewport: ~14px at 1920w, ~16px at 3840w, min 10px */
  font-size: clamp(10px, 0.75vw, 16px);
}

body {
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  margin: 0;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
}

::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 2px;
}