/* Ombre's direction. Every colour, font, radius and easing is a token; base.css and ombre.css only read them.
   Monochrome on purpose: ground, ink, one off-white for actions, one grey for the shadow (what holders get paid in). */
:root {
  color-scheme: dark;

  /* ground and surfaces, darkest to lightest */
  --bg: #0a0a0b;
  --bg-2: #0f0f10;
  --surface: #141415;
  --surface-2: #1b1b1d;
  --surface-3: #232325;

  /* hairlines, in the ink colour */
  --line: rgba(237, 235, 230, 0.08);
  --line-2: rgba(237, 235, 230, 0.14);
  --line-3: rgba(237, 235, 230, 0.24);

  /* text */
  --ink: #edebe6;
  --ink-2: #b5b3ad;
  --muted: #8a8883;

  /* the accent is off-white: the main action and the live state, nothing else is filled white */
  --accent: #edebe6;
  --on-accent: #0a0a0b;

  /* the shadow: one grey with one meaning, what a coin's holders get paid in */
  --shade: #3a3a3d;
  --shade-2: #2a2a2c;

  /* states stay monochrome (the brief): meaning comes from a mark (▲ ▼ !), never colour alone */
  --good: #edebe6;
  --bad: #edebe6;
  --warn: #b5b3ad;

  --font-display: "Inter Tight", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-text: "Inter Tight", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --display-weight: 500;
  --display-tracking: -0.04em;

  --r-sm: 6px;
  --r: 10px;
  --r-lg: 14px;
  --r-pill: 999px;
  --border: 1px solid var(--line);
  --shadow: 0 1px 0 rgba(237, 235, 230, 0.03) inset, 0 30px 60px -40px rgba(0, 0, 0, 0.95);

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 120ms;
  --t: 240ms;

  --wrap: 1240px;
  --gut: clamp(16px, 4vw, 40px);
  --top-h: 64px;
}