/**
 * pg-prose v2 — единая типографика HTML-статей (CKEditor → сайт).
 * Не копирует ритм старого contenteditable-листа.
 */
:root {
  /* «По умолчанию» в fontSize = без span, этот кегль (18px на сайте и в редакторе) */
  --pg-prose-size: var(--pg-type-18-size, 18px);
  --pg-prose-line: 1.5;
  --pg-prose-gap: 0.85em;
  /* фикс. зазор от кегля абзаца — на h2–h6 нельзя 0.85em (крупный кегль заголовков раздувает зазор) */
  --pg-prose-gap-px: calc(0.85 * var(--pg-prose-size));
  --pg-prose-heading-pad-top: calc(0.75 * var(--pg-prose-size));
  --pg-prose-heading-pad-bottom: var(--pg-prose-gap-px);
  --pg-prose-heading-font: var(--pg-font-base, "Roboto Condensed", "Microsoft JhengHei", sans-serif);
  --pg-prose-body-font: var(--pg-font-condensed-cjk, "Roboto Condensed", "Microsoft JhengHei", sans-serif);
  --pg-prose-list-indent: 1.35rem;
  --pg-prose-list-item-gap: var(--pg-prose-gap-px);
  --pg-prose-quote-border: var(--pg-comment-accent, #c62828);
  /* карточка text_image — см. includes/PG_TEXT_IMAGE_CARD.md */
  --pg-ti-gap: 1rem 1.25rem;
  --pg-ti-caption-gap: 0.2rem 0.5rem;
  /* Между блоками статьи на сайте: padding соседей 16+16 = 32px (main.css). */
  --pg-post-block-pad-y: 16px;
  --pg-ti-media-max: 42%;
  --pg-ti-ph-min: 180px;
  --pg-ti-ph-min-caption: 140px;
}

/* --- База --- */
.pg-prose,
.post-article-content-block.pg-prose,
.compose-v2-editor-wrap .ck.ck-editor__editable_inline {
  font-family: var(--pg-prose-body-font);
  font-size: var(--pg-prose-size);
  line-height: var(--pg-prose-line);
  font-weight: 400;
  letter-spacing: normal;
  color: inherit;
}

/* --- Абзацы: padding вместо margin (margin схлопывается с заголовками) --- */
.pg-prose > p,
.post-article-content-block.pg-prose > p,
.compose-v2-editor-wrap .ck.ck-content > p {
  margin: 0;
  padding: 0 0 var(--pg-prose-gap-px);
}

.pg-prose > p:last-child,
.post-article-content-block.pg-prose > p:last-child {
  padding-bottom: 0;
}

/* Пустые абзацы CKE — не раздувают верстку */
.compose-v2-editor-wrap .ck.ck-content > p:empty,
.post-article-content-block.pg-prose > p:empty {
  margin: 0;
  padding: 0;
  min-height: 0;
}

.pg-prose sub,
.compose-v2-editor-wrap .ck.ck-content sub {
  font-size: 0.75em;
  vertical-align: sub;
  line-height: inherit;
}

.pg-prose sup,
.compose-v2-editor-wrap .ck.ck-content sup {
  font-size: 0.75em;
  vertical-align: super;
  line-height: inherit;
}

/* Размер фрагмента в абзаце (CKE fontSize → span.pg-text-size--N) */
.pg-prose .pg-text-size--10,
.post-article-content-block.pg-prose .pg-text-size--10,
.post-article-ti-text .pg-text-size--10,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--10 {
  font-size: var(--pg-type-10-size, 10px);
  line-height: var(--pg-type-10-lh-body, 14px);
}

.pg-prose .pg-text-size--12,
.post-article-content-block.pg-prose .pg-text-size--12,
.post-article-ti-text .pg-text-size--12,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--12 {
  font-size: var(--pg-type-12-size, 12px);
  line-height: var(--pg-type-12-lh-body, 16.8px);
}

.pg-prose .pg-text-size--14,
.post-article-content-block.pg-prose .pg-text-size--14,
.post-article-ti-text .pg-text-size--14,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--14 {
  font-size: var(--pg-type-14-size, 14px);
  line-height: var(--pg-type-14-lh, 19.6px);
}

.pg-prose .pg-text-size--16,
.post-article-content-block.pg-prose .pg-text-size--16,
.post-article-ti-text .pg-text-size--16,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--16 {
  font-size: var(--pg-type-16-size, 16px);
  line-height: var(--pg-type-16-lh-body, 22.4px);
}

.pg-prose .pg-text-size--18,
.post-article-content-block.pg-prose .pg-text-size--18,
.post-article-ti-text .pg-text-size--18,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--18 {
  font-size: var(--pg-type-18-size, 18px);
  line-height: var(--pg-type-18-lh-body, 27px);
}

.pg-prose .pg-text-size--20,
.post-article-content-block.pg-prose .pg-text-size--20,
.post-article-ti-text .pg-text-size--20,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--20 {
  font-size: var(--pg-type-20-size, 20px);
  line-height: var(--pg-type-20-lh-card, 26px);
}

.pg-prose .pg-text-size--22,
.post-article-content-block.pg-prose .pg-text-size--22,
.post-article-ti-text .pg-text-size--22,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--22 {
  font-size: var(--pg-type-22-size, 22px);
  line-height: var(--pg-type-22-lh-body, 28.6px);
}

/* legacy (ранний релиз: small/large) */
.pg-prose .pg-text-size--small,
.post-article-content-block.pg-prose .pg-text-size--small,
.post-article-ti-text .pg-text-size--small,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--small {
  font-size: var(--pg-type-16-size, 16px);
  line-height: var(--pg-type-16-lh-body, 22.4px);
}

.pg-prose .pg-text-size--large,
.post-article-content-block.pg-prose .pg-text-size--large,
.post-article-ti-text .pg-text-size--large,
.compose-v2-editor-wrap .ck.ck-content .pg-text-size--large {
  font-size: var(--pg-type-20-size, 20px);
  line-height: var(--pg-type-20-lh-card, 26px);
}

/* Spacer CKE: только filler-<br> или :empty. НЕ br:only-child — у <p>2<br>3</p> br единственный
   элемент-ребёнок (текст в CSS не считается), иначе padding-bottom:0 «съедает» воздух до след. <p>. */
.compose-v2-editor-wrap .ck.ck-content > p:has(> br[data-cke-filler]),
.post-article-content-block.pg-prose > p:has(> br[data-cke-filler]) {
  margin: 0;
  padding: 0;
  min-height: 0;
}

/* Последний <p> в CKE — видимая строка ввода; padding как у всех <p> (зазор 1–2 ≈ 3–4). */
.compose-v2-editor-wrap .ck.ck-content > p:last-child {
  min-height: 1.55em;
}

.compose-v2-editor-wrap .ck.ck-content > p:last-child:has(> br[data-cke-filler]) {
  min-height: 1.55em;
}

/* --- Заголовки: только свои отступы, соседние <p> не «втягиваются» --- */
.pg-prose > h2,
.pg-prose > h3,
.pg-prose > h4,
.pg-prose > h5,
.pg-prose > h6,
.post-article-content-block.pg-prose > h2,
.post-article-content-block.pg-prose > h3,
.post-article-content-block.pg-prose > h4,
.post-article-content-block.pg-prose > h5,
.post-article-content-block.pg-prose > h6,
.compose-v2-editor-wrap .ck.ck-content > h2,
.compose-v2-editor-wrap .ck.ck-content > h3,
.compose-v2-editor-wrap .ck.ck-content > h4,
.compose-v2-editor-wrap .ck.ck-content > h5,
.compose-v2-editor-wrap .ck.ck-content > h6 {
  margin: 0;
  padding: var(--pg-prose-heading-pad-top) 0 var(--pg-prose-heading-pad-bottom);
  font-family: var(--pg-prose-heading-font);
  font-weight: 500;
  text-transform: uppercase;
  color: #e7e7e7;
  line-height: 1.22;
}

.pg-prose > :first-child,
.post-article-content-block.pg-prose > :first-child,
.compose-v2-editor-wrap .ck.ck-content > :first-child {
  padding-top: 0;
}

.pg-prose > h2:first-child,
.pg-prose > h3:first-child,
.pg-prose > h4:first-child,
.pg-prose > h5:first-child,
.pg-prose > h6:first-child,
.post-article-content-block.pg-prose > h2:first-child,
.post-article-content-block.pg-prose > h3:first-child,
.post-article-content-block.pg-prose > h4:first-child,
.post-article-content-block.pg-prose > h5:first-child,
.post-article-content-block.pg-prose > h6:first-child,
.compose-v2-editor-wrap .ck.ck-content > h2:first-child,
.compose-v2-editor-wrap .ck.ck-content > h3:first-child,
.compose-v2-editor-wrap .ck.ck-content > h4:first-child,
.compose-v2-editor-wrap .ck.ck-content > h5:first-child,
.compose-v2-editor-wrap .ck.ck-content > h6:first-child {
  padding-top: 0;
}

/* Абзац сразу после заголовка — без двойного зазора сверху */
.pg-prose > :is(h2, h3, h4, h5, h6) + p,
.post-article-content-block.pg-prose > :is(h2, h3, h4, h5, h6) + p,
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6) + p {
  padding-top: 0;
}

