/* Рекламные слоты РСЯ.
   Коробка (фон, рамка, подпись «Реклама») появляется только вместе с классом
   mr-ad-live — его ставит ads.js, когда пришёл непустой креатив. Иначе на
   странице висела бы пустая плашка: частый случай под VPN и блокировщиком. */

.mr-ad{ position:relative; }
/* line-height:0 убирает базовый зазор под креативом: iframe и img — строчные,
   и под ними остаётся полоса высотой в строку. При нулевых полях коробки она
   читалась бы как неровный отступ снизу. */
.mr-ad div[id^=yandex_rtb]{ margin:0 auto; max-width:100%; overflow:hidden; line-height:0; }
.mr-ad iframe, .mr-ad img{ display:block; margin:0 auto; max-width:100% !important; height:auto; }

/* Незаполненный слот выводится из потока. Родители теперь держат ритм через
   gap, а gap считается по числу элементов, а не по их высоте: пустая врезка
   между секциями добавляла бы второй интервал. display:none не годится —
   ads.js вставляет креатив только в слоты, которые реально размечены
   (getClientRects), а РСЯ нужна ненулевая ширина, чтобы выбрать формат.
   Опора для left/right — position:relative у .stack, .rail и .grid. */
.mr-ad-inline:not(.mr-ad-live),
.mr-ad-tile:not(.mr-ad-live),
.mr-ad-rail:not(.mr-ad-live){
  position:absolute; left:0; right:0; height:0; overflow:hidden;
}

/* Плашка лежит поверх креатива, в его левом верхнем углу: своих полей у коробки
   больше нет, и вынести подпись наружу некуда. Скруглён только внутренний угол —
   два внешних продолжают рамку слота. z-index нужен из-за iframe: он создаёт
   свой контекст наложения и без этого перекрыл бы подпись. */
.mr-ad-cap{ display:none; }
.mr-ad-live > .mr-ad-cap{
  display:block; position:absolute; top:0; left:0; z-index:2;
  padding:3px 10px 4px;
  background:var(--surface); border-right:1px solid var(--line);
  border-bottom:1px solid var(--line); border-bottom-right-radius:10px;
  font-size:9.5px; font-weight:700; line-height:1.6;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint);
}

/* Коробка слота: рамка и скругление наши, внутренних полей нет. Креатив РСЯ
   приходит со своим фоном на всю ширину, и любой наш отступ читается как рамка
   вокруг чужой картинки, а не как поле. overflow:hidden обрезает прямые углы
   креатива по нашему радиусу. */
.mr-ad-inline.mr-ad-live,
.mr-ad-tile.mr-ad-live,
.mr-ad-rail.mr-ad-live{
  padding:0; overflow:hidden;
  background:var(--surface); border:1.5px solid var(--line); border-radius:var(--r-card);
}

/* Врезка в потоке контента */
.mr-ad-inline{ display:block; width:100%; text-align:center; }

/* Строка таблицы. На узких экранах строки таблицы превращаются в карточки
   с подписями из data-label — рекламной строке эта трансформация не нужна. */
.mr-ad-tr > td{ padding:0 !important; border:0 !important; background:transparent !important; }
/* Воздух вокруг заполненной ленты даёт ячейка: у самой врезки есть рамки
   сверху и снизу, и они не должны слипаться с линейками соседних строк. */
.mr-ad-tr:has(.mr-ad-live) > td{ padding:8px 0 !important; }
@media (max-width:767px){
  .mr-ad-tr{ border:0 !important; padding:0 !important; }
  .mr-ad-tr > td{ display:block; }
  .mr-ad-tr > td::before{ content:none !important; }
  /* На узком экране строки таблицы — колонка карточек с gap, и пустая
     рекламная строка съедала бы два интервала вместо одного. */
  .mr-ad-tr:not(:has(.mr-ad-live)){ position:absolute; left:0; right:0; height:0; overflow:hidden; }
}
.mr-ad-row{ display:block; width:100%; text-align:center; }
.mr-ad-row.mr-ad-live{
  padding:0; overflow:hidden; background:var(--surface);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  border-left:3px solid var(--accent);
}

/* Плитка внутри сетки карточек — занимает всю строку, ритм сетки не ломается */
.mr-ad-tile{ display:block; width:100%; flex-basis:100%; grid-column:1/-1; text-align:center; }

/* Правый рельс — в потоке, внутри .rail, липнет при прокрутке */
.mr-ad-rail{ display:block; width:100%; }

/* Левый рельс — только на очень широких экранах, где сбоку остаётся жёлоб.
   Прибит к экрану: появление и исчезание на скролле слишком заметно. */
.mr-ad-rail-l{
  display:none; position:fixed; top:104px; z-index:120;
  right:calc(50% + var(--wrap) / 2 + 24px);
  width:min(320px, calc((100vw - var(--wrap)) / 2 - 48px));
}
@media (min-width:1900px){ .mr-ad-rail-l{ display:block; } }

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