/* Jaybulb design tokens.
   Imported live from the canonical source so this app tracks the system
   instead of drifting behind a hand-copied snapshot (which is what happened
   between 2026-06-28 and 2026-08-28).

   Everything below is an ALIAS LAYER only: names this app consumes that the
   canonical file does not define, each falling back to a sane value so a
   blocked or failed import degrades instead of unstyling the page.
   Do not re-declare a colour the canonical file owns -- that shadows the
   design system and is the bug this file was rewritten to remove. */

@import url("https://jaybulb.com/tokens.css");

:root {
  /* legacy palette names still referenced by privacy.html and older markup */
  --blue: #5B9BD5;
  --blue-light: #BFDDF5;
  --navy: #252a49;

  /* canonical defines --font-body, never --font; without this alias every
     var(--font) silently falls back to the browser default, i.e. serif */
  --font: var(--font-body, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif);

  /* the -secondary/-tertiary vocabulary used by the landing and login pages */
  --text-secondary: var(--color-secondary, rgba(0,0,0,0.50));
  --text-tertiary: var(--text3, rgba(0,0,0,0.30));

  /* semantic, not part of the canonical palette */
  --error: #d94f3d;

  /* Talli's brand accent is blue and has been since v3.5.3 -- the icon, the app
     UI and the App Store assets are all #5B9BD5. The canonical system's accent
     is the Jaybulb yellow, which shipped a yellow landing page sitting under a
     blue logo. This is a deliberate per-app override of a canonical colour (the
     same escape hatch charwork uses for its terracotta), NOT accidental drift.
     --bulb-deep is the accent-as-text variant; blue needs a darker one on white
     than it does on black, so it is set per theme below. */
  --accent: #5B9BD5;
  --bulb-deep: #2C6BA8;
  /* solid-fill variant: white on this is 5.9:1, and it is deliberately the same
     in light and dark so a filled button never needs a per-theme text colour */
  --accent-strong: #2C6BA8;
}

[data-theme="dark"] {
  --error: #f87171;
  --bulb-deep: #7FB6E3;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --error: #f87171; --bulb-deep: #7FB6E3; }
}