/* Абзац → заголовок: зазор только от padding-bottom у <p>, без второго отступа сверху у h */
.pg-prose > p + :is(h2, h3, h4, h5, h6),
.post-article-content-block.pg-prose > p + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > p + :is(h2, h3, h4, h5, h6) {
  margin-top: 0;
  padding-top: 0;
}

/* Enter между заголовками → пустой <p> без padding: иначе h2–h4 «слипаются» (только нижний pad предыдущего h) */
.pg-prose > p:empty + :is(h2, h3, h4, h5, h6),
.post-article-content-block.pg-prose > p:empty + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > p:empty + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > p:has(> br[data-cke-filler]) + :is(h2, h3, h4, h5, h6) {
  padding-top: var(--pg-prose-heading-pad-top);
}

/* Заголовок (последний в текстовом блоке) → отдельный блок image/video: 32px = pad блоков 16+16, без pad-bottom у h */
.post-article-content-block.pg-prose:has(+ .post-article-content-block > img)
  > :is(h2, h3, h4, h5, h6):last-child,
.post-article-content-block.pg-prose:has(+ p.post-article-content-block > img)
  > :is(h2, h3, h4, h5, h6):last-child,
.post-article-content-block.pg-prose:has(+ .post-article-content-block.post-article-video-wrap)
  > :is(h2, h3, h4, h5, h6):last-child {
  padding-bottom: 0;
}

