/* Auto-generated by floresya-design/sync_to_wp.py — 2026-05-01 18:47
 * Source of truth: ~/.openclaw/floresya-design/DESIGN.md
 * NO EDITAR MANUAL — se sobreescribe en cada sync.
 * Tokens count: colors=18 typography=9 spacing=8
 */
:root {
  /* ─── Colors (Stitch v2 Floral Modernism) ─── */
  --fy-primary: #b70068;
  --fy-primary-container: #df1e82;
  --fy-on-primary: #ffffff;
  --fy-secondary: #b21871;
  --fy-secondary-container: #fe5bae;
  --fy-tertiary: #675a62;
  --fy-tertiary-container: #81727b;
  --fy-surface: #fbf9f8;
  --fy-surface-container-lowest: #ffffff;
  --fy-surface-container-low: #f6f3f2;
  --fy-surface-container: #f0eded;
  --fy-surface-container-high: #eae8e7;
  --fy-surface-container-highest: #e4e2e1;
  --fy-on-surface: #1b1c1c;
  --fy-on-surface-variant: #594048;
  --fy-outline: #8d6f78;
  --fy-outline-variant: #e1bdc7;
  --fy-error: #ba1a1a;

  /* ─── Typography ─── */
  --fy-font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fy-display-lg: 48px;
  --fy-headline-lg: 32px;
  --fy-headline-md: 28px;
  --fy-headline-sm: 24px;
  --fy-body-lg: 18px;
  --fy-body-md: 16px;
  --fy-body-sm: 14px;
  --fy-label-lg: 14px;
  --fy-label-md: 12px;

  /* ─── Rounded ─── */
  --fy-radius-none: 0px;
  --fy-radius-sm: 4px;
  --fy-radius-md: 8px;
  --fy-radius-lg: 16px;
  --fy-radius-xl: 24px;
  --fy-radius-pill: 999px;

  /* ─── Spacing (8-unit) ─── */
  --fy-stack-xs: 4px;
  --fy-stack-sm: 8px;
  --fy-stack-md: 16px;
  --fy-stack-lg: 24px;
  --fy-stack-xl: 32px;
  --fy-stack-xxl: 48px;
  --fy-stack-gutter: 24px;
  --fy-stack-section-gap: 80px;

  /* ─── Elevation ─── */
  --fy-shadow-level-1: 0px 2px 4px rgba(0, 0, 0, 0.08);
  --fy-shadow-level-2: 0px 4px 8px rgba(0, 0, 0, 0.12);
  --fy-shadow-level-3: 0px 8px 16px rgba(0, 0, 0, 0.16);

  /* ─── Transitions ─── */
  --fy-transition-fast: 150ms ease-in-out;
  --fy-transition-normal: 250ms ease-in-out;
  --fy-transition-slow: 350ms ease-in-out;

  /* ─── Layout aliases ─── */
  --fy-gutter: var(--fy-stack-gutter);
  --fy-container-max: 1280px;
}

/* Apply font globally */
body {
  font-family: var(--fy-font-family);
  color: var(--fy-on-surface);
  background-color: var(--fy-surface);
}

/* Legacy aliases for v1 modules */
:root {
  --fy-rose: var(--fy-primary);
  --fy-rose-dark: var(--fy-secondary);
  --fy-cream: var(--fy-surface);
}