/* Kindly Sent design tokens: the ONE place for colour, type and shape. Used by the site (site.css), the product
   (app pages) and the cards (static/cards/engine.css). The brand book: brand/BRAND.md. */
:root {
  /* paper and ink */
  --ks-cream: #FCF1DF;        /* card cream: the ground everything sits on */
  --ks-cream-2: #F6E3C5;      /* a darker sheet: panels, the inside of a card's floor */
  --ks-white: #FFFBF4;        /* the lightest sheet: the inside of a card, form fields */
  --ks-ink: #3A1B3F;          /* deep aubergine: all text */
  --ks-ink-2: #6B4A6E;        /* softer aubergine: secondary text */
  --ks-night: #2A1230;        /* the darkest tone: the footer */
  --ks-line: #E7D3B4;         /* hairlines on cream */
  /* the brand colour and the paper accents used in scenes */
  --ks-vermilion: #E4472B;
  --ks-vermilion-dark: #BF3219;
  --ks-button: #D13B20;       /* button fills that carry white text: 4.8:1 (white on the brand vermilion is 4.0:1) */
  --ks-marigold: #F5B83D;
  --ks-jade: #3FA796;
  --ks-blush: #F7B4A7;
  --ks-sky: #9CCDE6;
  /* type */
  --ks-display: 'Calistoga', 'Georgia', serif;
  --ks-text: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ks-hand-neat: 'Patrick Hand', 'Comic Sans MS', cursive;
  --ks-hand-joined: 'La Belle Aurore', 'Segoe Script', cursive;
  --ks-hand-felt: 'Gochi Hand', 'Comic Sans MS', cursive;
  /* shape: every sheet has one corner cut, like a card with a notch for the thumb */
  --ks-notch: 14px;
  --ks-cut: polygon(0 0, calc(100% - var(--ks-notch)) 0, 100% var(--ks-notch), 100% 100%, 0 100%);
  --ks-radius: 6px;
  /* paper shadows: soft, warm, never grey */
  --ks-shadow-1: 0 1px 0 rgba(58, 27, 63, .06), 0 6px 14px -6px rgba(58, 27, 63, .22);
  --ks-shadow-2: 0 2px 0 rgba(58, 27, 63, .05), 0 18px 34px -14px rgba(58, 27, 63, .34);
  --ks-grain: url("/static/img/grain.png");       /* for background-blend-mode: multiply on a flat colour */
  --ks-grain-a: url("/static/img/grain-a.png");   /* see-through specks: lay it over anything, no blend mode */
  /* motion: paper stands up with a small overshoot and settles */
  --ks-ease-stand: cubic-bezier(.2, 1.4, .4, 1);
  --ks-ease: cubic-bezier(.3, .7, .2, 1);
}