:root {
	--border: rgb(230, 228, 226);
	--code: rgb(246 244 242);
	--link: rgb(74 125 221);
	--link-hover: rgb(73 100 149);
}

body {
	max-width: 60rem;
	margin-left: auto;
	margin-right: auto;
	padding: 3rem 1rem 8rem;
	line-height: 1.4;
	font-size: 1rem;
	font-weight: 400;
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
	text-rendering: optimizeLegibility;
}

h1,
h2,
h3 {
	font-weight: 500;
	letter-spacing: -.025em;
}

a {
	color: var(--link);
}

a:hover {
	color: var(--link-hover);
}

hr {
	border-style: solid;
	border-color: var(--border);
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

ul>li::before {
	position: absolute;
	top: .625rem;
	left: .125rem;
	height: .375rem;
	width: .375rem;
	border-radius: 9999px;
	background-color: currentColor;
	opacity: .4;
	content: "";
}

ul>li {
	position: relative;
	padding-left: 1.25rem;
}

pre {
	overflow-wrap: normal;
	word-break: normal;
	border-radius: .375rem;
	border-width: 1px;
	border-style: solid;
	border-color: var(--border);
	background-color: var(--code);
	line-height: 1.5;
	word-spacing: normal;
	tab-size: 2;
	padding: 1rem;
	overflow: auto;
	font-size: 0.75rem;
	font-family: SF Mono, SFMono-Regular, ui-monospace, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
}
