/* прогон 32 — слой поверх leaf31 */
/* ── прогон 32 · «Тест уровня»: пол из книг был той же кучей, повторённой вдоль всей картинки (repeat-x) — Роман 01.11: «опять одинаковые кучи книг, слева и справа одна и та же текстура».
   Повтор снят: остаётся одна куча под лестницей (своя картинка), без копий. */
:root[data-look=leaf] :is(.v-car25,.v-tiles25) .d7-lv .d7-stage::after{content:none!important;display:none!important}
/* ── прогон 32 · больше воздуха вокруг виньетки (Роман 01.11: «чуть больше расстояния от разделителя до верхней и нижней секции»). Высоты разделов не меняются — растёт только шаг. */
html[data-zg="even"]:is([data-rh="d31a"],[data-rh="d31c"]){--zg:184}
@media (max-width:1023.98px){ html[data-zg="even"]:is([data-rh="d31a"],[data-rh="d31c"]){--zg:104} }

/* ══ T32: таблица ролей текста (редактор-типограф T, прогон 32) ══════════════════════════════════════════════════════
   Рецензенты 30–31: «кегли скачут, курсивы-ссылки трёх видов, подписи мелкие, серый текст». Одна таблица — council62/studio/TYPO-32.md.
   Переменные — для всех разделов и новых вариантов: font-size: calc(var(--t-body) * var(--ut)).
   Пункт пульта «Текст: таблица ролей» (html[data-tt]): t32 — по таблице; t32e — по таблице и «ровно» (на 1710 весь текст как на 1440); as — как было. Цвет текста — тушь; серого нет (состояния
   «не выбрано» у вкладок и строк — свои, не трогаю). Шрифты и характер разделов не меняю: только кегль, интерлиньяж, цвет, один вид ссылок. */
