/* Generated from brand/tokens.json by brand/scripts/build.ts. Do not edit by hand. */
@font-face { font-family: "Bricolage Grotesque"; src: url("fonts/BricolageGrotesque-VF.woff2") format("woff2"); font-weight: 400 800; font-display: swap; }
@font-face { font-family: "Readex Pro"; src: url("fonts/ReadexPro-VF.woff2") format("woff2"); font-weight: 200 700; font-display: swap; }
:root {
  --tf-void: #0F1310;
  --tf-graphite: #262C27;
  --tf-bone: #F3F0E8;
  --tf-mutation: #C5F03C;
  --tf-deep: #4E6B12;
  --tf-fog: #9AA096;
  --tf-ash: #5C635B;
  --tf-line-dark: #F3F0E81F;
  --tf-line-light: #0F13101F;
  --tf-font-display: "Bricolage Grotesque", system-ui, sans-serif;
  --tf-font-text: "Readex Pro", system-ui, sans-serif;
  --tf-tracking-display: -0.03em;
  --tf-radius-control: 8px;
  --tf-radius-card: 16px;
  --tf-radius-icon: 22.5%;
  --tf-space: 8px;
  --tf-motion-slip: 240ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --tf-motion-state: 160ms ease-out;
}