:root {
  --cdn-bg: #050611;
  --cdn-card: rgba(13, 18, 39, .92);
  --cdn-card2: rgba(15, 20, 43, .88);
  --cdn-violet: #8b5cff;
  --cdn-violet2: #b36cff;
  --cdn-cyan: #38d8ff;
  --cdn-text: #f7f3ff;
  --cdn-muted: #a8a6bf;
  --cdn-border: rgba(139, 92, 255, .38);
  --cdn-border2: rgba(56, 216, 255, .35);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  color: var(--cdn-text) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(139,92,255,.28), transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(176,108,255,.18), transparent 32%),
    linear-gradient(180deg, #050611 0%, #080a18 48%, #050611 100%) !important;
}

/* общая база */
.hero,
.section,
.top,
.box {
  border-color: var(--cdn-border) !important;
  background:
    radial-gradient(circle at 50% -20%, rgba(139,92,255,.08), transparent 45%),
    linear-gradient(180deg, rgba(15,20,43,.92), rgba(8,11,27,.94)) !important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.top {
  justify-content: center !important;
  border-radius: 26px !important;
  margin-top: 16px !important;
  min-height: 106px !important;
  padding: 18px 28px !important;
}

.brand {
  width: 100% !important;
  justify-content: center !important;
  gap: 18px !important;
  color: #fff !important;
  font-size: 30px !important;
  font-weight: 950 !important;
  letter-spacing: -.04em !important;
}

.brand span {
  color: var(--cdn-violet2) !important;
  text-shadow: 0 0 22px rgba(179,108,255,.40) !important;
}

.top .brand a.cdn-access-logo-link {
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
  outline: none !important;
  text-decoration: none !important;
  transition:
    box-shadow 0.22s ease,
    transform 0.18s ease !important;
}

.top .brand a.cdn-access-logo-link:hover {
  box-shadow:
    0 0 0 2px rgba(56, 216, 255, 0.85),
    0 0 22px rgba(139, 92, 255, 0.38) !important;
}

.top .brand a.cdn-access-logo-link:active {
  transform: translateY(1px) scale(0.98) !important;
}

.logo {
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
  object-fit: contain !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 0 18px rgba(139,92,255,.42))
    drop-shadow(0 0 30px rgba(179,108,255,.22)) !important;
}

.pill { display: none !important; }

/* hero верх */
.hero {
  position: relative !important;
  overflow: hidden !important;
}

.hero .head {
  position: relative !important;
  min-height: 82px !important;
}

.hero .head > div:last-child {
  z-index: 2 !important;
}

.cdn-hero-subtitle {
  position: absolute !important;
  left: 50% !important;
  top: 16px !important;
  transform: translateX(-50%) !important;
  white-space: nowrap !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  background: linear-gradient(90deg, #38d8ff 0%, #8b5cff 48%, #ec37ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  text-shadow: 0 0 20px rgba(139,92,255,.20) !important;
  opacity: .96 !important;
}

/* карточки статуса */
.grid {
  gap: 14px !important;
}

.box {
  min-height: 108px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  border-radius: 20px !important;
}

.box .label {
  width: 100% !important;
  margin: 0 0 12px !important;
  color: #9fa4bd !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

.box .value {
  width: 100% !important;
  color: #fff !important;
  font-size: 20px !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
  text-align: center !important;
}

/* баланс НЕ неоновый */
.cdnrelay-expire-actions {
  width: 100% !important;
  margin: 16px auto 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
}

.cdnrelay-balance-chip {
  width: 260px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  color: #f7f3ff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  text-decoration: none !important;
  border-radius: 14px !important;
  background: rgba(18, 20, 43, .86) !important;
  border: 1px solid rgba(139,92,255,.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 22px rgba(0,0,0,.22) !important;
}

.cdnrelay-balance-chip::before,
.cdnrelay-balance-chip::after {
  display: none !important;
}

/* оплата неоновая */
.cdnrelay-renew-btn,
.cdnrelay-renew-btn:visited {
  width: 260px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  text-decoration: none !important;
  border-radius: 14px !important;
  background:
    linear-gradient(90deg, rgba(139,92,255,.34), rgba(56,216,255,.18)) !important;
  border: 1px solid rgba(56,216,255,.68) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 18px rgba(56,216,255,.18),
    0 0 34px rgba(139,92,255,.24),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
  transition: .18s ease !important;
}

.cdnrelay-renew-btn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(56,216,255,1) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.14),
    0 0 24px rgba(56,216,255,.28),
    0 0 44px rgba(139,92,255,.34) !important;
}

/* трафик */
.cdnrelay-trafficbar {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.cdnrelay-trafficbar-track {
  width: 100% !important;
  height: 15px !important;
  border-radius: 999px !important;
  background: rgba(4,6,18,.96) !important;
  border: 1px solid rgba(139,92,255,.64) !important;
  overflow: hidden !important;
}

.cdnrelay-trafficbar-fill {
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #8b5cff, #38d8ff) !important;
  box-shadow:
    0 0 12px rgba(139,92,255,.55),
    0 0 22px rgba(56,216,255,.28) !important;
}

.cdnrelay-trafficbar-text {
  margin-top: 13px !important;
  color: #fff !important;
  text-align: center !important;
  font-size: 18px !important;
  font-weight: 950 !important;
}

/* подписка */
.section h2 {
  color: #fff !important;
  font-size: 28px !important;
  font-weight: 950 !important;
}

.copy {
  border-color: rgba(56,216,255,.34) !important;
  color: #50e8ff !important;
  background: rgba(4,7,18,.62) !important;
}

.actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-top: 16px !important;
  max-width: 660px !important;
}

.actions .cdn-clean-extra {
  display: inline-flex !important;
}

.btn,
.btn:visited,
.actions button,
.actions a {
  min-height: 56px !important;
  border-radius: 16px !important;
  color: #f7f3ff !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(139,92,255,.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.20) !important;
  font-weight: 950 !important;
  transition: .18s ease !important;
}

.btn:hover,
.actions button:hover,
.actions a:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(56,216,255,.68) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 18px rgba(56,216,255,.14),
    0 0 30px rgba(139,92,255,.16),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* кнопка установки — неоновая */
.btn-open-guides,
#cdn-toggle-install-btn,
button[data-cdn-install-toggle="1"] {
  background: rgba(18,22,48,.90) !important;
  border-color: rgba(56,216,255,.82) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.10),
    0 0 18px rgba(56,216,255,.14),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.cdn-install-mini-icons {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  margin-left: 2px !important;
}

.cdn-install-mini-icon {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(5,7,18,.74) !important;
  box-shadow: 0 0 12px rgba(56,216,255,.12) !important;
}

.cdn-install-mini-icon + .cdn-install-mini-icon {
  margin-left: -7px !important;
}

.cdn-install-mini-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: scale(1.28) !important;
  display: block !important;
}

