/* Карта диплома 2026/27, разделы (практики, текст ВКР, доказательства, примеры, вопросы, «Ещё»).
   Бывший assets/style.css сайта v1, приведённый к токенам карты v2 (design/style_v2.md, разделы 5 и 6):
   та же бумага и чернила, лайм только у «сегодня», «следующего» и «отмечено», цвета дорожек только как квадратик 8 px перед словом,
   шкала кеглей 12, 13, 14, 15, 17, 20, 24, 40, шаг отступов 4, 8, 12, 16, 24, веса 400 и 700, радиусы 8 и 14.
   Оболочка на языке рамки карты: строка состояния с лаймовым ярлыком даты, разделы словами, кнопки в стиле v2.
   Правила главной, карты, страницы точки, отметок и «Моего прогресса» v1 убраны. Сначала телефон, потом компьютер. */

/* Golos Text локально (OFL 1.1, ../assets/fonts/OFL.txt), два подмножества; запасной шрифт той же ширины */
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 900; font-display: swap; src: url("../assets/fonts/GolosText-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 900; font-display: swap; src: url("../assets/fonts/GolosText-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; }
/* метрики запасного шрифта подобраны по замеру высоты длинных страниц (круг правок 1): при 96% запасной шрифт был уже Golos Text на 5-8%,
   строки переносились иначе и страница текста ВКР без woff2 была короче на 3,4%; с этими значениями разница на практиках и тексте ВКР не выше 0,25%, на остальных не выше 0,7% */
@font-face { font-family: "Golos Fallback"; font-weight: 100 599; src: local("Helvetica Neue"), local("Arial"), local("Roboto"); size-adjust: 104.5%; ascent-override: 85%; descent-override: 22%; }
@font-face { font-family: "Golos Fallback"; font-weight: 600 900; src: local("Helvetica Neue Bold"), local("HelveticaNeue-Bold"), local("Arial Bold"), local("Arial-BoldMT"), local("Roboto Bold"); size-adjust: 102%; ascent-override: 87%; descent-override: 23%; }

:root {
  --paper: #F4F3EE; --card: #FFFFFF; --paper-2: #EAE8E1; --paper-3: #DDDAD1;
  --ink: #15161A; --ink-2: #55575E; --ink-3: #6B6D74;
  --hair: rgba(21, 22, 26, .12); --hair-2: rgba(21, 22, 26, .24);
  --mark: #D7F542; --on-mark: #15161A;
  --bad: #C43A24; --bad-soft: rgba(196, 58, 36, .1);
  --font: "Golos Text", "Golos Fallback", system-ui, sans-serif;
  --r: 14px; --r2: 8px;
  --gutter: max(16px, env(safe-area-inset-left), env(safe-area-inset-right)); --max: 1180px; --side: 320px;
  --top: 56px; --safe-b: env(safe-area-inset-bottom, 0px); --safe-t: env(safe-area-inset-top, 0px);
  /* оболочка (строка состояния и нижние вкладки) теми же цветами и размерами, что на карте (v2/style.css): серый текста и красный «просрочено» там темнее */
  --fr-ink-2: #404248; --fr-bad: #962411; --fr-hair: rgba(21, 22, 26, .14); --fr-hair-2: rgba(21, 22, 26, .32); --tabs-pad: 4px; --tab: calc(48px + 2 * var(--tabs-pad));
}
@media (max-height: 600px) { :root { --tabs-pad: 2px; } }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #131316; --card: #1C1C21; --paper-2: #24242A; --paper-3: #2F2F36;
    --ink: #F1EFE8; --ink-2: #B3B1AA; --ink-3: #8A8984;
    --hair: rgba(241, 239, 232, .13); --hair-2: rgba(241, 239, 232, .26);
    --mark: #C9EC3C; --bad: #F07560; --bad-soft: rgba(240, 117, 96, .14);
    --fr-ink-2: #C4C2BB; --fr-bad: #FA9C8B; --fr-hair: rgba(241, 239, 232, .15); --fr-hair-2: rgba(241, 239, 232, .34);
  }
}
:root[data-theme="dark"] {
  --paper: #131316; --card: #1C1C21; --paper-2: #24242A; --paper-3: #2F2F36;
  --ink: #F1EFE8; --ink-2: #B3B1AA; --ink-3: #8A8984;
  --hair: rgba(241, 239, 232, .13); --hair-2: rgba(241, 239, 232, .26);
  --mark: #C9EC3C; --bad: #F07560; --bad-soft: rgba(240, 117, 96, .14);
  --fr-ink-2: #C4C2BB; --fr-bad: #FA9C8B; --fr-hair: rgba(241, 239, 232, .15); --fr-hair-2: rgba(241, 239, 232, .34);
}

