/* ===== AstroFlow Web: визуальный слой сайта поверх site.css / *-app.css ===== */
:root {
  --bg: #05060f;
  --wx-w: 1200px;
  --wx-pad: clamp(16px, 4vw, 40px);
  --wx-gap: clamp(14px, 1.6vw, 20px);
  --wx-section: clamp(72px, 9vw, 128px);
  --wx-surface: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .018));
  --wx-surface-flat: rgba(14, 15, 32, .72);
  --wx-border: rgba(255, 255, 255, .085);
  --wx-border-hi: rgba(255, 255, 255, .17);
  --wx-text: #f4f5ff;
  --wx-muted: #a2a7c7;
  --wx-dim: #6f7497;
  --wx-violet: #8b7bff;
  --wx-cyan: #6fe3ff;
  --wx-gold: #ffc14a;
  --wx-head: "Unbounded", "Manrope", system-ui, sans-serif;
  --wx-ease: cubic-bezier(.2, .9, .3, 1);
  --wx-radius: 24px;
  --wx-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
@media (min-width: 1440px) { :root { --wx-w: 1280px; } }

html, body { background: var(--bg); }
html.is-desktop { scroll-behavior: auto; }
.is-desktop .rv { opacity: 1; transform: none; transition: none; }
html.in-tg-desk .tg-bar { display: none !important; }
html.in-tg-desk.is-desktop {
  --tg-top: calc(var(--tg-safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px));
  --tg-right: calc(var(--tg-safe-area-inset-right, 0px) + var(--tg-content-safe-area-inset-right, 0px));
  --tg-head: calc(68px + var(--tg-top));
}
html.in-tg-desk.is-desktop.tg-full {
  --tg-top: max(48px, calc(var(--tg-safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px)));
}
html.in-tg-desk.is-desktop .top {
  top: 0;
  width: 100%;
  height: var(--tg-head);
  margin: 0;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  align-items: flex-end;
  padding: 0 max(28px, var(--tg-right), calc((100vw - 1240px) / 2)) 12px max(28px, calc((100vw - 1240px) / 2));
  overflow: hidden;
  background: linear-gradient(180deg, rgba(7, 5, 28, .96), rgba(7, 5, 28, .88));
}
html.in-tg-desk.is-desktop body.wx-scrolled .top {
  height: var(--tg-head);
  padding-top: 0;
  padding-bottom: 12px;
  background: rgba(7, 5, 28, .94);
}
html.in-tg-desk.is-desktop .brand,
html.in-tg-desk.is-desktop .me-chip { height: 44px; }
html.in-tg-desk.is-desktop body.wx-app main {
  max-width: 1240px;
  padding-top: calc(var(--tg-head) + 16px);
}
html.in-tg-desk.is-desktop .app {
  align-items: start;
  min-height: calc(100vh - var(--tg-head) - 32px);
}
html.in-tg-desk.is-desktop .side {
  top: calc(var(--tg-head) + 16px);
  min-height: calc(100vh - var(--tg-head) - 32px);
}
html.in-tg-desk.is-desktop .wx-bar { min-height: 44px; margin-bottom: 16px; align-items: center; }
body { color: var(--wx-text); }
::selection { background: rgba(255, 193, 74, .35); color: #fff; }
:focus-visible { outline: 2px solid rgba(255, 193, 74, .8); outline-offset: 3px; border-radius: 10px; }

/* ---------- фон ---------- */
.sky {
  background:
    radial-gradient(1100px 620px at 50% -12%, rgba(104, 82, 255, .26), transparent 62%),
    radial-gradient(800px 600px at 100% 38%, rgba(255, 150, 60, .08), transparent 60%),
    radial-gradient(900px 700px at 0% 92%, rgba(46, 140, 255, .1), transparent 62%),
    var(--bg);
}
.sky-glow { filter: blur(110px); opacity: .55; mix-blend-mode: screen; animation: wxGlow 28s ease-in-out infinite alternate; }
.sky-glow--a { width: 52vw; height: 52vw; left: -18vw; top: -24vw; background: radial-gradient(circle, rgba(124, 92, 255, .75), transparent 66%); }
.sky-glow--b { width: 48vw; height: 48vw; right: -18vw; top: 34%; background: radial-gradient(circle, rgba(255, 150, 60, .32), rgba(60, 120, 255, .18) 45%, transparent 68%); animation-delay: -12s; }
@keyframes wxGlow { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(6vw, 4vw, 0) scale(1.12); } }
.sky-stars { opacity: .38; }
.sky-stars--near { opacity: .5; }
.wx-noise {
  position: absolute; inset: -50%; opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.wx-spot { position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; background: radial-gradient(520px circle at var(--mx, 50%) var(--my, 30%), rgba(139, 123, 255, .1), transparent 62%); }
body.wx-has-spot .wx-spot { opacity: 1; }

/* ---------- типографика ---------- */
h1, h2 { font-family: var(--wx-head); font-weight: 700; letter-spacing: -.025em; }
h3 { font-family: var(--font); font-weight: 800; letter-spacing: -.01em; }
.wx-kicker {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: max-content; margin: 0 auto 16px;
  padding: 6px 14px; border-radius: 999px;
  background: rgba(255, 193, 74, .08); border: 1px solid rgba(255, 193, 74, .24);
  color: #ffd27a; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
}
.wx-kicker::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; }
.wx-link { color: #ffd27a; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(255, 210, 122, .35); text-underline-offset: 3px; }
.wx-link:hover { text-decoration-color: currentColor; }

/* ---------- кнопки ---------- */
.btn { letter-spacing: -.005em; transition: transform .25s var(--wx-ease), box-shadow .3s ease, background .25s, border-color .25s, opacity .2s; }
@media (hover: hover) {
  .btn--gold:hover, .btn--tg:hover, .btn--blue:hover { transform: translateY(-2px); }
  .btn--glass:hover { transform: translateY(-2px); }
}
.btn--glass { background: rgba(255, 255, 255, .05); border: 1px solid var(--wx-border-hi); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.btn--glass:hover { background: rgba(255, 255, 255, .09); border-color: rgba(255, 255, 255, .28); }

/* ---------- шапка ---------- */
.top {
  position: fixed; inset: 0 0 auto; z-index: 40; width: 100%;
  background: transparent; border-bottom: 1px solid transparent; box-shadow: none;
  backdrop-filter: none; -webkit-backdrop-filter: none;
  transition: padding .3s ease, background .3s ease, border-color .3s ease, backdrop-filter .3s ease;
}
.wx-progress {
  position: absolute; left: 0; right: 0; bottom: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, var(--wx-violet), #ffd27a 55%, #ff8a3d);
  transform: scaleX(var(--wx-p, 0)); transform-origin: left center;
  opacity: 0; transition: opacity .3s;
}
body.wx-guest.wx-scrolled .wx-progress { opacity: 1; }
.is-desktop .top {
  top: 0; width: 100%; margin: 0; border-radius: 0;
  padding: calc(14px + var(--safe-t)) max(32px, calc((100vw - var(--wx-w)) / 2)) 14px;
  background: transparent; border: 0; border-bottom: 1px solid transparent; box-shadow: none;
}
.is-desktop .top .wx-progress { left: 18px; right: 18px; border-radius: 2px; }
body.wx-scrolled .top {
  padding-top: calc(8px + var(--safe-t)); padding-bottom: 8px;
  background: rgba(6, 7, 18, .72); border-bottom-color: rgba(255, 255, 255, .08);
  backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: none;
}
.is-desktop .brand-rocket, .is-desktop .brand-ship, .is-desktop .brand-rocket svg { width: 44px; height: 44px; }
.is-desktop .brand-name { font-size: 28px; }
@media (min-width: 1101px) {
  .is-desktop .brand-name { top: 0; }
}
.is-desktop .top-nav { gap: 2px; padding: 4px; border-radius: 14px; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .05); }
.is-desktop .top-nav a {
  position: relative; padding: 8px 14px; border-radius: 10px;
  color: var(--wx-muted); font-size: 14px; font-weight: 700;
  transition: color .2s, background .2s;
}
.is-desktop .top-nav a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.is-desktop .top-nav a.is-active { color: #fff; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.is-desktop .top-nav a.is-active::after { content: ""; position: absolute; left: 50%; bottom: 3px; width: 14px; height: 2px; margin-left: -7px; border-radius: 2px; background: #ffd27a; box-shadow: 0 0 8px #ffc14a; }
.is-desktop .top-actions .btn--sm { height: 44px; border-radius: 14px; }
#top-login {
  display: inline-flex; align-items: center; justify-content: center;
  box-sizing: border-box; height: 40px; min-height: 40px; padding: 0 16px 1px; border-radius: 12px;
  font-family: "Manrope", system-ui, sans-serif; font-weight: 700; font-size: 14.5px;
  letter-spacing: .01em; line-height: 1;
}
.is-desktop #top-login { height: 44px; min-height: 44px; padding: 0 18px 1px; border-radius: 14px; font-size: 15px; }
.is-mobile #top-login { height: 46px; min-height: 46px; padding: 0 18px 1px; border-radius: 14px; font-size: 15px; }
.is-desktop .top-tg { width: 42px; height: 42px; }
.top-tg { display: inline-flex; align-items: center; justify-content: center; }
.top-tg svg { width: 26px; height: 26px; position: relative; top: 0; left: .5px; }
.is-desktop .top-tg svg { width: 28px; height: 28px; }
@media (max-width: 1240px) { .is-desktop .top-nav a { padding: 8px 10px; font-size: 13.5px; } }
.is-mobile .top {
  background: transparent;
  backdrop-filter: none; -webkit-backdrop-filter: none;
  border-bottom: 1px solid transparent; box-shadow: none;
}
.is-mobile .top::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: var(--safe-t);
  background: transparent;
}
/* html и body одного цвета: Safari не подменяет полосу над шапкой и низ под адресной строкой чёрным после прокрутки. */
html.is-ios {
  background: #07051c;
  background-color: #07051c;
  overflow-x: clip;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}
