/* ═══ Апгрейдер ═══ */
#screen-upgrader { --upa:var(--btn-border); --upa2:var(--accent); --upa-soft:var(--chip-on); }
#screen-upgrader #upArcGrad stop:first-child { stop-color:var(--accent); }
#screen-upgrader #upArcGrad stop:last-child { stop-color:var(--btn-bottom); }
#screen-upgrader .up-arc { filter:drop-shadow(0 0 6px #1888db77); }
#screen-upgrader .up-stage { background:var(--hero-fill); border:1px solid var(--line); border-radius:16px; }
#screen-upgrader .up-center { background:var(--control-fill); border-color:var(--line); }
#screen-upgrader .up-mult { color:#e6ecff; text-shadow:none; }
#screen-upgrader.gift-mode .up-ring { width:min(62vw, 230px); }
#screen-upgrader.gift-mode .up-target-img { width:62%; }

/* LIVE */
#screen-upgrader .upx-live { display:flex; align-items:center; gap:8px; margin:4px 12px 8px; }
#screen-upgrader .upx-live-dot { flex:none; display:flex; align-items:center; gap:5px; font-size:11px; font-weight:900; letter-spacing:.5px; color:#cfd6ea; }
#screen-upgrader .upx-live-dot::before { content:""; width:7px; height:7px; border-radius:50%; background:#4cc38a; box-shadow:0 0 6px #4cc38a; }
#screen-upgrader .upx-live-row { flex:1; min-width:0; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
#screen-upgrader .upx-live-row::-webkit-scrollbar { display:none; }
#upSound { flex:none; display:grid; place-items:center; width:36px; height:36px; }
#upSound svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
#upSound[aria-pressed="true"] .up-sound-off,
#upSound[aria-pressed="false"] .up-sound-on { display:none; }
#screen-upgrader .upx-lchip { flex:none; display:flex; flex-direction:column; align-items:center; padding:4px 10px; border-radius:10px;
  background:var(--panel); border:1px solid var(--line); font-size:11px; line-height:1.25; }
#screen-upgrader .upx-lchip b { color:#f2f2f2; font-weight:800; }
#screen-upgrader .upx-lchip i { font-style:normal; color:var(--upa2); font-weight:800; }
#screen-upgrader .upx-lempty { font-size:12px; color:#8d929c; white-space:nowrap; }

/* Шанс под кольцом */
#screen-upgrader .upx-chance { margin-top:8px; text-align:center; font-size:14px; font-weight:700; color:#aab0bd; }
#screen-upgrader .upx-chance[hidden] { display:none; }
#screen-upgrader .upx-chance b { font-size:26px; font-weight:900; color:var(--upa2); margin-left:4px; font-variant-numeric:tabular-nums; }

/* Панель подарков */
#screen-upgrader .upx { display:flex; flex-direction:column; gap:10px; margin:10px 12px 16px; }
#screen-upgrader .upx[hidden] { display:none; }
#screen-upgrader .upx-pair { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:6px; }
#screen-upgrader button.upx-card { display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; padding:8px 10px; text-align:left;
  border-radius:12px !important; background:var(--control-fill) !important; border:1px solid var(--field-border) !important; color:var(--text) !important; font-family:inherit; }
#screen-upgrader button.upx-card.to { border-color:var(--chip-on-border) !important; background:var(--active-fill) !important; }
#screen-upgrader .upx-card small { font-size:11px; font-weight:800; color:#8d929c; }
#screen-upgrader .upx-cbody { display:flex; align-items:center; gap:8px; min-width:0; width:100%; }
#screen-upgrader .upx-cbody img { flex:none; width:40px; height:40px; object-fit:contain; }
#screen-upgrader .upx-ctext { min-width:0; display:flex; flex-direction:column; }
#screen-upgrader .upx-ctext b { font-size:12px; font-weight:800; line-height:1.2; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
#screen-upgrader .upx-ctext em { font-style:normal; font-size:13px; font-weight:900; color:#f2f2f2; font-variant-numeric:tabular-nums; }
#screen-upgrader .upx-arrow { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; font-style:normal; font-weight:900;
  background:var(--panel); border:1px solid var(--field-border); color:var(--muted); }

#screen-upgrader .upx-mrow { display:flex; align-items:center; gap:8px; }
#screen-upgrader .upx-mults { display:flex; gap:6px; flex:1; }
#screen-upgrader .upx-mults button { flex:1; height:34px; padding:0; border-radius:10px !important; font-size:13px; font-weight:900;
  background:var(--control-fill) !important; border:1px solid var(--field-border) !important; color:var(--muted) !important; }
#screen-upgrader .upx-mults button.on { background:var(--active-fill) !important; border-color:var(--chip-on-border) !important; color:var(--accent) !important; }
#screen-upgrader button.upx-all { flex:none; height:34px; padding:0 10px; border-radius:10px !important; font-size:13px; font-weight:800;
  background:transparent !important; border:1px solid #393c43 !important; color:var(--upa2) !important; }

