@charset "UTF-8";

/* ============================================================================
   vstrecha.css — приветственная страница, которая стоит в корне сайта.

   ЧТО ЗДЕСЬ И ЧЕГО ЗДЕСЬ НЕТ. Шрифты, цвета, кегли и мера строки взяты из
   site.css целиком: приветствие обязано выглядеть тем же изданием, что и
   приложение, иначе переход из одного в другое читается сменой сайта.
   Здесь только то, чего в приложении нет и быть не может: полосы во всю
   ширину, чёрные пластины и герой.

   ПОЧЕМУ ПАЛИТРА ЗАКРЕПЛЕНА. В приложении тему выбирает человек, и по
   умолчанию она бумажная. У приветствия выбора нет и быть не должно: его
   строй держится на чередовании бумаги и чёрного, и если бумажные полосы
   почернеют вслед за системной настройкой телефона, чередование исчезнет,
   а с ним и весь строй. Поэтому светлые значения заданы здесь жёстко.

   НИ ОДНОГО РАСТРОВОГО ИЗОБРАЖЕНИЯ. Довод страницы — сам набор: греческий
   Didot и русский под ним весят ровно столько, сколько на основном сайте
   весит фотография, и при этом не картинка, а то самое, что человек
   увидит, открыв приложение. Отсюда и приятное: страница весит десятки
   килобайт и не требует ни съёмки, ни версий под ретину.
   ========================================================================= */

.vstrecha {
  position: relative;          /* якорь переключателю языка */
  /* Тона — постоянные токены `site.css`, а не свои hex (ночь на 9 октября
     2026): своими копиями здесь застряли прежние серый, эгейский и
     киноварь тёмной темы, когда приложение их сменило. */
  --paper:      var(--levkas);
  --paper-deep: var(--levkas-deep);
  --ink:        var(--chernila);
  --ink-soft:   var(--soft-den);
  --rubric:     var(--rubric-den);
  --hairline:   var(--hairline-den);
  --aegean:     var(--aegean-den);
  /* Кегли героя и пластин — только этой страницы: в приложении такого
     размера нет и быть не должно. */
  --v-geroy:     clamp(38px, 9vw, 68px);
  --v-geroy-lh:  1.08;
  --v-plita:     clamp(30px, 6vw, 44px);
  --v-razvorot:  clamp(17px, 2.1vw, 26px);

  /* Полосы идут во всю ширину, поэтому боковые поля даёт не тело, а
     каждая полоса сама: иначе чёрное не дошло бы до края экрана. */
  padding: 0;
  background: var(--paper);
  color: var(--ink);
}

/* Мера страницы. Шире 44 знаков связная речь не читается, а полоса при
   этом может быть во всю ширину экрана — это разные величины, и путать
   их нельзя. */
.vstrecha .sloy__in,
.vstrecha .razvorot__in { max-width: 46rem; margin: 0 auto; }
/* ПОЛОСА В ДВА СТОЛБЦА МЕРЯЕТСЯ РАЗВОРОТОМ, А СТОЛБЕЦ — ВСЁ ТОЙ ЖЕ МЕРОЙ
   СТРОКИ. Ширина разворота не взята круглым числом, а посчитана: две меры
   и промежуток между ними. Возьми её на глаз побольше — и строка осталась
   бы прежней, а справа от каждого столбца встало бы пустое поле шириною в
   треть его самого; глаз читает такое поле как неоконченную колонку. */
.vstrecha .sloy__in--shire { max-width: calc(88ch + clamp(32px, 5vw, 72px)); }
.vstrecha .razvorot--vekran .razvorot__in { max-width: 76rem; }

/* ── Полоса ростом в экран ────────────────────────────────────────────
   РИТМ ДЕРЖИТСЯ НЕ ПОРЯДКОМ, А РОСТОМ. Порядок полос — чёрная, бумажная,
   чёрная — был верен и прежде, но «Что внутри» занимало три экрана
   подряд, и рядом с ним чёрные полосы читались перебивками внутри одной
   бумажной главы, а не половиной чередования. Полоса, которой отдан один
   предмет, встаёт ровно в экран и содержимым не меряется.

   `svh`, А НЕ `vh`: на телефоне адресная строка то есть, то её нет, и
   `vh` считается по большей высоте — низ полосы уезжал бы под браузер.

   ЖЁСТКОЙ ВЫСОТЫ ЗДЕСЬ НЕТ НИГДЕ. Это `min-height`: на крупном системном
   шрифте текст перерастает экран и полоса растёт вместе с ним. Обрезать
   его ради ритма значило бы променять читателя на вид, а половина тех,
   ради кого это писано, читает крупным кеглем.                         */
