/* ----------------------------------------
	hr
---------------------------------------- */
hr {
	margin: var(--space-2xl) 0;
	/*opacity: 0.25;*/
}

/* ----------------------------------------
	ol ul
---------------------------------------- */
ol li,
ul li {
	/*margin-top: 1rem;*/
	margin-top: 0;
}
ol li:first-child,
ul li:first-child,
ol li.nav-item,
ul li.nav-item {
	margin-top: 0;
}
.list-unstyled {
	padding-left: 0 !important;
}

/* ----------------------------------------
	title hN
---------------------------------------- */
/* Заголовки на единой type scale (см. root.css: --text-h*, --lh-*).
   Вес 700, интерлиньяж дифференцирован по кеглю; отбивка СВЕРХУ заметно
   больше, чем снизу (группировка заголовка с текстом под ним).
   Размеры фиксированные (без RFS) — значения выверены в варианте B.

   РИТМ ОТБИВОК (ревизия 2026-07-16, замер на живом обзоре):
   базовое 2xl (48) → h3 xl (32) → h4/h5/h6 lg (24). Здесь margin-top несёт
   ДЕФОЛТ (крупный раздел = h1/h2), ниже по лестнице — только отклонения;
   у h1/h2 своих margin-top больше нет.
   Было 40 (h2) и 28 (h3) — мимо шкалы: 40 кратно сетке 8, но выпало из
   ступеней (между xl 32 и 2xl 48 дыра, а имени в t-shirt там нет), 28 не
   кратно 8 вовсе (полушаг 24+4, как 20). Завести ступень некуда → подогнали.
   Линейка выбора — принцип строкой выше (mt заметно больше mb=16):
   h2 48 = 3×, h3 32 = 2×. Вариант 32/24 отклонён: у h3 разрыв падал до 1.5×
   (заголовок «плывёт» между абзацами) и h3 сравнивался с h4.
   Замер употребления: h2 — 21 раз на обзоре, h3 — 12; h1 почти всегда
   :first-child (его отбивка гасится в 0), h4/h5/h6 — 1/1/0. Ритм статьи
   держат h2 и h3, поэтому спор шёл про них. */
h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
	font-weight: 700;
	line-height: var(--lh-snug);
	margin-top: var(--space-2xl);
	margin-bottom: var(--space-md);
}
/* Первый заголовок блока не отбивается сверху (нечего отделять).
   margin-bottom здесь НЕ задаём: он был ДУБЛЕМ базового правила выше (тот же
   узор, что h2{margin-top:2.5rem} — см. [[typography-scale]]), но, сидя на
   специфичности (0,1,1), перебивал компонентные значения Bootstrap: h5.modal-title
   первый в .modal-header, и вместо своего 0 получал 16px — ради чего в разметке
   держали костыль mb-0. Убрали дубль → компонент берёт свой отступ сам. */
h6:first-child, .h6:first-child,
h5:first-child, .h5:first-child,
h4:first-child, .h4:first-child,
h3:first-child, .h3:first-child,
h2:first-child, .h2:first-child,
h1:first-child, .h1:first-child {
	margin-top: 0;
}

/* Заголовки-роли компонентов (модалка, алерт, аккордеон, карточка, offcanvas)
   живут ВНЕ ритма зоны чтения: у компонента своя метрика, отбивка статьи его
   разрывает. Прежде спасал только :first-child выше — позиция, а не система:
   иконка перед h5.modal-title, и он ловит 24px (замер 2026-07-16).
   Гасим ТОЛЬКО margin-top: нижний отступ каждой роли Bootstrap задаёт сам и
   осмысленно (modal/accordion/offcanvas-title → 0, card-title → свой spacer-y,
   alert-heading → не задаёт, ему нужен отступ от базового правила выше).
   Специфичность (0,1,0) — обязана перекрыть базовое, которое бьёт по тегу
   (0,0,1); :where() здесь бессилен (0,0,0 проигрывает тегу — проверено). */
.modal-title, .alert-heading, .accordion-header, .card-title, .offcanvas-title {
	margin-top: 0;
}

h1, .h1 {
	font-size: var(--text-h1);       /* 36px */
	line-height: var(--lh-tight);    /* 1.2 */
	/* margin-top не задаём: базовое правило выше уже даёт 2xl (48).
	   На практике почти всегда гасится соседним :first-child → 0. */
	/* balance — только на герой-ролях (h1 и .lead ниже), НЕ на всей лестнице
	   заголовков. Замер 2026-07-16: по h1…h4 он даёт 16→15 висячих слов из 31
	   (на десктопе заголовки однострочные — балансировать нечего; на 390px в
	   строку влезает 3-4 слова). Крупный кегль — единственное место, где он
	   реально решает (прецедент: 404, где «устарела.» повисало одно). */
	text-wrap: balance;
}
h2, .h2 {
	font-size: var(--text-h2);       /* 28px */
	line-height: var(--lh-heading);  /* 1.3 */
	/* margin-top не задаём — базовое правило даёт 2xl (48). Прежняя строка
	   `margin-top: 2.5rem` была ДУБЛЕМ базового (то же 40, та же
	   специфичность): удаление проверено через CSSOM — computed не дрогнул. */
}
h3, .h3 {
	font-size: var(--text-h3);       /* 24px */
	line-height: var(--lh-snug);     /* 1.35 */
	margin-top: var(--space-xl);     /* подраздел: меньше дефолта (было 28, мимо сетки) */
}
h4, .h4 {
	font-size: var(--text-h4);       /* 20px */
	line-height: var(--lh-ui);       /* 1.4 */
	margin-top: var(--space-lg);
}
h5, .h5 {
	font-size: var(--fs-base);       /* 18px */
	line-height: var(--lh-ui);
	margin-top: var(--space-lg);
}
h6, .h6 {
	font-size: var(--fs-sm);         /* 16px */
	line-height: var(--lh-ui);
	margin-top: var(--space-lg);
}

/* Первый абзац обзора/статьи — крупнее и приглушённее (вариант B) */
.lead {
	font-size: var(--text-lead);     /* 20px */
	line-height: var(--lh-lead);     /* 1.6 */
	font-weight: 400;
	color: var(--bs-secondary-text-emphasis);
	text-wrap: balance;              /* подводка — герой-роль, см. h1 выше */
}

/* ----------------------------------------
	tab-content
---------------------------------------- */
.tab-content > .tab-pane {
	outline: none;
}

/* ----------------------------------------
	table-responsive
---------------------------------------- */
.table-responsive {
	padding-bottom: 1px;
	padding-right: 1px;
}

/* ----------------------------------------
	table
---------------------------------------- */
.table {
	--bs-table-color: var(--bs-gray-900);
	--bs-table-border-color: rgba(var(--bs-gray-100-rgb), 0.55);
	--bs-table-bg: var(--bs-white);

	--bs-table-color-thead: var(--bs-info-950);
	--bs-table-border-color-thead-first: var(--bs-table-border-color);
	--bs-table-border-color-thead-last: var(--bs-table-border-color);
	--bs-table-bg-thead-first: var(--bs-table-bg);
	--bs-table-bg-thead-last: var(--bs-table-bg);

	--bs-table-striped-color: var(--bs-gray-950);
	--bs-table-striped-bg: rgba(var(--bs-gray-500-rgb), 0.05);

	--bs-table-active-color: var(--bs-gray-950);
	--bs-table-active-bg: rgba(var(--bs-gray-500-rgb), 0.1);

	--bs-table-hover-color: var(--bs-gray-950);
	--bs-table-hover-border-color: rgba(var(--bs-gray-100-rgb), 0.55);
	--bs-table-hover-bg: rgba(var(--bs-gray-50-rgb), 0.85);

	margin-bottom: 0;

	border-spacing: 0;
	border-collapse: separate;

	/*border-top-width: var(--bs-border-width);*/
	border-bottom-width: var(--bs-border-width);
	/*border-left-width: var(--bs-border-width);*/
	border-right-width: var(--bs-border-width);

	/*border-top-width: 0;*/
	/*border-bottom-width: 0;*/
	/*border-left-width: 0;*/
	/*border-right-width: 0;*/
}
.table > tbody {
	vertical-align: middle;
}
.table > :not(caption) > * > * {
	--table-padding-x: 0.563rem;
	--table-padding-y: 0.375rem;
	/*--table-padding: 0.5rem;*/
	/*--table-padding-bottom: calc(var(--table-padding) - 1px);*/
	--table-font-size: inherit;

	font-size: var(--table-font-size);
	/*padding: var(--table-padding) var(--table-padding) var(--table-padding-bottom);*/
	padding: calc(var(--table-padding-y) + 1px) var(--table-padding-x) var(--table-padding-y);
}
.table > thead > tr > th {
	-webkit-backdrop-filter: var(--backdrop-filter-blur);
	backdrop-filter: var(--backdrop-filter-blur);
}
.table > :not(caption) > * > * a {
	text-decoration: none;
}

thead > tr:first-child > th {
	--bs-table-color: var(--bs-table-color-thead);
	--bs-table-border-color: var(--bs-table-border-color-thead-first);
	--bs-table-bg: var(--bs-table-bg-thead-first);
}
thead > tr:not(:first-child):last-child > th {
	--bs-table-color: var(--bs-table-color-thead);
	--bs-table-border-color: var(--bs-table-border-color-thead-last);
	--bs-table-bg: var(--bs-table-bg-thead-last);
}

@media (max-width: 1499.98px) {
	.table > :not(caption) > * > * {
		--table-padding-x: 0.438rem;
		--table-padding-y: 0.313rem;
		/*--table-padding: 0.375rem;*/
		--table-font-size: 0.875rem;
	}
}

@media (max-width: 1399.98px) {
	.table > :not(caption) > * > * {
		--table-padding-x: 0.313rem;
		--table-padding-y: 0.188rem;
		/*--table-padding: 0.25rem;*/
		/*--table-padding-bottom: calc(var(--table-padding) - 0px);*/
		/*--table-font-size: 0.75rem;*/
	}
}

/* ----------------------------------------
	table-group-divider
---------------------------------------- */
.table-group-divider {}
thead.table-group-divider > tr:last-child > *,
thead.table-group-divider > tr:last-child > *:first-child,
thead.table-group-divider > tr:last-child > *:last-child {
	--box-shadow-color: var(--bs-blue-500-rgb);

	border-bottom-width: calc(var(--bs-border-width) * 2);
	box-shadow: var(--bs-box-shadow-sm);
}

/* ----------------------------------------
	table-bordered
---------------------------------------- */
.table-bordered > :not(caption) > * {}
.table-bordered > :not(caption) > * > * {
	border-style: solid;
	border-color: var(--bs-table-border-color);
	border-width: 0;
	border-bottom-width: var(--bs-border-width);
	border-right-width: var(--bs-border-width);
}
.table-bordered > :not(caption) > * > *:first-child {
	border-left-width: var(--bs-border-width);
}
.table-bordered > thead > *:first-child > *,
.table-bordered > tbody > *:first-child > * {
	border-top-width: var(--bs-border-width);
}

