/* ------------------------------------------------------------------
   type-species.css — «вид рыбы и способ ловли».

   Блоки этого типа: календарь клёва по месяцам, паспорт вида,
   сезонные полосы в таблицах снастей и наживок, схемы проводок,
   карточка «сейчас» в боковой колонке.

   Данных под них в базе нет — всё собирает разбором готового HTML
   template-parts/type-species.php. Не нашлось — блока просто нет,
   поэтому пустых состояний здесь не предусмотрено.

   Ни одного статусного цвета (--st-*). Активность клёва — нейтральная
   шкала --sc-1..--sc-5: красный столбик у месяца нереста читался бы
   как «ловить запрещено», хотя означает «рыба не берёт». Нерест,
   запрет и ледовые периоды разведены подписью и штриховкой.

   Часть селекторов начинается с .mr-article__body. Эти блоки
   вставляются прямо в текст статьи, где ul, li и p уже размечены в
   article.css; перебить тамошние маркеры и отступы можно только
   селектором того же веса.
   ------------------------------------------------------------------ */

/* ---------------------------------------------------------------- Коротко */

/* Сводка над текстом: пик клёва, нерест, размер. Собирается из
   паспорта вида и календаря, то есть из того, что уже есть в статье. */
.mr-sp-facts {
	margin: 0 0 1.6rem;
	border: 1px solid var(--line);
	border-top: 3px solid var(--ink);
	border-radius: var(--r);
	background: var(--paper);
	overflow: hidden;
}

.mr-sp-facts__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.3rem 0.7rem;
	padding: 0.7rem 1rem;
	border-bottom: 1px solid var(--line);
	background: var(--paper-2);
}

.mr-sp-facts__t {
	margin: 0;
	font-family: var(--mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--ink-2);
}

.mr-sp-facts__sub {
	font-size: 0.8rem;
	line-height: 1.4;
	color: var(--ink-3);
}

/* Разделители нарисованы зазором сетки: колонок может быть от двух до
   четырёх, и при переносе строки границы через nth-child разъезжаются. */
.mr-sp-facts__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 1px;
	background: var(--line);
}

.mr-sp-facts__i {
	position: relative;
	padding: 0.85rem 1rem 0.95rem 1.4rem;
	background: var(--paper);
	min-width: 0;
}

.mr-sp-facts__i::before {
	content: "";
	position: absolute;
	left: 1rem;
	top: 0.95rem;
	bottom: 1rem;
	width: 3px;
	border-radius: 2px;
	background: var(--sc-3);
}

.mr-sp-facts__l {
	margin-bottom: 0.4rem;
	font-family: var(--mono);
	font-size: 0.62rem;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--ink-3);
}

.mr-sp-facts__v {
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--ink);
	font-variant-numeric: tabular-nums;
}

.mr-sp-facts__n {
	margin: 0.45rem 0 0;
	font-size: 0.85rem;
	line-height: 1.45;
	color: var(--ink-3);
}

@media (max-width: 700px) {
	.mr-sp-facts__i {
		padding: 0.75rem 0.9rem 0.85rem 1.3rem;
	}

	.mr-sp-facts__i::before {
		left: 0.9rem;
	}

	.mr-sp-facts__v {
		font-size: 1.08rem;
	}
}

/* ---------------------------------------------------------------- Разделы */

/* Компактная строка переходов вместо липкого оглавления: эти статьи
   читают подряд, от описания к технике, и колонка с оглавлением здесь
   отнимает у текста больше, чем даёт. На телефоне вместо неё —
   свёрнутый .mr-toc--mobile из article.css. */
.mr-sp-jump {
	display: none;
}

@media (min-width: 901px) {
	.mr-sp-jump {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 0.35rem 0.9rem;
		margin: 0 0 1.7rem;
		padding: 0.7rem 0.95rem;
		border: 1px solid var(--line);
		border-left: 3px solid var(--brand-soft);
		border-radius: var(--r-sm);
		background: var(--paper-2);
	}
}

.mr-sp-jump__t {
	font-family: var(--mono);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-4);
	flex: 0 0 auto;
}

.mr-sp-jump__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.2rem 0.9rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: mr-sp-jump;
	min-width: 0;
}

.mr-sp-jump__list > li {
	counter-increment: mr-sp-jump;
	margin: 0;
	min-width: 0;
}