/* главная сессия: капитель 16, а не 15 — закон «подписи не мельче 16 px CSS» (ОТК: противоречие таблицы T и COMMON32) */
:root{--t-h2:52; --t-sub:19; --t-h3:40; --t-h3s:30; --t-lead:24; --t-body:18; --t-cap:16; --t-kick:16; --t-link:19; --t-num:46; --t-btn:20;
  --t-ink:#24262b; --t-kick-c:#8a6a1f; --t-link-c:#29466f}
@media (max-width:1023.98px){ :root{--t-h2:36; --t-sub:17; --t-h3:30; --t-h3s:24; --t-lead:20; --t-body:17; --t-cap:16; --t-kick:16; --t-link:17; --t-num:36; --t-btn:18} }
/* --ut — единица текста. По умолчанию (tt=t32) — единица самого раздела (--u): на 1710 текст растёт вместе с разделом, а в разделах,
   урезанных по высоте экрана, остаётся как на 1440 — высоты не меняются. tt=t32e («ровно») — одна единица на всю страницу,
   min(ширина/1440, высота/838): на 1710×838 весь текст как на 1440, заголовки разделов растут (--uh). */
body *{--ut:var(--u)}
html[data-tt="t32e"] body *{--ut:max(.711px, min(calc(100vw / 1440), calc(100vh / 838)))}
@media (max-width:1023.98px){ html[data-tt="t32e"] body *{--ut:var(--u)} }

/* T32 · подзаголовок раздела: один кегль на всех ширинах (было 18 и 21,4 на 1710 — по разделам), тушь (было #3b3d43) */
html:not([data-tt="as"]) .rubric .rubric-sub{font-size:max(16px, calc(var(--t-sub) * var(--ut)))!important;line-height:1.45!important;color:var(--t-ink)!important}

/* T32 · h3 коробки — 40 (было 40 / 42 / 44: «Тест уровня», «Подарочный сертификат», ответ «Вопросов», «Канал @Cross_Eng», имена преподавателей) */
html:not([data-tt="as"]) :is(.v-x30k .d7-h, .y30a-gift-a > h3, .fq-a .fq-h, .pz-hn, .zf-nm){font-size:calc(var(--t-h3) * var(--ut))!important;line-height:1.08!important}
/* T32 · h3 карточки в ряду — 30 (было 31 / 33: шесть направлений, «Витрина») */
html:not([data-tt="as"]) :is(.zd-card .zd-txt > h3, .zv-nm){font-size:calc(var(--t-h3s) * var(--ut))!important;line-height:1.1!important}

/* T32 · лид — Garamond курсив 24, тушь («Запись»: «Пробный урок – бесплатно…», было 22 серым) */
html:not([data-tt="as"]) .zd1-sub{font-size:calc(var(--t-lead) * var(--ut))!important;line-height:1.3!important;color:var(--t-ink)!important}

/* T32 · основной текст — Brygada 18, тушь (было 16,5 / 17 / 19 / 20 и серым #3b3d43, #3d3f45, #1b1611) */
html:not([data-tt="as"]) :is(.zd-card .zd-txt > p, .zv-p, .v-x30k .d7-p, .fq-t, .y30a-gift-a > p, .pz-lead, .x30h-bx, .h30-steps .h30-s, .y30a-s){
  font-size:calc(var(--t-body) * var(--ut))!important;line-height:1.45!important;color:var(--t-ink)!important;text-wrap:pretty}

/* T32 · подпись — Brygada 16, тушь, не меньше 16 px CSS нигде (было 14 / 14,5 / 15 и серым #55524b, #4a4c52) */
html:not([data-tt="as"]) :is(.rv17-who, .b30-note, .zf-st p > span, .v-x30k .d7-st span, .fq-next a > span, .z-consent, .y30d-form .hint, .zd1-meta, .y30a-row dt > i, .ft-small, .ft-small a, .ft-small .since, .ft-hours .st, .ft-slog){
  font-size:max(16px, calc(var(--t-cap) * var(--ut)))!important;line-height:1.4!important;color:var(--t-ink)!important}
/* подписи курсивом Garamond — кегль свой (16–18 Garamond = 15–16 Brygada на глаз), только тушь вместо серого */
html:not([data-tt="as"]) :is(.d7-note, .rv17-cnt, .b30-k2, .zf-role, .err-k, .y30a-row dd > small){color:var(--t-ink)!important}
html:not([data-tt="as"]) .nw-pill{font-size:max(16px, calc(16 * var(--ut)))!important}
html:not([data-tt="as"]) .ft-hours .st b{white-space:nowrap}   /* «ответим утром» не рвётся: было одно «утром» третьей строкой */

/* T32 · капитель-рубрика — Brygada 500, прописные, разрядка .14em, 15; цвет — тёмное золото или цвет раздела (ярь в «Ценах», лазурь в «Записи») */
html:not([data-tt="as"]) :is(.h30-k, .b30-k > span:not(.b30-k2), .y30-k, .zd1-kick, .pz-k){font-family:var(--f-text)!important;font-weight:500!important;
  font-size:max(15px, calc(var(--t-kick) * var(--ut)))!important;line-height:1.3!important;letter-spacing:.14em!important;text-transform:uppercase!important}
html:not([data-tt="as"]) .pz-k{color:var(--t-kick-c)!important}
@media (max-width:1023.98px){ html:not([data-tt="as"]) [data-sec="hero"] .kick{font-size:15px!important} }

/* T32 · курсив-ссылка — один вид на весь сайт: EB Garamond 500 курсив 19, волосяное подчёркивание.
   Действие — лазурь (со стрелкой, если она есть в тексте или у .go); «или в Telegram» рядом с кнопкой — тушь, без стрелки.
   Было три вида: Brygada 600 прямой лазурью («Записаться бесплатно →»), Brygada курсив серым («или в бот»), Garamond курсив тушью («читать в канале →», «Задать свой вопрос»). */
html:not([data-tt="as"]) :is(.zd-go, .zv-go, .y30a-act > a.go, .y30a-go, .y30a-opts a.go, .fq-a a.go, .fq-ask a.go, .pz-pa, .pz-pa > span, .err-more, .zd-bot){
  font-family:var(--f-head)!important;font-style:italic!important;font-weight:500!important;font-size:calc(var(--t-link) * var(--ut))!important;line-height:1.3!important;letter-spacing:0!important}
html:not([data-tt="as"]) :is(.zd-go, .zv-go, .y30a-go, .y30a-opts a.go, .fq-a a.go, .fq-ask a.go, .pz-pa, .err-more){color:var(--t-link-c)!important;
  text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:.24em!important;text-decoration-color:rgba(41,70,111,.42)!important}
html:not([data-tt="as"]) .pz-pa{text-decoration:none!important}
html:not([data-tt="as"]) .pz-pa > span{color:inherit!important}
html:not([data-tt="as"]) .pz-pa > span:first-child{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.24em;text-decoration-color:rgba(41,70,111,.42)}
/* «или в Telegram» — та же ссылка, но тише: тушь, прямой вес 400, без стрелки (рядом с главной кнопкой или ссылкой-действием) */
html:not([data-tt="as"]) :is(.zd-bot, .y30a-act > a.go){color:var(--t-ink)!important;font-weight:400!important;
  text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:.24em!important;text-decoration-color:rgba(36,38,43,.3)!important}
html:not([data-tt="as"]) .y30a-act > a.go::after{content:none!important}
/* стрелка .go («Как устроено обучение →») прилипала к слову: в inline-flex пробел в начале content съедается — отступ полем */
html:not([data-tt="as"]) .go::after{margin-left:.28em}
@media (hover:hover){ html:not([data-tt="as"]) :is(.zd-go, .zv-go, .y30a-go, .y30a-opts a.go, .fq-a a.go, .fq-ask a.go, .pz-pa, .err-more, .zd-bot, .y30a-act > a.go):hover{color:var(--t-link-c)!important;text-decoration-color:currentColor!important} }

/* T32 · заголовок «Записи» — роль h2 раздела: 52 от ширины, как у всех (было 46; рецензент 30 п. 7) */
html:not([data-tt="as"]) .zd1-h{font-size:calc(var(--t-h2) * var(--uh))!important}
/* T32 · «Контакты» на телефоне: список контактов был 13 px серым в две колонки с обрезкой «…» — 16 px тушью в одну колонку, номер телефона целиком */
@media (max-width:1023.98px){ html:not([data-tt="as"]) .v-ft23b1a .ft-list{font-size:max(16px, calc(var(--t-cap) * var(--ut)))!important;grid-template-columns:1fr!important;color:var(--t-ink)!important} }

/* S32 · главная сессия: WhatsApp для РФ скрыт (слово Романа, SYSTEM-17). В ft23b1a класс tz-ru ставился, а правила не было (нашёл инженер выпуска). */
html.tz-ru #contacts li:has(> a[href^="https://wa.me/"]){display:none!important}

/* ══ M32: движение сайта (моушн-дизайнер M, прогон 32) ═════════════════════════════════════════════════════════════════
   Одна система для всего движения: токены времени (--m-fast .2s наведение, --m-mid .5s появление, --m-slow .9s), кривых (--m-ease – выход, --m-ease-io – качание), подъёма (--m-rise 14u) и шага (--m-step 70 мс). Пункт пульта «Движение» (html[data-mo]): m32 – по системе, as – как было (без стрелок и проявления).
   Только transform/opacity; при prefers-reduced-motion и «Остановить анимацию» (html.still, data-theatre=off) ничего не движется.
   Персонажи не парят; ангел не двигается (в шапках с небом отстаёт только фон – подблок «шапки с небом» ниже, свой пункт пульта hm). */
:root{--m-fast:.2s;--m-mid:.5s;--m-slow:.9s;--m-ease:cubic-bezier(.2,.7,.2,1);--m-ease-io:cubic-bezier(.45,0,.55,1);--m-rise:14;--m-step:70ms;--m-bob-t:2.4s}

/* M32 · шапки с небом (sk-tab Фавор, sk-msmw, sk-yar, m32d): пункт пульта «Шапка: углы и фон при прокрутке» (html[data-hm]): m32 (фон отстаёт) / fix (фон стоит, как у Вирджинии) / как сейчас.
   Роман 01.11: «Фавор прям сильно сплошной… посмотри шапку Вирджинии: фоновый элемент коробки при прокрутке поднимается и опускается, а основные
   изображения и текст остаются сверху» + «в шапке слишком резкие углы – закруглить, как у остальных коробок».
   Коробка: углы токеном --box-r (Z; запас – 10u страницы, как у .plate, «Тестов», «Вопросов», «Записи», «Канала»; на телефоне 8u), кромка чёткая (без маски-растворения снизу).
   Стоят ангел, облака, текст и кнопка (едут с коробкой). Отстаёт только фон: небо k = 0,55, гора / аббатство k = 0,3 – на сколько коробка ушла вверх,
   столько × k фон опускается внутри неё; слои ниже текста по z и уходят прочь от него, на текст и кнопки не заезжают.
   Запас неба сверху 14 % коробки (ярь – 24 %): верх коробки уходит из экрана быстрее, чем опускается небо, кромки неба не видно (замер – REPORT-M).
   Туман у подножия (Фавор, Мон-Сен-Мишель): под колонкой текста земля светлеет, низ коробки не сплошной; стоит вместе с коробкой.
   Только transform; движение от 1024 px; при reduced-motion и «Остановить анимацию» фон стоит. CSS scroll-timeline, без поддержки – leaf32.js (rAF).
   «Голая» angel18 без коробки и фона – её не трогает (рядом новая m32d «светлое небо»). */
html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28{--m-R:120vh;--m-ks:.55;--m-kl:.3}
/* «как у Вирджинии»: небо стоит на экране (k = 1), гора почти стоит (k = 0,6) – коробка с ангелом и текстом едет поверх */
html[data-hm="fix"] [data-sec="hero"] .v-sky28{--m-ks:1;--m-kl:.6}
html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28.v-angel17.hero{border-radius:var(--box-r, calc(var(--r) * max(.711px, calc(100vw / 1440))))!important;
  -webkit-mask-image:none!important;mask-image:none!important;overflow:hidden;overflow:clip;isolation:isolate}
html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28 > :is(.sky28,.land28,.m32-mist){border-radius:inherit}
@media (max-width:1023.98px){
  html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28.v-angel17.hero{border-radius:var(--box-r, calc(var(--r) * clamp(.8px, calc(100vw / 390), 1.35px)))!important}
}
@media (min-width:1024px){
  html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28 .sky28{overflow:visible}
  html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28:not(.sky28-yar) .sky28 img{top:-14%;height:128%}
  html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .v-sky28.sky28-yar .sky28 img{top:-24%!important;height:125%!important}
}
.m32-mist{display:none}
@media (min-width:1024px){
  html:is([data-hm="m32"],[data-hm="fix"]) [data-sec="hero"] .m32-mist{display:block;position:absolute;z-index:-1;left:0;right:0;bottom:0;height:58%;pointer-events:none;
    background:radial-gradient(64% 78% at 20% 100%, rgba(251,248,241,.8) 0, rgba(251,248,241,.58) 42%, rgba(251,248,241,0) 76%)}
}
@keyframes m32-par{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,calc(var(--m-R,120vh) * var(--m-k,.5)),0)}}
@supports (animation-timeline: scroll()){
  @media (min-width:1024px) and (prefers-reduced-motion:no-preference){
    html:is([data-hm="m32"],[data-hm="fix"]):not(.still):not([data-theatre="off"]) [data-sec="hero"] .v-sky28 .sky28 img{--m-k:var(--m-ks);animation:m32-par linear both;animation-timeline:scroll(root);animation-range:0 var(--m-R);will-change:transform}
    html:is([data-hm="m32"],[data-hm="fix"]):not(.still):not([data-theatre="off"]) [data-sec="hero"] .v-sky28 .land28{--m-k:var(--m-kl);animation:m32-par linear both;animation-timeline:scroll(root);animation-range:0 var(--m-R);will-change:transform}
  }
}
@media (prefers-reduced-motion:reduce){ [data-sec="hero"] .v-sky28 :is(.sky28 img,.land28){animation:none!important;transform:none!important} }
html:is(.still,[data-theatre="off"]) [data-sec="hero"] .v-sky28 :is(.sky28 img,.land28){animation:none!important;transform:none!important}
@media (max-width:1023.98px){ [data-sec="hero"] .v-sky28 :is(.sky28 img,.land28){animation:none!important;transform:none!important} }