.sloy--vekran,
.razvorot--vekran {
  min-height: 100svh;
  display: flex; flex-direction: column; justify-content: center;
}
.plita--vekran { min-height: 100svh; align-content: center; }
.hero { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; }

/* ── Два столбца ──────────────────────────────────────────────────────
   На телефоне столбец один: в 390 точек второго не поставить, и приём,
   который там не работает, в проект не идёт. Два столбца начинаются с той
   ширины, на которой каждому из них достаётся полная мера строки, — и ни
   точкой раньше: столбец у́же меры читается хуже, чем одна колонка.    */
.stolbtsy { margin-top: clamp(18px, 3vh, 30px); }
/* ОТБИВКИ СВЕРХУ У ЭТИХ СТОЛБЦОВ НЕТ: она отделяла их от заглавия полосы, а
   заглавие «О программе» стои́т теперь внутри, в правом столбце. Отступ
   остался бы пустым полем над всем разворотом — и тридцатью точками
   выталкивал бы кнопки за нижний край экрана. */
.stolbtsy--kto { margin-top: 0; }
@media (min-width: 60rem) {
  .stolbtsy {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 72px);
    align-items: start;
  }
  /* Первый абзац слева, второй справа — и оба одного кегля: это не вводка
     с продолжением, а две половины одного (владелец, 11 сентября 2026). */
  .stolbtsy > p { margin-top: 0; }
  /* ПОЛОСА «О ПРОГРАММЕ»: ОПИСЬ СЛЕВА ВО ВСЮ ВЫСОТУ, СПРАВА СЛОВО И ПОД
     НИМ ПОДПИСИ. Блоков три, и расставлены они поимённо, а не порядком в
     разметке: в разметке порядок телефонный — заглавие, опись, подписи, —
     и его менять нельзя, там читают сверху вниз.

     Правый столбец шире левого: в нём связная речь, которой нужна полная
     мера строки, а опись набрана короткими строками в две доли.

     ПРОМЕЖУТКА МЕЖДУ РЯДАМИ НЕТ НАРОЧНО: между словом и «Кто это сделал»
     стои́т отбивка заглавия, писанная на всё издание, и промежуток сетки
     прибавился бы к ней вторым, вдвое большим. */
  .stolbtsy--kto {
    grid-template-columns: 1fr 1.15fr;
    row-gap: 0;
    align-items: stretch;
  }
  .stolbtsy--kto .stolbtsy__slovo  { grid-column: 2; grid-row: 1; }
  .stolbtsy--kto .stolbtsy__rech   { grid-column: 1; grid-row: 1 / span 2; }
  .stolbtsy--kto .stolbtsy__spisok { grid-column: 2; grid-row: 2; }
  .stolbtsy--kto .stolbtsy__slovo > :first-child,
  .stolbtsy--kto .stolbtsy__rech > :first-child { margin-top: 0; }
  /* ОКНО ОПИСИ ТЯНЕТСЯ ВО ВЕСЬ СТОЛБЕЦ, А НЕ МЕРЯЕТСЯ ДОЛЕЙ ЭКРАНА. Слева
     одна опись, справа заглавие, слово, две подписи и четыре строки: при
     окне ростом в четверть экрана левый столбец кончался на трети полосы,
     а под ним оставалось пустое поле в две трети. Доля экрана этого не
     решает — правый столбец растёт от кегля, от языка и от ширины, а доля
     считается по высоте окна браузера, — и потому окно просто равняется по
     соседу: столбцы тянутся вровень, а опись занимает всё, что осталось
     под своим заглавием.

     ПОТОЛОК ЕСТЬ, И ОН НЕ ВКУСОВОЙ: окно выше ряда открыло бы за верхним
     краем стык ленты. Ряд из двенадцати изданий высок около девятисот
     точек, и семьсот — с запасом под ним. */
  .stolbtsy--kto .stolbtsy__rech { display: flex; flex-direction: column; }
  .stolbtsy--kto .opis {
    /* ДОЛЯ НУЛЕВАЯ, А НЕ «ПО СОДЕРЖИМОМУ»: ростом своей ленты окно мерять
       нельзя — оно само определяет высоту столбца, и столбец вырос бы во
       всю ленту, потянув за собою полосу. С нулевой долей окно в счёт
       высоты не идёт вовсе и получает ровно то, что осталось. */
    flex: 1 1 0; height: auto; min-height: 240px; max-height: 700px;
  }

  /* ЛЕСТНИЦА ЗАГЛАВИЙ РАСПУЩЕНА НАЗАД. Полдня она стояла здесь на нижней
     своей ступени — сорок точек и тридцать, — потому что полоса несла на
     себе ещё и две кнопки и на невысоком ноутбуке за экран не помещалась.
     Кнопки ушли на свой экран, и жать лестницу стало не за чем: заглавия
     набраны общим правилом издания, как всюду. Возврат правил — в истории
     этого файла. */
}

