:root {
  /* Color tokens */
  --c-ink:        #0A0A0A;
  --c-ink-soft:   #2A2A2A;
  --c-muted:      #6B6B6B;
  --c-line:       #E5E3DE;
  --c-line-soft:  #EFEDE8;
  --c-bg:         #FFFFFF;
  --c-bg-cream:   #F5F4F1;
  --c-bg-warm:    #FAF8F5;

  --c-accent:      #EC4899;    /* pink — soft premium accent */
  --c-accent-dk:   #DB2777;
  --c-accent-soft: #FCE7F3;    /* very light pink tint */
  --c-success:    #2F7D32;
  --c-danger:     #C0392B;     /* savings highlight */
  --c-promo:      #E63946;     /* urgency only */

  /* Typography */
  --ff-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ff-display: 'Inter', var(--ff-sans);
  --ff-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold: 600;
  --fw-bold:    700;

  --fs-xs:   12px;
  --fs-sm:   13px;
  --fs-base: 15px;
  --fs-md:   17px;
  --fs-lg:   20px;
  --fs-xl:   26px;
  --fs-2xl:  34px;
  --fs-3xl:  44px;
  --fs-4xl:  56px;

  --lh-tight: 1.15;
  --lh-snug:  1.3;
  --lh-base:  1.55;

  --ls-tight: -0.02em;
  --ls-wide:  0.08em;
  --ls-extra: 0.18em;

  /* Spacing scale */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;
  --sp-32: 128px;

  /* Layout */
  --container-max: 1440px;
  --container-pad: clamp(20px, 4vw, 56px);
  --header-h: 72px;
  --bar-h:    36px;

  /* Effects */
  --radius-sm: 4px;
  --radius:    8px;
  --radius-lg: 14px;

  --shadow-sm: 0 1px 2px rgba(10,10,10,0.04), 0 1px 3px rgba(10,10,10,0.06);
  --shadow:    0 4px 16px rgba(10,10,10,0.06), 0 1px 3px rgba(10,10,10,0.04);
  --shadow-lg: 0 12px 40px rgba(10,10,10,0.10), 0 2px 8px rgba(10,10,10,0.06);

  --t-fast: 120ms cubic-bezier(.4,0,.2,1);
  --t:      200ms cubic-bezier(.4,0,.2,1);
  --t-slow: 360ms cubic-bezier(.4,0,.2,1);

  --z-base: 1;
  --z-sticky: 50;
  --z-header: 100;
  --z-drawer: 200;
  --z-modal: 300;
}