/* установка */
#guides {
  display: none !important;
  margin-top: 28px !important;
}

#guides.cdn-install-visible {
  display: block !important;
}

#guides > h2,
#guides > .os-tabs,
#guides > .guide,
#guides > .hint {
  display: none !important;
}

.cdn-install-clean {
  position: relative !important;
  overflow: visible !important;
  padding: 30px !important;
  border-radius: 28px !important;
  border: 1px solid rgba(56,216,255,.28) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(56,216,255,.08), transparent 30%),
    linear-gradient(180deg, rgba(16,25,48,.94), rgba(9,14,32,.96)) !important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.42),
    0 0 34px rgba(56,216,255,.08),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.cdn-install-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
  margin-bottom: 22px !important;
}

.cdn-install-head h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 28px !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
}

.cdn-os-picker {
  position: relative !important;
  width: 220px !important;
  flex: 0 0 220px !important;
  z-index: 40 !important;
  overflow: visible !important;
}

.cdn-os-picker.is-open {
  width: 220px !important;
  flex: 0 0 220px !important;
  display: block !important;
}

.cdn-os-current {
  width: 100% !important;
  min-height: 54px !important;
  padding: 0 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  border-radius: 16px !important;
  color: #fff !important;
  font-weight: 950 !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(56,216,255,.54) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 20px rgba(56,216,255,.10) !important;
}

.cdn-os-chevron {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  transform: none !important;
  transition: none !important;
  line-height: 1 !important;
}

.cdn-os-picker.is-open .cdn-os-chevron {
  transform: none !important;
}

.cdn-os-auto {
  width: 100% !important;
  min-height: 34px !important;
  margin-top: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(90,240,185,.22) !important;
  border-radius: 13px !important;
  padding: 0 12px !important;
  background: rgba(90,240,185,.055) !important;
  color: rgba(211,255,241,.94) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

.cdn-os-auto:hover {
  border-color: rgba(90,240,185,.48) !important;
  background: rgba(90,240,185,.11) !important;
  color: #fff !important;
}

.cdn-os-current-left,
.cdn-os-row-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.cdn-os-ico {
  width: 18px !important;
  height: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--cdn-text) !important;
}

.cdn-os-ico svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
}

.cdn-os-item .cdn-os-ico,
.cdn-os-current .cdn-os-ico {
  flex: 0 0 18px !important;
}

.cdn-os-item.is-active {
  color: var(--cdn-cyan) !important;
}

.cdn-os-menu {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  bottom: auto !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 80 !important;
  padding: 8px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(17,24,47,.98), rgba(8,12,30,.98)) !important;
  border: 1px solid rgba(56,216,255,.30) !important;
  box-shadow:
    0 22px 50px rgba(0,0,0,.42),
    0 0 24px rgba(56,216,255,.10) !important;
}

.cdn-os-picker.is-open .cdn-os-menu {
  display: grid !important;
  gap: 6px !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  bottom: auto !important;
  grid-template-columns: 1fr !important;
  margin-top: 0 !important;
  padding: 6px !important;
}

.cdn-os-item {
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  border-radius: 14px !important;
  color: #fff !important;
  font-weight: 900 !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid transparent !important;
  text-align: left !important;
}

.cdn-os-picker.is-open .cdn-os-item {
  min-height: 42px !important;
  height: 42px !important;
}

.cdn-os-item:hover {
  border-color: rgba(56,216,255,.56) !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: 0 0 18px rgba(56,216,255,.12) !important;
}

.cdn-os-item.is-active {
  border-color: var(--cdn-cyan) !important;
  color: var(--cdn-cyan) !important;
  background: rgba(56,216,255,.06) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.18),
    0 0 22px rgba(56,216,255,.30),
    0 0 36px rgba(139,92,255,.20) !important;
}

.cdn-os-row-left > span:last-child {
  line-height: 1 !important;
}

.cdn-app-tabs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 24px !important;
  clear: both !important;
}

.cdn-app-tab {
  min-width: 0 !important;
  min-height: 82px !important;
  padding: 0 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  border-radius: 18px !important;
  color: #fff !important;
  font-weight: 950 !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(139,92,255,.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.18) !important;
  transition: .18s ease !important;
  overflow: hidden !important;
}

