/* Go Upstream demo tokens. Layout and palette follow the dashboard mock in
   design/ExpleeTest/goupstream-dashboard.html: warm ivory, ink, burnt orange, one sans (Satoshi,
   self-hosted from Fontshare, free for commercial use). The site's root /tokens.css is a
   different system; don't mix them. Variable names kept from v1 so components carry over. */

@font-face { font-family: 'Satoshi'; src: url('fonts/satoshi-400.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Satoshi'; src: url('fonts/satoshi-500.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Satoshi'; src: url('fonts/satoshi-700.woff2') format('woff2'); font-weight: 700; font-display: swap; }

:root {
  /* Surfaces */
  --gu-bg: oklch(97.3% .008 85);       /* page */
  --gu-bg-2: oklch(95.6% .009 85);     /* rail */
  --gu-surface: oklch(99.4% .003 85);  /* cards, drawer */
  --gu-surface-2: oklch(96% .008 85);  /* quiet fills inside cards */

  /* Ink */
  --gu-ink: oklch(22% .012 70);
  --gu-body: oklch(42% .013 70);
  --gu-meta: oklch(46% .013 70);       /* labels; passes 4.5:1 on bg, rail and surface */
  --gu-lead: oklch(46% .013 70);
  --gu-rule: oklch(22% .012 70 / .11);
  --gu-rule-strong: oklch(22% .012 70 / .2);
  --gu-border: oklch(22% .012 70 / .14);

  /* Accent: burnt orange. accent for marks, deep for text and buttons. */
  --gu-accent: oklch(62% .17 45);
  --gu-deep: oklch(53% .16 43);
  --gu-deep-hover: oklch(46% .16 43);
  --gu-tint: oklch(95% .033 60);

  /* Type: one sans everywhere; numbers tabular. */
  --gu-font: 'Satoshi', 'Helvetica Neue', sans-serif;
  --gu-display: var(--gu-font);
  --gu-mono: var(--gu-font);

  /* Shape */
  --gu-radius-panel: 14px;
  --gu-radius-row: 10px;
  --gu-radius-pill: 999px;
  --gu-shadow: 0 1px 2px oklch(20% .012 70 / .05), 0 4px 16px oklch(20% .012 70 / .05);

  /* Motion */
  --gu-ease: cubic-bezier(.16, 1, .3, 1);
  --gu-fast: 160ms;
  --gu-med: 220ms;
}