@layer utils {
	:root {
		/* Sine Variations - Gentle, natural movements */
		--cbuc-sine-in: cubic-bezier(0.47, 0, 0.745, 0.715);		/* Subtle entry */
		--cbuc-sine-out: cubic-bezier(0.39, 0.575, 0.565, 1);		/* Best for: subtle UI responses, placeholder text */
		--cbuc-sine-in-out: cubic-bezier(0.445, 0.05, 0.55, 0.95);	/* Gentle, balanced movement */

		/* Quad Variations - More pronounced, visible animations */
		--cbuc-quad-in: cubic-bezier(0.55, 0.085, 0.68, 0.53);			/* Medium strength entry */
		--cbuc-quad-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);			/* Best for: hover states, dropdown items */
		--cbuc-quad-in-out: cubic-bezier(0.455, 0.03, 0.515, 0.955);	/* Medium balanced movement */

		/* Cubic Variations - Strong, confident movements */
		--cbuc-cubic-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);	/* Strong entry */
		--cbuc-cubic-out: cubic-bezier(0.215, 0.61, 0.355, 1);		/* Best for: buttons, important UI elements */
		--cbuc-cubic-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);	/* Strong balanced movement */

		/* Smoothstep Functions - Professional, refined movements */
		--smoothstep: cubic-bezier(0.36, 0, 0.66, 1);	/* Best for: form inputs, focus states */
		--smootherstep: cubic-bezier(0.5, 0, 0.5, 1);	/* Best for: dignified dropdowns, modals */

		/* Special Effect Easings - Attention-grabbing animations */
		--ease-bounce-out: cubic-bezier(0.34, 1.56, 0.64, 1);		/* Best for: dropdown appear, notifications */
		--ease-bounce-in: cubic-bezier(0.6, -0.28, 0.735, 0.045);	/* Complementary to bounce-out */

		/* Common Duration Values */
		--duration-ultra-fast: 100ms;	/* Instant feedback: button clicks */
		--duration-fast: 150ms;			/* Quick feedback: hover effects */
		--duration-normal: 300ms;		/* Standard transitions: buttons, inputs */
		--duration-slow: 500ms;			/* Complex animations: modals, page transitions */
	}
}