.cdn-step-btn span {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

.cdn-app-tab:hover {
  border-color: rgba(56,216,255,.74) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 18px rgba(56,216,255,.16),
    0 0 32px rgba(139,92,255,.18),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.cdn-app-tab.is-active {
  border-color: rgba(56,216,255,.92) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.16),
    0 0 22px rgba(56,216,255,.30),
    0 0 40px rgba(139,92,255,.28),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.cdn-app-icon {
  width: 68px !important;
  height: 68px !important;
  flex: 0 0 68px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 2px solid rgba(255,255,255,.13) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 4px 14px rgba(0,0,0,.22) !important;
  transition: .18s ease !important;
}

.cdn-app-tab:hover .cdn-app-icon {
  border-color: rgba(56,216,255,.55) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.12),
    0 0 14px rgba(56,216,255,.18),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.cdn-app-tab.is-active .cdn-app-icon {
  border-color: var(--cdn-cyan) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.30),
    0 0 22px rgba(56,216,255,.40),
    0 0 38px rgba(139,92,255,.28),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.cdn-app-icon svg {
  width: 58% !important;
  height: 58% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  background: transparent !important;
}

/* PNG-бренды: круг целиком без «квадрата» посередине и полей в исходнике */
.cdn-app-icon img.cdn-app-icon-png {
  flex: 1 1 auto !important;
  min-width: 100% !important;
  min-height: 100% !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 50% !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  background: transparent !important;
  transform: scale(1.32) !important;
  transform-origin: center center !important;
}

.cdn-app-icon .cdn-app-svg {
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.30)) !important;
}

.cdn-app-name {
  font-size: 15px !important;
  font-weight: 950 !important;
  color: #fff !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
  line-height: 1.15 !important;
}

.cdn-install-flow {
  display: grid !important;
  grid-template-columns: 88px minmax(0, 1fr) !important;
  gap: 20px !important;
  align-items: start !important;
}

.cdn-install-line {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.cdn-step-dot {
  width: 68px !important;
  height: 68px !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--cdn-cyan) !important;
  background: rgba(8,31,48,.82) !important;
  border: 2px solid rgba(56,216,255,.78) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.10),
    0 0 14px rgba(56,216,255,.40),
    0 0 28px rgba(139,92,255,.32),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.cdn-step-dot svg {
  width: 62% !important;
  height: 62% !important;
  stroke: currentColor !important;
  stroke-width: 2.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  fill: none !important;
  shape-rendering: geometricPrecision !important;
  filter: drop-shadow(0 0 8px rgba(56,216,255,.45)) !important;
}

.cdn-step-dot.ok {
  color: var(--cdn-cyan) !important;
  text-shadow: 0 0 10px rgba(56,216,255,.55) !important;
}

.cdn-step-line {
  width: 4px !important;
  height: 76px !important;
  background: linear-gradient(180deg, rgba(56,216,255,.72), rgba(139,92,255,.36)) !important;
  box-shadow: 0 0 8px rgba(56,216,255,.22) !important;
}

