:root {
	--bg: #F7F6F2;
	--paper: #FFFFFF;
	--surface: #EDF2F0;
	--surface-2: #E4EDEB;
	--line: #E1E5E1;
	--line-strong: #CBD4D0;

	--ink: #1D2321;
	--ink-2: #4C5854;
	--ink-3: #77827E;

	--primary: #14625E;
	--primary-hover: #0F4E4B;
	--primary-press: #0B3E3C;
	--primary-tint: #E4EDEB;

	--accent: #E15B47;
	--accent-tint: #FBEAE6;

	--crisis: #C8322A;
	--crisis-hover: #A9261F;
	--crisis-tint: #FCEDEB;
	--crisis-line: #EBC9C5;
	--crisis-ink: #5C241E;

	--positive: #2F6B4F;
	--positive-tint: #E7F0EA;
	--positive-line: #BFD4C7;

	--caution: #8A6A1F;
	--caution-tint: #F6F0E1;
	--caution-line: #E0D2AC;

	--r-sm: 8px;
	--r-md: 12px;
	--r-lg: 18px;
	--r-xl: 22px;
	--r-pill: 999px;
	--shadow: 0 1px 2px rgba(29, 35, 33, .04), 0 8px 24px rgba(29, 35, 33, .05);

	--font: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Helvetica Neue", sans-serif;

	/* Ширина колонки — по назначению страницы, не единая на всё:
	   --wrap — широкий лендинг (P-10), --col — узкая колонка чтения
	   (P-11/P-12), --col-narrow — ещё уже, для потоков-опросников
	   (самопроверка P-16+, кризис P-21+), где меньше текста и больше решений,
	   --col-wide — документы (P-108/P-109/P-110): плотный текст, таблицы,
	   нумерованные списки — источник сам держит 760px, не 620px.
	   --col-auth/--col-auth-wide — вход/регистрация/восстановление
	   (P-02/P-03/P-08): узкие формы, свои значения в источнике (460/520px),
	   не совпадают ни с одной из категорий выше. */
	--wrap: 1180px;
	--col: 620px;
	--col-narrow: 560px;
	--col-wide: 760px;
	--col-auth: 460px;
	--col-auth-wide: 520px;
	--sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
	--control-h: 52px;
}

