/* GENERATED by tools/export_site_tokens.py — do not edit.
 *
 * The site's palette is the app's LIGHT theme, exported rather than retyped:
 * the same blue in two places, from one source (CLAUDE.md rule 15). The app is
 * dark, the site is light, and they are the same product.
 *
 * Regenerate:  python tools/export_site_tokens.py
 * Enforced by: tests/test_site_tokens_match_the_app.py
 *
 * Every name is prefixed --app-. The site runs shadcn, which uses --muted and
 * --accent for the OPPOSITE things the app uses them for (a background vs a
 * text colour; a tinted surface vs the accent itself). Importing unprefixed
 * did not merely look wrong — it broke silently in a way worth remembering:
 * `--text-muted: var(--muted)` written above `--muted: var(--surface-2)` in
 * the same block resolves to surface-2, because var() is looked up when it is
 * USED, not where it is written. The body copy came out near-white on white
 * and the stylesheet was valid. A prefix means the collision cannot happen.
 *
 * Each token is written twice: a hex/rgba fallback first for browsers with no
 * oklch() (Safari < 15.4), then the oklch value, which wins wherever it parses.
 */
:root {
  --app-bg: #F9FAFB;
  --app-bg: oklch(0.985 0.002 255);
  --app-bg-2: #F3F4F6;
  --app-bg-2: oklch(0.968 0.003 255);
  --app-surface: #FFFFFF;
  --app-surface: oklch(1 0 0);
  --app-surface-2: #F0F2F4;
  --app-surface-2: oklch(0.960 0.004 255);
  --app-surface-sunken: #EBEDF0;
  --app-surface-sunken: oklch(0.945 0.005 255);
  --app-border: rgba(29, 33, 38, 0.08);
  --app-border: oklch(0.245 0.012 255 / 8%);
  --app-border-strong: rgba(29, 33, 38, 0.14);
  --app-border-strong: oklch(0.245 0.012 255 / 14%);
  --app-text: #1D2126;
  --app-text: oklch(0.245 0.012 255);
  --app-muted: #555B64;
  --app-muted: oklch(0.470 0.016 255);
  --app-dim: #6B7178;
  --app-dim: oklch(0.545 0.014 255);
  --app-faint: #A0A5AB;
  --app-faint: oklch(0.720 0.010 255);
  --app-accent: #006DC9;
  --app-accent: oklch(0.530 0.170 250);
  --app-accent-strong: #0058AF;
  --app-accent-strong: oklch(0.460 0.165 250);
  --app-accent-weak: rgba(0, 109, 201, 0.1);
  --app-accent-weak: oklch(0.530 0.170 250 / 10%);
  --app-accent-fill: #006DC9;
  --app-accent-fill: oklch(0.530 0.170 250);
  --app-accent-hover: #0058AF;
  --app-accent-hover: oklch(0.460 0.165 250);
  --app-c-accent: #006DC9;
  --app-c-accent: oklch(0.530 0.170 250);
  --app-c-on-accent: #FFFFFF;
  --app-c-on-accent: oklch(1 0 0);
  --app-green: #197037;
  --app-green: oklch(0.480 0.120 150);
  --app-amber: #915C08;
  --app-amber: oklch(0.520 0.110 70);
  --app-red: #B32228;
  --app-red: oklch(0.500 0.180 25);
  --app-purple: #6F3BB2;
  --app-purple: oklch(0.480 0.180 300);
  --app-success-weak: rgba(25, 112, 55, 0.11);
  --app-success-weak: oklch(0.480 0.120 150 / 11%);
  --app-warning-weak: rgba(145, 92, 8, 0.11);
  --app-warning-weak: oklch(0.520 0.110 70 / 11%);
  --app-destructive-weak: rgba(179, 34, 40, 0.11);
  --app-destructive-weak: oklch(0.500 0.180 25 / 11%);
  --app-purple-weak: rgba(111, 59, 178, 0.11);
  --app-purple-weak: oklch(0.480 0.180 300 / 11%);

  /* The app's DARK theme, same names under --app-dark-. For a dark zone on the
     page (the hero around the dark product capture) — never a second palette. */
  --app-dark-bg: #0E1114;
  --app-dark-bg: oklch(0.175 0.008 255);
  --app-dark-bg-2: #121519;
  --app-dark-bg-2: oklch(0.195 0.009 255);
  --app-dark-surface: #161A1E;
  --app-dark-surface: oklch(0.215 0.010 255);
  --app-dark-surface-2: #1F2329;
  --app-dark-surface-2: oklch(0.255 0.012 255);
  --app-dark-surface-sunken: #0A0C10;
  --app-dark-surface-sunken: oklch(0.155 0.008 255);
  --app-dark-border: rgba(255, 255, 255, 0.08);
  --app-dark-border: oklch(1 0 0 / 8%);
  --app-dark-border-strong: rgba(255, 255, 255, 0.14);
  --app-dark-border-strong: oklch(1 0 0 / 14%);
  --app-dark-text: #F2F4F6;
  --app-dark-text: oklch(0.965 0.004 255);
  --app-dark-muted: #ACB2B9;
  --app-dark-muted: oklch(0.760 0.012 255);
  --app-dark-dim: #81878D;
  --app-dark-dim: oklch(0.620 0.012 255);
  --app-dark-faint: #5A5E63;
  --app-dark-faint: oklch(0.480 0.010 255);
  --app-dark-accent: #4ED5D5;
  --app-dark-accent: oklch(0.800 0.115 195);
  --app-dark-accent-strong: #00B6B6;
  --app-dark-accent-strong: oklch(0.700 0.125 195);
  --app-dark-accent-weak: rgba(78, 213, 213, 0.13);
  --app-dark-accent-weak: oklch(0.800 0.115 195 / 13%);
  --app-dark-accent-fill: #00B6B6;
  --app-dark-accent-fill: oklch(0.700 0.125 195);
  --app-dark-accent-hover: #4ED5D5;
  --app-dark-accent-hover: oklch(0.800 0.115 195);
  --app-dark-c-accent: #4ED5D5;
  --app-dark-c-accent: oklch(0.800 0.115 195);
  --app-dark-c-on-accent: #0E1114;
  --app-dark-c-on-accent: oklch(0.175 0.008 255);
  --app-dark-green: #6DD17F;
  --app-dark-green: oklch(0.780 0.150 148);
  --app-dark-amber: #F3B94C;
  --app-dark-amber: oklch(0.820 0.140 80);
  --app-dark-red: #F66D67;
  --app-dark-red: oklch(0.700 0.170 25);
  --app-dark-purple: #BF93F1;
  --app-dark-purple: oklch(0.740 0.140 305);
  --app-dark-success-weak: rgba(109, 209, 127, 0.13);
  --app-dark-success-weak: oklch(0.780 0.150 148 / 13%);
  --app-dark-warning-weak: rgba(243, 185, 76, 0.13);
  --app-dark-warning-weak: oklch(0.820 0.140 80 / 13%);
  --app-dark-destructive-weak: rgba(246, 109, 103, 0.13);
  --app-dark-destructive-weak: oklch(0.700 0.170 25 / 13%);
  --app-dark-purple-weak: rgba(191, 147, 241, 0.13);
  --app-dark-purple-weak: oklch(0.740 0.140 305 / 13%);
}