/* ════════════════════════════════════════════════════════════
   ЗАГЛУШКА — страница, которой ещё нет

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

   Название стоит В ЦЕНТРЕ ЭКРАНА, а не в верхней полосе, как на витрине.
   Это не мелочь и не забывчивость: в верхней полосе название читалось бы
   шапкой готовой страницы, у которой почему-то пропало содержимое.
   По центру пустоты оно читается тем, чем является, — обещанием.

   Один файл на три страницы: About, CV и 404. Shorts отсюда ушла — она
   отцепила этот файл и подключила своё, как и задумано ниже. Разница между
   оставшимися — <title> и одна строка текста; три копии этих же правил были бы ровно тем
   дублированием, ради ухода от которого заводили case.css.

   КАК УБРАТЬ: страница перестаёт быть заглушкой, когда получает своё
   содержимое. Тогда она отцепляет stub.css и подключает то, что ей нужно.
   Когда заглушек не останется — удалить файл.
   ════════════════════════════════════════════════════════════ */

/* Экран без прокрутки: прокручивать нечего. svh, а не vh, — на телефоне
   vh считается по экрану БЕЗ адресной строки, и низ уезжает под неё. */
body {
  min-height: 100svh;
  margin: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}

/* Аватар выведен из потока и прижат к углу — тогда он не участвует
   в центровке названия и стоит там же, где на остальных страницах.
   Позиция задаётся здесь, а не в системе: система описывает, как аватар
   выглядит, а куда его поставить — дело страницы. */
.ava {
  position: fixed;
  top: var(--edge);
  left: var(--edge);
  z-index: 10;
}

/* Название. Кегль --fs-name — тот же, которым на главной набрано имя:
   на пустом экране это единственная строка, и мельче ей быть незачем.

   Трекинг и вес — из той же пары, что у .name в системе, но повторены
   здесь, а не взяты классом: .name на главной идёт в связке с ролью
   и переносами, и тащить сюда её поведение ради двух свойств значило бы
   связать две страницы, которым нечего делить. */
.stub-title {
  margin: 0;
  padding: 0 var(--edge);
  font-size: var(--fs-name);
  font-weight: 300;
  letter-spacing: -0.03em;
  line-height: 1.1;
  text-align: center;
}

/* Подпись под названием — одна строка о том, что страница появится.
   Полупрозрачная и мельче: она поясняет, а не спорит с названием
   за внимание. */
.stub-note {
  margin: .6em 0 0;
  font-size: var(--fs-role);
  font-weight: 200;
  text-align: center;
  opacity: .55;
}