/* Design tokens from the Viewerly web handoff.
   Dark is the default; light follows the viewer's system setting. Every colour below is defined
   in :root first so that nothing depends on a media query having matched. */
:root {
  --bg0: #141417;
  --bg1: #1b1b1f;
  --bg2: #212126;
  --line: rgba(255, 255, 255, .08);
  --line2: rgba(255, 255, 255, .14);
  --fg: #e9e9ee;
  --fg2: rgba(233, 233, 238, .62);
  --fg3: rgba(233, 233, 238, .40);
  /* acc is for text, links and chips. accSolid is the only fill that may sit under white text:
     the lighter acc does not clear 4.5:1 against it. */
  --acc: oklch(.72 .15 300);
  --acc-solid: oklch(.52 .18 300);
  --acc-bg: oklch(.72 .15 300 / .18);
  --sel: rgba(255, 255, 255, .07);
  --btn: rgba(255, 255, 255, .08);
  --field: rgba(255, 255, 255, .06);
  --s-work: oklch(.72 .15 300);
  --s-perm: oklch(.76 .16 60);
  --s-input: oklch(.84 .15 92);
  --s-done: oklch(.74 .15 150);
  --s-err: oklch(.66 .2 25);

  --font-display: "Inter Tight", -apple-system, BlinkMacSystemFont, "SF Pro Display", Helvetica, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  color-scheme: dark;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg0: #f7f7f9;
    --bg1: #ffffff;
    --bg2: #efeff2;
    --line: rgba(0, 0, 0, .09);
    --line2: rgba(0, 0, 0, .16);
    --fg: #1c1c21;
    --fg2: rgba(28, 28, 33, .62);
    --fg3: rgba(28, 28, 33, .42);
    --acc: oklch(.55 .18 300);
    --acc-solid: oklch(.5 .19 300);
    --acc-bg: oklch(.55 .18 300 / .13);
    --sel: rgba(0, 0, 0, .06);
    --btn: rgba(0, 0, 0, .06);
    --field: rgba(0, 0, 0, .04);
    --s-perm: oklch(.68 .17 55);
    --s-input: oklch(.75 .15 85);
    --s-done: oklch(.6 .15 150);
    --s-err: oklch(.58 .2 25);

    color-scheme: light;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
}