.cdn-install-steps {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

.cdn-install-step h3 {
  margin: 0 0 8px !important;
  color: #fff !important;
  font-size: 19px !important;
  font-weight: 950 !important;
}

.cdn-install-step p {
  max-width: 820px !important;
  margin: 0 !important;
  color: var(--cdn-muted) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}

.cdn-step-actions {
  margin-top: 14px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

.cdn-step-btn,
.cdn-step-btn:visited {
  min-height: 46px !important;
  min-width: 210px !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border-radius: 14px !important;
  color: #f7f3ff !important;
  text-decoration: none !important;
  font-weight: 950 !important;
  background: rgba(18,22,48,.82) !important;
  border: 1px solid rgba(56,216,255,.52) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.18) !important;
  transition: .18s ease !important;
}

.cdn-step-btn:hover,
.cdn-step-btn.primary {
  border-color: rgba(56,216,255,.70) !important;
  background: rgba(18,22,48,.92) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 18px rgba(56,216,255,.14),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.cdn-step-ico {
  width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64e8ff !important;
}

.cdn-step-ico svg {
  width: 20px !important;
  height: 20px !important;
  stroke: currentColor !important;
  fill: none !important;
  shape-rendering: geometricPrecision !important;
}

.warn {
  margin-top: 18px !important;
}

@media (max-width: 900px) {
  .actions {
    grid-template-columns: 1fr 1fr !important;
  }

  .cdn-install-head {
    flex-direction: column !important;
  }

  .cdn-os-picker {
    width: 100% !important;
    flex: 1 1 auto !important;
  }

  .cdn-os-picker.is-open {
    width: 100% !important;
    flex: 1 1 auto !important;
  }

  .cdn-os-picker.is-open .cdn-os-current {
    width: 100% !important;
  }

  .cdn-os-picker.is-open .cdn-os-menu {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 760px) {
  .top {
    min-height: 90px !important;
  }

  .brand {
    font-size: 22px !important;
  }

  .logo {
    width: 52px !important;
    height: 52px !important;
  }

  .top .brand a.cdn-access-logo-link {
    width: 52px !important;
    height: 52px !important;
  }

  .cdn-hero-subtitle {
    position: static !important;
    transform: none !important;
    display: block !important;
    margin: 8px 0 0 !important;
    text-align: left !important;
    white-space: normal !important;
  }

  .actions {
    grid-template-columns: 1fr !important;
  }

  .cdn-install-clean {
    padding: 22px !important;
  }

  .cdn-app-tabs {
    grid-template-columns: 1fr !important;
  }

  .cdn-install-flow {
    grid-template-columns: 1fr !important;
  }

  .cdn-install-line {
    display: none !important;
  }

  .cdn-step-actions {
    flex-direction: column !important;
  }

  .cdn-step-btn {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* CDNRELAY_FIX_HUGE_ACTION_ICONS_V101 */

/* Кнопки подписки обратно нормальные, без гигантских SVG */
.section .actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-top: 16px !important;
  max-width: 660px !important;
}

.section .actions .btn,
.section .actions a,
.section .actions button {
  min-height: 56px !important;
  height: 56px !important;
  padding: 0 18px !important;
  border-radius: 16px !important;

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

  overflow: hidden !important;
  position: relative !important;

  color: #f7f3ff !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-decoration: none !important;

  background: rgba(18,22,48,.82) !important;
  border: 1px solid rgba(56,216,255,.52) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.20) !important;
}

/* Главное: SVG не больше 18px */
.section .actions .btn svg,
.section .actions a svg,
.section .actions button svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  flex: 0 0 18px !important;

  display: block !important;
  position: static !important;

  stroke: currentColor !important;
  fill: none !important;
  color: #68eaff !important;

  opacity: 1 !important;
  transform: none !important;
  filter: drop-shadow(0 0 8px rgba(56,216,255,.20)) !important;
}

/* Текст поверх всего, чтобы не пропадал */
.section .actions .btn span,
.section .actions a span,
.section .actions button span {
  position: static !important;
  z-index: 2 !important;
  display: inline-block !important;
  white-space: nowrap !important;
}

/* Убираем любые огромные псевдо-иконки/заливки */
.section .actions .btn::before,
.section .actions .btn::after,
.section .actions a::before,
.section .actions a::after,
.section .actions button::before,
.section .actions button::after {
  pointer-events: none !important;
}

/* Неоновая только кнопка установки */
#cdn-toggle-install-btn,
.section .actions .btn-open-guides {
  background: rgba(18,22,48,.90) !important;
  border-color: rgba(56,216,255,.82) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.10),
    0 0 18px rgba(56,216,255,.14),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Ховер стабильный, без мерцания */
.section .actions .btn:hover,
.section .actions a:hover,
.section .actions button:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(56,216,255,.70) !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 18px rgba(56,216,255,.14),
    0 0 30px rgba(139,92,255,.16),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* На телефоне красиво в одну колонку */
@media (max-width: 900px) {
  .section .actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  .section .actions {
    grid-template-columns: 1fr !important;
  }
}

/* Hero header polish: keep top "CDN Relay", drop duplicate subtitle, lift status line */
.cdn-hero-subtitle { display: none !important; }

.hero .head .small {
  margin-top: 8px !important;
  color: var(--cdn-cyan) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-shadow: 0 0 14px rgba(56,216,255,.22) !important;
}

/* CDNRELAY_DEEPLINK_V114 */

/* Tiny "opens in <App>" caption under the deep-link button */
.cdn-step-hint {
  margin-top: 10px !important;
  color: var(--cdn-muted) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  opacity: .85 !important;
}

.cdn-step-hint--warn {
  color: #ffb38a !important;
  opacity: 1 !important;
}

/* Disabled "Add subscription" button when no deep-link is known for the app */
.cdn-step-btn.is-disabled,
.cdn-step-btn[disabled] {
  cursor: not-allowed !important;
  opacity: .55 !important;
  filter: grayscale(.35) !important;
  pointer-events: auto !important;
}

.cdn-step-btn.is-disabled:hover,
.cdn-step-btn[disabled]:hover {
  transform: none !important;
  border-color: rgba(139,92,255,.44) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.18) !important;
  background: rgba(255,255,255,.035) !important;
}

/* App-tab cards: a touch more breathing room around the 60px badge */
.cdn-app-tab .cdn-app-name {
  line-height: 1.15 !important;
  white-space: normal !important;
}

/* OS-current row: same icon size as menu items so the trigger lines up */
.cdn-os-current .cdn-os-ico,
.cdn-os-current .cdn-os-ico svg {
  width: 18px !important;
  height: 18px !important;
}

/* CDNRELAY_IOS_IMPORT_V124 — блоки импорта по клиентам */
.cdn-step-strong {
  color: rgba(235,243,255,.92) !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  line-height: 1.5 !important;
  margin-top: -4px !important;
}

.cdn-step-actions--import {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 13px !important;
  align-items: stretch !important;
}

.cdn-happ-tip {
  margin: 12px 0 14px !important;
  padding: 13px 16px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(139,92,255,.44) !important;
  background: rgba(139,92,255,.10) !important;
  font-size: 13px !important;
  font-weight: 740 !important;
  line-height: 1.5 !important;
  color: #f7f3ff !important;
}

.cdn-happ-tip code {
  font-size: 12px !important;
  padding: 1px 5px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(56,216,255,.28) !important;
  background: rgba(10,22,42,.92) !important;
  color: #9af2ff !important;
}

.cdn-quick-import-wrap {
  margin-top: 17px !important;
}

.cdn-quick-import-title {
  margin-bottom: 10px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: .045em !important;
  color: rgba(235,243,255,.88) !important;
  text-transform: uppercase !important;
}

.cdn-quick-import-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(174px, 1fr)) !important;
  gap: 11px !important;
}

.cdn-quick-import {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 48px !important;
  padding: 12px 14px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(139,92,255,.44) !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 8px 22px rgba(0,0,0,.26) !important;
  font-size: 14px !important;
  font-weight: 930 !important;
  color: #fff !important;
  text-decoration: none !important;
  text-align: left !important;
  transition: .18s ease !important;
}