/* ── Три языка на одной странице ──────────────────────────────────────
   Все тексты лежат в разметке, и лишние прячутся. Так страница читается
   и без единой строки кода — поисковой машине, ленте предпросмотра,
   человеку с выключенным JavaScript, — а переключение обходится сменой
   одного признака на корне.

   Прячем, а не показываем: `display: none` снять проще, чем вернуть
   каждому виду элементов его собственное поведение. Абзац, ячейка списка
   и строчный кусок ведут себя по-разному, и «показать» пришлось бы
   писать для каждого.

   Признак стоит на корне, а не на теле: скрипт в голове страницы ставит
   его прежде, чем появится тело, и русский текст не мелькнёт греку. Он же
   сводит там неизвестное значение к русскому — иначе все три текста
   встали бы на странице подряд.                                        */
:root[data-ya="ru"] [lang="el"], :root[data-ya="ru"] [lang="uk"] { display: none; }
:root[data-ya="uk"] [lang="ru"], :root[data-ya="uk"] [lang="el"] { display: none; }
:root[data-ya="el"] [lang="ru"], :root[data-ya="el"] [lang="uk"] { display: none; }
/* Греческий набор — своим шрифтом всюду, а не только в богослужебных
   строках: ни у Prata, ни у нашего подмножества тела греческих букв нет.
   Украинскому этого не нужно: кириллица у Prata своя. */
:root[data-ya="el"] .hero__title,
:root[data-ya="el"] .sloy__head,
/* Подраздел набирается теперь Prata, а греческих букв у неё нет вовсе —
   без этой строки «Ποιος το έφτιαξε» свалилось бы в системный шрифт. */
:root[data-ya="el"] .section-sub { font-family: var(--greek); }

/* Переключатель языка. Стоит над героем, у правого края — там же, где в
   приложении стоят три полоски: рука уже знает это место. Тише всего, что
   есть на странице: язык выбирают один раз. */
.ya {
  position: absolute; top: 0; right: 0; z-index: 5;
  display: flex; align-items: baseline; gap: 0;
  padding: 14px var(--pad);
}
.ya button {
  background: none; border: 0; cursor: pointer; padding: 6px 2px;
  font-family: var(--doc); font-size: var(--doc-folio);
  letter-spacing: var(--doc-folio-ls);
  color: var(--soft-noch);
}
/* Срединная точка между метками — та же, что в меню приложения: она
   стоит в самом промежутке, а не вместо него, и расстояний не меняет. */
/* Сам переключатель прятать нельзя: метка «ΕΛ» набрана греческим и
   попала бы под общее правило — грек, увидевший русскую страницу, не
   нашёл бы, чем её переключить. Одинаковая сила с правилом сокрытия и
   место ниже по файлу: побеждает это. */
:root .ya button[lang] { display: inline-block; }
/* Метка УКР стояла здесь скрытой, пока перевода не было; правило снято
   веткой `u11` 26 сентября 2026 — метки все три и видны все три. */
