/* ═══ Кошелёк: сети списком, ввод суммы встроенной клавиатурой, компактное пополнение ═══════════════════════════════════
   Подключается последним: всё помещается в высоту шторки без прокрутки, сети — компактным списком в одном блоке. */

/* сети списком: один скруглённый блок, строки разделены линиями */
.nw-rows { display: grid; border-radius: 22px; background: var(--sp-panel2); overflow: clip; }
.nw-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; column-gap: 12px; width: 100%; min-width: 0; padding: 11px 12px 11px 12px; text-align: left; color: var(--sp-star); position: relative;
  box-shadow: inset 3px 0 0 transparent; animation: sp-rise 320ms var(--sp-ease) both; transition: background var(--sp-t), box-shadow var(--sp-t); }
.nw-row + .nw-row::before { content: ""; position: absolute; top: 0; left: 66px; right: 14px; height: 1px; background: var(--sp-line2); }
.nw-row:nth-child(2) { animation-delay: 25ms; } .nw-row:nth-child(3) { animation-delay: 50ms; } .nw-row:nth-child(4) { animation-delay: 75ms; } .nw-row:nth-child(n+5) { animation-delay: 100ms; }
.nw-row:active { background: var(--sp-ion-soft); }
.nw-row.on { background: var(--sp-ion-soft); box-shadow: inset 3px 0 0 var(--sp-ion); }
.nw-row-main { min-width: 0; } .nw-row-main b { display: block; font: 600 15.5px/1.15 var(--sp-display); letter-spacing: -0.01em; }
.nw-row-main small { display: block; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--sp-dust); }
.nw-row-meta { display: grid; justify-items: end; gap: 3px; white-space: nowrap; }
.nw-row-meta em { padding: 3px 8px; border-radius: 999px; font: 600 11.5px/1.2 var(--sp-body); font-style: normal; color: var(--sp-star); background: var(--sp-line2); }
.nw-row-meta em.free { color: var(--sp-aurora); background: var(--sp-aurora-soft); }
.nw-row-meta i { font-style: normal; font-size: 11.5px; color: var(--sp-dust); }
.nw-row-go { display: grid; place-items: center; color: var(--sp-dust); } .nw-row.on .nw-row-go { color: var(--sp-ion); }
@media (max-width: 340px) { .nw-row { column-gap: 9px; padding-inline: 10px; } .nw-row + .nw-row::before { left: 59px; } .nw-row-go { display: none; } }
@media (prefers-reduced-motion: reduce) { .nw-row { animation: none; } }

/* выбранная сеть в шапке экрана */
.nw-pill { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 12px 8px 10px; border-radius: 18px; background: var(--sp-panel2); text-align: left; color: var(--sp-star); }
.nw-pill:disabled { opacity: 1; }
.nw-pill b { display: block; font: 600 14.5px/1.2 var(--sp-body); } .nw-pill small { display: block; margin-top: 1px; font-size: 12px; color: var(--sp-dust); }
.nw-pill-ch { display: inline-flex; align-items: center; gap: 2px; font: 600 12.5px/1 var(--sp-body); color: var(--sp-ion); }

/* экран ввода суммы: всё в высоту шторки */
.pad-screen { gap: 10px; }
.pad-screen .sp-pad-top { gap: 6px; padding: 0; min-height: 0; grid-auto-rows: max-content; }   /* без этого при низкой шторке строки с min-height:0 схлопываются и сумма наезжает на подпись и подсказку */
.pad-screen .sp-pad-amt { min-height: 0; }
.pad-screen .sp-pad-amt b { font-size: clamp(36px, 11vw, 48px); }
.pad-screen .sp-pad-hint { min-height: 18px; font-size: 13px; }
.pad-screen .sp-pad { gap: 6px; }
.pad-screen .sp-pad-k { min-height: clamp(44px, 6.4vh, 56px); }
.pad-screen .sp-pad-quick { gap: 6px; margin-top: 2px; }
.pad-info { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.pad-info span { display: grid; gap: 2px; min-width: 0; padding: 8px 10px; border-radius: 14px; background: var(--sp-panel2); font: 500 11px/1.2 var(--sp-body); color: var(--sp-dust); text-align: left; }
.pad-info b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 13px; color: var(--sp-star); } .pad-info b.sp-pos { color: var(--sp-aurora); }
@media (max-height: 700px) { .pad-screen { gap: 6px; } .pad-screen .sp-pad-amt b { font-size: 34px; } .pad-screen .sp-pad-k { min-height: 42px; font-size: 21px; } .pad-info span { padding: 6px 9px; } }