/* ---------- база ---------- */
* { box-sizing: border-box; }
/* содержимое не уходит под нижние вкладки (N11): снизу поле высотой панели плюс 16 px, у прокрутки к якорю тот же запас */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--top) + var(--safe-t) + 64px); scroll-padding-bottom: calc(var(--tab) + var(--safe-b) + 16px); }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font); font-size: 15px; line-height: 1.45; overflow-x: hidden; font-feature-settings: "tnum" 1; font-variant-numeric: tabular-nums; font-synthesis: none; padding-bottom: calc(var(--tab) + var(--safe-b) + 16px); }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
b { font-weight: 700; }
h1, h2, h3 { margin: 0; line-height: 1.15; letter-spacing: -.01em; font-weight: 700; text-wrap: balance; }
p, li, dd, td, .lead, .pf, .pl, .rtitle { text-wrap: pretty; }
.pq { text-wrap: balance; }
h1 { font-size: 24px; }
h2 { font-size: 20px; margin: 0 0 12px; }
h3 { font-size: 17px; line-height: 1.25; }
p { margin: 0 0 1em; }
ul, ol, dl, dd, blockquote, figure { margin: 0; padding: 0; }
.muted { color: var(--ink-3); }
.text { font-size: 17px; line-height: 1.45; max-width: 64ch; }
.skip { position: absolute; left: -999px; top: 0; display: inline-flex; align-items: center; min-height: 44px; background: var(--ink); color: var(--paper); padding: 0 16px; border-radius: 0 0 var(--r2) var(--r2); }
.skip:focus { left: 8px; z-index: 50; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 4px; }
.main:focus, h1:focus { outline: none; }
.eyebrow { font-size: 13px; font-weight: 700; color: var(--ink-3); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
/* квадратик дорожки у первой строки, когда подпись в две строки */
.eyebrow .tk { align-self: flex-start; margin-top: 5px; }
.lead { font-size: 17px; line-height: 1.45; color: var(--ink-2); max-width: 62ch; margin-bottom: 0; }
.page-h { margin-bottom: 24px; }
.page-h .lead { margin-top: 12px; }
.narrow { max-width: 720px; }
.sec { margin-top: 48px; }
.sec.first { margin-top: 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; min-width: 48px; padding: 0 16px; border-radius: 999px; background: var(--ink); color: var(--paper); font-weight: 700; font-size: 15px; white-space: nowrap; touch-action: manipulation; }
/* единый приём выноски (замечание 4, 09.11): карточка с рамкой 1 px --hair по всему периметру и скруглением --r, смысл несёт фишка в верхней строке,
   а не цвет края. Полос слева (border-left цветом, ::before в несколько пикселей, inset-тень) нет нигде, на «Примерах» тоже (.ex-c) */
.note { background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 12px 16px 16px; margin: 0 0 24px; color: var(--ink-2); font-size: 15px; max-width: 64ch; }
.note p { margin: 0; }
.note b { color: var(--ink); }
.note.warn { background: var(--bad-soft); color: var(--ink); }
.fchip { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; line-height: 18px; color: var(--ink-2); background: var(--paper-2); border-radius: 999px; padding: 3px 10px; margin: 0 0 8px; white-space: nowrap; }
.fchip i { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 16px; height: 16px; border-radius: 50%; background: var(--bad); color: var(--card); font-style: normal; font-size: 12px; line-height: 1; }
.fchip.warn { background: var(--card); color: var(--ink); }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cond { display: inline-block; font-size: 13px; font-weight: 700; color: var(--ink-3); border: 1px solid var(--hair-2); border-radius: 6px; padding: 0 6px; margin-right: 8px; line-height: 18px; vertical-align: 1px; }
.num { font-size: 13px; font-weight: 700; color: var(--ink-3); white-space: nowrap; }
.cm { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: var(--ink); color: var(--paper); font-style: normal; font-weight: 700; font-size: 13px; line-height: 1; margin-right: 6px; vertical-align: 2px; }
.hl { animation: hl 1.8s ease-out; }
@keyframes hl { 0% { background-color: var(--paper-2); } 100% { background-color: transparent; } }

/* фильтры и переключатели: выбранное везде залито чернилами, как кнопка «К году» на карте */
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.chip { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--hair-2); font-size: 14px; font-weight: 700; color: var(--ink-2); }
.chip .cnt { font-weight: 400; color: var(--ink-3); }
/* наведение только там, где есть мышь (T14, m1): на телефоне подсветка не залипает после касания */
@media (hover: hover) { .chip:hover { border-color: var(--ink); color: var(--ink); } }
.chip.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.chip.on .cnt { color: var(--paper); opacity: .7; }
.chips-col { flex-direction: column; align-items: stretch; margin: 0; }
.chips-col .chip { border-radius: var(--r2); justify-content: space-between; }
.seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; background: var(--paper-2); border-radius: var(--r); margin-bottom: 24px; max-width: 100%; }
.seg a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 8px; border-radius: var(--r2); font-size: 14px; font-weight: 700; color: var(--ink-2); text-align: center; line-height: 1.2; }
.seg .on { background: var(--ink); color: var(--paper); }
.seg .on .tk { box-shadow: 0 0 0 1.5px var(--paper); }
/* переключатель практик (замечание 5): 13 px, подписи не переносятся; на 320-379 px две строки по две фишки, от 380 px одна строка */
.seg.prac-seg { display: flex; }
.prac-seg a { flex: 1 1 auto; gap: 6px; padding: 0 10px; font-size: 13px; white-space: nowrap; }
@media (min-width: 720px) { .seg.prac-seg { display: inline-flex; } .prac-seg a { flex: none; padding: 0 16px; } }
@media (max-width: 379px) { .seg.prac-seg { display: grid; grid-template-columns: 1fr 1fr; grid-auto-flow: row; } }
.case-seg .long { display: none; }

/* практики: цвет дорожки маленьким квадратиком перед словом, без полос */
.tk { display: inline-block; width: 8px; height: 8px; border-radius: 2px; background: var(--tc, var(--ink-3)); vertical-align: 1px; flex: 0 0 8px; }
.tw { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--ink-2); }

/* ---------- оболочка: строка состояния как на карте, разделы словами, вкладки телефона, подвал ---------- */
/* линии шапки и вкладок рисуются тенью, не рамкой: на телефоне шапка 56 и вкладки 56 дают ровно 112 px */
/* верхнее безопасное поле внутри шапки (D7), как у карты: строка состояния не уходит под вырез и полупрозрачную строку телефона */
.top { position: sticky; top: 0; z-index: 30; background: var(--paper); box-shadow: 0 1px 0 var(--hair); padding-top: var(--safe-t); }
.top-in { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); min-height: var(--top); display: flex; align-items: center; gap: 16px; }
.st { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1 auto; height: var(--top); }
.st .chip { flex: none; background: var(--mark); color: var(--on-mark); border-radius: var(--r2); padding: 6px 10px; font-size: 15px; font-weight: 700; line-height: 1.2; white-space: nowrap; border: 0; min-height: 0; }
.st .chip .l { display: none; }
.st .where { min-width: 0; font-size: 15px; font-weight: 700; line-height: 1.2; }
/* строка состояния как на карте (N8, F14): две строки по 15 px, «Модуль II» не рвётся (первая строка без переноса), «просрочено N» красным словом и ссылкой
   в список карты; если не входит, сначала уходит «неделя N из 42» (класс nw), затем строка сессии (ns), как на карте */
