/* ZALP: окно «Коллекция» — новая раскладка штатного меню предметов survev (#modal-customize).
   Включается, только когда zalp-coll.js перестроил разметку (класс .zc), иначе остаётся старый вид.
   Свойства display, которые переключает игра (правые панели эмоций/прицела, сортировка), не трогаем. */
#modal-customize.zc {
  --zc-ink: #1a1340;
  --zc-out-sm: 0 1px 0 #1a1340, 1px 0 0 #1a1340, -1px 0 0 #1a1340, 0 -1px 0 #1a1340;
  --zc-out: 0 2px 0 #1a1340, 2px 0 0 #1a1340, -2px 0 0 #1a1340, 0 -2px 0 #1a1340;
  --zc-r0: #b9b3dc;
  --zc-r1: #e6e2f8;
  --zc-r2: #5fe35d;
  --zc-r3: #37c9ff;
  --zc-r4: #c873ff;
  --zc-r5: #ffa32f;
  --zc-top: 100px;
}
:root:not(#zz#zz) #modal-customize.zc .ad-block-loadouts-left { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-wrapper {
  position: fixed !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  animation: none !important;
}

/* ---------- главная панель ---------- */
:root:not(#zz#zz) #modal-customize.zc #modal-content-left {
  position: fixed !important;
  left: max(16px, 3vw) !important;
  top: calc(50% + var(--zc-top) / 2 - 8px) !important;
  transform: translateY(-50%) !important;
  width: min(880px, 62vw) !important;
  height: min(700px, calc(100vh - var(--zc-top) - 24px)) !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  padding: 12px 16px 16px !important;
  border: 4px solid var(--zc-ink) !important;
  border-radius: 28px !important;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0 14px, transparent 14px 28px),
    linear-gradient(180deg, #4b3cc4 0%, #3527a0 55%, #2a1e84 100%) !important;
  box-shadow: 0 6px 0 var(--zc-ink), 0 18px 40px rgba(10, 4, 40, .55), inset 0 3px 0 rgba(255, 255, 255, .16) !important;
  color: #fff !important;
  overflow: hidden !important;
  animation: zc-in .26s cubic-bezier(.2, 1.4, .4, 1);
}
@keyframes zc-in { from { opacity: 0; transform: translateY(-50%) scale(.95); } }
:root:not(#zz#zz) #modal-customize.zc[data-zc-cat="emote"] #modal-content-left,
:root:not(#zz#zz) #modal-customize.zc[data-zc-cat="crosshair"] #modal-content-left {
  width: min(780px, calc(100vw - 330px - 9vw - 150px)) !important;
}

/* ---------- шапка ---------- */
:root:not(#zz#zz) #modal-customize.zc .zc-head { display: flex; align-items: center; gap: 12px; flex: none; min-height: 54px; }
:root:not(#zz#zz) #modal-customize.zc .zc-head-art { width: 58px; height: 58px; flex: none; margin: -6px 0 -4px; filter: drop-shadow(0 3px 0 rgba(26, 19, 64, .7)); animation: zc-bob 3s ease-in-out infinite; }
@keyframes zc-bob { 50% { transform: translateY(-4px) rotate(-5deg); } }
:root:not(#zz#zz) #modal-customize.zc .zc-titles { flex: 1; min-width: 0; }
:root:not(#zz#zz) #modal-customize.zc .zc-title { font-weight: 900; font-size: 30px; line-height: 1; color: #ffd21f; text-shadow: var(--zc-out), 0 4px 0 var(--zc-ink); letter-spacing: .5px; text-transform: uppercase; white-space: nowrap; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-cat-title {
  position: static !important;
  display: block !important;
  margin: 5px 0 0 !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  background: none !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  color: #d9d2ff !important;
  text-shadow: var(--zc-out-sm) !important;
  text-transform: lowercase !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-cat-title::first-letter { text-transform: uppercase; }

:root:not(#zz#zz) #modal-customize.zc .zc-prog { display: flex; align-items: center; gap: 10px; flex: none; height: 50px; padding: 0 16px 0 6px; border: 3px solid var(--zc-ink); border-radius: 999px; background: rgba(10, 6, 40, .55); }
:root:not(#zz#zz) #modal-customize.zc .zc-prog[hidden] { display: none; }
:root:not(#zz#zz) #modal-customize.zc .zc-prog-pct { display: grid; place-items: center; width: 40px; height: 40px; border: 3px solid var(--zc-ink); border-radius: 50%; background: conic-gradient(#ffd21f calc(var(--p, 0) * 1%), rgba(10, 6, 40, .7) 0); }
:root:not(#zz#zz) #modal-customize.zc .zc-prog-pct b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #2a1e84; font-weight: 900; font-size: 10px; color: #fff; }
:root:not(#zz#zz) #modal-customize.zc .zc-prog-t { display: flex; flex-direction: column; gap: 5px; min-width: 116px; }
:root:not(#zz#zz) #modal-customize.zc .zc-prog-t b { font-weight: 900; font-size: 14px; line-height: 1; white-space: nowrap; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc .zc-prog-t b i { font-style: normal; color: #ffe970; }
:root:not(#zz#zz) #modal-customize.zc .zc-bar { display: block; height: 8px; border: 2px solid var(--zc-ink); border-radius: 999px; background: rgba(10, 6, 40, .7); overflow: hidden; }
:root:not(#zz#zz) #modal-customize.zc .zc-bar > s { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #ffe970, #ff9a00); text-decoration: none; transition: width .6s cubic-bezier(.2, .9, .3, 1); }

:root:not(#zz#zz) #modal-customize.zc #modal-customize-sort-wrap {
  position: relative !important;
  inset: auto !important;
  flex: none;
  width: auto !important;
  height: 44px !important;
  margin: 0 !important;
  border-radius: 14px !important;
  overflow: visible !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-sort-wrap:after {
  content: "\25BC" !important;
  top: 50% !important;
  right: 12px !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  transform: translateY(-50%);
  font-size: 11px !important;
  color: #ffe970 !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-sort {
  height: 44px !important;
  margin: 0 !important;
  padding: 0 32px 0 14px !important;
  border: 3px solid var(--zc-ink) !important;
  border-radius: 14px !important;
  background: rgba(10, 6, 40, .55) !important;
  box-shadow: 0 3px 0 var(--zc-ink) !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  text-shadow: var(--zc-out-sm) !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-sort option { opacity: 1 !important; background: #2a1e84 !important; color: #fff !important; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-close { position: static !important; flex: none; width: 46px !important; height: 46px !important; margin: 0 !important; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-close span.close-corner {
  float: none !important;
  display: block !important;
  width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  background-size: 55% 55% !important;
  cursor: pointer;
}

/* ---------- вкладки категорий ---------- */
:root:not(#zz#zz) #modal-customize.zc #modal-customize-header {
  position: static !important;
  display: flex !important;
  gap: 8px;
  flex: none;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 2px 2px 6px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-header::-webkit-scrollbar { display: none; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat {
  position: relative !important;
  display: flex !important;
  align-items: center;
  gap: 7px;
  flex: 1 0 auto;
  float: none !important;
  width: auto !important;
  height: 50px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 4px 12px 4px 6px !important;
  border: 3px solid var(--zc-ink) !important;
  border-radius: 16px !important;
  background: rgba(10, 6, 40, .42) !important;
  box-shadow: 0 3px 0 var(--zc-ink) !important;
  cursor: pointer;
  transition: transform .12s ease, background-color .12s ease;
}
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat:hover { background: rgba(255, 255, 255, .12) !important; transform: translateY(-2px); }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat.modal-customize-cat-selected { background: linear-gradient(180deg, #ffe970, #ffd21f 55%, #ff9a00) !important; transform: translateY(-2px); }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-cat-standalone:before { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat-connect { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat-image {
  position: static !important;
  flex: none;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  opacity: 1 !important;
  transform: none !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  filter: drop-shadow(0 2px 0 rgba(26, 19, 64, .6));
}
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="outfit"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-outfit.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="melee"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-melee.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="emote"] .modal-customize-cat-image,
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="player_icon"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-emote.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="heal"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-heal.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="boost"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-boost.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat[data-zc="crosshair"] .modal-customize-cat-image { background-image: url(/img/zalp-ui/cat-crosshair.webp) !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-tab-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; line-height: 1; }
:root:not(#zz#zz) #modal-customize.zc .zc-tab-t b { font-weight: 900; font-size: 13px; color: #fff; text-shadow: var(--zc-out-sm); white-space: nowrap; }
:root:not(#zz#zz) #modal-customize.zc .zc-tab-t i { font-style: normal; font-weight: 800; font-size: 11px; color: #d9d2ff; text-shadow: var(--zc-out-sm); white-space: nowrap; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat-selected .zc-tab-t b,
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat-selected .zc-tab-t i { color: var(--zc-ink); text-shadow: none; }
:root:not(#zz#zz) #modal-customize.zc .modal-customize-cat .account-alert { position: absolute !important; top: -7px !important; right: -7px !important; left: auto !important; margin: 0 !important; }

/* ---------- сетка предметов ---------- */
:root:not(#zz#zz) #modal-customize.zc .zc-main { flex: 1; min-height: 0; display: flex; gap: 14px; }
:root:not(#zz#zz) #modal-customize.zc .zc-listcol { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
:root:not(#zz#zz) #modal-customize.zc .zc-filter { display: flex; align-items: center; gap: 6px; flex: none; min-height: 34px; flex-wrap: wrap; }
:root:not(#zz#zz) #modal-customize.zc .zc-chip { box-sizing: border-box; height: 32px; padding: 0 12px; border: 3px solid var(--zc-ink); border-radius: 999px; background: rgba(10, 6, 40, .45); color: #fff; font: 800 13px/1 var(--z-font, "Rubik", sans-serif); text-shadow: var(--zc-out-sm); cursor: pointer; white-space: nowrap; }
:root:not(#zz#zz) #modal-customize.zc .zc-chip:hover { background: rgba(255, 255, 255, .12); }
:root:not(#zz#zz) #modal-customize.zc .zc-chip.zc-on { background: linear-gradient(180deg, #9cf58c, #3fd13a 55%, #1f9a22); }
:root:not(#zz#zz) #modal-customize.zc .zc-chip i { font-style: normal; margin-left: 5px; color: #ffe970; }
:root:not(#zz#zz) #modal-customize.zc .zc-hint { margin-left: auto; font-weight: 700; font-size: 12px; color: #d9d2ff; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-body {
  position: static !important;
  flex: 1;
  min-height: 0;
  display: flex !important;
  flex-direction: column;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-list {
  flex: 1;
  min-height: 0;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 12px 12px 18px !important;
  border: 3px solid var(--zc-ink) !important;
  border-radius: 20px !important;
  background: rgba(10, 6, 40, .4) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-list > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 16px 10px; align-content: start; }
:root:not(#zz#zz) #modal-customize.zc .customize-list-item,
:root:not(#zz#zz) #modal-customize.zc .zc-item {
  --r: var(--zc-r0);
  position: relative !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: 1;
  margin: 0 !important;
  box-sizing: border-box !important;
  border: 3px solid var(--zc-ink) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--r) 42%, transparent) 0%, transparent 68%),
    linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(10, 6, 40, .3)),
    #2c2276 !important;
  box-shadow: inset 0 -5px 0 color-mix(in srgb, var(--r) 75%, #1a1340), 0 3px 0 var(--zc-ink) !important;
  opacity: 1 !important;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease;
}
:root:not(#zz#zz) #modal-customize.zc [data-rarity="1"] { --r: var(--zc-r1); }
:root:not(#zz#zz) #modal-customize.zc [data-rarity="2"] { --r: var(--zc-r2); }
:root:not(#zz#zz) #modal-customize.zc [data-rarity="3"] { --r: var(--zc-r3); }
:root:not(#zz#zz) #modal-customize.zc [data-rarity="4"] { --r: var(--zc-r4); }
:root:not(#zz#zz) #modal-customize.zc [data-rarity="5"] { --r: var(--zc-r5); }
:root:not(#zz#zz) #modal-customize.zc .customize-list-item:hover,
:root:not(#zz#zz) #modal-customize.zc .zc-item:hover { transform: translateY(-3px); }
:root:not(#zz#zz) #modal-customize.zc .customize-list-item.customize-list-item-selected,
:root:not(#zz#zz) #modal-customize.zc .zc-item.zc-focus {
  border-color: #ffd21f !important;
  box-shadow: 0 0 0 3px var(--zc-ink), 0 0 18px 4px rgba(255, 210, 31, .55), inset 0 -5px 0 color-mix(in srgb, var(--r) 75%, #1a1340) !important;
  transform: translateY(-3px);
}
:root:not(#zz#zz) #modal-customize.zc .customize-list-item > .customize-item-image,
:root:not(#zz#zz) #modal-customize.zc .zc-item > .zc-img {
  position: absolute !important;
  inset: 13% !important;
  width: auto !important;
  height: auto !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  filter: drop-shadow(0 3px 0 rgba(26, 19, 64, .55));
}
/* надето / в колесе эмоций */
:root:not(#zz#zz) #modal-customize.zc .customize-list-item.zc-eq::after {
  content: "\2713";
  position: absolute;
  top: -8px;
  right: -8px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 3px solid var(--zc-ink);
  border-radius: 50%;
  background: linear-gradient(180deg, #9cf58c, #3fd13a 55%, #1f9a22);
  color: #fff;
  font-weight: 900;
  font-size: 13px;
  line-height: 1;
  text-shadow: var(--zc-out-sm);
  z-index: 2;
}
:root:not(#zz#zz) #modal-customize.zc .customize-list-item .account-alert { position: absolute !important; top: -6px !important; left: -6px !important; right: auto !important; margin: 0 !important; z-index: 2; }
/* закрытые */
:root:not(#zz#zz) #modal-customize.zc .zc-locked { background: radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--r) 22%, transparent) 0%, transparent 68%), #221a5c !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-locked > .zc-img { filter: grayscale(.55) brightness(.88) drop-shadow(0 3px 0 rgba(26, 19, 64, .55)); opacity: .9; transition: filter .15s ease, opacity .15s ease; }
:root:not(#zz#zz) #modal-customize.zc .zc-locked:hover > .zc-img,
:root:not(#zz#zz) #modal-customize.zc .zc-locked.zc-focus > .zc-img { filter: none; opacity: 1; }
:root:not(#zz#zz) #modal-customize.zc .zc-lock { position: absolute; top: 5px; left: 6px; width: 18px; height: 22px; background: url(/img/zalp-ui/cat-lock.webp) center / contain no-repeat; filter: drop-shadow(0 2px 0 var(--zc-ink)); }
:root:not(#zz#zz) #modal-customize.zc .zc-price {
  position: absolute;
  left: 50%;
  bottom: -11px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 22px;
  padding: 0 8px 0 3px;
  border: 2px solid var(--zc-ink);
  border-radius: 999px;
  background: #2a1e84;
  font-weight: 900;
  font-size: 12px;
  color: #ffe970;
  text-shadow: var(--zc-out-sm);
  white-space: nowrap;
  z-index: 1;
}
:root:not(#zz#zz) #modal-customize.zc .zc-price img { width: 16px; height: 16px; }
:root:not(#zz#zz) #modal-customize.zc .zc-price.zc-cry { color: #eadcff; background: #4a2a9a; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-list.zc-f-own .zc-locked,
:root:not(#zz#zz) #modal-customize.zc #modal-customize-list.zc-f-lock .customize-list-item { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-empty { grid-column: 1 / -1; padding: 30px 10px; text-align: center; font-weight: 800; font-size: 15px; color: #d9d2ff; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc .zc-empty img { display: block; width: 64px; height: 64px; margin: 0 auto 8px; }

/* ---------- карточка выбранного предмета ---------- */
:root:not(#zz#zz) #modal-customize.zc .zc-side { --r: var(--zc-r0); flex: none; width: 260px; display: flex; flex-direction: column; gap: 10px; min-height: 0; }
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="1"] { --r: var(--zc-r1); }
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="2"] { --r: var(--zc-r2); }
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="3"] { --r: var(--zc-r3); }
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="4"] { --r: var(--zc-r4); }
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="5"] { --r: var(--zc-r5); }
:root:not(#zz#zz) #modal-customize.zc .zc-art {
  position: relative;
  flex: none;
  height: 164px;
  border: 3px solid var(--zc-ink);
  border-radius: 22px;
  background: radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--r) 55%, transparent) 0%, transparent 70%), rgba(10, 6, 40, .5);
  box-shadow: inset 0 -6px 0 color-mix(in srgb, var(--r) 70%, #1a1340);
  overflow: hidden;
}
:root:not(#zz#zz) #modal-customize.zc .zc-art::before {
  content: "";
  position: absolute;
  inset: -50%;
  background: repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--r) 30%, transparent) 0 10deg, transparent 10deg 30deg);
  opacity: 0;
  animation: zc-spin 14s linear infinite;
}
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="4"] .zc-art::before,
:root:not(#zz#zz) #modal-customize.zc .zc-side[data-r="5"] .zc-art::before { opacity: .9; }
@keyframes zc-spin { to { transform: rotate(360deg); } }
:root:not(#zz#zz) #modal-customize.zc .zc-art-img { position: absolute; inset: 18px; animation: zc-float 3.2s ease-in-out infinite; }
:root:not(#zz#zz) #modal-customize.zc .zc-art-img > i { position: absolute; inset: 0; background: center / contain no-repeat; filter: drop-shadow(0 5px 0 rgba(26, 19, 64, .55)); }
@keyframes zc-float { 50% { transform: translateY(-6px); } }
:root:not(#zz#zz) #modal-customize.zc .zc-art-live { position: absolute; inset: 0; }
:root:not(#zz#zz) #modal-customize.zc .zc-art-live canvas { width: 100% !important; height: 100% !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-art.zc-live .zc-art-img { display: none; }
:root:not(#zz#zz) #modal-customize.zc .zc-art-tag { position: absolute; left: 10px; top: 10px; z-index: 1; padding: 3px 10px; border: 2px solid var(--zc-ink); border-radius: 999px; background: rgba(10, 6, 40, .7); font-weight: 900; font-size: 11px; color: #ffe970; text-shadow: var(--zc-out-sm); }

:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-header {
  position: relative !important;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  flex: none;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-name,
:root:not(#zz#zz) #modal-customize.zc .zc-name {
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: 900 !important;
  font-size: 22px !important;
  line-height: 1.1 !important;
  color: #fff !important;
  text-shadow: var(--zc-out), 0 3px 0 var(--zc-ink) !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  cursor: default;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-rarity,
:root:not(#zz#zz) #modal-customize.zc .zc-rar {
  position: static !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 3px 12px !important;
  border: 2px solid var(--zc-ink) !important;
  border-radius: 999px !important;
  background: var(--r) !important;
  color: var(--zc-ink) !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
  text-transform: none !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-rarity:empty { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-loading-container { position: absolute !important; top: 0 !important; right: 0 !important; left: auto !important; margin: 0 !important; }
:root:not(#zz#zz) #modal-customize.zc #modal-customize-footer,
:root:not(#zz#zz) #modal-customize.zc .zc-lbox {
  position: static !important;
  flex: 1;
  min-height: 0;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid var(--zc-ink) !important;
  border-radius: 18px !important;
  background: rgba(10, 6, 40, .4) !important;
  overflow-y: auto;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-source,
:root:not(#zz#zz) #modal-customize.zc .zc-src {
  position: static !important;
  width: auto !important;
  margin: 0 0 6px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  color: #ffe970 !important;
  text-shadow: var(--zc-out-sm) !important;
}
:root:not(#zz#zz) #modal-customize.zc #modal-customize-item-lore,
:root:not(#zz#zz) #modal-customize.zc .zc-lore {
  position: static !important;
  width: auto !important;
  margin: 0 !important;
  font-style: italic;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  color: #d9d2ff !important;
  text-shadow: var(--zc-out-sm) !important;
}
:root:not(#zz#zz) #modal-customize.zc .zc-fx { margin-top: 8px; font-weight: 800; font-size: 12.5px; color: #ffcf7a; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc .zc-linfo { display: none; flex-direction: column; align-items: flex-start; gap: 6px; flex: 1; min-height: 0; }
:root:not(#zz#zz) #modal-customize.zc .zc-linfo .zc-lbox { align-self: stretch; margin-top: 4px !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-side.zc-lockmode .zc-linfo { display: flex; }
:root:not(#zz#zz) #modal-customize.zc .zc-side.zc-lockmode #modal-customize-item-header,
:root:not(#zz#zz) #modal-customize.zc .zc-side.zc-lockmode #modal-customize-footer { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-act { flex: none; margin-top: auto; }
:root:not(#zz#zz) #modal-customize.zc .zc-side.zc-blank #modal-customize-item-header,
:root:not(#zz#zz) #modal-customize.zc .zc-side.zc-blank #modal-customize-footer { display: none !important; }
:root:not(#zz#zz) #modal-customize.zc .zc-btn,
:root:not(#zz#zz) #modal-customize.zc .zc-state {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 50px;
  box-sizing: border-box;
  padding: 4px 12px;
  border: 3px solid var(--zc-ink);
  border-radius: 16px;
  font: 900 17px/1.15 var(--z-font, "Rubik", sans-serif);
  text-align: center;
}
:root:not(#zz#zz) #modal-customize.zc .zc-btn { background: linear-gradient(180deg, #ffe970, #ffd21f 55%, #ff9a00); color: var(--zc-ink); box-shadow: 0 4px 0 var(--zc-ink), inset 0 2px 0 rgba(255, 255, 255, .5); cursor: pointer; transition: transform .1s ease; }
:root:not(#zz#zz) #modal-customize.zc .zc-btn:hover { transform: translateY(-2px); }
:root:not(#zz#zz) #modal-customize.zc .zc-btn:active { transform: translateY(2px); box-shadow: 0 2px 0 var(--zc-ink); }
:root:not(#zz#zz) #modal-customize.zc .zc-btn.zc-cry { background: linear-gradient(180deg, #efe4ff, #b98cff 55%, #8a4dff); color: #fff; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc .zc-btn img { width: 24px; height: 24px; filter: drop-shadow(0 2px 0 rgba(26, 19, 64, .5)); }
:root:not(#zz#zz) #modal-customize.zc .zc-state { background: linear-gradient(180deg, #9cf58c, #3fd13a 55%, #1f9a22); color: #fff; text-shadow: var(--zc-out-sm); }
:root:not(#zz#zz) #modal-customize.zc .zc-state.zc-muted { background: rgba(10, 6, 40, .45); font-size: 13px; font-weight: 800; color: #d9d2ff; }

/* ---------- правые панели: колесо эмоций и настройка прицела ---------- */
:root:not(#zz#zz) #modal-customize.zc .modal-content-right {
  right: max(16px, 3vw) !important;
  left: auto !important;
  top: calc(50% + var(--zc-top) / 2 - 8px) !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  border: 4px solid var(--zc-ink) !important;
  border-radius: 26px !important;
  background: linear-gradient(180deg, #4b3cc4 0%, #3527a0 55%, #2a1e84 100%) !important;
  box-shadow: 0 6px 0 var(--zc-ink), 0 18px 40px rgba(10, 4, 40, .55) !important;
}
:root:not(#zz#zz) #modal-customize.zc .modal-content-right > .modal-spacer { display: none !important; }

/* ---------- узкие экраны ---------- */
@media (max-width: 1560px) {
  :root:not(#zz#zz) #modal-customize.zc .modal-customize-cat:not(.modal-customize-cat-selected) .zc-tab-t b { display: none; }
}
@media (max-width: 1280px) {
  :root:not(#zz#zz) #modal-customize.zc .zc-side { width: 220px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-title { font-size: 26px; }
}
@media (max-width: 1000px) {
  :root:not(#zz#zz) #modal-customize.zc .zc-prog-t { display: none; }
  :root:not(#zz#zz) #modal-customize.zc .zc-prog { padding: 0 4px; }
}
@media (max-width: 820px), (max-height: 520px) {
  #modal-customize.zc { --zc-top: 52px; }
  :root:not(#zz#zz) #modal-customize.zc #modal-content-left,
  :root:not(#zz#zz) #modal-customize.zc[data-zc-cat] #modal-content-left {
    left: 8px !important;
    right: 8px !important;
    top: var(--zc-top) !important;
    bottom: 8px !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
    padding: 8px 10px 10px !important;
    gap: 8px;
    border-radius: 22px !important;
    animation: none;
  }
  :root:not(#zz#zz) #modal-customize.zc[data-zc-cat="emote"] #modal-content-left { bottom: 250px !important; }
  :root:not(#zz#zz) #modal-customize.zc .zc-head { min-height: 44px; gap: 8px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-head-art { width: 40px; height: 40px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-title { font-size: 20px; }
  :root:not(#zz#zz) #modal-customize.zc #modal-customize-sort-wrap { display: none !important; }
  :root:not(#zz#zz) #modal-customize.zc .modal-customize-cat { height: 44px !important; padding: 3px 8px 3px 4px !important; }
  :root:not(#zz#zz) #modal-customize.zc .modal-customize-cat-image { width: 30px !important; height: 30px !important; }
  :root:not(#zz#zz) #modal-customize.zc .zc-main { flex-direction: column; gap: 8px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-side { order: -1; width: auto; flex-direction: row; align-items: center; gap: 10px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-art { width: 76px; height: 76px; border-radius: 16px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-art-img { inset: 8px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-art-tag,
  :root:not(#zz#zz) #modal-customize.zc #modal-customize-footer,
  :root:not(#zz#zz) #modal-customize.zc .zc-lbox { display: none !important; }
  :root:not(#zz#zz) #modal-customize.zc #modal-customize-item-header,
  :root:not(#zz#zz) #modal-customize.zc .zc-linfo { flex: 1; min-width: 0; }
  :root:not(#zz#zz) #modal-customize.zc #modal-customize-item-name,
  :root:not(#zz#zz) #modal-customize.zc .zc-name { font-size: 17px !important; }
  :root:not(#zz#zz) #modal-customize.zc .zc-act { width: 150px; }
  :root:not(#zz#zz) #modal-customize.zc .zc-btn,
  :root:not(#zz#zz) #modal-customize.zc .zc-state { min-height: 42px; font-size: 14px; }
  :root:not(#zz#zz) #modal-customize.zc #modal-customize-list > div { grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); }
  :root:not(#zz#zz) #modal-customize.zc .modal-content-right {
    top: auto !important;
    bottom: 6px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) scale(.52) !important;
    transform-origin: 50% 100%;
  }
}