/* LUNADROP — компоненты: редкости, карточки, поля, модалки, тосты */

/* ---------------------------------------------------------- редкости ---- */

[data-r='grey']   { --rc: var(--r-grey);   --rc-10: rgba(143, 151, 168, .10); --rc-24: rgba(143, 151, 168, .24); --rc-45: rgba(143, 151, 168, .45); }
[data-r='cyan']   { --rc: var(--r-cyan);   --rc-10: rgba(75, 159, 220, .10);  --rc-24: rgba(75, 159, 220, .24);  --rc-45: rgba(75, 159, 220, .45); }
[data-r='blue']   { --rc: var(--r-blue);   --rc-10: rgba(66, 87, 255, .12);   --rc-24: rgba(66, 87, 255, .26);   --rc-45: rgba(66, 87, 255, .45); }
[data-r='purple'] { --rc: var(--r-purple); --rc-10: rgba(138, 60, 255, .12);  --rc-24: rgba(138, 60, 255, .26);  --rc-45: rgba(138, 60, 255, .45); }
[data-r='pink']   { --rc: var(--r-pink);   --rc-10: rgba(226, 50, 230, .12);  --rc-24: rgba(226, 50, 230, .26);  --rc-45: rgba(226, 50, 230, .45); }
[data-r='red']    { --rc: var(--r-red);    --rc-10: rgba(255, 53, 53, .12);   --rc-24: rgba(255, 53, 53, .26);   --rc-45: rgba(255, 53, 53, .45); }
[data-r='gold']   { --rc: var(--r-gold);   --rc-10: rgba(255, 177, 20, .13);  --rc-24: rgba(255, 177, 20, .28);  --rc-45: rgba(255, 177, 20, .5); }

/* ------------------------------------------------- карточка предмета ---- */

.item {
  position: relative;
  display: flex; flex-direction: column;
  padding: 14px 14px 12px;
  background:
    radial-gradient(125% 85% at 50% 0%, var(--rc-24), transparent 58%),
    linear-gradient(180deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: transform .25s var(--ease-snap), border-color .25s, box-shadow .3s;
  isolation: isolate;
  min-height: 244px;
}
.item::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--rc);
  border-radius: 12px 12px 0 0;
  box-shadow: 0 0 18px -2px var(--rc);
}
.item:hover {
  transform: translateY(-5px);
  border-color: var(--rc-45);
  box-shadow: 0 22px 40px -20px var(--rc), 0 0 0 1px var(--rc-24) inset;
}
.item:hover::before { box-shadow: 0 0 26px -2px var(--rc); }
.item__img {
  height: 142px;
  display: grid; place-items: center;
  margin: 10px 0 12px;
}
.item__img img {
  max-height: 142px; width: auto;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .55));
  transition: transform .35s var(--ease-snap);
}
.item:hover .item__img img { transform: scale(1.09) rotate(-1.5deg); }