.cdn-quick-import:hover {
  border-color: rgba(56,216,255,.78) !important;
  transform: translateY(-1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 1px rgba(56,216,255,.10),
    0 12px 30px rgba(0,0,0,.34),
    0 0 24px rgba(56,216,255,.18) !important;
}

.cdn-quick-import-main {
  display: block !important;
}

.cdn-quick-import-sub {
  font-size: 11px !important;
  font-weight: 740 !important;
  color: var(--cdn-muted, #94a9c2) !important;
  opacity: .9 !important;
}

/* Личный кабинет /u/ — заголовок «Подписка» с иконкой цепочки */
.cdn-subscription-heading {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 18px !important;
  font-size: clamp(22px, 2.6vw, 26px) !important;
  letter-spacing: -0.03em !important;
  color: #fff !important;
}

.cdn-subscription-heading-ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  color: var(--cdn-cyan, #38d8ff) !important;
  filter: drop-shadow(0 0 10px rgba(56, 216, 255, 0.42)) !important;
}

.cdn-subscription-heading-ico svg {
  display: block !important;
}

/* Button restored: clean app chooser entry; detailed client icons live inside the guide panel. */
#cdn-toggle-install-btn {
  gap: 10px !important;
  overflow: hidden !important;
}

#cdn-toggle-install-btn .cdn-install-mini-icons {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  gap: 0 !important;
  margin-left: 2px !important;
}

#cdn-toggle-install-btn .cdn-install-mini-icon {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 26px !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(5,7,18,.74) !important;
  box-shadow: 0 0 12px rgba(56,216,255,.12) !important;
}

#cdn-toggle-install-btn .cdn-install-mini-icon + .cdn-install-mini-icon {
  margin-left: -7px !important;
}

#cdn-toggle-install-btn .cdn-install-mini-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: scale(1.28) !important;
  display: block !important;
}

/* Compact subscription controls. */
.section .actions {
  gap: 10px !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.section .actions .btn,
.section .actions a,
.section .actions button {
  width: auto !important;
  min-width: 0 !important;
  max-width: 232px !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  gap: 8px !important;
}

#cdn-toggle-install-btn,
.section .actions .btn-open-guides {
  width: auto !important;
  max-width: 224px !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}

#cdn-toggle-install-btn .cdn-install-mini-icons,
.btn-open-guides .cdn-install-mini-icons,
.cdn-install-mini-icons {
  display: none !important;
}

#cdn-toggle-install-btn svg,
.section .actions .btn-open-guides svg {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
}

.cdnrelay-balance-chip {
  width: auto !important;
  min-height: 36px !important;
  padding: 0 13px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
}

.cdnrelay-pay-row {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: auto !important;
  max-width: 100% !important;
  flex-wrap: wrap !important;
}

.cdnrelay-renew-btn,
.cdnrelay-renew-btn:visited {
  width: 196px !important;
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}

.cdnrelay-tg-pay,
.cdnrelay-tg-pay:visited {
  border-color: rgba(56,216,255,.70) !important;
}

.cdnrelay-pay-help {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(56,216,255,.62) !important;
  background: rgba(56,216,255,.10) !important;
  color: #dffaff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  cursor: help !important;
  box-shadow: 0 0 14px rgba(56,216,255,.16) !important;
  z-index: 6 !important;
}

.cdnrelay-pay-help::after {
  content: attr(data-tip) !important;
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 10px) !important;
  transform: translateX(-50%) translateY(4px) !important;
  width: min(280px, calc(100vw - 36px)) !important;
  padding: 11px 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(56,216,255,.42) !important;
  background: rgba(8,12,30,.96) !important;
  color: #eef7ff !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 760 !important;
  text-align: left !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.42), 0 0 18px rgba(56,216,255,.14) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease !important;
  z-index: 20 !important;
}

