:root {
  --main-white-color: #121715 !important;
  --main-bg-color: #0b0e0d !important;
  --main-white-gray-color: #171c19 !important;
  --header-background: rgba(14, 18, 16, 0.86) !important;

  --main-text-color: #e4dfd3 !important;
  --text-body: #d8d2c4 !important;
  --text-muted: #9e988d !important;
  --muted-2: #7c776d !important;
  --muted-3: #333833 !important;
  --muted-4: #262b27 !important;
  --muted-5: #343a35 !important;
  --muted-6: #b7af9f !important;
  --muted-heading: #f0eadc !important;
  --muted-desc: #b7b09f !important;

  --main-dark-color: #efe8d7 !important;
  --dark-2: #ddd5c3 !important;
  --bg-muted: #111512 !important;
  --panel-bg: #141916 !important;
  --panel-bg-2: #1a201c !important;
  --border-muted: #2c332d !important;

  --primary: #7d8974 !important;
  --accent: #b98a4b !important;
  --accent-2: #d7b47b !important;
  --warning-color: #c59a58 !important;
  --info-color: #708089 !important;
  --error-color: #a24d43 !important;
  --success-color: #687c55 !important;
  --text-opaque: rgba(240, 234, 220, 0.88) !important;

  --tarkov-shadow-sm: 0 8px 20px rgba(0, 0, 0, 0.22);
  --tarkov-shadow-md: 0 16px 38px rgba(0, 0, 0, 0.34);
  --tarkov-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.48);

  --tarkov-radius-sm: 10px;
  --tarkov-radius-md: 14px;
  --tarkov-radius-lg: 18px;
  --tarkov-transition: 220ms ease;
}

html,
body {
  background: var(--main-bg-color) !important;
}

body {
  font-family: "Bender", "Manrope", Arial, sans-serif !important;
  color: var(--main-text-color) !important;
  background:
    radial-gradient(circle at 78% 18%, rgba(185, 138, 75, 0.10), transparent 18%),
    radial-gradient(circle at 65% 42%, rgba(116, 71, 58, 0.12), transparent 22%),
    linear-gradient(180deg, #0f1311 0%, #090c0b 100%) !important;
  position: relative;
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.045;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0.06) 0px,
      rgba(255,255,255,0.06) 1px,
      transparent 1px,
      transparent 3px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,0.03) 0px,
      rgba(255,255,255,0.03) 1px,
      transparent 1px,
      transparent 4px
    );
  mix-blend-mode: soft-light;
}

.app-wrapper {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  color: var(--main-text-color) !important;
  background:
    linear-gradient(90deg, rgba(8,10,9,0.96) 0%, rgba(8,10,9,0.78) 42%, rgba(8,10,9,0.52) 72%, rgba(8,10,9,0.88) 100%) !important;
}

.wrapper {
  max-width: 1280px !important;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px !important;
  padding-bottom: 28px;
}

/* ========= ТИПОГРАФИКА ========= */

body,
p,
span,
div,
input,
textarea,
select,
button,
td,
th {
  font-family: "Bender", "Manrope", Arial, sans-serif !important;
}

.tarkov-heading {
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.045em;
  line-height: 1.08;
}

.tarkov-latin {
  font-family: "Black Ops One", "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  letter-spacing: 0.065em;
  line-height: 1.04;
}

.navbar-brand,
.nav-link,
.bunner-title,
.product-modal-title,
.product-card-name,
.monitoring-title,
.modal-primary-button-text,
.app-button,
.auth-btn,
.balance-btn,
.profile-btn,
h1,
h2,
h3 {
  text-transform: uppercase;
}

/* ========= NAVBAR ========= */

.navbar {
  position: sticky;
  top: 0;
  z-index: 300;
  height: 72px !important;
  margin-bottom: 12px !important;
  border-bottom-left-radius: 16px !important;
  border-bottom-right-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(26,30,27,0.90) 0%, rgba(13,16,14,0.90) 100%) !important;
  border-bottom: 1px solid rgba(215, 180, 123, 0.12);
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.34),
    inset 0 -1px 0 rgba(255, 255, 255, 0.035);
  backdrop-filter: blur(10px);
  transition:
    background var(--tarkov-transition),
    box-shadow var(--tarkov-transition),
    border-color var(--tarkov-transition);
}

.navbar::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(215, 180, 123, 0.5), transparent);
  opacity: 0.75;
}

.navbar.tarkov-scrolled {
  background:
    linear-gradient(180deg, rgba(18,22,19,0.95) 0%, rgba(11,14,12,0.95) 100%) !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.46),
    inset 0 -1px 0 rgba(215, 180, 123, 0.12);
}

.navbar-mobile {
  height: 72px !important;
}

.navbar-brand {
  padding-left: 22px !important;
  color: #f5efe1 !important;
  font-size: 1.08rem !important;
  text-shadow: 0 0 18px rgba(185, 138, 75, 0.10);
}

.navbar-links {
  gap: 0 !important;
}

.navbar-nav {
  gap: 0 !important;
}

.nav-item {
  position: relative;
  transition:
    background var(--tarkov-transition),
    color var(--tarkov-transition),
    transform var(--tarkov-transition) !important;
}

.nav-item:hover {
  background: rgba(255, 255, 255, 0.035) !important;
  color: #fff !important;
}

.nav-link {
  padding: 8px 14px !important;
  color: var(--text-body) !important;
  font-size: 0.79rem !important;
  letter-spacing: 0.08em;
  position: relative;
}

.nav-link::after {
  content: "";
  position: absolute;
  left: 20%;
  right: 20%;
  bottom: 11px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-2), transparent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform var(--tarkov-transition);
}

.nav-item:hover .nav-link::after,
.nav-link:hover::after {
  transform: scaleX(1);
}

.auth-btns {
  height: 100%;
}

.auth-btn,
.balance-btn,
.profile-btn {
  height: 100%;
  padding: 0 18px !important;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition:
    background var(--tarkov-transition),
    color var(--tarkov-transition),
    transform var(--tarkov-transition) !important;
}

.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover {
  background: rgba(255, 255, 255, 0.045) !important;
  color: #ffffff !important;
}

/* ========= БАННЕР ========= */

.banner {
  pointer-events: auto !important;
  border-radius: var(--tarkov-radius-lg) !important;
  overflow: hidden;
  margin-top: 6px !important;
  box-shadow: var(--tarkov-shadow-md);
}

.banner-elem {
  position: relative;
  overflow: hidden;
  border-radius: var(--tarkov-radius-lg) !important;
  text-align: left !important;
  margin-bottom: 10px !important;
  border: 1px solid rgba(255,255,255,0.05);
  background:
    radial-gradient(circle at var(--mx, 78%) var(--my, 36%), rgba(201, 100, 77, 0.16), transparent 18%),
    radial-gradient(circle at 83% 18%, rgba(185, 138, 75, 0.12), transparent 12%),
    linear-gradient(90deg, rgba(8,10,9,0.96) 0%, rgba(8,10,9,0.80) 46%, rgba(8,10,9,0.28) 74%, rgba(8,10,9,0.80) 100%),
    linear-gradient(180deg, #161a18 0%, #0d110f 100%) !important;
  box-shadow:
    var(--tarkov-shadow-md),
    inset 0 1px 0 rgba(255,255,255,0.03);
  transition:
    transform 260ms ease,
    box-shadow 260ms ease,
    border-color 260ms ease;
  cursor: pointer;
  will-change: transform;
}

.banner-elem::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(7,9,8,0.88) 0%, rgba(7,9,8,0.72) 34%, rgba(7,9,8,0.18) 68%, rgba(7,9,8,0.04) 100%);
}

.banner-elem::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 45%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.34) 100%);
}

.banner-elem:hover {
  transform: translateY(-3px);
  border-color: rgba(215, 180, 123, 0.18);
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

.banner-item-link {
  position: relative;
  z-index: 2;
  min-height: 340px;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 30px !important;
  color: inherit !important;
  text-decoration: none !important;
}

.bunner-title {
  max-width: 760px;
  color: #f4eedf !important;
  font-size: clamp(28px, 3vw, 54px) !important;
  font-weight: 500 !important;
  line-height: 0.98;
  margin-bottom: 10px;
  text-shadow:
    0 2px 0 rgba(0,0,0,0.35),
    0 12px 30px rgba(0,0,0,0.30);
}

.banner-content {
  max-width: 700px;
  color: var(--text-opaque) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 16px;
}

/* ========= КНОПКИ ========= */

.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  min-height: 52px !important;
  color: #171410 !important;
  background:
    linear-gradient(180deg, #ede6d7 0%, #d8cfbe 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.72),
    0 8px 20px rgba(0,0,0,0.18);
  transition:
    transform var(--tarkov-transition),
    box-shadow var(--tarkov-transition),
    filter var(--tarkov-transition),
    background var(--tarkov-transition) !important;
}

.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.34) 50%, transparent 100%);
  transform: translateX(-135%);
  transition: transform 520ms ease;
}

