/* elsegundo.xyz design tokens, version 1.
   The shared engine for new pages. Source of truth: the elsegundo.xyz design
   system (region colors from the first Regions of El Segundo map, Bricolage
   Grotesque, Public Sans, IBM Plex Mono). Everything is a custom property with
   an --esm- prefix, so it sits beside the older v2.css chrome without clashing.
   Day is sun-bleached map paper; Marine layer is the bay at night. */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,700;12..96,800&family=IBM+Plex+Mono:wght@500;600&family=Public+Sans:wght@400;600;700&display=swap');

:root {
  --esm-ground: #fbfaf5;
  --esm-ground-raised: #ffffff;
  --esm-ink: #14202a;
  --esm-ink-muted: #55616a;
  --esm-ocean: #1d5f86;
  --esm-on-ocean: #ffffff;
  --esm-flare: #b84a1b;
  --esm-hairline: #d9dccf;
  --esm-on-region: #14202a;
  --esm-region-beach: #fbe89a;
  --esm-region-tree: #9cbf3c;
  --esm-region-rec: #a6ead6;
  --esm-region-main: #e7c58e;
  --esm-region-richmond: #b9a1d0;
  --esm-region-smoky: #6ea877;
  --esm-region-refinery: #ad9a77;
  --esm-region-runway: #dde2ea;

  --esm-font-display: "Bricolage Grotesque", "Arial Black", system-ui, sans-serif;
  --esm-font-sans: "Public Sans", system-ui, sans-serif;
  --esm-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --esm-space-1: 4px;
  --esm-space-2: 8px;
  --esm-space-4: 16px;
  --esm-space-8: 32px;
  --esm-space-16: 64px;
  --esm-space-32: 128px;

  --esm-radius-sm: 2px;
  --esm-radius-md: 10px;
  --esm-radius-pill: 999px;

  --esm-ease: cubic-bezier(.2, .7, .2, 1);
  --esm-measure: 34rem;
  --esm-page: 1120px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="day"]) {
    --esm-ground: #10181d;
    --esm-ground-raised: #18242b;
    --esm-ink: #eef1ea;
    --esm-ink-muted: #a3b0b5;
    --esm-ocean: #7cc0e3;
    --esm-on-ocean: #0d1a22;
    --esm-flare: #f0875a;
    --esm-hairline: #2c3a42;
    --esm-region-beach: #d9c46a;
    --esm-region-tree: #86a832;
    --esm-region-rec: #7fcab5;
    --esm-region-main: #c9a76e;
    --esm-region-richmond: #9f86ba;
    --esm-region-smoky: #5f9468;
    --esm-region-refinery: #9a8866;
    --esm-region-runway: #9aa6b2;
  }
}
