/* Gtube · tokens · palette "Cool white and crimson" · Bricolage Grotesque only */
:root {
  color-scheme: light;

  /* colour: one ground, one ink, one accent */
  --bg: #f4f6f8;
  --surface: #e8ecf0;
  --surface-2: #d9dfe5;
  --paper: #ffffff;          /* the tool panel */
  --ink: #0d1117;
  --muted: #4a5560;
  --accent: #c8323a;
  --accent-hover: #a5262d;
  --accent-ink: #ffffff;
  --ok: #17803d;
  --danger: #c0262d;
  --focus: #c8323a;
  --ui-line: #c9d1d9;        /* control borders inside the tool and form fields only */

  /* type: one family */
  --font: "Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --step-small: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);
  --step-body: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --step-lead: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
  --step-display: clamp(3.25rem, 1.6rem + 5.6vw, 6.5rem);

  /* space */
  --margin: clamp(16px, 2.4vw, 32px);
  --gap: clamp(16px, 2vw, 28px);

  --radius: 8px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur: 240ms;
  --dur-slow: 900ms;
}