@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap");

:root {
  /* Colors — near-black background, Claude orange-brown accent */
  --bg-primary: #0d0d0d;
  --bg-card: #1a1a1a;
  --bg-card-hover: #222222;
  --accent: #da7756;
  --accent-dim: #a85a3e;
  --text-primary: #f0e6d3;
  --text-secondary: #8a7d72;
  --border: #2a2a2a;

  /* Rarity colors */
  --rarity-common: #b0b0b0;
  --rarity-uncommon: #4ade80;
  --rarity-rare: #60a5fa;
  --rarity-epic: #c084fc;
  --rarity-legendary: #fbbf24;

  /* Typography */
  --font-ui: system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", monospace;

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;

  /* Layout */
  --max-width: 1200px;
  --card-radius: 8px;
  --grid-gap: 1rem;
}