.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover {
  transform: translateY(-1px);
  filter: brightness(1.02);
  background:
    linear-gradient(180deg, #f5efdf 0%, #dfd5c2 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.78),
    0 12px 24px rgba(0,0,0,0.24);
}

.app-button:hover::before,
.modal-primary-button:hover::before,
.promo-wrapper .promo-button:hover::before,
.cookie-buttons button:hover::before {
  transform: translateX(135%);
}

.app-button--active,
.app-button--primary:hover,
.app-button--primary.app-button--active {
  background:
    linear-gradient(180deg, #f3eddf 0%, #e1d7c4 100%) !important;
  color: #111 !important;
}

.app-button--danger {
  border-color: rgba(162, 77, 67, 0.38) !important;
}

.app-button--success {
  border-color: rgba(104, 124, 85, 0.42) !important;
}

.app-button--info {
  border-color: rgba(112, 128, 137, 0.42) !important;
}

/* ========= КАРТОЧКИ ========= */

.product-cards {
  gap: 12px !important;
}

.product-card {
  aspect-ratio: auto !important;
  min-height: 360px;
  position: relative;
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(20,24,21,0.98) 0%, rgba(12,15,13,0.98) 100%) !important;
  border: 1px solid rgba(255,255,255,0.055);
  box-shadow:
    0 10px 26px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.025);
  overflow: hidden;
  font-family: "Bender", "Manrope", Arial, sans-serif !important;
  transition:
    transform 240ms ease,
    box-shadow 240ms ease,
    border-color 240ms ease !important;
  will-change: transform;
}

.product-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--mx, 50%) var(--my, 20%), rgba(215, 180, 123, 0.10), transparent 22%);
  opacity: 0;
  transition: opacity 240ms ease;
}

.product-card:hover {
  transform: translateY(-5px);
  border-color: rgba(215, 180, 123, 0.18);
  box-shadow:
    0 18px 38px rgba(0,0,0,0.34),
    inset 0 1px 0 rgba(255,255,255,0.035);
}

.product-card:hover::before {
  opacity: 1;
}

.product-card-image-container {
  position: relative;
  height: 72% !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 14px 10px;
  background:
    linear-gradient(180deg, rgba(28,32,29,1) 0%, rgba(16,18,17,1) 100%) !important;
  overflow: hidden;
}

.product-card-image-container::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.24) 100%);
}

.product-card-image-container img {
  max-width: 92% !important;
  max-height: 100%;
  object-fit: contain;
  transition: transform 320ms ease;
}

.product-card:hover .product-card-image-container img {
  transform: scale(1.035);
}

.product-card-footer {
  height: 28% !important;
  max-height: none !important;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 10px;
  padding: 12px !important;
  border-top: 1px solid rgba(255,255,255,0.04);
  color: var(--main-text-color) !important;
}

.product-card-name {
  color: #f1eada !important;
  font-size: 13px !important;
  line-height: 1.18 !important;
  letter-spacing: 0.035em;
}

.product-card-price,
.product-card-discount-price {
  color: var(--accent-2) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.product-card-old-price {
  color: #8e8678 !important;
}

.product-card-label,
.product-card-badge-days,
.product-card-badge-percentage {
  border-radius: 7px !important;
  color: #fff6ea !important;
  background:
    linear-gradient(180deg, rgba(185,138,75,0.96) 0%, rgba(118,84,43,0.96) 100%) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.22);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ========= MONITORING ========= */

.monitoring {
  position: relative;
  overflow: hidden;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  background:
    linear-gradient(180deg, rgba(21,24,22,0.98) 0%, rgba(13,16,14,0.98) 100%) !important;
  border: 1px solid rgba(255,255,255,0.05);
  border-left: 2px solid rgba(215, 180, 123, 0.18) !important;
  box-shadow:
    0 10px 24px rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,255,255,0.025);
  transition:
    transform var(--tarkov-transition),
    box-shadow var(--tarkov-transition),
    border-color var(--tarkov-transition) !important;
}

.monitoring:hover {
  transform: translateY(-3px);
  box-shadow:
    0 16px 34px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.03);
}

.monitoring--active {
  border-left-color: rgba(104, 124, 85, 0.7) !important;
}

.monitoring--disabled {
  border-left-color: rgba(162, 77, 67, 0.7) !important;
}

.monitoring-title {
  color: #f1ebdc !important;
  font-size: 0.92rem !important;
}

.monitoring-title-span,
.monitoring-progress-text {
  color: var(--text-muted) !important;
}

.monitoring-progress-bar {
  height: 28px !important;
  background: #1b211d !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,0.04);
  overflow: hidden;
}

.monitoring-progress-fill--disabled {
  background: linear-gradient(90deg, #5f695a 0%, #778270 100%) !important;
}

/* ========= МОДАЛКИ ========= */

.modal-overlay {
  background:
    linear-gradient(180deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.84) 100%) !important;
  backdrop-filter: blur(6px);
}

.modal {
  border-radius: 10px 28px 10px 28px !important;
  background:
    linear-gradient(180deg, rgba(20,23,21,0.985) 0%, rgba(11,13,12,0.985) 100%) !important;
  border: 1px solid rgba(255,255,255,0.055);
  box-shadow:
    0 24px 80px rgba(0,0,0,0.56),
    inset 0 1px 0 rgba(255,255,255,0.03) !important;
}

.product-modal {
  max-width: 360px !important;
  padding: 1.2rem 1.2rem 0 !important;
  gap: 1rem !important;
}

.product-modal-title {
  color: #f3ecde !important;
  font-size: clamp(22px, 2vw, 30px) !important;
  text-shadow: 0 0 20px rgba(0,0,0,0.22);
}

.product-modal-description,
.modal-close-button-text {
  color: var(--muted-desc) !important;
}

.product-modal-inputs-zone-block,
.text-input,
select,
textarea {
  background: #171c18 !important;
  color: var(--main-text-color) !important;
  border: 1px solid rgba(255,255,255,0.05) !important;
  box-shadow: none !important;
}

.text-input:focus,
select:focus,
textarea:focus {
  border-color: rgba(215, 180, 123, 0.36) !important;
  outline: none;
}

.gallery-main-image {
  border-radius: 10px !important;
}

.gallery-thumbnails img {
  border-radius: 8px !important;
  opacity: 0.72;
  transition: opacity var(--tarkov-transition), border-color var(--tarkov-transition), transform var(--tarkov-transition);
}

.gallery-thumbnails img:hover {
  opacity: 1;
  transform: translateY(-2px);
}

.gallery-thumbnails img.active {
  opacity: 1;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 1px rgba(185, 138, 75, 0.22);
}

.gallery-nav {
  background: rgba(239, 232, 215, 0.12) !important;
  color: #f8f5ee !important;
  opacity: 1 !important;
  backdrop-filter: blur(4px);
}

.gallery-nav:hover {
  background: rgba(239, 232, 215, 0.18) !important;
}

/* ========= ФОРМЫ / ТАБЛИЦЫ / ПУСТЫЕ БЛОКИ ========= */

.form,
.profile-info,
.table,
.empty-box,
.cookie-banner {
  background:
    linear-gradient(180deg, rgba(20,24,21,0.98) 0%, rgba(13,16,14,0.98) 100%) !important;
  border: 1px solid rgba(255,255,255,0.055);
  box-shadow:
    0 10px 22px rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.025);
}

.profile-info {
  border-radius: 16px !important;
  padding: 8px !important;
}

.profile-info__row {
  border-radius: 10px !important;
}

.profile-info__row--white {
  background: rgba(255,255,255,0.02) !important;
}

.profile-info__row:hover {
  background: rgba(255,255,255,0.035) !important;
}

.table {
  border-radius: 12px !important;
  overflow: hidden;
}

.table thead {
  background: #171b18 !important;
}

.table th,
.table td {
  color: var(--main-text-color) !important;
  border-color: rgba(255,255,255,0.05) !important;
}

.empty-box {
  border-style: solid !important;
  color: var(--main-text-color) !important;
}

.empty-description {
  color: var(--text-muted) !important;
}

/* ========= COOKIE ========= */

.cookie-banner {
  border-radius: 14px !important;
  color: var(--main-text-color) !important;
  backdrop-filter: blur(10px);
}

