:root {
  /* Typography */
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Brand */
  --accent: #f79256;
  --accent-hover: color-mix(in srgb, var(--accent) 86%, #000);
  --accent-press: color-mix(in srgb, var(--accent) 74%, #000);
  --on-accent: #11202f;
  --shadow-accent: 0 6px 18px color-mix(in srgb, var(--accent) 38%, transparent);

  --primary: #1d3557;
  --primary-hover: #16294a;
  --primary-press: #11203b;

  /* Surfaces */
  --bg: #f7f4ef;
  --bg-elevated: #ffffff;
  --bg-sunken: #efeae2;
  --bg-inverse: #11202f;

  /* Foreground */
  --fg: #11202f;
  --fg-muted: #4a5b6e;
  --fg-subtle: #6b7d8c;
  --fg-on-dark: #f4f7fb;
  --fg-on-dark-muted: rgba(244, 247, 251, 0.72);

  /* Borders */
  --border: #e4ddd0;
  --border-strong: #d3c8b4;
  --border-on-dark: rgba(244, 247, 251, 0.12);

  /* Accent / supporting */
  --dusk-blue: #1d3557;
  --dusk-blue-900: #0c1a29;
  --pearl-aqua: #7dcfb6;
  --pacific-blue: #00b2ca;
  --focus-ring: color-mix(in srgb, var(--pacific-blue) 30%, transparent);
  --link-hover: var(--accent);

  /* Neutral scale (used by kit) */
  --n-100: #efeae2;
  --n-400: #98a3ad;

  /* Radii */
  --r-md: 8px;
  --r-lg: 14px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(17, 32, 47, 0.06);
  --shadow-sm: 0 2px 6px rgba(17, 32, 47, 0.06);
  --shadow-md: 0 10px 24px rgba(17, 32, 47, 0.10);
}