.item__weapon {
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tx-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.item__name {
  font: 600 14.5px/1.25 var(--body);
  color: var(--tx);
  margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.item__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: auto; padding-top: 9px;
}
.item__price { font: 700 15px/1 var(--mono); color: var(--moon); }
.item__wear {
  font: 700 9px/1 var(--mono);
  letter-spacing: .06em;
  padding: 4px 6px;
  border-radius: 6px;
  color: var(--rc);
  background: var(--rc-10);
  border: 1px solid var(--rc-24);
}
.item__st {
  position: absolute; top: 10px; left: 11px;
  font: 700 8.5px/1 var(--mono);
  letter-spacing: .08em;
  color: #ff8f3f;
  background: rgba(255, 143, 63, .12);
  border: 1px solid rgba(255, 143, 63, .3);
  border-radius: 5px;
  padding: 3px 5px;
}
.item__chance {
  position: absolute; top: 10px; right: 11px;
  font: 600 10px/1 var(--mono);
  color: var(--tx-2);
  background: rgba(0, 0, 0, .45);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 4px 6px;
}

/* действия на карточке инвентаря */
.item__acts {
  position: absolute; right: 8px; top: 50%;
  transform: translateY(-58%);
  display: flex; flex-direction: column; gap: 6px;
  opacity: .6;
  transition: opacity .2s, transform .25s var(--ease-snap);
}
.item:hover .item__acts { transform: translateY(-58%) translateX(-1px); }
.item:hover .item__acts { opacity: 1; }
.iact {
  width: 30px; height: 30px;
  display: grid; place-items: center;
  background: rgba(10, 8, 15, .85);
  border: 1px solid #2c2739;
  border-radius: 9px;
  color: var(--tx-2);
  backdrop-filter: blur(4px);
  transition: all .2s var(--ease-snap);
}
.iact:hover { transform: translateY(-2px) scale(1.08); }
.iact--sell:hover { color: #0a1f16; background: var(--mint); border-color: var(--mint); }
.iact--out:hover { color: #17000c; background: var(--pink); border-color: var(--pink); }
.iact .ic { width: 14px; height: 14px; }

.item.is-picked {
  border-color: var(--mint);
  box-shadow: 0 0 0 1px var(--mint) inset, 0 12px 30px -20px var(--mint);
}
.item.is-picked::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(53, 224, 161, .07);
  pointer-events: none;
}
.item.is-locked { opacity: .35; filter: grayscale(.7); pointer-events: none; }
.item--pick { cursor: pointer; }

.item--sm { min-height: 176px; padding: 11px; }
.item--sm .item__img { height: 86px; margin: 4px 0 8px; }
.item--sm .item__img img { max-height: 86px; }
.item--sm .item__name { font-size: 12.5px; }
.item--sm .item__price { font-size: 13px; }
.item--sm .item__acts { right: 6px; gap: 5px; }
.item--sm .iact { width: 26px; height: 26px; border-radius: 8px; }
.item--sm .iact .ic { width: 12px; height: 12px; }

/* ------------------------------------------------------ сетка списка ---- */

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(238px, 1fr));
  gap: 14px;
}
.grid--sm { grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)); gap: 12px; }

.empty {
  padding: 54px 20px;
  text-align: center;
  color: var(--tx-3);
  border: 1px dashed #2a2436;
  border-radius: 14px;
  background: rgba(255, 255, 255, .012);
}
.empty b { display: block; font-family: var(--head); font-size: 16px; color: var(--tx-2); margin-bottom: 8px; }

/* ---------------------------------------------------------- панели ---- */

.panel {
  position: relative;
  background: linear-gradient(180deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px;
}
.panel::before {
  content: '';
  position: absolute; left: 18px; right: 18px; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .12), transparent);
}
.panel__head {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 14px;
}
.panel__head h3 { font-size: 16px; letter-spacing: -.02em; }

/* ------------------------------------------------------------ поля ---- */

.field {
  display: flex; align-items: center; gap: 9px;
  height: 44px; padding: 0 14px;
  background: #0e0c15;
  border: 1px solid #272232;
  border-radius: 12px;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.field:focus-within { border-color: var(--pink); box-shadow: 0 0 0 3px rgba(255, 47, 147, .12); }
.field input {
  flex: 1; min-width: 0;
  background: none; border: 0; outline: 0;
  font: 600 14px/1 var(--body);
  color: var(--tx);
}
.field input::placeholder { color: var(--tx-3); }
.field .ic { color: var(--tx-3); }
.field--mono input { font-family: var(--mono); font-size: 13px; }

.chips { display: flex; gap: 7px; flex-wrap: wrap; }
.chip {
  height: 36px; padding: 0 15px;
  display: inline-flex; align-items: center; gap: 8px;
  font: 600 12.5px/1 var(--body);
  letter-spacing: -.01em;
  color: var(--tx-2);
  background: rgba(255, 255, 255, .028);
  border: 1px solid #272232;
  border-radius: 10px;
  transition: all .18s var(--ease);
}
.chip:hover { color: var(--tx); background: rgba(255, 255, 255, .06); border-color: #3a3450; }
.chip.is-on {
  color: #fff;
  background: linear-gradient(180deg, #ff54a8, #ec1a7f);
  border-color: transparent;
  box-shadow: 0 6px 18px -10px var(--pink);
}
.chip--r { padding-left: 11px; }
.chip--r::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--rc); box-shadow: 0 0 9px var(--rc);
}

.switch {
  position: relative;
  width: 46px; height: 26px;
  background: #14111c;
  border: 1px solid #2c2739;
  border-radius: 999px;
  transition: background .25s, border-color .25s;
  flex: none;
}
.switch::after {
  content: '';
  position: absolute; top: 3px; left: 3px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--tx-3);
  transition: transform .28s var(--ease-snap), background .25s;
}
.switch.is-on { background: rgba(255, 47, 147, .22); border-color: var(--pink); }
.switch.is-on::after { transform: translateX(20px); background: var(--pink); box-shadow: 0 0 10px var(--pink); }