.ya button + button::before { content: '·'; margin: 0 .5em; }
/* Греческая метка своим шрифтом: у PT Mono греческих знаков нет. */
:root .ya button[lang="el"] { font-family: var(--greek); letter-spacing: .1em; }
.ya button[aria-current="true"] { color: var(--levkas); }

/* ── Герой ────────────────────────────────────────────────────────────
   Чёрное поле во весь первый экран. Знак стоит в тот же рост, в каком на
   основном сайте стоит фотография: меньше — и это уже не герой, а логотип
   в углу.                                                              */

.hero {
  padding: clamp(48px, 9vh, 96px) var(--pad) clamp(40px, 7vh, 72px);
  text-align: center;
  background: var(--noch);
  color: var(--levkas);
}
/* Полоса во всю ширину, содержимое по мере: это две разные величины, и
   держатся они на разных предметах. */
.hero > * { max-width: 44rem; margin-left: auto; margin-right: auto; }

.hero__mark svg {
  display: block; margin: 0 auto;
  width: clamp(140px, 34vw, 210px); height: auto;
}
.hero__title {
  font-family: var(--display);
  font-size: var(--v-geroy);
  line-height: var(--v-geroy-lh);
  margin: clamp(22px, 4vh, 38px) auto 0;
  color: var(--levkas);
}
.hero__lead {
  margin-top: clamp(16px, 2.6vh, 26px);
  font-size: var(--t-lead);
  line-height: var(--r4-lh);
  color: var(--switch-noch);
  max-width: 32rem;
}
/* ПУСТАЯ ПРИПИСКА НЕ ЗАНИМАЕТ МЕСТА. Слов под кнопками больше нет, а узел
   остался: в него пишет скрипт. Без этой строки под кнопками висела бы
   отбивка в восемнадцать точек неизвестно за чем. */
.hero__note:empty { display: none; }
.hero__note {
  margin-top: 18px;
  font-family: var(--doc); font-size: var(--doc-caption);
  letter-spacing: var(--doc-caption-ls);
  color: var(--soft-noch);
  max-width: 30rem;
}

/* ДВЕ КНОПКИ ОДНОЙ ВЕЛИЧИНЫ. В демо они вышли разной ширины, и это читалось
   так, будто одна из них важнее, — а пути здесь два равных. Ширина задана
   общей и не считается по длине слов: `flex: 1 1 0` делит место поровну, а
   `min-width` не даёт им сойтись в столбик раньше времени.

   Ноль скруглений, ноль теней, ноль заливок — правило системы. Главная
   отличается от второй не формой, а тем, что залита: это единственное
   место во всём издании, где заливка вообще есть, и стоит она ровно на
   одном предмете. */
.hero__acts {
  display: flex; flex-wrap: wrap; gap: 12px;
  margin-top: clamp(26px, 4vh, 40px);
  max-width: 34rem;
}
.knopka {
  flex: 1 1 0; min-width: 15rem;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 15px 20px;
  font-family: var(--speech); font-size: var(--t-body); line-height: var(--r3-lh);
  text-align: center; text-decoration: none; cursor: pointer;
  color: var(--levkas); background: none;
  border: 1px solid var(--soft-noch);
}
.knopka--main {
  color: var(--noch); background: var(--levkas); border-color: var(--levkas);
}
.knopka[hidden] { display: none; }

/* КНОПОК НА БУМАГЕ БОЛЬШЕ НЕТ, И ПРАВИЛ ИМ НЕ НУЖНО. Полдня они стояли
   внизу полосы «О программе», перевёрнутые по цвету — тёмная заливка по
   бумаге; вечером того же дня владелец дал им свой экран, чёрный близнец
   героя, и там они снова писаны по чёрному общим правилом. Возврат —
   `.sloy--paper .knopka`, `.sloy--paper .knopka--main` и
   `.hero__acts--sredi` — в истории этого файла, в коммитах 11 сентября
   2026. */


/* ── Полоса на бумаге ─────────────────────────────────────────────────── */