/* Свой хостинг Montserrat (без Google Fonts CDN — на анонимной платформе
   лишний внешний запрос при каждой загрузке страницы это утечка IP на
   сторону). Вариативный файл на подмножество, вес выбирается диапазоном.
   См. public/assets/fonts/montserrat/README.md — источник/лицензия/hash. */
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('../fonts/montserrat/montserrat-cyrillic-ext.woff2') format('woff2');
	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('../fonts/montserrat/montserrat-cyrillic.woff2') format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('../fonts/montserrat/montserrat-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Montserrat';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('../fonts/montserrat/montserrat-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 16px; line-height: 1.62; -webkit-font-smoothing: antialiased; padding-bottom: 64px; }
h1, h2, h3 { margin: 0 0 12px; line-height: 1.2; letter-spacing: -.014em; font-weight: 600; }
h1 { font-size: clamp(28px, 4.1vw, 43px); letter-spacing: -.022em; }
h2 { font-size: clamp(22px, 2.5vw, 28px); }
h3 { font-size: 19px; }
p { margin: 0 0 14px; }
a { color: var(--primary); text-underline-offset: 3px; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 28px; }
.eyebrow { font-size: 11.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin: 0 0 14px; }
.muted { color: var(--ink-2); }
.small { font-size: 13.5px; }
.tiny { font-size: 12.5px; color: var(--ink-3); }

.skip { position: absolute; inset-inline-start: -9999px; top: 0; background: var(--primary); color: #fff; padding: 10px 16px; border-radius: 0 0 var(--r-sm) 0; z-index: 100; }
.skip:focus { inset-inline-start: 0; }

/* ── кнопки ──────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-size: 15px; font-weight: 600; line-height: 1.2; padding: 13px 20px; border-radius: var(--r-sm); border: 1px solid transparent; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-hover); }
.btn-primary:active { background: var(--primary-press); }
.btn-secondary { background: var(--paper); color: var(--primary); border-color: var(--line-strong); }
.btn-secondary:hover { border-color: var(--primary); background: var(--primary-tint); }
.btn-ghost { background: transparent; color: var(--primary); border-color: var(--line-strong); }
.btn-ghost:hover { background: var(--primary-tint); }
.btn-quiet { background: transparent; color: var(--ink-2); border-color: var(--line-strong); }
.btn-quiet:hover { background: var(--surface); }
.btn-crisis { background: var(--crisis); color: #fff; border-color: var(--crisis); }
.btn-crisis:hover { background: var(--crisis-hover); }
.btn-sm { padding: 10px 15px; font-size: 14px; min-height: 44px; }
.btn-block { width: 100%; }
.btn-lg { min-height: var(--control-h); padding: 14px 22px; font-size: 16px; width: 100%; }
.btn-auto { width: auto; }

/* ── шапка ───────────────────────────────────────────────── */
header { position: sticky; top: 0; z-index: 40; background: rgba(247, 246, 242, .94); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 1px solid var(--line); }
.hdr { display: flex; align-items: center; gap: 22px; padding: 12px 28px; max-width: var(--wrap); margin: 0 auto; }
.mark { display: flex; align-items: center; gap: 10px; margin-inline-end: auto; text-decoration: none; color: var(--ink); }
.mark img { display: block; width: 28px; height: 28px; }
.mark b { font-size: 17px; font-weight: 700; letter-spacing: .02em; }
nav.top { display: flex; align-items: center; gap: 20px; font-size: 14px; }
nav.top a { color: var(--ink-2); text-decoration: none; white-space: nowrap; }
nav.top a:hover { color: var(--primary); }
.hdr-crisis { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; white-space: nowrap; color: var(--crisis); text-decoration: none; padding: 8px 12px; border: 1px solid #EBC9C5; border-radius: var(--r-sm); background: var(--crisis-tint); }
.hdr-crisis:hover { border-color: var(--crisis); }
.hdr-crisis i { width: 7px; height: 7px; border-radius: 50%; background: var(--crisis); display: inline-block; }

/* ── ссылка «назад» / «выйти» в шапке внутренних страниц ──── */
.back { font: inherit; font-size: 13.5px; color: var(--ink-2); background: none; border: 0; cursor: pointer; padding: 6px; text-decoration: none; }
.back:hover { color: var(--ink); }
.back[disabled] { opacity: .32; cursor: default; }

/* ── постоянная кризисная панель ─────────────────────────── */
.crisisbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--paper); border-top: 1px solid var(--line); box-shadow: 0 -2px 18px rgba(29, 35, 33, .06); }
.crisisbar .inner { max-width: var(--wrap); margin: 0 auto; padding: 10px 28px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.crisisbar .txt { font-size: 13.5px; color: var(--ink-2); margin-inline-end: auto; }
.crisisbar .txt b { color: var(--ink); font-weight: 600; }

/* ── языковое меню ───────────────────────────────────────── */
.langmenu { position: relative; }
.langbtn { display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 13px; font-weight: 600; letter-spacing: .03em; padding: 8px 11px; border: 1px solid var(--line-strong); border-radius: var(--r-sm); background: var(--paper); color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.langbtn:hover { border-color: var(--primary); color: var(--primary); }
.langbtn[aria-expanded="true"] { border-color: var(--primary); color: var(--primary); background: var(--primary-tint); }
.langbtn svg { transition: transform .15s; }
.langbtn[aria-expanded="true"] svg { transform: rotate(180deg); }
.langlist { position: absolute; inset-inline-end: 0; top: calc(100% + 6px); min-width: 180px; margin: 0; padding: 5px; list-style: none; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: 0 12px 32px rgba(29, 35, 33, .14); z-index: 60; }
.langlist li { margin: 0; }
.langlist a { display: flex; align-items: center; gap: 10px; width: 100%; text-align: start; font: inherit; font-size: 15px; padding: 10px 12px; border: 0; border-radius: var(--r-sm); background: none; color: var(--ink); cursor: pointer; text-decoration: none; }
.langlist a:hover { background: var(--surface); }
.langlist a[aria-selected="true"] { color: var(--primary); font-weight: 600; background: var(--primary-tint); }
.langlist .code { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; color: var(--ink-3); margin-inline-start: auto; }
.langlist a[aria-selected="true"] .code { color: var(--primary); }

/* ── вход ───────────────────────────────────────────────── */
.signin-btn { display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: 14px; font-weight: 600; padding: 8px 16px; border: 1px solid var(--primary); border-radius: var(--r-sm); background: var(--paper); color: var(--primary); cursor: pointer; text-decoration: none; white-space: nowrap; }
.signin-btn:hover { background: var(--primary-tint); }

/* Шапка вошедшего пациента (P-31 и все страницы кабинета на
   public_inner_layout) — колокольчик/шестерёнка/выйти вместо «Войти». */
.icobtn { position: relative; background: none; border: 0; cursor: pointer; color: var(--ink-2); padding: 7px; border-radius: var(--r-sm); }
.icobtn:hover { background: var(--surface); color: var(--ink); }
.icobtn .dot { position: absolute; top: 5px; inset-inline-end: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.icobtn .lbl, .setbtn .lbl { display: none; }
.setbtn { flex: none; width: 34px; height: 34px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--paper); color: var(--ink-2); cursor: pointer; display: grid; place-items: center; text-decoration: none; }
.setbtn:hover { border-color: var(--primary); color: var(--primary); }
.logout { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 13px; font-weight: 600; padding: 7px 12px; border: 1px solid var(--line-strong); border-radius: var(--r-sm); background: var(--paper); color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.logout:hover { border-color: var(--ink-3); color: var(--ink); }

/* ── гамбургер-меню шапки (узкие экраны, public_inner_layout/public_layout) ──
   На десктопе .hdr-menu ничем не отличается от обычных детей .hdr —
   display:contents разворачивает обёртку без следа, чтобы не трогать
   уже существующий порядок/вид на широких экранах. Кризисная ссылка и
   сам бургер всегда живут ВНЕ .hdr-menu — кризис не должен прятаться
   за тапом ни на какой ширине. */
.hdr-burger { display: none; }
.hdr-menu { display: contents; }
/* .hdr-menu разворачивается display:contents — колокольчик/шестерня/язык
   (внутри hdr-menu) и кризис/бургер (вне hdr-menu) становятся прямыми
   flex-элементами .hdr вперемешку по DOM-порядку. Явный order держит уже
   зафиксированный порядок кабинетной шапки (колокольчик→шестерня→язык→
   кризис→выйти) вместо того, чтобы кризис/бургер просто оказались в конце. */
body.shell-inner .hdr-crisis { order: 4; }
/* order действует только на ПРЯМЫХ flex-детей .hdr — .logout сама не
   промотана в flex-элемент, им становится обёртывающая .hdr-menu > form
   (contents "растворяет" только сам .hdr-menu, не вложенный form) —
   order нужно ставить на form, а не на кнопку внутри неё (проверено
   живым CDP-скриншотом: без этого «Выйти» оказывался ПЕРЕД «Кризис»). */
body.shell-inner .hdr-menu > form { order: 5; }
body.shell-inner .hdr-burger { order: 6; }
@media (max-width: 560px) {
	.hdr-burger { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 38px; height: 38px; padding: 0; background: none; border: 1px solid var(--line-strong); border-radius: var(--r-sm); color: var(--ink-2); cursor: pointer; }
	.hdr-burger:hover { border-color: var(--primary); color: var(--primary); }
	.hdr-burger .close-icon { display: none; }
	.hdr-burger[aria-expanded="true"] .burger-icon { display: none; }
	.hdr-burger[aria-expanded="true"] .close-icon { display: block; }

	/* Шапки с гамбургером (кабинет/лендинг) держат одну строку — лишнее
	   уходит в открывающуюся панель. Шапки без него (auth/self-check,
	   мало элементов, панель для них избыточна) вместо этого просто
	   переносятся на вторую строку при нехватке места — иначе они
	   реально вылезают за экран на 375px (проверено живым CDP-прогоном:
	   .logout на self-check не помещался, вызывая горизонтальный overflow). */
	.hdr:has(.hdr-burger) { flex-wrap: nowrap; position: relative; }
	.hdr:not(:has(.hdr-burger)) { flex-wrap: wrap; row-gap: 8px; }

	.hdr-menu { display: none; flex-direction: column; align-items: stretch; gap: 8px;
		position: absolute; top: 100%; left: 14px; right: 14px; margin-top: 8px;
		background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-md);
		box-shadow: 0 12px 32px rgba(29, 35, 33, .14); padding: 12px; z-index: 55; }
	.hdr-menu.open { display: flex; }
	.hdr-menu .icobtn, .hdr-menu .setbtn, .hdr-menu .signin-btn, .hdr-menu .logout,
	.hdr-menu nav.top a { width: 100%; justify-content: flex-start; }
	.hdr-menu .icobtn, .hdr-menu .setbtn { display: flex; align-items: center; gap: 10px; height: auto; padding: 8px; }
	.hdr-menu .icobtn .lbl, .hdr-menu .setbtn .lbl { display: inline; font-size: 14.5px; font-weight: 600; color: var(--ink); }
	.hdr-menu .langmenu { position: static; width: 100%; }
	.hdr-menu .langlist { position: static; width: 100%; box-shadow: none; border: 0; padding: 4px 0 0; margin: 0; }
	.hdr-menu nav.top { display: flex; flex-direction: column; gap: 2px; }
	.hdr-menu nav.top a { padding: 8px 4px; color: var(--ink-2); text-decoration: none; font-size: 14.5px; }
}

/* ── внутренние публичные страницы: узкая колонка чтения,
   упрощённая шапка без nav/кризисной плашки (см. public_inner_layout.php) ── */
body.shell-inner { padding-bottom: 96px; }
body.shell-inner.no-crisisbar { padding-bottom: 0; }
body.shell-inner .hdr { max-width: var(--col); gap: var(--sp-3); padding: var(--sp-3) var(--sp-5); }
body.shell-inner main { max-width: var(--col); margin: 0 auto; padding: var(--sp-6) var(--sp-5) var(--sp-7); }
body.shell-inner .crisisbar .inner { max-width: var(--col); }
/* документы без .rail (P-108/P-109/P-110) — источник держит колонку шире
   обычной статьи (760px, не 620px): плотный текст, таблицы, списки. */
body.shell-inner main:not(:has(.rail)) { max-width: var(--col-wide); }
/* ниже 1080px шапка/main/crisisbar у документов должны совпадать по
   ширине (иначе контент шире шапки — та же болезнь "разъехалось", только
   наоборот). На ≥1080px шапка одна на весь сайт — 1100px, не трогаем. */
@media (max-width: 1079.98px) {
	body.shell-inner:not(:has(.rail)) .hdr,
	body.shell-inner:not(:has(.rail)) .crisisbar .inner { max-width: var(--col-wide); }
}

/* ── вход/регистрация/восстановление: узкая форма, без nav/signin/hdr-crisis
   в шапке (см. public_auth_layout.php). .wide — P-02 (регистрация, больше
   полей, 520px); по умолчанию 460px — P-03/P-08. Только P-02 имеет .rail —
   grid включаем через :has(), тот же приём, что у shell-inner. */
body.shell-auth { padding-bottom: 96px; min-height: 100vh; }
body.shell-auth .hdr { max-width: var(--col-auth); gap: var(--sp-4); padding: var(--sp-3) var(--sp-5); }
body.shell-auth main { max-width: var(--col-auth); margin: 0 auto; padding: var(--sp-7) var(--sp-5) var(--sp-7); }
body.shell-auth.wide .hdr { max-width: var(--col-auth-wide); }
body.shell-auth.wide main { max-width: var(--col-auth-wide); }
body.shell-auth .crisisbar .inner { max-width: var(--col-auth); }
body.shell-auth.wide .crisisbar .inner { max-width: var(--col-auth-wide); }
@media (min-width: 1080px) {
	body.shell-auth {
		background: radial-gradient(120% 80% at 12% 16%, #EDF2F0 0%, rgba(237, 242, 240, 0) 58%),
			radial-gradient(90% 70% at 88% 84%, #FBEAE6 0%, rgba(251, 234, 230, 0) 62%), var(--bg);
	}
	body.shell-auth main:has(.rail) {
		max-width: 1000px; display: grid; grid-template-columns: minmax(0, var(--col-auth-wide)) 300px;
		column-gap: var(--sp-7); row-gap: 0; align-items: start; justify-content: center;
	}
	/* :not(.rail), не просто "> *": :has() поднимает специфичность этого
	   правила выше, чем у ".rail{grid-column:2}" ниже (у shell-inner такой
	   гонки нет — там тот же приём без :has() в этом самом селекторе), и
	   без исключения .rail сам попадал бы в колонку 1 вместе с контентом. */
	body.shell-auth main:has(.rail) > :not(.rail) { grid-column: 1; }
	body.shell-auth .rail { display: block; grid-column: 2; grid-row: 1 / span 30; position: sticky; top: 112px; }
	body.shell-auth .hdr, body.shell-auth.wide .hdr,
	body.shell-auth .crisisbar .inner, body.shell-auth.wide .crisisbar .inner { max-width: 1000px; }
}

/* ── потоки-опросники: ещё уже колонка, боковая колонка слева на
   десктопе (см. public_selfcheck_layout.php) ── */
body.shell-selfcheck { padding-bottom: 96px; min-height: 100vh; }
body.shell-selfcheck.no-crisisbar { padding-bottom: 0; }
body.shell-selfcheck.crisis-tint { --control-h: 56px; }
body.shell-selfcheck .hdr { max-width: var(--col-narrow); gap: var(--sp-4); padding: var(--sp-3) var(--sp-5); }
body.shell-selfcheck main { max-width: var(--col-narrow); margin: 0 auto; padding: var(--sp-7) var(--sp-5) var(--sp-7); }
body.shell-selfcheck .crisisbar .inner { max-width: var(--col-narrow); }

.lead { margin-bottom: var(--sp-5); }
.lead .kicker { font-size: 11.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin: 0 0 var(--sp-3); }
.lead h1 { font-size: clamp(23px, 4.4vw, 28px); line-height: 1.28; letter-spacing: -.02em; font-weight: 600; margin: 0 0 var(--sp-3); max-width: 19ch; }
.lead p { font-size: 16.5px; color: var(--ink-2); margin: 0; max-width: 50ch; }

.stub-links { list-style: none; margin: 0 0 var(--sp-5); padding: 0; }
.stub-links a { font-size: 14.5px; color: var(--primary); text-decoration: none; }
.stub-links a:hover { text-decoration: underline; }

/* ── поиск (используется P-11 и P-22) ─────────────────────── */
.search { position: relative; margin-bottom: var(--sp-4); }
.search input { width: 100%; min-height: var(--control-h); padding: 14px 44px 14px 46px; border: 1px solid var(--line-strong); border-radius: var(--r-md); font: inherit; font-size: 16.5px; background: var(--paper); color: var(--ink); }
.search input::placeholder { color: var(--ink-3); }
.search input:focus-visible { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: 1px; }
.search .ico { position: absolute; inset-inline-start: 16px; top: 50%; transform: translateY(-50%); color: var(--ink-3); }
.search .clear { position: absolute; inset-inline-end: 10px; top: 50%; transform: translateY(-50%); background: none; border: 0; cursor: pointer; color: var(--ink-3); padding: 8px; border-radius: var(--r-sm); }
.search .clear:hover { background: var(--surface); color: var(--ink); }

@keyframes breathe { 0% { transform: scale(.62); } 40% { transform: scale(1); } 100% { transform: scale(.62); } }

/* ── боковая колонка на широком экране (P-11/P-12/P-18/P-21/P-22) ── */
.rail { display: none; }

/* ── меню кабинета пациента (P-31): один список, два размещения —
   сайдбар на широком экране (.rail выше), горизонтальная прокрутка
   внизу на телефоне. Отдельный класс .cabinet-nav, чтобы не задевать
   остальные .rail (auth/self-check/документы) — у них его нет, и на
   телефоне они как были без меню, так и остаются. */
@media (max-width: 1079.98px) {
	body.shell-inner.has-cabinet-nav { padding-bottom: 152px; }
	body.shell-inner.has-cabinet-nav.no-crisisbar { padding-bottom: 56px; }
	.cabinet-nav {
		display: flex; position: fixed; left: 0; right: 0; bottom: 96px; z-index: 45;
		background: var(--paper); border-top: 1px solid var(--line);
		overflow-x: auto; padding: 10px var(--sp-4); gap: var(--sp-4);
	}
	body.shell-inner.no-crisisbar .cabinet-nav { bottom: 0; }
	.cabinet-nav .card { background: none; border: 0; padding: 0; margin: 0; }
	.cabinet-nav .rail-links { display: flex; flex-direction: row; gap: var(--sp-4); }
	.cabinet-nav .rail-links a { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 0; margin: 0; white-space: nowrap; font-size: 11px; border-radius: 0; color: var(--ink-3); text-decoration: none; }
	.cabinet-nav .rail-links a .ico { display: block; flex: none; color: var(--ink-2); }
	.cabinet-nav .rail-links a:hover { background: none; }
	.cabinet-nav .rail-links a.on { background: none; color: var(--primary); }
	.cabinet-nav .rail-links a.on .ico { color: var(--primary); }
	.cabinet-nav .rail-links a.on .lbl { font-weight: 600; }
	.cabinet-nav .id-card { display: none; }
}
.rail-links a .ico { display: none; }

@media (min-width: 1080px) {
	body.shell-inner { background: radial-gradient(120% 80% at 10% 14%, #EDF2F0 0%, rgba(237, 242, 240, 0) 56%), var(--bg); }
	body.shell-inner .hdr { max-width: 1100px; }
	body.shell-inner main { max-width: 1120px; display: grid; grid-template-columns: minmax(0, var(--col)) 300px; gap: var(--sp-4); align-items: start; justify-content: center; }
	body.shell-inner main > * { grid-column: 1; }
	body.shell-inner .rail { display: block; grid-column: 2; grid-row: 1 / span 30; position: sticky; top: 112px; }
	.rail .card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-5); margin-bottom: var(--sp-3); }
	.rail .card-tel { background: var(--crisis-tint); border-color: var(--crisis-line); }
	.rail .big { font-size: 22px; font-weight: 700; color: var(--crisis-ink); font-variant-numeric: tabular-nums; margin: 0 0 4px; }
	.rail .eyebrow { margin: 0 0 var(--sp-2); }
	.rail h3 { font-size: 16px; letter-spacing: -.01em; margin: 0 0 var(--sp-2); }
	.rail p { font-size: 14px; color: var(--ink-2); margin: 0 0 var(--sp-2); }
	.rail .fine { font-size: 12.5px; color: var(--ink-3); display: flex; gap: 8px; align-items: flex-start; line-height: 1.5; }
	.rail-links { display: flex; flex-direction: column; gap: 2px; }
	.rail-links a { padding: 10px 12px; margin: 0 -12px; border-radius: var(--r-sm); font-size: 15px; font-weight: 600; color: var(--ink-2); text-decoration: none; }
	.rail-links a:hover { background: var(--surface); }
	.rail-links a.on { color: var(--primary); background: var(--primary-tint); }
	body.shell-inner .crisisbar .inner { max-width: 1100px; }
	/* без .rail внутри — пустая вторая колонка grid'а тащит контент влево
	   от истинного центра, схлопываем обратно в блок (P-108/P-109/P-110).
	   Ширина (--col-wide) уже задана вне media query, здесь только display. */
	body.shell-inner main:not(:has(.rail)) { display: block; }

	body.shell-selfcheck {
		background: radial-gradient(120% 80% at 12% 16%, #EDF2F0 0%, rgba(237, 242, 240, 0) 58%),
			radial-gradient(90% 70% at 88% 84%, #FBEAE6 0%, rgba(251, 234, 230, 0) 62%), var(--bg);
	}
	/* кризисные экраны — тот же приём, но акцентный цвет первым, тон теплее */
	body.shell-selfcheck.crisis-tint {
		background: radial-gradient(120% 80% at 10% 14%, #FBEAE6 0%, rgba(251, 234, 230, 0) 55%),
			radial-gradient(90% 70% at 92% 88%, #EDF2F0 0%, rgba(237, 242, 240, 0) 60%), var(--bg);
	}
	body.shell-selfcheck .hdr { max-width: 1080px; }
	body.shell-selfcheck main { max-width: 1080px; display: grid; grid-template-columns: 300px minmax(0, var(--col-narrow)); column-gap: var(--sp-7); row-gap: 0; align-items: start; justify-content: center; }
	body.shell-selfcheck main > * { grid-column: 2; }
	body.shell-selfcheck .rail { display: block; grid-column: 1; grid-row: 1 / span 20; position: sticky; top: 112px; }
	/* кольцо-декорация левой rail: делят P-13 (инструменты) и P-16/17 (самопроверка) */
	body.shell-selfcheck .rail .ring { width: 112px; height: 112px; border-radius: 50%; border: 1px solid rgba(20, 98, 94, .18); display: grid; place-items: center; margin-bottom: var(--sp-5); }
	body.shell-selfcheck .rail .ring span { width: 56px; height: 56px; border-radius: 50%; background: var(--surface-2); }
	body.shell-selfcheck .rail h2 { font-size: 22px; line-height: 1.3; letter-spacing: -.018em; font-weight: 600; margin: 0 0 var(--sp-4); max-width: 15ch; }
	body.shell-selfcheck .rail p { margin: 0 0 var(--sp-4); max-width: 30ch; }
	body.shell-selfcheck .crisisbar .inner { max-width: 1080px; }

	/* результат/кризис: боковая колонка справа, а не слева, как у P-16/17 */
	body.shell-selfcheck.rail-right main { grid-template-columns: minmax(0, var(--col-narrow)) 300px; }
	body.shell-selfcheck.rail-right main > * { grid-column: 1; }
	body.shell-selfcheck.rail-right .rail { grid-column: 2; }
	body.shell-selfcheck.rail-right .priv-note { display: none; }

	/* план безопасности (P-23): без боковой колонки вообще, просто
	   узкая колонка по центру на любой ширине — так и в источнике */
	body.shell-selfcheck.no-rail main { display: block; max-width: var(--col-narrow); }
}

/* ── адаптив общих компонентов ─────────────────────────────── */
@media (max-width: 900px) {
	body { padding-bottom: 96px; }
	.wrap, .hdr, .crisisbar .inner { padding-inline: 18px; }
	.crisisbar .txt { width: 100%; margin-bottom: 2px; }
	.crisisbar .btn { flex: 1; }
}
.hdr-crisis span.short { display: none; }
@media (max-width: 560px) {
	.langbtn span.full { display: none; }
	.signin-btn { padding: 8px 12px; }
	.hdr { padding-inline: 14px; }
	.hdr-crisis { padding: 8px 10px; }
	.hdr-crisis span.full { display: none; }
	.hdr-crisis span.short { display: inline; }
}

/* auth/self-check шапки — мало элементов (лого, назад/выход, язык,
   иногда выйти/войти), гамбургеру нечего скрывать: остаются строкой на
   любой ширине, без .hdr-menu/.hdr-burger (их в этих layout нет вообще). */