/* --------------------------------------------------------- модалка ---- */

.modal-back {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(4, 3, 7, .76);
  backdrop-filter: blur(7px);
  display: grid; place-items: center;
  padding: 20px;
  animation: fade .22s var(--ease);
}
@keyframes fade { from { opacity: 0; } }

.modal {
  position: relative;
  width: min(540px, 100%);
  max-height: 88vh;
  overflow: auto;
  background: linear-gradient(180deg, #17141f, #100e17);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 24px;
  animation: modalin .34s var(--ease-snap);
}
.modal--wide { width: min(860px, 100%); }
@keyframes modalin { from { opacity: 0; transform: translateY(22px) scale(.97); } }

.modal__title { font-size: 21px; letter-spacing: -.03em; margin-bottom: 4px; }
.modal__sub { color: var(--tx-2); font-size: 13px; margin: 0 0 18px; }
.modal__x {
  position: absolute; top: 16px; right: 16px;
  width: 30px; height: 30px;
  display: grid; place-items: center;
  color: var(--tx-3);
  border: 1px solid var(--line);
  transition: all .2s;
}
.modal__x:hover { color: var(--danger); border-color: var(--danger); transform: rotate(90deg); }

/* ----------------------------------------------------------- тосты ---- */

.toasts {
  position: fixed; right: 18px; bottom: 18px; z-index: 200;
  display: flex; flex-direction: column; gap: 9px;
  pointer-events: none;
}
.toast {
  display: flex; align-items: center; gap: 11px;
  min-width: 240px; max-width: 360px;
  border-radius: 12px;
  padding: 13px 16px;
  background: linear-gradient(120deg, #16121e, #100e16);
  border: 1px solid var(--line);
  border-left: 3px solid var(--tone, var(--pink));
  box-shadow: 0 18px 40px -20px #000;
  animation: toastin .4s var(--ease-snap);
  font-size: 13px;
}
.toast.out { animation: toastout .3s var(--ease) forwards; }
.toast b { display: block; font: 700 12px/1.3 var(--body); }
.toast small { color: var(--tx-3); font-size: 11.5px; }
.toast__dot { width: 8px; height: 8px; background: var(--tone, var(--pink)); box-shadow: 0 0 10px var(--tone, var(--pink)); flex: none; }
.toast--ok   { --tone: var(--mint); }
.toast--warn { --tone: var(--warn); }
.toast--err  { --tone: var(--danger); }
@keyframes toastin { from { opacity: 0; transform: translateX(40px) scale(.96); } }
@keyframes toastout { to { opacity: 0; transform: translateX(40px); } }

/* -------------------------------------------------------- прогресс ---- */

.bar { height: 7px; background: #0e0c15; border: 1px solid #241f30; border-radius: 999px; overflow: hidden; }
.bar i {
  display: block; height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pink), var(--pink-2));
  box-shadow: 0 0 14px -2px var(--pink);
  transition: width .6s var(--ease);
}

/* ------------------------------------------------------- статистика ---- */

.stat {
  position: relative;
  padding: 15px 16px;
  background: linear-gradient(160deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color .25s, transform .25s var(--ease-snap);
}
.stat:hover { border-color: var(--tx-3); transform: translateY(-2px); }
.stat span { font: 500 11.5px/1 var(--body); letter-spacing: -.01em; color: var(--tx-3); }
.stat b { display: block; font: 700 22px/1 var(--mono); margin-top: 10px; color: var(--tx); }
.stat--pink b { color: var(--pink-2); }
.stat--gold b { color: var(--moon); }
.stat--mint b { color: var(--mint); }

/* ------------------------------------------ таймер и статус вывода ---- */

.item__timer,
.item__sent {
  position: absolute; top: 10px; right: 11px;
  display: flex; align-items: center; gap: 6px;
  padding: 5px 8px;
  border-radius: 8px;
  font: 700 10.5px/1 var(--mono);
  backdrop-filter: blur(4px);
}
.item__timer {
  color: var(--warn);
  background: rgba(255, 176, 32, .12);
  border: 1px solid rgba(255, 176, 32, .35);
}
.item__timer-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--warn);
  box-shadow: 0 0 8px var(--warn);
  animation: blink 1.4s infinite;
}
.item__sent {
  color: var(--mint);
  background: rgba(53, 224, 161, .12);
  border: 1px solid rgba(53, 224, 161, .35);
}
.item__sent .ic { width: 12px; height: 12px; }

