/* Colour tokens for light and dark mode, plus sticker inks */

:root {
  --bg: #f8f8f7;
  --ink: #141414;
  --muted: #6e6e6e;
  --faint: #9a9a9a;
  --ghost: #c4c4c2;
  --line: #e3e3e1;
  --card: #ffffff;
  --hover: #ededeb;
  --pill: rgba(255, 255, 255, .92);
  --shadow: rgba(0, 0, 0, .08);
  --accent: #ff5a36;
  --hi-1: #e8461f; --hi-2: #1f74d6; --hi-3: #0c8f62; --hi-4: #cf2f86; --hi-5: #6f45d8;
  --dot: #bdbdb8; --grid: #e0e0dc;
  --glass-1: rgba(255, 255, 255, .72); --glass-2: rgba(255, 255, 255, .2); --glass-edge: rgba(255, 255, 255, .95);
  --glass-shine: rgba(255, 255, 255, .6); --glass-ink: rgba(20, 20, 20, .55); --glass-rim: rgba(0, 0, 0, .08);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0e0e0e;
    --ink: #ececec;
    --muted: #a3a3a3;
    --faint: #6f6f6f;
    --ghost: #474747;
    --line: #242424;
    --card: #1a1a1a;
    --hover: #1f1f1f;
    --pill: rgba(26, 26, 26, .9);
    --shadow: rgba(0, 0, 0, .45);
    --hi-1: #ff7a57; --hi-2: #6fb3ff; --hi-3: #4fd6a0; --hi-4: #ff8cc6; --hi-5: #b39bff;
    --dot: #444444; --grid: #1f1f1f;
    --glass-1: rgba(255, 255, 255, .16); --glass-2: rgba(255, 255, 255, .04); --glass-edge: rgba(255, 255, 255, .28); --glass-shine: rgba(255, 255, 255, .18); --glass-ink: rgba(255, 255, 255, .72); --glass-rim: rgba(255, 255, 255, .07);
  }
}
:root[data-theme="dark"] {
  --bg: #0e0e0e;
  --ink: #ececec;
  --muted: #a3a3a3;
  --faint: #6f6f6f;
  --ghost: #474747;
  --line: #242424;
  --card: #1a1a1a;
  --hover: #1f1f1f;
  --pill: rgba(26, 26, 26, .9);
  --shadow: rgba(0, 0, 0, .45);
  --hi-1: #ff7a57; --hi-2: #6fb3ff; --hi-3: #4fd6a0; --hi-4: #ff8cc6; --hi-5: #b39bff;
  --dot: #444444; --grid: #1f1f1f;
  --glass-1: rgba(255, 255, 255, .16); --glass-2: rgba(255, 255, 255, .04); --glass-edge: rgba(255, 255, 255, .28); --glass-shine: rgba(255, 255, 255, .18); --glass-ink: rgba(255, 255, 255, .72); --glass-rim: rgba(255, 255, 255, .07);
}

/* sticker inks are physical colours, identical in both themes */
:root {
  --s-orange: #ff5a36;
  --s-butter: #ffd166;
  --s-sky: #7cc4ff;
  --s-mint: #7ee0b5;
  --s-pink: #ff9ecb;
  --s-ink: #1b1b1f;
  --s-cream: #fff6e3;
  --s-white: #ffffff;
  --s-bun: #f2a541;
  --s-patty: #6b3a22;
  --s-steel: #c3ccd6;
  --s-steel2: #e4e9ef;
  --s-foam: #c48a5a;
  --s-shadow: rgba(20, 20, 30, .22);
}