html[data-theme="dark"] {
}

/* Отступ при скролле к якорям, чтобы контент не уходил под фиксированный header (высота header ≈ 3rem) */
html {
	scroll-padding-top: 3.5rem;
}

/* SNPro FONTS */
@font-face {
		font-family: 'SN Pro';
		src: url('/fonts/SNPro-Light.woff2') format('woff2'),
				url('/fonts/SNPro-Light.woff') format('woff');
		font-weight: 300;
		font-style: normal;
		font-display: fallback;
}
@font-face {
		font-family: 'SN Pro';
		src: url('/fonts/SNPro-Regular.woff2') format('woff2'),
				url('/fonts/SNPro-Regular.woff') format('woff');
		font-weight: normal;
		font-style: normal;
		font-display: fallback;
}
@font-face {
		font-family: 'SN Pro';
		src: url('/fonts/SNPro-Medium.woff2') format('woff2'),
				url('/fonts/SNPro-Medium.woff') format('woff');
		font-weight: 500;
		font-style: normal;
		font-display: fallback;
}

/* Merriweather Italic FONTS */
@font-face {
    font-family: 'Merriweather';
    src: url('/fonts/Merriweather24pt-LightItalic.woff2') format('woff2'),
        url('/fonts/Merriweather24pt-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: fallback;
}

:root {
	--header-menu-font-size: 0.875rem;
	/* Ширина мобильной версии ≤ 48rem */
	--main-width-sm: 93vw;
	/* Порог показа десктопного меню (navbar). При смене — обновить оба @media ниже (min/max). */
	--nav-desktop-min-width: 56rem;
}

@media screen and (max-width: 48rem) {
	main {
		width: var(--main-width-sm) !important;
	}
}

/* Десктопное меню: порог из --nav-desktop-min-width. При смене порога — менять переменную и все значения ниже (59rem / 58.9999rem). */
@media screen and (max-width: 55.9999rem) {
	header #header_navbar {
		display: none !important;
	}
}
@media screen and (min-width: 56rem) {
	header #header_navbar {
		display: block !important;
	}
	/* Кнопка гамбургера скрывается вместе с переходом на десктопное меню (в теме порог 64rem). */
	header #sidebar_btn {
		display: none !important;
	}
	/* Ширина хедера «lg» с 59rem, чтобы не было скачка при 64rem (в теме порог — $lg_min_width). */
	header #header_content.normal {
		width: 80vw !important;
	}
	header #header_content.wide {
		width: 80vw !important;
	}
	header #header_content.extra-wide {
		width: 85vw !important;
	}
}

html,
body,
button,
input,
select,
textarea,
code,
.pure-g [class*="pure-u"] {
	font-family: 'SN Pro', system-ui, -apple-system, sans-serif !important;
	font-weight: 300;
}

article {
	line-height: 1.6;
}

h1, h2, h3, h4, strong, summary {
	font-weight: normal;
}

h1 {
	font-size: 1.8rem;
}

@media screen and (min-width: 48rem) {
	body:not:(.thirdlevel) h1::before {
		content: '⨕ ';
		vertical-align: 0.24rem;
	}
}

@media screen and (max-width: 48rem) {
	h1 {
		margin-top: -1rem;
	}
}
h2 {
	margin-top: 2.5rem;
}
.thirdlevel h2::before {
	font-family: 'Merriweather', system-ui, -apple-system, sans-serif !important;
	font-size: 90%;
	content: '§';
	margin-right: 7px;
}
h3,
h4,
blockquote p {
	font-size: 1.125rem;
}
h5 {
	font-weight: 500;
	font-size: 1rem;
}
blockquote p {
	font-family: 'Merriweather', system-ui, -apple-system, sans-serif !important;
	font-size: 0.9rem;
	font-style: italic;
	font-weight: 300;
	color: var(--color-header-menu-item-inactive);
}
a[href*="glossary"] {
	border-bottom: 1px dotted;
}





/* START: MARFA FONTS */
@font-face {
	font-family: Marfa;
	src: url("/fonts/Marfa.woff2") format("woff2"),
		 url("/fonts/Marfa.woff") format("woff");
	font-style: normal;
	font-weight: normal;
	font-display: fallback;
}
.marfafont {
	font-family: Marfa;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	margin: 0 4px 0 0;
}

/* Значки в контенте MARFA FONTS */
.signtelegram:before {
	content: '\F2C6';
	margin: 0 0 0 3px!important;
}
.dig1:before {
	content: '\E0EE';
	margin: 0 5px 0 5px;
}
/* END: MARFA FONTS */






/* START: Header */
.brand {
	margin-right: 5px;
}
.brand a {
	font-size: 1.375rem!important;
	font-weight: 500!important;
}
.header-menu a,
#header_navbar a,
#sidebar a {
	font-size: var(--header-menu-font-size);
	font-weight: normal;
}
.header-menu-item {
	margin-right: 10px;
	bottom: -1px;
}
.insection a {
	color: var(--color-header-menu-item-active) !important;
}

