:root,
.editor-styles-wrapper {
	--rd-color-canvas: #f7f8fa;
	--rd-color-surface: #fff;
	--rd-color-text: #17253d;
	--rd-color-muted: #526078;
	--rd-color-primary: #234ac7;
	--rd-color-primary-hover: #1b3899;
	--rd-color-on-primary: #fff;
	--rd-color-accent: #08766c;
	--rd-color-accent-surface: #e4f5ef;
	--rd-color-border: #78869b;
	--rd-color-divider: #dfe5ed;
	--rd-color-error: #b42332;
	--rd-color-success: #166c46;
	--rd-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--rd-font-mono: ui-monospace, "Cascadia Code", Consolas, monospace;
	--rd-space-1: 0.25rem;
	--rd-space-2: 0.5rem;
	--rd-space-3: 0.75rem;
	--rd-space-4: 1rem;
	--rd-space-6: 1.5rem;
	--rd-space-8: 2rem;
	--rd-space-12: 3rem;
	--rd-space-16: 4rem;
	--rd-space-24: 6rem;
	--rd-radius-sm: 0.25rem;
	--rd-radius-md: 0.5rem;
	--rd-radius-lg: 0.75rem;
	--rd-container: 72rem;
	--rd-reading: 66ch;
	--rd-gutter: 1rem;
	--rd-duration: 140ms;
	color-scheme: light;
}

/* CSS alone follows the operating system, including when scripts are unavailable. */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--rd-color-canvas: #101722;
		--rd-color-surface: #172231;
		--rd-color-text: #f2f5fa;
		--rd-color-muted: #abb9cc;
		--rd-color-primary: #a7bbff;
		--rd-color-primary-hover: #c3d0ff;
		--rd-color-on-primary: #101722;
		--rd-color-accent: #6cdbc2;
		--rd-color-accent-surface: #193930;
		--rd-color-border: #71839b;
		--rd-color-divider: #314154;
		--rd-color-error: #ffadb5;
		--rd-color-success: #86deaf;
		color-scheme: dark;
	}
}

:root[data-theme="dark"] {
	--rd-color-canvas: #101722;
	--rd-color-surface: #172231;
	--rd-color-text: #f2f5fa;
	--rd-color-muted: #abb9cc;
	--rd-color-primary: #a7bbff;
	--rd-color-primary-hover: #c3d0ff;
	--rd-color-on-primary: #101722;
	--rd-color-accent: #6cdbc2;
	--rd-color-accent-surface: #193930;
	--rd-color-border: #71839b;
	--rd-color-divider: #314154;
	--rd-color-error: #ffadb5;
	--rd-color-success: #86deaf;
	color-scheme: dark;
}

@media (min-width: 40rem) {
	:root { --rd-gutter: 1.5rem; }
}

@media (min-width: 64rem) {
	:root { --rd-gutter: 2rem; }
}