.cookie-content h5 {
  color: #f1ebdc !important;
}

.cookie-content p {
  color: var(--muted-desc) !important;
}

/* ========= PROMO ========= */

.promo-wrapper .promo-button {
  right: 8px !important;
  border-radius: 7px !important;
  min-height: auto !important;
  padding: 6px 14px !important;
}

/* ========= СКРОЛЛ ========= */

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #0f1311;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #5d584d 0%, #8f7a58 100%);
  border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #7a6f5a 0%, #bc965d 100%);
}

/* ========= МОБИЛКА ========= */

@media (max-width: 992px) {
  .navbar {
    height: auto !important;
    border-bottom-left-radius: 14px !important;
    border-bottom-right-radius: 14px !important;
  }

  .navbar-links {
    background: linear-gradient(180deg, rgba(14,18,16,0.98) 0%, rgba(10,13,11,0.98) 100%) !important;
    border-top: 1px solid rgba(255,255,255,0.04);
  }

  .navbar-nav {
    gap: 6px !important;
    padding-bottom: 8px;
  }

  .nav-item {
    width: 100%;
    min-height: 58px;
  }

  .nav-link {
    justify-content: flex-start !important;
    padding-left: 20px !important;
  }

  .auth-btn,
  .balance-btn,
  .profile-btn {
    justify-content: flex-start !important;
    padding-left: 20px !important;
  }

  .banner-item-link {
    min-height: 280px;
    padding: 22px !important;
  }

  .bunner-title {
    font-size: clamp(24px, 8vw, 38px) !important;
  }

  .product-card {
    min-height: 330px;
  }
}

@media (max-width: 700px) {
  .product-cards {
    gap: 10px !important;
  }

  .product-card-footer {
    padding: 10px !important;
  }

  .banner-content {
    font-size: 13px !important;
  }

  .app-button {
    min-height: 48px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }

  .product-card,
  .banner-elem,
  .monitoring {
    transform: none !important;
  }
}

/* ===== МЕНЬШЕ ИКОНКА ТОВАРА ===== */

.product-card {
  min-height: 320px !important;
}

.product-card-image-container {
  height: 64% !important;
  padding: 14px 14px 6px !important;
  align-items: center !important;
  justify-content: center !important;
}

.product-card-image-container img {
  width: auto !important;
  max-width: 78% !important;
  max-height: 150px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

.product-card-footer {
  height: 36% !important;
  max-height: none !important;
  padding: 10px 12px 12px !important;
  align-items: flex-end !important;
}

/* Чуть компактнее бейджи */
.product-card-label,
.product-card-badge-days,
.product-card-badge-percentage {
  font-size: 12px !important;
}

/* Мобилка */
@media (max-width: 700px) {
  .product-card {
    min-height: 290px !important;
  }

  .product-card-image-container {
    height: 60% !important;
  }

  .product-card-image-container img {
    max-width: 72% !important;
    max-height: 120px !important;
  }

  .product-card-footer {
    height: 40% !important;
  }
}

/* ===== СДЕЛАТЬ ФОТО ТОВАРА БОЛЬШЕ ===== */

.product-card-image-container {
  height: 70% !important;
  padding: 8px 8px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.product-card-image-container img {
  width: auto !important;
  max-width: 96% !important;
  max-height: 220px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  transform: scale(1.08) !important;
  transform-origin: center center !important;
}

.product-card:hover .product-card-image-container img {
  transform: scale(1.12) !important;
}

.product-card-footer {
  height: 30% !important;
}

/* =====================================================
   TARKOV BUTTON CUT + BLUE STEEL THEME
   вставить в самый низ CSS
===================================================== */

:root {
  /* холоднее палитра */
  --primary: #6e88a3 !important;
  --accent: #7297bf !important;
  --accent-2: #a7c7e6 !important;
  --info-color: #7faad6 !important;

  --tarkov-blue-1: #e7eef5;
  --tarkov-blue-2: #ccd8e3;
  --tarkov-blue-3: #9bb7d3;
  --tarkov-blue-4: #7090b2;
  --tarkov-blue-5: #4f6881;
  --tarkov-blue-6: #2e4052;

  --tarkov-cut-size: 12px;
  --tarkov-btn-text: #12181e;
  --tarkov-btn-shadow: rgba(16, 24, 32, 0.26);
  --tarkov-btn-border: rgba(114, 151, 191, 0.38);
}

/* ========= ОБЩИЙ ХОЛОДНЫЙ ТОН САЙТА ========= */

body {
  background:
    radial-gradient(circle at 78% 18%, rgba(114, 151, 191, 0.10), transparent 18%),
    radial-gradient(circle at 64% 42%, rgba(72, 104, 141, 0.14), transparent 24%),
    linear-gradient(180deg, #101514 0%, #090c0d 100%) !important;
}

.navbar {
  border-bottom: 1px solid rgba(167, 199, 230, 0.14) !important;
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.34),
    inset 0 -1px 0 rgba(255, 255, 255, 0.03) !important;
}

.navbar::after {
  background: linear-gradient(90deg, transparent, rgba(167, 199, 230, 0.42), transparent) !important;
}

.nav-link::after {
  background: linear-gradient(90deg, transparent, var(--accent-2), transparent) !important;
}

.banner-elem {
  background:
    radial-gradient(circle at var(--mx, 78%) var(--my, 36%), rgba(121, 165, 211, 0.16), transparent 18%),
    radial-gradient(circle at 84% 18%, rgba(79, 104, 129, 0.16), transparent 13%),
    linear-gradient(90deg, rgba(8,10,9,0.96) 0%, rgba(8,10,9,0.80) 46%, rgba(8,10,9,0.28) 74%, rgba(8,10,9,0.80) 100%),
    linear-gradient(180deg, #171d20 0%, #0d1113 100%) !important;
}

.product-card:hover,
.monitoring:hover,
.banner-elem:hover {
  border-color: rgba(167, 199, 230, 0.18) !important;
}

.product-card::before {
  background:
    radial-gradient(circle at var(--mx, 50%) var(--my, 20%), rgba(167, 199, 230, 0.10), transparent 22%) !important;
}

.monitoring {
  border-left: 2px solid rgba(114, 151, 191, 0.26) !important;
}

.monitoring--active {
  border-left-color: rgba(118, 162, 207, 0.74) !important;
}

.gallery-thumbnails img.active {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 1px rgba(114, 151, 191, 0.28) !important;
}

.product-card-label,
.product-card-badge-days,
.product-card-badge-percentage {
  background:
    linear-gradient(180deg, rgba(113, 148, 187, 0.96) 0%, rgba(73, 99, 128, 0.96) 100%) !important;
  color: #f3f7fb !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22) !important;
}

.monitoring-progress-fill--disabled {
  background: linear-gradient(90deg, #5b6f84 0%, #7894b1 100%) !important;
}

/* ========= КНОПКИ С НАДРЕЗОМ ========= */
/* сюда включены основные кнопки сайта */

.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  border: none !important;
  border-radius: 0 !important;

  -webkit-clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--tarkov-cut-size)),
    calc(100% - var(--tarkov-cut-size)) 100%,
    0 100%
  );
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--tarkov-cut-size)),
    calc(100% - var(--tarkov-cut-size)) 100%,
    0 100%
  );

  background:
    linear-gradient(180deg, var(--tarkov-blue-1) 0%, var(--tarkov-blue-2) 100%) !important;
  color: var(--tarkov-btn-text) !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 10px 22px var(--tarkov-btn-shadow),
    0 0 0 1px var(--tarkov-btn-border) !important;

  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.035em !important;

  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    filter 220ms ease,
    background 220ms ease !important;
}

/* белый блик сверху */
.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before,
.auth-btn::before,
.balance-btn::before,
.profile-btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button[type="submit"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.04) 38%, transparent 100%),
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.34) 50%, transparent 100%);
  transform: translateX(-130%);
  transition: transform 520ms ease;
  z-index: 1;
}

/* затемнение в месте надреза */
.app-button::after,
.modal-primary-button::after,
.promo-wrapper .promo-button::after,
.cookie-buttons button::after,
.auth-btn::after,
.balance-btn::after,
.profile-btn::after,
input[type="submit"]::after,
input[type="button"]::after,
button[type="submit"]::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(var(--tarkov-cut-size) + 4px);
  height: calc(var(--tarkov-cut-size) + 4px);
  pointer-events: none;
  background: linear-gradient(
    135deg,
    transparent 0 46%,
    rgba(79, 104, 129, 0.34) 47%,
    rgba(79, 104, 129, 0.88) 100%
  );
  z-index: 2;
}

