/* The palette. Every color ijosh.com paints is defined here; consumers
   import these tokens and keep no copy of their own. Generated by src/tokens.mjs, so run
   `task build` rather than editing this file. The mark's two tones come from
   src/marks.mjs and cannot drift from the artwork it draws. */
:root {
  color-scheme: light;
  --bg: #ffffff;
  --text: #333333;
  --icon: #000000;
  --text-muted: #6b7280;
  --text-body: #4b5563;
  --accent: #ca486d;
  --pill-bg: rgba(51, 51, 51, 0.1);
  --btn-bg: #1c1c1c;
  --btn-fg: #ffffff;
  /* the mark on a light surface */
  --mark: #17191c;
  --mark-muted: #666666;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #17191c;
    --text: #f4f7fb;
    --icon: #f4f7fb;
    --text-muted: #9aa7b4;
    --text-body: #c6d0da;
    --accent: #e98aa3;
    --pill-bg: rgba(255, 255, 255, 0.1);
    --btn-bg: #f4f7fb;
    --btn-fg: #14171c;
    /* the mark on a dark surface */
    --mark: #f4f7fb;
    --mark-muted: #9c9ea2;
  }
}
