/* ============================================================
   ZALUT PAGES — третий слой поверх theme-2026.css и fx.css.
   Шапка, подвал и внутренние страницы. Плоские поверхности,
   без свечений, «стекла» и декоративной анимации.
   ============================================================ */

body { position: relative; }
main { position: relative; min-height: calc(62vh / var(--z, 1)); }

/* ---------- Шапка: действия залогиненного ---------- */
.nav__actions--user { gap: 8px; flex-wrap: nowrap; }
.hd-bal {
  display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 14px 0 6px;
  border-radius: 999px; text-decoration: none; white-space: nowrap;
  color: var(--txt); font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--line);
  transition: border-color .2s, background .2s;
}
.hd-bal:hover { border-color: var(--line-hi); background: rgba(255,255,255,.08); }
.hd-bal__ico { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: rgba(139,123,255,.2); color: #C4B5FD; }
.hd-bal__ico svg { width: 16px; height: 16px; }

.hd-sell {
  display: inline-flex; align-items: center; gap: 6px; height: 42px; padding: 0 18px 0 14px;
  border-radius: 999px; text-decoration: none; white-space: nowrap;
  color: #fff; font-weight: 700; font-size: 14px;
  background: var(--grad);
  transition: filter .2s;
}
.hd-sell:hover { filter: brightness(1.1); }
.hd-sell svg { width: 16px; height: 16px; }

.hd-ico {
  position: relative; flex: none;
  width: 42px; height: 42px; border-radius: 50%; padding: 0;
  display: grid; place-items: center; cursor: pointer;
  color: var(--txt-2); text-decoration: none;
  background: rgba(255,255,255,.04); border: 1px solid var(--line);
  transition: color .2s, background .2s, border-color .2s, transform .3s var(--ease-out);
}
.hd-ico:hover, .hd-ico.is-active { color: #fff; background: rgba(255,255,255,.08); border-color: var(--line-hi); }

.hd-ico:active { transform: scale(.94); }
.hd-ico__g, .hd-ico .bell__glyph { display: grid; color: inherit; }
.bell__btn:hover .bell__glyph { color: #fff; }
.hd-badge, .hd-ico .bell__badge {
  position: absolute; top: -3px; right: -3px;
  min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px;
  display: inline-grid; place-items: center;
  font: 800 max(10.5px, calc(9px / var(--z, 1)))/1 var(--font-body); color: #fff;
  background: #E5484D;
  box-shadow: 0 0 0 2px var(--bg-1);
}
.hd-ico .bell__badge[hidden] { display: none; }

.hd-acc { position: relative; }
.hd-me {
  display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 10px 0 4px;
  border-radius: 999px; cursor: pointer; color: var(--txt); font: 700 14px/1 var(--font-body);
  background: rgba(255,255,255,.04); border: 1px solid var(--line);
  transition: background .2s, border-color .2s;
}
.hd-me:hover, .hd-acc.is-open .hd-me { background: rgba(255,255,255,.08); border-color: var(--line-hi); }
.hd-me__name { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hd-me__chev { display: grid; color: var(--txt-3); transition: transform .3s var(--ease-out); }
.hd-me__chev svg { width: 16px; height: 16px; }
.hd-acc.is-open .hd-me__chev { transform: rotate(180deg); }
.hd-ava {
  width: 34px; height: 34px; border-radius: 50%; object-fit: cover; flex: none;
  box-shadow: 0 0 0 1px var(--line-hi);
}
.hd-ava--empty { display: grid; place-items: center; font-weight: 800; font-size: 14px; color: #fff; background: var(--grad); }

.hd-menu {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 200;
  width: 290px; padding: 8px; border-radius: 16px;
  background: #14141C; border: 1px solid var(--line-hi);
  box-shadow: 0 24px 60px -24px rgba(0,0,0,1);
  transform-origin: top right;
  animation: hd-pop .18s ease-out;
}
.hd-menu[hidden] { display: none; }
@keyframes hd-pop { from { opacity: 0; transform: translateY(-4px); } }
.hd-menu__me { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 14px; text-decoration: none; color: var(--txt); }
.hd-menu__me:hover { background: rgba(255,255,255,.05); }
.hd-menu__me .hd-ava { width: 44px; height: 44px; }
.hd-menu__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.hd-menu__who b { font-size: 15.5px; overflow: hidden; text-overflow: ellipsis; }
.hd-menu__who small { color: var(--txt-3); font-size: 12.5px; }
.hd-menu__bal {
  display: flex; justify-content: space-between; align-items: center; margin: 4px 2px 6px; padding: 12px 14px;
  border-radius: 12px; text-decoration: none; color: var(--txt-2); font-size: 13px;
  background: rgba(255,255,255,.04); border: 1px solid var(--line);
}
.hd-menu__bal b { color: #fff; font: 800 17px/1 var(--font-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.hd-menu__grp { padding: 4px 0; border-top: 1px solid var(--line); }
.hd-menu__item {
  width: 100%; display: flex; align-items: center; gap: 12px;
  padding: 9px 10px; border-radius: 11px; border: 0; background: none; cursor: pointer;
  color: var(--txt); text-decoration: none; font: 600 14px/1.2 var(--font-body); text-align: left;
}
.hd-menu__item:hover, .hd-menu__item.is-active { background: rgba(139,123,255,.14); }
.hd-menu__item .hd-badge { position: static; margin-left: auto; box-shadow: none; }
.hd-menu__ico { display: grid; color: var(--txt-3); }
.hd-menu__item:hover .hd-menu__ico { color: #C4B5FD; }
.hd-menu__out { border-top: 1px solid var(--line); border-radius: 0 0 11px 11px; margin-top: 4px; color: var(--err); }
.hd-menu__out .hd-menu__ico { color: var(--err); }

/* ---------- Значки вместо эмодзи (подставляет js/emoji.js) ---------- */
.emo {
  display: inline-block; width: 1.22em; height: 1.22em; vertical-align: -.24em;
  object-fit: contain; pointer-events: none; user-select: none; -webkit-user-drag: none;
}

/* Language selection is shared by the header, account menu and footer. */
.hd-lang { display:inline-flex; flex:none; align-items:center; gap:3px; padding:3px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.04); }
.hd-lang button { min-width:31px; height:32px; padding:0 7px; border:0; border-radius:999px; background:transparent; color:var(--txt-3); font:800 12px/1 var(--font-body); cursor:pointer; }
.hd-lang button:hover { color:var(--txt); background:rgba(255,255,255,.08); }
.hd-lang button.is-active { color:#fff; background:var(--grad); }
.hd-lang button:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.hd-lang--menu { margin:8px 12px; width:max-content; }
.footer__lang button { height:28px; }
@media (max-width: 1180px) { .hd-me__name, .hd-me__chev { display: none; } .hd-me { padding: 0 4px; } }
@media (max-width: 900px) {
  .hd-sell__txt { display: none; }
  .hd-sell { width: 42px; padding: 0; justify-content: center; }
}
@media (max-width: 600px) {
  .nav__actions--user { gap: 5px; }
  .nav:has(.nav__actions--user) .nav__logo img { width: 70px; height: auto; }
  .hd-bal__ico { display: none; }
  .hd-bal { padding: 0 11px; height: 36px; font-size: 12.5px; }
  .hd-ico, .hd-sell, .hd-me { width: 36px; height: 36px; }
  .hd-me { padding: 0; justify-content: center; }
  .hd-me .hd-ava { width: 30px; height: 30px; }
  .nav__actions--user > .hd-ico[href="/chats"] { display: none; }
  .nav .nav__inner { column-gap: 10px; }
  .hd-menu { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; }
}

/* На телефоне поиск уходит второй строкой — шапке нужна авто-высота
   (тема задаёт 76px и строка поиска наезжала на страницу) */
@media (max-width: 1023px) {
  .nav .nav__inner, .nav--scrolled .nav__inner { height: auto; min-height: 64px; padding: 10px 0; row-gap: 10px; }
}

/* Кнопка «Игры» слева от поиска — открывает окно со всеми играми (js/gamemenu.js) */
.nav__games {
  flex: none; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px 0 13px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--line); background: var(--glass); color: var(--txt);
  font-family: inherit; font-weight: 700; font-size: 14px; line-height: 1;
  transition: background .2s, border-color .2s, transform .2s;
}
.nav__games > span:first-child { display: grid; color: var(--acc-2, #c4b5fd); }
.nav__games:hover { border-color: var(--line-hi); background: rgba(255,255,255,.08); }
.nav__games:active { transform: scale(.97); }
@media (max-width: 1023px) {
  /* вторая строка шапки: [Игры] [поиск] */
  .nav__games { order: 3; width: 44px; padding: 0; justify-content: center; }
  .nav__games-txt { display: none; }
  .nav__games ~ .search { flex-basis: calc(100% - 44px - 16px); }
}

/* ---------- Подвал ---------- */
.footer__bar {
  position: relative; z-index: 1;
  width: min(var(--content), 100% - var(--gutter) * 2); margin: 56px auto 0; padding: 22px 0;
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  border-top: 1px solid var(--line); color: var(--txt-3); font-size: 13px;
}
.footer__status { display: inline-flex; align-items: center; gap: 8px; }
.footer__status i { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }

/* ---------- Общие элементы страниц ---------- */
.pg-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin: 36px 0 28px; }
.pg-head__title { margin: 0; font: 800 clamp(30px, calc(3.8vw / var(--z, 1)), 50px)/1.05 var(--font-display); letter-spacing: -.045em; }
.pg-head__sub { margin: 10px 0 0; color: var(--txt-2); font-size: 16px; line-height: 1.55; max-width: 640px; }
.pg-head__actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* Шапки страниц с нашим рисунком (.art-head + .ax из fx.css): сцена фоном, тень под текст слева, предмет
   выходит за верх справа. Баланс, рефералы, поддержка, индекс доверия, трофеи, комиссия. */
.art-head.ax {
  --hero-w: 250px; --hero-top: -70px; --hero-right: 22px; --shade-mid: 46%; --shade-end: 82%;
  box-sizing: border-box; overflow: visible; min-height: 210px; margin-top: 72px;
  padding: 32px 300px 32px 34px; border-radius: 26px;
  display: flex; flex-direction: column; justify-content: center; align-items: stretch;
}
.art-head.ax h1 { color: #fff; }
.art-head.ax p, .art-head.ax .bal-hero__lbl, .art-head.ax .bal-hero__dep { color: rgb(255 255 255 / .8); }
.art-head.ax p b { color: #fff; }
.art-head.ax .btn-ghost { background: rgb(0 0 0 / .32); border-color: rgb(255 255 255 / .28); color: #fff; }
.rw-hero.art-head { width: min(1120px, 100% - 32px); }
/* вход и регистрация: над карточкой «Как Zalut защищает сделки» — карточка с ключом в замке-щите */
.auth2-aside:has(> .auth2-art) { display: flex; flex-direction: column; gap: 16px; padding-top: 54px; }
.auth2-art.ax {
  --hero-w: 180px; --hero-top: -58px; --hero-right: 8px; --shade-mid: 46%; --shade-end: 84%;
  box-sizing: border-box; min-height: 150px; padding: 24px 190px 24px 26px; border-radius: 24px;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.auth2-art__title { font: 800 19px/1.2 var(--font-display); letter-spacing: -.02em; }
.auth2-art__text { color: rgb(255 255 255 / .78); font-size: 14px; line-height: 1.45; }
@media (max-width: 900px) {
  .auth2-aside:has(> .auth2-art) { padding-top: 40px; }
  .auth2-art.ax { --hero-w: 140px; --hero-top: -40px; padding-right: 150px; }
}
.sup-hero.ax .sup-hero__ico { display: none; }
@media (max-width: 760px) {
  .art-head.ax {
    --hero-w: 150px; --hero-top: -46px; --hero-right: 10px;
    margin-top: 56px; min-height: 0; padding: 100px 20px 22px;
  }
  .art-head.ax .ax__surface::before {
    background: linear-gradient(180deg, rgb(var(--shade) / .05) 0%, rgb(var(--shade) / .72) 36%, rgb(var(--shade) / .95) 60%);
  }
}

/* Пустые состояния: серая иконка, заголовок, текст */
.pg-empty {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
  padding: 40px 24px; border-radius: 16px;
  border: 1px dashed rgba(255,255,255,.12); background: rgba(255,255,255,.02);
  color: var(--txt-2); list-style: none;
}
.pg-empty__ico {
  width: 48px; height: 48px; margin-bottom: 8px; border-radius: 14px;
  display: grid; place-items: center; color: var(--txt-2);
  background: rgba(255,255,255,.05); border: 1px solid var(--line);
}
.pg-empty__ico svg { width: 22px; height: 22px; }
/* с нашей картинкой (js/art.js spotUrl, tools/site-art/spots.mjs) вместо серого значка */
.pg-empty--art { padding-top: 30px; }
.pg-empty__art { display: block; width: 120px; height: 120px; margin-bottom: 10px; object-fit: contain; }
@media (prefers-reduced-motion: no-preference) {
  .pg-empty__art { animation: gx-float 6s ease-in-out infinite; }
}
/* Старые .empty по всему сайту — тот же вид: иконка «входящие» */
main .empty:not(.lcard):not(span) {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  padding: 36px 24px !important; border-radius: 16px; text-align: center; list-style: none;
  border: 1px dashed rgba(255,255,255,.12) !important; background: rgba(255,255,255,.02) !important;
  color: var(--txt-2); font-size: 14.5px; line-height: 1.55;
}
main .empty:not(.lcard):not(span)::before {
  content: ''; width: 46px; height: 46px; margin-bottom: 6px; border-radius: 14px; flex: none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E9EB2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-6l-2 3h-4l-2-3H2'/%3E%3Cpath d='M5.5 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.5-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.7 1.1z'/%3E%3C/svg%3E") center / 20px no-repeat,
    rgba(255,255,255,.05);
  border: 1px solid var(--line);
}
main .empty a { color: #C4B5FD; font-weight: 700; }
.lots-grid > .empty { grid-column: 1 / -1; }
.pg-empty b { color: var(--txt); font-size: 17px; }
.pg-empty span { max-width: 440px; font-size: 14.5px; line-height: 1.55; }
.pg-empty .btn-ghost, .pg-empty .btn-shimmer { margin-top: 14px; padding: 12px 22px; font-size: 14.5px; }

/* Сегментированные вкладки: индикатор переезжает под активную */
.pg-tabs {
  position: relative; display: inline-flex; gap: 2px; padding: 5px; border-radius: 999px;
  background: rgba(255,255,255,.04); border: 1px solid var(--line);
  max-width: 100%; overflow-x: auto; scrollbar-width: none;
}
.pg-tabs::-webkit-scrollbar { display: none; }
.pg-tabs__ind {
  position: absolute; top: 5px; bottom: 5px; left: 0; width: 0; z-index: 0; border-radius: 999px;
  background: rgba(108,92,255,.9);
  transition: transform .3s var(--ease-out), width .3s var(--ease-out);
}
.pg-tab {
  position: relative; z-index: 1; flex: none;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px; border-radius: 999px; border: 0; background: none; cursor: pointer;
  color: var(--txt-2); font: 700 14px/1 var(--font-body); white-space: nowrap; text-decoration: none;
  transition: color .25s;
}
.pg-tab:hover { color: var(--txt); }
.pg-tab.is-active { color: #fff; }
.pg-tab__n {
  min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center;
  font-size: max(11.5px, calc(9px / var(--z, 1))); background: rgba(255,255,255,.1);
}
.pg-tab.is-active .pg-tab__n { background: rgba(255,255,255,.22); }

.pg-tab__n.is-hot { background: #E5484D; color: #fff; }

/* Плашка статуса с точкой */
.st {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 700; white-space: nowrap; border: 1px solid;
}
.st i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.st--ok   { color: #6EE7B7; background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.35); }
.st--info { color: #A5B4FC; background: rgba(139,123,255,.14); border-color: rgba(139,123,255,.4); }
.st--warn { color: #FCD34D; background: rgba(251,191,36,.12); border-color: rgba(251,191,36,.35); }
.st--err  { color: #FDA4AF; background: rgba(251,113,133,.12); border-color: rgba(251,113,133,.4); }
.st--mute { color: var(--txt-3); background: rgba(255,255,255,.04); border-color: var(--line); }


/* Строки сделок и офферов */
.dl-list { display: grid; gap: 10px; margin-top: 18px; }
.dl {
  position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto 24px; gap: 16px; align-items: center;
  padding: 16px 18px; border-radius: 16px; color: inherit; text-decoration: none;
  border: 1px solid var(--line); background-color: var(--bg-1);
  transition: border-color .2s, background-color .2s;
}
a.dl:hover { border-color: var(--line-hi); background-color: rgba(255,255,255,.04); }
.dl--offer { grid-template-columns: 52px minmax(0, 1fr) auto auto; }
.dl-ava { width: 52px; height: 52px; border-radius: 16px; object-fit: cover; display: grid; place-items: center; font-weight: 800; font-size: 18px; color: #fff; background: var(--grad); }
.dl__body { min-width: 0; }
.dl__title { display: block; font-weight: 700; font-size: 15.5px; color: var(--txt); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.dl__title:hover { color: #C4B5FD; }
.dl__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; color: var(--txt-3); font-size: 13px; }
.dl__meta b { color: var(--txt-2); font-weight: 600; }
.dl__game { color: var(--txt-2); font-weight: 600; }
/* срок оффера: «ответ до 18:49», меньше трёх часов — подсвечен */
.dl__due.is-soon { color: var(--warn); font-weight: 600; }
.dl__quote { margin-top: 8px; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.04); border-left: 2px solid #A78BFA; color: var(--txt-2); font-size: 13.5px; }
.dl__side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.dl__price { font: 800 19px/1 var(--font-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.dl__was { font-size: 12px; color: var(--txt-3); }
.dl__was b { color: var(--ok); }
.dl__go { color: var(--txt-3); display: grid; transition: color .2s; }
a.dl:hover .dl__go { color: #fff; }
.dl__ctl { display: flex; gap: 8px; }
.dl__btn { padding: 10px 16px !important; font-size: 13.5px !important; }
/* «Показать ещё» под длинным списком сделок */
.dl-more {
  height: 48px; border-radius: 14px; border: 1px dashed var(--line-hi); background: none; cursor: pointer;
  color: var(--txt); font: 700 14.5px/1 var(--font-body, inherit);
}
.dl-more:hover { border-style: solid; background: var(--glass); }
.dl-more span { color: var(--txt-3); font-weight: 600; }
@media (max-width: 700px) {
  .dl, .dl--offer { grid-template-columns: 44px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .dl-ava { width: 44px; height: 44px; border-radius: 13px; }
  .dl__side { grid-column: 2; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; }
  .dl__go { display: none; }
  .dl__ctl { grid-column: 1 / -1; }
  .dl__ctl > * { flex: 1; justify-content: center; }
  .dl__title { white-space: normal; }
}

/* Карточка-панель общего вида */
.pg-card {
  position: relative; padding: 24px; border-radius: 18px; border: 1px solid var(--line);
  background-color: var(--bg-1);
}

/* ============================================================
   СТРАНИЦА ЛОТА (pdp-*)
   ============================================================ */
.pdp { padding: 26px 0 40px; }
/* содержимое лота, которое сервер отдаёт сразу в HTML (src/seo.js) — видно, пока js/product.js не нарисует страницу */
.pdp-ssr { max-width: 860px; padding: 26px 0 40px; }
.pdp-ssr__crumbs { color: var(--txt-3); font-size: 14px; }
.pdp-ssr__crumbs a { color: var(--txt-2); text-decoration: none; }
.pdp-ssr__title { margin: 14px 0 10px; font: 700 clamp(22px, calc(2.4vw / var(--z, 1)), 32px)/1.18 var(--font-display); letter-spacing: -.035em; overflow-wrap: anywhere; }
.pdp-ssr__price { margin: 0 0 16px; font: 800 24px/1.2 var(--font-display); }
.pdp-ssr__note { margin: 0 0 16px; color: var(--warn); font-weight: 600; }
.pdp-ssr__attrs { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pdp-ssr__attrs li { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); font-size: 14px; }
.pdp-ssr__attrs span { color: var(--txt-3); }
.pdp-ssr__desc p { margin: 0 0 10px; color: var(--txt-2); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.pdp-ssr__seller { color: var(--txt-2); font-size: 14.5px; }
.pdp-ssr__seller a { color: var(--txt); font-weight: 700; }
.pdp-crumbs { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; font-size: 13.5px; color: var(--txt-3); }
.pdp-crumbs a { color: var(--txt-2); text-decoration: none; transition: color .2s; }
.pdp-crumbs a:hover { color: #fff; }
.pdp-crumbs a:last-child { color: var(--txt); }
.pdp__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr); gap: 28px; align-items: start; }
.pdp__main { display: grid; gap: 18px; min-width: 0; }
.pdp__side { position: sticky; top: 92px; display: grid; gap: 14px; }

/* галерея */
.pdp-gal { position: relative; }
.pdp-gal__main {
  position: relative; overflow: hidden; aspect-ratio: 16 / 10; border-radius: 18px;
  border: 1px solid var(--line); background: var(--bg-2);
}
.pdp-gal__main > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdp-gal__main > img.is-swap { animation: pdp-swap .25s ease-out; }
@keyframes pdp-swap { from { opacity: .4; } }
.pdp-gal__main--ph {
  display: grid; place-items: center;
  background: hsl(var(--hue) 30% 14%);
}
.pdp-gal__main--ph.has-cover { background-size: cover; background-position: center; }
.pdp-gal__main--ph.has-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(5,5,10,.8)); }
.pdp-gal__mark {
  position: relative; width: 150px; height: 150px; border-radius: 36px;
  display: grid; place-items: center;
  font: 800 54px/1 var(--font-display); letter-spacing: -.05em; color: #fff;
  background: hsl(var(--hue) 45% 36%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
}
.pdp-gal__icon { position: relative; width: 150px; height: 150px; border-radius: 36px; object-fit: cover; }
.pdp-gal__game {
  position: absolute; left: 18px; bottom: 16px; z-index: 1;
  padding: 7px 13px; border-radius: 999px; font-weight: 700; font-size: 13px;
  background: rgba(0,0,0,.72); border: 1px solid rgba(255,255,255,.12);
}
/* счётчик — слева: справа внизу на фото водяной знак (src/images.js) */
.pdp-gal__count {
  position: absolute; left: 16px; bottom: 14px; padding: 6px 11px; border-radius: 999px;
  font-size: 12.5px; font-weight: 700; background: rgba(0,0,0,.72);
}
.pdp-gal__thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; padding-bottom: 4px; }
.pdp-gal__thumb {
  flex: none; width: 92px; aspect-ratio: 16/10; padding: 0; border-radius: 14px; overflow: hidden; cursor: pointer;
  border: 2px solid transparent; background: var(--bg-2); opacity: .55;
  transition: opacity .2s, border-color .2s;
}
.pdp-gal__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdp-gal__thumb:hover { opacity: .9; }
.pdp-gal__thumb.is-active { opacity: 1; border-color: #A78BFA; }

/* карточки слева */
.pdp-card { padding: 24px; border-radius: 18px; border: 1px solid var(--line); background: var(--bg-1); }
.pdp-card__h { margin: 0 0 14px; font: 700 19px/1.2 var(--font-display); letter-spacing: -.03em; }
.pdp-desc { max-width: 78ch; color: var(--txt-2); font-size: 15.5px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }   /* ~90 знаков в строке и на широком экране */
/* характеристики лота (js/attrs.js): у аккаунтов PUBG Mobile — «Уровень 67 · Ас» и счётчики вещей
   в карточке покупки; все заполненные поля — отдельной карточкой «Характеристики» */
.pdp-buy__head { margin: -4px 0 12px; font: 700 16px/1.3 var(--font-display); letter-spacing: -.01em; color: var(--txt); }
.pdp-stats { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
/* способ получения товара (как на Playerok): «Способ получения · По ID игрока — Донат по ID, без входа в аккаунт» */
.pdp-way { display: grid; gap: 2px; margin: 0 0 16px; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid var(--line); }
.pdp-way small { color: var(--txt-3); font-size: 12.5px; }
.pdp-way b { font-size: 15.5px; color: var(--txt); }
.pdp-way span { color: var(--txt-2); font-size: 13.5px; line-height: 1.45; }
.pdp-attrs { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin: 0; }
.pdp-attrs div { padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid var(--line); }
.pdp-attrs dt { margin: 0 0 4px; color: var(--txt-3); font-size: 12.5px; }
.pdp-attrs dd { margin: 0; font-weight: 700; font-size: 15px; }
.pdp-how { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; counter-reset: how; }
.pdp-how li {
  position: relative; counter-increment: how; padding: 16px; border-radius: 14px;
  background: rgba(255,255,255,.03); border: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 6px;
}
.pdp-how li::before {
  content: counter(how); margin-bottom: 4px;
  font: 800 14px/1 var(--font-display); color: #8B7BFF;
}
.pdp-how b { font-size: 15px; }
.pdp-how span { color: var(--txt-2); font-size: 13.5px; line-height: 1.55; }

/* карточка покупки */
.pdp-buy {
  padding: 24px; border-radius: 18px; border: 1px solid var(--line-hi);
  background: var(--bg-1);
}
.pdp-buy__chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.pdp-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px;
  font-size: 12.5px; font-weight: 700; color: var(--txt); text-decoration: none;
  background: hsl(var(--hue, 250) 70% 50% / .16); border: 1px solid hsl(var(--hue, 250) 80% 65% / .35);
}
.pdp-chip i { width: 7px; height: 7px; border-radius: 50%; background: hsl(var(--hue) 90% 65%); }
.pdp-chip--muted { background: rgba(255,255,255,.05); border-color: var(--line); color: var(--txt-2); }
/* премиум-лот: та же золотая метка, что в каталоге */
.pdp-chip--premium { background: #F59E0B; border-color: #F59E0B; color: #1f1300; }
.pdp-chip--premium svg { width: 13px; height: 13px; }
.pdp-chip:hover { filter: brightness(1.2); }

/* ---- страница лота с афишей игры (main.js gameBackdrop, js/product.js): сверху сцена игры в цвет страницы, герой
   выглядывает из-за карточки покупки; шапка игры (значок, название, путь); акценты — в цвет игры (--tone) ---- */
.pdp--art { padding-top: 20px; }
.pdp-game { display: flex; align-items: center; gap: 14px; margin: 4px 0 28px; max-width: calc(100% - 240px); }
.pdp-game__ico {
  flex: none; width: 54px; height: 54px; border-radius: 16px; overflow: hidden; display: grid; place-items: center;
  background: hsl(var(--hue) 45% 30%); color: #fff; font-weight: 800; text-decoration: none;
  box-shadow: 0 0 0 2px var(--tone, rgba(255,255,255,.2)), 0 14px 30px -14px rgba(0,0,0,.9);
}
.pdp-game__ico img { width: 100%; height: 100%; object-fit: cover; }
.pdp-game__txt { min-width: 0; }
.pdp-game__title { font: 800 clamp(22px, calc(2.4vw / var(--z, 1)), 30px)/1.1 var(--font-display); letter-spacing: -.035em; color: #fff; text-decoration: none; }
.pdp-game__title:hover { color: var(--tone, #fff); }
.pdp-game .pdp-crumbs { margin: 6px 0 0; }
.pdp--art .pdp-crumbs a:last-child { color: var(--tone, var(--txt)); }
.pdp--art .pdp-buy { box-shadow: inset 0 3px 0 var(--tone), 0 24px 60px -30px rgba(0,0,0,.9); }
.pdp--art .pdp-chip:not(.pdp-chip--muted):not(.pdp-chip--premium) { background: color-mix(in srgb, var(--tone) 18%, transparent); border-color: color-mix(in srgb, var(--tone) 55%, transparent); }
.pdp--art .pdp-chip i { background: var(--tone); }
.pdp--art .pdp-card__h { display: flex; align-items: center; gap: 10px; }
.pdp--art .pdp-card__h::before { content: ''; flex: none; width: 4px; height: 18px; border-radius: 2px; background: var(--tone); }
.pdp--art .pdp-card, .pdp--art .pdp-gal { box-shadow: 0 24px 60px -34px rgba(0,0,0,.85); }
@media (max-width: 760px) {
  .pdp--art { padding-top: 12px; }
  .pdp-game { max-width: none; margin-bottom: 18px; }
  .pdp-game__ico { width: 46px; height: 46px; border-radius: 14px; }
}
.pdp-buy__title { margin: 0 0 14px; font: 700 clamp(22px, calc(2vw / var(--z, 1)), 28px)/1.18 var(--font-display); letter-spacing: -.035em; overflow-wrap: anywhere; }
.pdp-buy .lot-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.pdp-buy .lot-badge {
  padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: rgba(255,255,255,.06); border: 1px solid var(--line); color: var(--txt-2);
}
.pdp-buy .lot-badge--fast { background: rgba(6,182,212,.14); border-color: rgba(6,182,212,.45); color: #67E8F9; }
.pdp-buy__price { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.pdp-buy__sum {
  font: 800 clamp(34px, calc(3.2vw / var(--z, 1)), 44px)/1 var(--font-display); letter-spacing: -.05em; font-variant-numeric: tabular-nums;
  color: #fff;
}
.pdp-buy__sum s { font-size: .45em; color: var(--txt-3); margin-left: 6px; }
.pdp-buy__note { display: inline-flex; align-items: center; gap: 6px; color: var(--ok); font-size: 12.5px; font-weight: 600; }
.pdp-buy__note .pdp-ico svg { width: 14px; height: 14px; }
.pdp-buy__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pdp-buy__cta { grid-column: 1 / -1; width: 100%; padding: 18px 24px; font-size: 16.5px; }
.pdp-buy__actions .btn-ghost { justify-content: center; padding: 13px 12px; font-size: 14px; }
.pdp-buy__wide { width: 100%; justify-content: center; margin-top: 12px; }
.pdp-offer { display: grid; gap: 10px; margin-top: 14px; padding: 16px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--line); animation: fx-rise .2s ease-out; }
.pdp-offer[hidden] { display: none; }
.pdp-offer .form__row { margin: 0; }
.pdp-offer__send { padding: 13px 20px; font-size: 14.5px; }
.pdp-status { margin: 12px 0 0; font-size: 13.5px; color: var(--txt-2); line-height: 1.5; }
.pdp-status:empty { display: none; }
.pdp-qty { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.pdp-qty__lbl { color: var(--txt-2); font-size: 14px; }
.pdp-qty__left { color: var(--txt-3); font-size: 13px; }
.pdp-qty__ctl { display: inline-flex; align-items: center; border-radius: 999px; border: 1px solid var(--line-hi); background: rgba(255,255,255,.04); overflow: hidden; }
.pdp-qty__ctl input { width: 54px; border: 0 !important; background: none !important; text-align: center; color: var(--txt); font-weight: 700; padding: 8px 0 !important; -moz-appearance: textfield; }
.pdp-qty__ctl input::-webkit-inner-spin-button { -webkit-appearance: none; }
.pdp-qty__btn { width: 38px; height: 38px; border: 0; background: none; color: var(--txt); font-size: 18px; cursor: pointer; }
.pdp-qty__btn:hover { background: rgba(255,255,255,.08); }
.pdp-promo { margin-top: 14px; }
.pdp-promo summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; color: var(--txt-2); font-size: 13.5px; font-weight: 600; }
.pdp-promo summary::-webkit-details-marker { display: none; }
.pdp-promo summary:hover { color: #fff; }
.pdp-promo summary svg { width: 15px; height: 15px; }
.pdp-promo__row { display: flex; gap: 8px; margin-top: 10px; animation: fx-rise .2s ease-out; }
.pdp-promo__row input { flex: 1; min-width: 0; text-transform: uppercase; letter-spacing: .06em; }
.pdp-promo__row .btn-ghost { padding: 11px 16px; font-size: 14px; }
.pdp-trust { list-style: none; margin: 20px 0 0; padding: 16px 0 0; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.pdp-trust li { display: flex; gap: 12px; align-items: flex-start; color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.pdp-trust b { color: var(--txt); }
.pdp-trust .pdp-ico { flex: none; width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; color: #C4B5FD; background: rgba(139,123,255,.14); border: 1px solid rgba(139,123,255,.25); }
.pdp-trust .pdp-ico svg { width: 15px; height: 15px; }
.pdp-state { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid var(--line); }
.pdp-state b { font: 700 16px/1.2 var(--font-display); letter-spacing: -.02em; }
.pdp-state span { color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.pdp-state--sold { background: rgba(251,113,133,.08); border-color: rgba(251,113,133,.3); }
.pdp-state--sold b { color: var(--err); letter-spacing: .08em; text-transform: uppercase; }
.pdp-state--own { background: rgba(139,123,255,.08); border-color: rgba(139,123,255,.3); }

/* продавец */
.pdp-seller {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 18px;
  color: var(--txt); text-decoration: none; border: 1px solid var(--line); background-color: var(--bg-1);
  transition: border-color .2s;
}
.pdp-seller:hover { border-color: var(--line-hi); }
.pdp-seller__ava { position: relative; flex: none; width: 52px; height: 52px; border-radius: 50%; }
.pdp-seller__ava img, .pdp-seller__ava > span { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: #1B1A2A; border: 1px solid var(--line-hi); font-weight: 800; }
.pdp-seller__ava .presence__dot { position: absolute; right: 0; bottom: 0; width: 13px; height: 13px; border: 2px solid var(--bg-1); }
.pdp-seller__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pdp-seller__body > small { color: var(--txt-3); font-size: max(11.5px, calc(9px / var(--z, 1))); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.pdp-seller__body > b { font-size: 16.5px; overflow: hidden; text-overflow: ellipsis; }
.pdp-seller__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; color: var(--txt-3); font-size: 13px; }
.pdp-seller__meta b { color: var(--txt); }
.pdp-seller__body .presence { font-size: 12.5px; }
.pdp-seller__go { color: var(--txt-3); display: grid; transition: color .2s; }
.pdp-seller:hover .pdp-seller__go { color: #fff; }
/* звёзды, закрашенные по рейтингу */
.pdp-stars {
  letter-spacing: 1px; font-size: 13px;
  background: linear-gradient(90deg, var(--warn) calc(var(--r) / 5 * 100%), rgba(255,255,255,.18) 0);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.pdp-report { padding-left: 6px; }
/* у продавца открыта претензия в арбитраже — видно до оплаты */
.pdp-claim {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; text-decoration: none; color: var(--txt);
  border: 1px solid rgba(251,113,133,.45);
  background: repeating-linear-gradient(135deg, rgba(251,113,133,.07) 0 10px, transparent 10px 20px), var(--bg-1);
  transition: border-color .2s;
}
.pdp-claim:hover { border-color: rgba(251,113,133,.8); }
.pdp-claim b { display: block; font-size: 14.5px; }
.pdp-claim small { display: block; margin-top: 3px; color: #fecdd3; font-size: 12.5px; line-height: 1.45; opacity: .9; }
.pdp-claim__ico { width: 38px; height: 38px; border-radius: 12px; flex: none; display: grid; place-items: center; font-size: 18px; background: rgba(251,113,133,.16); color: #fecdd3; }
.pdp-claim__go { margin-left: auto; color: var(--txt-3); }
.pdp-more { margin-top: 56px; }

@media (max-width: 980px) {
  /* minmax(0,…) и min-width:0 — колонка по ширине экрана, а не по самому широкому блоку (на телефоне страница уезжала вбок) */
  .pdp__grid { grid-template-columns: minmax(0, 1fr); }
  .pdp__grid > * { min-width: 0; }
  .pdp__side { position: static; min-width: 0; }
  .pdp__main { display: contents; }
  .pdp-gal { order: 1; }
  .pdp__side { order: 2; }
  .pdp__main > .pdp-card { order: 3; }
}
@media (max-width: 600px) {
  .pdp-how { grid-template-columns: 1fr; }
  .pdp-buy, .pdp-card { padding: 20px; border-radius: 16px; }
  .pdp-gal__mark, .pdp-gal__icon { width: 104px; height: 104px; border-radius: 26px; font-size: 38px; }
}

/* пустой список в сетке лотов — на всю ширину */
.lots-grid > .pg-empty { grid-column: 1 / -1; }

/* ============================================================
   ПРОФИЛЬ ПРОДАВЦА (.sp поверх старых .p-*)
   ============================================================ */
.sp { margin-top: 22px; padding-bottom: 30px; }
.sp .p-banner { height: 220px; border-radius: 18px; border: 1px solid var(--line); isolation: isolate; }
.sp .p-banner__blob { display: none; }
.sp-cover__grid { display: none; }
.sp .p-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(7,7,11,.85)); }

.sp .p-head {
  margin: -84px 28px 0; padding: 0; z-index: 2;
  background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
  grid-template-columns: auto 1fr auto; align-items: end; gap: 26px;
}
.sp .p-avatar {
  width: 136px; height: 136px; border-radius: 32px; overflow: visible; padding: 0; border: 0;
  background: #1B1A2A;
  box-shadow: 0 0 0 4px var(--bg-0);
  font: 800 44px/1 var(--font-display);
}
.sp .p-avatar img { border-radius: 32px; border: 1px solid var(--line-hi); background: #1B1A2A; }
.sp .p-avatar:not(:has(img)) { color: #fff; }
.sp .p-level { right: -8px; bottom: -8px; min-width: 36px; height: 36px; border: 3px solid var(--bg-0); font-family: var(--font-display); }
.sp .p-avatar > .presence__dot { position: absolute; left: -2px; top: -2px; width: 18px; height: 18px; border: 3px solid var(--bg-0); }
.sp .p-ident { padding-bottom: 4px; }
/* смена фото прямо на аватарке */
.p-avatar__edit {
  position: absolute; inset: 7px; z-index: 2; border-radius: 30px; border: 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  color: #fff; font: 700 12.5px/1.2 var(--font-body); letter-spacing: 0;
  background: rgba(7,7,11,.7);
  opacity: 0; transition: opacity .25s;
}
.p-avatar--mine:hover .p-avatar__edit, .p-avatar__edit:focus-visible, .p-avatar--mine.is-busy .p-avatar__edit { opacity: 1; }
.p-avatar__cam { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: rgba(139,123,255,.35); border: 1px solid rgba(196,181,253,.6); }
.p-avatar--mine.is-busy .p-avatar__cam { opacity: .6; }
.p-avatar--mine.is-busy > img { filter: brightness(.7); }
.p-avatar__corner {                     /* на телефоне наведения нет — постоянная кнопка в углу */
  display: none; position: absolute; right: -8px; top: -8px; z-index: 3;
  width: 34px; height: 34px; border-radius: 50%; place-items: center; cursor: pointer;
  color: #fff; background: var(--grad); border: 3px solid var(--bg-0);
}
.p-avatar__corner svg { width: 15px; height: 15px; }
@media (hover: none), (max-width: 760px) {
  .p-avatar__corner { display: grid; }
  .p-avatar__edit { display: none; }
}
.sp .p-name { font: 800 clamp(30px, calc(3.6vw / var(--z, 1)), 46px)/1.05 var(--font-display); letter-spacing: -.045em; margin-bottom: 10px; }
.sp .p-verified { background: rgba(52,211,153,.14); color: var(--ok); border: 1px solid rgba(52,211,153,.4); font-family: var(--font-body); font-size: 12px; letter-spacing: 0; }
.sp .p-name-btn { font-family: var(--font-body); letter-spacing: 0; background: rgba(255,255,255,.07); border: 1px solid var(--line-hi); box-shadow: none; }
.sp .p-name-btn:hover { background: rgba(139,123,255,.2); }
.sp .p-meta { font-size: 13.5px; gap: 16px; }
.sp .p-achs { margin: 14px 0 0; }
.sp .p-ach { padding: 6px 12px; font-size: 12.5px; background: rgba(255,255,255,.05); border-color: var(--line); color: var(--txt); }
.sp .p-ach::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sp .p-ach--gold  { color: #FCD34D; border-color: rgba(252,211,77,.35); background: rgba(252,211,77,.08); }
.sp .p-ach--star  { color: #F9A8D4; border-color: rgba(249,168,212,.35); background: rgba(249,168,212,.08); }
.sp .p-ach--multi { color: #A5B4FC; border-color: rgba(165,180,252,.35); background: rgba(165,180,252,.08); }
.sp .p-ach--fire  { color: #FDBA74; border-color: rgba(253,186,116,.35); background: rgba(253,186,116,.08); }
.sp .p-ach--vet   { color: #6EE7B7; border-color: rgba(110,231,183,.35); background: rgba(110,231,183,.08); }
.sp .p-ach--chat  { color: #93C5FD; border-color: rgba(147,197,253,.35); background: rgba(147,197,253,.08); }
.sp .p-ach--empty { color: var(--txt-3); border-style: dashed; }
.sp .p-ach--empty::before { display: none; }
.sp .p-actions { padding-bottom: 6px; flex-wrap: wrap; }
.sp .p-actions .btn-shimmer, .sp .p-actions .btn-ghost { padding: 13px 22px; font-size: 14.5px; }

.sp-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin: 30px 0 0; }
.sp-stat { padding: 18px; border-radius: 16px; border: 1px solid var(--line); background-color: var(--bg-1); display: flex; flex-direction: column; gap: 6px; }
.sp-stat__val {
  font: 800 28px/1 var(--font-display); letter-spacing: -.04em; font-variant-numeric: tabular-nums;
  color: var(--txt);
}
.sp-stat__lbl { color: var(--txt-2); font-size: 13px; }
.sp-stat .pdp-stars { font-size: 14px; }
.sp-stat--btn {
  position: relative; text-align: left; cursor: pointer; font: inherit; color: inherit;
  transition: border-color .2s, background-color .2s;
}
.sp-stat--btn:hover { border-color: var(--line-hi); background-color: rgba(255,255,255,.04); }
.sp-stat--btn:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.sp-stat__go { position: absolute; right: 16px; top: 16px; color: var(--txt-3); transition: color .2s; }
.sp-stat--btn:hover .sp-stat__go { color: #fff; }
.sp-stat__bar { height: 5px; margin-top: 4px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.sp-stat__bar i { display: block; height: 100%; min-width: 6px; border-radius: inherit; background: #8B7BFF; }
.sp .p-level { cursor: pointer; }

/* ============================================================
   РАСКРАСКИ НИКА (.nick--*) — открываются званиями и ачивками
   ============================================================ */
.nick { display: inline-block; position: relative; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.nick[class*="nick--"] { font-weight: 800; }
/* градиентный текст — общая основа */
.nick--sunset, .nick--ocean, .nick--aurora, .nick--toxic, .nick--gold, .nick--rainbow,
.nick--legend, .nick--star, .nick--volt, .nick--emerald, .nick--fire, .nick--diamond {
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  padding-bottom: .06em;
}
/* обычные — ровный цвет со свечением */
.nick--mint  { color: #6EE7B7; text-shadow: 0 0 14px rgba(110,231,183,.35); }
.nick--sky   { color: #7DD3FC; text-shadow: 0 0 14px rgba(125,211,252,.35); }
.nick--lilac { color: #C4B5FD; text-shadow: 0 0 14px rgba(196,181,253,.4); }
/* Сотрудники Zalut — красный ник по роли (владелец/старший/младший). Не открывается ачивками,
   ставится сервером по is_admin. Отличает официальную команду площадки. */
.nick--staff { color: #FF4D4D; -webkit-text-fill-color: #FF4D4D; text-shadow: 0 0 10px rgba(255,45,45,.55), 0 0 3px rgba(255,90,90,.65); }
/* редкие — двухцветные */
.nick--sunset { background-image: linear-gradient(90deg, #FDBA74, #FB7185 55%, #E879F9); }
.nick--ocean  { background-image: linear-gradient(90deg, #22D3EE, #3B82F6 55%, #818CF8); }
/* эпические — переливаются */
.nick--aurora { background-image: linear-gradient(90deg, #34D399, #22D3EE, #A78BFA, #34D399); background-size: 300% 100%; animation: nk-flow 6s linear infinite; }
.nick--toxic  { background-image: linear-gradient(90deg, #D9F99D, #84CC16, #22C55E, #D9F99D); background-size: 300% 100%; animation: nk-flow 4s linear infinite; filter: drop-shadow(0 0 6px rgba(132,204,22,.55)); }
/* легендарные */
.nick--gold {
  background-image: linear-gradient(100deg, #A16207 0%, #FDE68A 20%, #F59E0B 40%, #FFFBEB 50%, #F59E0B 60%, #FDE68A 80%, #A16207 100%);
  background-size: 250% 100%; animation: nk-flow 3.5s linear infinite; filter: drop-shadow(0 0 8px rgba(245,158,11,.45));
}
.nick--rainbow {
  background-image: linear-gradient(90deg, #F87171, #FBBF24, #A3E635, #22D3EE, #818CF8, #E879F9, #F87171);
  background-size: 200% 100%; animation: nk-flow 7s linear infinite; filter: drop-shadow(0 0 8px rgba(232,121,249,.45));
}
/* мифическая «Голограмма»: перелив + искра */
.nick--legend {
  background-image: linear-gradient(115deg, #fff 0%, #C4B5FD 15%, #67E8F9 30%, #F9A8D4 45%, #FDE68A 60%, #A7F3D0 75%, #fff 90%);
  background-size: 300% 300%; animation: nk-holo 4s ease-in-out infinite;
  filter: drop-shadow(0 0 10px rgba(196,181,253,.7)) drop-shadow(0 0 2px rgba(255,255,255,.6));
  padding-right: .7em;
}
/* мерцающая искра — привилегия единственной мифической раскраски */
.nick--legend::after {
  content: '✦'; position: absolute; right: .05em; top: -.05em; font-size: .6em;
  -webkit-text-fill-color: #FDE68A; color: #FDE68A; animation: nk-twinkle 1.8s ease-in-out infinite;
}
/* За ачивки. Внешний вид подчиняется редкости (src/nickstyles.js):
   rare — статичный градиент, epic — переливается, legendary — блеск и свечение.
   Искры и мерцание — только у мифической «Голограммы» за высшее звание. */
/* rare · «Рейтинг 4.9+» (5 отзывов) — спокойный звёздный градиент, без анимации */
.nick--star { background-image: linear-gradient(90deg, #C7D2FE, #A5B4FC 55%, #E0E7FF); }
/* rare · «Отвечает за 5 минут» — электрический градиент, без мерцания */
.nick--volt { background-image: linear-gradient(90deg, #67E8F9, #A5F3FC 55%, #38BDF8); }
/* epic · «Безупречный» (50 отзывов 4.8+) — неон, мягко пульсирует */
.nick--rose { color: #FF6FB1; text-shadow: 0 0 6px #FF4D9D, 0 0 18px rgba(255,77,157,.7); animation: nk-neon 2.8s ease-in-out infinite; }
/* epic · «Год на Zalut» — переливается, без сильного свечения */
.nick--emerald {
  background-image: linear-gradient(90deg, #059669, #34D399, #A7F3D0, #34D399, #059669);
  background-size: 300% 100%; animation: nk-flow 6s linear infinite;
}
/* legendary · «Оптовик» (500 продаж) — живое пламя */
.nick--fire {
  background-image: linear-gradient(0deg, #DC2626 0%, #F97316 35%, #FACC15 70%, #FEF9C3 100%);
  background-size: 100% 250%; animation: nk-fire 1.4s ease-in-out infinite alternate;
  filter: drop-shadow(0 -2px 6px rgba(249,115,22,.75));
}
/* legendary · «Крупный залог» — ледяной блеск, как у «Золота», без искры */
.nick--diamond {
  background-image: linear-gradient(110deg, #7DD3FC 0%, #E0F2FE 25%, #93C5FD 45%, #FFFFFF 55%, #BAE6FD 70%, #A5B4FC 100%);
  background-size: 250% 100%; animation: nk-flow 3.5s linear infinite;
  filter: drop-shadow(0 0 7px rgba(147,197,253,.6));
}
/* --- новые раскраски (по лестнице редкости) --- */
/* common — ровный цвет со свечением */
.nick--peach { color:#FDBA8C; text-shadow:0 0 14px rgba(253,186,140,.45); }
.nick--frost { color:#BAE6FD; text-shadow:0 0 14px rgba(186,230,253,.45); }
/* rare — статичный градиент */
.nick--amethyst { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(90deg,#C4B5FD,#A855F7 55%,#FF6FB1); }
.nick--lime { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(90deg,#BEF264,#4ADE80 55%,#22D3EE); }
/* epic — переливается */
.nick--magma { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(90deg,#7F1D1D,#DC2626,#F97316,#DC2626,#7F1D1D); background-size:300% 100%; animation:nk-flow 5s linear infinite; filter:drop-shadow(0 0 6px rgba(249,115,22,.5)); }
.nick--tide { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(90deg,#312E81,#4F46E5,#22D3EE,#4F46E5,#312E81); background-size:300% 100%; animation:nk-flow 6.5s linear infinite; filter:drop-shadow(0 0 6px rgba(79,70,229,.5)); }
.nick--plasma { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(90deg,#A855F7,#22D3EE,#FF4D9D,#A855F7); background-size:300% 100%; animation:nk-flow 3.2s linear infinite; filter:drop-shadow(0 0 7px rgba(168,85,247,.55)); }
/* legendary — металлический блеск */
.nick--platinum { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(100deg,#64748B 0%,#E2E8F0 25%,#94A3B8 45%,#FFFFFF 55%,#CBD5E1 70%,#64748B 100%); background-size:250% 100%; animation:nk-flow 3.5s linear infinite; filter:drop-shadow(0 0 8px rgba(226,232,240,.5)); }
.nick--rosegold { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(100deg,#9D5C63 0%,#F9C6C9 22%,#E8A0A6 42%,#FFF1F2 52%,#F4B4BB 68%,#9D5C63 100%); background-size:250% 100%; animation:nk-flow 3.8s linear infinite; filter:drop-shadow(0 0 8px rgba(244,180,187,.5)); }
/* mythic — голограмма с искрой */
.nick--prism { -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; padding-bottom:.06em; background-image:linear-gradient(135deg,#fff,#FDA4AF,#FDE68A,#86EFAC,#67E8F9,#C4B5FD,#fff); background-size:350% 350%; animation:nk-holo 3.5s ease-in-out infinite; filter:drop-shadow(0 0 10px rgba(196,181,253,.6)) drop-shadow(0 0 3px rgba(255,255,255,.7)); padding-right:.7em; }
.nick--prism::after { content:'❖'; position:absolute; right:.05em; top:-.02em; font-size:.55em; -webkit-text-fill-color:#fff; color:#fff; animation:nk-twinkle 1.6s ease-in-out infinite; }
@keyframes nk-flow { to { background-position: -300% 0; } }
@keyframes nk-holo { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes nk-neon { 0%, 100% { text-shadow: 0 0 6px #FF4D9D, 0 0 18px rgba(255,77,157,.7); } 50% { text-shadow: 0 0 3px #FF4D9D, 0 0 8px rgba(255,77,157,.4); } }
@keyframes nk-twinkle { 0%, 100% { opacity: .3; transform: scale(.7) rotate(0); } 50% { opacity: 1; transform: scale(1.15) rotate(20deg); } }
@keyframes nk-fire { from { background-position: 0 0; } to { background-position: 0 100%; } }
@media (prefers-reduced-motion: reduce) { .nick, .nick::after { animation: none !important; } }

/* награды в окне званий */
.lv-rewards { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.lv-ladder__body .lv-rewards { grid-column: auto; }
.lv-rewards__lbl { color: var(--txt-3); font-size: max(11.5px, calc(9px / var(--z, 1))); font-weight: 700; }
.lv-reward {
  display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 10px; border-radius: 999px; max-width: 100%;
  background: rgba(255,255,255,.04); border: 1px solid var(--line); font-size: 13px;
}
.lv-reward small { color: var(--txt-3); font-size: max(11px, calc(9px / var(--z, 1))); }
.lv-reward--epic { border-color: rgba(167,139,250,.4); }
.lv-reward--legendary { border-color: rgba(251,191,36,.45); }
.lv-reward--mythic { border-color: rgba(103,232,249,.5); box-shadow: 0 0 14px rgba(103,232,249,.2); }

/* выбор раскраски — окно в своём профиле */
.lv-modal--wide { width: min(880px, 100%); }
.sp-nick-btn__dot {
  width: 14px; height: 14px; border-radius: 50%; flex: none;
  background: conic-gradient(#F87171, #FBBF24, #A3E635, #22D3EE, #818CF8, #E879F9, #F87171);
}
.nk-hint { margin: 14px 0 0; color: var(--txt-2); font-size: 14px; line-height: 1.55; }
.nk-preview {
  display: flex; justify-content: center;
  padding: 18px 26px; border-radius: 20px; font: 800 clamp(24px, calc(3vw / var(--z, 1)), 34px)/1.1 var(--font-display); letter-spacing: -.03em;
  background: rgba(255,255,255,.03); border: 1px solid var(--line-hi);
  max-width: 100%; overflow: hidden;
}
.nk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-top: 18px; }
.nk-opt {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0;
  padding: 14px; border-radius: 16px; text-align: left; cursor: pointer; font: inherit; color: var(--txt);
  background: rgba(255,255,255,.03); border: 1px solid var(--line);
  transition: border-color .2s, background .2s;
}
.nk-opt:hover:not(:disabled) { border-color: var(--line-hi); background: rgba(255,255,255,.05); }
.nk-opt.is-on { border-color: #A78BFA; background: rgba(139,123,255,.12); box-shadow: 0 0 0 1px #A78BFA; }
.nk-opt.is-on::after { content: '✓'; position: absolute; right: 12px; top: 10px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: #8B7BFF; color: #fff; }
.nk-opt__prev { font-size: 17px; font-weight: 700; max-width: 100%; }
.nk-opt__name { font-size: 13px; font-weight: 700; color: var(--txt-2); }
.nk-opt__meta { font-size: max(11.5px, calc(9px / var(--z, 1))); color: var(--txt-3); }
.nk-opt--rare .nk-opt__meta { color: #7DD3FC; }
.nk-opt--epic .nk-opt__meta { color: #C4B5FD; }
.nk-opt--legendary .nk-opt__meta { color: #FCD34D; }
.nk-opt--mythic .nk-opt__meta { color: #67E8F9; }
.nk-opt--legendary:not(.is-locked) { border-color: rgba(251,191,36,.3); }
.nk-opt--mythic:not(.is-locked) { border-color: rgba(103,232,249,.35); }
.nk-opt.is-locked { cursor: not-allowed; }
/* закрытые — в настоящем цвете, как в окне званий; закрытость видно по замку */
.nk-opt.is-locked .nk-opt__meta { color: var(--txt-3); }
.nk-msg { margin: 10px 0 0; font-size: 13px; color: var(--txt-2); }
.nk-msg:empty { display: none; }
.nk-msg.is-err { color: var(--err); }

/* Окно «Звания и ачивки» */
.lv-overlay {
  position: fixed; inset: 0; z-index: 950; display: flex; justify-content: center; align-items: flex-start;
  padding: calc(6vh / var(--z, 1)) 16px; overflow-y: auto;
  background: rgba(4,4,8,.72);
  opacity: 0; transition: opacity .2s;
}
.lv-overlay.is-open { opacity: 1; }
.lv-modal {
  position: relative; width: min(680px, 100%); padding: 28px; border-radius: 20px;
  background: #14141C; border: 1px solid var(--line-hi);
  box-shadow: 0 24px 60px -24px rgba(0,0,0,1);
  transform: translateY(8px); transition: transform .22s var(--ease-out);
}
.lv-overlay.is-open .lv-modal { transform: none; }
.lv-modal__x {
  position: absolute; right: 16px; top: 16px; width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--line-hi); background: rgba(255,255,255,.04); color: var(--txt); font-size: 22px; line-height: 1; cursor: pointer;
}
.lv-modal__x:hover { background: rgba(255,255,255,.1); }
.lv-modal__title { margin: 0 0 18px; padding-right: 40px; font: 800 clamp(24px, calc(3vw / var(--z, 1)), 32px)/1.1 var(--font-display); letter-spacing: -.04em; }
.lv-modal__h { display: flex; align-items: baseline; gap: 10px; margin: 26px 0 12px; font: 700 17px/1.2 var(--font-display); letter-spacing: -.03em; }
.lv-modal__h span { color: var(--txt-3); font: 600 13px/1 var(--font-body); letter-spacing: 0; }
.lv-now { padding: 18px; border-radius: 14px; background: rgba(139,123,255,.08); border: 1px solid rgba(167,139,250,.25); }
.lv-now__row { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 14px; color: var(--txt-2); }
.lv-now__row b { color: #fff; }
.lv-now__bar { height: 8px; margin: 12px 0 14px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.lv-now__bar i { display: block; height: 100%; min-width: 8px; border-radius: inherit; background: #8B7BFF; }
.lv-now p { margin: 0; color: var(--txt-2); font-size: 13.5px; line-height: 1.55; }
.lv-now p b { color: var(--txt); }
.lv-ladder { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; position: relative; }
.lv-ladder li { position: relative; display: flex; gap: 14px; padding-bottom: 16px; }
.lv-ladder li:not(:last-child)::before {   /* вертикальная линия между ступенями */
  content: ''; position: absolute; left: 16px; top: 34px; bottom: 0; width: 2px; background: rgba(255,255,255,.08);
}
.lv-ladder li.is-done::before { background: #8B7BFF; }
.lv-ladder__n {
  position: relative; z-index: 1; flex: none; width: 34px; height: 34px; border-radius: 11px;
  display: grid; place-items: center; font: 800 14px/1 var(--font-display);
  background: #15122a; border: 1px solid rgba(255,255,255,.14); color: var(--txt-3);
}
.lv-ladder li.is-done .lv-ladder__n { background: var(--grad); border-color: transparent; color: #fff; }
.lv-ladder li.is-now .lv-ladder__n { border-color: #A78BFA; color: #fff; box-shadow: 0 0 0 4px rgba(139,123,255,.18); }
.lv-ladder__body { padding-top: 5px; min-width: 0; }
.lv-ladder__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.lv-ladder__head b { font-size: 15.5px; }
.lv-ladder__head span { color: var(--txt-3); font-size: 13px; }
.lv-ladder__head em { font-style: normal; font-size: max(11px, calc(9px / var(--z, 1))); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; background: rgba(139,123,255,.25); color: #C4B5FD; }
.lv-ladder__body p { margin: 4px 0 0; color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.lv-ladder li:not(.is-done):not(.is-now) b { color: var(--txt-2); }
.lv-achs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.lv-ach {
  display: grid; grid-template-columns: 22px 1fr; column-gap: 10px; align-items: center;
  padding: 10px 12px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,.025);
  color: var(--txt-3); opacity: .75;
}
.lv-ach b { color: var(--txt-2); font-size: 13.5px; }
.lv-ach > b + span { grid-column: 2; font-size: 12px; line-height: 1.4; }
.lv-ach__mark { grid-row: span 2; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; border: 1px dashed rgba(255,255,255,.2); }
.lv-ach.is-got { opacity: 1; border-color: currentColor; background: rgba(255,255,255,.04); }
.lv-ach.is-got b { color: currentColor; }
.lv-ach.is-got .lv-ach__mark { border: 1.5px solid currentColor; background: color-mix(in srgb, currentColor 18%, transparent); }
.lv-ach.p-ach--gold  { color: #FCD34D; } .lv-ach.p-ach--star { color: #F9A8D4; } .lv-ach.p-ach--multi { color: #A5B4FC; }
.lv-ach.p-ach--fire  { color: #FDBA74; } .lv-ach.p-ach--vet  { color: #6EE7B7; } .lv-ach.p-ach--chat  { color: #93C5FD; }
.lv-ach:not(.is-got) { color: var(--txt-3); }
.lv-modal__cta { width: 100%; justify-content: center; margin-top: 22px; }
@media (max-width: 600px) {
  .lv-modal { padding: 24px 18px; border-radius: 18px; }
  .lv-achs { grid-template-columns: 1fr; }
}

.sp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; margin-top: 26px; align-items: start; }
.sp-main { min-width: 0; display: grid; gap: 30px; }
.sp-side { position: sticky; top: 96px; display: grid; gap: 14px; }
.sp .p-section, .sp .p-bio, .sp .p-deposit { margin: 0; }
.sp .p-section { padding: 0; background: none; border: 0; box-shadow: none; }
.sp .p-section__head { align-items: center; }
.sp .p-section__title { font: 700 22px/1.2 var(--font-display); letter-spacing: -.035em; }
.sp .p-section__count { padding: 5px 11px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); font-weight: 600; }
.sp .p-section .lots-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.sp .p-bio {
  position: relative; padding: 22px 24px 22px 56px; border-radius: 16px; font-style: normal; font-size: 16px; line-height: 1.6;
  background: var(--bg-1); border: 1px solid var(--line);
}
.sp .p-bio::before { position: absolute; left: 20px; top: 12px; margin: 0; font: 800 44px/1 var(--font-display); color: #A78BFA; }
.sp .p-bio::after { content: none; }
.sp .p-card { padding: 20px; border-radius: 16px; background: var(--bg-1); }
.sp .p-card h3 { color: var(--txt); font: 700 15.5px/1.2 var(--font-display); letter-spacing: -.02em; }
.sp .p-spec__chip { background: rgba(255,255,255,.05); border: 1px solid var(--line); padding: 5px 12px 5px 5px; }
.sp .p-spec__chip:hover { background: rgba(139,123,255,.16); border-color: rgba(139,123,255,.4); }
.sp .p-spec__ico { background: var(--grad); }
.sp .p-rating-row__bar { background: rgba(255,255,255,.07); }
.sp .p-rating-row__fill { background: #FBBF24; }
.sp .p-deposit {
  flex-direction: column; align-items: flex-start; padding: 20px; border-radius: 16px;
  background: rgba(52,211,153,.07); border: 1px solid rgba(52,211,153,.3);
}
.sp .p-deposit__ico { width: 44px; height: 44px; border-radius: 14px; background: rgba(52,211,153,.18); border-color: rgba(52,211,153,.4); color: var(--ok); font-family: var(--font-display); }
.sp .p-deposit__val { color: var(--ok); font: 800 26px/1.1 var(--font-display); letter-spacing: -.04em; }
.sp .p-deposit__lbl { display: block; margin: 6px 0 0; font-family: var(--font-body); letter-spacing: .1em; }
.sp .p-deposit--withdraw { background: rgba(251,191,36,.07); border-color: rgba(251,191,36,.3); }
.sp .p-deposit--withdraw .p-deposit__ico { background: rgba(251,191,36,.16); border-color: rgba(251,191,36,.4); }
.sp .p-deposit--empty { background: rgba(255,255,255,.03); border: 1px dashed rgba(255,255,255,.14); }
.sp .p-deposit--empty .p-deposit__ico { background: rgba(255,255,255,.05); border-color: var(--line); color: var(--txt-3); }
.sp .p-deposit--empty .p-deposit__val { color: var(--txt-2); }
.sp .p-deposit__more { display: inline-flex; align-items: center; margin-top: 8px; font-size: 12.5px; font-weight: 700;
  text-decoration: none; color: #6EE7B7; transition: color .2s; width: max-content; }
.sp .p-deposit__more:hover { color: #fff; }

/* Управление залогом в боковой колонке профиля.
   Базовые правила писались под строку: там .p-deposit__manage занимал
   отдельный ряд через flex-wrap + flex-basis:100%. Здесь карточка —
   колонка, и в ней flex-basis задаёт высоту: панель просила всю высоту
   карточки, не влезала и сворачивалась во второй столбец за её границу.
   В колонке переносить нечего, ширину задаём явно. */
.sp .p-deposit { flex-wrap: nowrap; }
.sp .p-deposit__manage { flex: 0 0 auto; width: 100%; min-width: 0; }
.sp .p-deposit__panel,
.sp .p-deposit__form { max-width: 100%; }
.sp .p-deposit__input { min-width: 0; }

/* Панель залога сворачивается кнопкой через атрибут hidden, но собственный
   display:flex перебивал браузерное [hidden]{display:none} — панель висела
   раскрытой всегда, а кнопка «Внести залог» щёлкала впустую. */
.p-deposit__panel[hidden] { display: none; }
.sp-report { padding-left: 6px; }

@media (max-width: 1100px) {
  .sp-stats { grid-template-columns: repeat(3, 1fr); }
  .sp-layout { grid-template-columns: 1fr; }
  .sp-side { position: static; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
}
@media (max-width: 760px) {
  .sp .p-banner { height: 150px; border-radius: 16px; }
  .sp .p-head { margin: -60px 14px 0; grid-template-columns: auto 1fr; gap: 16px; }
  .sp .p-avatar { width: 96px; height: 96px; border-radius: 24px; font-size: 30px; }
  .sp .p-avatar img { border-radius: 24px; }
  .sp .p-ident { grid-column: 1 / -1; }
  .sp .p-actions { grid-column: 1 / -1; }
  .sp .p-actions > * { flex: 1; justify-content: center; }
  .sp-stats { grid-template-columns: repeat(2, 1fr); }
  .sp-stat:last-child { grid-column: 1 / -1; }
  .sp .p-section .lots-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================================
   СДЕЛКА (od-*) и ЧАТ
   ============================================================ */
.order-layout { gap: 18px !important; align-items: start; }
.od {
  position: sticky; top: 96px; padding: 24px !important; border-radius: 18px !important;
  background: var(--bg-1) !important; border: 1px solid var(--line-hi) !important;
}
.od__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.od__id { color: var(--txt-3); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.od__lot { display: block; color: var(--txt); text-decoration: none; font: 700 20px/1.25 var(--font-display); letter-spacing: -.03em; }
.od__lot:hover { color: #C4B5FD; }
.od__game { margin-top: 6px; color: var(--txt-3); font-size: 13.5px; }
.od__price {
  margin: 16px 0 4px; font: 800 34px/1 var(--font-display); letter-spacing: -.05em; font-variant-numeric: tabular-nums;
  color: #fff;
}
.od-steps { list-style: none; margin: 18px 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
.od-steps::before { content: ''; position: absolute; left: 12.5%; right: 12.5%; top: 14px; height: 2px; background: rgba(255,255,255,.1); }
.od-steps li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: max(11.5px, calc(9px / var(--z, 1))); font-weight: 600; color: var(--txt-3); text-align: center; }
.od-steps li:not(:first-child)::before {           /* закрашенный отрезок до пройденного шага */
  content: ''; position: absolute; right: 50%; width: 100%; top: 14px; height: 2px; background: transparent;
}
.od-steps li.is-done:not(:first-child)::before, .od-steps li.is-now:not(:first-child)::before { background: #8B7BFF; }
.od-steps__dot {
  position: relative; z-index: 1; width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center; font: 800 12.5px/1 var(--font-display);
  background: #15122a; border: 1.5px solid rgba(255,255,255,.14); color: var(--txt-3);
}
.od-steps li.is-done { color: var(--txt-2); }
.od-steps li.is-done .od-steps__dot { background: var(--grad); border-color: transparent; color: #fff; }
.od-steps li.is-now { color: #fff; }
.od-steps li.is-now .od-steps__dot { border-color: #A78BFA; color: #fff; box-shadow: 0 0 0 4px rgba(139,123,255,.18); }
.od-steps.is-dispute li.is-now .od-steps__dot { border-color: var(--err); box-shadow: 0 0 0 4px rgba(251,113,133,.18); }
.od__who {
  display: flex; align-items: center; gap: 12px; margin: 4px 0 16px; padding: 12px; border-radius: 16px;
  text-decoration: none; color: var(--txt); background: rgba(255,255,255,.04); border: 1px solid var(--line);
  transition: border-color .25s;
}
.od__who:hover { border-color: var(--line-hi); }
.od__who small { display: block; color: var(--txt-3); font-size: max(11.5px, calc(9px / var(--z, 1))); }
.od__ava { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; background: var(--grad); color: #fff; }
.od__go { margin-left: auto; color: var(--txt-3); }
.od-cta { width: 100%; margin-top: 4px; padding: 16px 20px; font-size: 15.5px; }
.od-cta--ok { background: #059669; }
.od-sec {
  width: 100%; margin-top: 8px; padding: 12px 16px; border-radius: 999px; cursor: pointer;
  font: 700 14px/1 var(--font-body); background: transparent; transition: background .2s;
}
.od-sec--warn { color: var(--warn); border: 1px solid rgba(251,191,36,.45); }
.od-sec--warn:hover { background: rgba(251,191,36,.1); }
.od-sec--err { color: var(--err); border: 1px solid rgba(251,113,133,.45); }
.od-sec--err:hover { background: rgba(251,113,133,.1); }
a.od-sec { display: block; text-align: center; text-decoration: none; line-height: 1.3; }
/* дело в арбитраже по этой сделке */
.od-claim {
  display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 12px 14px; border-radius: 16px;
  text-decoration: none; color: var(--txt); background: rgba(255,255,255,.04); border: 1px solid var(--line);
  transition: border-color .25s;
}
.od-claim[data-open] { background: rgba(192,132,252,.08); border-color: rgba(192,132,252,.35); }
.od-claim:hover { border-color: rgba(192,132,252,.6); }
.od-claim small { display: block; color: var(--txt-2); font-size: 12.5px; margin-top: 2px; }
.od-claim__ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; flex: none; font-size: 18px; background: rgba(192,132,252,.16); color: #C084FC; }
.od-note { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; font-size: 13px; line-height: 1.5; }
.od-note--warn { color: #FCD34D; background: rgba(251,191,36,.08); border: 1px solid rgba(251,191,36,.25); }
.od-note--ok { color: #6EE7B7; background: rgba(52,211,153,.08); border: 1px solid rgba(52,211,153,.25); }
.od-review { margin-top: 18px; }
.od-review h2 { font-family: var(--font-display) !important; letter-spacing: -.03em; }
.od-review__text { width: 100%; min-height: 90px; margin-top: 12px; padding: 12px 14px; border-radius: 14px; font: inherit; }
.od-review .od-cta { width: auto; margin-top: 12px; }
/* пояснение про скрытые контакты в отзыве (анализ отзывов, src/reviewcheck.js) */
.od-review__note { margin: 8px 0 0; color: var(--txt-3); font-size: 12.5px; line-height: 1.5; }

.chat {
  border-radius: 18px !important; border: 1px solid var(--line) !important; overflow: hidden;
  background: var(--bg-1) !important;
}
.chat__compose { background: var(--bg-1) !important; border-top: 1px solid var(--line) !important; }
.chat__compose input { border-radius: 999px !important; }
.chat__locked { text-align: center; }
@media (max-width: 900px) { .od { position: static; } }

/* ============================================================
   ДАШБОРД (dash-*)
   ============================================================ */
.dash-alerts { display: grid; gap: 8px; margin-bottom: 16px; }
.dash-alert {
  display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 16px;
  color: #FCD34D; text-decoration: none; font-weight: 600; font-size: 14.5px;
  background: rgba(251,191,36,.08); border: 1px solid rgba(251,191,36,.35);
  transition: border-color .2s;
}
.dash-alert:hover { border-color: rgba(251,191,36,.7); }
.dash-alert b { margin-left: auto; font-size: 13px; }
.dash-alert__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--warn); flex: none; }
.dash-grid { gap: 14px !important; }
.dash-tile {
  position: relative; overflow: hidden; padding: 22px !important; border-radius: 16px !important;
  border: 1px solid var(--line) !important; background-color: var(--bg-1) !important;
  display: flex; flex-direction: column; gap: 6px;
}
.dash-tile__ico {
  width: 40px; height: 40px; margin-bottom: 8px; border-radius: 13px; display: grid; place-items: center;
  color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); border: 1px solid color-mix(in srgb, var(--c) 35%, transparent);
}
.dash-tile__val {
  order: 1; font: 800 clamp(26px, calc(2.6vw / var(--z, 1)), 34px)/1 var(--font-display) !important; letter-spacing: -.045em; font-variant-numeric: tabular-nums;
  color: #fff !important;
}
.dash-tile__lbl { order: 2; text-transform: none !important; letter-spacing: 0 !important; font-size: 13.5px !important; color: var(--txt-2) !important; }
.dash-panel { border-radius: 18px !important; padding: 24px !important; background: var(--bg-1) !important; }
.dash-panel { position: relative; }
.dash-panel h2 { font-family: var(--font-display); letter-spacing: -.035em; }
.dash-chart__empty {
  position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); margin: 0;
  padding: 10px 18px; border-radius: 999px; white-space: nowrap; max-width: calc(100% - 40px); overflow: hidden; text-overflow: ellipsis;
  color: var(--txt-2); font-size: 13.5px; background: rgba(10,9,18,.8); border: 1px solid var(--line);
}
.dash-chart__bar {
  border-radius: 4px 4px 1px 1px !important;
  background: #8B7BFF !important;
}
.top-lot { border-radius: 14px; padding: 12px 14px !important; transition: background .2s; }
.top-lot:hover { background: rgba(255,255,255,.05); }
.promo-row { border-radius: 16px !important; background: rgba(255,255,255,.03) !important; border: 1px dashed rgba(167,139,250,.35) !important; }
.promo-row__code { font-family: 'Source Code Pro', monospace; letter-spacing: .08em; color: #C4B5FD; }
.dash-promo__btn { padding: 13px 22px; font-size: 14.5px; }

/* ============================================================
   БАЛАНС: карта Zalut
   ============================================================ */
.bal-shell { max-width: 980px !important; }
.bal-shell .bal-hero {
  display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center;
  padding: 30px 34px; border-radius: 18px; border: 1px solid var(--line); overflow: visible;
}
.bal-shell .bal-hero__lbl { font-weight: 600; color: var(--txt-2); }
.bal-shell .bal-hero__val { font: 800 clamp(44px, calc(6vw / var(--z, 1)), 68px)/1 var(--font-display); letter-spacing: -.055em; margin-top: 10px; font-variant-numeric: tabular-nums; }
.bal-hero__dep { margin-top: 10px; color: rgba(255,255,255,.55); font-size: 13.5px; }

.bal-panel { border-radius: 16px !important; }
@media (max-width: 600px) { .bal-shell .pm-grid { grid-template-columns: 1fr; } }
@media (max-width: 820px) {
  .bal-shell .bal-hero { grid-template-columns: 1fr; padding: 26px 22px; }
}
/* с нашим рисунком (.art-head, кошелёк выходит за верх справа): справа место под него, на телефоне — сверху */
.bal-shell .bal-hero.ax { grid-template-columns: 1fr; padding: 34px 300px 34px 36px; border-radius: 26px; }
@media (max-width: 760px) {
  .bal-shell .bal-hero.ax { padding: 100px 20px 22px; }
}

/* ============================================================
   МАСТЕР НОВОГО ЛОТА, ВХОД
   ============================================================ */
.wiz { position: relative; border-radius: 20px !important; }
.wiz__pip { position: relative; overflow: hidden; }
.wiz__title { font-family: var(--font-display) !important; letter-spacing: -.04em !important; }
.wiz-tile { position: relative; overflow: hidden; transition: border-color .2s, background .2s !important; }
.wiz-tile:hover { border-color: var(--line-hi) !important; }
.wiz-tile.is-active { border-color: #A78BFA !important; box-shadow: 0 0 0 1px #A78BFA !important; background: rgba(139,123,255,.1) !important; }
.wiz-tile__ico--cover { background-size: cover; background-position: center; }
.wiz-tile__ico--art { color: #fff !important; background: hsl(var(--hue) 45% 36%) !important; overflow: hidden; }
.wiz-tile__ico--art img { width: 100%; height: 100%; object-fit: cover; }

/* Мои лоты: превью */
.ml-thumb {
  width: 56px; height: 56px; border-radius: 14px; overflow: hidden; flex: none;
  display: grid; place-items: center; color: #fff; font: 800 15px/1 var(--font-display);
  background: hsl(var(--hue) 45% 36%) center / cover;
}
.ml-thumb[style*="background-image"] { background-size: cover; }
.ml-thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Мои лоты: строка — превью, название, цена и статус, кнопки */
.ml-row {
  display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; gap: 14px; align-items: center;
  padding: 14px; background: var(--glass); border: 1px solid var(--line); border-radius: 14px;
}
.ml-main { min-width: 0; }
.ml-title { display: block; font-weight: 700; color: var(--txt); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ml-title:hover { text-decoration: underline; text-underline-offset: 3px; }
.ml-meta { margin-top: 4px; color: var(--txt-2); font-size: 13px; }
.ml-offers { margin-left: 10px; color: var(--acc); font-weight: 600; }
.ml-side { display: grid; justify-items: end; gap: 6px; text-align: right; }
.ml-price { font-weight: 800; white-space: nowrap; }
.ml-ctl { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ml-more { display: none; }
.ml-panel { grid-column: 1 / -1; margin-top: 4px; }

/* Документы: прогресс чтения и активный пункт оглавления */
.read-progress {
  position: fixed; left: 0; right: 0; top: 0; z-index: 300; height: 2px;
  background: #8B7BFF;
  transform-origin: left; transform: scaleX(0); pointer-events: none;
}
.legal-toc a { position: relative; transition: color .2s; }
.legal-toc a.is-current { color: #fff !important; padding-left: 10px; }
.legal-toc a.is-current::before { content: ''; position: absolute; left: 0; top: 15%; bottom: 15%; width: 2px; border-radius: 2px; background: #A78BFA; }
.legal-doc h2 { scroll-margin-top: 100px; }

.auth2-card { position: relative; }

/* ============================================================
   Настройки — раскладка по категориям
   Слева вертикальное меню разделов, справа карточки выбранного.
   На узких экранах меню превращается в ленту чипов под шапкой.
   ============================================================ */

.set-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

/* ---------- Меню разделов ---------- */

.set-nav {
  position: sticky;
  top: 88px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px;
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}

.set-nav__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--txt-2);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background .18s, color .18s;
}
.set-nav__item:hover { background: var(--glass-hi); color: var(--txt); }
.set-nav__item:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }

.set-nav__item[aria-selected="true"] {
  background: var(--grad-soft);
  color: var(--txt);
  font-weight: 600;
}
/* Полоска акцента у активного раздела */
.set-nav__item[aria-selected="true"]::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  translate: -1px -50%;
  width: 3px;
  height: 20px;
  border-radius: 3px;
  background: var(--grad);
}

.set-nav__ico {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  color: currentColor;
}
.set-nav__ico svg { display: block; width: 100%; height: 100%; }
.set-nav__label { flex: 1 1 auto; }

/* Точка «есть что донастроить» */
.set-nav__dot {
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--warn);
}

/* ---------- Область раздела ---------- */

.set-pane { min-width: 0; }

.set-sec[hidden] { display: none; }
.set-sec__head { margin: 0 2px 16px; }
.set-sec__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.025em;
}
.set-sec__hint {
  margin: 6px 0 0;
  max-width: 62ch;
  color: var(--txt-2);
  font-size: 13.5px;
  line-height: 1.55;
}

/* Появление раздела при переключении */
.set-sec__body { animation: setFade .26s var(--ease-out) both; }
@keyframes setFade {
  from { opacity: 0; translate: 0 6px; }
  to   { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .set-sec__body { animation: none; }
}

/* ---------- Узкие экраны ---------- */

@media (max-width: 900px) {
  .set-layout { grid-template-columns: 1fr; gap: 18px; }

  .set-nav {
    position: sticky;
    top: 64px;
    z-index: 5;
    flex-direction: row;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 7px;
    border-radius: var(--r);
    background: var(--bg-1);
  }
  .set-nav::-webkit-scrollbar { display: none; }

  .set-nav__item {
    width: auto;
    flex: 0 0 auto;
    padding: 9px 13px;
    white-space: nowrap;
  }
  .set-nav__item[aria-selected="true"]::before { display: none; }

  .set-sec__title { font-size: 19px; }
}

/* Карточка без подзаголовка: отступ до содержимого даёт заголовок */
.set-card__title + .set-links,
.set-card__title + .set-row,
.set-card__title + .set-ways { margin-top: 18px; }

/* ============================================================
   Свой баннер профиля
   ============================================================ */

/* Загруженная картинка ложится поверх градиента; блобы под ней не нужны. Кадр задаёт владелец профиля
   (banner.js editFit): --bx/--by — видимая точка, --bz — масштаб вокруг неё, --bd — затемнение */
.p-banner__img {
  position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: var(--bx, 50%) var(--by, 50%);
  transform: scale(var(--bz, 1)); transform-origin: var(--bx, 50%) var(--by, 50%);
  filter: brightness(calc(1 - var(--bd, 0)));
  pointer-events: none; user-select: none; -webkit-user-drag: none;
}
.sp .p-banner--img .p-banner__blobs { display: none; }
.sp .p-banner--img .sp-cover__grid { display: none; }
/* Затемнение снизу уже есть в ::after — под фото усиливаем,
   иначе ник и кнопки теряются на светлой картинке */
.sp .p-banner--img::after {
  background: linear-gradient(180deg, rgba(7,7,11,.30) 0%, rgba(7,7,11,.10) 38%, rgba(7,7,11,.88) 100%);
}

/* ---------- Кнопки поверх баннера (только свой профиль) ---------- */

.p-banner__tools {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 14px;
  display: flex;
  gap: 8px;
}

.p-banner__act {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(10, 10, 16, .78);
  color: var(--txt);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background .2s, border-color .2s, opacity .2s;
}
.p-banner__act:hover { background: rgba(20, 20, 30, .9); border-color: var(--acc); }
.p-banner__act:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.p-banner__act:disabled { opacity: .6; cursor: default; }

.p-banner__act-ico { display: flex; flex: 0 0 auto; }

.p-banner__act--drop { padding: 9px 11px; color: var(--txt-2); }
.p-banner__act--drop:hover { border-color: var(--err); color: var(--err); background: rgba(251, 113, 133, .16); }
.p-banner__act--drop[hidden] { display: none; }

/* Пока файл летит на сервер — картинка приглушена, кнопки заблокированы */
.sp .p-banner.is-busy { opacity: .72; }

/* ---------- Настройка вида баннера (banner.js editFit) ---------- */
.sp .p-banner.is-editing { cursor: grab; touch-action: none; outline: 2px dashed var(--acc); outline-offset: 3px; }
.sp .p-banner.is-dragging { cursor: grabbing; }
.sp .p-banner.is-editing .p-banner__tools { display: none; }
/* ник и кнопки над нижней частью баннера не мешают тянуть картинку */
.sp:has(.p-banner.is-editing) .p-head { pointer-events: none; }
.p-fit {
  position: fixed; z-index: 90; left: 50%; bottom: 20px; translate: -50% 0; width: min(560px, calc(100vw - 24px));
  display: grid; gap: 12px; padding: 16px 18px; border-radius: 18px;
  background: var(--bg-1); border: 1px solid var(--line-hi, rgba(255,255,255,.18)); box-shadow: 0 18px 50px rgba(0,0,0,.55);
}
.p-fit__hint { margin: 0; color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.p-fit__hint b { color: #fff; }
.p-fit__row { display: grid; grid-template-columns: 110px 1fr; align-items: center; gap: 12px; font-size: 14px; font-weight: 600; }
.p-fit__row input[type="range"] { width: 100%; accent-color: var(--acc); cursor: pointer; }
.p-fit__btns { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.p-fit__btn { padding: 10px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--bg-2, rgba(255,255,255,.06)); color: var(--txt); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.p-fit__btn:hover { border-color: var(--acc); }
.p-fit__btn--ghost { margin-right: auto; background: none; }
.p-fit__save { padding: 10px 20px; font-size: 14px; }
@media (max-width: 760px) {
  /* над нижней панелью телефона */
  .p-fit { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); padding: 14px; gap: 10px; }
  .p-fit__row { grid-template-columns: 92px 1fr; }
}

@media (max-width: 720px) {
  .p-banner__tools { top: 10px; right: 10px; gap: 6px; }
  .p-banner__act { padding: 8px 11px; font-size: 12px; }
  /* На узком экране подпись лишняя — остаётся иконка */
  .p-banner__act-txt { display: none; }
  .p-banner__act--drop { padding: 8px 10px; }
}

/* ================================================================
   Профиль продавца: вкладки «Лоты / Отзывы» и лента отзывов
   (заменили карусель-модалку, которая показывала по одному отзыву)
   ================================================================ */
.sp-tabs {
  display: inline-flex; gap: 4px; padding: 4px; margin-bottom: -10px; justify-self: start;
  border-radius: 999px; background: rgba(255,255,255,.04); border: 1px solid var(--line);
  scroll-margin-top: 96px;
}
.sp-tab {
  display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border: 0; border-radius: 999px;
  background: none; color: var(--txt-2); font: 700 14px/1 var(--font-display); letter-spacing: -.02em;
  cursor: pointer; transition: color .2s, background .25s var(--spring);
}
.sp-tab:hover { color: var(--txt); }
.sp-tab.is-active { color: #fff; background: var(--grad); }
.sp-tab:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.sp-tab__n {
  min-width: 22px; padding: 3px 7px; border-radius: 999px; font: 700 max(11.5px, calc(9px / var(--z, 1)))/1 var(--font-body);
  background: rgba(255,255,255,.08); text-align: center;
}
.sp-tab.is-active .sp-tab__n { background: rgba(255,255,255,.22); }
.sp .p-section[hidden] { display: none; }

.rv { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.rv.is-loading .rv-list { opacity: .45; pointer-events: none; transition: opacity .2s; }

/* сводка */
.rv-summary {
  display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 28px; align-items: center;
  padding: 22px 24px; border-radius: 16px; border: 1px solid var(--line);
  background: var(--bg-1);
}
.rv-summary__score { display: grid; justify-items: start; gap: 6px; }
.rv-summary__avg { font: 800 52px/1 var(--font-display); letter-spacing: -.05em; color: var(--txt); }
.rv-summary__cnt { color: var(--txt-2); font-size: 13px; }
.rv-summary__bars { display: grid; gap: 4px; }
.rv-bar {
  display: grid; grid-template-columns: 34px minmax(0, 1fr) 42px; align-items: center; gap: 12px;
  padding: 5px 8px; border: 1px solid transparent; border-radius: 10px; background: none;
  color: var(--txt-2); font: 600 13px/1 var(--font-body); cursor: pointer; text-align: left;
  transition: background .2s, border-color .2s;
}
.rv-bar:hover { background: rgba(255,255,255,.05); color: var(--txt); }
.rv-bar.is-active { background: rgba(251,191,36,.1); border-color: rgba(251,191,36,.35); color: var(--txt); }
.rv-bar__k i { margin-left: 3px; font-style: normal; color: var(--warn); }
.rv-bar__track { height: 8px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; }
.rv-bar__fill { display: block; height: 100%; border-radius: inherit; background: #FBBF24; }
.rv-bar__n { text-align: right; font-variant-numeric: tabular-nums; }

/* звёзды */
.rv-stars { display: inline-flex; gap: 1px; font-size: 14px; line-height: 1; }
.rv-stars i { font-style: normal; color: rgba(255,255,255,.14); }
.rv-stars i.is-on { color: var(--warn); }
.rv-stars--lg { font-size: 18px; gap: 2px; }

/* фильтры */
.rv-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.rv-toolbar__right { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rv-chip, .rv-toggle {
  display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px; border-radius: 999px;
  border: 1px solid var(--line); background: rgba(255,255,255,.03); color: var(--txt-2);
  font: 600 13px/1 var(--font-body); cursor: pointer; white-space: nowrap;
  transition: background .2s, border-color .2s, color .2s;
}
.rv-chip:hover:not(:disabled), .rv-toggle:hover { color: var(--txt); border-color: var(--line-hi); background: rgba(255,255,255,.06); }
.rv-chip.is-active { color: #fff; border-color: transparent; background: var(--grad); }
.rv-chip:disabled { opacity: .35; cursor: default; }
.rv-chip__star { color: inherit; }
.rv-chip:not(.is-active) .rv-chip__star { color: var(--warn); }
.rv-chip__n { padding: 3px 6px; border-radius: 999px; background: rgba(255,255,255,.08); font-size: max(11px, calc(9px / var(--z, 1))); color: inherit; font-variant-numeric: tabular-nums; }
.rv-chip.is-active .rv-chip__n { background: rgba(255,255,255,.22); }
.rv-toggle__box {
  width: 15px; height: 15px; border-radius: 5px; border: 1.5px solid var(--line-hi);
  display: grid; place-items: center; transition: background .2s, border-color .2s;
}
.rv-toggle.is-active { color: var(--txt); border-color: rgba(139,123,255,.5); background: rgba(139,123,255,.14); }
.rv-toggle.is-active .rv-toggle__box { background: var(--acc); border-color: var(--acc); }
.rv-toggle.is-active .rv-toggle__box::after { content: '✓'; color: #fff; font-size: max(10px, calc(9px / var(--z, 1))); font-weight: 800; line-height: 1; }
.rv-select {
  height: 36px; padding: 0 32px 0 13px; border-radius: 999px; border: 1px solid var(--line);
  background: rgba(255,255,255,.03) url("/assets/icon-chevron-down-light.svg") no-repeat right 10px center / 14px;
  color: var(--txt); font: 600 13px/1 var(--font-body); cursor: pointer; appearance: none; -webkit-appearance: none;
}
.rv-select[hidden] { display: none; }
.rv-select:hover { border-color: var(--line-hi); }
.rv-select option { background: var(--bg-2); color: var(--txt); }
/* свой открытый список (theme-2026.css) рисует и стрелку — фоновую убираем, чтобы не было двух */
@supports (appearance: base-select) {
  .rv-select { background-image: none; padding-right: 12px; }
}
.rv-reset {
  height: 36px; padding: 0 12px; border: 0; border-radius: 999px; background: none;
  color: var(--acc-2); font: 600 13px/1 var(--font-body); cursor: pointer;
}
.rv-reset[hidden] { display: none; }
.rv-reset:hover { color: var(--txt); text-decoration: underline; }
.rv-chip:focus-visible, .rv-toggle:focus-visible, .rv-select:focus-visible, .rv-bar:focus-visible, .rv-reset:focus-visible, .rv-more:focus-visible {
  outline: 2px solid var(--acc); outline-offset: 2px;
}
.rv-found { color: var(--txt-2); font-size: 13px; margin: -4px 0 -6px; }
.rv-found:empty { display: none; }

/* лента */
.rv-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.rv-card {
  display: grid; gap: 12px; padding: 18px 20px; border-radius: 16px;
  background: var(--bg-1); border: 1px solid var(--line);
  transition: border-color .2s;
}
.rv-card:hover { border-color: var(--line-hi); }
.rv-card--low { border-left: 3px solid rgba(251,113,133,.6); }
.rv-card__head { display: flex; align-items: center; gap: 12px; }
.rv-card__ava {
  flex: none; width: 40px; height: 40px; border-radius: 12px; object-fit: cover;
  display: grid; place-items: center; background: var(--grad-soft); border: 1px solid var(--line);
  color: var(--txt); font: 700 14px/1 var(--font-display);
}
.rv-card__who { flex: 1; min-width: 0; display: grid; gap: 3px; }
.rv-card__who b { color: var(--txt); font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rv-card__who time { color: var(--txt-3); font-size: 12.5px; }
/* жалоба на отзыв: тихая кнопка, заметна при наведении на карточку */
.rv-card__report {
  flex: none; width: 30px; height: 30px; margin: -4px -6px -4px 0; display: grid; place-items: center;
  border: 1px solid transparent; border-radius: 9px; background: transparent;
  color: var(--txt-3); font-size: 14px; line-height: 1; cursor: pointer; opacity: .55; transition: opacity .15s, color .15s, border-color .15s;
}
.rv-card:hover .rv-card__report, .rv-card__report:focus-visible { opacity: 1; }
.rv-card__report:hover { color: #FB7185; border-color: var(--line-hi); }
@media (hover: none) { .rv-card__report { opacity: .8; } }
.rv-card__text { margin: 0; color: var(--txt); font-size: 14.5px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.rv-card__text--none { color: var(--txt-3); font-size: 13.5px; font-style: italic; }
.rv-card__lot {
  display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border-radius: 12px;
  background: rgba(255,255,255,.035); font-size: 13px;
}
.rv-card__game {
  flex: none; width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center;
  background: var(--grad); color: #fff; font: 700 max(9px, calc(9px / var(--z, 1)))/1 var(--font-display);
}
.rv-card__lot a { min-width: 0; color: var(--txt); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rv-card__lot a:hover { color: var(--acc-2); }
.rv-card__gtitle { flex: none; margin-left: auto; color: var(--txt-3); font-size: 12px; }
.rv-empty {
  display: grid; justify-items: center; gap: 8px; padding: 36px 16px; border-radius: 18px;
  border: 1px dashed var(--line-hi); color: var(--txt-2); text-align: center;
}
.rv-empty b { color: var(--txt); }
.rv-more {
  justify-self: center; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--line-hi);
  background: rgba(255,255,255,.04); color: var(--txt); font: 700 14px/1 var(--font-body); cursor: pointer;
  transition: background .2s;
}
.rv-more:hover { background: rgba(255,255,255,.08); }
.rv-more[hidden] { display: none; }
.rv-more:disabled { opacity: .5; cursor: wait; }

@media (max-width: 760px) {
  .rv-summary { grid-template-columns: 1fr; gap: 16px; padding: 18px; }
  .rv-summary__score { grid-template-columns: auto auto; align-items: center; column-gap: 14px; }
  .rv-summary__avg { grid-row: span 2; font-size: 44px; }
  .rv-toolbar, .rv-toolbar__right { width: 100%; }
  .rv-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 2px 16px; scrollbar-width: none; }
  .rv-chips::-webkit-scrollbar { display: none; }
  .rv-select { flex: 1 1 140px; }
  .rv-card { padding: 16px; }
  .rv-card__gtitle { display: none; }
  .sp-tabs { width: 100%; }
  .sp-tab { flex: 1; justify-content: center; }
}

/* --- отзывы: факты под сводкой, скелетон, режим для страницы лота --- */
.rv-summary__facts {
  grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px;
  padding-top: 16px; border-top: 1px solid var(--line);
}
.rv-fact { display: grid; gap: 3px; }
.rv-fact b { color: var(--txt); font: 700 16px/1.2 var(--font-display); letter-spacing: -.03em; }
.rv-fact span { color: var(--txt-3); font-size: 12.5px; }
.rv-summary--sk { min-height: 190px; position: relative; overflow: hidden; }
.rv-summary--sk::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.05) 50%, transparent 80%);
  animation: rv-sk 1.2s linear infinite;
}
@keyframes rv-sk { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

.rv-card__lot.is-same { background: rgba(139,123,255,.1); border: 1px solid rgba(139,123,255,.28); }
.rv-card__lname { min-width: 0; color: var(--txt); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rv-card__same {
  flex: none; margin-left: auto; padding: 3px 8px; border-radius: 999px;
  background: var(--grad); color: #fff; font-size: max(11px, calc(9px / var(--z, 1))); font-weight: 700;
}
.rv-toggle[hidden] { display: none; }

.pdp-reviews { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; scroll-margin-top: 96px; }
.pdp-reviews__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.pdp-reviews__head .pdp-card__h { margin: 0; }
.pdp-reviews__who { color: var(--acc-2); text-decoration: none; }
.pdp-reviews__who:hover { text-decoration: underline; }
.pdp-reviews__all { color: var(--txt-2); font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.pdp-reviews__all:hover { color: var(--txt); }
.rv--compact .rv-summary { grid-template-columns: 140px minmax(0, 1fr); gap: 22px; padding: 18px 20px; }
.rv--compact .rv-summary__avg { font-size: 44px; }
.rv--compact .rv-toolbar__right { gap: 6px; }

@media (max-width: 760px) {
  /* minmax(0,…) — сводка по ширине экрана, а не по самой длинной строке внутри */
  .rv-summary, .rv--compact .rv-summary { grid-template-columns: minmax(0, 1fr); }
  .rv-summary > *, .rv-summary__score > * { min-width: 0; }
  .rv-summary__score { grid-template-columns: auto minmax(0, 1fr); }
  .rv-summary__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rv-fact b { font-size: 14px; overflow-wrap: anywhere; }
}

/* ================================================================
   Рекомендации продавцов: плашки, блок на главной, индекс доверия
   ================================================================ */
.rec-badge {
  display: inline-flex; align-items: center; gap: 5px; vertical-align: middle; white-space: nowrap;
  padding: 5px 10px; border-radius: 999px; font: 700 12px/1 var(--font-body); letter-spacing: 0;
  color: #fff; cursor: help;
}
.rec-badge i { font-style: normal; font-size: 1.05em; }
.rec-badge--rec { background: rgba(255,122,69,.14); border: 1px solid rgba(255,122,69,.45); color: #FFC4A8; }
.rec-badge--top { background: #F5A524; border: 0; color: #1a0c00; }
.rec-badge--sm { padding: 3px 7px; font-size: max(10.5px, calc(9px / var(--z, 1))); margin-left: 6px; gap: 3px; }
.p-name .rec-badge { margin-left: 4px; font-size: 12.5px; }

/* на карточке лота */
.lcard__badge--rec-rec { border: 0; background: #E8590C; }
.lcard__badge--rec-top { border: 0; background: #F5A524; color: #1a0c00; }
.lcard--choice { border-color: rgba(251,191,36,.35); }
.lcard--choice:hover { border-color: rgba(251,191,36,.6); }
@media (max-width: 600px) {
  .lcard__badge--rec { display: inline-flex !important; }
}

/* главная */
.rec-note { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; color: var(--txt-2); font-size: 14px; max-width: 640px; }
.rec-note__chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px;
  background: rgba(255,122,69,.12); border: 1px solid rgba(255,122,69,.35); color: #FFC4A8; font-weight: 700; font-size: 12.5px;
}

/* страница лота: «почему рекомендуем» */
.rec-why {
  padding: 14px 16px; border-radius: 14px; font-size: 13px;
  background: rgba(255,122,69,.06); border: 1px solid rgba(255,122,69,.28);
}
.rec-why--top { background: rgba(251,191,36,.06); border-color: rgba(251,191,36,.35); }
.rec-why__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.rec-why__head b { color: var(--txt); font-size: 14px; }
.rec-why__score { padding: 3px 8px; border-radius: 999px; background: rgba(255,255,255,.08); color: var(--txt); font-weight: 700; font-size: 12px; font-variant-numeric: tabular-nums; }
.rec-why ul, .trust__why { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.rec-why li, .trust__why li {
  padding: 4px 9px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--txt-2); font-size: 12px;
}
.rec-why li::before, .trust__why li::before { content: '✓ '; color: var(--ok); font-weight: 800; }

/* профиль: индекс доверия */
.trust { display: grid; gap: 14px; scroll-margin-top: 110px; }
.trust h3 { margin: 0; display: flex; align-items: center; gap: 8px; }
.trust__help { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800;
  color: var(--txt-2); background: rgba(255,255,255,.06); border: 1px solid var(--line); text-decoration: none; transition: .2s; }
.trust__help:hover { color: #fff; border-color: var(--acc); background: rgba(139,123,255,.18); }
.trust__badge-link { display: inline-flex; text-decoration: none; border-radius: 999px; cursor: pointer; }
.trust__badge-link, .trust__badge-link .rec-badge { cursor: pointer; }
.trust__badge-link:hover .rec-badge { filter: brightness(1.1); }
/* видимая ссылка на объяснение внизу карточки доверия */
.trust__link {
  display: inline-flex; align-items: center; margin-top: 2px; font-size: 12.5px; font-weight: 700; text-decoration: none;
  color: #C9C0FF; transition: color .2s; width: max-content;
}
.trust__link:hover { color: #fff; }
.trust__top { display: flex; align-items: center; gap: 16px; }
.trust__top > div { display: grid; gap: 6px; justify-items: start; }
.trust__ring {
  --c: #FF7A45; flex: none; width: 84px; height: 84px; border-radius: 50%; display: grid; place-content: center; text-align: center;
  background:
    radial-gradient(closest-side, var(--bg-1) 78%, transparent 80% 100%),
    conic-gradient(var(--c) calc(var(--p) * 1%), rgba(255,255,255,.08) 0);
}
.trust__ring--top { --c: #FBBF24; }
.trust__ring--none { --c: var(--acc); }
.trust__ring b { color: var(--txt); font: 800 26px/1 var(--font-display); letter-spacing: -.04em; }
.trust__ring small { color: var(--txt-3); font-size: max(10.5px, calc(9px / var(--z, 1))); margin-top: 2px; }
.trust__none { color: var(--txt-2); font-weight: 700; font-size: 13px; }
.trust__hint { margin: 0; color: var(--txt-3); font-size: 12.5px; }
.trust__lead { margin: 0; color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.trust__parts { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.trust__parts li { display: grid; gap: 4px; cursor: help; }
.trust__plabel { display: flex; justify-content: space-between; color: var(--txt-2); font-size: 12.5px; }
.trust__plabel small { color: var(--txt-3); }
.trust__track { height: 6px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; }
.trust__track i { display: block; height: 100%; border-radius: inherit; background: #FBBF24; }
.trust__steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.trust__steps i { height: 8px; border-radius: 999px; background: rgba(255,255,255,.08); }
.trust__steps i.is-on { background: #FBBF24; }
.trust__tip { margin: 0; padding: 10px 12px; border-radius: 12px; background: rgba(139,123,255,.1); border: 1px solid rgba(139,123,255,.25); color: var(--txt-2); font-size: 12.5px; line-height: 1.45; }
.trust__tip b { color: var(--txt); }


/* ================================================================
   Иконки игр и сервисов: квадратные «как у приложения»
   ================================================================ */
.dock__tile--app { background: #111; }
.dock__tile--app img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* заглушка лота: иконка приложения на цветной подложке */
.lcard__ph-icon { border-radius: 24%; box-shadow: 0 0 0 1px rgba(255,255,255,.12); }

/* маленькие значки игр (специализация продавца, карточки отзывов) */
.game-mark--img { padding: 0 !important; overflow: hidden; background: #111 !important; }
.game-mark--img img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* плитки на странице «Все игры» */
.game-tile__cover--img { display: grid; place-items: center; }
.game-tile__cover--img img { width: 44%; aspect-ratio: 1; border-radius: 24%; object-fit: cover; position: relative; z-index: 1; }

.ml-thumb > img[src^="/assets/games/"] { border-radius: 24%; width: 56%; height: auto; aspect-ratio: 1; object-fit: cover; }


/* категории игры — чипсы под шапкой */
.cat-chips {
  display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 18px;
}
.cat-chips[hidden] { display: none; }
.cat-chip {
  display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--line); background: rgba(255,255,255,.035); color: var(--txt-2);
  font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap;
  transition: background .2s, border-color .2s, color .2s;
}
.cat-chip:hover { color: var(--txt); border-color: var(--line-hi); background: rgba(255,255,255,.07); }
.cat-chip.is-active { color: #fff; border-color: transparent; background: var(--grad); }
.cat-chip.is-empty:not(.is-active) { color: var(--txt-3); }
.cat-chip__n { min-width: 20px; padding: 3px 7px; border-radius: 999px; background: rgba(255,255,255,.08); font-size: max(11.5px, calc(9px / var(--z, 1))); text-align: center; font-variant-numeric: tabular-nums; }
.cat-chip.is-active .cat-chip__n { background: rgba(255,255,255,.22); }
.cat-chip:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
@media (max-width: 700px) {
  /* на телефоне — одна строка, листается пальцем */
  .cat-chips { flex-wrap: nowrap; overflow-x: auto; margin: -4px -16px 16px; padding: 2px 16px; scrollbar-width: none; }
  .cat-chips::-webkit-scrollbar { display: none; }
}

/* Баннер реферальной программы на главной («Платим за твоих друзей») */
#hx-ref-section[hidden] { display: none; }
.ref-cta {
  position: relative; display: flex; align-items: center; gap: 28px;
  padding: 28px 32px; border-radius: 18px; overflow: hidden; text-decoration: none;
  color: var(--txt); isolation: isolate;
  background: var(--bg-1);
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.ref-cta:hover { border-color: var(--line-hi); }
.ref-cta:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }
.ref-cta__body { display: flex; flex-direction: column; gap: 8px; max-width: 640px; }
.ref-cta__title { font-family: 'Unbounded', sans-serif; font-size: clamp(22px, calc(3.4vw / var(--z, 1)), 32px); font-weight: 800; line-height: 1.05; letter-spacing: -.02em; margin: 2px 0; }
.ref-cta__text { font-size: 15.5px; color: var(--txt-2); line-height: 1.5; }
.ref-cta__text b { color: var(--txt); }
.ref-cta__btn { margin-top: 14px; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 22px; border-radius: 999px; background: var(--grad); color: #fff; font-weight: 700; font-size: 15px; }
.ref-cta:hover .ref-cta__btn { filter: brightness(1.1); }
.ref-cta__pct { margin-left: auto; flex: none; display: flex; flex-direction: column; align-items: flex-end; line-height: 1; }
.ref-cta__pct-num { display: flex; align-items: baseline; font-family: 'Unbounded', sans-serif; }
.ref-cta__pct-num b { font-size: clamp(64px, calc(9vw / var(--z, 1)), 104px); font-weight: 800; color: #8B7BFF; }
.ref-cta__pct-num i { font-size: clamp(34px, calc(5vw / var(--z, 1)), 56px); font-weight: 700; font-style: normal; color: var(--txt-3); }
.ref-cta__pct-note { margin-top: 6px; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--txt-3); }
@media (max-width: 720px) {
  .ref-cta { gap: 10px; padding: 24px 22px; }
  .ref-cta__body { max-width: none; }
  /* процент уже есть в тексте — крупная цифра на узком экране только налезала на заголовок */
  .ref-cta__pct { display: none; }
}
/* с нашим рисунком (.ax, tools/site-art/promo.mjs): праздничная сцена фоном, подарок с монетами выходит за верх,
   крупный процент — левее подарка */
#hx-ref-section:has(.ref-cta.ax) { padding-top: 76px !important; }
.ref-cta.ax {
  --hero-w: 280px; --hero-top: -78px; --hero-right: 10px; --shade-mid: 42%; --shade-end: 78%;
  overflow: visible; border-radius: 26px; padding: 34px 300px 34px 36px; min-height: 230px; box-sizing: border-box;
}
.ref-cta.ax .ref-cta__text { color: rgb(255 255 255 / .8); }
.ref-cta.ax .ref-cta__text b { color: #fff; }
.ref-cta.ax .ref-cta__btn { background: #fff; color: #1d0f22; }
.ref-cta.ax .ref-cta__pct-num b { color: var(--tone); }
.ref-cta.ax .ref-cta__pct-num i, .ref-cta.ax .ref-cta__pct-note { color: rgb(255 255 255 / .72); }
.ref-cta.ax .ax__hero { transition: scale .45s var(--ease-out), rotate .45s var(--ease-out); }
.ref-cta.ax:hover .ax__hero { scale: 1.05; rotate: -3deg; }
@media (max-width: 980px) {
  .ref-cta.ax { padding-right: 230px; --hero-w: 220px; --hero-top: -60px; }
  .ref-cta.ax .ref-cta__pct { display: none; }
}
@media (max-width: 720px) {
  #hx-ref-section:has(.ref-cta.ax) { padding-top: 56px !important; }
  .ref-cta.ax { padding: 128px 22px 24px; --hero-w: 168px; --hero-top: -50px; --hero-right: 50%; }
  .ref-cta.ax .ax__hero { translate: 50% 0; }
  .ref-cta.ax .ax__surface::before { background: linear-gradient(180deg, rgb(var(--shade) / .1) 0%, rgb(var(--shade) / .75) 40%, rgb(var(--shade) / .95) 62%); }
}
/* ================================================================
   Профиль: вкладка «Ачивки» (отдельно от звания)
   ================================================================ */
.achs { display: grid; gap: 22px; }
.achs__top {
  display: flex; align-items: center; gap: 20px; padding: 20px 22px; border-radius: 16px;
  background: var(--bg-1); border: 1px solid var(--line);
}
.achs__score { flex: none; display: grid; justify-items: center; }
.achs__score b { font: 800 44px/1 var(--font-display); letter-spacing: -.05em; color: var(--txt); }
.achs__score small { color: var(--txt-3); font-size: 12px; margin-top: 2px; }
.achs__lead { flex: 1; min-width: 0; display: grid; gap: 10px; }
.achs__lead p { margin: 0; color: var(--txt-2); font-size: 13.5px; line-height: 1.5; }
.achs__group h3 {
  display: flex; align-items: baseline; gap: 10px; margin: 0 0 10px;
  font: 700 16px/1.2 var(--font-display); letter-spacing: -.02em; color: var(--txt);
}
.achs__group h3 span { color: var(--txt-3); font: 600 12.5px/1 var(--font-body); }
.achs .lv-achs { margin: 0; }
.achs .lv-ach:not(.is-got) .lv-ach__mark { font-size: max(11px, calc(9px / var(--z, 1))); filter: grayscale(1); opacity: .7; }

/* под ником — «+N ачивок →» */
.p-ach--more {
  cursor: pointer; font: inherit; border: 1px dashed var(--line-hi) !important;
  background: rgba(255,255,255,.04) !important; color: var(--txt) !important;
}
.p-ach--more:hover { background: rgba(255,255,255,.09) !important; }
.p-ach--more:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }

/* окно званий — ссылка на ачивки вместо их списка */
.lv-achlink {
  display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: 18px;
  padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,.04);
  color: var(--txt-2); font: 600 14px/1 var(--font-body); cursor: pointer; transition: background .2s, border-color .2s;
}
.lv-achlink b { color: var(--txt); }
.lv-achlink:hover { background: rgba(255,255,255,.08); border-color: var(--line-hi); }
@media (max-width: 600px) {
  .achs__top { flex-direction: column; align-items: stretch; text-align: left; }
  .achs__score { justify-items: start; grid-auto-flow: column; align-items: baseline; gap: 8px; justify-content: start; }
}
/* ================================================================
   Залог выводится — красным, чтобы покупатели сразу видели риск
   ================================================================ */
.sp .p-deposit--withdraw {
  background: rgba(244,63,94,.08);
  border: 1px solid rgba(244,63,94,.55);
}
.sp .p-deposit--withdraw .p-deposit__ico {
  background: rgba(244,63,94,.18); border-color: rgba(244,63,94,.55); color: #FB7185;
  font-weight: 900; font-size: 22px;
}
.sp .p-deposit--withdraw .p-deposit__val { color: #FB7185; }
.sp .p-deposit--withdraw .p-deposit__lbl { color: #FDA4AF; font-weight: 800; }
.sp .p-deposit--withdraw .p-deposit__lbl > span { display: inline-flex; align-items: center; gap: 8px; }
.p-deposit__pulse { width: 8px; height: 8px; border-radius: 50%; background: #F43F5E; flex: none; }
.sp .p-deposit--withdraw .p-deposit__sub { color: var(--txt-2); }
.sp .p-deposit--withdraw .p-deposit__sub b { color: #FDA4AF; }
.p-deposit__countdown { display: grid; gap: 6px; margin-top: 12px; width: 100%; }
.p-deposit__track { height: 6px; border-radius: 999px; background: rgba(244,63,94,.15); overflow: hidden; }
.p-deposit__track i { display: block; height: 100%; border-radius: inherit; background: #F43F5E; }
.p-deposit__dates { display: flex; justify-content: space-between; color: var(--txt-3); font-size: 12px; }
/* ---- Окно выбора раскраски: примерочная, группы по редкости, замки ---- */
.nk-preview { position: relative; flex-direction: column; align-items: center; gap: 6px; transition: border-color .2s, background .2s; }
.nk-preview.is-trying { border-color: rgba(167,139,250,.6); }
.nk-preview__note { font: 600 12px/1.2 var(--font-body); letter-spacing: 0; color: var(--txt-3); }
.nk-preview.is-denied { animation: nk-deny .4s; border-color: rgba(251,113,133,.6); }
@keyframes nk-deny { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.nk-grid--none { grid-template-columns: minmax(170px, 260px); }
.nk-tier { margin-top: 20px; }
.nk-tier__h { display: flex; align-items: baseline; gap: 8px; margin: 0; font: 700 14px/1.2 var(--font-display); letter-spacing: -.01em; color: var(--txt); }
.nk-tier__h span { color: var(--txt-3); font: 600 12px/1 var(--font-body); }
.nk-tier--rare .nk-tier__h { color: #7DD3FC; }
.nk-tier--epic .nk-tier__h { color: #C4B5FD; }
.nk-tier--legendary .nk-tier__h { color: #FCD34D; }
.nk-tier--mythic .nk-tier__h { color: #67E8F9; }
.nk-tier .nk-grid { margin-top: 10px; }
.nk-opt.is-locked { cursor: help; background: rgba(255,255,255,.015); }
.nk-opt.is-locked .nk-opt__name { color: var(--txt-3); }
.nk-opt__lock { position: absolute; right: 12px; top: 10px; font-size: 13px; opacity: .8; }
.nk-opt.is-locked:hover { border-color: var(--line-hi); }
@media (prefers-reduced-motion: reduce) { .nk-preview.is-denied { animation: none; } }
/* ---- Профиль: рейтинг у ника, три плитки вместо пяти ---- */
.sp .sp-stats { grid-template-columns: repeat(3, 1fr); }
.sp .p-rating-btn { display: inline-flex; align-items: center; gap: 8px; }
.sp .p-rating-btn .pdp-stars { font-size: 14px; letter-spacing: 1px; }
.sp .p-rating-btn b { font: 800 15px/1 var(--font-display); color: var(--txt); letter-spacing: -.02em; }
.sp .p-rating-btn.is-empty { color: var(--txt-3); }
@media (max-width: 760px) {
  .sp .sp-stats { grid-template-columns: repeat(2, 1fr); }
  .sp .sp-stats > :last-child { grid-column: 1 / -1; }   /* звание с прогрессом — во всю ширину */
}
/* ---- Шапка профиля без лишнего: плашка рекомендации кликабельна, витрина ачивок настраивается ---- */
.p-rec-btn { padding: 0; border: 0; background: none; cursor: pointer; border-radius: 999px; line-height: 0; }
.p-rec-btn .rec-badge { cursor: pointer; }
.p-rec-btn:hover .rec-badge { filter: brightness(1.12); }
.p-rec-btn:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }
.trust.is-flash { animation: trust-flash 1.4s ease-out; }
@keyframes trust-flash { 0%, 30% { box-shadow: 0 0 0 2px rgba(251,191,36,.9); } 100% { box-shadow: none; } }
.sp .p-achs[hidden] { display: none; }

.achs-sc {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px;
  padding: 14px 16px; border-radius: 16px; border: 1px dashed rgba(139,123,255,.45); background: rgba(139,123,255,.07);
}
.achs-sc b { color: var(--txt); font-size: 14px; margin-right: 8px; }
.achs-sc__info { color: var(--txt-2); font-size: 13px; }
.achs-sc__actions { display: flex; gap: 8px; }
.achs-sc__btn {
  height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line-hi); background: rgba(255,255,255,.04);
  color: var(--txt); font: 600 12.5px/1 var(--font-body); cursor: pointer;
}
.achs-sc__btn:hover:not(:disabled) { background: rgba(255,255,255,.09); }
.achs-sc__btn:disabled { opacity: .4; cursor: default; }
.lv-ach__pin {
  grid-column: 2; justify-self: start; margin-top: 6px; height: 26px; padding: 0 10px; border-radius: 999px;
  border: 1px dashed currentColor; background: none; color: inherit; opacity: .75;
  font: 700 max(11.5px, calc(9px / var(--z, 1)))/1 var(--font-body); cursor: pointer; transition: opacity .2s, background .2s;
}
.lv-ach__pin:hover { opacity: 1; }
.lv-ach__pin.is-on { opacity: 1; border-style: solid; background: color-mix(in srgb, currentColor 16%, transparent); }
.lv-ach__pin:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
/* ---- Чип залога: у ника в профиле и в карточке продавца на лоте ---- */
.dep-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px;
  font: 700 13px/1 var(--font-body); letter-spacing: 0; white-space: nowrap; vertical-align: middle;
  border: 1px solid transparent; transition: filter .2s;
}
button.dep-chip { cursor: pointer; }
button.dep-chip:hover { filter: brightness(1.15); }
button.dep-chip:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.dep-chip--on   { color: #6EE7B7; background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.45); }
.dep-chip--out  { color: #FDA4AF; background: rgba(244,63,94,.13); border-color: rgba(244,63,94,.55); }
.dep-chip--none { color: var(--txt-3); background: rgba(255,255,255,.04); border-color: var(--line); font-weight: 600; }
.dep-chip__pulse { width: 8px; height: 8px; border-radius: 50%; background: #F43F5E; }
.pdp-seller .dep-chip { height: 24px; padding: 0 9px; font-size: 12px; margin: 4px 0 2px; align-self: flex-start; }
.sp .p-deposit { scroll-margin-top: 110px; }
.sp .p-deposit.is-flash { animation: dep-flash 1.4s ease-out; }
@keyframes dep-flash { 0%, 30% { box-shadow: 0 0 0 2px rgba(52,211,153,.9); } 100% { box-shadow: none; } }
.sp .p-deposit--withdraw.is-flash { animation-name: dep-flash-red; }
@keyframes dep-flash-red { 0%, 30% { box-shadow: 0 0 0 2px rgba(244,63,94,.9); } 100% { box-shadow: none; } }
@media (prefers-reduced-motion: reduce) { .sp .p-deposit.is-flash { animation: none; } }

/* причина «⚠ выводит залог» в списках почему рекомендуем — красная, без галочки */
.rec-why li.is-warn, .trust__why li.is-warn { color: #FDA4AF; border-color: rgba(244,63,94,.45); background: rgba(244,63,94,.1); }
.rec-why li.is-warn::before, .trust__why li.is-warn::before { content: none; }

/* ===========================================================
   АЧИВКИ-ТРОФЕИ — редизайн карточек и витрины (на токенах theme-2026)
   Ось редкости управляет рамкой/фоном/свечением через currentColor.
   =========================================================== */
:root{
  --ach-common:#9AA0B4; --ach-rare:#7DD3FC; --ach-epic:#C4B5FD;
  --ach-legendary:#FCD34D; --ach-mythic:#67E8F9;
}
.achs .lv-achs{ grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.ach-card{
  position:relative; display:grid; grid-template-columns:46px 1fr; column-gap:12px; row-gap:6px;
  align-items:start; align-content:start; padding:14px; border-radius:16px;
  border:1px solid var(--line); background:rgba(255,255,255,.045);
  color:var(--ach-common);
  transition:border-color .2s, background .2s;
}
.ach-card--rare{ color:var(--ach-rare); }
.ach-card--epic{ color:var(--ach-epic); }
.ach-card--legendary{ color:var(--ach-legendary); }
.ach-card--mythic{ color:var(--ach-mythic); }
.ach-card.is-got{
  border-color:color-mix(in srgb, currentColor 45%, transparent);
  background:color-mix(in srgb, currentColor 7%, rgba(255,255,255,.035));
}
.ach-card.is-locked{ opacity:.6; color:var(--txt-3); }
.ach-card__ico{
  grid-row:1 / span 3; width:46px; height:46px; border-radius:14px; display:grid; place-items:center;
  font-size:22px; line-height:1; user-select:none;
  border:1px solid color-mix(in srgb, currentColor 40%, transparent);
  background:color-mix(in srgb, currentColor 16%, transparent);
}

.ach-card.is-locked .ach-card__ico{ filter:grayscale(1) brightness(.9); border-style:dashed; background:rgba(255,255,255,.03); }
.ach-card__lock{
  position:absolute; left:34px; top:34px; width:18px; height:18px; border-radius:50%;
  display:grid; place-items:center; font-size:max(9px, calc(9px / var(--z, 1))); background:var(--bg-2,#12121C);
  border:1px solid var(--line-hi); color:var(--txt-2);
}
.ach-card.is-got .ach-card__lock{ display:none; }
/* название — первой строкой справа от значка, под ним плашка редкости (раньше плашка висела
   в углу поверх текста и наезжала на длинные названия) */
.ach-card__name{ order:-1; grid-column:2; font:800 14px/1.2 var(--font-body); color:var(--txt); letter-spacing:-.01em; }
.ach-card.is-got .ach-card__name{ color:currentColor; }
.ach-card__how{ grid-column:2; font-size:12px; line-height:1.45; color:var(--txt-2); }
.ach-card.is-locked .ach-card__how{ color:var(--txt-3); }
.ach-card__rar{
  grid-column:2; justify-self:start; height:20px; padding:0 9px; border-radius:999px;
  display:inline-flex; align-items:center; font:800 max(10px, calc(9px / var(--z, 1)))/1 var(--font-body); letter-spacing:.04em; text-transform:uppercase;
  color:currentColor; border:1px solid color-mix(in srgb, currentColor 45%, transparent);
  background:color-mix(in srgb, currentColor 14%, transparent);
}
.ach-card.is-locked .ach-card__rar{ opacity:.7; }
.ach-card__prog{ grid-column:2; height:6px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; margin-top:2px; }
.ach-card__prog i{ display:block; height:100%; min-width:5px; border-radius:inherit;
  background:#8B7BFF; }
.ach-card__pval{ grid-column:2; font:700 max(11px, calc(9px / var(--z, 1)))/1 var(--font-body); color:var(--txt-3); font-variant-numeric:tabular-nums; margin-top:-2px; }

.ach-card .lv-ach__pin{ grid-column:2; justify-self:start; margin-top:2px; }
.achs__group h3 .achs__leg{ margin-left:auto; display:inline-flex; gap:6px; }
.achs__leg i{ width:9px; height:9px; border-radius:50%; background:currentColor; }
.achs__leg .r-common{ color:var(--ach-common);} .achs__leg .r-rare{ color:var(--ach-rare);}
.achs__leg .r-epic{ color:var(--ach-epic);} .achs__leg .r-legendary{ color:var(--ach-legendary);}
.achs__leg .r-mythic{ color:var(--ach-mythic);}
.achs__tiers{ display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.achs__tier{ display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border-radius:999px;
  border:1px solid color-mix(in srgb, currentColor 40%, transparent); background:color-mix(in srgb, currentColor 12%, transparent);
  font:800 max(11px, calc(9px / var(--z, 1)))/1 var(--font-body); font-variant-numeric:tabular-nums; }
.achs__tier.r-common{color:var(--ach-common);} .achs__tier.r-rare{color:var(--ach-rare);}
.achs__tier.r-epic{color:var(--ach-epic);} .achs__tier.r-legendary{color:var(--ach-legendary);} .achs__tier.r-mythic{color:var(--ach-mythic);}
.sp .p-ach.p-ach--card{
  display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 12px 0 6px; border-radius:999px;
  background:color-mix(in srgb, currentColor 9%, rgba(255,255,255,.04));
  border:1px solid color-mix(in srgb, currentColor 42%, transparent);
}
.sp .p-ach--card.r-common{color:var(--ach-common);} .sp .p-ach--card.r-rare{color:var(--ach-rare);}
.sp .p-ach--card.r-epic{color:var(--ach-epic);} .sp .p-ach--card.r-legendary{color:var(--ach-legendary);} .sp .p-ach--card.r-mythic{color:var(--ach-mythic);}
.sp .p-ach.p-ach--card::before{ display:none; }
.sp .p-ach__ico{ width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:14px;
  background:color-mix(in srgb, currentColor 20%, transparent); }
@media (max-width:380px){
  .achs .lv-achs{ grid-template-columns:1fr; }
  .ach-card{ grid-template-columns:38px 1fr; padding:12px; }
  .ach-card__ico{ width:38px; height:38px; font-size:18px; border-radius:12px; }
  .ach-card__lock{ left:28px; top:28px; }
}
@media (prefers-reduced-motion:reduce){
  .ach-card{ transition:none; }
}

/* ---- Поддержка: настоящие сотрудники (support.html, src/officials.js) ---- */
.sup { display: grid; gap: 18px; max-width: 980px; padding-top: 28px; padding-bottom: 48px; }
.sup-hero, .sup-block, .sup-person { padding: 22px 24px; border-radius: 18px; background: var(--bg-1); border: 1px solid var(--line); }
.sup-hero { display: flex; gap: 18px; align-items: flex-start; }
.sup-hero[hidden], .sup-person[hidden] { display: none; }
.sup-hero__ico { flex: none; width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: rgba(251, 191, 36, .12); color: #FCD34D; }
.sup-hero__title { margin: 0 0 6px; font: 800 28px/1.15 var(--font-display); }
.sup-hero__sub { margin: 0; max-width: 680px; color: var(--txt-2); font-size: 15px; line-height: 1.6; }
.sup-h2 { margin: 0 0 14px; font: 700 19px/1.25 var(--font-display); }
.sup-muted { margin: 0; color: var(--txt-3); font-size: 14px; }
.sup-muted a { color: var(--txt-2); }
.sup-shield { display: inline-grid; place-items: center; }
.sup-shield svg { width: 14px; height: 14px; }
.sup-ava { flex: none; width: 48px; height: 48px; border-radius: 14px; object-fit: cover; display: grid; place-items: center;
  background: var(--bg-2); border: 1px solid var(--line); color: var(--txt); font: 800 18px/1 var(--font-display); }
.sup-staff { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 10px; }
.sup-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border-radius: 14px;
  background: var(--bg-2); border: 1px solid var(--line); color: var(--txt); text-decoration: none; }
.sup-card:hover { border-color: rgba(251, 191, 36, .5); }
.sup-card__body { flex: 1; min-width: 0; display: grid; gap: 5px; justify-items: start; }
.sup-card__name { max-width: 100%; font-size: 15px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sup-card__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 10px; }
.sup-card__role { color: var(--txt-2); font-size: 13px; }
.sup-card .presence { font-size: 12.5px; white-space: nowrap; }
.sup-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px;
  border: 1px solid rgba(251, 191, 36, .5); color: #FCD34D; font-size: max(11.5px, calc(9px / var(--z, 1))); font-weight: 800; white-space: nowrap; }
.sup-main { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 22px; border-radius: 18px;
  background: rgba(251, 191, 36, .06); border: 1px solid rgba(251, 191, 36, .35); }
.sup-main .sup-ava { width: 56px; height: 56px; border-radius: 16px; }
.sup-ava--chat { color: #FCD34D; background: rgba(251, 191, 36, .12); border-color: rgba(251, 191, 36, .35); }
.sup-main__body { flex: 1; min-width: 220px; display: grid; gap: 4px; }
.sup-main__title { margin: 0; font-size: 17px; font-weight: 800; }
.sup-main p { margin: 0; color: var(--txt-2); font-size: 14px; line-height: 1.5; }
.sup-main p b { color: var(--txt); }
.sup-btn { padding: 12px 22px; border-radius: 12px; font-weight: 700; }
.sup-steps, .sup-list { margin: 0; padding-left: 22px; display: grid; gap: 10px; color: var(--txt-2); font-size: 15px; line-height: 1.6; }
.sup-steps b { color: var(--txt); }
.sup-steps code { padding: 1px 6px; border-radius: 6px; background: var(--bg-2); color: var(--txt); font-size: 13.5px; overflow-wrap: anywhere; }
.sup-never { border-color: rgba(239, 68, 68, .35); }
.sup-fake p { margin: 0 0 8px; color: var(--txt-2); font-size: 15px; line-height: 1.6; }
.sup-person { display: grid; gap: 14px; border-color: rgba(251, 191, 36, .45); }
.sup-person__head { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.sup-person__head .sup-ava { width: 96px; height: 96px; border-radius: 24px; font-size: 34px; }
.sup-person__who { min-width: 0; }
.sup-person__verified { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px;
  background: rgba(251, 191, 36, .12); color: #FCD34D; font-size: 13px; font-weight: 800; }
.sup-person__name { margin: 8px 0 4px; font: 800 28px/1.15 var(--font-display); overflow-wrap: anywhere; }
.sup-person__meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--txt-2); font-size: 14px; }
.sup-person__check { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--bg-2); color: var(--txt-2); font-size: 14px; line-height: 1.5; }
.sup-person__check b { color: var(--txt); overflow-wrap: anywhere; }
.sup-person__actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.sup-link { color: var(--acc-2); font-weight: 700; text-decoration: none; }
.sup-link:hover { text-decoration: underline; }
.sup-person.is-fake { border-color: rgba(239, 68, 68, .55); background: rgba(239, 68, 68, .06); justify-items: start; }
.sup-person.is-fake h1 { margin: 0; font: 800 24px/1.2 var(--font-display); overflow-wrap: anywhere; }
.sup-person.is-fake p { margin: 0; color: var(--txt-2); font-size: 15px; line-height: 1.6; }
.sup-fake-ico { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: #DC2626; color: #fff; font: 900 26px/1 var(--font-display); }
/* профиль обычного аккаунта с ником «под администрацию» — предупреждение (seller.js) */
.sp-impostor { margin: 0 0 16px; padding: 14px 16px; border-radius: 14px; background: rgba(239, 68, 68, .08);
  border: 1px solid rgba(239, 68, 68, .5); color: #FECACA; font-size: 14.5px; line-height: 1.55; }
.sp-impostor b { color: #fff; }
.sp-impostor a { color: #fff; font-weight: 700; }
/* профиль сотрудника — обычный профиль, над ником значок «Сотрудник Zalut · должность» (seller.js), как в «Сообщениях» */
.p-staff { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 8px; padding: 4px 11px; border-radius: 999px;
  border: 1px solid rgba(251, 191, 36, .55); background: rgba(251, 191, 36, .1); color: #FCD34D; font-size: 13px; font-weight: 800;
  line-height: 1.3; text-decoration: none; transition: border-color .15s, background .15s; }
.p-staff:hover { border-color: #FCD34D; background: rgba(251, 191, 36, .16); }
.p-staff svg { flex: none; width: 15px; height: 15px; }
@media (max-width: 640px) {
  .sup { padding-top: 16px; }
  .sup-hero { flex-direction: column; }
  .sup-hero, .sup-block, .sup-person, .sup-main { padding: 18px; }
  .sup-main .sup-btn { flex: 1 1 100%; text-align: center; }
  .sup-hero__title, .sup-person__name { font-size: 24px; }
  .sup-staff { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   «ИГРОВОЙ МИР» — весь сайт в стиле наших рисунков (2026-10-04): ночное небо с островами вверху каждой
   страницы, пейзаж над подвалом, «игровые» кнопки с плотной нижней кромкой, карточки на «ступеньке» с
   подсветкой в цвет игры, нарисованные значки у заголовков. По-прежнему плоско: без свечений, стекла и
   размытий. Картинки — tools/site-art/sky.mjs и icons.mjs; у осенней темы своё небо и пейзаж
   (:root[data-event-on="1"]). Последним блоком файла — чтобы перекрывать старые правила той же силы.
   ============================================================ */

/* ---- фон всей страницы: еле заметный узор из нарисованных монет, кристаллов, ключей, геймпадов… (плитка
   tools/site-art/pattern.mjs, бледность зашита в саму картинку); в осеннюю тему — с листьями ---- */
/* фон — у html (это холст всей страницы), а body прозрачный: иначе его заливка легла бы поверх неба (body::before) */
html { background: var(--bg-0) url(/assets/art/bg-doodles.svg?v=2) 0 0 / 400px 400px repeat; }
:root[data-event-on="1"] { background-image: url(/assets/art/bg-doodles-autumn.svg?v=2); }
body { background: transparent; }
/* где читают подряд или работают в окне — без узора и неба: правила, соглашения, чаты */
html:has(main.legal), html:has(.chx) { background-image: none; }
body:has(main.legal)::before, body:has(.chx)::before { display: none; }
:root .chx { background: var(--bg-0); }

/* ---- панели: сквозь полупрозрачную заливку проступал бы узор фона и небо. «Стекло» (--glass) теперь
   сплошное того же оттенка — белая дымка, смешанная с цветом страницы (в осенней теме — с её тёплым фоном) ---- */
html:root {
  --glass:    color-mix(in srgb, #fff 4.5%, var(--bg-0));
  --glass-hi: color-mix(in srgb, #fff 8%, var(--bg-0));
}
/* панели и кнопки, у которых дымка задана числом, а не через --glass */
:root :is(.ct-info, .ct-info li, .ct-info details, .tp-tabs, .rw-fchip, .sp-tabs, .pg-tabs, .p-ach--more, .ct-pill,
  .hd-lang, .hd-bal, .hd-me, .footer__lang) { background-color: color-mix(in srgb, #fff 4%, var(--bg-0)); }
:root :is(.cat-chip) { background-color: color-mix(in srgb, #fff 3.5%, var(--bg-0)); }
:root :is(.ct-view) { background-color: color-mix(in srgb, #fff 3%, var(--bg-0)); }
:root :is(.btn-ghost, .btn--light, .hx-link, .ct-fbtn, .ct-fsel, .ct-sort select, .stat-chip) { background-color: color-mix(in srgb, #fff 5%, var(--bg-0)); }
:root :is(.ct-pages__nav, .p-rating-btn) { background-color: color-mix(in srgb, #fff 7%, var(--bg-0)); }
:root :is(.ct-back) { background-color: color-mix(in srgb, #fff 8%, var(--bg-0)); }
:root :is(.btn-ghost, .btn--light, .hx-link, .ct-fbtn, .ct-fsel, .ct-sort select, .cat-chip, .ct-pill, .ct-pages__nav, .rw-fchip, .hd-lang, .hd-bal, .hd-me, .ct-back):hover {
  background-color: color-mix(in srgb, #fff 9%, var(--bg-0));
}
/* пустые состояния — сплошная подложка, чтобы картинка была главной */
:root .pg-empty, main .empty:not(.lcard):not(span) { background-color: color-mix(in srgb, #fff 2%, var(--bg-0)) !important; }
/* цветные плашки: тот же оттенок поверх сплошной основы (цвета через запятую — осенний генератор их перекрасит) */
:root .rec-why        { background-color: color-mix(in srgb, rgb(251, 191, 36) 6%, var(--bg-0)); }
:root .sup-main       { background-color: color-mix(in srgb, rgb(251, 191, 36) 6%, var(--bg-0)); }
:root .bal-mode--demo { background-color: color-mix(in srgb, rgb(251, 191, 36) 8%, var(--bg-0)); }
:root .tr-down li     { background-color: color-mix(in srgb, rgb(244, 63, 94) 6%, var(--bg-0)); }
:root .tr-down li.is-key { background-color: color-mix(in srgb, rgb(244, 63, 94) 11%, var(--bg-0)); }
:root .p-deposit, :root .tp-live { background-color: color-mix(in srgb, rgb(52, 211, 153) 7%, var(--bg-0)); }
:root .pm-tile.is-active { background-color: color-mix(in srgb, rgb(108, 92, 255) 12%, var(--bg-0)); }
:root .notif-row.is-unread { background-color: color-mix(in srgb, rgb(108, 92, 255) 10%, var(--bg-1)); }

/* ---- небо вверху страницы (за всем содержимым; к низу растворяется в фоне страницы) ---- */
body::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; z-index: -1; pointer-events: none;
  /* в натуральную величину по центру: острова и луна — у краёв картинки, на обычных экранах они за краем,
     на широких — в полях по бокам от содержимого и не попадают под заголовки и кнопки */
  height: 800px;
  /* слои: сверху дымка цвета страницы (небо чуть приглушено — как прежняя прозрачность .85), к низу она густеет
     и растворяет небо в цвет страницы; само небо — не уже экрана (при масштабе страницы, css/base.css, ширина в
     CSS-пикселях больше 2400); под ним — сплошной цвет страницы. Узор-«стикеры» фона (html) не проступает сквозь
     острова и небо (владелец, 2026-10-08) и появляется плавно только внизу, под первым экраном (маска 85–100 %) */
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bg-0) 15%, transparent) 50%, var(--bg-0) 85%),
    url(/assets/art/sky-night.svg?v=2) 50% 0 / max(2400px, 100%) auto no-repeat,
    var(--bg-0);
  -webkit-mask-image: linear-gradient(180deg, #000 85%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 85%, transparent 100%);
}
:root[data-event-on="1"] body::before {
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--bg-0) 15%, transparent) 50%, var(--bg-0) 85%),
    url(/assets/art/sky-dusk.svg?v=2);
}
@media (max-width: 760px) { body::before { height: 520px; background-size: 100% 100%, auto 520px; } }
/* страницы с афишей игры (каталог игры, лот, топ-100) — небо не нужно: афиша сама уходит под прозрачную шапку */
body:has(main > .gx-back)::before { display: none; }
/* наверху страницы шапка прозрачная — под ней видно небо; прокрутил — снова плотная */
.nav:not(.nav--scrolled) { background: transparent; border-bottom-color: transparent; box-shadow: none; }

/* ---- значки у заголовков разделов: <h2 data-ico="…"> (картинка — псевдоэлементом: JS меняет текст заголовков) ---- */
[data-ico]::before {
  content: ''; display: inline-block; flex: none; width: 1.32em; height: 1.32em; margin-right: .3em; vertical-align: -.26em;
  background: 50% 50% / contain no-repeat;
}
[data-ico="trend"]::before   { background-image: url(/assets/art/ico-trend.svg?v=2); }
[data-ico="rec"]::before     { background-image: url(/assets/art/ico-rec.svg?v=2); }
[data-ico="fresh"]::before   { background-image: url(/assets/art/ico-fresh.svg?v=2); }
[data-ico="deal"]::before    { background-image: url(/assets/art/ico-deal.svg?v=2); }
[data-ico="top"]::before     { background-image: url(/assets/art/ico-top.svg?v=2); }
[data-ico="reviews"]::before { background-image: url(/assets/art/ico-reviews.svg?v=2); }
[data-ico="faq"]::before     { background-image: url(/assets/art/ico-faq.svg?v=2); }

/* ---- кнопки: плотная заливка, светлая кромка сверху и тёмная снизу; нажатие — кнопка «проседает» ---- */
.btn-shimmer, .btn--dark, .nav__actions .btn--dark, .tg__more, .ct-card__buy, .auth2-submit, .ref-cta__btn, .hx-help__btn {
  box-shadow: inset 0 -4px 0 rgb(0 0 0 / .24), inset 0 1px 0 rgb(255 255 255 / .2);
  transition: filter .2s, transform .15s var(--ease-out), box-shadow .15s;
}
.btn-shimmer:hover, .btn--dark:hover, .tg__more:hover, .auth2-submit:hover, .hx-help__btn:hover { transform: translateY(-1px); }
.btn-shimmer:active, .btn--dark:active, .tg__more:active, .ct-card__buy:active, .auth2-submit:active, .hx-help__btn:active {
  transform: translateY(1px); box-shadow: inset 0 -2px 0 rgb(0 0 0 / .24), inset 0 1px 0 rgb(255 255 255 / .2);
}
.btn-ghost, .btn--light, .nav__actions .btn--light, .hx-link {
  background: rgb(255 255 255 / .05); box-shadow: inset 0 -3px 0 rgb(0 0 0 / .32);
  transition: background .2s, border-color .2s, transform .15s var(--ease-out), box-shadow .15s;
}
.btn-ghost:active, .btn--light:active, .hx-link:active { transform: translateY(1px); box-shadow: inset 0 -1px 0 rgb(0 0 0 / .32); }

/* ---- карточки: «ступенька» под карточкой, низ подкрашен в цвет игры, при наведении приподнимается ---- */
.lcard {
  border-radius: 20px; border-color: rgb(255 255 255 / .08);
  background: linear-gradient(180deg, var(--bg-1) 45%, hsl(var(--hue) 32% 11%) 100%);
  box-shadow: 0 5px 0 rgb(0 0 0 / .42);
  transition: border-color .2s, transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.lcard:hover { transform: translateY(-4px); border-color: hsl(var(--hue) 80% 72% / .5); box-shadow: 0 9px 0 rgb(0 0 0 / .42); }
.lcard--top { box-shadow: inset 0 0 0 1px rgba(255, 179, 71, .28), 0 5px 0 rgb(0 0 0 / .42); }
.lcard--choice:hover { border-color: rgba(251,191,36,.6); }
.lcard__price { font-family: var(--font-display); font-size: 18px; letter-spacing: -.03em; }
/* лот без своих фото — сцена и предмет его игры (main.js lotCard → gameScene) */
.lcard__ph--art { overflow: hidden; }
.lcard__ph-scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.lcard__ph-hero {
  position: relative; width: 56%; max-height: 82%; object-fit: contain;
  filter: drop-shadow(0 12px 10px rgba(0,0,0,.35)); transition: transform .45s var(--ease-out);
}
.lcard:hover .lcard__ph-hero { transform: translateY(-6px) rotate(-4deg) scale(1.05); }
.ct-card__ph--art { overflow: hidden; }
.ct-card__ph--art .ct-card__ph-scene {
  position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; object-fit: cover; object-position: 70% 50%;
  transform: none; box-shadow: none;
}
.ct-card__ph--art .ct-card__ph-hero {
  position: relative; width: 52%; height: 82%; border-radius: 0; object-fit: contain; transform: none; box-shadow: none;
  filter: drop-shadow(0 12px 10px rgba(0,0,0,.35)); transition: transform .45s var(--ease-out);
}
.ct-card:hover .ct-card__ph--art .ct-card__ph-hero { transform: translateY(-6px) rotate(-4deg) scale(1.05); }
:root .ct-card {
  background: linear-gradient(180deg, #0d0c14 40%, hsl(var(--hue, 250) 30% 10%) 100%);
  box-shadow: 0 5px 0 rgb(0 0 0 / .42);
}
:root .ct-card:hover { transform: translateY(-3px); box-shadow: 0 8px 0 rgb(0 0 0 / .42); }
.seller-tile, .hx-review, .hx-faq details, .hx-step, .rv-card {
  box-shadow: 0 4px 0 rgb(0 0 0 / .38), inset 0 1px 0 rgb(255 255 255 / .04);
}
.seller-tile, .hx-review { border-radius: 20px; transition: transform .3s var(--ease-out), border-color .2s; }
.seller-tile:hover, .hx-review:hover { transform: translateY(-3px); }
.hx-faq details { border-radius: 18px; }
@media (prefers-reduced-motion: reduce) {
  .lcard, .seller-tile, .hx-review, :root .ct-card { transition: border-color .2s; }
  .lcard:hover, .seller-tile:hover, .hx-review:hover, :root .ct-card:hover { transform: none; }
}

/* ---- подвал: сверху нарисованный пейзаж (край мира), ссылки — на ровной тёмной полосе под ним ---- */
.footer {
  --land: max(calc(24vw / var(--z, 1)), 260px);   /* высота пейзажа (картинка крупнее ширины — края обрезаются); низ — ровно цвет подвала */
  --foot: #0b0a16;
  position: relative; isolation: isolate; border-top: 0; padding-top: calc(var(--land) - 70px);
  background: linear-gradient(180deg, transparent calc(var(--land) * .6), var(--foot) calc(var(--land) * .6));
}
:root[data-event-on="1"] .footer { --foot: #120a08; }
.footer::before {
  content: ''; position: absolute; z-index: -1; left: 0; right: 0; top: 0; pointer-events: none;
  height: var(--land);
  background: url(/assets/art/footer-night.svg?v=2) 50% 100% / cover no-repeat;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%);   /* сверху узор фона мягко уходит под пейзаж */
  mask-image: linear-gradient(180deg, transparent 0, #000 22%);
}
:root[data-event-on="1"] .footer::before { background-image: url(/assets/art/footer-dusk.svg?v=2); }
@media (max-width: 760px) {
  :root .footer { --land: 190px; padding-top: 150px; }
  .footer::before { background-position: 50% 100%; }
}
/* ссылки подвала на тёмной полосе — светлее (было ~2.8:1), без пустоты под знаком */
.footer__legal a, .footer__col a { color: var(--txt-2); opacity: 1; }
.footer__legal a:hover, .footer__col a:hover { color: #fff; }
.footer__logo { height: auto; }

/* ---- доводка после проверки (2026-10-04) ---- */
.hx-hero { border-bottom: 0; }                       /* линия резала узор фона */
/* цена в карточке лота: в узких карточках крупный шрифт вытеснял ник продавца */
@media (max-width: 760px) { .lcard__price { font-size: 15px; } }
.sp-main .lcard__price { font-size: 16px; }
/* значки на обложке лота («Выбор Zalut», «15 шт.»…) — сверху столбиком под названием игры: снизу по центру
   каждой миниатюры вшит знак «Zalut» (src/images.js THUMB), значки ложились на него («15 шт.alut») */
.lcard__badges { top: 46px; bottom: auto; right: auto; flex-direction: column; align-items: flex-start; gap: 5px; }
@media (max-width: 700px) { .lcard__badges { top: 40px; } }
/* «ТОП»-лот не теряет золотую обводку при наведении */
.lcard--top:hover { box-shadow: inset 0 0 0 1px rgba(255, 179, 71, .28), 0 9px 0 rgb(0 0 0 / .42); }
/* подъём карточек и кнопок — только с мышью (на телефоне после касания карточка оставалась приподнятой) */
@media (hover: none) {
  .lcard:hover, .seller-tile:hover, .hx-review:hover, :root .ct-card:hover { transform: none; }
  .btn-shimmer:hover, .btn--dark:hover, .tg__more:hover, .auth2-submit:hover, .hx-help__btn:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lcard__ph-hero, .ct-card__ph--art .ct-card__ph-hero, .ref-cta.ax .ax__hero { transition: none; }
  .lcard:hover .lcard__ph-hero, .ct-card:hover .ct-card__ph--art .ct-card__ph-hero, .ref-cta.ax:hover .ax__hero { transform: none; scale: none; rotate: none; }
  .btn-shimmer, .btn--dark, .tg__more, .auth2-submit, .hx-help__btn, .btn-ghost, .btn--light, .hx-link { transition: filter .2s, background .2s; }
  .btn-shimmer:hover, .btn--dark:hover, .btn-shimmer:active, .btn--dark:active, .btn-ghost:active, .btn--light:active { transform: none; }
}
/* выключенная кнопка не «нажимается» */
:is(.btn-shimmer, .btn--dark, .auth2-submit, .btn-ghost):disabled { transform: none !important; box-shadow: inset 0 -2px 0 rgb(0 0 0 / .2); }
/* кнопки, что жили своими классами: топ-100 и финальные призывы на «Трофеях»/«Комиссии»/«Индексе доверия» */
.tp-btn--main, .rw-cta { box-shadow: inset 0 -4px 0 rgb(0 0 0 / .24), inset 0 1px 0 rgb(255 255 255 / .2); }
.tp-btn:not(.tp-btn--main) { box-shadow: inset 0 -3px 0 rgb(0 0 0 / .32); }
/* «Комиссия → Как это работает»: щит-эмодзи (его меняют на маленький SVG) — того же размера, что Σ ↓ ✓ */
.tr-factor__w b :is(svg, img, .emo-ico) { width: 32px; height: 32px; }
/* лот без своих фото: герой целиком в обложке (облака под ящиком не обрезаются) */
.lcard__ph--art .lcard__ph-hero { width: auto; height: 74%; max-width: 62%; max-height: none; margin-top: 8%; }
/* значок игры в фильтре каталога: у CS2 вместо значка — широкая обложка, без масштаба виден её серый край */
.cat-chip__ico { background-size: cover; background-position: 50% 30%; background-repeat: no-repeat; }
/* шапки-иллюстрации: место под гирлянду осенней темы, ширина — как у содержимого ниже */
.art-head.ax { margin-top: 84px; }
.rw-hero.art-head { width: min(1080px, 100% - 32px); }
.sup-hero.ax .sup-hero__sub { max-width: 520px; }   /* текст не заходит на маяк сцены */
/* подпись под «20 %» — читается поверх шариков сцены */
.ref-cta.ax .ref-cta__pct-note { color: rgb(255 255 255 / .82); }
/* карточка поддержки рядом с вопросами: кнопка в одну строку; на телефоне круг сверху, текст под ним */
.hx-help__btn { max-width: none !important; white-space: nowrap; }
@media (min-width: 761px) and (max-width: 1080px) {
  .hx-help__text, .hx-cta-card.ax .hx-sub { max-width: 52%; }
}
@media (max-width: 760px) {
  .hx-help { --hero-w: 150px; --hero-top: -48px; --hero-right: 50%; padding: 108px 20px 22px; }
  .hx-help .ax__hero { translate: 50% 0; }
  .hx-help > :not(.ax__surface):not(.ax__hero) { max-width: none; }
  .hx-help .ax__surface::before { background: linear-gradient(180deg, rgb(var(--shade) / .1) 0%, rgb(var(--shade) / .8) 40%, rgb(var(--shade) / .96) 62%); }
  /* вход: ключ с замком сверху по центру, текст под ним во всю ширину */
  .auth2-art.ax { --hero-w: 120px; --hero-top: -40px; --hero-right: 50%; padding: 92px 20px 20px; text-align: center; }
  .auth2-art.ax .ax__hero { translate: 50% 0; }
  .auth2-art.ax .ax__surface::before { background: linear-gradient(180deg, rgb(var(--shade) / .1), rgb(var(--shade) / .9) 55%); }
  .rw-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* профиль продавца: вкладки «Лоты / Отзывы / Ачивки» делали страницу шире экрана */
  .sp-main { grid-template-columns: minmax(0, 1fr); }
  .sp-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .sp-tab { padding: 9px 12px; gap: 6px; }
}
/* «Популярные направления»: цена в чипе не разрывается («89 / ₽»), заголовок читается поверх предмета */
.tg-chip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tg-card__title { text-shadow: 0 2px 0 rgb(0 0 0 / .45); }
@media (min-width: 761px) and (max-width: 1180px) {
  .tg-card:not(.tg-card--wide) .tg-card__hero:not(.tg-card__hero--icon):not(.tg-card__hero--mono) { width: 130px; height: 130px; top: -24px; right: -14px; }
}
/* главная на планшете: две колонки до 860 px, чтобы сцена с сейфом была на первом экране */
@media (min-width: 861px) and (max-width: 1080px) {
  .hx-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 28px; }
  .hx-stage { width: 100%; margin: 0; height: 560px; }
  .hx-stage__vault { width: 190px; }
}
/* ---- проверка «глазами покупателя» (2026-10-05) ---- */
/* значок игры без иконки (CS2) — нарисованный предмет на плашке цвета игры (main.js gameMark) */
.game-mark--hero { background: color-mix(in srgb, var(--tone, #6C5CFF) 24%, var(--bg-1)) !important; }
.game-mark--hero img { object-fit: contain !important; padding: 12%; box-sizing: border-box; }
/* лот без фото на своей странице: сцена и предмет игры (product.js gallery) */
.pdp-gal__main--art { overflow: hidden; }
.pdp-gal__main > img.pdp-gal__scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.pdp-gal__main > img.pdp-gal__hero {
  position: relative; width: auto; height: 72%; max-width: 60%; object-fit: contain;
  filter: drop-shadow(0 16px 14px rgba(0,0,0,.38));
}
/* знаки Google и Telegram на кнопках входа — без рамки-плашки */
.auth2-social__ico--brand { border-radius: 50%; overflow: hidden; }
.auth2-social__ico--brand svg { display: block; width: 18px; height: 18px; }
.auth2-socials:not(:has(> :nth-child(3))) { grid-template-columns: repeat(2, 1fr); }
/* пустые разделы (0 лотов) покупателю не показываем — ни строкой под поиском, ни в окне «Игры» */
.cat-chip.is-empty:not(.is-active) { display: none; }
/* статистика отзывов на телефоне: дата и числа не рвутся посреди слова — сетка в 2 колонки */
@media (max-width: 760px) {
  .rv-summary__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rv-fact b { overflow-wrap: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
/* кнопки, которые не должны переноситься */
#btn-offer, .sp-hero .btn, .p-head .btn { white-space: nowrap; }
/* значки на обложке карточки лота на телефоне — в строку и не больше двух: столбик закрывал надпись на фото */
@media (max-width: 700px) {
  .lcard__badges { flex-direction: row; flex-wrap: nowrap; right: 8px; overflow: hidden; }
  .lcard__badge:nth-child(n+3) { display: none; }
}
/* узкие карточки (две в ряд на телефоне, на странице продавца): ник продавца не обрезается до «N…» — прячем,
   остаётся аватар, рейтинг и цена */
.lcard { container-type: inline-size; }
@container (max-width: 230px) {
  .lcard__name, .lcard__rating { display: none; }
}
/* 360 px: лоты на главной снова по два в ряд (раньше — по одному, страница выходила огромной) */
@media (max-width: 400px) {
  .lots-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
}
/* осенняя гирлянда под шапкой не ложится на заголовок страницы */
:root[data-event-on="1"] body:not(.page-chats) > main { padding-top: 12px; }
/* в чатах листья гирлянды касались аватара и имени в шапке переписки */
@media (min-width: 761px) { :root[data-event-on="1"] body.page-chats .chx-head { padding-top: 20px; } }
/* «Открыть каталог» над кнопкой «Все игры и разделы» — на телефоне лишняя строка */
@media (max-width: 760px) { .tg__all { display: none; } }
/* демо-витрина (src/demoflag.js): пометка «Демо» на карточках, вместо «Купить» — «Пример», на странице лота — пояснение */
.lcard__badge--demo, .ct-badge--demo { border: 0; background: #e2e8f0; color: #1e293b; }
@media (max-width: 700px) { .lcard__badge--demo { display: inline-flex !important; } }   /* узкая карточка прячет лишние значки — этот нужен */
.ct-card__buy--demo { background: rgba(255, 255, 255, .08) !important; color: var(--txt-2) !important; box-shadow: none !important; }
.pdp-state--demo { border-color: rgba(148, 163, 184, .4); background: color-mix(in srgb, #94a3b8 8%, var(--bg-1)); }
/* /privacy: в таблице длинные строки не переносились — страница уезжала вбок */
.legal-table { width: 100%; table-layout: fixed; }
.legal-table td, .legal-table th { white-space: normal; overflow-wrap: anywhere; }
/* /rewards: карточки ачивок — сплошная подложка, узор фона под текстом не просвечивает */
.ach-card { background-color: var(--bg-1); }
/* профиль продавца: подпись залога — отдельной строкой, без точки в начале */
.p-deposit__lbl { display: block; }
/* «Все лоты»: «Counter-Strike 2» не отрывает «2», мета игры — в две строки, а не обрезком */
.ct-app__meta { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* «Популярные направления» на 1440: предмет меньше и правее — белые названия не ложатся на светлые рисунки */
@media (min-width: 1181px) and (max-width: 1600px) {
  .tg__grid[data-cols="5"] .tg-card:not(.tg-card--wide) .tg-card__hero:not(.tg-card__hero--icon):not(.tg-card__hero--mono) { width: 138px; height: 138px; right: -16px; top: -26px; }
}
/* шесть в ряд (экран от 1700px) — карточка такой же ширины, как пять в ряд на 1440 */
.tg__grid[data-cols="6"] .tg-card:not(.tg-card--wide) .tg-card__hero:not(.tg-card__hero--icon):not(.tg-card__hero--mono) { width: 138px; height: 138px; right: -16px; top: -26px; }
/* ---- проверка страниц после входа (2026-10-05) ---- */
/* атрибут hidden — всегда скрывает: у части блоков (.set-code, .token-reveal…) свой display перебивал его,
   и формы «Код из письма», пустая рамка токена висели на виду */
[hidden]:not([hidden="until-found"]) { display: none !important; }
/* панели, сквозь которые просвечивал узор фона: сделка, колокольчик, арбитраж */
:root .dl2-safety { background-color: color-mix(in srgb, rgb(251, 191, 36) 7%, var(--bg-0)); }
:root .bell__panel { background: var(--bg-1); }
:root :is(.ar-steps li, .ar-tabs, .ar-sort) { background-color: color-mix(in srgb, #fff 3%, var(--bg-0)); }
:root :is(.ar-pinned, .ar-btn) { background-color: color-mix(in srgb, #fff 5%, var(--bg-0)); }
:root .ar-row { background-color: color-mix(in srgb, #fff 2.5%, var(--bg-0)); }
/* чаты и правила в осенней теме — тоже без узора (правило выше проигрывало осеннему по силе) */
:root[data-event-on="1"]:is(:has(.chx), :has(main.legal)) { background-image: none; }
/* кнопки форм — с той же «игровой» кромкой, что остальные */
.form__submit { box-shadow: inset 0 -4px 0 rgb(0 0 0 / .24), inset 0 1px 0 rgb(255 255 255 / .2); }
.form__submit:active:not(:disabled) { transform: translateY(1px); box-shadow: inset 0 -2px 0 rgb(0 0 0 / .24); }
/* мастер лота: «Выбрать файлы» не выглядит выключенной; «Отменить ×» не разваливается */
.wiz .drop-pick { color: #fff !important; opacity: 1 !important; box-shadow: inset 0 -3px 0 rgb(0 0 0 / .24); }
.wiz__head a { white-space: nowrap; }
/* арбитраж на телефоне: карточка дела — в одну колонку, сумма и статус отдельной строкой */
@media (max-width: 760px) {
  .ar-row { grid-template-columns: minmax(0, 1fr) !important; }
  .ar-row__end { flex-direction: row; align-items: center; justify-content: space-between; }
}
/* настройки → безопасность: карточки не оставляют дыру под левой колонкой */
.set-grid { align-items: start; grid-auto-flow: row dense; }