.st .w1, .st .w2 { display: block; }
.st .w1 { white-space: nowrap; overflow: hidden; }
.st .w2 { color: var(--fr-ink-2); font-weight: 400; }
.st .w2 span { white-space: nowrap; }
/* поля по высоте расширяют зону нажатия ссылки до 44 px, строку они не сдвигают */
.st .w2 .late { color: var(--fr-bad); font-weight: 700; white-space: nowrap; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; touch-action: manipulation; padding: 13px 6px; margin: 0 -6px; }
.st.nw .w2 .wk, .st.nw .w2 .wk + .sep { display: none; }
.st.ns .w1 .ss { display: none; }
.secs { display: none; }
.secs a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 999px; font-size: 15px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
@media (hover: hover) { .secs a:hover { color: var(--ink); background: var(--paper-2); } }
.secs a.on { background: var(--ink); color: var(--paper); }
/* цвет задан явно: правило .secs a по специфичности перебивало бы .btn, и слово читалось бы чернилами по чернилам */
.secs .btn.map { margin-left: 8px; min-height: 44px; color: var(--paper); }
@media (hover: hover) { .secs .btn.map:hover { background: var(--ink-2); } }
/* нижние вкладки телефона словами в стиле кнопок карты: «Карта» первой; выбранная залита чернилами */
/* вид тот же, что у панели карты (v2/style.css, Р1): зона 48 px, подпись 15 px жирным, зазор 2 px, «Текст ВКР» на 400-414 px переносится по пробелу */
.tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; background: var(--paper); box-shadow: 0 -1px 0 var(--fr-hair); padding: var(--tabs-pad) max(4px, env(safe-area-inset-right)) calc(var(--tabs-pad) + var(--safe-b)) max(4px, env(safe-area-inset-left)); }
/* текущая вкладка залита прямоугольником со скруглением 14 px, как на карте (D6) */
.tabbar a { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 0; border-radius: 14px; font-size: 15px; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; text-align: center; color: var(--fr-ink-2); touch-action: manipulation; }
.tabbar a.on { background: var(--ink); color: var(--paper); }
.tabbar a:active { background: var(--paper-2); }
.tabbar a.on:active { background: var(--ink); }
/* до 399 px четыре вкладки: «Текст ВКР» уходит в «Ещё». При пяти колонках подпись «Текст ВКР» (67 px) не помещается во внутренние 59..65 px на 360..390, а с четырьмя у каждой подписи не меньше 10 px воздуха */
@media (max-width: 399px) { .tabbar { grid-template-columns: repeat(4, minmax(0, 1fr)); } .tabbar a[data-nav="vkr"] { display: none; } }
/* пять вкладок от 400 px: поле 2 px внутри вкладки, «Текст ВКР» на 400-414 px встаёт в две строки, а не упирается буквами в края заливки (D6) */
@media (min-width: 400px) { .tabbar a { padding: 0 2px; } }
.main { max-width: var(--max); margin: 0 auto; padding: 24px var(--gutter) 48px; }
.foot { border-top: 1px solid var(--hair); margin-top: 24px; }
.foot-in { max-width: var(--max); margin: 0 auto; padding: 16px var(--gutter) 24px; font-size: 13px; color: var(--ink-3); line-height: 1.4; display: flex; flex-direction: column; gap: 8px; }
/* переключатель темы словами, три положения, как в меню карты (T16, F12): три кнопки в один ряд на всех окнах, 48 px, выбранная обводкой 3 px и галочкой, не заливкой */
.theme-sw { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-items: center; max-width: 480px; }
.theme-l { grid-column: 1 / -1; font-size: 13px; font-weight: 700; color: var(--ink-3); }
.btn-th { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; min-height: 48px; padding: 0 6px; border-radius: 12px; border: 2px solid var(--fr-hair-2); font-weight: 700; font-size: 15px; line-height: 1.1; color: var(--ink); background: var(--card); text-align: center; touch-action: manipulation; }
.btn-th.on { border: 3px solid var(--ink); }
.btn-th.on::before { content: ""; flex: none; width: 6px; height: 11px; margin: -3px 2px 0 0; border: solid var(--ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.btn-th:active { background: var(--paper-2); }
@media (hover: hover) { .btn-th:hover { border-color: var(--ink); } }
/* 320-359 px: в кнопке 91 px галочка наезжала на «Как в системе»; выбранную отличает рамка 3 px */
@media (max-width: 359px) { .btn-th { padding: 0 4px; font-size: 14px; } .btn-th.on::before { display: none; } }
.sec .theme-sw + .muted { margin: 12px 0 0; font-size: 13px; }

/* ---------- общая сетка страницы: колонка и боковая панель ---------- */
.pg { display: flex; flex-direction: column; gap: 24px; }
.pg-main { min-width: 0; }
.pg-side { min-width: 0; }
.side-box { background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 16px; }
.side-box + .side-box { margin-top: 16px; }
.side-box h2 { font-size: 17px; margin-bottom: 8px; }
.side-box .rows .row-link { padding: 8px 0; min-height: 48px; }
.side-box .rows .rtitle { font-size: 14px; }
.side-box .more-link { margin-top: 4px; }
.more-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; font-size: 14px; font-weight: 700; color: var(--ink-2); border-top: 1px solid var(--hair); width: 100%; }
.more-link::after { content: "→"; margin-left: 8px; }
@media (hover: hover) { .more-link:hover { color: var(--ink); } }

/* ---------- компактная строка срока: ссылка на карточку точки на карте, без кнопок отметки ---------- */
.rows { display: flex; flex-direction: column; }
.row { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--hair); }
.rows > .row:last-child { border-bottom: 0; }
.row-link { flex: 1; min-width: 0; display: grid; grid-template-columns: 60px 1fr; grid-template-rows: auto auto; column-gap: 12px; row-gap: 4px; padding: 12px 0; min-height: 56px; align-items: center; }
.rdate { grid-row: 1 / span 2; font-weight: 700; font-size: 14px; white-space: nowrap; align-self: start; padding-top: 2px; display: flex; flex-direction: column; }
.rdate i { font-style: normal; font-weight: 400; font-size: 13px; color: var(--ink-3); }
.rtitle { font-size: 14px; font-weight: 400; line-height: 1.35; }
.rtitle .num { margin-left: 8px; }
.row.ms .rtitle { font-weight: 700; }
.rmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 13px; color: var(--ink-3); }
.rtr { display: inline-flex; flex-wrap: wrap; gap: 4px 8px; }
.rtr .tw { font-size: 13px; color: var(--ink-3); gap: 4px; }
.rwhen { font-size: 13px; white-space: nowrap; }
/* слово «отмечено» читается из отметок карты (kd.v2.done): строка приглушена, отметка словом и лаймом */
.row.done .rtitle { color: var(--ink-3); text-decoration: line-through; }
.row.done .rdate { color: var(--ink-3); }
.row.done .rwhen { color: var(--on-mark); font-weight: 700; background: var(--mark); padding: 0 6px; border-radius: 5px; line-height: 20px; }
.row.late .rdate, .row.late .rwhen { color: var(--bad); }
/* «следующее» лаймовой плашкой у слова, как «отмечено», без полосы слева */
.row.is-next .rwhen { color: var(--on-mark); font-weight: 700; background: var(--mark); padding: 0 6px; border-radius: 5px; line-height: 20px; }
@media (hover: hover) { .row:hover .rtitle { text-decoration: underline; text-underline-offset: 3px; } }