.mr-sp-jump__link {
	font-size: 0.85rem;
	line-height: 1.4;
	color: var(--ink-2);
	text-decoration: none;
}

.mr-sp-jump__link::before {
	content: counter(mr-sp-jump, decimal-leading-zero) " ";
	font-family: var(--mono);
	font-size: 0.68rem;
	color: var(--ink-4);
}

.mr-sp-jump__link:hover {
	color: var(--brand-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------------------------------------------------------------- Календарь клёва */

.mr-sp-cal {
	margin: 0 0 1rem;
	border: 1px solid var(--line);
	border-radius: var(--r);
	background: var(--paper);
	overflow: hidden;
	scroll-margin-top: calc(var(--navbar) + 1rem);
}

.mr-sp-cal__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.3rem 0.8rem;
	padding: 0.7rem 0.9rem;
	background: var(--ink);
	color: var(--paper);
}

.mr-sp-cal__t {
	font-family: var(--mono);
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.mr-sp-cal__sub {
	margin-left: auto;
	font-family: var(--mono);
	font-size: 0.64rem;
	color: var(--ink-4);
}

/* Двенадцать столбиков в ряд. Сетка с зазором в один пиксель на
   подложке цвета линии: при переносе на шесть и четыре колонки
   разделители появляются сами, без правил на nth-child. */
.mr-article__body .mr-sp-cal__grid,
.mr-sp-cal__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1px;
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--line);
}

.mr-article__body .mr-sp-cal__m,
.mr-sp-cal__m {
	margin: 0;
	padding: 0.7rem 0.15rem 0.65rem;
	background: var(--paper);
	text-align: center;
	min-width: 0;
}

.mr-article__body .mr-sp-cal__m::before {
	content: none;
}

.mr-sp-cal__name {
	display: block;
	font-family: var(--mono);
	font-size: 0.64rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--ink-3);
}

.mr-sp-cal__bar {
	display: flex;
	align-items: flex-end;
	width: 62%;
	max-width: 1.5rem;
	height: 3.5rem;
	margin: 0.5rem auto 0.45rem;
	border-radius: 2px;
	background: var(--sc-track);
	box-shadow: inset 0 0 0 1px var(--line);
	overflow: hidden;
}

.mr-sp-cal__fill {
	display: block;
	width: 100%;
	border-radius: 2px;
	background: var(--sc-1);
}

/* Шкала активности. Ступени только по высоте и насыщенности одного
   тона: «мало клюёт» — это не «нельзя», и красным здесь не пахнет. */
.is-lvl0 .mr-sp-cal__fill { height: 0; }
.is-lvl1 .mr-sp-cal__fill { height: 14%; background: var(--sc-1); box-shadow: inset 0 0 0 1px var(--line-strong); }
.is-lvl2 .mr-sp-cal__fill { height: 34%; background: var(--sc-2); }
.is-lvl3 .mr-sp-cal__fill { height: 56%; background: var(--sc-3); }
.is-lvl4 .mr-sp-cal__fill { height: 78%; background: var(--sc-4); }
.is-lvl5 .mr-sp-cal__fill { height: 100%; background: var(--sc-5); }

/* Нерест и запрет: штриховка вместо отдельного цвета. Смысл несёт
   подпись под столбиком, штриховка только помогает найти месяц. */
.mr-sp-cal__m.is-marked .mr-sp-cal__fill {
	background-image: repeating-linear-gradient(
		135deg,
		transparent 0 3px,
		var(--paper-2) 3px 6px
	);
}

.mr-sp-cal__val {
	display: block;
	font-family: var(--mono);
	font-size: 0.56rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	line-height: 1.3;
	color: var(--ink-3);
	overflow-wrap: anywhere;
}

.is-lvl4 .mr-sp-cal__val,
.is-lvl5 .mr-sp-cal__val {
	color: var(--ink);
	font-weight: 600;
}

/* Подпись периода. Отбита линией, а не цветом: «нерест» рядом с
   «первым льдом» — это про рыбу, а не про разрешено/запрещено. */
.mr-sp-cal__tag {
	display: block;
	margin-top: 0.3rem;
	padding-top: 0.25rem;
	border-top: 1px dotted var(--line-strong);
	font-family: var(--mono);
	font-size: 0.53rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.25;
	color: var(--ink-3);
	overflow-wrap: anywhere;
}