/* ----------------------------------------
	table-hover
---------------------------------------- */
.table-hover > tbody > tr > * {
	transition: color var(--transition-options-15), border-color var(--transition-options-15), background-color var(--transition-options-15), box-shadow var(--transition-options-15);
}

.table-hover > tbody > tr:hover > * {
	/*--bs-table-color-state: var(--bs-table-hover-color);*/
	/*--bs-table-bg-state: var(--bs-table-hover-bg);*/

	border-color: var(--bs-table-hover-border-color);
}

/* ----------------------------------------
	table-* colors
---------------------------------------- */
.table-primary {
	--bs-table-color: var(--bs-primary-900);
	--bs-table-border-color: rgba(var(--bs-primary-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-primary-50-rgb), 1);

	--bs-table-color-thead: var(--bs-primary-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-primary-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-primary-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-primary-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-primary-100-rgb), 1);

	--bs-table-striped-color: var(--bs-primary-950);
	--bs-table-striped-bg: rgba(var(--bs-primary-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-primary-950);
	--bs-table-active-bg: rgba(var(--bs-primary-100-rgb), 1);

	--bs-table-hover-color: var(--bs-primary-950);
	--bs-table-hover-border-color: rgba(var(--bs-primary-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-primary-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-secondary {
	--bs-table-color: var(--bs-secondary-900);
	--bs-table-border-color: rgba(var(--bs-secondary-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-secondary-50-rgb), 1);

	--bs-table-color-thead: var(--bs-secondary-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-secondary-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-secondary-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-secondary-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-secondary-100-rgb), 1);

	--bs-table-striped-color: var(--bs-secondary-950);
	--bs-table-striped-bg: rgba(var(--bs-secondary-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-secondary-950);
	--bs-table-active-bg: rgba(var(--bs-secondary-100-rgb), 1);

	--bs-table-hover-color: var(--bs-secondary-950);
	--bs-table-hover-border-color: rgba(var(--bs-secondary-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-secondary-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-success {
	--bs-table-color: var(--bs-success-900);
	--bs-table-border-color: rgba(var(--bs-success-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-success-50-rgb), 1);

	--bs-table-color-thead: var(--bs-success-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-success-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-success-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-success-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-success-100-rgb), 1);

	--bs-table-striped-color: var(--bs-success-950);
	--bs-table-striped-bg: rgba(var(--bs-success-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-success-950);
	--bs-table-active-bg: rgba(var(--bs-success-100-rgb), 1);

	--bs-table-hover-color: var(--bs-success-950);
	--bs-table-hover-border-color: rgba(var(--bs-success-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-success-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-info {
	--bs-table-color: var(--bs-info-900);
	--bs-table-border-color: rgba(var(--bs-info-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-info-50-rgb), 1);

	--bs-table-color-thead: var(--bs-info-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-info-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-info-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-info-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-info-100-rgb), 1);

	--bs-table-striped-color: var(--bs-info-950);
	--bs-table-striped-bg: rgba(var(--bs-info-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-info-950);
	--bs-table-active-bg: rgba(var(--bs-info-100-rgb), 1);

	--bs-table-hover-color: var(--bs-info-950);
	--bs-table-hover-border-color: rgba(var(--bs-info-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-info-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

/*.table-info {
	--bs-table-color: var(--bs-info-950);
	--bs-table-border-color: rgba(var(--bs-info-700-rgb), 0.3);
	--bs-table-bg: rgba(var(--bs-info-100-rgb), 0.45);
	--bs-table-bg-thead-first: rgba(var(--bs-info-100-rgb), 0.65);
	--bs-table-bg-thead-last: rgba(var(--bs-info-50-rgb), 0.75);

	--bs-table-striped-color: var(--bs-info-900);
	--bs-table-striped-bg: rgba(var(--bs-info-50-rgb), 0.25);

	--bs-table-active-color: var(--bs-info-900);
	--bs-table-active-bg: rgba(var(--bs-info-100-rgb), 0.25);

	--bs-table-hover-color: var(--bs-info-900);
	--bs-table-hover-bg: rgba(var(--bs-info-100-rgb), 0.25);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}*/

.table-warning {
	--bs-table-color: var(--bs-warning-900);
	--bs-table-border-color: rgba(var(--bs-warning-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-warning-50-rgb), 1);

	--bs-table-color-thead: var(--bs-warning-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-warning-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-warning-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-warning-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-warning-100-rgb), 1);

	--bs-table-striped-color: var(--bs-warning-950);
	--bs-table-striped-bg: rgba(var(--bs-warning-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-warning-950);
	--bs-table-active-bg: rgba(var(--bs-warning-100-rgb), 1);

	--bs-table-hover-color: var(--bs-warning-950);
	--bs-table-hover-border-color: rgba(var(--bs-warning-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-warning-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-danger {
	--bs-table-color: var(--bs-danger-900);
	--bs-table-border-color: rgba(var(--bs-danger-100-rgb), 1);
	--bs-table-bg: rgba(var(--bs-danger-50-rgb), 1);

	--bs-table-color-thead: var(--bs-danger-950);
	--bs-table-border-color-thead-first: rgba(var(--bs-danger-300-rgb), 1);
	--bs-table-border-color-thead-last: rgba(var(--bs-danger-200-rgb), 1);
	--bs-table-bg-thead-first: rgba(var(--bs-danger-200-rgb), 1);
	--bs-table-bg-thead-last: rgba(var(--bs-danger-100-rgb), 1);

	--bs-table-striped-color: var(--bs-danger-950);
	--bs-table-striped-bg: rgba(var(--bs-danger-100-rgb), 0.55);

	--bs-table-active-color: var(--bs-danger-950);
	--bs-table-active-bg: rgba(var(--bs-danger-100-rgb), 1);

	--bs-table-hover-color: var(--bs-danger-950);
	--bs-table-hover-border-color: rgba(var(--bs-danger-100-rgb), 1);
	--bs-table-hover-bg: rgba(var(--bs-danger-100-rgb), 1);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-light {
	--bs-table-color: var(--bs-gray-950);
	--bs-table-border-color: rgba(var(--bs-gray-700-rgb), 0.2);
	--bs-table-bg: rgba(var(--bs-gray-50-rgb), 0.95);
	--bs-table-bg-thead-first: rgba(var(--bs-gray-100-rgb), 0.5);
	--bs-table-bg-thead-last: rgba(var(--bs-gray-50-rgb), 0.65);
	--bs-table-striped-color: var(--bs-gray-950);
	--bs-table-striped-bg: rgba(var(--bs-gray-50-rgb), 0.6);
	--bs-table-active-color: var(--bs-gray-950);
	--bs-table-active-bg: rgba(var(--bs-gray-100-rgb), 0.6);
	--bs-table-hover-color: var(--bs-gray-950);
	--bs-table-hover-bg: rgba(var(--bs-gray-100-rgb), 0.6);

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}

.table-dark {
	--bs-table-color: #fff;
	--bs-table-bg: #212529;
	--bs-table-border-color: #4d5154;
	--bs-table-bg-thead-first: rgba(var(--bs-gray-100-rgb), 0.5);
	--bs-table-bg-thead-last: rgba(var(--bs-gray-50-rgb), 0.65);
	--bs-table-striped-bg: #2c3034;
	--bs-table-striped-color: #fff;
	--bs-table-active-bg: #373b3e;
	--bs-table-active-color: #fff;
	--bs-table-hover-bg: #323539;
	--bs-table-hover-color: #fff;

	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color);
}



/* -------------------------------------------
	form-check-input
------------------------------------------- */
.form-check-input {
	background-position-y: -1em;
	transition: background-color var(--transition-options-15), background-position 0.35s cubic-bezier(0.2, 0, 0.05, 1.5), border-color var(--transition-options-15), box-shadow var(--transition-options-15);
}
.form-check-input:checked {
	background-position-y: 0;
}



/* -------------------------------------------
	btn
------------------------------------------- */
.btn {
	/* --bs-btn-padding-x: 0.75rem; */
	--bs-btn-padding-x: 0.813rem;
	/* --bs-btn-padding-x: 0.875rem; */
	/*--bs-btn-padding-y: 0.375rem;*/
	/*--bs-btn-font-size: 1rem;*/
	/*--bs-btn-font-weight: 400;*/
	/*--bs-btn-line-height: 1.5;*/
	/*--bs-btn-color: var(--bs-body-color);*/
	/*--bs-btn-border-width: var(--bs-border-width);*/
	/*--bs-btn-border-radius: var(--bs-border-radius);*/
	--bs-btn-box-shadow:
		/*0px 1.15891px 0.755676px rgba(var(--bs-btn-box-shadow-color), 0.12),
		0px 2.63479px 1.91116px rgba(var(--bs-btn-box-shadow-color), 0.0827978),
		0px 4.77692px 3.89859px rgba(var(--bs-btn-box-shadow-color), 0.0667549),
		0px 8.5846px 8.03036px rgba(var(--bs-btn-box-shadow-color), 0.0532451),
		0px 24px 22px rgba(var(--bs-btn-box-shadow-color), 0.0372022)*/
		0 0 0 rgba(var(--bs-btn-box-shadow-color), 0.1),
		0 0 0 rgba(var(--bs-btn-box-shadow-color), 0.15),
		0 0 0 rgba(var(--bs-btn-box-shadow-color), 0.2);
	/*--bs-btn-box-shadow:
			0px 24px 22px rgba(var(--bs-secondary-rgb), 0.0372022),
			0px 8.5846px 8.03036px rgba(var(--bs-secondary-rgb), 0.0532451),
			0px 4.77692px 3.89859px rgba(var(--bs-secondary-rgb), 0.0667549),
			0px 2.63479px 1.91116px rgba(var(--bs-secondary-rgb), 0.0827978),
			0px 1.15891px 0.755676px rgba(var(--bs-secondary-rgb), 0.12);*/
	--bs-btn-box-shadow-hover:
		0 1px 2px rgba(var(--bs-btn-box-shadow-color), 0.1),
		0 4px 8px rgba(var(--bs-btn-box-shadow-color), 0.15),
		0 8px 16px rgba(var(--bs-btn-box-shadow-color), 0.2);
	--bs-btn-box-shadow-active: var(--bs-btn-box-shadow);
	--bs-btn-disabled-opacity: .65;
	/*--bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);*/

	--btn-translateY-hover: translateY(-2px);
	--btn-translateY-active: translateY(0);
	--btn-scale-active: scale(.99);
	--btn-hover-bg-rgba-opacity: .85;
	--btn-disabled-color-rgba-opacity: 1;
	--btn-disabled-bg-rgba-opacity: 1;
	/*--box-shadow-color: var(--bs-secondary-rgb);*/
	--bs-btn-box-shadow-color: var(--bs-btn-focus-shadow-rgb);

	text-shadow: none;
	corner-shape: superellipse(var(--corner-shape));
	box-shadow: var(--bs-btn-box-shadow);
	/*box-shadow: none;*/
	transition: all var(--transition-options-15);
}
.btn:hover {
	transform: var(--btn-translateY-hover);
	box-shadow: var(--bs-btn-box-shadow-hover);
	/*box-shadow: none;*/
}
.btn:active {
	transform: var(--btn-translateY-active) var(--btn-scale-active);
	box-shadow: var(--bs-btn-box-shadow-active);
	/*box-shadow: none;*/
}
.btn:disabled, .btn.disabled, fieldset:disabled .btn {
	cursor: not-allowed;
	/*box-shadow: var(--bs-btn-box-shadow-active);*/
	box-shadow: none;
}
table .btn {
	--btn-translateY-hover: translateY(-1px);
	--btn-scale-active: scale(.97);

	box-shadow: none !important;
}

.btn-inflex,
.btn-flex {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.btn-flex {
	display: flex;
}

/* -------------------------------------------
	btn-* colors
------------------------------------------- */
.btn-primary {
	/* bg на 600: белый текст = 4.98 (WCAG AA); 500 давал 3.68. */
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bs-primary-600);
	--bs-btn-border-color: var(--bs-primary-600);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-primary-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-primary-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-primary-600-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-primary-600-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-primary-600-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-white-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-primary-600-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-primary-600-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-secondary {
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bs-secondary);
	--bs-btn-border-color: var(--bs-secondary);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-secondary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-secondary-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-secondary-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-white-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-secondary-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-secondary-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-success {
	/* bg на 600: белый текст = 4.55 (WCAG AA даже для мелкой подписи).
	   500 давал 3.33 — проходил только как крупный текст (ревизия панелью). */
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bs-success-600);
	--bs-btn-border-color: var(--bs-success-600);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-success-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-success-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-success-600-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-success-600-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-success-600-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-white-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-success-600-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-success-600-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-info {
	--bs-btn-color: var(--bs-info-950);
	--bs-btn-bg: var(--bs-info);
	--bs-btn-border-color: var(--bs-info);

	--bs-btn-hover-color: var(--bs-info-950);
	--bs-btn-hover-bg: rgba(var(--bs-info-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-info-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-info-rgb);

	--bs-btn-active-color: var(--bs-info-950);
	--bs-btn-active-bg: rgba(var(--bs-info-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-info-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-info-950), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-info-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-info-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-warning {
	--bs-btn-color: var(--bs-warning-950);
	--bs-btn-bg: var(--bs-warning-400);
	--bs-btn-border-color: var(--bs-warning-400);

	--bs-btn-hover-color: var(--bs-warning-950);
	--bs-btn-hover-bg: rgba(var(--bs-warning-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-warning-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);

	--bs-btn-active-color: var(--bs-warning-950);
	--bs-btn-active-bg: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-warning-950-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-warning-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-warning-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-danger {
	/* bg на 600: белый текст = 5.33 (WCAG AA); 500 давал 3.94. */
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bs-danger-600);
	--bs-btn-border-color: var(--bs-danger-600);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-danger-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-danger-600-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-danger-600-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-danger-600-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-danger-600-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-white-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-danger-600-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-danger-600-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-light {
	--bs-btn-color: var(--bs-gray-900);
	--bs-btn-bg: var(--bs-gray-50);
	--bs-btn-border-color: var(--bs-gray-50);

	--bs-btn-hover-color: var(--bs-gray-900);
	--bs-btn-hover-bg: rgba(var(--bs-gray-50-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-gray-50-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-gray-400-rgb);

	--bs-btn-active-color: var(--bs-gray-900);
	--bs-btn-active-bg: rgba(var(--bs-gray-50-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-gray-50-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-gray-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-gray-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-gray-50-rgb), var(--btn-disabled-bg-rgba-opacity));
}

.btn-dark {
	--bs-btn-color: var(--bs-white);
	--bs-btn-bg: var(--bs-gray-800);
	--bs-btn-border-color: var(--bs-gray-800);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-gray-800-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-gray-800-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-gray-800-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-gray-800-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-gray-800-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-white-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-gray-800-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-gray-800-rgb), var(--btn-disabled-bg-rgba-opacity));
}

/* -------------------------------------------
	btn-outline-* colors
------------------------------------------- */
[class*="btn-outline-"]:hover {
	/* transform: var(--btn-translateY-active); */
}
[class*="btn-outline-"]:active {
	/* transform: var(--btn-translateY-active) var(--btn-scale-active); */
}

.btn-outline-primary {
	--bs-btn-color: var(--bs-primary-700);
	--bs-btn-bg: var(--bs-primary-50);
	--bs-btn-border-color: var(--bs-primary-100);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-primary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-primary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-primary-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-primary-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-primary-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-primary-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-primary-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-secondary {
	--bs-btn-color: var(--bs-secondary-700);
	--bs-btn-bg: var(--bs-secondary-50);
	--bs-btn-border-color: var(--bs-secondary-100);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-secondary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-secondary-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-secondary-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-secondary-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-secondary-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-secondary-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-secondary-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-success {
	--bs-btn-color: var(--bs-success-700);
	--bs-btn-bg: var(--bs-success-50);
	--bs-btn-border-color: var(--bs-success-100);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-success-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-success-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-success-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-success-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-success-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-success-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-success-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-success-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-info {
	--bs-btn-color: var(--bs-info-700);
	--bs-btn-bg: var(--bs-info-50);
	--bs-btn-border-color: var(--bs-info-100);

	--bs-btn-hover-color: var(--bs-info-950);
	--bs-btn-hover-bg: rgba(var(--bs-info-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-info-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-info-rgb);

	--bs-btn-active-color: var(--bs-info-950);
	--bs-btn-active-bg: rgba(var(--bs-info-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-info-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-info-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-info-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-info-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-warning {
	--bs-btn-color: var(--bs-warning-700);
	--bs-btn-bg: var(--bs-warning-50);
	--bs-btn-border-color: var(--bs-warning-100);

	--bs-btn-hover-color: var(--bs-warning-950);
	--bs-btn-hover-bg: rgba(var(--bs-warning-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-warning-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);

	--bs-btn-active-color: var(--bs-warning-950);
	--bs-btn-active-bg: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-warning-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-warning-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-warning-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-danger {
	--bs-btn-color: var(--bs-danger-700);
	--bs-btn-bg: var(--bs-danger-50);
	--bs-btn-border-color: var(--bs-danger-100);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-danger-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-danger-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-danger-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-danger-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-danger-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-danger-50-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-danger-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-light {
	--bs-btn-color: var(--bs-gray-700);
	--bs-btn-bg: var(--bs-white);
	--bs-btn-border-color: var(--bs-gray-100);

	--bs-btn-hover-color: var(--bs-gray-900);
	--bs-btn-hover-bg: rgba(var(--bs-gray-50-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-gray-50-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-gray-400-rgb);

	--bs-btn-active-color: var(--bs-gray-900);
	--bs-btn-active-bg: rgba(var(--bs-gray-50-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-gray-50-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-gray-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-white-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-gray-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-outline-dark {
	--bs-btn-color: var(--bs-gray-950);
	--bs-btn-bg: var(--bs-gray-100);
	--bs-btn-border-color: var(--bs-gray-300);

	--bs-btn-hover-color: var(--bs-white);
	--bs-btn-hover-bg: rgba(var(--bs-gray-800-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-hover-border-color: rgba(var(--bs-gray-800-rgb), var(--btn-hover-bg-rgba-opacity));
	--bs-btn-focus-shadow-rgb: var(--bs-gray-800-rgb);

	--bs-btn-active-color: var(--bs-white);
	--bs-btn-active-bg: rgba(var(--bs-gray-800-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-gray-800-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-gray-950-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-gray-100-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-btn-disabled-border-color: rgba(var(--bs-gray-300-rgb), var(--btn-disabled-bg-rgba-opacity));
	--bs-gradient: none;
}

.btn-icon-gray {
	--bs-btn-color: var(--bs-info-700);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;

	--bs-btn-hover-color: var(--bs-info-950);
	--bs-btn-hover-bg: rgba(var(--bs-info-rgb), 0);
	--bs-btn-hover-border-color: rgba(var(--bs-info-rgb), 0);
	--bs-btn-focus-shadow-rgb: var(--bs-info-rgb);

	--bs-btn-active-color: var(--bs-info-900);
	--bs-btn-active-bg: rgba(var(--bs-info-rgb), 0);
	--bs-btn-active-border-color: rgba(var(--bs-info-rgb), 0);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-info-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-info-50-rgb), 0);
	--bs-btn-disabled-border-color: rgba(var(--bs-info-100-rgb), 0);
	--bs-gradient: none;
}

.btn-icon-warning {
	--bs-btn-color: var(--bs-warning-700);
	/*--bs-btn-bg: rgba(var(--bs-warning-100-rgb), 1);*/
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;

	--bs-btn-hover-color: var(--bs-warning-950);
	--bs-btn-hover-bg: rgba(var(--bs-warning-rgb), 0);
	--bs-btn-hover-border-color: rgba(var(--bs-warning-rgb), 0);
	--bs-btn-focus-shadow-rgb: var(--bs-warning-rgb);

	--bs-btn-active-color: var(--bs-warning-900);
	--bs-btn-active-bg: rgba(var(--bs-warning-rgb), 0);
	--bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 0);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-warning-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-warning-50-rgb), 0);
	--bs-btn-disabled-border-color: rgba(var(--bs-warning-100-rgb), 0);
	--bs-gradient: none;
}

.btn-icon-warning-bg {
	--bs-btn-color: var(--bs-warning-900);
	--bs-btn-bg: rgba(var(--bs-warning-100-rgb), 1);
	--bs-btn-border-color: rgba(var(--bs-warning-200-rgb), 1);

	--bs-btn-hover-color: var(--bs-warning-950);
	--bs-btn-hover-bg: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-hover-border-color: rgba(var(--bs-warning-600-rgb), 1);
	--bs-btn-focus-shadow-rgb: var(--bs-warning-900-rgb);

	--bs-btn-active-color: var(--bs-warning-950);
	--bs-btn-active-bg: rgba(var(--bs-warning-400-rgb), 1);
	--bs-btn-active-border-color: rgba(var(--bs-warning-rgb), 1);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

	--bs-btn-disabled-color: rgba(var(--bs-warning-900-rgb), var(--btn-disabled-color-rgba-opacity));
	--bs-btn-disabled-bg: rgba(var(--bs-warning-50-rgb), 0);
	--bs-btn-disabled-border-color: rgba(var(--bs-warning-100-rgb), 0);
	--bs-gradient: none;
}

.btn-link {
	--bs-btn-font-weight: 400;
	--bs-btn-color: var(--bs-link-color);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: var(--bs-link-hover-color);
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: var(--bs-link-hover-color);
	--bs-btn-active-border-color: transparent;
	--bs-btn-disabled-color: var(--bs-secondary);
	--bs-btn-disabled-border-color: transparent;
	--bs-btn-box-shadow: 0 0 0 var(--bs-black);
	--bs-btn-box-shadow-hover: 0 0 0 var(--bs-black);
	--bs-btn-box-shadow-active: 0 0 0 var(--bs-black);
	--bs-btn-focus-shadow-rgb: var(--bs-link-color-rgb);
	text-decoration: underline;
}

.btn-link:focus-visible {
	color: var(--bs-btn-color);
}
.btn-link:hover,
.btn-link:active {
	color: var(--bs-btn-hover-color);
	transform: var(--btn-translateY-active);
}

/* -------------------------------------------
	btn-lg
------------------------------------------- */
.btn-lg, .btn-group-lg > .btn {
	/*--bs-btn-padding-y: 0.5rem;*/
	--bs-btn-padding-x: 1.375rem;
	/*--bs-btn-font-size: 1.25rem;*/
	/*--bs-btn-border-radius: var(--bs-border-radius-lg);*/
}

/* -------------------------------------------
	btn-sm
------------------------------------------- */
.btn-sm, .btn-group-sm > .btn {
	--bs-btn-padding-y: var(--space-2xs);
	/* --bs-btn-padding-x: 0.625rem; */
	--bs-btn-padding-x: var(--space-sm);
	/*--bs-btn-font-size: 0.875rem;*/
	/*--bs-btn-border-radius: var(--bs-border-radius-sm);*/
}

/* -------------------------------------------
	btn-square
------------------------------------------- */
.btn-square {
	--btn-square-size: 2.375rem;

	width: var(--btn-square-size);
	height: var(--btn-square-size);
	padding: var(--bs-btn-padding-y);
}
.btn-square.btn-lg {
	--btn-square-size: 3rem;
}
.btn-square.btn-sm {
	--btn-square-size: 1.875rem;
}
.btn-square.btn-smlr {
	--btn-square-size: 1.25rem;
	/*--bs-btn-font-size: 0.898em;*/
	--bs-btn-font-size: 0.688rem;
	--bs-btn-line-height: 1 !important;
	--bs-btn-padding-y: 0.125rem;
}
.btn-square input {
	margin-top: 0;
}

/* -------------------------------------------
	btn has-spinner
------------------------------------------- */
.btn.has-spinner [aria-hidden=true] {
	display: none;
	opacity: 0;
	transition: opacity var(--transition-options-25);
}
.btn.has-spinner:disabled [aria-hidden=true] {
	display: inline-block;
	opacity: 1;
}
.btn.has-spinner [role=status] {
	opacity: 1;
	transition: opacity var(--transition-options-25);
}
.btn.has-spinner:disabled [role=status] {
	display: none;
	opacity: 0;
}

/* -------------------------------------------
	btn-close
------------------------------------------- */
.btn-close {
	--bs-btn-close-bg: var(--icon-xmark);
	transition: all var(--transition-options-25);
}



/* ----------------------------------------
	dropdown-toggle
---------------------------------------- */
.navbar .dropdown-toggle {}
.navbar .dropdown-toggle::after {
	--dropdown-icon-size-toggle: 8px;
	--dropdown-icon-bg-image-toggle: var(--icon-chevron-right);

	vertical-align: 0.063em;
	/*vertical-align: 0.125em;*/
	/*margin-left: 0.255em;*/
	border: 0;

	width: var(--dropdown-icon-size-toggle);
	height: var(--dropdown-icon-size-toggle);
	flex: 0 0 auto;
	background-image: var(--dropdown-icon-bg-image-toggle);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	transition: transform var(--transition-options-35);
	transform: rotate(90deg);
	transform-origin: 50% 50%;
}
.navbar .dropdown-toggle[aria-expanded="true"]::after {
	transform: rotate(270deg);
}
.navbar .dropdown-toggle .badge {
	/*transform: translateY(-1px);*/
}

.caret-off::after {
	display: none !important;
}

/* ----------------------------------------
	animation item show
---------------------------------------- */
:root {
	/*
	cubic-bezier(0.470, 0.000, 0.745, 0.715)
	cubic-bezier(0.550, 0.085, 0.680, 0.530)
	ease-in-out
	*/
	--animation-item-value-show: both 0.15s ease-in-out;
	--animation-item-value-hide: both 0.25s ease-in-out;
	--animation-item-show: itemShow var(--animation-item-value-show);
	--animation-item-hide: itemHide var(--animation-item-value-hide);

	/*animation: var(--animation-item-show);*/
	/*animation: var(--animation-item-hide);*/
}

@keyframes itemShow {
	from {
		opacity: 0;
		transform: scale(0.8) translateY(-20px);
	}
	50% {
		transform: scale(0.9) translateY(4px);
	}
	to {
		display: block;
		opacity: 1;
		transform: scale(1) translateY(4px);
	}
}
@keyframes itemHide {
	from {
		display: block;
		opacity: 1;
		top: 100%;
		transform: scale(1) translateY(4px);
	}
	50% {
		transform: scale(0.9) translateY(4px);
	}
	to {
		opacity: 0;
		top: 100%;
		transform: scale(0.8) translateY(-20px);
	}
}

/* ----------------------------------------
	dropdown-menu
---------------------------------------- */
.dropdown-menu {
	--bs-dropdown-padding-x: 0;
	--bs-dropdown-padding-y: var(--space-sm);
	--bs-dropdown-spacer: 0.125rem;
	/*--bs-dropdown-font-size: 1rem;*/
	/*--bs-dropdown-font-size: inherit;*/
	/*--bs-dropdown-color: var(--bs-body-color);*/
	--bs-dropdown-bg: var(--glass-bg);
	/* Контур стекла — штатным border'ом, 1px. Было: 3px при альфе .05, т.е.
	   контур НЕвидимый (замер: контраст к телу меню 1.03 на цветной подложке) —
	   по факту распорка, раздвигавшая геометрию на 5.5px, пока контур рисовали
	   двумя слоями тени поверх и под ним. Теперь контур один и настоящий. */
	--bs-dropdown-border-color: var(--glass-edge);
	--bs-dropdown-border-width: 1px;
	--bs-dropdown-border-radius: var(--bs-border-radius-xl);
	/* --bs-dropdown-inner-border-radius не задаём: Bootstrap 5.3 объявляет эту
	   переменную, но НИГДЕ её не читает (пункты меню скругляет наш
	   --bs-dropdown-item-border-radius ниже). Строка была дублем дефолта BS —
	   выглядела рабочей и вводила в заблуждение. Проверено 2026-07-16. */
	--bs-dropdown-divider-bg: var(--bs-border-color);
	/*--bs-dropdown-divider-margin-y: 0.5rem;*/
	/* Стекло = 5 бликов (контур, внутреннее свечение, верхняя и нижняя грани,
	   внешний ободок) + тень высоты последним слоем. Блики — намеренный эффект,
	   не трогаем; на лестницу переведена только ТЕНЬ: было -lg (= --shadow-modal,
	   высота диалога) при роли меню = overlay. Ступень вернули своей роли —
	   дефолт BS для дропдауна тоже overlay. */
	/* Толщина стекла (роль) + тень высоты overlay (лестница). Из старого
	   рецепта ушли 2 слоя-контура: inset 1px и внешний ободок 1px — они
	   дублировали border и давали двойную линию с зазором. */
	--bs-dropdown-box-shadow: var(--glass-highlight), var(--bs-box-shadow);
	/* Роль, не примитив: gray-700 на стекле над градиентом hero давал контраст
	   2.74 при норме 4.5 (замер 2026-07-16). В dark здесь уже стояла роль —
	   light отставал. Симметрия тем + читаемость без потери прозрачности. */
	--bs-dropdown-link-color: var(--bs-body-color);
	/* Ховер текста — на РОЛЬ ссылки, а не на примитив blue-500. Пункт дропдауна и
	   есть ссылка (a.dropdown-item), значит роль ховера ссылки ему и положена.
	   Примитив давал ТОТ САМЫЙ провал ступени 500, который [[color-system-lens-audit]]
	   нашёл в 2026-07-08 и вылечил в ссылках (500→600) — до дропдауна тогда не дошли:
	   замер на подсветке 3.36 light / 2.97 dark при норме 4.5. Примитив вдобавок не
	   переключается по теме, оттого провал в ОБЕИХ. Роль (700 light / 300 dark) даёт
	   6.16 / 5.42. Подложка hover-bg остаётся полупрозрачной (1.06 в обеих темах
	   одинаково — прозрачный цвет адаптируется сам). */
	--bs-dropdown-link-hover-color: var(--bs-link-hover-color);
	/* Подсветка — на РОЛЬ бренда (было rgba(--bs-blue-500-rgb) — примитив-ступень).
	   Значение то же (обе = 59,130,246), меняется только ИМЯ: подложка перестаёт
	   зависеть от того, какая ступень окажется «синей» при следующей правке палитры.
	   Плотность .05 не трогаем — замер: 1.06 в обеих темах (прозрачный цвет
	   адаптируется просветом), ховер читается. */
	--bs-dropdown-link-hover-bg: rgba(var(--bs-primary-rgb), .05);
	--bs-dropdown-link-active-color: var(--bs-white);
	--bs-dropdown-link-active-bg: var(--bs-blue-400);
	--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
	--bs-dropdown-item-padding-x: 0.625rem;
	--bs-dropdown-item-padding-y: var(--space-2xs);
	--bs-dropdown-item-margin-x: var(--space-sm);
	--bs-dropdown-item-border-radius: calc(var(--bs-dropdown-border-radius) - 0.5rem);
	--bs-dropdown-header-color: var(--bs-secondary);
	--bs-dropdown-header-padding-x: var(--space-md);
	--bs-dropdown-header-padding-y: var(--space-xs);

	--dropdown-item-icon-size: 24px;

	padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
	background-color: var(--bs-dropdown-bg);

	box-shadow: var(--bs-dropdown-box-shadow);

	animation: var(--animation-item-hide);

	/*transform: scale(0.95) translateY(-5px);*/
	/*transition: transform var(--transition-options-25);*/

	corner-shape: superellipse(var(--corner-shape));

	-webkit-backdrop-filter: var(--glass-blur);
	backdrop-filter: var(--glass-blur);
}
.dropdown-menu.show {
	animation: var(--animation-item-show);
}

@media (min-width: 1200px) {
	.navbar .dropdown-menu-xl-end {
		/*top: 100%;*/
		left: auto;
		right: 0 !important;
		/*position: absolute;*/
		margin-top: 7px !important;
	}
}

@media (max-width: 1199.98px) {
	.navbar .dropdown-menu {
		width: 100%;
		/*top: 100%;*/
		left: 0;
		position: absolute;
	}
}

/* ----------------------------------------
	dropdown-header
---------------------------------------- */
.dropdown-header {
	display: block;
	font-size: 0.875rem;
	color: var(--bs-dropdown-header-color);
	white-space: nowrap;
	padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);
	margin-bottom: 0;
}

/* ----------------------------------------
	dropdown-item
---------------------------------------- */
.dropdown-item,
.navbar-text .dropdown-item {
	width: calc(100% - (var(--bs-dropdown-item-margin-x) * 2));
	display: flex;
	align-items: center;
	color: var(--bs-dropdown-link-color);
	/*font-size: 0.875rem;*/
	/*line-height: 1;*/
	padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
	margin-left: var(--bs-dropdown-item-margin-x);
	margin-right: var(--bs-dropdown-item-margin-x);
	background-color: transparent;
	/*background-color: rgba(var(--bs-blue-500-rgb), .15);*/
	border-radius: var(--bs-dropdown-item-border-radius, 0);
	corner-shape: superellipse(var(--corner-shape));
	transition: color var(--transition-options-15), background-color var(--transition-options-15);

	backface-visibility: hidden;
}
.dropdown-item:has(> i) {
	line-height: 1;
}
.dropdown-item:hover, .dropdown-item:focus,
.navbar-text .dropdown-item:hover, .navbar-text .dropdown-item:focus {
	color: var(--bs-dropdown-link-hover-color);
	background-color: var(--bs-dropdown-link-hover-bg);
}
.dropdown-item.active, .dropdown-item:active {
	color: var(--bs-dropdown-link-active-color);
	background-color: var(--bs-dropdown-link-active-bg);
}
.dropdown-item.disabled, .dropdown-item:disabled {
	color: var(--bs-dropdown-link-disabled-color);
	background-color: transparent;
}

/* ----------------------------------------
	dropdown-item icon
---------------------------------------- */
.dropdown-item > i {
	width: var(--dropdown-item-icon-size);
	height: var(--dropdown-item-icon-size);
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 1px;
	margin-left: calc((var(--bs-dropdown-item-padding-x) * -1) + var(--bs-dropdown-item-padding-y));
	margin-right: var(--space-2xs);
	background-color: transparent;
	/*background-color: rgba(var(--bs-blue-500-rgb), 0.1);*/
	border-radius: calc(var(--bs-dropdown-item-border-radius) - 2px);
	corner-shape: superellipse(var(--corner-shape));
}

/* ----------------------------------------
	dropdown-item-text
---------------------------------------- */
.dropdown-item-text {
	display: block;
	color: var(--bs-dropdown-link-color);
	padding: var(--bs-dropdown-item-padding-y);
	margin-left: var(--bs-dropdown-item-margin-x);
	margin-right: var(--bs-dropdown-item-margin-x);
}

/* -------------------------------------------
	navbar-nav-2row
------------------------------------------- */
.navbar-nav-2row {
	display: flex;
	justify-content: space-between;
}
.navbar-nav-2row > li {
	display: flex;
	align-items: center;
	/*padding-bottom: 0;*/
}

.navbar-nav-2row-item:last-child {
	display: flex;
	align-items: center;
	justify-content: center;

	-moz-column-gap: 0.25rem;
	column-gap: var(--space-2xs);
}

.navbar-nav-2row .dropdown-toggle::after {
	vertical-align: 0.063em;
	/*vertical-align: 0.125em;*/
}

@media (min-width: 1200px) {
	.navbar-nav-2row > li {
		min-height: var(--navbar-h);
		flex-direction: column;
		justify-content: center;
		padding-top: 0;
	}

	.navbar-nav-2row-item:first-child {
		font-size: 0.875em;
	}

	.navbar-nav-2row .dropdown-menu-xl-end {
		margin-top: 0 !important;
	}
}

@media (max-width: 1199.98px) {
	.navbar-nav-2row-item:last-child {
		margin-left: auto;
	}

	/*.navbar-nav-2row.navbar-nav .dropdown-menu {
		width: 100%;
		top: 100%;
		left: 0;
		position: absolute;
	}*/
}



/* -------------------------------------------
	card
------------------------------------------- */
.card {
	--bs-card-border-width: 0;
	--bs-card-border-radius: var(--bs-border-radius-xl);
	/* Карточка приподнята над поверхностью — уровень raised лестницы теней.
	   Был свой рецепт на gray-600 вне лестницы (бледнил и не совпадал по
	   характеру с остальной темой). */
	--bs-card-box-shadow: var(--shadow-raised);
	/* Внутренний радиус (его читает BS для card-img-top и родни) — считать от
	   СВОИХ переменных карточки, а не от глобальных: рамка у нас 0, значит
	   inner = outer. Было calc(xl - --bs-border-width) = 27 при outer 28. */
	--bs-card-inner-border-radius: calc(var(--bs-card-border-radius) - (var(--bs-card-border-width)));
	--bs-card-cap-bg: rgba(var(--bs-gray-700-rgb), 0.04);

	corner-shape: superellipse(var(--corner-shape));
	box-shadow: var(--bs-card-box-shadow);
}
.card-header:first-child {
	box-shadow: inset 0 1px 0 0 rgba(var(--bs-gray-700-rgb), 0.02), inset 0 2px 6px 0 rgba(var(--bs-gray-700-rgb), 0.02);
}



/* -------------------------------------------
	breadcrumb
------------------------------------------- */
/* Разметка крошек приходит из ядра DLE ({speedbar}) ПЛОСКОЙ строкой:
   ссылки + разделитель из настройки speedbar_separator. Элементов
   .breadcrumb-item здесь нет — компонент BS работает только как обёртка,
   поэтому его переменные разделителя (--bs-breadcrumb-divider) не задаются:
   рисовать нечем, их читает лишь .breadcrumb-item + .breadcrumb-item::before. */
.breadcrumb {
	--bs-breadcrumb-margin-bottom: 0;

	font-size: var(--text-meta);
	/* красит текстовые узлы = текущую страницу; ссылки несут свою роль сами */
	color: var(--bs-secondary-text-emphasis);
}
.breadcrumb-sep {
	color: var(--bs-secondary-color);
	padding: 0 0.25rem;
}



/* -------------------------------------------
	pagination
------------------------------------------- */
.pagination {
	--bs-pagination-active-bg: var(--bs-link-color);
	--bs-pagination-active-border-color: var(--bs-link-color);
}

.pagination-sm {
	--bs-pagination-padding-x: 0.625rem;
}


@media (max-width: 699.98px) {
	.page-link {
		margin: var(--space-2xs);
	}
	.page-item:not(:first-child) .page-link {
		margin-left: var(--space-2xs);
		border-radius: var(--bs-pagination-border-radius);
	}
	.page-item:first-child .page-link {
		border-radius: var(--bs-pagination-border-radius);
	}
}



/* -------------------------------------------
	badge
------------------------------------------- */
.badge {
	--bs-badge-padding-x: 0.75em;
	--bs-badge-padding-y: 0.5em;
	--bs-badge-font-size: 0.75em;
	/* 700 — признание факта: 600 было мёртвым (все 5 бейджей темы несли утилиту
	   fw-bold, а утилиты BS идут с !important и бьют переменную всегда). Примерка
	   600 vs 700 на живой шапке: на кегле 13.5px разница почти не читается →
	   держать два веса незачем, утилиты сняты с разметки. Узор [[radius-scale]]:
	   значения здоровые, врало объявление. */
	--bs-badge-font-weight: 700;
	/* xs — ступень бейджей. Было calc(база / 1.75) = 8px: делитель подобран
	   на глаз и жёстко привязывал бейдж к базовому радиусу кнопок. */
	--bs-badge-border-radius: var(--radius-xs);

	display: inline-flex;
	align-items: center;
	line-height: 1 !important;
	user-select: none;
	corner-shape: superellipse(var(--corner-shape));
}
.badge.border,
.badge[class*="-outline"] {
	--bs-badge-padding-x: calc(0.75em - var(--bs-border-width));
	--bs-badge-padding-y: calc(0.5em - var(--bs-border-width));
	/*--bs-badge-padding-y: calc(0.25em - var(--bs-border-width));*/
}
.badge.small {
	--bs-badge-font-size: 0.625em;
}

/* Носителем иконки бейджа стал <svg class="icon"> (свой набор, волна 4) —
   селектор по тегу `i` перестал бы находить его молча. Оставлен и `i`:
   FA ещё живёт в 5 постах БД (см. __wiki/decisions/icon-system.md). */
.badge i,
.badge .icon {
	margin-right: var(--space-2xs);
}

.sliding-menu-item .badge {
	--bs-badge-font-size: 0.625rem;
	--bs-badge-border-radius: var(--bs-border-radius-pill);
	--badge-size: 18px;
	/*--badge-size: 19px;*/

	min-width: var(--badge-size);
	height: var(--badge-size);
}

.table .badge[class*="-outline"],
.table .badge {
	--bs-badge-padding-x: 0.313rem;
	--bs-badge-padding-y: 0.063rem;
	--bs-badge-font-size: 0.625rem;

	height: 18px;
}
.table .badge {
	--bs-badge-padding-x: 0.375rem;
	--bs-badge-padding-y: 0.125rem;
}
.table .badge i {
	width: 9px;
	height: 14px;
	display: flex;
	align-items: center;
	/*justify-content: center;*/
	margin-right: 0.125rem;
}

@media (max-width: 1399.98px) {
	.table .badge[class*="-outline"],
	.table .badge {
		--bs-badge-padding-x: 0.188rem;
		--bs-badge-padding-y: 0.063rem;
		--bs-badge-font-size: 8px;
		--bs-badge-font-weight: 700;
		/* та же ступень xs, что у обычного бейджа: 6 < половины высоты (14px),
		   форма не плывёт. Было 0.313rem (5) — вне шкалы. */
		--bs-badge-border-radius: var(--radius-xs);

		height: 14px;
	}
	.table .badge {
		--bs-badge-padding-x: var(--space-2xs);
	}
	.table .badge[class*="-outline"] i {
		margin-top: 0.968px;
	}
}



/* -------------------------------------------
	alert
------------------------------------------- */
.alert {
	--bs-alert-padding-x: 1.375rem;
	--bs-alert-padding-y: var(--space-md);
	--bs-alert-margin-bottom: var(--space-lg);
	--bs-border-width: 2px;
	--bs-alert-border-radius: var(--bs-border-radius);

	--alert-font-size: 1rem;
	/*--alert-font-size: 1.125rem;*/

	font-size: var(--alert-font-size);
	font-weight: 500;
}

.alert-heading {
	color: inherit;
}

.alert-link {
	font-weight: 700;
	color: var(--bs-alert-link-color);
}

.alert-dismissible {
	padding-right: var(--space-2xl);
}
.alert-dismissible .btn-close {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	padding: var(--space-lg) var(--space-md);
}



/* -------------------------------------------
	modal-backdrop
------------------------------------------- */
.modal-backdrop {
	background-color: var(--backdrop-bg);
	--bs-backdrop-opacity: 1;

	-webkit-backdrop-filter: var(--backdrop-filter-blur-smlr);
	backdrop-filter: var(--backdrop-filter-blur-smlr);
}

/* -------------------------------------------
	modal
------------------------------------------- */
.modal {
	--bs-modal-border-width: 0;
	--bs-modal-border-radius: var(--bs-border-radius-xl);
	/* Диалог = верх лестницы. Было 3 слоя на secondary-800 — и переменную НИКТО
	   не читал: Bootstrap 5.3 сам тень к .modal-content не применяет (проверено:
	   0 читателей). Теперь её читает .modal-content ниже, как принято в BS.
	   Бонус: цвет тени переключается в dark сам (--box-shadow-color). */
	--bs-modal-box-shadow: var(--shadow-modal);
}

/* -------------------------------------------
	modal-content
------------------------------------------- */
/* Читаем свою переменную (см. .modal выше) — так задумано в BS, но сам он этого
   не делает. Было 6 слоёв на blue-800 прямым правилом: мимо лестницы и БЕЗ
   адаптации к dark (тень оставалась синей, тогда как лестница там уходит в black). */
.modal-content {
	box-shadow: var(--bs-modal-box-shadow);
}
.modal-dialog-scrollable .modal-content {
	/*overflow: hidden;*/
	overflow: visible;
}

/* -------------------------------------------
	modal-header
------------------------------------------- */
.modal-header {
	justify-content: center;
	position: relative;
}

/* -------------------------------------------
	modal-header btn-close
------------------------------------------- */
.modal-header .btn-close {
	--bs-btn-close-bg: var(--icon-xmark-light);

	--btn-close-size: 1.5rem;
	--btn-close-size-sm: 1rem;
	--btn-close-translate: translate(150%, 50%);
	--btn-close-translate-inside: translate(-50%, 50%);
	--btn-close-rotate: rotateZ(180deg);
	--btn-close-filter: invert(1) grayscale(100%) brightness(200%);

	width: var(--btn-close-size);
	height: var(--btn-close-size);
	top: 0;
	right: 0;
	position: absolute;
	z-index: 2;
	padding: 0;
	margin: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	transform: var(--btn-close-translate);
	transition: all var(--transition-options-25);
	border-radius: 0;
}
.modal-header .btn-close:hover {
	transform: var(--btn-close-translate) var(--btn-close-rotate);
}

@media (max-width: 575.98px) {
	.modal-header .btn-close,
	.modal-fullscreen-sm-down .modal-header .btn-close {
		--btn-close-size: var(--btn-close-size-sm);

		filter: var(--btn-close-filter);
		transform: var(--btn-close-translate-inside);

		display: none;
	}
}
@media (max-width: 767.98px) {
	.modal-fullscreen-md-down .modal-header .btn-close {
		--btn-close-size: var(--btn-close-size-sm);

		filter: var(--btn-close-filter);
		transform: var(--btn-close-translate-inside);

		display: none;
	}
}
@media (max-width: 991.98px) {
	.modal-fullscreen-lg-down .modal-header .btn-close {
		--btn-close-size: var(--btn-close-size-sm);

		filter: var(--btn-close-filter);
		transform: var(--btn-close-translate-inside);

		display: none;
	}
}
@media (max-width: 1199.98px) {
	.modal-fullscreen-xl-down .modal-header .btn-close {
		--btn-close-size: var(--btn-close-size-sm);

		filter: var(--btn-close-filter);
		transform: var(--btn-close-translate-inside);

		display: none;
	}
}
@media (max-width: 1399.98px) {
	.modal-fullscreen-xxl-down .modal-header .btn-close {
		--btn-close-size: var(--btn-close-size-sm);

		filter: var(--btn-close-filter);
		transform: var(--btn-close-translate-inside);

		display: none;
	}
}

/* -------------------------------------------
	modal-title
------------------------------------------- */
/* Вес 300 — намеренно: лёгкий заголовок диалога (решение владельца, 2026-07-16),
   единственное отклонение от «заголовки = 700». Кегль был написан числом
   1.25rem — это ровно ступень --text-h4, имя из шкалы вместо совпадения. */
.modal-title {
	font-size: var(--text-h4);   /* 20px */
	font-weight: 300;
	text-align: center;
}



/* -------------------------------------------
	offcanvas-backdrop
------------------------------------------- */
.offcanvas-backdrop {
	background-color: var(--backdrop-bg);
	-webkit-backdrop-filter: var(--backdrop-filter-blur-smlr);
	backdrop-filter: var(--backdrop-filter-blur-smlr);
}
.offcanvas-backdrop.show {
	opacity: 1;
}



/* -------------------------------------------
	tooltip
------------------------------------------- */
.tooltip {
	--bs-tooltip-padding-x: 0.688rem;
	--bs-tooltip-color: var(--bs-white);
	--bs-tooltip-bg: rgba(var(--bs-gray-900-rgb), 0.9);
	/*--bs-tooltip-opacity: 0.95;*/
	--bs-tooltip-opacity: 1;
}
.tooltip-inner {
	--backdrop-filter-blur-smlr: saturate(180%) blur(2px);

	-webkit-backdrop-filter: var(--backdrop-filter-blur-smlr);
	backdrop-filter: var(--backdrop-filter-blur-smlr);
}



/* -------------------------------------------
	bd-callout

	Цитаты (.quote / .title_quote) ОТЦЕПЛЕНЫ отсюда 2026-07-16. Они попадали
	под `background: var(--bd-callout-bg, var(--bs-gray-100))`, но эту переменную
	задаёт только вариант врезки (.bd-callout-info и т.п.) — цитате её задать
	некому, и она падала на фолбэк gray-100. Это СВЕТЛЫЙ примитив в любой теме,
	а текст оставался светлым (color: inherit) → в dark цитата = белым по белому.
	Побочно расходились два способа написать цитату: <blockquote> в селектор не
	входил и рендерился верно (engine.css), а BB-цитата DLE (div.quote) ломалась.
	Теперь оба оформляет один источник — engine.css, правило `.quote, blockquote`.
------------------------------------------- */
.bd-callout {
	--bd-callout-link: 10, 88, 202;
	--bd-callout-code-color: #ab296a;
	--bs-link-color-rgb: var(--bd-callout-link);
	--bs-link-hover-color-rgb: var(--bd-callout-link);
	--bs-code-color: var(--bd-callout-code-color);
	--bs-callout-border-w: 0.25rem;
	--bs-callout-border-radius: var(--bs-border-radius-lg);

	color: var(--bd-callout-color, inherit);
	position: relative;
	overflow: hidden;
	padding: var(--space-lg) var(--space-lg) var(--space-lg) calc( var(--space-lg) + var(--bs-callout-border-w));
	margin-top: var(--space-lg);
	margin-bottom: var(--space-lg);
	background-color: var(--bd-callout-bg, var(--bs-gray-100));
	/*border-left: var(--bs-callout-border-w) solid var(--bd-callout-border, var(--bs-gray-300))*/
	border-radius: var(--bs-callout-border-radius);
	corner-shape: superellipse(var(--corner-shape));
}

.bd-callout::before {
	--bs-callout-border-c-1: var(--bs-gray);
	--bs-callout-border-c-2: var(--bs-gray-200);
	--bs-callout-border-bg: repeating-linear-gradient(-45deg, var(--bs-callout-border-c-1) 0px, var(--bs-callout-border-c-1) 5px, var(--bs-callout-border-c-2) 5px, var(--bs-callout-border-c-2) 10px);

	content: "";
	width: var(--bs-callout-border-w);
	top: 0;
	left: 0;
	bottom: 0;
	position: absolute;
	z-index: 2;
	background: var(--bs-callout-border-bg);
	border-radius: var(--bs-callout-border-radius);
	corner-shape: superellipse(var(--corner-shape));
}

.bd-callout h4 {
	margin-bottom: .25rem
}

.bd-callout > :last-child {
	margin-bottom: 0
}

.bd-callout + .bd-callout {
	margin-top: -.25rem
}

.bd-callout ol,
.bd-callout ul {
	padding-left: var(--space-md);
}
.bd-callout ol li,
.bd-callout ul li {
	margin-top: var(--space-xs);
}
.bd-callout ol li:first-child,
.bd-callout ul li:first-child {
	margin-top: 0;
}

.bd-callout .highlight {
	background-color: rgba(0, 0, 0, 0.05)
}

.bd-callout-primary {
	--bd-callout-link: var(--bs-primary-800-rgb);
	--bd-callout-color: var(--bs-primary-text-emphasis);
	--bd-callout-bg: var(--bs-primary-bg-subtle);
	--bd-callout-border: var(--bs-primary-border-subtle)
}
.bd-callout-primary::before {
	--bs-callout-border-c-1: var(--bs-primary);
	--bs-callout-border-c-2: var(--bs-primary-200);
}

.bd-callout-secondary {
	--bd-callout-link: var(--bs-secondary-800-rgb);
	--bd-callout-color: var(--bs-secondary-text-emphasis);
	--bd-callout-bg: var(--bs-secondary-bg-subtle);
	--bd-callout-border: var(--bs-secondary-border-subtle)
}
.bd-callout-secondary::before {
	--bs-callout-border-c-1: var(--bs-secondary);
	--bs-callout-border-c-2: var(--bs-secondary-200);
}

.bd-callout-success {
	--bd-callout-link: var(--bs-success-800-rgb);
	--bd-callout-color: var(--bs-success-text-emphasis);
	--bd-callout-bg: var(--bs-success-bg-subtle);
	--bd-callout-border: var(--bs-success-border-subtle)
}
.bd-callout-success::before {
	--bs-callout-border-c-1: var(--bs-success);
	--bs-callout-border-c-2: var(--bs-success-200);
}

.bd-callout-info {
	--bd-callout-link: var(--bs-info-text-emphasis-rgb);
	--bd-callout-color: var(--bs-info-text-emphasis);
	--bd-callout-bg: var(--bs-info-bg-subtle);
	--bd-callout-border: var(--bs-info-border-subtle)
}
.bd-callout-info::before {
	--bs-callout-border-c-1: var(--bs-info);
	--bs-callout-border-c-2: var(--bs-info-200);
}

.bd-callout-warning {
	--bd-callout-link: var(--bs-warning-800-rgb);
	--bd-callout-color: var(--bs-warning-text-emphasis);
	--bd-callout-bg: var(--bs-warning-bg-subtle);
	--bd-callout-border: var(--bs-warning-border-subtle)
}
.bd-callout-warning::before {
	--bs-callout-border-c-1: var(--bs-warning);
	--bs-callout-border-c-2: var(--bs-warning-200);
}

.bd-callout-danger {
	--bd-callout-link: var(--bs-danger-800-rgb);
	--bd-callout-color: var(--bs-danger-text-emphasis);
	--bd-callout-bg: var(--bs-danger-bg-subtle);
	--bd-callout-border: var(--bs-danger-border-subtle)
}
.bd-callout-danger::before {
	--bs-callout-border-c-1: var(--bs-danger);
	--bs-callout-border-c-2: var(--bs-danger-200);
}

/* -------------------------------------------
	accordion-body
------------------------------------------- */
.accordion-body p:last-child {
	margin-bottom: 0;
}

/* -------------------------------------------
	mark
------------------------------------------- */
.mark, mark {
	padding: .1875em .5rem;
	color: var(--bs-highlight-color);
	background-color:var(--bs-highlight-bg);
	border-radius: var(--bs-border-radius-smr);
	corner-shape: superellipse(var(--corner-shape));
}

/* -------------------------------------------
	text-primary-*
------------------------------------------- */
.text-primary-50 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-50-rgb),var(--bs-text-opacity))!important;
}
.text-primary-100 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-100-rgb),var(--bs-text-opacity))!important;
}
.text-primary-200 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-200-rgb),var(--bs-text-opacity))!important;
}
.text-primary-300 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-300-rgb),var(--bs-text-opacity))!important;
}
.text-primary-400 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-400-rgb),var(--bs-text-opacity))!important;
}
.text-primary-600 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-600-rgb),var(--bs-text-opacity))!important;
}
.text-primary-700 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-700-rgb),var(--bs-text-opacity))!important;
}
.text-primary-800 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-800-rgb),var(--bs-text-opacity))!important;
}
.text-primary-900 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-900-rgb),var(--bs-text-opacity))!important;
}
.text-primary-950 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-950-rgb),var(--bs-text-opacity))!important;
}

.text-secondary-50 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-50-rgb),var(--bs-text-opacity))!important
}
.text-secondary-100 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-100-rgb),var(--bs-text-opacity))!important
}
.text-secondary-200 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-200-rgb),var(--bs-text-opacity))!important
}
.text-secondary-300 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-300-rgb),var(--bs-text-opacity))!important
}
.text-secondary-400 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-400-rgb),var(--bs-text-opacity))!important
}
.text-secondary-600 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-600-rgb),var(--bs-text-opacity))!important
}
.text-secondary-700 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-700-rgb),var(--bs-text-opacity))!important
}
.text-secondary-800 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-800-rgb),var(--bs-text-opacity))!important
}
.text-secondary-900 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-900-rgb),var(--bs-text-opacity))!important
}
.text-secondary-950 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-950-rgb),var(--bs-text-opacity))!important
}