.sloy--paper { background: var(--paper); }
.sloy { padding: clamp(48px, 9vh, 96px) var(--pad); }
/* ПОЛЯ ИТОГОВОЙ ПОЛОСЫ У́ЖЕ, ЧЕМ У ПРОЧИХ, И ВИДНО ЭТОГО НЕ БУДЕТ. Полоса
   ростом в экран держит содержимое посередине, и поля её видны только
   тогда, когда содержимое переросло экран, — а переросло оно ровно здесь:
   два столбца да пара кнопок под ними дают на ноутбуке в 860 точек
   девятьсот. Убавленное поле возвращает полосу в экран, ничего не меняя на
   всех прочих высотах. Сжимать ради этого набор было нельзя: половина тех,
   ради кого это писано, читает крупным кеглем.

   ПОЛЕ ОСТАЁТСЯ УБАВЛЕННЫМ И БЕЗ КНОПОК. Кнопки ушли на свой экран вечером
   того же дня, и восемьдесят три точки вместе с ними; но девятая доля
   высоты вернула бы полосе шестьдесят из них обратно, и на невысоком
   ноутбуке два столбца снова встали бы вплотную к краю. Полоса эта несёт
   разворот — такого не бывает у прочих, — и поле у неё своё. */
.sloy--itog { padding-top: clamp(36px, 5vh, 64px); padding-bottom: clamp(36px, 5vh, 64px); }
.sloy__head {
  font-family: var(--display);
  font-size: var(--h-screen); line-height: var(--r1-lh);
  margin: 10px 0 0;
  color: var(--rubric);
}
.sloy p { max-width: 44ch; margin-top: 18px; line-height: var(--r4-lh); }
.sloy__lead { font-size: var(--t-lead); }

/* Что внутри — список способностей. Имя способности документным слоем и
   капителью, как всякое служебное слово в приложении; объяснение под ним
   обычным набором. Волосяных между пунктами нет: правило на всё издание —
   иерархию держат воздух, кегль и цвет, а линейка ставится один раз на
   экран. */
.chto { margin-top: clamp(22px, 3.5vh, 34px); }
/* ОПИСЬ В ДВА СТОЛБЦА — КОЛОНКАМИ, А НЕ СЕТКОЙ. Сетка развела бы имя
   способности и объяснение по разным столбцам: в разметке это два
   соседних узла, `dt` и `dd`, и ячейки они получили бы разные. Колонки же
   льют список сверху вниз и переносят остаток вправо — тем самым порядком,
   каким его и читают.

   Запреты разрыва здесь не украшение: без них имя способности остаётся
   внизу одного столбца, а объяснение уезжает наверх другого. */
@media (min-width: 60rem) {
  .chto { columns: 2; column-gap: clamp(32px, 5vw, 72px); }
  .chto dt { break-after: avoid; }
  .chto dd { break-inside: avoid; }
  /* Первому имени в столбце отбивка сверху не нужна: он и так стоит
     первым. Иначе второй столбец начинался бы ниже первого. */
  .chto dd + dt { break-before: auto; }
}
.chto dt {
  font-family: var(--doc); font-size: var(--doc-folio);
  letter-spacing: var(--doc-folio-ls); text-transform: uppercase;
  color: var(--rubric);
}
.chto dd {
  margin: 7px 0 0; max-width: 44ch; line-height: var(--r4-lh);
}
.chto dd + dt { margin-top: clamp(20px, 3vh, 30px); }

/* ── Пластина куполов ─────────────────────────────────────────────────
   Смысл приложения в одном развороте: два знака, два числа одного
   праздника, ни слова объяснения. На узком экране половины встают друг
   под друга и разделяются волосяной — но не той, что делит колонки, а
   поперечной: иначе черта осталась бы висеть вдоль пустого места.     */

.plita {
  display: grid; grid-template-columns: 1fr;
  background: var(--noch); color: var(--levkas);
  padding: clamp(40px, 7vh, 72px) var(--pad);
  gap: clamp(32px, 6vh, 56px);
}
.plita__side { text-align: center; }
.plita__side + .plita__side {
  border-top: 1px solid var(--hairline-noch);
  padding-top: clamp(32px, 6vh, 56px);
}
@media (min-width: 34rem) {
  .plita { grid-template-columns: 1fr 1fr; gap: 0; }
  .plita__side + .plita__side {
    border-top: 0; padding-top: 0;
    border-left: 1px solid var(--hairline-noch);
  }
}
/* РОСТ ЗНАКА. Прежде 74 точки — столько, сколько оставалось от полосы,
   поделённой с текстом. Полоса теперь своя, и мельчить незачем: на
   телефоне знак вдвое крупнее прежнего, на развороте — втрое. */
