:where(:root) {
	color-scheme: light;

	--palette-hue: 270;
	--palette-hue-rotate-by: -5;
	--palette-chroma: 0.1;

	--link: oklch(50% 100% var(--palette-hue));
	--link-visited: oklch(50% 100% calc(var(--palette-hue) * 1.2));

	--surface-1: white;
	--surface-2: var(--color-1);
	--surface-3: var(--color-3);
	--surface-document: var(--color-4);
	--well-1: var(--color-5);
	--well-2: var(--color-6);
	--text-1: var(--color-16);
	--text-2: var(--color-12);

	--scrollthumb-color: var(--text-2);

	& :where(dialog) {
		background-color: var(--surface-1);
	}

	& :where(button, .btn) {
		--_highlight: var(--_highlight-light);
		--_bg: var(--_bg-light);
		--_ink-shadow: var(--_ink-shadow-light);

		& :where([type='reset']) {
			--_text: var(--red-6, #fa5252);
			--_border: var(--red-3, #ffa8a8);
		}
	}

	&
		:where(
			button,
			.btn,
			input:is([type='button'], [type='submit'], [type='reset'])
		)[disabled] {
		box-shadow: none;
	}

	&
		:where(
			textarea,
			select,
			input:not([type='button'], [type='submit'], [type='reset'])
		) {
		background-color: var(--surface-2);
	}
}
