/* Precious — design tokens. SINGLE SOURCE OF TRUTH. Linked first on every page.
   Nothing else should define these values. Change a brand colour here, it changes everywhere. */
@font-face{font-family:Matter;src:url(matter-regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Matter;src:url(matter-medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Matter;src:url(matter-semibold.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  /* colour */
  --bg:#F8F0E3; --tan:#EDE4D8; --tan-deep:#E4D9C9;
  --ink:#180102; --ink-dim:rgba(24,1,2,.55); --ink-faint:rgba(24,1,2,.38);
  --accent:#F16B46; --accent-deep:#e05a36; --teal:#63A4BC; --dark:#0d0203;
  --line:rgba(24,1,2,.10); --line-soft:rgba(24,1,2,.06);
  /* type · motion · radius */
  --font:Matter,Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --r-panel:64px; --r-card:40px;
}

/* cross-document View Transitions — smooth page-to-page morphs (Chrome/Edge/Safari; Firefox falls back to a normal load) */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.5s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}