/* Экран «Установка» (ТЗ §7, экран 8). Карточки — родные <details>: тот же
   приём, что и у выпадающих фильтров каталога (см. docs/READER_HOWTO.md §3),
   только со своей маркерной стрелкой — здесь это раскрывающийся текст,
   а не кнопка-переключатель. */

#install-android, #install-ios { cursor: default; }
#install-android summary, #install-ios summary {
  cursor: pointer;
  list-style-position: outside;
}
#install-android summary h2, #install-ios summary h2 {
  display: inline;
}
#install-android[open] summary, #install-ios[open] summary {
  margin-bottom: var(--space-3);
}

.install-steps {
  margin: var(--space-3) 0;
  padding-left: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.install-steps li { padding-left: var(--space-1); }
.install-steps p { margin: 0; }
.install-steps p + .hint { margin-top: var(--space-1); }

.install-steps-icon { position: relative; }
.install-steps-icon .step-icon {
  float: right;
  color: var(--accent);
  margin-left: var(--space-2);
}

/* .btn задаёт display:inline-flex и тем самым перебивает стандартное
   display:none у атрибута hidden (тот же приём для .modal-overlay —
   см. base.css). Без этой строки скрытая кнопка «Колдонмону орнотуу»
   всё равно рисовалась бы на экране до срабатывания beforeinstallprompt. */
#install-btn[hidden] { display: none; }