/* текст поверх блика */
.app-button > *,
.modal-primary-button > *,
.promo-wrapper .promo-button > *,
.cookie-buttons button > *,
.auth-btn > *,
.balance-btn > *,
.profile-btn > * {
  position: relative;
  z-index: 3;
}

/* hover */
.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover,
.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.02) !important;
  background:
    linear-gradient(180deg, #f0f5fb 0%, #d7e2eb 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 14px 24px rgba(0, 0, 0, 0.24),
    0 0 0 1px rgba(126, 164, 205, 0.44) !important;
}

.app-button:hover::before,
.modal-primary-button:hover::before,
.promo-wrapper .promo-button:hover::before,
.cookie-buttons button:hover::before,
.auth-btn:hover::before,
.balance-btn:hover::before,
.profile-btn:hover::before,
input[type="submit"]:hover::before,
input[type="button"]:hover::before,
button[type="submit"]:hover::before {
  transform: translateX(130%);
}

/* active */
.app-button:active,
.modal-primary-button:active,
.promo-wrapper .promo-button:active,
.cookie-buttons button:active,
.auth-btn:active,
.balance-btn:active,
.profile-btn:active,
input[type="submit"]:active,
input[type="button"]:active,
button[type="submit"]:active {
  transform: translateY(1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.72),
    0 5px 12px rgba(0,0,0,0.18),
    0 0 0 1px rgba(114, 151, 191, 0.36) !important;
}

/* размер основных CTA */
.app-button,
.modal-primary-button {
  min-height: 56px !important;
  padding: 0 22px !important;
  font-size: 16px !important;
}

/* маленькие кнопки */
.promo-wrapper .promo-button,
.cookie-buttons button {
  min-height: 42px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}

/* кнопки в шапке */
.auth-btn,
.balance-btn,
.profile-btn {
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 6px !important;
  padding: 0 18px !important;
  align-self: center !important;
  justify-content: center !important;
  background:
    linear-gradient(180deg, #dde8f2 0%, #c5d3de 100%) !important;
}

/* активная кнопка */
.app-button--active,
.app-button--primary:hover,
.app-button--primary.app-button--active {
  background:
    linear-gradient(180deg, #eef4fb 0%, #d8e3ec 100%) !important;
  color: #10161c !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.92),
    0 14px 24px rgba(0,0,0,0.24),
    0 0 0 1px rgba(137, 177, 219, 0.46) !important;
}

/* цветовые варианты */
.app-button--success {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.82),
    0 10px 22px rgba(0,0,0,0.24),
    0 0 0 1px rgba(100, 151, 187, 0.40) !important;
}

.app-button--info {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.82),
    0 10px 22px rgba(0,0,0,0.24),
    0 0 0 1px rgba(114, 151, 191, 0.42) !important;
}

.app-button--danger {
  background:
    linear-gradient(180deg, #ead6d6 0%, #d6bebe 100%) !important;
  color: #1a1010 !important;
}

/* если где-то кнопка растягивается слишком сильно */
.auth-btns {
  gap: 8px !important;
  align-items: center !important;
}

/* мобилка */
@media (max-width: 700px) {
  :root {
    --tarkov-cut-size: 10px;
  }

  .app-button,
  .modal-primary-button {
    min-height: 50px !important;
    font-size: 14px !important;
  }

  .auth-btn,
  .balance-btn,
  .profile-btn {
    height: 42px !important;
    min-height: 42px !important;
    margin: 4px 0 !important;
  }
}

/* =========================================
   BUTTON CUT FIX
   срез справа СВЕРХУ, ровный
========================================= */

:root {
  --tarkov-cut-size: 14px;
}

/* основные кнопки */
.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  border: none !important;
  border-radius: 0 !important;

  /* срез справа сверху */
  -webkit-clip-path: polygon(
    0 0,
    calc(100% - var(--tarkov-cut-size)) 0,
    100% var(--tarkov-cut-size),
    100% 100%,
    0 100%
  );
  clip-path: polygon(
    0 0,
    calc(100% - var(--tarkov-cut-size)) 0,
    100% var(--tarkov-cut-size),
    100% 100%,
    0 100%
  );

  background: linear-gradient(180deg, #e7eef5 0%, #ccd8e3 100%) !important;
  color: #12181e !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.82),
    0 10px 22px rgba(16,24,32,0.26),
    0 0 0 1px rgba(114,151,191,0.38) !important;

  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.035em !important;

  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    filter 220ms ease,
    background 220ms ease !important;
}

/* верхний блик */
.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before,
.auth-btn::before,
.balance-btn::before,
.profile-btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button[type="submit"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0.04) 38%, transparent 100%),
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.28) 50%, transparent 100%);
  transform: translateX(-130%);
  transition: transform 520ms ease;
}

/* ровная линия самого среза */
.app-button::after,
.modal-primary-button::after,
.promo-wrapper .promo-button::after,
.cookie-buttons button::after,
.auth-btn::after,
.balance-btn::after,
.profile-btn::after,
input[type="submit"]::after,
input[type="button"]::after,
button[type="submit"]::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: var(--tarkov-cut-size);
  height: var(--tarkov-cut-size);
  pointer-events: none;
  z-index: 2;

  /* аккуратная диагональ без грязи */
  background: linear-gradient(
    135deg,
    transparent 0 48%,
    rgba(120, 145, 170, 0.95) 49% 51%,
    rgba(255,255,255,0.10) 52% 100%
  );
}

/* текст поверх */
.app-button > *,
.modal-primary-button > *,
.promo-wrapper .promo-button > *,
.cookie-buttons button > *,
.auth-btn > *,
.balance-btn > *,
.profile-btn > * {
  position: relative;
  z-index: 3;
}

/* hover */
.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover,
.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.02) !important;
  background: linear-gradient(180deg, #f0f5fb 0%, #d7e2eb 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.9),
    0 14px 24px rgba(0,0,0,0.24),
    0 0 0 1px rgba(126,164,205,0.44) !important;
}

.app-button:hover::before,
.modal-primary-button:hover::before,
.promo-wrapper .promo-button:hover::before,
.cookie-buttons button:hover::before,
.auth-btn:hover::before,
.balance-btn:hover::before,
.profile-btn:hover::before,
input[type="submit"]:hover::before,
input[type="button"]:hover::before,
button[type="submit"]:hover::before {
  transform: translateX(130%);
}

/* =========================================
   TRUE TARKOV BUTTON SHAPE
   2 среза: слева сверху + справа снизу
   вставить в самый низ CSS
========================================= */

:root {
  --tarkov-btn-cut: 14px;

  --tarkov-btn-top: #eef3f6;
  --tarkov-btn-mid: #dde4e8;
  --tarkov-btn-bottom: #c6d1d9;

  --tarkov-btn-text: #1a2127;
  --tarkov-btn-border: rgba(166, 187, 204, 0.42);
  --tarkov-btn-shadow: rgba(0, 0, 0, 0.26);

  --tarkov-btn-outline-bg: rgba(10, 14, 17, 0.22);
  --tarkov-btn-outline-border: rgba(182, 202, 219, 0.34);
  --tarkov-btn-outline-dash: rgba(214, 229, 240, 0.36);
  --tarkov-btn-outline-text: #d8e0e6;
}

/* Убиваем старые "нарисованные" углы */
.app-button::after,
.modal-primary-button::after,
.promo-wrapper .promo-button::after,
.cookie-buttons button::after,
.auth-btn::after,
.balance-btn::after,
.profile-btn::after,
input[type="submit"]::after,
input[type="button"]::after,
button[type="submit"]::after {
  content: none !important;
  display: none !important;
}

/* Базовый стиль всех главных кнопок */
.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  --cut: var(--tarkov-btn-cut);

  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 8px;

  border: none !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  isolation: isolate;

  /* вот правильная форма */
  -webkit-clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  );
  clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  );

  background: linear-gradient(
    180deg,
    var(--tarkov-btn-top) 0%,
    var(--tarkov-btn-mid) 58%,
    var(--tarkov-btn-bottom) 100%
  ) !important;

  color: var(--tarkov-btn-text) !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.82),
    inset 0 -1px 0 rgba(106, 129, 149, 0.10),
    0 0 0 1px var(--tarkov-btn-border),
    0 10px 22px var(--tarkov-btn-shadow) !important;

  transition:
    transform 180ms ease,
    filter 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease !important;
}

/* мягкий верхний блик, без кривого угла */
.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before,
.auth-btn::before,
.balance-btn::before,
.profile-btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button[type="submit"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0.20) 0%,
    rgba(255,255,255,0.06) 34%,
    rgba(255,255,255,0.00) 60%
  );
}