.text-success-50 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-50-rgb),var(--bs-text-opacity))!important
}
.text-success-100 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-100-rgb),var(--bs-text-opacity))!important
}
.text-success-200 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-200-rgb),var(--bs-text-opacity))!important
}
.text-success-300 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-300-rgb),var(--bs-text-opacity))!important
}
.text-success-400 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-400-rgb),var(--bs-text-opacity))!important
}
.text-success-600 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-600-rgb),var(--bs-text-opacity))!important
}
.text-success-700 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-700-rgb),var(--bs-text-opacity))!important
}
.text-success-800 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-800-rgb),var(--bs-text-opacity))!important
}
.text-success-900 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-900-rgb),var(--bs-text-opacity))!important
}
.text-success-950 {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-success-950-rgb),var(--bs-text-opacity))!important
}


.text-info {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-info-rgb),var(--bs-text-opacity))!important
}

.text-warning {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important
}

.text-danger {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-danger-rgb),var(--bs-text-opacity))!important
}

/* -------------------------------------------
	text-bg-*
------------------------------------------- */
.text-bg-primary {
	color: var(--bs-white) !important;
	background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-secondary {
	color: var(--bs-white) !important;
	background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-success {
	color: var(--bs-white) !important;
	background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-info {
	color: var(--bs-info-950) !important;
	background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-warning {
	color: var(--bs-warning-950) !important;
	background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-danger {
	color: var(--bs-white) !important;
	background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-light {
	color: var(--bs-gray-800) !important;
	background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-dark {
	color: var(--bs-white) !important;
	background-color: RGBA(var(--bs-gray-800-rgb), var(--bs-bg-opacity, 1)) !important;
}

/* -------------------------------------------
	text-bg-*-outline
------------------------------------------- */
.text-bg-primary-outline {
	color: var(--bs-primary-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-primary-border-subtle) !important;
	background-color: var(--bs-primary-bg-subtle) !important;
}

.text-bg-secondary-outline {
	color: var(--bs-secondary-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-secondary-border-subtle) !important;
	background-color: var(--bs-secondary-bg-subtle) !important;
}

.text-bg-success-outline {
	color: var(--bs-success-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-success-border-subtle) !important;
	background-color: var(--bs-success-bg-subtle) !important;
}

.text-bg-info-outline {
	color: var(--bs-info-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-info-border-subtle) !important;
	background-color: var(--bs-info-bg-subtle) !important;
}

.text-bg-warning-outline {
	color: var(--bs-warning-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-warning-border-subtle) !important;
	background-color: var(--bs-warning-bg-subtle) !important;
}

.text-bg-danger-outline {
	color: var(--bs-danger-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-danger-border-subtle) !important;
	background-color: var(--bs-danger-bg-subtle) !important;
}

.text-bg-light-outline {
	color: var(--bs-light-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-light-border-subtle) !important;
	background-color: var(--bs-light-bg-subtle) !important;
}

.text-bg-dark-outline {
	color: var(--bs-dark-text-emphasis) !important;
	border: var(--bs-border-width) var(--bs-border-style) var(--bs-dark-border-subtle) !important;
	background-color: var(--bs-dark-bg-subtle) !important;
}

/* =========================================================================
	ТЁМНАЯ ТЕМА — доводка компонентов (этап 5).
	Компоненты со светлой схемой (белый фон, тёмный текст, «стеклянные» тени),
	которые НЕ переключаются через семантику — переопределяем их наборы
	переменных под dark. Карта: __wiki/decisions/color-system-dark.md
	========================================================================= */

/* Таблицы: базовая .table висела на white-фоне (--bs-table-bg) + тёмном тексте
   (gray-900) + тёмном thead (info-950) + светлом hover-фоне. */
[data-bs-theme="dark"] .table {
	--bs-table-color: var(--bs-body-color);
	--bs-table-bg: transparent;
	--bs-table-color-thead: var(--bs-emphasis-color);
	--bs-table-border-color: var(--bs-border-color);
	--bs-table-striped-color: var(--bs-body-color);
	--bs-table-striped-bg: rgba(var(--bs-white-rgb), .04);
	--bs-table-active-color: var(--bs-emphasis-color);
	--bs-table-active-bg: rgba(var(--bs-white-rgb), .07);
	--bs-table-hover-color: var(--bs-emphasis-color);
	--bs-table-hover-bg: rgba(var(--bs-white-rgb), .06);
}
/* Цветные варианты (.table-secondary/-primary/-danger/-light) — светлые схемы,
   в образце не используются; причёсывать под палитру по надобности. */

/* Dropdown в dark: СВОЕГО блока больше нет — вся адаптация приезжает ролями.
   Меню читает --glass-bg / --glass-edge / --glass-highlight / --bs-body-color,
   а их dark-значения объявлены один раз в карте темы (root.css). Прежде здесь
   лежали 4 переопределения (фон .9, контур, цвет пункта, тень без бликов):
   рецепт дублировал светлый и глушил стекло — фон .9 почти непрозрачен, грани
   сняты (2026-07-09, белые блики α .5–.8 давали на тёмном грубые ободки).
   Тёмное стекло теперь честное: та же форма граней, альфа в 6–10 раз ниже. */

/* Шапка: «стекло»-фон переведён на body-bg в style.css (работает в обеих темах);
   здесь — светлый текст меню + акценты для dark (в light navbar-color = 700). */
/* Шапка-стекло в dark (согласовано 2026-07-09, конструктор):
   прозрачнее (0.8→0.58) + сильнее блюр (10→16px), световой кант сверху,
   hairline снизу вместо тени (тень на тёмном не читается), уплотнение
   при прокрутке, «лазерное» подчёркивание пунктов, активный пункт-pill. */
/* Цвет пунктов здесь БОЛЬШЕ НЕ ЗАДАЁТСЯ: он сидел на примитиве secondary-300,
   тогда как в light был примитив secondary-700 — два примитива вместо одной
   роли. Оба переведены на --bs-body-color в style.css, и dark-адаптация
   приезжает из карты темы бесплатно (тот же дивиденд, что дал дропдаун).
   Фон стекла — роль --glass-bar-bg (root.css), плотность одна на оба состояния. */
[data-bs-theme="dark"] .navbar {
	--bs-navbar-hover-color: var(--bs-emphasis-color);
	--bs-navbar-toggler-border-color: var(--bs-border-color);
	/* Кант сверху занял незанятый токен лестницы: рецепт был написан числом
	   (inset 0 1px 0 rgba(255,255,255,.14)) ещё до того, как --shadow-inner-highlight
	   появился, и почти совпал с ним (.12). Задел нашёл своего читателя.
	   Грань снизу — на роль --glass-edge (была числом .09). */
	box-shadow: var(--shadow-inner-highlight);
	border-bottom: 1px solid var(--glass-edge);
	transition: box-shadow .25s ease;
}

/* Скриншоты софта в dark: светлые изображения «сажаем» в тёмную тему —
   паспарту (тёмный отступ) + лёгкая светлая рамка + посадочная тень, чтобы
   скрин не пробивал «дыру» на тёмном. Только скриншоты (.rounded-3), не иконка
   программы (.img-db без rounded-3). !important на тени — перебить .shadow-lg.
   Согласовано 2026-07-10 (конструктор). */
[data-bs-theme="dark"] .img-db.rounded-3 {
	padding: var(--space-xs);
	background: var(--bs-body-bg);
	border: 1px solid rgba(255, 255, 255, .10);
	box-shadow: 0 10px 26px rgba(0, 0, 0, .30) !important;
}

/* Кнопка темы в dark: солнце — тёплый amber + тёплое свечение + оптический
   сдвиг +1px (солнце симметрично, просит вниз; луне в light сдвиг не нужен). */
/* ⚠️ Целимся в .icon, а не в #themeToggleIcon: с переходом на SVG этот id висит
   на <use> (его подменяет JS), а для <use> не работают ни `top` (SVG не знает
   смещения потока), ни `text-shadow` (у штриха тени нет — нужен filter). */
[data-bs-theme="dark"] #themeToggle .icon {
	top: 1px;
	color: var(--bs-amber-400);
	filter: drop-shadow(0 0 7px rgba(var(--bs-amber-400-rgb), .11));
}

/* Dark-переопределение блюра шапки УДАЛЕНО 2026-07-16: стало дублем базового.
   Было `saturate(180%) blur(16px)` здесь и `saturate(160%) blur(16px)` в light
   (оба числами) — правило существовало ради разницы 160↔180, а она оказалась
   случайной и незаметной (замер: 0–2.3 ед. RGB при пороге ~3). Обе темы читают
   ступень --backdrop-filter-blur-md из style.css. Прежний комментарий «переменная
   blur-sm=10px глобальна — задаём локально» описывал обход отсутствовавшей ступени;
   ступень заведена — обход не нужен. */

/* Прокрутка: класс .scrolled вешает JS в main.tpl → шапка отрывается ТЕНЬЮ
   (ступень overlay), плотность стекла не меняется — см. .navbar.scrolled
   в style.css. Тень была хардкодом 0 8px 24px мимо лестницы. */
[data-bs-theme="dark"] .navbar.scrolled {
	box-shadow: var(--shadow-inner-highlight), var(--bs-box-shadow);
}

/* Пункты меню: подчёркивание-градиент растёт от центра при hover (ОБЕ темы;
   dropdown-кнопку не трогаем — у неё свой chevron). Цвет градиента — per-theme:
   light = primary→indigo-500 (сочно на белом), dark — светлее 400-е (см. ниже). */
.navbar-nav .nav-link {
	position: relative;
}
.navbar-nav .nav-link:not(.dropdown-toggle)::after {
	content: "";
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: 0.45rem;
	height: 2px;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--bs-primary), var(--bs-indigo-500));
	transition: left .2s ease, right .2s ease;
}
.navbar-nav .nav-link:not(.dropdown-toggle):hover::after {
	left: 0.5rem;
	right: 0.5rem;
}
[data-bs-theme="dark"] .navbar-nav .nav-link:not(.dropdown-toggle)::after {
	background: linear-gradient(90deg, var(--bs-primary-400), var(--bs-indigo-400));
}

/* Активный пункт — залитая pill-подложка (squircle через corner-shape).
   ОБЕ темы: класс .active вешает JS (main.tpl) в любой теме.
   ⚠️ Здесь стоял `color: var(--bs-emphasis-color)` и `.navbar` в селекторе —
   и то и другое ради борьбы с БЕЛЫМ --bs-navbar-active-color. Белым его делали
   МЫ (style.css, наследие тёмной шапки); дефолт BS всегда был верным —
   rgba(var(--bs-emphasis-color-rgb), 1). Переопределение снято 2026-07-17 (оно же
   красило белым открытый дропдаун: правило BS бьёт по .active И .show) → цвет
   приезжает из BS сам, наш color стал дублем. Снят: дифференциальный тест по
   ПИКСЕЛЯМ показал 0 изменений в обеих темах (light 31,36,45 / dark 243,245,248).
   ⚠️ Сравнивать пришлось пиксели, а не строки: наш var(--bs-emphasis-color) отдавал
   `oklch(...)`, BS через rgb-мост — `rgb(...)`; один цвет, разные форматы →
   сравнение строк дало бы ложное «не дубль».
   `.navbar` в селекторе ОСТАВЛЕН намеренно: BS задаёт для .active свой color той
   же специфичности (0,3,0), и без запаса наши pill-свойства не пострадают, но цвет
   снова стал бы полем боя при любой правке основания. */
.navbar .navbar-nav .nav-link.active {
	/* Фон и обводка — на РОЛИ бренда, не на примитиве-ступени (было primary-400).
	   Роль по теме не переключается — подложке это и не нужно: она полупрозрачная и
	   адаптируется ПРОСВЕТОМ (замер: 1.19 light / 1.23 dark, иерархия над
	   переключателем цела). Сдвиг цвета от смены 400→роль: 5.9–7.3 ед. RGB при пороге
	   различимости ~3 — на грани, вид сохранён.
	   corner-shape был ХАРДКОДОМ 1.6 при каноне --corner-shape: 1.5 (узор «шкала есть,
	   хардкод рядом»). */
	background: rgba(var(--bs-primary-rgb), .16);
	box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), .3);
	border-radius: var(--radius-sm);
	corner-shape: superellipse(var(--corner-shape));
}

/* Кольцо фокуса всех .nav-link (табы обзора + пункты шапки). Bootstrap гасит
   браузерный outline и рисует своё кольцо, но цвет там ЗАХАРДКОЖЕН в
   скомпилированном правиле — rgba(13,110,253,.25), дефолтный синий BS мимо нашей
   палитры (переопределение --bs-focus-ring-color его не достаёт — тот же узор, что
   у заголовков и утилит кегля: BS компилирует часть значений в статику).
   Замер: контраст к фону 1.41 light / 1.31 dark при норме 3.0 — фокус почти
   не виден. Дело не в цвете: alpha .25 не даёт нормы НИ с каким цветом.
   Роль link-color сама переключается по теме (600 → 400), как у .btn-link выше:
   .75 даёт 3.20 light / 4.16 dark. */
.nav-link:focus-visible {
	box-shadow: 0 0 0 var(--bs-focus-ring-width) rgba(var(--bs-link-color-rgb), .75);
}

/* Тэглайн бренда: локально держит info-плашку на светлых ступенях (info-950 текст
   на info-200 фоне) — в dark переворачиваем на тёмную подложку + светлый текст.
   + «Стеклянная вывеска» (согласовано 2026-07-10, конструктор): подсвеченная
   стеклянная капсула. Слои box-shadow: [1] засвет по верхней кромке (объём/стекло),
   [2] тёмная грань снизу (толщина), [3] неон изнутри, [4] падающая тень (отрыв от
   шапки), [5] лёгкий info-отсвет. Глянец — верхний блик встроен в background
   (не ::before, чтобы текст оставался поверх). Текст «горит» через text-shadow. */
[data-bs-theme="dark"] .brand-tagline {
	--bs-info-text-emphasis: var(--bs-info-300);
	--bs-info-bg-subtle: rgba(var(--bs-info-900-rgb), 0.6);
	--bs-info-border-subtle: rgba(var(--bs-info-800-rgb), 0.6);
	background:
		linear-gradient(rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 55%),
		rgba(var(--bs-info-900-rgb), 0.6);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, .37),
		inset 0 -1px 1.5px rgba(0, 0, 0, .48),
		inset 0 0 6px rgba(var(--bs-info-300-rgb), .67),
		0 3px 8px rgba(0, 0, 0, .23),
		0 2px 9px rgba(var(--bs-info-400-rgb), .23);
	text-shadow: 0 0 5px rgba(var(--bs-info-300-rgb), .9);
}

/* Карточка: .card не задаёт --bs-card-bg → наследует body-bg (gray-950) и
   сливается с фоном. В dark поднимаем на secondary-bg (gray-900), чтобы всплывала. */
[data-bs-theme="dark"] .card {
	--bs-card-bg: var(--bs-secondary-bg);
}

/* Световой кант карточек (dark-фишка, согласовано 2026-07-09): тонкая светлая
   линия сверху даёт объём без теней — на тёмном фоне тени не читаются
   (см. план, этап 7). Заменяет box-shadow-sm у кастомных карточек главной. */
[data-bs-theme="dark"] :is(.card, .hero-section-card, .cats-section-card) {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10);
}

