/* Explicit cascade-layer order (docs/architecture.md §6). Declaring it
 * here — the first stylesheet enqueued — guarantees the intended
 * priority order regardless of future enqueue changes, rather than
 * relying implicitly on each layer's first-declaration order. */
@layer reset, tokens, base, layout, components, utilities;

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

	body,
	h1,
	h2,
	h3,
	h4,
	p,
	figure,
	blockquote,
	dl,
	dd {
		margin: 0;
	}

	html:focus-within {
		scroll-behavior: smooth;
	}

	body {
		min-block-size: 100vh;
		text-rendering: optimizeSpeed;
	}

	img,
	picture,
	svg,
	video {
		max-inline-size: 100%;
		display: block;
	}

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

	@media (prefers-reduced-motion: reduce) {
		html:focus-within {
			scroll-behavior: auto;
		}

		*,
		*::before,
		*::after {
			animation-duration: 0.01ms !important;
			animation-iteration-count: 1 !important;
			transition-duration: 0.01ms !important;
			scroll-behavior: auto !important;
		}
	}
}