/* текст выше блика */
.app-button > *,
.modal-primary-button > *,
.promo-wrapper .promo-button > *,
.cookie-buttons button > *,
.auth-btn > *,
.balance-btn > *,
.profile-btn > * {
  position: relative;
  z-index: 2;
}

/* hover */
.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover,
.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.02) !important;
  background: linear-gradient(
    180deg,
    #f3f7fa 0%,
    #e2e8ec 58%,
    #ccd7de 100%
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.88),
    inset 0 -1px 0 rgba(106, 129, 149, 0.12),
    0 0 0 1px rgba(175, 197, 214, 0.48),
    0 14px 24px rgba(0,0,0,0.24) !important;
}

/* active */
.app-button:active,
.modal-primary-button:active,
.promo-wrapper .promo-button:active,
.cookie-buttons button:active,
.auth-btn:active,
.balance-btn:active,
.profile-btn:active,
input[type="submit"]:active,
input[type="button"]:active,
button[type="submit"]:active {
  transform: translateY(0) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.72),
    inset 0 -1px 0 rgba(106, 129, 149, 0.14),
    0 0 0 1px rgba(150, 174, 193, 0.40),
    0 6px 12px rgba(0,0,0,0.18) !important;
}

/* размеры */
.app-button,
.modal-primary-button {
  min-height: 58px !important;
  padding: 0 24px !important;
  font-size: 16px !important;
}

.auth-btn,
.balance-btn,
.profile-btn {
  --cut: 10px;
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}

.promo-wrapper .promo-button,
.cookie-buttons button {
  --cut: 10px;
  min-height: 42px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}

/* outlined-кнопка как на "Активировать промо" */
.tarkov-outline-button,
.promo-activator,
.activate-promo,
.promo-toggle {
  --cut: 14px;

  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;

  border: none !important;
  border-radius: 0 !important;
  overflow: hidden !important;

  -webkit-clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  );
  clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  );

  background: var(--tarkov-btn-outline-bg) !important;
  color: var(--tarkov-btn-outline-text) !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;

  box-shadow:
    inset 0 0 0 1px var(--tarkov-btn-outline-border),
    0 10px 22px rgba(0,0,0,0.20) !important;
}

.tarkov-outline-button::before,
.promo-activator::before,
.activate-promo::before,
.promo-toggle::before {
  content: "";
  position: absolute;
  inset: 1px;
  pointer-events: none;
  -webkit-clip-path: polygon(
    calc(var(--cut) - 1px) 0,
    100% 0,
    100% calc(100% - calc(var(--cut) - 1px)),
    calc(100% - calc(var(--cut) - 1px)) 100%,
    0 100%,
    0 calc(var(--cut) - 1px)
  );
  clip-path: polygon(
    calc(var(--cut) - 1px) 0,
    100% 0,
    100% calc(100% - calc(var(--cut) - 1px)),
    calc(100% - calc(var(--cut) - 1px)) 100%,
    0 100%,
    0 calc(var(--cut) - 1px)
  );
  border: 1px dashed var(--tarkov-btn-outline-dash);
  opacity: 0.9;
}

.tarkov-outline-button:hover,
.promo-activator:hover,
.activate-promo:hover,
.promo-toggle:hover {
  background: rgba(16, 22, 27, 0.28) !important;
  box-shadow:
    inset 0 0 0 1px rgba(194, 214, 229, 0.42),
    0 12px 24px rgba(0,0,0,0.24) !important;
}

/* мобилка */
@media (max-width: 700px) {
  :root {
    --tarkov-btn-cut: 11px;
  }

  .app-button,
  .modal-primary-button {
    min-height: 50px !important;
    font-size: 14px !important;
    padding: 0 18px !important;
  }

  .auth-btn,
  .balance-btn,
  .profile-btn,
  .promo-wrapper .promo-button,
  .cookie-buttons button {
    --cut: 9px;
  }
}

/* =========================================
   LK ICONS + PROMO HOVER FILL
   вставить в самый низ CSS
========================================= */

:root {
  --lk-row-bg: rgba(8, 12, 13, 0.82);
  --lk-row-border: rgba(255, 255, 255, 0.04);
  --lk-row-hover-fill: rgba(255, 255, 255, 0.055);
  --lk-row-text: #e7ebee;
  --lk-row-muted: rgba(220, 229, 236, 0.74);

  --lk-logout-text: #cf5d5d;
  --lk-logout-border: rgba(207, 93, 93, 0.72);
  --lk-logout-hover-fill: rgba(255, 255, 255, 0.03);

  --promo-bg: rgba(10, 14, 17, 0.34);
  --promo-border: rgba(198, 214, 226, 0.34);
  --promo-dash: rgba(226, 236, 243, 0.42);
  --promo-text: #dce5eb;
  --promo-hover-fill: rgba(255, 255, 255, 0.055);

  --promo-cut: 14px;
}

/* ===== ЛК ЗАГОЛОВОК ===== */

.tarkov-cabinet-title {
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: #f0f4f7 !important;
}

/* ===== ПУНКТЫ МЕНЮ ЛК ===== */

.tarkov-menu-item {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 16px 0 48px !important;
  border-radius: 10px !important;
  background: var(--lk-row-bg) !important;
  border: 1px solid var(--lk-row-border) !important;
  color: var(--lk-row-text) !important;
  text-decoration: none !important;
  overflow: hidden !important;
  isolation: isolate;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease,
    color 180ms ease !important;
}

.tarkov-menu-item::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  opacity: 0.82;
  background-color: var(--lk-row-muted);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 2;
}

.tarkov-menu-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0.035) 0%,
    rgba(255,255,255,0.018) 36%,
    transparent 100%
  );
  opacity: 0;
  transition: opacity 180ms ease;
  z-index: 1;
}

.tarkov-menu-item:hover {
  background: rgba(14, 18, 21, 0.88) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow:
    inset 0 0 0 999px var(--lk-row-hover-fill),
    0 8px 18px rgba(0,0,0,0.18) !important;
  color: #f1f5f8 !important;
  transform: translateY(-1px) !important;
}

.tarkov-menu-item:hover::after {
  opacity: 1;
}

.tarkov-menu-item:hover::before {
  opacity: 1;
  background-color: #eef4f8;
}

/* logout */
.tarkov-menu-item.is-logout {
  color: var(--lk-logout-text) !important;
  border: 1px dashed var(--lk-logout-border) !important;
  background: rgba(10, 12, 14, 0.72) !important;
}

.tarkov-menu-item.is-logout::before {
  background-color: var(--lk-logout-text);
}

.tarkov-menu-item.is-logout:hover {
  box-shadow:
    inset 0 0 0 999px var(--lk-logout-hover-fill),
    0 8px 18px rgba(0,0,0,0.16) !important;
  color: #e67c7c !important;
}

/* если это app-button, сбиваем старый bevel */
.tarkov-menu-item.app-button,
.tarkov-menu-item.modal-primary-button,
.tarkov-menu-item.auth-btn,
.tarkov-menu-item.balance-btn,
.tarkov-menu-item.profile-btn {
  clip-path: none !important;
  -webkit-clip-path: none !important;
  min-height: 42px !important;
  height: 42px !important;
  font-family: "Bender", "Manrope", Arial, sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}

.tarkov-menu-item.app-button > *,
.tarkov-menu-item.modal-primary-button > *,
.tarkov-menu-item.auth-btn > *,
.tarkov-menu-item.balance-btn > *,
.tarkov-menu-item.profile-btn > * {
  position: relative;
  z-index: 2;
}

/* ===== ИКОНКИ ЧЕРЕЗ MASK ===== */

.tarkov-menu-item.is-info::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 10v6'/%3E%3Cpath d='M12 7h.01'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 10v6'/%3E%3Cpath d='M12 7h.01'/%3E%3C/svg%3E") center/contain no-repeat;
}

.tarkov-menu-item.is-purchases::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.2 10.2a1 1 0 0 0 1 .8h8.9a1 1 0 0 0 1-.8L20 8H7'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.2 10.2a1 1 0 0 0 1 .8h8.9a1 1 0 0 0 1-.8L20 8H7'/%3E%3C/svg%3E") center/contain no-repeat;
}

.tarkov-menu-item.is-rent::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/contain no-repeat;
}

.tarkov-menu-item.is-payments::before {
  -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E\") center/contain no-repeat;
  mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E\") center/contain no-repeat;
}

