/* ===== Полировка Fragment для CatuGram: исправленные визуальные дефекты.
   Грузится последним (после app.css, ui.css, market.css), поэтому переопределяет их. ===== */

/* Шапка на телефоне: левый градиент прокрутки затирал первую вкладку («Юзернеймы»).
   Первая вкладка всегда в зоне видимости, поэтому левый градиент не нужен. */
.tm-header-tabs.tm-x-scrollable::before{display:none}

/* Выключенные основные кнопки: серые, как в попапах. Раньше были полупрозрачным красным,
   текст на нём почти не читался («Вывести», «Отправить»). */
.btn-primary[disabled],.btn-primary:disabled,.btn-primary.disabled{background:#343436!important;color:#8c8c90!important;box-shadow:none;opacity:1}

/* Карточки подарков: длинное название переносится, номер «#112» никогда не режется.
   Раньше имя и номер обрезались вместе («Precious Peach #1»). */
.tm-catalog-grid .tm-grid-item-name.wide-only{display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:center;align-items:baseline;column-gap:4px;white-space:normal;overflow:visible;text-overflow:clip;min-width:0;max-width:100%;}
.tm-catalog-grid .tm-grid-item-name.wide-only .item-name{white-space:normal;overflow-wrap:anywhere;min-width:0}
.tm-catalog-grid .tm-grid-item-name.wide-only .item-num{white-space:nowrap;flex:0 0 auto}

/* Адрес кошелька: показываем начало и конец с «…» посередине, а не обрезку внутри слова. */
.tm-wallet{width:auto!important;max-width:100%}
.tm-table .tm-wallet{width:auto!important}
.popup-text .tm-wallet{max-width:none!important}
.tm-wallet{display:inline-flex;align-items:baseline;white-space:nowrap}
.tm-wallet .head,.tm-wallet .tail{flex:0 0 auto;flex-basis:auto;overflow:visible}
.tm-wallet .middle{width:auto;flex:none}
.tm-wallet .middle:before{background:none;box-shadow:none;margin:0;padding:0 .15em}

/* Кнопки внизу попапа: ровно по колонке текста и поля, одинаковая ширина, зазор между ними. */
.popup .popup-buttons{display:flex;gap:10px;margin:22px 0 0!important;padding:0}
.popup .popup-buttons>*{flex:1 1 0;min-width:0;margin:0}

/* Конвертация в коллекционный («Мои активы»): цена и баланс в тексте, список юзернеймов со статусом и одной кнопкой. */
#conversion .sg-convert-lead{margin:0 13px 12px;font-size:14px;line-height:20px;color:var(--text-color);text-align:left}
#conversion .sg-convert-lead span{color:#fafafa;font-weight:600}
#conversion .sg-convert-balance{margin:0 13px 12px;font-size:14px;line-height:20px;color:var(--text-color);text-align:left}
#conversion .sg-convert-balance>span{color:#fafafa;font-weight:600}
.sg-convert-warn{margin:8px -13px 0;padding:10px 13px;border-radius:10px;background:rgba(77,178,255,.12);color:#7cc5ff;font-size:14px;line-height:20px}
.sg-convert-warn a{color:inherit;font-weight:600;text-decoration:underline}
.sg-convert-box{overflow:hidden;border-radius:var(--def-border-radius);background-color:var(--table-bg-color)}
.sg-convert-search{padding:12px 12px 0}
.sg-convert-search input{width:100%;height:40px;padding:0 12px;border:0;border-radius:10px;background:var(--field-bg-color);color:#fafafa;font:inherit;font-size:15px;outline:0}
.sg-convert-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.sg-convert-row+.sg-convert-row{border-top:1px solid rgba(255,255,255,.06)}
.sg-convert-info{min-width:0;flex:1 1 auto}
.sg-convert-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:600;color:#fafafa}
.sg-convert-status{margin-top:2px;font-size:13px;line-height:17px;color:var(--text-color)}
.sg-convert-st-warn{color:#7cc5ff}
.sg-convert-btn{flex:0 0 auto;white-space:nowrap}
.sg-convert-empty{padding:20px 16px;text-align:center;font-size:14px;line-height:20px;color:var(--text-color)}
@media (max-width:479px){.sg-convert-row{flex-wrap:wrap}.sg-convert-btn{width:100%}}

/* Вкладки «Мои активы» на 480px+ (там видна кнопка «Цена»): край вкладок резался жёсткой стеной.
   Теперь плавный фейд в последние 48px, и этот же отступ справа в padding: последняя вкладка доезжает до конца целиком. */
.tm-section-header .sg-owned-tabs{padding-right:48px}
.sg-owned-tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),rgba(0,0,0,.45) calc(100% - 20px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 48px),rgba(0,0,0,.45) calc(100% - 20px),transparent)}

/* Карточка подарка на переводе: ширина по картинке (была фикс. 224px, картинка прижата влево), всё по центру. */
.tm-gift-premium-preview{width:fit-content;max-width:100%;padding:16px 20px 12px;text-align:center}

/* Между названием подарка и ценой лишний зазор: min-height под две строки, и padding из живого Fragment. */
.tm-catalog-grid .tm-grid-item-values{padding-top:0}

/* Окно подбора адреса: блок 348px был прижат к левому краю листа, центрируем; длинный адрес переносим, а не выходит за карточку. */
.processing-popup-container .popup-body{margin:0 auto}
.processing-popup-container .tm-popup-processing{width:100%}
.processing-popup-container .tm-popup-processing-text{overflow-wrap:anywhere}

/* Атрибуция: eCore (условие бесплатной лицензии) и API моделей подарков. */
.sg-credits{margin:24px 16px 20px;font-size:12px;line-height:17px;color:var(--sg-muted,#9a9a9f);text-align:center}
.sg-credits a{color:inherit;text-decoration:underline}
/* Анимированная модель, нарисованная eCore, занимает всю область карточки. */
.sg-ecr canvas{display:block;width:100%;height:100%}

/* Страница актива (/username/…, /number/…): блок «В блокчейне» — карточка как остальные, а на компьютере
   заголовок сверху, две карточки в ряд (цена и владелец; данные) и блок блокчейна на всю ширину ниже.
   Порядок задаётся явно: в fragment-reference.css стояли order-значения, из-за которых блок блокчейна (без order) уходил наверх. */
.tm-section-chain{margin-top:12px;padding:14px 16px 8px;border-radius:var(--def-border-radius);background-color:var(--table-bg-color);color:var(--table-text-color)}
.tm-section-chain .sg-mk-title{margin:0 0 4px;font-size:17px;color:#fafafa}
.tm-section-chain .sg-mk-list{margin:0}
.tm-section-chain .sg-mk-list li{padding:8px 0}
.tm-section-bid-info .table-cell-desc,.tm-section-bid-info .table-cell-value,.tm-section-bid-info .tm-value,.tm-section-auction-info dd{white-space:normal;overflow-wrap:anywhere}
.tm-section-bid-info td{white-space:normal;overflow:visible;text-overflow:clip}
.tm-section-bid-info .table-cell,.tm-section-bid-info .table-cell-value{overflow:visible!important;text-overflow:clip!important}
.tm-section-bid-info th:first-child{width:45%}
@media (min-width:768px){
  body[data-page=username] #page .tm-auction-section,body[data-page=number] #page .tm-auction-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 24px;margin-bottom:0}
  body[data-page=username] #page .tm-auction-section>*,body[data-page=number] #page .tm-auction-section>*{order:0;width:auto;margin:0;min-width:0;grid-column:1/-1}
  body[data-page=username] #page .tm-auction-section>.tm-section-bid-info,body[data-page=number] #page .tm-auction-section>.tm-section-bid-info{grid-column:1}
  body[data-page=username] #page .tm-auction-section>.tm-section-auction-info,body[data-page=number] #page .tm-auction-section>.tm-section-auction-info{grid-column:2}
  body[data-page=username] #page .tm-auction-section>.tm-section-chain,body[data-page=number] #page .tm-auction-section>.tm-section-chain{margin-top:0}
  body[data-page=username] #page .tm-auction-section>.tm-section-buttons,body[data-page=number] #page .tm-auction-section>.tm-section-buttons{justify-content:flex-start}
}