/* Westgate Labs design tokens — generated from design-system/tokens.json. Edit the JSON, then run node scripts/build-tokens.mjs */

@font-face { font-family: "Source Serif 4"; src: url("../assets/fonts/SourceSerif4-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

@font-face { font-family: "Manrope"; src: url("../assets/fonts/Manrope-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

@font-face { font-family: "Manrope"; src: url("../assets/fonts/Manrope-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

@font-face { font-family: "Manrope"; src: url("../assets/fonts/Manrope-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

@font-face { font-family: "IBM Plex Mono"; src: url("../assets/fonts/IBMPlexMono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

@font-face { font-family: "IBM Plex Mono"; src: url("../assets/fonts/IBMPlexMono-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --navy-900: #0f2447;
  --navy-700: #1a3a6b;
  --navy-100: #e3e9f3;
  --copper-500: #b8742a;
  --copper-700: #8a5419;
  --copper-text: #8a5419;
  --copper-100: #f6e9d8;
  --on-navy: #ffffff;
  --on-copper: #ffffff;
  --surface: #ffffff;
  --sand: #f5f1ea;
  --surface-raised: #ffffff;
  --logo-plate: #ffffff;
  --ink: #14213a;
  --ink-muted: #5b6474;
  --border: #cfd4dc;
  --border-strong: #5b6474;
  --focus: #b8742a;
  --success: #1f6b3a;
  --success-tint: #e2f2e8;
  --danger: #a32d2d;
  --danger-tint: #f9e4e4;
  --shadow-sm: 0 1px 2px rgba(15, 36, 71, 0.08);
  --shadow-lg: 0 12px 32px rgba(15, 36, 71, 0.16);
}

@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  color-scheme: dark;
  --navy-900: #0f2447;
  --navy-700: #1a3a6b;
  --navy-100: #1c2c48;
  --copper-500: #d89a52;
  --copper-700: #e0a866;
  --copper-text: #e0a866;
  --copper-100: #3a2a16;
  --on-navy: #ffffff;
  --on-copper: #0f2447;
  --surface: #0b1424;
  --sand: #101b2e;
  --surface-raised: #132038;
  --logo-plate: #ffffff;
  --ink: #eef1f6;
  --ink-muted: #a5aebc;
  --border: #2a3a55;
  --border-strong: #a5aebc;
  --focus: #e0a866;
  --success: #5fc98a;
  --success-tint: #14301f;
  --danger: #f08a8a;
  --danger-tint: #3b1a1a;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.6);
}
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --navy-900: #0f2447;
  --navy-700: #1a3a6b;
  --navy-100: #1c2c48;
  --copper-500: #d89a52;
  --copper-700: #e0a866;
  --copper-text: #e0a866;
  --copper-100: #3a2a16;
  --on-navy: #ffffff;
  --on-copper: #0f2447;
  --surface: #0b1424;
  --sand: #101b2e;
  --surface-raised: #132038;
  --logo-plate: #ffffff;
  --ink: #eef1f6;
  --ink-muted: #a5aebc;
  --border: #2a3a55;
  --border-strong: #a5aebc;
  --focus: #e0a866;
  --success: #5fc98a;
  --success-tint: #14301f;
  --danger: #f08a8a;
  --danger-tint: #3b1a1a;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.6);
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --font-display: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --font-sans: Manrope, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Menlo, Consolas, monospace;
}

.display-xl { font-family: var(--font-display); font-size: 64px; line-height: 68px; font-weight: 600; letter-spacing: -0.02em; }

.display-lg { font-family: var(--font-display); font-size: 44px; line-height: 50px; font-weight: 600; letter-spacing: -0.015em; }

.heading-md { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 600; letter-spacing: -0.01em; }

.heading-sm { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 700; }

.body-lg { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 400; }

.body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }

.body-sm { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }

.label { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: 0.08em; }

.numeral-lg { font-family: var(--font-mono); font-size: 40px; line-height: 44px; font-weight: 500; letter-spacing: -0.02em; }

.numeral-sm { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 400; }