/* Imagine, Build. — generated from tokens.json */

:root, [data-theme="board"] {
  --ib-night: #1b1d1e;
  --ib-graphite: #252a2c;
  --ib-slate-hi: #343a3d;
  --ib-paper: #f2ede3;
  --ib-cream: #eae2ce;
  --ib-vermeil: #c8384a;
  --ib-vermeil-ink: #b93140;
  --ib-red: #a3232e;
  --ib-gold: #c9a227;
  --ib-deep: #2a4a58;
  --ib-lichen: #4a6040;
  --ib-tangerine: #e2703a;
  --ib-iris: #5b4b8a;
  --ib-surf: #2e9b8f;
  --ib-sky: #6590a0;
  --ib-mist: #a8c4cc;
  --ib-flare: #ff5a4e;
  --ib-beam: #ffd23f;
  --ib-signal: #4fc3e8;
  --ib-sprout: #7ed957;
  --ib-grid-minor: rgba(255,255,255,.030);
  --ib-grid-major: rgba(255,255,255,.055);
  --ib-shadow-stuck: 0 0.96px 1.92px rgba(0,0,0,.30), 0 4.08px 10.08px rgba(0,0,0,.28);
  --ib-shadow-lift: 0 6px 12px rgba(0,0,0,.32), 0 19.92px 40.08px rgba(0,0,0,.42);
}

:root {
  --ib-U: 120px;
  --ib-u: 24px;
  --ib-radius: 13.92px;
  --ib-radius-s: 6px;
  --ib-lh-tight: 1.06;
  --ib-lh-snug: 1.25;
  --ib-lh-body: 1.5;
  --ib-track-caps: .16em;
  --ib-track-display: -.02em;
  --ib-ink-full: 1;
  --ib-ink-body: .80;
  --ib-ink-meta: .62;
  --ib-ink-faint: .50;
  --ib-scrim: .70;
  --ib-safe-t: 5%;
  --ib-safe-r: 5%;
  --ib-safe-b: 12%;
  --ib-safe-l: 5%;
  --font-mono: 'Overpass Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-hand: 'Caveat', 'Marker Felt', 'Bradley Hand', cursive;
}

.ib-t7 { font-family: var(--font-mono); font-size: 118.8px; line-height: 1.06; letter-spacing: -.02em; }
.ib-t6 { font-family: var(--font-mono); font-size: 88.56px; line-height: 1.06; letter-spacing: -.02em; }
.ib-t5 { font-family: var(--font-mono); font-size: 64.8px; line-height: 1.06; letter-spacing: -.02em; }
.ib-t4 { font-family: var(--font-mono); font-size: 47.52px; line-height: 1.25; }
.ib-t3 { font-family: var(--font-mono); font-size: 36.72px; line-height: 1.5; }
.ib-t2 { font-family: var(--font-mono); font-size: 30.24px; line-height: 1.5; letter-spacing: .16em; }
.ib-t1 { font-family: var(--font-mono); font-size: 23.76px; line-height: 1.5; letter-spacing: .16em; }
.ib-hand { font-family: var(--font-hand); font-size: 47.52px; line-height: 1.1; }

@font-face {
  font-family: 'Overpass Mono';
  src: url('./fonts/OverpassMono-VariableFont_wght.ttf') format('truetype');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Caveat';
  src: url('./fonts/Caveat-VariableFont_wght.ttf') format('truetype');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}