@layer theme, reset, components, layout, application;

@layer reset {
	*,
	*::before,
	*::after {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
	}

	html, body {
		height: 100%;
		width: 100%;
		font-family: sans-serif;
		line-height: 1.5;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		overscroll-behavior: none;
	}

	@media (prefers-reduced-motion: no-preference) {
		html {
			scroll-behavior: smooth;
		}
	}

	hr {
		margin: 1.5rem auto;
	}

	img, picture, video, canvas, svg {
		display: block;
		max-width: 100%;
	}

	input, button, textarea, select {
		font: inherit;
	}

	button {
		cursor: pointer;
	}

	ul,
	ol {
		margin-left: 1.5em;
		padding-left: 0;
		list-style-position: inside;
	}
	ul ul,
	ol ul,
	ul ol,
	ol ol {
		margin-left: 1.25em;
	}
}