/* Reset: a small, modern normalisation (docs/DESIGN_SYSTEM.md section 11). */
@layer reset {
	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}

	* {
		margin: 0;
	}

	html {
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
		tab-size: 4;
	}

	body {
		min-height: 100vh;
		min-height: 100dvh;
		-webkit-font-smoothing: antialiased;

		/* Long words, addresses and file names break instead of pushing the page sideways (WCAG 1.4.10, reflow at
		   320 px). "anywhere", not "break-word": it also lowers the minimum width of a flex or grid item and of a
		   table cell, which break-word does not, so a long email in a footer column cannot stretch it past the screen. */
		overflow-wrap: anywhere;
	}

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

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

	button {
		cursor: pointer;
	}

	button:disabled {
		cursor: not-allowed;
	}

	ul[role="list"],
	ol[role="list"] {
		padding: 0;
		list-style: none;
	}

	table {
		border-collapse: collapse;
	}

	fieldset {
		min-width: 0;
		padding: 0;
		border: 0;
	}

	legend {
		padding: 0;
	}
}