/* Legibility layer (2026-10-22). Loaded LAST on every page (netlify/build/optimize.mjs), so it wins over
   the page-level styles. Brand faces stay; weight, size and contrast change.
   Measured on cream #F3ECDC: copper #B5532A 4.21:1 (fails 4.5), deep copper #994321 5.61:1,
   old slate #6B6153 5.16:1, new slate #574E42 6.93:1. */
:root{--slate:#574E42;--Hand:'Instrument Serif',Georgia,serif}
/* The handwriting face stays only where it is decoration: the "that's him!" sticker and Ron's signature. */
.bubble,.hand.sign{font-family:'Caveat',cursive}
.hand,.starthere{font-size:22px;letter-spacing:0}
/* Italic display words on light grounds: the deeper copper (dark sections keep gold via their own, stronger rules). */
h1 em,h2 em,h3 em,.ex{color:#994321;font-size:1.03em}
/* Mono eyebrows: deeper copper, a little less tracking so long ones wrap less. */
.eyebrow{color:#994321;letter-spacing:.13em}
.sec-blue .eyebrow,.sec-ink .eyebrow{color:#C7D0DC}
/* Phones: body copy at 16px, line-height 1.5. Small print (terms, status lines) keeps its size. */
@media(max-width:720px){
  body{font-size:16px;line-height:1.55}
  .lead{font-size:17px;line-height:1.5}
  section p:not(.fine):not(.terms):not(.st):not(.msg):not(.giftnote):not(.src){font-size:16px;line-height:1.5}
}