.tarkov-menu-item.is-promocodes::before {
  -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8a2 2 0 0 0 2-2h12v4a2 2 0 1 1 0 4v4H6a2 2 0 0 0-2-2V8z'/%3E%3Cpath d='M12 6v12'/%3E%3C/svg%3E\") center/contain no-repeat;
  mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8a2 2 0 0 0 2-2h12v4a2 2 0 1 1 0 4v4H6a2 2 0 0 0-2-2V8z'/%3E%3Cpath d='M12 6v12'/%3E%3C/svg%3E\") center/contain no-repeat;
}

.tarkov-menu-item.is-transfer::before {
  -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h11'/%3E%3Cpath d='m14 4 4 3-4 3'/%3E%3Cpath d='M17 17H6'/%3E%3Cpath d='m10 14-4 3 4 3'/%3E%3C/svg%3E\") center/contain no-repeat;
  mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h11'/%3E%3Cpath d='m14 4 4 3-4 3'/%3E%3Cpath d='M17 17H6'/%3E%3Cpath d='m10 14-4 3 4 3'/%3E%3C/svg%3E\") center/contain no-repeat;
}

.tarkov-menu-item.is-logout::before {
  -webkit-mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E\") center/contain no-repeat;
  mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E\") center/contain no-repeat;
}

/* ===== АКТИВИРОВАТЬ ПРОМО ===== */

.tarkov-promo-activator {
  --cut: var(--promo-cut);

  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 58px !important;
  width: 100% !important;
  padding: 0 22px !important;
  color: var(--promo-text) !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  background: var(--promo-bg) !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  isolation: isolate;
  clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  ) !important;
  -webkit-clip-path: polygon(
    var(--cut) 0,
    100% 0,
    100% calc(100% - var(--cut)),
    calc(100% - var(--cut)) 100%,
    0 100%,
    0 var(--cut)
  ) !important;
  box-shadow:
    inset 0 0 0 1px var(--promo-border),
    0 8px 18px rgba(0,0,0,0.16) !important;
  transition:
    box-shadow 180ms ease,
    background 180ms ease,
    transform 180ms ease !important;
}

.tarkov-promo-activator::before {
  content: "";
  position: absolute;
  inset: 1px;
  pointer-events: none;
  z-index: 1;
  clip-path: polygon(
    calc(var(--cut) - 1px) 0,
    100% 0,
    100% calc(100% - calc(var(--cut) - 1px)),
    calc(100% - calc(var(--cut) - 1px)) 100%,
    0 100%,
    0 calc(var(--cut) - 1px)
  );
  -webkit-clip-path: polygon(
    calc(var(--cut) - 1px) 0,
    100% 0,
    100% calc(100% - calc(var(--cut) - 1px)),
    calc(100% - calc(var(--cut) - 1px)) 100%,
    0 100%,
    0 calc(var(--cut) - 1px)
  );
  border: 1px dashed var(--promo-dash);
  opacity: 0.92;
}

.tarkov-promo-activator::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.045) 0%,
      rgba(255,255,255,0.02) 36%,
      transparent 100%
    ),
    linear-gradient(90deg, rgba(255,255,255,0.03), rgba(255,255,255,0.04));
  opacity: 0;
  transition: opacity 180ms ease;
}

.tarkov-promo-activator:hover {
  background: rgba(14, 18, 22, 0.42) !important;
  box-shadow:
    inset 0 0 0 1px rgba(214, 228, 238, 0.42),
    0 10px 22px rgba(0,0,0,0.20) !important;
  transform: translateY(-1px) !important;
}

.tarkov-promo-activator:hover::after {
  opacity: 1;
}

@media (max-width: 700px) {
  .tarkov-promo-activator {
    min-height: 52px !important;
    --cut: 11px;
  }
}

/* =========================================
   HOVER GLOW ONLY FOR CUT BUTTON
   текст всегда черный, светится только кнопка
========================================= */

.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  color: #12181e !important;
  text-shadow: none !important;
  filter: none !important;
  transition:
    box-shadow 180ms ease,
    background 180ms ease,
    transform 180ms ease !important;
}

/* весь текст и иконки внутри всегда черные */
.app-button *,
.modal-primary-button *,
.promo-wrapper .promo-button *,
.cookie-buttons button *,
.auth-btn *,
.balance-btn *,
.profile-btn *,
input[type="submit"] *,
input[type="button"] *,
button[type="submit"] * {
  color: #12181e !important;
  text-shadow: none !important;
  transition: none !important;
}

/* если внутри svg / icon */
.app-button svg,
.modal-primary-button svg,
.promo-wrapper .promo-button svg,
.cookie-buttons button svg,
.auth-btn svg,
.balance-btn svg,
.profile-btn svg,
.app-button i,
.modal-primary-button i,
.promo-wrapper .promo-button i,
.cookie-buttons button i,
.auth-btn i,
.balance-btn i,
.profile-btn i {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  filter: none !important;
}

/* убираем старый блик/анимацию если был */
.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before,
.auth-btn::before,
.balance-btn::before,
.profile-btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button[type="submit"]::before {
  display: none !important;
}

/* обычное состояние */
.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  background: linear-gradient(180deg, #eef3f6 0%, #dde4e8 58%, #c6d1d9 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.82),
    inset 0 -1px 0 rgba(106,129,149,0.10),
    0 0 0 1px rgba(166,187,204,0.42),
    0 10px 22px rgba(0,0,0,0.26) !important;
}

/* hover — светится только сама кнопка */
.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover,
.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover {
  color: #12181e !important;
  filter: none !important;
  transform: translateY(-1px) !important;
  background: linear-gradient(180deg, #f2f6f9 0%, #e4eaee 58%, #d0dae1 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.90),
    inset 0 -1px 0 rgba(120,140,158,0.10),
    0 0 0 1px rgba(190,208,222,0.55),
    0 0 12px rgba(245,248,252,0.65),
    0 0 24px rgba(222,232,240,0.38),
    0 14px 24px rgba(0,0,0,0.24) !important;
}

/* текст и иконка на hover тоже не меняются */
.app-button:hover *,
.modal-primary-button:hover *,
.promo-wrapper .promo-button:hover *,
.cookie-buttons button:hover *,
.auth-btn:hover *,
.balance-btn:hover *,
.profile-btn:hover *,
input[type="submit"]:hover *,
input[type="button"]:hover *,
button[type="submit"]:hover * {
  color: #12181e !important;
  text-shadow: none !important;
  filter: none !important;
}

/* active */
.app-button:active,
.modal-primary-button:active,
.promo-wrapper .promo-button:active,
.cookie-buttons button:active,
.auth-btn:active,
.balance-btn:active,
.profile-btn:active,
input[type="submit"]:active,
input[type="button"]:active,
button[type="submit"]:active {
  color: #12181e !important;
  transform: translateY(0) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.75),
    inset 0 -1px 0 rgba(120,140,158,0.10),
    0 0 0 1px rgba(170,189,205,0.44),
    0 6px 12px rgba(0,0,0,0.18) !important;
}

/* =========================================
   REAL BACKGROUND GLOW FOR CUT BUTTON
========================================= */

.app-button,
.modal-primary-button,
.promo-wrapper .promo-button,
.cookie-buttons button,
.auth-btn,
.balance-btn,
.profile-btn,
input[type="submit"],
input[type="button"],
button[type="submit"] {
  position: relative !important;
  overflow: visible !important; /* главное */
  isolation: isolate !important;
  color: #12181e !important;
  text-shadow: none !important;
  z-index: 1;
}

/* текст и иконки всегда черные */
.app-button *,
.modal-primary-button *,
.promo-wrapper .promo-button *,
.cookie-buttons button *,
.auth-btn *,
.balance-btn *,
.profile-btn *,
input[type="submit"] *,
input[type="button"] *,
button[type="submit"] * {
  color: #12181e !important;
  text-shadow: none !important;
  filter: none !important;
  position: relative;
  z-index: 3;
}

