/* Hallmark · tokens · Atelier-warm · soft-luxury editorial
 * paper-band: light · display-style: classical-serif · accent-hue: warm-amber
 */
:root {
  /* ── COLOR ── */
  --color-paper:          oklch(97%   0.012  78);   /* warm cream */
  --color-ink:            oklch(16%   0.015  75);   /* near-black, warm */
  --color-ink-muted:      oklch(46%   0.022  78);   /* warm mid-grey */
  --color-ink-faint:      oklch(68%   0.018  78);   /* light warm grey */
  --color-accent:         oklch(54%   0.13   55);   /* amber-gold */
  --color-accent-tint:    oklch(94%   0.045  80);   /* pale amber, for tags */
  --color-surface:        oklch(94%   0.018  80);   /* warm off-white card bg */
  --color-border:         oklch(88%   0.020  80);   /* warm divider */
  --color-rule:           oklch(80%   0.025  78);   /* slightly stronger rule */
  --color-shadow-sm:      oklch(0%    0      0  / 0.05);
  --color-shadow-md:      oklch(0%    0      0  / 0.04);

  /* SMS bubbles */
  --color-bubble-ezra:    oklch(90%   0.018  80);   /* warm light grey */
  --color-bubble-parent:  oklch(90%   0.05   145 / 0.5);  /* soft sage */
  --color-bubble-child:   oklch(90%   0.04   230 / 0.5);  /* soft slate-blue */

  /* ── TYPOGRAPHY ── */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* ── TEXT SCALE (major third, 4px base) ── */
  --text-xs:          0.75rem;    /*  12px */
  --text-sm:          0.875rem;   /*  14px */
  --text-base:        1rem;       /*  16px */
  --text-lg:          1.125rem;   /*  18px */
  --text-xl:          1.25rem;    /*  20px */
  --text-2xl:         1.5rem;     /*  24px */
  --text-3xl:         2rem;       /*  32px */
  --text-4xl:         2.75rem;    /*  44px */
  --text-display-s:   3.5rem;     /*  56px */
  --text-display:     4.5rem;     /*  72px */

  /* ── SPACING (4pt scale) ── */
  --space-xs:   0.25rem;   /*  4px */
  --space-sm:   0.5rem;    /*  8px */
  --space-md:   1rem;      /* 16px */
  --space-lg:   1.5rem;    /* 24px */
  --space-xl:   2rem;      /* 32px */
  --space-2xl:  3rem;      /* 48px */
  --space-3xl:  4rem;      /* 64px */
  --space-4xl:  6rem;      /* 96px */
  --space-5xl:  8rem;      /* 128px */

  /* ── MOTION ── */
  --dur-fast:   150ms;
  --dur-base:   250ms;
  --dur-slow:   420ms;
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:      cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);

  /* ── RADIUS ── */
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:   16px;
  --radius-pill: 100px;
}