/* Onpaper — compiled from tokens.json */
:root, [data-theme="light"] {
  --paper: #fff9bc;
  --paper-sheet: #fffdf2;
  --paper-shade: #f4eca0;
  --ink: #1a1a1a;
  --ink-soft: #3f3d35;
  --pencil: #5f5b4d;
  --rule: #9dbfe3;
  --margin: #e0685c;
  --gain: #17613a;
  --loss: #b0241c;
  --gain-wash: #d9f0cf;
  --loss-wash: #fbd6cf;
  --pen-blue: #1f4fbf;
  --shadow-sheet: 3px 4px 0 #1a1a1a;
  --shadow-press: 1px 1px 0 #1a1a1a;
  --shadow-note: 2px 6px 0 rgba(26, 26, 26, 0.18);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-rule: 28px;
  --space-margin: 48px;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-pill: 999px;
  --font-display: "Caveat", "Itim", "Comic Sans MS", cursive;
  --font-hand: "Patrick Hand", "Itim", "Comic Sans MS", cursive;
}
.display { font-family: var(--font-display); font-size: 56px; line-height: 56px; font-weight: 700; }
.h1 { font-family: var(--font-display); font-size: 36px; line-height: 42px; font-weight: 700; }
.h2 { font-family: var(--font-display); font-size: 28px; line-height: 28px; font-weight: 700; }
.figure { font-family: var(--font-hand); font-size: 26px; line-height: 28px; font-weight: 400; }
.body { font-family: var(--font-hand); font-size: 18px; line-height: 28px; font-weight: 400; }
.small { font-family: var(--font-hand); font-size: 15px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-hand); font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: 0.08em; }