/* --------------------------------------------------- стример-мод ---- */

body.is-stream [data-private] {
  filter: blur(7px);
  transition: filter .2s;
  user-select: none;
}
body.is-stream [data-private]:hover { filter: blur(0); }
/* Стример прячет не баланс, а логотип: по нему сайт узнают на стриме.
   Баланс при этом остаётся читаемым — он нужен самому стримеру. */
body.is-stream .logo { filter: blur(5px); opacity: .75; }
body.is-stream .logo:hover { filter: blur(0); opacity: 1; }
body.is-stream .topbar::before {
  content: 'STREAM';
  position: absolute; left: 50%; top: 6px;
  transform: translateX(-50%);
  font: 700 9px/1 var(--mono);
  letter-spacing: .28em;
  color: var(--pink);
  opacity: .7;
  z-index: 5;
}

/* ======================================================= чат поддержки ==== */

.sup { position: fixed; right: 22px; bottom: 22px; z-index: 110; }

.sup__bubble {
  position: relative;
  width: 62px; height: 62px;
  display: grid; place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(160deg, #ff54a8, #a3115c 85%);
  box-shadow: 0 14px 34px -12px rgba(255, 47, 147, .95), inset 0 1px 0 rgba(255, 255, 255, .3);
  transition: transform .22s var(--ease-snap), box-shadow .3s, filter .2s;
}
.sup__bubble .ic { width: 26px; height: 26px; }
.sup__bubble:hover { transform: translateY(-3px) scale(1.05); filter: brightness(1.08); }
.sup__bubble:active { transform: scale(.94); }
.sup__bubble::after {                    /* мягкая пульсация, зовёт нажать */
  content: '';
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 2px solid rgba(255, 47, 147, .55);
  animation: suppulse 2.6s var(--ease) infinite;
}
@keyframes suppulse {
  0% { transform: scale(1); opacity: .7; }
  70%, 100% { transform: scale(1.5); opacity: 0; }
}
.sup.is-open .sup__bubble::after { display: none; }

.sup__badge {
  position: absolute; top: 2px; right: 2px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--mint);
  border: 2px solid #0d0b13;
}
.sup__badge.hidden { display: none; }

/* --------------------------------------------------------- окно чата ---- */