.plita__dome svg {
  display: block; margin: 0 auto;
  width: clamp(104px, 13vw, 168px); height: auto;
}
.plita__what {
  margin-top: 20px; padding: 0 12px;
  font-family: var(--display); font-size: var(--t-lead); line-height: var(--r6-lh);
}
.plita__when {
  margin-top: 10px;
  font-family: var(--display); font-size: var(--v-plita);
  color: var(--rubric-noch);                        /* киноварь тёмной темы */
}
.plita__who { margin-top: 8px; color: var(--soft-noch); }

/* ── Разворот Евангелия ───────────────────────────────────────────────
   Показанное, а не пересказанное. Строй тот же, что на экране чтения с
   10 сентября 2026: стихи идут парами, оба ряда одного кегля, и
   различает их не рост, а цвет.

   КЕГЛЬ ОДИН НА ОБА ЯЗЫКА. Греческий и прежде стоял вдвое крупнее
   русского — это была ступень старого экрана чтения, где второй ряд был
   подстрочником. Подстрочника больше нет: ряды ровня, и набраны они
   ровно.                                                              */

.razvorot {
  background: var(--noch); color: var(--levkas);
  padding: clamp(48px, 9vh, 96px) var(--pad);
}
.razvorot__stihi { margin-top: clamp(12px, 2.2vh, 24px); }
.razvorot__stih + .razvorot__stih { margin-top: clamp(12px, 2vh, 22px); }
/* Номер — киноварью и служебным письмом, как в приложении. Цвет взят
   тёмной темы прямо: полоса черна при любой теме страницы. */
.razvorot__n {
  font-family: var(--doc); font-size: var(--doc-service);
  letter-spacing: var(--doc-service-ls);
  color: var(--rubric-noch);
}
.razvorot__gr,
.razvorot__ru {
  margin-top: 6px;
  font-size: var(--v-razvorot); line-height: var(--r4-lh);
}
.razvorot__gr { font-family: var(--greek); }
/* Перевод — эгейским тёмной темы (`--perevod` в темноте). Это не ранг
   цветом: кегль у рядов один, серого нет, и цвет говорит «другой язык». */
.razvorot__ru { color: var(--aegean-noch); }

/* ДВА СТОЛБА, КАК КНИГА В РУКАХ. На телефоне греческий стои́т над русским —
   так же, как на экране чтения, и по той же причине: ширины нет. На
   развороте они встают рядом, греческий слева, а номер стои́т над парой во
   всю её ширину — ровно так же делает экран чтения в столбцах. */
@media (min-width: 60rem) {
  .razvorot__stih {
    display: grid; grid-template-columns: 1fr 1fr;
    column-gap: clamp(32px, 5vw, 72px); align-items: start;
  }
  .razvorot__n { grid-column: 1 / -1; }
}
.razvorot .folio { color: var(--soft-noch); }

/* ── Опись изданий: окно стоит, книги идут ────────────────────────────
   Замысел владельца 11 сентября 2026. Прежде на этом месте стоял абзац о
   том, что в приложение берётся только общественное достояние; теперь то
   же самое сказано показом — именами книг и годами изданий. Довод
   владельца: «эти издания прошлого века обращают на себя внимание датой и
   показывают объём проведённой работы».

   ЛЕНТА ЕДЕТ РОВНО НА ПОЛОВИНУ СВОЕЙ ВЫСОТЫ, и оттого промежуток висит на
   КАЖДОЙ строке снизу, включая последнюю: ряд тогда высок ровно настолько,
   насколько лента должна проехать, и второй ряд встаёт на место первого
   без стыка. Поставь промежуток МЕЖДУ строками — и половина ленты
   перестанет совпадать с высотою ряда, а лента дёрнется раз в минуту.

   СКОРОСТЬ ПОСЧИТАНА, А НЕ ВЗЯТА НА ГЛАЗ: двенадцать точек в секунду, и
   строка стоит на глазах секунд пятнадцать. Года ради того и поставлены,
   чтобы их успели прочесть. Ряд из двенадцати изданий высок около
   девятисот точек — отсюда и семьдесят пять секунд на оборот; заведёте
   тринадцатое издание — прибавьте времени, иначе опись побежит.

   ДВИЖЕНИЕ — ЕДИНСТВЕННОЕ НА СТРАНИЦЕ и допущено владельцем нарочно.
   Правила «ноль пиктограмм, ноль теней» оно не отменяет: ни того, ни
   другого здесь нет.                                                   */