/* Top Menu Marfa Fonts */
.menuchat:before {
	content: '\E15A';
}
.menuinvites:before {
	content: '\E0C7';
}
.menurules:before {
	content: '\F4C6';
}
.menuconcept:before {
	content: '\F471';
}
.menuarchitecture:before {
	content: '\E10D';
}
.menublog:before {
	content: '\F6D5';
}
.menugrouptg:before {
	content: '\E14F';
}

/* Расстояние между текстом ссылки и треугольником (▾) в выпадающем пункте меню */
header .header-menu-dropdown > .pure-menu-link::after {
	margin-left: 0.35em;
}
/* END: Header typography */



/* START: chimeralimen_top Icon */
.balloon-head-item-img img {
	width: 14rem!important;
	height: 14rem!important;
}
/* Колонка с иконкой */
.balloon-layout .balloon-head-item .balloon-head-item-desktop {
	width: 14rem;
	left: -3.2rem;
}
/* Размер иконки в мобильной версии */
@media screen and (max-width: 48rem) {
	.balloon-head-item-mobile {
		--balloon-mobile-icon-size: 9rem;
	}
	.balloon-head-item-mobile .balloon-head-item-img img {
		width: var(--balloon-mobile-icon-size) !important;
		height: var(--balloon-mobile-icon-size) !important;
	}
}
/* END: chimeralimen_top Icon */




/* START: Content Layout */
/* .my-8 в balloon: без верхних отступов (переопределение возможных margin/padding) */
.balloon-head-item-content .my-8 {
	margin-top: 0;
	padding-top: 0;
}

/* Десктоп: выравнивание контента (включая h1) с вертикальной линией. min-width: 48.0625rem (769px) — избегаем перекрытия с max-width: 48rem при 768px */
@media screen and (min-width: 48.0625rem) {
	/* Внутренние страницы: выравнивание как на главной */
	.balloon-head-item-content:has(.my-8) {
	align-items: flex-start !important;
	padding-top: 2.5rem;
	}
	/* Внутренние страницы: .my-8 */
	.balloon-head-item-content .my-8,
	.balloon-head-item-content > article {
	margin-left: -7.5rem;
	}
}

/* Дочерние страницы: список внутри контента */
.balloon-head-item-content .my-8 > ul {
	margin-top: 1.5rem;
	padding-left: 1.5rem;
}
/* Компенсация для timeline-dots */
@media screen and (min-width: 48.0625rem) {
	.balloon-head-item-content.balloon-timeline-dots .my-8 article h2::before {
	left: calc(-20px - 2.7rem)!important;
	}
}

/* Хлебные крошки */
.breadcrumbs {
	flex: 1 1 0;
	min-width: 0;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 5px;
}
.breadcrumbs img {
	height: 80px;
}
.breadcrumbs {
	font-size: var(--header-menu-font-size);
	font-weight: 300;
	line-height: 1.5;
}
.current-page {
	color: var(--color-header-menu-item-inactive);
}
@media screen and (min-width: 48rem) {
	.breadcrumbs {
		margin-left: -40px;
	}
}
.breadcrumbs a {
	font-weight: normal;
	border-bottom: none;
}

/* Отступы заголовков и блоков */
@media screen and (min-width: 48rem) {
	body.home h1,
	body.secondlevel h1,
	body.home .intro,
	body.secondlevel .intro {
		margin-left: 4rem;
	}
}

/* Дополнительные материалы */
.current a {
	color: var(--color-header-menu-item-inactive);
}
h2.additional_articles {
	font-size: 1.25rem;
}
/* END: Content Layout */



/* START: Balloon-Dot на вертикальной линии напротив каждого h2 */
.balloon-head-item-content.balloon-timeline-dots .my-8 article h2 {
	position: relative;
}
.balloon-head-item-content.balloon-timeline-dots .my-8 article h2::before {
	content: '';
	position: absolute;
	left: calc(-20px - 9.5rem);
	top: 0.4em;
	width: 0.8rem;
	height: 0.8rem;
	transform: translateX(-50%);
	border-radius: 1rem;
	border: 2px solid var(--color-text);
	background-color: var(--color-background);
	box-sizing: border-box;
}
@media screen and (max-width: 48rem) {
	/* Сброс десктопных отрицательных отступов — при 768px тема даёт margin-left из min-width */
	.balloon-layout {
		margin-left: 0 !important;
	}
	.balloon-head-item-content .my-8,
	.balloon-head-item-content > article {
		margin-left: 0 !important;
	}
	.balloon-head-item-content.balloon-timeline-dots .my-8 article h2::before {
	display: none;
	}
	/* Внутренние страницы (invites, concept, docs): текст — по левому краю, h1–h3 — по центру */
	.balloon-head-item-content .my-8 article h1 {
	text-align: center;
	margin-left: 0;
	}
	.balloon-layout .balloon-head-item .balloon-head-item-content .my-8 article {
	text-align: left !important;
	}
}
/* END: Balloon-Dot на вертикальной линии напротив каждого h2 */