.cdnrelay-pay-help:hover::after,
.cdnrelay-pay-help:focus-visible::after {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* Subscription actions: QR is opened from a button; app install is the highlighted right edge action. */
.cdnrelay-sub-layout {
  display: block !important;
}

.cdnrelay-qr-card {
  display: none !important;
}

.section .actions.cdnrelay-sub-actions {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-top: 14px !important;
}

.section .actions.cdnrelay-sub-actions .btn,
.section .actions.cdnrelay-sub-actions button,
.section .actions.cdnrelay-sub-actions a {
  flex: 0 0 auto !important;
}

.section .actions.cdnrelay-sub-actions .cdnrelay-qr-open-btn {
  min-width: 132px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
  margin-left: auto !important;
  min-width: 260px !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 14px 0 16px !important;
  border-color: rgba(56,216,255,.96) !important;
  background: rgba(18,22,48,.94) !important;
  box-shadow:
    0 0 0 2px rgba(56,216,255,.24),
    0 0 18px rgba(56,216,255,.20),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
  transform: none !important;
  transition: border-color .12s ease, box-shadow .12s ease, background-color .12s ease !important;
  will-change: auto !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn:hover,
.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn:focus-visible,
.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn.is-open {
  transform: none !important;
  border-color: rgba(56,216,255,1) !important;
  background: rgba(18,22,48,.98) !important;
  box-shadow:
    0 0 0 2px rgba(56,216,255,.30),
    0 0 16px rgba(56,216,255,.18),
    inset 0 1px 0 rgba(255,255,255,.075) !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icons {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  gap: 0 !important;
  margin-left: 4px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icon {
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(5,7,18,.78) !important;
  box-shadow: 0 0 12px rgba(56,216,255,.16) !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icon + .cdn-install-mini-icon {
  margin-left: -7px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: scale(1.28) !important;
}

@media (max-width: 720px) {
  .section .actions.cdnrelay-sub-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }

  .section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin-left: 0 !important;
  }
}

/* CDNRELAY_SIMPLE_SUB_V176 */
.cdnrelay-sub-main > #sub.copy {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.cdnrelay-sub-main > p {
  max-width: 760px !important;
}

.cdn-simple-sub-steps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 14px 0 12px !important;
}

.cdn-simple-sub-steps > div {
  min-width: 0 !important;
  min-height: 74px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px !important;
  border: 1px solid rgba(56,216,255,.26) !important;
  border-radius: 14px !important;
  background: rgba(7,12,30,.56) !important;
}

.cdn-simple-sub-steps b {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  color: #04111c !important;
  background: #38d8ff !important;
  box-shadow: 0 0 16px rgba(56,216,255,.32) !important;
  font-weight: 1000 !important;
}

.cdn-simple-sub-steps span {
  min-width: 0 !important;
  color: #f7f3ff !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

.section .actions.cdnrelay-sub-actions {
  display: grid !important;
  grid-template-columns: minmax(250px, 1.35fr) minmax(132px, .68fr) minmax(132px, .68fr) !important;
  align-items: stretch !important;
  gap: 12px !important;
  margin-top: 16px !important;
}

.section .actions.cdnrelay-sub-actions .btn,
.section .actions.cdnrelay-sub-actions button,
.section .actions.cdnrelay-sub-actions a {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  justify-content: center !important;
  white-space: normal !important;
}

.section .actions.cdnrelay-sub-actions .btn span,
.section .actions.cdnrelay-sub-actions button span,
.section .actions.cdnrelay-sub-actions a span {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: center !important;
  line-height: 1.12 !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
  margin-left: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 16px !important;
  display: flex !important;
  justify-content: center !important;
  gap: 10px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-label {
  min-width: 0 !important;
  flex: 0 1 auto !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: left !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icons {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  margin-left: 2px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icon {
  width: 23px !important;
  height: 23px !important;
  min-width: 23px !important;
  flex-basis: 23px !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icon + .cdn-install-mini-icon {
  margin-left: -8px !important;
}

@media (max-width: 860px) {
  .cdn-simple-sub-steps,
  .section .actions.cdnrelay-sub-actions {
    grid-template-columns: 1fr !important;
  }

  .section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
    grid-column: auto !important;
  }
}

@media (max-width: 420px) {
  .section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-mini-icons {
    display: none !important;
  }
}

/* CDNRELAY_DUMB_SIMPLE_UX_V178 */
.cdn-install-subtitle {
  max-width: 660px !important;
  margin: 8px 0 0 !important;
  color: #c9c6dc !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  font-weight: 780 !important;
}

.cdn-app-choice-title {
  margin: 0 0 10px !important;
  color: #f7f3ff !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
}

.cdn-install-clean .cdn-app-tabs {
  margin-bottom: 18px !important;
}

.cdn-install-clean .cdn-app-tab {
  min-height: 76px !important;
  border-radius: 14px !important;
}

.cdn-install-clean .cdn-app-tab.is-active {
  background: rgba(8,31,48,.94) !important;
  border-color: rgba(56,216,255,.95) !important;
}

.cdn-install-clean .cdn-install-step {
  border-color: rgba(56,216,255,.24) !important;
  background: rgba(7,12,30,.62) !important;
}

.cdn-install-clean .cdn-install-step h3 {
  font-size: 20px !important;
  line-height: 1.2 !important;
}

.cdn-install-clean .cdn-install-step p {
  font-size: 15px !important;
  line-height: 1.45 !important;
}

.cdn-install-clean .cdn-step-actions {
  gap: 10px !important;
}

.cdn-install-clean .cdn-step-btn {
  min-height: 58px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
}

.cdn-install-clean .cdn-step-btn.primary,
.cdn-install-clean .cdn-step-btn-main {
  min-height: 68px !important;
  font-size: 17px !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.28), rgba(139,92,255,.44)) !important;
  border-color: rgba(56,216,255,1) !important;
  box-shadow:
    0 0 0 2px rgba(56,216,255,.18),
    0 0 24px rgba(56,216,255,.24),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.section .actions.cdnrelay-sub-actions {
  grid-template-columns: minmax(280px, 1.5fr) minmax(150px, .65fr) minmax(170px, .75fr) !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
  min-height: 62px !important;
  height: 62px !important;
  font-size: 16px !important;
  border-width: 2px !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.18), rgba(139,92,255,.34)) !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn .cdn-install-label {
  text-align: center !important;
  font-size: 16px !important;
}

.cdn-simple-sub-steps > div:first-child {
  border-color: rgba(56,216,255,.58) !important;
  background: rgba(8,31,48,.70) !important;
}

@media (max-width: 720px) {
  .cdn-install-subtitle {
    font-size: 14px !important;
  }

  .cdn-install-clean .cdn-step-btn,
  .cdn-install-clean .cdn-step-btn.primary,
  .cdn-install-clean .cdn-step-btn-main {
    width: 100% !important;
    min-height: 64px !important;
  }

  .cdn-install-clean .cdn-app-tabs {
    grid-template-columns: 1fr !important;
  }
}

/* CDNRELAY_MOBILE_ACTIONS_V181 */
.section .actions.cdnrelay-sub-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin-left: 0 !important;
  min-width: 0 !important;
}

.section .actions.cdnrelay-sub-actions .btn,
.section .actions.cdnrelay-sub-actions button,
.section .actions.cdnrelay-sub-actions a {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.cdnrelay-modal-x {
  z-index: 3 !important;
  pointer-events: auto !important;
}

@media (max-width: 640px) {
  .section .actions.cdnrelay-sub-actions {
    grid-template-columns: 1fr !important;
  }

  .section .actions.cdnrelay-sub-actions .btn,
  .section .actions.cdnrelay-sub-actions button,
  .section .actions.cdnrelay-sub-actions a {
    min-height: 56px !important;
  }

  .cdnrelay-modal-card {
    width: min(420px, calc(100vw - 20px)) !important;
    padding: 22px 18px 18px !important;
  }

.cdnrelay-modal-qr-wrap img {
    width: min(260px, calc(100vw - 92px)) !important;
  }
}

/* CDNRELAY_INSTALL_POLISH_V182 */
.cdn-install-head h2 {
  letter-spacing: 0 !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn {
  border-width: 1px !important;
  border-color: rgba(56,216,255,.78) !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.13), rgba(139,92,255,.22)),
    rgba(18,22,48,.94) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(56,216,255,.10),
    0 0 14px rgba(56,216,255,.12) !important;
}

.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn:hover,
.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn:focus-visible,
.section .actions.cdnrelay-sub-actions #cdn-toggle-install-btn.is-open {
  border-color: rgba(56,216,255,.92) !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.16), rgba(139,92,255,.24)),
    rgba(18,22,48,.98) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 1px rgba(56,216,255,.14),
    0 0 16px rgba(56,216,255,.15) !important;
}

