/* Design tokens. Change a value here and every component follows. Nothing else in the app declares a raw colour, size or font. */
:root {
  /* Colour: neutrals with a slight cool bias, one brand hue, role hues for seller and buyer, semantic hues */
  /* Bone ground, carbon ink, white surfaces, one red. The same palette as the public site. */
  --bg: #EFECE4; --surface: #FFFFFF; --surface-2: #F7F5F0; --surface-3: #EFECE4;
  --ink: #0A0A0A; --ink-2: #413D35; --muted: #67635A; --line: #DCD7CB; --line-2: #E9E5DC;
  --brand: #0A0A0A; --brand-2: #FF2D16; --brand-soft: #F3F0E8; --on-brand: #FFFFFF; --link: #0A0A0A;
  --seller: #2457C5; --buyer: #B8620E; --other: #6D4FC2;
  --good: #1E8E5A; --good-soft: #E6F5EC; --warn: #B7791F; --warn-soft: #FBF1DF; --bad: #C43D3D; --bad-soft: #FBE9E9; --neutral-soft: #ECEFF3;
  --s-2: #F6DADA; --s-1: #FBEEDE; --s1: #E3F3E9; --s2: #C9EAD6;
  --chart-grid: #E4E7EC; --chart-axis: #9AA3B5; --chart-ink: #151A21; --chart-on-ink: #FFFFFF;
  --focus: #FF2D16;

  /* Type */
  --sans: 'IBM Plex Sans', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --serif: 'Newsreader', Georgia, serif;
  --fs-xs: 11px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 22px; --fs-2xl: 30px; --fs-3xl: 38px;
  --lh: 1.5; --lh-tight: 1.2;
  --track: .06em;

  /* Space, radius, elevation, motion */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;
  --r: 14px; --r-sm: 8px; --r-pill: 999px;
  --shadow: 0 2px 4px rgba(10,10,10,.04), 0 24px 48px -32px rgba(10,10,10,.35);
  --ease: .15s ease;

  /* Layout */
  --sidebar-w: 240px; --rail-w: 68px; --topbar-h: 56px; --content-max: 1240px; --content-max-wide: 1480px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0A0A0A; --surface: #161616; --surface-2: #1D1D1D; --surface-3: #242424;
    --ink: #EFECE4; --ink-2: #C9C4B8; --muted: #8C877B; --line: #2A2A2A; --line-2: #222222;
    --brand: #EFECE4; --brand-2: #FF2D16; --brand-soft: #242424; --on-brand: #0A0A0A; --link: #EFECE4;
    --seller: #7FA6F0; --buyer: #E7A15A; --other: #B49CF0;
    --good: #4CC08A; --good-soft: #14301F; --warn: #E1A64A; --warn-soft: #33260F; --bad: #E4706E; --bad-soft: #3A1717; --neutral-soft: #232B34;
    --s-2: #4A1F1F; --s-1: #3A2A16; --s1: #163422; --s2: #1D4A2E;
    --chart-grid: #273039; --chart-axis: #4A5665; --chart-ink: #E8EBF0; --chart-on-ink: #0E1216;
    --focus: #FF2D16;
    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.6);
  }
}