/*
 * Brand primitives for tidesandweather.info — every page links this first:
 * the landing, privacy and accessibility pages, the 404, the /stations map,
 * the owner's dashboard, and (inlined, since it is published as an
 * Artifact) the locations-by-dataset page.
 *
 * Light by default; dark follows the system unless the page pins
 * data-theme="light", and data-theme="dark" forces it. A page adds its own
 * tokens (the map's pin colours, the dashboard's chart series) in its own
 * stylesheet, on top of these.
 *
 * --ink-faint is #5e6d73 in light, the app's value: 4.5:1 on --paper, the
 * WCAG AA minimum for body text. The old #7f939b was 3.0:1.
 */
:root {
  --paper: #f2f5f4;
  --surface: #ffffff;
  --surface-2: #eaf0ef;
  --ink: #14232b;
  --ink-soft: #4c6270;
  --ink-faint: #5e6d73;
  --line: #d7dedd;
  --accent: #0e7c86;
  --accent-deep: #0a5158;
  --accent-soft: #e4f1f0;
  --warn: #b6752b;

  --font-display: "Spectral", Georgia, "Times New Roman", serif;
  --font-body: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #0a1418;
    --surface: #142023;
    --surface-2: #192a2c;
    --ink: #e8efed;
    --ink-soft: #a7bab5;
    --ink-faint: #6f8681;
    --line: #253534;
    --accent: #5bc2c4;
    --accent-deep: #17494c;
    --accent-soft: #123032;
    --warn: #e0a458;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0a1418;
  --surface: #142023;
  --surface-2: #192a2c;
  --ink: #e8efed;
  --ink-soft: #a7bab5;
  --ink-faint: #6f8681;
  --line: #253534;
  --accent: #5bc2c4;
  --accent-deep: #17494c;
  --accent-soft: #123032;
  --warn: #e0a458;
}
:root[data-theme="light"] { color-scheme: light; }