/* Design tokens: the only source of color and shape, shared by the display
   and the phone app (PRD §6.7). */

:root {
  --bg: #f2f2f7;
  --surface: #ffffff;
  --surface-2: #f9f9fb;
  --text: #2b2622;
  --muted: #6f665f;
  --line: #e5e5ea;
  --accent: #e8735a;
  --accent-rgb: 232, 115, 90; /* --accent as r, g, b, for tints (see --chip-alpha) */
  --accent-ink: #ffffff;
  --today-bg: #fff6ee;
  --shadow: 0 2px 10px rgba(60, 40, 20, 0.06);
  --radius: 18px;
  /* Event tints paint --c at this alpha over --chip-base, the same result as
     color-mix(), which the tablet's Chromium 106 doesn't support. */
  --chip-alpha: 0.2;
  --chip-base: #ffffff;
  --hi: #d9603f;
  --lo: #3f7fc4;
  color-scheme: light;
}

:root[data-theme='dark'] {
  --bg: #16171b;
  --surface: #202228;
  --surface-2: #1b1d22;
  --text: #ecebe8;
  --muted: #b3b1ac;
  --line: #2e3038;
  --accent: #f08a72;
  --accent-rgb: 240, 138, 114;
  --accent-ink: #1a1a1a;
  --today-bg: #2a2523;
  --shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  --chip-alpha: 0.32;
  --chip-base: #202228;
  --hi: #f39a7f;
  --lo: #7fb2ea;
  color-scheme: dark;
}