.sup__panel {
  position: absolute; right: 0; bottom: 78px;
  width: min(360px, calc(100vw - 32px));
  height: min(480px, calc(100vh - 140px));
  display: flex; flex-direction: column;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(180deg, #17131f, #0d0b13);
  border: 1px solid #2e2740;
  box-shadow: 0 30px 70px -24px rgba(0, 0, 0, .95);
  opacity: 0; visibility: hidden;
  transform: translateY(14px) scale(.97);
  transform-origin: 100% 100%;
  transition: opacity .22s var(--ease), transform .26s var(--ease-snap), visibility .26s;
}
.sup.is-open .sup__panel { opacity: 1; visibility: visible; transform: none; }

.sup__head {
  display: flex; align-items: center; gap: 11px;
  padding: 14px 14px 13px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 47, 147, .14), transparent);
}
.sup__ava {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, rgba(255, 47, 147, .35), rgba(255, 47, 147, .08));
  border: 1px solid rgba(255, 47, 147, .4);
}
.sup__ava img { width: 20px; height: 20px; }
.sup__who b { display: block; font: 700 14px/1.2 var(--body); }
.sup__who small { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--tx-3); }
.sup__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--mint); box-shadow: 0 0 8px var(--mint);
}
.sup__x {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: 9px;
  color: var(--tx-3);
  transition: background .2s, color .2s;
}
.sup__x:hover { background: rgba(255, 255, 255, .06); color: var(--tx); }
.sup__x .ic { width: 13px; height: 13px; }

.sup__feed {
  flex: 1; min-height: 0;
  overflow-y: auto;
  padding: 16px 14px;
  display: flex; flex-direction: column; gap: 10px;
}

.sup__msg {
  max-width: 82%;
  padding: 10px 13px 8px;
  border-radius: 14px;
  animation: supin .28s var(--ease-snap);
}
@keyframes supin { from { opacity: 0; transform: translateY(8px); } }
.sup__msg--bot {
  align-self: flex-start;
  background: rgba(255, 255, 255, .055);
  border: 1px solid var(--line);
  border-bottom-left-radius: 5px;
}
.sup__msg--agent {
  align-self: flex-start;
  background: linear-gradient(160deg, rgba(53, 224, 161, .16), rgba(53, 224, 161, .06));
  border: 1px solid rgba(53, 224, 161, .4);
  border-bottom-left-radius: 5px;
}
.sup__agent { display: block; margin-bottom: 3px; font: 700 10px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mint); }
.sup__msg--me {
  align-self: flex-end;
  background: linear-gradient(160deg, rgba(255, 47, 147, .32), rgba(255, 47, 147, .14));
  border: 1px solid rgba(255, 47, 147, .4);
  border-bottom-right-radius: 5px;
}
.sup__text { display: block; font-size: 13.5px; line-height: 1.5; color: var(--tx); }
.sup__time { display: block; margin-top: 4px; font: 600 9.5px/1 var(--mono); color: var(--tx-3); text-align: right; }