/* Solid-кнопки: dark = яркая заливка (ступень 400) + тёмный текст (gray-950) —
   карта color-system-dark. Белый текст на 400 не проходит AA (2.6–3.0), тёмный =
   5.2–9.7. hover/active — светлее (300), контраст только растёт. */
[data-bs-theme="dark"] :is(.btn-primary,.btn-success,.btn-danger,.btn-info,.btn-warning) {
	--bs-btn-color: var(--bs-gray-950);
	--bs-btn-hover-color: var(--bs-gray-950);
	--bs-btn-active-color: var(--bs-gray-950);
	--bs-btn-disabled-color: rgba(var(--bs-gray-950-rgb), .7);
}
[data-bs-theme="dark"] .btn-primary {
	--bs-btn-bg: var(--bs-primary-400); --bs-btn-border-color: var(--bs-primary-400);
	--bs-btn-hover-bg: var(--bs-primary-300); --bs-btn-hover-border-color: var(--bs-primary-300);
	--bs-btn-active-bg: var(--bs-primary-300); --bs-btn-active-border-color: var(--bs-primary-300);
	--bs-btn-disabled-bg: var(--bs-primary-400); --bs-btn-disabled-border-color: var(--bs-primary-400);
	--bs-btn-focus-shadow-rgb: var(--bs-primary-400-rgb);
}
[data-bs-theme="dark"] .btn-success {
	--bs-btn-bg: var(--bs-success-400); --bs-btn-border-color: var(--bs-success-400);
	--bs-btn-hover-bg: var(--bs-success-300); --bs-btn-hover-border-color: var(--bs-success-300);
	--bs-btn-active-bg: var(--bs-success-300); --bs-btn-active-border-color: var(--bs-success-300);
	--bs-btn-disabled-bg: var(--bs-success-400); --bs-btn-disabled-border-color: var(--bs-success-400);
	--bs-btn-focus-shadow-rgb: var(--bs-success-400-rgb);
}
[data-bs-theme="dark"] .btn-danger {
	--bs-btn-bg: var(--bs-danger-400); --bs-btn-border-color: var(--bs-danger-400);
	--bs-btn-hover-bg: var(--bs-danger-300); --bs-btn-hover-border-color: var(--bs-danger-300);
	--bs-btn-active-bg: var(--bs-danger-300); --bs-btn-active-border-color: var(--bs-danger-300);
	--bs-btn-disabled-bg: var(--bs-danger-400); --bs-btn-disabled-border-color: var(--bs-danger-400);
	--bs-btn-focus-shadow-rgb: var(--bs-danger-400-rgb);
}
[data-bs-theme="dark"] .btn-info {
	--bs-btn-bg: var(--bs-info-400); --bs-btn-border-color: var(--bs-info-400);
	--bs-btn-hover-bg: var(--bs-info-300); --bs-btn-hover-border-color: var(--bs-info-300);
	--bs-btn-active-bg: var(--bs-info-300); --bs-btn-active-border-color: var(--bs-info-300);
	--bs-btn-disabled-bg: var(--bs-info-400); --bs-btn-disabled-border-color: var(--bs-info-400);
	--bs-btn-focus-shadow-rgb: var(--bs-info-400-rgb);
}
[data-bs-theme="dark"] .btn-warning {
	--bs-btn-bg: var(--bs-warning-400); --bs-btn-border-color: var(--bs-warning-400);
	--bs-btn-hover-bg: var(--bs-warning-300); --bs-btn-hover-border-color: var(--bs-warning-300);
	--bs-btn-active-bg: var(--bs-warning-300); --bs-btn-active-border-color: var(--bs-warning-300);
	--bs-btn-disabled-bg: var(--bs-warning-400); --bs-btn-disabled-border-color: var(--bs-warning-400);
	--bs-btn-focus-shadow-rgb: var(--bs-warning-400-rgb);
}
/* .btn-secondary / .btn-outline-* в dark — по надобности (в бою не используются). */