/* M32 · стрелка у главных кнопок записи (Роман 01.11: «стрелка-треугольник под “Записаться”: шевелится и показывает на следующую секцию»).
   Свой знак: плотный раскрытый шеврон тёмным золотом, две грани по 3 px (у Вирджинии – тонкая белая галочка-GIF 51×26); без стержня – линия не читается как разделитель.
   Качается на 9u за 2,4 с; при наведении на кнопку опускается и чуть растёт. Два места:
   шапка – под кнопкой, ведёт к следующему разделу; «Вопросы» – в самой кнопке «Записаться на пробный» вместо «→» (ниже сразу «Запись»; под кнопкой места нет).
   Вставляет leaf32.js; разметку разделов не меняет. */
.m32-arr{display:inline-block;position:relative;vertical-align:middle;width:calc(var(--m-aw,26) * var(--u));height:calc(var(--m-aw,26) * var(--u) * .5 + var(--m-sw,3px));
  min-width:14px;min-height:9px;color:inherit;font-style:normal;animation:m32-bob var(--m-bob-t) var(--m-ease-io) infinite}
.m32-arr::after{content:"";position:absolute;left:50%;top:0;box-sizing:border-box;width:calc(var(--m-aw,26) * var(--u) * .7071);height:calc(var(--m-aw,26) * var(--u) * .7071);
  min-width:10px;min-height:10px;border-right:var(--m-sw,3px) solid currentColor;border-bottom:var(--m-sw,3px) solid currentColor;border-radius:0 0 2px 0;translate:-50% -50%;rotate:45deg}
