/**
 * Reset, document defaults, typography, and focus.
 */

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

* {
	scrollbar-width: thin;
	scrollbar-color: var(--color-text) var(--color-bg);
}

html,
body {
	margin: 0;
	padding: 0;
	min-height: 100dvh;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-ui);
	font-size: var(--font-size-ui);
	line-height: 1.25;
	font-variant-ligatures: none;
	font-synthesis: none;
	scrollbar-width: thin;
	scrollbar-color: var(--color-text) var(--color-bg);
}

body {
	overflow: auto;
}

::-webkit-scrollbar {
	width: 1ch;
	height: 1ch;
}

::-webkit-scrollbar-track {
	background: var(--color-bg);
}

::-webkit-scrollbar-thumb {
	background: var(--color-text);
}

::-webkit-scrollbar-thumb:hover {
	background: var(--color-text-intense);
}

h1,
h2,
h3,
p {
	margin: 0;
	font-size: inherit;
	font-weight: normal;
}

button {
	font: inherit;
	color: inherit;
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
}

:focus {
	outline: none;
}

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}