:root {
  --felt: #221D1A;
  --felt-deep: #17130F;
  --paper: #EADFC7;
  --paper-light: #F3EBDA;
  --paper-edge: #D6C8A9;
  --ink: #2A2320;
  --ink-soft: #5C5048;
  --verdigris: #2E6B5F;
  --verdigris-deep: #1F4D44;
  --thread: #D8A03A;
  --rift: #D9227F;
  --rift-ink: #A3175E;
  --thread-ink: #7A5410;

  --font-title: 'Fraunces', Georgia, serif;
  --font-body: 'Atkinson Hyperlegible Next', 'Atkinson Hyperlegible', system-ui, sans-serif;
  --font-stamp: 'Atkinson Hyperlegible Mono', ui-monospace, 'Courier New', monospace;
  --font-hand: 'Patrick Hand', 'Comic Sans MS', cursive;

  --gap: 16px;
  --radius: 3px;
  --shadow-paper: 0 1px 0 rgba(255, 255, 255, .25) inset, 0 6px 14px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .5);
  --linen: repeating-linear-gradient(0deg, rgba(255, 240, 210, .065) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .22) 0 1px, transparent 1px 4px);
  --linen-glow: radial-gradient(ellipse at 50% 35%, rgba(255, 236, 200, .08), transparent 60%),
    radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(0, 0, 0, .35) 100%);
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .25 0 0 0 0 .18 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}