/* Красная метка у заголовка — геометрия как в классическом листе (compose-inline-heading--leading-slash) */
.pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark,
.post-article-content-block.pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark,
.post-article-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark {
  position: relative;
  overflow: visible;
  padding-left: 18px;
  /* Вертикаль ::before = padding-top + центр первой строки (см. правила ниже) */
  --pg-mark-offset-top: var(--pg-prose-heading-pad-top);
}

/* padding-top: 0 у заголовка → метка без сдвига (первый блок, абзац перед h) */
.pg-prose > :first-child.pg-heading-mark,
.post-article-content-block.pg-prose > :first-child.pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > :first-child.pg-heading-mark,
.pg-prose > p + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.post-article-content-block.pg-prose > p + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > p + :is(h2, h3, h4, h5, h6).pg-heading-mark {
  --pg-mark-offset-top: 0px;
}

/* Ритм блоков: padding-top: 0 у h — метка на первой строке (иначе ::before «съезжает» вниз) */
.compose-v2-editor-wrap .ck.ck-content > figure.image + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + :is(h2, h3, h4, h5, h6).pg-heading-mark {
  --pg-mark-offset-top: 0px;
}

/* Enter между заголовками → пустой <p>: у h снова padding-top — метку опускаем на ту же величину */
.pg-prose > p:empty + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.post-article-content-block.pg-prose > p:empty + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > p:empty + :is(h2, h3, h4, h5, h6).pg-heading-mark,
.compose-v2-editor-wrap .ck.ck-content > p:has(> br[data-cke-filler]) + :is(h2, h3, h4, h5, h6).pg-heading-mark {
  --pg-mark-offset-top: var(--pg-prose-heading-pad-top);
}

/* Редактор: не дублировать метку обводкой CKE/«Границ» */
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6).pg-heading-mark {
  outline: none;
  box-shadow: none;
}

.post-article-content-block.pg-prose,
.post-article-content-block--text-image .post-article-ti-text {
  overflow: visible;
}

.pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
.post-article-content-block.pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
.post-article-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.1em;
  top: calc(var(--pg-mark-offset-top, 0px) + 0.5lh - 0.44em);
  width: 5px;
  height: 0.88em;
  background-color: var(--pg-post-accent, #e30017);
  transform: skewX(-22deg);
  transform-origin: center;
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

@media (min-width: 1025px) {
  .pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
  .post-article-content-block.pg-prose > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
  .post-article-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
  .compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6).pg-heading-mark::before,
  .compose-v2-editor-wrap .ck.ck-content .pg-ti-text > :is(h2, h3, h4, h5, h6).pg-heading-mark::before {
    width: 4px;
  }
}

