@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/Pretendard-Regular.subset.woff2') format('woff2');
}

@font-face {
  font-family: 'Pretendard';
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  src: url('/fonts/Pretendard-Bold.subset.woff2') format('woff2');
}

:root {
  /* Brand — 3 */
  --brand-ink: #17302d;
  --brand-teal: #0d8f91;
  --brand-lime: #b9df28;

  /* Extended — 4 */
  --accent-cta: #f5a623;
  --grade-smooth: #5fd3a8;
  --grade-normal: #fbbf24;
  --grade-congested: #ff7ba9;

  /* Neutral — 7 */
  --neutral-0: #ffffff;
  --neutral-50: #fbfaf7;
  --neutral-100: #f3f0ea;
  --neutral-300: #d7d1c9;
  --neutral-500: #a19b93;
  --neutral-700: #6b6560;
  --neutral-950: #26211e;

  --surface: var(--neutral-0);
  --canvas: var(--neutral-50);
  --line: var(--neutral-300);
  --muted: var(--neutral-500);
  --sub: var(--neutral-700);
  --ink: var(--neutral-950);

  /* Type scale — 8 */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.5rem;
  --text-display: clamp(2.5rem, 8vw, 4.5rem);
  --tracking-tight: -0.015em;

  /* Spacing — 7 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;

  --r-organic: 18px 22px 17px 24px;
  --r-organic-lg: 28px 34px 26px 38px;
  --r-round: 999px;

  /* Hard shadows — no blur */
  --shadow-hard-sm: 3px 3px 0 var(--brand-ink);
  --shadow-hard-md: 5px 5px 0 var(--brand-lime);
  --shadow-hard-lg: 7px 7px 0 var(--brand-ink);
}