.opis {
  margin-top: 12px;
  height: clamp(160px, 26vh, 220px);
  overflow: hidden;
}
.opis__lenta { animation: opis-hod 75s linear infinite; }
.opis__ryad { list-style: none; margin: 0; padding: 0; }
/* ПРОМЕЖУТОК — ПОДКЛАДКОЙ, А НЕ ОТБИВКОЙ, и это не вкусовщина. Нижняя
   отбивка последней строки схлопывается наружу из своего ряда: ряд
   становится на неё короче, а лента — длиннее ровно на один промежуток,
   и половина ленты перестаёт равняться ряду. Лента дёргалась бы на семь
   точек раз в минуту. Подкладка не схлопывается ни с чем. */
.opis__ryad li { margin: 0; padding-bottom: 14px; }
.opis__chto { display: block; font-size: var(--t-body); line-height: var(--r6-lh); }
.opis__gde { display: block; margin-top: 2px; }
@keyframes opis-hod {
  from { transform: translateY(0); }
  to   { transform: translateY(-50%); }
}
/* ВЫКЛЮЧИВШИЙ ДВИЖЕНИЕ ВИДИТ ТУ ЖЕ ОПИСЬ, ТОЛЬКО СТОЯЩУЮ И ЦЕЛИКОМ.
   Человек, погасивший движение в телефоне, чаще всего сделал это не из
   вкуса: от бегущего ему делается худо. Оттого окно распускается по
   содержимому, лента замирает, а второй ряд — копия — уходит совсем. */
@media (prefers-reduced-motion: reduce) {
  .opis { height: auto; overflow: visible; }
  /* На развороте окно тянется во весь столбец и упирается в потолок; здесь
     ни того, ни другого быть не должно — опись стои́т целиком. */
  .stolbtsy--kto .opis { flex: none; max-height: none; min-height: 0; }
  .opis__lenta { animation: none; }
  .opis__ryad[aria-hidden="true"] { display: none; }
}

/* ── Кто это сделал ───────────────────────────────────────────────────── */

/* ОТБИВКИ ЗАГЛАВИЙ ЗДЕСЬ СВОИХ НЕТ — и в этом дело. Прежде страница
   ставила подраздел на clamp(30px, 5vh, 48px) сверху и прижимала список
   шестью точками снизу, отчего до заглавия выходило столько же, сколько
   между строками списка, и лестница рушилась. Теперь обе величины даёт
   общее правило издания из `site.css`: перед заглавием не меньше двух
   промежутков между пунктами, после — не больше половины. */
.kto a { color: var(--aegean); }

/* ── Коды здесь больше нет ────────────────────────────────────────────
   ЦЕЛЫЙ ЭКРАН РАДИ ДВУХ КНОПОК — «слишком драматично» (владелец,
   11 сентября 2026). Кода была чёрной полосой ростом в экран: чередование
   бумаги и чёрного кончалось чёрным в полную силу, а узкая чёрная лента
   внизу читалась бы подвалом сайта. Довод верен, но кончилось тем, что
   страница просила шестой прокрутки ради двух кнопок, уже виденных в
   начале. Кнопки стоят теперь внизу полосы «О программе», на бумаге, и
   страница кончается вместе с нею.

   ЦЕНА ЭТОГО НАЗВАНА ПРЯМО: страница кончается бумагой, а не чёрным.
   Чередование от этого не рушится — чёрные полосы стоят по-прежнему
   второй и четвёртой, — но последнего удара у него больше нет.

   ВОЗВРАТ: правила `.koda` и `.koda__slovo` лежат в истории этого файла,
   а сама `<footer class="koda">` — в истории `public/index.html`, в
   коммите до 11 сентября 2026.                                        */
