:root {

  --bg: #101214;

  --page: #0e1012;

  --raise: rgba(28, 30, 34, 0.9);

  --raise-solid: #1a1c20;

  --line: rgba(255, 255, 255, 0.08);

  --line-strong: rgba(255, 255, 255, 0.14);

  --line-soft: rgba(255, 255, 255, 0.06);

  --line-faint: rgba(255, 255, 255, 0.07);

  --text: #ececea;

  --muted: #9a9a94;

  --faint: #6f6f6a;

  --accent: #a7a498;

  --accent-2: #b8b4a8;

  --accent-glow: none;

  --ink: #ececea;

  --danger: #c98a84;

  --ok: #8fba9a;

  --link: #b8b6ae;

  --link-hover: #ececea;

  --hover: rgba(255, 255, 255, 0.06);

  --hover-mid: rgba(255, 255, 255, 0.05);

  --hover-strong: rgba(255, 255, 255, 0.1);

  --fill-soft: rgba(255, 255, 255, 0.02);

  --fill-mid: rgba(255, 255, 255, 0.04);

  --input-bg: rgba(16, 18, 20, 0.88);

  --panel: #1a1c20;

  --panel-2: #26282c;

  --top-bg: rgba(16, 18, 20, 0.86);

  --top-line: rgba(255, 255, 255, 0.06);

  --split: rgba(255, 255, 255, 0.18);

  --avatar-from: #3a3c40;

  --avatar-to: #242628;

  --avatar-ring: rgba(255, 255, 255, 0.16);

  --avatar-glow: rgba(255, 255, 255, 0.06);

  --wash: rgba(255, 255, 255, 0.05);

  --backdrop: rgba(8, 9, 10, 0.72);

  --focus: rgba(167, 164, 152, 0.45);

  --menu-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);

  --sans: "Sora", "Segoe UI", sans-serif;

  --mono: "Sora", "Segoe UI", sans-serif;

  --radius: 14px;

  --radius-sm: 10px;

  color-scheme: dark;

}



* { box-sizing: border-box; }



html {

  min-height: 100%;

  background: var(--page);

  font-family: var(--sans);

}



body {

  position: relative;

  z-index: 0;

  margin: 0;

  min-height: 100vh;

  background: var(--bg);

  color: var(--text);

  font-family: inherit;

  font-size: 14px;

  line-height: 1.45;

}



body::before,

body::after {

  content: "";

  position: fixed;

  inset: 0;

  z-index: -1;

  pointer-events: none;

}



body::before {

  background:

    radial-gradient(ellipse 90% 55% at 50% -30%, rgba(255, 255, 255, 0.05), transparent 58%),

    linear-gradient(180deg, #121416 0%, #101214 45%, #0e1012 100%);

}



body::after {

  opacity: 0.025;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

  background-size: 180px 180px;

}



button, input, select, textarea { font-family: inherit; }



a { color: var(--link); text-decoration: none; }



a:hover { color: var(--link-hover); }



.btn, button.btn, a.btn { transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, opacity 160ms ease; }



h1, h2, .price, .money { font-weight: 700; letter-spacing: -0.02em; }



h1 { font-size: 22px; margin: 0 0 14px; }



h2 { font-size: 16px; margin: 28px 0 10px; }



p { margin: 0 0 12px; }



.wrap {

  width: min(1080px, 100%);

  margin-inline: auto;

  padding-inline: 16px;

}



.skip {

  position: absolute;

  left: 12px;

  top: -40px;

  background: var(--accent);

  color: var(--ink);

  padding: 8px 12px;

  border-radius: 8px;

}



.skip:focus { top: 8px; }



.top {

  position: sticky;

  top: 0;

  z-index: 20;

  background: var(--top-bg);

  backdrop-filter: blur(14px);

  -webkit-backdrop-filter: blur(14px);

  border-bottom: 1px solid var(--top-line);

}



.top-inner {

  display: grid;

  grid-template-columns: 1fr auto 1fr;

  align-items: center;

  gap: 18px;

  min-height: 64px;

}



.nav-toggle {

  display: none;

  align-items: center;

  justify-content: center;

  width: 40px;

  height: 40px;

  margin: 0;

  padding: 0;

  border: 1px solid var(--line);

  border-radius: 10px;

  background: var(--fill-mid);

  color: var(--text);

  cursor: pointer;

}



.nav-toggle svg {

  width: 18px;

  height: 18px;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linecap: round;

}



.nav-toggle-close { display: none; }



.top.is-nav-open .nav-toggle-bars { display: none; }



.top.is-nav-open .nav-toggle-close { display: block; }



.nav-mobile-extra { display: none; }



.brand {

  display: inline-flex;

  align-items: center;

  gap: 9px;

  justify-self: start;

  color: var(--text);

  font-size: 13px;

  font-weight: 700;

  letter-spacing: 0.1em;

  line-height: 1;

  white-space: nowrap;

}



.vk-mark {

  display: block;

  flex: none;

  width: 22px;

  height: 13px;

  color: var(--accent-2);

  overflow: visible;

  shape-rendering: geometricPrecision;

}



.brand .vk-mark {

  width: 24px;

  height: 14px;

  transform: translateY(1px);

}



.brand > span {

  line-height: 1;

  padding-top: 1px;

}



.nav, .account, .subnav, .actions, .foot {

  display: flex;

  align-items: center;

  gap: 14px;

  flex-wrap: wrap;

}



.nav { justify-content: center; }



.account, .userbox { justify-self: end; }



a.money:hover { color: var(--ink); }



.top .nav a,

.top .account a,

.top .money,

.top .brand,

.top .userbox summary,

.top .pop a,

.top .pop button,

.top .btn {

  transition: color 180ms ease, background-color 180ms ease, opacity 180ms ease;

}



.top .nav a:hover,

.top .account > a:hover { color: var(--text); }



.top .brand:hover { opacity: 0.8; }



.top .nav a { position: relative; }



.top .nav a::after {

  content: "";

  position: absolute;

  left: 10%;

  right: 10%;

  bottom: -6px;

  height: 1px;

  border-radius: 0;

  background: var(--accent);

  box-shadow: none;

  transform: scaleX(0);

  transform-origin: center;

  transition: transform 180ms ease;

}



.top .nav a:hover::after,

.top .nav a[aria-current="page"]::after { transform: scaleX(1); }



.top .nav a[aria-current="page"] { color: var(--ink); font-weight: 700; }



.top .money {

  font-weight: 700;

  color: var(--ink);

  letter-spacing: -0.02em;

}



.top .userbox summary:hover { background: var(--hover-mid); }



.top .userbox .pop {

  transform-origin: top right;

}



.top .userbox details[open] .pop {

  animation: menu-in 200ms cubic-bezier(0.22, 1, 0.36, 1);

}



.top .userbox details.is-closing .pop {

  animation: menu-out 160ms ease forwards;

  pointer-events: none;

}



@keyframes menu-in {

  from {

    opacity: 0;

    transform: translateY(-8px) scale(0.96);

  }

  to {

    opacity: 1;

    transform: translateY(0) scale(1);

  }

}



@keyframes menu-out {

  from {

    opacity: 1;

    transform: translateY(0) scale(1);

  }

  to {

    opacity: 0;

    transform: translateY(-6px) scale(0.96);

  }

}



@media (prefers-reduced-motion: reduce) {

  .top .nav a,

  .top .nav a::after,

  .top .account a,

  .top .money,

  .top .brand,

  .top .userbox summary,

  .top .pop,

  .top .pop a,

  .top .pop button,

  .top .btn,

  .btn[data-copy],

  .listing-row,

  .listing-row .account-side .btn,

  #buy-status.buy-toast,

  #bulk-progress.bulk-progress.is-toast {

    transition: none;

    animation: none;

  }



  .top .userbox details[open] .pop,

  .top .userbox details.is-closing .pop,

  .btn[data-copy].is-copy-swap,

  .bell-pop {

    animation: none;

    transition: none;

    opacity: 1;

    transform: none;

  }



  .bell-pop { opacity: 0; visibility: hidden; }

  .bell.is-open .bell-pop { opacity: 1; visibility: visible; }

}



.nav a, .account a, .subnav a, .foot a { color: var(--muted); }



.nav a[aria-current="page"], .subnav a[aria-current="page"] { color: var(--text); }



.center-block {

  width: min(640px, 100%);

  margin: 24px auto 0;

  text-align: center;

}



.history {

  margin-top: 22px;

  padding-top: 16px;

  border-top: 1px solid var(--line);

  text-align: left;

}



.history h2 { margin: 0 0 12px; font-size: 16px; }



.history ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }



.history li {

  display: grid;

  grid-template-columns: max-content max-content minmax(0, 1fr);

  gap: 14px;

  align-items: baseline;

  font-size: 14px;

}



.history time { color: var(--muted); white-space: nowrap; }



.history .price { font-size: 14px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }



.center-block > .btn,

.center-block > form > .btn { margin-inline: auto; }



.center-block .tags { justify-content: center; }



.center-block .prose { text-align: center; }



.money { color: var(--ink); font-variant-numeric: tabular-nums; }



.userbox { display: flex; align-items: center; gap: 12px; }



.user-split {

  width: 1px;

  height: 16px;

  flex: none;

  border-radius: 1px;

  background: var(--split);

}



.bell { position: relative; }



.bell-btn {

  position: relative;

  display: grid;

  place-items: center;

  width: 34px;

  height: 34px;

  margin: 0;

  padding: 0;

  border: 0;

  border-radius: 8px;

  background: transparent;

  color: var(--muted);

  cursor: pointer;

}



.bell-btn svg {

  width: 18px;

  height: 18px;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linecap: round;

  stroke-linejoin: round;

}



.bell-btn:hover,

.bell.is-open .bell-btn { background: var(--hover-mid); color: var(--text); }



.bell-dot {

  position: absolute;

  top: 7px;

  right: 7px;

  width: 7px;

  height: 7px;

  border-radius: 50%;

  background: var(--accent);

  box-shadow: 0 0 0 2px var(--top-bg);

}



.bell-pop {

  position: absolute;

  right: 0;

  top: calc(100% + 8px);

  z-index: 30;

  width: min(320px, calc(100vw - 24px));

  max-height: min(420px, 70vh);

  overflow: auto;

  padding: 6px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: 10px;

  box-shadow: var(--menu-shadow);

  transform-origin: top right;

  opacity: 0;

  visibility: hidden;

  transform: translateY(-8px) scale(0.96);

  pointer-events: none;

  transition: opacity 200ms cubic-bezier(0.22, 1, 0.36, 1), transform 200ms cubic-bezier(0.22, 1, 0.36, 1), visibility 200ms;

}



.bell-pop::before {

  content: "";

  position: absolute;

  left: 0;

  right: 0;

  top: -12px;

  height: 12px;

}



.bell.is-open .bell-pop {

  opacity: 1;

  visibility: visible;

  transform: none;

  pointer-events: auto;

}



.bell.is-closing .bell-pop {

  opacity: 0;

  visibility: visible;

  transform: translateY(-6px) scale(0.96);

  pointer-events: none;

}



.bell-item {

  display: grid;

  gap: 4px;

  padding: 8px 10px;

  border-radius: 8px;

}



.bell-item + .bell-item { border-top: 1px solid var(--line); }



.bell-item strong { font-size: 14px; font-weight: 600; }



.bell-item p,

.bell-empty { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.4; }



.bell-item a { font-size: 13px; }



.bell-item time { color: var(--muted); font-size: 12px; }



.bell-empty { padding: 10px; }



.userbox details { position: relative; }



.userbox summary {

  display: flex;

  align-items: center;

  gap: 8px;

  list-style: none;

  cursor: pointer;

  color: var(--text);

  border-radius: 8px;

  padding: 4px 8px;

  margin: -4px 0;

}



.who {

  max-width: 140px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.userbox summary::-webkit-details-marker { display: none; }



.avatar {

  width: 28px;

  height: 28px;

  border-radius: 50%;

  display: grid;

  place-items: center;

  background: linear-gradient(180deg, var(--avatar-from), var(--avatar-to));

  border: 1px solid var(--avatar-ring);

  box-shadow: 0 0 12px var(--avatar-glow);

  color: var(--ink);

  font-size: 12px;

  font-weight: 700;

}



.pop {

  position: absolute;

  right: 0;

  top: calc(100% + 8px);

  width: 230px;

  padding: 6px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: 10px;

  box-shadow: var(--menu-shadow);

  display: grid;

}



.pop a, .pop button {

  display: flex;

  align-items: center;

  gap: 10px;

  width: 100%;

  text-align: left;

  background: none;

  border: 0;

  color: var(--text);

  padding: 8px 10px;

  border-radius: 7px;

  cursor: pointer;

  font: inherit;

}



.pop-icon {

  width: 16px;

  height: 16px;

  flex: none;

  display: block;

  color: var(--muted);

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linecap: round;

  stroke-linejoin: round;

}



.pop a:hover .pop-icon,

.pop button:hover .pop-icon,

.pop a[aria-current="page"] .pop-icon {

  color: var(--ink);

}



.pop a:hover, .pop button:hover { background: var(--panel-2); color: var(--ink); }



.pop-split {

  height: 0;

  margin: 4px 10px;

  border-top: 1px solid var(--line);

}



.pop a[aria-current="page"] { color: var(--ink); }



main { padding: 22px 0 48px; }



.foot {

  color: var(--faint);

  font-size: 13px;

  padding-bottom: 22px;

}



.board, .row, .card {

  border: 1px solid var(--line-faint);

  background: var(--fill-soft);

  backdrop-filter: none;

  -webkit-backdrop-filter: none;

  border-radius: 14px;

  box-shadow: none;

}



.board {

  padding: 20px 20px 16px;

  transition: padding 0.36s cubic-bezier(0.22, 1, 0.36, 1);

}



.filter-grid {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 10px 12px;

}



label { display: grid; gap: 5px; color: var(--faint); font-size: 12px; }



label.range span, .range span { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }



label.check { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 14px; }



label.check input { width: auto; }



input, select, textarea {

  width: 100%;

  background: var(--input-bg);

  color: var(--text);

  border: 1px solid var(--line-strong);

  border-radius: var(--radius-sm);

  padding: 8px 12px;

  font: inherit;

}



textarea { resize: vertical; min-height: 88px; }



input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible, summary:focus-visible {

  outline: 2px solid var(--focus);

  outline-offset: 1px;

  box-shadow: var(--accent-glow);

}



select option { background: var(--panel); }



.board-bar h2 { margin: 0; }



.bar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }



.modal {

  width: min(420px, calc(100vw - 32px));

  margin: auto;

  padding: 20px;

  border: 1px solid var(--line-strong);

  border-radius: var(--radius);

  background: var(--raise-solid);

  color: var(--text);

  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.05);

}



.modal::backdrop {

  background: rgba(8, 9, 10, 0.72);

  backdrop-filter: blur(8px);

  -webkit-backdrop-filter: blur(8px);

}



@keyframes modalPopIn {

  from {

    opacity: 0;

    transform: scale(0.96) translateY(6px);

  }

  to {

    opacity: 1;

    transform: scale(1) translateY(0);

  }

}



dialog[open].modal:not(.is-leaving):not(.buy-toast):not(.is-toast) {

  animation: modalPopIn 180ms cubic-bezier(0.16, 1, 0.3, 1);

}



.lot-preview {

  width: min(560px, calc(100vw - 24px));

  max-height: min(860px, calc(100vh - 24px));

  padding: 28px 18px 18px;

  overflow: auto;

  overscroll-behavior: contain;

  position: relative;

}



.lot-preview::backdrop {

  background: rgba(8, 9, 10, 0.42);

  backdrop-filter: blur(12px);

  -webkit-backdrop-filter: blur(12px);

}



.lot-preview-close {

  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 2;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: 8px;

}



.lot-preview-body {

  min-width: 0;

}



.lot-preview .lot-body.center-block {

  width: 100%;

  margin: 0;

  padding: 0;

  border: 0;

  background: transparent;

  box-shadow: none;

  backdrop-filter: none;

  -webkit-backdrop-filter: none;

  text-align: center;

}



.lot-preview .lot-body h1 {

  padding-right: 28px;

  padding-left: 28px;

  font-size: 20px;

}



.lot-preview .history {

  width: min(100%, 520px);

  margin: 18px auto 0;

  padding-top: 16px;

}



.lot-preview .history h2 {

  margin: 0 0 14px;

  padding-bottom: 12px;

  border-bottom: 1px solid var(--line);

  font-size: 15px;

  font-weight: 600;

  line-height: 1.3;

}



.lot-preview .history ul {

  gap: 12px;

}



.lot-preview .btn {

  width: auto;

  margin-top: 0;

}



.lot-preview .lot-body > .btn.buy,

.lot-preview .lot-body > form > .btn.buy,

.lot-preview .lot-purchase .btn.buy {

  width: min(280px, 100%);

}



html.lot-preview-open,

html.lot-preview-open body {

  overflow: hidden;

}



.modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }



.modal h2 { margin: 0; font-size: 18px; }



.modal-close {

  width: 32px;

  height: 32px;

  border: 0;

  background: transparent;

  color: var(--muted);

  font-size: 22px;

  line-height: 1;

  cursor: pointer;

}



.modal label { margin-bottom: 12px; }



.modal .filter-choice {

  display: grid;

  gap: 5px;

  margin: 0 0 12px;

}



.modal .filter-caption {

  display: block;

  color: var(--faint);

  font-size: 12px;

  line-height: 1.45;

}



.modal .filter-choice .choice-set {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 0;

  height: 38px;

  background: rgba(16, 18, 20, 0.88);

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  overflow: hidden;

}



.modal .filter-choice .choice-set label {

  display: flex;

  min-width: 0;

  margin: 0;

}



.modal .filter-choice .choice-set label + label { box-shadow: inset 1px 0 0 var(--line); }



.modal .filter-choice .choice-set span {

  flex: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  height: 100%;

  padding: 0 10px;

  border: 0;

  border-radius: 0;

  background: transparent;

  color: var(--text);

  font-size: 14px;

  line-height: 1;

}



.modal .filter-choice .choice-set label:hover span { background: var(--panel-2); }



.modal .filter-choice .choice-set input:checked + span,

.modal .filter-choice .choice-set label:hover input:checked + span {

  background: #b8b2a4;

  color: #16181b;

  box-shadow: none;

}



.modal .filter-choice .choice-set label:has(input:checked),

.modal .filter-choice .choice-set label:has(input:checked) + label { box-shadow: none; }



#buy-confirm .modal-status { margin: 0 0 14px; }



#dating-fit {

  margin: 14px 0 0;

}



#dating-fit[hidden] { display: none; }



.modal-split {

  height: 0;

  margin: 18px 0 0;

  border: 0;

  border-top: 1px solid var(--hover-strong);

}



#bulk-dialog form > .btn,

#autobuy-dialog form > .btn,

#buy-confirm form > .btn,

#price-form > .btn { margin-top: 18px; }



.modal .btn { width: 100%; margin-top: 4px; }



#price-facts { display: grid; gap: 14px; margin-top: 4px; }



#price-facts[hidden] { display: none; }



.modal .choice { margin: 0; }



.filter-grid .filter-choice {

  display: grid;

  gap: 5px;

  margin: 0;

  padding: 0;

  min-width: 0;

  border: 0;

}



.filter-grid .filter-caption {

  display: block;

  margin: 0;

  padding: 0;

  color: var(--faint);

  font-size: 12px;

  line-height: 1.45;

}



.filter-grid .filter-choice .choice-set {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 0;

  height: 38px;

  background: rgba(16, 18, 20, 0.88);

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  overflow: hidden;

}



.filter-grid .filter-choice .choice-set label { display: flex; min-width: 0; }



.filter-grid .filter-choice .choice-set label + label { box-shadow: inset 1px 0 0 var(--line); }



.filter-grid .filter-choice .choice-set span {

  flex: 1;

  justify-content: center;

  width: 100%;

  height: 100%;

  min-height: 0;

  padding: 0 10px;

  border: 0;

  border-radius: 0;

  background: transparent;

  color: var(--text);

  font-size: 14px;

  line-height: 1;

}



.filter-grid .filter-choice .choice-set label:hover span { background: var(--panel-2); }



.filter-grid .filter-choice .choice-set input:checked + span,

.filter-grid .filter-choice .choice-set label:hover input:checked + span {

  background: #b8b2a4;

  color: #16181b;

  box-shadow: none;

}



.filter-grid .filter-choice .choice-set label:has(input:checked),

.filter-grid .filter-choice .choice-set label:has(input:checked) + label { box-shadow: none; }



.filter-grid .multi-select,

.ops-filters .multi-select,

.form-grid .multi-select {

  position: relative;

  display: grid;

  gap: 5px;

  margin: 0;

  min-width: 0;

}



.ops-filters .filter-caption,

.form-grid .filter-caption {

  display: block;

  margin: 0;

  padding: 0;

  color: var(--faint);

  font-size: 12px;

  line-height: 1.45;

}



.filter-grid .multi-select-trigger,

.ops-filters .multi-select-trigger,

.form-grid .multi-select-trigger {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  width: 100%;

  height: 40px;

  padding: 0 12px;

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  background: rgba(16, 18, 20, 0.88);

  color: var(--text);

  font: inherit;

  font-size: 14px;

  text-align: left;

  cursor: pointer;

}



.filter-grid .multi-select-trigger[aria-expanded="true"],

.ops-filters .multi-select-trigger[aria-expanded="true"],

.form-grid .multi-select-trigger[aria-expanded="true"] {

  border-color: var(--avatar-ring);

}



.filter-grid .multi-select-trigger [data-multi-label],

.ops-filters .multi-select-trigger [data-multi-label],

.form-grid .multi-select-trigger [data-multi-label] {

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.filter-grid .multi-select-caret,

.ops-filters .multi-select-caret,

.form-grid .multi-select-caret {

  flex: none;

  width: 12px;

  height: 8px;

  color: var(--muted);

}



.filter-grid .multi-select-trigger[aria-expanded="true"] .multi-select-caret,

.ops-filters .multi-select-trigger[aria-expanded="true"] .multi-select-caret,

.form-grid .multi-select-trigger[aria-expanded="true"] .multi-select-caret {

  transform: rotate(180deg);

}



.filter-grid .multi-select-menu,

.ops-filters .multi-select-menu,

.form-grid .multi-select-menu {

  position: absolute;

  top: calc(100% + 4px);

  left: 0;

  right: 0;

  z-index: 40;

  display: grid;

  gap: 0;

  max-height: min(280px, 50vh);

  overflow-x: hidden;

  overflow-y: auto;

  padding: 6px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: var(--radius-sm);

  box-shadow: var(--menu-shadow);

}



.filter-grid .multi-select-menu[hidden],

.ops-filters .multi-select-menu[hidden],

.form-grid .multi-select-menu[hidden] {

  display: none;

}



.city-filter { position: relative; }



.city-suggest {

  position: absolute;

  top: calc(100% + 4px);

  left: 0;

  right: 0;

  z-index: 40;

  display: grid;

  gap: 0;

  max-height: min(280px, 50vh);

  overflow-x: hidden;

  overflow-y: auto;

  margin: 0;

  padding: 6px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: var(--radius-sm);

  box-shadow: var(--menu-shadow);

}



.city-suggest[hidden] { display: none; }



.city-suggest button {

  display: block;

  width: 100%;

  margin: 0;

  padding: 8px 10px;

  border: 0;

  border-radius: 6px;

  background: transparent;

  color: var(--text);

  font: inherit;

  font-size: 14px;

  text-align: left;

  cursor: pointer;

}



.city-suggest button:hover,

.city-suggest button.is-active {

  background: var(--hover);

  color: var(--ink);

}



.filter-grid .multi-select-option,

.ops-filters .multi-select-option,

.form-grid .multi-select-option {

  display: flex;

  align-items: center;

  gap: 8px;

  margin: 0;

  padding: 8px 10px;

  border-radius: 6px;

  cursor: pointer;

  color: var(--text);

  font-size: 14px;

}



.filter-grid .multi-select-option:hover,

.ops-filters .multi-select-option:hover,

.form-grid .multi-select-option:hover {

  background: var(--hover);

}



.filter-grid .multi-select-option input,

.ops-filters .multi-select-option input,

.form-grid .multi-select-option input {

  position: absolute;

  opacity: 0;

  pointer-events: none;

}



.filter-grid .multi-select-text,

.ops-filters .multi-select-text,

.form-grid .multi-select-text {

  flex: 1;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.filter-grid .multi-select-check,

.ops-filters .multi-select-check,

.form-grid .multi-select-check {

  flex: none;

  width: 16px;

  color: var(--accent-2);

  font-size: 14px;

  font-weight: 700;

  line-height: 1;

  opacity: 0;

}



.filter-grid .multi-select-option:has(input:checked) .multi-select-check,

.ops-filters .multi-select-option:has(input:checked) .multi-select-check,

.form-grid .multi-select-option:has(input:checked) .multi-select-check {

  opacity: 1;

}



.filter-grid .multi-select-divider,

.ops-filters .multi-select-divider,

.form-grid .multi-select-divider {

  height: 1px;

  margin: 6px 8px;

  background: var(--hover-strong);

}



.ops-filters input {

  height: 40px;

  padding: 0 12px;

}



.filter-grid input,

.filter-grid select {

  height: 40px;

  padding: 0 12px;

}



.filter-grid input[type="date"] {

  color-scheme: dark;

  min-width: 0;

  width: 100%;

}



.filter-grid select {

  appearance: none;

  padding-right: 28px;

  background-color: rgba(16, 18, 20, 0.88);

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.2 6 6.2 11 1.2' fill='none' stroke='%239a9a94' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");

  background-repeat: no-repeat;

  background-position: right 10px center;

  background-size: 10px 7px;

}



.filter-head {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  gap: 16px;

  margin-bottom: 18px;

  transition: gap 0.36s cubic-bezier(0.22, 1, 0.36, 1), margin-bottom 0.36s cubic-bezier(0.22, 1, 0.36, 1);

}



.filter-head-main {

  display: flex;

  align-items: flex-start;

  gap: 12px;

  min-width: 0;

}



.filter-icon {

  display: grid;

  place-items: center;

  width: 42px;

  height: 42px;

  flex: none;

  margin: 0;

  padding: 0;

  border-radius: 12px;

  border: 1px solid var(--line);

  background: var(--hover);

  color: var(--accent-2);

  box-shadow: 0 0 18px var(--hover-mid);

  cursor: pointer;

}



button.filter-icon:hover,

.board.is-collapsed button.filter-icon,

.users-hero.is-collapsed button.filter-icon {

  border-color: var(--line-strong);

  background: var(--hover-strong);

}



.collapse-panel {

  display: grid;

  grid-template-rows: 1fr;

  opacity: 1;

  transition: grid-template-rows 0.36s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.28s ease;

}



.collapse-panel-inner {

  min-height: 0;

  overflow: hidden;

}



.collapse-panel.is-open > .collapse-panel-inner { overflow: visible; }



.is-collapsed .collapse-panel {

  grid-template-rows: 0fr;

  opacity: 0;

  pointer-events: none;

}



.board.is-collapsed {

  padding: 12px 16px;

}



.board.is-collapsed .filter-head {

  align-items: center;

  gap: 0;

  margin-bottom: 0;

}



.filter-head > .btn {

  max-width: 8rem;

  overflow: hidden;

  white-space: nowrap;

  border-radius: 6px;

  transition: max-width 0.36s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.24s ease, padding 0.36s cubic-bezier(0.22, 1, 0.36, 1);

}



.board.is-collapsed .filter-head > .btn {

  max-width: 0;

  opacity: 0;

  padding-left: 0;

  padding-right: 0;

  pointer-events: none;

}



.filter-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }



.filter-head h2 {

  margin: 0 0 4px;

  font-size: 20px;

  font-weight: 800;

  letter-spacing: -0.03em;

  transition: margin-bottom 0.36s cubic-bezier(0.22, 1, 0.36, 1);

}



.board.is-collapsed .filter-head h2 { margin-bottom: 0; }



.filter-head p {

  max-height: 40px;

  margin: 0;

  overflow: hidden;

  color: var(--muted);

  font-size: 13px;

  transition: max-height 0.36s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.24s ease;

}



.board.is-collapsed .filter-head p {

  max-height: 0;

  opacity: 0;

}



@media (prefers-reduced-motion: reduce) {

  .board,

  .filter-head,

  .filter-head h2,

  .filter-head p,

  .filter-head > .btn,

  .collapse-panel,

  .users-hero,

  .users-hero-copy,

  .users-art {

    transition: none;

  }

}



.filter-foot {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  margin-top: 18px;

  padding-top: 16px;

  border-top: 1px solid var(--line);

}



.filter-links {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

}



.filter-links a,

.filter-links button {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  width: auto;

  height: 38px;

  margin: 0;

  padding: 0 12px;

  border: 1px solid var(--line);

  border-radius: var(--radius-sm);

  background: rgba(16, 18, 20, 0.7);

  color: var(--muted);

  font: inherit;

  font-size: 13px;

  font-weight: 600;

  line-height: 1.4;

  cursor: pointer;

}



.filter-links a:hover,

.filter-links button:hover {

  color: var(--ink);

  border-color: var(--line-strong);

}



.filter-search,

.board-bar > .btn,

.board-bar > a.btn {

  width: 200px;

  min-width: 200px;

  box-sizing: border-box;

  flex: none;

  white-space: nowrap;

}



.board-actions {

  display: flex;

  flex-wrap: wrap;

  justify-content: flex-end;

  gap: 8px;

}



.board-actions .btn {

  width: auto;

  min-width: 0;

}



.board-bar {

  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 12px;

  margin: 16px 0 14px;

  padding: 14px 20px;

  border: 1px solid var(--line-faint);

  border-radius: 14px;

  background: var(--fill-soft);

  backdrop-filter: none;

}



.board-bar strong {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  font-size: 15px;

  font-weight: 700;

}



.board-bar strong::before {

  content: "";

  width: 18px;

  height: 18px;

  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a7a498' stroke-width='1.8'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='16.5' cy='9' r='2.5'/%3E%3Cpath d='M3.5 19c.6-2.8 2.8-4.2 5.5-4.2S14 16.2 14.5 19M14 15.2c1.5-.7 3.2-.7 4.8.2.9.5 1.5 1.4 1.8 2.6'/%3E%3C/svg%3E");

}



.saved-filters {

  display: grid;

  gap: 8px;

  margin-top: 12px;

}



.saved-filters[hidden] { display: none; }



.saved-chip {

  display: flex;

  align-items: stretch;

  min-height: 44px;

  border: 1px solid var(--line);

  border-radius: 10px;

  background: rgba(16, 18, 20, 0.55);

  overflow: hidden;

}



.saved-chip a {

  display: block;

  flex: 1;

  min-width: 0;

  padding: 0 14px;

  overflow: hidden;

  color: var(--text);

  font-size: 14px;

  font-weight: 600;

  line-height: 44px;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.saved-chip a:hover {

  color: var(--ink);

  background: var(--fill-mid);

}



.saved-chip button {

  flex: none;

  width: 44px;

  margin: 0;

  padding: 0;

  border: 0;

  border-left: 1px solid var(--line);

  border-radius: 0;

  background: transparent;

  color: var(--muted);

  font: inherit;

  font-size: 18px;

  line-height: 1;

  cursor: pointer;

}



.saved-chip button:hover {

  color: var(--text);

  background: var(--hover-mid);

}



.mass { position: relative; }



.mass[open] { z-index: 12; }



.mass > summary { list-style: none; }



.mass > summary::-webkit-details-marker { display: none; }



.mass-menu {

  position: absolute;

  right: 0;

  top: calc(100% + 6px);

  z-index: 12;

  min-width: 210px;

  padding: 6px;

  background: var(--panel-2);

  border: 1px solid var(--line);

  border-radius: 10px;

  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);

  display: grid;

}



.mass:not([open]) .mass-menu { display: none; }



.mass-menu button {

  display: flex;

  align-items: center;

  gap: 10px;

  text-align: left;

  background: none;

  border: 0;

  color: var(--text);

  padding: 8px 10px;

  border-radius: 7px;

  cursor: pointer;

  font: inherit;

}



.mass-menu .mass-icon {

  width: 16px;

  height: 16px;

  flex: none;

  color: var(--muted);

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linecap: round;

  stroke-linejoin: round;

}



.mass-menu button:hover .mass-icon {

  color: var(--ink);

}



.mass-menu button:hover { background: var(--panel-2); color: var(--ink); }



#mass-note { width: 100%; margin: 0; text-align: right; }



.account-tools {

  position: relative;

  z-index: 8;

  margin: 0 0 12px;

}



.account-tools .account-sum { margin: 0; }



.account-lead {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 10px 12px;

  min-width: 0;

}



.account-lead #mark-toggle {

  height: 32px;

  padding: 0 12px;

}



.account-mass {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: flex-end;

  gap: 10px;

}



.mass-label {

  display: flex;

  align-items: center;

  gap: 8px;

  margin: 0;

  color: var(--faint);

  font-size: 12px;

}



.mass-label input {

  width: 112px;

  min-width: 112px;

  margin: 0;

  padding: 8px 10px;

  font-size: 13px;

}



.modal-status { margin: 0; color: var(--text); font-size: 15px; }



.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }



.modal-actions .btn { width: auto; margin: 0; }



.format-download .hint { margin: 0 0 12px; line-height: 1.45; }



.format-sample {

  color: var(--ink);

  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;

  font-size: 12px;

}



.format-tokens {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  margin: 0 0 4px;

}



.format-token {

  margin: 0;

  padding: 4px 8px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: var(--fill-mid);

  color: var(--muted);

  font: 12px/1.3 ui-monospace, "Cascadia Mono", Consolas, monospace;

  cursor: pointer;

}



.format-token:hover {

  color: var(--ink);

  border-color: var(--line-strong);

}



#format-error { margin: 8px 0 0; color: var(--danger); }



.buy-modal .modal-actions.download-choices {

  display: grid;

  grid-template-columns: 1fr;

  gap: 10px;

  margin-top: 18px;

  padding-top: 18px;

  border-top: 1px solid var(--hover-strong);

}



.buy-modal .modal-actions.download-choices .btn {

  width: 100%;

  margin: 0;

}



.balance-form,

.adjust-form {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));

  gap: 8px;

  align-items: end;

  margin: 8px 0 22px;

}



.adjust-form {

  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(110px, 0.7fr) minmax(0, 1.3fr) auto;

  margin: 0;

}



.balance-form .btn,

.adjust-form .btn { height: 38px; white-space: nowrap; }



.tool-form {

  display: grid;

  grid-template-columns: minmax(150px, 200px) minmax(0, 1fr) auto;

  gap: 8px;

  align-items: center;

}



.tool-form.slim { grid-template-columns: minmax(0, 1fr) auto; }



.users-box {

  display: grid;

  gap: 14px;

}



.users-hero {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  gap: 12px;

  align-items: center;

  padding: 14px 16px;

  transition: gap 0.36s cubic-bezier(0.22, 1, 0.36, 1), padding 0.36s cubic-bezier(0.22, 1, 0.36, 1);

  border: 1px solid var(--line);

  border-radius: var(--radius);

  background: var(--raise);

  backdrop-filter: blur(16px);

  -webkit-backdrop-filter: blur(16px);

  box-shadow: 0 0 0 1px var(--fill-soft), 0 18px 50px rgba(0, 0, 0, 0.28);

}



.users-hero-copy {

  display: grid;

  gap: 8px;

  min-width: 0;

  transition: gap 0.36s cubic-bezier(0.22, 1, 0.36, 1);

}



.users-title-row {

  display: flex;

  align-items: center;

  gap: 12px;

  min-width: 0;

}



.users-hero.is-collapsed {

  gap: 0;

  padding: 12px 16px;

}



.users-hero.is-collapsed .users-hero-copy { gap: 0; }



.users-art {

  max-width: 72px;

  overflow: hidden;

  opacity: 1;

  transition: max-width 0.36s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.24s ease;

}



.users-hero.is-collapsed .users-art {

  max-width: 0;

  opacity: 0;

  pointer-events: none;

}



.users-hero h1 {

  margin: 0;

  font-size: 22px;

  font-weight: 800;

  letter-spacing: -0.03em;

}



.users-hero .user-search {

  max-width: 320px;

  margin: 0;

}



.users-art {

  width: 72px;

  height: auto;

  filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.2));

}



.user-search { max-width: 320px; margin: 0 0 14px; }



.tool-form .btn { height: 38px; white-space: nowrap; }



.facts { list-style: none; padding: 0; margin: 0; }



.facts li {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  column-gap: 16px;

  align-items: baseline;

  padding: 10px 0;

  border-top: 1px solid var(--line);

}



.facts li:first-child { border-top: 0; padding-top: 0; }



.facts time,

.facts li > span:last-child { white-space: nowrap; }



.facts time { color: var(--muted); }



.block .facts { margin-top: 12px; }



.people-count {

  margin: 2px 0 0;

  color: var(--ink);

  font-size: 22px;

  font-weight: 800;

  letter-spacing: -0.03em;

}



.block.people-board {

  padding: 12px 20px 10px;

}



.people-head,

.people-row {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  align-items: center;

  column-gap: 24px;

  width: 100%;

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



.people-head {

  padding-bottom: 8px;

  margin-bottom: 2px;

  border-bottom: 1px solid var(--line);

  color: var(--muted);

  font-size: 12px;

  font-weight: 500;

}



.people-head > span:last-child {

  text-align: right;

}



.people-date {

  text-align: right;

}



.people-list {

  display: grid;

}



.people-row {

  min-height: 46px;

  border-bottom: 1px solid var(--line);

}



.people-row:last-child {

  border-bottom: 0;

}



.people-row .seller {

  min-width: 0;

}



.people-row .seller:hover {

  color: var(--ink);

}



.people-date {

  flex: none;

  color: var(--muted);

  font-size: 13px;

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.vk-hidden { color: var(--muted); }



.proxy-box { display: grid; gap: 12px; align-content: start; }



.proxy-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

}



.proxy-head h2 { margin: 0; }



.proxy-list {

  list-style: none;

  margin: 0;

  padding: 0;

  display: grid;

  gap: 8px;

}



.proxy-list li {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  padding: 10px 12px;

  border: 1px solid var(--line);

  border-radius: var(--radius-sm);

  background: rgba(16, 18, 20, 0.55);

}



.proxy-list li.proxy-empty {

  color: var(--muted);

  justify-content: center;

}



.proxy-meta {

  display: grid;

  gap: 4px;

  min-width: 0;

}



.proxy-meta code {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 12px;

  color: var(--text);

}



.proxy-status {

  font-size: 12px;

  font-weight: 700;

}



.proxy-status.ok { color: #7ddea3; }

.proxy-status.bad { color: #f0a0a0; }



.proxy-modal { width: min(480px, calc(100vw - 32px)); }



.proxy-modal textarea {

  min-height: 140px;

  resize: vertical;

  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;

  font-size: 13px;

}



.proxy-formats {

  display: grid;

  gap: 4px;

  margin: 0 0 12px;

  color: var(--muted);

  font-size: 12px;

}



.proxy-formats strong {

  color: var(--text);

  font-size: 13px;

}



.proxy-formats code {

  display: block;

  color: var(--muted);

  font-size: 12px;

  word-break: break-all;

}



.proxy-add-note { margin: 10px 0 12px; }

.proxy-check li.ok span { color: #7ddea3; }

.proxy-check li.bad span { color: #f0a0a0; }



.proxy-formats p { margin: 6px 0 0; }



.proxy-check {

  list-style: none;

  margin: 0 0 12px;

  padding: 0;

  display: grid;

  gap: 6px;

  max-height: min(320px, 45vh);

  overflow: auto;

}



.proxy-check li {

  display: grid;

  gap: 2px;

  padding: 8px 10px;

  border-radius: 8px;

  border: 1px solid var(--line);

  font-size: 12px;

}



.proxy-check li.ok { border-color: rgba(90, 180, 120, 0.35); }

.proxy-check li.bad { border-color: rgba(220, 100, 100, 0.35); }



.proxy-check code {

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.sell-proxy-note { max-width: 46ch; }



.buy-modal { width: min(480px, calc(100vw - 32px)); }



#buy-status.buy-toast {

  width: min(340px, calc(100vw - 32px));

  max-width: calc(100vw - 32px);

  max-height: none;

  margin: 0;

  padding: 14px 16px;

  position: fixed;

  right: max(16px, env(safe-area-inset-right, 0px));

  bottom: max(16px, env(safe-area-inset-bottom, 0px));

  top: auto;

  left: auto;

  z-index: 40;

  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);

  opacity: 1;

  transform: translateY(0);

  transition: opacity 0.28s ease, transform 0.28s ease;

}



#buy-status.buy-toast.is-leaving {

  opacity: 0;

  transform: translateY(12px);

  pointer-events: none;

}



#buy-status.buy-toast .modal-head h2 {

  font-size: 15px;

}



#buy-status.buy-toast .modal-status {

  font-size: 13px;

  color: var(--muted);

}



#buy-status.buy-toast .modal-actions {

  margin-top: 10px;

}



#buy-status.buy-toast .buy-live {

  max-height: 140px;

}



#bulk-progress.bulk-progress {
  width: min(390px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: fixed !important;
  right: max(20px, env(safe-area-inset-right, 0px)) !important;
  bottom: max(20px, env(safe-area-inset-bottom, 0px)) !important;
  top: auto !important;
  left: auto !important;
  z-index: 9999 !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#bulk-progress.bulk-progress.is-leaving {
  opacity: 0 !important;
  transform: translateY(16px) scale(0.97) !important;
  pointer-events: none !important;
}

#bulk-progress::backdrop,
#bulk-progress.bulk-progress::backdrop {
  display: none !important;
  background: transparent !important;
}

.bulk-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 13px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 16px 18px 16px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #181c25 0%, #12141a 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 35px rgba(0, 119, 255, 0.1) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

.bulk-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.bulk-card-top strong {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -0.01em !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.bulk-card-top strong::before {
  content: "" !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #58a6ff !important;
  box-shadow: 0 0 10px #58a6ff !important;
  flex-shrink: 0 !important;
}

.bulk-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.bulk-status.wait {
  background: rgba(230, 179, 77, 0.12) !important;
  border: 1px solid rgba(230, 179, 77, 0.28) !important;
  color: #f5c05c !important;
}

.bulk-status.wait::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #f5c05c !important;
  box-shadow: 0 0 8px #f5c05c !important;
  animation: bulk-dot-pulse 1.4s ease-in-out infinite !important;
}

@keyframes bulk-dot-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.3; transform: scale(0.7); }
}

.bulk-status.ok {
  background: rgba(46, 160, 67, 0.15) !important;
  border: 1px solid rgba(46, 160, 67, 0.35) !important;
  color: #3fb950 !important;
}

.bulk-status.ok::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #3fb950 !important;
}

.bulk-status.bad {
  background: rgba(248, 81, 73, 0.15) !important;
  border: 1px solid rgba(248, 81, 73, 0.35) !important;
  color: #ff7b72 !important;
}

.bulk-status.bad::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #ff7b72 !important;
}

/* Progress track */
.bulk-progress-track {
  width: 100% !important;
  height: 6px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  position: relative !important;
}

.bulk-progress-fill {
  height: 100% !important;
  border-radius: 999px !important;
  transition: width 0.3s ease !important;
}

.bulk-progress-fill.wait {
  background: linear-gradient(90deg, #58a6ff 0%, #388bfd 50%, #79c0ff 100%) !important;
  background-size: 200% 100% !important;
  animation: bulk-shimmer 2s linear infinite !important;
  box-shadow: 0 0 10px rgba(88, 166, 255, 0.5) !important;
}

@keyframes bulk-shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.bulk-progress-fill.ok {
  background: linear-gradient(90deg, #238636, #3fb950) !important;
  box-shadow: 0 0 10px rgba(46, 160, 67, 0.5) !important;
}

.bulk-progress-fill.bad {
  background: linear-gradient(90deg, #da3633, #f85149) !important;
}

.bulk-card-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.bulk-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 26px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  color: #79c0ff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.bulk-when {
  color: #8b929e !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.bulk-card-stop {
  display: flex !important;
  margin-top: 2px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.bulk-card-stop[hidden] {
  display: none !important;
}

.bulk-card-stop .btn,
#bulk-progress-stop {
  width: 100% !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: rgba(248, 81, 73, 0.08) !important;
  border: 1px solid rgba(248, 81, 73, 0.22) !important;
  color: #ff7b72 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.16s ease !important;
}

.bulk-card-stop .btn:hover,
#bulk-progress-stop:hover {
  background: rgba(248, 81, 73, 0.18) !important;
  border-color: rgba(248, 81, 73, 0.45) !important;
  color: #ffffff !important;
  box-shadow: 0 0 14px rgba(248, 81, 73, 0.2) !important;
}

.bulk-card-stop .btn:disabled,
#bulk-progress-stop:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

@media (max-width: 480px) {
  #bulk-progress.bulk-progress {
    right: 12px !important;
    left: 12px !important;
    bottom: 12px !important;
    width: auto !important;
  }
}

.bulk-page-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 16px;

  margin-bottom: 16px;

}



.bulk-page-head h1 { margin: 0; }



.bulk-page-head .meta { margin: 6px 0 0; }



.download-pick { position: relative; }



.download-pick > summary {

  list-style: none;

  cursor: pointer;

}



.download-pick > summary::-webkit-details-marker { display: none; }



.download-pick-menu {

  display: none;

  position: absolute;

  top: calc(100% + 8px);

  right: 0;

  z-index: 6;

  min-width: 168px;

  padding: 6px;

  background: var(--panel-2);

  border: 1px solid var(--line);

  border-radius: 10px;

  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);

}



.download-pick[open] > .download-pick-menu { display: grid; }



.download-pick-menu a {

  display: flex;

  align-items: center;

  height: 32px;

  padding: 0 10px;

  border-radius: 7px;

  color: var(--text);

  font-size: 13px;

  font-weight: 500;

  text-decoration: none;

}



.download-pick-menu a:hover { background: var(--panel-2); color: var(--ink); }



.bulk-history { position: relative; align-items: center; }



.bulk-history-main { display: grid; gap: 6px; min-width: 0; }



.bulk-history-main .meta { margin: 0; }



.bulk-history-actions { display: flex; align-items: center; gap: 8px; flex: none; }



.bulk-history:has(.download-pick[open]),

.bulk-history:has(.mass[open]) { z-index: 6; }



.bulk-page-actions { position: relative; }



a.upload-card {

  color: inherit;

  text-decoration: none;

}



a.upload-card:hover { color: inherit; }



.upload-card-main,

.upload-card-side { display: grid; gap: 4px; min-width: 0; }



.upload-card-main .meta { margin: 0; }



.upload-card-side { justify-items: end; flex: none; }



.upload-state { font-weight: 700; white-space: nowrap; }



.upload-ratio {

  font-variant-numeric: tabular-nums;

  font-weight: 700;

  white-space: nowrap;

}



.upload-ratio span + span::before {

  content: "/";

  color: var(--faint);

  font-weight: 500;

  padding: 0 1px;

}



.upload-ok { color: var(--ok); }

.upload-bad { color: var(--danger); }

.upload-block { color: #e8923a; }

.upload-dup { color: #e6c15a; }

.upload-wait { color: var(--muted); }



.upload-head {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  gap: 16px;

  margin-bottom: 14px;

}



.upload-head h1 { margin: 0; }



.card.upload-stats {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  text-align: center;

  padding: 18px 12px;

  margin-bottom: 12px;

  gap: 0;

}



.card.upload-stats b {

  display: block;

  font-size: 22px;

  font-weight: 700;

  line-height: 1.2;

}



.card.upload-stats span { color: var(--faint); font-size: 13px; }



.upload-pill {

  display: inline-flex;

  align-items: center;

  gap: 6px;

  height: 28px;

  padding: 0 10px;

  border-radius: 999px;

  border: 1px solid transparent;

  font-size: 13px;

  font-weight: 700;

  white-space: nowrap;

  line-height: 1;

}



.upload-pill.upload-ok {

  color: var(--ok);

  background: rgba(93, 219, 165, 0.12);

  border-color: rgba(93, 219, 165, 0.45);

}



.upload-pill.upload-ok::before { content: "✓"; }



.upload-pill.upload-bad {

  color: var(--danger);

  background: rgba(255, 123, 138, 0.12);

  border-color: rgba(255, 123, 138, 0.4);

}



.upload-pill.upload-wait,

.upload-pill.upload-run {

  color: var(--accent-2);

  background: var(--hover);

  border-color: var(--line-strong);

}



.upload-files {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 10px;

}



.upload-file {

  display: flex;

  align-items: center;

  gap: 8px;

  min-width: 0;

  height: 44px;

  padding: 0 12px;

  border: 1px solid var(--line);

  border-radius: 12px;

  background: rgba(16, 18, 20, 0.92);

}



.upload-file.is-bad {

  border-color: rgba(255, 123, 138, 0.55);

  background: linear-gradient(180deg, rgba(255, 123, 138, 0.1), rgba(26, 28, 32, 0.94));

}



.upload-file.is-block {

  border-color: rgba(232, 146, 58, 0.55);

  background: linear-gradient(180deg, rgba(232, 146, 58, 0.12), rgba(26, 28, 32, 0.94));

}



.upload-file.is-ok {

  border-color: rgba(93, 219, 165, 0.5);

  background: linear-gradient(180deg, rgba(93, 219, 165, 0.1), rgba(26, 28, 32, 0.94));

}



.upload-file.is-dup {

  border-color: rgba(230, 193, 90, 0.55);

  background: linear-gradient(180deg, rgba(230, 193, 90, 0.1), rgba(26, 28, 32, 0.94));

}



.upload-file.is-run {

  border-color: var(--line-strong);

  background: linear-gradient(180deg, var(--hover-mid), rgba(26, 28, 32, 0.94));

}



.upload-file .name,

.upload-file .note {

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.upload-file .name {

  flex: 0 1 auto;

  max-width: 48%;

  color: var(--text);

}



.upload-file .sep {

  flex: none;

  width: 1px;

  height: 14px;

  background: var(--hover-strong);

}



.upload-file .note { flex: 1 1 auto; }



@media (max-width: 980px) {

  .upload-files { grid-template-columns: repeat(2, minmax(0, 1fr)); }

}



@media (max-width: 640px) {

  .upload-files { grid-template-columns: minmax(0, 1fr); }

}



a.upload-lot {

  color: var(--ok);

  font-weight: 700;

  text-decoration: none;

}



a.upload-lot:hover { color: var(--ok); text-decoration: underline; }

a.upload-lot.is-dup { color: #e6c15a; }

a.upload-lot.is-dup:hover { color: #e6c15a; text-decoration: underline; }



.upload-run { color: var(--accent-2); }



.upload-tools {

  display: flex;

  justify-content: flex-end;

  align-items: center;

  gap: 8px;

  margin: 0 0 12px;

}



.upload-tools:has(.upload-stop) { justify-content: flex-start; }



.upload-stop { margin: 0; }



.upload-tools[hidden],

.upload-stop[hidden],

#error-open[hidden],

#proxy-recheck[hidden] { display: none !important; }



#error-list {

  display: block;

  width: 100%;

  min-height: 148px;

  max-height: 180px;

  margin: 0;

  resize: none;

  font-size: 13px;

  line-height: 1.5;

}



#error-copy { margin-top: 18px; }



.error-filter {

  display: grid;

  gap: 8px;

  margin-top: 16px;

}



.error-filter .filter-caption { margin: 0; }



#error-checks { display: grid; gap: 8px; }



#error-checks label {

  margin: 0;

  user-select: none;

}



#error-checks input {

  width: auto;

  margin: 0;

  padding: 0;

  background: transparent;

  border: 0;

  border-radius: 0;

  outline: none;

  box-shadow: none;

  accent-color: var(--accent-2);

}



#error-checks input:focus,

#error-checks input:focus-visible {

  outline: none;

  box-shadow: none;

}



@media (max-width: 720px) {

  .bulk-history { flex-wrap: wrap; }

  .bulk-history-actions { width: 100%; }

}



.buy-live {

  margin: 0 0 14px;

  max-height: 280px;

  overflow: auto;

}



.people {

  list-style: none;

  margin: 14px 0 0;

  padding: 0;

  display: grid;

  gap: 8px;

}



.people li {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  min-height: 46px;

  padding: 6px 8px 6px 10px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: 10px;

}



.people .person {

  display: flex;

  align-items: center;

  gap: 10px;

  min-width: 0;

  color: var(--text);

  font-weight: 600;

}



.people .avatar {

  width: 28px;

  height: 28px;

  font-size: 13px;

  background: linear-gradient(180deg, var(--avatar-from), var(--avatar-to));

}



.people .mini-star {

  width: 14px;

  height: 14px;

  flex: none;

  color: #f2c14b;

  fill: currentColor;

}



.people .person-name {

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.people form { margin: 0; flex: none; }



.people li.people-empty {

  min-height: 0;

  padding: 2px 0 0;

  background: none;

  border: 0;

  color: var(--muted);

}



.facts form { margin: 0; justify-self: end; }





.btn, button.btn {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  height: 40px;

  padding: 0 16px;

  border-radius: 10px;

  border: 1px solid var(--avatar-ring);

  background: transparent;

  color: var(--text);

  font-weight: 500;

  cursor: pointer;

  box-shadow: none;

}



.btn:hover {

  background: var(--hover);

  border-color: var(--line-strong);

  color: var(--ink);

  filter: none;

}



.btn.buy {

  border-radius: 10px;

  background: rgba(143, 186, 154, 0.16);

  border: 1px solid rgba(143, 186, 154, 0.38);

  color: #cbe7d3;

  font-weight: 600;

  transition: all 160ms ease;

}



.btn.buy:hover {

  background: rgba(143, 186, 154, 0.28);

  border-color: rgba(143, 186, 154, 0.65);

  color: #f0fdf4;

  box-shadow: 0 2px 14px rgba(143, 186, 154, 0.2);

}



.btn.buy:active {

  transform: translateY(1px);

}



a.btn,

a.btn:hover,

a.btn:not(.ghost):not(.danger),

a.btn:not(.ghost):not(.danger):hover { color: var(--text); }



.btn.ghost {

  background: transparent;

  border: 1px solid var(--avatar-ring);

  color: var(--text);

  font-weight: 500;

  box-shadow: none;

}



.btn.ghost:hover {

  background: var(--hover);

  border-color: var(--line-strong);

  color: var(--ink);

}



.btn.danger {

  background: transparent;

  border: 1px solid #5c3d46;

  color: var(--danger);

}



.btn.stop-check,

#clear-files.stop-check {

  background: #d24b45;

  border: 1px solid #d24b45;

  color: #fff;

  font-weight: 700;

}



.btn.stop-check:hover,

#clear-files.stop-check:hover {

  background: #e15c56;

  border-color: #e15c56;

  color: #fff;

}



.btn.stop-check:disabled,

#clear-files.stop-check:disabled {

  opacity: 0.9;

  background: #d24b45;

  border-color: #d24b45;

  color: #fff;

  cursor: default;

}



.btn.ignore {

  background: #d24b45;

  border: 1px solid #d24b45;

  color: #fff;

  font-weight: 700;

}



.btn.ignore:hover { background: #e15c56; color: #fff; }



.btn.small { height: 30px; padding: 0 10px; font-size: 13px; }



.btn.starred { gap: 6px; }



.btn.starred .star {

  width: 14px;

  height: 14px;

  flex: none;

  color: #f2c14b;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.8;

  stroke-linejoin: round;

}



.btn.starred.ghost .star { fill: currentColor; stroke: none; }



.btn .btn-icon {

  width: 16px;

  height: 16px;

  flex: none;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.8;

  stroke-linecap: round;

  stroke-linejoin: round;

}



.btn[data-copy] {

  transition: opacity 160ms ease, transform 160ms ease, color 160ms ease, background-color 160ms ease, border-color 160ms ease;

}



.btn[data-copy].is-copy-swap {

  opacity: 0;

  transform: scale(0.96);

}



.btn[data-copy].is-copied {

  color: var(--ok, #7ddea3);

}



.btn.small .btn-icon { width: 14px; height: 14px; }



.btn.buy,

.btn.ignore { gap: 6px; }



.btn:disabled { opacity: 0.55; cursor: default; }

.btn.is-busy {

  opacity: 0.85;

  cursor: default;

  pointer-events: none;

}



.rows { display: grid; gap: 8px; margin-top: 12px; }



.rows[hidden],

#account-empty[hidden],

.board-bar > .btn[hidden] { display: none; }



.row {

  display: flex;

  justify-content: space-between;

  gap: 16px;

  align-items: center;

  padding: 12px 14px;

  color: inherit;

}



.row:hover { border-color: var(--avatar-ring); }



.listing-row {

  transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease, background-color 200ms ease;

}



.listing-row > .card-open {

  position: absolute;

  inset: 0;

  z-index: 1;

  border-radius: inherit;

}



.listing-row .account-foot a,

.listing-row .account-side form,

.listing-row .account-side > .btn,

.listing-row .account-side > [data-web-login-box] {

  position: relative;

  z-index: 3;

}



@media (hover: hover) and (pointer: fine) {

  .listing-row:hover {

    transform: translateY(-2px);

    border-color: rgba(255, 255, 255, 0.2);

    background: #17191d;

    box-shadow: 0 10px 24px -6px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.08);

  }



  .listing-row.is-viewed:hover {

    background: rgba(176, 184, 192, 0.06);

    border-color: rgba(176, 184, 192, 0.16);

  }



  .listing-row .account-side form { pointer-events: none; }



  .listing-row:hover .account-side form,
  .listing-row .account-side form:focus-within { pointer-events: auto; }

  .listing-row .account-side .btn {
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
  }

  .listing-row:hover .account-side .btn,
  .listing-row .account-side form:focus-within .btn {
    opacity: 1;
    pointer-events: auto;
  }

}



.row.static:hover { border-color: var(--line); }



.row-main { display: grid; gap: 4px; min-width: 0; flex: 1; color: inherit; }



.row-main strong { font-size: 14px; }



.listing-row { position: relative; align-items: stretch; padding: 16px 18px; }



.listing-row:hover,

.listing-row:focus-within { z-index: 4; }

.listing-row:has(.more[open]) { z-index: 100 !important; }



.listing-row form { margin: 0; }



.account-main { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; }



.account-main:has(.lot-vk) { flex-direction: row; align-items: center; justify-content: flex-start; gap: 14px; }



.account-body {

  flex: 1;

  min-width: 0;

  display: flex;

  flex-direction: column;

  justify-content: center;

  gap: 8px;

}



.lot-vk {

  display: grid;

  place-items: center;

  flex: none;

  color: var(--accent-2);

}



.lot-vk .vk-mark {

  width: 26px;

  height: 16px;

}



.lot-vk-split {

  display: none;

  flex: none;

  align-self: stretch;

  width: 1px;

  margin-block: -16px;

  background: var(--line-strong);

}



.account-side {

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  justify-content: space-between;

  gap: 16px;

  flex-shrink: 0;

}



.side-top { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }



.account-side .price {

  font-size: 18px;

  font-weight: 700;

  color: var(--ink);

  white-space: nowrap;

  font-variant-numeric: tabular-nums;

}



.listing-row .account-side .btn.buy {

  height: 36px;

  padding: 0 14px;

  border-radius: 10px;

}



.fav {

  position: relative;

  z-index: 3;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 32px;

  height: 32px;

  padding: 0;

  border: 0;

  border-radius: 999px;

  background: transparent;

  color: var(--muted);

  cursor: pointer;

  text-decoration: none;

}



.fav svg { width: 20px; height: 20px; }



.fav svg path {

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linejoin: round;

}



.fav:hover { color: var(--text); }



.fav.is-on,

.fav.is-on:hover { color: #ff6b8a; }



.fav.is-on svg path { fill: currentColor; stroke: none; }



.lot-buyline {

  display: grid;

  grid-template-columns: 1fr auto 1fr;

  align-items: center;

  column-gap: 8px;

  margin: 2px 0 10px;

}



.lot-buyline .price {

  grid-column: 2;

  margin: 0;

}



.lot-buyline .fav {

  grid-column: 3;

  justify-self: start;

}



.chips { display: flex; flex-wrap: wrap; gap: 6px; }



.account-chips-stack {

  display: flex;

  flex-direction: column;

  gap: 7px;

}



.chips-meta {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  align-items: center;

}



.chips-profile {

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

  align-items: center;

}



.account-body .chips {

  margin: 0;

}



.chip {

  display: inline-flex;

  align-items: center;

  min-height: 25px;

  padding: 3px 9px;

  border: 1px solid var(--line);

  border-radius: 7px;

  background: rgba(255, 255, 255, 0.035);

  color: #b0b0a8;

  font-size: 12px;

  line-height: 1.25;

  font-weight: 500;

  white-space: nowrap;

  font-variant-numeric: tabular-nums;

  transition: border-color 0.15s ease, background-color 0.15s ease;

}



.chip-ico {

  width: 13px;

  height: 13px;

  flex-shrink: 0;

  margin-right: 5px;

  opacity: 0.85;

}



.chip-ico.ico-friends { color: #5ddba5; }

.chip-ico.ico-followers { color: #c084fc; }

.chip-ico.ico-groups { color: #e6c15a; }
.chip-ico.ico-admin-groups { color: #fbbf24; }
.chip.chip-admin-groups {
  background: rgba(251, 191, 36, 0.09) !important;
  border-color: rgba(251, 191, 36, 0.28) !important;
  color: #fbbf24 !important;
  font-weight: 600 !important;
}

.chip-ico.ico-dialogs { color: #60a5fa; }

.chip-ico.ico-relation { color: #f472b6; }

.chip-ico.ico-sex { color: #93c5fd; }

.chip-ico.ico-age { color: #cbd5e1; }

.chip-ico.ico-country { color: #38bdf8; }

.chip-ico.ico-city { color: #fb7185; }

.chip-ico.ico-reg { color: #94a3b8; }

.chip-ico.ico-phone { color: #5ddba5; }

.chip-ico.ico-email { color: #5ddba5; }

.chip-ico.ico-2fa { opacity: 0.9; }



.chip.origin-brut {

  background: rgba(180, 140, 70, 0.12);

  border-color: rgba(180, 140, 70, 0.28);

  color: #c4b08a;

}



.chip.origin-autoreg {

  background: rgba(140, 130, 155, 0.12);

  border-color: rgba(140, 130, 155, 0.28);

  color: #b8b0c4;

}



.chip.origin-phish {

  background: rgba(180, 100, 100, 0.12);

  border-color: rgba(180, 100, 100, 0.28);

  color: #c9a09e;

}



.chip.origin-logs {

  background: rgba(120, 140, 155, 0.12);

  border-color: rgba(120, 140, 155, 0.28);

  color: #a8b4be;

}



.chip.origin-own {

  background: rgba(120, 150, 130, 0.12);

  border-color: rgba(120, 150, 130, 0.28);

  color: #a8c0b0;

}



.chip.good {

  background: rgba(93, 219, 165, 0.1);

  border-color: rgba(93, 219, 165, 0.28);

  color: #5ddba5;

  font-weight: 600;

}



.chip.warn {

  background: rgba(180, 90, 90, 0.12);

  border-color: rgba(180, 90, 90, 0.3);

  color: #c9a09e;

  font-weight: 600;

}



.chip.bad {

  background: rgba(255, 123, 138, 0.1);

  border-color: rgba(255, 123, 138, 0.3);

  color: #ff7b8a;

  font-weight: 600;

}



.chip.mark {

  background: rgba(214, 176, 92, 0.16);

  border-color: rgba(222, 186, 104, 0.48);

  color: #f3ddb0;

}



.account-tabs { margin-bottom: 14px; }



.account-sum { margin: 0 0 12px; }



.more {

  position: absolute;

  inset: 0;

  z-index: 2;

  pointer-events: none;

}



.more[open] { z-index: 101 !important; }



.more > summary {

  pointer-events: auto;

  position: absolute;

  right: 16px;

  bottom: 14px;

  list-style: none;

  cursor: pointer;

  width: 30px;

  height: 30px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border-radius: 8px;

  border: 1px solid var(--line);

  background: var(--panel);

  color: #c8c6c0;

  padding: 0;

}



.more > summary svg {

  width: 15px;

  height: 15px;

  display: block;

}



.more > summary::-webkit-details-marker { display: none; }



.more-menu { display: none; }



.more[open] > .more-menu {

  pointer-events: auto;

  display: grid;

  position: absolute;

  top: calc(100% + 4px);

  right: 16px;

  z-index: 102 !important;

  width: 210px;

  padding: 4px;

  background: var(--panel-2);

  border: 1px solid var(--line);

  border-radius: 10px;

  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45);

}



.more-menu form { margin: 0; }



.more-menu .hint {

  margin: 0;

  padding: 10px 12px;

  font-size: 13px;

  line-height: 1.4;

  text-align: left;

}



.more-menu .btn {

  width: 100%;

  height: 28px;

  min-height: 0;

  justify-content: flex-start;

  gap: 8px;

  padding: 0 10px;

  border: 0;

  border-radius: 7px;

  background: transparent;

  color: var(--text);

  font-size: 13px;

  font-weight: 500;

  white-space: nowrap;

}



.more-menu .btn .mass-icon {

  width: 14px;

  height: 14px;

  color: var(--muted);

}



.more-menu .btn:hover .mass-icon {

  color: currentColor;

}



.more-menu .btn:hover { background: var(--panel-2); color: var(--ink); }



.more-menu .btn.danger { color: #ff8d8d; background: transparent; }



.more-menu .btn.danger .mass-icon { color: currentColor; }



.more-menu .btn.danger:hover { background: rgba(214, 78, 58, 0.16); color: #ffb4b4; }



@media (hover: hover) and (pointer: fine) {

  .listing-row .more > summary {

    opacity: 0;

  }



  .listing-row:hover .more > summary,

  .listing-row:focus-within .more > summary,

  .listing-row .more[open] > summary {

    opacity: 1;

    color: var(--ink);

    border-color: var(--line-strong);

  }

}



.listing-row .more .btn {

  opacity: 1;

  pointer-events: auto;

}



.chips-link, .chips-link:hover { color: inherit; }



.lot-chips { margin: 0 0 14px; }



.account-foot {

  display: flex;

  flex-wrap: wrap;

  gap: 5px 8px;

  align-items: center;

  color: var(--muted);

  font-size: 12.5px;

  margin-top: 0;

}



.account-foot .foot-dot {

  color: rgba(255, 255, 255, 0.2);

  font-weight: 700;

  user-select: none;

  font-size: 13px;

  line-height: 1;

}



.account-foot .foot-time {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  color: var(--muted);

}



.account-foot .foot-ico {

  width: 13px;

  height: 13px;

  color: #94a3b8;

  flex-shrink: 0;

  vertical-align: middle;

}



.card-vk-link {

  display: inline-flex;

  align-items: center;

  gap: 6px;

}



.vk-link-mark {

  display: none;

  place-items: center;

  color: var(--accent-2);

}



.vk-link-mark .vk-mark {

  width: 16px;

  height: 10px;

}



.seen-mark {

  display: none;

  align-items: center;

  gap: 5px;

  color: var(--accent);

}



.seen-mark svg {

  width: 15px;

  height: 15px;

  flex: none;

}



.seen-mark svg path,

.seen-mark svg circle {

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linejoin: round;

  stroke-linecap: round;

}



.listing-row.is-viewed {

  background: rgba(176, 184, 192, 0.035);

  border-color: rgba(176, 184, 192, 0.12);

}



.listing-row.is-viewed .chips,

.listing-row.is-viewed .row-title {

  opacity: 0.72;

}



.listing-row.is-viewed .seen-mark {

  display: inline-flex;

}



.seller {

  display: inline-flex;

  align-items: center;

  gap: 7px;

  min-width: 0;

  color: var(--text);

  font-weight: 700;

  line-height: 1;

  vertical-align: middle;

}



.account-foot .seller:hover,

.lot-seller .seller:hover { color: var(--ink); }



.seller-avatar {

  display: inline-grid;

  place-items: center;

  flex: none;

  width: 18px;

  height: 18px;

  border-radius: 50%;

  background: linear-gradient(180deg, var(--avatar-from), var(--avatar-to));

  border: 1px solid var(--line-strong);

  color: var(--accent-2);

  box-sizing: border-box;

  overflow: hidden;

  line-height: 0;

}



.seller-avatar svg {

  width: 12px;

  height: 12px;

  display: block;

  flex: none;

}



.seller-nick {

  display: block;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  line-height: 18px;

}



.lot-seller {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  gap: 8px;

}



.lot-seller .seller {

  font-size: 14px;

}



.lot-seller .seller-avatar {

  width: 20px;

  height: 20px;

}



.lot-seller .seller-avatar svg {

  width: 13px;

  height: 13px;

}



.lot-seller .seller-nick {

  line-height: 20px;

}



.lot-seller-marks {

  display: flex;

  justify-content: center;

  margin: 10px 0 0;

}



.center-block .lot-seller-marks .order-actions {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  width: auto;

  margin: 0;

  gap: 8px;

}



.lot-seller-marks .order-actions form,

.lot-seller-marks .order-actions .btn {

  width: auto;

  height: 34px;

}



.lot-split {

  width: min(100%, 520px);

  height: 0;

  margin: 14px auto 0;

  border: 0;

  border-top: 1px solid var(--line);

  background: none;

}



.lot-split + .lot-purchase,

.lot-split + .lot-actions {

  margin-top: 14px;

}



.lot-actions > .lot-split {

  margin: 4px 0;

}



.listing-row .pick { align-self: center; }



label.pick { display: flex; align-items: center; gap: 8px; width: auto; color: var(--text); font-size: 14px; }



label.pick input { width: 16px; height: 16px; }



.buy-bar { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 12px; }



.price { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 16px; }



.price-lg { font-size: 28px; margin: 6px 0 12px; }



.meta, .hint, .muted, .lead { color: var(--muted); }



.tags { display: flex; flex-wrap: wrap; gap: 6px; }



.tags i, .tags li {

  font-style: normal;

  border: 1px solid var(--line);

  border-radius: 999px;

  padding: 1px 8px;

  color: var(--muted);

  font-size: 12px;

  list-style: none;

}



.tags { list-style: none; padding: 0; margin: 0; }



.empty { color: var(--muted); padding: 18px 0; text-align: center; }



.view-as {

  background: rgba(255, 196, 92, 0.1);

  border-bottom: 1px solid rgba(255, 196, 92, 0.32);

}



.view-as-inner {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  min-height: 48px;

}



.view-as p { margin: 0; font-weight: 600; }



.admin-enter { margin: 0 0 14px; }



.flash {

  border: 1px solid var(--line-strong);

  border-radius: 10px;

  padding: 12px 16px;

  background: var(--raise-solid);

  backdrop-filter: blur(12px);

  -webkit-backdrop-filter: blur(12px);

  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);

  font-size: 13.5px;

  line-height: 1.4;

  animation: toastIn 200ms cubic-bezier(0.16, 1, 0.3, 1);

  user-select: none;

}



@keyframes toastIn {

  from { opacity: 0; transform: translateY(10px) scale(0.96); }

  to { opacity: 1; transform: translateY(0) scale(1); }

}



.flash.ok {

  border-color: rgba(143, 186, 154, 0.35);

  color: #c0dec8;

}



.flash.error {

  border-color: rgba(201, 138, 132, 0.35);

  color: #e5b2ae;

}



.toasts {

  position: fixed;

  right: 16px;

  bottom: 16px;

  z-index: 30;

  display: grid;

  gap: 8px;

  width: min(340px, calc(100% - 32px));

  pointer-events: none;

}



.toasts .flash {

  pointer-events: auto;

}



.narrow {

  width: min(440px, 100%);

  margin-inline: auto;

  text-align: left;

}



.narrow .form-grid > .btn,

.sell-box > .btn { width: 100%; }



.form-grid { display: grid; gap: 12px; margin: 14px 0; justify-items: stretch; }



.autobuy-page .autobuy-status { margin-bottom: 4px; }



.autobuy-page .form-grid { margin: 18px 0 26px; }



.autobuy-page .choice.filter-choice {

  display: grid;

  gap: 10px;

  margin: 6px 0 2px;

}



.autobuy-page .choice.filter-choice .filter-caption {

  display: block;

  margin: 0;

  color: var(--faint);

  font-size: 12px;

  line-height: 1.45;

}



.autobuy-page .autobuy-filters-title {

  margin: 22px 0 4px;

}



.autobuy-page .filter-grid { margin-top: 4px; }



.autobuy-page .autobuy-actions {

  justify-content: flex-start;

  margin: 0;

}



.autobuy-page .autobuy-note {

  margin: 22px 0 0;

  max-width: 68ch;

  line-height: 1.55;

}



.page-head { margin-bottom: 16px; text-align: center; }



.page-head .order-actions { justify-content: center; margin-top: 10px; }



.block,

.sell-box,

.center-block,

.narrow {

  border: 1px solid var(--line);

  background: var(--raise);

  backdrop-filter: blur(16px);

  -webkit-backdrop-filter: blur(16px);

  border-radius: var(--radius);

  box-shadow: 0 0 0 1px var(--fill-soft), 0 18px 50px rgba(0, 0, 0, 0.28);

}



.block { padding: 16px 18px; margin: 0 0 14px; }



.sell-box {

  width: min(820px, 100%);

  margin-inline: auto;

  display: grid;

  justify-items: stretch;

  gap: 16px;

  text-align: left;

  padding: 28px 26px;

}



.center-block { padding: 22px 18px 18px; }



.narrow { padding: 18px; }



.form-grid label,

.block,

.block h1,

.block h2 { text-align: left; }



.block h2 { margin: 0 0 12px; }



.block .empty { text-align: center; }



.sell-box h1,

.sell-box .lead,

.sell-box .hint { margin: 0; }



.sell-hero {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  gap: 18px;

  align-items: center;

}



.sell-hero-copy {

  display: grid;

  gap: 10px;

}



.sell-kicker {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  color: var(--accent-2);

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 0.08em;

  text-transform: uppercase;

}



.sell-kicker .vk-mark {

  width: 24px;

  height: 14px;

  filter: none;

}



.sell-box h1 {

  font-size: 32px;

  font-weight: 800;

  letter-spacing: -0.04em;

}



.sell-box .lead {

  max-width: 46ch;

  color: var(--muted);

  font-size: 14px;

  line-height: 1.55;

}



.sell-art {

  width: min(180px, 34vw);

  height: auto;

  filter: drop-shadow(0 16px 30px rgba(0,0,0,0.25));

}



.sell-facts {

  display: grid;

  gap: 14px;

}



.sell-box label.sell-price { text-align: left; }



.sell-price-wrap {

  display: grid;

  gap: 6px;

}



.sell-price-field {

  position: relative;

}



.sell-price-field::before {

  content: "₽";

  position: absolute;

  left: 12px;

  top: 50%;

  transform: translateY(-50%);

  color: var(--muted);

  font-weight: 700;

}



.sell-price-field input { padding-left: 30px; height: 44px; }



.sell-actions { display: grid; gap: 10px; }



.sell-upload {

  display: grid;

  gap: 14px;

  margin-top: 4px;

}



.sell-mode { margin: 0; }



.sell-lines-label {

  display: block;

  margin-bottom: 6px;

  color: var(--faint);

  font-size: 12px;

}



#sell-lines {

  width: 100%;

  height: 180px;

  min-height: 180px;

  max-height: 180px;

  resize: none;

  overflow: auto;

  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  font-size: 13px;

  line-height: 1.45;

}



.sell-lines-hint {

  display: grid;

  gap: 6px;

  margin-top: 8px;

  color: var(--muted);

  font-size: 12px;

}



.sell-lines-hint p { margin: 0; }



.sell-format-codes {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}



.sell-lines-hint code {

  display: inline-block;

  width: fit-content;

  padding: 2px 8px;

  border-radius: 6px;

  background: var(--hover);

  color: var(--text);

}



.sell-publish-row { margin-top: 4px; }



.download-formats {

  display: inline-flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 8px;

}



.download-formats > span {

  color: var(--muted);

  font-size: 13px;

}



.download-formats a,

.download-formats button {

  font-size: 13px;

}



.sell-files {

  border: 1px solid var(--line);

  border-radius: 14px;

  background: rgba(16, 18, 20, 0.72);

  overflow: hidden;

}



.sell-files-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  padding: 12px 14px;

  border-bottom: 1px solid var(--line);

}



.sell-files-title {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  margin: 0;

  font-size: 14px;

  font-weight: 700;

}



.sell-files-title svg { width: 16px; height: 16px; color: var(--accent-2); }



.choice {

  border: 0;

  margin: 0;

  padding: 0;

  text-align: left;

}



.choice legend {

  padding: 0;

  margin: 0 0 8px;

  color: var(--faint);

  font-size: 12px;

  font-weight: 600;

}



.choice-set { display: flex; flex-wrap: wrap; gap: 8px; }



.choice-set label {

  display: inline-flex;

  margin: 0;

  cursor: pointer;

}



.choice-set input {

  position: absolute;

  width: 1px;

  height: 1px;

  opacity: 0;

}



.choice-set span {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  min-height: 38px;

  padding: 4px 14px;

  border-radius: var(--radius-sm);

  border: 1px solid var(--hover);

  background: rgba(16, 18, 20, 0.8);

  color: #d4d2cc;

  font-size: 14px;

  font-weight: 600;

}



.choice.origin-set .choice-set {

  display: grid;

  grid-template-columns: repeat(5, minmax(0, 1fr));

  gap: 8px;

}



.choice.origin-set .choice-set label { width: 100%; }



.choice.origin-set .choice-set span {

  width: 100%;

  justify-content: center;

  min-height: 46px;

}



.choice.origin-set .ico {

  width: 16px;

  height: 16px;

  flex: none;

}



.choice.pair-set .choice-set {

  display: grid;

  grid-template-columns: 1fr 1fr;

  max-width: 280px;

  gap: 0;

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  overflow: hidden;

  background: rgba(16, 18, 20, 0.88);

}



.choice.pair-set .choice-set span {

  width: 100%;

  justify-content: center;

  border: 0;

  border-radius: 0;

  background: transparent;

}



.choice-set label:hover span { background: var(--hover); }



.choice-set input:checked + span,

.choice.pair-set .choice-set input:checked + span,

.choice.pair-set .choice-set label:hover input:checked + span {

  background: #b8b2a4;

  color: #16181b;

  border-color: transparent;

  box-shadow: none;

}



.choice.origin-set .choice-set input:checked + span,

.choice.origin-set .choice-set label:hover input:checked + span {

  background: #b8b2a4;

  color: #16181b;

  border-color: transparent;

  box-shadow: none;

}



.choice-set input:focus-visible + span {

  outline: 2px solid var(--ink);

  outline-offset: 2px;

}



.check-live {

  list-style: none;

  margin: 0;

  padding: 8px;

  display: grid;

  gap: 6px;

  max-height: 320px;

  overflow: auto;

  text-align: left;

}



.check-live[hidden] { display: none; }



.check-live li {

  display: grid;

  grid-template-columns: 20px minmax(0, 1fr) auto auto;

  align-items: center;

  gap: 10px;

  padding: 10px 12px;

  border-radius: 10px;

  background: rgba(16, 18, 20, 0.9);

  border: 1px solid var(--hover-mid);

}



.check-live .file-ico {

  width: 16px;

  height: 16px;

  color: var(--accent-2);

}



.check-live .name {

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-weight: 600;

}



.check-live .size {

  color: var(--muted);

  font-size: 12px;

  white-space: nowrap;

}



.check-live .state,

.check-live a.state-link {

  flex: none;

  min-width: 76px;

  width: fit-content;

  max-width: none;

  padding: 4px 10px;

  border-radius: 999px;

  text-align: center;

  font-size: 12px;

  font-weight: 700;

  line-height: 1.25;

  white-space: nowrap;

}



.buy-progress-info {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  color: var(--text);

  font-size: 13px;

  margin-bottom: 8px;

}



.buy-progress-info strong {

  font-weight: 700;

  color: var(--ink);

  font-variant-numeric: tabular-nums;

}



.buy-progress-wrap {

  width: 100%;

  height: 6px;

  background: rgba(255, 255, 255, 0.08);

  border-radius: 999px;

  overflow: hidden;

  margin: 0 0 10px;

}



.buy-progress-bar {

  height: 100%;

  width: 0%;

  background: linear-gradient(90deg, var(--accent-2), #5DDBA5);

  border-radius: 999px;

  transition: width 0.25s cubic-bezier(0.16, 1, 0.3, 1);

}



.buy-stats-strip {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 8px;

  margin: 0 0 14px;

}



.buy-stat-pill {

  display: inline-flex;

  align-items: center;

  gap: 5px;

  padding: 4px 10px;

  border-radius: 8px;

  font-size: 12px;

  font-weight: 600;

  line-height: 1;

  background: var(--panel);

  border: 1px solid var(--line);

  color: var(--text);

  font-variant-numeric: tabular-nums;

}



.buy-stat-pill.ok {

  color: #5DDBA5;

  border-color: rgba(93, 219, 165, 0.3);

  background: rgba(93, 219, 165, 0.08);

}



.buy-stat-pill.bad {

  color: #FF7B8A;

  border-color: rgba(255, 123, 138, 0.3);

  background: rgba(255, 123, 138, 0.08);

}



.buy-stat-pill.skip {

  color: #e6c15a;

  border-color: rgba(230, 193, 90, 0.3);

  background: rgba(230, 193, 90, 0.08);

}



.buy-stat-pill.wait {

  color: var(--muted);

  border-color: var(--line);

  background: var(--panel);

}



/* Resell Dashboard & Modal (Option 1) */

.buy-modal.resell-mode {

  width: min(540px, calc(100vw - 32px));

}



.resell-dashboard {

  display: flex;

  flex-direction: column;

  gap: 12px;

  margin: 0 0 14px;

}



.resell-progress-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;

  font-size: 13px;

  line-height: 1.3;

}



.resell-status-title {

  font-weight: 600;

  color: var(--text);

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.resell-progress-count {

  display: inline-flex;

  align-items: center;

  gap: 6px;

  font-variant-numeric: tabular-nums;

  color: var(--muted);

  font-size: 12px;

  flex-shrink: 0;

}



.resell-progress-count strong {

  color: var(--ink);

  font-weight: 700;

}



.resell-percent-badge {

  display: inline-block;

  padding: 2px 7px;

  border-radius: 999px;

  font-size: 11px;

  font-weight: 700;

  background: rgba(255, 255, 255, 0.08);

  color: var(--ink);

  border: 1px solid var(--line);

}



.resell-progress-track {

  width: 100%;

  height: 6px;

  background: rgba(255, 255, 255, 0.08);

  border-radius: 999px;

  overflow: hidden;

}



.resell-progress-fill {

  height: 100%;

  width: 0%;

  background: linear-gradient(90deg, var(--accent-2), #5DDBA5);

  border-radius: 999px;

  transition: width 0.25s cubic-bezier(0.16, 1, 0.3, 1);

}



.resell-kpi-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 10px;

}



.resell-kpi-card {

  display: flex;

  flex-direction: column;

  gap: 6px;

  padding: 10px 12px;

  border-radius: 12px;

  background: var(--panel);

  border: 1px solid var(--line);

  transition: border-color 0.15s ease, background-color 0.15s ease;

}



.resell-kpi-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 6px;

}



.resell-kpi-label {

  font-size: 11px;

  font-weight: 600;

  color: var(--muted);

  text-transform: uppercase;

  letter-spacing: 0.03em;

}



.resell-kpi-ico {

  width: 14px;

  height: 14px;

  opacity: 0.85;

  flex-shrink: 0;

}



.resell-kpi-val {

  font-size: 20px;

  font-weight: 800;

  line-height: 1.1;

  font-variant-numeric: tabular-nums;

  color: var(--ink);

}



.resell-kpi-card.is-ok {

  background: rgba(93, 219, 165, 0.06);

  border-color: rgba(93, 219, 165, 0.28);

}

.resell-kpi-card.is-ok .resell-kpi-label,

.resell-kpi-card.is-ok .resell-kpi-ico,

.resell-kpi-card.is-ok .resell-kpi-val {

  color: #5DDBA5;

}



.resell-kpi-card.is-bad {

  background: rgba(255, 123, 138, 0.06);

  border-color: rgba(255, 123, 138, 0.28);

}

.resell-kpi-card.is-bad .resell-kpi-label,

.resell-kpi-card.is-bad .resell-kpi-ico,

.resell-kpi-card.is-bad .resell-kpi-val {

  color: #FF7B8A;

}



.resell-kpi-card.is-wait {

  background: rgba(255, 255, 255, 0.03);

  border-color: var(--line-strong);

}

.resell-kpi-card.is-wait .resell-kpi-label,

.resell-kpi-card.is-wait .resell-kpi-ico {

  color: var(--muted);

}

.resell-kpi-card.is-wait .resell-kpi-val {

  color: var(--ink);

}



.resell-kpi-card.is-stopped {

  background: rgba(209, 84, 77, 0.08);

  border-color: rgba(209, 84, 77, 0.3);

}

.resell-kpi-card.is-stopped .resell-kpi-label,

.resell-kpi-card.is-stopped .resell-kpi-ico,

.resell-kpi-card.is-stopped .resell-kpi-val {

  color: #ff9d99;

}



.resell-kpi-card.is-skip {

  background: rgba(230, 193, 90, 0.08);

  border-color: rgba(230, 193, 90, 0.3);

}

.resell-kpi-card.is-skip .resell-kpi-label,

.resell-kpi-card.is-skip .resell-kpi-ico,

.resell-kpi-card.is-skip .resell-kpi-val {

  color: #e6c15a;

}



.resell-skip-note {

  display: flex;

  align-items: center;

  gap: 8px;

  padding: 8px 12px;

  border-radius: 9px;

  background: rgba(230, 193, 90, 0.08);

  border: 1px solid rgba(230, 193, 90, 0.25);

  font-size: 12px;

  color: #e6c15a;

}



@media (max-width: 480px) {

  .buy-modal.resell-mode {

    width: calc(100vw - 20px);

    padding: 16px 12px;

  }

  .resell-kpi-grid {

    gap: 6px;

  }

  .resell-kpi-card {

    padding: 8px 8px;

  }

  .resell-kpi-val {

    font-size: 17px;

  }

  .resell-kpi-label {

    font-size: 10px;

  }

}



.modal-actions .btn.stop-check,

.modal-actions .btn.danger {

  background: rgba(225, 92, 86, 0.15);

  border: 1px solid rgba(225, 92, 86, 0.45);

  color: #ff9d99;

  font-weight: 600;

  padding: 0 16px;

  height: 38px;

  display: inline-flex;

  align-items: center;

  gap: 6px;

}



.modal-actions .btn.stop-check:hover,

.modal-actions .btn.danger:hover {

  background: #d24b45;

  border-color: #d24b45;

  color: #fff;

}



.check-live a.state-link {

  display: inline-block;

  text-decoration: none;

  cursor: pointer;

  color: inherit;

}



.check-live a.state-link:hover {

  filter: brightness(0.96);

  text-decoration: underline;

}



.check-live .wait {

  color: var(--muted);

  background: var(--hover);

}



.check-live .ok {

  color: #0d3b2a;

  background: #5DDBA5;

}



.check-live .bad {

  color: #4a1018;

  background: #FF7B8A;

}



.check-live .block {

  color: #4a2a08;

  background: #e8923a;

}



.check-live .dup {

  color: #3d2f08;

  background: #e6c15a;

}



.check-live .proxy {

  color: #2a261c;

  background: #c4b8a0;

}



.check-live .stopped {

  color: #fff;

  background: #d24b45;

  border: 1px solid #ff8d8d;

}



.sell-result {

  display: flex;

  align-items: flex-start;

  gap: 10px;

  margin: 0;

  color: var(--muted);

  font-size: 13px;

}



#check-note-text a {

  color: var(--accent-2);

  font-weight: 700;

  text-decoration: underline;

  text-underline-offset: 2px;

}



.sell-result svg {

  width: 18px;

  height: 18px;

  flex: none;

  margin-top: 1px;

  color: var(--accent-2);

}



@media (max-width: 860px) {

  .choice.origin-set .choice-set { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .sell-hero { grid-template-columns: 1fr; }

  .sell-art { display: none; }

  .users-hero { grid-template-columns: 1fr; }

  .users-art { display: none; }

}



@media (max-width: 560px) {

  .choice.origin-set .choice-set { grid-template-columns: 1fr 1fr; }

  .filter-foot { flex-direction: column; align-items: stretch; }

  .filter-search { width: 100%; }

}





#check-publish {

  background: #b8b2a4;

  border-color: #b8b2a4;

  color: #16181b;

  font-weight: 600;

}



#check-publish:hover {

  background: #c7c1b3;

  border-color: #c7c1b3;

  color: #111;

}



#check-publish .btn-icon {

  stroke: currentColor;

}



label.file-pick .btn-icon {

  width: 16px;

  height: 16px;

  flex: none;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.8;

  stroke-linecap: round;

  stroke-linejoin: round;

}



label.file-pick {

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  overflow: hidden;

}



input.file-native {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  margin: 0;

  padding: 0;

  opacity: 0;

  cursor: pointer;

}



.split {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 18px;

  align-items: stretch;

  margin: 0 0 14px;

}



.split > .block,

.split > form.block {

  display: flex;

  flex-direction: column;

  margin-bottom: 0;

  min-height: 100%;

}



.split .form-grid {

  display: flex;

  flex-direction: column;

  flex: 1;

  margin: 0;

  gap: 12px;

}



.split .form-grid > .btn,

.split .proxy-box .proxy-list {

  margin-top: auto;

}



.split .proxy-box > .hint { margin: 0; }



.prose { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 68ch; }



.secret-panel {

  display: grid;

  gap: 12px;

  margin: 0 0 8px;

}



.secret-format {

  margin: 0;

  max-width: 420px;

}



.secret-format[hidden] {

  display: none !important;

}



.secret-inner {

  margin-top: 8px;

}



.secret-format .choice-set {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 0;

  height: 38px;

  background: rgba(16, 18, 20, 0.88);

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  overflow: hidden;

}



.secret-format.secret-inner .choice-set {

  grid-template-columns: repeat(2, minmax(0, 1fr));

}



.secret-format .choice-set label {

  display: flex;

  min-width: 0;

}



.secret-format .choice-set label + label {

  box-shadow: inset 1px 0 0 var(--line);

}



.secret-format .choice-set span {

  flex: 1;

  justify-content: center;

  width: 100%;

  height: 100%;

  min-height: 0;

  padding: 0 10px;

  border: 0;

  border-radius: 0;

  background: transparent;

  color: var(--text);

  font-size: 13px;

  font-weight: 500;

  line-height: 1;

}



.secret-format .choice-set label:hover span {

  background: var(--hover);

}



.secret-format .choice-set input:checked + span,

.secret-format .choice-set label:hover input:checked + span {

  background: #b8b2a4;

  color: #16181b;

}



.secret {

  max-width: 100%;

  max-height: 240px;

  overflow: auto;

  font-family: var(--mono);

  font-size: 13px;

  line-height: 1.4;

  white-space: pre;

  tab-size: 4;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: 8px;

  padding: 14px;

  margin: 0;

}



@media (max-width: 560px) {

  .secret-format { max-width: 100%; }

}



.order-follow {

  display: grid;

  justify-items: center;

  gap: 10px;

  margin: 0 0 8px;

  text-align: center;

}



.order-follow .hint {

  margin: 0;

  max-width: 52ch;

}



.resell-form {

  display: flex;

  flex-wrap: wrap;

  align-items: end;

  justify-content: center;

  gap: 10px;

  margin: 6px 0 0;

}



.resell-form label {

  width: min(220px, 100%);

  text-align: left;

}



.resell-form .btn { width: auto; }



.order-actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  gap: 8px;

  margin: 0;

}



.order-follow .order-actions { margin: 0; }



.order-actions form { margin: 0; display: flex; }



.order-actions .btn,

.order-actions a.btn {

  width: auto;

  min-width: 0;

  flex: 0 0 auto;

  height: 38px;

  margin: 0;

  padding: 0 14px;

  white-space: nowrap;

  text-decoration: none;

  box-sizing: border-box;

  line-height: 1;

  border: 1px solid var(--avatar-ring);

  border-radius: 10px;

  box-shadow: none;

}



.order-actions .btn.ghost {

  border-color: var(--avatar-ring);

}



.center-block .chips,

.center-block .order-actions { justify-content: center; }



.center-block .order-actions {

  margin: 10px 0 14px;

}



.lot-actions {

  display: grid;

  gap: 10px;

  justify-items: center;

  margin: 12px 0 8px;

}



.lot-action-row {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  gap: 8px;

  width: 100%;

}



.lot-action-row .btn,

.lot-action-row a.btn {

  width: auto;

  min-width: 0;

  height: 38px;

  margin: 0;

  border-radius: 10px;

}



.lot-web-login {

  display: inline-flex;

  flex-direction: column;

  align-items: center;

  gap: 4px;

  max-width: 100%;

}



.lot-web-login .hint {

  margin: 0;

  text-align: center;

}



.lot-downloads .btn .btn-icon {

  width: 15px;

  height: 15px;

}



.lot-export {

  display: grid;

  justify-items: center;

  gap: 10px;

  width: min(100%, 520px);

}



.lot-formats {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 8px;

  width: 100%;

}



.modal .lot-format,

.lot-format {

  position: relative;

  display: block;

  margin: 0;

  min-width: 0;

  font-size: 0;

  line-height: 0;

}



.lot-format input {

  position: absolute;

  inset: 0;

  z-index: 1;

  width: 100%;

  height: 100%;

  margin: 0;

  opacity: 0;

  cursor: pointer;

}



.lot-format span {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 6px;

  box-sizing: border-box;

  width: 100%;

  height: 40px;

  padding: 0 8px;

  border: 1px solid var(--line);

  border-radius: 999px;

  background: transparent;

  color: var(--muted);

  font-size: 13px;

  line-height: 1;

  white-space: nowrap;

  user-select: none;

}



.lot-format svg {

  width: 14px;

  height: 14px;

  flex: none;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.8;

  stroke-linecap: round;

  stroke-linejoin: round;

}



.lot-format:hover span,

.lot-format input:focus-visible + span {

  border-color: var(--line-strong);

  color: var(--ink);

}



.lot-format input:checked + span {

  border-color: var(--line-strong);

  background: rgba(255, 255, 255, 0.08);

  color: var(--ink);

}



.lot-format input:focus-visible + span {

  outline: 2px solid var(--line-strong);

  outline-offset: 2px;

}



.lot-export-actions {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 8px;

  width: 100%;

}



.lot-export-actions .btn {

  width: 100%;

  height: 40px;

  margin: 0;

  justify-content: center;

}



.lot-export-actions [data-lot-copy] {

  position: relative;

  isolation: isolate;

  overflow: hidden;

}



.lot-export-actions [data-lot-copy]::after {

  content: "";

  position: absolute;

  inset: 0;

  z-index: -1;

  border-radius: inherit;

  background: #b7dcc4;

  opacity: 0;

  transform: scale(0.86);

  pointer-events: none;

}



.lot-export-actions [data-lot-copy].is-copied,

.lot-export-actions [data-lot-copy].is-copied:hover {

  background: transparent;

  animation: lot-copy-ink 1150ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;

}



.lot-export-actions [data-lot-copy].is-copied::after {

  animation: lot-copy-wash 1150ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;

}



@keyframes lot-copy-wash {

  0% { opacity: 0; transform: scale(0.82); }

  18% { opacity: 1; transform: scale(1); }

  46% { opacity: 1; transform: scale(1); }

  100% { opacity: 0; transform: scale(1); }

}



@keyframes lot-copy-ink {

  0% { color: var(--text); border-color: var(--avatar-ring); }

  18% { color: #142019; border-color: #b7dcc4; }

  46% { color: #142019; border-color: #b7dcc4; }

  100% { color: var(--text); border-color: var(--avatar-ring); }

}



@media (prefers-reduced-motion: reduce) {

  .lot-export-actions [data-lot-copy].is-copied,

  .lot-export-actions [data-lot-copy].is-copied:hover,

  .lot-export-actions [data-lot-copy].is-copied::after {

    animation: none;

  }



  .lot-export-actions [data-lot-copy].is-copied {

    color: #142019;

    border-color: #b7dcc4;

    background: #b7dcc4;

  }

}



.lot-actions .order-actions {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 8px;

  width: min(100%, 520px);

  margin: 0;

}



.lot-actions .order-actions form,

.lot-actions .order-actions .btn {

  width: 100%;

  min-width: 0;

}



.lot-actions .order-actions .btn {

  height: 40px;

}



.lot-secondary {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: flex-start;

  gap: 8px;

  width: min(100%, 520px);

}



.lot-secondary > .btn,

.lot-secondary > a.btn {

  flex: 1 1 0;

  min-width: 0;

  max-width: 168px;

  width: auto;

  height: 40px;

  margin: 0;

  padding-inline: 8px;

  gap: 6px;

  font-size: 13px;

  justify-content: center;

  white-space: nowrap;

}



.lot-secondary > .hint {

  flex: 1 1 100%;

  margin: 0;

  text-align: center;

}



.center-block .order-follow {

  margin-top: 8px;

}



.center-block > form[method="post"] {

  margin: 0;

  display: grid;

  justify-items: center;

}



.lot-purchase {

  display: inline-grid;

  justify-items: stretch;

  margin: 2px auto 0;

}



.lot-purchase > .order-actions {

  width: max-content;

  max-width: 100%;

  margin: 8px 0 0;

  justify-self: center;

}



.lot-rule {

  height: 0;

  margin: 14px 0 12px;

  border: 0;

  border-top: 1px solid var(--line);

}



.lot-purchase > form {

  display: flex;

  justify-content: center;

  width: 100%;

  margin: 0;

}



.lot-purchase .btn.buy {

  width: auto;

  min-width: 0;

  height: 38px;

  padding: 0 16px;

  white-space: nowrap;

  box-sizing: border-box;

}



.ledger { list-style: none; padding: 0; margin: 0; }



.ledger li {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto auto;

  column-gap: 16px;

  align-items: baseline;

  padding: 10px 0;

  border-top: 1px solid var(--line);

}



.ledger li:first-child { border-top: 0; padding-top: 0; }



.ledger .sum,

.ledger time {

  white-space: nowrap;

  font-variant-numeric: tabular-nums;

}



.ledger time { color: var(--muted); }



@media (max-width: 480px) {

  .ledger li {

    grid-template-columns: 1fr auto;

    row-gap: 4px;

  }

  .ledger time {

    grid-column: 1 / -1;

    font-size: 11px;

  }

}



.stack { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }



.stack li, .stack article {

  display: flex;

  justify-content: space-between;

  gap: 12px;

  flex-wrap: wrap;

  border-top: 1px solid var(--line);

  padding-top: 10px;

}



.subnav { margin-bottom: 16px; justify-content: center; }



.stats {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

  gap: 12px;

  margin: 8px 0 18px;

}



.stats > div {

  border: 1px solid var(--line);

  background: var(--panel);

  border-radius: 12px;

  padding: 14px;

}



.card {

  display: grid;

  gap: 6px;

  padding: 14px;

  color: inherit;

}



.stats span, .card .meta { display: block; color: var(--muted); font-size: 12px; }



.stats strong { display: block; font-size: 22px; margin-top: 2px; white-space: nowrap; font-variant-numeric: tabular-nums; }



.stats.seller-stats {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  flex: none;

  gap: 0;

  margin: 0;

  padding-left: 22px;

  border-left: 1px solid var(--line);

}



.stats.seller-stats > div {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  flex: none;

  width: 120px;

  min-width: 120px;

  box-sizing: border-box;

  margin: 0;

  padding: 0;

  border: 0;

  border-radius: 0;

  background: transparent;

  text-align: center;

}



.stats.seller-stats > div + div {

  position: relative;

  border: 0;

}



.stats.seller-stats > div + div::before {

  content: "";

  position: absolute;

  left: 0;

  top: 2px;

  bottom: 2px;

  width: 1px;

  background: var(--line-strong);

  border-radius: 0;

}



.seller-head .stats strong {

  font-variant-numeric: tabular-nums;

  line-height: 1.1;

}



.seller-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 24px;

  margin: 0 0 18px;

  padding: 16px 22px;

  border: 1px solid var(--line);

  border-radius: 14px;

  background: var(--panel);

  text-align: left;

}



.seller-head .seller-id {

  min-width: 0;

}



.seller-seal {

  flex: 1 1 auto;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  min-width: 0;

  padding: 0 8px;

  pointer-events: none;

}



.seller-seal::before,

.seller-seal::after {

  content: "";

  flex: 1 1 32px;

  height: 1px;

  background: rgba(201, 196, 182, 0.32);

}



.seller-seal-ring {

  position: relative;

  display: grid;

  place-items: center;

  flex: none;

  width: 72px;

  height: 72px;

  border: 1px solid rgba(201, 196, 182, 0.55);

  border-radius: 50%;

  color: #d8d3c6;

}



.seller-seal .vk-mark {

  width: 40px;

  height: 24px;

  color: #d8d3c6;

}



.seller-seal-ring::after {

  content: "";

  position: absolute;

  inset: 6px;

  border: 1px solid rgba(201, 196, 182, 0.28);

  border-radius: 50%;

}



.seller-head h1 {

  margin: 0;

}



.seller-head .meta {

  margin: 4px 0 0;

}



.seller-head .order-actions {

  display: flex;

  justify-content: flex-start;

  width: auto;

  margin: 10px 0 0;

}



.seller-head .order-actions .btn {

  width: auto;

}



@media (max-width: 720px) {

  .seller-head {

    flex-direction: column;

    align-items: center;

    text-align: center;

    padding: 16px;

  }



  .seller-head .order-actions {

    justify-content: center;

  }



  .seller-seal {

    display: none;

  }



  .stats.seller-stats {

    justify-content: center;

    width: 100%;

    padding: 12px 0 0;

    border-left: 0;

    border-top: 1px solid var(--line);

  }

}



.lots { width: 100%; border-collapse: collapse; table-layout: fixed; }



.lots th { font-weight: 500; color: var(--muted); font-size: 12px; }



.lots td, .lots th {

  padding: 12px 10px;

  border-bottom: 1px solid var(--line);

  vertical-align: middle;

  text-align: left;

  overflow-wrap: anywhere;

}



.lots tr:last-child td { border-bottom: 0; }



.lots th.num, .lots td.num { text-align: left; font-variant-numeric: tabular-nums; }



.lots th.lot-actions,

.lots td.lot-actions,

.admin-table td.lot-actions {

  display: table-cell;

  margin: 0;

  gap: unset;

  justify-items: unset;

  text-align: right;

  width: 110px;

  overflow-wrap: normal;

  white-space: nowrap;

  vertical-align: middle;

}



.lots td.lot-actions .btn,

.admin-table td.lot-actions .btn {

  display: inline-flex;

  width: auto;

  margin: 0;

}



.lot-buttons {

  display: inline-flex;

  justify-content: flex-end;

  align-items: center;

  gap: 8px;

}



.lot-buttons form { margin: 0; }



.lot-buttons .btn { white-space: nowrap; }



.num { text-align: right; font-variant-numeric: tabular-nums; }



.pager { display: flex; gap: 12px; align-items: center; justify-content: center; margin-top: 14px; color: var(--muted); }



.spaced { margin-top: 14px; }



.section-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }



.section-head h1 { margin: 0; }



.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }



.chips a {

  border: 1px solid var(--line);

  border-radius: 999px;

  padding: 4px 10px;

  color: var(--muted);

  text-decoration: none;

  white-space: nowrap;

}



.chips a[aria-current="page"] {

  color: #16181b;

  background: #b8b2a4;

  border-color: #b8b2a4;

}



.chips.account-tabs a {

  border-radius: 8px;

}



.account-tabs a[aria-current="page"] {

  background: #b8b2a4;

  border-color: #b8b2a4;

  color: #16181b;

}



.faq { display: grid; gap: 8px; max-width: 680px; }



.guide {

  max-width: 680px;

}



.guide-note {

  margin: 0 0 16px;

  padding: 12px 14px;

  border: 1px solid var(--line);

  border-radius: 10px;

  background: var(--fill-mid);

  color: var(--ink);

  text-align: left;

}



.guide-steps {

  margin: 4px 0 18px;

  padding-left: 1.4rem;

}



.guide-steps li {

  margin: 0 0 10px;

  padding-left: 0.35rem;

}



.guide-steps li::marker {

  color: var(--muted);

  font-weight: 600;

}



.guide code {

  overflow-wrap: anywhere;

}



.guide-pick {

  margin: 0 0 16px;

}



.guide-pick-label {

  margin: 0 0 8px;

  color: var(--ink);

}



.guide-pick.choice.pair-set .choice-set {

  max-width: 320px;

}



.guide-firefox {

  display: none;

}



.guide:has(#guide-browser-firefox:checked) .guide-chrome {

  display: none;

}



.guide:has(#guide-browser-firefox:checked) .guide-firefox {

  display: block;

}



.faq details { border-top: 1px solid var(--line); padding: 8px 0; }



.faq summary { cursor: pointer; }



.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }



::selection { background: #a7a498; color: var(--ink); }



.fin-top {

  display: grid;

  justify-items: start;

  gap: 12px;

  padding-bottom: 16px;

  border-bottom: 1px solid var(--line);

}



.fin-top h1 { margin: 0; }



.fin-tools {

  display: grid;

  grid-template-columns: max-content;

  justify-items: stretch;

  gap: 12px;

}



.fin-balance {

  display: flex;

  align-items: baseline;

  justify-content: flex-start;

  gap: 8px;

  margin: 0;

  color: var(--muted);

  font-size: 13px;

  white-space: nowrap;

}



.fin-sep { color: var(--faint); }



.fin-balance strong {

  color: var(--ink);

  font-size: 13px;

  font-weight: 600;

}



.fin-actions { display: flex; gap: 8px; }



.panel {

  margin-top: 14px;

  padding: 14px;

  border: 1px solid var(--line);

  border-radius: 12px;

  background: var(--panel);

}



.panel[hidden] { display: none; }



.ops-filters {

  display: grid;

  grid-template-columns: 1.1fr 1.1fr 1.4fr 1fr;

  gap: 10px;

  margin-top: 18px;

}



.ops-bar {

  display: flex;

  justify-content: space-between;

  align-items: baseline;

  gap: 12px;

  margin: 16px 0 8px;

}



.ops-bar strong { font-size: 16px; }



.totals { display: flex; gap: 14px; font-variant-numeric: tabular-nums; }



.plus { color: #3dcc7a; }



.minus { color: #ef5d5d; }



.hold { color: #e6b84d; }



.op {

  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 16px;

  padding: 12px 2px;

  border-top: 1px solid var(--line);

}



.op > span:first-child {

  display: grid;

  gap: 4px;

  min-width: 0;

}



.op strong { font-weight: 600; }



.op .sum { font-variant-numeric: tabular-nums; white-space: nowrap; }



.op-check {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: fit-content;

  margin-top: 2px;

  padding: 8px 14px;

  border-radius: 8px;

  background: var(--accent);

  color: var(--ink);

  font-size: 13px;

  font-weight: 600;

  text-decoration: none;

}



.op-check:hover {

  background: var(--accent-2);

  color: var(--ink);

}



@media (max-width: 860px) {

  .filter-grid, .split, .stats, .ops-filters { grid-template-columns: 1fr 1fr; }

  .adjust-form { grid-template-columns: 1fr 1fr; }

  .adjust-form .btn { grid-column: 1 / -1; justify-self: start; }

  .who { display: none; }

}



@media (max-width: 640px) {

  .filter-grid, .split, .stats, .ops-filters, .tool-form, .tool-form.slim, .adjust-form { grid-template-columns: 1fr; }

  .tool-form .btn, .adjust-form .btn { width: 100%; }

  .order-actions {

    display: grid;

    grid-template-columns: 1fr;

    gap: 8px;

  }

  .order-actions .btn,

  .order-actions a.btn { width: 100%; }

  .lot-purchase > .order-actions {

    display: flex;

    flex-wrap: nowrap;

    width: max-content;

  }

  .lot-purchase > .order-actions .btn { width: auto; }

  .ops-bar {

    flex-direction: column;

    align-items: stretch;

    text-align: left;

  }

  .fin-top { justify-items: stretch; text-align: left; }

  .fin-tools { justify-self: stretch; width: 100%; }

  .fin-actions { width: 100%; }

  .fin-actions .btn { flex: 1; min-width: 0; }

  .row { align-items: stretch; }

  .listing-row {

    flex-direction: column;

    align-items: stretch;

    gap: 12px;

    padding: 16px 18px;

  }

  .account-side {

    width: 100%;

    flex-direction: row;

    align-items: center;

    justify-content: space-between;

    gap: 10px;

  }

  .listing-row .account-side .btn,

  .listing-row .more > summary {

    opacity: 1;

    pointer-events: auto;

  }

  .listing-row .account-side form {

    pointer-events: auto;

  }

  .listing-row .account-side .btn.buy {

    height: auto;

    min-height: 44px;

    padding: 10px 16px;

  }

  .lots { table-layout: auto; }

  .lots thead { display: none; }

  .lots td.lot-actions,

  .admin-table td.lot-actions {

    display: flex;

    width: auto;

    text-align: left;

    white-space: normal;

    justify-content: flex-end;

  }

  .lots td.lot-actions .lot-buttons { margin-left: auto; }

  .lots tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--line); }

  .lots td { display: flex; justify-content: space-between; gap: 12px; border: 0; padding: 3px 0; }

  .lots td::before { content: attr(data-label); color: var(--muted); }

  .lots td[data-label=""]::before { content: none; }

}



.api-layout {

  --api-top: 72px;

  --api-nav-offset: 0px;

  display: grid;

  grid-template-columns: 200px minmax(0, 1fr);

  gap: 28px;

  align-items: start;

  min-width: 0;

}



main.wrap:has(.api-layout) {

  width: min(1080px, 100%);

}



.api-main {

  min-width: 0;

}



.api-layout section[id] {

  scroll-margin-top: calc(var(--api-top) + var(--api-nav-offset));

}



.api-main > .api-card + .api-group,

.api-main > .api-group + .api-group {

  margin-top: 10px;

  padding-top: 26px;

  border-top: 1px solid var(--hover-strong);

}



.api-layout section[id] > h2 { margin-top: 0; }



.api-side {

  position: sticky;

  top: var(--api-top);

  z-index: 12;

  display: grid;

  gap: 2px;

  align-self: start;

  max-height: calc(100vh - var(--api-top) - 16px);

  overflow: auto;

  padding: 8px;

  border: 1px solid var(--line);

  border-radius: 12px;

  background: var(--raise);

  -webkit-overflow-scrolling: touch;

}



.api-side a {

  color: var(--muted);

  text-decoration: none;

  padding: 7px 8px;

  border-radius: 8px;

}



.api-side a:hover {

  color: var(--ink);

  background: var(--line-faint);

}



.api-card {

  border: 1px solid var(--line);

  border-radius: 12px;

  padding: 16px 18px;

  margin: 0 0 14px;

  background: var(--raise);

  min-width: 0;

  overflow-wrap: break-word;

}



.api-card > h2 {

  margin: 0 0 10px;

}



.api-notes {

  list-style: none;

  margin: 0 0 12px;

  padding: 0;

  display: grid;

  gap: 8px;

}



.api-pairs {

  display: flex;

  flex-wrap: wrap;

  gap: 4px 10px;

  margin: 0 0 12px;

}



.api-pairs > span {

  white-space: nowrap;

}



.api-card > p:last-child,

.api-card > .form-grid:last-child,

.api-card > .api-fields:last-child {

  margin-bottom: 0;

}



.api-fields {

  width: 100%;

  border-collapse: collapse;

  margin: 0 0 14px;

  font-size: 14px;

}



.api-fields th,

.api-fields td {

  padding: 8px 0;

  border-bottom: 1px solid var(--line);

  vertical-align: top;

  text-align: left;

}



.api-fields th {

  width: 168px;

  padding-right: 16px;

  color: var(--text);

  font-weight: 600;

}



.api-fields tr:last-child th,

.api-fields tr:last-child td {

  border-bottom: 0;

}



.api-call {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  align-items: center;

}



.verb {

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.04em;

  flex: 0 0 auto;

}



.verb.get { color: var(--ok); }

.verb.post { color: #b8b4a8; }

.verb.delete { color: var(--danger); }



.api-path, .api-sample, .api-secret {

  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;

}



.api-path {

  overflow-wrap: anywhere;

  word-break: break-word;

}



.api-sample, .api-secret {

  display: block;

  margin: 12px 0;

  padding: 10px 12px;

  border-radius: 8px;

  background: var(--bg);

  white-space: pre-wrap;

  overflow-wrap: anywhere;

  word-break: break-word;

}



p:has(+ .api-sample),

p:has(+ .api-secret) {

  margin-bottom: 0;

}



.api-secret { user-select: all; }



.api-tokens { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 8px; }

.api-tokens li {

  display: flex;

  justify-content: space-between;

  gap: 12px;

  align-items: center;

  flex-wrap: wrap;

}



.api-tokens li > span {

  min-width: 0;

  overflow-wrap: anywhere;

}



@media (max-width: 960px) {

  .api-layout {

    grid-template-columns: 1fr;

    gap: 16px;

  }



  .api-side {

    position: static;

    top: auto;

    z-index: auto;

    display: flex;

    flex-direction: row;

    flex-wrap: nowrap;

    gap: 4px;

    max-height: none;

    overflow-x: auto;

    overflow-y: hidden;

    overscroll-behavior-x: contain;

    scrollbar-width: thin;

  }



  .api-side a {

    flex: 0 0 auto;

    white-space: nowrap;

  }



  .api-layout section[id] {

    scroll-margin-top: var(--api-top);

  }

}



@media (max-width: 640px) {

  .api-card { padding: 14px; }

  .api-tokens li { align-items: stretch; }

  .api-tokens form { width: 100%; }

  .api-tokens .btn { width: 100%; }

}



/* —— Админка —— */

.admin-body main.wrap {

  width: min(1280px, 100%);

}



.admin-topbar {

  margin: 0 0 20px;

}



.admin-main-nav {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 8px;

  padding: 6px;

  background: var(--raise-solid);

  border: 1px solid var(--line-strong);

  border-radius: var(--radius);

  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);

}



.admin-tab {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 8px 16px;

  border-radius: 9px;

  color: var(--muted);

  font-weight: 500;

  font-size: 13.5px;

  transition: all 160ms ease;

  text-decoration: none;

}



.admin-tab:hover {

  color: var(--text);

  background: var(--hover);

}



.admin-tab.is-active {

  background: rgba(255, 255, 255, 0.1);

  color: #fff;

  font-weight: 600;

  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);

}



.admin-tab-icon {

  width: 17px;

  height: 17px;

  flex: none;

}



.admin-sub-nav {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 6px;

  margin-top: 10px;

  padding: 0 4px;

}



.admin-sub-nav a {

  display: inline-flex;

  align-items: center;

  padding: 6px 14px;

  border-radius: 8px;

  border: 1px solid var(--line);

  background: var(--fill-mid);

  color: var(--muted);

  font-size: 13px;

  font-weight: 500;

  text-decoration: none;

  transition: all 140ms ease;

}



.admin-sub-nav a:hover {

  color: var(--text);

  border-color: var(--line-strong);

  background: var(--hover);

}



.admin-sub-nav a[aria-current="page"] {

  background: #b8b2a4;

  border-color: #b8b2a4;

  color: #16181b;

  font-weight: 600;

}



/* Карточки KPI и дашборда */

.dash-head {

  align-items: center;

}



.dash-grid {

  display: grid;

  gap: 14px;

  margin-bottom: 20px;

}



.kpi-grid {

  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));

}



.sub-grid {

  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));

}



.tables-grid {

  grid-template-columns: repeat(auto-fit, minmax(460px, 1fr));

}



.dash-card {

  padding: 18px 20px;

  border: 1px solid var(--line);

  border-radius: var(--radius);

  background: var(--raise-solid);

  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);

  transition: border-color 160ms ease;

}



.dash-card:hover {

  border-color: var(--line-strong);

}



.kpi-card {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  min-height: 124px;

}



.kpi-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  margin-bottom: 8px;

}



.kpi-label {

  font-size: 13px;

  color: var(--muted);

  font-weight: 500;

}



.kpi-badge {

  font-size: 11px;

  padding: 2px 7px;

  border-radius: 6px;

  background: var(--fill-mid);

  border: 1px solid var(--line);

  color: var(--muted);

}



.kpi-badge.ok {

  background: rgba(143, 186, 154, 0.15);

  border-color: rgba(143, 186, 154, 0.35);

  color: #a3d2b0;

}



.kpi-badge.info {

  background: rgba(120, 160, 210, 0.15);

  border-color: rgba(120, 160, 210, 0.35);

  color: #a6c8f5;

}



.kpi-badge.warn {

  background: rgba(220, 165, 80, 0.15);

  border-color: rgba(220, 165, 80, 0.35);

  color: #eed08d;

}



.kpi-val {

  font-size: 26px;

  font-weight: 700;

  letter-spacing: -0.02em;

  color: var(--ink);

  margin-bottom: 8px;

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.kpi-foot {

  display: flex;

  align-items: center;

  gap: 12px;

  font-size: 12.5px;

  color: var(--muted);

  flex-wrap: wrap;

}



.kpi-foot strong {

  color: var(--text);

}



/* Операционные карточки */

.op-card-head,

.table-card-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  margin-bottom: 14px;

}



.op-card-head h3,

.table-card-head h3 {

  margin: 0;

  font-size: 15px;

  font-weight: 600;

}



.op-link {

  font-size: 12.5px;

  color: var(--link);

  text-decoration: none;

}



.op-link:hover {

  color: var(--text);

  text-decoration: underline;

}



.op-list {

  display: grid;

  gap: 9px;

}



.op-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  font-size: 13.5px;

  padding-bottom: 7px;

  border-bottom: 1px solid var(--line-faint);

}



.op-row:last-child {

  border-bottom: 0;

  padding-bottom: 0;

}



.op-row span {

  color: var(--muted);

}



.op-row strong {

  font-variant-numeric: tabular-nums;

  color: var(--ink);

}



/* Бейджи и статусы */

.status-pill {

  display: inline-flex;

  align-items: center;

  padding: 3px 9px;

  border-radius: 6px;

  font-size: 12px;

  font-weight: 600;

  line-height: 1.2;

}



.status-pill.ok {

  background: rgba(143, 186, 154, 0.16);

  border: 1px solid rgba(143, 186, 154, 0.38);

  color: #a3d2b0;

}



.status-pill.bad {

  background: rgba(201, 138, 132, 0.16);

  border: 1px solid rgba(201, 138, 132, 0.38);

  color: #e5b2ae;

}



.status-pill.warn {

  background: rgba(220, 165, 80, 0.16);

  border: 1px solid rgba(220, 165, 80, 0.38);

  color: #e5c687;

}



.status-pill.wait,

.status-pill.neutral {

  background: var(--fill-mid);

  border: 1px solid var(--line);

  color: var(--muted);

}



.status-pill.info {

  background: rgba(120, 160, 210, 0.16);

  border: 1px solid rgba(120, 160, 210, 0.38);

  color: #a6c8f5;

}



.health-pill {

  display: inline-flex;

  align-items: center;

  padding: 3px 8px;

  border-radius: 6px;

  font-size: 12px;

  font-weight: 600;

}



.health-pill.ok {

  background: rgba(143, 186, 154, 0.16);

  color: #a3d2b0;

}



.health-pill.bad {

  background: rgba(201, 138, 132, 0.16);

  color: #e5b2ae;

}



.health-pill.neutral {

  background: var(--fill-mid);

  color: var(--muted);

}



.text-ok { color: #a3d2b0 !important; }

.text-danger { color: #e5b2ae !important; }

.text-muted { color: var(--muted) !important; }



/* Таблицы в админке */

.admin-table-container,

.admin-table-wrap {

  overflow-x: auto;

  -webkit-overflow-scrolling: touch;

}



.dash-table {

  width: 100%;

  border-collapse: collapse;

  font-size: 13px;

  text-align: left;

}



.dash-table th {

  padding: 8px 10px;

  border-bottom: 1px solid var(--line-strong);

  color: var(--muted);

  font-size: 12px;

  font-weight: 600;

  white-space: nowrap;

}



.dash-table th.num,

.dash-table td.num {

  text-align: right;

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.dash-table td.cell-action {

  text-align: right;

  white-space: nowrap;

}



.dash-table td {

  padding: 10px;

  border-bottom: 1px solid var(--line-faint);

  vertical-align: middle;

}



.dash-table tr:hover td {

  background: var(--fill-mid);

}



.row-num {

  font-weight: 700;

  color: var(--ink);

  font-variant-numeric: tabular-nums;

}



.cell-title {

  max-width: 220px;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}



.cell-time {

  color: var(--muted);

  font-size: 12px;

  white-space: nowrap;

}



/* Ошибки в логе */

.error-card {

  margin-top: 10px;

}



.error-log-list {

  list-style: none;

  padding: 0;

  margin: 0;

  display: grid;

  gap: 8px;

}



.error-log-item {

  display: flex;

  justify-content: space-between;

  align-items: baseline;

  gap: 14px;

  padding: 8px 12px;

  border-radius: 8px;

  background: var(--fill-soft);

  border: 1px solid var(--line-faint);

  font-size: 13px;

}



.error-msg {

  color: var(--danger);

  word-break: break-all;

}



.error-time {

  color: var(--muted);

  font-size: 11.5px;

  white-space: nowrap;

}



/* Панель поиска и фильтров в заказах */

.admin-toolbar-box {

  display: grid;

  gap: 12px;

  margin-bottom: 18px;

}



.admin-toolbar,

.admin-search-form {

  display: flex;

  align-items: center;

  gap: 10px;

  flex-wrap: wrap;

}



.admin-search-form input {

  flex: 1;

  min-width: 260px;

  height: 40px;

  padding: 0 14px;

  border-radius: 10px;

  border: 1px solid var(--line);

  background: var(--input-bg);

  color: var(--text);

  font-size: 13.5px;

}



.admin-search-wrap {

  position: relative;

  flex: 1;

  min-width: 260px;

}



.admin-search-icon {

  position: absolute;

  left: 12px;

  top: 50%;

  transform: translateY(-50%);

  width: 16px;

  height: 16px;

  color: var(--muted);

  pointer-events: none;

}



.admin-search-wrap input {

  width: 100%;

  height: 40px;

  padding-left: 36px;

  padding-right: 12px;

  border-radius: 10px;

  border: 1px solid var(--line);

  background: var(--input-bg);

  color: var(--text);

  font-size: 13.5px;

}



.admin-filter-chips,

.admin-filter-pills {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

}



.admin-filter-pill,

.filter-pill {

  display: inline-flex;

  align-items: center;

  padding: 6px 14px;

  border-radius: 8px;

  border: 1px solid var(--line);

  background: var(--fill-mid);

  color: var(--muted);

  font-size: 13px;

  text-decoration: none;

  transition: all 140ms ease;

}



.admin-filter-pill:hover,

.filter-pill:hover {

  background: var(--hover);

  color: var(--text);

}



.admin-filter-pill.is-active,

.filter-pill.is-active {

  background: #b8b2a4;

  border-color: #b8b2a4;

  color: #16181b;

  font-weight: 600;

}



.admin-inline-form {

  display: flex;

  align-items: center;

  gap: 10px;

  max-width: 460px;

}



.admin-inline-form input {

  flex: 1;

  height: 38px;

  padding: 0 12px;

  border-radius: 8px;

  border: 1px solid var(--line);

  background: var(--input-bg);

  color: var(--text);

}



.actions-group {

  display: flex;

  align-items: center;

  gap: 6px;

  justify-content: flex-end;

  flex-wrap: wrap;

}



.actions-group form {

  margin: 0;

  display: inline-flex;

}



.ok-btn {

  background: rgba(143, 186, 154, 0.18) !important;

  border-color: rgba(143, 186, 154, 0.45) !important;

  color: #a3d2b0 !important;

}



.ok-btn:hover {

  background: rgba(143, 186, 154, 0.3) !important;

  color: #fff !important;

}



.admin-nav {

  justify-content: flex-start;

  flex-wrap: wrap;

  gap: 8px;

  margin: 0 0 12px;

  padding: 0;

  border-bottom: 0;

}



.admin-nav a {

  display: inline-flex;

  align-items: center;

  min-height: 34px;

  padding: 0 12px;

  border: 1px solid var(--line);

  border-radius: 8px;

  background: var(--fill-mid);

  text-decoration: none;

}



.admin-table .sort-link {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  color: inherit;

  text-decoration: none;

  white-space: nowrap;

}



.admin-table .sort-link:hover,

.admin-table .sort-link.is-active {

  color: var(--ink);

}



.admin-table .sort-dir {

  font-size: 11px;

  line-height: 1;

  color: var(--accent-2);

}



.admin-nav a[aria-current="page"] {

  color: #16181b;

  border-color: #b8b2a4;

  background: #b8b2a4;

}



.admin-sub {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  margin: 0 0 16px;

}



.admin-sub a {

  display: inline-flex;

  align-items: center;

  min-height: 30px;

  padding: 0 10px;

  border-radius: 8px;

  color: var(--muted);

  text-decoration: none;

}



.admin-sub a[aria-current="page"] {

  color: var(--text);

  background: var(--hover);

}



.admin-head {

  display: flex;

  justify-content: space-between;

  align-items: baseline;

  gap: 12px;

  margin: 0 0 14px;

  flex-wrap: wrap;

}



.admin-head h1 {

  margin: 0;

  font-size: 24px;

  letter-spacing: -0.02em;

}



.admin-head .meta { margin: 0; }



.admin-balance {

  margin: 0;

  color: var(--muted);

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.admin-stats {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));

  gap: 10px;

  margin: 0 0 18px;

}



.admin-stats > div {

  padding: 12px 14px;

  border: 1px solid var(--line);

  border-radius: var(--radius);

  background: var(--raise);

}



.admin-stats span {

  display: block;

  color: var(--muted);

  font-size: 12px;

}



.admin-panel {

  overflow: visible;

}



.admin-panel h2 {

  margin: 0 0 14px;

}



#account,

#balance,

#history {

  scroll-margin-top: 12px;

}



.checker-counts {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  margin: 0;

  padding: 0;

  max-height: none;

  overflow: visible;

}



.checker-counts > span {

  display: inline-flex;

  align-items: center;

  font-size: 12px;

  font-weight: 600;

  line-height: 1.25;

  padding: 4px 10px;

  border-radius: 999px;

  border: 1px solid transparent;

  white-space: nowrap;

}



.checker-counts > .wait {

  color: var(--muted);

  background: rgba(255, 255, 255, 0.04);

  border-color: var(--line);

}



.checker-counts > .ok {

  color: #7ddea3;

  background: rgba(93, 219, 165, 0.12);

  border-color: rgba(93, 219, 165, 0.28);

}



.checker-counts > .bad {

  color: #f0a0a0;

  background: rgba(255, 123, 138, 0.12);

  border-color: rgba(255, 123, 138, 0.28);

}



.checker-counts > .dup {

  color: #e6c15a;

  background: rgba(230, 193, 90, 0.12);

  border-color: rgba(230, 193, 90, 0.28);

}



.checker-counts > .proxy {

  color: #c4b8a0;

  background: rgba(196, 184, 160, 0.12);

  border-color: rgba(196, 184, 160, 0.28);

}



.checker-counts > .stopped {

  color: #ff8d8d;

  background: rgba(210, 75, 69, 0.14);

  border-color: rgba(210, 75, 69, 0.35);

}



.checker-counts > .block {

  color: #e8923a;

  background: rgba(232, 146, 58, 0.12);

  border-color: rgba(232, 146, 58, 0.28);

}



.checker-run-card {

  padding: 14px 16px;

  margin-bottom: 14px;

}



.checker-run-meta {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 14px;

}



.checker-run-summary {

  margin: 12px 0 0;

}



.admin-uploads-filters {

  grid-template-columns: minmax(140px, 0.8fr) minmax(200px, 1.4fr) minmax(140px, 0.9fr) auto;

  align-items: end;

  margin: 0 0 14px;

}



.admin-filter-field {

  display: grid;

  gap: 5px;

  min-width: 0;

}



.admin-upload-list {

  display: grid;

  gap: 10px;

}



.admin-upload-card {

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  gap: 12px 16px;

  align-items: start;

  padding: 14px 16px;

  border: 1px solid var(--line);

  border-radius: 14px;

  background: rgba(16, 18, 20, 0.72);

}



.admin-upload-top {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 8px 10px;

  margin-bottom: 6px;

}



.admin-upload-id {

  font-weight: 700;

  color: var(--accent-2);

}



.admin-upload-who,

.admin-upload-meta,

.admin-upload-summary {

  margin: 0 0 6px;

}



.admin-upload-side {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  justify-content: flex-end;

}



.admin-upload-items {

  display: grid;

  gap: 8px;

}



.admin-upload-item {

  padding: 12px 14px;

  border: 1px solid var(--line);

  border-radius: 12px;

  background: rgba(16, 18, 20, 0.72);

}



.admin-upload-item-top {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  margin-bottom: 8px;

}



.admin-upload-item-num {

  font-weight: 700;

  color: var(--muted);

  font-size: 12px;

}



.admin-upload-item .checker-file {

  white-space: normal;

  overflow: visible;

  text-overflow: clip;

  overflow-wrap: anywhere;

  word-break: break-word;

  margin-bottom: 6px;

  color: var(--text);

}



.admin-upload-item .checker-reason {

  margin: 0 0 8px;

  color: var(--muted);

}



.admin-upload-item-foot {

  display: flex;

  flex-wrap: wrap;

  gap: 6px 8px;

  align-items: center;

  margin: 0;

}



.admin-upload-item-top .checker-counts {

  justify-content: flex-end;

}



@media (max-width: 860px) {

  .admin-uploads-filters {

    grid-template-columns: 1fr 1fr;

  }



  .admin-uploads-filters .btn {

    grid-column: 1 / -1;

  }



  .admin-upload-card {

    grid-template-columns: 1fr;

  }



  .admin-upload-side {

    justify-content: stretch;

  }



  .admin-upload-side .btn {

    flex: 1;

  }

}



@media (max-width: 640px) {

  .admin-uploads-filters {

    grid-template-columns: 1fr;

  }

}



.checker-items {

  overflow-x: auto;

}



.checker-table {

  table-layout: fixed;

  width: 100%;

}



.checker-table th,

.checker-table td {

  vertical-align: top;

}



.checker-table .col-num { width: 44px; }

.checker-table .col-name { width: 22%; }

.checker-table .col-status { width: 110px; }

.checker-table .col-vk { width: 96px; }

.checker-table .col-lot { width: 72px; }

.checker-table .col-reason { width: auto; }



.checker-file {

  display: block;

  max-width: 100%;

  margin: 0;

  padding: 0;

  border: 0;

  background: transparent;

  color: var(--muted);

  font: inherit;

  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;

  font-size: 12px;

  line-height: 1.35;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}



.checker-reason {

  white-space: pre-wrap;

  overflow-wrap: anywhere;

  word-break: break-word;

  line-height: 1.4;

  font-size: 13px;

}



.checker-table .check-live > span {

  white-space: nowrap;

}



@media (max-width: 860px) {

  .checker-run-meta {

    grid-template-columns: 1fr;

  }



  .checker-table {

    table-layout: auto;

  }



  .checker-file {

    white-space: normal;

    overflow: visible;

    text-overflow: clip;

    overflow-wrap: anywhere;

    word-break: break-word;

  }

}



.admin-panel > .admin-table,

.admin-panel > .lots {

  margin: 0;

  width: 100%;

}



.backup-actions {

  display: flex;

  gap: 8px;

  align-items: center;

  justify-content: flex-end;

}



.backup-actions form { margin: 0; }



.admin-section-head {

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

  gap: 10px;

  margin-bottom: 10px;

}



.admin-section-head h2 { margin: 0; }



.admin-section-head form {

  margin: 0;

  flex: none;

}



.admin-panel .error-line a {

  color: inherit;

  font-weight: 700;

  text-decoration: underline;

  text-underline-offset: 2px;

}



.admin-check-filters {

  grid-template-columns: minmax(180px, 260px);

  margin: 0 0 14px;

}



.admin-journal-filters {

  grid-template-columns: minmax(110px, 0.7fr) minmax(130px, 0.9fr) minmax(180px, 1.3fr) auto;

  align-items: end;

  margin: 0 0 14px;

}



.journal-detail {

  display: flex;

  flex-wrap: wrap;

  align-items: baseline;

  gap: 0;

  margin-top: 4px;

}



.journal-sep {

  color: var(--muted);

}



@media (max-width: 860px) {

  .admin-journal-filters {

    grid-template-columns: 1fr 1fr;

  }



  .admin-journal-filters .btn {

    grid-column: 1 / -1;

  }

}



@media (max-width: 640px) {

  .admin-journal-filters {

    grid-template-columns: 1fr;

  }

}



.admin-toolbar {

  display: flex;

  align-items: center;

  gap: 10px;

  flex-wrap: wrap;

  margin: 0 0 14px;

}



.admin-toolbar input,

.admin-toolbar select {

  height: 38px;

}



.admin-toolbar.cols-4 {

  display: grid;

  grid-template-columns: minmax(110px, 0.7fr) minmax(140px, 1fr) minmax(150px, 1fr) auto;

  align-items: end;

}



.admin-toolbar.cols-4 input,

.admin-toolbar.cols-4 select {

  width: 100%;

  min-width: 0;

}



.admin-form {

  display: grid;

  gap: 10px;

  margin: 0;

}



.admin-form + .admin-form {

  margin-top: 16px;

  padding-top: 16px;

  border-top: 1px solid var(--line);

}



.admin-form label {

  display: grid;

  gap: 6px;

  min-width: 0;

  font-size: 13px;

  color: var(--muted);

}



.admin-form input,

.admin-form select,

.admin-form textarea {

  width: 100%;

  min-width: 0;

}



.admin-form .btn { justify-self: start; }



.admin-form.cols-2 {

  grid-template-columns: 1fr 1fr;

}



.admin-form.cols-3 {

  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;

  align-items: end;

}



.admin-form.cols-5 {

  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;

  align-items: end;

}



.admin-form.cols-5 .btn,

.admin-form.cols-3 .btn {

  height: 38px;

  align-self: end;

}



.admin-check {

  display: inline-flex !important;

  align-items: center;

  gap: 8px;

  color: var(--text);

  grid-template-columns: none !important;

}



.admin-check input { width: auto; }



.settings-grid {

  grid-template-columns: repeat(2, minmax(0, 1fr));

}



.settings-grid .span-2 { grid-column: 1 / -1; }



.settings-grid .hint.span-2 {

  margin: -4px 0 4px;

  text-align: left;

}



.settings-grid .btn { grid-column: 1 / -1; }



.admin-grid {

  display: grid;

  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);

  gap: 14px;

  align-items: stretch;

  margin-bottom: 14px;

}



.admin-grid > .block {

  margin: 0;

  min-width: 0;

  display: flex;

  flex-direction: column;

}



.admin-grid > .admin-stack {

  align-self: start;

  margin: 0;

}



.admin-grid.history {

  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);

}



.admin-grid.history > .block:last-child:nth-child(odd) {

  grid-column: 1 / -1;

}



.admin-grid .facts.compact {

  max-height: 280px;

  overflow: auto;

  margin-top: 0;

  padding-right: 14px;

  scrollbar-gutter: stable;

}



.facts.compact li > span:first-child {

  min-width: 0;

  overflow-wrap: anywhere;

}



.admin-stack {

  display: grid;

  gap: 14px;

  min-width: 0;

}



.admin-chips { margin-bottom: 14px; }



.admin-lot-list {

  display: grid;

  gap: 10px;

}



.admin-lot-card {

  position: relative;

  display: grid;

  grid-template-columns: minmax(0, 1fr) auto;

  gap: 12px 16px;

  align-items: start;

  padding: 14px 16px;

  border: 1px solid var(--line);

  border-radius: 14px;

  background: rgba(16, 18, 20, 0.72);

}



.admin-lot-open {

  position: absolute;

  inset: 0;

  z-index: 1;

  border-radius: inherit;

}



.admin-lot-main {

  position: relative;

  z-index: 2;

  pointer-events: none;

}



.admin-lot-main a {

  pointer-events: auto;

  position: relative;

  z-index: 3;

}



.admin-lot-top {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 10px;

  margin-bottom: 8px;

}



.admin-lot-id {

  font-weight: 700;

  color: var(--accent-2);

}



.admin-lot-chips {

  margin: 0 0 8px;

}



.admin-lot-title {

  display: block;

  margin: 0 0 8px;

}



.admin-lot-meta { margin: 0; }



.admin-lot-actions {

  justify-content: flex-end;

}



.admin-lot-side {

  position: relative;

  z-index: 3;

  display: grid;

  gap: 8px;

  justify-items: end;

}



.admin-inline .multi-select,

.admin-form .multi-select {

  position: relative;

  display: grid;

  gap: 5px;

  margin: 0;

  min-width: 132px;

  max-width: 180px;

}



.admin-form .multi-select {

  max-width: none;

  width: 100%;

}



.admin-inline .multi-select-trigger,

.admin-form .multi-select-trigger {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 8px;

  width: 100%;

  height: 34px;

  padding: 0 10px;

  border: 1px solid var(--hover-strong);

  border-radius: var(--radius-sm);

  background: rgba(16, 18, 20, 0.88);

  color: var(--text);

  font: inherit;

  font-size: 13px;

  text-align: left;

  cursor: pointer;

}



.admin-form .multi-select-trigger {

  height: 40px;

  padding: 0 12px;

  font-size: 14px;

}



.admin-inline .multi-select-trigger[aria-expanded="true"],

.admin-form .multi-select-trigger[aria-expanded="true"] {

  border-color: var(--avatar-ring);

}



.admin-inline .multi-select-trigger [data-multi-label],

.admin-form .multi-select-trigger [data-multi-label] {

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.admin-inline .multi-select-caret,

.admin-form .multi-select-caret {

  flex: none;

  width: 12px;

  height: 8px;

  color: var(--muted);

}



.admin-inline .multi-select-trigger[aria-expanded="true"] .multi-select-caret,

.admin-form .multi-select-trigger[aria-expanded="true"] .multi-select-caret {

  transform: rotate(180deg);

}



.admin-inline .multi-select-menu,

.admin-form .multi-select-menu {

  position: absolute;

  top: calc(100% + 4px);

  left: 0;

  right: 0;

  z-index: 50;

  display: grid;

  gap: 0;

  max-height: min(280px, 50vh);

  overflow-x: hidden;

  overflow-y: auto;

  padding: 6px;

  background: var(--panel);

  border: 1px solid var(--line);

  border-radius: var(--radius-sm);

  box-shadow: var(--menu-shadow);

}



.admin-inline .multi-select-menu[hidden],

.admin-form .multi-select-menu[hidden] {

  display: none;

}



.admin-inline .multi-select-option,

.admin-form .multi-select-option {

  display: flex;

  align-items: center;

  gap: 8px;

  margin: 0;

  padding: 8px 10px;

  border-radius: 6px;

  cursor: pointer;

  color: var(--text);

  font-size: 14px;

}



.admin-inline .multi-select-option:hover,

.admin-form .multi-select-option:hover {

  background: var(--hover);

}



.admin-inline .multi-select-option input,

.admin-form .multi-select-option input {

  position: absolute;

  opacity: 0;

  pointer-events: none;

}



.admin-inline .multi-select-text,

.admin-form .multi-select-text {

  flex: 1;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}



.admin-inline .multi-select-check,

.admin-form .multi-select-check {

  flex: none;

  width: 16px;

  color: var(--accent-2);

  font-size: 14px;

  font-weight: 700;

  line-height: 1;

  opacity: 0;

}



.admin-inline .multi-select-option:has(input:checked) .multi-select-check,

.admin-form .multi-select-option:has(input:checked) .multi-select-check {

  opacity: 1;

}



.admin-form .filter-caption {

  display: block;

  margin: 0;

  padding: 0;

  color: var(--faint);

  font-size: 12px;

  line-height: 1.45;

}



.facts li.lot-enter-row > span:last-child { white-space: normal; }



.lot-enter {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  align-items: center;

  justify-content: flex-end;

}



.lot-enter .hint { margin: 0; flex-basis: 100%; text-align: right; }



@media (max-width: 720px) {

  .admin-lot-card {

    grid-template-columns: 1fr;

  }

  .admin-lot-side { justify-items: stretch; }

  .admin-lot-actions {

    width: 100%;

    justify-content: stretch;

  }

}



.admin-inline {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  align-items: center;

  justify-content: flex-end;

  margin: 0;

}



.admin-inline input,

.admin-inline select {

  width: auto;

  min-width: 0;

  max-width: 140px;

  height: 34px;

}



.admin-inline .btn { height: 34px; }



.admin-table td.lot-actions {

  width: 110px;

  text-align: right;

  white-space: nowrap;

}



.admin-list {

  display: grid;

  gap: 0;

}



.admin-row {

  display: flex;

  justify-content: space-between;

  align-items: flex-start;

  gap: 14px;

  padding: 12px 0;

  border-top: 1px solid var(--line);

}



.admin-row:first-child {

  border-top: 0;

  padding-top: 0;

}



.admin-row > div { min-width: 0; }



.admin-row strong { display: block; margin-bottom: 4px; }



.admin-row .meta,

.admin-row p { margin: 0; }



.admin-row-actions {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  justify-content: flex-end;

  align-items: center;

}



.admin-row-actions form { margin: 0; }



.spaced-top { margin-top: 12px; }



.admin-tags {

  list-style: none;

  padding: 0;

  margin: 12px 0 0;

  display: grid;

  gap: 6px;

}



.admin-tags li {

  display: flex;

  justify-content: space-between;

  gap: 10px;

  align-items: center;

  padding: 6px 0;

  border-top: 1px solid var(--line);

  font-size: 13px;

  color: var(--muted);

}



.admin-thread {

  list-style: none;

  padding: 0;

  margin: 0 0 16px;

  display: grid;

  gap: 12px;

}



.admin-thread li {

  padding-bottom: 12px;

  border-bottom: 1px solid var(--line);

}



.admin-thread li:last-child {

  border-bottom: 0;

  padding-bottom: 0;

}



.admin-thread-head {

  display: flex;

  justify-content: space-between;

  gap: 10px;

  margin-bottom: 6px;

}



.admin-thread-head time { color: var(--muted); font-size: 12px; }



.admin-thread .prose { margin: 0; }



.facts.compact li {

  padding: 7px 0;

  font-size: 13px;

}



.warn-panel {

  border-color: rgba(230, 184, 77, 0.45);

  background: rgba(230, 184, 77, 0.08);

}



.clamp {

  display: -webkit-box;

  -webkit-line-clamp: 1;

  -webkit-box-orient: vertical;

  overflow: hidden;

}



.clamp-2 {

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 4px 0;

}



.admin-pager-total {

  text-align: center;

  margin: 6px 0 0;

}



@media (max-width: 960px) {

  .admin-grid { grid-template-columns: 1fr; }

  .admin-form.cols-5,

  .admin-toolbar.cols-4 {

    grid-template-columns: 1fr 1fr;

  }

  .admin-form.cols-5 .btn,

  .admin-toolbar.cols-4 .btn {

    grid-column: 1 / -1;

  }

  .settings-grid { grid-template-columns: 1fr; }

}



@media (max-width: 640px) {

  .admin-form.cols-2,

  .admin-form.cols-3,

  .admin-form.cols-5,

  .admin-toolbar,

  .admin-toolbar.cols-4 {

    grid-template-columns: 1fr;

  }

  .admin-form .btn,

  .admin-toolbar .btn {

    width: 100%;

    justify-self: stretch;

  }

  .admin-row {

    flex-direction: column;

  }

  .admin-row-actions,

  .admin-inline {

    width: 100%;

    justify-content: stretch;

  }

  .admin-inline input,

  .admin-inline select {

    flex: 1;

    max-width: none;

  }

  .admin-table td.lot-actions {

    width: auto;

    text-align: right;

  }

  .admin-head { flex-direction: column; align-items: flex-start; }

  .admin-main-nav { gap: 4px; padding: 4px; }

  .admin-tab { padding: 6px 10px; font-size: 12px; gap: 6px; }

  .admin-tab-icon { width: 15px; height: 15px; }

  .admin-sub-nav { gap: 4px; }

  .admin-sub-nav a { padding: 5px 10px; font-size: 12px; }

  .kpi-val { font-size: 22px; }

  .dash-card { padding: 14px 16px; }

}





/* —— Телефоны —— */

html {

  -webkit-text-size-adjust: 100%;

  text-size-adjust: 100%;

}



body {

  -webkit-tap-highlight-color: transparent;

}



.top {

  padding-top: env(safe-area-inset-top, 0px);

}



.toasts {

  right: max(16px, env(safe-area-inset-right, 0px));

  bottom: max(16px, env(safe-area-inset-bottom, 0px));

}



@media (max-width: 720px) {

  main {

    max-width: 100%;

    overflow-x: clip;

  }



  .wrap {

    padding-left: max(16px, env(safe-area-inset-left, 0px));

    padding-right: max(16px, env(safe-area-inset-right, 0px));

  }



  .top {

    z-index: 100;

    overflow: visible;

  }



  .top .wrap,

  .top-inner {

    overflow: visible;

  }



  .top-inner {

    position: relative;

    display: grid;

    grid-template-columns: 1fr auto 1fr;

    align-items: center;

    column-gap: 8px;

    min-height: 52px;

    padding: 6px 4px;

  }



  .top-inner > .nav-toggle {

    grid-column: 1;

    justify-self: start;

  }



  .top-inner > .brand {

    grid-column: 2;

    justify-self: center;

    position: static;

    transform: none;

    margin: 0;

    z-index: 1;

  }



  .top-inner > .userbox,

  .top-inner > .account {

    grid-column: 3;

    justify-self: end;

    z-index: 2;

  }



  .brand {

    font-size: 13px;

    letter-spacing: 0.09em;

  }



  .brand .vk-mark {

    width: 22px;

    height: 13px;

  }



  .account,

  .userbox {

    gap: 6px;

  }



  .nav-toggle {

    display: inline-flex;

    width: 34px;

    height: 34px;

    border: 0;

    border-radius: 8px;

    background: transparent;

    color: var(--muted);

  }



  .nav-toggle:hover,

  .top.is-nav-open .nav-toggle {

    background: var(--hover);

    color: var(--text);

  }



  .nav-toggle svg {

    width: 17px;

    height: 17px;

  }



  .user-split { display: none; }



  .top .money {

    font-size: 12px;

    font-weight: 700;

    padding: 0 2px;

    letter-spacing: -0.01em;

  }



  .userbox .avatar {

    width: 26px;

    height: 26px;

    font-size: 11px;

  }



  .userbox summary {

    padding: 0;

    margin: 0;

    min-height: 34px;

    min-width: 34px;

    justify-content: center;

    border-radius: 999px;

  }



  .top-inner > .account {

    display: flex;

    align-items: center;

  }



  .account-register { display: none; }



  .account-login {

    display: inline-flex;

    align-items: center;

    min-height: 34px;

    padding: 0 2px;

    font-size: 13px;

    font-weight: 600;

    color: var(--text);

  }



  .nav {

    position: absolute;

    top: calc(100% + 6px);

    left: 4px;

    right: auto;

    z-index: 110;

    display: none;

    flex-direction: column;

    flex-wrap: nowrap;

    align-items: stretch;

    gap: 1px;

    width: min(208px, calc(100vw - 32px));

    max-width: none;

    margin: 0;

    padding: 5px;

    border: 1px solid var(--line);

    border-radius: 12px;

    background: var(--panel);

    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.4);

    overflow: visible;

    mask-image: none;

  }



  .top.is-nav-open .nav {

    display: flex;

  }



  .top .nav a {

    flex: none;

    display: flex;

    align-items: center;

    justify-content: flex-start;

    min-height: 36px;

    padding: 0 10px;

    border-radius: 8px;

    color: var(--muted);

    white-space: nowrap;

    font-size: 13px;

    font-weight: 500;

  }



  .top .nav a::after { display: none; }



  .top .nav a[aria-current="page"] {

    color: var(--ink);

    background: var(--hover);

    font-weight: 600;

  }



  .top .nav a:hover { color: var(--ink); background: var(--hover); }



  .nav-mobile-extra {

    display: grid;

    gap: 1px;

    margin-top: 4px;

    padding-top: 5px;

    border-top: 1px solid var(--line);

  }



  .userbox details {

    position: relative;

  }



  .pop {

    position: absolute;

    top: calc(100% + 8px);

    right: 0;

    left: auto;

    width: min(220px, calc(100vw - 32px));

    max-width: none;

    max-height: min(70dvh, 480px);

    overflow-y: auto;

    overscroll-behavior: contain;

    z-index: 110;

    border-radius: 12px;

    padding: 5px;

    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.4);

  }



  .pop a,

  .pop button {

    min-height: 36px;

    padding: 0 10px;

    font-size: 13px;

    border-radius: 8px;

  }



  .pop-icon {

    width: 15px;

    height: 15px;

  }



  main {

    padding: 14px 0 max(36px, env(safe-area-inset-bottom, 0px));

  }



  .board {

    padding: 14px;

    border-radius: 12px;

  }



  .board.is-collapsed {

    padding: 10px 12px;

  }



  .filter-head {

    gap: 10px;

    margin-bottom: 14px;

  }



  .filter-head h2 {

    font-size: 18px;

  }



  .filter-head p {

    font-size: 12px;

    max-height: 48px;

  }



  .filter-icon {

    width: 40px;

    height: 40px;

    border-radius: 10px;

  }



  .filter-head > .btn {

    max-width: none;

    height: 36px;

    padding: 0 12px;

    flex: none;

  }



  .board-bar {

    flex-direction: column;

    align-items: stretch;

    padding: 12px 14px;

    gap: 10px;

    margin: 12px 0;

  }



  .board-bar > .btn,

  .board-bar > a.btn,

  .filter-search {

    width: 100%;

    min-width: 0;

  }



  .section-head {

    flex-direction: column;

    align-items: stretch;

    gap: 8px;

  }



  .cards {

    grid-template-columns: 1fr;

    gap: 8px;

  }



  .card {

    padding: 12px;

  }



  .modal {

    width: min(100vw - 20px, 420px);

    max-height: min(90dvh, 100%);

    margin: auto;

    padding: 16px;

    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));

    border-radius: 14px;

  }



  .lot-preview {

    width: 100%;

    max-width: 100%;

    max-height: min(92dvh, 100%);

    margin: auto 0 0;

    border-radius: 16px 16px 0 0;

    padding: 24px 14px max(16px, env(safe-area-inset-bottom, 0px));

  }



  .lot-preview .lot-body h1 {

    font-size: 18px;

    padding-left: 24px;

    padding-right: 24px;

  }



  .lot-preview .lot-body > .btn.buy,

  .lot-preview .lot-body > form > .btn.buy,

  .lot-preview .lot-purchase .btn.buy {

    width: 100%;

  }



  .toasts {

    left: max(12px, env(safe-area-inset-left, 0px));

    right: max(12px, env(safe-area-inset-right, 0px));

    bottom: max(12px, env(safe-area-inset-bottom, 0px));

    width: auto;

  }



  .history li {

    grid-template-columns: max-content minmax(0, 1fr);

    gap: 6px 12px;

  }



  .history time {

    grid-column: 1 / -1;

    font-size: 12px;

  }



  .facts li {

    column-gap: 10px;

    align-items: start;

  }



  .facts li > span:last-child {

    white-space: normal;

    text-align: right;

  }



  .block,

  .narrow,

  .sell-box,

  .center-block {

    border-radius: 12px;

  }



  .block {

    padding: 14px;

  }



  .block.people-board {

    padding: 12px 14px 8px;

  }



  .people-head,

  .people-row {

    column-gap: 12px;

  }



  .people-date {

    font-size: 12px;

  }



  .chips.account-tabs {

    flex-wrap: nowrap;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    margin-bottom: 12px;

    padding-bottom: 2px;

  }



  .chips.account-tabs::-webkit-scrollbar { display: none; }



  .chips.account-tabs a {

    display: inline-flex;

    flex: none;

    min-height: 36px;

    align-items: center;

    padding: 0 12px;

  }



  .more > summary {

    width: 36px;

    height: 36px;

    right: 12px;

    bottom: 12px;

  }



  .more[open] > .more-menu {

    right: 12px;

    top: calc(100% + 4px);

    width: min(220px, calc(100vw - 40px));

  }



  .more-menu .btn {

    height: 40px;

    font-size: 14px;

  }



  .mass-menu {

    width: min(240px, calc(100vw - 32px));

  }



  .mass-menu button {

    min-height: 40px;

  }



  .sell-box {

    padding: 14px;

  }



  .choice.origin-set .choice-set {

    grid-template-columns: 1fr 1fr;

  }



  .secret-format .choice-set {

    height: 42px;

  }



  .page-head h1 {

    font-size: 20px;

  }



  .lot-buyline {

    margin-bottom: 12px;

  }



  .lot-action-row {

    display: grid;

    grid-template-columns: 1fr;

    gap: 8px;

  }



  .lot-action-row .btn,

  .lot-action-row a.btn {

    width: 100%;

  }



  .lot-downloads {

    width: 100%;

  }



  .lot-formats {

    grid-template-columns: 1fr 1fr;

  }



  .lot-secondary > .btn,

  .lot-secondary > a.btn {

    flex: 1 1 100%;

    max-width: 280px;

  }



  .resell-form {

    display: grid;

    grid-template-columns: 1fr;

    width: 100%;

  }



  .resell-form .btn {

    width: 100%;

  }



  .admin-nav {

    flex-wrap: nowrap;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    padding-bottom: 4px;

  }



  .admin-nav::-webkit-scrollbar { display: none; }



  .admin-nav a {

    flex: none;

    min-height: 36px;

  }



  .filter-grid .multi-select-menu,

  .ops-filters .multi-select-menu,

  .form-grid .multi-select-menu {

    max-height: min(280px, 50dvh);

  }



  .panel {

    padding: 12px;

  }



  .upload-tools {

    flex-wrap: wrap;

    justify-content: stretch;

  }



  .upload-tools .btn {

    flex: 1;

    min-width: 0;

  }

}



@media (max-width: 640px) {

  input,

  select,

  textarea,

  .multi-select-trigger,

  .filter-grid input,

  .filter-grid select,

  .ops-filters input {

    font-size: 16px;

  }



  .filter-grid .filter-choice .choice-set span,

  .modal .filter-choice .choice-set span,

  .secret-format .choice-set span {

    font-size: 14px;

  }



  .btn,

  button.btn,

  a.btn {

    min-height: 44px;

    height: auto;

    padding-top: 10px;

    padding-bottom: 10px;

  }



  .btn.small,

  a.btn.small {

    min-height: 36px;

    height: auto;

    padding-top: 7px;

    padding-bottom: 7px;

  }



  .lot-actions .order-actions .btn.small {

    min-height: 44px;

    padding-top: 10px;

    padding-bottom: 10px;

  }



  .filter-links a,

  .filter-links button {

    min-height: 42px;

    height: auto;

    padding: 8px 12px;

  }



  .filter-foot .filter-search,

  .filter-foot > .btn {

    width: 100%;

    min-width: 0;

  }



  .center-block {

    margin-top: 12px;

    padding: 14px;

  }



  .account-foot {

    gap: 6px 10px;

    font-size: 12px;

  }



  .chip {

    min-height: 28px;

    font-size: 12px;

  }



  .fav {

    width: 40px;

    height: 40px;

  }



  .pager {

    gap: 8px;

    flex-wrap: wrap;

  }



  .pager .btn {

    flex: 1 1 auto;

    min-width: 0;

  }

}



@media (max-width: 400px) {

  .wrap {

    padding-left: max(10px, env(safe-area-inset-left, 0px));

    padding-right: max(10px, env(safe-area-inset-right, 0px));

  }



  .top .nav a {

    padding: 0 10px;

    font-size: 12px;

  }



  .brand > span {

    letter-spacing: 0.06em;

  }



  .choice.origin-set .choice-set {

    grid-template-columns: 1fr;

  }



  .fin-actions {

    flex-direction: column;

  }



  .fin-actions .btn {

    width: 100%;

  }

}



@media (hover: none) and (pointer: coarse) {

  .listing-row .account-side .btn,

  .listing-row .more > summary {

    opacity: 1;

    pointer-events: auto;

  }



  .btn:active,

  a.btn:active,

  .multi-select-trigger:active,

  .filter-links a:active,

  .filter-links button:active {

    background: var(--hover-strong);

  }

}



.mark-pick,

.mark-all {

  position: relative;

  margin: 0;

}



.mark-pick {
  position: absolute;
  left: 18px;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
  transition-delay: calc(var(--pick-i, 0) * 16ms);
}

#account-rows.is-picking .mark-pick {
  opacity: 1;
  pointer-events: auto;
}

.mark-lock {
  position: absolute;
  left: 18px;
  top: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  opacity: 0;
  pointer-events: none;
  color: var(--muted);
  transition: opacity 180ms ease;
}

#account-rows.is-picking .mark-lock {
  opacity: 1;
  pointer-events: auto;
  cursor: default;
}

.mark-lock svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#account-rows.is-picking .listing-row {
  padding-left: 64px !important;
  cursor: pointer;
}



#account-rows.is-picking .listing-row.is-export-locked {

  background: var(--fill-soft);

  border-color: var(--line-faint);

  cursor: default;

}



#account-rows.is-picking .listing-row.is-export-locked:hover {

  background: var(--fill-soft);

  border-color: var(--line-faint);

  box-shadow: none;

}



#account-rows.is-picking .listing-row.is-export-locked .price,

#account-rows.is-picking .listing-row.is-export-locked .row-title,

#account-rows.is-picking .listing-row.is-export-locked .account-foot {

  color: var(--muted);

}



#account-rows.is-picking .card-open {

  pointer-events: none;

}



.mark-pick input,

.mark-all input {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  margin: 0;

  opacity: 0;

  cursor: pointer;

}



.mark-box {
  position: relative;
  width: 20px;
  height: 20px;
  border: 1.5px solid rgba(255, 255, 255, 0.22);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  display: grid;
  place-items: center;
  transition: all 160ms ease;
}

.mark-pick:hover .mark-box,
.mark-all:hover .mark-box {
  border-color: #58a6ff;
  background: rgba(88, 166, 255, 0.08);
}

.mark-box svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: #ffffff;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  transform: scale(0.6);
  transition: all 140ms ease;
}

.mark-box::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 9px;
  height: 2px;
  border-radius: 1px;
  background: #ffffff;
  opacity: 0;
  transform: translate(-50%, -50%);
}

.mark-pick input:checked + .mark-box,
.mark-all input:checked + .mark-box {
  border-color: #3fb950;
  background: linear-gradient(135deg, #238636 0%, #2ea043 100%);
  box-shadow: 0 0 10px rgba(46, 160, 67, 0.4);
}

.mark-pick input:checked + .mark-box svg,
.mark-all input:checked + .mark-box svg {
  opacity: 1;
  transform: scale(1);
}

.mark-all input:indeterminate + .mark-box {
  border-color: #3fb950;
  background: linear-gradient(135deg, #238636 0%, #2ea043 100%);
}

.mark-all input:indeterminate + .mark-box svg {
  opacity: 0;
}

.mark-all input:indeterminate + .mark-box::before {
  opacity: 1;
}

.mark-pick input:focus-visible + .mark-box,
.mark-all input:focus-visible + .mark-box {
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.35);
}



.listing-row.is-marked {

  background: var(--fill-mid);

  border-color: var(--line-strong);

}



#mark-toggle[aria-pressed="true"] {

  color: var(--ink);

  border-color: var(--line-strong);

  background: var(--fill-mid);

}



.mark-all {

  display: none;

  align-items: center;

  gap: 8px;

  color: var(--faint);

  font-size: 12px;

  min-height: 22px;

}



.account-tools.is-picking .mark-all {

  display: flex;

  animation: mark-all-in 180ms ease;

}



@keyframes mark-all-in {

  from { opacity: 0; transform: translateY(4px); }

  to { opacity: 1; transform: none; }

}



@media (max-width: 720px) {
  #account-rows.is-picking .listing-row {
    padding-left: 56px !important;
  }
  #account-rows.is-picking .mark-pick,
  #account-rows.is-picking .mark-lock {
    left: 16px !important;
    top: 19px !important;
    transform: none !important;
  }
}





/* ================= LOT MODAL CLEAN CLASSIC ================= */

.lot-modal-head {

  margin-bottom: 16px;

  padding-bottom: 14px;

  border-bottom: 1px solid var(--line);

  text-align: center;

}



.lot-modal-head h1 {

  margin: 0;

  font-size: 20px;

  font-weight: 700;

  color: var(--ink, #fff);

  letter-spacing: -0.01em;

}



/* Tactile micro-hover on chips */

.chip {

  transition: transform 0.14s ease, border-color 0.14s ease, background-color 0.14s ease, box-shadow 0.14s ease;

}



@media (hover: hover) and (pointer: fine) {

  .chip:hover {

    transform: translateY(-1.5px);

    border-color: rgba(255, 255, 255, 0.22);

    background: rgba(255, 255, 255, 0.065);

    box-shadow: 0 3px 8px -2px rgba(0, 0, 0, 0.4);

  }

  .chip.good:hover {

    border-color: rgba(93, 219, 165, 0.45);

    background: rgba(93, 219, 165, 0.16);

  }

  .chip.warn:hover {

    border-color: rgba(180, 90, 90, 0.5);

    background: rgba(180, 90, 90, 0.2);

  }

  .chip.origin-logs:hover {

    border-color: rgba(120, 140, 155, 0.5);

    background: rgba(120, 140, 155, 0.2);

  }

  .chip.origin-autoreg:hover {

    border-color: rgba(140, 130, 155, 0.5);

    background: rgba(140, 130, 155, 0.2);

  }

  .chip.origin-brut:hover {

    border-color: rgba(180, 140, 70, 0.5);

    background: rgba(180, 140, 70, 0.2);

  }

  .chip.origin-phish:hover {

    border-color: rgba(180, 100, 100, 0.5);

    background: rgba(180, 100, 100, 0.2);

  }

  .chip.origin-own:hover {

    border-color: rgba(120, 150, 130, 0.5);

    background: rgba(120, 150, 130, 0.2);

  }

}



.lot-chips {

  justify-content: center;

  margin-bottom: 16px;

}



.lot-main-cta {

  display: flex;

  justify-content: center;

  margin: 4px 0 14px;

}



.lot-main-cta form {

  width: min(280px, 100%);

  margin: 0;

}



.btn-center-buy {

  width: min(280px, 100%) !important;

  height: 42px !important;

  font-size: 15px !important;

  font-weight: 600 !important;

  display: inline-flex !important;

  align-items: center !important;

  justify-content: center !important;

  gap: 8px !important;

  border-radius: 10px !important;

}







.lot-body .empty {

  padding: 0;

  margin: 6px 0 14px;

  font-size: 13.5px;

  line-height: 1.45;

  color: var(--muted);

  text-align: center;

}



.lot-preview .history {

  text-align: left;

}



/* ================= FILTER SECTIONS (SMART GROUPS) ================= */

.filter-title-row {

  display: flex;

  align-items: center;

  gap: 10px;

}



.filter-active-badge {

  display: inline-flex;

  align-items: center;

  padding: 2px 9px;

  font-size: 11px;

  font-weight: 700;

  border-radius: 99px;

  background: rgba(93, 219, 165, 0.14);

  color: #5ddba5;

  border: 1px solid rgba(93, 219, 165, 0.35);

  letter-spacing: -0.01em;

}



.filter-reset-active {

  border-color: rgba(255, 255, 255, 0.22) !important;

  color: #f8fafc !important;

  background: rgba(255, 255, 255, 0.05) !important;

}

.filter-reset-active:hover {

  border-color: rgba(239, 68, 68, 0.4) !important;

  color: #fca5a5 !important;

  background: rgba(239, 68, 68, 0.1) !important;

}



.filter-sections {

  display: flex;

  flex-direction: column;

  gap: 18px;

}



.filter-section {

  display: flex;

  flex-direction: column;

  gap: 10px;

}



.filter-section-head {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 2px;

}



.filter-section-title {

  font-size: 11.5px;

  font-weight: 700;

  color: var(--muted, #8b929e);

  text-transform: uppercase;

  letter-spacing: 0.06em;

  display: inline-flex;

  align-items: center;

  gap: 7px;

  white-space: nowrap;

  user-select: none;

}



.filter-section-title svg {

  width: 14px;

  height: 14px;

  color: var(--accent, #5ddba5);

  flex-shrink: 0;

}



.filter-section-line {

  flex: 1;

  height: 1px;

  background: var(--line, rgba(255, 255, 255, 0.08));

}



/* Grids for each section */

.filter-grid-main {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

  gap: 10px 14px !important;

}



@media (min-width: 981px) {

  .range-wide-seller {

    grid-column: span 2 !important;

  }

}



.filter-grid-profile {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

  gap: 10px 14px !important;

}



.filter-grid-4 {

  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

  gap: 10px 14px !important;

}



@media (max-width: 980px) {

  .filter-grid-main,

  .filter-grid-profile,

  .filter-grid-4 {

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

  }

  .range-wide-seller {

    grid-column: span 2 !important;

  }

}



@media (max-width: 580px) {

  .filter-grid-main,

  .filter-grid-profile,

  .filter-grid-4 {

    grid-template-columns: 1fr !important;

  }

  .range-wide-seller {

    grid-column: span 1 !important;

  }

}



/* ================= MODERN FINTECH REDESIGN ================= */

.fin-block {

  padding: 0 !important;

  overflow: hidden;

  border-radius: 16px !important;

}



.fin-hero {

  padding: 24px 28px;

  background: linear-gradient(145deg, #181b22 0%, #131519 100%);

  border-bottom: 1px solid var(--line);

  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 20px;

  flex-wrap: wrap;

}



.fin-balance-block {

  display: flex;

  flex-direction: column;

  gap: 6px;

}



.fin-balance-header {

  font-size: 12px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 0.06em;

  color: var(--muted);

  display: flex;

  align-items: center;

  gap: 7px;

}



.fin-card-ico {

  width: 14px;

  height: 14px;

  color: var(--accent);

}



.fin-balance-sum {

  font-size: 34px;

  font-weight: 700;

  color: #fff;

  letter-spacing: -0.02em;

  font-variant-numeric: tabular-nums;

  line-height: 1.1;

}



.fin-pill-stats {

  display: flex;

  align-items: center;

  gap: 8px;

  margin-top: 4px;

  flex-wrap: wrap;

}



.fin-pill {

  display: inline-flex;

  align-items: center;

  gap: 5px;

  padding: 3px 9px;

  border-radius: 7px;

  font-size: 11.5px;

  font-weight: 500;

  background: rgba(255, 255, 255, 0.035);

  border: 1px solid var(--line);

  font-variant-numeric: tabular-nums;

}



.fin-pill svg {

  width: 12px;

  height: 12px;

  flex-shrink: 0;

}



.fin-pill.hold {

  color: #fcd34d;

  background: rgba(251, 191, 36, 0.09);

  border-color: rgba(251, 191, 36, 0.25);

}



.fin-pill.plus {

  color: #86efac;

  background: rgba(34, 197, 94, 0.09);

  border-color: rgba(34, 197, 94, 0.25);

}



.fin-pill.minus {

  color: #fca5a5;

  background: rgba(239, 68, 68, 0.09);

  border-color: rgba(239, 68, 68, 0.25);

}



.fin-hero-actions {

  display: flex;

  gap: 10px;

}



.btn-fin-primary {
  background: rgba(93, 219, 165, 0.12) !important;
  border: 1px solid rgba(93, 219, 165, 0.3) !important;
  color: #d1fae5 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 8px 18px !important;
  border-radius: 8px !important;
  cursor: pointer;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

.btn-fin-primary:hover {
  background: rgba(93, 219, 165, 0.22) !important;
  border-color: rgba(93, 219, 165, 0.55) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}



.btn-fin-secondary {

  background: #1e222a !important;

  border: 1px solid var(--line-strong) !important;

  color: #f1f5f9 !important;

  font-size: 13.5px !important;

  font-weight: 600 !important;

  padding: 10px 18px !important;

  border-radius: 10px !important;

  cursor: pointer;

  display: inline-flex !important;

  align-items: center !important;

  gap: 8px !important;

  transition: all 0.16s ease !important;

}



.btn-fin-secondary:hover {

  background: #272c37 !important;

  border-color: rgba(255, 255, 255, 0.28) !important;

  color: #fff !important;

  transform: translateY(-1px);

}



/* Action panels */

.fin-action-panel {

  margin: 16px 24px;

  background: #13161a !important;

  border: 1px solid var(--line-strong) !important;

}



.panel-head-title h3 {

  margin: 0 0 4px;

  font-size: 16px;

  color: #fff;

}



/* Quick Type Tabs Toolbar */

.fin-ops-toolbar {

  padding: 14px 24px 16px;

  background: rgba(0, 0, 0, 0.16);

  border-bottom: 1px solid var(--line);

  display: flex;

  flex-direction: column;

  gap: 12px;

}



.fin-type-tabs {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  align-items: center;
  border-bottom: 1px solid var(--line);
  padding-bottom: 0px;
  margin-bottom: 6px;
}

.fin-type-tab {
  position: relative;
  padding: 8px 4px 12px;
  border-radius: 0;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--muted);
  background: transparent !important;
  border: none !important;
  text-decoration: none;
  transition: color 0.15s ease;
  user-select: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.fin-type-tab:hover {
  color: #fff !important;
  background: transparent !important;
}

.fin-type-tab.active {
  color: #58a6ff !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

.fin-type-tab.active::after {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: #58a6ff !important;
  border-radius: 2px 2px 0 0 !important;
  box-shadow: 0 0 6px rgba(88, 166, 255, 0.35) !important;
}



.fin-secondary-filters {

  display: grid;

  grid-template-columns: 1fr 1.4fr 1fr;

  gap: 10px;

}



.fin-ops-bar {

  padding: 12px 24px !important;

  border-bottom: 1px solid var(--line) !important;

  margin: 0 !important;

}



/* Operations List */

.fin-ledger-list {

  display: flex;

  flex-direction: column;

}



.fin-ledger-list .op {

  padding: 14px 24px !important;

  border-top: none !important;

  border-bottom: 1px solid var(--line) !important;

  transition: background 0.14s ease;

}



.fin-ledger-list .op:last-child {

  border-bottom: none !important;

}



.fin-ledger-list .op:hover {

  background: rgba(255, 255, 255, 0.022);

}



.fin-op-left {

  display: flex;

  align-items: center;

  gap: 14px;

  min-width: 0;

}



.fin-op-badge {

  width: 36px;

  height: 36px;

  border-radius: 10px;

  display: grid;

  place-items: center;

  flex-shrink: 0;

}



.fin-op-badge svg {

  width: 17px;

  height: 17px;

}



.fin-op-badge.purchase {

  background: rgba(192, 132, 252, 0.12);

  color: #c084fc;

  border: 1px solid rgba(192, 132, 252, 0.25);

}



.fin-op-badge.sale {

  background: rgba(93, 219, 165, 0.12);

  color: #5ddba5;

  border: 1px solid rgba(93, 219, 165, 0.25);

}



.fin-op-badge.hold {

  background: rgba(251, 191, 36, 0.12);

  color: #fbbf24;

  border: 1px solid rgba(251, 191, 36, 0.25);

}



.fin-op-badge.deposit {

  background: rgba(96, 165, 250, 0.12);

  color: #60a5fa;

  border: 1px solid rgba(96, 165, 250, 0.25);

}



.fin-op-badge.withdraw {

  background: rgba(251, 146, 60, 0.12);

  color: #fb923c;

  border: 1px solid rgba(251, 146, 60, 0.25);

}



.fin-op-badge.other {

  background: rgba(148, 163, 184, 0.12);

  color: #94a3b8;

  border: 1px solid rgba(148, 163, 184, 0.22);

}



.fin-op-info {

  display: flex;

  flex-direction: column;

  gap: 3px;

  min-width: 0;

}



.fin-op-title {

  font-size: 13.5px;

  font-weight: 600;

  color: #f1f5f9;

  line-height: 1.4;

}



.fin-op-title a {

  color: #fff;

  text-decoration: none;

  transition: color 0.15s;

}



.fin-op-title a:hover {

  color: var(--accent);

  text-decoration: underline;

}



.fin-op-meta {

  font-size: 12px;

  color: var(--muted);

}



.fin-ledger-list .sum {

  font-size: 15px !important;

  font-weight: 700 !important;

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.fin-pager {

  padding: 16px 24px !important;

  border-top: 1px solid var(--line) !important;

}



@media (max-width: 720px) {

  .fin-hero {

    flex-direction: column;

    align-items: flex-start;

    padding: 18px;

  }

  .fin-hero-actions {

    width: 100%;

  }

  .btn-fin-primary, .btn-fin-secondary {

    flex: 1;

    justify-content: center;

  }

  .fin-secondary-filters {

    grid-template-columns: 1fr;

  }

  .fin-ledger-list .op {

    padding: 12px 16px !important;

  }

  .fin-action-panel {

    margin: 12px 16px;

  }

}



/* Smooth finance panel animation & active button states */

.fin-action-panel {

  will-change: max-height, opacity, transform;

}



.btn-fin-primary.is-active,

.btn-fin-secondary.is-active {

  box-shadow: 0 0 0 2px rgba(93, 219, 165, 0.4), 0 6px 20px rgba(0, 0, 0, 0.35) !important;

  border-color: rgba(93, 219, 165, 0.7) !important;

}



/* Infinite scroll loader & smooth row fade-in */

.fin-scroll-loader {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

  padding: 22px 16px;

  color: var(--muted);

  font-size: 13px;

  font-weight: 500;

}



.fin-spinner {

  width: 16px;

  height: 16px;

  border: 2px solid rgba(255, 255, 255, 0.15);

  border-top-color: var(--accent, #5ddba5);

  border-radius: 50%;

  animation: finSpin 0.7s linear infinite;

  flex-shrink: 0;

}



@keyframes finSpin {

  to { transform: rotate(360deg); }

}



@keyframes finRowFadeIn {

  0% {

    opacity: 0;

    transform: translateY(12px);

  }

  100% {

    opacity: 1;

    transform: translateY(0);

  }

}



.fin-row-fade-in {

  animation: finRowFadeIn 0.38s cubic-bezier(0.16, 1, 0.3, 1) both;

}



/* ================= EXECUTIVE DASHBOARD (CABINET) ================= */

.cab-container {

  display: flex;

  flex-direction: column;

  gap: 20px;

}



.cab-hero {

  background: linear-gradient(135deg, rgba(20, 24, 32, 0.95) 0%, rgba(13, 16, 22, 0.95) 100%);

  border: 1px solid var(--line-strong);

  border-radius: 20px;

  padding: 24px 28px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);

  position: relative;

  overflow: hidden;

}



.cab-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 340px 180px at 85% 30%, rgba(93, 219, 165, 0.14) 0%, transparent 70%);
  pointer-events: none;
}



.cab-user-info {

  display: flex;

  align-items: center;

  gap: 18px;

}



.cab-avatar {

  width: 62px;

  height: 62px;

  border-radius: 18px;

  background: linear-gradient(135deg, #10b981 0%, #059669 100%);

  display: grid;

  place-items: center;

  font-size: 25px;

  font-weight: 700;

  color: #fff;

  box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);

  position: relative;

  flex-shrink: 0;

}



.cab-online-dot {

  position: absolute;

  bottom: -2px;

  right: -2px;

  width: 14px;

  height: 14px;

  background: #10b981;

  border: 3px solid #14171d;

  border-radius: 50%;

}



.cab-name-box {

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.cab-name-box h2 {

  font-size: 22px;

  font-weight: 700;

  color: #fff;

  margin: 0 !important;

  padding: 0 !important;

  line-height: 1.2 !important;

  display: flex;

  align-items: center;

  gap: 10px;

}



.cab-meta-line {

  margin-top: 4px;

  display: flex;

  align-items: center;

  gap: 10px;

  font-size: 12.5px;

  line-height: 1.2;

  color: var(--muted);

}



.cab-role-badge {

  font-size: 11px;

  font-weight: 600;

  padding: 3px 8px;

  border-radius: 6px;

  background: rgba(192, 132, 252, 0.15);

  color: #d8b4fe;

  border: 1px solid rgba(192, 132, 252, 0.3);

  text-transform: uppercase;

  letter-spacing: 0.05em;

}



.cab-role-badge.admin, .cab-role-badge.superadmin {

  background: rgba(251, 191, 36, 0.15);

  color: #fde68a;

  border-color: rgba(251, 191, 36, 0.35);

}



.cab-meta-line {

  display: flex;

  align-items: center;

  gap: 12px;

  font-size: 12.5px;

  color: var(--muted);

}



.cab-meta-line span {

  display: inline-flex;

  align-items: center;

  gap: 5px;

}



.cab-status-badge {

  color: #10b981;

  font-weight: 500;

}



.cab-hero-actions {

  display: flex;

  gap: 10px;

}



.btn-cab-primary {
  background: rgba(93, 219, 165, 0.12) !important;
  border: 1px solid rgba(93, 219, 165, 0.3) !important;
  color: #d1fae5 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 8px 18px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

.btn-cab-primary:hover {
  background: rgba(93, 219, 165, 0.22) !important;
  border-color: rgba(93, 219, 165, 0.55) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}



.btn-cab-secondary {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #f1f5f9 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

.btn-cab-secondary:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}



/* KPI Cards Grid (Variant 1: Compact Horizontal Strip Pills) */

.cab-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.cab-kpi-card {
  background: var(--card-bg, #14171d);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  height: 64px;
  box-sizing: border-box;
  text-decoration: none;
  transition: all 0.16s ease;
  position: relative;
  overflow: hidden;
}

.cab-kpi-card:hover {
  border-color: var(--line-strong);
  background: #171b22;
  transform: translateY(-1px);
}

.cab-kpi-card.highlight {
  background: linear-gradient(135deg, rgba(93, 219, 165, 0.09) 0%, rgba(20, 23, 29, 0.95) 100%);
  border-color: rgba(93, 219, 165, 0.35);
}

.cab-kpi-card.highlight:hover {
  border-color: rgba(93, 219, 165, 0.55);
}

.cab-kpi-ico-wrap {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.04);
  color: var(--muted);
  border: 1px solid var(--line);
  transition: all 0.15s ease;
}

.cab-kpi-card.highlight .cab-kpi-ico-wrap {
  background: rgba(93, 219, 165, 0.16);
  color: #5ddba5;
  border-color: rgba(93, 219, 165, 0.4);
  box-shadow: 0 0 10px rgba(93, 219, 165, 0.2);
}

.cab-kpi-ico-wrap svg {
  width: 17px;
  height: 17px;
}

.cab-kpi-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  flex: 1;
}

.cab-kpi-lbl {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.cab-kpi-val {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}

.cab-kpi-arrow {
  color: var(--muted);
  font-size: 14px;
  opacity: 0.4;
  transition: transform 0.15s, opacity 0.15s, color 0.15s;
  flex-shrink: 0;
}

.cab-kpi-card:hover .cab-kpi-arrow {
  opacity: 1;
  color: var(--accent);
  transform: translateX(2px);
}

/* Shortcuts */

.cab-shortcuts {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 12px;

}



.cab-shortcut-item {

  background: rgba(20, 23, 29, 0.6);

  border: 1px solid var(--line);

  border-radius: 12px;

  padding: 12px 14px;

  display: flex;

  align-items: center;

  gap: 12px;

  text-decoration: none;

  color: var(--text);

  transition: all 0.15s ease;

}



.cab-shortcut-item:hover {

  background: #1b1f27;

  border-color: var(--line-strong);

  transform: translateY(-1px);

}



.cab-shortcut-ico {

  width: 34px;

  height: 34px;

  border-radius: 9px;

  display: grid;

  place-items: center;

  font-size: 15px;

  flex-shrink: 0;

}



.cab-shortcut-ico.purple { background: rgba(192, 132, 252, 0.12); color: #c084fc; }

.cab-shortcut-ico.emerald { background: rgba(93, 219, 165, 0.12); color: #5ddba5; }

.cab-shortcut-ico.blue { background: rgba(96, 165, 250, 0.12); color: #60a5fa; }

.cab-shortcut-ico.amber { background: rgba(251, 191, 36, 0.12); color: #fbbf24; }



.cab-shortcut-text strong {

  display: block;

  font-size: 13px;

  color: #fff;

  font-weight: 600;

}



.cab-shortcut-text span {

  display: block;

  font-size: 11.5px;

  color: var(--muted);

}



/* Split Columns */

.cab-split {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 18px;

}



.cab-section {

  background: var(--card-bg, #14171d);

  border: 1px solid var(--line);

  border-radius: 18px;

  overflow: hidden;

}



.cab-section-head {

  padding: 16px 20px;

  border-bottom: 1px solid var(--line);

  display: flex;

  align-items: center;

  justify-content: space-between;

  background: rgba(0, 0, 0, 0.15);

}



.cab-section-head h3 {

  font-size: 15px;

  font-weight: 600;

  color: #fff;

  display: flex;

  align-items: center;

  gap: 8px;

  margin: 0;

}



.cab-section-head a {

  font-size: 12.5px;

  color: var(--accent);

  text-decoration: none;

  font-weight: 500;

}



.cab-section-head a:hover {

  text-decoration: underline;

}



.cab-list {

  display: flex;

  flex-direction: column;

}



.cab-item {

  padding: 13px 20px;

  border-bottom: 1px solid var(--line);

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 14px;

  transition: background 0.14s ease;

}



.cab-item:last-child {

  border-bottom: none;

}



.cab-item:hover {

  background: rgba(255, 255, 255, 0.02);

}



.cab-item-left {

  display: flex;

  align-items: center;

  gap: 12px;

  min-width: 0;

}



.cab-badge {

  width: 32px;

  height: 32px;

  border-radius: 8px;

  display: grid;

  place-items: center;

  flex-shrink: 0;

}



.cab-badge svg {

  width: 16px;

  height: 16px;

}



.cab-badge.purchase { background: rgba(192, 132, 252, 0.12); color: #c084fc; border: 1px solid rgba(192, 132, 252, 0.25); }

.cab-badge.sale { background: rgba(93, 219, 165, 0.12); color: #5ddba5; border: 1px solid rgba(93, 219, 165, 0.25); }

.cab-badge.hold { background: rgba(251, 191, 36, 0.12); color: #fbbf24; border: 1px solid rgba(251, 191, 36, 0.25); }

.cab-badge.deposit { background: rgba(96, 165, 250, 0.12); color: #60a5fa; border: 1px solid rgba(96, 165, 250, 0.25); }

.cab-badge.withdraw { background: rgba(251, 146, 60, 0.12); color: #fb923c; border: 1px solid rgba(251, 146, 60, 0.25); }

.cab-badge.notice { background: rgba(96, 165, 250, 0.12); color: #60a5fa; border: 1px solid rgba(96, 165, 250, 0.25); }

.cab-badge.warn { background: rgba(248, 113, 113, 0.12); color: #f87171; border: 1px solid rgba(248, 113, 113, 0.25); }

.cab-badge.other { background: rgba(148, 163, 184, 0.12); color: #94a3b8; border: 1px solid rgba(148, 163, 184, 0.22); }



.cab-item-info {

  display: flex;

  flex-direction: column;

  min-width: 0;

}



.cab-item-title {

  font-size: 13.5px;

  font-weight: 500;

  color: #f1f5f9;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}



.cab-item-title a {

  color: inherit;

  text-decoration: none;

}



.cab-item-title a:hover {

  color: var(--accent);

}



.cab-item-time {

  font-size: 11.5px;

  color: var(--muted);

  margin-top: 2px;

}



.cab-sum {

  font-size: 14px;

  font-weight: 700;

  font-variant-numeric: tabular-nums;

  white-space: nowrap;

}



.cab-sum.plus { color: #5ddba5; }

.cab-sum.minus { color: #f87171; }

.cab-sum.hold { color: #fbbf24; }



.cab-empty {

  padding: 30px 20px;

  text-align: center;

  color: var(--muted);

}



.cab-icon {

  width: 15px;

  height: 15px;

}



@media (max-width: 860px) {

  .cab-hero {

    flex-direction: column;

    align-items: flex-start;

    padding: 20px;

  }

  .cab-hero-actions {

    width: 100%;

  }

  .btn-cab-primary, .btn-cab-secondary {

    flex: 1;

    justify-content: center;

  }

  .cab-kpi-grid {

    grid-template-columns: 1fr 1fr;

  }

  .cab-shortcuts {

    grid-template-columns: 1fr 1fr;

  }

  .cab-split {

    grid-template-columns: 1fr;

  }

}



@media (max-width: 480px) {

  .cab-kpi-grid {

    grid-template-columns: 1fr;

  }

  .cab-shortcuts {

    grid-template-columns: 1fr;

  }

}



/* ================= MODERN NOTIFICATIONS PAGE ================= */

.notif-count {

  display: flex;

  align-items: baseline;

  gap: 10px;

}



.notif-count-label {

  font-size: 16px;

  font-weight: 500;

  color: var(--muted);

}



.notif-body-text {

  font-size: 12.5px;

  color: #94a3b8;

  margin: 4px 0 0;

  line-height: 1.4;

}



.notif-action-btn {

  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  font-size: 12.5px !important;

  font-weight: 600 !important;

  padding: 6px 14px !important;

  border-radius: 8px !important;

  white-space: nowrap !important;

  flex-shrink: 0 !important;

}



.notif-action-btn svg {

  width: 14px;

  height: 14px;

}



.notif-tabs button.fin-type-tab {

  background: transparent;

  border: none;

  cursor: pointer;

  font-family: inherit;

}





.fin-op-badge.warn,

.cab-badge.warn {

  background: rgba(248, 113, 113, 0.12) !important;

  color: #f87171 !important;

  border: 1px solid rgba(248, 113, 113, 0.25) !important;

}



.fin-op-badge.delisted,

.cab-badge.delisted {

  background: rgba(251, 191, 36, 0.12) !important;

  color: #fbbf24 !important;

  border: 1px solid rgba(251, 191, 36, 0.25) !important;

}





/* ================= MASS UPLOADS & PURCHASES REDESIGN ================= */

.upload-hub-block,

.bulk-hub-block {

  margin-top: 10px;

}



.upload-count,

.bulk-count {

  display: flex;

  align-items: baseline;

  gap: 10px;

}



.upload-count-label {

  font-size: 16px;

  font-weight: 500;

  color: var(--muted);

}



.upload-item-card,

.bulk-item-card {

  text-decoration: none !important;

  color: inherit !important;

}



.upload-card-right {

  display: flex;

  align-items: center;

  gap: 16px;

  flex-shrink: 0;

}



.upload-ratio-pills {

  display: flex;

  align-items: center;

  gap: 6px;

}



.upload-pill-badge {

  font-size: 12px;

  font-weight: 700;

  padding: 4px 10px;

  border-radius: 8px;

  font-variant-numeric: tabular-nums;

  display: inline-flex;

  align-items: center;

  justify-content: center;

}



.upload-pill-badge.wait {

  background: rgba(148, 163, 184, 0.1);

  color: #94a3b8;

  border: 1px solid rgba(148, 163, 184, 0.2);

}



.upload-pill-badge.ok {

  background: rgba(93, 219, 165, 0.12);

  color: #5ddba5;

  border: 1px solid rgba(93, 219, 165, 0.25);

}



.upload-pill-badge.bad {

  background: rgba(248, 113, 113, 0.12);

  color: #f87171;

  border: 1px solid rgba(248, 113, 113, 0.25);

}



.upload-go-btn {

  width: 28px;

  height: 28px;

  border-radius: 8px;

  display: grid;

  place-items: center;

  color: var(--muted);

  background: rgba(255, 255, 255, 0.03);

  transition: all 0.15s ease;

}



.upload-go-btn svg {

  width: 16px;

  height: 16px;

}



.upload-item-card:hover .upload-go-btn {

  color: #fff;

  background: rgba(255, 255, 255, 0.08);

  transform: translateX(2px);

}



.upload-spin-icon {

  animation: finSpin 1.2s linear infinite;

}



.bulk-actions-group {

  display: flex;

  align-items: center;

  gap: 10px;

  flex-shrink: 0;

}



.bulk-label-tag {

  font-size: 11px;

  font-weight: 600;

  padding: 2px 7px;

  border-radius: 6px;

  background: rgba(192, 132, 252, 0.12);

  color: #d8b4fe;

  border: 1px solid rgba(192, 132, 252, 0.25);

  margin-left: 8px;

  vertical-align: middle;

}



.fin-pager-wrap {

  padding: 16px 20px;

  border-top: 1px solid var(--line);

}



/* Modernized Account Tabs in listings */

.account-tabs {

  display: flex;

  gap: 6px;

  padding: 6px;

  background: rgba(20, 23, 29, 0.7);

  border: 1px solid var(--line);

  border-radius: 14px;

  margin-bottom: 20px;

  overflow-x: auto;

}



.account-tabs a {

  padding: 8px 16px;

  border-radius: 9px;

  font-size: 13px;

  font-weight: 600;

  color: var(--muted);

  text-decoration: none;

  transition: all 0.15s ease;

  white-space: nowrap;

}



.account-tabs a:hover {

  color: #fff;

  background: rgba(255, 255, 255, 0.04);

}



.account-tabs a[aria-current="page"] {

  color: #fff;

  background: #1e232c;

  border: 1px solid var(--line-strong);

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);

}





/* Modernized Single Upload Stats */

.upload-stats {

  display: grid !important;

  grid-template-columns: repeat(3, 1fr) !important;

  gap: 14px !important;

  background: transparent !important;

  border: none !important;

  padding: 0 !important;

  margin: 16px 0 20px !important;

}



.upload-stats > div {

  background: var(--card-bg, #14171d) !important;

  border: 1px solid var(--line) !important;

  border-radius: 16px !important;

  padding: 16px 20px !important;

  display: flex !important;

  flex-direction: column !important;

  gap: 4px !important;

  transition: all 0.16s ease !important;

}



.upload-stats > div:hover {

  border-color: var(--line-strong) !important;

  transform: translateY(-1px);

}



.upload-stats b {

  font-size: 26px !important;

  font-weight: 700 !important;

  font-variant-numeric: tabular-nums !important;

}



.upload-stats span {

  font-size: 12px !important;

  color: var(--muted) !important;

  font-weight: 500 !important;

}





/* ========================================================

   SUBTLE NATIVE HUB STYLES (UPLOADS & BULK PURCHASES)

   ======================================================== */

.subtle-page-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 16px;

  flex-wrap: wrap;

  gap: 12px;

}



.page-title-wrap {

  display: flex;

  align-items: center;

  gap: 12px;

}



.page-title-wrap h1,

.subtle-section-title {

  font-size: 22px;

  font-weight: 700;

  color: #fff;

  letter-spacing: -0.01em;

  margin: 0;

}



.badge-count {

  font-size: 11.5px;

  font-weight: 600;

  padding: 3px 10px;

  border-radius: 20px;

  background: rgba(255, 255, 255, 0.08);

  color: var(--muted);

  border: 1px solid rgba(255, 255, 255, 0.08);

}



.page-head-actions {

  display: flex;

  align-items: center;

  gap: 10px;

}



.mini-summary-bar {

  display: flex;

  align-items: center;

  gap: 14px;

  background: rgba(20, 23, 29, 0.6);

  border: 1px solid var(--line);

  padding: 10px 18px;

  border-radius: 12px;

  margin-bottom: 18px;

  font-size: 12.5px;

  color: var(--muted);

  flex-wrap: wrap;

}



.mini-stat-item {

  display: flex;

  align-items: center;

  gap: 6px;

  color: #e2e8f0;

}



.mini-stat-dot {

  width: 6px;

  height: 6px;

  border-radius: 50%;

  display: inline-block;

}



.mini-stat-dot.ok {

  background: var(--accent);

  box-shadow: 0 0 6px rgba(93, 219, 165, 0.5);

}



.mini-stat-dot.wait {

  background: #fbbf24;

}



.mini-stat-dot.bad {

  background: #f87171;

}



.mini-sep {

  color: rgba(255, 255, 255, 0.16);

}



.mini-summary-note {

  font-size: 12px;

  color: var(--muted);

  margin-left: auto;

}



.upload-hub-block,

.bulk-hub-block {

  padding: 0;

  background: transparent;

  border: none;

}





/* ========================================================

   LOGICAL TWO-GROUP NAVIGATION BAR (LISTINGS TABS)

   ======================================================== */

.account-nav-bar {

  display: flex !important;

  align-items: center !important;

  justify-content: space-between !important;

  background: #14171d !important;

  border: 1px solid var(--line) !important;

  border-radius: 14px !important;

  padding: 6px 10px !important;

  margin-bottom: 22px !important;

  flex-wrap: wrap !important;

  gap: 8px !important;

}



.account-nav-bar .nav-group {

  display: flex;

  align-items: center;

  gap: 4px;

  flex-wrap: wrap;

}



.account-nav-bar .nav-group-label {

  font-size: 11px;

  text-transform: uppercase;

  letter-spacing: 0.05em;

  color: var(--muted);

  font-weight: 700;

  padding: 0 10px 0 6px;

  user-select: none;

}



.account-nav-bar .nav-group-sep {

  width: 1px;

  height: 22px;

  background: var(--line-strong);

  margin: 0 6px;

}



.account-nav-bar .nav-tab {

  background: transparent !important;

  border: 1px solid transparent !important;

  color: var(--muted) !important;

  font-size: 13px !important;

  font-weight: 600 !important;

  padding: 7px 14px !important;

  border-radius: 9px !important;

  cursor: pointer !important;

  font-family: inherit !important;

  text-decoration: none !important;

  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  transition: all 0.15s ease !important;

  white-space: nowrap !important;

  min-height: auto !important;

  box-shadow: none !important;

}



.account-nav-bar .nav-tab:hover {

  color: #fff !important;

  background: rgba(255, 255, 255, 0.05) !important;

  border-color: transparent !important;

}



.account-nav-bar .nav-tab.active {

  background: #1e242e !important;

  color: #fff !important;

  border-color: rgba(255, 255, 255, 0.14) !important;

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;

}



.account-nav-bar .nav-tab.active.sale {

  border-color: rgba(93, 219, 165, 0.35) !important;

  color: #5ddba5 !important;

}



.account-nav-bar .nav-tab.active.bulk {

  border-color: rgba(192, 132, 252, 0.35) !important;

  color: #c084fc !important;

}



@media (max-width: 768px) {

  .account-nav-bar {

    flex-direction: column !important;

    align-items: stretch !important;

    gap: 8px !important;

    padding: 8px !important;

  }

  .account-nav-bar .nav-group-sep {

    width: 100% !important;

    height: 1px !important;

    margin: 4px 0 !important;

  }

  .account-nav-bar .nav-group {

    justify-content: flex-start !important;

    overflow-x: auto !important;

    scrollbar-width: none !important;

    padding-bottom: 2px !important;

  }

  .account-nav-bar .nav-group::-webkit-scrollbar {

    display: none !important;

  }

}





/* ========================================================

   MINIMAL UNDERLINE TABS BAR WITH ICONS (VARIANT 3A)

   ======================================================== */

.account-tabs.underline-tabs-bar {

  display: flex !important;

  gap: 22px !important;

  border-bottom: 1px solid var(--line) !important;

  background: transparent !important;

  border-radius: 0 !important;

  padding: 0 4px !important;

  margin-bottom: 22px !important;

  overflow-x: auto !important;

  scrollbar-width: none !important;

  box-shadow: none !important;

  border-top: none !important;

  border-left: none !important;

  border-right: none !important;

}



.account-tabs.underline-tabs-bar::-webkit-scrollbar {

  display: none !important;

}



.account-tabs.underline-tabs-bar .u-tab {

  background: transparent !important;

  border: none !important;

  color: var(--muted) !important;

  font-size: 13.5px !important;

  font-weight: 600 !important;

  padding: 10px 4px 13px !important;

  cursor: pointer !important;

  font-family: inherit !important;

  position: relative !important;

  white-space: nowrap !important;

  display: inline-flex !important;

  align-items: center !important;

  gap: 8px !important;

  transition: all 0.15s ease !important;

  text-decoration: none !important;

  box-shadow: none !important;

  border-radius: 0 !important;

  min-height: auto !important;

}



.account-tabs.underline-tabs-bar .u-tab svg {

  width: 15px !important;

  height: 15px !important;

  color: var(--muted) !important;

  transition: color 0.15s ease, transform 0.15s ease !important;

  flex-shrink: 0 !important;

}



.account-tabs.underline-tabs-bar .u-tab:hover {

  color: #fff !important;

  background: transparent !important;

}



.account-tabs.underline-tabs-bar .u-tab:hover svg {

  color: #fff !important;

  transform: translateY(-1px) !important;

}



.account-tabs.underline-tabs-bar .u-tab.active {
  color: #58a6ff !important;
  background: transparent !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

.account-tabs.underline-tabs-bar .u-tab.active svg {
  color: #58a6ff !important;
}

.account-tabs.underline-tabs-bar .u-tab.active::after {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: #58a6ff !important;
  border-radius: 2px 2px 0 0 !important;
  box-shadow: 0 0 6px rgba(88, 166, 255, 0.35) !important;
}

/* ========================================================
   AUTOBUY CONTROL CENTER HUB (CONCEPT 1)
   ======================================================== */
.autobuy-container {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.badge-status {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  vertical-align: middle;
}
.badge-status.active {
  background: rgba(93, 219, 165, 0.14);
  color: #5ddba5;
  border: 1px solid rgba(93, 219, 165, 0.3);
}
.badge-status.paused {
  background: rgba(251, 191, 36, 0.14);
  color: #fbbf24;
  border: 1px solid rgba(251, 191, 36, 0.3);
}
.badge-status.off {
  background: rgba(148, 163, 184, 0.12);
  color: #94a3b8;
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.autobuy-control-hero {
  background: var(--card-bg, #14171d);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
}

.autobuy-hero-left {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.autobuy-status-ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.autobuy-status-ico svg {
  width: 22px;
  height: 22px;
}
.autobuy-status-ico.active {
  background: rgba(93, 219, 165, 0.12);
  color: #5ddba5;
  border: 1px solid rgba(93, 219, 165, 0.25);
}
.autobuy-status-ico.paused {
  background: rgba(251, 191, 36, 0.12);
  color: #fbbf24;
  border: 1px solid rgba(251, 191, 36, 0.25);
}
.autobuy-status-ico.off {
  background: rgba(148, 163, 184, 0.12);
  color: #94a3b8;
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.autobuy-hero-titles h2 {
  font-size: 19px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 6px 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.autobuy-hero-meta {
  font-size: 13px;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.autobuy-hero-meta strong {
  color: #e2e8f0;
}

.autobuy-label-badge {
  background: rgba(99, 102, 241, 0.14);
  color: #818cf8;
  border: 1px solid rgba(99, 102, 241, 0.3);
  padding: 2px 7px;
  border-radius: 5px;
  font-size: 11.5px;
  font-weight: 600;
}

.autobuy-hero-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.btn-site-ghost {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--line);
  color: #e2e8f0;
  padding: 8px 14px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  font-family: inherit;
  transition: all 0.15s ease;
}
.btn-site-ghost:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
}

.btn-site-danger {
  background: rgba(248, 113, 113, 0.08);
  border: 1px solid rgba(248, 113, 113, 0.25);
  color: #f87171;
  padding: 8px 14px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s ease;
}
.btn-site-danger:hover {
  background: rgba(248, 113, 113, 0.18);
  border-color: rgba(248, 113, 113, 0.5);
  color: #fff;
}

.autobuy-pause-alert {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: rgba(251, 191, 36, 0.1) !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  color: #fbbf24 !important;
  padding: 12px 18px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}

.autobuy-alert-ico {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
  color: #fbbf24 !important;
}

.autobuy-card {
  background: var(--card-bg, #14171d);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px 22px;
}

.autobuy-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.autobuy-card-filters-head {
  margin-top: 10px;
}

.autobuy-card-head h2,
.autobuy-card-head h3 {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.autobuy-card-head span {
  font-size: 12px;
  color: var(--muted);
}

.autobuy-fields-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 14px;
}

@media (max-width: 768px) {
  .autobuy-fields-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

.autobuy-choice-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 11px 16px;
  margin-bottom: 14px;
}

.autobuy-choice-label {
  font-size: 13px;
  color: #cbd5e1;
  font-weight: 500;
}

.autobuy-dating-choice {
  margin: 0 !important;
}

.autobuy-save-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
  gap: 12px;
}

.autobuy-save-note {
  font-size: 12px;
  color: var(--muted);
}

.autobuy-empty-box {
  text-align: center;
  padding: 50px 24px;
  background: var(--card-bg, #14171d);
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  margin-top: 8px;
}

.autobuy-empty-ico {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--muted);
  display: grid;
  place-items: center;
  margin: 0 auto 16px;
}
.autobuy-empty-ico svg {
  width: 26px;
  height: 26px;
}

.autobuy-empty-box h2 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

.autobuy-empty-box p {
  font-size: 13.5px;
  color: var(--muted);
  max-width: 480px;
  margin: 0 auto 22px;
  line-height: 1.5;
}

.autobuy-items-section {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.autobuy-items-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding-bottom: 0;
}

.autobuy-items-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.autobuy-items-title h2 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.autobuy-items-sub {
  font-size: 12.5px;
  color: var(--muted);
}
.autobuy-filters-title-group {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.autobuy-filters-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.btn-site-ghost.btn-sm {
  padding: 4px 10px !important;
  font-size: 12px !important;
  border-radius: 7px !important;
}
.autobuy-reset-btn {
  color: var(--muted) !important;
}
.autobuy-reset-btn:hover {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}
.autobuy-tg-card {
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 13px 16px;
  margin-bottom: 14px;
}

.autobuy-tg-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 6px;
}

.autobuy-tg-title {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
}

.autobuy-tg-title svg {
  color: #38bdf8;
}

.autobuy-tg-sub {
  font-size: 11.5px;
  color: var(--muted);
}

.autobuy-tg-fields {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 12px;
  align-items: flex-end;
}

@media (max-width: 768px) {
  .autobuy-tg-fields {
    grid-template-columns: 1fr;
  }
}

.autobuy-tg-btn-wrap {
  padding-bottom: 2px;
}

.autobuy-tg-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.autobuy-tg-hint {
  font-size: 11.5px;
  color: var(--muted);
}
.autobuy-tg-hint code {
  color: #38bdf8;
  background: rgba(56, 189, 248, 0.1);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 11px;
}

.tg-test-status {
  font-size: 12px;
  font-weight: 500;
  padding: 3px 9px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.tg-test-status.is-ok {
  background: rgba(93, 219, 165, 0.14);
  color: #5ddba5;
  border: 1px solid rgba(93, 219, 165, 0.3);
}
.tg-test-status.is-error {
  background: rgba(248, 113, 113, 0.14);
  color: #f87171;
  border: 1px solid rgba(248, 113, 113, 0.3);
}
.tg-test-status.is-loading {
  background: rgba(148, 163, 184, 0.12);
  color: #cbd5e1;
  border: 1px solid rgba(148, 163, 184, 0.2);
}


/* ==========================================================================
   Profile Settings Redesign (Variant 1: System Tabs)
   ========================================================================== */

/* ========================================================
   PROFILE / SETTINGS (CABINET THEME MATCHING)
   ======================================================== */
.cab-container.profile-settings-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 40px;
}

.cab-hero-stats {
  display: flex;
  align-items: center;
  gap: 12px;
}

.cab-stat-item {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 18px;
  text-align: center;
  min-width: 90px;
}

.cab-stat-val {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  display: block;
  font-variant-numeric: tabular-nums;
}

.cab-stat-lbl {
  font-size: 11.5px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 3px;
  display: block;
}

.profile-settings-page .account-tabs.underline-tabs-bar {
  margin-bottom: 4px;
}

.profile-tab-pane {
  display: none;
}

.profile-tab-pane.active {
  display: block;
}

.cab-section-narrow {
  max-width: 600px;
}

.cab-section-body {
  padding: 22px 24px;
}

.cab-section-body > form.cab-form,
form.cab-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cab-section-body label {
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: 13px;
  color: var(--muted);
  font-weight: 500;
}

.cab-section-body input[type="text"],
.cab-section-body input[type="password"],
.cab-section-body textarea {
  background: #0d1016;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  padding: 11px 14px;
  color: #fff;
  font-size: 13.5px;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.cab-section-body input:focus,
.cab-section-body textarea:focus {
  border-color: #58a6ff;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.2);
}

.cab-form-action {
  margin-top: 4px;
}

.profile-subtabs {
  border-bottom: none !important;
  margin-bottom: 0 !important;
  gap: 14px !important;
}

.profile-subtabs .profile-subtab-pill {
  padding: 6px 4px 8px !important;
  font-size: 13px !important;
}

.profile-subtabs .profile-subtab-pill.active::after {
  bottom: -2px !important;
}

.profile-subtab-pane {
  display: none;
}

.profile-subtab-pane.active {
  display: block;
}

.profile-add-user-form {
  margin: 14px 0 18px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  max-width: 460px !important;
}

.profile-add-user-form input[type="text"],
.profile-add-user-form input {
  flex: 1 !important;
  min-width: 0 !important;
  height: 40px !important;
  background: #0d1016 !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: 10px !important;
  padding: 0 14px !important;
  color: #fff !important;
  font-size: 13.5px !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
}

.profile-add-user-form input:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.2) !important;
}

.profile-add-user-form .btn {
  flex-shrink: 0 !important;
  height: 40px !important;
  padding: 0 20px !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
}

.people form,
.proxy-list form {
  margin: 0 !important;
  flex: none !important;
  display: inline-flex !important;
  gap: 0 !important;
}

.profile-display-form {
  margin-top: 18px;
}

.profile-display-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
}

.display-toggle-group {
  display: inline-flex !important;
  align-items: center !important;
  background: #0d1016 !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: 12px !important;
  padding: 4px !important;
  gap: 4px !important;
  box-sizing: border-box !important;
  height: 42px !important;
}

.display-toggle-opt {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  margin: 0 !important;
  user-select: none !important;
  position: relative !important;
  transition: all 0.15s ease !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.display-toggle-opt input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
}

.display-toggle-opt:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

.display-toggle-opt:has(input:checked),
.display-toggle-opt.is-active {
  background: rgba(88, 166, 255, 0.16) !important;
  border-color: rgba(88, 166, 255, 0.45) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  box-shadow: 0 0 12px rgba(88, 166, 255, 0.25) !important;
}

.display-toggle-txt {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  line-height: 1 !important;
}

.display-toggle-txt .toggle-ico {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
}

.display-save-btn {
  height: 42px !important;
  padding: 0 24px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  border-radius: 12px !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

.list-pane-hint {
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 13px;
}

.account-tabs.underline-tabs-bar .u-tab .badge-count {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 1px 7px !important;
  border-radius: 10px !important;
  background: var(--fill-mid) !important;
  color: var(--muted) !important;
  border: 1px solid var(--line) !important;
  line-height: 1.3 !important;
}

.account-tabs.underline-tabs-bar .u-tab.active .badge-count {
  background: rgba(88, 166, 255, 0.15) !important;
  color: #58a6ff !important;
  border-color: rgba(88, 166, 255, 0.4) !important;
}


/* =========================================================
   PREMIUM SELL REDESIGN (MATCHING GENERAL MARKET PALETTE)
   ========================================================= */
.sell-premium-box {
  width: min(820px, 100%) !important;
  margin-inline: auto !important;
  background: var(--card-bg, #14171d) !important;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08)) !important;
  border-radius: 20px !important;
  padding: 30px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.35) !important;
}

.sell-premium-box .sell-hero {
  border-bottom: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  padding-bottom: 20px;
}
.sell-premium-box .sell-hero h1 {
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.02em;
}

.sell-form-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sell-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sell-section-title {
  font-size: 13.5px;
  font-weight: 600;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.sell-section-title svg {
  color: #58a6ff;
  width: 16px;
  height: 16px;
}
.sell-section-hint {
  font-size: 12px;
  color: var(--muted);
}
.sell-commission-pill {
  font-size: 11.5px;
  font-weight: 600;
  color: #5ddba5;
  background: rgba(93, 219, 165, 0.1);
  border: 1px solid rgba(93, 219, 165, 0.25);
  padding: 2px 8px;
  border-radius: 6px;
}

/* 1. Origin Grid */
.sell-origin-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}
.sell-origin-item {
  position: relative;
  cursor: pointer;
  margin: 0;
  user-select: none;
}
.sell-origin-item input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.sell-origin-btn {
  height: 42px;
  border-radius: 11px;
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  transition: all 0.15s ease;
}
.sell-origin-item:hover .sell-origin-btn {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.15);
  color: #fff;
}
.sell-origin-item input:checked + .sell-origin-btn {
  background: rgba(88, 166, 255, 0.12);
  border-color: rgba(88, 166, 255, 0.38);
  color: #fff;
  font-weight: 600;
  box-shadow: none;
}
.sell-origin-item input:checked + .sell-origin-btn svg {
  color: #58a6ff;
}

/* 2. Quality Status Cards (Fintech Style) */
.sell-status-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.sell-status-card {
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  border-radius: 14px;
  padding: 15px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: border-color 0.15s ease;
}
.sell-status-card:hover {
  border-color: rgba(255, 255, 255, 0.12);
}
.sell-status-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sell-icon-box {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.sell-icon-box.blue {
  background: rgba(88, 166, 255, 0.08);
  color: #58a6ff;
  border: 1px solid rgba(88, 166, 255, 0.2);
}
.sell-icon-box.emerald {
  background: rgba(93, 219, 165, 0.08);
  color: #5ddba5;
  border: 1px solid rgba(93, 219, 165, 0.2);
}
.sell-card-labels {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.sell-card-title {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}
.sell-card-subtitle {
  font-size: 11.5px;
  color: var(--muted);
}

/* Dual Pill Toggle */
.sell-dual-pill {
  display: flex;
  background: #14171d;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  border-radius: 9px;
  padding: 3px;
  height: 36px;
}
.sell-dual-pill.format-pill {
  width: 240px;
  height: 34px;
}
.sell-pill-label {
  flex: 1;
  margin: 0;
  cursor: pointer;
  display: block;
  user-select: none;
  position: relative;
}
.sell-pill-label input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.sell-pill-btn {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
  transition: all 0.15s ease;
  border: 1px solid transparent;
}
.sell-pill-label:hover .sell-pill-btn {
  color: #fff;
}
.sell-pill-label input:checked + .sell-pill-btn {
  background: rgba(88, 166, 255, 0.14);
  color: #fff;
  font-weight: 600;
  border-color: rgba(88, 166, 255, 0.35);
  box-shadow: none;
}
.sell-pill-label input:checked + .sell-pill-btn svg {
  color: #58a6ff;
}

/* 3. Price Strip */
.sell-price-strip {
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  border-radius: 14px;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.sell-price-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.sell-price-headings {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.sell-price-title {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}
.sell-price-desc {
  font-size: 11.5px;
  color: var(--muted);
}
.sell-price-input-holder {
  position: relative;
  width: 150px;
}
.sell-price-native-input {
  width: 100%;
  height: 40px;
  background: #14171d !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 9px !important;
  padding: 0 34px 0 12px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #fff !important;
  outline: none !important;
  transition: border-color 0.15s ease !important;
}
.sell-price-native-input:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.18) !important;
}
.sell-price-sym {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
  pointer-events: none;
}

/* 4. Dropzone */
.sell-dropzone {
  border: 1.5px dashed rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.015);
  border-radius: 14px;
  padding: 24px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  text-align: center;
  transition: all 0.15s ease;
  width: 100%;
}
.sell-dropzone:hover,
.sell-dropzone.is-dragover {
  border-color: #58a6ff;
  background: rgba(88, 166, 255, 0.03);
}
.sell-drop-bubble {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #14171d;
  color: #58a6ff;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  display: grid;
  place-items: center;
  margin-bottom: 2px;
}
.sell-drop-main {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}
.sell-drop-sub {
  font-size: 11.5px;
  color: var(--muted);
}

/* 5. Footer Bar */
.sell-footer-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  gap: 16px;
}
.sell-footer-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--muted);
}
.sell-footer-meta strong {
  color: #fff;
}
.sell-footer-meta .highlight-val {
  color: #58a6ff;
}
.sell-dot-separator {
  color: var(--muted);
  opacity: 0.5;
}
.sell-publish-btn {
  height: 44px !important;
  padding: 0 24px !important;
  border-radius: 11px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, rgba(93, 219, 165, 0.22) 0%, rgba(93, 219, 165, 0.12) 100%) !important;
  border: 1px solid rgba(93, 219, 165, 0.4) !important;
  color: #d1fae5 !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  transition: all 0.15s ease !important;
}
.sell-publish-btn:hover {
  background: rgba(93, 219, 165, 0.3) !important;
  border-color: rgba(93, 219, 165, 0.65) !important;
  color: #fff !important;
}

/* SVG icons normalization */
.sell-premium-box svg.ico {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}

.sell-premium-box .sell-pill-btn svg.ico {
  width: 13px !important;
  height: 13px !important;
}

.sell-premium-box .sell-icon-box svg.ico,
.sell-premium-box .sell-drop-bubble svg.ico {
  width: 18px !important;
  height: 18px !important;
}


/* ================= MODERN FILTER BOARD REDESIGN ================= */
.board {
  background: #14171d !important;
  background: linear-gradient(180deg, #161920 0%, #121419 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  padding: 22px 24px 20px !important;
}

.filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.board.is-collapsed .filter-head {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
}

.filter-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #8b929e !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: all 0.15s ease !important;
}

button.filter-icon:hover,
.board.is-collapsed button.filter-icon {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #e6edf3 !important;
}

.filter-head h2 {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em;
  margin: 0 !important;
}

.filter-head p {
  font-size: 12.5px !important;
  color: #8b929e !important;
  margin: 3px 0 0 0 !important;
}

.filter-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.filter-active-badge {
  background: rgba(88, 166, 255, 0.14) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #79b8ff !important;
  padding: 2px 9px !important;
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.filter-sections {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
}

.filter-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.filter-section-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 2px !important;
}

.filter-section-title {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #8b929e !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.filter-section-title svg {
  width: 14px !important;
  height: 14px !important;
  color: #58a6ff !important;
  flex-shrink: 0;
}

.filter-section-line {
  flex: 1 !important;
  height: 1px !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

/* Labels and captions inside filter grid */
.filter-grid label,
.filter-grid .filter-caption {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  margin-bottom: 2px !important;
}

/* Text and numeric inputs */
.filter-grid input[type="text"],
.filter-grid input[type="date"],
.filter-grid input:not([type]),
.filter-grid .city-filter input,
.filter-grid .range input {
  height: 38px !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  color: #f0f6fc !important;
  font-size: 13px !important;
  padding: 0 11px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

.filter-grid input::placeholder {
  color: #525866 !important;
  font-size: 12.5px !important;
}

.filter-grid input:focus,
.filter-grid .city-filter input:focus {
  background: rgba(14, 16, 20, 0.95) !important;
  border-color: rgba(88, 166, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
  outline: none !important;
}

/* Dropdown triggers */
.filter-grid .multi-select-trigger {
  height: 38px !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  padding: 0 11px !important;
  font-size: 13px !important;
  color: #f0f6fc !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

.filter-grid .multi-select-trigger:hover {
  background: rgba(18, 21, 27, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.filter-grid .multi-select-trigger[aria-expanded="true"] {
  border-color: rgba(88, 166, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
}

.filter-grid .multi-select-caret {
  opacity: 0.6;
}

/* Dropdown menus */
.filter-grid .multi-select-menu {
  background: #15181f !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
  padding: 5px !important;
  z-index: 50 !important;
}

.filter-grid .multi-select-option {
  padding: 7px 10px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  color: #cbd5e1 !important;
  transition: background 0.12s ease, color 0.12s ease !important;
}

.filter-grid .multi-select-option:hover {
  background: rgba(88, 166, 255, 0.1) !important;
  color: #fff !important;
}

.filter-grid .multi-select-option:has(input:checked) {
  background: rgba(88, 166, 255, 0.14) !important;
  color: #79b8ff !important;
  font-weight: 600 !important;
}

.filter-grid .multi-select-check {
  color: #58a6ff !important;
}

/* Segmented Choice Sets (Toggles: Да / Нет) */
.filter-grid .filter-choice .choice-set {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  height: 38px !important;
  padding: 0 !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  position: relative !important;
  transition: none !important;
}

.filter-grid .filter-choice .choice-set label {
  display: flex !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  position: relative !important;
  box-sizing: border-box !important;
  transition: none !important;
}

.filter-grid .filter-choice .choice-set label + label {
  box-shadow: none !important;
}

/* Center divider line */
.filter-grid .filter-choice .choice-set label + label::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 1px !important;
  height: 18px !important;
  background: rgba(255, 255, 255, 0.16) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Hide divider when either side is checked or hovered so there are no strange blue/faint lines */
.filter-grid .filter-choice .choice-set:has(input:checked) label + label::before,
.filter-grid .filter-choice .choice-set:has(label:hover) label + label::before {
  display: none !important;
}

.filter-grid .filter-choice .choice-set span {
  flex: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 10px !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  user-select: none !important;
  box-shadow: none !important;
  transition: color 0.12s ease, background-color 0.12s ease !important;
  box-sizing: border-box !important;
}

.filter-grid .filter-choice .choice-set label:hover span {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #e6edf3 !important;
}

/* Selected option: smooth zero-jitter background fill */
.filter-grid .filter-choice .choice-set input:checked + span,
.filter-grid .filter-choice .choice-set label:hover input:checked + span {
  background: rgba(88, 166, 255, 0.16) !important;
  color: #79b8ff !important;
  font-weight: 500 !important;
  box-shadow: none !important;
  border: none !important;
}

.filter-grid .filter-choice .choice-set label:has(input:checked),
.filter-grid .filter-choice .choice-set label:has(input:checked) + label {
  box-shadow: none !important;
}

/* Filter Foot & Buttons */
.filter-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-top: 20px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.filter-links {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.filter-links button {
  display: inline-flex !important;
  align-items: center !important;
  height: 36px !important;
  padding: 0 13px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 9px !important;
  color: #8b929e !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.filter-links button:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #e6edf3 !important;
}

.filter-search {
  height: 40px !important;
  padding: 0 22px !important;
  border-radius: 10px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, rgba(88, 166, 255, 0.22) 0%, rgba(88, 166, 255, 0.12) 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.45) !important;
  color: #dbeafe !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  transition: all 0.15s ease !important;
}

.filter-search:hover {
  background: rgba(88, 166, 255, 0.3) !important;
  border-color: rgba(88, 166, 255, 0.7) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(88, 166, 255, 0.25) !important;
}

/* Reset button styling */
.filter-head > .btn {
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #8b929e !important;
  transition: all 0.15s ease !important;
}

.filter-head > .btn:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #e6edf3 !important;
}

.filter-reset-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #8b929e !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.filter-reset-btn:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #f0f6fc !important;
}


/* Filter Header Actions & Compact Layout (Option 1) */
.filter-head-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.filter-action-btn,
.filter-reset-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #8b929e !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
}

.filter-action-btn:hover,
.filter-reset-btn:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #f0f6fc !important;
}

.filter-action-btn svg,
.filter-reset-btn svg {
  flex-shrink: 0 !important;
  width: 14px !important;
  height: 14px !important;
}

@media (max-width: 820px) {
  .filter-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .filter-head-actions {
    width: 100% !important;
    justify-content: flex-start !important;
  }
}


/* ================= MODERN ACCOUNT CARD REDESIGN (STEP 2) ================= */
.listing-row {
  background: #14171d !important;
  background: linear-gradient(180deg, #15181f 0%, #121419 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 14px !important;
  padding: 14px 18px !important;
  margin-bottom: 8px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22) !important;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
}

@media (hover: hover) and (pointer: fine) {
  .listing-row:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(88, 166, 255, 0.3) !important;
    background: linear-gradient(180deg, #181c24 0%, #14161c 100%) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(88, 166, 255, 0.12) !important;
  }
}

/* VK Badge on the left */
.lot-vk {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: rgba(0, 119, 255, 0.1) !important;
  border: 1px solid rgba(0, 119, 255, 0.22) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #58a6ff !important;
  flex-shrink: 0 !important;
  transition: transform 0.15s ease, background 0.15s ease !important;
}

.listing-row:hover .lot-vk {
  background: rgba(0, 119, 255, 0.16) !important;
  border-color: rgba(0, 119, 255, 0.35) !important;
  transform: scale(1.04) !important;
}

.lot-vk-split {
  width: 1px !important;
  height: 28px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  flex-shrink: 0 !important;
  margin: 0 2px !important;
}

/* Chips container */
.account-body .chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px 6px !important;
  align-items: center !important;
}

/* Base chip styling */
.chip {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 2px 8px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.025) !important;
  color: #c9d1d9 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  transition: all 0.15s ease !important;
}

.chip:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

/* Specific Origin Badges */
.chip.origin-brut {
  background: rgba(245, 158, 11, 0.1) !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
  color: #fcd34d !important;
  font-weight: 600 !important;
}

.chip.origin-autoreg {
  background: rgba(168, 85, 247, 0.1) !important;
  border-color: rgba(168, 85, 247, 0.28) !important;
  color: #d8b4fe !important;
  font-weight: 600 !important;
}

.chip.origin-phish {
  background: rgba(239, 68, 68, 0.1) !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
  font-weight: 600 !important;
}

.chip.origin-logs {
  background: rgba(59, 130, 246, 0.1) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
  color: #93c5fd !important;
  font-weight: 600 !important;
}

.chip.origin-own {
  background: rgba(16, 185, 129, 0.1) !important;
  border-color: rgba(16, 185, 129, 0.28) !important;
  color: #6ee7b7 !important;
  font-weight: 600 !important;
}

/* Positive / Negative / Safety Status chips */
.chip.good {
  background: rgba(93, 219, 165, 0.08) !important;
  border-color: rgba(93, 219, 165, 0.24) !important;
  color: #5ddba5 !important;
  font-weight: 600 !important;
}

.chip.warn {
  background: rgba(239, 68, 68, 0.08) !important;
  border-color: rgba(239, 68, 68, 0.24) !important;
  color: #f87171 !important;
  font-weight: 600 !important;
}

/* Chip icon styling */
.chip-ico {
  width: 13px !important;
  height: 13px !important;
  margin-right: 5px !important;
  flex-shrink: 0 !important;
}

/* Account Foot / Meta row */
.account-foot {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
  color: #8b929e !important;
}

.foot-dot {
  color: rgba(255, 255, 255, 0.18) !important;
}

.foot-time {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #6e7681 !important;
}

.foot-ico {
  width: 12px !important;
  height: 12px !important;
  opacity: 0.7 !important;
}

.card-vk-link a {
  color: #58a6ff !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

.card-vk-link a:hover {
  text-decoration: underline !important;
}

/* Right Side: Price & Actions */
.account-side {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-width: 130px !important;
}

.side-top {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.account-side .price {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.02em !important;
  transition: color 0.15s ease !important;
}

.listing-row:hover .account-side .price {
  color: #ffffff !important;
}

.fav {
  width: auto !important;
  height: auto !important;
  min-width: unset !important;
  min-height: unset !important;
  padding: 4px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #6e7681 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: color 0.15s ease, transform 0.15s ease !important;
}

.fav svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
}

.fav:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #ff6b8a !important;
  transform: scale(1.15);
}

.fav.is-on {
  color: #ff6b8a !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Buy button on card - clean flat modern */
.listing-row .account-side .btn.buy {
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: rgba(88, 166, 255, 0.1) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  color: #c9e6ff !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
}

.listing-row .account-side .btn.buy:hover {
  background: rgba(88, 166, 255, 0.2) !important;
  border-color: rgba(88, 166, 255, 0.45) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}


/* ================= MODERN LOT PREVIEW MODAL REDESIGN ================= */
.lot-preview {
  width: min(560px, calc(100vw - 24px)) !important;
  max-height: min(860px, calc(100vh - 24px)) !important;
  padding: 26px 24px 22px !important;
  background: #14171d !important;
  background: linear-gradient(180deg, #161920 0%, #121418 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  color: #f0f6fc !important;
}

.lot-preview::backdrop {
  background: rgba(8, 9, 10, 0.72) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

.lot-preview-close {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 5 !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  color: #8b929e !important;
  font-size: 18px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.lot-preview-close:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}

/* ================= MODERN LOT PAGE (PREMIUM MARKET STYLE) ================= */
.center-block.lot-body {
  width: min(680px, 100%) !important;
  margin: 24px auto 40px !important;
  background: var(--card-bg, #14171d) !important;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08)) !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.35) !important;
  padding: 26px 26px 24px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.lot-preview .lot-body.center-block {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.lot-body .lot-modal-head,
.lot-modal-head {
  margin-bottom: 18px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
  text-align: center !important;
}

.lot-body .empty {
  display: inline-block !important;
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 12px !important;
  padding: 10px 18px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  margin: 14px auto !important;
  text-align: center !important;
}

.lot-body .lot-seller {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 9999px !important;
  padding: 6px 14px !important;
  font-size: 12.5px !important;
  color: #8b929e !important;
  margin: 14px auto 0 !important;
}
.lot-body .lot-seller a {
  color: #f0f6fc !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.lot-body .lot-seller a:hover {
  text-decoration: underline !important;
  color: #58a6ff !important;
}

.lot-body [data-web-login-box] {
  margin-top: 14px !important;
}
.lot-body [data-web-login-box] .order-actions {
  display: flex !important;
  justify-content: center !important;
  margin: 0 auto !important;
}
.lot-body [data-web-login-box] .btn.ghost {
  height: 40px !important;
  padding: 0 16px !important;
  border-radius: 11px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f0f6fc !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: all 0.15s ease !important;
}
.lot-body [data-web-login-box] .btn.ghost:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

.lot-body .history {
  margin-top: 24px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
  text-align: left !important;
}
.lot-body .history h2 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 12px !important;
}
.lot-body .history ul {
  display: grid !important;
  gap: 8px !important;
}
.lot-body .history li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 11px !important;
  font-size: 13px !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}
.lot-body .history li:hover {
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}
.lot-body .history time {
  color: #6e7681 !important;
  font-size: 12px !important;
  min-width: 95px !important;
}
.lot-body .history .price {
  color: #2bd576 !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  font-variant-numeric: tabular-nums !important;
  min-width: 48px !important;
}

@media (max-width: 560px) {
  .center-block.lot-body {
    margin: 12px auto 28px !important;
    padding: 18px 14px 18px !important;
    border-radius: 16px !important;
  }
  .lot-body .history li {
    padding: 8px 10px !important;
    font-size: 12px !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
}

.lot-modal-head h1 {
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.lot-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px 7px !important;
  margin-bottom: 16px !important;
}

.lot-preview .lot-buyline,
.center-block .lot-buyline {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 14px 0 16px !important;
}

.lot-preview .price.price-lg,
.center-block .price.price-lg {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
}

.lot-preview .fav,
.center-block .fav {
  width: auto !important;
  height: auto !important;
  min-width: unset !important;
  min-height: unset !important;
  padding: 4px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #8b929e !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: color 0.15s ease, transform 0.15s ease !important;
}

.lot-preview .fav svg,
.center-block .fav svg {
  width: 24px !important;
  height: 24px !important;
}

.lot-preview .fav:hover,
.center-block .fav:hover {
  background: transparent !important;
  border: none !important;
  color: #ff6b8a !important;
  transform: scale(1.15);
}

.lot-preview .fav.is-on,
.center-block .fav.is-on {
  color: #ff6b8a !important;
  background: transparent !important;
  border: none !important;
}

.lot-preview .btn.buy,
.lot-preview .btn-center-buy,
.lot-body .btn-center-buy,
.lot-main-cta .btn.buy {
  width: min(280px, 100%) !important;
  height: 42px !important;
  padding: 0 20px !important;
  border-radius: 9px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  background: rgba(88, 166, 255, 0.14) !important;
  border: 1px solid rgba(88, 166, 255, 0.32) !important;
  color: #dbeafe !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
}

.lot-preview .btn.buy:hover,
.lot-preview .btn-center-buy:hover,
.lot-body .btn-center-buy:hover,
.lot-main-cta .btn.buy:hover {
  background: rgba(88, 166, 255, 0.24) !important;
  border-color: rgba(88, 166, 255, 0.55) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.lot-seller {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 14px 0 16px !important;
  font-size: 13px !important;
  color: #8b929e !important;
}

.lot-seller .seller-avatar {
  width: 22px !important;
  height: 22px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 50% !important;
}

.lot-seller .seller-nick,
.lot-seller .seller {
  color: #f0f6fc !important;
  font-weight: 600 !important;
}

.lot-seller .seller:hover {
  color: #58a6ff !important;
}

.order-follow .btn.ghost.small,
[data-web-login-box] .btn.ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 38px !important;
  padding: 0 18px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 9px !important;
  color: #cbd5e1 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.order-follow .btn.ghost.small:hover,
[data-web-login-box] .btn.ghost:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}

.lot-preview .history,
.lot-body .history {
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  text-align: left !important;
}

.lot-preview .history h2,
.lot-body .history h2 {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  margin-bottom: 12px !important;
  padding-bottom: 0 !important;
  border-bottom: none !important;
}

.lot-preview .history ul,
.lot-body .history ul {
  display: grid !important;
  gap: 8px !important;
}

.lot-preview .history li,
.lot-body .history li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 9px !important;
  font-size: 13px !important;
}

.lot-preview .history time,
.lot-body .history time {
  color: #6e7681 !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

.lot-preview .history .price,
.lot-body .history .price {
  color: #f0f6fc !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  white-space: nowrap !important;
}

.lot-preview .history span,
.lot-body .history span {
  color: #8b929e !important;
}

.lot-preview .history span a,
.lot-body .history span a {
  color: #58a6ff !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

.lot-preview .history span a:hover,
.lot-body .history span a:hover {
  text-decoration: underline !important;
}


/* ================= MODERN BOARD-BAR (BORDERLESS & COMPACT) ================= */
.board-bar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 16px 2px 14px !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.board-bar strong {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.board-bar strong::before {
  content: "" !important;
  width: 17px !important;
  height: 17px !important;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2358a6ff' stroke-width='2'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='16.5' cy='9' r='2.5'/%3E%3Cpath d='M3.5 19c.6-2.8 2.8-4.2 5.5-4.2S14 16.2 14.5 19M14 15.2c1.5-.7 3.2-.7 4.8.2.9.5 1.5 1.4 1.8 2.6'/%3E%3C/svg%3E") !important;
  opacity: 0.9 !important;
}

.board-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Secondary Action: Настроить автоскупку */
#autobuy-nav-btn {
  width: auto !important;
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 14px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: rgba(255, 255, 255, 0.035) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  color: #c9d1d9 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
}

#autobuy-nav-btn svg {
  width: 14px !important;
  height: 14px !important;
  color: #58a6ff !important;
  flex-shrink: 0 !important;
}

#autobuy-nav-btn:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(88, 166, 255, 0.4) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* Primary Action: Массовая покупка - clean flat */
#bulk-buy {
  width: auto !important;
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: rgba(88, 166, 255, 0.1) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  color: #dbeafe !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
  white-space: nowrap !important;
}

#bulk-buy svg {
  width: 14px !important;
  height: 14px !important;
  color: #58a6ff !important;
  flex-shrink: 0 !important;
}

#bulk-buy:hover {
  background: rgba(88, 166, 255, 0.2) !important;
  border-color: rgba(88, 166, 255, 0.45) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 640px) {
  .board-bar {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }
  .board-actions {
    width: 100% !important;
    justify-content: flex-start !important;
  }
}


/* ================= MODERN HEADER (TOP BAR) REDESIGN ================= */
.top {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: rgba(16, 18, 20, 0.85) !important;
  backdrop-filter: blur(16px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
  transition: all 0.2s ease !important;
}

.top-inner {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 18px !important;
  min-height: 60px !important;
}

/* Brand */
.brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  transition: opacity 0.15s ease !important;
}

.brand:hover {
  opacity: 0.9 !important;
}

.brand .vk-mark {
  width: 24px !important;
  height: 14px !important;
  color: #58a6ff !important;
  filter: drop-shadow(0 0 6px rgba(88, 166, 255, 0.35)) !important;
  transition: transform 0.15s ease !important;
}

.brand:hover .vk-mark {
  transform: scale(1.06) !important;
}

.brand > span {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: 0.08em !important;
}

/* Navigation Links - Desktop only */
@media (min-width: 769px) {
  .top-inner {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    gap: 18px !important;
    min-height: 60px !important;
  }

  .top .nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
  }
}

.top .nav a {
  position: relative !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  text-decoration: none !important;
  padding: 6px 2px !important;
  transition: color 0.15s ease !important;
}

.top .nav a:hover {
  color: #f0f6fc !important;
}

.top .nav a[aria-current="page"] {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.top .nav a::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -4px !important;
  height: 2px !important;
  border-radius: 1px !important;
  background: rgba(88, 166, 255, 0.75) !important;
  box-shadow: none !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.18s ease !important;
}

.top .nav a[aria-current="page"]::after {
  transform: scaleX(1) !important;
  opacity: 0.85 !important;
  box-shadow: 0 0 6px rgba(88, 166, 255, 0.35) !important;
}

.top .nav a:hover::after {
  transform: scaleX(1) !important;
  opacity: 0.45 !important;
}

/* User Box */
.userbox {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
}

/* Balance link (.money) - natural clean white text */
.top a.money {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  transition: opacity 0.15s ease !important;
}

.top a.money:hover {
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  opacity: 0.8 !important;
  box-shadow: none !important;
}

.user-split {
  width: 1px !important;
  height: 18px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  flex-shrink: 0 !important;
}

/* Notification Bell - borderless clean */
.bell-btn {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  background: transparent !important;
  border: none !important;
  color: #9aa2b1 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: color 0.15s ease, background-color 0.15s ease !important;
}

.bell-btn:hover,
.bell.is-open .bell-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: none !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.bell-dot {
  background: #58a6ff !important;
  box-shadow: 0 0 0 2px #101214, 0 0 6px rgba(88, 166, 255, 0.6) !important;
}

.bell-pop {
  background: #15181f !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
  padding: 6px !important;
}

/* User summary trigger - borderless natural flow */
.userbox summary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 4px 6px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.userbox summary:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  border: none !important;
  box-shadow: none !important;
}

.userbox details[open] summary {
  background: rgba(255, 255, 255, 0.06) !important;
  border: none !important;
  box-shadow: none !important;
}

/* Avatar reverts to original theme styles */

.who {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
}

/* User Profile Dropdown Menu (.pop) */
.top .userbox .pop {
  background: #15181f !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
  padding: 6px !important;
  min-width: 190px !important;
}

.top .pop a,
.top .pop button {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #c9d1d9 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  width: 100% !important;
  cursor: pointer !important;
  transition: all 0.12s ease !important;
}

.top .pop a:hover,
.top .pop button:hover {
  background: rgba(88, 166, 255, 0.1) !important;
  color: #ffffff !important;
}

.pop-icon {
  width: 15px !important;
  height: 15px !important;
  color: #8b929e !important;
  transition: color 0.12s ease !important;
  flex-shrink: 0 !important;
}

.top .pop a:hover .pop-icon,
.top .pop button:hover .pop-icon {
  color: #58a6ff !important;
}

.pop-split {
  height: 1px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  margin: 4px 6px !important;
}

/* Logout Button */
.top .pop form {
  margin: 0 !important;
}

.top .pop form button:hover {
  background: rgba(239, 68, 68, 0.1) !important;
  color: #fca5a5 !important;
}

.top .pop form button:hover .pop-icon {
  color: #f87171 !important;
}

/* Guest header actions (when logged out) */
.top .account {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
}

.account-login {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  text-decoration: none !important;
  padding: 6px 10px !important;
  transition: color 0.15s ease !important;
}

.account-login:hover {
  color: #ffffff !important;
}

.account-register {
  height: 34px !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, rgba(88, 166, 255, 0.22) 0%, rgba(88, 166, 255, 0.12) 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.45) !important;
  color: #dbeafe !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  transition: all 0.15s ease !important;
}

.account-register:hover {
  background: rgba(88, 166, 255, 0.32) !important;
  border-color: rgba(88, 166, 255, 0.7) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(88, 166, 255, 0.28) !important;
}


/* ================= MODERN USERS PAGE REDESIGN ================= */
.users-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 22px 24px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  background: #14171d !important;
  background: linear-gradient(180deg, #161920 0%, #121418 100%) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  transition: all 0.2s ease !important;
}

.users-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.users-title-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 9px !important;
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #58a6ff !important;
  flex-shrink: 0 !important;
}

.users-title-icon svg {
  width: 17px !important;
  height: 17px !important;
  stroke: currentColor !important;
}

.users-hero h1 {
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.users-hero .user-search {
  max-width: 340px !important;
  margin-top: 10px !important;
}

.users-hero .user-search label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  margin-bottom: 4px !important;
}

.users-hero .user-search input {
  height: 38px !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  color: #f0f6fc !important;
  font-size: 13px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

.users-hero .user-search input:focus {
  background: rgba(14, 16, 20, 0.95) !important;
  border-color: rgba(88, 166, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
  outline: none !important;
}

.users-art {
  width: 80px !important;
  height: auto !important;
  opacity: 0.85 !important;
  filter: drop-shadow(0 6px 16px rgba(0, 119, 255, 0.25)) !important;
}

/* User count line */
.people-count {
  margin: 16px 2px 12px !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.people-count::before {
  content: "" !important;
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2358a6ff' stroke-width='2'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E") !important;
}

/* Users Table Card */
.block.people-board {
  padding: 8px 20px 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  background: #14171d !important;
  background: linear-gradient(180deg, #15181f 0%, #121419 100%) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25) !important;
}

.people-head {
  padding: 12px 6px 10px !important;
  margin-bottom: 2px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: #8b929e !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.people-row {
  min-height: 50px !important;
  padding: 8px 6px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 8px !important;
  transition: background 0.15s ease !important;
}

.people-row:hover {
  background: rgba(255, 255, 255, 0.03) !important;
}

.people-row:last-child {
  border-bottom: none !important;
}

.people-row .seller {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  color: #f0f6fc !important;
}

.people-row .seller-avatar {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.035) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: grid !important;
  place-items: center !important;
  color: #8b929e !important;
  transition: all 0.15s ease !important;
}

.people-row .seller-avatar svg {
  width: 15px !important;
  height: 15px !important;
}

.people-row .seller-nick {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  transition: color 0.15s ease !important;
}

.people-row .seller:hover .seller-avatar {
  background: rgba(88, 166, 255, 0.15) !important;
  border-color: rgba(88, 166, 255, 0.4) !important;
  color: #58a6ff !important;
}

.people-row .seller:hover .seller-nick {
  color: #58a6ff !important;
}

.people-date {
  color: #6e7681 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}


/* ================= ACTION MODALS (BULK BUY & AUTOBUY - MODERN REDESIGN) ================= */
#bulk-dialog,
#autobuy-dialog,
dialog.modal:not(.lot-preview) {
  width: min(480px, calc(100vw - 28px)) !important;
  background: linear-gradient(180deg, #161922 0%, #101218 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 20px !important;
  padding: 24px 22px 24px !important;
  color: #f0f6fc !important;
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 40px rgba(0, 119, 255, 0.06) !important;
}

dialog.modal::backdrop {
  background: rgba(8, 10, 14, 0.78) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

#bulk-dialog .modal-head,
#autobuy-dialog .modal-head,
dialog.modal:not(.lot-preview) .modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 14px !important;
  padding-bottom: 0 !important;
}

#bulk-dialog .modal-title-group,
#autobuy-dialog .modal-title-group,
.modal-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

#bulk-dialog .modal-icon,
#autobuy-dialog .modal-icon,
.modal-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, rgba(88, 166, 255, 0.22) 0%, rgba(56, 139, 253, 0.08) 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  display: grid !important;
  place-items: center !important;
  color: #58a6ff !important;
  box-shadow: 0 0 16px rgba(88, 166, 255, 0.2) !important;
  flex-shrink: 0 !important;
}

#bulk-dialog .modal-icon svg,
#autobuy-dialog .modal-icon svg,
.modal-icon svg {
  width: 19px !important;
  height: 19px !important;
  stroke: currentColor !important;
}

#bulk-dialog .modal-head h2,
#autobuy-dialog .modal-head h2,
dialog.modal:not(.lot-preview) .modal-head h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
}

#bulk-dialog .modal-close,
#autobuy-dialog .modal-close,
dialog.modal:not(.lot-preview) .modal-close {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #8b929e !important;
  font-size: 20px !important;
  line-height: 1 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  transition: all 0.16s ease !important;
}

#bulk-dialog .modal-close:hover,
#autobuy-dialog .modal-close:hover,
dialog.modal:not(.lot-preview) .modal-close:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  transform: rotate(90deg);
}

/* Info badge for filters */
.modal-filter-badge {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 12px !important;
  background: rgba(88, 166, 255, 0.08) !important;
  border: 1px solid rgba(88, 166, 255, 0.18) !important;
  border-radius: 10px !important;
  margin-bottom: 18px !important;
  color: #8bc4ff !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
}

.modal-filter-badge svg {
  width: 15px !important;
  height: 15px !important;
  flex-shrink: 0 !important;
  stroke: currentColor !important;
}

/* Modal Form Fields */
.modal-field {
  display: grid !important;
  gap: 7px !important;
  margin-bottom: 16px !important;
}

.modal-label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #c9d1d9 !important;
  margin: 0 !important;
}

.label-req {
  color: #f85149 !important;
  font-weight: 700 !important;
  margin-left: 3px !important;
}

.label-opt {
  font-size: 11px !important;
  color: #6e7681 !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.input-with-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

.input-with-icon .input-icon {
  position: absolute !important;
  left: 14px !important;
  width: 17px !important;
  height: 17px !important;
  stroke: #6e7681 !important;
  pointer-events: none !important;
  transition: stroke 0.16s ease !important;
}

.input-with-icon:focus-within .input-icon {
  stroke: #58a6ff !important;
}

.input-with-icon input {
  width: 100% !important;
  height: 46px !important;
  box-sizing: border-box !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 0 14px 0 42px !important;
  color: #ffffff !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  transition: all 0.16s ease !important;
}

.input-with-icon input:focus {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.18), 0 0 16px rgba(88, 166, 255, 0.12) !important;
  outline: none !important;
}

.input-with-icon input::placeholder {
  color: #555e69 !important;
}

/* Quick Presets */
.quick-presets {
  display: flex !important;
  gap: 6px !important;
  margin-top: 2px !important;
}

.preset-chip {
  padding: 4px 11px !important;
  border-radius: 7px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #8b929e !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.14s ease !important;
}

.preset-chip:hover {
  background: rgba(88, 166, 255, 0.12) !important;
  border-color: rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
}


.preset-chip.is-active {
  background: rgba(88, 166, 255, 0.22) !important;
  border-color: #58a6ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 10px rgba(88, 166, 255, 0.35) !important;
}

.preset-chip:active {
  transform: scale(0.95) !important;
}

.modal-field-hint {
  font-size: 11.5px !important;
  color: #6e7681 !important;
  margin-top: 2px !important;
}

/* Modal Dating Choice */
.modal-dating-choice {
  margin: 6px 0 16px !important;
}

.modal-dating-choice .choice-set {
  margin-top: 6px !important;
}

/* Segmented Choice: VK Знакомства */
dialog.modal:not(.lot-preview) .filter-choice {
  display: grid !important;
  gap: 8px !important;
  margin: 0 0 16px !important;
  overflow: visible !important;
}

dialog.modal:not(.lot-preview) .filter-caption {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
  display: block !important;
  line-height: 1.4 !important;
}

dialog.modal:not(.lot-preview) .choice-set {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  height: auto !important;
  background: transparent !important;
  border: none !important;
  padding: 2px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

dialog.modal:not(.lot-preview) .choice-set label {
  display: flex !important;
  min-width: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  position: relative !important;
  overflow: visible !important;
}

dialog.modal:not(.lot-preview) .choice-set label + label {
  box-shadow: none !important;
}

dialog.modal:not(.lot-preview) .choice-set input[type="radio"] {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

dialog.modal:not(.lot-preview) .choice-set span {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  color: #c9d1d9 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
  user-select: none !important;
  box-sizing: border-box !important;
}

dialog.modal:not(.lot-preview) .choice-set label:hover span {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

dialog.modal:not(.lot-preview) .choice-set input:checked + span,
dialog.modal:not(.lot-preview) .choice-set label:hover input:checked + span {
  background: rgba(88, 166, 255, 0.16) !important;
  border-color: rgba(88, 166, 255, 0.55) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  box-shadow: 0 0 12px rgba(88, 166, 255, 0.2) !important;
}

/* Modal Divider */
dialog.modal:not(.lot-preview) .modal-split {
  height: 1px !important;
  margin: 16px 0 !important;
  border: none !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Bulk CTA Submit Button - flat modern green */
.bulk-submit-btn,
dialog.modal:not(.lot-preview) form > .btn.buy {
  width: 100% !important;
  height: 44px !important;
  margin-top: 8px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  background: rgba(46, 160, 67, 0.2) !important;
  border: 1px solid rgba(63, 185, 80, 0.45) !important;
  color: #e6ffed !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease !important;
}

.bulk-submit-btn:hover,
dialog.modal:not(.lot-preview) form > .btn.buy:hover {
  background: rgba(46, 160, 67, 0.32) !important;
  border-color: rgba(86, 211, 100, 0.7) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.bulk-submit-btn:active,
dialog.modal:not(.lot-preview) form > .btn.buy:active {
  transform: none !important;
  box-shadow: none !important;
}

.bulk-submit-btn svg,
dialog.modal:not(.lot-preview) form > .btn.buy svg {
  width: 18px !important;
  height: 18px !important;
  stroke: #ffffff !important;
  stroke-width: 2 !important;
  fill: none !important;
}

/* Dating fit text */
#dating-fit {
  margin: 10px 0 0 !important;
  font-size: 12.5px !important;
  color: #8b929e !important;
  line-height: 1.4 !important;
}


/* ================= API DOCUMENTATION REDESIGN ================= */
.api-layout {
  --api-top: 80px;
  --api-nav-offset: 0px;
  display: grid !important;
  grid-template-columns: 210px minmax(0, 1fr) !important;
  gap: 28px !important;
  align-items: start !important;
  min-width: 0 !important;
  margin-top: 10px !important;
}

main.wrap:has(.api-layout) {
  width: min(1120px, 100%) !important;
}

/* API Title Row */
.api-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 8px !important;
}

.api-title-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #58a6ff !important;
  flex-shrink: 0 !important;
}

.api-title-icon svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
}

.api-main h1 {
  margin: 0 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.api-main .hint {
  color: #8b929e !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  margin: 0 0 20px !important;
  max-width: 820px !important;
}

/* API Sticky Navigation */
.api-side {
  position: sticky !important;
  top: 84px !important;
  z-index: 12 !important;
  display: grid !important;
  gap: 3px !important;
  align-self: start !important;
  max-height: calc(100vh - 100px) !important;
  overflow: auto !important;
  padding: 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  background: #14171d !important;
  background: linear-gradient(180deg, #15181f 0%, #121419 100%) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25) !important;
}

.api-side a {
  color: #8b929e !important;
  text-decoration: none !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: all 0.15s ease !important;
}

.api-side a:hover {
  color: #f0f6fc !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

.api-side a:active,
.api-side a[aria-current="true"] {
  color: #58a6ff !important;
  background: rgba(88, 166, 255, 0.12) !important;
  font-weight: 600 !important;
}

/* API Content Cards */
.api-card {
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 14px !important;
  padding: 22px 24px !important;
  margin: 0 0 16px !important;
  background: #14171d !important;
  background: linear-gradient(180deg, #15181f 0%, #121419 100%) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25) !important;
  min-width: 0 !important;
}

.api-card > h2 {
  margin: 0 0 12px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.api-group > h2 {
  margin: 0 0 14px !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  letter-spacing: -0.01em !important;
}

.api-main > .api-card + .api-group,
.api-main > .api-group + .api-group {
  margin-top: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.api-card p {
  color: #c9d1d9 !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  margin: 0 0 12px !important;
}

.api-card code:not(.api-sample):not(.api-secret) {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 5px !important;
  padding: 1px 5px !important;
  color: #79c0ff !important;
  font-size: 12.5px !important;
}

/* Endpoint Call Bar */
.api-call {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  background: rgba(14, 16, 20, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  margin: 0 0 14px !important;
  flex-wrap: wrap !important;
}

.verb {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}

.verb.get {
  background: rgba(93, 219, 165, 0.15) !important;
  border: 1px solid rgba(93, 219, 165, 0.35) !important;
  color: #5ddba5 !important;
}

.verb.post {
  background: rgba(88, 166, 255, 0.15) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
}

.verb.delete {
  background: rgba(248, 81, 73, 0.15) !important;
  border: 1px solid rgba(248, 81, 73, 0.35) !important;
  color: #f85149 !important;
}

.api-path {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
}

.api-call .meta {
  margin-left: auto !important;
  font-size: 11.5px !important;
  color: #8b929e !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
}

/* Modern Code Blocks */
.api-sample, .api-secret {
  background: #0e1014 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
  margin: 12px 0 14px !important;
  color: #79c0ff !important;
  font-family: var(--mono, ui-monospace, "Cascadia Mono", Consolas, monospace) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  overflow-x: auto !important;
  tab-size: 2 !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

.api-secret {
  background: rgba(88, 166, 255, 0.08) !important;
  border-color: rgba(88, 166, 255, 0.25) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
}

/* API Fields Table */
.api-fields {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 14px 0 16px !important;
  font-size: 13.5px !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: rgba(14, 16, 20, 0.4) !important;
}

.api-fields tr {
  transition: background 0.15s ease !important;
}

.api-fields tr:hover {
  background: rgba(255, 255, 255, 0.02) !important;
}

.api-fields th,
.api-fields td {
  padding: 11px 14px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  vertical-align: top !important;
  text-align: left !important;
}

.api-fields th {
  width: 160px !important;
  color: #58a6ff !important;
  font-family: var(--mono, ui-monospace, Consolas, monospace) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding-right: 12px !important;
}

.api-fields td {
  color: #c9d1d9 !important;
  line-height: 1.5 !important;
}

.api-fields tr:last-child th,
.api-fields tr:last-child td {
  border-bottom: none !important;
}

/* Token Creation Form */
.api-card .form-grid {
  display: flex !important;
  align-items: flex-end !important;
  gap: 12px !important;
  margin: 16px 0 12px !important;
}

.api-card .form-grid label {
  flex: 1 !important;
  max-width: 320px !important;
  display: grid !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #8b929e !important;
}

.api-card .form-grid input {
  height: 40px !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  color: #f0f6fc !important;
  font-size: 13.5px !important;
  padding: 0 12px !important;
  transition: all 0.15s ease !important;
  box-sizing: border-box !important;
}

.api-card .form-grid input:focus {
  background: rgba(14, 16, 20, 0.95) !important;
  border-color: rgba(88, 166, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
  outline: none !important;
}

.api-card .form-grid .btn {
  height: 40px !important;
  padding: 0 18px !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, rgba(88, 166, 255, 0.22) 0%, rgba(88, 166, 255, 0.12) 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.45) !important;
  color: #dbeafe !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
}

.api-card .form-grid .btn:hover {
  background: rgba(88, 166, 255, 0.32) !important;
  border-color: rgba(88, 166, 255, 0.7) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(88, 166, 255, 0.25) !important;
}

/* Tokens List */
.api-tokens {
  display: grid !important;
  gap: 8px !important;
  margin: 16px 0 8px !important;
  padding: 0 !important;
  list-style: none !important;
}

.api-tokens li {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  background: rgba(14, 16, 20, 0.6) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  color: #f0f6fc !important;
}

.api-tokens .btn.ghost {
  height: 30px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 7px !important;
  color: #f85149 !important;
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.25) !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.api-tokens .btn.ghost:hover {
  background: rgba(248, 81, 73, 0.22) !important;
  border-color: rgba(248, 81, 73, 0.5) !important;
  color: #ffffff !important;
}

@media (max-width: 768px) {
  .api-layout {
    grid-template-columns: 1fr !important;
  }
  .api-side {
    position: static !important;
    max-height: none !important;
    margin-bottom: 16px !important;
  }
}


/* Profile Subtabs (Lists of users: Избранные / Игнор) - Soft, clean underline */
.profile-subtabs {
  gap: 16px !important;
}

.profile-subtabs .profile-subtab-pill {
  color: #8b929e !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 8px 4px 10px !important;
  transition: color 0.15s ease !important;
}

.profile-subtabs .profile-subtab-pill:hover {
  color: #f0f6fc !important;
}

.profile-subtabs .profile-subtab-pill.active {
  color: #f0f6fc !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.profile-subtabs .profile-subtab-pill.active::after {
  content: "" !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: #58a6ff !important;
  border-radius: 2px !important;
  box-shadow: 0 0 6px rgba(88, 166, 255, 0.35) !important;
}


/* Profile Add User Form inside Lists */
.profile-add-user-form input[type="text"],
.profile-add-user-form input {
  height: 40px !important;
  background: rgba(14, 16, 20, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 9px !important;
  color: #f0f6fc !important;
  font-size: 13.5px !important;
  padding: 0 12px !important;
  transition: all 0.15s ease !important;
}

.profile-add-user-form input[type="text"]:focus,
.profile-add-user-form input:focus {
  background: rgba(14, 16, 20, 0.95) !important;
  border-color: rgba(88, 166, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
  outline: none !important;
}

.profile-add-user-form .btn-cab-primary {
  height: 40px !important;
  padding: 0 18px !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.3) !important;
  color: #dbeafe !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
  white-space: nowrap !important;
}

.profile-add-user-form .btn-cab-primary:hover {
  background: rgba(88, 166, 255, 0.22) !important;
  border-color: rgba(88, 166, 255, 0.55) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}


/* ================= HEADER BELL & USERBOX IN MARKET STYLE ================= */
.userbox {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* Bell button - borderless, larger icon */
.bell-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 9px !important;
  background: transparent !important;
  border: none !important;
  color: #9aa2b1 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  transition: color 0.15s ease, background-color 0.15s ease !important;
  position: relative !important;
  box-shadow: none !important;
}

.bell-btn svg {
  width: 21px !important;
  height: 21px !important;
  stroke-width: 1.85 !important;
  transition: color 0.15s ease, stroke 0.15s ease !important;
}

.bell-btn:hover,
.bell.is-open .bell-btn {
  background: rgba(255, 255, 255, 0.07) !important;
  border: none !important;
  color: #58a6ff !important;
  box-shadow: none !important;
}

.bell-dot {
  position: absolute !important;
  top: 5px !important;
  right: 5px !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #58a6ff !important;
  box-shadow: 0 0 0 2px #0f1115, 0 0 8px rgba(88, 166, 255, 0.8) !important;
}

/* Userbox Summary - Borderless, zero layout-shift, smooth color transition */
.userbox summary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  user-select: none !important;
  box-shadow: none !important;
  outline: none !important;
  list-style: none !important;
}

.userbox summary::-webkit-details-marker,
.userbox summary::marker {
  display: none !important;
}

.userbox summary:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.userbox details[open] summary {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Avatar in Market Style (Smooth hover, no jump) */
.userbox .avatar {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, rgba(88, 166, 255, 0.18) 0%, rgba(29, 78, 216, 0.15) 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: 0 0 10px rgba(88, 166, 255, 0.12) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  flex-shrink: 0 !important;
}

.userbox summary:hover .avatar {
  border-color: rgba(88, 166, 255, 0.65) !important;
  box-shadow: 0 0 12px rgba(88, 166, 255, 0.25) !important;
}

/* Nickname (smooth color hover, no shifting) */
.userbox .who {
  color: #f0f6fc !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  transition: color 0.15s ease !important;
}

.userbox summary:hover .who {
  color: #58a6ff !important;
}

.userbox summary::after {
  display: none !important;
}


/* ==========================================================================
   AUTH REDESIGN (Вход, Регистрация, Восстановление)
   ========================================================================== */
.auth-container {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: calc(100vh - 200px);
  padding: 40px 16px;
  box-sizing: border-box;
}

.auth-card {
  width: 100% !important;
  max-width: 440px !important;
  background: linear-gradient(180deg, #161b22 0%, #0d1117 100%) !important;
  border: 1px solid rgba(88, 166, 255, 0.2) !important;
  border-radius: 20px !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 30px rgba(88, 166, 255, 0.08) !important;
  padding: 34px 30px 28px !important;
  box-sizing: border-box;
  text-align: left;
  position: relative;
  overflow: hidden;
}

.auth-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #58a6ff, #388bfd, transparent);
  box-shadow: 0 0 10px rgba(88, 166, 255, 0.6);
}

.auth-header {
  text-align: center !important;
  margin-bottom: 24px !important;
}

.auth-icon-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 16px !important;
  background: rgba(88, 166, 255, 0.1) !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  color: #58a6ff !important;
  margin-bottom: 14px !important;
  box-shadow: 0 0 20px rgba(88, 166, 255, 0.2) !important;
}

.auth-title {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  margin: 0 0 6px !important;
  letter-spacing: -0.02em;
  text-align: center !important;
}

.auth-subtitle {
  font-size: 13.5px !important;
  color: #8b949e !important;
  margin: 0 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

.auth-error-alert {
  background: rgba(248, 81, 73, 0.12) !important;
  border: 1px solid rgba(248, 81, 73, 0.35) !important;
  color: #ff7b72 !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  font-size: 13.5px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 20px !important;
  line-height: 1.4 !important;
  box-shadow: 0 4px 12px rgba(248, 81, 73, 0.1) !important;
}

.auth-error-alert svg {
  flex-shrink: 0;
  color: #f85149 !important;
}

.auth-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.auth-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.auth-label-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

.auth-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #c9d1d9 !important;
  margin: 0 !important;
}

.auth-forgot-link {
  font-size: 12.5px !important;
  color: #58a6ff !important;
  text-decoration: none !important;
  transition: color 0.15s ease, text-shadow 0.15s ease !important;
}

.auth-forgot-link:hover {
  color: #79c0ff !important;
  text-shadow: 0 0 8px rgba(88, 166, 255, 0.4) !important;
  text-decoration: underline !important;
}

.auth-input-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.auth-input-icon {
  position: absolute !important;
  left: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #6e7681 !important;
  pointer-events: none !important;
  transition: color 0.2s ease !important;
}

.auth-input-wrap:focus-within .auth-input-icon {
  color: #58a6ff !important;
}

.auth-input {
  width: 100% !important;
  height: 44px !important;
  padding: 0 14px 0 42px !important;
  background: #090d13 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 12px !important;
  color: #f0f6fc !important;
  font-size: 14.5px !important;
  box-sizing: border-box !important;
  outline: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.auth-input::placeholder {
  color: #484f58 !important;
}

.auth-input:focus {
  background: #0d121a !important;
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.18), 0 0 14px rgba(88, 166, 255, 0.2) !important;
}

.auth-submit-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: 46px !important;
  margin-top: 6px !important;
  padding: 0 20px !important;
  background: linear-gradient(135deg, #1f6feb 0%, #388bfd 100%) !important;
  border: none !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  box-shadow: 0 4px 16px rgba(31, 111, 235, 0.4) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.auth-submit-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 22px rgba(56, 139, 253, 0.55), 0 0 16px rgba(88, 166, 255, 0.35) !important;
  filter: brightness(1.05) !important;
}

.auth-submit-btn:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 10px rgba(31, 111, 235, 0.4) !important;
}

.auth-footer {
  margin-top: 22px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  text-align: center !important;
  font-size: 13.5px !important;
  color: #8b949e !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

.auth-footer-link {
  color: #58a6ff !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.15s ease, text-shadow 0.15s ease !important;
}

.auth-footer-link:hover {
  color: #79c0ff !important;
  text-shadow: 0 0 8px rgba(88, 166, 255, 0.4) !important;
  text-decoration: underline !important;
}

@media (max-width: 480px) {
  .auth-container {
    padding: 20px 12px !important;
    min-height: auto !important;
  }
  .auth-card {
    padding: 24px 18px 20px !important;
    border-radius: 16px !important;
  }
  .auth-title {
    font-size: 21px !important;
  }
}

/* ==========================================================================
   COMPREHENSIVE PREMIUM MOBILE & RESPONSIVE ADAPTATION (320px - 768px)
   ========================================================================== */

/* Global Body Constraints */
html, body {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  -webkit-text-size-adjust: 100% !important;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* Nav Icons: Hidden on Desktop, Visible on Mobile */
.top .nav .nav-icon {
  display: none;
}

@media (max-width: 768px) {
  /* Container Safe Insets */
  .wrap {
    padding-left: max(14px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(14px, env(safe-area-inset-right, 0px)) !important;
  }

  main#content {
    padding-top: 14px !important;
  }

  /* -------------------------------------------------------------
     1. TOP HEADER - EXACT 3-ZONE LAYOUT WITH DEAD-CENTER LOGO
     ------------------------------------------------------------- */
  .top {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(14, 16, 20, 0.94) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  }

  .top-inner {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 56px !important;
    height: 56px !important;
    padding: 0 14px !important;
    width: 100% !important;
  }

  /* Hamburger Toggle (Left zone) */
  .nav-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: #cbd5e1 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    z-index: 2 !important;
    transition: all 0.15s ease !important;
  }

  .nav-toggle:hover,
  .top.is-nav-open .nav-toggle {
    background: rgba(88, 166, 255, 0.14) !important;
    border-color: rgba(88, 166, 255, 0.35) !important;
    color: #58a6ff !important;
  }

  .nav-toggle svg {
    width: 18px !important;
    height: 18px !important;
  }

  .nav-toggle-close { display: none !important; }
  .top.is-nav-open .nav-toggle-bars { display: none !important; }
  .top.is-nav-open .nav-toggle-close { display: block !important; }

  /* Brand Logo (Clean inline next to hamburger) */
  .brand {
    position: static !important;
    transform: none !important;
    left: auto !important;
    top: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    z-index: 2 !important;
    pointer-events: auto !important;
    text-decoration: none !important;
  }

  .brand .vk-mark {
    width: 22px !important;
    height: 13px !important;
  }

  .brand > span {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    color: #ffffff !important;
  }

  /* Right Zone: Userbox or Account */
  .top-inner > .userbox,
  .top-inner > .account {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: auto !important;
    z-index: 2 !important;
    flex-shrink: 0 !important;
  }

  /* Balance Link (Glass pill) */
  .top a.money {
    display: inline-flex !important;
    align-items: center !important;
    height: 32px !important;
    padding: 0 10px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 8px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    white-space: nowrap !important;
    letter-spacing: -0.01em !important;
    box-shadow: none !important;
  }

  .user-split {
    display: none !important;
  }

  .bell-btn {
    width: 34px !important;
    height: 34px !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
  }

  .bell-pop {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    width: min(340px, calc(100vw - 20px)) !important;
    max-height: 75vh !important;
    overflow-y: auto !important;
  }

  .userbox summary {
    padding: 0 !important;
  }

  .userbox summary .avatar {
    width: 30px !important;
    height: 30px !important;
    font-size: 12px !important;
    border-radius: 8px !important;
  }

  .userbox summary .who {
    display: none !important;
  }

  .userbox .pop {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    width: 230px !important;
    max-width: calc(100vw - 20px) !important;
    z-index: 250 !important;
    border-radius: 14px !important;
  }

  /* Guest Account Links */
  .account {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .account-login {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #cbd5e1 !important;
    padding: 6px 8px !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }

  .account-register {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 14px !important;
    height: 34px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    border-radius: 9px !important;
    white-space: nowrap !important;
  }

  /* -------------------------------------------------------------
     2. PREMIUM MOBILE NAVIGATION DRAWER
     ------------------------------------------------------------- */
  .top .nav {
    display: none !important;
  }

  .top.is-nav-open .nav {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px !important;
    background: #13161e !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(88, 166, 255, 0.15) !important;
    gap: 4px !important;
    z-index: 200 !important;
    animation: mobileDrawerIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  }

  @keyframes mobileDrawerIn {
    from {
      opacity: 0;
      transform: translateY(-8px) scale(0.98);
    }
    to {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }

  .top .nav a {
    display: flex !important;
    align-items: center !important;
    height: 46px !important;
    padding: 0 16px !important;
    border-radius: 12px !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: #cbd5e1 !important;
    text-decoration: none !important;
    background: transparent !important;
    transition: all 0.15s ease !important;
  }

  .top .nav a::after {
    display: none !important;
  }

  .top .nav .nav-icon {
    display: inline-block !important;
    width: 18px !important;
    height: 18px !important;
    margin-right: 12px !important;
    color: inherit !important;
    flex-shrink: 0 !important;
  }

  .top .nav a:hover,
  .top .nav a:active {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
  }

  .top .nav a[aria-current="page"] {
    background: rgba(88, 166, 255, 0.12) !important;
    color: #58a6ff !important;
    font-weight: 600 !important;
  }

  .nav-mobile-extra {
    display: block !important;
    padding-top: 6px !important;
    margin-top: 4px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .nav-mobile-extra a {
    color: #58a6ff !important;
    font-weight: 600 !important;
  }

  /* -------------------------------------------------------------
     3. FILTERS SYSTEM (_filters.html)
     ------------------------------------------------------------- */
  .board {
    padding: 14px 14px !important;
    border-radius: 16px !important;
    margin-bottom: 12px !important;
  }

  .filter-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
  }

  .filter-head-main {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .filter-head-main h2 {
    font-size: 17px !important;
  }

  .filter-head-main p {
    font-size: 12px !important;
    line-height: 1.35 !important;
    margin: 2px 0 0 !important;
  }

  /* Filter Action Buttons (Horizontal scrollable chip strip) */
  .filter-head-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 8px !important;
    padding-bottom: 2px !important;
    width: 100% !important;
  }

  .filter-head-actions::-webkit-scrollbar {
    display: none !important;
  }

  .filter-action-btn {
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    border-radius: 9px !important;
    white-space: nowrap !important;
  }

  /* Fix for label.range: Label on TOP, inputs take 100% width side-by-side! */
  label.range {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    width: 100% !important;
  }

  label.range > span,
  .range > span {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  label.range > span input,
  .range > span input {
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    font-size: 13.5px !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
  }

  /* Date inputs formatting */
  input[type="date"] {
    font-size: 12.5px !important;
    padding: 0 8px !important;
    letter-spacing: -0.01em !important;
  }

  /* Dropdown triggers & city input */
  .multi-select-trigger,
  .city-filter input {
    height: 40px !important;
    border-radius: 10px !important;
  }

  /* Origin choices: 3 columns */
  .choice.origin-set .choice-set {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
  }

  .choice-set span {
    min-height: 38px !important;
    border-radius: 9px !important;
  }

  /* Board Actions bar (Count + Buttons) */
  .board-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin: 14px 0 10px !important;
  }

  .board-bar #account-count {
    font-size: 15px !important;
    font-weight: 700 !important;
  }

  .board-actions {
    display: flex !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .board-actions .btn {
    flex: 1 !important;
    justify-content: center !important;
    height: 38px !important;
    font-size: 12.5px !important;
    padding: 0 10px !important;
    border-radius: 9px !important;
  }

  /* -------------------------------------------------------------
     4. ACCOUNT CARDS (LISTINGS GRID) - BESPOKE MOBILE CARD
     ------------------------------------------------------------- */
  .listing-row {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 14px 14px 12px !important;
    border-radius: 16px !important;
    margin-bottom: 10px !important;
    gap: 10px !important;
    background: #14171d !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .listing-row .account-main {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .listing-row .lot-vk {
    width: 32px !important;
    height: 32px !important;
    border-radius: 9px !important;
    margin-top: 2px !important;
    flex-shrink: 0 !important;
  }

  .listing-row .lot-vk-split {
    display: none !important;
  }

  .listing-row .account-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    flex: 1 !important;
    min-width: 0 !important;
  }

  .listing-row .chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 6px !important;
  }

  .listing-row .chip {
    min-height: 22px !important;
    padding: 2px 7px !important;
    font-size: 11px !important;
    border-radius: 5px !important;
    line-height: 1.25 !important;
  }

  .listing-row .account-foot {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px 8px !important;
    font-size: 11.5px !important;
    color: #8b929e !important;
    margin-top: 2px !important;
  }

  .listing-row .account-side {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    margin-top: 2px !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  .listing-row .account-side .side-top {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .listing-row .price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    letter-spacing: -0.01em !important;
    white-space: nowrap !important;
  }

  .listing-row .btn.buy {
    height: 36px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    background: rgba(88, 166, 255, 0.12) !important;
    border: 1px solid rgba(88, 166, 255, 0.3) !important;
    color: #c9e6ff !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* -------------------------------------------------------------
     5. SELL PAGE (/sell)
     ------------------------------------------------------------- */
  .sell-hero {
    grid-template-columns: 1fr !important;
    padding: 18px 14px !important;
  }

  .sell-art {
    display: none !important;
  }

  .sell-hero-copy h1 {
    font-size: 21px !important;
    line-height: 1.25 !important;
    margin: 6px 0 8px !important;
  }

  .sell-hero-copy .lead {
    font-size: 13px !important;
    line-height: 1.4 !important;
  }

  .sell-origin-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }

  .sell-origin-btn {
    height: 42px !important;
    font-size: 12.5px !important;
    padding: 0 6px !important;
    border-radius: 9px !important;
  }

  .sell-status-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .sell-status-card {
    padding: 14px 14px !important;
    border-radius: 12px !important;
  }

  .sell-dual-pill {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    height: 42px !important;
  }

  .sell-pill-btn {
    height: 42px !important;
    font-size: 13px !important;
  }

  .sell-price-strip {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 14px 14px !important;
    border-radius: 12px !important;
  }

  .sell-price-input-wrap {
    width: 100% !important;
  }

  .sell-price-input-wrap input {
    width: 100% !important;
    height: 44px !important;
    font-size: 16px !important;
  }

  /* -------------------------------------------------------------
     6. CABINET & FINANCE (/cabinet/*)
     ------------------------------------------------------------- */
  .fin-type-tabs,
  .account-tabs,
  .underline-tabs-bar,
  .subnav,
  .profile-subtabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 10px !important;
    padding: 4px 2px 12px !important;
    margin-bottom: 14px !important;
    width: 100% !important;
  }

  .fin-type-tabs::-webkit-scrollbar,
  .account-tabs::-webkit-scrollbar,
  .underline-tabs-bar::-webkit-scrollbar,
  .subnav::-webkit-scrollbar,
  .profile-subtabs::-webkit-scrollbar {
    display: none !important;
  }

  .fin-type-tab,
  .account-tabs a,
  .underline-tabs-bar a,
  .subnav a,
  .profile-subtabs a {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }

  .fin-secondary-filters {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .cab-kpi-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  /* -------------------------------------------------------------
     7. DIALOGS & MODALS
     ------------------------------------------------------------- */
  dialog.modal,
  .modal {
    width: calc(100vw - 20px) !important;
    max-width: 440px !important;
    max-height: 85vh !important;
    padding: 20px 16px 28px !important;
    border-radius: 18px !important;
    margin: auto !important;
  }

  .lot-preview-body {
    padding-bottom: 24px !important;
  }
}

/* Extra small devices (<= 380px) */
@media (max-width: 380px) {
  .top-inner {
    padding: 0 10px !important;
  }

  .sell-origin-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .account-register {
    display: none !important;
  }

  .choice.origin-set .choice-set {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}


/* ==========================================================================
   ORDER DETAILS PAGE (/cabinet/orders/<id>) BESPOKE REDESIGN
   ========================================================================== */
.order-top-nav {
  width: min(840px, 100%);
  margin-inline: auto;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.order-back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--muted, #8b929e);
  text-decoration: none;
  transition: all 0.15s ease;
  padding: 6px 12px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.order-back-link:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(255, 255, 255, 0.14);
}
.order-back-link svg {
  width: 15px;
  height: 15px;
}

.order-vk-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 600;
  color: #58a6ff;
  text-decoration: none;
  padding: 6px 12px;
  border-radius: 9px;
  background: rgba(88, 166, 255, 0.08);
  border: 1px solid rgba(88, 166, 255, 0.22);
  transition: all 0.15s ease;
}
.order-vk-btn:hover {
  background: rgba(88, 166, 255, 0.16);
  border-color: rgba(88, 166, 255, 0.45);
}
.order-vk-btn svg.vk-mark {
  width: 16px;
  height: 16px;
}

.order-premium-box {
  width: min(840px, 100%);
  margin-inline: auto;
  background: var(--card-bg, #14171d);
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  border-radius: 20px;
  padding: 24px 26px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
  box-sizing: border-box;
}

.order-hero-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line, rgba(255, 255, 255, 0.08));
}

.order-hero-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.order-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #58a6ff;
}

.order-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  background: rgba(93, 219, 165, 0.12);
  color: #5ddba5;
  border: 1px solid rgba(93, 219, 165, 0.3);
}

.order-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.order-meta-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 13px;
  color: var(--muted, #8b929e);
}

.order-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.order-meta-item svg {
  width: 14px;
  height: 14px;
  color: #58a6ff;
}

.order-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.order-stat-card {
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  border-radius: 14px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.order-stat-label {
  font-size: 12px;
  color: var(--muted, #8b929e);
  font-weight: 500;
}

.order-stat-value {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
}
.order-stat-value.highlight-green {
  color: #5ddba5;
}

.order-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.order-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.order-section-title {
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.order-section-title svg {
  width: 16px;
  height: 16px;
  color: #58a6ff;
}

.order-chips-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.order-secret-box {
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08));
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Compact locked state for order page (no excess air) */
.order-secret-box.order-secret-locked {
  padding: 14px 18px !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: center !important;
  background: rgba(248, 81, 73, 0.04) !important;
  border: 1px solid rgba(248, 81, 73, 0.22) !important;
  border-radius: 14px !important;
}

.order-locked-content {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

.order-locked-icon {
  width: 15px !important;
  height: 15px !important;
  color: #f87171 !important;
  flex-shrink: 0 !important;
}

.order-locked-text {
  margin: 0 !important;
  padding: 0 !important;
  color: #f87171 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

.order-locked-action {
  margin: 0 !important;
}

.order-locked-btn {
  height: 36px !important;
  padding: 0 14px !important;
  font-size: 12.5px !important;
  border-radius: 9px !important;
  margin: 0 !important;
}

@media (max-width: 560px) {
  .order-secret-box.order-secret-locked {
    padding: 12px 14px !important;
    gap: 8px !important;
  }
  .order-locked-text {
    font-size: 12.5px !important;
  }
  .order-locked-btn {
    width: 100% !important;
    height: 38px !important;
  }
}

.order-secret-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

/* Custom Format Pills (replacing ugly beige) */
.order-secret-box .secret-format {
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}
.order-secret-box .secret-format legend {
  display: none !important;
}
.order-secret-box .secret-format .choice-set {
  display: flex !important;
  background: #14171d !important;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08)) !important;
  border-radius: 10px !important;
  padding: 3px !important;
  height: 36px !important;
  gap: 2px !important;
}
.order-secret-box .secret-format .choice-set label {
  flex: 1 !important;
  margin: 0 !important;
  border: 0 !important;
}
.order-secret-box .secret-format .choice-set label + label {
  box-shadow: none !important;
}
.order-secret-box .secret-format .choice-set span {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 7px !important;
  color: var(--muted, #8b929e) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  transition: all 0.15s ease !important;
}
.order-secret-box .secret-format .choice-set label:hover span {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.04) !important;
}
.order-secret-box .secret-format .choice-set input:checked + span,
.order-secret-box .secret-format .choice-set label:hover input:checked + span {
  background: rgba(88, 166, 255, 0.14) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  border-color: rgba(88, 166, 255, 0.35) !important;
}

.order-code-container {
  position: relative;
  background: #090a0d;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  overflow: hidden;
}

.order-code-container pre.secret {
  margin: 0 !important;
  padding: 14px 16px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: #79c0ff !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  max-height: 220px !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

.order-action-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.order-btn-primary {
  height: 42px !important;
  padding: 0 20px !important;
  border-radius: 11px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  background: linear-gradient(180deg, rgba(93, 219, 165, 0.22) 0%, rgba(93, 219, 165, 0.12) 100%) !important;
  border: 1px solid rgba(93, 219, 165, 0.4) !important;
  color: #d1fae5 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  cursor: pointer;
  transition: all 0.15s ease !important;
}
.order-btn-primary:hover {
  background: rgba(93, 219, 165, 0.28) !important;
  border-color: rgba(93, 219, 165, 0.6) !important;
}

.order-btn-secondary {
  height: 42px !important;
  padding: 0 16px !important;
  border-radius: 11px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background: #14171d !important;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.08)) !important;
  color: #f0f6fc !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.15s ease !important;
}
.order-btn-secondary:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}
.order-btn-secondary svg,
.order-btn-primary svg {
  width: 15px;
  height: 15px;
}

.order-buyer-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #0f1115;
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  border-radius: 14px;
  padding: 14px 18px;
}

.order-buyer-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.order-buyer-avatar {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(88, 166, 255, 0.12);
  border: 1px solid rgba(88, 166, 255, 0.25);
  color: #58a6ff;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 15px;
}

@media (max-width: 640px) {
  .order-premium-box {
    padding: 16px 14px !important;
    border-radius: 16px !important;
    gap: 16px !important;
  }
  .order-title {
    font-size: 19px !important;
  }
  .order-secret-header {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .order-secret-box .secret-format {
    width: 100% !important;
  }
  .order-action-bar {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .order-btn-primary {
    grid-column: span 2 !important;
    height: 46px !important;
  }
  .order-btn-resell {
    grid-column: span 2 !important;
  }
  .order-btn-secondary {
    height: 42px !important;
    font-size: 12.5px !important;
    padding: 0 10px !important;
  }
  .order-buyer-card {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }
}


/* ==========================================================================
   SELL PAGE (/sell) BESPOKE MOBILE REFINEMENT
   ========================================================================== */
@media (max-width: 640px) {
  .sell-box,
  .sell-premium-box {
    padding: 16px 14px !important;
    border-radius: 16px !important;
  }

  .sell-hero {
    grid-template-columns: 1fr !important;
    padding: 0 0 16px 0 !important;
    gap: 8px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .sell-hero-copy h1 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin: 4px 0 6px !important;
    letter-spacing: -0.01em !important;
  }

  .sell-hero-copy .lead {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  .sell-form-section {
    gap: 12px !important;
    margin-top: 18px !important;
  }

  /* Section Headers: Title left, Hint/Pill right, perfectly aligned horizontally */
  .sell-section-header,
  .sell-section-head {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
    width: 100% !important;
  }

  .sell-section-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  .sell-section-hint {
    font-size: 12px !important;
    color: #8b929e !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .sell-section-header .sell-commission-pill {
    margin: 0 !important;
    padding: 2.5px 8px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
  }

  /* Step 1: Origin Grid (2 columns, 5th item spans both columns) */
  .sell-origin-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .sell-origin-item:last-child {
    grid-column: span 2 !important;
  }

  .sell-origin-btn {
    height: 44px !important;
    font-size: 13px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  /* Step 2: Quality Cards (1 column, full width) */
  .sell-status-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .sell-status-card {
    padding: 14px 14px !important;
    border-radius: 14px !important;
    gap: 12px !important;
  }

  .sell-status-card-header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .sell-card-labels {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  .sell-card-title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #f0f6fc !important;
  }

  .sell-card-subtitle {
    font-size: 11.5px !important;
    color: #8b929e !important;
  }

  .sell-dual-pill {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    height: 40px !important;
    border-radius: 10px !important;
    width: 100% !important;
  }

  .sell-pill-btn {
    height: 100% !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    border-radius: 8px !important;
  }

  /* Step 3: Price Box (Full width) */
  .sell-price-strip {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 16px 14px !important;
    border-radius: 14px !important;
    width: 100% !important;
  }

  .sell-price-info {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .sell-price-headings {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  .sell-price-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #f0f6fc !important;
  }

  .sell-price-desc {
    font-size: 11.5px !important;
    color: #8b929e !important;
  }

  .sell-price-input-holder {
    position: relative !important;
    width: 100% !important;
  }

  .sell-price-input-holder input,
  .sell-price-native-input {
    width: 100% !important;
    height: 46px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 0 36px 0 14px !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
  }

  .sell-price-sym {
    position: absolute !important;
    right: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #8b929e !important;
    pointer-events: none !important;
  }

  /* Step 4: Dropzone & Format Switcher */
  .sell-section-header .format-pill,
  .sell-dual-pill.format-pill {
    width: 100% !important;
    margin-top: 6px !important;
    margin-left: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    height: 42px !important;
  }

  .format-pill .sell-pill-btn {
    height: 100% !important;
    font-size: 13px !important;
    justify-content: center !important;
  }

  .sell-dropzone {
    padding: 24px 16px !important;
    border-radius: 14px !important;
    gap: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .sell-drop-main {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
  }

  .sell-drop-sub {
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: #8b929e !important;
  }

  #sell-lines {
    width: 100% !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    padding: 12px !important;
    box-sizing: border-box !important;
  }

  /* Queue list */
  .check-live li {
    grid-template-columns: 20px minmax(0, 1fr) auto !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
  }

  .check-live .size {
    display: none !important;
  }

  /* Step 5: Footer Actions */
  .sell-footer-action {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding-top: 18px !important;
    margin-top: 16px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .sell-footer-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    font-size: 13px !important;
    padding: 12px 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
  }

  .sell-footer-meta .sell-dot-separator {
    display: inline-block !important;
    opacity: 0.3 !important;
  }

  .sell-publish-btn {
    width: 100% !important;
    height: 48px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(93, 219, 165, 0.25) 0%, rgba(93, 219, 165, 0.14) 100%) !important;
    border: 1px solid rgba(93, 219, 165, 0.45) !important;
    color: #d1fae5 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
    box-sizing: border-box !important;
  }
}




/* Main Container */
.admin-body /* Provider Selector for Finance Deposit */
.fin-provider-selector {
  display: grid;
  gap: 12px !important;
  margin-top: 8px !important;
  margin-bottom: 18px !important;
}

.fin-provider-selector .filter-caption {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #9aa2b1 !important;
  letter-spacing: 0.02em !important;
  margin-bottom: 2px !important;
}

/* ================= PENDING INVOICES STYLING ================= */
.pending-invoices-block {
  margin-top: 18px !important;
  padding: 16px 18px !important;
  background: rgba(18, 21, 28, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.pending-invoices-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.pending-invoices-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #e6edf3 !important;
}

.pending-icon {
  width: 16px !important;
  height: 16px !important;
  color: #e3b341 !important;
  flex-shrink: 0 !important;
}

.pending-invoices-hint {
  font-size: 12px !important;
  color: #7d8590 !important;
}

.pending-invoices-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.pending-invoice-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 10px 14px !important;
  background: rgba(255, 255, 255, 0.025) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 9px !important;
  transition: all 0.15s ease !important;
}

.pending-invoice-item:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.pending-invoice-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.pending-invoice-amount {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -0.01em !important;
}

.pending-invoice-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.pending-badge {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  background: rgba(88, 166, 255, 0.12) !important;
  color: #58a6ff !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
  text-transform: uppercase !important;
}

.pending-status-text {
  font-size: 12.5px !important;
  color: #e3b341 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}

.pending-status-text::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #e3b341 !important;
}

.btn-pay-now {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  height: 32px !important;
  border-radius: 7px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  background: rgba(46, 160, 67, 0.18) !important;
  border: 1px solid rgba(63, 185, 80, 0.4) !important;
  color: #46ec73 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  white-space: nowrap !important;
}

.btn-pay-now:hover {
  background: rgba(46, 160, 67, 0.3) !important;
  border-color: rgba(70, 236, 115, 0.7) !important;
  color: #ffffff !important;
}

.btn-pay-now .arrow-ico {
  width: 14px !important;
  height: 14px !important;
  stroke-width: 2.2 !important;
  transition: transform 0.15s ease !important;
}

.btn-pay-now:hover .arrow-ico {
  transform: translateX(2px) !important;
}

.fin-provider-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.fin-provider-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.09);
  cursor: pointer;
  transition: all 140ms ease;
}

.fin-provider-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
}

.fin-provider-card:has(input:checked) {
  background: rgba(88, 166, 255, 0.08);
  border-color: rgba(88, 166, 255, 0.4);
  box-shadow: 0 0 0 1px rgba(88, 166, 255, 0.25);
}

.fin-provider-radio {
  accent-color: #58a6ff;
  width: 17px;
  height: 17px;
  margin: 0;
  cursor: pointer;
  flex: none;
}

.fin-provider-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
}

.fin-provider-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.fin-provider-name {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
}

.fin-provider-badge {
  font-size: 11px;
  font-weight: 600;
  color: #79c0ff;
  background: rgba(56, 139, 253, 0.15);
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid rgba(56, 139, 253, 0.25);
}

.fin-provider-hint {
  font-size: 11.5px;
  color: #8b929e;
}

/* ========================================================================== ULTRA-MODERN ADMIN PANEL REDESIGN (VKSHOP LUXURY DARK AESTHETIC) ========================================================================== */ .admin-body {
  background-color: #0c0e11 !important;
  color: #ececec !important;
}

.admin-body main.wrap {
  width: min(1380px, calc(100% - 32px)) !important;
  padding: 24px 0 60px !important;
}

/* Page Headings */
.admin-body .admin-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  gap: 16px !important;
  margin: 0 0 24px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

.admin-body .admin-head h1 {
  margin: 0 0 6px !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
}

.admin-body .admin-head .meta {
  color: #8b929e !important;
  font-size: 13.5px !important;
  margin: 0 !important;
}

.admin-body .admin-head .meta a {
  color: #a2b4cb !important;
  text-decoration: none !important;
  transition: color 140ms ease !important;
}

.admin-body .admin-head .meta a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* TOP NAVIGATION */
.admin-body .admin-topbar {
  margin: 0 0 26px !important;
}

.admin-body .admin-nav-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.admin-body .admin-main-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 8px !important;
  background: rgba(18, 21, 26, 0.85) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.admin-body .admin-tab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 9px 18px !important;
  border-radius: 11px !important;
  color: #8a919e !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  text-decoration: none !important;
  transition: all 160ms cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: 1px solid transparent !important;
}

.admin-body .admin-tab:hover {
  color: #f0f6fc !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.admin-body .admin-tab.is-active {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.06) 100%) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

.admin-body .admin-tab-icon {
  width: 17px !important;
  height: 17px !important;
  flex: none !important;
  opacity: 0.8 !important;
}

.admin-body .admin-tab.is-active .admin-tab-icon {
  opacity: 1 !important;
}

.admin-body .admin-sub-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 2px !important;
}

.admin-body .admin-sub-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 15px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  background: rgba(255, 255, 255, 0.025) !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-sub-pill:hover {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

.admin-body .admin-sub-pill.is-active {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35) !important;
}

/* CARDS & PANELS */
.admin-body .dash-card, .admin-body .admin-panel, .admin-body .block.admin-panel {
  padding: 22px 24px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 18px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(26, 30, 36, 0.7) 0%, rgba(16, 18, 22, 0.85) 100%) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 14px 34px -10px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease !important;
}

.admin-body .dash-card:hover {
  border-color: rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 20px 48px -10px rgba(0, 0, 0, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.admin-body .admin-panel h2, .admin-body .dash-card h2, .admin-body .dash-card h3 {
  margin: 0 0 16px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -0.01em !important;
}

/* KPI CARDS (Dashboard & Finance) */
.admin-body .dash-grid {
  display: grid !important;
  gap: 16px !important;
  margin-bottom: 22px !important;
}

.admin-body .kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
}

.admin-body .kpi-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 140px !important;
  padding: 22px 24px !important;
  position: relative !important;
  overflow: hidden !important;
}

.admin-body .kpi-card::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent) !important;
  opacity: 0.6 !important;
}

.admin-body .kpi-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}

.admin-body .kpi-label {
  font-size: 13px !important;
  color: #8b929e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.admin-body .kpi-badge {
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #b0b8c4 !important;
  letter-spacing: 0.02em !important;
}

.admin-body .kpi-badge.ok {
  background: rgba(93, 219, 165, 0.14) !important;
  border-color: rgba(93, 219, 165, 0.35) !important;
  color: #5ddba5 !important;
  box-shadow: 0 0 14px rgba(93, 219, 165, 0.15) !important;
}

.admin-body .kpi-badge.info {
  background: rgba(100, 160, 240, 0.14) !important;
  border-color: rgba(100, 160, 240, 0.35) !important;
  color: #7cb3ff !important;
  box-shadow: 0 0 14px rgba(100, 160, 240, 0.15) !important;
}

.admin-body .kpi-badge.warn {
  background: rgba(235, 175, 75, 0.14) !important;
  border-color: rgba(235, 175, 75, 0.35) !important;
  color: #f0be65 !important;
  box-shadow: 0 0 14px rgba(235, 175, 75, 0.15) !important;
}

.admin-body .kpi-val {
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #ffffff !important;
  margin-bottom: 10px !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}

.admin-body .kpi-foot {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  font-size: 13px !important;
  color: #8b929e !important;
  flex-wrap: wrap !important;
}

.admin-body .kpi-foot strong {
  color: #f0f6fc !important;
}

.admin-body .kpi-foot span strong[class*="ok"], .admin-body .kpi-foot strong:has(+\+) {
  color: #5ddba5 !important;
}

/* SECONDARY GRIDS (OP CARDS & TABLES) */
.admin-body .sub-grid {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
}

.admin-body .tables-grid {
  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr)) !important;
}

.admin-body .op-card-head, .admin-body .table-card-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.admin-body .op-card-head h3, .admin-body .table-card-head h3 {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.admin-body .op-link {
  font-size: 12.5px !important;
  color: #8a9fc0 !important;
  text-decoration: none !important;
  transition: color 140ms ease !important;
}

.admin-body .op-link:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

.admin-body .op-list {
  display: grid !important;
  gap: 11px !important;
}

.admin-body .op-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  font-size: 13.5px !important;
  padding-bottom: 9px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.admin-body .op-row:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.admin-body .op-row span {
  color: #8b929e !important;
}

.admin-body .op-row strong {
  color: #f0f6fc !important;
  font-variant-numeric: tabular-nums !important;
}

.admin-body .text-ok {
  color: #5ddba5 !important;
}

.admin-body .health-pill {
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
}

.admin-body .health-pill.ok {
  background: rgba(93, 219, 165, 0.12) !important;
  border: 1px solid rgba(93, 219, 165, 0.3) !important;
  color: #5ddba5 !important;
}

.admin-body .health-pill.bad {
  background: rgba(248, 113, 113, 0.12) !important;
  border: 1px solid rgba(248, 113, 113, 0.3) !important;
  color: #f87171 !important;
}

.admin-body .health-pill.neutral {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #8b929e !important;
}

/* DATA TABLES */
.admin-body .admin-table-wrap {
  overflow-x: auto !important;
}

.admin-body .dash-table, .admin-body .admin-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 13.5px !important;
  text-align: left !important;
}

.admin-body .dash-table th, .admin-body .admin-table th {
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #808694 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  white-space: nowrap !important;
}

.admin-body .dash-table td, .admin-body .admin-table td {
  padding: 14px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
  vertical-align: middle !important;
  color: #ececec !important;
  transition: background 120ms ease !important;
}

.admin-body .dash-table tr:hover td, .admin-body .admin-table tr:hover td {
  background: rgba(255, 255, 255, 0.035) !important;
}

.admin-body .dash-table tr:last-child td, .admin-body .admin-table tr:last-child td {
  border-bottom: 0 !important;
}

.admin-body .dash-table th.num, .admin-body .dash-table td.num, .admin-body .admin-table th.num, .admin-body .admin-table td.num {
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}

.admin-body .sort-link {
  color: inherit !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.admin-body .sort-link:hover, .admin-body .sort-link.is-active {
  color: #ffffff !important;
}

/* TOOLBAR & SEARCH */
.admin-body .admin-toolbar-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin-bottom: 20px !important;
}

.admin-body .admin-search-form {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}

.admin-body .admin-search-wrap {
  position: relative !important;
  flex: 1 !important;
  min-width: 240px !important;
}

.admin-body .admin-search-icon {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 17px !important;
  height: 17px !important;
  color: #6e7683 !important;
  pointer-events: none !important;
}

.admin-body .admin-search-wrap input, .admin-body .admin-search-wrap select {
  width: 100% !important;
  height: 44px !important;
  padding: 0 14px 0 42px !important;
  background: rgba(12, 14, 18, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
  transition: all 160ms ease !important;
  box-sizing: border-box !important;
}

.admin-body .admin-search-seller {
  max-width: 260px !important;
}

.admin-body .admin-search-seller input {
  padding-left: 14px !important;
}

.admin-body .admin-search-sort {
  max-width: 220px !important;
}

.admin-body .admin-search-sort select {
  padding-left: 14px !important;
  cursor: pointer !important;
}

.admin-body .admin-search-wrap input:focus, .admin-body .admin-search-wrap select:focus {
  outline: none !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06), inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
}

.admin-body .admin-filter-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.admin-body .filter-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  background: rgba(255, 255, 255, 0.025) !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
}

.admin-body .filter-pill:hover {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

.admin-body .filter-pill.is-active {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

/* FORM CONTROLS (Settings & Details) */
.admin-body .admin-form label {
  display: grid !important;
  gap: 7px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #8b929e !important;
  margin-bottom: 14px !important;
}

.admin-body .admin-form input, .admin-body .admin-form select, .admin-body .admin-form textarea {
  width: 100% !important;
  background: rgba(12, 14, 18, 0.88) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
  transition: all 160ms ease !important;
  box-sizing: border-box !important;
}

.admin-body .admin-form input:not([type="checkbox"]):not([type="radio"]), .admin-body .admin-form select {
  height: 44px !important;
}

.admin-body .admin-form input:focus, .admin-body .admin-form select:focus, .admin-body .admin-form textarea:focus {
  outline: none !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06), inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
}

.admin-body .admin-form .hint {
  font-size: 12.5px !important;
  color: #6e7683 !important;
  margin: -6px 0 14px !important;
  line-height: 1.45 !important;
}

.admin-body .settings-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px 18px !important;
}

.admin-body .settings-grid .span-2 {
  grid-column: span 2 !important;
}

@media (max-width: 820px) {
.admin-body .settings-grid {
    grid-template-columns: 1fr !important;
  }
.admin-body .settings-grid .span-2 {
    grid-column: span 1 !important;
  }
}

/* CHECKBOXES & TOGGLES */
.admin-body .admin-form label.check,
.admin-body .admin-form label.admin-check,
.admin-body .admin-form label:has(input[type="checkbox"]),
.admin-body label.check,
.admin-body label.admin-check,
.admin-body label:has(input[type="checkbox"]),
.admin-body .admin-check {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  user-select: none !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #ececec !important;
  margin: 6px 0 14px !important;
  width: auto !important;
  max-width: 100% !important;
}

.admin-body .admin-form label.check input[type="checkbox"],
.admin-body .admin-form label.admin-check input[type="checkbox"],
.admin-body .admin-form label input[type="checkbox"],
.admin-body label.check input[type="checkbox"],
.admin-body label.admin-check input[type="checkbox"],
.admin-body .admin-check input[type="checkbox"],
.admin-body .admin-form input[type="checkbox"],
.admin-body input[type="checkbox"] {
  display: inline-block !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  accent-color: #4f7df5 !important;
  cursor: pointer !important;
  margin: 0 !important;
  vertical-align: middle !important;
}

/* BUTTONS - flat modern clean */
.admin-body .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 40px !important;
  padding: 0 18px !important;
  border-radius: 9px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease !important;
  border: 1px solid transparent !important;
}

.admin-body .btn:not(.ghost):not(.danger):not(.buy) {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.admin-body .btn:not(.ghost):not(.danger):not(.buy):hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.admin-body .btn.ghost {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #d8dde6 !important;
}

.admin-body .btn.ghost:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

.admin-body .btn.danger {
  background: rgba(235, 87, 87, 0.15) !important;
  border: 1px solid rgba(235, 87, 87, 0.35) !important;
  color: #ff8b8b !important;
}

.admin-body .btn.danger:hover {
  background: rgba(235, 87, 87, 0.25) !important;
  border-color: rgba(235, 87, 87, 0.5) !important;
  color: #ffffff !important;
}

.admin-body .btn.small {
  height: 34px !important;
  padding: 0 13px !important;
  font-size: 12.5px !important;
  border-radius: 9px !important;
}

/* ERROR LOG TERMINAL */
.admin-body .error-card {
  margin-top: 18px !important;
}

.admin-body .error-log-list {
  display: grid !important;
  gap: 8px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.admin-body .error-log-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  background: rgba(235, 87, 87, 0.06) !important;
  border: 1px solid rgba(235, 87, 87, 0.2) !important;
  font-size: 13px !important;
  color: #ff9d9d !important;
}

.admin-body .error-log-time {
  color: #8b929e !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

.admin-body .error-log-body {
  word-break: break-word !important;
  line-height: 1.45 !important;
}

.admin-body .error-log-body a {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  font-weight: 500 !important;
}

.admin-body .error-log-body a:hover {
  color: #58a6ff !important;
}

/* Additional Modern Polish - Refined Header Nav */
.admin-body .admin-nav-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  flex-wrap: wrap !important;
}

.admin-body .admin-main-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 6px !important;
  background: rgba(18, 22, 28, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  width: auto !important;
}

.admin-body .admin-tab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 14px !important;
  border-radius: 10px !important;
  color: #8b929e !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  text-decoration: none !important;
  transition: all 150ms cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: 1px solid transparent !important;
  white-space: nowrap !important;
}

.admin-body .admin-tab:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.admin-body .admin-tab.is-active {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.05) 100%) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

.admin-body .admin-tab-icon {
  width: 16px !important;
  height: 16px !important;
  flex: none !important;
  opacity: 0.75 !important;
  transition: opacity 150ms ease !important;
}

.admin-body .admin-tab:hover .admin-tab-icon,
.admin-body .admin-tab.is-active .admin-tab-icon {
  opacity: 1 !important;
}

.admin-body .admin-topbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-left: auto !important;
}

.admin-body .admin-market-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  border-radius: 12px !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  background: rgba(18, 22, 28, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
  transition: all 160ms ease !important;
  white-space: nowrap !important;
}

.admin-body .admin-market-link:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
  transform: translateY(-1px) !important;
}

.admin-body .admin-sub-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 6px !important;
  background: rgba(14, 16, 22, 0.65) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  width: fit-content !important;
}

.admin-body .admin-sub-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
  white-space: nowrap !important;
}

.admin-body .admin-sub-pill:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.admin-body .admin-sub-pill.is-active {
  background: rgba(88, 166, 255, 0.12) !important;
  border-color: rgba(88, 166, 255, 0.28) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(88, 166, 255, 0.08) !important;
}

.admin-body .user-inline-cell {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.admin-body .user-avatar-mini {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #2b3038 0%, #16181d 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ececec !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  flex: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

.admin-body .spaced-bottom {
  margin-bottom: 22px !important;
}


.admin-body /* ========================================================================== FIXED ADMIN LOT CARDS & BULK TOOLBAR ========================================================================== */ .admin-bulk-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 12px 18px !important;
  border-radius: 14px !important;
  background: rgba(20, 24, 30, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  margin-bottom: 14px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
}

.admin-body .bulk-toolbar-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.admin-body .admin-bulk-select-all-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  user-select: none !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #ececec !important;
}

.admin-body .admin-bulk-check-input {
  width: 18px !important;
  height: 18px !important;
  accent-color: #4f7df5 !important;
  cursor: pointer !important;
  margin: 0 !important;
}

.admin-body .bulk-counter-badge {
  background: rgba(90, 165, 255, 0.15) !important;
  border: 1px solid rgba(90, 165, 255, 0.35) !important;
  color: #7cb3ff !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

.admin-body .bulk-counter-badge strong {
  color: #ffffff !important;
}

.admin-body .bulk-toolbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* Lot List Items */
.admin-body .admin-lot-rows {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.admin-body .admin-lot-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 16px 20px !important;
  border-radius: 16px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(26, 30, 36, 0.7) 0%, rgba(16, 18, 22, 0.85) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 10px 28px -8px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}

@media (hover: hover) and (pointer: fine) {
.admin-body .admin-lot-item:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    background: #17191d !important;
    box-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  }
}

.admin-body .admin-lot-left {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.admin-body .admin-lot-check-label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  margin-top: 2px !important;
  flex: none !important;
  cursor: pointer !important;
}

.admin-body .admin-lot-checkbox {
  width: 18px !important;
  height: 18px !important;
  accent-color: #4f7df5 !important;
  cursor: pointer !important;
  margin: 0 !important;
}

.admin-body .admin-lot-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.admin-body .admin-lot-topbar {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.admin-body .admin-lot-id {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #a2b4cb !important;
  text-decoration: none !important;
  transition: color 140ms ease !important;
}

.admin-body .admin-lot-id:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

.admin-body .admin-lot-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 2px 0 4px !important;
}

.admin-body .admin-lot-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: #8b929e !important;
}

.admin-body .meta-dot {
  opacity: 0.35 !important;
}

.admin-body .admin-lot-right {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex: none !important;
  min-width: 170px !important;
}

.admin-body .admin-lot-price {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.01em !important;
}

.admin-body .admin-lot-controls {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 8px !important;
  width: 100% !important;
}

.admin-body .admin-btn-row {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  justify-content: flex-end !important;
}

.admin-body .admin-lot-select-dropdown {
  height: 34px !important;
  width: 100% !important;
  max-width: 130px !important;
  font-size: 12.5px !important;
  padding: 0 10px !important;
  border-radius: 9px !important;
  background: rgba(12, 14, 18, 0.88) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ececec !important;
  cursor: pointer !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-lot-select-dropdown:focus {
  outline: none !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

/* Admin Listing Detail Page Styles */
.admin-body .btn-icon-xs {
  width: 13px !important;
  height: 13px !important;
  vertical-align: middle !important;
  display: inline-block !important;
  flex: none !important;
}

.admin-body .link-external {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #79c0ff !important;
  text-decoration: none !important;
}

.admin-body .link-external:hover {
  text-decoration: underline !important;
}

.admin-body .listing-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}

.admin-body .listing-head-top {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 6px !important;
}

.admin-body .price-hero {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
}

.admin-body .admin-grid-2 {
  display: grid !important;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) !important;
  gap: 20px !important;
  align-items: start !important;
}

@media (max-width: 960px) {
.admin-body .admin-grid-2 {
    grid-template-columns: 1fr !important;
  }
}

.admin-body .admin-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

.admin-body .admin-ua-box {
  background: rgba(0, 0, 0, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  margin: 10px 0 !important;
  overflow-x: auto !important;
}

.admin-body .admin-ua-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 13px !important;
  color: #79c0ff !important;
  word-break: break-all !important;
  white-space: pre-wrap !important;
}

.admin-body .admin-danger-panel {
  border: 1px solid rgba(248, 81, 73, 0.3) !important;
  background: rgba(248, 81, 73, 0.04) !important;
}


/* Admin Proxy List Card Layout & Fix for overlapping buttons */
.admin-body .proxy-box {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.admin-body .proxy-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
}

.admin-body .proxy-item-card {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(16, 18, 22, 0.75) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.admin-body .proxy-meta {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex: 1 1 0% !important;
  min-width: 0 !important;
  width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.admin-body .proxy-line-box {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.admin-body .proxy-line-box code {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 12.5px !important;
  color: #e6edf3 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

.admin-body .proxy-status-wrap {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

.admin-body .proxy-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
}

.admin-body .proxy-actions form {
  margin: 0 !important;
  display: inline-flex !important;
}

/* Finance Submit Buttons (Deposit & Withdraw) - Modern Flat Style */
.btn-fin-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 42px !important;
  padding: 0 22px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
  white-space: nowrap !important;
  width: auto !important;
  align-self: flex-start !important;
}

.btn-deposit-submit {
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #c9e6ff !important;
}

.btn-deposit-submit:hover {
  background: rgba(88, 166, 255, 0.22) !important;
  border-color: rgba(88, 166, 255, 0.6) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.btn-withdraw-submit {
  background: rgba(93, 219, 165, 0.12) !important;
  border: 1px solid rgba(93, 219, 165, 0.35) !important;
  color: #d1fae5 !important;
}

.btn-withdraw-submit:hover {
  background: rgba(93, 219, 165, 0.22) !important;
  border-color: rgba(93, 219, 165, 0.6) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
}

.btn-fin-submit .btn-icon {
  width: 17px !important;
  height: 17px !important;
  flex-shrink: 0 !important;
}

/* ==========================================================================
   SELLER PROFILE BESPOKE HERO REDESIGN
   ========================================================================== */
.seller-profile-hero {
  margin-bottom: 24px !important;
}

.seller-profile-hero .seller-avatar {
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 26px !important;
  box-shadow: 0 4px 14px rgba(29, 78, 216, 0.35) !important;
}

/* Seller hero stats in clean flat market style (no cheap rounded card box) */
.seller-profile-hero .cab-hero-stats {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding-left: 24px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.seller-profile-hero .cab-stat-item {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 20px !important;
  text-align: center !important;
  min-width: 90px !important;
  box-shadow: none !important;
  position: relative !important;
}

.seller-profile-hero .cab-stat-item + .cab-stat-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 10% !important;
  height: 80% !important;
  width: 1px !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

.seller-profile-hero .cab-stat-val {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  line-height: 1.1 !important;
}

.seller-profile-hero .cab-stat-lbl {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  margin-top: 4px !important;
}

/* Card listing row seller avatar - clean flat style, no glow or oversized shadows */
.listing-row .seller-avatar {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
  font-size: 12px !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: none !important;
}

.listing-row .seller-avatar svg {
  width: 11px !important;
  height: 11px !important;
  display: block !important;
  stroke: currentColor !important;
}

.listing-row .seller:hover .seller-avatar {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #f0f6fc !important;
  box-shadow: none !important;
}

.seller-hero-actions {
  margin-top: 12px;
}

.seller-rel-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.btn-seller-rel {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  height: 32px !important;
  padding: 0 13px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.16s ease !important;
  box-shadow: none !important;
}

/* Favorite button */
.btn-seller-rel.seller-fav-btn {
  width: auto !important;
  min-width: unset !important;
  max-width: unset !important;
  height: 32px !important;
  padding: 0 13px !important;
  background: rgba(251, 191, 36, 0.08) !important;
  border: 1px solid rgba(251, 191, 36, 0.28) !important;
  color: #fde68a !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
}

.btn-seller-rel.seller-fav-btn:hover {
  background: rgba(251, 191, 36, 0.18) !important;
  border-color: rgba(251, 191, 36, 0.5) !important;
  color: #fff !important;
}

.btn-seller-rel.seller-fav-btn.is-active {
  background: rgba(251, 191, 36, 0.22) !important;
  border-color: rgba(251, 191, 36, 0.6) !important;
  color: #fbbf24 !important;
  font-weight: 600 !important;
}

.btn-seller-rel.seller-fav-btn .star-icon {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  color: #fbbf24 !important;
  position: static !important;
  transform: none !important;
  display: inline-block !important;
  margin: 0 !important;
}

.btn-seller-rel.seller-fav-btn span,
.btn-seller-rel.seller-ignore-btn span {
  display: inline !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: normal !important;
  white-space: nowrap !important;
  font-size: 13px !important;
}

/* Ignore button */
.btn-seller-rel.seller-ignore-btn {
  width: auto !important;
  min-width: unset !important;
  max-width: unset !important;
  height: 32px !important;
  padding: 0 13px !important;
  background: rgba(248, 113, 113, 0.08) !important;
  border: 1px solid rgba(248, 113, 113, 0.25) !important;
  color: #fca5a5 !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
}

.btn-seller-rel.seller-ignore-btn:hover {
  background: rgba(248, 113, 113, 0.18) !important;
  border-color: rgba(248, 113, 113, 0.45) !important;
  color: #fff !important;
}

.btn-seller-rel.seller-ignore-btn.is-active {
  background: rgba(239, 68, 68, 0.25) !important;
  border-color: rgba(239, 68, 68, 0.6) !important;
  color: #f87171 !important;
  font-weight: 600 !important;
}

.btn-seller-rel.seller-ignore-btn .btn-icon {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  position: static !important;
  transform: none !important;
  display: inline-block !important;
  margin: 0 !important;
}


/* ==========================================================================
   MOBILE VISUAL POLISH FIXES (Cabinet, Filters, Uploads, Profile, Autobuy)
   ========================================================================== */

/* 1. Global Helpers & Badges */
.filter-btn-mobile {
  display: none !important;
}
.badge-status {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* 2. Cabinet & Profile Meta Line & Flat Stats */
.cab-meta-line {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 5px 8px !important;
  font-size: 12.5px !important;
  color: var(--muted) !important;
}
.cab-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
}
.cab-meta-sep {
  opacity: 0.45 !important;
  color: var(--muted) !important;
}
.cab-status-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #3fb950 !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
}
.cab-status-badge.blocked .cab-status-dot {
  background: #f85149 !important;
}
.cab-status-badge.frozen .cab-status-dot {
  background: #d29922 !important;
}

/* Uniform modern flat stats for all cab-hero cards */
.cab-hero-stats {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding-left: 20px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.cab-hero-stats .cab-stat-item {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 16px !important;
  text-align: center !important;
  min-width: 70px !important;
  box-shadow: none !important;
  position: relative !important;
}
.cab-hero-stats .cab-stat-item + .cab-stat-item::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 10% !important;
  height: 80% !important;
  width: 1px !important;
  background: rgba(255, 255, 255, 0.08) !important;
}
.cab-hero-stats .cab-stat-val {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #f0f6fc !important;
  line-height: 1.1 !important;
}
.cab-hero-stats .cab-stat-lbl {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  margin-top: 3px !important;
}

/* 3. Mobile Specific Rules (<= 640px) */
@media (max-width: 640px) {
  /* Catalog Filters Header Action Strip */
  .filter-btn-full {
    display: none !important;
  }
  .filter-btn-mobile {
    display: inline !important;
  }
  .filter-head-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 6px !important;
    width: 100% !important;
    padding-bottom: 2px !important;
  }
  .filter-head-actions::-webkit-scrollbar {
    display: none !important;
  }
  .filter-action-btn,
  .filter-reset-btn {
    flex: 1 1 0 !important;
    min-width: max-content !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
  }

  /* Cabinet Page Meta & KPI Cards */
  .cab-meta-line {
    font-size: 11.5px !important;
    gap: 4px 6px !important;
  }
  .cab-kpi-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .cab-kpi-card.highlight {
    grid-column: 1 / -1 !important;
    height: auto !important;
    min-height: 64px !important;
    padding: 12px 16px !important;
  }
  .cab-kpi-card.highlight .cab-kpi-val {
    font-size: 20px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }
  .cab-kpi-card:not(.highlight) .cab-kpi-val {
    font-size: 15px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .cab-kpi-card:not(.highlight) .cab-kpi-lbl {
    font-size: 11px !important;
  }

  /* Mass Uploads Mini Summary Bar */
  .mini-summary-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    padding: 11px 14px !important;
    margin-bottom: 14px !important;
  }
  .mini-summary-bar .mini-sep {
    display: none !important;
  }
  .mini-summary-bar .mini-stat-item {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #e6edf3 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
  }
  .mini-summary-bar .mini-summary-note {
    font-size: 11.5px !important;
    color: #8b929e !important;
    margin-left: 0 !important;
    padding-left: 17px !important;
  }
  .cab-kpi-card:last-child {
    grid-column: 1 / -1 !important;
  }

  /* Profile Page Hero Stats & Subtab Header */
  .cab-hero .cab-hero-stats {
    width: 100% !important;
    justify-content: center !important;
    padding-left: 0 !important;
    border-left: none !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    margin-top: 6px !important;
  }
  .cab-section-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
  }
  .cab-section-head h3 {
    margin: 0 !important;
    font-size: 16px !important;
  }
  .profile-subtabs {
    width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 6px !important;
    padding-bottom: 2px !important;
  }
  .profile-subtabs::-webkit-scrollbar {
    display: none !important;
  }
  .profile-subtab-pill {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }

  /* Autobuy Control Hero Card */
  .autobuy-control-hero {
    padding: 16px !important;
    gap: 14px !important;
  }
  .autobuy-hero-left {
    align-items: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
  }
  .autobuy-hero-titles {
    flex: 1 !important;
    min-width: 0 !important;
  }
  .autobuy-hero-titles h2 {
    font-size: 16.5px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px 8px !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
  }
  .autobuy-hero-meta {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
}


/* Account tools (listings / orders bar) layout */
.account-tools {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}
.account-lead {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-width: 0 !important;
}
.account-actions-strip {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

@media (max-width: 640px) {
  .account-tools {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin: 12px 0 14px !important;
  }
  .account-lead {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 10px !important;
  }
  .account-tools .account-sum {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #8b929e !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: 0 !important;
  }
  .account-tools .mass-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: #8b929e !important;
    flex-shrink: 0 !important;
  }
  .account-tools .mass-label input {
    width: 85px !important;
    min-width: 85px !important;
    height: 32px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
    border-radius: 7px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: #f0f6fc !important;
    box-sizing: border-box !important;
  }
  .account-actions-strip {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
  }
  .account-actions-strip #mark-toggle {
    flex: 1 1 0 !important;
    height: 34px !important;
    padding: 0 12px !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    justify-content: center !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
  }
  .account-actions-strip details.mass {
    flex: 1 1 0 !important;
  }
  .account-actions-strip details.mass > summary {
    width: 100% !important;
    height: 34px !important;
    padding: 0 12px !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    justify-content: center !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-sizing: border-box !important;
  }
  .account-tools.is-picking .account-actions-strip {
    flex-wrap: wrap !important;
  }
  .account-tools.is-picking .mark-all {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: #e6edf3 !important;
    margin: 0 !important;
    padding: 0 4px !important;
  }
}


/* ==========================================================================
   SELL PAGE REFINEMENTS (Hero Showcase & Compact Quality Cards)
   ========================================================================== */

/* Hero Grid with Art Card */
.sell-hero {
  display: grid !important;
  grid-template-columns: 1fr 340px !important;
  gap: 24px !important;
  align-items: center !important;
  padding-bottom: 24px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sell-hero-art {
  display: block !important;
}

.sell-art-card {
  position: relative;
  background: linear-gradient(135deg, rgba(20, 24, 33, 0.75) 0%, rgba(13, 16, 22, 0.9) 100%);
  border: 1px solid rgba(88, 166, 255, 0.16);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  overflow: hidden;
  backdrop-filter: blur(8px);
}

.sell-art-glow {
  position: absolute;
  top: -30px;
  right: -30px;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle, rgba(88, 166, 255, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

.sell-art-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.sell-art-pulse-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  color: #7ee787;
  letter-spacing: -0.01em;
}

.sell-pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #3fb950;
  box-shadow: 0 0 8px #3fb950;
  display: inline-block;
  flex-shrink: 0;
  animation: sell-pulse 2s infinite;
}

@keyframes sell-pulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(63, 185, 80, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(63, 185, 80, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(63, 185, 80, 0); }
}

.sell-art-tag {
  font-size: 10.5px;
  font-weight: 700;
  color: #38bdf8;
  background: rgba(56, 189, 248, 0.12);
  border: 1px solid rgba(56, 189, 248, 0.28);
  padding: 2px 7px;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.sell-art-features {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.sell-art-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sell-art-ico {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sell-art-ico.emerald {
  background: rgba(63, 185, 80, 0.14);
  color: #3fb950;
  border: 1px solid rgba(63, 185, 80, 0.25);
}

.sell-art-ico.blue {
  background: rgba(88, 166, 255, 0.14);
  color: #58a6ff;
  border: 1px solid rgba(88, 166, 255, 0.25);
}

.sell-art-ico svg {
  width: 14px;
  height: 14px;
}

.sell-art-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.sell-art-title {
  font-size: 12px;
  font-weight: 600;
  color: #f0f6fc;
  line-height: 1.2;
}

.sell-art-sub {
  font-size: 10.5px;
  color: #8b929e;
  line-height: 1.2;
  margin-top: 1px;
}

/* 2. COMPACT QUALITY PARAMETER CARDS (Section 2) */
.sell-status-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
}

.sell-status-card {
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 56px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease !important;
}

.sell-status-card:hover {
  border-color: rgba(255, 255, 255, 0.15) !important;
}

.sell-status-card-header {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

.sell-icon-box {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.sell-icon-box svg.ico {
  width: 15px !important;
  height: 15px !important;
}

.sell-icon-box.blue {
  background: rgba(88, 166, 255, 0.14) !important;
  color: #58a6ff !important;
  border: 1px solid rgba(88, 166, 255, 0.25) !important;
}

.sell-icon-box.emerald {
  background: rgba(63, 185, 80, 0.14) !important;
  color: #3fb950 !important;
  border: 1px solid rgba(63, 185, 80, 0.25) !important;
}

.sell-card-labels {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
}

.sell-card-title {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.sell-card-subtitle {
  font-size: 11px !important;
  color: #8b929e !important;
  line-height: 1.2 !important;
  margin-top: 2px !important;
  white-space: nowrap !important;
}

.sell-dual-pill {
  width: 210px !important;
  flex-shrink: 0 !important;
  height: 34px !important;
  background: #14171d !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  padding: 2px !important;
  display: flex !important;
  box-sizing: border-box !important;
}

.sell-pill-btn {
  height: 100% !important;
  padding: 0 8px !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
  color: #8b929e !important;
  transition: all 0.15s ease !important;
}

.sell-pill-btn svg.ico {
  width: 13px !important;
  height: 13px !important;
}

/* Mobile responsive rules */
@media (max-width: 860px) {
  .sell-hero {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .sell-hero-art {
    display: none !important;
  }
}

@media (max-width: 640px) {
  .sell-status-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .sell-status-card {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 12px 14px !important;
    gap: 10px !important;
    height: auto !important;
  }
  .sell-dual-pill {
    width: 100% !important;
    height: 36px !important;
  }
}


/* Precision fix for Sell Section 2 bounds and compact Да/Нет toggle */
.sell-form-section {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.sell-status-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.sell-status-card {
  background: #0f1115 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-height: 54px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

.sell-status-card-header {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 1 0 !important;
  overflow: hidden !important;
}

.sell-card-labels {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  flex: 1 1 0 !important;
  overflow: hidden !important;
}

.sell-card-title {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.sell-card-subtitle {
  font-size: 11px !important;
  color: #8b929e !important;
  line-height: 1.2 !important;
  margin-top: 2px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Compact Да / Нет toggle (104px width) */
.sell-dual-pill.sell-choice-toggle {
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  flex-shrink: 0 !important;
  height: 32px !important;
  background: #14171d !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  padding: 2px !important;
  display: flex !important;
  box-sizing: border-box !important;
}

.sell-dual-pill.sell-choice-toggle .sell-pill-label {
  flex: 1 1 0 !important;
  margin: 0 !important;
  height: 100% !important;
  display: flex !important;
  cursor: pointer !important;
}

.sell-dual-pill.sell-choice-toggle .sell-pill-btn {
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #8b929e !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  transition: all 0.15s ease !important;
  user-select: none !important;
}

.sell-dual-pill.sell-choice-toggle .sell-pill-label:hover .sell-pill-btn {
  color: #f0f6fc !important;
}

.sell-dual-pill.sell-choice-toggle .sell-pill-label input:checked + .sell-pill-btn {
  background: rgba(88, 166, 255, 0.16) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  border-color: rgba(88, 166, 255, 0.4) !important;
}

@media (max-width: 640px) {
  .sell-status-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  .sell-status-card {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 12px !important;
    height: 52px !important;
    min-height: 52px !important;
  }
  .sell-dual-pill.sell-choice-toggle {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    height: 30px !important;
  }
}

.sell-hero-art {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  pointer-events: none !important;
  user-select: none !important;
}
.sell-vector-watermark {
  width: 240px !important;
  height: 130px !important;
  opacity: 0.75 !important;
}


/* Sell Hero 3D Reference Illustration */
.sell-hero {
  display: grid !important;
  grid-template-columns: 1fr 340px !important;
  gap: 20px !important;
  align-items: center !important;
  padding-bottom: 24px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sell-hero-art {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  pointer-events: none !important;
  user-select: none !important;
}

.sell-art-img {
  width: 340px !important;
  height: auto !important;
  max-height: 220px !important;
  object-fit: contain !important;
  display: block !important;
  filter: drop-shadow(0 10px 25px rgba(0, 0, 0, 0.45)) !important;
}

@media (max-width: 860px) {
  .sell-hero {
    grid-template-columns: 1fr !important;
  }
  .sell-hero-art {
    display: none !important;
  }
}


/* Compact melted 3D reference art (no extra height, no visible box boundaries) */
.sell-hero {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 20px !important;
  align-items: center !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  min-height: 0 !important;
}

.sell-hero-copy {
  display: grid !important;
  gap: 8px !important;
}

.sell-hero-art {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  pointer-events: none !important;
  user-select: none !important;
  height: 135px !important;
  max-height: 135px !important;
}

.sell-art-img {
  width: auto !important;
  height: 135px !important;
  max-height: 135px !important;
  max-width: 200px !important;
  object-fit: contain !important;
  display: block !important;
  -webkit-mask-image: radial-gradient(ellipse 95% 90% at 55% 50%, black 50%, transparent 100%) !important;
  mask-image: radial-gradient(ellipse 95% 90% at 55% 50%, black 50%, transparent 100%) !important;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)) !important;
}

@media (max-width: 860px) {
  .sell-hero {
    grid-template-columns: 1fr !important;
  }
  .sell-hero-art {
    display: none !important;
  }
}


/* Modern Extension Browser Selector Switch - Pixel-perfect Dual Pill */
.guide-pick.choice.pair-set .choice-set {
  display: flex !important;
  background: #14171d !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  padding: 3px !important;
  height: 36px !important;
  max-width: 220px !important;
  gap: 3px !important;
  box-sizing: border-box !important;
  align-items: stretch !important;
}

.guide-pick.choice.pair-set .choice-set label {
  flex: 1 1 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  height: 100% !important;
  cursor: pointer !important;
  display: flex !important;
}

.guide-pick.choice.pair-set .choice-set label + label {
  box-shadow: none !important;
}

.guide-pick.choice.pair-set .choice-set span {
  width: 100% !important;
  height: 100% !important;
  min-height: unset !important;
  max-height: unset !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  color: #8b929e !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  box-sizing: border-box !important;
  transition: all 0.15s ease !important;
  user-select: none !important;
}

.guide-pick.choice.pair-set .choice-set label:hover span {
  color: #f0f6fc !important;
}

.guide-pick.choice.pair-set .choice-set input:checked + span,
.guide-pick.choice.pair-set .choice-set label:hover input:checked + span {
  background: rgba(88, 166, 255, 0.16) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  border-color: rgba(88, 166, 255, 0.4) !important;
  box-shadow: none !important;
}



/* Admin Alert Styles */
.admin-alert {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 18px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  margin-bottom: 1.25rem !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  background: rgba(251, 191, 36, 0.08) !important;
  color: #fbbf24 !important;
}

.admin-alert-warn {
  border-color: rgba(251, 191, 36, 0.3) !important;
  background: rgba(251, 191, 36, 0.08) !important;
  color: #fbbf24 !important;
}

.admin-alert-ico {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  flex: none !important;
  color: #fbbf24 !important;
  display: block !important;
}

/* --- Admin Visual Alignment Fixes --- */
.dash-quick-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.dash-quick-actions form {
  margin: 0 !important;
  display: inline-flex !important;
}

.admin-alert .btn {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.proxy-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.proxy-head-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

.proxy-head-actions form,
.proxy-head-actions .admin-inline {
  margin: 0 !important;
  display: inline-flex !important;
}

.proxy-head-actions .btn {
  white-space: nowrap !important;
  word-break: keep-all !important;
  flex-shrink: 0 !important;
}

/* ==========================================================================
   ADMIN PANEL MODERNIZATION: LEGACY SECTIONS UPGRADE
   (Checker Uploads, Run Details, Activity Journal, Reviews & Categories)
   ========================================================================== */

/* Modern Grid for admin-stats in API, Dating, Checks */
.admin-body .stats.admin-stats {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
  gap: 14px !important;
  margin: 0 0 24px !important;
}

.admin-body .stats.admin-stats > div {
  padding: 16px 18px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
  transition: transform 140ms ease, border-color 140ms ease !important;
}

.admin-body .stats.admin-stats > div:hover {
  border-color: rgba(255, 255, 255, 0.16) !important;
  transform: translateY(-2px) !important;
}

.admin-body .stats.admin-stats span {
  display: block !important;
  color: #8b929e !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.admin-body .stats.admin-stats strong {
  display: block !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
}

/* Modern Filters: .admin-uploads-filters & .admin-journal-filters & .ops-filters */
.admin-body .ops-filters.admin-uploads-filters,
.admin-body .ops-filters.admin-journal-filters,
.admin-body .admin-check-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 12px !important;
  padding: 18px 20px !important;
  background: rgba(255, 255, 255, 0.025) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  margin: 0 0 22px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

.admin-body .admin-filter-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.admin-body .admin-filter-field .filter-caption,
.admin-body .filter-choice .filter-caption {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}

.admin-body .admin-filter-field input,
.admin-body .admin-filter-field select {
  height: 38px !important;
  padding: 0 14px !important;
  background: rgba(0, 0, 0, 0.3) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  outline: none !important;
  transition: border-color 140ms ease, box-shadow 140ms ease !important;
}

.admin-body .admin-filter-field input:focus,
.admin-body .admin-filter-field select:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.15) !important;
}

/* Multi-select filter trigger modernization */
.admin-body .multi-select-trigger {
  height: 38px !important;
  padding: 0 14px !important;
  background: rgba(0, 0, 0, 0.3) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
}

.admin-body .multi-select-menu {
  background: #14171d !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6) !important;
}

.admin-body .multi-select-option {
  color: #e0e0e0 !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}

.admin-body .multi-select-option:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

/* Checker Session Cards (.admin-upload-list, .admin-upload-card) */
.admin-body .admin-upload-list {
  display: grid !important;
  gap: 14px !important;
}

.admin-body .admin-upload-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 18px 22px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-upload-card:hover {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

.admin-body .admin-upload-id {
  font-weight: 700 !important;
  font-size: 15px !important;
  color: #58a6ff !important;
  text-decoration: none !important;
}

.admin-body .admin-upload-top {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 8px !important;
}

.admin-body .admin-upload-who {
  margin: 0 0 10px !important;
  font-size: 13.5px !important;
  color: #8b929e !important;
}

.admin-body .admin-upload-who a {
  color: #f0f6fc !important;
  font-weight: 600 !important;
}

.admin-body .admin-upload-side {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* Checker Item Cards in checker_run (.admin-upload-items, .admin-upload-item) */
.admin-body .admin-upload-items {
  display: grid !important;
  gap: 10px !important;
}

.admin-body .admin-upload-item {
  padding: 16px 20px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
  transition: all 120ms ease !important;
}

.admin-body .admin-upload-item:hover {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.admin-body .admin-upload-item-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 10px !important;
}

.admin-body .admin-upload-item-num {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #8b929e !important;
}

.admin-body .checker-file {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 13px !important;
  color: #ffffff !important;
  background: rgba(0, 0, 0, 0.35) !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  margin-bottom: 8px !important;
}

.admin-body .checker-reason {
  font-size: 13px !important;
  color: #ff7b72 !important;
  background: rgba(255, 123, 114, 0.08) !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255, 123, 114, 0.2) !important;
  margin-bottom: 8px !important;
}

/* Reviews and Categories Lists (.admin-list, .admin-row) */
.admin-body .admin-list {
  display: grid !important;
  gap: 12px !important;
}

.admin-body .admin-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px 20px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15) !important;
}

.admin-body .admin-row:hover {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.admin-body .admin-row strong {
  color: #ffffff !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
}

.admin-body .admin-row p {
  color: #8b929e !important;
  font-size: 13.5px !important;
  margin: 4px 0 0 !important;
}

.admin-body .admin-row .meta {
  color: #6e7681 !important;
  font-size: 12px !important;
}

/* ==========================================================================
   ADMIN MULTI-SELECT DROPDOWN REFINEMENTS (WIDTH, SCROLLBAR & TYPOGRAPHY)
   ========================================================================== */
.admin-body .multi-select.filter-choice {
  position: relative !important;
  min-width: 220px !important;
  z-index: 50 !important;
}

.admin-body .multi-select.filter-choice:focus-within,
.admin-body .multi-select.filter-choice:has([aria-expanded="true"]) {
  z-index: 110 !important;
}

.admin-body .multi-select-trigger {
  width: 100% !important;
  min-width: 200px !important;
  justify-content: space-between !important;
  white-space: nowrap !important;
}

.admin-body .multi-select-menu {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  min-width: 240px !important;
  width: max-content !important;
  max-width: 320px !important;
  max-height: 260px !important;
  background: #14171f !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
  padding: 6px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  z-index: 100 !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255, 255, 255, 0.2) transparent !important;
}

/* Custom Sleek Scrollbar for Admin Dropdown */
.admin-body .multi-select-menu::-webkit-scrollbar {
  width: 5px !important;
}

.admin-body .multi-select-menu::-webkit-scrollbar-track {
  background: transparent !important;
}

.admin-body .multi-select-menu::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.18) !important;
  border-radius: 10px !important;
}

.admin-body .multi-select-menu::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3) !important;
}

.admin-body .multi-select-option {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  color: #d1d7e0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: all 120ms ease !important;
}

.admin-body .multi-select-option:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  color: #ffffff !important;
}

.admin-body .multi-select-option:has(input:checked) {
  background: rgba(88, 166, 255, 0.12) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
}

.admin-body .multi-select-text {
  flex: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.admin-body .multi-select-check {
  font-size: 12px !important;
  opacity: 0 !important;
  color: #58a6ff !important;
  font-weight: 700 !important;
}

.admin-body .multi-select-option:has(input:checked) .multi-select-check {
  opacity: 1 !important;
}
/* ==========================================================================
   CHECK AUDIT & TRACE LOG PANEL (ADMIN)
   ========================================================================== */

.admin-body .check-audit-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.admin-body .check-audit-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.admin-body .check-audit-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.admin-body .check-audit-title h2 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.admin-body .badge-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-dim, #8b949e) !important;
}

.admin-body .check-audit-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.admin-body .check-audit-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 12px 14px !important;
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 8px !important;
  transition: border-color 0.15s ease !important;
}

.admin-body .check-audit-item:hover {
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.admin-body .check-audit-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.admin-body .check-audit-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
}

.admin-body .badge-success {
  background: rgba(46, 160, 67, 0.15) !important;
  color: #3fb950 !important;
  border: 1px solid rgba(46, 160, 67, 0.3) !important;
}

.admin-body .badge-danger {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
  border: 1px solid rgba(248, 81, 73, 0.3) !important;
}

.admin-body .badge-warn {
  background: rgba(210, 153, 34, 0.15) !important;
  color: #d29922 !important;
  border: 1px solid rgba(210, 153, 34, 0.3) !important;
}

.admin-body .badge-info {
  background: rgba(88, 166, 255, 0.15) !important;
  color: #58a6ff !important;
  border: 1px solid rgba(88, 166, 255, 0.3) !important;
}

.admin-body .check-audit-time {
  font-size: 11px !important;
  color: var(--text-dim, #8b949e) !important;
}

.admin-body .check-audit-reason {
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: var(--text, #c9d1d9) !important;
  word-break: break-word !important;
}

.admin-body .check-trace-details {
  border-top: 1px dashed rgba(255, 255, 255, 0.08) !important;
  padding-top: 8px !important;
  margin-top: 2px !important;
}

.admin-body .check-trace-summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  cursor: pointer !important;
  font-size: 11.5px !important;
  color: #58a6ff !important;
  user-select: none !important;
}

.admin-body .check-trace-summary:hover {
  text-decoration: underline !important;
}

.admin-body .trace-duration {
  font-size: 11px !important;
  color: var(--text-dim, #8b949e) !important;
  font-family: monospace !important;
}

.admin-body .check-trace-body {
  margin-top: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 10px !important;
  background: rgba(0, 0, 0, 0.25) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
}

.admin-body .trace-param {
  display: flex !important;
  gap: 8px !important;
  line-height: 1.35 !important;
}

.admin-body .trace-key {
  color: var(--text-dim, #8b949e) !important;
  min-width: 80px !important;
  flex-shrink: 0 !important;
}

.admin-body .trace-val {
  color: #c9d1d9 !important;
  word-break: break-all !important;
}

.admin-body .trace-steps-timeline {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.admin-body .trace-step-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 11.5px !important;
}

.admin-body .trace-step-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

.admin-body .trace-step-dot.step-ok {
  background: #3fb950 !important;
  box-shadow: 0 0 5px rgba(63, 185, 80, 0.4) !important;
}

.admin-body .trace-step-dot.step-fail {
  background: #f85149 !important;
  box-shadow: 0 0 5px rgba(248, 81, 73, 0.4) !important;
}

.admin-body .trace-step-name {
  color: #c9d1d9 !important;
}

.admin-body .trace-step-code {
  font-size: 10.5px !important;
  padding: 1px 5px !important;
  border-radius: 4px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #8b949e !important;
}

.admin-body .trace-step-time {
  margin-left: auto !important;
  color: var(--text-dim, #8b949e) !important;
  font-family: monospace !important;
  font-size: 11px !important;
}

.admin-body .trace-step-err {
  color: #f85149 !important;
  font-size: 11px !important;
}

.admin-body .check-shield-icon {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  flex: none !important;
  display: block !important;
  color: var(--accent, #58a6ff) !important;
}


/* VK Знакомства chips */
.chip-ico.ico-dating {
  width: 13px;
  height: 13px;
  margin-right: 5px;
  flex-shrink: 0;
}
.chip.chip-dating-ban {
  background: rgba(239, 68, 68, 0.12) !important;
  border-color: rgba(239, 68, 68, 0.32) !important;
  color: #f87171 !important;
  font-weight: 600 !important;
}
.chip.chip-dating-verify {
  background: rgba(245, 158, 11, 0.12) !important;
  border-color: rgba(245, 158, 11, 0.32) !important;
  color: #fbbf24 !important;
  font-weight: 600 !important;
}
.chip.chip-dating-clean {
  background: rgba(16, 185, 129, 0.12) !important;
  border-color: rgba(16, 185, 129, 0.32) !important;
  color: #34d399 !important;
  font-weight: 600 !important;
}
.chip.chip-dating-uncheck {
  background: rgba(148, 163, 184, 0.08) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  color: #94a3b8 !important;
}


/* Массовые покупки: бейджи и фильтры в админке */
.cell-filters {
  vertical-align: middle;
}
.bulk-badges-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  max-width: 320px;
}
.bulk-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 500;
  line-height: 1.25;
  background: rgba(255, 255, 255, 0.05);
  color: var(--text, #c9d1d9);
  border: 1px solid rgba(255, 255, 255, 0.08);
  white-space: nowrap;
}
.bulk-badge.dating {
  background: rgba(234, 76, 137, 0.15) !important;
  color: #ff5e97 !important;
  border-color: rgba(234, 76, 137, 0.35) !important;
  font-weight: 600;
}
.bulk-badge.price {
  background: rgba(46, 160, 67, 0.14) !important;
  color: #56d364 !important;
  border-color: rgba(46, 160, 67, 0.3) !important;
  font-weight: 600;
}
.bulk-badge.category {
  background: rgba(88, 166, 255, 0.12) !important;
  color: #79c0ff !important;
  border-color: rgba(88, 166, 255, 0.25) !important;
}
.bulk-badge.profile {
  background: rgba(210, 153, 34, 0.12) !important;
  color: #e3b341 !important;
  border-color: rgba(210, 153, 34, 0.25) !important;
}
.bulk-badge.query {
  background: rgba(163, 113, 247, 0.12) !important;
  color: #d2a8ff !important;
  border-color: rgba(163, 113, 247, 0.25) !important;
}
.bulk-badge.more {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-dim, #8b949e);
  cursor: help;
}

.admin-body .bulk-filters-card,
.bulk-filters-card {
  background: var(--raise-solid, #15181f);
  border: 1px solid var(--line, rgba(255, 255, 255, 0.07));
  border-radius: var(--radius, 14px);
  padding: 18px 22px;
  margin: 0 0 28px 0 !important;
  display: block !important;
  clear: both !important;
  position: relative !important;
}

.admin-body .stats.admin-stats {
  margin: 28px 0 28px 0 !important;
  clear: both !important;
}
.bulk-filters-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}
.bulk-filter-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.bulk-filter-item:hover {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.045);
}
.bulk-filter-item.is-highlighted {
  background: rgba(234, 76, 137, 0.08);
  border-color: rgba(234, 76, 137, 0.28);
}
.bulk-filter-label {
  font-size: 11px;
  color: var(--text-dim, #8b949e);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}
.bulk-filter-val {
  font-size: 13.5px;
  color: var(--text, #c9d1d9);
  word-break: break-word;
}
.bulk-filter-val.dating-val {
  color: #ff5e97;
  font-weight: 600;
}
.bulk-filter-val.price-val {
  color: #56d364;
  font-weight: 600;
}


/* ==========================================================================
   ADMIN PANEL REDESIGN (DESIGN SYSTEM V2 COMPLIANT)
   Strictly Scoped to .admin-body (Zero disruption to public marketplace)
   ========================================================================== */

/* Spacing between independent blocks */
.admin-body .dash-card,
.admin-body .admin-panel,
.admin-body .block.admin-panel,
.admin-body .table-card {
  margin-bottom: 28px !important;
}

/* Secondary Sub Navigation (.admin-sub used in dating, security, etc.) */
.admin-body .admin-sub {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 24px !important;
}

.admin-body .admin-sub a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.025) !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-sub a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.admin-body .admin-sub a[aria-current="page"],
.admin-body .admin-sub a.is-active {
  background: rgba(88, 166, 255, 0.12) !important;
  border-color: rgba(88, 166, 255, 0.3) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(88, 166, 255, 0.1) !important;
}

/* Polished Toolbar & Filters Box */
.admin-body .admin-toolbar-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin-bottom: 24px !important;
  padding: 16px 20px !important;
  background: rgba(18, 22, 28, 0.65) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
}

.admin-body .admin-filter-pill,
.admin-body .filter-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-filter-pill:hover,
.admin-body .filter-pill:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.admin-body .admin-filter-pill.is-active,
.admin-body .filter-pill.is-active {
  background: rgba(88, 166, 255, 0.14) !important;
  border-color: rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(88, 166, 255, 0.12) !important;
}

/* Polished Form Inputs in Admin */
.admin-body input[type="text"],
.admin-body input[type="search"],
.admin-body input[type="number"],
.admin-body input[type="date"],
.admin-body textarea,
.admin-body select {
  background: rgba(14, 16, 20, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 10px !important;
  color: #ececec !important;
  font-size: 13.5px !important;
  transition: border-color 150ms ease, box-shadow 150ms ease !important;
}

.admin-body input:focus,
.admin-body textarea:focus,
.admin-body select:focus {
  border-color: rgba(88, 166, 255, 0.4) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
}

/* Empty States */
.admin-body .empty,
.admin-body .empty.block {
  text-align: center !important;
  padding: 40px 20px !important;
  color: #8b929e !important;
  font-size: 14px !important;
  background: rgba(18, 22, 28, 0.4) !important;
  border: 1px dashed rgba(255, 255, 255, 0.09) !important;
  border-radius: 16px !important;
  margin: 0 0 28px !important;
}

/* Table Row Hover & Actions */
.admin-body .backup-actions,
.admin-body .admin-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}


/* ==========================================================================
   V2 ADMIN POLISH: STATS & FILTERS (COMPLIANT WITH DESIGN SYSTEM)
   ========================================================================== */

/* Enhanced Stats Grid (.stats.admin-stats in API, Dating, Checks) */
.admin-body .stats.admin-stats {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 0 28px 0 !important;
  clear: both !important;
}

.admin-body .stats.admin-stats > div {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 96px !important;
  padding: 18px 20px !important;
  border-radius: 16px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(28, 32, 40, 0.75) 0%, rgba(16, 18, 22, 0.9) 100%) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 8px 26px -4px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease !important;
}

.admin-body .stats.admin-stats > div::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent) !important;
  opacity: 0.6 !important;
}

.admin-body .stats.admin-stats > div:hover {
  border-color: rgba(255, 255, 255, 0.18) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 34px -4px rgba(0, 0, 0, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.admin-body .stats.admin-stats span {
  display: block !important;
  color: #8b929e !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 8px !important;
}

.admin-body .stats.admin-stats strong {
  display: block !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
  font-variant-numeric: tabular-nums !important;
}

/* Enhanced Ops & Journal Filters Toolbar */
.admin-body .ops-filters,
.admin-body .ops-filters.admin-journal-filters,
.admin-body .ops-filters.admin-uploads-filters,
.admin-body .ops-filters.admin-check-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 12px !important;
  padding: 16px 20px !important;
  background: rgba(18, 22, 28, 0.7) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.3) !important;
  margin: 0 0 28px !important;
  position: relative !important;
  z-index: 40 !important;
}

.admin-body .ops-filters:focus-within,
.admin-body .ops-filters:has(.multi-select-menu:not([hidden])),
.admin-body .ops-filters:has([aria-expanded="true"]) {
  z-index: 100 !important;
}

.admin-body .ops-filters .admin-filter-field,
.admin-body .ops-filters .filter-choice {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.admin-body .ops-filters .filter-caption {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.admin-body .ops-filters input[type="text"],
.admin-body .ops-filters input[type="search"],
.admin-body .ops-filters input[type="number"],
.admin-body .ops-filters input[type="date"],
.admin-body .ops-filters input:not([type]),
.admin-body .ops-filters select,
.admin-body .ops-filters .multi-select-trigger {
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 14px !important;
  background: rgba(12, 14, 18, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  font-size: 13.5px !important;
  transition: all 140ms ease !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
}

.admin-body .ops-filters input:focus,
.admin-body .ops-filters select:focus,
.admin-body .ops-filters .multi-select-trigger:focus,
.admin-body .ops-filters .multi-select-trigger[aria-expanded="true"] {
  border-color: rgba(88, 166, 255, 0.45) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.12) !important;
}

.admin-body .ops-filters .multi-select-caret {
  margin-left: 8px !important;
  color: #8b929e !important;
}

.admin-body .ops-filters .btn,
.admin-body .ops-filters button[type="submit"] {
  height: 40px !important;
  padding: 0 20px !important;
  border-radius: 10px !important;
  background: rgba(88, 166, 255, 0.16) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 140ms ease !important;
  text-decoration: none !important;
}

.admin-body .ops-filters .btn:hover,
.admin-body .ops-filters button[type="submit"]:hover {
  background: rgba(88, 166, 255, 0.28) !important;
  border-color: rgba(88, 166, 255, 0.5) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(88, 166, 255, 0.2) !important;
}

.admin-body .ops-filters .btn.ghost {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #8b929e !important;
}

.admin-body .ops-filters .btn.ghost:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}


/* ==========================================================================
   V3 ADMIN POLISH: CHECKER CARDS & RUN DETAILS (DESIGN_SYSTEM COMPLIANT)
   ========================================================================== */

.admin-body .admin-upload-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin-bottom: 28px !important;
}

/* Checker Admin Redesign (Market Modern Dark Style) */
.admin-body .admin-upload-card {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 18px 22px !important;
  border-radius: 16px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(26, 30, 38, 0.75) 0%, rgba(14, 16, 20, 0.9) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35) !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease !important;
  position: relative !important;
  overflow: hidden !important;
}

.admin-body .admin-upload-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.12) 50%, transparent 100%) !important;
  pointer-events: none !important;
}

.admin-body .admin-upload-card:hover {
  background: radial-gradient(120% 120% at 50% 0%, rgba(32, 38, 50, 0.85) 0%, rgba(16, 18, 24, 0.95) 100%) !important;
  border-color: rgba(79, 140, 255, 0.32) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.55), 0 0 20px rgba(79, 140, 255, 0.06) !important;
}

.admin-body .admin-upload-main {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.admin-body .admin-upload-top {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
  flex-wrap: wrap !important;
}

.admin-body .admin-upload-id {
  font-weight: 700 !important;
  font-size: 13px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  color: #58a6ff !important;
  background: rgba(88, 166, 255, 0.12) !important;
  border: 1px solid rgba(88, 166, 255, 0.28) !important;
  padding: 2px 9px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all 140ms ease !important;
  letter-spacing: 0.03em !important;
}

.admin-body .admin-upload-id:hover {
  background: rgba(88, 166, 255, 0.24) !important;
  color: #ffffff !important;
  border-color: #58a6ff !important;
}

.admin-body .admin-upload-tag {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  padding: 2px 9px !important;
  border-radius: 6px !important;
  letter-spacing: 0.02em !important;
}

.admin-body .admin-upload-date {
  font-size: 12.5px !important;
  color: #7d8590 !important;
  font-feature-settings: "tnum" 1 !important;
}

.admin-body .admin-upload-info-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
  flex-wrap: wrap !important;
}

.admin-body .admin-upload-user {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: color 140ms ease !important;
}

.admin-body .admin-upload-user:hover {
  color: #58a6ff !important;
}

.admin-body .admin-upload-ip {
  font-size: 11.5px !important;
  color: #7d8590 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding: 1px 7px !important;
  border-radius: 5px !important;
}

.admin-body .admin-upload-sep {
  color: #484f58 !important;
  font-weight: 700 !important;
}

.admin-body .admin-upload-count {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
}

.admin-body .admin-upload-price {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #56d364 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

.admin-body .admin-proxy-chip {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #38bdf8 !important;
  background: rgba(56, 189, 248, 0.12) !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  letter-spacing: 0.02em !important;
}

.admin-body .admin-upload-who {
  margin: 0 0 6px !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.admin-body .admin-upload-who a {
  color: #ffffff !important;
  text-decoration: none !important;
  transition: color 140ms ease !important;
}

.admin-body .admin-upload-who a:hover {
  color: #58a6ff !important;
  text-decoration: underline !important;
}

.admin-body .admin-upload-who .meta {
  font-size: 12.5px !important;
  color: #8b929e !important;
  font-weight: 400 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

.admin-body .admin-upload-meta {
  font-size: 13px !important;
  color: #8b929e !important;
  margin: 0 0 10px !important;
}

.admin-body .checker-counts {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 0 10px !important;
}

.admin-body .checker-counts > span {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  letter-spacing: 0.02em !important;
}

.admin-body .checker-counts > .ok {
  background: rgba(46, 160, 67, 0.16) !important;
  border: 1px solid rgba(46, 160, 67, 0.35) !important;
  color: #56d364 !important;
}

.admin-body .checker-counts > .bad {
  background: rgba(248, 81, 73, 0.16) !important;
  border: 1px solid rgba(248, 81, 73, 0.35) !important;
  color: #f85149 !important;
}

.admin-body .checker-counts > .dup {
  background: rgba(227, 179, 65, 0.16) !important;
  border: 1px solid rgba(227, 179, 65, 0.35) !important;
  color: #e3b341 !important;
}

.admin-body .checker-counts > .proxy {
  background: rgba(163, 113, 247, 0.16) !important;
  border: 1px solid rgba(163, 113, 247, 0.35) !important;
  color: #a371f7 !important;
}

.admin-body .checker-counts > .stopped {
  background: rgba(248, 81, 73, 0.16) !important;
  border: 1px solid rgba(248, 81, 73, 0.35) !important;
  color: #f85149 !important;
}

.admin-body .checker-counts > .wait {
  background: rgba(88, 166, 255, 0.16) !important;
  border: 1px solid rgba(88, 166, 255, 0.35) !important;
  color: #58a6ff !important;
}

.admin-body .admin-upload-summary {
  font-size: 12.5px !important;
  color: #8b929e !important;
  margin: 6px 0 0 !important;
  padding: 8px 14px !important;
  background: rgba(255, 255, 255, 0.025) !important;
  border-left: 3px solid rgba(88, 166, 255, 0.4) !important;
  border-radius: 0 8px 8px 0 !important;
  line-height: 1.45 !important;
}

.admin-body .admin-upload-side {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: none !important;
}

.admin-body .admin-btn-open {
  height: 38px !important;
  padding: 0 18px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: rgba(79, 140, 255, 0.12) !important;
  border: 1px solid rgba(79, 140, 255, 0.32) !important;
  color: #79c0ff !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-btn-open:hover {
  background: rgba(79, 140, 255, 0.25) !important;
  border-color: #58a6ff !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px rgba(79, 140, 255, 0.25) !important;
}

.admin-body .admin-btn-log {
  height: 38px !important;
  padding: 0 14px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #8b929e !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-btn-log:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

.admin-body .admin-upload-side .btn {
  height: 38px !important;
  padding: 0 16px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #ececec !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 140ms ease !important;
}

.admin-body .admin-upload-side .btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* Run Details Card in checker_run.html */
.admin-body .checker-run-card {
  padding: 22px 26px !important;
  margin-bottom: 28px !important;
}

.admin-body .checker-run-meta {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
  margin-bottom: 14px !important;
}

.admin-body .checker-run-meta > div {
  padding: 14px 16px !important;
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 12px !important;
}

.admin-body .checker-run-summary {
  margin: 12px 0 0 !important;
  padding: 10px 14px !important;
  background: rgba(255, 255, 255, 0.025) !important;
  border-left: 3px solid #58a6ff !important;
  border-radius: 0 8px 8px 0 !important;
  color: #c9d1d9 !important;
  font-size: 13px !important;
}

.admin-body .admin-upload-item {
  padding: 16px 20px !important;
  border-radius: 14px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(26, 30, 36, 0.75) 0%, rgba(16, 18, 22, 0.9) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
  margin-bottom: 12px !important;
}



/* Admin UI Upgrades: Omnisearch (Ctrl+K), Live Badges, Attention Card, Toasts */
.admin-tab-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 1px 7px !important;
  border-radius: 999px !important;
  line-height: 1.3 !important;
  margin-left: 6px !important;
  vertical-align: middle !important;
}

.admin-tab-badge.warn, .admin-sub-badge.warn {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(245, 158, 11, 0.4) !important;
}

.admin-tab-badge.pulse, .admin-sub-badge.pulse {
  background: rgba(56, 189, 248, 0.18) !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(56, 189, 248, 0.4) !important;
}

.admin-sub-badge {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 999px !important;
  margin-left: 6px !important;
}

.pulse-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #38bdf8 !important;
  box-shadow: 0 0 8px #38bdf8 !important;
  display: inline-block !important;
  animation: adminPulse 1.4s infinite !important;
}

@keyframes adminPulse {
  0% { transform: scale(0.9); opacity: 0.7; }
  50% { transform: scale(1.3); opacity: 1; }
  100% { transform: scale(0.9); opacity: 0.7; }
}

.admin-search-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 38px !important;
  padding: 0 14px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 9px !important;
  color: #8b929e !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 140ms ease !important;
}

.admin-search-btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(79, 140, 255, 0.35) !important;
  color: #ffffff !important;
}

.admin-search-btn kbd {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  padding: 2px 6px !important;
  border-radius: 5px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #c9d1d9 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
}

/* Omnisearch Modal */
.admin-modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  background: rgba(0, 0, 0, 0.75) !important;
  backdrop-filter: blur(12px) !important;
  display: none;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 10vh !important;
}

.admin-modal-overlay.is-open {
  display: flex !important;
}

.admin-search-dialog {
  width: 90% !important;
  max-width: 620px !important;
  background: #111419 !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.85), 0 0 35px rgba(79, 140, 255, 0.15) !important;
  overflow: hidden !important;
}

.admin-search-head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.02) !important;
}

.admin-search-ico {
  color: #58a6ff !important;
  flex: none !important;
}

.admin-search-input {
  flex: 1 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  font-size: 15.5px !important;
  color: #f0f6fc !important;
  font-weight: 500 !important;
  font-family: inherit !important;
}

.admin-search-close-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #8b929e !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 120ms ease !important;
  padding: 0 !important;
  line-height: 1 !important;
  flex: none !important;
}

.admin-search-close-btn:hover {
  background: rgba(248, 81, 73, 0.22) !important;
  border-color: rgba(248, 81, 73, 0.45) !important;
  color: #f85149 !important;
}

.admin-search-results {
  max-height: 420px !important;
  overflow-y: auto !important;
  padding: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.admin-search-empty {
  padding: 28px 16px !important;
  text-align: center !important;
  color: #8b929e !important;
  font-size: 13.5px !important;
}

.admin-search-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 11px 15px !important;
  border-radius: 11px !important;
  text-decoration: none !important;
  color: inherit !important;
  border: 1px solid transparent !important;
  transition: all 120ms ease !important;
}

.admin-search-item:hover, .admin-search-item.is-selected {
  background: rgba(79, 140, 255, 0.14) !important;
  border-color: rgba(79, 140, 255, 0.35) !important;
}

.admin-search-item-cat {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #58a6ff !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 2px !important;
}

.admin-search-item-title {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}

.admin-search-item-meta {
  font-size: 12px !important;
  color: #8b929e !important;
  margin-top: 2px !important;
}

.admin-search-item-badge {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 9px !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #c9d1d9 !important;
  flex: none !important;
}

.admin-search-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  padding: 10px 18px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  background: rgba(255, 255, 255, 0.015) !important;
  font-size: 12px !important;
  color: #6e7681 !important;
}

.admin-search-foot kbd {
  font-size: 10.5px !important;
  padding: 1px 5px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 4px !important;
  color: #8b929e !important;
}

/* Attention Card on Dashboard */
.admin-attention-card {
  padding: 20px 24px !important;
  border-radius: 16px !important;
  background: radial-gradient(120% 120% at 50% 0%, rgba(36, 26, 16, 0.75) 0%, rgba(18, 16, 18, 0.95) 100%) !important;
  border: 1px solid rgba(245, 158, 11, 0.35) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.45) !important;
  margin-bottom: 1.5rem !important;
  position: relative !important;
}

.admin-attention-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #f59e0b, #ef4444) !important;
  border-radius: 16px 16px 0 0 !important;
}

.attention-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.attention-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.attention-pulse-icon {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #f59e0b !important;
  box-shadow: 0 0 12px #f59e0b !important;
  animation: adminPulse 1.3s infinite !important;
}

.attention-head h3 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fef3c7 !important;
}

.attention-hint {
  font-size: 12.5px !important;
  color: #92400e !important;
  font-weight: 600 !important;
}

.attention-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 14px !important;
}

.attention-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 14px 18px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  color: inherit !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  transition: all 160ms ease !important;
}

.attention-item:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

.attention-item.warn:hover {
  background: rgba(245, 158, 11, 0.08) !important;
  border-color: rgba(245, 158, 11, 0.4) !important;
}

.attention-item.pulse:hover {
  background: rgba(56, 189, 248, 0.08) !important;
  border-color: rgba(56, 189, 248, 0.4) !important;
}

.attention-badge {
  display: inline-block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
}

.attention-badge.warn {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
}

.attention-badge.pulse {
  background: rgba(56, 189, 248, 0.2) !important;
  color: #38bdf8 !important;
}

.attention-item-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.attention-item-sub {
  font-size: 12px !important;
  color: #8b929e !important;
  margin-top: 2px !important;
}

.attention-arrow {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #58a6ff !important;
  flex: none !important;
}

/* Toast Pill */
.admin-toast-pill {
  position: fixed !important;
  bottom: 28px !important;
  right: 28px !important;
  z-index: 999999 !important;
  background: rgba(18, 22, 28, 0.95) !important;
  border: 1px solid rgba(79, 140, 255, 0.4) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
  color: #f0f6fc !important;
  padding: 10px 18px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  backdrop-filter: blur(12px) !important;
  transform: translateY(10px) !important;
  opacity: 0 !important;
  transition: all 180ms ease !important;
}

.admin-toast-pill.show {
  transform: translateY(0) !important;
  opacity: 1 !important;
}

/* Admin Search Modal (Omnisearch Ctrl+K) */
#adminSearchModal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  background: rgba(0, 0, 0, 0.78) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  display: none !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 10vh !important;
}

#adminSearchModal.is-open {
  display: flex !important;
}

#adminSearchModal .admin-search-dialog {
  width: 90% !important;
  max-width: 620px !important;
  background: #111419 !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.9), 0 0 35px rgba(79, 140, 255, 0.2) !important;
  overflow: hidden !important;
}

#adminSearchModal .admin-search-head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.02) !important;
}

#adminSearchModal .admin-search-ico {
  color: #8b929e !important;
  flex: none !important;
}

#adminSearchModal .admin-search-input {
  flex: 1 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  font-size: 15.5px !important;
  color: #f0f6fc !important;
  font-weight: 500 !important;
  font-family: inherit !important;
}

#adminSearchModal .admin-search-close-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #8b929e !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  line-height: 1 !important;
  flex: none !important;
  transition: all 120ms ease !important;
}

#adminSearchModal .admin-search-close-btn:hover {
  background: rgba(248, 81, 73, 0.22) !important;
  border-color: rgba(248, 81, 73, 0.45) !important;
  color: #f85149 !important;
}

#adminSearchModal .admin-search-results {
  max-height: 420px !important;
  overflow-y: auto !important;
  padding: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

#adminSearchModal .admin-search-empty {
  padding: 28px 16px !important;
  text-align: center !important;
  color: #8b929e !important;
  font-size: 13.5px !important;
}

#adminSearchModal .admin-search-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 11px 15px !important;
  border-radius: 11px !important;
  text-decoration: none !important;
  color: inherit !important;
  border: 1px solid transparent !important;
  transition: all 120ms ease !important;
}

#adminSearchModal .admin-search-item:hover,
#adminSearchModal .admin-search-item.is-selected {
  background: rgba(79, 140, 255, 0.14) !important;
  border-color: rgba(79, 140, 255, 0.35) !important;
}

#adminSearchModal .admin-search-item-cat {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #58a6ff !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 2px !important;
}

#adminSearchModal .admin-search-item-title {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}

#adminSearchModal .admin-search-item-meta {
  font-size: 12px !important;
  color: #8b929e !important;
  margin-top: 2px !important;
}

#adminSearchModal .admin-search-item-badge {
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 9px !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #c9d1d9 !important;
  flex: none !important;
}

#adminSearchModal .admin-search-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  padding: 10px 18px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  background: rgba(255, 255, 255, 0.015) !important;
  font-size: 12px !important;
  color: #6e7681 !important;
}

#adminSearchModal .admin-search-foot kbd {
  font-size: 10.5px !important;
  padding: 1px 5px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 4px !important;
  color: #8b929e !important;
}

/* Bulk Filters Button in table */
.bulk-filter-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: rgba(79, 140, 255, 0.12) !important;
  color: #58a6ff !important;
  border: 1px solid rgba(79, 140, 255, 0.3) !important;
  cursor: pointer !important;
  transition: all 140ms ease !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.bulk-filter-btn:hover {
  background: rgba(79, 140, 255, 0.25) !important;
  border-color: rgba(79, 140, 255, 0.55) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

.bulk-filter-btn svg {
  flex: none !important;
}

.bulk-type-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  user-select: none !important;
}

.bulk-type-badge.cart {
  background: rgba(168, 85, 247, 0.14) !important;
  color: #c084fc !important;
  border: 1px solid rgba(168, 85, 247, 0.32) !important;
}

.bulk-type-badge.cart svg {
  flex: none !important;
  stroke: #c084fc !important;
}

/* Bulk Filters Card Header & Title Group in check detail */
.bulk-card-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.bulk-card-title-group svg {
  flex: none !important;
  color: #58a6ff !important;
}

.bulk-card-title-group h3 {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.2 !important;
}

/* Modal for Bulk Filters View */
#bulkFiltersModal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  background: rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
}

#bulkFiltersModal.is-open {
  display: flex !important;
}

#bulkFiltersModal .bulk-modal-dialog {
  width: 95% !important;
  max-width: 600px !important;
  background: #111419 !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.95), 0 0 35px rgba(79, 140, 255, 0.18) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: 85vh !important;
}

#bulkFiltersModal .bulk-modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.02) !important;
}

#bulkFiltersModal .bulk-modal-head h3 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

#bulkFiltersModal .bulk-modal-sub {
  font-size: 12px !important;
  color: #8b929e !important;
  margin-top: 4px !important;
}

#bulkFiltersModal .bulk-modal-body {
  padding: 18px 20px !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

#bulkFiltersModal .bulk-inferred-alert {
  padding: 9px 13px !important;
  border-radius: 9px !important;
  background: rgba(234, 179, 8, 0.1) !important;
  border: 1px solid rgba(234, 179, 8, 0.25) !important;
  color: #facc15 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

#bulkFiltersModal .bulk-modal-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 10px !important;
}

#bulkFiltersModal .bulk-modal-item {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
}

#bulkFiltersModal .bulk-modal-item.is-highlighted {
  background: rgba(235, 77, 137, 0.08) !important;
  border-color: rgba(235, 77, 137, 0.28) !important;
}

#bulkFiltersModal .bulk-modal-label {
  display: block !important;
  font-size: 11px !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 4px !important;
}

#bulkFiltersModal .bulk-modal-val {
  display: block !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  word-break: break-word !important;
}

#bulkFiltersModal .bulk-modal-val.dating-val {
  color: #f472b6 !important;
}

#bulkFiltersModal .bulk-modal-val.price-val {
  color: #4ade80 !important;
}

#bulkFiltersModal .bulk-modal-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 20px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.015) !important;
}

.admin-body .text-danger,
.admin-body .text-bad {
  color: #ff6b6b !important;
}

/* ==========================================================================
   ADMIN API MANAGEMENT (Overview, Tokens, Logs) - CSP-Compliant Modern Styles
   ========================================================================== */

/* API Global Limit Card */
.admin-body .api-limit-card {
  margin-bottom: 28px !important;
}

.admin-body .api-limit-head {
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

.admin-body .api-limit-title {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.admin-body .api-limit-form {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  padding: 18px 20px !important;
  margin: 0 !important;
}

.admin-body .api-limit-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  width: 240px !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.admin-body .api-limit-field .filter-caption {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #8b929e !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.admin-body .api-limit-input {
  height: 40px !important;
  padding: 0 14px !important;
  background: rgba(12, 14, 18, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 9px !important;
  color: #ffffff !important;
  font-size: 14px !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 140ms ease, box-shadow 140ms ease !important;
}

.admin-body .api-limit-input:focus {
  border-color: #4f7df5 !important;
  box-shadow: 0 0 0 3px rgba(79, 125, 245, 0.2) !important;
}

.admin-body .api-limit-submit {
  height: 40px !important;
  padding: 0 20px !important;
  margin: 0 !important;
}

.admin-body .api-limit-hint {
  margin: 0 20px 18px !important;
  color: #8b929e !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* API Tokens Table & Action Row */
.admin-body .admin-tokens-th-actions {
  text-align: right !important;
  min-width: 250px !important;
}

.admin-body td.admin-token-actions-cell {
  text-align: right !important;
  white-space: nowrap !important;
  padding: 10px 14px !important;
}

.admin-body .admin-token-actions {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  margin: 0 !important;
  padding: 0 !important;
}

.admin-body .admin-token-actions .admin-token-limit-form,
.admin-body .admin-token-actions .admin-token-state-form {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

.admin-body .admin-token-actions .admin-token-limit-input {
  width: 68px !important;
  min-width: 68px !important;
  max-width: 68px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 6px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-align: center !important;
  background: rgba(12, 14, 18, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 7px !important;
  color: #ffffff !important;
  outline: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  transition: border-color 140ms ease, box-shadow 140ms ease !important;
}

.admin-body .admin-token-actions .admin-token-limit-input:focus {
  border-color: #4f7df5 !important;
  box-shadow: 0 0 0 2px rgba(79, 125, 245, 0.25) !important;
}

.admin-body .admin-token-actions .btn {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  line-height: 30px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* API Logs Filter Checkbox */
.admin-body .admin-filter-field.admin-filter-check {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  cursor: pointer !important;
  padding-bottom: 8px !important;
  margin: 0 !important;
}

.admin-body .admin-filter-field.admin-filter-check input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  margin: 0 !important;
  cursor: pointer !important;
}

/* Stacking context fix for dash-card below filters */
.admin-body .dash-card {
  position: relative !important;
  z-index: 1 !important;
}
/* ==========================================================================
   MOBILE ADAPTATION FOR ADMIN PANEL ONLY (.admin-body)
   Targeting viewports <= 768px (smartphones, small tablets)
   Strictly scoped to .admin-body so market storefront is 100% untouched.
   ========================================================================== */

/* 1. Desktop vs Mobile view toggle */
.admin-mobile-cards {
  display: none;
}
.admin-desktop-only {
  display: block;
}

@media (max-width: 768px) {
  /* Prevent horizontal page overflow on admin panel */
  html:has(.admin-body),
  body.admin-body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }

  .admin-body .wrap,
  .admin-body main#content {
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Hide desktop tables on mobile when mobile cards are provided */
  .admin-body .admin-desktop-only {
    display: none !important;
  }
  .admin-body .admin-mobile-cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* --- 2. ADMIN HEADER & ERGONOMIC NAVIGATION GRID --- */
  .admin-body .admin-topbar {
    padding: 0 !important;
    margin-bottom: 12px !important;
  }

  .admin-body .admin-nav-card {
    padding: 8px !important;
    border-radius: 14px !important;
    margin-bottom: 12px !important;
    background: rgba(18, 22, 28, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  .admin-body .admin-nav-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  /* Main Navigation: 2 balanced rows, ALL 7 tabs visible and directly tappable */
  .admin-body .admin-main-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    width: 100% !important;
    overflow: visible !important;
  }

  /* Row 1: 4 items (Дашборд, Товары, Заказы, Чекер) */
  .admin-body .admin-main-nav .admin-tab {
    flex: 1 1 calc(25% - 5px) !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 7px 2px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    min-height: 48px !important;
    border-radius: 10px !important;
    text-align: center !important;
    line-height: 1.15 !important;
    box-sizing: border-box !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  /* Row 2: 3 items (Пользователи, Финансы, Система) */
  .admin-body .admin-main-nav .admin-tab:nth-child(n+5) {
    flex: 1 1 calc(33.333% - 5px) !important;
  }

  .admin-body .admin-main-nav .admin-tab.is-active {
    background: rgba(88, 166, 255, 0.15) !important;
    border-color: rgba(88, 166, 255, 0.4) !important;
    color: #58a6ff !important;
    box-shadow: 0 0 12px rgba(88, 166, 255, 0.12) !important;
  }

  .admin-body .admin-main-nav .admin-tab .admin-tab-icon {
    width: 17px !important;
    height: 17px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
  }

  /* Sub-Navigation Pills (e.g. Все покупки / Массовые чеки / VK Знакомства) */
  .admin-body .admin-sub-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    width: 100% !important;
    margin-top: 6px !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    overflow: visible !important;
  }

  .admin-body .admin-sub-pill {
    flex: 1 1 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    min-height: 36px !important;
    border-radius: 8px !important;
    text-align: center !important;
    box-sizing: border-box !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  .admin-body .admin-sub-pill.is-active {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
  }

  /* Topbar Actions: Search + Shop button side-by-side */
  .admin-body .admin-topbar-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 4px !important;
  }

  .admin-body .admin-topbar-actions kbd {
    display: none !important;
  }

  .admin-body .admin-search-trigger {
    flex: 1 1 auto !important;
    min-height: 40px !important;
    font-size: 13px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    display: inline-flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  .admin-body .admin-topbar-actions a.btn {
    flex: 1 1 auto !important;
    min-height: 40px !important;
    font-size: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 9px !important;
    box-sizing: border-box !important;
  }

  /* --- 3. PAGE HEADINGS & QUICK ACTIONS --- */
  .admin-body .admin-head,
  .admin-body .dash-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  .admin-body .admin-head h1,
  .admin-body .dash-head h1 {
    font-size: 20px !important;
    line-height: 1.25 !important;
    margin-bottom: 2px !important;
  }

  .admin-body .dash-quick-actions,
  .admin-body .admin-head-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    gap: 6px !important;
  }

  .admin-body .dash-quick-actions .btn,
  .admin-body .admin-head-actions .btn {
    flex: 1 1 calc(50% - 6px) !important;
    min-width: 120px !important;
    min-height: 40px !important;
    font-size: 12.5px !important;
    justify-content: center !important;
  }

  /* --- 4. STATS & KPI METRICS (2-COLUMN GRID) --- */
  .admin-body .stats,
  .admin-body .kpis,
  .admin-body .dash-grid.kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }

  .admin-body .kpi-card {
    padding: 10px 10px !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border-radius: 12px !important;
  }

  .admin-body .kpi-top {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 4px !important;
    margin-bottom: 4px !important;
  }

  .admin-body .kpi-label {
    font-size: 10px !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    color: var(--muted, #8b929d) !important;
    text-transform: uppercase !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    word-break: break-word !important;
  }

  .admin-body .kpi-badge {
    font-size: 8.5px !important;
    padding: 1px 4px !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    line-height: 1.25 !important;
  }

  .admin-body .kpi-val {
    font-size: clamp(13px, 4vw, 17px) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.3px !important;
    margin: 4px 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .admin-body .kpi-foot {
    font-size: 10.5px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  /* --- 5. DASHBOARD & FINANCE GRIDS (NO SQUASHING) --- */
  /* Operational sub-grid on Dashboard: 1 full-width column */
  .admin-body .dash-grid.sub-grid,
  .admin-body .sub-grid {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
  }

  .admin-body .op-card {
    padding: 14px !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
  }

  /* Tables grid on Finance (Незакрытые платежи / Последние пополнения): 1 full-width column */
  .admin-body .dash-grid.tables-grid,
  .admin-body .tables-grid {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  /* --- 6. TOOLBARS, SEARCH FORMS & INPUTS (IOS DATE FIX) --- */
  .admin-body .admin-toolbar-box,
  .admin-body .admin-search-form,
  .admin-body .ops-filters,
  .admin-body .ops-filters.admin-uploads-filters,
  .admin-body .ops-filters.admin-journal-filters,
  .admin-body .admin-check-filters,
  .admin-body .admin-filter-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 14px 12px !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin-bottom: 14px !important;
  }

  .admin-body .admin-search-wrap,
  .admin-body .admin-filter-field,
  .admin-body .ops-filters > div,
  .admin-body .multi-select.filter-choice {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .admin-body .admin-search-wrap input,
  .admin-body .admin-filter-field input,
  .admin-body .ops-filters input,
  .admin-body .ops-filters select,
  .admin-body .multi-select-trigger {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    box-sizing: border-box !important;
    font-size: 13.5px !important;
  }

  /* Prevent date input overflow on iOS Safari */
  .admin-body input[type="date"],
  .admin-body input[type="datetime-local"],
  .admin-body input[type="time"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
  }

  .admin-body .admin-search-form .btn,
  .admin-body .ops-filters .btn {
    width: 100% !important;
    height: 42px !important;
    justify-content: center !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  /* Filter Pills Ribbon */
  .admin-body .admin-filter-pills,
  .admin-body .admin-filter-chips,
  .admin-body .chips.admin-filter-chips {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 6px !important;
    padding-bottom: 4px !important;
    width: 100% !important;
  }

  .admin-body .admin-filter-pills::-webkit-scrollbar,
  .admin-body .admin-filter-chips::-webkit-scrollbar {
    display: none !important;
  }

  .admin-body .admin-filter-pill {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    border-radius: 8px !important;
    min-height: 32px !important;
  }

  /* Multi-Select Dropdown Menu Full Width on Mobile */
  .admin-body .multi-select-menu {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
  }

  /* --- 7. GOODS / LISTINGS (.admin-lot-item) --- */
  .admin-body .admin-lot-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding: 12px !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    position: relative !important;
  }

  .admin-body .admin-lot-left {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .admin-body .admin-lot-content {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .admin-body .admin-lot-topbar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 6px !important;
  }

  .admin-body .admin-lot-title {
    font-size: 13.5px !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
  }

  .admin-body .admin-lot-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    margin-top: 6px !important;
  }

  .admin-body .admin-lot-chip {
    font-size: 10.5px !important;
    padding: 2px 6px !important;
    border-radius: 5px !important;
  }

  .admin-body .admin-lot-right {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    margin-top: 2px !important;
    gap: 8px !important;
  }

  .admin-body .admin-lot-price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--accent-light, #2bd576) !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .admin-body .admin-lot-controls {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
  }

  .admin-body .admin-btn-row {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
  }

  .admin-body .admin-btn-row .btn {
    padding: 6px 12px !important;
    font-size: 12px !important;
    min-height: 34px !important;
  }

  /* Bulk action toolbar on listings */
  .admin-body .admin-bulk-toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 10px 12px !important;
  }

  .admin-body .admin-bulk-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
  }

  .admin-body .admin-bulk-actions .btn {
    flex: 1 1 calc(50% - 4px) !important;
    justify-content: center !important;
    font-size: 12px !important;
    min-height: 36px !important;
  }

  /* --- 8. MOBILE CARDS (ORDERS, USERS, CHECKS) --- */
  .admin-body .dash-card,
  .admin-body .table-card,
  .admin-body .admin-card,
  .admin-body .block.admin-panel {
    padding: 12px !important;
    border-radius: 14px !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .admin-body .admin-mobile-card {
    background: rgba(255, 255, 255, 0.025) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 13px !important;
    padding: 12px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .admin-body .admin-mcard-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }

  .admin-body .admin-mcard-id-time {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .admin-body .admin-mcard-id-time .cell-time {
    font-size: 11.5px !important;
    color: var(--muted, #8b929e) !important;
  }

  .admin-body .admin-mcard-badges {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
  }

  .admin-body .admin-mcard-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    line-height: 1.35 !important;
    display: block !important;
    word-break: break-word !important;
  }

  .admin-body .admin-mcard-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px 14px !important;
    font-size: 12px !important;
    color: var(--muted, #8b929e) !important;
    margin-top: 4px !important;
  }

  .admin-body .admin-mcard-stats-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    background: rgba(0, 0, 0, 0.25) !important;
    border-radius: 10px !important;
    padding: 8px 10px !important;
    margin-top: 4px !important;
  }

  .admin-body .mcard-stat {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  .admin-body .mcard-stat-label {
    font-size: 10px !important;
    text-transform: uppercase !important;
    color: var(--muted, #8b929e) !important;
    font-weight: 600 !important;
  }

  .admin-body .mcard-stat-val {
    font-size: 13px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .admin-body .admin-mcard-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    margin-top: 2px !important;
    gap: 8px !important;
  }

  .admin-body .admin-mcard-price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--accent-light, #2bd576) !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 4px !important;
  }

  .admin-body .admin-mcard-footer .btn {
    min-height: 36px !important;
    padding: 0 14px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
  }

  /* Table horizontal scrolling fallback for audit / ledger */
  .admin-body .admin-table-wrap,
  .admin-body .dash-table-wrap,
  .admin-body .table-responsive {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    display: block !important;
    box-sizing: border-box !important;
    scrollbar-width: thin !important;
  }

  .admin-body .dash-table,
  .admin-body .admin-table,
  .admin-body .lots.admin-table,
  .admin-body table.table {
    min-width: 540px !important;
    width: 100% !important;
  }

  .admin-body .dash-table th,
  .admin-body .dash-table td {
    padding: 10px 8px !important;
    font-size: 12px !important;
  }

  /* --- 9. SETTINGS & FORMS --- */
  .admin-body .settings-grid,
  .admin-body .form-grid,
  .admin-body .admin-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .admin-body .form-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .admin-body .form-actions,
  .admin-body .admin-actions-bar {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .admin-body .form-actions .btn,
  .admin-body .admin-actions-bar .btn {
    width: 100% !important;
    height: 42px !important;
    justify-content: center !important;
  }

  /* CRITICAL: Force hide desktop tables on mobile when cards exist */
  .admin-body .admin-desktop-only,
  .admin-body div.admin-table-wrap.admin-desktop-only,
  .admin-body .table-card .admin-table-wrap.admin-desktop-only {
    display: none !important;
  }
  .admin-body .admin-mobile-cards {
    display: flex !important;
  }
}

/* ==========================================================================
   SHOPPING CART (ПОКУПКА ПАКОМ)
   ========================================================================== */
.side-top .cart-btn {
  position: relative !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--muted) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: color 140ms ease, transform 120ms ease !important;
  pointer-events: auto !important;
}

.side-top .cart-btn:hover {
  color: var(--text, #ffffff) !important;
  background: transparent !important;
}

.side-top .cart-btn:active {
  transform: scale(0.9) !important;
}

.side-top .cart-btn svg {
  width: 19px !important;
  height: 19px !important;
}

.side-top .cart-btn svg path,
.side-top .cart-btn svg circle {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
  transition: stroke 140ms ease !important;
}

/* In-cart active state: simply turns bright green */
.side-top .cart-btn.is-in-cart,
.side-top .cart-btn.is-in-cart:hover {
  color: #2bd576 !important;
  background: transparent !important;
}

/* ================= FLOATING CART BAR: VARIANT 1 (LINEAR DARK GLASS) ================= */
.floating-cart-bar {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  left: auto !important;
  width: auto !important;
  max-width: min(520px, calc(100vw - 32px)) !important;
  background: rgba(18, 22, 30, 0.94) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-radius: 16px !important;
  padding: 10px 14px 10px 16px !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.7), 0 0 1px rgba(255, 255, 255, 0.2) !important;
  z-index: 1000 !important;
  transform: translateY(0) !important;
  transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease !important;
  box-sizing: border-box !important;
}

.floating-cart-bar.is-hidden {
  transform: translateY(30px) scale(0.96) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.cart-bar-content {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
}

.cart-bar-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.cart-bar-icon-wrap {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: rgba(43, 213, 118, 0.12) !important;
  border: 1px solid rgba(43, 213, 118, 0.25) !important;
  color: #2bd576 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

.cart-bar-badge {
  position: absolute !important;
  top: -5px !important;
  right: -5px !important;
  background: #2bd576 !important;
  color: #071e10 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  min-width: 17px !important;
  height: 17px !important;
  padding: 0 4px !important;
  border-radius: 9999px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 6px rgba(43, 213, 118, 0.4) !important;
  box-sizing: border-box !important;
}

.cart-bar-texts {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  white-space: nowrap !important;
}

.cart-bar-price {
  transition: transform 160ms cubic-bezier(0.16, 1, 0.3, 1), color 160ms ease !important;
  display: inline-block !important;
}

.cart-bar-price.is-updating {
  color: #2bd576 !important;
  transform: scale(1.06) !important;
}

.cart-bar-badge.is-bumped {
  animation: badgeBump 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

@keyframes badgeBump {
  0% { transform: scale(0.7); }
  50% { transform: scale(1.35); }
  100% { transform: scale(1); }
}

.cart-bar-price {
  font-size: 19px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
  font-variant-numeric: tabular-nums !important;
}

.cart-bar-sub {
  font-size: 11.5px !important;
  color: #8b949e !important;
  font-weight: 500 !important;
}

.cart-bar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.cart-btn-clear {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #6e7681 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}

.cart-btn-clear:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f85149 !important;
}

.cart-btn-buy {
  background: linear-gradient(135deg, #2bd576 0%, #1fab5b 100%) !important;
  color: #051d0f !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  padding: 0 18px !important;
  height: 40px !important;
  border-radius: 10px !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 16px rgba(43, 213, 118, 0.35) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.cart-btn-buy:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(43, 213, 118, 0.45) !important;
}

.cart-btn-buy:active {
  transform: translateY(0) !important;
}



/* ================= CART CHECKOUT MODAL (STEP 2) ================= */
.cart-modal {
  width: min(520px, calc(100vw - 28px)) !important;
}

.cart-modal-items-section {
  margin-bottom: 14px !important;
}

.cart-modal-section-title {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 13px !important;
  color: #8b949e !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
}

.cart-modal-section-title strong {
  color: #2bd576 !important;
}

.cart-clear-link {
  background: none !important;
  border: none !important;
  color: #6e7681 !important;
  font-size: 12px !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  padding: 0 !important;
  transition: color 0.15s ease !important;
}

.cart-clear-link:hover {
  color: #f85149 !important;
}

.cart-modal-items-list {
  max-height: 220px !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding-right: 6px !important;
  padding-bottom: 10px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255, 255, 255, 0.18) transparent !important;
  transition: -webkit-mask-image 0.2s ease, mask-image 0.2s ease !important;
}

/* Gradient Fade Mask: softly dissolves bottom/top cards instead of sharp clipping */
.cart-modal-items-list,
.cart-modal-items-list[data-scroll-mask="bottom"] {
  -webkit-mask-image: linear-gradient(to bottom, black 0%, black calc(100% - 38px), transparent 100%) !important;
  mask-image: linear-gradient(to bottom, black 0%, black calc(100% - 38px), transparent 100%) !important;
}

.cart-modal-items-list[data-scroll-mask="both"] {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 24px, black calc(100% - 36px), transparent 100%) !important;
  mask-image: linear-gradient(to bottom, transparent 0%, black 24px, black calc(100% - 36px), transparent 100%) !important;
}

.cart-modal-items-list[data-scroll-mask="top"] {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 24px, black 100%) !important;
  mask-image: linear-gradient(to bottom, transparent 0%, black 24px, black 100%) !important;
}

.cart-modal-items-list[data-scroll-mask="none"] {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.cart-modal-items-list::-webkit-scrollbar {
  width: 5px !important;
}

.cart-modal-items-list::-webkit-scrollbar-track {
  background: transparent !important;
}

.cart-modal-items-list::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.18) !important;
  border-radius: 9999px !important;
}

.cart-modal-items-list::-webkit-scrollbar-thumb:hover {
  background: rgba(43, 213, 118, 0.6) !important;
}

.cart-modal-items-list::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.cart-modal-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  transition: background 0.15s ease, opacity 0.2s ease, transform 0.2s ease !important;
}

.cart-modal-item:hover {
  background: rgba(255, 255, 255, 0.05) !important;
}

.cart-item-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

.cart-item-vk {
  width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  background: #2787f5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  flex-shrink: 0 !important;
}

.cart-item-details {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  gap: 2px !important;
}

.cart-item-title {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #f0f6fc !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.cart-item-sub {
  font-size: 11px !important;
  color: #8b949e !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.cart-item-right {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
  gap: 3px !important;
  flex-shrink: 0 !important;
}

.cart-item-meta-top {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.cart-item-price {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.cart-item-remove {
  width: 26px !important;
  height: 26px !important;
  border-radius: 6px !important;
  border: none !important;
  background: rgba(255, 255, 255, 0.05) !important;
  color: #8b949e !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  font-size: 13px !important;
  padding: 0 !important;
}

.cart-item-remove:hover {
  background: rgba(248, 81, 73, 0.2) !important;
  color: #f85149 !important;
}

.cart-modal-summary {
  background: rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  margin-top: 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.cart-summary-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 13px !important;
  color: #8b949e !important;
}

.cart-summary-row .summary-val {
  font-weight: 600 !important;
  color: #f0f6fc !important;
}

.cart-summary-row.total {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  border-top: 1px dashed rgba(255, 255, 255, 0.1) !important;
  padding-top: 8px !important;
  margin-top: 2px !important;
}

.cart-summary-row.total .total-val {
  color: #2bd576 !important;
  font-size: 18px !important;
  transition: transform 160ms cubic-bezier(0.16, 1, 0.3, 1), filter 160ms ease !important;
  display: inline-block !important;
  font-variant-numeric: tabular-nums !important;
}

.cart-summary-row.total .total-val.is-updating {
  transform: scale(1.08) !important;
  filter: drop-shadow(0 0 8px rgba(43, 213, 118, 0.55)) !important;
}

.cart-balance-alert {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12.5px !important;
  color: #f85149 !important;
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.25) !important;
  border-radius: 8px !important;
  padding: 8px 10px !important;
  margin-top: 4px !important;
}

.cart-modal-footer .is-hidden,
.is-hidden {
  display: none !important;
}

.cart-balance-alert.is-hidden {
  display: none !important;
}

.cart-modal-pay-btn {
  background: linear-gradient(135deg, #2bd576 0%, #1fab5b 100%) !important;
  color: #051d0f !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  height: 46px !important;
  width: 100% !important;
  border-radius: 12px !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 20px rgba(43, 213, 118, 0.4) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease !important;
  outline: none !important;
  box-sizing: border-box !important;
}

.cart-modal-pay-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 24px rgba(43, 213, 118, 0.55) !important;
  filter: brightness(1.04) !important;
}

.cart-modal-pay-btn:active {
  transform: translateY(0) !important;
}

.cart-modal-pay-btn svg {
  stroke: #051d0f !important;
  transition: transform 0.15s ease !important;
}

.cart-modal-pay-btn:hover svg {
  transform: translateX(2px) !important;
}

.cart-modal-footer {
  margin-top: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* Real-time Progress Bar & Live Statuses (Variant 1) */
.cart-modal-progress-wrap {
  background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(43, 213, 118, 0.22) !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  margin-bottom: 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
  animation: cartFadeIn 0.25s ease-out !important;
}

@keyframes cartFadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.cart-modal-progress-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 7px !important;
  font-size: 12.5px !important;
}

.cart-modal-progress-label {
  color: #e6edf3 !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.cart-modal-progress-percent {
  color: #2bd576 !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  font-variant-numeric: tabular-nums !important;
}

.cart-modal-progress-track {
  height: 6px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  position: relative !important;
}

.cart-modal-progress-fill {
  height: 100% !important;
  background: linear-gradient(90deg, #1fab5b 0%, #2bd576 100%) !important;
  border-radius: 9999px !important;
  transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 0 10px rgba(43, 213, 118, 0.6) !important;
}

@keyframes cartSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.cart-spinner {
  width: 13px !important;
  height: 13px !important;
  border: 2px solid rgba(43, 213, 118, 0.25) !important;
  border-top-color: #2bd576 !important;
  border-radius: 50% !important;
  display: inline-block !important;
  animation: cartSpin 0.75s linear infinite !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}

.cart-spinner.sm {
  width: 11px !important;
  height: 11px !important;
  border-width: 1.5px !important;
}

/* Status Badges inside Cart Rows */
.cart-item-status-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
  animation: cartFadeIn 0.2s ease !important;
}

.cart-item-status-badge.status-checking {
  background: rgba(43, 213, 118, 0.12) !important;
  color: #2bd576 !important;
  border: 1px solid rgba(43, 213, 118, 0.28) !important;
}

.cart-item-status-badge.status-bought {
  background: rgba(35, 134, 54, 0.22) !important;
  color: #3fb950 !important;
  border: 1px solid rgba(63, 185, 80, 0.38) !important;
}

.cart-item-status-badge.status-invalid,
.cart-item-status-badge.status-dating-ban {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
  border: 1px solid rgba(248, 81, 73, 0.3) !important;
}

.cart-item-status-badge.status-warn {
  background: rgba(210, 153, 34, 0.15) !important;
  color: #e3b341 !important;
  border: 1px solid rgba(227, 179, 65, 0.3) !important;
}

/* Item highlight states during purchase */
.cart-modal-item.is-checking {
  border-color: rgba(43, 213, 118, 0.35) !important;
  background: rgba(43, 213, 118, 0.05) !important;
}

.cart-modal-item.is-bought {
  border-color: rgba(63, 185, 80, 0.35) !important;
  background: rgba(63, 185, 80, 0.06) !important;
}

.cart-modal-item.is-invalid {
  border-color: rgba(248, 81, 73, 0.25) !important;
  background: rgba(248, 81, 73, 0.04) !important;
  opacity: 0.72 !important;
}

/* Modal frozen state while processing purchase */
.cart-modal.is-processing .cart-clear-link,
.cart-modal.is-processing .modal-close,
.cart-modal.is-processing .cart-item-remove {
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.cart-modal.is-processing input {
  pointer-events: none !important;
  opacity: 0.65 !important;
}

/* ==========================================================================
   MOBILE & RESPONSIVE ADAPTATION FOR CART (ALL MOBILE VIEWPORTS)
   ========================================================================== */
.cart-btn-text-full {
  display: inline !important;
}

.cart-btn-text-short {
  display: none !important;
}

@media (max-width: 560px) {
  /* Floating Bar */
  .floating-cart-bar {
    bottom: max(12px, env(safe-area-inset-bottom, 12px)) !important;
    left: 10px !important;
    right: 10px !important;
    max-width: none !important;
    width: auto !important;
    padding: 8px 12px !important;
    border-radius: 14px !important;
  }
  .cart-bar-content {
    gap: 8px !important;
    justify-content: space-between !important;
  }
  .cart-bar-info {
    gap: 10px !important;
    min-width: 0 !important;
  }
  .cart-bar-texts {
    min-width: 0 !important;
  }
  .cart-bar-price {
    font-size: 16.5px !important;
  }
  .cart-bar-sub {
    font-size: 11px !important;
    max-width: 130px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .cart-btn-buy {
    padding: 0 13px !important;
    height: 38px !important;
    font-size: 13px !important;
    border-radius: 9px !important;
    gap: 6px !important;
  }
  .cart-btn-text-full {
    display: none !important;
  }
  .cart-btn-text-short {
    display: inline !important;
  }

  /* Cart Modal (Sheet-like dialog on mobile) */
  .cart-modal {
    width: calc(100vw - 16px) !important;
    max-width: 440px !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 8px auto !important;
    padding: 12px 13px 14px !important;
    border-radius: 16px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
  }

  .cart-modal form {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  .cart-modal .modal-head {
    margin-bottom: 8px !important;
  }

  .cart-modal .modal-head h2 {
    font-size: 16px !important;
  }

  .cart-modal .modal-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 7px !important;
  }

  .cart-modal .modal-icon svg {
    width: 15px !important;
    height: 15px !important;
  }

  .cart-modal .modal-close {
    width: 28px !important;
    height: 28px !important;
    font-size: 18px !important;
  }

  .cart-modal-items-section {
    margin-bottom: 6px !important;
  }

  .cart-modal-section-title {
    font-size: 11.5px !important;
    margin-bottom: 5px !important;
  }

  .cart-modal-items-list {
    max-height: 130px !important;
    gap: 5px !important;
    padding-right: 3px !important;
  }

  /* Keep total modal height stable when progress bar appears */
  .cart-modal.is-processing .cart-modal-items-list {
    max-height: 90px !important;
  }

  .cart-modal-item {
    padding: 6px 9px !important;
    gap: 8px !important;
    border-radius: 8px !important;
  }

  .cart-item-vk {
    width: 24px !important;
    height: 24px !important;
    border-radius: 6px !important;
  }

  .cart-item-vk svg {
    width: 13px !important;
    height: 13px !important;
  }

  .cart-item-title {
    font-size: 12.5px !important;
  }

  .cart-item-sub {
    font-size: 10px !important;
  }

  .cart-item-price {
    font-size: 13px !important;
  }

  .cart-item-status-badge {
    font-size: 10px !important;
    padding: 2px 5px !important;
  }

  /* Progress Bar on mobile */
  .cart-modal-progress-wrap {
    padding: 6px 9px !important;
    margin-bottom: 6px !important;
    border-radius: 7px !important;
  }

  .cart-modal-progress-header {
    font-size: 11px !important;
    margin-bottom: 4px !important;
  }

  .cart-modal-progress-percent {
    font-size: 11.5px !important;
  }

  .cart-modal-progress-track {
    height: 4px !important;
  }

  /* Inputs on mobile */
  .cart-modal .modal-field {
    margin-bottom: 6px !important;
  }

  .cart-modal .modal-label {
    margin-bottom: 3px !important;
    font-size: 11.5px !important;
  }

  .cart-modal .input-with-icon input {
    height: 35px !important;
    font-size: 12.5px !important;
  }

  .cart-modal .modal-dating-choice {
    margin: 4px 0 8px !important;
  }

  .cart-modal .filter-caption {
    font-size: 11.5px !important;
    margin-bottom: 3px !important;
  }

  .cart-modal .choice-set span {
    height: 34px !important;
    font-size: 12.5px !important;
  }

  .cart-modal .modal-split {
    margin: 6px 0 !important;
  }

  /* Summary on mobile */
  .cart-modal-summary {
    padding: 8px 10px !important;
    margin-top: 4px !important;
    border-radius: 8px !important;
    gap: 4px !important;
  }

  .cart-summary-row {
    font-size: 11.5px !important;
  }

  .cart-summary-row.total {
    padding-top: 5px !important;
    margin-top: 2px !important;
  }

  .cart-summary-row.total .total-val {
    font-size: 15.5px !important;
  }

  .cart-modal-footer {
    margin-top: 8px !important;
  }

  .cart-modal-pay-btn {
    height: 44px !important;
    font-size: 14px !important;
    border-radius: 9px !important;
  }

  /* Product Card Cart Button (Mobile touch) */
  .side-top .cart-btn {
    width: 36px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .side-top .cart-btn svg {
    width: 20px !important;
    height: 20px !important;
  }
}


/* Ensure dropdown menus on account rows are never clipped by block overflow */
.bulk-hub-block,
.fin-block:has(.rows),
.fin-block:has(.listing-row),
.fin-block:has(#account-rows),
.cab-section:has(.rows),
.cab-section:has(.listing-row) {
  overflow: visible !important;
}