.sup__typing span { display: flex; gap: 4px; padding: 3px 2px; }
.sup__typing i {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--tx-3);
  animation: suptype 1.1s infinite;
}
.sup__typing i:nth-child(2) { animation-delay: .15s; }
.sup__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes suptype { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

.sup__foot {
  display: flex; align-items: center; gap: 8px;
  padding: 11px 12px;
  border-top: 1px solid var(--line);
  background: rgba(0, 0, 0, .25);
}
.sup__input {
  flex: 1; min-width: 0;
  height: 40px; padding: 0 13px;
  border-radius: 11px;
  background: #0e0c15;
  border: 1px solid #272232;
  outline: 0;
  font: 500 13.5px/1 var(--body);
  color: var(--tx);
  transition: border-color .2s, box-shadow .2s;
}
.sup__input::placeholder { color: var(--tx-3); }
.sup__input:focus { border-color: var(--pink); box-shadow: 0 0 0 3px rgba(255, 47, 147, .12); }
.sup__send {
  width: 40px; height: 40px; flex: none;
  display: grid; place-items: center;
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(180deg, #ff54a8, #ec1a7f);
  transition: transform .18s var(--ease-snap), filter .2s;
}
.sup__send .ic { width: 16px; height: 16px; }
.sup__send:hover { transform: translateY(-1px); filter: brightness(1.08); }

@media (max-width: 560px) {
  .sup { right: 14px; bottom: 14px; }
  .sup__bubble { width: 54px; height: 54px; }
  .sup__panel { bottom: 68px; height: min(440px, calc(100vh - 120px)); }
}

/* апгрейды в ленте помечаем стрелкой — видно, что скин не из кейса */
.drop--up { border-color: color-mix(in srgb, var(--rc) 55%, transparent); }
.drop__kind {
  position: absolute; top: 4px; left: 4px;
  width: 13px; height: 13px;
  color: var(--rc);
  opacity: .9;
}

/* знак валюты справа в поле суммы пополнения */
.dep__cur { font-weight: 700; color: var(--muted, #9aa3b2); padding-left: 8px; white-space: nowrap; }

/* кнопки «продать» и «вывести» на карточке — крупнее и заметнее */
.item__acts { gap: 8px; right: 10px; opacity: .8; }
.item__acts .iact { width: 38px; height: 38px; border-radius: 11px; }
.item__acts .iact .ic { width: 18px; height: 18px; }
.item--sm .item__acts .iact { width: 32px; height: 32px; }
.item--sm .item__acts .iact .ic { width: 15px; height: 15px; }

/* заглушка на весь экран: техработы или блокировка аккаунта */
.gate {
  position: fixed; inset: 0; z-index: 10000;
  display: grid; place-items: center; padding: 24px;
  background: radial-gradient(60% 50% at 50% 40%, rgba(255, 47, 147, .16), transparent 70%), rgba(8, 6, 12, .97);
  backdrop-filter: blur(10px);
}
.gate__box { max-width: 460px; text-align: center; display: grid; gap: 14px; justify-items: center; }
.gate__logo { width: 190px; height: auto; margin-bottom: 8px; }
.gate__title { font: 700 26px/1.2 var(--head); letter-spacing: -.02em; }
.gate__note { margin: 0; color: var(--tx-2); font-size: 15px; line-height: 1.5; }
body.is-gated { overflow: hidden; }
body.is-gated > :not(#gate):not(#toasts) { pointer-events: none; user-select: none; filter: blur(6px); }

/* «Продать всё · сумма» — крупная, заметная, в золоте денег */
.btn--sellall {
  height: 48px; padding: 0 20px; gap: 10px;
  font-size: 15px; border-radius: 12px;
  --btn-bg: rgba(255, 177, 20, .1);
  --btn-bd: rgba(255, 177, 20, .45);
  color: #ffe2a6;
}
.btn--sellall .ic { width: 18px; height: 18px; color: var(--r-gold); }
.btn--sellall b { color: var(--moon); font-size: 15px; padding-left: 10px; border-left: 1px solid rgba(255, 177, 20, .3); }
.btn--sellall:hover { --btn-bd: var(--r-gold); box-shadow: 0 10px 26px -14px var(--r-gold); }

/* ===== полоска редкости ровно по скруглению карточки, выбор — внешняя обводка =====
   Раньше полоска 3 px со скруглением 12 px сужалась к краям и вылезала за
   контур, а выбор рисовался внутренней обводкой поверх неё. */
.item::before {
  inset: 0; height: auto;
  border-radius: 11px;
  background: linear-gradient(180deg, var(--rc) 0 3px, var(--rc-24) 3px, transparent 18px);
  box-shadow: none;
  pointer-events: none;
}
.item:hover::before { box-shadow: none; }
.item.is-picked {
  border-color: var(--mint);
  box-shadow: 0 0 0 1px var(--mint), 0 14px 30px -18px var(--mint);
}
.item.is-picked::after { border-radius: 11px; background: rgba(53, 224, 161, .05); }

/* скины, значки StatTrak™ и качества не выделяются и не перетаскиваются мышью */
.item, .item *, .rcell, .rcell *, .uptarget, .uptarget *, .drop, .drop *, .case, .case * {
  -webkit-user-select: none; user-select: none;
}
.item img, .rcell img, .uptarget img, .drop img, .case img, .promo4 img { -webkit-user-drag: none; user-drag: none; }