/* X-VPN: материал кнопок, кругов и вкладок — как на test.x-vare.com (emerald-plus.css теста, блок 2026-10-03).
   Почти плоские, без внешнего свечения, тонкие трещины «битого стекла» у краёв. Подключается после emerald.css. */
body.emd {
  --xb-cracks-p: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 100' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23eaffee' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='12.6,21.8 29.0,20.2 46.0,26.8 60.2,33.3 68.0,40.1' stroke-width='0.8' stroke-opacity='0.24'/%3E%3Cline x1='29.0' y1='20.2' x2='41.0' y2='21.2' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='20.9,14.4 34.7,2.8 51.5,1.0' stroke-width='0.6' stroke-opacity='0.23'/%3E%3Cpolyline points='10.7,24.8 15.3,41.0 12.4,52.9 0.8,61.8' stroke-width='0.6' stroke-opacity='0.11'/%3E%3Cline x1='15.3' y1='41.0' x2='14.7' y2='53.0' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='8.2,69.3 23.4,75.6 35.3,82.0 42.6,95.6' stroke-width='0.8' stroke-opacity='0.26'/%3E%3Cline x1='23.4' y1='75.6' x2='14.9' y2='84.1' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='5.7,69.2 23.6,82.4 43.2,87.9 64.0,95.8 76.9,94.1' stroke-width='0.8' stroke-opacity='0.27'/%3E%3Cline x1='23.6' y1='82.4' x2='30.0' y2='72.2' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='18.4,14.3 25.4,18.5 30.6,24.3' stroke-width='0.6' stroke-opacity='0.19'/%3E%3Cpolyline points='8.7,25.7 15.9,20.9 19.6,14.7' stroke-width='0.6' stroke-opacity='0.15'/%3E%3Cline x1='15.9' y1='20.9' x2='7.8' y2='12.0' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='6.0,32.0 20.7,30.4 34.6,34.9 54.5,32.0' stroke-width='0.8' stroke-opacity='0.14'/%3E%3Cpolyline points='11.2,73.7 28.5,73.1 36.6,72.1 49.0,61.1' stroke-width='0.8' stroke-opacity='0.20'/%3E%3Cline x1='28.5' y1='73.1' x2='40.5' y2='73.6' stroke-width='.5' stroke-opacity='0.16'/%3E%3C/g%3E%3C/svg%3E") left center / auto 100% no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 100' preserveAspectRatio='none'%3E%3Cg transform='translate(140 0) scale(-1 1)' fill='none' stroke='%23eaffee' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15.0,20.7 18.4,14.2 27.1,1.0 23.2,1.0 16.5,1.0' stroke-width='0.8' stroke-opacity='0.13'/%3E%3Cpolyline points='23.8,10.0 34.6,1.0 55.0,1.0 63.2,1.0' stroke-width='0.5' stroke-opacity='0.16'/%3E%3Cpolyline points='21.4,11.2 37.7,7.6 61.7,4.6' stroke-width='0.5' stroke-opacity='0.20'/%3E%3Cpolyline points='31.0,7.0 45.1,1.0 59.7,1.0 79.7,1.0 89.7,1.0' stroke-width='0.8' stroke-opacity='0.22'/%3E%3Cpolyline points='30.3,92.3 43.6,90.2 56.7,90.5' stroke-width='0.8' stroke-opacity='0.25'/%3E%3Cpolyline points='8.0,32.5 19.4,27.8 34.2,27.7' stroke-width='0.6' stroke-opacity='0.13'/%3E%3Cline x1='19.4' y1='27.8' x2='24.1' y2='16.8' stroke-width='.5' stroke-opacity='0.16'/%3E%3Cpolyline points='17.6,85.9 30.8,87.7 52.5,86.8' stroke-width='0.5' stroke-opacity='0.19'/%3E%3Cpolyline points='20.5,13.4 37.2,6.8 42.0,1.0' stroke-width='0.5' stroke-opacity='0.23'/%3E%3Cpolyline points='20.7,14.5 41.4,2.4 44.9,1.0' stroke-width='0.6' stroke-opacity='0.21'/%3E%3Cline x1='41.4' y1='2.4' x2='52.8' y2='-1.4' stroke-width='.5' stroke-opacity='0.16'/%3E%3C/g%3E%3C/svg%3E") right center / auto 100% no-repeat;
  --xb-cracks-g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 100' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%237dff9a' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6.1,64.0 22.7,72.5 35.9,87.7 47.7,90.9 58.4,92.2' stroke-width='0.5' stroke-opacity='0.18'/%3E%3Cline x1='22.7' y1='72.5' x2='33.5' y2='67.2' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='13.0,19.8 17.3,27.8 19.8,36.0 28.1,40.8' stroke-width='0.5' stroke-opacity='0.15'/%3E%3Cline x1='17.3' y1='27.8' x2='27.9' y2='22.1' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='11.0,26.7 28.9,21.1 46.6,6.5 61.1,1.0 65.1,1.0' stroke-width='0.5' stroke-opacity='0.16'/%3E%3Cline x1='28.9' y1='21.1' x2='23.5' y2='10.4' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='7.2,72.9 21.7,66.3 37.9,63.3 46.1,66.3' stroke-width='0.5' stroke-opacity='0.29'/%3E%3Cline x1='21.7' y1='66.3' x2='27.7' y2='76.7' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='13.7,80.6 28.4,86.0 37.6,99.0' stroke-width='0.5' stroke-opacity='0.25'/%3E%3Cpolyline points='27.5,91.9 39.4,88.8 57.9,90.0 72.2,87.6 86.4,93.3' stroke-width='0.5' stroke-opacity='0.17'/%3E%3Cpolyline points='25.0,90.5 30.0,97.1 31.8,99.0 28.3,99.0 26.2,99.0' stroke-width='0.8' stroke-opacity='0.11'/%3E%3Cpolyline points='2.8,53.9 12.4,45.5 17.4,30.3 28.4,11.8 33.2,1.0' stroke-width='0.5' stroke-opacity='0.13'/%3E%3Cpolyline points='29.4,92.3 39.8,95.3 48.6,96.9' stroke-width='0.5' stroke-opacity='0.19'/%3E%3C/g%3E%3C/svg%3E") left center / auto 100% no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 100' preserveAspectRatio='none'%3E%3Cg transform='translate(140 0) scale(-1 1)' fill='none' stroke='%237dff9a' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3.7,47.1 11.8,57.0 17.9,69.5' stroke-width='0.6' stroke-opacity='0.24'/%3E%3Cpolyline points='4.1,56.7 13.6,47.8 22.2,41.3 30.8,35.1' stroke-width='0.6' stroke-opacity='0.24'/%3E%3Cpolyline points='26.8,9.9 44.0,9.9 64.8,22.0 73.5,26.0 83.6,28.1' stroke-width='0.8' stroke-opacity='0.21'/%3E%3Cpolyline points='22.7,88.3 37.9,87.1 56.4,85.1' stroke-width='0.6' stroke-opacity='0.21'/%3E%3Cpolyline points='24.4,9.6 38.0,13.3 55.2,22.1 65.1,23.6' stroke-width='0.6' stroke-opacity='0.18'/%3E%3Cpolyline points='11.3,78.5 16.8,73.2 17.9,57.1 20.2,48.0' stroke-width='0.8' stroke-opacity='0.15'/%3E%3Cline x1='16.8' y1='73.2' x2='25.6' y2='65.1' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='9.3,25.5 26.5,26.3 40.6,26.3' stroke-width='0.8' stroke-opacity='0.29'/%3E%3Cline x1='26.5' y1='26.3' x2='34.2' y2='17.1' stroke-width='.5' stroke-opacity='0.18'/%3E%3Cpolyline points='2.1,55.6 25.9,51.5 38.6,53.2' stroke-width='0.6' stroke-opacity='0.14'/%3E%3Cpolyline points='2.0,50.2 22.1,37.0 27.1,31.6 46.9,23.5' stroke-width='0.8' stroke-opacity='0.13'/%3E%3C/g%3E%3C/svg%3E") right center / auto 100% no-repeat;
  --xb-circle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M14 30 L42 8 L36 34 Z' fill='%23bfffd0' fill-opacity='.05'/%3E%3Cpath d='M60 90 L88 66 L70 62 Z' fill='%23bfffd0' fill-opacity='.035'/%3E%3Cpath d='M8 58 L22 80 L30 60 Z' fill='%23000' fill-opacity='.12'/%3E%3Cg fill='none' stroke='%238dffa8' stroke-linecap='round'%3E%3Cpolyline points='75.1,92.4 70.6,85.4 68.5,75.1 66.8,66.6' stroke-width='0.5' stroke-opacity='0.39'/%3E%3Cpolyline points='99.1,54.4 96.8,49.4 92.2,44.6 91.4,39.4' stroke-width='0.7' stroke-opacity='0.39'/%3E%3Cpolyline points='8.9,77.3 16.8,73.5 26.4,74.2 31.2,76.1' stroke-width='0.5' stroke-opacity='0.22'/%3E%3Cpolyline points='94.3,28.4 89.8,34.8 84.4,42.8 83.6,53.5' stroke-width='0.5' stroke-opacity='0.23'/%3E%3Cpolyline points='98.4,40.4 93.0,38.1 82.2,37.6' stroke-width='0.5' stroke-opacity='0.42'/%3E%3Cpolyline points='8.4,76.5 13.0,69.3 15.4,61.3 14.1,50.5' stroke-width='0.7' stroke-opacity='0.45'/%3E%3Cpolyline points='0.7,51.2 9.4,49.0 18.3,41.1' stroke-width='0.7' stroke-opacity='0.23'/%3E%3Cpolyline points='21.5,90.2 31.5,92.7 38.1,91.7 47.9,85.8' stroke-width='0.6' stroke-opacity='0.28'/%3E%3Cpolyline points='30.0,5.0 26.5,12.0 20.3,22.0' stroke-width='0.6' stroke-opacity='0.31'/%3E%3Cpolyline points='15.0,84.7 14.2,78.7 16.3,68.2' stroke-width='0.6' stroke-opacity='0.20'/%3E%3Cpolyline points='38.3,97.9 40.9,93.3 47.2,88.8 51.9,80.5' stroke-width='0.5' stroke-opacity='0.38'/%3E%3C/g%3E%3C/svg%3E") center / 100% 100% no-repeat;
  --xb-p-fill:
    radial-gradient(120% 90% at 50% -10%, rgba(255,255,255,.14), transparent 60%),
    linear-gradient(90deg, rgba(0,45,12,.26), transparent 20%, transparent 80%, rgba(0,45,12,.26)),
    linear-gradient(180deg, #49c557, #37ad48 50%, #26903a);
  --xb-g-fill:
    linear-gradient(90deg, rgba(60,170,90,.16), transparent 22%, transparent 78%, rgba(60,170,90,.16)),
    linear-gradient(180deg, #0f1d1a, #09120f);
}

/* Зелёная */
body.emd .btn.btn-primary,
body.emd .emd-btn-primary {
  color: #0b1f0e;
  background: var(--xb-cracks-p), var(--xb-p-fill);
  border: 1px solid rgba(160, 245, 170, .6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,40,10,.25);
  text-shadow: none;
}
body.emd .btn.btn-primary:hover,
body.emd .emd-btn-primary:hover {
  filter: brightness(1.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), inset 0 -1px 0 rgba(0,40,10,.25), 0 8px 24px rgba(40,170,70,.22);
}

/* Тёмная */
body.emd .btn.btn-ghost,
body.emd .emd-btn-ghost {
  color: #f2f5f3;
  background: var(--xb-cracks-g), var(--xb-g-fill);
  border: 1px solid rgba(110, 215, 130, .5);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: none;
}
body.emd .btn.btn-ghost:hover,
body.emd .emd-btn-ghost:hover {
  color: #fff;
  border-color: rgba(120, 235, 145, .75);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 24px rgba(40,170,70,.12);
}

/* Общее: пилюля, средняя жирность, без «прыжков» с масштабом */
body.emd .btn.btn-primary,
body.emd .btn.btn-ghost { border-radius: 999px; font-weight: 600; }
body.emd .btn.btn-primary:hover,
body.emd .btn.btn-ghost:hover { transform: translateY(-1px); }
body.emd .btn.btn-primary:disabled, body.emd .btn.btn-primary[disabled],
body.emd .btn.btn-ghost:disabled, body.emd .btn.btn-ghost[disabled] { filter: none; transform: none; box-shadow: none; opacity: .55; }

/* Большие кнопки героев */
body.emd .emd-btn {
  min-height: 60px;
  min-width: 240px;
  padding: 0 40px;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -0.005em;
}
body.emd .emd-btn:hover { transform: translateY(-2px); }
body.emd .emd-btn:active { transform: translateY(0) scale(.99); }
body.emd .emd-btn.emd-crystal::after { display: none; }
@media (max-width: 640px) {
  body.emd .emd-btn { min-width: 0; min-height: 54px; padding: 0 28px; font-size: 16px; }
}

/* Круги шапки (Войти/Выйти, кабинет, меню): тёмное стекло, зелёная кромка, трещины у края, без ореола.
   Логотип-надпись X-VPN (.emd-word) не трогаем. */
body.emd .emd-logo:not(.emd-word),
body.emd .emd-orb,
body.emd .emd-nav .menu-toggle {
  background: var(--xb-circle), radial-gradient(circle at 38% 30%, #172a22, #0b1512 62%, #08100e);
  border: 1px solid rgba(110, 210, 130, .55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 14px rgba(0,0,0,.35);
  backdrop-filter: none;
}
body.emd .emd-orb.emd-crystal::after { display: none; }
body.emd .emd-orb:hover,
body.emd .emd-nav .menu-toggle:hover {
  border-color: rgba(130, 235, 150, .8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 14px rgba(0,0,0,.35), 0 0 18px rgba(60,200,100,.18);
}
body.emd .emd-avatar { background: #0b1512; }
body.emd.menu-open .emd-nav .menu-toggle {
  border-color: rgba(130, 235, 150, .85);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 18px rgba(60,200,100,.22);
}

/* Переключатель срока на /pricing — сегментный, как вкладки на тесте: тёмная стеклянная дорожка,
   неактивные — текст, активная — зелёная капсула из материала кнопок. */
body.emd:not(#x) .period-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 5px !important;
  border-radius: 26px;
  background: var(--xb-cracks-g), linear-gradient(180deg, #0f1d1a, #09120f) !important;
  border: 1px solid rgba(110, 215, 130, .4) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), inset 0 0 18px rgba(0,0,0,.3);
}
body.emd:not(#x) .period-switch > .period-btn {
  margin: 0;
  padding: 9px 18px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
  color: rgba(232, 244, 236, .74) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  text-shadow: none;
  transform: none;
  transition: color .2s, background .2s, border-color .2s;
}
body.emd:not(#x) .period-switch > .period-btn:hover {
  color: #fff !important;
  background: rgba(110, 215, 130, .08) !important;
}
body.emd:not(#x) .period-switch > .period-btn.is-on {
  color: #0b1f0e !important;
  background: var(--xb-cracks-p), var(--xb-p-fill) !important;
  border-color: rgba(160, 245, 170, .6) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,40,10,.25) !important;
}
body.emd:not(#x) .period-switch > .period-btn.is-on .period-off { background: #0b1f0e; color: #6fe57a; }
body.emd:not(#x) .period-switch > .period-btn:focus-visible { outline: 2px solid rgba(120,235,145,.7); outline-offset: 1px; }
@media (max-width: 640px) {
  body.emd:not(#x) .period-switch > .period-btn { padding: 8px 12px; font-size: 13px; }
}

/* Кабинет: пакеты докупки */
.shop-packs { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 14px; }
.shop-pay { margin-top: 6px; }

/* ═══ Анимации (2026-10-06): появление блоков при прокрутке, подъём карточек, нажатие кнопок ═══ */
html.xv-motion .xv-rv { opacity: 0; transform: translateY(18px); }
html.xv-motion .xv-rv.xv-in {
  opacity: 1; transform: none;
  transition: opacity .6s cubic-bezier(.2,.8,.2,1) var(--xv-d, 0ms), transform .7s cubic-bezier(.2,.8,.2,1) var(--xv-d, 0ms);
}
body.emd .price-card, body.emd .feature-card {
  transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s, box-shadow .35s;
}
body.emd .price-card:hover, body.emd .feature-card:hover {
  transform: translateY(-4px);
  border-color: rgba(110, 215, 130, .45);
  box-shadow: 0 18px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(110,215,130,.08);
}
html.xv-motion .price-card.xv-rv.xv-in:hover, html.xv-motion .feature-card.xv-rv.xv-in:hover { transform: translateY(-4px); transition-delay: 0ms; }
body.emd .btn { transition: transform .15s ease, filter .2s, box-shadow .25s, border-color .25s, background-color .25s; }
body.emd .btn:active { transform: translateY(0) scale(.97) !important; }
body.emd:not(#x) .period-switch > .period-btn { transition: color .25s, background .3s, border-color .3s, box-shadow .3s, transform .15s; }
body.emd:not(#x) .period-switch > .period-btn:active { transform: scale(.96); }
.price-sum, .js-period { transition: opacity .25s; }
.dev-item { animation: xvFade .35s cubic-bezier(.2,.8,.2,1) both; }
@keyframes xvFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  html.xv-motion .xv-rv { opacity: 1; transform: none; }
  body.emd .price-card:hover, body.emd .feature-card:hover { transform: none; }
}
.cab-grid.cab-grid-one { grid-template-columns: 1fr; }