/* Вход, замок согласий и смена номера (новая витрина, часть 3, задача 6; постановка docs/superpowers/specs/
   2026-10-03-storefront-part3-account-and-login.md, раздел 5) — по эталону docs/design/reference/layout.css
   («Страница только с формой (вход)», `.account--solo` ~221–223): одна колонка 448 по центру под логотипом,
   заголовок с края колонки; шаги — `.steps`, поля — `.field`, кнопки — `.btn` (components.css, памятка — наверху
   account.css). Размеры — только токены, цвета — только роли темы (сторожа те же). */

/* ── Колонка входа: 448 по центру под логотипом, заголовок с края колонки (Р43) ───────────────────────── */
.screen:has(> .account--solo) {
  max-width: calc(var(--space-8) * 7 + var(--gutter) * 2); padding: var(--space-6) var(--gutter) var(--space-7);
  font-family: var(--font-text); font-size: var(--text-md); line-height: var(--leading-text); color: var(--ink);
}
.account--solo { grid-template-columns: minmax(0, 1fr); }
.account--solo .account__nav, .account--solo .account__bar { display: none; }
.account__login { width: 100%; }
.account__login p { margin: 0; }
.account__login .field { width: 100%; }
.account__login .btn--primary { min-width: calc(var(--space-8) * 3); }
/* Длинная надпись («Согласиться и открыть кабинет») на узком телефоне — в две строки, а не вбок за край. */
.account__login .btn { max-width: 100%; white-space: normal; text-align: center; }
.account__login .muted { font-size: var(--text-sm); }

/* ── Код подтверждения и номера для звонка: крупно, их перечитывают с экрана ──────────────────────────── */
.account--solo .code, .phone-change .code {
  justify-self: stretch; margin: 0; color: var(--ink); text-align: center; text-shadow: none;
  font-family: var(--font-title); font-size: var(--text-hero); font-weight: var(--weight-medium);
  line-height: var(--leading-title); letter-spacing: 0.22em; overflow-wrap: anywhere;
}
/* Номер для звонка — одной строкой и ссылкой: на телефоне нажал и звонишь (28.09.2026). */
.account--solo .code.callnumber, .phone-change .code.callnumber {
  font-size: var(--title-lg); letter-spacing: 0.02em; white-space: nowrap; overflow-wrap: normal;
}
.code.callnumber a { color: inherit; text-decoration: none; }
.account--solo canvas.botqr { justify-self: center; margin: 0; }

/* ── Другие способы: строки выбора (вид — `.leave-choice`), Telegram — справкой без нажатия ───────────── */
.login-ways { display: grid; gap: var(--space-3); width: 100%; }
.login-way { width: 100%; }
.login-way.is-note { display: grid; gap: var(--space-1); padding: var(--space-4); border: 1px dashed var(--border); border-radius: var(--radius-lg); }
.login-way.is-note span { color: var(--muted); font-size: var(--text-sm); }

/* ── Замок согласий: строки — галка и пояснение под подписью ──────────────────────────────────────────── */
.consent-rows { display: grid; gap: var(--space-4); width: 100%; }
.consent-rows .check--long { display: flex; width: 100%; }
.consent-rows .check__text { display: grid; gap: var(--space-1); }
.consent-rows .check__text span { color: var(--muted); font-size: var(--text-sm); }
.account__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }

/* ── Смена номера: шаги в строке «Телефон» профиля и отдельной страницей ──────────────────────────────── */
.phone-change__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.phone-change__cancel { color: var(--muted); }
/* Шаг — во всю ширину блока: блок кабинета прижимает детей к левому краю по их содержимому, и поле сжималось. */
.phone-change__step { display: grid; gap: var(--space-3); width: 100%; }
.phone-change__step[hidden] { display: none; }
.phone-change__step .field, .phone-change__step .input { width: 100%; max-width: calc(var(--space-8) * 6); }
.phone-change__step p { margin: 0; }
.account__login-body, .account__login-form { display: grid; gap: var(--space-3); justify-items: start; width: 100%; }
.account__login-body:empty { display: none; }