#screen-upgrader .upx-slider { display:flex; align-items:center; gap:10px; }
#screen-upgrader .upx-mlbl { flex:none; min-width:54px; padding:4px 10px; border-radius:8px; text-align:center; font-weight:900; font-size:13px;
  background:var(--upa-soft); color:var(--upa2); border:1px solid var(--chip-on-border); font-variant-numeric:tabular-nums; }
#screen-upgrader #upxRange { flex:1; accent-color:var(--upa); height:28px; }

#screen-upgrader .upx-targets, #screen-upgrader .upx-mine { display:flex; gap:6px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
#screen-upgrader .upx-targets::-webkit-scrollbar, #screen-upgrader .upx-mine::-webkit-scrollbar { display:none; }
#screen-upgrader button.upx-pick { position:relative; flex:0 0 64px; height:64px; padding:4px; border-radius:10px !important;
  background:var(--control-fill) !important; border:1px solid var(--line) !important; display:grid; place-items:center; }
#screen-upgrader button.upx-pick.on { border-color:var(--chip-on-border) !important; background:var(--active-fill) !important; }
#screen-upgrader .upx-pick img { width:42px; height:42px; object-fit:contain; margin-top:-8px; }
#screen-upgrader .upx-pick small { position:absolute; left:0; right:0; bottom:4px; font-size:10px; font-weight:900; color:#dfe3ec; text-align:center; }
#screen-upgrader .upx-gh { font-size:12px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:#8d929c; }

#screen-upgrader button.upx-go { height:52px; border-radius:12px !important; font-size:17px; font-weight:900; color:#fff !important;
  background:var(--primary-fill) !important; border:1px solid var(--btn-border) !important; }
#screen-upgrader button.upx-go:disabled { background:var(--control-fill) !important; border-color:var(--line) !important; color:var(--muted) !important; }

/* Полный список целей */
.upx-sheet { position:fixed; inset:0; z-index:300; display:flex; align-items:flex-end; background:rgba(10,11,13,.62);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.upx-sheet[hidden] { display:none; }
.upx-sheet-card { width:100%; max-height:80vh; display:flex; flex-direction:column; gap:10px; padding:14px 12px 18px;
  border-radius:16px 16px 0 0; background:var(--panel); border:1px solid var(--line); }
.upx-sheet-head { display:flex; align-items:center; justify-content:space-between; }
.upx-sheet-head b { font-size:17px; font-weight:900; color:#f2f2f2; }
#screen-upgrader .upx-sheet-head button { width:30px; height:30px; padding:0; border-radius:8px !important; }
.upx-search { height:38px; padding:0 12px; border-radius:10px; border:1px solid #393c43; background:#1a1b1f; color:#eee; font:inherit; font-size:14px; }
.upx-sheet-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; overflow-y:auto; }
#screen-upgrader button.upx-sitem { display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 4px; border-radius:10px !important;
  background:var(--control-fill) !important; border:1px solid var(--line) !important; color:var(--text) !important; font-family:inherit; }
#screen-upgrader button.upx-sitem.on { background:var(--active-fill) !important; border-color:var(--chip-on-border) !important; }
#screen-upgrader .upx-sitem img { width:52px; height:52px; object-fit:contain; }
#screen-upgrader .upx-sitem b { max-width:100%; font-size:10px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#screen-upgrader .upx-sitem span { font-size:12px; font-weight:900; color:#f2f2f2; }
#screen-upgrader .upx-sitem small { font-size:10px; font-weight:800; color:var(--upa2); }

/* Переключатель цели апгрейда: подарки Telegram / скины CS2 */
#screen-upgrader .upx-pool { display:flex; gap:6px; margin:0 0 10px; padding:4px; border-radius:12px; background:#ffffff0d; }
#screen-upgrader .upx-pool button { flex:1; height:32px; padding:0; border:1px solid transparent; border-radius:9px !important; background:transparent;
  color:#c9cfdb; font-size:13px; font-weight:900; }
#screen-upgrader .upx-pool button.on { background:var(--active-fill) !important; border-color:var(--chip-on-border) !important; color:var(--accent) !important; }
/* Скины шире подарков — вписываем по ширине */
#screen-upgrader .upx-pick img[src*="assets/skins/"] { width:54px; height:40px; }
#screen-upgrader .upx-card img[src*="assets/skins/"], #screen-upgrader .upx-sitem img[src*="assets/skins/"] { object-fit:contain; }
/* «Показать ещё» в списке целей — на всю ширину сетки */
#screen-upgrader button.upx-more { grid-column:1 / -1; width:100%; min-height:38px; margin:6px 0 2px; border-radius:10px !important;
  background:var(--control-fill) !important; border:1px solid var(--field-border) !important; color:#dfe7f3 !important; font-size:13px; font-weight:900; }