/* tokens.css: design tokens only. Every value here is from CONTRACT.md section 7.
   Nothing but custom properties on :root lives in this file. */
:root {
  /* brand colors (SPEC Part 6). Two are darkened one step so every text pair clears WCAG AA 4.5:1,
     which the same SPEC requires: deep-rose (white button labels: #C25E75 gave 4.08:1, #B0546A gives 5.03:1)
     and deep-gold (small gold text on ivory: #9C7B33 gave 3.84:1, #7F6428 gives 5.42:1 and 4.58:1 on blush).
     --gold (hairlines, badges, shimmer core) is untouched. */
  --ivory: #FDFBF9;
  --blush: #F7E4E7;
  --rose: #E3A9B5;
  --deep-rose: #A8365A;        /* jewel rose: white labels 6.3:1, as text on ivory 6.1:1 */
  --deep-rose-dark: #8E1F42;   /* the darker stop of the button gradient */
  --plum: #3D172A;             /* premium dark ground: white 15.5:1, bright gold 9.4:1 */
  --plum-deep: #2E1220;
  --gold-bright: #E8C57A;      /* gold TEXT on plum only */
  --rose-light: #F3DCE4;       /* body text on plum */
  --gold: #C9A96A;
  --deep-gold: #7F6428;
  --charcoal: #2B2B2B;
  --white: #FFFFFF;

  /* supporting colors */
  --ink-2: #4A4A4A;
  --line: #EBDDE0;
  --focus: #7A3E4F;
  --error: #B3261E;
  --unfilled-bg: #FFF6C2;

  /* playful tints (owner request: more color). All pass 4.5:1 with charcoal and ink-2 text. */
  --peach: #FBD0B4;
  --butter: #FAE39C;
  --lavender: #DFCDF7;
  --mint: #BFE9D8;
  --coral: #C2472F;

  /* type */
  --font-display: "Fraunces", "Fraunces Fallback", Georgia, serif;
  --font-body: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-0: .8125rem;
  --fs-1: .9375rem;
  --fs-2: 1.0625rem;
  --fs-3: 1.25rem;
  --fs-4: 1.5rem;
  --fs-5: clamp(2.1rem, 6.5vw, 3rem);
  --lh-body: 1.6;
  --measure: 68ch;

  /* spacing: 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 px */
  --sp-1: .25rem;
  --sp-2: .5rem;
  --sp-3: .75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;

  /* shape and depth */
  --radius: 26px;
  --radius-sm: 16px;
  --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgba(61, 23, 42, .06), 0 8px 24px rgba(61, 23, 42, .10);
  --shadow-2: 0 18px 50px rgba(61, 23, 42, .26);
  --shadow-btn: 0 8px 22px rgba(168, 54, 90, .38), inset 0 1px 0 rgba(255, 255, 255, .28);
  --shadow-btn-active: 0 3px 10px rgba(168, 54, 90, .34), inset 0 1px 0 rgba(255, 255, 255, .2);

  /* motion easings (values only; animations.css uses them) */
  --spring-soft: cubic-bezier(.34, 1.56, .64, 1);
  --spring-firm: cubic-bezier(.16, 1, .3, 1);
  --spring-snap: cubic-bezier(.22, 1.2, .36, 1);

  /* fixed-element metrics */
  --nav-h: 56px;
  --tap: 48px;
  --field-h: 56px;
  --sticky-h: 64px;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --vvh: 100dvh;
}