@keyframes m32-bob{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,calc(var(--m-amp,9) * var(--u)),0)}}
.m32-chev{position:absolute;z-index:5;left:var(--m-cx,50%);top:calc(var(--m-cy,100%) + var(--m-cg,14) * var(--u));width:48px;height:max(44px, calc(var(--m-aw,26) * var(--u) * .5 + var(--m-amp,9) * var(--u) + 14px));margin-left:-24px;
  display:flex;justify-content:center;align-items:flex-start;padding-top:4px;box-sizing:border-box;color:var(--m-chev-c,#8a6a1f);cursor:pointer;border-radius:8px;
  transition:transform var(--m-fast) var(--m-ease),color var(--m-fast) var(--m-ease);-webkit-tap-highlight-color:transparent}
.m32-chev:hover,.m32-cta-host:has([data-m32-cta]:hover) .m32-chev{transform:translate3d(0,calc(4 * var(--u)),0) scale(1.16);color:var(--m-chev-h,#29466f)}
.m32-chev:focus-visible{outline:2px solid #29466f;outline-offset:2px}
.sky28-yar .m32-chev{--m-chev-c:#e6c77a;--m-chev-h:#fbf8f1}
/* «Вопросы»: в кнопке вместо «→» та же стрелка, что у соседних ссылок «Пройди тест уровня →», только вниз – стержень и наконечник
   (шеврон внутри кнопки читался бы как «раскрыть список»); цвет кнопки, на заливке при наведении – кость */
html[data-mo="m32"] [data-sec="faq"] [data-m32-cta] b::after{content:none!important}
.m32-arr.m32-arr-s{width:calc(10 * var(--u));height:calc(17 * var(--u));min-width:9px;min-height:15px;margin-left:.42em;margin-top:-.12em;--m-amp:3}
.m32-arr.m32-arr-s::before{content:"";position:absolute;left:50%;top:0;bottom:1px;width:2px;margin-left:-1px;background:currentColor;border-radius:1px}
.m32-arr.m32-arr-s::after{top:auto;bottom:calc(10 * var(--u) * .2 + 1px);width:calc(10 * var(--u) * .72);height:calc(10 * var(--u) * .72);min-width:7px;min-height:7px;
  border-width:0 2px 2px 0;border-radius:0;translate:-50% 0}
html:not([data-mo="m32"]) :is(.m32-chev,.m32-arr){display:none}
@media (max-width:1023.98px){ .m32-chev{--m-cg:10;--m-aw:22;--m-amp:6} }

/* M32 · проявление разделов: один раз, тихо – рубрика, затем содержимое (шаг --m-step), подъём 14u + прозрачность за 0,5 с (X: «Тесты» на 1710 ровно 778 – сдвиг малый).
   Коробки, где уже есть своё появление (.rise в «Тестах» и «Ценах»), не трогаются; шапка и подвал – без проявления.
   Классы ставит leaf32.js и снимает после показа; что в экране при загрузке – показано сразу. */
html[data-mo="m32"].m32-rv-on .m32-rv:not(.m32-in){opacity:0;transform:translate3d(0,calc(var(--m-rise) * var(--u)),0)}
html[data-mo="m32"].m32-rv-on .m32-rv{transition:opacity var(--m-mid) var(--m-ease),transform var(--m-mid) var(--m-ease);transition-delay:calc(var(--m-i,0) * var(--m-step))}
/* прежнее появление .rise («Тесты», «Цены», system.js) – на те же токены: подъём 14u вместо 32u, время, кривая и шаг – общие */
@media (prefers-reduced-motion:no-preference){
  html[data-mo="m32"].js:not(.still):not([data-theatre="off"]) .rise:not(.is-in){transform:translate3d(0,calc(var(--m-rise) * var(--u)),0)}
  html[data-mo="m32"].js .rise{transition-duration:var(--m-mid);transition-timing-function:var(--m-ease);transition-delay:calc(var(--i,0) * var(--m-step))}
}
@media print{ .m32-rv{opacity:1!important;transform:none!important} }

/* M32 · блик ангела (прогон 25, g25-glint; Роман 29.10: «нимб, золото крыльев… раньше сияли»): тот же медленный блик по золоту,
   но только прозрачностью – две мягкие полосы света вспыхивают по очереди справа налево (было: background-position, замечание ОТК Ч17).
   Ничего внутри ангела не едет (Ч18): ангел и его свет стоят, меняется только яркость. */
.g25-glint{background:rgba(255,206,110,.42)!important;animation:none!important}
.g25-glint::before,.g25-glint::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(104deg,rgba(255,240,190,0) 0,rgba(255,240,190,0) var(--ga),rgba(255,248,222,.95) var(--gb),rgba(255,240,190,0) var(--gc),rgba(255,240,190,0) 100%)}
.g25-glint::before{--ga:46%;--gb:60%;--gc:74%;animation:m32-glint-a 7.5s ease-in-out infinite}
.g25-glint::after{--ga:20%;--gb:34%;--gc:48%;animation:m32-glint-b 7.5s ease-in-out infinite}
@keyframes m32-glint-a{0%,24%{opacity:0}38%{opacity:1}54%,100%{opacity:0}}
@keyframes m32-glint-b{0%,40%{opacity:0}56%{opacity:1}72%,100%{opacity:0}}

/* M32 · крючки движения от прокрутки для разделителей и предметов (P): CSS view-timeline, без JS (Ж24).
   [data-m-spin] – поворот на --m-spin (90° по умолчанию) за проход через экран, в середине экрана стоит прямо;
   [data-m-sway] – качание ±--m-sway (6°); [data-m-in] – тихий вход: из прозрачности и на 14u ниже, пока входит в экран.
   Для ::before / ::after – те же ключевые кадры: animation: m32-spin linear both; animation-timeline: view(); animation-range: cover 0% cover 100%.
   Свойства rotate / translate отдельные – не спорят с transform, которым предмет поставлен на место. */
@keyframes m32-spin{from{rotate:calc(var(--m-spin,90deg) * -.5)}to{rotate:calc(var(--m-spin,90deg) * .5)}}
@keyframes m32-sway{0%,100%{rotate:calc(var(--m-sway,6deg) * -1)}50%{rotate:var(--m-sway,6deg)}}
@keyframes m32-in{from{opacity:0;translate:0 calc(14 * var(--u))}to{opacity:1;translate:0 0}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    html[data-mo="m32"]:not(.still):not([data-theatre="off"]) [data-m-spin]{animation:m32-spin linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    html[data-mo="m32"]:not(.still):not([data-theatre="off"]) [data-m-sway]{animation:m32-sway linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    html[data-mo="m32"]:not(.still):not([data-theatre="off"]) [data-m-in]{animation:m32-in linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
    /* виньетки d31a / d31c (выбор Романа – одна на пяти стыках) и семья p32 (P): тихо входят снизу, пока стык входит в экран */
    html[data-mo="m32"]:is([data-rh="d31a"],[data-rh="d31c"]):not(.still):not([data-theatre="off"]) :is([data-sec="courses"],[data-sec="how"],[data-sec="tests"],[data-sec="prices"],[data-sec="zapis"]):not([hidden])::before,
    html[data-mo="m32"][data-rh="p32"]:not(.still):not([data-theatre="off"]) main.wrap > [data-sec]:not([hidden])::before{
      animation:m32-in linear both;animation-timeline:view();animation-range:entry 10% entry 90%}
  }
}
@media (prefers-reduced-motion:reduce){ .m32-arr,.g25-glint::before,.g25-glint::after{animation:none} .m32-rv{opacity:1!important;transform:none!important;transition:none!important} }
html:is(.still,[data-theatre="off"]) :is(.m32-arr,.g25-glint::before,.g25-glint::after){animation:none}
html:is(.still,[data-theatre="off"]) .m32-rv{opacity:1!important;transform:none!important;transition:none!important}

/* ══ P32: художник-постановщик P (прогон 32) – семья виньеток (rh=p32) и крупные предметы (html[data-po]) ══════════════════════════ */

/* P32 · rh=p32 – семья виньеток одной руки (художник: g30-divider-a/b/c, g32-divider-d/e-a): на каждом стыке своя, повторов нет
   (Роман 01.11: «их нужно побольше сделать, чтобы не повторялись»; «больше расстояния от разделителя до соседних секций»).
   Те же пять стыков, что у d31a, – сравнение подобного с подобным. Один размер = один «вес»: площадь каждой ≈ 32 000 u², ширина и высота
   по её пропорции (узкая книга с ключом шире и ниже, фонарь и глобус выше и уже). Одна обработка: рисунок художника как есть, без тени и фильтров.
   Шаг 240u (было 184): воздух до и после виньетки 77–89u (у Вирджинии 65–80 px).
   Смысл стыка: «Направления» – книга с ключом (ключ к знанию, начало), «Обучение» – глобус с лентой (урок онлайн из любой точки мира),
   «Тесты» – фонарь (тест освещает уровень), «Цены» – книга с лозой (притча о работниках в винограднике: честная плата),
   «Запись» – свиток с пером и чернильницей (вписать себя). */
html[data-rh="p32"]{--zg:240}
html[data-rh="p32"] [data-sec="courses"]{--p-rh:url(img32/p32-rh-c.webp);--p-rw:516;--p-rhh:62}
html[data-rh="p32"] [data-sec="how"]{--p-rh:url(img32/p32-rh-f.webp);--p-rw:388;--p-rhh:82}   /* главная сессия: глобус заново (художник, круг 2: XVI век, Старый Свет, лента уже) */
html[data-rh="p32"] [data-sec="channel"]{--p-rh:url(img32/p32-rh-g.webp);--p-rw:474;--p-rhh:68}   /* шестая: колокольчик — звонок между уроками */
html[data-rh="p32"] [data-sec="tests"]{--p-rh:url(img32/p32-rh-d.webp);--p-rw:422;--p-rhh:76}
html[data-rh="p32"] [data-sec="prices"]{--p-rh:url(img32/p32-rh-a.webp);--p-rw:447;--p-rhh:72}
html[data-rh="p32"] [data-sec="zapis"]{--p-rh:url(img32/p32-rh-b.webp);--p-rw:482;--p-rhh:66}
html[data-rh="p32"] main.wrap > [data-sec]:is([data-sec="courses"],[data-sec="how"],[data-sec="tests"],[data-sec="prices"],[data-sec="zapis"],[data-sec="channel"]):not([hidden])::before{
  content:"";display:block;width:calc(var(--p-rw) * var(--u));height:calc(var(--p-rhh) * var(--u));max-width:92%;
  margin:calc((var(--zg) - var(--p-rhh)) * .5 * var(--u)) auto calc((var(--zg) - var(--p-rhh)) * -.5 * var(--u) - var(--p-rhh) * var(--u));
  background:var(--p-rh) 50% 50%/contain no-repeat;pointer-events:none}
/* при шаге «как сейчас» (zg=as) виньетка берёт место сама: 48u до и после (у d31a в этом режиме она наезжала на заголовок «Направлений») */
html[data-rh="p32"]:not([data-zg="even"]) main.wrap > [data-sec]:is([data-sec="courses"],[data-sec="how"],[data-sec="tests"],[data-sec="prices"],[data-sec="zapis"],[data-sec="channel"]):not([hidden])::before{
  margin:calc(48 * var(--u)) auto calc(48 * var(--u))}
html[data-rh="p32"]:not([data-zg="even"]) main.wrap > [data-sec="courses"]:is([data-sec]):not([hidden])::before{margin-bottom:calc(108 * var(--u))}   /* «Направления» в этом режиме подтянуты к шапке на −60 px */
@media (max-width:1023.98px){
  /* телефон: та же семья, площадь ≈ 13 000 u² (u = 1 px на 390) – самая широкая книга с ключом 329 px, самый высокий глобус 55 px; воздух ≥ 44 px */
  html[data-rh="p32"]{--zg:144}
  html[data-rh="p32"] [data-sec="courses"]{--p-rw:329;--p-rhh:40}
  html[data-rh="p32"] [data-sec="how"]{--p-rw:247;--p-rhh:53}
  html[data-rh="p32"] [data-sec="channel"]{--p-rw:302;--p-rhh:43}
  html[data-rh="p32"] [data-sec="tests"]{--p-rw:269;--p-rhh:48}
  html[data-rh="p32"] [data-sec="prices"]{--p-rw:285;--p-rhh:46}
  html[data-rh="p32"] [data-sec="zapis"]{--p-rw:307;--p-rhh:42}
}

/* P32 · крупные предметы (пункт пульта «Фоновые предметы», html[data-po]: on – есть, off – нет). Роман 01.11: «у нас мало крутых 2D-элементов
   на фоне сайта… нам нужно это догнать». Настоящие PD-вещи (Мет, Рейксмузеум), вырезка начисто (IS-Net + ажур вручную по фону), одна обработка:
   без фона, живая тень бумаги (drop-shadow, без смены цвета). Только в разделах без своей крупной картинки; целиком видны; на текст и кнопки
   не ложатся; лежат через кромку коробки. Стоячие вещи – только на кромке (не висят в воздухе), плоские (перо) лежат на листе.
   Элементы вставляет leaf32.js (блок P32) во все варианты раздела; место – переменные --p-x/--p-y/--p-w (в u от раздела), выключить в своём
   варианте – .v-<ключ> .p32-obj{display:none}. Крючки M: вход (data-m-in) – на обёртке, качание (data-m-sway, --m-sway) – на картинке. На телефоне предметов нет (Роман: «мобильная версия… резать нещадно», REJ В). */
.p32-obj{position:absolute;z-index:3;left:calc(var(--p-x) * var(--u));top:calc(var(--p-y) * var(--u));width:calc(var(--p-w) * var(--u));
  pointer-events:none;line-height:0;user-select:none;-webkit-user-select:none}
.p32-obj img{display:block;width:100%;height:auto;filter:drop-shadow(0 calc(5 * var(--u)) calc(6 * var(--u)) rgba(36,38,43,.20)) drop-shadow(0 calc(1 * var(--u)) calc(1 * var(--u)) rgba(36,38,43,.18))}
html:not([data-po="on"]) .p32-obj{display:none}
@media (max-width:1023.98px){ .p32-obj{display:none!important} }
/* «Отзывы» (k26n): наградное перо (серебро, Амстердам 1730; Рейксмузеум NG-NM-12264, PD) лежит над лентой, кончик пера – на кромке третьей карточки
   (отзывы пишут). Длина 470u = 81 % высоты раздела; на заголовок, подзаголовок и текст карточек не заходит. */
[data-sec="reviews"] .p32-o-quill{--p-x:780;--p-y:-16;--p-w:470}
[data-sec="reviews"] .p32-o-quill img{transform-origin:97% 94%;--m-sway:2deg}
/* «Тесты» (x30k): весы (латунь, сталь, мрамор, ок. 1845–1855; Мет 2013.960.2a–f, CC0) стоят на верхней кромке коробки у правого угла –
   тест как мерило уровня. Высота 300u = 41 % высоты раздела; основание чуть заходит на коробку, правая чаша – за её кромку;
   в полосе заголовка справа (заголовок кончается на 857u), до «Тест уровня» и до виньетки стыка не доходят. Качание ±3° от прокрутки (M). */
[data-sec="tests"] .p32-o-scale{--p-x:1060;--p-y:-151;--p-w:320}
[data-sec="tests"] .p32-o-scale img{transform-origin:50% 100%;--m-sway:3deg}

/* ══ Z32: общий слой дизайнера Z (прогон 32) ═════════════════════════════════════════════════════════════════════════
   (б) единый радиус углов коробок — токен (Роман 01.11: «в шапке слишком острые углы, остальные коробки круглые»).
   10u на ПК, 8u на телефоне — как у .plate, «Тестов», «Вопросов», «Записи», «Канала». Шапку закругляет M этим токеном. */
:root{--box-r:calc(var(--r) * var(--u))}

/* Z32 · (а) цветные плиты (Роман 01.11: «красивую зелёную ярь с классным фоном сзади – как ангел с ярью – попробовать по секциям… чтобы по стилю вписывалось»).
   Пункт пульта «Цветные плиты» (html[data-zp]): yar – ярь, az – лазурь, as – как сейчас (плит нет). Не больше трёх на страницу; сейчас две:
   «Отзывы» – густая полупрозрачная краска поверх гравюры тоном (приём шапки «Ярь»: гравюра под краской 88 %), окошки отзывов – кость на плите;
   второй экран «Между уроками» (z32d) и «Запись» – светлая краска по пергаменту страницы (18 %), коробки – лист. Плита до краёв окна (как выбранный тобой zr=bleed):
   краска – тенью псевдоэлемента, обрезанной сверху и снизу, в прокрутку вбок не идёт; гравюра – только в пределах сетки, края растворяются в краску.
   Плит три: «Отзывы», «Запись», второй экран «Между уроками» – не подряд (между «Записью» и тремя коробками – окно канала на листе). Высоты разделов не меняются – плита рисуется вокруг. */
html[data-zp="yar"]{--zp-deep:rgba(44,90,78,.88);--zp-light:rgba(44,90,78,.18);--zp-acc:#e6c77a}
html[data-zp="az"]{--zp-deep:rgba(41,70,111,.88);--zp-light:rgba(41,70,111,.13);--zp-acc:#e6c77a}
html[data-zp="mix"]{--zp-deep:rgba(44,90,78,.88);--zp-light:rgba(44,90,78,.18);--zp-acc:#e6c77a;--zp-deep2:rgba(41,70,111,.9)}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] > section{position:relative;isolation:isolate}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] > section::before{content:"";position:absolute;z-index:-2;left:calc(-36 * var(--u));right:calc(-36 * var(--u));
  top:calc(-84 * var(--u));bottom:calc(-56 * var(--u));background:url(img32/zp-bodleian-2000.webp) 50% 0 / auto 150% no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%)}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] > section::after{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-84 * var(--u));bottom:calc(-56 * var(--u));
  background:var(--zp-deep);box-shadow:0 0 0 100vmax var(--zp-deep);clip-path:inset(0 -100vmax);pointer-events:none}
/* текст на густой плите – кость, слово-акцент заголовка и номер – золото (как на шапке «Ярь») */
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rubric h2{color:#fbf8f1!important}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rubric h2 em{color:var(--zp-acc)!important}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rubric :is(.num,.fol,.fol::before){color:var(--zp-acc)!important}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rubric .rubric-sub{color:#fbf8f1!important}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rv17-cnt{color:#fbf8f1!important}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rv17-ar{color:#fbf8f1!important;border-color:rgba(251,248,241,.7)!important;background:transparent!important}
@media (hover:hover){ html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rv17-ar:hover:not([aria-disabled="true"]){background:#fbf8f1!important;color:#24262b!important} }
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rv17-ar:focus-visible{outline-color:#fbf8f1!important}
/* окошки отзывов на краске: чище бумага, тень мягче, чтобы не «плавали» */
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] .rv17-card{background:#fffdf8!important;box-shadow:0 1px 0 rgba(0,0,0,.06),0 10px 24px rgba(10,24,20,.16)!important}
/* второй экран «Между уроками» (z32d): светлая краска по пергаменту, до краёв окна */
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) #channel .z32-tri{isolation:isolate}
html:is([data-zp="yar"],[data-zp="az"]) #channel .z32-tri::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-44 * var(--u));bottom:calc(-44 * var(--u));
  background:var(--zp-light);box-shadow:0 0 0 100vmax var(--zp-light);clip-path:inset(0 -100vmax);pointer-events:none}
/* «Запись» (третья плита, по просьбе Y): светлая краска по пергаменту, как второй экран «Между уроками»; текст и «Ч» остаются тёмными – варианты Y проверяет на ней сам */
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="zapis"] > section{position:relative;isolation:isolate}
html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="zapis"] > section::after{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-48 * var(--u));bottom:calc(-48 * var(--u));
  background:var(--zp-light);box-shadow:0 0 0 100vmax var(--zp-light);clip-path:inset(0 -100vmax);pointer-events:none}
@media (max-width:1023.98px){
  html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] > section::before{left:calc(var(--gut) * -1 * var(--u));right:calc(var(--gut) * -1 * var(--u));top:-44px;bottom:-40px;
    -webkit-mask-image:none;mask-image:none;background-size:auto 100%;background-position:30% 0}
  html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="reviews"] > section::after{top:-44px;bottom:-40px}
  html:is([data-zp="yar"],[data-zp="az"]) #channel .z32-tri::before{top:-28px;bottom:-28px}
  html:is([data-zp="yar"],[data-zp="az"],[data-zp="mix"]) [data-sec="zapis"] > section::after{top:-28px;bottom:-28px}
}

/* Z32 · (в) пропорции: поле страницы на телефоне 16 px (было 12 при zh=as; закон «текст не ближе 16 px к краю», ОТК Ч11: «Преподаватели», «Обучение» и др.).
   Разделы считают ширину от --gut – подстраиваются сами; на ПК поле не меняется. */
@media (max-width:1023.98px){ :root{--gut:16} }

/* Z32 · «Цветные плиты» – значение mix (дозадание 02.11: «светлая ярь серо-зелёная и без фактуры, все три плиты зелёные; Роман: «поиграться с другими цветами»»).
   «Отзывы» – густая ярь поверх Бодлианской библиотеки (как yar), «Запись» – светлая ярь (как yar), второй экран «Между уроками» – густая лазурь 90 %
   поверх гравюры Вредемана де Фриса «Аркада» (ок. 1560, Рейксмузеум, PD: галерея с колоннами – «между уроками» гуляют по галерее) – коробки-листы на синей плите.
   Две густые плиты не подряд (IV и IX), между ними – лист. Гравюра – в пределах сетки, края растворяются в краску. Старые значения yar/az не меняются. */
html[data-zp="mix"] #channel .z32-tri{isolation:isolate}
html[data-zp="mix"] #channel .z32-tri::before{content:"";position:absolute;z-index:-2;left:calc(-36 * var(--u));right:calc(-36 * var(--u));top:calc(-56 * var(--u));bottom:calc(-56 * var(--u));
  background:url(img32/zp-arcade-1200.webp) 50% 58% / cover no-repeat;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
html[data-zp="mix"] #channel .z32-tri::after{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-56 * var(--u));bottom:calc(-56 * var(--u));
  background:var(--zp-deep2);box-shadow:0 0 0 100vmax var(--zp-deep2);clip-path:inset(0 -100vmax);pointer-events:none}
html[data-zp="mix"] #channel .z32-box{box-shadow:0 1px 0 rgba(0,0,0,.06),0 12px 28px rgba(10,18,36,.22)}
@media (max-width:1023.98px){
  html[data-zp="mix"] #channel .z32-tri::before{left:calc(var(--gut) * -1 * var(--u));right:calc(var(--gut) * -1 * var(--u));top:-32px;bottom:-32px;-webkit-mask-image:none;mask-image:none;background-size:auto 60%;background-repeat:no-repeat;background-position:50% 0}
  html[data-zp="mix"] #channel .z32-tri::after{top:-32px;bottom:-32px}
}

/* S32 · знак перехода «роза» (художник, круг 2; заказ P; Роман 29.10: «венок, розетка… крутится»): тюдоровская роза на верхней кромке
   цветной плиты «Отзывов» – переход из листа в цвет. Только при семье виньеток p32 и включённых плитах. Поворачивается от прокрутки
   (ключевые кадры M m32-spin, ±45°), при reduced-motion / «Остановить анимацию» – стоит. На телефоне меньше. */
html[data-rh="p32"]:is([data-zp="yar"],[data-zp="az"]) main.wrap > [data-sec="reviews"]{position:relative}
html[data-rh="p32"]:is([data-zp="yar"],[data-zp="az"]) main.wrap > [data-sec="reviews"]:not([hidden])::before{
  content:"";position:absolute;z-index:4;left:50%;top:calc(-84 * var(--u));width:calc(104 * var(--u));height:calc(104 * var(--u));
  margin:calc(-52 * var(--u)) 0 0 calc(-52 * var(--u));background:url(img32/p32-rose-600.webp) 50% 50%/contain no-repeat;pointer-events:none;
  filter:drop-shadow(0 calc(3 * var(--u)) calc(5 * var(--u)) rgba(16,32,26,.28))}
@media (max-width:1023.98px){
  html[data-rh="p32"]:is([data-zp="yar"],[data-zp="az"]) main.wrap > [data-sec="reviews"]:not([hidden])::before{top:-44px;width:64px;height:64px;margin:-32px 0 0 -32px}
}
@supports (animation-timeline: view()){ @media (prefers-reduced-motion:no-preference){
  html[data-mo="m32"][data-rh="p32"]:is([data-zp="yar"],[data-zp="az"]):not(.still):not([data-theatre="off"]) main.wrap > [data-sec="reviews"]:not([hidden])::before{
    --m-spin:90deg;animation:m32-spin linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
} }
/* S32 · серебряное перо на густой плите «Отзывов» читается серым призраком (кадр главной сессии 02.11) – при включённых плитах перо не ставим; без плит – как у P */
html:is([data-zp="yar"],[data-zp="az"]) [data-sec="reviews"] .p32-o-quill{display:none!important}
/* S32 · надзаголовок шапки «Онлайн-школа английского · с 2019 года» – 16 px, как все капители (ОТК фаза 2: было 15) */
html:not([data-tt="as"]) #hero :is(.t-kicker, .t-kicker .y){font-size:max(16px, calc(var(--t-kick, 16) * var(--ut, var(--u))))!important}
/* S32 · надзаголовок «Онлайн-школа английского» на небе читался слабо (рецензент: контраст ≈ 3,1 на ПК, 2,4 на телефоне) – мягкий ореол цвета кости
   вокруг букв, цвет и кегль те же. Не на яри (там надзаголовок светлый по тёмному). */
[data-sec="hero"]:not([data-key="sk-yar"]) #hero .t-kicker{text-shadow:0 0 calc(7 * var(--u)) rgba(251,248,241,.95),0 0 2px rgba(251,248,241,.95)}
/* S32 · фокус с клавиатуры виден везде: не тоньше 3 px (рецензент: местами ≈ 1 px); цвет – как задал раздел */
html :focus-visible{outline-width:3px!important;outline-offset:2px}