.cdn-install-clean .cdn-app-tab.is-active,
.cdn-install-clean .cdn-step-btn.primary,
.cdn-install-clean .cdn-step-btn-main {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(56,216,255,.10),
    0 0 16px rgba(56,216,255,.13) !important;
}

.cdn-install-clean .cdn-step-btn.primary,
.cdn-install-clean .cdn-step-btn-main {
  min-height: 62px !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.22), rgba(139,92,255,.32)),
    rgba(18,22,48,.94) !important;
  border-color: rgba(56,216,255,.78) !important;
}

.cdn-install-clean .cdn-step-btn:hover,
.cdn-install-clean .cdn-step-btn:focus-visible {
  transform: translateY(-1px) !important;
  border-color: rgba(56,216,255,.92) !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.14), rgba(139,92,255,.20)),
    rgba(18,22,48,.98) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(56,216,255,.16),
    0 0 18px rgba(56,216,255,.18) !important;
}

.cdn-install-clean .cdn-step-btn.primary:hover,
.cdn-install-clean .cdn-step-btn.primary:focus-visible,
.cdn-install-clean .cdn-step-btn-main:hover,
.cdn-install-clean .cdn-step-btn-main:focus-visible {
  border-color: rgba(56,216,255,1) !important;
  background:
    linear-gradient(90deg, rgba(56,216,255,.30), rgba(139,92,255,.42)),
    rgba(18,22,48,.98) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 0 1px rgba(56,216,255,.24),
    0 0 22px rgba(56,216,255,.26),
    0 0 34px rgba(139,92,255,.20) !important;
}

.cdn-install-flow {
  grid-template-columns: 72px minmax(0, 1fr) !important;
  gap: 22px !important;
}

.cdn-install-line {
  padding-top: 2px !important;
}

.cdn-step-dot {
  width: 58px !important;
  height: 58px !important;
  border-width: 1px !important;
  box-shadow:
    0 0 0 1px rgba(56,216,255,.08),
    0 0 14px rgba(56,216,255,.20),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.cdn-step-dot svg {
  width: 30px !important;
  height: 30px !important;
  filter: drop-shadow(0 0 5px rgba(56,216,255,.28)) !important;
}

.cdn-step-line {
  width: 3px !important;
  height: 72px !important;
  box-shadow: 0 0 6px rgba(56,216,255,.16) !important;
}

.cdn-install-steps {
  gap: 18px !important;
}

.cdn-install-clean .cdn-install-step {
  min-height: 112px !important;
  padding: 0 0 6px !important;
}

.cdn-install-clean .cdn-step-actions {
  align-items: stretch !important;
}

.cdn-install-clean .cdn-step-btn {
  max-width: 100% !important;
  text-align: center !important;
  white-space: normal !important;
}

@media (max-width: 720px) {
  .cdn-install-clean {
    padding: 22px 16px !important;
  }

  .cdn-install-flow {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  .cdn-install-line {
    display: none !important;
  }

  .cdn-install-steps {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .cdn-step-dot {
    width: 48px !important;
    height: 48px !important;
  }

  .cdn-step-dot svg {
    width: 25px !important;
    height: 25px !important;
  }

  .cdn-step-line {
    height: 78px !important;
  }

  .cdn-install-clean .cdn-install-step {
    min-height: 118px !important;
  }

  .cdn-install-clean .cdn-step-btn,
  .cdn-install-clean .cdn-step-btn.primary,
  .cdn-install-clean .cdn-step-btn-main {
    min-height: 58px !important;
    font-size: 14px !important;
  }
}

/* CDNRELAY_MOBILE_INSTALL_GRID_FIX_V184 */
@media (max-width: 720px) {
  #guides,
  #guides .cdn-install-clean,
  #guides .cdn-install-head,
  #guides .cdn-os-picker,
  #guides .cdn-app-tabs,
  #guides .cdn-install-flow,
  #guides .cdn-install-steps,
  #guides .cdn-install-step {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #guides .cdn-install-clean {
    overflow: hidden !important;
    padding: 20px 14px !important;
    border-radius: 22px !important;
  }

  #guides .cdn-install-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  #guides .cdn-install-flow {
    display: block !important;
  }

  #guides .cdn-install-line {
    display: none !important;
  }

  #guides .cdn-install-steps {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  #guides .cdn-install-step {
    min-height: 0 !important;
    padding: 16px 14px !important;
    border-radius: 18px !important;
  }

  #guides .cdn-install-step h3 {
    font-size: 21px !important;
    line-height: 1.18 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  #guides .cdn-install-step p,
  #guides .cdn-step-muted {
    max-width: none !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }

  #guides .cdn-step-actions,
  #guides .cdn-step-actions--import {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  #guides .cdn-step-btn,
  #guides .cdn-step-btn.primary,
  #guides .cdn-step-btn-main {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding: 12px 14px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  #guides .cdn-step-btn span {
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}