html.is-ios body {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  position: static !important;
  overflow-x: clip;
  overflow-y: visible;
  overscroll-behavior-y: auto;
}
html.is-ios .sky {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: calc(-1 * max(220px, env(safe-area-inset-bottom, 0px) + 160px));
  width: 100%;
  height: auto;
  min-height: calc(100lvh + max(220px, env(safe-area-inset-bottom, 0px) + 160px));
  background-color: transparent !important;
  background-image:
    radial-gradient(1100px 620px at 50% -12%, rgba(104, 82, 255, .26), transparent 62%),
    radial-gradient(800px 600px at 100% 38%, rgba(255, 150, 60, .08), transparent 60%),
    radial-gradient(900px 700px at 0% 92%, rgba(46, 140, 255, .1), transparent 62%) !important;
  overflow: visible;
}
html.is-ios .sky-glow,
html.is-ios .wx-noise,
html.is-ios .shoot { mix-blend-mode: normal; filter: none; animation: none; transform: none; }
html.is-ios .lte { overflow: clip; }
/* iOS: звёзды размером с экран и без дрейфа. Слой 200% экрана с анимацией — ~60 МБ видеопамяти на каждый. */
html.is-ios .sky-stars, html.is-ios .sky-stars--near { inset: 0; animation: none; transform: none; }
.is-mobile body.wx-scrolled .top { border-bottom-color: rgba(255, 255, 255, .08); }
html.is-ios body.wx-scrolled .top::before { background: transparent; }
.is-desktop .sky-glow {
  filter: none;
  mix-blend-mode: normal;
  animation: none;
}
.is-desktop .wx-noise { display: none; }
.is-desktop .btn--glass,
.is-desktop .wx-chip {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.is-desktop #guest > .block {
  content-visibility: auto;
  contain-intrinsic-size: auto 640px;
}
.is-mobile .wx-progress { height: 2px; }
.burger { background: rgba(255, 255, 255, .06); border-color: var(--wx-border-hi); box-shadow: none; }
.burger:hover { box-shadow: 0 0 0 4px rgba(255, 255, 255, .04); }
.menu-card { background: linear-gradient(180deg, rgba(14, 15, 34, .98), rgba(6, 7, 18, .99)); border-right: 1px solid var(--wx-border-hi); }
.menu-nav a { font-family: var(--wx-head); font-size: 22px; font-weight: 600; letter-spacing: -.02em; border-bottom: 1px solid rgba(255, 255, 255, .05); padding: 16px 6px; }
.me-chip { background: rgba(255, 255, 255, .05); border-color: var(--wx-border); transition: background .2s, border-color .2s; }
.me-chip:hover { background: rgba(255, 255, 255, .09); border-color: var(--wx-border-hi); }

/* ---------- контейнер ---------- */
.is-desktop main { max-width: var(--wx-w); padding: calc(76px + var(--safe-t)) var(--wx-pad) 0; }
.is-desktop body.wx-app main { max-width: calc(var(--wx-w) + 80px); }
.is-mobile main { max-width: 820px; padding: calc(78px + var(--safe-t)) var(--wx-pad) 0; }
.block { margin-top: var(--wx-section); scroll-margin-top: 110px; }
#guest > .block > h2, #guest > .block > .block-lead { text-align: center; margin-left: auto; margin-right: auto; }
#guest > .block > h2 { max-width: 820px; font-size: clamp(30px, 4vw, 52px); line-height: 1.06; margin-bottom: 18px; }
#guest > .block > .block-lead { max-width: 640px; margin-bottom: clamp(28px, 4vw, 48px); font-size: clamp(15px, 1.3vw, 18px); color: var(--wx-muted); }
.block h2 + .block-lead { margin-top: 0; }
#guest > .block > h2:last-child { margin-bottom: clamp(28px, 4vw, 44px); }
#guest #daily > h2 { margin-bottom: clamp(28px, 4vw, 44px); }
#partner > .btn { display: flex; width: max-content; margin: 28px auto 0; }