.app-button svg,
.modal-primary-button svg,
.promo-wrapper .promo-button svg,
.cookie-buttons button svg,
.auth-btn svg,
.balance-btn svg,
.profile-btn svg,
.app-button i,
.modal-primary-button i,
.promo-wrapper .promo-button i,
.cookie-buttons button i,
.auth-btn i,
.balance-btn i,
.profile-btn i {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* само свечение ЗА кнопкой */
.app-button::before,
.modal-primary-button::before,
.promo-wrapper .promo-button::before,
.cookie-buttons button::before,
.auth-btn::before,
.balance-btn::before,
.profile-btn::before,
input[type="submit"]::before,
input[type="button"]::before,
button[type="submit"]::before {
  content: "";
  position: absolute;
  inset: -10px;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  border-radius: 0;
  transition:
    opacity 180ms ease,
    transform 180ms ease,
    filter 180ms ease;
  -webkit-clip-path: polygon(
    14px 0,
    100% 0,
    100% calc(100% - 14px),
    calc(100% - 14px) 100%,
    0 100%,
    0 14px
  );
  clip-path: polygon(
    14px 0,
    100% 0,
    100% calc(100% - 14px),
    calc(100% - 14px) 100%,
    0 100%,
    0 14px
  );
  background: rgba(240, 246, 252, 0.9);
  filter: blur(10px);
  transform: scale(0.98);
}

/* сама кнопка поверх свечения */
.app-button::after,
.modal-primary-button::after,
.promo-wrapper .promo-button::after,
.cookie-buttons button::after,
.auth-btn::after,
.balance-btn::after,
.profile-btn::after,
input[type="submit"]::after,
input[type="button"]::after,
button[type="submit"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0.16) 0%,
    rgba(255,255,255,0.05) 34%,
    transparent 100%
  );
}

