/* Pocket: a tool catalogue printed on cream paper. One red (the knife's handle) = the action and the open tool.
   Steel is a material for the tools, never a second accent. See DESIGN.md. */
:root {
  color-scheme: light;

  --bg: #f3ede0;        /* cream paper */
  --bg-2: #ebe3d2;      /* a darker fold of the same paper */
  --surface: #faf6ec;   /* a card: fresh paper */
  --surface-2: #e4dbc7;

  --line: rgba(26, 22, 19, 0.14);
  --line-2: rgba(26, 22, 19, 0.34);

  --ink: #1a1613;
  --ink-2: #473f37;
  --muted: #695f54;

  --accent: #d8261c;    /* knife red */
  --accent-2: #b81d14;  /* pressed */
  --on-accent: #fff7ea;

  --steel: #d6d9d6;
  --steel-2: #9aa09d;
  --glass: #eef3ef;

  --good: #1c7448;
  --bad: #a8201a;
  --warn: #855600;

  --font-display: "Archivo", "Arial Black", ui-sans-serif, system-ui, sans-serif;
  --font-text: "Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --display-weight: 800;
  --display-tracking: -0.035em;

  --r-sm: 4px;
  --r: 6px;
  --r-lg: 8px;
  --r-pill: 999px;
  --border: 1px solid var(--line-2);
  --shadow: none;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 140ms;
  --t: 280ms;

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