/* DESIGN.md section 1. Every value here comes from there; change it there first. */
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/public-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/public-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/public-sans-latin-600-normal.woff2") format("woff2"); }

:root {
  color-scheme: dark;
  --ground: #121214;                 /* page                          */
  --raised: #1b1b1f;                 /* the question flow, menus      */
  --ink: #ededf0;   --ink-2: #b4b4bb;   --ink-3: #8c8c94;
  --accent: #7aa5ff;                 /* actions, and what needs you   */
  --warn: #f2995e;                   /* a gap, a missing document     */
  --hair: rgba(255,255,255,.14);  --press: rgba(255,255,255,.06);  --ph: #26262b;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px;
  --t-small: 15px; --t-body: 18px; --t-title: 24px; --t-input: 30px;
  --line: 52px;  --gutter: var(--s4);  --measure: 640px;  --wide: 1180px;
  --d-fast: 180ms; --d: 280ms; --d-slow: 380ms; --ease: cubic-bezier(.2,.7,.2,1);
  --font: "Public Sans", "Helvetica Neue", Arial, sans-serif;
}
@media (min-width: 1024px) { :root { --gutter: var(--s6); } }