@media (max-width: 390px) {
  #guides .cdn-install-clean {
    padding: 18px 12px !important;
  }

  #guides .cdn-install-step h3 {
    font-size: 20px !important;
  }

  #guides .cdn-step-btn,
  #guides .cdn-step-btn.primary,
  #guides .cdn-step-btn-main {
    font-size: 15px !important;
  }
}

/* CDNRELAY_ACCESS_FIX_20260520_V186: centered app cards and stable QR/actions. */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

@supports (overflow: clip) {
  html,
  body {
    overflow-x: clip !important;
  }
}

body::after {
  display: none !important;
}

.hero,
.wrap,
.card,
.section,
.cdn-install-clean,
.cdnrelay-modal-card {
  overflow: hidden !important;
}

.cdn-install-clean .cdn-app-tabs,
#guides .cdn-app-tabs {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
}

.cdn-install-clean .cdn-app-tab,
#guides .cdn-app-tab {
  min-width: 0 !important;
  min-height: 84px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  padding: 10px 14px !important;
  text-align: center !important;
}

.cdn-install-clean .cdn-app-icon,
#guides .cdn-app-icon {
  width: 60px !important;
  height: 60px !important;
  flex: 0 0 60px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}

.cdn-install-clean .cdn-app-icon img.cdn-app-icon-png,
#guides .cdn-app-icon img.cdn-app-icon-png {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: inherit !important;
  transform: scale(1.58) !important;
  transform-origin: center center !important;
}

.cdn-install-clean .cdn-app-name,
#guides .cdn-app-name {
  min-width: 0 !important;
  text-align: center !important;
  font-size: 15px !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

.cdn-install-clean .cdn-step-actions,
.cdn-install-clean .cdn-step-actions--import,
#guides .cdn-step-actions,
#guides .cdn-step-actions--import {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
  justify-items: stretch !important;
}

.cdn-install-clean .cdn-step-btn,
#guides .cdn-step-btn {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 58px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: normal !important;
}

.cdn-install-clean .cdn-clients-card-btn,
#guides .cdn-clients-card-btn {
  grid-column: 1 / -1 !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 92px !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  padding: 16px 20px !important;
  border-color: rgba(116, 255, 211, .44) !important;
  background:
    radial-gradient(circle at 18% 30%, rgba(116,255,211,.20), transparent 34%),
    radial-gradient(circle at 72% 10%, rgba(168,85,247,.24), transparent 34%),
    linear-gradient(135deg, rgba(13,24,44,.94), rgba(20,18,42,.94)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 1px rgba(116,255,211,.10),
    0 16px 34px rgba(0,0,0,.28),
    0 0 26px rgba(116,255,211,.12) !important;
}

.cdn-install-clean .cdn-clients-card-btn::after,
#guides .cdn-clients-card-btn::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent),
    radial-gradient(circle at 86% 50%, rgba(116,255,211,.16), transparent 34%) !important;
  opacity: .75 !important;
}

.cdn-clients-art {
  position: relative;
  z-index: 1;
  flex: 0 0 96px;
  width: 96px;
  height: 60px;
  display: block;
}

.cdn-clients-orbit {
  position: absolute;
  inset: 5px 2px;
  border-radius: 999px;
  border: 1px solid rgba(116,255,211,.34);
  box-shadow: 0 0 18px rgba(116,255,211,.18);
}

.cdn-clients-app {
  position: absolute;
  top: 2px;
  width: 56px;
  height: 56px;
  display: grid !important;
  place-items: center;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(8,10,24,.86);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.34);
}

.cdn-clients-app-happ {
  left: 0;
}

.cdn-clients-app-incy {
  right: 0;
}

.cdn-clients-app img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.2);
}

.cdn-clients-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
  display: grid;
  gap: 4px;
  text-align: left;
}

.cdn-clients-copy strong {
  color: #fff;
  font-size: clamp(18px, 3.9vw, 24px);
  line-height: 1.05;
}

.cdn-clients-copy small {
  color: rgba(230,242,255,.72);
  font-size: 12px;
  line-height: 1.25;
}

.cdn-app-tabs-pulse {
  animation: cdnrelayClientPulse .9s ease;
}

@keyframes cdnrelayClientPulse {
  0%, 100% { filter: none; }
  35% { filter: drop-shadow(0 0 18px rgba(116,255,211,.44)); }
}

.cdnrelay-modal-qr-wrap {
  display: grid !important;
  place-items: center !important;
}

.cdnrelay-modal-qr-wrap img {
  width: min(300px, calc(100vw - 82px)) !important;
  height: auto !important;
  margin: 0 auto !important;
}

@media (max-width: 720px) {
  .cdn-install-clean .cdn-app-tabs,
  #guides .cdn-app-tabs,
  .cdn-install-clean .cdn-step-actions,
  .cdn-install-clean .cdn-step-actions--import,
  #guides .cdn-step-actions,
  #guides .cdn-step-actions--import {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}