:root {
	--container-reading: 720px;
	--container-content: 960px;
	--container-wide: 1280px;
	--container-full: 100%;

	--page-gutter-mobile: 20px;
	--page-gutter-tablet: 32px;
	--page-gutter-desktop: 48px;

	--space-8: 0.5rem;
	--space-12: 0.75rem;
	--space-16: 1rem;
	--space-24: 1.5rem;
	--space-32: 2rem;

	--section-space-sm: 48px;
	--section-space-md: 64px;
	--section-space-lg: 96px;
	--section-space-xl: 128px;

	--color-background: #fbf7f0;
	--color-surface: #fffdfc;
	--color-surface-alt: #f4eee7;
	--color-brand-primary: #889a4e;
	--color-brand-secondary: #b28b7d;
	--color-text-primary: #3b332c;
	--color-text-secondary: #72685f;
	--color-text-inverse: #fff8f2;
	--color-border: #e5dcd2;
	--color-border-strong: #cdbeaf;
	--color-success: #73866f;
	--color-warning: #b3935f;
	--color-error: #a56d67;
	--color-accent-soft: #e8d8cb;

	--icon-size-sm: 16px;
	--icon-size-md: 20px;
	--icon-size-lg: 24px;

	--radius-md: 8px;
	--radius-sm: 4px;

	--control-height-sm: 36px;
	--control-height-md: 44px;
	--control-height-lg: 52px;

	--motion-duration-base: 250ms;
	--motion-ease-soft: cubic-bezier(0.22, 1, 0.36, 1);

	--focus-ring-width: 2px;
	--focus-ring-offset: 2px;
	--focus-ring-color: var(--color-brand-primary);
	--focus-ring-shadow: 0 0 0 4px rgba(122, 135, 114, 0.18);
}