/* START: Content Area */
/* Вводный текст */
code,
.intro,
.txtsmall,
.doctable td {
	font-size: var(--header-menu-font-size);
	line-height: 1.5;
}
.intro {
	font-weight: normal;
}
.intro + p {
	margin-top: 2.5rem;
}
ul + .intro,
ul + .txtsmall {
	margin-top: 1rem;
}

/* Цитаты Химеры */
article blockquote {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-left: 0.5rem;
	padding-left: 1rem;
	border-width: 1px;
}
@media screen and (min-width: 48rem) {
	article blockquote {
		margin-left: 1.8rem;
	}
}

/* Цифры в ol — автоматическая нумерация глифами Marfa (1–9) и Блок ссылок "Статьи раздела" */
@counter-style marfa-digits {
	system: cyclic;
	symbols: "\E0EE" "\E0EF" "\E0F0" "\E0F1" "\E0F2" "\E0F3" "\E0F4" "\E0F5" "\E0F6";
	suffix: " ";
}
ol,
ul.moreinfo {
	counter-reset: marfa-n;
	list-style: none !important;
	padding-left: 0.5em;
}
ol li {
	counter-increment: marfa-n;
	list-style: none !important;
	padding-left: 0.5em;
}
ul.moreinfo li {
	counter-increment: marfa-n;
	list-style: none !important;
	padding-left: 1.2em;
}
ol li::before,
ul.moreinfo li::before {
	display: inline-block;
	margin: 0 0.5em 0 -1.5em;
	font-family: Marfa;
	font-size: 95%;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
}
ol li::before {
	content: counter(marfa-n, marfa-digits);
}
ul.moreinfo li::before {
	content: '\F055';
}

/* Блок подписки */
.subscription {
	display: inline-block;
	padding: 7px 14px 9px 14px;
	background: #f1efea;
	border-radius: 5px;
	line-height: 1.8;
}
html[data-theme="dark"] p.subscription {
	color: #000;
}

/* Диаграммы */
.diagram {
	width: 60%;
	margin: 3rem 0;
}
@media screen and (max-width: 48rem) {
	.diagram {
		width: 70%;
	}
}

/* Таблицы */
.doctable table td {
	width: 50%;
	vertical-align: top;
}
.thead td {
	font-weight: normal;
	border: none!important;
}
.tbold td {
	font-weight: normal;
	background: #ebebeb;
}
html[data-theme="dark"] .tbold td {
	background: #000;
}
/* END: Content Area */


/* START: Footer */
footer a {
	color: inherit;
}
div.footerimg {
	flex: 1 1 0;
	min-width: 0;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 15px;
}
.footerimg img {
	height: 60px;
	margin-top: -5px;
}
@media screen and (min-width: 48rem) {
	.thirdlevel .footerimg img {
		margin-left: -48px;
	}
}
footer {
	margin-top: 3rem;
	margin-bottom: 2rem;
	font-size: 0.75rem;
	line-height: 1.15rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	text-align: left;
}
footer .footer-col {
	flex: 1 1 0;
}
footer .footer-col-left {
	min-width: 70%;
}

footer .footer-col-right {
	text-align: right;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
}
footer .footer-col-right .footer-line {
	display: block;
}
footer a {
	text-decoration: underline;
}

/* Футер на страницах с balloon-layout: в одну колонку с контентом */
@media screen and (min-width: 48rem) {
	#content:has(> .balloon-layout) > footer {
		margin-left: -0.3rem;
		width: calc(100% - 0);
		box-sizing: border-box;
	}
}

/* Убираем картинку и <br/> в мобильной версии */
@media screen and (max-width: 48rem) {
	.footerimg img {
		display: none;
	}
}

/* END: Footer */

/* Универсальный сворачиваемый блок в контенте */
.content-collapse {
	max-width: 100%;
	margin: 0.75rem 0;
}
.content-collapse > summary {
	cursor: pointer;
	list-style: none;
	padding: 0.4rem 0;
	font-weight: 500;
}
.content-collapse > summary::-webkit-details-marker {
	display: none;
}
.content-collapse > summary::before {
	content: "▶ ";
	display: inline-block;
	margin-right: 0.35rem;
	transition: transform 0.15s ease;
}
.content-collapse[open] > summary::before {
	transform: rotate(90deg);
}
.content-collapse-inner {
	margin-top: 0.5rem;
	max-width: 100%;
	overflow-x: auto;
}
/* Перенос длинных строк, чтобы не уходить за край экрана */
.content-collapse-inner pre,
.content-collapse-inner .highlight > pre {
	max-width: 100%;
	white-space: pre-wrap;
	overflow-wrap: break-word;
	word-break: break-word;
}
.content-collapse-inner pre code {
	white-space: pre-wrap;
	overflow-wrap: break-word;
	word-break: break-word;
}
.content-collapse-inner .highlight {
	max-width: 100%;
}
.content-collapse-inner .highlight > div,
.content-collapse-inner .highlight > pre {
	max-width: 100%;
}