/* ==========================================================================
   tokens.css — single source of truth for design tokens
   Ported from the Pétale design prototype. Colour, type, spacing, radius, z.
   AA contrast cleanups (build brief P1.2) are applied here:
     • --rose-ink darkened #9C4F57 → #8E444C so it clears 4.5:1 on the
       Pistache / Glaçage / Rosé pastel grounds as well as Sugar / Crème.
     • De-emphasised mono labels use --o-label (.72) instead of .62.
     • Inactive scroll-spy uses --o-spy (.58) instead of .45.
   ========================================================================== */
:root{
  /* ---- brand palette ---- */
  --sugar:#FBF7F0;     /* page ground */
  --cacao:#2B2230;     /* ink */
  --rose:#F4C6C6;      /* pastel field */
  --pistache:#CBE3BE;  /* pastel field */
  --creme:#F7E7A1;     /* pastel field */
  --glacage:#CDD0EC;   /* pastel field */

  /* ---- interaction accent (single accessible accent) ---- */
  --rose-ink:#8B434A;          /* darkened to clear AA 4.5:1 on EVERY pastel ground */
  --rose-ink-rgb:139,67,74;    /* keep in sync with --rose-ink for rgba() */

  /* ---- lines + de-emphasis opacities ---- */
  --line:rgba(43,34,48,.16);
  --o-label:.72;   /* de-emphasised mono labels (was .62) — clears 4.5:1 on sugar */
  --o-spy:.66;     /* inactive scroll-spy link (was .45) — clears 4.5:1 on sugar */

  /* ---- type families ---- */
  --display:'Fraunces',Georgia,serif;
  --body:'Instrument Sans',system-ui,sans-serif;
  --mono:'Geist Mono',ui-monospace,monospace;

  /* ---- spacing / layout ---- */
  --pad:clamp(20px,5vw,80px);
  --maxw:1320px;
  --nav-h:clamp(56px,7vw,76px);

  /* ---- radii ---- */
  --r-sm:3px;
  --r:4px;
  --r-md:5px;
  --r-lg:8px;

  /* ---- z-index scale ---- */
  --z-spy:70;
  --z-nav:80;
  --z-drawer-back:90;
  --z-drawer:95;
  --z-wipe:120;
  --z-cookie:130;
  --z-overlay-back:140;
  --z-panel:150;
  --z-lightbox:160;
  --z-toast:170;
  --z-cursor:200;
  --z-skip:300;
}
