/* Prefstore design tokens. Ink and Paper. One coin. */
:root{
  /* House colours */
  --ps-ink:#14110F;        /* text, the p, dark grounds */
  --ps-paper:#F6F4EE;      /* page ground */
  --ps-card:#FFFFFF;       /* cards, receipts */
  --ps-stone:#ECE8DF;      /* quiet fills, skeletons */
  --ps-line:#E4E0D8;       /* hairlines */
  --ps-mute:#66625C;       /* secondary text (5.5:1 on paper) */

  /* The coin. Only where a Prefkey is involved. Never text on light. */
  --ps-gold:#FFB627;
  --ps-gold-rim:#F2A30F;   /* the coin's rim: 10% of its radius */
  --ps-gold-tint:#FFF3D6;  /* Prefkey notice ground */
  --ps-gold-ink:#7A4F00;   /* Prefkey figures on light grounds */

  /* States */
  --ps-ok:#1F7A4D;
  --ps-ok-tint:#E3F2EA;
  --ps-error:#B3261E;
  --ps-error-tint:#FBE9E7;

  /* Merchant colour. Set per shop; --ps-on-m is worked out by prefstore.js or ink_on() in PHP. */
  --ps-m:var(--ps-ink);
  --ps-on-m:#FFFFFF;

  /* Type. Swap the first family in each stack when the licensed fonts are installed. */
  --ps-font:"GT Walsheim Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ps-mono:"GT America Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --ps-accent:"PP Fragment Glare",Georgia,serif; /* one word per marketing headline */
  --ps-stretch:100%;

  --ps-display:clamp(42px,5.8vw,78px);
  --ps-h1:clamp(34px,4vw,52px);
  --ps-h2:30px;
  --ps-h3:21px;
  --ps-lead:19px;
  --ps-body:16px;
  --ps-small:14px;
  --ps-caption:12px;

  /* Shape and space */
  --ps-r-s:10px; --ps-r-m:16px; --ps-r-l:24px; --ps-r-pill:999px;
  --ps-s1:4px; --ps-s2:8px; --ps-s3:12px; --ps-s4:16px; --ps-s5:24px; --ps-s6:32px; --ps-s7:48px; --ps-s8:72px; --ps-s9:112px;
  --ps-shadow:0 1px 0 rgba(20,17,15,.04),0 12px 32px -16px rgba(20,17,15,.18);
  --ps-ease:cubic-bezier(.2,.8,.2,1);
}