/* ---------- практики ---------- */
.pr-cards { display: grid; grid-template-columns: 1fr; gap: 12px; }
.pr-card { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); }
.pt-lab { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 400; line-height: 1.3; color: var(--ink-2); }
.pt-lab b { color: var(--ink); }
.pt-lab .tk { background: var(--tc); }
.pr-card .pq { font-size: 20px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; }
.pr-card .pn { font-size: 14px; font-weight: 700; color: var(--ink-2); }
.pr-card .pl { font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.pr-card .pflag { font-size: 14px; color: var(--ink-2); line-height: 1.4; }
.pr-card .pf { font-size: 13px; color: var(--ink-3); margin-top: auto; padding-top: 4px; }
@media (hover: hover) { .pr-card:hover { border-color: var(--hair-2); } }
/* таблица «результат × практика» (замечание 5): на телефоне фишки практик под названием, первой та, где результат сдаётся;
   на компьютере три колонки под заголовками практик со словами «сдаётся» и «засчитывается» */
.tr-how { font-size: 14px; color: var(--ink-2); line-height: 1.7; margin: 0 0 12px; max-width: 64ch; }
/* «сдаётся» залитой чернилами фишкой, «засчитывается» фишкой с рамкой и галочкой в кружке: в подсказке, в строках телефона и в колонках компьютера одинаково */
.tm-key, .tm { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1.2; white-space: nowrap; vertical-align: 1px; }
.tm-key.s, .tm.s { background: var(--ink); color: var(--paper); }
.tm-key.c, .tm.c { color: var(--ink); box-shadow: inset 0 0 0 1px var(--hair-2); padding-left: 6px; }
.tm.s .tk { box-shadow: 0 0 0 1.5px var(--paper); }
.tm-i { position: relative; display: inline-block; flex: none; width: 16px; height: 16px; border-radius: 50%; box-sizing: border-box; border: 1.5px solid var(--ink-2); }
/* «засчитывается» отмечено плюсом в кружке, а не галочкой: галочка на сайте значит «Готово к сдаче» (судьи 10.11, m4) */
.tm-i::before, .tm-i::after { content: ""; position: absolute; left: 50%; top: 50%; background: var(--ink); border-radius: 1px; transform: translate(-50%, -50%); }
.tm-i::before { width: 8px; height: 1.5px; }
.tm-i::after { width: 1.5px; height: 8px; }
.transfers { border-top: 1px solid var(--hair); }
.tr-head { display: none; }
.tr-row .row-link { grid-template-rows: auto auto; row-gap: 8px; }
.tm-cells { grid-column: 2; display: flex; flex-wrap: wrap; gap: 6px; }
.tm.s { order: -1; }
.tm.n { display: none; }
.tm-p { display: inline-flex; align-items: center; gap: 5px; }
/* куда ведёт строка: на телефоне подпись «на карте ›» под фишками, на компьютере строка целиком ссылка, как в других таблицах сроков */
.tr-go { grid-column: 2; justify-self: start; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--ink-2); }
.tr-go::after { content: ""; width: 6px; height: 6px; border: solid currentColor; border-width: 2px 2px 0 0; transform: rotate(45deg); }
.tr-off { display: block; margin-top: 2px; font-size: 13px; font-weight: 400; color: var(--ink-3); }
/* inline-block: зачёркивание названия отмеченной строки не переходит на слово «отмечено» */
.tr-row .rwhen { display: inline-block; margin-left: 8px; font-size: 13px; white-space: nowrap; }
@media (max-width: 719px) { .tm .tm-w { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.formal { background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 12px 16px; margin: 4px 0 24px; }
.formal .lab { display: block; font-size: 13px; font-weight: 700; color: var(--ink-3); margin-bottom: 4px; }
.formal p { margin: 0; font-size: 17px; line-height: 1.45; }
.prac .note.warn { max-width: none; }
.two { display: grid; grid-template-columns: 1fr; gap: 24px; }
.var { background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 16px; }
.var h3 { margin-bottom: 8px; }
.var p { font-size: 14px; color: var(--ink-2); }
.var .checks li { font-size: 15px; }
.var .rule { margin: 12px 0 0; padding-top: 8px; border-top: 1px solid var(--hair); font-size: 14px; }
.struct { list-style: none; counter-reset: st; display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--hair); }
.struct li { counter-increment: st; display: grid; grid-template-columns: 36px 1fr; gap: 8px; padding: 8px 0; min-height: 44px; border-bottom: 1px solid var(--hair); font-size: 15px; align-items: baseline; }
.struct li::before { content: counter(st, decimal-leading-zero); font-weight: 700; font-size: 13px; color: var(--ink-3); }
/* список глав ВКР: подписи как в оглавлении («Введение», 1-9, «Выводы»), а не сквозной счётчик */
.struct.named li { grid-template-columns: 76px 1fr; }
.struct.named li::before { content: attr(data-n); font-size: 13px; }
.after-struct { margin-top: 12px; font-size: 14px; }
.checks, .crosses, .dots { list-style: none; display: flex; flex-direction: column; gap: 8px; max-width: 64ch; }
.checks li, .crosses li, .dots li { position: relative; padding-left: 28px; font-size: 17px; line-height: 1.45; }
/* пункты «засчитывается»: пустой кружок с галочкой, не залитый лаймом, иначе они читаются как уже отмеченные */
.checks li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; border: 1.5px solid var(--ink-3); }
.checks li::after { content: ""; position: absolute; left: 5px; top: 7px; width: 8px; height: 5px; border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(-45deg); }
.crosses li::before { content: ""; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--paper-3); }
.crosses li::after { content: "×"; position: absolute; left: 0; top: 2px; width: 18px; text-align: center; font-weight: 700; font-size: 14px; line-height: 20px; color: var(--ink-2); }
.dots li::before { content: ""; position: absolute; left: 5px; top: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }

/* ---------- текст ВКР и доказательства ---------- */
.case-ex { font-size: 14px; color: var(--ink-2); max-width: 64ch; margin: 0 0 16px; }
/* полоса глав на телефоне: закреплена под шапкой, у каждой главы короткое название, полоса прокручивается вбок */
.toc-chips { position: sticky; top: calc(var(--top) + var(--safe-t)); z-index: 15; background: var(--paper); display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 calc(var(--gutter) * -1) 16px; padding: 8px var(--gutter) 8px; scrollbar-width: none; }
.toc-chips::-webkit-scrollbar { display: none; }
/* полоса не вошла в окно: у правого края тень, видно, что полоса листается (судьи 10.11, студент M3) */
.toc-chips.more { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent); }
.toc-chips a { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 999px; border: 1.5px solid var(--hair-2); font-size: 14px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.toc-chips a span { display: inline; margin-left: 6px; font-weight: 400; }
.toc-chips a.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.toc-box { display: none; }
.toc { display: none; flex-direction: column; }
.toc a { display: grid; grid-template-columns: 24px 1fr; gap: 8px; align-items: baseline; padding: 8px; margin: 0 -8px; min-height: 44px; border-radius: var(--r2); font-size: 14px; color: var(--ink-2); line-height: 1.3; }
.toc a b { font-weight: 700; color: var(--ink-3); font-size: 13px; }
@media (hover: hover) { .toc a:hover { color: var(--ink); background: var(--paper-2); } }
.toc a.on { color: var(--ink); font-weight: 700; background: var(--paper-2); }
.toc a.on b { color: var(--ink); }
.chapters { border-top: 1px solid var(--hair); }
.chapter { padding: 24px 0; border-bottom: 1px solid var(--hair); display: flex; flex-direction: column; gap: 8px; }
.ch-n { font-size: 13px; font-weight: 700; color: var(--ink-3); }
.ch-body h2 { margin-bottom: 4px; }
.ch-title { font-size: 14px; color: var(--ink-2); margin-bottom: 8px; }
.kv { display: flex; flex-direction: column; border-top: 1px solid var(--hair); margin: 8px 0 0; }
.kv > div { display: grid; grid-template-columns: 1fr; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--hair); }
.kv dt { font-size: 13px; font-weight: 700; color: var(--ink-3); }
.kv dd { font-size: 15px; line-height: 1.45; }
.chapter .kv dd { font-size: 17px; }
/* случай (коммерческий или социальный) отдельной карточкой с фишкой-названием */
.chapter .kv .case { margin-top: 12px; padding: 12px 16px 16px; gap: 8px; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); }
.chapter .kv .case dt { justify-self: start; color: var(--ink); background: var(--paper-2); border-radius: 999px; padding: 3px 10px; line-height: 18px; }
.rules { display: grid; grid-template-columns: 1fr; gap: 24px; }
.scale { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 8px; }
.sc { display: grid; grid-template-columns: 84px 1fr; column-gap: 16px; align-items: start; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 12px 16px; }
.sc b { font-size: 24px; font-weight: 700; letter-spacing: -.01em; line-height: 1; white-space: nowrap; justify-self: start; }
/* верх шкалы подчёркнут серым: лайм на сайте значит «сегодня», «следующее» и «отмечено» */
.sc.max b { box-shadow: inset 0 -8px 0 var(--paper-3); }
.sc span { font-size: 14px; color: var(--ink-2); line-height: 1.45; }
.scale + .muted { font-size: 13px; }
.pg-side .scale { grid-template-columns: 1fr; }
.pg-side .sc { grid-template-columns: 84px 1fr; column-gap: 12px; }
.scale-mobile { margin-bottom: 24px; }
/* на телефоне шкала оценки и темы вопросов показаны один раз, вверху; боковая панель только на компьютере */
.ev .pg-side, .faq-page .pg-side { display: none; }
/* лестница доказательств (замечание 6): уровень читается шкалой «уровень k из N» (N делений одной ширины, k залиты) и фишкой баллов;
   сверху высший уровень, у него все деления и фишка залиты чернилами. Толщина края уровень не кодирует */