/* Кегли h2–h6: лестница A (редактор = сайт с pg-prose) */
.pg-prose > h2,
.compose-v2-editor-wrap .ck.ck-content > h2,
.post-article-content-block.pg-prose > h2 { font-size: 28px; }
.pg-prose > h3,
.compose-v2-editor-wrap .ck.ck-content > h3,
.post-article-content-block.pg-prose > h3 { font-size: 24px; }
.pg-prose > h4,
.compose-v2-editor-wrap .ck.ck-content > h4,
.post-article-content-block.pg-prose > h4 { font-size: 21px; }
.pg-prose > h5,
.compose-v2-editor-wrap .ck.ck-content > h5,
.post-article-content-block.pg-prose > h5 { font-size: 19px; }
.pg-prose > h6,
.compose-v2-editor-wrap .ck.ck-content > h6,
.post-article-content-block.pg-prose > h6 { font-size: 17px; }

/* --- Списки --- */
.pg-prose > ul,
.pg-prose > ol,
.post-article-content-block.pg-prose > ul,
.post-article-content-block.pg-prose > ol,
.compose-v2-editor-wrap .ck.ck-content > ul,
.compose-v2-editor-wrap .ck.ck-content > ol {
  margin: 0;
  padding: 0 0 var(--pg-prose-gap-px) var(--pg-prose-list-indent);
}

.pg-prose > ul:last-child,
.pg-prose > ol:last-child,
.post-article-content-block.pg-prose > ul:last-child,
.post-article-content-block.pg-prose > ol:last-child,
.compose-v2-editor-wrap .ck.ck-content > ul:last-child,
.compose-v2-editor-wrap .ck.ck-content > ol:last-child {
  padding-bottom: 0;
}

/* Абзац → список / список → абзац — без двойного зазора */
.pg-prose > p + :is(ul, ol),
.post-article-content-block.pg-prose > p + :is(ul, ol),
.compose-v2-editor-wrap .ck.ck-content > p + :is(ul, ol) {
  margin-top: 0;
  padding-top: 0;
}

.pg-prose > :is(ul, ol) + p,
.post-article-content-block.pg-prose > :is(ul, ol) + p,
.compose-v2-editor-wrap .ck.ck-content > :is(ul, ol) + p {
  margin-top: 0;
  padding-top: 0;
}

/* Списки по умолчанию — плотные (Shift+Enter / один пункт в блоке) */
.pg-prose > ul > li,
.pg-prose > ol > li,
.post-article-content-block.pg-prose > ul > li,
.post-article-content-block.pg-prose > ol > li {
  margin: 0.2em 0;
  padding: 0;
}

/* Редактор: плотный список — маркер на каждой строке, ритм парный с сайтом */
.compose-v2-editor-wrap .ck.ck-content > ul:not(.pg-list--loose) > li,
.compose-v2-editor-wrap .ck.ck-content > ol:not(.pg-list--loose) > li {
  display: list-item;
  margin: 0.2em 0;
  padding: 0;
}

.compose-v2-editor-wrap .ck.ck-content > ul:not(.pg-list--loose),
.compose-v2-editor-wrap .ck.ck-content > ol:not(.pg-list--loose) {
  list-style-position: outside;
}

.compose-v2-editor-wrap .ck.ck-content li > p,
.compose-v2-editor-wrap .ck.ck-content li > span.ck-list-bogus-paragraph {
  margin: 0;
  padding: 0;
}

/* Только в редакторе: пустой <li> между пунктами = «пустая строка» (как зазор в посте).
   Высота = --pg-prose-list-item-gap, не полная строка абзаца. При сохранении
   normalizeEachListInHtml сворачивает в class="pg-list--loose". */
.compose-v2-editor-wrap .ck.ck-content li:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child),
.compose-v2-editor-wrap .ck.ck-content li:has(> p > br[data-cke-filler]:only-child) {
  list-style: none;
  margin: 0;
  padding: 0;
  min-height: 0;
  height: var(--pg-prose-list-item-gap);
  max-height: var(--pg-prose-list-item-gap);
  line-height: var(--pg-prose-list-item-gap);
  overflow: hidden;
}

.compose-v2-editor-wrap .ck.ck-content li:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child) > .ck-list-bogus-paragraph,
.compose-v2-editor-wrap .ck.ck-content li:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child) > p,
.compose-v2-editor-wrap .ck.ck-content li:has(> p > br[data-cke-filler]:only-child) > p {
  margin: 0;
  padding: 0;
  min-height: 0;
  line-height: inherit;
}

