/* Стили приложения поверх дизайн-системы (ds.css): только раскладка, значения из токенов */
html, body { margin: 0; min-height: 100%; background: var(--bg); }

.page {
  box-sizing: border-box;
  max-width: 640px;
  margin: 0 auto;
  padding: var(--s-4);
  padding-top: calc(var(--s-4) + env(safe-area-inset-top, 0px));
  padding-bottom: calc(var(--s-8) + env(safe-area-inset-bottom, 0px));
  display: grid;
  gap: var(--s-4);
  overflow-x: hidden;
}

/* шапка ленты остаётся на месте при прокрутке */
.head { position: sticky; top: 0; z-index: 5; display: grid; gap: var(--s-3); background: var(--bg); margin: calc(-1 * var(--s-4)) calc(-1 * var(--s-4)) 0; padding: calc(var(--s-4) + env(safe-area-inset-top, 0px)) var(--s-4) var(--s-2); }
.head .ds-chip { cursor: pointer; }
.search-clear { position: absolute; right: var(--s-2); top: 50%; transform: translateY(-50%); }

.card-link { display: grid; gap: 2px; min-width: 0; text-align: left; width: 100%; }
.sold-tag { position: absolute; left: var(--s-2); bottom: var(--s-2); }
.sk-photo { aspect-ratio: 1 / 1.02; }
.sk-line { height: 14px; border-radius: var(--r-sm); margin-top: var(--s-2); }
.sk-line.short { width: 60%; }
.more { height: 1px; }
.stat { text-align: center; color: var(--text-3); font-size: var(--fs-caption); padding: var(--s-4) 0; }
.empty-act { margin-top: var(--s-3); }

/* страница товара: слой поверх ленты */
.ds-screen__body { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
.ds-screen__body.chat-body { padding-bottom: var(--s-4); }
.ds-screen .ds-actionbar { padding-bottom: calc(var(--s-4) + env(safe-area-inset-bottom, 0px)); }
.gallery-wrap { margin: 0 calc(-1 * var(--s-4)); }
.gallery-wrap .ds-gallery__track > * { cursor: zoom-in; }
.gallery-wrap .ds-ph { font-size: 64px; }
.dots-on-photo i { background: rgb(255 255 255 / .6); }
.dots-on-photo i.on { background: #fff; }
.bar-title { flex: 1; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-title { overflow-wrap: anywhere; }
.chat-btn { position: relative; flex: none; }
.chat-dot { position: absolute; top: 8px; right: 8px; }
.chat-body { display: flex; flex-direction: column; gap: var(--s-2); padding-bottom: var(--s-4); }
.chat-body > :first-child { margin-top: auto; }   /* короткая переписка прижата к полю ввода; align-content:end сломал бы прокрутку вверх */
.chat-hint { margin: 0; text-align: center; color: var(--text-3); font-size: var(--fs-body-sm); padding: var(--s-6) var(--s-4); }
.chat-row { min-height: 64px; padding-top: var(--s-2); padding-bottom: var(--s-2); }
.chat-row__text { flex: 1; min-width: 0; display: grid; gap: 2px; }
.chat-row__text b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-row__text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-3); }
.chat-row__time { flex: none; color: var(--text-3); }
.p-meta { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.p-desc { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; line-height: 22px; }
.ds-viewer__slide img { touch-action: pinch-zoom; }
.ds-toast { position: fixed; left: 16px; right: 16px; transform: none; margin: 0 auto; width: fit-content; max-width: calc(100vw - 32px); white-space: normal; text-align: center; bottom: calc(var(--s-8) + env(safe-area-inset-bottom, 0px)); z-index: 1500; }
.chat-older { text-align: center; color: var(--text-3); font-size: var(--fs-caption); padding: var(--s-2) 0; }
.chat-row__product { color: var(--text-2); }
.ds-composer .ds-icon-btn { flex: none; }

/* корзина, избранное, профиль, заказы */
.bar-actions { display: flex; align-items: center; gap: var(--s-2); }
.ds-actionbar .grow { flex: 1; }
.has-cart .page { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
.has-cart .ds-toast { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
.card-link { cursor: pointer; }
.profile-head { display: flex; align-items: center; gap: var(--s-3); }
.profile-head .ds-title { margin: 0; }
.order-card { display: grid; gap: var(--s-2); padding: var(--s-4); }
.orders { display: grid; gap: var(--s-3); }
.order-card__head { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); }
.order-card__items { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; font-size: var(--fs-body-sm); }
.order-card__items li { display: flex; justify-content: space-between; gap: var(--s-3); }
.order-card__items li span:first-child { min-width: 0; overflow-wrap: anywhere; }