/* Вход по отпечатку: кнопка на странице входа и блок в «Настройки → Доступ».
   Здесь только то, чего нет в style.css: кнопки, строки списка, подсказки и
   метки — его; цвета и отступы — его токены. */

/* ── страница входа ─────────────────────────────────────────────────── */
/* Блок скрыт атрибутом hidden, пока скрипт не убедился, что браузер умеет
   WebAuthn: без скрипта и в старом браузере на странице только вход кодом. */
.pk-login { display: grid; gap: var(--s5); justify-items: center; }
.pk-login .or {
  width: 100%; display: flex; align-items: center; gap: var(--s3);
  color: var(--muted); font-size: 13px;
}
.pk-login .or::before, .pk-login .or::after {
  content: ""; flex: 1; height: 1px; background: var(--line);
}
/* пустая строка состояния не держит за собой отступ */
.pk-login .why:empty { display: none; }

/* ── настройки ──────────────────────────────────────────────────────── */
/* Список не растягивается на всю вкладку: «Удалить» стоит рядом с тем
   устройством, к которому относится, а не у дальнего края экрана. */
#passkeys .rows { max-width: 75ch; }
/* В узкой колонке название и даты переносятся, а не обрезаются: по ним
   владелец отличает одно устройство от другого. */
#passkeys .rows .s { white-space: normal; overflow-wrap: anywhere; }
@media (pointer: coarse) { #passkeys .rows .btn.small { height: 36px; } }
#passkeys .none { padding: var(--s3) 0; max-width: 75ch; }
#passkeys .btn-row .hint { max-width: 60ch; line-height: 1.4; }
#passkeys .btn-row .hint:empty { display: none; }