/* Список с пустыми <li> между пунктами: у непустых убираем плотный margin 0.2em */
.compose-v2-editor-wrap .ck.ck-content > ul:has(> li:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child)) > li:not(:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child)),
.compose-v2-editor-wrap .ck.ck-content > ul:has(> li:has(> p > br[data-cke-filler]:only-child)) > li:not(:has(> p > br[data-cke-filler]:only-child)),
.compose-v2-editor-wrap .ck.ck-content > ol:has(> li:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child)) > li:not(:has(> .ck-list-bogus-paragraph > br[data-cke-filler]:only-child)),
.compose-v2-editor-wrap .ck.ck-content > ol:has(> li:has(> p > br[data-cke-filler]:only-child)) > li:not(:has(> p > br[data-cke-filler]:only-child)) {
  margin: 0;
  padding: 0;
}

/* Рыхлый список: пустые строки между пунктами до маркера → class pg-list--loose */
.pg-prose > ul.pg-list--loose > li,
.pg-prose > ol.pg-list--loose > li,
.post-article-content-block.pg-prose > ul.pg-list--loose > li,
.post-article-content-block.pg-prose > ol.pg-list--loose > li,
.compose-v2-editor-wrap .ck.ck-content > ul.pg-list--loose > li,
.compose-v2-editor-wrap .ck.ck-content > ol.pg-list--loose > li {
  margin: 0;
  padding: 0 0 var(--pg-prose-list-item-gap);
}

.pg-prose > ul.pg-list--loose > li:last-child,
.pg-prose > ol.pg-list--loose > li:last-child,
.post-article-content-block.pg-prose > ul.pg-list--loose > li:last-child,
.post-article-content-block.pg-prose > ol.pg-list--loose > li:last-child,
.compose-v2-editor-wrap .ck.ck-content > ul.pg-list--loose > li:last-child,
.compose-v2-editor-wrap .ck.ck-content > ol.pg-list--loose > li:last-child {
  padding-bottom: 0;
}

/* Вложенные списки — компактнее */
.pg-prose li li,
.post-article-content-block.pg-prose li li,
.compose-v2-editor-wrap .ck.ck-content li li {
  margin: 0.2em 0;
  padding: 0;
}

.pg-prose > ul,
.post-article-content-block.pg-prose > ul,
.compose-v2-editor-wrap .ck.ck-content > ul {
  list-style-type: disc;
}

.pg-prose > ol,
.post-article-content-block.pg-prose > ol,
.compose-v2-editor-wrap .ck.ck-content > ol {
  list-style-type: decimal;
}

/* =============================================================================
   Карточка text_image (редактор) — визуал как classic .compose-ti-* (post_compose.php)
   Контракт DOM: includes/PG_TEXT_IMAGE_CARD.md
   ============================================================================= */

/* Оболочка виджета — без «карточки с рамкой», только flex как в классике */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block {
  display: flex;
  flex-wrap: nowrap;
  box-sizing: border-box;
  align-items: flex-start;
  gap: var(--pg-ti-gap);
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: inherit;
  font-family: var(--pg-prose-body-font);
}

/* --- Редактор v2: блочный ритм как на посте (один зазор 32px, без суммы margin) --- */
.compose-v2-editor-wrap .ck.ck-content > figure.image {
  margin: 0;
}

.compose-v2-editor-wrap .ck.ck-content > figure.image > img {
  margin: 0;
}

/* Абзац ↔ блочный виджет: 16 + 16 */
.compose-v2-editor-wrap .ck.ck-content > p:has(+ .pg-ti-block),
.compose-v2-editor-wrap .ck.ck-content > p:has(+ figure.image) {
  padding-bottom: var(--pg-post-block-pad-y);
}

.compose-v2-editor-wrap .ck.ck-content > p + .pg-ti-block,
.compose-v2-editor-wrap .ck.ck-content > p + figure.image {
  margin-top: var(--pg-post-block-pad-y);
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + p,
.compose-v2-editor-wrap .ck.ck-content > figure.image + p {
  padding-top: var(--pg-post-block-pad-y);
}

/* Заголовок ↔ блочный виджет: 32px (как text + image на сайте), без pad-bottom у h */
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6):has(+ .pg-ti-block),
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6):has(+ figure.image) {
  padding-bottom: 0;
}

