/**
 * LoveMsgs Core - design tokens (Step 5).
 *
 * Palette and typography confirmed already live/in use site-wide (e.g.
 * #e9c894 gold and Cormorant Garamond are already used in the current
 * homepage build) - this file makes them reusable custom properties instead
 * of scattered hardcoded values, so the child theme and every native page
 * built in later steps draw from one source instead of re-guessing colors.
 *
 * Values per the Phase 2C/3 sprint spec:
 *   Deep Night      #120710
 *   Plum            #2A0F28
 *   Burgundy        #7C2D3A
 *   Soft Rose       #E2B9C8
 *   Gold            #E9C894
 *   Cream           #F3E6E0
 *   Editorial Cream #FBF6F0
 *   Soft Black      #2B2B2B
 *
 * Typography:
 *   Display/headings   Cormorant Garamond
 *   Body                Hanken Grotesk
 *   Small ritual labels Space Mono
 */

:root {
	/* Color tokens */
	--lm-color-deep-night: #120710;
	--lm-color-plum: #2a0f28;
	--lm-color-burgundy: #7c2d3a;
	--lm-color-soft-rose: #e2b9c8;
	--lm-color-gold: #e9c894;
	--lm-color-cream: #f3e6e0;
	--lm-color-editorial-cream: #fbf6f0;
	--lm-color-soft-black: #2b2b2b;

	/* Semantic aliases - templates should prefer these over raw colors */
	--lm-bg-primary: var(--lm-color-deep-night);
	--lm-bg-surface: var(--lm-color-plum);
	--lm-bg-editorial: var(--lm-color-editorial-cream);
	--lm-text-on-dark: var(--lm-color-cream);
	--lm-text-heading-on-dark: var(--lm-color-gold);
	--lm-text-on-light: var(--lm-color-soft-black);
	--lm-accent: var(--lm-color-gold);
	--lm-accent-soft: var(--lm-color-soft-rose);
	--lm-border-subtle: rgba(233, 200, 148, 0.18);

	/* Typography tokens */
	--lm-font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--lm-font-body: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--lm-font-mono: 'Space Mono', 'Courier New', monospace;

	/* Spacing scale */
	--lm-space-xs: 0.5rem;
	--lm-space-sm: 1rem;
	--lm-space-md: 1.5rem;
	--lm-space-lg: 2.5rem;
	--lm-space-xl: 4rem;

	/* Motion */
	--lm-ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
	--lm-duration-standard: 400ms;

	/* Focus ring - accessible against both dark and light surfaces */
	--lm-focus-ring: 0 0 0 3px rgba(233, 200, 148, 0.55);
}

/* Reduced-motion: honor the OS-level preference globally. Any animation
   added by this plugin or the child theme should respect this rather than
   defining its own bespoke media query, so the behavior is consistent site
   wide and always re-checked live (never cached from page load), matching
   the V3 changelog note ("prefers-reduced-motion read live at scroll time,
   not a one-time snapshot"). */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* Baseline focus-visible styling using the shared token, applied globally
   so every interactive element this plugin renders (and anything in the
   child theme that opts in) gets a consistent, visible focus state. */
.lm-wheel-wrapper :is(button, [tabindex], select, input, textarea, a):focus-visible {
	outline: none;
	box-shadow: var(--lm-focus-ring);
}