/* hover: светится только фон */
.app-button:hover,
.modal-primary-button:hover,
.promo-wrapper .promo-button:hover,
.cookie-buttons button:hover,
.auth-btn:hover,
.balance-btn:hover,
.profile-btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover {
  color: #12181e !important;
  transform: translateY(-1px) !important;
  background: linear-gradient(180deg, #f2f6f9 0%, #e4eaee 58%, #d0dae1 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.90),
    inset 0 -1px 0 rgba(120,140,158,0.10),
    0 0 0 1px rgba(190,208,222,0.55),
    0 14px 24px rgba(0,0,0,0.24) !important;
}

.app-button:hover::before,
.modal-primary-button:hover::before,
.promo-wrapper .promo-button:hover::before,
.cookie-buttons button:hover::before,
.auth-btn:hover::before,
.balance-btn:hover::before,
.profile-btn:hover::before,
input[type="submit"]:hover::before,
input[type="button"]:hover::before,
button[type="submit"]:hover::before {
  opacity: 1;
  transform: scale(1.04);
  filter: blur(14px);
}

/* родителям не даем резать свечение */
.promo-wrapper,
.banner-item-link,
.product-card-footer,
.modal,
.modal-content,
.auth-btns {
  overflow: visible !important;
}

/* =========================================
   MODAL FOOTER FIX
   - иконка покупки чуть левее
   - "Закрыть" в красном promo-стиле
========================================= */

/* нижняя зона модалки */
.modal-footer-buttons {
  align-items: flex-end !important;
  gap: 18px !important;
}

/* =========================
   КНОПКА "ПРИОБРЕСТИ"
========================= */

.modal-primary-button {
  min-width: 140px !important;
  justify-content: center !important;
  gap: 8px !important;
  padding-left: 20px !important;
  padding-right: 22px !important;
}

/* текст внутри */
.modal-primary-button-text {
  color: #12181e !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-shadow: none !important;
}

/* иконка покупки / чек / svg / icon */
.modal-primary-button svg,
.modal-primary-button i,
.modal-primary-button .icon,
.modal-primary-button [class*="icon"] {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  flex-shrink: 0;
  transform: translateX(-3px) !important; /* чуть левее */
}

/* если иконка лежит рядом с текстом как отдельный span */
.modal-primary-button-text > svg,
.modal-primary-button-text > i,
.modal-primary-button-text > .icon,
.modal-primary-button-text > [class*="icon"] {
  transform: translateX(-4px) !important;
}

/* hover: текст всегда статичный чёрный */
.modal-primary-button:hover,
.modal-primary-button:hover .modal-primary-button-text,
.modal-primary-button:hover svg,
.modal-primary-button:hover i,
.modal-primary-button:hover .icon,
.modal-primary-button:hover [class*="icon"] {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  text-shadow: none !important;
}

/* =========================
   КНОПКА "ЗАКРЫТЬ"
========================= */

.modal-close-button {
  position: relative !important;
  background: transparent !important;
  border: none !important;
  min-height: 36px !important;
  height: auto !important;
  margin-left: 0 !important;
  padding: 0 0 10px 0 !important;
  display: inline-flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* текст как на твоём примере */
.modal-close-button-text {
  position: relative !important;
  color: #c85a5a !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.035em !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  transition: color 180ms ease, opacity 180ms ease !important;
}

/* точки снизу */
.modal-close-button-text::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 3px;
  pointer-events: none;
  opacity: 0.95;
  background-image: radial-gradient(circle, rgba(200, 90, 90, 0.78) 1px, transparent 1.4px);
  background-size: 8px 3px;
  background-repeat: repeat-x;
  background-position: left center;
}

/* hover для закрыть */
.modal-close-button:hover,
.modal-close-button:hover .modal-close-button-text {
  background: transparent !important;
  box-shadow: none !important;
  color: #df6d6d !important;
  opacity: 1 !important;
}

/* чуть мягче точки на hover */
.modal-close-button:hover .modal-close-button-text::after {
  background-image: radial-gradient(circle, rgba(223, 109, 109, 0.92) 1px, transparent 1.4px);
}

/* если у close есть иконка-крестик — скрыть, чтобы не мешал стилю */
.modal-close-button svg,
.modal-close-button i:not(.modal-close-button-text),
.modal-close-button .icon {
  display: none !important;
}

/* =========================================
   PRODUCT MODAL FOOTER FIX — ONLY CSS
   вставить в самый низ CSS
========================================= */

/* сама модалка */
.product-modal {
  max-width: 360px !important;
  width: min(92vw, 360px) !important;
  padding: 1rem 1rem 1rem !important;
  box-sizing: border-box !important;
}

/* футер модалки */
.modal-footer-buttons {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  column-gap: 16px !important;
  row-gap: 10px !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* =========================
   ЗАКРЫТЬ
========================= */

.modal-close-button {
  all: unset;
  display: inline-flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  align-self: end !important;
  justify-self: start !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  cursor: pointer !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  position: relative !important;
}

.modal-close-button::before,
.modal-close-button::after {
  content: none !important;
  display: none !important;
}

.modal-close-button-text {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 0 10px 0 !important;
  white-space: nowrap !important;

  color: #c85757 !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.modal-close-button-text::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 3px !important;
  pointer-events: none !important;
  opacity: 0.95 !important;
  background-image: radial-gradient(circle, rgba(200,87,87,0.95) 1px, transparent 1.45px) !important;
  background-size: 8px 3px !important;
  background-repeat: repeat-x !important;
  background-position: left center !important;
}

.modal-close-button:hover,
.modal-close-button:hover .modal-close-button-text {
  background: transparent !important;
  box-shadow: none !important;
  color: #df6c6c !important;
  opacity: 1 !important;
}

.modal-close-button:hover .modal-close-button-text::after {
  background-image: radial-gradient(circle, rgba(223,108,108,0.98) 1px, transparent 1.45px) !important;
}

/* если внутри close есть крестик/иконка — скрываем */
.modal-close-button svg,
.modal-close-button i,
.modal-close-button .icon,
.modal-close-button [class*="icon"] {
  display: none !important;
}

/* =========================
   ПРИОБРЕСТИ
========================= */

.modal-primary-button {
  justify-self: end !important;
  align-self: end !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;

  min-width: 140px !important;
  width: auto !important;
  max-width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;

  margin: 0 !important;
  padding: 0 22px 0 20px !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

.modal-primary-button-text {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
  color: #12181e !important;
  text-shadow: none !important;
}

/* если у кнопки есть иконка */
.modal-primary-button svg,
.modal-primary-button i,
.modal-primary-button .icon,
.modal-primary-button [class*="icon"] {
  flex-shrink: 0 !important;
  transform: translateX(-2px) !important;
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* на hover текст остаётся статичным */
.modal-primary-button:hover,
.modal-primary-button:hover .modal-primary-button-text,
.modal-primary-button:hover svg,
.modal-primary-button:hover i,
.modal-primary-button:hover .icon,
.modal-primary-button:hover [class*="icon"] {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  text-shadow: none !important;
}

/* =========================
   АДАПТИВ
========================= */

@media (max-width: 420px) {
  .product-modal {
    width: min(94vw, 340px) !important;
    padding: 0.95rem 0.95rem 1rem !important;
  }

  .modal-footer-buttons {
    grid-template-columns: 1fr auto !important;
    column-gap: 12px !important;
  }

  .modal-close-button-text {
    font-size: 14px !important;
  }

  .modal-primary-button {
    min-width: 130px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
  }
}

/* если места совсем мало — переносим кнопки аккуратно */
@media (max-width: 340px) {
  .modal-footer-buttons {
    grid-template-columns: 1fr !important;
  }

  .modal-close-button {
    justify-self: start !important;
  }

  .modal-primary-button {
    justify-self: stretch !important;
    width: 100% !important;
  }
}

/* =========================================
   MODAL FOOTER FINAL FIX
========================================= */

/* модалка */
.product-modal {
  max-width: 360px !important;
  width: min(92vw, 360px) !important;
  padding: 1rem 1rem 1.15rem !important;
  box-sizing: border-box !important;
}

/* нижний блок */
.modal-footer-buttons {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px !important;

  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;

  margin: 14px 0 0 !important;
  padding: 0 6px 0 6px !important;
  box-sizing: border-box !important;

  position: relative !important;
  transform: translateY(-6px) !important; /* чуть выше весь футер */
  overflow: visible !important;
}

/* =========================
   ЗАКРЫТЬ
========================= */

.modal-close-button {
  all: unset;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  position: relative !important;
  left: 10px !important; /* чуть к центру */
  top: -1px !important;  /* поднять на один уровень */

  cursor: pointer !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

.modal-close-button::before,
.modal-close-button::after {
  content: none !important;
  display: none !important;
}

.modal-close-button-text {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 0 10px 0 !important;
  white-space: nowrap !important;

  color: #c85757 !important;
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.modal-close-button-text::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 3px !important;
  pointer-events: none !important;
  opacity: 0.95 !important;
  background-image: radial-gradient(circle, rgba(200,87,87,0.95) 1px, transparent 1.45px) !important;
  background-size: 8px 3px !important;
  background-repeat: repeat-x !important;
  background-position: left center !important;
}

.modal-close-button:hover,
.modal-close-button:hover .modal-close-button-text {
  background: transparent !important;
  box-shadow: none !important;
  color: #df6c6c !important;
  opacity: 1 !important;
}

.modal-close-button:hover .modal-close-button-text::after {
  background-image: radial-gradient(circle, rgba(223,108,108,0.98) 1px, transparent 1.45px) !important;
}

.modal-close-button svg,
.modal-close-button i,
.modal-close-button .icon,
.modal-close-button [class*="icon"] {
  display: none !important;
}

/* =========================
   ПРИОБРЕСТИ
========================= */

.modal-primary-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;

  min-width: 144px !important;
  width: auto !important;
  max-width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;

  margin: 0 !important;
  padding: 0 22px !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;

  position: relative !important;
  top: -2px !important; /* чуть выше, чтобы встало в линию */
}

.modal-primary-button-text {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  white-space: nowrap !important;
  color: #12181e !important;
  text-shadow: none !important;
}

.modal-primary-button svg,
.modal-primary-button i,
.modal-primary-button .icon,
.modal-primary-button [class*="icon"] {
  flex-shrink: 0 !important;
  transform: translateX(-2px) !important;
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

.modal-primary-button:hover,
.modal-primary-button:hover .modal-primary-button-text,
.modal-primary-button:hover svg,
.modal-primary-button:hover i,
.modal-primary-button:hover .icon,
.modal-primary-button:hover [class*="icon"] {
  color: #12181e !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  text-shadow: none !important;
}

/* =========================
   УЗКИЕ ЭКРАНЫ
========================= */

@media (max-width: 420px) {
  .product-modal {
    width: min(94vw, 340px) !important;
    padding: 0.95rem 0.95rem 1.05rem !important;
  }

  .modal-footer-buttons {
    gap: 12px !important;
    padding: 0 4px !important;
    transform: translateY(-26px) !important;
  }

  .modal-close-button {
    left: 16px !important;
  }

  .modal-close-button-text {
    font-size: 14px !important;
  }

  .modal-primary-button {
    min-width: 132px !important;
    height: 44px !important;
    min-height: 44px !important;
    top: -1px !important;
  }
}

@media (max-width: 340px) {
  .modal-footer-buttons {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    transform: none !important;
  }

  .modal-close-button {
    left: 0 !important;
    top: 0 !important;
  }

  .modal-primary-button {
    width: 100% !important;
    top: 0 !important;
  }
}

.modal-footer-buttons {
  transform: translateY(-18px) !important;
  padding: 0 2-px !important;
}

.modal-close-button {
  left: 26px !important;
  top: -8px !important;
}

.modal-primary-button {
  top: -8px !important;
}
:root {
  --tarkov-text-color: #c1c8c8;
}

body,
p,
span,
div,
a,
li,
td,
th,
label,
input,
textarea,
select,
button,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--tarkov-text-color) !important;
}

/* =========================================
   FOOTER DISCORD + COPYRIGHT
========================================= */

:root {
  --site-footer-text: #c1c8c8;
  --site-footer-muted: rgba(193, 200, 200, 0.72);
  --site-footer-border: rgba(193, 200, 200, 0.08);
  --site-footer-bg: linear-gradient(180deg, rgba(8, 12, 13, 0.72) 0%, rgba(6, 9, 10, 0.92) 100%);
  --site-footer-hover: rgba(255, 255, 255, 0.055);
}

.tarkov-site-footer {
  width: min(1280px, calc(100% - 24px));
  margin: 28px auto 18px auto;
  padding: 14px 18px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;

  border-top: 1px solid var(--site-footer-border);
  background: var(--site-footer-bg);
  border-radius: 14px;

  color: var(--site-footer-text);
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.tarkov-site-footer__left {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.tarkov-site-footer__title {
  color: var(--site-footer-text);
  font-family: "Russo One", "Bender", "Manrope", Arial, sans-serif !important;
  font-size: 14px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1.1;
}

.tarkov-site-footer__desc {
  color: var(--site-footer-muted);
  font-size: 13px;
  line-height: 1.35;
}

.tarkov-site-footer__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.tarkov-discord-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  min-height: 42px;
  padding: 0 14px;
  box-sizing: border-box;

  color: var(--site-footer-text) !important;
  text-decoration: none !important;
  border: 1px solid rgba(193, 200, 200, 0.08);
  background: rgba(10, 14, 16, 0.72);
  border-radius: 10px;

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

.tarkov-discord-link:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.045);
  border-color: rgba(193, 200, 200, 0.16);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.tarkov-discord-link__icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: block;
  color: #c1c8c8;
}

.tarkov-discord-link__text {
  color: #c1c8c8;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
  font-family: "Bender", "Manrope", Arial, sans-serif !important;
}

@media (max-width: 700px) {
  .tarkov-site-footer {
    padding: 12px 14px;
    gap: 12px;
  }

  .tarkov-site-footer__left,
  .tarkov-site-footer__right {
    width: 100%;
  }

  .tarkov-site-footer__right {
    justify-content: flex-start;
  }

  .tarkov-discord-link {
    min-height: 40px;
    padding: 0 12px;
  }
}

/* ===== СДЕЛАТЬ БАННЕРЫ МЕНЬШЕ ===== */

/* сами карточки баннеров */
.banners-after-monitoring .banner-elem,
.right-column .banner-elem {
  min-height: 220px !important;
  height: 220px !important;
}

/* внутренняя ссылка/контент */
.banners-after-monitoring .banner-item-link,
.right-column .banner-item-link {
  min-height: 220px !important;
  height: 220px !important;
  padding: 20px !important;
  justify-content: flex-end !important;
}

/* заголовок внутри */
.banners-after-monitoring .bunner-title,
.right-column .bunner-title {
  font-size: 42px !important;
  line-height: 0.92 !important;
  margin-bottom: 8px !important;
}

/* текст под заголовком */
.banners-after-monitoring .banner-content,
.right-column .banner-content {
  font-size: 13px !important;
  line-height: 1.4 !important;
  margin-bottom: 0 !important;
}

/* только первый баннер сделать меньше */
.banners-after-monitoring .banner-elem:first-of-type {
  min-height: 110px !important;
  height: 110px !important;
}

.banners-after-monitoring .banner-elem:first-of-type .banner-item-link {
  min-height: 110px !important;
  height: 110px !important;
  padding: 14px !important;
}

.banners-after-monitoring .banner-elem:first-of-type .bunner-title {
  font-size: 28px !important;
  margin-bottom: 4px !important;
}

.banners-after-monitoring .banner-elem:first-of-type .banner-content {
  font-size: 12px !important;
  line-height: 1.3 !important;
}

#zone-block,
.product-modal-inputs-zone-block,
.product-modal-inputs-zone-block--nav {
    display: none !important;
}

.product-card {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 500ms ease,
    transform 500ms ease,
    box-shadow 300ms ease;
}

.product-card.animate {
  opacity: 0;
  transform: translateY(20px) scale(.97);
}

.product-card.animate.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}