body.promo-background-page {
  background: #0d1017;
  --panel: rgba(16, 22, 31, .58);
  --panel-strong: rgba(18, 25, 36, .86);
  --text: #f1f5fc;
  --muted: #c1ccdd;
  --line: rgba(168, 194, 224, .32);
  isolation: isolate;
}
.promo-background {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: #0d1017;
}
.promo-background video {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}
body.promo-background-page .topbar {
  background: rgba(13, 16, 23, .76);
  border-color: var(--line);
}
body.promo-background-page .brand { flex: 0 0 auto; white-space: nowrap; }
body.promo-background-page :where(.plan-card, .telegram-box, .telegram-vpn-entry, .subscription-row, .subscription-detail-card, .history-card, .key-card, .panel) {
  background: var(--panel);
  border-color: var(--line);
  backdrop-filter: blur(7px);
}
body.promo-background-page :where(.subscription-detail-grid > div, .feature-chip, .traffic-package-button) {
  background: rgba(21, 30, 43, .65);
  border-color: var(--line);
}
body.promo-background-page :where(h1, h2, h3, h4, label, p, strong, small, .eyebrow) {
  text-shadow: 0 1px 4px #000;
}
body.promo-background-page .section-head {
  padding: 14px 16px;
  background: rgba(13, 16, 23, .52);
  border-left: 2px solid #57b6f5;
}
body.promo-background-page :where(.gans-download, .cabinet-simple-head) {
  background: rgba(13, 16, 23, .52);
  padding: 20px 16px;
}
body.promo-background-page :where(.modal-card, .nerlo-payment-card) {
  backdrop-filter: none;
}
.promo-background-toggle {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 45;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid rgba(168, 194, 224, .5);
  border-radius: 6px;
  background: rgba(13, 16, 23, .88);
  color: #fff;
  cursor: pointer;
}
.promo-background-toggle span { font-size: 16px; letter-spacing: 0; }
body.promo-background-page:has(.modal-overlay) .promo-background-toggle { visibility: hidden; }
@media (max-width: 600px) {
  .promo-background video { object-position: center 14%; }
  body.promo-background-page .section-head { padding: 12px; }
  body.promo-background-page .topbar { padding: 10px 16px; }
  body.promo-background-page .topbar { flex-wrap: wrap; }
  body.promo-background-page .nav { width: 100%; justify-content: flex-start; gap: 4px; }
  body.promo-background-page .section { padding-block: 24px; }
  body.promo-background-page { padding-bottom: 64px; }
}