/* Окно «Что нового» (DGT-REL-02). Своей палитры не заводит — только токены
   общей темы, как и тур в portal-onboarding.css. */

/* Разметка приезжает с hidden, и снимает его только скрипт. Правило
   [hidden] стоит первым и с !important намеренно: display у диалога ниже
   перебил бы атрибут, и окно висело бы на странице у всех, включая тех, у
   кого JavaScript выключен. Ровно этим уже ломался тур. */
.portal-release[hidden] {
  display: none !important;
}

.portal-release {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 16px;
  position: fixed;
  z-index: 130;
}

.portal-release__backdrop {
  background: rgba(0, 0, 0, 0.58);
  inset: 0;
  position: absolute;
}

.portal-release__dialog {
  background: var(--course-surface);
  border: 1px solid var(--course-line-strong);
  border-radius: var(--course-radius);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4);
  display: grid;
  gap: 14px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 18px;
  position: relative;
  width: min(520px, 100%);
}

.portal-release__dialog:focus-visible {
  outline: 2px solid var(--course-cyan);
  outline-offset: 2px;
}

.portal-release__header {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.portal-release__identity {
  display: grid;
  gap: 4px;
}

.portal-release__eyebrow {
  color: var(--course-cyan);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.portal-release__identity h2 {
  border: 0;
  color: var(--course-text);
  font-size: 20px;
  line-height: 1.25;
  margin: 0;
  padding: 0;
}

.portal-release__stamp {
  color: var(--course-muted);
  font-size: 13px;
  margin: 0;
}

.portal-release__close {
  align-items: center;
  background: transparent;
  border: 1px solid var(--course-line-strong);
  border-radius: var(--course-radius);
  color: var(--course-muted);
  cursor: pointer;
  display: flex;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
}

.portal-release__close:hover,
.portal-release__close:focus-visible {
  border-color: var(--course-cyan);
  color: var(--course-text);
}

.portal-release__lead {
  color: var(--course-muted);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

/* ТРИ УРОВНЯ ОКНА РАЗЛИЧАЮТСЯ КЕГЛЕМ, А НЕ ТОЛЬКО НАЧЕРТАНИЕМ.
   Замер до правки (headless Chrome, 1280×900): лид окна 14 px, заголовок полки
   14 px, строка правки 14 px — один кегль на все три уровня, разница только в
   насыщенности (600 против 400). Список шёл без маркера и без отступа, пункт
   начинался с того же x, что и заголовок полки, а просвет между пунктами (6 px)
   был втрое меньше межстрочного интервала внутри пункта (20,3 px): две соседние
   правки стояли плотнее, чем две строки одной правки, и читались одним абзацем.
   Отсюда жалоба «сливается текст». Ниже кегль, цвет, маркер, отступ и просвет
   разведены так, чтобы уровень был виден без чтения. */
.portal-release__groups {
  display: grid;
  gap: 16px;
}

/* Заголовок полки — подпись над списком, а не такая же строка текста: мельче
   строки правки, приглушённого цвета, с разрядкой. Тот же приём, что у
   .portal-release__eyebrow в шапке этого же окна. */
.portal-release__group h3 {
  align-items: center;
  border: 0;
  color: var(--course-muted);
  display: flex;
  font-size: 12px;
  font-weight: 700;
  gap: 8px;
  letter-spacing: 0.04em;
  margin: 0 0 8px;
  padding: 0;
  text-transform: uppercase;
}

/* Полка без пунктов (мелочь) — строка-итог, и просвета под несуществующим
   списком у неё быть не должно. */
.portal-release__group--total h3 {
  margin-bottom: 0;
}

.portal-release__count {
  background: var(--course-line);
  border-radius: 999px;
  color: var(--course-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  padding: 1px 8px;
}

/* Просвет между пунктами БОЛЬШЕ межстрочного интервала внутри пункта (20,3 px
   при кегле 14 и интерлиньяже 1.45): иначе двухстрочная правка склеивается со
   следующей. list-style: none оставлен нарочно — маркер рисуется ::before,
   потому что li здесь grid (текст, подпись места и ссылки идут своими рядами),
   а grid снимает display: list-item вместе с настоящим маркером. */
.portal-release__list {
  display: grid;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.portal-release__list li {
  display: grid;
  gap: 4px;
  padding-left: 16px;
  position: relative;
}

.portal-release__list li::before {
  background: var(--course-cyan);
  border-radius: 50%;
  content: '';
  height: 5px;
  left: 2px;
  position: absolute;
  /* Полвысоты строки минус полмаркера: точка встаёт на первую строку пункта и
     не съезжает, когда текст переносится на вторую. */
  top: 8px;
  width: 5px;
}

.portal-release__what {
  color: var(--course-text);
  font-size: 14px;
  line-height: 1.45;
}

/* Подпись места и ссылки — один ряд под текстом правки, мельче его. */
.portal-release__meta {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}

.portal-release__meta:empty {
  display: none;
}

.portal-release__where {
  color: var(--course-muted);
  font-size: 12px;
}

/* До открытия окна адрес стоит в span (разбор — в шапке партиала), и <a> из
   него делает скрипт. Вид у обоих один: подмена не должна быть видна. */
.portal-release__meta a,
.portal-release__page {
  color: var(--course-cyan);
  font-size: 13px;
  text-decoration: none;
}

.portal-release__meta a:hover,
.portal-release__meta a:focus-visible {
  text-decoration: underline;
}

.portal-release__footer {
  align-items: center;
  border-top: 1px solid var(--course-line);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  padding-top: 12px;
}

.portal-release__all {
  color: var(--course-muted);
  font-size: 13px;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
}

.portal-release__confirm {
  background: var(--course-cyan);
  border: 1px solid var(--course-cyan);
  border-radius: var(--course-radius);
  color: var(--course-bg);
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  min-height: 44px;
  padding: 8px 16px;
}

.portal-release__confirm:hover,
.portal-release__confirm:focus-visible {
  filter: brightness(1.08);
}

/* Пока окно открыто, страница под ним не прокручивается: иначе фон уезжает
   из-под пальца на телефоне, а вернуться к прочитанному месту нечем. */
html.portal-release-is-open,
html.portal-release-is-open body {
  overflow: hidden;
}

@media (max-width: 899px) {
  .portal-release {
    align-items: flex-end;
    padding: 0;
  }

  .portal-release__dialog {
    border-radius: var(--course-radius) var(--course-radius) 0 0;
    max-height: 86vh;
    width: 100%;
  }

  .portal-release__footer {
    justify-content: stretch;
  }

  .portal-release__confirm {
    flex: 1 1 auto;
  }
}

@media print {
  .portal-release {
    display: none !important;
  }
}