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

	html {
		color-scheme: light dark;
		/* opens up the light-dark() method */
		-webkit-font-smoothing: antialiased;
		-webkit-text-size-adjust: none;
		text-size-adjust: none;
		hanging-punctuation: first allow-end last;
		interpolate-size: allow-keywords;
	}

	h1, h2, h3, h4, h5, h6 {
		text-wrap: balance;
	}

	h1, h2, h3 {
		font-weight: 900;
		letter-spacing: -.02rem;
		line-height: 1.1;
	}

	h4, h5, h6 {
		font-weight: 700;
	}

	p, li, dd {
		text-wrap-style: balance;
		text-wrap: pretty;
	}

	ul, ol, dl {
		/* list-style-position: inside; */

		ul, ol, dl {
			padding-inline-start: 1lh;
		}

		li {
			margin-inline-start: 1em;
		}
	}

	a {
		text-underline-offset: 2px;

		&:not(:hover), &:not(:focus) {
			text-decoration-color: hsl(from currentColor h s l / .5);
		}
	}

	sub, sup {
		font-size: 75%;
		line-height: 0;
		position: relative;
		vertical-align: baseline;
	}

	sub {
		inset-block-end: -0.25em;
	}

	sup {
		inset-block-start: -0.5em;
	}

	img {
		max-inline-size: 100%;
	}

	figure {
		inline-size: fit-content;
		margin-inline: auto;
	}

	figcaption {
		contain: inline-size;
		font-size: 90%;
	}

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

	svg {
		fill: currentColor;
	}

	[hidden] {
		display: none;
	}

	[disabled] {
		opacity: .5;
	}

	hr {
		border-style: solid;
		border-width: 1px 0 0;
		color: inherit;
		height: 0;
		overflow: visible;
		margin-block: 2.5rem;
	}

	:focus-visible {
		outline-offset: 2px;
	}
}
/* END layer:reset */