@font-face {
	font-family: "Manrope";
	src: url("./manrope-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
		U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
		U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	src: url("./manrope-cyrillic-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: "Manrope";
	src: url("./manrope-latin-600-normal.woff2") format("woff2");
	font-weight: 600;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
		U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
		U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	src: url("./manrope-cyrillic-600-normal.woff2") format("woff2");
	font-weight: 600;
	font-display: swap;
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

:root {
	color-scheme: light dark;
	--background: #f7f9fc;
	--surface: #ffffff;
	--foreground: #111922;
	--muted: #5b6571;
	--border: #dce2e9;
	--accent: #0082ad;
	--accent-soft: #e6f6fb;
	--ok: #087a55;
	--ok-soft: #e5f7ef;
	--warn: #9a5b00;
	--warn-soft: #fff3d6;
	--fail: #b4233c;
	--fail-soft: #fdebed;
}

* {
	box-sizing: border-box;
}

html {
	min-width: 320px;
	background: var(--background);
}

body {
	margin: 0;
	min-height: 100vh;
	min-height: 100svh;
	background: var(--background);
	color: var(--foreground);
	font-family: "Manrope", ui-sans-serif, system-ui, sans-serif;
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

button,
input {
	font: inherit;
}

a {
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 4px;
}

.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;
}

@media (prefers-color-scheme: dark) {
	:root {
		--background: #0c121b;
		--surface: #121c28;
		--foreground: #f7faff;
		--muted: #aab7c5;
		--border: #263342;
		--accent: #70d0f8;
		--accent-soft: #102b3a;
		--ok: #71ddb3;
		--ok-soft: #102c24;
		--warn: #f4c36a;
		--warn-soft: #332814;
		--fail: #ff8fa3;
		--fail-soft: #381a23;
	}
}
