/* Значения повторяют токены @small-tech/ui-kit (tokens/typography.css, tokens/variables-*.css):
   страницы статические и бандл приложения не подключают. */

@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("fonts/Inter-Regular.woff2") format("woff2");
}

@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("fonts/Inter-Medium.woff2") format("woff2");
}

@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("fonts/Inter-SemiBold.woff2") format("woff2");
}

@font-face {
	font-family: Inter;
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("fonts/Inter-Bold.woff2") format("woff2");
}

:root {
	color-scheme: light dark;
	--background: #fff;
	--background-secondary: #f9f9f9;
	--foreground: #1b1b1b;
	--border: rgb(0 0 0 / 10%);
}

@media (prefers-color-scheme: dark) {
	:root {
		--background: #000;
		--background-secondary: #1a1a1a;
		--foreground: #fcfcfc;
		--border: rgb(255 255 255 / 10%);
	}
}

body {
	margin: 0;
	background: var(--background);
	color: var(--foreground);
	font-family: Inter, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	overflow-wrap: break-word;
	-webkit-text-size-adjust: 100%;
}

main {
	max-width: 800px;
	margin: 0 auto;
	padding: 32px 16px 48px;
}

h1 {
	margin: 0 0 24px;
	font-size: 24px;
	font-weight: 600;
	line-height: 36px;
}

h2 {
	margin: 32px 0 12px;
	font-size: 20px;
	font-weight: 600;
	line-height: 25px;
}

h3 {
	margin: 24px 0 8px;
	font-size: 16px;
	font-weight: 500;
	line-height: 22px;
}

h4 {
	margin: 16px 0 8px;
	font-size: 14px;
	font-weight: 500;
	line-height: 150%;
}

p {
	margin: 0 0 12px;
}

strong {
	font-weight: 700;
}

a {
	color: inherit;
	text-underline-offset: 2px;
}

hr {
	margin: 0 0 24px;
	border: 0;
	border-top: 1px solid var(--border);
}

ul {
	margin: 0 0 12px;
	padding-left: 20px;
}

li {
	margin-bottom: 8px;
}

table {
	width: 100%;
	margin: 0 0 16px;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 18px;
}

th,
td {
	padding: 8px 12px;
	border: 1px solid var(--border);
	text-align: left;
	vertical-align: top;
	overflow-wrap: anywhere;
	hyphens: auto;
}

th {
	background: var(--background-secondary);
	font-weight: 500;
}