/* Saturn9 design tokens, draft 3. Generated by hand from tokens.json; keep them in sync.
   Light by default; Night follows prefers-color-scheme or [data-theme="night"]. */

:root {
  --s9-paper: #f6f6f3;
  --s9-desk: #ecebe6;
  --s9-ink: #161616;
  --s9-graphite: #55544f;
  --s9-pencil: #6b6a64;
  --s9-rule: #d6d5cf;
  --s9-blue: #2340e6;
  --s9-red: #c8231b;
  --s9-drop: #161616;

  --s9-cover-flow: #0055cc;
  --s9-cover-longhand: #0055cc;
  --s9-cover-press: #161616;
  --s9-cover-cam80: #f2b33d;

  --s9-serif: "Literata", Georgia, "Times New Roman", serif;
  --s9-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --s9-cover: "Big Shoulders Display", Impact, "Arial Narrow", sans-serif;

  --s9-space-1: 4px;
  --s9-space-2: 8px;
  --s9-space-3: 16px;
  --s9-space-4: 24px;
  --s9-space-5: 40px;
  --s9-space-6: 64px;
  --s9-space-7: 96px;

  --s9-cover-shadow: 5px 5px 0 var(--s9-drop);
  --s9-ease: cubic-bezier(0.2, 0, 0, 1);
  --s9-drawn: 240ms;
  --s9-slid: 180ms;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="day"]) {
    --s9-paper: #151514;
    --s9-desk: #1f1f1d;
    --s9-ink: #ebe9e4;
    --s9-graphite: #a9a7a0;
    --s9-pencil: #8a8881;
    --s9-rule: #33322f;
    --s9-blue: #8494ff;
    --s9-red: #ff6a5c;
    --s9-drop: #000000;
    color-scheme: dark;
  }
}

:root[data-theme="night"] {
  --s9-paper: #151514;
  --s9-desk: #1f1f1d;
  --s9-ink: #ebe9e4;
  --s9-graphite: #a9a7a0;
  --s9-pencil: #8a8881;
  --s9-rule: #33322f;
  --s9-blue: #8494ff;
  --s9-red: #ff6a5c;
  --s9-drop: #000000;
  color-scheme: dark;
}