.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6) + .pg-ti-block,
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6) + figure.image,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > figure.image + :is(h2, h3, h4, h5, h6) {
  margin-top: calc(2 * var(--pg-post-block-pad-y));
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > figure.image + :is(h2, h3, h4, h5, h6) {
  padding-top: 0;
}

/* Два блочных виджета подряд */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + figure.image,
.compose-v2-editor-wrap .ck.ck-content > figure.image + .pg-ti-block,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block + .pg-ti-block,
.compose-v2-editor-wrap .ck.ck-content > figure.image + figure.image,
.compose-v2-editor-wrap .ck.ck-content > .pg-video-block + :is(p, figure.image, .pg-ti-block, .pg-video-block),
.compose-v2-editor-wrap .ck.ck-content > :is(p, figure.image, .pg-ti-block) + .pg-video-block,
.compose-v2-editor-wrap .ck.ck-content > .pg-video-block + :is(h2, h3, h4, h5, h6),
.compose-v2-editor-wrap .ck.ck-content > :is(h2, h3, h4, h5, h6) + .pg-video-block {
  margin-top: calc(2 * var(--pg-post-block-pad-y));
}

.compose-v2-editor-wrap .ck.ck-content > p:has(+ .pg-video-block),
.compose-v2-editor-wrap .ck.ck-content > p + .pg-video-block {
  padding-bottom: var(--pg-post-block-pad-y);
  margin-top: var(--pg-post-block-pad-y);
}

.compose-v2-editor-wrap .ck.ck-content > .pg-video-block + p {
  padding-top: var(--pg-post-block-pad-y);
}

/* =============================================================================
   Видео embed (редактор) — шаг G, маркер <!--pg-block:video:URL-->
   ============================================================================= */

.compose-v2-editor-wrap .ck.ck-content > .pg-video-block {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #000;
  border: 0;
  box-sizing: border-box;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-video-block iframe.pg-video-embed {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: #000;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-video-block.ck-widget_selected {
  outline: 2px solid var(--pg-compose-accent, #ff4d4f);
  outline-offset: 2px;
}

/* Загрузка — только по зоне изображения */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap[data-src=""],
.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap:not([data-src]),
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot[data-src=""],
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot:not([data-src]) {
  cursor: pointer;
}

/* Пустой слот — .compose-ti-image--empty */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot {
  flex: 0 0 auto;
  max-width: var(--pg-ti-media-max);
  margin: 0;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--pg-ti-ph-min);
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap[data-src]:not([data-src=""]),
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot[data-src]:not([data-src=""]) {
  min-height: 0;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot > img.pg-ti-media {
  display: block;
  width: auto;
  height: auto;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 0;
  background: transparent;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap[data-src=""] > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap:not([data-src]) > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot[data-src=""] > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot:not([data-src]) > img.pg-ti-media {
  display: none;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-media-wrap:not([data-src])::before,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot:not([data-src])::before {
  content: 'Изображение';
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--pg-ti-ph-min);
  box-sizing: border-box;
  border: 1px dashed #3b3b3b;
  background: #121212;
  color: #7b8190;
  font-size: 13px;
  letter-spacing: normal;
  text-transform: none;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot--2[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-slot--2:not([data-src])::before {
  content: 'Изображение';
}

/* Legacy HTML без .pg-ti-media-wrap (старые черновики до v2-layout) */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block > img.pg-ti-media {
  display: block;
  flex: 0 0 auto;
  max-width: var(--pg-ti-media-max);
  width: auto;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  margin: 0 auto;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block[data-src=""] > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block:not([data-src]) > img.pg-ti-media {
  display: none;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block:not([data-src])::before {
  content: 'Изображение';
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--pg-ti-ph-min);
  flex: 0 0 auto;
  max-width: var(--pg-ti-media-max);
  box-sizing: border-box;
  border: 1px dashed #3b3b3b;
  background: #121212;
  color: #7b8190;
  font-size: 13px;
  letter-spacing: normal;
  text-transform: none;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block:has(.pg-ti-media-wrap)[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block:has(.pg-ti-media-wrap):not([data-src])::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top:not([data-src])::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom:not([data-src])::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top:has(.pg-ti-dual)::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom:has(.pg-ti-dual)::before {
  content: none !important;
  display: none !important;
  min-height: 0;
  flex: none;
  border: 0;
  padding: 0;
  margin: 0;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom > img.pg-ti-media {
  display: none;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block[data-src=""]:not(:has(.pg-ti-media-wrap)):not(.pg-ti-block--image_top):not(.pg-ti-block--image_bottom):hover::before {
  border-color: rgba(255, 255, 255, 0.32);
  color: rgba(255, 255, 255, 0.55);
}

/* Текст — .compose-ti-text: без рамки и фона, компактная одна строка */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text {
  position: relative;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  color: #d8d8d8;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  margin: 0;
  outline: none;
  cursor: text;
  display: block;
  line-height: inherit;
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: normal;
  white-space: pre-wrap;
  box-shadow: none !important;
  align-self: flex-start;
  flex-grow: 0;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-text.ck-editor__nested-editable,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text.ck-editor__nested-editable_focused,
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text.ck-editor__nested-editable:focus {
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Пустой caption: единственный <p> без вертикальных отступов — иначе курсор ниже ::before */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text > p {
  margin: 0;
  padding: 0;
  min-height: 0;
}

/* CKE .ck-placeholder::before без top — выравниваем с нашим плейсхолдером и строкой ввода */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text.ck-placeholder::before {
  top: 0;
  line-height: inherit;
}

/* Рядом с картинкой — текст занимает оставшуюся ширину (как в классике) */
.compose-v2-editor-wrap
  .ck.ck-content
  > .pg-ti-block--image_left:not(.pg-ti-block--caption_below):not(.pg-ti-block--caption_above)
  .pg-ti-text,
.compose-v2-editor-wrap
  .ck.ck-content
  > .pg-ti-block--image_right:not(.pg-ti-block--caption_below):not(.pg-ti-block--caption_above)
  .pg-ti-text {
  flex: 1 1 0;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below .pg-ti-text,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above .pg-ti-text {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
}

/* Плейсхолдер поверх строки ввода (CKE: один <br data-cke-filler>, без <p>) */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-text:is(
    :empty,
    .ck-placeholder,
    :has(> br[data-cke-filler]:only-child),
    :has(> br:only-child),
    :has(> p:only-child > br:only-child),
    :has(> p:only-child:empty)
  )::before {
  content: attr(data-placeholder, 'Начните писать текст…');
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  max-width: 100%;
  color: #6d6d6d;
  pointer-events: none;
  white-space: pre-wrap;
}

.compose-v2-editor-wrap
  .ck.ck-content
  > :is(.pg-ti-block--caption_below, .pg-ti-block--caption_above)
  .pg-ti-text:is(
    :empty,
    :has(> br[data-cke-filler]:only-child),
    :has(> p:only-child > br:only-child)
  )::before {
  content: 'Подпись…';
}

/* --- Layouts (как .post-article-content-block--ti-* в main.css: row/column, порядок из DOM) --- */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_left,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right {
  flex-direction: row;
}

/* Пустая подпись: image_right — картинка справа (как на посте без .post-article-ti-text) */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right:has(.pg-ti-text:empty) {
  justify-content: flex-end;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right:has(.pg-ti-text:empty) .pg-ti-media-wrap,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right:has(.pg-ti-text:empty) > img.pg-ti-media {
  margin-left: auto;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above {
  flex-direction: column;
  align-items: stretch;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above {
  gap: var(--pg-ti-caption-gap);
}

/* Колонка: картинка/два слота на всю ширину редактора (как на скрине классики) */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top > .pg-ti-media-wrap,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom > .pg-ti-media-wrap,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above .pg-ti-media-wrap,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below .pg-ti-media-wrap {
  flex: 0 0 auto;
  max-width: 100%;
  width: 100%;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above .pg-ti-media-wrap[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below .pg-ti-media-wrap[data-src=""]::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above .pg-ti-media-wrap:not([data-src])::before,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below .pg-ti-media-wrap:not([data-src])::before {
  min-height: var(--pg-ti-ph-min-caption);
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above .pg-ti-media-wrap > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below .pg-ti-media-wrap > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_above > img.pg-ti-media,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--caption_below > img.pg-ti-media {
  max-width: 100%;
  width: auto;
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top .pg-ti-text,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom .pg-ti-text {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
}

/* --- Dual-image: два слота в ряд (image_top / image_bottom) --- */
.compose-v2-editor-wrap .ck.ck-content .pg-ti-dual {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 0.75rem 1rem;
  width: 100%;
  box-sizing: border-box;
}

.compose-v2-editor-wrap .ck.ck-content .pg-ti-dual .pg-ti-slot {
  flex: 0 1 auto;
  max-width: calc(50% - 0.5rem);
}

.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_top > .pg-ti-dual,
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_bottom > .pg-ti-dual {
  flex: 0 0 auto;
  max-width: 100%;
}

/* Узкий экран — как @media (max-width: 640px) в main.css */
@media (max-width: 640px) {
  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_left,
  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right {
    flex-direction: column;
    align-items: stretch;
  }

  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_left .pg-ti-media-wrap,
  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right .pg-ti-media-wrap,
  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_left > img.pg-ti-media,
  .compose-v2-editor-wrap .ck.ck-content > .pg-ti-block--image_right > img.pg-ti-media {
    max-width: 100%;
    width: 100%;
    align-self: center;
  }

  .compose-v2-editor-wrap .ck.ck-content .pg-ti-dual {
    flex-direction: column;
    align-items: stretch;
  }

  .compose-v2-editor-wrap .ck.ck-content .pg-ti-dual .pg-ti-slot {
    flex: 1 1 auto;
    max-width: 100%;
    width: 100%;
  }
}

/* CKE widget selection — оставляем дефолтный outline lark-темы; убираем лишний фон, чтобы не спорил с нашим */
.compose-v2-editor-wrap .ck.ck-content > .pg-ti-block.ck-widget_selected {
  background: transparent;
}

/* --- Цитата (как classic / post-article-rich-quote: зазор снаружи, не внутри фона) --- */
.pg-prose > blockquote,
.post-article-content-block.pg-prose > blockquote,
.compose-v2-editor-wrap .ck.ck-content > blockquote {
  margin: 0 0 var(--pg-prose-gap-px);
  padding: 0.65rem 1rem 0.65rem 1.1rem;
  border-left: 4px solid var(--pg-prose-quote-border);
  background: rgba(245, 245, 245, 0.08);
  color: #bbb;
  font-style: normal;
  box-sizing: border-box;
}

.pg-prose > blockquote:last-child,
.post-article-content-block.pg-prose > blockquote:last-child,
.compose-v2-editor-wrap .ck.ck-content > blockquote:last-child {
  margin-bottom: 0;
}

/* CKE: <blockquote><p>…</p></blockquote> — без лишнего padding у вложенного <p> */
.pg-prose blockquote > p,
.post-article-content-block.pg-prose blockquote > p,
.compose-v2-editor-wrap .ck.ck-content blockquote > p {
  margin: 0;
  padding: 0;
}

.pg-prose > blockquote + p,
.post-article-content-block.pg-prose > blockquote + p,
.compose-v2-editor-wrap .ck.ck-content > blockquote + p {
  padding-top: 0;
}

/* --- Ссылки --- */
.pg-prose a,
.post-article-content-block.pg-prose a,
.compose-v2-editor-wrap .ck.ck-content a {
  color: var(--pg-comment-accent, #c62828);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --- Картинки в потоке --- */
.pg-prose > figure,
.pg-prose > p > img,
.pg-prose > img,
.post-article-content-block.pg-prose img,
.compose-v2-editor-wrap .ck.ck-content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 0 var(--pg-prose-gap-px);
}

.post-article-content-block.pg-prose > p:last-child img:only-child,
.compose-v2-editor-wrap .ck.ck-content > p:last-child img:only-child {
  margin-bottom: 0;
}

/* --- Горизонтальная линия --- */
.pg-prose > hr,
.post-article-content-block.pg-prose > hr,
.compose-v2-editor-wrap .ck.ck-content hr {
  border: 0;
  border-top: 1px solid #3a3a3a;
  height: 0;
  margin: var(--pg-prose-gap-px) 0;
}

/* --- Редактор: тёмная тема, без лишнего line-height 27px --- */
.compose-v2-editor-wrap .ck.ck-editor__editable_inline {
  min-height: 54vh;
  background: transparent !important;
  color: #b8b8b8 !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0 20px !important;
}

.compose-v2-editor-wrap .ck.ck-toolbar,
.compose-v2-toolbar-host .ck.ck-toolbar {
  background: #0d0d0d !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 6px !important;
  margin-bottom: 12px;
}

.compose-v2-toolbar-row .compose-v2-toolbar-host .ck.ck-toolbar {
  margin-bottom: 0;
  width: 100%;
  background: transparent !important;
}

.compose-v2-editor-wrap .ck.ck-toolbar .ck-button,
.compose-v2-toolbar-host .ck.ck-toolbar .ck-button {
  color: #d8d8d8 !important;
}

.compose-v2-editor-wrap .ck.ck-toolbar .ck-button:hover,
.compose-v2-toolbar-host .ck.ck-toolbar .ck-button:hover {
  background: #1a1a1a !important;
}

.pg-ckeditor-wrap--toolbar-external > .ck-editor > .ck-editor__top {
  display: none !important;
}

/* Секция текста на сайте: отступ только снаружи блока, не у каждого <p> */
.post-article-content-block.pg-prose {
  padding: var(--pg-post-block-pad-y, 16px) 0;
  color: var(--pg-post-body, #b8b8b8);
}

.post-article-content-block.pg-prose:first-child {
  padding-top: 0;
}