.ladder-how { font-size: 14px; color: var(--ink-2); margin: 0 0 12px; }
.ladder { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.rung { display: flex; flex-direction: column; gap: 8px; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 12px 16px 16px; }
.r-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.r-lvl { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.meter { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 10px; gap: 2px; }
.meter i { height: 8px; border-radius: 2px; box-shadow: inset 0 0 0 1px var(--hair-2); }
.meter i.on { background: var(--ink); box-shadow: none; }
.r-scale { font-size: 13px; font-weight: 700; line-height: 18px; color: var(--ink); border: 1px solid var(--hair-2); border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
.r-scale.max { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.r-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.r-body b { font-size: 17px; font-weight: 700; line-height: 1.25; }
.r-body p { margin: 0; }
.r-body .proof { font-size: 15px; color: var(--ink); line-height: 1.45; }
.r-body .proof .lab { font-weight: 700; }
/* пояснение уровня это основной текст, а не подпись (судьи 10.11, m7): 15 px, 13 px только у «уровень k из N» и фишки баллов */
.r-body .nt { font-size: 15px; color: var(--ink-2); line-height: 1.45; }
.nko { margin-top: 24px; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 16px; }
.nko h3 { margin-bottom: 8px; }
.nko p { font-size: 15px; color: var(--ink-2); }
.nko .dots li { font-size: 15px; }
.nko .muted { margin: 12px 0 0; font-size: 13px; }
.t { width: 100%; border-collapse: collapse; font-size: 14px; }
.t th { text-align: left; font-size: 13px; font-weight: 700; color: var(--ink-3); padding: 8px 12px 8px 0; border-bottom: 1px solid var(--hair-2); }
.t td { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--hair); vertical-align: top; line-height: 1.45; }
.t td b { font-size: 15px; }
.t thead { display: none; }
.t tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--hair); }
.t td { display: block; border: 0; padding: 4px 0; }
.t td[data-l]::before { content: attr(data-l); display: block; font-size: 13px; font-weight: 700; color: var(--ink-3); margin-bottom: 2px; }
.t td:first-child { padding-bottom: 4px; }
.tbl-wrap + .muted { margin-top: 12px; font-size: 13px; }

/* ---------- примеры (замечание 7): пара «Требует доработки» → «Готово к сдаче», «Почему», шаблоны документов ----------
   Обе версии пары это карточки одного вида (рамка 1 px --hair, скругление --r, фон --card); смысл несёт фишка в верхней строке:
   «Требует доработки» обведена, с пустым кружком, «Готово к сдаче» залита чернилами, с галочкой. Полос слева нет */
.g-sec h2 { scroll-margin-top: 64px; }
.g-note { font-size: 14px; color: var(--ink-2); max-width: 64ch; margin: -4px 0 16px; }
.g-grp + .g-grp { margin-top: 32px; }
.g-mod { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; font-size: 17px; padding: 0 0 12px; border-bottom: 1px solid var(--hair-2); }
.g-mod span { font-size: 14px; font-weight: 400; color: var(--ink-2); }
.g-grp.hl, .g-sec.hl { animation: none; }
.gallery { display: flex; flex-direction: column; }
.gitem { padding: 24px 0; border-bottom: 1px solid var(--hair); display: flex; flex-direction: column; gap: 12px; }
.g-head { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.g-head .fchip { margin: 0 0 4px; }
.g-ch { font-size: 13px; font-weight: 700; color: var(--ink-2); }
.g-t { font-size: 17px; line-height: 1.3; max-width: 52ch; margin: 0; font-weight: 700; letter-spacing: -.01em; text-wrap: balance; }
.glink { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.glink::after { content: "→"; margin-left: 8px; }
@media (hover: hover) { .glink:hover { color: var(--ink); } }
.ex { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; align-items: start; }
.ex-c { min-width: 0; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.ex-c > p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); }
.ex-lab { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; line-height: 18px; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
.ex-lab.w { color: var(--ink-2); border: 1px solid var(--hair-2); background: var(--card); }
.ex-lab.w i { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid currentColor; flex: none; }
.ex-lab.s { color: var(--paper); background: var(--ink); border: 1px solid var(--ink); }
.ex-lab.s i { width: 5px; height: 9px; margin: -2px 2px 0 1px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); flex: none; }
/* снимок документа как в карточке точки на карте: миниатюра 96 × 60 (верх документа) с подписью и кнопкой, целиком по нажатию */
.ex-fig { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: start; margin-top: 4px; }
.fig-crop { width: 96px; height: 60px; overflow: hidden; border: 1px solid var(--hair-2); border-radius: var(--r2); background: var(--paper-2); cursor: zoom-in; }
.fig-crop img { display: block; width: 100%; height: auto; }
.ex-fig.open { grid-template-columns: minmax(0, 1fr); }
.ex-fig.open .fig-crop { width: auto; height: auto; cursor: zoom-out; }
.fig-txt { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.ex-fig figcaption { font-size: 13px; color: var(--ink-2); line-height: 1.4; }
.fig-more { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; font-weight: 700; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; touch-action: manipulation; }
.g-why { display: flex; flex-direction: column; gap: 4px; max-width: 72ch; }
.g-why .lab { font-size: 13px; font-weight: 700; color: var(--ink-2); }
.g-why p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); }
.g-why .g-note { margin-top: 4px; font-size: 14px; color: var(--ink-2); }
.g-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; }
.g-tpl { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 14px; font-weight: 700; color: var(--ink); }
.g-tpl::after { content: "↓"; color: var(--ink-2); }
@media (hover: hover) { .g-tpl:hover { text-decoration: underline; text-underline-offset: 3px; } }
.g-mr { display: inline-block; font-size: 13px; color: var(--ink-2); line-height: 1.4; padding: 4px 0; }
/* значок документа: лист со скруглённым углом, рисуется рамкой, на любом фоне */
i.doc { display: inline-block; width: 11px; height: 14px; border: 1.5px solid currentColor; border-radius: 2px 5px 2px 2px; flex: none; }
.fchip i.doc { background: none; color: inherit; border-radius: 2px 5px 2px 2px; width: 11px; height: 14px; }
/* шаблоны документов: карточки, превью заполненного шаблона лениво, кнопка «Скачать» с именем, форматом и весом */
.tpls { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.tpl { min-width: 0; display: flex; flex-direction: column; gap: 8px; background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 16px; }
.tpl .fchip { align-self: flex-start; margin: 0; }
.tpl h3 { font-size: 17px; line-height: 1.3; }
.tpl-p { margin: 0; font-size: 15px; color: var(--ink-2); }
.tpl .dots li { font-size: 14px; color: var(--ink); }
.btn.dl { white-space: normal; text-align: center; line-height: 1.25; padding: 8px 16px; margin-top: 4px; }
.btn.dl::before { content: "↓"; margin-right: 8px; }
@media (hover: hover) { .btn.dl:hover { opacity: .88; } }
/* полоса групп на телефоне: та же, что полоса глав «Текст ВКР»; число примеров обычным начертанием */
.g-chips a span { font-weight: 400; }
.toc-sub { margin-top: 16px; }
/* оглавление примеров: сначала название, число после него серым (судьи 10.11, m8), как в фишках телефона «Модуль I 3» */
.toc.g-toc a { grid-template-columns: minmax(0, 1fr) auto; }
.toc.g-toc a b { font-weight: 400; }
.toc.g-toc a.on b { font-weight: 700; }
/* примеры ещё грузятся: место высотой в экран, подвал не стоит посреди экрана (судьи 10.11, студент m1) */
.gal-wait { min-height: 100vh; }
.secs .sec-more { margin-left: 4px; }

/* ---------- вопросы, «Ещё» ---------- */
.faq { border-top: 1px solid var(--hair); }
.qa { border-bottom: 1px solid var(--hair); }
.qa summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; font-weight: 700; font-size: 17px; line-height: 1.3; min-height: 48px; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary svg { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: var(--ink-3); stroke-width: 2; transition: transform .2s; }
.qa[open] summary svg { transform: rotate(180deg); }
.qa p { padding: 0 0 12px; color: var(--ink-2); font-size: 17px; line-height: 1.45; max-width: 64ch; }
.qa-tags { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 12px; }
.qa-tags a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; font-weight: 700; color: var(--ink-3); border: 1px solid var(--hair); border-radius: var(--r2); padding: 0 12px; }
@media (hover: hover) { .qa-tags a:hover { color: var(--ink); border-color: var(--hair-2); } }
.prac .pg-side { order: -1; }
.linkrow { display: grid; grid-template-columns: 1fr; gap: 8px; }
/* стрелка стоит за названием, а не в отдельной колонке: описанию достаётся вся ширина карточки */
.linkrow a { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; border: 1px solid var(--hair); border-radius: var(--r); background: var(--card); min-height: 48px; justify-content: center; }
.linkrow a b { font-size: 15px; font-weight: 700; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.linkrow a b::after { content: "→"; color: var(--ink-3); flex: 0 0 auto; }
.linkrow a span { font-size: 13px; color: var(--ink-3); line-height: 1.4; }
@media (hover: hover) { .linkrow a:hover { border-color: var(--hair-2); } }
@media (hover: hover) { .linkrow a:hover b::after { color: var(--ink); } }

/* ---------- планшет ---------- */
@media (min-width: 720px) {
  .two { grid-template-columns: 1fr 1fr; }
  .struct { grid-template-columns: 1fr 1fr; column-gap: 24px; }
  .case-seg .long { display: inline; }
  .row-link { grid-template-columns: 76px 1fr auto; grid-template-rows: auto; column-gap: 16px; }
  .rdate { grid-row: auto; align-self: center; padding-top: 0; }
  /* метки сверху, отсчёт снизу: блоку справа нужно меньше ширины, заголовок реже переносится */
  .rmeta { justify-self: end; flex-direction: column; align-items: flex-end; gap: 2px; }
  .rtitle { font-size: 15px; }
  /* таблица «результат × практика»: срок, результат, три колонки практик */
  .transfers { border-top: 0; }
  .tr-head, .tr-row .row-link { display: grid; grid-template-columns: 76px minmax(0, 1fr) repeat(3, 128px); grid-template-rows: auto; column-gap: 16px; }
  .tr-head { padding: 0 0 8px; border-bottom: 1px solid var(--hair-2); font-size: 13px; font-weight: 700; color: var(--ink-3); align-items: end; }
  .tr-col { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); }
  .tm-cells { display: contents; }
  .tm, .tm.s { order: 0; justify-self: start; }
  .tm.c, .tm-key.c { box-shadow: none; padding: 0; font-weight: 400; color: var(--ink-2); }
  .tr-go { display: none; }
  .tm.n { display: inline-flex; padding: 0; }
  .tm.n::before { content: ""; width: 12px; height: 2px; border-radius: 1px; background: var(--hair-2); }
  .tm .tm-p { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .side-box .row-link { grid-template-columns: 1fr; grid-template-rows: auto auto; }
  .side-box .rdate { grid-row: auto; }
  .side-box .rmeta { justify-self: start; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
  .ex { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
  .tpls { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .linkrow { grid-template-columns: 1fr 1fr; }
  .scale { grid-template-columns: repeat(3, 1fr); }
  .sc, .pg-side .sc { grid-template-columns: 1fr; row-gap: 8px; }
  .rules { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .rules h2 { min-height: 2.3em; }
  .chapter { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 16px; }
  .ch-n { padding-top: 4px; }
  .chapter .kv { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; }
  .chapter .kv > div { grid-template-columns: 1fr; align-content: start; }
  /* третья пара «Типовая ошибка» на всю ширину: правая колонка не остаётся пустой */
  .chapter .kv > div:nth-child(3), .chapter .kv .case { grid-column: 1 / -1; }
  .pr-cards { grid-template-columns: repeat(3, 1fr); }
  .t thead { display: table-header-group; }
  .t tr { display: table-row; padding: 0; }
  .t td { display: table-cell; padding: 12px 12px 12px 0; border-bottom: 1px solid var(--hair); }
  .t td[data-l]::before { display: none; }
  .t th:first-child, .t td:first-child { width: 26%; }
}

/* ---------- компьютер: строка состояния 64, ряд разделов 44 с кнопкой «Карта года», нижних вкладок нет ---------- */
@media (min-width: 1024px) {
  :root { --top: 108px; }
  body { padding-bottom: 0; }
  .tabbar { display: none; }
  .top-in { flex-direction: column; align-items: stretch; gap: 0; padding-top: 8px; padding-bottom: 8px; }
  .st { height: 56px; }
  .st .chip .s { display: none; }
  .st .chip .l { display: inline; }
  .st .where { display: flex; gap: 0; align-items: baseline; }
  .st .where { flex-wrap: wrap; }
  .st .w2::before { content: "·"; padding: 0 6px; }
  .secs { display: flex; align-items: center; gap: 4px; height: 44px; margin: 0 -12px; }
  .secs .btn.map { margin-left: auto; }
  .main { padding: 32px var(--gutter) 64px; }
  .pg { display: grid; grid-template-columns: minmax(0, 1fr) var(--side); gap: 48px; align-items: start; }
  .pg-side { position: sticky; top: calc(var(--top) + 24px); max-height: calc(100vh - var(--top) - 48px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .pg-side.unfit { position: static; max-height: none; overflow: visible; }
  .toc-chips { display: none; }
  .toc-box { display: block; }
  .toc { display: flex; }
  .prac .pg-side { order: 0; }
  .scale-mobile { display: none; }
  .chips-mobile { display: none; }
  .ev .pg-side, .faq-page .pg-side { display: block; }
  /* узкая панель: число над текстом шкалы */
  .pg-side .sc { grid-template-columns: 1fr; row-gap: 4px; }
  /* правила ВКР: две колонки, «В сложном случае» на всю ширину, иначе три узких столбика по 230 px */
  .pg-main .rules { grid-template-columns: 1fr 1fr; }
  .pg-main .rules > div:last-child { grid-column: 1 / -1; }
  .pg-main .rules h2 { min-height: 0; }
  .seg { display: inline-grid; }
  .seg a { padding: 0 16px; }
  .ladder { gap: 8px; }
  .gal .toc-box .toc a { grid-template-columns: minmax(0, 1fr) auto; }
  .foot-in { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; }
  .foot-in > div:first-child { flex: 1 1 100%; }
}
/* низкое окно ноутбука: отступы липких панелей меньше, чтобы им досталось больше высоты */
@media (min-width: 1024px) and (max-height: 820px) {
  .pg-side { top: calc(var(--top) + 8px); max-height: calc(100vh - var(--top) - 16px); }
  .side-box { padding: 12px; }
  .side-box h2 { font-size: 15px; margin-bottom: 4px; }
  .side-box .rows .row-link { padding-block: 4px; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* ---------- раздел 4.3 МР: полный текст (#/mr) и ссылки на него с других страниц ----------
   Текст приходит из ../data/mr.js (tools/build_mr.mjs). Читаемость: на странице нет текста мельче 15 px, текст мельче 20 px идёт чернилами,
   подписи колонок в карточках цветом --ink-2 по карточке: контраст не ниже 7:1 в обеих темах. Одна колонка: таблицам нужна вся ширина. */
/* ссылка внутри строки: поля расширяют зону нажатия до 44 px и больше, строку они не сдвигают (боковые поля сняты отступом). Рамка фокуса стоит ближе к слову */
.lead a, .mr-doc a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; padding: 14px 6px; margin: 0 -6px; }
.lead a:focus-visible, .mr-doc a:focus-visible { outline-offset: -4px; }
.more-link.mr-ref { margin-top: 12px; font-size: 15px; color: var(--ink); }
.qa-mr { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-bottom: 12px; font-size: 15px; }
.qa-mr a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border: 1px solid var(--hair-2); border-radius: var(--r2); font-weight: 700; white-space: nowrap; }
.mr .eyebrow { font-size: 15px; color: var(--ink); }
.mr .lead { color: var(--ink); }
.mr-toc { margin-bottom: 32px; }
.mr-toc ol { list-style: none; column-gap: 32px; }
.mr-toc li { break-inside: avoid; }
.mr-toc a { display: grid; grid-template-columns: 52px 1fr; gap: 8px; align-items: baseline; min-height: 44px; padding: 10px 0; border-top: 1px solid var(--hair); font-size: 15px; line-height: 1.3; }
.mr-doc { overflow-wrap: break-word; }
/* цель ссылки встаёт на 16 px ниже шапки: общий отступ прокрутки рассчитан на полосу глав, которой здесь нет */
.mr-doc h2, .mr-doc h3, .mr-doc h4, .mr-t { scroll-margin-top: -48px; }
.mr-doc h2:focus, .mr-doc h3:focus, .mr-doc h4:focus, .mr-t:focus { outline: none; }
.mr-name { font-size: 20px; line-height: 1.25; max-width: 40em; margin: 0; }
.mr-sec { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--hair-2); }
.mr-sec h3 { font-size: 20px; line-height: 1.2; margin: 0 0 16px; }
.mr-sec h4 { font-size: 17px; line-height: 1.25; margin: 24px 0 8px; }
.mr-sec h3 + h4 { margin-top: 0; }
.mr-doc p { font-size: 17px; line-height: 1.5; max-width: 40em; margin: 0 0 12px; }
.mr-doc .tbl-wrap { margin: 16px 0 24px; }
.mr-t { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.mr-t caption { caption-side: top; text-align: left; font-size: 17px; line-height: 1.3; padding-bottom: 8px; }
.mr-t th { text-align: left; vertical-align: bottom; font-weight: 700; padding: 8px 16px 8px 0; border-bottom: 1px solid var(--hair-2); }
.mr-t td { vertical-align: top; padding: 12px 16px 12px 0; border-bottom: 1px solid var(--hair); }
/* справа 6 px: поле зоны нажатия ссылки в последней колонке не выходит за таблицу */
.mr-t th:last-child, .mr-t td:last-child { padding-right: 6px; }
.mr-t td:first-child { font-weight: 700; }
/* кнопка возврата: над нижними вкладками телефона, видна, пока оглавление за краем окна */
.mr-up { position: fixed; right: var(--gutter); bottom: calc(var(--tab) + var(--safe-b) + 12px); z-index: 20; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; background: var(--ink); color: var(--paper); font-size: 15px; font-weight: 700; box-shadow: 0 0 0 2px var(--paper); touch-action: manipulation; }
.mr-up::before { content: "↑"; }
.mr-up[hidden] { display: none; }
/* телефон и узкий планшет: строка таблицы это карточка, у каждой ячейки подпись своей колонки, первая ячейка стоит заголовком карточки.
   Порог 900 px: шести колонкам таблицы 4.3.3 нужно 822 px, уже этого она прокручивалась бы вбок */
@media (max-width: 899px) {
  .mr-doc .tbl-wrap { max-width: 680px; }
  .mr-t, .mr-t caption, .mr-t tbody, .mr-t tr, .mr-t td { display: block; }
  .mr-t thead { display: none; }
  .mr-t tr { background: var(--card); border: 1px solid var(--hair); border-radius: var(--r); padding: 8px 16px; margin-bottom: 8px; }
  .mr-t td { padding: 4px 0; border: 0; }
  .mr-t td::before { content: attr(data-l); display: block; font-size: 15px; font-weight: 700; line-height: 1.45; color: var(--ink-2); }
  .mr-t td:first-child { font-size: 17px; line-height: 1.3; }
}
@media (min-width: 720px) {
  .mr-toc ol { columns: 2; }
}
/* таблица шире колонки прокручивается внутри своей обёртки, страница вбок не едет */
@media (min-width: 900px) {
  .mr-doc .tbl-wrap { overflow-x: auto; overflow-y: hidden; }
}
@media (min-width: 1024px) {
  .mr-toc ol { columns: 3; }
  .mr-doc h2, .mr-doc h3, .mr-doc h4, .mr-t { scroll-margin-top: -40px; }
  .mr-up { bottom: 24px; }
}