/* ---------- герой ---------- */
.hero { position: relative; isolation: isolate; }
.is-desktop, .is-desktop body { overflow-x: clip; }
.is-mobile .wx-horizon { top: auto; bottom: -64px; width: 240vw; height: 230px; margin-top: 0; }
.wx-horizon { position: absolute; z-index: -1; left: 50%; top: 100%; width: 170vw; height: 360px; margin-top: -10px; transform: translateX(-50%); pointer-events: none; }
.wx-horizon::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background:
    radial-gradient(ellipse 46% 70% at 50% 0%, rgba(139, 123, 255, .22), transparent 62%),
    radial-gradient(ellipse 28% 40% at 18% 8%, rgba(111, 227, 255, .1), transparent 70%),
    radial-gradient(ellipse 28% 40% at 82% 8%, rgba(180, 140, 255, .12), transparent 70%);
  -webkit-mask-image: linear-gradient(180deg, #000 0, transparent 72%);
  mask-image: linear-gradient(180deg, #000 0, transparent 72%);
  animation: wxHorizon 14s ease-in-out infinite;
}
.wx-horizon i {
  position: absolute; top: -28px; height: 90px; border-radius: 50%;
  filter: blur(16px); opacity: .45; pointer-events: none;
  animation: wxAurora 11s ease-in-out infinite;
}
.wx-horizon i:nth-child(1) { width: 34%; left: 10%; background: radial-gradient(ellipse at center, rgba(150, 170, 255, .7), transparent 68%); }
.wx-horizon i:nth-child(2) { width: 22%; left: 40%; background: radial-gradient(ellipse at center, rgba(111, 227, 255, .55), transparent 70%); animation-delay: -4s; animation-duration: 13s; }
.wx-horizon i:nth-child(3) { width: 18%; left: 62%; background: radial-gradient(ellipse at center, rgba(186, 160, 255, .6), transparent 70%); animation-delay: -7s; animation-duration: 9s; }
@keyframes wxAurora {
  0%, 100% { transform: translateX(-8%) scaleX(1); opacity: .28; }
  50% { transform: translateX(18%) scaleX(1.2); opacity: .7; }
}
@keyframes wxHorizon { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
.is-desktop .hero { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(28px, 4vw, 64px); min-height: min(calc(100vh - 140px), 820px); padding-bottom: 40px; }
.hero h1 { margin-top: 22px; font-size: clamp(34px, 4.3vw, 64px); line-height: 1.04; letter-spacing: -.035em; }
.hero h1 em { background: linear-gradient(100deg, #ffe7b0, #ffc14a 30%, #ff8a3d 60%, #b9a4ff 100%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; }
.eyebrow { gap: 10px; padding: 6px 6px 6px 14px; background: rgba(61, 220, 151, .08); border-color: rgba(61, 220, 151, .22); }
.wx-live { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .06); color: var(--wx-muted); font-size: 12px; font-weight: 700; }
.wx-live i { display: block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #3ddc97; font-style: normal; line-height: 0; box-shadow: 0 0 0 0 rgba(61, 220, 151, .6); animation: wxPing 1.8s ease-out infinite; }
@keyframes wxPing { 0% { box-shadow: 0 0 0 0 rgba(61, 220, 151, .6); } 100% { box-shadow: 0 0 0 9px rgba(61, 220, 151, 0); } }
.wx-rotor { margin-top: 18px; color: var(--wx-muted); font-size: clamp(16px, 1.5vw, 20px); font-weight: 700; }
.wx-rotor-box { display: inline-block; width: max-content; max-width: 100%; vertical-align: bottom; height: 1.45em; overflow: hidden; }
.wx-rotor-box b { display: block; width: max-content; color: #fff; padding: 0 .3em; border-radius: 8px; background: linear-gradient(90deg, rgba(139, 123, 255, .22), rgba(111, 227, 255, .14)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); }
.is-mobile .wx-rotor-box,
.is-mobile .wx-rotor-box b { width: max-content; }
.is-mobile .wx-rotor-box b { text-align: center; line-height: 1.45em; white-space: nowrap; }
.wx-rotor-box b.is-out { animation: wxRotOut .35s ease forwards; }
.wx-rotor-box b.is-in { animation: wxRotIn .45s var(--wx-ease); }
@keyframes wxRotOut { to { transform: translateY(-110%); opacity: 0; } }
@keyframes wxRotIn { from { transform: translateY(110%); opacity: 0; } }
.lead { margin-top: 14px; max-width: 560px; color: var(--wx-muted); font-size: clamp(15px, 1.25vw, 18px); line-height: 1.6; }
.hero-cta { margin-top: 30px; }
.hero-gift { max-width: 560px; background: rgba(255, 193, 74, .06); border-color: rgba(255, 193, 74, .2); border-radius: 16px; }
.hero-facts { gap: 0; margin-top: 30px; max-width: 560px; border-radius: 20px; background: var(--wx-surface); border: 1px solid var(--wx-border); overflow: hidden; }
.hero-facts li { padding: 16px 20px; border: 0; border-radius: 0; background: none; }
.hero-facts li + li { border-left: 1px solid var(--wx-border); }
.hero-facts b { font-family: var(--wx-head); font-weight: 700; font-size: clamp(18px, 1.8vw, 24px); letter-spacing: -.02em; background: linear-gradient(120deg, #fff2cf, #ffc14a); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-facts span { color: var(--wx-dim); font-size: 13px; font-weight: 600; }
.hero-art img { border-radius: 32px; box-shadow: 0 30px 80px rgba(76, 29, 149, .5), 0 0 0 1px rgba(255, 255, 255, .12), 0 0 80px rgba(255, 170, 70, .14); }
.wx-chip {
  position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px; border-radius: 999px; white-space: nowrap;
  background: rgba(12, 13, 30, .72); border: 1px solid var(--wx-border-hi);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
  color: #fff; font-size: 13px; font-weight: 800;
  animation: wxBob 6s ease-in-out infinite;
}
.wx-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); box-shadow: 0 0 10px var(--c); }
.wx-chip--a { top: 8%; left: -28%; }
.wx-chip--b { top: 46%; right: -34%; animation-delay: -2s; }
.wx-chip--c { top: -6%; right: -26%; animation-delay: -4s; }
.is-mobile .wx-chip--c { top: auto; right: auto; }
@keyframes wxBob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
.is-desktop #auth-slot-desktop {
  position: relative; width: min(420px, 100%); padding: 28px; border-radius: 28px;
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, #14152c, #0a0b1a) padding-box,
    linear-gradient(140deg, rgba(255, 210, 122, .7), rgba(139, 123, 255, .14) 40%, rgba(111, 227, 255, .5)) border-box;
  box-shadow: 0 40px 90px rgba(0, 0, 0, .55);
}
.auth-tabs, .seg { background: rgba(255, 255, 255, .04); border-color: var(--wx-border); }
.field { background: rgba(255, 255, 255, .035); border-color: var(--wx-border); border-radius: 14px; }
.field:hover { border-color: var(--wx-border-hi); }
@media (max-width: 1240px) { .wx-chip--a { left: -14%; } .wx-chip--b { right: -16%; } .wx-chip--c { right: -10%; } }
@media (max-width: 1100px) {
  .is-desktop .hero { min-height: 0; padding-top: 12px; }
  .is-desktop .top { padding-left: 8px; }
}
.is-mobile .hero { padding-bottom: 210px; }
.is-mobile .wx-horizon { top: auto; bottom: -48px; width: 210vw; height: 168px; margin-top: 0; }
.is-mobile .hero-facts { position: relative; z-index: 2; }
.is-mobile .hero-cta .btn {
  height: 52px;
  font-family: "Manrope", system-ui, sans-serif;
  font-weight: 800;
  font-size: 17px;
  letter-spacing: .01em;
  line-height: 1;
}
.is-mobile .wx-marquee { margin-top: 0; }
.is-mobile .wx-marquee + .block { margin-top: 36px; }
.is-mobile .wx-marquee:not(.sx-countries) .wx-marquee-track { animation-duration: 16s; }
.is-mobile .hero h1 { margin-top: 8px; font-size: clamp(32px, 8.4vw, 52px); }
.is-mobile .wx-chip { font-size: 12px; padding: 6px 11px; }
.is-mobile .wx-chip--a { left: -34%; top: 10%; }
.is-mobile .wx-chip--b { right: -38%; top: 48%; }
.is-mobile .wx-chip--c { left: -30%; bottom: 6%; }
.is-mobile .hero-facts { margin-left: auto; margin-right: auto; }
.is-mobile .hero-facts li { padding: 14px 8px; text-align: center; }
.is-mobile .eyebrow { display: none; }
@media (max-width: 380px) { .wx-live { display: none; } .wx-chip { display: none; } }

/* ---------- бегущая строка ---------- */
.wx-marquee {
  position: relative; margin: clamp(40px, 6vw, 72px) calc(50% - 50vw) 0; padding: 18px 0;
  overflow: hidden; border-block: 1px solid var(--wx-border);
  background: linear-gradient(90deg, rgba(139, 123, 255, .05), rgba(255, 193, 74, .05));
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.wx-marquee-track { display: flex; gap: 14px; width: max-content; animation: wxMarquee 46s linear infinite; }
.wx-marquee:hover .wx-marquee-track { animation-play-state: paused; }
.wx-marquee span {
  display: inline-flex; align-items: center; gap: 10px; flex: none;
  padding: 10px 18px; border-radius: 999px;
  background: rgba(255, 255, 255, .035); border: 1px solid var(--wx-border);
  color: #dfe2ff; font-weight: 700; font-size: 14px; white-space: nowrap;
}
.wx-marquee span.is-gold { color: #ffe2a0; border-color: rgba(255, 193, 74, .25); background: rgba(255, 193, 74, .06); }
.wx-marquee svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
@keyframes wxMarquee { to { transform: translateX(calc(-50% - 7px)); } }

/* ---------- карточки: общая поверхность ---------- */
.feature, .plan, .steps li, .earn-offer article, .wx-faq-item, .daily, .cta-strip, .wx-compare {
  position: relative; isolation: isolate;
  background: var(--wx-surface);
  border: 1px solid var(--wx-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.feature::before, .plan::before, .steps li::before, .earn-offer article::before, .card::before, .wx-faq-item::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(360px circle at var(--mx, 50%) var(--my, -40%), color-mix(in srgb, var(--accent, #8b7bff) 16%, transparent), transparent 60%);
  opacity: 0; transition: opacity .35s ease;
}
@media (hover: hover) {
  .feature:hover::before, .plan:hover::before, .steps li:hover::before, .earn-offer article:hover::before, .card:hover::before, .wx-faq-item:hover::before { opacity: 1; }
  .feature:hover, .plan:hover, .steps li:hover, .earn-offer article:hover { transform: translateY(-4px); border-color: var(--wx-border-hi); box-shadow: 0 24px 50px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .07); }
}

/* ---------- возможности: бенто ---------- */
.features { gap: var(--wx-gap); }
.feature { border-radius: var(--wx-radius); padding: clamp(20px, 2vw, 28px); overflow: hidden; }
.feature::after { content: ""; position: absolute; left: 24px; right: 24px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 80%, transparent), transparent); opacity: .7; }
.feature h3 { font-size: clamp(17px, 1.4vw, 20px); }
.feature p { color: var(--wx-muted); line-height: 1.55; }
.feat-ico { border-radius: 16px; }
.is-mobile .feat-ico svg [opacity=".22"],
.is-mobile .feat-ico svg [opacity=".24"],
.is-mobile .feat-ico svg [opacity=".28"],
.is-mobile .feat-ico svg [fill="#1b1540"] { fill: none; }
.is-mobile .feat-ico .feat-bow { display: none; }
.is-desktop .features { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.is-desktop .features .feature:first-child { grid-column: span 2; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 24px; align-items: center; padding: 32px; background: radial-gradient(500px 220px at 0% 0%, rgba(255, 193, 74, .14), transparent 70%), var(--wx-surface); }
.is-desktop .features .feature:first-child .feat-ico { grid-row: span 2; width: 88px; height: 88px; border-radius: 24px; }
.is-desktop .features .feature:first-child .feat-ico svg { width: 52px; height: 52px; }
.is-desktop .features .feature:first-child h3 { margin-top: 0; font-family: var(--wx-head); font-size: clamp(22px, 2vw, 30px); font-weight: 700; letter-spacing: -.02em; }
.is-desktop .features .feature:first-child p { font-size: 16px; max-width: 460px; }
.wx-feat-price { display: none; }
.is-desktop .features .feature:first-child { grid-template-columns: auto minmax(0, 1fr) auto; }
.is-desktop .wx-feat-price { display: flex; grid-column: 3; grid-row: 1 / span 2; flex-direction: column; align-items: flex-end; gap: 6px; padding-left: 24px; border-left: 1px solid var(--wx-border); text-align: right; }
.wx-feat-price b { font: 800 clamp(48px, 5vw, 72px)/.9 var(--wx-head); letter-spacing: -.05em; background: linear-gradient(160deg, #fff4c8 10%, #ffc14a 50%, #ff8a2e 95%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wx-feat-price b small { font-size: .42em; margin-left: 4px; }
.wx-feat-price em { color: var(--wx-muted); font-size: 13px; font-style: normal; font-weight: 700; line-height: 1.35; }
@media (max-width: 1240px) { .is-desktop .wx-feat-price { display: none; } }
@media (max-width: 1100px) {
  .is-desktop .features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- тарифы ---------- */
.plans--guest { gap: var(--wx-gap); padding-top: 14px; }
.plan { border-radius: var(--wx-radius); padding: clamp(20px, 2vw, 28px); gap: 4px; transition: transform .35s var(--wx-ease), border-color .3s, box-shadow .35s; }
.plan-name { font-family: var(--wx-head); font-weight: 600; font-size: 18px; letter-spacing: -.01em; }
.plan-term { color: var(--wx-dim); font-size: 14px; }
.plan-price { margin-top: 18px; font-family: var(--wx-head); font-weight: 700; font-size: clamp(34px, 3.2vw, 46px); letter-spacing: -.04em; }
.plan-price small { font-family: var(--font); }
.plan-per { color: var(--wx-muted); font-weight: 600; }
.plan-save { margin-top: 8px; }
.plan-meter { margin-top: 18px; height: 4px; }
.plan-acts { margin-top: 22px; }
.plan.is-best {
  --accent: #ffc14a;
  background: radial-gradient(420px 220px at 50% 0%, rgba(255, 193, 74, .2), transparent 70%), linear-gradient(180deg, rgba(40, 30, 20, .55), rgba(12, 12, 28, .75));
  border-color: transparent;
  box-shadow: 0 30px 70px rgba(255, 150, 40, .14);
}
.plan.is-best::after {
  content: ""; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; padding: 1px; pointer-events: none;
  background: conic-gradient(from var(--wx-ang, 0deg), #ffe7a8, #ff8a3d, rgba(139, 123, 255, .6), #ffe7a8);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: wxSpinBorder 6s linear infinite;
}
@property --wx-ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes wxSpinBorder { to { --wx-ang: 360deg; } }
.plan-tag { top: -12px; right: 20px; padding: 5px 12px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 8px 20px rgba(255, 150, 40, .4); }
.is-desktop .plans--guest .plan.is-best { transform: translateY(-10px); }
@media (hover: hover) { .is-desktop .plans--guest .plan.is-best:hover { transform: translateY(-14px); } }
.note { text-align: center; color: var(--wx-dim); }

/* ---------- посуточно ---------- */
.daily {
  border-radius: 32px;
  background:
    radial-gradient(600px 300px at 0% 0%, rgba(255, 176, 60, .14), transparent 60%),
    radial-gradient(500px 300px at 100% 100%, rgba(111, 227, 255, .1), transparent 60%),
    var(--wx-surface);
  border-color: var(--wx-border);
  box-shadow: var(--wx-shadow);
}
.daily-price b { font-family: var(--wx-head); font-weight: 800; letter-spacing: -.05em; }
.daily-price span { font-family: var(--wx-head); }
.daily-calc { background: rgba(4, 5, 14, .55); border-color: var(--wx-border); border-radius: 24px; }
.daily-sum > span { background: rgba(255, 255, 255, .03); border-color: var(--wx-border); }
.daily-sum b { font-family: var(--wx-head); letter-spacing: -.02em; }
.daily-facts li { background: rgba(255, 255, 255, .04); border-color: var(--wx-border); }
.is-desktop .daily { padding: clamp(28px, 3.4vw, 48px); gap: clamp(28px, 4vw, 56px); }

/* ---------- сравнение ---------- */
.wx-compare { overflow: hidden; border-radius: 28px; }
.wx-cmp-row { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.wx-cmp-row + .wx-cmp-row { border-top: 1px solid var(--wx-border); }
.wx-cmp-row > span { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 18px 24px; font-weight: 700; }
.wx-cmp-row > span:first-child { color: #e9ebff; }
.wx-cmp-us { position: relative; color: #fff; background: rgba(255, 193, 74, .06); }
.wx-cmp-them { color: var(--wx-dim); }
.wx-cmp-head > span { padding-top: 22px; padding-bottom: 22px; }
.wx-cmp-head .wx-cmp-us b { font-family: var(--font-display); font-size: 24px; font-weight: 800; color: #fff; }
.wx-cmp-head .wx-cmp-us b em { font-style: normal; background: linear-gradient(120deg, #ffe9b4, #ffc15c 46%, #f08a28); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wx-cmp-head .wx-cmp-us { border-top: 2px solid #ffc14a; }
.wx-cmp-head .wx-cmp-them { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.wx-cmp-row:not(.wx-cmp-head):hover { background: rgba(255, 255, 255, .02); }
.wx-yes, .wx-no { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; }
.wx-yes { background: rgba(61, 220, 151, .16); box-shadow: inset 0 0 0 1px rgba(61, 220, 151, .45); }
.wx-yes::before { content: ""; width: 9px; height: 5px; margin-top: -2px; border-left: 2px solid #5ef0ad; border-bottom: 2px solid #5ef0ad; transform: rotate(-45deg); }
.wx-no { background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.wx-no::before { content: ""; width: 9px; height: 2px; border-radius: 2px; background: #7d82a6; }
@media (max-width: 599px) {
  .is-mobile .wx-cmp-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
  .is-mobile .wx-cmp-row > span { padding: 8px 16px 16px; font-size: 14px; align-items: flex-start; }
  .is-mobile .wx-cmp-row > span:first-child { grid-column: 1 / -1; padding: 16px 16px 4px; color: var(--wx-muted); font-size: 13px; }
  .is-mobile .wx-cmp-head > span:first-child { display: none; }
  .is-mobile .wx-cmp-head > span { padding: 16px; align-items: center; }
  .is-mobile .wx-cmp-us { background: rgba(255, 193, 74, .05); }
  .is-mobile .wx-cmp-head .wx-cmp-us b { font-size: 20px; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .is-mobile .wx-cmp-row > span { padding: 16px 18px; font-size: 14.5px; }
  .is-mobile .wx-cmp-head .wx-cmp-us b { font-size: 21px; }
}

/* ---------- партнёрка (лендинг) ---------- */
.earn-offer { gap: var(--wx-gap); margin-top: 0; }
.earn-offer article { border-radius: var(--wx-radius); padding: 30px 22px; min-height: 240px; transition: transform .35s var(--wx-ease), border-color .3s, box-shadow .35s; }
.dial b { font-family: var(--wx-head); font-weight: 700; font-size: 22px; letter-spacing: -.02em; }
.dial-sum { display: flex !important; align-items: center; justify-content: center; gap: .18em; font-size: 18px !important; letter-spacing: -.01em; white-space: nowrap; }
.dial-sum span { font-size: .8em; font-weight: 600; }
.is-mobile .dial-sum { font-size: 16px !important; }
.earn-offer article > span { color: var(--wx-muted); font-weight: 600; }

/* ---------- шаги ---------- */
.steps { gap: var(--wx-gap); counter-reset: none; }
.steps li {
  position: relative;
  gap: 0; border-radius: var(--wx-radius); padding: clamp(22px, 2.2vw, 30px);
  background:
    linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 85%, transparent), transparent) top / 70% 1px no-repeat,
    radial-gradient(260px 160px at 0% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%),
    var(--wx-surface);
  border-color: color-mix(in srgb, var(--accent) 18%, rgba(255, 255, 255, .06));
  transition: transform .35s var(--wx-ease), border-color .3s, box-shadow .35s;
}
.step-ico {
  position: relative; isolation: isolate; overflow: visible;
  display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; border: 0;
  color: color-mix(in srgb, var(--accent) 46%, #fff);
  background:
    radial-gradient(95% 75% at 50% 115%, color-mix(in srgb, var(--accent) 58%, transparent), transparent 72%),
    radial-gradient(70% 55% at 28% 0%, rgba(255, 255, 255, .14), transparent 62%),
    linear-gradient(165deg, #211a52, #0c0922 78%);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--accent) 32%, rgba(255, 255, 255, .06)),
    inset 0 1px 0 rgba(255, 255, 255, .2),
    0 14px 30px -10px color-mix(in srgb, var(--accent) 60%, transparent);
}
.step-ico::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; pointer-events: none;
  background: conic-gradient(from var(--fi-a, 0deg), transparent 0 64%, color-mix(in srgb, var(--accent) 85%, transparent) 82%, #fff 89%, transparent 95%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: fiSweep 6s linear infinite;
}
.steps li:nth-child(2) .step-ico::after { animation-delay: -2s; }
.steps li:nth-child(3) .step-ico::after { animation-delay: -4s; }
.step-ico svg {
  width: 32px; height: 32px; overflow: visible;
  filter: drop-shadow(0 0 5px color-mix(in srgb, var(--accent) 80%, transparent));
  transition: transform .4s var(--wx-ease);
}
.step-ico .fi-line { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.step-ico .fi-fill { fill: color-mix(in srgb, var(--accent) 34%, transparent); stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.step-ico .fi-dot { fill: #fff; }
.steps li:hover .step-ico svg { transform: scale(1.12); }
.step-num {
  position: absolute; top: 24px; right: 22px;
  padding: 5px 9px; border-radius: 9px;
  font-family: var(--wx-head); font-weight: 700; font-size: 13px; line-height: 1; letter-spacing: .12em;
  font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, var(--accent) 55%, #fff);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 34%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
  pointer-events: none; user-select: none;
}
.steps h3 { margin-top: 22px; font-size: 19px; }
.steps p { margin-top: 8px; color: var(--wx-muted); line-height: 1.55; }
.step-time {
  display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 18px;
  color: color-mix(in srgb, var(--accent) 80%, white); font-size: 13px; font-weight: 600;
}
.step-time::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
@media (min-width: 600px) {
  .steps { gap: 28px; }
  .steps li { overflow: visible; }
  .steps li:nth-child(1) { z-index: 3; }
  .steps li:nth-child(2) { z-index: 2; }
  .steps li:nth-child(3) { z-index: 1; }
  .steps li:hover { z-index: 4; }
  .steps li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -36px;
    z-index: 2;
    width: 44px;
    height: 16px;
    margin-top: -8px;
    pointer-events: none;
    background:
      radial-gradient(circle at 85% 50%, #fff 0 2.4px, transparent 3px) -26px 50% / 26px 8px no-repeat,
      linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 60%, #fff) 85%, transparent 86%) -26px 50% / 26px 3px no-repeat,
      radial-gradient(circle, #fff 0 2px, var(--accent) 2.8px 4.4px, transparent 5.6px) 0 50% / 12px 12px no-repeat,
      radial-gradient(circle, #fff 0 2px, var(--accent) 2.8px 4.4px, transparent 5.6px) 100% 50% / 12px 12px no-repeat,
      repeating-linear-gradient(90deg, color-mix(in srgb, var(--accent) 80%, transparent) 0 4px, transparent 4px 7px) 50% 50% / calc(100% - 16px) 2px no-repeat;
    filter: drop-shadow(0 0 5px var(--accent));
    animation: stepComet 2.4s cubic-bezier(.5, 0, .3, 1) infinite;
  }
  .steps li:nth-child(2)::after { animation-delay: 1.2s; }
}
@keyframes stepComet {
  0% { background-position: -26px 50%, -26px 50%, 0 50%, 100% 50%, 50% 50%; }
  60%, 100% { background-position: 48px 50%, 48px 50%, 0 50%, 100% 50%, 50% 50%; }
}

/* ---------- FAQ ---------- */
.wx-faq { display: grid; gap: 12px; }
.is-desktop .wx-faq { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.wx-faq-item { border-radius: 20px; transition: border-color .25s, background .25s; }
.wx-faq-item[open] { border-color: rgba(255, 193, 74, .32); background: radial-gradient(400px 160px at 0% 0%, rgba(255, 193, 74, .08), transparent 70%), var(--wx-surface); }
.wx-faq-item summary { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; cursor: pointer; list-style: none; font-weight: 800; font-size: 16px; }
.wx-faq-item summary::-webkit-details-marker { display: none; }
.wx-faq-item summary i { position: relative; flex: none; width: 30px; height: 30px; border-radius: 10px; background: rgba(255, 255, 255, .06); transition: background .25s, transform .35s var(--wx-ease); }
.wx-faq-item summary i::before, .wx-faq-item summary i::after { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; border-radius: 2px; background: #fff; transition: transform .35s var(--wx-ease); }
.wx-faq-item summary i::after { transform: rotate(90deg); }
.wx-faq-item[open] summary i { background: linear-gradient(120deg, #ffe08a, #ff9a2e); transform: rotate(180deg); }
.wx-faq-item[open] summary i::before, .wx-faq-item[open] summary i::after { background: #1d1305; }
.wx-faq-item[open] summary i::after { transform: rotate(0); }
.wx-faq-item p { padding: 0 22px 22px; color: var(--wx-muted); line-height: 1.6; animation: wxFaq .35s var(--wx-ease); }
@keyframes wxFaq { from { opacity: 0; transform: translateY(-6px); } }

/* ---------- CTA ---------- */
.cta-strip {
  overflow: hidden; border-radius: 36px; border-color: rgba(255, 193, 74, .28);
  background:
    radial-gradient(700px 360px at 100% 0%, rgba(255, 176, 60, .22), transparent 60%),
    radial-gradient(600px 320px at 0% 100%, rgba(139, 123, 255, .22), transparent 62%),
    linear-gradient(180deg, rgba(20, 18, 44, .9), rgba(8, 9, 22, .92));
}
.cta-strip > *:not(.wx-cta-fx) { position: relative; z-index: 1; }
.cta-strip h2 { font-size: clamp(28px, 3.4vw, 46px); }
.wx-cta-fx { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.wx-cta-fx i { position: absolute; top: -160px; right: -160px; width: 420px; height: 420px; border-radius: 50%; border: 1px dashed rgba(255, 214, 140, .2); animation: spin 40s linear infinite; }
.wx-cta-fx i:nth-child(2) { top: -90px; right: -90px; width: 280px; height: 280px; border-style: solid; border-color: rgba(139, 123, 255, .22); animation-duration: 24s; animation-direction: reverse; }
.wx-cta-fx i:nth-child(3) { top: -34px; right: -34px; width: 110px; height: 110px; border: 0; background: radial-gradient(circle at 35% 30%, #fff3c4, #ffc14d 45%, #ff7a2e 80%); box-shadow: 0 0 60px rgba(255, 170, 70, .5); opacity: .85; animation: wxBob 6s ease-in-out infinite; }
.is-desktop .cta-strip { padding: clamp(36px, 4vw, 60px); }
.is-mobile .wx-cta-fx i { right: -200px; opacity: .6; }
.is-mobile .wx-cta-fx i:nth-child(3) { display: none; }

/* ---------- подвал ---------- */
.wx-foot { display: block; margin-top: var(--wx-section); padding: 48px 0 calc(28px + var(--safe-b)); border-top: 1px solid var(--wx-border); text-align: left; color: var(--wx-dim); }
.wx-foot-grid { display: grid; gap: 32px; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); }
.wx-foot-about p:not(.foot-brand) { max-width: 320px; margin: 14px 0 18px; color: var(--wx-muted); line-height: 1.55; }
.wx-foot .foot-brand { justify-content: flex-start; margin: 0; gap: 12px; }
.wx-foot .foot-brand img { width: 40px; height: 40px; border-radius: 12px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12); }
.wx-foot-col { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.wx-foot-col.foot-links { flex-wrap: nowrap; justify-content: flex-start; }
.wx-foot-col b { margin-bottom: 4px; color: #fff; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.wx-foot-col a { color: var(--wx-muted); font-weight: 600; transition: color .2s, transform .2s; }
.wx-foot-col a:hover { color: #fff; transform: translateX(3px); }
.wx-foot-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 40px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .05); font-size: 13px; }
.wx-foot-up { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--wx-border); color: var(--wx-muted); font-weight: 700; transition: color .2s, border-color .2s; }
.wx-foot-up:hover { color: #fff; border-color: var(--wx-border-hi); }
.wx-foot-up svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 1100px) { .wx-foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .wx-foot-about { grid-column: 1 / -1; } }
@media (max-width: 599px) {
  .wx-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .wx-foot-col.foot-links { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: 12px 20px; }
  .wx-foot-col.foot-links b { width: 100%; }
}
.is-mobile .wx-foot { margin-top: 64px; padding-bottom: calc(96px + var(--safe-b)); }

/* ---------- мобильная панель «Начать» и кнопка наверх ---------- */
.wx-dock {
  position: fixed; left: 12px; right: 12px; bottom: calc(12px + var(--safe-b)); z-index: 45;
  display: none; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 10px 10px 18px; border-radius: 20px;
  background: rgba(12, 13, 30, .82); border: 1px solid var(--wx-border-hi);
  backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
  transform: translateY(calc(100% + 60px + var(--safe-b))); opacity: 0; visibility: hidden; pointer-events: none;
  transition: transform .45s var(--wx-ease), opacity .3s ease, visibility 0s linear .45s;
}
.is-mobile body.wx-guest .wx-dock { display: flex; }
body.wx-dock-on .wx-dock { transform: none; opacity: 1; visibility: visible; pointer-events: auto; transition: transform .45s var(--wx-ease), opacity .3s ease, visibility 0s; }
.is-mobile body.wx-guest::after {
  content: ""; position: fixed; left: 0; right: 0; bottom: 0; z-index: 44; pointer-events: none;
  height: calc(96px + var(--safe-b));
  background: linear-gradient(180deg, rgba(5, 6, 15, 0), #05060f 70%);
  opacity: 0; transition: opacity .35s ease;
}
.is-mobile body.wx-guest.wx-dock-on::after { opacity: 1; }
.wx-dock-txt { min-width: 0; }
.wx-dock-txt b { display: block; font-size: 13px; line-height: 1.25; }
.wx-dock-txt small { display: block; margin-top: 2px; color: var(--wx-muted); font-size: 12px; font-weight: 600; line-height: 1.3; }
.wx-dock .btn { flex: none; height: 44px; padding: 0 22px; }
@media (min-width: 600px) { .wx-dock { left: 50%; right: auto; width: 520px; margin-left: -260px; } }
.wx-totop {
  position: fixed; right: 24px; bottom: 24px; z-index: 44; display: grid; place-items: center;
  width: 46px; height: 46px; border-radius: 14px;
  background: rgba(12, 13, 30, .8); border: 1px solid var(--wx-border-hi); color: #fff;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .3s, transform .35s var(--wx-ease), border-color .2s;
}
.wx-totop svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.wx-totop:hover { border-color: rgba(255, 193, 74, .5); }
.is-desktop body.wx-guest.wx-deep .wx-totop { opacity: 1; transform: none; pointer-events: auto; }
.is-mobile .wx-totop { display: none; }
.is-desktop body.wx-guest.wx-deep.wx-end .wx-totop { opacity: 0; transform: translateY(12px); pointer-events: none; }
.wx-totop::before {
  content: ""; position: absolute; inset: -3px; border-radius: 16px; padding: 2px;
  background: conic-gradient(#ffc14a calc(var(--wx-p, 0) * 360deg), transparent 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  pointer-events: none;
}

/* ---------- фишки: наклон, магнит, искры, счётчики ---------- */
@media (hover: hover) and (pointer: fine) {
  .is-desktop .feature:hover, .is-desktop .plans--guest .plan:hover, .is-desktop .steps li:hover, .is-desktop .earn-offer article:hover {
    transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-4px);
    transition: transform .18s ease-out, border-color .3s, box-shadow .35s;
  }
  .is-desktop .plans--guest .plan.is-best:hover { transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-14px); }
  .hero-cta .btn, .cta-strip .btn, .wx-foot-up { transition: translate .25s var(--wx-ease), transform .2s, box-shadow .25s, background .25s; }
}
.wx-spark {
  position: fixed; z-index: 120; width: 6px; height: 6px; border-radius: 50%;
  pointer-events: none; box-shadow: 0 0 10px rgba(255, 193, 74, .7);
}
.wx-spark--star { width: 9px; height: 9px; border-radius: 2px; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); box-shadow: none; }
.wx-num { font-variant-numeric: tabular-nums; }

/* ---------- фишки для телефона ---------- */
.sky-stars, .sky-stars--near { scale: none; }

.is-mobile .hero-art { touch-action: pan-y; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.is-mobile .hero-art img { transition: transform .7s cubic-bezier(.2, 1.5, .4, 1); }
.is-mobile .hero-art.wx-held img { transition: transform .08s linear; }
.hero-art.wx-flip img { animation: wxFlip .9s cubic-bezier(.3, .9, .3, 1); }
@keyframes wxFlip {
  0% { transform: rotateY(0) scale(1); }
  45% { transform: rotateY(200deg) scale(1.1) translateY(-12px); }
  100% { transform: rotateY(360deg) scale(1); }
}

.is-mobile :is(.feature, .plan, .steps li, .earn-offer article, .wx-faq-item, .card) { transition: scale .25s var(--wx-ease), border-color .3s, box-shadow .3s; }
.is-mobile :is(.feature, .plan, .steps li, .earn-offer article, .wx-faq-item, .card).wx-touch { scale: .985; }
.wx-touch::before { opacity: 1 !important; transition: opacity .1s; }

.wx-dots { display: none; }
@media (max-width: 599px) {
  .is-mobile .plans--guest {
    display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain;
    margin-inline: calc(-1 * var(--wx-pad)); padding: 22px var(--wx-pad) 10px;
    scroll-snap-type: x mandatory; scroll-padding-inline: var(--wx-pad);
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .is-mobile .plans--guest::-webkit-scrollbar { display: none; }
  .is-mobile .plans--guest .plan {
    flex: 0 0 86%; scroll-snap-align: center; scroll-snap-stop: always;
    opacity: .42; transform: scale(.9);
    transition: transform .55s cubic-bezier(.22, .8, .28, 1), opacity .55s ease, border-color .3s;
  }
  .is-mobile .plans--guest .plan.is-center { opacity: 1; transform: scale(1); }
  .is-mobile .plans--guest .plan.is-center.wx-touch { transform: scale(.985); }
  .is-mobile .wx-dots { display: flex; justify-content: center; gap: 8px; margin: 6px 0 18px; }
  .is-mobile .wx-dots i { width: 7px; height: 7px; border-radius: 99px; background: rgba(255, 255, 255, .2); transition: width .35s var(--wx-ease), background .3s; cursor: pointer; }
  .is-mobile .wx-dots i.is-on { width: 24px; background: linear-gradient(90deg, #ffe08a, #ff9a2e); box-shadow: 0 0 12px rgba(255, 170, 70, .5); }
}

.wx-dock.wx-dock { box-shadow: 0 18px 40px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 214, 140, .14), 0 0 32px rgba(255, 170, 70, .12); }

.is-mobile .tabbar button { z-index: 1; }
.is-mobile .tabbar button.wx-pop svg { animation: wxPop .5s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes wxPop { 0% { scale: 1; } 35% { scale: .78; } 70% { scale: 1.16; } 100% { scale: 1; } }
.hero-facts b .wx-num { color: inherit; font-size: inherit; font-weight: inherit; }
.wx-kicker { white-space: nowrap; }

/* ---------- страница входа /login /register ---------- */
body.is-authpage .sky,
body.is-authpage .wx-spot,
body.is-authpage .top,
body.is-authpage .wx-dock,
body.is-authpage .wx-totop,
body.is-authpage #guest { display: none !important; }
body.is-authpage { background: #05060f; overflow: hidden; }
body.is-authpage main { max-width: none; padding: 0; }
#auth-page.ap {
  position: fixed; inset: 0; z-index: 30; overflow-x: hidden; overflow-y: auto;
  display: flex; flex-direction: column; min-height: 100%;
  padding: 0 0 40px; background: #05060f; color: #f1f2ff;
  font-family: "Manrope", system-ui, sans-serif;
  scrollbar-width: thin; scrollbar-color: #34f5c5 transparent;
}
body.is-authpage #auth-page::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
body.is-authpage #auth-page::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
body.is-authpage #auth-page::-webkit-scrollbar-track,
body.is-authpage #auth-page::-webkit-scrollbar-track-piece,
body.is-authpage #auth-page::-webkit-scrollbar-corner { background: transparent; border: 0; }
body.is-authpage #auth-page::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #a78bfa, #22d3ee 55%, #34f5c5);
  border-radius: 999px; border: 2px solid transparent; background-clip: padding-box;
}
#auth-page[hidden] { display: none !important; }
#auth-page .ap-bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
#auth-page .ap-aurora { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .55; animation: apDrift 26s ease-in-out infinite alternate; }
#auth-page .ap-aurora--a { width: 62vw; height: 62vw; left: -18vw; top: -28vw; background: radial-gradient(circle, rgba(124, 58, 237, .7), transparent 65%); }
#auth-page .ap-aurora--b { width: 48vw; height: 48vw; right: -16vw; top: 8vh; background: radial-gradient(circle, rgba(34, 211, 238, .4), transparent 65%); animation-delay: -9s; }
#auth-page .ap-aurora--c { width: 40vw; height: 40vw; left: 20vw; bottom: -24vw; background: radial-gradient(circle, rgba(52, 245, 197, .22), transparent 65%); animation-delay: -16s; }
#auth-page .ap-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(150, 160, 255, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(150, 160, 255, .06) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 20%, #000 15%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 20%, #000 15%, transparent 75%);
}
#auth-page .ap-top, #auth-page .ap-wrap { position: relative; z-index: 1; }
#auth-page .ap-top {
  display: flex; align-items: center; gap: 18px;
  width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 18px 0;
}
#auth-page .ap-brand { display: inline-flex; align-items: center; gap: 10px; font-family: "Unbounded", "Manrope", sans-serif; font-weight: 600; font-size: 18px; color: #fff; }
#auth-page .brand-mark { width: 34px; height: 34px; object-fit: contain; filter: drop-shadow(0 0 10px rgba(139, 92, 246, .55)); }
#auth-page .ap-brand .brand-mark { transform: translateY(-3px); }
#auth-page .ap-brand b { font-weight: 800; background: linear-gradient(100deg, #a78bfa, #22d3ee 60%, #34f5c5); -webkit-background-clip: text; background-clip: text; color: transparent; }
#auth-page .ap-status { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; color: #8d92b8; font-size: 13px; font-weight: 600; }
#auth-page .ap-status i { width: 8px; height: 8px; border-radius: 50%; background: #34f5c5; box-shadow: 0 0 0 0 rgba(52, 245, 197, .6); animation: apPing 2s infinite; }
@keyframes apPing { 70% { box-shadow: 0 0 0 8px rgba(52, 245, 197, 0); } 100% { box-shadow: 0 0 0 0 rgba(52, 245, 197, 0); } }
#auth-page .ap-wrap {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 48px; align-items: center;
  width: min(1120px, calc(100% - 40px)); margin: auto; padding: 24px 0 10px;
}
#auth-page .ap-side { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; max-width: 560px; animation: apIn .7s cubic-bezier(.2, .8, .2, 1) both; }
#auth-page .ap-stage { order: 3; display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 520px; gap: 18px; }
#auth-page .ap-eye {
  order: 0; align-self: center;
  display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 7px 14px 7px 8px; border-radius: 999px;
  background: rgba(255, 255, 255, .04); border: 1px solid rgba(160, 170, 255, .26);
  color: #c6c9e6; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
#auth-page .ap-eye img { width: 22px; height: 22px; border-radius: 50%; }
#auth-page .ap-title {
  order: 1; width: 100%; margin: 0;
  font-family: "Unbounded", "Manrope", sans-serif;
  font-size: clamp(24px, 3.1vw, 36px); font-weight: 800; letter-spacing: -.035em; line-height: 1.05;
  text-align: left; white-space: nowrap;
  background: none; background-clip: border-box; -webkit-background-clip: border-box;
  -webkit-text-fill-color: #fff; color: #fff;
}
#auth-page .ap-title span {
  background: linear-gradient(100deg, #a78bfa, #60a5fa 40%, #22d3ee 70%, #34f5c5);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
#auth-page .ap-lead { order: 2; max-width: 460px; margin: 0; color: #c6c9e6; font-size: 17px; line-height: 1.6; text-align: left; }
#auth-page .ap-lead--mob { display: none; }
#auth-page .ap-perks { order: 5; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin: 8px 0 0; padding: 0; list-style: none; width: 100%; max-width: 520px; }
#auth-page .ap-perks li {
  display: flex; align-items: center; gap: 8px; max-width: none; padding: 0; border: 0; background: none;
  color: #c6c9e6; font-size: 14.5px; font-weight: 600; text-align: left; animation: none;
}
#auth-page .ap-perks svg { width: 18px; height: 18px; padding: 3px; border-radius: 50%; color: #07081a; background: #34f5c5; flex: none; }
#auth-page .ap-card {
  width: 100%; max-width: 460px; justify-self: end; padding: 28px;
  border-radius: 28px; border: 1px solid rgba(160, 170, 255, .2);
  background: linear-gradient(180deg, rgba(22, 24, 52, .82), rgba(10, 12, 28, .88));
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  animation: apCard .7s cubic-bezier(.2, .8, .2, 1) both;
}
#auth-page .ap-card::before, #auth-page .ap-card::after { display: none; }
#auth-page .ap-card-head { justify-content: center; gap: 10px; margin-bottom: 18px; }
#auth-page .ap-logo { width: 34px; height: 34px; border-radius: 0; box-shadow: none; animation: none; transform: translateY(-3px); }
#auth-page .ap-name { font: 600 18px/1 "Unbounded", "Manrope", sans-serif; color: #fff; }
#auth-page .ap-name b { font-weight: 800; background: linear-gradient(100deg, #a78bfa, #22d3ee 60%, #34f5c5); -webkit-background-clip: text; background-clip: text; color: transparent; }
#auth-page .auth-tabs, #auth-page .seg {
  background: rgba(4, 6, 18, .6); border: 1px solid rgba(160, 170, 255, .16); border-radius: 16px;
}
#auth-page .auth-tabs::before, #auth-page .seg::before {
  background: linear-gradient(100deg, #c4b5fd, #7dd3fc 50%, #5eead4);
  box-shadow: 0 8px 18px rgba(34, 211, 238, .28);
}
#auth-page .auth-tabs button.is-on, #auth-page .seg button.is-on { color: #07081a; font-weight: 700; }
#auth-page .seg { width: 100%; }
#auth-page .seg button { height: 40px; }
#auth-page .field { background: rgba(255, 255, 255, .04); border-color: rgba(160, 170, 255, .18); border-radius: 16px; }
#auth-page .field:focus-within { border-color: rgba(34, 211, 238, .7); box-shadow: 0 0 0 4px rgba(34, 211, 238, .12); }
#auth-page .code-box { background: rgba(34, 211, 238, .06); border-color: rgba(34, 211, 238, .22); }
#auth-page .code-input { background: rgba(4, 6, 18, .55); border-color: rgba(160, 170, 255, .2); font-family: "Unbounded", "Manrope", sans-serif; }
#auth-page .code-input:focus { border-color: #22d3ee; }
#auth-page .btn--gold {
  height: 54px; border: 0; border-radius: 16px; color: #07081a; font-weight: 800;
  background: linear-gradient(100deg, #c4b5fd, #7dd3fc 45%, #5eead4);
  box-shadow: 0 10px 28px rgba(99, 102, 241, .35);
}
#auth-page .btn--gold:hover { filter: brightness(1.05); }
#auth-page .auth-gift { color: #8d92b8; }
#auth-page .auth-gift svg { color: #34f5c5; }
#auth-page .ap-legal { color: #6f7497; }
#auth-page .ap-legal a { color: #a2a7c7; }
#auth-page .ap-back { color: #8d92b8; font-weight: 700; }
#auth-page .ap-back:hover { color: #fff; }
#auth-page .ap-flow {
  order: 0;
  position: relative; isolation: isolate; overflow: hidden;
  width: 100%; max-width: 520px; padding: 20px 22px 16px; border-radius: 26px;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(124, 58, 237, .26), transparent 60%),
    radial-gradient(80% 80% at 100% 100%, rgba(52, 245, 197, .12), transparent 60%),
    linear-gradient(160deg, rgba(22, 24, 56, .78), rgba(8, 10, 26, .82));
  border: 1px solid rgba(167, 139, 250, .26);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .07);
}
#auth-page .ap-flow::before {
  content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: 260px; height: 120px; margin: -78px 0 0 -130px;
  border-radius: 50%; background: radial-gradient(closest-side, rgba(34, 211, 238, .28), transparent);
  animation: apBreath 4.8s ease-in-out infinite;
}
#auth-page .ap-flow-row { position: relative; display: grid; grid-template-columns: 58px minmax(0, 1fr) 58px; align-items: center; gap: 14px; }
#auth-page .ap-node {
  position: relative; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; color: #fff;
  background: linear-gradient(150deg, #8b5cf6, #4f46e5 55%, #312e81);
  box-shadow: 0 10px 26px rgba(99, 102, 241, .45), inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -8px 16px rgba(15, 12, 41, .35);
}
#auth-page .ap-node svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#auth-page .ap-node--world {
  border-radius: 50%; color: #04201a;
  background: radial-gradient(circle at 32% 28%, #b9fbe9, #34f5c5 45%, #0ea5a4);
  box-shadow: 0 10px 28px rgba(52, 245, 197, .4), inset 0 1px 0 rgba(255, 255, 255, .5);
}
#auth-page .ap-node--world svg { stroke-width: 1.9; }
#auth-page .ap-orbit { position: absolute; inset: -7px; border-radius: 50%; border: 1px dashed rgba(52, 245, 197, .35); animation: apSpin 7s linear infinite; }
#auth-page .ap-orbit::before { content: ""; position: absolute; top: -4px; left: 50%; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; background: #fff; box-shadow: 0 0 10px #34f5c5, 0 0 3px #fff; }
#auth-page .ap-tube {
  position: relative; height: 4px; border-radius: 999px; overflow: clip; overflow-clip-margin: 4px;
  background: linear-gradient(90deg, rgba(139, 92, 246, .45), rgba(34, 211, 238, .45), rgba(52, 245, 197, .45));
}
#auth-page .ap-beam {
  position: absolute; inset: 0; border-radius: inherit;
  background: linear-gradient(90deg, transparent 0 30%, rgba(255, 255, 255, .85) 50%, transparent 70% 100%) 0 0 / 300% 100% no-repeat;
  animation: apBeam 2.8s linear infinite; opacity: .55;
}
#auth-page .ap-tube i { position: absolute; inset: 0; animation: apPacket 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }
#auth-page .ap-tube i::before {
  content: ""; position: absolute; top: -2px; left: -30px; width: 30px; height: 8px; border-radius: 999px;
  background: linear-gradient(90deg, transparent, #c4b5fd); box-shadow: 6px 0 12px rgba(167, 139, 250, .8);
}
#auth-page .ap-tube i:nth-child(3) { animation-delay: -.8s; }
#auth-page .ap-tube i:nth-child(3)::before { background: linear-gradient(90deg, transparent, #7dd3fc); box-shadow: 6px 0 12px rgba(34, 211, 238, .8); }
#auth-page .ap-tube i:nth-child(4) { animation-delay: -1.6s; }
#auth-page .ap-tube i:nth-child(4)::before { background: linear-gradient(90deg, transparent, #5eead4); box-shadow: 6px 0 12px rgba(52, 245, 197, .8); }
#auth-page .ap-lock {
  position: absolute; z-index: 1; left: 50%; top: 50%; display: grid; place-items: center; width: 44px; height: 44px; margin: -22px 0 0 -22px;
  border-radius: 50%; color: #e0f7ff; isolation: isolate; pointer-events: none;
  box-shadow: 0 0 24px rgba(34, 211, 238, .45);
}
#auth-page .ap-lock::before {
  content: ""; position: absolute; z-index: -2; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, #a78bfa, #22d3ee, #34f5c5, rgba(52, 245, 197, 0) 70%, #a78bfa);
  animation: apSpin 3s linear infinite;
}
#auth-page .ap-lock::after { content: ""; position: absolute; z-index: -1; inset: 2px; border-radius: 50%; background: radial-gradient(circle at 40% 30%, #1d2257, #0a0c24); }
#auth-page .ap-lock svg { width: 18px; height: 18px; }
#auth-page .ap-flow-meta {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin-top: 14px;
  color: #8d92b8; font-size: 12.5px; font-weight: 600; white-space: nowrap;
}
#auth-page .ap-flow-meta > span:first-child { justify-self: start; }
#auth-page .ap-flow-ok {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
  color: #b9fbe9; background: rgba(52, 245, 197, .1); border: 1px solid rgba(52, 245, 197, .25);
}
#auth-page .ap-flow-ok i { width: 6px; height: 6px; border-radius: 50%; background: #34f5c5; box-shadow: 0 0 8px #34f5c5; animation: apPing 2s infinite; }
#auth-page .ap-flow-land { position: relative; justify-self: end; width: 124px; height: 16px; overflow: hidden; }
#auth-page .ap-flow-land b { position: absolute; right: 0; top: 0; display: inline-flex; align-items: center; gap: 6px; height: 16px; color: #fff; font-weight: 700; line-height: 16px; opacity: 0; animation: apLand 12s infinite; }
#auth-page .ap-flow-land i { flex: none; width: 16px; height: 11px; border-radius: 2px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28); background: center / cover no-repeat; }
#auth-page .ap-flow-land i[data-f="FI"] { background-image: url("/site/assets/flags/fi.png"); }
#auth-page .ap-flow-land i[data-f="DE"] { background-image: url("/site/assets/flags/de.png"); }
#auth-page .ap-flow-land i[data-f="NL"] { background-image: url("/site/assets/flags/nl.png"); }
#auth-page .ap-flow-land i[data-f="LV"] { background-image: url("/site/assets/flags/lv.png"); }
#auth-page .ap-flow-land b:nth-child(2) { animation-delay: 3s; }
#auth-page .ap-flow-land b:nth-child(3) { animation-delay: 6s; }
#auth-page .ap-flow-land b:nth-child(4) { animation-delay: 9s; }
@keyframes apSpin { to { transform: rotate(360deg); } }
@keyframes apBreath { 50% { opacity: .45; transform: scale(.85); } }
@keyframes apBeam { from { background-position: 100% 0; } to { background-position: 0 0; } }
@keyframes apPacket { 0% { transform: translateX(0); opacity: 0; } 15%, 85% { opacity: 1; } 100% { transform: translateX(100%); opacity: 0; } }
@keyframes apLand { 0% { opacity: 0; transform: translateY(100%); } 4%, 22% { opacity: 1; transform: none; } 26%, 100% { opacity: 0; transform: translateY(-100%); } }
@media (prefers-reduced-motion: reduce) {
  #auth-page .ap-flow::before, #auth-page .ap-orbit, #auth-page .ap-beam, #auth-page .ap-tube i, #auth-page .ap-lock::before, #auth-page .ap-flow-ok i { animation: none; }
  #auth-page .ap-flow-land b { animation: none; }
  #auth-page .ap-flow-land b:first-child { opacity: 1; }
}
body.is-authpage .wx-dock, body.is-authpage::after { display: none !important; }
@media (max-width: 900px) {
  #auth-page.ap { padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  #auth-page .ap-top { width: calc(100% - 32px); padding: max(14px, env(safe-area-inset-top, 0px)) 0 6px; }
  #auth-page .ap-status { display: none; }
  #auth-page .ap-aurora { filter: blur(60px); animation: none; }
  #auth-page .ap-wrap { display: flex; flex-direction: column; align-items: stretch; gap: 14px; width: calc(100% - 32px); margin: 0 auto; padding-top: 6px; }
  #auth-page .ap-side { display: contents; }
  #auth-page .ap-title { order: 1; grid-column: auto; font-size: clamp(22px, 6.4vw, 32px); text-align: center; white-space: nowrap; }
  #auth-page .ap-lead--desk { display: none; }
  #auth-page .ap-lead--mob { display: block; order: 2; max-width: none; font-size: 15px; line-height: 1.5; text-align: center; }
  #auth-page .ap-stage { order: 3; max-width: none; gap: 14px; }
  #auth-page .ap-flow { order: 0; max-width: none; margin: 0; padding: 14px 14px 12px; border-radius: 22px; }
  #auth-page .ap-eye { order: 0; align-self: center; }
  #auth-page .ap-card { order: 5; justify-self: stretch; max-width: none; margin-top: 4px; padding: 20px 16px; border-radius: 24px; }
  #auth-page .ap-perks { order: 6; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; max-width: none; margin: 4px 0 0; }
  #auth-page .ap-perks li { align-items: center; font-size: 13.5px; line-height: 1.35; }
  #auth-page .ap-flow-row { grid-template-columns: 46px minmax(0, 1fr) 46px; gap: 12px; }
  #auth-page .ap-node { width: 46px; height: 46px; border-radius: 15px; }
  #auth-page .ap-node--world { border-radius: 50%; }
  #auth-page .ap-node svg { width: 21px; height: 21px; }
  #auth-page .ap-orbit { inset: -5px; }
  #auth-page .ap-lock { width: 38px; height: 38px; margin: -19px 0 0 -19px; }
  #auth-page .ap-lock svg { width: 16px; height: 16px; }
  #auth-page .ap-flow-meta { gap: 6px; margin-top: 12px; font-size: 11.5px; }
  #auth-page .ap-flow-ok { padding: 3px 8px; }
  #auth-page .ap-flow-land { width: 48px; }
  #auth-page .ap-flow-land b { font-size: 0; gap: 0; }
  #auth-page .ap-flow-land i {
    display: inline-flex; align-items: center; width: auto; height: 16px;
    padding-left: 20px; background-repeat: no-repeat; background-position: left center; background-size: 14px 10px;
    font-size: 12px; font-weight: 800; line-height: 16px; letter-spacing: .04em; color: #fff;
  }
  #auth-page .ap-flow-land i::after { content: attr(data-f); }
  #auth-page .ap-card-head { margin-bottom: 14px; }
}
@media (max-width: 360px) {
  #auth-page .ap-perks { grid-template-columns: 1fr; }
}
@media (max-width: 350px) {
  #auth-page .ap-flow-meta > span:first-child { display: none; }
  #auth-page .ap-flow-ok { grid-column: 2; }
  #auth-page .ap-flow-land { grid-column: 3; }
}
.field:has(input:-webkit-autofill) {
  border-color: rgba(196, 181, 253, .45);
  background: #14122c;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}
.field input:-webkit-autofill,
.field input:-webkit-autofill:hover,
.field input:-webkit-autofill:focus,
.field input:autofill {
  -webkit-text-fill-color: #f4f5ff;
  caret-color: #f4f5ff;
  border-radius: 10px;
  box-shadow: 0 0 0 1000px #14122c inset;
  transition: background-color 99999s ease-out;
}
.ap-card .btn--gold,
.ap-card .btn--gold:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7); }
.ap-title { font-family: var(--wx-head); letter-spacing: -.035em; }
.ap-perks li { background: rgba(255, 255, 255, .035); border-color: var(--wx-border); }

/* ============ Кабинет ============ */
.card {
  position: relative; isolation: isolate; overflow: hidden;
  border-radius: var(--wx-radius);
  background: var(--wx-surface);
  border: 1px solid var(--wx-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
@media (hover: hover) { .card:hover { border-color: var(--wx-border-hi); } }
.pane-head h2 { font-size: clamp(26px, 2.6vw, 36px); letter-spacing: -.03em; }
.pane-head p { color: var(--wx-muted); }
.balance-num, .ring-num b { font-family: var(--wx-head); letter-spacing: -.04em; }
.ring-num b { font-weight: 700; }

.wx-bar { display: none; }
.is-desktop .wx-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-bottom: 22px; padding: 0 2px;
}
.wx-crumbs { display: flex; align-items: center; gap: 8px; color: var(--wx-dim); font-size: 13px; font-weight: 700; }
.wx-crumbs svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.wx-crumbs b { color: #fff; }
.wx-cmd-btn {
  display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px 0 14px; border-radius: 12px;
  background: rgba(255, 255, 255, .04); border: 1px solid var(--wx-border); color: var(--wx-muted); font-size: 13.5px; font-weight: 700;
  transition: border-color .2s, background .2s, color .2s;
}
.wx-cmd-btn:hover { color: #fff; border-color: var(--wx-border-hi); background: rgba(255, 255, 255, .07); }
.wx-cmd-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
kbd { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 7px; background: rgba(255, 255, 255, .07); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08), 0 0 0 1px rgba(255, 255, 255, .08); color: #d9dcf5; font: 700 11.5px/1 var(--font); }

.is-desktop .app { grid-template-columns: 252px minmax(0, 1fr); gap: clamp(20px, 2.4vw, 36px); }
.is-desktop .side {
  top: 96px; min-height: calc(100vh - 120px); padding: 12px;
  border-radius: 24px; background: rgba(12, 13, 30, .55); border: 1px solid var(--wx-border);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.is-desktop .side-nav { gap: 2px; }
.is-desktop .side-nav::before { content: "Навигация"; display: block; padding: 8px 12px 10px; color: var(--wx-dim); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.is-desktop .side-nav button { position: relative; height: 46px; border-radius: 13px; font-size: 14.5px; }
.is-desktop .side-nav button:hover { background: rgba(255, 255, 255, .05); }
.is-desktop .side-nav button.is-on { background: linear-gradient(90deg, rgba(255, 193, 74, .14), rgba(255, 255, 255, .03)); box-shadow: inset 0 0 0 1px rgba(255, 193, 74, .2); }
.is-desktop .side-nav button.is-on::before { content: ""; position: absolute; left: -12px; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: #ffc14a; box-shadow: 0 0 12px #ffc14a; }
.side-card {
  position: relative; overflow: hidden; padding: 16px 18px; border-radius: 18px;
  background: radial-gradient(240px 120px at 100% 0%, rgba(255, 193, 74, .2), transparent 70%), rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 193, 74, .22);
  transition: border-color .2s, transform .25s var(--wx-ease);
}
.side-card:hover { transform: translateY(-2px); border-color: rgba(255, 193, 74, .45); }
.side-card b { font-family: var(--wx-head); font-weight: 700; letter-spacing: -.03em; }
.side-exit { border-radius: 12px; }
@media (max-width: 1100px) { .is-desktop .app { grid-template-columns: 210px minmax(0, 1fr); } }

/* кабинет: раскладки панелей под ширину сайта */
.is-desktop .grid--home { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
@media (max-width: 1100px) { .is-desktop .grid--home { grid-template-columns: minmax(0, 1fr); } }

.is-desktop #pane-partner .earn-screen { max-width: none; }
@media (min-width: 1100px) {
  .is-desktop #pane-partner .earn-screen { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
  .is-desktop #pane-partner .earn-screen > * { margin: 0 !important; min-width: 0; }
  .is-desktop #pane-partner .earn-screen > .pt-hero { grid-column: 1; grid-row: 1; }
  .is-desktop #pane-partner .earn-screen > .pt-invite { grid-column: 2; grid-row: 1; align-self: stretch; }
  .is-desktop #pane-partner .earn-screen > .pt-how { grid-column: 1; grid-row: 2 / span 2; }
  .is-desktop #pane-partner .earn-screen > .pt-stats { grid-column: 2; grid-row: 2; }
  .is-desktop #pane-partner .earn-screen > .pt-chart { grid-column: 2; grid-row: 3; }
  .is-desktop #pane-partner .earn-screen > :nth-child(n+6) { grid-column: 1 / -1; }
}
#pane-partner .pt-hero, #pane-partner .pt-invite, #pane-partner .pt-how, #pane-partner .pt-chart, #pane-partner .pt-stats {
  border-color: var(--wx-border); border-radius: var(--wx-radius);
  background: var(--wx-surface);
}
#pane-partner .pt-hero {
  border-color: rgba(255, 193, 74, .26);
  background: radial-gradient(320px 180px at 100% 0%, rgba(255, 193, 74, .18), transparent 70%), radial-gradient(260px 160px at 0% 100%, rgba(139, 123, 255, .16), transparent 70%), var(--wx-surface);
}
.pt-hero-sum { font-family: var(--wx-head) !important; letter-spacing: -.04em; }

.is-desktop #pane-plans .shop { max-width: 980px; }
.is-desktop #pane-help.help-screen { column-gap: 18px; }
@media (max-width: 1180px) { .is-desktop #pane-help.help-screen { columns: auto; } }
#pane-help {
  --hp-card: var(--wx-surface);
}
#pane-help .hp-hero {
  border-color: rgba(111, 227, 255, .22);
  background:
    radial-gradient(420px 220px at 100% 0%, rgba(111, 227, 255, .16), transparent 70%),
    radial-gradient(360px 200px at 0% 100%, rgba(139, 123, 255, .16), transparent 70%),
    var(--wx-surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}
#pane-help .hp-card { border-color: var(--wx-border); border-radius: var(--wx-radius); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05); }
#pane-help .hp-card-h b { font-family: var(--font); font-weight: 800; font-size: 17px; }
#pane-help .hp-search { border-color: var(--wx-border-hi); background: rgba(12, 13, 30, .85); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
#pane-help .hp-search:focus-within { border-color: rgba(255, 193, 74, .5); box-shadow: 0 0 0 4px rgba(255, 193, 74, .1); }
#pane-help .hp-search-x { background: rgba(255, 255, 255, .08); }
#pane-help .hp-chip { border-color: var(--wx-border); background: rgba(255, 255, 255, .04); }
#pane-help .hp-chip:hover { background: rgba(255, 255, 255, .08); }
#pane-help .hp-chip-ico { background: rgba(111, 227, 255, .12); }
#pane-help .hp-dev-tabs { background: rgba(0, 0, 0, .25); box-shadow: inset 0 0 0 1px var(--wx-border); }
#pane-help .hp-item { border-color: var(--wx-border); background: rgba(255, 255, 255, .03); }
#pane-help .hp-item:hover { border-color: var(--wx-border-hi); }
#pane-help .hp-item[open] { border-color: rgba(255, 193, 74, .3); background: rgba(255, 193, 74, .05); }
#pane-help .hp-ico { background: rgba(255, 255, 255, .05); }
#pane-help .hp-item[open] .hp-ico { background: rgba(255, 193, 74, .14); }
#pane-help .hp-cta { border-color: rgba(111, 227, 255, .22); background: radial-gradient(300px 120px at 0% 50%, rgba(111, 227, 255, .12), transparent 70%), var(--wx-surface); }
#pane-help .hp-cta-ico { background: rgba(111, 227, 255, .12); }
#pane-help .hp-empty { background: var(--wx-surface); }
#pane-help .hp-empty-ico { background: rgba(255, 255, 255, .05); }
#pane-help .st-legal-btn { border-color: var(--wx-border); background: rgba(255, 255, 255, .03); transition: border-color .2s, background .2s; }
#pane-help .st-legal-btn:hover { border-color: var(--wx-border-hi); background: rgba(255, 255, 255, .06); }

.is-desktop #pane-connect { max-width: 760px; margin-inline: auto; }

/* мобильный кабинет: плавающий док */
.is-mobile .tabbar {
  background: rgba(10, 11, 26, .82); border-color: var(--wx-border-hi);
  backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .55);
}
.is-mobile .tabbar button { position: relative; color: var(--wx-dim); transition: color .2s; }
@media (max-width: 459px) {
  .is-mobile .tabbar { grid-template-columns: repeat(5, 1fr); padding-inline: 8px; }
  .is-mobile .tabbar button { font-size: 10px; letter-spacing: -.01em; }
}
@media (max-width: 365px) { .is-mobile .tabbar button { font-size: 9px; } .is-mobile .tabbar { padding-inline: 6px; } }
@media (min-width: 600px) {
  .is-mobile .tabbar { left: 50%; right: auto; width: min(720px, calc(100% - 32px)); transform: translateX(-50%); padding: 10px 10px; }
  .is-mobile .tabbar button { font-size: 11.5px; }
  .is-mobile .grid--home { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .is-mobile .grid--home > :first-child { grid-column: 1 / -1; }
  .is-mobile .grid--home .span-2 { grid-column: 1 / -1; }
  .is-mobile .card { padding: 22px; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .is-mobile .plans--guest { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .is-mobile .earn-offer { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .is-mobile .wx-faq { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .is-mobile .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .is-mobile .hero-art { width: 260px; }
  .is-mobile .hero-art img { max-width: 260px; }
}

/* ---------- палитра быстрых действий ---------- */
.wx-cmd { position: fixed; inset: 0; z-index: 95; display: grid; justify-items: center; align-items: start; padding: 14vh 16px 16px; }
.wx-cmd-back { position: absolute; inset: 0; background: rgba(3, 4, 12, .62); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); animation: fade .2s ease; }
.wx-cmd-card {
  position: relative; width: min(600px, 100%); overflow: hidden; border-radius: 22px;
  background: linear-gradient(180deg, rgba(20, 21, 44, .97), rgba(10, 11, 26, .98));
  border: 1px solid var(--wx-border-hi); box-shadow: 0 40px 100px rgba(0, 0, 0, .6);
  animation: wxCmdIn .3s var(--wx-ease);
}
@keyframes wxCmdIn { from { opacity: 0; transform: translateY(-12px) scale(.98); } }
.wx-cmd-field { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--wx-border); }
.wx-cmd-field svg { width: 20px; height: 20px; fill: none; stroke: var(--wx-muted); stroke-width: 2; stroke-linecap: round; }
.wx-cmd-field input { flex: 1; min-width: 0; height: 30px; background: none; border: 0; outline: 0; font-size: 16px; font-weight: 600; }
.wx-cmd-field input::placeholder { color: var(--wx-dim); }
.wx-cmd-field input::-webkit-search-cancel-button { display: none; }
.wx-cmd-list { max-height: min(52vh, 420px); overflow: auto; padding: 8px; }
.wx-cmd-group { padding: 10px 12px 6px; color: var(--wx-dim); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.wx-cmd-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 12px; border-radius: 12px; color: #e3e5ff; font-weight: 700; text-align: left; }
.wx-cmd-item svg { width: 20px; height: 20px; color: var(--wx-muted); }
.wx-cmd-item small { margin-left: auto; color: var(--wx-dim); font-size: 12px; font-weight: 600; }
.wx-cmd-item.is-on { background: rgba(255, 193, 74, .12); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 193, 74, .25); }
.wx-cmd-item.is-on svg { color: #ffc14a; }
.wx-cmd-empty { padding: 26px; color: var(--wx-dim); text-align: center; font-weight: 600; }
.wx-cmd-foot { display: flex; gap: 18px; padding: 10px 16px; border-top: 1px solid var(--wx-border); color: var(--wx-dim); font-size: 12px; font-weight: 600; }
.wx-cmd-foot span { display: inline-flex; align-items: center; gap: 5px; }
.wx-cmd-foot kbd { min-width: 20px; height: 20px; padding: 0 5px; font-size: 11px; }
body.wx-cmd-open { overflow: hidden; }

/* ---------- окна ---------- */
.layer-card, .pay-card { background: linear-gradient(180deg, rgba(20, 21, 44, .98), rgba(9, 10, 24, .99)); border-color: var(--wx-border-hi); }
.is-desktop .layer-card {
  width: min(420px, calc(100% - 32px));
  max-height: none;
  overflow: visible;
  padding: 28px;
  border-radius: 28px;
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, #14152c, #0a0b1a) padding-box,
    linear-gradient(140deg, rgba(255, 210, 122, .7), rgba(139, 123, 255, .14) 40%, rgba(111, 227, 255, .5)) border-box;
  box-shadow: 0 40px 90px rgba(0, 0, 0, .55);
}
.is-desktop .layer { overflow: hidden; }
.toast { background: rgba(16, 17, 38, .95); border-color: var(--wx-border-hi); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }

html.is-auth-open,
html.is-ios.is-auth-open {
  overflow: hidden !important;
  overscroll-behavior: none;
}
html.is-auth-open body {
  overflow: hidden !important;
  overscroll-behavior: none;
}
.layer { overscroll-behavior: none; }
.layer-card { overscroll-behavior: contain; }

/* Телефон и планшет: как на website. Небо без сплошной заливки, низ Safari не красится плоским цветом. */
@media (max-width: 1180px) {
  html {
    min-height: 100%;
    background: #07051c;
    background-color: #07051c;
    overflow-x: clip;
    overflow-y: auto;
    overscroll-behavior-y: auto;
  }
  body {
    overflow-x: clip;
    overflow-y: visible;
    position: static;
    overscroll-behavior-y: auto;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }
  .sky {
    position: fixed;
    z-index: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: calc(-1 * max(220px, env(safe-area-inset-bottom, 0px) + 160px));
    width: 100%;
    height: auto;
    min-height: calc(100lvh + max(220px, env(safe-area-inset-bottom, 0px) + 160px));
    background-color: transparent;
  }
}

/* ---------- появление блоков при прокрутке ---------- */
.wx-reveal [data-wx-rv]:not(.wx-shown) { opacity: 0; }
.wx-reveal [data-wx-rv="head"]:not(.wx-shown) { opacity: 1; }
.wx-reveal [data-wx-rv="head"]:not(.wx-shown) .wx-w > span { opacity: 0; }
.wx-w { display: inline-block; overflow: hidden; padding: .06em .02em .14em; margin: -.06em -.02em -.14em; vertical-align: top; }
.wx-w > span { display: inline-block; }
.wx-shown[data-wx-rv="head"] .wx-w > span { animation: wxWord .9s cubic-bezier(.2, .9, .25, 1) backwards; animation-delay: calc(var(--i) * 70ms); }
.wx-shown[data-wx-rv="kicker"] { animation: wxKicker .7s cubic-bezier(.2, .9, .3, 1.2) backwards; }
.wx-shown[data-wx-rv="lead"] { animation: wxRise .8s cubic-bezier(.2, .9, .3, 1) backwards; animation-delay: calc(var(--wx-d, 0ms) + 120ms); }
.wx-shown[data-wx-rv="card"] { animation: wxCard .95s cubic-bezier(.16, .9, .3, 1) backwards; animation-delay: calc(var(--wx-d, 0ms) + 80ms); }
.wx-shown[data-wx-rv="faq"] { animation: wxSide .8s cubic-bezier(.2, .9, .3, 1) backwards; animation-delay: calc(var(--wx-d, 0ms) * .6); }
.wx-shown[data-wx-rv="row"] { animation: wxRow .7s cubic-bezier(.2, .9, .3, 1) backwards; animation-delay: calc(var(--wx-d, 0ms) + 200ms); }
.wx-shown[data-wx-rv="panel"] { animation: wxPanel 1s cubic-bezier(.16, .9, .3, 1) backwards; }
.steps > li.wx-shown:not(.wx-done)::after { animation: none; opacity: 0; }
@keyframes wxWord { from { translate: 0 105%; rotate: 4deg; opacity: 0; } 40% { opacity: 1; } }
@keyframes wxKicker { from { opacity: 0; scale: .7; translate: 0 10px; } }
@keyframes wxRise { from { opacity: 0; translate: 0 22px; } }
@keyframes wxCard { from { opacity: 0; translate: 0 56px; scale: .94; } 60% { opacity: 1; } }
@keyframes wxSide { from { opacity: 0; translate: var(--wx-x, -36px) 0; } }
@keyframes wxRow { from { opacity: 0; translate: -28px 0; } }
@keyframes wxPanel { from { opacity: 0; translate: 0 48px; scale: .95; } }

:root { --cx-a: #ffc14a; --cx-b: #a78bfa; }
.cx { position: fixed; inset: 0; z-index: 200; pointer-events: none; contain: strict; }
.cx canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.cx-dot { display: none; }
.cx-dot, .cx-pulse { position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0; transition: opacity .15s ease; will-change: transform; }
.cx.is-on .cx-dot, .cx-pulse { opacity: 1; }
.cx.is-out .cx-dot, .cx.is-text .cx-dot, .cx.is-hot .cx-dot, .cx.is-hot .cx-pulse { opacity: 0; transition: none; }
.cx-dot { filter: drop-shadow(0 0 1px #0b0820) drop-shadow(0 0 1px #0b0820) drop-shadow(0 1px 3px rgba(11, 8, 32, .8)); }
.cx-dot::before, .cx-dot::after { content: ""; position: absolute; }
.cx-dot::before {
  left: -16px; top: -16px; width: 32px; height: 32px; border-radius: 50%;
  border: 1.5px solid #ffd27a;
  box-shadow: 0 0 0 2px rgba(7, 5, 28, .55), 0 0 14px rgba(255, 193, 74, .5), inset 0 0 10px rgba(255, 193, 74, .25);
  opacity: 0; scale: .4;
  transition: scale .16s cubic-bezier(.2, .9, .3, 1.2), opacity .12s ease;
}
.cx-dot::after {
  left: -9px; top: -9px; width: 18px; height: 18px;
  background: radial-gradient(circle, #fff 0 30%, #fff3cf 42%, var(--cx-a) 78%);
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
  transition: scale .18s cubic-bezier(.2, .9, .3, 1.3), rotate .3s ease;
}
.cx.is-hot .cx-dot::before { opacity: 1; scale: 1; }
.cx.is-hot .cx-dot::after { scale: .85; }
.cx.is-down .cx-dot::after { scale: .7; }
.cx.is-down.is-hot .cx-dot::before { scale: .82; }
.cx-pulse::before {
  content: ""; position: absolute; left: -16px; top: -16px; width: 32px; height: 32px; opacity: 0;
  background: radial-gradient(circle, #fff 0 10%, var(--cx-a) 40%, transparent 72%);
  clip-path: polygon(50% 0, 56% 44%, 100% 50%, 56% 56%, 50% 100%, 44% 56%, 0 50%, 44% 44%);
}
.cx-pulse.is-go::before { animation: cxPulse .45s cubic-bezier(.2, .8, .3, 1); }
@keyframes cxPulse { from { opacity: 1; scale: .3; rotate: 0deg; } to { opacity: 0; scale: 1.5; rotate: 90deg; } }

@media (prefers-reduced-motion: reduce) {
  .cx-pulse.is-go::before { animation: none; }
  .wx-marquee-track, .sky-glow, .wx-chip, .wx-horizon i, .wx-horizon::before, .wx-cta-fx i, .plan.is-best::after, .steps li:not(:last-child)::after, .step-ico::after { animation: none !important; }
  .sky-stars { scale: none; transition: none; }
  .wx-tab-ink { transition: none; }
}