:root {
	--color-ink: #0b0d10;
	--color-ink-soft: #20252b;
	--color-paper: #f5f6f7;
	--color-white: #ffffff;
	--color-stone: #68717b;
	--color-stone-dark: #424a53;
	--color-line: #dce1e5;
	--color-line-dark: #aab2ba;
	--color-coral: #e94735;
	--color-coral-dark: #bd2f22;
	--color-cyan: #2878ff;
	--color-cyan-dark: #0a56cf;
	--color-signal: #d8ff3e;
	--font-sans: Aptos, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	--font-editorial: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
	--space-1: 0.375rem;
	--space-2: 0.625rem;
	--space-3: 0.875rem;
	--space-4: 1.25rem;
	--space-5: 1.75rem;
	--space-6: 2.5rem;
	--space-7: 3.75rem;
	--space-8: 5.5rem;
	--space-9: 8rem;
	--frame: 88rem;
	--frame-wide: 78rem;
	--reading: 46rem;
	--gutter: 1.25rem;
	--header-height: 4.25rem;
	--radius: 3px;
	--shadow-small: 0 14px 36px rgb(11 13 16 / 8%);
	--shadow-large: 0 28px 70px rgb(11 13 16 / 13%);
	--transition-fast: 180ms ease;
	--transition-medium: 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media (min-width: 48rem) {
	:root {
		--gutter: 2rem;
		--header-height: 5rem;
	}
}

@media (min-width: 90rem) {
	:root {
		--gutter: 3rem;
	}
}