/* пополнение BEP-20: QR и данные на одном экране */
.tp-card { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px; border-radius: 24px; background: var(--sp-panel2); }
.tp-qr { min-width: 0; padding: 8px; border-radius: 16px; background: #fff; }
.tp-qr .wl-qr { display: block; width: 100%; height: auto; max-width: 176px; margin: 0 auto; border-radius: 10px; }
.tp-side { display: grid; gap: 12px; min-width: 0; }
.tp-net { display: flex; align-items: center; gap: 10px; } .tp-net b { display: block; font: 600 14.5px/1.2 var(--sp-body); } .tp-net small { display: block; margin-top: 1px; font-size: 12px; color: var(--sp-dust); }
.tp-facts { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; font: 500 12.5px/1.2 var(--sp-body); color: var(--sp-star); }
.tp-facts li { display: flex; align-items: center; gap: 7px; } .tp-facts svg { flex: none; color: var(--sp-aurora); }
.tp-card .wf-live { justify-self: start; padding: 6px 11px; font-size: 12px; }
.tp-addr { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border-radius: 16px; background: var(--sp-panel2); text-align: left; color: var(--sp-star); transition: background var(--sp-t); }
.tp-addr code { flex: 1; min-width: 0; overflow-wrap: anywhere; word-break: break-all; font-size: 12.5px; line-height: 1.4; font-weight: 500; } .tp-addr svg { flex: none; color: var(--sp-dust); } .tp-addr:active { background: var(--sp-line2); }
.tp-warn { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 14px; background: var(--sp-nova-soft, rgba(245, 158, 11, 0.12)); color: var(--sp-nova, #b7791f); font: 500 12.5px/1.4 var(--sp-body); }
.tp-warn svg { flex: none; margin-top: 1px; }
@media (max-width: 360px) { .tp-card { grid-template-columns: 1fr; } .tp-qr .wl-qr { max-width: 150px; } }

/* адрес обменника: QR компактнее, чтобы вся сделка помещалась на экран */
.nw-step .wl-qr-box { padding: 10px; border-radius: 20px; }
.nw-step .wl-qr { width: min(46vw, 168px); height: auto; }

/* карточки выбора режима/адреса: значок не растягивается наравне с текстом */
.wl-opt > .wl-opt-ico { flex: none; }
.wl-opt small { margin-top: 2px; line-height: 1.35; }

/* Шторки с цифровой клавиатурой на низких экранах (320×568 и клавиатура Telegram): клавиши и сумма компактнее, чтобы кнопка действия не наезжала на цифры. */
@media (max-height: 640px) {
  .sp-sheet:not(:has(.pad-screen)) .sp-pad-k { min-height: 40px; font-size: 20px; }
  .sp-sheet .sp-pad { gap: 6px; }
  .sp-sheet .sp-pad-amt b { font-size: 32px; }
}
/* ПК: сумма вводится обычным полем, большой дисплей над ним дублировал бы значение. */
@media (min-width: 960px) {
  .sp-pad-amt:has(~ .sp-pad-desktop-input), .sp-pad-amt:has(+ .sp-pad-hint ~ .sp-pad-desktop-input), .sp-nf-price-touch > .sp-pad-amt, .sp-bal-pad > .sp-pad-amt { display: none; }
}

/* Ошибка/подтверждение и кнопка действия — одним закреплённым блоком внизу шторки: на коротком экране сообщение не прячется под кнопкой. */
.sp-sheet-foot { position: sticky; bottom: 0; z-index: 3; display: grid; gap: 8px; padding: 8px 0 calc(2px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(transparent, var(--sp-panel) 14px); }
html[data-theme="dark"] .sp-sheet-foot { background: linear-gradient(transparent, var(--sp-modal, var(--sp-panel)) 14px); }
.sp-sheet-foot .sp-note { padding: 9px 12px; font-size: 13.5px; }

/* Клавиатура суммы на телефоне занимает свободную высоту: клавиши растут вместо пустоты над ними. */
@media (max-width: 959px) {
  .sp-pad-sheet > .sp-pad-top { flex: 1 0 auto; grid-auto-rows: max-content; }   /* верх (подпись, сумма, подсказка) не сжимается: иначе строки наезжают друг на друга */
  .sp-pad-sheet > .sp-pad { flex: 0 1 auto; grid-auto-rows: minmax(0, 1fr); height: clamp(232px, 44vh, 400px); min-height: 168px; }   /* клавиатура сжимается первой — кнопка действия остаётся на экране */
  .sp-pad-sheet > .sp-pad .sp-pad-k { min-height: 0; height: 100%; font-size: clamp(22px, 3.2vh, 30px); border-radius: 20px; }
  .sp-pad-sheet > .sp-btn.primary.wide { flex: none; min-height: 54px; font-size: 16px; }
}
@media (max-width: 959px) and (max-height: 640px) { .sp-pad-sheet > .sp-pad { height: clamp(168px, 40vh, 280px); } }