:root {
  /* ---- paper & ink (rose-cream paper, per ui-ux-pro-max vibrant rose + blue) ---- */
  --color-paper:     oklch(97% 0.012 15);
  --color-paper-2:   oklch(94% 0.016 15);
  --color-paper-3:   oklch(91% 0.020 15);
  --color-ink:       oklch(20% 0.012 250);
  --color-ink-2:     oklch(38% 0.015 250);
  --color-muted:     oklch(52% 0.024 15);
  --color-neutral:   oklch(45% 0.022 15);
  --color-rule:      oklch(89% 0.020 15);
  --color-rule-2:    oklch(82% 0.024 15);

  /* ---- accents (ui-ux-pro-max: vibrant rose primary + engagement blue) ---- */
  --color-primary:      oklch(56% 0.23 12);    /* rose #E11D48 路 primary CTA */
  --color-on-primary:   oklch(97% 0.012 15);
  --color-secondary:    oklch(78% 0.13 12);    /* soft rose #FB7185 */
  --color-accent:       var(--color-primary);  /* alias: primary action */
  --color-accent-deep:  oklch(47% 0.21 12);
  --color-accent-2:     oklch(55% 0.20 258);   /* engagement blue #2563EB 路 links / focus */
  --color-accent-3:     oklch(70% 0.22 12);    /* bright rose 路 one big moment / pop */
  --color-pear:         oklch(86% 0.18 95);    /* pear 路 character mark only */
  --color-pear-deep:    oklch(74% 0.16 95);
  --color-mint:         oklch(80% 0.16 150);   /* success, occasional */
  --color-lavender:     oklch(74% 0.16 305);   /* occasional chip */
  --color-accent-ink:   var(--color-on-primary); /* text on rose fills */

  --color-background:   var(--color-paper);
  --color-foreground:   oklch(36% 0.11 12);    /* deep rose #881337 路 display headings */
  --color-border:       var(--color-rule);
  --color-destructive:  oklch(52% 0.21 25);
  --color-ring:         var(--color-accent-2);
  --color-focus:        var(--color-accent-2);
  --color-error:        var(--color-destructive);
  --color-success:      oklch(50% 0.13 150);

  /* ---- shadows & overlays (lifted so the artifact only references tokens) ---- */
  --shadow-cast-btn:      oklch(56% 0.23 12 / 0.32);
  --shadow-cast-ink:      oklch(20% 0.012 250 / 0.25);
  --shadow-cast-ink-soft: oklch(20% 0.012 250 / 0.12);
  --shadow-cast-ink-softer: oklch(20% 0.012 250 / 0.08);
  --shadow-cast-pear:     oklch(74% 0.16 95 / 0.8);
  --shadow-cast-card:     oklch(20% 0.012 250 / 0.18);
  --shadow-cast-card-hover: oklch(20% 0.012 250 / 0.28);
  --shadow-cast-modal:    oklch(20% 0.012 250 / 0.45);
  --overlay-dim:          oklch(20% 0.012 250 / 0.4);
  --overlay-dim-strong:   oklch(20% 0.012 250 / 0.5);
  --hl-rose:              oklch(70% 0.22 12 / 0.32);
  --color-on-rose:        oklch(97% 0.012 15);
  --color-rose-edge:      oklch(56% 0.22 12);
  --color-rose-cast:      oklch(70% 0.22 12 / 0.35);

  /* ---- fonts (ui-ux-pro-max: Fredoka display + Nunito body; mono for labels) ---- */
  --font-display: "Fredoka", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", ui-rounded, system-ui, sans-serif;
  --font-body:    "Nunito", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", ui-rounded, system-ui, sans-serif;
  --font-label:   "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  /* ---- 4pt spacing scale ---- */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  /* ---- type scale (major third 1.25) ---- */
  --text-xs:   0.64rem;
  --text-sm:   0.8rem;
  --text-base: 1rem;
  --text-md:   1.25rem;
  --text-lg:   1.5625rem;
  --text-xl:   1.9531rem;
  --text-2xl:  2.4414rem;
  --text-3xl:  3.0518rem;
  --text-4xl:  3.8147rem;
  --text-display:   clamp(2.75rem, 5vw + 1rem, 5.25rem);
  --text-display-s: clamp(2.25rem, 4vw + 1rem, 3.75rem);

  /* ---- radii (Hum: no square corners) ---- */
  --radius-card:  20px;
  --radius-pill:  999px;
  --radius-input: 12px;

  /* ---- easings ---- */
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-snap:     cubic-bezier(0.22, 1, 0.36, 1);
  --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);

  /* ---- durations ---- */
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;

  /* ---- rules ---- */
  --rule-hair: 1px;

  /* ---- z scale (named, six levels) ---- */
  --z-base:     1;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    400;
  --z-toast:    500;
  --z-tooltip:  600;

  /* ---- shell ---- */
  --shell: 82rem;
  --page-gutter: clamp(1rem, 4vw, 1.75rem);
  --section-gap: clamp(3.5rem, 8vw, 6rem);
  --scroll-offset: 7rem;
}