.mr-sp-cal__m.is-now {
	background: var(--brand-soft-2);
}

.mr-sp-cal__m.is-now .mr-sp-cal__name {
	color: var(--brand-dark);
	font-weight: 700;
}

.mr-article__body .mr-sp-cal__legend,
.mr-sp-cal__legend {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.1rem;
	margin: 0;
	padding: 0.65rem 0.9rem;
	border-top: 1px solid var(--line);
	background: var(--paper-2);
	list-style: none;
	font-family: var(--mono);
	font-size: 0.62rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--ink-3);
}

.mr-article__body .mr-sp-cal__legend > li,
.mr-sp-cal__legend > li {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
	padding-left: 0;
}

.mr-article__body .mr-sp-cal__legend > li::before {
	content: none;
}

.mr-sp-cal__key {
	display: block;
	width: 9px;
	height: 9px;
	flex: 0 0 auto;
	border-radius: 2px;
	background: var(--sc-1);
}

.mr-sp-cal__key.is-lvl1 { background: var(--sc-1); box-shadow: inset 0 0 0 1px var(--line-strong); }
.mr-sp-cal__key.is-lvl2 { background: var(--sc-2); }
.mr-sp-cal__key.is-lvl3 { background: var(--sc-3); }
.mr-sp-cal__key.is-lvl4 { background: var(--sc-4); }
.mr-sp-cal__key.is-lvl5 { background: var(--sc-5); }

.mr-article__body .mr-sp-cal__note,
.mr-sp-cal__note {
	margin: 0;
	padding: 0.7rem 0.9rem 0.8rem;
	border-top: 1px solid var(--line);
	font-size: 0.84rem;
	line-height: 1.5;
	color: var(--ink-3);
}

/* Двенадцать колонок держатся только в широкой колонке. Дальше —
   два ряда по шесть, на узких телефонах три ряда по четыре. */
