/* /login и /join — запасной путь к аккаунту без JavaScript.
   Тех же деталей, что и панель модалки: белая карточка 560 с брендовой полосой
   слева, на светлом фоне страницы. Своей строки в макете нет — собрано из его
   же компонентов. */

.account-form { padding-block: var(--space-64); background: var(--color-bg); }
.account-form__inner { display: flex; justify-content: center; }
.account-form__panel {
  position: relative;
  width: min(100%, 560px);
  padding: var(--space-48) 40px;
  background: var(--color-surface);
  border-radius: var(--radius-xl);
  box-shadow: inset 0 0 0 1px var(--color-border), var(--shadow-card);
}
.account-form__panel::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 8px;
  border-radius: var(--radius-xl) 0 0 var(--radius-xl);
  background: var(--color-brand);
}
.account-form__title { margin-top: var(--space-8); }
.account-form__lead {
  margin-top: var(--space-12);
  font-size: var(--fs-body-sm); line-height: 20.49px; color: var(--color-muted);
}
.account-form__foot {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-8);
  margin-top: var(--space-24);
  font-size: var(--fs-sm); color: var(--color-muted);
}

/* Регистрация шире — та же ширина, что у широкой панели модалки. */
.account-form__panel:has(.form-grid) { width: min(100%, 1040px); }

@media (max-width: 767px) {
  .account-form { padding-block: var(--space-32); }
  .account-form__panel { padding: var(--space-24) var(--space-20); }
  .account-form__panel::before { width: 4px; }
}

/* Секция сброса пароля на /login — без скриптов панель сброса не открыть. */
.account-form__reset {
  margin-top: var(--space-32);
  padding-top: var(--space-24);
  border-top: 1px solid var(--color-border);
}
.account-form__reset-title {
  font-family: var(--font-body); font-size: var(--fs-body); font-weight: 700;
  line-height: 22px; color: var(--color-ink);
}
.account-form__reset-lead {
  margin-top: var(--space-8);
  font-size: var(--fs-sm); line-height: 18px; color: var(--color-muted);
}
.account-form__reset-form { display: flex; flex-direction: column; gap: var(--space-16); margin-top: var(--space-16); }