@media (max-width: 900px) {
	.mr-article__body .mr-sp-cal__grid,
	.mr-sp-cal__grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

@media (max-width: 430px) {
	.mr-article__body .mr-sp-cal__grid,
	.mr-sp-cal__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.mr-sp-cal__bar {
		height: 2.9rem;
	}

	.mr-article__body .mr-sp-cal__m,
	.mr-sp-cal__m {
		padding: 0.6rem 0.1rem 0.55rem;
	}
}

/* ---------------------------------------------------------------- Паспорт вида */

/* Двухколоночная таблица характеристик разворачивается шаблоном в
   список определений: те же данные, но на телефоне подпись и значение
   идут строкой друг под другом без имитации таблицы. */
.mr-sp-spec {
	margin: 0 0 1rem;
	border: 1px solid var(--line);
	border-radius: var(--r);
	background: var(--paper);
	overflow: hidden;
}

.mr-sp-spec__t {
	padding: 0.65rem 0.9rem;
	border-bottom: 1px solid var(--line);
	background: var(--paper-2);
	font-size: 0.92rem;
	font-weight: 650;
	line-height: 1.4;
	color: var(--ink);
}

.mr-sp-spec__list {
	display: grid;
	grid-template-columns: minmax(9rem, 32%) minmax(0, 1fr);
	gap: 1px;
	margin: 0;
	background: var(--line);
}

.mr-sp-spec__list dt {
	margin: 0;
	padding: 0.6rem 0.9rem;
	background: var(--paper-2);
	font-family: var(--mono);
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	line-height: 1.5;
	color: var(--ink-3);
	min-width: 0;
}

.mr-sp-spec__list dd {
	margin: 0;
	padding: 0.6rem 0.9rem;
	background: var(--paper);
	font-size: 0.98rem;
	line-height: 1.45;
	color: var(--ink-2);
	min-width: 0;
}

.mr-sp-spec__list dd b,
.mr-sp-spec__list dd strong {
	color: var(--ink);
	font-weight: 650;
}

@media (max-width: 700px) {
	.mr-sp-spec__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.mr-sp-spec__list dt {
		padding-bottom: 0.35rem;
		background: var(--paper);
	}

	.mr-sp-spec__list dd {
		padding-top: 0;
		font-size: 1rem;
	}

	/* В одну колонку зазор между подписью и значением одной пары лишний:
	   линия должна отбивать пары, а не половинки одной строки. */
	.mr-sp-spec__list {
		gap: 0;
	}

	.mr-sp-spec__list dt {
		border-top: 1px solid var(--line);
	}

	.mr-sp-spec__list dt:first-of-type {
		border-top: 0;
	}
}

/* ---------------------------------------------------------------- Сезонная полоса */

/* Ставится шаблоном в колонку «Сезон» таблиц снастей и наживок.
   Полоса декоративная: исходный текст ячейки («май — окт») остаётся
   на месте и читается скринридером, поэтому полоса aria-hidden. */
.mr-sp-seasons {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 2px;
	max-width: 12rem;
	margin-top: 0.4rem;
}

.mr-sp-seasons__i {
	padding: 0.2rem 0.1rem;
	border: 1px solid var(--line);
	border-radius: 2px;
	background: var(--paper);
	font-family: var(--mono);
	font-size: 0.55rem;
	letter-spacing: 0.01em;
	line-height: 1.25;
	text-align: center;
	color: var(--ink-4);
	overflow: hidden;
}

.mr-sp-seasons__i.is-on {
	border-color: var(--brand);
	background: var(--brand);
	color: var(--paper);
	font-weight: 600;
}

/* В карточном режиме таблицы ячейка — сетка «подпись / значение».
   Без растяжки полоса уехала бы в узкую колонку подписи. */
@media (max-width: 700px) {
	.mr-t--stack td > .mr-sp-seasons {
		grid-column: 1 / -1;
		max-width: none;
	}
}

/* ---------------------------------------------------------------- Схемы проводок */

.mr-article__body .mr-sp-moves,
.mr-sp-moves {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 0.85rem;
	margin: 0 0 1.4em;
	padding: 0;
	list-style: none;
}

.mr-article__body .mr-sp-move,
.mr-sp-move {
	margin: 0;
	padding: 0.75rem 0.85rem 0.9rem;
	border: 1px solid var(--line);
	border-radius: var(--r);
	background: var(--paper);
	min-width: 0;
}

.mr-article__body .mr-sp-move::before {
	content: none;
}

.mr-sp-move__fig {
	display: block;
	padding: 0.45rem 0.5rem;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	background: var(--paper-2);
}

.mr-sp-move__fig svg {
	display: block;
	width: 100%;
	height: auto;
}

.mr-sp-move__path {
	fill: none;
	stroke: var(--sc-5);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.mr-sp-move__dot {
	fill: var(--sc-3);
	stroke: none;
}

/* Пунктир снизу — дно или поверхность, точка отсчёта для схемы. */
.mr-sp-move__floor {
	fill: none;
	stroke: var(--line-strong);
	stroke-width: 1;
	stroke-dasharray: 3 3;
}

.mr-sp-move__name {
	display: block;
	margin: 0.65rem 0 0.3rem;
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.3;
	letter-spacing: -0.014em;
	color: var(--ink);
}

.mr-sp-move__note {
	font-size: 0.92rem;
	line-height: 1.5;
	color: var(--ink-3);
}

.mr-sp-move__note > *:last-child {
	margin-bottom: 0;
}

/* ---------------------------------------------------------------- Сейчас */

/* Карточка в боковой колонке: месяц по часам сайта и его уровень из
   разобранного календаря. Пилюля — из общей шкалы components.css. */
.mr-sp-now__line {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
}

.mr-sp-now__m {
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: -0.018em;
	color: var(--ink);
}

.mr-sp-now__n {
	margin: 0.55rem 0 0;
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--ink-3);
}

.mr-sp-now__link {
	display: inline-block;
	margin-top: 0.6rem;
	font-family: var(--mono);
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--brand);
	text-decoration: none;
}

.mr-sp-now__link:hover {
	color: var(--brand-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------------------------------------------------------------- Печать */

@media print {
	.mr-sp-jump {
		display: none !important;
	}

	.mr-sp-facts,
	.mr-sp-cal,
	.mr-sp-spec,
	.mr-sp-move {
		break-inside: avoid;
	}

	/* На бумаге столбики сереют и сливаются — подписи под ними остаются
	   единственным носителем смысла, поэтому их не уменьшаем. */
	.mr-sp-cal__val {
		font-size: 7pt;
		color: var(--ink-2);
	}
}